diff --git a/iframe.html b/iframe.html
index 34a74fa533..aa6fb9b86e 100644
--- a/iframe.html
+++ b/iframe.html
@@ -135,4 +135,4 @@
             
         
             
-              window['FEATURES'] = {"postcss":true};</script><script src="runtime~main.c950fcde.iframe.bundle.js"></script><script src="vendors~main.8a3b4a63.iframe.bundle.js"></script><script src="main.1cf0bfe1.iframe.bundle.js"></script></body></html>
\ No newline at end of file
+              window['FEATURES'] = {"postcss":true};</script><script src="runtime~main.c950fcde.iframe.bundle.js"></script><script src="vendors~main.8a3b4a63.iframe.bundle.js"></script><script src="main.1c7b681f.iframe.bundle.js"></script></body></html>
\ No newline at end of file
diff --git a/main.1cf0bfe1.iframe.bundle.js b/main.1c7b681f.iframe.bundle.js
similarity index 99%
rename from main.1cf0bfe1.iframe.bundle.js
rename to main.1c7b681f.iframe.bundle.js
index d5466f14ea..04563b5c1f 100644
--- a/main.1cf0bfe1.iframe.bundle.js
+++ b/main.1c7b681f.iframe.bundle.js
@@ -4384,6 +4384,8 @@ var canvas_1 = __webpack_require__(/*! ./renderer/canvas */ "../packages/charts/
 
 var can_display_chart_titles_1 = __webpack_require__(/*! ./selectors/can_display_chart_titles */ "../packages/charts/src/chart_types/bullet_graph/selectors/can_display_chart_titles.ts");
 
+var get_debug_state_1 = __webpack_require__(/*! ./selectors/get_debug_state */ "../packages/charts/src/chart_types/bullet_graph/selectors/get_debug_state.ts");
+
 var get_tooltip_anchor_1 = __webpack_require__(/*! ./selectors/get_tooltip_anchor */ "../packages/charts/src/chart_types/bullet_graph/selectors/get_tooltip_anchor.ts");
 
 var get_tooltip_info_1 = __webpack_require__(/*! ./selectors/get_tooltip_info */ "../packages/charts/src/chart_types/bullet_graph/selectors/get_tooltip_info.ts");
@@ -4410,7 +4412,7 @@ var BulletState = /*#__PURE__*/function () {
     this.chartType = chart_types_1.ChartType.Bullet;
 
     this.getChartTypeDescription = function () {
-      return 'Bullet Graph';
+      return 'Bullet chart';
     };
 
     this.chartRenderer = function (containerRef, forwardStageRef) {
@@ -4477,8 +4479,8 @@ var BulletState = /*#__PURE__*/function () {
       return null;
     };
 
-    this.getDebugState = function () {
-      return {};
+    this.getDebugState = function (state) {
+      return (0, get_debug_state_1.getDebugStateSelector)(state);
     };
   }
 
@@ -4843,6 +4845,8 @@ var color_library_wrappers_1 = __webpack_require__(/*! ../../../../common/color_
 
 var colors_1 = __webpack_require__(/*! ../../../../common/colors */ "../packages/charts/src/common/colors.tsx");
 
+var accessibility_1 = __webpack_require__(/*! ../../../../components/accessibility */ "../packages/charts/src/components/accessibility/index.ts");
+
 var aligned_grid_1 = __webpack_require__(/*! ../../../../components/grid/aligned_grid */ "../packages/charts/src/components/grid/aligned_grid.tsx");
 
 var specs_1 = __webpack_require__(/*! ../../../../specs */ "../packages/charts/src/specs/index.ts");
@@ -4975,7 +4979,7 @@ var Component = /*#__PURE__*/function (_react_1$default$Comp) {
         style: size,
         // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role
         role: "presentation"
-      }), dimensions.shouldRenderMetric && react_1["default"].createElement("div", {
+      }, react_1["default"].createElement(accessibility_1.ScreenReaderSummary, null)), dimensions.shouldRenderMetric && react_1["default"].createElement("div", {
         className: "echBulletAsMetric",
         style: {
           width: '100%',
@@ -6166,6 +6170,78 @@ exports.getChartSize = (0, create_selector_1.createCustomCachedSelector)([getPar
 
 /***/ }),
 
+/***/ "../packages/charts/src/chart_types/bullet_graph/selectors/get_debug_state.ts":
+/*!************************************************************************************!*\
+  !*** ../packages/charts/src/chart_types/bullet_graph/selectors/get_debug_state.ts ***!
+  \************************************************************************************/
+/*! no static exports found */
+/*! all exports used */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+/*
+ * 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.
+ */
+
+__webpack_require__(/*! ../node_modules/core-js/modules/es.object.define-property.js */ "../node_modules/core-js/modules/es.object.define-property.js");
+
+__webpack_require__(/*! ../node_modules/core-js/modules/es.array.map.js */ "../node_modules/core-js/modules/es.array.map.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getDebugStateSelector = void 0;
+
+var get_active_value_1 = __webpack_require__(/*! ./get_active_value */ "../packages/charts/src/chart_types/bullet_graph/selectors/get_active_value.ts");
+
+var get_bullet_spec_1 = __webpack_require__(/*! ./get_bullet_spec */ "../packages/charts/src/chart_types/bullet_graph/selectors/get_bullet_spec.ts");
+
+var get_panel_dimensions_1 = __webpack_require__(/*! ./get_panel_dimensions */ "../packages/charts/src/chart_types/bullet_graph/selectors/get_panel_dimensions.ts");
+
+var create_selector_1 = __webpack_require__(/*! ../../../state/create_selector */ "../packages/charts/src/state/create_selector.ts");
+/** @internal */
+
+
+exports.getDebugStateSelector = (0, create_selector_1.createCustomCachedSelector)([get_panel_dimensions_1.getPanelDimensions, get_active_value_1.getActiveValue, get_bullet_spec_1.getBulletSpec], function (dimensions, activeValue, spec) {
+  return {
+    bullet: {
+      rows: dimensions.rows.map(function (row) {
+        return row.map(function (d) {
+          if (!d) return d;
+          var datum = d.datum,
+              colorBands = d.colorBands,
+              ticks = d.ticks,
+              domain = d.domain;
+          var title = datum.title,
+              subtitle = datum.subtitle,
+              target = datum.target,
+              value = datum.value;
+          return {
+            title: title,
+            subtitle: subtitle,
+            target: target,
+            value: value,
+            subtype: spec.subtype,
+            colorBands: colorBands.map(function (b) {
+              return b.color;
+            }),
+            ticks: ticks,
+            domain: domain
+          };
+        });
+      }),
+      activeValue: activeValue === null || activeValue === void 0 ? void 0 : activeValue.value
+    }
+  };
+});
+
+/***/ }),
+
 /***/ "../packages/charts/src/chart_types/bullet_graph/selectors/get_layout.ts":
 /*!*******************************************************************************!*\
   !*** ../packages/charts/src/chart_types/bullet_graph/selectors/get_layout.ts ***!
@@ -6552,6 +6628,7 @@ function getSubtypeDimensions(_ref3, graphSize, _ref4, _ref5, backgroundColor) {
 
         return {
           scale: scale,
+          domain: scale.domain(),
           ticks: ticks,
           colorBands: colorBands,
           colorScale: colorScale
@@ -6576,6 +6653,7 @@ function getSubtypeDimensions(_ref3, graphSize, _ref4, _ref5, backgroundColor) {
 
         return {
           scale: _scale,
+          domain: _scale.domain(),
           ticks: _ticks,
           colorBands: _colorBands,
           colorScale: _colorScale
@@ -6600,6 +6678,7 @@ function getSubtypeDimensions(_ref3, graphSize, _ref4, _ref5, backgroundColor) {
 
         return {
           scale: _scale2,
+          domain: _scale2.domain(),
           ticks: _ticks2,
           colorBands: _colorBands2,
           colorScale: _colorScale2
@@ -65533,9 +65612,9 @@ var __exportStar = this && this.__exportStar || function (m, exports) {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.CategoryLabel = exports.CategoryKey = exports.LegendPathElement = exports.LegendPath = exports.BandedAccessorType = exports.GeometryValue = exports.ComponentWithAnnotationDatum = exports.CustomAnnotationTooltip = exports.AnnotationTooltipFormatter = exports.FilledValues = exports.DataSeriesDatum = exports.XYChartSeriesIdentifier = exports.SeriesKey = exports.SeriesIdentifier = exports.SeriesCompareFn = exports.niceTimeFormatByDay = exports.niceTimeFormatter = exports.timeFormatter = exports.Margins = exports.PerSideDistance = exports.Padding = exports.SimplePadding = exports.Dimensions = exports.Range = exports.GenericDomain = exports.OrdinalDomain = exports.ContinuousDomain = exports.CurveType = exports.toEntries = exports.PointerValue = exports.DebugStateLegendItem = exports.DebugStateBase = exports.DebugStateAxis = exports.DebugStateLineConfig = exports.DebugStateLegend = exports.DebugStateBar = exports.DebugStateAxes = exports.DebugStateArea = exports.DebugStateAnnotations = exports.DebugStateValue = exports.DebugStateLine = exports.DebugState = exports.AnnotationId = exports.AxisId = exports.GroupId = exports.SpecId = exports.ChartSizeObject = exports.ChartSizeArray = exports.ChartSize = exports.ChartType = void 0;
-exports.DataGenerator = exports.LayoutDirection = exports.ValueFormatter = exports.ValueAccessor = exports.ShowAccessor = exports.LabelAccessor = exports.ColorVariant = exports.IsUnknown = exports.IsAny = exports.NonAny = exports.RecursivePartial = exports.HorizontalAlignment = exports.VerticalAlignment = exports.Rotation = exports.Rendering = exports.Position = exports.Datum = exports.HeatmapHighlightedData = exports.HeatmapProps = exports.HeatmapBandsColorScale = exports.ColorBand = exports.HeatmapCellDatum = exports.Cell = exports.AnimKeyframe = exports.WordcloudViewModel = exports.LEGACY_DARK_THEME = exports.LEGACY_LIGHT_THEME = exports.DARK_BASE_COLORS = exports.LIGHT_BASE_COLORS = exports.DARK_THEME = exports.LIGHT_THEME = exports.AnimationSpeed = exports.AnimatedValue = exports.AnimationOptions = exports.LogScaleOptions = exports.ScaleBandType = exports.ScaleOrdinalType = exports.ScaleContinuousType = exports.ScaleType = exports.AccessorArrayIndex = exports.AccessorObjectKey = exports.UnaryAccessorFn = exports.IndexedAccessorFn = exports.AccessorFn = exports.Accessor = exports.PartitionLayout = exports.PartitionStyle = exports.PartitionFillLabel = exports.PartitionProps = exports.PartitionLayer = void 0;
-exports.BulletColorConfig = exports.ColorBandComplexConfig = exports.ColorBandSimpleConfig = exports.ColorBandConfig = exports.ColorBandValue = exports.LegacyAnimationConfig = exports.TimeFunction = exports.computeRatioByGroups = exports.GroupByKeyFn = exports.GroupKeysOrKeyFn = exports.roundDateToESInterval = exports.SmallMultiplesDatum = exports.Predicate = exports.RgbaTuple = exports.A = exports.RGB = exports.Color = exports.FONT_STYLES = exports.FontStyle = exports.AdditiveNumber = exports.TimeMs = exports.Ratio = exports.Pixels = exports.LegendStrategy = exports.defaultPartitionValueFormatter = exports.MODEL_KEY = void 0;
+exports.LegendPathElement = exports.LegendPath = exports.BandedAccessorType = exports.GeometryValue = exports.ComponentWithAnnotationDatum = exports.CustomAnnotationTooltip = exports.AnnotationTooltipFormatter = exports.FilledValues = exports.DataSeriesDatum = exports.XYChartSeriesIdentifier = exports.SeriesKey = exports.SeriesIdentifier = exports.SeriesCompareFn = exports.niceTimeFormatByDay = exports.niceTimeFormatter = exports.timeFormatter = exports.Margins = exports.PerSideDistance = exports.Padding = exports.SimplePadding = exports.Dimensions = exports.Range = exports.GenericDomain = exports.OrdinalDomain = exports.ContinuousDomain = exports.CurveType = exports.toEntries = exports.PointerValue = exports.BulletDebugStateRow = exports.BulletDebugState = exports.DebugStateLegendItem = exports.DebugStateBase = exports.DebugStateAxis = exports.DebugStateLineConfig = exports.DebugStateLegend = exports.DebugStateBar = exports.DebugStateAxes = exports.DebugStateArea = exports.DebugStateAnnotations = exports.DebugStateValue = exports.DebugStateLine = exports.DebugState = exports.AnnotationId = exports.AxisId = exports.GroupId = exports.SpecId = exports.ChartSizeObject = exports.ChartSizeArray = exports.ChartSize = exports.ChartType = void 0;
+exports.ValueFormatter = exports.ValueAccessor = exports.ShowAccessor = exports.LabelAccessor = exports.ColorVariant = exports.IsUnknown = exports.IsAny = exports.NonAny = exports.RecursivePartial = exports.HorizontalAlignment = exports.VerticalAlignment = exports.Rotation = exports.Rendering = exports.Position = exports.Datum = exports.HeatmapHighlightedData = exports.HeatmapProps = exports.HeatmapBandsColorScale = exports.ColorBand = exports.HeatmapCellDatum = exports.Cell = exports.AnimKeyframe = exports.WordcloudViewModel = exports.LEGACY_DARK_THEME = exports.LEGACY_LIGHT_THEME = exports.DARK_BASE_COLORS = exports.LIGHT_BASE_COLORS = exports.DARK_THEME = exports.LIGHT_THEME = exports.AnimationSpeed = exports.AnimatedValue = exports.AnimationOptions = exports.LogScaleOptions = exports.ScaleBandType = exports.ScaleOrdinalType = exports.ScaleContinuousType = exports.ScaleType = exports.AccessorArrayIndex = exports.AccessorObjectKey = exports.UnaryAccessorFn = exports.IndexedAccessorFn = exports.AccessorFn = exports.Accessor = exports.PartitionLayout = exports.PartitionStyle = exports.PartitionFillLabel = exports.PartitionProps = exports.PartitionLayer = exports.CategoryLabel = exports.CategoryKey = void 0;
+exports.BulletColorConfig = exports.ColorBandComplexConfig = exports.ColorBandSimpleConfig = exports.ColorBandConfig = exports.ColorBandValue = exports.LegacyAnimationConfig = exports.TimeFunction = exports.computeRatioByGroups = exports.GroupByKeyFn = exports.GroupKeysOrKeyFn = exports.roundDateToESInterval = exports.SmallMultiplesDatum = exports.Predicate = exports.RgbaTuple = exports.A = exports.RGB = exports.Color = exports.FONT_STYLES = exports.FontStyle = exports.AdditiveNumber = exports.TimeMs = exports.Ratio = exports.Pixels = exports.LegendStrategy = exports.defaultPartitionValueFormatter = exports.MODEL_KEY = exports.DataGenerator = exports.LayoutDirection = void 0;
 
 __exportStar(__webpack_require__(/*! ./components */ "../packages/charts/src/components/index.ts"), exports);
 
@@ -65672,6 +65751,18 @@ Object.defineProperty(exports, "DebugStateLegendItem", {
     return types_1.DebugStateLegendItem;
   }
 });
+Object.defineProperty(exports, "BulletDebugState", {
+  enumerable: true,
+  get: function get() {
+    return types_1.BulletDebugState;
+  }
+});
+Object.defineProperty(exports, "BulletDebugStateRow", {
+  enumerable: true,
+  get: function get() {
+    return types_1.BulletDebugStateRow;
+  }
+});
 Object.defineProperty(exports, "PointerValue", {
   enumerable: true,
   get: function get() {
@@ -111379,25 +111470,25 @@ exports.Example = void 0;
 // @ts-nocheck
 // @ts-ignore
 
-var __STORY__ = "/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { text, number, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const bulletTitle = text('title', 'Error rate', 'General');\n  const subtitle = text('subtitle', '', 'General');\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\n  const format = text('format (numeraljs)', '0.[0]', 'General');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\n\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\n  const tickStrategy = customKnobs.multiSelect(\n    'tick strategy',\n    {\n      Auto: 'auto',\n      TickCount: 'count',\n      TickPlacements: 'placements',\n    },\n    'auto',\n    'select',\n    'Ticks',\n  );\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\n  const tickPlacements = customKnobs.numbersArray(\n    'ticks(placements)',\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\n    undefined,\n    'Ticks',\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\n      <Bullet\n        id=\"bullet\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: bulletTitle,\n              subtitle,\n              domain: [start, end],\n              niceDomain,\n              ticks:\n                tickStrategy[0] === 'count'\n                  ? ticks\n                  : tickStrategy[0] === 'placements'\n                    ? () => tickPlacements\n                    : undefined,\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 500,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n"; // @ts-ignore
+var __STORY__ = "/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { text, number, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { customKnobs } from '../utils/knobs';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('Enable debug state', false);\n  const bulletTitle = text('title', 'Error rate', 'General');\n  const subtitle = text('subtitle', '', 'General');\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\n  const format = text('format (numeraljs)', '0.[0]', 'General');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\n\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\n  const tickStrategy = customKnobs.multiSelect(\n    'tick strategy',\n    {\n      Auto: 'auto',\n      TickCount: 'count',\n      TickPlacements: 'placements',\n    },\n    'auto',\n    'select',\n    'Ticks',\n  );\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\n  const tickPlacements = customKnobs.numbersArray(\n    'ticks(placements)',\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\n    undefined,\n    'Ticks',\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        baseTheme={useBaseTheme()}\n      />\n      <Bullet\n        id=\"bullet\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: bulletTitle,\n              subtitle,\n              domain: [start, end],\n              niceDomain,\n              ticks:\n                tickStrategy[0] === 'count'\n                  ? ticks\n                  : tickStrategy[0] === 'placements'\n                    ? () => tickPlacements\n                    : undefined,\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 500,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n"; // @ts-ignore
 
 var __LOCATIONS_MAP__ = {
   "Example": {
     "startLoc": {
       "col": 36,
-      "line": 20
+      "line": 21
     },
     "endLoc": {
       "col": 1,
-      "line": 81
+      "line": 88
     },
     "startBody": {
       "col": 36,
-      "line": 20
+      "line": 21
     },
     "endBody": {
       "col": 1,
-      "line": 81
+      "line": 88
     }
   }
 };
@@ -111419,6 +111510,8 @@ var charts_1 = __webpack_require__(/*! @elastic/charts */ "../packages/charts/sr
 
 var use_base_theme_1 = __webpack_require__(/*! ../../use_base_theme */ "./use_base_theme.ts");
 
+var debug_state_logger_1 = __webpack_require__(/*! ../utils/debug_state_logger */ "./stories/utils/debug_state_logger.ts");
+
 var knobs_1 = __webpack_require__(/*! ../utils/knobs */ "./stories/utils/knobs/index.ts");
 
 var utils_1 = __webpack_require__(/*! ../utils/knobs/utils */ "./stories/utils/knobs/utils.ts");
@@ -111427,6 +111520,7 @@ var Example = function Example(_, _ref) {
   var title = _ref.title,
       description = _ref.description;
   var debug = (0, addon_knobs_1["boolean"])('debug', false);
+  var debugState = (0, addon_knobs_1["boolean"])('Enable debug state', false);
   var bulletTitle = (0, addon_knobs_1.text)('title', 'Error rate', 'General');
   var subtitle = (0, addon_knobs_1.text)('subtitle', '', 'General');
   var value = (0, addon_knobs_1.number)('value', 56, {
@@ -111474,6 +111568,8 @@ var Example = function Example(_, _ref) {
     description: description
   }, react_1["default"].createElement(charts_1.Settings, {
     debug: debug,
+    onRenderChange: (0, debug_state_logger_1.getDebugStateLogger)(debugState),
+    debugState: debugState,
     baseTheme: (0, use_base_theme_1.useBaseTheme)()
   }), react_1["default"].createElement(charts_1.Bullet, {
     id: "bullet",
@@ -111505,7 +111601,7 @@ exports.Example.parameters = {
 };
 exports.Example.parameters = Object.assign({
   storySource: {
-    source: "(_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const bulletTitle = text('title', 'Error rate', 'General');\n  const subtitle = text('subtitle', '', 'General');\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\n  const format = text('format (numeraljs)', '0.[0]', 'General');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\n\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\n  const tickStrategy = customKnobs.multiSelect(\n    'tick strategy',\n    {\n      Auto: 'auto',\n      TickCount: 'count',\n      TickPlacements: 'placements',\n    },\n    'auto',\n    'select',\n    'Ticks',\n  );\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\n  const tickPlacements = customKnobs.numbersArray(\n    'ticks(placements)',\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\n    undefined,\n    'Ticks',\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\n      <Bullet\n        id=\"bullet\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: bulletTitle,\n              subtitle,\n              domain: [start, end],\n              niceDomain,\n              ticks:\n                tickStrategy[0] === 'count'\n                  ? ticks\n                  : tickStrategy[0] === 'placements'\n                    ? () => tickPlacements\n                    : undefined,\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n}"
+    source: "(_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('Enable debug state', false);\n  const bulletTitle = text('title', 'Error rate', 'General');\n  const subtitle = text('subtitle', '', 'General');\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\n  const format = text('format (numeraljs)', '0.[0]', 'General');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\n\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\n  const tickStrategy = customKnobs.multiSelect(\n    'tick strategy',\n    {\n      Auto: 'auto',\n      TickCount: 'count',\n      TickPlacements: 'placements',\n    },\n    'auto',\n    'select',\n    'Ticks',\n  );\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\n  const tickPlacements = customKnobs.numbersArray(\n    'ticks(placements)',\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\n    undefined,\n    'Ticks',\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        baseTheme={useBaseTheme()}\n      />\n      <Bullet\n        id=\"bullet\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: bulletTitle,\n              subtitle,\n              domain: [start, end],\n              niceDomain,\n              ticks:\n                tickStrategy[0] === 'count'\n                  ? ticks\n                  : tickStrategy[0] === 'placements'\n                    ? () => tickPlacements\n                    : undefined,\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n}"
   }
 }, exports.Example.parameters);
 
@@ -112266,25 +112362,25 @@ exports.Example = void 0;
 // @ts-nocheck
 // @ts-ignore
 
-var __STORY__ = "/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings, Tooltip } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const hideTooltip = boolean('hide tooltip', false);\n  const syncCursor = boolean('sync cursor', false);\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\n  const valueFormat = text('valueFormat', '0');\n  const targetFormat = text('targetFormat', '');\n  const tickFormat = text('tickFormat', '0[.]00');\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\n\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        tickSnapStep={tickSnapStep}\n        data={[\n          [\n            {\n              target: 10,\n              value: 23,\n              title: 'Network inbound error rate',\n              // subtitle: 'First row first column subtitle',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 67,\n              value: 123,\n              title: 'Network outbound',\n              subtitle: 'error rate (%)',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n          [\n            {\n              target: 50,\n              value: 11,\n              title: 'Number of requests',\n              subtitle: 'Requests per second',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 80,\n              value: 92,\n              title: 'Second row second column title',\n              subtitle: 'percentage',\n              syncCursor,\n              domain: [0, 200],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can apply different formatter for ticks and values using\n      different formats for \\`tickFormatter\\` and \\`valueFormatter\\`.\n\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\n  resize: {\n    width: 550,\n    height: 640,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n"; // @ts-ignore
+var __STORY__ = "/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings, Tooltip } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('Enable debug state', false);\n  const hideTooltip = boolean('hide tooltip', false);\n  const syncCursor = boolean('sync cursor', false);\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\n  const valueFormat = text('valueFormat', '0');\n  const targetFormat = text('targetFormat', '');\n  const tickFormat = text('tickFormat', '0[.]00');\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\n\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        baseTheme={useBaseTheme()}\n      />\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        tickSnapStep={tickSnapStep}\n        data={[\n          [\n            {\n              target: 10,\n              value: 23,\n              title: 'Network inbound error rate',\n              // subtitle: 'First row first column subtitle',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 67,\n              value: 123,\n              title: 'Network outbound',\n              subtitle: 'error rate (%)',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n          [\n            {\n              target: 50,\n              value: 11,\n              title: 'Number of requests',\n              subtitle: 'Requests per second',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 80,\n              value: 92,\n              title: 'Second row second column title',\n              subtitle: 'percentage',\n              syncCursor,\n              domain: [0, 200],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can apply different formatter for ticks and values using\n      different formats for \\`tickFormatter\\` and \\`valueFormatter\\`.\n\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\n  resize: {\n    width: 550,\n    height: 640,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n"; // @ts-ignore
 
 var __LOCATIONS_MAP__ = {
   "Example": {
     "startLoc": {
       "col": 36,
-      "line": 19
+      "line": 20
     },
     "endLoc": {
       "col": 1,
-      "line": 94
+      "line": 101
     },
     "startBody": {
       "col": 36,
-      "line": 19
+      "line": 20
     },
     "endBody": {
       "col": 1,
-      "line": 94
+      "line": 101
     }
   }
 };
@@ -112306,12 +112402,15 @@ var charts_1 = __webpack_require__(/*! @elastic/charts */ "../packages/charts/sr
 
 var use_base_theme_1 = __webpack_require__(/*! ../../use_base_theme */ "./use_base_theme.ts");
 
+var debug_state_logger_1 = __webpack_require__(/*! ../utils/debug_state_logger */ "./stories/utils/debug_state_logger.ts");
+
 var utils_1 = __webpack_require__(/*! ../utils/knobs/utils */ "./stories/utils/knobs/utils.ts");
 
 var Example = function Example(_, _ref) {
   var title = _ref.title,
       description = _ref.description;
   var debug = (0, addon_knobs_1["boolean"])('debug', false);
+  var debugState = (0, addon_knobs_1["boolean"])('Enable debug state', false);
   var hideTooltip = (0, addon_knobs_1["boolean"])('hide tooltip', false);
   var syncCursor = (0, addon_knobs_1["boolean"])('sync cursor', false);
   var tickSnapStep = (0, addon_knobs_1.number)('active tick step', 1, {
@@ -112339,8 +112438,10 @@ var Example = function Example(_, _ref) {
     title: title,
     description: description
   }, react_1["default"].createElement(charts_1.Settings, {
-    baseTheme: (0, use_base_theme_1.useBaseTheme)(),
-    debug: debug
+    debug: debug,
+    onRenderChange: (0, debug_state_logger_1.getDebugStateLogger)(debugState),
+    debugState: debugState,
+    baseTheme: (0, use_base_theme_1.useBaseTheme)()
   }), react_1["default"].createElement(charts_1.Tooltip, {
     type: hideTooltip ? 'none' : undefined
   }), react_1["default"].createElement(charts_1.Bullet, {
@@ -112403,7 +112504,7 @@ exports.Example.parameters = {
 };
 exports.Example.parameters = Object.assign({
   storySource: {
-    source: "(_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const hideTooltip = boolean('hide tooltip', false);\n  const syncCursor = boolean('sync cursor', false);\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\n  const valueFormat = text('valueFormat', '0');\n  const targetFormat = text('targetFormat', '');\n  const tickFormat = text('tickFormat', '0[.]00');\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\n\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        tickSnapStep={tickSnapStep}\n        data={[\n          [\n            {\n              target: 10,\n              value: 23,\n              title: 'Network inbound error rate',\n              // subtitle: 'First row first column subtitle',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 67,\n              value: 123,\n              title: 'Network outbound',\n              subtitle: 'error rate (%)',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n          [\n            {\n              target: 50,\n              value: 11,\n              title: 'Number of requests',\n              subtitle: 'Requests per second',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 80,\n              value: 92,\n              title: 'Second row second column title',\n              subtitle: 'percentage',\n              syncCursor,\n              domain: [0, 200],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n}"
+    source: "(_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('Enable debug state', false);\n  const hideTooltip = boolean('hide tooltip', false);\n  const syncCursor = boolean('sync cursor', false);\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\n  const valueFormat = text('valueFormat', '0');\n  const targetFormat = text('targetFormat', '');\n  const tickFormat = text('tickFormat', '0[.]00');\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\n\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        baseTheme={useBaseTheme()}\n      />\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        tickSnapStep={tickSnapStep}\n        data={[\n          [\n            {\n              target: 10,\n              value: 23,\n              title: 'Network inbound error rate',\n              // subtitle: 'First row first column subtitle',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 67,\n              value: 123,\n              title: 'Network outbound',\n              subtitle: 'error rate (%)',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n          [\n            {\n              target: 50,\n              value: 11,\n              title: 'Number of requests',\n              subtitle: 'Requests per second',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 80,\n              value: 92,\n              title: 'Second row second column title',\n              subtitle: 'percentage',\n              syncCursor,\n              domain: [0, 200],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n}"
   }
 }, exports.Example.parameters);
 
@@ -121862,25 +121963,25 @@ exports.Example = void 0;
 // @ts-nocheck
 // @ts-ignore
 
-var __STORY__ = "/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number, color, array, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { Color } from '../../../packages/charts/src/common/colors';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\n  const bands = array('bands', ['200', '250', '300']).map(Number);\n\n  const opacityMap: { [k: string]: number } = {\n    '200': 0.2,\n    '250': 0.12,\n    '300': 0.05,\n  };\n\n  const useColors = boolean('use custom band colors', false, 'colors');\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\n    const defaultValue = opacityMap[band] ?? 0;\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\n    return acc;\n  }, {});\n\n  const getBandFillColor = getBandFillColorFn(colorMap);\n\n  const angleStart =\n    number('angleStart (n * π/8)', 8, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n  const angleEnd =\n    number('angleEnd (n * π/8)', 0, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={base}\n        target={target}\n        actual={actual}\n        bands={bands}\n        ticks={ticks}\n        domain={{ min: 0, max: 300 }}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={useColors ? getBandFillColor : undefined}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor={() => `$${actual}k USD`}\n        centralMinor=\"\"\n        angleStart={angleStart}\n        angleEnd={angleEnd}\n        tooltipValueFormatter={(d) => `$${d}k USD`}\n      />\n    </Chart>\n  );\n};\n"; // @ts-ignore
+var __STORY__ = "/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number, color, array, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { Color } from '../../../packages/charts/src/common/colors';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debugState = boolean('Enable debug state', false);\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\n  const bands = array('bands', ['200', '250', '300']).map(Number);\n\n  const opacityMap: { [k: string]: number } = {\n    '200': 0.2,\n    '250': 0.12,\n    '300': 0.05,\n  };\n\n  const useColors = boolean('use custom band colors', false, 'colors');\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\n    const defaultValue = opacityMap[band] ?? 0;\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\n    return acc;\n  }, {});\n\n  const getBandFillColor = getBandFillColorFn(colorMap);\n\n  const angleStart =\n    number('angleStart (n * π/8)', 8, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n  const angleEnd =\n    number('angleEnd (n * π/8)', 0, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} onRenderChange={getDebugStateLogger(debugState)} debugState={debugState} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={base}\n        target={target}\n        actual={actual}\n        bands={bands}\n        ticks={ticks}\n        domain={{ min: 0, max: 300 }}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={useColors ? getBandFillColor : undefined}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor={() => `$${actual}k USD`}\n        centralMinor=\"\"\n        angleStart={angleStart}\n        angleEnd={angleEnd}\n        tooltipValueFormatter={(d) => `$${d}k USD`}\n      />\n    </Chart>\n  );\n};\n"; // @ts-ignore
 
 var __LOCATIONS_MAP__ = {
   "Example": {
     "startLoc": {
       "col": 36,
-      "line": 23
+      "line": 24
     },
     "endLoc": {
       "col": 1,
-      "line": 84
+      "line": 86
     },
     "startBody": {
       "col": 36,
-      "line": 23
+      "line": 24
     },
     "endBody": {
       "col": 1,
-      "line": 84
+      "line": 86
     }
   }
 };
@@ -121902,6 +122003,8 @@ var constants_1 = __webpack_require__(/*! @elastic/charts/src/chart_types/goal_c
 
 var use_base_theme_1 = __webpack_require__(/*! ../../use_base_theme */ "./use_base_theme.ts");
 
+var debug_state_logger_1 = __webpack_require__(/*! ../utils/debug_state_logger */ "./stories/utils/debug_state_logger.ts");
+
 var utils_1 = __webpack_require__(/*! ../utils/utils */ "./stories/utils/utils.ts");
 
 var subtype = constants_1.GoalSubtype.Goal;
@@ -121909,6 +122012,7 @@ var subtype = constants_1.GoalSubtype.Goal;
 var Example = function Example(_, _ref) {
   var title = _ref.title,
       description = _ref.description;
+  var debugState = (0, addon_knobs_1["boolean"])('Enable debug state', false);
   var base = (0, addon_knobs_1.number)('base', 0, {
     range: true,
     min: 0,
@@ -121957,7 +122061,9 @@ var Example = function Example(_, _ref) {
     title: title,
     description: description
   }, react_1["default"].createElement(charts_1.Settings, {
-    baseTheme: (0, use_base_theme_1.useBaseTheme)()
+    baseTheme: (0, use_base_theme_1.useBaseTheme)(),
+    onRenderChange: (0, debug_state_logger_1.getDebugStateLogger)(debugState),
+    debugState: debugState
   }), react_1["default"].createElement(charts_1.Goal, {
     id: "spec_1",
     subtype: subtype,
@@ -121992,7 +122098,7 @@ var Example = function Example(_, _ref) {
 exports.Example = Example;
 exports.Example.parameters = Object.assign({
   storySource: {
-    source: "(_, { title, description }) => {\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\n  const bands = array('bands', ['200', '250', '300']).map(Number);\n\n  const opacityMap: { [k: string]: number } = {\n    '200': 0.2,\n    '250': 0.12,\n    '300': 0.05,\n  };\n\n  const useColors = boolean('use custom band colors', false, 'colors');\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\n    const defaultValue = opacityMap[band] ?? 0;\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\n    return acc;\n  }, {});\n\n  const getBandFillColor = getBandFillColorFn(colorMap);\n\n  const angleStart =\n    number('angleStart (n * π/8)', 8, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n  const angleEnd =\n    number('angleEnd (n * π/8)', 0, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={base}\n        target={target}\n        actual={actual}\n        bands={bands}\n        ticks={ticks}\n        domain={{ min: 0, max: 300 }}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={useColors ? getBandFillColor : undefined}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor={() => `$${actual}k USD`}\n        centralMinor=\"\"\n        angleStart={angleStart}\n        angleEnd={angleEnd}\n        tooltipValueFormatter={(d) => `$${d}k USD`}\n      />\n    </Chart>\n  );\n}"
+    source: "(_, { title, description }) => {\n  const debugState = boolean('Enable debug state', false);\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\n  const bands = array('bands', ['200', '250', '300']).map(Number);\n\n  const opacityMap: { [k: string]: number } = {\n    '200': 0.2,\n    '250': 0.12,\n    '300': 0.05,\n  };\n\n  const useColors = boolean('use custom band colors', false, 'colors');\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\n    const defaultValue = opacityMap[band] ?? 0;\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\n    return acc;\n  }, {});\n\n  const getBandFillColor = getBandFillColorFn(colorMap);\n\n  const angleStart =\n    number('angleStart (n * π/8)', 8, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n  const angleEnd =\n    number('angleEnd (n * π/8)', 0, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} onRenderChange={getDebugStateLogger(debugState)} debugState={debugState} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={base}\n        target={target}\n        actual={actual}\n        bands={bands}\n        ticks={ticks}\n        domain={{ min: 0, max: 300 }}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={useColors ? getBandFillColor : undefined}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor={() => `$${actual}k USD`}\n        centralMinor=\"\"\n        angleStart={angleStart}\n        angleEnd={angleEnd}\n        tooltipValueFormatter={(d) => `$${d}k USD`}\n      />\n    </Chart>\n  );\n}"
   }
 }, exports.Example.parameters);
 
@@ -162793,4 +162899,4 @@ module.exports = __webpack_require__(/*! /app/storybook/generated-stories-entry.
 /***/ })
 
 },[[0,"runtime~main","vendors~main"]]]);
-//# sourceMappingURL=main.1cf0bfe1.iframe.bundle.js.map
\ No newline at end of file
+//# sourceMappingURL=main.1c7b681f.iframe.bundle.js.map
\ No newline at end of file
diff --git a/main.1cf0bfe1.iframe.bundle.js.map b/main.1c7b681f.iframe.bundle.js.map
similarity index 50%
rename from main.1cf0bfe1.iframe.bundle.js.map
rename to main.1c7b681f.iframe.bundle.js.map
index b31372632f..1df797ddbe 100644
--- a/main.1cf0bfe1.iframe.bundle.js.map
+++ b/main.1c7b681f.iframe.bundle.js.map
@@ -1 +1 @@
-{"version":3,"file":"main.1cf0bfe1.iframe.bundle.js","sources":["webpack:///../node_modules/@elastic/eui/es/components/icon/assets lazy ^\\.\\/.*$ namespace object","webpack:///./stories/components/tooltip/tooltip_showcase.scss","webpack:///./stories/metric/3_body.scss","webpack:///./style.scss","webpack:///../node_modules/moment/locale sync ^\\.\\/.*$","webpack:///../packages/charts/src/chart_types/bullet_graph/chart_state.tsx","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/bullet.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/constants.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/index.tsx","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/sub_types/angular.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/sub_types/horizontal.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/sub_types/index.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/sub_types/vertical.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/can_display_chart_titles.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_active_value.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_active_values.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_bullet_spec.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_chart_size.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_layout.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_panel_dimensions.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_tooltip_anchor.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_tooltip_info.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/has_chart_titles.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/spec.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/theme.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/utils/angular.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/utils/color.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/utils/ticks.ts","webpack:///../packages/charts/src/chart_types/flame_chart/flame_api.ts","webpack:///../packages/charts/src/chart_types/flame_chart/flame_chart.tsx","webpack:///../packages/charts/src/chart_types/flame_chart/internal_chart_state.ts","webpack:///../packages/charts/src/chart_types/flame_chart/navigation.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/common.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/draw_a_frame.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/draw_canvas.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/draw_webgl.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/ensure_webgl.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/upload_to_webgl.ts","webpack:///../packages/charts/src/chart_types/flame_chart/shaders.ts","webpack:///../packages/charts/src/chart_types/flame_chart/types.ts","webpack:///../packages/charts/src/chart_types/goal_chart/layout/types/viewmodel_types.ts","webpack:///../packages/charts/src/chart_types/goal_chart/layout/viewmodel/geoms.ts","webpack:///../packages/charts/src/chart_types/goal_chart/layout/viewmodel/utils.ts","webpack:///../packages/charts/src/chart_types/goal_chart/layout/viewmodel/viewmodel.ts","webpack:///../packages/charts/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts","webpack:///../packages/charts/src/chart_types/goal_chart/renderer/canvas/connected_component.tsx","webpack:///../packages/charts/src/chart_types/goal_chart/specs/constants.ts","webpack:///../packages/charts/src/chart_types/goal_chart/specs/index.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/geometries.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/get_chart_type_description.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/get_goal_chart_data.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/get_goal_spec.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/on_element_click_caller.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/on_element_out_caller.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/on_element_over_caller.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/picked_shapes.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/scenegraph.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/tooltip.ts","webpack:///../packages/charts/src/chart_types/heatmap/layout/types/viewmodel_types.ts","webpack:///../packages/charts/src/chart_types/heatmap/layout/viewmodel/scenegraph.ts","webpack:///../packages/charts/src/chart_types/heatmap/layout/viewmodel/viewmodel.ts","webpack:///../packages/charts/src/chart_types/heatmap/renderer/canvas/canvas_renderers.ts","webpack:///../packages/charts/src/chart_types/heatmap/renderer/canvas/connected_component.tsx","webpack:///../packages/charts/src/chart_types/heatmap/renderer/canvas/utils.ts","webpack:///../packages/charts/src/chart_types/heatmap/renderer/dom/cursor_band.tsx","webpack:///../packages/charts/src/chart_types/heatmap/renderer/dom/highlighter.tsx","webpack:///../packages/charts/src/chart_types/heatmap/renderer/dom/highlighter_brush.tsx","webpack:///../packages/charts/src/chart_types/heatmap/scales/band_color_scale.ts","webpack:///../packages/charts/src/chart_types/heatmap/specs/heatmap.ts","webpack:///../packages/charts/src/chart_types/heatmap/specs/index.ts","webpack:///../packages/charts/src/chart_types/heatmap/specs/scale_defaults.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/compute_axes_sizes.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/compute_chart_dimensions.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/compute_chart_element_sizes.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/compute_legend.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_brush_area.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_brushed_highlighted_shapes.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_color_scale.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_cursor_band.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_cursor_pointer.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_debug_state.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_heatmap_container_size.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_heatmap_spec.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_heatmap_table.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_highlighted_area.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_highlighted_legend_bands.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_highlighted_legend_item.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_legend_items_labels.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_per_panel_heatmap_geometries.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_picked_cells.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_tooltip_anchor.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/is_brush_available.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/is_empty.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_brush_end_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_element_click_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_element_out_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_element_over_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_pointer_update_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/picked_shapes.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/tooltip.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/utils/axis.ts","webpack:///../packages/charts/src/chart_types/index.ts","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/index.tsx","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/metric.tsx","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/progress.tsx","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/sparkline.tsx","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/text.tsx","webpack:///../packages/charts/src/chart_types/metric/specs/index.ts","webpack:///../packages/charts/src/chart_types/metric/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/metric/state/selectors/can_display_chart_titles.ts","webpack:///../packages/charts/src/chart_types/metric/state/selectors/chart_size.ts","webpack:///../packages/charts/src/chart_types/metric/state/selectors/data.ts","webpack:///../packages/charts/src/chart_types/metric/state/selectors/has_chart_titles.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/config.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/types/config_types.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/types/viewmodel_types.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/circline_geometry.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/group_by_rollup.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/highlighted_geoms.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/legend_labels.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/sunburst.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/treemap.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/waffle.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/picked_shapes.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/scenegraph.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/canvas/canvas_linear_renderers.ts","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/canvas/canvas_renderers.ts","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/canvas/canvas_wrapped_renderers.ts","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/canvas/partition.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/dom/highlighter.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/dom/highlighter_hover.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/dom/highlighter_legend.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/dom/layered_partition_chart.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/specs/index.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/compute_legend.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/drilldown_active.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/geometries.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_chart_type_description.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_cursor_pointer.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_debug_state.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_highlighted_shapes.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_legend_items_extra.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_partition_specs.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_screen_reader_data.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/on_element_click_caller.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/on_element_out_caller.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/on_element_over_caller.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/partition_spec.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/picked_shapes.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/tooltip.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/tree.ts","webpack:///../packages/charts/src/chart_types/specs.ts","webpack:///../packages/charts/src/chart_types/timeslip/internal_chart_state.ts","webpack:///../packages/charts/src/chart_types/timeslip/projections/axis_model.ts","webpack:///../packages/charts/src/chart_types/timeslip/projections/domain_tween.ts","webpack:///../packages/charts/src/chart_types/timeslip/projections/scale.ts","webpack:///../packages/charts/src/chart_types/timeslip/projections/zoom_pan.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/config.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/data.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/data_fetch.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/annotations/chart_title.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/annotations/time_extent.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/annotations/time_unit.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/cartesian.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/column.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/glyphs/bar.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/glyphs/boxplot.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/glyphs/debug_box.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/raster.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/timeslip_render.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip_api.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip_chart.tsx","webpack:///../packages/charts/src/chart_types/timeslip/utils/animation.ts","webpack:///../packages/charts/src/chart_types/timeslip/utils/dom.ts","webpack:///../packages/charts/src/chart_types/timeslip/utils/math.ts","webpack:///../packages/charts/src/chart_types/timeslip/utils/multitouch.ts","webpack:///../packages/charts/src/chart_types/wordcloud/layout/types/viewmodel_types.ts","webpack:///../packages/charts/src/chart_types/wordcloud/layout/viewmodel/viewmodel.ts","webpack:///../packages/charts/src/chart_types/wordcloud/renderer/svg/connected_component.tsx","webpack:///../packages/charts/src/chart_types/wordcloud/specs/index.ts","webpack:///../packages/charts/src/chart_types/wordcloud/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/wordcloud/state/selectors/geometries.ts","webpack:///../packages/charts/src/chart_types/wordcloud/state/selectors/scenegraph.ts","webpack:///../packages/charts/src/chart_types/wordcloud/state/selectors/wordcloud_spec.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/line/dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/rect/dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/rect/tooltip.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/tooltip.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/types.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/axes_sizes.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/chrono/cached_chrono.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/chrono/chrono.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/chrono/chrono_luxon/chrono_luxon.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/continuous_time_rasters.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/multilayer_ticks.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/numerical_rasters.ts","webpack:///../packages/charts/src/chart_types/xy_chart/crosshair/crosshair_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/domains/x_domain.ts","webpack:///../packages/charts/src/chart_types/xy_chart/domains/y_domain.ts","webpack:///../packages/charts/src/chart_types/xy_chart/legend/legend.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/animations/animation.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/animations/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/annotations/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/annotations/lines.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/annotations/rect.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/areas.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/axes/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/axes/line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/axes/tick.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/axes/tick_label.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/bars.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/bubbles.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/grids.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/lines.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/panel_clipping.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/panels/panels.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/panels/title.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/points.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/path.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/rect.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/shapes.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/text.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/renderers.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/styles/area.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/styles/bar.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/styles/line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/utils/debug.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/utils/has_mostly_rtl.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/utils/panel_transform.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/values/bar.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/xy_chart.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/common/utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/annotation_tooltip.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/annotations.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/line_marker.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/tooltip_content.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/cursor_band.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/cursor_crossline.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/cursor_line.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/highlighter.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/shapes_paths.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/area.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/bars.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/bubble.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/line_area_style.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/point_style.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/points.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/scales/get_api_scales.ts","webpack:///../packages/charts/src/chart_types/xy_chart/scales/scale_defaults.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/area_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/axis.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/bar_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/bubble_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/histogram_bar_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/line_annotation.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/line_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/rect_annotation.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/axis_tick_formatter.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_annotations.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_axes_geometries.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_axis_ticks_dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_chart_dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_chart_transform.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_legend.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_per_panel_axes_geoms.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_series_domains.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_series_geometries.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/count_bars_in_cluster.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_annotation_tooltip_state.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_api_scale_configs.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_axis_styles.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_bar_paddings.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_brush_area.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_chart_type_description.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_computed_scales.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_cursor_band.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_cursor_line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_cursor_pointer.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_debug_state.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_elements_at_cursor_pos.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_geometries_index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_geometries_index_keys.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_grid_lines.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_highlighted_annotation_ids_selector.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_highlighted_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_legend_item_extra_values.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_legend_items_labels.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_multiple_rectangle_annotations.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_oriented_projected_pointer_position.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_projected_pointer_position.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_projected_scaled_values.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_series_color_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_si_dataseries_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_specs.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_tooltip_anchor_position.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_tooltip_values_highlighted_geoms.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/has_single_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_annotation_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_brush_available.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_chart_empty.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_histogram_mode_enabled.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_tooltip_snap_enabled.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/merge_y_custom_domains.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_brush_end_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_click_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_element_out_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_element_over_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_pointer_move_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_projection_area_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/visible_ticks.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/utils/common.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/utils/get_last_value.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/utils/spec.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/utils/utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/tooltip/tooltip.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/axis_type_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/axis_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/default_series_sort_fn.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/diverging_offsets.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/fill_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/fit_function.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/fit_function_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/get_linear_ticks.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/grid_lines.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/group_data_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/indexed_geometry_linear_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/indexed_geometry_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/indexed_geometry_spatial_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/interactions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/scales.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/specs.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/stacked_series_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/texture.ts","webpack:///../packages/charts/src/common/animation.ts","webpack:///../packages/charts/src/common/apca_color_contrast.ts","webpack:///../packages/charts/src/common/category.ts","webpack:///../packages/charts/src/common/color_calcs.ts","webpack:///../packages/charts/src/common/color_library_wrappers.ts","webpack:///../packages/charts/src/common/colors.tsx","webpack:///../packages/charts/src/common/config_objects.ts","webpack:///../packages/charts/src/common/constants.ts","webpack:///../packages/charts/src/common/data_structures.ts","webpack:///../packages/charts/src/common/default_theme_attributes.ts","webpack:///../packages/charts/src/common/event_handler_selectors.ts","webpack:///../packages/charts/src/common/fill_text_color.ts","webpack:///../packages/charts/src/common/geometry.ts","webpack:///../packages/charts/src/common/iterables.ts","webpack:///../packages/charts/src/common/kingly.ts","webpack:///../packages/charts/src/common/math.ts","webpack:///../packages/charts/src/common/panel_utils.ts","webpack:///../packages/charts/src/common/predicate.ts","webpack:///../packages/charts/src/common/series_id.ts","webpack:///../packages/charts/src/common/text_utils.ts","webpack:///../packages/charts/src/common/vectors.ts","webpack:///../packages/charts/src/common/wcag2_color_contrast.ts","webpack:///../packages/charts/src/common/webgl_constants.ts","webpack:///../packages/charts/src/components/accessibility/description.tsx","webpack:///../packages/charts/src/components/accessibility/goal_semantic_description.tsx","webpack:///../packages/charts/src/components/accessibility/index.ts","webpack:///../packages/charts/src/components/accessibility/label.tsx","webpack:///../packages/charts/src/components/accessibility/partitions_data_table.tsx","webpack:///../packages/charts/src/components/accessibility/screen_reader_summary.tsx","webpack:///../packages/charts/src/components/accessibility/types.tsx","webpack:///../packages/charts/src/components/brush/brush.tsx","webpack:///../packages/charts/src/components/chart.tsx","webpack:///../packages/charts/src/components/chart_background.tsx","webpack:///../packages/charts/src/components/chart_container.tsx","webpack:///../packages/charts/src/components/chart_resizer.tsx","webpack:///../packages/charts/src/components/chart_status.tsx","webpack:///../packages/charts/src/components/error_boundary/error_boundary.tsx","webpack:///../packages/charts/src/components/error_boundary/errors.ts","webpack:///../packages/charts/src/components/error_boundary/index.tsx","webpack:///../packages/charts/src/components/grid/aligned_grid.tsx","webpack:///../packages/charts/src/components/icons/assets/alert.tsx","webpack:///../packages/charts/src/components/icons/assets/dot.tsx","webpack:///../packages/charts/src/components/icons/assets/down_arrow.tsx","webpack:///../packages/charts/src/components/icons/assets/empty.tsx","webpack:///../packages/charts/src/components/icons/assets/eye.tsx","webpack:///../packages/charts/src/components/icons/assets/eye_closed.tsx","webpack:///../packages/charts/src/components/icons/assets/list.tsx","webpack:///../packages/charts/src/components/icons/assets/question_in_circle.tsx","webpack:///../packages/charts/src/components/icons/icon.tsx","webpack:///../packages/charts/src/components/index.ts","webpack:///../packages/charts/src/components/legend/color.tsx","webpack:///../packages/charts/src/components/legend/custom_legend.tsx","webpack:///../packages/charts/src/components/legend/extra.tsx","webpack:///../packages/charts/src/components/legend/label.tsx","webpack:///../packages/charts/src/components/legend/legend.tsx","webpack:///../packages/charts/src/components/legend/legend_icon.tsx","webpack:///../packages/charts/src/components/legend/legend_item.tsx","webpack:///../packages/charts/src/components/legend/position_style.ts","webpack:///../packages/charts/src/components/legend/style_utils.ts","webpack:///../packages/charts/src/components/legend/utils.ts","webpack:///../packages/charts/src/components/no_results.tsx","webpack:///../packages/charts/src/components/portal/index.ts","webpack:///../packages/charts/src/components/portal/tooltip_portal.tsx","webpack:///../packages/charts/src/components/portal/types.ts","webpack:///../packages/charts/src/components/portal/utils.ts","webpack:///../packages/charts/src/components/tooltip/components/index.ts","webpack:///../packages/charts/src/components/tooltip/components/tooltip_actions.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_container.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_divider.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_footer.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_header.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_metric_row.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_prompt.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_provider.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_body.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_cell.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_color_cell.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_footer.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_header.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_row.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_wrapper.tsx","webpack:///../packages/charts/src/components/tooltip/components/types.ts","webpack:///../packages/charts/src/components/tooltip/index.ts","webpack:///../packages/charts/src/components/tooltip/placement.ts","webpack:///../packages/charts/src/components/tooltip/tooltip.tsx","webpack:///../packages/charts/src/components/tooltip/types.ts","webpack:///../packages/charts/src/geoms/path.ts","webpack:///../packages/charts/src/index.ts","webpack:///../packages/charts/src/mocks/hierarchical/dimension_codes.ts","webpack:///../packages/charts/src/mocks/hierarchical/index.ts","webpack:///../packages/charts/src/mocks/hierarchical/many_pie.ts","webpack:///../packages/charts/src/mocks/hierarchical/mini_sunburst.ts","webpack:///../packages/charts/src/mocks/hierarchical/observability_tree.ts","webpack:///../packages/charts/src/mocks/hierarchical/palettes.ts","webpack:///../packages/charts/src/mocks/hierarchical/pie.ts","webpack:///../packages/charts/src/mocks/hierarchical/sunburst.ts","webpack:///../packages/charts/src/mocks/utils.ts","webpack:///../packages/charts/src/renderers/canvas/index.ts","webpack:///../packages/charts/src/scales/constants.ts","webpack:///../packages/charts/src/scales/index.ts","webpack:///../packages/charts/src/scales/scale_band.ts","webpack:///../packages/charts/src/scales/scale_continuous.ts","webpack:///../packages/charts/src/scales/types.ts","webpack:///../packages/charts/src/solvers/monotonic_hill_climb.ts","webpack:///../packages/charts/src/solvers/screenspace_marker_scale_compressor.ts","webpack:///../packages/charts/src/specs/constants.ts","webpack:///../packages/charts/src/specs/group_by.ts","webpack:///../packages/charts/src/specs/index.ts","webpack:///../packages/charts/src/specs/settings.tsx","webpack:///../packages/charts/src/specs/small_multiples.ts","webpack:///../packages/charts/src/specs/specs_parser.tsx","webpack:///../packages/charts/src/specs/tooltip.ts","webpack:///../packages/charts/src/state/actions/chart.ts","webpack:///../packages/charts/src/state/actions/chart_settings.ts","webpack:///../packages/charts/src/state/actions/colors.ts","webpack:///../packages/charts/src/state/actions/dom_element.ts","webpack:///../packages/charts/src/state/actions/events.ts","webpack:///../packages/charts/src/state/actions/key.ts","webpack:///../packages/charts/src/state/actions/legend.ts","webpack:///../packages/charts/src/state/actions/mouse.ts","webpack:///../packages/charts/src/state/actions/specs.ts","webpack:///../packages/charts/src/state/actions/tooltip.ts","webpack:///../packages/charts/src/state/actions/z_index.ts","webpack:///../packages/charts/src/state/chart_state.ts","webpack:///../packages/charts/src/state/create_selector.ts","webpack:///../packages/charts/src/state/reducers/interactions.ts","webpack:///../packages/charts/src/state/selectors/can_pin_tooltip.ts","webpack:///../packages/charts/src/state/selectors/compute_panels.ts","webpack:///../packages/charts/src/state/selectors/compute_small_multiple_scales.ts","webpack:///../packages/charts/src/state/selectors/get_accessibility_config.ts","webpack:///../packages/charts/src/state/selectors/get_active_pointer_position.ts","webpack:///../packages/charts/src/state/selectors/get_chart_container_dimensions.ts","webpack:///../packages/charts/src/state/selectors/get_chart_id.ts","webpack:///../packages/charts/src/state/selectors/get_chart_rotation.ts","webpack:///../packages/charts/src/state/selectors/get_chart_theme.ts","webpack:///../packages/charts/src/state/selectors/get_chart_type_components.ts","webpack:///../packages/charts/src/state/selectors/get_chart_type_description.ts","webpack:///../packages/charts/src/state/selectors/get_debug_state.ts","webpack:///../packages/charts/src/state/selectors/get_deselected_data_series.ts","webpack:///../packages/charts/src/state/selectors/get_internal_brush_area.ts","webpack:///../packages/charts/src/state/selectors/get_internal_cursor_pointer.ts","webpack:///../packages/charts/src/state/selectors/get_internal_is_brushing.ts","webpack:///../packages/charts/src/state/selectors/get_internal_is_brushing_available.ts","webpack:///../packages/charts/src/state/selectors/get_internal_is_intialized.ts","webpack:///../packages/charts/src/state/selectors/get_internal_is_tooltip_visible.ts","webpack:///../packages/charts/src/state/selectors/get_internal_main_projection_area.ts","webpack:///../packages/charts/src/state/selectors/get_internal_projection_container_area.ts","webpack:///../packages/charts/src/state/selectors/get_internal_sm_domains.ts","webpack:///../packages/charts/src/state/selectors/get_internal_tooltip_anchor_position.ts","webpack:///../packages/charts/src/state/selectors/get_internal_tooltip_info.ts","webpack:///../packages/charts/src/state/selectors/get_last_click.ts","webpack:///../packages/charts/src/state/selectors/get_last_drag.ts","webpack:///../packages/charts/src/state/selectors/get_legend_config_selector.ts","webpack:///../packages/charts/src/state/selectors/get_legend_items.ts","webpack:///../packages/charts/src/state/selectors/get_legend_items_labels.ts","webpack:///../packages/charts/src/state/selectors/get_legend_items_values.ts","webpack:///../packages/charts/src/state/selectors/get_legend_size.ts","webpack:///../packages/charts/src/state/selectors/get_pointer_value.ts","webpack:///../packages/charts/src/state/selectors/get_resolved_background_color.ts","webpack:///../packages/charts/src/state/selectors/get_settings_spec.ts","webpack:///../packages/charts/src/state/selectors/get_small_multiples_index_order.ts","webpack:///../packages/charts/src/state/selectors/get_small_multiples_spec.ts","webpack:///../packages/charts/src/state/selectors/get_specs.ts","webpack:///../packages/charts/src/state/selectors/get_specs_by_type.ts","webpack:///../packages/charts/src/state/selectors/get_tooltip_interaction_state.ts","webpack:///../packages/charts/src/state/selectors/get_tooltip_selected_items.ts","webpack:///../packages/charts/src/state/selectors/get_tooltip_settings.ts","webpack:///../packages/charts/src/state/selectors/get_tooltip_spec.ts","webpack:///../packages/charts/src/state/selectors/has_external_pointer_event.ts","webpack:///../packages/charts/src/state/selectors/is_brushing.ts","webpack:///../packages/charts/src/state/selectors/is_chart_empty.ts","webpack:///../packages/charts/src/state/selectors/is_external_tooltip_visible.ts","webpack:///../packages/charts/src/state/spec_factory.ts","webpack:///../packages/charts/src/state/types.ts","webpack:///../packages/charts/src/state/utils.ts","webpack:///../packages/charts/src/utils/accessor.ts","webpack:///../packages/charts/src/utils/bbox/canvas_text_bbox_calculator.ts","webpack:///../packages/charts/src/utils/chart_size.ts","webpack:///../packages/charts/src/utils/chrono/chrono.ts","webpack:///../packages/charts/src/utils/chrono/elasticsearch.ts","webpack:///../packages/charts/src/utils/chrono/moment.ts","webpack:///../packages/charts/src/utils/common.tsx","webpack:///../packages/charts/src/utils/curves.ts","webpack:///../packages/charts/src/utils/d3-delaunay/index.ts","webpack:///../packages/charts/src/utils/data/data_processing.ts","webpack:///../packages/charts/src/utils/data/date_time.ts","webpack:///../packages/charts/src/utils/data/formatters.ts","webpack:///../packages/charts/src/utils/data_generators/data_generator.ts","webpack:///../packages/charts/src/utils/data_generators/simple_noise.ts","webpack:///../packages/charts/src/utils/data_samples/babynames.ts","webpack:///../packages/charts/src/utils/data_samples/test_dataset.ts","webpack:///../packages/charts/src/utils/data_samples/test_dataset_heatmap.ts","webpack:///../packages/charts/src/utils/data_samples/test_dataset_kibana.ts","webpack:///../packages/charts/src/utils/data_samples/test_dataset_tsvb.ts","webpack:///../packages/charts/src/utils/debounce.ts","webpack:///../packages/charts/src/utils/dimensions.ts","webpack:///../packages/charts/src/utils/domain.ts","webpack:///../packages/charts/src/utils/events.ts","webpack:///../packages/charts/src/utils/fast_deep_equal.ts","webpack:///../packages/charts/src/utils/geometry.ts","webpack:///../packages/charts/src/utils/ids.ts","webpack:///../packages/charts/src/utils/legend.ts","webpack:///../packages/charts/src/utils/logger.ts","webpack:///../packages/charts/src/utils/point.ts","webpack:///../packages/charts/src/utils/series_sort.ts","webpack:///../packages/charts/src/utils/text/wrap.ts","webpack:///../packages/charts/src/utils/themes/base_colors.ts","webpack:///../packages/charts/src/utils/themes/colors.ts","webpack:///../packages/charts/src/utils/themes/dark_theme.ts","webpack:///../packages/charts/src/utils/themes/legacy_dark_theme.ts","webpack:///../packages/charts/src/utils/themes/legacy_light_theme.ts","webpack:///../packages/charts/src/utils/themes/light_theme.ts","webpack:///../packages/charts/src/utils/themes/merge_utils.ts","webpack:///../packages/charts/src/utils/themes/partition.ts","webpack:///../packages/charts/src/utils/themes/theme.ts","webpack:///../packages/charts/src/utils/themes/theme_common.ts","webpack:///../packages/charts/src/utils/time_functions.ts","webpack:///../packages/charts/src/utils/time_zone.ts","webpack:///../packages/charts/src/utils/use_legend_action.ts","webpack:///../public/fonts/atkinson-hyperlegible-v1-latin-700.woff","webpack:///../public/fonts/atkinson-hyperlegible-v1-latin-700.woff2","webpack:///../public/fonts/atkinson-hyperlegible-v1-latin-regular.woff","webpack:///../public/fonts/atkinson-hyperlegible-v1-latin-regular.woff2","webpack:///./generated-stories-entry.js","webpack:///./parameters.ts","webpack:///./preview.ts","webpack:///./preview.ts-generated-config-entry.js","webpack:///\\.)(","webpack:///./stories/annotations/lines/1_x_continuous.story.tsx","webpack:///./stories/annotations/lines/2_x_ordinal.story.tsx","webpack:///./stories/annotations/lines/3_x_time.story.tsx","webpack:///./stories/annotations/lines/4_y_domain.story.tsx","webpack:///./stories/annotations/lines/5_styling.story.tsx","webpack:///./stories/annotations/lines/6_test_single_bar_histogram.story.tsx","webpack:///./stories/annotations/lines/7_tooltip_options.story.tsx","webpack:///./stories/annotations/lines/8_advanced_markers.story.tsx","webpack:///./stories/annotations/lines/line.stories.tsx","webpack:///./stories/annotations/rects/1_linear_bar_chart.story.tsx","webpack:///./stories/annotations/rects/2_ordinal_bar_chart.story.tsx","webpack:///./stories/annotations/rects/3_linear_line_chart.story.tsx","webpack:///./stories/annotations/rects/4_styling.story.tsx","webpack:///./stories/annotations/rects/5_tooltip_options.story.tsx","webpack:///./stories/annotations/rects/6_zero_domain.story.tsx","webpack:///./stories/annotations/rects/7_with_group_id.story.tsx","webpack:///./stories/annotations/rects/8_outside.story.tsx","webpack:///./stories/annotations/rects/9_click_handler.story.tsx","webpack:///./stories/annotations/rects/rects.stories.tsx","webpack:///./stories/area/10_stacked_same_naming.story.tsx","webpack:///./stories/area/11_test_linear.story.tsx","webpack:///./stories/area/12_test_time.story.tsx","webpack:///./stories/area/13_band_area.story.tsx","webpack:///./stories/area/15_stacked_grouped.story.tsx","webpack:///./stories/area/16_test_stacked_with_missing.story.tsx","webpack:///./stories/area/17_negative.story.tsx","webpack:///./stories/area/18_negative_positive.story.tsx","webpack:///./stories/area/19_negative_band.story.tsx","webpack:///./stories/area/1_basic.story.tsx","webpack:///./stories/area/20_stepped_area.story.tsx","webpack:///./stories/area/21_with_time_timeslip.story.tsx","webpack:///./stories/area/2_with_time.story.tsx","webpack:///./stories/area/3_with_linear.story.tsx","webpack:///./stories/area/4_with_log.story.tsx","webpack:///./stories/area/5_with_4_axes.story.tsx","webpack:///./stories/area/6_with_axis_and_legend.story.tsx","webpack:///./stories/area/7_stacked.story.tsx","webpack:///./stories/area/8_stacked_percentage.story.tsx","webpack:///./stories/area/8_stacked_percentage_zeros.story.tsx","webpack:///./stories/area/9_stacked_separate_specs.story.tsx","webpack:///./stories/area/area.stories.tsx","webpack:///./stories/axes/10_one_domain_bound.story.tsx","webpack:///./stories/axes/11_fit_domain_extent.story.tsx","webpack:///./stories/axes/12_duplicate_ticks.story.tsx","webpack:///./stories/axes/13_label_formatting.story.tsx","webpack:///./stories/axes/14_duplicate_ticks_2.story.tsx","webpack:///./stories/axes/15_maximum_fraction_digits.story.tsx","webpack:///./stories/axes/1_basic.story.tsx","webpack:///./stories/axes/2_tick_label_rotation.story.tsx","webpack:///./stories/axes/3_axis_4_axes.story.tsx","webpack:///./stories/axes/4_multi_axis.story.tsx","webpack:///./stories/axes/5_multi_axis_bar_lines.story.tsx","webpack:///./stories/axes/6_different_tooltip.story.tsx","webpack:///./stories/axes/6a_different_tooltip_formatter.story.tsx","webpack:///./stories/axes/7_many_tick_labels.story.tsx","webpack:///./stories/axes/8_custom_domain.story.tsx","webpack:///./stories/axes/9_custom_mixed_domain.story.tsx","webpack:///./stories/axes/axes.stories.tsx","webpack:///./stories/bar/10_axis_and_legend.story.tsx","webpack:///./stories/bar/11_stacked_with_axis_and_legend.story.tsx","webpack:///./stories/bar/12_stacked_as_percentage.story.tsx","webpack:///./stories/bar/13_clustered.story.tsx","webpack:///./stories/bar/14_clustered_multiple.story.tsx","webpack:///./stories/bar/15_time_clustered.story.tsx","webpack:///./stories/bar/17_time_stacked.story.tsx","webpack:///./stories/bar/18_bar_chart_1y0g.story.tsx","webpack:///./stories/bar/19_bar_chart_1y1g.story.tsx","webpack:///./stories/bar/1_basic.story.tsx","webpack:///./stories/bar/20_bar_chart_1y2g.story.tsx","webpack:///./stories/bar/21_bar_chart_2y0g.story.tsx","webpack:///./stories/bar/22_barchart_2y1g.story.tsx","webpack:///./stories/bar/23_bar_chart_2y2g.story.tsx","webpack:///./stories/bar/24_tooltip_visibility.story.tsx","webpack:///./stories/bar/25_high_data_volume.story.tsx","webpack:///./stories/bar/26_single_data_linear.story.tsx","webpack:///./stories/bar/27_single_data_ordinal.story.tsx","webpack:///./stories/bar/28_single_data_clustered.story.tsx","webpack:///./stories/bar/29_single_data_stacked.story.tsx","webpack:///./stories/bar/2_label_value.story.tsx","webpack:///./stories/bar/30_stacked_to_extent.story.tsx","webpack:///./stories/bar/31_negative_and_positive_x_values.story.tsx","webpack:///./stories/bar/32_scale_to_extent.story.tsx","webpack:///./stories/bar/33_band_bar.story.tsx","webpack:///./stories/bar/34_test_linear.story.tsx","webpack:///./stories/bar/35_test_time.story.tsx","webpack:///./stories/bar/36_test_linear_clustered.story.tsx","webpack:///./stories/bar/37_test_time_clustered.story.tsx","webpack:///./stories/bar/38_test_clustered_null_bars.story.tsx","webpack:///./stories/bar/39_test_stacked_null.story.tsx","webpack:///./stories/bar/3_with_axis.story.tsx","webpack:///./stories/bar/40_test_switch.story.tsx","webpack:///./stories/bar/41_test_histogram_linear.story.tsx","webpack:///./stories/bar/42_test_histogram_ordinal.story.tsx","webpack:///./stories/bar/43_test_discover.story.tsx","webpack:///./stories/bar/44_test_single_histogram.story.tsx","webpack:///./stories/bar/45_min_height.story.tsx","webpack:///./stories/bar/46_test_min_height.story.tsx","webpack:///./stories/bar/47_stacked_only_grouped.story.tsx","webpack:///./stories/bar/48_test_tooltip.story.tsx","webpack:///./stories/bar/49_test_dual_axis.story.tsx","webpack:///./stories/bar/4_ordinal.story.tsx","webpack:///./stories/bar/50_order_bins_by_sum.story.tsx","webpack:///./stories/bar/51_label_value_advanced.story.tsx","webpack:///./stories/bar/52_multi_group_same_domain.story.tsx","webpack:///./stories/bar/53_use_domain_from_different_groupid.story.tsx","webpack:///./stories/bar/54_functional_accessors.story.tsx","webpack:///./stories/bar/55_tooltip_boundary.story.tsx","webpack:///./stories/bar/56_test_use_dfl_gdomain.story.tsx","webpack:///./stories/bar/57_test_rect_border_bars.story.tsx","webpack:///./stories/bar/58_data_values.story.tsx","webpack:///./stories/bar/5_linear.story.tsx","webpack:///./stories/bar/6_linear_no_linear_interval.story.tsx","webpack:///./stories/bar/7_with_time_xaxis.story.tsx","webpack:///./stories/bar/8_with_log_yaxis.story.tsx","webpack:///./stories/bar/9_with_stacked_log.story.tsx","webpack:///./stories/bar/bars.stories.tsx","webpack:///./stories/bubble/1_simple.story.tsx","webpack:///./stories/bubble/2_ordinal.story.tsx","webpack:///./stories/bubble/3_multiple.story.tsx","webpack:///./stories/bubble/4_mixed.story.tsx","webpack:///./stories/bubble/mixed.stories.tsx","webpack:///./stories/bullet_graph/1_single.story.tsx","webpack:///./stories/bullet_graph/2_angular.story.tsx","webpack:///./stories/bullet_graph/3_color_bands.story.tsx","webpack:///./stories/bullet_graph/4_single_row.story.tsx","webpack:///./stories/bullet_graph/5_single_column.story.tsx","webpack:///./stories/bullet_graph/6_grid.story.tsx","webpack:///./stories/bullet_graph/bullet_graph.stories.tsx","webpack:///./stories/components/tooltip/10_cartesian_chart.story.tsx","webpack:///./stories/components/tooltip/11_partition_chart.story.tsx","webpack:///./stories/components/tooltip/12_heatmap.story.tsx","webpack:///./stories/components/tooltip/13_flamegraph.story.tsx","webpack:///./stories/components/tooltip/1_composed_list.story.tsx","webpack:///./stories/components/tooltip/2_composed_table.story.tsx","webpack:///./stories/components/tooltip/3_tabular_data.story.tsx","webpack:///./stories/components/tooltip/4_actions_with_custom_tooltip.story.tsx","webpack:///./stories/components/tooltip/5_chart_tooltip.story.tsx","webpack:///./stories/components/tooltip/6_async_actions.story.tsx","webpack:///./stories/components/tooltip/data/index.ts","webpack:///./stories/components/tooltip/data/list.ts","webpack:///./stories/components/tooltip/data/series.ts","webpack:///./stories/components/tooltip/data/table.ts","webpack:///./stories/components/tooltip/tooltip.stories.tsx","webpack:///./stories/components/tooltip/tooltip_showcase.scss?f970","webpack:///./stories/components/tooltip/tooltip_showcase.tsx","webpack:///./stories/composable/1_basic.story.tsx","webpack:///./stories/composable/composable.stories.tsx","webpack:///./stories/debug/1_basic.story.tsx","webpack:///./stories/debug/2_debug_state.story.tsx","webpack:///./stories/debug/debug.stories.tsx","webpack:///./stories/goal/10_band_in_band.story.tsx","webpack:///./stories/goal/11_gaps.story.tsx","webpack:///./stories/goal/12_range.story.tsx","webpack:///./stories/goal/13_confidence_level.story.tsx","webpack:///./stories/goal/14_one_third.story.tsx","webpack:///./stories/goal/15_half_circle.story.tsx","webpack:///./stories/goal/16_two_thirds.story.tsx","webpack:///./stories/goal/17_three_quarters.story.tsx","webpack:///./stories/goal/17_total_circle.story.tsx","webpack:///./stories/goal/17_very_small_gap.story.tsx","webpack:///./stories/goal/18_side_gauge.story.tsx","webpack:///./stories/goal/18_side_gauge_inverted_angle_relation.story.tsx","webpack:///./stories/goal/19_horizontal_negative.story.tsx","webpack:///./stories/goal/20_vertical_negative.story.tsx","webpack:///./stories/goal/21_goal_negative.story.tsx","webpack:///./stories/goal/22_horizontal_plusminus.story.tsx","webpack:///./stories/goal/23_vertical_plusminus.story.tsx","webpack:///./stories/goal/24_goal_plusminus.story.tsx","webpack:///./stories/goal/25_goal_semantic.story.tsx","webpack:///./stories/goal/26_auto_linear_ticks.story.tsx","webpack:///./stories/goal/2_gauge_with_target.story.tsx","webpack:///./stories/goal/3_horizontal_bullet.story.tsx","webpack:///./stories/goal/4_vertical_bullet.story.tsx","webpack:///./stories/goal/5_minimal.story.tsx","webpack:///./stories/goal/6_minimal_horizontal.story.tsx","webpack:///./stories/goal/7_horizontal_bar.story.tsx","webpack:///./stories/goal/8_irregular_ticks.story.tsx","webpack:///./stories/goal/9_minimal_band.story.tsx","webpack:///./stories/goal/goal.stories.tsx","webpack:///./stories/grids/1_basic.story.tsx","webpack:///./stories/grids/2_multiple_axes.story.tsx","webpack:///./stories/grids/3_lines.story.tsx","webpack:///./stories/grids/grids.stories.tsx","webpack:///./stories/heatmap/1_basic.story.tsx","webpack:///./stories/heatmap/2_categorical.story.tsx","webpack:///./stories/heatmap/3_time.story.tsx","webpack:///./stories/heatmap/4_test_time_snap.story.tsx","webpack:///./stories/heatmap/5_theming.story.tsx","webpack:///./stories/heatmap/6_label_rotation.story.tsx","webpack:///./stories/heatmap/7_sorting.story.tsx","webpack:///./stories/heatmap/heatmap.stories.tsx","webpack:///./stories/icicle/01_unix_icicle.story.tsx","webpack:///./stories/icicle/02_unix_flame.story.tsx","webpack:///./stories/icicle/03_cpu_profile_flame.story.tsx","webpack:///./stories/icicle/04_cpu_profile_gl_flame.story.tsx","webpack:///./stories/icicle/icicle.stories.tsx","webpack:///./stories/interactions/10_brush_selection_bar.story.tsx","webpack:///./stories/interactions/10a_brush_selection_bar_hist.story.tsx","webpack:///./stories/interactions/11_brush_time.story.tsx","webpack:///./stories/interactions/12_brush_time_hist.story.tsx","webpack:///./stories/interactions/13_brush_disabled_ordinal.story.tsx","webpack:///./stories/interactions/14_crosshair_time.story.tsx","webpack:///./stories/interactions/15_render_change.story.tsx","webpack:///./stories/interactions/16_cursor_update_action.story.tsx","webpack:///./stories/interactions/17_png_export.story.tsx","webpack:///./stories/interactions/18_null_values.story.tsx","webpack:///./stories/interactions/19_multi_chart_cursor_sync.story.tsx","webpack:///./stories/interactions/1_bar_clicks.story.tsx","webpack:///./stories/interactions/2_area_point_clicks.story.tsx","webpack:///./stories/interactions/3_line_point_clicks.story.tsx","webpack:///./stories/interactions/4_line_area_bar_clicks.story.tsx","webpack:///./stories/interactions/4_sunburst_slice_clicks.story.tsx","webpack:///./stories/interactions/5_clicks_legend_items_bar.story.tsx","webpack:///./stories/interactions/6_clicks_legend_items_area.story.tsx","webpack:///./stories/interactions/7_clicks_legend_items_line.story.tsx","webpack:///./stories/interactions/8_clicks_legend_items_mixed.story.tsx","webpack:///./stories/interactions/9_brush_selection_linear.story.tsx","webpack:///./stories/interactions/9a_brush_selection_linear.story.tsx","webpack:///./stories/interactions/interactions.stories.tsx","webpack:///./stories/legend/10_sunburst.story.tsx","webpack:///./stories/legend/10_sunburst_repeated_label.story.tsx","webpack:///./stories/legend/11_legend_actions.story.tsx","webpack:///./stories/legend/12_legend_margins.story.tsx","webpack:///./stories/legend/13_inside_chart.story.tsx","webpack:///./stories/legend/14_single_series.story.tsx","webpack:///./stories/legend/15_legend_sort.story.tsx","webpack:///./stories/legend/16_custom_legend.story.tsx","webpack:///./stories/legend/1_legend_positioning.story.tsx","webpack:///./stories/legend/5_changing_specs.story.tsx","webpack:///./stories/legend/6_hide_legend.story.tsx","webpack:///./stories/legend/8_spacing_buffer.story.tsx","webpack:///./stories/legend/9_color_picker.story.tsx","webpack:///./stories/legend/legend.stories.tsx","webpack:///./stories/legend/legend_size_knob.ts","webpack:///./stories/line/10_test_path_ordering.story.tsx","webpack:///./stories/line/11_discontinuous_data_points.story.tsx","webpack:///./stories/line/12_isolated_data_points.story.tsx","webpack:///./stories/line/13_line_mark_accessor.story.tsx","webpack:///./stories/line/14_point_shapes.story.tsx","webpack:///./stories/line/15_test_negative_points.story.tsx","webpack:///./stories/line/1_basic.story.tsx","webpack:///./stories/line/2_w_axis.story.tsx","webpack:///./stories/line/3_ordinal.story.tsx","webpack:///./stories/line/4_linear.story.tsx","webpack:///./stories/line/5_w_axis_and_legend.story.tsx","webpack:///./stories/line/6_curved.story.tsx","webpack:///./stories/line/7_multiple.story.tsx","webpack:///./stories/line/8_stacked.story.tsx","webpack:///./stories/line/9_multi_series.story.tsx","webpack:///./stories/line/line.stories.tsx","webpack:///./stories/metric/1_basic.story.tsx","webpack:///./stories/metric/2_grid.story.tsx","webpack:///./stories/metric/3_body.scss?a9a3","webpack:///./stories/metric/3_body.story.tsx","webpack:///./stories/metric/metric.stories.tsx","webpack:///./stories/mixed/1_bars_and_lines.story.tsx","webpack:///./stories/mixed/2_lines_and_areas.story.tsx","webpack:///./stories/mixed/3_areas_and_bars.story.tsx","webpack:///./stories/mixed/4_test_bar.story.tsx","webpack:///./stories/mixed/5_test_bar_time.story.tsx","webpack:///./stories/mixed/6_fitting.story.tsx","webpack:///./stories/mixed/6_fitting_stacked.story.tsx","webpack:///./stories/mixed/7_marks.story.tsx","webpack:///./stories/mixed/8_polarized_stacked.story.tsx","webpack:///./stories/mixed/mixed.stories.tsx","webpack:///./stories/mosaic/10_mosaic_simple.story.tsx","webpack:///./stories/mosaic/20_mosaic_with_other.story.tsx","webpack:///./stories/mosaic/mosaic.stories.tsx","webpack:///./stories/rotations/1_ordinal.story.tsx","webpack:///./stories/rotations/2_negative_ordinal.story.tsx","webpack:///./stories/rotations/3_rotations_ordinal.story.tsx","webpack:///./stories/rotations/4_90_ordinal.story.tsx","webpack:///./stories/rotations/5_180_ordinal.story.tsx","webpack:///./stories/rotations/6_negative_linear.story.tsx","webpack:///./stories/rotations/7_rotations_linear.story.tsx","webpack:///./stories/rotations/8_90_deg_linear.story.tsx","webpack:///./stories/rotations/9_180_deg_linear.story.tsx","webpack:///./stories/rotations/rotations.stories.tsx","webpack:///./stories/scales/1_different_timezones.story.tsx","webpack:///./stories/scales/2_local_tooltip.story.tsx","webpack:///./stories/scales/3_utc_tooltip.story.tsx","webpack:///./stories/scales/4_specified_timezone.story.tsx","webpack:///./stories/scales/6_x_scale_fallback.story.tsx","webpack:///./stories/scales/7_log_scale_options.story.tsx","webpack:///./stories/scales/8_linear_binary.story.tsx","webpack:///./stories/scales/scales.stories.tsx","webpack:///./stories/small_multiples/2_vertical_areas.story.tsx","webpack:///./stories/small_multiples/3_grid_lines.story.tsx","webpack:///./stories/small_multiples/4_horizontal_bars.story.tsx","webpack:///./stories/small_multiples/4_vertical_bars.story.tsx","webpack:///./stories/small_multiples/5_histogram_bars.story.tsx","webpack:///./stories/small_multiples/6_heterogeneous_cartesians.story.tsx","webpack:///./stories/small_multiples/7_sunbursts.story.tsx","webpack:///./stories/small_multiples/8_sorting.story.tsx","webpack:///./stories/small_multiples/9_heatmap.story.tsx","webpack:///./stories/small_multiples/small_multiples.stories.tsx","webpack:///./stories/streamgraph/1_basic.story.tsx","webpack:///./stories/streamgraph/streamgraph.stories.tsx","webpack:///./stories/stylings/10_custom_bars.story.tsx","webpack:///./stories/stylings/11_custom_lines.story.tsx","webpack:///./stories/stylings/12_custom_area.story.tsx","webpack:///./stories/stylings/13_custom_series_name.story.tsx","webpack:///./stories/stylings/13_custom_series_name_config.story.tsx","webpack:///./stories/stylings/14_custom_series_name_formatting.story.tsx","webpack:///./stories/stylings/15_tick_label.story.tsx","webpack:///./stories/stylings/16_style_accessor.story.tsx","webpack:///./stories/stylings/17_bar_series_color_variant.story.tsx","webpack:///./stories/stylings/18_line_series_color_variant.story.tsx","webpack:///./stories/stylings/19_area_series_color_variant.story.tsx","webpack:///./stories/stylings/1_chart_size.story.tsx","webpack:///./stories/stylings/20_partition_background.story.tsx","webpack:///./stories/stylings/21_partition_labels.story.tsx","webpack:///./stories/stylings/22_dark_theme.story.tsx","webpack:///./stories/stylings/23_with_texture.story.tsx","webpack:///./stories/stylings/24_texture_multiple_series.story.tsx","webpack:///./stories/stylings/25_mixed_point_shapes.story.tsx","webpack:///./stories/stylings/26_highlighter_style.story.tsx","webpack:///./stories/stylings/2_margins.story.tsx","webpack:///./stories/stylings/3_axis.story.tsx","webpack:///./stories/stylings/4_theme_styling.story.tsx","webpack:///./stories/stylings/5_partial_custom_theme.story.tsx","webpack:///./stories/stylings/6_partial_and_base.story.tsx","webpack:///./stories/stylings/7_multiple_custom.story.tsx","webpack:///./stories/stylings/8_custom_series_colors_array.story.tsx","webpack:///./stories/stylings/9_custom_series_colors_function.story.tsx","webpack:///./stories/stylings/stylings.stories.tsx","webpack:///./stories/sunburst/10_2_slice.story.tsx","webpack:///./stories/sunburst/11_small_large.story.tsx","webpack:///./stories/sunburst/12_very_small.story.tsx","webpack:///./stories/sunburst/13_empty.story.tsx","webpack:///./stories/sunburst/14_full_zero.story.tsx","webpack:///./stories/sunburst/15_single.story.tsx","webpack:///./stories/sunburst/15_single_sunburst.story.tsx","webpack:///./stories/sunburst/16_single_small.story.tsx","webpack:///./stories/sunburst/17_single_very_small.story.tsx","webpack:///./stories/sunburst/18_no_sliced.story.tsx","webpack:///./stories/sunburst/19_negative.story.tsx","webpack:///./stories/sunburst/1_simple.story.tsx","webpack:///./stories/sunburst/20_total_zero.story.tsx","webpack:///./stories/sunburst/21_high_pie.story.tsx","webpack:///./stories/sunburst/22_counter_clockwise.story.tsx","webpack:///./stories/sunburst/23_clockwise.story.tsx","webpack:///./stories/sunburst/24_linked_label.story.tsx","webpack:///./stories/sunburst/25_no_labels.story.tsx","webpack:///./stories/sunburst/26_percentage.story.tsx","webpack:///./stories/sunburst/27_heterogeneous_depth.story.tsx","webpack:///./stories/sunburst/28_not_a_number.story.tsx","webpack:///./stories/sunburst/29_custom_stroke.story.tsx","webpack:///./stories/sunburst/2_value_formatted.story.tsx","webpack:///./stories/sunburst/30_largest_circle.story.tsx","webpack:///./stories/sunburst/31_bold_link_value.story.tsx","webpack:///./stories/sunburst/32_custom_tooltip.story.tsx","webpack:///./stories/sunburst/33_ordered_slices.story.tsx","webpack:///./stories/sunburst/3_value_formatted_2.story.tsx","webpack:///./stories/sunburst/4_fill_labels.story.tsx","webpack:///./stories/sunburst/5_donut.story.tsx","webpack:///./stories/sunburst/6_pie_chart_labels.story.tsx","webpack:///./stories/sunburst/6_pie_chart_linked_labels.story.tsx","webpack:///./stories/sunburst/7_zero_slice.story.tsx","webpack:///./stories/sunburst/8_sunburst_two_layers.story.tsx","webpack:///./stories/sunburst/9_sunburst_three_layers.story.tsx","webpack:///./stories/sunburst/sunburst.stories.tsx","webpack:///./stories/test_cases/10_highlighter_z_index.story.tsx","webpack:///./stories/test_cases/1_no_series.story.tsx","webpack:///./stories/test_cases/21_domain_edges.story.tsx","webpack:///./stories/test_cases/2_chrome_path_bug_fix.story.tsx","webpack:///./stories/test_cases/3_no_axes_annotation.story.tsx","webpack:///./stories/test_cases/4_filter_zero_values_log.story.tsx","webpack:///./stories/test_cases/5_legend_scroll_bar_sizing.story.tsx","webpack:///./stories/test_cases/6_a11y_custom_description.story.tsx","webpack:///./stories/test_cases/7_rtl_text.story.tsx","webpack:///./stories/test_cases/8_test_points_outside_of_domain.story.tsx","webpack:///./stories/test_cases/9_duplicate_labels_in_partition_legend.story.tsx","webpack:///./stories/test_cases/test_cases.stories.tsx","webpack:///./stories/timeslip/01_timeslip.story.tsx","webpack:///./stories/timeslip/timeslip.stories.tsx","webpack:///./stories/treemap/10_three_layers.story.tsx","webpack:///./stories/treemap/1_one_layer.story.tsx","webpack:///./stories/treemap/2_one_layer_2.story.tsx","webpack:///./stories/treemap/3_mid_two.story.tsx","webpack:///./stories/treemap/4_two_layer_stress.story.tsx","webpack:///./stories/treemap/5_multicolor.story.tsx","webpack:///./stories/treemap/6_custom_style.story.tsx","webpack:///./stories/treemap/7_percentage.story.tsx","webpack:///./stories/treemap/8_groove_text.story.tsx","webpack:///./stories/treemap/9_zero_values.story.tsx","webpack:///./stories/treemap/treemap.stories.tsx","webpack:///./stories/utils/components/get_color_picker.tsx","webpack:///./stories/utils/components/get_legend_action.tsx","webpack:///./stories/utils/datasets/product_profits.ts","webpack:///./stories/utils/debug_state_logger.ts","webpack:///./stories/utils/formatters.ts","webpack:///./stories/utils/hierarchical_input_utils.tsx","webpack:///./stories/utils/knobs/constants.ts","webpack:///./stories/utils/knobs/custom.ts","webpack:///./stories/utils/knobs/enums.ts","webpack:///./stories/utils/knobs/eui.ts","webpack:///./stories/utils/knobs/index.ts","webpack:///./stories/utils/knobs/special_enums.ts","webpack:///./stories/utils/knobs/utils.ts","webpack:///./stories/utils/storybook.ts","webpack:///./stories/utils/text/1_wrap.story.tsx","webpack:///./stories/utils/text/text.stories.tsx","webpack:///./stories/utils/use_heatmap_selection.ts","webpack:///./stories/utils/utils.ts","webpack:///./stories/waffle/1_simple.story.tsx","webpack:///./stories/waffle/2_test.story.tsx","webpack:///./stories/waffle/waffle.stories.tsx","webpack:///./stories/wordcloud/1_wordcloud.story.tsx","webpack:///./stories/wordcloud/wordcloud.stories.tsx","webpack:///./story_wrapper.tsx","webpack:///./storybook-init-framework-entry.js","webpack:///./style.scss?84a2","webpack:///./use_base_theme.ts","webpack:///./util.inspect (ignored)?f2f0","webpack:///./util.inspect (ignored)?a099","webpack:///./util.inspect (ignored)?328e","webpack:///./util.inspect (ignored)?b82f","webpack:///./util.inspect (ignored)?741a","webpack:///./util.inspect (ignored)?22e4","webpack:///./util.inspect (ignored)?a8cd","webpack:///./util.inspect (ignored)","webpack:///crypto (ignored)"],"sourcesContent":["var map = {\n\t\"./\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index.js\",\n\t\t\"icon.\"\n\t],\n\t\"./accessibility\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/accessibility.js\",\n\t\t\"icon.accessibility\"\n\t],\n\t\"./accessibility.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/accessibility.js\",\n\t\t\"icon.accessibility\"\n\t],\n\t\"./aggregate\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/aggregate.js\",\n\t\t\"icon.aggregate\"\n\t],\n\t\"./aggregate.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/aggregate.js\",\n\t\t\"icon.aggregate\"\n\t],\n\t\"./alert\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/alert.js\",\n\t\t\"icon.alert\"\n\t],\n\t\"./alert.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/alert.js\",\n\t\t\"icon.alert\"\n\t],\n\t\"./analyzeEvent\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/analyzeEvent.js\",\n\t\t\"icon.analyzeEvent\"\n\t],\n\t\"./analyzeEvent.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/analyzeEvent.js\",\n\t\t\"icon.analyzeEvent\"\n\t],\n\t\"./analyze_event\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/analyze_event.js\",\n\t\t\"icon.analyze_event\"\n\t],\n\t\"./analyze_event.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/analyze_event.js\",\n\t\t\"icon.analyze_event\"\n\t],\n\t\"./annotation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/annotation.js\",\n\t\t\"icon.annotation\"\n\t],\n\t\"./annotation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/annotation.js\",\n\t\t\"icon.annotation\"\n\t],\n\t\"./apm_trace\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/apm_trace.js\",\n\t\t\"icon.apm_trace\"\n\t],\n\t\"./apm_trace.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/apm_trace.js\",\n\t\t\"icon.apm_trace\"\n\t],\n\t\"./app_add_data\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_add_data.js\",\n\t\t\"icon.app_add_data\"\n\t],\n\t\"./app_add_data.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_add_data.js\",\n\t\t\"icon.app_add_data\"\n\t],\n\t\"./app_advanced_settings\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_advanced_settings.js\",\n\t\t\"icon.app_advanced_settings\"\n\t],\n\t\"./app_advanced_settings.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_advanced_settings.js\",\n\t\t\"icon.app_advanced_settings\"\n\t],\n\t\"./app_agent\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_agent.js\",\n\t\t\"icon.app_agent\"\n\t],\n\t\"./app_agent.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_agent.js\",\n\t\t\"icon.app_agent\"\n\t],\n\t\"./app_apm\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_apm.js\",\n\t\t\"icon.app_apm\"\n\t],\n\t\"./app_apm.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_apm.js\",\n\t\t\"icon.app_apm\"\n\t],\n\t\"./app_app_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_app_search.js\",\n\t\t\"icon.app_app_search\"\n\t],\n\t\"./app_app_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_app_search.js\",\n\t\t\"icon.app_app_search\"\n\t],\n\t\"./app_auditbeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_auditbeat.js\",\n\t\t\"icon.app_auditbeat\"\n\t],\n\t\"./app_auditbeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_auditbeat.js\",\n\t\t\"icon.app_auditbeat\"\n\t],\n\t\"./app_canvas\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_canvas.js\",\n\t\t\"icon.app_canvas\"\n\t],\n\t\"./app_canvas.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_canvas.js\",\n\t\t\"icon.app_canvas\"\n\t],\n\t\"./app_cases\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_cases.js\",\n\t\t\"icon.app_cases\"\n\t],\n\t\"./app_cases.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_cases.js\",\n\t\t\"icon.app_cases\"\n\t],\n\t\"./app_code\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_code.js\",\n\t\t\"icon.app_code\"\n\t],\n\t\"./app_code.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_code.js\",\n\t\t\"icon.app_code\"\n\t],\n\t\"./app_console\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_console.js\",\n\t\t\"icon.app_console\"\n\t],\n\t\"./app_console.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_console.js\",\n\t\t\"icon.app_console\"\n\t],\n\t\"./app_cross_cluster_replication\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_cross_cluster_replication.js\",\n\t\t\"icon.app_cross_cluster_replication\"\n\t],\n\t\"./app_cross_cluster_replication.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_cross_cluster_replication.js\",\n\t\t\"icon.app_cross_cluster_replication\"\n\t],\n\t\"./app_dashboard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_dashboard.js\",\n\t\t\"icon.app_dashboard\"\n\t],\n\t\"./app_dashboard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_dashboard.js\",\n\t\t\"icon.app_dashboard\"\n\t],\n\t\"./app_devtools\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_devtools.js\",\n\t\t\"icon.app_devtools\"\n\t],\n\t\"./app_devtools.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_devtools.js\",\n\t\t\"icon.app_devtools\"\n\t],\n\t\"./app_discover\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_discover.js\",\n\t\t\"icon.app_discover\"\n\t],\n\t\"./app_discover.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_discover.js\",\n\t\t\"icon.app_discover\"\n\t],\n\t\"./app_ems\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_ems.js\",\n\t\t\"icon.app_ems\"\n\t],\n\t\"./app_ems.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_ems.js\",\n\t\t\"icon.app_ems\"\n\t],\n\t\"./app_filebeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_filebeat.js\",\n\t\t\"icon.app_filebeat\"\n\t],\n\t\"./app_filebeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_filebeat.js\",\n\t\t\"icon.app_filebeat\"\n\t],\n\t\"./app_fleet\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_fleet.js\",\n\t\t\"icon.app_fleet\"\n\t],\n\t\"./app_fleet.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_fleet.js\",\n\t\t\"icon.app_fleet\"\n\t],\n\t\"./app_gis\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_gis.js\",\n\t\t\"icon.app_gis\"\n\t],\n\t\"./app_gis.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_gis.js\",\n\t\t\"icon.app_gis\"\n\t],\n\t\"./app_graph\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_graph.js\",\n\t\t\"icon.app_graph\"\n\t],\n\t\"./app_graph.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_graph.js\",\n\t\t\"icon.app_graph\"\n\t],\n\t\"./app_grok\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_grok.js\",\n\t\t\"icon.app_grok\"\n\t],\n\t\"./app_grok.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_grok.js\",\n\t\t\"icon.app_grok\"\n\t],\n\t\"./app_heartbeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_heartbeat.js\",\n\t\t\"icon.app_heartbeat\"\n\t],\n\t\"./app_heartbeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_heartbeat.js\",\n\t\t\"icon.app_heartbeat\"\n\t],\n\t\"./app_index_management\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_management.js\",\n\t\t\"icon.app_index_management\"\n\t],\n\t\"./app_index_management.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_management.js\",\n\t\t\"icon.app_index_management\"\n\t],\n\t\"./app_index_pattern\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_pattern.js\",\n\t\t\"icon.app_index_pattern\"\n\t],\n\t\"./app_index_pattern.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_pattern.js\",\n\t\t\"icon.app_index_pattern\"\n\t],\n\t\"./app_index_rollup\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_rollup.js\",\n\t\t\"icon.app_index_rollup\"\n\t],\n\t\"./app_index_rollup.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_rollup.js\",\n\t\t\"icon.app_index_rollup\"\n\t],\n\t\"./app_lens\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_lens.js\",\n\t\t\"icon.app_lens\"\n\t],\n\t\"./app_lens.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_lens.js\",\n\t\t\"icon.app_lens\"\n\t],\n\t\"./app_logs\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_logs.js\",\n\t\t\"icon.app_logs\"\n\t],\n\t\"./app_logs.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_logs.js\",\n\t\t\"icon.app_logs\"\n\t],\n\t\"./app_management\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_management.js\",\n\t\t\"icon.app_management\"\n\t],\n\t\"./app_management.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_management.js\",\n\t\t\"icon.app_management\"\n\t],\n\t\"./app_metricbeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_metricbeat.js\",\n\t\t\"icon.app_metricbeat\"\n\t],\n\t\"./app_metricbeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_metricbeat.js\",\n\t\t\"icon.app_metricbeat\"\n\t],\n\t\"./app_metrics\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_metrics.js\",\n\t\t\"icon.app_metrics\"\n\t],\n\t\"./app_metrics.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_metrics.js\",\n\t\t\"icon.app_metrics\"\n\t],\n\t\"./app_ml\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_ml.js\",\n\t\t\"icon.app_ml\"\n\t],\n\t\"./app_ml.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_ml.js\",\n\t\t\"icon.app_ml\"\n\t],\n\t\"./app_monitoring\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_monitoring.js\",\n\t\t\"icon.app_monitoring\"\n\t],\n\t\"./app_monitoring.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_monitoring.js\",\n\t\t\"icon.app_monitoring\"\n\t],\n\t\"./app_notebook\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_notebook.js\",\n\t\t\"icon.app_notebook\"\n\t],\n\t\"./app_notebook.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_notebook.js\",\n\t\t\"icon.app_notebook\"\n\t],\n\t\"./app_packetbeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_packetbeat.js\",\n\t\t\"icon.app_packetbeat\"\n\t],\n\t\"./app_packetbeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_packetbeat.js\",\n\t\t\"icon.app_packetbeat\"\n\t],\n\t\"./app_pipeline\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_pipeline.js\",\n\t\t\"icon.app_pipeline\"\n\t],\n\t\"./app_pipeline.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_pipeline.js\",\n\t\t\"icon.app_pipeline\"\n\t],\n\t\"./app_recently_viewed\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_recently_viewed.js\",\n\t\t\"icon.app_recently_viewed\"\n\t],\n\t\"./app_recently_viewed.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_recently_viewed.js\",\n\t\t\"icon.app_recently_viewed\"\n\t],\n\t\"./app_reporting\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_reporting.js\",\n\t\t\"icon.app_reporting\"\n\t],\n\t\"./app_reporting.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_reporting.js\",\n\t\t\"icon.app_reporting\"\n\t],\n\t\"./app_saved_objects\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_saved_objects.js\",\n\t\t\"icon.app_saved_objects\"\n\t],\n\t\"./app_saved_objects.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_saved_objects.js\",\n\t\t\"icon.app_saved_objects\"\n\t],\n\t\"./app_search_profiler\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_search_profiler.js\",\n\t\t\"icon.app_search_profiler\"\n\t],\n\t\"./app_search_profiler.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_search_profiler.js\",\n\t\t\"icon.app_search_profiler\"\n\t],\n\t\"./app_security\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_security.js\",\n\t\t\"icon.app_security\"\n\t],\n\t\"./app_security.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_security.js\",\n\t\t\"icon.app_security\"\n\t],\n\t\"./app_security_analytics\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_security_analytics.js\",\n\t\t\"icon.app_security_analytics\"\n\t],\n\t\"./app_security_analytics.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_security_analytics.js\",\n\t\t\"icon.app_security_analytics\"\n\t],\n\t\"./app_spaces\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_spaces.js\",\n\t\t\"icon.app_spaces\"\n\t],\n\t\"./app_spaces.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_spaces.js\",\n\t\t\"icon.app_spaces\"\n\t],\n\t\"./app_sql\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_sql.js\",\n\t\t\"icon.app_sql\"\n\t],\n\t\"./app_sql.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_sql.js\",\n\t\t\"icon.app_sql\"\n\t],\n\t\"./app_timelion\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_timelion.js\",\n\t\t\"icon.app_timelion\"\n\t],\n\t\"./app_timelion.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_timelion.js\",\n\t\t\"icon.app_timelion\"\n\t],\n\t\"./app_upgrade_assistant\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_upgrade_assistant.js\",\n\t\t\"icon.app_upgrade_assistant\"\n\t],\n\t\"./app_upgrade_assistant.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_upgrade_assistant.js\",\n\t\t\"icon.app_upgrade_assistant\"\n\t],\n\t\"./app_uptime\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_uptime.js\",\n\t\t\"icon.app_uptime\"\n\t],\n\t\"./app_uptime.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_uptime.js\",\n\t\t\"icon.app_uptime\"\n\t],\n\t\"./app_users_roles\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_users_roles.js\",\n\t\t\"icon.app_users_roles\"\n\t],\n\t\"./app_users_roles.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_users_roles.js\",\n\t\t\"icon.app_users_roles\"\n\t],\n\t\"./app_visualize\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_visualize.js\",\n\t\t\"icon.app_visualize\"\n\t],\n\t\"./app_visualize.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_visualize.js\",\n\t\t\"icon.app_visualize\"\n\t],\n\t\"./app_vulnerability_management\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_vulnerability_management.js\",\n\t\t\"icon.app_vulnerability_management\"\n\t],\n\t\"./app_vulnerability_management.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_vulnerability_management.js\",\n\t\t\"icon.app_vulnerability_management\"\n\t],\n\t\"./app_watches\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_watches.js\",\n\t\t\"icon.app_watches\"\n\t],\n\t\"./app_watches.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_watches.js\",\n\t\t\"icon.app_watches\"\n\t],\n\t\"./app_workplace_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_workplace_search.js\",\n\t\t\"icon.app_workplace_search\"\n\t],\n\t\"./app_workplace_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_workplace_search.js\",\n\t\t\"icon.app_workplace_search\"\n\t],\n\t\"./apps\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/apps.js\",\n\t\t\"icon.apps\"\n\t],\n\t\"./apps.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/apps.js\",\n\t\t\"icon.apps\"\n\t],\n\t\"./arrowEnd\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrowEnd.js\",\n\t\t\"icon.arrowEnd\"\n\t],\n\t\"./arrowEnd.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrowEnd.js\",\n\t\t\"icon.arrowEnd\"\n\t],\n\t\"./arrowStart\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrowStart.js\",\n\t\t\"icon.arrowStart\"\n\t],\n\t\"./arrowStart.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrowStart.js\",\n\t\t\"icon.arrowStart\"\n\t],\n\t\"./arrow_down\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_down.js\",\n\t\t\"icon.arrow_down\"\n\t],\n\t\"./arrow_down.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_down.js\",\n\t\t\"icon.arrow_down\"\n\t],\n\t\"./arrow_left\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_left.js\",\n\t\t\"icon.arrow_left\"\n\t],\n\t\"./arrow_left.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_left.js\",\n\t\t\"icon.arrow_left\"\n\t],\n\t\"./arrow_right\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_right.js\",\n\t\t\"icon.arrow_right\"\n\t],\n\t\"./arrow_right.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_right.js\",\n\t\t\"icon.arrow_right\"\n\t],\n\t\"./arrow_up\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_up.js\",\n\t\t\"icon.arrow_up\"\n\t],\n\t\"./arrow_up.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_up.js\",\n\t\t\"icon.arrow_up\"\n\t],\n\t\"./article\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/article.js\",\n\t\t\"icon.article\"\n\t],\n\t\"./article.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/article.js\",\n\t\t\"icon.article\"\n\t],\n\t\"./asterisk\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/asterisk.js\",\n\t\t\"icon.asterisk\"\n\t],\n\t\"./asterisk.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/asterisk.js\",\n\t\t\"icon.asterisk\"\n\t],\n\t\"./at\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/at.js\",\n\t\t\"icon.at\"\n\t],\n\t\"./at.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/at.js\",\n\t\t\"icon.at\"\n\t],\n\t\"./beaker\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/beaker.js\",\n\t\t\"icon.beaker\"\n\t],\n\t\"./beaker.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/beaker.js\",\n\t\t\"icon.beaker\"\n\t],\n\t\"./bell\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bell.js\",\n\t\t\"icon.bell\"\n\t],\n\t\"./bell.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bell.js\",\n\t\t\"icon.bell\"\n\t],\n\t\"./bellSlash\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bellSlash.js\",\n\t\t\"icon.bellSlash\"\n\t],\n\t\"./bellSlash.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bellSlash.js\",\n\t\t\"icon.bellSlash\"\n\t],\n\t\"./beta\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/beta.js\",\n\t\t\"icon.beta\"\n\t],\n\t\"./beta.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/beta.js\",\n\t\t\"icon.beta\"\n\t],\n\t\"./bolt\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bolt.js\",\n\t\t\"icon.bolt\"\n\t],\n\t\"./bolt.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bolt.js\",\n\t\t\"icon.bolt\"\n\t],\n\t\"./boxes_horizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/boxes_horizontal.js\",\n\t\t\"icon.boxes_horizontal\"\n\t],\n\t\"./boxes_horizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/boxes_horizontal.js\",\n\t\t\"icon.boxes_horizontal\"\n\t],\n\t\"./boxes_vertical\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/boxes_vertical.js\",\n\t\t\"icon.boxes_vertical\"\n\t],\n\t\"./boxes_vertical.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/boxes_vertical.js\",\n\t\t\"icon.boxes_vertical\"\n\t],\n\t\"./branch\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/branch.js\",\n\t\t\"icon.branch\"\n\t],\n\t\"./branch.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/branch.js\",\n\t\t\"icon.branch\"\n\t],\n\t\"./branchUser\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/branchUser.js\",\n\t\t\"icon.branchUser\"\n\t],\n\t\"./branchUser.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/branchUser.js\",\n\t\t\"icon.branchUser\"\n\t],\n\t\"./broom\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/broom.js\",\n\t\t\"icon.broom\"\n\t],\n\t\"./broom.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/broom.js\",\n\t\t\"icon.broom\"\n\t],\n\t\"./brush\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/brush.js\",\n\t\t\"icon.brush\"\n\t],\n\t\"./brush.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/brush.js\",\n\t\t\"icon.brush\"\n\t],\n\t\"./bug\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bug.js\",\n\t\t\"icon.bug\"\n\t],\n\t\"./bug.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bug.js\",\n\t\t\"icon.bug\"\n\t],\n\t\"./bullseye\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bullseye.js\",\n\t\t\"icon.bullseye\"\n\t],\n\t\"./bullseye.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bullseye.js\",\n\t\t\"icon.bullseye\"\n\t],\n\t\"./calendar\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/calendar.js\",\n\t\t\"icon.calendar\"\n\t],\n\t\"./calendar.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/calendar.js\",\n\t\t\"icon.calendar\"\n\t],\n\t\"./check\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/check.js\",\n\t\t\"icon.check\"\n\t],\n\t\"./check.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/check.js\",\n\t\t\"icon.check\"\n\t],\n\t\"./checkInCircleFilled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/checkInCircleFilled.js\",\n\t\t\"icon.checkInCircleFilled\"\n\t],\n\t\"./checkInCircleFilled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/checkInCircleFilled.js\",\n\t\t\"icon.checkInCircleFilled\"\n\t],\n\t\"./cheer\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cheer.js\",\n\t\t\"icon.cheer\"\n\t],\n\t\"./cheer.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cheer.js\",\n\t\t\"icon.cheer\"\n\t],\n\t\"./clock\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/clock.js\",\n\t\t\"icon.clock\"\n\t],\n\t\"./clock.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/clock.js\",\n\t\t\"icon.clock\"\n\t],\n\t\"./cloudDrizzle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudDrizzle.js\",\n\t\t\"icon.cloudDrizzle\"\n\t],\n\t\"./cloudDrizzle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudDrizzle.js\",\n\t\t\"icon.cloudDrizzle\"\n\t],\n\t\"./cloudStormy\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudStormy.js\",\n\t\t\"icon.cloudStormy\"\n\t],\n\t\"./cloudStormy.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudStormy.js\",\n\t\t\"icon.cloudStormy\"\n\t],\n\t\"./cloudSunny\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudSunny.js\",\n\t\t\"icon.cloudSunny\"\n\t],\n\t\"./cloudSunny.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudSunny.js\",\n\t\t\"icon.cloudSunny\"\n\t],\n\t\"./cluster\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cluster.js\",\n\t\t\"icon.cluster\"\n\t],\n\t\"./cluster.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cluster.js\",\n\t\t\"icon.cluster\"\n\t],\n\t\"./color\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/color.js\",\n\t\t\"icon.color\"\n\t],\n\t\"./color.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/color.js\",\n\t\t\"icon.color\"\n\t],\n\t\"./compute\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/compute.js\",\n\t\t\"icon.compute\"\n\t],\n\t\"./compute.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/compute.js\",\n\t\t\"icon.compute\"\n\t],\n\t\"./console\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/console.js\",\n\t\t\"icon.console\"\n\t],\n\t\"./console.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/console.js\",\n\t\t\"icon.console\"\n\t],\n\t\"./container\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/container.js\",\n\t\t\"icon.container\"\n\t],\n\t\"./container.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/container.js\",\n\t\t\"icon.container\"\n\t],\n\t\"./continuityAbove\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityAbove.js\",\n\t\t\"icon.continuityAbove\"\n\t],\n\t\"./continuityAbove.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityAbove.js\",\n\t\t\"icon.continuityAbove\"\n\t],\n\t\"./continuityAboveBelow\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityAboveBelow.js\",\n\t\t\"icon.continuityAboveBelow\"\n\t],\n\t\"./continuityAboveBelow.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityAboveBelow.js\",\n\t\t\"icon.continuityAboveBelow\"\n\t],\n\t\"./continuityBelow\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityBelow.js\",\n\t\t\"icon.continuityBelow\"\n\t],\n\t\"./continuityBelow.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityBelow.js\",\n\t\t\"icon.continuityBelow\"\n\t],\n\t\"./continuityWithin\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityWithin.js\",\n\t\t\"icon.continuityWithin\"\n\t],\n\t\"./continuityWithin.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityWithin.js\",\n\t\t\"icon.continuityWithin\"\n\t],\n\t\"./controls_horizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/controls_horizontal.js\",\n\t\t\"icon.controls_horizontal\"\n\t],\n\t\"./controls_horizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/controls_horizontal.js\",\n\t\t\"icon.controls_horizontal\"\n\t],\n\t\"./controls_vertical\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/controls_vertical.js\",\n\t\t\"icon.controls_vertical\"\n\t],\n\t\"./controls_vertical.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/controls_vertical.js\",\n\t\t\"icon.controls_vertical\"\n\t],\n\t\"./copy\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/copy.js\",\n\t\t\"icon.copy\"\n\t],\n\t\"./copy.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/copy.js\",\n\t\t\"icon.copy\"\n\t],\n\t\"./copy_clipboard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/copy_clipboard.js\",\n\t\t\"icon.copy_clipboard\"\n\t],\n\t\"./copy_clipboard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/copy_clipboard.js\",\n\t\t\"icon.copy_clipboard\"\n\t],\n\t\"./cross\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cross.js\",\n\t\t\"icon.cross\"\n\t],\n\t\"./cross.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cross.js\",\n\t\t\"icon.cross\"\n\t],\n\t\"./crosshairs\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/crosshairs.js\",\n\t\t\"icon.crosshairs\"\n\t],\n\t\"./crosshairs.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/crosshairs.js\",\n\t\t\"icon.crosshairs\"\n\t],\n\t\"./currency\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/currency.js\",\n\t\t\"icon.currency\"\n\t],\n\t\"./currency.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/currency.js\",\n\t\t\"icon.currency\"\n\t],\n\t\"./cut\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cut.js\",\n\t\t\"icon.cut\"\n\t],\n\t\"./cut.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cut.js\",\n\t\t\"icon.cut\"\n\t],\n\t\"./database\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/database.js\",\n\t\t\"icon.database\"\n\t],\n\t\"./database.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/database.js\",\n\t\t\"icon.database\"\n\t],\n\t\"./desktop\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/desktop.js\",\n\t\t\"icon.desktop\"\n\t],\n\t\"./desktop.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/desktop.js\",\n\t\t\"icon.desktop\"\n\t],\n\t\"./diff\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/diff.js\",\n\t\t\"icon.diff\"\n\t],\n\t\"./diff.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/diff.js\",\n\t\t\"icon.diff\"\n\t],\n\t\"./discuss\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/discuss.js\",\n\t\t\"icon.discuss\"\n\t],\n\t\"./discuss.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/discuss.js\",\n\t\t\"icon.discuss\"\n\t],\n\t\"./document\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/document.js\",\n\t\t\"icon.document\"\n\t],\n\t\"./document.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/document.js\",\n\t\t\"icon.document\"\n\t],\n\t\"./documentEdit\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documentEdit.js\",\n\t\t\"icon.documentEdit\"\n\t],\n\t\"./documentEdit.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documentEdit.js\",\n\t\t\"icon.documentEdit\"\n\t],\n\t\"./documentation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documentation.js\",\n\t\t\"icon.documentation\"\n\t],\n\t\"./documentation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documentation.js\",\n\t\t\"icon.documentation\"\n\t],\n\t\"./documents\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documents.js\",\n\t\t\"icon.documents\"\n\t],\n\t\"./documents.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documents.js\",\n\t\t\"icon.documents\"\n\t],\n\t\"./dot\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/dot.js\",\n\t\t\"icon.dot\"\n\t],\n\t\"./dot.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/dot.js\",\n\t\t\"icon.dot\"\n\t],\n\t\"./dotInCircle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/dotInCircle.js\",\n\t\t\"icon.dotInCircle\"\n\t],\n\t\"./dotInCircle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/dotInCircle.js\",\n\t\t\"icon.dotInCircle\"\n\t],\n\t\"./doubleArrowLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/doubleArrowLeft.js\",\n\t\t\"icon.doubleArrowLeft\"\n\t],\n\t\"./doubleArrowLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/doubleArrowLeft.js\",\n\t\t\"icon.doubleArrowLeft\"\n\t],\n\t\"./doubleArrowRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/doubleArrowRight.js\",\n\t\t\"icon.doubleArrowRight\"\n\t],\n\t\"./doubleArrowRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/doubleArrowRight.js\",\n\t\t\"icon.doubleArrowRight\"\n\t],\n\t\"./download\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/download.js\",\n\t\t\"icon.download\"\n\t],\n\t\"./download.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/download.js\",\n\t\t\"icon.download\"\n\t],\n\t\"./editorDistributeHorizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorDistributeHorizontal.js\",\n\t\t\"icon.editorDistributeHorizontal\"\n\t],\n\t\"./editorDistributeHorizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorDistributeHorizontal.js\",\n\t\t\"icon.editorDistributeHorizontal\"\n\t],\n\t\"./editorDistributeVertical\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorDistributeVertical.js\",\n\t\t\"icon.editorDistributeVertical\"\n\t],\n\t\"./editorDistributeVertical.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorDistributeVertical.js\",\n\t\t\"icon.editorDistributeVertical\"\n\t],\n\t\"./editorItemAlignBottom\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignBottom.js\",\n\t\t\"icon.editorItemAlignBottom\"\n\t],\n\t\"./editorItemAlignBottom.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignBottom.js\",\n\t\t\"icon.editorItemAlignBottom\"\n\t],\n\t\"./editorItemAlignCenter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignCenter.js\",\n\t\t\"icon.editorItemAlignCenter\"\n\t],\n\t\"./editorItemAlignCenter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignCenter.js\",\n\t\t\"icon.editorItemAlignCenter\"\n\t],\n\t\"./editorItemAlignLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignLeft.js\",\n\t\t\"icon.editorItemAlignLeft\"\n\t],\n\t\"./editorItemAlignLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignLeft.js\",\n\t\t\"icon.editorItemAlignLeft\"\n\t],\n\t\"./editorItemAlignMiddle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignMiddle.js\",\n\t\t\"icon.editorItemAlignMiddle\"\n\t],\n\t\"./editorItemAlignMiddle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignMiddle.js\",\n\t\t\"icon.editorItemAlignMiddle\"\n\t],\n\t\"./editorItemAlignRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignRight.js\",\n\t\t\"icon.editorItemAlignRight\"\n\t],\n\t\"./editorItemAlignRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignRight.js\",\n\t\t\"icon.editorItemAlignRight\"\n\t],\n\t\"./editorItemAlignTop\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignTop.js\",\n\t\t\"icon.editorItemAlignTop\"\n\t],\n\t\"./editorItemAlignTop.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignTop.js\",\n\t\t\"icon.editorItemAlignTop\"\n\t],\n\t\"./editorPositionBottomLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionBottomLeft.js\",\n\t\t\"icon.editorPositionBottomLeft\"\n\t],\n\t\"./editorPositionBottomLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionBottomLeft.js\",\n\t\t\"icon.editorPositionBottomLeft\"\n\t],\n\t\"./editorPositionBottomRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionBottomRight.js\",\n\t\t\"icon.editorPositionBottomRight\"\n\t],\n\t\"./editorPositionBottomRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionBottomRight.js\",\n\t\t\"icon.editorPositionBottomRight\"\n\t],\n\t\"./editorPositionTopLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionTopLeft.js\",\n\t\t\"icon.editorPositionTopLeft\"\n\t],\n\t\"./editorPositionTopLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionTopLeft.js\",\n\t\t\"icon.editorPositionTopLeft\"\n\t],\n\t\"./editorPositionTopRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionTopRight.js\",\n\t\t\"icon.editorPositionTopRight\"\n\t],\n\t\"./editorPositionTopRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionTopRight.js\",\n\t\t\"icon.editorPositionTopRight\"\n\t],\n\t\"./editor_align_center\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_center.js\",\n\t\t\"icon.editor_align_center\"\n\t],\n\t\"./editor_align_center.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_center.js\",\n\t\t\"icon.editor_align_center\"\n\t],\n\t\"./editor_align_left\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_left.js\",\n\t\t\"icon.editor_align_left\"\n\t],\n\t\"./editor_align_left.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_left.js\",\n\t\t\"icon.editor_align_left\"\n\t],\n\t\"./editor_align_right\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_right.js\",\n\t\t\"icon.editor_align_right\"\n\t],\n\t\"./editor_align_right.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_right.js\",\n\t\t\"icon.editor_align_right\"\n\t],\n\t\"./editor_bold\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_bold.js\",\n\t\t\"icon.editor_bold\"\n\t],\n\t\"./editor_bold.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_bold.js\",\n\t\t\"icon.editor_bold\"\n\t],\n\t\"./editor_checklist\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_checklist.js\",\n\t\t\"icon.editor_checklist\"\n\t],\n\t\"./editor_checklist.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_checklist.js\",\n\t\t\"icon.editor_checklist\"\n\t],\n\t\"./editor_code_block\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_code_block.js\",\n\t\t\"icon.editor_code_block\"\n\t],\n\t\"./editor_code_block.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_code_block.js\",\n\t\t\"icon.editor_code_block\"\n\t],\n\t\"./editor_comment\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_comment.js\",\n\t\t\"icon.editor_comment\"\n\t],\n\t\"./editor_comment.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_comment.js\",\n\t\t\"icon.editor_comment\"\n\t],\n\t\"./editor_heading\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_heading.js\",\n\t\t\"icon.editor_heading\"\n\t],\n\t\"./editor_heading.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_heading.js\",\n\t\t\"icon.editor_heading\"\n\t],\n\t\"./editor_italic\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_italic.js\",\n\t\t\"icon.editor_italic\"\n\t],\n\t\"./editor_italic.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_italic.js\",\n\t\t\"icon.editor_italic\"\n\t],\n\t\"./editor_link\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_link.js\",\n\t\t\"icon.editor_link\"\n\t],\n\t\"./editor_link.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_link.js\",\n\t\t\"icon.editor_link\"\n\t],\n\t\"./editor_ordered_list\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_ordered_list.js\",\n\t\t\"icon.editor_ordered_list\"\n\t],\n\t\"./editor_ordered_list.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_ordered_list.js\",\n\t\t\"icon.editor_ordered_list\"\n\t],\n\t\"./editor_redo\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_redo.js\",\n\t\t\"icon.editor_redo\"\n\t],\n\t\"./editor_redo.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_redo.js\",\n\t\t\"icon.editor_redo\"\n\t],\n\t\"./editor_strike\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_strike.js\",\n\t\t\"icon.editor_strike\"\n\t],\n\t\"./editor_strike.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_strike.js\",\n\t\t\"icon.editor_strike\"\n\t],\n\t\"./editor_table\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_table.js\",\n\t\t\"icon.editor_table\"\n\t],\n\t\"./editor_table.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_table.js\",\n\t\t\"icon.editor_table\"\n\t],\n\t\"./editor_underline\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_underline.js\",\n\t\t\"icon.editor_underline\"\n\t],\n\t\"./editor_underline.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_underline.js\",\n\t\t\"icon.editor_underline\"\n\t],\n\t\"./editor_undo\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_undo.js\",\n\t\t\"icon.editor_undo\"\n\t],\n\t\"./editor_undo.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_undo.js\",\n\t\t\"icon.editor_undo\"\n\t],\n\t\"./editor_unordered_list\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_unordered_list.js\",\n\t\t\"icon.editor_unordered_list\"\n\t],\n\t\"./editor_unordered_list.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_unordered_list.js\",\n\t\t\"icon.editor_unordered_list\"\n\t],\n\t\"./email\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/email.js\",\n\t\t\"icon.email\"\n\t],\n\t\"./email.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/email.js\",\n\t\t\"icon.email\"\n\t],\n\t\"./empty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/empty.js\"\n\t],\n\t\"./empty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/empty.js\"\n\t],\n\t\"./endpoint\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/endpoint.js\",\n\t\t\"icon.endpoint\"\n\t],\n\t\"./endpoint.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/endpoint.js\",\n\t\t\"icon.endpoint\"\n\t],\n\t\"./eql\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eql.js\",\n\t\t\"icon.eql\"\n\t],\n\t\"./eql.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eql.js\",\n\t\t\"icon.eql\"\n\t],\n\t\"./eraser\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eraser.js\",\n\t\t\"icon.eraser\"\n\t],\n\t\"./eraser.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eraser.js\",\n\t\t\"icon.eraser\"\n\t],\n\t\"./error\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/error.js\",\n\t\t\"icon.error\"\n\t],\n\t\"./error.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/error.js\",\n\t\t\"icon.error\"\n\t],\n\t\"./esqlVis\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/esqlVis.js\",\n\t\t\"icon.esqlVis\"\n\t],\n\t\"./esqlVis.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/esqlVis.js\",\n\t\t\"icon.esqlVis\"\n\t],\n\t\"./exit\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/exit.js\",\n\t\t\"icon.exit\"\n\t],\n\t\"./exit.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/exit.js\",\n\t\t\"icon.exit\"\n\t],\n\t\"./expand\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/expand.js\",\n\t\t\"icon.expand\"\n\t],\n\t\"./expand.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/expand.js\",\n\t\t\"icon.expand\"\n\t],\n\t\"./expandMini\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/expandMini.js\",\n\t\t\"icon.expandMini\"\n\t],\n\t\"./expandMini.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/expandMini.js\",\n\t\t\"icon.expandMini\"\n\t],\n\t\"./export\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/export.js\",\n\t\t\"icon.export\"\n\t],\n\t\"./export.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/export.js\",\n\t\t\"icon.export\"\n\t],\n\t\"./eye\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eye.js\",\n\t\t\"icon.eye\"\n\t],\n\t\"./eye.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eye.js\",\n\t\t\"icon.eye\"\n\t],\n\t\"./eye_closed\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eye_closed.js\",\n\t\t\"icon.eye_closed\"\n\t],\n\t\"./eye_closed.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eye_closed.js\",\n\t\t\"icon.eye_closed\"\n\t],\n\t\"./face_happy\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_happy.js\",\n\t\t\"icon.face_happy\"\n\t],\n\t\"./face_happy.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_happy.js\",\n\t\t\"icon.face_happy\"\n\t],\n\t\"./face_neutral\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_neutral.js\",\n\t\t\"icon.face_neutral\"\n\t],\n\t\"./face_neutral.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_neutral.js\",\n\t\t\"icon.face_neutral\"\n\t],\n\t\"./face_sad\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_sad.js\",\n\t\t\"icon.face_sad\"\n\t],\n\t\"./face_sad.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_sad.js\",\n\t\t\"icon.face_sad\"\n\t],\n\t\"./filter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filter.js\",\n\t\t\"icon.filter\"\n\t],\n\t\"./filter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filter.js\",\n\t\t\"icon.filter\"\n\t],\n\t\"./filterExclude\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterExclude.js\",\n\t\t\"icon.filterExclude\"\n\t],\n\t\"./filterExclude.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterExclude.js\",\n\t\t\"icon.filterExclude\"\n\t],\n\t\"./filterIgnore\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterIgnore.js\",\n\t\t\"icon.filterIgnore\"\n\t],\n\t\"./filterIgnore.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterIgnore.js\",\n\t\t\"icon.filterIgnore\"\n\t],\n\t\"./filterInCircle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterInCircle.js\",\n\t\t\"icon.filterInCircle\"\n\t],\n\t\"./filterInCircle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterInCircle.js\",\n\t\t\"icon.filterInCircle\"\n\t],\n\t\"./filterInclude\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterInclude.js\",\n\t\t\"icon.filterInclude\"\n\t],\n\t\"./filterInclude.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterInclude.js\",\n\t\t\"icon.filterInclude\"\n\t],\n\t\"./flag\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/flag.js\",\n\t\t\"icon.flag\"\n\t],\n\t\"./flag.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/flag.js\",\n\t\t\"icon.flag\"\n\t],\n\t\"./fold\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/fold.js\",\n\t\t\"icon.fold\"\n\t],\n\t\"./fold.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/fold.js\",\n\t\t\"icon.fold\"\n\t],\n\t\"./folder_check\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_check.js\",\n\t\t\"icon.folder_check\"\n\t],\n\t\"./folder_check.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_check.js\",\n\t\t\"icon.folder_check\"\n\t],\n\t\"./folder_closed\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_closed.js\",\n\t\t\"icon.folder_closed\"\n\t],\n\t\"./folder_closed.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_closed.js\",\n\t\t\"icon.folder_closed\"\n\t],\n\t\"./folder_exclamation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_exclamation.js\",\n\t\t\"icon.folder_exclamation\"\n\t],\n\t\"./folder_exclamation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_exclamation.js\",\n\t\t\"icon.folder_exclamation\"\n\t],\n\t\"./folder_open\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_open.js\",\n\t\t\"icon.folder_open\"\n\t],\n\t\"./folder_open.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_open.js\",\n\t\t\"icon.folder_open\"\n\t],\n\t\"./frameNext\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/frameNext.js\",\n\t\t\"icon.frameNext\"\n\t],\n\t\"./frameNext.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/frameNext.js\",\n\t\t\"icon.frameNext\"\n\t],\n\t\"./framePrevious\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/framePrevious.js\",\n\t\t\"icon.framePrevious\"\n\t],\n\t\"./framePrevious.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/framePrevious.js\",\n\t\t\"icon.framePrevious\"\n\t],\n\t\"./fullScreenExit\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/fullScreenExit.js\",\n\t\t\"icon.fullScreenExit\"\n\t],\n\t\"./fullScreenExit.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/fullScreenExit.js\",\n\t\t\"icon.fullScreenExit\"\n\t],\n\t\"./full_screen\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/full_screen.js\",\n\t\t\"icon.full_screen\"\n\t],\n\t\"./full_screen.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/full_screen.js\",\n\t\t\"icon.full_screen\"\n\t],\n\t\"./function\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/function.js\",\n\t\t\"icon.function\"\n\t],\n\t\"./function.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/function.js\",\n\t\t\"icon.function\"\n\t],\n\t\"./gear\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/gear.js\",\n\t\t\"icon.gear\"\n\t],\n\t\"./gear.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/gear.js\",\n\t\t\"icon.gear\"\n\t],\n\t\"./glasses\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/glasses.js\",\n\t\t\"icon.glasses\"\n\t],\n\t\"./glasses.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/glasses.js\",\n\t\t\"icon.glasses\"\n\t],\n\t\"./globe\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/globe.js\",\n\t\t\"icon.globe\"\n\t],\n\t\"./globe.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/globe.js\",\n\t\t\"icon.globe\"\n\t],\n\t\"./grab\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grab.js\",\n\t\t\"icon.grab\"\n\t],\n\t\"./grab.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grab.js\",\n\t\t\"icon.grab\"\n\t],\n\t\"./grabOmnidirectional\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grabOmnidirectional.js\",\n\t\t\"icon.grabOmnidirectional\"\n\t],\n\t\"./grabOmnidirectional.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grabOmnidirectional.js\",\n\t\t\"icon.grabOmnidirectional\"\n\t],\n\t\"./grab_horizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grab_horizontal.js\",\n\t\t\"icon.grab_horizontal\"\n\t],\n\t\"./grab_horizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grab_horizontal.js\",\n\t\t\"icon.grab_horizontal\"\n\t],\n\t\"./gradient\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/gradient.js\",\n\t\t\"icon.gradient\"\n\t],\n\t\"./gradient.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/gradient.js\",\n\t\t\"icon.gradient\"\n\t],\n\t\"./grid\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grid.js\",\n\t\t\"icon.grid\"\n\t],\n\t\"./grid.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grid.js\",\n\t\t\"icon.grid\"\n\t],\n\t\"./heart\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/heart.js\",\n\t\t\"icon.heart\"\n\t],\n\t\"./heart.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/heart.js\",\n\t\t\"icon.heart\"\n\t],\n\t\"./heatmap\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/heatmap.js\",\n\t\t\"icon.heatmap\"\n\t],\n\t\"./heatmap.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/heatmap.js\",\n\t\t\"icon.heatmap\"\n\t],\n\t\"./help\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/help.js\",\n\t\t\"icon.help\"\n\t],\n\t\"./help.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/help.js\",\n\t\t\"icon.help\"\n\t],\n\t\"./home\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/home.js\",\n\t\t\"icon.home\"\n\t],\n\t\"./home.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/home.js\",\n\t\t\"icon.home\"\n\t],\n\t\"./iInCircle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/iInCircle.js\",\n\t\t\"icon.iInCircle\"\n\t],\n\t\"./iInCircle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/iInCircle.js\",\n\t\t\"icon.iInCircle\"\n\t],\n\t\"./image\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/image.js\",\n\t\t\"icon.image\"\n\t],\n\t\"./image.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/image.js\",\n\t\t\"icon.image\"\n\t],\n\t\"./import\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/import.js\",\n\t\t\"icon.import\"\n\t],\n\t\"./import.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/import.js\",\n\t\t\"icon.import\"\n\t],\n\t\"./index\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index.js\",\n\t\t\"icon.\"\n\t],\n\t\"./index.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index.js\",\n\t\t\"icon.\"\n\t],\n\t\"./indexTemporary\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/indexTemporary.js\",\n\t\t\"icon.indexTemporary\"\n\t],\n\t\"./indexTemporary.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/indexTemporary.js\",\n\t\t\"icon.indexTemporary\"\n\t],\n\t\"./index_close\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_close.js\",\n\t\t\"icon.index_close\"\n\t],\n\t\"./index_close.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_close.js\",\n\t\t\"icon.index_close\"\n\t],\n\t\"./index_edit\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_edit.js\",\n\t\t\"icon.index_edit\"\n\t],\n\t\"./index_edit.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_edit.js\",\n\t\t\"icon.index_edit\"\n\t],\n\t\"./index_flush\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_flush.js\",\n\t\t\"icon.index_flush\"\n\t],\n\t\"./index_flush.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_flush.js\",\n\t\t\"icon.index_flush\"\n\t],\n\t\"./index_mapping\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_mapping.js\",\n\t\t\"icon.index_mapping\"\n\t],\n\t\"./index_mapping.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_mapping.js\",\n\t\t\"icon.index_mapping\"\n\t],\n\t\"./index_open\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_open.js\",\n\t\t\"icon.index_open\"\n\t],\n\t\"./index_open.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_open.js\",\n\t\t\"icon.index_open\"\n\t],\n\t\"./index_runtime\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_runtime.js\",\n\t\t\"icon.index_runtime\"\n\t],\n\t\"./index_runtime.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_runtime.js\",\n\t\t\"icon.index_runtime\"\n\t],\n\t\"./index_settings\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_settings.js\",\n\t\t\"icon.index_settings\"\n\t],\n\t\"./index_settings.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_settings.js\",\n\t\t\"icon.index_settings\"\n\t],\n\t\"./infinity\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/infinity.js\",\n\t\t\"icon.infinity\"\n\t],\n\t\"./infinity.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/infinity.js\",\n\t\t\"icon.infinity\"\n\t],\n\t\"./inputOutput\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/inputOutput.js\",\n\t\t\"icon.inputOutput\"\n\t],\n\t\"./inputOutput.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/inputOutput.js\",\n\t\t\"icon.inputOutput\"\n\t],\n\t\"./inspect\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/inspect.js\",\n\t\t\"icon.inspect\"\n\t],\n\t\"./inspect.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/inspect.js\",\n\t\t\"icon.inspect\"\n\t],\n\t\"./invert\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/invert.js\",\n\t\t\"icon.invert\"\n\t],\n\t\"./invert.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/invert.js\",\n\t\t\"icon.invert\"\n\t],\n\t\"./ip\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ip.js\",\n\t\t\"icon.ip\"\n\t],\n\t\"./ip.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ip.js\",\n\t\t\"icon.ip\"\n\t],\n\t\"./issue\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/issue.js\",\n\t\t\"icon.issue\"\n\t],\n\t\"./issue.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/issue.js\",\n\t\t\"icon.issue\"\n\t],\n\t\"./key\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/key.js\",\n\t\t\"icon.key\"\n\t],\n\t\"./key.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/key.js\",\n\t\t\"icon.key\"\n\t],\n\t\"./keyboard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/keyboard.js\",\n\t\t\"icon.keyboard\"\n\t],\n\t\"./keyboard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/keyboard.js\",\n\t\t\"icon.keyboard\"\n\t],\n\t\"./kql_field\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_field.js\",\n\t\t\"icon.kql_field\"\n\t],\n\t\"./kql_field.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_field.js\",\n\t\t\"icon.kql_field\"\n\t],\n\t\"./kql_function\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_function.js\",\n\t\t\"icon.kql_function\"\n\t],\n\t\"./kql_function.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_function.js\",\n\t\t\"icon.kql_function\"\n\t],\n\t\"./kql_operand\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_operand.js\",\n\t\t\"icon.kql_operand\"\n\t],\n\t\"./kql_operand.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_operand.js\",\n\t\t\"icon.kql_operand\"\n\t],\n\t\"./kql_selector\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_selector.js\",\n\t\t\"icon.kql_selector\"\n\t],\n\t\"./kql_selector.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_selector.js\",\n\t\t\"icon.kql_selector\"\n\t],\n\t\"./kql_value\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_value.js\",\n\t\t\"icon.kql_value\"\n\t],\n\t\"./kql_value.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_value.js\",\n\t\t\"icon.kql_value\"\n\t],\n\t\"./kubernetesNode\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kubernetesNode.js\",\n\t\t\"icon.kubernetesNode\"\n\t],\n\t\"./kubernetesNode.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kubernetesNode.js\",\n\t\t\"icon.kubernetesNode\"\n\t],\n\t\"./kubernetesPod\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kubernetesPod.js\",\n\t\t\"icon.kubernetesPod\"\n\t],\n\t\"./kubernetesPod.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kubernetesPod.js\",\n\t\t\"icon.kubernetesPod\"\n\t],\n\t\"./launch\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/launch.js\",\n\t\t\"icon.launch\"\n\t],\n\t\"./launch.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/launch.js\",\n\t\t\"icon.launch\"\n\t],\n\t\"./layers\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/layers.js\",\n\t\t\"icon.layers\"\n\t],\n\t\"./layers.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/layers.js\",\n\t\t\"icon.layers\"\n\t],\n\t\"./lettering\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lettering.js\",\n\t\t\"icon.lettering\"\n\t],\n\t\"./lettering.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lettering.js\",\n\t\t\"icon.lettering\"\n\t],\n\t\"./lineDashed\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineDashed.js\",\n\t\t\"icon.lineDashed\"\n\t],\n\t\"./lineDashed.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineDashed.js\",\n\t\t\"icon.lineDashed\"\n\t],\n\t\"./lineDotted\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineDotted.js\",\n\t\t\"icon.lineDotted\"\n\t],\n\t\"./lineDotted.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineDotted.js\",\n\t\t\"icon.lineDotted\"\n\t],\n\t\"./lineSolid\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineSolid.js\",\n\t\t\"icon.lineSolid\"\n\t],\n\t\"./lineSolid.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineSolid.js\",\n\t\t\"icon.lineSolid\"\n\t],\n\t\"./link\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/link.js\",\n\t\t\"icon.link\"\n\t],\n\t\"./link.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/link.js\",\n\t\t\"icon.link\"\n\t],\n\t\"./list\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/list.js\",\n\t\t\"icon.list\"\n\t],\n\t\"./list.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/list.js\",\n\t\t\"icon.list\"\n\t],\n\t\"./list_add\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/list_add.js\",\n\t\t\"icon.list_add\"\n\t],\n\t\"./list_add.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/list_add.js\",\n\t\t\"icon.list_add\"\n\t],\n\t\"./lock\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lock.js\",\n\t\t\"icon.lock\"\n\t],\n\t\"./lock.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lock.js\",\n\t\t\"icon.lock\"\n\t],\n\t\"./lockOpen\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lockOpen.js\",\n\t\t\"icon.lockOpen\"\n\t],\n\t\"./lockOpen.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lockOpen.js\",\n\t\t\"icon.lockOpen\"\n\t],\n\t\"./logo_aerospike\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aerospike.js\",\n\t\t\"icon.logo_aerospike\"\n\t],\n\t\"./logo_aerospike.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aerospike.js\",\n\t\t\"icon.logo_aerospike\"\n\t],\n\t\"./logo_apache\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_apache.js\",\n\t\t\"icon.logo_apache\"\n\t],\n\t\"./logo_apache.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_apache.js\",\n\t\t\"icon.logo_apache\"\n\t],\n\t\"./logo_app_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_app_search.js\",\n\t\t\"icon.logo_app_search\"\n\t],\n\t\"./logo_app_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_app_search.js\",\n\t\t\"icon.logo_app_search\"\n\t],\n\t\"./logo_aws\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aws.js\",\n\t\t\"icon.logo_aws\"\n\t],\n\t\"./logo_aws.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aws.js\",\n\t\t\"icon.logo_aws\"\n\t],\n\t\"./logo_aws_mono\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aws_mono.js\",\n\t\t\"icon.logo_aws_mono\"\n\t],\n\t\"./logo_aws_mono.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aws_mono.js\",\n\t\t\"icon.logo_aws_mono\"\n\t],\n\t\"./logo_azure\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_azure.js\",\n\t\t\"icon.logo_azure\"\n\t],\n\t\"./logo_azure.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_azure.js\",\n\t\t\"icon.logo_azure\"\n\t],\n\t\"./logo_azure_mono\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_azure_mono.js\",\n\t\t\"icon.logo_azure_mono\"\n\t],\n\t\"./logo_azure_mono.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_azure_mono.js\",\n\t\t\"icon.logo_azure_mono\"\n\t],\n\t\"./logo_beats\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_beats.js\",\n\t\t\"icon.logo_beats\"\n\t],\n\t\"./logo_beats.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_beats.js\",\n\t\t\"icon.logo_beats\"\n\t],\n\t\"./logo_business_analytics\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_business_analytics.js\",\n\t\t\"icon.logo_business_analytics\"\n\t],\n\t\"./logo_business_analytics.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_business_analytics.js\",\n\t\t\"icon.logo_business_analytics\"\n\t],\n\t\"./logo_ceph\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ceph.js\",\n\t\t\"icon.logo_ceph\"\n\t],\n\t\"./logo_ceph.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ceph.js\",\n\t\t\"icon.logo_ceph\"\n\t],\n\t\"./logo_cloud\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_cloud.js\",\n\t\t\"icon.logo_cloud\"\n\t],\n\t\"./logo_cloud.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_cloud.js\",\n\t\t\"icon.logo_cloud\"\n\t],\n\t\"./logo_cloud_ece\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_cloud_ece.js\",\n\t\t\"icon.logo_cloud_ece\"\n\t],\n\t\"./logo_cloud_ece.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_cloud_ece.js\",\n\t\t\"icon.logo_cloud_ece\"\n\t],\n\t\"./logo_code\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_code.js\",\n\t\t\"icon.logo_code\"\n\t],\n\t\"./logo_code.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_code.js\",\n\t\t\"icon.logo_code\"\n\t],\n\t\"./logo_codesandbox\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_codesandbox.js\",\n\t\t\"icon.logo_codesandbox\"\n\t],\n\t\"./logo_codesandbox.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_codesandbox.js\",\n\t\t\"icon.logo_codesandbox\"\n\t],\n\t\"./logo_couchbase\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_couchbase.js\",\n\t\t\"icon.logo_couchbase\"\n\t],\n\t\"./logo_couchbase.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_couchbase.js\",\n\t\t\"icon.logo_couchbase\"\n\t],\n\t\"./logo_docker\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_docker.js\",\n\t\t\"icon.logo_docker\"\n\t],\n\t\"./logo_docker.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_docker.js\",\n\t\t\"icon.logo_docker\"\n\t],\n\t\"./logo_dropwizard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_dropwizard.js\",\n\t\t\"icon.logo_dropwizard\"\n\t],\n\t\"./logo_dropwizard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_dropwizard.js\",\n\t\t\"icon.logo_dropwizard\"\n\t],\n\t\"./logo_elastic\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elastic.js\",\n\t\t\"icon.logo_elastic\"\n\t],\n\t\"./logo_elastic.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elastic.js\",\n\t\t\"icon.logo_elastic\"\n\t],\n\t\"./logo_elastic_stack\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elastic_stack.js\",\n\t\t\"icon.logo_elastic_stack\"\n\t],\n\t\"./logo_elastic_stack.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elastic_stack.js\",\n\t\t\"icon.logo_elastic_stack\"\n\t],\n\t\"./logo_elasticsearch\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elasticsearch.js\",\n\t\t\"icon.logo_elasticsearch\"\n\t],\n\t\"./logo_elasticsearch.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elasticsearch.js\",\n\t\t\"icon.logo_elasticsearch\"\n\t],\n\t\"./logo_enterprise_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_enterprise_search.js\",\n\t\t\"icon.logo_enterprise_search\"\n\t],\n\t\"./logo_enterprise_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_enterprise_search.js\",\n\t\t\"icon.logo_enterprise_search\"\n\t],\n\t\"./logo_etcd\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_etcd.js\",\n\t\t\"icon.logo_etcd\"\n\t],\n\t\"./logo_etcd.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_etcd.js\",\n\t\t\"icon.logo_etcd\"\n\t],\n\t\"./logo_gcp\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gcp.js\",\n\t\t\"icon.logo_gcp\"\n\t],\n\t\"./logo_gcp.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gcp.js\",\n\t\t\"icon.logo_gcp\"\n\t],\n\t\"./logo_gcp_mono\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gcp_mono.js\",\n\t\t\"icon.logo_gcp_mono\"\n\t],\n\t\"./logo_gcp_mono.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gcp_mono.js\",\n\t\t\"icon.logo_gcp_mono\"\n\t],\n\t\"./logo_github\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_github.js\",\n\t\t\"icon.logo_github\"\n\t],\n\t\"./logo_github.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_github.js\",\n\t\t\"icon.logo_github\"\n\t],\n\t\"./logo_gmail\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gmail.js\",\n\t\t\"icon.logo_gmail\"\n\t],\n\t\"./logo_gmail.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gmail.js\",\n\t\t\"icon.logo_gmail\"\n\t],\n\t\"./logo_golang\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_golang.js\",\n\t\t\"vendors~icon.logo_golang\"\n\t],\n\t\"./logo_golang.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_golang.js\",\n\t\t\"vendors~icon.logo_golang\"\n\t],\n\t\"./logo_google_g\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_google_g.js\",\n\t\t\"icon.logo_google_g\"\n\t],\n\t\"./logo_google_g.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_google_g.js\",\n\t\t\"icon.logo_google_g\"\n\t],\n\t\"./logo_haproxy\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_haproxy.js\",\n\t\t\"icon.logo_haproxy\"\n\t],\n\t\"./logo_haproxy.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_haproxy.js\",\n\t\t\"icon.logo_haproxy\"\n\t],\n\t\"./logo_ibm\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ibm.js\",\n\t\t\"icon.logo_ibm\"\n\t],\n\t\"./logo_ibm.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ibm.js\",\n\t\t\"icon.logo_ibm\"\n\t],\n\t\"./logo_ibm_mono\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ibm_mono.js\",\n\t\t\"icon.logo_ibm_mono\"\n\t],\n\t\"./logo_ibm_mono.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ibm_mono.js\",\n\t\t\"icon.logo_ibm_mono\"\n\t],\n\t\"./logo_kafka\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kafka.js\",\n\t\t\"icon.logo_kafka\"\n\t],\n\t\"./logo_kafka.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kafka.js\",\n\t\t\"icon.logo_kafka\"\n\t],\n\t\"./logo_kibana\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kibana.js\",\n\t\t\"icon.logo_kibana\"\n\t],\n\t\"./logo_kibana.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kibana.js\",\n\t\t\"icon.logo_kibana\"\n\t],\n\t\"./logo_kubernetes\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kubernetes.js\",\n\t\t\"icon.logo_kubernetes\"\n\t],\n\t\"./logo_kubernetes.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kubernetes.js\",\n\t\t\"icon.logo_kubernetes\"\n\t],\n\t\"./logo_logging\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_logging.js\",\n\t\t\"icon.logo_logging\"\n\t],\n\t\"./logo_logging.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_logging.js\",\n\t\t\"icon.logo_logging\"\n\t],\n\t\"./logo_logstash\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_logstash.js\",\n\t\t\"icon.logo_logstash\"\n\t],\n\t\"./logo_logstash.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_logstash.js\",\n\t\t\"icon.logo_logstash\"\n\t],\n\t\"./logo_maps\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_maps.js\",\n\t\t\"icon.logo_maps\"\n\t],\n\t\"./logo_maps.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_maps.js\",\n\t\t\"icon.logo_maps\"\n\t],\n\t\"./logo_memcached\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_memcached.js\",\n\t\t\"icon.logo_memcached\"\n\t],\n\t\"./logo_memcached.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_memcached.js\",\n\t\t\"icon.logo_memcached\"\n\t],\n\t\"./logo_metrics\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_metrics.js\",\n\t\t\"icon.logo_metrics\"\n\t],\n\t\"./logo_metrics.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_metrics.js\",\n\t\t\"icon.logo_metrics\"\n\t],\n\t\"./logo_mongodb\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_mongodb.js\",\n\t\t\"icon.logo_mongodb\"\n\t],\n\t\"./logo_mongodb.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_mongodb.js\",\n\t\t\"icon.logo_mongodb\"\n\t],\n\t\"./logo_mysql\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_mysql.js\",\n\t\t\"icon.logo_mysql\"\n\t],\n\t\"./logo_mysql.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_mysql.js\",\n\t\t\"icon.logo_mysql\"\n\t],\n\t\"./logo_nginx\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_nginx.js\",\n\t\t\"icon.logo_nginx\"\n\t],\n\t\"./logo_nginx.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_nginx.js\",\n\t\t\"icon.logo_nginx\"\n\t],\n\t\"./logo_observability\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_observability.js\",\n\t\t\"icon.logo_observability\"\n\t],\n\t\"./logo_observability.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_observability.js\",\n\t\t\"icon.logo_observability\"\n\t],\n\t\"./logo_osquery\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_osquery.js\",\n\t\t\"icon.logo_osquery\"\n\t],\n\t\"./logo_osquery.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_osquery.js\",\n\t\t\"icon.logo_osquery\"\n\t],\n\t\"./logo_php\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_php.js\",\n\t\t\"icon.logo_php\"\n\t],\n\t\"./logo_php.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_php.js\",\n\t\t\"icon.logo_php\"\n\t],\n\t\"./logo_postgres\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_postgres.js\",\n\t\t\"icon.logo_postgres\"\n\t],\n\t\"./logo_postgres.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_postgres.js\",\n\t\t\"icon.logo_postgres\"\n\t],\n\t\"./logo_prometheus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_prometheus.js\",\n\t\t\"icon.logo_prometheus\"\n\t],\n\t\"./logo_prometheus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_prometheus.js\",\n\t\t\"icon.logo_prometheus\"\n\t],\n\t\"./logo_rabbitmq\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_rabbitmq.js\",\n\t\t\"icon.logo_rabbitmq\"\n\t],\n\t\"./logo_rabbitmq.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_rabbitmq.js\",\n\t\t\"icon.logo_rabbitmq\"\n\t],\n\t\"./logo_redis\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_redis.js\",\n\t\t\"icon.logo_redis\"\n\t],\n\t\"./logo_redis.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_redis.js\",\n\t\t\"icon.logo_redis\"\n\t],\n\t\"./logo_security\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_security.js\",\n\t\t\"icon.logo_security\"\n\t],\n\t\"./logo_security.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_security.js\",\n\t\t\"icon.logo_security\"\n\t],\n\t\"./logo_site_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_site_search.js\",\n\t\t\"icon.logo_site_search\"\n\t],\n\t\"./logo_site_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_site_search.js\",\n\t\t\"icon.logo_site_search\"\n\t],\n\t\"./logo_sketch\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_sketch.js\",\n\t\t\"icon.logo_sketch\"\n\t],\n\t\"./logo_sketch.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_sketch.js\",\n\t\t\"icon.logo_sketch\"\n\t],\n\t\"./logo_slack\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_slack.js\",\n\t\t\"icon.logo_slack\"\n\t],\n\t\"./logo_slack.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_slack.js\",\n\t\t\"icon.logo_slack\"\n\t],\n\t\"./logo_uptime\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_uptime.js\",\n\t\t\"icon.logo_uptime\"\n\t],\n\t\"./logo_uptime.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_uptime.js\",\n\t\t\"icon.logo_uptime\"\n\t],\n\t\"./logo_vulnerability_management\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_vulnerability_management.js\",\n\t\t\"icon.logo_vulnerability_management\"\n\t],\n\t\"./logo_vulnerability_management.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_vulnerability_management.js\",\n\t\t\"icon.logo_vulnerability_management\"\n\t],\n\t\"./logo_webhook\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_webhook.js\",\n\t\t\"icon.logo_webhook\"\n\t],\n\t\"./logo_webhook.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_webhook.js\",\n\t\t\"icon.logo_webhook\"\n\t],\n\t\"./logo_windows\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_windows.js\",\n\t\t\"icon.logo_windows\"\n\t],\n\t\"./logo_windows.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_windows.js\",\n\t\t\"icon.logo_windows\"\n\t],\n\t\"./logo_workplace_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_workplace_search.js\",\n\t\t\"icon.logo_workplace_search\"\n\t],\n\t\"./logo_workplace_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_workplace_search.js\",\n\t\t\"icon.logo_workplace_search\"\n\t],\n\t\"./logstash_filter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_filter.js\",\n\t\t\"icon.logstash_filter\"\n\t],\n\t\"./logstash_filter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_filter.js\",\n\t\t\"icon.logstash_filter\"\n\t],\n\t\"./logstash_if\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_if.js\",\n\t\t\"icon.logstash_if\"\n\t],\n\t\"./logstash_if.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_if.js\",\n\t\t\"icon.logstash_if\"\n\t],\n\t\"./logstash_input\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_input.js\",\n\t\t\"icon.logstash_input\"\n\t],\n\t\"./logstash_input.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_input.js\",\n\t\t\"icon.logstash_input\"\n\t],\n\t\"./logstash_output\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_output.js\",\n\t\t\"icon.logstash_output\"\n\t],\n\t\"./logstash_output.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_output.js\",\n\t\t\"icon.logstash_output\"\n\t],\n\t\"./logstash_queue\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_queue.js\",\n\t\t\"icon.logstash_queue\"\n\t],\n\t\"./logstash_queue.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_queue.js\",\n\t\t\"icon.logstash_queue\"\n\t],\n\t\"./magnet\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnet.js\",\n\t\t\"icon.magnet\"\n\t],\n\t\"./magnet.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnet.js\",\n\t\t\"icon.magnet\"\n\t],\n\t\"./magnifyWithExclamation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithExclamation.js\",\n\t\t\"icon.magnifyWithExclamation\"\n\t],\n\t\"./magnifyWithExclamation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithExclamation.js\",\n\t\t\"icon.magnifyWithExclamation\"\n\t],\n\t\"./magnifyWithMinus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithMinus.js\",\n\t\t\"icon.magnifyWithMinus\"\n\t],\n\t\"./magnifyWithMinus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithMinus.js\",\n\t\t\"icon.magnifyWithMinus\"\n\t],\n\t\"./magnifyWithPlus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithPlus.js\",\n\t\t\"icon.magnifyWithPlus\"\n\t],\n\t\"./magnifyWithPlus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithPlus.js\",\n\t\t\"icon.magnifyWithPlus\"\n\t],\n\t\"./map_marker\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/map_marker.js\",\n\t\t\"icon.map_marker\"\n\t],\n\t\"./map_marker.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/map_marker.js\",\n\t\t\"icon.map_marker\"\n\t],\n\t\"./memory\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/memory.js\",\n\t\t\"icon.memory\"\n\t],\n\t\"./memory.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/memory.js\",\n\t\t\"icon.memory\"\n\t],\n\t\"./menu\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menu.js\",\n\t\t\"icon.menu\"\n\t],\n\t\"./menu.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menu.js\",\n\t\t\"icon.menu\"\n\t],\n\t\"./menuDown\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuDown.js\",\n\t\t\"icon.menuDown\"\n\t],\n\t\"./menuDown.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuDown.js\",\n\t\t\"icon.menuDown\"\n\t],\n\t\"./menuLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuLeft.js\",\n\t\t\"icon.menuLeft\"\n\t],\n\t\"./menuLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuLeft.js\",\n\t\t\"icon.menuLeft\"\n\t],\n\t\"./menuRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuRight.js\",\n\t\t\"icon.menuRight\"\n\t],\n\t\"./menuRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuRight.js\",\n\t\t\"icon.menuRight\"\n\t],\n\t\"./menuUp\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuUp.js\",\n\t\t\"icon.menuUp\"\n\t],\n\t\"./menuUp.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuUp.js\",\n\t\t\"icon.menuUp\"\n\t],\n\t\"./merge\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/merge.js\",\n\t\t\"icon.merge\"\n\t],\n\t\"./merge.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/merge.js\",\n\t\t\"icon.merge\"\n\t],\n\t\"./minimize\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minimize.js\",\n\t\t\"icon.minimize\"\n\t],\n\t\"./minimize.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minimize.js\",\n\t\t\"icon.minimize\"\n\t],\n\t\"./minus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus.js\",\n\t\t\"icon.minus\"\n\t],\n\t\"./minus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus.js\",\n\t\t\"icon.minus\"\n\t],\n\t\"./minus_in_circle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus_in_circle.js\",\n\t\t\"icon.minus_in_circle\"\n\t],\n\t\"./minus_in_circle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus_in_circle.js\",\n\t\t\"icon.minus_in_circle\"\n\t],\n\t\"./minus_in_circle_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus_in_circle_filled.js\",\n\t\t\"icon.minus_in_circle_filled\"\n\t],\n\t\"./minus_in_circle_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus_in_circle_filled.js\",\n\t\t\"icon.minus_in_circle_filled\"\n\t],\n\t\"./ml_classification_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_classification_job.js\",\n\t\t\"icon.ml_classification_job\"\n\t],\n\t\"./ml_classification_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_classification_job.js\",\n\t\t\"icon.ml_classification_job\"\n\t],\n\t\"./ml_create_advanced_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_advanced_job.js\",\n\t\t\"icon.ml_create_advanced_job\"\n\t],\n\t\"./ml_create_advanced_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_advanced_job.js\",\n\t\t\"icon.ml_create_advanced_job\"\n\t],\n\t\"./ml_create_multi_metric_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_multi_metric_job.js\",\n\t\t\"icon.ml_create_multi_metric_job\"\n\t],\n\t\"./ml_create_multi_metric_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_multi_metric_job.js\",\n\t\t\"icon.ml_create_multi_metric_job\"\n\t],\n\t\"./ml_create_population_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_population_job.js\",\n\t\t\"icon.ml_create_population_job\"\n\t],\n\t\"./ml_create_population_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_population_job.js\",\n\t\t\"icon.ml_create_population_job\"\n\t],\n\t\"./ml_create_single_metric_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_single_metric_job.js\",\n\t\t\"icon.ml_create_single_metric_job\"\n\t],\n\t\"./ml_create_single_metric_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_single_metric_job.js\",\n\t\t\"icon.ml_create_single_metric_job\"\n\t],\n\t\"./ml_data_visualizer\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_data_visualizer.js\",\n\t\t\"icon.ml_data_visualizer\"\n\t],\n\t\"./ml_data_visualizer.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_data_visualizer.js\",\n\t\t\"icon.ml_data_visualizer\"\n\t],\n\t\"./ml_outlier_detection_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_outlier_detection_job.js\",\n\t\t\"icon.ml_outlier_detection_job\"\n\t],\n\t\"./ml_outlier_detection_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_outlier_detection_job.js\",\n\t\t\"icon.ml_outlier_detection_job\"\n\t],\n\t\"./ml_regression_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_regression_job.js\",\n\t\t\"icon.ml_regression_job\"\n\t],\n\t\"./ml_regression_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_regression_job.js\",\n\t\t\"icon.ml_regression_job\"\n\t],\n\t\"./mobile\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/mobile.js\",\n\t\t\"icon.mobile\"\n\t],\n\t\"./mobile.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/mobile.js\",\n\t\t\"icon.mobile\"\n\t],\n\t\"./moon\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/moon.js\",\n\t\t\"icon.moon\"\n\t],\n\t\"./moon.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/moon.js\",\n\t\t\"icon.moon\"\n\t],\n\t\"./namespace\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/namespace.js\",\n\t\t\"icon.namespace\"\n\t],\n\t\"./namespace.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/namespace.js\",\n\t\t\"icon.namespace\"\n\t],\n\t\"./nested\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/nested.js\",\n\t\t\"icon.nested\"\n\t],\n\t\"./nested.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/nested.js\",\n\t\t\"icon.nested\"\n\t],\n\t\"./new_chat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/new_chat.js\",\n\t\t\"icon.new_chat\"\n\t],\n\t\"./new_chat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/new_chat.js\",\n\t\t\"icon.new_chat\"\n\t],\n\t\"./node\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/node.js\",\n\t\t\"icon.node\"\n\t],\n\t\"./node.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/node.js\",\n\t\t\"icon.node\"\n\t],\n\t\"./number\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/number.js\",\n\t\t\"icon.number\"\n\t],\n\t\"./number.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/number.js\",\n\t\t\"icon.number\"\n\t],\n\t\"./offline\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/offline.js\",\n\t\t\"icon.offline\"\n\t],\n\t\"./offline.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/offline.js\",\n\t\t\"icon.offline\"\n\t],\n\t\"./online\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/online.js\",\n\t\t\"icon.online\"\n\t],\n\t\"./online.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/online.js\",\n\t\t\"icon.online\"\n\t],\n\t\"./package\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/package.js\",\n\t\t\"icon.package\"\n\t],\n\t\"./package.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/package.js\",\n\t\t\"icon.package\"\n\t],\n\t\"./pageSelect\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pageSelect.js\",\n\t\t\"icon.pageSelect\"\n\t],\n\t\"./pageSelect.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pageSelect.js\",\n\t\t\"icon.pageSelect\"\n\t],\n\t\"./pagesSelect\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pagesSelect.js\",\n\t\t\"icon.pagesSelect\"\n\t],\n\t\"./pagesSelect.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pagesSelect.js\",\n\t\t\"icon.pagesSelect\"\n\t],\n\t\"./paint\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/paint.js\",\n\t\t\"icon.paint\"\n\t],\n\t\"./paint.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/paint.js\",\n\t\t\"icon.paint\"\n\t],\n\t\"./palette\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/palette.js\",\n\t\t\"icon.palette\"\n\t],\n\t\"./palette.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/palette.js\",\n\t\t\"icon.palette\"\n\t],\n\t\"./paper_clip\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/paper_clip.js\",\n\t\t\"icon.paper_clip\"\n\t],\n\t\"./paper_clip.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/paper_clip.js\",\n\t\t\"icon.paper_clip\"\n\t],\n\t\"./partial\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/partial.js\",\n\t\t\"icon.partial\"\n\t],\n\t\"./partial.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/partial.js\",\n\t\t\"icon.partial\"\n\t],\n\t\"./pause\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pause.js\",\n\t\t\"icon.pause\"\n\t],\n\t\"./pause.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pause.js\",\n\t\t\"icon.pause\"\n\t],\n\t\"./payment\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/payment.js\",\n\t\t\"icon.payment\"\n\t],\n\t\"./payment.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/payment.js\",\n\t\t\"icon.payment\"\n\t],\n\t\"./pencil\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pencil.js\",\n\t\t\"icon.pencil\"\n\t],\n\t\"./pencil.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pencil.js\",\n\t\t\"icon.pencil\"\n\t],\n\t\"./percent\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/percent.js\",\n\t\t\"icon.percent\"\n\t],\n\t\"./percent.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/percent.js\",\n\t\t\"icon.percent\"\n\t],\n\t\"./pin\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pin.js\",\n\t\t\"icon.pin\"\n\t],\n\t\"./pin.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pin.js\",\n\t\t\"icon.pin\"\n\t],\n\t\"./pin_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pin_filled.js\",\n\t\t\"icon.pin_filled\"\n\t],\n\t\"./pin_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pin_filled.js\",\n\t\t\"icon.pin_filled\"\n\t],\n\t\"./pipeBreaks\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pipeBreaks.js\",\n\t\t\"icon.pipeBreaks\"\n\t],\n\t\"./pipeBreaks.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pipeBreaks.js\",\n\t\t\"icon.pipeBreaks\"\n\t],\n\t\"./pipeNoBreaks\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pipeNoBreaks.js\",\n\t\t\"icon.pipeNoBreaks\"\n\t],\n\t\"./pipeNoBreaks.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pipeNoBreaks.js\",\n\t\t\"icon.pipeNoBreaks\"\n\t],\n\t\"./pivot\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pivot.js\",\n\t\t\"icon.pivot\"\n\t],\n\t\"./pivot.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pivot.js\",\n\t\t\"icon.pivot\"\n\t],\n\t\"./play\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/play.js\",\n\t\t\"icon.play\"\n\t],\n\t\"./play.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/play.js\",\n\t\t\"icon.play\"\n\t],\n\t\"./playFilled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/playFilled.js\",\n\t\t\"icon.playFilled\"\n\t],\n\t\"./playFilled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/playFilled.js\",\n\t\t\"icon.playFilled\"\n\t],\n\t\"./plus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus.js\",\n\t\t\"icon.plus\"\n\t],\n\t\"./plus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus.js\",\n\t\t\"icon.plus\"\n\t],\n\t\"./plus_in_circle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus_in_circle.js\",\n\t\t\"icon.plus_in_circle\"\n\t],\n\t\"./plus_in_circle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus_in_circle.js\",\n\t\t\"icon.plus_in_circle\"\n\t],\n\t\"./plus_in_circle_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus_in_circle_filled.js\",\n\t\t\"icon.plus_in_circle_filled\"\n\t],\n\t\"./plus_in_circle_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus_in_circle_filled.js\",\n\t\t\"icon.plus_in_circle_filled\"\n\t],\n\t\"./popout\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/popout.js\",\n\t\t\"icon.popout\"\n\t],\n\t\"./popout.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/popout.js\",\n\t\t\"icon.popout\"\n\t],\n\t\"./push\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/push.js\",\n\t\t\"icon.push\"\n\t],\n\t\"./push.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/push.js\",\n\t\t\"icon.push\"\n\t],\n\t\"./question_in_circle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/question_in_circle.js\",\n\t\t\"icon.question_in_circle\"\n\t],\n\t\"./question_in_circle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/question_in_circle.js\",\n\t\t\"icon.question_in_circle\"\n\t],\n\t\"./quote\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/quote.js\",\n\t\t\"icon.quote\"\n\t],\n\t\"./quote.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/quote.js\",\n\t\t\"icon.quote\"\n\t],\n\t\"./refresh\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/refresh.js\",\n\t\t\"icon.refresh\"\n\t],\n\t\"./refresh.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/refresh.js\",\n\t\t\"icon.refresh\"\n\t],\n\t\"./reporter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/reporter.js\",\n\t\t\"icon.reporter\"\n\t],\n\t\"./reporter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/reporter.js\",\n\t\t\"icon.reporter\"\n\t],\n\t\"./return_key\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/return_key.js\",\n\t\t\"icon.return_key\"\n\t],\n\t\"./return_key.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/return_key.js\",\n\t\t\"icon.return_key\"\n\t],\n\t\"./save\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/save.js\",\n\t\t\"icon.save\"\n\t],\n\t\"./save.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/save.js\",\n\t\t\"icon.save\"\n\t],\n\t\"./scale\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/scale.js\",\n\t\t\"icon.scale\"\n\t],\n\t\"./scale.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/scale.js\",\n\t\t\"icon.scale\"\n\t],\n\t\"./search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/search.js\",\n\t\t\"icon.search\"\n\t],\n\t\"./search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/search.js\",\n\t\t\"icon.search\"\n\t],\n\t\"./securitySignal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignal.js\",\n\t\t\"icon.securitySignal\"\n\t],\n\t\"./securitySignal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignal.js\",\n\t\t\"icon.securitySignal\"\n\t],\n\t\"./securitySignalDetected\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignalDetected.js\",\n\t\t\"icon.securitySignalDetected\"\n\t],\n\t\"./securitySignalDetected.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignalDetected.js\",\n\t\t\"icon.securitySignalDetected\"\n\t],\n\t\"./securitySignalResolved\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignalResolved.js\",\n\t\t\"icon.securitySignalResolved\"\n\t],\n\t\"./securitySignalResolved.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignalResolved.js\",\n\t\t\"icon.securitySignalResolved\"\n\t],\n\t\"./sessionViewer\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sessionViewer.js\",\n\t\t\"icon.sessionViewer\"\n\t],\n\t\"./sessionViewer.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sessionViewer.js\",\n\t\t\"icon.sessionViewer\"\n\t],\n\t\"./shard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/shard.js\",\n\t\t\"icon.shard\"\n\t],\n\t\"./shard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/shard.js\",\n\t\t\"icon.shard\"\n\t],\n\t\"./share\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/share.js\",\n\t\t\"icon.share\"\n\t],\n\t\"./share.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/share.js\",\n\t\t\"icon.share\"\n\t],\n\t\"./snowflake\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/snowflake.js\",\n\t\t\"icon.snowflake\"\n\t],\n\t\"./snowflake.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/snowflake.js\",\n\t\t\"icon.snowflake\"\n\t],\n\t\"./sortAscending\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortAscending.js\",\n\t\t\"icon.sortAscending\"\n\t],\n\t\"./sortAscending.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortAscending.js\",\n\t\t\"icon.sortAscending\"\n\t],\n\t\"./sortDescending\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortDescending.js\",\n\t\t\"icon.sortDescending\"\n\t],\n\t\"./sortDescending.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortDescending.js\",\n\t\t\"icon.sortDescending\"\n\t],\n\t\"./sortLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortLeft.js\",\n\t\t\"icon.sortLeft\"\n\t],\n\t\"./sortLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortLeft.js\",\n\t\t\"icon.sortLeft\"\n\t],\n\t\"./sortRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortRight.js\",\n\t\t\"icon.sortRight\"\n\t],\n\t\"./sortRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortRight.js\",\n\t\t\"icon.sortRight\"\n\t],\n\t\"./sort_down\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sort_down.js\",\n\t\t\"icon.sort_down\"\n\t],\n\t\"./sort_down.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sort_down.js\",\n\t\t\"icon.sort_down\"\n\t],\n\t\"./sort_up\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sort_up.js\",\n\t\t\"icon.sort_up\"\n\t],\n\t\"./sort_up.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sort_up.js\",\n\t\t\"icon.sort_up\"\n\t],\n\t\"./sortable\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortable.js\",\n\t\t\"icon.sortable\"\n\t],\n\t\"./sortable.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortable.js\",\n\t\t\"icon.sortable\"\n\t],\n\t\"./spaces\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/spaces.js\",\n\t\t\"icon.spaces\"\n\t],\n\t\"./spaces.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/spaces.js\",\n\t\t\"icon.spaces\"\n\t],\n\t\"./sparkles\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sparkles.js\",\n\t\t\"icon.sparkles\"\n\t],\n\t\"./sparkles.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sparkles.js\",\n\t\t\"icon.sparkles\"\n\t],\n\t\"./starPlusEmpty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/starPlusEmpty.js\",\n\t\t\"icon.starPlusEmpty\"\n\t],\n\t\"./starPlusEmpty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/starPlusEmpty.js\",\n\t\t\"icon.starPlusEmpty\"\n\t],\n\t\"./starPlusFilled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/starPlusFilled.js\",\n\t\t\"icon.starPlusFilled\"\n\t],\n\t\"./starPlusFilled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/starPlusFilled.js\",\n\t\t\"icon.starPlusFilled\"\n\t],\n\t\"./star_empty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_empty.js\",\n\t\t\"icon.star_empty\"\n\t],\n\t\"./star_empty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_empty.js\",\n\t\t\"icon.star_empty\"\n\t],\n\t\"./star_empty_space\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_empty_space.js\",\n\t\t\"icon.star_empty_space\"\n\t],\n\t\"./star_empty_space.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_empty_space.js\",\n\t\t\"icon.star_empty_space\"\n\t],\n\t\"./star_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_filled.js\",\n\t\t\"icon.star_filled\"\n\t],\n\t\"./star_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_filled.js\",\n\t\t\"icon.star_filled\"\n\t],\n\t\"./star_filled_space\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_filled_space.js\",\n\t\t\"icon.star_filled_space\"\n\t],\n\t\"./star_filled_space.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_filled_space.js\",\n\t\t\"icon.star_filled_space\"\n\t],\n\t\"./star_minus_empty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_minus_empty.js\",\n\t\t\"icon.star_minus_empty\"\n\t],\n\t\"./star_minus_empty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_minus_empty.js\",\n\t\t\"icon.star_minus_empty\"\n\t],\n\t\"./star_minus_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_minus_filled.js\",\n\t\t\"icon.star_minus_filled\"\n\t],\n\t\"./star_minus_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_minus_filled.js\",\n\t\t\"icon.star_minus_filled\"\n\t],\n\t\"./stats\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stats.js\",\n\t\t\"icon.stats\"\n\t],\n\t\"./stats.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stats.js\",\n\t\t\"icon.stats\"\n\t],\n\t\"./stop\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop.js\",\n\t\t\"icon.stop\"\n\t],\n\t\"./stop.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop.js\",\n\t\t\"icon.stop\"\n\t],\n\t\"./stop_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop_filled.js\",\n\t\t\"icon.stop_filled\"\n\t],\n\t\"./stop_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop_filled.js\",\n\t\t\"icon.stop_filled\"\n\t],\n\t\"./stop_slash\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop_slash.js\",\n\t\t\"icon.stop_slash\"\n\t],\n\t\"./stop_slash.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop_slash.js\",\n\t\t\"icon.stop_slash\"\n\t],\n\t\"./storage\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/storage.js\",\n\t\t\"icon.storage\"\n\t],\n\t\"./storage.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/storage.js\",\n\t\t\"icon.storage\"\n\t],\n\t\"./string\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/string.js\",\n\t\t\"icon.string\"\n\t],\n\t\"./string.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/string.js\",\n\t\t\"icon.string\"\n\t],\n\t\"./submodule\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/submodule.js\",\n\t\t\"icon.submodule\"\n\t],\n\t\"./submodule.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/submodule.js\",\n\t\t\"icon.submodule\"\n\t],\n\t\"./sun\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sun.js\",\n\t\t\"icon.sun\"\n\t],\n\t\"./sun.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sun.js\",\n\t\t\"icon.sun\"\n\t],\n\t\"./swatch_input\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/swatch_input.js\",\n\t\t\"icon.swatch_input\"\n\t],\n\t\"./swatch_input.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/swatch_input.js\",\n\t\t\"icon.swatch_input\"\n\t],\n\t\"./symlink\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/symlink.js\",\n\t\t\"icon.symlink\"\n\t],\n\t\"./symlink.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/symlink.js\",\n\t\t\"icon.symlink\"\n\t],\n\t\"./tableOfContents\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tableOfContents.js\",\n\t\t\"icon.tableOfContents\"\n\t],\n\t\"./tableOfContents.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tableOfContents.js\",\n\t\t\"icon.tableOfContents\"\n\t],\n\t\"./table_density_compact\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_compact.js\",\n\t\t\"icon.table_density_compact\"\n\t],\n\t\"./table_density_compact.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_compact.js\",\n\t\t\"icon.table_density_compact\"\n\t],\n\t\"./table_density_expanded\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_expanded.js\",\n\t\t\"icon.table_density_expanded\"\n\t],\n\t\"./table_density_expanded.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_expanded.js\",\n\t\t\"icon.table_density_expanded\"\n\t],\n\t\"./table_density_normal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_normal.js\",\n\t\t\"icon.table_density_normal\"\n\t],\n\t\"./table_density_normal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_normal.js\",\n\t\t\"icon.table_density_normal\"\n\t],\n\t\"./tag\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tag.js\",\n\t\t\"icon.tag\"\n\t],\n\t\"./tag.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tag.js\",\n\t\t\"icon.tag\"\n\t],\n\t\"./tear\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tear.js\",\n\t\t\"icon.tear\"\n\t],\n\t\"./tear.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tear.js\",\n\t\t\"icon.tear\"\n\t],\n\t\"./temperature\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/temperature.js\",\n\t\t\"icon.temperature\"\n\t],\n\t\"./temperature.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/temperature.js\",\n\t\t\"icon.temperature\"\n\t],\n\t\"./timeRefresh\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeRefresh.js\",\n\t\t\"icon.timeRefresh\"\n\t],\n\t\"./timeRefresh.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeRefresh.js\",\n\t\t\"icon.timeRefresh\"\n\t],\n\t\"./timeline\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeline.js\",\n\t\t\"icon.timeline\"\n\t],\n\t\"./timeline.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeline.js\",\n\t\t\"icon.timeline\"\n\t],\n\t\"./timelineWithArrow\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timelineWithArrow.js\",\n\t\t\"icon.timelineWithArrow\"\n\t],\n\t\"./timelineWithArrow.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timelineWithArrow.js\",\n\t\t\"icon.timelineWithArrow\"\n\t],\n\t\"./timeslider\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeslider.js\",\n\t\t\"icon.timeslider\"\n\t],\n\t\"./timeslider.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeslider.js\",\n\t\t\"icon.timeslider\"\n\t],\n\t\"./tokenAlias\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenAlias.js\",\n\t\t\"icon.tokenAlias\"\n\t],\n\t\"./tokenAlias.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenAlias.js\",\n\t\t\"icon.tokenAlias\"\n\t],\n\t\"./tokenAnnotation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenAnnotation.js\",\n\t\t\"icon.tokenAnnotation\"\n\t],\n\t\"./tokenAnnotation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenAnnotation.js\",\n\t\t\"icon.tokenAnnotation\"\n\t],\n\t\"./tokenArray\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenArray.js\",\n\t\t\"icon.tokenArray\"\n\t],\n\t\"./tokenArray.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenArray.js\",\n\t\t\"icon.tokenArray\"\n\t],\n\t\"./tokenBinary\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenBinary.js\",\n\t\t\"icon.tokenBinary\"\n\t],\n\t\"./tokenBinary.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenBinary.js\",\n\t\t\"icon.tokenBinary\"\n\t],\n\t\"./tokenBoolean\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenBoolean.js\",\n\t\t\"icon.tokenBoolean\"\n\t],\n\t\"./tokenBoolean.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenBoolean.js\",\n\t\t\"icon.tokenBoolean\"\n\t],\n\t\"./tokenClass\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenClass.js\",\n\t\t\"icon.tokenClass\"\n\t],\n\t\"./tokenClass.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenClass.js\",\n\t\t\"icon.tokenClass\"\n\t],\n\t\"./tokenCompletionSuggester\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenCompletionSuggester.js\",\n\t\t\"icon.tokenCompletionSuggester\"\n\t],\n\t\"./tokenCompletionSuggester.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenCompletionSuggester.js\",\n\t\t\"icon.tokenCompletionSuggester\"\n\t],\n\t\"./tokenConstant\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenConstant.js\",\n\t\t\"icon.tokenConstant\"\n\t],\n\t\"./tokenConstant.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenConstant.js\",\n\t\t\"icon.tokenConstant\"\n\t],\n\t\"./tokenDate\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenDate.js\",\n\t\t\"icon.tokenDate\"\n\t],\n\t\"./tokenDate.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenDate.js\",\n\t\t\"icon.tokenDate\"\n\t],\n\t\"./tokenElement\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenElement.js\",\n\t\t\"icon.tokenElement\"\n\t],\n\t\"./tokenElement.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenElement.js\",\n\t\t\"icon.tokenElement\"\n\t],\n\t\"./tokenEnum\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEnum.js\",\n\t\t\"icon.tokenEnum\"\n\t],\n\t\"./tokenEnum.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEnum.js\",\n\t\t\"icon.tokenEnum\"\n\t],\n\t\"./tokenEnumMember\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEnumMember.js\",\n\t\t\"icon.tokenEnumMember\"\n\t],\n\t\"./tokenEnumMember.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEnumMember.js\",\n\t\t\"icon.tokenEnumMember\"\n\t],\n\t\"./tokenEvent\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEvent.js\",\n\t\t\"icon.tokenEvent\"\n\t],\n\t\"./tokenEvent.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEvent.js\",\n\t\t\"icon.tokenEvent\"\n\t],\n\t\"./tokenException\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenException.js\",\n\t\t\"icon.tokenException\"\n\t],\n\t\"./tokenException.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenException.js\",\n\t\t\"icon.tokenException\"\n\t],\n\t\"./tokenField\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenField.js\",\n\t\t\"icon.tokenField\"\n\t],\n\t\"./tokenField.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenField.js\",\n\t\t\"icon.tokenField\"\n\t],\n\t\"./tokenFile\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFile.js\",\n\t\t\"icon.tokenFile\"\n\t],\n\t\"./tokenFile.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFile.js\",\n\t\t\"icon.tokenFile\"\n\t],\n\t\"./tokenFlattened\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFlattened.js\",\n\t\t\"icon.tokenFlattened\"\n\t],\n\t\"./tokenFlattened.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFlattened.js\",\n\t\t\"icon.tokenFlattened\"\n\t],\n\t\"./tokenFunction\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFunction.js\",\n\t\t\"icon.tokenFunction\"\n\t],\n\t\"./tokenFunction.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFunction.js\",\n\t\t\"icon.tokenFunction\"\n\t],\n\t\"./tokenGeo\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenGeo.js\",\n\t\t\"icon.tokenGeo\"\n\t],\n\t\"./tokenGeo.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenGeo.js\",\n\t\t\"icon.tokenGeo\"\n\t],\n\t\"./tokenHistogram\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenHistogram.js\",\n\t\t\"icon.tokenHistogram\"\n\t],\n\t\"./tokenHistogram.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenHistogram.js\",\n\t\t\"icon.tokenHistogram\"\n\t],\n\t\"./tokenIP\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenIP.js\",\n\t\t\"icon.tokenIP\"\n\t],\n\t\"./tokenIP.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenIP.js\",\n\t\t\"icon.tokenIP\"\n\t],\n\t\"./tokenInterface\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenInterface.js\",\n\t\t\"icon.tokenInterface\"\n\t],\n\t\"./tokenInterface.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenInterface.js\",\n\t\t\"icon.tokenInterface\"\n\t],\n\t\"./tokenJoin\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenJoin.js\",\n\t\t\"icon.tokenJoin\"\n\t],\n\t\"./tokenJoin.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenJoin.js\",\n\t\t\"icon.tokenJoin\"\n\t],\n\t\"./tokenKey\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenKey.js\",\n\t\t\"icon.tokenKey\"\n\t],\n\t\"./tokenKey.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenKey.js\",\n\t\t\"icon.tokenKey\"\n\t],\n\t\"./tokenKeyword\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenKeyword.js\",\n\t\t\"icon.tokenKeyword\"\n\t],\n\t\"./tokenKeyword.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenKeyword.js\",\n\t\t\"icon.tokenKeyword\"\n\t],\n\t\"./tokenMethod\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMethod.js\",\n\t\t\"icon.tokenMethod\"\n\t],\n\t\"./tokenMethod.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMethod.js\",\n\t\t\"icon.tokenMethod\"\n\t],\n\t\"./tokenMetricCounter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMetricCounter.js\",\n\t\t\"icon.tokenMetricCounter\"\n\t],\n\t\"./tokenMetricCounter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMetricCounter.js\",\n\t\t\"icon.tokenMetricCounter\"\n\t],\n\t\"./tokenMetricGauge\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMetricGauge.js\",\n\t\t\"icon.tokenMetricGauge\"\n\t],\n\t\"./tokenMetricGauge.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMetricGauge.js\",\n\t\t\"icon.tokenMetricGauge\"\n\t],\n\t\"./tokenModule\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenModule.js\",\n\t\t\"icon.tokenModule\"\n\t],\n\t\"./tokenModule.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenModule.js\",\n\t\t\"icon.tokenModule\"\n\t],\n\t\"./tokenNamespace\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNamespace.js\",\n\t\t\"icon.tokenNamespace\"\n\t],\n\t\"./tokenNamespace.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNamespace.js\",\n\t\t\"icon.tokenNamespace\"\n\t],\n\t\"./tokenNested\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNested.js\",\n\t\t\"icon.tokenNested\"\n\t],\n\t\"./tokenNested.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNested.js\",\n\t\t\"icon.tokenNested\"\n\t],\n\t\"./tokenNull\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNull.js\",\n\t\t\"icon.tokenNull\"\n\t],\n\t\"./tokenNull.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNull.js\",\n\t\t\"icon.tokenNull\"\n\t],\n\t\"./tokenNumber\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNumber.js\",\n\t\t\"icon.tokenNumber\"\n\t],\n\t\"./tokenNumber.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNumber.js\",\n\t\t\"icon.tokenNumber\"\n\t],\n\t\"./tokenObject\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenObject.js\",\n\t\t\"icon.tokenObject\"\n\t],\n\t\"./tokenObject.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenObject.js\",\n\t\t\"icon.tokenObject\"\n\t],\n\t\"./tokenOperator\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenOperator.js\",\n\t\t\"icon.tokenOperator\"\n\t],\n\t\"./tokenOperator.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenOperator.js\",\n\t\t\"icon.tokenOperator\"\n\t],\n\t\"./tokenPackage\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenPackage.js\",\n\t\t\"icon.tokenPackage\"\n\t],\n\t\"./tokenPackage.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenPackage.js\",\n\t\t\"icon.tokenPackage\"\n\t],\n\t\"./tokenParameter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenParameter.js\",\n\t\t\"icon.tokenParameter\"\n\t],\n\t\"./tokenParameter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenParameter.js\",\n\t\t\"icon.tokenParameter\"\n\t],\n\t\"./tokenPercolator\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenPercolator.js\",\n\t\t\"icon.tokenPercolator\"\n\t],\n\t\"./tokenPercolator.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenPercolator.js\",\n\t\t\"icon.tokenPercolator\"\n\t],\n\t\"./tokenProperty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenProperty.js\",\n\t\t\"icon.tokenProperty\"\n\t],\n\t\"./tokenProperty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenProperty.js\",\n\t\t\"icon.tokenProperty\"\n\t],\n\t\"./tokenRange\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRange.js\",\n\t\t\"icon.tokenRange\"\n\t],\n\t\"./tokenRange.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRange.js\",\n\t\t\"icon.tokenRange\"\n\t],\n\t\"./tokenRankFeature\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRankFeature.js\",\n\t\t\"icon.tokenRankFeature\"\n\t],\n\t\"./tokenRankFeature.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRankFeature.js\",\n\t\t\"icon.tokenRankFeature\"\n\t],\n\t\"./tokenRankFeatures\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRankFeatures.js\",\n\t\t\"icon.tokenRankFeatures\"\n\t],\n\t\"./tokenRankFeatures.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRankFeatures.js\",\n\t\t\"icon.tokenRankFeatures\"\n\t],\n\t\"./tokenRepo\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRepo.js\",\n\t\t\"icon.tokenRepo\"\n\t],\n\t\"./tokenRepo.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRepo.js\",\n\t\t\"icon.tokenRepo\"\n\t],\n\t\"./tokenSearchType\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenSearchType.js\",\n\t\t\"icon.tokenSearchType\"\n\t],\n\t\"./tokenSearchType.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenSearchType.js\",\n\t\t\"icon.tokenSearchType\"\n\t],\n\t\"./tokenShape\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenShape.js\",\n\t\t\"icon.tokenShape\"\n\t],\n\t\"./tokenShape.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenShape.js\",\n\t\t\"icon.tokenShape\"\n\t],\n\t\"./tokenString\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenString.js\",\n\t\t\"icon.tokenString\"\n\t],\n\t\"./tokenString.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenString.js\",\n\t\t\"icon.tokenString\"\n\t],\n\t\"./tokenStruct\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenStruct.js\",\n\t\t\"icon.tokenStruct\"\n\t],\n\t\"./tokenStruct.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenStruct.js\",\n\t\t\"icon.tokenStruct\"\n\t],\n\t\"./tokenSymbol\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenSymbol.js\",\n\t\t\"icon.tokenSymbol\"\n\t],\n\t\"./tokenSymbol.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenSymbol.js\",\n\t\t\"icon.tokenSymbol\"\n\t],\n\t\"./tokenTag\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenTag.js\",\n\t\t\"icon.tokenTag\"\n\t],\n\t\"./tokenTag.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenTag.js\",\n\t\t\"icon.tokenTag\"\n\t],\n\t\"./tokenText\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenText.js\",\n\t\t\"icon.tokenText\"\n\t],\n\t\"./tokenText.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenText.js\",\n\t\t\"icon.tokenText\"\n\t],\n\t\"./tokenTokenCount\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenTokenCount.js\",\n\t\t\"icon.tokenTokenCount\"\n\t],\n\t\"./tokenTokenCount.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenTokenCount.js\",\n\t\t\"icon.tokenTokenCount\"\n\t],\n\t\"./tokenVariable\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVariable.js\",\n\t\t\"icon.tokenVariable\"\n\t],\n\t\"./tokenVariable.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVariable.js\",\n\t\t\"icon.tokenVariable\"\n\t],\n\t\"./tokenVectorDense\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVectorDense.js\",\n\t\t\"icon.tokenVectorDense\"\n\t],\n\t\"./tokenVectorDense.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVectorDense.js\",\n\t\t\"icon.tokenVectorDense\"\n\t],\n\t\"./tokenVectorSparse\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVectorSparse.js\",\n\t\t\"icon.tokenVectorSparse\"\n\t],\n\t\"./tokenVectorSparse.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVectorSparse.js\",\n\t\t\"icon.tokenVectorSparse\"\n\t],\n\t\"./training\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/training.js\",\n\t\t\"icon.training\"\n\t],\n\t\"./training.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/training.js\",\n\t\t\"icon.training\"\n\t],\n\t\"./transitionLeftIn\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionLeftIn.js\",\n\t\t\"icon.transitionLeftIn\"\n\t],\n\t\"./transitionLeftIn.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionLeftIn.js\",\n\t\t\"icon.transitionLeftIn\"\n\t],\n\t\"./transitionLeftOut\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionLeftOut.js\",\n\t\t\"icon.transitionLeftOut\"\n\t],\n\t\"./transitionLeftOut.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionLeftOut.js\",\n\t\t\"icon.transitionLeftOut\"\n\t],\n\t\"./transitionTopIn\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionTopIn.js\",\n\t\t\"icon.transitionTopIn\"\n\t],\n\t\"./transitionTopIn.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionTopIn.js\",\n\t\t\"icon.transitionTopIn\"\n\t],\n\t\"./transitionTopOut\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionTopOut.js\",\n\t\t\"icon.transitionTopOut\"\n\t],\n\t\"./transitionTopOut.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionTopOut.js\",\n\t\t\"icon.transitionTopOut\"\n\t],\n\t\"./trash\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/trash.js\",\n\t\t\"icon.trash\"\n\t],\n\t\"./trash.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/trash.js\",\n\t\t\"icon.trash\"\n\t],\n\t\"./unfold\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/unfold.js\",\n\t\t\"icon.unfold\"\n\t],\n\t\"./unfold.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/unfold.js\",\n\t\t\"icon.unfold\"\n\t],\n\t\"./unlink\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/unlink.js\",\n\t\t\"icon.unlink\"\n\t],\n\t\"./unlink.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/unlink.js\",\n\t\t\"icon.unlink\"\n\t],\n\t\"./user\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/user.js\",\n\t\t\"icon.user\"\n\t],\n\t\"./user.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/user.js\",\n\t\t\"icon.user\"\n\t],\n\t\"./userAvatar\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/userAvatar.js\",\n\t\t\"icon.userAvatar\"\n\t],\n\t\"./userAvatar.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/userAvatar.js\",\n\t\t\"icon.userAvatar\"\n\t],\n\t\"./users\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/users.js\",\n\t\t\"icon.users\"\n\t],\n\t\"./users.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/users.js\",\n\t\t\"icon.users\"\n\t],\n\t\"./vector\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vector.js\",\n\t\t\"icon.vector\"\n\t],\n\t\"./vector.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vector.js\",\n\t\t\"icon.vector\"\n\t],\n\t\"./videoPlayer\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/videoPlayer.js\",\n\t\t\"icon.videoPlayer\"\n\t],\n\t\"./videoPlayer.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/videoPlayer.js\",\n\t\t\"icon.videoPlayer\"\n\t],\n\t\"./vis_area\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_area.js\",\n\t\t\"icon.vis_area\"\n\t],\n\t\"./vis_area.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_area.js\",\n\t\t\"icon.vis_area\"\n\t],\n\t\"./vis_area_stacked\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_area_stacked.js\",\n\t\t\"icon.vis_area_stacked\"\n\t],\n\t\"./vis_area_stacked.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_area_stacked.js\",\n\t\t\"icon.vis_area_stacked\"\n\t],\n\t\"./vis_bar_horizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_horizontal.js\",\n\t\t\"icon.vis_bar_horizontal\"\n\t],\n\t\"./vis_bar_horizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_horizontal.js\",\n\t\t\"icon.vis_bar_horizontal\"\n\t],\n\t\"./vis_bar_horizontal_stacked\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_horizontal_stacked.js\",\n\t\t\"icon.vis_bar_horizontal_stacked\"\n\t],\n\t\"./vis_bar_horizontal_stacked.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_horizontal_stacked.js\",\n\t\t\"icon.vis_bar_horizontal_stacked\"\n\t],\n\t\"./vis_bar_vertical\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_vertical.js\",\n\t\t\"icon.vis_bar_vertical\"\n\t],\n\t\"./vis_bar_vertical.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_vertical.js\",\n\t\t\"icon.vis_bar_vertical\"\n\t],\n\t\"./vis_bar_vertical_stacked\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_vertical_stacked.js\",\n\t\t\"icon.vis_bar_vertical_stacked\"\n\t],\n\t\"./vis_bar_vertical_stacked.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_vertical_stacked.js\",\n\t\t\"icon.vis_bar_vertical_stacked\"\n\t],\n\t\"./vis_gauge\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_gauge.js\",\n\t\t\"icon.vis_gauge\"\n\t],\n\t\"./vis_gauge.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_gauge.js\",\n\t\t\"icon.vis_gauge\"\n\t],\n\t\"./vis_goal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_goal.js\",\n\t\t\"icon.vis_goal\"\n\t],\n\t\"./vis_goal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_goal.js\",\n\t\t\"icon.vis_goal\"\n\t],\n\t\"./vis_line\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_line.js\",\n\t\t\"icon.vis_line\"\n\t],\n\t\"./vis_line.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_line.js\",\n\t\t\"icon.vis_line\"\n\t],\n\t\"./vis_map_coordinate\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_map_coordinate.js\",\n\t\t\"icon.vis_map_coordinate\"\n\t],\n\t\"./vis_map_coordinate.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_map_coordinate.js\",\n\t\t\"icon.vis_map_coordinate\"\n\t],\n\t\"./vis_map_region\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_map_region.js\",\n\t\t\"icon.vis_map_region\"\n\t],\n\t\"./vis_map_region.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_map_region.js\",\n\t\t\"icon.vis_map_region\"\n\t],\n\t\"./vis_metric\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_metric.js\",\n\t\t\"icon.vis_metric\"\n\t],\n\t\"./vis_metric.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_metric.js\",\n\t\t\"icon.vis_metric\"\n\t],\n\t\"./vis_pie\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_pie.js\",\n\t\t\"icon.vis_pie\"\n\t],\n\t\"./vis_pie.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_pie.js\",\n\t\t\"icon.vis_pie\"\n\t],\n\t\"./vis_table\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_table.js\",\n\t\t\"icon.vis_table\"\n\t],\n\t\"./vis_table.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_table.js\",\n\t\t\"icon.vis_table\"\n\t],\n\t\"./vis_tag_cloud\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_tag_cloud.js\",\n\t\t\"icon.vis_tag_cloud\"\n\t],\n\t\"./vis_tag_cloud.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_tag_cloud.js\",\n\t\t\"icon.vis_tag_cloud\"\n\t],\n\t\"./vis_text\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_text.js\",\n\t\t\"icon.vis_text\"\n\t],\n\t\"./vis_text.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_text.js\",\n\t\t\"icon.vis_text\"\n\t],\n\t\"./vis_timelion\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_timelion.js\",\n\t\t\"icon.vis_timelion\"\n\t],\n\t\"./vis_timelion.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_timelion.js\",\n\t\t\"icon.vis_timelion\"\n\t],\n\t\"./vis_vega\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_vega.js\",\n\t\t\"icon.vis_vega\"\n\t],\n\t\"./vis_vega.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_vega.js\",\n\t\t\"icon.vis_vega\"\n\t],\n\t\"./vis_visual_builder\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_visual_builder.js\",\n\t\t\"icon.vis_visual_builder\"\n\t],\n\t\"./vis_visual_builder.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_visual_builder.js\",\n\t\t\"icon.vis_visual_builder\"\n\t],\n\t\"./warning\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/warning.js\",\n\t\t\"icon.warning\"\n\t],\n\t\"./warning.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/warning.js\",\n\t\t\"icon.warning\"\n\t],\n\t\"./wordWrap\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wordWrap.js\",\n\t\t\"icon.wordWrap\"\n\t],\n\t\"./wordWrap.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wordWrap.js\",\n\t\t\"icon.wordWrap\"\n\t],\n\t\"./wordWrapDisabled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wordWrapDisabled.js\",\n\t\t\"icon.wordWrapDisabled\"\n\t],\n\t\"./wordWrapDisabled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wordWrapDisabled.js\",\n\t\t\"icon.wordWrapDisabled\"\n\t],\n\t\"./wrench\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wrench.js\",\n\t\t\"icon.wrench\"\n\t],\n\t\"./wrench.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wrench.js\",\n\t\t\"icon.wrench\"\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__(id);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = \"../node_modules/@elastic/eui/es/components/icon/assets lazy recursive ^\\\\.\\\\/.*$\";\nmodule.exports = webpackAsyncContext;","// Imports\nvar ___CSS_LOADER_API_IMPORT___ = require(\"../../../../node_modules/css-loader/dist/runtime/api.js\");\nexports = ___CSS_LOADER_API_IMPORT___(false);\n// Module\nexports.push([module.id, \".showcase {\\n  height: 100%;\\n  width: 100%;\\n  min-width: 500px;\\n  display: flex;\\n  align-items: center;\\n}\\n.showcase .tooltip-wrapper {\\n  margin-left: 30px;\\n}\\n.showcase #tooltip-anchor {\\n  background-color: #0aa1dd;\\n  padding: 20px;\\n  color: white;\\n  font-weight: bold;\\n  cursor: not-allowed;\\n  border-radius: 10px;\\n}\", \"\"]);\n// Exports\nmodule.exports = exports;\n","// Imports\nvar ___CSS_LOADER_API_IMPORT___ = require(\"../../../node_modules/css-loader/dist/runtime/api.js\");\nexports = ___CSS_LOADER_API_IMPORT___(false);\n// Module\nexports.push([module.id, \".myCustomMetricSlot {\\n  display: flex;\\n  height: 100%;\\n}\\n.myCustomMetricSlot .euiBadge {\\n  padding-inline: 8px;\\n}\\n.myCustomMetricSlot.showSlotArea {\\n  background: repeating-linear-gradient(45deg, #cd252588, #cd252588 10px, #fff0 10px, #fff0 20px);\\n}\", \"\"]);\n// Exports\nmodule.exports = exports;\n","// Imports\nvar ___CSS_LOADER_API_IMPORT___ = require(\"../node_modules/css-loader/dist/runtime/api.js\");\nvar ___CSS_LOADER_GET_URL_IMPORT___ = require(\"../node_modules/css-loader/dist/runtime/getUrl.js\");\nvar ___CSS_LOADER_URL_IMPORT_0___ = require(\"../public/fonts/atkinson-hyperlegible-v1-latin-regular.woff2\");\nvar ___CSS_LOADER_URL_IMPORT_1___ = require(\"../public/fonts/atkinson-hyperlegible-v1-latin-regular.woff\");\nvar ___CSS_LOADER_URL_IMPORT_2___ = require(\"../public/fonts/atkinson-hyperlegible-v1-latin-700.woff2\");\nvar ___CSS_LOADER_URL_IMPORT_3___ = require(\"../public/fonts/atkinson-hyperlegible-v1-latin-700.woff\");\nexports = ___CSS_LOADER_API_IMPORT___(false);\nvar ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);\nvar ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___);\nvar ___CSS_LOADER_URL_REPLACEMENT_2___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_2___);\nvar ___CSS_LOADER_URL_REPLACEMENT_3___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_3___);\n// Module\nexports.push([module.id, \"@charset \\\"UTF-8\\\";\\n/**\\nThe MIT License (MIT)\\n\\nCopyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\nPermission is hereby granted, free of charge, to any person obtaining a copy\\nof this software and associated documentation files (the \\\"Software\\\"), to deal\\nin the Software without restriction, including without limitation the rights\\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\ncopies of the Software, and to permit persons to whom the Software is\\nfurnished to do so, subject to the following conditions:\\n\\nThe above copyright notice and this permission notice shall be included in all\\ncopies or substantial portions of the Software.\\n\\nTHE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\nSOFTWARE.\\n */\\n/**\\nThe MIT License (MIT)\\n\\nCopyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\nPermission is hereby granted, free of charge, to any person obtaining a copy\\nof this software and associated documentation files (the \\\"Software\\\"), to deal\\nin the Software without restriction, including without limitation the rights\\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\ncopies of the Software, and to permit persons to whom the Software is\\nfurnished to do so, subject to the following conditions:\\n\\nThe above copyright notice and this permission notice shall be included in all\\ncopies or substantial portions of the Software.\\n\\nTHE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\nSOFTWARE.\\n */\\n/**\\n * Text truncation\\n *\\n * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n *\\n * 1. Ensure that the node has a maximum width after which truncation can occur.\\n */\\n/**\\n * Text weight shifting\\n *\\n * When changing the font-weight based the state of the component\\n * this mixin will ensure that the sizing is dependent on the boldest\\n * weight so it doesn't shifter sibling content.\\n */\\n/**\\n * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n *    Others like Safari, won't show anything at all.\\n * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n */\\n/**\\n * For quickly applying a full-height element whether using flex or not\\n */\\n/*\\n * Creates the Amsterdam style of button with a transparent background\\n */\\n/*\\n * Creates the Amsterdam style of fill button\\n */\\n/*\\nThe CSS in JS version of this file lives in:\\n  - src/components/form/range/range.styles.ts\\n\\nThe following files still use the Sass version:\\n  - src/themes/amsterdam/overrides/_color_stops.scss\\n  - src/themes/amsterdam/overrides/_hue.scss\\n*/\\n@-webkit-keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@-webkit-keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@-webkit-keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #0071c2;\\n  }\\n}\\n@keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #0071c2;\\n  }\\n}\\n@-webkit-keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #0071c2;\\n  }\\n}\\n@keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #0071c2;\\n  }\\n}\\n@-webkit-keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\n@keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\n/**\\n * LEGEND\\n * __day-name : Week headers like Su, Mo, etc\\n * __day : Number on the calendar\\n *       --highlighted\\n *       --disabled :               _this.isDisabled(),\\n *       --selected :               _this.isSameDay(_this.props.selected),\\n    *       --range-start :            _this.isRangeStart(),\\n    *       --range-end :              _this.isRangeEnd(),\\n *       --keyboard-selected :      _this.isKeyboardSelected(),\\n *       --in-range :               _this.isInRange(),\\n    *       --in-selecting-range :     _this.isInSelectingRange(),\\n    *       --selecting-range-start :  _this.isSelectingRangeStart(),\\n    *       --selecting-range-end :    _this.isSelectingRangeEnd(),\\n *       --today :                  _this.isSameDay(now(_this.props.utcOffset)),\\n *       --weekend :                _this.isWeekend(),\\n *       --outside-month :          _this.isOutsideMonth()\\n */\\n.react-datepicker__day-names,\\n.react-datepicker__week {\\n  white-space: nowrap;\\n  display: flex;\\n  justify-content: space-between;\\n  flex-grow: 1;\\n}\\n\\n.react-datepicker__day-name,\\n.react-datepicker__day {\\n  font-weight: 500;\\n  text-align: center;\\n  color: #1a1c21;\\n  display: inline-block;\\n  width: 32px;\\n  line-height: 32px;\\n  border-radius: 4px;\\n  margin: 2px;\\n}\\n\\n.react-datepicker__day-name {\\n  color: #69707D;\\n}\\n\\n.react-datepicker__day {\\n  cursor: pointer;\\n  transition: transform 90ms ease-in-out;\\n}\\n\\n.react-datepicker__day:hover {\\n  color: #0061a6;\\n  background-color: rgba(0, 119, 204, 0.2);\\n  text-decoration: underline;\\n}\\n\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  .react-datepicker__day:hover {\\n    transform: scale(1.1);\\n  }\\n}\\n.react-datepicker__day--today {\\n  color: #07C;\\n  font-weight: 700;\\n}\\n\\n.react-datepicker__day--outside-month {\\n  color: #69707D;\\n}\\n\\n.react-datepicker__day--highlighted, .react-datepicker__day--highlighted:hover {\\n  color: #00726b;\\n  background-color: rgba(0, 191, 179, 0.2);\\n}\\n\\n.react-datepicker__day--in-range, .react-datepicker__day--in-range:hover {\\n  color: #0061a6;\\n  background-color: rgba(0, 119, 204, 0.2);\\n}\\n\\n.react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover), .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected), .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover {\\n  box-shadow: -2px 0 rgba(0, 119, 204, 0.2), 2px 0 rgba(0, 119, 204, 0.2);\\n  border-radius: 0;\\n}\\n\\n.react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):first-of-type, .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):first-of-type, .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:first-of-type {\\n  box-shadow: 2px 0 rgba(0, 119, 204, 0.2);\\n}\\n\\n.react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):last-of-type, .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):last-of-type, .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:last-of-type {\\n  box-shadow: -2px 0 rgba(0, 119, 204, 0.2);\\n}\\n\\n.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\n\\n.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range) {\\n  background-color: rgba(189, 39, 30, 0.5);\\n}\\n\\n.react-datepicker__day--disabled, .react-datepicker__day--disabled:hover {\\n  background-color: rgba(171, 180, 196, 0.1);\\n  color: #a2abba;\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  transform: none;\\n}\\n\\n.react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected), .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover, .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected), .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover {\\n  color: #8c9daa;\\n  background-color: rgba(0, 119, 204, 0.2);\\n}\\n\\n.react-datepicker__day--disabled.react-datepicker__day--selected, .react-datepicker__day--disabled.react-datepicker__day--selected:hover {\\n  color: #BD271E;\\n  background-color: rgba(189, 39, 30, 0.2);\\n}\\n\\n/**\\n * LEGEND\\n * __time-list-item :\\n *       --preselected : closest current time but not selected (also applied when using arrow keys to indicate focus)\\n *       --selected\\n *       --disabled\\n *       --injected\\n */\\n.react-datepicker__header--time {\\n  display: none;\\n}\\n\\n.react-datepicker__time-container {\\n  border-left: #D3DAE6;\\n  width: auto;\\n  display: flex;\\n  margin-top: 40px;\\n  margin-left: 8px;\\n  flex-grow: 1;\\n  background-color: #fafbfd;\\n  border-radius: 6px;\\n}\\n\\n.react-datepicker__time-container--focus .react-datepicker__time-list-item--preselected {\\n  text-decoration: underline;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .react-datepicker__time-container {\\n    margin-top: 0;\\n  }\\n}\\n.react-datepicker__time,\\n.react-datepicker__time-box {\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n}\\n\\n.react-datepicker__time-list {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  padding: 4px 12px;\\n  height: 100px !important;\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n  align-items: center;\\n  gap: 4px;\\n}\\n\\n.react-datepicker__time-list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.react-datepicker__time-list::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.react-datepicker__time-list::-webkit-scrollbar-corner, .react-datepicker__time-list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.react-datepicker__time-list:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.react-datepicker__time-list[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.react-datepicker__time-list-item {\\n  display: inline-block;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  cursor: pointer;\\n  height: 40px;\\n  line-height: 40px;\\n  text-align: center;\\n  white-space: nowrap;\\n  max-width: 100%;\\n  vertical-align: middle;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 500;\\n  text-decoration: none;\\n  outline-offset: -1px;\\n  transform: none !important;\\n  /* 1 */\\n  -webkit-animation: none !important;\\n  animation: none !important;\\n  /* 1 */\\n  transition-timing-function: ease-in;\\n  /* 2 */\\n  transition-duration: 150ms;\\n  /* 2 */\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 12px;\\n}\\n\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  .react-datepicker__time-list-item {\\n    transition: transform 250ms ease-in-out, background-color 250ms ease-in-out;\\n  }\\n\\n  .react-datepicker__time-list-item:hover:not(:disabled) {\\n    transform: translateY(-1px);\\n  }\\n\\n  .react-datepicker__time-list-item:focus {\\n    -webkit-animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n    animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  }\\n\\n  .react-datepicker__time-list-item:active:not(:disabled) {\\n    transform: translateY(1px);\\n  }\\n}\\n.react-datepicker__time-list-item:hover:not(:disabled), .react-datepicker__time-list-item:focus {\\n  text-decoration: underline;\\n}\\n\\n.react-datepicker__time-list-item--disabled, .react-datepicker__time-list-item--disabled:hover {\\n  text-decoration: none !important;\\n  cursor: not-allowed;\\n  color: #ABB4C4;\\n  background-color: transparent;\\n}\\n\\n.react-datepicker__time-list-item--injected, .react-datepicker__time-list-item--injected:hover {\\n  color: #00726b;\\n  background-color: rgba(0, 191, 179, 0.2);\\n}\\n\\n.react-datepicker__time-list-item--preselected, .react-datepicker__time-list-item--preselected:hover {\\n  background: rgba(0, 119, 204, 0.1);\\n}\\n\\n.react-datepicker__time-list-item--selected, .react-datepicker__time-list-item--selected:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\n\\n.react-datepicker--time-only {\\n  padding: 0 !important;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__time-container {\\n  background-color: transparent;\\n  margin: 0;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__time-list {\\n  height: 204px !important;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__time-list-item {\\n  font-size: 14px;\\n  min-width: 112px;\\n  text-align: left;\\n}\\n\\n/**\\n * LEGEND\\n * __header__dropdown : Contains the month and year, but affords for the navigational arrows\\n\\n *   __month-dropdown-container: Contains both static/selected control and the dropdown\\n *     __month-read-view: The static control\\n *     __month-dropdown: The absolutely positioned list\\n *       __month-option: Each option in the list\\n *                       --selected_month\\n *                       --selected\\n *                       --preselected\\n\\n *   __year-dropdown-container: Contains both static/selected control and the dropdown\\n *     __year-read-view: The static control\\n *     __year-dropdown: The absolutely positioned list\\n *       __year-option: Each option in the list\\n *                       --selected_year\\n *                       --selected\\n *                       --preselected\\n */\\n.react-datepicker__header__dropdown {\\n  padding: 8px;\\n  display: flex;\\n  gap: 4px;\\n  position: absolute;\\n  top: 0;\\n  left: 36px;\\n  right: 36px;\\n  justify-content: center;\\n}\\n\\n/**\\n * Make the top selectors look like select inputs\\n */\\n.react-datepicker__year-read-view,\\n.react-datepicker__month-read-view,\\n.react-datepicker__month-year-read-view {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  height: 32px;\\n  font-weight: 500;\\n  display: flex;\\n  flex-direction: row-reverse;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .react-datepicker__year-read-view,\\n.react-datepicker__month-read-view,\\n.react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.react-datepicker__year-read-view::-moz-placeholder,\\n.react-datepicker__month-read-view::-moz-placeholder,\\n.react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.react-datepicker__year-read-view::-moz-placeholder, .react-datepicker__month-read-view::-moz-placeholder, .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.react-datepicker__year-read-view:-ms-input-placeholder, .react-datepicker__month-read-view:-ms-input-placeholder, .react-datepicker__month-year-read-view:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.react-datepicker__year-read-view::placeholder,\\n.react-datepicker__month-read-view::placeholder,\\n.react-datepicker__month-year-read-view::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .react-datepicker__year-read-view,\\n.react-datepicker__month-read-view,\\n.react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.react-datepicker__year-read-view:hover,\\n.react-datepicker__month-read-view:hover,\\n.react-datepicker__month-year-read-view:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\n\\n.react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__month-read-view--down-arrow,\\n.react-datepicker__month-year-read-view--down-arrow {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiI+ICA8ZGVmcz4gICAgPHBhdGggaWQ9ImFycm93X2Rvd24tYSIgZD0iTTEzLjA2ODg1MDgsNS4xNTcyNTAzOCBMOC4zODQyMzk3NSw5Ljc2ODI3NDI4IEM4LjE3MDU0NDE1LDkuOTc4NjEzMDggNy44Mjk5OTIxNCw5Ljk3OTE0MDk1IDcuNjE1NzYwMjUsOS43NjgyNzQyOCBMMi45MzExNDkxNSw1LjE1NzI1MDM4IEMyLjcxODEzNTksNC45NDc1ODMyMSAyLjM3Mjc3MzE5LDQuOTQ3NTgzMjEgMi4xNTk3NTk5NCw1LjE1NzI1MDM4IEMxLjk0Njc0NjY5LDUuMzY2OTE3NTYgMS45NDY3NDY2OSw1LjcwNjg1NTIyIDIuMTU5NzU5OTQsNS45MTY1MjI0IEw2Ljg0NDM3MTA0LDEwLjUyNzU0NjMgQzcuNDg1MTc0MjQsMTEuMTU4MjgzNiA4LjUxNjQ0OTc5LDExLjE1NjY4NTEgOS4xNTU2Mjg5NiwxMC41Mjc1NDYzIEwxMy44NDAyNDAxLDUuOTE2NTIyNCBDMTQuMDUzMjUzMyw1LjcwNjg1NTIyIDE0LjA1MzI1MzMsNS4zNjY5MTc1NiAxMy44NDAyNDAxLDUuMTU3MjUwMzggQzEzLjYyNzIyNjgsNC45NDc1ODMyMSAxMy4yODE4NjQxLDQuOTQ3NTgzMjEgMTMuMDY4ODUwOCw1LjE1NzI1MDM4IFoiLz4gIDwvZGVmcz4gIDxnIGZpbGwtcnVsZT0iZXZlbm9kZCI+ICAgIDx1c2UgZmlsbC1ydWxlPSJub256ZXJvIiB4bGluazpocmVmPSIjYXJyb3dfZG93bi1hIi8+ICA8L2c+PC9zdmc+);\\n  right: 8px;\\n  height: 12px;\\n  width: 12px;\\n  display: inline-block;\\n  background-size: cover;\\n}\\n\\n.react-datepicker__year-read-view--selected-month, .react-datepicker__year-read-view--selected-year,\\n.react-datepicker__month-read-view--selected-month,\\n.react-datepicker__month-read-view--selected-year,\\n.react-datepicker__month-year-read-view--selected-month,\\n.react-datepicker__month-year-read-view--selected-year {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n.react-datepicker__year-dropdown-container,\\n.react-datepicker__month-dropdown-container {\\n  position: relative;\\n  display: inline-block;\\n  flex-grow: 1;\\n  max-width: 400px;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view]),\\n.react-datepicker__month-dropdown {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n  height: auto;\\n  max-height: 250px;\\n  background-color: #FFF;\\n  position: absolute;\\n  z-index: 1;\\n  border-radius: 6px;\\n  min-width: 100px;\\n  width: 100%;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar,\\n.react-datepicker__month-dropdown::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-thumb,\\n.react-datepicker__month-dropdown::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-corner, .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-track,\\n.react-datepicker__month-dropdown::-webkit-scrollbar-corner,\\n.react-datepicker__month-dropdown::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view]):focus,\\n.react-datepicker__month-dropdown:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view])[tabindex=\\\"0\\\"]:focus:focus-visible,\\n.react-datepicker__month-dropdown[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view]) .react-datepicker__year-dropdown {\\n  padding: 4px;\\n  display: flex;\\n  flex-direction: column-reverse;\\n  justify-content: flex-end;\\n}\\n\\n.react-datepicker__month-dropdown-container {\\n  flex-grow: 2;\\n}\\n\\n.react-datepicker__month-dropdown-container .react-datepicker__month-dropdown {\\n  padding: 4px;\\n  min-width: 140px;\\n}\\n\\n.react-datepicker__year-option,\\n.react-datepicker__month-option,\\n.react-datepicker__month-year-option {\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 14px;\\n  margin: 4px 0;\\n  cursor: pointer;\\n}\\n\\n.react-datepicker__year-option:hover, .react-datepicker__year-option:focus,\\n.react-datepicker__month-option:hover,\\n.react-datepicker__month-option:focus,\\n.react-datepicker__month-year-option:hover,\\n.react-datepicker__month-year-option:focus {\\n  text-decoration: underline;\\n}\\n\\n.react-datepicker__year-option--selected,\\n.react-datepicker__month-option--selected,\\n.react-datepicker__month-year-option--selected {\\n  display: none;\\n}\\n\\n.react-datepicker__year-option--preselected, .react-datepicker__year-option--preselected:hover,\\n.react-datepicker__month-option--preselected,\\n.react-datepicker__month-option--preselected:hover {\\n  background: rgba(0, 119, 204, 0.1);\\n}\\n\\n.react-datepicker__year-option--selected_year, .react-datepicker__year-option--selected_year:hover,\\n.react-datepicker__month-option--selected_month,\\n.react-datepicker__month-option--selected_month:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\n\\n.react-datepicker__navigation--next,\\n.react-datepicker__navigation--previous {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZmlsbD0iIzM0Mzc0MSIgZD0iTTExLjY5MiA3SDMuNTU2QzMuMjQ5IDcgMyA3LjIyNCAzIDcuNXMuMjQ5LjUuNTU2LjVoOC4xMzZsLTQuMDk2IDQuMDk2YS41LjUgMCAwMC43MDcuNzA3bDQuMjQzLTQuMjQyYy4yNTgtLjI1OS40MDMtLjU4Ny40MzMtLjkyNWEuNDU0LjQ1NCAwIDAwMC0uMjcyIDEuNDk0IDEuNDk0IDAgMDAtLjQzMy0uOTI1TDguMzAzIDIuMTk3YS41LjUgMCAxMC0uNzA3LjcwN0wxMS42OTIgN3oiLz48L3N2Zz4=);\\n  cursor: pointer;\\n  position: absolute;\\n  top: 8px;\\n  height: 32px;\\n  width: 32px;\\n  z-index: 1;\\n  text-indent: -999em;\\n  overflow: hidden;\\n  background-repeat: no-repeat;\\n  border-radius: 4px;\\n  background-position: center;\\n}\\n\\n.react-datepicker__navigation--next:hover, .react-datepicker__navigation--next:focus,\\n.react-datepicker__navigation--previous:hover,\\n.react-datepicker__navigation--previous:focus {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.react-datepicker__navigation--previous {\\n  left: 8px;\\n  transform: rotate(180deg);\\n  transform-origin: center;\\n}\\n\\n.react-datepicker__navigation--next {\\n  right: 8px;\\n}\\n\\n/* This file is a heavy retheme of react-datepicker's Sass as of v1.4.0\\n** https://github.com/Hacker0x01/react-datepicker\\n*/\\n.euiDatePicker {\\n  display: block;\\n  /**\\n   * Inline datepickers\\n   */\\n}\\n\\n.euiDatePicker .euiFormControlLayout {\\n  height: auto;\\n}\\n\\n.euiDatePicker--inline .euiFormControlLayout {\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n  background-color: transparent;\\n  box-shadow: none;\\n  padding: 0;\\n}\\n\\n.euiDatePicker--inline .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: transparent;\\n  flex-direction: column;\\n}\\n\\n.euiDatePicker--inline .euiFormControlLayoutIcons {\\n  justify-content: center;\\n  -webkit-padding-after: 8px;\\n  padding-block-end: 8px;\\n}\\n\\n.euiDatePicker--shadow .euiFormControlLayout {\\n  box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n}\\n\\n.euiDatePicker--shadow .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #FFF;\\n}\\n\\n.react-datepicker {\\n  font-size: 12px;\\n  color: #343741;\\n  display: flex;\\n  border-radius: 6px;\\n  padding: 8px;\\n  justify-content: center;\\n}\\n\\n.react-datepicker--non-interactive {\\n  pointer-events: none;\\n}\\n\\n.react-datepicker__current-month,\\n.react-datepicker-time__header {\\n  display: none;\\n}\\n\\n.react-datepicker__screenReaderOnly {\\n  position: absolute;\\n  top: auto;\\n  left: -10000px;\\n  width: 1px;\\n  height: 1px;\\n  clip: rect(0 0 0 0);\\n  -webkit-clip-path: inset(50%);\\n  clip-path: inset(50%);\\n  overflow: hidden;\\n  margin: -1px;\\n}\\n\\n.react-datepicker__focusTrap {\\n  display: flex;\\n  justify-content: center;\\n}\\n\\n.react-datepicker__month-container {\\n  flex-grow: 1;\\n  margin-top: 36px;\\n}\\n\\n.react-datepicker__header {\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.react-datepicker-time__header {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n.react-datepicker__month {\\n  text-align: center;\\n  border-radius: 6px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .react-datepicker__focusTrap,\\n.react-datepicker {\\n    flex-direction: column;\\n  }\\n\\n  .react-datepicker__time-box {\\n    margin-top: 0;\\n  }\\n}\\n.euiColorPicker {\\n  position: relative;\\n  width: 152px;\\n}\\n\\n.euiColorPicker__popoverAnchor .euiColorPicker__input {\\n  padding-right: 40px;\\n}\\n\\n.euiColorPicker__popoverAnchor .euiColorPicker__input[class*=\\\"--compressed\\\"] {\\n  padding-right: 32px;\\n}\\n\\n.euiColorPicker__popoverAnchor .euiColorPicker__input + .euiFormControlLayoutIcons {\\n  color: inherit;\\n}\\n\\n.euiColorPicker__swatches {\\n  display: flex;\\n  flex-wrap: wrap;\\n  margin: -4px;\\n}\\n\\n.euiColorPicker__swatch-item {\\n  margin: 4px;\\n}\\n\\n.euiSwatchInput__stroke {\\n  fill: none;\\n  stroke: rgba(0, 0, 0, 0.2);\\n}\\n\\n.euiColorPicker__popoverPanel--pickerOnly {\\n  padding-bottom: 0 !important;\\n}\\n\\n.euiColorPicker__input--inGroup {\\n  height: 38px !important;\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiColorPicker__input--inGroup.euiFieldText--compressed {\\n  height: 30px !important;\\n  border-radius: 0;\\n}\\n\\n.euiColorPicker__alphaRange .euiRangeInput {\\n  min-width: 0;\\n}\\n\\n.euiColorPickerSwatch {\\n  display: inline-block;\\n  height: 24px;\\n  width: 24px;\\n  border-radius: 3px;\\n  cursor: pointer;\\n  border: solid 1px rgba(0, 0, 0, 0.1);\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);\\n}\\n\\n.euiColorPickerSwatch:disabled {\\n  cursor: default;\\n}\\n\\n.euiColorPickerSwatch:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiColorPickerSwatch:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiColorPickerSwatch:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiHue {\\n  background: linear-gradient(to right, #FF3232 0%, #FFF130 20%, #45FF30 35%, #28FFF0 52%, #282CFF 71%, #FF28FB 88%, #FF0094 100%);\\n  height: 24px;\\n  margin: 4px 0;\\n  position: relative;\\n}\\n\\n.euiHue::before, .euiHue::after {\\n  content: \\\"\\\";\\n  left: 0;\\n  position: absolute;\\n  height: 8px;\\n  background: #FFF;\\n  width: 100%;\\n}\\n\\n.euiHue::after {\\n  bottom: 0;\\n}\\n\\n.euiHue__range {\\n  position: relative;\\n  height: 24px;\\n  width: calc(100% + 2px);\\n  margin: 0 -1px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  background: transparent;\\n  z-index: 2;\\n}\\n\\n.euiHue__range::-webkit-slider-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -webkit-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\n\\n.euiHue__range::-moz-range-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -moz-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\n\\n.euiHue__range::-ms-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -ms-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\n\\n.euiHue__range::-webkit-slider-thumb {\\n  -webkit-appearance: none;\\n  margin-top: 0;\\n}\\n\\n.euiHue__range::-ms-thumb {\\n  margin-top: 0;\\n}\\n\\n.euiHue__range::-ms-track {\\n  height: 24px;\\n  background: transparent;\\n  border-color: transparent;\\n  color: transparent;\\n}\\n\\n.euiHue__range::-moz-focus-outer {\\n  border: none;\\n}\\n\\n.euiHue__range::-ms-fill-lower, .euiHue__range::-ms-fill-upper {\\n  background: transparent;\\n}\\n\\n.euiHue__range:focus {\\n  outline: none;\\n}\\n\\n.euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\n\\n.euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\n\\n.euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\n\\n.euiSaturation {\\n  position: relative;\\n  width: 100%;\\n  padding-bottom: 100%;\\n  border-radius: 3px;\\n  touch-action: none;\\n  z-index: 3;\\n}\\n\\n.euiSaturation .euiSaturation__lightness,\\n.euiSaturation .euiSaturation__saturation {\\n  position: absolute;\\n  top: -1px;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  border-radius: 3px;\\n}\\n\\n.euiSaturation .euiSaturation__lightness {\\n  background: linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0));\\n}\\n\\n.euiSaturation .euiSaturation__saturation {\\n  background: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));\\n}\\n\\n.euiSaturation .euiSaturation__indicator {\\n  position: absolute;\\n  height: 12px;\\n  width: 12px;\\n  border-radius: 100%;\\n  margin-top: -6px;\\n  margin-left: -6px;\\n  border: 1px solid #343741;\\n}\\n\\n.euiSaturation .euiSaturation__indicator::before {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 100%;\\n  border: 1px solid #F5F7FA;\\n}\\n\\n.euiSaturation:focus {\\n  outline: none;\\n}\\n\\n.euiSaturation:focus .euiSaturation__indicator {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\n\\n.euiColorPalettePicker__itemTitle {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\n\\n.euiColorPalettePicker__itemTitle + .euiColorPaletteDisplay {\\n  margin-top: 4px;\\n}\\n\\n.euiColorPaletteDisplay {\\n  display: flex;\\n  flex-direction: row;\\n  overflow: hidden;\\n  height: 8px;\\n}\\n\\n.euiColorPaletteDisplay--sizeExtraSmall {\\n  position: relative;\\n  height: 4px;\\n  border-radius: 4px;\\n}\\n\\n.euiColorPaletteDisplay--sizeExtraSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 4px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\n\\n.euiColorPaletteDisplay--sizeExtraSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 4px;\\n}\\n\\n.euiColorPaletteDisplay--sizeSmall {\\n  position: relative;\\n  height: 8px;\\n  border-radius: 8px;\\n}\\n\\n.euiColorPaletteDisplay--sizeSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 8px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\n\\n.euiColorPaletteDisplay--sizeSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 8px;\\n}\\n\\n.euiColorPaletteDisplay--sizeMedium {\\n  position: relative;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\n\\n.euiColorPaletteDisplay--sizeMedium::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 16px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\n\\n.euiColorPaletteDisplay--sizeMedium .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 16px;\\n}\\n\\n.euiColorPaletteDisplayFixed__bleedArea {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  display: flex;\\n  height: 8px;\\n  width: calc(100% + 1px);\\n}\\n\\n.euiComboBox {\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  position: relative;\\n  /**\\n   * 1. Allow pills to truncate their text with an ellipsis.\\n   * 2. Don't allow pills/placeholder to overlap with the caret, loading icon or clear button.\\n   * 3. The height on combo can be larger than normal text inputs except for single-selection comboboxes.\\n   */\\n  /**\\n   * 1. Force field height to match other field heights.\\n   * 2. Force input height to expand to fill this element.\\n   * 3. Reset input appearance to mimic text\\n   * 4. Ensure that no input states are visible on the hidden input\\n   */\\n}\\n\\n.euiComboBox--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiComboBox--compressed {\\n  height: 32px;\\n}\\n\\n.euiComboBox--inGroup {\\n  height: 100%;\\n}\\n\\n.euiComboBox--compressed:not(.euiComboBox--appended, .euiComboBox--prepended) {\\n  height: auto;\\n  /* 3 */\\n}\\n\\n.euiComboBox:not(.euiComboBox--appended, .euiComboBox--prepended) .euiFormControlLayout {\\n  height: auto;\\n  /* 3 */\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  padding: 4px 8px;\\n  padding-right: var(--eui-form-control-layout-icons-padding, 8px);\\n  /* 2 */\\n  display: flex;\\n  /* 1 */\\n  outline: none;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiComboBox .euiComboBox__inputWrap {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiComboBox .euiComboBox__inputWrap--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiComboBox .euiComboBox__inputWrap--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap .euiComboBoxPill {\\n  max-width: calc(100% - 2px - 16px);\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap:not(.euiComboBox__inputWrap--noWrap) {\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  padding-left: 4px;\\n  height: auto;\\n  /* 3 */\\n  flex-wrap: wrap;\\n  /* 1 */\\n  align-content: flex-start;\\n  cursor: text;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--noWrap {\\n  align-items: center;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 8px;\\n  padding-inline-start: 8px;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend, .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  flex-shrink: 0;\\n  margin-inline: 2px;\\n  display: flex;\\n  /* Vertically centers any icons */\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend {\\n  -webkit-margin-start: 4px;\\n  margin-inline-start: 4px;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  -webkit-margin-end: 4px;\\n  margin-inline-end: 4px;\\n}\\n\\n.euiComboBox .euiComboBox__input {\\n  block-size: 24px;\\n  /* 2 */\\n  min-inline-size: 2px;\\n  max-inline-size: 100%;\\n  margin: 4px;\\n  /* 3 */\\n  background: transparent;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  /* 4 */\\n  -webkit-appearance: none !important;\\n  -moz-appearance: none !important;\\n  appearance: none !important;\\n  border: none !important;\\n  box-shadow: none !important;\\n  outline: none !important;\\n}\\n\\n.euiComboBox .euiComboBox__input::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiComboBox .euiComboBox__input:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap--compressed {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiComboBox.euiComboBox-isInvalid .euiComboBox__inputWrap {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  -webkit-text-fill-color: unset;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap,\\n.euiComboBox.euiComboBox-isDisabled .euiComboBoxPill {\\n  cursor: not-allowed;\\n}\\n\\n.euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap {\\n  line-height: 32px;\\n  /* 2 */\\n  padding-block: 0;\\n}\\n\\n.euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 4px;\\n  padding-inline-start: 4px;\\n}\\n\\n/*\\n * 1. Overwrites the base styling of EuiBadge, to give it a larger size and margins\\n * that make sense in the input wrap.\\n */\\n.euiComboBoxPill {\\n  height: 22px;\\n  line-height: 20px;\\n  vertical-align: baseline;\\n  /* Fix append/prepend vertical alignment */\\n}\\n\\n.euiComboBoxPill, .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 4px;\\n}\\n\\n.euiComboBox--compressed .euiComboBoxPill, .euiComboBox--compressed .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 5px 4px 0 0;\\n}\\n\\n.euiComboBoxPill__prepend {\\n  margin-right: 4px;\\n}\\n\\n.euiComboBoxPill__append {\\n  margin-left: 4px;\\n}\\n\\n.euiComboBoxPill .euiBadge__text {\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiComboBoxPill .euiBadge__text .euiIcon {\\n  display: block;\\n}\\n\\n/**\\n * 1. Using specificity to override panel shadow\\n * 2. Prevent really long input from overflowing the container.\\n */\\n.euiComboBoxOptionsList {\\n  max-height: 200px;\\n  overflow: hidden;\\n  /* Kibana FTR affordance - without this, Selenium complains about the overlaid\\n     text intercepting the button click. Since `title` is always present, and\\n     users can't highlight or copy combobox options anyway, we might as well\\n     disable clicks on text */\\n}\\n\\n.euiComboBoxOptionsList__virtualization {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\n\\n.euiComboBoxOptionsList__virtualization::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiComboBoxOptionsList__virtualization::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiComboBoxOptionsList__virtualization::-webkit-scrollbar-corner, .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiComboBoxOptionsList .euiTextTruncate {\\n  pointer-events: none;\\n}\\n\\n.euiComboBoxOptionsList__empty {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 2 */\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n}\\n\\n.euiComboBoxOption {\\n  font-size: 14px;\\n  padding: 4px 8px 4px 16px;\\n  width: 100%;\\n  text-align: left;\\n  border: 1px solid #D3DAE6;\\n  border-color: transparent;\\n  display: flex;\\n  align-items: center;\\n  /* Fix vertical alignment of EuiIcons in prepend/append nodes */\\n}\\n\\n.euiComboBoxOption:hover {\\n  text-decoration: underline;\\n}\\n\\n.euiComboBoxOption.euiComboBoxOption-isFocused {\\n  cursor: pointer;\\n  color: #0071c2;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiComboBoxOption.euiComboBoxOption-isDisabled {\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\n\\n.euiComboBoxOption.euiComboBoxOption-isDisabled:hover {\\n  text-decoration: none;\\n}\\n\\n.euiComboBoxOption__contentWrapper {\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiComboBoxOption__content {\\n  text-overflow: ellipsis;\\n  overflow: hidden;\\n  white-space: nowrap;\\n  flex: 1;\\n  text-align: left;\\n}\\n\\n.euiComboBoxOption__emptyStateText {\\n  flex: 1;\\n  text-align: left;\\n  /* Extra specificity required to override EuiText's <p> styling */\\n}\\n\\n.euiComboBoxOptionsList__empty .euiComboBoxOption__emptyStateText {\\n  margin-bottom: 0;\\n}\\n\\n.euiComboBoxOption__enterBadge {\\n  margin-left: 4px;\\n}\\n\\n.euiComboBoxOption__prepend {\\n  margin-right: 8px;\\n}\\n\\n.euiComboBoxOption__append {\\n  margin-left: 8px;\\n}\\n\\n.euiComboBoxOption__prepend .euiIcon, .euiComboBoxOption__append .euiIcon {\\n  display: block;\\n}\\n\\n/**\\n * 1. Force each title to be the same height as an option, so that the virtualized scroll logic\\n *    works.\\n */\\n.euiComboBoxTitle {\\n  font-size: 12px;\\n  padding: 11px 8px 4px;\\n  /* 1 */\\n  width: 100%;\\n  font-weight: 700;\\n  color: #000;\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow {\\n  padding: 0 8px 8px;\\n  /* A bit of a visual trickery to make the format \\\"hint\\\" become an \\\"error\\\" text.\\n     NOTE: Normally reordering visually (vs DOM) isn't super great for screen reader users,\\n     but as the help text is already read out via `aria-describedby`, and the error text\\n     is read out immediately via `aria-live`, we can fairly safely prioritize visuals instead */\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow .euiFormRow__fieldWrapper {\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow .euiFormControlLayout {\\n  order: 0;\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow .euiFormHelpText {\\n  order: 1;\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow .euiFormErrorText {\\n  order: 2;\\n}\\n\\n.euiDatePopoverButton {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  background-size: 100%;\\n}\\n\\n.euiDatePopoverButton::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiDatePopoverButton:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiDatePopoverButton::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiDatePopoverButton--compressed {\\n  line-height: 30px;\\n  height: 30px;\\n}\\n\\n.euiDatePopoverButton:focus, .euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n}\\n\\n.euiDatePopoverButton-needsUpdating {\\n  background-color: #e6f9f7;\\n  color: #007e77;\\n}\\n\\n.euiDatePopoverButton-needsUpdating:focus, .euiDatePopoverButton-needsUpdating.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #00BFB3, #00BFB3 2px, transparent 2px, transparent 100%);\\n}\\n\\n.euiDatePopoverButton-isInvalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n  background-color: transparent;\\n  color: #BD271E;\\n}\\n\\n.euiDatePopoverButton-isInvalid:focus, .euiDatePopoverButton-isInvalid.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n}\\n\\n.euiDatePopoverButton:disabled {\\n  background-color: #eef2f7;\\n  background-image: none;\\n  color: #69707D;\\n  cursor: default;\\n}\\n\\n.euiDatePopoverButton--start {\\n  text-align: center;\\n}\\n\\n.euiDatePopoverButton--end {\\n  text-align: center;\\n}\\n\\n.euiDatePopoverContent,\\n.euiDatePopoverContent .react-datepicker {\\n  width: 400px;\\n  max-width: 100%;\\n}\\n\\n.euiDatePopoverContent__padded {\\n  padding: 8px;\\n}\\n\\n.euiDatePopoverContent__padded--large {\\n  padding: 16px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiDatePopoverContent {\\n    width: 284px;\\n  }\\n}\\n.euiQuickSelectPopover__content {\\n  width: 400px;\\n  max-width: 100%;\\n}\\n\\n.euiQuickSelectPopover__content .euiQuickSelectPopover__panel:not(:first-child) {\\n  border-top: 1px solid #D3DAE6;\\n  padding-top: 12px;\\n  margin-top: 12px;\\n}\\n\\n.euiQuickSelectPopover__content .euiQuickSelectPopover__panel .euiQuickSelectPopover__panelTitle {\\n  float: left;\\n  margin-bottom: 12px;\\n}\\n\\n.euiQuickSelectPopover__section {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 132px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n  margin: 8px 0 0;\\n  clear: both;\\n}\\n\\n.euiQuickSelectPopover__section::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiQuickSelectPopover__section::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiQuickSelectPopover__section::-webkit-scrollbar-corner, .euiQuickSelectPopover__section::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiQuickSelectPopover__buttonContent {\\n  gap: 4px;\\n}\\n\\n.euiQuickSelectPopover__sectionItem {\\n  font-size: 14px;\\n  line-height: 14px;\\n}\\n\\n.euiQuickSelectPopover__sectionItem--recentlyUsed:not(:last-of-type) {\\n  margin-bottom: 8px;\\n}\\n\\n.euiQuickSelect__applyButton {\\n  min-width: 0;\\n}\\n\\n.euiRefreshInterval__startButton {\\n  min-width: 90px;\\n}\\n\\n.euiSuperDatePicker {\\n  display: flex;\\n  gap: 8px;\\n  max-width: 100%;\\n  min-width: min(326px, 100%);\\n  width: 606px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\n.euiSuperDatePicker--isAutoRefreshOnly {\\n  min-width: min(200px, 100%);\\n  width: 400px;\\n}\\n\\n.euiSuperDatePicker--noUpdateButton {\\n  min-width: min(200px, 100%);\\n  width: 480px;\\n}\\n\\n.euiSuperDatePicker--fullWidth {\\n  width: 100%;\\n}\\n\\n.euiSuperDatePicker--isQuickSelectOnly {\\n  min-width: 0;\\n}\\n\\n.euiSuperDatePicker--autoWidth {\\n  display: inline-flex;\\n  width: auto;\\n}\\n\\n.euiSuperDatePicker .euiDatePickerRange {\\n  flex-grow: 1;\\n}\\n\\n.euiSuperDatePicker .euiFormControlLayout {\\n  max-width: 100%;\\n}\\n\\n.euiSuperDatePicker .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  overflow: hidden;\\n  background-color: #fbfcfd;\\n}\\n\\n.euiSuperDatePicker .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\n\\n.euiSuperDatePicker .euiFormControlLayout__childrenWrapper > .euiFormControlLayoutDelimited__input {\\n  flex-grow: 1;\\n}\\n\\n.euiSuperDatePicker__prettyFormat {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  display: flex;\\n  justify-content: space-between;\\n  text-align: left;\\n}\\n\\n.euiSuperDatePicker__prettyFormat::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperDatePicker__prettyFormat:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperDatePicker__prettyFormat::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperDatePicker__prettyFormat:not(:disabled):hover, .euiSuperDatePicker__prettyFormat:focus {\\n  text-decoration: none;\\n}\\n\\n.euiSuperDatePicker__prettyFormat:disabled {\\n  background-color: #eef2f7;\\n  color: #69707D;\\n  cursor: not-allowed;\\n}\\n\\n/**\\n* Make the arrow delimiter match the colors of `.euiDatePopoverButton-needsUpdating`\\n*/\\n.euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #e6f9f7;\\n}\\n\\n.euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayoutDelimited__delimiter {\\n  color: #007e77;\\n}\\n\\n.euiSuperDatePicker--needsUpdating .euiFormControlLayout__childrenWrapper {\\n  transition: background 150ms ease-in;\\n}\\n\\n.euiDataGrid {\\n  display: flex;\\n  flex-direction: column;\\n  align-items: stretch;\\n  overflow: hidden;\\n  height: 100%;\\n}\\n\\n.euiDataGrid--fullScreen {\\n  height: 100%;\\n  position: fixed;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  z-index: 999;\\n  background: #FFF;\\n}\\n\\n.euiDataGrid--fullScreen .euiDataGrid__pagination {\\n  padding-bottom: 4px;\\n  background: #F5F7FA;\\n  box-shadow: 1px 0 0 1px #D3DAE6;\\n}\\n\\n.euiDataGrid__content {\\n  flex-grow: 1;\\n  height: 100%;\\n  max-width: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  z-index: 1;\\n  position: relative;\\n  background: #fafbfd;\\n  font-feature-settings: \\\"tnum\\\" 1;\\n}\\n\\n.euiDataGrid__customRenderBody {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #FFF;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  width: 100%;\\n  overflow: auto;\\n}\\n\\n.euiDataGrid__customRenderBody::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGrid__customRenderBody::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #FFF;\\n}\\n\\n.euiDataGrid__customRenderBody::-webkit-scrollbar-corner, .euiDataGrid__customRenderBody::-webkit-scrollbar-track {\\n  background-color: #FFF;\\n}\\n\\n.euiDataGrid__pagination {\\n  z-index: 2;\\n  padding-top: 4px;\\n  flex-grow: 0;\\n}\\n\\n.euiDataGrid__restrictBody {\\n  height: 100vh;\\n  overflow: hidden;\\n}\\n\\n.euiDataGrid__restrictBody .euiHeader[data-fixed-header] {\\n  z-index: 998 !important;\\n}\\n\\n.euiDataGrid__restrictBody .euiOverlayMask[data-relative-to-header=below] {\\n  top: 0;\\n}\\n\\n.euiDataGrid__restrictBody .euiFlyout {\\n  top: 0;\\n  height: 100%;\\n}\\n\\n.euiDataGrid__focusWrap {\\n  height: 100%;\\n}\\n\\n.euiDataGrid__virtualized {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #FFF;\\n  scrollbar-width: thin;\\n  scroll-padding: 0;\\n}\\n\\n.euiDataGrid__virtualized::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGrid__virtualized::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #FFF;\\n}\\n\\n.euiDataGrid__virtualized::-webkit-scrollbar-corner, .euiDataGrid__virtualized::-webkit-scrollbar-track {\\n  background-color: #FFF;\\n}\\n\\n.euiDataGrid__scrollOverlay {\\n  position: absolute;\\n  top: -1px;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  pointer-events: none;\\n  box-shadow: inset 0 0 0 1px #D3DAE6;\\n}\\n\\n.euiDataGrid--bordersHorizontal .euiDataGrid__scrollOverlay {\\n  box-shadow: inset 0 -2px 0 -1px #D3DAE6;\\n}\\n\\n.euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayBottom {\\n  position: absolute;\\n  width: 100%;\\n  height: 1px;\\n  background-color: #D3DAE6;\\n}\\n\\n.euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayRight {\\n  position: absolute;\\n  height: 100%;\\n  width: 1px;\\n  background-color: #D3DAE6;\\n}\\n\\n.euiDataGridHeader {\\n  display: flex;\\n  z-index: 999;\\n  background: #FFF;\\n  position: sticky;\\n  top: 0;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\n\\n.euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  padding: 6px;\\n  flex: 0 0 auto;\\n  position: relative;\\n  align-items: center;\\n  display: flex;\\n}\\n\\n.euiDataGridHeaderCell > [data-focus-lock-disabled] {\\n  width: 100%;\\n}\\n\\n.euiDataGridHeaderCell:focus, .euiDataGridHeaderCell--hasColumnActions:focus-within, .euiDataGridHeaderCell--isActionsPopoverOpen {\\n  outline: none;\\n}\\n\\n.euiDataGridHeaderCell:focus::after, .euiDataGridHeaderCell--hasColumnActions:focus-within::after, .euiDataGridHeaderCell--isActionsPopoverOpen::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #0071c2);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__button {\\n  position: relative;\\n  display: flex;\\n  align-items: center;\\n  gap: 4px;\\n  width: 100%;\\n  font-weight: 700;\\n  outline: none;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__content {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__sortingArrow {\\n  flex: 0 0 auto;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__icon {\\n  flex: 0 0 auto;\\n  margin-left: auto;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  height: 16px;\\n  overflow: hidden;\\n  width: 0;\\n  opacity: 0;\\n  transition: width 150ms ease-in, opacity 350ms ease-in;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):focus-within .euiDataGridHeaderCell__icon, .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):hover .euiDataGridHeaderCell__icon,\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiPopover-isOpen .euiDataGridHeaderCell__icon {\\n  width: 16px;\\n  opacity: 1;\\n}\\n\\n.euiDataGridHeaderCell.euiDataGridHeaderCell--numeric .euiDataGridHeaderCell__content, .euiDataGridHeaderCell.euiDataGridHeaderCell--currency .euiDataGridHeaderCell__content {\\n  flex-grow: 1;\\n  text-align: right;\\n}\\n\\n.euiDataGridHeader__action--selected {\\n  font-weight: 700 !important;\\n}\\n\\n.euiDataGrid--bordersNone.euiDataGrid--bordersHorizontal .euiDataGridHeader {\\n  background: #FFF;\\n}\\n\\n.euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-left: none;\\n  border-right: none;\\n  border-bottom: 2px solid #D3DAE6;\\n  border-bottom-color: #343741;\\n}\\n\\n.euiDataGrid--bordersNone.euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-bottom: 2px solid #D3DAE6;\\n  border-color: #343741;\\n}\\n\\n.euiDataGrid--headerShade .euiDataGridHeaderCell {\\n  background: #f5f7fa;\\n}\\n\\n.euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-right: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  border-left: none;\\n}\\n\\n.euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell:first-of-type {\\n  border-left: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGrid--headerShade.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-bottom: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGrid--bordersNone .euiDataGridHeaderCell {\\n  border: none;\\n}\\n\\n.euiDataGrid--borderhorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-right: none;\\n  border-left: none;\\n}\\n\\n.euiDataGrid--fontSizeSmall .euiDataGridHeaderCell {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\n\\n.euiDataGrid--fontSizeLarge .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\n\\n.euiDataGrid--paddingSmall .euiDataGridHeaderCell {\\n  padding: 4px;\\n}\\n\\n.euiDataGrid--paddingLarge .euiDataGridHeaderCell {\\n  padding: 8px;\\n}\\n\\n.euiDataGrid--noControls.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-top: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGrid--noControls.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGridFooter {\\n  display: flex;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\n\\n.euiDataGridRowCell.euiDataGridFooterCell {\\n  flex: 0 0 auto;\\n  position: relative;\\n  font-weight: 700;\\n}\\n\\n.euiDataGrid--stickyFooter .euiDataGridFooter {\\n  position: sticky;\\n  bottom: 0;\\n}\\n\\n.euiDataGrid--footerOverline .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-top: 2px solid #D3DAE6;\\n  border-top-color: #343741 !important;\\n  background: #FFF !important;\\n}\\n\\n.euiDataGrid--bordersNone .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\n\\n.euiDataGrid--bordersHorizontal .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\n\\n.euiDataGrid--footerShade .euiDataGridRowCell.euiDataGridFooterCell {\\n  background: #f5f7fa;\\n}\\n\\n.euiDataGridColumnResizer {\\n  position: absolute;\\n  top: 0;\\n  right: -8px;\\n  height: 100%;\\n  width: 16px;\\n  cursor: ew-resize;\\n  opacity: 0;\\n  z-index: 2;\\n}\\n\\n.euiDataGridColumnResizer::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  left: 7px;\\n  top: 0;\\n  bottom: 0;\\n  width: 3px;\\n  background-color: #07C;\\n}\\n\\n.euiDataGridColumnResizer:hover, .euiDataGridColumnResizer:active {\\n  opacity: 1;\\n}\\n\\n.euiDataGridColumnResizer:hover ~ .euiDataGridHeaderCell__content, .euiDataGridColumnResizer:active ~ .euiDataGridHeaderCell__content {\\n  -webkit-user-select: none;\\n  -moz-user-select: none;\\n  -ms-user-select: none;\\n      user-select: none;\\n}\\n\\n.euiDataGridHeaderCell:last-child .euiDataGridColumnResizer {\\n  right: 0;\\n  width: 8px;\\n}\\n\\n.euiDataGridHeaderCell:last-child .euiDataGridColumnResizer::after {\\n  left: auto;\\n  right: 0;\\n}\\n\\n.euiDataGridRow {\\n  background-color: #FFF;\\n}\\n\\n.euiDataGridRowCell {\\n  position: relative;\\n  border-right: solid 1px #edf0f5;\\n  border-bottom: 1px solid #D3DAE6;\\n  --euiDataGridCellOutlineColor: #07C;\\n}\\n\\n.euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 6px;\\n  height: 100%;\\n  overflow: hidden;\\n}\\n\\n.euiDataGridRowCell .euiDataGridRowCell__content--autoHeight {\\n  height: auto;\\n}\\n\\n.euiDataGridRowCell > [data-focus-lock-disabled] {\\n  height: 100%;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--firstColumn {\\n  border-left: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--lastColumn {\\n  border-right-color: #D3DAE6;\\n}\\n\\n.euiDataGridRowCell:hover, .euiDataGridRowCell:focus, .euiDataGridRowCell.euiDataGridRowCell--open {\\n  outline: none;\\n}\\n\\n.euiDataGridRowCell:hover::after, .euiDataGridRowCell:focus::after, .euiDataGridRowCell.euiDataGridRowCell--open::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #0071c2);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\n\\n.euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) {\\n  --euiDataGridCellOutlineColor: #69707D;\\n}\\n\\n.euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) .euiDataGridRowCell__actions {\\n  -webkit-animation-delay: 350ms;\\n  animation-delay: 350ms;\\n}\\n\\n.euiDataGridRowCell:hover .euiDataGridRowCell__actions, .euiDataGridRowCell:focus .euiDataGridRowCell__actions, .euiDataGridRowCell:focus-within .euiDataGridRowCell__actions, .euiDataGridRowCell.euiDataGridRowCell--open .euiDataGridRowCell__actions, .euiDataGridRowCell[data-keyboard-closing] .euiDataGridRowCell__actions {\\n  -webkit-animation-duration: 90ms;\\n  animation-duration: 90ms;\\n  -webkit-animation-name: euiDataGridCellActionsSlideIn;\\n  animation-name: euiDataGridCellActionsSlideIn;\\n  -webkit-animation-iteration-count: 1;\\n  animation-iteration-count: 1;\\n  -webkit-animation-fill-mode: forwards;\\n  animation-fill-mode: forwards;\\n}\\n\\n.euiDataGridRowCell:not(:hover):not(:focus):not(.euiDataGridRowCell--open):not([data-keyboard-closing]) .euiDataGridRowCell__actions {\\n  display: none;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--numeric {\\n  text-align: right;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--currency {\\n  text-align: right;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--uppercase {\\n  text-transform: uppercase;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--lowercase {\\n  text-transform: lowercase;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--capitalize {\\n  text-transform: capitalize;\\n}\\n\\n.euiDataGridRowCell__popover {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  overflow: auto;\\n  z-index: 1000 !important;\\n  filter: none;\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  -webkit-animation-duration: 250ms;\\n  animation-duration: 250ms;\\n  -webkit-animation-name: euiDataGridCellPopover;\\n  animation-name: euiDataGridCellPopover;\\n}\\n\\n.euiDataGridRowCell__popover::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGridRowCell__popover::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiDataGridRowCell__popover::-webkit-scrollbar-corner, .euiDataGridRowCell__popover::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiDataGridRowCell--controlColumn .euiDataGridRowCell__content {\\n  max-height: 100%;\\n  height: auto;\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiDataGridRowCell__actions,\\n.euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  position: absolute;\\n  bottom: 100%;\\n}\\n\\n.euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions,\\n.euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  left: 0;\\n}\\n\\n.euiDataGridRowCell--alignRight .euiDataGridRowCell__actions,\\n.euiDataGridRowCell--alignRight .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  right: 0;\\n}\\n\\n.euiDataGridRowCell__actions {\\n  z-index: 998;\\n  margin-bottom: -1px;\\n  display: flex;\\n  gap: 2px;\\n  padding-inline: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n  color: #FFF;\\n  border: 1px solid var(--euiDataGridCellOutlineColor);\\n  border-top-left-radius: 3px;\\n  border-top-right-radius: 3px;\\n  transform: scaleY(0);\\n  transform-origin: bottom;\\n}\\n\\n.euiDataGridRowCell[data-gridcell-visible-row-index=\\\"0\\\"] > .euiDataGridRowCell__actions {\\n  z-index: 999;\\n}\\n\\n.euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions {\\n  border-bottom-right-radius: 3px;\\n}\\n\\n.euiDataGridRowCell--alignRight .euiDataGridRowCell__actions {\\n  border-bottom-left-radius: 3px;\\n}\\n\\n.euiDataGridRowCell__actions::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 100%;\\n  height: 2px;\\n  width: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n}\\n\\n.euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions::after {\\n  left: -1px;\\n}\\n\\n.euiDataGridRowCell--alignRight .euiDataGridRowCell__actions::after {\\n  right: -1px;\\n}\\n\\n.euiDataGridRowCell__actionButtonIcon {\\n  height: 20px;\\n  width: 16px;\\n  border-radius: 0;\\n  /* Force all cell action buttons to match EUI colors */\\n  /* Manually increase the size of the expand cell icon - it's a bit small by default */\\n}\\n\\n.euiDataGridRowCell__actionButtonIcon,\\n.euiDataGridRowCell__actionButtonIcon svg {\\n  background-color: transparent !important;\\n  color: currentColor !important;\\n  fill: currentColor !important;\\n}\\n\\n.euiDataGridRowCell__actionButtonIcon.euiDataGridRowCell__expandCell .euiIcon {\\n  width: 120%;\\n  height: 100%;\\n}\\n\\n.euiDataGrid--stripes .euiDataGridRow--striped {\\n  background-color: #F5F7FA;\\n}\\n\\n.euiDataGrid--rowHoverHighlight .euiDataGridRow:hover {\\n  background-color: #fff9e8;\\n}\\n\\n.euiDataGrid--bordersNone .euiDataGridRowCell {\\n  border-color: transparent !important;\\n}\\n\\n.euiDataGrid--bordersHorizontal .euiDataGridRowCell {\\n  border-right-color: transparent;\\n  border-left-color: transparent;\\n}\\n\\n.euiDataGrid--fontSizeSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\n\\n.euiDataGrid--fontSizeLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\n\\n.euiDataGrid--paddingSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 4px;\\n}\\n\\n.euiDataGrid--paddingLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 8px;\\n}\\n\\n@-webkit-keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@-webkit-keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n.euiDataGrid__controls {\\n  background: #fafbfd;\\n  position: relative;\\n  z-index: 2;\\n  border: 1px solid #D3DAE6;\\n  padding: 4px 4px 4px 0;\\n  display: flex;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\n\\n.euiDataGrid__rightControls {\\n  white-space: nowrap;\\n}\\n\\n.euiDataGrid__rightControls:only-child {\\n  margin-left: auto;\\n}\\n\\n.euiDataGrid__rightControls > * + * {\\n  margin-left: 8px;\\n}\\n\\n.euiDataGrid__leftControls > * + * {\\n  margin-left: 2px;\\n}\\n\\n.euiDataGrid--bordersNone .euiDataGrid__controls {\\n  border: none;\\n  background: #FFF;\\n}\\n\\n.euiDataGrid--bordersHorizontal .euiDataGrid__controls {\\n  border-right: none;\\n  border-left: none;\\n  border-top: none;\\n  background: #FFF;\\n}\\n\\n.euiDataGrid__controlScroll {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  padding: 8px;\\n  margin: -8px;\\n}\\n\\n.euiDataGrid__controlScroll::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGrid__controlScroll::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiDataGrid__controlScroll::-webkit-scrollbar-corner, .euiDataGrid__controlScroll::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiDataGrid__controlScroll:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.euiDataGrid__controlScroll[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.euiDataGridColumnSelector__item {\\n  padding: 4px;\\n}\\n\\n.euiDataGridColumnSelector__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  background: #FFF;\\n}\\n\\n.euiDataGridColumnSelector__columnList {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  margin: 0 -8px;\\n}\\n\\n.euiDataGridColumnSelector__columnList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGridColumnSelector__columnList::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiDataGridColumnSelector__columnList::-webkit-scrollbar-corner, .euiDataGridColumnSelector__columnList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiDataGridColumnSelector__columnList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.euiDataGridColumnSelector__columnList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.euiDataGridColumnSelector__itemLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\n\\n.euiDataGridColumnSorting__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  background: #FFF;\\n}\\n\\n.euiDataGridColumnSorting__fieldList {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  max-height: 300px;\\n}\\n\\n.euiDataGridColumnSorting__fieldList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGridColumnSorting__fieldList::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiDataGridColumnSorting__fieldList::-webkit-scrollbar-corner, .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiDataGridColumnSorting__fieldList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.euiDataGridColumnSorting__fieldList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.euiDataGridColumnSorting__field {\\n  display: block;\\n  padding: 4px 8px;\\n  width: 100%;\\n  outline-offset: -2px;\\n}\\n\\n.euiDataGridColumnSorting__field:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\n\\n.euiDataGridColumnSorting__field:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiDataGridColumnSorting__field:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #ABB4C4;\\n}\\n\\n.euiDataGridColumnSorting__name {\\n  padding-right: 24px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\n.euiDataGridColumnSorting__order {\\n  min-width: 200px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\n.euiDataGridColumnSorting__order .euiButtonGroup__buttons {\\n  border: none;\\n}\\n\\n.euiDataGridColumnSorting__order .euiButtonGroupButton {\\n  font-size: 12px;\\n}\\n\\n.euiDataGrid__displayPopoverPanel {\\n  width: 416px;\\n}\\n\\n.euiDataGrid__keyboardShortcuts {\\n  display: block;\\n  max-inline-size: 400px;\\n  max-block-size: 80vh;\\n  overflow-y: auto;\\n  overflow-block: auto;\\n}\\n\\n.euiDataGrid__keyboardShortcuts .euiDescriptionList {\\n  row-gap: 0;\\n}\\n\\n/**\\n  * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n  *    they actually click this input.\\n  */\\n.euiCheckbox {\\n  position: relative;\\n}\\n\\n.euiCheckbox .euiCheckbox__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\n\\n.euiCheckbox .euiCheckbox__input ~ .euiCheckbox__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\n\\n.euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 4px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:checked + .euiCheckbox__square {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%28255, 255, 255%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiCheckbox .euiCheckbox__input:indeterminate + .euiCheckbox__square {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%28255, 255, 255%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiCheckbox .euiCheckbox__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\n\\n.euiCheckbox .euiCheckbox__input[disabled] ~ .euiCheckbox__label {\\n  color: #98A2B3;\\n  cursor: not-allowed !important;\\n}\\n\\n.euiCheckbox .euiCheckbox__input[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:checked[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%2894, 100, 111%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiCheckbox .euiCheckbox__input:indeterminate[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%2894, 100, 111%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiCheckbox.euiCheckbox--inList, .euiCheckbox.euiCheckbox--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\n\\n.euiCheckbox.euiCheckbox--inList .euiCheckbox__input,\\n.euiCheckbox.euiCheckbox--inList .euiCheckbox__square, .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input,\\n.euiCheckbox.euiCheckbox--noLabel .euiCheckbox__square {\\n  top: 0;\\n}\\n\\n.euiCheckbox.euiCheckbox--inList .euiCheckbox__input, .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input {\\n  margin: 0;\\n}\\n\\n.euiCheckboxGroup__item + .euiCheckboxGroup__item {\\n  margin-top: 4px;\\n}\\n\\n.euiCheckboxGroup__item + .euiCheckboxGroup__item.euiCheckbox--compressed {\\n  margin-top: 0;\\n}\\n\\n.euiDescribedFormGroup {\\n  max-width: 800px;\\n}\\n\\n.euiDescribedFormGroup + * {\\n  margin-top: 24px;\\n}\\n\\n.euiDescribedFormGroup.euiDescribedFormGroup--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiDescribedFormGroup .euiDescribedFormGroup__description {\\n  padding-top: 8px;\\n}\\n\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields {\\n  min-width: 0;\\n}\\n\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child,\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel) {\\n  margin-top: 0;\\n}\\n\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child::before,\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel)::before {\\n  content: \\\"\\\";\\n}\\n\\n.euiDescribedFormGroup__descriptionColumn {\\n  min-width: min(20rem, 50%);\\n}\\n\\n.euiFieldNumber {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\n\\n.euiFieldNumber--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFieldNumber--compressed {\\n  height: 32px;\\n}\\n\\n.euiFieldNumber--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldNumber {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiFieldNumber::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldNumber:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiFieldNumber:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiFieldNumber--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldNumber--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFieldNumber--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldNumber--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiFieldNumber--withIcon {\\n  padding-left: 40px;\\n}\\n\\n.euiFieldNumber--withIcon.euiFieldNumber--compressed {\\n  padding-left: 32px;\\n}\\n\\n.euiFieldPassword {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n}\\n\\n.euiFieldPassword--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFieldPassword--compressed {\\n  height: 32px;\\n}\\n\\n.euiFieldPassword--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldPassword {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiFieldPassword::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldPassword:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiFieldPassword:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiFieldPassword--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldPassword--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFieldPassword--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldPassword--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiFieldPassword.euiFieldPassword--compressed {\\n  padding-left: 32px;\\n}\\n\\n.euiFieldPassword--withToggle::-ms-reveal {\\n  display: none;\\n}\\n\\n/*\\n * 1. Fix for Safari to ensure that it renders like a normal text input\\n *    and doesn't add extra spacing around text\\n*/\\n.euiFieldSearch {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n  -webkit-appearance: textfield;\\n  /* 1 */\\n}\\n\\n.euiFieldSearch--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFieldSearch--compressed {\\n  height: 32px;\\n}\\n\\n.euiFieldSearch--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldSearch {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiFieldSearch::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldSearch:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiFieldSearch:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiFieldSearch--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldSearch--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFieldSearch--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldSearch--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiFieldSearch-isLoading {\\n  padding-right: 40px;\\n}\\n\\n.euiFieldSearch-isLoading.euiFieldSearch--compressed {\\n  padding-right: 32px;\\n}\\n\\n.euiFieldSearch::-webkit-search-decoration, .euiFieldSearch::-webkit-search-cancel-button {\\n  -webkit-appearance: none;\\n  /* 1, 2 */\\n}\\n\\n.euiFieldSearch--compressed {\\n  padding-left: 32px;\\n}\\n\\n.euiFieldText {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\n\\n.euiFieldText--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFieldText--compressed {\\n  height: 32px;\\n}\\n\\n.euiFieldText--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldText {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiFieldText::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldText:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldText::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldText:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldText:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiFieldText:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiFieldText--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldText--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFieldText--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldText--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiFieldText--withIcon {\\n  padding-left: 40px;\\n}\\n\\n.euiFieldText--withIcon.euiFieldText--compressed {\\n  padding-left: 32px;\\n}\\n\\n/**\\n  * REMEMBER: --large modifiers must come last to override --compressed\\n  */\\n.euiFilePicker {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  position: relative;\\n}\\n\\n.euiFilePicker--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFilePicker--compressed {\\n  height: 32px;\\n}\\n\\n.euiFilePicker--inGroup {\\n  height: 100%;\\n}\\n\\n.euiFilePicker.euiFilePicker--large {\\n  border-radius: 6px;\\n  overflow: hidden;\\n  height: auto;\\n}\\n\\n.euiFilePicker.euiFilePicker--large.euiFilePicker--compressed {\\n  border-radius: 4px;\\n}\\n\\n.euiFilePicker__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\n\\n.euiFilePicker__input:hover {\\n  cursor: pointer;\\n}\\n\\n.euiFilePicker__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\n\\n.euiFilePicker__input:disabled {\\n  opacity: 0;\\n}\\n\\n.euiFilePicker__input:disabled ~ .euiFilePicker__prompt {\\n  color: #98A2B3;\\n}\\n\\n.euiFilePicker__icon {\\n  position: absolute;\\n  left: 12px;\\n  top: 12px;\\n  transition: transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\n\\n.euiFilePicker--compressed .euiFilePicker__icon {\\n  top: 8px;\\n  left: 8px;\\n}\\n\\n.euiFilePicker--large .euiFilePicker__icon {\\n  position: static;\\n  margin-bottom: 16px;\\n}\\n\\n/**\\n  * 1. Don't block the user from dropping files onto the filepicker.\\n  * 2. Ensure space for import icon, loading spinner, and clear button (only if it has files)\\n  * 4. Static height so that it doesn't shift its surrounding contents around\\n  */\\n.euiFilePicker__prompt {\\n  padding-left: 40px;\\n  /* 2 */\\n  height: 40px;\\n  padding-top: 12px;\\n  padding-right: 12px;\\n  padding-bottom: 12px;\\n  pointer-events: none;\\n  /* 1 */\\n  border: 2px dashed #D3DAE6;\\n  border-radius: 6px;\\n  transition: border-color 150ms ease-in, background-color 150ms ease-in;\\n}\\n\\n.euiFilePicker--compressed .euiFilePicker__prompt {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  padding-left: 32px;\\n  /* 2 */\\n  height: 32px;\\n  border-radius: 4px;\\n  box-shadow: none;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFilePicker--compressed .euiFilePicker__prompt {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFilePicker--large .euiFilePicker__prompt {\\n  height: 128px;\\n  /* 4 */\\n  padding: 0 24px;\\n  display: flex;\\n  flex-direction: column;\\n  align-items: center;\\n  justify-content: center;\\n}\\n\\n.euiFilePicker--large.euiFilePicker--compressed .euiFilePicker__prompt {\\n  height: 104px;\\n  /* 4 */\\n}\\n\\n.euiFilePicker-isInvalid:not(.euiFilePicker__showDrop) .euiFilePicker__input:not(:disabled):not(:focus) + .euiFilePicker__prompt {\\n  border-color: #BD271E;\\n}\\n\\n.euiFilePicker__promptText {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  line-height: 16px;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) .euiFilePicker__promptText {\\n  color: #0071c2;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__promptText {\\n  margin-top: -2px;\\n}\\n\\n.euiFilePicker__clearButton,\\n.euiFilePicker__loadingSpinner {\\n  position: absolute;\\n  right: 12px;\\n  top: 12px;\\n}\\n\\n.euiFilePicker--compressed .euiFilePicker__clearButton,\\n.euiFilePicker--compressed .euiFilePicker__loadingSpinner {\\n  top: 8px;\\n}\\n\\n/**\\n  * 1. Undo the pointer-events: none applied to the enclosing prompt.\\n  */\\n.euiFilePicker__clearButton {\\n  pointer-events: auto;\\n  /* 1 */\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton .euiFilePicker__clearIcon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 2px;\\n}\\n\\n.euiFilePicker--large .euiFilePicker__clearButton {\\n  position: relative;\\n  top: 0;\\n  right: 0;\\n}\\n\\n.euiFilePicker__showDrop .euiFilePicker__prompt,\\n.euiFilePicker__input:focus + .euiFilePicker__prompt {\\n  border-color: #07C;\\n}\\n\\n.euiFilePicker__input:disabled + .euiFilePicker__prompt {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  box-shadow: none;\\n}\\n\\n.euiFilePicker__input:disabled + .euiFilePicker__prompt::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFilePicker__input:disabled + .euiFilePicker__prompt:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFilePicker__input:disabled + .euiFilePicker__prompt::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large).euiFilePicker-isLoading .euiFilePicker__prompt, .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-hasFiles .euiFilePicker__prompt {\\n  padding-right: 40px;\\n  /* 2 */\\n}\\n\\n.euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  color: #343741;\\n}\\n\\n.euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__promptText,\\n.euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\n\\n.euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__icon,\\n.euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\n\\n.euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\n\\n.euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\n\\n.euiFilePicker--large.euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  font-weight: 700;\\n}\\n\\n.euiForm__error {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  list-style: disc;\\n}\\n\\n.euiForm__errors {\\n  margin-bottom: 16px;\\n}\\n\\n/**\\n * 1. Ensure the descenders don't get cut off\\n */\\n.euiSelect {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\n\\n.euiSelect--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiSelect--compressed {\\n  height: 32px;\\n}\\n\\n.euiSelect--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiSelect {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiSelect::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSelect:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSelect::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSelect:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSelect:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiSelect:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiSelect--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiSelect--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiSelect--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSelect--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiSelect--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\n\\n.euiSelect--inGroup {\\n  line-height: 38px;\\n  /* 1 */\\n}\\n\\n.euiSelect--inGroup.euiSelect--compressed {\\n  line-height: 30px;\\n  /* 1 */\\n}\\n\\n.euiSelect::-ms-expand {\\n  display: none;\\n}\\n\\n.euiSelect:focus::-ms-value {\\n  color: #343741;\\n  background: transparent;\\n}\\n\\n.euiSelect:-moz-focusring {\\n  color: transparent;\\n  text-shadow: 0 0 0 #343741;\\n}\\n\\n.euiSuperSelect__listbox {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 300px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n}\\n\\n.euiSuperSelect__listbox::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiSuperSelect__listbox::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiSuperSelect__listbox::-webkit-scrollbar-corner, .euiSuperSelect__listbox::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiSuperSelect__item {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 8px;\\n}\\n\\n.euiSuperSelect__item:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\n\\n.euiSuperSelect__item:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiSuperSelect__item:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #ABB4C4;\\n}\\n\\n.euiSuperSelect__item--hasDividers:not(:last-of-type) {\\n  border-bottom: 1px solid #D3DAE6;\\n}\\n\\n/**\\n * 1. Ensure the descenders don't get cut off\\n * 2. Makes sure the height is correct when there's no selection\\n */\\n.euiSuperSelectControl {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  display: block;\\n  /* 2 */\\n  text-align: left;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\n\\n.euiSuperSelectControl--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiSuperSelectControl--compressed {\\n  height: 32px;\\n}\\n\\n.euiSuperSelectControl--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiSuperSelectControl {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiSuperSelectControl::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSuperSelectControl:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiSuperSelectControl:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiSuperSelectControl--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiSuperSelectControl--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiSuperSelectControl--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSuperSelectControl--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiSuperSelectControl-isInvalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSuperSelectControl--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\n\\n.euiSuperSelectControl__placeholder {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n}\\n\\n.euiSuperSelectControl.euiSuperSelect--isOpen__button {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFormControlLayout {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n}\\n\\n.euiFormControlLayout--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFormControlLayout--compressed {\\n  height: 32px;\\n}\\n\\n.euiFormControlLayout--inGroup {\\n  height: 100%;\\n}\\n\\n.euiFormControlLayout--1icons {\\n  --eui-form-control-layout-icons-padding: 34px;\\n  padding-right: 34px;\\n}\\n\\n.euiFormControlLayout--1icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 26px;\\n  padding-right: 26px;\\n}\\n\\n.euiFormControlLayout--2icons {\\n  --eui-form-control-layout-icons-padding: 56px;\\n  padding-right: 56px;\\n}\\n\\n.euiFormControlLayout--2icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 44px;\\n  padding-right: 44px;\\n}\\n\\n.euiFormControlLayout--3icons {\\n  --eui-form-control-layout-icons-padding: 78px;\\n  padding-right: 78px;\\n}\\n\\n.euiFormControlLayout--3icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 62px;\\n  padding-right: 62px;\\n}\\n\\n.euiFormControlLayout--4icons {\\n  --eui-form-control-layout-icons-padding: 100px;\\n  padding-right: 100px;\\n}\\n\\n.euiFormControlLayout--4icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 80px;\\n  padding-right: 80px;\\n}\\n\\n.euiFormControlLayout--5icons {\\n  --eui-form-control-layout-icons-padding: 122px;\\n  padding-right: 122px;\\n}\\n\\n.euiFormControlLayout--5icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 98px;\\n  padding-right: 98px;\\n}\\n\\n.euiFormControlLayout__childrenWrapper {\\n  position: relative;\\n}\\n\\n/**\\n * 1. Account for inner box-shadow style border\\n * 2. Ensure truncation works in children elements\\n */\\n.euiFormControlLayout--group {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFormControlLayout--group {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFormControlLayout--group > *,\\n.euiFormControlLayout--group .euiButtonEmpty,\\n.euiFormControlLayout--group .euiText,\\n.euiFormControlLayout--group .euiFormLabel,\\n.euiFormControlLayout--group .euiButtonIcon {\\n  height: 100%;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper {\\n  flex-grow: 1;\\n  overflow: hidden;\\n  /* 2 */\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend,\\n.euiFormControlLayout--group .euiFormControlLayout__append {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  flex-shrink: 0;\\n  height: 100%;\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend.euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n  background-color: #e9edf3;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon, .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty {\\n  transform: none !important;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon .euiIcon, .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty .euiIcon {\\n  background: none !important;\\n  padding: 0;\\n  width: 16px;\\n}\\n\\n.euiFormControlLayout--group .euiButtonIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group .euiButtonIcon:not(:focus) {\\n  background-color: #e9edf3;\\n}\\n\\n.euiFormControlLayout--group .euiButtonIcon:focus-visible {\\n  outline: 2px solid #0071c2;\\n  outline-offset: -2px;\\n}\\n\\n.euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  height: 100%;\\n  background-color: #e9edf3;\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group > .euiFormControlLayout__prepend,\\n.euiFormControlLayout--group > .euiFormControlLayout__append {\\n  max-width: 50%;\\n}\\n\\n.euiFormControlLayout--group .euiFormLabel,\\n.euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  background-color: #e9edf3;\\n  padding: 12px;\\n  line-height: 16px !important;\\n  cursor: default !important;\\n}\\n\\n.euiFormControlLayout--group .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper):not(input),\\n.euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper):not(input) {\\n  margin-left: -12px;\\n}\\n\\n.euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\n.euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -12px;\\n}\\n\\n.euiFormControlLayout--group .euiButtonEmpty {\\n  border-right: none;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ .euiButtonEmpty,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ * .euiButtonEmpty {\\n  border-right: none;\\n  border-left: none;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n  overflow: hidden;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel,\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  padding: 8px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper),\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper) {\\n  margin-left: -8px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\n.euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -8px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--readOnly {\\n  cursor: default;\\n  background: #e9edf3;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px #e9edf3;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--readOnly input {\\n  background-color: #FFF;\\n}\\n\\n.euiFormControlLayoutDelimited {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFormControlLayoutDelimited {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFormControlLayoutDelimited > .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  width: 100%;\\n  background-color: #fbfcfd;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper, .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper > *:not(.euiFormControlLayoutDelimited__delimiter):not(.euiFormControlLayoutIcons) {\\n  width: 100%;\\n  max-width: none;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled] {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled]::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled]:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled]::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled] .euiFormControlLayout__childrenWrapper {\\n  background-color: #eef2f7;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] .euiFormControlLayout__childrenWrapper {\\n  background-color: #FFF;\\n}\\n\\n.euiFormControlLayoutDelimited--isInvalid .euiFormControlLayout__childrenWrapper {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFormControlLayoutDelimited__input {\\n  box-shadow: none !important;\\n  border-radius: 0 !important;\\n  text-align: center;\\n  height: 100%;\\n  min-width: 0;\\n}\\n\\n.euiFormControlLayoutDelimited__delimiter {\\n  align-self: stretch;\\n  flex-grow: 0;\\n  display: flex;\\n  align-items: center;\\n  line-height: 1;\\n}\\n\\n.euiFormControlLayoutIcons {\\n  pointer-events: none;\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiFormControlLayoutIcons > * + * {\\n  margin-left: 6px;\\n}\\n\\n.euiFormControlLayoutIcons--absolute {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 12px;\\n}\\n\\n.euiFormControlLayout--compressed .euiFormControlLayoutIcons--absolute {\\n  left: 8px;\\n}\\n\\n.euiFormControlLayoutIcons--static {\\n  position: static;\\n  height: 100%;\\n  align-self: stretch;\\n  flex-grow: 0;\\n  padding-inline: 12px;\\n}\\n\\n.euiFormControlLayout--compressed .euiFormControlLayoutIcons--static {\\n  padding-inline: 8px;\\n}\\n\\n.euiFormControlLayoutIcons--left {\\n  z-index: 1;\\n}\\n\\n.euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 12px;\\n}\\n\\n.euiFormControlLayout--compressed .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 8px;\\n}\\n\\n*:disabled + .euiFormControlLayoutIcons {\\n  cursor: not-allowed;\\n  color: #98A2B3;\\n}\\n\\n.euiFormControlLayoutClearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\n\\n.euiFormControlLayoutClearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiFormControlLayoutClearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFormControlLayoutClearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFormControlLayoutClearButton .euiFormControlLayoutClearButton__icon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 2px;\\n}\\n\\n.euiFormControlLayoutClearButton--small {\\n  width: 12px;\\n  height: 12px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 12px;\\n  line-height: 0;\\n}\\n\\n.euiFormControlLayoutClearButton--small:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiFormControlLayoutClearButton--small:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFormControlLayoutClearButton--small:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFormControlLayoutClearButton--small .euiFormControlLayoutClearButton__icon {\\n  width: 6px;\\n  height: 6px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 4px;\\n}\\n\\n.euiFormControlLayoutCustomIcon {\\n  pointer-events: none;\\n  font-size: 0;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable .euiFormControlLayoutCustomIcon__icon {\\n  vertical-align: baseline;\\n  transform: none;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable:disabled {\\n  cursor: not-allowed;\\n  color: #98A2B3;\\n}\\n\\n.euiFormErrorText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #BD271E;\\n}\\n\\n.euiFormLegend {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-weight: 600;\\n}\\n\\n.euiFormLegend:not(.euiFormLegend-isHidden) {\\n  margin-bottom: 8px;\\n}\\n\\n.euiFormLegend:not(.euiFormLegend-isHidden).euiFormLegend--compressed {\\n  margin-bottom: 4px;\\n}\\n\\n.euiFormHelpText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #69707D;\\n}\\n\\n/**\\n * 1. Focused state overrides invalid state.\\n * 2. Disabled state overrides pointer.\\n */\\n.euiFormLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-weight: 600;\\n  display: inline-block;\\n  transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\n\\n.euiFormLabel.euiFormLabel-isInvalid {\\n  color: #BD271E;\\n  /* 1 */\\n}\\n\\n.euiFormLabel.euiFormLabel-isFocused {\\n  color: #07C;\\n  /* 1 */\\n}\\n\\n.euiFormLabel[for] {\\n  cursor: pointer;\\n  /* 2 */\\n}\\n\\n.euiFormLabel[for].euiFormLabel-isDisabled {\\n  cursor: default;\\n  /* 2 */\\n}\\n\\n/**\\n * 1. Coerce inline form elements to behave as block-level elements.\\n * 2. For inline forms, we need to add margin if the label doesn't exist.\\n */\\n.euiFormRow {\\n  display: flex;\\n  /* 1 */\\n  flex-direction: column;\\n  /* 1 */\\n  max-width: 400px;\\n}\\n\\n.euiFormRow + .euiFormRow,\\n.euiFormRow + .euiButton {\\n  margin-top: 16px;\\n}\\n\\n.euiFormRow--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFormRow--hasEmptyLabelSpace {\\n  margin-top: 20px;\\n  /* 2 */\\n  min-height: 40px;\\n  padding-bottom: 0;\\n  justify-content: center;\\n}\\n\\n.euiFormRow__labelWrapper {\\n  display: flex;\\n  flex-wrap: wrap;\\n  justify-content: space-between;\\n  margin-bottom: 4px;\\n}\\n\\n.euiFormRow--horizontal {\\n  flex-direction: row;\\n  align-items: stretch;\\n}\\n\\n.euiFormRow--horizontal .euiFormRow__label {\\n  -webkit-hyphens: auto;\\n  -ms-hyphens: auto;\\n      hyphens: auto;\\n}\\n\\n.euiFormRow--horizontal .euiFormRow__labelWrapper {\\n  display: block;\\n  line-height: 31px;\\n  width: calc(33% - 8px);\\n  margin-right: 8px;\\n  margin-bottom: 0;\\n}\\n\\n.euiFormRow--horizontal .euiFormRow__fieldWrapper {\\n  width: 67%;\\n}\\n\\n.euiFormRow--horizontal + .euiFormRow--horizontal {\\n  margin-top: 8px;\\n}\\n\\n.euiFormRow--horizontal + .euiFormRow--horizontal.euiFormRow--hasSwitch {\\n  margin-top: 12px;\\n}\\n\\n.euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__labelWrapper {\\n  line-height: 19px;\\n  width: auto;\\n  min-width: calc(33% - 8px);\\n}\\n\\n.euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper {\\n  width: auto;\\n}\\n\\n.euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper .euiSwitch--compressed {\\n  margin-top: 2px;\\n}\\n\\n.euiFormRow--horizontal.euiFormRow--hasSwitch + .euiFormRow--horizontal {\\n  margin-top: 12px;\\n}\\n\\n.euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 40px;\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiFormRow--compressed.euiFormRow--hasEmptyLabelSpace {\\n  min-height: 32px;\\n}\\n\\n.euiFormRow--compressed .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 32px;\\n}\\n\\n/**\\n  * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n  *    they actually click this input.\\n  */\\n.euiRadio {\\n  position: relative;\\n}\\n\\n.euiRadio .euiRadio__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\n\\n.euiRadio .euiRadio__input ~ .euiRadio__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\n\\n.euiRadio .euiRadio__input + .euiRadio__circle {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\n\\n.euiRadio .euiRadio__input:checked + .euiRadio__circle {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%28255, 255, 255%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiRadio .euiRadio__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\n\\n.euiRadio .euiRadio__input[disabled] ~ .euiRadio__label {\\n  color: #98A2B3;\\n  cursor: not-allowed !important;\\n}\\n\\n.euiRadio .euiRadio__input[disabled] + .euiRadio__circle {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n}\\n\\n.euiRadio .euiRadio__input:checked[disabled] + .euiRadio__circle {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%2894, 100, 111%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\n\\n.euiRadio .euiRadio__input:focus + .euiRadio__circle:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiRadio .euiRadio__input:focus + .euiRadio__circle:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiRadio.euiRadio--inList, .euiRadio.euiRadio--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\n\\n.euiRadio.euiRadio--inList .euiRadio__input,\\n.euiRadio.euiRadio--inList .euiRadio__circle, .euiRadio.euiRadio--noLabel .euiRadio__input,\\n.euiRadio.euiRadio--noLabel .euiRadio__circle {\\n  top: 0;\\n}\\n\\n.euiRadio.euiRadio--inList .euiRadio__input, .euiRadio.euiRadio--noLabel .euiRadio__input {\\n  margin: 0;\\n}\\n\\n.euiRadioGroup__item + .euiRadioGroup__item {\\n  margin-top: 4px;\\n}\\n\\n.euiRadioGroup__item + .euiRadioGroup__item.euiRadio--compressed {\\n  margin-top: 0;\\n}\\n\\n.euiSwitch {\\n  position: relative;\\n  display: inline-flex;\\n  align-items: flex-start;\\n  min-height: 20px;\\n}\\n\\n.euiSwitch .euiSwitch__label {\\n  cursor: pointer;\\n  padding-left: 8px;\\n  line-height: 20px;\\n  font-size: 14px;\\n  vertical-align: middle;\\n  display: inline-block;\\n}\\n\\n.euiSwitch .euiSwitch__button {\\n  flex-shrink: 0;\\n  line-height: 0;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus .euiSwitch__track:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus .euiSwitch__track:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__body {\\n  background-color: rgba(105, 112, 125, 0.75);\\n}\\n\\n.euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 0;\\n}\\n\\n.euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon {\\n  right: -8px;\\n}\\n\\n.euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon.euiSwitch__icon--checked {\\n  right: auto;\\n  left: -34px;\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled:hover,\\n.euiSwitch .euiSwitch__button:disabled ~ .euiSwitch__label:hover {\\n  cursor: not-allowed;\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled .euiSwitch__body {\\n  background-color: rgba(211, 218, 230, 0.5);\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled .euiSwitch__thumb {\\n  background-color: rgba(0, 0, 0, 0);\\n  border-color: rgba(105, 112, 125, 0.5);\\n  box-shadow: none;\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled .euiSwitch__icon {\\n  fill: #69707D;\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled + .euiSwitch__label {\\n  color: #98A2B3;\\n}\\n\\n.euiSwitch .euiSwitch__body {\\n  pointer-events: none;\\n  width: 44px;\\n  height: 20px;\\n  background-color: #07C;\\n  display: inline-block;\\n  position: relative;\\n  border-radius: 20px;\\n  vertical-align: middle;\\n}\\n\\n.euiSwitch .euiSwitch__thumb {\\n  padding: 9px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 18px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  position: absolute;\\n  display: inline-block;\\n  left: 24px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\n\\n.euiSwitch .euiSwitch__track {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  overflow: hidden;\\n  border-radius: 20px;\\n}\\n\\n.euiSwitch .euiSwitch__icon {\\n  position: absolute;\\n  right: -34px;\\n  top: 2px;\\n  bottom: 0;\\n  width: 42px;\\n  height: 16px;\\n  transition: left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), right 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  fill: #FFF;\\n}\\n\\n.euiSwitch .euiSwitch__icon--checked {\\n  right: auto;\\n  left: -8px;\\n  fill: #FFF;\\n}\\n\\n.euiSwitch:hover .euiSwitch__button:not(:disabled) .euiSwitch__thumb {\\n  transform: scale(1.05);\\n}\\n\\n.euiSwitch:hover .euiSwitch__button:active .euiSwitch__thumb {\\n  transform: scale(0.95);\\n}\\n\\n.euiSwitch.euiSwitch--compressed {\\n  min-height: 16px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__label {\\n  line-height: 16px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__body {\\n  width: 28px;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__thumb {\\n  padding: 6px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 12px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__track {\\n  border-radius: 16px;\\n}\\n\\n.euiSwitch.euiSwitch--mini {\\n  min-height: 10px;\\n}\\n\\n.euiSwitch.euiSwitch--mini .euiSwitch__label {\\n  line-height: 10px;\\n  font-size: 12px;\\n}\\n\\n.euiSwitch.euiSwitch--mini .euiSwitch__body {\\n  width: 22px;\\n  height: 10px;\\n  border-radius: 10px;\\n}\\n\\n.euiSwitch.euiSwitch--mini .euiSwitch__thumb {\\n  padding: 3px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 6px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\n\\n.euiSwitch.euiSwitch--mini .euiSwitch__track {\\n  border-radius: 10px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb, .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 1px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\n.euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb, .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\n.euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb {\\n  border-color: rgba(105, 112, 125, 0.5);\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true] .euiSwitch__thumb, .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true] .euiSwitch__thumb {\\n  border-color: #07C;\\n}\\n\\n.euiTextArea {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  line-height: 1.5;\\n}\\n\\n.euiTextArea--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiTextArea--compressed {\\n  height: 32px;\\n}\\n\\n.euiTextArea--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiTextArea {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiTextArea::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiTextArea:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiTextArea::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiTextArea:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiTextArea:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiTextArea:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiTextArea--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiTextArea--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiTextArea--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiTextArea--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiTextArea, .euiTextArea--compressed {\\n  height: auto;\\n}\\n\\n.euiFormControlLayout--euiTextArea {\\n  height: auto;\\n}\\n\\n.euiFormControlLayout--euiTextArea .euiFormControlLayoutIcons {\\n  top: auto;\\n  bottom: 12px;\\n}\\n\\n.euiTextArea--resizeVertical {\\n  resize: vertical;\\n}\\n\\n.euiTextArea--resizeHorizontal {\\n  resize: horizontal;\\n}\\n\\n.euiTextArea--resizeBoth {\\n  resize: both;\\n}\\n\\n.euiTextArea--resizeNone {\\n  resize: none;\\n}\\n\\n.euiMarkdownEditor {\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.euiMarkdownEditor--isPreviewing .euiMarkdownEditor__toggleContainer {\\n  display: none;\\n}\\n\\n.euiMarkdownEditor--fullHeight {\\n  height: 100%;\\n}\\n\\n.euiMarkdownEditor--fullHeight .euiMarkdownEditorTextArea {\\n  resize: none;\\n}\\n\\n.euiMarkdownEditor--fullHeight .euiMarkdownEditorDropZone {\\n  height: 100%;\\n}\\n\\n.euiMarkdownEditorDropZone {\\n  display: flex;\\n  position: relative;\\n  flex-direction: column;\\n  min-height: \\\"150px\\\";\\n}\\n\\n.euiMarkdownEditorDropZone__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\n\\n.euiMarkdownEditorDropZone__input:hover {\\n  cursor: pointer;\\n}\\n\\n.euiMarkdownEditorDropZone__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\n\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorFooter,\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus,\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(0, 119, 204, 0.1) !important;\\n}\\n\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%) !important;\\n}\\n\\n.euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorFooter,\\n.euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea,\\n.euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea:focus,\\n.euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(189, 39, 30, 0.1) !important;\\n}\\n\\n.euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea,\\n.euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%) !important;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__blockquote {\\n  border-left-color: rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiHorizontalRule {\\n  background-color: rgba(0, 0, 0, 0.15);\\n  color: rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table {\\n  border-left: 1px solid rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td {\\n  border-top: 1px solid rgba(0, 0, 0, 0.15);\\n  border-bottom: 1px solid rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__blockquote {\\n  border-left-color: #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiHorizontalRule {\\n  background-color: #69707D;\\n  color: #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table {\\n  border-left: 1px solid #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #69707D;\\n  border-bottom: 1px solid #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__blockquote {\\n  border-left-color: #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiHorizontalRule {\\n  background-color: #00BFB3;\\n  color: #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table {\\n  border-left: 1px solid #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #00BFB3;\\n  border-bottom: 1px solid #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiHorizontalRule {\\n  background-color: #F04E98;\\n  color: #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F04E98;\\n  border-bottom: 1px solid #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiHorizontalRule {\\n  background-color: #FEC514;\\n  color: #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FEC514;\\n  border-bottom: 1px solid #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__blockquote {\\n  border-left-color: #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiHorizontalRule {\\n  background-color: #BD271E;\\n  color: #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table {\\n  border-left: 1px solid #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #BD271E;\\n  border-bottom: 1px solid #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiHorizontalRule {\\n  background-color: #FFF;\\n  color: #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FFF;\\n  border-bottom: 1px solid #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat .euiCheckbox {\\n  margin-bottom: 0 !important;\\n}\\n\\n.euiMarkdownFormat .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  top: 50%;\\n  transform: translateY(-50%);\\n}\\n\\n.euiMarkdownFormat .euiMarkdownFormat__table {\\n  display: block;\\n  width: 100%;\\n  overflow: auto;\\n  border-spacing: 0;\\n  border-collapse: collapse;\\n}\\n\\n.euiMarkdownEditorFooter {\\n  display: inline-flex;\\n  padding: 4px;\\n  border: 1px solid #D3DAE6;\\n  align-items: center;\\n  background: #fafbfd;\\n}\\n\\n.euiMarkdownEditorFooter__popover {\\n  width: 300px;\\n}\\n\\n.euiMarkdownEditorFooter__actions {\\n  flex: 1;\\n  display: inline-flex;\\n}\\n\\n.euiMarkdownEditorFooter__actions > button,\\n.euiMarkdownEditorFooter__actions > span {\\n  margin-right: 4px;\\n  align-self: center;\\n}\\n\\n.euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError {\\n  position: relative;\\n  left: -1px;\\n  line-height: 1;\\n  border-radius: 6px;\\n}\\n\\n.euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError > span {\\n  padding: 0 4px;\\n}\\n\\n.euiMarkdownEditorFooter__helpButton > svg {\\n  width: 26px;\\n}\\n\\n.euiMarkdownEditorPreview {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background: #FFF;\\n  min-height: \\\"150px\\\";\\n  overflow-y: auto;\\n  border: 1px solid #D3DAE6;\\n  padding: 12px;\\n}\\n\\n.euiMarkdownEditorPreview::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiMarkdownEditorPreview::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiMarkdownEditorPreview::-webkit-scrollbar-corner, .euiMarkdownEditorPreview::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input ~ .euiCheckbox__label {\\n  cursor: default;\\n}\\n\\n.euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input:focus:not(:checked) + .euiCheckbox__square {\\n  border-color: #939496;\\n}\\n\\n.euiMarkdownEditorTextArea {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  width: 100%;\\n  height: 100%;\\n  min-height: \\\"150px\\\";\\n  padding: 12px;\\n  border: 1px solid #D3DAE6;\\n  border-bottom: none;\\n  line-height: 1.5;\\n  resize: vertical;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  margin: 0;\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n}\\n\\n.euiMarkdownEditorTextArea::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiMarkdownEditorTextArea:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiMarkdownEditorTextArea::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiMarkdownEditorTextArea::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiMarkdownEditorTextArea::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiMarkdownEditorTextArea::-webkit-scrollbar-corner, .euiMarkdownEditorTextArea::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiMarkdownEditorTextArea:focus, .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n}\\n\\n.euiMarkdownEditorTextArea-isReadOnly {\\n  background: #FFF;\\n  cursor: unset;\\n}\\n\\n.euiMarkdownEditorTextArea-isReadOnly:focus, .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea-isReadOnly {\\n  background: none;\\n}\\n\\n.euiMarkdownEditorToolbar {\\n  display: flex;\\n  flex-wrap: wrap;\\n  background: #F5F7FA;\\n  border: 1px solid #D3DAE6;\\n  border-color: #D3DAE6;\\n  border-bottom: none;\\n  padding: 4px;\\n}\\n\\n.euiMarkdownEditorToolbar__buttons {\\n  display: flex;\\n  flex-wrap: wrap;\\n  flex: 1;\\n  align-items: center;\\n}\\n\\n.euiMarkdownEditorToolbar__buttons > * {\\n  margin-right: 4px;\\n}\\n\\n.euiMarkdownEditorToolbar__divider {\\n  content: \\\"\\\";\\n  height: 24px;\\n  display: block;\\n  margin-left: 4px;\\n  padding-right: 4px;\\n  border-left: 1px solid #D3DAE6;\\n}\\n\\n.euiMarkdownTooltip__icon {\\n  transform: translateY(-1px);\\n}\\n\\n.euiSelectable {\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.euiSelectable-fullHeight {\\n  height: 100%;\\n}\\n\\n.euiSelectableList:has(:focus-visible) {\\n  outline: 2px solid currentColor;\\n  outline-style: auto;\\n  outline-offset: 1px;\\n}\\n\\n.euiSelectableList-fullHeight {\\n  flex-grow: 1;\\n}\\n\\n.euiSelectableList-bordered {\\n  overflow: hidden;\\n  border: 1px solid #D3DAE6;\\n  border-radius: 6px;\\n}\\n\\n.euiSelectableList__list {\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\n\\n.euiSelectableList__list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiSelectableList__list::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiSelectableList__list::-webkit-scrollbar-corner, .euiSelectableList__list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiSelectableList__list:focus, .euiSelectableList__list > ul:focus {\\n  outline: none;\\n}\\n\\n.euiSelectableList__groupLabel {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 700;\\n  display: flex;\\n  align-items: center;\\n  border-bottom: 1px solid #eef2f7;\\n  padding: 4px 12px;\\n}\\n\\n.euiSelectableListItem {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  display: inline-flex;\\n  width: 100%;\\n  text-align: left;\\n  cursor: pointer;\\n  overflow: hidden;\\n}\\n\\n.euiSelectableListItem:not(:last-of-type) {\\n  border-bottom: 1px solid #eef2f7;\\n}\\n\\n.euiSelectableListItem-isFocused:not([aria-disabled=true]), .euiSelectableListItem:hover:not([aria-disabled=true]) {\\n  color: #0071c2;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiSelectableListItem-isFocused:not([aria-disabled=true]) .euiSelectableListItem__text, .euiSelectableListItem:hover:not([aria-disabled=true]) .euiSelectableListItem__text {\\n  text-decoration: underline;\\n}\\n\\n.euiSelectableListItem[aria-disabled=true] {\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\n\\n.euiSelectableListItem--paddingSmall .euiSelectableListItem__content {\\n  padding: 4px 12px;\\n}\\n\\n.euiSelectableListItem__content {\\n  width: 100%;\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiSelectableListItem__icon,\\n.euiSelectableListItem__prepend {\\n  margin-right: 12px;\\n  flex-shrink: 0;\\n}\\n\\n.euiSelectableListItem__append {\\n  margin-left: 12px;\\n  flex-shrink: 0;\\n}\\n\\n.euiSelectableListItem__text {\\n  flex-grow: 1;\\n}\\n\\n.euiSelectableListItem__text--truncate {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n/**\\n  * 1. Prevent really long input from overflowing the container.\\n  */\\n.euiSelectableMessage {\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n  /* 1 */\\n  display: flex;\\n  flex-direction: column;\\n  justify-content: center;\\n  align-items: center;\\n}\\n\\n.euiSelectableMessage--bordered {\\n  overflow: hidden;\\n  border: 1px solid #D3DAE6;\\n  border-radius: 6px;\\n}\\n\\n.euiSelectableTemplateSitewide__listItem .euiSelectableListItem__text {\\n  text-decoration: none !important;\\n}\\n\\n.euiSelectableTemplateSitewide__listItem[class*=-isFocused]:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle, .euiSelectableTemplateSitewide__listItem:hover:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle {\\n  text-decoration: underline;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMetasList {\\n  display: block;\\n  margin-top: 4px;\\n  font-size: 12px;\\n  color: #69707D;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta:not(:last-of-type)::after {\\n  content: \\\"•\\\";\\n  margin: 0 4px;\\n  color: #69707D;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--application {\\n  color: #4a7194;\\n  font-weight: 500;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--deployment {\\n  color: #387765;\\n  font-weight: 500;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--article {\\n  color: #7c609e;\\n  font-weight: 500;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--case {\\n  color: #aa4b38;\\n  font-weight: 500;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--platform {\\n  color: #7a6c31;\\n  font-weight: 500;\\n}\\n\\n.euiTable {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-feature-settings: \\\"calt\\\" 1, \\\"kern\\\" 1, \\\"liga\\\" 1, \\\"tnum\\\" 1;\\n  width: 100%;\\n  table-layout: fixed;\\n  border: none;\\n  border-collapse: collapse;\\n  background-color: #FFF;\\n}\\n\\n.euiTable.euiTable--auto {\\n  table-layout: auto;\\n}\\n\\n.euiTableCaption {\\n  position: relative;\\n}\\n\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n.euiTableFooterCell,\\n.euiTableHeaderCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  font-weight: 500;\\n  border: none;\\n}\\n\\n.euiTableFooterCell .euiTableHeaderButton,\\n.euiTableHeaderCell .euiTableHeaderButton {\\n  text-align: left;\\n  font-weight: 500;\\n}\\n\\n.euiTableFooterCell .euiTableCellContent__text,\\n.euiTableHeaderCell .euiTableCellContent__text {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 600;\\n}\\n\\n.euiTableHeaderButton {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  color: inherit;\\n  width: 100%;\\n}\\n\\n.euiTableHeaderButton:hover .euiTableCellContent__text, .euiTableHeaderButton:focus .euiTableCellContent__text {\\n  text-decoration: underline;\\n  color: #07C;\\n}\\n\\n.euiTableHeaderButton:hover .euiTableSortIcon, .euiTableHeaderButton:focus .euiTableSortIcon {\\n  fill: #07C;\\n}\\n\\n.euiTableSortIcon {\\n  margin-left: 4px;\\n  flex-shrink: 0;\\n}\\n\\n.euiTableHeaderButton-isSorted .euiTableSortIcon {\\n  fill: #1a1c21;\\n}\\n\\n.euiTableHeaderCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n  border: none;\\n}\\n\\n.euiTableRow:hover {\\n  background-color: #fafbfd;\\n}\\n\\n.euiTableRow.euiTableRow-isClickable:hover {\\n  background-color: rgba(0, 119, 204, 0.05);\\n  cursor: pointer;\\n}\\n\\n.euiTableRow.euiTableRow-isClickable:focus {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiTableRow.euiTableRow-isExpandedRow {\\n  background-color: #fafbfd;\\n}\\n\\n.euiTableRow.euiTableRow-isExpandedRow.euiTableRow-isSelectable .euiTableCellContent {\\n  padding-left: 40px;\\n}\\n\\n.euiTableRow.euiTableRow-isSelected {\\n  background-color: rgba(227, 240, 249, 0.37);\\n}\\n\\n.euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(227, 240, 249, 0.37);\\n}\\n\\n.euiTableRow.euiTableRow-isSelected:hover, .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiTableRowCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  color: #343741;\\n}\\n\\n.euiTableRowCell--top {\\n  vertical-align: top;\\n}\\n\\n.euiTableRowCell--bottom {\\n  vertical-align: bottom;\\n}\\n\\n.euiTableRowCell--baseline {\\n  vertical-align: baseline;\\n}\\n\\n.euiTableRowCell.euiTableRowCell--isMobileHeader {\\n  display: none;\\n}\\n\\n.euiTableRowCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n}\\n\\n.euiTableFooterCell {\\n  background-color: #F5F7FA;\\n}\\n\\n/**\\n * 1. Vertically align all children.\\n * 2. The padding on this div allows the ellipsis to show if the content is truncated. If\\n *    the padding was on the cell, the ellipsis would be cropped.\\n * 4. Prevent very long single words (e.g. the name of a field in a document) from overflowing\\n *    the cell.\\n */\\n.euiTableCellContent {\\n  overflow: hidden;\\n  /* 4 */\\n  display: flex;\\n  align-items: center;\\n  /* 1 */\\n  padding: 8px;\\n  /* 2 */\\n}\\n\\n.euiTableCellContent__text {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 4 */\\n  min-width: 0;\\n  text-overflow: ellipsis;\\n}\\n\\n.euiTableCellContent--alignRight {\\n  justify-content: flex-end;\\n  text-align: right;\\n}\\n\\n.euiTableCellContent--alignCenter {\\n  justify-content: center;\\n  text-align: center;\\n}\\n\\n.euiTableHeaderCell,\\n.euiTableFooterCell,\\n.euiTableCellContent--truncateText {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n.euiTableHeaderCell .euiTableCellContent__text,\\n.euiTableFooterCell .euiTableCellContent__text,\\n.euiTableCellContent--truncateText .euiTableCellContent__text {\\n  overflow: hidden;\\n}\\n\\n.euiTableCellContent--overflowingContent {\\n  overflow: visible;\\n  white-space: normal;\\n  word-break: break-word;\\n}\\n\\n.euiTableCellContent--showOnHover > *:not(:first-child) {\\n  margin-left: 8px;\\n}\\n\\n.euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n  flex-shrink: 0;\\n  opacity: 0.7;\\n  filter: grayscale(100%);\\n  transition: opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1), filter 250ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\n\\n.euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n  filter: grayscale(0%);\\n  opacity: 0;\\n}\\n\\n.euiTableRow-hasActions:hover .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem,\\n.euiTableRow-hasActions .euiTableCellContent--showOnHover:focus-within .euiTableCellContent__hoverItem {\\n  opacity: 1;\\n  filter: grayscale(0%);\\n}\\n\\n.euiTableRow-isExpandedRow .euiTableCellContent {\\n  -webkit-animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n  animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n}\\n\\n@-webkit-keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\n@keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\n.euiTableRowCell__mobileHeader {\\n  display: none;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (max-width: 574px) {\\n  .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #69707D;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n\\n  .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #D3DAE6;\\n    box-shadow: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #fafbfd;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #feedf5;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #e6f1fa;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #e6f9f7;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #fff9e8;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #f8e9e9;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    background-color: #FFF;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(152, 162, 179, 0.1);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\n.euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(227, 240, 249, 0.37);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #69707D;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n\\n  .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #D3DAE6;\\n    box-shadow: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #fafbfd;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #feedf5;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #e6f1fa;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #e6f9f7;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #fff9e8;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #f8e9e9;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    background-color: #FFF;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(152, 162, 179, 0.1);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\n.euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(227, 240, 249, 0.37);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\n.euiTableHeaderMobile,\\n.euiTableHeaderCell--hideForDesktop {\\n  display: none;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n\\n  .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n\\n  .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\n.euiComboBox--appended .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 6px;\\n  border-bottom-left-radius: 6px;\\n}\\n\\n.euiComboBox--appended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n}\\n\\n.euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\n\\n.euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\n\\n.euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 6px;\\n  border-bottom-right-radius: 6px;\\n}\\n\\n.euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 4px;\\n  border-bottom-right-radius: 4px;\\n}\\n\\n.euiDataGrid--fontSizeLarge .euiDataGridRowCell {\\n  font-size: 16px;\\n  font-size: 1.1428571429rem;\\n  line-height: 1.7142857143rem;\\n}\\n\\n.euiFormControlLayout--group {\\n  border-radius: 6px;\\n  background-color: #e9edf3;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend:first-child {\\n  border-radius: 5px 0 0 5px;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__append:last-child {\\n  border-radius: 0 5px 5px 0;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 5px 5px 0;\\n}\\n\\n.euiFormControlLayout--group [class*=euiButton]:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: -2px;\\n}\\n\\n.euiFormControlLayout--group [class*=euiButton]:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFormControlLayout--group [class*=euiButton]:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 5px 5px 0;\\n}\\n\\n.euiFormControlLayout--group .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\n\\n.euiFormControlLayout--group .euiToolTipAnchor:last-child [class*=euiButton],\\n.euiFormControlLayout--group .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 5px 5px 0;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSuperSelectControl,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 6px 0 0 6px;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSuperSelectControl,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 6px 6px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  border-radius: 4px;\\n  background-color: #e9edf3;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed.euiFormControlLayout--readOnly input {\\n  background-color: #FFF;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child {\\n  border-radius: 3px 0 0 3px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 4px 0 0 4px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 3px 0 0 3px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child [class*=euiButton],\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 3px 0 0 3px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayoutDelimited {\\n  border-radius: 6px;\\n}\\n\\n.euiFormControlLayoutDelimited.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 6px 0 0 6px;\\n}\\n\\n.euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 6px;\\n  overflow: hidden;\\n}\\n\\n.euiFormControlLayoutDelimited .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\n\\n.euiFormControlLayoutDelimited.euiFormControlLayout--compressed.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 4px 0 0 4px;\\n}\\n\\n.euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 4px;\\n  overflow: hidden;\\n}\\n\\n.euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 4px 4px 0;\\n}\\n\\n.euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\n\\n.euiRadio .euiRadio__input:focus:focus-visible + .euiRadio__circle {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\n\\n.euiRadio .euiRadio__input:focus:not(:focus-visible) + .euiRadio__circle {\\n  outline: none;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus:focus-visible + .euiCheckbox__square {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus:not(:focus-visible) + .euiCheckbox__square {\\n  outline: none;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: none;\\n}\\n\\n.euiHue {\\n  position: relative;\\n  height: 12px;\\n  border-radius: 12px;\\n  margin: 8px 0;\\n}\\n\\n.euiHue::before, .euiHue::after {\\n  display: none;\\n}\\n\\n.euiHue__range {\\n  top: -6px;\\n}\\n\\n.euiHue__range::-webkit-slider-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\n\\n.euiHue__range::-moz-range-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\n\\n.euiHue__range::-ms-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\n\\n.euiHue__range:focus {\\n  outline: none;\\n}\\n\\n.euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\n\\n.euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\n\\n.euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\n\\n.euiHue__range:focus:not(:focus-visible)::-webkit-slider-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\n\\n.euiHue__range:focus:not(:focus-visible)::-moz-range-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\n\\n.euiHue__range:focus:not(:focus-visible)::-ms-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\n\\n.euiHue__range:focus:focus-visible {\\n  outline: none;\\n}\\n\\n.euiMarkdownEditorToolbar {\\n  border-radius: 6px 6px 0 0;\\n}\\n\\n.euiMarkdownEditorTextArea:focus {\\n  outline: none;\\n}\\n\\n.euiMarkdownEditorTextArea:focus:focus-visible {\\n  outline-style: none;\\n}\\n\\n.euiMarkdownEditorPreview,\\n.euiMarkdownEditorFooter {\\n  border-radius: 0 0 6px 6px;\\n}\\n\\n/* atkinson-hyperlegible-regular - latin */\\n@font-face {\\n  font-family: \\\"Atkinson Hyperlegible\\\";\\n  font-style: normal;\\n  font-weight: 400;\\n  src: local(\\\"\\\"), url(\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \") format(\\\"woff2\\\"), url(\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \") format(\\\"woff\\\");\\n  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\\n}\\n/* atkinson-hyperlegible-700 - latin */\\n@font-face {\\n  font-family: \\\"Atkinson Hyperlegible\\\";\\n  font-style: normal;\\n  font-weight: 700;\\n  src: local(\\\"\\\"), url(\" + ___CSS_LOADER_URL_REPLACEMENT_2___ + \") format(\\\"woff2\\\"), url(\" + ___CSS_LOADER_URL_REPLACEMENT_3___ + \") format(\\\"woff\\\");\\n  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\\n}\\nhtml {\\n  font-size: 14px !important;\\n}\\nhtml.light-theme {\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n   * LEGEND\\n   * __day-name : Week headers like Su, Mo, etc\\n   * __day : Number on the calendar\\n   *       --highlighted\\n   *       --disabled :               _this.isDisabled(),\\n   *       --selected :               _this.isSameDay(_this.props.selected),\\n      *       --range-start :            _this.isRangeStart(),\\n      *       --range-end :              _this.isRangeEnd(),\\n   *       --keyboard-selected :      _this.isKeyboardSelected(),\\n   *       --in-range :               _this.isInRange(),\\n      *       --in-selecting-range :     _this.isInSelectingRange(),\\n      *       --selecting-range-start :  _this.isSelectingRangeStart(),\\n      *       --selecting-range-end :    _this.isSelectingRangeEnd(),\\n   *       --today :                  _this.isSameDay(now(_this.props.utcOffset)),\\n   *       --weekend :                _this.isWeekend(),\\n   *       --outside-month :          _this.isOutsideMonth()\\n   */\\n  /**\\n   * LEGEND\\n   * __time-list-item :\\n   *       --preselected : closest current time but not selected (also applied when using arrow keys to indicate focus)\\n   *       --selected\\n   *       --disabled\\n   *       --injected\\n   */\\n  /**\\n   * LEGEND\\n   * __header__dropdown : Contains the month and year, but affords for the navigational arrows\\n\\n   *   __month-dropdown-container: Contains both static/selected control and the dropdown\\n   *     __month-read-view: The static control\\n   *     __month-dropdown: The absolutely positioned list\\n   *       __month-option: Each option in the list\\n   *                       --selected_month\\n   *                       --selected\\n   *                       --preselected\\n\\n   *   __year-dropdown-container: Contains both static/selected control and the dropdown\\n   *     __year-read-view: The static control\\n   *     __year-dropdown: The absolutely positioned list\\n   *       __year-option: Each option in the list\\n   *                       --selected_year\\n   *                       --selected\\n   *                       --preselected\\n   */\\n  /**\\n   * Make the top selectors look like select inputs\\n   */\\n  /* This file is a heavy retheme of react-datepicker's Sass as of v1.4.0\\n  ** https://github.com/Hacker0x01/react-datepicker\\n  */\\n  /*\\n   * 1. Overwrites the base styling of EuiBadge, to give it a larger size and margins\\n   * that make sense in the input wrap.\\n   */\\n  /**\\n   * 1. Using specificity to override panel shadow\\n   * 2. Prevent really long input from overflowing the container.\\n   */\\n  /**\\n   * 1. Force each title to be the same height as an option, so that the virtualized scroll logic\\n   *    works.\\n   */\\n  /**\\n  * Make the arrow delimiter match the colors of `.euiDatePopoverButton-needsUpdating`\\n  */\\n  /**\\n    * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n    *    they actually click this input.\\n    */\\n  /*\\n   * 1. Fix for Safari to ensure that it renders like a normal text input\\n   *    and doesn't add extra spacing around text\\n  */\\n  /**\\n    * REMEMBER: --large modifiers must come last to override --compressed\\n    */\\n  /**\\n    * 1. Don't block the user from dropping files onto the filepicker.\\n    * 2. Ensure space for import icon, loading spinner, and clear button (only if it has files)\\n    * 4. Static height so that it doesn't shift its surrounding contents around\\n    */\\n  /**\\n    * 1. Undo the pointer-events: none applied to the enclosing prompt.\\n    */\\n  /**\\n   * 1. Ensure the descenders don't get cut off\\n   */\\n  /**\\n   * 1. Ensure the descenders don't get cut off\\n   * 2. Makes sure the height is correct when there's no selection\\n   */\\n  /**\\n   * 1. Account for inner box-shadow style border\\n   * 2. Ensure truncation works in children elements\\n   */\\n  /**\\n   * 1. Focused state overrides invalid state.\\n   * 2. Disabled state overrides pointer.\\n   */\\n  /**\\n   * 1. Coerce inline form elements to behave as block-level elements.\\n   * 2. For inline forms, we need to add margin if the label doesn't exist.\\n   */\\n  /**\\n    * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n    *    they actually click this input.\\n    */\\n  /**\\n    * 1. Prevent really long input from overflowing the container.\\n    */\\n  /**\\n   * 1. Vertically align all children.\\n   * 2. The padding on this div allows the ellipsis to show if the content is truncated. If\\n   *    the padding was on the cell, the ellipsis would be cropped.\\n   * 4. Prevent very long single words (e.g. the name of a field in a document) from overflowing\\n   *    the cell.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n   * Adapted from Eric Meyer's reset (http://meyerweb.com/eric/tools/css/reset/, v2.0 | 20110126).\\n   *\\n   */\\n  /* HTML5 display-role reset for older browsers */\\n  /* Chrome has an issue around RTL languages in SVGs when letter-spacing is negative\\n   * https://bugs.chromium.org/p/chromium/issues/detail?id=966480\\n   */\\n  /* Chrome has an issue around RTL languages in SVGs when letter-spacing is negative\\n   * https://bugs.chromium.org/p/chromium/issues/detail?id=966480\\n   */\\n  /**\\n   * Manually synced with `COLOR_STRIP_CHECK_WIDTH` const in [`tooltip_table.tsx`](packages/charts/src/components/tooltip/components/tooltip_table.tsx)\\n   */\\n}\\n@-webkit-keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@-webkit-keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@-webkit-keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #0071c2;\\n  }\\n}\\n@keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #0071c2;\\n  }\\n}\\n@-webkit-keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #0071c2;\\n  }\\n}\\n@keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #0071c2;\\n  }\\n}\\n@-webkit-keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\n@keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\nhtml.light-theme .react-datepicker__day-names,\\nhtml.light-theme .react-datepicker__week {\\n  white-space: nowrap;\\n  display: flex;\\n  justify-content: space-between;\\n  flex-grow: 1;\\n}\\nhtml.light-theme .react-datepicker__day-name,\\nhtml.light-theme .react-datepicker__day {\\n  font-weight: 500;\\n  text-align: center;\\n  color: #1a1c21;\\n  display: inline-block;\\n  width: 32px;\\n  line-height: 32px;\\n  border-radius: 4px;\\n  margin: 2px;\\n}\\nhtml.light-theme .react-datepicker__day-name {\\n  color: #69707D;\\n}\\nhtml.light-theme .react-datepicker__day {\\n  cursor: pointer;\\n  transition: transform 90ms ease-in-out;\\n}\\nhtml.light-theme .react-datepicker__day:hover {\\n  color: #0061a6;\\n  background-color: rgba(0, 119, 204, 0.2);\\n  text-decoration: underline;\\n}\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  html.light-theme .react-datepicker__day:hover {\\n    transform: scale(1.1);\\n  }\\n}\\nhtml.light-theme .react-datepicker__day--today {\\n  color: #07C;\\n  font-weight: 700;\\n}\\nhtml.light-theme .react-datepicker__day--outside-month {\\n  color: #69707D;\\n}\\nhtml.light-theme .react-datepicker__day--highlighted, html.light-theme .react-datepicker__day--highlighted:hover {\\n  color: #00726b;\\n  background-color: rgba(0, 191, 179, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--in-range, html.light-theme .react-datepicker__day--in-range:hover {\\n  color: #0061a6;\\n  background-color: rgba(0, 119, 204, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover), html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected), html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover {\\n  box-shadow: -2px 0 rgba(0, 119, 204, 0.2), 2px 0 rgba(0, 119, 204, 0.2);\\n  border-radius: 0;\\n}\\nhtml.light-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):first-of-type, html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):first-of-type, html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:first-of-type {\\n  box-shadow: 2px 0 rgba(0, 119, 204, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):last-of-type, html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):last-of-type, html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:last-of-type {\\n  box-shadow: -2px 0 rgba(0, 119, 204, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--selected, html.light-theme .react-datepicker__day--in-selecting-range, html.light-theme .react-datepicker__day--selected:hover, html.light-theme .react-datepicker__day--in-selecting-range:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\nhtml.light-theme .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range) {\\n  background-color: rgba(189, 39, 30, 0.5);\\n}\\nhtml.light-theme .react-datepicker__day--disabled, html.light-theme .react-datepicker__day--disabled:hover {\\n  background-color: rgba(171, 180, 196, 0.1);\\n  color: #a2abba;\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  transform: none;\\n}\\nhtml.light-theme .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected), html.light-theme .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover, html.light-theme .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected), html.light-theme .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover {\\n  color: #8c9daa;\\n  background-color: rgba(0, 119, 204, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--disabled.react-datepicker__day--selected, html.light-theme .react-datepicker__day--disabled.react-datepicker__day--selected:hover {\\n  color: #BD271E;\\n  background-color: rgba(189, 39, 30, 0.2);\\n}\\nhtml.light-theme .react-datepicker__header--time {\\n  display: none;\\n}\\nhtml.light-theme .react-datepicker__time-container {\\n  border-left: #D3DAE6;\\n  width: auto;\\n  display: flex;\\n  margin-top: 40px;\\n  margin-left: 8px;\\n  flex-grow: 1;\\n  background-color: #fafbfd;\\n  border-radius: 6px;\\n}\\nhtml.light-theme .react-datepicker__time-container--focus .react-datepicker__time-list-item--preselected {\\n  text-decoration: underline;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .react-datepicker__time-container {\\n    margin-top: 0;\\n  }\\n}\\nhtml.light-theme .react-datepicker__time,\\nhtml.light-theme .react-datepicker__time-box {\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n}\\nhtml.light-theme .react-datepicker__time-list {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  padding: 4px 12px;\\n  height: 100px !important;\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n  align-items: center;\\n  gap: 4px;\\n}\\nhtml.light-theme .react-datepicker__time-list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .react-datepicker__time-list::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .react-datepicker__time-list::-webkit-scrollbar-corner, html.light-theme .react-datepicker__time-list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .react-datepicker__time-list:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .react-datepicker__time-list[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .react-datepicker__time-list-item {\\n  display: inline-block;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  cursor: pointer;\\n  height: 40px;\\n  line-height: 40px;\\n  text-align: center;\\n  white-space: nowrap;\\n  max-width: 100%;\\n  vertical-align: middle;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 500;\\n  text-decoration: none;\\n  outline-offset: -1px;\\n  transform: none !important;\\n  /* 1 */\\n  -webkit-animation: none !important;\\n  animation: none !important;\\n  /* 1 */\\n  transition-timing-function: ease-in;\\n  /* 2 */\\n  transition-duration: 150ms;\\n  /* 2 */\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 12px;\\n}\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  html.light-theme .react-datepicker__time-list-item {\\n    transition: transform 250ms ease-in-out, background-color 250ms ease-in-out;\\n  }\\n  html.light-theme .react-datepicker__time-list-item:hover:not(:disabled) {\\n    transform: translateY(-1px);\\n  }\\n  html.light-theme .react-datepicker__time-list-item:focus {\\n    -webkit-animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n    animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  }\\n  html.light-theme .react-datepicker__time-list-item:active:not(:disabled) {\\n    transform: translateY(1px);\\n  }\\n}\\nhtml.light-theme .react-datepicker__time-list-item:hover:not(:disabled), html.light-theme .react-datepicker__time-list-item:focus {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .react-datepicker__time-list-item--disabled, html.light-theme .react-datepicker__time-list-item--disabled:hover {\\n  text-decoration: none !important;\\n  cursor: not-allowed;\\n  color: #ABB4C4;\\n  background-color: transparent;\\n}\\nhtml.light-theme .react-datepicker__time-list-item--injected, html.light-theme .react-datepicker__time-list-item--injected:hover {\\n  color: #00726b;\\n  background-color: rgba(0, 191, 179, 0.2);\\n}\\nhtml.light-theme .react-datepicker__time-list-item--preselected, html.light-theme .react-datepicker__time-list-item--preselected:hover {\\n  background: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .react-datepicker__time-list-item--selected, html.light-theme .react-datepicker__time-list-item--selected:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\nhtml.light-theme .react-datepicker--time-only {\\n  padding: 0 !important;\\n}\\nhtml.light-theme .react-datepicker--time-only .react-datepicker__time-container {\\n  background-color: transparent;\\n  margin: 0;\\n}\\nhtml.light-theme .react-datepicker--time-only .react-datepicker__time-list {\\n  height: 204px !important;\\n}\\nhtml.light-theme .react-datepicker--time-only .react-datepicker__time-list-item {\\n  font-size: 14px;\\n  min-width: 112px;\\n  text-align: left;\\n}\\nhtml.light-theme .react-datepicker__header__dropdown {\\n  padding: 8px;\\n  display: flex;\\n  gap: 4px;\\n  position: absolute;\\n  top: 0;\\n  left: 36px;\\n  right: 36px;\\n  justify-content: center;\\n}\\nhtml.light-theme .react-datepicker__year-read-view,\\nhtml.light-theme .react-datepicker__month-read-view,\\nhtml.light-theme .react-datepicker__month-year-read-view {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  height: 32px;\\n  font-weight: 500;\\n  display: flex;\\n  flex-direction: row-reverse;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .react-datepicker__year-read-view,\\nhtml.light-theme .react-datepicker__month-read-view,\\nhtml.light-theme .react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .react-datepicker__year-read-view::-moz-placeholder,\\nhtml.light-theme .react-datepicker__month-read-view::-moz-placeholder,\\nhtml.light-theme .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .react-datepicker__year-read-view::-moz-placeholder, html.light-theme .react-datepicker__month-read-view::-moz-placeholder, html.light-theme .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .react-datepicker__year-read-view:-ms-input-placeholder, html.light-theme .react-datepicker__month-read-view:-ms-input-placeholder, html.light-theme .react-datepicker__month-year-read-view:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .react-datepicker__year-read-view::placeholder,\\nhtml.light-theme .react-datepicker__month-read-view::placeholder,\\nhtml.light-theme .react-datepicker__month-year-read-view::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .react-datepicker__year-read-view,\\nhtml.light-theme .react-datepicker__month-read-view,\\nhtml.light-theme .react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .react-datepicker__year-read-view:hover,\\nhtml.light-theme .react-datepicker__month-read-view:hover,\\nhtml.light-theme .react-datepicker__month-year-read-view:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.light-theme .react-datepicker__year-read-view--down-arrow,\\nhtml.light-theme .react-datepicker__month-read-view--down-arrow,\\nhtml.light-theme .react-datepicker__month-year-read-view--down-arrow {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiI+ICA8ZGVmcz4gICAgPHBhdGggaWQ9ImFycm93X2Rvd24tYSIgZD0iTTEzLjA2ODg1MDgsNS4xNTcyNTAzOCBMOC4zODQyMzk3NSw5Ljc2ODI3NDI4IEM4LjE3MDU0NDE1LDkuOTc4NjEzMDggNy44Mjk5OTIxNCw5Ljk3OTE0MDk1IDcuNjE1NzYwMjUsOS43NjgyNzQyOCBMMi45MzExNDkxNSw1LjE1NzI1MDM4IEMyLjcxODEzNTksNC45NDc1ODMyMSAyLjM3Mjc3MzE5LDQuOTQ3NTgzMjEgMi4xNTk3NTk5NCw1LjE1NzI1MDM4IEMxLjk0Njc0NjY5LDUuMzY2OTE3NTYgMS45NDY3NDY2OSw1LjcwNjg1NTIyIDIuMTU5NzU5OTQsNS45MTY1MjI0IEw2Ljg0NDM3MTA0LDEwLjUyNzU0NjMgQzcuNDg1MTc0MjQsMTEuMTU4MjgzNiA4LjUxNjQ0OTc5LDExLjE1NjY4NTEgOS4xNTU2Mjg5NiwxMC41Mjc1NDYzIEwxMy44NDAyNDAxLDUuOTE2NTIyNCBDMTQuMDUzMjUzMyw1LjcwNjg1NTIyIDE0LjA1MzI1MzMsNS4zNjY5MTc1NiAxMy44NDAyNDAxLDUuMTU3MjUwMzggQzEzLjYyNzIyNjgsNC45NDc1ODMyMSAxMy4yODE4NjQxLDQuOTQ3NTgzMjEgMTMuMDY4ODUwOCw1LjE1NzI1MDM4IFoiLz4gIDwvZGVmcz4gIDxnIGZpbGwtcnVsZT0iZXZlbm9kZCI+ICAgIDx1c2UgZmlsbC1ydWxlPSJub256ZXJvIiB4bGluazpocmVmPSIjYXJyb3dfZG93bi1hIi8+ICA8L2c+PC9zdmc+);\\n  right: 8px;\\n  height: 12px;\\n  width: 12px;\\n  display: inline-block;\\n  background-size: cover;\\n}\\nhtml.light-theme .react-datepicker__year-read-view--selected-month, html.light-theme .react-datepicker__year-read-view--selected-year,\\nhtml.light-theme .react-datepicker__month-read-view--selected-month,\\nhtml.light-theme .react-datepicker__month-read-view--selected-year,\\nhtml.light-theme .react-datepicker__month-year-read-view--selected-month,\\nhtml.light-theme .react-datepicker__month-year-read-view--selected-year {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container,\\nhtml.light-theme .react-datepicker__month-dropdown-container {\\n  position: relative;\\n  display: inline-block;\\n  flex-grow: 1;\\n  max-width: 400px;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]),\\nhtml.light-theme .react-datepicker__month-dropdown {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n  height: auto;\\n  max-height: 250px;\\n  background-color: #FFF;\\n  position: absolute;\\n  z-index: 1;\\n  border-radius: 6px;\\n  min-width: 100px;\\n  width: 100%;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar,\\nhtml.light-theme .react-datepicker__month-dropdown::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-thumb,\\nhtml.light-theme .react-datepicker__month-dropdown::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-corner, html.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-track,\\nhtml.light-theme .react-datepicker__month-dropdown::-webkit-scrollbar-corner,\\nhtml.light-theme .react-datepicker__month-dropdown::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]):focus,\\nhtml.light-theme .react-datepicker__month-dropdown:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])[tabindex=\\\"0\\\"]:focus:focus-visible,\\nhtml.light-theme .react-datepicker__month-dropdown[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]) .react-datepicker__year-dropdown {\\n  padding: 4px;\\n  display: flex;\\n  flex-direction: column-reverse;\\n  justify-content: flex-end;\\n}\\nhtml.light-theme .react-datepicker__month-dropdown-container {\\n  flex-grow: 2;\\n}\\nhtml.light-theme .react-datepicker__month-dropdown-container .react-datepicker__month-dropdown {\\n  padding: 4px;\\n  min-width: 140px;\\n}\\nhtml.light-theme .react-datepicker__year-option,\\nhtml.light-theme .react-datepicker__month-option,\\nhtml.light-theme .react-datepicker__month-year-option {\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 14px;\\n  margin: 4px 0;\\n  cursor: pointer;\\n}\\nhtml.light-theme .react-datepicker__year-option:hover, html.light-theme .react-datepicker__year-option:focus,\\nhtml.light-theme .react-datepicker__month-option:hover,\\nhtml.light-theme .react-datepicker__month-option:focus,\\nhtml.light-theme .react-datepicker__month-year-option:hover,\\nhtml.light-theme .react-datepicker__month-year-option:focus {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .react-datepicker__year-option--selected,\\nhtml.light-theme .react-datepicker__month-option--selected,\\nhtml.light-theme .react-datepicker__month-year-option--selected {\\n  display: none;\\n}\\nhtml.light-theme .react-datepicker__year-option--preselected, html.light-theme .react-datepicker__year-option--preselected:hover,\\nhtml.light-theme .react-datepicker__month-option--preselected,\\nhtml.light-theme .react-datepicker__month-option--preselected:hover {\\n  background: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .react-datepicker__year-option--selected_year, html.light-theme .react-datepicker__year-option--selected_year:hover,\\nhtml.light-theme .react-datepicker__month-option--selected_month,\\nhtml.light-theme .react-datepicker__month-option--selected_month:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\nhtml.light-theme .react-datepicker__navigation--next,\\nhtml.light-theme .react-datepicker__navigation--previous {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZmlsbD0iIzM0Mzc0MSIgZD0iTTExLjY5MiA3SDMuNTU2QzMuMjQ5IDcgMyA3LjIyNCAzIDcuNXMuMjQ5LjUuNTU2LjVoOC4xMzZsLTQuMDk2IDQuMDk2YS41LjUgMCAwMC43MDcuNzA3bDQuMjQzLTQuMjQyYy4yNTgtLjI1OS40MDMtLjU4Ny40MzMtLjkyNWEuNDU0LjQ1NCAwIDAwMC0uMjcyIDEuNDk0IDEuNDk0IDAgMDAtLjQzMy0uOTI1TDguMzAzIDIuMTk3YS41LjUgMCAxMC0uNzA3LjcwN0wxMS42OTIgN3oiLz48L3N2Zz4=);\\n  cursor: pointer;\\n  position: absolute;\\n  top: 8px;\\n  height: 32px;\\n  width: 32px;\\n  z-index: 1;\\n  text-indent: -999em;\\n  overflow: hidden;\\n  background-repeat: no-repeat;\\n  border-radius: 4px;\\n  background-position: center;\\n}\\nhtml.light-theme .react-datepicker__navigation--next:hover, html.light-theme .react-datepicker__navigation--next:focus,\\nhtml.light-theme .react-datepicker__navigation--previous:hover,\\nhtml.light-theme .react-datepicker__navigation--previous:focus {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .react-datepicker__navigation--previous {\\n  left: 8px;\\n  transform: rotate(180deg);\\n  transform-origin: center;\\n}\\nhtml.light-theme .react-datepicker__navigation--next {\\n  right: 8px;\\n}\\nhtml.light-theme .euiDatePicker {\\n  display: block;\\n  /**\\n   * Inline datepickers\\n   */\\n}\\nhtml.light-theme .euiDatePicker .euiFormControlLayout {\\n  height: auto;\\n}\\nhtml.light-theme .euiDatePicker--inline .euiFormControlLayout {\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n  background-color: transparent;\\n  box-shadow: none;\\n  padding: 0;\\n}\\nhtml.light-theme .euiDatePicker--inline .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: transparent;\\n  flex-direction: column;\\n}\\nhtml.light-theme .euiDatePicker--inline .euiFormControlLayoutIcons {\\n  justify-content: center;\\n  -webkit-padding-after: 8px;\\n  padding-block-end: 8px;\\n}\\nhtml.light-theme .euiDatePicker--shadow .euiFormControlLayout {\\n  box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n}\\nhtml.light-theme .euiDatePicker--shadow .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .react-datepicker {\\n  font-size: 12px;\\n  color: #343741;\\n  display: flex;\\n  border-radius: 6px;\\n  padding: 8px;\\n  justify-content: center;\\n}\\nhtml.light-theme .react-datepicker--non-interactive {\\n  pointer-events: none;\\n}\\nhtml.light-theme .react-datepicker__current-month,\\nhtml.light-theme .react-datepicker-time__header {\\n  display: none;\\n}\\nhtml.light-theme .react-datepicker__screenReaderOnly {\\n  position: absolute;\\n  top: auto;\\n  left: -10000px;\\n  width: 1px;\\n  height: 1px;\\n  clip: rect(0 0 0 0);\\n  -webkit-clip-path: inset(50%);\\n  clip-path: inset(50%);\\n  overflow: hidden;\\n  margin: -1px;\\n}\\nhtml.light-theme .react-datepicker__focusTrap {\\n  display: flex;\\n  justify-content: center;\\n}\\nhtml.light-theme .react-datepicker__month-container {\\n  flex-grow: 1;\\n  margin-top: 36px;\\n}\\nhtml.light-theme .react-datepicker__header {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .react-datepicker-time__header {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .react-datepicker__month {\\n  text-align: center;\\n  border-radius: 6px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .react-datepicker__focusTrap,\\nhtml.light-theme .react-datepicker {\\n    flex-direction: column;\\n  }\\n  html.light-theme .react-datepicker__time-box {\\n    margin-top: 0;\\n  }\\n}\\nhtml.light-theme .euiColorPicker {\\n  position: relative;\\n  width: 152px;\\n}\\nhtml.light-theme .euiColorPicker__popoverAnchor .euiColorPicker__input {\\n  padding-right: 40px;\\n}\\nhtml.light-theme .euiColorPicker__popoverAnchor .euiColorPicker__input[class*=\\\"--compressed\\\"] {\\n  padding-right: 32px;\\n}\\nhtml.light-theme .euiColorPicker__popoverAnchor .euiColorPicker__input + .euiFormControlLayoutIcons {\\n  color: inherit;\\n}\\nhtml.light-theme .euiColorPicker__swatches {\\n  display: flex;\\n  flex-wrap: wrap;\\n  margin: -4px;\\n}\\nhtml.light-theme .euiColorPicker__swatch-item {\\n  margin: 4px;\\n}\\nhtml.light-theme .euiSwatchInput__stroke {\\n  fill: none;\\n  stroke: rgba(0, 0, 0, 0.2);\\n}\\nhtml.light-theme .euiColorPicker__popoverPanel--pickerOnly {\\n  padding-bottom: 0 !important;\\n}\\nhtml.light-theme .euiColorPicker__input--inGroup {\\n  height: 38px !important;\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiColorPicker__input--inGroup.euiFieldText--compressed {\\n  height: 30px !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiColorPicker__alphaRange .euiRangeInput {\\n  min-width: 0;\\n}\\nhtml.light-theme .euiColorPickerSwatch {\\n  display: inline-block;\\n  height: 24px;\\n  width: 24px;\\n  border-radius: 3px;\\n  cursor: pointer;\\n  border: solid 1px rgba(0, 0, 0, 0.1);\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);\\n}\\nhtml.light-theme .euiColorPickerSwatch:disabled {\\n  cursor: default;\\n}\\nhtml.light-theme .euiColorPickerSwatch:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiColorPickerSwatch:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiColorPickerSwatch:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiHue {\\n  background: linear-gradient(to right, #FF3232 0%, #FFF130 20%, #45FF30 35%, #28FFF0 52%, #282CFF 71%, #FF28FB 88%, #FF0094 100%);\\n  height: 24px;\\n  margin: 4px 0;\\n  position: relative;\\n}\\nhtml.light-theme .euiHue::before, html.light-theme .euiHue::after {\\n  content: \\\"\\\";\\n  left: 0;\\n  position: absolute;\\n  height: 8px;\\n  background: #FFF;\\n  width: 100%;\\n}\\nhtml.light-theme .euiHue::after {\\n  bottom: 0;\\n}\\nhtml.light-theme .euiHue__range {\\n  position: relative;\\n  height: 24px;\\n  width: calc(100% + 2px);\\n  margin: 0 -1px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  background: transparent;\\n  z-index: 2;\\n}\\nhtml.light-theme .euiHue__range::-webkit-slider-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -webkit-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.light-theme .euiHue__range::-moz-range-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -moz-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.light-theme .euiHue__range::-ms-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -ms-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.light-theme .euiHue__range::-webkit-slider-thumb {\\n  -webkit-appearance: none;\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiHue__range::-ms-thumb {\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiHue__range::-ms-track {\\n  height: 24px;\\n  background: transparent;\\n  border-color: transparent;\\n  color: transparent;\\n}\\nhtml.light-theme .euiHue__range::-moz-focus-outer {\\n  border: none;\\n}\\nhtml.light-theme .euiHue__range::-ms-fill-lower, html.light-theme .euiHue__range::-ms-fill-upper {\\n  background: transparent;\\n}\\nhtml.light-theme .euiHue__range:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiSaturation {\\n  position: relative;\\n  width: 100%;\\n  padding-bottom: 100%;\\n  border-radius: 3px;\\n  touch-action: none;\\n  z-index: 3;\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__lightness,\\nhtml.light-theme .euiSaturation .euiSaturation__saturation {\\n  position: absolute;\\n  top: -1px;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  border-radius: 3px;\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__lightness {\\n  background: linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0));\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__saturation {\\n  background: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__indicator {\\n  position: absolute;\\n  height: 12px;\\n  width: 12px;\\n  border-radius: 100%;\\n  margin-top: -6px;\\n  margin-left: -6px;\\n  border: 1px solid #343741;\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__indicator::before {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 100%;\\n  border: 1px solid #F5F7FA;\\n}\\nhtml.light-theme .euiSaturation:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiSaturation:focus .euiSaturation__indicator {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiColorPalettePicker__itemTitle {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.light-theme .euiColorPalettePicker__itemTitle + .euiColorPaletteDisplay {\\n  margin-top: 4px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay {\\n  display: flex;\\n  flex-direction: row;\\n  overflow: hidden;\\n  height: 8px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeExtraSmall {\\n  position: relative;\\n  height: 4px;\\n  border-radius: 4px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeExtraSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 4px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeExtraSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 4px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeSmall {\\n  position: relative;\\n  height: 8px;\\n  border-radius: 8px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 8px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 8px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeMedium {\\n  position: relative;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeMedium::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 16px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeMedium .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 16px;\\n}\\nhtml.light-theme .euiColorPaletteDisplayFixed__bleedArea {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  display: flex;\\n  height: 8px;\\n  width: calc(100% + 1px);\\n}\\nhtml.light-theme .euiComboBox {\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  position: relative;\\n  /**\\n   * 1. Allow pills to truncate their text with an ellipsis.\\n   * 2. Don't allow pills/placeholder to overlap with the caret, loading icon or clear button.\\n   * 3. The height on combo can be larger than normal text inputs except for single-selection comboboxes.\\n   */\\n  /**\\n   * 1. Force field height to match other field heights.\\n   * 2. Force input height to expand to fill this element.\\n   * 3. Reset input appearance to mimic text\\n   * 4. Ensure that no input states are visible on the hidden input\\n   */\\n}\\nhtml.light-theme .euiComboBox--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiComboBox--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiComboBox--inGroup {\\n  height: 100%;\\n}\\nhtml.light-theme .euiComboBox--compressed:not(.euiComboBox--appended, .euiComboBox--prepended) {\\n  height: auto;\\n  /* 3 */\\n}\\nhtml.light-theme .euiComboBox:not(.euiComboBox--appended, .euiComboBox--prepended) .euiFormControlLayout {\\n  height: auto;\\n  /* 3 */\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  padding: 4px 8px;\\n  padding-right: var(--eui-form-control-layout-icons-padding, 8px);\\n  /* 2 */\\n  display: flex;\\n  /* 1 */\\n  outline: none;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiComboBox .euiComboBox__inputWrap {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPill {\\n  max-width: calc(100% - 2px - 16px);\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap:not(.euiComboBox__inputWrap--noWrap) {\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  padding-left: 4px;\\n  height: auto;\\n  /* 3 */\\n  flex-wrap: wrap;\\n  /* 1 */\\n  align-content: flex-start;\\n  cursor: text;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--noWrap {\\n  align-items: center;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 8px;\\n  padding-inline-start: 8px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend, html.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  flex-shrink: 0;\\n  margin-inline: 2px;\\n  display: flex;\\n  /* Vertically centers any icons */\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend {\\n  -webkit-margin-start: 4px;\\n  margin-inline-start: 4px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  -webkit-margin-end: 4px;\\n  margin-inline-end: 4px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input {\\n  block-size: 24px;\\n  /* 2 */\\n  min-inline-size: 2px;\\n  max-inline-size: 100%;\\n  margin: 4px;\\n  /* 3 */\\n  background: transparent;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  /* 4 */\\n  -webkit-appearance: none !important;\\n  -moz-appearance: none !important;\\n  appearance: none !important;\\n  border: none !important;\\n  box-shadow: none !important;\\n  outline: none !important;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap--compressed {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isInvalid .euiComboBox__inputWrap {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  -webkit-text-fill-color: unset;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap,\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBoxPill {\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap {\\n  line-height: 32px;\\n  /* 2 */\\n  padding-block: 0;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 4px;\\n  padding-inline-start: 4px;\\n}\\nhtml.light-theme .euiComboBoxPill {\\n  height: 22px;\\n  line-height: 20px;\\n  vertical-align: baseline;\\n  /* Fix append/prepend vertical alignment */\\n}\\nhtml.light-theme .euiComboBoxPill, html.light-theme .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 4px;\\n}\\nhtml.light-theme .euiComboBox--compressed .euiComboBoxPill, html.light-theme .euiComboBox--compressed .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 5px 4px 0 0;\\n}\\nhtml.light-theme .euiComboBoxPill__prepend {\\n  margin-right: 4px;\\n}\\nhtml.light-theme .euiComboBoxPill__append {\\n  margin-left: 4px;\\n}\\nhtml.light-theme .euiComboBoxPill .euiBadge__text {\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiComboBoxPill .euiBadge__text .euiIcon {\\n  display: block;\\n}\\nhtml.light-theme .euiComboBoxOptionsList {\\n  max-height: 200px;\\n  overflow: hidden;\\n  /* Kibana FTR affordance - without this, Selenium complains about the overlaid\\n     text intercepting the button click. Since `title` is always present, and\\n     users can't highlight or copy combobox options anyway, we might as well\\n     disable clicks on text */\\n}\\nhtml.light-theme .euiComboBoxOptionsList__virtualization {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\nhtml.light-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-corner, html.light-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiComboBoxOptionsList .euiTextTruncate {\\n  pointer-events: none;\\n}\\nhtml.light-theme .euiComboBoxOptionsList__empty {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 2 */\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n}\\nhtml.light-theme .euiComboBoxOption {\\n  font-size: 14px;\\n  padding: 4px 8px 4px 16px;\\n  width: 100%;\\n  text-align: left;\\n  border: 1px solid #D3DAE6;\\n  border-color: transparent;\\n  display: flex;\\n  align-items: center;\\n  /* Fix vertical alignment of EuiIcons in prepend/append nodes */\\n}\\nhtml.light-theme .euiComboBoxOption:hover {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiComboBoxOption.euiComboBoxOption-isFocused {\\n  cursor: pointer;\\n  color: #0071c2;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiComboBoxOption.euiComboBoxOption-isDisabled {\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiComboBoxOption.euiComboBoxOption-isDisabled:hover {\\n  text-decoration: none;\\n}\\nhtml.light-theme .euiComboBoxOption__contentWrapper {\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiComboBoxOption__content {\\n  text-overflow: ellipsis;\\n  overflow: hidden;\\n  white-space: nowrap;\\n  flex: 1;\\n  text-align: left;\\n}\\nhtml.light-theme .euiComboBoxOption__emptyStateText {\\n  flex: 1;\\n  text-align: left;\\n  /* Extra specificity required to override EuiText's <p> styling */\\n}\\nhtml.light-theme .euiComboBoxOptionsList__empty .euiComboBoxOption__emptyStateText {\\n  margin-bottom: 0;\\n}\\nhtml.light-theme .euiComboBoxOption__enterBadge {\\n  margin-left: 4px;\\n}\\nhtml.light-theme .euiComboBoxOption__prepend {\\n  margin-right: 8px;\\n}\\nhtml.light-theme .euiComboBoxOption__append {\\n  margin-left: 8px;\\n}\\nhtml.light-theme .euiComboBoxOption__prepend .euiIcon, html.light-theme .euiComboBoxOption__append .euiIcon {\\n  display: block;\\n}\\nhtml.light-theme .euiComboBoxTitle {\\n  font-size: 12px;\\n  padding: 11px 8px 4px;\\n  /* 1 */\\n  width: 100%;\\n  font-weight: 700;\\n  color: #000;\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow {\\n  padding: 0 8px 8px;\\n  /* A bit of a visual trickery to make the format \\\"hint\\\" become an \\\"error\\\" text.\\n     NOTE: Normally reordering visually (vs DOM) isn't super great for screen reader users,\\n     but as the help text is already read out via `aria-describedby`, and the error text\\n     is read out immediately via `aria-live`, we can fairly safely prioritize visuals instead */\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormRow__fieldWrapper {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormControlLayout {\\n  order: 0;\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormHelpText {\\n  order: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormErrorText {\\n  order: 2;\\n}\\nhtml.light-theme .euiDatePopoverButton {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiDatePopoverButton::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDatePopoverButton:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDatePopoverButton::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDatePopoverButton--compressed {\\n  line-height: 30px;\\n  height: 30px;\\n}\\nhtml.light-theme .euiDatePopoverButton:focus, html.light-theme .euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n}\\nhtml.light-theme .euiDatePopoverButton-needsUpdating {\\n  background-color: #e6f9f7;\\n  color: #007e77;\\n}\\nhtml.light-theme .euiDatePopoverButton-needsUpdating:focus, html.light-theme .euiDatePopoverButton-needsUpdating.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #00BFB3, #00BFB3 2px, transparent 2px, transparent 100%);\\n}\\nhtml.light-theme .euiDatePopoverButton-isInvalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n  background-color: transparent;\\n  color: #BD271E;\\n}\\nhtml.light-theme .euiDatePopoverButton-isInvalid:focus, html.light-theme .euiDatePopoverButton-isInvalid.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n}\\nhtml.light-theme .euiDatePopoverButton:disabled {\\n  background-color: #eef2f7;\\n  background-image: none;\\n  color: #69707D;\\n  cursor: default;\\n}\\nhtml.light-theme .euiDatePopoverButton--start {\\n  text-align: center;\\n}\\nhtml.light-theme .euiDatePopoverButton--end {\\n  text-align: center;\\n}\\nhtml.light-theme .euiDatePopoverContent,\\nhtml.light-theme .euiDatePopoverContent .react-datepicker {\\n  width: 400px;\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiDatePopoverContent__padded {\\n  padding: 8px;\\n}\\nhtml.light-theme .euiDatePopoverContent__padded--large {\\n  padding: 16px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiDatePopoverContent {\\n    width: 284px;\\n  }\\n}\\nhtml.light-theme .euiQuickSelectPopover__content {\\n  width: 400px;\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiQuickSelectPopover__content .euiQuickSelectPopover__panel:not(:first-child) {\\n  border-top: 1px solid #D3DAE6;\\n  padding-top: 12px;\\n  margin-top: 12px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__content .euiQuickSelectPopover__panel .euiQuickSelectPopover__panelTitle {\\n  float: left;\\n  margin-bottom: 12px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__section {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 132px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n  margin: 8px 0 0;\\n  clear: both;\\n}\\nhtml.light-theme .euiQuickSelectPopover__section::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__section::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiQuickSelectPopover__section::-webkit-scrollbar-corner, html.light-theme .euiQuickSelectPopover__section::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiQuickSelectPopover__buttonContent {\\n  gap: 4px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__sectionItem {\\n  font-size: 14px;\\n  line-height: 14px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__sectionItem--recentlyUsed:not(:last-of-type) {\\n  margin-bottom: 8px;\\n}\\nhtml.light-theme .euiQuickSelect__applyButton {\\n  min-width: 0;\\n}\\nhtml.light-theme .euiRefreshInterval__startButton {\\n  min-width: 90px;\\n}\\nhtml.light-theme .euiSuperDatePicker {\\n  display: flex;\\n  gap: 8px;\\n  max-width: 100%;\\n  min-width: min(326px, 100%);\\n  width: 606px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\nhtml.light-theme .euiSuperDatePicker--isAutoRefreshOnly {\\n  min-width: min(200px, 100%);\\n  width: 400px;\\n}\\nhtml.light-theme .euiSuperDatePicker--noUpdateButton {\\n  min-width: min(200px, 100%);\\n  width: 480px;\\n}\\nhtml.light-theme .euiSuperDatePicker--fullWidth {\\n  width: 100%;\\n}\\nhtml.light-theme .euiSuperDatePicker--isQuickSelectOnly {\\n  min-width: 0;\\n}\\nhtml.light-theme .euiSuperDatePicker--autoWidth {\\n  display: inline-flex;\\n  width: auto;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiDatePickerRange {\\n  flex-grow: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiFormControlLayout {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  overflow: hidden;\\n  background-color: #fbfcfd;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper > .euiFormControlLayoutDelimited__input {\\n  flex-grow: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  display: flex;\\n  justify-content: space-between;\\n  text-align: left;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat:not(:disabled):hover, html.light-theme .euiSuperDatePicker__prettyFormat:focus {\\n  text-decoration: none;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat:disabled {\\n  background-color: #eef2f7;\\n  color: #69707D;\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #e6f9f7;\\n}\\nhtml.light-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayoutDelimited__delimiter {\\n  color: #007e77;\\n}\\nhtml.light-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayout__childrenWrapper {\\n  transition: background 150ms ease-in;\\n}\\nhtml.light-theme .euiDataGrid {\\n  display: flex;\\n  flex-direction: column;\\n  align-items: stretch;\\n  overflow: hidden;\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGrid--fullScreen {\\n  height: 100%;\\n  position: fixed;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  z-index: 999;\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGrid--fullScreen .euiDataGrid__pagination {\\n  padding-bottom: 4px;\\n  background: #F5F7FA;\\n  box-shadow: 1px 0 0 1px #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid__content {\\n  flex-grow: 1;\\n  height: 100%;\\n  max-width: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  z-index: 1;\\n  position: relative;\\n  background: #fafbfd;\\n  font-feature-settings: \\\"tnum\\\" 1;\\n}\\nhtml.light-theme .euiDataGrid__customRenderBody {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #FFF;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  width: 100%;\\n  overflow: auto;\\n}\\nhtml.light-theme .euiDataGrid__customRenderBody::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #FFF;\\n}\\nhtml.light-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-corner, html.light-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-track {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiDataGrid__pagination {\\n  z-index: 2;\\n  padding-top: 4px;\\n  flex-grow: 0;\\n}\\nhtml.light-theme .euiDataGrid__restrictBody {\\n  height: 100vh;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiDataGrid__restrictBody .euiHeader[data-fixed-header] {\\n  z-index: 998 !important;\\n}\\nhtml.light-theme .euiDataGrid__restrictBody .euiOverlayMask[data-relative-to-header=below] {\\n  top: 0;\\n}\\nhtml.light-theme .euiDataGrid__restrictBody .euiFlyout {\\n  top: 0;\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGrid__focusWrap {\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGrid__virtualized {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #FFF;\\n  scrollbar-width: thin;\\n  scroll-padding: 0;\\n}\\nhtml.light-theme .euiDataGrid__virtualized::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGrid__virtualized::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #FFF;\\n}\\nhtml.light-theme .euiDataGrid__virtualized::-webkit-scrollbar-corner, html.light-theme .euiDataGrid__virtualized::-webkit-scrollbar-track {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiDataGrid__scrollOverlay {\\n  position: absolute;\\n  top: -1px;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  pointer-events: none;\\n  box-shadow: inset 0 0 0 1px #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid--bordersHorizontal .euiDataGrid__scrollOverlay {\\n  box-shadow: inset 0 -2px 0 -1px #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayBottom {\\n  position: absolute;\\n  width: 100%;\\n  height: 1px;\\n  background-color: #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayRight {\\n  position: absolute;\\n  height: 100%;\\n  width: 1px;\\n  background-color: #D3DAE6;\\n}\\nhtml.light-theme .euiDataGridHeader {\\n  display: flex;\\n  z-index: 999;\\n  background: #FFF;\\n  position: sticky;\\n  top: 0;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\nhtml.light-theme .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  padding: 6px;\\n  flex: 0 0 auto;\\n  position: relative;\\n  align-items: center;\\n  display: flex;\\n}\\nhtml.light-theme .euiDataGridHeaderCell > [data-focus-lock-disabled] {\\n  width: 100%;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:focus, html.light-theme .euiDataGridHeaderCell--hasColumnActions:focus-within, html.light-theme .euiDataGridHeaderCell--isActionsPopoverOpen {\\n  outline: none;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:focus::after, html.light-theme .euiDataGridHeaderCell--hasColumnActions:focus-within::after, html.light-theme .euiDataGridHeaderCell--isActionsPopoverOpen::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #0071c2);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__button {\\n  position: relative;\\n  display: flex;\\n  align-items: center;\\n  gap: 4px;\\n  width: 100%;\\n  font-weight: 700;\\n  outline: none;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__content {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__sortingArrow {\\n  flex: 0 0 auto;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__icon {\\n  flex: 0 0 auto;\\n  margin-left: auto;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  height: 16px;\\n  overflow: hidden;\\n  width: 0;\\n  opacity: 0;\\n  transition: width 150ms ease-in, opacity 350ms ease-in;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):focus-within .euiDataGridHeaderCell__icon, html.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):hover .euiDataGridHeaderCell__icon,\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiPopover-isOpen .euiDataGridHeaderCell__icon {\\n  width: 16px;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDataGridHeaderCell.euiDataGridHeaderCell--numeric .euiDataGridHeaderCell__content, html.light-theme .euiDataGridHeaderCell.euiDataGridHeaderCell--currency .euiDataGridHeaderCell__content {\\n  flex-grow: 1;\\n  text-align: right;\\n}\\nhtml.light-theme .euiDataGridHeader__action--selected {\\n  font-weight: 700 !important;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone.euiDataGrid--bordersHorizontal .euiDataGridHeader {\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-left: none;\\n  border-right: none;\\n  border-bottom: 2px solid #D3DAE6;\\n  border-bottom-color: #343741;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone.euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-bottom: 2px solid #D3DAE6;\\n  border-color: #343741;\\n}\\nhtml.light-theme .euiDataGrid--headerShade .euiDataGridHeaderCell {\\n  background: #f5f7fa;\\n}\\nhtml.light-theme .euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-right: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  border-left: none;\\n}\\nhtml.light-theme .euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell:first-of-type {\\n  border-left: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid--headerShade.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-bottom: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone .euiDataGridHeaderCell {\\n  border: none;\\n}\\nhtml.light-theme .euiDataGrid--borderhorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-right: none;\\n  border-left: none;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeSmall .euiDataGridHeaderCell {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeLarge .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.light-theme .euiDataGrid--paddingSmall .euiDataGridHeaderCell {\\n  padding: 4px;\\n}\\nhtml.light-theme .euiDataGrid--paddingLarge .euiDataGridHeaderCell {\\n  padding: 8px;\\n}\\nhtml.light-theme .euiDataGrid--noControls.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-top: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid--noControls.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGridFooter {\\n  display: flex;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridFooterCell {\\n  flex: 0 0 auto;\\n  position: relative;\\n  font-weight: 700;\\n}\\nhtml.light-theme .euiDataGrid--stickyFooter .euiDataGridFooter {\\n  position: sticky;\\n  bottom: 0;\\n}\\nhtml.light-theme .euiDataGrid--footerOverline .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-top: 2px solid #D3DAE6;\\n  border-top-color: #343741 !important;\\n  background: #FFF !important;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\nhtml.light-theme .euiDataGrid--bordersHorizontal .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\nhtml.light-theme .euiDataGrid--footerShade .euiDataGridRowCell.euiDataGridFooterCell {\\n  background: #f5f7fa;\\n}\\nhtml.light-theme .euiDataGridColumnResizer {\\n  position: absolute;\\n  top: 0;\\n  right: -8px;\\n  height: 100%;\\n  width: 16px;\\n  cursor: ew-resize;\\n  opacity: 0;\\n  z-index: 2;\\n}\\nhtml.light-theme .euiDataGridColumnResizer::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  left: 7px;\\n  top: 0;\\n  bottom: 0;\\n  width: 3px;\\n  background-color: #07C;\\n}\\nhtml.light-theme .euiDataGridColumnResizer:hover, html.light-theme .euiDataGridColumnResizer:active {\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDataGridColumnResizer:hover ~ .euiDataGridHeaderCell__content, html.light-theme .euiDataGridColumnResizer:active ~ .euiDataGridHeaderCell__content {\\n  -webkit-user-select: none;\\n  -moz-user-select: none;\\n  -ms-user-select: none;\\n      user-select: none;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:last-child .euiDataGridColumnResizer {\\n  right: 0;\\n  width: 8px;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:last-child .euiDataGridColumnResizer::after {\\n  left: auto;\\n  right: 0;\\n}\\nhtml.light-theme .euiDataGridRow {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiDataGridRowCell {\\n  position: relative;\\n  border-right: solid 1px #edf0f5;\\n  border-bottom: 1px solid #D3DAE6;\\n  --euiDataGridCellOutlineColor: #07C;\\n}\\nhtml.light-theme .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 6px;\\n  height: 100%;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiDataGridRowCell .euiDataGridRowCell__content--autoHeight {\\n  height: auto;\\n}\\nhtml.light-theme .euiDataGridRowCell > [data-focus-lock-disabled] {\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--firstColumn {\\n  border-left: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--lastColumn {\\n  border-right-color: #D3DAE6;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover, html.light-theme .euiDataGridRowCell:focus, html.light-theme .euiDataGridRowCell.euiDataGridRowCell--open {\\n  outline: none;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover::after, html.light-theme .euiDataGridRowCell:focus::after, html.light-theme .euiDataGridRowCell.euiDataGridRowCell--open::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #0071c2);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) {\\n  --euiDataGridCellOutlineColor: #69707D;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) .euiDataGridRowCell__actions {\\n  -webkit-animation-delay: 350ms;\\n  animation-delay: 350ms;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover .euiDataGridRowCell__actions, html.light-theme .euiDataGridRowCell:focus .euiDataGridRowCell__actions, html.light-theme .euiDataGridRowCell:focus-within .euiDataGridRowCell__actions, html.light-theme .euiDataGridRowCell.euiDataGridRowCell--open .euiDataGridRowCell__actions, html.light-theme .euiDataGridRowCell[data-keyboard-closing] .euiDataGridRowCell__actions {\\n  -webkit-animation-duration: 90ms;\\n  animation-duration: 90ms;\\n  -webkit-animation-name: euiDataGridCellActionsSlideIn;\\n  animation-name: euiDataGridCellActionsSlideIn;\\n  -webkit-animation-iteration-count: 1;\\n  animation-iteration-count: 1;\\n  -webkit-animation-fill-mode: forwards;\\n  animation-fill-mode: forwards;\\n}\\nhtml.light-theme .euiDataGridRowCell:not(:hover):not(:focus):not(.euiDataGridRowCell--open):not([data-keyboard-closing]) .euiDataGridRowCell__actions {\\n  display: none;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--numeric {\\n  text-align: right;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--currency {\\n  text-align: right;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--uppercase {\\n  text-transform: uppercase;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--lowercase {\\n  text-transform: lowercase;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--capitalize {\\n  text-transform: capitalize;\\n}\\nhtml.light-theme .euiDataGridRowCell__popover {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  overflow: auto;\\n  z-index: 1000 !important;\\n  filter: none;\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  -webkit-animation-duration: 250ms;\\n  animation-duration: 250ms;\\n  -webkit-animation-name: euiDataGridCellPopover;\\n  animation-name: euiDataGridCellPopover;\\n}\\nhtml.light-theme .euiDataGridRowCell__popover::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGridRowCell__popover::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiDataGridRowCell__popover::-webkit-scrollbar-corner, html.light-theme .euiDataGridRowCell__popover::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiDataGridRowCell--controlColumn .euiDataGridRowCell__content {\\n  max-height: 100%;\\n  height: auto;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiDataGridRowCell__actions,\\nhtml.light-theme .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  position: absolute;\\n  bottom: 100%;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions,\\nhtml.light-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  left: 0;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions,\\nhtml.light-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  right: 0;\\n}\\nhtml.light-theme .euiDataGridRowCell__actions {\\n  z-index: 998;\\n  margin-bottom: -1px;\\n  display: flex;\\n  gap: 2px;\\n  padding-inline: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n  color: #FFF;\\n  border: 1px solid var(--euiDataGridCellOutlineColor);\\n  border-top-left-radius: 3px;\\n  border-top-right-radius: 3px;\\n  transform: scaleY(0);\\n  transform-origin: bottom;\\n}\\nhtml.light-theme .euiDataGridRowCell[data-gridcell-visible-row-index=\\\"0\\\"] > .euiDataGridRowCell__actions {\\n  z-index: 999;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions {\\n  border-bottom-right-radius: 3px;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions {\\n  border-bottom-left-radius: 3px;\\n}\\nhtml.light-theme .euiDataGridRowCell__actions::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 100%;\\n  height: 2px;\\n  width: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n}\\nhtml.light-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions::after {\\n  left: -1px;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions::after {\\n  right: -1px;\\n}\\nhtml.light-theme .euiDataGridRowCell__actionButtonIcon {\\n  height: 20px;\\n  width: 16px;\\n  border-radius: 0;\\n  /* Force all cell action buttons to match EUI colors */\\n  /* Manually increase the size of the expand cell icon - it's a bit small by default */\\n}\\nhtml.light-theme .euiDataGridRowCell__actionButtonIcon,\\nhtml.light-theme .euiDataGridRowCell__actionButtonIcon svg {\\n  background-color: transparent !important;\\n  color: currentColor !important;\\n  fill: currentColor !important;\\n}\\nhtml.light-theme .euiDataGridRowCell__actionButtonIcon.euiDataGridRowCell__expandCell .euiIcon {\\n  width: 120%;\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGrid--stripes .euiDataGridRow--striped {\\n  background-color: #F5F7FA;\\n}\\nhtml.light-theme .euiDataGrid--rowHoverHighlight .euiDataGridRow:hover {\\n  background-color: #fff9e8;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone .euiDataGridRowCell {\\n  border-color: transparent !important;\\n}\\nhtml.light-theme .euiDataGrid--bordersHorizontal .euiDataGridRowCell {\\n  border-right-color: transparent;\\n  border-left-color: transparent;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.light-theme .euiDataGrid--paddingSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 4px;\\n}\\nhtml.light-theme .euiDataGrid--paddingLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 8px;\\n}\\n@-webkit-keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@-webkit-keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\nhtml.light-theme .euiDataGrid__controls {\\n  background: #fafbfd;\\n  position: relative;\\n  z-index: 2;\\n  border: 1px solid #D3DAE6;\\n  padding: 4px 4px 4px 0;\\n  display: flex;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\nhtml.light-theme .euiDataGrid__rightControls {\\n  white-space: nowrap;\\n}\\nhtml.light-theme .euiDataGrid__rightControls:only-child {\\n  margin-left: auto;\\n}\\nhtml.light-theme .euiDataGrid__rightControls > * + * {\\n  margin-left: 8px;\\n}\\nhtml.light-theme .euiDataGrid__leftControls > * + * {\\n  margin-left: 2px;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone .euiDataGrid__controls {\\n  border: none;\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGrid--bordersHorizontal .euiDataGrid__controls {\\n  border-right: none;\\n  border-left: none;\\n  border-top: none;\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  padding: 8px;\\n  margin: -8px;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll::-webkit-scrollbar-corner, html.light-theme .euiDataGrid__controlScroll::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .euiDataGrid__controlScroll[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .euiDataGridColumnSelector__item {\\n  padding: 4px;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  margin: 0 -8px;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-corner, html.light-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .euiDataGridColumnSelector__itemLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  max-height: 300px;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-corner, html.light-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .euiDataGridColumnSorting__field {\\n  display: block;\\n  padding: 4px 8px;\\n  width: 100%;\\n  outline-offset: -2px;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__field:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__field:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiDataGridColumnSorting__field:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #ABB4C4;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__name {\\n  padding-right: 24px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\nhtml.light-theme .euiDataGridColumnSorting__order {\\n  min-width: 200px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\nhtml.light-theme .euiDataGridColumnSorting__order .euiButtonGroup__buttons {\\n  border: none;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__order .euiButtonGroupButton {\\n  font-size: 12px;\\n}\\nhtml.light-theme .euiDataGrid__displayPopoverPanel {\\n  width: 416px;\\n}\\nhtml.light-theme .euiDataGrid__keyboardShortcuts {\\n  display: block;\\n  max-inline-size: 400px;\\n  max-block-size: 80vh;\\n  overflow-y: auto;\\n  overflow-block: auto;\\n}\\nhtml.light-theme .euiDataGrid__keyboardShortcuts .euiDescriptionList {\\n  row-gap: 0;\\n}\\nhtml.light-theme .euiCheckbox {\\n  position: relative;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input ~ .euiCheckbox__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 4px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:checked + .euiCheckbox__square {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%28255, 255, 255%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:indeterminate + .euiCheckbox__square {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%28255, 255, 255%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input[disabled] ~ .euiCheckbox__label {\\n  color: #98A2B3;\\n  cursor: not-allowed !important;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:checked[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%2894, 100, 111%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:indeterminate[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%2894, 100, 111%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiCheckbox.euiCheckbox--inList, html.light-theme .euiCheckbox.euiCheckbox--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\nhtml.light-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__input,\\nhtml.light-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__square, html.light-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input,\\nhtml.light-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__square {\\n  top: 0;\\n}\\nhtml.light-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__input, html.light-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input {\\n  margin: 0;\\n}\\nhtml.light-theme .euiCheckboxGroup__item + .euiCheckboxGroup__item {\\n  margin-top: 4px;\\n}\\nhtml.light-theme .euiCheckboxGroup__item + .euiCheckboxGroup__item.euiCheckbox--compressed {\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiDescribedFormGroup {\\n  max-width: 800px;\\n}\\nhtml.light-theme .euiDescribedFormGroup + * {\\n  margin-top: 24px;\\n}\\nhtml.light-theme .euiDescribedFormGroup.euiDescribedFormGroup--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__description {\\n  padding-top: 8px;\\n}\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields {\\n  min-width: 0;\\n}\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child,\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel) {\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child::before,\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel)::before {\\n  content: \\\"\\\";\\n}\\nhtml.light-theme .euiDescribedFormGroup__descriptionColumn {\\n  min-width: min(20rem, 50%);\\n}\\nhtml.light-theme .euiFieldNumber {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\nhtml.light-theme .euiFieldNumber--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFieldNumber--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFieldNumber--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldNumber {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldNumber::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldNumber:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiFieldNumber:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFieldNumber--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldNumber--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldNumber--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldNumber--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFieldNumber--withIcon {\\n  padding-left: 40px;\\n}\\nhtml.light-theme .euiFieldNumber--withIcon.euiFieldNumber--compressed {\\n  padding-left: 32px;\\n}\\nhtml.light-theme .euiFieldPassword {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n}\\nhtml.light-theme .euiFieldPassword--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFieldPassword--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFieldPassword--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldPassword {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldPassword::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldPassword:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiFieldPassword:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFieldPassword--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldPassword--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldPassword--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldPassword--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFieldPassword.euiFieldPassword--compressed {\\n  padding-left: 32px;\\n}\\nhtml.light-theme .euiFieldPassword--withToggle::-ms-reveal {\\n  display: none;\\n}\\nhtml.light-theme .euiFieldSearch {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n  -webkit-appearance: textfield;\\n  /* 1 */\\n}\\nhtml.light-theme .euiFieldSearch--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFieldSearch--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFieldSearch--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldSearch {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldSearch::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldSearch:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiFieldSearch:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFieldSearch--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldSearch--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldSearch--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldSearch--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFieldSearch-isLoading {\\n  padding-right: 40px;\\n}\\nhtml.light-theme .euiFieldSearch-isLoading.euiFieldSearch--compressed {\\n  padding-right: 32px;\\n}\\nhtml.light-theme .euiFieldSearch::-webkit-search-decoration, html.light-theme .euiFieldSearch::-webkit-search-cancel-button {\\n  -webkit-appearance: none;\\n  /* 1, 2 */\\n}\\nhtml.light-theme .euiFieldSearch--compressed {\\n  padding-left: 32px;\\n}\\nhtml.light-theme .euiFieldText {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\nhtml.light-theme .euiFieldText--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFieldText--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFieldText--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldText {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldText::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldText:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiFieldText:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFieldText--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldText--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldText--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldText--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFieldText--withIcon {\\n  padding-left: 40px;\\n}\\nhtml.light-theme .euiFieldText--withIcon.euiFieldText--compressed {\\n  padding-left: 32px;\\n}\\nhtml.light-theme .euiFilePicker {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  position: relative;\\n}\\nhtml.light-theme .euiFilePicker--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFilePicker--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFilePicker--inGroup {\\n  height: 100%;\\n}\\nhtml.light-theme .euiFilePicker.euiFilePicker--large {\\n  border-radius: 6px;\\n  overflow: hidden;\\n  height: auto;\\n}\\nhtml.light-theme .euiFilePicker.euiFilePicker--large.euiFilePicker--compressed {\\n  border-radius: 4px;\\n}\\nhtml.light-theme .euiFilePicker__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiFilePicker__input:hover {\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiFilePicker__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled {\\n  opacity: 0;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled ~ .euiFilePicker__prompt {\\n  color: #98A2B3;\\n}\\nhtml.light-theme .euiFilePicker__icon {\\n  position: absolute;\\n  left: 12px;\\n  top: 12px;\\n  transition: transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.light-theme .euiFilePicker--compressed .euiFilePicker__icon {\\n  top: 8px;\\n  left: 8px;\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__icon {\\n  position: static;\\n  margin-bottom: 16px;\\n}\\nhtml.light-theme .euiFilePicker__prompt {\\n  padding-left: 40px;\\n  /* 2 */\\n  height: 40px;\\n  padding-top: 12px;\\n  padding-right: 12px;\\n  padding-bottom: 12px;\\n  pointer-events: none;\\n  /* 1 */\\n  border: 2px dashed #D3DAE6;\\n  border-radius: 6px;\\n  transition: border-color 150ms ease-in, background-color 150ms ease-in;\\n}\\nhtml.light-theme .euiFilePicker--compressed .euiFilePicker__prompt {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  padding-left: 32px;\\n  /* 2 */\\n  height: 32px;\\n  border-radius: 4px;\\n  box-shadow: none;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFilePicker--compressed .euiFilePicker__prompt {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__prompt {\\n  height: 128px;\\n  /* 4 */\\n  padding: 0 24px;\\n  display: flex;\\n  flex-direction: column;\\n  align-items: center;\\n  justify-content: center;\\n}\\nhtml.light-theme .euiFilePicker--large.euiFilePicker--compressed .euiFilePicker__prompt {\\n  height: 104px;\\n  /* 4 */\\n}\\nhtml.light-theme .euiFilePicker-isInvalid:not(.euiFilePicker__showDrop) .euiFilePicker__input:not(:disabled):not(:focus) + .euiFilePicker__prompt {\\n  border-color: #BD271E;\\n}\\nhtml.light-theme .euiFilePicker__promptText {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  line-height: 16px;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) .euiFilePicker__promptText {\\n  color: #0071c2;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__promptText {\\n  margin-top: -2px;\\n}\\nhtml.light-theme .euiFilePicker__clearButton,\\nhtml.light-theme .euiFilePicker__loadingSpinner {\\n  position: absolute;\\n  right: 12px;\\n  top: 12px;\\n}\\nhtml.light-theme .euiFilePicker--compressed .euiFilePicker__clearButton,\\nhtml.light-theme .euiFilePicker--compressed .euiFilePicker__loadingSpinner {\\n  top: 8px;\\n}\\nhtml.light-theme .euiFilePicker__clearButton {\\n  pointer-events: auto;\\n  /* 1 */\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton .euiFilePicker__clearIcon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 2px;\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__clearButton {\\n  position: relative;\\n  top: 0;\\n  right: 0;\\n}\\nhtml.light-theme .euiFilePicker__showDrop .euiFilePicker__prompt,\\nhtml.light-theme .euiFilePicker__input:focus + .euiFilePicker__prompt {\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  box-shadow: none;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-isLoading .euiFilePicker__prompt, html.light-theme .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-hasFiles .euiFilePicker__prompt {\\n  padding-right: 40px;\\n  /* 2 */\\n}\\nhtml.light-theme .euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__promptText,\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__icon,\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\nhtml.light-theme .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\nhtml.light-theme .euiFilePicker--large.euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  font-weight: 700;\\n}\\nhtml.light-theme .euiForm__error {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  list-style: disc;\\n}\\nhtml.light-theme .euiForm__errors {\\n  margin-bottom: 16px;\\n}\\nhtml.light-theme .euiSelect {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSelect--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiSelect--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiSelect--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiSelect {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiSelect::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSelect:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiSelect:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiSelect--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiSelect--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiSelect--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSelect--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiSelect--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSelect--inGroup {\\n  line-height: 38px;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSelect--inGroup.euiSelect--compressed {\\n  line-height: 30px;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSelect::-ms-expand {\\n  display: none;\\n}\\nhtml.light-theme .euiSelect:focus::-ms-value {\\n  color: #343741;\\n  background: transparent;\\n}\\nhtml.light-theme .euiSelect:-moz-focusring {\\n  color: transparent;\\n  text-shadow: 0 0 0 #343741;\\n}\\nhtml.light-theme .euiSuperSelect__listbox {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 300px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n}\\nhtml.light-theme .euiSuperSelect__listbox::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiSuperSelect__listbox::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiSuperSelect__listbox::-webkit-scrollbar-corner, html.light-theme .euiSuperSelect__listbox::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiSuperSelect__item {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 8px;\\n}\\nhtml.light-theme .euiSuperSelect__item:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiSuperSelect__item:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiSuperSelect__item:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #ABB4C4;\\n}\\nhtml.light-theme .euiSuperSelect__item--hasDividers:not(:last-of-type) {\\n  border-bottom: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiSuperSelectControl {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  display: block;\\n  /* 2 */\\n  text-align: left;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\nhtml.light-theme .euiSuperSelectControl--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiSuperSelectControl--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiSuperSelectControl {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiSuperSelectControl::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSuperSelectControl:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiSuperSelectControl:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiSuperSelectControl--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiSuperSelectControl-isInvalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSuperSelectControl__placeholder {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n}\\nhtml.light-theme .euiSuperSelectControl.euiSuperSelect--isOpen__button {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFormControlLayout {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n}\\nhtml.light-theme .euiFormControlLayout--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFormControlLayout--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFormControlLayout--inGroup {\\n  height: 100%;\\n}\\nhtml.light-theme .euiFormControlLayout--1icons {\\n  --eui-form-control-layout-icons-padding: 34px;\\n  padding-right: 34px;\\n}\\nhtml.light-theme .euiFormControlLayout--1icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 26px;\\n  padding-right: 26px;\\n}\\nhtml.light-theme .euiFormControlLayout--2icons {\\n  --eui-form-control-layout-icons-padding: 56px;\\n  padding-right: 56px;\\n}\\nhtml.light-theme .euiFormControlLayout--2icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 44px;\\n  padding-right: 44px;\\n}\\nhtml.light-theme .euiFormControlLayout--3icons {\\n  --eui-form-control-layout-icons-padding: 78px;\\n  padding-right: 78px;\\n}\\nhtml.light-theme .euiFormControlLayout--3icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 62px;\\n  padding-right: 62px;\\n}\\nhtml.light-theme .euiFormControlLayout--4icons {\\n  --eui-form-control-layout-icons-padding: 100px;\\n  padding-right: 100px;\\n}\\nhtml.light-theme .euiFormControlLayout--4icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 80px;\\n  padding-right: 80px;\\n}\\nhtml.light-theme .euiFormControlLayout--5icons {\\n  --eui-form-control-layout-icons-padding: 122px;\\n  padding-right: 122px;\\n}\\nhtml.light-theme .euiFormControlLayout--5icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 98px;\\n  padding-right: 98px;\\n}\\nhtml.light-theme .euiFormControlLayout__childrenWrapper {\\n  position: relative;\\n}\\nhtml.light-theme .euiFormControlLayout--group {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFormControlLayout--group {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFormControlLayout--group > *,\\nhtml.light-theme .euiFormControlLayout--group .euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiText,\\nhtml.light-theme .euiFormControlLayout--group .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group .euiButtonIcon {\\n  height: 100%;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper {\\n  flex-grow: 1;\\n  overflow: hidden;\\n  /* 2 */\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  flex-shrink: 0;\\n  height: 100%;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n  background-color: #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon, html.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty {\\n  transform: none !important;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon .euiIcon, html.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty .euiIcon {\\n  background: none !important;\\n  padding: 0;\\n  width: 16px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiButtonIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiButtonIcon:not(:focus) {\\n  background-color: #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiButtonIcon:focus-visible {\\n  outline: 2px solid #0071c2;\\n  outline-offset: -2px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  height: 100%;\\n  background-color: #e9edf3;\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group > .euiFormControlLayout__prepend,\\nhtml.light-theme .euiFormControlLayout--group > .euiFormControlLayout__append {\\n  max-width: 50%;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  background-color: #e9edf3;\\n  padding: 12px;\\n  line-height: 16px !important;\\n  cursor: default !important;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper):not(input),\\nhtml.light-theme .euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper):not(input) {\\n  margin-left: -12px;\\n}\\nhtml.light-theme .euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -12px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiButtonEmpty {\\n  border-right: none;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ .euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ * .euiButtonEmpty {\\n  border-right: none;\\n  border-left: none;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n  overflow: hidden;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  padding: 8px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper),\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper) {\\n  margin-left: -8px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -8px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--readOnly {\\n  cursor: default;\\n  background: #e9edf3;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--readOnly input {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFormControlLayoutDelimited {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited > .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  width: 100%;\\n  background-color: #fbfcfd;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper, html.light-theme .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper > *:not(.euiFormControlLayoutDelimited__delimiter):not(.euiFormControlLayoutIcons) {\\n  width: 100%;\\n  max-width: none;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled] {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled]::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled]:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled]::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled] .euiFormControlLayout__childrenWrapper {\\n  background-color: #eef2f7;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] .euiFormControlLayout__childrenWrapper {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited--isInvalid .euiFormControlLayout__childrenWrapper {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited__input {\\n  box-shadow: none !important;\\n  border-radius: 0 !important;\\n  text-align: center;\\n  height: 100%;\\n  min-width: 0;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited__delimiter {\\n  align-self: stretch;\\n  flex-grow: 0;\\n  display: flex;\\n  align-items: center;\\n  line-height: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons {\\n  pointer-events: none;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons > * + * {\\n  margin-left: 6px;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons--absolute {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 12px;\\n}\\nhtml.light-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--absolute {\\n  left: 8px;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons--static {\\n  position: static;\\n  height: 100%;\\n  align-self: stretch;\\n  flex-grow: 0;\\n  padding-inline: 12px;\\n}\\nhtml.light-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--static {\\n  padding-inline: 8px;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons--left {\\n  z-index: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 12px;\\n}\\nhtml.light-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 8px;\\n}\\nhtml.light-theme *:disabled + .euiFormControlLayoutIcons {\\n  cursor: not-allowed;\\n  color: #98A2B3;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton .euiFormControlLayoutClearButton__icon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 2px;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small {\\n  width: 12px;\\n  height: 12px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 12px;\\n  line-height: 0;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small .euiFormControlLayoutClearButton__icon {\\n  width: 6px;\\n  height: 6px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 4px;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon {\\n  pointer-events: none;\\n  font-size: 0;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable .euiFormControlLayoutCustomIcon__icon {\\n  vertical-align: baseline;\\n  transform: none;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable:disabled {\\n  cursor: not-allowed;\\n  color: #98A2B3;\\n}\\nhtml.light-theme .euiFormErrorText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #BD271E;\\n}\\nhtml.light-theme .euiFormLegend {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-weight: 600;\\n}\\nhtml.light-theme .euiFormLegend:not(.euiFormLegend-isHidden) {\\n  margin-bottom: 8px;\\n}\\nhtml.light-theme .euiFormLegend:not(.euiFormLegend-isHidden).euiFormLegend--compressed {\\n  margin-bottom: 4px;\\n}\\nhtml.light-theme .euiFormHelpText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #69707D;\\n}\\nhtml.light-theme .euiFormLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-weight: 600;\\n  display: inline-block;\\n  transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.light-theme .euiFormLabel.euiFormLabel-isInvalid {\\n  color: #BD271E;\\n  /* 1 */\\n}\\nhtml.light-theme .euiFormLabel.euiFormLabel-isFocused {\\n  color: #07C;\\n  /* 1 */\\n}\\nhtml.light-theme .euiFormLabel[for] {\\n  cursor: pointer;\\n  /* 2 */\\n}\\nhtml.light-theme .euiFormLabel[for].euiFormLabel-isDisabled {\\n  cursor: default;\\n  /* 2 */\\n}\\nhtml.light-theme .euiFormRow {\\n  display: flex;\\n  /* 1 */\\n  flex-direction: column;\\n  /* 1 */\\n  max-width: 400px;\\n}\\nhtml.light-theme .euiFormRow + .euiFormRow,\\nhtml.light-theme .euiFormRow + .euiButton {\\n  margin-top: 16px;\\n}\\nhtml.light-theme .euiFormRow--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFormRow--hasEmptyLabelSpace {\\n  margin-top: 20px;\\n  /* 2 */\\n  min-height: 40px;\\n  padding-bottom: 0;\\n  justify-content: center;\\n}\\nhtml.light-theme .euiFormRow__labelWrapper {\\n  display: flex;\\n  flex-wrap: wrap;\\n  justify-content: space-between;\\n  margin-bottom: 4px;\\n}\\nhtml.light-theme .euiFormRow--horizontal {\\n  flex-direction: row;\\n  align-items: stretch;\\n}\\nhtml.light-theme .euiFormRow--horizontal .euiFormRow__label {\\n  -webkit-hyphens: auto;\\n  -ms-hyphens: auto;\\n      hyphens: auto;\\n}\\nhtml.light-theme .euiFormRow--horizontal .euiFormRow__labelWrapper {\\n  display: block;\\n  line-height: 31px;\\n  width: calc(33% - 8px);\\n  margin-right: 8px;\\n  margin-bottom: 0;\\n}\\nhtml.light-theme .euiFormRow--horizontal .euiFormRow__fieldWrapper {\\n  width: 67%;\\n}\\nhtml.light-theme .euiFormRow--horizontal + .euiFormRow--horizontal {\\n  margin-top: 8px;\\n}\\nhtml.light-theme .euiFormRow--horizontal + .euiFormRow--horizontal.euiFormRow--hasSwitch {\\n  margin-top: 12px;\\n}\\nhtml.light-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__labelWrapper {\\n  line-height: 19px;\\n  width: auto;\\n  min-width: calc(33% - 8px);\\n}\\nhtml.light-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper {\\n  width: auto;\\n}\\nhtml.light-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper .euiSwitch--compressed {\\n  margin-top: 2px;\\n}\\nhtml.light-theme .euiFormRow--horizontal.euiFormRow--hasSwitch + .euiFormRow--horizontal {\\n  margin-top: 12px;\\n}\\nhtml.light-theme .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 40px;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiFormRow--compressed.euiFormRow--hasEmptyLabelSpace {\\n  min-height: 32px;\\n}\\nhtml.light-theme .euiFormRow--compressed .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 32px;\\n}\\nhtml.light-theme .euiRadio {\\n  position: relative;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\nhtml.light-theme .euiRadio .euiRadio__input ~ .euiRadio__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input + .euiRadio__circle {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:checked + .euiRadio__circle {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%28255, 255, 255%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiRadio .euiRadio__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input[disabled] ~ .euiRadio__label {\\n  color: #98A2B3;\\n  cursor: not-allowed !important;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input[disabled] + .euiRadio__circle {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:checked[disabled] + .euiRadio__circle {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%2894, 100, 111%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiRadio.euiRadio--inList, html.light-theme .euiRadio.euiRadio--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\nhtml.light-theme .euiRadio.euiRadio--inList .euiRadio__input,\\nhtml.light-theme .euiRadio.euiRadio--inList .euiRadio__circle, html.light-theme .euiRadio.euiRadio--noLabel .euiRadio__input,\\nhtml.light-theme .euiRadio.euiRadio--noLabel .euiRadio__circle {\\n  top: 0;\\n}\\nhtml.light-theme .euiRadio.euiRadio--inList .euiRadio__input, html.light-theme .euiRadio.euiRadio--noLabel .euiRadio__input {\\n  margin: 0;\\n}\\nhtml.light-theme .euiRadioGroup__item + .euiRadioGroup__item {\\n  margin-top: 4px;\\n}\\nhtml.light-theme .euiRadioGroup__item + .euiRadioGroup__item.euiRadio--compressed {\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiSwitch {\\n  position: relative;\\n  display: inline-flex;\\n  align-items: flex-start;\\n  min-height: 20px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__label {\\n  cursor: pointer;\\n  padding-left: 8px;\\n  line-height: 20px;\\n  font-size: 14px;\\n  vertical-align: middle;\\n  display: inline-block;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button {\\n  flex-shrink: 0;\\n  line-height: 0;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__body {\\n  background-color: rgba(105, 112, 125, 0.75);\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 0;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon {\\n  right: -8px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon.euiSwitch__icon--checked {\\n  right: auto;\\n  left: -34px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled:hover,\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled ~ .euiSwitch__label:hover {\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__body {\\n  background-color: rgba(211, 218, 230, 0.5);\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__thumb {\\n  background-color: rgba(0, 0, 0, 0);\\n  border-color: rgba(105, 112, 125, 0.5);\\n  box-shadow: none;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__icon {\\n  fill: #69707D;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled + .euiSwitch__label {\\n  color: #98A2B3;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__body {\\n  pointer-events: none;\\n  width: 44px;\\n  height: 20px;\\n  background-color: #07C;\\n  display: inline-block;\\n  position: relative;\\n  border-radius: 20px;\\n  vertical-align: middle;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__thumb {\\n  padding: 9px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 18px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  position: absolute;\\n  display: inline-block;\\n  left: 24px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__track {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  overflow: hidden;\\n  border-radius: 20px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__icon {\\n  position: absolute;\\n  right: -34px;\\n  top: 2px;\\n  bottom: 0;\\n  width: 42px;\\n  height: 16px;\\n  transition: left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), right 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  fill: #FFF;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__icon--checked {\\n  right: auto;\\n  left: -8px;\\n  fill: #FFF;\\n}\\nhtml.light-theme .euiSwitch:hover .euiSwitch__button:not(:disabled) .euiSwitch__thumb {\\n  transform: scale(1.05);\\n}\\nhtml.light-theme .euiSwitch:hover .euiSwitch__button:active .euiSwitch__thumb {\\n  transform: scale(0.95);\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed {\\n  min-height: 16px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__label {\\n  line-height: 16px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__body {\\n  width: 28px;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__thumb {\\n  padding: 6px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 12px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__track {\\n  border-radius: 16px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini {\\n  min-height: 10px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__label {\\n  line-height: 10px;\\n  font-size: 12px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__body {\\n  width: 22px;\\n  height: 10px;\\n  border-radius: 10px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__thumb {\\n  padding: 3px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 6px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__track {\\n  border-radius: 10px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb, html.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 1px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb, html.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb {\\n  border-color: rgba(105, 112, 125, 0.5);\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true] .euiSwitch__thumb, html.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true] .euiSwitch__thumb {\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiTextArea {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  line-height: 1.5;\\n}\\nhtml.light-theme .euiTextArea--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiTextArea--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiTextArea--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiTextArea {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiTextArea::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiTextArea:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiTextArea:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiTextArea--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiTextArea--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiTextArea--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiTextArea--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiTextArea, html.light-theme .euiTextArea--compressed {\\n  height: auto;\\n}\\nhtml.light-theme .euiFormControlLayout--euiTextArea {\\n  height: auto;\\n}\\nhtml.light-theme .euiFormControlLayout--euiTextArea .euiFormControlLayoutIcons {\\n  top: auto;\\n  bottom: 12px;\\n}\\nhtml.light-theme .euiTextArea--resizeVertical {\\n  resize: vertical;\\n}\\nhtml.light-theme .euiTextArea--resizeHorizontal {\\n  resize: horizontal;\\n}\\nhtml.light-theme .euiTextArea--resizeBoth {\\n  resize: both;\\n}\\nhtml.light-theme .euiTextArea--resizeNone {\\n  resize: none;\\n}\\nhtml.light-theme .euiMarkdownEditor {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .euiMarkdownEditor--isPreviewing .euiMarkdownEditor__toggleContainer {\\n  display: none;\\n}\\nhtml.light-theme .euiMarkdownEditor--fullHeight {\\n  height: 100%;\\n}\\nhtml.light-theme .euiMarkdownEditor--fullHeight .euiMarkdownEditorTextArea {\\n  resize: none;\\n}\\nhtml.light-theme .euiMarkdownEditor--fullHeight .euiMarkdownEditorDropZone {\\n  height: 100%;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone {\\n  display: flex;\\n  position: relative;\\n  flex-direction: column;\\n  min-height: \\\"150px\\\";\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone__input:hover {\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorFooter,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(0, 119, 204, 0.1) !important;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%) !important;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorFooter,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea:focus,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(189, 39, 30, 0.1) !important;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea,\\nhtml.light-theme .euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%) !important;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__blockquote {\\n  border-left-color: rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiHorizontalRule {\\n  background-color: rgba(0, 0, 0, 0.15);\\n  color: rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table {\\n  border-left: 1px solid rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td {\\n  border-top: 1px solid rgba(0, 0, 0, 0.15);\\n  border-bottom: 1px solid rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__blockquote {\\n  border-left-color: #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiHorizontalRule {\\n  background-color: #69707D;\\n  color: #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table {\\n  border-left: 1px solid #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #69707D;\\n  border-bottom: 1px solid #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__blockquote {\\n  border-left-color: #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiHorizontalRule {\\n  background-color: #00BFB3;\\n  color: #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table {\\n  border-left: 1px solid #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #00BFB3;\\n  border-bottom: 1px solid #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiHorizontalRule {\\n  background-color: #F04E98;\\n  color: #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F04E98;\\n  border-bottom: 1px solid #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiHorizontalRule {\\n  background-color: #FEC514;\\n  color: #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FEC514;\\n  border-bottom: 1px solid #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__blockquote {\\n  border-left-color: #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiHorizontalRule {\\n  background-color: #BD271E;\\n  color: #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table {\\n  border-left: 1px solid #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #BD271E;\\n  border-bottom: 1px solid #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiHorizontalRule {\\n  background-color: #FFF;\\n  color: #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FFF;\\n  border-bottom: 1px solid #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat .euiCheckbox {\\n  margin-bottom: 0 !important;\\n}\\nhtml.light-theme .euiMarkdownFormat .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  top: 50%;\\n  transform: translateY(-50%);\\n}\\nhtml.light-theme .euiMarkdownFormat .euiMarkdownFormat__table {\\n  display: block;\\n  width: 100%;\\n  overflow: auto;\\n  border-spacing: 0;\\n  border-collapse: collapse;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter {\\n  display: inline-flex;\\n  padding: 4px;\\n  border: 1px solid #D3DAE6;\\n  align-items: center;\\n  background: #fafbfd;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__popover {\\n  width: 300px;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__actions {\\n  flex: 1;\\n  display: inline-flex;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__actions > button,\\nhtml.light-theme .euiMarkdownEditorFooter__actions > span {\\n  margin-right: 4px;\\n  align-self: center;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError {\\n  position: relative;\\n  left: -1px;\\n  line-height: 1;\\n  border-radius: 6px;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError > span {\\n  padding: 0 4px;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__helpButton > svg {\\n  width: 26px;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background: #FFF;\\n  min-height: \\\"150px\\\";\\n  overflow-y: auto;\\n  border: 1px solid #D3DAE6;\\n  padding: 12px;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview::-webkit-scrollbar-corner, html.light-theme .euiMarkdownEditorPreview::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input ~ .euiCheckbox__label {\\n  cursor: default;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input:focus:not(:checked) + .euiCheckbox__square {\\n  border-color: #939496;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  width: 100%;\\n  height: 100%;\\n  min-height: \\\"150px\\\";\\n  padding: 12px;\\n  border: 1px solid #D3DAE6;\\n  border-bottom: none;\\n  line-height: 1.5;\\n  resize: vertical;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  margin: 0;\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-corner, html.light-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea:focus, html.light-theme .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea-isReadOnly {\\n  background: #FFF;\\n  cursor: unset;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea-isReadOnly:focus, html.light-theme .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea-isReadOnly {\\n  background: none;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar {\\n  display: flex;\\n  flex-wrap: wrap;\\n  background: #F5F7FA;\\n  border: 1px solid #D3DAE6;\\n  border-color: #D3DAE6;\\n  border-bottom: none;\\n  padding: 4px;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar__buttons {\\n  display: flex;\\n  flex-wrap: wrap;\\n  flex: 1;\\n  align-items: center;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar__buttons > * {\\n  margin-right: 4px;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar__divider {\\n  content: \\\"\\\";\\n  height: 24px;\\n  display: block;\\n  margin-left: 4px;\\n  padding-right: 4px;\\n  border-left: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiMarkdownTooltip__icon {\\n  transform: translateY(-1px);\\n}\\nhtml.light-theme .euiSelectable {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .euiSelectable-fullHeight {\\n  height: 100%;\\n}\\nhtml.light-theme .euiSelectableList:has(:focus-visible) {\\n  outline: 2px solid currentColor;\\n  outline-style: auto;\\n  outline-offset: 1px;\\n}\\nhtml.light-theme .euiSelectableList-fullHeight {\\n  flex-grow: 1;\\n}\\nhtml.light-theme .euiSelectableList-bordered {\\n  overflow: hidden;\\n  border: 1px solid #D3DAE6;\\n  border-radius: 6px;\\n}\\nhtml.light-theme .euiSelectableList__list {\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\nhtml.light-theme .euiSelectableList__list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiSelectableList__list::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiSelectableList__list::-webkit-scrollbar-corner, html.light-theme .euiSelectableList__list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiSelectableList__list:focus, html.light-theme .euiSelectableList__list > ul:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiSelectableList__groupLabel {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 700;\\n  display: flex;\\n  align-items: center;\\n  border-bottom: 1px solid #eef2f7;\\n  padding: 4px 12px;\\n}\\nhtml.light-theme .euiSelectableListItem {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  display: inline-flex;\\n  width: 100%;\\n  text-align: left;\\n  cursor: pointer;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiSelectableListItem:not(:last-of-type) {\\n  border-bottom: 1px solid #eef2f7;\\n}\\nhtml.light-theme .euiSelectableListItem-isFocused:not([aria-disabled=true]), html.light-theme .euiSelectableListItem:hover:not([aria-disabled=true]) {\\n  color: #0071c2;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiSelectableListItem-isFocused:not([aria-disabled=true]) .euiSelectableListItem__text, html.light-theme .euiSelectableListItem:hover:not([aria-disabled=true]) .euiSelectableListItem__text {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiSelectableListItem[aria-disabled=true] {\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiSelectableListItem--paddingSmall .euiSelectableListItem__content {\\n  padding: 4px 12px;\\n}\\nhtml.light-theme .euiSelectableListItem__content {\\n  width: 100%;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiSelectableListItem__icon,\\nhtml.light-theme .euiSelectableListItem__prepend {\\n  margin-right: 12px;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .euiSelectableListItem__append {\\n  margin-left: 12px;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .euiSelectableListItem__text {\\n  flex-grow: 1;\\n}\\nhtml.light-theme .euiSelectableListItem__text--truncate {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .euiSelectableMessage {\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n  /* 1 */\\n  display: flex;\\n  flex-direction: column;\\n  justify-content: center;\\n  align-items: center;\\n}\\nhtml.light-theme .euiSelectableMessage--bordered {\\n  overflow: hidden;\\n  border: 1px solid #D3DAE6;\\n  border-radius: 6px;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__listItem .euiSelectableListItem__text {\\n  text-decoration: none !important;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__listItem[class*=-isFocused]:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle, html.light-theme .euiSelectableTemplateSitewide__listItem:hover:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMetasList {\\n  display: block;\\n  margin-top: 4px;\\n  font-size: 12px;\\n  color: #69707D;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta:not(:last-of-type)::after {\\n  content: \\\"•\\\";\\n  margin: 0 4px;\\n  color: #69707D;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--application {\\n  color: #4a7194;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--deployment {\\n  color: #387765;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--article {\\n  color: #7c609e;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--case {\\n  color: #aa4b38;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--platform {\\n  color: #7a6c31;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiTable {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-feature-settings: \\\"calt\\\" 1, \\\"kern\\\" 1, \\\"liga\\\" 1, \\\"tnum\\\" 1;\\n  width: 100%;\\n  table-layout: fixed;\\n  border: none;\\n  border-collapse: collapse;\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiTable.euiTable--auto {\\n  table-layout: auto;\\n}\\nhtml.light-theme .euiTableCaption {\\n  position: relative;\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  html.light-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  html.light-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  html.light-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\nhtml.light-theme .euiTableFooterCell,\\nhtml.light-theme .euiTableHeaderCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  font-weight: 500;\\n  border: none;\\n}\\nhtml.light-theme .euiTableFooterCell .euiTableHeaderButton,\\nhtml.light-theme .euiTableHeaderCell .euiTableHeaderButton {\\n  text-align: left;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiTableFooterCell .euiTableCellContent__text,\\nhtml.light-theme .euiTableHeaderCell .euiTableCellContent__text {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 600;\\n}\\nhtml.light-theme .euiTableHeaderButton {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  color: inherit;\\n  width: 100%;\\n}\\nhtml.light-theme .euiTableHeaderButton:hover .euiTableCellContent__text, html.light-theme .euiTableHeaderButton:focus .euiTableCellContent__text {\\n  text-decoration: underline;\\n  color: #07C;\\n}\\nhtml.light-theme .euiTableHeaderButton:hover .euiTableSortIcon, html.light-theme .euiTableHeaderButton:focus .euiTableSortIcon {\\n  fill: #07C;\\n}\\nhtml.light-theme .euiTableSortIcon {\\n  margin-left: 4px;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .euiTableHeaderButton-isSorted .euiTableSortIcon {\\n  fill: #1a1c21;\\n}\\nhtml.light-theme .euiTableHeaderCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n  border: none;\\n}\\nhtml.light-theme .euiTableRow:hover {\\n  background-color: #fafbfd;\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isClickable:hover {\\n  background-color: rgba(0, 119, 204, 0.05);\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isClickable:focus {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isExpandedRow {\\n  background-color: #fafbfd;\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isExpandedRow.euiTableRow-isSelectable .euiTableCellContent {\\n  padding-left: 40px;\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isSelected {\\n  background-color: rgba(227, 240, 249, 0.37);\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(227, 240, 249, 0.37);\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isSelected:hover, html.light-theme .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiTableRowCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  color: #343741;\\n}\\nhtml.light-theme .euiTableRowCell--top {\\n  vertical-align: top;\\n}\\nhtml.light-theme .euiTableRowCell--bottom {\\n  vertical-align: bottom;\\n}\\nhtml.light-theme .euiTableRowCell--baseline {\\n  vertical-align: baseline;\\n}\\nhtml.light-theme .euiTableRowCell.euiTableRowCell--isMobileHeader {\\n  display: none;\\n}\\nhtml.light-theme .euiTableRowCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n}\\nhtml.light-theme .euiTableFooterCell {\\n  background-color: #F5F7FA;\\n}\\nhtml.light-theme .euiTableCellContent {\\n  overflow: hidden;\\n  /* 4 */\\n  display: flex;\\n  align-items: center;\\n  /* 1 */\\n  padding: 8px;\\n  /* 2 */\\n}\\nhtml.light-theme .euiTableCellContent__text {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 4 */\\n  min-width: 0;\\n  text-overflow: ellipsis;\\n}\\nhtml.light-theme .euiTableCellContent--alignRight {\\n  justify-content: flex-end;\\n  text-align: right;\\n}\\nhtml.light-theme .euiTableCellContent--alignCenter {\\n  justify-content: center;\\n  text-align: center;\\n}\\nhtml.light-theme .euiTableHeaderCell,\\nhtml.light-theme .euiTableFooterCell,\\nhtml.light-theme .euiTableCellContent--truncateText {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .euiTableHeaderCell .euiTableCellContent__text,\\nhtml.light-theme .euiTableFooterCell .euiTableCellContent__text,\\nhtml.light-theme .euiTableCellContent--truncateText .euiTableCellContent__text {\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiTableCellContent--overflowingContent {\\n  overflow: visible;\\n  white-space: normal;\\n  word-break: break-word;\\n}\\nhtml.light-theme .euiTableCellContent--showOnHover > *:not(:first-child) {\\n  margin-left: 8px;\\n}\\nhtml.light-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n  flex-shrink: 0;\\n  opacity: 0.7;\\n  filter: grayscale(100%);\\n  transition: opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1), filter 250ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.light-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n  filter: grayscale(0%);\\n  opacity: 0;\\n}\\nhtml.light-theme .euiTableRow-hasActions:hover .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem,\\nhtml.light-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover:focus-within .euiTableCellContent__hoverItem {\\n  opacity: 1;\\n  filter: grayscale(0%);\\n}\\nhtml.light-theme .euiTableRow-isExpandedRow .euiTableCellContent {\\n  -webkit-animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n  animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n}\\n@-webkit-keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\n@keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\nhtml.light-theme .euiTableRowCell__mobileHeader {\\n  display: none;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  html.light-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  html.light-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  html.light-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #69707D;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n  html.light-theme .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #D3DAE6;\\n    box-shadow: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #fafbfd;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #feedf5;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #e6f1fa;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #e6f9f7;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #fff9e8;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #f8e9e9;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    background-color: #FFF;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(152, 162, 179, 0.1);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\nhtml.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(227, 240, 249, 0.37);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #69707D;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n  html.light-theme .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #D3DAE6;\\n    box-shadow: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #fafbfd;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #feedf5;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #e6f1fa;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #e6f9f7;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #fff9e8;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #f8e9e9;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    background-color: #FFF;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(152, 162, 179, 0.1);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\nhtml.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(227, 240, 249, 0.37);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\nhtml.light-theme .euiTableHeaderMobile,\\nhtml.light-theme .euiTableHeaderCell--hideForDesktop {\\n  display: none;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n  html.light-theme .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n  html.light-theme .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\nhtml.light-theme .euiComboBox--appended .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 6px;\\n  border-bottom-left-radius: 6px;\\n}\\nhtml.light-theme .euiComboBox--appended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n}\\nhtml.light-theme .euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 6px;\\n  border-bottom-right-radius: 6px;\\n}\\nhtml.light-theme .euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 4px;\\n  border-bottom-right-radius: 4px;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeLarge .euiDataGridRowCell {\\n  font-size: 16px;\\n  font-size: 1.1428571429rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.light-theme .euiFormControlLayout--group {\\n  border-radius: 6px;\\n  background-color: #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend:first-child {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append:last-child {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group [class*=euiButton]:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: -2px;\\n}\\nhtml.light-theme .euiFormControlLayout--group [class*=euiButton]:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFormControlLayout--group [class*=euiButton]:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor:last-child [class*=euiButton],\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSuperSelectControl,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 6px 0 0 6px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSuperSelectControl,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  border-radius: 4px;\\n  background-color: #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed.euiFormControlLayout--readOnly input {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 4px 0 0 4px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child [class*=euiButton],\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited {\\n  border-radius: 6px;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 6px 0 0 6px;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 6px;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 4px 0 0 4px;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 4px;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 4px 4px 0;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus:focus-visible + .euiRadio__circle {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus:not(:focus-visible) + .euiRadio__circle {\\n  outline: none;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus:focus-visible + .euiCheckbox__square {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus:not(:focus-visible) + .euiCheckbox__square {\\n  outline: none;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: none;\\n}\\nhtml.light-theme .euiHue {\\n  position: relative;\\n  height: 12px;\\n  border-radius: 12px;\\n  margin: 8px 0;\\n}\\nhtml.light-theme .euiHue::before, html.light-theme .euiHue::after {\\n  display: none;\\n}\\nhtml.light-theme .euiHue__range {\\n  top: -6px;\\n}\\nhtml.light-theme .euiHue__range::-webkit-slider-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.light-theme .euiHue__range::-moz-range-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.light-theme .euiHue__range::-ms-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.light-theme .euiHue__range:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\nhtml.light-theme .euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\nhtml.light-theme .euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\nhtml.light-theme .euiHue__range:focus:not(:focus-visible)::-webkit-slider-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.light-theme .euiHue__range:focus:not(:focus-visible)::-moz-range-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.light-theme .euiHue__range:focus:not(:focus-visible)::-ms-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.light-theme .euiHue__range:focus:focus-visible {\\n  outline: none;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar {\\n  border-radius: 6px 6px 0 0;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea:focus:focus-visible {\\n  outline-style: none;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview,\\nhtml.light-theme .euiMarkdownEditorFooter {\\n  border-radius: 0 0 6px 6px;\\n}\\nhtml.light-theme *, html.light-theme *::before, html.light-theme *::after {\\n  box-sizing: border-box;\\n}\\nhtml.light-theme html, html.light-theme body, html.light-theme div, html.light-theme span, html.light-theme applet, html.light-theme object, html.light-theme iframe,\\nhtml.light-theme h1, html.light-theme h2, html.light-theme h3, html.light-theme h4, html.light-theme h5, html.light-theme h6, html.light-theme p, html.light-theme blockquote, html.light-theme pre,\\nhtml.light-theme a, html.light-theme abbr, html.light-theme acronym, html.light-theme address, html.light-theme big, html.light-theme cite, html.light-theme code,\\nhtml.light-theme del, html.light-theme dfn, html.light-theme em, html.light-theme img, html.light-theme ins, html.light-theme kbd, html.light-theme q, html.light-theme s, html.light-theme samp,\\nhtml.light-theme small, html.light-theme strike, html.light-theme strong, html.light-theme sub, html.light-theme sup, html.light-theme tt, html.light-theme var,\\nhtml.light-theme b, html.light-theme u, html.light-theme i, html.light-theme center,\\nhtml.light-theme dl, html.light-theme dt, html.light-theme dd, html.light-theme ol, html.light-theme ul, html.light-theme li,\\nhtml.light-theme fieldset, html.light-theme form, html.light-theme label, html.light-theme legend,\\nhtml.light-theme table, html.light-theme caption, html.light-theme tbody, html.light-theme tfoot, html.light-theme thead, html.light-theme tr, html.light-theme th, html.light-theme td,\\nhtml.light-theme article, html.light-theme aside, html.light-theme canvas, html.light-theme details, html.light-theme embed,\\nhtml.light-theme figure, html.light-theme figcaption, html.light-theme footer, html.light-theme header, html.light-theme hgroup,\\nhtml.light-theme menu, html.light-theme nav, html.light-theme output, html.light-theme ruby, html.light-theme section, html.light-theme summary,\\nhtml.light-theme time, html.light-theme mark, html.light-theme audio, html.light-theme video {\\n  margin: 0;\\n  padding: 0;\\n  border: none;\\n  vertical-align: baseline;\\n}\\nhtml.light-theme code, html.light-theme pre, html.light-theme kbd, html.light-theme samp {\\n  font-family: \\\"Roboto Mono\\\", Menlo, Courier, monospace;\\n}\\nhtml.light-theme h1, html.light-theme h2, html.light-theme h3, html.light-theme h4, html.light-theme h5, html.light-theme h6, html.light-theme p {\\n  font-family: inherit;\\n  font-weight: inherit;\\n  font-size: inherit;\\n}\\nhtml.light-theme input, html.light-theme textarea, html.light-theme select, html.light-theme button {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n}\\nhtml.light-theme em {\\n  font-style: italic;\\n}\\nhtml.light-theme strong {\\n  font-weight: 700;\\n}\\nhtml.light-theme article, html.light-theme aside, html.light-theme details, html.light-theme figcaption, html.light-theme figure,\\nhtml.light-theme footer, html.light-theme header, html.light-theme hgroup, html.light-theme menu, html.light-theme nav, html.light-theme section {\\n  display: block;\\n}\\nhtml.light-theme html {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  height: 100%;\\n  background-color: #fafbfd;\\n}\\nhtml.light-theme body {\\n  line-height: 1;\\n}\\nhtml.light-theme *:focus {\\n  outline: none;\\n}\\nhtml.light-theme *:focus::-moz-focus-inner {\\n  border: none;\\n}\\nhtml.light-theme *:focus:-moz-focusring {\\n  outline: none;\\n}\\nhtml.light-theme a {\\n  text-decoration: none;\\n  color: #07C;\\n}\\nhtml.light-theme a:hover {\\n  text-decoration: none;\\n}\\nhtml.light-theme a:focus {\\n  text-decoration: none;\\n  outline: none;\\n}\\nhtml.light-theme a:hover, html.light-theme button, html.light-theme [role=button] {\\n  cursor: pointer;\\n}\\nhtml.light-theme input {\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.light-theme input:disabled {\\n  opacity: 1;\\n  /* required on iOS */\\n}\\nhtml.light-theme button {\\n  background: none;\\n  border: none;\\n  padding: 0;\\n  margin: 0;\\n  outline: none;\\n  font-size: inherit;\\n  color: inherit;\\n  border-radius: 0;\\n}\\nhtml.light-theme button:hover {\\n  cursor: pointer;\\n}\\nhtml.light-theme ol, html.light-theme ul {\\n  list-style: none;\\n}\\nhtml.light-theme blockquote, html.light-theme q {\\n  quotes: none;\\n}\\nhtml.light-theme blockquote::before, html.light-theme blockquote::after,\\nhtml.light-theme q::before, html.light-theme q::after {\\n  content: \\\"\\\";\\n  content: none;\\n}\\nhtml.light-theme table {\\n  border-collapse: collapse;\\n  border-spacing: 0;\\n}\\nhtml.light-theme hr {\\n  margin: 0;\\n}\\nhtml.light-theme fieldset {\\n  min-inline-size: auto;\\n}\\nhtml.light-theme svg text {\\n  letter-spacing: normal !important;\\n}\\nhtml.light-theme html {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #f3f3f5;\\n}\\nhtml.light-theme html::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme html::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 4px solid #f3f3f5;\\n}\\nhtml.light-theme html::-webkit-scrollbar-corner, html.light-theme html::-webkit-scrollbar-track {\\n  background-color: #f3f3f5;\\n}\\nhtml.light-theme svg text {\\n  letter-spacing: normal !important;\\n}\\nhtml.light-theme html,\\nhtml.light-theme body {\\n  font-family: Inter, BlinkMacSystemFont, Helvetica, Arial, sans-serif !important;\\n}\\nhtml.light-theme .echChartStatus {\\n  visibility: hidden;\\n  pointer-events: none;\\n  z-index: -100000;\\n  width: 0;\\n  height: 0;\\n  position: absolute;\\n}\\nhtml.light-theme .echChartBackground {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n}\\nhtml.light-theme .echChart {\\n  height: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .echChart__titles {\\n  margin-right: 24px;\\n}\\nhtml.light-theme .echChartContent {\\n  position: relative;\\n  display: flex;\\n  flex-direction: row;\\n  flex-grow: 1;\\n  height: 1px;\\n  width: 100%;\\n}\\nhtml.light-theme .echChartContent--column {\\n  flex-direction: column;\\n}\\nhtml.light-theme .echChartTitle {\\n  font-style: normal;\\n  font-weight: bold;\\n  font-size: 16px;\\n  line-height: 19px;\\n  padding: 8px;\\n  white-space: nowrap;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .echChartTitle + .echChartDescription {\\n  padding-top: 0;\\n}\\nhtml.light-theme .echChartDescription {\\n  padding: 8px;\\n  font-style: normal;\\n  font-weight: normal;\\n  font-size: 14px;\\n  line-height: 17px;\\n  white-space: nowrap;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .echContainer {\\n  flex: 1;\\n  position: relative;\\n  overflow: hidden;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.light-theme .echChartPointerContainer {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  right: 0;\\n  left: 0;\\n  box-sizing: border-box;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n}\\nhtml.light-theme .echChartResizer {\\n  z-index: -10000000;\\n  position: absolute;\\n  bottom: 0;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  box-sizing: border-box;\\n}\\nhtml.light-theme .echBrushTool {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  margin: 0;\\n  padding: 0;\\n  box-sizing: border-box;\\n  overflow: hidden;\\n  pointer-events: none;\\n}\\nhtml.light-theme .echTooltip {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  border-radius: 6px;\\n  background-color: #404040;\\n  color: #FFF;\\n  z-index: 9000;\\n  max-width: 256px;\\n  overflow-wrap: break-word;\\n  padding: 8px;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding: 0;\\n  max-width: 100%;\\n  pointer-events: none;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  background-color: #FFF;\\n  color: #343741;\\n  overflow: hidden;\\n  cursor: default;\\n  transition: box-shadow 400ms, opacity 250ms;\\n  border: 1px solid #FFF;\\n}\\nhtml.light-theme .echTooltip .euiHorizontalRule {\\n  background-color: #595959;\\n}\\nhtml.light-theme .echTooltip__outerWrapper {\\n  display: flex;\\n}\\nhtml.light-theme .echTooltip--pinned {\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n  pointer-events: auto;\\n  -webkit-user-select: auto;\\n     -moz-user-select: auto;\\n      -ms-user-select: auto;\\n          user-select: auto;\\n}\\nhtml.light-theme .echTooltip--pinned .echTooltip__tableRow--selectable {\\n  cursor: pointer;\\n}\\nhtml.light-theme .echTooltip--pinned .echTooltipActions {\\n  pointer-events: auto;\\n}\\nhtml.light-theme .echTooltip--pinned .echTooltip__tableWrapper {\\n  pointer-events: auto;\\n}\\nhtml.light-theme .echTooltip .echTooltip__tableCell--truncate {\\n  text-overflow: ellipsis;\\n  display: -webkit-box;\\n  -webkit-line-clamp: 2;\\n  /* number of lines to show */\\n  line-clamp: 2;\\n  -webkit-box-orient: vertical;\\n  overflow: hidden;\\n}\\nhtml.light-theme .echTooltip__metricRow {\\n  padding: 4px 8px;\\n  display: flex;\\n  justify-content: space-between;\\n}\\nhtml.light-theme .echTooltip__tableWrapper {\\n  overflow: hidden;\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background-color: #FFF;\\n}\\nhtml.light-theme .echTooltip__tableWrapper::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .echTooltip__tableWrapper::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .echTooltip__tableWrapper::-webkit-scrollbar-corner, html.light-theme .echTooltip__tableWrapper::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .echTooltip__tableWrapper--pinned {\\n  overflow: auto;\\n}\\nhtml.light-theme .echTooltip__table {\\n  display: grid;\\n  width: 100%;\\n}\\nhtml.light-theme .echTooltip__table--noGrid {\\n  display: table;\\n}\\nhtml.light-theme .echTooltip__tableHeader .echTooltip__tableCell, html.light-theme .echTooltip__tableFooter .echTooltip__tableCell {\\n  cursor: default;\\n  font-weight: 600;\\n  background-color: #FFF;\\n  position: sticky;\\n  z-index: 1;\\n}\\nhtml.light-theme .echTooltip__tableHeader, html.light-theme .echTooltip__tableBody, html.light-theme .echTooltip__tableFooter, html.light-theme .echTooltip__tableRow {\\n  display: contents;\\n}\\nhtml.light-theme .echTooltip__tableHeader {\\n  margin-bottom: 0;\\n  top: 0;\\n}\\nhtml.light-theme .echTooltip__tableHeader .echTooltip__tableCell {\\n  border-bottom: solid 1px #D3DAE6;\\n  top: 0;\\n}\\nhtml.light-theme .echTooltip__tableFooter {\\n  margin-top: 0;\\n  bottom: 0;\\n}\\nhtml.light-theme .echTooltip__tableFooter .echTooltip__tableCell {\\n  border-top: solid 1px #D3DAE6;\\n  bottom: 0;\\n}\\nhtml.light-theme .echTooltip__tableCell:not(.echTooltip__colorCell) {\\n  padding: 4px;\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableCell:not(.echTooltip__colorCell) {\\n  padding: 2px 4px;\\n  transition: margin 200ms, padding 200ms;\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__colorCell + .echTooltip__tableCell {\\n  margin-left: 10px;\\n  padding-left: 10px;\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected:hover .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected:hover .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selectable:hover .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selectable:hover .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(0, 119, 204, 0.05);\\n}\\nhtml.light-theme .echTooltip__tableRow {\\n  position: relative;\\n}\\nhtml.light-theme .echTooltip__tableRow--highlighted .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.light-theme .echTooltip__tableRow--highlighted .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(211, 218, 230, 0.5);\\n}\\nhtml.light-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip {\\n  width: 21px;\\n}\\nhtml.light-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip--spacer {\\n  width: 0;\\n  min-width: 0;\\n}\\nhtml.light-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip--icon {\\n  opacity: 1;\\n}\\nhtml.light-theme .echTooltip__colorCell {\\n  padding: 0;\\n  height: 100%;\\n  position: relative;\\n  overflow: hidden;\\n  width: 21px;\\n}\\nhtml.light-theme .echTooltip__colorCell--static {\\n  width: 5px;\\n}\\nhtml.light-theme .echTooltip__colorStrip, html.light-theme .echTooltip__colorStrip--bg, html.light-theme .echTooltip__colorStrip--spacer {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  bottom: 0;\\n  width: 5px;\\n  transition: width 200ms;\\n}\\nhtml.light-theme .echTooltip__colorStrip--icon {\\n  opacity: 0;\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  height: 100%;\\n  transition: opacity 200ms;\\n  padding: 0 4px;\\n}\\nhtml.light-theme .echTooltip__colorStrip--spacer {\\n  left: auto;\\n  right: 10px;\\n  width: 6px;\\n  min-width: 6px;\\n}\\nhtml.light-theme .echTooltip__label {\\n  min-width: 1px;\\n  flex: 1 1 auto;\\n  text-align: left;\\n}\\nhtml.light-theme .echTooltip__value {\\n  text-align: right;\\n  font-feature-settings: \\\"tnum\\\";\\n}\\nhtml.light-theme .echTooltip[dir=rtl] .echTooltip__colorStrip {\\n  left: auto;\\n  right: 0;\\n}\\nhtml.light-theme .echTooltipHeader {\\n  font-weight: 600;\\n  margin-bottom: 0;\\n  padding: 4px 8px;\\n}\\nhtml.light-theme .echTooltipFooter {\\n  font-weight: 600;\\n  margin-top: 0;\\n  padding: 4px 8px;\\n}\\nhtml.light-theme .echTooltipDivider {\\n  width: 100%;\\n  border-bottom: solid 1px #D3DAE6;\\n}\\n@-webkit-keyframes promptSlideDown {\\n  100% {\\n    opacity: 1;\\n    top: 0;\\n    height: 26px;\\n  }\\n}\\n@keyframes promptSlideDown {\\n  100% {\\n    opacity: 1;\\n    top: 0;\\n    height: 26px;\\n  }\\n}\\nhtml.light-theme .echTooltipPrompt {\\n  position: relative;\\n  width: 100%;\\n  z-index: -1;\\n}\\nhtml.light-theme .echTooltipPrompt__content {\\n  color: #69707D;\\n  font-style: normal;\\n  font-size: 12px;\\n  line-height: 26px;\\n  padding: 0 8px;\\n}\\nhtml.light-theme .echTooltipPrompt.slideDown {\\n  opacity: 0;\\n  top: -26px;\\n  height: 0;\\n  -webkit-animation: promptSlideDown 0.25s forwards;\\n          animation: promptSlideDown 0.25s forwards;\\n  -webkit-animation-delay: 1.5s;\\n          animation-delay: 1.5s;\\n}\\nhtml.light-theme .echTooltipActions {\\n  position: relative;\\n  display: flex;\\n  align-items: flex-start;\\n  flex-direction: column;\\n  width: 100%;\\n  font-style: normal;\\n  font-size: 12px;\\n  line-height: 21px;\\n}\\nhtml.light-theme .echTooltipActions__prompt {\\n  position: relative;\\n  height: 26px;\\n  padding: 0 8px;\\n  line-height: 26px;\\n  width: 100%;\\n  color: #69707D;\\n  font-style: normal;\\n  font-size: 12px;\\n}\\nhtml.light-theme .echTooltipActions__action {\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n  display: block;\\n  text-align: left;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 21px;\\n  cursor: pointer;\\n  color: #343741;\\n}\\nhtml.light-theme .echTooltipActions__action:nth-child(2) {\\n  padding-top: 4px;\\n}\\nhtml.light-theme .echTooltipActions__action:last-child {\\n  padding-bottom: 2px;\\n}\\nhtml.light-theme .echTooltipActions__action:hover, html.light-theme .echTooltipActions__action:focus {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .echTooltipActions__action[disabled] {\\n  cursor: default;\\n  color: #ABB4C4;\\n}\\nhtml.light-theme .echTooltipActions__action[disabled]:hover, html.light-theme .echTooltipActions__action[disabled]:focus {\\n  text-decoration: none;\\n}\\nhtml.light-theme [id^=echTooltipPortal] {\\n  pointer-events: none;\\n}\\nhtml.light-theme [id^=echAnchor] {\\n  position: absolute;\\n  pointer-events: none;\\n}\\nhtml.light-theme .echTooltipPortal__invisible {\\n  position: fixed;\\n  visibility: hidden;\\n  width: 0;\\n  height: 0;\\n}\\nhtml.light-theme .echIcon {\\n  flex-shrink: 0;\\n  display: inline-block;\\n  vertical-align: middle;\\n  fill: currentColor;\\n}\\nhtml.light-theme .echIcon svg {\\n  transform: translate(0, 0);\\n}\\nhtml.light-theme .echIcon:focus {\\n  opacity: 1;\\n  background: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .echLegend .echLegendList {\\n  display: grid;\\n  grid-template-columns: minmax(0, 1fr);\\n  -webkit-padding-start: 0;\\n          padding-inline-start: 0;\\n  -webkit-padding-end: 0;\\n          padding-inline-end: 0;\\n  -webkit-margin-before: 0;\\n          margin-block-start: 0;\\n  -webkit-margin-after: 0;\\n          margin-block-end: 0;\\n}\\nhtml.light-theme .echLegend--horizontal .echLegendList {\\n  grid-column-gap: 24px;\\n  grid-row-gap: 8px;\\n  margin-top: 8px;\\n  margin-bottom: 8px;\\n}\\nhtml.light-theme .echLegend--top, html.light-theme .echLegend--left {\\n  order: 0;\\n}\\nhtml.light-theme .echLegend--bottom, html.light-theme .echLegend--right {\\n  order: 1;\\n}\\nhtml.light-theme .echLegend--debug {\\n  background: rgba(238, 130, 238, 0.2);\\n  position: relative;\\n}\\nhtml.light-theme .echLegend--inert {\\n  pointer-events: none;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n          mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  width: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer::-webkit-scrollbar-corner, html.light-theme .echLegend .echLegendListContainer::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .echLegend .echLegendListContainer[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .echLegend .echLegendListContainer :focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 1px;\\n  background-color: rgba(0, 119, 204, 0.1);\\n  border-radius: 3px;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer :focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer :focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .echLegendItem {\\n  color: #343741;\\n  display: flex;\\n  flex-wrap: nowrap;\\n  justify-content: space-between;\\n  align-items: flex-start;\\n  position: relative;\\n}\\nhtml.light-theme .echLegendItem .colorWrapper > *:first-of-type {\\n  height: 18px;\\n}\\nhtml.light-theme .echLegendItem:not([dir=rtl]) > *:not(.background) {\\n  margin-left: 4px;\\n}\\nhtml.light-theme .echLegendItem:not([dir=rtl]) > *:not(.background):last-child:not(.echLegendItem__extra) {\\n  margin-right: 4px;\\n}\\nhtml.light-theme .echLegendItem[dir=rtl] > *:not(.background) {\\n  margin-right: 4px;\\n}\\nhtml.light-theme .echLegendItem[dir=rtl] > *:not(.background):last-child:not(.echLegendItem__extra) {\\n  margin-left: 4px;\\n}\\nhtml.light-theme .echLegendItem:not(html.light-theme .echLegendItem--hidden) .echLegendItem__color--changable {\\n  cursor: pointer;\\n}\\nhtml.light-theme .echLegendItem:hover .background {\\n  background-color: #F5F7FA;\\n}\\nhtml.light-theme .echLegendItem .background {\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  z-index: -1;\\n}\\nhtml.light-theme .echLegendItem__action {\\n  cursor: pointer;\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  height: 18px;\\n  max-width: calc(18px + 8px);\\n}\\nhtml.light-theme .echLegendItem__action .euiPopover,\\nhtml.light-theme .echLegendItem__action .euiPopover__anchor,\\nhtml.light-theme .echLegendItem__action .euiPopover__anchor > *:first-child {\\n  height: 100%;\\n  width: 100%;\\n  display: flex;\\n}\\nhtml.light-theme .echLegendItem__color {\\n  display: flex;\\n  line-height: 1.5;\\n  align-items: center;\\n}\\nhtml.light-theme .echLegendItem__label {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  flex: 1 1 auto;\\n  text-align: left;\\n  vertical-align: baseline;\\n  letter-spacing: unset;\\n  align-items: center;\\n  overflow-wrap: break-word;\\n  word-wrap: break-word;\\n  word-break: break-all;\\n  word-break: break-word;\\n  -webkit-hyphens: auto;\\n      -ms-hyphens: auto;\\n          hyphens: auto;\\n  overflow: hidden;\\n  min-width: 1px;\\n}\\nhtml.light-theme .echLegendItem__label--singleline {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .echLegendItem__label--multiline:is(div) {\\n  display: -webkit-box;\\n  -webkit-box-orient: vertical;\\n  -webkit-line-clamp: 2;\\n}\\nhtml.light-theme .echLegendItem__label--clickable:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.light-theme .echLegendItem__extra {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  text-align: right;\\n  flex: 0 0 auto;\\n  margin-left: 4px;\\n  font-feature-settings: \\\"tnum\\\";\\n  letter-spacing: unset;\\n  direction: ltr;\\n}\\nhtml.light-theme .echLegendItem--vertical {\\n  padding-top: 2px;\\n  padding-bottom: 2px;\\n}\\nhtml.light-theme .echLegendItem--vertical:first-of-type {\\n  margin-top: 2px;\\n}\\nhtml.light-theme .echLegendItem--vertical .background {\\n  margin-top: 2px;\\n  margin-bottom: 2px;\\n}\\nhtml.light-theme .echLegendItem--hidden {\\n  color: #69707D;\\n}\\nhtml.light-theme .echLegendItem[dir=rtl] .echLegendItem__label {\\n  text-align: right;\\n}\\nhtml.light-theme .echReactiveChart_noResults {\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  width: 100%;\\n  height: 100%;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  color: #69707D;\\n}\\nhtml.light-theme .echGridContainer {\\n  display: grid;\\n  width: 100%;\\n  height: 100%;\\n  align-content: start;\\n  justify-content: stretch;\\n  align-items: stretch;\\n  -webkit-user-select: text;\\n     -moz-user-select: text;\\n      -ms-user-select: text;\\n          user-select: text;\\n}\\nhtml.light-theme .echGridCell {\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n  overflow: hidden;\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.light-theme .echGridCell--rightBorder {\\n  border-right: 1px solid #343741;\\n}\\nhtml.light-theme .echGridCell--bottomBorder {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.light-theme .echAlignedGrid {\\n  display: grid;\\n  align-content: stretch;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.light-theme .echAlignedGrid--header {\\n  width: 100%;\\n  height: 100%;\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.light-theme .echAlignedGrid__borderRight {\\n  border-right: 1px solid #edf0f5;\\n}\\nhtml.light-theme .echAlignedGrid__borderBottom {\\n  border-bottom: 1px solid #edf0f5;\\n}\\nhtml.light-theme .echAlignedGrid--content {\\n  width: 100%;\\n  min-height: 0;\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.light-theme .echHighlighter {\\n  position: absolute;\\n  pointer-events: none;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.light-theme .echHighlighterOverlay__fill {\\n  fill: rgba(255, 255, 255, 0.2);\\n}\\nhtml.light-theme .echHighlighterOverlay__stroke {\\n  stroke: rgba(255, 255, 255, 0.2);\\n}\\nhtml.light-theme .echHighlighter__mask {\\n  fill: rgba(255, 255, 255, 0.5);\\n}\\nhtml.light-theme .echCrosshair,\\nhtml.light-theme .echCrosshair__cursor,\\nhtml.light-theme .echCrosshair__crossLine {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  pointer-events: none;\\n}\\nhtml.light-theme .echScreenReaderOnly {\\n  position: absolute;\\n  left: -10000px;\\n  top: auto;\\n  width: 1px;\\n  height: 1px;\\n  overflow: hidden;\\n}\\nhtml.light-theme .echScreenReaderOnlyDebug {\\n  left: 0 !important;\\n  top: 0 !important;\\n  right: 0 !important;\\n  bottom: 0 !important;\\n  width: 100% !important;\\n  height: 100% !important;\\n  overflow: auto !important;\\n  background: rgba(255, 255, 255, 0.8);\\n}\\nhtml.light-theme .echScreenReaderOnlyDebug table,\\nhtml.light-theme .echScreenReaderOnlyDebug td,\\nhtml.light-theme .echScreenReaderOnlyDebug th {\\n  border: 1px solid black;\\n  font-size: 12px;\\n}\\nhtml.light-theme .echScreenReaderTable {\\n  overflow-x: auto;\\n  text-align: left;\\n}\\nhtml.light-theme .echAnnotation {\\n  padding: 0;\\n  transition: opacity 250ms;\\n  pointer-events: none;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  max-width: 260px;\\n}\\nhtml.light-theme .echAnnotation__marker {\\n  position: absolute;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  font-size: 12px;\\n  font-weight: 700;\\n  line-height: normal;\\n}\\nhtml.light-theme .echAnnotation__details {\\n  padding: 4px 8px;\\n}\\nhtml.light-theme .echAnnotation__icon {\\n  position: relative;\\n}\\nhtml.light-theme .echAnnotation__body {\\n  white-space: nowrap;\\n}\\nhtml.light-theme .echCanvasRenderer {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  padding: 0;\\n  margin: 0;\\n  border: 0;\\n  background: transparent;\\n}\\nhtml.light-theme .echMetricContainer {\\n  display: grid;\\n  width: 100%;\\n  height: 100%;\\n  align-content: start;\\n  justify-content: stretch;\\n  align-items: stretch;\\n  -webkit-user-select: text;\\n     -moz-user-select: text;\\n      -ms-user-select: text;\\n          user-select: text;\\n}\\nhtml.light-theme .echMetric {\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n  overflow: hidden;\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.light-theme .echMetric .echMetric--outline {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  pointer-events: none;\\n}\\nhtml.light-theme .echMetric:focus-within .echMetric--outline {\\n  outline: auto;\\n  outline-offset: -1.5px;\\n}\\nhtml.light-theme .echMetric:focus-within button {\\n  outline: none;\\n}\\nhtml.light-theme .echMetric--rightBorder {\\n  border-right: 1px solid #343741;\\n}\\nhtml.light-theme .echMetric--topBorder {\\n  border-top: 1px solid #343741;\\n}\\nhtml.light-theme .echMetric--bottomBorder {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.light-theme .echMetric--vertical.echMetric--withProgressBar--small {\\n  padding-left: 10px;\\n}\\nhtml.light-theme .echMetric--vertical.echMetric--withTargetProgressBar--small {\\n  padding-left: 14px;\\n}\\nhtml.light-theme .echMetric--horizontal.echMetric--withProgressBar--small {\\n  padding-bottom: 10px;\\n}\\nhtml.light-theme .echMetric--horizontal.echMetric--withTargetProgressBar--small {\\n  padding-bottom: 12px;\\n}\\nhtml.light-theme .echMetricEmpty {\\n  position: absolute;\\n  bottom: 9px;\\n  right: 11px;\\n  width: 20px;\\n  border-bottom: 1px solid;\\n}\\nhtml.light-theme .echMetricText {\\n  position: relative;\\n  padding: 8px;\\n  height: 100%;\\n  z-index: 1;\\n  display: grid;\\n  grid-template-columns: 100%;\\n  grid-template-rows: -webkit-min-content -webkit-min-content auto -webkit-min-content -webkit-min-content;\\n  grid-template-rows: min-content min-content auto min-content min-content;\\n  text-align: left;\\n  line-height: 1.2;\\n}\\nhtml.light-theme .echMetricText__title {\\n  font-weight: bold;\\n  word-wrap: break-word;\\n}\\nhtml.light-theme .echMetricText__title button {\\n  font-weight: bold;\\n  width: 100%;\\n  text-align: left;\\n}\\nhtml.light-theme .echMetricText__icon {\\n  position: absolute;\\n  right: 8px;\\n  top: 8px;\\n}\\nhtml.light-theme .echMetricText__subtitle {\\n  padding-top: 5px;\\n  font-weight: normal;\\n  text-align: left;\\n}\\nhtml.light-theme .echMetricText__extra {\\n  text-align: right;\\n  font-weight: normal;\\n}\\nhtml.light-theme .echMetricText__value {\\n  position: relative;\\n  font-weight: bold;\\n  text-align: right;\\n  white-space: nowrap;\\n  overflow: hidden;\\n}\\nhtml.light-theme .echMetricText__valueIcon {\\n  display: inline-block;\\n  position: absolute;\\n  right: 8px;\\n  bottom: 8px;\\n}\\nhtml.light-theme .echMetricText__part {\\n  font-weight: bold;\\n}\\nhtml.light-theme .echMetricText__gap {\\n  position: relative;\\n}\\nhtml.light-theme .echMetricText__body {\\n  overflow: hidden;\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n}\\nhtml.light-theme .echSingleMetricProgress {\\n  position: absolute;\\n}\\nhtml.light-theme .echSingleMetricProgress--vertical {\\n  left: 0;\\n  right: 0;\\n  top: 0;\\n  bottom: 0;\\n  height: 100%;\\n  width: 100%;\\n}\\nhtml.light-theme .echSingleMetricProgress--vertical.echSingleMetricProgress--small {\\n  right: auto;\\n  width: 10px;\\n}\\nhtml.light-theme .echSingleMetricProgress--horizontal {\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  top: 0;\\n  bottom: 0;\\n  height: 100%;\\n}\\nhtml.light-theme .echSingleMetricProgress--horizontal.echSingleMetricProgress--small {\\n  top: auto;\\n  height: 10px;\\n}\\nhtml.light-theme .echSingleMetricProgressBar {\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.light-theme .echSingleMetricProgressBar--vertical {\\n  position: absolute;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  width: 100%;\\n}\\nhtml.light-theme .echSingleMetricProgressBar--horizontal {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  height: 100%;\\n}\\nhtml.light-theme .echSingleMetricTarget {\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  overflow: visible;\\n  z-index: 1;\\n}\\nhtml.light-theme .echSingleMetricTarget--vertical {\\n  transform: rotate(90deg);\\n  position: absolute;\\n  left: 100%;\\n  bottom: 0;\\n}\\nhtml.light-theme .echSingleMetricTarget--horizontal {\\n  position: absolute;\\n  bottom: 100%;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline {\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  overflow: visible;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline--vertical {\\n  position: absolute;\\n  left: 0;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline--vertical.echSingleMetricZeroBaseline--small {\\n  right: auto;\\n  height: 2px;\\n  width: 13px;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline--horizontal {\\n  position: absolute;\\n  bottom: 0;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline--horizontal.echSingleMetricZeroBaseline--small {\\n  top: auto;\\n  width: 2px;\\n  height: 13px;\\n}\\nhtml.light-theme .echSingleMetricSparkline {\\n  position: absolute;\\n  overflow: hidden;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n}\\nhtml.light-theme .echSingleMetricSparkline__svg {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.light-theme .echSingleMetricSparkline__svg rect,\\nhtml.light-theme .echSingleMetricSparkline__svg path {\\n  transition: fill ease-in-out 0.1s;\\n}\\nhtml.light-theme .echSingleMetricChart--small {\\n  position: absolute;\\n  top: auto;\\n  left: auto;\\n  bottom: 0;\\n  right: 0;\\n  width: 100px;\\n  height: 30px;\\n}\\nhtml.light-theme:not(.legacy) {\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n}\\nhtml.light-theme:not(.legacy) body,\\nhtml.light-theme:not(.legacy) .echChart {\\n  background: #FFF !important;\\n}\\nhtml.light-theme:not(.legacy) .euiText {\\n  color: #1a1c21;\\n}\\nhtml.dark-theme {\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n   * LEGEND\\n   * __day-name : Week headers like Su, Mo, etc\\n   * __day : Number on the calendar\\n   *       --highlighted\\n   *       --disabled :               _this.isDisabled(),\\n   *       --selected :               _this.isSameDay(_this.props.selected),\\n      *       --range-start :            _this.isRangeStart(),\\n      *       --range-end :              _this.isRangeEnd(),\\n   *       --keyboard-selected :      _this.isKeyboardSelected(),\\n   *       --in-range :               _this.isInRange(),\\n      *       --in-selecting-range :     _this.isInSelectingRange(),\\n      *       --selecting-range-start :  _this.isSelectingRangeStart(),\\n      *       --selecting-range-end :    _this.isSelectingRangeEnd(),\\n   *       --today :                  _this.isSameDay(now(_this.props.utcOffset)),\\n   *       --weekend :                _this.isWeekend(),\\n   *       --outside-month :          _this.isOutsideMonth()\\n   */\\n  /**\\n   * LEGEND\\n   * __time-list-item :\\n   *       --preselected : closest current time but not selected (also applied when using arrow keys to indicate focus)\\n   *       --selected\\n   *       --disabled\\n   *       --injected\\n   */\\n  /**\\n   * LEGEND\\n   * __header__dropdown : Contains the month and year, but affords for the navigational arrows\\n\\n   *   __month-dropdown-container: Contains both static/selected control and the dropdown\\n   *     __month-read-view: The static control\\n   *     __month-dropdown: The absolutely positioned list\\n   *       __month-option: Each option in the list\\n   *                       --selected_month\\n   *                       --selected\\n   *                       --preselected\\n\\n   *   __year-dropdown-container: Contains both static/selected control and the dropdown\\n   *     __year-read-view: The static control\\n   *     __year-dropdown: The absolutely positioned list\\n   *       __year-option: Each option in the list\\n   *                       --selected_year\\n   *                       --selected\\n   *                       --preselected\\n   */\\n  /**\\n   * Make the top selectors look like select inputs\\n   */\\n  /* This file is a heavy retheme of react-datepicker's Sass as of v1.4.0\\n  ** https://github.com/Hacker0x01/react-datepicker\\n  */\\n  /*\\n   * 1. Overwrites the base styling of EuiBadge, to give it a larger size and margins\\n   * that make sense in the input wrap.\\n   */\\n  /**\\n   * 1. Using specificity to override panel shadow\\n   * 2. Prevent really long input from overflowing the container.\\n   */\\n  /**\\n   * 1. Force each title to be the same height as an option, so that the virtualized scroll logic\\n   *    works.\\n   */\\n  /**\\n  * Make the arrow delimiter match the colors of `.euiDatePopoverButton-needsUpdating`\\n  */\\n  /**\\n    * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n    *    they actually click this input.\\n    */\\n  /*\\n   * 1. Fix for Safari to ensure that it renders like a normal text input\\n   *    and doesn't add extra spacing around text\\n  */\\n  /**\\n    * REMEMBER: --large modifiers must come last to override --compressed\\n    */\\n  /**\\n    * 1. Don't block the user from dropping files onto the filepicker.\\n    * 2. Ensure space for import icon, loading spinner, and clear button (only if it has files)\\n    * 4. Static height so that it doesn't shift its surrounding contents around\\n    */\\n  /**\\n    * 1. Undo the pointer-events: none applied to the enclosing prompt.\\n    */\\n  /**\\n   * 1. Ensure the descenders don't get cut off\\n   */\\n  /**\\n   * 1. Ensure the descenders don't get cut off\\n   * 2. Makes sure the height is correct when there's no selection\\n   */\\n  /**\\n   * 1. Account for inner box-shadow style border\\n   * 2. Ensure truncation works in children elements\\n   */\\n  /**\\n   * 1. Focused state overrides invalid state.\\n   * 2. Disabled state overrides pointer.\\n   */\\n  /**\\n   * 1. Coerce inline form elements to behave as block-level elements.\\n   * 2. For inline forms, we need to add margin if the label doesn't exist.\\n   */\\n  /**\\n    * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n    *    they actually click this input.\\n    */\\n  /**\\n    * 1. Prevent really long input from overflowing the container.\\n    */\\n  /**\\n   * 1. Vertically align all children.\\n   * 2. The padding on this div allows the ellipsis to show if the content is truncated. If\\n   *    the padding was on the cell, the ellipsis would be cropped.\\n   * 4. Prevent very long single words (e.g. the name of a field in a document) from overflowing\\n   *    the cell.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n   * Adapted from Eric Meyer's reset (http://meyerweb.com/eric/tools/css/reset/, v2.0 | 20110126).\\n   *\\n   */\\n  /* HTML5 display-role reset for older browsers */\\n  /* Chrome has an issue around RTL languages in SVGs when letter-spacing is negative\\n   * https://bugs.chromium.org/p/chromium/issues/detail?id=966480\\n   */\\n  /* Chrome has an issue around RTL languages in SVGs when letter-spacing is negative\\n   * https://bugs.chromium.org/p/chromium/issues/detail?id=966480\\n   */\\n  /**\\n   * Manually synced with `COLOR_STRIP_CHECK_WIDTH` const in [`tooltip_table.tsx`](packages/charts/src/components/tooltip/components/tooltip_table.tsx)\\n   */\\n}\\n@-webkit-keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@-webkit-keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@-webkit-keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(54, 162, 239, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #36A2EF;\\n  }\\n}\\n@keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(54, 162, 239, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #36A2EF;\\n  }\\n}\\n@-webkit-keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(54, 162, 239, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #36A2EF;\\n  }\\n}\\n@keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(54, 162, 239, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #36A2EF;\\n  }\\n}\\n@-webkit-keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\n@keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\nhtml.dark-theme .react-datepicker__day-names,\\nhtml.dark-theme .react-datepicker__week {\\n  white-space: nowrap;\\n  display: flex;\\n  justify-content: space-between;\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .react-datepicker__day-name,\\nhtml.dark-theme .react-datepicker__day {\\n  font-weight: 500;\\n  text-align: center;\\n  color: #DFE5EF;\\n  display: inline-block;\\n  width: 32px;\\n  line-height: 32px;\\n  border-radius: 4px;\\n  margin: 2px;\\n}\\nhtml.dark-theme .react-datepicker__day-name {\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .react-datepicker__day {\\n  cursor: pointer;\\n  transition: transform 90ms ease-in-out;\\n}\\nhtml.dark-theme .react-datepicker__day:hover {\\n  color: #36A2EF;\\n  background-color: rgba(54, 162, 239, 0.2);\\n  text-decoration: underline;\\n}\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  html.dark-theme .react-datepicker__day:hover {\\n    transform: scale(1.1);\\n  }\\n}\\nhtml.dark-theme .react-datepicker__day--today {\\n  color: #36A2EF;\\n  font-weight: 700;\\n}\\nhtml.dark-theme .react-datepicker__day--outside-month {\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .react-datepicker__day--highlighted, html.dark-theme .react-datepicker__day--highlighted:hover {\\n  color: #7DDED8;\\n  background-color: rgba(125, 222, 216, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--in-range, html.dark-theme .react-datepicker__day--in-range:hover {\\n  color: #36A2EF;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover), html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected), html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover {\\n  box-shadow: -2px 0 rgba(54, 162, 239, 0.2), 2px 0 rgba(54, 162, 239, 0.2);\\n  border-radius: 0;\\n}\\nhtml.dark-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):first-of-type, html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):first-of-type, html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:first-of-type {\\n  box-shadow: 2px 0 rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):last-of-type, html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):last-of-type, html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:last-of-type {\\n  box-shadow: -2px 0 rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--selected, html.dark-theme .react-datepicker__day--in-selecting-range, html.dark-theme .react-datepicker__day--selected:hover, html.dark-theme .react-datepicker__day--in-selecting-range:hover {\\n  background-color: #36A2EF;\\n  color: #000;\\n}\\nhtml.dark-theme .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range) {\\n  background-color: rgba(248, 107, 99, 0.5);\\n}\\nhtml.dark-theme .react-datepicker__day--disabled, html.dark-theme .react-datepicker__day--disabled:hover {\\n  background-color: rgba(81, 87, 97, 0.1);\\n  color: #515761;\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  transform: none;\\n}\\nhtml.dark-theme .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected), html.dark-theme .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover, html.dark-theme .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected), html.dark-theme .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover {\\n  color: #4e5f6e;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--disabled.react-datepicker__day--selected, html.dark-theme .react-datepicker__day--disabled.react-datepicker__day--selected:hover {\\n  color: #F86B63;\\n  background-color: rgba(248, 107, 99, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__header--time {\\n  display: none;\\n}\\nhtml.dark-theme .react-datepicker__time-container {\\n  border-left: #343741;\\n  width: auto;\\n  display: flex;\\n  margin-top: 40px;\\n  margin-left: 8px;\\n  flex-grow: 1;\\n  background-color: #141519;\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .react-datepicker__time-container--focus .react-datepicker__time-list-item--preselected {\\n  text-decoration: underline;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .react-datepicker__time-container {\\n    margin-top: 0;\\n  }\\n}\\nhtml.dark-theme .react-datepicker__time,\\nhtml.dark-theme .react-datepicker__time-box {\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .react-datepicker__time-list {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  padding: 4px 12px;\\n  height: 100px !important;\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n  align-items: center;\\n  gap: 4px;\\n}\\nhtml.dark-theme .react-datepicker__time-list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .react-datepicker__time-list::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .react-datepicker__time-list::-webkit-scrollbar-corner, html.dark-theme .react-datepicker__time-list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .react-datepicker__time-list:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .react-datepicker__time-list[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .react-datepicker__time-list-item {\\n  display: inline-block;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  cursor: pointer;\\n  height: 40px;\\n  line-height: 40px;\\n  text-align: center;\\n  white-space: nowrap;\\n  max-width: 100%;\\n  vertical-align: middle;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 500;\\n  text-decoration: none;\\n  outline-offset: -1px;\\n  transform: none !important;\\n  /* 1 */\\n  -webkit-animation: none !important;\\n  animation: none !important;\\n  /* 1 */\\n  transition-timing-function: ease-in;\\n  /* 2 */\\n  transition-duration: 150ms;\\n  /* 2 */\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 12px;\\n}\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  html.dark-theme .react-datepicker__time-list-item {\\n    transition: transform 250ms ease-in-out, background-color 250ms ease-in-out;\\n  }\\n  html.dark-theme .react-datepicker__time-list-item:hover:not(:disabled) {\\n    transform: translateY(-1px);\\n  }\\n  html.dark-theme .react-datepicker__time-list-item:focus {\\n    -webkit-animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n    animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  }\\n  html.dark-theme .react-datepicker__time-list-item:active:not(:disabled) {\\n    transform: translateY(1px);\\n  }\\n}\\nhtml.dark-theme .react-datepicker__time-list-item:hover:not(:disabled), html.dark-theme .react-datepicker__time-list-item:focus {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .react-datepicker__time-list-item--disabled, html.dark-theme .react-datepicker__time-list-item--disabled:hover {\\n  text-decoration: none !important;\\n  cursor: not-allowed;\\n  color: #515761;\\n  background-color: transparent;\\n}\\nhtml.dark-theme .react-datepicker__time-list-item--injected, html.dark-theme .react-datepicker__time-list-item--injected:hover {\\n  color: #7DDED8;\\n  background-color: rgba(125, 222, 216, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__time-list-item--preselected, html.dark-theme .react-datepicker__time-list-item--preselected:hover {\\n  background: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__time-list-item--selected, html.dark-theme .react-datepicker__time-list-item--selected:hover {\\n  background-color: #36A2EF;\\n  color: #000;\\n}\\nhtml.dark-theme .react-datepicker--time-only {\\n  padding: 0 !important;\\n}\\nhtml.dark-theme .react-datepicker--time-only .react-datepicker__time-container {\\n  background-color: transparent;\\n  margin: 0;\\n}\\nhtml.dark-theme .react-datepicker--time-only .react-datepicker__time-list {\\n  height: 204px !important;\\n}\\nhtml.dark-theme .react-datepicker--time-only .react-datepicker__time-list-item {\\n  font-size: 14px;\\n  min-width: 112px;\\n  text-align: left;\\n}\\nhtml.dark-theme .react-datepicker__header__dropdown {\\n  padding: 8px;\\n  display: flex;\\n  gap: 4px;\\n  position: absolute;\\n  top: 0;\\n  left: 36px;\\n  right: 36px;\\n  justify-content: center;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view,\\nhtml.dark-theme .react-datepicker__month-read-view,\\nhtml.dark-theme .react-datepicker__month-year-read-view {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  height: 32px;\\n  font-weight: 500;\\n  display: flex;\\n  flex-direction: row-reverse;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .react-datepicker__year-read-view,\\nhtml.dark-theme .react-datepicker__month-read-view,\\nhtml.dark-theme .react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .react-datepicker__year-read-view::-moz-placeholder,\\nhtml.dark-theme .react-datepicker__month-read-view::-moz-placeholder,\\nhtml.dark-theme .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view::-moz-placeholder, html.dark-theme .react-datepicker__month-read-view::-moz-placeholder, html.dark-theme .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view:-ms-input-placeholder, html.dark-theme .react-datepicker__month-read-view:-ms-input-placeholder, html.dark-theme .react-datepicker__month-year-read-view:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view::placeholder,\\nhtml.dark-theme .react-datepicker__month-read-view::placeholder,\\nhtml.dark-theme .react-datepicker__month-year-read-view::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .react-datepicker__year-read-view,\\nhtml.dark-theme .react-datepicker__month-read-view,\\nhtml.dark-theme .react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .react-datepicker__year-read-view:hover,\\nhtml.dark-theme .react-datepicker__month-read-view:hover,\\nhtml.dark-theme .react-datepicker__month-year-read-view:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view--down-arrow,\\nhtml.dark-theme .react-datepicker__month-read-view--down-arrow,\\nhtml.dark-theme .react-datepicker__month-year-read-view--down-arrow {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiI+ICA8ZGVmcz4gICAgPHBhdGggaWQ9ImRvd25hcnJvd3doaXRlLWEiIGQ9Ik0xMy4wNjg4NTA4LDUuMTU3MjUwMzggTDguMzg0MjM5NzUsOS43NjgyNzQyOCBDOC4xNzA1NDQxNSw5Ljk3ODYxMzA4IDcuODI5OTkyMTQsOS45NzkxNDA5NSA3LjYxNTc2MDI1LDkuNzY4Mjc0MjggTDIuOTMxMTQ5MTUsNS4xNTcyNTAzOCBDMi43MTgxMzU5LDQuOTQ3NTgzMjEgMi4zNzI3NzMxOSw0Ljk0NzU4MzIxIDIuMTU5NzU5OTQsNS4xNTcyNTAzOCBDMS45NDY3NDY2OSw1LjM2NjkxNzU2IDEuOTQ2NzQ2NjksNS43MDY4NTUyMiAyLjE1OTc1OTk0LDUuOTE2NTIyNCBMNi44NDQzNzEwNCwxMC41Mjc1NDYzIEM3LjQ4NTE3NDI0LDExLjE1ODI4MzYgOC41MTY0NDk3OSwxMS4xNTY2ODUxIDkuMTU1NjI4OTYsMTAuNTI3NTQ2MyBMMTMuODQwMjQwMSw1LjkxNjUyMjQgQzE0LjA1MzI1MzMsNS43MDY4NTUyMiAxNC4wNTMyNTMzLDUuMzY2OTE3NTYgMTMuODQwMjQwMSw1LjE1NzI1MDM4IEMxMy42MjcyMjY4LDQuOTQ3NTgzMjEgMTMuMjgxODY0MSw0Ljk0NzU4MzIxIDEzLjA2ODg1MDgsNS4xNTcyNTAzOCBaIi8+ICA8L2RlZnM+ICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPiAgICA8dXNlIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0ibm9uemVybyIgeGxpbms6aHJlZj0iI2Rvd25hcnJvd3doaXRlLWEiLz4gIDwvZz48L3N2Zz4=);\\n  right: 8px;\\n  height: 12px;\\n  width: 12px;\\n  display: inline-block;\\n  background-size: cover;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view--selected-month, html.dark-theme .react-datepicker__year-read-view--selected-year,\\nhtml.dark-theme .react-datepicker__month-read-view--selected-month,\\nhtml.dark-theme .react-datepicker__month-read-view--selected-year,\\nhtml.dark-theme .react-datepicker__month-year-read-view--selected-month,\\nhtml.dark-theme .react-datepicker__month-year-read-view--selected-year {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container,\\nhtml.dark-theme .react-datepicker__month-dropdown-container {\\n  position: relative;\\n  display: inline-block;\\n  flex-grow: 1;\\n  max-width: 400px;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]),\\nhtml.dark-theme .react-datepicker__month-dropdown {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n  height: auto;\\n  max-height: 250px;\\n  background-color: #1D1E24;\\n  position: absolute;\\n  z-index: 1;\\n  border-radius: 6px;\\n  min-width: 100px;\\n  width: 100%;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar,\\nhtml.dark-theme .react-datepicker__month-dropdown::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-thumb,\\nhtml.dark-theme .react-datepicker__month-dropdown::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-corner, html.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-track,\\nhtml.dark-theme .react-datepicker__month-dropdown::-webkit-scrollbar-corner,\\nhtml.dark-theme .react-datepicker__month-dropdown::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]):focus,\\nhtml.dark-theme .react-datepicker__month-dropdown:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])[tabindex=\\\"0\\\"]:focus:focus-visible,\\nhtml.dark-theme .react-datepicker__month-dropdown[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]) .react-datepicker__year-dropdown {\\n  padding: 4px;\\n  display: flex;\\n  flex-direction: column-reverse;\\n  justify-content: flex-end;\\n}\\nhtml.dark-theme .react-datepicker__month-dropdown-container {\\n  flex-grow: 2;\\n}\\nhtml.dark-theme .react-datepicker__month-dropdown-container .react-datepicker__month-dropdown {\\n  padding: 4px;\\n  min-width: 140px;\\n}\\nhtml.dark-theme .react-datepicker__year-option,\\nhtml.dark-theme .react-datepicker__month-option,\\nhtml.dark-theme .react-datepicker__month-year-option {\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 14px;\\n  margin: 4px 0;\\n  cursor: pointer;\\n}\\nhtml.dark-theme .react-datepicker__year-option:hover, html.dark-theme .react-datepicker__year-option:focus,\\nhtml.dark-theme .react-datepicker__month-option:hover,\\nhtml.dark-theme .react-datepicker__month-option:focus,\\nhtml.dark-theme .react-datepicker__month-year-option:hover,\\nhtml.dark-theme .react-datepicker__month-year-option:focus {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .react-datepicker__year-option--selected,\\nhtml.dark-theme .react-datepicker__month-option--selected,\\nhtml.dark-theme .react-datepicker__month-year-option--selected {\\n  display: none;\\n}\\nhtml.dark-theme .react-datepicker__year-option--preselected, html.dark-theme .react-datepicker__year-option--preselected:hover,\\nhtml.dark-theme .react-datepicker__month-option--preselected,\\nhtml.dark-theme .react-datepicker__month-option--preselected:hover {\\n  background: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__year-option--selected_year, html.dark-theme .react-datepicker__year-option--selected_year:hover,\\nhtml.dark-theme .react-datepicker__month-option--selected_month,\\nhtml.dark-theme .react-datepicker__month-option--selected_month:hover {\\n  background-color: #36A2EF;\\n  color: #000;\\n}\\nhtml.dark-theme .react-datepicker__navigation--next,\\nhtml.dark-theme .react-datepicker__navigation--previous {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZmlsbD0iI0ZGRiIgZD0iTTExLjY5MiA3SDMuNTU2QzMuMjQ5IDcgMyA3LjIyNCAzIDcuNXMuMjQ5LjUuNTU2LjVoOC4xMzZsLTQuMDk2IDQuMDk2YS41LjUgMCAwMC43MDcuNzA3bDQuMjQzLTQuMjQyYy4yNTgtLjI1OS40MDMtLjU4Ny40MzMtLjkyNWEuNDU0LjQ1NCAwIDAwMC0uMjcyIDEuNDk0IDEuNDk0IDAgMDAtLjQzMy0uOTI1TDguMzAzIDIuMTk3YS41LjUgMCAxMC0uNzA3LjcwN0wxMS42OTIgN3oiLz48L3N2Zz4=);\\n  cursor: pointer;\\n  position: absolute;\\n  top: 8px;\\n  height: 32px;\\n  width: 32px;\\n  z-index: 1;\\n  text-indent: -999em;\\n  overflow: hidden;\\n  background-repeat: no-repeat;\\n  border-radius: 4px;\\n  background-position: center;\\n}\\nhtml.dark-theme .react-datepicker__navigation--next:hover, html.dark-theme .react-datepicker__navigation--next:focus,\\nhtml.dark-theme .react-datepicker__navigation--previous:hover,\\nhtml.dark-theme .react-datepicker__navigation--previous:focus {\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__navigation--previous {\\n  left: 8px;\\n  transform: rotate(180deg);\\n  transform-origin: center;\\n}\\nhtml.dark-theme .react-datepicker__navigation--next {\\n  right: 8px;\\n}\\nhtml.dark-theme .euiDatePicker {\\n  display: block;\\n  /**\\n   * Inline datepickers\\n   */\\n}\\nhtml.dark-theme .euiDatePicker .euiFormControlLayout {\\n  height: auto;\\n}\\nhtml.dark-theme .euiDatePicker--inline .euiFormControlLayout {\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n  background-color: transparent;\\n  box-shadow: none;\\n  padding: 0;\\n}\\nhtml.dark-theme .euiDatePicker--inline .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: transparent;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .euiDatePicker--inline .euiFormControlLayoutIcons {\\n  justify-content: center;\\n  -webkit-padding-after: 8px;\\n  padding-block-end: 8px;\\n}\\nhtml.dark-theme .euiDatePicker--shadow .euiFormControlLayout {\\n  box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.2), 0 2.6px 8px -1px rgba(0, 0, 0, 0.15), 0 5.7px 12px -1px rgba(0, 0, 0, 0.125), 0 15px 15px -1px rgba(0, 0, 0, 0.1);\\n}\\nhtml.dark-theme .euiDatePicker--shadow .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .react-datepicker {\\n  font-size: 12px;\\n  color: #DFE5EF;\\n  display: flex;\\n  border-radius: 6px;\\n  padding: 8px;\\n  justify-content: center;\\n}\\nhtml.dark-theme .react-datepicker--non-interactive {\\n  pointer-events: none;\\n}\\nhtml.dark-theme .react-datepicker__current-month,\\nhtml.dark-theme .react-datepicker-time__header {\\n  display: none;\\n}\\nhtml.dark-theme .react-datepicker__screenReaderOnly {\\n  position: absolute;\\n  top: auto;\\n  left: -10000px;\\n  width: 1px;\\n  height: 1px;\\n  clip: rect(0 0 0 0);\\n  -webkit-clip-path: inset(50%);\\n  clip-path: inset(50%);\\n  overflow: hidden;\\n  margin: -1px;\\n}\\nhtml.dark-theme .react-datepicker__focusTrap {\\n  display: flex;\\n  justify-content: center;\\n}\\nhtml.dark-theme .react-datepicker__month-container {\\n  flex-grow: 1;\\n  margin-top: 36px;\\n}\\nhtml.dark-theme .react-datepicker__header {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .react-datepicker-time__header {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .react-datepicker__month {\\n  text-align: center;\\n  border-radius: 6px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .react-datepicker__focusTrap,\\nhtml.dark-theme .react-datepicker {\\n    flex-direction: column;\\n  }\\n  html.dark-theme .react-datepicker__time-box {\\n    margin-top: 0;\\n  }\\n}\\nhtml.dark-theme .euiColorPicker {\\n  position: relative;\\n  width: 152px;\\n}\\nhtml.dark-theme .euiColorPicker__popoverAnchor .euiColorPicker__input {\\n  padding-right: 40px;\\n}\\nhtml.dark-theme .euiColorPicker__popoverAnchor .euiColorPicker__input[class*=\\\"--compressed\\\"] {\\n  padding-right: 32px;\\n}\\nhtml.dark-theme .euiColorPicker__popoverAnchor .euiColorPicker__input + .euiFormControlLayoutIcons {\\n  color: inherit;\\n}\\nhtml.dark-theme .euiColorPicker__swatches {\\n  display: flex;\\n  flex-wrap: wrap;\\n  margin: -4px;\\n}\\nhtml.dark-theme .euiColorPicker__swatch-item {\\n  margin: 4px;\\n}\\nhtml.dark-theme .euiSwatchInput__stroke {\\n  fill: none;\\n  stroke: rgba(255, 255, 255, 0.2);\\n}\\nhtml.dark-theme .euiColorPicker__popoverPanel--pickerOnly {\\n  padding-bottom: 0 !important;\\n}\\nhtml.dark-theme .euiColorPicker__input--inGroup {\\n  height: 38px !important;\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiColorPicker__input--inGroup.euiFieldText--compressed {\\n  height: 30px !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiColorPicker__alphaRange .euiRangeInput {\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiColorPickerSwatch {\\n  display: inline-block;\\n  height: 24px;\\n  width: 24px;\\n  border-radius: 3px;\\n  cursor: pointer;\\n  border: solid 1px rgba(255, 255, 255, 0.1);\\n  box-shadow: inset 0 0 0 1px rgba(29, 30, 36, 0.05);\\n}\\nhtml.dark-theme .euiColorPickerSwatch:disabled {\\n  cursor: default;\\n}\\nhtml.dark-theme .euiColorPickerSwatch:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiColorPickerSwatch:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiColorPickerSwatch:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiHue {\\n  background: linear-gradient(to right, #FF3232 0%, #FFF130 20%, #45FF30 35%, #28FFF0 52%, #282CFF 71%, #FF28FB 88%, #FF0094 100%);\\n  height: 24px;\\n  margin: 4px 0;\\n  position: relative;\\n}\\nhtml.dark-theme .euiHue::before, html.dark-theme .euiHue::after {\\n  content: \\\"\\\";\\n  left: 0;\\n  position: absolute;\\n  height: 8px;\\n  background: #1D1E24;\\n  width: 100%;\\n}\\nhtml.dark-theme .euiHue::after {\\n  bottom: 0;\\n}\\nhtml.dark-theme .euiHue__range {\\n  position: relative;\\n  height: 24px;\\n  width: calc(100% + 2px);\\n  margin: 0 -1px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  background: transparent;\\n  z-index: 2;\\n}\\nhtml.dark-theme .euiHue__range::-webkit-slider-thumb {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 14px;\\n  -webkit-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #1D1E24, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #1D1E24;\\n  cursor: pointer;\\n  background-color: #98A2B3;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme .euiHue__range::-moz-range-thumb {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 14px;\\n  -moz-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #1D1E24, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #1D1E24;\\n  cursor: pointer;\\n  background-color: #98A2B3;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme .euiHue__range::-ms-thumb {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 14px;\\n  -ms-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #1D1E24, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #1D1E24;\\n  cursor: pointer;\\n  background-color: #98A2B3;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme .euiHue__range::-webkit-slider-thumb {\\n  -webkit-appearance: none;\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiHue__range::-ms-thumb {\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiHue__range::-ms-track {\\n  height: 24px;\\n  background: transparent;\\n  border-color: transparent;\\n  color: transparent;\\n}\\nhtml.dark-theme .euiHue__range::-moz-focus-outer {\\n  border: none;\\n}\\nhtml.dark-theme .euiHue__range::-ms-fill-lower, html.dark-theme .euiHue__range::-ms-fill-upper {\\n  background: transparent;\\n}\\nhtml.dark-theme .euiHue__range:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiSaturation {\\n  position: relative;\\n  width: 100%;\\n  padding-bottom: 100%;\\n  border-radius: 3px;\\n  touch-action: none;\\n  z-index: 3;\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__lightness,\\nhtml.dark-theme .euiSaturation .euiSaturation__saturation {\\n  position: absolute;\\n  top: -1px;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  border-radius: 3px;\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__lightness {\\n  background: linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0));\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__saturation {\\n  background: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__indicator {\\n  position: absolute;\\n  height: 12px;\\n  width: 12px;\\n  border-radius: 100%;\\n  margin-top: -6px;\\n  margin-left: -6px;\\n  border: 1px solid #D4DAE5;\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__indicator::before {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 100%;\\n  border: 1px solid #25262E;\\n}\\nhtml.dark-theme .euiSaturation:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSaturation:focus .euiSaturation__indicator {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiColorPalettePicker__itemTitle {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.dark-theme .euiColorPalettePicker__itemTitle + .euiColorPaletteDisplay {\\n  margin-top: 4px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay {\\n  display: flex;\\n  flex-direction: row;\\n  overflow: hidden;\\n  height: 8px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeExtraSmall {\\n  position: relative;\\n  height: 4px;\\n  border-radius: 4px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeExtraSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 4px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(212, 218, 229, 0.2);\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeExtraSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 4px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeSmall {\\n  position: relative;\\n  height: 8px;\\n  border-radius: 8px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 8px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(212, 218, 229, 0.2);\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 8px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeMedium {\\n  position: relative;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeMedium::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 16px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(212, 218, 229, 0.2);\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeMedium .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 16px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplayFixed__bleedArea {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  display: flex;\\n  height: 8px;\\n  width: calc(100% + 1px);\\n}\\nhtml.dark-theme .euiComboBox {\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  position: relative;\\n  /**\\n   * 1. Allow pills to truncate their text with an ellipsis.\\n   * 2. Don't allow pills/placeholder to overlap with the caret, loading icon or clear button.\\n   * 3. The height on combo can be larger than normal text inputs except for single-selection comboboxes.\\n   */\\n  /**\\n   * 1. Force field height to match other field heights.\\n   * 2. Force input height to expand to fill this element.\\n   * 3. Reset input appearance to mimic text\\n   * 4. Ensure that no input states are visible on the hidden input\\n   */\\n}\\nhtml.dark-theme .euiComboBox--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiComboBox--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiComboBox--inGroup {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiComboBox--compressed:not(.euiComboBox--appended, .euiComboBox--prepended) {\\n  height: auto;\\n  /* 3 */\\n}\\nhtml.dark-theme .euiComboBox:not(.euiComboBox--appended, .euiComboBox--prepended) .euiFormControlLayout {\\n  height: auto;\\n  /* 3 */\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  padding: 4px 8px;\\n  padding-right: var(--eui-form-control-layout-icons-padding, 8px);\\n  /* 2 */\\n  display: flex;\\n  /* 1 */\\n  outline: none;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiComboBox .euiComboBox__inputWrap {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPill {\\n  max-width: calc(100% - 2px - 16px);\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap:not(.euiComboBox__inputWrap--noWrap) {\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  padding-left: 4px;\\n  height: auto;\\n  /* 3 */\\n  flex-wrap: wrap;\\n  /* 1 */\\n  align-content: flex-start;\\n  cursor: text;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--noWrap {\\n  align-items: center;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 8px;\\n  padding-inline-start: 8px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend, html.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  flex-shrink: 0;\\n  margin-inline: 2px;\\n  display: flex;\\n  /* Vertically centers any icons */\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend {\\n  -webkit-margin-start: 4px;\\n  margin-inline-start: 4px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  -webkit-margin-end: 4px;\\n  margin-inline-end: 4px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input {\\n  block-size: 24px;\\n  /* 2 */\\n  min-inline-size: 2px;\\n  max-inline-size: 100%;\\n  margin: 4px;\\n  /* 3 */\\n  background: transparent;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  /* 4 */\\n  -webkit-appearance: none !important;\\n  -moz-appearance: none !important;\\n  appearance: none !important;\\n  border: none !important;\\n  box-shadow: none !important;\\n  outline: none !important;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap--compressed {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isInvalid .euiComboBox__inputWrap {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  -webkit-text-fill-color: unset;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap,\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBoxPill {\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap {\\n  line-height: 32px;\\n  /* 2 */\\n  padding-block: 0;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 4px;\\n  padding-inline-start: 4px;\\n}\\nhtml.dark-theme .euiComboBoxPill {\\n  height: 22px;\\n  line-height: 20px;\\n  vertical-align: baseline;\\n  /* Fix append/prepend vertical alignment */\\n}\\nhtml.dark-theme .euiComboBoxPill, html.dark-theme .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 4px;\\n}\\nhtml.dark-theme .euiComboBox--compressed .euiComboBoxPill, html.dark-theme .euiComboBox--compressed .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 5px 4px 0 0;\\n}\\nhtml.dark-theme .euiComboBoxPill__prepend {\\n  margin-right: 4px;\\n}\\nhtml.dark-theme .euiComboBoxPill__append {\\n  margin-left: 4px;\\n}\\nhtml.dark-theme .euiComboBoxPill .euiBadge__text {\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiComboBoxPill .euiBadge__text .euiIcon {\\n  display: block;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList {\\n  max-height: 200px;\\n  overflow: hidden;\\n  /* Kibana FTR affordance - without this, Selenium complains about the overlaid\\n     text intercepting the button click. Since `title` is always present, and\\n     users can't highlight or copy combobox options anyway, we might as well\\n     disable clicks on text */\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__virtualization {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-corner, html.dark-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList .euiTextTruncate {\\n  pointer-events: none;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__empty {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 2 */\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n}\\nhtml.dark-theme .euiComboBoxOption {\\n  font-size: 14px;\\n  padding: 4px 8px 4px 16px;\\n  width: 100%;\\n  text-align: left;\\n  border: 1px solid #343741;\\n  border-color: transparent;\\n  display: flex;\\n  align-items: center;\\n  /* Fix vertical alignment of EuiIcons in prepend/append nodes */\\n}\\nhtml.dark-theme .euiComboBoxOption:hover {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiComboBoxOption.euiComboBoxOption-isFocused {\\n  cursor: pointer;\\n  color: #36A2EF;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiComboBoxOption.euiComboBoxOption-isDisabled {\\n  color: #535966;\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiComboBoxOption.euiComboBoxOption-isDisabled:hover {\\n  text-decoration: none;\\n}\\nhtml.dark-theme .euiComboBoxOption__contentWrapper {\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiComboBoxOption__content {\\n  text-overflow: ellipsis;\\n  overflow: hidden;\\n  white-space: nowrap;\\n  flex: 1;\\n  text-align: left;\\n}\\nhtml.dark-theme .euiComboBoxOption__emptyStateText {\\n  flex: 1;\\n  text-align: left;\\n  /* Extra specificity required to override EuiText's <p> styling */\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__empty .euiComboBoxOption__emptyStateText {\\n  margin-bottom: 0;\\n}\\nhtml.dark-theme .euiComboBoxOption__enterBadge {\\n  margin-left: 4px;\\n}\\nhtml.dark-theme .euiComboBoxOption__prepend {\\n  margin-right: 8px;\\n}\\nhtml.dark-theme .euiComboBoxOption__append {\\n  margin-left: 8px;\\n}\\nhtml.dark-theme .euiComboBoxOption__prepend .euiIcon, html.dark-theme .euiComboBoxOption__append .euiIcon {\\n  display: block;\\n}\\nhtml.dark-theme .euiComboBoxTitle {\\n  font-size: 12px;\\n  padding: 11px 8px 4px;\\n  /* 1 */\\n  width: 100%;\\n  font-weight: 700;\\n  color: #FFF;\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow {\\n  padding: 0 8px 8px;\\n  /* A bit of a visual trickery to make the format \\\"hint\\\" become an \\\"error\\\" text.\\n     NOTE: Normally reordering visually (vs DOM) isn't super great for screen reader users,\\n     but as the help text is already read out via `aria-describedby`, and the error text\\n     is read out immediately via `aria-live`, we can fairly safely prioritize visuals instead */\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormRow__fieldWrapper {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormControlLayout {\\n  order: 0;\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormHelpText {\\n  order: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormErrorText {\\n  order: 2;\\n}\\nhtml.dark-theme .euiDatePopoverButton {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiDatePopoverButton::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDatePopoverButton:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDatePopoverButton::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDatePopoverButton--compressed {\\n  line-height: 30px;\\n  height: 30px;\\n}\\nhtml.dark-theme .euiDatePopoverButton:focus, html.dark-theme .euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n}\\nhtml.dark-theme .euiDatePopoverButton-needsUpdating {\\n  background-color: #264341;\\n  color: #7DDED8;\\n}\\nhtml.dark-theme .euiDatePopoverButton-needsUpdating:focus, html.dark-theme .euiDatePopoverButton-needsUpdating.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #7DDED8, #7DDED8 2px, transparent 2px, transparent 100%);\\n}\\nhtml.dark-theme .euiDatePopoverButton-isInvalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n  background-color: transparent;\\n  color: #F86B63;\\n}\\nhtml.dark-theme .euiDatePopoverButton-isInvalid:focus, html.dark-theme .euiDatePopoverButton-isInvalid.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n}\\nhtml.dark-theme .euiDatePopoverButton:disabled {\\n  background-color: #202128;\\n  background-image: none;\\n  color: #98A2B3;\\n  cursor: default;\\n}\\nhtml.dark-theme .euiDatePopoverButton--start {\\n  text-align: center;\\n}\\nhtml.dark-theme .euiDatePopoverButton--end {\\n  text-align: center;\\n}\\nhtml.dark-theme .euiDatePopoverContent,\\nhtml.dark-theme .euiDatePopoverContent .react-datepicker {\\n  width: 400px;\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiDatePopoverContent__padded {\\n  padding: 8px;\\n}\\nhtml.dark-theme .euiDatePopoverContent__padded--large {\\n  padding: 16px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiDatePopoverContent {\\n    width: 284px;\\n  }\\n}\\nhtml.dark-theme .euiQuickSelectPopover__content {\\n  width: 400px;\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__content .euiQuickSelectPopover__panel:not(:first-child) {\\n  border-top: 1px solid #343741;\\n  padding-top: 12px;\\n  margin-top: 12px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__content .euiQuickSelectPopover__panel .euiQuickSelectPopover__panelTitle {\\n  float: left;\\n  margin-bottom: 12px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__section {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 132px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n  margin: 8px 0 0;\\n  clear: both;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__section::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__section::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__section::-webkit-scrollbar-corner, html.dark-theme .euiQuickSelectPopover__section::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__buttonContent {\\n  gap: 4px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__sectionItem {\\n  font-size: 14px;\\n  line-height: 14px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__sectionItem--recentlyUsed:not(:last-of-type) {\\n  margin-bottom: 8px;\\n}\\nhtml.dark-theme .euiQuickSelect__applyButton {\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiRefreshInterval__startButton {\\n  min-width: 90px;\\n}\\nhtml.dark-theme .euiSuperDatePicker {\\n  display: flex;\\n  gap: 8px;\\n  max-width: 100%;\\n  min-width: min(326px, 100%);\\n  width: 606px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\nhtml.dark-theme .euiSuperDatePicker--isAutoRefreshOnly {\\n  min-width: min(200px, 100%);\\n  width: 400px;\\n}\\nhtml.dark-theme .euiSuperDatePicker--noUpdateButton {\\n  min-width: min(200px, 100%);\\n  width: 480px;\\n}\\nhtml.dark-theme .euiSuperDatePicker--fullWidth {\\n  width: 100%;\\n}\\nhtml.dark-theme .euiSuperDatePicker--isQuickSelectOnly {\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiSuperDatePicker--autoWidth {\\n  display: inline-flex;\\n  width: auto;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiDatePickerRange {\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiFormControlLayout {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  overflow: hidden;\\n  background-color: #16171c;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper > .euiFormControlLayoutDelimited__input {\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  display: flex;\\n  justify-content: space-between;\\n  text-align: left;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat:not(:disabled):hover, html.dark-theme .euiSuperDatePicker__prettyFormat:focus {\\n  text-decoration: none;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat:disabled {\\n  background-color: #202128;\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #264341;\\n}\\nhtml.dark-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayoutDelimited__delimiter {\\n  color: #7DDED8;\\n}\\nhtml.dark-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayout__childrenWrapper {\\n  transition: background 150ms ease-in;\\n}\\nhtml.dark-theme .euiDataGrid {\\n  display: flex;\\n  flex-direction: column;\\n  align-items: stretch;\\n  overflow: hidden;\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGrid--fullScreen {\\n  height: 100%;\\n  position: fixed;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  z-index: 999;\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid--fullScreen .euiDataGrid__pagination {\\n  padding-bottom: 4px;\\n  background: #25262E;\\n  box-shadow: 1px 0 0 1px #343741;\\n}\\nhtml.dark-theme .euiDataGrid__content {\\n  flex-grow: 1;\\n  height: 100%;\\n  max-width: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  z-index: 1;\\n  position: relative;\\n  background: #141519;\\n  font-feature-settings: \\\"tnum\\\" 1;\\n}\\nhtml.dark-theme .euiDataGrid__customRenderBody {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) #1D1E24;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  width: 100%;\\n  overflow: auto;\\n}\\nhtml.dark-theme .euiDataGrid__customRenderBody::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-corner, html.dark-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-track {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__pagination {\\n  z-index: 2;\\n  padding-top: 4px;\\n  flex-grow: 0;\\n}\\nhtml.dark-theme .euiDataGrid__restrictBody {\\n  height: 100vh;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiDataGrid__restrictBody .euiHeader[data-fixed-header] {\\n  z-index: 998 !important;\\n}\\nhtml.dark-theme .euiDataGrid__restrictBody .euiOverlayMask[data-relative-to-header=below] {\\n  top: 0;\\n}\\nhtml.dark-theme .euiDataGrid__restrictBody .euiFlyout {\\n  top: 0;\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGrid__focusWrap {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGrid__virtualized {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) #1D1E24;\\n  scrollbar-width: thin;\\n  scroll-padding: 0;\\n}\\nhtml.dark-theme .euiDataGrid__virtualized::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGrid__virtualized::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__virtualized::-webkit-scrollbar-corner, html.dark-theme .euiDataGrid__virtualized::-webkit-scrollbar-track {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__scrollOverlay {\\n  position: absolute;\\n  top: -1px;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  pointer-events: none;\\n  box-shadow: inset 0 0 0 1px #343741;\\n}\\nhtml.dark-theme .euiDataGrid--bordersHorizontal .euiDataGrid__scrollOverlay {\\n  box-shadow: inset 0 -2px 0 -1px #343741;\\n}\\nhtml.dark-theme .euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayBottom {\\n  position: absolute;\\n  width: 100%;\\n  height: 1px;\\n  background-color: #343741;\\n}\\nhtml.dark-theme .euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayRight {\\n  position: absolute;\\n  height: 100%;\\n  width: 1px;\\n  background-color: #343741;\\n}\\nhtml.dark-theme .euiDataGridHeader {\\n  display: flex;\\n  z-index: 999;\\n  background: #1D1E24;\\n  position: sticky;\\n  top: 0;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  padding: 6px;\\n  flex: 0 0 auto;\\n  position: relative;\\n  align-items: center;\\n  display: flex;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell > [data-focus-lock-disabled] {\\n  width: 100%;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:focus, html.dark-theme .euiDataGridHeaderCell--hasColumnActions:focus-within, html.dark-theme .euiDataGridHeaderCell--isActionsPopoverOpen {\\n  outline: none;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:focus::after, html.dark-theme .euiDataGridHeaderCell--hasColumnActions:focus-within::after, html.dark-theme .euiDataGridHeaderCell--isActionsPopoverOpen::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #36A2EF);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__button {\\n  position: relative;\\n  display: flex;\\n  align-items: center;\\n  gap: 4px;\\n  width: 100%;\\n  font-weight: 700;\\n  outline: none;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__content {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__sortingArrow {\\n  flex: 0 0 auto;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__icon {\\n  flex: 0 0 auto;\\n  margin-left: auto;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  height: 16px;\\n  overflow: hidden;\\n  width: 0;\\n  opacity: 0;\\n  transition: width 150ms ease-in, opacity 350ms ease-in;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):focus-within .euiDataGridHeaderCell__icon, html.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):hover .euiDataGridHeaderCell__icon,\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiPopover-isOpen .euiDataGridHeaderCell__icon {\\n  width: 16px;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell.euiDataGridHeaderCell--numeric .euiDataGridHeaderCell__content, html.dark-theme .euiDataGridHeaderCell.euiDataGridHeaderCell--currency .euiDataGridHeaderCell__content {\\n  flex-grow: 1;\\n  text-align: right;\\n}\\nhtml.dark-theme .euiDataGridHeader__action--selected {\\n  font-weight: 700 !important;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone.euiDataGrid--bordersHorizontal .euiDataGridHeader {\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-left: none;\\n  border-right: none;\\n  border-bottom: 2px solid #343741;\\n  border-bottom-color: #DFE5EF;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone.euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-bottom: 2px solid #343741;\\n  border-color: #DFE5EF;\\n}\\nhtml.dark-theme .euiDataGrid--headerShade .euiDataGridHeaderCell {\\n  background: #212229;\\n}\\nhtml.dark-theme .euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-right: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  border-left: none;\\n}\\nhtml.dark-theme .euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell:first-of-type {\\n  border-left: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGrid--headerShade.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone .euiDataGridHeaderCell {\\n  border: none;\\n}\\nhtml.dark-theme .euiDataGrid--borderhorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-right: none;\\n  border-left: none;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeSmall .euiDataGridHeaderCell {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeLarge .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.dark-theme .euiDataGrid--paddingSmall .euiDataGridHeaderCell {\\n  padding: 4px;\\n}\\nhtml.dark-theme .euiDataGrid--paddingLarge .euiDataGridHeaderCell {\\n  padding: 8px;\\n}\\nhtml.dark-theme .euiDataGrid--noControls.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-top: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGrid--noControls.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGridFooter {\\n  display: flex;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridFooterCell {\\n  flex: 0 0 auto;\\n  position: relative;\\n  font-weight: 700;\\n}\\nhtml.dark-theme .euiDataGrid--stickyFooter .euiDataGridFooter {\\n  position: sticky;\\n  bottom: 0;\\n}\\nhtml.dark-theme .euiDataGrid--footerOverline .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-top: 2px solid #343741;\\n  border-top-color: #DFE5EF !important;\\n  background: #1D1E24 !important;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\nhtml.dark-theme .euiDataGrid--bordersHorizontal .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\nhtml.dark-theme .euiDataGrid--footerShade .euiDataGridRowCell.euiDataGridFooterCell {\\n  background: #212229;\\n}\\nhtml.dark-theme .euiDataGridColumnResizer {\\n  position: absolute;\\n  top: 0;\\n  right: -8px;\\n  height: 100%;\\n  width: 16px;\\n  cursor: ew-resize;\\n  opacity: 0;\\n  z-index: 2;\\n}\\nhtml.dark-theme .euiDataGridColumnResizer::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  left: 7px;\\n  top: 0;\\n  bottom: 0;\\n  width: 3px;\\n  background-color: #36A2EF;\\n}\\nhtml.dark-theme .euiDataGridColumnResizer:hover, html.dark-theme .euiDataGridColumnResizer:active {\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDataGridColumnResizer:hover ~ .euiDataGridHeaderCell__content, html.dark-theme .euiDataGridColumnResizer:active ~ .euiDataGridHeaderCell__content {\\n  -webkit-user-select: none;\\n  -moz-user-select: none;\\n  -ms-user-select: none;\\n      user-select: none;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:last-child .euiDataGridColumnResizer {\\n  right: 0;\\n  width: 8px;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:last-child .euiDataGridColumnResizer::after {\\n  left: auto;\\n  right: 0;\\n}\\nhtml.dark-theme .euiDataGridRow {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGridRowCell {\\n  position: relative;\\n  border-right: solid 1px #24272e;\\n  border-bottom: 1px solid #343741;\\n  --euiDataGridCellOutlineColor: #36A2EF;\\n}\\nhtml.dark-theme .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 6px;\\n  height: 100%;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiDataGridRowCell .euiDataGridRowCell__content--autoHeight {\\n  height: auto;\\n}\\nhtml.dark-theme .euiDataGridRowCell > [data-focus-lock-disabled] {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--firstColumn {\\n  border-left: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--lastColumn {\\n  border-right-color: #343741;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover, html.dark-theme .euiDataGridRowCell:focus, html.dark-theme .euiDataGridRowCell.euiDataGridRowCell--open {\\n  outline: none;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover::after, html.dark-theme .euiDataGridRowCell:focus::after, html.dark-theme .euiDataGridRowCell.euiDataGridRowCell--open::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #36A2EF);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) {\\n  --euiDataGridCellOutlineColor: #98A2B3;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) .euiDataGridRowCell__actions {\\n  -webkit-animation-delay: 350ms;\\n  animation-delay: 350ms;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover .euiDataGridRowCell__actions, html.dark-theme .euiDataGridRowCell:focus .euiDataGridRowCell__actions, html.dark-theme .euiDataGridRowCell:focus-within .euiDataGridRowCell__actions, html.dark-theme .euiDataGridRowCell.euiDataGridRowCell--open .euiDataGridRowCell__actions, html.dark-theme .euiDataGridRowCell[data-keyboard-closing] .euiDataGridRowCell__actions {\\n  -webkit-animation-duration: 90ms;\\n  animation-duration: 90ms;\\n  -webkit-animation-name: euiDataGridCellActionsSlideIn;\\n  animation-name: euiDataGridCellActionsSlideIn;\\n  -webkit-animation-iteration-count: 1;\\n  animation-iteration-count: 1;\\n  -webkit-animation-fill-mode: forwards;\\n  animation-fill-mode: forwards;\\n}\\nhtml.dark-theme .euiDataGridRowCell:not(:hover):not(:focus):not(.euiDataGridRowCell--open):not([data-keyboard-closing]) .euiDataGridRowCell__actions {\\n  display: none;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--numeric {\\n  text-align: right;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--currency {\\n  text-align: right;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--uppercase {\\n  text-transform: uppercase;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--lowercase {\\n  text-transform: lowercase;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--capitalize {\\n  text-transform: capitalize;\\n}\\nhtml.dark-theme .euiDataGridRowCell__popover {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  overflow: auto;\\n  z-index: 1000 !important;\\n  filter: none;\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n  -webkit-animation-duration: 250ms;\\n  animation-duration: 250ms;\\n  -webkit-animation-name: euiDataGridCellPopover;\\n  animation-name: euiDataGridCellPopover;\\n}\\nhtml.dark-theme .euiDataGridRowCell__popover::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGridRowCell__popover::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiDataGridRowCell__popover::-webkit-scrollbar-corner, html.dark-theme .euiDataGridRowCell__popover::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiDataGridRowCell--controlColumn .euiDataGridRowCell__content {\\n  max-height: 100%;\\n  height: auto;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actions,\\nhtml.dark-theme .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  position: absolute;\\n  bottom: 100%;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions,\\nhtml.dark-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  left: 0;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions,\\nhtml.dark-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  right: 0;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actions {\\n  z-index: 998;\\n  margin-bottom: -1px;\\n  display: flex;\\n  gap: 2px;\\n  padding-inline: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n  color: #1D1E24;\\n  border: 1px solid var(--euiDataGridCellOutlineColor);\\n  border-top-left-radius: 3px;\\n  border-top-right-radius: 3px;\\n  transform: scaleY(0);\\n  transform-origin: bottom;\\n}\\nhtml.dark-theme .euiDataGridRowCell[data-gridcell-visible-row-index=\\\"0\\\"] > .euiDataGridRowCell__actions {\\n  z-index: 999;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions {\\n  border-bottom-right-radius: 3px;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions {\\n  border-bottom-left-radius: 3px;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actions::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 100%;\\n  height: 2px;\\n  width: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions::after {\\n  left: -1px;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions::after {\\n  right: -1px;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actionButtonIcon {\\n  height: 20px;\\n  width: 16px;\\n  border-radius: 0;\\n  /* Force all cell action buttons to match EUI colors */\\n  /* Manually increase the size of the expand cell icon - it's a bit small by default */\\n}\\nhtml.dark-theme .euiDataGridRowCell__actionButtonIcon,\\nhtml.dark-theme .euiDataGridRowCell__actionButtonIcon svg {\\n  background-color: transparent !important;\\n  color: currentColor !important;\\n  fill: currentColor !important;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actionButtonIcon.euiDataGridRowCell__expandCell .euiIcon {\\n  width: 120%;\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGrid--stripes .euiDataGridRow--striped {\\n  background-color: #25262E;\\n}\\nhtml.dark-theme .euiDataGrid--rowHoverHighlight .euiDataGridRow:hover {\\n  background-color: #2E2D25;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone .euiDataGridRowCell {\\n  border-color: transparent !important;\\n}\\nhtml.dark-theme .euiDataGrid--bordersHorizontal .euiDataGridRowCell {\\n  border-right-color: transparent;\\n  border-left-color: transparent;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.dark-theme .euiDataGrid--paddingSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 4px;\\n}\\nhtml.dark-theme .euiDataGrid--paddingLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 8px;\\n}\\n@-webkit-keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@-webkit-keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\nhtml.dark-theme .euiDataGrid__controls {\\n  background: #141519;\\n  position: relative;\\n  z-index: 2;\\n  border: 1px solid #343741;\\n  padding: 4px 4px 4px 0;\\n  display: flex;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiDataGrid__rightControls {\\n  white-space: nowrap;\\n}\\nhtml.dark-theme .euiDataGrid__rightControls:only-child {\\n  margin-left: auto;\\n}\\nhtml.dark-theme .euiDataGrid__rightControls > * + * {\\n  margin-left: 8px;\\n}\\nhtml.dark-theme .euiDataGrid__leftControls > * + * {\\n  margin-left: 2px;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone .euiDataGrid__controls {\\n  border: none;\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid--bordersHorizontal .euiDataGrid__controls {\\n  border-right: none;\\n  border-left: none;\\n  border-top: none;\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  padding: 8px;\\n  margin: -8px;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll::-webkit-scrollbar-corner, html.dark-theme .euiDataGrid__controlScroll::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__item {\\n  padding: 4px;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  margin: 0 -8px;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-corner, html.dark-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__itemLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  max-height: 300px;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-corner, html.dark-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__field {\\n  display: block;\\n  padding: 4px 8px;\\n  width: 100%;\\n  outline-offset: -2px;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__field:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__field:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__field:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #515761;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__name {\\n  padding-right: 24px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__order {\\n  min-width: 200px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__order .euiButtonGroup__buttons {\\n  border: none;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__order .euiButtonGroupButton {\\n  font-size: 12px;\\n}\\nhtml.dark-theme .euiDataGrid__displayPopoverPanel {\\n  width: 416px;\\n}\\nhtml.dark-theme .euiDataGrid__keyboardShortcuts {\\n  display: block;\\n  max-inline-size: 400px;\\n  max-block-size: 80vh;\\n  overflow-y: auto;\\n  overflow-block: auto;\\n}\\nhtml.dark-theme .euiDataGrid__keyboardShortcuts .euiDescriptionList {\\n  row-gap: 0;\\n}\\nhtml.dark-theme .euiCheckbox {\\n  position: relative;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input ~ .euiCheckbox__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 4px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:checked + .euiCheckbox__square {\\n  border-color: #36A2EF;\\n  background-color: #36A2EF;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%2829, 30, 36%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:indeterminate + .euiCheckbox__square {\\n  border-color: #36A2EF;\\n  background-color: #36A2EF;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%2829, 30, 36%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input[disabled] ~ .euiCheckbox__label {\\n  color: #535966;\\n  cursor: not-allowed !important;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input[disabled] + .euiCheckbox__square {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:checked[disabled] + .euiCheckbox__square {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%28166, 170, 176%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:indeterminate[disabled] + .euiCheckbox__square {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%28166, 170, 176%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiCheckbox.euiCheckbox--inList, html.dark-theme .euiCheckbox.euiCheckbox--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\nhtml.dark-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__input,\\nhtml.dark-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__square, html.dark-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input,\\nhtml.dark-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__square {\\n  top: 0;\\n}\\nhtml.dark-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__input, html.dark-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input {\\n  margin: 0;\\n}\\nhtml.dark-theme .euiCheckboxGroup__item + .euiCheckboxGroup__item {\\n  margin-top: 4px;\\n}\\nhtml.dark-theme .euiCheckboxGroup__item + .euiCheckboxGroup__item.euiCheckbox--compressed {\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiDescribedFormGroup {\\n  max-width: 800px;\\n}\\nhtml.dark-theme .euiDescribedFormGroup + * {\\n  margin-top: 24px;\\n}\\nhtml.dark-theme .euiDescribedFormGroup.euiDescribedFormGroup--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__description {\\n  padding-top: 8px;\\n}\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields {\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child,\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel) {\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child::before,\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel)::before {\\n  content: \\\"\\\";\\n}\\nhtml.dark-theme .euiDescribedFormGroup__descriptionColumn {\\n  min-width: min(20rem, 50%);\\n}\\nhtml.dark-theme .euiFieldNumber {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\nhtml.dark-theme .euiFieldNumber--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFieldNumber--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldNumber {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldNumber::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldNumber:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiFieldNumber:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldNumber--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFieldNumber--withIcon {\\n  padding-left: 40px;\\n}\\nhtml.dark-theme .euiFieldNumber--withIcon.euiFieldNumber--compressed {\\n  padding-left: 32px;\\n}\\nhtml.dark-theme .euiFieldPassword {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n}\\nhtml.dark-theme .euiFieldPassword--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFieldPassword--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldPassword {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldPassword::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldPassword:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiFieldPassword:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldPassword--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFieldPassword.euiFieldPassword--compressed {\\n  padding-left: 32px;\\n}\\nhtml.dark-theme .euiFieldPassword--withToggle::-ms-reveal {\\n  display: none;\\n}\\nhtml.dark-theme .euiFieldSearch {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n  -webkit-appearance: textfield;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiFieldSearch--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFieldSearch--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldSearch {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldSearch::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldSearch:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiFieldSearch:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldSearch--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFieldSearch-isLoading {\\n  padding-right: 40px;\\n}\\nhtml.dark-theme .euiFieldSearch-isLoading.euiFieldSearch--compressed {\\n  padding-right: 32px;\\n}\\nhtml.dark-theme .euiFieldSearch::-webkit-search-decoration, html.dark-theme .euiFieldSearch::-webkit-search-cancel-button {\\n  -webkit-appearance: none;\\n  /* 1, 2 */\\n}\\nhtml.dark-theme .euiFieldSearch--compressed {\\n  padding-left: 32px;\\n}\\nhtml.dark-theme .euiFieldText {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\nhtml.dark-theme .euiFieldText--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFieldText--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFieldText--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldText {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldText::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldText:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiFieldText:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiFieldText--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldText--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldText--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldText--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFieldText--withIcon {\\n  padding-left: 40px;\\n}\\nhtml.dark-theme .euiFieldText--withIcon.euiFieldText--compressed {\\n  padding-left: 32px;\\n}\\nhtml.dark-theme .euiFilePicker {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  position: relative;\\n}\\nhtml.dark-theme .euiFilePicker--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFilePicker--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFilePicker--inGroup {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiFilePicker.euiFilePicker--large {\\n  border-radius: 6px;\\n  overflow: hidden;\\n  height: auto;\\n}\\nhtml.dark-theme .euiFilePicker.euiFilePicker--large.euiFilePicker--compressed {\\n  border-radius: 4px;\\n}\\nhtml.dark-theme .euiFilePicker__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiFilePicker__input:hover {\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiFilePicker__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled {\\n  opacity: 0;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled ~ .euiFilePicker__prompt {\\n  color: #535966;\\n}\\nhtml.dark-theme .euiFilePicker__icon {\\n  position: absolute;\\n  left: 12px;\\n  top: 12px;\\n  transition: transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.dark-theme .euiFilePicker--compressed .euiFilePicker__icon {\\n  top: 8px;\\n  left: 8px;\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__icon {\\n  position: static;\\n  margin-bottom: 16px;\\n}\\nhtml.dark-theme .euiFilePicker__prompt {\\n  padding-left: 40px;\\n  /* 2 */\\n  height: 40px;\\n  padding-top: 12px;\\n  padding-right: 12px;\\n  padding-bottom: 12px;\\n  pointer-events: none;\\n  /* 1 */\\n  border: 2px dashed #343741;\\n  border-radius: 6px;\\n  transition: border-color 150ms ease-in, background-color 150ms ease-in;\\n}\\nhtml.dark-theme .euiFilePicker--compressed .euiFilePicker__prompt {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  padding-left: 32px;\\n  /* 2 */\\n  height: 32px;\\n  border-radius: 4px;\\n  box-shadow: none;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFilePicker--compressed .euiFilePicker__prompt {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__prompt {\\n  height: 128px;\\n  /* 4 */\\n  padding: 0 24px;\\n  display: flex;\\n  flex-direction: column;\\n  align-items: center;\\n  justify-content: center;\\n}\\nhtml.dark-theme .euiFilePicker--large.euiFilePicker--compressed .euiFilePicker__prompt {\\n  height: 104px;\\n  /* 4 */\\n}\\nhtml.dark-theme .euiFilePicker-isInvalid:not(.euiFilePicker__showDrop) .euiFilePicker__input:not(:disabled):not(:focus) + .euiFilePicker__prompt {\\n  border-color: #F86B63;\\n}\\nhtml.dark-theme .euiFilePicker__promptText {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  line-height: 16px;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) .euiFilePicker__promptText {\\n  color: #36A2EF;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__promptText {\\n  margin-top: -2px;\\n}\\nhtml.dark-theme .euiFilePicker__clearButton,\\nhtml.dark-theme .euiFilePicker__loadingSpinner {\\n  position: absolute;\\n  right: 12px;\\n  top: 12px;\\n}\\nhtml.dark-theme .euiFilePicker--compressed .euiFilePicker__clearButton,\\nhtml.dark-theme .euiFilePicker--compressed .euiFilePicker__loadingSpinner {\\n  top: 8px;\\n}\\nhtml.dark-theme .euiFilePicker__clearButton {\\n  pointer-events: auto;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton .euiFilePicker__clearIcon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #1D1E24;\\n  stroke: #1D1E24;\\n  stroke-width: 2px;\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__clearButton {\\n  position: relative;\\n  top: 0;\\n  right: 0;\\n}\\nhtml.dark-theme .euiFilePicker__showDrop .euiFilePicker__prompt,\\nhtml.dark-theme .euiFilePicker__input:focus + .euiFilePicker__prompt {\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  box-shadow: none;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-isLoading .euiFilePicker__prompt, html.dark-theme .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-hasFiles .euiFilePicker__prompt {\\n  padding-right: 40px;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  color: #DFE5EF;\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__promptText,\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__icon,\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\nhtml.dark-theme .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\nhtml.dark-theme .euiFilePicker--large.euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  font-weight: 700;\\n}\\nhtml.dark-theme .euiForm__error {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  list-style: disc;\\n}\\nhtml.dark-theme .euiForm__errors {\\n  margin-bottom: 16px;\\n}\\nhtml.dark-theme .euiSelect {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSelect--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiSelect--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiSelect--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiSelect {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiSelect::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSelect:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiSelect:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiSelect--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiSelect--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiSelect--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSelect--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiSelect--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSelect--inGroup {\\n  line-height: 38px;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSelect--inGroup.euiSelect--compressed {\\n  line-height: 30px;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSelect::-ms-expand {\\n  display: none;\\n}\\nhtml.dark-theme .euiSelect:focus::-ms-value {\\n  color: #DFE5EF;\\n  background: transparent;\\n}\\nhtml.dark-theme .euiSelect:-moz-focusring {\\n  color: transparent;\\n  text-shadow: 0 0 0 #DFE5EF;\\n}\\nhtml.dark-theme .euiSuperSelect__listbox {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 300px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n}\\nhtml.dark-theme .euiSuperSelect__listbox::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiSuperSelect__listbox::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiSuperSelect__listbox::-webkit-scrollbar-corner, html.dark-theme .euiSuperSelect__listbox::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiSuperSelect__item {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 8px;\\n}\\nhtml.dark-theme .euiSuperSelect__item:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiSuperSelect__item:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiSuperSelect__item:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #515761;\\n}\\nhtml.dark-theme .euiSuperSelect__item--hasDividers:not(:last-of-type) {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.dark-theme .euiSuperSelectControl {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  display: block;\\n  /* 2 */\\n  text-align: left;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\nhtml.dark-theme .euiSuperSelectControl--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiSuperSelectControl--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiSuperSelectControl {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiSuperSelectControl::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSuperSelectControl:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiSuperSelectControl:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiSuperSelectControl--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiSuperSelectControl-isInvalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSuperSelectControl__placeholder {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n}\\nhtml.dark-theme .euiSuperSelectControl.euiSuperSelect--isOpen__button {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFormControlLayout {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n}\\nhtml.dark-theme .euiFormControlLayout--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFormControlLayout--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFormControlLayout--inGroup {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiFormControlLayout--1icons {\\n  --eui-form-control-layout-icons-padding: 34px;\\n  padding-right: 34px;\\n}\\nhtml.dark-theme .euiFormControlLayout--1icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 26px;\\n  padding-right: 26px;\\n}\\nhtml.dark-theme .euiFormControlLayout--2icons {\\n  --eui-form-control-layout-icons-padding: 56px;\\n  padding-right: 56px;\\n}\\nhtml.dark-theme .euiFormControlLayout--2icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 44px;\\n  padding-right: 44px;\\n}\\nhtml.dark-theme .euiFormControlLayout--3icons {\\n  --eui-form-control-layout-icons-padding: 78px;\\n  padding-right: 78px;\\n}\\nhtml.dark-theme .euiFormControlLayout--3icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 62px;\\n  padding-right: 62px;\\n}\\nhtml.dark-theme .euiFormControlLayout--4icons {\\n  --eui-form-control-layout-icons-padding: 100px;\\n  padding-right: 100px;\\n}\\nhtml.dark-theme .euiFormControlLayout--4icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 80px;\\n  padding-right: 80px;\\n}\\nhtml.dark-theme .euiFormControlLayout--5icons {\\n  --eui-form-control-layout-icons-padding: 122px;\\n  padding-right: 122px;\\n}\\nhtml.dark-theme .euiFormControlLayout--5icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 98px;\\n  padding-right: 98px;\\n}\\nhtml.dark-theme .euiFormControlLayout__childrenWrapper {\\n  position: relative;\\n}\\nhtml.dark-theme .euiFormControlLayout--group {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFormControlLayout--group {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFormControlLayout--group > *,\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiText,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonIcon {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper {\\n  flex-grow: 1;\\n  overflow: hidden;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  flex-shrink: 0;\\n  height: 100%;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n  background-color: #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon, html.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty {\\n  transform: none !important;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon .euiIcon, html.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty .euiIcon {\\n  background: none !important;\\n  padding: 0;\\n  width: 16px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonIcon:not(:focus) {\\n  background-color: #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonIcon:focus-visible {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: -2px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  height: 100%;\\n  background-color: #2c2f37;\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group > .euiFormControlLayout__prepend,\\nhtml.dark-theme .euiFormControlLayout--group > .euiFormControlLayout__append {\\n  max-width: 50%;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  background-color: #2c2f37;\\n  padding: 12px;\\n  line-height: 16px !important;\\n  cursor: default !important;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper):not(input),\\nhtml.dark-theme .euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper):not(input) {\\n  margin-left: -12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonEmpty {\\n  border-right: none;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ .euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ * .euiButtonEmpty {\\n  border-right: none;\\n  border-left: none;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n  overflow: hidden;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  padding: 8px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper),\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper) {\\n  margin-left: -8px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -8px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--readOnly {\\n  cursor: default;\\n  background: #2c2f37;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--readOnly input {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFormControlLayoutDelimited {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited > .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  width: 100%;\\n  background-color: #16171c;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper, html.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper > *:not(.euiFormControlLayoutDelimited__delimiter):not(.euiFormControlLayoutIcons) {\\n  width: 100%;\\n  max-width: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled] {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled]::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled]:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled]::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled] .euiFormControlLayout__childrenWrapper {\\n  background-color: #202128;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] .euiFormControlLayout__childrenWrapper {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited--isInvalid .euiFormControlLayout__childrenWrapper {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited__input {\\n  box-shadow: none !important;\\n  border-radius: 0 !important;\\n  text-align: center;\\n  height: 100%;\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited__delimiter {\\n  align-self: stretch;\\n  flex-grow: 0;\\n  display: flex;\\n  align-items: center;\\n  line-height: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons {\\n  pointer-events: none;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons > * + * {\\n  margin-left: 6px;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons--absolute {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--absolute {\\n  left: 8px;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons--static {\\n  position: static;\\n  height: 100%;\\n  align-self: stretch;\\n  flex-grow: 0;\\n  padding-inline: 12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--static {\\n  padding-inline: 8px;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons--left {\\n  z-index: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 8px;\\n}\\nhtml.dark-theme *:disabled + .euiFormControlLayoutIcons {\\n  cursor: not-allowed;\\n  color: #535966;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton .euiFormControlLayoutClearButton__icon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #1D1E24;\\n  stroke: #1D1E24;\\n  stroke-width: 2px;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small {\\n  width: 12px;\\n  height: 12px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 12px;\\n  line-height: 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small .euiFormControlLayoutClearButton__icon {\\n  width: 6px;\\n  height: 6px;\\n  fill: #1D1E24;\\n  stroke: #1D1E24;\\n  stroke-width: 4px;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon {\\n  pointer-events: none;\\n  font-size: 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable .euiFormControlLayoutCustomIcon__icon {\\n  vertical-align: baseline;\\n  transform: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable:disabled {\\n  cursor: not-allowed;\\n  color: #535966;\\n}\\nhtml.dark-theme .euiFormErrorText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #F86B63;\\n}\\nhtml.dark-theme .euiFormLegend {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #DFE5EF;\\n  font-weight: 600;\\n}\\nhtml.dark-theme .euiFormLegend:not(.euiFormLegend-isHidden) {\\n  margin-bottom: 8px;\\n}\\nhtml.dark-theme .euiFormLegend:not(.euiFormLegend-isHidden).euiFormLegend--compressed {\\n  margin-bottom: 4px;\\n}\\nhtml.dark-theme .euiFormHelpText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #98A2B3;\\n}\\nhtml.dark-theme .euiFormLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #DFE5EF;\\n  font-weight: 600;\\n  display: inline-block;\\n  transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.dark-theme .euiFormLabel.euiFormLabel-isInvalid {\\n  color: #F86B63;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiFormLabel.euiFormLabel-isFocused {\\n  color: #36A2EF;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiFormLabel[for] {\\n  cursor: pointer;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiFormLabel[for].euiFormLabel-isDisabled {\\n  cursor: default;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiFormRow {\\n  display: flex;\\n  /* 1 */\\n  flex-direction: column;\\n  /* 1 */\\n  max-width: 400px;\\n}\\nhtml.dark-theme .euiFormRow + .euiFormRow,\\nhtml.dark-theme .euiFormRow + .euiButton {\\n  margin-top: 16px;\\n}\\nhtml.dark-theme .euiFormRow--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFormRow--hasEmptyLabelSpace {\\n  margin-top: 20px;\\n  /* 2 */\\n  min-height: 40px;\\n  padding-bottom: 0;\\n  justify-content: center;\\n}\\nhtml.dark-theme .euiFormRow__labelWrapper {\\n  display: flex;\\n  flex-wrap: wrap;\\n  justify-content: space-between;\\n  margin-bottom: 4px;\\n}\\nhtml.dark-theme .euiFormRow--horizontal {\\n  flex-direction: row;\\n  align-items: stretch;\\n}\\nhtml.dark-theme .euiFormRow--horizontal .euiFormRow__label {\\n  -webkit-hyphens: auto;\\n  -ms-hyphens: auto;\\n      hyphens: auto;\\n}\\nhtml.dark-theme .euiFormRow--horizontal .euiFormRow__labelWrapper {\\n  display: block;\\n  line-height: 31px;\\n  width: calc(33% - 8px);\\n  margin-right: 8px;\\n  margin-bottom: 0;\\n}\\nhtml.dark-theme .euiFormRow--horizontal .euiFormRow__fieldWrapper {\\n  width: 67%;\\n}\\nhtml.dark-theme .euiFormRow--horizontal + .euiFormRow--horizontal {\\n  margin-top: 8px;\\n}\\nhtml.dark-theme .euiFormRow--horizontal + .euiFormRow--horizontal.euiFormRow--hasSwitch {\\n  margin-top: 12px;\\n}\\nhtml.dark-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__labelWrapper {\\n  line-height: 19px;\\n  width: auto;\\n  min-width: calc(33% - 8px);\\n}\\nhtml.dark-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper {\\n  width: auto;\\n}\\nhtml.dark-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper .euiSwitch--compressed {\\n  margin-top: 2px;\\n}\\nhtml.dark-theme .euiFormRow--horizontal.euiFormRow--hasSwitch + .euiFormRow--horizontal {\\n  margin-top: 12px;\\n}\\nhtml.dark-theme .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 40px;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiFormRow--compressed.euiFormRow--hasEmptyLabelSpace {\\n  min-height: 32px;\\n}\\nhtml.dark-theme .euiFormRow--compressed .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 32px;\\n}\\nhtml.dark-theme .euiRadio {\\n  position: relative;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input ~ .euiRadio__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input + .euiRadio__circle {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 14px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:checked + .euiRadio__circle {\\n  border-color: #36A2EF;\\n  background-color: #36A2EF;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%2829, 30, 36%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input[disabled] ~ .euiRadio__label {\\n  color: #535966;\\n  cursor: not-allowed !important;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input[disabled] + .euiRadio__circle {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:checked[disabled] + .euiRadio__circle {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%28166, 170, 176%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiRadio.euiRadio--inList, html.dark-theme .euiRadio.euiRadio--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\nhtml.dark-theme .euiRadio.euiRadio--inList .euiRadio__input,\\nhtml.dark-theme .euiRadio.euiRadio--inList .euiRadio__circle, html.dark-theme .euiRadio.euiRadio--noLabel .euiRadio__input,\\nhtml.dark-theme .euiRadio.euiRadio--noLabel .euiRadio__circle {\\n  top: 0;\\n}\\nhtml.dark-theme .euiRadio.euiRadio--inList .euiRadio__input, html.dark-theme .euiRadio.euiRadio--noLabel .euiRadio__input {\\n  margin: 0;\\n}\\nhtml.dark-theme .euiRadioGroup__item + .euiRadioGroup__item {\\n  margin-top: 4px;\\n}\\nhtml.dark-theme .euiRadioGroup__item + .euiRadioGroup__item.euiRadio--compressed {\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiSwitch {\\n  position: relative;\\n  display: inline-flex;\\n  align-items: flex-start;\\n  min-height: 20px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__label {\\n  cursor: pointer;\\n  padding-left: 8px;\\n  line-height: 20px;\\n  font-size: 14px;\\n  vertical-align: middle;\\n  display: inline-block;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button {\\n  flex-shrink: 0;\\n  line-height: 0;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__body {\\n  background-color: rgba(152, 162, 179, 0.6);\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 0;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon {\\n  right: -8px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon.euiSwitch__icon--checked {\\n  right: auto;\\n  left: -34px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled:hover,\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled ~ .euiSwitch__label:hover {\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__body {\\n  background-color: rgba(152, 162, 179, 0.6);\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__thumb {\\n  background-color: rgba(0, 0, 0, 0);\\n  border-color: #98A2B3;\\n  box-shadow: none;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__icon {\\n  fill: #98A2B3;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled + .euiSwitch__label {\\n  color: #535966;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__body {\\n  pointer-events: none;\\n  width: 44px;\\n  height: 20px;\\n  background-color: #36A2EF;\\n  display: inline-block;\\n  position: relative;\\n  border-radius: 20px;\\n  vertical-align: middle;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__thumb {\\n  padding: 9px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 18px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  position: absolute;\\n  display: inline-block;\\n  left: 24px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__track {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  overflow: hidden;\\n  border-radius: 20px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__icon {\\n  position: absolute;\\n  right: -34px;\\n  top: 2px;\\n  bottom: 0;\\n  width: 42px;\\n  height: 16px;\\n  transition: left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), right 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  fill: #1D1E24;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__icon--checked {\\n  right: auto;\\n  left: -8px;\\n  fill: #1D1E24;\\n}\\nhtml.dark-theme .euiSwitch:hover .euiSwitch__button:not(:disabled) .euiSwitch__thumb {\\n  transform: scale(1.05);\\n}\\nhtml.dark-theme .euiSwitch:hover .euiSwitch__button:active .euiSwitch__thumb {\\n  transform: scale(0.95);\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed {\\n  min-height: 16px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__label {\\n  line-height: 16px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__body {\\n  width: 28px;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__thumb {\\n  padding: 6px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 12px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__track {\\n  border-radius: 16px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini {\\n  min-height: 10px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__label {\\n  line-height: 10px;\\n  font-size: 12px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__body {\\n  width: 22px;\\n  height: 10px;\\n  border-radius: 10px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__thumb {\\n  padding: 3px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 6px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__track {\\n  border-radius: 10px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb, html.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 1px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb, html.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb {\\n  border-color: #98A2B3;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true] .euiSwitch__thumb, html.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true] .euiSwitch__thumb {\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiTextArea {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  line-height: 1.5;\\n}\\nhtml.dark-theme .euiTextArea--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiTextArea--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiTextArea--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiTextArea {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiTextArea::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiTextArea:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiTextArea:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiTextArea--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiTextArea--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiTextArea--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiTextArea--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiTextArea, html.dark-theme .euiTextArea--compressed {\\n  height: auto;\\n}\\nhtml.dark-theme .euiFormControlLayout--euiTextArea {\\n  height: auto;\\n}\\nhtml.dark-theme .euiFormControlLayout--euiTextArea .euiFormControlLayoutIcons {\\n  top: auto;\\n  bottom: 12px;\\n}\\nhtml.dark-theme .euiTextArea--resizeVertical {\\n  resize: vertical;\\n}\\nhtml.dark-theme .euiTextArea--resizeHorizontal {\\n  resize: horizontal;\\n}\\nhtml.dark-theme .euiTextArea--resizeBoth {\\n  resize: both;\\n}\\nhtml.dark-theme .euiTextArea--resizeNone {\\n  resize: none;\\n}\\nhtml.dark-theme .euiMarkdownEditor {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .euiMarkdownEditor--isPreviewing .euiMarkdownEditor__toggleContainer {\\n  display: none;\\n}\\nhtml.dark-theme .euiMarkdownEditor--fullHeight {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiMarkdownEditor--fullHeight .euiMarkdownEditorTextArea {\\n  resize: none;\\n}\\nhtml.dark-theme .euiMarkdownEditor--fullHeight .euiMarkdownEditorDropZone {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone {\\n  display: flex;\\n  position: relative;\\n  flex-direction: column;\\n  min-height: \\\"150px\\\";\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone__input:hover {\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorFooter,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(54, 162, 239, 0.1) !important;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%) !important;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorFooter,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea:focus,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(248, 107, 99, 0.1) !important;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea,\\nhtml.dark-theme .euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%) !important;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__blockquote {\\n  border-left-color: rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiHorizontalRule {\\n  background-color: rgba(255, 255, 255, 0.15);\\n  color: rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table {\\n  border-left: 1px solid rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td {\\n  border-top: 1px solid rgba(255, 255, 255, 0.15);\\n  border-bottom: 1px solid rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__blockquote {\\n  border-left-color: #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiHorizontalRule {\\n  background-color: #7a7f89;\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table {\\n  border-left: 1px solid #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #7a7f89;\\n  border-bottom: 1px solid #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__blockquote {\\n  border-left-color: #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiHorizontalRule {\\n  background-color: #7DDED8;\\n  color: #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table {\\n  border-left: 1px solid #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #7DDED8;\\n  border-bottom: 1px solid #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiHorizontalRule {\\n  background-color: #F68FBE;\\n  color: #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F68FBE;\\n  border-bottom: 1px solid #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiHorizontalRule {\\n  background-color: #F3D371;\\n  color: #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F3D371;\\n  border-bottom: 1px solid #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiHorizontalRule {\\n  background-color: #F86B63;\\n  color: #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F86B63;\\n  border-bottom: 1px solid #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiHorizontalRule {\\n  background-color: #FFF;\\n  color: #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FFF;\\n  border-bottom: 1px solid #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat .euiCheckbox {\\n  margin-bottom: 0 !important;\\n}\\nhtml.dark-theme .euiMarkdownFormat .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  top: 50%;\\n  transform: translateY(-50%);\\n}\\nhtml.dark-theme .euiMarkdownFormat .euiMarkdownFormat__table {\\n  display: block;\\n  width: 100%;\\n  overflow: auto;\\n  border-spacing: 0;\\n  border-collapse: collapse;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter {\\n  display: inline-flex;\\n  padding: 4px;\\n  border: 1px solid #343741;\\n  align-items: center;\\n  background: #141519;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__popover {\\n  width: 300px;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__actions {\\n  flex: 1;\\n  display: inline-flex;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__actions > button,\\nhtml.dark-theme .euiMarkdownEditorFooter__actions > span {\\n  margin-right: 4px;\\n  align-self: center;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError {\\n  position: relative;\\n  left: -1px;\\n  line-height: 1;\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError > span {\\n  padding: 0 4px;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__helpButton > svg {\\n  width: 26px;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background: #1D1E24;\\n  min-height: \\\"150px\\\";\\n  overflow-y: auto;\\n  border: 1px solid #343741;\\n  padding: 12px;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview::-webkit-scrollbar-corner, html.dark-theme .euiMarkdownEditorPreview::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input ~ .euiCheckbox__label {\\n  cursor: default;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input:focus:not(:checked) + .euiCheckbox__square {\\n  border-color: #69696f;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  width: 100%;\\n  height: 100%;\\n  min-height: \\\"150px\\\";\\n  padding: 12px;\\n  border: 1px solid #343741;\\n  border-bottom: none;\\n  line-height: 1.5;\\n  resize: vertical;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  margin: 0;\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-corner, html.dark-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea:focus, html.dark-theme .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea-isReadOnly {\\n  background: #1D1E24;\\n  cursor: unset;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea-isReadOnly:focus, html.dark-theme .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea-isReadOnly {\\n  background: none;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar {\\n  display: flex;\\n  flex-wrap: wrap;\\n  background: #25262E;\\n  border: 1px solid #343741;\\n  border-color: #343741;\\n  border-bottom: none;\\n  padding: 4px;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar__buttons {\\n  display: flex;\\n  flex-wrap: wrap;\\n  flex: 1;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar__buttons > * {\\n  margin-right: 4px;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar__divider {\\n  content: \\\"\\\";\\n  height: 24px;\\n  display: block;\\n  margin-left: 4px;\\n  padding-right: 4px;\\n  border-left: 1px solid #343741;\\n}\\nhtml.dark-theme .euiMarkdownTooltip__icon {\\n  transform: translateY(-1px);\\n}\\nhtml.dark-theme .euiSelectable {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .euiSelectable-fullHeight {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiSelectableList:has(:focus-visible) {\\n  outline: 2px solid currentColor;\\n  outline-style: auto;\\n  outline-offset: 1px;\\n}\\nhtml.dark-theme .euiSelectableList-fullHeight {\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .euiSelectableList-bordered {\\n  overflow: hidden;\\n  border: 1px solid #343741;\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .euiSelectableList__list {\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\nhtml.dark-theme .euiSelectableList__list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiSelectableList__list::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiSelectableList__list::-webkit-scrollbar-corner, html.dark-theme .euiSelectableList__list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiSelectableList__list:focus, html.dark-theme .euiSelectableList__list > ul:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSelectableList__groupLabel {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #DFE5EF;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 700;\\n  display: flex;\\n  align-items: center;\\n  border-bottom: 1px solid #202128;\\n  padding: 4px 12px;\\n}\\nhtml.dark-theme .euiSelectableListItem {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  display: inline-flex;\\n  width: 100%;\\n  text-align: left;\\n  cursor: pointer;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiSelectableListItem:not(:last-of-type) {\\n  border-bottom: 1px solid #202128;\\n}\\nhtml.dark-theme .euiSelectableListItem-isFocused:not([aria-disabled=true]), html.dark-theme .euiSelectableListItem:hover:not([aria-disabled=true]) {\\n  color: #36A2EF;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiSelectableListItem-isFocused:not([aria-disabled=true]) .euiSelectableListItem__text, html.dark-theme .euiSelectableListItem:hover:not([aria-disabled=true]) .euiSelectableListItem__text {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiSelectableListItem[aria-disabled=true] {\\n  color: #535966;\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiSelectableListItem--paddingSmall .euiSelectableListItem__content {\\n  padding: 4px 12px;\\n}\\nhtml.dark-theme .euiSelectableListItem__content {\\n  width: 100%;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiSelectableListItem__icon,\\nhtml.dark-theme .euiSelectableListItem__prepend {\\n  margin-right: 12px;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .euiSelectableListItem__append {\\n  margin-left: 12px;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .euiSelectableListItem__text {\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .euiSelectableListItem__text--truncate {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .euiSelectableMessage {\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n  /* 1 */\\n  display: flex;\\n  flex-direction: column;\\n  justify-content: center;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiSelectableMessage--bordered {\\n  overflow: hidden;\\n  border: 1px solid #343741;\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__listItem .euiSelectableListItem__text {\\n  text-decoration: none !important;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__listItem[class*=-isFocused]:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle, html.dark-theme .euiSelectableTemplateSitewide__listItem:hover:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMetasList {\\n  display: block;\\n  margin-top: 4px;\\n  font-size: 12px;\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta:not(:last-of-type)::after {\\n  content: \\\"•\\\";\\n  margin: 0 4px;\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--application {\\n  color: #7ea6cc;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--deployment {\\n  color: #54B399;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--article {\\n  color: #ae96cb;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--case {\\n  color: #eb836e;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--platform {\\n  color: #D6BF57;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiTable {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-feature-settings: \\\"calt\\\" 1, \\\"kern\\\" 1, \\\"liga\\\" 1, \\\"tnum\\\" 1;\\n  width: 100%;\\n  table-layout: fixed;\\n  border: none;\\n  border-collapse: collapse;\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiTable.euiTable--auto {\\n  table-layout: auto;\\n}\\nhtml.dark-theme .euiTableCaption {\\n  position: relative;\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  html.dark-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  html.dark-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  html.dark-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\nhtml.dark-theme .euiTableFooterCell,\\nhtml.dark-theme .euiTableHeaderCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  font-weight: inherit;\\n  text-align: left;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #DFE5EF;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  font-weight: 500;\\n  border: none;\\n}\\nhtml.dark-theme .euiTableFooterCell .euiTableHeaderButton,\\nhtml.dark-theme .euiTableHeaderCell .euiTableHeaderButton {\\n  text-align: left;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiTableFooterCell .euiTableCellContent__text,\\nhtml.dark-theme .euiTableHeaderCell .euiTableCellContent__text {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 600;\\n}\\nhtml.dark-theme .euiTableHeaderButton {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  color: inherit;\\n  width: 100%;\\n}\\nhtml.dark-theme .euiTableHeaderButton:hover .euiTableCellContent__text, html.dark-theme .euiTableHeaderButton:focus .euiTableCellContent__text {\\n  text-decoration: underline;\\n  color: #36A2EF;\\n}\\nhtml.dark-theme .euiTableHeaderButton:hover .euiTableSortIcon, html.dark-theme .euiTableHeaderButton:focus .euiTableSortIcon {\\n  fill: #36A2EF;\\n}\\nhtml.dark-theme .euiTableSortIcon {\\n  margin-left: 4px;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .euiTableHeaderButton-isSorted .euiTableSortIcon {\\n  fill: #DFE5EF;\\n}\\nhtml.dark-theme .euiTableHeaderCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n  border: none;\\n}\\nhtml.dark-theme .euiTableRow:hover {\\n  background-color: #1e1e25;\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isClickable:hover {\\n  background-color: rgba(54, 162, 239, 0.05);\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isClickable:focus {\\n  background-color: rgba(54, 162, 239, 0.1);\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isExpandedRow {\\n  background-color: #1e1e25;\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isExpandedRow.euiTableRow-isSelectable .euiTableCellContent {\\n  padding-left: 40px;\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isSelected {\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isSelected:hover, html.dark-theme .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(27, 81, 120, 0.28);\\n}\\nhtml.dark-theme .euiTableRowCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  font-weight: inherit;\\n  text-align: left;\\n  color: #DFE5EF;\\n}\\nhtml.dark-theme .euiTableRowCell--top {\\n  vertical-align: top;\\n}\\nhtml.dark-theme .euiTableRowCell--bottom {\\n  vertical-align: bottom;\\n}\\nhtml.dark-theme .euiTableRowCell--baseline {\\n  vertical-align: baseline;\\n}\\nhtml.dark-theme .euiTableRowCell.euiTableRowCell--isMobileHeader {\\n  display: none;\\n}\\nhtml.dark-theme .euiTableRowCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n}\\nhtml.dark-theme .euiTableFooterCell {\\n  background-color: #25262E;\\n}\\nhtml.dark-theme .euiTableCellContent {\\n  overflow: hidden;\\n  /* 4 */\\n  display: flex;\\n  align-items: center;\\n  /* 1 */\\n  padding: 8px;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiTableCellContent__text {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 4 */\\n  min-width: 0;\\n  text-overflow: ellipsis;\\n}\\nhtml.dark-theme .euiTableCellContent--alignRight {\\n  justify-content: flex-end;\\n  text-align: right;\\n}\\nhtml.dark-theme .euiTableCellContent--alignCenter {\\n  justify-content: center;\\n  text-align: center;\\n}\\nhtml.dark-theme .euiTableHeaderCell,\\nhtml.dark-theme .euiTableFooterCell,\\nhtml.dark-theme .euiTableCellContent--truncateText {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .euiTableHeaderCell .euiTableCellContent__text,\\nhtml.dark-theme .euiTableFooterCell .euiTableCellContent__text,\\nhtml.dark-theme .euiTableCellContent--truncateText .euiTableCellContent__text {\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiTableCellContent--overflowingContent {\\n  overflow: visible;\\n  white-space: normal;\\n  word-break: break-word;\\n}\\nhtml.dark-theme .euiTableCellContent--showOnHover > *:not(:first-child) {\\n  margin-left: 8px;\\n}\\nhtml.dark-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n  flex-shrink: 0;\\n  opacity: 0.7;\\n  filter: grayscale(100%);\\n  transition: opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1), filter 250ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.dark-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n  filter: grayscale(0%);\\n  opacity: 0;\\n}\\nhtml.dark-theme .euiTableRow-hasActions:hover .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem,\\nhtml.dark-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover:focus-within .euiTableCellContent__hoverItem {\\n  opacity: 1;\\n  filter: grayscale(0%);\\n}\\nhtml.dark-theme .euiTableRow-isExpandedRow .euiTableCellContent {\\n  -webkit-animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n  animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n}\\n@-webkit-keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\n@keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\nhtml.dark-theme .euiTableRowCell__mobileHeader {\\n  display: none;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  html.dark-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  html.dark-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  html.dark-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #98A2B3;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n  html.dark-theme .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.2), 0 2.6px 8px -1px rgba(0, 0, 0, 0.15), 0 5.7px 12px -1px rgba(0, 0, 0, 0.125), 0 15px 15px -1px rgba(0, 0, 0, 0.1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #343741;\\n    box-shadow: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #141519;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #4a2b39;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #103148;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #264341;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #493f22;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #4a201e;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n    background-color: #1D1E24;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(83, 89, 102, 0.1) 0, rgba(83, 89, 102, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(83, 89, 102, 0.1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\nhtml.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(54, 162, 239, 0.2);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(83, 89, 102, 0.1) 0, rgba(83, 89, 102, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #98A2B3;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n  html.dark-theme .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.2), 0 2.6px 8px -1px rgba(0, 0, 0, 0.15), 0 5.7px 12px -1px rgba(0, 0, 0, 0.125), 0 15px 15px -1px rgba(0, 0, 0, 0.1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #343741;\\n    box-shadow: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #141519;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #4a2b39;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #103148;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #264341;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #493f22;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #4a201e;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n    background-color: #1D1E24;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(83, 89, 102, 0.1) 0, rgba(83, 89, 102, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(83, 89, 102, 0.1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\nhtml.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(54, 162, 239, 0.2);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(83, 89, 102, 0.1) 0, rgba(83, 89, 102, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\nhtml.dark-theme .euiTableHeaderMobile,\\nhtml.dark-theme .euiTableHeaderCell--hideForDesktop {\\n  display: none;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n  html.dark-theme .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n  html.dark-theme .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\nhtml.dark-theme .euiComboBox--appended .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 6px;\\n  border-bottom-left-radius: 6px;\\n}\\nhtml.dark-theme .euiComboBox--appended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n}\\nhtml.dark-theme .euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 6px;\\n  border-bottom-right-radius: 6px;\\n}\\nhtml.dark-theme .euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 4px;\\n  border-bottom-right-radius: 4px;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeLarge .euiDataGridRowCell {\\n  font-size: 16px;\\n  font-size: 1.1428571429rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.dark-theme .euiFormControlLayout--group {\\n  border-radius: 6px;\\n  background-color: #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend:first-child {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append:last-child {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group [class*=euiButton]:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: -2px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group [class*=euiButton]:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFormControlLayout--group [class*=euiButton]:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor:last-child [class*=euiButton],\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSuperSelectControl,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 6px 0 0 6px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSuperSelectControl,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  border-radius: 4px;\\n  background-color: #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed.euiFormControlLayout--readOnly input {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 4px 0 0 4px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child [class*=euiButton],\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited {\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 6px 0 0 6px;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 6px;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 4px 0 0 4px;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 4px;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 4px 4px 0;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus:focus-visible + .euiRadio__circle {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus:not(:focus-visible) + .euiRadio__circle {\\n  outline: none;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus:focus-visible + .euiCheckbox__square {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus:not(:focus-visible) + .euiCheckbox__square {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: none;\\n}\\nhtml.dark-theme .euiHue {\\n  position: relative;\\n  height: 12px;\\n  border-radius: 12px;\\n  margin: 8px 0;\\n}\\nhtml.dark-theme .euiHue::before, html.dark-theme .euiHue::after {\\n  display: none;\\n}\\nhtml.dark-theme .euiHue__range {\\n  top: -6px;\\n}\\nhtml.dark-theme .euiHue__range::-webkit-slider-thumb {\\n  border: 3px solid #1D1E24;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.dark-theme .euiHue__range::-moz-range-thumb {\\n  border: 3px solid #1D1E24;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.dark-theme .euiHue__range::-ms-thumb {\\n  border: 3px solid #1D1E24;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.dark-theme .euiHue__range:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border: 3px solid #1D1E24;\\n}\\nhtml.dark-theme .euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border: 3px solid #1D1E24;\\n}\\nhtml.dark-theme .euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border: 3px solid #1D1E24;\\n}\\nhtml.dark-theme .euiHue__range:focus:not(:focus-visible)::-webkit-slider-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.dark-theme .euiHue__range:focus:not(:focus-visible)::-moz-range-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.dark-theme .euiHue__range:focus:not(:focus-visible)::-ms-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.dark-theme .euiHue__range:focus:focus-visible {\\n  outline: none;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar {\\n  border-radius: 6px 6px 0 0;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea:focus:focus-visible {\\n  outline-style: none;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview,\\nhtml.dark-theme .euiMarkdownEditorFooter {\\n  border-radius: 0 0 6px 6px;\\n}\\nhtml.dark-theme *, html.dark-theme *::before, html.dark-theme *::after {\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme html, html.dark-theme body, html.dark-theme div, html.dark-theme span, html.dark-theme applet, html.dark-theme object, html.dark-theme iframe,\\nhtml.dark-theme h1, html.dark-theme h2, html.dark-theme h3, html.dark-theme h4, html.dark-theme h5, html.dark-theme h6, html.dark-theme p, html.dark-theme blockquote, html.dark-theme pre,\\nhtml.dark-theme a, html.dark-theme abbr, html.dark-theme acronym, html.dark-theme address, html.dark-theme big, html.dark-theme cite, html.dark-theme code,\\nhtml.dark-theme del, html.dark-theme dfn, html.dark-theme em, html.dark-theme img, html.dark-theme ins, html.dark-theme kbd, html.dark-theme q, html.dark-theme s, html.dark-theme samp,\\nhtml.dark-theme small, html.dark-theme strike, html.dark-theme strong, html.dark-theme sub, html.dark-theme sup, html.dark-theme tt, html.dark-theme var,\\nhtml.dark-theme b, html.dark-theme u, html.dark-theme i, html.dark-theme center,\\nhtml.dark-theme dl, html.dark-theme dt, html.dark-theme dd, html.dark-theme ol, html.dark-theme ul, html.dark-theme li,\\nhtml.dark-theme fieldset, html.dark-theme form, html.dark-theme label, html.dark-theme legend,\\nhtml.dark-theme table, html.dark-theme caption, html.dark-theme tbody, html.dark-theme tfoot, html.dark-theme thead, html.dark-theme tr, html.dark-theme th, html.dark-theme td,\\nhtml.dark-theme article, html.dark-theme aside, html.dark-theme canvas, html.dark-theme details, html.dark-theme embed,\\nhtml.dark-theme figure, html.dark-theme figcaption, html.dark-theme footer, html.dark-theme header, html.dark-theme hgroup,\\nhtml.dark-theme menu, html.dark-theme nav, html.dark-theme output, html.dark-theme ruby, html.dark-theme section, html.dark-theme summary,\\nhtml.dark-theme time, html.dark-theme mark, html.dark-theme audio, html.dark-theme video {\\n  margin: 0;\\n  padding: 0;\\n  border: none;\\n  vertical-align: baseline;\\n}\\nhtml.dark-theme code, html.dark-theme pre, html.dark-theme kbd, html.dark-theme samp {\\n  font-family: \\\"Roboto Mono\\\", Menlo, Courier, monospace;\\n}\\nhtml.dark-theme h1, html.dark-theme h2, html.dark-theme h3, html.dark-theme h4, html.dark-theme h5, html.dark-theme h6, html.dark-theme p {\\n  font-family: inherit;\\n  font-weight: inherit;\\n  font-size: inherit;\\n}\\nhtml.dark-theme input, html.dark-theme textarea, html.dark-theme select, html.dark-theme button {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n}\\nhtml.dark-theme em {\\n  font-style: italic;\\n}\\nhtml.dark-theme strong {\\n  font-weight: 700;\\n}\\nhtml.dark-theme article, html.dark-theme aside, html.dark-theme details, html.dark-theme figcaption, html.dark-theme figure,\\nhtml.dark-theme footer, html.dark-theme header, html.dark-theme hgroup, html.dark-theme menu, html.dark-theme nav, html.dark-theme section {\\n  display: block;\\n}\\nhtml.dark-theme html {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  height: 100%;\\n  background-color: #141519;\\n}\\nhtml.dark-theme body {\\n  line-height: 1;\\n}\\nhtml.dark-theme *:focus {\\n  outline: none;\\n}\\nhtml.dark-theme *:focus::-moz-focus-inner {\\n  border: none;\\n}\\nhtml.dark-theme *:focus:-moz-focusring {\\n  outline: none;\\n}\\nhtml.dark-theme a {\\n  text-decoration: none;\\n  color: #36A2EF;\\n}\\nhtml.dark-theme a:hover {\\n  text-decoration: none;\\n}\\nhtml.dark-theme a:focus {\\n  text-decoration: none;\\n  outline: none;\\n}\\nhtml.dark-theme a:hover, html.dark-theme button, html.dark-theme [role=button] {\\n  cursor: pointer;\\n}\\nhtml.dark-theme input {\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.dark-theme input:disabled {\\n  opacity: 1;\\n  /* required on iOS */\\n}\\nhtml.dark-theme button {\\n  background: none;\\n  border: none;\\n  padding: 0;\\n  margin: 0;\\n  outline: none;\\n  font-size: inherit;\\n  color: inherit;\\n  border-radius: 0;\\n}\\nhtml.dark-theme button:hover {\\n  cursor: pointer;\\n}\\nhtml.dark-theme ol, html.dark-theme ul {\\n  list-style: none;\\n}\\nhtml.dark-theme blockquote, html.dark-theme q {\\n  quotes: none;\\n}\\nhtml.dark-theme blockquote::before, html.dark-theme blockquote::after,\\nhtml.dark-theme q::before, html.dark-theme q::after {\\n  content: \\\"\\\";\\n  content: none;\\n}\\nhtml.dark-theme table {\\n  border-collapse: collapse;\\n  border-spacing: 0;\\n}\\nhtml.dark-theme hr {\\n  margin: 0;\\n}\\nhtml.dark-theme fieldset {\\n  min-inline-size: auto;\\n}\\nhtml.dark-theme svg text {\\n  letter-spacing: normal !important;\\n}\\nhtml.dark-theme html {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) #242529;\\n}\\nhtml.dark-theme html::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme html::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 4px solid #242529;\\n}\\nhtml.dark-theme html::-webkit-scrollbar-corner, html.dark-theme html::-webkit-scrollbar-track {\\n  background-color: #242529;\\n}\\nhtml.dark-theme svg text {\\n  letter-spacing: normal !important;\\n}\\nhtml.dark-theme html,\\nhtml.dark-theme body {\\n  font-family: Inter, BlinkMacSystemFont, Helvetica, Arial, sans-serif !important;\\n}\\nhtml.dark-theme .echChartStatus {\\n  visibility: hidden;\\n  pointer-events: none;\\n  z-index: -100000;\\n  width: 0;\\n  height: 0;\\n  position: absolute;\\n}\\nhtml.dark-theme .echChartBackground {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n}\\nhtml.dark-theme .echChart {\\n  height: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .echChart__titles {\\n  margin-right: 24px;\\n}\\nhtml.dark-theme .echChartContent {\\n  position: relative;\\n  display: flex;\\n  flex-direction: row;\\n  flex-grow: 1;\\n  height: 1px;\\n  width: 100%;\\n}\\nhtml.dark-theme .echChartContent--column {\\n  flex-direction: column;\\n}\\nhtml.dark-theme .echChartTitle {\\n  font-style: normal;\\n  font-weight: bold;\\n  font-size: 16px;\\n  line-height: 19px;\\n  padding: 8px;\\n  white-space: nowrap;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .echChartTitle + .echChartDescription {\\n  padding-top: 0;\\n}\\nhtml.dark-theme .echChartDescription {\\n  padding: 8px;\\n  font-style: normal;\\n  font-weight: normal;\\n  font-size: 14px;\\n  line-height: 17px;\\n  white-space: nowrap;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .echContainer {\\n  flex: 1;\\n  position: relative;\\n  overflow: hidden;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.dark-theme .echChartPointerContainer {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  right: 0;\\n  left: 0;\\n  box-sizing: border-box;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n}\\nhtml.dark-theme .echChartResizer {\\n  z-index: -10000000;\\n  position: absolute;\\n  bottom: 0;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme .echBrushTool {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  margin: 0;\\n  padding: 0;\\n  box-sizing: border-box;\\n  overflow: hidden;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echTooltip {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n  border-radius: 6px;\\n  background-color: black;\\n  color: #FFF;\\n  z-index: 9000;\\n  max-width: 256px;\\n  overflow-wrap: break-word;\\n  padding: 8px;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding: 0;\\n  max-width: 100%;\\n  pointer-events: none;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  background-color: #1D1E24;\\n  color: #DFE5EF;\\n  overflow: hidden;\\n  cursor: default;\\n  transition: box-shadow 400ms, opacity 250ms;\\n  border: 1px solid #1D1E24;\\n}\\nhtml.dark-theme .echTooltip .euiHorizontalRule {\\n  background-color: #333333;\\n}\\nhtml.dark-theme .echTooltip__outerWrapper {\\n  display: flex;\\n}\\nhtml.dark-theme .echTooltip--pinned {\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n  pointer-events: auto;\\n  -webkit-user-select: auto;\\n     -moz-user-select: auto;\\n      -ms-user-select: auto;\\n          user-select: auto;\\n}\\nhtml.dark-theme .echTooltip--pinned .echTooltip__tableRow--selectable {\\n  cursor: pointer;\\n}\\nhtml.dark-theme .echTooltip--pinned .echTooltipActions {\\n  pointer-events: auto;\\n}\\nhtml.dark-theme .echTooltip--pinned .echTooltip__tableWrapper {\\n  pointer-events: auto;\\n}\\nhtml.dark-theme .echTooltip .echTooltip__tableCell--truncate {\\n  text-overflow: ellipsis;\\n  display: -webkit-box;\\n  -webkit-line-clamp: 2;\\n  /* number of lines to show */\\n  line-clamp: 2;\\n  -webkit-box-orient: vertical;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .echTooltip__metricRow {\\n  padding: 4px 8px;\\n  display: flex;\\n  justify-content: space-between;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper {\\n  overflow: hidden;\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper::-webkit-scrollbar-corner, html.dark-theme .echTooltip__tableWrapper::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper--pinned {\\n  overflow: auto;\\n}\\nhtml.dark-theme .echTooltip__table {\\n  display: grid;\\n  width: 100%;\\n}\\nhtml.dark-theme .echTooltip__table--noGrid {\\n  display: table;\\n}\\nhtml.dark-theme .echTooltip__tableHeader .echTooltip__tableCell, html.dark-theme .echTooltip__tableFooter .echTooltip__tableCell {\\n  cursor: default;\\n  font-weight: 600;\\n  background-color: #1D1E24;\\n  position: sticky;\\n  z-index: 1;\\n}\\nhtml.dark-theme .echTooltip__tableHeader, html.dark-theme .echTooltip__tableBody, html.dark-theme .echTooltip__tableFooter, html.dark-theme .echTooltip__tableRow {\\n  display: contents;\\n}\\nhtml.dark-theme .echTooltip__tableHeader {\\n  margin-bottom: 0;\\n  top: 0;\\n}\\nhtml.dark-theme .echTooltip__tableHeader .echTooltip__tableCell {\\n  border-bottom: solid 1px #343741;\\n  top: 0;\\n}\\nhtml.dark-theme .echTooltip__tableFooter {\\n  margin-top: 0;\\n  bottom: 0;\\n}\\nhtml.dark-theme .echTooltip__tableFooter .echTooltip__tableCell {\\n  border-top: solid 1px #343741;\\n  bottom: 0;\\n}\\nhtml.dark-theme .echTooltip__tableCell:not(.echTooltip__colorCell) {\\n  padding: 4px;\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableCell:not(.echTooltip__colorCell) {\\n  padding: 2px 4px;\\n  transition: margin 200ms, padding 200ms;\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(27, 81, 120, 0.28);\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__colorCell + .echTooltip__tableCell {\\n  margin-left: 10px;\\n  padding-left: 10px;\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected:hover .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected:hover .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(27, 81, 120, 0.28);\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selectable:hover .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selectable:hover .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(54, 162, 239, 0.05);\\n}\\nhtml.dark-theme .echTooltip__tableRow {\\n  position: relative;\\n}\\nhtml.dark-theme .echTooltip__tableRow--highlighted .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.dark-theme .echTooltip__tableRow--highlighted .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(52, 55, 65, 0.5);\\n}\\nhtml.dark-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip {\\n  width: 21px;\\n}\\nhtml.dark-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip--spacer {\\n  width: 0;\\n  min-width: 0;\\n}\\nhtml.dark-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip--icon {\\n  opacity: 1;\\n}\\nhtml.dark-theme .echTooltip__colorCell {\\n  padding: 0;\\n  height: 100%;\\n  position: relative;\\n  overflow: hidden;\\n  width: 21px;\\n}\\nhtml.dark-theme .echTooltip__colorCell--static {\\n  width: 5px;\\n}\\nhtml.dark-theme .echTooltip__colorStrip, html.dark-theme .echTooltip__colorStrip--bg, html.dark-theme .echTooltip__colorStrip--spacer {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  bottom: 0;\\n  width: 5px;\\n  transition: width 200ms;\\n}\\nhtml.dark-theme .echTooltip__colorStrip--icon {\\n  opacity: 0;\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  height: 100%;\\n  transition: opacity 200ms;\\n  padding: 0 4px;\\n}\\nhtml.dark-theme .echTooltip__colorStrip--spacer {\\n  left: auto;\\n  right: 10px;\\n  width: 6px;\\n  min-width: 6px;\\n}\\nhtml.dark-theme .echTooltip__label {\\n  min-width: 1px;\\n  flex: 1 1 auto;\\n  text-align: left;\\n}\\nhtml.dark-theme .echTooltip__value {\\n  text-align: right;\\n  font-feature-settings: \\\"tnum\\\";\\n}\\nhtml.dark-theme .echTooltip[dir=rtl] .echTooltip__colorStrip {\\n  left: auto;\\n  right: 0;\\n}\\nhtml.dark-theme .echTooltipHeader {\\n  font-weight: 600;\\n  margin-bottom: 0;\\n  padding: 4px 8px;\\n}\\nhtml.dark-theme .echTooltipFooter {\\n  font-weight: 600;\\n  margin-top: 0;\\n  padding: 4px 8px;\\n}\\nhtml.dark-theme .echTooltipDivider {\\n  width: 100%;\\n  border-bottom: solid 1px #343741;\\n}\\n@keyframes promptSlideDown {\\n  100% {\\n    opacity: 1;\\n    top: 0;\\n    height: 26px;\\n  }\\n}\\nhtml.dark-theme .echTooltipPrompt {\\n  position: relative;\\n  width: 100%;\\n  z-index: -1;\\n}\\nhtml.dark-theme .echTooltipPrompt__content {\\n  color: #7a7f89;\\n  font-style: normal;\\n  font-size: 12px;\\n  line-height: 26px;\\n  padding: 0 8px;\\n}\\nhtml.dark-theme .echTooltipPrompt.slideDown {\\n  opacity: 0;\\n  top: -26px;\\n  height: 0;\\n  -webkit-animation: promptSlideDown 0.25s forwards;\\n          animation: promptSlideDown 0.25s forwards;\\n  -webkit-animation-delay: 1.5s;\\n          animation-delay: 1.5s;\\n}\\nhtml.dark-theme .echTooltipActions {\\n  position: relative;\\n  display: flex;\\n  align-items: flex-start;\\n  flex-direction: column;\\n  width: 100%;\\n  font-style: normal;\\n  font-size: 12px;\\n  line-height: 21px;\\n}\\nhtml.dark-theme .echTooltipActions__prompt {\\n  position: relative;\\n  height: 26px;\\n  padding: 0 8px;\\n  line-height: 26px;\\n  width: 100%;\\n  color: #7a7f89;\\n  font-style: normal;\\n  font-size: 12px;\\n}\\nhtml.dark-theme .echTooltipActions__action {\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n  display: block;\\n  text-align: left;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 21px;\\n  cursor: pointer;\\n  color: #DFE5EF;\\n}\\nhtml.dark-theme .echTooltipActions__action:nth-child(2) {\\n  padding-top: 4px;\\n}\\nhtml.dark-theme .echTooltipActions__action:last-child {\\n  padding-bottom: 2px;\\n}\\nhtml.dark-theme .echTooltipActions__action:hover, html.dark-theme .echTooltipActions__action:focus {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .echTooltipActions__action[disabled] {\\n  cursor: default;\\n  color: #515761;\\n}\\nhtml.dark-theme .echTooltipActions__action[disabled]:hover, html.dark-theme .echTooltipActions__action[disabled]:focus {\\n  text-decoration: none;\\n}\\nhtml.dark-theme [id^=echTooltipPortal] {\\n  pointer-events: none;\\n}\\nhtml.dark-theme [id^=echAnchor] {\\n  position: absolute;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echTooltipPortal__invisible {\\n  position: fixed;\\n  visibility: hidden;\\n  width: 0;\\n  height: 0;\\n}\\nhtml.dark-theme .echIcon {\\n  flex-shrink: 0;\\n  display: inline-block;\\n  vertical-align: middle;\\n  fill: currentColor;\\n}\\nhtml.dark-theme .echIcon svg {\\n  transform: translate(0, 0);\\n}\\nhtml.dark-theme .echIcon:focus {\\n  opacity: 1;\\n  background: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .echLegend .echLegendList {\\n  display: grid;\\n  grid-template-columns: minmax(0, 1fr);\\n  -webkit-padding-start: 0;\\n          padding-inline-start: 0;\\n  -webkit-padding-end: 0;\\n          padding-inline-end: 0;\\n  -webkit-margin-before: 0;\\n          margin-block-start: 0;\\n  -webkit-margin-after: 0;\\n          margin-block-end: 0;\\n}\\nhtml.dark-theme .echLegend--horizontal .echLegendList {\\n  grid-column-gap: 24px;\\n  grid-row-gap: 8px;\\n  margin-top: 8px;\\n  margin-bottom: 8px;\\n}\\nhtml.dark-theme .echLegend--top, html.dark-theme .echLegend--left {\\n  order: 0;\\n}\\nhtml.dark-theme .echLegend--bottom, html.dark-theme .echLegend--right {\\n  order: 1;\\n}\\nhtml.dark-theme .echLegend--debug {\\n  background: rgba(238, 130, 238, 0.2);\\n  position: relative;\\n}\\nhtml.dark-theme .echLegend--inert {\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n          mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  width: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer::-webkit-scrollbar-corner, html.dark-theme .echLegend .echLegendListContainer::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer :focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 1px;\\n  background-color: rgba(54, 162, 239, 0.2);\\n  border-radius: 3px;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer :focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer :focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .echLegendItem {\\n  color: #DFE5EF;\\n  display: flex;\\n  flex-wrap: nowrap;\\n  justify-content: space-between;\\n  align-items: flex-start;\\n  position: relative;\\n}\\nhtml.dark-theme .echLegendItem .colorWrapper > *:first-of-type {\\n  height: 18px;\\n}\\nhtml.dark-theme .echLegendItem:not([dir=rtl]) > *:not(.background) {\\n  margin-left: 4px;\\n}\\nhtml.dark-theme .echLegendItem:not([dir=rtl]) > *:not(.background):last-child:not(.echLegendItem__extra) {\\n  margin-right: 4px;\\n}\\nhtml.dark-theme .echLegendItem[dir=rtl] > *:not(.background) {\\n  margin-right: 4px;\\n}\\nhtml.dark-theme .echLegendItem[dir=rtl] > *:not(.background):last-child:not(.echLegendItem__extra) {\\n  margin-left: 4px;\\n}\\nhtml.dark-theme .echLegendItem:not(html.dark-theme .echLegendItem--hidden) .echLegendItem__color--changable {\\n  cursor: pointer;\\n}\\nhtml.dark-theme .echLegendItem:hover .background {\\n  background-color: #25262E;\\n}\\nhtml.dark-theme .echLegendItem .background {\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  z-index: -1;\\n}\\nhtml.dark-theme .echLegendItem__action {\\n  cursor: pointer;\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  height: 18px;\\n  max-width: calc(18px + 8px);\\n}\\nhtml.dark-theme .echLegendItem__action .euiPopover,\\nhtml.dark-theme .echLegendItem__action .euiPopover__anchor,\\nhtml.dark-theme .echLegendItem__action .euiPopover__anchor > *:first-child {\\n  height: 100%;\\n  width: 100%;\\n  display: flex;\\n}\\nhtml.dark-theme .echLegendItem__color {\\n  display: flex;\\n  line-height: 1.5;\\n  align-items: center;\\n}\\nhtml.dark-theme .echLegendItem__label {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  flex: 1 1 auto;\\n  text-align: left;\\n  vertical-align: baseline;\\n  letter-spacing: unset;\\n  align-items: center;\\n  overflow-wrap: break-word;\\n  word-wrap: break-word;\\n  word-break: break-all;\\n  word-break: break-word;\\n  -webkit-hyphens: auto;\\n      -ms-hyphens: auto;\\n          hyphens: auto;\\n  overflow: hidden;\\n  min-width: 1px;\\n}\\nhtml.dark-theme .echLegendItem__label--singleline {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .echLegendItem__label--multiline:is(div) {\\n  display: -webkit-box;\\n  -webkit-box-orient: vertical;\\n  -webkit-line-clamp: 2;\\n}\\nhtml.dark-theme .echLegendItem__label--clickable:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .echLegendItem__extra {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  text-align: right;\\n  flex: 0 0 auto;\\n  margin-left: 4px;\\n  font-feature-settings: \\\"tnum\\\";\\n  letter-spacing: unset;\\n  direction: ltr;\\n}\\nhtml.dark-theme .echLegendItem--vertical {\\n  padding-top: 2px;\\n  padding-bottom: 2px;\\n}\\nhtml.dark-theme .echLegendItem--vertical:first-of-type {\\n  margin-top: 2px;\\n}\\nhtml.dark-theme .echLegendItem--vertical .background {\\n  margin-top: 2px;\\n  margin-bottom: 2px;\\n}\\nhtml.dark-theme .echLegendItem--hidden {\\n  color: #98A2B3;\\n}\\nhtml.dark-theme .echLegendItem[dir=rtl] .echLegendItem__label {\\n  text-align: right;\\n}\\nhtml.dark-theme .echReactiveChart_noResults {\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  width: 100%;\\n  height: 100%;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  color: #98A2B3;\\n}\\nhtml.dark-theme .echGridContainer {\\n  display: grid;\\n  width: 100%;\\n  height: 100%;\\n  align-content: start;\\n  justify-content: stretch;\\n  align-items: stretch;\\n  -webkit-user-select: text;\\n     -moz-user-select: text;\\n      -ms-user-select: text;\\n          user-select: text;\\n}\\nhtml.dark-theme .echGridCell {\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n  overflow: hidden;\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.dark-theme .echGridCell--rightBorder {\\n  border-right: 1px solid #343741;\\n}\\nhtml.dark-theme .echGridCell--bottomBorder {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.dark-theme .echAlignedGrid {\\n  display: grid;\\n  align-content: stretch;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.dark-theme .echAlignedGrid--header {\\n  width: 100%;\\n  height: 100%;\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.dark-theme .echAlignedGrid__borderRight {\\n  border-right: 1px solid #edf0f5;\\n}\\nhtml.dark-theme .echAlignedGrid__borderBottom {\\n  border-bottom: 1px solid #edf0f5;\\n}\\nhtml.dark-theme .echAlignedGrid--content {\\n  width: 100%;\\n  min-height: 0;\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.dark-theme .echHighlighter {\\n  position: absolute;\\n  pointer-events: none;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.dark-theme .echHighlighterOverlay__fill {\\n  fill: rgba(255, 255, 255, 0.2);\\n}\\nhtml.dark-theme .echHighlighterOverlay__stroke {\\n  stroke: rgba(255, 255, 255, 0.2);\\n}\\nhtml.dark-theme .echHighlighter__mask {\\n  fill: rgba(29, 30, 36, 0.5);\\n}\\nhtml.dark-theme .echCrosshair,\\nhtml.dark-theme .echCrosshair__cursor,\\nhtml.dark-theme .echCrosshair__crossLine {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echScreenReaderOnly {\\n  position: absolute;\\n  left: -10000px;\\n  top: auto;\\n  width: 1px;\\n  height: 1px;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .echScreenReaderOnlyDebug {\\n  left: 0 !important;\\n  top: 0 !important;\\n  right: 0 !important;\\n  bottom: 0 !important;\\n  width: 100% !important;\\n  height: 100% !important;\\n  overflow: auto !important;\\n  background: rgba(255, 255, 255, 0.8);\\n}\\nhtml.dark-theme .echScreenReaderOnlyDebug table,\\nhtml.dark-theme .echScreenReaderOnlyDebug td,\\nhtml.dark-theme .echScreenReaderOnlyDebug th {\\n  border: 1px solid black;\\n  font-size: 12px;\\n}\\nhtml.dark-theme .echScreenReaderTable {\\n  overflow-x: auto;\\n  text-align: left;\\n}\\nhtml.dark-theme .echAnnotation {\\n  padding: 0;\\n  transition: opacity 250ms;\\n  pointer-events: none;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  max-width: 260px;\\n}\\nhtml.dark-theme .echAnnotation__marker {\\n  position: absolute;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  font-size: 12px;\\n  font-weight: 700;\\n  line-height: normal;\\n}\\nhtml.dark-theme .echAnnotation__details {\\n  padding: 4px 8px;\\n}\\nhtml.dark-theme .echAnnotation__icon {\\n  position: relative;\\n}\\nhtml.dark-theme .echAnnotation__body {\\n  white-space: nowrap;\\n}\\nhtml.dark-theme .echCanvasRenderer {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  padding: 0;\\n  margin: 0;\\n  border: 0;\\n  background: transparent;\\n}\\nhtml.dark-theme .echMetricContainer {\\n  display: grid;\\n  width: 100%;\\n  height: 100%;\\n  align-content: start;\\n  justify-content: stretch;\\n  align-items: stretch;\\n  -webkit-user-select: text;\\n     -moz-user-select: text;\\n      -ms-user-select: text;\\n          user-select: text;\\n}\\nhtml.dark-theme .echMetric {\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n  overflow: hidden;\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.dark-theme .echMetric .echMetric--outline {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echMetric:focus-within .echMetric--outline {\\n  outline: auto;\\n  outline-offset: -1.5px;\\n}\\nhtml.dark-theme .echMetric:focus-within button {\\n  outline: none;\\n}\\nhtml.dark-theme .echMetric--rightBorder {\\n  border-right: 1px solid #343741;\\n}\\nhtml.dark-theme .echMetric--topBorder {\\n  border-top: 1px solid #343741;\\n}\\nhtml.dark-theme .echMetric--bottomBorder {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.dark-theme .echMetric--vertical.echMetric--withProgressBar--small {\\n  padding-left: 10px;\\n}\\nhtml.dark-theme .echMetric--vertical.echMetric--withTargetProgressBar--small {\\n  padding-left: 14px;\\n}\\nhtml.dark-theme .echMetric--horizontal.echMetric--withProgressBar--small {\\n  padding-bottom: 10px;\\n}\\nhtml.dark-theme .echMetric--horizontal.echMetric--withTargetProgressBar--small {\\n  padding-bottom: 12px;\\n}\\nhtml.dark-theme .echMetricEmpty {\\n  position: absolute;\\n  bottom: 9px;\\n  right: 11px;\\n  width: 20px;\\n  border-bottom: 1px solid;\\n}\\nhtml.dark-theme .echMetricText {\\n  position: relative;\\n  padding: 8px;\\n  height: 100%;\\n  z-index: 1;\\n  display: grid;\\n  grid-template-columns: 100%;\\n  grid-template-rows: -webkit-min-content -webkit-min-content auto -webkit-min-content -webkit-min-content;\\n  grid-template-rows: min-content min-content auto min-content min-content;\\n  text-align: left;\\n  line-height: 1.2;\\n}\\nhtml.dark-theme .echMetricText__title {\\n  font-weight: bold;\\n  word-wrap: break-word;\\n}\\nhtml.dark-theme .echMetricText__title button {\\n  font-weight: bold;\\n  width: 100%;\\n  text-align: left;\\n}\\nhtml.dark-theme .echMetricText__icon {\\n  position: absolute;\\n  right: 8px;\\n  top: 8px;\\n}\\nhtml.dark-theme .echMetricText__subtitle {\\n  padding-top: 5px;\\n  font-weight: normal;\\n  text-align: left;\\n}\\nhtml.dark-theme .echMetricText__extra {\\n  text-align: right;\\n  font-weight: normal;\\n}\\nhtml.dark-theme .echMetricText__value {\\n  position: relative;\\n  font-weight: bold;\\n  text-align: right;\\n  white-space: nowrap;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .echMetricText__valueIcon {\\n  display: inline-block;\\n  position: absolute;\\n  right: 8px;\\n  bottom: 8px;\\n}\\nhtml.dark-theme .echMetricText__part {\\n  font-weight: bold;\\n}\\nhtml.dark-theme .echMetricText__gap {\\n  position: relative;\\n}\\nhtml.dark-theme .echMetricText__body {\\n  overflow: hidden;\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n}\\nhtml.dark-theme .echSingleMetricProgress {\\n  position: absolute;\\n}\\nhtml.dark-theme .echSingleMetricProgress--vertical {\\n  left: 0;\\n  right: 0;\\n  top: 0;\\n  bottom: 0;\\n  height: 100%;\\n  width: 100%;\\n}\\nhtml.dark-theme .echSingleMetricProgress--vertical.echSingleMetricProgress--small {\\n  right: auto;\\n  width: 10px;\\n}\\nhtml.dark-theme .echSingleMetricProgress--horizontal {\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  top: 0;\\n  bottom: 0;\\n  height: 100%;\\n}\\nhtml.dark-theme .echSingleMetricProgress--horizontal.echSingleMetricProgress--small {\\n  top: auto;\\n  height: 10px;\\n}\\nhtml.dark-theme .echSingleMetricProgressBar {\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.dark-theme .echSingleMetricProgressBar--vertical {\\n  position: absolute;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  width: 100%;\\n}\\nhtml.dark-theme .echSingleMetricProgressBar--horizontal {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  height: 100%;\\n}\\nhtml.dark-theme .echSingleMetricTarget {\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  overflow: visible;\\n  z-index: 1;\\n}\\nhtml.dark-theme .echSingleMetricTarget--vertical {\\n  transform: rotate(90deg);\\n  position: absolute;\\n  left: 100%;\\n  bottom: 0;\\n}\\nhtml.dark-theme .echSingleMetricTarget--horizontal {\\n  position: absolute;\\n  bottom: 100%;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline {\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  overflow: visible;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline--vertical {\\n  position: absolute;\\n  left: 0;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline--vertical.echSingleMetricZeroBaseline--small {\\n  right: auto;\\n  height: 2px;\\n  width: 13px;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline--horizontal {\\n  position: absolute;\\n  bottom: 0;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline--horizontal.echSingleMetricZeroBaseline--small {\\n  top: auto;\\n  width: 2px;\\n  height: 13px;\\n}\\nhtml.dark-theme .echSingleMetricSparkline {\\n  position: absolute;\\n  overflow: hidden;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n}\\nhtml.dark-theme .echSingleMetricSparkline__svg {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.dark-theme .echSingleMetricSparkline__svg rect,\\nhtml.dark-theme .echSingleMetricSparkline__svg path {\\n  transition: fill ease-in-out 0.1s;\\n}\\nhtml.dark-theme .echSingleMetricChart--small {\\n  position: absolute;\\n  top: auto;\\n  left: auto;\\n  bottom: 0;\\n  right: 0;\\n  width: 100px;\\n  height: 30px;\\n}\\nhtml.dark-theme:not(.legacy) {\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n}\\nhtml.dark-theme:not(.legacy) body,\\nhtml.dark-theme:not(.legacy) .echChart {\\n  background: #1D1E24 !important;\\n}\\nhtml.dark-theme:not(.legacy) .euiText {\\n  color: #DFE5EF;\\n}\\nhtml.legacy.dark-theme body,\\nhtml.legacy.dark-theme .echChart {\\n  background: black !important;\\n}\\nhtml.legacy.light-theme body,\\nhtml.legacy.light-theme .echChart {\\n  background: white !important;\\n}\\nhtml.disable-animations *,\\nhtml.disable-animations *::after,\\nhtml.disable-animations *::before {\\n  transition-delay: 0s !important;\\n  transition-duration: 0s !important;\\n  -webkit-animation-delay: -0.0001s !important;\\n          animation-delay: -0.0001s !important;\\n  -webkit-animation-duration: 0s !important;\\n          animation-duration: 0s !important;\\n  -webkit-animation-play-state: paused !important;\\n          animation-play-state: paused !important;\\n  caret-color: transparent !important;\\n}\\nhtml.disable-animations .echLegend .echLegendListContainer :focus {\\n  -webkit-animation-duration: 0s !important;\\n          animation-duration: 0s !important;\\n}\\nhtml.disable-animations .euiSaturation:focus .euiSaturation__indicator {\\n  -webkit-animation: none !important;\\n          animation: none !important;\\n}\\nhtml.echVisualTesting,\\nhtml.echVisualTesting body,\\nhtml.echVisualTesting #root {\\n  background: blanchedalmond !important;\\n}\\nhtml.echVisualTesting #story-header {\\n  display: none;\\n}\\nhtml.echVisualTesting #root {\\n  width: 785px;\\n  height: 1000px;\\n  display: flex;\\n  align-items: center;\\n}\\n\\nbody {\\n  min-height: 100%;\\n}\\n\\n#root {\\n  z-index: 200;\\n  position: relative;\\n}\\n\\n#story-root {\\n  padding: 20px;\\n  min-width: 100%;\\n  min-height: 400px;\\n  position: relative;\\n  z-index: 500;\\n  box-sizing: border-box;\\n}\\n#story-root.showChartBoundary {\\n  background-color: blanchedalmond;\\n}\\n#story-root.resizeHeight {\\n  height: 0;\\n}\\n\\n#story-resize-wrapper {\\n  resize: both;\\n  height: 100%;\\n  width: 100%;\\n  overflow: auto;\\n  max-width: 100%;\\n  max-height: 80vh;\\n}\\n#story-resize-wrapper.e2e-server {\\n  resize: none;\\n}\\n\\n#story-header {\\n  padding: 20px 40px 16px;\\n}\\n\\n.sb-show-main {\\n  padding: 0 !important;\\n}\\n\\n.echChart {\\n  box-sizing: border-box;\\n}\\n\\n.echInvisible {\\n  visibility: hidden;\\n}\\n\\n#story-root + div table {\\n  border: 1px solid gray;\\n}\\n\\n#story-root + div table th {\\n  border: 1px solid gray;\\n  padding: 5px;\\n}\\n\\n#story-root + div table td {\\n  border: 1px solid gray;\\n  padding: 5px;\\n}\\n\\n.Pane.vertical.Pane1 {\\n  background: red;\\n}\\n\\n.euiPopover__anchor {\\n  width: 100%;\\n}\\n\\n.resizable {\\n  resize: both;\\n  overflow: auto;\\n  width: 500px;\\n  height: 600px;\\n}\", \"\"]);\n// Exports\nmodule.exports = exports;\n","var map = {\n\t\"./af\": \"../node_modules/moment/locale/af.js\",\n\t\"./af.js\": \"../node_modules/moment/locale/af.js\",\n\t\"./ar\": \"../node_modules/moment/locale/ar.js\",\n\t\"./ar-dz\": \"../node_modules/moment/locale/ar-dz.js\",\n\t\"./ar-dz.js\": \"../node_modules/moment/locale/ar-dz.js\",\n\t\"./ar-kw\": \"../node_modules/moment/locale/ar-kw.js\",\n\t\"./ar-kw.js\": \"../node_modules/moment/locale/ar-kw.js\",\n\t\"./ar-ly\": \"../node_modules/moment/locale/ar-ly.js\",\n\t\"./ar-ly.js\": \"../node_modules/moment/locale/ar-ly.js\",\n\t\"./ar-ma\": \"../node_modules/moment/locale/ar-ma.js\",\n\t\"./ar-ma.js\": \"../node_modules/moment/locale/ar-ma.js\",\n\t\"./ar-sa\": \"../node_modules/moment/locale/ar-sa.js\",\n\t\"./ar-sa.js\": \"../node_modules/moment/locale/ar-sa.js\",\n\t\"./ar-tn\": \"../node_modules/moment/locale/ar-tn.js\",\n\t\"./ar-tn.js\": \"../node_modules/moment/locale/ar-tn.js\",\n\t\"./ar.js\": \"../node_modules/moment/locale/ar.js\",\n\t\"./az\": \"../node_modules/moment/locale/az.js\",\n\t\"./az.js\": \"../node_modules/moment/locale/az.js\",\n\t\"./be\": \"../node_modules/moment/locale/be.js\",\n\t\"./be.js\": \"../node_modules/moment/locale/be.js\",\n\t\"./bg\": \"../node_modules/moment/locale/bg.js\",\n\t\"./bg.js\": \"../node_modules/moment/locale/bg.js\",\n\t\"./bm\": \"../node_modules/moment/locale/bm.js\",\n\t\"./bm.js\": \"../node_modules/moment/locale/bm.js\",\n\t\"./bn\": \"../node_modules/moment/locale/bn.js\",\n\t\"./bn-bd\": \"../node_modules/moment/locale/bn-bd.js\",\n\t\"./bn-bd.js\": \"../node_modules/moment/locale/bn-bd.js\",\n\t\"./bn.js\": \"../node_modules/moment/locale/bn.js\",\n\t\"./bo\": \"../node_modules/moment/locale/bo.js\",\n\t\"./bo.js\": \"../node_modules/moment/locale/bo.js\",\n\t\"./br\": \"../node_modules/moment/locale/br.js\",\n\t\"./br.js\": \"../node_modules/moment/locale/br.js\",\n\t\"./bs\": \"../node_modules/moment/locale/bs.js\",\n\t\"./bs.js\": \"../node_modules/moment/locale/bs.js\",\n\t\"./ca\": \"../node_modules/moment/locale/ca.js\",\n\t\"./ca.js\": \"../node_modules/moment/locale/ca.js\",\n\t\"./cs\": \"../node_modules/moment/locale/cs.js\",\n\t\"./cs.js\": \"../node_modules/moment/locale/cs.js\",\n\t\"./cv\": \"../node_modules/moment/locale/cv.js\",\n\t\"./cv.js\": \"../node_modules/moment/locale/cv.js\",\n\t\"./cy\": \"../node_modules/moment/locale/cy.js\",\n\t\"./cy.js\": \"../node_modules/moment/locale/cy.js\",\n\t\"./da\": \"../node_modules/moment/locale/da.js\",\n\t\"./da.js\": \"../node_modules/moment/locale/da.js\",\n\t\"./de\": \"../node_modules/moment/locale/de.js\",\n\t\"./de-at\": \"../node_modules/moment/locale/de-at.js\",\n\t\"./de-at.js\": \"../node_modules/moment/locale/de-at.js\",\n\t\"./de-ch\": \"../node_modules/moment/locale/de-ch.js\",\n\t\"./de-ch.js\": \"../node_modules/moment/locale/de-ch.js\",\n\t\"./de.js\": \"../node_modules/moment/locale/de.js\",\n\t\"./dv\": \"../node_modules/moment/locale/dv.js\",\n\t\"./dv.js\": \"../node_modules/moment/locale/dv.js\",\n\t\"./el\": \"../node_modules/moment/locale/el.js\",\n\t\"./el.js\": \"../node_modules/moment/locale/el.js\",\n\t\"./en-au\": \"../node_modules/moment/locale/en-au.js\",\n\t\"./en-au.js\": \"../node_modules/moment/locale/en-au.js\",\n\t\"./en-ca\": \"../node_modules/moment/locale/en-ca.js\",\n\t\"./en-ca.js\": \"../node_modules/moment/locale/en-ca.js\",\n\t\"./en-gb\": \"../node_modules/moment/locale/en-gb.js\",\n\t\"./en-gb.js\": \"../node_modules/moment/locale/en-gb.js\",\n\t\"./en-ie\": \"../node_modules/moment/locale/en-ie.js\",\n\t\"./en-ie.js\": \"../node_modules/moment/locale/en-ie.js\",\n\t\"./en-il\": \"../node_modules/moment/locale/en-il.js\",\n\t\"./en-il.js\": \"../node_modules/moment/locale/en-il.js\",\n\t\"./en-in\": \"../node_modules/moment/locale/en-in.js\",\n\t\"./en-in.js\": \"../node_modules/moment/locale/en-in.js\",\n\t\"./en-nz\": \"../node_modules/moment/locale/en-nz.js\",\n\t\"./en-nz.js\": \"../node_modules/moment/locale/en-nz.js\",\n\t\"./en-sg\": \"../node_modules/moment/locale/en-sg.js\",\n\t\"./en-sg.js\": \"../node_modules/moment/locale/en-sg.js\",\n\t\"./eo\": \"../node_modules/moment/locale/eo.js\",\n\t\"./eo.js\": \"../node_modules/moment/locale/eo.js\",\n\t\"./es\": \"../node_modules/moment/locale/es.js\",\n\t\"./es-do\": \"../node_modules/moment/locale/es-do.js\",\n\t\"./es-do.js\": \"../node_modules/moment/locale/es-do.js\",\n\t\"./es-mx\": \"../node_modules/moment/locale/es-mx.js\",\n\t\"./es-mx.js\": \"../node_modules/moment/locale/es-mx.js\",\n\t\"./es-us\": \"../node_modules/moment/locale/es-us.js\",\n\t\"./es-us.js\": \"../node_modules/moment/locale/es-us.js\",\n\t\"./es.js\": \"../node_modules/moment/locale/es.js\",\n\t\"./et\": \"../node_modules/moment/locale/et.js\",\n\t\"./et.js\": \"../node_modules/moment/locale/et.js\",\n\t\"./eu\": \"../node_modules/moment/locale/eu.js\",\n\t\"./eu.js\": \"../node_modules/moment/locale/eu.js\",\n\t\"./fa\": \"../node_modules/moment/locale/fa.js\",\n\t\"./fa.js\": \"../node_modules/moment/locale/fa.js\",\n\t\"./fi\": \"../node_modules/moment/locale/fi.js\",\n\t\"./fi.js\": \"../node_modules/moment/locale/fi.js\",\n\t\"./fil\": \"../node_modules/moment/locale/fil.js\",\n\t\"./fil.js\": \"../node_modules/moment/locale/fil.js\",\n\t\"./fo\": \"../node_modules/moment/locale/fo.js\",\n\t\"./fo.js\": \"../node_modules/moment/locale/fo.js\",\n\t\"./fr\": \"../node_modules/moment/locale/fr.js\",\n\t\"./fr-ca\": \"../node_modules/moment/locale/fr-ca.js\",\n\t\"./fr-ca.js\": \"../node_modules/moment/locale/fr-ca.js\",\n\t\"./fr-ch\": \"../node_modules/moment/locale/fr-ch.js\",\n\t\"./fr-ch.js\": \"../node_modules/moment/locale/fr-ch.js\",\n\t\"./fr.js\": \"../node_modules/moment/locale/fr.js\",\n\t\"./fy\": \"../node_modules/moment/locale/fy.js\",\n\t\"./fy.js\": \"../node_modules/moment/locale/fy.js\",\n\t\"./ga\": \"../node_modules/moment/locale/ga.js\",\n\t\"./ga.js\": \"../node_modules/moment/locale/ga.js\",\n\t\"./gd\": \"../node_modules/moment/locale/gd.js\",\n\t\"./gd.js\": \"../node_modules/moment/locale/gd.js\",\n\t\"./gl\": \"../node_modules/moment/locale/gl.js\",\n\t\"./gl.js\": \"../node_modules/moment/locale/gl.js\",\n\t\"./gom-deva\": \"../node_modules/moment/locale/gom-deva.js\",\n\t\"./gom-deva.js\": \"../node_modules/moment/locale/gom-deva.js\",\n\t\"./gom-latn\": \"../node_modules/moment/locale/gom-latn.js\",\n\t\"./gom-latn.js\": \"../node_modules/moment/locale/gom-latn.js\",\n\t\"./gu\": \"../node_modules/moment/locale/gu.js\",\n\t\"./gu.js\": \"../node_modules/moment/locale/gu.js\",\n\t\"./he\": \"../node_modules/moment/locale/he.js\",\n\t\"./he.js\": \"../node_modules/moment/locale/he.js\",\n\t\"./hi\": \"../node_modules/moment/locale/hi.js\",\n\t\"./hi.js\": \"../node_modules/moment/locale/hi.js\",\n\t\"./hr\": \"../node_modules/moment/locale/hr.js\",\n\t\"./hr.js\": \"../node_modules/moment/locale/hr.js\",\n\t\"./hu\": \"../node_modules/moment/locale/hu.js\",\n\t\"./hu.js\": \"../node_modules/moment/locale/hu.js\",\n\t\"./hy-am\": \"../node_modules/moment/locale/hy-am.js\",\n\t\"./hy-am.js\": \"../node_modules/moment/locale/hy-am.js\",\n\t\"./id\": \"../node_modules/moment/locale/id.js\",\n\t\"./id.js\": \"../node_modules/moment/locale/id.js\",\n\t\"./is\": \"../node_modules/moment/locale/is.js\",\n\t\"./is.js\": \"../node_modules/moment/locale/is.js\",\n\t\"./it\": \"../node_modules/moment/locale/it.js\",\n\t\"./it-ch\": \"../node_modules/moment/locale/it-ch.js\",\n\t\"./it-ch.js\": \"../node_modules/moment/locale/it-ch.js\",\n\t\"./it.js\": \"../node_modules/moment/locale/it.js\",\n\t\"./ja\": \"../node_modules/moment/locale/ja.js\",\n\t\"./ja.js\": \"../node_modules/moment/locale/ja.js\",\n\t\"./jv\": \"../node_modules/moment/locale/jv.js\",\n\t\"./jv.js\": \"../node_modules/moment/locale/jv.js\",\n\t\"./ka\": \"../node_modules/moment/locale/ka.js\",\n\t\"./ka.js\": \"../node_modules/moment/locale/ka.js\",\n\t\"./kk\": \"../node_modules/moment/locale/kk.js\",\n\t\"./kk.js\": \"../node_modules/moment/locale/kk.js\",\n\t\"./km\": \"../node_modules/moment/locale/km.js\",\n\t\"./km.js\": \"../node_modules/moment/locale/km.js\",\n\t\"./kn\": \"../node_modules/moment/locale/kn.js\",\n\t\"./kn.js\": \"../node_modules/moment/locale/kn.js\",\n\t\"./ko\": \"../node_modules/moment/locale/ko.js\",\n\t\"./ko.js\": \"../node_modules/moment/locale/ko.js\",\n\t\"./ku\": \"../node_modules/moment/locale/ku.js\",\n\t\"./ku.js\": \"../node_modules/moment/locale/ku.js\",\n\t\"./ky\": \"../node_modules/moment/locale/ky.js\",\n\t\"./ky.js\": \"../node_modules/moment/locale/ky.js\",\n\t\"./lb\": \"../node_modules/moment/locale/lb.js\",\n\t\"./lb.js\": \"../node_modules/moment/locale/lb.js\",\n\t\"./lo\": \"../node_modules/moment/locale/lo.js\",\n\t\"./lo.js\": \"../node_modules/moment/locale/lo.js\",\n\t\"./lt\": \"../node_modules/moment/locale/lt.js\",\n\t\"./lt.js\": \"../node_modules/moment/locale/lt.js\",\n\t\"./lv\": \"../node_modules/moment/locale/lv.js\",\n\t\"./lv.js\": \"../node_modules/moment/locale/lv.js\",\n\t\"./me\": \"../node_modules/moment/locale/me.js\",\n\t\"./me.js\": \"../node_modules/moment/locale/me.js\",\n\t\"./mi\": \"../node_modules/moment/locale/mi.js\",\n\t\"./mi.js\": \"../node_modules/moment/locale/mi.js\",\n\t\"./mk\": \"../node_modules/moment/locale/mk.js\",\n\t\"./mk.js\": \"../node_modules/moment/locale/mk.js\",\n\t\"./ml\": \"../node_modules/moment/locale/ml.js\",\n\t\"./ml.js\": \"../node_modules/moment/locale/ml.js\",\n\t\"./mn\": \"../node_modules/moment/locale/mn.js\",\n\t\"./mn.js\": \"../node_modules/moment/locale/mn.js\",\n\t\"./mr\": \"../node_modules/moment/locale/mr.js\",\n\t\"./mr.js\": \"../node_modules/moment/locale/mr.js\",\n\t\"./ms\": \"../node_modules/moment/locale/ms.js\",\n\t\"./ms-my\": \"../node_modules/moment/locale/ms-my.js\",\n\t\"./ms-my.js\": \"../node_modules/moment/locale/ms-my.js\",\n\t\"./ms.js\": \"../node_modules/moment/locale/ms.js\",\n\t\"./mt\": \"../node_modules/moment/locale/mt.js\",\n\t\"./mt.js\": \"../node_modules/moment/locale/mt.js\",\n\t\"./my\": \"../node_modules/moment/locale/my.js\",\n\t\"./my.js\": \"../node_modules/moment/locale/my.js\",\n\t\"./nb\": \"../node_modules/moment/locale/nb.js\",\n\t\"./nb.js\": \"../node_modules/moment/locale/nb.js\",\n\t\"./ne\": \"../node_modules/moment/locale/ne.js\",\n\t\"./ne.js\": \"../node_modules/moment/locale/ne.js\",\n\t\"./nl\": \"../node_modules/moment/locale/nl.js\",\n\t\"./nl-be\": \"../node_modules/moment/locale/nl-be.js\",\n\t\"./nl-be.js\": \"../node_modules/moment/locale/nl-be.js\",\n\t\"./nl.js\": \"../node_modules/moment/locale/nl.js\",\n\t\"./nn\": \"../node_modules/moment/locale/nn.js\",\n\t\"./nn.js\": \"../node_modules/moment/locale/nn.js\",\n\t\"./oc-lnc\": \"../node_modules/moment/locale/oc-lnc.js\",\n\t\"./oc-lnc.js\": \"../node_modules/moment/locale/oc-lnc.js\",\n\t\"./pa-in\": \"../node_modules/moment/locale/pa-in.js\",\n\t\"./pa-in.js\": \"../node_modules/moment/locale/pa-in.js\",\n\t\"./pl\": \"../node_modules/moment/locale/pl.js\",\n\t\"./pl.js\": \"../node_modules/moment/locale/pl.js\",\n\t\"./pt\": \"../node_modules/moment/locale/pt.js\",\n\t\"./pt-br\": \"../node_modules/moment/locale/pt-br.js\",\n\t\"./pt-br.js\": \"../node_modules/moment/locale/pt-br.js\",\n\t\"./pt.js\": \"../node_modules/moment/locale/pt.js\",\n\t\"./ro\": \"../node_modules/moment/locale/ro.js\",\n\t\"./ro.js\": \"../node_modules/moment/locale/ro.js\",\n\t\"./ru\": \"../node_modules/moment/locale/ru.js\",\n\t\"./ru.js\": \"../node_modules/moment/locale/ru.js\",\n\t\"./sd\": \"../node_modules/moment/locale/sd.js\",\n\t\"./sd.js\": \"../node_modules/moment/locale/sd.js\",\n\t\"./se\": \"../node_modules/moment/locale/se.js\",\n\t\"./se.js\": \"../node_modules/moment/locale/se.js\",\n\t\"./si\": \"../node_modules/moment/locale/si.js\",\n\t\"./si.js\": \"../node_modules/moment/locale/si.js\",\n\t\"./sk\": \"../node_modules/moment/locale/sk.js\",\n\t\"./sk.js\": \"../node_modules/moment/locale/sk.js\",\n\t\"./sl\": \"../node_modules/moment/locale/sl.js\",\n\t\"./sl.js\": \"../node_modules/moment/locale/sl.js\",\n\t\"./sq\": \"../node_modules/moment/locale/sq.js\",\n\t\"./sq.js\": \"../node_modules/moment/locale/sq.js\",\n\t\"./sr\": \"../node_modules/moment/locale/sr.js\",\n\t\"./sr-cyrl\": \"../node_modules/moment/locale/sr-cyrl.js\",\n\t\"./sr-cyrl.js\": \"../node_modules/moment/locale/sr-cyrl.js\",\n\t\"./sr.js\": \"../node_modules/moment/locale/sr.js\",\n\t\"./ss\": \"../node_modules/moment/locale/ss.js\",\n\t\"./ss.js\": \"../node_modules/moment/locale/ss.js\",\n\t\"./sv\": \"../node_modules/moment/locale/sv.js\",\n\t\"./sv.js\": \"../node_modules/moment/locale/sv.js\",\n\t\"./sw\": \"../node_modules/moment/locale/sw.js\",\n\t\"./sw.js\": \"../node_modules/moment/locale/sw.js\",\n\t\"./ta\": \"../node_modules/moment/locale/ta.js\",\n\t\"./ta.js\": \"../node_modules/moment/locale/ta.js\",\n\t\"./te\": \"../node_modules/moment/locale/te.js\",\n\t\"./te.js\": \"../node_modules/moment/locale/te.js\",\n\t\"./tet\": \"../node_modules/moment/locale/tet.js\",\n\t\"./tet.js\": \"../node_modules/moment/locale/tet.js\",\n\t\"./tg\": \"../node_modules/moment/locale/tg.js\",\n\t\"./tg.js\": \"../node_modules/moment/locale/tg.js\",\n\t\"./th\": \"../node_modules/moment/locale/th.js\",\n\t\"./th.js\": \"../node_modules/moment/locale/th.js\",\n\t\"./tk\": \"../node_modules/moment/locale/tk.js\",\n\t\"./tk.js\": \"../node_modules/moment/locale/tk.js\",\n\t\"./tl-ph\": \"../node_modules/moment/locale/tl-ph.js\",\n\t\"./tl-ph.js\": \"../node_modules/moment/locale/tl-ph.js\",\n\t\"./tlh\": \"../node_modules/moment/locale/tlh.js\",\n\t\"./tlh.js\": \"../node_modules/moment/locale/tlh.js\",\n\t\"./tr\": \"../node_modules/moment/locale/tr.js\",\n\t\"./tr.js\": \"../node_modules/moment/locale/tr.js\",\n\t\"./tzl\": \"../node_modules/moment/locale/tzl.js\",\n\t\"./tzl.js\": \"../node_modules/moment/locale/tzl.js\",\n\t\"./tzm\": \"../node_modules/moment/locale/tzm.js\",\n\t\"./tzm-latn\": \"../node_modules/moment/locale/tzm-latn.js\",\n\t\"./tzm-latn.js\": \"../node_modules/moment/locale/tzm-latn.js\",\n\t\"./tzm.js\": \"../node_modules/moment/locale/tzm.js\",\n\t\"./ug-cn\": \"../node_modules/moment/locale/ug-cn.js\",\n\t\"./ug-cn.js\": \"../node_modules/moment/locale/ug-cn.js\",\n\t\"./uk\": \"../node_modules/moment/locale/uk.js\",\n\t\"./uk.js\": \"../node_modules/moment/locale/uk.js\",\n\t\"./ur\": \"../node_modules/moment/locale/ur.js\",\n\t\"./ur.js\": \"../node_modules/moment/locale/ur.js\",\n\t\"./uz\": \"../node_modules/moment/locale/uz.js\",\n\t\"./uz-latn\": \"../node_modules/moment/locale/uz-latn.js\",\n\t\"./uz-latn.js\": \"../node_modules/moment/locale/uz-latn.js\",\n\t\"./uz.js\": \"../node_modules/moment/locale/uz.js\",\n\t\"./vi\": \"../node_modules/moment/locale/vi.js\",\n\t\"./vi.js\": \"../node_modules/moment/locale/vi.js\",\n\t\"./x-pseudo\": \"../node_modules/moment/locale/x-pseudo.js\",\n\t\"./x-pseudo.js\": \"../node_modules/moment/locale/x-pseudo.js\",\n\t\"./yo\": \"../node_modules/moment/locale/yo.js\",\n\t\"./yo.js\": \"../node_modules/moment/locale/yo.js\",\n\t\"./zh-cn\": \"../node_modules/moment/locale/zh-cn.js\",\n\t\"./zh-cn.js\": \"../node_modules/moment/locale/zh-cn.js\",\n\t\"./zh-hk\": \"../node_modules/moment/locale/zh-hk.js\",\n\t\"./zh-hk.js\": \"../node_modules/moment/locale/zh-hk.js\",\n\t\"./zh-mo\": \"../node_modules/moment/locale/zh-mo.js\",\n\t\"./zh-mo.js\": \"../node_modules/moment/locale/zh-mo.js\",\n\t\"./zh-tw\": \"../node_modules/moment/locale/zh-tw.js\",\n\t\"./zh-tw.js\": \"../node_modules/moment/locale/zh-tw.js\"\n};\n\n\nfunction webpackContext(req) {\n\tvar id = webpackContextResolve(req);\n\treturn __webpack_require__(id);\n}\nfunction webpackContextResolve(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t}\n\treturn map[req];\n}\nwebpackContext.keys = function webpackContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackContext.resolve = webpackContextResolve;\nmodule.exports = webpackContext;\nwebpackContext.id = \"../node_modules/moment/locale sync recursive ^\\\\.\\\\/.*$\";","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { BulletRenderer } from './renderer/canvas';\nimport { canDisplayChartTitles } from './selectors/can_display_chart_titles';\nimport { getTooltipAnchor } from './selectors/get_tooltip_anchor';\nimport { getTooltipInfo } from './selectors/get_tooltip_info';\nimport { isTooltipVisible } from './selectors/is_tooltip_visible';\nimport { ChartType } from '../../chart_types';\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { LegendItem } from '../../common/legend';\nimport { Tooltip } from '../../components/tooltip/tooltip';\nimport { BackwardRef, GlobalChartState, InternalChartState } from '../../state/chart_state';\nimport { InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { LegendItemLabel } from '../../state/selectors/get_legend_items_labels';\n\nconst EMPTY_MAP = new Map();\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\nconst EMPTY_LEGEND_ITEM_LIST: LegendItemLabel[] = [];\n\n/** @internal */\nexport class BulletState implements InternalChartState {\n  chartType = ChartType.Bullet;\n  getChartTypeDescription = () => 'Bullet Graph';\n  chartRenderer = (containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) => (\n    <>\n      <BulletRenderer forwardStageRef={forwardStageRef} />\n      <Tooltip getChartContainerRef={containerRef} />\n    </>\n  );\n\n  isInitialized = () => InitStatus.Initialized;\n  isBrushAvailable = () => false;\n  isBrushing = () => false;\n  isChartEmpty = () => false;\n  getLegendItems = () => EMPTY_LEGEND_LIST;\n  getLegendItemsLabels = () => EMPTY_LEGEND_ITEM_LIST;\n  getLegendExtraValues = () => EMPTY_MAP;\n  getPointerCursor = () => DEFAULT_CSS_CURSOR;\n  isTooltipVisible(globalState: GlobalChartState) {\n    return isTooltipVisible(globalState);\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfo(globalState);\n  }\n\n  getTooltipAnchor(globalState: GlobalChartState) {\n    return getTooltipAnchor(globalState);\n  }\n\n  eventCallbacks = () => {};\n  getProjectionContainerArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getMainProjectionArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getBrushArea = () => null;\n  getDebugState = () => ({});\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles(globalState: GlobalChartState) {\n    return canDisplayChartTitles(globalState);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { angularBullet, horizontalBullet, verticalBullet } from './sub_types';\nimport { Color, Colors } from '../../../../common/colors';\nimport { Ratio } from '../../../../common/geometry';\nimport { cssFontShorthand } from '../../../../common/text_utils';\nimport { withContext, clearCanvas } from '../../../../renderers/canvas';\nimport { A11ySettings } from '../../../../state/selectors/get_accessibility_config';\nimport { renderDebugPoint, renderDebugRect } from '../../../xy_chart/renderer/canvas/utils/debug';\nimport { ActiveValue } from '../../selectors/get_active_values';\nimport { BulletDimensions } from '../../selectors/get_panel_dimensions';\nimport { BulletSpec, BulletSubtype } from '../../spec';\nimport {\n  BulletStyle,\n  FONT_PADDING,\n  HEADER_PADDING,\n  SUBTITLE_FONT,\n  SUBTITLE_FONT_SIZE,\n  TARGET_FONT,\n  TARGET_FONT_SIZE,\n  TITLE_FONT,\n  TITLE_FONT_SIZE,\n  TITLE_LINE_SPACING,\n  VALUE_FONT,\n  VALUE_FONT_SIZE,\n  getMaxTargetValueAssent,\n  getTextAscentHeight,\n} from '../../theme';\n\n/** @internal */\nexport function renderBullet(\n  ctx: CanvasRenderingContext2D,\n  dpr: Ratio,\n  props: {\n    debug: boolean;\n    spec?: BulletSpec;\n    a11y: A11ySettings;\n    dimensions: BulletDimensions;\n    activeValues: (ActiveValue | null)[][];\n    style: BulletStyle;\n    backgroundColor: Color;\n  },\n) {\n  const { debug, style, dimensions, activeValues, spec, backgroundColor } = props;\n  withContext(ctx, (ctx) => {\n    ctx.scale(dpr, dpr);\n    clearCanvas(ctx, backgroundColor);\n\n    // clear only if need to render metric or no spec available\n    if (!spec || dimensions.shouldRenderMetric) {\n      return;\n    }\n\n    // render each Small multiple\n    ctx.fillStyle = backgroundColor;\n\n    // layout.headerLayout.forEach((row, rowIndex) =>\n    dimensions.rows.forEach((row, rowIndex) =>\n      row.forEach((bulletGraph, columnIndex) => {\n        if (!bulletGraph) return;\n        const { panel, multiline } = bulletGraph;\n        withContext(ctx, (ctx) => {\n          const verticalAlignment = dimensions.layoutAlignment[rowIndex]!;\n          const activeValue = activeValues?.[rowIndex]?.[columnIndex];\n\n          if (debug) {\n            renderDebugRect(ctx, panel);\n          }\n\n          // move to panel origin\n          ctx.translate(panel.x, panel.y);\n\n          // paint right border\n          ctx.strokeStyle = style.border;\n          // TODO: check paddings\n          if (row.length > 1 && columnIndex < row.length - 1) {\n            ctx.beginPath();\n            ctx.moveTo(panel.width, 0);\n            ctx.lineTo(panel.width, panel.height);\n            ctx.stroke();\n          }\n\n          if (dimensions.rows.length > 1 && columnIndex < dimensions.rows.length) {\n            ctx.beginPath();\n            ctx.moveTo(0, panel.height);\n            ctx.lineTo(panel.width, panel.height);\n            ctx.stroke();\n          }\n\n          // this helps render the header without considering paddings\n          ctx.translate(HEADER_PADDING.left, HEADER_PADDING.top);\n\n          ctx.textBaseline = 'alphabetic';\n\n          const MAX_TARGET_VALUE_ASCENT = getMaxTargetValueAssent(bulletGraph.target);\n          const commonYBaseline = // to share baseline with value and target\n            Math.max(\n              getTextAscentHeight(TITLE_FONT_SIZE, verticalAlignment.maxTitleRows, TITLE_LINE_SPACING) +\n                (verticalAlignment.maxSubtitleRows > 0 ? FONT_PADDING : 0) +\n                getTextAscentHeight(SUBTITLE_FONT_SIZE, verticalAlignment.maxSubtitleRows),\n              verticalAlignment.multiline ? 0 : MAX_TARGET_VALUE_ASCENT,\n            );\n\n          // Title\n          ctx.fillStyle = props.style.textColor;\n          ctx.textAlign = 'start';\n          ctx.font = cssFontShorthand(TITLE_FONT, TITLE_FONT_SIZE);\n\n          const titleYBaseline =\n            commonYBaseline -\n            getTextAscentHeight(SUBTITLE_FONT_SIZE, verticalAlignment.maxSubtitleRows) -\n            (verticalAlignment.maxSubtitleRows > 0 ? FONT_PADDING : 0);\n\n          bulletGraph.title\n            .slice()\n            .reverse()\n            .forEach((titleLine, lineIndex) => {\n              const y = titleYBaseline - lineIndex * (getTextAscentHeight(TITLE_FONT_SIZE) + TITLE_LINE_SPACING);\n              ctx.fillText(titleLine, 0, y);\n            });\n\n          // Subtitle\n          if (bulletGraph.subtitle) {\n            ctx.font = cssFontShorthand(SUBTITLE_FONT, SUBTITLE_FONT_SIZE);\n            ctx.fillText(bulletGraph.subtitle, 0, commonYBaseline);\n          }\n\n          // Value\n          ctx.font = cssFontShorthand(VALUE_FONT, VALUE_FONT_SIZE);\n          if (!multiline) ctx.textAlign = 'end';\n          {\n            const y = commonYBaseline + (multiline ? MAX_TARGET_VALUE_ASCENT + FONT_PADDING : 0);\n            const x = multiline ? 0 : bulletGraph.header.width - bulletGraph.targetWidth;\n\n            ctx.fillText(bulletGraph.value, x, y);\n          }\n\n          // Target\n          if (bulletGraph.target) {\n            ctx.font = cssFontShorthand(TARGET_FONT, TARGET_FONT_SIZE);\n            if (!multiline) ctx.textAlign = 'end';\n            const x = multiline ? bulletGraph.valueWidth : bulletGraph.header.width;\n            const y = commonYBaseline + (multiline ? MAX_TARGET_VALUE_ASCENT + FONT_PADDING : 0);\n            ctx.fillText(bulletGraph.target, x, y);\n          }\n\n          ctx.translate(-HEADER_PADDING.left, -HEADER_PADDING.top);\n\n          const { graphArea } = bulletGraph;\n\n          if (spec.subtype !== BulletSubtype.horizontal) {\n            ctx.strokeStyle = style.border;\n            ctx.beginPath();\n            ctx.moveTo(HEADER_PADDING.left, graphArea.origin.y);\n            ctx.lineTo(panel.width - HEADER_PADDING.right, graphArea.origin.y);\n            ctx.stroke();\n          }\n\n          withContext(ctx, (ctx) => {\n            ctx.translate(graphArea.origin.x, graphArea.origin.y);\n\n            if (spec.subtype === BulletSubtype.horizontal) {\n              horizontalBullet(ctx, bulletGraph, style, backgroundColor, activeValue);\n            } else if (spec.subtype === BulletSubtype.vertical) {\n              verticalBullet(ctx, bulletGraph, style, backgroundColor, activeValue);\n            } else {\n              angularBullet(ctx, bulletGraph, style, backgroundColor, spec, debug, activeValue);\n            }\n          });\n\n          if (debug) {\n            withContext(ctx, (ctx) => {\n              ctx.translate(graphArea.origin.x, graphArea.origin.y);\n              renderDebugRect(\n                ctx,\n                {\n                  ...graphArea.size,\n                  x: 0,\n                  y: 0,\n                },\n                0,\n                { color: Colors.Transparent.rgba },\n              );\n              renderDebugPoint(ctx, 0, 0);\n              renderDebugPoint(ctx, graphArea.size.width / 2, graphArea.size.height / 2);\n            });\n          }\n        });\n      }),\n    );\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const TARGET_SIZE = 40;\n\n/** @internal */\nexport const TARGET_STROKE_WIDTH = 3;\n\n/** @internal */\nexport const BULLET_SIZE = 32;\n\n/** @internal */\nexport const BAR_SIZE = 12;\n\n/** @internal */\nexport const TICK_WIDTH = 1;\n\n/** @internal */\nexport const MIN_TICK_COUNT = 3;\n\n/** @internal */\nexport const MAX_TICK_COUNT = 8;\n\n/** @internal */\nexport const HOVER_SLOP = 20;\n\n/** @internal */\nexport const TICK_INTERVAL = 100;\n\n/** @internal */\nexport const ANGULAR_TICK_INTERVAL = 120;\n\n/**\n * Space between the target/value line and the tick label\n * @internal\n */\nexport const TICK_LABEL_PADDING = 3;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { renderBullet } from './bullet';\nimport { ColorContrastOptions } from '../../../../common/color_calcs';\nimport { colorToRgba } from '../../../../common/color_library_wrappers';\nimport { Color, Colors } from '../../../../common/colors';\nimport { AlignedGrid } from '../../../../components/grid/aligned_grid';\nimport { ElementOverListener, settingsBuildProps } from '../../../../specs';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getResolvedBackgroundColorSelector } from '../../../../state/selectors/get_resolved_background_color';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Size } from '../../../../utils/dimensions';\nimport { deepEqual } from '../../../../utils/fast_deep_equal';\nimport { Point } from '../../../../utils/point';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Metric } from '../../../metric/renderer/dom/metric';\nimport { BulletMetricWProgress, MetricDatum } from '../../../metric/specs';\nimport { ActiveValue, getActiveValues } from '../../selectors/get_active_values';\nimport { getBulletSpec } from '../../selectors/get_bullet_spec';\nimport { getChartSize } from '../../selectors/get_chart_size';\nimport { BulletDimensions, getPanelDimensions } from '../../selectors/get_panel_dimensions';\nimport { hasChartTitles } from '../../selectors/has_chart_titles';\nimport { BulletDatum, BulletSpec, BulletSubtype, mergeValueLabels } from '../../spec';\nimport { BulletStyle, LIGHT_THEME_BULLET_STYLE } from '../../theme';\nimport { BulletColorConfig } from '../../utils/color';\n\ninterface StateProps {\n  initialized: boolean;\n  debug: boolean;\n  chartId: string;\n  hasTitles: boolean;\n  spec?: BulletSpec;\n  a11y: A11ySettings;\n  size: Size;\n  dimensions: BulletDimensions;\n  activeValues: (ActiveValue | null)[][];\n  style: BulletStyle;\n  backgroundColor: Color;\n  locale: string;\n  pointerPosition?: Point;\n  colorBands: BulletColorConfig;\n  contrastOptions: ColorContrastOptions;\n  onElementOver?: ElementOverListener;\n}\n\ninterface DispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface OwnProps {\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype Props = DispatchProps & StateProps & OwnProps;\n\nclass Component extends React.Component<Props> {\n  static displayName = 'Bullet';\n  private ctx: CanvasRenderingContext2D | null;\n  private readonly devicePixelRatio: number;\n\n  constructor(props: Readonly<Props>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n  }\n\n  componentDidMount() {\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  shouldComponentUpdate(nextProps: Props) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      renderBullet(this.ctx, this.devicePixelRatio, this.props);\n    }\n  }\n\n  render() {\n    /* eslint-disable prettier/prettier */\n    // TODO - Prettier is going crazy on this line, need to investigate\n    const {\n      initialized,\n      size,\n      forwardStageRef,\n      a11y,\n      dimensions,\n      spec,\n      style,\n      backgroundColor,\n      locale,\n      contrastOptions,\n    } = this.props;\n    /* eslint-enable prettier/prettier */\n\n    if (!initialized || size.width === 0 || size.height === 0 || !spec) {\n      return null;\n    }\n\n    const valueLabels = mergeValueLabels(spec.valueLabels);\n\n    return (\n      <figure\n        aria-labelledby={a11y.labelId}\n        aria-describedby={a11y.descriptionId}\n        style={{ width: '100%', height: '100%' }}\n      >\n        <canvas\n          ref={forwardStageRef}\n          className=\"echCanvasRenderer\"\n          width={size.width * this.devicePixelRatio}\n          height={size.height * this.devicePixelRatio}\n          style={size}\n          // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n          role=\"presentation\"\n        ></canvas>\n        {dimensions.shouldRenderMetric && (\n          <div className=\"echBulletAsMetric\" style={{ width: '100%', height: '100%' }}>\n            <AlignedGrid<BulletDatum>\n              data={spec.data}\n              contentComponent={({ datum, stats }) => {\n                const colorScale =\n                  this.props.dimensions.rows[stats.rowIndex]?.[stats.columnIndex]?.colorScale ??\n                  (() => ({ hex: () => this.props.style.fallbackBandColor })); // should never happen\n                const bulletDatum: BulletMetricWProgress = {\n                  value: datum.value,\n                  target: datum.target,\n                  valueFormatter: datum.valueFormatter,\n                  targetFormatter: datum.targetFormatter,\n                  color: style.barBackground,\n                  progressBarDirection: spec.subtype === BulletSubtype.vertical ? 'vertical' : 'horizontal',\n                  title: datum.title,\n                  subtitle: datum.subtitle,\n                  domain: datum.domain,\n                  niceDomain: datum.niceDomain,\n                  valueLabels,\n                  extra: datum.target ? (\n                    <span>\n                      {valueLabels.target}:{' '}\n                      <strong>{(datum.targetFormatter ?? datum.valueFormatter)(datum.target)}</strong>\n                    </span>\n                  ) : undefined,\n                };\n\n                return (\n                  <Metric\n                    chartId=\"XX\"\n                    datum={bulletDatum as MetricDatum} // forcing internal type use\n                    hasTitles={this.props.hasTitles}\n                    totalRows={stats.rows}\n                    totalColumns={stats.columns}\n                    columnIndex={stats.columnIndex}\n                    rowIndex={stats.rowIndex}\n                    style={{\n                      barBackground: colorScale(datum.value).hex(),\n                      emptyBackground: Colors.Transparent.keyword,\n                      border: 'gray',\n                      minHeight: 0,\n                      text: {\n                        lightColor: 'white',\n                        darkColor: 'black',\n                      },\n                      nonFiniteText: 'N/A',\n                    }}\n                    locale={locale}\n                    backgroundColor={backgroundColor}\n                    contrastOptions={contrastOptions}\n                    panel={{ width: size.width / stats.columns, height: size.height / stats.rows }}\n                  />\n                );\n              }}\n            />\n            );\n          </div>\n        )}\n      </figure>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: StateProps = {\n  initialized: false,\n  debug: false,\n  chartId: '',\n  spec: undefined,\n  hasTitles: false,\n  size: {\n    width: 0,\n    height: 0,\n  },\n  a11y: DEFAULT_A11Y_SETTINGS,\n  dimensions: {\n    rows: [],\n    panel: { height: 0, width: 0 },\n    layoutAlignment: [],\n    shouldRenderMetric: false,\n  },\n  activeValues: [],\n  style: LIGHT_THEME_BULLET_STYLE,\n  backgroundColor: LIGHT_THEME.background.color,\n  locale: settingsBuildProps.defaults.locale,\n  colorBands: LIGHT_THEME.bulletGraph.colorBands,\n  contrastOptions: {},\n};\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  const { bulletGraph: style, metric: metricStyle } = getChartThemeSelector(state);\n\n  const { debug, onElementOver, locale } = getSettingsSpecSelector(state);\n\n  return {\n    initialized: true,\n    debug,\n    chartId: state.chartId,\n    hasTitles: hasChartTitles(state),\n    spec: getBulletSpec(state),\n    size: getChartSize(state),\n    a11y: getA11ySettingsSelector(state),\n    dimensions: getPanelDimensions(state),\n    activeValues: getActiveValues(state),\n    style,\n    locale,\n    backgroundColor: getResolvedBackgroundColorSelector(state),\n    colorBands: style.colorBands,\n    onElementOver,\n    contrastOptions: {\n      lightColor: colorToRgba(metricStyle.text.lightColor),\n      darkColor: colorToRgba(metricStyle.text.darkColor),\n    },\n  };\n};\n\n/** @internal */\nexport const BulletRenderer = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../../../common/colors';\nimport { cssFontShorthand } from '../../../../../common/text_utils';\nimport { measureText } from '../../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { clamp, isBetween, isFiniteNumber, sortNumbers } from '../../../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../../../utils/domain';\nimport { drawPolarLine } from '../../../../xy_chart/renderer/canvas/lines';\nimport { renderDebugPoint } from '../../../../xy_chart/renderer/canvas/utils/debug';\nimport { ActiveValue } from '../../../selectors/get_active_values';\nimport { BulletPanelDimensions } from '../../../selectors/get_panel_dimensions';\nimport { BulletSpec } from '../../../spec';\nimport { BulletStyle, GRAPH_PADDING, TICK_FONT, TICK_FONT_SIZE } from '../../../theme';\nimport { getAngledChartSizing } from '../../../utils/angular';\nimport { TARGET_SIZE, BULLET_SIZE, TICK_WIDTH, BAR_SIZE, TARGET_STROKE_WIDTH } from '../constants';\n\n/** @internal */\nexport function angularBullet(\n  ctx: CanvasRenderingContext2D,\n  dimensions: BulletPanelDimensions,\n  style: BulletStyle,\n  backgroundColor: Color,\n  spec: BulletSpec,\n  debug: boolean,\n  activeValue?: ActiveValue | null,\n) {\n  const { datum, graphArea, scale, ticks, colorBands } = dimensions;\n  const { radius } = getAngledChartSizing(graphArea.size, spec.subtype);\n  const [startAngle, endAngle] = scale.range() as [number, number];\n  const center = {\n    x: graphArea.center.x,\n    y: radius + TARGET_SIZE / 2,\n  };\n\n  ctx.translate(GRAPH_PADDING.left, GRAPH_PADDING.top);\n\n  const [start, end] = scale.domain() as GenericDomain;\n  // const counterClockwise = true;\n  const counterClockwise = startAngle < endAngle && start > end;\n  const [min, max] = sortNumbers([start, end]) as ContinuousDomain;\n  const formatterColorTicks = ticks.map((v) => ({ value: v, formattedValue: datum.tickFormatter(v) }));\n\n  // Color bands\n  colorBands.forEach((band) => {\n    ctx.beginPath();\n    ctx.arc(center.x, center.y, radius, band.start, band.end, false);\n    ctx.lineWidth = BULLET_SIZE;\n    ctx.strokeStyle = band.color;\n    ctx.stroke();\n  });\n\n  // Ticks\n  ctx.beginPath();\n  ctx.strokeStyle = backgroundColor;\n  ctx.lineWidth = TICK_WIDTH;\n  formatterColorTicks\n    .filter((tick) => tick.value > min && tick.value < max)\n    .forEach((tick) => {\n      const bulletWidth = BULLET_SIZE + 4; // TODO fix arbitrary extension\n      drawPolarLine(ctx, scale(tick.value), radius, bulletWidth, center);\n    });\n\n  ctx.stroke();\n\n  // Bar\n  const confinedValue = clamp(datum.value, min, max);\n  const adjustedZero = clamp(0, min, max);\n  ctx.beginPath();\n  ctx.lineWidth = BAR_SIZE;\n  ctx.strokeStyle = style.barBackground;\n  ctx.arc(\n    center.x,\n    center.y,\n    radius,\n    confinedValue > 0 ? scale(adjustedZero) : scale(confinedValue),\n    confinedValue > 0 ? scale(confinedValue) : scale(adjustedZero),\n    counterClockwise,\n  );\n  ctx.stroke();\n\n  // Target\n  if (isFiniteNumber(datum.target) && datum.target <= max && datum.target >= min) {\n    ctx.beginPath();\n    ctx.strokeStyle = style.barBackground;\n    ctx.lineWidth = TARGET_STROKE_WIDTH;\n\n    drawPolarLine(ctx, scale(datum.target), radius, TARGET_SIZE, center);\n\n    ctx.stroke();\n  }\n\n  // Zero baseline\n  if (isBetween(min, max, true)(0)) {\n    ctx.beginPath();\n    ctx.strokeStyle = style.barBackground;\n    ctx.lineWidth = TICK_WIDTH;\n\n    drawPolarLine(ctx, scale(0), radius, BULLET_SIZE, center);\n\n    ctx.stroke();\n  }\n\n  const measure = measureText(ctx);\n  // Assumes mostly homogenous formatting\n  const maxTickWidth = formatterColorTicks.reduce((acc, t) => {\n    const { width } = measure(t.formattedValue, TICK_FONT, TICK_FONT_SIZE);\n    return Math.max(acc, width);\n  }, 0);\n\n  // Tick labels\n  ctx.fillStyle = style.textColor;\n  ctx.textBaseline = 'middle';\n  ctx.font = cssFontShorthand(TICK_FONT, TICK_FONT_SIZE);\n  formatterColorTicks\n    .filter((tick) => tick.value >= min && tick.value <= max)\n    .forEach((tick) => {\n      ctx.textAlign = 'center';\n      const textPadding = style.angularTickLabelPadding + maxTickWidth / 2;\n      const start = scale(tick.value);\n      const y1 = Math.sin(start) * (radius - BULLET_SIZE / 2 - textPadding);\n      const x1 = Math.cos(start) * (radius - BULLET_SIZE / 2 - textPadding);\n\n      ctx.fillText(tick.formattedValue, center.x + x1, center.y + y1);\n    });\n\n  if (activeValue) {\n    ctx.beginPath();\n    ctx.strokeStyle = style.barBackground;\n    ctx.lineWidth = TARGET_STROKE_WIDTH;\n    drawPolarLine(ctx, activeValue.value, radius, TARGET_SIZE, center);\n\n    ctx.stroke();\n  }\n\n  ctx.beginPath();\n\n  if (debug) {\n    renderDebugPoint(ctx, center.x, center.y); // arch center\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../../../common/colors';\nimport { cssFontShorthand } from '../../../../../common/text_utils';\nimport { measureText } from '../../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { clamp, isBetween, isFiniteNumber, sortNumbers } from '../../../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../../../utils/domain';\nimport { ActiveValue } from '../../../selectors/get_active_values';\nimport { BulletPanelDimensions } from '../../../selectors/get_panel_dimensions';\nimport { BulletStyle, GRAPH_PADDING, TICK_FONT, TICK_FONT_SIZE } from '../../../theme';\nimport { TARGET_SIZE, BULLET_SIZE, TICK_WIDTH, BAR_SIZE, TARGET_STROKE_WIDTH, TICK_LABEL_PADDING } from '../constants';\n\n/** @internal */\nexport function horizontalBullet(\n  ctx: CanvasRenderingContext2D,\n  dimensions: BulletPanelDimensions,\n  style: BulletStyle,\n  backgroundColor: Color,\n  activeValue?: ActiveValue | null,\n) {\n  ctx.translate(GRAPH_PADDING.left, 0);\n\n  const { datum, colorBands, ticks, scale } = dimensions;\n  const [start, end] = scale.domain() as GenericDomain;\n  const [min, max] = sortNumbers([start, end]) as ContinuousDomain;\n\n  // Color bands\n  const verticalAlignment = TARGET_SIZE / 2;\n  colorBands.forEach((band) => {\n    ctx.fillStyle = band.color;\n    ctx.fillRect(band.start, verticalAlignment - BULLET_SIZE / 2, band.size, BULLET_SIZE);\n  });\n\n  // Ticks\n  ctx.beginPath();\n  ctx.strokeStyle = backgroundColor;\n  ctx.lineWidth = TICK_WIDTH;\n  ticks\n    .filter((tick) => tick > min && tick < max)\n    .forEach((tick) => {\n      ctx.moveTo(scale(tick), verticalAlignment - BULLET_SIZE / 2);\n      ctx.lineTo(scale(tick), verticalAlignment + BULLET_SIZE / 2);\n    });\n  ctx.stroke();\n\n  // Bar\n  const confinedValue = clamp(datum.value, min, max);\n  const adjustedZero = clamp(0, min, max);\n  ctx.fillStyle = style.barBackground;\n  ctx.fillRect(\n    datum.value > 0 ? scale(adjustedZero) : scale(confinedValue),\n    verticalAlignment - BAR_SIZE / 2,\n    confinedValue > 0 ? scale(confinedValue) - scale(adjustedZero) : scale(adjustedZero) - scale(confinedValue),\n    BAR_SIZE,\n  );\n\n  // Target\n  if (isFiniteNumber(datum.target) && datum.target <= max && datum.target >= min) {\n    ctx.fillRect(\n      scale(datum.target) - TARGET_STROKE_WIDTH / 2,\n      verticalAlignment - TARGET_SIZE / 2,\n      TARGET_STROKE_WIDTH,\n      TARGET_SIZE,\n    );\n  }\n\n  // Zero baseline\n  if (isBetween(min, max, true)(0)) {\n    ctx.fillRect(scale(0) - TICK_WIDTH / 2, verticalAlignment - BULLET_SIZE / 2, TICK_WIDTH, BULLET_SIZE);\n  }\n\n  // Active Value\n  if (activeValue && (datum.syncCursor || !activeValue.external)) {\n    ctx.fillRect(\n      activeValue.value - TARGET_STROKE_WIDTH / 2,\n      verticalAlignment - TARGET_SIZE / 2,\n      TARGET_STROKE_WIDTH,\n      TARGET_SIZE,\n    );\n  }\n\n  // Tick labels\n  ctx.fillStyle = style.textColor;\n  ctx.textBaseline = 'top';\n  ctx.font = cssFontShorthand(TICK_FONT, TICK_FONT_SIZE);\n  ticks\n    .filter((tick) => tick >= min && tick <= max)\n    .forEach((tick, i) => {\n      const labelText = datum.tickFormatter(tick);\n      if (i === ticks.length - 1) {\n        const availableWidth = Math.abs((start > end ? min : max) - (ticks.at(i) ?? NaN));\n        const { width: labelWidth } = measureText(ctx)(labelText, TICK_FONT, TICK_FONT_SIZE);\n        ctx.textAlign = labelWidth >= Math.abs(scale(availableWidth) - scale(0)) ? 'end' : 'start';\n      } else {\n        ctx.textAlign = 'start';\n      }\n      ctx.fillText(labelText, scale(tick), verticalAlignment + TARGET_SIZE / 2 + TICK_LABEL_PADDING);\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './horizontal';\nexport * from './vertical';\nexport * from './angular';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../../../common/colors';\nimport { cssFontShorthand } from '../../../../../common/text_utils';\nimport { clamp, isBetween, isFiniteNumber, sortNumbers } from '../../../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../../../utils/domain';\nimport { ActiveValue } from '../../../selectors/get_active_values';\nimport { BulletPanelDimensions } from '../../../selectors/get_panel_dimensions';\nimport { BulletStyle, GRAPH_PADDING, TICK_FONT, TICK_FONT_SIZE } from '../../../theme';\nimport { TARGET_SIZE, BULLET_SIZE, TICK_WIDTH, BAR_SIZE, TARGET_STROKE_WIDTH, TICK_LABEL_PADDING } from '../constants';\n\n/** @internal */\nexport function verticalBullet(\n  ctx: CanvasRenderingContext2D,\n  dimensions: BulletPanelDimensions,\n  style: BulletStyle,\n  backgroundColor: Color,\n  activeValue?: ActiveValue | null,\n) {\n  ctx.translate(0, GRAPH_PADDING.top);\n\n  const { datum, graphArea, scale, colorBands, ticks } = dimensions;\n  const [start, end] = scale.domain() as GenericDomain;\n  const [min, max] = sortNumbers([start, end]) as ContinuousDomain;\n  const graphPaddedHeight = graphArea.size.height - GRAPH_PADDING.bottom - GRAPH_PADDING.top;\n\n  // color bands\n  colorBands.reverse().forEach((band) => {\n    ctx.fillStyle = band.color;\n    ctx.fillRect(\n      graphArea.size.width / 2 - BULLET_SIZE / 2,\n      graphPaddedHeight - band.start - band.size,\n      BULLET_SIZE,\n      band.size,\n    );\n  });\n\n  // Ticks\n  ctx.beginPath();\n  ctx.strokeStyle = backgroundColor;\n  ctx.lineWidth = TICK_WIDTH;\n\n  ticks\n    .filter((tick) => tick > min && tick < max)\n    .forEach((tick) => {\n      ctx.moveTo(graphArea.size.width / 2 - BULLET_SIZE / 2, graphPaddedHeight - scale(tick));\n      ctx.lineTo(graphArea.size.width / 2 + BULLET_SIZE / 2, graphPaddedHeight - scale(tick));\n    });\n  ctx.stroke();\n\n  // Bar\n  const confinedValue = clamp(datum.value, min, max);\n  const adjustedZero = clamp(0, min, max);\n  ctx.fillStyle = style.barBackground;\n  ctx.fillRect(\n    graphArea.size.width / 2 - BAR_SIZE / 2,\n    confinedValue > 0 ? graphPaddedHeight - scale(confinedValue) : graphPaddedHeight - scale(adjustedZero),\n    BAR_SIZE,\n    confinedValue > 0 ? scale(confinedValue) - scale(adjustedZero) : scale(adjustedZero) - scale(confinedValue),\n  );\n\n  // Target\n  if (isFiniteNumber(datum.target) && datum.target <= max && datum.target >= min) {\n    ctx.fillRect(\n      graphArea.size.width / 2 - TARGET_SIZE / 2,\n      graphPaddedHeight - scale(datum.target) - TARGET_STROKE_WIDTH / 2,\n      TARGET_SIZE,\n      TARGET_STROKE_WIDTH,\n    );\n  }\n\n  // Zero baseline\n  if (isBetween(min, max, true)(0)) {\n    ctx.fillRect(\n      graphArea.size.width / 2 - BULLET_SIZE / 2,\n      graphPaddedHeight - scale(0) - TICK_WIDTH / 2,\n      BULLET_SIZE,\n      TICK_WIDTH,\n    );\n  }\n\n  // Active Value\n  if (activeValue && (datum.syncCursor || !activeValue.external)) {\n    ctx.fillRect(\n      graphArea.size.width / 2 - TARGET_SIZE / 2,\n      graphPaddedHeight - activeValue.value - TARGET_STROKE_WIDTH / 2,\n      TARGET_SIZE,\n      TARGET_STROKE_WIDTH,\n    );\n  }\n\n  // Tick labels\n  ctx.textBaseline = 'top';\n  ctx.fillStyle = style.textColor;\n  ctx.font = cssFontShorthand(TICK_FONT, TICK_FONT_SIZE);\n  ticks\n    .filter((tick) => tick >= min && tick <= max)\n    .forEach((tick, i) => {\n      ctx.textAlign = 'end';\n\n      const labelText = datum.tickFormatter(tick);\n      if (i === ticks.length - 1) {\n        const availableHeight = Math.abs((start > end ? min : max) - (ticks.at(i) ?? NaN));\n        const labelHeight = TICK_FONT_SIZE;\n        ctx.textBaseline = labelHeight >= Math.abs(scale(availableHeight) - scale(0)) ? 'hanging' : 'bottom';\n      } else {\n        ctx.textBaseline = 'bottom';\n      }\n\n      ctx.fillText(\n        labelText,\n        graphArea.size.width / 2 - TARGET_SIZE / 2 - TICK_LABEL_PADDING,\n        graphPaddedHeight - scale(tick),\n      );\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getBulletSpec } from './get_bullet_spec';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\n\n/** @internal */\nexport const canDisplayChartTitles = createCustomCachedSelector([getBulletSpec], (spec): boolean => {\n  return (spec?.data?.length ?? 0) > 1 || (spec?.data?.[0]?.length ?? 0) > 1;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getBulletSpec } from './get_bullet_spec';\nimport { BulletPanelDimensions, getPanelDimensions } from './get_panel_dimensions';\nimport { TAU } from '../../../common/constants';\nimport { Radian } from '../../../common/geometry';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../state/selectors/get_active_pointer_position';\nimport { isBetween, isFiniteNumber, roundTo, sortNumbers } from '../../../utils/common';\nimport { ContinuousDomain, Range } from '../../../utils/domain';\nimport { Point } from '../../../utils/point';\nimport { BULLET_SIZE, HOVER_SLOP, TARGET_SIZE } from '../renderer/canvas/constants';\nimport { BulletSpec, BulletSubtype } from '../spec';\nimport { GRAPH_PADDING } from '../theme';\nimport { getAngledChartSizing } from '../utils/angular';\n\n/** @internal */\nexport interface ActiveValueDetails {\n  value: number;\n  snapValue: number;\n  color: string;\n  pixelValue: number;\n  rowIndex: number;\n  columnIndex: number;\n  panel: BulletPanelDimensions;\n}\n\n/** @internal */\nexport const getActiveValue = createCustomCachedSelector(\n  [getActivePointerPosition, getPanelDimensions, getBulletSpec],\n  (pointer, dimensions, spec): ActiveValueDetails | null => {\n    if (!pointer) return null;\n    const { x, y } = pointer;\n\n    const rowIndex = Math.ceil(y / dimensions.panel.height) - 1;\n    const columnIndex = Math.ceil(x / dimensions.panel.width) - 1;\n    const activePanel = dimensions.rows?.[rowIndex]?.[columnIndex];\n\n    if (!activePanel) return null;\n\n    const relativePointer = {\n      x: x - activePanel.panel.x,\n      y: y - activePanel.panel.y,\n    };\n\n    const valueDetails = getPanelValue(activePanel, relativePointer, spec);\n\n    if (!valueDetails || !isFiniteNumber(valueDetails.value)) return null;\n\n    return {\n      ...valueDetails,\n      rowIndex,\n      columnIndex,\n      panel: activePanel,\n    };\n  },\n);\n\nfunction getPanelValue(\n  panel: BulletPanelDimensions,\n  pointer: Point,\n  spec: BulletSpec,\n): Pick<ActiveValueDetails, 'value' | 'snapValue' | 'color' | 'pixelValue'> | undefined {\n  const { graphArea, scale } = panel;\n  const [min, max] = sortNumbers(scale.domain()) as ContinuousDomain;\n  const isWithinDomain = isBetween(min, max);\n\n  switch (spec.subtype) {\n    case BulletSubtype.circle:\n    case BulletSubtype.halfCircle:\n    case BulletSubtype.twoThirdsCircle: {\n      const { radius } = getAngledChartSizing(graphArea.size, spec.subtype);\n      const center = {\n        x: graphArea.center.x,\n        y: radius + TARGET_SIZE / 2,\n      };\n      const { x, y } = pointer;\n      const normalizedPointer = {\n        x: x - center.x - graphArea.origin.x - GRAPH_PADDING.left,\n        y: y - center.y - graphArea.origin.y - GRAPH_PADDING.top,\n      };\n\n      const distance = Math.sqrt(Math.pow(normalizedPointer.x, 2) + Math.pow(normalizedPointer.y, 2));\n      const outerLimit = radius + BULLET_SIZE / 2 + HOVER_SLOP;\n      const innerLimit = radius - BULLET_SIZE / 2 - HOVER_SLOP;\n\n      if (distance <= outerLimit && distance >= innerLimit) {\n        // TODO find why to determine angle between origin and point\n        // The angle goes from -π in Quadrant 2 to +π in Quadrant 3\n        // This angle offset is a temporary fix\n        const angleOffset = normalizedPointer.x < 0 && normalizedPointer.y > 0 ? -TAU : 0;\n        const angle: Radian = Math.atan2(normalizedPointer.y, normalizedPointer.x) + angleOffset;\n        const value = scale.invert(angle);\n        const snapValue = spec.tickSnapStep ? roundTo(value, spec.tickSnapStep) : value;\n\n        if (isWithinDomain(snapValue)) {\n          return {\n            value,\n            snapValue,\n            color: panel.colorScale(snapValue).hex(),\n            pixelValue: angle,\n          };\n        }\n      }\n      break;\n    }\n\n    case BulletSubtype.horizontal: {\n      const yCenterOffset = Math.abs(pointer.y - graphArea.origin.y - TARGET_SIZE / 2);\n\n      if (yCenterOffset > TARGET_SIZE / 2 + HOVER_SLOP) return;\n\n      const relativeX = pointer.x - GRAPH_PADDING.left;\n      const [min, max] = scale.range() as Range;\n\n      if (relativeX < min || relativeX > max) break;\n\n      const value = panel.scale.invert(relativeX);\n      const snapValue = spec.tickSnapStep ? roundTo(value, spec.tickSnapStep) : value;\n\n      if (isWithinDomain(snapValue)) {\n        return {\n          value,\n          snapValue,\n          color: panel.colorScale(snapValue).hex(),\n          pixelValue: relativeX,\n        };\n      }\n\n      break;\n    }\n\n    case BulletSubtype.vertical: {\n      const xCenterOffset = Math.abs(pointer.x - graphArea.center.x - GRAPH_PADDING.left);\n\n      if (xCenterOffset > TARGET_SIZE / 2 + HOVER_SLOP) return;\n\n      const relativeY = panel.panel.height - pointer.y - GRAPH_PADDING.bottom;\n      const [min, max] = scale.range() as Range;\n\n      if (relativeY < min || relativeY > max) break;\n\n      const value = panel.scale.invert(relativeY);\n      const snapValue = spec.tickSnapStep ? roundTo(value, spec.tickSnapStep) : value;\n\n      if (isWithinDomain(snapValue)) {\n        return {\n          value,\n          snapValue,\n          color: panel.colorScale(snapValue).hex(),\n          pixelValue: relativeY,\n        };\n      }\n      break;\n    }\n\n    default:\n      return;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActiveValue } from './get_active_value';\nimport { getPanelDimensions } from './get_panel_dimensions';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { sortNumbers } from '../../../utils/common';\nimport { ContinuousDomain } from '../../../utils/domain';\n\n/** @internal */\nexport interface ActiveValue {\n  value: number;\n  external: boolean;\n}\n\n/** @internal */\nexport const getActiveValues = createCustomCachedSelector(\n  [getActiveValue, getPanelDimensions],\n  (activeValue, dimensions): (ActiveValue | null)[][] => {\n    if (!activeValue) return [];\n\n    // Synced cursor values should always use the snapValue to avoid strange diffs\n    const { snapValue, rowIndex, columnIndex } = activeValue;\n\n    return dimensions.rows.map((row, ri) =>\n      row.map((panel, ci): ActiveValue | null => {\n        const external = !(rowIndex === ri && columnIndex === ci);\n        if (!panel || (!panel.datum.syncCursor && external)) return null;\n        const [min, max] = sortNumbers(panel.scale.domain()) as ContinuousDomain;\n        if (snapValue > max || snapValue < min) return null;\n\n        return {\n          value: panel.scale(snapValue),\n          external,\n        };\n      }),\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../../chart_types';\nimport { BulletSpec } from '../../../chart_types/bullet_graph/spec';\nimport { SpecType } from '../../../specs';\nimport { GlobalChartState } from '../../../state/chart_state';\nimport { getSpecFromStore } from '../../../state/utils';\n\n/** @internal */\n\nexport function getBulletSpec(state: GlobalChartState): BulletSpec {\n  return getSpecFromStore<BulletSpec, true>(state.specs, ChartType.Bullet, SpecType.Series, true);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { Dimensions } from '../../../utils/dimensions';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const getChartSize = createCustomCachedSelector([getParentDimension], (container): Dimensions => {\n  return { ...container };\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getBulletSpec } from './get_bullet_spec';\nimport { getChartSize } from './get_chart_size';\nimport { BulletDatum, BulletSubtype } from '../../../chart_types/bullet_graph/spec';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../state/selectors/get_settings_spec';\nimport { withTextMeasure } from '../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Size } from '../../../utils/dimensions';\nimport { wrapText } from '../../../utils/text/wrap';\nimport {\n  FONT_PADDING,\n  HEADER_PADDING,\n  SUBTITLE_FONT,\n  SUBTITLE_FONT_SIZE,\n  TARGET_FONT,\n  TARGET_FONT_SIZE,\n  TITLE_FONT,\n  TITLE_FONT_SIZE,\n  TITLE_LINE_SPACING,\n  VALUE_FONT,\n  VALUE_FONT_SIZE,\n  getMaxTargetValueAssent,\n  getTextAscentHeight,\n} from '../theme';\n\n/** @internal */\nexport interface BulletHeaderLayout {\n  panel: Size;\n  header: Size;\n  title: string[];\n  subtitle: string | undefined;\n  value: string;\n  target: string;\n  multiline: boolean;\n  valueWidth: number;\n  targetWidth: number;\n  sizes: { title: number; subtitle: number; value: number; target: number };\n  datum: BulletDatum;\n}\n\n/** @internal */\nexport interface BulletLayoutAlignment {\n  maxTitleRows: number;\n  maxSubtitleRows: number;\n  multiline: boolean;\n  headerHeight: number;\n  minHeight: number;\n  minWidth: number;\n}\n\n/** @internal */\nexport interface BulletLayout {\n  /** Common panel size */\n  panel: Size;\n  headerLayout: (BulletHeaderLayout | null)[][];\n  layoutAlignment: BulletLayoutAlignment[];\n  shouldRenderMetric: boolean;\n}\n\nconst minChartHeights: Record<BulletSubtype, number> = {\n  [BulletSubtype.horizontal]: 50,\n  [BulletSubtype.vertical]: 100,\n  [BulletSubtype.circle]: 160,\n  [BulletSubtype.halfCircle]: 160,\n  [BulletSubtype.twoThirdsCircle]: 160,\n};\n\nconst minChartWidths: Record<BulletSubtype, number> = {\n  [BulletSubtype.horizontal]: 140,\n  [BulletSubtype.vertical]: 140,\n  [BulletSubtype.circle]: 160,\n  [BulletSubtype.halfCircle]: 160,\n  [BulletSubtype.twoThirdsCircle]: 160,\n};\n\n/** @internal */\nexport const getLayout = createCustomCachedSelector(\n  [getBulletSpec, getChartSize, getSettingsSpecSelector],\n  (spec, chartSize, { locale }): BulletLayout => {\n    const { data } = spec;\n    const rows = data.length;\n    const columns = data.reduce((acc, row) => {\n      return Math.max(acc, row.length);\n    }, 0);\n\n    const panel: Size = { width: chartSize.width / columns, height: chartSize.height / rows };\n    const headerSize: Size = {\n      width: panel.width - HEADER_PADDING.left - HEADER_PADDING.right,\n      height: panel.height - HEADER_PADDING.top - HEADER_PADDING.bottom,\n    };\n\n    return withTextMeasure((textMeasurer) => {\n      // collect header elements title, subtitles and values\n      const header = data.map((row) =>\n        row.map((cell) => {\n          if (!cell) return null;\n\n          const content = {\n            title: cell.title.trim(),\n            subtitle: cell.subtitle?.trim(),\n            value: `${cell.valueFormatter(cell.value)}${cell.target ? ' ' : ''}`,\n            target: cell.target ? `/ ${(cell.targetFormatter ?? cell.valueFormatter)(cell.target)}` : '',\n            datum: cell,\n          };\n          const widths = {\n            title: textMeasurer(content.title.trim(), TITLE_FONT, TITLE_FONT_SIZE).width,\n            subtitle: content.subtitle ? textMeasurer(content.subtitle, TITLE_FONT, TITLE_FONT_SIZE).width : 0,\n            value: textMeasurer(content.value, VALUE_FONT, VALUE_FONT_SIZE).width,\n            target: textMeasurer(content.target, TARGET_FONT, TARGET_FONT_SIZE).width,\n          };\n          return { content, widths };\n        }),\n      );\n\n      const valueIsBelowTitles = header.some((row) => {\n        return row.some((cell) => {\n          if (!cell) return false;\n          const valuesWidth = cell.widths.value + cell.widths.target;\n          const availableWidth = 0.95 * (headerSize.width - valuesWidth);\n\n          if (\n            availableWidth < 0.5 * headerSize.width &&\n            (cell.widths.title > availableWidth || cell.widths.subtitle > availableWidth)\n          ) {\n            return true;\n          }\n\n          const titleTruncated = wrapText(\n            cell.content.title,\n            TITLE_FONT,\n            TITLE_FONT_SIZE,\n            availableWidth,\n            2,\n            textMeasurer,\n            locale,\n          ).meta.truncated;\n          const subtitleTruncated = cell.content.subtitle\n            ? wrapText(\n                cell.content.subtitle,\n                SUBTITLE_FONT,\n                SUBTITLE_FONT_SIZE,\n                availableWidth,\n                1,\n                textMeasurer,\n                locale,\n              ).meta.truncated\n            : false;\n\n          return titleTruncated || subtitleTruncated;\n        });\n      });\n\n      const headerLayout = header.map((row) => {\n        return row.map((cell) => {\n          if (!cell) return null;\n\n          const valuesWidth = cell.widths.value + cell.widths.target;\n          const availableWidth = 0.95 * (headerSize.width - valuesWidth);\n\n          if (valueIsBelowTitles) {\n            return {\n              panel,\n              header: headerSize,\n              // wrap only title if necessary\n              title: wrapText(\n                cell.content.title,\n                TITLE_FONT,\n                TITLE_FONT_SIZE,\n                headerSize.width,\n                2,\n                textMeasurer,\n                locale,\n              ),\n              subtitle: cell.content.subtitle\n                ? wrapText(\n                    cell.content.subtitle,\n                    SUBTITLE_FONT,\n                    SUBTITLE_FONT_SIZE,\n                    headerSize.width,\n                    1,\n                    textMeasurer,\n                    locale,\n                  )[0]\n                : undefined,\n              value: cell.content.value,\n              target: cell.content.target,\n              multiline: true,\n              valueWidth: cell.widths.value,\n              targetWidth: cell.widths.target,\n              sizes: cell.widths,\n              datum: cell.content.datum,\n            };\n          }\n\n          return {\n            panel,\n            header: headerSize,\n            title: wrapText(cell.content.title, TITLE_FONT, TITLE_FONT_SIZE, availableWidth, 2, textMeasurer, locale),\n            subtitle: cell.content.subtitle\n              ? wrapText(\n                  cell.content.subtitle,\n                  SUBTITLE_FONT,\n                  SUBTITLE_FONT_SIZE,\n                  availableWidth,\n                  1,\n                  textMeasurer,\n                  locale,\n                )[0]\n              : undefined,\n            value: cell.content.value,\n            target: cell.content.target,\n            multiline: false,\n            valueWidth: cell.widths.value,\n            targetWidth: cell.widths.target,\n            sizes: cell.widths,\n            datum: cell.content.datum,\n          };\n        });\n      });\n      const layoutAlignment = headerLayout.map((curr) => {\n        return curr.reduce<BulletLayoutAlignment>(\n          (rowStats, cell) => {\n            const MAX_TARGET_VALUE_ASCENT = getMaxTargetValueAssent(cell?.target);\n            const multiline = cell?.multiline ?? false;\n            const maxTitleRows = Math.max(rowStats.maxTitleRows, cell?.title.length ?? 0);\n            const maxSubtitleRows = Math.max(rowStats.maxSubtitleRows, cell?.subtitle ? 1 : 0);\n            const leftHeaderHeight =\n              getTextAscentHeight(TITLE_FONT_SIZE, maxTitleRows, TITLE_LINE_SPACING) +\n              (maxSubtitleRows > 0 ? FONT_PADDING : 0) +\n              getTextAscentHeight(SUBTITLE_FONT_SIZE, maxSubtitleRows) +\n              (cell?.multiline ? MAX_TARGET_VALUE_ASCENT + FONT_PADDING : 0);\n            const rightHeaderHeight = cell?.multiline ? 0 : MAX_TARGET_VALUE_ASCENT;\n            const headerHeight =\n              Math.max(leftHeaderHeight, rightHeaderHeight) + HEADER_PADDING.top + HEADER_PADDING.bottom;\n\n            return {\n              multiline,\n              maxTitleRows,\n              maxSubtitleRows,\n              headerHeight,\n              minHeight: headerHeight + minChartHeights[spec.subtype],\n              minWidth: minChartWidths[spec.subtype],\n            };\n          },\n          { maxTitleRows: 0, maxSubtitleRows: 0, multiline: false, headerHeight: 0, minHeight: 0, minWidth: 0 },\n        );\n      });\n\n      const totalHeight = layoutAlignment.reduce((acc, curr) => {\n        return acc + curr.minHeight;\n      }, 0);\n\n      const totalWidth = layoutAlignment.reduce((acc, curr) => {\n        return Math.max(acc, curr.minWidth);\n      }, 0);\n      const shouldRenderMetric = chartSize.height <= totalHeight || chartSize.width <= totalWidth * columns;\n\n      return {\n        panel,\n        headerLayout,\n        layoutAlignment,\n        shouldRenderMetric,\n      };\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleLinear, scaleLinear } from 'd3-scale';\n\nimport { getBulletSpec } from './get_bullet_spec';\nimport { BulletLayout, BulletHeaderLayout, getLayout } from './get_layout';\nimport { ChromaColorScale, Color } from '../../../common/colors';\nimport { Rect } from '../../../geoms/types';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../state/selectors/get_chart_theme';\nimport { getResolvedBackgroundColorSelector } from '../../../state/selectors/get_resolved_background_color';\nimport { isWithinRange } from '../../../utils/common';\nimport { Size } from '../../../utils/dimensions';\nimport { GenericDomain, Range } from '../../../utils/domain';\nimport { Point } from '../../../utils/point';\nimport { ANGULAR_TICK_INTERVAL, TICK_INTERVAL } from '../renderer/canvas/constants';\nimport { BulletDatum, BulletSpec, BulletSubtype } from '../spec';\nimport { BulletStyle, GRAPH_PADDING } from '../theme';\nimport { getAngledChartSizing, getAnglesBySize } from '../utils/angular';\nimport { ColorTick, getColorScaleWithBands } from '../utils/color';\nimport { TickOptions, getTicks } from '../utils/ticks';\n\n/** @internal */\nexport type BulletPanelDimensions = {\n  graphArea: {\n    size: Size;\n    origin: Point;\n    center: Point;\n  };\n  scale: ScaleLinear<number, number>;\n  ticks: number[];\n  colorScale: ChromaColorScale;\n  colorBands: ColorTick[];\n  panel: Rect;\n} & Omit<BulletHeaderLayout, 'panel'>;\n\n/** @internal */\nexport type BulletDimensions = {\n  rows: (BulletPanelDimensions | null)[][];\n  panel: Size;\n} & Pick<BulletLayout, 'layoutAlignment' | 'shouldRenderMetric'>;\n\n/** @internal */\nexport const getPanelDimensions = createCustomCachedSelector(\n  [getLayout, getBulletSpec, getChartThemeSelector, getResolvedBackgroundColorSelector],\n  (\n    { shouldRenderMetric, headerLayout, layoutAlignment, panel: panelSize },\n    spec,\n    { bulletGraph: bulletGraphStyles },\n    backgroundColor,\n  ): BulletDimensions => {\n    // TODO: simplify color scale lookup for shouldRenderMetric case. Now we do more computations\n    // than necessary but for now this provides the same color bands / scale between Metric and bullet rendering\n\n    const rows = headerLayout.map((row, rowIndex) => {\n      return row.map((bulletGraph, columnIndex): BulletPanelDimensions | null => {\n        if (!bulletGraph) return null;\n        const { panel, multiline, datum, ...rest } = bulletGraph;\n        const verticalAlignment = layoutAlignment[rowIndex]!;\n\n        const graphSize = {\n          width: panel.width,\n          height: panel.height - verticalAlignment.headerHeight,\n        };\n\n        return {\n          ...rest,\n          ...getSubtypeDimensions(spec, graphSize, datum, bulletGraphStyles, backgroundColor),\n          datum,\n          multiline,\n          graphArea: {\n            size: graphSize,\n            origin: {\n              x: 0,\n              y: panel.height - graphSize.height,\n            },\n            center: {\n              x: graphSize.width / 2 - GRAPH_PADDING.left,\n              y: graphSize.height / 2 - GRAPH_PADDING.top,\n            },\n          },\n          panel: {\n            x: panel.width * columnIndex,\n            y: panel.height * rowIndex,\n            ...panel,\n          },\n        };\n      });\n    });\n\n    return {\n      rows,\n      panel: panelSize,\n      layoutAlignment,\n      shouldRenderMetric,\n    };\n  },\n);\n\nfunction getSubtypeDimensions(\n  { subtype, colorBands: colorBandsConfig }: BulletSpec,\n  graphSize: Size,\n  { ticks: desiredTicks, domain, niceDomain }: BulletDatum,\n  { colorBands: defaultColorBandsConfig, fallbackBandColor }: BulletStyle,\n  backgroundColor: Color,\n): Pick<BulletPanelDimensions, 'scale' | 'colorScale' | 'colorBands' | 'ticks'> {\n  switch (subtype) {\n    case BulletSubtype.circle:\n    case BulletSubtype.halfCircle:\n    case BulletSubtype.twoThirdsCircle: {\n      const [startAngle, endAngle] = getAnglesBySize(subtype);\n      const { radius } = getAngledChartSizing(graphSize, subtype);\n\n      const { scale, ticks } = getScaleWithTicks(domain, [startAngle, endAngle], {\n        rangeMultiplier: radius,\n        desiredTicks,\n        nice: niceDomain,\n        interval: ANGULAR_TICK_INTERVAL,\n      });\n\n      const { bands: colorBands, scale: colorScale } = getColorScaleWithBands(\n        scale,\n        colorBandsConfig ?? defaultColorBandsConfig,\n        ticks,\n        backgroundColor,\n        fallbackBandColor,\n      );\n\n      return {\n        scale,\n        ticks,\n        colorBands,\n        colorScale,\n      };\n    }\n\n    case BulletSubtype.horizontal: {\n      const paddedWidth = graphSize.width - GRAPH_PADDING.left - GRAPH_PADDING.right;\n      const { scale, ticks } = getScaleWithTicks(domain, [0, paddedWidth], {\n        desiredTicks,\n        nice: niceDomain,\n        interval: TICK_INTERVAL,\n      });\n\n      const { bands: colorBands, scale: colorScale } = getColorScaleWithBands(\n        scale,\n        colorBandsConfig ?? defaultColorBandsConfig,\n        ticks,\n        backgroundColor,\n        fallbackBandColor,\n      );\n\n      return {\n        scale,\n        ticks,\n        colorBands,\n        colorScale,\n      };\n    }\n\n    case BulletSubtype.vertical: {\n      const paddedHeight = graphSize.height - GRAPH_PADDING.bottom - GRAPH_PADDING.top;\n      const { scale, ticks } = getScaleWithTicks(domain, [0, paddedHeight], {\n        desiredTicks,\n        nice: niceDomain,\n        interval: TICK_INTERVAL,\n      });\n\n      const { bands: colorBands, scale: colorScale } = getColorScaleWithBands(\n        scale,\n        colorBandsConfig ?? defaultColorBandsConfig,\n        ticks,\n        backgroundColor,\n        fallbackBandColor,\n      );\n\n      return {\n        scale,\n        ticks,\n        colorBands,\n        colorScale,\n      };\n    }\n\n    default:\n      throw new Error('Unknown Bullet subtype');\n  }\n}\n\nfunction getScaleWithTicks(domain: GenericDomain, range: Range, tickOptions: TickOptions) {\n  let scale = scaleLinear().domain(domain).range(range);\n  const scaleRange: Range = scale.range() as Range;\n  const ticks = getTicks(Math.abs(scaleRange[1] - scaleRange[0]) * (tickOptions.rangeMultiplier || 1), tickOptions);\n  const customRange = typeof ticks !== 'number';\n\n  if (tickOptions.nice) {\n    scale = scale.nice(customRange ? undefined : ticks);\n  }\n\n  const updatedDomain = scale.domain() as GenericDomain;\n\n  return {\n    scale,\n    ticks: customRange ? ticks(updatedDomain).filter(isWithinRange(updatedDomain)) : scale.ticks(ticks),\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnchorPosition } from '../../../components/portal';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../state/selectors/get_active_pointer_position';\n\n/** @internal */\nexport const getTooltipAnchor = createCustomCachedSelector(\n  [getActivePointerPosition],\n  (pointer): AnchorPosition | null => {\n    return {\n      x: pointer?.x ?? 0,\n      y: pointer?.y ?? 0,\n      width: 0,\n      height: 0,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActiveValue } from './get_active_value';\nimport { getBulletSpec } from './get_bullet_spec';\nimport { TooltipInfo } from '../../../components/tooltip';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { isBetween } from '../../../utils/common';\nimport { mergeValueLabels } from '../spec';\n\n/** @internal */\nexport const getTooltipInfo = createCustomCachedSelector(\n  [getActiveValue, getBulletSpec],\n  (activeValue, spec): TooltipInfo | undefined => {\n    if (!activeValue) return;\n\n    const useHighlighter = false;\n    const highlightMargin = 2;\n    const valueLabels = mergeValueLabels(spec.valueLabels);\n\n    const activeDatum = activeValue.panel.datum;\n    const tooltipInfo: TooltipInfo = {\n      header: null,\n      values: [],\n    };\n\n    tooltipInfo.values.push({\n      label: valueLabels.active,\n      value: activeValue.value,\n      color: activeValue.color,\n      isHighlighted: false,\n      seriesIdentifier: {\n        specId: 'bullet',\n        key: 'active',\n      },\n      isVisible: true,\n      formattedValue: activeDatum.valueFormatter(activeValue.snapValue),\n    });\n\n    const isHighlighted = useHighlighter\n      ? isBetween(activeValue.pixelValue - highlightMargin, activeValue.pixelValue + highlightMargin)\n      : () => false;\n\n    tooltipInfo.values.push({\n      label: valueLabels.value,\n      value: activeDatum.value,\n      color: activeValue.panel.colorScale(activeDatum.value).hex(),\n      isHighlighted: isHighlighted(activeValue.panel.scale(activeDatum.value)),\n      seriesIdentifier: {\n        specId: 'bullet',\n        key: 'value',\n      },\n      isVisible: true,\n      formattedValue: activeDatum.valueFormatter(activeDatum.value),\n    });\n\n    if (activeDatum.target) {\n      tooltipInfo.values.push({\n        label: valueLabels.target,\n        value: activeDatum.target,\n        color: activeValue.panel.colorScale(activeDatum.target).hex(),\n        isHighlighted: isHighlighted(activeValue.panel.scale(activeDatum.target)),\n        seriesIdentifier: {\n          // TODO make this better\n          specId: 'bullet',\n          key: 'target',\n        },\n        isVisible: true,\n        formattedValue: activeDatum.valueFormatter(activeDatum.target),\n      });\n    }\n\n    return tooltipInfo;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { canDisplayChartTitles } from './can_display_chart_titles';\nimport { GlobalChartState } from '../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\n\nconst getChartTitleOrDescription = ({ title, description }: GlobalChartState) => Boolean(title || description);\n\n/** @internal */\nexport const hasChartTitles = createCustomCachedSelector(\n  [canDisplayChartTitles, getChartTitleOrDescription],\n  (displayTitles, hasTitles): boolean => {\n    return displayTitles && hasTitles;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipInfo } from './get_tooltip_info';\nimport { TooltipType } from '../../../specs';\nimport { TooltipVisibility } from '../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getTooltipSpecSelector } from '../../../state/selectors/get_tooltip_spec';\n\n/** @internal */\nexport const isTooltipVisible = createCustomCachedSelector(\n  [getTooltipSpecSelector, getTooltipInfo],\n  ({ type }, tooltipInfo): TooltipVisibility => {\n    return {\n      visible: type !== TooltipType.None && (tooltipInfo?.values.length ?? 0) > 0,\n      isExternal: false,\n      displayOnly: false,\n      isPinnable: false,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\nimport { $Values, Optional } from 'utility-types';\n\nimport { BulletColorConfig } from './utils/color';\nimport { ChartType } from '../../chart_types/index';\nimport { Spec } from '../../specs';\nimport { SpecType } from '../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../state/spec_factory';\nimport { mergePartial, stripUndefined, ValueFormatter } from '../../utils/common';\nimport { GenericDomain } from '../../utils/domain';\n\n/** @public */\nexport interface BulletDatum {\n  title: string;\n  subtitle?: string;\n  value: number;\n  target?: number;\n  domain: GenericDomain;\n  niceDomain?: boolean;\n  /**\n   * Approximate number of ticks to be returned. Must be greater than 0.\n   *\n   * Or\n   *\n   * Function that returns the exact ticks to use, this if you pass bad ticks we will not be able to help you!\n   * Sort order must match the direction of the domain.\n   *\n   * Defaults to auto ticks based on length\n   *\n   * See https://d3js.org/d3-scale/linear#linear_ticks\n   */\n  ticks?: number | ((domain: GenericDomain) => number[]);\n  syncCursor?: boolean;\n  valueFormatter: ValueFormatter;\n  targetFormatter?: ValueFormatter;\n  tickFormatter: ValueFormatter;\n}\n\n/** @public */\nexport const BulletSubtype = Object.freeze({\n  vertical: 'vertical' as const,\n  horizontal: 'horizontal' as const,\n  /**\n   * This bullet subtype is not yet fully supported\n   * See https://github.com/elastic/elastic-charts/issues/2200\n   * @alpha\n   */\n  circle: 'circle' as const,\n  halfCircle: 'half-circle' as const,\n  twoThirdsCircle: 'two-thirds-circle' as const,\n});\n/** @public */\nexport type BulletSubtype = $Values<typeof BulletSubtype>;\n\n/** @public */\nexport interface BulletValueLabels {\n  active: string;\n  value: string;\n  target: string;\n}\n\n/** @alpha */\nexport interface BulletSpec extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Bullet;\n  data: (BulletDatum | undefined)[][];\n  subtype: BulletSubtype;\n  tickSnapStep?: number;\n  colorBands?: BulletColorConfig;\n  valueLabels?: Optional<BulletValueLabels>;\n}\n\n/** @internal */\nexport const mergeValueLabels = (labels?: BulletSpec['valueLabels']) =>\n  mergePartial<BulletValueLabels>(\n    {\n      active: 'Active',\n      value: 'Value',\n      target: 'Target',\n    },\n    labels,\n  );\n\nconst buildProps = buildSFProps<BulletSpec>()(\n  {\n    specType: SpecType.Series,\n    chartType: ChartType.Bullet,\n  },\n  {},\n);\n\n/**\n * Add Goal spec to chart\n * @alpha\n */\nexport const Bullet = function (\n  props: SFProps<\n    BulletSpec,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  const constraints = {};\n\n  useSpecFactory<BulletSpec>({\n    ...defaults,\n    ...stripUndefined(props),\n    ...overrides,\n    ...constraints,\n  });\n  return null;\n};\n\n/** @public */\nexport type BulletProps = ComponentProps<typeof Bullet>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BulletColorConfig } from './utils/color';\nimport { Color } from '../../common/colors';\nimport { DEFAULT_FONT_FAMILY } from '../../common/default_theme_attributes';\nimport { Pixels } from '../../common/geometry';\nimport { Font } from '../../common/text_utils';\nimport { Padding } from '../../utils/dimensions';\nimport { DARK_BASE_COLORS, LIGHT_BASE_COLORS } from '../../utils/themes/base_colors';\n\n/** @public */\nexport interface BulletStyle {\n  textColor: Color;\n  border: Color;\n  barBackground: Color;\n  /**\n   * Default band colors when not defined on spec\n   */\n  colorBands: BulletColorConfig;\n  nonFiniteText: string;\n  minHeight: Pixels;\n  angularTickLabelPadding: Pixels;\n  fallbackBandColor: Color;\n}\n\n/** @internal */\nexport const LIGHT_THEME_BULLET_STYLE: BulletStyle = {\n  textColor: LIGHT_BASE_COLORS.darkestShade,\n  border: '#EDF0F5',\n  barBackground: LIGHT_BASE_COLORS.darkestShade,\n  colorBands: ['#AA87D1', '#D9C6EF'],\n  nonFiniteText: 'N/A',\n  minHeight: 64,\n  angularTickLabelPadding: 10,\n  fallbackBandColor: LIGHT_BASE_COLORS.mediumShade,\n};\n\n/** @internal */\nexport const DARK_THEME_BULLET_STYLE: BulletStyle = {\n  textColor: '#E0E5EE',\n  border: DARK_BASE_COLORS.lightShade,\n  barBackground: '#FFF',\n  colorBands: ['#6092C0', '#3F4E61'],\n  nonFiniteText: 'N/A',\n  minHeight: 64,\n  angularTickLabelPadding: 10,\n  fallbackBandColor: DARK_BASE_COLORS.mediumShade,\n};\n\n/** @internal */\nexport const TITLE_FONT: Font = {\n  fontStyle: 'normal',\n  fontFamily: DEFAULT_FONT_FAMILY,\n  fontVariant: 'normal',\n  fontWeight: 'bold',\n  textColor: 'black',\n};\n\n/**\n * Approximate height of font ascent from the baseline\n * @internal\n */\nexport const TEXT_ASCENT_RATIO = 0.8;\n\n/** @internal */\nexport const FONT_PADDING = 8;\n\n/** @internal */\nexport const TITLE_FONT_SIZE = 16;\n\n/** @internal */\nexport const TITLE_FONT_ASCENT = TITLE_FONT_SIZE * TEXT_ASCENT_RATIO;\n\n/** @internal */\nexport const TITLE_LINE_SPACING = 4;\n\n/** @internal */\nexport const SUBTITLE_FONT: Font = {\n  ...TITLE_FONT,\n  fontWeight: 'normal',\n};\n/** @internal */\nexport const SUBTITLE_FONT_SIZE = 14;\n\n/** @internal */\nexport const SUBTITLE_FONT_ASCENT = SUBTITLE_FONT_SIZE * TEXT_ASCENT_RATIO;\n\n/** @internal */\nexport const VALUE_FONT: Font = {\n  ...TITLE_FONT,\n};\n/** @internal */\nexport const VALUE_FONT_SIZE = 22;\n\nconst VALUE_FONT_ASCENT = VALUE_FONT_SIZE * TEXT_ASCENT_RATIO;\n\n/** @internal */\nexport const TARGET_FONT: Font = {\n  ...SUBTITLE_FONT,\n};\n/** @internal */\nexport const TARGET_FONT_SIZE = 16;\n\nconst TARGET_FONT_ASCENT = TARGET_FONT_SIZE * TEXT_ASCENT_RATIO;\n\n/** @internal */\nexport const getMaxTargetValueAssent = (target?: string) =>\n  !target ? VALUE_FONT_ASCENT : Math.max(VALUE_FONT_ASCENT, TARGET_FONT_ASCENT);\n\n/** @internal */\nexport const TICK_FONT: Font = {\n  ...TITLE_FONT,\n  fontWeight: 'normal',\n};\n/** @internal */\nexport const TICK_FONT_SIZE = 10;\n\n/** @internal */\nexport const HEADER_PADDING: Padding = {\n  top: 8,\n  bottom: 10, // allow more space for descenders\n  left: 8,\n  right: 8,\n};\n/** @internal */\nexport const GRAPH_PADDING: Padding = {\n  top: 8,\n  bottom: 8,\n  left: 8,\n  right: 8,\n};\n\n/**\n * Returns approx ascent height of text reduced by descent height for characters with descenders\n * @internal\n */\nexport function getTextAscentHeight(fontSize: number, lines = 1, lineSpacing = 0) {\n  return lines * (fontSize * TEXT_ASCENT_RATIO) + (lines - 1) * lineSpacing;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TAU } from '../../../common/constants';\nimport { clamp } from '../../../utils/common';\nimport { Size } from '../../../utils/dimensions';\nimport { TARGET_SIZE } from '../renderer/canvas/constants';\nimport { BulletSubtype } from '../spec';\nimport { GRAPH_PADDING } from '../theme';\n\ntype AngularBulletSubtypes = Extract<BulletSubtype, 'circle' | 'half-circle' | 'two-thirds-circle'>;\n\nconst sizeAngles: Record<AngularBulletSubtypes, { startAngle: number; endAngle: number }> = {\n  [BulletSubtype.halfCircle]: {\n    startAngle: 1 * Math.PI,\n    endAngle: 0,\n  },\n  [BulletSubtype.twoThirdsCircle]: {\n    startAngle: 1.25 * Math.PI,\n    endAngle: -0.25 * Math.PI,\n  },\n  [BulletSubtype.circle]: {\n    startAngle: 1.5 * Math.PI,\n    endAngle: -0.5 * Math.PI,\n  },\n};\n\n/** @internal */\nexport function getAnglesBySize(subtype: BulletSubtype): [startAngle: number, endAngle: number] {\n  if (subtype === BulletSubtype.vertical || subtype === BulletSubtype.horizontal) {\n    throw new Error('Attempting to retrieve angle size from horizontal/vertical bullet');\n  }\n  const angles = sizeAngles[subtype] ?? sizeAngles[BulletSubtype.twoThirdsCircle];\n  // Negative angles used to match current radian pattern\n  const startAngle = -angles.startAngle;\n  // limit endAngle to startAngle +/- 2π\n  const endAngle = clamp(-angles.endAngle, startAngle - TAU, startAngle + TAU);\n  return [startAngle, endAngle];\n}\n\nconst heightModifiers: Record<AngularBulletSubtypes, number> = {\n  [BulletSubtype.halfCircle]: 0.5,\n  [BulletSubtype.twoThirdsCircle]: 0.86, // approximated to account for flare of arc stroke at the bottom\n  [BulletSubtype.circle]: 1,\n};\n\n/** @internal */\nexport function getAngledChartSizing(\n  graphSize: Size,\n  subtype: BulletSubtype,\n): { maxWidth: number; maxHeight: number; radius: number } {\n  if (subtype === BulletSubtype.vertical || subtype === BulletSubtype.horizontal) {\n    throw new Error('Attempting to retrieve angle size from horizontal/vertical bullet');\n  }\n  const heightModifier = heightModifiers[subtype] ?? 1;\n  const maxWidth = graphSize.width - GRAPH_PADDING.left - GRAPH_PADDING.right;\n  const maxHeight = graphSize.height - GRAPH_PADDING.top - GRAPH_PADDING.bottom;\n  const modifiedHeight = maxHeight / heightModifier;\n  const radius = Math.min(maxWidth, modifiedHeight) / 2 - TARGET_SIZE / 2;\n\n  return { maxWidth, maxHeight: modifiedHeight, radius };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport chroma from 'chroma-js';\nimport { extent } from 'd3-array';\nimport { ScaleLinear } from 'd3-scale';\nimport { $Values, Required } from 'utility-types';\n\nimport { BaseBoundsConfig, OpenClosedBoundsConfig } from './bounds';\nimport { combineColors } from '../../../common/color_calcs';\nimport { RGBATupleToString, colorToRgba, getChromaColor } from '../../../common/color_library_wrappers';\nimport { ChromaColorScale, Color, Colors } from '../../../common/colors';\nimport { clamp, isFiniteNumber, isNil, isSorted, isWithinRange, sortNumbers } from '../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../utils/domain';\nimport { Logger } from '../../../utils/logger';\n\n/**\n * @public\n */\nexport const ColorBandValueType = Object.freeze({\n  /**\n   * Value in the scaled space\n   */\n  Scale: 'scale' as const,\n  /**\n   * Percentage of the scaled space as a ratio from `0` to `1`\n   */\n  Percentage: 'percentage' as const,\n});\n/** @public */\nexport type ColorBandValueType = $Values<typeof ColorBandValueType>;\n\n/** @public */\nexport interface ColorBandValue {\n  /**\n   * Type of value\n   *\n   * @defaultValue `scale`\n   */\n  type: ColorBandValueType;\n  value: number;\n}\n\n/** @public */\nexport type ColorBandConfig = OpenClosedBoundsConfig<number | ColorBandValue> & {\n  /**\n   * Color to be applied to band\n   */\n  color: Color;\n};\n\n/** @public */\nexport interface ColorBandSimpleConfig {\n  /**\n   * Distinct color steps to defined discrete color breakdown\n   * Defaults to intervals between ticks\n   *\n   * Number - scales colors evenly n times, does not support continuous color blending (i.e. n \\>\\> 10)\n   * Array of numbers - defines the color stop positions\n   *\n   * See https://gka.github.io/chroma.js/#scale-classes\n   */\n  steps?: number | number[];\n  colors: Color[];\n}\n\n/** @public */\nexport type ColorBandComplexConfig = ColorBandConfig[];\n\n/**\n * Defines the color of bullet chart bands\n * @public\n */\nexport type BulletColorConfig = Color[] | ColorBandSimpleConfig | ColorBandComplexConfig;\n\nconst getValueByTypeFn = ([min, max]: ContinuousDomain) => {\n  const domainLength = max - min;\n  const minOffset = domainLength / 100000; // TODO validate approach\n  return (bandValue: ColorBandValue | number, openOffset: -1 | 0 | 1 = 0): number | null => {\n    const openOffsetValue = openOffset * minOffset;\n    if (typeof bandValue === 'number') return bandValue + openOffsetValue;\n    const { type, value } = bandValue;\n    if (type === 'scale') return value + openOffsetValue;\n    if (type === 'percentage') return min + (value / 100) * domainLength + openOffsetValue;\n    return null;\n  };\n};\n\nconst getBandValueFn = (domain: ContinuousDomain) => {\n  const getValueByType = getValueByTypeFn(domain);\n  return (bandValue?: number | ColorBandValue, openOffset?: -1 | 0 | 1): number | null => {\n    if (isNil(bandValue)) return null;\n    return getValueByType(bandValue, openOffset);\n  };\n};\n\nconst getDomainPairFn = (domain: ContinuousDomain) => {\n  const getBandValue = getBandValueFn(domain);\n  return (config: BaseBoundsConfig<number | ColorBandValue>): [start: number | null, end: number | null] => {\n    return [\n      getBandValue(config.gt, 1) ?? getBandValue(config.gte),\n      getBandValue(config.lt, -1) ?? getBandValue(config.lte),\n    ];\n  };\n};\n\nconst isComplexConfig = (config: BulletColorConfig): config is ColorBandComplexConfig =>\n  Array.isArray(config) && typeof config[0] !== 'string';\n\nconst getColorBandsFromTicks = ([min, max]: ContinuousDomain, ticks: number[]): number[] => {\n  const fullTicks = ticks.slice();\n  const first = fullTicks.at(0)!;\n  const last = fullTicks.at(-1)!;\n  const minIndex = first > last ? -1 : 0;\n  const maxIndex = first < last ? -1 : 0;\n  if (fullTicks.at(minIndex) !== min) {\n    if (minIndex === 0) fullTicks.unshift(min);\n    else fullTicks.push(min);\n  }\n  if (fullTicks.at(maxIndex) !== max) {\n    if (maxIndex === 0) fullTicks.unshift(max);\n    else fullTicks.push(max);\n  }\n  return fullTicks.flatMap((n, i, { length }) => (i === 0 || i === length - 1 ? [n] : [n, n]));\n};\n\ninterface ScaleInputs {\n  colorBandDomain?: number[];\n  colors: string[];\n  steps?: number | number[];\n}\n\nfunction getScaleInputs(baseDomain: ContinuousDomain, config: BulletColorConfig, backgroundColor: Color): ScaleInputs {\n  if (!Array.isArray(config) || !isComplexConfig(config)) {\n    const { colors: rawColors, steps }: { colors: string[]; steps?: number | number[] } = !Array.isArray(config)\n      ? config\n      : {\n          colors: config,\n        };\n\n    // TODO - fix thrown error for RGBA colors from storybook\n    const colors = rawColors.map((c) => c.toLowerCase());\n    if (colors.length === 1) {\n      // Adds second color\n      const [color] = colors;\n      // should always have color\n      if (color) {\n        const secondary = getChromaColor(color).alpha(0.7).hex();\n        const blendedSecondary = combineColors(colorToRgba(secondary), colorToRgba(backgroundColor));\n        colors.push(RGBATupleToString(blendedSecondary));\n      }\n    }\n\n    return {\n      colors,\n      steps,\n    };\n  }\n\n  if (!isComplexConfig(config)) {\n    return {\n      colors: config,\n    };\n  }\n\n  const getDomainPair = getDomainPairFn(baseDomain);\n  const { colors, boundedDomains } = config.reduce<{\n    boundedDomains: [number | null, number | null][];\n    colors: string[];\n  }>(\n    (acc, colorConfig) => {\n      if (typeof colorConfig === 'string') {\n        acc.colors.push(colorConfig);\n      } else {\n        acc.colors.push(colorConfig.color);\n        const domainPair = getDomainPair(colorConfig);\n        acc.boundedDomains.push(domainPair);\n      }\n\n      return acc;\n    },\n    {\n      boundedDomains: [],\n      colors: [],\n    },\n  );\n\n  let prevMax = -Infinity;\n  return boundedDomains.reduce<Required<ScaleInputs, 'colorBandDomain'>>(\n    (acc, [min, max], i) => {\n      // TODO: Add better error handling around this logic, the complex config right now assumes the following:\n      // - All ranges are ordered from min to max\n      // - All ranges are compatible with each other such that there is no overlapping or excluded ranges\n      // Ideally we validate the config and fix it the best we can based on what is provided, filling or clamping as needed\n      const testMinValue = isFiniteNumber(min) ? min : isFiniteNumber(max) ? max : null;\n      if (testMinValue === null || testMinValue < prevMax) {\n        Logger.warn(`Error with ColorBandComplexConfig:\n\nRanges are incompatible with each other such that there is either overlapping or excluded range pairs`);\n        return acc;\n      }\n      const newMaxValue = isFiniteNumber(max) ? max : isFiniteNumber(min) ? min : null;\n      if (newMaxValue === null) return acc;\n\n      prevMax = newMaxValue;\n      const color = colors[i] ?? Colors.Transparent.keyword;\n\n      if (isFiniteNumber(min)) {\n        acc.colorBandDomain.push(min);\n        acc.colors.push(color);\n      }\n      if (isFiniteNumber(max)) {\n        acc.colorBandDomain.push(max);\n        acc.colors.push(color);\n      }\n\n      return acc;\n    },\n    {\n      colorBandDomain: [],\n      colors: [],\n    },\n  );\n}\n\n/** @internal */\nexport function getColorScale(\n  baseDomain: ContinuousDomain,\n  config: BulletColorConfig,\n  backgroundColor: Color,\n  fallbackBandColor: Color,\n): [colorScale: ChromaColorScale, scaleInputs: ScaleInputs] {\n  const { colors, colorBandDomain, steps: userSteps } = getScaleInputs(baseDomain, config, backgroundColor);\n  const scale = chroma\n    .scale(colors)\n    .mode('lab')\n    .domain(colorBandDomain ?? baseDomain);\n  let steps = userSteps;\n  let scaleDomain = baseDomain;\n\n  if (steps !== undefined) {\n    if (Array.isArray(steps) && !isSorted(steps, { order: 'ascending' })) {\n      Logger.warn(\n        `Ignoring Bullet.colorBands.steps. Expected a sorted ascending array of numbers without duplicates.\\n\\n\\tReceived:${JSON.stringify(steps)}`,\n      );\n      steps = undefined;\n    } else if (typeof steps === 'number' && steps < 1) {\n      Logger.warn(`Ignoring Bullet.colorBands.steps. Expected a positive number.\\n\\n\\tReceived:${steps}`);\n      steps = undefined;\n    } else {\n      if (Array.isArray(steps)) {\n        const [min = NaN, max = NaN] = extent(steps);\n        scaleDomain = [min, max];\n      }\n      scale.classes(steps);\n    }\n  }\n  const isInDomain = isWithinRange(scaleDomain);\n\n  return [(n) => (isInDomain(n) ? scale(n) : getChromaColor(fallbackBandColor)), { colors, colorBandDomain, steps }];\n}\n\n/** @internal */\nexport interface BandPositions {\n  start: number;\n  end: number;\n  size: number;\n}\n\n/** @internal */\nexport type ColorTick = { color: Color } & BandPositions;\n\n// TODO memoize for duplicate calls\n/** @internal */\nexport function getColorScaleWithBands(\n  scale: ScaleLinear<number, number>,\n  config: BulletColorConfig,\n  ticks: number[],\n  backgroundColor: Color,\n  fallbackBandColor: Color,\n): {\n  scale: ChromaColorScale;\n  bands: ColorTick[];\n} {\n  const domain = scale.domain() as GenericDomain;\n  const baseDomain = sortNumbers(domain) as ContinuousDomain;\n  const [colorScale, colorScaleInputs] = getColorScale(baseDomain, config, backgroundColor, fallbackBandColor);\n\n  return {\n    scale: colorScale,\n    bands: getColorBands(scale, colorScale, ticks, baseDomain, colorScaleInputs),\n  };\n}\n\nfunction getColorBands(\n  scale: ScaleLinear<number, number>,\n  colorScale: ChromaColorScale,\n  ticks: number[],\n  baseDomain: ContinuousDomain,\n  { colorBandDomain, steps }: ScaleInputs,\n): ColorTick[] {\n  const [min, max] = baseDomain;\n  if (steps) {\n    if (Array.isArray(steps)) {\n      const bands: ColorTick[] = [];\n\n      for (let i = 0; i < steps.length - 1; i++) {\n        const start = steps[i]!;\n        const end = steps[i + 1]!;\n        const [scaledStart, scaledEnd] = sortNumbers([scale(clamp(start, min, max)), scale(clamp(end, min, max))]);\n\n        bands.push({\n          start: scaledStart,\n          end: scaledEnd,\n          size: Math.abs(scaledEnd - scaledStart),\n          color: colorScale(start + Math.abs(end - start) / 2).hex(),\n        });\n      }\n\n      return bands;\n    }\n    const domainDelta = max - min;\n    const size = domainDelta / steps;\n\n    return Array.from({ length: steps }, (_, i) => {\n      const [start, end] = sortNumbers([scale(i * size + min), scale((i + 1) * size + min)]);\n\n      return {\n        start,\n        end,\n        color: colorScale((i + 0.5) * size + min).hex(),\n        size: Math.abs(end - start),\n      };\n    });\n  }\n\n  const bandPositions = colorBandDomain ?? getColorBandsFromTicks(baseDomain, ticks);\n  const scaledColorBands: ColorTick[] = [];\n\n  for (let i = 0; i < bandPositions.length; i += 2) {\n    const [start, end] = bandPositions.slice(i, i + 2);\n    if (start === undefined || end === undefined) continue;\n\n    const [scaledStart, scaledEnd] = sortNumbers([scale(clamp(start, min, max)), scale(clamp(end, min, max))]);\n    const size = Math.abs(scaledEnd - scaledStart);\n    const tick = clamp(start + (end - start) / 2, min, max); // pegs color at middle of band - maybe allow control of this later\n\n    if (scaledStart === scaledEnd) continue;\n\n    scaledColorBands.push({\n      start: scaledStart,\n      end: scaledEnd,\n      size,\n      color: colorScale(tick).hex(),\n    });\n  }\n\n  return scaledColorBands;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { clamp, isFiniteNumber } from '../../../utils/common';\nimport { MAX_TICK_COUNT, MIN_TICK_COUNT } from '../renderer/canvas/constants';\nimport { BulletDatum } from '../spec';\n\n/** @internal */\nexport interface TickOptions {\n  nice?: boolean;\n  interval: number;\n  desiredTicks: BulletDatum['ticks'];\n  /**\n   * Amplifies range by constant, use for angular to convert angles to arc lengths\n   */\n  rangeMultiplier?: number;\n}\n\n/** @internal */\nexport function getTicks(length: number, { desiredTicks, interval }: Omit<TickOptions, 'nice'>) {\n  if ((isFiniteNumber(desiredTicks) && desiredTicks > 0) || typeof desiredTicks === 'function') return desiredTicks;\n  const target = Math.floor(length / interval);\n  return clamp(target, MIN_TICK_COUNT, MAX_TICK_COUNT);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '..';\nimport { LegacyAnimationConfig } from '../../common/animation';\nimport { BaseDatum, Spec } from '../../specs';\nimport { SpecType } from '../../specs/constants'; // kept as long-winded import on separate line otherwise import circularity emerges\nimport { buildSFProps, SFProps, useSpecFactory } from '../../state/spec_factory';\nimport { Datum, stripUndefined, ValueAccessor, ValueFormatter } from '../../utils/common';\n\n/**\n * Control function for resetting chart focus\n * @public\n */\nexport type FlameGlobalControl = () => void; // takes no argument\n\n/**\n * Control function for setting chart focus on a specific node\n * @public\n */\nexport type FlameNodeControl = (nodeIndex: number) => void; // takes no arguments\n\n/**\n * Control function for setting chart focus on a specific node\n * @public\n */\nexport type FlameSearchControl = (text: string) => void; // takes no arguments\n\n/**\n * Provides direct controls for the Flame component user.\n * The call site supplied callback function is invoked on the chart component initialization as well as on component update,\n * so the callback must be idempotent.\n * @public\n */\nexport interface ControlReceiverCallbacks {\n  resetFocus: (control: FlameGlobalControl) => void; // call site responsibility to store and use the `control` function\n  focusOnNode: (control: FlameNodeControl) => void; // same but the control function passed to the call site uses one arg\n  search: (control: FlameSearchControl) => void;\n}\n\n/**\n * Column oriented data input for N data points:\n *   - label: array of N strings\n *   - value: Float64Array of N numbers, for tooltip value display\n *   - color: Float32Array of 4 * N numbers, eg. green[i] = color[4 * i + 1]\n *   - position0: Tween from: Float32Array of 2 * N numbers with unit coordinates [x0, y0, x1, y1, ..., xN-1, yN-1]\n *   - position1: Tween to: Float32Array of 2 * N numbers with unit coordinates [x0, y0, x1, y1, ..., xN-1, yN-1]\n *   - size0: Tween from: Float32Array of N numbers with unit widths [width0, width1, ... , widthN-1]\n *   - size1: Tween to: Float32Array of N numbers with unit widths [width0, width1, ... , widthN-1]\n * If position0 === position1 and size0 === size1, then the nodes are not animated\n * @public\n */\nexport interface ColumnarViewModel {\n  label: string[];\n  value: Float64Array;\n  color: Float32Array;\n  position0: Float32Array;\n  position1: Float32Array;\n  size0: Float32Array;\n  size1: Float32Array;\n}\n\n/**\n * Specifies the flame chart\n * @public\n */\nexport interface FlameSpec<D extends BaseDatum = Datum> extends Spec, LegacyAnimationConfig {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Flame;\n  columnarData: ColumnarViewModel;\n  controlProviderCallback: Partial<ControlReceiverCallbacks>; // call site may grab any number of controls\n  valueAccessor: ValueAccessor<D>;\n  valueFormatter: ValueFormatter;\n  valueGetter: (datumIndex: number) => number;\n  search?: { text: string };\n  onSearchTextChange?: (text: string) => void;\n}\n\nconst buildProps = buildSFProps<FlameSpec>()(\n  {\n    chartType: ChartType.Flame,\n    specType: SpecType.Series,\n  },\n  {\n    valueAccessor: (d) => (typeof d === 'number' ? d : 0),\n    valueGetter: (n) => n, // fixme abracadabra\n    valueFormatter: (d) => String(d),\n    animation: { duration: 0 },\n  },\n);\n\n/**\n * Adds flame spec to chart specs\n * @public\n */\nexport const Flame = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    FlameSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<FlameSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { createRef, CSSProperties, RefObject, WheelEventHandler } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { FlameSpec } from './flame_api';\nimport { NavigationStrategy, NavButtonControlledZoomPanHistory } from './navigation';\nimport { roundUpSize } from './render/common';\nimport { drawFrame, EPSILON, PADDING_BOTTOM, PADDING_LEFT, PADDING_RIGHT, PADDING_TOP } from './render/draw_a_frame';\nimport { ensureWebgl } from './render/ensure_webgl';\nimport { uploadToWebgl } from './render/upload_to_webgl';\nimport { attributeLocations, GEOM_INDEX_OFFSET } from './shaders';\nimport { GLResources, NULL_GL_RESOURCES, nullColumnarViewModel, PickFunction } from './types';\nimport { ChartType } from '..';\nimport { DEFAULT_CSS_CURSOR, SECONDARY_BUTTON } from '../../common/constants';\nimport { bindFramebuffer, createTexture, NullTexture, readPixel, Texture } from '../../common/kingly';\nimport { GL } from '../../common/webgl_constants';\nimport { BasicTooltip } from '../../components/tooltip/tooltip';\nimport { SettingsSpec, SpecType, TooltipType, TooltipValue } from '../../specs';\nimport { onChartRendered } from '../../state/actions/chart';\nimport { ON_POINTER_MOVE } from '../../state/actions/mouse';\nimport { BackwardRef, GlobalChartState } from '../../state/chart_state';\nimport { isPinnableTooltip } from '../../state/selectors/can_pin_tooltip';\nimport { getA11ySettingsSelector } from '../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../state/selectors/get_tooltip_spec';\nimport { getSpecsFromStore } from '../../state/utils';\nimport { clamp, isFiniteNumber, isNil } from '../../utils/common';\nimport { Size } from '../../utils/dimensions';\nimport { FlamegraphStyle } from '../../utils/themes/theme';\n\nconst PINCH_ZOOM_CHECK_INTERVAL_MS = 100;\nconst SIDE_OVERSHOOT_RATIO = 0.05; // e.g. 0.05 means, extend the domain 5% to the left and 5% to the right\nconst RECURRENCE_ALPHA_PER_MS_X = 0.01;\nconst RECURRENCE_ALPHA_PER_MS_Y = 0.0062;\nconst SINGLE_CLICK_EMPTY_FOCUS = true;\nconst IS_META_REQUIRED_FOR_ZOOM = false;\nconst ZOOM_SPEED = 0.0015;\nconst DEEPEST_ZOOM_RATIO = 1e-7; // FP calcs seem precise enough down to a 10 000 000 times zoom: 1e-7\nconst ZOOM_FROM_EDGE_BAND = 16; // so the user needs not be precisely at the edge to zoom in one direction\nconst ZOOM_FROM_EDGE_BAND_LEFT = ZOOM_FROM_EDGE_BAND + PADDING_LEFT;\nconst ZOOM_FROM_EDGE_BAND_RIGHT = ZOOM_FROM_EDGE_BAND + PADDING_RIGHT;\nconst ZOOM_FROM_EDGE_BAND_TOP = ZOOM_FROM_EDGE_BAND + PADDING_TOP;\nconst ZOOM_FROM_EDGE_BAND_BOTTOM = ZOOM_FROM_EDGE_BAND + PADDING_BOTTOM;\nconst LEFT_MOUSE_BUTTON = 1;\nconst MINIMAP_SIZE_RATIO_X = 3;\nconst MINIMAP_SIZE_RATIO_Y = 3;\nconst SHOWN_ANCESTOR_COUNT = 2; // how many rows above the focused in node should be shown\nconst SHOULD_DISABLE_WOBBLE = (typeof process === 'object' && process.env && process.env.VRT) === 'true';\nconst WOBBLE_DURATION = SHOULD_DISABLE_WOBBLE ? 0 : 1000;\nconst WOBBLE_REPEAT_COUNT = 2;\nconst WOBBLE_FREQUENCY = SHOULD_DISABLE_WOBBLE ? 0 : 2 * Math.PI * (WOBBLE_REPEAT_COUNT / WOBBLE_DURATION); // e.g. 1/30 means a cycle of every 30ms\nconst NODE_TWEEN_DURATION_MS = 500;\n\nconst unitRowPitch = (position: Float32Array) => (position.length >= 4 ? (position[1] ?? 0) - (position[3] ?? 0) : 1);\nconst initialPixelRowPitch = () => 16;\nconst specValueFormatter = (d: number) => d; // fixme use the formatter from the spec\nconst browserRootWindow = () => {\n  let rootWindow = window; // we might be in an iframe, and visualViewport.scale is toplevel only\n  while (window.parent && window.parent.window !== rootWindow) rootWindow = rootWindow.parent.window;\n  return rootWindow;\n};\n\nconst columnToRowPositions = ({ position1, size1 }: FlameSpec['columnarData'], i: number) => ({\n  x0: position1[i * 2] ?? 0,\n  x1: (position1[i * 2] ?? 0) + (size1[i] ?? 0),\n  y0: position1[i * 2 + 1] ?? 0,\n  y1: (position1[i * 2 + 1] ?? 0) + unitRowPitch(position1),\n});\n\n/** @internal */\nexport interface FocusRect {\n  x0: number;\n  x1: number;\n  y0: number;\n  y1: number;\n}\n\nconst focusForArea = (chartHeight: number, { x0, x1, y0, y1 }: { x0: number; x1: number; y0: number; y1: number }) => {\n  // horizontal\n  const sideOvershoot = SIDE_OVERSHOOT_RATIO * (x1 - x0);\n\n  // vertical\n  const unitRowHeight = y1 - y0;\n  const chartHeightInUnit = (chartHeight / initialPixelRowPitch()) * unitRowHeight;\n  const y = Math.min(1, y1 + unitRowHeight * SHOWN_ANCESTOR_COUNT);\n  const intendedY0 = y - chartHeightInUnit;\n  const bottomOvershoot = Math.max(0, -intendedY0);\n  const top = Math.min(1, y + bottomOvershoot);\n\n  return {\n    x0: Math.max(0, x0 - sideOvershoot),\n    x1: Math.min(1, x1 + sideOvershoot),\n    y0: Math.max(0, intendedY0),\n    y1: Math.min(1, top),\n  };\n};\n\nconst focusRect = (\n  columnarViewModel: FlameSpec['columnarData'],\n  chartHeight: number,\n  drilldownDatumIndex: number,\n): FocusRect => focusForArea(chartHeight, columnToRowPositions(columnarViewModel, drilldownDatumIndex || 0));\n\nconst getColor = (c: Float32Array, i: number) => {\n  const r = Math.round(255 * (c[4 * i] ?? 0));\n  const g = Math.round(255 * (c[4 * i + 1] ?? 0));\n  const b = Math.round(255 * (c[4 * i + 2] ?? 0));\n  const a = c[4 * i + 3];\n  return `rgba(${r}, ${g}, ${b}, ${a})`;\n};\n\nconst colorToDatumIndex = (pixel: Uint8Array) => {\n  // this is the inverse of what's done via BIT_SHIFTERS in shader code (bijective color/index mapping)\n  const [p0 = 0, p1 = 0, p2 = 0, p3 = 0] = pixel;\n  const isEmptyArea = p0 + p1 + p2 + p3 < GEOM_INDEX_OFFSET; // ie. zero\n  return isEmptyArea ? NaN : p3 + 256 * (p2 + 256 * (p1 + 256 * p0)) - GEOM_INDEX_OFFSET;\n};\n\nconst getRegExp = (searchString: string): RegExp => {\n  let regex: RegExp;\n  try {\n    regex = new RegExp(searchString);\n  } catch {\n    return new RegExp('iIUiUYIuiGjhG678987gjhgfytr678576'); // todo find a quick failing regex\n  }\n  return regex;\n};\n\nconst isAttributeKey = (keyCandidate: string): keyCandidate is keyof typeof attributeLocations =>\n  keyCandidate in attributeLocations;\n\ninterface StateProps {\n  theme: FlamegraphStyle;\n  debugHistory: boolean;\n  columnarViewModel: FlameSpec['columnarData'];\n  controlProviderCallback: FlameSpec['controlProviderCallback'];\n  animationDuration: number;\n  chartDimensions: Size;\n  a11ySettings: ReturnType<typeof getA11ySettingsSelector>;\n  tooltipRequired: boolean;\n  canPinTooltip: boolean;\n  search: NonNullable<FlameSpec['search']>;\n  onSeachTextChange: (text: string) => void;\n  onElementOver: NonNullable<SettingsSpec['onElementOver']>;\n  onElementClick: NonNullable<SettingsSpec['onElementClick']>;\n  onElementOut: NonNullable<SettingsSpec['onElementOut']>;\n  onRenderChange: NonNullable<SettingsSpec['onRenderChange']>;\n}\n\ninterface DispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface OwnProps {\n  containerRef: BackwardRef;\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype FlameProps = StateProps & DispatchProps & OwnProps;\n\n/** @internal */\nexport type NavRect = FocusRect & { index: number };\n\nclass FlameComponent extends React.Component<FlameProps> {\n  static displayName = 'Flame';\n\n  // DOM API Canvas2d and WebGL resources\n  private ctx: CanvasRenderingContext2D | null = null;\n  private glContext: WebGL2RenderingContext | null = null;\n  private pickTexture: Texture = NullTexture;\n  private glResources: GLResources = NULL_GL_RESOURCES;\n  private readonly glCanvasRef: RefObject<HTMLCanvasElement> = createRef();\n\n  // native browser pinch zoom handling\n  private pinchZoomSetInterval: number = NaN;\n  private pinchZoomScale: number;\n\n  // mouse coordinates for the tooltip\n  private pointerX: number = NaN;\n  private pointerY: number = NaN;\n\n  // mouse coordinates for pinned tooltip\n  private pinnedPointerX: number = NaN;\n  private pinnedPointerY: number = NaN;\n\n  // pinned tooltip state\n  private tooltipPinned: boolean = false;\n  private tooltipSelectedSeries: TooltipValue[] = [];\n\n  // currently hovered over datum\n  private hoverIndex: number = NaN;\n  private tooltipValues: TooltipValue[] = [];\n\n  // drilldown animation\n  private animationRafId: number = NaN;\n  private prevFocusTime: number = NaN;\n  private prevNodeTweenTime: number = NaN;\n  private currentFocus: FocusRect;\n  private targetFocus: FocusRect;\n\n  // panning\n  private startOfDragX: number = NaN;\n  private startOfDragY: number = NaN;\n  private startOfDragFocusLeft: number = NaN;\n  private startOfDragFocusTop: number = NaN; // todo top or bottom...does it even matter?\n\n  // text search\n  private readonly searchInputRef: RefObject<HTMLInputElement> = createRef();\n  private currentSearchString = '';\n  private currentSearchHitCount = 0;\n  private currentColor: Float32Array;\n  private caseSensitive = false;\n  private useRegex = false;\n  private focusedMatchIndex = NaN;\n\n  // wobble\n  private wobbleTimeLeft = 0;\n  private wobbleIndex = NaN;\n\n  // navigation\n  private navigator: NavigationStrategy;\n\n  constructor(props: Readonly<FlameProps>) {\n    super(props);\n    const columns = this.props.columnarViewModel;\n\n    // vector length checks\n    const datumCount = columns.position1.length / 2;\n    if (datumCount % 1) throw new Error('flame error: position1 vector must have even values (x/y pairs)');\n    if (datumCount * 2 !== columns.position0.length)\n      throw new Error('flame error: Mismatch between position0 (xy) and position1 (xy) length');\n    if (datumCount !== columns.size0.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and size0 length');\n    if (datumCount !== columns.size1.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and size1 length');\n    if (datumCount * 4 !== columns.color.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and color (rgba) length');\n    if (datumCount !== columns.value.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and value length');\n    if (datumCount !== columns.label.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and label length');\n\n    this.targetFocus = this.getFocusOnRoot();\n\n    this.bindControls();\n    this.currentFocus = { ...this.targetFocus };\n\n    // Initialize nav queue with the root element\n    this.navigator = new NavButtonControlledZoomPanHistory({ ...this.getFocusOnRoot(), index: 0 });\n\n    // browser pinch zoom handling\n    this.pinchZoomSetInterval = NaN;\n    this.pinchZoomScale = browserRootWindow().visualViewport?.scale ?? 1;\n    this.setupViewportScaleChangeListener();\n\n    // search\n    this.currentColor = columns.color;\n\n    // node size/position tween time\n    this.prevNodeTweenTime =\n      columns.position0 === columns.position1 && columns.size0 === columns.size1 ? -Infinity : Infinity; // if nothing to tween, then skip it\n  }\n\n  private pinTooltip = (pinned: boolean): void => {\n    if (!pinned) {\n      this.unpinTooltip(true);\n      return;\n    }\n\n    this.tooltipPinned = true;\n    this.tooltipSelectedSeries = this.tooltipValues;\n    // this.setState({});\n  };\n\n  private toggleSelectedTooltipItem = (tooltipValue: TooltipValue): void => {\n    // selection is arbitrary for flame elements - just toggle single selection\n    if (!this.tooltipPinned) return;\n    this.tooltipSelectedSeries = this.tooltipSelectedSeries.length === 0 ? [tooltipValue] : [];\n    this.setState({});\n  };\n\n  private setSelectedTooltipItems = (tooltipValues: TooltipValue[]): void => {\n    this.tooltipSelectedSeries = tooltipValues;\n    this.setState({});\n  };\n\n  private focusOnNavElement(element?: NavRect) {\n    if (!element) {\n      return;\n    }\n    if (isFiniteNumber(element.index)) {\n      this.focusOnNode(element.index);\n    } else {\n      this.focusOnRect(element);\n    }\n  }\n\n  private bindControls() {\n    const { controlProviderCallback } = this.props;\n    if (controlProviderCallback.resetFocus) {\n      controlProviderCallback.resetFocus(() => this.resetFocus());\n    }\n    if (controlProviderCallback.focusOnNode) {\n      controlProviderCallback.focusOnNode((nodeIndex: number) => {\n        const rect = focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, nodeIndex);\n        this.navigator.add({ ...rect, index: nodeIndex });\n        this.focusOnNode(nodeIndex);\n      });\n    }\n    if (controlProviderCallback.search) {\n      controlProviderCallback.search((text: string) => {\n        if (!this.searchInputRef.current) return;\n        this.searchInputRef.current.value = text;\n        this.searchForText(false);\n      });\n    }\n  }\n\n  private resetFocus() {\n    this.navigator.reset();\n    this.targetFocus = this.getFocusOnRoot();\n    this.wobble(0);\n  }\n\n  private focusOnNode(nodeIndex: number) {\n    this.targetFocus = focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, nodeIndex);\n    this.wobble(nodeIndex);\n  }\n\n  private focusOnRect(rect: FocusRect) {\n    this.targetFocus = rect;\n    this.setState({});\n  }\n\n  private wobble(nodeIndex: number) {\n    this.wobbleTimeLeft = WOBBLE_DURATION;\n    this.wobbleIndex = nodeIndex;\n    this.prevFocusTime = NaN;\n    this.hoverIndex = NaN; // no highlight\n    this.setState({});\n  }\n\n  private getFocusOnRoot() {\n    return focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, 0);\n  }\n\n  private setupDevicePixelRatioChangeListener = () => {\n    // redraw if the devicePixelRatio changed, for example:\n    //   - applied browser zoom from the browser's top right hamburger menu (NOT the pinch zoom)\n    //   - changed monitor resolution\n    //   - dragged the browser to a monitor with a differing devicePixelRatio\n    window.matchMedia(`(resolution: ${window.devicePixelRatio}dppx)`).addEventListener(\n      'change',\n      () => {\n        this.setState({});\n        // this re-adds the `once` event listener (not sure if componentDidMount guarantees single execution)\n        // and the value in the `watchMedia` resolution needs to change as well\n        this.setupDevicePixelRatioChangeListener();\n      },\n      { once: true },\n    );\n  };\n\n  private setupViewportScaleChangeListener = () => {\n    window.clearInterval(this.pinchZoomSetInterval);\n    this.pinchZoomSetInterval = window.setInterval(() => {\n      const pinchZoomScale = browserRootWindow().visualViewport?.scale ?? 1; // not cached, to avoid holding a reference to a `window` object\n      if (pinchZoomScale !== this.pinchZoomScale) {\n        this.pinchZoomScale = pinchZoomScale;\n        this.setState({});\n      }\n    }, PINCH_ZOOM_CHECK_INTERVAL_MS);\n  };\n\n  componentDidMount = () => {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n\n    if (this.props.search.text.length > 0 && this.searchInputRef.current) {\n      this.searchInputRef.current.value = this.props.search.text;\n      this.searchForText(false);\n    }\n\n    this.drawCanvas();\n    this.props.onChartRendered();\n    this.setupDevicePixelRatioChangeListener();\n    this.props.containerRef().current?.addEventListener('wheel', this.preventScroll, { passive: false });\n  };\n\n  componentWillUnmount() {\n    this.props.containerRef().current?.removeEventListener('wheel', this.preventScroll);\n  }\n\n  private ensureTextureAndDraw = () => {\n    this.ensurePickTexture();\n    this.drawCanvas();\n  };\n\n  private chartDimensionsChanged({ height, width }: Size): boolean {\n    return this.props.chartDimensions.height !== height || this.props.chartDimensions.width !== width;\n  }\n\n  componentDidUpdate = ({ chartDimensions, search }: FlameProps) => {\n    if (!this.ctx) this.tryCanvasContext();\n    if (this.tooltipPinned && this.chartDimensionsChanged(chartDimensions)) {\n      this.unpinTooltip();\n    }\n    this.bindControls();\n    if (search.text !== this.props.search.text && this.searchInputRef.current) {\n      this.searchInputRef.current.value = this.props.search.text;\n      this.searchForText(false);\n    }\n\n    this.ensureTextureAndDraw();\n\n    // eg. due to chartDimensions (parentDimensions) change\n    // this.props.onChartRendered() // creates and infinite update loop\n  };\n\n  private pointerInMinimap = (x: number, y: number) =>\n    x === clamp(x, this.getMinimapLeft(), this.getMinimapLeft() + this.getMinimapWidth()) &&\n    y === clamp(y, this.getMinimapTop(), this.getMinimapTop() + this.getMinimapHeight());\n\n  private datumAtXY: PickFunction = (x, y) =>\n    this.glContext ? colorToDatumIndex(readPixel(this.glContext, x, y)) : NaN;\n\n  private updatePointerLocation(e: { clientX: number; clientY: number }) {\n    if (!this.props.forwardStageRef.current || !this.ctx) return;\n    const box = this.props.forwardStageRef.current.getBoundingClientRect();\n    this.pointerX = e.clientX - box.left;\n    this.pointerY = e.clientY - box.top;\n\n    if (!this.tooltipPinned) {\n      this.pinnedPointerX = this.pointerX;\n      this.pinnedPointerY = this.pointerY;\n    }\n  }\n\n  private unpinTooltip(redraw = false) {\n    this.pinnedPointerX = NaN;\n    this.pinnedPointerY = NaN;\n    this.tooltipPinned = false;\n    this.tooltipSelectedSeries = [];\n    this.updateHoverIndex();\n    if (redraw) {\n      this.smartDraw();\n    }\n  }\n\n  private getHoveredDatumIndex = () => {\n    const pr = window.devicePixelRatio * this.pinchZoomScale;\n    const x = this.tooltipPinned ? this.pinnedPointerX : this.pointerX;\n    const y = this.tooltipPinned ? this.pinnedPointerY : this.pointerY;\n    return this.datumAtXY(pr * x, pr * (this.props.chartDimensions.height - y));\n  };\n\n  private getDragDistanceX = () => this.pointerX - this.startOfDragX;\n  private getDragDistanceY = () => -(this.pointerY - this.startOfDragY);\n  private isDragging = ({ buttons }: { buttons: number }) => buttons & LEFT_MOUSE_BUTTON;\n\n  private handleMouseHoverMove = (e: React.MouseEvent<HTMLCanvasElement, MouseEvent>) => {\n    if (!this.isDragging(e)) {\n      e.stopPropagation();\n      this.updatePointerLocation(e);\n      if (!this.tooltipPinned) {\n        this.updateHoverIndex();\n      }\n    }\n  };\n\n  private updateHoverIndex() {\n    const hoveredDatumIndex = this.getHoveredDatumIndex();\n    const prevHoverIndex = this.hoverIndex >= 0 ? this.hoverIndex : NaN;\n    this.hoverIndex = hoveredDatumIndex;\n    if (!Object.is(this.hoverIndex, prevHoverIndex)) {\n      if (Number.isFinite(hoveredDatumIndex)) {\n        this.props.onElementOver([{ vmIndex: hoveredDatumIndex }]); // userland callback\n      } else {\n        this.hoverIndex = NaN;\n        this.props.onElementOut(); // userland callback\n      }\n    }\n\n    if (prevHoverIndex !== this.hoverIndex) {\n      const columns = this.props.columnarViewModel;\n      const hoverValue = this.hoverIndex >= 0 ? columns.value[this.hoverIndex] : null;\n      this.tooltipValues = !isNil(hoverValue)\n        ? [\n            {\n              label: columns.label[this.hoverIndex] ?? '',\n              color: getColor(columns.color, this.hoverIndex),\n              isHighlighted: false,\n              isVisible: true,\n              seriesIdentifier: { specId: '', key: '' },\n              value: hoverValue,\n              formattedValue: `${specValueFormatter(hoverValue)}`,\n              valueAccessor: this.hoverIndex,\n            },\n          ]\n        : [];\n    }\n    this.setState({}); // exact tooltip location needs an update\n  }\n\n  private handleMouseDragMove = (e: MouseEvent) => {\n    e.stopPropagation();\n    this.updatePointerLocation(e);\n\n    if (this.isDragging(e)) {\n      const dragInMinimap = this.pointerInMinimap(this.startOfDragX, this.startOfDragY);\n      const focusMoveDirection = dragInMinimap ? 1 : -1; // focus box moves in direction of drag: positive; opposite: negative\n      const { x0, x1, y0, y1 } = this.currentFocus;\n      const focusWidth = x1 - x0; // this stays constant during panning\n      const focusHeight = y1 - y0; // this stays constant during panning\n      if (Number.isNaN(this.startOfDragFocusLeft)) this.startOfDragFocusLeft = x0;\n      if (Number.isNaN(this.startOfDragFocusTop)) this.startOfDragFocusTop = y0;\n      const dragDistanceX = this.getDragDistanceX();\n      const dragDistanceY = this.getDragDistanceY();\n      const { width: chartWidth, height: chartHeight } = this.props.chartDimensions;\n      const focusChartWidth = chartWidth - PADDING_LEFT - PADDING_RIGHT;\n      const focusChartHeight = chartHeight - PADDING_TOP - PADDING_BOTTOM;\n      const dragSpeedX = (dragInMinimap ? MINIMAP_SIZE_RATIO_X / focusWidth : 1) / focusChartWidth;\n      const dragSpeedY = (dragInMinimap ? MINIMAP_SIZE_RATIO_Y / focusHeight : 1) / focusChartHeight;\n      const deltaIntentX = focusMoveDirection * dragDistanceX * dragSpeedX * focusWidth;\n      const deltaIntentY = focusMoveDirection * dragDistanceY * dragSpeedY * focusHeight;\n      const deltaCorrectionX =\n        deltaIntentX > 0\n          ? Math.min(0, 1 - (this.startOfDragFocusLeft + focusWidth + deltaIntentX))\n          : -Math.min(0, this.startOfDragFocusLeft + deltaIntentX);\n      const deltaCorrectionY =\n        deltaIntentY > 0\n          ? Math.min(0, 1 - (this.startOfDragFocusTop + focusHeight + deltaIntentY))\n          : -Math.min(0, this.startOfDragFocusTop + deltaIntentY);\n      const deltaX = deltaIntentX + deltaCorrectionX; // todo allow a bit of overdrag: use 0.95-0.98 times deltaCorrectionX and snap back on mouseup\n      const deltaY = deltaIntentY + deltaCorrectionY; // todo allow a bit of overdrag: use 0.95-0.98 times deltaCorrectionX and snap back on mouseup\n      const newX0 = clamp(this.startOfDragFocusLeft + deltaX, 0, 1); // to avoid negligible FP domain breaches\n      const newX1 = clamp(this.startOfDragFocusLeft + focusWidth + deltaX, 0, 1); // to avoid negligible FP domain breaches\n      const newY0 = clamp(this.startOfDragFocusTop + deltaY, 0, 1); // to avoid negligible FP domain breaches\n      const newY1 = clamp(this.startOfDragFocusTop + focusHeight + deltaY, 0, 1); // to avoid negligible FP domain breaches\n      const newFocus = { x0: newX0, x1: newX1, y0: newY0, y1: newY1 };\n      this.currentFocus = newFocus;\n      this.targetFocus = newFocus;\n      this.navigator.add({ ...newFocus, index: NaN });\n      this.smartDraw();\n    }\n  };\n\n  private clearDrag = () => {\n    this.startOfDragX = NaN;\n    this.startOfDragY = NaN;\n    this.startOfDragFocusLeft = NaN;\n    this.startOfDragFocusTop = NaN;\n  };\n\n  private resetDrag = () => {\n    this.startOfDragX = this.pointerX;\n    this.startOfDragY = this.pointerY;\n  };\n\n  private handleMouseDown = (e: React.MouseEvent<HTMLCanvasElement>) => {\n    e.stopPropagation();\n    if (e.button === SECONDARY_BUTTON || e.ctrlKey) return; // context menu click\n    if (Number.isNaN(this.pointerX + this.pointerY)) return; // don't reset from minimap\n    if (this.tooltipPinned) return; // prevent dragging while tooltip is pinned\n\n    this.resetDrag();\n\n    window.addEventListener('mousemove', this.handleMouseDragMove, { passive: true });\n    window.addEventListener('mouseup', this.handleMouseUp, { passive: true });\n  };\n\n  private handleContextMenu = (e: React.MouseEvent<HTMLCanvasElement>) => {\n    e.stopPropagation();\n    e.preventDefault(); // prevent browser context menu\n\n    if (this.tooltipPinned) {\n      this.handleUnpinningTooltip();\n      return;\n    }\n    if (!Number.isFinite(this.getHoveredDatumIndex())) {\n      // NOP if not hover a node\n      return;\n    }\n    window.addEventListener('keyup', this.handleKeyUp);\n    window.addEventListener('click', this.handleUnpinningTooltip);\n    window.addEventListener('visibilitychange', this.handleUnpinningTooltip);\n    this.pinTooltip(true);\n    this.setState({}); // updates cursor\n  };\n\n  private handleMouseUp = (e: MouseEvent) => {\n    e.stopPropagation();\n\n    window.removeEventListener('mousemove', this.handleMouseDragMove);\n    window.removeEventListener('mouseup', this.handleMouseUp);\n\n    if (this.tooltipPinned) {\n      this.unpinTooltip();\n      this.clearDrag();\n      return;\n    }\n\n    this.updatePointerLocation(e); // just in case: eg. the user tabbed away, moved mouse elsewhere, and came back\n    const dragDistanceX = this.getDragDistanceX(); // zero or NaN means that a non-zero drag didn't happen\n    const dragDistanceY = this.getDragDistanceY(); // zero or NaN means that a non-zero drag didn't happen\n    if (!dragDistanceX && !dragDistanceY) {\n      const hoveredDatumIndex = this.getHoveredDatumIndex();\n      const isDoubleClick = e.detail > 1;\n      const hasClickedOnRectangle = Number.isFinite(hoveredDatumIndex);\n      const mustFocus = SINGLE_CLICK_EMPTY_FOCUS || isDoubleClick !== hasClickedOnRectangle; // xor: either double-click on empty space, or single-click on a node\n      const isContextClick = e.button === SECONDARY_BUTTON || e.ctrlKey;\n\n      if (mustFocus && !isContextClick && !this.pointerInMinimap(this.pointerX, this.pointerY)) {\n        const rect = focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, hoveredDatumIndex);\n        this.navigator.add({ ...rect, index: hoveredDatumIndex });\n        this.focusOnNode(hoveredDatumIndex);\n        this.props.onElementClick([{ vmIndex: hoveredDatumIndex }]); // userland callback\n      }\n    }\n    this.clearDrag();\n    this.setState({});\n  };\n\n  private handleUnpinningTooltip = () => {\n    window.removeEventListener('keyup', this.handleKeyUp);\n    window.removeEventListener('click', this.handleUnpinningTooltip);\n    window.removeEventListener('visibilitychange', this.handleUnpinningTooltip);\n    this.pinTooltip(false);\n  };\n\n  static watchedKeys: KeyboardEvent['key'][] = ['Escape'];\n  private handleKeyUp = ({ key }: KeyboardEvent) => {\n    if (!FlameComponent.watchedKeys.includes(key)) return;\n\n    window.removeEventListener('keyup', this.handleKeyUp);\n\n    this.unpinTooltip();\n  };\n\n  private handleMouseLeave = (e: React.MouseEvent<HTMLCanvasElement>) => {\n    e.stopPropagation();\n    if (!this.tooltipPinned) {\n      this.smartDraw();\n    }\n  };\n\n  private preventScroll = (e: WheelEvent) => e.metaKey === IS_META_REQUIRED_FOR_ZOOM && e.preventDefault();\n\n  private handleWheel: WheelEventHandler = (e) => {\n    if (e.metaKey !== IS_META_REQUIRED_FOR_ZOOM) return; // one way: zoom; other way: let scroll happen\n\n    this.unpinTooltip();\n    this.updatePointerLocation(e);\n\n    const { x0, x1, y0, y1 } = this.currentFocus;\n    const wheelDelta = -e.deltaY; // mapbox convention: scroll down increases magnification\n    const delta = wheelDelta * ZOOM_SPEED;\n\n    const unitX = this.pointerX / this.props.chartDimensions.width;\n    const unitY = (this.props.chartDimensions.height - this.pointerY) / this.props.chartDimensions.height;\n    const zoomOut = delta <= 0;\n    const midX =\n      Math.abs(x0) < EPSILON && (zoomOut || this.pointerX < ZOOM_FROM_EDGE_BAND_LEFT)\n        ? 0\n        : Math.abs(x1 - 1) < EPSILON &&\n            (zoomOut || this.pointerX > this.props.chartDimensions.width - ZOOM_FROM_EDGE_BAND_RIGHT)\n          ? 1\n          : clamp(x0 + unitX * Math.abs(x1 - x0), 0, 1);\n    const midY =\n      Math.abs(y0) < EPSILON &&\n      (zoomOut || this.pointerY > this.props.chartDimensions.height - ZOOM_FROM_EDGE_BAND_BOTTOM)\n        ? 0\n        : Math.abs(y1 - 1) < EPSILON && (zoomOut || this.pointerY < ZOOM_FROM_EDGE_BAND_TOP)\n          ? 1\n          : clamp(y0 + unitY * Math.abs(y1 - y0), 0, 1);\n    const targetX0 = clamp(x0 - delta * (x0 - midX), 0, 1);\n    const targetX1 = clamp(x1 + delta * (midX - x1), 0, 1);\n    const targetY0 = clamp(y0 - delta * (y0 - midY), 0, 1);\n    const targetY1 = clamp(y1 + delta * (midY - y1), 0, 1);\n    const newX0 = Math.min(targetX0, midX); // to prevent lo/hi values from switching places\n    const newX1 = Math.max(targetX1, midX); // to prevent lo/hi values from switching places\n    const newY0 = Math.min(targetY0, midY); // to prevent lo/hi values from switching places\n    const newY1 = Math.max(targetY1, midY); // to prevent lo/hi values from switching places\n\n    const xZoom = (e.ctrlKey || !e.altKey) && newX1 - newX0 >= DEEPEST_ZOOM_RATIO;\n    const yZoom = (e.ctrlKey || e.altKey) && newY1 - newY0 >= unitRowPitch(this.props.columnarViewModel.position1);\n\n    if (xZoom || yZoom) {\n      const newFocus = {\n        x0: xZoom ? newX0 : x0,\n        x1: xZoom ? newX1 : x1,\n        y0: yZoom ? newY0 : y0,\n        y1: yZoom ? newY1 : y1,\n      };\n      this.navigator.add({ ...newFocus, index: NaN });\n      this.currentFocus = newFocus;\n      this.targetFocus = newFocus;\n    }\n    this.smartDraw();\n  };\n\n  private focusOnAllMatches = () => {\n    this.currentSearchHitCount = 0;\n    const searchString = this.currentSearchString;\n    const customizedSearchString = this.caseSensitive ? searchString : searchString.toLowerCase();\n    const regex = this.useRegex && getRegExp(searchString);\n    const columns = this.props.columnarViewModel;\n    this.currentColor = new Float32Array(columns.color);\n    const labels = columns.label;\n    const size = columns.size1;\n    const position = columns.position1;\n    const rowHeight = unitRowPitch(position);\n    const datumCount = labels.length;\n    let x0 = Infinity;\n    let x1 = -Infinity;\n    let y0 = Infinity;\n    let y1 = -Infinity;\n    // todo unify with matcher loop and setup in focusOnHit\n    for (let i = 0; i < datumCount; i++) {\n      const label = this.caseSensitive ? labels[i] : labels[i]?.toLowerCase();\n      if (regex ? label?.match(regex) : label?.includes(customizedSearchString)) {\n        this.currentSearchHitCount++;\n        x0 = Math.min(x0, position[2 * i] ?? 0);\n        x1 = Math.max(x1, (position[2 * i] ?? 0) + (size[i] ?? 0));\n        y0 = Math.min(y0, position[2 * i + 1] ?? 0);\n        y1 = Math.max(y1, (position[2 * i + 1] ?? 0) + rowHeight);\n      } else {\n        this.currentColor[4 * i + 3] *= 0.25; // multiply alpha\n      }\n    }\n\n    if (Number.isFinite(x0) && searchString.length > 0) {\n      Object.assign(this.targetFocus, focusForArea(this.props.chartDimensions.height, { x0, x1, y0, y1 }));\n      // disabled for now, reintroduce it if we want to include it into the history nav\n      // this.navigator.add({ ...this.targetFocus, index: NaN });\n    }\n  };\n\n  private uploadSearchColors = () => {\n    const colorSetter = this.glResources.attributes.get('color');\n    if (this.glContext && colorSetter && this.currentColor.length === this.props.columnarViewModel.color.length) {\n      uploadToWebgl(this.glContext, new Map([['color', colorSetter]]), { color: this.currentColor });\n    }\n  };\n\n  private searchForText = (force: boolean) => {\n    const input = this.searchInputRef.current;\n    const searchString = input?.value;\n    if (!input || typeof searchString !== 'string' || (searchString === this.currentSearchString && !force)) return;\n    this.currentSearchString = searchString;\n\n    // update focus rectangle if needed\n    this.focusOnAllMatches();\n\n    // update colors\n    this.uploadSearchColors();\n\n    // render\n    this.focusedMatchIndex = NaN;\n    this.setState({});\n  };\n\n  private handleEnterKey = (e: React.KeyboardEvent<HTMLCanvasElement | HTMLInputElement>) => {\n    e.stopPropagation();\n    if (e.key === 'Enter') {\n      if (e.shiftKey) {\n        this.previousHit();\n      } else {\n        this.nextHit();\n      }\n      return true;\n    }\n    return false;\n  };\n\n  private clearSearchText = () => {\n    if (!this.searchInputRef.current) return;\n    this.searchInputRef.current.value = '';\n    this.searchForText(false);\n  };\n\n  private handleEscapeKey = (e: React.KeyboardEvent<HTMLCanvasElement | HTMLInputElement>) => {\n    if (e.key === 'Escape') {\n      this.clearSearchText();\n    }\n  };\n\n  private handleSearchFieldKeyPress = (e: React.KeyboardEvent<HTMLCanvasElement | HTMLInputElement>) => {\n    if (this.handleEnterKey(e)) {\n      e.stopPropagation();\n    }\n  };\n\n  private focusOnHit = () => {\n    if (Number.isNaN(this.focusedMatchIndex)) {\n      // resetting to focus on everything\n      this.focusOnAllMatches();\n    } else {\n      let datumIndex = NaN;\n      let hitEnumerator = -1;\n      const searchString = this.currentSearchString;\n      const customizedSearchString = this.caseSensitive ? searchString : searchString.toLowerCase();\n      const regex = this.useRegex && getRegExp(searchString);\n      const labels = this.props.columnarViewModel.label;\n      // todo unify with matcher loop and setup in focusOnAllMatches\n      for (let i = 0; i < labels.length; i++) {\n        const label = this.caseSensitive ? labels[i] : labels[i]?.toLowerCase();\n        if (regex ? label?.match(regex) : label?.includes(customizedSearchString)) {\n          datumIndex = i;\n          hitEnumerator++;\n          if (hitEnumerator === this.focusedMatchIndex) break;\n        }\n      }\n      if (hitEnumerator >= 0) {\n        this.targetFocus = focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, datumIndex);\n        // disable until we consider that part of the navigation\n        // this.navigator.add({ ...this.targetFocus, index: NaN });\n        this.prevFocusTime = NaN;\n        this.hoverIndex = NaN; // no highlight\n        this.wobbleTimeLeft = WOBBLE_DURATION;\n        this.wobbleIndex = datumIndex;\n      }\n    }\n  };\n\n  private previousHit = () => {\n    const hitCount = this.currentSearchHitCount;\n    if (!this.currentSearchString || hitCount === 0) return;\n    this.focusedMatchIndex = Number.isNaN(this.focusedMatchIndex)\n      ? hitCount - 1\n      : this.focusedMatchIndex === 0\n        ? NaN\n        : this.focusedMatchIndex - 1;\n    this.focusOnHit();\n    this.setState({});\n  };\n\n  private nextHit = () => {\n    const hitCount = this.currentSearchHitCount;\n    if (!this.currentSearchString || hitCount === 0) return;\n    this.focusedMatchIndex = this.focusedMatchIndex = Number.isNaN(this.focusedMatchIndex)\n      ? 0\n      : this.focusedMatchIndex === hitCount - 1\n        ? NaN\n        : this.focusedMatchIndex + 1;\n    this.focusOnHit();\n    this.setState({});\n  };\n\n  private getActiveCursor(): CSSProperties['cursor'] {\n    if (this.tooltipPinned) return DEFAULT_CSS_CURSOR;\n    if (this.startOfDragX) return 'grabbing';\n    if (this.hoverIndex >= 0) return 'pointer';\n    return 'grab';\n  }\n\n  render = () => {\n    const {\n      forwardStageRef,\n      chartDimensions: { width: requestedWidth, height: requestedHeight },\n      a11ySettings,\n      debugHistory,\n      theme,\n      canPinTooltip,\n    } = this.props;\n    const width = roundUpSize(requestedWidth);\n    const height = roundUpSize(requestedHeight);\n    const style: CSSProperties = {\n      width,\n      height,\n      top: 0,\n      left: 0,\n      padding: 0,\n      margin: 0,\n      border: 0,\n      position: 'absolute',\n      cursor: this.getActiveCursor(),\n    };\n\n    const dpr = window.devicePixelRatio * this.pinchZoomScale;\n    const canvasWidth = width * dpr;\n    const canvasHeight = height * dpr;\n    const hitCount = this.currentSearchHitCount;\n\n    const {\n      textColor,\n      buttonDisabledTextColor,\n      buttonBackgroundColor,\n      buttonDisabledBackgroundColor,\n      buttonTextColor,\n    } = theme.navigation;\n\n    return (\n      <>\n        <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n          <canvas /* WebGL2 layer */\n            ref={this.glCanvasRef}\n            className=\"echCanvasRenderer\"\n            width={canvasWidth}\n            height={canvasHeight}\n            style={style}\n            // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n            role=\"presentation\"\n          />\n          <canvas /* Canvas2d layer */\n            ref={forwardStageRef}\n            tabIndex={0}\n            className=\"echCanvasRenderer\"\n            width={canvasWidth}\n            height={canvasHeight}\n            onMouseMove={this.handleMouseHoverMove}\n            onMouseDown={this.handleMouseDown}\n            onContextMenu={canPinTooltip ? this.handleContextMenu : undefined}\n            onMouseLeave={this.handleMouseLeave}\n            onKeyPress={this.handleEnterKey}\n            onKeyUp={this.handleEscapeKey}\n            onWheel={this.handleWheel}\n            style={{ ...style, outline: 'none' }}\n            // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n            role=\"presentation\"\n          />\n        </figure>\n        <div\n          style={{\n            position: 'absolute',\n            transform: `translateY(${this.props.chartDimensions.height - PADDING_BOTTOM + 4}px)`,\n          }}\n        >\n          <label\n            title=\"Navigate back\"\n            style={{\n              color: this.navigator.canNavBackward() ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              marginLeft: 16,\n              marginRight: 4,\n              borderRadius: 4,\n              paddingInline: 4,\n              width: 18,\n              display: 'inline-block',\n              height: 16,\n              verticalAlign: 'middle',\n              textAlign: 'center',\n              backgroundColor: this.navigator.canNavBackward() ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n            }}\n          >\n            ᐸ\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => this.focusOnNavElement(this.navigator.navBackward())}\n              style={{ display: 'none' }}\n            />\n          </label>\n          <label\n            title=\"Reset\"\n            style={{\n              color: buttonTextColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              borderRadius: 4,\n              verticalAlign: 'middle',\n              backgroundColor: buttonBackgroundColor,\n            }}\n          >\n            ▲\n            <input type=\"button\" tabIndex={0} onClick={() => this.resetFocus()} style={{ display: 'none' }} />\n          </label>\n          <label\n            title=\"Navigate forward\"\n            style={{\n              color: this.navigator.canNavForward() ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              marginLeft: 4,\n              marginRight: 16,\n              borderRadius: 4,\n              paddingInline: 4,\n              verticalAlign: 'middle',\n              backgroundColor: this.navigator.canNavForward() ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n            }}\n          >\n            ᐳ\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => this.focusOnNavElement(this.navigator.navForward())}\n              style={{ display: 'none' }}\n            />\n          </label>\n          <input\n            ref={this.searchInputRef}\n            title=\"Search string or regex pattern\"\n            size={16}\n            type=\"text\"\n            tabIndex={0}\n            placeholder=\"Search string\"\n            onKeyPress={this.handleSearchFieldKeyPress}\n            onKeyUp={this.handleEscapeKey}\n            onChange={(e) => {\n              this.searchForText(false);\n              this.props.onSeachTextChange(e.currentTarget.value);\n            }}\n            style={{\n              border: 'none',\n              padding: 3,\n              outline: 'none',\n              color: textColor,\n              background: 'transparent',\n            }}\n          />\n          <label\n            title=\"Clear text\"\n            style={{\n              color: buttonTextColor,\n              background: buttonBackgroundColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              marginInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n            }}\n          >\n            Clear\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => {\n                if (this.currentSearchString && this.searchInputRef.current) {\n                  this.clearSearchText();\n                  this.props.onSeachTextChange('');\n                }\n              }}\n              style={{ display: 'none' }}\n            />\n          </label>\n\n          <label\n            title=\"Case sensitivity (highlighted: case sensitive)\"\n            style={{\n              backgroundColor:\n                this.caseSensitive && !this.useRegex ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n              color: this.caseSensitive && !this.useRegex ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              marginInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n            }}\n          >\n            Cc\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => {\n                if (!this.currentSearchString) return;\n                this.caseSensitive = !this.caseSensitive;\n                this.searchForText(true);\n              }}\n              style={{ display: 'none' }}\n            />\n          </label>\n          <label\n            title=\"Regex matching (highlighted: use regex)\"\n            style={{\n              color: this.useRegex ? buttonTextColor : buttonDisabledTextColor,\n              backgroundColor: this.useRegex ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              marginInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n            }}\n          >\n            . *\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => {\n                if (!this.currentSearchString) return;\n                this.useRegex = !this.useRegex;\n                this.searchForText(true);\n              }}\n              style={{ display: 'none' }}\n            />\n          </label>\n          <label\n            title=\"Previous hit\"\n            style={{\n              backgroundColor: hitCount ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n              color: hitCount ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              marginLeft: 16,\n              marginRight: 4,\n              paddingInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n              verticalAlign: 'middle',\n            }}\n          >\n            ◀\n            <input type=\"button\" tabIndex={0} onClick={this.previousHit} style={{ display: 'none' }} />\n          </label>\n          <label\n            title=\"Next hit\"\n            style={{\n              backgroundColor: hitCount ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n              color: hitCount ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n              verticalAlign: 'middle',\n            }}\n          >\n            ▶\n            <input type=\"button\" tabIndex={0} onClick={this.nextHit} style={{ display: 'none' }} />\n          </label>\n\n          <p\n            style={{\n              float: 'right',\n              padding: 3,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n              color: textColor,\n            }}\n          >\n            {`Match${Number.isNaN(this.focusedMatchIndex) ? 'es:' : `: ${this.focusedMatchIndex + 1} /`} ${hitCount}`}\n          </p>\n        </div>\n        <BasicTooltip\n          canPinTooltip={canPinTooltip}\n          onPointerMove={() => ({ type: ON_POINTER_MOVE, position: { x: NaN, y: NaN }, time: NaN })}\n          position={\n            this.tooltipPinned\n              ? { x: this.pinnedPointerX, y: this.pinnedPointerY, width: 0, height: 0 }\n              : { x: this.pointerX, y: this.pointerY, width: 0, height: 0 }\n          }\n          pinned={this.tooltipPinned}\n          selected={this.tooltipSelectedSeries}\n          pinTooltip={this.pinTooltip}\n          toggleSelectedTooltipItem={this.toggleSelectedTooltipItem}\n          setSelectedTooltipItems={this.setSelectedTooltipItems}\n          visible={\n            this.tooltipPinned || (this.props.tooltipRequired && this.hoverIndex >= 0 && !(this.wobbleTimeLeft > 0))\n          }\n          info={{\n            header: null,\n            values: this.tooltipValues,\n          }}\n          getChartContainerRef={this.props.containerRef}\n        />\n        {debugHistory && (\n          <div\n            style={{\n              position: 'absolute',\n              transform: `translate(20px, 20px)`,\n              background: 'beige',\n              opacity: 0.8,\n            }}\n          >\n            history:\n            <ul>\n              {this.navigator.queue().map((d, i) => {\n                return (\n                  <li key={`${d.index}-${i}`}>{`${Number.isNaN(d.index) ? 'ZOOM/PAN' : d.index}${\n                    this.navigator.index() === i ? '⬅' : ''\n                  }`}</li>\n                );\n              })}\n            </ul>\n          </div>\n        )}\n      </>\n    );\n  };\n\n  private smartDraw() {\n    // avoids an unnecessary setState for high frequency interactions once the tooltip is off\n    if (Number.isFinite(this.hoverIndex)) {\n      this.hoverIndex = NaN; // it's disturbing to have a tooltip while zooming/panning\n      this.setState({});\n    } else {\n      this.drawCanvas();\n    }\n  }\n\n  private drawCanvas = () => {\n    if (!this.ctx || !this.glContext || !this.pickTexture) return;\n\n    const renderFrame = drawFrame(\n      this.ctx,\n      this.glContext,\n      this.props.chartDimensions.width,\n      this.props.chartDimensions.height,\n      this.getMinimapWidth(),\n      this.getMinimapHeight(),\n      this.getMinimapLeft(),\n      this.getMinimapTop(),\n      window.devicePixelRatio * this.pinchZoomScale,\n      this.props.columnarViewModel,\n      this.pickTexture,\n      this.glResources.pickTextureRenderer,\n      this.glResources.roundedRectRenderer,\n      this.hoverIndex,\n      unitRowPitch(this.props.columnarViewModel.position1),\n      this.currentColor,\n      this.props.theme,\n    );\n\n    const anim = (t: DOMHighResTimeStamp) => {\n      const focusTimeDeltaMs = Number.isNaN(this.prevFocusTime) ? 0 : t - this.prevFocusTime;\n      this.prevFocusTime = t;\n\n      if (this.prevNodeTweenTime === Infinity) this.prevNodeTweenTime = t;\n      const nodeTweenTime = clamp((t - this.prevNodeTweenTime) / NODE_TWEEN_DURATION_MS, 0, 1);\n      const nodeTweenInProgress = nodeTweenTime < 1;\n\n      const dx0 = this.targetFocus.x0 - this.currentFocus.x0;\n      const dx1 = this.targetFocus.x1 - this.currentFocus.x1;\n      const dy0 = this.targetFocus.y0 - this.currentFocus.y0;\n      const dy1 = this.targetFocus.y1 - this.currentFocus.y1;\n\n      const currentExtentX = this.currentFocus.x1 - this.currentFocus.x0;\n      const currentExtentY = this.currentFocus.y1 - this.currentFocus.y0;\n\n      const relativeExpansionX = Math.max(1, (currentExtentX + dx1 - dx0) / currentExtentX);\n      const relativeExpansionY = Math.max(1, (currentExtentX + dy1 - dy0) / currentExtentY);\n      const jointRelativeExpansion = (relativeExpansionX + relativeExpansionY) / 2;\n\n      const convergenceRateX = Math.min(1, focusTimeDeltaMs * RECURRENCE_ALPHA_PER_MS_X) / jointRelativeExpansion;\n      const convergenceRateY = Math.min(1, focusTimeDeltaMs * RECURRENCE_ALPHA_PER_MS_Y) / jointRelativeExpansion;\n\n      this.currentFocus.x0 += convergenceRateX * dx0;\n      this.currentFocus.x1 += convergenceRateX * dx1;\n      this.currentFocus.y0 += convergenceRateY * dy0;\n      this.currentFocus.y1 += convergenceRateY * dy1;\n\n      this.wobbleTimeLeft -= focusTimeDeltaMs;\n      const wobbleAnimationInProgress = this.wobbleTimeLeft > 0;\n      const timeFromWobbleStart = clamp(WOBBLE_DURATION - this.wobbleTimeLeft, 0, WOBBLE_DURATION);\n\n      renderFrame(\n        [this.currentFocus.x0, this.currentFocus.x1, this.currentFocus.y0, this.currentFocus.y1],\n        this.wobbleIndex,\n        wobbleAnimationInProgress ? 0.01 + 0.99 * (0.5 - 0.5 * Math.cos(timeFromWobbleStart * WOBBLE_FREQUENCY)) : 0, // positive if it must wobble\n        nodeTweenTime,\n      );\n\n      const maxDiff = Math.max(Math.abs(dx0), Math.abs(dx1), Math.abs(dy0), Math.abs(dy1));\n      const focusAnimationInProgress = maxDiff > 1e-12;\n      if (focusAnimationInProgress || wobbleAnimationInProgress || nodeTweenInProgress) {\n        this.animationRafId = window.requestAnimationFrame(anim);\n      } else {\n        this.prevFocusTime = NaN;\n        this.currentFocus.x0 = this.targetFocus.x0;\n        this.currentFocus.x1 = this.targetFocus.x1;\n        this.currentFocus.y0 = this.targetFocus.y0;\n        this.currentFocus.y1 = this.targetFocus.y1;\n      }\n    };\n    window.cancelAnimationFrame(this.animationRafId);\n    this.animationRafId = window.requestAnimationFrame(anim);\n\n    this.props.onRenderChange(true); // emit API callback\n  };\n\n  private getMinimapWidth = () => this.props.chartDimensions.width / MINIMAP_SIZE_RATIO_X;\n  private getMinimapHeight = () => this.props.chartDimensions.height / MINIMAP_SIZE_RATIO_Y;\n  private getMinimapLeft = () => this.props.chartDimensions.width - this.getMinimapWidth();\n  private getMinimapTop = () => this.props.chartDimensions.height - this.getMinimapHeight();\n\n  private ensurePickTexture = () => {\n    const { width, height } = this.props.chartDimensions;\n    const pr = window.devicePixelRatio * this.pinchZoomScale;\n    const textureWidth = pr * width;\n    const textureHeight = pr * height;\n    const current = this.pickTexture;\n    if (\n      this.glContext &&\n      (current === NullTexture || current.width !== textureWidth || current.height !== textureHeight)\n    ) {\n      // (re)create texture\n      current.delete();\n      this.pickTexture =\n        createTexture(this.glContext, {\n          textureIndex: 0,\n          width: textureWidth,\n          height: textureHeight,\n          internalFormat: GL.RGBA8,\n          data: null,\n        }) ?? NullTexture;\n      bindFramebuffer(this.glContext, GL.READ_FRAMEBUFFER, this.pickTexture.target());\n    }\n  };\n\n  private initializeGL = (gl: WebGL2RenderingContext) => {\n    this.glResources = ensureWebgl(gl, Object.keys(this.props.columnarViewModel).filter(isAttributeKey));\n    uploadToWebgl(gl, this.glResources.attributes, this.props.columnarViewModel);\n  };\n\n  private restoreGL = (gl: WebGL2RenderingContext) => {\n    this.initializeGL(gl);\n    this.pickTexture = NullTexture;\n    this.uploadSearchColors();\n    this.ensureTextureAndDraw();\n  };\n\n  private tryCanvasContext = () => {\n    const canvas = this.props.forwardStageRef.current;\n    const glCanvas = this.glCanvasRef.current;\n\n    this.ctx = canvas && canvas.getContext('2d');\n    this.glContext = glCanvas && glCanvas.getContext('webgl2');\n\n    this.ensurePickTexture();\n\n    if (glCanvas && this.glContext && this.glResources === NULL_GL_RESOURCES) {\n      glCanvas.addEventListener('webglcontextlost', this.contextLossHandler, false);\n      glCanvas.addEventListener('webglcontextrestored', this.contextRestoreHandler, false);\n\n      this.initializeGL(this.glContext);\n      // testContextLoss(this.glContext);\n    }\n  };\n\n  private contextLossHandler = (event: { preventDefault: () => void }) => {\n    // we could log it for telemetry etc todo add the option for a callback\n    window.cancelAnimationFrame(this.animationRafId);\n    event.preventDefault(); // this is needed for the context restoration callback to happen\n  };\n\n  private contextRestoreHandler = () => {\n    // browser trivia: the duplicate calling of ensureContextAndInitialRender and changing/resetting the width are needed for Chrome and Safari to properly restore the context upon loss\n    // we could log context loss/regain for telemetry etc todo add the option for a callback\n    const glCanvas = this.glCanvasRef.current;\n    if (!glCanvas || !this.glContext) return;\n    this.restoreGL(this.glContext);\n    const widthCss = glCanvas.style.width;\n    const widthNum = parseFloat(widthCss);\n    glCanvas.style.width = `${widthNum + 0.1}px`;\n    window.setTimeout(() => {\n      glCanvas.style.width = widthCss;\n      if (this.glContext) this.restoreGL(this.glContext);\n    }, 0);\n  };\n}\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  const flameSpec = getSpecsFromStore<FlameSpec>(state.specs, ChartType.Flame, SpecType.Series)[0];\n  const settingsSpec = getSettingsSpecSelector(state);\n  const tooltipSpec = getTooltipSpecSelector(state);\n  return {\n    theme: getChartThemeSelector(state).flamegraph,\n    debugHistory: settingsSpec.debug,\n    columnarViewModel: flameSpec?.columnarData ?? nullColumnarViewModel,\n    controlProviderCallback: flameSpec?.controlProviderCallback ?? {},\n    animationDuration: flameSpec?.animation.duration ?? 0,\n    chartDimensions: state.parentDimensions,\n    a11ySettings: getA11ySettingsSelector(state),\n    tooltipRequired: tooltipSpec.type !== TooltipType.None,\n    canPinTooltip: isPinnableTooltip(state),\n    search: flameSpec?.search ?? { text: '' },\n    onSeachTextChange: flameSpec?.onSearchTextChange ?? (() => {}),\n    // mandatory charts API protocol; todo extract these mappings once there are other charts like Flame\n    onElementOver: settingsSpec.onElementOver ?? (() => {}),\n    onElementClick: settingsSpec.onElementClick ?? (() => {}),\n    onElementOut: settingsSpec.onElementOut ?? (() => {}),\n    onRenderChange: settingsSpec.onRenderChange ?? (() => {}), // todo eventually also update data props on a local .echChartStatus element: data-ech-render-complete={rendered} data-ech-render-count={renderedCount} data-ech-debug-state={debugStateString}\n  };\n};\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst FlameChartLayers = connect(mapStateToProps, mapDispatchToProps)(FlameComponent);\n\n/** @internal */\nexport const FlameWithTooltip = (containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) => (\n  <FlameChartLayers forwardStageRef={forwardStageRef} containerRef={containerRef} />\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { FlameWithTooltip } from './flame_chart';\nimport { ChartType } from '..';\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { LegendItemExtraValues } from '../../common/legend';\nimport { SeriesKey } from '../../common/series_id';\nimport { InternalChartState } from '../../state/chart_state';\nimport { InitStatus } from '../../state/selectors/get_internal_is_intialized';\n\n/** @internal */\nexport class FlameState implements InternalChartState {\n  chartType = ChartType.Flame;\n  getChartTypeDescription = () => 'Flame chart';\n  chartRenderer = FlameWithTooltip;\n\n  // default empty properties, unused in Flame\n  eventCallbacks = () => {};\n  isInitialized = () => InitStatus.Initialized;\n  isBrushAvailable = () => false;\n  isBrushing = () => false;\n  isChartEmpty = () => false;\n  canDisplayChartTitles = () => false;\n  getLegendItemsLabels = () => [];\n  getLegendItems = () => [];\n  getLegendExtraValues = () => new Map<SeriesKey, LegendItemExtraValues>();\n  getPointerCursor = () => DEFAULT_CSS_CURSOR;\n  getTooltipAnchor = () => ({ x: 0, y: 0, width: 0, height: 0 });\n  isTooltipVisible = () => ({ visible: false, isExternal: false, displayOnly: false, isPinnable: false });\n  getTooltipInfo = () => ({ header: null, values: [] });\n  getProjectionContainerArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getMainProjectionArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getBrushArea = () => null;\n  getDebugState = () => ({});\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { NavRect } from './flame_chart';\n\nfunction isZoomPanNav(nav?: NavRect) {\n  return nav && Number.isNaN(nav.index);\n}\n\n/** @internal */\nexport abstract class NavigationStrategy {\n  navIndex = 0;\n  navQueue: NavRect[] = [];\n  root: NavRect;\n  lastZoom: NavRect | undefined;\n\n  constructor(root: NavRect) {\n    this.root = root;\n    this.navQueue.push(this.root);\n  }\n\n  abstract add(toAdd: NavRect): void;\n\n  navForward() {\n    if (!this.canNavForward()) {\n      return;\n    }\n    this.navIndex++;\n    return this.current();\n  }\n\n  navBackward() {\n    if (!this.canNavBackward()) {\n      return;\n    }\n    this.navIndex--;\n    return this.current();\n  }\n\n  canNavForward = () => this.navIndex < this.navQueue.length - 1;\n\n  canNavBackward = () => this.navQueue.length > 0 && this.navIndex > 0;\n\n  current = (): NavRect | undefined => this.navQueue[this.navIndex];\n\n  next = (): NavRect | undefined => this.navQueue[this.navIndex + 1];\n\n  prev = (): NavRect | undefined => this.navQueue[this.navIndex - 1];\n\n  reset() {\n    this.navIndex = 0;\n    this.navQueue.splice(this.navIndex, Infinity, this.root);\n  }\n\n  backToTop = () => (this.navIndex = 0);\n\n  queue = () => this.navQueue;\n\n  index = () => this.navIndex;\n\n  lastInQueue = () => this.navIndex === this.navQueue.length - 1;\n}\n\n/**\n * Insert a click event between the current history item and the next one.\n * @internal\n */\nexport class InsertClicksEverywhere extends NavigationStrategy {\n  add(toAdd: NavRect) {\n    if (isZoomPanNav(toAdd)) {\n      return;\n    }\n    if (this.current()?.index !== toAdd.index) {\n      this.navQueue.splice(++this.navIndex, 0, toAdd);\n    }\n  }\n}\n\n/**\n * Add a click event after the current history item, and clear the rest of the history from here.\n * @internal\n */\nexport class ClearQueueTipAndAddClick extends NavigationStrategy {\n  add(toAdd: NavRect) {\n    if (isZoomPanNav(toAdd)) {\n      return;\n    }\n    if (this.current()?.index !== toAdd.index) {\n      this.navQueue.splice(++this.navIndex, Infinity, toAdd);\n    }\n  }\n}\n\n/**\n * Same as ClearQueueTipAndAddClick but  includes zoom/pan events only at the tip of the queue\n * @internal\n */\nexport class PushZoomPanToQueueTip extends NavigationStrategy {\n  add(toAdd: NavRect) {\n    if (isZoomPanNav(toAdd)) {\n      // do not add zoom/pan event if not at the end of the queue\n      if (!this.lastInQueue()) {\n        return;\n      } else {\n        // at the end of the queue, add the zoom event\n        if (isZoomPanNav(this.current())) {\n          // update the zoom event if the last is zoom\n          this.navQueue.splice(this.navIndex, 1, toAdd);\n        } else {\n          // add only at the last place\n          this.navQueue.splice(++this.navIndex, 0, toAdd);\n        }\n      }\n    } else {\n      if (this.lastInQueue()) {\n        if (isZoomPanNav(this.current())) {\n          // replace if last is zoom\n          this.navQueue.splice(this.navIndex, 1, toAdd);\n        } else {\n          // add only if differ from current\n          if (this.current()?.index !== toAdd.index) {\n            this.navQueue.splice(++this.navIndex, 0, toAdd);\n          }\n        }\n      } else {\n        // add only if differ from current\n        if (this.current()?.index !== toAdd.index) {\n          this.navQueue.splice(++this.navIndex, Infinity, toAdd);\n        }\n      }\n    }\n  }\n}\n\n/**\n * Add Zoom/Pan events when back/forward button are clicked\n * @internal\n */\nexport class NavButtonControlledZoomPanHistory extends NavigationStrategy {\n  navForward() {\n    if (!this.canNavForward()) {\n      return;\n    }\n    if (this.lastZoom) {\n      this.navQueue.splice(++this.navIndex, 0, { ...this.lastZoom });\n      this.lastZoom = undefined;\n    }\n    this.navIndex++;\n    return this.current();\n  }\n\n  navBackward() {\n    if (!this.canNavBackward()) {\n      return;\n    }\n    if (this.lastZoom) {\n      this.navQueue.splice(++this.navIndex, 0, { ...this.lastZoom });\n      this.lastZoom = undefined;\n    }\n    this.navIndex--;\n    return this.current();\n  }\n\n  add(toAdd: NavRect) {\n    if (isZoomPanNav(toAdd)) {\n      this.lastZoom = { ...toAdd };\n    } else {\n      this.lastZoom = undefined;\n      if (this.current()?.index !== toAdd.index) {\n        this.navQueue.splice(++this.navIndex, Infinity, toAdd);\n      }\n    }\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const BOX_GAP_HORIZONTAL = 0.5;\n\n/** @internal */\nexport const BOX_GAP_VERTICAL = 2;\n\nconst CANVAS_SIZE_INCREMENT = 256; // to avoid thrashing the layout and canvases on every one pixel width/height change\n\n/** @internal */\nexport const roundUpSize = (cssPixelSize: number) =>\n  CANVAS_SIZE_INCREMENT * Math.ceil(cssPixelSize / CANVAS_SIZE_INCREMENT);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { roundUpSize } from './common';\nimport { drawCanvas2d, drawRect } from './draw_canvas';\nimport { drawWebgl } from './draw_webgl';\nimport { Render, Texture } from '../../../common/kingly';\nimport { FlamegraphStyle } from '../../../utils/themes/theme';\nimport { ColumnarViewModel } from '../flame_api';\n\nconst CHART_BOX_LINE_WIDTH = 0.5;\nconst MINIMAP_FOCUS_BOX_LINE_WIDTH = 1;\nconst MINIMAP_BOX_LINE_WIDTH = 1;\n/** @internal */\nexport const PADDING_TOP = 16; // for the UI controls and the minimap protrusion\n/** @internal */\nexport const PADDING_BOTTOM = 24; // for the UI controls and the minimap protrusion\n/** @internal */\nexport const PADDING_LEFT = 16; // for the location indicator or edge zoom\n/** @internal */\nexport const PADDING_RIGHT = 16; // for aesthetic purposes or edge zoom\nconst FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH = 0.5;\nconst MINIMUM_FOCUS_INDICATOR_LENGTH = 4;\nconst TERMINAL_TICK_LINE_WIDTH = 1;\nconst TERMINAL_TICK_LINE_LENGTH = 4;\n\n/** @internal */\nexport const EPSILON = 1e-4;\n\n/** @internal */\nexport const drawFrame =\n  (\n    ctx: CanvasRenderingContext2D,\n    gl: WebGL2RenderingContext,\n    cssWidth: number,\n    cssHeight: number,\n    minimapWidth: number,\n    minimapHeight: number,\n    minimapLeft: number,\n    minimapTop: number,\n    dpr: number,\n    columnarGeomData: ColumnarViewModel,\n    pickTexture: Texture,\n    pickTextureRenderer: Render,\n    roundedRectRenderer: Render,\n    hoverIndex: number,\n    unitRowHeight: number,\n    currentColor: Float32Array,\n    theme: FlamegraphStyle,\n  ) =>\n  (currentFocus: [number, number, number, number], wobbleIndex: number, wobble: number, nodeTweenTime: number) => {\n    const canvasHeightExcess = (roundUpSize(cssHeight) - cssHeight) * dpr;\n\n    const minimapBottom = minimapTop + minimapHeight;\n\n    const minimapCanvasWidth = minimapWidth * dpr;\n    const minimapCanvasHeight = minimapHeight * dpr;\n    const minimapCanvasX = minimapLeft * dpr;\n    const minimapCanvasY = canvasHeightExcess;\n\n    const focusLayerCssWidth = cssWidth - PADDING_LEFT - PADDING_RIGHT;\n    const focusLayerCanvasWidth = focusLayerCssWidth * dpr;\n    const focusLayerCanvasOffsetX = PADDING_LEFT * dpr;\n\n    const focusLayerCssHeight = cssHeight - PADDING_TOP - PADDING_BOTTOM;\n\n    const fullFocus: [number, number, number, number] = [0, 1, 0, 1];\n\n    const { scrollbarThumb, scrollbarTrack } = theme;\n\n    const drawFocusLayer = (pickLayer: boolean) =>\n      drawWebgl(\n        gl,\n        nodeTweenTime,\n        focusLayerCanvasWidth,\n        focusLayerCssHeight * dpr,\n        focusLayerCanvasOffsetX,\n        (pickLayer ? 0 : canvasHeightExcess) + dpr * PADDING_BOTTOM,\n        pickTexture,\n        pickLayer ? pickTextureRenderer : roundedRectRenderer,\n        wobble ? NaN : hoverIndex, // no hover highlight during wobble\n        unitRowHeight,\n        currentFocus,\n        columnarGeomData.label.length,\n        true,\n        pickLayer,\n        wobbleIndex,\n        wobble,\n      );\n\n    const drawContextLayer = (pickLayer: boolean) =>\n      drawWebgl(\n        gl,\n        nodeTweenTime,\n        minimapCanvasWidth,\n        minimapCanvasHeight,\n        minimapCanvasX,\n        pickLayer ? 0 : minimapCanvasY,\n        pickTexture,\n        pickLayer ? pickTextureRenderer : roundedRectRenderer,\n        hoverIndex,\n        unitRowHeight,\n        fullFocus,\n        columnarGeomData.label.length,\n        false,\n        pickLayer,\n        wobbleIndex, // useful to wobble on the minimap too\n        wobble,\n      );\n\n    // base (focus) layer\n    drawFocusLayer(false);\n\n    // minimap geoms\n    drawContextLayer(false);\n\n    // base (focus) pick layer\n    drawFocusLayer(true);\n\n    // minimap pick layer -- just for clearing, to avoid hover tooltip\n    drawContextLayer(true);\n\n    // focus layer text\n    drawCanvas2d(\n      ctx,\n      nodeTweenTime,\n      focusLayerCssWidth,\n      focusLayerCssHeight,\n      PADDING_LEFT,\n      PADDING_TOP,\n      dpr,\n      columnarGeomData,\n      unitRowHeight,\n      currentFocus,\n      currentColor,\n    );\n\n    // focus chart border\n    drawRect(\n      ctx,\n      focusLayerCssWidth,\n      focusLayerCssHeight,\n      PADDING_LEFT,\n      focusLayerCssHeight + PADDING_TOP,\n      dpr,\n      fullFocus,\n      '',\n      'black',\n      CHART_BOX_LINE_WIDTH,\n    );\n\n    // focus chart horizontal placeholder\n    drawRect(\n      ctx,\n      focusLayerCssWidth,\n      0,\n      PADDING_LEFT,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH / 2,\n      dpr,\n      fullFocus,\n      '',\n      scrollbarTrack,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH,\n    );\n\n    // focus chart horizontal focus indicator\n    drawRect(\n      ctx,\n      Math.max(0, focusLayerCssWidth * (currentFocus[1] - currentFocus[0])),\n      0,\n      PADDING_LEFT + focusLayerCssWidth * currentFocus[0],\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH / 2,\n      dpr,\n      fullFocus,\n      '',\n      scrollbarThumb,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH,\n    );\n\n    // focus chart horizontal focus terminal - start\n    const atWallLeft = Math.abs(currentFocus[0]) < EPSILON ? 4 : 1;\n    drawRect(\n      ctx,\n      TERMINAL_TICK_LINE_WIDTH * atWallLeft,\n      TERMINAL_TICK_LINE_LENGTH * atWallLeft,\n      PADDING_LEFT + focusLayerCssWidth * currentFocus[0] - (TERMINAL_TICK_LINE_WIDTH * atWallLeft) / 2,\n      TERMINAL_TICK_LINE_LENGTH + (FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH * atWallLeft) / 2,\n      dpr,\n      fullFocus,\n      scrollbarThumb,\n      '',\n      0,\n    );\n\n    // focus chart horizontal focus terminal - end\n    const atWallRight = Math.abs(currentFocus[1] - 1) < EPSILON ? 4 : 1;\n    drawRect(\n      ctx,\n      TERMINAL_TICK_LINE_WIDTH * atWallRight,\n      TERMINAL_TICK_LINE_LENGTH * atWallRight,\n      PADDING_LEFT + focusLayerCssWidth * currentFocus[1] - (TERMINAL_TICK_LINE_WIDTH * atWallRight) / 2,\n      TERMINAL_TICK_LINE_LENGTH + (FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH * atWallRight) / 2,\n      dpr,\n      fullFocus,\n      scrollbarThumb,\n      '',\n      0,\n    );\n\n    // focus chart vertical placeholder\n    drawRect(\n      ctx,\n      0,\n      focusLayerCssHeight,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH / 2,\n      focusLayerCssHeight + PADDING_TOP,\n      dpr,\n      fullFocus,\n      '',\n      scrollbarTrack,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH,\n    );\n\n    // focus chart vertical focus indicator\n    drawRect(\n      ctx,\n      0,\n      Math.max(MINIMUM_FOCUS_INDICATOR_LENGTH, focusLayerCssHeight * (currentFocus[3] - currentFocus[2])),\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH / 2,\n      focusLayerCssHeight * (1 - currentFocus[2]) + PADDING_TOP,\n      dpr,\n      fullFocus,\n      '',\n      scrollbarThumb,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH,\n    );\n\n    // focus chart vertical focus terminal - start\n    const atWallTop = Math.abs(currentFocus[2]) < EPSILON ? 4 : 1;\n    drawRect(\n      ctx,\n      TERMINAL_TICK_LINE_LENGTH + 1, // 1 is added to make it the same side as horizontal; todo check why\n      TERMINAL_TICK_LINE_WIDTH * atWallTop,\n      0,\n      focusLayerCssHeight * (1 - currentFocus[2]) + PADDING_TOP,\n      dpr,\n      fullFocus,\n      scrollbarThumb,\n      '',\n      0,\n    );\n\n    // focus chart vertical focus terminal - end\n    const atWallBottom = Math.abs(currentFocus[3] - 1) < EPSILON ? 4 : 1;\n    drawRect(\n      ctx,\n      TERMINAL_TICK_LINE_LENGTH + 1, // 1 is added to make it the same side as horizontal; todo check why\n      TERMINAL_TICK_LINE_WIDTH * atWallBottom,\n      0,\n      focusLayerCssHeight * (1 - currentFocus[3]) + PADDING_TOP,\n      dpr,\n      fullFocus,\n      scrollbarThumb,\n      '',\n      0,\n    );\n\n    // minimap box - erase Canvas2d text from the main chart that falls within the minimap area\n    drawRect(\n      ctx,\n      minimapWidth,\n      minimapHeight,\n      minimapLeft,\n      minimapBottom,\n      dpr,\n      fullFocus,\n      'rgba(255,255,255,1)',\n      '',\n      0,\n    );\n\n    // minimap box - make the Canvas2d transparent, so that the webgl layer underneath (minimap geoms) show up\n    drawRect(ctx, minimapWidth, minimapHeight, minimapLeft, minimapBottom, dpr, fullFocus, 'transparent', '', 0);\n\n    // minimap focus border\n    drawRect(\n      ctx,\n      minimapWidth,\n      minimapHeight,\n      minimapLeft,\n      minimapBottom,\n      dpr,\n      currentFocus,\n      '',\n      'magenta',\n      MINIMAP_FOCUS_BOX_LINE_WIDTH,\n    );\n\n    // minimap box rectangle\n    drawRect(\n      ctx,\n      minimapWidth,\n      minimapHeight,\n      minimapLeft,\n      minimapBottom,\n      dpr,\n      fullFocus,\n      '',\n      'black',\n      MINIMAP_BOX_LINE_WIDTH,\n    );\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BOX_GAP_HORIZONTAL, BOX_GAP_VERTICAL, roundUpSize } from './common';\nimport { DEFAULT_FONT_FAMILY } from '../../../common/default_theme_attributes';\nimport { cssFontShorthand } from '../../../common/text_utils';\nimport { LabelAccessor } from '../../../utils/common';\nimport { ColumnarViewModel } from '../flame_api';\n\nconst scale = (value: number, from: number, to: number) => (value - from) / (to - from);\nconst formatter: LabelAccessor<string> = (label: string) => label; // todo loop in API value\n\nconst TEXT_PAD_LEFT = 4;\nconst TEXT_PAD_RIGHT = 4;\nconst MIN_TEXT_LENGTH = 0; // in font height, so 1 means roughly 2 characters (latin characters are tall on average)\nconst ROW_OFFSET_Y = 0.45; // approx. middle line (text is middle anchored so tall bars with small fonts can still have vertically centered text)\nconst MAX_FONT_HEIGHT_RATIO = 1; // relative to the row height\nconst MAX_FONT_SIZE = 12;\n\nconst mix = (a: number = 1, b: number = 1, x: number = 1) => (1 - x) * a + x * b; // like the GLSL `mix`\n\n/** @internal */\nexport const drawCanvas2d = (\n  ctx: CanvasRenderingContext2D,\n  logicalTime: number,\n  cssWidth: number,\n  cssHeight: number,\n  cssOffsetX: number,\n  cssOffsetY: number,\n  dpr: number,\n  columnarGeomData: ColumnarViewModel,\n  rowHeight: number,\n  [focusLoX, focusHiX, focusLoY, focusHiY]: [number, number, number, number],\n  color: Float32Array,\n) => {\n  const zoomedRowHeight = rowHeight / Math.abs(focusHiY - focusLoY);\n  const rowHeightPx = zoomedRowHeight * cssHeight;\n  const fontSize = Math.min(\n    2.6 * Math.log2((zoomedRowHeight * cssHeight - BOX_GAP_VERTICAL) * MAX_FONT_HEIGHT_RATIO),\n    MAX_FONT_SIZE,\n  );\n  const minTextLengthCssPix = MIN_TEXT_LENGTH * fontSize; // don't render shorter text than this\n  const minRectWidthForTextInCssPix = minTextLengthCssPix + TEXT_PAD_LEFT + TEXT_PAD_RIGHT;\n  const minRectWidth = minRectWidthForTextInCssPix / cssWidth;\n  const textColor = 'black'; // todo it could come from config / theme or automatic decision like in other charts\n\n  // text rendering\n  ctx.save();\n  ctx.textAlign = 'left';\n  ctx.textBaseline = 'middle';\n  ctx.scale(dpr, dpr);\n  ctx.font = cssFontShorthand(\n    { fontFamily: DEFAULT_FONT_FAMILY, fontStyle: 'normal', fontVariant: 'normal', fontWeight: 'normal' },\n    fontSize,\n  );\n  ctx.clearRect(0, 0, roundUpSize(cssWidth + cssOffsetX), roundUpSize(cssHeight + cssOffsetY));\n  ctx.translate(cssOffsetX, cssOffsetY);\n  ctx.beginPath();\n  ctx.rect(0, 0, roundUpSize(cssWidth), cssHeight);\n  ctx.clip();\n  let lastTextColor = '';\n  let lastTextAlpha = 1;\n\n  columnarGeomData.label.forEach((dataName, i) => {\n    const label = formatter(dataName);\n    const size = mix(columnarGeomData.size0[i], columnarGeomData.size1[i], logicalTime);\n    // todo also trivially skip text outside the current view (eg. more than 1 row above currently selected node; or left/right of the currently selected node\n    // otherwise it becomes too choppy as the horizontal magnification makes rectangles wider for text even outside the chart\n    const scaledSize = size / (focusHiX - focusLoX);\n    if (label && scaledSize >= minRectWidth) {\n      const xNorm = mix(columnarGeomData.position0[2 * i], columnarGeomData.position1[2 * i], logicalTime);\n      const yNorm = mix(columnarGeomData.position0[2 * i + 1], columnarGeomData.position1[2 * i + 1], logicalTime);\n      if (xNorm + size < focusLoX || xNorm > focusHiX || yNorm + rowHeight < focusLoY || yNorm > focusHiY) return; // don't render what's outside\n      const baseX = scale(xNorm, focusLoX, focusHiX) * cssWidth;\n      const leftOutside = Math.max(0, -baseX);\n      const x = baseX + leftOutside; // don't start the text in the negative range, b/c it's not readable there\n      const y = cssHeight * (1 - scale(yNorm, focusLoY, focusHiY));\n      const baseWidth = scaledSize * cssWidth - BOX_GAP_HORIZONTAL - TEXT_PAD_RIGHT;\n      const width = baseWidth - leftOutside; // if a box is partially cut on the left, the remaining box becomes smaller\n      ctx.beginPath();\n      const renderedWidth = Math.min(width, cssWidth - x); // to not let text protrude on the right when zooming\n      ctx.rect(x, y - zoomedRowHeight * cssHeight, renderedWidth, rowHeightPx);\n      if (textColor !== lastTextColor) {\n        // as we're sorting the iteration, the number of color changes (API calls) is minimized\n        ctx.fillStyle = textColor;\n        lastTextColor = textColor;\n      }\n      const textAlpha = color[i * 4 + 3] ?? 1;\n      if (textAlpha !== lastTextAlpha) {\n        // as we're sorting the iteration, the number of color changes (API calls) is minimized\n        ctx.globalAlpha = textAlpha;\n        lastTextAlpha = textAlpha;\n      }\n      ctx.save();\n      ctx.clip();\n      ctx.fillText(label, x + TEXT_PAD_LEFT, y - ROW_OFFSET_Y * zoomedRowHeight * cssHeight);\n      ctx.restore();\n    }\n  });\n  ctx.restore();\n};\n\n/** @internal */\nexport const drawRect = (\n  ctx: CanvasRenderingContext2D,\n  cssWidth: number,\n  cssHeight: number,\n  left: number,\n  bottom: number,\n  dpr: number,\n  [focusLoX, focusHiX, focusLoY, focusHiY]: [number, number, number, number],\n  fillColor: string,\n  borderColor: string,\n  borderLineWidth: number,\n) => {\n  // text rendering\n  ctx.save();\n  ctx.scale(dpr, dpr);\n  ctx.beginPath();\n  const boxHeight = cssHeight * Math.abs(focusHiY - focusLoY);\n  const x = left + cssWidth * focusLoX + borderLineWidth / 2;\n  const y = bottom - boxHeight - focusLoY * cssHeight + borderLineWidth / 2;\n  const width = Math.max(borderLineWidth, cssWidth * (focusHiX - focusLoX) - borderLineWidth);\n  const height = Math.max(borderLineWidth, boxHeight - borderLineWidth);\n  if (fillColor === 'transparent') {\n    ctx.clearRect(x, y, width, height);\n  } else {\n    ctx.rect(x, y, width, height);\n  }\n  if (fillColor && fillColor !== 'transparent') {\n    ctx.fillStyle = fillColor;\n    ctx.fill();\n  }\n  if (borderColor && borderLineWidth > 0) {\n    ctx.strokeStyle = borderColor;\n    ctx.lineWidth = borderLineWidth;\n    ctx.stroke();\n  }\n  ctx.restore();\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BOX_GAP_HORIZONTAL, BOX_GAP_VERTICAL } from './common';\nimport { Render, Texture } from '../../../common/kingly';\nimport { GEOM_INDEX_OFFSET } from '../shaders';\n\n// text rendering and other config\nconst MAX_PADDING_RATIO = 0.25;\nconst MIN_FILL_RATIO = [1 - MAX_PADDING_RATIO, 0.6]; // retain at least 90% of the width and 60% of the height\nconst CORNER_RADIUS_RATIO = 0.25; // as a proportion of the shorter rectangle edge length\nconst VERTICES_PER_GEOM = 4; // assuming `gl.TRIANGLE_STRIP`\nconst DUMMY_INDEX = -1; // GLSL doesn't guarantee a NaN, and it's a shader integer anyway, so let's find a safe special number\n\n/** @internal */\nexport const drawWebgl = (\n  gl: WebGL2RenderingContext,\n  nodeTweenTime: number,\n  canvasWidth: number,\n  canvasHeight: number,\n  xOffset: number,\n  yOffset: number,\n  pickTexture: Texture,\n  renderer: Render,\n  hoverIndex: number,\n  rowHeight: number,\n  f: [number, number, number, number],\n  instanceCount: number,\n  focusLayer: boolean,\n  pickLayer: boolean,\n  wobbleIndex: number,\n  wobble: number,\n) =>\n  renderer({\n    target: pickLayer ? pickTexture.target() : null,\n    uniformValues: {\n      pickLayer,\n      nodeTweenTime: Math.max(0.001, nodeTweenTime), // for some reason, an exact zero will lead to `mix` as if it were 1 (glitch)\n      resolution: [canvasWidth, canvasHeight],\n      gapPx: pickLayer || !focusLayer ? [0, 0] : [BOX_GAP_HORIZONTAL, BOX_GAP_VERTICAL], // in CSS pixels (but let's not leave a gap for shape picking)\n      minFillRatio: MIN_FILL_RATIO,\n      cornerRadiusPx: pickLayer ? 0 : canvasHeight * rowHeight * CORNER_RADIUS_RATIO, // note that for perf reasons the fragment shaders are split anyway\n      hoverIndex: Number.isFinite(hoverIndex) ? hoverIndex + GEOM_INDEX_OFFSET : DUMMY_INDEX,\n      wobbleIndex: Number.isFinite(wobbleIndex) ? wobbleIndex + GEOM_INDEX_OFFSET : DUMMY_INDEX,\n      wobble,\n      rowHeight0: rowHeight,\n      rowHeight1: rowHeight,\n      focus: [f[0], f[1], 0, 0, f[2], f[3], 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],\n    },\n    viewport: { x: xOffset, y: yOffset, width: canvasWidth, height: canvasHeight }, // may conditionalize on textureWidthChanged || textureHeightChanged\n    clear: {\n      color: [0, 0, 0, focusLayer || pickLayer ? 0 : 0.03],\n      rect: [xOffset, yOffset, canvasWidth, canvasHeight],\n    },\n    draw:\n      pickLayer && !focusLayer\n        ? undefined\n        : {\n            geom: gl.TRIANGLE_STRIP,\n            offset: 0,\n            count: VERTICES_PER_GEOM,\n            instanceCount,\n          },\n  });\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  bindVertexArray,\n  createCompiledShader,\n  createLinkedProgram,\n  getAttributes,\n  getRenderer,\n  resetState,\n} from '../../../common/kingly';\nimport { GL } from '../../../common/webgl_constants';\nimport { attributeLocations, colorFrag, roundedRectFrag, roundedRectVert, simpleRectVert } from '../shaders';\nimport { GLResources, NULL_GL_RESOURCES } from '../types';\n\n/** @internal */\nexport function ensureWebgl(\n  gl: WebGL2RenderingContext,\n  instanceAttributes: Array<keyof typeof attributeLocations>,\n): GLResources {\n  resetState(gl);\n\n  /**\n   * Vertex array attributes\n   */\n\n  const vao = gl.createVertexArray();\n  if (!vao) return NULL_GL_RESOURCES;\n\n  bindVertexArray(gl, vao);\n\n  // by how many instances should each attribute advance?\n  instanceAttributes.forEach((name) => gl.vertexAttribDivisor(attributeLocations[name], 1));\n\n  /**\n   * Programs\n   */\n\n  const geomProgram = createLinkedProgram(\n    gl,\n    createCompiledShader(gl, GL.VERTEX_SHADER, roundedRectVert),\n    createCompiledShader(gl, GL.FRAGMENT_SHADER, roundedRectFrag),\n    attributeLocations,\n  );\n\n  const pickProgram = createLinkedProgram(\n    gl,\n    createCompiledShader(gl, GL.VERTEX_SHADER, simpleRectVert),\n    createCompiledShader(gl, GL.FRAGMENT_SHADER, colorFrag),\n    attributeLocations,\n  );\n\n  /**\n   * Resource allocation: Render setup\n   */\n\n  // couple the program with the attribute input and global GL flags\n  const roundedRectRenderer = getRenderer(gl, geomProgram, vao, { depthTest: false, blend: true });\n  const pickTextureRenderer = getRenderer(gl, pickProgram, vao, { depthTest: false, blend: false });\n\n  const attributes = getAttributes(gl, geomProgram, attributeLocations);\n\n  return { roundedRectRenderer, pickTextureRenderer, attributes };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Attributes } from '../../../common/kingly';\nimport { ColumnarViewModel } from '../flame_api';\n\n/** @internal */\nexport function uploadToWebgl(\n  gl: WebGL2RenderingContext,\n  attributes: Attributes,\n  columnarViewModel: Partial<ColumnarViewModel>,\n) {\n  attributes.forEach((setValue, key) => {\n    const value = columnarViewModel[key as keyof ColumnarViewModel];\n    if (value instanceof Float32Array) setValue(value);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const attributeLocations = {\n  position0: 0,\n  position1: 1,\n  size0: 2,\n  size1: 3,\n  color: 4,\n};\n\n/** @internal */\nexport const GEOM_INDEX_OFFSET = 1; // zero color means, empty area (no rectangle) so the rectangles are base 1 indexed for pick coloring\n\nconst vertTop = /* language=GLSL */ `#version 300 es\n  #pragma STDGL invariant(all)\n  precision highp int;\n  precision highp float;\n`;\n\nconst fragTop = /* language=GLSL */ `#version 300 es\n  precision highp int;\n  precision highp float;\n`;\n\nconst attribDefs = /* language=GLSL */ `\n  layout(location=${attributeLocations.position0}) in vec2 position0;\n  layout(location=${attributeLocations.position1}) in vec2 position1;\n  layout(location=${attributeLocations.size0}) in float size0;\n  layout(location=${attributeLocations.size1}) in float size1;\n  layout(location=${attributeLocations.color}) in vec4 color;\n`;\n\nconst uniformDefs = /* language=GLSL */ `\n  uniform mat4 focus; // [[focusLoX, focusHiX], [focusLoY, focusHiY]]\n  uniform vec2 resolution;\n  uniform vec2 gapPx;\n  uniform vec2 minFillRatio; // at least this ratio of the rectangle's full width/height must be filled\n  uniform float rowHeight0;\n  uniform float rowHeight1;\n  uniform float nodeTweenTime; // 0: start position; 1: end position\n  uniform float cornerRadiusPx;\n  uniform float hoverIndex;\n  uniform float wobbleIndex;\n  uniform float wobble;\n  uniform bool pickLayer;\n`;\n\nconst constants = /* language=GLSL */ `\n  const vec4 UNIT4 = vec4(1.0);\n  const uvec4 BIT_SHIFTERS = uvec4(24, 16, 8, 0); // helps pack a 32bit unsigned integer into the RGBA bytes\n  const float HOVER_OPACITY = 0.382; // arbitrary; set to the smaller part of the golden ratio\n  const int GEOM_INDEX_OFFSET = ${GEOM_INDEX_OFFSET};\n`;\n\nconst structGeom = /* language=GLSL */ `\n  struct Geom {\n    vec2 unitSquareCoord;\n    vec2 size;\n    vec4 glPosition;\n    vec4 fragmentColor;\n  };\n`;\n\nconst getViewable = /* language=GLSL */ `\n  vec2 getViewable() {\n    float viewableX = focus[0][1] - focus[0][0];\n    float viewableY = focus[1][1] - focus[1][0];\n    return vec2(viewableX, viewableY);\n  }\n`;\n\nconst getGeom = /* language=GLSL */ `\n  Geom getGeom(vec2 viewable, vec2 gap, vec2 maxGapRatio) {\n    // calculate the basic geometry invariant of gaps, rounding or zoom levels\n    int x = gl_VertexID & 1;        // x yields 0, 1, 0, 1 for gl_VertexID 0, 1, 2, 3\n    int y = (gl_VertexID >> 1) & 1; // y yields 0, 0, 1, 1 for gl_VertexID 0, 1, 2, 3\n    vec2 unitSquareCoord = vec2(x, y);\n    vec2 position = mix(position0, position1, nodeTweenTime);\n    vec2 size = mix(vec2(size0, rowHeight0), vec2(size1, rowHeight1), nodeTweenTime);\n    vec2 fullSizeXY = size * unitSquareCoord;\n\n    // determine what we're zooming/panning into\n    vec2 baseXY = fullSizeXY + position;\n    vec2 pan = vec2(focus[0][0], focus[1][0]);\n\n    // gl_VertexID iterates as an integer index 0, 1, 2, ..., (offset + 0, offset + 1, ..., offset + count - 1)\n    // these four coordinates form a rectangle, set up as two counterclockwise triangles with gl.TRIANGLE_STRIP\n    // clip coordinate x/y goes from -1 to 1 of the viewport, so we center with this 0.5 subtraction\n    vec2 gr = min(gap, maxGapRatio * fullSizeXY);\n    vec2 xy = baseXY - unitSquareCoord * gr;\n    vec2 zoomPannedXY = (xy - pan) / viewable;\n\n    // output the position and color values (approx. return values of our vertex shader)\n    // project [0, 1] normalized values to [-1, 1] homogeneous clip space values\n    vec4 glPosition = vec4(2.0 * zoomPannedXY - 1.0, 0, 1);\n\n    vec4 fragmentColor = pickLayer\n      ? vec4((uvec4(gl_InstanceID + GEOM_INDEX_OFFSET) >> BIT_SHIFTERS) % uvec4(256)) / 255.0\n      : vec4(\n          color.rgb,\n          color.a\n            * (gl_InstanceID == int(hoverIndex) - GEOM_INDEX_OFFSET ? HOVER_OPACITY : 1.0)\n            * (gl_InstanceID == int(wobbleIndex) - GEOM_INDEX_OFFSET && wobble > 0.0 ? 1.0 - wobble : 1.0)\n        );\n\n    return Geom(\n      unitSquareCoord,\n      size,\n      glPosition,\n      fragmentColor\n    );\n  }\n`;\n\n/** @internal */\nexport const simpleRectVert = /* language=GLSL */ `${vertTop}\n  ${attribDefs}\n  ${uniformDefs}\n\n  out vec4 fragmentColor;\n\n  ${constants}\n  ${structGeom}\n  ${getViewable}\n  ${getGeom}\n\n  void main() {\n    Geom g = getGeom(getViewable(), vec2(0), vec2(0));\n    gl_Position = g.glPosition;\n    fragmentColor = g.fragmentColor;\n  }\n`;\n\n/** @internal */\nexport const roundedRectVert = /* language=GLSL */ `${vertTop}\n  ${attribDefs}\n  ${uniformDefs}\n\n  out vec4 fragmentColor;\n  out vec2 corners[4];\n  out float radiusPx;\n\n  ${constants}\n  ${structGeom}\n  ${getViewable}\n  ${getGeom}\n\n  void main() {\n    vec2 viewable = getViewable();\n\n    // calculate the gap-aware geometry\n    vec2 zoomedResolution = resolution / viewable;\n    vec2 gap = gapPx / zoomedResolution;\n\n    vec2 maxGapRatio = 1.0 - minFillRatio;\n    Geom g = getGeom(viewable, gap, maxGapRatio);\n\n    gl_Position = g.glPosition;\n    fragmentColor = g.fragmentColor;\n\n    // calculate rounded corner metrics for interpolation\n    vec2 pixelSize = g.size * zoomedResolution;\n    radiusPx = min(cornerRadiusPx, 0.5 * min(pixelSize.x, pixelSize.y));\n\n    // output the corner helper values  (approx. return values of our vertex shader)\n    corners[0] = g.unitSquareCoord * g.size * zoomedResolution - radiusPx;\n    corners[1] = (g.unitSquareCoord * vec2(-1, 1) + vec2(1, 0)) * g.size * zoomedResolution - radiusPx;\n    corners[2] = (g.unitSquareCoord * vec2(1, -1) + vec2(0, 1)) * g.size * zoomedResolution - radiusPx;\n    corners[3] = (1.0 - g.unitSquareCoord) * g.size * zoomedResolution - radiusPx;\n  }\n`;\n\n/** @internal */\nexport const roundedRectFrag = /* language=GLSL */ `${fragTop}\n  in vec4 fragmentColor;\n  in vec2 corners[4];\n  in float radiusPx;\n\n  out vec4 fragColor;\n\n  void main() {\n    if((   min(0.0, sign(corners[0].x) + sign(corners[0].y) + sign(radiusPx - length(corners[0])) + 2.0)\n         + min(0.0, sign(corners[1].x) + sign(corners[1].y) + sign(radiusPx - length(corners[1])) + 2.0)\n         + min(0.0, sign(corners[2].x) + sign(corners[2].y) + sign(radiusPx - length(corners[2])) + 2.0)\n         + min(0.0, sign(corners[3].x) + sign(corners[3].y) + sign(radiusPx - length(corners[3])) + 2.0)\n       ) < 0.0) discard;\n    fragColor = fragmentColor;\n  }\n`;\n\n/** @internal */\nexport const colorFrag = /* language=GLSL */ `${fragTop}\n  in vec4 fragmentColor;\n  out vec4 fragColor;\n  void main() { fragColor = fragmentColor; }\n`;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Pixels } from '../../common/geometry';\nimport { Attributes, UseInfo } from '../../common/kingly';\n\n/** @internal */\nexport interface GLResources {\n  roundedRectRenderer: (u: UseInfo) => void;\n  pickTextureRenderer: (u: UseInfo) => void;\n  attributes: Attributes;\n}\n\n/** @internal */\nexport const NULL_GL_RESOURCES: GLResources = {\n  roundedRectRenderer: () => {},\n  pickTextureRenderer: () => {},\n  attributes: new Map(),\n};\n\n/** @internal */\nexport interface ContinuousDomainFocus {\n  currentTimestamp: number;\n  currentFocusX0: number;\n  currentFocusY0: number;\n  currentFocusX1: number;\n  currentFocusY1: number;\n  prevFocusX0: number;\n  prevFocusY0: number;\n  prevFocusX1: number;\n  prevFocusY1: number;\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels) => number;\n\n/** @internal */\nexport const nullColumnarViewModel = {\n  label: [],\n  value: new Float64Array(),\n  color: new Float32Array(),\n  position0: new Float32Array(),\n  position1: new Float32Array(),\n  size0: new Float32Array(),\n  size1: new Float32Array(),\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getGreensColorScale } from '../../../../common/color_library_wrappers';\nimport { Pixels, PointObject } from '../../../../common/geometry';\nimport { SpecType } from '../../../../specs/constants';\nimport { ValueFormatter } from '../../../../utils/common';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { BandFillColorAccessorInput, GoalLabelAccessor } from '../../specs';\nimport { GoalSubtype } from '../../specs/constants';\n\n/** @internal */\nexport interface BandViewModel {\n  value: number;\n  fillColor: string;\n  text: string[];\n}\n\ninterface TickViewModel {\n  value: number;\n  text: string;\n}\n\n/** @internal */\nexport interface BulletViewModel {\n  subtype: string;\n  base: number;\n  target?: number;\n  actual: number;\n  bands: Array<BandViewModel>;\n  ticks: Array<TickViewModel>;\n  labelMajor: string;\n  labelMinor: string;\n  centralMajor: string | GoalLabelAccessor;\n  centralMinor: string;\n  highestValue: number;\n  lowestValue: number;\n  aboveBaseCount: number;\n  belowBaseCount: number;\n  angleStart: number;\n  angleEnd: number;\n  tooltipValueFormatter: ValueFormatter;\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels) => Array<BulletViewModel>;\n\n/** @internal */\nexport type ShapeViewModel = {\n  theme: Theme['goal'];\n  bulletViewModel: BulletViewModel;\n  chartCenter: PointObject;\n  pickQuads: PickFunction;\n};\n\nconst commonDefaults = {\n  base: 0,\n  actual: 50,\n};\n\n/** @internal */\nexport const defaultGoalSpec = {\n  ...commonDefaults,\n  bandFillColor: ({ value, highestValue, lowestValue }: BandFillColorAccessorInput) => {\n    return getGreensColorScale(0.5, [highestValue, lowestValue])(value);\n  },\n  tickValueFormatter: ({ value }: BandFillColorAccessorInput) => String(value),\n  labelMajor: ({ base }: BandFillColorAccessorInput) => String(base),\n  labelMinor: () => 'unit',\n  centralMajor: ({ base }: BandFillColorAccessorInput) => String(base),\n  centralMinor: ({ target }: BandFillColorAccessorInput) => (target ? String(target) : ''),\n  bandLabels: [],\n  angleStart: Math.PI + Math.PI / 4,\n  angleEnd: -Math.PI / 4,\n  tooltipValueFormatter: (value: number) => String(value),\n};\n\n/** @internal */\nexport const nullGoalViewModel = {\n  ...commonDefaults,\n  specType: SpecType.Series,\n  subtype: GoalSubtype.Goal,\n  bands: [],\n  ticks: [],\n  labelMajor: '',\n  labelMinor: '',\n  centralMajor: '',\n  centralMinor: '',\n  highestValue: 100,\n  lowestValue: 0,\n  aboveBaseCount: 0,\n  belowBaseCount: 0,\n  angleStart: 0,\n  angleEnd: 0,\n  tooltipValueFormatter: () => '',\n};\n\n/** @internal */\nexport const nullShapeViewModel = ({ goal }: Theme = LIGHT_THEME): ShapeViewModel => ({\n  theme: goal,\n  bulletViewModel: nullGoalViewModel,\n  chartCenter: { x: 0, y: 0 },\n  pickQuads: () => [],\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSagitta, getMinSagitta, getTransformDirection } from './utils';\nimport { GOLDEN_RATIO, TAU } from '../../../../common/constants';\nimport { PointObject, Radian, Rectangle } from '../../../../common/geometry';\nimport { cssFontShorthand, Font } from '../../../../common/text_utils';\nimport { CanvasRenderer } from '../../../../renderers/canvas';\nimport { measureText } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { GoalSubtype } from '../../specs/constants';\nimport { BulletViewModel } from '../types/viewmodel_types';\n\n/** @internal */\nexport interface Mark {\n  boundingBoxes: (ctx: CanvasRenderingContext2D) => Rectangle[];\n  render: CanvasRenderer;\n}\n\n/** @internal */\nexport class Section implements Mark {\n  protected readonly x: number;\n  protected readonly y: number;\n  protected readonly xTo: number;\n  protected readonly yTo: number;\n  protected readonly lineWidth: number;\n  protected readonly strokeStyle: string;\n  protected readonly capturePad: number;\n\n  constructor(\n    x: number,\n    y: number,\n    xTo: number,\n    yTo: number,\n    lineWidth: number,\n    strokeStyle: string,\n    capturePad: number,\n  ) {\n    this.x = x;\n    this.y = y;\n    this.xTo = xTo;\n    this.yTo = yTo;\n    this.lineWidth = lineWidth;\n    this.strokeStyle = strokeStyle;\n    this.capturePad = capturePad;\n  }\n\n  boundingBoxes() {\n    // modifying with half the line width is a simple yet imprecise method for ensuring that the\n    // entire ink is in the bounding box; depending on orientation and line ending, the bounding\n    // box may overstate the data ink bounding box, which is preferable to understating it\n    return this.lineWidth === 0\n      ? []\n      : [\n          {\n            x0: Math.min(this.x, this.xTo) - this.lineWidth / 2 - this.capturePad,\n            y0: Math.min(this.y, this.yTo) - this.lineWidth / 2 - this.capturePad,\n            x1: Math.max(this.x, this.xTo) + this.lineWidth / 2 + this.capturePad,\n            y1: Math.max(this.y, this.yTo) + this.lineWidth / 2 + this.capturePad,\n          },\n        ];\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    ctx.beginPath();\n    ctx.lineWidth = this.lineWidth;\n    ctx.strokeStyle = this.strokeStyle;\n    ctx.moveTo(this.x, this.y);\n    ctx.lineTo(this.xTo, this.yTo);\n    ctx.stroke();\n  }\n}\n\n/** @internal */\nexport const initialBoundingBox = (): Rectangle => ({ x0: Infinity, y0: Infinity, x1: -Infinity, y1: -Infinity });\n\n/** @internal */\nexport class Arc implements Mark {\n  protected readonly x: number;\n  protected readonly y: number;\n  protected readonly radius: number;\n  protected readonly startAngle: Radian;\n  protected readonly endAngle: Radian;\n  protected readonly anticlockwise: boolean;\n  protected readonly lineWidth: number;\n  protected readonly strokeStyle: string;\n  protected readonly arcBoxSamplePitch: number;\n  protected readonly capturePad: number;\n\n  constructor(\n    x: number,\n    y: number,\n    radius: number,\n    startAngle: number,\n    endAngle: number,\n    anticlockwise: boolean,\n    lineWidth: number,\n    strokeStyle: string,\n    capturePad: number,\n    arcBoxSamplePitch: number,\n  ) {\n    this.x = x;\n    this.y = y;\n    this.radius = radius;\n    this.startAngle = startAngle;\n    this.endAngle = endAngle;\n    this.anticlockwise = anticlockwise;\n    this.lineWidth = lineWidth;\n    this.strokeStyle = strokeStyle;\n    this.capturePad = capturePad;\n    this.arcBoxSamplePitch = arcBoxSamplePitch;\n  }\n\n  boundingBoxes() {\n    if (this.lineWidth === 0) return [];\n\n    const box = initialBoundingBox();\n\n    // instead of an analytical solution, we approximate with a GC-free grid sampler\n\n    // full circle rotations such that `startAngle' and `endAngle` are positive\n    const rotationCount = Math.ceil(Math.max(0, -this.startAngle, -this.endAngle) / TAU);\n    const startAngle = this.startAngle + rotationCount * TAU;\n    const endAngle = this.endAngle + rotationCount * TAU;\n\n    // snapping to the closest `arcBoxSamplePitch` increment\n    const angleFrom: Radian = Math.round(startAngle / this.arcBoxSamplePitch) * this.arcBoxSamplePitch;\n    const angleTo: Radian = Math.round(endAngle / this.arcBoxSamplePitch) * this.arcBoxSamplePitch;\n    const signedIncrement = this.arcBoxSamplePitch * Math.sign(angleTo - angleFrom);\n\n    for (let angle: Radian = angleFrom; angle <= angleTo; angle += signedIncrement) {\n      // unit vector for the angle direction\n      const vx = Math.cos(angle);\n      const vy = Math.sin(angle);\n      const innerRadius = this.radius - this.lineWidth / 2;\n      const outerRadius = this.radius + this.lineWidth / 2;\n\n      // inner point of the sector\n      const innerX = this.x + vx * innerRadius;\n      const innerY = this.y + vy * innerRadius;\n\n      // outer point of the sector\n      const outerX = this.x + vx * outerRadius;\n      const outerY = this.y + vy * outerRadius;\n\n      box.x0 = Math.min(box.x0, innerX - this.capturePad, outerX - this.capturePad);\n      box.y0 = Math.min(box.y0, innerY - this.capturePad, outerY - this.capturePad);\n      box.x1 = Math.max(box.x1, innerX + this.capturePad, outerX + this.capturePad);\n      box.y1 = Math.max(box.y1, innerY + this.capturePad, outerY + this.capturePad);\n\n      if (signedIncrement === 0) break; // happens if fromAngle === toAngle\n    }\n\n    return Number.isFinite(box.x0) ? [box] : [];\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    ctx.beginPath();\n    ctx.lineWidth = this.lineWidth;\n    ctx.strokeStyle = this.strokeStyle;\n    ctx.arc(this.x, this.y, this.radius, this.startAngle, this.endAngle, this.anticlockwise);\n    ctx.stroke();\n  }\n}\n\n/** @internal */\nexport class Text implements Mark {\n  protected readonly x: number;\n  protected readonly y: number;\n  protected readonly text: string;\n  protected readonly textAlign: CanvasTextAlign;\n  protected readonly textBaseline: CanvasTextBaseline;\n  protected readonly fontShape: Font;\n  protected readonly fontSize: number;\n  protected readonly fillStyle: string;\n  protected readonly capturePad: number;\n\n  constructor(\n    x: number,\n    y: number,\n    text: string,\n    textAlign: CanvasTextAlign,\n    textBaseline: CanvasTextBaseline,\n    fontShape: Font,\n    fontSize: number,\n    fillStyle: string,\n    capturePad: number,\n  ) {\n    this.x = x;\n    this.y = y;\n    this.text = text;\n    this.textAlign = textAlign;\n    this.textBaseline = textBaseline;\n    this.fontShape = fontShape;\n    this.fontSize = fontSize;\n    this.fillStyle = fillStyle;\n    this.capturePad = capturePad;\n  }\n\n  setCanvasTextState(ctx: CanvasRenderingContext2D) {\n    ctx.textAlign = this.textAlign;\n    ctx.textBaseline = this.textBaseline;\n    ctx.font = cssFontShorthand(this.fontShape, this.fontSize);\n  }\n\n  boundingBoxes(ctx: CanvasRenderingContext2D) {\n    if (this.text.length === 0) return [];\n    const box = measureText(ctx)(this.text, this.fontShape, this.fontSize);\n    return [\n      {\n        x0: -box.width / 2 + this.x - this.capturePad,\n        y0: -box.height / 2 + this.y - this.capturePad,\n        x1: box.width / 2 + this.x + this.capturePad,\n        y1: box.height / 2 + this.y + this.capturePad,\n      },\n    ];\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    this.setCanvasTextState(ctx);\n    ctx.beginPath();\n    ctx.fillStyle = this.fillStyle;\n    ctx.fillText(this.text, this.x, this.y);\n  }\n}\n\nfunction get<T>(o: { [k: string]: any }, name: string, dflt: T) {\n  return name in o ? o[name] || dflt : dflt;\n}\n\n/** @internal */\nexport function geoms(\n  bulletViewModel: BulletViewModel,\n  theme: Theme['goal'],\n  parentDimensions: Dimensions,\n  chartCenter: PointObject,\n): Mark[] {\n  const {\n    subtype,\n    lowestValue,\n    highestValue,\n    base,\n    target,\n    actual,\n    bands,\n    ticks,\n    labelMajor,\n    labelMinor,\n    centralMajor,\n    centralMinor,\n    angleEnd,\n    angleStart,\n  } = bulletViewModel;\n\n  const circular = subtype === GoalSubtype.Goal;\n  const vertical = subtype === GoalSubtype.VerticalBullet;\n\n  const domain: [number, number] = [lowestValue, highestValue];\n  const data = {\n    base: { value: base },\n    ...Object.fromEntries(bands.map(({ value }, index) => [`qualitative_${index}`, { value }])),\n    target: { value: target },\n    actual: { value: actual },\n    yOffset: { value: 0 },\n    labelMajor: { value: domain[circular || !vertical ? 0 : 1], text: labelMajor },\n    labelMinor: { value: domain[circular || !vertical ? 0 : 1], text: labelMinor },\n    ...Object.assign({}, ...ticks.map(({ value, text }, i) => ({ [`tick_${i}`]: { value, text } }))),\n    ...(circular\n      ? {\n          centralMajor: { value: 0, text: centralMajor },\n          centralMinor: { value: 0, text: centralMinor },\n        }\n      : {}),\n  };\n\n  const minSize = Math.min(parentDimensions.width, parentDimensions.height);\n\n  const referenceSize =\n    Math.min(\n      circular ? theme.maxCircularSize : theme.maxBulletSize,\n      circular ? minSize : vertical ? parentDimensions.height : parentDimensions.width,\n    ) *\n    (1 - 2 * theme.marginRatio);\n\n  const barThickness = Math.min(\n    circular ? theme.baselineArcThickness : theme.baselineBarThickness,\n    referenceSize * theme.barThicknessMinSizeRatio,\n  );\n\n  const tickLength = barThickness * Math.pow(1 / GOLDEN_RATIO, 3);\n  const tickOffset = -tickLength / 2 - barThickness / 2;\n  const tickFontSize = Math.min(theme.maxTickFontSize, referenceSize / 25);\n  const labelFontSize = Math.min(theme.maxLabelFontSize, referenceSize / 18);\n  const centralFontSize = Math.min(theme.maxCentralFontSize, referenceSize / 14);\n\n  const shape = circular ? 'arc' : 'line';\n\n  const abstractGeoms = [\n    ...bulletViewModel.bands.map((b, i) => ({\n      order: 0,\n      landmarks: {\n        from: i ? `qualitative_${i - 1}` : 'base',\n        to: `qualitative_${i}`,\n        yOffset: 'yOffset',\n      },\n      aes: { shape, fillColor: b.fillColor, lineWidth: barThickness },\n    })),\n    {\n      order: 1,\n      landmarks: { from: 'base', to: 'actual', yOffset: 'yOffset' },\n      aes: { shape, fillColor: theme.progressLine.stroke, lineWidth: tickLength },\n    },\n    ...(target\n      ? [\n          {\n            order: 2,\n            landmarks: { at: 'target', yOffset: 'yOffset' },\n            aes: { shape, fillColor: theme.targetLine.stroke, lineWidth: barThickness / GOLDEN_RATIO },\n          },\n        ]\n      : []),\n    ...bulletViewModel.ticks.map((b, i) => ({\n      order: 3,\n      landmarks: { at: `tick_${i}`, yOffset: 'yOffset' },\n      aes: { shape, fillColor: theme.tickLine.stroke, lineWidth: tickLength, axisNormalOffset: tickOffset },\n    })),\n    ...bulletViewModel.ticks.map((b, i) => ({\n      order: 4,\n      landmarks: { at: `tick_${i}`, yOffset: 'yOffset' },\n      aes: {\n        shape: 'text',\n        textAlign: vertical ? 'right' : 'center',\n        textBaseline: vertical ? 'middle' : 'top',\n        fillColor: theme.tickLabel.fill,\n        fontShape: { ...theme.tickLabel, fontVariant: 'normal', fontWeight: '500' },\n        axisNormalOffset: -barThickness,\n      },\n    })),\n    {\n      order: 5,\n      landmarks: { at: 'labelMajor' },\n      aes: {\n        shape: 'text',\n        axisNormalOffset: 0,\n        axisTangentOffset: circular || !vertical ? 0 : 2 * labelFontSize,\n        textAlign: vertical ? 'center' : 'right',\n        textBaseline: 'bottom',\n        fillColor: theme.majorLabel.fill,\n        fontShape: { ...theme.majorLabel, fontVariant: 'normal', fontWeight: '900' },\n      },\n    },\n    {\n      order: 5,\n      landmarks: { at: 'labelMinor' },\n      aes: {\n        shape: 'text',\n        axisNormalOffset: 0,\n        axisTangentOffset: circular || !vertical ? 0 : 2 * labelFontSize,\n        textAlign: vertical ? 'center' : 'right',\n        textBaseline: 'top',\n        fillColor: theme.minorLabel.fill,\n        fontShape: { ...theme.minorLabel, fontVariant: 'normal', fontWeight: '300' },\n      },\n    },\n    ...(circular\n      ? [\n          {\n            order: 6,\n            landmarks: { at: 'centralMajor', yOffset: 'yOffset' },\n            aes: {\n              shape: 'text',\n              textAlign: 'center',\n              textBaseline: 'bottom',\n              fillColor: theme.majorCenterLabel.fill,\n              fontShape: { ...theme.majorCenterLabel, fontVariant: 'normal', fontWeight: '900' },\n            },\n          },\n          {\n            order: 6,\n            landmarks: { at: 'centralMinor', yOffset: 'yOffset' },\n            aes: {\n              shape: 'text',\n              textAlign: 'center',\n              textBaseline: 'top',\n              fillColor: theme.minorCenterLabel.fill,\n              fontShape: { ...theme.minorCenterLabel, fontVariant: 'normal', fontWeight: '300' },\n            },\n          },\n        ]\n      : []),\n  ];\n\n  const maxWidth = abstractGeoms.reduce((p, g) => Math.max(p, get<number>(g.aes, 'lineWidth', 0)), 0);\n  const r = 0.5 * referenceSize - maxWidth / 2;\n\n  if (circular) {\n    const sagitta = getMinSagitta(angleStart, angleEnd, r);\n    const maxSagitta = getSagitta((3 / 2) * Math.PI, r);\n    const direction = getTransformDirection(angleStart, angleEnd);\n    data.yOffset.value = Math.abs(sagitta) >= maxSagitta ? 0 : (direction * (maxSagitta - sagitta)) / 2;\n  }\n\n  const fullSize = referenceSize;\n  const labelSize = fullSize / 2;\n  const pxRangeFrom = -fullSize / 2 + (circular || vertical ? 0 : labelSize);\n  const pxRangeTo = fullSize / 2 + (!circular && vertical ? -2 * labelFontSize : 0);\n  const pxRangeMid = (pxRangeFrom + pxRangeTo) / 2;\n  const pxRange = pxRangeTo - pxRangeFrom;\n\n  const domainExtent = domain[1] - domain[0];\n\n  const linearScale = (x: number) => pxRangeFrom + (pxRange * (x - domain[0])) / domainExtent;\n\n  const angleRange = angleEnd - angleStart;\n  const angleScale = (x: number) => angleStart + (angleRange * (x - domain[0])) / domainExtent;\n  const clockwise = angleStart > angleEnd; // todo refine this crude approach\n\n  return [...abstractGeoms]\n    .sort((a, b) => a.order - b.order)\n    .map(({ landmarks, aes }) => {\n      const at = get(landmarks, 'at', '');\n      const from = get(landmarks, 'from', '');\n      const to = get(landmarks, 'to', '');\n      const yOffset = get(landmarks, 'yOffset', '');\n      const textAlign = circular ? 'center' : get(aes, 'textAlign', '');\n      const fontShape = get(aes, 'fontShape', '');\n      const axisNormalOffset = get(aes, 'axisNormalOffset', 0);\n      const axisTangentOffset = get(aes, 'axisTangentOffset', 0);\n      const lineWidth = get(aes, 'lineWidth', 0);\n      const yOffsetValue = data[yOffset]?.value ?? 0;\n\n      const strokeStyle = get(aes, 'fillColor', '');\n      if (aes.shape === 'text') {\n        const { text } = data[at];\n        const label = at.slice(0, 5) === 'label';\n        const central = at.slice(0, 7) === 'central';\n        const textBaseline = label || central || !circular ? get(aes, 'textBaseline', '') : 'middle';\n        const fontSize = circular && label ? labelFontSize : circular && central ? centralFontSize : tickFontSize;\n        const scaledValue = circular ? angleScale(data[at].value) : data[at] && linearScale(data[at].value);\n        // prettier-ignore\n        const x = circular\n          ? (label || central ? 0 : (r - GOLDEN_RATIO * barThickness) * Math.cos(scaledValue))\n          : (vertical ? axisNormalOffset : axisTangentOffset + scaledValue);\n        // prettier-ignore\n        const y = circular\n          ? (label ? r : central ? 0 : -(r - GOLDEN_RATIO * barThickness) * Math.sin(scaledValue))\n          : (vertical ? -axisTangentOffset - scaledValue : -axisNormalOffset);\n        return new Text(\n          x + chartCenter.x,\n          y + chartCenter.y + yOffsetValue,\n          text,\n          textAlign,\n          textBaseline,\n          fontShape,\n          fontSize,\n          strokeStyle,\n          theme.capturePad,\n        );\n      } else if (aes.shape === 'arc') {\n        const cx = chartCenter.x + pxRangeMid;\n        const cy = chartCenter.y + yOffsetValue;\n        const radius = at ? r + axisNormalOffset : r;\n        const startAngle = at ? angleScale(data[at].value) + Math.PI / 360 : angleScale(data[from].value);\n        const endAngle = at ? angleScale(data[at].value) - Math.PI / 360 : angleScale(data[to].value);\n        // prettier-ignore\n        const anticlockwise = at || clockwise === (data[from].value < data[to].value);\n        return new Arc(\n          cx,\n          cy,\n          radius,\n          -startAngle,\n          -endAngle,\n          !anticlockwise,\n          lineWidth,\n          strokeStyle,\n          theme.capturePad,\n          theme.arcBoxSamplePitch,\n        );\n      } else {\n        const translateX = chartCenter.x + (vertical ? axisNormalOffset : axisTangentOffset);\n        const translateY = chartCenter.y - (vertical ? axisTangentOffset : axisNormalOffset) + yOffsetValue;\n        const atPx = data[at] && linearScale(data[at].value);\n        const fromPx = at ? atPx - 1 : linearScale(data[from].value);\n        const toPx = at ? atPx + 1 : linearScale(data[to].value);\n        const x0 = vertical ? translateX : translateX + fromPx;\n        const y0 = vertical ? translateY - fromPx : translateY;\n        const x1 = vertical ? translateX : translateX + toPx;\n        const y1 = vertical ? translateY - toPx : translateY;\n        return new Section(x0, y0, x1, y1, lineWidth, strokeStyle, theme.capturePad);\n      }\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TAU } from '../../../../common/constants';\nimport { Radian } from '../../../../common/geometry';\nimport { round } from '../../../../utils/common';\n\n/**\n * Set to half circle such that anything smaller than a half circle will not\n * continue to increase offset\n */\nconst LIMITING_ANGLE = Math.PI / 2;\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst hasTopGap = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return a <= -Math.PI / 2 && a >= (-Math.PI * 3) / 2 && b >= -Math.PI / 2 && b <= Math.PI / 2;\n};\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst hasBottomGap = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return a >= -Math.PI / 2 && a <= Math.PI / 2 && b < (Math.PI * 3) / 2 && b >= Math.PI / 2;\n};\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst isOnlyTopHalf = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return a >= 0 && b <= Math.PI;\n};\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst isOnlyBottomHalf = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return (a >= Math.PI && b <= 2 * Math.PI) || (a >= -Math.PI && b <= 0);\n};\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst isWithinLimitedDomain = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return a > -2 * Math.PI && b < 2 * Math.PI;\n};\n\n/** @internal */\nexport const getTransformDirection = (angleStart: Radian, angleEnd: Radian): 1 | -1 =>\n  hasTopGap(angleStart, angleEnd) || isOnlyBottomHalf(angleStart, angleEnd) ? -1 : 1;\n\n/**\n * Returns limiting angle form π/2 towards 3/2π from left and right, top and bottom\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst controllingAngle = (angleStart: Radian, angleEnd: Radian): number => {\n  if (!isWithinLimitedDomain(angleStart, angleEnd)) return LIMITING_ANGLE * 2;\n  if (isOnlyTopHalf(angleStart, angleEnd) || isOnlyBottomHalf(angleStart, angleEnd)) return LIMITING_ANGLE;\n  if (!hasTopGap(angleStart, angleEnd) && !hasBottomGap(angleStart, angleEnd)) return LIMITING_ANGLE * 2;\n  const offset = hasBottomGap(angleStart, angleEnd) ? -Math.PI / 2 : Math.PI / 2;\n  return Math.max(Math.abs(angleStart + offset), Math.abs(angleEnd + offset), LIMITING_ANGLE);\n};\n\n/**\n * Normalize angles to minimum equivalent pair within -2π >= θ >= 2π\n * Assumes angles are no more that 2π apart.\n * @internal\n */\nexport function normalizeAngles(\n  angleStart: Radian,\n  angleEnd: Radian,\n  multiplier = 1,\n): [angleStart: Radian, angleEnd: Radian] {\n  const maxOffset = Math.max(Math.ceil(Math.abs(angleStart) / TAU), Math.ceil(Math.abs(angleEnd) / TAU)) - 1;\n  const offsetDirection = angleStart > 0 && angleEnd > 0 ? -1 : 1;\n  const offset = offsetDirection * maxOffset * TAU;\n  return [multiplier * (angleStart + offset), multiplier * (angleEnd + offset)];\n}\n\n/**\n * Angles are relative to mathmatical angles of a unit circle from -2π > θ > 2π\n * @internal\n */\nexport function getSagitta(angle: Radian, radius: number, fractionDigits: number = 1) {\n  const arcLength = angle * radius;\n  const halfCord = radius * Math.sin(arcLength / (2 * radius));\n  const lengthMiltiplier = arcLength > Math.PI ? 1 : -1;\n  const sagitta = radius + lengthMiltiplier * Math.sqrt(Math.pow(radius, 2) - Math.pow(halfCord, 2));\n  return round(sagitta, fractionDigits);\n}\n\n/**\n * Angles are relative to mathmatical angles of a unit circle from -2π > θ > 2π\n * @internal\n */\nexport function getMinSagitta(angleStart: Radian, angleEnd: Radian, radius: number, fractionDigits?: number) {\n  const normalizedAngles = normalizeAngles(angleStart, angleEnd);\n  const limitingAngle = controllingAngle(...normalizedAngles);\n  return getSagitta(limitingAngle * 2, radius, fractionDigits);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { clamp, clampAll, isBetween, isFiniteNumber, isNil } from './../../../../utils/common';\nimport { Radian } from '../../../../common/geometry';\nimport { ScaleContinuous } from '../../../../scales';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { GoalSpec } from '../../specs';\nimport { GoalSubtype } from '../../specs/constants';\nimport { BulletViewModel, PickFunction, ShapeViewModel } from '../types/viewmodel_types';\n\n/** @internal */\nexport function shapeViewModel(spec: GoalSpec, theme: Theme, chartDimensions: Dimensions): ShapeViewModel {\n  const { width, height } = chartDimensions;\n  const { chartMargins: margin } = theme;\n  const innerWidth = width - margin.left - margin.right;\n  const innerHeight = height - margin.top - margin.bottom;\n  const chartCenter = {\n    x: margin.left + innerWidth / 2,\n    y: margin.top + innerHeight / 2,\n  };\n\n  const {\n    subtype,\n    ticks,\n    bands,\n    domain,\n    bandFillColor,\n    tickValueFormatter,\n    labelMajor,\n    labelMinor,\n    centralMajor,\n    centralMinor,\n    bandLabels,\n    angleStart,\n    angleEnd,\n  } = spec;\n  const lowestValue = isFiniteNumber(domain.min) ? domain.min : 0;\n  const highestValue = isFiniteNumber(domain.max) ? domain.max : 1;\n  const base = clamp(spec.base, lowestValue, highestValue);\n  const target =\n    !isNil(spec.target) && spec.target <= highestValue && spec.target >= lowestValue ? spec.target : undefined;\n  const actual = clamp(spec.actual, lowestValue, highestValue);\n  const finalTicks = Array.isArray(ticks)\n    ? ticks.filter(isBetween(lowestValue, highestValue))\n    : new ScaleContinuous(\n        {\n          type: 'linear',\n          domain: [lowestValue, highestValue],\n          range: [0, 1],\n        },\n        {\n          desiredTickCount: ticks ?? getDesiredTicks(subtype, angleStart, angleEnd),\n        },\n      ).ticks();\n\n  const finalBands = Array.isArray(bands)\n    ? bands.reduce(...clampAll(lowestValue, highestValue))\n    : new ScaleContinuous(\n        {\n          type: 'linear',\n          domain: [lowestValue, highestValue],\n          range: [0, 1],\n        },\n        {\n          desiredTickCount: bands ?? getDesiredTicks(subtype, angleStart, angleEnd),\n        },\n      ).ticks();\n\n  const aboveBaseCount = finalBands.filter((b: number) => b > base).length;\n  const belowBaseCount = finalBands.filter((b: number) => b <= base).length;\n\n  const callbackArgs = {\n    base,\n    target,\n    actual,\n    highestValue,\n    lowestValue,\n    aboveBaseCount,\n    belowBaseCount,\n  };\n\n  const bulletViewModel: BulletViewModel = {\n    subtype,\n    base,\n    target,\n    actual,\n    bands: finalBands.map((value: number, index: number) => ({\n      value,\n      fillColor: bandFillColor({ value, index, ...callbackArgs }),\n      text: bandLabels,\n    })),\n    ticks: finalTicks.map((value: number, index: number) => ({\n      value,\n      text: tickValueFormatter({ value, index, ...callbackArgs }),\n    })),\n    labelMajor: typeof labelMajor === 'string' ? labelMajor : labelMajor({ value: NaN, index: 0, ...callbackArgs }),\n    labelMinor: typeof labelMinor === 'string' ? labelMinor : labelMinor({ value: NaN, index: 0, ...callbackArgs }),\n    centralMajor:\n      typeof centralMajor === 'string' ? centralMajor : centralMajor({ value: NaN, index: 0, ...callbackArgs }),\n    centralMinor:\n      typeof centralMinor === 'string' ? centralMinor : centralMinor({ value: NaN, index: 0, ...callbackArgs }),\n    highestValue,\n    lowestValue,\n    aboveBaseCount,\n    belowBaseCount,\n    angleStart,\n    angleEnd,\n    tooltipValueFormatter: () => '',\n  };\n\n  const pickQuads: PickFunction = (x, y) =>\n    -innerWidth / 2 <= x && x <= innerWidth / 2 && -innerHeight / 2 <= y && y <= innerHeight / 2\n      ? [bulletViewModel]\n      : [];\n\n  return {\n    theme: theme.goal,\n    chartCenter,\n    bulletViewModel,\n    pickQuads,\n  };\n}\n\nfunction getDesiredTicks(subtype: GoalSubtype, angleStart: Radian, angleEnd: Radian) {\n  if (subtype !== GoalSubtype.Goal) return 5;\n  const arc = Math.abs(angleStart - angleEnd);\n  return Math.ceil(arc / (Math.PI / 4));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../../common/colors';\nimport { clearCanvas, renderLayers, withContext } from '../../../../renderers/canvas';\nimport { Mark } from '../../layout/viewmodel/geoms';\n\n/** @internal */\nexport function renderCanvas2d(ctx: CanvasRenderingContext2D, dpr: number, geomObjects: Mark[], background: Color) {\n  withContext(ctx, () => {\n    // set some defaults for the overall rendering\n\n    // let's set the devicePixelRatio once and for all; then we'll never worry about it again\n    ctx.scale(dpr, dpr);\n\n    // all texts are currently center-aligned because\n    //     - the calculations manually compute and lay out text (word) boxes, so we can choose whatever\n    //     - but center/middle has mathematical simplicity and the most unassuming thing\n    //     - due to using the math x/y convention (+y is up) while Canvas uses screen convention (+y is down)\n    //         text rendering must be y-flipped, which is a bit easier this way\n    ctx.textAlign = 'center';\n    ctx.textBaseline = 'middle';\n    // this applies the mathematical x/y conversion (+y is North) which is easier when developing geometry\n    // functions - also, all renderers have flexibility (eg. SVG scale) and WebGL NDC is also +y up\n    // - in any case, it's possible to refactor for a -y = North convention if that's deemed preferable\n\n    renderLayers(ctx, [\n      // clear the canvas\n      () => clearCanvas(ctx, background),\n      () => geomObjects.forEach((mark) => withContext(ctx, () => mark.render(ctx))),\n    ]);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { MouseEvent, RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { renderCanvas2d } from './canvas_renderers';\nimport { Color, Colors } from '../../../../common/colors';\nimport { Rectangle } from '../../../../common/geometry';\nimport { GoalSemanticDescription, ScreenReaderSummary } from '../../../../components/accessibility';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { BandViewModel, nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { initialBoundingBox, Mark } from '../../layout/viewmodel/geoms';\nimport { geometries, getPrimitiveGeoms } from '../../state/selectors/geometries';\nimport { getFirstTickValueSelector, getGoalChartSemanticDataSelector } from '../../state/selectors/get_goal_chart_data';\nimport { getCaptureBoundingBox } from '../../state/selectors/picked_shapes';\n\ninterface ReactiveChartStateProps {\n  initialized: boolean;\n  geometries: ShapeViewModel;\n  geoms: Mark[];\n  chartContainerDimensions: Dimensions;\n  a11ySettings: A11ySettings;\n  bandLabels: BandViewModel[];\n  firstValue: number;\n  captureBoundingBox: Rectangle;\n  background: Color;\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface ReactiveChartOwnProps {\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype Props = ReactiveChartStateProps & ReactiveChartDispatchProps & ReactiveChartOwnProps;\n\nclass Component extends React.Component<Props> {\n  static displayName = 'Goal';\n\n  // firstRender = true; // this'll be useful for stable resizing of treemaps\n  private ctx: CanvasRenderingContext2D | null;\n\n  // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example\n  private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `<canvas>` dimensions\n\n  constructor(props: Readonly<Props>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  handleMouseMove(e: MouseEvent<HTMLCanvasElement>) {\n    const {\n      initialized,\n      chartContainerDimensions: { width, height },\n      forwardStageRef,\n      geometries,\n      captureBoundingBox: capture,\n    } = this.props;\n    if (!forwardStageRef.current || !this.ctx || !initialized || width === 0 || height === 0) {\n      return;\n    }\n    const picker = geometries.pickQuads;\n    const box = forwardStageRef.current.getBoundingClientRect();\n    const { chartCenter } = geometries;\n    const x = e.clientX - box.left;\n    const y = e.clientY - box.top;\n    if (capture.x0 <= x && x <= capture.x1 && capture.y0 <= y && y <= capture.y1) {\n      return picker(x - chartCenter.x, y - chartCenter.y);\n    }\n  }\n\n  render() {\n    const {\n      initialized,\n      chartContainerDimensions: { width, height },\n      forwardStageRef,\n      a11ySettings,\n      bandLabels,\n      firstValue,\n    } = this.props;\n    if (!initialized || width === 0 || height === 0) {\n      return null;\n    }\n    return (\n      <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n        <canvas\n          ref={forwardStageRef}\n          className=\"echCanvasRenderer\"\n          width={width * this.devicePixelRatio}\n          height={height * this.devicePixelRatio}\n          onMouseMove={this.handleMouseMove.bind(this)}\n          style={{\n            width,\n            height,\n          }}\n          // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n          role=\"presentation\"\n        >\n          <ScreenReaderSummary />\n          <GoalSemanticDescription bandLabels={bandLabels} firstValue={firstValue} {...a11ySettings} />\n        </canvas>\n      </figure>\n    );\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      renderCanvas2d(this.ctx, this.devicePixelRatio, this.props.geoms, this.props.background);\n    }\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  initialized: false,\n  geometries: nullShapeViewModel(),\n  geoms: [],\n  chartContainerDimensions: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  bandLabels: [],\n  firstValue: 0,\n  captureBoundingBox: initialBoundingBox(),\n  background: Colors.Transparent.keyword,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  return {\n    initialized: true,\n    geometries: geometries(state),\n    chartContainerDimensions: state.parentDimensions,\n    a11ySettings: getA11ySettingsSelector(state),\n    bandLabels: getGoalChartSemanticDataSelector(state),\n    firstValue: getFirstTickValueSelector(state),\n    geoms: getPrimitiveGeoms(state),\n    captureBoundingBox: getCaptureBoundingBox(state),\n    background: getChartThemeSelector(state).background.color,\n  };\n};\n\n/** @internal */\nexport const Goal = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const GoalSubtype = Object.freeze({\n  Goal: 'goal' as const,\n  HorizontalBullet: 'horizontalBullet' as const,\n  VerticalBullet: 'verticalBullet' as const,\n});\n/** @public */\nexport type GoalSubtype = $Values<typeof GoalSubtype>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { GoalSubtype } from './constants';\nimport { ChartType } from '../..';\nimport { Color } from '../../../common/colors';\nimport { TAU } from '../../../common/constants';\nimport { Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { LabelAccessor, round, stripUndefined, ValueFormatter } from '../../../utils/common';\nimport { Logger } from '../../../utils/logger';\nimport { defaultGoalSpec } from '../layout/types/viewmodel_types';\n\n/** @alpha */\nexport interface BandFillColorAccessorInput {\n  value: number;\n  index: number;\n  base: number;\n  target?: number;\n  highestValue: number;\n  lowestValue: number;\n  aboveBaseCount: number;\n  belowBaseCount: number;\n}\n\n/** @alpha */\nexport type BandFillColorAccessor = (input: BandFillColorAccessorInput) => Color;\n\n/** @alpha */\nexport type GoalLabelAccessor = LabelAccessor<BandFillColorAccessorInput>;\n\n/** @alpha */\nexport interface GoalDomainRange {\n  /**\n   * A finite number to defined the lower bound of the domain. Defaults to 0 if _not_ finite.\n   */\n  min: number;\n  /**\n   * A finite number to defined the upper bound of the domain. Defaults to 1 if _not_ finite.\n   */\n  max: number;\n}\n\n/** @alpha */\nexport interface GoalSpec extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Goal;\n  subtype: GoalSubtype;\n  base: number;\n  target?: number;\n  actual: number;\n  /**\n   * array of discrete band intervals or approximate number of desired bands\n   */\n  bands?: number | number[];\n  /**\n   * Array of discrete tick values or approximate number of desired ticks\n   */\n  ticks?: number | number[];\n  /**\n   * Domain of goal charts. Limits every value to within domain.\n   */\n  domain: GoalDomainRange;\n  bandFillColor: BandFillColorAccessor;\n  tickValueFormatter: GoalLabelAccessor;\n  labelMajor: string | GoalLabelAccessor;\n  labelMinor: string | GoalLabelAccessor;\n  centralMajor: string | GoalLabelAccessor;\n  centralMinor: string | GoalLabelAccessor;\n  angleStart: number;\n  angleEnd: number;\n  bandLabels: string[];\n  tooltipValueFormatter: ValueFormatter;\n}\n\nconst buildProps = buildSFProps<GoalSpec>()(\n  {\n    specType: SpecType.Series,\n    chartType: ChartType.Goal,\n  },\n  {\n    ...defaultGoalSpec,\n  },\n);\n\n/**\n * Add Goal spec to chart\n * @deprecated please use `Bullet` spec instead\n * @alpha\n */\nexport const Goal = function (\n  props: SFProps<\n    GoalSpec,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  const angleStart = props.angleStart ?? defaults.angleStart;\n  const angleEnd = props.angleEnd ?? defaults.angleEnd;\n  const constraints: Pick<typeof props, 'angleEnd'> = {};\n\n  if (Math.abs(angleEnd - angleStart) > TAU) {\n    constraints.angleEnd = angleStart + TAU * Math.sign(angleEnd - angleStart);\n\n    Logger.warn(`The total angle of the goal chart must not exceed 2π radians.\\\nTo prevent overlapping, the value of \\`angleEnd\\` will be replaced.\n\n  original: ${angleEnd} (~${round(angleEnd / Math.PI, 3)}π)\n  replaced: ${constraints.angleEnd} (~${round(constraints.angleEnd / Math.PI, 3)}π)\n`);\n  }\n\n  useSpecFactory<GoalSpec>({\n    ...defaults,\n    ...stripUndefined(props),\n    ...overrides,\n    ...constraints,\n  });\n  return null;\n};\n\n/** @public */\nexport type GoalProps = ComponentProps<typeof Goal>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { getChartTypeDescriptionSelector } from './selectors/get_chart_type_description';\nimport { getGoalSpecSelector } from './selectors/get_goal_spec';\nimport { isTooltipVisibleSelector } from './selectors/is_tooltip_visible';\nimport { createOnElementClickCaller } from './selectors/on_element_click_caller';\nimport { createOnElementOutCaller } from './selectors/on_element_out_caller';\nimport { createOnElementOverCaller } from './selectors/on_element_over_caller';\nimport { getTooltipInfoSelector } from './selectors/tooltip';\nimport { ChartType } from '../..';\nimport { DEFAULT_CSS_CURSOR } from '../../../common/constants';\nimport { LegendItem } from '../../../common/legend';\nimport { Tooltip } from '../../../components/tooltip/tooltip';\nimport { InternalChartState, GlobalChartState, BackwardRef, TooltipVisibility } from '../../../state/chart_state';\nimport { getActivePointerPosition } from '../../../state/selectors/get_active_pointer_position';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { LegendItemLabel } from '../../../state/selectors/get_legend_items_labels';\nimport { DebugState } from '../../../state/types';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { Goal } from '../renderer/canvas/connected_component';\n\nconst EMPTY_MAP = new Map();\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\nconst EMPTY_LEGEND_ITEM_LIST: LegendItemLabel[] = [];\n\n/** @internal */\nexport class GoalState implements InternalChartState {\n  chartType = ChartType.Goal;\n\n  onElementClickCaller: (state: GlobalChartState) => void;\n\n  onElementOverCaller: (state: GlobalChartState) => void;\n\n  onElementOutCaller: (state: GlobalChartState) => void;\n\n  constructor() {\n    this.onElementClickCaller = createOnElementClickCaller();\n    this.onElementOverCaller = createOnElementOverCaller();\n    this.onElementOutCaller = createOnElementOutCaller();\n  }\n\n  isInitialized(globalState: GlobalChartState) {\n    return getGoalSpecSelector(globalState) !== null ? InitStatus.Initialized : InitStatus.ChartNotInitialized;\n  }\n\n  isBrushAvailable() {\n    return false;\n  }\n\n  isBrushing() {\n    return false;\n  }\n\n  isChartEmpty() {\n    return false;\n  }\n\n  getLegendItems() {\n    return EMPTY_LEGEND_LIST;\n  }\n\n  getLegendItemsLabels() {\n    return EMPTY_LEGEND_ITEM_LIST;\n  }\n\n  getLegendExtraValues() {\n    return EMPTY_MAP;\n  }\n\n  chartRenderer(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) {\n    return (\n      <>\n        <Tooltip getChartContainerRef={containerRef} />\n        <Goal forwardStageRef={forwardStageRef} />\n      </>\n    );\n  }\n\n  getPointerCursor() {\n    return DEFAULT_CSS_CURSOR;\n  }\n\n  isTooltipVisible(globalState: GlobalChartState): TooltipVisibility {\n    return {\n      visible: isTooltipVisibleSelector(globalState),\n      isExternal: false,\n      displayOnly: false,\n      isPinnable: false,\n    };\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfoSelector(globalState);\n  }\n\n  getTooltipAnchor(state: GlobalChartState) {\n    const position = getActivePointerPosition(state);\n    return {\n      isRotated: false,\n      x: position.x,\n      width: 0,\n      y: position.y,\n      height: 0,\n    };\n  }\n\n  eventCallbacks(globalState: GlobalChartState) {\n    this.onElementOverCaller(globalState);\n    this.onElementOutCaller(globalState);\n    this.onElementClickCaller(globalState);\n  }\n\n  getChartTypeDescription(globalState: GlobalChartState) {\n    return getChartTypeDescriptionSelector(globalState);\n  }\n\n  // TODO\n  getProjectionContainerArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getMainProjectionArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getBrushArea(): Dimensions | null {\n    return null;\n  }\n\n  // TODO\n  getDebugState(): DebugState {\n    return {};\n  }\n\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  // TODO enable for small multiples\n  canDisplayChartTitles = () => false;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { render } from './scenegraph';\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { geoms, Mark } from '../../layout/viewmodel/geoms';\nimport { GoalSpec } from '../../specs';\n\nconst getParentDimensions = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const geometries = createCustomCachedSelector(\n  [getSpecs, getParentDimensions, getChartThemeSelector],\n  (specs, parentDimensions, theme): ShapeViewModel => {\n    const goalSpec = getSpecFromStore<GoalSpec, false>(specs, ChartType.Goal, SpecType.Series, false);\n    return goalSpec ? render(goalSpec, parentDimensions, theme) : nullShapeViewModel(theme);\n  },\n);\n\n/** @internal */\nexport const getPrimitiveGeoms = createCustomCachedSelector(\n  [geometries, getParentDimensions],\n  (shapeViewModel, parentDimensions): Mark[] => {\n    const { chartCenter, bulletViewModel, theme } = shapeViewModel;\n    return geoms(bulletViewModel, theme, parentDimensions, chartCenter);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const getChartTypeDescriptionSelector = createCustomCachedSelector([getGoalSpecSelector], (spec) => {\n  return `${spec?.subtype ?? 'goal'} chart`;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { geometries } from './geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport type GoalChartData = {\n  maximum: number;\n  minimum: number;\n  target?: number;\n  value: number;\n};\n\n/** @internal */\nexport type GoalChartLabels = {\n  minorLabel: string;\n  majorLabel: string;\n};\n\n/** @internal */\nexport const getGoalChartDataSelector = createCustomCachedSelector([geometries], (geoms): GoalChartData => {\n  const goalChartData: GoalChartData = {\n    maximum: geoms.bulletViewModel.highestValue,\n    minimum: geoms.bulletViewModel.lowestValue,\n    target: geoms.bulletViewModel.target,\n    value: geoms.bulletViewModel.actual,\n  };\n  return goalChartData;\n});\n\n/** @internal */\nexport const getGoalChartLabelsSelector = createCustomCachedSelector([geometries], (geoms) => {\n  return { majorLabel: geoms.bulletViewModel.labelMajor, minorLabel: geoms.bulletViewModel.labelMinor };\n});\n\n/** @internal */\nexport const getGoalChartSemanticDataSelector = createCustomCachedSelector([geometries], (geoms) => {\n  return geoms.bulletViewModel.bands ?? [];\n});\n\n/** @internal */\nexport const getFirstTickValueSelector = createCustomCachedSelector([geometries], (geoms) => {\n  return geoms.bulletViewModel.lowestValue;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { GoalSpec } from '../../specs';\n\n/** @internal */\nexport function getGoalSpecSelector(state: GlobalChartState): GoalSpec {\n  return getSpecFromStore<GoalSpec, true>(state.specs, ChartType.Goal, SpecType.Series, true);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipInfoSelector } from './tooltip';\nimport { TooltipType } from '../../../../specs/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\n\n/** @internal */\nexport const isTooltipVisibleSelector = createCustomCachedSelector(\n  [getTooltipSpecSelector, getTooltipInfoSelector],\n  ({ type }, tooltipInfo): boolean => {\n    if (type === TooltipType.None) return false;\n    return tooltipInfo.values.length > 0;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementClickSelector } from '../../../../common/event_handler_selectors';\nimport { GlobalChartState, PointerStates } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastClickSelector } from '../../../../state/selectors/get_last_click';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementClick listener every time the following preconditions are met:\n * - the onElementClick listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnElementClickCaller(): (state: GlobalChartState) => void {\n  const prev: { click: PointerStates['lastClick'] } = { click: null };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Goal) {\n      selector = createCustomCachedSelector(\n        [getGoalSpecSelector, getLastClickSelector, getSettingsSpecSelector, getPickedShapesLayerValues],\n        getOnElementClickSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementOutSelector } from '../../../../common/event_handler_selectors';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementOut listener every time the following preconditions are met:\n * - the onElementOut listener is available\n * - the highlighted geometries list goes from a list of at least one object to an empty one\n * @internal\n */\nexport function createOnElementOutCaller(): (state: GlobalChartState) => void {\n  const prev: { pickedShapes: number | null } = { pickedShapes: null };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Goal) {\n      selector = createCustomCachedSelector(\n        [getGoalSpecSelector, getPickedShapesLayerValues, getSettingsSpecSelector],\n        getOnElementOutSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementOverSelector } from '../../../../common/event_handler_selectors';\nimport { LayerValue } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementOver listener every time the following preconditions are met:\n * - the onElementOver listener is available\n * - we have a new set of highlighted geometries on our state\n * @internal\n */\nexport function createOnElementOverCaller(): (state: GlobalChartState) => void {\n  const prev: { pickedShapes: LayerValue[][] } = { pickedShapes: [] };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Goal) {\n      selector = createCustomCachedSelector(\n        [getGoalSpecSelector, getPickedShapesLayerValues, getSettingsSpecSelector],\n        getOnElementOverSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActivePointerPosition } from './../../../../state/selectors/get_active_pointer_position';\nimport { geometries, getPrimitiveGeoms } from './geometries';\nimport { Rectangle } from '../../../../common/geometry';\nimport { LayerValue } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { BulletViewModel } from '../../layout/types/viewmodel_types';\nimport { initialBoundingBox, Mark } from '../../layout/viewmodel/geoms';\n\nfunction fullBoundingBox(ctx: CanvasRenderingContext2D | null, geoms: Mark[]) {\n  const box = initialBoundingBox();\n  if (ctx) {\n    for (const g of geoms) {\n      for (const { x0, y0, x1, y1 } of g.boundingBoxes(ctx)) {\n        box.x0 = Math.min(box.x0, x0, x1);\n        box.y0 = Math.min(box.y0, y0, y1);\n        box.x1 = Math.max(box.x1, x0, x1);\n        box.y1 = Math.max(box.y1, y0, y1);\n      }\n    }\n  }\n  return box;\n}\n\n/** @internal */\nexport const getCaptureBoundingBox = createCustomCachedSelector([getPrimitiveGeoms], (geoms): Rectangle => {\n  const textMeasurer = document.createElement('canvas');\n  const ctx = textMeasurer.getContext('2d');\n  return fullBoundingBox(ctx, geoms);\n});\n\n/** @internal */\nexport const getPickedShapes = createCustomCachedSelector(\n  [geometries, getActivePointerPosition, getCaptureBoundingBox],\n  (geoms, pointerPosition, capture): BulletViewModel[] => {\n    const picker = geoms.pickQuads;\n    const { chartCenter } = geoms;\n    const { x, y } = pointerPosition;\n    return capture.x0 <= x && x <= capture.x1 && capture.y0 <= y && y <= capture.y1\n      ? picker(x - chartCenter.x, y - chartCenter.y)\n      : [];\n  },\n);\n\n/** @internal */\nexport const getPickedShapesLayerValues = createCustomCachedSelector(\n  [getPickedShapes],\n  (pickedShapes): Array<Array<LayerValue>> => {\n    return pickedShapes.map<Array<LayerValue>>((model) => {\n      const values: Array<LayerValue> = [];\n      values.push({\n        smAccessorValue: '',\n        groupByRollup: 'Actual',\n        value: model.actual,\n        sortIndex: 0,\n        path: [],\n        depth: 0,\n      });\n      return values.reverse();\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { shapeViewModel } from '../../layout/viewmodel/viewmodel';\nimport { GoalSpec } from '../../specs';\n\n/** @internal */\nexport function render(spec: GoalSpec, parentDimensions: Dimensions, theme: Theme): ShapeViewModel {\n  return shapeViewModel(spec, theme, parentDimensions);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { Colors } from '../../../../common/colors';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { BandViewModel } from '../../layout/types/viewmodel_types';\n\nconst EMPTY_TOOLTIP = Object.freeze({\n  header: null,\n  values: [],\n});\n\nconst getBandColor = (value: number, bands: BandViewModel[]) =>\n  bands.find(({ value: v }) => {\n    return v >= value;\n  })?.fillColor ?? Colors.White.keyword;\n\n/** @internal */\nexport const getTooltipInfoSelector = createCustomCachedSelector(\n  [getGoalSpecSelector, getPickedShapes],\n  (spec, pickedShapes): TooltipInfo => {\n    if (!spec) {\n      return EMPTY_TOOLTIP;\n    }\n    const { tooltipValueFormatter, id } = spec;\n\n    const tooltipInfo: TooltipInfo = {\n      header: null,\n      values: [],\n    };\n\n    pickedShapes.forEach(({ actual: value, bands }) => {\n      tooltipInfo.values.push({\n        label: 'Actual',\n        color: getBandColor(value, bands),\n        isHighlighted: false,\n        isVisible: true,\n        seriesIdentifier: {\n          specId: id,\n          key: id,\n        },\n        value,\n        formattedValue: tooltipValueFormatter(value),\n        datum: value,\n      });\n    });\n\n    return tooltipInfo;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { Color } from '../../../../common/colors';\nimport { Pixels } from '../../../../common/geometry';\nimport { PerPanelMap } from '../../../../common/panel_utils';\nimport { Box, Font, TextAlign } from '../../../../common/text_utils';\nimport { Fill, Line, Rect, Stroke } from '../../../../geoms/types';\nimport { HeatmapBrushEvent } from '../../../../specs/settings';\nimport { Point } from '../../../../utils/point';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Visible, HeatmapStyle } from '../../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\nimport { HeatmapCellDatum } from '../viewmodel/viewmodel';\n\n/** @public */\nexport interface Cell {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  yIndex: number;\n  fill: Fill;\n  stroke: Stroke;\n  value: number;\n  formatted: string;\n  visible: boolean;\n  datum: HeatmapCellDatum;\n  textColor: Color;\n  fontSize: Pixels;\n}\n\n/** @internal */\nexport type GridCell = { x: NonNullable<PrimitiveValue>; y: NonNullable<PrimitiveValue> };\n\n/** @internal */\nexport interface TextBox extends Box {\n  value: NonNullable<PrimitiveValue>;\n  x: number;\n  y: number;\n  align: TextAlign;\n}\n\n/** @internal */\nexport type HeatmapTitleConfig = Font &\n  Visible & {\n    fontSize: number;\n    text: string;\n    origin: Point;\n    rotation: 0 | -90;\n  };\n\n/** @internal */\nexport interface HeatmapViewModel extends PerPanelMap {\n  gridOrigin: {\n    x: number;\n    y: number;\n  };\n  gridLines: {\n    x: Line[];\n    y: Line[];\n    stroke: Stroke;\n  };\n  cells: Cell[];\n  cellFontSize: (c: Cell) => Pixels;\n  xValues: Array<TextBox>;\n  yValues: Array<TextBox>;\n  titles: HeatmapTitleConfig[];\n}\n\n/** @internal */\nexport function isPickedCells(v: unknown): v is Cell[] {\n  return Array.isArray(v);\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels) => Cell[] | TextBox;\n\n/** @internal */\nexport type PickDragFunction = (points: [start: Point, end: Point]) => HeatmapBrushEvent;\n\n/** @internal */\nexport type PickDragShapeFunction = (points: [start: Point, end: Point]) => Rect | null;\n\n/**\n * From x and y coordinates in the data domain space to a canvas projected rectangle\n * that cover entirely the data domain coordinates provided.\n * If the data domain coordinates leaves within a bucket, then the full bucket is taken in consideration.\n * Used mainly for the Highlighter that shows the rounded selected area.\n * @internal\n */\nexport type PickHighlightedArea = (\n  x: Array<NonNullable<PrimitiveValue>>,\n  y: Array<NonNullable<PrimitiveValue>>,\n  smHorizontalAccessorValue?: string | number,\n  smVerticalAccessorValue?: string | number,\n) => Rect | null;\n\n/** @internal */\nexport type PickCursorBand = (x: NonNullable<PrimitiveValue>) => Rect | undefined;\n\n/** @internal */\nexport type PickGridCell = (x: Pixels, y: Pixels) => GridCell | undefined;\n\n/** @internal */\nexport type DragShape = ReturnType<PickDragShapeFunction>;\n\n/** @internal */\nexport type ShapeViewModel = {\n  theme: HeatmapStyle;\n  heatmapViewModels: HeatmapViewModel[];\n  pickQuads: PickFunction;\n  pickDragArea: PickDragFunction;\n  pickDragShape: PickDragShapeFunction;\n  pickHighlightedArea: PickHighlightedArea;\n  pickGridCell: PickGridCell;\n  pickCursorBand: PickCursorBand;\n};\n\n/** @internal */\nexport const nullShapeViewModel = (): ShapeViewModel => ({\n  theme: LIGHT_THEME.heatmap,\n  heatmapViewModels: [],\n  pickQuads: () => [],\n  pickDragArea: () => ({ cells: [], x: [], y: [], chartType: ChartType.Heatmap }),\n  pickDragShape: () => ({ x: 0, y: 0, width: 0, height: 0 }),\n  pickHighlightedArea: () => ({ x: 0, y: 0, width: 0, height: 0 }),\n  pickGridCell: () => undefined,\n  pickCursorBand: () => undefined,\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ColorScale } from '../../../../common/colors';\nimport { SmallMultipleScales, SmallMultiplesGroupBy } from '../../../../common/panel_utils';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { ChartDimensions } from '../../../xy_chart/utils/dimensions';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { shapeViewModel } from '../../layout/viewmodel/viewmodel';\nimport { HeatmapSpec } from '../../specs';\nimport { ChartElementSizes } from '../../state/selectors/compute_chart_element_sizes';\nimport { HeatmapTable } from '../../state/selectors/get_heatmap_table';\n\n/** @internal */\nexport function computeScenegraph(\n  spec: HeatmapSpec,\n  chartDimensions: ChartDimensions,\n  elementSizes: ChartElementSizes,\n  smScales: SmallMultipleScales,\n  groupBySpec: SmallMultiplesGroupBy,\n  heatmapTable: HeatmapTable,\n  colorScale: ColorScale,\n  bandsToHide: Array<[number, number]>,\n  theme: Theme,\n): ShapeViewModel {\n  return withTextMeasure((measureText) => {\n    return shapeViewModel(\n      measureText,\n      spec,\n      theme,\n      chartDimensions,\n      elementSizes,\n      heatmapTable,\n      colorScale,\n      smScales,\n      groupBySpec,\n      bandsToHide,\n    );\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleBand, scaleBand, scaleQuantize } from 'd3-scale';\n\nimport { BaseDatum } from './../../../xy_chart/utils/specs';\nimport { colorToRgba } from '../../../../common/color_library_wrappers';\nimport { ColorScale } from '../../../../common/colors';\nimport { fillTextColor } from '../../../../common/fill_text_color';\nimport { Pixels } from '../../../../common/geometry';\nimport {\n  getPanelSize,\n  getPanelTitle,\n  getPerPanelMap,\n  hasSMDomain,\n  isPointerOverPanelFn,\n  SmallMultipleScales,\n  SmallMultiplesDatum,\n  SmallMultiplesGroupBy,\n} from '../../../../common/panel_utils';\nimport { Box, Font, maximiseFontSize } from '../../../../common/text_utils';\nimport { ScaleType } from '../../../../scales/constants';\nimport { LinearScale, OrdinalScale, RasterTimeScale } from '../../../../specs';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { addIntervalToTime, roundDateToESInterval } from '../../../../utils/chrono/elasticsearch';\nimport { clamp, Datum, isFiniteNumber, isNil } from '../../../../utils/common';\nimport { innerPad, pad } from '../../../../utils/dimensions';\nimport { Logger } from '../../../../utils/logger';\nimport { HeatmapStyle, Theme, Visible } from '../../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\nimport { ChartDimensions } from '../../../xy_chart/utils/dimensions';\nimport { HeatmapSpec } from '../../specs';\nimport { ChartElementSizes } from '../../state/selectors/compute_chart_element_sizes';\nimport { HeatmapTable } from '../../state/selectors/get_heatmap_table';\nimport {\n  Cell,\n  GridCell,\n  HeatmapTitleConfig,\n  PickCursorBand,\n  PickDragFunction,\n  PickDragShapeFunction,\n  PickHighlightedArea,\n  ShapeViewModel,\n  TextBox,\n} from '../types/viewmodel_types';\n\n/** @public */\nexport interface HeatmapCellDatum extends SmallMultiplesDatum {\n  x: NonNullable<PrimitiveValue>;\n  y: NonNullable<PrimitiveValue>;\n  value: number;\n  originalIndex: number;\n}\n\ntype CellMap = Map<string, Cell>;\ntype PanelCellMap = Map<string, CellMap>;\n\nfunction getValuesInRange(\n  values: NonNullable<PrimitiveValue>[],\n  startValue: NonNullable<PrimitiveValue>,\n  endValue: NonNullable<PrimitiveValue>,\n) {\n  const startIndex = values.indexOf(startValue);\n  const endIndex = Math.min(values.indexOf(endValue) + 1, values.length);\n  return values.slice(startIndex, endIndex);\n}\n\n/** @internal */\nexport function clampWithOffset(value: number, lowerBound: number, upperBound: number, offset: number): number {\n  return clamp(value, lowerBound + offset, upperBound + offset) - offset;\n}\n\n/** @internal */\nexport function shapeViewModel<D extends BaseDatum = Datum>(\n  textMeasure: TextMeasure,\n  spec: HeatmapSpec<D>,\n  { heatmap: heatmapTheme, axes: { axisTitle, axisPanelTitle }, background }: Theme,\n  { chartDimensions }: ChartDimensions,\n  elementSizes: ChartElementSizes,\n  heatmapTable: HeatmapTable,\n  colorScale: ColorScale,\n  smScales: SmallMultipleScales,\n  groupBySpec: SmallMultiplesGroupBy,\n  bandsToHide: Array<[number, number]>,\n): ShapeViewModel {\n  const { table, yValues, xValues } = heatmapTable;\n  const gridStrokeWidth = heatmapTheme.grid.stroke.width;\n  const isPointerOverPanel = isPointerOverPanelFn(smScales, chartDimensions, gridStrokeWidth);\n\n  // measure the text width of all rows values to get the grid area width\n  const boxedYValues = yValues.map<Box & { value: NonNullable<PrimitiveValue> }>((value) => ({\n    text: spec.yAxisLabelFormatter(value),\n    value,\n    isValue: false,\n    ...heatmapTheme.yAxisLabel,\n  }));\n\n  const panelSize = getPanelSize(smScales);\n\n  // compute the scale for the rows positions\n  const yScale = scaleBand<NonNullable<PrimitiveValue>>().domain(yValues).range([0, panelSize.height]);\n\n  const yInvertedScale = scaleQuantize<NonNullable<PrimitiveValue>>().domain([0, panelSize.height]).range(yValues);\n\n  // compute the scale for the columns positions\n  const xScale = scaleBand<NonNullable<PrimitiveValue>>().domain(xValues).range([0, panelSize.width]);\n  const xInvertedScale = scaleQuantize<NonNullable<PrimitiveValue>>().domain([0, panelSize.width]).range(xValues);\n\n  // compute the cell width, can be smaller then the available size depending on config\n  const cellWidth =\n    heatmapTheme.cell.maxWidth !== 'fill' && xScale.bandwidth() > heatmapTheme.cell.maxWidth\n      ? heatmapTheme.cell.maxWidth\n      : xScale.bandwidth();\n\n  // compute the cell height, we already computed the max size for that\n  const cellHeight = yScale.bandwidth();\n\n  // compute the position of each column label\n  const textXValues = getXTicks(spec, heatmapTheme.xAxisLabel, xScale, heatmapTable.xValues);\n\n  const { padding } = heatmapTheme.yAxisLabel;\n\n  // compute the position of each row label\n  const textYValues = boxedYValues.map<TextBox>((d) => {\n    return {\n      ...d,\n      // position of the Y labels\n      x: -pad(padding, 'right'),\n      y: cellHeight / 2 + (yScale(d.value) || 0),\n      align: 'right',\n    };\n  });\n\n  const cellWidthInner = cellWidth - gridStrokeWidth;\n  const cellHeightInner = cellHeight - gridStrokeWidth;\n\n  if (colorToRgba(background.color)[3] < 1) {\n    // TODO: centralize this check and bg color fallback across all chart types\n    Logger.expected(\n      'Text contrast requires a opaque background color, using fallbackColor',\n      'an opaque color',\n      background.color,\n    );\n  }\n\n  let tableMinFontSize = Infinity;\n\n  // compute each available cell position, color and value\n  const panelCellMap = table.reduce<PanelCellMap>((acc, d) => {\n    const x = xScale(String(d.x));\n    const y = yScale(String(d.y));\n    const yIndex = yValues.indexOf(d.y);\n\n    if (!isFiniteNumber(x) || !isFiniteNumber(y) || yIndex === -1) {\n      return acc;\n    }\n    const cellBackgroundColor = colorScale(d.value);\n    const panelKey = getPanelKey(d.smHorizontalAccessorValue, d.smVerticalAccessorValue);\n    const cellKey = getCellKey(d.x, d.y);\n\n    const formattedValue = spec.valueFormatter(d.value);\n\n    const fontSize = maximiseFontSize(\n      textMeasure,\n      formattedValue,\n      heatmapTheme.cell.label,\n      heatmapTheme.cell.label.minFontSize,\n      heatmapTheme.cell.label.maxFontSize,\n      // adding 3px padding per side to avoid that text touches the edges\n      cellWidthInner - 6,\n      cellHeightInner - 6,\n    );\n    tableMinFontSize = Math.min(tableMinFontSize, fontSize);\n\n    const cellMap = acc.get(panelKey) ?? new Map<string, Cell>();\n\n    if (!acc.has(panelKey)) acc.set(panelKey, cellMap);\n\n    cellMap.set(cellKey, {\n      x:\n        (heatmapTheme.cell.maxWidth !== 'fill' ? x + xScale.bandwidth() / 2 - heatmapTheme.cell.maxWidth / 2 : x) +\n        gridStrokeWidth / 2,\n      y: y + gridStrokeWidth / 2,\n      yIndex,\n      width: cellWidthInner,\n      height: cellHeightInner,\n      datum: d,\n      fill: {\n        color: colorToRgba(cellBackgroundColor),\n      },\n      stroke: {\n        color: colorToRgba(heatmapTheme.cell.border.stroke),\n        width: heatmapTheme.cell.border.strokeWidth,\n      },\n      value: d.value,\n      visible: !isValueInRanges(d.value, bandsToHide),\n      formatted: formattedValue,\n      fontSize,\n      textColor: fillTextColor(background.fallbackColor, cellBackgroundColor, background.color).color.keyword,\n    });\n    return acc;\n  }, new Map());\n\n  const getScaledSMValue = (value: number | string, scale: 'horizontal' | 'vertical') => {\n    return hasSMDomain(smScales[scale]) ? smScales[scale].scale(value) : 0;\n  };\n\n  const getPanelPointCoordinate = (value: Pixels, scale: 'horizontal' | 'vertical') => {\n    const category = smScales[scale].invert(value) ?? '';\n    const panelOffset = getScaledSMValue(category, scale);\n    const invertedScale = scale === 'horizontal' ? xInvertedScale : yInvertedScale;\n\n    return {\n      category,\n      panelOffset,\n      panelPixelValue: value - panelOffset,\n      panelValue: invertedScale(value - panelOffset),\n    };\n  };\n\n  const getPanelPointCoordinates = (x: Pixels, y: Pixels) => {\n    const { category: v, panelValue: panelY, panelOffset: panelOffsetY } = getPanelPointCoordinate(y, 'vertical');\n    const {\n      category: h,\n      panelValue: panelX,\n      panelOffset: panelOffsetX,\n    } = getPanelPointCoordinate(x - chartDimensions.left, 'horizontal');\n\n    return {\n      x: panelX,\n      y: panelY,\n      v,\n      h,\n      panelOffsetY,\n      panelOffsetX,\n    };\n  };\n\n  /**\n   * Returns the corresponding x & y values of grid cell from the x & y positions\n   * @param x\n   * @param y\n   */\n  const pickGridCell = (x: Pixels, y: Pixels): GridCell | undefined => {\n    if (x < chartDimensions.left || y < chartDimensions.top) return undefined;\n    if (x > chartDimensions.width + chartDimensions.left || y > chartDimensions.top + chartDimensions.height)\n      return undefined;\n\n    const xValue = xInvertedScale(x - chartDimensions.left);\n    const yValue = yInvertedScale(y);\n\n    if (xValue === undefined || yValue === undefined) return undefined;\n\n    return { x: xValue, y: yValue };\n  };\n\n  /**\n   * Returns selected elements based on coordinates.\n   * @param x\n   * @param y\n   */\n  const pickQuads = (x: Pixels, y: Pixels): Array<Cell> | TextBox => {\n    if (\n      x > 0 &&\n      x < chartDimensions.left &&\n      y > chartDimensions.top &&\n      y < chartDimensions.top + chartDimensions.height\n    ) {\n      // look up for a Y axis elements\n      const { y: yLabelKey } = getPanelPointCoordinates(x - chartDimensions.left, y);\n      const yLabelValue = textYValues.find((v) => v.value === yLabelKey);\n      if (yLabelValue) {\n        return yLabelValue;\n      }\n    }\n\n    if (!isPointerOverPanel({ x, y })) {\n      return [];\n    }\n\n    const { x: panelXValue, y: panelYValue, h, v } = getPanelPointCoordinates(x, y);\n\n    if (panelXValue === undefined || panelYValue === undefined) {\n      return [];\n    }\n\n    const panelKey = getPanelKey(h, v);\n    const cellKey = getCellKey(panelXValue, panelYValue);\n    const cell = panelCellMap.get(panelKey)?.get(cellKey);\n\n    if (cell) return [cell];\n    return [];\n  };\n\n  /**\n   * Return selected cells and X,Y ranges based on the drag selection.\n   */\n  const pickDragArea: PickDragFunction = (bound) => {\n    const [start, end] = bound;\n\n    const { left, top } = chartDimensions;\n    const topLeft: [number, number] = [Math.min(start.x, end.x) - left, Math.min(start.y, end.y) - top];\n    const bottomRight: [number, number] = [Math.max(start.x, end.x) - left, Math.max(start.y, end.y) - top];\n\n    // Find panel based on start pointer\n    const { category: smHorizontalAccessorValue, panelOffset: horizontalPanelOffset } = getPanelPointCoordinate(\n      start.x - chartDimensions.left,\n      'horizontal',\n    );\n    const { category: smVerticalAccessorValue, panelOffset: verticalPanelOffset } = getPanelPointCoordinate(\n      start.y,\n      'vertical',\n    );\n\n    // confine selection to start panel\n    const panelStartX = clampWithOffset(topLeft[0], 0, panelSize.width, horizontalPanelOffset);\n    const panelStartY = clampWithOffset(topLeft[1], 0, panelSize.height, verticalPanelOffset);\n    const panelEndX = clampWithOffset(bottomRight[0], 0, panelSize.width, horizontalPanelOffset);\n    const panelEndY = clampWithOffset(bottomRight[1], 0, panelSize.height, verticalPanelOffset);\n\n    const startX = xInvertedScale(panelStartX);\n    const startY = yInvertedScale(panelStartY);\n    const endX = xInvertedScale(panelEndX);\n    const endY = yInvertedScale(panelEndY);\n\n    const allXValuesInRange: Array<NonNullable<PrimitiveValue>> = getValuesInRange(xValues, startX, endX);\n    const allYValuesInRange: Array<NonNullable<PrimitiveValue>> = getValuesInRange(yValues, startY, endY);\n    const invertedXValues: Array<NonNullable<PrimitiveValue>> =\n      isRasterTimeScale(spec.xScale) && typeof endX === 'number'\n        ? [startX, addIntervalToTime(endX, spec.xScale.interval, spec.timeZone)]\n        : [...allXValuesInRange];\n    const cells: Cell[] = [];\n\n    allXValuesInRange.forEach((x) => {\n      allYValuesInRange.forEach((y) => {\n        const panelKey = getPanelKey(smHorizontalAccessorValue, smVerticalAccessorValue);\n        const cellKey = getCellKey(x, y);\n        const cellValue = panelCellMap.get(panelKey)?.get(cellKey);\n        if (cellValue) cells.push(cellValue);\n      });\n    });\n\n    return {\n      cells: cells.filter(Boolean),\n      x: invertedXValues,\n      y: allYValuesInRange,\n      smHorizontalAccessorValue,\n      smVerticalAccessorValue,\n    };\n  };\n\n  /**\n   * Resolves rect area based on provided X and Y ranges\n   * @param x\n   * @param y\n   */\n  const pickHighlightedArea: PickHighlightedArea = (\n    x: Array<NonNullable<PrimitiveValue>>,\n    y: Array<NonNullable<PrimitiveValue>>,\n    smHorizontalAccessorValue?: string | number,\n    smVerticalAccessorValue?: string | number,\n  ) => {\n    const startValue = x[0];\n    const endValue = x.at(-1);\n    const leftIndex = xValues.indexOf(startValue ?? NaN);\n    const rightIndex = xValues.indexOf(endValue ?? NaN) + (isRasterTimeScale(spec.xScale) && x.length > 1 ? 0 : 1);\n\n    const isRightOutOfRange = rightIndex > xValues.length - 1 || rightIndex < 0;\n    const isLeftOutOfRange = leftIndex > xValues.length - 1 || leftIndex < 0;\n\n    const startFromScale = xScale((isLeftOutOfRange ? xValues[0] : xValues[leftIndex]) ?? NaN);\n    const endFromScale = xScale((isRightOutOfRange ? xValues.at(-1) : xValues[rightIndex]) ?? NaN);\n\n    if (startFromScale === undefined || endFromScale === undefined) {\n      return null;\n    }\n\n    const panelXOffset = isNil(smHorizontalAccessorValue)\n      ? 0\n      : getScaledSMValue(smHorizontalAccessorValue, 'horizontal');\n    const panelYOffset = isNil(smVerticalAccessorValue) ? 0 : getScaledSMValue(smVerticalAccessorValue, 'vertical');\n\n    const xStart = chartDimensions.left + startFromScale + panelXOffset;\n\n    // extend the range in case the right boundary has been selected\n    const width = endFromScale - startFromScale + (isRightOutOfRange || isLeftOutOfRange ? cellWidth : 0);\n\n    // resolve Y coordinated making sure the order is correct\n    const { y: yStart, totalHeight } = y\n      .filter((v) => yValues.includes(v))\n      .reduce(\n        (acc, current, i) => {\n          if (i === 0) {\n            acc.y = (yScale(current) || 0) + panelYOffset;\n          }\n          acc.totalHeight += cellHeight;\n          return acc;\n        },\n        { y: 0, totalHeight: 0 },\n      );\n    return {\n      x: xStart,\n      y: yStart,\n      width,\n      height: totalHeight,\n    };\n  };\n\n  /**\n   * Resolves coordinates and metrics of the selected rect area.\n   */\n  const pickDragShape: PickDragShapeFunction = (bound) => {\n    const { x, y, smHorizontalAccessorValue, smVerticalAccessorValue } = pickDragArea(bound);\n    return pickHighlightedArea(x, y, smHorizontalAccessorValue, smVerticalAccessorValue);\n  };\n\n  const pickCursorBand: PickCursorBand = (x) => {\n    // TODO for Linear scale we need to round the numerical interval. see also https://github.com/elastic/elastic-charts/issues/1701\n    const roundedValue =\n      isRasterTimeScale(spec.xScale) && isFiniteNumber(x)\n        ? roundDateToESInterval(x, spec.xScale.interval, 'start', spec.timeZone)\n        : x;\n\n    const index = xValues.indexOf(roundedValue);\n    return index < 0\n      ? undefined\n      : {\n          width: cellWidth,\n          x: chartDimensions.left + (xScale(xValues[index] ?? NaN) ?? NaN),\n          y: chartDimensions.top,\n          height: chartDimensions.height,\n        };\n  };\n\n  // ordered left-right vertical lines\n  const xLines = Array.from({ length: xValues.length + 1 }, (d, i) => {\n    const xAxisExtension = i % elementSizes.xAxisTickCadence === 0 ? 5 : 0;\n    return {\n      x1: i * cellWidth,\n      x2: i * cellWidth,\n      y1: 0,\n      y2: panelSize.height + xAxisExtension,\n    };\n  });\n\n  // horizontal lines\n  const yLines = Array.from({ length: yValues.length + 1 }, (d, i) => ({\n    x1: 0,\n    x2: panelSize.width,\n    y1: i * cellHeight,\n    y2: i * cellHeight,\n  }));\n\n  // TODO introduce missing styles into axes.axisTitle\n  const axisTitleFont: Visible & Font & { fontSize: Pixels } = {\n    visible: axisTitle.visible,\n    fontFamily: axisTitle.fontFamily,\n    fontStyle: axisTitle.fontStyle ?? 'normal',\n    fontVariant: 'normal',\n    fontWeight: 'bold',\n    textColor: axisTitle.fill,\n    fontSize: axisTitle.fontSize,\n  };\n\n  const axisPanelTitleFont: Visible & Font & { fontSize: Pixels } = {\n    visible: axisPanelTitle.visible,\n    fontFamily: axisPanelTitle.fontFamily,\n    fontStyle: axisPanelTitle.fontStyle ?? 'normal',\n    fontVariant: 'normal',\n    fontWeight: 'bold',\n    textColor: axisPanelTitle.fill,\n    fontSize: axisPanelTitle.fontSize,\n  };\n\n  return {\n    theme: heatmapTheme,\n    heatmapViewModels: getPerPanelMap(smScales, (anchor, h, v) => {\n      const primaryColumn = smScales.vertical.domain[0] === v;\n      const primaryRow = smScales.horizontal.domain[0] === h;\n      const lastColumn = smScales.vertical.domain.at(-1) === v;\n\n      const titles: HeatmapTitleConfig[] = [];\n      // TODO this should be filtered by the pageSize AND the pageNumber\n      const cells = [...(panelCellMap.get(getPanelKey(h, v))?.values() ?? [])];\n\n      if (primaryColumn && primaryRow) {\n        if (spec.xAxisTitle) {\n          const axisPanelTitleHeight =\n            groupBySpec.horizontal && axisPanelTitle.visible\n              ? axisPanelTitle.fontSize + innerPad(axisPanelTitle.padding) / 2\n              : 0;\n\n          titles.push({\n            origin: {\n              x: chartDimensions.width / 2,\n              y:\n                chartDimensions.top +\n                chartDimensions.height +\n                elementSizes.xAxis.height +\n                axisPanelTitleHeight +\n                innerPad(axisTitle.padding) / 2 +\n                axisTitle.fontSize / 2,\n            },\n            ...axisTitleFont,\n            text: spec.xAxisTitle,\n            rotation: 0,\n          });\n        }\n\n        if (spec.yAxisTitle) {\n          titles.push({\n            origin: {\n              x: -chartDimensions.left + axisTitle.fontSize / 2,\n              y: chartDimensions.top + chartDimensions.height / 2,\n            },\n            ...axisTitleFont,\n            text: spec.yAxisTitle,\n            rotation: -90,\n          });\n        }\n      }\n\n      if (primaryColumn && groupBySpec.horizontal) {\n        titles.push({\n          origin: {\n            x: panelSize.width / 2,\n            y:\n              chartDimensions.top +\n              chartDimensions.height +\n              elementSizes.xAxis.height +\n              innerPad(axisPanelTitle.padding) +\n              axisPanelTitle.fontSize / 2,\n          },\n          ...axisPanelTitleFont,\n          text: getPanelTitle(false, v, h, groupBySpec),\n          rotation: 0,\n        });\n      }\n\n      if (primaryRow && groupBySpec.vertical) {\n        const axisTitleWidth = axisTitle.visible ? axisTitle.fontSize + innerPad(axisTitle.padding) : 0;\n        titles.push({\n          origin: {\n            x: -chartDimensions.left + axisTitleWidth + axisPanelTitle.fontSize / 2,\n            y: chartDimensions.top + panelSize.height / 2,\n          },\n          ...axisPanelTitleFont,\n          text: getPanelTitle(true, v, h, groupBySpec),\n          rotation: -90,\n        });\n      }\n\n      return {\n        anchor,\n        panelSize,\n        gridOrigin: {\n          x: anchor.x + chartDimensions.left,\n          y: anchor.y + chartDimensions.top,\n        },\n        gridLines: {\n          x: xLines,\n          y: yLines,\n          stroke: {\n            color: colorToRgba(heatmapTheme.grid.stroke.color),\n            width: gridStrokeWidth,\n          },\n        },\n        cells,\n        cellFontSize: (cell: Cell) => (heatmapTheme.cell.label.useGlobalMinFontSize ? tableMinFontSize : cell.fontSize),\n        xValues: lastColumn ? textXValues : [],\n        yValues: primaryRow ? textYValues : [],\n        titles,\n      };\n    }),\n    pickGridCell,\n    pickQuads,\n    pickDragArea,\n    pickDragShape,\n    pickHighlightedArea,\n    pickCursorBand,\n  };\n}\n\nfunction getCellKey(x: NonNullable<PrimitiveValue>, y: NonNullable<PrimitiveValue>) {\n  return [String(x), String(y)].join('&_&');\n}\n\nfunction getPanelKey(h: NonNullable<PrimitiveValue> = '', v: NonNullable<PrimitiveValue> = '') {\n  return [String(h), String(v)].join('&_&');\n}\n\n/** @internal */\nexport function isValueInRanges(value: number, ranges: Array<[number, number]>) {\n  return ranges.some(([min, max]) => min <= value && value < max);\n}\n\n/** @internal */\nexport function isRasterTimeScale(scale: RasterTimeScale | OrdinalScale | LinearScale): scale is RasterTimeScale {\n  return scale.type === ScaleType.Time;\n}\n\nfunction getXTicks(\n  spec: HeatmapSpec,\n  style: HeatmapStyle['xAxisLabel'],\n  scale: ScaleBand<NonNullable<PrimitiveValue>>,\n  values: NonNullable<PrimitiveValue>[],\n): Array<TextBox> {\n  const isTimeScale = isRasterTimeScale(spec.xScale);\n  const isRotated = style.rotation !== 0;\n  return values.map<TextBox>((value) => {\n    return {\n      text: spec.xAxisLabelFormatter(value),\n      value,\n      isValue: false,\n      ...style,\n      y: style.fontSize / 2 + pad(style.padding, 'top'),\n      x: (scale(value) ?? 0) + (isTimeScale ? 0 : scale.bandwidth() / 2),\n      align: isRotated ? 'right' : isTimeScale ? 'left' : 'center',\n    };\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ReactiveChartStateProps } from './connected_component';\nimport { getColorBandStyle, getGeometryStateStyle } from './utils';\nimport { clearCanvas, renderLayers, withContext } from '../../../../renderers/canvas';\nimport { radToDeg } from '../../../../utils/common';\nimport { horizontalPad } from '../../../../utils/dimensions';\nimport { renderMultiLine } from '../../../xy_chart/renderer/canvas/primitives/line';\nimport { renderRect } from '../../../xy_chart/renderer/canvas/primitives/rect';\nimport { renderText, TextFont, wrapLines } from '../../../xy_chart/renderer/canvas/primitives/text';\n\n/** @internal */\nexport function renderHeatmapCanvas2d(ctx: CanvasRenderingContext2D, dpr: number, props: ReactiveChartStateProps) {\n  const { theme } = props.geometries;\n  const { heatmapViewModels } = props.geometries;\n  const {\n    theme: { sharedStyle: sharedGeometryStyle },\n    background,\n    elementSizes,\n    highlightedLegendBands,\n  } = props;\n  if (heatmapViewModels.length === 0) return;\n\n  withContext(ctx, () => {\n    // set some defaults for the overall rendering\n\n    // let's set the devicePixelRatio once and for all; then we'll never worry about it again\n    ctx.scale(dpr, dpr);\n\n    // all texts are currently center-aligned because\n    //     - the calculations manually compute and lay out text (word) boxes, so we can choose whatever\n    //     - but center/middle has mathematical simplicity and the most unassuming thing\n    //     - due to using the math x/y convention (+y is up) while Canvas uses screen convention (+y is down)\n    //         text rendering must be y-flipped, which is a bit easier this way\n    ctx.textAlign = 'center';\n    ctx.textBaseline = 'middle';\n    ctx.lineCap = 'square';\n    // ctx.translate(chartCenter.x, chartCenter.y);\n    // this applies the mathematical x/y conversion (+y is North) which is easier when developing geometry\n    // functions - also, all renderers have flexibility (eg. SVG scale) and WebGL NDC is also +y up\n    // - in any case, it's possible to refactor for a -y = North convention if that's deemed preferable\n    // ctx.scale(1, -1);\n\n    renderLayers(ctx, [\n      () => clearCanvas(ctx, background),\n\n      () => {\n        // Grid\n        heatmapViewModels.forEach(({ gridOrigin: { x, y }, gridLines }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y);\n            renderMultiLine(ctx, gridLines.x, gridLines.stroke);\n            renderMultiLine(ctx, gridLines.y, gridLines.stroke);\n          });\n        });\n      },\n\n      () =>\n        // Cells\n        heatmapViewModels.forEach(({ gridOrigin: { x, y }, cells }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y);\n            cells.forEach((cell) => {\n              if (cell.visible) {\n                const geometryStateStyle = getGeometryStateStyle(cell, sharedGeometryStyle, highlightedLegendBands);\n                const style = getColorBandStyle(cell, geometryStateStyle);\n                renderRect(ctx, cell, style.fill, style.stroke);\n              }\n            });\n          });\n        }),\n\n      // Text on cells\n      () => {\n        if (!theme.cell.label.visible) return;\n\n        heatmapViewModels.forEach(({ cellFontSize, gridOrigin: { x, y }, cells }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y);\n            cells.forEach((cell) => {\n              const fontSize = cellFontSize(cell);\n              if (cell.visible && Number.isFinite(fontSize))\n                renderText(ctx, { x: cell.x + cell.width / 2, y: cell.y + cell.height / 2 }, cell.formatted, {\n                  ...theme.cell.label,\n                  fontSize,\n                  align: 'center',\n                  baseline: 'middle',\n                  textColor: cell.textColor,\n                });\n            });\n          });\n        });\n      },\n\n      // render text on Y axis\n      () => {\n        if (!theme.yAxisLabel.visible) return;\n\n        heatmapViewModels.forEach(({ yValues, gridOrigin: { x, y } }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y);\n            const font: TextFont = {\n              ...theme.yAxisLabel,\n              baseline: 'middle' /* fixed */,\n              align: 'right' /* fixed */,\n            };\n            const { padding } = theme.yAxisLabel;\n            const horizontalPadding = horizontalPad(padding);\n            yValues.forEach(({ x, y, text }) => {\n              const textLines = wrapLines(\n                ctx,\n                text,\n                font,\n                theme.yAxisLabel.fontSize,\n                Math.max(elementSizes.yAxis.width - horizontalPadding, 0),\n                theme.yAxisLabel.fontSize,\n                { shouldAddEllipsis: true, wrapAtWord: false },\n              ).lines;\n              // TODO improve the `wrapLines` code to handle results with short width\n              if (textLines[0]) renderText(ctx, { x, y }, textLines[0], font);\n            });\n          });\n        });\n      },\n\n      // render text on X axis\n      () => {\n        if (!theme.xAxisLabel.visible) return;\n\n        heatmapViewModels.forEach(({ xValues, gridOrigin: { x, y } }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y + elementSizes.xAxis.top);\n            xValues\n              .filter((_, i) => i % elementSizes.xAxisTickCadence === 0)\n              .forEach(({ x, y, text, align }) => {\n                const textLines = wrapLines(\n                  ctx,\n                  text,\n                  theme.xAxisLabel,\n                  theme.xAxisLabel.fontSize,\n                  // TODO wrap into multilines\n                  Infinity,\n                  16,\n                  { shouldAddEllipsis: true, wrapAtWord: false },\n                ).lines;\n                if (textLines[0]) {\n                  renderText(\n                    ctx,\n                    { x, y },\n                    textLines[0],\n                    { ...theme.xAxisLabel, baseline: 'middle', align },\n                    // negative rotation due to the canvas rotation direction\n                    radToDeg(-elementSizes.xLabelRotation),\n                  );\n                }\n              });\n          });\n        });\n      },\n\n      // render axes and panel titles\n      () =>\n        heatmapViewModels\n          .filter(({ titles }) => titles.length > 0)\n          .forEach(({ titles, gridOrigin: { x, y } }) => {\n            withContext(ctx, () => {\n              ctx.translate(x, y);\n              titles\n                .filter((t) => t.visible && t.text !== '')\n                .forEach((title) => {\n                  renderText(\n                    ctx,\n                    title.origin,\n                    title.text,\n                    {\n                      ...title,\n                      baseline: 'middle',\n                      align: 'center',\n                    },\n                    title.rotation,\n                  );\n                });\n            });\n          }),\n    ]);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { renderHeatmapCanvas2d } from './canvas_renderers';\nimport { Color, Colors } from '../../../../common/colors';\nimport { ScreenReaderSummary } from '../../../../components/accessibility';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { GenericDomain } from '../../../../utils/domain';\nimport { deepEqual } from '../../../../utils/fast_deep_equal';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { ChartElementSizes, computeChartElementSizesSelector } from '../../state/selectors/compute_chart_element_sizes';\nimport { getHeatmapContainerSizeSelector } from '../../state/selectors/get_heatmap_container_size';\nimport { getHighlightedLegendBandsSelector } from '../../state/selectors/get_highlighted_legend_bands';\nimport { getPerPanelHeatmapGeometries } from '../../state/selectors/get_per_panel_heatmap_geometries';\n\n/** @internal */\nexport interface ReactiveChartStateProps {\n  initialized: boolean;\n  geometries: ShapeViewModel;\n  chartContainerDimensions: Dimensions;\n  highlightedLegendBands: Array<GenericDomain>;\n  theme: Theme;\n  a11ySettings: A11ySettings;\n  background: Color;\n  elementSizes: ChartElementSizes;\n  debug: boolean;\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface ReactiveChartOwnProps {\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype Props = ReactiveChartStateProps & ReactiveChartDispatchProps & ReactiveChartOwnProps;\nclass Component extends React.Component<Props> {\n  static displayName = 'Heatmap';\n\n  // firstRender = true; // this will be useful for stable resizing of treemaps\n  private ctx: CanvasRenderingContext2D | null;\n\n  // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example\n  private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `<canvas>` dimensions\n\n  constructor(props: Readonly<Props>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  shouldComponentUpdate(nextProps: ReactiveChartStateProps) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      renderHeatmapCanvas2d(this.ctx, this.devicePixelRatio, this.props);\n    }\n  }\n\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  render() {\n    const {\n      initialized,\n      chartContainerDimensions: { width, height },\n      forwardStageRef,\n      a11ySettings,\n    } = this.props;\n    if (!initialized || width === 0 || height === 0) {\n      return null;\n    }\n    return (\n      <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n        <canvas\n          ref={forwardStageRef}\n          className=\"echCanvasRenderer\"\n          width={width * this.devicePixelRatio}\n          height={height * this.devicePixelRatio}\n          style={{\n            width,\n            height,\n          }}\n          // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n          role=\"presentation\"\n        >\n          <ScreenReaderSummary />\n        </canvas>\n      </figure>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  initialized: false,\n  geometries: nullShapeViewModel(),\n  chartContainerDimensions: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  theme: LIGHT_THEME,\n  highlightedLegendBands: [],\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  background: Colors.Transparent.keyword,\n  elementSizes: {\n    xAxis: { width: 0, height: 0, left: 0, top: 0 },\n    yAxis: { width: 0, height: 0, left: 0, top: 0 },\n    xAxisTickCadence: 1,\n    xLabelRotation: 0,\n  },\n  debug: false,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  return {\n    initialized: true,\n    geometries: getPerPanelHeatmapGeometries(state),\n    chartContainerDimensions: getHeatmapContainerSizeSelector(state),\n    highlightedLegendBands: getHighlightedLegendBandsSelector(state),\n    theme: getChartThemeSelector(state),\n    a11ySettings: getA11ySettingsSelector(state),\n    background: getChartThemeSelector(state).background.color,\n    elementSizes: computeChartElementSizesSelector(state),\n    debug: getSettingsSpecSelector(state).debug,\n  };\n};\n\n/** @internal */\nexport const Heatmap = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { overrideOpacity } from '../../../../common/color_library_wrappers';\nimport { Fill, Stroke } from '../../../../geoms/types';\nimport { GenericDomain } from '../../../../utils/domain';\nimport { GeometryStateStyle, SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { Cell } from '../../layout/types/viewmodel_types';\nimport { isValueInRanges } from '../../layout/viewmodel/viewmodel';\n\n/** @internal */\nexport function getGeometryStateStyle(\n  cell: Cell,\n  sharedGeometryStyle: SharedGeometryStateStyle,\n  highlightedLegendBands: Array<GenericDomain>,\n): GeometryStateStyle {\n  const { default: defaultStyles, highlighted, unhighlighted } = sharedGeometryStyle;\n\n  if (highlightedLegendBands.length > 0) {\n    const isHighlightedBand = isValueInRanges(cell.value, highlightedLegendBands);\n    return isHighlightedBand ? highlighted : unhighlighted;\n  }\n\n  return defaultStyles;\n}\n\n/** @internal */\nexport function getColorBandStyle(cell: Cell, geometryStateStyle: GeometryStateStyle): { fill: Fill; stroke: Stroke } {\n  const fillColor = overrideOpacity(cell.fill.color, (opacity) => opacity * geometryStateStyle.opacity);\n  const fill: Fill = {\n    ...cell.fill,\n    color: fillColor,\n  };\n\n  const strokeColor = overrideOpacity(cell.stroke.color, (opacity) => opacity * geometryStateStyle.opacity);\n  const stroke: Stroke = {\n    ...cell.stroke,\n    color: strokeColor,\n  };\n  return { fill, stroke };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Rect } from '../../../../geoms/types';\nimport { getTooltipType } from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { getCursorBandPositionSelector } from '../../state/selectors/get_cursor_band';\n\ninterface CursorBandProps {\n  bandStyle: Theme['crosshair']['band'];\n  cursorPosition?: Rect;\n  tooltipType: TooltipType;\n  fromExternalEvent?: boolean;\n}\n\nfunction canRenderBand(type: TooltipType, visible: boolean, fromExternalEvent?: boolean) {\n  return visible && (type === TooltipType.Crosshairs || type === TooltipType.VerticalCursor || fromExternalEvent);\n}\n\nclass CursorBandComponent extends React.Component<CursorBandProps> {\n  static displayName = 'CursorBand';\n\n  render() {\n    const { bandStyle, cursorPosition, tooltipType, fromExternalEvent } = this.props;\n    const isBand = (cursorPosition?.width ?? 0) > 0 && (cursorPosition?.height ?? 0) > 0;\n    if (!isBand || !cursorPosition || !canRenderBand(tooltipType, bandStyle.visible, fromExternalEvent)) {\n      return null;\n    }\n    const { x, y, width, height } = cursorPosition;\n    const { fill } = bandStyle;\n    return (\n      <svg className=\"echCrosshair__cursor\" width=\"100%\" height=\"100%\">\n        <rect {...{ x, y, width, height, fill, opacity: 0.5 }} />\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): CursorBandProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      bandStyle: LIGHT_THEME.crosshair.band,\n      tooltipType: TooltipType.None,\n    };\n  }\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const cursorBandPosition = getCursorBandPositionSelector(state);\n  const fromExternalEvent = cursorBandPosition?.fromExternalEvent;\n  const tooltipType = getTooltipType(tooltip, settings, fromExternalEvent);\n\n  return {\n    bandStyle: getChartThemeSelector(state).crosshair.band,\n    cursorPosition: cursorBandPosition,\n    tooltipType,\n    fromExternalEvent,\n  };\n};\n\n/** @internal */\nexport const CursorBand = connect(mapStateToProps)(CursorBandComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { FC } from 'react';\n\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { HeatmapStyle } from '../../../../utils/themes/theme';\nimport { DragShape, nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\n\n/** @internal */\nexport interface HighlighterCellsProps {\n  chartId: string;\n  initialized: boolean;\n  canvasDimension: Dimensions;\n  geometries: ShapeViewModel;\n  dragShape: DragShape | null;\n  brushMask: HeatmapStyle['brushMask'];\n  brushArea: HeatmapStyle['brushArea'];\n}\n\n/**\n * @internal\n *\n * Component for highlighting selected cells\n */\nexport const HighlighterCellsComponent: FC<HighlighterCellsProps> = ({\n  initialized,\n  dragShape,\n  chartId,\n  canvasDimension,\n  brushArea,\n  brushMask,\n}) => {\n  if (!initialized || dragShape === null) return null;\n\n  return (\n    <svg className=\"echHighlighter\" width=\"100%\" height=\"100%\">\n      <defs>\n        <mask id={`echHighlighterMask__${chartId}`}>\n          {/* the entire chart */}\n          {brushMask.visible && (\n            <rect\n              x={0}\n              y={0}\n              width={canvasDimension.width + canvasDimension.left}\n              height={canvasDimension.height}\n              fill=\"#eee\"\n            />\n          )}\n          {brushArea.visible && (\n            <>\n              {/* the rectangle box */}\n              <rect\n                x={dragShape.x}\n                y={dragShape.y}\n                width={dragShape.width}\n                height={dragShape.height}\n                fill={brushArea.fill}\n              />\n              {/* the left axis labels */}\n              <rect\n                x={0}\n                y={dragShape.y}\n                width={canvasDimension.left}\n                height={dragShape.height}\n                fill={brushArea.fill}\n              />\n            </>\n          )}\n        </mask>\n      </defs>\n      <g>\n        {/* the entire chart */}\n        {brushMask.visible && (\n          <rect\n            x={0}\n            y={0}\n            width={canvasDimension.width + canvasDimension.left}\n            height={canvasDimension.height}\n            mask={`url(#echHighlighterMask__${chartId})`}\n            fill={brushMask.fill}\n          />\n        )}\n        {brushArea.visible && (\n          <>\n            {/* top line for the box */}\n            <line\n              x1={dragShape.x}\n              y1={dragShape.y}\n              x2={dragShape.x + dragShape.width}\n              y2={dragShape.y}\n              stroke={brushArea.stroke}\n              strokeWidth={brushArea.strokeWidth}\n            />\n            {/* bottom line */}\n            <line\n              x1={dragShape.x}\n              y1={dragShape.y + dragShape.height}\n              x2={dragShape.x + dragShape.width}\n              y2={dragShape.y + dragShape.height}\n              stroke={brushArea.stroke}\n              strokeWidth={brushArea.strokeWidth}\n            />\n            {/* left line */}\n            <line\n              x1={dragShape.x}\n              y1={dragShape.y}\n              x2={dragShape.x}\n              y2={dragShape.y + dragShape.height}\n              stroke={brushArea.stroke}\n              strokeWidth={brushArea.strokeWidth}\n            />\n            {/* right line */}\n            <line\n              x1={dragShape.x + dragShape.width}\n              y1={dragShape.y}\n              x2={dragShape.x + dragShape.width}\n              y2={dragShape.y + dragShape.height}\n              stroke={brushArea.stroke}\n              strokeWidth={brushArea.strokeWidth}\n            />\n          </>\n        )}\n      </g>\n    </svg>\n  );\n};\n\n/** @internal */\nexport const DEFAULT_PROPS: HighlighterCellsProps = {\n  chartId: 'empty',\n  initialized: false,\n  canvasDimension: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  geometries: nullShapeViewModel(),\n  dragShape: { x: 0, y: 0, height: 0, width: 0 },\n  brushArea: LIGHT_THEME.heatmap.brushArea,\n  brushMask: LIGHT_THEME.heatmap.brushMask,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { connect } from 'react-redux';\n\nimport { DEFAULT_PROPS, HighlighterCellsComponent, HighlighterCellsProps } from './highlighter';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions';\nimport { getBrushedHighlightedShapesSelector } from '../../state/selectors/get_brushed_highlighted_shapes';\nimport { getHighlightedAreaSelector } from '../../state/selectors/get_highlighted_area';\nimport { getPerPanelHeatmapGeometries } from '../../state/selectors/get_per_panel_heatmap_geometries';\n\nconst brushMapStateToProps = (state: GlobalChartState): HighlighterCellsProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n\n  let dragShape = getBrushedHighlightedShapesSelector(state);\n  const highlightedArea = getHighlightedAreaSelector(state);\n\n  if (highlightedArea) {\n    dragShape = highlightedArea;\n  }\n\n  const { chartId } = state;\n  const geoms = getPerPanelHeatmapGeometries(state);\n  const canvasDimension = computeChartDimensionsSelector(state).chartDimensions;\n  const { brushMask, brushArea } = getChartThemeSelector(state).heatmap;\n\n  return {\n    chartId,\n    initialized: true,\n    canvasDimension,\n    geometries: geoms,\n    dragShape,\n    brushMask,\n    brushArea,\n  };\n};\n\n/**\n * @internal\n */\nexport const HighlighterFromBrush = connect(brushMapStateToProps)(HighlighterCellsComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Colors, ColorScale } from '../../../common/colors';\nimport { getPredicateFn } from '../../../common/predicate';\nimport { isFiniteNumber, safeFormat, ValueFormatter } from '../../../utils/common';\nimport { ColorBand, HeatmapBandsColorScale } from '../specs/heatmap';\n\nfunction defaultColorBandFormatter(valueFormatter?: ValueFormatter) {\n  return (startValue: number, endValue: number) => {\n    const finiteStart = Number.isFinite(startValue);\n    const finiteEnd = Number.isFinite(endValue);\n    const start = safeFormat(startValue, valueFormatter);\n    const end = safeFormat(endValue, valueFormatter);\n    return !finiteStart && finiteEnd ? `< ${end}` : finiteStart && !finiteEnd ? `≥ ${start}` : `${start} - ${end}`;\n  };\n}\n\n/** @internal */\nexport function getBandsColorScale(\n  colorScale: HeatmapBandsColorScale,\n  locale: string,\n  valueFormatter?: ValueFormatter,\n): { scale: ColorScale; bands: Required<ColorBand>[] } {\n  const labelFormatter = colorScale.labelFormatter ?? defaultColorBandFormatter(valueFormatter);\n  const ascendingSortFn = getPredicateFn('numAsc', locale, 'start');\n  const bands = colorScale.bands\n    .reduce<Required<ColorBand>[]>((acc, { start, end, color, label }) => {\n      // admit only proper bands\n      if (start < end) acc.push({ start, end, color, label: label ?? labelFormatter(start, end) });\n      return acc;\n    }, [])\n    .sort(ascendingSortFn);\n\n  const scale = getBandScale(bands);\n  return { scale, bands };\n}\n\nfunction getBandScale(bands: ColorBand[]): ColorScale {\n  return (value) => {\n    // this prevents assigning a color to NaN values\n    if (!isFiniteNumber(value)) {\n      return Colors.Transparent.keyword;\n    }\n\n    return bands.find(({ start, end }) => start <= value && value < end)?.color ?? Colors.Transparent.keyword;\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { X_SCALE_DEFAULT } from './scale_defaults';\nimport { ChartType } from '../..';\nimport { Color } from '../../../common/colors';\nimport { SmallMultiplesDatum } from '../../../common/panel_utils';\nimport { Predicate } from '../../../common/predicate';\nimport { ScaleType } from '../../../scales/constants';\nimport { BaseDatum, Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Accessor, AccessorFn } from '../../../utils/accessor';\nimport { ESCalendarInterval, ESFixedInterval } from '../../../utils/chrono/elasticsearch';\nimport { Datum, LabelAccessor, stripUndefined, ValueFormatter } from '../../../utils/common';\nimport { Cell } from '../layout/types/viewmodel_types';\n\n/** @public */\nexport type HeatmapScaleType =\n  | typeof ScaleType.Linear\n  | typeof ScaleType.Quantile\n  | typeof ScaleType.Quantize\n  | typeof ScaleType.Threshold;\n\n/** @alpha */\nexport type ColorBand = {\n  start: number;\n  end: number;\n  color: Color;\n  label?: string;\n};\n\n/** @alpha */\nexport interface HeatmapBandsColorScale {\n  type: 'bands';\n  bands: Array<ColorBand>;\n  /** called on ColorBands without a provided label */\n  labelFormatter?: (start: number, end: number) => string;\n}\n\n/** @public */\nexport type HeatmapBrushEvent = HeatmapHighlightedData & {\n  cells: Cell[];\n};\n/** @public */\nexport interface TimeScale {\n  type: typeof ScaleType.Time;\n}\n\n/** @public */\nexport interface RasterTimeScale extends TimeScale {\n  interval: ESCalendarInterval | ESFixedInterval;\n}\n\n/** @public */\nexport interface LinearScale {\n  type: typeof ScaleType.Linear;\n}\n\n/** @public */\nexport interface OrdinalScale {\n  type: typeof ScaleType.Ordinal;\n}\n\n/**\n * @public\n */\nexport interface HeatmapHighlightedData extends SmallMultiplesDatum {\n  x: Array<string | number>;\n  y: Array<string | number>;\n}\n\n/** @alpha */\nexport interface HeatmapSpec<D extends BaseDatum = Datum> extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Heatmap;\n  data: D[];\n  colorScale: HeatmapBandsColorScale;\n  xAccessor: Accessor<D> | AccessorFn<D>;\n  yAccessor: Accessor<D> | AccessorFn<D>;\n  valueAccessor: Accessor<never> | AccessorFn;\n  valueFormatter: ValueFormatter;\n  xSortPredicate: Predicate;\n  ySortPredicate: Predicate;\n  xScale: RasterTimeScale | OrdinalScale | LinearScale;\n  highlightedData?: HeatmapHighlightedData;\n  name?: string;\n  timeZone: string;\n  xAxisTitle: string;\n  xAxisLabelName: string;\n  xAxisLabelFormatter: LabelAccessor<string | number>;\n  yAxisTitle: string;\n  yAxisLabelName: string;\n  yAxisLabelFormatter: LabelAccessor<string | number>;\n}\n\n/** @internal */\nexport const heatmapBuildProps = buildSFProps<HeatmapSpec>()(\n  {\n    chartType: ChartType.Heatmap,\n    specType: SpecType.Series,\n  },\n  {\n    data: [],\n    valueAccessor: ({ value }) => value,\n    xScale: { type: X_SCALE_DEFAULT.type },\n    valueFormatter: (value) => `${value}`,\n    xSortPredicate: Predicate.AlphaAsc,\n    ySortPredicate: Predicate.AlphaAsc,\n    // TODO: make accessors required\n    xAccessor: (d) => d?.x,\n    yAccessor: (d) => d?.y,\n    timeZone: 'UTC',\n    xAxisTitle: '',\n    yAxisTitle: '',\n    xAxisLabelName: 'X Value',\n    xAxisLabelFormatter: String,\n    yAxisLabelName: 'Y Value',\n    yAxisLabelFormatter: String,\n  },\n);\n\n/**\n * Adds heatmap spec to chart specs\n * @alpha\n */\nexport const Heatmap = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    HeatmapSpec<D>,\n    keyof (typeof heatmapBuildProps)['overrides'],\n    keyof (typeof heatmapBuildProps)['defaults'],\n    keyof (typeof heatmapBuildProps)['optionals'],\n    keyof (typeof heatmapBuildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = heatmapBuildProps;\n  useSpecFactory<HeatmapSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type HeatmapProps = ComponentProps<typeof Heatmap>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './heatmap';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleType } from '../../../scales/constants';\n\n/** @internal */\nexport const X_SCALE_DEFAULT = {\n  type: ScaleType.Ordinal,\n  nice: false,\n  desiredTickCount: 10,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { computeChartDimensionsSelector } from './selectors/compute_chart_dimensions';\nimport { computeLegendSelector } from './selectors/compute_legend';\nimport { getBrushAreaSelector } from './selectors/get_brush_area';\nimport { getPointerCursorSelector } from './selectors/get_cursor_pointer';\nimport { getDebugStateSelector } from './selectors/get_debug_state';\nimport { getHeatmapTableSelector } from './selectors/get_heatmap_table';\nimport { getLegendItemsLabelsSelector } from './selectors/get_legend_items_labels';\nimport { getTooltipAnchorSelector } from './selectors/get_tooltip_anchor';\nimport { isBrushAvailableSelector } from './selectors/is_brush_available';\nimport { isEmptySelector } from './selectors/is_empty';\nimport { isTooltipVisibleSelector } from './selectors/is_tooltip_visible';\nimport { createOnBrushEndCaller } from './selectors/on_brush_end_caller';\nimport { createOnElementClickCaller } from './selectors/on_element_click_caller';\nimport { createOnElementOutCaller } from './selectors/on_element_out_caller';\nimport { createOnElementOverCaller } from './selectors/on_element_over_caller';\nimport { createOnPointerUpdateCaller } from './selectors/on_pointer_update_caller';\nimport { getTooltipInfoSelector } from './selectors/tooltip';\nimport { ChartType } from '../..';\nimport { SmallMultiplesSeriesDomains } from '../../../common/panel_utils';\nimport { BrushTool } from '../../../components/brush/brush';\nimport { Tooltip } from '../../../components/tooltip/tooltip';\nimport { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state';\nimport { getChartContainerDimensionsSelector } from '../../../state/selectors/get_chart_container_dimensions';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { isBrushingSelector } from '../../../state/selectors/is_brushing';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { Heatmap } from '../renderer/canvas/connected_component';\nimport { CursorBand } from '../renderer/dom/cursor_band';\nimport { HighlighterFromBrush } from '../renderer/dom/highlighter_brush';\n\nconst EMPTY_MAP = new Map();\n\n/** @internal */\nexport class HeatmapState implements InternalChartState {\n  chartType = ChartType.Heatmap;\n\n  onElementClickCaller: (state: GlobalChartState) => void = createOnElementClickCaller();\n\n  onElementOverCaller: (state: GlobalChartState) => void = createOnElementOverCaller();\n\n  onElementOutCaller: (state: GlobalChartState) => void = createOnElementOutCaller();\n\n  onBrushEndCaller: (state: GlobalChartState) => void = createOnBrushEndCaller();\n\n  onPointerUpdate: (state: GlobalChartState) => void = createOnPointerUpdateCaller();\n\n  isInitialized() {\n    return InitStatus.Initialized;\n  }\n\n  isBrushAvailable(globalState: GlobalChartState) {\n    return isBrushAvailableSelector(globalState);\n  }\n\n  isBrushing(globalState: GlobalChartState) {\n    return isBrushingSelector(globalState);\n  }\n\n  isChartEmpty(globalState: GlobalChartState) {\n    return isEmptySelector(globalState);\n  }\n\n  getLegendItems(globalState: GlobalChartState) {\n    return computeLegendSelector(globalState);\n  }\n\n  getLegendItemsLabels(globalState: GlobalChartState) {\n    return getLegendItemsLabelsSelector(globalState);\n  }\n\n  getLegendExtraValues() {\n    return EMPTY_MAP;\n  }\n\n  chartRenderer(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) {\n    return (\n      <>\n        <Tooltip getChartContainerRef={containerRef} />\n        <Heatmap forwardStageRef={forwardStageRef} />\n        <CursorBand />\n        <BrushTool />\n        <HighlighterFromBrush />\n      </>\n    );\n  }\n\n  getPointerCursor(globalState: GlobalChartState) {\n    return getPointerCursorSelector(globalState);\n  }\n\n  isTooltipVisible(globalState: GlobalChartState) {\n    return isTooltipVisibleSelector(globalState);\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfoSelector(globalState);\n  }\n\n  getTooltipAnchor(globalState: GlobalChartState) {\n    return getTooltipAnchorSelector(globalState);\n  }\n\n  getProjectionContainerArea(globalState: GlobalChartState): Dimensions {\n    return getChartContainerDimensionsSelector(globalState);\n  }\n\n  getMainProjectionArea(globalState: GlobalChartState): Dimensions {\n    return computeChartDimensionsSelector(globalState).chartDimensions;\n  }\n\n  getBrushArea(globalState: GlobalChartState): Dimensions | null {\n    return getBrushAreaSelector(globalState);\n  }\n\n  getDebugState(globalState: GlobalChartState) {\n    return getDebugStateSelector(globalState);\n  }\n\n  getChartTypeDescription() {\n    return 'Heatmap chart';\n  }\n\n  getSmallMultiplesDomains(globalState: GlobalChartState): SmallMultiplesSeriesDomains {\n    return getHeatmapTableSelector(globalState);\n  }\n\n  eventCallbacks(globalState: GlobalChartState) {\n    this.onElementOverCaller(globalState);\n    this.onElementOutCaller(globalState);\n    this.onElementClickCaller(globalState);\n    this.onBrushEndCaller(globalState);\n    this.onPointerUpdate(globalState);\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getHeatmapTableSelector } from './get_heatmap_table';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getScale } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalSmallMultiplesDomains } from '../../../../state/selectors/get_internal_sm_domains';\nimport { getLegendSizeSelector } from '../../../../state/selectors/get_legend_size';\nimport { getSmallMultiplesSpec } from '../../../../state/selectors/get_small_multiples_spec';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isHorizontalLegend } from '../../../../utils/legend';\nimport { isRasterTimeScale } from '../../layout/viewmodel/viewmodel';\nimport { getTextSizeDimension, getYAxisHorizontalUsedSpace, getXAxisSize } from '../utils/axis';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/**\n * Returns grid and axes sizes and positions.\n * @internal\n */\nexport const computeAxesSizesSelector = createCustomCachedSelector(\n  [\n    getParentDimension,\n    getLegendSizeSelector,\n    getHeatmapTableSelector,\n    getChartThemeSelector,\n    getHeatmapSpecSelector,\n    getSmallMultiplesSpec,\n    getInternalSmallMultiplesDomains,\n  ],\n  (\n    container,\n    legendSize,\n    { yValues, xValues },\n    { heatmap, axes: { axisTitle: axisTitleStyle, axisPanelTitle: axisPanelTitleStyle } },\n    { xAxisTitle, yAxisTitle, xAxisLabelFormatter, yAxisLabelFormatter, xScale },\n    smSpec,\n    { smHDomain },\n  ) => {\n    // TODO find a cleaner way without circular dependencies\n    const panelWidth = getScale(smHDomain, container.width, smSpec?.style?.horizontalPanelPadding).bandwidth;\n\n    return withTextMeasure((textMeasure) => {\n      const isLegendHorizontal = isHorizontalLegend(legendSize.position);\n      const legendWidth = !isLegendHorizontal ? legendSize.width + legendSize.margin * 2 : 0;\n      const legendHeight = isLegendHorizontal\n        ? heatmap.maxLegendHeight ?? legendSize.height + legendSize.margin * 2\n        : 0;\n\n      const yAxisTitleHorizontalSize = getTextSizeDimension(yAxisTitle, axisTitleStyle, textMeasure, 'height');\n      const yAxisPanelTitleHorizontalSize = getTextSizeDimension(\n        yAxisTitle,\n        axisPanelTitleStyle,\n        textMeasure,\n        'height',\n        !smSpec?.splitVertically,\n      );\n      const yAxis = {\n        width: getYAxisHorizontalUsedSpace(yValues, heatmap.yAxisLabel, yAxisLabelFormatter, textMeasure),\n      };\n\n      const xAxisTitleVerticalSize = getTextSizeDimension(xAxisTitle, axisTitleStyle, textMeasure, 'height');\n      const xAxisPanelTitleVerticalSize = getTextSizeDimension(\n        xAxisTitle,\n        axisPanelTitleStyle,\n        textMeasure,\n        'height',\n        !smSpec?.splitHorizontally,\n      );\n      const xAxis = getXAxisSize(\n        !isRasterTimeScale(xScale),\n        heatmap.xAxisLabel,\n        xAxisLabelFormatter,\n        xValues,\n        textMeasure,\n        panelWidth - legendWidth - heatmap.grid.stroke.width / 2, // we should consider also the grid width\n        [\n          yAxisTitleHorizontalSize + yAxisPanelTitleHorizontalSize + yAxis.width,\n          0, // this can be used if we have a right Y axis\n        ],\n      );\n\n      // TODO simplify this width calculation\n      const chartWidth = getXAxisSize(\n        !isRasterTimeScale(xScale),\n        heatmap.xAxisLabel,\n        xAxisLabelFormatter,\n        xValues,\n        textMeasure,\n        container.width - legendWidth - heatmap.grid.stroke.width / 2, // we should consider also the grid width\n        [\n          yAxisTitleHorizontalSize + yAxisPanelTitleHorizontalSize + yAxis.width,\n          0, // this can be used if we have a right Y axis\n        ],\n      ).width;\n\n      return {\n        yAxis,\n        xAxis,\n        legendHeight,\n        xAxisTitleVerticalSize,\n        xAxisPanelTitleVerticalSize,\n        chartWidth,\n      };\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesSizesSelector } from './compute_axes_sizes';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { ChartDimensions } from '../../../xy_chart/utils/dimensions';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/**\n * Returns chart dimensions  axes sizes and positions.\n * @internal\n */\nexport const computeChartDimensionsSelector = createCustomCachedSelector(\n  [getParentDimension, computeAxesSizesSelector, getChartThemeSelector],\n  (parentDimensions, axesSizes, { heatmap, chartPaddings }): ChartDimensions => {\n    const chartHeight =\n      parentDimensions.height -\n      axesSizes.xAxisTitleVerticalSize -\n      axesSizes.xAxisPanelTitleVerticalSize -\n      axesSizes.xAxis.height -\n      axesSizes.legendHeight -\n      heatmap.grid.stroke.width / 2;\n\n    const { chartWidth } = axesSizes;\n\n    return {\n      leftMargin: NaN, // not used\n      chartDimensions: {\n        top: parentDimensions.top + heatmap.grid.stroke.width / 2 + chartPaddings.top,\n        left: parentDimensions.left + axesSizes.xAxis.left + chartPaddings.left,\n        width: Math.max(0, chartWidth - chartPaddings.left - chartPaddings.right),\n        height: Math.max(0, chartHeight - chartPaddings.top - chartPaddings.bottom),\n      },\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesSizesSelector } from './compute_axes_sizes';\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getPanelSize } from '../../../../common/panel_utils';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { Dimensions } from '../../../../utils/dimensions';\n\n/** @internal */\nexport type ChartElementSizes = {\n  yAxis: Dimensions;\n  xAxis: Dimensions;\n  xAxisTickCadence: number;\n  xLabelRotation: number;\n};\n\n/**\n * Returns grid and axes sizes and positions.\n * @internal\n */\nexport const computeChartElementSizesSelector = createCustomCachedSelector(\n  [computeChartDimensionsSelector, computeAxesSizesSelector, getChartThemeSelector, computeSmallMultipleScalesSelector],\n  ({ chartDimensions }, axesSizes, { heatmap }, smScales): ChartElementSizes => {\n    const panelHeight = getPanelSize(smScales).height;\n    const grid: Dimensions = {\n      width: axesSizes.xAxis.width,\n      height: panelHeight,\n      left: chartDimensions.left + axesSizes.xAxis.left,\n      top: chartDimensions.top + heatmap.grid.stroke.width / 2,\n    };\n\n    const yAxis: Dimensions = {\n      width: axesSizes.yAxis.width,\n      height: grid.height,\n      top: grid.top,\n      left: grid.left - axesSizes.yAxis.width,\n    };\n\n    const xAxis: Dimensions = {\n      width: grid.width,\n      height: axesSizes.xAxis.height,\n      top: grid.top + grid.height,\n      left: grid.left,\n    };\n\n    return {\n      yAxis,\n      xAxis,\n      xAxisTickCadence: axesSizes.xAxis.tickCadence,\n      xLabelRotation: axesSizes.xAxis.minRotation,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getColorScale } from './get_color_scale';\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { isEmptySelector } from './is_empty';\nimport { LegendItem } from '../../../../common/legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getDeselectedSeriesSelector } from '../../../../state/selectors/get_deselected_data_series';\n\nconst EMPTY_LEGEND: LegendItem[] = [];\n/** @internal */\nexport const computeLegendSelector = createCustomCachedSelector(\n  [getHeatmapSpecSelector, getColorScale, getDeselectedSeriesSelector, isEmptySelector],\n  (spec, { bands }, deselectedDataSeries, empty): LegendItem[] => {\n    if (spec === null || empty) {\n      return EMPTY_LEGEND;\n    }\n\n    return bands.map(({ label, color }) => {\n      return {\n        // the band label is considered unique by construction\n        seriesIdentifiers: [{ key: label, specId: label }],\n        color,\n        label,\n        isSeriesHidden: deselectedDataSeries.some(({ key }) => key === label),\n        isToggleable: true,\n        path: [{ index: 0, value: label }],\n        keys: [],\n      };\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getBrushedHighlightedShapesSelector } from './get_brushed_highlighted_shapes';\nimport { BrushAxis } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\nimport { clamp } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\n\nconst getMouseDownPosition = (state: GlobalChartState) => state.interactions.pointer.down;\n\n/** @internal */\nexport const getBrushAreaSelector = createCustomCachedSelector(\n  [\n    isBrushingSelector,\n    getMouseDownPosition,\n    getActivePointerPosition,\n    getSettingsSpecSelector,\n    computeChartDimensionsSelector,\n    getBrushedHighlightedShapesSelector,\n  ],\n  (isBrushing, mouseDownPosition, end, { brushAxis }, { chartDimensions }, dragShape): Dimensions | null => {\n    if (!isBrushing || !mouseDownPosition || !dragShape) {\n      return null;\n    }\n\n    const start = {\n      x: mouseDownPosition.position.x - chartDimensions.left,\n      y: mouseDownPosition.position.y,\n    };\n\n    const clampedEndY = clamp(end.y, 0, chartDimensions.height);\n    switch (brushAxis) {\n      case BrushAxis.Both:\n        return {\n          top: start.y,\n          left: start.x,\n          width: end.x - start.x - chartDimensions.left,\n          height: clampedEndY - start.y,\n        };\n      default:\n        return {\n          top: start.y,\n          left: start.x,\n          width: end.x - start.x - chartDimensions.left,\n          height: clampedEndY - start.y,\n        };\n    }\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActivePointerPosition } from './../../../../state/selectors/get_active_pointer_position';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { DragShape } from '../../layout/types/viewmodel_types';\n\nfunction getCurrentPointerStates(state: GlobalChartState) {\n  return state.interactions.pointer;\n}\n\n/** @internal */\nexport const getBrushedHighlightedShapesSelector = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getCurrentPointerStates, getActivePointerPosition],\n  (geoms, pointerStates, activePosition): DragShape => {\n    if (!pointerStates.dragging || !pointerStates.down) {\n      return null;\n    }\n\n    return geoms.pickDragShape([pointerStates.down.position, activePosition]);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { ColorScale } from '../../../../common/colors';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getBandsColorScale } from '../../scales/band_color_scale';\nimport { ColorBand } from '../../specs/heatmap';\n\n/**\n * @internal\n * Gets color scale based on specification and values range.\n */\nexport const getColorScale = createCustomCachedSelector(\n  [getSettingsSpecSelector, getHeatmapSpecSelector],\n  (\n    { locale },\n    spec,\n  ): {\n    scale: ColorScale;\n    bands: Required<ColorBand>[];\n  } => getBandsColorScale(spec.colorScale, locale, spec.valueFormatter),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { getTooltipAnchorSelector } from './get_tooltip_anchor';\nimport { getPickedShapes, hasPicketVisibleCells } from './picked_shapes';\nimport { Rect } from '../../../../geoms/types';\nimport { isPointerOverEvent } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getInternalIsBrushingSelector } from '../../../../state/selectors/get_internal_is_brushing';\nimport { isNil } from '../../../../utils/common';\n\nconst getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer;\n\n/** @internal */\nexport const getCursorBandPositionSelector = createCustomCachedSelector(\n  [\n    getPerPanelHeatmapGeometries,\n    getExternalPointerEventStateSelector,\n    getPickedShapes,\n    getTooltipAnchorSelector,\n    getInternalIsBrushingSelector,\n  ],\n  (\n    geoms,\n    externalPointerEvent,\n    pickedShapes,\n    tooltipShape,\n    isBrushing,\n  ): (Rect & { fromExternalEvent: boolean }) | undefined => {\n    // block cursor when brusing\n    if (isBrushing) return;\n\n    // external pointer events takes precedence over the current mouse pointer\n    if (isPointerOverEvent(externalPointerEvent)) {\n      const { x } = externalPointerEvent;\n      if (!isNil(x)) {\n        const band = geoms.pickCursorBand(x);\n        if (band) {\n          return {\n            ...band,\n            fromExternalEvent: true,\n          };\n        }\n      }\n    }\n\n    if (hasPicketVisibleCells(pickedShapes)) {\n      return {\n        ...tooltipShape,\n        fromExternalEvent: false,\n      };\n    }\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\n\nimport { getPickedShapes, hasPicketVisibleCells } from './picked_shapes';\nimport { DEFAULT_CSS_CURSOR } from '../../../../common/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\n\n/** @internal */\nexport const getPointerCursorSelector = createCustomCachedSelector(\n  [getPickedShapes, isBrushingSelector, getTooltipInteractionState],\n  (pickedShapes, isBrushing, tooltipState): CSSProperties['cursor'] => {\n    if (tooltipState.pinned) return;\n    return isBrushing || hasPicketVisibleCells(pickedShapes) ? 'pointer' : DEFAULT_CSS_CURSOR;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartElementSizesSelector } from './compute_chart_element_sizes';\nimport { computeLegendSelector } from './compute_legend';\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getHighlightedAreaSelector, getHighlightedDataSelector } from './get_highlighted_area';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { LegendItem } from '../../../../common/legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { DebugState, DebugStateLegend } from '../../../../state/types';\nimport { Position } from '../../../../utils/common';\n\n/**\n * Returns a stringified version of the `debugState`\n * @internal\n */\nexport const getDebugStateSelector = createCustomCachedSelector(\n  [\n    getPerPanelHeatmapGeometries,\n    computeLegendSelector,\n    getHighlightedAreaSelector,\n    getHighlightedDataSelector,\n    getChartThemeSelector,\n    computeChartElementSizesSelector,\n    getHeatmapSpecSelector,\n  ],\n  (\n    geoms,\n    legend,\n    pickedArea,\n    highlightedData,\n    { heatmap },\n    { xAxisTickCadence },\n    { xAxisTitle, yAxisTitle },\n  ): DebugState => {\n    const heatmapViewModel = geoms.heatmapViewModels[0];\n    const xAxisValues = heatmapViewModel?.xValues.filter((_, i) => i % xAxisTickCadence === 0) ?? [];\n\n    return {\n      // Common debug state\n      legend: getLegendState(legend),\n      axes: {\n        x: [\n          {\n            id: 'x',\n            position: Position.Left,\n            labels: xAxisValues.map(({ text }) => text),\n            values: xAxisValues.map(({ value }) => value),\n            // vertical lines\n            gridlines: (heatmapViewModel?.gridLines?.x ?? []).map((line) => ({ x: line.x1, y: line.y2 })),\n            ...(xAxisTitle ? { title: xAxisTitle } : {}),\n          },\n        ],\n        y: [\n          {\n            id: 'y',\n            position: Position.Bottom,\n            labels: (heatmapViewModel?.yValues ?? []).map(({ text }) => text),\n            values: (heatmapViewModel?.yValues ?? []).map(({ value }) => value),\n            // horizontal lines\n            gridlines: (heatmapViewModel?.gridLines?.y ?? []).map((line) => ({ x: line.x2, y: line.y1 })),\n            ...(yAxisTitle ? { title: yAxisTitle } : {}),\n          },\n        ],\n      },\n      // Heatmap debug state\n      heatmap: {\n        cells: geoms.heatmapViewModels.flatMap((vm) =>\n          vm.cells.map((cell) => ({\n            x: cell.x,\n            y: cell.y,\n            datum: cell.datum,\n            fill: RGBATupleToString(cell.fill.color),\n            formatted: cell.formatted,\n            value: cell.value,\n            valueShown: heatmap.cell.label.visible && Number.isFinite(vm.cellFontSize(cell)),\n          })),\n        ),\n        selection: {\n          area: pickedArea,\n          data: highlightedData,\n        },\n      },\n    };\n  },\n);\n\nfunction getLegendState(legendItems: LegendItem[]): DebugStateLegend {\n  const items = legendItems\n    .filter(({ isSeriesHidden }) => !isSeriesHidden)\n    .map(({ label: name, color, seriesIdentifiers: [seriesIdentifier] }) => ({\n      key: seriesIdentifier?.key ?? '',\n      name,\n      color,\n    }));\n\n  return { items };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getLegendConfigSelector } from '../../../../state/selectors/get_legend_config_selector';\nimport { getLegendSizeSelector } from '../../../../state/selectors/get_legend_size';\nimport { LayoutDirection } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/**\n * Gets charts grid area excluding legend and X,Y axis labels and paddings.\n * @internal\n */\nexport const getHeatmapContainerSizeSelector = createCustomCachedSelector(\n  [getParentDimension, getLegendSizeSelector, getChartThemeSelector, getLegendConfigSelector],\n  (parentDimensions, legendSize, { heatmap: { maxLegendHeight } }, { showLegend, legendPosition }): Dimensions => {\n    if (!showLegend || legendPosition.floating) {\n      return parentDimensions;\n    }\n    if (legendPosition.direction === LayoutDirection.Vertical) {\n      return {\n        left: 0,\n        top: 0,\n        width: parentDimensions.width - legendSize.width - legendSize.margin * 2,\n        height: parentDimensions.height,\n      };\n    }\n\n    const legendHeight = maxLegendHeight ?? legendSize.height + legendSize.margin * 2;\n\n    return {\n      left: 0,\n      top: 0,\n      width: parentDimensions.width,\n      height: parentDimensions.height - legendHeight,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { HeatmapSpec } from '../../specs';\n\n/** @internal */\nexport const getHeatmapSpecSelector = createCustomCachedSelector([getSpecs], (specs): HeatmapSpec => {\n  return getSpecFromStore<HeatmapSpec, true>(specs, ChartType.Heatmap, SpecType.Series, true);\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { extent } from 'd3-array';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { SmallMultiplesSeriesDomains } from '../../../../common/panel_utils';\nimport { getPredicateFn, Predicate } from '../../../../common/predicate';\nimport { ScaleType } from '../../../../scales/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getSmallMultiplesIndexOrderSelector } from '../../../../state/selectors/get_small_multiples_index_order';\nimport { getAccessorValue } from '../../../../utils/accessor';\nimport { addIntervalToTime, timeRange } from '../../../../utils/chrono/elasticsearch';\nimport { isFiniteNumber, isNil, isNonNullablePrimitiveValue } from '../../../../utils/common';\nimport { HeatmapCellDatum } from '../../layout/viewmodel/viewmodel';\n\n/**\n * @internal\n */\nexport interface HeatmapTable extends SmallMultiplesSeriesDomains {\n  table: Array<HeatmapCellDatum>;\n  yValues: Array<string | number>;\n  xValues: Array<string | number>;\n  xNumericExtent: [number, number];\n  extent: [number, number];\n}\n\n/**\n * Extracts axis and cell values from the input data.\n * @internal\n */\nexport const getHeatmapTableSelector = createCustomCachedSelector(\n  [getHeatmapSpecSelector, getSettingsSpecSelector, getSmallMultiplesIndexOrderSelector],\n  (spec, { xDomain, locale }, smallMultiples): HeatmapTable => {\n    const { data, valueAccessor, xAccessor, yAccessor, xSortPredicate, ySortPredicate, xScale, timeZone } = spec;\n    const smVValues = new Set<string | number>();\n    const smHValues = new Set<string | number>();\n    const resultData = data.reduce<HeatmapTable>(\n      (acc, curr, index) => {\n        const x = getAccessorValue(curr, xAccessor);\n        const y = getAccessorValue(curr, yAccessor);\n        const value = getAccessorValue(curr, valueAccessor);\n\n        if (!isNonNullablePrimitiveValue(x) || !isNonNullablePrimitiveValue(y)) {\n          return acc;\n        }\n        // add a cell and update extent only if the value is finite\n        if (isFiniteNumber(value)) {\n          acc.extent = [Math.min(acc.extent[0], value), Math.max(acc.extent[1], value)];\n\n          // extract small multiples aggregation values\n          const smH = smallMultiples?.horizontal?.by?.(spec, curr);\n          const smV = smallMultiples?.vertical?.by?.(spec, curr);\n\n          if (!isNil(smH)) smHValues.add(smH);\n          if (!isNil(smV)) smVValues.add(smV);\n\n          acc.table.push({\n            x,\n            y,\n            value,\n            originalIndex: index,\n            smVerticalAccessorValue: smV,\n            smHorizontalAccessorValue: smH,\n          });\n        }\n        // the x and y values are used for the scale domain, and we want to keep track of every element, even non-finite values\n        if (!acc.xValues.includes(x)) {\n          acc.xValues.push(x);\n        }\n        if (!acc.yValues.includes(y)) {\n          acc.yValues.push(y);\n        }\n\n        return acc;\n      },\n      {\n        table: [],\n        xValues: [],\n        yValues: [],\n        smHDomain: [],\n        smVDomain: [],\n        extent: [+Infinity, -Infinity],\n        xNumericExtent: [+Infinity, -Infinity],\n      },\n    );\n    if (xScale.type === ScaleType.Time) {\n      const [xDataMin = NaN, xDataMax = NaN] = extent(resultData.xValues as number[]);\n      // to correctly compute the time extent from data, we need to add an interval to the max value of the dataset\n      const dataMaxExtended = xDataMax ? addIntervalToTime(xDataMax, xScale.interval, timeZone) : NaN;\n\n      const [customMin, customMax] = !Array.isArray(xDomain) ? [xDomain?.min ?? NaN, xDomain?.max ?? NaN] : [NaN, NaN];\n      const [min, max] = extent([xDataMin, customMin, customMax, dataMaxExtended]);\n      resultData.xNumericExtent = [min ?? NaN, max ?? NaN];\n      resultData.xValues =\n        isFiniteNumber(min) && isFiniteNumber(max) ? timeRange(min, max, xScale.interval, timeZone) : [];\n    } else if (xScale.type === ScaleType.Ordinal) {\n      resultData.xValues.sort(getPredicateFn(xSortPredicate, locale));\n    }\n\n    // sort Y values by their predicates\n    resultData.yValues.sort(getPredicateFn(ySortPredicate, locale));\n\n    // sort small multiples values\n    const horizontalPredicate = smallMultiples?.horizontal?.sort ?? Predicate.DataIndex;\n    const smHDomain = [...smHValues].sort(getPredicateFn(horizontalPredicate, locale));\n\n    const verticalPredicate = smallMultiples?.vertical?.sort ?? Predicate.DataIndex;\n    const smVDomain = [...smVValues].sort(getPredicateFn(verticalPredicate, locale));\n\n    return {\n      ...resultData,\n      smHDomain,\n      smVDomain,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\n\n/**\n * @internal\n */\nexport const getHighlightedDataSelector = createCustomCachedSelector(\n  [getHeatmapSpecSelector, isBrushingSelector],\n  (spec, isBrushing) => {\n    if (!spec.highlightedData || isBrushing) {\n      return null;\n    }\n    return spec.highlightedData;\n  },\n);\n\n/**\n * Returns rect position of the highlighted selection.\n * @internal\n */\nexport const getHighlightedAreaSelector = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getHeatmapSpecSelector, isBrushingSelector],\n  (geoms, spec, isBrushing) => {\n    if (!spec.highlightedData || isBrushing) {\n      return null;\n    }\n    const { x, y, smHorizontalAccessorValue, smVerticalAccessorValue } = spec.highlightedData;\n    return geoms.pickHighlightedArea(x, y, smHorizontalAccessorValue, smVerticalAccessorValue);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getColorScale } from './get_color_scale';\nimport { getHighlightedLegendItemSelector } from './get_highlighted_legend_item';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { GenericDomain } from '../../../../utils/domain';\n\n/** @internal */\nexport const getHighlightedLegendBandsSelector = createCustomCachedSelector(\n  [getHighlightedLegendItemSelector, getColorScale],\n  (highlightedLegendItem, { bands }): Array<GenericDomain> => {\n    if (!highlightedLegendItem) return [];\n    // instead of using the specId, each legend item is associated with an unique band label\n    return bands.filter(({ label }) => highlightedLegendItem.label === label).map(({ start, end }) => [start, end]);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { LegendItem } from '../../../../common/legend';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\nconst getHighlightedLegendPath = (state: GlobalChartState) => state.interactions.highlightedLegendPath;\n\n/** @internal */\nexport const getHighlightedLegendItemSelector = createCustomCachedSelector(\n  [getHighlightedLegendPath, computeLegendSelector],\n  (highlightedLegendPaths, legendItems): LegendItem | undefined => {\n    if (highlightedLegendPaths.length > 0) {\n      const lookup = new Set(highlightedLegendPaths.map(({ value }) => value));\n      return legendItems.find(({ seriesIdentifiers }) => seriesIdentifiers.some(({ key }) => lookup.has(key)));\n    }\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/** @internal */\nexport const getLegendItemsLabelsSelector = createCustomCachedSelector(\n  [computeLegendSelector, getSettingsSpecSelector],\n  (legendItems, { showLegendExtra }): LegendItemLabel[] =>\n    legendItems.map(({ label, defaultExtra }) => ({\n      label: `${label}${showLegendExtra ? defaultExtra?.formatted ?? '' : ''}`,\n      depth: 0,\n    })),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { computeChartElementSizesSelector } from './compute_chart_element_sizes';\nimport { getColorScale } from './get_color_scale';\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getHeatmapTableSelector } from './get_heatmap_table';\nimport { isEmptySelector } from './is_empty';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSmallMultiplesIndexOrderSelector } from '../../../../state/selectors/get_small_multiples_index_order';\nimport { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { computeScenegraph } from '../../layout/viewmodel/scenegraph';\n\nconst getDeselectedSeriesSelector = (state: GlobalChartState) => state.interactions.deselectedDataSeries;\n\n/** @internal */\nexport const getPerPanelHeatmapGeometries = createCustomCachedSelector(\n  [\n    getHeatmapSpecSelector,\n    computeChartDimensionsSelector,\n    computeChartElementSizesSelector,\n    getHeatmapTableSelector,\n    getColorScale,\n    getDeselectedSeriesSelector,\n    getChartThemeSelector,\n    isEmptySelector,\n    computeSmallMultipleScalesSelector,\n    getSmallMultiplesIndexOrderSelector,\n  ],\n  (\n    heatmapSpec,\n    chartDimensions,\n    elementSizes,\n    heatmapTable,\n    { bands, scale: colorScale },\n    deselectedSeries,\n    theme,\n    empty,\n    smScales,\n    groupBySpec,\n  ): ShapeViewModel => {\n    // instead of using the specId, each legend item is associated with an unique band label\n    const disabledBandLabels = new Set(deselectedSeries.map(({ specId }) => specId));\n    const bandsToHide: Array<[number, number]> = bands\n      .filter(({ label }) => disabledBandLabels.has(label))\n      .map(({ start, end }) => [start, end]);\n\n    return heatmapSpec && !empty\n      ? computeScenegraph(\n          heatmapSpec,\n          chartDimensions,\n          elementSizes,\n          smScales,\n          groupBySpec,\n          heatmapTable,\n          colorScale,\n          bandsToHide,\n          theme,\n        )\n      : nullShapeViewModel();\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastDragSelector } from '../../../../state/selectors/get_last_drag';\nimport { PickDragFunction } from '../../layout/types/viewmodel_types';\n\n/** @internal */\nexport const getPickedCells = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getLastDragSelector, computeChartDimensionsSelector],\n  (geoms, dragState, { chartDimensions }): ReturnType<PickDragFunction> | null => {\n    if (!dragState) {\n      return null;\n    }\n\n    // the pointer is not on the cells but over the y- axis and does not cross the y-axis\n    if (dragState.start.position.x < chartDimensions.left && dragState.end.position.x < chartDimensions.left) {\n      const fittedDragStateStart = { x: chartDimensions.left, y: dragState.start.position.y };\n      const { y, cells } = geoms.pickDragArea([fittedDragStateStart, dragState.end.position]);\n      // TODO: fix with small multiples\n      return { x: [], y, cells };\n    }\n\n    // the pointer is not on the cells by over the x-axis and does not cross the x-axis\n    if (dragState.start.position.y > chartDimensions.height && dragState.end.position.y > chartDimensions.height) {\n      const fittedDragStateStart = { x: dragState.start.position.x, y: chartDimensions.height };\n      const { x, cells } = geoms.pickDragArea([fittedDragStateStart, dragState.end.position]);\n      // TODO: fix with small multiples\n      return { x, y: [], cells };\n    }\n    return geoms.pickDragArea([dragState.start.position, dragState.end.position]);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getPickedShapes } from './picked_shapes';\nimport { AnchorPosition } from '../../../../components/portal/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\n\n/** @internal */\nexport const getTooltipAnchorSelector = createCustomCachedSelector(\n  [\n    getPickedShapes,\n    computeChartDimensionsSelector,\n    getActivePointerPosition,\n    computeSmallMultipleScalesSelector,\n    getChartThemeSelector,\n  ],\n  (shapes, { chartDimensions }, position, smScales, { heatmap }): AnchorPosition => {\n    const shape = Array.isArray(shapes) && shapes[0];\n    if (shape) {\n      const {\n        x,\n        y,\n        width,\n        height,\n        datum: { smHorizontalAccessorValue = '', smVerticalAccessorValue = '' },\n      } = shape;\n\n      const scaledPanelXOffset = smScales.horizontal.scale(smHorizontalAccessorValue);\n      const scaledPanelYOffset = smScales.vertical.scale(smVerticalAccessorValue);\n\n      const panelXOffset = isNaN(scaledPanelXOffset) ? 0 : scaledPanelXOffset;\n      const panelYOffset = isNaN(scaledPanelYOffset) ? 0 : scaledPanelYOffset;\n\n      return {\n        x: x + chartDimensions.left + panelXOffset,\n        width,\n        y: y - chartDimensions.top + panelYOffset + heatmap.grid.stroke.width,\n        height,\n      };\n    }\n\n    return {\n      x: position.x,\n      width: 0,\n      y: position.y,\n      height: 0,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * The brush is available only if a onBrushEnd listener is configured\n * @internal\n */\nexport const isBrushAvailableSelector = createCustomCachedSelector(\n  [getChartThemeSelector, getSettingsSpecSelector],\n  ({ heatmap: { brushTool } }, { onBrushEnd }): boolean => Boolean(onBrushEnd) && brushTool.visible,\n);\n\n/** @internal */\nexport const isBrushEndProvided = createCustomCachedSelector([getSettingsSpecSelector], ({ onBrushEnd }): boolean =>\n  Boolean(onBrushEnd),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapTableSelector } from './get_heatmap_table';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const isEmptySelector = createCustomCachedSelector([getHeatmapTableSelector], (heatmap): boolean => {\n  return heatmap.xValues.length === 0 || heatmap.yValues.length === 0;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipInfoSelector } from './tooltip';\nimport { TooltipType } from '../../../../specs/constants';\nimport { TooltipVisibility } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\n\n/** @internal */\nexport const isTooltipVisibleSelector = createCustomCachedSelector(\n  [getTooltipSpecSelector, getTooltipInfoSelector, getTooltipInteractionState],\n  ({ type }, tooltipInfo, { pinned }): TooltipVisibility => {\n    if (type === TooltipType.None) {\n      return {\n        visible: false,\n        isExternal: false,\n        displayOnly: false,\n        isPinnable: false,\n      };\n    }\n\n    return {\n      visible: tooltipInfo.values.length > 0 || pinned,\n      displayOnly: tooltipInfo.values.every(({ displayOnly }) => displayOnly),\n      isExternal: false,\n      isPinnable: tooltipInfo.values.length > 0,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { OutputSelector } from 'reselect';\n\nimport { getPickedCells } from './get_picked_cells';\nimport { isBrushEndProvided } from './is_brush_available';\nimport { ChartType } from '../../..';\nimport { HeatmapBrushEvent, SettingsSpec } from '../../../../specs/settings';\nimport { DragState, GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastDragSelector } from '../../../../state/selectors/get_last_drag';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { DragCheckProps, hasDragged } from '../../../../utils/events';\n\n/**\n * Will call the onBrushEnd listener every time the following preconditions are met:\n * - the onBrushEnd listener is available\n * - we dragged the mouse pointer\n * @internal\n */\nexport function createOnBrushEndCaller(): (state: GlobalChartState) => void {\n  let prevProps: DragCheckProps | null = null;\n  let selector: OutputSelector<\n    GlobalChartState,\n    void,\n    (res1: DragState | null, res3: SettingsSpec, res4: HeatmapBrushEvent | null) => void\n  > | null = null;\n\n  return (state) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      if (!isBrushEndProvided(state)) {\n        selector = null;\n        prevProps = null;\n        return;\n      }\n      selector = createCustomCachedSelector(\n        [getLastDragSelector, getSettingsSpecSelector, getPickedCells],\n        (lastDrag, { onBrushEnd }, pickedCells): void => {\n          const nextProps: DragCheckProps = {\n            lastDrag,\n            onBrushEnd,\n          };\n          if (!onBrushEnd || pickedCells === null) {\n            return;\n          }\n          if (lastDrag !== null && hasDragged(prevProps, nextProps)) {\n            onBrushEnd(pickedCells);\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { SeriesIdentifier } from '../../../../common/series_id';\nimport { SettingsSpec } from '../../../../specs';\nimport { GlobalChartState, PointerState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastClickSelector } from '../../../../state/selectors/get_last_click';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isClicking } from '../../../../state/utils';\nimport { Cell, isPickedCells } from '../../layout/types/viewmodel_types';\n\n/**\n * Will call the onElementClick listener every time the following preconditions are met:\n * - the onElementClick listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnElementClickCaller(): (state: GlobalChartState) => void {\n  let prevClick: PointerState | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      selector = createCustomCachedSelector(\n        [getHeatmapSpecSelector, getLastClickSelector, getSettingsSpecSelector, getPickedShapes],\n        (spec, lastClick: PointerState | null, settings: SettingsSpec, pickedShapes): void => {\n          if (!spec) {\n            return;\n          }\n          if (!settings.onElementClick) {\n            return;\n          }\n          if (!isPickedCells(pickedShapes)) {\n            return;\n          }\n          const nextPickedShapesLength = pickedShapes.length;\n          if (nextPickedShapesLength > 0 && isClicking(prevClick, lastClick)) {\n            const elements = pickedShapes.map<[Cell, SeriesIdentifier]>((value) => [\n              value,\n              {\n                specId: spec.id,\n                key: `spec{${spec.id}}`,\n              },\n            ]);\n            settings.onElementClick(elements);\n          }\n          prevClick = lastClick;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isPickedCells } from '../../layout/types/viewmodel_types';\n\n/**\n * Will call the onElementOut listener every time the following preconditions are met:\n * - the onElementOut listener is available\n * - the highlighted geometries list goes from a list of at least one object to an empty one\n * @internal\n */\nexport function createOnElementOutCaller(): (state: GlobalChartState) => void {\n  let prevPickedShapes: number | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      selector = createCustomCachedSelector(\n        [getHeatmapSpecSelector, getPickedShapes, getSettingsSpecSelector],\n        (spec, pickedShapes, settings): void => {\n          if (!spec) {\n            return;\n          }\n          if (!settings.onElementOut) {\n            return;\n          }\n          const nextPickedShapes = isPickedCells(pickedShapes) ? pickedShapes.length : 0;\n\n          if (prevPickedShapes !== null && prevPickedShapes > 0 && nextPickedShapes === 0) {\n            settings.onElementOut();\n          }\n          prevPickedShapes = nextPickedShapes;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { SeriesIdentifier } from '../../../../common/series_id';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { Cell, isPickedCells } from '../../layout/types/viewmodel_types';\n\nfunction isOverElement(prev: Cell[], next: Cell[]) {\n  if (next.length === 0) {\n    return;\n  }\n  if (next.length !== prev.length) {\n    return true;\n  }\n  return !next.every((nextCell, index) => {\n    const prevCell = prev[index];\n    if (isNil(prevCell)) {\n      return false;\n    }\n    return nextCell.value === prevCell.value && nextCell.x === prevCell.x && nextCell.y === prevCell.y;\n  });\n}\n\n/**\n * Will call the onElementOver listener every time the following preconditions are met:\n * - the onElementOver listener is available\n * - we have a new set of highlighted geometries on our state\n * @internal\n */\nexport function createOnElementOverCaller(): (state: GlobalChartState) => void {\n  let prevPickedShapes: Cell[] = [];\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      selector = createCustomCachedSelector(\n        [getHeatmapSpecSelector, getPickedShapes, getSettingsSpecSelector],\n        (spec, nextPickedShapes, settings): void => {\n          if (!spec) {\n            return;\n          }\n          if (!settings.onElementOver) {\n            return;\n          }\n          if (!isPickedCells(nextPickedShapes)) {\n            return;\n          }\n\n          if (isOverElement(prevPickedShapes, nextPickedShapes)) {\n            const elements = nextPickedShapes.map<[Cell, SeriesIdentifier]>((value) => [\n              value,\n              {\n                specId: spec.id,\n                key: `spec{${spec.id}}`,\n              },\n            ]);\n            settings.onElementOver(elements);\n          }\n          prevPickedShapes = nextPickedShapes;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedGridCell } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport {\n  PointerEvent,\n  PointerEventType,\n  PointerOverEvent,\n  PointerUpdateTrigger,\n  SettingsSpec,\n} from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { getChartIdSelector } from '../../../../state/selectors/get_chart_id';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\nfunction isSameEventValue(a: PointerOverEvent, b: PointerOverEvent, changeTrigger: PointerUpdateTrigger) {\n  const checkX = changeTrigger === PointerUpdateTrigger.X || changeTrigger === PointerUpdateTrigger.Both;\n  const checkY = changeTrigger === PointerUpdateTrigger.Y || changeTrigger === PointerUpdateTrigger.Both;\n  return (\n    (!checkX || (a.x === b.x && a.scale === b.scale && a.unit === b.unit)) &&\n    (!checkY || a.y.every((y, i) => y.value === b.y[i]?.value))\n  );\n}\n\nconst hasPointerEventChanged = (prev: PointerEvent, next: PointerEvent | null, changeTrigger: PointerUpdateTrigger) =>\n  next?.type !== prev.type ||\n  (prev.type === PointerEventType.Over &&\n    next?.type === PointerEventType.Over &&\n    !isSameEventValue(prev, next, changeTrigger));\n\n/**\n * Will call the onPointerUpdate listener every time the following preconditions are met:\n * - the onPointerUpdate listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnPointerUpdateCaller(): (state: GlobalChartState) => void {\n  let prevPointerEvent: PointerEvent | null = null;\n\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      selector = createCustomCachedSelector(\n        [\n          getHeatmapSpecSelector,\n          getSettingsSpecSelector,\n          getActivePointerPosition,\n          getPickedGridCell,\n          getChartIdSelector,\n        ],\n        (spec, settings: SettingsSpec, currentPointer, gridCell, chartId): void => {\n          if (!spec) {\n            return;\n          }\n\n          if (prevPointerEvent === null) {\n            prevPointerEvent = { chartId, type: PointerEventType.Out };\n          }\n          const tempPrev = { ...prevPointerEvent };\n          const nextPointerEvent: PointerEvent = gridCell\n            ? {\n                chartId: state.chartId,\n                type: currentPointer.x === -1 && currentPointer.y === -1 ? PointerEventType.Out : PointerEventType.Over,\n                scale: spec.xScale.type,\n                x: gridCell.x,\n                y: [{ value: gridCell.y, groupId: '' }],\n                smHorizontalValue: null,\n                smVerticalValue: null,\n              }\n            : { chartId, type: PointerEventType.Out };\n          // we have to update the prevPointerEvents before possibly calling the onPointerUpdate\n          // to avoid a recursive loop of calls caused by the impossibility to update the prevPointerEvent\n          prevPointerEvent = nextPointerEvent;\n\n          if (\n            settings.onPointerUpdate &&\n            hasPointerEventChanged(tempPrev, nextPointerEvent, settings.pointerUpdateTrigger)\n          ) {\n            settings.onPointerUpdate(nextPointerEvent);\n          }\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartElementSizesSelector } from './compute_chart_element_sizes';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { Cell, GridCell, TextBox } from '../../layout/types/viewmodel_types';\n\n/** @internal */\nexport const getPickedShapes = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getActivePointerPosition],\n  (geoms, pointerPosition): Cell[] | TextBox => {\n    const picker = geoms.pickQuads;\n    const { x, y } = pointerPosition;\n    return picker(x, y);\n  },\n);\n\n/** @internal */\nexport const getPickedGridCell = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getActivePointerPosition, computeChartElementSizesSelector],\n  (geoms, pointerPosition): GridCell | undefined => {\n    return geoms.pickGridCell(pointerPosition.x, pointerPosition.y);\n  },\n);\n\n/** @internal */\nexport const hasPicketVisibleCells = (pickedShapes: Cell[] | TextBox) =>\n  Array.isArray(pickedShapes) && pickedShapes.some(({ visible }) => visible);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Colors } from '../../../../common/colors';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\nconst EMPTY_TOOLTIP = Object.freeze({\n  header: null,\n  values: [],\n  disableActions: false,\n});\n\n/** @internal */\nexport const getTooltipInfoSelector = createCustomCachedSelector(\n  [getHeatmapSpecSelector, getPickedShapes],\n  (spec, pickedShapes): TooltipInfo => {\n    if (!spec) {\n      return EMPTY_TOOLTIP;\n    }\n\n    const tooltipInfo: TooltipInfo = {\n      header: null,\n      values: [],\n      disableActions: false,\n    };\n\n    if (Array.isArray(pickedShapes)) {\n      pickedShapes\n        .filter(({ visible }) => visible)\n        .forEach((shape) => {\n          // X-axis value\n          tooltipInfo.values.push({\n            label: spec.xAxisLabelName,\n            color: Colors.Transparent.keyword,\n            isHighlighted: false,\n            isVisible: true,\n            seriesIdentifier: {\n              specId: spec.id,\n              key: spec.id,\n            },\n            value: `${shape.datum.x}`,\n            formattedValue: spec.xAxisLabelFormatter(shape.datum.x),\n            datum: shape.datum,\n          });\n\n          // Y-axis value\n          tooltipInfo.values.push({\n            label: spec.yAxisLabelName,\n            color: Colors.Transparent.keyword,\n            isHighlighted: false,\n            isVisible: true,\n            seriesIdentifier: {\n              specId: spec.id,\n              key: spec.id,\n            },\n            value: `${shape.datum.y}`,\n            formattedValue: spec.yAxisLabelFormatter(shape.datum.y),\n            datum: shape.datum,\n          });\n\n          // Cell value\n          tooltipInfo.values.push({\n            label: spec.name ?? spec.id,\n            color: RGBATupleToString(shape.fill.color),\n            isHighlighted: false,\n            isVisible: true,\n            seriesIdentifier: {\n              specId: spec.id,\n              key: spec.id,\n            },\n            value: `${shape.value}`,\n            formattedValue: `${shape.formatted}`,\n            datum: shape.datum,\n            displayOnly: true,\n          });\n        });\n    } else {\n      tooltipInfo.values.push({\n        label: '',\n        color: Colors.Transparent.keyword,\n        isHighlighted: false,\n        isVisible: true,\n        seriesIdentifier: {\n          specId: spec.id,\n          key: spec.id,\n        },\n        value: `${pickedShapes.value}`,\n        formattedValue: `${pickedShapes.text}`,\n        datum: pickedShapes.value,\n        displayOnly: true,\n      });\n      tooltipInfo.disableActions = true;\n    }\n\n    return tooltipInfo;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { scaleBand } from 'd3-scale';\n\nimport { Radian } from '../../../../common/geometry';\nimport { extent } from '../../../../common/math';\nimport { Vec2, rotate2, sub2 } from '../../../../common/vectors';\nimport { screenspaceMarkerScaleCompressor } from '../../../../solvers/screenspace_marker_scale_compressor';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isFiniteNumber, degToRad } from '../../../../utils/common';\nimport { horizontalPad, innerPad, outerPad, pad, Size } from '../../../../utils/dimensions';\nimport { HeatmapStyle, AxisStyle } from '../../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\nimport { HeatmapSpec } from '../../specs';\nimport { HeatmapTable } from '../selectors/get_heatmap_table';\n\n/** @internal */\nexport function getYAxisHorizontalUsedSpace(\n  yValues: HeatmapTable['yValues'],\n  style: HeatmapStyle['yAxisLabel'],\n  formatter: HeatmapSpec['yAxisLabelFormatter'],\n  textMeasure: TextMeasure,\n): number {\n  if (!style.visible) {\n    return 0;\n  }\n  if (typeof style.width === 'number' && isFiniteNumber(style.width)) {\n    return style.width;\n  }\n  // account for the space required to show the longest Y axis label\n  const longestLabelWidth = yValues.reduce<number>((acc, value) => {\n    const { width } = textMeasure(formatter(value), style, style.fontSize);\n    return Math.max(width + horizontalPad(style.padding), acc);\n  }, 0);\n\n  return style.width === 'auto' ? longestLabelWidth : Math.min(longestLabelWidth, style.width.max);\n}\n\n/** @internal */\nexport function getTextSizeDimension(\n  text: string,\n  style: AxisStyle['axisTitle'],\n  textMeasure: TextMeasure,\n  param: 'height' | 'width',\n  hidden = false,\n): number {\n  if (!style.visible || text === '' || hidden) {\n    return 0;\n  }\n  const textPadding = innerPad(style.padding) + outerPad(style.padding);\n  if (param === 'height') {\n    return style.fontSize + textPadding;\n  }\n\n  const textBox = textMeasure(\n    text,\n    {\n      fontFamily: style.fontFamily,\n      fontVariant: 'normal',\n      fontWeight: 'bold',\n      fontStyle: style.fontStyle ?? 'normal',\n    },\n    style.fontSize,\n  );\n  return textBox.width + textPadding;\n}\n\n/** @internal */\nexport function getXAxisSize(\n  isCategoricalScale: boolean,\n  style: HeatmapStyle['xAxisLabel'],\n  formatter: HeatmapSpec['xAxisLabelFormatter'],\n  labels: (string | number)[],\n  textMeasure: TextMeasure,\n  containerWidth: number,\n  surroundingSpace: [left: number, right: number],\n): Size & { right: number; left: number; tickCadence: number; minRotation: Radian } {\n  if (!style.visible) {\n    return {\n      height: 0,\n      width: Math.max(containerWidth - surroundingSpace[0] - surroundingSpace[1], 0),\n      left: surroundingSpace[0],\n      right: surroundingSpace[1],\n      tickCadence: NaN,\n      minRotation: 0,\n    };\n  }\n  const isRotated = style.rotation !== 0;\n  const normalizedScale = scaleBand<NonNullable<PrimitiveValue>>().domain(labels).range([0, 1]);\n\n  const alignment = isRotated ? 'right' : isCategoricalScale ? 'center' : 'left';\n  const alignmentOffset = isCategoricalScale ? normalizedScale.bandwidth() / 2 : 0;\n  const scale = (d: NonNullable<PrimitiveValue>) => (normalizedScale(d) ?? 0) + alignmentOffset;\n\n  // use positive angle from 0 to 90 only\n  const rotationRad = degToRad(style.rotation);\n\n  const measuredLabels = labels.map((label) => ({\n    ...textMeasure(formatter(label), style, style.fontSize),\n    label,\n  }));\n\n  // don't filter ticks if categorical scale or with rotated labels\n  if (isCategoricalScale || isRotated) {\n    const maxLabelBBox = measuredLabels.reduce(\n      (acc, curr) => {\n        return {\n          height: Math.max(acc.height, curr.height),\n          width: Math.max(acc.width, curr.width),\n        };\n      },\n      { height: 0, width: 0 },\n    );\n    const compressedScale = computeCompressedScale(\n      style,\n      scale,\n      measuredLabels,\n      containerWidth,\n      surroundingSpace,\n      alignment,\n      rotationRad,\n    );\n    const scaleStep = compressedScale.width / labels.length;\n    // this optimal rotation is computed on a suboptimal compressed scale, it can be further enhanced with a monotonic hill climber\n    const optimalRotation =\n      scaleStep > maxLabelBBox.width ? 0 : Math.asin(Math.min(maxLabelBBox.height / scaleStep, 1));\n    // if the current requested rotation is not at least bigger then the optimal one, recalculate the compression\n    // using the optimal one forcing the rotation to be without overlaps\n    const { width, height, left, right, minRotation } = {\n      ...(rotationRad !== 0 && optimalRotation > rotationRad\n        ? computeCompressedScale(\n            style,\n            scale,\n            measuredLabels,\n            containerWidth,\n            surroundingSpace,\n            alignment,\n            optimalRotation,\n          )\n        : compressedScale),\n      minRotation: isRotated ? Math.max(optimalRotation, rotationRad) : 0,\n    };\n\n    const validCompression = isFiniteNumber(width);\n    return {\n      height: validCompression ? height : 0,\n      width: validCompression ? width : Math.max(containerWidth - surroundingSpace[0] - surroundingSpace[1], 0),\n      left: validCompression ? left : surroundingSpace[0],\n      right: validCompression ? right : surroundingSpace[1],\n      tickCadence: validCompression ? 1 : NaN,\n      minRotation,\n    };\n  }\n\n  // TODO refactor and move to monotonic hill climber and no mutations\n  // reduce the tick cadence on time scale to avoid overlaps and overflows\n  let tickCadence = 1;\n  let dimension = computeCompressedScale(\n    style,\n    scale,\n    measuredLabels,\n    containerWidth,\n    surroundingSpace,\n    alignment,\n    rotationRad,\n  );\n\n  for (let i = 1; i < measuredLabels.length; i++) {\n    if ((!dimension.overlaps && !dimension.overflow.right) || !isFiniteNumber(dimension.width)) {\n      break;\n    }\n    dimension = computeCompressedScale(\n      style,\n      scale,\n      measuredLabels.filter((_, index) => index % (i + 1) === 0),\n      containerWidth,\n      surroundingSpace,\n      alignment,\n      rotationRad,\n    );\n    tickCadence++;\n  }\n\n  // hide the axis because there is no space for labels\n  if (!isFiniteNumber(dimension.width)) {\n    return {\n      // hide the whole axis\n      height: 0,\n      width: Math.max(containerWidth - surroundingSpace[0] - surroundingSpace[1], 0),\n      left: surroundingSpace[0],\n      right: surroundingSpace[1],\n      // hide all ticks\n      tickCadence: NaN,\n      minRotation: rotationRad,\n    };\n  }\n\n  return {\n    ...dimension,\n    tickCadence,\n    minRotation: rotationRad,\n  };\n}\n\nfunction computeCompressedScale(\n  style: HeatmapStyle['xAxisLabel'],\n  scale: (d: NonNullable<PrimitiveValue>) => number,\n  labels: Array<Size & { label: number | NonNullable<PrimitiveValue> }>,\n  containerWidth: number,\n  surroundingSpace: [number, number],\n  alignment: 'left' | 'right' | 'center',\n  rotation: Radian,\n): Size & { left: number; right: number; overlaps: boolean; overflow: { left: boolean; right: boolean } } {\n  const { itemsPerSideSize, domainPositions, hMax } = labels.reduce<{\n    wMax: number;\n    hMax: number;\n    itemsPerSideSize: [number, number][];\n    domainPositions: number[];\n  }>(\n    (acc, { width, height, label }) => {\n      // rotate the label box coordinates\n      const labelRect: Vec2[] = [\n        [0, 0],\n        [width, 0],\n        [width, height],\n        [0, height],\n      ];\n\n      const rotationOrigin: Vec2 =\n        alignment === 'right' ? [width, height / 2] : alignment === 'left' ? [0, height / 2] : [width / 2, height / 2];\n\n      const rotatedVectors = labelRect.map((vector) => rotate2(rotation, sub2(vector, rotationOrigin)));\n\n      // find the rotated bounding box\n      const x = extent(rotatedVectors.map((v) => v[0]));\n      const y = extent(rotatedVectors.map((v) => v[1]));\n      acc.wMax = Math.max(acc.wMax, Math.abs(x[1] - x[0]));\n      acc.hMax = Math.max(acc.hMax, Math.abs(y[1] - y[0]));\n\n      // describe the item width as the left and right vector size from the rotation origin\n      acc.itemsPerSideSize.push([Math.abs(x[0]), Math.abs(x[1])]);\n\n      // use a categorical scale with labels aligned to the center to compute the domain position\n      const domainPosition = scale(label);\n      acc.domainPositions.push(domainPosition);\n      return acc;\n    },\n    { wMax: -Infinity, hMax: -Infinity, itemsPerSideSize: [], domainPositions: [] },\n  );\n\n  // account for the left and right space (Y axes, overflows etc)\n  const globalDomainPositions = [0, ...domainPositions, 1];\n  const globalItemWidth: [number, number][] = [[surroundingSpace[0], 0], ...itemsPerSideSize, [0, surroundingSpace[1]]];\n\n  const { scaleMultiplier, bounds } = screenspaceMarkerScaleCompressor(\n    globalDomainPositions,\n    globalItemWidth,\n    containerWidth,\n  );\n\n  // check label overlaps using the computed compressed scale\n  const overlaps = itemsPerSideSize.some(([, rightSide], i) => {\n    if (i >= itemsPerSideSize.length - 2) {\n      return false;\n    }\n\n    const currentItemRightSide = (domainPositions[i] ?? 0) * scaleMultiplier + rightSide + pad(style.padding, 'right');\n    const nextItemLeftSize =\n      (domainPositions[i + 1] ?? 0) * scaleMultiplier -\n      (itemsPerSideSize[i + 1]?.[0] ?? 0) -\n      pad(style.padding, 'left');\n    return currentItemRightSide > nextItemLeftSize;\n  });\n\n  const leftMargin = isFiniteNumber(bounds[0])\n    ? (globalItemWidth[bounds[0]]?.[0] ?? 0) - scaleMultiplier * (globalDomainPositions[bounds[0]] ?? 0)\n    : 0;\n  const rightMargin = isFiniteNumber(bounds[1]) ? globalItemWidth[bounds[1]]?.[1] ?? 0 : 0;\n\n  return {\n    // the horizontal space\n    width: scaleMultiplier,\n    right: rightMargin,\n    left: leftMargin,\n    // the height represent the height of the max rotated bbox plus the padding and the vertical position of the rotation origin\n    height: hMax + pad(style.padding, 'top') + style.fontSize / 2,\n    overlaps,\n    overflow: {\n      // true if a label exist protrude to the left making the scale shrink from the left\n      // the current check is based on the way we construct globalItemWidth and globalDomainPositions\n      left: bounds[0] !== 0,\n      // true if a label exist protrude to the right making the scale shrink from the right\n      // the current check is based on the way we construct globalItemWidth and globalDomainPositions\n      right: bounds[1] !== globalDomainPositions.length - 1,\n    },\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/**\n * Available chart types\n * @public\n */\nexport const ChartType = Object.freeze({\n  Global: 'global' as const,\n  Goal: 'goal' as const,\n  Partition: 'partition' as const,\n  Flame: 'flame' as const,\n  Timeslip: 'timeslip' as const,\n  XYAxis: 'xy_axis' as const,\n  Heatmap: 'heatmap' as const,\n  Wordcloud: 'wordcloud' as const,\n  Metric: 'metric' as const,\n  Bullet: 'bullet' as const,\n});\n/** @public */\nexport type ChartType = $Values<typeof ChartType>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* eslint-disable-next-line eslint-comments/disable-enable-pair */\n/* eslint-disable react/no-array-index-key */\n\nimport classNames from 'classnames';\nimport React from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { Metric as MetricComponent } from './metric';\nimport { ColorContrastOptions, combineColors, highContrastColor } from '../../../../common/color_calcs';\nimport { colorToRgba, RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Color } from '../../../../common/colors';\nimport { BasicListener, ElementClickListener, ElementOverListener, settingsBuildProps } from '../../../../specs';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getResolvedBackgroundColorSelector } from '../../../../state/selectors/get_resolved_background_color';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { MetricStyle } from '../../../../utils/themes/theme';\nimport { MetricSpec } from '../../specs';\nimport { chartSize } from '../../state/selectors/chart_size';\nimport { getMetricSpecs } from '../../state/selectors/data';\nimport { hasChartTitles } from '../../state/selectors/has_chart_titles';\n\ninterface StateProps {\n  initialized: boolean;\n  chartId: string;\n  hasTitles: boolean;\n  size: {\n    width: number;\n    height: number;\n  };\n  specs: MetricSpec[];\n  a11y: A11ySettings;\n  style: MetricStyle;\n  backgroundColor: Color;\n  locale: string;\n  onElementClick?: ElementClickListener;\n  onElementOut?: BasicListener;\n  onElementOver?: ElementOverListener;\n}\n\ninterface DispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\nclass Component extends React.Component<StateProps & DispatchProps> {\n  static displayName = 'Metric';\n  componentDidMount() {\n    this.props.onChartRendered();\n  }\n\n  componentDidUpdate() {\n    this.props.onChartRendered();\n  }\n\n  render() {\n    const {\n      chartId,\n      hasTitles,\n      initialized,\n      size: { width, height },\n      a11y,\n      specs: [spec], // ignoring other specs\n      style,\n      backgroundColor,\n      onElementClick,\n      onElementOut,\n      onElementOver,\n      locale,\n    } = this.props;\n    if (!initialized || !spec || width === 0 || height === 0) {\n      return null;\n    }\n\n    const { data } = spec;\n\n    const totalRows = data.length;\n    const maxColumns = data.reduce((acc, row) => {\n      return Math.max(acc, row.length);\n    }, 0);\n\n    const panel = { width: width / maxColumns, height: height / totalRows };\n    const contrastOptions: ColorContrastOptions = {\n      lightColor: colorToRgba(style.text.lightColor),\n      darkColor: colorToRgba(style.text.darkColor),\n    };\n\n    const emptyBackgroundRGBA = combineColors(colorToRgba(style.emptyBackground), colorToRgba(backgroundColor));\n    const emptyBackground = RGBATupleToString(emptyBackgroundRGBA);\n    const { color: emptyForegroundColor } = highContrastColor(emptyBackgroundRGBA, undefined, contrastOptions);\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-redundant-roles\n      <ul\n        role=\"list\"\n        className=\"echMetricContainer\"\n        aria-labelledby={a11y.labelId}\n        aria-describedby={a11y.descriptionId}\n        style={{\n          gridTemplateColumns: `repeat(${maxColumns}, minmax(0, 1fr)`,\n          gridTemplateRows: `repeat(${totalRows}, minmax(${style.minHeight}px, 1fr)`,\n        }}\n      >\n        {data.flatMap((columns, rowIndex) => {\n          return [\n            ...columns.map((datum, columnIndex) => {\n              // fill undefined with empty panels\n              const emptyMetricClassName = classNames('echMetric', {\n                'echMetric--rightBorder': columnIndex < maxColumns - 1,\n                'echMetric--bottomBorder': rowIndex < totalRows - 1,\n                'echMetric--topBorder': hasTitles && rowIndex === 0,\n              });\n              return !datum ? (\n                <li key={`${columnIndex}-${rowIndex}`} role=\"presentation\">\n                  <div\n                    className={emptyMetricClassName}\n                    style={{ borderColor: style.border, backgroundColor: emptyBackground }}\n                  >\n                    <div className=\"echMetricEmpty\" style={{ borderColor: emptyForegroundColor.keyword }}></div>\n                  </div>\n                </li>\n              ) : (\n                <li key={`${columnIndex}-${rowIndex}`}>\n                  <MetricComponent\n                    chartId={chartId}\n                    hasTitles={hasTitles}\n                    datum={datum}\n                    totalRows={totalRows}\n                    totalColumns={maxColumns}\n                    rowIndex={rowIndex}\n                    columnIndex={columnIndex}\n                    panel={panel}\n                    style={style}\n                    backgroundColor={backgroundColor}\n                    contrastOptions={contrastOptions}\n                    onElementClick={onElementClick}\n                    onElementOut={onElementOut}\n                    onElementOver={onElementOver}\n                    locale={locale}\n                  />\n                </li>\n              );\n            }),\n            // fill the grid row with empty panels\n            ...Array.from({ length: maxColumns - columns.length }, (_, zeroBasedColumnIndex) => {\n              const columnIndex = zeroBasedColumnIndex + columns.length;\n              const emptyMetricClassName = classNames('echMetric', {\n                'echMetric--bottomBorder': rowIndex < totalRows - 1,\n                'echMetric--topBorder': hasTitles && rowIndex === 0,\n              });\n              return (\n                <li key={`missing-${columnIndex}-${rowIndex}`} role=\"presentation\">\n                  <div\n                    className={emptyMetricClassName}\n                    style={{ borderColor: style.border, backgroundColor: emptyBackground }}\n                  ></div>\n                </li>\n              );\n            }),\n          ];\n        })}\n      </ul>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: StateProps = {\n  initialized: false,\n  chartId: '',\n  hasTitles: false,\n  specs: [],\n  size: {\n    width: 0,\n    height: 0,\n  },\n  a11y: DEFAULT_A11Y_SETTINGS,\n  style: LIGHT_THEME.metric,\n  backgroundColor: LIGHT_THEME.background.color,\n  locale: settingsBuildProps.defaults.locale,\n};\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  const { onElementClick, onElementOut, onElementOver, locale } = getSettingsSpecSelector(state);\n  const { metric: style } = getChartThemeSelector(state);\n  return {\n    initialized: true,\n    chartId: state.chartId,\n    hasTitles: hasChartTitles(state),\n    specs: getMetricSpecs(state),\n    size: chartSize(state),\n    a11y: getA11ySettingsSelector(state),\n    onElementClick,\n    onElementOver,\n    onElementOut,\n    backgroundColor: getResolvedBackgroundColorSelector(state),\n    style,\n    locale,\n  };\n};\n\n/** @internal */\nexport const Metric = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { CSSProperties, useState } from 'react';\n\nimport { ProgressBar } from './progress';\nimport { SparkLine, getSparkLineColor } from './sparkline';\nimport { MetricText } from './text';\nimport { ColorContrastOptions, combineColors } from '../../../../common/color_calcs';\nimport { RGBATupleToString, changeColorLightness, colorToRgba } from '../../../../common/color_library_wrappers';\nimport { Color } from '../../../../common/colors';\nimport { DEFAULT_CSS_CURSOR } from '../../../../common/constants';\nimport { fillTextColor } from '../../../../common/fill_text_color';\nimport {\n  BasicListener,\n  ElementClickListener,\n  ElementOverListener,\n  MetricDatum,\n  MetricElementEvent,\n} from '../../../../specs';\nimport { LayoutDirection, isNil } from '../../../../utils/common';\nimport { Size } from '../../../../utils/dimensions';\nimport { MetricStyle } from '../../../../utils/themes/theme';\nimport { MetricWNumber, isMetricWProgress, isMetricWTrend } from '../../specs';\n\n/** @internal */\nexport const Metric: React.FunctionComponent<{\n  chartId: string;\n  hasTitles: boolean;\n  rowIndex: number;\n  columnIndex: number;\n  totalColumns: number;\n  totalRows: number;\n  datum: MetricDatum;\n  panel: Size;\n  style: MetricStyle;\n  backgroundColor: Color;\n  contrastOptions: ColorContrastOptions;\n  locale: string;\n  onElementClick?: ElementClickListener;\n  onElementOver?: ElementOverListener;\n  onElementOut?: BasicListener;\n}> = ({\n  chartId,\n  hasTitles,\n  rowIndex,\n  columnIndex,\n  totalColumns,\n  totalRows,\n  datum,\n  panel,\n  style,\n  backgroundColor: chartBackgroundColor,\n  contrastOptions,\n  locale,\n  onElementClick,\n  onElementOver,\n  onElementOut,\n}) => {\n  const progressBarSize = 'small'; // currently we provide only the small progress bar;\n  const [mouseState, setMouseState] = useState<'leave' | 'enter' | 'down'>('leave');\n  const [lastMouseDownTimestamp, setLastMouseDownTimestamp] = useState<number>(0);\n  const metricHTMLId = `echMetric-${chartId}-${rowIndex}-${columnIndex}`;\n  const hasProgressBar = isMetricWProgress(datum);\n  const progressBarDirection = hasProgressBar ? datum.progressBarDirection : undefined;\n\n  const containerClassName = classNames('echMetric', {\n    'echMetric--rightBorder': columnIndex < totalColumns - 1,\n    'echMetric--bottomBorder': rowIndex < totalRows - 1,\n    'echMetric--topBorder': hasTitles && rowIndex === 0,\n    'echMetric--vertical': progressBarDirection === LayoutDirection.Vertical,\n    'echMetric--horizontal': progressBarDirection === LayoutDirection.Horizontal,\n    [`echMetric--withProgressBar--${progressBarSize}`]: hasProgressBar,\n    [`echMetric--withTargetProgressBar--${progressBarSize}`]: !isNil((datum as MetricWNumber)?.target),\n  });\n\n  const lightnessAmount = mouseState === 'leave' ? 0 : mouseState === 'enter' ? 0.05 : 0.1;\n\n  const backgroundColor = datum.background\n    ? RGBATupleToString(combineColors(colorToRgba(datum.background), colorToRgba(chartBackgroundColor)))\n    : chartBackgroundColor;\n  const blendingBackgroundColor = !style.blendingBackground\n    ? colorToRgba(backgroundColor)\n    : combineColors(colorToRgba(style.blendingBackground), colorToRgba(backgroundColor));\n  const interactionColor = changeColorLightness(hasProgressBar ? backgroundColor : datum.color, lightnessAmount, 0.8);\n  const blendedColor = RGBATupleToString(combineColors(colorToRgba(datum.color), blendingBackgroundColor));\n  const blendedInteractionColor = RGBATupleToString(\n    combineColors(colorToRgba(interactionColor), blendingBackgroundColor),\n  );\n\n  const datumWithInteractionColor: MetricDatum = {\n    ...datum,\n    color: blendedInteractionColor,\n  };\n\n  const event: MetricElementEvent = { type: 'metricElementEvent', rowIndex, columnIndex };\n\n  const containerStyle: CSSProperties = {\n    backgroundColor: isMetricWTrend(datumWithInteractionColor) ? backgroundColor : datumWithInteractionColor.color,\n    cursor: onElementClick ? 'pointer' : DEFAULT_CSS_CURSOR,\n    borderColor: style.border,\n  };\n\n  const highContrastTextColor = fillTextColor(\n    backgroundColor,\n    isMetricWProgress(datum) ? backgroundColor : blendedColor,\n    undefined,\n    contrastOptions,\n  );\n  let finalTextColor = highContrastTextColor.color;\n\n  if (isMetricWTrend(datum)) {\n    const { ratio, color, shade } = fillTextColor(\n      backgroundColor,\n      getSparkLineColor(blendedColor),\n      undefined,\n      contrastOptions,\n    );\n\n    // TODO verify this check is applied correctly\n    if (shade !== highContrastTextColor.shade && ratio > highContrastTextColor.ratio) {\n      finalTextColor = color;\n    }\n  }\n\n  const onElementClickHandler = () => onElementClick && onElementClick([event]);\n\n  return (\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions,jsx-a11y/click-events-have-key-events\n    <div\n      role=\"figure\"\n      aria-labelledby={datum.title && metricHTMLId}\n      className={containerClassName}\n      style={containerStyle}\n      onMouseLeave={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('leave');\n        if (onElementOut) onElementOut();\n      }}\n      onMouseEnter={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('enter');\n        if (onElementOver) onElementOver([event]);\n      }}\n      onMouseDown={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('down');\n        setLastMouseDownTimestamp(Date.now());\n      }}\n      onMouseUp={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('enter');\n        if (Date.now() - lastMouseDownTimestamp < 200 && onElementClick) {\n          onElementClickHandler();\n        }\n      }}\n      onFocus={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('enter');\n      }}\n      onBlur={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('leave');\n      }}\n      onClick={(e) => {\n        e.stopPropagation();\n      }}\n    >\n      <MetricText\n        id={metricHTMLId}\n        datum={datumWithInteractionColor}\n        panel={panel}\n        style={style}\n        onElementClick={onElementClick ? onElementClickHandler : undefined}\n        progressBarSize={progressBarSize}\n        highContrastTextColor={finalTextColor.keyword}\n        locale={locale}\n      />\n      {isMetricWTrend(datumWithInteractionColor) && <SparkLine id={metricHTMLId} datum={datumWithInteractionColor} />}\n      {isMetricWProgress(datumWithInteractionColor) && (\n        <ProgressBar\n          datum={datumWithInteractionColor}\n          barBackground={style.barBackground}\n          blendedBarColor={blendedColor}\n          size={progressBarSize}\n        />\n      )}\n      <div className=\"echMetric--outline\" style={{ color: finalTextColor.keyword }}></div>\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport { scaleLinear } from 'd3-scale';\nimport React from 'react';\n\nimport { Color } from '../../../../common/colors';\nimport { Icon } from '../../../../components/icons/icon';\nimport { isNil, LayoutDirection, sortNumbers } from '../../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../../utils/domain';\nimport { BulletMetricWProgress, isBulletMetric, MetricWProgress } from '../../specs';\n\nconst TARGET_SIZE = 8;\nconst BASELINE_SIZE = 2;\n\ninterface ProgressBarProps {\n  datum: MetricWProgress | BulletMetricWProgress;\n  barBackground: Color;\n  blendedBarColor: Color;\n  size: 'small';\n}\n\n/** @internal */\nexport const ProgressBar: React.FunctionComponent<ProgressBarProps> = ({\n  datum,\n  barBackground,\n  blendedBarColor,\n  size,\n}) => {\n  const { title, value, target, valueFormatter, targetFormatter, progressBarDirection } = datum;\n  const isBullet = isBulletMetric(datum);\n  const isVertical = progressBarDirection === LayoutDirection.Vertical;\n  const domain: GenericDomain = isBulletMetric(datum) ? datum.domain : [0, datum.domainMax];\n  // TODO clamp and round values\n  const scale = scaleLinear().domain(domain).range([0, 100]);\n\n  if (isBulletMetric(datum) && datum.niceDomain) {\n    scale.nice();\n  }\n\n  const updatedDomain = scale.domain() as GenericDomain;\n  const [domainMin, domainMax] = sortNumbers(updatedDomain) as ContinuousDomain;\n  const scaledValue = scale(value);\n  const [min, max] = sortNumbers([scale(0), scaledValue]);\n  const positionStyle = isVertical\n    ? {\n        bottom: `${min}%`,\n        top: `${100 - max}%`,\n      }\n    : {\n        left: `${min}%`,\n        right: `${100 - max}%`,\n      };\n\n  const targetPlacement = isNil(target) ? null : `calc(${scale(target)}% - ${TARGET_SIZE / 2}px)`;\n  const zeroPlacement = domainMin >= 0 || domainMax <= 0 ? null : `calc(${scale(0)}% - ${BASELINE_SIZE / 2}px)`;\n  const labelType = isBullet ? 'Value' : 'Percentage';\n\n  return (\n    <div\n      className={getDirectionalClasses('Progress', isVertical, size)}\n      style={{ backgroundColor: size === 'small' ? barBackground : undefined }}\n      title={!isBullet ? '' : `${updatedDomain[0]} to ${updatedDomain[1]}`}\n    >\n      {targetPlacement && (\n        <div\n          className={getDirectionalClasses('Target', isVertical, size)}\n          style={{\n            [isVertical ? 'bottom' : 'left']: targetPlacement,\n          }}\n          aria-valuenow={target}\n          title={`${isBullet ? `${datum.valueLabels.target}: ` : ''}${(targetFormatter ?? valueFormatter)(\n            target || 0,\n          )}`}\n        >\n          <Icon height={TARGET_SIZE} width={TARGET_SIZE} type=\"downArrow\" color={blendedBarColor} />\n        </div>\n      )}\n      {zeroPlacement && (\n        <div\n          className={getDirectionalClasses('ZeroBaseline', isVertical, size)}\n          style={{\n            backgroundColor: blendedBarColor,\n            [isVertical ? 'bottom' : 'left']: zeroPlacement,\n          }}\n        />\n      )}\n      <div\n        className={getDirectionalClasses('ProgressBar', isVertical, size)}\n        style={{ ...positionStyle, backgroundColor: blendedBarColor }}\n        role=\"meter\"\n        title={isBullet ? `${datum.valueLabels.value}: ${valueFormatter(value)}` : `${scaledValue}%`}\n        aria-label={title ? `${labelType} of ${title}` : labelType}\n        aria-valuemin={isBullet ? domainMin : 0}\n        aria-valuemax={isBullet ? domainMax : 100}\n        aria-valuenow={isBullet ? value : scaledValue}\n      />\n    </div>\n  );\n};\n\nfunction getDirectionalClasses(element: string, isVertical: boolean, size: ProgressBarProps['size']) {\n  const base = `echSingleMetric${element}`;\n  return classNames(base, `${base}--${size}`, {\n    [`${base}--vertical`]: isVertical,\n    [`${base}--horizontal`]: !isVertical,\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { FunctionComponent } from 'react';\n\nimport { colorToHsl, hslToColor } from '../../../../common/color_library_wrappers';\nimport { extent } from '../../../../common/math';\nimport { areaGenerator } from '../../../../geoms/path';\nimport { isFiniteNumber } from '../../../../utils/common';\nimport { CurveType } from '../../../../utils/curves';\nimport { MetricTrendShape, MetricWTrend } from '../../specs';\n\n/** @internal */\nexport const getSparkLineColor = (color: MetricWTrend['color']) => {\n  const [h, s, l, a] = colorToHsl(color);\n  return hslToColor(h, s, l >= 0.8 ? l - 0.1 : l + 0.1, a);\n};\n\n/** @internal */\nexport const SparkLine: FunctionComponent<{\n  id: string;\n  datum: MetricWTrend;\n}> = ({ id, datum: { color, trend, trendA11yTitle, trendA11yDescription, trendShape } }) => {\n  if (!trend) {\n    return null;\n  }\n  const [xMin, xMax] = extent(trend.map((d) => d.x));\n  const [, yMax] = extent(trend.map((d) => d.y));\n  const xScale = (value: number) => (value - xMin) / (xMax - xMin);\n  const yScale = (value: number) => value / yMax;\n\n  const path = areaGenerator<{ x: number; y: number }>(\n    (d) => xScale(d.x),\n    () => 1,\n    (d) => 1 - yScale(d.y),\n    (d) => isFiniteNumber(d.x) && isFiniteNumber(d.y),\n    trendShape === MetricTrendShape.Bars ? CurveType.CURVE_STEP_AFTER : CurveType.LINEAR,\n  );\n\n  const titleId = `${id}-trend-title`;\n  const descriptionId = `${id}-trend-description`;\n  return (\n    <div className=\"echSingleMetricSparkline\">\n      <svg\n        className=\"echSingleMetricSparkline__svg\"\n        width=\"100%\"\n        height=\"100%\"\n        viewBox=\"0 0 1 1\"\n        preserveAspectRatio=\"none\"\n        role=\"img\"\n        aria-labelledby={`${titleId} ${descriptionId}`}\n      >\n        <title id={titleId} className=\"echScreenReaderOnly\">\n          {trendA11yTitle}\n        </title>\n        <text id={descriptionId} className=\"echScreenReaderOnly\" fontSize={0}>\n          {trendA11yDescription}\n        </text>\n\n        <rect x={0} y={0} width={1} height={1} fill={color} />\n\n        <path\n          d={path.area(trend)}\n          transform=\"translate(0, 0.5),scale(1,0.5)\"\n          fill={getSparkLineColor(color)}\n          stroke=\"none\"\n          strokeWidth={0}\n        />\n      </svg>\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { CSSProperties } from 'react';\n\nimport { Color } from '../../../../common/colors';\nimport { DEFAULT_FONT_FAMILY } from '../../../../common/default_theme_attributes';\nimport { Font } from '../../../../common/text_utils';\nimport { TextMeasure, withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isFiniteNumber, LayoutDirection, renderWithProps } from '../../../../utils/common';\nimport { Size } from '../../../../utils/dimensions';\nimport { wrapText } from '../../../../utils/text/wrap';\nimport { MetricStyle } from '../../../../utils/themes/theme';\nimport { isMetricWNumber, isMetricWProgress, MetricDatum } from '../../specs';\n\ntype BreakPoint = 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';\n\nconst WIDTH_BP: [number, number, BreakPoint][] = [\n  [0, 180, 's'],\n  [180, 250, 'm'],\n  [250, 600, 'l'],\n  [600, 1000, 'xl'],\n  [1000, 2000, 'xxl'],\n  [2000, Infinity, 'xxxl'],\n];\n\nconst PADDING = 8;\nconst LINE_HEIGHT = 1.2; // aligned with our CSS\nconst ICON_SIZE: Record<BreakPoint, number> = { s: 16, m: 16, l: 24, xl: 36, xxl: 44, xxxl: 64 };\nconst TITLE_FONT_SIZE: Record<BreakPoint, number> = { s: 12, m: 16, l: 16, xl: 24, xxl: 32, xxxl: 42 };\nconst SUBTITLE_FONT_SIZE: Record<BreakPoint, number> = { s: 10, m: 14, l: 14, xl: 20, xxl: 26, xxxl: 26 };\nconst EXTRA_FONT_SIZE: Record<BreakPoint, number> = { s: 10, m: 14, l: 14, xl: 20, xxl: 26, xxxl: 26 };\nconst VALUE_FONT_SIZE: Record<BreakPoint, number> = { s: 22, m: 27, l: 34, xl: 56, xxl: 88, xxxl: 140 };\nconst VALUE_PART_FONT_SIZE: Record<BreakPoint, number> = { s: 16, m: 20, l: 24, xl: 40, xxl: 68, xxxl: 110 };\n\nconst TITLE_FONT: Font = {\n  fontStyle: 'normal',\n  fontFamily: DEFAULT_FONT_FAMILY,\n  fontVariant: 'normal',\n  fontWeight: 'bold',\n  textColor: 'black',\n};\nconst SUBTITLE_FONT: Font = {\n  ...TITLE_FONT,\n  fontWeight: 'normal',\n};\n\nfunction findRange(ranges: [number, number, BreakPoint][], value: number): BreakPoint {\n  const range = ranges.find(([min, max]) => min <= value && value < max);\n  return range ? range[2] : ranges[0]?.[2] ?? 's';\n}\n\ntype ElementVisibility = {\n  titleMaxLines: number;\n  subtitleMaxLines: number;\n  title: boolean;\n  subtitle: boolean;\n  extra: boolean;\n};\n\nfunction elementVisibility(\n  datum: MetricDatum,\n  panel: Size,\n  size: BreakPoint,\n  locale: string,\n): ElementVisibility & { titleLines: string[]; subtitleLines: string[] } {\n  const LEFT_RIGHT_PADDING = 16;\n  const maxTitlesWidth = (size === 's' ? 1 : 0.8) * panel.width - (datum.icon ? 24 : 0) - LEFT_RIGHT_PADDING;\n\n  const titleHeight = (maxLines: number, textMeasure: TextMeasure) => {\n    return datum.title\n      ? PADDING +\n          wrapText(datum.title, TITLE_FONT, TITLE_FONT_SIZE[size], maxTitlesWidth, maxLines, textMeasure, locale)\n            .length *\n            TITLE_FONT_SIZE[size] *\n            LINE_HEIGHT\n      : 0;\n  };\n\n  const subtitleHeight = (maxLines: number, textMeasure: TextMeasure) => {\n    return datum.subtitle\n      ? PADDING +\n          wrapText(\n            datum.subtitle,\n            SUBTITLE_FONT,\n            SUBTITLE_FONT_SIZE[size],\n            maxTitlesWidth,\n            maxLines,\n            textMeasure,\n            locale,\n          ).length *\n            SUBTITLE_FONT_SIZE[size] *\n            LINE_HEIGHT\n      : 0;\n  };\n\n  const extraHeight = EXTRA_FONT_SIZE[size] * LINE_HEIGHT;\n  const valueHeight = VALUE_FONT_SIZE[size] * LINE_HEIGHT + PADDING;\n\n  const responsiveBreakPoints: Array<ElementVisibility> = [\n    { titleMaxLines: 3, subtitleMaxLines: 2, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },\n    { titleMaxLines: 3, subtitleMaxLines: 1, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },\n    { titleMaxLines: 2, subtitleMaxLines: 1, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },\n    { titleMaxLines: 1, subtitleMaxLines: 1, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },\n    { titleMaxLines: 1, subtitleMaxLines: 0, title: !!datum.title, subtitle: false, extra: !!datum.extra },\n    { titleMaxLines: 1, subtitleMaxLines: 0, title: !!datum.title, subtitle: false, extra: false },\n    { titleMaxLines: 1, subtitleMaxLines: 0, title: !!datum.title, subtitle: false, extra: false },\n  ];\n\n  const isVisible = (\n    { titleMaxLines, subtitleMaxLines, title, subtitle, extra }: ElementVisibility,\n    measure: TextMeasure,\n  ) =>\n    (title && titleMaxLines > 0 ? titleHeight(titleMaxLines, measure) : 0) +\n      (subtitle && subtitleMaxLines > 0 ? subtitleHeight(subtitleMaxLines, measure) : 0) +\n      (extra ? extraHeight : 0) +\n      valueHeight <\n    panel.height;\n\n  return withTextMeasure((textMeasure) => {\n    const visibilityBreakpoint =\n      responsiveBreakPoints.find((breakpoint) => isVisible(breakpoint, textMeasure)) ?? responsiveBreakPoints.at(-1)!;\n    return {\n      ...visibilityBreakpoint,\n      titleLines: wrapText(\n        datum.title ?? '',\n        TITLE_FONT,\n        TITLE_FONT_SIZE[size],\n        maxTitlesWidth,\n        visibilityBreakpoint.titleMaxLines,\n        textMeasure,\n        locale,\n      ),\n      subtitleLines: wrapText(\n        datum.subtitle ?? '',\n        SUBTITLE_FONT,\n        SUBTITLE_FONT_SIZE[size],\n        maxTitlesWidth,\n        visibilityBreakpoint.subtitleMaxLines,\n        textMeasure,\n        locale,\n      ),\n    };\n  });\n}\n\nfunction lineClamp(maxLines: number): CSSProperties {\n  return {\n    textOverflow: 'ellipsis',\n    display: '-webkit-box',\n    WebkitLineClamp: maxLines, // due to an issue with react CSSProperties filtering out this line, see https://github.com/facebook/react/issues/23033\n    lineClamp: maxLines,\n    WebkitBoxOrient: 'vertical',\n    overflow: 'hidden',\n  };\n}\n\n/** @internal */\nexport const MetricText: React.FunctionComponent<{\n  id: string;\n  datum: MetricDatum;\n  panel: Size;\n  style: MetricStyle;\n  onElementClick?: () => void;\n  highContrastTextColor: Color;\n  progressBarSize: 'small';\n  locale: string;\n}> = ({ id, datum, panel, style, onElementClick, highContrastTextColor, progressBarSize, locale }) => {\n  const { extra, value, body } = datum;\n\n  const size = findRange(WIDTH_BP, panel.width);\n  const hasProgressBar = isMetricWProgress(datum);\n  const progressBarDirection = isMetricWProgress(datum) ? datum.progressBarDirection : undefined;\n  const containerClassName = classNames('echMetricText', {\n    [`echMetricText--${progressBarSize}`]: hasProgressBar,\n    'echMetricText--vertical': progressBarDirection === LayoutDirection.Vertical,\n    'echMetricText--horizontal': progressBarDirection === LayoutDirection.Horizontal,\n  });\n\n  const visibility = elementVisibility(datum, panel, size, locale);\n\n  const titleWidthMaxSize = size === 's' ? '100%' : '80%';\n  const titlesWidth = `min(${titleWidthMaxSize}, calc(${titleWidthMaxSize} - ${datum.icon ? '24px' : '0px'}))`;\n\n  const isNumericalMetric = isMetricWNumber(datum);\n  const textParts = isNumericalMetric\n    ? isFiniteNumber(value)\n      ? splitNumericSuffixPrefix(datum.valueFormatter(value))\n      : [{ emphasis: 'normal', text: style.nonFiniteText }]\n    : [{ emphasis: 'normal', text: datum.value }];\n  const TitleElement = () => (\n    <span\n      style={{\n        fontSize: `${TITLE_FONT_SIZE[size]}px`,\n        whiteSpace: 'pre-wrap',\n        width: titlesWidth,\n        ...lineClamp(visibility.titleLines.length),\n      }}\n      title={datum.title}\n    >\n      {datum.title}\n    </span>\n  );\n  return (\n    <div className={containerClassName} style={{ color: highContrastTextColor }}>\n      <div>\n        {visibility.title && (\n          <h2 id={id} className=\"echMetricText__title\">\n            {onElementClick ? (\n              <button\n                onMouseDown={(e) => e.stopPropagation()}\n                onMouseUp={(e) => e.stopPropagation()}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  onElementClick();\n                }}\n              >\n                <TitleElement />\n              </button>\n            ) : (\n              <TitleElement />\n            )}\n          </h2>\n        )}\n        {datum.icon && (\n          <div className=\"echMetricText__icon\">\n            {renderWithProps(datum.icon, {\n              width: ICON_SIZE[size],\n              height: ICON_SIZE[size],\n              color: highContrastTextColor,\n            })}\n          </div>\n        )}\n      </div>\n      <div>\n        {visibility.subtitle && (\n          <p\n            className=\"echMetricText__subtitle\"\n            style={{\n              fontSize: `${SUBTITLE_FONT_SIZE[size]}px`,\n              width: titlesWidth,\n              whiteSpace: 'pre-wrap',\n              ...lineClamp(visibility.subtitleLines.length),\n            }}\n            title={datum.subtitle}\n          >\n            {datum.subtitle}\n          </p>\n        )}\n      </div>\n      <div className=\"echMetricText__gap\">{body && <div className=\"echMetricText__body\">{body}</div>}</div>\n      <div>\n        {visibility.extra && (\n          <p className=\"echMetricText__extra\" style={{ fontSize: `${EXTRA_FONT_SIZE[size]}px` }}>\n            {extra}\n          </p>\n        )}\n      </div>\n      <div>\n        <p\n          className=\"echMetricText__value\"\n          style={{\n            fontSize: `${VALUE_FONT_SIZE[size]}px`,\n            textOverflow: isNumericalMetric ? undefined : 'ellipsis',\n            marginRight: datum.valueIcon ? ICON_SIZE[size] + 8 : undefined,\n            color: datum.valueColor,\n          }}\n          title={textParts.map(({ text }) => text).join('')}\n        >\n          {textParts.map(({ emphasis, text }, i) => {\n            return emphasis === 'small' ? (\n              <span\n                key={`${text}${i}`}\n                className=\"echMetricText__part\"\n                style={{ fontSize: `${VALUE_PART_FONT_SIZE[size]}px` }}\n              >\n                {text}\n              </span>\n            ) : (\n              text\n            );\n          })}\n        </p>\n        {datum.valueIcon && (\n          <p\n            className=\"echMetricText__valueIcon\"\n            style={{ fontSize: `${VALUE_FONT_SIZE[size]}px`, color: datum.valueColor ?? highContrastTextColor }}\n          >\n            {renderWithProps(datum.valueIcon, {\n              width: VALUE_PART_FONT_SIZE[size],\n              height: VALUE_PART_FONT_SIZE[size],\n              color: datum.valueColor ?? highContrastTextColor,\n              verticalAlign: 'middle',\n            })}\n          </p>\n        )}\n      </div>\n    </div>\n  );\n};\n\nfunction splitNumericSuffixPrefix(text: string): { emphasis: 'normal' | 'small'; text: string }[] {\n  return text\n    .split('')\n    .reduce<{ emphasis: 'normal' | 'small'; textParts: string[] }[]>((acc, curr) => {\n      const emphasis = curr === '.' || curr === ',' || isFiniteNumber(Number.parseInt(curr)) ? 'normal' : 'small';\n      if (acc.length > 0 && acc.at(-1)?.emphasis === emphasis) {\n        acc.at(-1)?.textParts.push(curr);\n      } else {\n        acc.push({ emphasis, textParts: [curr] });\n      }\n      return acc;\n    }, [])\n    .map(({ emphasis, textParts }) => ({\n      emphasis,\n      text: textParts.join(''),\n    }));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps, ComponentType, ReactElement, ReactNode } from 'react';\nimport { $Values } from 'utility-types';\n\nimport { ChartType } from '../..';\nimport { Color } from '../../../common/colors';\nimport { Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { specComponentFactory } from '../../../state/spec_factory';\nimport { LayoutDirection, ValueFormatter } from '../../../utils/common';\nimport { GenericDomain } from '../../../utils/domain';\nimport { BulletValueLabels } from '../../bullet_graph/spec';\n\n/** @alpha */\nexport type MetricBase = {\n  color: Color;\n  /**\n   * Overrides background color from `Theme.background` and `Theme.metric.emptyBackground`\n   */\n  background?: Color;\n  title?: string;\n  valueColor?: Color;\n  valueIcon?: ComponentType<{ width: number; height: number; color: Color; verticalAlign: 'middle' }>;\n  subtitle?: string;\n  extra?: ReactElement;\n  icon?: ComponentType<{ width: number; height: number; color: Color }>;\n  body?: ReactNode;\n};\n\n/** @alpha */\nexport type MetricWText = MetricBase & {\n  value: string;\n};\n\n/** @alpha */\nexport type MetricWNumber = MetricBase & {\n  value: number;\n  target?: number;\n  valueFormatter: ValueFormatter;\n  /**\n   * Used for header display only, defaults to `valueFormatter`\n   */\n  targetFormatter?: ValueFormatter;\n};\n\n/** @alpha */\nexport type MetricWProgress = MetricWNumber & {\n  domainMax: number;\n  progressBarDirection: LayoutDirection;\n};\n\n/**\n * Type used internally by bullet\n * TODO - discuss usage of this externally\n *\n * @internal\n */\nexport type BulletMetricWProgress = Omit<MetricWProgress, 'domainMax'> & {\n  domain: GenericDomain;\n  niceDomain?: boolean;\n  valueLabels: Omit<BulletValueLabels, 'active'>;\n};\n\n/** @alpha */\nexport const MetricTrendShape = Object.freeze({\n  Bars: 'bars' as const,\n  Area: 'area' as const,\n});\n\n/** @alpha */\nexport type MetricTrendShape = $Values<typeof MetricTrendShape>;\n\n/** @alpha */\nexport type MetricWTrend = (MetricWNumber | MetricWText) & {\n  trend: { x: number; y: number }[];\n  trendShape: MetricTrendShape;\n  trendA11yTitle?: string;\n  trendA11yDescription?: string;\n};\n\n/** @alpha */\nexport type MetricDatum = MetricWNumber | MetricWText | MetricWProgress | MetricWTrend;\n\n/** @alpha */\nexport interface MetricSpec extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Metric;\n  data: (MetricDatum | undefined)[][];\n}\n\n/** @alpha */\nexport const Metric = specComponentFactory<MetricSpec>()(\n  {\n    chartType: ChartType.Metric,\n    specType: SpecType.Series,\n  },\n  {\n    data: [],\n  },\n);\n\n/** @alpha */\nexport type MetricSpecProps = ComponentProps<typeof Metric>;\n\n/** @internal */\nexport function isBulletMetric(datum: MetricDatum): datum is BulletMetricWProgress {\n  return Array.isArray((datum as BulletMetricWProgress).domain);\n}\n\n/** @internal */\nexport function isMetricWNumber(datum: MetricDatum): datum is MetricWNumber {\n  return typeof datum.value === 'number' && datum.hasOwnProperty('valueFormatter');\n}\n/** @internal */\nexport function isMetricWText(datum: MetricDatum): datum is MetricWNumber {\n  return typeof datum.value === 'string';\n}\n\n/** @internal */\nexport function isMetricWProgress(datum: MetricDatum): datum is MetricWProgress {\n  return (\n    (isMetricWNumber(datum) && datum.hasOwnProperty('domainMax') && !datum.hasOwnProperty('trend')) ||\n    isBulletMetric(datum)\n  );\n}\n\n/** @internal */\nexport function isMetricWTrend(datum: MetricDatum): datum is MetricWTrend {\n  return (\n    (isMetricWNumber(datum) || isMetricWText(datum)) &&\n    datum.hasOwnProperty('trend') &&\n    !datum.hasOwnProperty('domainMax')\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { canDisplayChartTitles } from './selectors/can_display_chart_titles';\nimport { ChartType } from '../..';\nimport { DEFAULT_CSS_CURSOR } from '../../../common/constants';\nimport { LegendItem } from '../../../common/legend';\nimport { GlobalChartState, InternalChartState } from '../../../state/chart_state';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { LegendItemLabel } from '../../../state/selectors/get_legend_items_labels';\nimport { Metric } from '../renderer/dom';\n\nconst EMPTY_MAP = new Map();\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\nconst EMPTY_LEGEND_ITEM_LIST: LegendItemLabel[] = [];\n\n/** @internal */\nexport class MetricState implements InternalChartState {\n  chartType = ChartType.Metric;\n  getChartTypeDescription = () => 'Metric chart';\n  chartRenderer = () => <Metric />;\n  isInitialized = () => InitStatus.Initialized;\n  isBrushAvailable = () => false;\n  isBrushing = () => false;\n  isChartEmpty = () => false;\n  getLegendItems = () => EMPTY_LEGEND_LIST;\n  getLegendItemsLabels = () => EMPTY_LEGEND_ITEM_LIST;\n  getLegendExtraValues = () => EMPTY_MAP;\n  getPointerCursor = () => DEFAULT_CSS_CURSOR;\n  isTooltipVisible = () => ({\n    visible: false,\n    isExternal: false,\n    displayOnly: false,\n    isPinnable: false,\n  });\n\n  getTooltipInfo = () => undefined;\n  getTooltipAnchor = () => null;\n  eventCallbacks = () => {};\n  getProjectionContainerArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getMainProjectionArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getBrushArea = () => null;\n  getDebugState = () => ({});\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles(globalState: GlobalChartState) {\n    return canDisplayChartTitles(globalState);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getMetricSpecs } from './data';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const canDisplayChartTitles = createCustomCachedSelector([getMetricSpecs], ([spec]): boolean => {\n  return (spec?.data?.length ?? 0) > 1 || (spec?.data?.[0]?.length ?? 0) > 1;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { Dimensions } from '../../../../utils/dimensions';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const chartSize = createCustomCachedSelector([getParentDimension], (container): Dimensions => {\n  return { ...container };\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs';\nimport { getSpecsByType } from '../../../../state/selectors/get_specs_by_type';\nimport { MetricSpec } from '../../specs';\n\n/** @internal */\nexport const getMetricSpecs = getSpecsByType<MetricSpec>(ChartType.Metric, SpecType.Series);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from './../../../../state/chart_state';\nimport { canDisplayChartTitles } from './can_display_chart_titles';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\nconst getChartTitleOrDescription = ({ title, description }: GlobalChartState) => Boolean(title || description);\n\n/** @internal */\nexport const hasChartTitles = createCustomCachedSelector(\n  [canDisplayChartTitles, getChartTitleOrDescription],\n  (displayTitles, hasTitles): boolean => {\n    return displayTitles && hasTitles;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PartitionLayout } from './types/config_types';\nimport { ShapeTreeNode } from './types/viewmodel_types';\nimport { AGGREGATE_KEY, STATISTICS_KEY } from './utils/group_by_rollup';\nimport { Colors } from '../../../common/colors';\nimport { ConfigItem, Numeric } from '../../../common/config_objects';\nimport { GOLDEN_RATIO, TAU } from '../../../common/constants';\nimport { FONT_STYLES, FONT_VARIANTS } from '../../../common/text_utils';\nimport { ColorVariant } from '../../../utils/common';\n\nfunction significantDigitCount(d: number): number {\n  let n = Math.abs(parseFloat(String(d).replace('.', '')));\n  if (n === 0) {\n    return 0;\n  }\n  while (n !== 0 && n % 10 === 0) {\n    n /= 10;\n  }\n  return Math.floor(Math.log10(n)) + 1;\n}\n\n/** @internal */\nexport function sumValueGetter(node: ShapeTreeNode): number {\n  return node[AGGREGATE_KEY];\n}\n\n/*\n * It's an unfortunate accident that 'parent' is used both\n *   - for linking an ArrayNode to a QuadViewModel, and\n *   - for recursively linking the parent ArrayNode to an ArrayNode (child) in the tree\n *\n * By extracting out the 'MODEL_KEY', we make the distinction clear, while the API, which depends on this, doesn't\n * change. This makes an eventual API change a single-line change, assuming `[MODEL_KEY]` is used where needed, and just there\n *\n *  Todo:\n *   - replace users' use of `s.parent` with `s[MODEL_KEY]` for the ShapeTreeNode -> ArrayNode access\n *   - change MODEL_KEY to something other than 'parent' when it's done (might still be breaking change)\n */\n/** @public */\nexport const MODEL_KEY = 'parent';\n\n/** @public */\nexport function percentValueGetter(node: {\n  [AGGREGATE_KEY]: number;\n  [MODEL_KEY]: {\n    [STATISTICS_KEY]: {\n      globalAggregate: number;\n    };\n  };\n}): number {\n  return (100 * node[AGGREGATE_KEY]) / node[MODEL_KEY][STATISTICS_KEY].globalAggregate;\n}\n\n/** @public */\nexport function ratioValueGetter(node: ShapeTreeNode): number {\n  return node[AGGREGATE_KEY] / node[MODEL_KEY][STATISTICS_KEY].globalAggregate;\n}\n\n/** @public */\nexport const VALUE_GETTERS = Object.freeze({ percent: percentValueGetter, ratio: ratioValueGetter } as const);\n\n/** @public */\nexport type ValueGetterName = keyof typeof VALUE_GETTERS;\n\n/** @public */\nexport function defaultPartitionValueFormatter(d: number): string {\n  return Math.abs(d) >= 10000000 || Math.abs(d) < 0.001\n    ? d.toExponential(Math.min(2, Math.max(0, significantDigitCount(d) - 1)))\n    : d.toLocaleString(undefined, {\n        maximumSignificantDigits: 4,\n        maximumFractionDigits: 3,\n        useGrouping: true,\n      });\n}\n\n/** @internal */\nexport function percentFormatter(d: number): string {\n  return `${Math.round(d)}%`;\n}\n\nconst fontSettings = {\n  fontFamily: {\n    dflt: 'Sans-Serif',\n    type: 'string',\n  },\n  fontSize: { dflt: 12, min: 4, max: 32, type: 'number' },\n  fontStyle: {\n    dflt: 'normal',\n    type: 'string',\n    values: FONT_STYLES,\n  },\n  fontVariant: {\n    dflt: 'normal',\n    type: 'string',\n    values: FONT_VARIANTS,\n  },\n  fontWeight: { dflt: 400, min: 100, max: 900, type: 'number' },\n};\n\nconst valueFont = {\n  type: 'group',\n  values: {\n    /*\n     * Object.assign interprets the extant `undefined` as legit, so commenting it out till moving away from Object.assign in `const valueFont = ...`\n     * fontFamily: {\n     *   dflt: undefined,\n     *   type: 'string',\n     * },\n     */\n    fontWeight: fontSettings.fontWeight,\n    fontStyle: fontSettings.fontStyle,\n    fontVariant: fontSettings.fontVariant,\n  },\n};\n\n/**\n * Keeping for future config validation checks\n * @internal\n */\nexport const configMetadata: Record<string, ConfigItem> = {\n  // shape geometry\n  width: { dflt: 300, min: 0, max: 1024, type: 'number', reconfigurable: false },\n  height: { dflt: 150, min: 0, max: 1024, type: 'number', reconfigurable: false },\n  margin: {\n    type: 'group',\n    values: {\n      left: { dflt: 0, min: -0.25, max: 0.25, type: 'number' },\n      right: { dflt: 0, min: -0.25, max: 0.25, type: 'number' },\n      top: { dflt: 0, min: -0.25, max: 0.25, type: 'number' },\n      bottom: { dflt: 0, min: -0.25, max: 0.25, type: 'number' },\n    },\n  },\n  outerSizeRatio: new Numeric({\n    dflt: 1 / GOLDEN_RATIO,\n    min: 0.25,\n    max: 1,\n    reconfigurable: true,\n    documentation:\n      'The diameter of the entire circle, relative to the smaller of the usable rectangular size (smaller of width/height minus the margins)',\n  }), // todo switch to `io-ts` style, generic way of combining static and runtime type info\n  emptySizeRatio: new Numeric({\n    dflt: 0,\n    min: 0,\n    max: 0.8,\n    reconfigurable: true,\n    documentation: 'The diameter of the inner circle, relative to `outerSizeRatio`',\n  }), // todo switch to `io-ts` style, generic way of combining static and runtime type info\n  clockwiseSectors: {\n    dflt: true,\n    type: 'boolean',\n    documentation: 'Largest to smallest sectors are positioned in a clockwise order',\n  },\n  specialFirstInnermostSector: {\n    dflt: true,\n    type: 'boolean',\n    documentation: 'Starts placement with the second largest slice, for the innermost pie/ring',\n  },\n\n  // general text config\n  fontFamily: {\n    dflt: 'Sans-Serif',\n    type: 'string',\n  },\n\n  // fill text config\n  minFontSize: { dflt: 8, min: 0.1, max: 8, type: 'number', reconfigurable: true },\n  maxFontSize: { dflt: 64, min: 0.1, max: 64, type: 'number' },\n  idealFontSizeJump: {\n    dflt: 1.05, // Math.pow(goldenRatio, 1 / 3),\n    min: 1.05,\n    max: GOLDEN_RATIO,\n    type: 'number',\n    reconfigurable: false, // there's no real reason to reconfigure it; finding the largest possible font is good for readability\n  },\n  maximizeFontSize: {\n    dflt: false,\n    type: 'boolean',\n  },\n  partitionLayout: {\n    dflt: PartitionLayout.sunburst,\n    type: 'string',\n    values: Object.keys(PartitionLayout),\n  },\n  drilldown: {\n    dflt: false,\n    type: 'boolean',\n  },\n\n  // fill text layout config\n  circlePadding: { dflt: 2, min: 0.0, max: 8, type: 'number' },\n  radialPadding: { dflt: TAU / 360, min: 0, max: 0.035, type: 'number' },\n  horizontalTextAngleThreshold: { dflt: TAU / 12, min: 0, max: TAU, type: 'number' },\n  horizontalTextEnforcer: { dflt: 1, min: 0, max: 1, type: 'number' },\n  maxRowCount: { dflt: 12, min: 1, max: 16, type: 'number' },\n  fillOutside: { dflt: false, type: 'boolean' },\n  radiusOutside: { dflt: 128, min: 0, max: 1024, type: 'number' },\n  fillRectangleWidth: { dflt: Infinity, reconfigurable: false, type: 'number' },\n  fillRectangleHeight: { dflt: Infinity, reconfigurable: false, type: 'number' },\n  fillLabel: {\n    type: 'group',\n    values: {\n      textColor: { type: 'color', dflt: ColorVariant.Adaptive },\n      ...fontSettings,\n      valueGetter: {\n        dflt: sumValueGetter,\n        type: 'function',\n      },\n      valueFormatter: {\n        dflt: defaultPartitionValueFormatter,\n        type: 'function',\n      },\n      valueFont,\n      padding: {\n        type: 'group',\n        values: {\n          top: {\n            dflt: 2,\n            min: 0,\n            max: 20,\n            type: 'number',\n            reconfigurable: true,\n            documentation: 'Top padding for fill text',\n          },\n          bottom: {\n            dflt: 2,\n            min: 0,\n            max: 20,\n            type: 'number',\n            reconfigurable: true,\n            documentation: 'Bottom padding for fill text',\n          },\n          left: {\n            dflt: 2,\n            min: 0,\n            max: 20,\n            type: 'number',\n            reconfigurable: true,\n            documentation: 'Left padding for fill text',\n          },\n          right: {\n            dflt: 2,\n            min: 0,\n            max: 20,\n            type: 'number',\n            reconfigurable: true,\n            documentation: 'Right padding for fill text',\n          },\n        },\n      },\n      clipText: {\n        type: 'boolean',\n        dflt: false,\n        documentation: \"Renders, but clips, text that's longer than what would fit in a box entirely\",\n      },\n    },\n  },\n\n  // linked labels (primarily: single-line)\n  linkLabel: {\n    type: 'group',\n    values: {\n      maximumSection: {\n        dflt: 10,\n        min: 0,\n        max: 10000,\n        type: 'number',\n        reconfigurable: true,\n        documentation: 'Uses linked labels below this limit of the outer sector arc length (in pixels)',\n      },\n      ...fontSettings,\n      gap: { dflt: 10, min: 6, max: 16, type: 'number' },\n      spacing: { dflt: 2, min: 0, max: 16, type: 'number' },\n      horizontalStemLength: { dflt: 10, min: 6, max: 16, type: 'number' },\n      radiusPadding: { dflt: 10, min: 6, max: 16, type: 'number' },\n      lineWidth: { dflt: 1, min: 0.1, max: 2, type: 'number' },\n      maxCount: {\n        dflt: 36,\n        min: 2,\n        max: 64,\n        type: 'number',\n        documentation: 'Limits the total count of linked labels. The first N largest slices are kept.',\n      },\n      maxTextLength: {\n        dflt: 100,\n        min: 2,\n        max: 200,\n        documentation: 'Limits the total number of characters in linked labels.',\n      },\n      textColor: { dflt: ColorVariant.Adaptive, type: 'color' },\n      minimumStemLength: {\n        dflt: 0,\n        min: 0,\n        max: 16,\n        type: 'number',\n        reconfigurable: false, // currently only 0 is reliable\n      },\n      stemAngle: {\n        dflt: TAU / 8,\n        min: 0,\n        max: TAU,\n        type: 'number',\n        reconfigurable: false, // currently only tau / 8 is reliable\n      },\n      valueFont,\n    },\n  },\n\n  backgroundColor: { dflt: Colors.White.keyword, type: 'color' },\n  sectorLineWidth: { dflt: 1, min: 0, max: 4, type: 'number' },\n  sectorLineStroke: { dflt: Colors.White.keyword, type: 'string' },\n  animation: { type: 'group', values: { duration: { dflt: 0, min: 0, max: 3000, type: 'number' } } },\n};\n\n/**\n * Part-to-whole visualizations such as treemap, sunburst, pie hinge on an aggregation\n * function such that the value is independent of the order of how the constituents are aggregated\n * https://en.wikipedia.org/wiki/Associative_property\n * Hierarchical, space-filling part-to-whole visualizations also need that the\n * the value of a node is equal to the sum of the values of its children\n * https://mboehm7.github.io/teaching/ss19_dbs/04_RelationalAlgebra.pdf p21\n * It's now `count` and `sum` but subject to change\n *\n * potential internal, or removable\n * @internal\n */\nexport type AdditiveAggregation = 'count' | 'sum';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { Ratio } from '../../../../common/geometry';\n\n/** @public */\nexport const PartitionLayout = Object.freeze({\n  sunburst: 'sunburst' as const,\n  treemap: 'treemap' as const,\n  icicle: 'icicle' as const,\n  flame: 'flame' as const,\n  mosaic: 'mosaic' as const,\n  waffle: 'waffle' as const,\n});\n\n/** @public */\nexport type PartitionLayout = $Values<typeof PartitionLayout>; // could use ValuesType<typeof HierarchicalChartTypes>\n\n/** @alpha */\nexport type EasingFunction = (x: Ratio) => Ratio;\n\n/** @alpha */\nexport interface AnimKeyframe {\n  time: number;\n  easingFunction: EasingFunction;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PartitionLayout } from './config_types';\nimport { LegacyAnimationConfig } from '../../../../common/animation';\nimport { CategoryKey } from '../../../../common/category';\nimport { Color, Colors } from '../../../../common/colors';\nimport {\n  Coordinate,\n  Distance,\n  Pixels,\n  PointObject,\n  PointTuple,\n  PointTuples,\n  Radian,\n  SizeRatio,\n} from '../../../../common/geometry';\nimport { Font, HorizontalAlignment, VerticalAlignments } from '../../../../common/text_utils';\nimport { GroupByAccessor } from '../../../../specs';\nimport { LegendPath } from '../../../../state/actions/legend';\nimport { Size } from '../../../../utils/dimensions';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { ContinuousDomainFocus } from '../../renderer/canvas/partition';\nimport { Layer } from '../../specs';\nimport { MODEL_KEY, ValueGetterName } from '../config';\nimport { ArrayNode, HierarchyOfArrays, Key } from '../utils/group_by_rollup';\nimport { LinkLabelsViewModelSpec } from '../viewmodel/link_text_layout';\n\n/** @internal */\nexport type LinkLabelVM = {\n  isRTL: boolean;\n  linkLabels: PointTuples;\n  translate: PointTuple;\n  textAlign: CanvasTextAlign;\n  text: string;\n  valueText: string;\n  width: Distance;\n  valueWidth: Distance;\n};\n\n/** @internal */\nexport interface RowBox extends Font {\n  text: string;\n  width: Distance;\n  wordBeginning: Distance;\n  isValue?: boolean;\n}\n\ninterface RowAnchor {\n  rowAnchorX: Coordinate;\n  rowAnchorY: Coordinate;\n}\n\n/** @internal */\nexport interface RowSpace extends RowAnchor {\n  maximumRowLength: Distance;\n}\n\n/** @internal */\nexport interface TextRow extends RowAnchor {\n  length: number;\n  maximumLength: number;\n  rowWords: Array<RowBox>;\n}\n\n/** @internal */\nexport interface RowSet {\n  id: string;\n  rows: Array<TextRow>;\n  fillTextColor?: string;\n  fontSize: number;\n  rotation: Radian;\n  verticalAlignment: VerticalAlignments;\n  horizontalAlignment: HorizontalAlignment;\n  isRTL: boolean;\n  container?: any;\n  clipText?: boolean;\n}\n\n/** @internal */\nexport interface SmallMultiplesDescriptors {\n  smAccessorValue: ReturnType<GroupByAccessor>;\n  index: number;\n  innerIndex: number;\n}\n\n/** @internal */\nexport interface QuadViewModel extends ShapeTreeNode, SmallMultiplesDescriptors {\n  strokeWidth: number;\n  strokeStyle: string;\n  fillColor: string;\n  textColor: string;\n}\n\n/** @internal */\nexport interface OutsideLinksViewModel {\n  points: Array<PointTuple>;\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels, focus: ContinuousDomainFocus) => Array<QuadViewModel>;\n\n/** @internal */\nexport interface PartitionSmallMultiplesModel extends SmallMultiplesDescriptors {\n  smAccessorValue: number | string;\n  layout: PartitionLayout;\n  top: SizeRatio;\n  left: SizeRatio;\n  width: SizeRatio;\n  height: SizeRatio;\n  innerRowCount: number;\n  innerColumnCount: number;\n  innerRowIndex: number;\n  innerColumnIndex: number;\n  marginLeftPx: Pixels;\n  marginTopPx: Pixels;\n  panel: {\n    title: string;\n    innerWidth: Pixels;\n    innerHeight: Pixels;\n    fontFace: Font;\n    fontSize: number;\n  };\n}\n\n/** @internal */\nexport interface ShapeViewModel extends PartitionSmallMultiplesModel, LegacyAnimationConfig {\n  style: Theme['partition'];\n  chartDimensions: Size;\n  layers: Layer[];\n  quadViewModel: QuadViewModel[];\n  rowSets: RowSet[];\n  linkLabelViewModels: LinkLabelsViewModelSpec;\n  outsideLinksViewModel: OutsideLinksViewModel[];\n  diskCenter: PointObject;\n  pickQuads: PickFunction;\n  outerRadius: number;\n}\n\nconst defaultFont: Font = {\n  fontStyle: 'normal',\n  fontVariant: 'normal',\n  fontFamily: '',\n  fontWeight: 'normal',\n  textColor: Colors.Black.keyword,\n};\n\n/** @internal */\nexport const nullPartitionSmallMultiplesModel = (\n  layout: PartitionLayout = PartitionLayout.sunburst,\n): PartitionSmallMultiplesModel => ({\n  index: 0,\n  innerIndex: 0,\n  smAccessorValue: '',\n  top: 0,\n  left: 0,\n  width: 0,\n  height: 0,\n  innerRowCount: 0,\n  innerColumnCount: 0,\n  innerRowIndex: 0,\n  innerColumnIndex: 0,\n  marginLeftPx: 0,\n  marginTopPx: 0,\n  layout,\n  panel: {\n    title: '',\n    innerWidth: 0,\n    innerHeight: 0,\n    fontSize: 10,\n    fontFace: {\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      fontFamily: 'sans-serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n    },\n  },\n});\n\n/** @internal */\nexport const nullShapeViewModel = (\n  layout: PartitionLayout = PartitionLayout.sunburst,\n  style: Theme['partition'] = LIGHT_THEME.partition,\n  diskCenter?: PointObject,\n): ShapeViewModel => ({\n  ...nullPartitionSmallMultiplesModel(layout),\n  style,\n  layers: [],\n  quadViewModel: [],\n  rowSets: [],\n  linkLabelViewModels: {\n    linkLabels: [],\n    labelFontSpec: defaultFont,\n    valueFontSpec: defaultFont,\n    strokeColor: '',\n  },\n  outsideLinksViewModel: [],\n  diskCenter: diskCenter || { x: 0, y: 0 },\n  pickQuads: () => [],\n  outerRadius: 0,\n  chartDimensions: {\n    width: 0,\n    height: 0,\n  },\n  animation: { duration: 0 },\n});\n\n/** @internal */\nexport const hasMostlyRTLLabels = (geoms: ShapeViewModel[]): boolean =>\n  geoms.reduce(\n    (surplus: number, { rowSets }) =>\n      surplus + rowSets.reduce((excess: number, { isRTL }) => excess + (isRTL ? 1 : -1), 0),\n    0,\n  ) > 0;\n\n/** @public */\nexport type TreeLevel = number;\n\n/** @public */\nexport interface AngleFromTo {\n  x0: Radian;\n  x1: Radian;\n}\n\n/** @internal */\nexport interface LayerFromTo {\n  y0: TreeLevel;\n  y1: TreeLevel;\n}\n\n/**\n * @public\n */\nexport interface TreeNode extends AngleFromTo {\n  x0: Radian;\n  x1: Radian;\n  y0: TreeLevel;\n  y1: TreeLevel;\n  fill?: Color;\n}\n\n/**\n * @public\n */\nexport interface SectorGeomSpecY {\n  y0px: Distance;\n  y1px: Distance;\n}\n\n/** @public */\nexport type DataName = CategoryKey; // todo consider narrowing it to eg. primitives\n\n/** @public */\nexport interface ShapeTreeNode extends TreeNode, SectorGeomSpecY {\n  yMidPx: Distance;\n  depth: number;\n  sortIndex: number;\n  path: LegendPath;\n  dataName: DataName;\n  value: number;\n  [MODEL_KEY]: ArrayNode;\n}\n\n/** @public */\nexport type RawTextGetter = (node: ShapeTreeNode) => string;\n/** @public */\nexport type ValueGetterFunction = (node: ShapeTreeNode) => number;\n/** @public */\nexport type ValueGetter = ValueGetterFunction | ValueGetterName;\n/** @public */\nexport type NodeColorAccessor = (key: Key, sortIndex: number, node: ArrayNode, tree: HierarchyOfArrays) => string;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TAU } from '../../../../common/constants';\nimport {\n  Circline,\n  CirclineArc,\n  CirclinePredicate,\n  Coordinate,\n  Distance,\n  PointObject,\n  Radian,\n  Radius,\n  RingSectorConstruction,\n  trueBearingToStandardPositionAngle,\n} from '../../../../common/geometry';\nimport { PartitionStyle } from '../../../../utils/themes/partition';\nimport { PartitionSpec } from '../../specs';\nimport { AngleFromTo, LayerFromTo, ShapeTreeNode } from '../types/viewmodel_types';\n\nfunction euclideanDistance({ x: x1, y: y1 }: PointObject, { x: x2, y: y2 }: PointObject): Distance {\n  return Math.sqrt(Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2));\n}\n\nfunction fullyContained(c1: Circline, c2: Circline): boolean {\n  return euclideanDistance(c1, c2) + c2.r <= c1.r;\n}\n\nfunction noOverlap(c1: Circline, c2: Circline): boolean {\n  return euclideanDistance(c1, c2) >= c1.r + c2.r;\n}\n\nfunction circlineIntersect(c1: Circline, c2: Circline): PointObject[] {\n  const d = Math.sqrt((c1.x - c2.x) * (c1.x - c2.x) + (c1.y - c2.y) * (c1.y - c2.y));\n  if (c1.r + c2.r >= d && d >= Math.abs(c1.r - c2.r)) {\n    const a1 = d + c1.r + c2.r;\n    const a2 = d + c1.r - c2.r;\n    const a3 = d - c1.r + c2.r;\n    const a4 = -d + c1.r + c2.r;\n    const area = Math.sqrt(a1 * a2 * a3 * a4) / 4;\n\n    const xAux1 = (c1.x + c2.x) / 2 + ((c2.x - c1.x) * (c1.r * c1.r - c2.r * c2.r)) / (2 * d * d);\n    const xAux2 = (2 * (c1.y - c2.y) * area) / (d * d);\n    const x1 = xAux1 + xAux2;\n    const x2 = xAux1 - xAux2;\n\n    const yAux1 = (c1.y + c2.y) / 2 + ((c2.y - c1.y) * (c1.r * c1.r - c2.r * c2.r)) / (2 * d * d);\n    const yAux2 = (2 * (c1.x - c2.x) * area) / (d * d);\n    const y1 = yAux1 - yAux2;\n    const y2 = yAux1 + yAux2;\n\n    return [\n      { x: x1, y: y1 },\n      { x: x2, y: y2 },\n    ];\n  }\n  return [];\n}\n\nfunction circlineValidSectors(refC: CirclinePredicate, c: CirclineArc): CirclineArc[] {\n  const { inside } = refC;\n  const { x, y, r, from, to } = c;\n  const fullContainment = fullyContained(refC, c);\n  const fullyOutside = noOverlap(refC, c) || fullyContained(c, refC);\n\n  // handle clear cases\n\n  // nothing kept:\n  if ((inside && fullContainment) || (!inside && fullyOutside)) {\n    return [];\n  }\n\n  // the entire sector is kept\n  if ((inside && fullyOutside) || (!inside && fullContainment)) {\n    return [c];\n  }\n\n  // now we know there's intersection and we're supposed to get back two distinct points\n  const circlineIntersections = circlineIntersect(refC, c);\n  // These conditions don't happen; kept for documentation purposes:\n  // if (circlineIntersections.length !== 2) throw new Error('Problem in intersection calculation.')\n  // if (from > to) throw new Error('From/to problem in intersection calculation.')\n  const [p1, p2] = circlineIntersections;\n  if (!p1 || !p2) return [];\n  const aPre1 = Math.atan2(p1.y - c.y, p1.x - c.x);\n  const aPre2 = Math.atan2(p2.y - c.y, p2.x - c.x);\n  const a1p = Math.max(from, Math.min(to, aPre1 < 0 ? aPre1 + TAU : aPre1));\n  const a2p = Math.max(from, Math.min(to, aPre2 < 0 ? aPre2 + TAU : aPre2));\n  const a1 = Math.min(a1p, a2p);\n  const a2 = a1p === a2p ? TAU : Math.max(a1p, a2p); // make a2 drop out in next step\n\n  // imperative, slightly optimized buildup of `breakpoints` as it's in the hot loop:\n  const breakpoints = [from];\n  if (from < a1 && a1 < to) breakpoints.push(a1);\n  if (from < a2 && a2 < to) breakpoints.push(a2);\n  breakpoints.push(to);\n\n  const predicate = inside ? noOverlap : fullyContained;\n\n  // imperative, slightly optimized buildup of `result` as it's in the hot loop:\n  const result = [];\n  for (let i = 0; i < breakpoints.length - 1; i++) {\n    const from = breakpoints[i] ?? 0;\n    const to = breakpoints[i + 1] ?? 0;\n    const midAngle = (from + to) / 2; // no winding clip ie. `meanAngle()` would be wrong here\n    const xx = x + r * Math.cos(midAngle);\n    const yy = y + r * Math.sin(midAngle);\n    if (predicate(refC, { x: xx, y: yy, r: 0 })) result.push({ x, y, r, from, to });\n  }\n  return result;\n}\n\n/** @internal */\nexport function conjunctiveConstraint(constraints: RingSectorConstruction, c: CirclineArc): CirclineArc[] {\n  // imperative, slightly optimized buildup of `valids` as it's in the hot loop:\n  let valids = [c];\n  for (let i = 0; i < constraints.length; i++) {\n    const refC = constraints[i]; // reference circle\n    const nextValids: CirclineArc[] = [];\n    if (!refC) break;\n    for (let j = 0; j < valids.length; j++) {\n      const cc = valids[j];\n      if (!cc) continue;\n      const currentValids = circlineValidSectors(refC, cc);\n      nextValids.push(...currentValids);\n    }\n    valids = nextValids;\n  }\n  return valids;\n}\n\n/** @internal */\nexport const INFINITY_RADIUS = 1e4; // far enough for a sub-2px precision on a 4k screen, good enough for text bounds; 64 bit floats still work well with it\n\n/** @internal */\nexport function angleToCircline(\n  midRadius: Radius,\n  alpha: Radian,\n  direction: 1 | -1 /* 1 for clockwise and -1 for anticlockwise circline */,\n) {\n  const sectorRadiusLineX = Math.cos(alpha) * midRadius;\n  const sectorRadiusLineY = Math.sin(alpha) * midRadius;\n  const normalAngle = alpha + (direction * Math.PI) / 2;\n  const x = sectorRadiusLineX + INFINITY_RADIUS * Math.cos(normalAngle);\n  const y = sectorRadiusLineY + INFINITY_RADIUS * Math.sin(normalAngle);\n  return { x, y, r: INFINITY_RADIUS, inside: false, from: 0, to: TAU };\n}\n\nfunction ringSectorStartAngle(d: AngleFromTo): Radian {\n  return trueBearingToStandardPositionAngle(d.x0 + Math.max(0, d.x1 - d.x0 - TAU / 2) / 2);\n}\n\nfunction ringSectorEndAngle(d: AngleFromTo): Radian {\n  return trueBearingToStandardPositionAngle(d.x1 - Math.max(0, d.x1 - d.x0 - TAU / 2) / 2);\n}\n\nfunction ringSectorInnerRadius(innerRadius: Radian, ringThickness: Distance) {\n  return (d: LayerFromTo): Radius => innerRadius + d.y0 * ringThickness;\n}\n\nfunction ringSectorOuterRadius(innerRadius: Radian, ringThickness: Distance) {\n  return (d: LayerFromTo): Radius => innerRadius + (d.y0 + 1) * ringThickness;\n}\n\n/** @internal */\nexport function ringSectorConstruction(\n  { fillOutside, radiusOutside, fillRectangleWidth, fillRectangleHeight }: PartitionSpec,\n  { circlePadding, radialPadding }: PartitionStyle,\n  innerRadius: Radius,\n  ringThickness: Distance,\n) {\n  return (ringSector: ShapeTreeNode): RingSectorConstruction => {\n    const radiusGetter = fillOutside ? ringSectorOuterRadius : ringSectorInnerRadius;\n    const geometricInnerRadius = radiusGetter(innerRadius, ringThickness)(ringSector);\n    const innerR = geometricInnerRadius + circlePadding * 2;\n    const outerR = Math.max(\n      innerR,\n      ringSectorOuterRadius(innerRadius, ringThickness)(ringSector) - circlePadding + (fillOutside ? radiusOutside : 0),\n    );\n    const startAngle = ringSectorStartAngle(ringSector);\n    const endAngle = ringSectorEndAngle(ringSector);\n    const innerCircline = { x: 0, y: 0, r: innerR, inside: true, from: 0, to: TAU };\n    const outerCircline = { x: 0, y: 0, r: outerR, inside: false, from: 0, to: TAU };\n    const midRadius = (innerR + outerR) / 2;\n    const sectorStartCircle = angleToCircline(midRadius, startAngle - radialPadding, -1);\n    const sectorEndCircle = angleToCircline(midRadius, endAngle + radialPadding, 1);\n    const outerRadiusFromRectangleWidth = fillRectangleWidth / 2;\n    const outerRadiusFromRectanglHeight = fillRectangleHeight / 2;\n    const fullCircle = ringSector.x0 === 0 && ringSector.x1 === TAU && geometricInnerRadius === 0;\n    const sectorCirclines = [\n      ...(fullCircle && innerRadius === 0 ? [] : [innerCircline]),\n      outerCircline,\n      ...(fullCircle ? [] : [sectorStartCircle, sectorEndCircle]),\n    ];\n    const rectangleCirclines =\n      outerRadiusFromRectangleWidth === Infinity && outerRadiusFromRectanglHeight === Infinity\n        ? []\n        : [\n            { x: INFINITY_RADIUS - outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true },\n            { x: -INFINITY_RADIUS + outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true },\n            { x: 0, y: INFINITY_RADIUS - outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true },\n            { x: 0, y: -INFINITY_RADIUS + outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true },\n          ];\n    return [...sectorCirclines, ...rectangleCirclines];\n  };\n}\n/** @internal */\nexport function makeRowCircline(\n  cx: Coordinate,\n  cy: Coordinate,\n  radialOffset: Distance,\n  rotation: Radian,\n  fontSize: number,\n  offsetSign: -1 | 0 | 1,\n) {\n  const r = INFINITY_RADIUS;\n  const offset = (offsetSign * fontSize) / 2;\n  const topRadius = r - offset;\n  const x = cx + topRadius * Math.cos(-rotation + TAU / 4);\n  const y = cy + topRadius * Math.cos(-rotation + TAU / 2);\n  return { r: r + radialOffset, x, y };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CategoryKey } from '../../../../common/category';\nimport { Relation } from '../../../../common/text_utils';\nimport { LegendPath } from '../../../../state/actions/legend';\nimport { Datum, ValueAccessor } from '../../../../utils/common';\n\n/** @public */\nexport const AGGREGATE_KEY = 'value';\n/** @public */\nexport const STATISTICS_KEY = 'statistics';\n/** @public */\nexport const DEPTH_KEY = 'depth';\n/** @public */\nexport const CHILDREN_KEY = 'children';\n/** @public */\nexport const INPUT_KEY = 'inputIndex';\n/** @public */\nexport const PARENT_KEY = 'parent';\n/** @public */\nexport const SORT_INDEX_KEY = 'sortIndex';\n/** @public */\nexport const PATH_KEY = 'path';\n\n/** @public */\nexport interface Statistics {\n  globalAggregate: number;\n}\n\n/** @public */\nexport interface NodeDescriptor {\n  [AGGREGATE_KEY]: number;\n  [DEPTH_KEY]: number;\n  [STATISTICS_KEY]: Statistics;\n  [INPUT_KEY]?: Array<number>;\n}\n\n/** @public */\nexport type ArrayEntry = [Key, ArrayNode];\n/** @public */\nexport type HierarchyOfArrays = Array<ArrayEntry>;\n\n/** @public */\nexport interface ArrayNode extends NodeDescriptor {\n  [CHILDREN_KEY]: HierarchyOfArrays;\n  [PARENT_KEY]: ArrayNode;\n  [SORT_INDEX_KEY]: number;\n  [PATH_KEY]: LegendPath;\n}\n\ntype HierarchyOfMaps = Map<Key, MapNode>;\n\ninterface MapNode extends NodeDescriptor {\n  [CHILDREN_KEY]?: HierarchyOfMaps;\n  [PARENT_KEY]?: ArrayNode;\n}\n\n/**\n * Used in the first position of a `LegendPath` array, which indicates the stringified value of the `groupBy` value\n * in case of small multiples, but has no applicable `groupBy` for singleton (non-small-multiples) charts\n * @public\n */\nexport const NULL_SMALL_MULTIPLES_KEY: Key = '__null_small_multiples_key__';\n\n/**\n * Indicates that a node is the root of a specific partition chart, eg. the root of a single pie chart, or one pie\n * chart in a small multiples setting. Used in the second position of a `LegendPath` array\n * @public\n */\nexport const HIERARCHY_ROOT_KEY: Key = '__root_key__';\n\n/**\n * A primitive JavaScript value, possibly further restricted\n * @public\n */\nexport type PrimitiveValue = string | number | null; // there could be more but sufficient for now\n/** @public */\nexport type Key = CategoryKey;\n/** @public */\nexport type Sorter = (a: number, b: number) => number;\n\n/**\n * Binary predicate function used for `[].sort`ing partitions represented as ArrayEntries\n * @public\n */\nexport type NodeSorter = (a: ArrayEntry, b: ArrayEntry) => number;\n\n/** @public */\nexport const entryKey = ([key]: ArrayEntry) => key;\n/** @public */\nexport const entryValue = ([, value]: ArrayEntry) => value;\n\n/** @public */\nexport function depthAccessor(n: ArrayEntry) {\n  return entryValue(n)[DEPTH_KEY];\n}\n\n/** @public */\nexport function aggregateAccessor(n: ArrayEntry): number {\n  return entryValue(n)[AGGREGATE_KEY];\n}\n\n/** @public */\nexport function parentAccessor(n: ArrayEntry): ArrayNode {\n  return entryValue(n)[PARENT_KEY];\n}\n\n/** @public */\nexport function childrenAccessor(n: ArrayEntry) {\n  return entryValue(n)[CHILDREN_KEY];\n}\n\n/** @public */\nexport function sortIndexAccessor(n: ArrayEntry) {\n  return entryValue(n)[SORT_INDEX_KEY];\n}\n\n/** @public */\nexport function pathAccessor(n: ArrayEntry) {\n  return entryValue(n)[PATH_KEY];\n}\n\n/** @public */\nexport function getNodeName(node: ArrayNode): string {\n  const index = node[SORT_INDEX_KEY];\n  const arrayEntry = node[PARENT_KEY][CHILDREN_KEY][index];\n  return arrayEntry ? entryKey(arrayEntry) : '';\n}\n\n/** @internal */\nexport function groupByRollup(\n  keyAccessors: Array<((a: Datum) => Key) | ((a: Datum, i: number) => Key)>,\n  valueAccessor: ValueAccessor,\n  {\n    reducer,\n    identity,\n  }: {\n    reducer: (prev: number, next: number) => number;\n    identity: () => any;\n  },\n  factTable: Relation,\n): HierarchyOfMaps {\n  const statistics: Statistics = {\n    globalAggregate: NaN,\n  };\n  const reductionMap: HierarchyOfMaps = factTable.reduce((p: HierarchyOfMaps, n, index) => {\n    const keyCount = keyAccessors.length;\n    let pointer: HierarchyOfMaps = p;\n    keyAccessors.forEach((keyAccessor, i) => {\n      const key: Key = keyAccessor(n, index);\n      const last = i === keyCount - 1;\n      const node = pointer.get(key);\n      const inputIndices = node?.[INPUT_KEY] ?? [];\n      const childrenMap = node?.[CHILDREN_KEY] ?? new Map();\n      const aggregate = node?.[AGGREGATE_KEY] ?? identity();\n      const reductionValue = reducer(aggregate, valueAccessor(n));\n      pointer.set(key, {\n        [AGGREGATE_KEY]: reductionValue,\n        [STATISTICS_KEY]: statistics,\n        [INPUT_KEY]: [...inputIndices, index],\n        [DEPTH_KEY]: i,\n        ...(!last && { [CHILDREN_KEY]: childrenMap }),\n      });\n      if (childrenMap) {\n        // will always be true except when exiting from forEach, ie. upon encountering the leaf node\n        pointer = childrenMap;\n      }\n    });\n    return p;\n  }, new Map());\n  if (reductionMap.get(HIERARCHY_ROOT_KEY) !== undefined) {\n    statistics.globalAggregate = (reductionMap.get(HIERARCHY_ROOT_KEY) as MapNode)[AGGREGATE_KEY];\n  }\n  return reductionMap;\n}\n\nfunction getRootArrayNode(): ArrayNode {\n  const children: HierarchyOfArrays = [];\n  const bootstrap: Omit<ArrayNode, typeof PARENT_KEY> = {\n    [AGGREGATE_KEY]: NaN,\n    [DEPTH_KEY]: NaN,\n    [CHILDREN_KEY]: children,\n    [INPUT_KEY]: [] as number[],\n    [PATH_KEY]: [] as LegendPath,\n    [SORT_INDEX_KEY]: 0,\n    [STATISTICS_KEY]: { globalAggregate: 0 },\n  };\n  (bootstrap as ArrayNode)[PARENT_KEY] = bootstrap as ArrayNode;\n  return bootstrap as ArrayNode; // TS doesn't yet handle bootstrapping but the `Omit` above retains guarantee for all props except `[PARENT_KEY]`\n}\n\n/** @internal */\nexport function mapsToArrays(\n  root: HierarchyOfMaps,\n  sortSpecs: (NodeSorter | null)[],\n  innerGroups: LegendPath,\n): HierarchyOfArrays {\n  const groupByMap = (node: HierarchyOfMaps, parent: ArrayNode) => {\n    const items = Array.from(node, ([key, value]: [Key, MapNode]): ArrayEntry => {\n      const valueElement = value[CHILDREN_KEY];\n      const resultNode: ArrayNode = {\n        [AGGREGATE_KEY]: NaN,\n        [STATISTICS_KEY]: { globalAggregate: NaN },\n        [CHILDREN_KEY]: [],\n        [DEPTH_KEY]: NaN,\n        [SORT_INDEX_KEY]: NaN,\n        [PARENT_KEY]: parent,\n        [INPUT_KEY]: [],\n        [PATH_KEY]: [],\n      };\n      const newValue: ArrayNode = Object.assign(\n        resultNode,\n        value,\n        valueElement && { [CHILDREN_KEY]: groupByMap(valueElement, resultNode) },\n      );\n      return [key, newValue];\n    });\n    if (sortSpecs.some((s) => s !== null)) {\n      items.sort((e1: ArrayEntry, e2: ArrayEntry) => {\n        const node1 = e1[1];\n        const node2 = e2[1];\n        if (node1[DEPTH_KEY] !== node2[DEPTH_KEY]) return node1[DEPTH_KEY] - node2[DEPTH_KEY];\n        const depth = node1[DEPTH_KEY];\n        const sorterWithinLayer = sortSpecs[depth];\n        return sorterWithinLayer ? sorterWithinLayer(e1, e2) : node2.value - node1.value;\n      });\n    }\n    return items.map((n: ArrayEntry, i) => {\n      entryValue(n).sortIndex = i;\n      return n;\n    });\n  }; // with the current algo, decreasing order is important\n  const tree = groupByMap(root, getRootArrayNode());\n  const buildPaths = ([key, mapNode]: ArrayEntry, currentPath: LegendPath) => {\n    const newPath = [...currentPath, { index: mapNode[SORT_INDEX_KEY], value: key }];\n    mapNode[PATH_KEY] = newPath; // in-place mutation, so disabled `no-param-reassign`\n    mapNode.children.forEach((entry) => buildPaths(entry, newPath));\n  };\n  if (tree[0]) buildPaths(tree[0], innerGroups);\n  return tree;\n}\n\n/** @internal */\nexport function mapEntryValue(entry: ArrayEntry) {\n  return entryValue(entry)[AGGREGATE_KEY];\n}\n\n// type MeanReduction = { sum: number; count: number };\n// type MedianReduction = Array<number>;\n\n/** @internal */\nexport const aggregators = {\n  one: {\n    identity: () => 0,\n    reducer: () => 1,\n  },\n  count: {\n    identity: () => 0,\n    reducer: (r: number) => r + 1,\n  },\n  sum: {\n    identity: () => 0,\n    reducer: (r: number, n: number) => r + n,\n  },\n  min: {\n    identity: () => Infinity,\n    reducer: (r: number, n: number) => Math.min(r, n),\n  },\n  max: {\n    identity: () => -Infinity,\n    reducer: (r: number, n: number) => Math.max(r, n),\n  },\n  min0: {\n    identity: () => 0,\n    reducer: (r: number, n: number) => Math.min(r, n),\n  },\n  max0: {\n    identity: () => 0,\n    reducer: (r: number, n: number) => Math.max(r, n),\n  },\n  // todo more TS typing is needed to use these\n  // mean: {\n  //   identity: (): MeanReduction => ({ sum: 0, count: 0 }),\n  //   reducer: (r: MeanReduction, n: number) => {\n  //     r.sum += n;\n  //     r.count++;\n  //     return r;\n  //   },\n  //   finalizer: (r: MeanReduction): number => r.sum / r.count,\n  // },\n  // median: {\n  //   identity: (): MedianReduction => [],\n  //   reducer: (r: MedianReduction, n: number) => {\n  //     r.push(n);\n  //     return r;\n  //   },\n  //   finalizer: (r: MedianReduction): number => {\n  //     const sorted = r.sort(ascending);\n  //     const len = r.length;\n  //     const even = len === len % 2;\n  //     const half = len / 2;\n  //     return even ? (sorted[half - 1] + sorted[half]) / 2 : sorted[half - 0.5];\n  //   },\n  // },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values as Values } from 'utility-types';\n\nimport { LegendPath } from '../../../../state/actions/legend';\nimport { DataName, QuadViewModel } from '../types/viewmodel_types';\n\ntype LegendStrategyFn = (legendPath: LegendPath) => (partialShape: { path: LegendPath; dataName: DataName }) => boolean;\n\nconst legendStrategies: Record<LegendStrategy, LegendStrategyFn> = {\n  node:\n    (legendPath) =>\n    ({ path }) =>\n      // highlight exact match in the path only\n      legendPath.length === path.length &&\n      legendPath.every(({ index, value }, i) => index === path[i]?.index && value === path[i]?.value),\n\n  path:\n    (legendPath) =>\n    ({ path }) =>\n      // highlight members of the exact path; ie. exact match in the path, plus all its ancestors\n      path.every(({ index, value }, i) => index === legendPath[i]?.index && value === legendPath[i]?.value),\n\n  keyInLayer:\n    (legendPath) =>\n    ({ path, dataName }) =>\n      // highlight all identically named items which are within the same depth (ring) as the hovered legend depth\n      legendPath.length === path.length && dataName === legendPath.at(-1)?.value,\n\n  key:\n    (legendPath) =>\n    ({ dataName }) =>\n      // highlight all identically named items, no matter where they are\n      dataName === legendPath.at(-1)?.value,\n\n  nodeWithDescendants:\n    (legendPath) =>\n    ({ path }) =>\n      // highlight exact match in the path, and everything that is its descendant in that branch\n      legendPath.every(({ index, value }, i) => index === path[i]?.index && value === path[i]?.value),\n\n  pathWithDescendants:\n    (legendPath) =>\n    ({ path }) =>\n      // highlight exact match in the path, and everything that is its ancestor, or its descendant in that branch\n      legendPath\n        .slice(0, path.length)\n        .every(({ index, value }, i) => index === path[i]?.index && value === path[i]?.value),\n};\n\n/** @public */\nexport const LegendStrategy = Object.freeze({\n  /**\n   * Highlight the specific node(s) that the legend item stands for.\n   */\n  Node: 'node' as const,\n  /**\n   * Highlight members of the exact path; ie. like `Node`, plus all its ancestors\n   */\n  Path: 'path' as const,\n  /**\n   * Highlight all identically named (labelled) items within the tree layer (depth or ring) of the specific node(s) that the legend item stands for\n   */\n  KeyInLayer: 'keyInLayer' as const,\n  /**\n   * Highlight all identically named (labelled) items, no matter where they are\n   */\n  Key: 'key' as const,\n  /**\n   * Highlight the specific node(s) that the legend item stands for, plus all descendants\n   */\n  NodeWithDescendants: 'nodeWithDescendants' as const,\n  /**\n   * Highlight the specific node(s) that the legend item stands for, plus all ancestors and descendants\n   */\n  PathWithDescendants: 'pathWithDescendants' as const,\n});\n\n/** @public */\nexport type LegendStrategy = Values<typeof LegendStrategy>;\n\nconst defaultStrategy: LegendStrategy = LegendStrategy.Path;\n\n/** @internal */\nexport function highlightedGeoms(\n  legendStrategy: LegendStrategy | undefined,\n  flatLegend: boolean | undefined,\n  quadViewModel: QuadViewModel[],\n  highlightedLegendItemPath: LegendPath,\n) {\n  return quadViewModel.filter(legendStrategies[legendStrategy ?? defaultStrategy](highlightedLegendItemPath));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  CHILDREN_KEY,\n  HIERARCHY_ROOT_KEY,\n  HierarchyOfArrays,\n  PATH_KEY,\n  ArrayNode,\n  NULL_SMALL_MULTIPLES_KEY,\n  AGGREGATE_KEY,\n} from './group_by_rollup';\nimport { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels';\nimport { ValueFormatter } from '../../../../utils/common';\nimport { Layer } from '../../specs';\n\n/** @internal */\nexport function getLegendLabelsAndValue(\n  layers: Layer[],\n  tree: HierarchyOfArrays,\n  legendMaxDepth: number,\n  // if used the resulting label will be concatenated with the formatted value, use () => '' to avoid that\n  valueFormatter: ValueFormatter,\n): LegendItemLabel[] {\n  return flatSlicesNames(layers, 0, tree, valueFormatter).filter(({ depth }) => depth <= legendMaxDepth);\n}\n\n/** @internal */\nfunction getArrayNodeKey(arrayNode: ArrayNode): string {\n  return arrayNode[PATH_KEY].reduce<string>((acc, { value, index }) => {\n    if (value === HIERARCHY_ROOT_KEY || value === NULL_SMALL_MULTIPLES_KEY) return acc;\n    return `${acc}(${index}):${value}__`;\n  }, '__');\n}\n\nfunction flatSlicesNames(\n  layers: Layer[],\n  depth: number,\n  tree: HierarchyOfArrays,\n  valueFormatter: ValueFormatter,\n  keys: Map<string, string> = new Map(),\n  depths: Map<string, number> = new Map(),\n): LegendItemLabel[] {\n  if (tree.length === 0) {\n    return [];\n  }\n\n  for (const [key, arrayNode] of tree) {\n    // format the key with the layer formatter\n    const layer = layers[depth - 1];\n    const formatter = layer?.nodeLabel;\n    const formattedKey = formatter ? formatter(key) : `${key}`;\n    // preventing errors from external formatters\n    if (formattedKey && formattedKey !== HIERARCHY_ROOT_KEY) {\n      // Node key must be unique for each node in the tree\n      const nodeKey = getArrayNodeKey(arrayNode);\n      // save only the max depth, so we can compute the the max extension of the legend\n      depths.set(nodeKey, depth);\n\n      const formattedValue = valueFormatter(arrayNode[AGGREGATE_KEY]);\n      keys.set(nodeKey, `${formattedKey}${formattedValue}`);\n    }\n\n    const children = arrayNode[CHILDREN_KEY];\n    flatSlicesNames(layers, depth + 1, children, valueFormatter, keys, depths);\n  }\n\n  return [...depths.keys()].map((key) => ({\n    label: keys.get(key) ?? '',\n    depth: depths.get(key) ?? 0,\n  }));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ArrayEntry, childrenAccessor, HierarchyOfArrays } from './group_by_rollup';\nimport { Origin } from '../../../../common/geometry';\nimport { Part } from '../../../../common/text_utils';\n\n/** @internal */\nexport function sunburst(\n  outerNodes: HierarchyOfArrays,\n  areaAccessor: (e: ArrayEntry) => number,\n  { x0: outerX0, y0: outerY0 }: Origin,\n  clockwiseSectors: boolean,\n  specialFirstInnermostSector: boolean,\n  heightStep: number = 1,\n): Array<Part> {\n  const result: Array<Part> = [];\n  const laySubtree = (nodes: HierarchyOfArrays, { x0, y0 }: Origin, depth: number) => {\n    let currentOffsetX = x0;\n    const nodeCount = nodes.length;\n    for (let i = 0; i < nodeCount; i++) {\n      const index = clockwiseSectors ? i : nodeCount - i - 1;\n      const node = nodes[depth === 1 && specialFirstInnermostSector ? (index + 1) % nodeCount : index];\n      if (!node) continue;\n      const area = areaAccessor(node);\n      result.push({ node, x0: currentOffsetX, y0, x1: currentOffsetX + area, y1: y0 + heightStep });\n      const children = childrenAccessor(node);\n      if (children.length > 0) {\n        laySubtree(children, { x0: currentOffsetX, y0: y0 + heightStep }, depth + 1);\n      }\n      currentOffsetX += area;\n    }\n  };\n  laySubtree(outerNodes, { x0: outerX0, y0: outerY0 }, 0);\n  return result;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values as Values } from 'utility-types';\n\nimport { ArrayEntry, CHILDREN_KEY, DEPTH_KEY, entryValue, HierarchyOfArrays } from './group_by_rollup';\nimport { GOLDEN_RATIO } from '../../../../common/constants';\nimport { Pixels } from '../../../../common/geometry';\nimport { Part } from '../../../../common/text_utils';\n\nconst MAX_U_PADDING_RATIO = 0.0256197; // this limits area distortion to <10% (which occurs due to pixel padding) with very small rectangles\nconst MAX_TOP_PADDING_RATIO = 0.33; // this limits further area distortion to ~33%\n\ninterface LayoutElement {\n  nodes: HierarchyOfArrays;\n  dependentSize: number;\n  sectionSizes: number[];\n  sectionOffsets: number[];\n}\n\nfunction layVector(\n  nodes: HierarchyOfArrays,\n  independentSize: number,\n  areaAccessor: (e: ArrayEntry) => number,\n): LayoutElement {\n  const area = nodes.reduce((p, n) => p + areaAccessor(n), 0);\n  const dependentSize = independentSize === 0 ? 0 : area / independentSize; // here we lose a bit of accuracy\n  let currentOffset = 0;\n  const sectionOffsets = [currentOffset];\n  const sectionSizes = nodes.map((e, i) => {\n    const sectionSize = dependentSize === 0 ? 0 : areaAccessor(e) / dependentSize; // here we gain back a bit of accuracy\n    if (i < nodes.length - 1) sectionOffsets.push((currentOffset += sectionSize));\n    return sectionSize;\n  });\n\n  return { nodes, dependentSize, sectionSizes, sectionOffsets }; // descriptor for a vector (column or row) of elements (nodes)\n}\n\n/** @internal */\nexport function leastSquarishAspectRatio({ sectionSizes, dependentSize }: LayoutElement) {\n  if (dependentSize === 0) {\n    return 1;\n  }\n  return sectionSizes.reduce((p, n) => Math.min(p, n / dependentSize, dependentSize / n), 1);\n}\n\nconst NullLayoutElement: LayoutElement = {\n  nodes: [],\n  dependentSize: NaN,\n  sectionSizes: [],\n  sectionOffsets: [],\n};\n\n/**\n * Specifies whether partitions are laid out horizontally, vertically or treemap-like tiling for preferably squarish aspect ratios\n * @public\n */\nexport const LayerLayout = Object.freeze({\n  horizontal: 'horizontal' as const,\n  vertical: 'vertical' as const,\n  squarifying: 'squarifying' as const,\n});\n\n/**\n * Specifies whether partitions are laid out horizontally, vertically or treemap-like tiling for preferably squarish aspect ratios\n * @public\n */\nexport type LayerLayout = Values<typeof LayerLayout>; // could use ValuesType<typeof HierarchicalChartTypes>\n\nfunction bestVector(\n  nodes: HierarchyOfArrays,\n  height: number,\n  areaAccessor: (e: ArrayEntry) => number,\n  layout: LayerLayout | null,\n): LayoutElement {\n  let previousWorstAspectRatio = -1;\n  let currentWorstAspectRatio = 0;\n\n  let previousVectorLayout: LayoutElement = NullLayoutElement;\n  let currentVectorLayout: LayoutElement = NullLayoutElement;\n  let currentCount = 1;\n  do {\n    previousVectorLayout = currentVectorLayout;\n    previousWorstAspectRatio = currentWorstAspectRatio;\n    currentVectorLayout = layVector(nodes.slice(0, currentCount), height, areaAccessor);\n    currentWorstAspectRatio = leastSquarishAspectRatio(currentVectorLayout);\n  } while (currentCount++ < nodes.length && (layout || currentWorstAspectRatio > previousWorstAspectRatio));\n\n  return layout || currentWorstAspectRatio >= previousWorstAspectRatio ? currentVectorLayout : previousVectorLayout;\n}\n\nfunction vectorNodeCoordinates(vectorLayout: LayoutElement, x0Base: number, y0Base: number, vertical: boolean) {\n  const { nodes, dependentSize, sectionSizes, sectionOffsets } = vectorLayout;\n  return nodes.map((e: ArrayEntry, i: number) => {\n    const offset = sectionOffsets[i] ?? 0;\n    const size = sectionSizes[i] ?? 0;\n    const x0 = vertical ? x0Base + offset : x0Base;\n    const y0 = vertical ? y0Base : y0Base + offset;\n    const x1 = vertical ? x0 + size : x0 + dependentSize;\n    const y1 = vertical ? y0 + dependentSize : y0 + size;\n    return { node: e, x0, y0, x1, y1 };\n  });\n}\n\n/** @internal */\nexport const getTopPadding = (requestedTopPadding: number, fullHeight: Pixels) =>\n  Math.min(requestedTopPadding, fullHeight * MAX_TOP_PADDING_RATIO);\n\n/** @internal */\nexport function treemap(\n  nodes: HierarchyOfArrays,\n  areaAccessor: (e: ArrayEntry) => number,\n  topPaddingAccessor: (e: ArrayEntry) => number,\n  paddingAccessor: (e: ArrayEntry) => number,\n  {\n    x0: outerX0,\n    y0: outerY0,\n    width: outerWidth,\n    height: outerHeight,\n  }: { x0: number; y0: number; width: number; height: number },\n  layouts: LayerLayout[],\n): Array<Part> {\n  if (nodes.length === 0) return [];\n  // some bias toward horizontal rectangles with a golden ratio of width to height\n  const depth = (nodes[0]?.[1][DEPTH_KEY] ?? 1) - 1;\n  const layerLayout = layouts[depth] ?? null;\n  const vertical = layerLayout === LayerLayout.vertical || (!layerLayout && outerWidth / GOLDEN_RATIO <= outerHeight);\n  const independentSize = vertical ? outerWidth : outerHeight;\n  const vectorElements = bestVector(nodes, independentSize, areaAccessor, layerLayout);\n  const vector = vectorNodeCoordinates(vectorElements, outerX0, outerY0, vertical);\n  const { dependentSize } = vectorElements;\n  return vector\n    .concat(\n      ...vector.map(({ node, x0, y0, x1, y1 }) => {\n        const childrenNodes = entryValue(node)[CHILDREN_KEY];\n        if (childrenNodes.length === 0) {\n          return [];\n        }\n        const fullWidth = x1 - x0;\n        const fullHeight = y1 - y0;\n        const uPadding = Math.min(\n          paddingAccessor(node),\n          fullWidth * MAX_U_PADDING_RATIO * 2,\n          fullHeight * MAX_U_PADDING_RATIO * 2,\n        );\n        const topPadding = getTopPadding(topPaddingAccessor(node), fullHeight);\n        const width = fullWidth - 2 * uPadding;\n        const height = fullHeight - uPadding - topPadding;\n        return treemap(\n          childrenNodes,\n          (d) => ((width * height) / (fullWidth * fullHeight)) * areaAccessor(d),\n          topPaddingAccessor,\n          paddingAccessor,\n          {\n            x0: x0 + uPadding,\n            y0: y0 + topPadding,\n            width,\n            height,\n          },\n          layouts,\n        );\n      }),\n    )\n    .concat(\n      treemap(\n        nodes.slice(vector.length),\n        areaAccessor,\n        topPaddingAccessor,\n        paddingAccessor,\n        vertical\n          ? { x0: outerX0, y0: outerY0 + dependentSize, width: outerWidth, height: outerHeight - dependentSize }\n          : { x0: outerX0 + dependentSize, y0: outerY0, width: outerWidth - dependentSize, height: outerHeight },\n        layouts,\n      ),\n    );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CHILDREN_KEY, HierarchyOfArrays } from './group_by_rollup';\nimport { Part } from '../../../../common/text_utils';\n\n// 10 x 10 grid for 100 cells ie. one cell is 1%\nconst rowCount = 10;\nconst columnCount = 10;\n\n/** @internal */\nexport function waffle(\n  tree: HierarchyOfArrays,\n  totalValue: number,\n  {\n    x0: outerX0,\n    y0: outerY0,\n    width: outerWidth,\n    height: outerHeight,\n  }: { x0: number; y0: number; width: number; height: number },\n): Array<Part> {\n  const root = tree[0];\n  if (!root || !root[1]) return [];\n\n  const size = Math.min(outerWidth, outerHeight);\n  const widthOffset = Math.max(0, outerWidth - size) / 2;\n  const heightOffset = Math.max(0, outerHeight - size) / 2;\n  const rowHeight = size / rowCount;\n  const columnWidth = size / columnCount;\n  const cellCount = rowCount * columnCount;\n  const valuePerCell = totalValue / cellCount;\n  let valueSoFar = 0;\n  let lastIndex = 0;\n\n  return [\n    { node: root, x0: 0, y0: 0, x1: size, y1: size },\n    ...root[1][CHILDREN_KEY].flatMap((entry) => {\n      const [, { value }] = entry;\n      valueSoFar += value;\n      const toIndex = Math.round(valueSoFar / valuePerCell);\n      const cells = [];\n      for (let i = lastIndex; i < toIndex; i++) {\n        const columnIndex = i % columnCount;\n        const rowIndex = (i - columnIndex) / columnCount;\n        const x0 = outerX0 + widthOffset + columnIndex * columnWidth;\n        const y0 = outerY0 + heightOffset + rowIndex * rowHeight;\n        cells.push({\n          node: entry,\n          x0,\n          y0,\n          x1: x0 + columnWidth,\n          y1: y0 + rowHeight,\n        });\n      }\n      lastIndex = toIndex;\n      return cells;\n    }),\n  ];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RectangleConstruction } from './viewmodel';\nimport { TAU } from '../../../../common/constants';\nimport {\n  Coordinate,\n  Distance,\n  Pixels,\n  PointTuple,\n  Radian,\n  Ratio,\n  RingSectorConstruction,\n  trueBearingToStandardPositionAngle,\n  wrapToTau,\n} from '../../../../common/geometry';\nimport { logarithm } from '../../../../common/math';\nimport { Box, Font, HorizontalAlignment, PartialFont, VerticalAlignments } from '../../../../common/text_utils';\nimport { integerSnap, monotonicHillClimb } from '../../../../solvers/monotonic_hill_climb';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { ValueFormatter, getOppositeAlignment, isRTLString } from '../../../../utils/common';\nimport { FillLabelConfig, Padding, PartitionStyle } from '../../../../utils/themes/partition';\nimport { Layer } from '../../specs';\nimport {\n  QuadViewModel,\n  RawTextGetter,\n  RowBox,\n  RowSet,\n  RowSpace,\n  ShapeTreeNode,\n  ValueGetterFunction,\n} from '../types/viewmodel_types';\nimport { conjunctiveConstraint, INFINITY_RADIUS, makeRowCircline } from '../utils/circline_geometry';\n\n/**\n * todo pick a better unique key for the slices (D3 doesn't keep track of an index)\n * @internal\n */\nexport function nodeId(node: ShapeTreeNode): string {\n  return `${node.x0}|${node.y0}`;\n}\n\n/** @internal */\nexport const getSectorRowGeometry: GetShapeRowGeometry<RingSectorConstruction> = (\n  ringSector,\n  cx,\n  cy,\n  totalRowCount,\n  linePitch,\n  rowIndex,\n  fontSize,\n  rotation,\n) => {\n  const offset = (totalRowCount / 2) * fontSize + fontSize / 2 - linePitch * rowIndex;\n\n  const topCircline = makeRowCircline(cx, cy, offset, rotation, fontSize, 1);\n  const bottomCircline = makeRowCircline(cx, cy, offset, rotation, fontSize, -1);\n  const midCircline = makeRowCircline(cx, cy, offset, rotation, 0, 0);\n\n  const valid1 = conjunctiveConstraint(ringSector, { ...topCircline, from: 0, to: TAU })[0];\n  if (!valid1) return { rowAnchorX: cx, rowAnchorY: cy, maximumRowLength: 0 };\n  const valid2 = conjunctiveConstraint(ringSector, { ...bottomCircline, from: 0, to: TAU })[0];\n  if (!valid2) return { rowAnchorX: cx, rowAnchorY: cy, maximumRowLength: 0 };\n  const from = Math.max(valid1.from, valid2.from);\n  const to = Math.min(valid1.to, valid2.to);\n  const midAngle = (from + to) / 2;\n  const cheapTangent = Math.max(0, to - from); /* Math.tan(Math.max(0, to - from)) */ // https://en.wikipedia.org/wiki/Small-angle_approximation\n  const rowAnchorX = midCircline.r * Math.cos(midAngle) + midCircline.x;\n  const rowAnchorY = midCircline.r * Math.sin(midAngle) + midCircline.y;\n  const maximumRowLength = cheapTangent * INFINITY_RADIUS;\n  return { rowAnchorX, rowAnchorY, maximumRowLength };\n};\n\nfunction getVerticalAlignment(\n  container: RectangleConstruction,\n  verticalAlignment: VerticalAlignments,\n  linePitch: Pixels,\n  totalRowCount: number,\n  rowIndex: number,\n  paddingTop: Pixels,\n  paddingBottom: Pixels,\n  fontSize: Pixels,\n  overhang: Ratio,\n) {\n  switch (verticalAlignment) {\n    case VerticalAlignments.top:\n      return -(container.y0 + linePitch * rowIndex + paddingTop + fontSize * overhang);\n    case VerticalAlignments.bottom:\n      return -(container.y1 - linePitch * (totalRowCount - 1 - rowIndex) - paddingBottom - fontSize * overhang);\n    default:\n      return -((container.y0 + container.y1) / 2 + (linePitch * (rowIndex + 1 - totalRowCount)) / 2);\n  }\n}\n\n/** @internal */\nexport const getRectangleRowGeometry: GetShapeRowGeometry<RectangleConstruction> = (\n  container,\n  cx,\n  cy,\n  totalRowCount,\n  linePitch,\n  rowIndex,\n  fontSize,\n  _rotation,\n  verticalAlignment,\n  padding,\n) => {\n  const defaultPad: Pixels = 2;\n  const { top, right, bottom, left } =\n    typeof padding === 'number'\n      ? { top: padding, right: padding, bottom: padding, left: padding }\n      : {\n          top: defaultPad,\n          right: defaultPad,\n          bottom: defaultPad,\n          left: defaultPad,\n          ...padding,\n        };\n\n  const overhang = 0.05;\n  const topPaddingAdjustment = fontSize < 6 ? 0 : Math.max(1, Math.min(2, fontSize / 16));\n  const adjustedTop = top + topPaddingAdjustment; // taper out paddingTop with small fonts\n  if ((container.y1 - container.y0 - adjustedTop - bottom) / totalRowCount < linePitch) {\n    return {\n      rowAnchorX: NaN,\n      rowAnchorY: NaN,\n      maximumRowLength: 0,\n    };\n  }\n\n  const rowAnchorY = getVerticalAlignment(\n    container,\n    verticalAlignment,\n    linePitch,\n    totalRowCount,\n    rowIndex,\n    adjustedTop,\n    bottom,\n    fontSize,\n    overhang,\n  );\n\n  return {\n    rowAnchorX: cx + left / 2 - right / 2,\n    rowAnchorY,\n    maximumRowLength: container.x1 - container.x0 - left - right,\n  };\n};\n\nfunction rowSetComplete(rowSet: RowSet, measuredBoxes: RowBox[]) {\n  return (\n    measuredBoxes.length === 0 &&\n    !rowSet.rows.some((r) => !Number.isFinite(r.length) || r.rowWords.every((rw) => rw.text.length === 0))\n  );\n}\n\nfunction identityRowSet(): RowSet {\n  return {\n    id: '',\n    rows: [],\n    fontSize: NaN,\n    fillTextColor: '',\n    rotation: NaN,\n    isRTL: false,\n    verticalAlignment: VerticalAlignments.middle,\n    horizontalAlignment: HorizontalAlignment.center,\n  };\n}\n\nfunction getAllBoxes(\n  rawTextGetter: RawTextGetter,\n  valueGetter: ValueGetterFunction,\n  valueFormatter: ValueFormatter,\n  sizeInvariantFontShorthand: Font,\n  valueFont: PartialFont,\n  node: ShapeTreeNode,\n): Box[] {\n  return rawTextGetter(node)\n    .split(' ')\n    .filter(Boolean)\n    .map<Box>((text) => ({ text, ...sizeInvariantFontShorthand, isValue: false }))\n    .concat(\n      [valueFormatter(valueGetter(node))]\n        .filter(Boolean)\n        .map<Box>((text) => ({ text, ...sizeInvariantFontShorthand, ...valueFont, isValue: true })),\n    );\n}\n\nfunction getWordSpacing(fontSize: number) {\n  return fontSize / 4;\n}\n\ntype GetShapeRowGeometry<C> = (\n  container: C,\n  cx: Distance,\n  cy: Distance,\n  targetRowCount: number,\n  linePitch: Pixels,\n  currentRowIndex: number,\n  fontSize: Pixels,\n  rotation: Radian,\n  verticalAlignment: VerticalAlignments,\n  padding: Padding,\n) => RowSpace;\n\ntype ShapeConstructor<C> = (n: ShapeTreeNode) => C;\n\nfunction fill<C>(\n  shapeConstructor: ShapeConstructor<C>,\n  getShapeRowGeometry: GetShapeRowGeometry<C>,\n  getRotation: GetRotation,\n) {\n  return function fillClosure(\n    fillLabel: FillLabelConfig,\n    layers: Layer[],\n    measure: TextMeasure,\n    rawTextGetter: RawTextGetter,\n    valueGetter: ValueGetterFunction,\n    formatter: ValueFormatter,\n    maxRowCount: number,\n    leftAlign: boolean,\n    middleAlign: boolean,\n  ) {\n    const horizontalAlignment = leftAlign ? HorizontalAlignment.left : HorizontalAlignment.center;\n    return (allFontSizes: Pixels[][], textFillOrigin: PointTuple, node: QuadViewModel): RowSet => {\n      const container = shapeConstructor(node);\n      const rotation = getRotation(node);\n\n      const layer = layers[node.depth - 1];\n\n      if (!layer) {\n        throw new Error(`Failed to find layer at ${node.depth - 1}`);\n      }\n\n      const verticalAlignment = middleAlign\n        ? VerticalAlignments.middle\n        : node.depth < layers.length\n          ? VerticalAlignments.bottom\n          : VerticalAlignments.top;\n      const fontSizes = allFontSizes[Math.min(node.depth, allFontSizes.length) - 1] ?? [];\n      const { fontStyle, fontVariant, fontFamily, fontWeight, valueFormatter, padding, clipText } = {\n        ...fillLabel,\n        valueFormatter: formatter,\n        ...layer.fillLabel,\n        ...layer.shape,\n      };\n\n      const valueFont = {\n        ...fillLabel,\n        ...fillLabel.valueFont,\n        ...layer.fillLabel,\n        ...layer.fillLabel?.valueFont,\n      };\n\n      const sizeInvariantFont: Font = {\n        fontStyle,\n        fontVariant,\n        fontWeight,\n        fontFamily,\n        textColor: node.textColor,\n      };\n      const isRtlString = isRTLString(rawTextGetter(node));\n      const allBoxes = getAllBoxes(rawTextGetter, valueGetter, valueFormatter, sizeInvariantFont, valueFont, node);\n      const [cx, cy] = textFillOrigin;\n\n      return {\n        ...getRowSet(\n          allBoxes,\n          maxRowCount,\n          fontSizes,\n          measure,\n          rotation,\n          verticalAlignment,\n          horizontalAlignment,\n          container,\n          getShapeRowGeometry,\n          cx,\n          cy,\n          padding,\n          node,\n          clipText,\n          isRtlString,\n        ),\n        fillTextColor: node.textColor,\n      };\n    };\n  };\n}\n\nfunction tryFontSize<C>(\n  measure: TextMeasure,\n  rotation: Radian,\n  verticalAlignment: VerticalAlignments,\n  horizontalAlignment: HorizontalAlignment,\n  container: C,\n  getShapeRowGeometry: GetShapeRowGeometry<C>,\n  cx: Coordinate,\n  cy: Coordinate,\n  padding: Padding,\n  node: ShapeTreeNode,\n  boxes: Box[],\n  maxRowCount: number,\n  clipText: boolean,\n  isRTL: boolean,\n) {\n  const adjustedHorizontalAlignment = isRTL ? getOppositeAlignment(horizontalAlignment) : horizontalAlignment;\n  return function tryFontSizeFn(initialRowSet: RowSet, fontSize: Pixels): { rowSet: RowSet; completed: boolean } {\n    let rowSet: RowSet = initialRowSet;\n\n    const wordSpacing = getWordSpacing(fontSize);\n\n    // model text pieces, obtaining their width at the current font size\n    const allMeasuredBoxes = boxes.map<RowBox>((box) => {\n      const { width } = measure(box.text, box, fontSize);\n      return {\n        width,\n        wordBeginning: NaN,\n        ...box,\n        fontSize, // iterated fontSize overrides a possible more global fontSize\n      };\n    });\n    const linePitch = fontSize;\n\n    // rowSet building starts\n    let targetRowCount = 0;\n    let measuredBoxes = allMeasuredBoxes.slice();\n    let innerCompleted = false;\n\n    // iterate through possible target row counts\n    while (++targetRowCount <= maxRowCount && !innerCompleted) {\n      measuredBoxes = allMeasuredBoxes.slice();\n      rowSet = {\n        id: nodeId(node),\n        fontSize,\n        fillTextColor: '',\n        rotation,\n        verticalAlignment,\n        horizontalAlignment: adjustedHorizontalAlignment,\n        clipText,\n        isRTL,\n        rows: [...new Array(targetRowCount)].map(() => ({\n          rowWords: [],\n          rowAnchorX: NaN,\n          rowAnchorY: NaN,\n          maximumLength: NaN,\n          length: NaN,\n        })),\n        container,\n      };\n\n      let currentRowIndex = 0;\n\n      // iterate through rows\n      while (currentRowIndex < targetRowCount) {\n        const currentRow = rowSet.rows[currentRowIndex];\n\n        if (!currentRow) {\n          currentRowIndex++;\n          continue;\n        }\n\n        const currentRowWords = currentRow.rowWords;\n\n        // current row geometries\n        const { maximumRowLength, rowAnchorX, rowAnchorY } = getShapeRowGeometry(\n          container,\n          cx,\n          cy,\n          targetRowCount,\n          linePitch,\n          currentRowIndex,\n          fontSize,\n          rotation,\n          verticalAlignment,\n          padding,\n        );\n\n        currentRow.rowAnchorX = rowAnchorX;\n        currentRow.rowAnchorY = rowAnchorY;\n        currentRow.maximumLength = maximumRowLength;\n\n        // row building starts\n        let currentRowLength = 0;\n        let rowHasRoom = true;\n\n        // iterate through words: keep adding words while there's room\n        while (measuredBoxes.length > 0 && rowHasRoom) {\n          // adding box to row\n          const [currentBox] = measuredBoxes;\n          if (!currentBox) continue;\n          const wordBeginning = currentRowLength;\n          currentRowLength += currentBox.width + wordSpacing;\n\n          if (clipText || currentRowLength <= currentRow.maximumLength) {\n            currentRowWords.push({ ...currentBox, wordBeginning });\n            currentRow.length = currentRowLength;\n            measuredBoxes.shift();\n          } else {\n            rowHasRoom = false;\n          }\n        }\n\n        currentRowIndex++;\n      }\n\n      innerCompleted = rowSetComplete(rowSet, measuredBoxes);\n    }\n    const completed = measuredBoxes.length === 0;\n    return { rowSet, completed };\n  };\n}\n\nfunction getRowSet<C>(\n  boxes: Box[],\n  maxRowCount: number,\n  fontSizes: Pixels[],\n  measure: TextMeasure,\n  rotation: Radian,\n  verticalAlignment: VerticalAlignments,\n  horizontalAlignment: HorizontalAlignment,\n  container: C,\n  getShapeRowGeometry: GetShapeRowGeometry<C>,\n  cx: Coordinate,\n  cy: Coordinate,\n  padding: Padding,\n  node: ShapeTreeNode,\n  clipText: boolean,\n  isRtl: boolean,\n): RowSet {\n  const tryFunction = tryFontSize(\n    measure,\n    rotation,\n    verticalAlignment,\n    horizontalAlignment,\n    container,\n    getShapeRowGeometry,\n    cx,\n    cy,\n    padding,\n    node,\n    boxes,\n    maxRowCount,\n    clipText,\n    isRtl,\n  );\n\n  // find largest fitting font size\n  const largestIndex = fontSizes.length - 1;\n  const response = (i: number) =>\n    i + (tryFunction(identityRowSet(), fontSizes[i] ?? 0).completed ? 0 : largestIndex + 1);\n  const fontSizeIndex = monotonicHillClimb(response, largestIndex, largestIndex, integerSnap);\n\n  if (!(fontSizeIndex >= 0)) {\n    return identityRowSet();\n  }\n\n  const { rowSet, completed } = tryFunction(identityRowSet(), fontSizes[fontSizeIndex] ?? 0); // todo in the future, make the hill climber also yield the result to avoid this +1 call\n  return { ...rowSet, rows: rowSet.rows.filter((r) => completed && Number.isFinite(r.length)) };\n}\n\n/** @internal */\nexport function inSectorRotation(horizontalTextEnforcer: number, horizontalTextAngleThreshold: number) {\n  return (node: ShapeTreeNode): Radian => {\n    let rotation = trueBearingToStandardPositionAngle((node.x0 + node.x1) / 2);\n    if (Math.abs(node.x1 - node.x0) > horizontalTextAngleThreshold && horizontalTextEnforcer > 0)\n      rotation *= 1 - horizontalTextEnforcer;\n    if (TAU / 4 < rotation && rotation < (3 * TAU) / 4) rotation = wrapToTau(rotation - TAU / 2);\n    return rotation;\n  };\n}\n\ntype GetRotation = (node: ShapeTreeNode) => Radian;\n\n/** @internal */\nexport function fillTextLayout<C>(\n  shapeConstructor: ShapeConstructor<C>,\n  getShapeRowGeometry: GetShapeRowGeometry<C>,\n  getRotation: GetRotation,\n) {\n  const specificFiller = fill(shapeConstructor, getShapeRowGeometry, getRotation);\n  return function fillTextLayoutClosure(\n    measure: TextMeasure,\n    rawTextGetter: RawTextGetter,\n    valueGetter: ValueGetterFunction,\n    valueFormatter: ValueFormatter,\n    childNodes: QuadViewModel[],\n    style: PartitionStyle,\n    layers: Layer[],\n    textFillOrigins: PointTuple[],\n    maxRowCount: number,\n    leftAlign: boolean,\n    middleAlign: boolean,\n  ): RowSet[] {\n    const allFontSizes: Pixels[][] = [];\n    for (let l = 0; l <= layers.length; l++) {\n      // get font size spec from config, which layer.fillLabel properties can override\n      const { minFontSize, maxFontSize, idealFontSizeJump } = {\n        ...style,\n        ...(l < layers.length && layers[l]?.fillLabel),\n      };\n      const fontSizeMagnification = maxFontSize / minFontSize;\n      const fontSizeJumpCount = Math.round(logarithm(idealFontSizeJump, fontSizeMagnification));\n      const realFontSizeJump = Math.pow(fontSizeMagnification, 1 / fontSizeJumpCount);\n      const fontSizes: Pixels[] = [];\n      for (let i = 0; i <= fontSizeJumpCount; i++) {\n        const fontSize = Math.round(minFontSize * Math.pow(realFontSizeJump, i));\n        if (!fontSizes.includes(fontSize)) {\n          fontSizes.push(fontSize);\n        }\n      }\n      allFontSizes.push(fontSizes);\n    }\n\n    const filler = specificFiller(\n      style.fillLabel,\n      layers,\n      measure,\n      rawTextGetter,\n      valueGetter,\n      valueFormatter,\n      maxRowCount,\n      leftAlign,\n      middleAlign,\n    );\n\n    return childNodes\n      .map((node: QuadViewModel, i: number) => ({ node, origin: textFillOrigins[i] }))\n      .sort((a, b) => b.node.value - a.node.value)\n      .reduce<{ rowSets: RowSet[]; fontSizes: Pixels[][] }>(\n        ({ rowSets, fontSizes }, { node, origin }) => {\n          if (!origin) return { rowSets, fontSizes };\n          const nextRowSet = filler(fontSizes, origin, node);\n          const { fontSize } = nextRowSet;\n          const layerIndex = node.depth - 1;\n          return {\n            rowSets: [...rowSets, nextRowSet],\n            fontSizes: fontSizes.map((layerFontSizes: Pixels[], index: number) =>\n              Number.isFinite(fontSize) && index === layerIndex && !layers[layerIndex]?.fillLabel?.maximizeFontSize\n                ? layerFontSizes.filter((size: Pixels) => size <= fontSize)\n                : layerFontSizes,\n            ),\n          };\n        },\n        { rowSets: [], fontSizes: allFontSizes },\n      ).rowSets;\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isMosaic, isSunburst, isTreemap, isWaffle } from './viewmodel';\nimport { LegendItemExtraValues } from '../../../../common/legend';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { Relation } from '../../../../common/text_utils';\nimport { LegendPath } from '../../../../state/actions/legend';\nimport { IndexedAccessorFn } from '../../../../utils/accessor';\nimport { Datum, ValueAccessor, ValueFormatter } from '../../../../utils/common';\nimport { Layer } from '../../specs';\nimport { PartitionLayout } from '../types/config_types';\nimport {\n  aggregators,\n  CHILDREN_KEY,\n  groupByRollup,\n  HIERARCHY_ROOT_KEY,\n  HierarchyOfArrays,\n  mapEntryValue,\n  mapsToArrays,\n  NodeSorter,\n  Sorter,\n} from '../utils/group_by_rollup';\n\nfunction aggregateComparator(accessor: (v: any) => any, sorter: Sorter): NodeSorter {\n  return (a, b) => sorter(accessor(a), accessor(b));\n}\n\nconst ascending: Sorter = (a, b) => a - b;\nconst descending: Sorter = (a, b) => b - a;\n\nconst childOrders = {\n  ascending,\n  descending,\n};\n\nconst descendingValueNodes = aggregateComparator(mapEntryValue, childOrders.descending);\nconst ascendingValueNodes = aggregateComparator(mapEntryValue, childOrders.ascending);\n\n/**\n * @internal\n */\nexport function getHierarchyOfArrays(\n  rawFacts: Relation,\n  valueAccessor: ValueAccessor,\n  groupByRollupAccessors: IndexedAccessorFn[],\n  sortSpecs: (NodeSorter | null)[],\n  innerGroups: LegendPath,\n): HierarchyOfArrays {\n  const aggregator = aggregators.sum;\n\n  const facts = rawFacts.filter((n) => {\n    const value = valueAccessor(n);\n    return Number.isFinite(value) && value >= 0;\n  });\n\n  // don't render anything if the total, the width or height is not positive or zero\n  if (facts.reduce((p: number, n) => aggregator.reducer(p, valueAccessor(n)), aggregator.identity()) <= 0) {\n    return [];\n  }\n\n  // We can precompute things invariant of how the rectangle is divvied up.\n  // By introducing `scale`, we no longer need to deal with the dichotomy of\n  // size as data value vs size as number of pixels in the rectangle\n  return mapsToArrays(groupByRollup(groupByRollupAccessors, valueAccessor, aggregator, facts), sortSpecs, innerGroups);\n}\n\nconst sorter =\n  (layout: PartitionLayout) =>\n  ({ sortPredicate }: Layer, i: number) =>\n    sortPredicate ||\n    (isTreemap(layout) || isSunburst(layout) || isWaffle(layout)\n      ? descendingValueNodes\n      : isMosaic(layout)\n        ? i === 2\n          ? ascendingValueNodes\n          : descendingValueNodes\n        : null);\n\n/** @internal */\nexport function partitionTree(\n  data: Datum[],\n  valueAccessor: ValueAccessor,\n  layers: Layer[],\n  layout: PartitionLayout,\n  innerGroups: LegendPath,\n) {\n  return getHierarchyOfArrays(\n    data,\n    valueAccessor,\n    [() => HIERARCHY_ROOT_KEY, ...layers.map(({ groupByRollup }) => groupByRollup)],\n    [null, ...layers.map(sorter(layout))],\n    innerGroups,\n  );\n}\n\n/**\n * Creates flat extra value map from nested key path\n * @internal\n */\nexport function getExtraValueMap(\n  layers: Layer[],\n  valueFormatter: ValueFormatter,\n  tree: HierarchyOfArrays,\n  maxDepth: number,\n  depth: number = 0,\n  keys: Map<SeriesKey, LegendItemExtraValues> = new Map(),\n): Map<SeriesKey, LegendItemExtraValues> {\n  for (let i = 0; i < tree.length; i++) {\n    const branch = tree[i];\n    if (!branch) continue;\n    const [key, arrayNode] = branch;\n    const { value, path, [CHILDREN_KEY]: children } = arrayNode;\n    const values: LegendItemExtraValues = new Map();\n    const formattedValue = valueFormatter ? valueFormatter(value) : `${value}`;\n    values.set(key, { formatted: formattedValue, raw: value });\n    keys.set(path.map(({ index }) => index).join('__'), values);\n    if (depth < maxDepth) getExtraValueMap(layers, valueFormatter, children, maxDepth, depth + 1, keys);\n  }\n  return keys;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba } from '../../../../common/color_library_wrappers';\nimport { Color } from '../../../../common/colors';\nimport { TAU } from '../../../../common/constants';\nimport { fillTextColor } from '../../../../common/fill_text_color';\nimport {\n  Distance,\n  meanAngle,\n  Pixels,\n  PointTuple,\n  PointTuples,\n  trueBearingToStandardPositionAngle,\n} from '../../../../common/geometry';\nimport { cutToLength, fitText, Font, measureOneBoxWidth } from '../../../../common/text_utils';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { ColorVariant, isRTLString, ValueFormatter } from '../../../../utils/common';\nimport { Logger } from '../../../../utils/logger';\nimport { Point } from '../../../../utils/point';\nimport { LinkLabelConfig, PartitionStyle } from '../../../../utils/themes/partition';\nimport { BackgroundStyle } from '../../../../utils/themes/theme';\nimport { LinkLabelVM, RawTextGetter, ShapeTreeNode, ValueGetterFunction } from '../types/viewmodel_types';\n\n/** @internal */\nexport interface LinkLabelsViewModelSpec {\n  linkLabels: LinkLabelVM[];\n  labelFontSpec: Font;\n  valueFontSpec: Font;\n  strokeColor: Color;\n}\n\n/** @internal */\nexport function linkTextLayout(\n  rectWidth: Distance,\n  rectHeight: Distance,\n  measure: TextMeasure,\n  style: PartitionStyle,\n  nodesWithoutRoom: ShapeTreeNode[],\n  currentY: Distance[],\n  anchorRadius: Distance,\n  rawTextGetter: RawTextGetter,\n  valueGetter: ValueGetterFunction,\n  valueFormatter: ValueFormatter,\n  maxTextLength: number,\n  diskCenter: Point,\n  { color: backgroundColor, fallbackColor: fallbackBGColor }: BackgroundStyle,\n): LinkLabelsViewModelSpec {\n  const { linkLabel } = style;\n  const maxDepth = nodesWithoutRoom.reduce((p: number, n: ShapeTreeNode) => Math.max(p, n.depth), 0);\n  const yRelativeIncrement = Math.sin(linkLabel.stemAngle) * linkLabel.minimumStemLength;\n  const rowPitch = linkLabel.fontSize + linkLabel.spacing;\n\n  const linkLabels: LinkLabelVM[] = nodesWithoutRoom\n    .filter((n: ShapeTreeNode) => n.depth === maxDepth) // only the outermost ring can have links\n    .sort((n1: ShapeTreeNode, n2: ShapeTreeNode) => Math.abs(n2.x0 - n2.x1) - Math.abs(n1.x0 - n1.x1))\n    .slice(0, linkLabel.maxCount) // largest linkLabel.MaxCount slices\n    .sort(linkLabelCompare)\n    .map(\n      nodeToLinkLabel({\n        linkLabel,\n        anchorRadius,\n        currentY,\n        rowPitch,\n        yRelativeIncrement,\n        rawTextGetter,\n        maxTextLength,\n        valueFormatter,\n        valueGetter,\n        measure,\n        rectWidth,\n        rectHeight,\n        diskCenter,\n      }),\n    )\n    .filter(({ text }) => text !== ''); // cull linked labels whose text was truncated to nothing;\n\n  if (colorToRgba(backgroundColor)[3] < 1) {\n    // Override handled in fill_text_color.ts\n    Logger.expected(\n      'Text contrast requires an opaque background color, using fallbackColor',\n      'an opaque color',\n      backgroundColor,\n    );\n  }\n  const textColor =\n    linkLabel.textColor === ColorVariant.Adaptive\n      ? fillTextColor(fallbackBGColor, null, backgroundColor).color.keyword\n      : linkLabel.textColor;\n  const labelFontSpec: Font = { ...linkLabel, textColor };\n  const valueFontSpec: Font = { ...linkLabel, ...linkLabel.valueFont, textColor };\n\n  return { linkLabels, valueFontSpec, labelFontSpec, strokeColor: textColor };\n}\n\nfunction linkLabelCompare(n1: ShapeTreeNode, n2: ShapeTreeNode) {\n  const mid1 = meanAngle(n1.x0, n1.x1);\n  const mid2 = meanAngle(n2.x0, n2.x1);\n  const dist1 = Math.min(Math.abs(mid1 - TAU / 4), Math.abs(mid1 - (3 * TAU) / 4));\n  const dist2 = Math.min(Math.abs(mid2 - TAU / 4), Math.abs(mid2 - (3 * TAU) / 4));\n  return dist1 - dist2;\n}\n\nfunction nodeToLinkLabel({\n  linkLabel,\n  anchorRadius,\n  currentY,\n  rowPitch,\n  yRelativeIncrement,\n  rawTextGetter,\n  maxTextLength,\n  valueFormatter,\n  valueGetter,\n  measure,\n  rectWidth,\n  rectHeight,\n  diskCenter,\n}: {\n  linkLabel: LinkLabelConfig;\n  anchorRadius: Distance;\n  currentY: Distance[];\n  rowPitch: Pixels;\n  yRelativeIncrement: Distance;\n  rawTextGetter: RawTextGetter;\n  maxTextLength: number;\n  valueFormatter: ValueFormatter;\n  valueGetter: ValueGetterFunction;\n  measure: TextMeasure;\n  rectWidth: Distance;\n  rectHeight: Distance;\n  diskCenter: Point;\n}) {\n  const labelFont: Font = linkLabel; // only interested in the font properties\n  const valueFont: Font = { ...labelFont, ...linkLabel.valueFont }; // only interested in the font properties\n  return function nodeToLinkLabelMap(node: ShapeTreeNode): LinkLabelVM {\n    // geometry\n    const midAngle = trueBearingToStandardPositionAngle((node.x0 + node.x1) / 2);\n    const north = midAngle < TAU / 2 ? 1 : -1;\n    const rightSide = TAU / 4 < midAngle && midAngle < (3 * TAU) / 4 ? 0 : 1;\n    const west = rightSide ? 1 : -1;\n    const cos = Math.cos(midAngle);\n    const sin = Math.sin(midAngle);\n    const x0 = cos * anchorRadius;\n    const y0 = sin * anchorRadius;\n    const x = cos * (anchorRadius + linkLabel.radiusPadding);\n    const y = sin * (anchorRadius + linkLabel.radiusPadding);\n    const stemFromX = x; // might be different in the future, eg. to allow a small gap: doc purpose\n    const stemFromY = y; // might be different in the future, eg. to allow a small gap: doc purpose\n\n    // calculate and remember vertical offset, as linked labels accrete\n    const poolIndex = rightSide + (1 - north);\n    const relativeY = north * y;\n    const yOffset = Math.max((currentY[poolIndex] ?? 0) + rowPitch, relativeY + yRelativeIncrement, rowPitch / 2);\n    currentY[poolIndex] = yOffset;\n\n    // more geometry: the part that depends on vertical position\n    const cy = north * yOffset;\n    const stemToX = x + north * west * cy - west * relativeY;\n    const stemToY = cy;\n    const translateX = stemToX + west * (linkLabel.horizontalStemLength + linkLabel.gap);\n    const translate: PointTuple = [translateX, stemToY];\n\n    // the path points of the label link, ie. a polyline\n    const linkLabels: PointTuples = [\n      [x0, y0],\n      [stemFromX, stemFromY],\n      [stemToX, stemToY],\n      [stemToX + west * linkLabel.horizontalStemLength, stemToY],\n    ];\n\n    const rawLabelText = rawTextGetter(node);\n    const isRTL = isRTLString(rawLabelText);\n\n    // value text is simple: the full, formatted value is always shown, not truncated\n    const valueText = valueFormatter(valueGetter(node));\n    const valueWidth = measureOneBoxWidth(measure, linkLabel.fontSize, {\n      ...valueFont,\n      text: valueText,\n      isValue: false,\n    });\n    const widthAdjustment = valueWidth + 2 * linkLabel.fontSize; // gap between label and value, plus possibly 2em wide ellipsis\n\n    // label text removes space allotted for value and gaps, then tries to fit as much as possible\n    const labelText = cutToLength(rawLabelText, maxTextLength);\n    const allottedLabelWidth = Math.max(\n      0,\n      rightSide ? rectWidth - diskCenter.x - translateX - widthAdjustment : diskCenter.x + translateX - widthAdjustment,\n    );\n    const { text, width } =\n      linkLabel.fontSize / 2 <= cy + diskCenter.y && cy + diskCenter.y <= rectHeight - linkLabel.fontSize / 2\n        ? fitText(measure, labelText, allottedLabelWidth, linkLabel.fontSize, labelFont)\n        : { text: '', width: 0 };\n\n    return {\n      isRTL,\n      linkLabels,\n      translate,\n      text,\n      valueText,\n      width,\n      valueWidth,\n      textAlign: rightSide ? 'left' : 'right',\n    };\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isLinear } from './viewmodel';\nimport { TooltipInfo } from '../../../../components/tooltip';\nimport { LayerValue, TooltipValue } from '../../../../specs';\nimport { LabelAccessor, ValueFormatter } from '../../../../utils/common';\nimport { SpecId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { ContinuousDomainFocus } from '../../renderer/canvas/partition';\nimport { MODEL_KEY, percentValueGetter } from '../config';\nimport { QuadViewModel, ShapeViewModel } from '../types/viewmodel_types';\nimport {\n  AGGREGATE_KEY,\n  ArrayNode,\n  CHILDREN_KEY,\n  DEPTH_KEY,\n  entryValue,\n  getNodeName,\n  PARENT_KEY,\n  PATH_KEY,\n  SORT_INDEX_KEY,\n} from '../utils/group_by_rollup';\n\n/** @internal */\nexport const pickedShapes = (\n  models: ShapeViewModel[],\n  { x, y }: Point,\n  [focus]: ContinuousDomainFocus[],\n): QuadViewModel[] =>\n  focus ? models.flatMap(({ diskCenter, pickQuads }) => pickQuads(x - diskCenter.x, y - diskCenter.y, focus)) : [];\n\n/** @internal */\nexport function pickShapesLayerValues(shapes: QuadViewModel[]): LayerValue[][] {\n  const maxDepth = shapes.reduce((acc, curr) => Math.max(acc, curr.depth), 0);\n  return shapes\n    .filter(({ depth }) => depth === maxDepth) // eg. lowest layer in a treemap, where layers overlap in screen space; doesn't apply to sunburst/flame\n    .map<LayerValue[]>((viewModel) => {\n      const values: LayerValue[] = [\n        {\n          smAccessorValue: viewModel.smAccessorValue,\n          groupByRollup: viewModel.dataName,\n          value: viewModel[AGGREGATE_KEY],\n          depth: viewModel[DEPTH_KEY],\n          sortIndex: viewModel[SORT_INDEX_KEY],\n          path: viewModel[PATH_KEY],\n        },\n      ];\n      let node = viewModel[MODEL_KEY];\n      while (node[DEPTH_KEY] > 0) {\n        const value = node[AGGREGATE_KEY];\n        const dataName = getNodeName(node);\n        values.push({\n          smAccessorValue: viewModel.smAccessorValue,\n          groupByRollup: dataName,\n          value,\n          depth: node[DEPTH_KEY],\n          sortIndex: node[SORT_INDEX_KEY],\n          path: node[PATH_KEY],\n        });\n\n        node = node[PARENT_KEY];\n      }\n      return values.reverse();\n    });\n}\n\n/** @internal */\nexport function pickShapesTooltipValues(\n  shapes: QuadViewModel[],\n  shapeViewModel: ShapeViewModel[],\n  valueFormatter: ValueFormatter,\n  percentFormatter: ValueFormatter,\n  id: SpecId,\n): TooltipInfo {\n  const maxDepth = shapes.reduce((acc, curr) => Math.max(acc, curr.depth), 0);\n  const currentShapeViewModel = shapeViewModel.find((d) => d.smAccessorValue === shapes[0]?.smAccessorValue);\n  if (!currentShapeViewModel) {\n    return { values: [], header: null };\n  }\n  const labelFormatters = currentShapeViewModel.layers.map((d) => d.nodeLabel);\n\n  return {\n    header: null,\n    values: shapes\n      .filter(({ depth }) => depth === maxDepth) // eg. lowest layer in a treemap, where layers overlap in screen space; doesn't apply to sunburst/flame\n      .flatMap<TooltipValue>((viewModel) => {\n        const entryNode = viewModel[PARENT_KEY][CHILDREN_KEY][viewModel[SORT_INDEX_KEY]];\n        if (!entryNode) return [];\n        const values: TooltipValue[] = [\n          getTooltipValueFromNode(\n            entryValue(entryNode),\n            labelFormatters,\n            valueFormatter,\n            percentFormatter,\n            currentShapeViewModel,\n            id,\n          ),\n        ];\n        // return only the leaf node if flame/icicle to avoid its highly hierarchical nature\n        if (isLinear(currentShapeViewModel.layout)) {\n          return values;\n        }\n        let node = viewModel[MODEL_KEY];\n        while (node[DEPTH_KEY] > 0) {\n          values.push(\n            getTooltipValueFromNode(node, labelFormatters, valueFormatter, percentFormatter, currentShapeViewModel, id),\n          );\n          node = node[PARENT_KEY];\n        }\n        return values.reverse();\n      }),\n  };\n}\n\nfunction getTooltipValueFromNode(\n  node: ArrayNode,\n  labelFormatters: (LabelAccessor | undefined)[],\n  valueFormatter: ValueFormatter,\n  percentFormatter: ValueFormatter,\n  shapeViewModel: ShapeViewModel,\n  id: SpecId,\n): TooltipValue {\n  const depth = node[DEPTH_KEY];\n  const value = node[AGGREGATE_KEY];\n  const dataName = getNodeName(node);\n  const formatter = labelFormatters[depth - 1];\n  const model = shapeViewModel.quadViewModel.find(\n    (d) => d.depth === depth && d.dataName === dataName && d.value === value,\n  );\n  return {\n    label: formatter ? formatter(dataName) : dataName,\n    color: model?.fillColor ?? 'transparent',\n    isHighlighted: false,\n    isVisible: true,\n    seriesIdentifier: {\n      specId: id,\n      key: model?.dataName ?? '',\n    },\n    value: node[AGGREGATE_KEY],\n    formattedValue: `${valueFormatter(value)}\\u00A0(${percentFormatter(percentValueGetter(node))})`,\n    valueAccessor: node[DEPTH_KEY],\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BackgroundStyle } from './../../../../utils/themes/theme';\nimport { shapeViewModel } from './viewmodel';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { PartitionStyle } from '../../../../utils/themes/partition';\nimport { Layer, PartitionSpec } from '../../specs';\nimport { VALUE_GETTERS } from '../config';\nimport {\n  PartitionSmallMultiplesModel,\n  RawTextGetter,\n  ShapeTreeNode,\n  ShapeViewModel,\n  ValueGetter,\n} from '../types/viewmodel_types';\nimport { DEPTH_KEY, HierarchyOfArrays } from '../utils/group_by_rollup';\n\nfunction rawTextGetter(layers: Layer[]): RawTextGetter {\n  return (node: ShapeTreeNode) => {\n    const accessorFn = layers[node[DEPTH_KEY] - 1]?.nodeLabel || ((d) => d);\n    return `${accessorFn(node.dataName)}`;\n  };\n}\n\n/** @internal */\nexport function valueGetterFunction(valueGetter: ValueGetter) {\n  return typeof valueGetter === 'function' ? valueGetter : VALUE_GETTERS[valueGetter];\n}\n\n/** @internal */\nexport function getShapeViewModel(\n  spec: PartitionSpec,\n  parentDimensions: Dimensions,\n  tree: HierarchyOfArrays,\n  backgroundStyle: BackgroundStyle,\n  style: PartitionStyle,\n  panelModel: PartitionSmallMultiplesModel,\n): ShapeViewModel {\n  return withTextMeasure((measureText) => {\n    return shapeViewModel(\n      measureText,\n      spec,\n      style,\n      parentDimensions,\n      rawTextGetter(spec.layers),\n      valueGetterFunction(spec.valueGetter),\n      tree,\n      backgroundStyle,\n      panelModel,\n    );\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  fillTextLayout,\n  getRectangleRowGeometry,\n  getSectorRowGeometry,\n  inSectorRotation,\n  nodeId,\n} from './fill_text_layout';\nimport { linkTextLayout } from './link_text_layout';\nimport { colorToRgba, RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Colors } from '../../../../common/colors';\nimport { TAU } from '../../../../common/constants';\nimport { fillTextColor } from '../../../../common/fill_text_color';\nimport {\n  Distance,\n  meanAngle,\n  Pixels,\n  PointTuple,\n  Radius,\n  trueBearingToStandardPositionAngle,\n} from '../../../../common/geometry';\nimport { Part } from '../../../../common/text_utils';\nimport { GroupByAccessor } from '../../../../specs';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { ColorVariant, StrokeStyle } from '../../../../utils/common';\nimport { Size } from '../../../../utils/dimensions';\nimport { Logger } from '../../../../utils/logger';\nimport { FillLabelConfig, PartitionStyle } from '../../../../utils/themes/partition';\nimport { BackgroundStyle } from '../../../../utils/themes/theme';\nimport { Layer, PartitionSpec } from '../../specs';\nimport { MODEL_KEY, percentValueGetter } from '../config';\nimport { PartitionLayout } from '../types/config_types';\nimport {\n  nullShapeViewModel,\n  OutsideLinksViewModel,\n  PartitionSmallMultiplesModel,\n  PickFunction,\n  QuadViewModel,\n  RawTextGetter,\n  RowSet,\n  ShapeTreeNode,\n  ShapeViewModel,\n  ValueGetterFunction,\n} from '../types/viewmodel_types';\nimport { ringSectorConstruction } from '../utils/circline_geometry';\nimport {\n  aggregateAccessor,\n  ArrayEntry,\n  CHILDREN_KEY,\n  depthAccessor,\n  entryKey,\n  entryValue,\n  HierarchyOfArrays,\n  mapEntryValue,\n  parentAccessor,\n  pathAccessor,\n  SORT_INDEX_KEY,\n  sortIndexAccessor,\n} from '../utils/group_by_rollup';\nimport { sunburst } from '../utils/sunburst';\nimport { getTopPadding, LayerLayout, treemap } from '../utils/treemap';\nimport { waffle } from '../utils/waffle';\n\n/** @internal */\nexport const isMosaic = (p: PartitionLayout | undefined) => p === PartitionLayout.mosaic;\n\n/** @internal */\nexport const isTreemap = (p: PartitionLayout | undefined) => p === PartitionLayout.treemap;\n\n/** @internal */\nexport const isSunburst = (p: PartitionLayout | undefined) => p === PartitionLayout.sunburst;\n\n/** @internal */\nexport const isIcicle = (p: PartitionLayout | undefined) => p === PartitionLayout.icicle;\n\n/** @internal */\nexport const isFlame = (p: PartitionLayout | undefined) => p === PartitionLayout.flame;\n\n/** @internal */\nexport const isWaffle = (p: PartitionLayout | undefined) => p === PartitionLayout.waffle;\n\n/** @internal */\nexport const isLinear = (p: PartitionLayout | undefined) => isFlame(p) || isIcicle(p);\n\n/** @internal */\nexport const isSimpleLinear = (layout: PartitionLayout, fillLabel: FillLabelConfig, layers: Layer[]) =>\n  isLinear(layout) && layers.every((l) => l.fillLabel?.clipText ?? fillLabel?.clipText);\n\nfunction grooveAccessor(n: ArrayEntry) {\n  return entryValue(n).depth > 1 ? 1 : [0, 2][entryValue(n).depth] ?? NaN;\n}\n\nfunction topGrooveAccessor(topGroovePx: Pixels) {\n  return (n: ArrayEntry) => (entryValue(n).depth > 0 ? topGroovePx : grooveAccessor(n));\n}\n\nfunction rectangleFillOrigins(n: ShapeTreeNode): PointTuple {\n  return [(n.x0 + n.x1) / 2, (n.y0 + n.y1) / 2];\n}\n\n/**\n * @internal\n */\nexport const ringSectorInnerRadius = (n: ShapeTreeNode): Radius => n.y0px;\n\n/**\n * @internal\n */\nexport const ringSectorOuterRadius = (n: ShapeTreeNode): Radius => n.y1px;\n\n/**\n * @internal\n */\nexport const ringSectorMiddleRadius = (n: ShapeTreeNode): Radius => n.yMidPx;\n\nfunction sectorFillOrigins(fillOutside: boolean) {\n  return (node: ShapeTreeNode): [number, number] => {\n    const midAngle = (node.x0 + node.x1) / 2;\n    const divider = 10;\n    const innerBias = fillOutside ? 9 : 1;\n    const outerBias = divider - innerBias;\n    const radius = (innerBias * ringSectorInnerRadius(node) + outerBias * ringSectorOuterRadius(node)) / divider;\n    const cx = Math.cos(trueBearingToStandardPositionAngle(midAngle)) * radius;\n    const cy = Math.sin(trueBearingToStandardPositionAngle(midAngle)) * radius;\n    return [cx, cy];\n  };\n}\n\nconst minRectHeightForText: Pixels = 8;\n\n/** @internal */\nexport function makeQuadViewModel(\n  childNodes: ShapeTreeNode[],\n  layers: Layer[],\n  sectorLineWidth: Pixels,\n  sectorLineStroke: StrokeStyle,\n  smAccessorValue: ReturnType<GroupByAccessor>,\n  index: number,\n  innerIndex: number,\n  fillLabel: FillLabelConfig,\n  { color: backgroundColor, fallbackColor: fallbackBGColor }: BackgroundStyle,\n): QuadViewModel[] {\n  if (colorToRgba(backgroundColor)[3] < 1) {\n    // Override handled in fill_text_color.ts\n    Logger.expected(\n      'Text contrast requires an opaque background color, using fallbackColor',\n      'an opaque color',\n      backgroundColor,\n    );\n  }\n  return childNodes.map((node) => {\n    const layer = layers[node.depth - 1];\n    const fill = layer?.shape?.fillColor ?? RGBATupleToString(Colors.DarkOpaqueRed.rgba);\n    const entry = node[MODEL_KEY][CHILDREN_KEY][node[SORT_INDEX_KEY]];\n    const fillColor = !entry\n      ? RGBATupleToString(Colors.DarkOpaqueRed.rgba)\n      : typeof fill === 'function'\n        ? fill(node.dataName, node.sortIndex, entryValue(entry), node[MODEL_KEY].children)\n        : fill;\n    const strokeWidth = sectorLineWidth;\n    const strokeStyle = sectorLineStroke;\n    const textNegligible = node.y1px - node.y0px < minRectHeightForText;\n    const textColor = textNegligible\n      ? Colors.Transparent.keyword\n      : fillLabel.textColor === ColorVariant.Adaptive\n        ? fillTextColor(fallbackBGColor, fillColor, backgroundColor).color.keyword\n        : fillLabel.textColor;\n\n    return { index, innerIndex, smAccessorValue, strokeWidth, strokeStyle, fillColor, textColor, ...node };\n  });\n}\n\n/** @internal */\nexport function makeOutsideLinksViewModel(\n  outsideFillNodes: ShapeTreeNode[],\n  rowSets: RowSet[],\n  linkLabelRadiusPadding: Distance,\n): OutsideLinksViewModel[] {\n  return outsideFillNodes\n    .map<OutsideLinksViewModel>((node, i: number) => {\n      const rowSet = rowSets[i];\n      if (!rowSet?.rows.reduce((p, row) => p + row.rowWords.length, 0)) return { points: [] };\n      const radius = ringSectorOuterRadius(node);\n      const midAngle = trueBearingToStandardPositionAngle(meanAngle(node.x0, node.x1));\n      const cos = Math.cos(midAngle);\n      const sin = Math.sin(midAngle);\n      const x0 = cos * radius;\n      const y0 = sin * radius;\n      const x = cos * (radius + linkLabelRadiusPadding);\n      const y = sin * (radius + linkLabelRadiusPadding);\n      return {\n        points: [\n          [x0, y0],\n          [x, y],\n        ],\n      };\n    })\n    .filter(({ points }: OutsideLinksViewModel) => points.length > 1);\n}\n\n/** @internal */\nexport interface RectangleConstruction {\n  x0: Pixels;\n  x1: Pixels;\n  y0: Pixels;\n  y1: Pixels;\n}\n\nfunction rectangleConstruction(treeHeight: number, topGroove: number | null) {\n  return function rectangleConstructionClosure(node: ShapeTreeNode): RectangleConstruction {\n    return node.depth < treeHeight && topGroove !== null\n      ? {\n          x0: node.x0,\n          y0: node.y0px,\n          x1: node.x1,\n          y1: node.y0px + getTopPadding(topGroove, node.y1px - node.y0px),\n        }\n      : {\n          x0: node.x0,\n          y0: node.y0px,\n          x1: node.x1,\n          y1: node.y1px,\n        };\n  };\n}\n\nconst rawChildNodes = (\n  partitionLayout: PartitionLayout,\n  tree: HierarchyOfArrays,\n  topGroove: number,\n  width: number,\n  height: number,\n  clockwiseSectors: boolean,\n  specialFirstInnermostSector: boolean,\n  maxDepth: number,\n): Array<Part> => {\n  const totalValue = tree.reduce((p: number, n: ArrayEntry): number => p + mapEntryValue(n), 0);\n  switch (partitionLayout) {\n    case PartitionLayout.sunburst:\n      const sunburstValueToAreaScale = TAU / totalValue;\n      const sunburstAreaAccessor = (e: ArrayEntry) => sunburstValueToAreaScale * mapEntryValue(e);\n      return sunburst(tree, sunburstAreaAccessor, { x0: 0, y0: -1 }, clockwiseSectors, specialFirstInnermostSector);\n\n    case PartitionLayout.treemap:\n    case PartitionLayout.mosaic:\n      const treemapInnerArea = width * height; // assuming 1 x 1 unit square\n      const treemapValueToAreaScale = treemapInnerArea / totalValue;\n      const treemapAreaAccessor = (e: ArrayEntry) => treemapValueToAreaScale * mapEntryValue(e);\n      return treemap(\n        tree,\n        treemapAreaAccessor,\n        topGrooveAccessor(topGroove),\n        grooveAccessor,\n        {\n          x0: 0,\n          y0: 0,\n          width,\n          height,\n        },\n        isMosaic(partitionLayout) ? [LayerLayout.vertical, LayerLayout.horizontal] : [],\n      );\n\n    case PartitionLayout.waffle:\n      return waffle(tree, totalValue, {\n        x0: 0,\n        y0: 0,\n        width,\n        height,\n      });\n\n    case PartitionLayout.icicle:\n    case PartitionLayout.flame:\n      const icicleLayout = isIcicle(partitionLayout);\n      const icicleValueToAreaScale = width / totalValue;\n      const icicleAreaAccessor = (e: ArrayEntry) => icicleValueToAreaScale * mapEntryValue(e);\n      const icicleRowHeight = height / (maxDepth - 1);\n      const result = sunburst(tree, icicleAreaAccessor, { x0: 0, y0: -icicleRowHeight }, true, false, icicleRowHeight);\n      return icicleLayout\n        ? result\n        : result.map(({ y0, y1, ...rest }) => ({ y0: height - y1, y1: height - y0, ...rest }));\n\n    default:\n      // Let's ensure TS complains if we add a new PartitionLayout type in the future without creating a `case` for it\n      // Hopefully, a future TS version will do away with the need for this boilerplate `default`. Now TS even needs a `default` even if all possible cases are covered.\n      // Even in runtime it does something sensible (returns the empty set); explicit throwing is avoided as it can deopt the function\n      return ((layout: never) => layout ?? [])(partitionLayout);\n  }\n};\n\n/** @internal */\nexport function shapeViewModel(\n  textMeasure: TextMeasure,\n  spec: PartitionSpec,\n  style: PartitionStyle,\n  chartDimensions: Size,\n  rawTextGetter: RawTextGetter,\n  valueGetter: ValueGetterFunction,\n  tree: HierarchyOfArrays,\n  backgroundStyle: BackgroundStyle,\n  panelModel: PartitionSmallMultiplesModel,\n): ShapeViewModel {\n  const {\n    layout,\n    layers,\n    topGroove,\n    valueFormatter: specifiedValueFormatter,\n    percentFormatter: specifiedPercentFormatter,\n    fillOutside,\n    clockwiseSectors,\n    maxRowCount,\n    specialFirstInnermostSector,\n    animation,\n  } = spec;\n  const { emptySizeRatio, outerSizeRatio, linkLabel, minFontSize, sectorLineWidth, sectorLineStroke, fillLabel } =\n    style;\n  const { width, height } = chartDimensions;\n  const { marginLeftPx, marginTopPx, panel } = panelModel;\n\n  const treemapLayout = isTreemap(layout);\n  const mosaicLayout = isMosaic(layout);\n  const sunburstLayout = isSunburst(layout);\n  const icicleLayout = isIcicle(layout);\n  const flameLayout = isFlame(layout);\n  const simpleLinear = isSimpleLinear(layout, fillLabel, layers);\n  const waffleLayout = isWaffle(layout);\n\n  const diskCenter = isSunburst(layout)\n    ? {\n        x: marginLeftPx + panel.innerWidth / 2,\n        y: marginTopPx + panel.innerHeight / 2,\n      }\n    : {\n        x: marginLeftPx,\n        y: marginTopPx,\n      };\n\n  // use the smaller of the two sizes, as a circle fits into a square\n  const circleMaximumSize = Math.min(\n    panel.innerWidth,\n    panel.innerHeight - (panel.title.length > 0 ? panel.fontSize * 2 : 0),\n  );\n  const outerRadius: Radius = Math.min(outerSizeRatio * circleMaximumSize, circleMaximumSize - sectorLineWidth) / 2;\n  // don't render anything if the total, the width or height is not positive\n  if (!(width > 0) || !(height > 0) || tree.length === 0 || outerRadius <= 0) {\n    return nullShapeViewModel(layout, style, diskCenter);\n  }\n\n  const longestPath = (entry?: ArrayEntry): number => {\n    const [, node] = entry ?? [];\n    if (!node) return NaN; // should never happen\n    const { children, path } = node;\n    return children.length > 0 ? children.reduce((p, n) => Math.max(p, longestPath(n)), 0) : path.length;\n  };\n\n  const maxDepth = longestPath(tree[0]) - 2; // don't include the root node\n  const childNodes = rawChildNodes(\n    layout,\n    tree,\n    topGroove,\n    panel.innerWidth,\n    panel.innerHeight,\n    clockwiseSectors,\n    specialFirstInnermostSector,\n    maxDepth,\n  );\n\n  const shownChildNodes = childNodes.filter((n: Part) => {\n    const layerIndex = entryValue(n.node).depth - 1;\n    const layer = layers[layerIndex];\n    return !layer || !layer.showAccessor || layer.showAccessor(entryKey(n.node));\n  });\n\n  const innerRadius: Radius = outerRadius - (1 - emptySizeRatio) * outerRadius;\n  const treeHeight = shownChildNodes.reduce((p: number, n: Part) => Math.max(p, entryValue(n.node).depth), 0); // 1: pie, 2: two-ring donut etc.\n  const ringThickness = (outerRadius - innerRadius) / treeHeight;\n  const partToShapeFn = partToShapeTreeNode(!sunburstLayout, innerRadius, ringThickness);\n  const quadViewModel = makeQuadViewModel(\n    shownChildNodes.slice(1).map(partToShapeFn),\n    layers,\n    sectorLineWidth,\n    sectorLineStroke,\n    panelModel.smAccessorValue,\n    panelModel.index,\n    panelModel.innerIndex,\n    fillLabel,\n    backgroundStyle,\n  );\n\n  // fill text\n  const roomCondition = (n: ShapeTreeNode) => {\n    const diff = n.x1 - n.x0;\n    return sunburstLayout\n      ? (diff < 0 ? TAU + diff : diff) * ringSectorMiddleRadius(n) > Math.max(minFontSize, linkLabel.maximumSection)\n      : n.x1 - n.x0 > minFontSize && n.y1px - n.y0px > minFontSize;\n  };\n\n  const nodesWithRoom = quadViewModel.filter(roomCondition);\n  const outsideFillNodes = fillOutside && sunburstLayout ? nodesWithRoom : [];\n\n  const textFillOrigins = nodesWithRoom.map(sunburstLayout ? sectorFillOrigins(fillOutside) : rectangleFillOrigins);\n\n  const valueFormatter = valueGetter === percentValueGetter ? specifiedPercentFormatter : specifiedValueFormatter;\n\n  const getRowSets = sunburstLayout\n    ? fillTextLayout(\n        ringSectorConstruction(spec, style, innerRadius, ringThickness),\n        getSectorRowGeometry,\n        inSectorRotation(style.horizontalTextEnforcer, style.horizontalTextAngleThreshold),\n      )\n    : simpleLinear || waffleLayout\n      ? () => [] // no multirow layout needed for simpleLinear partitions; no text at all for waffles\n      : fillTextLayout(\n          rectangleConstruction(treeHeight, treemapLayout || mosaicLayout ? topGroove : null),\n          getRectangleRowGeometry,\n          () => 0,\n        );\n\n  const rowSets: RowSet[] = getRowSets(\n    textMeasure,\n    rawTextGetter,\n    valueGetter,\n    valueFormatter,\n    nodesWithRoom,\n    style,\n    layers,\n    textFillOrigins,\n    maxRowCount,\n    !sunburstLayout,\n    !(treemapLayout || mosaicLayout),\n  );\n\n  // whiskers (ie. just lines, no text) for fill text outside the outer radius\n  const outsideLinksViewModel = makeOutsideLinksViewModel(outsideFillNodes, rowSets, linkLabel.radiusPadding);\n\n  // linked text\n  const currentY = [-height, -height, -height, -height];\n\n  const nodesWithoutRoom =\n    fillOutside || treemapLayout || mosaicLayout || icicleLayout || flameLayout || waffleLayout\n      ? [] // outsideFillNodes and linkLabels are in inherent conflict due to very likely overlaps\n      : quadViewModel.filter((n: ShapeTreeNode) => {\n          const id = nodeId(n);\n          const foundInFillText = rowSets.find((r: RowSet) => r.id === id);\n          // successful text render if found, and has some row(s)\n          return !(foundInFillText && foundInFillText.rows.length > 0);\n        });\n  const maxLinkedLabelTextLength = style.linkLabel.maxTextLength;\n  const linkLabelViewModels = linkTextLayout(\n    panel.innerWidth,\n    panel.innerHeight,\n    textMeasure,\n    style,\n    nodesWithoutRoom,\n    currentY,\n    outerRadius,\n    rawTextGetter,\n    valueGetter,\n    valueFormatter,\n    maxLinkedLabelTextLength,\n    {\n      x: width * panelModel.left + panel.innerWidth / 2,\n      y: height * panelModel.top + panel.innerHeight / 2,\n    },\n    backgroundStyle,\n  );\n\n  const pickQuads: PickFunction = sunburstLayout\n    ? (x, y) => {\n        return quadViewModel.filter(({ x0, y0px, x1, y1px }) => {\n          const angleX = (Math.atan2(y, x) + TAU / 4 + TAU) % TAU;\n          const yPx = Math.hypot(x, y);\n          return x0 <= angleX && angleX <= x1 && y0px <= yPx && yPx <= y1px;\n        });\n      }\n    : (x, y, { currentFocusX0, currentFocusX1 }) => {\n        return quadViewModel.filter(({ x0, y0px, x1, y1px }) => {\n          const scale = width / (currentFocusX1 - currentFocusX0);\n          const fx0 = Math.max((x0 - currentFocusX0) * scale, 0);\n          const fx1 = Math.min((x1 - currentFocusX0) * scale, width);\n          return fx0 <= x && x < fx1 && y0px < y && y <= y1px;\n        });\n      };\n\n  // combined viewModel\n  return {\n    layout,\n    smAccessorValue: panelModel.smAccessorValue,\n    index: panelModel.index,\n    innerIndex: panelModel.innerIndex,\n    width: panelModel.width,\n    height: panelModel.height,\n    top: panelModel.top,\n    left: panelModel.left,\n    innerRowCount: panelModel.innerRowCount,\n    innerColumnCount: panelModel.innerColumnCount,\n    innerRowIndex: panelModel.innerRowIndex,\n    innerColumnIndex: panelModel.innerColumnIndex,\n    marginLeftPx: panelModel.marginLeftPx,\n    marginTopPx: panelModel.marginTopPx,\n    panel: {\n      ...panelModel.panel,\n    },\n    style,\n    layers,\n    diskCenter,\n    quadViewModel,\n    rowSets,\n    linkLabelViewModels,\n    outsideLinksViewModel,\n    pickQuads,\n    outerRadius,\n    chartDimensions,\n    animation,\n  };\n}\n\nfunction partToShapeTreeNode(treemapLayout: boolean, innerRadius: Radius, ringThickness: number) {\n  return ({ node, x0, x1, y0, y1 }: Part): ShapeTreeNode => ({\n    dataName: entryKey(node),\n    depth: depthAccessor(node),\n    value: aggregateAccessor(node),\n    [MODEL_KEY]: parentAccessor(node),\n    sortIndex: sortIndexAccessor(node),\n    path: pathAccessor(node),\n    x0,\n    x1,\n    y0,\n    y1,\n    y0px: treemapLayout ? y0 : innerRadius + y0 * ringThickness,\n    y1px: treemapLayout ? y1 : innerRadius + y1 * ringThickness,\n    yMidPx: treemapLayout ? (y0 + y1) / 2 : innerRadius + ((y0 + y1) / 2) * ringThickness,\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnimationState, ContinuousDomainFocus } from './partition';\nimport { Colors } from '../../../../common/colors';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\n\nconst linear = (x: number) => x;\nconst easeInOut = (alpha: number) => (x: number) => x ** alpha / (x ** alpha + (1 - x) ** alpha);\n\nconst MAX_PADDING_RATIO = 0.25;\n\n/** @internal */\nexport function renderLinearPartitionCanvas2d(\n  ctx: CanvasRenderingContext2D,\n  dpr: number,\n  {\n    style: { sectorLineWidth: padding },\n    quadViewModel,\n    diskCenter,\n    width: panelWidth,\n    height: panelHeight,\n    layers,\n    chartDimensions: { width: containerWidth, height: containerHeight },\n    animation,\n  }: ShapeViewModel,\n  { currentFocusX0, currentFocusX1, prevFocusX0, prevFocusX1 }: ContinuousDomainFocus,\n  animationState: AnimationState,\n) {\n  if (animation?.duration) {\n    window.cancelAnimationFrame(animationState.rafId);\n    render(0);\n    const focusChanged = currentFocusX0 !== prevFocusX0 || currentFocusX1 !== prevFocusX1;\n    if (focusChanged) {\n      animationState.rafId = window.requestAnimationFrame((epochStartTime) => {\n        const anim = (t: number) => {\n          const unitNormalizedTime = Math.max(0, Math.min(1, (t - epochStartTime) / animation.duration));\n          render(unitNormalizedTime);\n          if (unitNormalizedTime < 1) {\n            animationState.rafId = window.requestAnimationFrame(anim);\n          }\n        };\n        animationState.rafId = window.requestAnimationFrame(anim);\n      });\n    }\n  } else {\n    render(1);\n  }\n\n  function render(\n    logicalTime: number,\n    timeFunction: (time: number) => number = animation?.duration\n      ? easeInOut(Math.min(5, animation.duration / 100))\n      : linear,\n  ) {\n    const width = containerWidth * panelWidth;\n    const height = containerHeight * panelHeight;\n    const t = timeFunction(logicalTime);\n    const focusX0 = t * currentFocusX0 + (1 - t) * prevFocusX0 || 0;\n    const focusX1 = t * currentFocusX1 + (1 - t) * prevFocusX1 || 0;\n    const scale = containerWidth / (focusX1 - focusX0);\n\n    ctx.save();\n    ctx.textAlign = 'left';\n    ctx.textBaseline = 'middle';\n    ctx.scale(dpr, dpr);\n    ctx.translate(diskCenter.x, diskCenter.y);\n    ctx.clearRect(0, 0, width, height);\n\n    quadViewModel.forEach(({ fillColor, x0, x1, y0px: y0, y1px: y1, dataName, textColor, depth }) => {\n      if (y1 - y0 <= padding) return;\n\n      const fx0 = Math.max((x0 - focusX0) * scale, 0);\n      const fx1 = Math.min((x1 - focusX0) * scale, width);\n\n      if (fx1 < 0 || fx0 > width) return;\n\n      const layer = layers[depth - 1]; // depth === 0 corresponds to root layer (above API `layers`)\n      const formatter = layer?.nodeLabel ?? String;\n\n      const label = formatter(dataName);\n      const fWidth = fx1 - fx0;\n      const fPadding = Math.min(padding, MAX_PADDING_RATIO * fWidth);\n\n      ctx.fillStyle = fillColor;\n      ctx.beginPath();\n      ctx.rect(fx0 + fPadding, y0 + padding / 2, fWidth - fPadding, y1 - y0 - padding);\n      ctx.fill();\n      if (textColor === Colors.Transparent.keyword || label === '' || fWidth < 4) return;\n      ctx.fillStyle = textColor;\n      ctx.save();\n      ctx.clip(); // undoing a clip needs context save/restore, which is why it's wrapped in a save/restore\n      ctx.fillText(label, fx0 + 3 * fPadding, (y0 + y1) / 2);\n      ctx.restore();\n    });\n\n    ctx.restore();\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Color } from '../../../../common/colors';\nimport { TAU } from '../../../../common/constants';\nimport { Pixels } from '../../../../common/geometry';\nimport { cssFontShorthand, HorizontalAlignment } from '../../../../common/text_utils';\nimport { renderLayers, withContext } from '../../../../renderers/canvas';\nimport { MIN_STROKE_WIDTH } from '../../../xy_chart/renderer/canvas/primitives/line';\nimport {\n  LinkLabelVM,\n  OutsideLinksViewModel,\n  QuadViewModel,\n  RowBox,\n  RowSet,\n  ShapeViewModel,\n  TextRow,\n} from '../../layout/types/viewmodel_types';\nimport { LinkLabelsViewModelSpec } from '../../layout/viewmodel/link_text_layout';\nimport { isSunburst } from '../../layout/viewmodel/viewmodel';\n\n// the burnout avoidance in the center of the pie\nconst LINE_WIDTH_MULT = 10; // border can be a maximum 1/LINE_WIDTH_MULT - th of the sector angle, otherwise the border would dominate\nconst TAPER_OFF_LIMIT = 50; // taper off within a radius of TAPER_OFF_LIMIT to avoid burnout in the middle of the pie when there are hundreds of pies\n\nconst getCurrentRowX = (row: TextRow, horizontalAlignment: HorizontalAlignment, rotation: number) => {\n  // TODO account for text rotation if needed\n  const rowLength = Math.cos(rotation) * row.length;\n  const offset =\n    horizontalAlignment === HorizontalAlignment.left\n      ? -row.maximumLength / 2\n      : horizontalAlignment === HorizontalAlignment.right\n        ? row.maximumLength / 2 - rowLength\n        : -rowLength / 2;\n  return row.rowAnchorX + offset;\n};\n\nconst getFillTextXOffset = (box: RowBox, rowLength: number, isRTL: boolean) => {\n  // TODO account for text rotation if needed\n  return isRTL ? rowLength - box.width / 2 - box.wordBeginning : box.width / 2 + box.wordBeginning;\n};\n\nfunction renderTextRow(\n  ctx: CanvasRenderingContext2D,\n  { fontSize, fillTextColor, rotation, verticalAlignment, horizontalAlignment, container, clipText, isRTL }: RowSet,\n  linkLabelTextColor: string,\n) {\n  return (currentRow: TextRow) => {\n    const crx = getCurrentRowX(currentRow, horizontalAlignment, rotation);\n    const cry = -currentRow.rowAnchorY + (Math.sin(rotation) * currentRow.length) / 2;\n    if (!Number.isFinite(crx) || !Number.isFinite(cry)) {\n      return;\n    }\n\n    withContext(ctx, () => {\n      ctx.scale(1, -1);\n      if (clipText) {\n        ctx.rect(container.x0 + 1, container.y0 + 1, container.x1 - container.x0 - 2, container.y1 - container.y0 - 2);\n        ctx.clip();\n      }\n      ctx.beginPath();\n      ctx.translate(crx, cry);\n      ctx.rotate(-rotation);\n      ctx.fillStyle = fillTextColor ?? linkLabelTextColor;\n      ctx.textBaseline = verticalAlignment;\n      ctx.direction = isRTL ? 'rtl' : 'ltr'; // used for mixed charsets\n\n      currentRow.rowWords.forEach((box) => {\n        if (box.isValue) ctx.direction = 'ltr'; // force value text direction\n        ctx.font = cssFontShorthand(box, fontSize);\n        ctx.fillText(box.text, getFillTextXOffset(box, currentRow.length, isRTL), 0);\n      });\n      ctx.closePath();\n    });\n    // for debug use: this draws magenta boxes for where the text needs to fit\n    // note: `container` is a property of the RowSet, needs to be added\n    // withContext(ctx, () => {\n    //   ctx.scale(1, -1);\n    //   ctx.rotate(-rotation);\n    //   ctx.beginPath();\n    //   ctx.strokeStyle = 'magenta';\n    //   ctx.fillStyle = 'magenta';\n    //   ctx.lineWidth = 1;\n    //   ctx.rect(container.x0 + 1, container.y0 + 1, container.x1 - container.x0 - 2, container.y1 - container.y0 - 2);\n    //   ctx.stroke();\n    // });\n  };\n}\n\nfunction renderTextRows(ctx: CanvasRenderingContext2D, rowSet: RowSet, linkLabelTextColor: string) {\n  rowSet.rows.forEach(renderTextRow(ctx, rowSet, linkLabelTextColor));\n}\n\nfunction renderRowSets(ctx: CanvasRenderingContext2D, rowSets: RowSet[], linkLabelTextColor: string) {\n  rowSets.forEach((rowSet: RowSet) => renderTextRows(ctx, rowSet, linkLabelTextColor));\n}\n\nfunction renderTaperedBorder(\n  ctx: CanvasRenderingContext2D,\n  { strokeWidth, strokeStyle, fillColor, x0, x1, y0px, y1px }: QuadViewModel,\n) {\n  const X0 = x0 - TAU / 4;\n  const X1 = x1 - TAU / 4;\n  ctx.fillStyle = fillColor;\n  ctx.beginPath();\n  // only draw circular arcs if it would be distinguishable from a straight line ie. angle is not very small\n  ctx.arc(0, 0, y0px, X0, X0);\n  ctx.arc(0, 0, y1px, X0, X1, false);\n  ctx.arc(0, 0, y0px, X1, X0, true);\n\n  ctx.fill();\n  if (strokeWidth > 0.001 && !(x0 === 0 && x1 === TAU)) {\n    // canvas2d uses a default of 1 if the lineWidth is assigned 0, so we use a small value to test, to avoid it\n    // ... and also don't draw a separator if we have a single sector that's the full ring (eg. single-fact-row pie)\n    // outer arc\n    ctx.lineWidth = strokeWidth;\n    const tapered = x1 - x0 < (15 * TAU) / 360; // burnout seems visible, and tapering invisible, with less than 15deg\n    if (tapered) {\n      ctx.beginPath();\n      ctx.arc(0, 0, y1px, X0, X1, false);\n      ctx.stroke();\n\n      // inner arc\n      ctx.beginPath();\n      ctx.arc(0, 0, y0px, X1, X0, true);\n      ctx.stroke();\n\n      ctx.fillStyle = strokeStyle;\n\n      // each side (radial 'line') is modeled as a pentagon (some lines can be short arcs though)\n      ctx.beginPath();\n      const yThreshold = Math.max(TAPER_OFF_LIMIT, (LINE_WIDTH_MULT * strokeWidth) / (X1 - X0));\n      const beta = strokeWidth / yThreshold; // angle where strokeWidth equals the lineWidthMult limit at a radius of yThreshold\n      ctx.arc(0, 0, y0px, X0, X0 + beta * (yThreshold / y0px));\n      ctx.arc(0, 0, Math.min(yThreshold, y1px), X0 + beta, X0 + beta);\n      ctx.arc(0, 0, y1px, X0 + beta * (yThreshold / y1px), X0, true);\n      ctx.arc(0, 0, y0px, X0, X0);\n      ctx.fill();\n    } else {\n      ctx.strokeStyle = strokeStyle;\n      ctx.stroke();\n    }\n  }\n}\n\nfunction renderSectors(ctx: CanvasRenderingContext2D, quadViewModel: QuadViewModel[]) {\n  withContext(ctx, () => {\n    ctx.scale(1, -1); // D3 and Canvas2d use a left-handed coordinate system (+y = down) but the ViewModel uses +y = up, so we must locally invert Y\n    quadViewModel.forEach((quad: QuadViewModel) => {\n      if (quad.x0 !== quad.x1) renderTaperedBorder(ctx, quad);\n    });\n  });\n}\n\nfunction renderRectangles(ctx: CanvasRenderingContext2D, quadViewModel: QuadViewModel[]) {\n  withContext(ctx, () => {\n    ctx.scale(1, -1); // D3 and Canvas2d use a left-handed coordinate system (+y = down) but the ViewModel uses +y = up, so we must locally invert Y\n    quadViewModel.forEach(({ strokeWidth, fillColor, x0, x1, y0px, y1px }) => {\n      // only draw a shape if it would show up at all\n      if (x1 - x0 >= 1 && y1px - y0px >= 1) {\n        ctx.fillStyle = fillColor;\n        ctx.beginPath();\n        ctx.moveTo(x0, y0px);\n        ctx.lineTo(x0, y1px);\n        ctx.lineTo(x1, y1px);\n        ctx.lineTo(x1, y0px);\n        ctx.lineTo(x0, y0px);\n        ctx.fill();\n        if (strokeWidth > MIN_STROKE_WIDTH) {\n          // Canvas2d stroke ignores an exact zero line width\n          ctx.lineWidth = strokeWidth;\n          ctx.stroke();\n        }\n      }\n    });\n  });\n}\n\nfunction renderFillOutsideLinks(\n  ctx: CanvasRenderingContext2D,\n  outsideLinksViewModel: OutsideLinksViewModel[],\n  linkLabelTextColor: string,\n  linkLabelLineWidth: Pixels,\n) {\n  withContext(ctx, () => {\n    ctx.lineWidth = linkLabelLineWidth;\n    ctx.strokeStyle = linkLabelTextColor;\n    outsideLinksViewModel.forEach(({ points }) => {\n      ctx.beginPath();\n\n      points.forEach(([x, y], index) => {\n        return index === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\n      });\n\n      ctx.stroke();\n    });\n  });\n}\n\nfunction getLinkTextXOffset(\n  { textAlign, width, valueWidth, isRTL }: Pick<LinkLabelVM, 'textAlign' | 'width' | 'valueWidth' | 'isRTL'>,\n  labelValueGap: number,\n): [label: number, value: number] {\n  const isRightAligned = textAlign === HorizontalAlignment.right;\n  const multiplier = isRightAligned ? -1 : 1;\n  const isAligned = isRightAligned === isRTL;\n  const to = multiplier * (labelValueGap + (isAligned ? width : valueWidth));\n  return isAligned ? [0, to] : [to, 0];\n}\n\nfunction renderLinkLabels(\n  ctx: CanvasRenderingContext2D,\n  linkLabelFontSize: Pixels,\n  linkLabelLineWidth: Pixels,\n  { linkLabels: allLinkLabels, labelFontSpec, valueFontSpec, strokeColor }: LinkLabelsViewModelSpec,\n  linkLineColor: Color,\n) {\n  const labelColor = RGBATupleToString(colorToRgba(labelFontSpec.textColor));\n  const valueColor = RGBATupleToString(colorToRgba(valueFontSpec.textColor));\n  const labelValueGap = linkLabelFontSize / 2; // one en space\n  withContext(ctx, () => {\n    ctx.lineWidth = linkLabelLineWidth;\n    allLinkLabels.forEach(\n      ({ linkLabels, translate, textAlign, text, valueText, width, valueWidth, isRTL }: LinkLabelVM) => {\n        // label lines\n        ctx.beginPath();\n        ctx.moveTo(...linkLabels[0]);\n        linkLabels.slice(1).forEach((point) => ctx.lineTo(...point));\n        ctx.strokeStyle = strokeColor ?? linkLineColor;\n        ctx.stroke();\n\n        const [labelX, valueX] = getLinkTextXOffset({ textAlign, width, valueWidth, isRTL }, labelValueGap);\n\n        withContext(ctx, () => {\n          ctx.translate(...translate);\n          ctx.scale(1, -1); // flip for text rendering not to be upside down\n          ctx.textAlign = textAlign;\n          // label text\n          ctx.fillStyle = labelColor;\n          ctx.font = cssFontShorthand(labelFontSpec, linkLabelFontSize);\n          ctx.direction = isRTL ? 'rtl' : 'ltr'; // used for mixed charsets\n          ctx.fillText(text, labelX, 0);\n          // value text\n          ctx.fillStyle = valueColor;\n          ctx.font = cssFontShorthand(valueFontSpec, linkLabelFontSize);\n          ctx.direction = 'ltr'; // force value text direction\n          ctx.fillText(valueText, valueX, 0);\n        });\n      },\n    );\n  });\n}\n\nconst midlineOffset = 0.35; // 0.35 is a [common constant](http://tavmjong.free.fr/SVG/TEXT_IN_A_BOX/index.html) representing half height\n\n/** @internal */\nexport function renderPartitionCanvas2d(\n  ctx: CanvasRenderingContext2D,\n  dpr: number,\n  {\n    layout,\n    width,\n    height,\n    style,\n    quadViewModel,\n    rowSets,\n    outsideLinksViewModel,\n    linkLabelViewModels,\n    diskCenter,\n    outerRadius,\n    panel,\n    chartDimensions,\n  }: ShapeViewModel,\n) {\n  const { sectorLineWidth, sectorLineStroke, linkLabel } = style;\n\n  const linkLineColor = linkLabelViewModels.strokeColor;\n\n  withContext(ctx, () => {\n    // set some defaults for the overall rendering\n\n    // let's set the devicePixelRatio once and for all; then we'll never worry about it again\n    ctx.scale(dpr, dpr);\n\n    // all texts are currently center-aligned because\n    //     - the calculations manually compute and lay out text (word) boxes, so we can choose whatever\n    //     - but center/middle has mathematical simplicity and the most unassuming thing\n    //     - due to using the math x/y convention (+y is up) while Canvas uses screen convention (+y is down)\n    //         text rendering must be y-flipped, which is a bit easier this way\n    ctx.textAlign = 'center';\n    ctx.textBaseline = 'bottom';\n\n    // panel titles\n    ctx.font = cssFontShorthand(panel.fontFace, panel.fontSize);\n    ctx.fillStyle = panel.fontFace.textColor;\n    const innerPad = midlineOffset * panel.fontSize; // todo replace it with theme.axisPanelTitle.padding.inner\n    ctx.fillText(\n      panel.title,\n      isSunburst(layout) ? diskCenter.x : diskCenter.x + (chartDimensions.width * width) / 2,\n      isSunburst(layout)\n        ? style.linkLabel.maxCount > 0\n          ? diskCenter.y - (chartDimensions.height * height) / 2 + panel.fontSize\n          : diskCenter.y - outerRadius - innerPad\n        : diskCenter.y + 12,\n    );\n\n    ctx.textBaseline = 'middle';\n\n    ctx.translate(diskCenter.x, diskCenter.y);\n    // this applies the mathematical x/y conversion (+y is North) which is easier when developing geometry\n    // functions - also, all renderers have flexibility (eg. SVG scale) and WebGL NDC is also +y up\n    // - in any case, it's possible to refactor for a -y = North convention if that's deemed preferable\n    ctx.scale(1, -1);\n\n    ctx.lineJoin = 'round';\n    ctx.strokeStyle = sectorLineStroke;\n    ctx.lineWidth = sectorLineWidth;\n\n    // painter's algorithm, like that of SVG: the sequence determines what overdraws what; first element of the array is drawn first\n    // (of course, with SVG, it's for ambiguous situations only, eg. when 3D transforms with different Z values aren't used, but\n    // unlike SVG and esp. WebGL, Canvas2d doesn't support the 3rd dimension well, see ctx.transform / ctx.setTransform).\n    // The layers are callbacks, because of the need to not bake in the `ctx`, it feels more composable and uncoupled this way.\n    renderLayers(ctx, [\n      // bottom layer: sectors (pie slices, ring sectors etc.)\n      () => (isSunburst(layout) ? renderSectors(ctx, quadViewModel) : renderRectangles(ctx, quadViewModel)),\n\n      // all the fill-based, potentially multirow text, whether inside or outside the sector\n      () => renderRowSets(ctx, rowSets, linkLineColor),\n\n      // the link lines for the outside-fill text\n      () => renderFillOutsideLinks(ctx, outsideLinksViewModel, linkLineColor, linkLabel.lineWidth),\n\n      // all the text and link lines for single-row outside texts\n      () => renderLinkLabels(ctx, linkLabel.fontSize, linkLabel.lineWidth, linkLabelViewModels, linkLineColor),\n    ]);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\n\nconst MAX_PADDING_RATIO = 0.25;\n\n/** @internal */\nexport function renderWrappedPartitionCanvas2d(\n  ctx: CanvasRenderingContext2D,\n  dpr: number,\n  {\n    style: { sectorLineWidth: padding },\n    quadViewModel,\n    diskCenter,\n    width: panelWidth,\n    height: panelHeight,\n    chartDimensions: { width: containerWidth, height: containerHeight },\n  }: ShapeViewModel,\n) {\n  const width = containerWidth * panelWidth;\n  const height = containerHeight * panelHeight;\n  const cornerRatio = 0.2;\n\n  ctx.save();\n  ctx.textAlign = 'left';\n  ctx.textBaseline = 'middle';\n  ctx.lineCap = 'round';\n  ctx.lineJoin = 'round';\n  ctx.scale(dpr, dpr);\n  ctx.translate(diskCenter.x, diskCenter.y);\n  ctx.clearRect(0, 0, width, height);\n\n  quadViewModel.forEach(({ fillColor, x0, x1, y0px: y0, y1px: y1 }) => {\n    if (y1 - y0 <= padding) return;\n\n    const fWidth = x1 - x0;\n    const fPadding = Math.min(padding, MAX_PADDING_RATIO * fWidth);\n    const w = fWidth - fPadding;\n    const h = y1 - y0 - padding;\n    const x = x0 + fPadding;\n    const y = y0 + padding / 2;\n    const r = cornerRatio * Math.min(w, h);\n\n    ctx.fillStyle = fillColor;\n\n    ctx.beginPath();\n    ctx.moveTo(x + r, y);\n    ctx.arcTo(x + w, y, x + w, y + h, r);\n    ctx.arcTo(x + w, y + h, x, y + h, r);\n    ctx.arcTo(x, y + h, x, y, r);\n    ctx.arcTo(x, y, x + w, y, r);\n    ctx.closePath();\n    ctx.fill();\n  });\n\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { MouseEvent, RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { renderLinearPartitionCanvas2d } from './canvas_linear_renderers';\nimport { renderPartitionCanvas2d } from './canvas_renderers';\nimport { renderWrappedPartitionCanvas2d } from './canvas_wrapped_renderers';\nimport { Color, Colors } from '../../../../common/colors';\nimport { ScreenReaderSummary, ScreenReaderPartitionTable } from '../../../../components/accessibility';\nimport { clearCanvas } from '../../../../renderers/canvas';\nimport { SettingsSpec } from '../../../../specs/settings';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { MODEL_KEY } from '../../layout/config';\nimport {\n  hasMostlyRTLLabels,\n  nullShapeViewModel,\n  QuadViewModel,\n  ShapeViewModel,\n  SmallMultiplesDescriptors,\n} from '../../layout/types/viewmodel_types';\nimport { INPUT_KEY } from '../../layout/utils/group_by_rollup';\nimport { isSimpleLinear, isWaffle } from '../../layout/viewmodel/viewmodel';\nimport { partitionDrilldownFocus, partitionMultiGeometries } from '../../state/selectors/geometries';\n\n/** @internal */\nexport interface ContinuousDomainFocus {\n  currentFocusX0: number;\n  currentFocusX1: number;\n  prevFocusX0: number;\n  prevFocusX1: number;\n}\n\n/** @internal */\nexport interface IndexedContinuousDomainFocus extends ContinuousDomainFocus, SmallMultiplesDescriptors {}\n\ninterface ReactiveChartStateProps {\n  isRTL: boolean;\n  initialized: boolean;\n  geometries: ShapeViewModel;\n  geometriesFoci: ContinuousDomainFocus[];\n  multiGeometries: ShapeViewModel[];\n  chartDimensions: Dimensions;\n  a11ySettings: A11ySettings;\n  debug: SettingsSpec['debug'];\n  background: Color;\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface ReactiveChartOwnProps {\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype PartitionProps = ReactiveChartStateProps & ReactiveChartDispatchProps & ReactiveChartOwnProps;\n\n/** @internal */\nexport type AnimationState = { rafId: number };\n\nclass PartitionComponent extends React.Component<PartitionProps> {\n  static displayName = 'Partition';\n\n  // firstRender = true; // this will be useful for stable resizing of treemaps\n  private ctx: CanvasRenderingContext2D | null;\n  private animationState: AnimationState;\n\n  // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example\n  private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `<canvas>` dimensions\n\n  constructor(props: Readonly<PartitionProps>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n    this.animationState = { rafId: NaN };\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  handleMouseMove(e: MouseEvent<HTMLCanvasElement>) {\n    const {\n      initialized,\n      chartDimensions: { width, height },\n      forwardStageRef,\n    } = this.props;\n    const [focus] = this.props.geometriesFoci;\n    if (!forwardStageRef.current || !this.ctx || !initialized || width === 0 || height === 0 || !focus) {\n      return;\n    }\n    const picker = this.props.geometries.pickQuads;\n    const box = forwardStageRef.current.getBoundingClientRect();\n    const { diskCenter } = this.props.geometries;\n    const x = e.clientX - box.left - diskCenter.x;\n    const y = e.clientY - box.top - diskCenter.y;\n    const pickedShapes: Array<QuadViewModel> = picker(x, y, focus);\n    const datumIndices = new Set();\n    pickedShapes.forEach((shape) => {\n      const node = shape[MODEL_KEY];\n      const shapeNode = node.children.find(([key]) => key === shape.dataName);\n      if (shapeNode) {\n        const indices = shapeNode[1][INPUT_KEY] || [];\n        indices.forEach((i) => datumIndices.add(i));\n      }\n    });\n\n    return pickedShapes; // placeholder\n  }\n\n  render() {\n    const {\n      forwardStageRef,\n      initialized,\n      chartDimensions: { width, height },\n      a11ySettings,\n      debug,\n      isRTL,\n    } = this.props;\n    return width === 0 || height === 0 || !initialized ? null : (\n      <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n        <canvas\n          dir={isRTL ? 'rtl' : 'ltr'}\n          ref={forwardStageRef}\n          className=\"echCanvasRenderer\"\n          width={width * this.devicePixelRatio}\n          height={height * this.devicePixelRatio}\n          onMouseMove={this.handleMouseMove.bind(this)}\n          style={{\n            width,\n            height,\n          }}\n          // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n          role=\"presentation\"\n        >\n          <ScreenReaderSummary />\n          {!debug && <ScreenReaderPartitionTable />}\n        </canvas>\n        {debug && <ScreenReaderPartitionTable />}\n      </figure>\n    );\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      const { ctx, devicePixelRatio, props } = this;\n      clearCanvas(ctx, props.background);\n      props.multiGeometries.forEach((geometries, geometryIndex) => {\n        const focus = props.geometriesFoci[geometryIndex];\n        if (!focus) return;\n\n        const renderer = isSimpleLinear(geometries.layout, geometries.style.fillLabel, geometries.layers)\n          ? renderLinearPartitionCanvas2d\n          : isWaffle(geometries.layout)\n            ? renderWrappedPartitionCanvas2d\n            : renderPartitionCanvas2d;\n        renderer(ctx, devicePixelRatio, geometries, focus, this.animationState);\n      });\n    }\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators({ onChartRendered }, dispatch);\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  isRTL: false,\n  initialized: false,\n  geometries: nullShapeViewModel(),\n  geometriesFoci: [],\n  multiGeometries: [],\n  chartDimensions: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  debug: false,\n  background: Colors.Transparent.keyword,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  const multiGeometries = partitionMultiGeometries(state);\n\n  return {\n    isRTL: hasMostlyRTLLabels(multiGeometries),\n    initialized: true,\n    geometries: multiGeometries[0] ?? nullShapeViewModel(),\n    multiGeometries,\n    chartDimensions: getChartContainerDimensionsSelector(state),\n    geometriesFoci: partitionDrilldownFocus(state),\n    a11ySettings: getA11ySettingsSelector(state),\n    debug: getSettingsSpecSelector(state).debug,\n    background: getChartThemeSelector(state).background.color,\n  };\n};\n\n/** @internal */\nexport const Partition = connect(mapStateToProps, mapDispatchToProps)(PartitionComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Colors } from '../../../../common/colors';\nimport { TAU } from '../../../../common/constants';\nimport { PointObject } from '../../../../common/geometry';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { PartitionLayout } from '../../layout/types/config_types';\nimport {\n  nullPartitionSmallMultiplesModel,\n  PartitionSmallMultiplesModel,\n  QuadViewModel,\n  ShapeViewModel,\n} from '../../layout/types/viewmodel_types';\nimport { isSunburst, isTreemap, isMosaic } from '../../layout/viewmodel/viewmodel';\nimport { ContinuousDomainFocus, IndexedContinuousDomainFocus } from '../canvas/partition';\n\ninterface HighlightSet extends PartitionSmallMultiplesModel {\n  geometries: QuadViewModel[];\n  geometriesFoci: ContinuousDomainFocus[];\n  diskCenter: PointObject;\n  outerRadius: number;\n  layout: PartitionLayout;\n}\n\n/** @internal */\nexport interface HighlighterProps {\n  chartId: string;\n  initialized: boolean;\n  canvasDimension: Dimensions;\n  renderAsOverlay: boolean;\n  highlightSets: HighlightSet[];\n}\n\nconst EPSILON = 1e-6;\n\ninterface SVGStyle {\n  color?: string;\n  fillClassName?: string;\n  strokeClassName?: string;\n}\n\n/**\n * This function return an SVG arc path from the same parameters of the canvas.arc function call\n * @param x The horizontal coordinate of the arc's center\n * @param y The vertical coordinate of the arc's center\n * @param r The arc's radius. Must be positive\n * @param a0 The angle at which the arc starts in radians, measured from the positive x-axis\n * @param a1 The angle at which the arc ends in radians, measured from the positive x-axis\n * @param ccw If true, draws the arc counter-clockwise between the start and end angles\n */\nfunction getSectorShapeFromCanvasArc(x: number, y: number, r: number, a0: number, a1: number, ccw: boolean): string {\n  const cw = ccw ? 0 : 1;\n  const diff = a1 - a0;\n  const direction = ccw ? -1 : 1;\n  return `A${r},${r},0,${+(direction * diff >= Math.PI)},${cw},${x + r * Math.cos(a1)},${y + r * Math.sin(a1)}`;\n}\n\n/**\n * Renders an SVG Rect from a partition chart QuadViewModel\n */\nfunction renderRectangles(\n  geometry: QuadViewModel,\n  key: string,\n  style: SVGStyle,\n  { currentFocusX0, currentFocusX1 }: ContinuousDomainFocus,\n  width: number,\n) {\n  const { x0, x1, y0px, y1px } = geometry;\n  const props = style.color ? { fill: style.color } : { className: style.fillClassName };\n  const scale = width / (currentFocusX1 - currentFocusX0);\n  const fx0 = Math.max((x0 - currentFocusX0) * scale, 0);\n  const fx1 = Math.min((x1 - currentFocusX0) * scale, width);\n  return <rect key={key} x={fx0} y={y0px} width={Math.abs(fx1 - fx0)} height={Math.abs(y1px - y0px)} {...props} />;\n}\n\n/**\n * Render an SVG path or circle from a partition chart QuadViewModel\n */\nfunction renderSector(geometry: QuadViewModel, key: string, { color, fillClassName, strokeClassName }: SVGStyle) {\n  const { x0, x1, y0px, y1px } = geometry;\n  if ((Math.abs(x0 - x1) + TAU) % TAU < EPSILON) {\n    const props =\n      y0px === 0\n        ? {\n            key,\n            r: y1px,\n            stroke: 'none',\n            ...(color ? { fill: color } : { className: fillClassName }),\n          }\n        : {\n            key,\n            r: (y0px + y1px) / 2,\n            strokeWidth: y1px - y0px,\n            fill: 'none',\n            ...(color ? { stroke: color } : { className: strokeClassName }),\n          };\n    return <circle {...props} />;\n  }\n  const X0 = x0 - TAU / 4;\n  const X1 = x1 - TAU / 4;\n  const path = [\n    `M${y0px * Math.cos(X0)},${y0px * Math.sin(X0)}`,\n    getSectorShapeFromCanvasArc(0, 0, y0px, X0, X1, false),\n    `L${y1px * Math.cos(X1)},${y1px * Math.sin(X1)}`,\n    getSectorShapeFromCanvasArc(0, 0, y1px, X1, X0, true),\n    'Z',\n  ].join(' ');\n  const props = color ? { fill: color } : { className: fillClassName };\n  return <path key={key} d={path} {...props} />;\n}\n\nfunction renderGeometries(\n  geoms: QuadViewModel[],\n  partitionLayout: PartitionLayout,\n  style: SVGStyle,\n  foci: ContinuousDomainFocus[],\n  width: number,\n) {\n  const maxDepth = geoms.reduce((acc, geom) => Math.max(acc, geom.depth), 0);\n  // we should render only the deepest geometries of the tree to avoid overlaying highlighted geometries\n  const highlightedGeoms =\n    isTreemap(partitionLayout) || isMosaic(partitionLayout) ? geoms.filter((g) => g.depth >= maxDepth) : geoms;\n  const renderGeom = isSunburst(partitionLayout) ? renderSector : renderRectangles;\n  return highlightedGeoms.map((geometry, index) =>\n    renderGeom(\n      geometry,\n      `${index}`,\n      style,\n      foci[0] ?? {\n        currentFocusX0: NaN,\n        currentFocusX1: NaN,\n        prevFocusX0: NaN,\n        prevFocusX1: NaN,\n      },\n      width,\n    ),\n  );\n}\n\n/** @internal */\nexport class HighlighterComponent extends React.Component<HighlighterProps> {\n  static displayName = 'Highlighter';\n\n  renderAsMask() {\n    const {\n      chartId,\n      canvasDimension: { width },\n      highlightSets,\n    } = this.props;\n\n    const maskId = (ind: number, ind2: number) => `echHighlighterMask__${chartId}__${ind}__${ind2}`;\n\n    const someGeometriesHighlighted = highlightSets.some(({ geometries }) => geometries.length > 0);\n    const renderedHighlightSet = someGeometriesHighlighted ? highlightSets : [];\n\n    return (\n      <>\n        <defs>\n          {renderedHighlightSet\n            .filter(({ geometries, outerRadius }) => geometries.length > 0 && outerRadius > 0)\n            .map(\n              ({\n                geometries,\n                geometriesFoci,\n                diskCenter,\n                index,\n                innerIndex,\n                layout,\n                marginLeftPx,\n                marginTopPx,\n                panel: { innerWidth, innerHeight },\n              }) => (\n                <mask key={maskId(index, innerIndex)} id={maskId(index, innerIndex)}>\n                  <rect x={marginLeftPx} y={marginTopPx} width={innerWidth} height={innerHeight} fill=\"white\" />\n                  <g transform={`translate(${diskCenter.x}, ${diskCenter.y})`}>\n                    {renderGeometries(geometries, layout, { color: Colors.Black.keyword }, geometriesFoci, width)}\n                  </g>\n                </mask>\n              ),\n            )}\n        </defs>\n        {renderedHighlightSet\n          .filter(({ outerRadius }) => outerRadius > 0)\n          .map(\n            ({\n              diskCenter,\n              outerRadius,\n              index,\n              innerIndex,\n              layout,\n              marginLeftPx,\n              marginTopPx,\n              panel: { innerWidth, innerHeight },\n            }) =>\n              isSunburst(layout) ? (\n                <circle\n                  key={`${index}__${innerIndex}`}\n                  cx={diskCenter.x}\n                  cy={diskCenter.y}\n                  r={outerRadius}\n                  mask={`url(#${maskId(index, innerIndex)})`}\n                  className=\"echHighlighter__mask\"\n                />\n              ) : (\n                <rect\n                  key={`${index}__${innerIndex}`}\n                  x={marginLeftPx}\n                  y={marginTopPx}\n                  width={innerWidth}\n                  height={innerHeight}\n                  mask={`url(#${maskId(index, innerIndex)})`}\n                  className=\"echHighlighter__mask\"\n                />\n              ),\n          )}\n      </>\n    );\n  }\n\n  renderAsOverlay() {\n    const {\n      canvasDimension: { width },\n    } = this.props;\n    return this.props.highlightSets\n      .filter(({ geometries, outerRadius }) => geometries.length > 0 && outerRadius > 0)\n      .map(({ index, innerIndex, layout, geometries, diskCenter, geometriesFoci }) => (\n        <g key={`${index}|${innerIndex}`} transform={`translate(${diskCenter.x}, ${diskCenter.y})`}>\n          {renderGeometries(\n            geometries,\n            layout,\n            {\n              fillClassName: 'echHighlighterOverlay__fill',\n              strokeClassName: 'echHighlighterOverlay__stroke',\n            },\n            geometriesFoci,\n            width,\n          )}\n        </g>\n      ));\n  }\n\n  render() {\n    return (\n      <svg className=\"echHighlighter\" width=\"100%\" height=\"100%\">\n        {this.props.renderAsOverlay ? this.renderAsOverlay() : this.renderAsMask()}\n      </svg>\n    );\n  }\n}\n\n/** @internal */\nexport const DEFAULT_PROPS: HighlighterProps = {\n  chartId: 'empty',\n  initialized: false,\n  renderAsOverlay: false,\n  canvasDimension: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  highlightSets: [\n    {\n      ...nullPartitionSmallMultiplesModel(),\n      geometries: [],\n      geometriesFoci: [],\n      diskCenter: {\n        x: 0,\n        y: 0,\n      },\n      outerRadius: 10,\n    },\n  ],\n};\n\n/** @internal */\nexport function highlightSetMapper(geometries: QuadViewModel[], foci: IndexedContinuousDomainFocus[]) {\n  return (vm: ShapeViewModel): HighlightSet => {\n    const { index, innerIndex } = vm;\n    return {\n      ...vm,\n      geometries: geometries.filter(({ index: i, innerIndex: ii }) => index === i && innerIndex === ii),\n      geometriesFoci: foci.filter(({ index: i, innerIndex: ii }) => index === i && innerIndex === ii),\n    };\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { connect } from 'react-redux';\n\nimport { DEFAULT_PROPS, HighlighterComponent, HighlighterProps, highlightSetMapper } from './highlighter';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { partitionDrilldownFocus, partitionMultiGeometries } from '../../state/selectors/geometries';\nimport { getPickedShapes } from '../../state/selectors/picked_shapes';\n\nconst hoverMapStateToProps = (state: GlobalChartState): HighlighterProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n\n  const canvasDimension = getChartContainerDimensionsSelector(state);\n  const { chartId } = state;\n\n  const allGeometries = partitionMultiGeometries(state);\n  const geometriesFoci = partitionDrilldownFocus(state);\n  const pickedGeometries = getPickedShapes(state);\n\n  const highlightSets = allGeometries.map(highlightSetMapper(pickedGeometries, geometriesFoci));\n\n  return {\n    chartId,\n    initialized: true,\n    renderAsOverlay: true,\n    canvasDimension,\n    highlightSets,\n  };\n};\n\n/**\n * Partition chart highlighter from mouse hover events\n * @internal\n */\nexport const HighlighterFromHover = connect(hoverMapStateToProps)(HighlighterComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { connect } from 'react-redux';\n\nimport { HighlighterComponent, HighlighterProps, DEFAULT_PROPS, highlightSetMapper } from './highlighter';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { partitionDrilldownFocus, partitionMultiGeometries } from '../../state/selectors/geometries';\nimport { legendHoverHighlightNodes } from '../../state/selectors/get_highlighted_shapes';\n\nconst legendMapStateToProps = (state: GlobalChartState): HighlighterProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n\n  const { chartId } = state;\n\n  const geometries = legendHoverHighlightNodes(state);\n  const geometriesFoci = partitionDrilldownFocus(state);\n  const canvasDimension = getChartContainerDimensionsSelector(state);\n  const multiGeometries = partitionMultiGeometries(state);\n  const highlightMapper = highlightSetMapper(geometries, geometriesFoci);\n  const highlightSets = multiGeometries.map(highlightMapper);\n\n  return {\n    chartId,\n    initialized: true,\n    renderAsOverlay: false,\n    canvasDimension,\n    highlightSets,\n  };\n};\n\n/**\n * Partition chart highlighter from legend events\n * @internal\n */\nexport const HighlighterFromLegend = connect(legendMapStateToProps)(HighlighterComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { HighlighterFromHover } from './highlighter_hover';\nimport { HighlighterFromLegend } from './highlighter_legend';\nimport { Tooltip } from '../../../../components/tooltip/tooltip';\nimport { BackwardRef } from '../../../../state/chart_state';\nimport { Partition } from '../canvas/partition';\n\n/** @internal */\nexport function render(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) {\n  return (\n    <>\n      <Tooltip getChartContainerRef={containerRef} />\n      <Partition forwardStageRef={forwardStageRef} />\n      <HighlighterFromHover />\n      <HighlighterFromLegend />\n    </>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { LegacyAnimationConfig } from '../../../common/animation';\nimport { Distance, Pixels, Radius } from '../../../common/geometry';\nimport { BaseDatum, Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants'; // kept as unshortened import on separate line otherwise import circularity emerges\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { IndexedAccessorFn } from '../../../utils/accessor';\nimport {\n  Datum,\n  LabelAccessor,\n  ShowAccessor,\n  ValueAccessor,\n  ValueFormatter,\n  stripUndefined,\n} from '../../../utils/common';\nimport { FillFontSizeRange, FillLabelConfig } from '../../../utils/themes/partition';\nimport { percentFormatter } from '../layout/config';\nimport { PartitionLayout } from '../layout/types/config_types';\nimport { NodeColorAccessor, ValueGetter } from '../layout/types/viewmodel_types';\nimport { NodeSorter, AGGREGATE_KEY } from '../layout/utils/group_by_rollup';\n\ninterface ExtendedFillLabelConfig extends FillLabelConfig, FillFontSizeRange {\n  valueFormatter: ValueFormatter;\n}\n\n/**\n * Specification for a given layer in the partition chart\n * @public\n */\nexport interface Layer<D extends BaseDatum = Datum> {\n  groupByRollup: IndexedAccessorFn<D>;\n  sortPredicate?: NodeSorter | null;\n  nodeLabel?: LabelAccessor;\n  fillLabel?: Partial<ExtendedFillLabelConfig>;\n  showAccessor?: ShowAccessor;\n  shape?: { fillColor: string | NodeColorAccessor };\n}\n\n/**\n * Specifies the partition chart\n * @public\n */\nexport interface PartitionSpec<D extends BaseDatum = Datum> extends Spec, LegacyAnimationConfig {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Partition;\n  data: D[];\n  valueAccessor: ValueAccessor<D>;\n  valueFormatter: ValueFormatter;\n  valueGetter: ValueGetter;\n  percentFormatter: ValueFormatter;\n  topGroove: Pixels;\n  smallMultiples: string | null;\n  layers: Layer<D>[];\n  /**\n   * Largest to smallest sectors are positioned in a clockwise order\n   */\n  clockwiseSectors: boolean;\n  /**\n   * Starts placement with the second largest slice, for the innermost pie/ring\n   */\n  specialFirstInnermostSector: boolean;\n  layout: PartitionLayout;\n  maxRowCount: number;\n  /** @alpha */\n  drilldown: boolean;\n\n  // These need examples or documentation\n  fillOutside: boolean;\n  radiusOutside: Radius;\n  fillRectangleWidth: Distance;\n  fillRectangleHeight: Distance;\n}\n\nconst buildProps = buildSFProps<PartitionSpec>()(\n  {\n    chartType: ChartType.Partition,\n    specType: SpecType.Series,\n  },\n  {\n    valueAccessor: (d) => (typeof d === 'number' ? d : 0),\n    valueGetter: (n) => n[AGGREGATE_KEY],\n    valueFormatter: (d) => String(d),\n    percentFormatter,\n    topGroove: 20,\n    smallMultiples: '__global__small_multiples___',\n    layers: [\n      {\n        groupByRollup: (_, i) => i,\n        nodeLabel: (d) => String(d),\n        showAccessor: () => true,\n        fillLabel: {},\n      },\n    ],\n    clockwiseSectors: true,\n    specialFirstInnermostSector: true,\n    layout: PartitionLayout.sunburst,\n    drilldown: false,\n    maxRowCount: 12,\n    fillOutside: false,\n    radiusOutside: 128,\n    fillRectangleWidth: Infinity,\n    fillRectangleHeight: Infinity,\n    animation: { duration: 0 },\n  },\n);\n\n/**\n * Adds partition spec to chart specs\n * @public\n */\nexport const Partition = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    PartitionSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<PartitionSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type PartitionProps = ComponentProps<typeof Partition>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RefObject } from 'react';\n\nimport { computeLegendSelector } from './selectors/compute_legend';\nimport { getChartTypeDescriptionSelector } from './selectors/get_chart_type_description';\nimport { getPointerCursorSelector } from './selectors/get_cursor_pointer';\nimport { getDebugStateSelector } from './selectors/get_debug_state';\nimport { getLegendItemsExtra } from './selectors/get_legend_items_extra';\nimport { getLegendItemsLabels } from './selectors/get_legend_items_labels';\nimport { isTooltipVisibleSelector } from './selectors/is_tooltip_visible';\nimport { createOnElementClickCaller } from './selectors/on_element_click_caller';\nimport { createOnElementOutCaller } from './selectors/on_element_out_caller';\nimport { createOnElementOverCaller } from './selectors/on_element_over_caller';\nimport { getPartitionSpec } from './selectors/partition_spec';\nimport { getTooltipInfoSelector } from './selectors/tooltip';\nimport { ChartType } from '../..';\nimport { BackwardRef, GlobalChartState, InternalChartState } from '../../../state/chart_state';\nimport { getActivePointerPosition } from '../../../state/selectors/get_active_pointer_position';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { DebugState } from '../../../state/types';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { render } from '../renderer/dom/layered_partition_chart';\n\n/** @internal */\nexport class PartitionState implements InternalChartState {\n  chartType = ChartType.Partition;\n\n  onElementClickCaller: (state: GlobalChartState) => void;\n\n  onElementOverCaller: (state: GlobalChartState) => void;\n\n  onElementOutCaller: (state: GlobalChartState) => void;\n\n  constructor() {\n    this.onElementClickCaller = createOnElementClickCaller();\n    this.onElementOverCaller = createOnElementOverCaller();\n    this.onElementOutCaller = createOnElementOutCaller();\n  }\n\n  isInitialized(globalState: GlobalChartState) {\n    return getPartitionSpec(globalState) !== null ? InitStatus.Initialized : InitStatus.SpecNotInitialized;\n  }\n\n  isBrushAvailable() {\n    return false;\n  }\n\n  isBrushing() {\n    return false;\n  }\n\n  isChartEmpty() {\n    return false;\n  }\n\n  getLegendItemsLabels(globalState: GlobalChartState) {\n    // order doesn't matter, but it needs to return the highest depth of the label occurrence so enough horizontal width is allocated\n    // the label item strings needs to be a concatenation of the label + the extra formatted value if available.\n    // this is required to compute the legend automatic width\n    return getLegendItemsLabels(globalState);\n  }\n\n  getLegendItems(globalState: GlobalChartState) {\n    return computeLegendSelector(globalState);\n  }\n\n  getLegendExtraValues(globalState: GlobalChartState) {\n    return getLegendItemsExtra(globalState);\n  }\n\n  chartRenderer(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) {\n    return render(containerRef, forwardStageRef);\n  }\n\n  getPointerCursor(globalState: GlobalChartState) {\n    return getPointerCursorSelector(globalState);\n  }\n\n  isTooltipVisible(globalState: GlobalChartState) {\n    return {\n      visible: isTooltipVisibleSelector(globalState),\n      isExternal: false,\n      displayOnly: false,\n      isPinnable: true,\n    };\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfoSelector(globalState);\n  }\n\n  getTooltipAnchor(state: GlobalChartState) {\n    const position = getActivePointerPosition(state);\n    return {\n      isRotated: false,\n      x: position.x,\n      width: 0,\n      y: position.y,\n      height: 0,\n    };\n  }\n\n  eventCallbacks(globalState: GlobalChartState) {\n    this.onElementOverCaller(globalState);\n    this.onElementOutCaller(globalState);\n    this.onElementClickCaller(globalState);\n  }\n\n  // TODO\n  getProjectionContainerArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getMainProjectionArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getBrushArea(): Dimensions | null {\n    return null;\n  }\n\n  getDebugState(state: GlobalChartState): DebugState {\n    return getDebugStateSelector(state);\n  }\n\n  getChartTypeDescription(state: GlobalChartState): string {\n    return getChartTypeDescriptionSelector(state);\n  }\n\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { getTrees } from './tree';\nimport { RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Colors } from '../../../../common/colors';\nimport { LegendItem } from '../../../../common/legend';\nimport { SeriesIdentifier } from '../../../../common/series_id';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLegendConfigSelector } from '../../../../state/selectors/get_legend_config_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { SpecId } from '../../../../utils/ids';\nimport { isHierarchicalLegend } from '../../../../utils/legend';\nimport { PartitionLayout } from '../../layout/types/config_types';\nimport {\n  AGGREGATE_KEY,\n  ArrayNode,\n  CHILDREN_KEY,\n  DEPTH_KEY,\n  HIERARCHY_ROOT_KEY,\n  HierarchyOfArrays,\n  PATH_KEY,\n} from '../../layout/utils/group_by_rollup';\nimport { isLinear } from '../../layout/viewmodel/viewmodel';\nimport { Layer, PartitionSpec } from '../../specs';\n\nfunction compareLegendItemNames(aItem: LegendNode, bItem: LegendNode, locale: string): number {\n  return aItem.item.label.localeCompare(bItem.item.label, locale);\n}\n\nfunction compareDescendingLegendItemValues(aItem: LegendNode, bItem: LegendNode): number {\n  return (aItem.item.depth ?? -1) - (bItem.item.depth ?? -1) || bItem.node[AGGREGATE_KEY] - aItem.node[AGGREGATE_KEY];\n}\n\n/** @internal */\nexport const computeLegendSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector, getPartitionSpecs, getLegendConfigSelector, getTrees],\n  (settings, [spec], { flatLegend, legendMaxDepth, legendPosition }, trees): LegendItem[] => {\n    if (!spec) return [];\n\n    const sortingFn = flatLegend && settings.legendSort;\n    const { locale } = settings;\n    return trees.flatMap((tree) => {\n      const customSortingFn = sortingFn\n        ? (aItem: LegendNode, bItem: LegendNode) =>\n            sortingFn(\n              {\n                smAccessorValue: tree.smAccessorValue,\n                specId: aItem.item.seriesIdentifiers[0]?.specId,\n                key: aItem.item.seriesIdentifiers[0]?.key,\n              } as SeriesIdentifier,\n              {\n                smAccessorValue: tree.smAccessorValue,\n                specId: bItem.item.seriesIdentifiers[0]?.specId,\n                key: bItem.item.seriesIdentifiers[0]?.key,\n              } as SeriesIdentifier,\n            )\n        : undefined;\n      const useHierarchicalLegend = isHierarchicalLegend(flatLegend, legendPosition);\n      const { valueFormatter } = spec;\n      const items = walkTree(spec.id, useHierarchicalLegend, valueFormatter, tree.tree, spec.layers, 0);\n      return items\n        .filter((d) => {\n          const depth = d.item.depth ?? -1;\n          // remove hierarchy root\n          if (d.item.childId === HIERARCHY_ROOT_KEY) {\n            return false;\n          }\n          return depth < legendMaxDepth;\n        })\n        .sort(\n          customSortingFn ??\n            (spec.layout === PartitionLayout.waffle // waffle has inherent top to bottom descending order\n              ? compareDescendingLegendItemValues\n              : isLinear(spec.layout) // icicle/flame are sorted by name\n                ? (a, b) => compareLegendItemNames(a, b, locale)\n                : () => 0), // all others are sorted by hierarchy\n        )\n        .map(({ item }) => item);\n    });\n  },\n);\n\ntype LegendNode = { item: LegendItem; node: ArrayNode };\n\nfunction walkTree(\n  specId: SpecId,\n  useHierarchicalLegend: boolean,\n  valueFormatter: PartitionSpec['valueFormatter'],\n  tree: HierarchyOfArrays,\n  layers: Layer[],\n  depth: number,\n  uniqueNames: Set<string> = new Set(),\n  legendItems: Array<{ item: LegendItem; node: ArrayNode }> = [],\n): { item: LegendItem; node: ArrayNode }[] {\n  if (tree.length === 0) {\n    return legendItems;\n  }\n\n  for (const [key, node] of tree) {\n    const layer = layers[depth - 1];\n    const formatter = layer?.nodeLabel ?? ((d) => `${d}`);\n\n    const fill = layer?.shape?.fillColor ?? RGBATupleToString(Colors.DarkOpaqueRed.rgba);\n    const fillColor = typeof fill === 'function' ? fill(key, node.sortIndex, node, tree) : fill;\n    const label = formatter(key);\n    const joinedPath = node[PATH_KEY].map((d) => d.value).join('##');\n    const uniqueKey = `${depth}--${joinedPath}--${label}--${fillColor}--${node[AGGREGATE_KEY]}`;\n    if (!isNil(key) && !uniqueNames.has(uniqueKey)) {\n      legendItems.push({\n        item: {\n          color: fillColor,\n          childId: key,\n          label,\n          path: node[PATH_KEY],\n          depth: node[DEPTH_KEY] - 1,\n          seriesIdentifiers: [{ key, specId }],\n          keys: [],\n          defaultExtra: {\n            raw: node[AGGREGATE_KEY],\n            formatted: valueFormatter(node[AGGREGATE_KEY]),\n            legendSizingLabel: `${node[AGGREGATE_KEY]}`,\n          },\n        },\n        node,\n      });\n      uniqueNames.add(uniqueKey);\n    }\n    const children = node[CHILDREN_KEY];\n    walkTree(specId, useHierarchicalLegend, valueFormatter, children, layers, depth + 1, uniqueNames, legendItems);\n  }\n  return legendItems;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './partition_spec';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { isSimpleLinear } from '../../layout/viewmodel/viewmodel';\n\n/** @internal */\nexport const drilldownActive = createCustomCachedSelector(\n  [getPartitionSpecs, getChartThemeSelector],\n  (specs, { partition }) => {\n    return specs.length === 1 && specs[0] && isSimpleLinear(specs[0].layout, partition.fillLabel, specs[0].layers);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { getTrees, StyledTree } from './tree';\nimport { ChartType } from '../../..';\nimport { CategoryKey } from '../../../../common/category';\nimport { Pixels } from '../../../../common/geometry';\nimport { Font } from '../../../../common/text_utils';\nimport { RelativeBandsPadding, SmallMultiplesSpec, SpecType } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecsFromStore } from '../../../../state/utils';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { nullShapeViewModel, QuadViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { getShapeViewModel } from '../../layout/viewmodel/scenegraph';\nimport { IndexedContinuousDomainFocus } from '../../renderer/canvas/partition';\n\nconst horizontalSplit = (s?: SmallMultiplesSpec) => s?.splitHorizontally;\nconst verticalSplit = (s?: SmallMultiplesSpec) => s?.splitVertically;\n\nfunction bandwidth(range: Pixels, bandCount: number, { outer, inner }: RelativeBandsPadding) {\n  // same convention as d3.scaleBand https://observablehq.com/@d3/d3-scaleband\n  return range / (2 * outer + bandCount + bandCount * inner - inner);\n}\n\n/** @internal */\nexport const partitionMultiGeometries = createCustomCachedSelector(\n  [getSpecs, getPartitionSpecs, getChartContainerDimensionsSelector, getTrees, getChartThemeSelector],\n  (\n    specs,\n    partitionSpecs,\n    parentDimensions,\n    trees,\n    { background, axes: { axisPanelTitle }, chartMargins, chartPaddings, partition: partitionStyle },\n  ): ShapeViewModel[] => {\n    const smallMultiplesSpecs = getSpecsFromStore<SmallMultiplesSpec>(specs, ChartType.Global, SpecType.SmallMultiples);\n    const { width, height } = parentDimensions;\n    const chartWidth = width - chartMargins.left - chartMargins.right;\n    const chartHeight = height - chartMargins.top - chartMargins.bottom;\n\n    // todo make it part of configuration\n    const outerSpecDirection = ['horizontal', 'vertical', 'zigzag'][0];\n\n    const innerBreakdownDirection = horizontalSplit(smallMultiplesSpecs[0])\n      ? 'horizontal'\n      : verticalSplit(smallMultiplesSpecs[0])\n        ? 'vertical'\n        : 'zigzag';\n\n    const outerPanelCount = partitionSpecs.length;\n    const zigzagColumnCount = Math.ceil(Math.sqrt(outerPanelCount));\n    const zigzagRowCount = Math.ceil(outerPanelCount / zigzagColumnCount);\n\n    const outerWidthRatio =\n      outerSpecDirection === 'horizontal'\n        ? 1 / outerPanelCount\n        : outerSpecDirection === 'zigzag'\n          ? 1 / zigzagColumnCount\n          : 1;\n    const outerHeightRatio =\n      outerSpecDirection === 'vertical'\n        ? 1 / outerPanelCount\n        : outerSpecDirection === 'zigzag'\n          ? 1 / zigzagRowCount\n          : 1;\n\n    const result = partitionSpecs.flatMap((spec, index) => {\n      const innerWidth = chartWidth - chartPaddings.left - chartPaddings.right;\n      const innerHeight = chartHeight - chartPaddings.top - chartPaddings.bottom;\n\n      return trees.map(({ name, smAccessorValue, style, tree: t }: StyledTree, innerIndex, a) => {\n        const innerPanelCount = a.length;\n        const outerPanelWidth = innerWidth * outerWidthRatio;\n        const outerPanelHeight = innerHeight * outerHeightRatio;\n        const outerPanelArea = outerPanelWidth * outerPanelHeight;\n        const innerPanelTargetArea = outerPanelArea / innerPanelCount;\n        const innerPanelTargetHeight = Math.sqrt(innerPanelTargetArea); // attempting squarish inner panels\n\n        const innerZigzagRowCountEstimate = Math.max(1, Math.floor(outerPanelHeight / innerPanelTargetHeight)); // err on the side of landscape aspect ratio\n        const innerZigzagColumnCount = Math.ceil(a.length / innerZigzagRowCountEstimate);\n        const innerZigzagRowCount = Math.ceil(a.length / innerZigzagColumnCount);\n        const innerRowCount =\n          innerBreakdownDirection === 'vertical'\n            ? a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? innerZigzagRowCount\n              : 1;\n        const innerColumnCount =\n          innerBreakdownDirection === 'vertical'\n            ? 1\n            : innerBreakdownDirection === 'zigzag'\n              ? innerZigzagColumnCount\n              : a.length;\n        const innerRowIndex =\n          innerBreakdownDirection === 'vertical'\n            ? innerIndex\n            : innerBreakdownDirection === 'zigzag'\n              ? Math.floor(innerIndex / innerZigzagColumnCount)\n              : 0;\n        const innerColumnIndex =\n          innerBreakdownDirection === 'vertical'\n            ? 0\n            : innerBreakdownDirection === 'zigzag'\n              ? innerIndex % innerZigzagColumnCount\n              : innerIndex;\n        const topOuterRatio =\n          outerSpecDirection === 'vertical'\n            ? index / outerPanelCount\n            : outerSpecDirection === 'zigzag'\n              ? Math.floor(index / zigzagColumnCount) / zigzagRowCount\n              : 0;\n        const topInnerRatio =\n          outerHeightRatio *\n          (innerBreakdownDirection === 'vertical'\n            ? innerIndex / a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? Math.floor(innerIndex / innerZigzagColumnCount) / innerZigzagRowCount\n              : 0);\n        const panelHeightRatio =\n          outerHeightRatio *\n          (innerBreakdownDirection === 'vertical'\n            ? 1 / a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? 1 / innerZigzagRowCount\n              : 1);\n        const leftOuterRatio =\n          outerSpecDirection === 'horizontal'\n            ? index / outerPanelCount\n            : outerSpecDirection === 'zigzag'\n              ? (index % zigzagColumnCount) / zigzagColumnCount\n              : 0;\n        const leftInnerRatio =\n          outerWidthRatio *\n          (innerBreakdownDirection === 'horizontal'\n            ? innerIndex / a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? (innerIndex % innerZigzagColumnCount) / innerZigzagColumnCount\n              : 0);\n        const panelWidthRatio =\n          outerWidthRatio *\n          (innerBreakdownDirection === 'horizontal'\n            ? 1 / a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? 1 / innerZigzagColumnCount\n              : 1);\n\n        const panelInnerWidth = bandwidth(innerWidth, innerColumnCount, style.horizontalPanelPadding);\n\n        const panelInnerHeight = bandwidth(innerHeight, innerRowCount, style.verticalPanelPadding);\n\n        const marginLeftPx =\n          chartMargins.left +\n          chartPaddings.left +\n          panelInnerWidth * style.horizontalPanelPadding.outer +\n          innerColumnIndex * (panelInnerWidth * (1 + style.horizontalPanelPadding.inner));\n        const marginTopPx =\n          chartMargins.top +\n          chartPaddings.top +\n          panelInnerHeight * style.verticalPanelPadding.outer +\n          innerRowIndex * (panelInnerHeight * (1 + style.verticalPanelPadding.inner));\n\n        const fontFace: Font = {\n          fontStyle: axisPanelTitle.fontStyle ?? 'normal',\n          fontFamily: axisPanelTitle.fontFamily,\n          fontWeight: 'normal',\n          fontVariant: 'normal',\n          textColor: axisPanelTitle.fill,\n        };\n        return getShapeViewModel(spec, parentDimensions, t, background, partitionStyle, {\n          index,\n          innerIndex,\n          layout: spec.layout,\n          smAccessorValue,\n          top: topOuterRatio + topInnerRatio,\n          height: panelHeightRatio,\n          left: leftOuterRatio + leftInnerRatio,\n          width: panelWidthRatio,\n          innerRowCount,\n          innerColumnCount,\n          innerRowIndex,\n          innerColumnIndex,\n          marginLeftPx,\n          marginTopPx,\n          panel: {\n            title: String(name),\n            innerWidth: panelInnerWidth,\n            innerHeight: panelInnerHeight,\n            fontFace,\n            fontSize: axisPanelTitle.fontSize,\n          },\n        });\n      });\n    });\n\n    return result.length === 0\n      ? [nullShapeViewModel(undefined, undefined, { x: outerWidthRatio, y: outerHeightRatio })]\n      : result;\n  },\n);\n\nfunction focusRect(quadViewModel: QuadViewModel[], { left, width }: Dimensions, drilldown: CategoryKey[]) {\n  return drilldown.length === 0\n    ? { x0: left, x1: left + width }\n    : quadViewModel.find(\n        ({ path }) => path.length === drilldown.length && path.every(({ value }, i) => value === drilldown[i]),\n      ) ?? { x0: left, x1: left + width };\n}\n/** @internal */\nexport const partitionDrilldownFocus = createCustomCachedSelector(\n  [\n    partitionMultiGeometries,\n    getChartContainerDimensionsSelector,\n    (state) => state.interactions.drilldown,\n    (state) => state.interactions.prevDrilldown,\n  ],\n  (multiGeometries, chartDimensions, drilldown, prevDrilldown): IndexedContinuousDomainFocus[] =>\n    multiGeometries.map(({ quadViewModel, smAccessorValue, index, innerIndex }) => {\n      const { x0: currentFocusX0, x1: currentFocusX1 } = focusRect(quadViewModel, chartDimensions, drilldown);\n      const { x0: prevFocusX0, x1: prevFocusX1 } = focusRect(quadViewModel, chartDimensions, prevDrilldown);\n      return { currentFocusX0, currentFocusX1, prevFocusX0, prevFocusX1, smAccessorValue, index, innerIndex };\n    }),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpec } from './partition_spec';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const getChartTypeDescriptionSelector = createCustomCachedSelector(\n  [getPartitionSpec],\n  (partitionSpec): string => {\n    return `${partitionSpec?.layout} chart` ?? 'Partition chart';\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPickedShapes } from './picked_shapes';\nimport { DEFAULT_CSS_CURSOR } from '../../../../common/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\n\n/** @internal */\nexport const getPointerCursorSelector = createCustomCachedSelector(\n  [getPickedShapes, getSettingsSpecSelector, getTooltipInteractionState],\n  (pickedShapes, { onElementClick, onElementOver }, tooltipState) => {\n    if (tooltipState.pinned) return;\n    return Array.isArray(pickedShapes) && pickedShapes.length > 0 && (onElementClick || onElementOver)\n      ? 'pointer'\n      : DEFAULT_CSS_CURSOR;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { partitionMultiGeometries } from './geometries';\nimport { TAU } from '../../../../common/constants';\nimport { Pixels, PointObject } from '../../../../common/geometry';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { DebugState, PartitionDebugState } from '../../../../state/types';\nimport { QuadViewModel } from '../../layout/types/viewmodel_types';\nimport { isSunburst } from '../../layout/viewmodel/viewmodel';\n\n/** @internal */\nexport const getDebugStateSelector = createCustomCachedSelector([partitionMultiGeometries], (geoms): DebugState => {\n  return {\n    partition: geoms.reduce<PartitionDebugState[]>((acc, { layout, panel, quadViewModel, diskCenter }) => {\n      const partitions: PartitionDebugState['partitions'] = quadViewModel.map((model) => {\n        const { dataName, depth, fillColor, value } = model;\n        return {\n          name: dataName,\n          depth,\n          color: fillColor,\n          value,\n          coords: isSunburst(layout) ? getCoordsForSector(model, diskCenter) : getCoordsForRectangle(model, diskCenter),\n        };\n      });\n      acc.push({\n        panelTitle: panel.title,\n        partitions,\n      });\n      return acc;\n    }, []),\n  };\n});\n\nfunction getCoordsForSector({ x0, x1, y1px, y0px }: QuadViewModel, diskCenter: PointObject): [Pixels, Pixels] {\n  const X0 = x0 - TAU / 4;\n  const X1 = x1 - TAU / 4;\n  const cr = y0px + (y1px - y0px) / 2;\n  const angle = X0 + (X1 - X0) / 2;\n  const x = Math.round(Math.cos(angle) * cr + diskCenter.x);\n  const y = Math.round(Math.sin(angle) * cr + diskCenter.y);\n  return [x, y];\n}\n\nfunction getCoordsForRectangle({ x0, x1, y1px, y0px }: QuadViewModel, diskCenter: PointObject): [Pixels, Pixels] {\n  const y = Math.round(y0px + (y1px - y0px) / 2 + diskCenter.y);\n  const x = Math.round(x0 + (x1 - x0) / 2 + diskCenter.x);\n  return [x, y];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { partitionMultiGeometries } from './geometries';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { QuadViewModel } from '../../layout/types/viewmodel_types';\nimport { highlightedGeoms } from '../../layout/utils/highlighted_geoms';\n\nconst getHighlightedLegendItemPath = (state: GlobalChartState) => state.interactions.highlightedLegendPath;\n\n/** @internal */\nexport const legendHoverHighlightNodes = createCustomCachedSelector(\n  [getSettingsSpecSelector, getHighlightedLegendItemPath, partitionMultiGeometries],\n  ({ legendStrategy, flatLegend }, highlightedLegendItemPath, geometries): QuadViewModel[] => {\n    if (highlightedLegendItemPath.length === 0) return [];\n    return geometries.flatMap(({ quadViewModel }) =>\n      highlightedGeoms(legendStrategy, flatLegend, quadViewModel, highlightedLegendItemPath),\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpec } from './partition_spec';\nimport { getTrees } from './tree';\nimport { LegendItemExtraValues } from '../../../../common/legend';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getExtraValueMap } from '../../layout/viewmodel/hierarchy_of_arrays';\n\n/** @internal */\nexport const getLegendItemsExtra = createCustomCachedSelector(\n  [getPartitionSpec, getSettingsSpecSelector, getTrees],\n  (spec, { legendMaxDepth }, trees): Map<SeriesKey, LegendItemExtraValues> => {\n    const emptyMap = new Map<SeriesKey, LegendItemExtraValues>();\n    return spec && !Number.isNaN(legendMaxDepth) && legendMaxDepth > 0\n      ? trees.reduce((result, { tree }) => {\n          const treeData = getExtraValueMap(spec.layers, spec.valueFormatter, tree, legendMaxDepth);\n          for (const [key, value] of treeData) {\n            result.set(key, value);\n          }\n          return result;\n        }, emptyMap)\n      : emptyMap;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { getTrees } from './tree';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getLegendLabelsAndValue } from '../../layout/utils/legend_labels';\n\n/** @internal */\nexport const getLegendItemsLabels = createCustomCachedSelector(\n  [getPartitionSpecs, getSettingsSpecSelector, getTrees],\n  (specs, { legendMaxDepth, showLegend, showLegendExtra }, trees): LegendItemLabel[] =>\n    specs.flatMap(({ layers, valueFormatter }) =>\n      showLegend\n        ? trees.flatMap(({ tree }) =>\n            getLegendLabelsAndValue(layers, tree, legendMaxDepth, showLegendExtra ? valueFormatter : () => ''),\n          )\n        : [],\n    ),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecsFromStore } from '../../../../state/utils';\nimport { PartitionSpec } from '../../specs';\n\n/** @internal */\nexport const getPartitionSpecs = createCustomCachedSelector([getSpecs], (specs) => {\n  return getSpecsFromStore<PartitionSpec>(specs, ChartType.Partition, SpecType.Series);\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { partitionMultiGeometries } from './geometries';\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { STATISTICS_KEY } from '../../layout/utils/group_by_rollup';\nimport { PartitionSpec } from '../../specs';\n\n/** @internal */\nexport interface PartitionSectionData {\n  panelTitle?: string;\n  label: string;\n  parentName: string | undefined;\n  depth: number;\n  percentage: string;\n  value: number;\n  valueText: string;\n}\n\n/** @internal */\nexport interface PartitionData {\n  hasMultipleLayers: boolean;\n  isSmallMultiple: boolean;\n  data: PartitionSectionData[];\n}\n\n/**\n * @internal\n */\nconst getScreenReaderDataForPartitions = (\n  [spec]: PartitionSpec[],\n  shapeViewModels: ShapeViewModel[],\n): PartitionSectionData[] => {\n  return shapeViewModels.flatMap(({ quadViewModel, layers, panel }) =>\n    quadViewModel.map(({ depth, value, dataName, parent, path }) => {\n      const label = layers[depth - 1]?.nodeLabel?.(dataName) ?? dataName;\n      const parentValue = path.length > 1 ? path.at(-2)?.value : undefined;\n      const parentName =\n        depth > 1 && parentValue ? layers[depth - 2]?.nodeLabel?.(parentValue) ?? path.at(-1)?.value : 'none';\n\n      return {\n        panelTitle: panel.title,\n        depth,\n        label,\n        parentName,\n        percentage: `${Math.round((value / parent[STATISTICS_KEY].globalAggregate) * 100)}%`,\n        value,\n        valueText: spec?.valueFormatter ? spec.valueFormatter(value) : `${value}`,\n      };\n    }),\n  );\n};\n\n/** @internal */\nexport const getScreenReaderDataSelector = createCustomCachedSelector(\n  [getPartitionSpecs, partitionMultiGeometries],\n  (specs, shapeViewModel): PartitionData => {\n    if (specs.length === 0) {\n      return {\n        hasMultipleLayers: false,\n        isSmallMultiple: false,\n        data: [],\n      };\n    }\n    return {\n      hasMultipleLayers: (specs[0]?.layers.length ?? NaN) > 1,\n      isSmallMultiple: shapeViewModel.length > 1,\n      data: getScreenReaderDataForPartitions(specs, shapeViewModel),\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipInfoSelector } from './tooltip';\nimport { TooltipType } from '../../../../specs/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\n\n/**\n * The brush is available only for Ordinal xScales charts and\n * if we have configured an onBrushEnd listener\n * @internal\n */\nexport const isTooltipVisibleSelector = createCustomCachedSelector(\n  [getTooltipSpecSelector, getTooltipInfoSelector],\n  ({ type }, tooltipInfo): boolean => {\n    return type !== TooltipType.None && tooltipInfo.values.length > 0;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getPartitionSpec } from './partition_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementClickSelector } from '../../../../common/event_handler_selectors';\nimport { GlobalChartState, PointerStates } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastClickSelector } from '../../../../state/selectors/get_last_click';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementClick listener every time the following preconditions are met:\n * - the onElementClick listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnElementClickCaller(): (state: GlobalChartState) => void {\n  const prev: { click: PointerStates['lastClick'] } = { click: null };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Partition) {\n      selector = createCustomCachedSelector(\n        [getPartitionSpec, getLastClickSelector, getSettingsSpecSelector, getPickedShapesLayerValues],\n        getOnElementClickSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getPartitionSpec } from './partition_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementOutSelector } from '../../../../common/event_handler_selectors';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementOut listener every time the following preconditions are met:\n * - the onElementOut listener is available\n * - the highlighted geometries list goes from a list of at least one object to an empty one\n * @internal\n */\nexport function createOnElementOutCaller(): (state: GlobalChartState) => void {\n  const prev: { pickedShapes: number | null } = { pickedShapes: null };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Partition) {\n      selector = createCustomCachedSelector(\n        [getPartitionSpec, getPickedShapesLayerValues, getSettingsSpecSelector],\n        getOnElementOutSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getPartitionSpec } from './partition_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementOverSelector } from '../../../../common/event_handler_selectors';\nimport { LayerValue } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementOver listener every time the following preconditions are met:\n * - the onElementOver listener is available\n * - we have a new set of highlighted geometries on our state\n * @internal\n */\nexport function createOnElementOverCaller(): (state: GlobalChartState) => void {\n  const prev: { pickedShapes: LayerValue[][] } = { pickedShapes: [] };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Partition) {\n      selector = createCustomCachedSelector(\n        [getPartitionSpec, getPickedShapesLayerValues, getSettingsSpecSelector],\n        getOnElementOverSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getSpecsFromStore, getSpecFromStore } from '../../../../state/utils';\nimport { PartitionSpec } from '../../specs';\n\n/** @internal */\nexport function getPartitionSpecs(state: GlobalChartState): PartitionSpec[] {\n  return getSpecsFromStore<PartitionSpec>(state.specs, ChartType.Partition, SpecType.Series);\n}\n\n/** @internal */\nexport function getPartitionSpec(state: GlobalChartState): PartitionSpec | null {\n  return getSpecFromStore<PartitionSpec, false>(state.specs, ChartType.Partition, SpecType.Series, false);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActivePointerPosition } from './../../../../state/selectors/get_active_pointer_position';\nimport { partitionDrilldownFocus, partitionMultiGeometries } from './geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { pickedShapes, pickShapesLayerValues } from '../../layout/viewmodel/picked_shapes';\n\n/** @internal */\nexport const getPickedShapes = createCustomCachedSelector(\n  [partitionMultiGeometries, getActivePointerPosition, partitionDrilldownFocus],\n  pickedShapes,\n);\n\n/** @internal */\nexport const getPickedShapesLayerValues = createCustomCachedSelector([getPickedShapes], pickShapesLayerValues);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { partitionMultiGeometries } from './geometries';\nimport { getPartitionSpec } from './partition_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { pickShapesTooltipValues } from '../../layout/viewmodel/picked_shapes';\n\nconst EMPTY_TOOLTIP = Object.freeze({ header: null, values: [] });\n\n/** @internal */\nexport const getTooltipInfoSelector = createCustomCachedSelector(\n  [getPartitionSpec, getPickedShapes, partitionMultiGeometries],\n  (spec, pickedShapes, shapeViewModel): TooltipInfo => {\n    return spec\n      ? pickShapesTooltipValues(pickedShapes, shapeViewModel, spec.valueFormatter, spec.percentFormatter, spec.id)\n      : EMPTY_TOOLTIP;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { ChartType } from '../../..';\nimport { getPredicateFn } from '../../../../common/predicate';\nimport {\n  DEFAULT_SM_PANEL_PADDING,\n  GroupByAccessor,\n  GroupBySpec,\n  SmallMultiplesSpec,\n  SmallMultiplesStyle,\n  SpecType,\n} from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getSmallMultiplesSpecs } from '../../../../state/selectors/get_small_multiples_spec';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecsFromStore } from '../../../../state/utils';\nimport { Datum } from '../../../../utils/common';\nimport { HierarchyOfArrays, NULL_SMALL_MULTIPLES_KEY } from '../../layout/utils/group_by_rollup';\nimport { partitionTree } from '../../layout/viewmodel/hierarchy_of_arrays';\nimport { PartitionSpec } from '../../specs';\n\nconst getGroupBySpecs = createCustomCachedSelector([getSpecs], (specs) =>\n  getSpecsFromStore<GroupBySpec>(specs, ChartType.Global, SpecType.IndexOrder),\n);\n\n/** @internal */\nexport type StyledTree = {\n  smAccessorValue: ReturnType<GroupByAccessor>;\n  name: string;\n  style: SmallMultiplesStyle;\n  tree: HierarchyOfArrays;\n};\n\nfunction getTreesForSpec(\n  spec: PartitionSpec,\n  smSpecs: SmallMultiplesSpec[],\n  groupBySpecs: GroupBySpec[],\n  locale: string,\n): StyledTree[] {\n  const { layout, data, valueAccessor, layers, smallMultiples: smId } = spec;\n  const smSpec = smSpecs.find((s) => s.id === smId);\n  const smStyle: SmallMultiplesStyle = {\n    horizontalPanelPadding: smSpec\n      ? smSpec.style?.horizontalPanelPadding ?? DEFAULT_SM_PANEL_PADDING\n      : { outer: 0, inner: 0 },\n    verticalPanelPadding: smSpec\n      ? smSpec.style?.verticalPanelPadding ?? DEFAULT_SM_PANEL_PADDING\n      : { outer: 0, inner: 0 },\n  };\n  const groupBySpec = groupBySpecs.find(\n    (s) => s.id === smSpec?.splitHorizontally || s.id === smSpec?.splitVertically || s.id === smSpec?.splitZigzag,\n  );\n\n  if (groupBySpec) {\n    const { by, sort, format = (name) => String(name) } = groupBySpec;\n    const accessorSpec = { id: spec.id, chartType: spec.chartType, specType: SpecType.Series };\n    const groups = data.reduce((map: Map<ReturnType<GroupByAccessor>, Datum[]>, next) => {\n      const groupingValue = by(accessorSpec, next);\n      const preexistingGroup = map.get(groupingValue);\n      const group = preexistingGroup ?? [];\n      if (!preexistingGroup) map.set(groupingValue, group);\n      group.push(next);\n      return map;\n    }, new Map<string, HierarchyOfArrays>());\n    return [...groups].sort(getPredicateFn(sort, locale)).map(([groupKey, subData], innerIndex) => ({\n      name: format(groupKey),\n      smAccessorValue: groupKey,\n      style: smStyle,\n      tree: partitionTree(subData, valueAccessor, layers, layout, [{ index: innerIndex, value: String(groupKey) }]),\n    }));\n  } else {\n    return [\n      {\n        name: '',\n        smAccessorValue: '',\n        style: smStyle,\n        tree: partitionTree(data, valueAccessor, layers, layout, [\n          {\n            index: 0,\n            value: NULL_SMALL_MULTIPLES_KEY,\n          },\n        ]),\n      },\n    ];\n  }\n}\n\n/** @internal */\nexport const getTrees = createCustomCachedSelector(\n  [getPartitionSpecs, getSmallMultiplesSpecs, getGroupBySpecs, getSettingsSpecSelector],\n  ([spec], smallMultiplesSpecs, groupBySpecs, { locale }): StyledTree[] =>\n    spec ? getTreesForSpec(spec, smallMultiplesSpecs, groupBySpecs, locale) : [],\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport {\n  AreaSeries,\n  AreaSeriesProps,\n  Axis,\n  AxisProps,\n  BarSeries,\n  BarSeriesProps,\n  BubbleSeries,\n  BubbleSeriesProps,\n  HistogramBarSeries,\n  HistogramBarSeriesProps,\n  LineAnnotation,\n  LineAnnotationProps,\n  LineSeries,\n  LineSeriesProps,\n  RectAnnotation,\n  RectAnnotationProps,\n} from './xy_chart/specs';\n\nexport * from './xy_chart/utils/specs';\n\nexport * from './wordcloud/specs';\n\nexport * from './goal_chart/specs';\n\nexport { Partition } from './partition_chart/specs';\n\nexport { Heatmap, HeatmapSpec, RasterTimeScale, TimeScale, LinearScale, OrdinalScale } from './heatmap/specs';\n\nexport {\n  Metric,\n  MetricSpecProps,\n  MetricSpec,\n  MetricBase,\n  MetricWText,\n  MetricWNumber,\n  MetricWProgress,\n  MetricWTrend,\n  MetricTrendShape,\n  MetricDatum,\n} from './metric/specs';\n\nexport { Bullet, BulletProps, BulletSpec, BulletDatum, BulletSubtype, BulletValueLabels } from './bullet_graph/spec';\nexport { BulletStyle } from './bullet_graph/theme';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TimeslipWithTooltip } from './timeslip_chart';\nimport { ChartType } from '..';\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { LegendItemExtraValues } from '../../common/legend';\nimport { SeriesKey } from '../../common/series_id';\nimport { InternalChartState } from '../../state/chart_state';\nimport { InitStatus } from '../../state/selectors/get_internal_is_intialized';\n\n/** @internal */\nexport class TimeslipState implements InternalChartState {\n  chartType = ChartType.Timeslip;\n  getChartTypeDescription = () => 'Timeslip chart';\n  chartRenderer = TimeslipWithTooltip;\n\n  // default empty properties, unused in Timeslip\n  eventCallbacks = () => {};\n  isInitialized = () => InitStatus.Initialized;\n  isBrushAvailable = () => false;\n  isBrushing = () => false;\n  isChartEmpty = () => false;\n  getLegendItemsLabels = () => [];\n  getLegendItems = () => [];\n  getLegendExtraValues = () => new Map<SeriesKey, LegendItemExtraValues>();\n  getPointerCursor = () => DEFAULT_CSS_CURSOR;\n  getTooltipAnchor = () => ({ x: 0, y: 0, width: 0, height: 0 });\n  isTooltipVisible = () => ({\n    visible: false,\n    isExternal: false,\n    displayOnly: false,\n    isPinnable: false,\n  });\n\n  getTooltipInfo = () => ({ header: null, values: [] });\n  getProjectionContainerArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getMainProjectionArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getBrushArea = () => null;\n  getDebugState = () => ({});\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isDefined } from '../../../utils/common';\n\n/** @internal */\nexport const oneTwoFive = (mantissa: number) => (mantissa > 5 ? 10 : mantissa > 2 ? 5 : mantissa > 1 ? 2 : 1);\n/** @internal */\nexport const oneFive = (mantissa: number) => (mantissa > 5 ? 10 : mantissa > 1 ? 5 : 1);\n\nconst getNiceTicksForApproxCount = (\n  domainMin: number,\n  domainMax: number,\n  approxDesiredTickCount: number,\n  mantissaFun = oneTwoFive,\n) => {\n  const diff = domainMax - domainMin;\n  const rawPitch = diff / approxDesiredTickCount;\n  const exponent = Math.floor(Math.log10(rawPitch));\n  const orderOfMagnitude = 10 ** exponent; // this represents the order of magnitude eg. 10000, so that...\n  const mantissa = rawPitch / orderOfMagnitude; // it's always the case that 1 <= mantissa <= 9.99999999999\n  const niceMantissa = mantissaFun(mantissa); // snap to 10, 5, 2 or 1\n  const tickInterval = niceMantissa * orderOfMagnitude;\n  if (!isFinite(tickInterval)) {\n    return [];\n  }\n  const result = [];\n  for (let i = Math.floor(domainMin / tickInterval); i <= Math.ceil(domainMax / tickInterval); i++) {\n    result.push(i * tickInterval);\n  }\n  return result;\n};\n\n/** @internal */\nexport const getDecimalTicks = (\n  domainMin: number,\n  domainMax: number,\n  maximumTickCount: number,\n  mantissaFun = oneTwoFive,\n): number[] => {\n  let bestCandidate: number[] = [];\n  for (let i = 0; i <= maximumTickCount; i++) {\n    const candidate = getNiceTicksForApproxCount(domainMin, domainMax, maximumTickCount - i, mantissaFun);\n    if (candidate.length <= maximumTickCount && candidate.length > 0) return candidate;\n    if (bestCandidate.length === 0 || maximumTickCount - candidate.length < maximumTickCount - bestCandidate.length) {\n      bestCandidate = candidate;\n    }\n  }\n  return bestCandidate.length > maximumTickCount\n    ? [...(maximumTickCount > 1 && isDefined(bestCandidate[0]) ? [bestCandidate[0]] : []), bestCandidate.at(-1) ?? NaN]\n    : [];\n};\n\n/** @internal */\nexport const axisModel = (\n  domainLandmarks: number[],\n  desiredTickCount: number,\n): { niceDomainMin: number; niceDomainMax: number; niceTicks: number[] } => {\n  const domainMin = Math.min(...domainLandmarks);\n  const domainMax = Math.max(...domainLandmarks);\n  const niceTicks = getDecimalTicks(domainMin, domainMax, desiredTickCount);\n  const niceDomainMin = niceTicks.length >= 2 ? niceTicks[0]! : domainMin;\n  const niceDomainMax = niceTicks.length >= 2 ? niceTicks.at(-1)! : domainMax;\n  return { niceDomainMin, niceDomainMax, niceTicks };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { mix } from '../utils/math';\n\nconst REFERENCE_AF_LENGTH = 16.67; // ms\nconst REFERENCE_Y_RECURRENCE_ALPHA = 0.1;\nconst TWEEN_DONE_EPSILON = 0.001;\n\n/** @internal */\nexport const domainTween = (\n  interactionState: { niceDomainMin: number; niceDomainMax: number },\n  deltaT: number,\n  targetMin: number,\n  targetMax: number,\n) => {\n  const { niceDomainMin: currentMin, niceDomainMax: currentMax } = interactionState;\n\n  // pure logic\n  const speedExp = Math.pow((currentMax - currentMin) / (targetMax - targetMin), 0.2); // speeds up big decreases\n  const advance = 1 - (1 - REFERENCE_Y_RECURRENCE_ALPHA) ** ((speedExp * deltaT) / REFERENCE_AF_LENGTH);\n  const min = Number.isFinite(currentMin) ? mix(currentMin, targetMin, advance) : targetMin;\n  const max = Number.isFinite(currentMax) ? mix(currentMax, targetMax, advance) : targetMax;\n  const tweenIncomplete = Math.abs(1 - (max - min) / (targetMax - targetMin)) > TWEEN_DONE_EPSILON;\n\n  // remember\n  interactionState.niceDomainMin = min;\n  interactionState.niceDomainMax = max;\n\n  return tweenIncomplete;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const getDesiredTickCount = (cartesianHeight: number, fontSize: number, sparse: boolean) => {\n  const desiredMaxTickCount = Math.floor(cartesianHeight / (3 * fontSize));\n  return sparse ? 1 + Math.ceil(Math.pow(desiredMaxTickCount, 0.25)) : 1 + Math.ceil(Math.sqrt(desiredMaxTickCount));\n};\n\n/** @internal */\nexport type NumericScale = (n: number) => number;\n\n/** @internal */\nexport const makeLinearScale = (\n  domainFrom: number,\n  domainTo: number,\n  rangeFrom: number,\n  rangeTo: number,\n): NumericScale => {\n  const domainExtent = domainTo - domainFrom;\n  const rangeExtent = rangeTo - rangeFrom;\n  const scale = rangeExtent / domainExtent;\n  const offset = rangeFrom - scale * domainFrom;\n  return (d: number) => offset + scale * d;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { clamp, mix, unitClamp } from '../utils/math';\n\nconst VELOCITY_THRESHOLD = 0.01;\nconst DRAG_VELOCITY_ATTENUATION = 0.92; // these two change together: the kinetic friction deceleration from a click drag, and from a wheel drag should match\nconst INITIAL_ZOOM = 5.248;\nconst INITIAL_PAN = 0.961; // doesn't matter if INITIAL_ZOOM is 0, this is just a ratio\n\ninterface Focus {\n  zoom: number; // Exponential: 0: full domain is in view; 1: half, 2: quarter, ie. the visible view is a 1 / 2^zoom multiple of the full domain\n  pan: number; // 0: left side of focus is flush with the left side of the full domain, given zoom level, 1: right side of focus is flush with the right side of the full domain\n}\n\n/** @internal */\nexport interface ZoomPan {\n  focus: Focus;\n  flyVelocity: number;\n\n  // interaction auxiliary state\n  focusStart: Focus;\n  dragStartPosition: number;\n\n  // kinetic pan gesture state\n  lastDragPosition: number;\n  dragVelocity: number;\n}\n\n/** @internal */\nexport const initialZoomPan = () => ({\n  focus: { zoom: INITIAL_ZOOM, pan: INITIAL_PAN },\n  flyVelocity: NaN,\n  focusStart: { zoom: NaN, pan: NaN },\n  dragStartPosition: NaN,\n  lastDragPosition: NaN,\n  dragVelocity: NaN,\n});\n\n/**\n * What's essential about zooming and panning?\n *\n * Conceptual cornerstone elements:\n *   - Reference domain: a connected subset of a totally ordered set, which represents the entire domain relative to which we can zoom and pan.\n *       Examples: a time interval, real interval, integer interval, or a finite ordinal set eg. Jan-Dec categories, Likert scale etc.\n *       Note that while the Domain represents the reference interval, it's possible to zoom outside the domain, unless constrained\n *   - Focus: it is also a connected subset of a totally ordered set\n *\n * Derivable elements:\n *   - Zoom: a number such that (referenceDomainTo - referenceDomainFrom) * 1 / 2^zoom represents the currently focused domain\n *   - Pan: 0: left side of focus is flush with the left side of the reference domain, given zoom level, 1: right side of focus is flush with the right side of the reference domain\n *\n *    Note that while these are derivable, it's also legit to directly control zoom and pan, and derive the focus domain from that and the reference domain, like map zoom/pan\n *\n * Desirable properties:\n *   - resolution invariance: should not know anything about pixel sizes of the focus, or pixel length of the drag interaction\n *   - underlying domain invariance: should work with time, reals, integers, ordinals (incl. ordered categories)\n *   - reference domain from/to invariance? possible with zoom&pan but maybe it's not the final say\n *   - nicely integrate with the scale function\n */\n\nconst ZOOM_MIN = 0; // 0 means, entire reference view\nconst ZOOM_MAX = 35; // 35 means, reference domain divided by 2^35\nconst PAN_MIN = 0; // 0 means, cannot breach the left side of the reference domain\nconst PAN_MAX = 1; // 1 means, cannot breach the right side of the reference domain\n\nconst zoomToMultiplier = (zoom: number) => 1 / 2 ** zoom;\n\n/** @internal */\nexport const multiplierToZoom = (multiplier: number): number => Math.log2(1 / multiplier);\n\nconst getFocusDomainRatio = (zoom: number) => 1 / (1 - zoomToMultiplier(zoom)) - 1;\nconst clampZoom = (zoom: number) => clamp(zoom, ZOOM_MIN, ZOOM_MAX) || 0;\nconst clampPan = (pan: number) => clamp(pan, PAN_MIN, PAN_MAX) || 0;\n\nconst setPan = (focus: Focus, pan: number) => (focus.pan = pan);\n\nconst setZoomPan = (focus: Focus, newZoomPan: Focus) => Object.assign(focus, newZoomPan);\n\nconst getFocusForNewZoom = (focus: Focus, pointerUnitLocation: number, newZoom: number, panDelta: number) => {\n  const oldInvisibleFraction = 1 - zoomToMultiplier(focus.zoom);\n  const zoom = clampZoom(newZoom);\n  const newInvisibleFraction = 1 - zoomToMultiplier(zoom);\n  const requestedPan = mix(pointerUnitLocation + panDelta, focus.pan, oldInvisibleFraction / newInvisibleFraction);\n  const pan = clampPan(requestedPan);\n  return { zoom, pan };\n};\n\nconst getPanFromDelta = (focus: Focus, panStart: number, relativeDelta: number) => {\n  const panDeltaPerDrag = getFocusDomainRatio(focus.zoom);\n  const panDifference = panDeltaPerDrag * relativeDelta;\n  return clampPan(panStart - panDifference);\n};\n\n/** @internal */\nexport const doPanFromJumpDelta = (zoomPan: ZoomPan, normalizedDeltaPan: number) => {\n  const deltaPan = zoomToMultiplier(zoomPan.focus.zoom) * normalizedDeltaPan;\n  const newPan = clampPan(zoomPan.focus.pan + deltaPan);\n\n  setPan(zoomPan.focus, newPan);\n};\n\n/** @internal */\nexport const doZoomFromJumpDelta = (zoomPan: ZoomPan, normalizedDeltaZoom: number, center: number) => {\n  const newZoom = zoomPan.focus.zoom + normalizedDeltaZoom;\n  const newZoomPan = getFocusForNewZoom(zoomPan.focus, center, newZoom, 0);\n\n  setZoomPan(zoomPan.focus, newZoomPan);\n};\n\n/** @internal */\nexport const doZoomAroundPosition = (\n  zoomPan: ZoomPan,\n  { innerSize: cartesianWidth, innerLeading: cartesianLeft }: { innerSize: number; innerLeading: number },\n  center: number,\n  zoomChange: number,\n  panDelta: number,\n  touch: boolean,\n) => {\n  const unitZoomCenter = unitClamp((center - cartesianLeft) / cartesianWidth);\n  const base = touch ? zoomPan.focusStart.zoom : zoomPan.focus.zoom;\n  const newZoomPan = getFocusForNewZoom(zoomPan.focus, unitZoomCenter, base + zoomChange, panDelta);\n\n  setZoomPan(zoomPan.focus, newZoomPan);\n};\n\n/** @internal */\nexport const kineticFlywheel = (zoomPan: ZoomPan, size: number) => {\n  const velocity = zoomPan.flyVelocity;\n  const needsViewUpdate = Math.abs(velocity) > VELOCITY_THRESHOLD;\n  if (needsViewUpdate) {\n    const newPan = getPanFromDelta(zoomPan.focus, zoomPan.focus.pan, velocity / size);\n    setPan(zoomPan.focus, newPan);\n    zoomPan.flyVelocity *= DRAG_VELOCITY_ATTENUATION;\n  } else {\n    zoomPan.flyVelocity = NaN;\n  }\n  return needsViewUpdate;\n};\n\n/** @internal */\nexport const getFocusDomain = (zoomPan: ZoomPan, referenceDomainFrom: number, referenceDomainTo: number) => {\n  const { zoom, pan } = zoomPan.focus;\n  const referenceDomainExtent = referenceDomainTo - referenceDomainFrom;\n  const focusDomainExtent = referenceDomainExtent * zoomToMultiplier(zoom);\n  const leeway = referenceDomainExtent - focusDomainExtent;\n  const domainFrom = referenceDomainFrom + pan * leeway;\n  const domainTo = referenceDomainTo - (1 - pan) * leeway;\n  return { domainFrom, domainTo };\n};\n\n/** @internal */\nexport const markDragStartPosition = (zoomPan: ZoomPan, position: number) => {\n  zoomPan.dragStartPosition = position;\n  zoomPan.lastDragPosition = position;\n  zoomPan.dragVelocity = NaN;\n  zoomPan.flyVelocity = NaN;\n  zoomPan.focusStart.pan = zoomPan.focus.pan;\n};\n\n/** @internal */\nexport const endDrag = (zoomPan: ZoomPan) => {\n  zoomPan.flyVelocity = zoomPan.dragVelocity;\n  zoomPan.dragVelocity = NaN;\n  zoomPan.dragStartPosition = NaN;\n  zoomPan.focusStart.pan = NaN;\n};\n\n/** @internal */\nexport const doPanFromPosition = (zoomPan: ZoomPan, innerSize: number, currentPosition: number) => {\n  const positionDelta = currentPosition - zoomPan.lastDragPosition;\n  const { dragVelocity } = zoomPan;\n  zoomPan.dragVelocity =\n    positionDelta * dragVelocity > 0 && Math.abs(positionDelta) < Math.abs(dragVelocity)\n      ? dragVelocity // mix(dragVelocity, positionDelta, 0.04)\n      : positionDelta;\n  zoomPan.lastDragPosition = currentPosition;\n  const delta = currentPosition - zoomPan.dragStartPosition;\n  const newPan = getPanFromDelta(zoomPan.focus, zoomPan.focusStart.pan, delta / innerSize);\n  setPan(zoomPan.focus, newPan);\n};\n\n/** @internal */\nexport const startTouchZoom = (zoomPan: ZoomPan) => (zoomPan.focusStart.zoom = zoomPan.focus.zoom);\n\n/** @internal */\nexport const resetTouchZoom = (zoomPan: ZoomPan) => (zoomPan.focusStart.zoom = NaN);\n\n/** @internal */\nexport const touchOngoing = (zoomPan: ZoomPan) => Number.isFinite(zoomPan.focusStart.pan);\n\n/** @internal */\nexport const panOngoing = (zoomPan: ZoomPan) => Number.isFinite(zoomPan.dragStartPosition);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LocaleOptions } from './render/annotations/time_extent';\nimport { getValidatedTimeZone, getZoneFromSpecs } from '../../../utils/time_zone';\nimport { cachedZonedDateTimeFrom, TimeProp } from '../../xy_chart/axes/timeslip/chrono/cached_chrono';\nimport { RasterConfig, TimeFormatter } from '../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { MINIMUM_TICK_PIXEL_DISTANCE } from '../../xy_chart/axes/timeslip/multilayer_ticks';\n\n/** @internal */\nexport type AxisType = 'continuousTime' | 'continuousNumeric';\n\n/** @internal */\nexport const HORIZONTAL_AXIS: AxisType = 'continuousTime';\n\nconst initialDarkMode = false;\n\n/** @internal */\nexport const drawCartesianBox = false;\n\n// these are hand tweaked constants that fulfill various design constraints, let's discuss before changing them\nconst lineThicknessSteps = [/*0,*/ 0.5, 0.75, 1, 1, 1, 1.25, 1.25, 1.5, 1.5, 1.75, 1.75, 2, 2, 2, 2, 2];\nconst lumaSteps = [/*255,*/ 192, 72, 32, 16, 8, 4, 2, 1, 0, 0, 0, 0, 0, 0, 0, 0];\nconst smallFontSize = 12;\n\n/** @internal */\nexport const timeZone = getValidatedTimeZone(getZoneFromSpecs([])); // should eventually come from settings\ntype RGBObject = { r: number; g: number; b: number };\n\ninterface TimeslipTheme {\n  defaultFontColor: string;\n  subduedFontColor: string;\n  offHourFontColor: string;\n  weekendFontColor: string;\n  backgroundColor: RGBObject;\n  lumaSteps: number[];\n}\n\nconst themeLight: TimeslipTheme = {\n  defaultFontColor: 'black',\n  subduedFontColor: '#393939',\n  offHourFontColor: 'black',\n  weekendFontColor: 'darkred',\n  backgroundColor: { r: 255, g: 255, b: 255 },\n  lumaSteps,\n};\n\nconst themeDark: TimeslipTheme = {\n  defaultFontColor: 'white',\n  subduedFontColor: 'darkgrey',\n  offHourFontColor: 'white',\n  weekendFontColor: 'indianred',\n  backgroundColor: { r: 0, g: 0, b: 0 },\n  lumaSteps: lumaSteps.map((l) => 255 - l),\n};\n\ntype CompactDisplay = 'short' | 'long'; // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat\n\n/** @internal */\nexport interface TimeslipConfig extends TimeslipTheme, RasterConfig {\n  darkMode: boolean;\n  sparse: false;\n  implicit: false;\n  maxLabelRowCount: 1 | 2 | 3;\n  a11y: { contrast: 'low' | 'medium' | 'high' };\n  numUnit: CompactDisplay | 'none';\n  barChroma: RGBObject;\n  barFillAlpha: number;\n  lineThicknessSteps: number[];\n  domainFrom: number;\n  domainTo: number;\n  smallFontSize: number;\n  cssFontShorthand: string;\n  monospacedFontShorthand: string;\n  rowPixelPitch: number;\n  horizontalPixelOffset: number;\n  verticalPixelOffset: number;\n  clipLeft: boolean;\n  clipRight: boolean;\n  yTickOverhang: number;\n  yTickGap: number;\n}\n\n/** @internal */\nexport const rasterConfig: RasterConfig = {\n  minimumTickPixelDistance: MINIMUM_TICK_PIXEL_DISTANCE,\n  locale: 'en-US',\n};\n\n/** @internal */\nexport const config: TimeslipConfig = {\n  darkMode: initialDarkMode,\n  ...(initialDarkMode ? themeDark : themeLight),\n  ...rasterConfig,\n  sparse: false,\n  implicit: false,\n  maxLabelRowCount: 2, // can be 1, 2, 3\n  a11y: {\n    contrast: 'medium',\n  },\n  numUnit: 'short',\n  barChroma: { r: 96, g: 146, b: 192 },\n  barFillAlpha: 0.3,\n  lineThicknessSteps,\n  domainFrom: cachedZonedDateTimeFrom({ timeZone, year: 2002, month: 1, day: 1 })[TimeProp.EpochSeconds],\n  domainTo: cachedZonedDateTimeFrom({ timeZone, year: 2022, month: 1, day: 1 })[TimeProp.EpochSeconds],\n  smallFontSize,\n  cssFontShorthand: `normal normal 100 ${smallFontSize}px Inter, Helvetica, Arial, sans-serif`,\n  monospacedFontShorthand: `normal normal 100 ${smallFontSize}px \"Roboto Mono\", Consolas, Menlo, Courier, monospace`,\n  rowPixelPitch: 16,\n  horizontalPixelOffset: 4,\n  verticalPixelOffset: 6,\n  clipLeft: true,\n  clipRight: true,\n  yTickOverhang: 8,\n  yTickGap: 8,\n};\n\n/**\n * constants for Y\n * @internal\n */\nexport const ZERO_Y_BASE = true;\n/** @internal */\nexport const horizontalCartesianAreaPad: [number, number] = [0.04, 0.04];\n/** @internal */\nexport const verticalCartesianAreaPad: [number, number] = [0.3, 0.12];\n/** @internal */\nexport const localeOptions: LocaleOptions = {\n  hour12: false,\n  year: 'numeric',\n  month: 'short',\n  day: '2-digit',\n  hour: '2-digit',\n  minute: '2-digit',\n  second: '2-digit',\n};\n\nconst defaultLabelFormatter = new Intl.DateTimeFormat(config.locale, {\n  weekday: 'short',\n  hour: 'numeric',\n  minute: 'numeric',\n  timeZone,\n});\n/**\n * todo this may need an update with locale change\n * @internal\n */\nexport const defaultLabelFormat: TimeFormatter = (value) => defaultLabelFormatter.format(value);\n\nconst defaultMinorTickLabelFormatter = new Intl.DateTimeFormat(config.locale, {\n  weekday: 'short',\n  hour: 'numeric',\n  minute: 'numeric',\n  timeZone,\n});\n/**\n * todo this may need an update with locale change\n * @internal\n */\nexport const defaultMinorTickLabelFormat: TimeFormatter = (value) => defaultMinorTickLabelFormatter.format(value);\n\n/** @internal */\nexport const fadeOutPixelWidth = 12; // todo add to config\n\n/** @internal */\nexport const chartTopFontSize = config.smallFontSize + 2; // todo move to config\nconst background = config.backgroundColor;\n\n/** @internal */\nexport const backgroundFillStyle = `rgba(${background.r},${background.g},${background.b},1)`;\n\n/** @internal */\nexport const wheelPanVelocity = 1;\n\n/** @internal */\nexport const wheelZoomVelocity = 2; // zoom is usually centered, so with 1 the apparent speed is half, compared to wheelPan\n\n/** @internal */\nexport const keyZoomVelocityDivisor = 2; // 1 means, on each up/down keypress, double/halve the visible time domain\n\n/** @internal */\nexport const keyPanVelocityDivisor = 10; // 1 means, on each left/right keypress, move the whole of current visible time domain\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const getEnrichedData = (rows: { epochMs: number; value?: number }[]) => {\n  const stats = rows.reduce(\n    (p, { epochMs, value }) => {\n      const { minEpochMs, maxEpochMs, minValue, maxValue } = p;\n      p.minEpochMs = Math.min(minEpochMs, epochMs);\n      p.maxEpochMs = Math.max(maxEpochMs, epochMs);\n      p.minValue = Math.min(minValue, value ?? minValue);\n      p.maxValue = Math.max(maxValue, value ?? maxValue);\n      return p;\n    },\n    {\n      minEpochMs: Infinity,\n      maxEpochMs: -Infinity,\n      minValue: Infinity,\n      maxValue: -Infinity,\n    },\n  );\n  return { rows, stats };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DataDemand } from './render/cartesian';\nimport { BoxplotRow } from './render/glyphs/boxplot';\nimport { BinUnit, Interval } from '../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { GetData } from '../timeslip_api';\n\ntype DataResponse = { stats: { minValue: number; maxValue: number }; rows: TimeslipDataRows };\n\n/** @public */\nexport type TimeslipDataRows = Array<{ epochMs: number; boxplot?: BoxplotRow['boxplot']; value?: number }>;\n\n/** @internal */\nexport interface DataState {\n  valid: boolean;\n  pending: boolean;\n  lo: (Interval & Partial<Record<BinUnit, number>>) | null;\n  hi: (Interval & Partial<Record<BinUnit, number>>) | null;\n  binUnit: BinUnit;\n  binUnitCount: number;\n  dataResponse: DataResponse;\n}\n\n/** @internal */\nexport const invalid = (dataState: DataState, dataDemand: DataDemand) =>\n  !dataState.valid ||\n  dataState.binUnit !== dataDemand.binUnit ||\n  dataState.binUnitCount !== dataDemand.binUnitCount ||\n  (dataDemand.lo?.minimum ?? -Infinity) < (dataState.lo?.minimum ?? -Infinity) ||\n  (dataDemand.hi?.minimum ?? Infinity) > (dataState.hi?.minimum ?? Infinity);\n\n/** @internal */\nexport const updateDataState = (\n  dataState: DataState,\n  dataDemand: Parameters<GetData>[0],\n  dataResponse: DataResponse,\n) => {\n  dataState.pending = false;\n  dataState.valid = true;\n  dataState.lo = dataDemand.lo;\n  dataState.hi = dataDemand.hi;\n  dataState.binUnit = dataDemand.binUnit;\n  dataState.binUnitCount = dataDemand.binUnitCount;\n  dataState.dataResponse = dataResponse;\n};\n\n/** @internal */\nexport const getNullDataState = (): DataState => ({\n  valid: false,\n  pending: false,\n  lo: { minimum: Infinity, supremum: Infinity, labelSupremum: Infinity },\n  hi: { minimum: -Infinity, supremum: -Infinity, labelSupremum: -Infinity },\n  binUnit: 'year',\n  binUnitCount: NaN,\n  dataResponse: { stats: { minValue: NaN, maxValue: NaN }, rows: [] },\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function renderChartTitle(ctx: CanvasRenderingContext2D, fontColor: string, chartWidth: number) {\n  ctx.save();\n  const titleFontSize = 32; // todo move to config\n  ctx.textBaseline = 'top';\n  ctx.textAlign = 'center';\n  ctx.font = `normal normal 200 ${titleFontSize}px Inter, Helvetica, Arial, sans-serif`; // todo move to config\n  ctx.fillStyle = fontColor;\n  ctx.fillText('machine.ram', chartWidth / 2, titleFontSize * 0.5);\n  ctx.fillText('KiB', chartWidth / 2, titleFontSize * 1.5);\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport type LocaleOptions = Parameters<Date['toLocaleString']>[1];\n\n/** @internal */\nexport function renderTimeExtentAnnotation(\n  ctx: CanvasRenderingContext2D,\n  config: { locale: string; monospacedFontShorthand: string; subduedFontColor: string },\n  localeOptions: LocaleOptions,\n  { domainFrom, domainTo }: { domainFrom: number; domainTo: number },\n  cartesianWidth: number,\n  yOffset: number,\n) {\n  ctx.save();\n  ctx.textBaseline = 'bottom';\n  ctx.textAlign = 'right';\n  ctx.font = config.monospacedFontShorthand;\n  ctx.fillStyle = config.subduedFontColor;\n  // todo switch to new Intl.DateTimeFormat for more performance https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat\n  ctx.fillText(\n    `${new Date(domainFrom * 1000).toLocaleString(config.locale, localeOptions)} — ${new Date(\n      domainTo * 1000,\n    ).toLocaleString(config.locale, localeOptions)}`,\n    cartesianWidth,\n    yOffset,\n  );\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BinUnit } from '../../../../xy_chart/axes/timeslip/continuous_time_rasters';\n\n/** @internal */\nconst LOCALE_TRANSLATIONS = {\n  bar: 'bar',\n  year: ['year', 'years'],\n  month: ['month', 'months'],\n  week: ['week', 'weeks'],\n  day: ['day', 'days'],\n  hour: ['hour', 'hours'],\n  minute: ['minute', 'minutes'],\n  second: ['second', 'seconds'],\n  millisecond: ['millisecond', 'milliseconds'],\n  one: ['', ''],\n};\n\n/** @internal */\nexport function renderTimeUnitAnnotation(\n  ctx: CanvasRenderingContext2D,\n  config: {\n    monospacedFontShorthand: string;\n    subduedFontColor: string;\n    defaultFontColor: string;\n    a11y: { contrast: 'low' | 'medium' | 'high' };\n  },\n  binUnitCount: number,\n  binUnit: BinUnit,\n  chartTopFontSize: number,\n  yOffset: number,\n  unitBarMaxWidthPixels: number,\n) {\n  const unitBarY = yOffset - chartTopFontSize * 1.7;\n\n  ctx.save();\n  ctx.textBaseline = 'bottom';\n  ctx.textAlign = 'left';\n  ctx.font = config.monospacedFontShorthand;\n  ctx.fillStyle = config.a11y.contrast === 'low' ? config.subduedFontColor : config.defaultFontColor;\n  ctx.fillText(\n    `1 ${LOCALE_TRANSLATIONS.bar} = ${binUnitCount} ${LOCALE_TRANSLATIONS[binUnit][binUnitCount === 1 ? 0 : 1]}`,\n    0,\n    yOffset,\n  );\n  ctx.fillRect(0, unitBarY, unitBarMaxWidthPixels, 1);\n  ctx.fillRect(0, unitBarY - 3, 1, 7);\n  ctx.fillRect(unitBarMaxWidthPixels - 1, unitBarY - 3, 1, 7);\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderRaster } from './raster';\nimport {\n  BinUnit,\n  NumberFormatter,\n  continuousTimeRasters,\n  Interval,\n  TimeFormatter,\n} from '../../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { MAX_TIME_TICK_COUNT, notTooDense } from '../../../xy_chart/axes/timeslip/multilayer_ticks';\nimport { makeLinearScale, NumericScale } from '../../projections/scale';\nimport { TimeslipConfig } from '../config';\nimport { DataState } from '../data_fetch';\n\n/** @public */\nexport type DataDemand = {\n  lo: Interval | null;\n  hi: Interval | null;\n  binUnit: BinUnit;\n  binUnitCount: number;\n  unitBarMaxWidthPixels: number;\n};\n\n/** @internal */\nexport const renderCartesian = (\n  ctx: CanvasRenderingContext2D,\n  config: TimeslipConfig,\n  dataState: DataState,\n  defaultMinorTickLabelFormat: TimeFormatter,\n  emWidth: number,\n  fadeOutPixelWidth: number,\n  defaultLabelFormat: TimeFormatter,\n  yTickNumberFormatter: NumberFormatter,\n  rasterSelector: ReturnType<typeof continuousTimeRasters>,\n  cartesianWidth: number,\n  cartesianHeight: number,\n  { domainFrom, domainTo }: { domainFrom: number; domainTo: number },\n  yUnitScale: NumericScale,\n  niceTicks: number[],\n): DataDemand => {\n  ctx.textBaseline = 'top';\n  ctx.fillStyle = config.defaultFontColor;\n  ctx.font = config.cssFontShorthand;\n  ctx.textAlign = 'left';\n\n  const getPixelX = makeLinearScale(domainFrom, domainTo, 0, cartesianWidth);\n  const layers = rasterSelector(notTooDense(domainFrom, domainTo, 0, cartesianWidth, MAX_TIME_TICK_COUNT));\n\n  const loHi = layers.reduce(\n    renderRaster(\n      ctx,\n      config,\n      dataState,\n      fadeOutPixelWidth,\n      emWidth,\n      defaultMinorTickLabelFormat,\n      defaultLabelFormat,\n      yTickNumberFormatter,\n      domainFrom,\n      domainTo,\n      getPixelX,\n      cartesianWidth,\n      cartesianHeight,\n      niceTicks,\n      yUnitScale,\n      layers,\n    ),\n    { lo: null, hi: null, unitBarMaxWidthPixelsSum: 0, unitBarMaxWidthPixelsCount: 0 },\n  );\n\n  const finestLayer = layers[0];\n\n  return {\n    lo: loHi.lo,\n    hi: loHi.hi,\n    binUnit: finestLayer?.unit ?? 'millisecond',\n    binUnitCount: finestLayer?.unitMultiplier ?? 1,\n    unitBarMaxWidthPixels: loHi.unitBarMaxWidthPixelsSum / loHi.unitBarMaxWidthPixelsCount,\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BarRow, renderBarGlyph } from './glyphs/bar';\nimport { BoxplotRow, renderBoxplotGlyph } from './glyphs/boxplot';\nimport { Interval, TimeFormatter, AxisLayer } from '../../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { NumericScale } from '../../projections/scale';\nimport { TimeslipConfig } from '../config';\nimport { TimeslipDataRows } from '../data_fetch';\n\nconst textOffset = 0.35; // customary value\nconst showMissingValuesAsZero = false;\n\n/** @internal */\nexport type Layers = AxisLayer<Interval>[];\n\n/** @internal */\nexport const renderColumnTickLabels = (\n  ctx: CanvasRenderingContext2D,\n  config: TimeslipConfig,\n  fadeOutPixelWidth: number,\n  emWidth: number,\n  getPixelX: NumericScale,\n  labelFormat: TimeFormatter,\n  minorLabelFormat: TimeFormatter,\n  textNestLevelRowLimited: number,\n  cartesianWidth: number,\n  binStartList: Iterable<Interval>,\n) => {\n  for (const { minimum, supremum } of binStartList) {\n    const text =\n      textNestLevelRowLimited === config.maxLabelRowCount\n        ? labelFormat(minimum * 1000)\n        : minorLabelFormat(minimum * 1000);\n    if (text.length <= 0) continue;\n    const pixelX = Math.max(0, getPixelX(minimum));\n    const textX = pixelX + config.horizontalPixelOffset;\n    const y = config.verticalPixelOffset + (textNestLevelRowLimited - 1) * config.rowPixelPitch;\n    // the measured text width, plus the `config.horizontalPixelOffset` on the left side must fit inside `maxWidth`\n    const maxWidth = getPixelX(supremum) - config.horizontalPixelOffset;\n    const leftShortening =\n      maxWidth >= cartesianWidth\n        ? 0\n        : Math.max(0, ctx.measureText(text).width + config.horizontalPixelOffset - maxWidth);\n    const rightShortening =\n      textX + Math.min(maxWidth, text.length * emWidth) < cartesianWidth\n        ? 0\n        : Math.max(0, textX + ctx.measureText(text).width - cartesianWidth);\n    const maxWidthRight = Math.max(0, cartesianWidth - textX);\n    const clipLeft = config.clipLeft && leftShortening > 0;\n    const clipRight = config.clipRight && rightShortening > 0;\n    if (clipLeft) {\n      ctx.save();\n      ctx.beginPath();\n      ctx.rect(config.horizontalPixelOffset, y - textOffset * config.rowPixelPitch, maxWidth, config.rowPixelPitch);\n      ctx.clip();\n    }\n    if (clipRight) {\n      ctx.save();\n      ctx.beginPath();\n      ctx.rect(textX, y - textOffset * config.rowPixelPitch, maxWidthRight, config.rowPixelPitch);\n      ctx.clip();\n    }\n    ctx.fillStyle = config.a11y.contrast === 'low' ? config.subduedFontColor : config.defaultFontColor;\n    ctx.fillText(text, textX - leftShortening, y);\n    if (clipRight) {\n      const { r, g, b } = config.backgroundColor;\n      const fadeOutRight = ctx.createLinearGradient(textX, 0, textX + maxWidthRight, 0);\n      fadeOutRight.addColorStop(0, `rgba(${r},${g},${b},0)`);\n      fadeOutRight.addColorStop(\n        maxWidthRight <= 0 ? 0.5 : Math.max(0, 1 - fadeOutPixelWidth / maxWidthRight),\n        `rgba(${r},${g},${b},0)`,\n      );\n      fadeOutRight.addColorStop(1, `rgba(${r},${g},${b},1)`);\n      ctx.fillStyle = fadeOutRight;\n      ctx.fill();\n      ctx.restore();\n    }\n    if (clipLeft) {\n      const { r, g, b } = config.backgroundColor;\n      const fadeOutLeft = ctx.createLinearGradient(0, 0, maxWidth, 0);\n      fadeOutLeft.addColorStop(0, `rgba(${r},${g},${b},1)`);\n      fadeOutLeft.addColorStop(\n        maxWidth <= 0 ? 0.5 : Math.min(1, fadeOutPixelWidth / maxWidth),\n        `rgba(${r},${g},${b},0)`,\n      );\n      fadeOutLeft.addColorStop(1, `rgba(${r},${g},${b},0)`);\n      ctx.fillStyle = fadeOutLeft;\n      ctx.fill();\n      ctx.restore();\n    }\n  }\n};\n\n/** @internal */\nexport const renderColumnBars = (\n  ctx: CanvasRenderingContext2D,\n  getPixelX: NumericScale,\n  cartesianWidth: number,\n  cartesianHeight: number,\n  barPad: number,\n  rows: TimeslipDataRows,\n  yUnitScale: NumericScale,\n  barChroma: TimeslipConfig['barChroma'],\n  barFillAlpha: number,\n  timeBins: Iterable<Interval>,\n) => {\n  for (const { minimum, supremum } of timeBins) {\n    const foundRow = rows.find((r) => minimum * 1000 <= r.epochMs && r.epochMs < supremum * 1000);\n    if (!foundRow && !showMissingValuesAsZero) continue;\n\n    const fullBarPixelX = getPixelX(minimum);\n    const barMaxWidthPixels = getPixelX(supremum) - fullBarPixelX - 2 * barPad;\n    const pixelX = Math.max(0, fullBarPixelX);\n\n    // left side special case\n    const leftShortfall = Math.abs(pixelX - fullBarPixelX);\n    const leftOpacityMultiplier = leftShortfall ? 1 - Math.max(0, Math.min(1, leftShortfall / barMaxWidthPixels)) : 1;\n\n    // right side special case\n    const barX = pixelX + barPad;\n    const rightShortfall = Math.max(0, barX + barMaxWidthPixels - cartesianWidth);\n\n    const maxBarHeight = cartesianHeight;\n    const barWidthPixels = barMaxWidthPixels - rightShortfall;\n\n    const rightOpacityMultiplier = rightShortfall\n      ? 1 - Math.max(0, Math.min(1, rightShortfall / barMaxWidthPixels))\n      : 1;\n    const { r, g, b } = barChroma;\n    const maxOpacity = barFillAlpha;\n    const opacityMultiplier = leftOpacityMultiplier * rightOpacityMultiplier;\n    const opacity = maxOpacity * opacityMultiplier;\n    const opacityDependentLineThickness = opacityMultiplier === 1 ? 1 : Math.sqrt(opacityMultiplier);\n    ctx.save();\n    if (foundRow?.boxplot) {\n      renderBoxplotGlyph(\n        ctx,\n        barMaxWidthPixels,\n        barX,\n        leftShortfall,\n        foundRow as BoxplotRow, // todo remove as\n        maxBarHeight,\n        yUnitScale,\n        opacityMultiplier,\n        r,\n        g,\n        b,\n        maxOpacity,\n      );\n    } else {\n      renderBarGlyph(\n        ctx,\n        barWidthPixels,\n        leftShortfall,\n        maxBarHeight,\n        yUnitScale,\n        foundRow as BarRow,\n        r,\n        g,\n        b,\n        opacity,\n        barX,\n        opacityDependentLineThickness,\n      );\n    }\n    ctx.restore();\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { NumericScale } from '../../../projections/scale';\n\n/** @internal */\nexport type BarRow = { value: number };\n\n/** @internal */\nexport function renderBarGlyph(\n  ctx: CanvasRenderingContext2D,\n  barWidthPixels: number,\n  leftShortfall: number,\n  maxBarHeight: number,\n  yUnitScale: NumericScale,\n  foundRow: BarRow,\n  r: number,\n  g: number,\n  b: number,\n  opacity: number,\n  barX: number,\n  opacityDependentLineThickness: number,\n) {\n  const renderedBarWidth = Math.max(0, barWidthPixels - leftShortfall);\n  const barEnd = -maxBarHeight * yUnitScale(foundRow.value);\n  const barStart = -maxBarHeight * yUnitScale(0);\n  const barHeight = Math.abs(barStart - barEnd);\n  const barY = Math.min(barStart, barEnd);\n  ctx.fillStyle = `rgba(${r},${g},${b},${opacity})`;\n  ctx.fillRect(barX, barY, renderedBarWidth, barHeight);\n  if (barEnd === barEnd) {\n    ctx.fillStyle = `rgba(${r},${g},${b},1)`;\n    ctx.fillRect(barX, barEnd, renderedBarWidth, opacityDependentLineThickness); // avoid Math.sqrt\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { NumericScale } from '../../../projections/scale';\n\nconst goldenRatio = 1.618; // todo move it into constants\n\n/** @public */\nexport type BoxplotRow = { boxplot: { lower: number; q1: number; q2: number; q3: number; upper: number } };\n\n/** @internal */\nexport function renderBoxplotGlyph(\n  ctx: CanvasRenderingContext2D,\n  barMaxWidthPixels: number,\n  barX: number,\n  leftShortfall: number,\n  foundRow: BoxplotRow,\n  maxBarHeight: number,\n  yUnitScale: NumericScale,\n  opacityMultiplier: number,\n  r: number,\n  g: number,\n  b: number,\n  maxOpacity: number,\n) {\n  const boxplotWidth = barMaxWidthPixels / goldenRatio; // - clamp(rightShortfall etc etc)\n  const whiskerWidth = boxplotWidth / 2;\n  const boxplotLeftX = barX + (barMaxWidthPixels - boxplotWidth) / 2 - leftShortfall;\n  const boxplotCenterX = boxplotLeftX + boxplotWidth / 2;\n  const { /*min, */ lower, q1, q2, q3, upper /*max */ } = foundRow.boxplot;\n  const lowerY = maxBarHeight * yUnitScale(lower);\n  const q1Y = maxBarHeight * yUnitScale(q1);\n  const q2Y = maxBarHeight * yUnitScale(q2);\n  const q3Y = maxBarHeight * yUnitScale(q3);\n  const upperY = maxBarHeight * yUnitScale(upper);\n  // boxplot rectangle body with border\n  if (lowerY !== upperY && q1Y !== q2Y && q2Y !== q3Y) {\n    const unitVisibility = opacityMultiplier ** 5;\n    ctx.beginPath();\n    ctx.rect(boxplotLeftX, -q3Y, boxplotWidth, q3Y - q1Y);\n    ctx.fillStyle = `rgba(${r},${g},${b},${maxOpacity * unitVisibility})`;\n    ctx.fill();\n    ctx.strokeStyle = `rgba(${r},${g},${b},1)`;\n    ctx.lineWidth = unitVisibility;\n    //ctx.stroke()\n    // boxplot whiskers\n    ctx.fillStyle = `rgba(${r},${g},${b},1)`;\n    ctx.fillRect(boxplotCenterX - whiskerWidth / 2, -upperY, whiskerWidth, unitVisibility); // upper horizontal\n    ctx.fillRect(boxplotCenterX - boxplotWidth / 2, -q3Y, boxplotWidth, unitVisibility); // q2 horizontal\n    ctx.fillRect(boxplotCenterX - boxplotWidth / 2, -q2Y, boxplotWidth, unitVisibility); // q2 horizontal\n    ctx.fillRect(boxplotCenterX - boxplotWidth / 2, -q1Y, boxplotWidth, unitVisibility); // q2 horizontal\n    ctx.fillRect(boxplotCenterX - whiskerWidth / 2, -lowerY, whiskerWidth, unitVisibility); // lower horizontal\n    ctx.fillRect(boxplotCenterX, -upperY, unitVisibility, upperY - q3Y); // top vertical\n    ctx.fillRect(boxplotCenterX, -q1Y, unitVisibility, q1Y - lowerY); // bottom vertical\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function renderDebugBox(ctx: CanvasRenderingContext2D, cartesianWidth: number, cartesianHeight: number) {\n  ctx.save();\n  ctx.beginPath();\n  ctx.rect(0, 0, cartesianWidth, cartesianHeight);\n  ctx.strokeStyle = 'magenta';\n  ctx.setLineDash([5, 5]);\n  ctx.lineWidth = 1;\n  ctx.stroke();\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Layers, renderColumnBars, renderColumnTickLabels } from './column';\nimport { doing, executing, filtering, mapping, pipeline } from '../../../../common/iterables';\nimport { isNil } from '../../../../utils/common';\nimport {\n  NumberFormatter,\n  Interval,\n  TimeFormatter,\n  AxisLayer,\n} from '../../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { MAX_TIME_GRID_COUNT, notTooDense } from '../../../xy_chart/axes/timeslip/multilayer_ticks';\nimport { NumericScale } from '../../projections/scale';\nimport { clamp } from '../../utils/math';\nimport { TimeslipConfig } from '../config';\nimport { DataState } from '../data_fetch';\n\nconst TIMESLIP_MAX_TIME_GRID_COUNT = 100 || MAX_TIME_GRID_COUNT; // use either\n\ninterface LoHi {\n  lo: Interval | null;\n  hi: Interval | null;\n  unitBarMaxWidthPixelsSum: number;\n  unitBarMaxWidthPixelsCount: number;\n}\n\nconst renderHorizontalGridLines = (\n  ctx: CanvasRenderingContext2D,\n  config: TimeslipConfig,\n  niceTicks: number[],\n  yUnitScale: NumericScale,\n  cartesianHeight: number,\n  yTickNumberFormatter: NumberFormatter,\n  cartesianWidth: number,\n) => {\n  ctx.save();\n  const { r, g, b } = config.backgroundColor;\n  const lineStyle = config.implicit\n    ? `rgb(${r},${g},${b})`\n    : `rgba(128,128,128,${config.a11y.contrast === 'low' ? 0.5 : 1})`;\n  ctx.textBaseline = 'middle';\n  ctx.font = config.cssFontShorthand;\n  for (const gridDomainValueY of niceTicks) {\n    const yUnit = yUnitScale(gridDomainValueY);\n    if (yUnit !== clamp(yUnit, -0.01, 1.01)) {\n      // todo set it back to 0 and 1 if recurrence relation of transitioning can reach 1 in finite time\n      continue;\n    }\n    const y = -cartesianHeight * yUnit;\n    const text = yTickNumberFormatter(gridDomainValueY);\n    ctx.fillStyle = gridDomainValueY === 0 ? config.defaultFontColor : lineStyle;\n    ctx.fillRect(\n      -config.yTickOverhang,\n      y,\n      cartesianWidth + 2 * config.yTickOverhang,\n      gridDomainValueY === 0 ? 0.5 : config.implicit ? 0.2 : 0.1,\n    );\n    ctx.fillStyle = config.subduedFontColor;\n    ctx.textAlign = 'left';\n    ctx.fillText(text, cartesianWidth + config.yTickOverhang + config.yTickGap, y);\n    ctx.textAlign = 'right';\n    ctx.fillText(text, -config.yTickOverhang - config.yTickGap, y);\n  }\n  ctx.restore();\n};\n\nconst binsToRender = (binStarts: Iterable<Interval>, domainFrom: number, domainTo: number) => {\n  const binStartList: Interval[] = [];\n  for (const binStart of binStarts) {\n    if (binStart.minimum > domainTo) break;\n    if (binStart.minimum < domainFrom) {\n      binStartList[0] = binStart;\n    } else {\n      binStartList.push(binStart);\n    }\n  }\n  return binStartList;\n};\n\n/** @internal */\nexport const calcColumnBar = (\n  getPixelX: NumericScale,\n  unitBarMaxWidthPixelsSum: number,\n  unitBarMaxWidthPixelsCount: number,\n  i: number,\n  halfLineThickness: number,\n  implicit: boolean,\n  { minimum, supremum }: Interval,\n) => {\n  if (i !== 0) return { unitBarMaxWidthPixelsSum, unitBarMaxWidthPixelsCount };\n  const barPad = implicit ? halfLineThickness : 0;\n  const fullBarPixelX = getPixelX(minimum);\n  const barMaxWidthPixels = getPixelX(supremum) - fullBarPixelX - 2 * barPad;\n  return {\n    unitBarMaxWidthPixelsSum: unitBarMaxWidthPixelsSum + barMaxWidthPixels,\n    unitBarMaxWidthPixelsCount: unitBarMaxWidthPixelsCount + 1,\n  };\n};\n\nconst updateLoHi = (\n  binStarts: Iterable<Interval>,\n  implicit: boolean,\n  halfLineThickness: number,\n  getPixelX: NumericScale,\n  loHi: LoHi,\n  i: number,\n) => {\n  for (const binStart of binStarts) {\n    if (i === 0) {\n      loHi.lo = loHi.lo || binStart;\n      loHi.hi = binStart;\n    }\n\n    // update loHi\n    const { unitBarMaxWidthPixelsSum, unitBarMaxWidthPixelsCount } = calcColumnBar(\n      getPixelX,\n      loHi.unitBarMaxWidthPixelsSum,\n      loHi.unitBarMaxWidthPixelsCount,\n      i,\n      halfLineThickness,\n      implicit,\n      binStart,\n    );\n    loHi.unitBarMaxWidthPixelsSum = unitBarMaxWidthPixelsSum;\n    loHi.unitBarMaxWidthPixelsCount = unitBarMaxWidthPixelsCount;\n  }\n};\n\n/** @internal */\nexport const renderRaster =\n  (\n    ctx: CanvasRenderingContext2D,\n    config: TimeslipConfig,\n    dataState: DataState,\n    fadeOutPixelWidth: number,\n    emWidth: number,\n    defaultMinorTickLabelFormat: TimeFormatter,\n    defaultLabelFormat: TimeFormatter,\n    yTickNumberFormatter: NumberFormatter,\n    domainFrom: number,\n    domainTo: number,\n    getPixelX: NumericScale,\n    cartesianWidth: number,\n    cartesianHeight: number,\n    niceTicks: number[],\n    yUnitScale: NumericScale,\n    layers: Layers,\n  ) =>\n  (\n    loHi: LoHi,\n    {\n      labeled,\n      intervals,\n      minorTickLabelFormat,\n      detailedLabelFormat,\n      minimumTickPixelDistance,\n      unit,\n      unitMultiplier,\n    }: AxisLayer<Interval>,\n    i: number,\n    a: Layers,\n  ) => {\n    const {\n      valid,\n      dataResponse: { rows },\n    } = dataState;\n\n    const minorLabelFormat = minorTickLabelFormat ?? defaultMinorTickLabelFormat;\n    const labelFormat = detailedLabelFormat ?? minorLabelFormat ?? defaultLabelFormat;\n    const textNestLevel = a.slice(0, i + 1).filter((layer) => layer.labeled).length;\n    const lineNestLevel = a[i] === a[0] ? 0 : textNestLevel;\n    const textNestLevelRowLimited = Math.min(config.maxLabelRowCount, textNestLevel); // max. N rows\n    const lineNestLevelRowLimited = Math.min(config.maxLabelRowCount, lineNestLevel);\n    const lineThickness = config.lineThicknessSteps[i] ?? NaN;\n    const luma =\n      (config.lumaSteps[i] ?? NaN) *\n      (config.darkMode ? (config.a11y.contrast === 'low' ? 0.5 : 1) : config.a11y.contrast === 'low' ? 1.5 : 1);\n    const halfLineThickness = lineThickness / 2;\n    const notTooDenseGridLayer = notTooDense(domainFrom, domainTo, 0, cartesianWidth, TIMESLIP_MAX_TIME_GRID_COUNT);\n\n    const binStartList = binsToRender(intervals(domainFrom, domainTo), domainFrom, domainTo);\n\n    updateLoHi(binStartList, config.implicit, halfLineThickness, getPixelX, loHi, i);\n\n    const finestRaster = i === 0;\n    const renderBar =\n      finestRaster &&\n      valid &&\n      dataState.binUnit === layers[0]?.unit &&\n      dataState.binUnitCount === layers[0].unitMultiplier;\n\n    if (labeled && textNestLevel <= config.maxLabelRowCount)\n      renderColumnTickLabels(\n        ctx,\n        config,\n        fadeOutPixelWidth,\n        emWidth,\n        getPixelX,\n        labelFormat,\n        minorLabelFormat,\n        textNestLevelRowLimited,\n        cartesianWidth,\n        binStartList,\n      );\n\n    if (renderBar)\n      renderColumnBars(\n        ctx,\n        getPixelX,\n        cartesianWidth,\n        cartesianHeight,\n        config.implicit ? halfLineThickness : 0,\n        rows,\n        yUnitScale,\n        config.barChroma,\n        config.barFillAlpha,\n        binStartList,\n      );\n    if (notTooDenseGridLayer({ minimumTickPixelDistance, unit, unitMultiplier })) {\n      const { rowPixelPitch } = config;\n      ctx.fillStyle = `rgb(${luma},${luma},${luma})`;\n      const lastBinForClosingGridline = binStartList.slice(-1).map((bin) => ({ ...bin, binStart: bin.supremum }));\n      pipeline(\n        [...binStartList, ...lastBinForClosingGridline],\n        mapping(({ minimum }) => minimum),\n        filtering((binStart) => binStart >= domainFrom),\n        mapping(getPixelX),\n        doing((pixelX: number) => {\n          const left = pixelX - 0.5 * lineThickness;\n          const height = cartesianHeight + lineNestLevelRowLimited * rowPixelPitch;\n          ctx.fillRect(left, -cartesianHeight, lineThickness, height);\n        }),\n        executing,\n      );\n    }\n\n    // render specially the tick that just precedes the domain, therefore may insert into it (eg. intentionally, via needing to see tick texts)\n    if (!isNil(binStartList[0]) && binStartList[0].minimum < domainFrom) {\n      const precedingBinStart = binStartList[0];\n      if (finestRaster) {\n        // condition necessary, otherwise it'll be the binStart of some temporally coarser bin\n        loHi.lo = precedingBinStart; // partial bin on the left\n      }\n      const { unitBarMaxWidthPixelsSum, unitBarMaxWidthPixelsCount } = calcColumnBar(\n        getPixelX,\n        loHi.unitBarMaxWidthPixelsSum,\n        loHi.unitBarMaxWidthPixelsCount,\n        i,\n        halfLineThickness,\n        config.implicit,\n        precedingBinStart,\n      );\n\n      loHi.unitBarMaxWidthPixelsSum = unitBarMaxWidthPixelsSum;\n      loHi.unitBarMaxWidthPixelsCount = unitBarMaxWidthPixelsCount;\n    }\n\n    renderHorizontalGridLines(\n      ctx,\n      config,\n      niceTicks,\n      yUnitScale,\n      cartesianHeight,\n      yTickNumberFormatter,\n      cartesianWidth,\n    );\n\n    return loHi;\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  backgroundFillStyle,\n  chartTopFontSize,\n  config,\n  defaultLabelFormat,\n  defaultMinorTickLabelFormat,\n  drawCartesianBox,\n  fadeOutPixelWidth,\n  horizontalCartesianAreaPad,\n  keyPanVelocityDivisor,\n  keyZoomVelocityDivisor,\n  localeOptions,\n  rasterConfig,\n  timeZone,\n  verticalCartesianAreaPad,\n  wheelPanVelocity,\n  wheelZoomVelocity,\n  HORIZONTAL_AXIS,\n  ZERO_Y_BASE,\n} from './config';\nimport { getEnrichedData } from './data';\nimport { DataState, getNullDataState, invalid, updateDataState } from './data_fetch';\nimport { renderChartTitle } from './render/annotations/chart_title';\nimport { renderTimeExtentAnnotation } from './render/annotations/time_extent';\nimport { renderTimeUnitAnnotation } from './render/annotations/time_unit';\nimport { renderCartesian } from './render/cartesian';\nimport { renderDebugBox } from './render/glyphs/debug_box';\nimport { continuousTimeRasters, NumberFormatter } from '../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { numericalRasters } from '../../xy_chart/axes/timeslip/numerical_rasters';\nimport { axisModel } from '../projections/axis_model';\nimport { domainTween } from '../projections/domain_tween';\nimport { getDesiredTickCount, makeLinearScale } from '../projections/scale';\nimport {\n  doPanFromJumpDelta,\n  doPanFromPosition,\n  doZoomAroundPosition,\n  doZoomFromJumpDelta,\n  endDrag,\n  getFocusDomain,\n  initialZoomPan,\n  kineticFlywheel,\n  markDragStartPosition,\n  multiplierToZoom,\n  panOngoing,\n  resetTouchZoom,\n  startTouchZoom,\n  touchOngoing,\n  ZoomPan,\n} from '../projections/zoom_pan';\nimport { GetData } from '../timeslip_api';\nimport { withAnimation, withDeltaTime } from '../utils/animation';\nimport { elementSize, ElementSize, zoomSafePointerX, zoomSafePointerY } from '../utils/dom';\nimport {\n  continuedTwoPointTouch,\n  eraseMultitouch,\n  getPinchRatio,\n  initialMultitouch,\n  Multitouch,\n  setNewMultitouch,\n  touches,\n  touchMidpoint,\n  twoTouchPinch,\n  zeroTouch,\n} from '../utils/multitouch';\n\nconst HEADER_ROW_Y_OFFSET = 3; // 3 normal text height gap between unit/range annotation on top and the Cartesian area\n\nconst getNullDimensions = (): ElementSize => ({\n  outerSize: NaN,\n  innerLeading: NaN,\n  innerTrailing: NaN,\n  innerSize: NaN,\n});\n\n/** @internal */\nexport interface InteractionState {\n  // remembering touch points for zoom/pam\n  multitouch: Multitouch;\n\n  // zoom/pan\n  horizontalZoomPan: ZoomPan;\n\n  // Y domain\n  niceDomainMin: number;\n  niceDomainMax: number;\n\n  // other\n  horizontalScreenDimensions: ElementSize;\n  verticalScreenDimensions: ElementSize;\n}\n\nconst getNullInteractionState = (): InteractionState => ({\n  // current zoom and pan level\n\n  horizontalZoomPan: initialZoomPan(),\n\n  // remembering touch points for zoom/pam\n  multitouch: initialMultitouch(),\n\n  // Y domain\n  niceDomainMin: NaN,\n  niceDomainMax: NaN,\n\n  // other\n  horizontalScreenDimensions: getNullDimensions(),\n  verticalScreenDimensions: getNullDimensions(),\n});\n\nconst rasterSelector =\n  HORIZONTAL_AXIS === 'continuousTime' ? continuousTimeRasters(rasterConfig, timeZone) : numericalRasters(rasterConfig);\n\nconst yTickNumberFormatter = new Intl.NumberFormat(\n  config.locale,\n  config.numUnit === 'none'\n    ? {}\n    : {\n        notation: 'compact',\n        compactDisplay: config.numUnit,\n      },\n);\n\nconst yTickNumberFormat: NumberFormatter = (value) => yTickNumberFormatter.format(value);\n\nconst touchUpdate = (interactionState: InteractionState, newMultitouch: Multitouch) => {\n  const { multitouch, horizontalZoomPan: zoomPan, horizontalScreenDimensions } = interactionState;\n  const noPreviousTouch = zeroTouch(multitouch);\n  const isTwoTouchPinch = twoTouchPinch(newMultitouch);\n  const center = touchMidpoint(newMultitouch);\n  const isPinchStart = noPreviousTouch && isTwoTouchPinch;\n  if (isPinchStart) {\n    setNewMultitouch(multitouch, newMultitouch);\n    startTouchZoom(zoomPan);\n    markDragStartPosition(zoomPan, center);\n  } else if (!isTwoTouchPinch || !continuedTwoPointTouch(multitouch, newMultitouch)) {\n    eraseMultitouch(multitouch);\n    resetTouchZoom(zoomPan);\n  }\n  const isPinchZoom = twoTouchPinch(multitouch);\n  const isTouchOngoing = touchOngoing(zoomPan);\n  const isPanOngoing = panOngoing(zoomPan);\n  if (isPinchZoom) {\n    const pinchRatio = getPinchRatio(multitouch, newMultitouch);\n    const desiredZoomChange = multiplierToZoom(pinchRatio);\n    doZoomAroundPosition(\n      zoomPan,\n      horizontalScreenDimensions,\n      center,\n      desiredZoomChange,\n      0, // panFromPosition(center),\n      true,\n    );\n    // doing both clashes in ways\n    // doPanFromPosition(zoomPan, horizontalScreenDimensions.innerSize, center);\n  } else {\n    const inCartesianBand = true; // let's assume for now\n    if (inCartesianBand || isTouchOngoing) {\n      if (isPanOngoing) {\n        doPanFromPosition(zoomPan, horizontalScreenDimensions.innerSize, center);\n      } else {\n        markDragStartPosition(zoomPan, center); // was dragStart(e)\n      }\n    }\n  }\n  return isPinchZoom || (isTouchOngoing && isPanOngoing);\n};\n\nconst inCartesianBand = (size: ElementSize, value: number) => size.innerLeading <= value && value <= size.innerTrailing;\n\nconst ensureCanvasResolution = (\n  canvas: HTMLCanvasElement,\n  outerWidth: number,\n  outerHeight: number,\n  newCanvasWidth: number,\n  newCanvasHeight: number,\n) => {\n  if (newCanvasWidth !== outerWidth) {\n    canvas.setAttribute('width', String(newCanvasWidth));\n  }\n  if (newCanvasHeight !== outerHeight) {\n    canvas.setAttribute('height', String(newCanvasHeight));\n  }\n};\n\nconst doCartesian = (\n  ctx: CanvasRenderingContext2D,\n  cartesianHeight: number,\n  interactionState: InteractionState,\n  deltaT: number,\n  cartesianWidth: number,\n  timeDomain: { domainFrom: number; domainTo: number },\n  dataState: DataState,\n  emWidth: number,\n) => {\n  ctx.save();\n  ctx.translate(0, cartesianHeight);\n\n  const domainLandmarks = [\n    dataState.dataResponse.stats.minValue,\n    dataState.dataResponse.stats.maxValue,\n    ...(ZERO_Y_BASE ? [0] : []),\n  ];\n  const desiredTickCount = getDesiredTickCount(cartesianHeight, config.smallFontSize, config.sparse);\n  const { niceDomainMin, niceDomainMax, niceTicks } = axisModel(domainLandmarks, desiredTickCount);\n  const yTweenOngoing = domainTween(interactionState, deltaT, niceDomainMin, niceDomainMax); // updates interactionState\n  const yUnitScale = makeLinearScale(interactionState.niceDomainMin, interactionState.niceDomainMax, 0, 1);\n\n  const dataDemand = renderCartesian(\n    ctx,\n    config,\n    dataState,\n    defaultMinorTickLabelFormat,\n    emWidth,\n    fadeOutPixelWidth,\n    defaultLabelFormat,\n    yTickNumberFormat,\n    rasterSelector,\n    cartesianWidth,\n    cartesianHeight,\n    timeDomain,\n    yUnitScale,\n    niceTicks,\n  );\n\n  ctx.restore();\n\n  return { yTweenOngoing, dataDemand };\n};\n\nconst renderChartWithTime = (\n  ctx: CanvasRenderingContext2D,\n  backgroundFillStyle: string,\n  newCanvasWidth: number,\n  newCanvasHeight: number,\n  config: {\n    locale: string;\n    monospacedFontShorthand: string;\n    subduedFontColor: string;\n    defaultFontColor: string;\n    a11y: { contrast: 'low' | 'medium' | 'high' };\n  },\n  chartWidth: number,\n  cartesianTop: number,\n  cartesianLeft: number,\n  cartesianHeight: number,\n  interactionState: InteractionState,\n  deltaT: number,\n  cartesianWidth: number,\n  drawCartesianBox: boolean, // set to true for debug border around the Cartesian plot area\n  chartTopFontSize: number,\n  dataState: DataState,\n  emWidth: number,\n  dpi: number,\n  fromSec: number,\n  toSec: number,\n) => {\n  ctx.save();\n  ctx.scale(dpi, dpi);\n  ctx.fillStyle = backgroundFillStyle;\n  // clearRect is not enough, as browser image copy ignores canvas background color\n  ctx.fillRect(0, 0, newCanvasWidth, newCanvasHeight);\n\n  // chart title\n  renderChartTitle(ctx, config.subduedFontColor, chartWidth /*, cartesianTop*/);\n\n  ctx.translate(cartesianLeft, cartesianTop);\n\n  const timeDomain = getFocusDomain(interactionState.horizontalZoomPan, fromSec, toSec);\n\n  // cartesian\n  const { yTweenOngoing, dataDemand } = doCartesian(\n    ctx,\n    cartesianHeight,\n    interactionState,\n    deltaT,\n    cartesianWidth,\n    timeDomain,\n    dataState,\n    emWidth,\n  );\n\n  // cartesian area box\n  if (drawCartesianBox) {\n    renderDebugBox(ctx, cartesianWidth, cartesianHeight);\n  }\n\n  const headerRowOffsetY = -chartTopFontSize * HEADER_ROW_Y_OFFSET;\n\n  // chart time unit info\n  renderTimeUnitAnnotation(\n    ctx,\n    config,\n    dataDemand.binUnitCount,\n    dataDemand.binUnit,\n    chartTopFontSize,\n    headerRowOffsetY,\n    dataDemand.unitBarMaxWidthPixels,\n  );\n\n  // chart time from/to extent info\n  renderTimeExtentAnnotation(ctx, config, localeOptions, timeDomain, cartesianWidth, headerRowOffsetY);\n\n  ctx.restore();\n  return { yTweenOngoing, dataDemand };\n};\n\nconst chartWithTime = (\n  canvas: HTMLCanvasElement,\n  ctx: CanvasRenderingContext2D,\n  config: {\n    locale: string;\n    monospacedFontShorthand: string;\n    subduedFontColor: string;\n    defaultFontColor: string;\n    a11y: { contrast: 'low' | 'medium' | 'high' };\n\n    domainFrom: number;\n    domainTo: number;\n  },\n  interactionState: InteractionState,\n  dataState: DataState,\n  deltaT: number,\n  dpi: number,\n  emWidth: number,\n) => {\n  const newHorizontalScreenDimensions = elementSize(canvas, true, horizontalCartesianAreaPad);\n  const chartWidth = newHorizontalScreenDimensions.outerSize;\n  const cartesianLeft = newHorizontalScreenDimensions.innerLeading;\n  const cartesianWidth = newHorizontalScreenDimensions.innerSize;\n\n  const newVerticalScreenDimensions = elementSize(canvas, false, verticalCartesianAreaPad);\n  const chartHeight = newVerticalScreenDimensions.outerSize;\n  const cartesianTop = newVerticalScreenDimensions.innerLeading;\n  const cartesianHeight = newVerticalScreenDimensions.innerSize;\n\n  // resize if needed\n  const newCanvasWidth = dpi * chartWidth;\n  const newCanvasHeight = dpi * chartHeight;\n  ensureCanvasResolution(\n    canvas,\n    interactionState.horizontalScreenDimensions.outerSize,\n    interactionState.verticalScreenDimensions.outerSize,\n    newCanvasWidth,\n    newCanvasHeight,\n  );\n  interactionState.horizontalScreenDimensions = newHorizontalScreenDimensions;\n  interactionState.verticalScreenDimensions = newVerticalScreenDimensions;\n\n  // render chart\n  const { yTweenOngoing, dataDemand } = renderChartWithTime(\n    ctx,\n    backgroundFillStyle,\n    newCanvasWidth,\n    newCanvasHeight,\n    config,\n    chartWidth,\n    cartesianTop,\n    cartesianLeft,\n    cartesianHeight,\n    interactionState,\n    deltaT,\n    cartesianWidth,\n    drawCartesianBox,\n    chartTopFontSize,\n    dataState,\n    emWidth,\n    dpi,\n    config.domainFrom,\n    config.domainTo,\n  );\n\n  const dataArrived =\n    !dataState.pending &&\n    invalid(dataState, dataDemand) &&\n    dataDemand.lo &&\n    dataDemand.hi &&\n    dataDemand.binUnit &&\n    dataDemand.binUnitCount;\n  if (dataArrived) {\n    dataState.pending = true;\n  }\n  return { dataArrived, yTweenOngoing, dataDemand };\n};\n\nconst setupEventHandlers = (\n  canvas: HTMLCanvasElement,\n  interactionState: InteractionState,\n  timedRender: FrameRequestCallback,\n  scheduleChartRender: () => void,\n) => {\n  const wheel = (e: WheelEvent) => {\n    // resolution and DOM dependent part\n    const isPanning = e.metaKey;\n    const wheeledDistanceRatio = e.deltaY / interactionState.horizontalScreenDimensions.innerSize; // for resolution independence\n    if (!inCartesianBand(interactionState.verticalScreenDimensions, zoomSafePointerY(e))) return;\n\n    // resolution independent part\n    if (isPanning) {\n      const innerSizeRelativeDelta = wheeledDistanceRatio * wheelPanVelocity;\n      doPanFromJumpDelta(interactionState.horizontalZoomPan, -innerSizeRelativeDelta);\n    } else {\n      const desiredZoomChange = -wheeledDistanceRatio * wheelZoomVelocity;\n      doZoomAroundPosition(\n        interactionState.horizontalZoomPan,\n        interactionState.horizontalScreenDimensions,\n        zoomSafePointerX(e),\n        desiredZoomChange,\n        0,\n        false,\n      );\n    }\n    scheduleChartRender();\n  };\n\n  const dragStart = (e: MouseEvent) => markDragStartPosition(interactionState.horizontalZoomPan, zoomSafePointerX(e));\n\n  const kineticDragFlywheel = (t: DOMHighResTimeStamp) => {\n    const needsRerender = kineticFlywheel(\n      interactionState.horizontalZoomPan,\n      interactionState.horizontalScreenDimensions.innerSize,\n    );\n    if (needsRerender) {\n      timedRender(t); // it's important that it be synchronous (rather than scheduleChartRender()) otherwise zoom-pan combos freeze a bit\n      window.requestAnimationFrame(kineticDragFlywheel);\n    }\n  };\n\n  const dragEnd = () => {\n    endDrag(interactionState.horizontalZoomPan);\n    window.requestAnimationFrame(kineticDragFlywheel);\n  };\n\n  const touchmove = (e: TouchEvent) => {\n    const shouldUpdate = touchUpdate(interactionState, touches(e));\n    if (shouldUpdate) scheduleChartRender();\n  };\n\n  const mousemove = (e: MouseEvent) => {\n    if (e.buttons !== 1) return;\n    interactionState.multitouch = initialMultitouch();\n    const zoomPan = interactionState.horizontalZoomPan;\n    resetTouchZoom(zoomPan);\n    if (\n      (inCartesianBand(interactionState.horizontalScreenDimensions, zoomSafePointerX(e)) &&\n        inCartesianBand(interactionState.verticalScreenDimensions, zoomSafePointerY(e))) ||\n      touchOngoing(zoomPan)\n    ) {\n      if (panOngoing(zoomPan)) {\n        doPanFromPosition(zoomPan, interactionState.horizontalScreenDimensions.innerSize, zoomSafePointerX(e));\n        scheduleChartRender();\n      } else {\n        dragStart(e);\n      }\n    }\n  };\n\n  const mousedown = (e: MouseEvent) =>\n    inCartesianBand(interactionState.horizontalScreenDimensions, zoomSafePointerX(e)) &&\n    inCartesianBand(interactionState.verticalScreenDimensions, zoomSafePointerY(e)) &&\n    dragStart(e);\n\n  const keydown = (e: KeyboardEvent) => {\n    const panDirection = { ArrowLeft: -1, ArrowRight: 1 }[e.code] ?? 0;\n    const zoomDirection = { ArrowUp: -1, ArrowDown: 1 }[e.code] ?? 0;\n\n    // todo move to zoompan ts\n    if (panDirection || zoomDirection) {\n      if (panDirection) {\n        const normalizedDeltaPan = panDirection / keyPanVelocityDivisor;\n        doPanFromJumpDelta(interactionState.horizontalZoomPan, normalizedDeltaPan);\n      }\n      if (zoomDirection) {\n        const normalizedDeltaZoom = zoomDirection / keyZoomVelocityDivisor;\n        const center = 0.5;\n        doZoomFromJumpDelta(interactionState.horizontalZoomPan, normalizedDeltaZoom, center);\n      }\n      e.preventDefault(); // preventDefault needed because otherwise a right arrow key takes the user to the next element\n      scheduleChartRender();\n    }\n  };\n\n  window.addEventListener('resize', scheduleChartRender, { passive: false });\n  canvas.addEventListener('wheel', wheel, { passive: false });\n  canvas.addEventListener('mousemove', mousemove, { passive: false });\n  canvas.addEventListener('mousedown', mousedown, { passive: false });\n  canvas.addEventListener('mouseup', dragEnd, { passive: false });\n  canvas.addEventListener('touchmove', touchmove, { passive: false });\n  canvas.addEventListener('touchend', dragEnd, { passive: false });\n  canvas.addEventListener('touchcancel', dragEnd, { passive: false });\n  canvas.addEventListener('keydown', keydown, { passive: false });\n};\n\n/** @internal */\nexport const timeslipRender = (canvas: HTMLCanvasElement, ctx: CanvasRenderingContext2D, getData: GetData) => {\n  const dpi = window.devicePixelRatio;\n  const emWidth = ctx.measureText('mmmmmmmmmm').width / 10; // approx width to avoid too many measurements\n\n  const interactionState = getNullInteractionState();\n  const dataState = getNullDataState();\n\n  const chartWithUpdate = (t: DOMHighResTimeStamp) => {\n    const { dataArrived, yTweenOngoing, dataDemand } = chartWithTime(\n      canvas,\n      ctx,\n      config,\n      interactionState,\n      dataState,\n      t,\n      dpi,\n      emWidth,\n    );\n    if (dataArrived) updateDataState(dataState, dataDemand, getEnrichedData(getData(dataDemand)));\n    if (dataArrived || yTweenOngoing) scheduleChartRender();\n  };\n\n  const timedRender = withDeltaTime(chartWithUpdate);\n  const scheduleChartRender = withAnimation(timedRender);\n\n  // initial render\n  scheduleChartRender();\n\n  setupEventHandlers(canvas, interactionState, timedRender, scheduleChartRender);\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TimeslipDataRows } from './timeslip/data_fetch';\nimport { DataDemand } from './timeslip/render/cartesian';\nimport { ChartType } from '..';\nimport { Spec } from '../../specs';\nimport { SpecType } from '../../specs/constants'; // kept as long-winded import on separate line otherwise import circularity emerges\nimport { buildSFProps, SFProps, useSpecFactory } from '../../state/spec_factory';\nimport { stripUndefined } from '../../utils/common';\n\n/**\n * data getter function\n * @public\n */\nexport type GetData = (dataDemand: DataDemand) => TimeslipDataRows;\n\n/**\n * Specifies the timeslip chart\n * @public\n */\nexport interface TimeslipSpec extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Timeslip;\n  getData: GetData;\n}\n\nconst buildProps = buildSFProps<TimeslipSpec>()(\n  {\n    chartType: ChartType.Timeslip,\n    specType: SpecType.Series,\n  },\n  {},\n);\n\n/**\n * Adds timeslip spec to chart specs\n * @public\n */\nexport const Timeslip = (\n  props: SFProps<\n    TimeslipSpec,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) => {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<TimeslipSpec>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { CSSProperties, RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { timeslipRender } from './timeslip/timeslip_render';\nimport { TimeslipSpec, GetData } from './timeslip_api';\nimport { ChartType } from '..';\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { SettingsSpec, SpecType, TooltipType } from '../../specs';\nimport { onChartRendered } from '../../state/actions/chart';\nimport { BackwardRef, GlobalChartState } from '../../state/chart_state';\nimport { getA11ySettingsSelector } from '../../state/selectors/get_accessibility_config';\nimport { getSettingsSpecSelector } from '../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../state/selectors/get_tooltip_spec';\nimport { getSpecsFromStore } from '../../state/utils';\nimport { Size } from '../../utils/dimensions';\nimport { roundUpSize } from '../flame_chart/render/common';\n// @ts-ignore until it becomes TS\n\ninterface StateProps {\n  getData: GetData;\n  chartDimensions: Size;\n  a11ySettings: ReturnType<typeof getA11ySettingsSelector>;\n  tooltipRequired: boolean;\n  onElementOver: NonNullable<SettingsSpec['onElementOver']>;\n  onElementClick: NonNullable<SettingsSpec['onElementClick']>;\n  onElementOut: NonNullable<SettingsSpec['onElementOut']>;\n  onRenderChange: NonNullable<SettingsSpec['onRenderChange']>;\n}\n\ninterface DispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface OwnProps {\n  containerRef: BackwardRef;\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype TimeslipProps = StateProps & DispatchProps & OwnProps;\n\nclass TimeslipComponent extends React.Component<TimeslipProps> {\n  static displayName = 'Timeslip';\n\n  // DOM API Canvas2d and WebGL resources\n  private ctx: CanvasRenderingContext2D | null = null;\n\n  componentDidMount = () => {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    this.drawCanvas();\n    this.props.onChartRendered();\n    this.props.containerRef().current?.addEventListener('wheel', (e) => e.preventDefault(), { passive: false });\n\n    const canvas = this.props.forwardStageRef.current;\n    if (canvas && this.ctx) timeslipRender(canvas, this.ctx, this.props.getData);\n  };\n\n  componentWillUnmount() {\n    this.props.containerRef().current?.removeEventListener('wheel', (e) => e.preventDefault());\n  }\n\n  componentDidUpdate = () => {\n    if (!this.ctx) this.tryCanvasContext();\n  };\n\n  render = () => {\n    const {\n      forwardStageRef,\n      chartDimensions: { width: requestedWidth, height: requestedHeight },\n      a11ySettings,\n    } = this.props;\n    const width = roundUpSize(requestedWidth);\n    const height = roundUpSize(requestedHeight);\n    const style: CSSProperties = {\n      width,\n      height,\n      top: 0,\n      left: 0,\n      padding: 0,\n      margin: 0,\n      border: 0,\n      position: 'absolute',\n      cursor: DEFAULT_CSS_CURSOR,\n      touchAction: 'none',\n    };\n\n    const dpr = window.devicePixelRatio; /* * this.pinchZoomScale */\n    const canvasWidth = width * dpr;\n    const canvasHeight = height * dpr;\n    return (\n      <>\n        <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n          <canvas /* Canvas2d layer */\n            ref={forwardStageRef}\n            tabIndex={0}\n            className=\"echCanvasRenderer\"\n            width={canvasWidth}\n            height={canvasHeight}\n            style={{ ...style, outline: 'none' }}\n            // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n            role=\"presentation\"\n          />\n        </figure>\n      </>\n    );\n  };\n\n  private drawCanvas = () => {\n    if (!this.ctx) return;\n    this.props.onRenderChange(true); // emit API callback\n  };\n\n  private tryCanvasContext = () => {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  };\n}\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  const timeslipSpec = getSpecsFromStore<TimeslipSpec>(state.specs, ChartType.Timeslip, SpecType.Series)[0];\n  const settingsSpec = getSettingsSpecSelector(state);\n  return {\n    getData: timeslipSpec?.getData ?? (() => []),\n    chartDimensions: state.parentDimensions,\n    a11ySettings: getA11ySettingsSelector(state),\n    tooltipRequired: getTooltipSpecSelector(state).type !== TooltipType.None,\n\n    // mandatory charts API protocol; todo extract these mappings once there are other charts like Timeslip\n    onElementOver: settingsSpec.onElementOver ?? (() => {}),\n    onElementClick: settingsSpec.onElementClick ?? (() => {}),\n    onElementOut: settingsSpec.onElementOut ?? (() => {}),\n    onRenderChange: settingsSpec.onRenderChange ?? (() => {}), // todo eventually also update data props on a local .echChartStatus element: data-ech-render-complete={rendered} data-ech-render-count={renderedCount} data-ech-debug-state={debugStateString}\n  };\n};\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst TimeslipChartLayers = connect(mapStateToProps, mapDispatchToProps)(TimeslipComponent);\n\n/** @internal */\nexport const TimeslipWithTooltip = (containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) => (\n  <TimeslipChartLayers forwardStageRef={forwardStageRef} containerRef={containerRef} />\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const withAnimation = (renderer: FrameRequestCallback) => {\n  let rAF = -1;\n  return () => {\n    window.cancelAnimationFrame(rAF);\n    rAF = window.requestAnimationFrame(renderer);\n  };\n};\n\n/** @internal */\nexport const withDeltaTime = (renderer: FrameRequestCallback) => {\n  let prevT = 0;\n  return (t: DOMHighResTimeStamp) => {\n    const deltaT = t - prevT;\n    prevT = t;\n    renderer(deltaT);\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const zoomSafePointerX = (e: MouseEvent) => e.offsetX; // robust against Chrome, Safari, Firefox menu zooms and/or pinch zoom (FF needs zero margin)\n\n/** @internal */\nexport const zoomSafePointerY = (e: MouseEvent) => e.offsetY; // robust against Chrome, Safari, Firefox menu zooms and/or pinch zoom (FF needs zero margin)\n\n/** @internal */\nexport interface ElementSize {\n  outerSize: number;\n  innerLeading: number;\n  innerTrailing: number;\n  innerSize: number;\n}\n\n/** @internal */\nexport const elementSize = (canvas: HTMLCanvasElement, horizontal: boolean, pad: [number, number]): ElementSize => {\n  const outerSize = Number.parseFloat(horizontal ? canvas.style.width : canvas.style.height);\n\n  const innerLeading = outerSize * pad[0];\n  const innerSize = outerSize * (1 - pad.reduce((p, n) => p + n));\n  const innerTrailing = innerLeading + innerSize;\n\n  return {\n    outerSize,\n    innerLeading,\n    innerTrailing,\n    innerSize,\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const mix = (start: number, end: number, a: number) => start * (1 - a) + end * a; // like the glsl function\n/** @internal */\nexport const clamp = (n: number, lo: number, hi: number) => (n < lo ? lo : n > hi ? hi : n);\n/** @internal */\nexport const unitClamp = (n: number) => (n <= 0 ? 0 : n >= 1 ? 1 : n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\ninterface MappedTouch {\n  id: number;\n  position: number;\n}\n\n/** @internal */\nexport type Multitouch = MappedTouch[];\n\n/** @internal */\nexport const initialMultitouch = (): Multitouch => [];\n\n/** @internal */\nexport const touchMidpoint = (multitouch: MappedTouch[]) =>\n  multitouch.reduce((sum, { position }) => sum + position, 0) / multitouch.length;\n\nconst isNonNull = <T>(thing: T | null): thing is T => thing !== null;\n\n/** @internal */\nexport const touches = (e: TouchEvent) =>\n  [...new Array(e.touches?.length ?? 0)]\n    .map((_, i: number) => e.touches.item(i))\n    .filter(isNonNull)\n    .map((t: Touch) => ({ id: t.identifier, position: t.clientX }))\n    .sort(({ position: a }, { position: b }) => a - b);\n\n/** @internal */\nexport const continuedTwoPointTouch = (multitouch: MappedTouch[], newMultitouch: MappedTouch[]) =>\n  [...newMultitouch, ...multitouch].filter((t, i, a) => a.findIndex((tt) => tt.id === t.id) === i).length === 2;\n\n/** @internal */\nexport const setNewMultitouch = (multitouch: MappedTouch[], newMultitouch: MappedTouch[]) =>\n  multitouch.splice(0, Infinity, ...newMultitouch);\n\n/** @internal */\nexport const eraseMultitouch = (multitouch: MappedTouch[]) => multitouch.splice(0, Infinity);\n\n/** @internal */\nexport const getPinchRatio = (multitouch: MappedTouch[], newMultitouch: MappedTouch[]) => {\n  return (\n    (multitouch[1]?.position ?? NaN - (multitouch[0]?.position ?? NaN)) /\n    ((newMultitouch[1]?.position ?? NaN) - (newMultitouch[0]?.position ?? NaN))\n  );\n};\n\n/** @internal */\nexport const twoTouchPinch = (multitouch: MappedTouch[]) => multitouch.length === 2;\n\n/** @internal */\nexport const zeroTouch = (multitouch: MappedTouch[]) => multitouch.length === 0;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Word as D3Word } from 'd3-cloud';\nimport { $Values as Values } from 'utility-types';\n\nimport { Color } from '../../../../common/colors';\nimport { Pixels, PointObject } from '../../../../common/geometry';\nimport { FontStyle } from '../../../../common/text_utils';\n\n/** @public */\nexport interface WordModel {\n  text: string;\n  weight: number;\n  color: Color;\n}\n\n/** @public */\nexport const WeightFn = Object.freeze({\n  log: 'log' as const,\n  linear: 'linear' as const,\n  exponential: 'exponential' as const,\n  squareRoot: 'squareRoot' as const,\n});\n\n/** @public */\nexport type WeightFn = Values<typeof WeightFn>;\n\n/**\n * Word properties extends `D3Word` except for explicitly defined values.\n *\n * `D3Word` values are added datum via d3TagCloud, but may be undefined\n * @internal\n */\nexport interface Word extends D3Word {\n  datum: WordModel;\n  text: string;\n  color: string;\n  fontFamily: string;\n  style: string;\n  fontWeight: number;\n  size: number;\n}\n\n/** @public */\nexport type OutOfRoomCallback = (wordCount: number, renderedWordCount: number, renderedWords: string[]) => void;\n\n/** @public */\nexport interface WordcloudViewModel {\n  startAngle: number;\n  endAngle: number;\n  angleCount: number;\n  padding: number;\n  fontWeight: number;\n  fontFamily: string;\n  fontStyle: FontStyle;\n  minFontSize: number;\n  maxFontSize: number;\n  spiral: string;\n  exponent: number;\n  data: WordModel[];\n  weightFn: WeightFn;\n  outOfRoomCallback: OutOfRoomCallback;\n}\n\n/** @internal */\nexport interface Datum {\n  text: string;\n  weight: number;\n  color: string;\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels) => Array<WordcloudViewModel>;\n\n/** @internal */\nexport type ShapeViewModel = {\n  wordcloudViewModel: WordcloudViewModel;\n  chartCenter: PointObject;\n  pickQuads: PickFunction;\n  specId: string;\n};\n\nconst commonDefaults: WordcloudViewModel = {\n  startAngle: -20,\n  endAngle: 20,\n  angleCount: 5,\n  padding: 2,\n  fontWeight: 300,\n  fontFamily: 'Impact',\n  fontStyle: 'italic',\n  minFontSize: 10,\n  maxFontSize: 50,\n  spiral: 'archimedean',\n  exponent: 3,\n  data: [],\n  weightFn: 'exponential',\n  outOfRoomCallback: () => {},\n};\n\n/** @internal */\nexport const defaultWordcloudSpec = {\n  ...commonDefaults,\n};\n\n/** @internal */\nexport const nullWordcloudViewModel: WordcloudViewModel = {\n  ...commonDefaults,\n  data: [],\n};\n\n/** @internal */\nexport const nullShapeViewModel = (): ShapeViewModel => ({\n  wordcloudViewModel: nullWordcloudViewModel,\n  chartCenter: { x: 0, y: 0 },\n  pickQuads: () => [],\n  specId: 'empty',\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { WordcloudSpec } from '../../specs';\nimport { WordcloudViewModel, PickFunction, ShapeViewModel } from '../types/viewmodel_types';\n\n/** @internal */\nexport function shapeViewModel(spec: WordcloudSpec, theme: Theme, chartDimensions: Dimensions): ShapeViewModel {\n  const { width, height } = chartDimensions;\n  const { chartMargins: margin } = theme;\n  const innerWidth = width - margin.left - margin.right;\n  const innerHeight = height - margin.top - margin.bottom;\n\n  const chartCenter = {\n    x: width * margin.left + innerWidth / 2,\n    y: height * margin.top + innerHeight / 2,\n  };\n\n  const {\n    id,\n    startAngle,\n    endAngle,\n    angleCount,\n    padding,\n    fontWeight,\n    fontFamily,\n    fontStyle,\n    minFontSize,\n    maxFontSize,\n    spiral,\n    exponent,\n    data,\n    weightFn,\n    outOfRoomCallback,\n  } = spec;\n\n  const wordcloudViewModel: WordcloudViewModel = {\n    startAngle,\n    endAngle,\n    angleCount,\n    padding,\n    fontWeight,\n    fontFamily,\n    fontStyle,\n    minFontSize,\n    maxFontSize,\n    spiral,\n    exponent,\n    data,\n    weightFn,\n    outOfRoomCallback,\n  };\n\n  const pickQuads: PickFunction = (x, y) =>\n    -innerWidth / 2 <= x && x <= innerWidth / 2 && -innerHeight / 2 <= y && y <= innerHeight / 2\n      ? [wordcloudViewModel]\n      : [];\n\n  // combined viewModel\n  return {\n    chartCenter,\n    wordcloudViewModel,\n    pickQuads,\n    specId: id,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport d3TagCloud from 'd3-cloud';\nimport React from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { ScreenReaderSummary } from '../../../../components/accessibility';\nimport { SettingsSpec, WordCloudElementEvent } from '../../../../specs/settings';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Size } from '../../../../utils/dimensions';\nimport { nullShapeViewModel, ShapeViewModel, Word, WordcloudViewModel } from '../../layout/types/viewmodel_types';\nimport { geometries } from '../../state/selectors/geometries';\n\nfunction getFont(d: Word) {\n  return d.fontFamily;\n}\n\nfunction getFontStyle(d: Word) {\n  return d.style;\n}\n\nfunction getFontWeight(d: Word) {\n  return d.fontWeight;\n}\n\nfunction getFontSize(d: Word) {\n  return d.size;\n}\n\nfunction hashWithinRange(str: string, max: number) {\n  str = JSON.stringify(str);\n  let hash = 0;\n  for (const ch of str) {\n    hash = (hash * 31 + ch.charCodeAt(0)) % max;\n  }\n  return Math.abs(hash) % max;\n}\n\nfunction getRotation(startAngle: number, endAngle: number, count: number, text: string) {\n  const angleRange = endAngle - startAngle;\n  const angleCount = count ?? 360;\n  const interval = count - 1;\n  const angleStep = interval === 0 ? 0 : angleRange / interval;\n  const index = hashWithinRange(text, angleCount);\n  return index * angleStep + startAngle;\n}\n\nfunction exponential(minFontSize: number, maxFontSize: number, exponent: number, weight: number) {\n  return minFontSize + (maxFontSize - minFontSize) * weight ** exponent;\n}\n\nfunction linear(minFontSize: number, maxFontSize: number, _exponent: number, weight: number) {\n  return minFontSize + (maxFontSize - minFontSize) * weight;\n}\n\nfunction squareRoot(minFontSize: number, maxFontSize: number, _exponent: number, weight: number) {\n  return minFontSize + (maxFontSize - minFontSize) * Math.sqrt(weight);\n}\n\nfunction log(minFontSize: number, maxFontSize: number, _exponent: number, weight: number) {\n  return minFontSize + (maxFontSize - minFontSize) * Math.log2(weight + 1);\n}\n\nconst weightFnLookup = { linear, exponential, log, squareRoot };\n\nfunction layoutMaker({ data, ...viewModel }: WordcloudViewModel, chartSize: Size) {\n  const { height, width } = chartSize;\n  const words = data.map<Word>((d) => {\n    const weightFn = weightFnLookup[viewModel.weightFn];\n    return {\n      datum: d,\n      text: d.text,\n      color: d.color,\n      fontFamily: viewModel.fontFamily,\n      style: viewModel.fontStyle,\n      fontWeight: viewModel.fontWeight,\n      size: weightFn(viewModel.minFontSize, viewModel.maxFontSize, viewModel.exponent, d.weight),\n    };\n  });\n\n  return d3TagCloud<Word>()\n    .random(() => 0.5)\n    .size([width, height])\n    .words(words)\n    .spiral(viewModel.spiral ?? 'archimedean')\n    .padding(viewModel.padding ?? 5)\n    .rotate((d) => getRotation(viewModel.startAngle, viewModel.endAngle, viewModel.angleCount, d.text))\n    .font(getFont)\n    .fontStyle(getFontStyle)\n    .fontWeight(getFontWeight)\n    .fontSize(getFontSize);\n}\n\nconst View = ({\n  words,\n  size: { height, width },\n  actions: { onElementClick, onElementOver, onElementOut },\n  specId,\n}: {\n  words: Word[];\n  size: Size;\n  actions: {\n    onElementClick?: SettingsSpec['onElementClick'];\n    onElementOver?: SettingsSpec['onElementOver'];\n    onElementOut?: SettingsSpec['onElementOut'];\n  };\n  specId: string;\n}) => {\n  return (\n    <svg width={width} height={height} role=\"presentation\">\n      <g transform={`translate(${width / 2}, ${height / 2})`}>\n        {words.map((d, i) => {\n          const elements: WordCloudElementEvent[] = [[d.datum, { specId, key: specId }]];\n          const actions = {\n            ...(onElementClick && {\n              onClick: () => {\n                onElementClick(elements);\n              },\n            }),\n            ...(onElementOver && {\n              onMouseOver: () => {\n                onElementOver(elements);\n              },\n            }),\n            ...(onElementOut && {\n              onMouseOut: () => {\n                onElementOut();\n              },\n            }),\n          };\n          return (\n            <text\n              key={String(i)}\n              style={{\n                fontSize: getFontSize(d),\n                fontStyle: getFontStyle(d),\n                fontFamily: getFont(d),\n                fontWeight: getFontWeight(d),\n                fill: d.color,\n              }}\n              textAnchor=\"middle\"\n              transform={`translate(${d.x}, ${d.y}) rotate(${d.rotate})`}\n              {...actions}\n            >\n              {d.text}\n            </text>\n          );\n        })}\n      </g>\n    </svg>\n  );\n};\n\ninterface ReactiveChartStateProps {\n  initialized: boolean;\n  geometries: ShapeViewModel;\n  chartSize: Size;\n  a11ySettings: A11ySettings;\n  onElementClick?: SettingsSpec['onElementClick'];\n  onElementOver?: SettingsSpec['onElementOver'];\n  onElementOut?: SettingsSpec['onElementOut'];\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ntype Props = ReactiveChartStateProps & ReactiveChartDispatchProps;\n\nclass Component extends React.Component<Props> {\n  static displayName = 'Wordcloud';\n\n  componentDidMount() {\n    if (this.props.initialized) {\n      this.props.onChartRendered();\n    }\n  }\n\n  componentDidUpdate() {\n    if (this.props.initialized) {\n      this.props.onChartRendered();\n    }\n  }\n\n  render() {\n    const {\n      initialized,\n      chartSize,\n      geometries: { wordcloudViewModel, specId },\n      a11ySettings,\n      onElementClick,\n      onElementOver,\n      onElementOut,\n    } = this.props;\n\n    if (!initialized || chartSize.width === 0 || chartSize.height === 0) {\n      return null;\n    }\n\n    const layout = layoutMaker(wordcloudViewModel, chartSize);\n\n    let renderedWordObjects: Word[] = [];\n    layout.on('end', (w) => (renderedWordObjects = w)).start();\n\n    const wordCount = wordcloudViewModel.data.length;\n    const renderedWordCount: number = renderedWordObjects.length;\n    const notAllWordsFit = wordCount !== renderedWordCount;\n    if (notAllWordsFit && wordcloudViewModel.outOfRoomCallback instanceof Function) {\n      wordcloudViewModel.outOfRoomCallback(\n        wordCount,\n        renderedWordCount,\n        renderedWordObjects.map((word) => word.text),\n      );\n    }\n\n    return (\n      <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n        <View\n          words={renderedWordObjects}\n          size={chartSize}\n          actions={{ onElementClick, onElementOut, onElementOver }}\n          specId={specId}\n        />\n        <ScreenReaderSummary />\n      </figure>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  initialized: false,\n  geometries: nullShapeViewModel(),\n  chartSize: {\n    width: 0,\n    height: 0,\n  },\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  return {\n    initialized: true,\n    geometries: geometries(state),\n    chartSize: state.parentDimensions,\n    a11ySettings: getA11ySettingsSelector(state),\n    onElementClick: getSettingsSpecSelector(state).onElementClick,\n    onElementOver: getSettingsSpecSelector(state).onElementOver,\n    onElementOut: getSettingsSpecSelector(state).onElementOut,\n  };\n};\n\n/** @internal */\nexport const Wordcloud = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { specComponentFactory } from '../../../state/spec_factory';\nimport { defaultWordcloudSpec, WordcloudViewModel } from '../layout/types/viewmodel_types';\n\n/** @alpha */\nexport interface WordcloudSpec extends Spec, WordcloudViewModel {\n  chartType: typeof ChartType.Wordcloud;\n  specType: typeof SpecType.Series;\n}\n\n/**\n * Adds wordcloud spec to chart\n * @alpha\n */\nexport const Wordcloud = specComponentFactory<WordcloudSpec>()(\n  {\n    chartType: ChartType.Wordcloud,\n    specType: SpecType.Series,\n  },\n  {\n    ...defaultWordcloudSpec,\n  },\n);\n\n/** @public */\nexport type WordcloudProps = ComponentProps<typeof Wordcloud>;\n\nexport { WordModel, WeightFn, OutOfRoomCallback } from '../layout/types/viewmodel_types';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { getWordcloudSpecSelector } from './selectors/wordcloud_spec';\nimport { ChartType } from '../..';\nimport { DEFAULT_CSS_CURSOR } from '../../../common/constants';\nimport { LegendItem } from '../../../common/legend';\nimport { InternalChartState, GlobalChartState } from '../../../state/chart_state';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { LegendItemLabel } from '../../../state/selectors/get_legend_items_labels';\nimport { DebugState } from '../../../state/types';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { Wordcloud } from '../renderer/svg/connected_component';\n\nconst EMPTY_MAP = new Map();\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\nconst EMPTY_LEGEND_ITEM_LIST: LegendItemLabel[] = [];\nconst EMPTY_TOOLTIP = Object.freeze({ header: null, values: [] });\n\n/** @internal */\nexport class WordcloudState implements InternalChartState {\n  chartType = ChartType.Wordcloud;\n\n  isInitialized(globalState: GlobalChartState) {\n    return getWordcloudSpecSelector(globalState) !== null ? InitStatus.Initialized : InitStatus.ChartNotInitialized;\n  }\n\n  isBrushAvailable() {\n    return false;\n  }\n\n  isBrushing() {\n    return false;\n  }\n\n  isChartEmpty() {\n    return false;\n  }\n\n  getLegendItems() {\n    return EMPTY_LEGEND_LIST;\n  }\n\n  getLegendItemsLabels() {\n    return EMPTY_LEGEND_ITEM_LIST;\n  }\n\n  getLegendExtraValues() {\n    return EMPTY_MAP;\n  }\n\n  chartRenderer() {\n    return <Wordcloud />;\n  }\n\n  getPointerCursor() {\n    return DEFAULT_CSS_CURSOR;\n  }\n\n  isTooltipVisible() {\n    return {\n      visible: false,\n      isExternal: false,\n      displayOnly: false,\n      isPinnable: false,\n    };\n  }\n\n  getTooltipInfo() {\n    return EMPTY_TOOLTIP;\n  }\n\n  getTooltipAnchor(state: GlobalChartState) {\n    const { position } = state.interactions.pointer.current;\n    return {\n      isRotated: false,\n      x: position.x,\n      width: 0,\n      y: position.y,\n      height: 0,\n    };\n  }\n\n  eventCallbacks() {}\n\n  getChartTypeDescription() {\n    return 'Word cloud chart';\n  }\n\n  // TODO\n  getProjectionContainerArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getMainProjectionArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getBrushArea(): Dimensions | null {\n    return null;\n  }\n\n  // TODO\n  getDebugState(): DebugState {\n    return {};\n  }\n\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { render } from './scenegraph';\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { WordcloudSpec } from '../../specs';\n\nconst getParentDimensions = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const geometries = createCustomCachedSelector(\n  [getSpecs, getChartThemeSelector, getParentDimensions],\n  (specs, theme, parentDimensions): ShapeViewModel => {\n    const wordcloudSpec = getSpecFromStore<WordcloudSpec, false>(specs, ChartType.Wordcloud, SpecType.Series, false);\n    return wordcloudSpec ? render(wordcloudSpec, theme, parentDimensions) : nullShapeViewModel();\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { shapeViewModel } from '../../layout/viewmodel/viewmodel';\nimport { WordcloudSpec } from '../../specs';\n\n/** @internal */\nexport function render(spec: WordcloudSpec, theme: Theme, parentDimensions: Dimensions): ShapeViewModel {\n  return shapeViewModel(spec, theme, parentDimensions);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { WordcloudSpec } from '../../specs';\n\n/** @internal */\nexport function getWordcloudSpecSelector(state: GlobalChartState): WordcloudSpec | null {\n  return getSpecFromStore<WordcloudSpec, false>(state.specs, ChartType.Wordcloud, SpecType.Series, false);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnnotationLineProps } from './types';\nimport { Colors } from '../../../../common/colors';\nimport { SmallMultipleScales, getPanelSize } from '../../../../common/panel_utils';\nimport { Line } from '../../../../geoms/types';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { isBandScale, isContinuousScale } from '../../../../scales/types';\nimport { Position, Rotation } from '../../../../utils/common';\nimport { Dimensions, Size } from '../../../../utils/dimensions';\nimport { GroupId } from '../../../../utils/ids';\nimport { mergeWithDefaultAnnotationLine } from '../../../../utils/themes/merge_utils';\nimport { isHorizontalRotation, isVerticalRotation } from '../../state/utils/common';\nimport { computeXScaleOffset } from '../../state/utils/utils';\nimport { AnnotationDomainType, LineAnnotationDatum, LineAnnotationSpec } from '../../utils/specs';\n\nfunction computeYDomainLineAnnotationDimensions(\n  annotationSpec: LineAnnotationSpec,\n  yScale: ScaleContinuous,\n  { vertical, horizontal }: SmallMultipleScales,\n  chartRotation: Rotation,\n  axisPosition?: Position,\n): AnnotationLineProps[] {\n  const {\n    id: specId,\n    dataValues,\n    marker: icon,\n    markerBody: body,\n    markerDimensions: dimension,\n    markerPosition: specMarkerPosition,\n    style,\n  } = annotationSpec;\n  const lineStyle = mergeWithDefaultAnnotationLine(style);\n  const color = lineStyle?.line?.stroke ?? Colors.Red.keyword;\n  const isHorizontalChartRotation = isHorizontalRotation(chartRotation);\n  // let's use a default Bottom-X/Left-Y axis orientation if we are not showing an axis\n  // but we are displaying a line annotation\n\n  const lineProps: AnnotationLineProps[] = [];\n  const [domainStart, domainEnd] = yScale.domain;\n\n  const panelSize = getPanelSize({ vertical, horizontal });\n\n  dataValues.forEach((datum: LineAnnotationDatum, i) => {\n    const { dataValue } = datum;\n\n    // avoid rendering invalid annotation value\n    if (!dataValue && dataValue !== 0) return;\n\n    const annotationValueYPosition = yScale.scale(dataValue);\n    // avoid rendering non scalable annotation values\n    if (Number.isNaN(annotationValueYPosition)) return;\n\n    // avoid rendering annotation with values outside the scale domain\n    if (dataValue < domainStart || dataValue > domainEnd) return;\n\n    vertical.domain.forEach((verticalValue) => {\n      horizontal.domain.forEach((horizontalValue) => {\n        const top = vertical.scale(verticalValue);\n        const left = horizontal.scale(horizontalValue);\n        if (Number.isNaN(top + left)) return;\n\n        const width = isHorizontalChartRotation ? horizontal.bandwidth : vertical.bandwidth;\n        const height = isHorizontalChartRotation ? vertical.bandwidth : horizontal.bandwidth;\n        const linePathPoints = getYLinePath({ width, height }, annotationValueYPosition);\n        const alignment = getAnchorPosition(false, chartRotation, axisPosition, specMarkerPosition);\n\n        const position = getMarkerPositionForYAnnotation(\n          panelSize,\n          chartRotation,\n          alignment,\n          annotationValueYPosition,\n          dimension,\n        );\n\n        const lineProp: AnnotationLineProps = {\n          specId,\n          id: getAnnotationLinePropsId(specId, datum, i, verticalValue, horizontalValue),\n          datum,\n          linePathPoints,\n          markers: icon\n            ? [\n                {\n                  icon,\n                  body,\n                  color,\n                  dimension,\n                  position,\n                  alignment,\n                },\n              ]\n            : [],\n          panel: {\n            ...panelSize,\n            top,\n            left,\n          },\n        };\n\n        lineProps.push(lineProp);\n      });\n    });\n  });\n\n  return lineProps;\n}\n\nfunction computeXDomainLineAnnotationDimensions(\n  annotationSpec: LineAnnotationSpec,\n  xScale: ScaleContinuous | ScaleBand,\n  { vertical, horizontal }: SmallMultipleScales,\n  chartRotation: Rotation,\n  isHistogramMode: boolean,\n  axisPosition?: Position,\n): AnnotationLineProps[] {\n  const {\n    id: specId,\n    dataValues,\n    marker: icon,\n    markerBody: body,\n    markerDimensions: dimension,\n    markerPosition: specMarkerPosition,\n    style,\n  } = annotationSpec;\n  const lineStyle = mergeWithDefaultAnnotationLine(style);\n  const color = lineStyle?.line?.stroke ?? Colors.Red.keyword;\n\n  const lineProps: AnnotationLineProps[] = [];\n  const isHorizontalChartRotation = isHorizontalRotation(chartRotation);\n  const panelSize = getPanelSize({ vertical, horizontal });\n\n  dataValues.forEach((datum: LineAnnotationDatum, i) => {\n    const { dataValue } = datum;\n    let annotationValueXPosition = xScale.scale(dataValue);\n    if (Number.isNaN(annotationValueXPosition)) {\n      return;\n    }\n    if (isContinuousScale(xScale) && typeof dataValue === 'number') {\n      const [minDomain, scaleMaxDomain] = xScale.domain;\n      const maxDomain = isHistogramMode ? scaleMaxDomain + xScale.minInterval : scaleMaxDomain;\n      if (dataValue < minDomain || dataValue > maxDomain) {\n        return;\n      }\n      if (isHistogramMode) {\n        const offset = computeXScaleOffset(xScale, true);\n        const pureScaledValue = xScale.pureScale(dataValue);\n        if (!Number.isNaN(pureScaledValue)) {\n          // Number.isFinite is regrettably not a type guard yet https://github.com/microsoft/TypeScript/issues/10038#issuecomment-924115831\n          annotationValueXPosition = pureScaledValue - offset;\n        }\n      } else {\n        annotationValueXPosition += (xScale.bandwidth * xScale.totalBarsInCluster) / 2;\n      }\n    } else if (isBandScale(xScale)) {\n      annotationValueXPosition += isHistogramMode\n        ? -(xScale.step - xScale.originalBandwidth) / 2\n        : xScale.originalBandwidth / 2;\n    } else {\n      return;\n    }\n    if (!isFinite(annotationValueXPosition)) {\n      return;\n    }\n\n    vertical.domain.forEach((verticalValue) => {\n      horizontal.domain.forEach((horizontalValue) => {\n        if (Number.isNaN(annotationValueXPosition)) return;\n\n        const top = vertical.scale(verticalValue);\n        const left = horizontal.scale(horizontalValue);\n        if (Number.isNaN(top + left)) return;\n\n        const width = isHorizontalChartRotation ? horizontal.bandwidth : vertical.bandwidth;\n        const height = isHorizontalChartRotation ? vertical.bandwidth : horizontal.bandwidth;\n\n        const linePathPoints = getXLinePath({ width, height }, annotationValueXPosition);\n        const alignment = getAnchorPosition(true, chartRotation, axisPosition, specMarkerPosition);\n\n        const position = getMarkerPositionForXAnnotation(\n          panelSize,\n          chartRotation,\n          alignment,\n          annotationValueXPosition,\n          dimension,\n        );\n\n        const lineProp: AnnotationLineProps = {\n          specId,\n          id: getAnnotationLinePropsId(specId, datum, i, verticalValue, horizontalValue),\n          datum,\n          linePathPoints,\n          markers: icon\n            ? [\n                {\n                  icon,\n                  body,\n                  color,\n                  dimension,\n                  position,\n                  alignment,\n                },\n              ]\n            : [],\n          panel: {\n            ...panelSize,\n            top,\n            left,\n          },\n        };\n        lineProps.push(lineProp);\n      });\n    });\n  });\n\n  return lineProps;\n}\n\n/** @internal */\nexport function computeLineAnnotationDimensions(\n  annotationSpec: LineAnnotationSpec,\n  chartRotation: Rotation,\n  yScales: Map<GroupId, ScaleContinuous>,\n  xScale: ScaleContinuous | ScaleBand,\n  smallMultipleScales: SmallMultipleScales,\n  isHistogramMode: boolean,\n  axisPosition?: Position,\n): AnnotationLineProps[] | null {\n  const { domainType, hideLines } = annotationSpec;\n\n  if (hideLines) {\n    return null;\n  }\n\n  if (domainType === AnnotationDomainType.XDomain) {\n    return computeXDomainLineAnnotationDimensions(\n      annotationSpec,\n      xScale,\n      smallMultipleScales,\n      chartRotation,\n      isHistogramMode,\n      axisPosition,\n    );\n  }\n\n  const { groupId } = annotationSpec;\n  const yScale = yScales.get(groupId);\n  if (!yScale) {\n    return null;\n  }\n\n  return computeYDomainLineAnnotationDimensions(\n    annotationSpec,\n    yScale,\n    smallMultipleScales,\n    chartRotation,\n    axisPosition,\n  );\n}\n\nfunction getAnchorPosition(\n  isXDomain: boolean,\n  chartRotation: Rotation,\n  axisPosition?: Position,\n  specMarkerPosition?: Position,\n): Position {\n  const dflPositionFromAxis = getDefaultMarkerPositionFromAxis(isXDomain, chartRotation, axisPosition);\n  if (specMarkerPosition !== undefined) {\n    // validate specMarkerPosition against domain\n    const validatedPosFromMarkerPos = validateMarkerPosition(isXDomain, chartRotation, specMarkerPosition);\n    return validatedPosFromMarkerPos ?? dflPositionFromAxis;\n  }\n  return dflPositionFromAxis;\n}\n\nfunction validateMarkerPosition(isXDomain: boolean, chartRotation: Rotation, position: Position): Position | undefined {\n  if ((isXDomain && isHorizontalRotation(chartRotation)) || (!isXDomain && isVerticalRotation(chartRotation))) {\n    return position === Position.Top || position === Position.Bottom ? position : undefined;\n  }\n  return position === Position.Left || position === Position.Right ? position : undefined;\n}\n\nfunction getDefaultMarkerPositionFromAxis(\n  isXDomain: boolean,\n  chartRotation: Rotation,\n  axisPosition?: Position,\n): Position {\n  if (axisPosition) {\n    return axisPosition;\n  }\n  if ((isXDomain && isVerticalRotation(chartRotation)) || (!isXDomain && isHorizontalRotation(chartRotation))) {\n    return Position.Left;\n  }\n  return Position.Bottom;\n}\n\nfunction getXLinePath({ height }: Size, value: number): Line {\n  return {\n    x1: value,\n    y1: 0,\n    x2: value,\n    y2: height,\n  };\n}\n\nfunction getYLinePath({ width }: Size, value: number): Line {\n  return {\n    x1: 0,\n    y1: value,\n    x2: width,\n    y2: value,\n  };\n}\n\n/** @internal */\nexport function getMarkerPositionForXAnnotation(\n  { width, height }: Size,\n  rotation: Rotation,\n  position: Position,\n  value: number,\n  { width: mWidth, height: mHeight }: Size = { width: 0, height: 0 },\n): Pick<Dimensions, 'top' | 'left'> {\n  switch (position) {\n    case Position.Right:\n      return {\n        top: rotation === -90 ? height - value - mHeight / 2 : value - mHeight / 2,\n        left: width,\n      };\n    case Position.Left:\n      return {\n        top: rotation === -90 ? height - value - mHeight / 2 : value - mHeight / 2,\n        left: -mWidth,\n      };\n    case Position.Top:\n      return {\n        top: 0 - mHeight,\n        left: rotation === 180 ? width - value - mWidth / 2 : value - mWidth / 2,\n      };\n    case Position.Bottom:\n    default:\n      return {\n        top: height,\n        left: rotation === 180 ? width - value - mWidth / 2 : value - mWidth / 2,\n      };\n  }\n}\n\nfunction getMarkerPositionForYAnnotation(\n  { width, height }: Size,\n  rotation: Rotation,\n  position: Position,\n  value: number,\n  { width: mWidth, height: mHeight }: Size = { width: 0, height: 0 },\n): Pick<Dimensions, 'top' | 'left'> {\n  switch (position) {\n    case Position.Right:\n      return {\n        top: rotation === 180 ? height - value - mHeight / 2 : value - mHeight / 2,\n        left: width,\n      };\n    case Position.Left:\n      return {\n        top: rotation === 180 ? height - value - mHeight / 2 : value - mHeight / 2,\n        left: -mWidth,\n      };\n    case Position.Top:\n      return {\n        top: -mHeight,\n        left: rotation === 90 ? width - value - mWidth / 2 : value - mWidth / 2,\n      };\n    case Position.Bottom:\n    default:\n      return {\n        top: height,\n        left: rotation === 90 ? width - value - mWidth / 2 : value - mWidth / 2,\n      };\n  }\n}\n\n/**\n * @internal\n */\nexport function getAnnotationLinePropsId(\n  specId: string,\n  datum: LineAnnotationDatum,\n  index: number,\n  verticalValue?: any,\n  horizontalValue?: any,\n) {\n  return [specId, verticalValue, horizontalValue, datum.header, datum.details, index].join('__');\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnnotationRectProps } from './types';\nimport { getPanelSize, SmallMultipleScales } from '../../../../common/panel_utils';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { isBandScale, isContinuousScale } from '../../../../scales/types';\nimport { isDefined, isNil, Position, Rotation } from '../../../../utils/common';\nimport { AxisId, GroupId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { AxisStyle } from '../../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\nimport { isHorizontalRotation, isVerticalRotation } from '../../state/utils/common';\nimport { getAxesSpecForSpecId } from '../../state/utils/spec';\nimport { AxisSpec, RectAnnotationDatum, RectAnnotationSpec } from '../../utils/specs';\nimport { Bounds } from '../types';\n\n/** @internal */\nexport function isWithinRectBounds({ x, y }: Point, { startX, endX, startY, endY }: Bounds): boolean {\n  const withinXBounds = x >= startX && x <= endX;\n  const withinYBounds = y >= startY && y <= endY;\n\n  return withinXBounds && withinYBounds;\n}\n\n/** @internal */\nexport function computeRectAnnotationDimensions(\n  annotationSpec: RectAnnotationSpec,\n  yScales: Map<GroupId, ScaleContinuous>,\n  xScale: ScaleBand | ScaleContinuous,\n  axesSpecs: AxisSpec[],\n  smallMultiplesScales: SmallMultipleScales,\n  chartRotation: Rotation,\n  getAxisStyle: (id?: AxisId) => AxisStyle,\n  isHistogram: boolean = false,\n): AnnotationRectProps[] | null {\n  const { dataValues, groupId, outside, id: annotationSpecId } = annotationSpec;\n  const { xAxis, yAxis } = getAxesSpecForSpecId(axesSpecs, groupId);\n  const yScale = yScales.get(groupId);\n  const rectsProps: Omit<AnnotationRectProps, 'id' | 'panel'>[] = [];\n  const panelSize = getPanelSize(smallMultiplesScales);\n\n  dataValues.forEach((datum: RectAnnotationDatum) => {\n    const { x0: initialX0, x1: initialX1, y0: initialY0, y1: initialY1 } = datum.coordinates;\n\n    // if everything is null, return; otherwise we coerce the other coordinates\n    if (initialX0 === null && initialX1 === null && initialY0 === null && initialY1 === null) {\n      return;\n    }\n    let height: number | undefined;\n\n    const [x0, x1] = limitValueToDomainRange(xScale, initialX0, initialX1, isHistogram);\n    // something is wrong with the data types, don't draw this annotation\n    if (x0 === null || x1 === null) {\n      return;\n    }\n\n    let xAndWidth: { x: number; width: number } | null = null;\n\n    if (isBandScale(xScale)) {\n      xAndWidth = scaleXonBandScale(xScale, x0, x1);\n    } else if (isContinuousScale(xScale)) {\n      xAndWidth = scaleXonContinuousScale(xScale, x0, x1, isHistogram);\n    }\n    // something is wrong with scales, don't draw\n    if (!xAndWidth) {\n      return;\n    }\n\n    if (!yScale) {\n      if (!isDefined(initialY0) && !isDefined(initialY1)) {\n        const isLeftSide =\n          (chartRotation === 0 && xAxis?.position === Position.Bottom) ||\n          (chartRotation === 180 && xAxis?.position === Position.Top) ||\n          (chartRotation === -90 && yAxis?.position === Position.Right) ||\n          (chartRotation === 90 && yAxis?.position === Position.Left);\n        const orthoDimension = isHorizontalRotation(chartRotation) ? panelSize.height : panelSize.width;\n        const outsideDim = annotationSpec.outsideDimension ?? getOutsideDimension(getAxisStyle(xAxis?.id ?? yAxis?.id));\n        const rectDimensions = {\n          ...xAndWidth,\n          ...(outside\n            ? {\n                y: isLeftSide ? orthoDimension : -outsideDim,\n                height: outsideDim,\n              }\n            : {\n                y: 0,\n                height: orthoDimension,\n              }),\n        };\n        rectsProps.push({\n          specId: annotationSpecId,\n          rect: rectDimensions,\n          datum,\n        });\n      }\n      return;\n    }\n\n    const [y0, y1] = limitValueToDomainRange(yScale, initialY0, initialY1);\n    // something is wrong with the data types, don't draw this annotation\n    if (!Number.isFinite(y0) || !Number.isFinite(y1)) return;\n\n    let scaledY1 = yScale.pureScale(y1);\n    const scaledY0 = yScale.pureScale(y0);\n    if (Number.isNaN(scaledY1) || Number.isNaN(scaledY0)) return;\n\n    height = Math.abs(scaledY0 - scaledY1);\n    // if the annotation height is 0 override it with the height from chart dimension and if the values in the domain are the same\n    if (height === 0 && yScale.domain.length === 2 && yScale.domain[0] === yScale.domain[1]) {\n      // eslint-disable-next-line prefer-destructuring\n      height = panelSize.height;\n      scaledY1 = 0;\n    }\n\n    const orthoDimension = isVerticalRotation(chartRotation) ? panelSize.height : panelSize.width;\n    const isLeftSide =\n      (chartRotation === 0 && yAxis?.position === Position.Left) ||\n      (chartRotation === 180 && yAxis?.position === Position.Right) ||\n      (chartRotation === -90 && xAxis?.position === Position.Bottom) ||\n      (chartRotation === 90 && xAxis?.position === Position.Top);\n    const outsideDim = annotationSpec.outsideDimension ?? getOutsideDimension(getAxisStyle(xAxis?.id ?? yAxis?.id));\n    const rectDimensions = {\n      ...(!isDefined(initialX0) && !isDefined(initialX1) && outside\n        ? {\n            x: isLeftSide ? -outsideDim : orthoDimension,\n            width: outsideDim,\n          }\n        : xAndWidth),\n      y: scaledY1,\n      height,\n    };\n\n    rectsProps.push({\n      specId: annotationSpecId,\n      rect: rectDimensions,\n      datum,\n    });\n  });\n\n  return rectsProps.reduce<AnnotationRectProps[]>((acc, props, i) => {\n    const duplicated: AnnotationRectProps[] = [];\n    smallMultiplesScales.vertical.domain.forEach((vDomainValue) => {\n      smallMultiplesScales.horizontal.domain.forEach((hDomainValue) => {\n        const id = getAnnotationRectPropsId(annotationSpecId, props.datum, i, vDomainValue, hDomainValue);\n        const top = smallMultiplesScales.vertical.scale(vDomainValue);\n        const left = smallMultiplesScales.horizontal.scale(hDomainValue);\n        if (Number.isNaN(top + left)) return;\n        const panel = { ...panelSize, top, left };\n        duplicated.push({ ...props, panel, id });\n      });\n    });\n    return [...acc, ...duplicated];\n  }, []);\n}\n\nfunction scaleXonBandScale(\n  xScale: ScaleBand,\n  x0: string | number,\n  x1: string | number,\n): { x: number; width: number } | null {\n  // the band scale return the start of the band, we need to cover\n  // also the inner padding of the bar\n  const padding = (xScale.step - xScale.originalBandwidth) / 2;\n  let scaledX1 = xScale.scale(x1);\n  let scaledX0 = xScale.scale(x0);\n  if (Number.isNaN(scaledX1 + scaledX0)) {\n    return null;\n  }\n  // extend the x1 scaled value to fully cover the last bar\n  scaledX1 += xScale.originalBandwidth + padding;\n  // give the x1 value a maximum of the chart range\n  if (scaledX1 > xScale.range[1]) {\n    scaledX1 = xScale.range[1];\n  }\n\n  scaledX0 -= padding;\n  if (scaledX0 < xScale.range[0]) {\n    scaledX0 = xScale.range[0];\n  }\n  const width = Math.abs(scaledX1 - scaledX0);\n  return {\n    x: scaledX0,\n    width,\n  };\n}\n\nfunction scaleXonContinuousScale(\n  xScale: ScaleContinuous,\n  x0: PrimitiveValue,\n  x1: PrimitiveValue,\n  isHistogramModeEnabled: boolean = false,\n): { x: number; width: number } | null {\n  if (typeof x1 !== 'number' || typeof x0 !== 'number') {\n    return null;\n  }\n  const scaledX0 = xScale.scale(x0);\n  const scaledX1 =\n    xScale.totalBarsInCluster > 0 && !isHistogramModeEnabled ? xScale.scale(x1 + xScale.minInterval) : xScale.scale(x1);\n  // the width needs to be computed before adjusting the x anchor\n  const width = Math.abs(scaledX1 - scaledX0);\n  return Number.isNaN(width)\n    ? null\n    : { width, x: scaledX0 - (xScale.bandwidthPadding / 2) * xScale.totalBarsInCluster };\n}\n\n/**\n * This function extend and limits the values in a scale domain\n * @param scale the scale\n * @param minValue a min value\n * @param maxValue a max value\n * @param isHistogram\n */\nfunction limitValueToDomainRange(\n  scale: ScaleBand | ScaleContinuous,\n  minValue?: PrimitiveValue,\n  maxValue?: PrimitiveValue,\n  isHistogram = false,\n): [PrimitiveValue, PrimitiveValue] {\n  if (isContinuousScale(scale)) {\n    const [domainStartValue, domainEndValue] = scale.domain;\n    const min = maxOf(domainStartValue, minValue);\n    const max = minOf(isHistogram ? domainEndValue + scale.minInterval : domainEndValue, maxValue);\n    // extend to edge values if values are null/undefined\n    return min !== null && max !== null && min > max ? [null, null] : [min, max];\n  } else {\n    const min = isNil(minValue) || !scale.domain.includes(minValue) ? scale.domain[0] : minValue;\n    const max = isNil(maxValue) || !scale.domain.includes(maxValue) ? scale.domain.at(-1) : maxValue;\n    return [min ?? null, max ?? null];\n  }\n}\n\nfunction minOf(base: number, value?: number | string | null | undefined): number | string {\n  return typeof value === 'number' ? Math.min(value, base) : typeof value === 'string' ? value : base;\n}\n\nfunction maxOf(base: number, value: number | string | null | undefined): number | string {\n  return typeof value === 'number' ? Math.max(value, base) : typeof value === 'string' ? value : base;\n}\n\nfunction getOutsideDimension({ tickLine: { visible, size } }: AxisStyle): number {\n  return visible ? size : 0;\n}\n\n/**\n * @internal\n */\nexport function getAnnotationRectPropsId(\n  specId: string,\n  datum: RectAnnotationDatum,\n  index: number,\n  verticalValue: number | string,\n  horizontalValue: number | string,\n) {\n  return [specId, verticalValue, horizontalValue, ...Object.values(datum.coordinates), datum.details, index].join('__');\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isWithinRectBounds } from './dimensions';\nimport { AnnotationRectProps } from './types';\nimport { Rect } from '../../../../geoms/types';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { SpecId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { isHorizontalRotation } from '../../state/utils/common';\nimport { AnnotationType } from '../../utils/specs';\nimport { AnnotationTooltipState, Bounds } from '../types';\n\n/** @internal */\nexport function getRectAnnotationTooltipState(\n  cursorPosition: Point,\n  annotationRects: AnnotationRectProps[],\n  rotation: Rotation,\n  chartDimensions: Dimensions,\n  specId: SpecId,\n): AnnotationTooltipState | null {\n  for (const annotationRect of annotationRects) {\n    const { rect, panel, datum, id } = annotationRect;\n    const newRect = transformRotateRect(rect, rotation, panel);\n    const startX = newRect.x + chartDimensions.left + panel.left;\n    const endX = startX + newRect.width;\n    const startY = newRect.y + chartDimensions.top + panel.top;\n    const endY = startY + newRect.height;\n    const bounds: Bounds = { startX, endX, startY, endY };\n    const isWithinBounds = isWithinRectBounds(cursorPosition, bounds);\n\n    if (isWithinBounds) {\n      return {\n        id, // annotation id\n        specId,\n        isVisible: true,\n        annotationType: AnnotationType.Rectangle,\n        anchor: {\n          x: cursorPosition.x,\n          y: cursorPosition.y,\n          width: 0,\n          height: 0,\n        },\n        datum,\n      };\n    }\n  }\n\n  return null;\n}\n\nfunction transformRotateRect(rect: Rect, rotation: Rotation, dim: Dimensions): Rect {\n  const isHorizontalRotated = isHorizontalRotation(rotation);\n  const width = isHorizontalRotated ? dim.width : dim.height;\n  const height = isHorizontalRotated ? dim.height : dim.width;\n\n  switch (rotation) {\n    case 90:\n      return {\n        x: height - rect.height - rect.y,\n        y: rect.x,\n        width: rect.height,\n        height: rect.width,\n      };\n    case -90:\n      return {\n        x: rect.y,\n        y: width - rect.x - rect.width,\n        width: rect.height,\n        height: rect.width,\n      };\n    case 180:\n      return {\n        x: width - rect.x - rect.width,\n        y: height - rect.y - rect.height,\n        width: rect.width,\n        height: rect.height,\n      };\n    case 0:\n    default:\n      return rect;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getRectAnnotationTooltipState } from './rect/tooltip';\nimport { AnnotationRectProps } from './rect/types';\nimport { AnnotationDimensions, AnnotationTooltipState } from './types';\nimport { TooltipPortalSettings } from '../../../components/portal';\nimport { Rotation } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { AnnotationId } from '../../../utils/ids';\nimport { Point } from '../../../utils/point';\nimport { AnnotationSpec, isRectAnnotation } from '../utils/specs';\n\n/** @internal */\nexport function computeRectAnnotationTooltipState(\n  cursorPosition: Point,\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  annotationSpecs: AnnotationSpec[],\n  chartRotation: Rotation,\n  chartDimensions: Dimensions,\n): AnnotationTooltipState | null {\n  // allow picking up the last spec added as the top most or use its zIndex value\n  const sortedAnnotationSpecs = annotationSpecs\n    .filter(isRectAnnotation)\n    .sort(({ zIndex: a = Number.MIN_SAFE_INTEGER }, { zIndex: b = Number.MIN_SAFE_INTEGER }) => a - b);\n\n  for (let i = 0; i < sortedAnnotationSpecs.length; i++) {\n    const spec = sortedAnnotationSpecs[i];\n    const annotationDimension = spec?.id && annotationDimensions.get(spec.id);\n    if (!spec || spec.hideTooltips || !annotationDimension) {\n      continue;\n    }\n    const { customTooltip, customTooltipDetails } = spec;\n\n    const tooltipSettings = getTooltipSettings(spec);\n\n    const rectAnnotationTooltipState = getRectAnnotationTooltipState(\n      cursorPosition,\n      annotationDimension as AnnotationRectProps[],\n      chartRotation,\n      chartDimensions,\n      spec.id,\n    );\n\n    if (rectAnnotationTooltipState) {\n      return {\n        ...rectAnnotationTooltipState,\n        tooltipSettings,\n        customTooltip,\n        customTooltipDetails,\n      };\n    }\n  }\n\n  return null;\n}\n\n/** @internal */\nexport function computeMultipleRectAnnotationTooltipState(\n  cursorPosition: Point,\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  annotationSpecs: AnnotationSpec[],\n  chartRotation: Rotation,\n  chartDimensions: Dimensions,\n): AnnotationTooltipState[] {\n  // allow picking up the last spec added as the top most or use its zIndex value\n  const sortedAnnotationSpecs = annotationSpecs\n    .filter(isRectAnnotation)\n    .sort(({ zIndex: a = Number.MIN_SAFE_INTEGER }, { zIndex: b = Number.MIN_SAFE_INTEGER }) => a - b);\n  return sortedAnnotationSpecs.reduce<AnnotationTooltipState[]>((acc, spec) => {\n    const annotationDimension = annotationDimensions.get(spec.id);\n    if (!spec.hideTooltips && annotationDimension) {\n      const { customTooltip, customTooltipDetails } = spec;\n\n      const tooltipSettings = getTooltipSettings(spec);\n\n      const rectAnnotationTooltipState = getRectAnnotationTooltipState(\n        cursorPosition,\n        annotationDimension as AnnotationRectProps[],\n        chartRotation,\n        chartDimensions,\n        spec.id,\n      );\n      if (rectAnnotationTooltipState) {\n        acc.push({\n          ...rectAnnotationTooltipState,\n          tooltipSettings,\n          customTooltip,\n          customTooltipDetails,\n        });\n      }\n    }\n    return acc;\n  }, [] as AnnotationTooltipState[]);\n}\n\nfunction getTooltipSettings({\n  placement,\n  fallbackPlacements,\n  boundary,\n  offset,\n}: AnnotationSpec): TooltipPortalSettings<'chart'> {\n  return {\n    placement,\n    fallbackPlacements,\n    boundary,\n    offset,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentType, ReactNode } from 'react';\n\nimport { AnnotationLineProps } from './line/types';\nimport { AnnotationRectProps } from './rect/types';\nimport { Color } from '../../../common/colors';\nimport { TooltipPortalSettings } from '../../../components/portal';\nimport { Position } from '../../../utils/common';\nimport { AnnotationId, SpecId } from '../../../utils/ids';\nimport { AnnotationType, LineAnnotationDatum, RectAnnotationDatum } from '../utils/specs';\n\n/** @public */\nexport type AnnotationTooltipFormatter = ComponentType<{ details?: string }>;\n\n/** @public */\nexport type CustomAnnotationTooltip = ComponentType<{\n  header?: string;\n  details?: string;\n  datum: LineAnnotationDatum | RectAnnotationDatum;\n}> | null;\n\n/**\n * The header and description strings for an Annotation\n * @internal\n */\nexport interface AnnotationDetails {\n  headerText?: string;\n  detailsText?: string;\n}\n\n/**\n * Component to render based on annotation datum\n *\n * @public\n */\nexport type ComponentWithAnnotationDatum<D = any> = ComponentType<LineAnnotationDatum<D>>;\n\n/**\n * The marker for an Annotation. Usually a JSX element\n * @internal\n */\nexport interface AnnotationMarker {\n  icon?: ReactNode | ComponentWithAnnotationDatum;\n  position: {\n    top: number;\n    left: number;\n  };\n  dimension?: {\n    width: number;\n    height: number;\n  };\n  body?: ReactNode | ComponentWithAnnotationDatum;\n  alignment: Position;\n  color: Color;\n}\n\n/** @internal */\nexport interface AnnotationTooltipState {\n  id: AnnotationId;\n  specId: SpecId;\n  isVisible: true;\n  annotationType: AnnotationType;\n  datum: LineAnnotationDatum | RectAnnotationDatum;\n  anchor: {\n    x: number;\n    y: number;\n    width: number;\n    height: number;\n  };\n  customTooltipDetails?: AnnotationTooltipFormatter;\n  customTooltip?: CustomAnnotationTooltip;\n  tooltipSettings?: TooltipPortalSettings<'chart'>;\n}\n\n/** @internal */\nexport type AnnotationDimensions = Array<AnnotationLineProps | AnnotationRectProps>;\n\n/** @internal */\nexport type Bounds = {\n  startX: number;\n  endX: number;\n  startY: number;\n  endY: number;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLineAnnotationDimensions } from './line/dimensions';\nimport { computeRectAnnotationDimensions } from './rect/dimensions';\nimport { AnnotationDimensions } from './types';\nimport { SmallMultipleScales } from '../../../common/panel_utils';\nimport { SettingsSpec } from '../../../specs';\nimport { Rotation, Position } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { AnnotationId, AxisId, GroupId } from '../../../utils/ids';\nimport { Point } from '../../../utils/point';\nimport { AxisStyle } from '../../../utils/themes/theme';\nimport { getAxesSpecForSpecId } from '../state/utils/spec';\nimport { ComputedGeometries } from '../state/utils/types';\nimport { AnnotationDomainType, AnnotationSpec, AxisSpec, isLineAnnotation } from '../utils/specs';\n\n/** @internal */\nexport function getAnnotationAxis(\n  axesSpecs: AxisSpec[],\n  groupId: GroupId,\n  domainType: AnnotationDomainType,\n  chartRotation: Rotation,\n): Position | undefined {\n  const { xAxis, yAxis } = getAxesSpecForSpecId(axesSpecs, groupId, chartRotation);\n  const isXDomainAnnotation = isXDomain(domainType);\n  return isXDomainAnnotation ? xAxis?.position : yAxis?.position;\n}\n\n/** @internal */\nexport function isXDomain(domainType: AnnotationDomainType): boolean {\n  return domainType === AnnotationDomainType.XDomain;\n}\n\n/** @internal */\nexport function getTransformedCursor(\n  cursorPosition: Point,\n  chartDimensions: Dimensions,\n  chartRotation: Rotation | null,\n  /**\n   * getTransformedCursor to account for projected cursor position relative to chart dimensions\n   */\n  projectArea = false,\n): Point {\n  const { height, width, left, top } = chartDimensions;\n  let { x, y } = cursorPosition;\n\n  if (projectArea) {\n    x = cursorPosition.x - left;\n    y = cursorPosition.y - top;\n  }\n\n  if (chartRotation === null) {\n    return { x, y };\n  }\n\n  switch (chartRotation) {\n    case 90:\n      return { x: y, y: width - x };\n    case -90:\n      return { x: height - y, y: x };\n    case 180:\n      return { x: width - x, y: height - y };\n    case 0:\n    default:\n      return { x, y };\n  }\n}\n\n/** @internal */\nexport function invertTransformedCursor(\n  cursorPosition: Point,\n  chartDimensions: Dimensions,\n  chartRotation: Rotation | null,\n  /**\n   * Used to account for projected cursor position relative to chart dimensions\n   */\n  projectArea = false,\n): Point {\n  const { height, width, left, top } = chartDimensions;\n  let { x, y } = cursorPosition;\n\n  switch (chartRotation) {\n    case 0:\n    case null:\n      break;\n    case 90:\n      x = width - cursorPosition.y;\n      y = cursorPosition.x;\n      break;\n    case -90:\n      y = height - cursorPosition.x;\n      x = cursorPosition.y;\n      break;\n    case 180:\n    default:\n      y = height - cursorPosition.y;\n      x = width - cursorPosition.x;\n  }\n\n  if (projectArea) {\n    x += left;\n    y += top;\n  }\n\n  return { x, y };\n}\n\n/** @internal */\nexport function computeAnnotationDimensions(\n  annotations: AnnotationSpec[],\n  { rotation: chartRotation }: Pick<SettingsSpec, 'rotation'>,\n  { scales: { xScale, yScales } }: Pick<ComputedGeometries, 'scales'>,\n  axesSpecs: AxisSpec[],\n  isHistogramModeEnabled: boolean,\n  smallMultipleScales: SmallMultipleScales,\n  getAxisStyle: (id?: AxisId) => AxisStyle,\n): Map<AnnotationId, AnnotationDimensions> {\n  return annotations.reduce<Map<AnnotationId, AnnotationDimensions>>((annotationDimensions, annotationSpec) => {\n    const { id } = annotationSpec;\n\n    if (isLineAnnotation(annotationSpec)) {\n      const { groupId, domainType } = annotationSpec;\n      const annotationAxisPosition = getAnnotationAxis(axesSpecs, groupId, domainType, chartRotation);\n\n      const dimensions = computeLineAnnotationDimensions(\n        annotationSpec,\n        chartRotation,\n        yScales,\n        xScale,\n        smallMultipleScales,\n        isHistogramModeEnabled,\n        annotationAxisPosition,\n      );\n      if (dimensions) {\n        annotationDimensions.set(id, dimensions);\n      }\n      return annotationDimensions;\n    } else {\n      const dimensions = computeRectAnnotationDimensions(\n        annotationSpec,\n        yScales,\n        xScale,\n        axesSpecs,\n        smallMultipleScales,\n        chartRotation,\n        getAxisStyle,\n        isHistogramModeEnabled,\n      );\n\n      if (dimensions) {\n        annotationDimensions.set(id, dimensions);\n      }\n      return annotationDimensions;\n    }\n  }, new Map());\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SmallMultiplesSpec } from '../../../specs';\nimport { Position } from '../../../utils/common';\nimport { innerPad, outerPad, PerSideDistance } from '../../../utils/dimensions';\nimport { AxisId } from '../../../utils/ids';\nimport { AxisStyle, Theme } from '../../../utils/themes/theme';\nimport { AxesTicksDimensions } from '../state/selectors/compute_axis_ticks_dimensions';\nimport { getSpecsById } from '../state/utils/spec';\nimport { isHorizontalAxis, isVerticalAxis } from '../utils/axis_type_utils';\nimport { getAllAxisLayersGirth, getTitleDimension, shouldShowTicks, TickLabelBounds } from '../utils/axis_utils';\nimport { AxisSpec } from '../utils/specs';\n\nconst getAxisSizeForLabel = (\n  axisSpec: AxisSpec,\n  { axes: sharedAxesStyles, chartMargins }: Theme,\n  axesStyles: Map<AxisId, AxisStyle | null>,\n  { maxLabelBboxWidth = 0, maxLabelBboxHeight = 0 }: TickLabelBounds,\n  smSpec: SmallMultiplesSpec | null,\n) => {\n  const { tickLine, axisTitle, axisPanelTitle, tickLabel } = axesStyles.get(axisSpec.id) ?? sharedAxesStyles;\n  const horizontal = isHorizontalAxis(axisSpec.position);\n  const maxLabelBoxGirth = horizontal ? maxLabelBboxHeight : maxLabelBboxWidth;\n  const allLayersGirth = getAllAxisLayersGirth(axisSpec.timeAxisLayerCount, maxLabelBoxGirth, horizontal);\n  const hasPanelTitle = isVerticalAxis(axisSpec.position) ? smSpec?.splitVertically : smSpec?.splitHorizontally;\n  const panelTitleDimension = hasPanelTitle ? getTitleDimension(axisPanelTitle) : 0;\n  const titleDimension = axisSpec.title ? getTitleDimension(axisTitle) : 0;\n  const tickDimension = shouldShowTicks(tickLine, axisSpec.hide) ? tickLine.size + tickLine.padding : 0;\n  const labelPaddingSum = tickLabel.visible ? innerPad(tickLabel.padding) + outerPad(tickLabel.padding) : 0;\n  const axisDimension = labelPaddingSum + tickDimension + titleDimension + panelTitleDimension;\n  const maxAxisGirth = axisDimension + (tickLabel.visible ? allLayersGirth : 0);\n  // gives space to longer labels: if vertical use half of the label height, if horizontal, use half of the max label (not ideal)\n  // don't overflow when the multiTimeAxis layer is used.\n  const maxLabelBoxHalfLength = isVerticalAxis(axisSpec.position)\n    ? maxLabelBboxHeight / 2\n    : axisSpec.timeAxisLayerCount > 0\n      ? 0\n      : maxLabelBboxWidth / 2;\n  return horizontal\n    ? {\n        top: axisSpec.position === Position.Top ? maxAxisGirth + chartMargins.top : 0,\n        bottom: axisSpec.position === Position.Bottom ? maxAxisGirth + chartMargins.bottom : 0,\n        left: maxLabelBoxHalfLength,\n        right: maxLabelBoxHalfLength,\n      }\n    : {\n        top: maxLabelBoxHalfLength,\n        bottom: maxLabelBoxHalfLength,\n        left: axisSpec.position === Position.Left ? maxAxisGirth + chartMargins.left : 0,\n        right: axisSpec.position === Position.Right ? maxAxisGirth + chartMargins.right : 0,\n      };\n};\n\n/** @internal */\nexport function getAxesDimensions(\n  theme: Theme,\n  axisDimensions: AxesTicksDimensions,\n  axesStyles: Map<AxisId, AxisStyle | null>,\n  axisSpecs: AxisSpec[],\n  smSpec: SmallMultiplesSpec | null,\n): PerSideDistance & { margin: { left: number } } {\n  const sizes = [...axisDimensions].reduce(\n    (acc, [id, tickLabelBounds]) => {\n      const axisSpec = getSpecsById<AxisSpec>(axisSpecs, id);\n      if (tickLabelBounds.isHidden || !axisSpec) return acc;\n      // TODO use first and last labels\n      const { top, bottom, left, right } = getAxisSizeForLabel(axisSpec, theme, axesStyles, tickLabelBounds, smSpec);\n      if (isVerticalAxis(axisSpec.position)) {\n        acc.axisLabelOverflow.top = Math.max(acc.axisLabelOverflow.top, top);\n        acc.axisLabelOverflow.bottom = Math.max(acc.axisLabelOverflow.bottom, bottom);\n        acc.axisMainSize.left += left;\n        acc.axisMainSize.right += right;\n      } else {\n        // find the max half label size to accommodate the left/right labels\n        acc.axisMainSize.top += top;\n        acc.axisMainSize.bottom += bottom;\n        acc.axisLabelOverflow.left = Math.max(acc.axisLabelOverflow.left, left);\n        acc.axisLabelOverflow.right = Math.max(acc.axisLabelOverflow.right, right);\n      }\n      return acc;\n    },\n    {\n      axisMainSize: { left: 0, right: 0, top: 0, bottom: 0 },\n      axisLabelOverflow: { left: 0, right: 0, top: 0, bottom: 0 },\n    },\n  );\n\n  const left = Math.max(sizes.axisLabelOverflow.left + theme.chartMargins.left, sizes.axisMainSize.left);\n  const right = Math.max(sizes.axisLabelOverflow.right + theme.chartMargins.right, sizes.axisMainSize.right);\n  const top = Math.max(sizes.axisLabelOverflow.top + theme.chartMargins.top, sizes.axisMainSize.top);\n  const bottom = Math.max(sizes.axisLabelOverflow.bottom + theme.chartMargins.bottom, sizes.axisMainSize.bottom);\n  return { left, right, top, bottom, margin: { left: left - sizes.axisMainSize.left } };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { addTime, propsFromCalendarObj, CalendarUnit } from './chrono';\n\nconst timeProps = ['epochSeconds', 'dayOfWeek'];\n\n/** @internal */\nexport const timeProp = Object.fromEntries(timeProps.map((propName, i) => [propName, i]));\n\n/** @public */\nexport const TimeProp = Object.freeze({\n  EpochSeconds: 0 as const,\n  DayOfWeek: 1 as const,\n});\n/** @public */\nexport type TimeProp = $Values<typeof TimeProp>;\n\nconst zonedDateTimeFromCache: Record<string, [number, number]> = {}; // without caching, even luxon is choppy with zoom and pan\n\ninterface TemporalArgs {\n  timeZone: string;\n  year: number;\n  month: number;\n  day: number;\n  hour?: number;\n  minute?: number;\n  second?: number;\n}\n\n/** @internal */\nexport const cachedZonedDateTimeFrom = (temporalArgs: TemporalArgs) => {\n  const { timeZone, year, month, day, hour = 0 } = temporalArgs;\n  const key = `_${year}_${month}_${day}_${hour}_${timeZone}`;\n  const cachedValue = zonedDateTimeFromCache[key];\n  if (cachedValue) {\n    return cachedValue;\n  }\n  const result = propsFromCalendarObj({ year, month, day, hour }, timeZone);\n  zonedDateTimeFromCache[key] = result;\n  return result;\n};\n\nconst deltaTimeCache: Record<string, number> = {}; // without caching, even luxon is choppy with zoom and pan\n\n/** @internal */\nexport const cachedTimeDelta = (temporalArgs: TemporalArgs, unit: CalendarUnit, count: number) => {\n  const { timeZone, year, month, day } = temporalArgs;\n  const key = `_${year}_${month}_${day}_${timeZone}_${count}_${unit}`;\n  const cachedValue = deltaTimeCache[key];\n  if (cachedValue) {\n    return cachedValue;\n  }\n  const result = addTime({ year, month, day }, timeZone, unit, count);\n  deltaTimeCache[key] = result;\n  return result;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  addTimeToObj,\n  CalendarObject,\n  timeObjFromCalendarObj,\n  timeObjFromEpochSeconds,\n  timeObjToSeconds,\n  timeObjToWeekday,\n  timeObjToYear,\n} from './chrono_luxon/chrono_luxon';\n//from './chrono-moment/chrono-moment'\n//from './chrono-proposal-temporal/chrono-proposal-temporal'\n\n/** @internal */\nexport type CalendarUnit = 'days'; // luxon has a lot of others but we don't use them here\n\n/**\n * library independent part\n * @internal\n */\nexport const propsFromCalendarObj = (calendarObj: CalendarObject, timeZone: string): [number, number] => {\n  const t = timeObjFromCalendarObj(calendarObj, timeZone);\n  return [timeObjToSeconds(t), timeObjToWeekday(t)];\n};\n\n/** @internal */\nexport const epochInSecondsToYear = (timeZone: string, seconds: number) =>\n  timeObjToYear(timeObjFromEpochSeconds(timeZone, seconds));\n\n/** @internal */\nexport const epochDaysInMonth = (timeZone: string, seconds: number) =>\n  timeObjFromEpochSeconds(timeZone, seconds).daysInMonth;\n\n/** @internal */\nexport const addTime = (calendarObj: CalendarObject, timeZone: string, unit: CalendarUnit, count: number) =>\n  timeObjToSeconds(addTimeToObj(timeObjFromCalendarObj(calendarObj, timeZone), unit, count));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport { DateTime } from 'luxon';\n\n/** @internal */\nexport interface CalendarObject {\n  year: number;\n  month: number;\n  day: number;\n  hour?: number;\n}\n\ntype CalendarUnit = 'days'; // luxon has a lot of others but we don't use them here\n\n/** @internal */\nexport const timeObjFromCalendarObj = (yearMonthDayHour: CalendarObject, timeZone: string) =>\n  DateTime.fromObject({ ...yearMonthDayHour, zone: timeZone });\n/** @internal */\nexport const timeObjFromEpochSeconds = (timeZone: string, seconds: number) =>\n  DateTime.fromSeconds(seconds, { zone: timeZone });\n/** @internal */\nexport const timeObjToSeconds = (t: DateTime) => t.toSeconds();\n/** @internal */\nexport const timeObjToWeekday = (t: DateTime) => t.weekday;\n/** @internal */\nexport const timeObjToYear = (t: DateTime) => t.year;\n/** @internal */\nexport const addTimeToObj = (obj: DateTime, unit: CalendarUnit, count: number) => obj.plus({ [unit]: count });\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* eslint-disable-next-line eslint-comments/disable-enable-pair */\n/* eslint-disable @typescript-eslint/unbound-method */\n\nimport { cachedTimeDelta, cachedZonedDateTimeFrom, TimeProp } from './chrono/cached_chrono';\nimport { epochDaysInMonth, epochInSecondsToYear } from './chrono/chrono';\n\n/** @public */\nexport type BinUnit = 'year' | 'month' | 'week' | 'day' | 'hour' | 'minute' | 'second' | 'millisecond' | 'one';\n\n// utils\n/** @public */\nexport const unitIntervalWidth: Record<BinUnit, number> = {\n  year: 365.25 * 24 * 60 * 60,\n  month: (365.25 * 24 * 60 * 60) / 12,\n  week: 7 * 24 * 60 * 60,\n  day: 24 * 60 * 60,\n  hour: 60 * 60,\n  minute: 60,\n  second: 1, // for time, one second is the unit\n  millisecond: 0.001,\n  one: 1,\n};\n\n/**\n * Left closed, right open interval on (connected subset of) on a partially ordered set\n * Poset covers real numbers, integers, time, ordinals incl. ordered categories, trees, DAGs\n * Valid but useless for fully unordered categorical (nominal) values.\n * It's simply called Interval because we don't currently model other interval types eg. closed.\n * @public\n */\nexport interface Interval {\n  /**\n   * Lower bound of interval (included)\n   */\n  minimum: number;\n  /**\n   * Upper bound of interval (excluded)\n   */\n  supremum: number;\n  /**\n   * Upper bound of interval to stick text label\n   */\n  labelSupremum: number;\n}\n\ntype IntervalIterableMaker<T extends Interval> = (domainFrom: number, domainTo: number) => Iterable<T>;\n\ntype YearsAxisLayer = AxisLayer<Interval & { year: number }>;\n\n/** @internal */\nexport type NumberFormatter = (n: number) => string;\n\n/** @internal */\nexport type TimeFormatter = NumberFormatter & ReturnType<typeof Intl.DateTimeFormat>['format']; // numeric input to Intl.DateTimeFormat only\n\n/**\n * Partition of a connected subset of a totally ordered set into sub-intervals (ie. the sub-intervals are\n * gapless and overlap-free, covering a totally ordered set)\n * @internal\n */\n\nexport interface AxisLayer<T extends Interval> {\n  unit: BinUnit;\n  unitMultiplier: number;\n  labeled: boolean;\n  minimumTickPixelDistance: number;\n  intervals: IntervalIterableMaker<T>;\n  detailedLabelFormat: TimeFormatter;\n  minorTickLabelFormat: TimeFormatter;\n}\n\n/** @internal */\nexport interface RasterConfig {\n  minimumTickPixelDistance: number;\n  locale: string;\n}\n\nconst millisecondIntervals = (rasterMs: number): IntervalIterableMaker<Interval> =>\n  function* (domainFrom, domainTo) {\n    for (let t = Math.floor((domainFrom * 1000) / rasterMs); t < Math.ceil((domainTo * 1000) / rasterMs); t++) {\n      const minimum = (t * rasterMs) / 1000;\n      const supremum = minimum + rasterMs / 1000;\n      yield {\n        minimum,\n        supremum,\n        labelSupremum: supremum,\n      };\n    }\n  };\n\nconst monthBasedIntervals = (\n  years: YearsAxisLayer,\n  timeZone: string,\n  unitMultiplier: number,\n): IntervalIterableMaker<Interval & { year: number; month: number; days: number }> =>\n  function* (domainFrom, domainTo) {\n    for (const { year } of years.intervals(domainFrom, domainTo)) {\n      for (let month = 1; month <= 12; month += unitMultiplier) {\n        const timePoint = cachedZonedDateTimeFrom({ timeZone, year, month, day: 1 });\n        const binStart = timePoint[TimeProp.EpochSeconds];\n        const binEnd = cachedZonedDateTimeFrom({\n          timeZone,\n          year: month <= 12 - unitMultiplier ? year : year + 1,\n          month: ((month + unitMultiplier - 1) % 12) + 1,\n          day: 1,\n        })[TimeProp.EpochSeconds];\n        const days = epochDaysInMonth(timeZone, binStart);\n        yield {\n          year,\n          month,\n          days,\n          minimum: binStart,\n          supremum: binEnd,\n          labelSupremum: binEnd,\n        };\n      }\n    }\n  };\n\ninterface YearToDay {\n  year: number;\n  month: number;\n  dayOfMonth: number;\n  dayOfWeek: number;\n}\n\ninterface YearToHour extends YearToDay {\n  hour: number;\n}\n\nconst hourCycle = 'h23';\n\nconst hourFormat: Partial<ConstructorParameters<typeof Intl.DateTimeFormat>[1]> = {\n  hour: '2-digit',\n  minute: '2-digit',\n  // this is mutual exclusive with `hour12` and\n  // fix the issue of rendering the time from midnight starting at 24:00 to 24:59 to 01:00\n  hourCycle,\n};\n\nconst englishOrdinalEndings = {\n  zero: 'th',\n  one: 'st',\n  two: 'nd',\n  few: 'rd',\n  many: 'th',\n  other: 'th',\n};\nconst englishPluralRules = new Intl.PluralRules('en-US', { type: 'ordinal' });\nconst englishOrdinalEnding = (signedNumber: number) => englishOrdinalEndings[englishPluralRules.select(signedNumber)];\n\n/** @internal */\nexport const continuousTimeRasters = ({ minimumTickPixelDistance, locale }: RasterConfig, timeZone: string) => {\n  const minorDayBaseFormat = new Intl.DateTimeFormat(locale, { day: 'numeric', timeZone }).format;\n  const minorDayFormat = (d: number) => {\n    const numberString = minorDayBaseFormat(d);\n    const number = Number.parseInt(numberString, 10);\n    return locale.substring(0, 2) === 'en' ? `${numberString}${englishOrdinalEnding(number)}` : numberString;\n  };\n  const detailedDayFormat = new Intl.DateTimeFormat(locale, {\n    year: 'numeric',\n    month: 'long',\n    day: 'numeric',\n    timeZone,\n  }).format;\n\n  const detailedHourFormatBase = new Intl.DateTimeFormat(locale, {\n    year: 'numeric',\n    month: 'long',\n    day: 'numeric',\n    ...hourFormat,\n    timeZone,\n  }).format;\n  const detailedHourFormat = (d: number) => `${detailedHourFormatBase(d)}h`;\n\n  const years: YearsAxisLayer = {\n    unit: 'year',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 1.5,\n    intervals: function* (domainFrom, domainTo) {\n      const fromYear = epochInSecondsToYear(timeZone, domainFrom);\n      const toYear = epochInSecondsToYear(timeZone, domainTo);\n      for (let year = fromYear; year <= toYear; year++) {\n        const timePoint = cachedZonedDateTimeFrom({ timeZone, year, month: 1, day: 1 });\n        const binStart = timePoint[TimeProp.EpochSeconds];\n        const binEnd = cachedZonedDateTimeFrom({\n          timeZone,\n          year: year + 1,\n          month: 1,\n          day: 1,\n        })[TimeProp.EpochSeconds];\n        yield {\n          year,\n          minimum: binStart,\n          supremum: binEnd,\n          labelSupremum: binEnd,\n        };\n      }\n    },\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', timeZone }).format,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', timeZone }).format,\n  };\n  const unlabeledGridMinimumPixelDistance = minimumTickPixelDistance / 1.618;\n  const yearsUnlabelled: YearsAxisLayer = {\n    ...years,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const decades: YearsAxisLayer = {\n    unit: 'year',\n    unitMultiplier: 10,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 1.5,\n    intervals: function* (domainFrom, domainTo) {\n      const fromYear = epochInSecondsToYear(timeZone, domainFrom);\n      const toYear = epochInSecondsToYear(timeZone, domainTo);\n      for (let year = Math.floor(fromYear / 10) * 10; year <= Math.ceil(toYear / 10) * 10; year += 10) {\n        const timePoint = cachedZonedDateTimeFrom({ timeZone, year, month: 1, day: 1 });\n        const binStart = timePoint[TimeProp.EpochSeconds];\n        const binEnd = cachedZonedDateTimeFrom({\n          timeZone,\n          year: year + 10,\n          month: 1,\n          day: 1,\n        })[TimeProp.EpochSeconds];\n        yield {\n          year,\n          minimum: binStart,\n          supremum: binEnd,\n          labelSupremum: binEnd,\n        };\n      }\n    },\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', timeZone }).format,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', timeZone }).format,\n  };\n  const decadesUnlabelled: YearsAxisLayer = {\n    ...decades,\n    labeled: false,\n    minimumTickPixelDistance: 1, // it should change if we ever add centuries and millennia\n  };\n  const months: AxisLayer<Interval & { year: number; month: number; days: number }> = {\n    unit: 'month',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 3.6, // wow some Greek names are long\n    intervals: monthBasedIntervals(years, timeZone, 1),\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'long', timeZone }).format,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, { month: 'long', timeZone }).format,\n  };\n  const shortMonths = {\n    ...months,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, { month: 'short', timeZone }).format,\n    minimumTickPixelDistance: minimumTickPixelDistance * 2,\n  };\n  const quarters: AxisLayer<Interval & { year: number; month: number }> = {\n    ...shortMonths,\n    unitMultiplier: 3,\n    intervals: monthBasedIntervals(years, timeZone, 3),\n  };\n  const quartersUnlabelled = {\n    ...quarters,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n    labeled: false,\n  };\n  const days: AxisLayer<Interval & YearToDay> = {\n    unit: 'day',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 1.5,\n    intervals: function* (domainFrom, domainTo) {\n      for (const { year, month } of months.intervals(domainFrom, domainTo)) {\n        for (let dayOfMonth = 1; dayOfMonth <= 31; dayOfMonth++) {\n          const temporalArgs = {\n            timeZone,\n            year,\n            month,\n            day: dayOfMonth,\n          };\n          const timePoint = cachedZonedDateTimeFrom(temporalArgs);\n          const dayOfWeek: number = timePoint[TimeProp.DayOfWeek];\n          const binStart = timePoint[TimeProp.EpochSeconds];\n          const binEnd = cachedTimeDelta(temporalArgs, 'days', 1);\n          if (Number.isFinite(binStart) && Number.isFinite(binEnd))\n            yield {\n              year,\n              month,\n              dayOfMonth,\n              dayOfWeek,\n              minimum: binStart,\n              supremum: binEnd,\n              labelSupremum: binEnd,\n            };\n        }\n      }\n    },\n    detailedLabelFormat: detailedDayFormat,\n    minorTickLabelFormat: minorDayFormat,\n  };\n  const weekStartDays: AxisLayer<Interval & { dayOfMonth: number }> = {\n    unit: 'week',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 1.5,\n    intervals: function* (domainFrom, domainTo) {\n      for (const { year, month, days: daysInMonth } of months.intervals(domainFrom, domainTo)) {\n        for (let dayOfMonth = 1; dayOfMonth <= 31; dayOfMonth++) {\n          const temporalArgs = { timeZone, year, month, day: dayOfMonth };\n          const timePoint = cachedZonedDateTimeFrom(temporalArgs);\n          const dayOfWeek = timePoint[TimeProp.DayOfWeek];\n          if (dayOfWeek !== 1) continue;\n          const binStart = timePoint[TimeProp.EpochSeconds];\n          if (Number.isFinite(binStart)) {\n            const daysFromEnd = daysInMonth - dayOfMonth + 1;\n            const supremum = cachedTimeDelta(temporalArgs, 'days', 7);\n\n            yield {\n              dayOfMonth,\n              minimum: binStart,\n              supremum,\n              labelSupremum: daysFromEnd < 7 ? cachedTimeDelta(temporalArgs, 'days', daysFromEnd) : supremum,\n            };\n          }\n        }\n      }\n    },\n    minorTickLabelFormat: minorDayFormat,\n    detailedLabelFormat: detailedDayFormat,\n  };\n  const daysUnlabelled: AxisLayer<Interval & YearToDay> = {\n    ...days,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const weeksUnlabelled: AxisLayer<Interval & { dayOfMonth: number }> = {\n    ...weekStartDays,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const monthsUnlabelled = {\n    ...months,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const hhMmDistanceMultiplier = 1.8;\n  const hhMmSsDistanceMultiplier = 2.5;\n  const hours: AxisLayer<Interval> = {\n    unit: 'hour',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: hhMmDistanceMultiplier * minimumTickPixelDistance,\n    intervals: millisecondIntervals(60 * 60 * 1000),\n    detailedLabelFormat: detailedHourFormat,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, {\n      ...hourFormat,\n      timeZone,\n    }).format,\n  };\n  const hoursUnlabelled = {\n    ...hours,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const sixHours: AxisLayer<Interval & YearToHour> = {\n    unit: 'hour',\n    unitMultiplier: 6,\n    labeled: true,\n    minimumTickPixelDistance: 2 * minimumTickPixelDistance,\n    intervals: (domainFrom, domainTo) =>\n      (\n        [...days.intervals(domainFrom, domainTo)].flatMap(({ year, month, dayOfMonth, dayOfWeek }) =>\n          [0, 6, 12, 18].map((hour) => {\n            const temporalArgs = {\n              timeZone,\n              year,\n              month,\n              day: dayOfMonth,\n              hour,\n            };\n            const timePoint = cachedZonedDateTimeFrom(temporalArgs);\n            const binStart = timePoint[TimeProp.EpochSeconds];\n            const supremum = binStart + 6 * 60 * 60; // fixme this is not correct in case the day is 23hrs long due to winter->summer time switch\n\n            return Number.isNaN(binStart)\n              ? []\n              : {\n                  dayOfMonth,\n                  // fontColor: offHourFontColor && (hour < workHourMin || hour > workHourMax) ? offHourFontColor : defaultFontColor,\n                  dayOfWeek,\n                  hour,\n                  year,\n                  month,\n                  minimum: binStart,\n                  supremum,\n                  labelSupremum: supremum,\n                };\n          }),\n        ) as Array<Interval & YearToHour>\n      ).map((b: Interval & YearToHour, i, a) =>\n        Object.assign(b, { supremum: i === a.length - 1 ? b.supremum : a[i + 1]?.minimum }),\n      ),\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, {\n      ...hourFormat,\n      timeZone,\n    }).format,\n    detailedLabelFormat: detailedHourFormat,\n  };\n  const sixHoursUnlabelled = {\n    ...sixHours,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const minutesFormatter = new Intl.DateTimeFormat(locale, { hour: '2-digit', minute: '2-digit', timeZone, hourCycle });\n  const secondsFormatter = new Intl.DateTimeFormat(locale, {\n    hour: '2-digit',\n    minute: '2-digit',\n    second: '2-digit',\n    timeZone,\n    hourCycle,\n  });\n  const minutes: AxisLayer<Interval> = {\n    unit: 'minute',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: hhMmDistanceMultiplier * minimumTickPixelDistance,\n    intervals: millisecondIntervals(60 * 1000),\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, {\n      year: 'numeric',\n      month: 'long',\n      day: 'numeric',\n      ...hourFormat,\n      minute: 'numeric',\n      timeZone,\n    }).format,\n    minorTickLabelFormat: (d) => `${minutesFormatter.format(d)}`,\n  };\n  const quarterHours = {\n    ...minutes,\n    unitMultiplier: 15,\n    labeled: true,\n    intervals: millisecondIntervals(15 * 60 * 1000),\n  };\n  const quarterHoursUnlabelled = {\n    ...quarterHours,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const fiveMinutes = {\n    ...minutes,\n    unitMultiplier: 5,\n    labeled: true,\n    intervals: millisecondIntervals(5 * 60 * 1000),\n  };\n  const fiveMinutesUnlabelled = {\n    ...fiveMinutes,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const minutesUnlabelled = {\n    ...minutes,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const seconds: AxisLayer<Interval> = {\n    unit: 'second',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: hhMmSsDistanceMultiplier * minimumTickPixelDistance,\n    intervals: millisecondIntervals(1000),\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, {\n      year: 'numeric',\n      month: 'long',\n      day: 'numeric',\n      ...hourFormat,\n      minute: 'numeric',\n      second: 'numeric',\n      timeZone,\n    }).format,\n    minorTickLabelFormat: (d) => `${secondsFormatter.format(d).padStart(2, '0')}`, // what DateTimeFormat doing?\n  };\n  const quarterMinutes = {\n    ...seconds,\n    unitMultiplier: 15,\n    labeled: true,\n    intervals: millisecondIntervals(15 * 1000),\n  };\n  const quarterMinutesUnlabelled = {\n    ...quarterMinutes,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const fiveSeconds = {\n    ...seconds,\n    unitMultiplier: 5,\n    labeled: true,\n    intervals: millisecondIntervals(5 * 1000),\n  };\n  const fiveSecondsUnlabelled = {\n    ...fiveSeconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const secondsUnlabelled = {\n    ...seconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const millisecondDistanceMultiplier = 1.8;\n  const milliseconds: AxisLayer<Interval> = {\n    unit: 'millisecond',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * millisecondDistanceMultiplier,\n    intervals: millisecondIntervals(1),\n    minorTickLabelFormat: (d: number) => `${d % 1000}ms`,\n    detailedLabelFormat: (d: number) => `${d % 1000}ms`,\n  };\n  const tenMilliseconds = {\n    ...milliseconds,\n    unitMultiplier: 10,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * millisecondDistanceMultiplier,\n    intervals: millisecondIntervals(10),\n  };\n  const hundredMilliseconds = {\n    ...milliseconds,\n    unitMultiplier: 100,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * millisecondDistanceMultiplier,\n    intervals: millisecondIntervals(100),\n  };\n  const millisecondsUnlabelled = {\n    ...milliseconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const tenMillisecondsUnlabelled = {\n    ...tenMilliseconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const hundredMillisecondsUnlabelled = {\n    ...hundredMilliseconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n\n  const allRasters = [\n    decades,\n    yearsUnlabelled,\n    years,\n    quartersUnlabelled,\n    quarters,\n    monthsUnlabelled,\n    shortMonths,\n    months,\n    weeksUnlabelled,\n    weekStartDays,\n    daysUnlabelled,\n    days,\n    sixHoursUnlabelled,\n    sixHours,\n    hoursUnlabelled,\n    hours,\n    quarterHoursUnlabelled,\n    quarterHours,\n    fiveMinutesUnlabelled,\n    fiveMinutes,\n    minutesUnlabelled,\n    minutes,\n    quarterMinutesUnlabelled,\n    quarterMinutes,\n    fiveSecondsUnlabelled,\n    fiveSeconds,\n    secondsUnlabelled,\n    seconds,\n    hundredMillisecondsUnlabelled,\n    hundredMilliseconds,\n    tenMillisecondsUnlabelled,\n    tenMilliseconds,\n    millisecondsUnlabelled,\n    milliseconds,\n  ];\n\n  const replacements: Array<[AxisLayer<Interval>, Map<AxisLayer<Interval>, Array<AxisLayer<Interval>>>]> = [\n    [decadesUnlabelled, new Map([])],\n    [decades, new Map([[decadesUnlabelled, []]])],\n    [\n      years,\n      new Map([\n        [decades, [decadesUnlabelled]],\n        [yearsUnlabelled, []],\n      ]),\n    ],\n    [\n      quarters,\n      new Map([\n        [quartersUnlabelled, []],\n        [decadesUnlabelled, []],\n      ]),\n    ],\n    [\n      shortMonths,\n      new Map([\n        [monthsUnlabelled, []],\n        [quarters, [quartersUnlabelled]],\n      ]),\n    ],\n    [\n      months,\n      new Map([\n        [monthsUnlabelled, []],\n        [shortMonths, []],\n      ]),\n    ],\n    [weekStartDays, new Map([[weeksUnlabelled, []]])],\n    [weeksUnlabelled, new Map([[quartersUnlabelled, []]])],\n    [\n      days,\n      new Map([\n        [daysUnlabelled, []],\n        [weekStartDays, [weeksUnlabelled]],\n      ]),\n    ],\n    [sixHours, new Map([[sixHoursUnlabelled, []]])],\n    [\n      hours,\n      new Map([\n        [hoursUnlabelled, []],\n        [sixHours, [sixHoursUnlabelled]],\n      ]),\n    ],\n    [\n      quarterHours,\n      new Map([\n        [quarterHoursUnlabelled, []],\n        [hours, []],\n        [sixHours, []],\n      ]),\n    ],\n    [\n      fiveMinutes,\n      new Map([\n        [fiveMinutesUnlabelled, []],\n        [quarterHours, [quarterHoursUnlabelled]],\n        [hours, []],\n        [sixHours, []],\n      ]),\n    ],\n    [\n      minutes,\n      new Map([\n        [minutesUnlabelled, []],\n        [quarterHours, [quarterHoursUnlabelled]],\n        [fiveMinutes, [fiveMinutesUnlabelled]],\n        [hours, []],\n        [sixHours, []],\n      ]),\n    ],\n    [\n      quarterMinutes,\n      new Map([\n        [quarterMinutesUnlabelled, []],\n        [minutes, []],\n      ]),\n    ],\n    [\n      fiveSeconds,\n      new Map([\n        [fiveSecondsUnlabelled, []],\n        [quarterMinutes, [quarterMinutesUnlabelled]],\n        [minutes, []],\n      ]),\n    ],\n    [\n      seconds,\n      new Map([\n        [secondsUnlabelled, []],\n        [quarterMinutes, [quarterMinutesUnlabelled]],\n        [fiveSeconds, [fiveSecondsUnlabelled]],\n        [minutes, []],\n      ]),\n    ],\n    [hundredMilliseconds, new Map([[hundredMillisecondsUnlabelled, []]])],\n    [\n      tenMilliseconds,\n      new Map([\n        [tenMillisecondsUnlabelled, []],\n        [hundredMilliseconds, [hundredMillisecondsUnlabelled]],\n      ]),\n    ],\n    [\n      milliseconds,\n      new Map([\n        [millisecondsUnlabelled, []],\n        [tenMilliseconds, [tenMillisecondsUnlabelled]],\n        [hundredMilliseconds, [hundredMillisecondsUnlabelled]],\n      ]),\n    ],\n  ];\n\n  return (filter: (layer: AxisLayer<Interval>) => boolean) => {\n    // keep increasingly finer granularities, but only until there's enough pixel width for them to fit\n    let layers: Set<AxisLayer<Interval>> = new Set();\n    for (const layer of allRasters) {\n      if (filter(layer)) layers.add(layer);\n      else break; // `rasters` is ordered, so we exit the loop here, it's already too dense, remaining ones are ignored\n    }\n\n    replacements.forEach(([key, ruleMap]) => {\n      if (layers.has(key)) {\n        layers = new Set([...layers].flatMap((l) => ruleMap.get(l) ?? l));\n      }\n    });\n\n    return [...layers].reverse(); // while we iterated from coarse to dense, the result follows the axis layer order: finer toward coarser\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { unitIntervalWidth, AxisLayer, Interval, continuousTimeRasters } from './continuous_time_rasters';\nimport { ScaleContinuous } from '../../../../scales';\nimport { XDomain } from '../../domains/types';\nimport { AxisLabelFormatter } from '../../state/selectors/axis_tick_formatter';\nimport { GetMeasuredTicks, Projection } from '../../state/selectors/visible_ticks';\n\nconst WIDTH_FUDGE = 1.05; // raster bin widths are sometimes approximate, but there's no raster that's just 5% denser/sparser, so it's safe\n\n/** @internal */\nexport const MAX_TIME_TICK_COUNT = 50; // this doesn't do much for narrow charts, but limits tick count to a maximum on wider ones\n\n/** @internal */\nexport const MAX_TIME_GRID_COUNT = 12;\n\n/** @internal */\nexport const MINIMUM_TICK_PIXEL_DISTANCE = 24;\n\n/** @internal */\nexport const notTooDense =\n  (domainFrom: number, domainTo: number, intervalWidth: number, cartesianWidth: number, maxTickCount: number) =>\n  ({\n    unit,\n    unitMultiplier,\n    minimumTickPixelDistance,\n  }: Pick<AxisLayer<Interval>, 'unit' | 'unitMultiplier' | 'minimumTickPixelDistance'>) => {\n    const domainSize = domainTo - domainFrom;\n    const partitionIntervalWidth = unitIntervalWidth[unit] * unitMultiplier;\n    const maximumTickCount = Math.min(maxTickCount, cartesianWidth / minimumTickPixelDistance);\n    const tickCountConstraint = domainSize / maximumTickCount;\n    const spacingConstraint = intervalWidth / WIDTH_FUDGE;\n    return partitionIntervalWidth >= Math.max(tickCountConstraint, spacingConstraint); // heed both constraints\n  };\n\n/** @internal */\nexport function multilayerAxisEntry(\n  xDomain: XDomain,\n  extendByOneBin: boolean,\n  range: [number, number],\n  timeAxisLayerCount: number,\n  scale: ScaleContinuous,\n  getMeasuredTicks: GetMeasuredTicks,\n  locale: string,\n): Projection {\n  const rasterSelector = continuousTimeRasters(\n    { minimumTickPixelDistance: MINIMUM_TICK_PIXEL_DISTANCE, locale },\n    xDomain.timeZone,\n  );\n  const domainValues = xDomain.domain; // todo consider a property or object type rename\n  const domainFromS = Number(domainValues[0]) / 1000; // todo rely on a type guard or check rather than conversion\n  const binWidthMs = xDomain.minInterval;\n  const binWidth = binWidthMs / 1000; // seconds to milliseconds\n  const domainExtension = extendByOneBin ? binWidthMs : 0;\n  const domainToS = ((Number(domainValues.at(-1)) || NaN) + domainExtension) / 1000;\n  const cartesianWidth = Math.abs(range[1] - range[0]);\n  const layers = rasterSelector(notTooDense(domainFromS, domainToS, binWidth, cartesianWidth, MAX_TIME_TICK_COUNT));\n  let layerIndex = -1;\n  const fillLayerTimeslip = (\n    layer: number,\n    detailedLayer: number,\n    timeTicks: number[],\n    labelFormat: AxisLabelFormatter<number>,\n    showGrid: boolean,\n  ) => {\n    return {\n      entry: getMeasuredTicks(scale, timeTicks, layer, detailedLayer, labelFormat as AxisLabelFormatter, showGrid),\n      fallbackAskedTickCount: NaN,\n    };\n  };\n\n  const binStartsFrom = domainFromS - binWidth;\n  const binStartsTo = domainToS + binWidth;\n\n  return layers.reduce<Projection>(\n    (combinedEntry, l, detailedLayerIndex) => {\n      if (l.labeled) layerIndex++; // we want three (or however many) _labeled_ axis layers; others are useful for minor ticks/gridlines, and for giving coarser structure eg. stronger gridline for every 6th hour of the day\n      if (layerIndex >= timeAxisLayerCount) return combinedEntry;\n      const timeTicks = [...l.intervals(binStartsFrom, binStartsTo)]\n        .filter((b) => {\n          if (b.labelSupremum !== b.supremum && b.minimum < domainFromS) return false;\n          return b.supremum > domainFromS && b.minimum <= domainToS;\n        })\n        .map((b) => 1000 * b.minimum);\n\n      if (timeTicks.length === 0) {\n        return combinedEntry;\n      }\n\n      const { entry } = fillLayerTimeslip(\n        layerIndex,\n        detailedLayerIndex,\n        timeTicks,\n        !l.labeled ? () => '' : layerIndex === timeAxisLayerCount - 1 ? l.detailedLabelFormat : l.minorTickLabelFormat,\n        notTooDense(domainFromS, domainToS, binWidth, cartesianWidth, MAX_TIME_GRID_COUNT)(l),\n      );\n      const minLabelGap = 4;\n\n      const lastTick = entry.ticks.at(-1);\n      if (lastTick && lastTick.position + entry.labelBox.maxLabelBboxWidth > range[1]) {\n        lastTick.label = '';\n      }\n\n      return {\n        ...combinedEntry,\n        ...entry,\n        ticks: (combinedEntry.ticks || []).concat(\n          entry.ticks.filter(\n            (tick, i, a) =>\n              i > 0 ||\n              !a[1] ||\n              a[1].domainClampedPosition - tick.domainClampedPosition >= entry.labelBox.maxLabelBboxWidth + minLabelGap,\n          ),\n        ),\n      };\n    },\n    {\n      ticks: [],\n      labelBox: {\n        maxLabelBboxWidth: 0,\n        maxLabelBboxHeight: 0,\n        maxLabelTextWidth: 0,\n        maxLabelTextHeight: 0,\n        isHidden: true,\n      },\n      scale,\n    },\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* eslint-disable-next-line eslint-comments/disable-enable-pair */\n/* eslint-disable @typescript-eslint/unbound-method */\n\nimport { AxisLayer, Interval, NumberFormatter, RasterConfig } from './continuous_time_rasters';\nimport { getDecimalTicks, oneFive } from '../../../timeslip/projections/axis_model';\n\nconst numericalLayerCount = 2;\n\n/** @internal */\nexport const numericalRasters = ({ minimumTickPixelDistance, locale }: RasterConfig) => {\n  const numberFormatter = new Intl.NumberFormat(locale, {\n    notation: 'standard',\n    maximumFractionDigits: 0,\n  });\n  const format: NumberFormatter = (value) => numberFormatter.format(value);\n  const allRasters: AxisLayer<Interval>[] = [...new Array(numericalLayerCount)]\n    .map(\n      (_, i): AxisLayer<Interval> => ({\n        unit: 'one',\n        unitMultiplier: Infinity,\n        labeled: i === 0,\n        minimumTickPixelDistance,\n        intervals: (domainFrom, domainTo) =>\n          getDecimalTicks(domainFrom, domainTo, i === 0 ? 20 : 5, oneFive).map((d, i, a) => {\n            const supremum = i < a.length - 1 ? a[i + 1] ?? NaN : d + (d - (a[i - 1] ?? NaN));\n\n            return {\n              minimum: d,\n              supremum,\n              labelSupremum: supremum,\n            };\n          }),\n        detailedLabelFormat: (n: number) => format((n - 1300000000000) / 1e6),\n        minorTickLabelFormat: (n: number) => format((n - 1300000000000) / 1e6),\n      }),\n    )\n    .reverse();\n\n  return (filter: (layer: AxisLayer<Interval>) => boolean) => {\n    // keep increasingly finer granularities, but only until there's enough pixel width for them to fit\n    const layers: Set<AxisLayer<Interval>> = new Set();\n    for (const layer of allRasters) {\n      if (filter(layer)) layers.add(layer);\n      else break; // `rasters` is ordered, so we exit the loop here, it's already too dense, remaining ones are ignored\n    }\n\n    return [...layers].reverse(); // while we iterated from coarse to dense, the result follows the axis layer order: finer toward coarser\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnchorPosition } from '../../../components/portal/types';\nimport { Line, Rect } from '../../../geoms/types';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { isContinuousScale } from '../../../scales/types';\nimport { TooltipStickTo } from '../../../specs/constants';\nimport { Rotation } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { Point } from '../../../utils/point';\nimport { isHorizontalRotation, isVerticalRotation } from '../state/utils/common';\n\n/** @internal */\nexport const DEFAULT_SNAP_POSITION_BAND = 1;\n\n/** @internal */\nexport function getSnapPosition(\n  value: string | number,\n  scale: ScaleBand | ScaleContinuous,\n  totalBarsInCluster = 1,\n): { band: number; position: number } | undefined {\n  const position = scale.scale(value);\n  if (Number.isNaN(position)) {\n    return;\n  }\n\n  if (scale.bandwidth > 0) {\n    const band = scale.bandwidth / (1 - scale.barsPadding);\n\n    const halfPadding = (band - scale.bandwidth) / 2;\n    return {\n      position: position - halfPadding * totalBarsInCluster,\n      band: band * totalBarsInCluster,\n    };\n  }\n  return {\n    position,\n    band: DEFAULT_SNAP_POSITION_BAND,\n  };\n}\n\n/** @internal */\nexport function getCursorLinePosition(\n  chartRotation: Rotation,\n  chartDimensions: Dimensions,\n  projectedPointerPosition: { x: number; y: number },\n): Line | undefined {\n  const { x, y } = projectedPointerPosition;\n  if (x < 0 || y < 0) {\n    return undefined;\n  }\n  const { left, top, width, height } = chartDimensions;\n  const isHorizontalRotated = isHorizontalRotation(chartRotation);\n  if (isHorizontalRotated) {\n    const crosshairTop = y + top;\n    return {\n      x1: left,\n      x2: left + width,\n      y1: crosshairTop,\n      y2: crosshairTop,\n    };\n  }\n  const crosshairLeft = x + left;\n\n  return {\n    x1: crosshairLeft,\n    x2: crosshairLeft,\n    y1: top,\n    y2: top + height,\n  };\n}\n\n/** @internal */\nexport function getCursorBandPosition(\n  chartRotation: Rotation,\n  panel: Dimensions,\n  cursorPosition: Point,\n  invertedValue: {\n    value: string | number;\n    withinBandwidth: boolean;\n  },\n  snapEnabled: boolean,\n  xScale: ScaleBand | ScaleContinuous,\n  totalBarsInCluster?: number,\n): Rect | undefined {\n  const { top, left, width, height } = panel;\n  const { x, y } = cursorPosition;\n  const isHorizontalRotated = isHorizontalRotation(chartRotation);\n  const chartWidth = isHorizontalRotated ? width : height;\n  const chartHeight = isHorizontalRotated ? height : width;\n\n  const isLineOrAreaOnly = !totalBarsInCluster;\n\n  if (x > chartWidth || y > chartHeight || x < 0 || y < 0 || !invertedValue.withinBandwidth) {\n    return undefined;\n  }\n\n  const snappedPosition = getSnapPosition(invertedValue.value, xScale, isLineOrAreaOnly ? 1 : totalBarsInCluster);\n  if (!snappedPosition) {\n    return undefined;\n  }\n\n  const { position, band } = snappedPosition;\n  const bandOffset = xScale.bandwidth > 0 ? band : 0;\n\n  if (isHorizontalRotated) {\n    const adjustedLeft = snapEnabled ? position : cursorPosition.x;\n    let leftPosition = chartRotation === 0 ? left + adjustedLeft : left + width - adjustedLeft - bandOffset;\n    let adjustedWidth = band;\n    if (band > 1 && leftPosition + band > left + width) {\n      adjustedWidth = left + width - leftPosition;\n    } else if (band > 1 && leftPosition < left) {\n      adjustedWidth = band - (left - leftPosition);\n      leftPosition = left;\n    }\n    if (isLineOrAreaOnly && isContinuousScale(xScale)) {\n      return {\n        x: leftPosition,\n        width: 0,\n        y: top,\n        height,\n      };\n    }\n    return {\n      x: leftPosition,\n      y: top,\n      width: adjustedWidth,\n      height,\n    };\n  }\n  const adjustedTop = snapEnabled ? position : cursorPosition.x;\n  let topPosition = chartRotation === 90 ? top + adjustedTop : height + top - adjustedTop - bandOffset;\n  let adjustedHeight = band;\n  if (band > 1 && topPosition + band > top + height) {\n    adjustedHeight = band - (topPosition + band - (top + height));\n  } else if (band > 1 && topPosition < top) {\n    adjustedHeight = band - (top - topPosition);\n    topPosition = top;\n  }\n  if (isLineOrAreaOnly && isContinuousScale(xScale)) {\n    return {\n      x: left,\n      width,\n      y: topPosition,\n      height: 0,\n    };\n  }\n  return {\n    y: topPosition,\n    x: left,\n    width,\n    height: adjustedHeight,\n  };\n}\n\n/** @internal */\nexport function getTooltipAnchorPosition(\n  chartRotation: Rotation,\n  cursorBandPosition: Rect,\n  cursorPosition: { x: number; y: number },\n  panel: Dimensions,\n  stickTo: TooltipStickTo = TooltipStickTo.MousePosition,\n): AnchorPosition {\n  const { x, y, width, height } = cursorBandPosition;\n  const isRotated = isVerticalRotation(chartRotation);\n  // horizontal movement of cursor\n  if (!isRotated) {\n    const stickY =\n      stickTo === TooltipStickTo.MousePosition\n        ? cursorPosition.y + panel.top\n        : stickTo === TooltipStickTo.Middle\n          ? y + height / 2\n          : stickTo === TooltipStickTo.Bottom\n            ? y + height\n            : y; // TooltipStickTo.Top is also ok with that value\n    return {\n      x,\n      width,\n      y: stickY,\n      height: 0,\n    };\n  }\n  const stickX =\n    stickTo === TooltipStickTo.MousePosition\n      ? cursorPosition.x + panel.left\n      : stickTo === TooltipStickTo.Right\n        ? x + width\n        : stickTo === TooltipStickTo.Center\n          ? x + width / 2\n          : x; // TooltipStickTo.Left\n  return {\n    x: stickX,\n    width: 0,\n    y,\n    height,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Optional } from 'utility-types';\n\nimport { XDomain } from './types';\nimport { ScaleType } from '../../../scales/constants';\nimport { compareByValueAsc } from '../../../utils/common';\nimport { computeContinuousDataDomain, computeOrdinalDataDomain } from '../../../utils/domain';\nimport { Logger } from '../../../utils/logger';\nimport { getZoneFromSpecs, getValidatedTimeZone } from '../../../utils/time_zone';\nimport { getXNiceFromSpec, getXScaleTypeFromSpec } from '../scales/get_api_scales';\nimport { ScaleConfigs } from '../state/selectors/get_api_scale_configs';\nimport { BasicSeriesSpec, SeriesType, XScaleType } from '../utils/specs';\n\n/**\n * Merge X domain value between a set of chart specification.\n * @internal\n */\nexport function mergeXDomain(\n  { type, nice, isBandScale, timeZone, desiredTickCount, customDomain }: ScaleConfigs['x'],\n  xValues: Set<string | number>,\n  locale: string,\n  fallbackScale?: XScaleType,\n): XDomain {\n  let domain;\n  let dataDomain;\n  let minInterval = 0;\n\n  if (type === ScaleType.Ordinal || fallbackScale === ScaleType.Ordinal) {\n    if (type !== ScaleType.Ordinal) {\n      Logger.warn(`Each X value in a ${type} x scale needs be be a number. Using ordinal x scale as fallback.`);\n    }\n\n    dataDomain = computeOrdinalDataDomain([...xValues], false, true, locale);\n    domain = dataDomain;\n    if (customDomain) {\n      if (Array.isArray(customDomain)) {\n        domain = [...customDomain];\n      } else {\n        if (fallbackScale === ScaleType.Ordinal) {\n          Logger.warn(`xDomain ignored for fallback ordinal scale. Options to resolve:\n1) Correct data to match ${type} scale type (see previous warning)\n2) Change xScaleType to ordinal and set xDomain to Domain array`);\n        } else {\n          Logger.warn(\n            'xDomain for ordinal scale should be an array of values, not a DomainRange object. xDomain is ignored.',\n          );\n        }\n      }\n    }\n  } else {\n    const domainOptions = { min: NaN, max: NaN, fit: true };\n    dataDomain = computeContinuousDataDomain([...xValues] as number[], type, domainOptions);\n    domain = dataDomain;\n    let customMinInterval: undefined | number;\n\n    if (customDomain) {\n      if (Array.isArray(customDomain)) {\n        Logger.warn('xDomain for continuous scale should be a DomainRange object, not an array');\n      } else {\n        customMinInterval = customDomain.minInterval;\n        const [computedDomainMin, computedDomainMax] = domain;\n\n        if (Number.isFinite(customDomain.min) && Number.isFinite(customDomain.max)) {\n          if (customDomain.min > customDomain.max) {\n            Logger.warn('Custom xDomain is invalid: min is greater than max. Custom domain is ignored.');\n          } else {\n            domain = [customDomain.min, customDomain.max];\n          }\n        } else if (Number.isFinite(customDomain.min)) {\n          if (customDomain.min > computedDomainMax) {\n            Logger.warn(\n              'Custom xDomain is invalid: custom min is greater than computed max. Custom domain is ignored.',\n            );\n          } else {\n            domain = [customDomain.min, computedDomainMax];\n          }\n        } else if (Number.isFinite(customDomain.max)) {\n          if (computedDomainMin > customDomain.max) {\n            Logger.warn(\n              'Custom xDomain is invalid: computed min is greater than custom max. Custom domain is ignored.',\n            );\n          } else {\n            domain = [computedDomainMin, customDomain.max];\n          }\n        }\n      }\n    }\n    const computedMinInterval = findMinInterval([...xValues.values()] as number[]);\n    minInterval = getMinInterval(computedMinInterval, xValues.size, customMinInterval);\n  }\n\n  return {\n    type: fallbackScale ?? type,\n    nice,\n    isBandScale,\n    domain,\n    dataDomain,\n    minInterval,\n    timeZone: getValidatedTimeZone(timeZone),\n    logBase: customDomain && 'logBase' in customDomain ? customDomain.logBase : 10, // fixme preexisting TS workaround\n    desiredTickCount,\n  };\n}\n\nfunction getMinInterval(computedMinInterval: number, size: number, customMinInterval?: number): number {\n  if (customMinInterval === undefined) {\n    return computedMinInterval;\n  }\n  // Allow greater custom min if xValues has 1 member.\n  if (size > 1 && customMinInterval > computedMinInterval) {\n    Logger.warn(\n      'Custom xDomain is invalid: custom minInterval is greater than computed minInterval. Using computed minInterval.',\n    );\n    return computedMinInterval;\n  }\n  if (customMinInterval < 0) {\n    Logger.warn('Custom xDomain is invalid: custom minInterval is less than 0. Using computed minInterval.');\n    return computedMinInterval;\n  }\n\n  return customMinInterval;\n}\n\n/**\n * Find the minimum interval between xValues.\n * Default to 0 if an empty array, 1 if one item array\n * @internal\n */\nexport function findMinInterval(xValues: number[]): number {\n  return xValues.length < 2\n    ? xValues.length\n    : [...xValues].sort(compareByValueAsc).reduce((minInterval, current, i, sortedValues) => {\n        return i < xValues.length - 1\n          ? Math.min(minInterval, Math.abs((sortedValues[i + 1] ?? 0) - current))\n          : minInterval;\n      }, Infinity);\n}\n\n/**\n * Convert the scale types of a set of specification to a generic one.\n * If there are at least one `ordinal` scale type, the resulting scale is coerced to ordinal.\n * If there are only `continuous` scale types, the resulting scale is coerced to linear.\n * If there are only `time` scales, we coerce the timeZone to `local` only if we have multiple\n * different timezones.\n * @returns the coerced scale type, the timezone and a parameter that describe if its a bandScale or not\n * @internal\n */\nexport function convertXScaleTypes(\n  specs: Optional<Pick<BasicSeriesSpec, 'seriesType' | 'xScaleType' | 'xNice' | 'timeZone'>, 'seriesType'>[],\n): {\n  type: XScaleType;\n  nice: boolean;\n  isBandScale: boolean;\n  timeZone: string;\n} {\n  const seriesTypes = new Set<string | undefined>(specs.map((s) => s.seriesType));\n  const scaleTypes = new Set(specs.map((s) => getXScaleTypeFromSpec(s.xScaleType)));\n  const niceDomains = specs.map((s) => getXNiceFromSpec(s.xNice));\n  const timeZone = getZoneFromSpecs(specs);\n  const type =\n    scaleTypes.size === 1\n      ? scaleTypes.values().next().value // pick the only scaleType present\n      : scaleTypes.has(ScaleType.Ordinal)\n        ? ScaleType.Ordinal\n        : ScaleType.Linear; // if Ordinal is not present, coerce to Linear, whether it's present or not\n  const nice = !niceDomains.includes(false);\n  const isBandScale = seriesTypes.has(SeriesType.Bar);\n  return { type, nice, isBandScale, timeZone };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { YDomain } from './types';\nimport { ScaleType } from '../../../scales/constants';\nimport { computeContinuousDataDomain, ContinuousDomain } from '../../../utils/domain';\nimport { GroupId } from '../../../utils/ids';\nimport { Logger } from '../../../utils/logger';\nimport { getYNiceFromSpec, getYScaleTypeFromSpec } from '../scales/get_api_scales';\nimport { ScaleConfigs } from '../state/selectors/get_api_scale_configs';\nimport { getSpecDomainGroupId } from '../state/utils/spec';\nimport { groupBy } from '../utils/group_data_series';\nimport { DataSeries } from '../utils/series';\nimport { BasicSeriesSpec, DomainPaddingUnit, SeriesScales, SeriesType, StackMode, YDomainRange } from '../utils/specs';\n\n/** @internal */\nexport type YBasicSeriesSpec = Pick<\n  BasicSeriesSpec,\n  'id' | 'seriesType' | 'yScaleType' | 'groupId' | 'stackAccessors' | 'useDefaultGroupDomain'\n> & { stackMode?: StackMode; enableHistogramMode?: boolean };\n\n/** @internal */\nexport function mergeYDomain(\n  yScaleAPIConfig: ScaleConfigs['y'],\n  dataSeries: DataSeries[],\n  annotationYValueMap: Map<GroupId, number[]>,\n): YDomain[] {\n  const dataSeriesByGroupId = groupBy(dataSeries, ({ spec }) => getSpecDomainGroupId(spec), true);\n  return dataSeriesByGroupId.reduce<YDomain[]>((acc, groupedDataSeries) => {\n    const stacked = groupedDataSeries.filter(({ isStacked, isFiltered }) => isStacked && !isFiltered);\n    const nonStacked = groupedDataSeries.filter(({ isStacked, isFiltered }) => !isStacked && !isFiltered);\n    const hasNonZeroBaselineTypes = groupedDataSeries.some(\n      ({ seriesType, isFiltered }) => seriesType === SeriesType.Bar || (seriesType === SeriesType.Area && !isFiltered),\n    );\n    const domain = mergeYDomainForGroup(\n      stacked,\n      nonStacked,\n      annotationYValueMap,\n      hasNonZeroBaselineTypes,\n      yScaleAPIConfig,\n    );\n    return domain ? [...acc, domain] : acc;\n  }, []);\n}\n\nfunction mergeYDomainForGroup(\n  stacked: DataSeries[],\n  nonStacked: DataSeries[],\n  annotationYValueMap: Map<GroupId, number[]>,\n  hasZeroBaselineSpecs: boolean,\n  yScaleConfig: ScaleConfigs['y'],\n): YDomain | null {\n  const dataSeries = [...stacked, ...nonStacked];\n  if (!dataSeries[0]) return null;\n\n  const [{ isStacked, stackMode, spec }] = dataSeries;\n  const groupId = getSpecDomainGroupId(spec);\n  const scaleConfig = yScaleConfig[groupId];\n\n  if (!scaleConfig) return null;\n\n  const { customDomain, type, nice, desiredTickCount } = scaleConfig;\n  const newCustomDomain: YDomainRange = customDomain ? { ...customDomain } : { min: NaN, max: NaN };\n  const { paddingUnit, padding, constrainPadding } = newCustomDomain;\n\n  let mergedDomain: ContinuousDomain;\n  if (isStacked && stackMode === StackMode.Percentage) {\n    mergedDomain = computeContinuousDataDomain([0, 1], type, customDomain);\n  } else {\n    const annotationData = annotationYValueMap.get(groupId) ?? [];\n    const stackedDomain = computeYDomain(stacked, annotationData, hasZeroBaselineSpecs, type, newCustomDomain);\n    const nonStackedDomain = computeYDomain(nonStacked, annotationData, hasZeroBaselineSpecs, type, newCustomDomain);\n    mergedDomain = computeContinuousDataDomain([...stackedDomain, ...nonStackedDomain], type, newCustomDomain);\n    const [computedDomainMin, computedDomainMax] = mergedDomain;\n\n    if (newCustomDomain && Number.isFinite(newCustomDomain.min) && Number.isFinite(newCustomDomain.max)) {\n      // Don't need to check min > max because this has been validated on axis domain merge\n      mergedDomain = [newCustomDomain.min, newCustomDomain.max];\n    } else if (newCustomDomain && Number.isFinite(newCustomDomain.min)) {\n      if (newCustomDomain.min > computedDomainMax) {\n        Logger.warn(`custom yDomain for ${groupId} is invalid, custom min is greater than computed max.`);\n        mergedDomain = [newCustomDomain.min, newCustomDomain.min];\n      } else {\n        mergedDomain = [newCustomDomain.min, computedDomainMax];\n      }\n    } else if (newCustomDomain && Number.isFinite(newCustomDomain.max)) {\n      if (computedDomainMin > newCustomDomain.max) {\n        Logger.warn(`custom yDomain for ${groupId} is invalid, custom max is less than computed max.`);\n        mergedDomain = [newCustomDomain.max, newCustomDomain.max];\n      } else {\n        mergedDomain = [computedDomainMin, newCustomDomain.max];\n      }\n    }\n  }\n\n  return {\n    type,\n    nice,\n    isBandScale: false,\n    groupId,\n    domain: mergedDomain,\n    logBase: customDomain?.logBase,\n    logMinLimit: customDomain?.logMinLimit,\n    desiredTickCount,\n    domainPixelPadding: paddingUnit === DomainPaddingUnit.Pixel ? padding : 0,\n    constrainDomainPadding: constrainPadding,\n  };\n}\n\nfunction computeYDomain(\n  dataSeries: DataSeries[],\n  annotationYValues: number[],\n  hasZeroBaselineSpecs: boolean,\n  scaleType: ScaleType,\n  customDomain: YDomainRange,\n) {\n  const yValues = new Set<any>();\n  dataSeries.forEach(({ data }) => {\n    for (const datum of data) {\n      yValues.add(datum.y1);\n      if (hasZeroBaselineSpecs && datum.y0 !== null) yValues.add(datum.y0);\n    }\n  });\n  if (yValues.size === 0) {\n    return [];\n  }\n  // padding already applied, set to 0 here to avoid duplicating\n  const domainOptions = { ...customDomain, padding: 0 };\n  return computeContinuousDataDomain([...yValues, ...annotationYValues], scaleType, domainOptions);\n}\n\n/** @internal */\nexport function groupSeriesByYGroup(specs: YBasicSeriesSpec[]) {\n  const specsByGroupIds = new Map<\n    GroupId,\n    { stackMode: StackMode | undefined; stacked: YBasicSeriesSpec[]; nonStacked: YBasicSeriesSpec[] }\n  >();\n\n  // split each specs by groupId and by stacked or not\n  specs.forEach((spec) => {\n    const group = specsByGroupIds.get(spec.groupId) || {\n      stackMode: undefined,\n      stacked: [],\n      nonStacked: [],\n    };\n\n    if (isStackedSpec(spec)) {\n      group.stacked.push(spec);\n    } else {\n      group.nonStacked.push(spec);\n    }\n    if (group.stackMode === undefined && spec.stackMode !== undefined) {\n      group.stackMode = spec.stackMode;\n    }\n    if (spec.stackMode !== undefined && group.stackMode !== undefined && group.stackMode !== spec.stackMode) {\n      Logger.warn(`Is not possible to mix different stackModes, please align all stackMode on the same GroupId\n      to the same mode. The default behaviour will be to use the first encountered stackMode on the series`);\n    }\n    specsByGroupIds.set(spec.groupId, group);\n  });\n  return specsByGroupIds;\n}\n\n/** @internal */\nexport function hasHistogramBarSpec(specs: YBasicSeriesSpec[]) {\n  return specs.some(({ seriesType, enableHistogramMode }) => seriesType === SeriesType.Bar && enableHistogramMode);\n}\n\n/** @internal */\nexport function isStackedSpec(spec: YBasicSeriesSpec) {\n  return spec.stackAccessors && spec.stackAccessors.length > 0;\n}\n\n/** @internal */\nexport function coerceYScaleTypes(series: Pick<SeriesScales, 'yScaleType' | 'yNice'>[]) {\n  const scaleTypes = new Set(series.map((s) => getYScaleTypeFromSpec(s.yScaleType)));\n  const niceDomains = series.map((s) => getYNiceFromSpec(s.yNice));\n  const type = scaleTypes.size === 1 ? scaleTypes.values().next().value : ScaleType.Linear;\n  return { type, nice: !niceDomains.includes(false) };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../common/colors';\nimport { LegendItem } from '../../../common/legend';\nimport { SeriesKey, SeriesIdentifier } from '../../../common/series_id';\nimport { SettingsSpec } from '../../../specs';\nimport { isDefined, mergePartial } from '../../../utils/common';\nimport { BandedAccessorType } from '../../../utils/geometry';\nimport { getLegendCompareFn, SeriesCompareFn } from '../../../utils/series_sort';\nimport { PointStyle, Theme } from '../../../utils/themes/theme';\nimport { XDomain } from '../domains/types';\nimport { LegendValue, getLegendValue } from '../state/utils/get_last_value';\nimport { getAxesSpecForSpecId, getSpecsById } from '../state/utils/spec';\nimport { Y0_ACCESSOR_POSTFIX, Y1_ACCESSOR_POSTFIX } from '../tooltip/tooltip';\nimport { defaultTickFormatter } from '../utils/axis_utils';\nimport { defaultXYLegendSeriesSort } from '../utils/default_series_sort_fn';\nimport { groupBy } from '../utils/group_data_series';\nimport {\n  getSeriesIndex,\n  getSeriesName,\n  DataSeries,\n  getSeriesKey,\n  getSeriesIdentifierFromDataSeries,\n  isBandedSpec,\n} from '../utils/series';\nimport {\n  AxisSpec,\n  BasicSeriesSpec,\n  Postfixes,\n  StackMode,\n  isAreaSeriesSpec,\n  isBarSeriesSpec,\n  isBubbleSeriesSpec,\n  isLineSeriesSpec,\n} from '../utils/specs';\n\n/** @internal */\nexport interface FormattedLastValues {\n  y0: number | string | null;\n  y1: number | string | null;\n}\n\nfunction getPostfix(spec: BasicSeriesSpec): Postfixes {\n  if (isAreaSeriesSpec(spec) || isBarSeriesSpec(spec)) {\n    const { y0AccessorFormat = Y0_ACCESSOR_POSTFIX, y1AccessorFormat = Y1_ACCESSOR_POSTFIX } = spec;\n    return { y0AccessorFormat, y1AccessorFormat };\n  }\n\n  return {};\n}\n\nfunction getBandedLegendItemLabel(name: string, yAccessor: BandedAccessorType, postfixes: Postfixes) {\n  return yAccessor === BandedAccessorType.Y1\n    ? `${name}${postfixes.y1AccessorFormat}`\n    : `${name}${postfixes.y0AccessorFormat}`;\n}\n\n/** @internal */\nfunction getPointStyle(spec: BasicSeriesSpec, theme: Theme): PointStyle | undefined {\n  if (isBubbleSeriesSpec(spec)) {\n    return mergePartial(theme.bubbleSeriesStyle.point, spec.bubbleSeriesStyle?.point);\n  } else if (isLineSeriesSpec(spec)) {\n    return mergePartial(theme.lineSeriesStyle.point, spec.lineSeriesStyle?.point);\n  } else if (isAreaSeriesSpec(spec)) {\n    return mergePartial(theme.areaSeriesStyle.point, spec.areaSeriesStyle?.point);\n  }\n}\n\n/** @internal */\nexport function computeLegend(\n  xDomain: XDomain,\n  dataSeries: DataSeries[],\n  seriesColors: Map<SeriesKey, Color>,\n  specs: BasicSeriesSpec[],\n  axesSpecs: AxisSpec[],\n  settingsSpec: SettingsSpec,\n  serialIdentifierDataSeriesMap: Record<string, DataSeries>,\n  theme: Theme,\n  deselectedDataSeries: SeriesIdentifier[] = [],\n): LegendItem[] {\n  const legendItems: LegendItem[] = [];\n  const defaultColor = theme.colors.defaultVizColor;\n\n  const legendValueMode = LegendValue.LastValue;\n\n  dataSeries.forEach((series) => {\n    const { specId, yAccessor } = series;\n    const banded = isBandedSpec(series.spec);\n    const spec = getSpecsById<BasicSeriesSpec>(specs, specId);\n    const dataSeriesKey = getSeriesKey(\n      {\n        specId: series.specId,\n        yAccessor: series.yAccessor,\n        splitAccessors: series.splitAccessors,\n      },\n      series.groupId,\n    );\n\n    const color = seriesColors.get(dataSeriesKey) || defaultColor;\n    const hasSingleSeries = dataSeries.length === 1;\n    const name = getSeriesName(series, hasSingleSeries, false, spec);\n    const isSeriesHidden = deselectedDataSeries && getSeriesIndex(deselectedDataSeries, series) >= 0;\n    if (name === '' || !spec) return;\n\n    const postFixes = getPostfix(spec);\n    // Use this to get axis spec w/ tick formatter\n    const { yAxis } = getAxesSpecForSpecId(axesSpecs, spec.groupId, settingsSpec.rotation);\n    const formatter = spec.tickFormat ?? yAxis?.tickFormat ?? defaultTickFormatter;\n    const { hideInLegend } = spec;\n\n    const seriesIdentifier = getSeriesIdentifierFromDataSeries(series);\n\n    const pointStyle = getPointStyle(spec, theme);\n\n    const itemValue = getLegendValue(series, xDomain, legendValueMode, (d) => {\n      return series.stackMode === StackMode.Percentage\n        ? d.y1 === null || d.y0 === null\n          ? null\n          : d.y1 - d.y0\n        : d.initialY1;\n    });\n    const formattedItemValue = itemValue !== null ? formatter(itemValue) : '';\n\n    legendItems.push({\n      color,\n      label: banded ? getBandedLegendItemLabel(name, BandedAccessorType.Y1, postFixes) : name,\n      seriesIdentifiers: [seriesIdentifier],\n      childId: BandedAccessorType.Y1,\n      isSeriesHidden,\n      isItemHidden: hideInLegend,\n      isToggleable: true,\n      defaultExtra:\n        itemValue !== null\n          ? {\n              raw: itemValue,\n              formatted: formattedItemValue,\n              legendSizingLabel: formattedItemValue,\n            }\n          : undefined,\n      path: [{ index: 0, value: seriesIdentifier.key }],\n      keys: [specId, spec.groupId, yAccessor, ...series.splitAccessors.values()],\n      pointStyle,\n    });\n    if (banded) {\n      const bandedItemValue = getLegendValue(series, xDomain, legendValueMode, (d) => {\n        return series.stackMode === StackMode.Percentage ? d.y0 : d.initialY0;\n      });\n      const bandedFormattedItemValue = bandedItemValue !== null ? formatter(bandedItemValue) : '';\n\n      const labelY0 = getBandedLegendItemLabel(name, BandedAccessorType.Y0, postFixes);\n      legendItems.push({\n        color,\n        label: labelY0,\n        seriesIdentifiers: [seriesIdentifier],\n        childId: BandedAccessorType.Y0,\n        isSeriesHidden,\n        isItemHidden: hideInLegend,\n        isToggleable: true,\n        defaultExtra:\n          bandedItemValue !== null\n            ? {\n                raw: bandedItemValue,\n                formatted: bandedFormattedItemValue,\n                legendSizingLabel: bandedFormattedItemValue,\n              }\n            : undefined,\n        path: [{ index: 0, value: seriesIdentifier.key }],\n        keys: [specId, spec.groupId, yAccessor, ...series.splitAccessors.values()],\n        pointStyle,\n      });\n    }\n  });\n\n  const legendSortFn = getLegendCompareFn((a, b) => {\n    const aDs = serialIdentifierDataSeriesMap[a.key];\n    const bDs = serialIdentifierDataSeriesMap[b.key];\n    return defaultXYLegendSeriesSort(aDs, bDs);\n  });\n  const sortFn: SeriesCompareFn = settingsSpec.legendSort ?? legendSortFn;\n\n  return groupBy(\n    legendItems.sort((a, b) =>\n      a.seriesIdentifiers[0] && b.seriesIdentifiers[0] ? sortFn(a.seriesIdentifiers[0], b.seriesIdentifiers[0]) : 0,\n    ),\n    ({ keys, childId }) => {\n      return [...keys, childId].join('__'); // childId is used for band charts\n    },\n    true,\n  )\n    .map((d) => {\n      if (!d[0]) return;\n      return {\n        ...d[0],\n        seriesIdentifiers: d.map(({ seriesIdentifiers: [s] }) => s).filter(isDefined),\n        path: d.map(({ path: [p] }) => p).filter(isDefined),\n      };\n    })\n    .filter(isDefined);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Keys } from 'utility-types';\n\nimport { TimeFunction, TimingFunctions } from './../../../../../utils/time_functions';\nimport { TimeMs } from '../../../../../common/geometry';\nimport { clamp, isFiniteNumber } from '../../../../../utils/common';\n\n/**\n * TODO add logic for other types like colors\n * @public\n */\nexport type AnimatedValue = number;\n\n/**\n * Shared animation speeds in ms\n * @public\n */\nexport const AnimationSpeed = Object.freeze({\n  extraFast: 90,\n  fast: 150,\n  normal: 250,\n  slow: 350,\n  extraSlow: 500,\n});\n\n/** @public */\nexport type AnimationSpeed = $Keys<typeof AnimationSpeed>;\n\n/** @internal */\nexport class Animation {\n  private initial: AnimatedValue;\n  private target: AnimatedValue;\n  private previousTarget: AnimatedValue | null;\n  private current: AnimatedValue;\n  private snapValues: AnimatedValue[];\n  private timeFunction: TimeFunction;\n  private delay: TimeMs;\n  private duration: TimeMs;\n  private timeOffset: TimeMs;\n  private timingFn: (n: number) => number = TimingFunctions.linear;\n\n  constructor(value: AnimatedValue, options: AnimationOptions = {}) {\n    this.initial = options?.initialValue ?? value;\n    this.current = options?.initialValue ?? value;\n    this.target = value;\n    this.previousTarget = value;\n    this.timeOffset = 0;\n    this.delay = (typeof options?.delay === 'string' ? AnimationSpeed[options.delay] : options?.delay) ?? 0;\n    this.duration =\n      typeof options?.duration === 'string'\n        ? AnimationSpeed[options.duration]\n        : options?.duration ?? AnimationSpeed.slow;\n    this.timeFunction = options?.timeFunction ?? TimeFunction.linear;\n    this.snapValues = options?.snapValues ?? [];\n    this.setTimingFn();\n  }\n\n  /**\n   * Animation is delayed and value has not started tweening\n   */\n  isDelayed(t: TimeMs) {\n    if (this.timeOffset !== 0) return false;\n    return t < this.delay;\n  }\n\n  /**\n   * Animation is delayed or actively tweening\n   */\n  isActive(t: TimeMs) {\n    if (!isFiniteNumber(this.initial) || !isFiniteNumber(this.target) || this.initial === this.target) {\n      return false;\n    }\n\n    return t - this.delay + this.timeOffset < this.duration;\n  }\n\n  /**\n   * Sets the target value to trigger tweening of value\n   */\n  setTarget(value: AnimatedValue) {\n    if (this.snapValues.includes(value)) {\n      this.current = value;\n      this.clear();\n    } else if (this.target !== value) {\n      if (this.previousTarget) {\n        this.initial = this.previousTarget;\n        this.target = value;\n        this.setTimingFn();\n        this.timeOffset = this.invertTimingFn();\n      } else {\n        this.timeOffset = 0;\n        this.initial = this.current;\n        this.target = value;\n        this.setTimingFn();\n      }\n    }\n  }\n\n  private invertTimingFn() {\n    const scaledValue = this.current - this.initial;\n    const scalar = this.target - this.initial;\n    const multiplier = scaledValue / scalar;\n    const timeDelta = clamp(TimingFunctions[this.timeFunction].inverse(multiplier), 0, 1);\n    return timeDelta * this.duration + this.delay;\n  }\n\n  private setTimingFn() {\n    const scalar = this.target - this.initial;\n    this.timingFn =\n      scalar === 0\n        ? () => this.initial\n        : (t) => {\n            const multiplier = TimingFunctions[this.timeFunction](t);\n            return this.initial + scalar * multiplier;\n          };\n  }\n\n  /**\n   * Get animated value at time t\n   */\n  valueAtTime(t: TimeMs): AnimatedValue {\n    if (this.isDelayed(t)) return this.initial;\n    const unitNormalizedTime = Math.max(0, Math.min(1, (t - this.delay + this.timeOffset) / this.duration));\n    const value = this.timingFn(unitNormalizedTime);\n    this.current = value; // need to set for clear to be called with no time value\n    return value;\n  }\n\n  /**\n   * Pause animation at current time/value and clears initial and target values\n   */\n  clear() {\n    this.previousTarget = this.current === this.target ? null : this.target;\n    this.initial = this.current;\n    this.target = this.current;\n    this.setTimingFn();\n  }\n}\n\n/** @public */\nexport interface AnimationOptions {\n  /**\n   * Enables animations on annotations\n   */\n  enabled?: boolean;\n  /**\n   * Set initial value for initial render animations.\n   * By default, the initial value is determined on the initial render\n   * then animates any change thereafter.\n   *\n   * @example\n   * ```ts\n   * // Initially animates the height from 0 to 100 with no value change\n   * atx.getValue('bar-height', 100, { initialValue: 0 })\n   * ```\n   */\n  initialValue?: AnimatedValue;\n  /**\n   * start delay in ms\n   */\n  delay?: TimeMs | AnimationSpeed;\n  /**\n   * Snaps back to initial value instantly\n   */\n  snapValues?: AnimatedValue[];\n  /**\n   * The speed curve of the animation\n   */\n  timeFunction?: TimeFunction;\n  /**\n   * Duration from start of animation to completion in ms\n   */\n  duration?: TimeMs | AnimationSpeed;\n}\n\n/** @internal */\nexport interface AnimationState {\n  rafId: number;\n  pool: Map<string, Animation>;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Logger } from './../../../../../utils/logger';\nimport { AnimatedValue, Animation, AnimationOptions, AnimationState } from './animation';\nimport { debounce } from '../../../../../utils/debounce';\n\n// TODO find a better way to do this when we have an actual build process\nconst DISABLE_ANIMATIONS = (typeof process === 'object' && process.env && process.env.VRT) === 'true';\n\n/**\n * Function used to animate values from within a render context.\n *\n * `options` are applied only on initial render and never changed.\n * @internal\n */\nexport type AnimateFn = (options?: AnimationOptions) => (key: string, value: AnimatedValue) => AnimatedValue;\n\n/** @internal */\nexport interface AnimationContext {\n  getValue: AnimateFn;\n}\n\n/** @internal */\nexport const getAnimationPoolFn = (\n  animationState: AnimationState,\n  renderFn: (animationCtx: AnimationContext) => void,\n) => {\n  // Must clear raf/pool outside of debounce to maintain active state\n  window.cancelAnimationFrame(animationState.rafId);\n  animationState.pool.forEach((a) => a.clear());\n\n  return debounce(\n    function getAnimationPoolFnDebounce() {\n      const propValuesForRun = new Map<string, number>();\n      const getAnimatedValueFn =\n        (t: number): AnimateFn =>\n        (options) =>\n        (key, value) => {\n          if (t === 0 && propValuesForRun.has(key) && propValuesForRun.get(key) !== value) {\n            Logger.error(\n              `aCtx.getValue(\\`${key}\\`, <value>) was called multiple times in a single render with different values.\\\n Please animate these values independently to avoid collisions.`,\n            );\n          }\n\n          if (DISABLE_ANIMATIONS || !(options?.enabled ?? true)) return value;\n\n          propValuesForRun.set(key, value);\n          if (!animationState.pool.has(key)) {\n            animationState.pool.set(key, new Animation(value, options));\n          }\n\n          const animation = animationState.pool.get(key);\n          if (!animation) return value;\n\n          animation.setTarget(value);\n\n          return animation.valueAtTime(t);\n        };\n\n      function getAnimationContext(t: number): AnimationContext {\n        // TODO build out simplified functions for different usages\n        return {\n          getValue: getAnimatedValueFn(t),\n        };\n      }\n\n      renderFn(getAnimationContext(0));\n\n      animationState.rafId = window.requestAnimationFrame((epochStartTime) => {\n        const anim = (t: number) => {\n          const elapsed = t - epochStartTime;\n          const animations = [...animationState.pool.values()];\n\n          // skips render if all animations are actively delayed\n          if (!animations.every((a) => a.isDelayed(elapsed))) {\n            renderFn(getAnimationContext(elapsed));\n          }\n          if (animations.some((a) => a.isActive(elapsed))) {\n            animationState.rafId = window.requestAnimationFrame(anim);\n          }\n        };\n        animationState.rafId = window.requestAnimationFrame(anim);\n      });\n    },\n    300,\n    { isImmediate: true }, // ensures the hovered ids are correct\n  )();\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderLineAnnotations } from './lines';\nimport { renderRectAnnotations } from './rect';\nimport { Rotation } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { AnnotationId } from '../../../../../utils/ids';\nimport {\n  mergeWithDefaultAnnotationLine,\n  mergeWithDefaultAnnotationRect,\n} from '../../../../../utils/themes/merge_utils';\nimport { SharedGeometryStateStyle } from '../../../../../utils/themes/theme';\nimport { AnnotationLineProps } from '../../../annotations/line/types';\nimport { AnnotationRectProps } from '../../../annotations/rect/types';\nimport { AnnotationDimensions } from '../../../annotations/types';\nimport { getSpecsById } from '../../../state/utils/spec';\nimport { AnnotationSpec, isLineAnnotation, isRectAnnotation } from '../../../utils/specs';\nimport { getAnnotationHoverParamsFn } from '../../common/utils';\nimport { AnimationContext } from '../animations';\n\n/** @internal */\nexport function renderAnnotations(\n  ctx: CanvasRenderingContext2D,\n  aCtx: AnimationContext,\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  annotationSpecs: AnnotationSpec[],\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  sharedStyle: SharedGeometryStateStyle,\n  hoveredAnnotationIds: string[],\n  renderOnBackground: boolean = true,\n) {\n  annotationDimensions.forEach((annotation, id) => {\n    const spec = getSpecsById<AnnotationSpec>(annotationSpecs, id);\n    const isBackground = (spec?.zIndex ?? 0) <= 0;\n\n    if (spec && isBackground === renderOnBackground) {\n      const getHoverParams = getAnnotationHoverParamsFn(hoveredAnnotationIds, sharedStyle, spec.animations);\n      if (isLineAnnotation(spec)) {\n        const lineStyle = mergeWithDefaultAnnotationLine(spec.style);\n        renderLineAnnotations(\n          ctx,\n          aCtx,\n          annotation as AnnotationLineProps[],\n          lineStyle,\n          getHoverParams,\n          rotation,\n          renderingArea,\n        );\n      } else if (isRectAnnotation(spec)) {\n        const rectStyle = mergeWithDefaultAnnotationRect(spec.style);\n        renderRectAnnotations(\n          ctx,\n          aCtx,\n          annotation as AnnotationRectProps[],\n          rectStyle,\n          getHoverParams,\n          rotation,\n          renderingArea,\n        );\n      }\n    }\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Stroke } from '../../../../../geoms/types';\nimport { Rotation } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { LineAnnotationStyle } from '../../../../../utils/themes/theme';\nimport { AnnotationLineProps } from '../../../annotations/line/types';\nimport { GetAnnotationParamsFn } from '../../common/utils';\nimport { AnimationContext } from '../animations';\nimport { renderMultiLine } from '../primitives/line';\nimport { withPanelTransform } from '../utils/panel_transform';\n\n/** @internal */\nexport function renderLineAnnotations(\n  ctx: CanvasRenderingContext2D,\n  aCtx: AnimationContext,\n  annotations: AnnotationLineProps[],\n  lineStyle: LineAnnotationStyle,\n  getHoverParams: GetAnnotationParamsFn,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n) {\n  const getStroke = (id: string): Stroke => {\n    const { style, options } = getHoverParams(id);\n    const opacityKey = `anno-rect-opacity--${id}`;\n    const hoverOpacity = aCtx.getValue(options)(opacityKey, style.opacity);\n    const strokeColor = overrideOpacity(\n      colorToRgba(lineStyle.line.stroke),\n      (opacity) => opacity * lineStyle.line.opacity * hoverOpacity,\n    );\n    return {\n      color: strokeColor,\n      width: lineStyle.line.strokeWidth,\n      dash: lineStyle.line.dash,\n    };\n  };\n\n  annotations.forEach(({ linePathPoints, panel, id }) =>\n    withPanelTransform(ctx, panel, rotation, renderingArea, () =>\n      renderMultiLine(ctx, [linePathPoints], getStroke(id)),\n    ),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Fill, Stroke } from '../../../../../geoms/types';\nimport { Rotation } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { RectAnnotationStyle } from '../../../../../utils/themes/theme';\nimport { AnnotationRectProps } from '../../../annotations/rect/types';\nimport { GetAnnotationParamsFn } from '../../common/utils';\nimport { AnimationContext } from '../animations';\nimport { renderRect } from '../primitives/rect';\nimport { withPanelTransform } from '../utils/panel_transform';\n\n/** @internal */\nexport function renderRectAnnotations(\n  ctx: CanvasRenderingContext2D,\n  aCtx: AnimationContext,\n  annotations: AnnotationRectProps[],\n  rectStyle: RectAnnotationStyle,\n  getHoverParams: GetAnnotationParamsFn,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n) {\n  const getFillAndStroke = (id: string): [Fill, Stroke] => {\n    const { style, options } = getHoverParams(id);\n\n    const opacityKey = `anno-rect-opacity--${id}`;\n    const hoverOpacity = aCtx.getValue(options)(opacityKey, style.opacity);\n\n    const fill: Fill = {\n      color: overrideOpacity(colorToRgba(rectStyle.fill), (opacity) => opacity * rectStyle.opacity * hoverOpacity),\n    };\n    const stroke: Stroke = {\n      color: overrideOpacity(colorToRgba(rectStyle.stroke), (opacity) => opacity * rectStyle.opacity * hoverOpacity),\n      width: rectStyle.strokeWidth,\n    };\n\n    return [fill, stroke];\n  };\n\n  annotations.forEach(({ rect, panel, id }) =>\n    withPanelTransform(ctx, panel, rotation, renderingArea, () => renderRect(ctx, rect, ...getFillAndStroke(id))),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPanelClipping } from './panel_clipping';\nimport { renderPoints } from './points';\nimport { renderLinePaths, renderAreaPath } from './primitives/path';\nimport { buildAreaStyles } from './styles/area';\nimport { buildLineStyles } from './styles/line';\nimport { withPanelTransform } from './utils/panel_transform';\nimport { colorToRgba, overrideOpacity } from '../../../../common/color_library_wrappers';\nimport { LegendItem } from '../../../../common/legend';\nimport { Fill, Rect, Stroke } from '../../../../geoms/types';\nimport { withContext } from '../../../../renderers/canvas';\nimport { ColorVariant, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { AreaGeometry, PerPanel } from '../../../../utils/geometry';\nimport { SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { getGeometryStateStyle } from '../../rendering/utils';\nimport { getTextureStyles } from '../../utils/texture';\n\n/** @internal */\nexport function renderAreas(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  areas: Array<PerPanel<AreaGeometry>>,\n  sharedStyle: SharedGeometryStateStyle,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  highlightedLegendItem?: LegendItem,\n) {\n  withContext(ctx, () => {\n    // first render all the areas and lines\n    areas.forEach(({ panel, value: area }) => {\n      const { style } = area;\n      const clippings = getPanelClipping(panel, rotation);\n      if (style.area.visible) {\n        withPanelTransform(\n          ctx,\n          panel,\n          rotation,\n          renderingArea,\n          () => renderArea(ctx, imgCanvas, area, sharedStyle, clippings, highlightedLegendItem),\n          { area: clippings, shouldClip: true },\n        );\n      }\n      if (style.line.visible) {\n        withPanelTransform(\n          ctx,\n          panel,\n          rotation,\n          renderingArea,\n          () => renderAreaLines(ctx, area, sharedStyle, clippings, highlightedLegendItem),\n          { area: clippings, shouldClip: true },\n        );\n      }\n    });\n    // now we can render the visible points on top of each the areas/lines\n    areas.forEach(({ panel, value: area }) => {\n      const { style, seriesIdentifier, points } = area;\n      const visiblePoints = style.point.visible ? points : points.filter(({ isolated }) => isolated);\n      if (visiblePoints.length === 0) {\n        return;\n      }\n      const geometryStateStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n      withPanelTransform(\n        ctx,\n        panel,\n        rotation,\n        renderingArea,\n        () => renderPoints(ctx, visiblePoints, geometryStateStyle),\n        { area: getPanelClipping(panel, rotation), shouldClip: points[0]?.value.mark !== null },\n      );\n    });\n  });\n}\n\nfunction renderArea(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  geometry: AreaGeometry,\n  sharedStyle: SharedGeometryStateStyle,\n  clippings: Rect,\n  highlightedLegendItem?: LegendItem,\n) {\n  const { area, color, transform, seriesIdentifier, style, clippedRanges, shouldClip } = geometry;\n  const geometryStateStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n  const areaFill = buildAreaStyles(ctx, imgCanvas, color, style.area, geometryStateStyle);\n\n  const fitAreaFillColor = style.fit.area.fill === ColorVariant.Series ? color : style.fit.area.fill;\n  const fitAreaFill: Fill = {\n    texture: getTextureStyles(ctx, imgCanvas, fitAreaFillColor, geometryStateStyle.opacity, style.fit.area.texture),\n    color: overrideOpacity(\n      colorToRgba(fitAreaFillColor),\n      (opacity) => opacity * geometryStateStyle.opacity * style.fit.area.opacity,\n    ),\n  };\n\n  renderAreaPath(\n    ctx,\n    transform,\n    area,\n    areaFill,\n    fitAreaFill,\n    clippedRanges,\n    clippings,\n    shouldClip && style.fit.area.visible,\n  );\n}\n\nfunction renderAreaLines(\n  ctx: CanvasRenderingContext2D,\n  geometry: AreaGeometry,\n  sharedStyle: SharedGeometryStateStyle,\n  clippings: Rect,\n  highlightedLegendItem?: LegendItem,\n) {\n  const { lines, color, seriesIdentifier, transform, style, clippedRanges, shouldClip } = geometry;\n  const geometryStateStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n  const lineStyle = buildLineStyles(color, style.line, geometryStateStyle);\n\n  const fitLineStroke: Stroke = {\n    dash: style.fit.line.dash,\n    width: style.line.strokeWidth,\n    color: overrideOpacity(\n      colorToRgba(style.fit.line.stroke === ColorVariant.Series ? color : style.fit.line.stroke),\n      (opacity) => opacity * geometryStateStyle.opacity * style.fit.line.opacity,\n    ),\n  };\n\n  renderLinePaths(\n    ctx,\n    transform,\n    lines,\n    lineStyle,\n    fitLineStroke,\n    clippedRanges,\n    clippings,\n    shouldClip && style.fit.line.visible,\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderAxisLine } from './line';\nimport { renderTick } from './tick';\nimport { renderTickLabel } from './tick_label';\nimport { Dimensions, Size } from '../../../../../utils/dimensions';\nimport { Point } from '../../../../../utils/point';\nimport { AxisStyle } from '../../../../../utils/themes/theme';\nimport { PerPanelAxisGeoms } from '../../../state/selectors/compute_per_panel_axes_geoms';\nimport { AxisTick, TickLabelBounds, shouldShowTicks } from '../../../utils/axis_utils';\nimport { AxisSpec } from '../../../utils/specs';\n\n/** @internal */\nexport interface AxisProps {\n  panelTitle?: string;\n  secondary?: boolean;\n  panelAnchor: Point;\n  axisStyle: AxisStyle; // todo rename to just style (it's in Axis... already)\n  axisSpec: AxisSpec; // todo rename to just spec (it's in Axis... already)\n  size: Size;\n  anchorPoint: Point;\n  dimension: TickLabelBounds;\n  ticks: AxisTick[];\n  debug: boolean;\n  renderingArea: Dimensions;\n  layerGirth: number;\n}\n\n/** @internal */\nexport interface AxesProps {\n  axesSpecs: AxisSpec[];\n  perPanelAxisGeoms: PerPanelAxisGeoms[];\n  axesStyles: Map<string, AxisStyle | null>;\n  sharedAxesStyle: AxisStyle;\n  debug: boolean;\n  renderingArea: Dimensions;\n}\n\n/** @internal */\nexport function renderAxis(ctx: CanvasRenderingContext2D, props: AxisProps) {\n  const { ticks, axisStyle, axisSpec, secondary, layerGirth } = props;\n  const showTicks = shouldShowTicks(axisStyle.tickLine, axisSpec.hide);\n\n  renderAxisLine(ctx, props); // render the axis line\n  if (!secondary && showTicks) ticks.forEach((tick) => renderTick(ctx, tick, props));\n  if (!secondary && axisStyle.tickLabel.visible)\n    ticks.forEach((tick) => renderTickLabel(ctx, tick, showTicks, props, layerGirth ?? 0));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisProps } from '.';\nimport { Position as P } from '../../../../../utils/common';\n\n/** @internal */\nexport function renderAxisLine(\n  ctx: CanvasRenderingContext2D,\n  { axisSpec: { position: p }, size: { width, height }, axisStyle: { axisLine } }: AxisProps,\n) {\n  if (!axisLine.visible) return;\n  ctx.beginPath();\n  ctx.moveTo(p === P.Left ? width : 0, p === P.Top ? height : 0);\n  ctx.lineTo(p !== P.Right ? width : 0, p !== P.Bottom ? height : 0);\n  ctx.strokeStyle = axisLine.stroke;\n  ctx.lineWidth = axisLine.strokeWidth;\n  ctx.stroke();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisProps } from '.';\nimport { colorToRgba, RgbaTuple } from '../../../../../common/color_library_wrappers';\nimport { Position } from '../../../../../utils/common';\nimport { isHorizontalAxis } from '../../../utils/axis_type_utils';\nimport { AxisTick } from '../../../utils/axis_utils';\nimport { HIDE_MINOR_TIME_GRID, HIERARCHICAL_GRID_WIDTH, OUTSIDE_RANGE_TOLERANCE } from '../../../utils/grid_lines';\nimport { renderMultiLine } from '../primitives/line';\n\nconst BASELINE_CORRECTION = 2; // the bottom of the em is a bit higher than the bottom alignment; todo consider measuring\n\n/** @internal */\nexport function renderTick(\n  ctx: CanvasRenderingContext2D,\n  { position, domainClampedPosition: tickPosition, layer, detailedLayer }: AxisTick,\n  {\n    axisSpec: { position: axisPosition, timeAxisLayerCount },\n    size: { width, height },\n    axisStyle: { tickLine, gridLine },\n    layerGirth,\n  }: AxisProps,\n) {\n  if (Math.abs(tickPosition - position) > OUTSIDE_RANGE_TOLERANCE) return;\n  const tickOnTheSide = timeAxisLayerCount > 0 && typeof layer === 'number';\n  const extensionLayer = tickOnTheSide ? layer + 1 : 0;\n  const tickSize =\n    tickLine.size +\n    (tickOnTheSide && (detailedLayer > 0 || !HIDE_MINOR_TIME_GRID)\n      ? extensionLayer * layerGirth + (extensionLayer < 1 ? 0 : tickLine.padding - BASELINE_CORRECTION)\n      : 0);\n  const xy = isHorizontalAxis(axisPosition)\n    ? {\n        x1: tickPosition,\n        x2: tickPosition,\n        ...(axisPosition === Position.Top ? { y1: height - tickSize, y2: height } : { y1: 0, y2: tickSize }),\n      }\n    : {\n        y1: tickPosition,\n        y2: tickPosition,\n        ...(axisPosition === Position.Left ? { x1: width, x2: width - tickSize } : { x1: 0, x2: tickSize }),\n      };\n  const layered = typeof layer === 'number';\n  const multilayerLuma = gridLine.lumaSteps[detailedLayer] ?? NaN;\n  const strokeWidth = layered ? HIERARCHICAL_GRID_WIDTH : tickLine.strokeWidth;\n  const color: RgbaTuple = layered ? [multilayerLuma, multilayerLuma, multilayerLuma, 1] : colorToRgba(tickLine.stroke);\n  renderMultiLine(ctx, [xy], { color, width: strokeWidth });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisProps } from '.';\nimport { Position } from '../../../../../utils/common';\nimport { AxisTick, getTickLabelPosition } from '../../../utils/axis_utils';\nimport { renderText } from '../primitives/text';\nimport { renderDebugRectCenterRotated } from '../utils/debug';\n\nconst TICK_TO_LABEL_GAP = 2;\n\n/** @internal */\nexport function renderTickLabel(\n  ctx: CanvasRenderingContext2D,\n  tick: AxisTick,\n  showTicks: boolean,\n  { axisSpec: { position, timeAxisLayerCount }, dimension, size, debug, axisStyle }: AxisProps,\n  layerGirth: number,\n) {\n  const labelStyle = axisStyle.tickLabel;\n  const tickLabelProps = getTickLabelPosition(\n    axisStyle,\n    tick.domainClampedPosition,\n    position,\n    labelStyle.rotation,\n    size,\n    dimension,\n    showTicks,\n    labelStyle.offset,\n    labelStyle.alignment,\n  );\n\n  const center = { x: tickLabelProps.x + tickLabelProps.offsetX, y: tickLabelProps.y + tickLabelProps.offsetY };\n\n  if (debug) {\n    const { maxLabelBboxWidth, maxLabelBboxHeight, maxLabelTextWidth: width, maxLabelTextHeight: height } = dimension;\n    // full text container\n    renderDebugRectCenterRotated(ctx, center, { ...center, width, height }, undefined, undefined, labelStyle.rotation);\n    // rotated text container\n    if (labelStyle.rotation % 90 !== 0) {\n      renderDebugRectCenterRotated(ctx, center, { ...center, width: maxLabelBboxWidth, height: maxLabelBboxHeight });\n    }\n  }\n\n  const tickOnTheSide = timeAxisLayerCount > 0 && Number.isFinite(tick.layer);\n\n  renderText(\n    ctx,\n    center,\n    tick.label,\n    {\n      fontFamily: labelStyle.fontFamily,\n      fontStyle: labelStyle.fontStyle ?? 'normal',\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      textColor: labelStyle.fill,\n      fontSize: labelStyle.fontSize,\n      align: tickLabelProps.horizontalAlign,\n      baseline: tickLabelProps.verticalAlign,\n    },\n    labelStyle.rotation,\n    tickLabelProps.textOffsetX + (tickOnTheSide ? TICK_TO_LABEL_GAP : 0),\n    tickLabelProps.textOffsetY + (tick.layer || 0) * layerGirth * (position === Position.Top ? -1 : 1),\n    1,\n    tick.direction,\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPanelClipping } from './panel_clipping';\nimport { renderRect } from './primitives/rect';\nimport { buildBarStyle } from './styles/bar';\nimport { withPanelTransform } from './utils/panel_transform';\nimport { LegendItem } from '../../../../common/legend';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { BarGeometry, PerPanel } from '../../../../utils/geometry';\nimport { SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { getGeometryStateStyle } from '../../rendering/utils';\n\n/** @internal */\nexport function renderBars(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  geoms: Array<PerPanel<BarGeometry[]>>,\n  sharedStyle: SharedGeometryStateStyle,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  highlightedLegendItem?: LegendItem,\n) {\n  geoms.forEach(({ panel, value: bars }: PerPanel<BarGeometry[]>) =>\n    withPanelTransform(\n      ctx,\n      panel,\n      rotation,\n      renderingArea,\n      () =>\n        bars.forEach((barGeometry) => {\n          const { x, y, width, height, color, seriesStyle: style, seriesIdentifier } = barGeometry;\n          const rect = { x, y, width, height };\n          const geometryStateStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n          const barStyle = buildBarStyle(ctx, imgCanvas, color, style.rect, style.rectBorder, geometryStateStyle, rect);\n          renderRect(ctx, rect, barStyle.fill, barStyle.stroke);\n        }),\n      { area: getPanelClipping(panel, rotation), shouldClip: true },\n    ),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderPointGroup } from './points';\nimport { LegendItem } from '../../../../common/legend';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { withContext } from '../../../../renderers/canvas';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { BubbleGeometry, PerPanel } from '../../../../utils/geometry';\nimport { SharedGeometryStateStyle, GeometryStateStyle } from '../../../../utils/themes/theme';\nimport { getGeometryStateStyle } from '../../rendering/utils';\n\n/** @internal */\nexport function renderBubbles(\n  ctx: CanvasRenderingContext2D,\n  bubbles: Array<PerPanel<BubbleGeometry>>,\n  sharedStyle: SharedGeometryStateStyle,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  highlightedLegendItem?: LegendItem,\n) {\n  withContext(ctx, () => {\n    const styles: Record<SeriesKey, GeometryStateStyle> = {};\n    const allPoints = bubbles.flatMap(({ value: { seriesIdentifier, points } }) => {\n      styles[seriesIdentifier.key] = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n      return points;\n    });\n\n    const shouldClip = allPoints[0]?.value.mark !== null; // TODO: add padding over clipping\n    renderPointGroup(ctx, allPoints, styles, rotation, renderingArea, shouldClip);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderMultiLine } from './primitives/line';\nimport { withContext } from '../../../../renderers/canvas';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { AxisStyle } from '../../../../utils/themes/theme';\nimport { LinesGrid } from '../../utils/grid_lines';\nimport { AxisSpec } from '../../utils/specs';\n\ninterface GridProps {\n  sharedAxesStyle: AxisStyle;\n  perPanelGridLines: Array<LinesGrid>;\n  axesSpecs: AxisSpec[];\n  renderingArea: Dimensions;\n  axesStyles: Map<string, AxisStyle | null>;\n}\n\n/** @internal */\nexport function renderGrids(\n  ctx: CanvasRenderingContext2D,\n  { perPanelGridLines, renderingArea: { left, top } }: GridProps,\n) {\n  withContext(ctx, () => {\n    ctx.translate(left, top);\n    perPanelGridLines.forEach(({ lineGroups, panelAnchor: { x, y } }) => {\n      withContext(ctx, () => {\n        ctx.translate(x, y);\n        lineGroups.forEach(({ lines, stroke }) => renderMultiLine(ctx, lines, stroke));\n      });\n    });\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPanelClipping } from './panel_clipping';\nimport { renderPoints } from './points';\nimport { renderLinePaths } from './primitives/path';\nimport { buildLineStyles } from './styles/line';\nimport { withPanelTransform } from './utils/panel_transform';\nimport { colorToRgba, overrideOpacity } from '../../../../common/color_library_wrappers';\nimport { Radian } from '../../../../common/geometry';\nimport { LegendItem } from '../../../../common/legend';\nimport { Rect, Stroke } from '../../../../geoms/types';\nimport { withContext } from '../../../../renderers/canvas';\nimport { ColorVariant, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { LineGeometry, PerPanel } from '../../../../utils/geometry';\nimport { Point } from '../../../../utils/point';\nimport { SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { getGeometryStateStyle } from '../../rendering/utils';\n\n/** @internal */\nexport function renderLines(\n  ctx: CanvasRenderingContext2D,\n  lines: Array<PerPanel<LineGeometry>>,\n  sharedStyle: SharedGeometryStateStyle,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  highlightedLegendItem?: LegendItem,\n) {\n  withContext(ctx, () => {\n    lines.forEach(({ panel, value: line }) => {\n      const { style, points } = line;\n      const clippings = getPanelClipping(panel, rotation);\n      if (style.line.visible) {\n        withPanelTransform(\n          ctx,\n          panel,\n          rotation,\n          renderingArea,\n          () => renderLine(ctx, line, sharedStyle, clippings, highlightedLegendItem),\n          { area: clippings, shouldClip: true },\n        );\n      }\n\n      const visiblePoints = style.point.visible ? points : points.filter(({ isolated }) => isolated);\n      if (visiblePoints.length === 0) {\n        return;\n      }\n      const geometryStyle = getGeometryStateStyle(line.seriesIdentifier, sharedStyle, highlightedLegendItem);\n      withPanelTransform(\n        ctx,\n        panel,\n        rotation,\n        renderingArea,\n        () => renderPoints(ctx, visiblePoints, geometryStyle),\n        // TODO: add padding over clipping\n        { area: clippings, shouldClip: line.points[0]?.value.mark !== null },\n      );\n    });\n  });\n}\n\nfunction renderLine(\n  ctx: CanvasRenderingContext2D,\n  line: LineGeometry,\n  sharedStyle: SharedGeometryStateStyle,\n  clippings: Rect,\n  highlightedLegendItem?: LegendItem,\n) {\n  const { color, transform, seriesIdentifier, style, clippedRanges, shouldClip } = line;\n  const geometryStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n\n  const lineStroke = buildLineStyles(color, style.line, geometryStyle);\n  const fitLineStrokeColor = style.fit.line.stroke === ColorVariant.Series ? color : style.fit.line.stroke;\n  const fitLineStroke: Stroke = {\n    dash: style.fit.line.dash,\n    width: style.line.strokeWidth,\n    color: overrideOpacity(\n      colorToRgba(fitLineStrokeColor),\n      (opacity) => opacity * geometryStyle.opacity * style.fit.line.opacity,\n    ),\n  };\n\n  renderLinePaths(\n    ctx,\n    transform,\n    [line.line],\n    lineStroke,\n    fitLineStroke,\n    clippedRanges,\n    clippings,\n    shouldClip && style.fit.line.visible,\n  );\n}\n\n/**\n * Draws line along a polar axis\n * @internal\n */\nexport function drawPolarLine(\n  ctx: CanvasRenderingContext2D,\n  angle: Radian,\n  radius: number,\n  length: number,\n  center: Point = { x: 0, y: 0 },\n) {\n  const y1 = Math.sin(angle) * (radius - length / 2);\n  const x1 = Math.cos(angle) * (radius - length / 2);\n  const y2 = Math.sin(angle) * (radius + length / 2);\n  const x2 = Math.cos(angle) * (radius + length / 2);\n\n  ctx.moveTo(center.x + x1, center.y + y1);\n  ctx.lineTo(center.x + x2, center.y + y2);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Rect } from '../../../../geoms/types';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nconst CLIPPING_MARGIN = 0.5;\n\n/** @internal */\nexport function getPanelClipping(panel: Dimensions, rotation: Rotation): Rect {\n  const vertical = Math.abs(rotation) === 90;\n  const width = (vertical ? panel.height : panel.width) + CLIPPING_MARGIN * 2;\n  const height = (vertical ? panel.width : panel.height) + CLIPPING_MARGIN * 2;\n  return { x: -CLIPPING_MARGIN, y: -CLIPPING_MARGIN, width, height };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderTitle } from './title';\nimport { Colors } from '../../../../../common/colors';\nimport { withContext } from '../../../../../renderers/canvas';\nimport { PanelGeoms } from '../../../../../state/selectors/compute_panels';\nimport { Position } from '../../../../../utils/common';\nimport { AxisId } from '../../../../../utils/ids';\nimport { Point } from '../../../../../utils/point';\nimport { getSpecsById } from '../../../state/utils/spec';\nimport { AxisSpec } from '../../../utils/specs';\nimport { AxesProps, AxisProps, renderAxis } from '../axes';\nimport { renderRect } from '../primitives/rect';\nimport { renderDebugRect } from '../utils/debug';\n\n/** @internal */\nexport function renderGridPanels(ctx: CanvasRenderingContext2D, { x: chartX, y: chartY }: Point, panels: PanelGeoms) {\n  panels.forEach(({ width, height, panelAnchor: { x: panelX, y: panelY } }) =>\n    withContext(ctx, () =>\n      renderRect(\n        ctx,\n        { x: chartX + panelX, y: chartY + panelY, width, height },\n        { color: Colors.Transparent.rgba },\n        { color: Colors.Black.rgba, width: 1 },\n      ),\n    ),\n  );\n}\n\nfunction renderPanel(ctx: CanvasRenderingContext2D, props: AxisProps, locale: string) {\n  const { size, anchorPoint, debug, axisStyle, axisSpec, panelAnchor, secondary } = props;\n  const { position } = axisSpec;\n  const x = anchorPoint.x + (position === Position.Right ? -1 : 1) * panelAnchor.x;\n  const y = anchorPoint.y + (position === Position.Bottom ? -1 : 1) * panelAnchor.y;\n\n  withContext(ctx, () => {\n    ctx.translate(x, y);\n    if (debug && !secondary) renderDebugRect(ctx, { x: 0, y: 0, ...size });\n    renderAxis(ctx, props); // TODO: compute axis dimensions per panel, For now, just render the axis line\n    if (!secondary) {\n      const { panelTitle, dimension } = props;\n      renderTitle(\n        ctx,\n        true,\n        { panelTitle, axisSpec, axisStyle, size, dimension, debug, anchorPoint: { x: 0, y: 0 } },\n        locale,\n      ); // TODO: should we use the axisSpec/Style for the title of small multiple or use their own style?\n    }\n  });\n}\n\n/** @internal */\nexport function renderPanelSubstrates(ctx: CanvasRenderingContext2D, props: AxesProps, locale: string) {\n  const { axesSpecs, perPanelAxisGeoms, axesStyles, sharedAxesStyle, debug, renderingArea } = props;\n  const seenAxesTitleIds = new Set<AxisId>();\n\n  perPanelAxisGeoms.forEach(({ axesGeoms, panelAnchor }) => {\n    axesGeoms.forEach((geometry) => {\n      const {\n        axis: { panelTitle, id, position, secondary },\n        anchorPoint,\n        size,\n        dimension,\n        visibleTicks: ticks,\n        parentSize,\n      } = geometry;\n      const axisSpec = getSpecsById<AxisSpec>(axesSpecs, id);\n\n      if (!axisSpec || !dimension || !position || axisSpec.hide) {\n        return;\n      }\n\n      const axisStyle = axesStyles.get(axisSpec.id) ?? sharedAxesStyle;\n\n      if (!seenAxesTitleIds.has(id)) {\n        seenAxesTitleIds.add(id);\n        renderTitle(\n          ctx,\n          false,\n          { size: parentSize, debug, panelTitle, anchorPoint, dimension, axisStyle, axisSpec },\n          locale,\n        );\n      }\n\n      const layerGirth = dimension.maxLabelBboxHeight;\n\n      renderPanel(\n        ctx,\n        {\n          panelTitle,\n          secondary,\n          panelAnchor,\n          axisSpec,\n          anchorPoint,\n          size,\n          dimension,\n          ticks,\n          axisStyle,\n          debug,\n          renderingArea,\n          layerGirth,\n        },\n        locale,\n      );\n    });\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { measureText } from '../../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Position } from '../../../../../utils/common';\nimport { innerPad, outerPad } from '../../../../../utils/dimensions';\nimport { Point } from '../../../../../utils/point';\nimport { wrapText } from '../../../../../utils/text/wrap';\nimport { isHorizontalAxis } from '../../../utils/axis_type_utils';\nimport { getAllAxisLayersGirth, getTitleDimension, shouldShowTicks } from '../../../utils/axis_utils';\nimport { AxisProps } from '../axes';\nimport { renderText, TextFont } from '../primitives/text';\nimport { renderDebugRect } from '../utils/debug';\n\ntype PanelTitleProps = Pick<AxisProps, 'panelTitle' | 'axisSpec' | 'axisStyle' | 'size' | 'dimension' | 'debug'>;\ntype TitleProps = PanelTitleProps & { anchorPoint: Point };\n\nconst titleFontDefaults: Omit<TextFont, 'fontFamily' | 'textColor' | 'fontSize'> = {\n  fontVariant: 'normal',\n  fontStyle: 'normal', // may be overridden (happens if prop on axis style is defined)\n  fontWeight: 'bold',\n  align: 'center',\n  baseline: 'middle',\n};\n\n/** @internal */\nexport function renderTitle(\n  ctx: CanvasRenderingContext2D,\n  panel: boolean,\n  {\n    size: { width, height },\n    dimension: { maxLabelBboxWidth, maxLabelBboxHeight },\n    axisSpec: { position, hide: hideAxis, title, timeAxisLayerCount },\n    axisStyle: { axisPanelTitle, axisTitle, tickLabel, tickLine },\n    panelTitle,\n    debug,\n    anchorPoint,\n  }: TitleProps,\n  locale: string,\n) {\n  const titleToRender = panel ? panelTitle : title;\n  const axisTitleToUse = panel ? axisPanelTitle : axisTitle;\n  if (!titleToRender || !axisTitleToUse.visible) {\n    return;\n  }\n  const otherAxisTitleToUse = panel ? axisTitle : axisPanelTitle;\n  const otherTitle = panel ? title : panelTitle;\n  const horizontal = isHorizontalAxis(position);\n  const font: TextFont = { ...titleFontDefaults, ...axisTitleToUse, textColor: axisTitleToUse.fill };\n  const tickDimension = shouldShowTicks(tickLine, hideAxis) ? tickLine.size + tickLine.padding : 0;\n  const maxLabelBoxGirth = horizontal ? maxLabelBboxHeight : maxLabelBboxWidth;\n  const allLayersGirth = getAllAxisLayersGirth(timeAxisLayerCount, maxLabelBoxGirth, horizontal);\n  const labelPaddingSum = innerPad(tickLabel.padding) + outerPad(tickLabel.padding);\n  const labelSize = tickLabel.visible ? allLayersGirth + labelPaddingSum : 0;\n  const otherTitleDimension = otherTitle ? getTitleDimension(otherAxisTitleToUse) : 0;\n  const titlePadding = panel || (axisTitleToUse.visible && title) ? axisTitleToUse.padding : 0;\n  const rotation = horizontal ? 0 : -90;\n  const offset =\n    position === Position.Left || position === Position.Top\n      ? outerPad(titlePadding) + (panel ? otherTitleDimension : 0)\n      : tickDimension + labelSize + innerPad(titlePadding) + (panel ? 0 : otherTitleDimension);\n  const x = anchorPoint.x + (horizontal ? 0 : offset);\n  const y = anchorPoint.y + (horizontal ? offset : height);\n  const textX = horizontal ? width / 2 + (panel ? 0 : x) : font.fontSize / 2 + (panel ? offset : x);\n  const textY = horizontal ? font.fontSize / 2 + (panel ? offset : y) : (panel ? height : -height + 2 * y) / 2;\n  const wrappedText = wrapText(\n    titleToRender ?? '',\n    font,\n    font.fontSize,\n    horizontal ? width : height,\n    1,\n    measureText(ctx),\n    locale,\n  );\n  if (!wrappedText[0]) return;\n  if (debug) renderDebugRect(ctx, { x, y, width: horizontal ? width : height, height: font.fontSize }, rotation);\n  renderText(ctx, { x: textX, y: textY }, wrappedText[0], font, rotation);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPanelClipping } from './panel_clipping';\nimport { renderShape } from './primitives/shapes';\nimport { withPanelTransform } from './utils/panel_transform';\nimport { overrideOpacity } from '../../../../common/color_library_wrappers';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { Circle, Fill, Stroke } from '../../../../geoms/types';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { PointGeometry } from '../../../../utils/geometry';\nimport { GeometryStateStyle } from '../../../../utils/themes/theme';\n\n/**\n * Renders points from single series\n *\n * @internal\n */\nexport function renderPoints(ctx: CanvasRenderingContext2D, points: PointGeometry[], { opacity }: GeometryStateStyle) {\n  points\n    .slice()\n    .sort(({ radius: a }, { radius: b }) => b - a)\n    .forEach(({ x, y, radius, transform, style }) => {\n      const coordinates = { x: x + transform.x, y: y + transform.y, radius };\n      const fill = { color: overrideOpacity(style.fill.color, (fillOpacity) => fillOpacity * opacity) };\n      const stroke = {\n        ...style.stroke,\n        color: overrideOpacity(style.stroke.color, (fillOpacity) => fillOpacity * opacity),\n      };\n      renderShape(ctx, style.shape, coordinates, fill, stroke);\n    });\n}\n\n/**\n * Renders points in group from multiple series on a single layer\n *\n * @internal\n */\nexport function renderPointGroup(\n  ctx: CanvasRenderingContext2D,\n  points: PointGeometry[],\n  geometryStateStyles: Record<SeriesKey, GeometryStateStyle>,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  shouldClip: boolean,\n) {\n  points\n    .slice()\n    .sort(({ radius: a }, { radius: b }) => b - a)\n    .forEach(({ x, y, radius, transform, style, seriesIdentifier: { key }, panel }) => {\n      const opacity = geometryStateStyles[key]?.opacity ?? 1;\n      const fill: Fill = { color: overrideOpacity(style.fill.color, (fillOpacity) => fillOpacity * opacity) };\n      const stroke: Stroke = {\n        ...style.stroke,\n        color: overrideOpacity(style.stroke.color, (fillOpacity) => fillOpacity * opacity),\n      };\n      const coordinates: Circle = { x: x + transform.x, y, radius };\n      const renderer = () => renderShape(ctx, style.shape, coordinates, fill, stroke);\n      const clippings = { area: getPanelClipping(panel, rotation), shouldClip };\n      withPanelTransform(ctx, panel, rotation, renderingArea, renderer, clippings);\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Line, Stroke } from '../../../../../geoms/types';\nimport { withContext } from '../../../../../renderers/canvas';\n\n/**\n * Canvas2d stroke ignores an exact zero line width\n * Any value that's equal to or larger than MIN_STROKE_WIDTH\n * @internal\n */\nexport const MIN_STROKE_WIDTH = 0.001;\n\n/** @internal */\nexport function renderMultiLine(ctx: CanvasRenderingContext2D, lines: Line[] | string[], stroke: Stroke) {\n  if (stroke.width < MIN_STROKE_WIDTH || lines.length === 0) {\n    return;\n  }\n  withContext(ctx, () => {\n    ctx.strokeStyle = RGBATupleToString(stroke.color);\n    ctx.lineJoin = 'round';\n    ctx.lineWidth = stroke.width;\n    if (stroke.dash) {\n      ctx.setLineDash(stroke.dash);\n    }\n\n    ctx.beginPath();\n\n    for (const line of lines) {\n      if (typeof line === 'string') {\n        ctx.stroke(new Path2D(line));\n      } else {\n        ctx.moveTo(line.x1, line.y1);\n        ctx.lineTo(line.x2, line.y2);\n      }\n    }\n    ctx.stroke();\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderMultiLine } from './line';\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Fill, Rect, Stroke } from '../../../../../geoms/types';\nimport { withClipRanges } from '../../../../../renderers/canvas';\nimport { ClippedRanges } from '../../../../../utils/geometry';\nimport { Point } from '../../../../../utils/point';\n\n/** @internal */\nexport function renderLinePaths(\n  ctx: CanvasRenderingContext2D,\n  transform: Point,\n  linePaths: Array<string>,\n  stroke: Stroke,\n  fitStroke: Stroke,\n  clippedRanges: ClippedRanges,\n  clippings: Rect,\n  shouldClip: boolean,\n) {\n  withClipRanges(ctx, clippedRanges, clippings, false, () => {\n    ctx.translate(transform.x, transform.y);\n    renderMultiLine(ctx, linePaths, stroke);\n  });\n  if (clippedRanges.length > 0 && shouldClip) {\n    withClipRanges(ctx, clippedRanges, clippings, true, () => {\n      ctx.translate(transform.x, transform.y);\n      renderMultiLine(ctx, linePaths, fitStroke);\n    });\n  }\n}\n\n/** @internal */\nexport function renderAreaPath(\n  ctx: CanvasRenderingContext2D,\n  transform: Point,\n  area: string,\n  fill: Fill,\n  fitFill: Fill,\n  clippedRanges: ClippedRanges,\n  clippings: Rect,\n  shouldClip: boolean,\n) {\n  withClipRanges(ctx, clippedRanges, clippings, false, () => renderPathFill(ctx, area, fill, transform));\n  if (clippedRanges.length > 0 && shouldClip) {\n    withClipRanges(ctx, clippedRanges, clippings, true, () => renderPathFill(ctx, area, fitFill, transform));\n  }\n}\n\nfunction renderPathFill(ctx: CanvasRenderingContext2D, path: string, fill: Fill, { x, y }: Point) {\n  ctx.translate(x, y);\n  const path2d = new Path2D(path);\n  ctx.fillStyle = RGBATupleToString(fill.color);\n  ctx.fill(path2d);\n\n  if (fill.texture) {\n    ctx.fillStyle = fill.texture.pattern;\n    ctx.fill(path2d);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { MIN_STROKE_WIDTH } from './line';\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Fill, Rect, Stroke } from '../../../../../geoms/types';\n\n/** @internal */\nexport function renderRect(\n  ctx: CanvasRenderingContext2D,\n  { x, y, width, height }: Rect,\n  { color, texture }: Fill,\n  stroke: Stroke,\n  disableBorderOffset: boolean = false,\n) {\n  const borderOffset = !disableBorderOffset && stroke.width >= MIN_STROKE_WIDTH ? stroke.width : 0;\n  if (stroke.width >= MIN_STROKE_WIDTH && height >= borderOffset && width >= borderOffset) {\n    ctx.strokeStyle = RGBATupleToString(stroke.color);\n    ctx.lineWidth = stroke.width;\n    ctx.beginPath();\n    ctx.rect(x + borderOffset / 2, y + borderOffset / 2, width - borderOffset, height - borderOffset);\n    ctx.setLineDash(stroke.dash ?? []); // no dash if stroke.dash is undefined\n    ctx.lineCap = stroke.dash?.length ? 'butt' : 'square';\n    ctx.stroke();\n  }\n\n  ctx.beginPath();\n  ctx.rect(x + borderOffset, y + borderOffset, width - borderOffset * 2, height - borderOffset * 2);\n  ctx.fillStyle = RGBATupleToString(color);\n  ctx.fill();\n\n  if (texture) {\n    ctx.fillStyle = texture.pattern;\n    ctx.fill();\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { MIN_STROKE_WIDTH } from './line';\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Circle, Fill, Stroke } from '../../../../../geoms/types';\nimport { withContext } from '../../../../../renderers/canvas';\nimport { degToRad } from '../../../../../utils/common';\nimport { PointShape } from '../../../../../utils/themes/theme';\nimport { ShapeRendererFn } from '../../shapes_paths';\n\n/** @internal */\nexport function renderShape(\n  ctx: CanvasRenderingContext2D,\n  shape: PointShape,\n  { x, y, radius }: Circle,\n  { color: fillColor }: Fill,\n  { width, dash, color: strokeColor }: Stroke,\n) {\n  withContext(ctx, () => {\n    const [pathFn, rotation] = ShapeRendererFn[shape];\n    ctx.translate(x, y);\n    ctx.rotate(degToRad(rotation));\n    ctx.beginPath();\n\n    const path = new Path2D(pathFn(radius));\n\n    ctx.fillStyle = RGBATupleToString(fillColor);\n    ctx.fill(path);\n\n    if (width > MIN_STROKE_WIDTH) {\n      ctx.strokeStyle = RGBATupleToString(strokeColor);\n      ctx.lineWidth = width;\n      ctx.setLineDash(dash ?? []);\n      ctx.stroke(path);\n    }\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Degrees } from '../../../../../common/geometry';\nimport { cssFontShorthand, Font, TextAlign, TextBaseline } from '../../../../../common/text_utils';\nimport { withContext } from '../../../../../renderers/canvas';\nimport { measureText } from '../../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { degToRad } from '../../../../../utils/common';\nimport { Point } from '../../../../../utils/point';\nimport { TextDirection } from '../../../utils/axis_utils';\n\n/** @internal */\nexport type TextFont = Font & {\n  fontSize: number;\n  align: TextAlign;\n  baseline: TextBaseline;\n  shadow?: string;\n  shadowSize?: number;\n};\n\n/** @internal */\nexport function renderText(\n  ctx: CanvasRenderingContext2D,\n  origin: Point,\n  text: string,\n  font: TextFont,\n  angle: Degrees = 0,\n  translateX: number = 0,\n  translateY: number = 0,\n  scale: number = 1,\n  // optional until all chart types support direction\n  direction?: TextDirection,\n) {\n  withContext(ctx, () => {\n    ctx.translate(origin.x, origin.y);\n    ctx.rotate(degToRad(angle));\n    ctx.translate(translateX, translateY);\n    ctx.scale(scale, scale);\n    ctx.fillStyle = font.textColor;\n    ctx.textAlign = font.align;\n    ctx.textBaseline = font.baseline;\n    ctx.font = cssFontShorthand(font, font.fontSize);\n    const shadowSize = font.shadowSize ?? 0;\n    if (direction) ctx.direction = direction;\n    if (font.shadow && shadowSize > 0) {\n      ctx.lineJoin = 'round';\n      ctx.lineWidth = shadowSize;\n      ctx.strokeStyle = font.shadow;\n      ctx.strokeText(text, 0, 0);\n    }\n    ctx.fillText(text, 0, 0);\n  });\n}\n\nconst SPACE = ' ';\nconst ELLIPSIS = '…';\nconst DASH = '-';\n\ninterface Options {\n  wrapAtWord: boolean;\n  shouldAddEllipsis: boolean;\n}\n\n/** @internal */\nexport function wrapLines(\n  ctx: CanvasRenderingContext2D,\n  text: string,\n  font: Font,\n  fontSize: number,\n  fixedWidth: number,\n  fixedHeight: number,\n  { wrapAtWord, shouldAddEllipsis }: Options = { wrapAtWord: true, shouldAddEllipsis: false },\n) {\n  const lineHeight = 1;\n  const lines = text.split('\\n');\n  let textWidth = 0;\n  const lineHeightPx = lineHeight * fontSize;\n\n  const padding = 0;\n  const maxWidth = Math.max(fixedWidth - padding * 2, 0);\n  const maxHeightPx = Math.max(fixedHeight - padding * 2, 0);\n  let currentHeightPx = 0;\n  const shouldWrap = true;\n  const textArr: string[] = [];\n  const textMeasureProcessor = measureText(ctx);\n  const getTextWidth = (textString: string) => {\n    return textMeasureProcessor(textString, font, fontSize).width;\n  };\n\n  const additionalWidth = shouldAddEllipsis ? getTextWidth(ELLIPSIS) : 0;\n  for (let i = 0, max = lines.length; i < max; ++i) {\n    let line = lines[i];\n    if (!line) continue;\n    let lineWidth = getTextWidth(line);\n    if (lineWidth > maxWidth) {\n      while (line.length > 0) {\n        let low = 0;\n        let high = line.length;\n        let match = '';\n        let matchWidth = 0;\n        while (low < high) {\n          const mid = (low + high) >>> 1;\n          const substr = line.slice(0, mid + 1);\n          const substrWidth = getTextWidth(substr) + additionalWidth;\n          if (substrWidth <= maxWidth) {\n            low = mid + 1;\n            match = substr + (shouldAddEllipsis ? ELLIPSIS : '');\n            matchWidth = substrWidth;\n          } else {\n            high = mid;\n          }\n        }\n        if (match) {\n          if (wrapAtWord) {\n            const nextChar = line[match.length];\n            const nextIsSpaceOrDash = nextChar === SPACE || nextChar === DASH;\n            const wrapIndex =\n              nextIsSpaceOrDash && matchWidth <= maxWidth\n                ? match.length\n                : Math.max(match.lastIndexOf(SPACE), match.lastIndexOf(DASH)) + 1;\n            if (wrapIndex > 0) {\n              low = wrapIndex;\n              match = match.slice(0, low);\n              matchWidth = getTextWidth(match);\n            }\n          }\n          match = match.trimEnd();\n          textArr.push(match);\n          textWidth = Math.max(textWidth, matchWidth);\n          currentHeightPx += lineHeightPx;\n          if (!shouldWrap || (fixedHeight && currentHeightPx + lineHeightPx > maxHeightPx)) {\n            break;\n          }\n          line = line.slice(low);\n          line = line.trimStart();\n          if (line.length > 0) {\n            lineWidth = getTextWidth(line);\n            if (lineWidth <= maxWidth) {\n              textArr.push(line);\n              currentHeightPx += lineHeightPx;\n              textWidth = Math.max(textWidth, lineWidth);\n              break;\n            }\n          }\n        } else {\n          break;\n        }\n      }\n    } else {\n      textArr.push(line);\n      currentHeightPx += lineHeightPx;\n      textWidth = Math.max(textWidth, lineWidth);\n    }\n    if (fixedHeight && currentHeightPx + lineHeightPx > maxHeightPx) {\n      break;\n    }\n  }\n  return {\n    lines: textArr,\n    height: fontSize,\n    width: textWidth,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnimationContext, getAnimationPoolFn } from './animations';\nimport { AnimationState } from './animations/animation';\nimport { renderAnnotations } from './annotations';\nimport { renderAreas } from './areas';\nimport { renderBars } from './bars';\nimport { renderBubbles } from './bubbles';\nimport { renderGrids } from './grids';\nimport { renderLines } from './lines';\nimport { renderGridPanels, renderPanelSubstrates } from './panels/panels';\nimport { renderDebugRect } from './utils/debug';\nimport { renderBarValues } from './values/bar';\nimport { ReactiveChartStateProps } from './xy_chart';\nimport { Colors } from '../../../../common/colors';\nimport { clearCanvas, renderLayers, withContext } from '../../../../renderers/canvas';\n\n/** @internal */\nexport function renderXYChartCanvas2d(\n  ctx: CanvasRenderingContext2D,\n  dpr: number,\n  props: ReactiveChartStateProps,\n  animationState: AnimationState,\n) {\n  function render(aCtx: AnimationContext) {\n    const imgCanvas = document.createElement('canvas');\n\n    withContext(ctx, () => {\n      // let's set the devicePixelRatio once and for all; then we'll never worry about it again\n      ctx.scale(dpr, dpr);\n      const {\n        renderingArea,\n        chartTransform,\n        rotation,\n        geometries,\n        geometriesIndex,\n        theme: { axes: sharedAxesStyle, sharedStyle, barSeriesStyle, background },\n        highlightedLegendItem,\n        annotationDimensions,\n        annotationSpecs,\n        perPanelAxisGeoms,\n        perPanelGridLines,\n        axesSpecs,\n        axesStyles,\n        debug,\n        panelGeoms,\n        hoveredAnnotationIds,\n        locale,\n      } = props;\n\n      const transform = { x: renderingArea.left + chartTransform.x, y: renderingArea.top + chartTransform.y };\n\n      renderLayers(ctx, [\n        () => clearCanvas(ctx, 'transparent'),\n\n        // render panel grid\n        () => debug && renderGridPanels(ctx, transform, panelGeoms),\n\n        () =>\n          renderGrids(ctx, {\n            axesSpecs,\n            renderingArea,\n            perPanelGridLines,\n            axesStyles,\n            sharedAxesStyle,\n          }),\n\n        () =>\n          renderPanelSubstrates(\n            ctx,\n            {\n              axesSpecs,\n              perPanelAxisGeoms,\n              renderingArea,\n              debug,\n              axesStyles,\n              sharedAxesStyle,\n            },\n            locale,\n          ),\n\n        // rendering background annotations\n        () =>\n          renderAnnotations(\n            ctx,\n            aCtx,\n            annotationDimensions,\n            annotationSpecs,\n            rotation,\n            renderingArea,\n            sharedStyle,\n            hoveredAnnotationIds,\n            true,\n          ),\n\n        // rendering bars\n        () => renderBars(ctx, imgCanvas, geometries.bars, sharedStyle, rotation, renderingArea, highlightedLegendItem),\n\n        // rendering areas\n        () =>\n          renderAreas(ctx, imgCanvas, geometries.areas, sharedStyle, rotation, renderingArea, highlightedLegendItem),\n\n        // rendering lines\n        () => renderLines(ctx, geometries.lines, sharedStyle, rotation, renderingArea, highlightedLegendItem),\n\n        // rendering bubbles\n        () => renderBubbles(ctx, geometries.bubbles, sharedStyle, rotation, renderingArea, highlightedLegendItem),\n\n        () =>\n          geometries.bars.forEach(({ value: bars, panel }) =>\n            renderBarValues(ctx, {\n              bars,\n              panel,\n              renderingArea,\n              rotation,\n              debug,\n              barSeriesStyle,\n              background,\n            }),\n          ),\n\n        // rendering foreground annotations\n        () =>\n          renderAnnotations(\n            ctx,\n            aCtx,\n            annotationDimensions,\n            annotationSpecs,\n            rotation,\n            renderingArea,\n            sharedStyle,\n            hoveredAnnotationIds,\n            false,\n          ),\n\n        // rendering debugger\n        () =>\n          debug &&\n          withContext(ctx, () => {\n            const { left, top, width, height } = renderingArea;\n\n            renderDebugRect(\n              ctx,\n              { x: left, y: top, width, height },\n              0,\n              { color: Colors.Transparent.rgba },\n              { color: Colors.Red.rgba, width: 4, dash: [4, 4] },\n            );\n            const voronoi = geometriesIndex.triangulation([0, 0, width, height]);\n            if (voronoi) {\n              ctx.beginPath();\n              ctx.translate(left, top);\n              ctx.setLineDash([5, 5]);\n              voronoi.render(ctx);\n              ctx.lineWidth = 1;\n              ctx.strokeStyle = 'blue';\n              ctx.stroke();\n            }\n          }),\n      ]);\n    });\n  }\n\n  void getAnimationPoolFn(animationState, render);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Color } from '../../../../../common/colors';\nimport { Fill } from '../../../../../geoms/types';\nimport { ColorVariant, getColorFromVariant } from '../../../../../utils/common';\nimport { GeometryStateStyle, AreaStyle } from '../../../../../utils/themes/theme';\nimport { getTextureStyles } from '../../../utils/texture';\n\n/**\n * Return the rendering props for an area. The color of the area will be overwritten\n * by the fill color of the themeAreaStyle parameter if present\n * @internal\n */\nexport function buildAreaStyles(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  baseColor: Color | ColorVariant,\n  themeAreaStyle: AreaStyle,\n  geometryStateStyle: GeometryStateStyle,\n): Fill {\n  const texture = getTextureStyles(ctx, imgCanvas, baseColor, geometryStateStyle.opacity, themeAreaStyle.texture);\n  const color = overrideOpacity(\n    colorToRgba(getColorFromVariant(baseColor, themeAreaStyle.fill)),\n    (opacity) => opacity * geometryStateStyle.opacity * themeAreaStyle.opacity,\n  );\n\n  return {\n    color,\n    texture,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Stroke, Fill, Rect } from '../../../../../geoms/types';\nimport { getColorFromVariant } from '../../../../../utils/common';\nimport { GeometryStateStyle, RectStyle, RectBorderStyle } from '../../../../../utils/themes/theme';\nimport { getTextureStyles } from '../../../utils/texture';\n\n/**\n * Return the rendering styles (stroke and fill) for a bar.\n * The full color of the bar will be overwritten by the fill color\n * of the themeRectStyle parameter if present.\n * The stroke color of the bar will be overwritten by the stroke color\n * of the themeRectBorderStyle parameter if present.\n * @internal\n */\nexport function buildBarStyle(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  baseColor: string,\n  themeRectStyle: RectStyle,\n  themeRectBorderStyle: RectBorderStyle,\n  geometryStateStyle: GeometryStateStyle,\n  rect: Rect,\n): { fill: Fill; stroke: Stroke } {\n  const texture = getTextureStyles(ctx, imgCanvas, baseColor, geometryStateStyle.opacity, themeRectStyle.texture);\n  const fillColor = overrideOpacity(\n    colorToRgba(getColorFromVariant(baseColor, themeRectStyle.fill)),\n    (opacity) => opacity * themeRectStyle.opacity * geometryStateStyle.opacity,\n  );\n  const fill: Fill = {\n    color: fillColor,\n    texture,\n  };\n\n  const strokeColor = overrideOpacity(\n    colorToRgba(getColorFromVariant(baseColor, themeRectBorderStyle.stroke)),\n    (opacity) => opacity * geometryStateStyle.opacity * (themeRectBorderStyle.strokeOpacity ?? themeRectStyle.opacity),\n  );\n  const stroke: Stroke = {\n    color: strokeColor,\n    width:\n      themeRectBorderStyle.visible && rect.height > themeRectBorderStyle.strokeWidth\n        ? themeRectBorderStyle.strokeWidth\n        : 0,\n  };\n  return { fill, stroke };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Stroke } from '../../../../../geoms/types';\nimport { getColorFromVariant } from '../../../../../utils/common';\nimport { GeometryStateStyle, LineStyle } from '../../../../../utils/themes/theme';\n\n/**\n * Return the rendering props for a line. The color of the line will be overwritten\n * by the stroke color of the themeLineStyle parameter if present\n * @param baseColor the assigned color of the line for this series\n * @param themeLineStyle the theme style for the line series\n * @param geometryStateStyle the highlight geometry style\n * @internal\n */\nexport function buildLineStyles(\n  baseColor: string,\n  themeLineStyle: LineStyle,\n  geometryStateStyle: GeometryStateStyle,\n): Stroke {\n  const strokeColor = overrideOpacity(\n    colorToRgba(getColorFromVariant(baseColor, themeLineStyle.stroke)),\n    (opacity) => opacity * themeLineStyle.opacity * geometryStateStyle.opacity,\n  );\n  return {\n    color: strokeColor,\n    width: themeLineStyle.strokeWidth,\n    dash: themeLineStyle.dash,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Fill, Stroke, Rect } from '../../../../../geoms/types';\nimport { withContext } from '../../../../../renderers/canvas';\nimport { degToRad } from '../../../../../utils/common';\nimport { Point } from '../../../../../utils/point';\nimport { renderRect } from '../primitives/rect';\n\nconst DEFAULT_DEBUG_FILL: Fill = {\n  color: [238, 130, 238, 0.2], // violet\n};\nconst DEFAULT_DEBUG_STROKE: Stroke = {\n  color: [0, 0, 0, 0.2],\n  width: 1,\n};\n\n/** @internal */\nexport function renderDebugRect(\n  ctx: CanvasRenderingContext2D,\n  rect: Rect,\n  rotation = 0,\n  fill = DEFAULT_DEBUG_FILL,\n  stroke = DEFAULT_DEBUG_STROKE,\n) {\n  withContext(ctx, () => {\n    ctx.translate(rect.x, rect.y);\n    ctx.rotate(degToRad(rotation));\n    renderRect(ctx, { ...rect, x: 0, y: 0 }, fill, stroke, true);\n  });\n}\n\n/** @internal */\nexport function renderDebugRectCenterRotated(\n  ctx: CanvasRenderingContext2D,\n  center: Point,\n  rect: Rect,\n  fill = DEFAULT_DEBUG_FILL,\n  stroke = DEFAULT_DEBUG_STROKE,\n  rotation: number = 0,\n) {\n  const { x, y } = center;\n\n  withContext(ctx, () => {\n    ctx.translate(x, y);\n    ctx.rotate(degToRad(rotation));\n    ctx.translate(-x, -y);\n    renderRect(ctx, { ...rect, x: x - rect.width / 2, y: y - rect.height / 2 }, fill, stroke);\n  });\n}\n\n/** @internal */\nexport function renderDebugPoint(\n  ctx: CanvasRenderingContext2D,\n  x: number,\n  y: number,\n  size = 16,\n  stroke = DEFAULT_DEBUG_STROKE,\n) {\n  withContext(ctx, () => {\n    ctx.beginPath();\n    ctx.lineWidth = stroke.width;\n    ctx.strokeStyle = RGBATupleToString(stroke.color);\n\n    ctx.moveTo(x - size, y);\n    ctx.lineTo(x + size, y);\n\n    ctx.moveTo(x, y - size);\n    ctx.lineTo(x, y + size);\n\n    ctx.stroke();\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { hasMostlyRTLItems } from '../../../../../utils/common';\nimport { PerPanelAxisGeoms } from '../../../state/selectors/compute_per_panel_axes_geoms';\n\n/** @internal */\nexport function hasMostlyRTL(geoms: PerPanelAxisGeoms[]): boolean {\n  // returns all string value labels\n  const labels = geoms.flatMap(({ axesGeoms }) => {\n    return axesGeoms.flatMap(({ visibleTicks }) => {\n      return visibleTicks\n        .filter(({ value, label }) => typeof value === 'string' && label !== '')\n        .map(({ label }) => label);\n    });\n  });\n\n  return hasMostlyRTLItems(labels);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Rect } from '../../../../../geoms/types';\nimport { CanvasRenderer, withContext } from '../../../../../renderers/canvas';\nimport { degToRad, Rotation } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { computeChartTransform } from '../../../state/utils/utils';\n\n/** @internal */\nexport function withPanelTransform(\n  ctx: CanvasRenderingContext2D,\n  panel: Dimensions,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  fn: CanvasRenderer,\n  clippings?: {\n    area: Rect;\n    shouldClip?: boolean;\n  },\n) {\n  const transform = computeChartTransform(panel, rotation);\n  withContext(ctx, () => {\n    ctx.translate(renderingArea.left + panel.left + transform.x, renderingArea.top + panel.top + transform.y);\n    ctx.rotate(degToRad(rotation));\n\n    if (clippings?.shouldClip) {\n      const { x, y, width, height } = clippings.area;\n      ctx.beginPath();\n      ctx.rect(x, y, width, height);\n      ctx.clip();\n    }\n    fn(ctx);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Colors } from '../../../../../common/colors';\nimport { fillTextColor } from '../../../../../common/fill_text_color';\nimport { Font, TextAlign, TextBaseline } from '../../../../../common/text_utils';\nimport { Rect } from '../../../../../geoms/types';\nimport { HorizontalAlignment, Rotation, VerticalAlignment } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { BarGeometry } from '../../../../../utils/geometry';\nimport { BackgroundStyle, TextAlignment, Theme } from '../../../../../utils/themes/theme';\nimport { LabelOverflowConstraint } from '../../../utils/specs';\nimport { renderText } from '../primitives/text';\nimport { renderDebugRect } from '../utils/debug';\nimport { withPanelTransform } from '../utils/panel_transform';\n\ninterface BarValuesProps {\n  barSeriesStyle: Theme['barSeriesStyle'];\n  renderingArea: Dimensions;\n  rotation: Rotation;\n  debug: boolean;\n  bars: BarGeometry[];\n  panel: Dimensions;\n  background: BackgroundStyle;\n}\n\nconst CHART_DIRECTION: Record<string, Rotation> = {\n  BottomUp: 0,\n  TopToBottom: 180,\n  LeftToRight: 90,\n  RightToLeft: -90,\n};\n\n/** @internal */\nexport function renderBarValues(ctx: CanvasRenderingContext2D, props: BarValuesProps) {\n  const { bars, debug, rotation, renderingArea, barSeriesStyle, panel, background } = props;\n  const { fontFamily, fontStyle, fill, alignment } = barSeriesStyle.displayValue;\n  bars.forEach((bar) => {\n    if (!bar.displayValue) {\n      return;\n    }\n    const { text, fontSize, fontScale, overflowConstraints } = bar.displayValue;\n    const shadowSize = getTextBorderSize(fill);\n    const { fillColor, shadowColor } = getTextColors(fill, bar.color, background);\n    const font: Font = {\n      fontFamily,\n      fontStyle: fontStyle ?? 'normal',\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      textColor: fillColor,\n    };\n\n    const { x, y, align, baseline, rect, overflow } = positionText(\n      bar,\n      bar.displayValue,\n      rotation,\n      barSeriesStyle.displayValue,\n      alignment,\n    );\n\n    if (overflowConstraints.has(LabelOverflowConstraint.ChartEdges) && isOverflow(rect, renderingArea, rotation)) {\n      return;\n    }\n    if (overflowConstraints.has(LabelOverflowConstraint.BarGeometry) && overflow) {\n      return;\n    }\n    const lines = [text];\n    const { width, height } = bar.displayValue;\n\n    if (debug) withPanelTransform(ctx, panel, rotation, renderingArea, () => renderDebugRect(ctx, rect));\n\n    lines.forEach((textLine, j) => {\n      const origin = lineOrigin(x, y, rotation, j, lines.length, width, height);\n      const fontAugment = { fontSize, align, baseline, shadow: shadowColor, shadowSize };\n      withPanelTransform(ctx, panel, rotation, renderingArea, () =>\n        renderText(ctx, origin, textLine, { ...font, ...fontAugment }, -rotation, 0, 0, fontScale),\n      );\n    });\n  });\n}\n\nfunction lineOrigin(x: number, y: number, rotation: Rotation, i: number, max: number, width: number, height: number) {\n  const size = Math.abs(rotation) === 90 ? width : height;\n  const sizeMultiplier = rotation > 0 ? -(i - max + 1) : rotation === 0 ? i : 0;\n  return { x, y: y + size * sizeMultiplier };\n}\n\nfunction positionText(\n  geom: BarGeometry,\n  valueBox: { width: number; height: number },\n  chartRotation: Rotation,\n  offsets: { offsetX: number; offsetY: number },\n  alignment?: TextAlignment,\n): { x: number; y: number; align: TextAlign; baseline: TextBaseline; rect: Rect; overflow: boolean } {\n  const { offsetX, offsetY } = offsets;\n\n  const horizontal = alignment?.horizontal;\n  const vertical = alignment?.vertical;\n  const horizontalOverflow = valueBox.width > geom.width || valueBox.height > geom.height;\n  const verticalOverflow = valueBox.height > geom.width || valueBox.width > geom.height;\n\n  switch (chartRotation) {\n    case CHART_DIRECTION.TopToBottom: {\n      const alignmentOffsetX =\n        horizontal === HorizontalAlignment.Left\n          ? geom.width / 2 - valueBox.width / 2\n          : horizontal === HorizontalAlignment.Right\n            ? -geom.width / 2 + valueBox.width / 2\n            : 0;\n      const alignmentOffsetY =\n        vertical === VerticalAlignment.Top\n          ? geom.height - valueBox.height\n          : vertical === VerticalAlignment.Middle\n            ? geom.height / 2 - valueBox.height / 2\n            : 0;\n      const x = geom.x + geom.width / 2 - offsetX + alignmentOffsetX;\n      const y = geom.y + offsetY + alignmentOffsetY;\n      const rect = { x: x - valueBox.width / 2, y, width: valueBox.width, height: valueBox.height };\n      return { x, y, rect, align: 'center', baseline: 'bottom', overflow: horizontalOverflow };\n    }\n    case CHART_DIRECTION.RightToLeft: {\n      const alignmentOffsetX =\n        horizontal === HorizontalAlignment.Right\n          ? geom.height - valueBox.width\n          : horizontal === HorizontalAlignment.Center\n            ? geom.height / 2 - valueBox.width / 2\n            : 0;\n      const alignmentOffsetY =\n        vertical === VerticalAlignment.Bottom\n          ? -geom.width + valueBox.height\n          : vertical === VerticalAlignment.Middle\n            ? -geom.width / 2 + valueBox.height / 2\n            : 0;\n      const x = geom.x + geom.width + offsetY + alignmentOffsetY;\n      const y = geom.y - offsetX + alignmentOffsetX;\n      const rect = { x: x - valueBox.height, y, width: valueBox.height, height: valueBox.width };\n      return { x, y, rect, align: 'left', baseline: 'top', overflow: verticalOverflow };\n    }\n    case CHART_DIRECTION.LeftToRight: {\n      const alignmentOffsetX =\n        horizontal === HorizontalAlignment.Left\n          ? geom.height - valueBox.width\n          : horizontal === HorizontalAlignment.Center\n            ? geom.height / 2 - valueBox.width / 2\n            : 0;\n      const alignmentOffsetY =\n        vertical === VerticalAlignment.Bottom\n          ? geom.width - valueBox.height\n          : vertical === VerticalAlignment.Middle\n            ? geom.width / 2 - valueBox.height / 2\n            : 0;\n      const x = geom.x - offsetY + alignmentOffsetY;\n      const y = geom.y + offsetX + alignmentOffsetX;\n      const rect = { x, y, width: valueBox.height, height: valueBox.width };\n      return { x, y, rect, align: 'right', baseline: 'top', overflow: verticalOverflow };\n    }\n    case CHART_DIRECTION.BottomUp:\n    default: {\n      const alignmentOffsetX =\n        horizontal === HorizontalAlignment.Left\n          ? -geom.width / 2 + valueBox.width / 2\n          : horizontal === HorizontalAlignment.Right\n            ? geom.width / 2 - valueBox.width / 2\n            : 0;\n      const alignmentOffsetY =\n        vertical === VerticalAlignment.Bottom\n          ? geom.height - valueBox.height\n          : vertical === VerticalAlignment.Middle\n            ? geom.height / 2 - valueBox.height / 2\n            : 0;\n      const x = geom.x + geom.width / 2 - offsetX + alignmentOffsetX;\n      const y = geom.y - offsetY + alignmentOffsetY;\n      const rect = { x: x - valueBox.width / 2, y, width: valueBox.width, height: valueBox.height };\n      return { x, y, rect, align: 'center', baseline: 'top', overflow: horizontalOverflow };\n    }\n  }\n}\n\nfunction isOverflow(rect: Rect, chartDimensions: Dimensions, chartRotation: Rotation) {\n  const vertical = Math.abs(chartRotation) === 90;\n  const cWidth = vertical ? chartDimensions.height : chartDimensions.width;\n  const cHeight = vertical ? chartDimensions.width : chartDimensions.height;\n  return rect.x < 0 || rect.x + rect.width > cWidth || rect.y < 0 || rect.y + rect.height > cHeight;\n}\n\ntype ValueFillDefinition = Theme['barSeriesStyle']['displayValue']['fill'];\n\nfunction getTextColors(\n  fillDefinition: ValueFillDefinition,\n  geometryColor: string,\n  { color: backgroundColor, fallbackColor: fallbackBGColor }: BackgroundStyle,\n): { fillColor: string; shadowColor: string } {\n  if (typeof fillDefinition === 'string') {\n    return { fillColor: fillDefinition, shadowColor: Colors.Transparent.keyword };\n  }\n  if ('color' in fillDefinition) {\n    return {\n      fillColor: fillDefinition.color,\n      shadowColor: fillDefinition.borderColor || Colors.Transparent.keyword,\n    };\n  }\n  const fillColor = fillTextColor(fallbackBGColor, geometryColor, backgroundColor).color.keyword;\n  const shadowColor = fillTextColor(fallbackBGColor, fillColor, backgroundColor).color.keyword;\n\n  return {\n    fillColor,\n    shadowColor,\n  };\n}\n\nconst DEFAULT_BORDER_WIDTH = 1.5;\nconst MAX_BORDER_WIDTH = 8;\n\nfunction getTextBorderSize(fill: ValueFillDefinition): number {\n  if (typeof fill === 'string') {\n    return DEFAULT_BORDER_WIDTH;\n  }\n  if ('borderWidth' in fill) {\n    return Math.min(fill.borderWidth ?? DEFAULT_BORDER_WIDTH, MAX_BORDER_WIDTH);\n  }\n  const borderWidth =\n    'textBorder' in fill && typeof fill.textBorder === 'number' ? fill.textBorder : DEFAULT_BORDER_WIDTH;\n  return Math.min(borderWidth, MAX_BORDER_WIDTH);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { AnimationState } from './animations/animation';\nimport { renderXYChartCanvas2d } from './renderers';\nimport { hasMostlyRTL } from './utils/has_mostly_rtl';\nimport { LegendItem } from '../../../../common/legend';\nimport { ScreenReaderSummary } from '../../../../components/accessibility';\nimport { settingsBuildProps } from '../../../../specs';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { computePanelsSelectors, PanelGeoms } from '../../../../state/selectors/compute_panels';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { deepEqual } from '../../../../utils/fast_deep_equal';\nimport { AnnotationId, AxisId } from '../../../../utils/ids';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme, AxisStyle } from '../../../../utils/themes/theme';\nimport { AnnotationDimensions } from '../../annotations/types';\nimport { computeAnnotationDimensionsSelector } from '../../state/selectors/compute_annotations';\nimport { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions';\nimport { computeChartTransformSelector } from '../../state/selectors/compute_chart_transform';\nimport {\n  computePerPanelAxesGeomsSelector,\n  PerPanelAxisGeoms,\n} from '../../state/selectors/compute_per_panel_axes_geoms';\nimport { computeSeriesGeometriesSelector } from '../../state/selectors/compute_series_geometries';\nimport { getAxesStylesSelector } from '../../state/selectors/get_axis_styles';\nimport { getGridLinesSelector } from '../../state/selectors/get_grid_lines';\nimport { getHighlightedAnnotationIdsSelector } from '../../state/selectors/get_highlighted_annotation_ids_selector';\nimport { getHighlightedSeriesSelector } from '../../state/selectors/get_highlighted_series';\nimport { getAnnotationSpecsSelector, getAxisSpecsSelector } from '../../state/selectors/get_specs';\nimport { isChartEmptySelector } from '../../state/selectors/is_chart_empty';\nimport { Geometries, Transform } from '../../state/utils/types';\nimport { LinesGrid } from '../../utils/grid_lines';\nimport { IndexedGeometryMap } from '../../utils/indexed_geometry_map';\nimport { AxisSpec, AnnotationSpec } from '../../utils/specs';\n\n/** @internal */\nexport interface ReactiveChartStateProps {\n  isRTL: boolean;\n  initialized: boolean;\n  debug: boolean;\n  isChartEmpty: boolean;\n  geometries: Geometries;\n  geometriesIndex: IndexedGeometryMap;\n  theme: Theme;\n  chartContainerDimensions: Dimensions;\n  rotation: Rotation;\n  renderingArea: Dimensions;\n  chartTransform: Transform;\n  highlightedLegendItem?: LegendItem;\n  hoveredAnnotationIds: string[];\n  axesSpecs: AxisSpec[];\n  perPanelAxisGeoms: Array<PerPanelAxisGeoms>;\n  perPanelGridLines: Array<LinesGrid>;\n  axesStyles: Map<AxisId, AxisStyle | null>;\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>;\n  annotationSpecs: AnnotationSpec[];\n  panelGeoms: PanelGeoms;\n  a11ySettings: A11ySettings;\n  locale: string;\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface ReactiveChartOwnProps {\n  forwardCanvasRef: RefObject<HTMLCanvasElement>;\n}\n\ntype XYChartProps = ReactiveChartStateProps & ReactiveChartDispatchProps & ReactiveChartOwnProps;\n\nclass XYChartComponent extends React.Component<XYChartProps> {\n  static displayName = 'XYChart';\n\n  private ctx: CanvasRenderingContext2D | null;\n  private animationState: AnimationState;\n\n  // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example\n  private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `<canvas>` dimensions\n\n  constructor(props: Readonly<XYChartProps>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n    this.animationState = { rafId: NaN, pool: new Map() };\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  shouldComponentUpdate(nextProps: ReactiveChartStateProps) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  componentWillUnmount() {\n    window.cancelAnimationFrame(this.animationState.rafId);\n    this.animationState.pool.clear();\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      renderXYChartCanvas2d(this.ctx, this.devicePixelRatio, this.props, this.animationState);\n    }\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardCanvasRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  render() {\n    const {\n      forwardCanvasRef,\n      initialized,\n      isChartEmpty,\n      chartContainerDimensions: { width, height },\n      a11ySettings,\n      debug,\n      isRTL,\n    } = this.props;\n\n    if (!initialized || isChartEmpty) {\n      this.ctx = null;\n      return null;\n    }\n\n    return (\n      <>\n        <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n          <canvas\n            dir={isRTL ? 'rtl' : 'ltr'}\n            ref={forwardCanvasRef}\n            className=\"echCanvasRenderer\"\n            width={width * this.devicePixelRatio}\n            height={height * this.devicePixelRatio}\n            style={{\n              width,\n              height,\n            }}\n            // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n            role=\"presentation\"\n          />\n          {!debug && <ScreenReaderSummary />}\n        </figure>\n        {debug && <ScreenReaderSummary />}\n      </>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  isRTL: false,\n  initialized: false,\n  debug: false,\n  isChartEmpty: true,\n  geometries: {\n    areas: [],\n    bars: [],\n    lines: [],\n    points: [],\n    bubbles: [],\n  },\n  geometriesIndex: new IndexedGeometryMap(),\n  theme: LIGHT_THEME,\n  chartContainerDimensions: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  rotation: 0 as const,\n  renderingArea: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  chartTransform: {\n    x: 0,\n    y: 0,\n    rotate: 0,\n  },\n  axesSpecs: [],\n  perPanelAxisGeoms: [],\n  perPanelGridLines: [],\n  axesStyles: new Map(),\n  hoveredAnnotationIds: [],\n  annotationDimensions: new Map(),\n  annotationSpecs: [],\n  panelGeoms: [],\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  locale: settingsBuildProps.defaults.locale,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n\n  const { geometries, geometriesIndex } = computeSeriesGeometriesSelector(state);\n  const { debug, locale } = getSettingsSpecSelector(state);\n  const perPanelAxisGeoms = computePerPanelAxesGeomsSelector(state);\n\n  return {\n    locale,\n    isRTL: hasMostlyRTL(perPanelAxisGeoms),\n    initialized: true,\n    isChartEmpty: isChartEmptySelector(state),\n    debug,\n    geometries,\n    geometriesIndex,\n    theme: getChartThemeSelector(state),\n    chartContainerDimensions: getChartContainerDimensionsSelector(state),\n    highlightedLegendItem: getHighlightedSeriesSelector(state),\n    hoveredAnnotationIds: getHighlightedAnnotationIdsSelector(state),\n    rotation: getChartRotationSelector(state),\n    renderingArea: computeChartDimensionsSelector(state).chartDimensions,\n    chartTransform: computeChartTransformSelector(state),\n    axesSpecs: getAxisSpecsSelector(state),\n    perPanelAxisGeoms,\n    perPanelGridLines: getGridLinesSelector(state),\n    axesStyles: getAxesStylesSelector(state),\n    annotationDimensions: computeAnnotationDimensionsSelector(state),\n    annotationSpecs: getAnnotationSpecsSelector(state),\n    panelGeoms: computePanelsSelectors(state),\n    a11ySettings: getA11ySettingsSelector(state),\n  };\n};\n\n/** @internal */\nexport const XYChart = connect(mapStateToProps, mapDispatchToProps)(XYChartComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnimationConfig, AnnotationAnimationTrigger } from './../../utils/specs';\nimport { mergePartial } from '../../../../utils/common';\nimport { GeometryStateStyle, SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { TimeFunction } from '../../../../utils/time_functions';\nimport { AnimationOptions } from '../canvas/animations/animation';\n\nconst DEFAULT_ANNOTATION_ANIMATION_OPTIONS: AnimationOptions = {\n  enabled: true,\n  duration: 250,\n  delay: 50,\n  snapValues: [],\n  timeFunction: TimeFunction.easeInOut,\n};\n\n/** @internal */\nexport interface AnnotationHoverParams {\n  style: GeometryStateStyle;\n  isHighlighted: boolean;\n  shouldTransition: boolean;\n  options: AnimationOptions;\n}\n\n/** @internal */\nexport type GetAnnotationParamsFn = (id: string) => AnnotationHoverParams;\n\n/**\n * Returns function to get geometry styles for a given id\n * @internal\n */\nexport const getAnnotationHoverParamsFn =\n  (\n    hoveredElementIds: string[],\n    styles: SharedGeometryStateStyle,\n    animations: AnimationConfig<AnnotationAnimationTrigger>[] = [],\n  ): GetAnnotationParamsFn =>\n  (id) => {\n    const fadeOutConfig = animations.find(({ trigger }) => trigger === AnnotationAnimationTrigger.FadeOnFocusingOthers);\n    const isHighlighted = hoveredElementIds.includes(id);\n    const style =\n      hoveredElementIds.length === 0 || !fadeOutConfig\n        ? styles.default\n        : isHighlighted\n          ? styles.highlighted\n          : styles.unhighlighted;\n    const shouldTransition = !isHighlighted && hoveredElementIds.length > 0;\n\n    return {\n      style,\n      isHighlighted,\n      shouldTransition,\n      options: mergePartial(DEFAULT_ANNOTATION_ANIMATION_OPTIONS, fadeOutConfig?.options),\n    };\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { useCallback, useMemo, useEffect, RefObject } from 'react';\n\nimport { TooltipContent } from './tooltip_content';\nimport { TooltipPortal, Placement, TooltipPortalSettings } from '../../../../../components/portal';\nimport { TooltipWrapper } from '../../../../../components/tooltip';\nimport { AnnotationTooltipState } from '../../../annotations/types';\n\ninterface AnnotationTooltipProps {\n  state: AnnotationTooltipState | null;\n  chartRef: RefObject<HTMLDivElement>;\n  chartId: string;\n  zIndex: number;\n  onScroll?: () => void;\n}\n\n/** @internal */\nexport const AnnotationTooltip = ({ state, chartRef, chartId, onScroll, zIndex }: AnnotationTooltipProps) => {\n  const renderTooltip = useCallback(() => {\n    if (!state || !state.isVisible) {\n      return null;\n    }\n\n    return (\n      <TooltipWrapper\n        // actions not used on annotations yet\n        actions={[]}\n        actionPrompt=\"\"\n        pinningPrompt=\"\"\n        selectionPrompt=\"\"\n        actionsLoading=\"\"\n        noActionsLoaded=\"\"\n        className=\"echAnnotation\"\n      >\n        <TooltipContent {...state} />\n      </TooltipWrapper>\n    );\n  }, [state]);\n\n  const handleScroll = () => {\n    // TODO: handle scroll cursor update\n    if (onScroll) {\n      onScroll();\n    }\n  };\n\n  useEffect(() => {\n    if (onScroll) {\n      window.addEventListener('scroll', handleScroll, true);\n      return () => window.removeEventListener('scroll', handleScroll, true);\n    }\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  const popperSettings = useMemo((): TooltipPortalSettings | undefined => {\n    const settings = state?.tooltipSettings;\n    if (!settings) {\n      return;\n    }\n\n    const { placement, boundary, ...rest } = settings;\n\n    return {\n      ...rest,\n      placement: placement ?? Placement.Right,\n      boundary: boundary === 'chart' ? chartRef.current ?? undefined : boundary,\n    };\n  }, [state?.tooltipSettings, chartRef]);\n\n  const position = useMemo(() => state?.anchor ?? null, [state?.anchor]);\n  if (!state?.isVisible) {\n    return null;\n  }\n  return (\n    <TooltipPortal\n      scope=\"AnnotationTooltip\"\n      chartId={chartId}\n      // increasing by 100 the tooltip portal zIndex to avoid conflicts with highlighters and other elements in the DOM\n      zIndex={zIndex + 100}\n      anchor={{\n        position,\n        appendRef: chartRef,\n      }}\n      visible={state?.isVisible ?? false}\n      settings={popperSettings}\n    >\n      {renderTooltip()}\n    </TooltipPortal>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject, useCallback } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { AnnotationTooltip } from './annotation_tooltip';\nimport { LineMarker } from './line_marker';\nimport {\n  onDOMElementEnter as onDOMElementEnterAction,\n  onDOMElementLeave as onDOMElementLeaveAction,\n  onDOMElementClick as onDOMElementClickAction,\n  onDOMElementClick,\n} from '../../../../../state/actions/dom_element';\nimport { onPointerMove as onPointerMoveAction } from '../../../../../state/actions/mouse';\nimport { GlobalChartState, BackwardRef } from '../../../../../state/chart_state';\nimport { getChartThemeSelector } from '../../../../../state/selectors/get_chart_theme';\nimport {\n  getInternalIsInitializedSelector,\n  InitStatus,\n} from '../../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../../state/selectors/get_settings_spec';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { AnnotationId } from '../../../../../utils/ids';\nimport { LIGHT_THEME } from '../../../../../utils/themes/light_theme';\nimport { SharedGeometryStateStyle } from '../../../../../utils/themes/theme';\nimport { AnnotationLineProps } from '../../../annotations/line/types';\nimport { AnnotationDimensions, AnnotationTooltipState } from '../../../annotations/types';\nimport { computeAnnotationDimensionsSelector } from '../../../state/selectors/compute_annotations';\nimport { computeChartDimensionsSelector } from '../../../state/selectors/compute_chart_dimensions';\nimport { getAnnotationTooltipStateSelector } from '../../../state/selectors/get_annotation_tooltip_state';\nimport { getHighlightedAnnotationIdsSelector } from '../../../state/selectors/get_highlighted_annotation_ids_selector';\nimport { getAnnotationSpecsSelector } from '../../../state/selectors/get_specs';\nimport { isChartEmptySelector } from '../../../state/selectors/is_chart_empty';\nimport { getSpecsById } from '../../../state/utils/spec';\nimport { isLineAnnotation, AnnotationSpec, AnnotationAnimationConfig } from '../../../utils/specs';\nimport { getAnnotationHoverParamsFn } from '../../common/utils';\n\ninterface AnnotationsDispatchProps {\n  onPointerMove: typeof onPointerMoveAction;\n  onDOMElementEnter: typeof onDOMElementEnterAction;\n  onDOMElementLeave: typeof onDOMElementLeaveAction;\n}\n\ninterface AnnotationsStateProps {\n  isChartEmpty: boolean;\n  tooltipState: AnnotationTooltipState | null;\n  chartDimensions: Dimensions;\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>;\n  sharedStyle: SharedGeometryStateStyle;\n  annotationSpecs: AnnotationSpec[];\n  chartId: string;\n  zIndex: number;\n  hoveredAnnotationIds: string[];\n  clickable: boolean;\n}\n\ninterface AnnotationsOwnProps {\n  getChartContainerRef: BackwardRef;\n  chartAreaRef: RefObject<HTMLCanvasElement>;\n}\n\ntype AnnotationsProps = AnnotationsDispatchProps & AnnotationsStateProps & AnnotationsOwnProps;\n\nfunction renderAnnotationLineMarkers(\n  chartAreaRef: RefObject<HTMLCanvasElement>,\n  chartDimensions: Dimensions,\n  annotationLines: AnnotationLineProps[],\n  onDOMElementEnter: typeof onDOMElementEnterAction,\n  onDOMElementLeave: typeof onDOMElementLeaveAction,\n  hoveredIds: string[],\n  sharedStyle: SharedGeometryStateStyle,\n  clickable: boolean,\n  animations?: AnnotationAnimationConfig[],\n) {\n  const getHoverParams = getAnnotationHoverParamsFn(hoveredIds, sharedStyle, animations);\n  return annotationLines.reduce<JSX.Element[]>((acc, { markers, ...props }: AnnotationLineProps) => {\n    if (!markers[0]) return acc;\n\n    acc.push(\n      <LineMarker\n        {...props}\n        marker={markers[0]}\n        key={`annotation-${props.id}`}\n        chartAreaRef={chartAreaRef}\n        chartDimensions={chartDimensions}\n        onDOMElementEnter={onDOMElementEnter}\n        onDOMElementLeave={onDOMElementLeave}\n        onDOMElementClick={onDOMElementClick}\n        clickable={clickable}\n        getHoverParams={getHoverParams}\n      />,\n    );\n\n    return acc;\n  }, []);\n}\nconst AnnotationsComponent = ({\n  tooltipState,\n  isChartEmpty,\n  chartDimensions,\n  annotationSpecs,\n  annotationDimensions,\n  getChartContainerRef,\n  chartAreaRef,\n  chartId,\n  zIndex,\n  onPointerMove,\n  onDOMElementEnter,\n  onDOMElementLeave,\n  clickable,\n  hoveredAnnotationIds,\n  sharedStyle,\n}: AnnotationsProps) => {\n  const renderAnnotationMarkers = useCallback((): JSX.Element[] => {\n    const markers: JSX.Element[] = [];\n    annotationDimensions.forEach((dimensions: AnnotationDimensions, id: AnnotationId) => {\n      const annotationSpec = getSpecsById<AnnotationSpec>(annotationSpecs, id);\n      if (!annotationSpec) {\n        return;\n      }\n\n      if (isLineAnnotation(annotationSpec)) {\n        const annotationLines = dimensions as AnnotationLineProps[];\n        const lineMarkers = renderAnnotationLineMarkers(\n          chartAreaRef,\n          chartDimensions,\n          annotationLines,\n          onDOMElementEnter,\n          onDOMElementLeave,\n          hoveredAnnotationIds,\n          sharedStyle,\n          clickable,\n          annotationSpec.animations,\n        );\n        lineMarkers.forEach((m) => markers.push(m));\n      }\n    });\n\n    return markers;\n  }, [\n    annotationDimensions,\n    annotationSpecs,\n    chartAreaRef,\n    chartDimensions,\n    onDOMElementEnter,\n    onDOMElementLeave,\n    hoveredAnnotationIds,\n    sharedStyle,\n    clickable,\n  ]);\n\n  const onScroll = useCallback(() => {\n    onPointerMove({ x: -1, y: -1 }, Date.now());\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  if (isChartEmpty) {\n    return null;\n  }\n\n  return (\n    <>\n      {renderAnnotationMarkers()}\n      <AnnotationTooltip\n        chartId={chartId}\n        zIndex={zIndex}\n        state={tooltipState}\n        chartRef={getChartContainerRef()}\n        onScroll={onScroll}\n      />\n    </>\n  );\n};\n\nAnnotationsComponent.displayName = 'Annotations';\n\nconst mapDispatchToProps = (dispatch: Dispatch): AnnotationsDispatchProps =>\n  bindActionCreators(\n    {\n      onPointerMove: onPointerMoveAction,\n      onDOMElementLeave: onDOMElementLeaveAction,\n      onDOMElementEnter: onDOMElementEnterAction,\n      onDOMElementClick: onDOMElementClickAction,\n    },\n    dispatch,\n  );\n\nconst mapStateToProps = (state: GlobalChartState): AnnotationsStateProps => {\n  const { zIndex, chartId } = state;\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      isChartEmpty: true,\n      chartDimensions: { top: 0, left: 0, width: 0, height: 0 },\n      sharedStyle: LIGHT_THEME.sharedStyle,\n      annotationDimensions: new Map(),\n      annotationSpecs: [],\n      tooltipState: null,\n      chartId,\n      zIndex,\n      hoveredAnnotationIds: [],\n      clickable: false,\n    };\n  }\n  return {\n    isChartEmpty: isChartEmptySelector(state),\n    chartDimensions: computeChartDimensionsSelector(state).chartDimensions,\n    sharedStyle: getChartThemeSelector(state).sharedStyle,\n    annotationDimensions: computeAnnotationDimensionsSelector(state),\n    annotationSpecs: getAnnotationSpecsSelector(state),\n    tooltipState: getAnnotationTooltipStateSelector(state),\n    chartId,\n    zIndex,\n    hoveredAnnotationIds: getHighlightedAnnotationIdsSelector(state),\n    clickable: Boolean(getSettingsSpecSelector(state).onAnnotationClick),\n  };\n};\n\n/** @internal */\nexport const Annotations = connect(mapStateToProps, mapDispatchToProps)(AnnotationsComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport { Annotations } from './annotations';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { createPopper, Instance } from '@popperjs/core';\nimport React, { RefObject, useRef, useEffect, useCallback, CSSProperties } from 'react';\n\nimport { DEFAULT_CSS_CURSOR } from '../../../../../common/constants';\nimport {\n  DOMElementType,\n  onDOMElementEnter as onDOMElementEnterAction,\n  onDOMElementLeave as onDOMElementLeaveAction,\n  onDOMElementClick as onDOMElementClickAction,\n} from '../../../../../state/actions/dom_element';\nimport { Position, renderWithProps } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { AnnotationLineProps } from '../../../annotations/line/types';\nimport { AnimationOptions } from '../../canvas/animations/animation';\nimport { GetAnnotationParamsFn } from '../../common/utils';\n\ntype LineMarkerProps = Pick<AnnotationLineProps, 'id' | 'specId' | 'datum' | 'panel'> & {\n  marker: AnnotationLineProps['markers'][number];\n  chartAreaRef: RefObject<HTMLCanvasElement>;\n  chartDimensions: Dimensions;\n  onDOMElementEnter: typeof onDOMElementEnterAction;\n  onDOMElementLeave: typeof onDOMElementLeaveAction;\n  onDOMElementClick: typeof onDOMElementClickAction;\n  clickable: boolean;\n  getHoverParams: GetAnnotationParamsFn;\n};\n\nconst MARKER_TRANSFORMS = {\n  [Position.Right]: 'translate(0%, -50%)',\n  [Position.Left]: 'translate(-100%, -50%)',\n  [Position.Top]: 'translate(-50%, -100%)',\n  [Position.Bottom]: 'translate(-50%, 0%)',\n};\n\nfunction getMarkerCentredTransform(alignment: Position, hasMarkerDimensions: boolean): string | undefined {\n  return hasMarkerDimensions ? undefined : MARKER_TRANSFORMS[alignment];\n}\n\n/**\n * LineMarker component used to display line annotation markers\n * @internal\n */\nexport function LineMarker({\n  id,\n  specId,\n  datum,\n  panel,\n  marker: { icon, body, color, position, alignment, dimension },\n  chartAreaRef,\n  chartDimensions,\n  onDOMElementEnter,\n  onDOMElementLeave,\n  onDOMElementClick,\n  clickable,\n  getHoverParams,\n}: LineMarkerProps) {\n  const { style, options } = getHoverParams(id);\n  const iconRef = useRef<HTMLDivElement | null>(null);\n  const testRef = useRef<HTMLDivElement | null>(null);\n  const popper = useRef<Instance | null>(null);\n  const markerStyle: CSSProperties = {\n    ...style,\n    ...getAnimatedStyles(options, style),\n    color,\n    top: chartDimensions.top + position.top + panel.top,\n    left: chartDimensions.left + position.left + panel.left,\n    cursor: clickable ? 'pointer' : DEFAULT_CSS_CURSOR,\n  };\n\n  const transform = { transform: getMarkerCentredTransform(alignment, Boolean(dimension)) };\n  const setPopper = useCallback(() => {\n    if (!iconRef.current || !testRef.current) return;\n\n    popper.current = createPopper(iconRef.current, testRef.current, {\n      strategy: 'absolute',\n      placement: alignment,\n      modifiers: [\n        {\n          name: 'offset',\n          options: {\n            offset: [0, 0],\n          },\n        },\n        {\n          name: 'preventOverflow',\n          options: {\n            boundary: chartAreaRef.current,\n          },\n        },\n        {\n          name: 'flip',\n          options: {\n            // prevents default flip modifier\n            fallbackPlacements: [],\n          },\n        },\n      ],\n    });\n  }, [chartAreaRef, alignment]);\n\n  useEffect(() => {\n    if (!popper.current && body) {\n      setPopper();\n    }\n\n    return () => {\n      popper?.current?.destroy?.();\n      popper.current = null;\n    };\n  }, [setPopper, body]);\n\n  void popper?.current?.update?.();\n\n  // want it to be tabbable if interactive if there is a click handler\n  return clickable ? (\n    <button\n      className=\"echAnnotation__marker\"\n      onMouseEnter={() => {\n        onDOMElementEnter({\n          createdBySpecId: specId,\n          id,\n          type: DOMElementType.LineAnnotationMarker,\n          datum,\n        });\n      }}\n      onMouseLeave={onDOMElementLeave}\n      onClick={onDOMElementClick}\n      style={{ ...markerStyle, ...transform }}\n      type=\"button\"\n    >\n      <div ref={iconRef} className=\"echAnnotation__icon\">\n        {renderWithProps(icon, datum)}\n      </div>\n      {body && (\n        <div ref={testRef} className=\"echAnnotation__body\">\n          {renderWithProps(body, datum)}\n        </div>\n      )}\n    </button>\n  ) : (\n    <div\n      className=\"echAnnotation__marker\"\n      onMouseEnter={() => {\n        onDOMElementEnter({\n          createdBySpecId: specId,\n          id,\n          type: DOMElementType.LineAnnotationMarker,\n          datum,\n        });\n      }}\n      onMouseLeave={onDOMElementLeave}\n      style={{ ...markerStyle, ...transform }}\n    >\n      <div ref={iconRef} className=\"echAnnotation__icon\">\n        {renderWithProps(icon, datum)}\n      </div>\n      {body && (\n        <div ref={testRef} className=\"echAnnotation__body\">\n          {renderWithProps(body, datum)}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction getAnimatedStyles(\n  { duration, delay, timeFunction, snapValues = [], enabled }: AnimationOptions,\n  { opacity }: CSSProperties,\n): CSSProperties {\n  if (!enabled || (typeof opacity === 'number' && snapValues.includes(opacity))) return {};\n  return {\n    transitionDuration: `${duration}ms`,\n    transitionDelay: `${delay}ms`,\n    transitionProperty: 'opacity',\n    transitionTimingFunction: timeFunction,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { useCallback } from 'react';\n\nimport { TooltipDivider, TooltipHeader } from '../../../../../components/tooltip';\nimport { renderWithProps } from '../../../../../utils/common';\nimport { AnnotationType, LineAnnotationDatum, RectAnnotationDatum } from '../../../../specs';\nimport { AnnotationTooltipState } from '../../../annotations/types';\n\n/** @internal */\nexport const TooltipContent = ({\n  annotationType,\n  datum,\n  customTooltip: CustomTooltip,\n  customTooltipDetails,\n}: AnnotationTooltipState) => {\n  const renderLine = useCallback(() => {\n    const { details, dataValue, header = dataValue.toString() } = datum as LineAnnotationDatum;\n    return (\n      <>\n        <TooltipHeader>{header}</TooltipHeader>\n        <TooltipDivider />\n        <div className=\"echAnnotation__details\">\n          {customTooltipDetails ? renderWithProps(customTooltipDetails, { details }) : details}\n        </div>\n      </>\n    );\n  }, [datum, customTooltipDetails]);\n\n  const renderRect = useCallback(() => {\n    const { details } = datum as RectAnnotationDatum;\n    const tooltipContent = customTooltipDetails ? renderWithProps(customTooltipDetails, { details }) : details;\n    if (!tooltipContent) {\n      return null;\n    }\n\n    return <div className=\"echAnnotation__details\">{tooltipContent}</div>;\n  }, [datum, customTooltipDetails]);\n\n  if (CustomTooltip) {\n    const { details } = datum;\n    if ('header' in datum) {\n      return <CustomTooltip details={details} header={datum.header} datum={datum} />;\n    }\n    return <CustomTooltip details={details} datum={datum} />;\n  }\n\n  switch (annotationType) {\n    case AnnotationType.Line: {\n      return renderLine();\n    }\n    case AnnotationType.Rectangle: {\n      return renderRect();\n    }\n    default:\n      return null;\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Rect } from '../../../../geoms/types';\nimport { getTooltipType } from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState, TooltipInteractionState } from '../../../../state/chart_state';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\nimport { getInitialTooltipState } from '../../../../state/utils';\nimport { Rotation } from '../../../../utils/common';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { getCursorBandPositionSelector } from '../../state/selectors/get_cursor_band';\n\ninterface CursorBandProps {\n  theme: Theme;\n  isBrushing: boolean;\n  chartRotation: Rotation;\n  cursorPosition?: Rect;\n  tooltipType: TooltipType;\n  fromExternalEvent?: boolean;\n  tooltipState: TooltipInteractionState;\n}\n\nfunction canRenderBand(type: TooltipType, pinned: boolean, visible: boolean, fromExternalEvent?: boolean) {\n  return (\n    pinned || (visible && (type === TooltipType.Crosshairs || type === TooltipType.VerticalCursor || fromExternalEvent))\n  );\n}\n\nclass CursorBandComponent extends React.Component<CursorBandProps> {\n  static displayName = 'CursorBand';\n\n  render() {\n    const {\n      theme: {\n        crosshair: { band },\n      },\n      isBrushing,\n      cursorPosition,\n      tooltipType,\n      fromExternalEvent,\n      tooltipState: { pinned },\n    } = this.props;\n    const isBand = (cursorPosition?.width ?? 0) > 0 && (cursorPosition?.height ?? 0) > 0;\n    if (\n      isBrushing ||\n      !isBand ||\n      !cursorPosition ||\n      !canRenderBand(tooltipType, pinned, band.visible, fromExternalEvent)\n    ) {\n      return null;\n    }\n    const { x, y, width, height } = cursorPosition;\n    const { fill } = band;\n    return (\n      <svg className=\"echCrosshair__cursor\" width=\"100%\" height=\"100%\">\n        <rect {...{ x, y, width, height, fill }} />\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): CursorBandProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      isBrushing: false,\n      theme: LIGHT_THEME,\n      chartRotation: 0,\n      tooltipType: TooltipType.None,\n      tooltipState: getInitialTooltipState(),\n    };\n  }\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const cursorBandPosition = getCursorBandPositionSelector(state);\n  const fromExternalEvent = cursorBandPosition?.fromExternalEvent;\n  const tooltipType = getTooltipType(tooltip, settings, fromExternalEvent);\n\n  return {\n    isBrushing: isBrushingSelector(state),\n    theme: getChartThemeSelector(state),\n    chartRotation: getChartRotationSelector(state),\n    cursorPosition: cursorBandPosition,\n    tooltipType,\n    fromExternalEvent,\n    tooltipState: getTooltipInteractionState(state),\n  };\n};\n\n/** @internal */\nexport const CursorBand = connect(mapStateToProps)(CursorBandComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Line } from '../../../../geoms/types';\nimport { getTooltipType } from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { Rotation } from '../../../../utils/common';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { getCursorBandPositionSelector } from '../../state/selectors/get_cursor_band';\nimport { getCursorLinePositionSelector } from '../../state/selectors/get_cursor_line';\n\ninterface CursorCrossLineProps {\n  theme: Theme;\n  chartRotation: Rotation;\n  cursorCrossLinePosition?: Line;\n  tooltipType: TooltipType;\n}\n\nfunction canRenderHelpLine(type: TooltipType, visible: boolean) {\n  return visible && type === TooltipType.Crosshairs;\n}\n\nclass CursorCrossLineComponent extends React.Component<CursorCrossLineProps> {\n  static displayName = 'CursorCrossLine';\n\n  render() {\n    const {\n      theme: {\n        crosshair: { crossLine },\n      },\n      cursorCrossLinePosition,\n      tooltipType,\n    } = this.props;\n\n    if (!cursorCrossLinePosition || !canRenderHelpLine(tooltipType, crossLine.visible)) {\n      return null;\n    }\n\n    const { strokeWidth, stroke, dash } = crossLine;\n    const style = {\n      strokeWidth,\n      stroke,\n      strokeDasharray: (dash ?? []).join(' '),\n    };\n\n    return (\n      <svg className=\"echCrosshair__crossLine\" width=\"100%\" height=\"100%\">\n        <line {...cursorCrossLinePosition} {...style} />\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): CursorCrossLineProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      theme: LIGHT_THEME,\n      chartRotation: 0,\n      tooltipType: TooltipType.None,\n    };\n  }\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const cursorBandPosition = getCursorBandPositionSelector(state);\n  const fromExternalEvent = cursorBandPosition?.fromExternalEvent;\n  const tooltipType = getTooltipType(tooltip, settings, fromExternalEvent);\n\n  return {\n    theme: getChartThemeSelector(state),\n    chartRotation: getChartRotationSelector(state),\n    cursorCrossLinePosition: getCursorLinePositionSelector(state),\n    tooltipType,\n  };\n};\n\n/** @internal */\nexport const CursorCrossLine = connect(mapStateToProps)(CursorCrossLineComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Rect } from '../../../../geoms/types';\nimport { getTooltipType } from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState, TooltipInteractionState } from '../../../../state/chart_state';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\nimport { getInitialTooltipState } from '../../../../state/utils';\nimport { Rotation } from '../../../../utils/common';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { getCursorBandPositionSelector } from '../../state/selectors/get_cursor_band';\n\ninterface CursorLineProps {\n  theme: Theme;\n  isBrushing: boolean;\n  chartRotation: Rotation;\n  cursorPosition?: Rect;\n  tooltipType: TooltipType;\n  fromExternalEvent?: boolean;\n  isLine: boolean;\n  tooltipState: TooltipInteractionState;\n}\n\nfunction canRenderBand(type: TooltipType, pinned: boolean, visible: boolean, fromExternalEvent?: boolean) {\n  return (\n    pinned || (visible && (type === TooltipType.Crosshairs || type === TooltipType.VerticalCursor || fromExternalEvent))\n  );\n}\n\nclass CursorLineComponent extends React.Component<CursorLineProps> {\n  static displayName = 'CursorLine';\n\n  render() {\n    const {\n      theme: {\n        crosshair: { band, line },\n      },\n      isBrushing,\n      cursorPosition,\n      tooltipType,\n      fromExternalEvent,\n      isLine,\n      tooltipState: { pinned },\n    } = this.props;\n\n    if (\n      isBrushing ||\n      !cursorPosition ||\n      !canRenderBand(tooltipType, pinned, band.visible, fromExternalEvent) ||\n      !isLine\n    ) {\n      return null;\n    }\n    const { x, y, width, height } = cursorPosition;\n    const { strokeWidth, stroke, dash } = line;\n    const strokeDasharray = (dash ?? []).join(' ');\n    return (\n      <svg className=\"echCrosshair__cursor\" width=\"100%\" height=\"100%\">\n        <line {...{ x1: x, x2: x + width, y1: y, y2: y + height, strokeWidth, stroke, strokeDasharray }} />\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): CursorLineProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      isBrushing: false,\n      theme: LIGHT_THEME,\n      chartRotation: 0,\n      tooltipType: TooltipType.None,\n      isLine: false,\n      tooltipState: getInitialTooltipState(),\n    };\n  }\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const cursorBandPosition = getCursorBandPositionSelector(state);\n  const fromExternalEvent = cursorBandPosition?.fromExternalEvent;\n  const tooltipType = getTooltipType(tooltip, settings, fromExternalEvent);\n  const isLine = cursorBandPosition?.width === 0 || cursorBandPosition?.height === 0;\n\n  return {\n    isBrushing: isBrushingSelector(state),\n    theme: getChartThemeSelector(state),\n    chartRotation: getChartRotationSelector(state),\n    cursorPosition: cursorBandPosition,\n    tooltipType,\n    fromExternalEvent,\n    isLine,\n    tooltipState: getTooltipInteractionState(state),\n  };\n};\n\n/** @internal */\nexport const CursorLine = connect(mapStateToProps)(CursorLineComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { InitStatus, getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\nimport { getColorFromVariant, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { isPointGeometry, IndexedGeometry, PointGeometry } from '../../../../utils/geometry';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { HighlighterStyle } from '../../../../utils/themes/theme';\nimport { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions';\nimport { computeChartTransformSelector } from '../../state/selectors/compute_chart_transform';\nimport { getHighlightedGeomsSelector } from '../../state/selectors/get_tooltip_values_highlighted_geoms';\nimport { Transform } from '../../state/utils/types';\nimport { computeChartTransform } from '../../state/utils/utils';\nimport { ShapeRendererFn } from '../shapes_paths';\n\ninterface HighlighterProps {\n  initialized: boolean;\n  chartId: string;\n  zIndex: number;\n  isBrushing: boolean;\n  highlightedGeometries: IndexedGeometry[];\n  chartTransform: Transform;\n  chartDimensions: Dimensions;\n  chartRotation: Rotation;\n  style: HighlighterStyle;\n}\n\nfunction getTransformForPanel(panel: Dimensions, rotation: Rotation, { left, top }: Pick<Dimensions, 'top' | 'left'>) {\n  const { x, y } = computeChartTransform(panel, rotation);\n  return `translate(${left + panel.left + x}, ${top + panel.top + y}) rotate(${rotation})`;\n}\n\nfunction renderPath(geom: PointGeometry, radius: number) {\n  // keep the highlighter radius to a minimum\n  const [shapeFn, rotate] = ShapeRendererFn[geom.style.shape];\n  return {\n    d: shapeFn(radius),\n    rotate,\n  };\n}\n\nclass HighlighterComponent extends React.Component<HighlighterProps> {\n  static displayName = 'Highlighter';\n\n  render() {\n    const { highlightedGeometries, chartDimensions, chartRotation, chartId, zIndex, isBrushing, style } = this.props;\n    if (isBrushing) return null;\n    const clipWidth = [90, -90].includes(chartRotation) ? chartDimensions.height : chartDimensions.width;\n    const clipHeight = [90, -90].includes(chartRotation) ? chartDimensions.width : chartDimensions.height;\n    const clipPathId = `echHighlighterClipPath__${chartId}`;\n    return (\n      <svg className=\"echHighlighter\" style={{ zIndex }}>\n        <defs>\n          <clipPath id={clipPathId}>\n            <rect x=\"0\" y=\"0\" width={clipWidth} height={clipHeight} />\n          </clipPath>\n        </defs>\n\n        {highlightedGeometries.map((geom, i) => {\n          const { panel } = geom;\n          const x = geom.x + geom.transform.x;\n          const y = geom.y + geom.transform.y;\n          const geomTransform = getTransformForPanel(panel, chartRotation, chartDimensions);\n\n          if (isPointGeometry(geom)) {\n            // using the stroke because the fill is always white on points\n            const fillColor = getColorFromVariant(RGBATupleToString(geom.style.stroke.color), style.point.fill);\n            const strokeColor = getColorFromVariant(RGBATupleToString(geom.style.stroke.color), style.point.stroke);\n\n            const radius = Math.max(geom.radius, style.point.radius);\n            const { d, rotate } = renderPath(geom, radius);\n            return (\n              <g\n                key={i}\n                transform={geomTransform}\n                clipPath={geom.value.mark !== null ? `url(#${clipPathId})` : undefined}\n              >\n                <path\n                  d={d}\n                  transform={`translate(${x}, ${y}) rotate(${rotate || 0})`}\n                  fill={fillColor}\n                  stroke={strokeColor}\n                  strokeWidth={style.point.strokeWidth}\n                  opacity={style.point.opacity}\n                />\n              </g>\n            );\n          }\n          return (\n            <rect\n              key={i}\n              x={x}\n              y={y}\n              width={geom.width}\n              height={geom.height}\n              transform={geomTransform}\n              className=\"echHighlighterOverlay__fill\"\n              clipPath={`url(#${clipPathId})`}\n            />\n          );\n        })}\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): HighlighterProps => {\n  const { chartId, zIndex } = state;\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      initialized: false,\n      chartId,\n      zIndex,\n      isBrushing: false,\n      highlightedGeometries: [],\n      chartTransform: {\n        x: 0,\n        y: 0,\n        rotate: 0,\n      },\n      chartDimensions: { top: 0, left: 0, width: 0, height: 0 },\n      chartRotation: 0,\n      style: LIGHT_THEME.highlighter,\n    };\n  }\n\n  return {\n    initialized: true,\n    chartId,\n    zIndex,\n    isBrushing: isBrushingSelector(state),\n    highlightedGeometries: getHighlightedGeomsSelector(state),\n    chartTransform: computeChartTransformSelector(state),\n    chartDimensions: computeChartDimensionsSelector(state).chartDimensions,\n    chartRotation: getChartRotationSelector(state),\n    style: getChartThemeSelector(state).highlighter,\n  };\n};\n\n/** @internal */\nexport const Highlighter = connect(mapStateToProps)(HighlighterComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { degToRad } from '../../../utils/common';\nimport { PointShape, TextureShape } from '../../../utils/themes/theme';\n\n/** @internal */\nexport type SVGPath = string;\n\n/** @internal */\nexport type SVGPathFn = (radius: number) => SVGPath;\n\nconst cross: SVGPathFn = (r: number) => {\n  return `M ${-r} 0 L ${r} 0 M 0 ${r} L 0 ${-r}`;\n};\n\nconst triangle: SVGPathFn = (r: number) => {\n  const h = (r * Math.sqrt(3)) / 2;\n  const hr = r / 2;\n  return `M ${-h} ${hr} L ${h} ${hr} L 0 ${-r} Z`;\n};\n\n/**\n * Returns shape function based on rotation of square in degrees\n */\nconst square =\n  (rotation = 0): SVGPathFn =>\n  (r: number) => {\n    const d = degToRad(rotation);\n    const s = Math.abs(Math.cos(d) + Math.sin(d));\n    // scaled r to account for rotation;\n    const sr = s > 0 ? r / s : r;\n    return `M ${-sr} ${-sr} L ${-sr} ${sr} L ${sr} ${sr} L ${sr} ${-sr} Z`;\n  };\n\nconst circle: SVGPathFn = (r: number) => {\n  return `M ${-r} 0 a ${r},${r} 0 1,0 ${r * 2},0 a ${r},${r} 0 1,0 ${-r * 2},0`;\n};\n\nconst line: SVGPathFn = (r: number) => {\n  return `M 0 ${-r} l 0 ${r * 2}`;\n};\n\n/** @internal */\nexport const ShapeRendererFn: Record<PointShape, [SVGPathFn, number]> = {\n  [PointShape.Circle]: [circle, 0],\n  [PointShape.X]: [cross, 45],\n  [PointShape.Plus]: [cross, 0],\n  [PointShape.Diamond]: [square(45), 45],\n  [PointShape.Square]: [square(0), 0],\n  [PointShape.Triangle]: [triangle, 0],\n};\n\n/** @internal */\nexport const TextureRendererFn: Record<TextureShape, [SVGPathFn, number]> = {\n  ...ShapeRendererFn,\n  [TextureShape.Line]: [line, 0],\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { area } from 'd3-shape';\n\nimport { renderPoints } from './points';\nimport {\n  getClippedRanges,\n  getY0ScaledValueFn,\n  getY1ScaledValueFn,\n  getYDatumValueFn,\n  isYValueDefinedFn,\n  MarkSizeOptions,\n} from './utils';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { CurveType, getCurveFactory } from '../../../utils/curves';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { AreaGeometry } from '../../../utils/geometry';\nimport { AreaSeriesStyle } from '../../../utils/themes/theme';\nimport { IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport { DataSeries, DataSeriesDatum, getSeriesIdentifierFromDataSeries } from '../utils/series';\nimport { PointStyleAccessor } from '../utils/specs';\n\n/** @internal */\nexport function renderArea(\n  shift: number,\n  dataSeries: DataSeries,\n  xScale: ScaleBand | ScaleContinuous,\n  yScale: ScaleContinuous,\n  panel: Dimensions,\n  color: Color,\n  curve: CurveType,\n  isBandedSpec: boolean,\n  xScaleOffset: number,\n  style: AreaSeriesStyle,\n  markSizeOptions: MarkSizeOptions,\n  isStacked: boolean,\n  hasFit: boolean,\n  pointStyleAccessor?: PointStyleAccessor,\n): {\n  areaGeometry: AreaGeometry;\n  indexedGeometryMap: IndexedGeometryMap;\n} {\n  const y1Fn = getY1ScaledValueFn(yScale);\n  const y0Fn = getY0ScaledValueFn(yScale);\n  const definedFn = isYValueDefinedFn(yScale, xScale);\n  const y1DatumAccessor = getYDatumValueFn();\n  const y0DatumAccessor = getYDatumValueFn('y0');\n  const pathGenerator = area<DataSeriesDatum>()\n    .x(({ x }) => xScale.scale(x) - xScaleOffset)\n    .y1(y1Fn)\n    .y0(y0Fn)\n    .defined((datum) => {\n      return definedFn(datum, y1DatumAccessor) && (isBandedSpec ? definedFn(datum, y0DatumAccessor) : true);\n    })\n    .curve(getCurveFactory(curve));\n\n  // TODO we can probably avoid this function call if no fit function is applied.\n  const clippedRanges = getClippedRanges(dataSeries.data, xScale, xScaleOffset);\n\n  const lines: string[] = [];\n  const y0Line = isBandedSpec && pathGenerator.lineY0()(dataSeries.data);\n  const y1Line = pathGenerator.lineY1()(dataSeries.data);\n  if (y1Line) lines.push(y1Line);\n  if (y0Line) lines.push(y0Line);\n\n  const { pointGeometries, indexedGeometryMap } = renderPoints(\n    shift - xScaleOffset,\n    dataSeries,\n    xScale,\n    yScale,\n    panel,\n    color,\n    style.point,\n    style.isolatedPoint,\n    isBandedSpec,\n    markSizeOptions,\n    false,\n    true,\n    pointStyleAccessor,\n  );\n\n  const areaGeometry: AreaGeometry = {\n    area: pathGenerator(dataSeries.data) || '',\n    lines,\n    points: pointGeometries,\n    color,\n    transform: {\n      y: 0,\n      x: shift,\n    },\n    seriesIdentifier: getSeriesIdentifierFromDataSeries(dataSeries),\n    style,\n    isStacked,\n    clippedRanges,\n    shouldClip: hasFit,\n  };\n  return {\n    areaGeometry,\n    indexedGeometryMap,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getDatumYValue } from './points';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { ScaleType } from '../../../scales/constants';\nimport { TextMeasure } from '../../../utils/bbox/canvas_text_bbox_calculator';\nimport { clamp, mergePartial } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { BandedAccessorType, BarGeometry } from '../../../utils/geometry';\nimport { BarSeriesStyle, DisplayValueStyle } from '../../../utils/themes/theme';\nimport { IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport {\n  DataSeries,\n  DataSeriesDatum,\n  getSeriesIdentifierFromDataSeries,\n  XYChartSeriesIdentifier,\n} from '../utils/series';\nimport { BarStyleAccessor, DisplayValueSpec, LabelOverflowConstraint, StackMode } from '../utils/specs';\n\nconst PADDING = 1; // default padding for now\nconst FONT_SIZE_FACTOR = 0.7; // Take 70% of space for the label text\n\ntype BarTuple = {\n  barGeometries: BarGeometry[];\n  indexedGeometryMap: IndexedGeometryMap;\n};\n\n/** @internal */\nexport function renderBars(\n  measureText: TextMeasure,\n  orderIndex: number,\n  dataSeries: DataSeries,\n  xScale: ScaleContinuous | ScaleBand,\n  yScale: ScaleContinuous,\n  panel: Dimensions,\n  chartRotation: number,\n  minBarHeight: number,\n  color: Color,\n  sharedSeriesStyle: BarSeriesStyle,\n  displayValueSettings?: DisplayValueSpec,\n  styleAccessor?: BarStyleAccessor,\n  stackMode?: StackMode,\n): BarTuple {\n  const { fontSize, fontFamily } = sharedSeriesStyle.displayValue;\n  const initialBarTuple: BarTuple = { barGeometries: [], indexedGeometryMap: new IndexedGeometryMap() } as BarTuple;\n  const isLogY = yScale.type === ScaleType.Log;\n  const isInvertedY = yScale.isInverted;\n  return dataSeries.data.reduce((barTuple: BarTuple, datum) => {\n    const xScaled = xScale.scale(datum.x);\n    if (!xScale.isValueInDomain(datum.x) || Number.isNaN(xScaled)) {\n      return barTuple; // don't create a bar if not within the xScale domain\n    }\n    const { barGeometries, indexedGeometryMap } = barTuple;\n    const { y0, y1, initialY1, filled } = datum;\n    const rawY = isLogY && (y1 === 0 || y1 === null) ? yScale.range[0] : yScale.scale(y1);\n\n    const y0Scaled = isLogY\n      ? y0 === 0 || y0 === null\n        ? yScale.range[isInvertedY ? 1 : 0]\n        : yScale.scale(y0)\n      : yScale.scale(y0 === null ? 0 : y0);\n\n    const finiteHeight = y0Scaled - rawY || 0;\n    const absHeight = Math.abs(finiteHeight);\n    const height = absHeight === 0 ? absHeight : Math.max(minBarHeight, absHeight); // extend nonzero bars\n    const heightExtension = height - absHeight;\n    const isUpsideDown = finiteHeight < 0;\n    const finiteY = Number.isNaN(y0Scaled + rawY) ? 0 : rawY;\n    const y = isUpsideDown ? finiteY - height + heightExtension : finiteY - heightExtension;\n\n    const seriesIdentifier: XYChartSeriesIdentifier = getSeriesIdentifierFromDataSeries(dataSeries);\n\n    const seriesStyle = getBarStyleOverrides(datum, seriesIdentifier, sharedSeriesStyle, styleAccessor);\n\n    const maxPixelWidth = clamp(seriesStyle.rect.widthRatio ?? 1, 0, 1) * xScale.bandwidth;\n    const minPixelWidth = clamp(seriesStyle.rect.widthPixel ?? 0, 0, maxPixelWidth);\n\n    const width = clamp(seriesStyle.rect.widthPixel ?? xScale.bandwidth, minPixelWidth, maxPixelWidth);\n    const x = xScaled + xScale.bandwidth * orderIndex + xScale.bandwidth / 2 - width / 2;\n\n    const y1Value = getDatumYValue(datum, false, false, stackMode);\n    const formattedDisplayValue = displayValueSettings?.valueFormatter?.(y1Value);\n\n    // only show displayValue for even bars if showOverlappingValue\n    const displayValueText =\n      displayValueSettings?.isAlternatingValueLabel && barGeometries.length % 2 ? undefined : formattedDisplayValue;\n\n    const { displayValueWidth, fixedFontScale } = computeBoxWidth(displayValueText ?? '', {\n      padding: PADDING,\n      fontSize,\n      fontFamily,\n      measureText,\n    });\n\n    const isHorizontalRotation = chartRotation % 180 === 0;\n    // Pick the right side of the label's box to use as factor reference\n    const referenceWidth = Math.max(isHorizontalRotation ? displayValueWidth : fixedFontScale, 1);\n\n    const textScalingFactor = getFinalFontScalingFactor(\n      (width * FONT_SIZE_FACTOR) / referenceWidth,\n      fixedFontScale,\n      fontSize,\n    );\n    const overflowConstraints: Set<LabelOverflowConstraint> = new Set(\n      displayValueSettings?.overflowConstraints ?? [\n        LabelOverflowConstraint.ChartEdges,\n        LabelOverflowConstraint.BarGeometry,\n      ],\n    );\n\n    // Based on rotation scale the width of the text box\n    const bboxWidthFactor = isHorizontalRotation ? textScalingFactor : 1;\n\n    const displayValue: BarGeometry['displayValue'] | undefined =\n      displayValueText && displayValueSettings?.showValueLabel\n        ? {\n            fontScale: textScalingFactor,\n            fontSize: fixedFontScale,\n            text: displayValueText,\n            width: bboxWidthFactor * displayValueWidth,\n            height: textScalingFactor * fixedFontScale,\n            overflowConstraints,\n          }\n        : undefined;\n\n    const barGeometry: BarGeometry = {\n      displayValue,\n      x,\n      y,\n      transform: { x: 0, y: 0 },\n      width,\n      height,\n      color,\n      value: { x: datum.x, y: y1Value, mark: null, accessor: BandedAccessorType.Y1, datum: datum.datum },\n      seriesIdentifier,\n      seriesStyle,\n      panel,\n    };\n    indexedGeometryMap.set(barGeometry);\n\n    if (y1 !== null && initialY1 !== null && filled?.y1 === undefined) {\n      barGeometries.push(barGeometry);\n    }\n\n    return barTuple;\n  }, initialBarTuple);\n}\n\n/**\n * Workout the text box size and fixedFontSize based on a collection of options\n * @internal\n */\nfunction computeBoxWidth(\n  text: string,\n  {\n    padding,\n    fontSize,\n    fontFamily,\n    measureText,\n  }: {\n    padding: number;\n    fontSize: number | { min: number; max: number };\n    fontFamily: string;\n    measureText: TextMeasure;\n  },\n): { fixedFontScale: number; displayValueWidth: number } {\n  const fixedFontScale = Math.max(typeof fontSize === 'number' ? fontSize : fontSize.min, 1);\n\n  const computedDisplayValueWidth = measureText(\n    text,\n    { fontFamily, fontWeight: 'normal', fontStyle: 'normal', fontVariant: 'normal' },\n    fixedFontScale,\n  ).width;\n  if (typeof fontSize !== 'number') {\n    return {\n      fixedFontScale,\n      displayValueWidth: computedDisplayValueWidth + padding,\n    };\n  }\n  return {\n    fixedFontScale,\n    displayValueWidth: computedDisplayValueWidth,\n  };\n}\n\n/**\n * Returns a safe scaling factor for label text for fixed or range size inputs\n * @internal\n */\nfunction getFinalFontScalingFactor(\n  scale: number,\n  fixedFontSize: number,\n  limits: DisplayValueStyle['fontSize'],\n): number {\n  if (typeof limits === 'number') {\n    // it's a fixed size, so it's always ok\n    return 1;\n  }\n  const finalFontSize = scale * fixedFontSize;\n  if (finalFontSize > limits.max) {\n    return limits.max / fixedFontSize;\n  }\n  if (finalFontSize < limits.min) {\n    // it's technically 1, but keep it generic in case the fixedFontSize changes\n    return limits.min / fixedFontSize;\n  }\n  return scale;\n}\n\n/** @internal */\nexport function getBarStyleOverrides(\n  datum: DataSeriesDatum,\n  seriesIdentifier: XYChartSeriesIdentifier,\n  seriesStyle: BarSeriesStyle,\n  styleAccessor?: BarStyleAccessor,\n): BarSeriesStyle {\n  const styleOverride = styleAccessor && styleAccessor(datum, seriesIdentifier);\n\n  if (!styleOverride) {\n    return seriesStyle;\n  }\n\n  if (typeof styleOverride === 'string') {\n    return { ...seriesStyle, rect: { ...seriesStyle.rect, fill: styleOverride } };\n  }\n\n  return mergePartial(seriesStyle, styleOverride);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderPoints } from './points';\nimport { MarkSizeOptions } from './utils';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { BubbleGeometry } from '../../../utils/geometry';\nimport { BubbleSeriesStyle } from '../../../utils/themes/theme';\nimport { IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport { DataSeries, getSeriesIdentifierFromDataSeries } from '../utils/series';\nimport { PointStyleAccessor } from '../utils/specs';\n\n/** @internal */\nexport function renderBubble(\n  shift: number,\n  dataSeries: DataSeries,\n  xScale: ScaleContinuous | ScaleBand,\n  yScale: ScaleContinuous,\n  color: Color,\n  panel: Dimensions,\n  hasY0Accessors: boolean,\n  xScaleOffset: number,\n  seriesStyle: BubbleSeriesStyle,\n  markSizeOptions: MarkSizeOptions,\n  isMixedChart: boolean,\n  pointStyleAccessor?: PointStyleAccessor,\n): {\n  bubbleGeometry: BubbleGeometry;\n  indexedGeometryMap: IndexedGeometryMap;\n} {\n  const { pointGeometries, indexedGeometryMap } = renderPoints(\n    shift - xScaleOffset,\n    dataSeries,\n    xScale,\n    yScale,\n    panel,\n    color,\n    seriesStyle.point,\n    // there is no concept of isolated point in bubble chart, so we mark it as invisible\n    { ...seriesStyle.point, visible: false },\n    hasY0Accessors,\n    markSizeOptions,\n    !isMixedChart,\n    // don't allow rendering of isolated points\n    false,\n    pointStyleAccessor,\n  );\n\n  const bubbleGeometry = {\n    points: pointGeometries,\n    color,\n    seriesIdentifier: getSeriesIdentifierFromDataSeries(dataSeries),\n    seriesPointStyle: seriesStyle.point,\n  };\n  return {\n    bubbleGeometry,\n    indexedGeometryMap,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { line } from 'd3-shape';\n\nimport { renderPoints } from './points';\nimport { getClippedRanges, getY1ScaledValueFn, getYDatumValueFn, isYValueDefinedFn, MarkSizeOptions } from './utils';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { CurveType, getCurveFactory } from '../../../utils/curves';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { LineGeometry } from '../../../utils/geometry';\nimport { LineSeriesStyle } from '../../../utils/themes/theme';\nimport { IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport { DataSeries, DataSeriesDatum, getSeriesIdentifierFromDataSeries } from '../utils/series';\nimport { PointStyleAccessor } from '../utils/specs';\n\n/** @internal */\nexport function renderLine(\n  shift: number,\n  dataSeries: DataSeries,\n  xScale: ScaleBand | ScaleContinuous,\n  yScale: ScaleContinuous,\n  panel: Dimensions,\n  color: Color,\n  curve: CurveType,\n  hasY0Accessors: boolean,\n  xScaleOffset: number,\n  seriesStyle: LineSeriesStyle,\n  markSizeOptions: MarkSizeOptions,\n  hasFit: boolean,\n  pointStyleAccessor?: PointStyleAccessor,\n): {\n  lineGeometry: LineGeometry;\n  indexedGeometryMap: IndexedGeometryMap;\n} {\n  const y1Fn = getY1ScaledValueFn(yScale);\n  const definedFn = isYValueDefinedFn(yScale, xScale);\n  const y1Accessor = getYDatumValueFn();\n\n  const pathGenerator = line<DataSeriesDatum>()\n    .x(({ x }) => xScale.scale(x) - xScaleOffset)\n    .y(y1Fn)\n    .defined((datum) => definedFn(datum, y1Accessor))\n    .curve(getCurveFactory(curve));\n\n  const { pointGeometries, indexedGeometryMap } = renderPoints(\n    shift - xScaleOffset,\n    dataSeries,\n    xScale,\n    yScale,\n    panel,\n    color,\n    seriesStyle.point,\n    seriesStyle.isolatedPoint,\n    hasY0Accessors,\n    markSizeOptions,\n    false,\n    true,\n    pointStyleAccessor,\n  );\n\n  // TODO we can probably avoid computing the clipped ranges if no fit function is applied.\n  const clippedRanges = getClippedRanges(dataSeries.data, xScale, xScaleOffset);\n\n  const lineGeometry = {\n    line: pathGenerator(dataSeries.data) || '',\n    points: pointGeometries,\n    color,\n    transform: {\n      x: shift,\n      y: 0,\n    },\n    seriesIdentifier: getSeriesIdentifierFromDataSeries(dataSeries),\n    style: seriesStyle,\n    clippedRanges,\n    shouldClip: hasFit,\n  };\n  return {\n    lineGeometry,\n    indexedGeometryMap,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RecursivePartial, mergePartial } from '../../../utils/common';\nimport { AreaSeriesStyle, LineSeriesStyle } from '../../../utils/themes/theme';\n\n/** @internal */\nexport function getLineSeriesStyles(\n  baseStyle: LineSeriesStyle,\n  seriesStyle?: RecursivePartial<LineSeriesStyle>,\n): LineSeriesStyle {\n  if (!seriesStyle) return baseStyle;\n\n  const isolatedPointStyleOverrides = mergePartial<LineSeriesStyle['isolatedPoint']>(\n    baseStyle.isolatedPoint,\n    seriesStyle.isolatedPoint,\n    undefined,\n    seriesStyle.point ? [seriesStyle.point] : [],\n  );\n\n  return mergePartial(\n    baseStyle,\n    {\n      isolatedPoint: {\n        ...isolatedPointStyleOverrides,\n        visible: seriesStyle?.isolatedPoint?.visible ?? baseStyle.isolatedPoint.visible,\n      },\n    },\n    undefined,\n    [seriesStyle],\n  );\n}\n\n/** @internal */\nexport function getAreaSeriesStyles(\n  baseStyle: AreaSeriesStyle,\n  seriesStyle?: RecursivePartial<AreaSeriesStyle>,\n): AreaSeriesStyle {\n  if (!seriesStyle) return baseStyle;\n\n  const isolatedPointStyleOverrides = mergePartial<AreaSeriesStyle['isolatedPoint']>(\n    baseStyle.isolatedPoint,\n    seriesStyle.isolatedPoint,\n    undefined,\n    seriesStyle.point ? [seriesStyle.point] : [],\n  );\n\n  return mergePartial(\n    baseStyle,\n    {\n      isolatedPoint: {\n        ...isolatedPointStyleOverrides,\n        visible: seriesStyle?.isolatedPoint?.visible ?? baseStyle.isolatedPoint.visible,\n      },\n    },\n    undefined,\n    [seriesStyle],\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, OpacityFn, overrideOpacity } from '../../../common/color_library_wrappers';\nimport { getColorFromVariant, mergePartial } from '../../../utils/common';\nimport { PointGeometryStyle } from '../../../utils/geometry';\nimport { PointShape, PointStyle } from '../../../utils/themes/theme';\n\n/** @internal */\nexport function buildPointGeometryStyles(\n  color: string,\n  themePointStyle: PointStyle,\n  overrides?: Partial<PointStyle>,\n): PointGeometryStyle {\n  const pointStyle = mergePartial(themePointStyle, overrides);\n  const opacityFn: OpacityFn = (opacity) => opacity * pointStyle.opacity;\n  return {\n    fill: { color: overrideOpacity(colorToRgba(getColorFromVariant(color, pointStyle.fill)), opacityFn) },\n    stroke: {\n      color: overrideOpacity(colorToRgba(getColorFromVariant(color, pointStyle.stroke)), opacityFn),\n      width: pointStyle.strokeWidth,\n    },\n    shape: pointStyle.shape ?? PointShape.Circle,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { buildPointGeometryStyles } from './point_style';\nimport {\n  getY0ScaledValueFn,\n  getY1ScaledValueFn,\n  getYDatumValueFn,\n  isDatumFilled,\n  isYValueDefinedFn,\n  MarkSizeOptions,\n  YDefinedFn,\n} from './utils';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { isFiniteNumber, isNil } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { BandedAccessorType, PointGeometry } from '../../../utils/geometry';\nimport { PointStyle } from '../../../utils/themes/theme';\nimport { GeometryType, IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport {\n  DataSeries,\n  DataSeriesDatum,\n  FilledValues,\n  getSeriesIdentifierFromDataSeries,\n  XYChartSeriesIdentifier,\n} from '../utils/series';\nimport { PointStyleAccessor, StackMode } from '../utils/specs';\n\n/** @internal */\nexport function renderPoints(\n  shift: number,\n  dataSeries: DataSeries,\n  xScale: ScaleBand | ScaleContinuous,\n  yScale: ScaleContinuous,\n  panel: Dimensions,\n  color: Color,\n  pointStyle: PointStyle,\n  isolatedPointThemeStyle: PointStyle,\n  isBandChart: boolean,\n  markSizeOptions: MarkSizeOptions,\n  useSpatialIndex: boolean,\n  allowIsolated: boolean,\n  styleAccessor?: PointStyleAccessor,\n): {\n  pointGeometries: PointGeometry[];\n  indexedGeometryMap: IndexedGeometryMap;\n} {\n  const indexedGeometryMap = new IndexedGeometryMap();\n  const getRadius = markSizeOptions.enabled\n    ? getRadiusFn(dataSeries.data, pointStyle.strokeWidth, markSizeOptions.ratio)\n    : () => 0;\n  const geometryType = useSpatialIndex ? GeometryType.spatial : GeometryType.linear;\n\n  const y1Fn = getY1ScaledValueFn(yScale);\n  const y0Fn = getY0ScaledValueFn(yScale);\n  const yDefined = isYValueDefinedFn(yScale, xScale);\n\n  const pointGeometries = dataSeries.data.reduce((acc, datum, dataIndex) => {\n    const { x: xValue, mark } = datum;\n    const prev = dataSeries.data[dataIndex - 1];\n    const next = dataSeries.data[dataIndex + 1];\n    // don't create the point if not within the xScale domain\n    if (!xScale.isValueInDomain(xValue)) return acc;\n\n    // don't create the point if it that point was filled\n    const x = xScale.scale(xValue);\n\n    if (Number.isNaN(x)) return acc;\n\n    const points: PointGeometry[] = [];\n    const yDatumKeyNames: Array<keyof Omit<FilledValues, 'x'>> = isBandChart ? ['y0', 'y1'] : ['y1'];\n\n    yDatumKeyNames.forEach((yDatumKeyName, keyIndex) => {\n      const valueAccessor = getYDatumValueFn(yDatumKeyName);\n      const y = yDatumKeyName === 'y1' ? y1Fn(datum) : y0Fn(datum);\n      const originalY = getDatumYValue(datum, keyIndex === 0, isBandChart, dataSeries.stackMode);\n      const seriesIdentifier: XYChartSeriesIdentifier = getSeriesIdentifierFromDataSeries(dataSeries);\n      const styleOverrides = getPointStyleOverrides(datum, seriesIdentifier, styleAccessor);\n      const style = buildPointGeometryStyles(color, pointStyle, styleOverrides);\n      const isPointIsolated = allowIsolated && isIsolatedPoint(dataIndex, dataSeries.data.length, yDefined, prev, next);\n      const isolatedPointStyle = buildPointGeometryStyles(color, isolatedPointThemeStyle);\n      // if radius is defined with the mark, limit the minimum radius to the theme radius value\n      const radius = isPointIsolated\n        ? isolatedPointThemeStyle.radius\n        : markSizeOptions.enabled\n          ? Math.max(getRadius(mark), pointStyle.radius)\n          : styleOverrides?.radius ?? pointStyle.radius;\n\n      const pointGeometry: PointGeometry = {\n        x,\n        y: y === null ? NaN : y,\n        radius,\n        color,\n        style: isolatedPointThemeStyle.visible && isPointIsolated ? isolatedPointStyle : style,\n        value: {\n          x: xValue,\n          y: originalY,\n          mark,\n          accessor: isBandChart && keyIndex === 0 ? BandedAccessorType.Y0 : BandedAccessorType.Y1,\n          datum: datum.datum,\n        },\n        transform: {\n          x: shift,\n          y: 0,\n        },\n        seriesIdentifier,\n        panel,\n        isolated: isPointIsolated,\n      };\n      indexedGeometryMap.set(pointGeometry, geometryType);\n      // use the geometry only if the yDatum in contained in the current yScale domain\n      if (\n        isFiniteNumber(y) &&\n        yDefined(datum, valueAccessor) &&\n        yScale.isValueInDomain(valueAccessor(datum)) &&\n        !isDatumFilled(datum)\n      ) {\n        points.push(pointGeometry);\n      }\n    });\n    return [...acc, ...points];\n  }, [] as PointGeometry[]);\n  return {\n    pointGeometries,\n    indexedGeometryMap,\n  };\n}\n\n/** @internal */\nexport function getPointStyleOverrides(\n  datum: DataSeriesDatum,\n  seriesIdentifier: XYChartSeriesIdentifier,\n  pointStyleAccessor?: PointStyleAccessor,\n): Partial<PointStyle> | undefined {\n  const styleOverride = pointStyleAccessor && pointStyleAccessor(datum, seriesIdentifier);\n\n  if (!styleOverride) {\n    return;\n  }\n\n  if (typeof styleOverride === 'string') {\n    return {\n      stroke: styleOverride,\n    };\n  }\n\n  return styleOverride;\n}\n\n/**\n * Get the original/initial Y value from the datum\n * @param datum a DataSeriesDatum\n * @param lookingForY0 if we are interested in the y0 value, false for y1\n * @param isBandChart if the chart is a band chart\n * @param stackMode an optional stack mode\n * @internal\n */\nexport function getDatumYValue(\n  { y1, y0, initialY1, initialY0 }: DataSeriesDatum,\n  lookingForY0: boolean,\n  isBandChart: boolean,\n  stackMode?: StackMode,\n) {\n  if (isBandChart) {\n    // on band stacked charts in percentage mode, the values I'm looking for are the percentage value\n    // that are already computed and available on y0 and y1\n    // in all other cases for band charts, I want to get back the original/initial value of y0 and y1\n    // not the computed value\n    return stackMode === StackMode.Percentage ? (lookingForY0 ? y0 : y1) : lookingForY0 ? initialY0 : initialY1;\n  }\n  // if not a band chart get use the original/initial value in every case except for stack as percentage\n  // in this case, we should take the difference between the bottom position of the bar and the top position\n  // of the bar\n  return stackMode === StackMode.Percentage ? (isNil(y1) || isNil(initialY1) ? null : y1 - (y0 ?? 0)) : initialY1;\n}\n\n/**\n * Get radius function form ratio and min/max mark size\n *\n * @todo add continuous/non-stepped function\n *\n * @param  {DataSeriesDatum[]} data\n * @param  {number} lineWidth\n * @param  {number=50} markSizeRatio - 0 to 100\n * @internal\n */\nexport function getRadiusFn(\n  data: DataSeriesDatum[],\n  lineWidth: number,\n  markSizeRatio: number = 50,\n): (mark: number | null, defaultRadius?: number) => number {\n  if (data.length === 0) {\n    return () => 0;\n  }\n  const { min, max } = data.reduce(\n    (acc, { mark }) =>\n      mark === null\n        ? acc\n        : {\n            min: Math.min(acc.min, mark / 2),\n            max: Math.max(acc.max, mark / 2),\n          },\n    { min: Infinity, max: -Infinity },\n  );\n  const adjustedMarkSizeRatio = Math.min(Math.max(markSizeRatio, 0), 100);\n  const radiusStep = (max - min || max * 100) / Math.pow(adjustedMarkSizeRatio, 2);\n  return function getRadius(mark, defaultRadius = 0): number {\n    if (mark === null) {\n      return defaultRadius;\n    }\n    const circleRadius = (mark / 2 - min) / radiusStep;\n    const baseMagicNumber = 2;\n    return circleRadius ? Math.sqrt(circleRadius + baseMagicNumber) + lineWidth : lineWidth;\n  };\n}\n\nfunction yAccessorForIsolatedPointCheck(datum: DataSeriesDatum): number | null {\n  return datum.filled?.y1 ? null : datum.y1;\n}\n\nfunction isIsolatedPoint(\n  index: number,\n  length: number,\n  yDefined: YDefinedFn,\n  prev?: DataSeriesDatum,\n  next?: DataSeriesDatum,\n): boolean {\n  if (index === 0 && (isNil(next) || !yDefined(next, yAccessorForIsolatedPointCheck))) {\n    return true;\n  }\n  if (index === length - 1 && (isNil(prev) || !yDefined(prev, yAccessorForIsolatedPointCheck))) {\n    return true;\n  }\n  return (\n    (isNil(prev) || !yDefined(prev, yAccessorForIsolatedPointCheck)) &&\n    (isNil(next) || !yDefined(next, yAccessorForIsolatedPointCheck))\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendItem } from '../../../common/legend';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { isLogarithmicScale } from '../../../scales/types';\nimport { MarkBuffer } from '../../../specs';\nimport { getDistance } from '../../../utils/common';\nimport { BarGeometry, ClippedRanges, isPointGeometry, PointGeometry } from '../../../utils/geometry';\nimport { GeometryStateStyle, SharedGeometryStateStyle } from '../../../utils/themes/theme';\nimport { DataSeriesDatum, FilledValues, XYChartSeriesIdentifier } from '../utils/series';\n\n/** @internal */\nexport interface MarkSizeOptions {\n  enabled: boolean;\n  ratio?: number;\n}\n\n/**\n * Returns value of `y1` or `filled.y1` or null by default.\n * Passing a filled key (x, y1, y0) it will return that value or the filled one\n * @internal\n */\nexport function getYDatumValueFn(valueName: keyof Omit<FilledValues, 'x'> = 'y1') {\n  return (datum: DataSeriesDatum, returnFilled = true): number | null => {\n    const value = datum[valueName];\n    if (value !== null || !returnFilled) {\n      return value;\n    }\n    return datum.filled?.[valueName] ?? null;\n  };\n}\n\n/**\n *\n * @param param0\n * @internal\n */\nexport function isDatumFilled({ filled, initialY1 }: DataSeriesDatum) {\n  return filled?.x !== undefined || filled?.y1 !== undefined || initialY1 === null || initialY1 === undefined;\n}\n\n/**\n * Gets clipped ranges that have been fitted to values\n * @param dataset\n * @param xScale\n * @param xScaleOffset\n * @internal\n */\nexport function getClippedRanges(\n  dataset: DataSeriesDatum[],\n  xScale: ScaleBand | ScaleContinuous,\n  xScaleOffset: number,\n): ClippedRanges {\n  let firstNonNullX: number | null = null;\n  let hasNull = false;\n\n  const completeDatasetIsNull = dataset.every((datum) => isDatumFilled(datum));\n\n  if (completeDatasetIsNull) return [[xScale.range[0], xScale.range[1]]];\n\n  return dataset.reduce<ClippedRanges>((acc, data) => {\n    const xScaled = xScale.scale(data.x);\n    if (Number.isNaN(xScaled)) return acc;\n\n    const xValue = xScaled - xScaleOffset + xScale.bandwidth / 2;\n\n    if (isDatumFilled(data)) {\n      const endXValue = xScale.range[1] - xScale.bandwidth * (2 / 3);\n      if (firstNonNullX !== null && xValue === endXValue) {\n        acc.push([firstNonNullX, xValue]);\n      }\n      hasNull = true;\n    } else {\n      if (hasNull) {\n        if (firstNonNullX !== null) {\n          acc.push([firstNonNullX, xValue]);\n        } else {\n          acc.push([0, xValue]);\n        }\n        hasNull = false;\n      }\n\n      firstNonNullX = xValue;\n    }\n    return acc;\n  }, []);\n}\n\n/** @internal */\nexport function getGeometryStateStyle(\n  seriesIdentifier: XYChartSeriesIdentifier,\n  sharedGeometryStyle: SharedGeometryStateStyle,\n  highlightedLegendItem?: LegendItem,\n): GeometryStateStyle {\n  const { default: defaultStyles, highlighted, unhighlighted } = sharedGeometryStyle;\n\n  if (highlightedLegendItem) {\n    const isPartOfHighlightedSeries = highlightedLegendItem.seriesIdentifiers.some(\n      ({ key }) => key === seriesIdentifier.key,\n    );\n\n    return isPartOfHighlightedSeries ? highlighted : unhighlighted;\n  }\n\n  return defaultStyles;\n}\n\n/** @internal */\nexport function isPointOnGeometry(\n  xCoordinate: number,\n  yCoordinate: number,\n  indexedGeometry: BarGeometry | PointGeometry,\n  buffer: MarkBuffer,\n) {\n  const { x, y, transform } = indexedGeometry;\n  if (isPointGeometry(indexedGeometry)) {\n    const { radius } = indexedGeometry;\n    const distance = getDistance(\n      {\n        x: xCoordinate,\n        y: yCoordinate,\n      },\n      {\n        x: x + transform.x,\n        y: y + transform.y,\n      },\n    );\n\n    const radiusBuffer = typeof buffer === 'number' ? buffer : buffer(radius);\n\n    return distance <= radius + radiusBuffer;\n  }\n  const { width, height } = indexedGeometry;\n  return yCoordinate >= y && yCoordinate <= y + height && xCoordinate >= x && xCoordinate <= x + width;\n}\n\nconst getScaleTypeValueValidator = (yScale: ScaleContinuous): ((n: number) => boolean) => {\n  if (!isLogarithmicScale(yScale)) return () => true;\n  const domainPolarity = getDomainPolarity(yScale.domain);\n  return (yValue: number) => domainPolarity === Math.sign(yValue);\n};\n\n/**\n * The default zero baseline for area charts.\n */\nconst DEFAULT_ZERO_BASELINE = 0;\n\n/** @internal */\nexport type YDefinedFn = (datum: DataSeriesDatum, getValueAccessor: (d: DataSeriesDatum) => number | null) => boolean;\n\n/** @internal */\nexport function isYValueDefinedFn(yScale: ScaleContinuous, xScale: ScaleBand | ScaleContinuous): YDefinedFn {\n  const validator = getScaleTypeValueValidator(yScale);\n  return (datum, getValueAccessor) => {\n    const yValue = getValueAccessor(datum);\n    return yValue !== null && validator(yValue) && xScale.isValueInDomain(datum.x);\n  };\n}\n\n/** @internal */\nexport const CHROME_PINCH_BUG_EPSILON = 0.5;\n\n/**\n * Temporary fix for Chromium bug\n * Shift a small pixel value when pixel diff is <= 0.5px\n * https://github.com/elastic/elastic-charts/issues/1053\n * https://bugs.chromium.org/p/chromium/issues/detail?id=1163912\n */\nfunction chromeRenderBugBuffer(y1: number, y0: number): number {\n  return Math.abs(y1 - y0) <= CHROME_PINCH_BUG_EPSILON ? 0.5 : 0;\n}\n\n/** @internal */\nexport function getY1ScaledValueFn(yScale: ScaleContinuous): (datum: DataSeriesDatum) => number {\n  const datumAccessor = getYDatumValueFn();\n  const scaleY0Value = getY0ScaledValueFn(yScale);\n  return (datum) => {\n    const y1Value = yScale.scale(datumAccessor(datum));\n    const y0Value = scaleY0Value(datum);\n    return y1Value - chromeRenderBugBuffer(y1Value, y0Value);\n  };\n}\n\n/** @internal */\nexport function getY0ScaledValueFn(yScale: ScaleContinuous): (datum: DataSeriesDatum) => number {\n  const domainPolarity = getDomainPolarity(yScale.domain);\n  const logBaseline = domainPolarity >= 0 ? Math.min(...yScale.domain) : Math.max(...yScale.domain);\n  return ({ y0 }) =>\n    isLogarithmicScale(yScale) // checking wrong y0 polarity\n      ? y0 === null || domainPolarity !== Math.sign(y0) // if all positive domain use 1 as baseline, -1 otherwise\n        ? yScale.scale(logBaseline)\n        : yScale.scale(y0) // if negative value, use -1 as max reference, 1 otherwise\n      : yScale.scale(y0 === null ? DEFAULT_ZERO_BASELINE : y0);\n}\n\nfunction getDomainPolarity(domain: number[]): number {\n  // 1 if both numbers are positive, -1 if both are negative, 0 if zeros or mixed\n  return Math.sign(Math.sign(domain[0] ?? NaN) + Math.sign(domain[1] ?? NaN));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { X_SCALE_DEFAULT, Y_SCALE_DEFAULT } from './scale_defaults';\nimport { ScaleContinuousType } from '../../../scales';\nimport { BasicSeriesSpec, XScaleType } from '../utils/specs';\n\n/** @internal */\nexport function getXScaleTypeFromSpec(type?: BasicSeriesSpec['xScaleType']): XScaleType {\n  return type ?? X_SCALE_DEFAULT.type;\n}\n\n/** @internal */\nexport function getXNiceFromSpec(nice?: BasicSeriesSpec['xNice']): boolean {\n  return nice ?? X_SCALE_DEFAULT.nice;\n}\n\n/** @internal */\nexport function getYScaleTypeFromSpec(type?: BasicSeriesSpec['yScaleType']): ScaleContinuousType {\n  return type ?? Y_SCALE_DEFAULT.type;\n}\n\n/** @internal */\nexport function getYNiceFromSpec(nice?: BasicSeriesSpec['yNice']): boolean {\n  return nice ?? Y_SCALE_DEFAULT.nice;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleType } from '../../../scales/constants';\n\n/** @internal */\nexport const X_SCALE_DEFAULT = {\n  type: ScaleType.Ordinal,\n  nice: false,\n  desiredTickCount: 10,\n};\n\n/** @internal */\nexport const Y_SCALE_DEFAULT = {\n  type: ScaleType.Linear,\n  nice: false,\n  desiredTickCount: 5,\n  constrainDomainPadding: undefined,\n  domainPixelPadding: 0,\n  logBase: undefined,\n  logMinLimit: undefined,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { AreaSeriesSpec, HistogramModeAlignments, DEFAULT_GLOBAL_ID, SeriesType, BaseDatum } from '../utils/specs';\n\nconst buildProps = buildSFProps<AreaSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Area,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Linear,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n    histogramModeAlignment: HistogramModeAlignments.Center,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const AreaSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    AreaSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<AreaSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type AreaSeriesProps = ComponentProps<typeof AreaSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { SpecType } from '../../../specs/constants';\nimport { specComponentFactory } from '../../../state/spec_factory';\nimport { Position } from '../../../utils/common';\nimport { AxisSpec, DEFAULT_GLOBAL_ID } from '../utils/specs';\n\n/**\n * Add axis spec to chart\n * @public\n */\nexport const Axis = specComponentFactory<AxisSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Axis,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    hide: false,\n    showOverlappingTicks: false,\n    showOverlappingLabels: false,\n    position: Position.Left,\n    timeAxisLayerCount: 0,\n  },\n);\n\n/** @public */\nexport type AxisProps = ComponentProps<typeof Axis>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { useSpecFactory, SFProps, buildSFProps } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { BarSeriesSpec, BaseDatum, DEFAULT_GLOBAL_ID, SeriesType } from '../utils/specs';\n\nconst buildProps = buildSFProps<BarSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Bar,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Ordinal,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n    enableHistogramMode: false,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const BarSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    BarSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<BarSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type BarSeriesProps = ComponentProps<typeof BarSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { BaseDatum, BubbleSeriesSpec, DEFAULT_GLOBAL_ID, SeriesType } from '../utils/specs';\n\nconst buildProps = buildSFProps<BubbleSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Bubble,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Ordinal,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const BubbleSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    BubbleSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<BubbleSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type BubbleSeriesProps = ComponentProps<typeof BubbleSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { HistogramBarSeriesSpec, DEFAULT_GLOBAL_ID, SeriesType, BaseDatum } from '../utils/specs';\n\nconst buildProps = buildSFProps<HistogramBarSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Bar,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Linear,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n    enableHistogramMode: true as const,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const HistogramBarSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    HistogramBarSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<HistogramBarSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type HistogramBarSeriesProps = ComponentProps<typeof HistogramBarSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './area_series';\nexport * from './axis';\nexport * from './bar_series';\nexport * from './bubble_series';\nexport * from './histogram_bar_series';\nexport * from './line_annotation';\nexport * from './line_series';\nexport * from './rect_annotation';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { stripUndefined } from '../../../utils/common';\nimport { DEFAULT_ANNOTATION_LINE_STYLE } from '../../../utils/themes/merge_utils';\nimport { LineAnnotationSpec, DEFAULT_GLOBAL_ID, AnnotationType } from '../utils/specs';\n\nconst buildProps = buildSFProps<LineAnnotationSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Annotation,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    annotationType: AnnotationType.Line,\n    style: DEFAULT_ANNOTATION_LINE_STYLE,\n    hideLines: false,\n    hideTooltips: false,\n    hideLinesTooltips: true,\n    zIndex: 1,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const LineAnnotation = function <D = any>(\n  props: SFProps<\n    LineAnnotationSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<LineAnnotationSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type LineAnnotationProps = ComponentProps<typeof LineAnnotation>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { SFProps, buildSFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { LineSeriesSpec, DEFAULT_GLOBAL_ID, HistogramModeAlignments, SeriesType, BaseDatum } from '../utils/specs';\n\nconst buildProps = buildSFProps<LineSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Line,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Ordinal,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n    histogramModeAlignment: HistogramModeAlignments.Center,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const LineSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    LineSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<LineSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type LineSeriesProps = ComponentProps<typeof LineSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { SpecType } from '../../../specs/constants';\nimport { specComponentFactory } from '../../../state/spec_factory';\nimport { DEFAULT_ANNOTATION_RECT_STYLE } from '../../../utils/themes/merge_utils';\nimport { RectAnnotationSpec, DEFAULT_GLOBAL_ID, AnnotationType } from '../utils/specs';\n\n/** @public */\nexport const RectAnnotation = specComponentFactory<RectAnnotationSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Annotation,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    annotationType: AnnotationType.Rectangle,\n    zIndex: -1,\n    style: DEFAULT_ANNOTATION_RECT_STYLE,\n    outside: false,\n  },\n);\n\n/** @public */\nexport type RectAnnotationProps = ComponentProps<typeof RectAnnotation>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { computeChartDimensionsSelector } from './selectors/compute_chart_dimensions';\nimport { computeLegendSelector } from './selectors/compute_legend';\nimport { computeSeriesDomainsSelector } from './selectors/compute_series_domains';\nimport { getBrushAreaSelector } from './selectors/get_brush_area';\nimport { getChartTypeDescriptionSelector } from './selectors/get_chart_type_description';\nimport { getPointerCursorSelector } from './selectors/get_cursor_pointer';\nimport { getDebugStateSelector } from './selectors/get_debug_state';\nimport { getLegendItemExtraValuesSelector } from './selectors/get_legend_item_extra_values';\nimport { getLegendItemsLabelsSelector } from './selectors/get_legend_items_labels';\nimport { getSeriesSpecsSelector } from './selectors/get_specs';\nimport { getTooltipAnchorPositionSelector } from './selectors/get_tooltip_anchor_position';\nimport { getTooltipInfoSelector } from './selectors/get_tooltip_values_highlighted_geoms';\nimport { isBrushAvailableSelector } from './selectors/is_brush_available';\nimport { isChartEmptySelector } from './selectors/is_chart_empty';\nimport { isTooltipVisibleSelector } from './selectors/is_tooltip_visible';\nimport { createOnBrushEndCaller } from './selectors/on_brush_end_caller';\nimport { createOnClickCaller } from './selectors/on_click_caller';\nimport { createOnElementOutCaller } from './selectors/on_element_out_caller';\nimport { createOnElementOverCaller } from './selectors/on_element_over_caller';\nimport { createOnPointerMoveCaller } from './selectors/on_pointer_move_caller';\nimport { createOnProjectionAreaCaller } from './selectors/on_projection_area_caller';\nimport { ChartType } from '../..';\nimport { LegendItemExtraValues } from '../../../common/legend';\nimport { SeriesKey } from '../../../common/series_id';\nimport { BrushTool } from '../../../components/brush/brush';\nimport { Tooltip } from '../../../components/tooltip/tooltip';\nimport { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state';\nimport { getChartContainerDimensionsSelector } from '../../../state/selectors/get_chart_container_dimensions';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { isBrushingSelector } from '../../../state/selectors/is_brushing';\nimport { htmlIdGenerator } from '../../../utils/common';\nimport { XYChart } from '../renderer/canvas/xy_chart';\nimport { Annotations } from '../renderer/dom/annotations';\nimport { CursorBand } from '../renderer/dom/cursor_band';\nimport { CursorCrossLine } from '../renderer/dom/cursor_crossline';\nimport { CursorLine } from '../renderer/dom/cursor_line';\nimport { Highlighter } from '../renderer/dom/highlighter';\n\n/** @internal */\nexport class XYAxisChartState implements InternalChartState {\n  chartType: ChartType;\n\n  legendId: string;\n\n  onClickCaller: (state: GlobalChartState) => void;\n\n  onElementOverCaller: (state: GlobalChartState) => void;\n\n  onElementOutCaller: (state: GlobalChartState) => void;\n\n  onBrushEndCaller: (state: GlobalChartState) => void;\n\n  onPointerMoveCaller: (state: GlobalChartState) => void;\n\n  onProjectionAreaCaller: (state: GlobalChartState) => void;\n\n  constructor() {\n    this.onClickCaller = createOnClickCaller();\n    this.onElementOverCaller = createOnElementOverCaller();\n    this.onElementOutCaller = createOnElementOutCaller();\n    this.onBrushEndCaller = createOnBrushEndCaller();\n    this.onPointerMoveCaller = createOnPointerMoveCaller();\n    this.onProjectionAreaCaller = createOnProjectionAreaCaller();\n    this.chartType = ChartType.XYAxis;\n    this.legendId = htmlIdGenerator()('legend');\n  }\n\n  isInitialized(globalState: GlobalChartState) {\n    return getSeriesSpecsSelector(globalState).length > 0 ? InitStatus.Initialized : InitStatus.SpecNotInitialized;\n  }\n\n  isBrushAvailable(globalState: GlobalChartState) {\n    return isBrushAvailableSelector(globalState);\n  }\n\n  isBrushing(globalState: GlobalChartState) {\n    return this.isBrushAvailable(globalState) && isBrushingSelector(globalState);\n  }\n\n  isChartEmpty(globalState: GlobalChartState) {\n    return isChartEmptySelector(globalState);\n  }\n\n  getMainProjectionArea(globalState: GlobalChartState) {\n    return computeChartDimensionsSelector(globalState).chartDimensions;\n  }\n\n  getProjectionContainerArea(globalState: GlobalChartState) {\n    return getChartContainerDimensionsSelector(globalState);\n  }\n\n  getBrushArea(globalState: GlobalChartState) {\n    return getBrushAreaSelector(globalState);\n  }\n\n  getLegendItemsLabels(globalState: GlobalChartState) {\n    return getLegendItemsLabelsSelector(globalState);\n  }\n\n  getLegendItems(globalState: GlobalChartState) {\n    return computeLegendSelector(globalState);\n  }\n\n  getLegendExtraValues(globalState: GlobalChartState): Map<SeriesKey, LegendItemExtraValues> {\n    return getLegendItemExtraValuesSelector(globalState);\n  }\n\n  chartRenderer(containerRef: BackwardRef, forwardCanvasRef: RefObject<HTMLCanvasElement>) {\n    return (\n      <>\n        <CursorBand />\n        <XYChart forwardCanvasRef={forwardCanvasRef} />\n        <CursorLine />\n        <CursorCrossLine />\n        <Tooltip getChartContainerRef={containerRef} />\n        <Annotations getChartContainerRef={containerRef} chartAreaRef={forwardCanvasRef} />\n        <Highlighter />\n        <BrushTool />\n      </>\n    );\n  }\n\n  getPointerCursor(globalState: GlobalChartState) {\n    return getPointerCursorSelector(globalState);\n  }\n\n  isTooltipVisible(globalState: GlobalChartState) {\n    return isTooltipVisibleSelector(globalState);\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfoSelector(globalState);\n  }\n\n  getTooltipAnchor(globalState: GlobalChartState) {\n    return getTooltipAnchorPositionSelector(globalState);\n  }\n\n  getSmallMultiplesDomains(globalState: GlobalChartState) {\n    return computeSeriesDomainsSelector(globalState);\n  }\n\n  eventCallbacks(globalState: GlobalChartState) {\n    this.onElementOverCaller(globalState);\n    this.onElementOutCaller(globalState);\n    this.onClickCaller(globalState);\n    this.onBrushEndCaller(globalState);\n    this.onPointerMoveCaller(globalState);\n    this.onProjectionAreaCaller(globalState);\n  }\n\n  getDebugState(globalState: GlobalChartState) {\n    return getDebugStateSelector(globalState);\n  }\n\n  getChartTypeDescription(globalState: GlobalChartState) {\n    return getChartTypeDescriptionSelector(globalState);\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getScaleConfigsFromSpecsSelector } from './get_api_scale_configs';\nimport { getAxisSpecsSelector, getSeriesSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Rotation } from '../../../../utils/common';\nimport { SpecId } from '../../../../utils/ids';\nimport { defaultTickFormatter, isXDomain } from '../../utils/axis_utils';\nimport { groupBy } from '../../utils/group_data_series';\nimport { AxisSpec } from '../../utils/specs';\n\n/** @internal */\nexport type AxisLabelFormatter<V = unknown> = (value: V) => string;\n\n/** @internal */\nexport type AxisLabelFormatters = { x: Map<SpecId, AxisLabelFormatter>; y: Map<SpecId, AxisLabelFormatter> };\n\n/** @internal */\nexport const getAxisTickLabelFormatter = createCustomCachedSelector(\n  [getSeriesSpecsSelector, getAxisSpecsSelector, getSettingsSpecSelector, getScaleConfigsFromSpecsSelector],\n  (seriesSpecs, axesSpecs, { rotation }, scaleConfigs): AxisLabelFormatters => {\n    const seriesByGroupId = groupBy(seriesSpecs, ['groupId'], false);\n    const axesByGroupId = groupBy(axesSpecs, ['groupId'], false);\n    const groupIds = [...new Set([...Object.keys(seriesByGroupId), ...Object.keys(axesByGroupId)])];\n    const { timeZone } = scaleConfigs.x;\n    // we need to do that by groupId to find the first Y spec formatter fallback\n    return groupIds.reduce<AxisLabelFormatters>(\n      (acc, groupId) => {\n        const ySpecDataFormatter = (seriesByGroupId[groupId] ?? []).find(({ tickFormat }) => tickFormat)?.tickFormat;\n        const axes = groupAxesByCartesianCoords(axesByGroupId[groupId] ?? [], rotation);\n        axes.x.forEach((spec) => {\n          acc.x.set(spec.id, (v) => (spec?.labelFormat ?? spec?.tickFormat ?? defaultTickFormatter)(v, { timeZone }));\n        });\n        axes.y.forEach((spec) => {\n          acc.y.set(spec.id, (v) =>\n            (spec.labelFormat ?? spec.tickFormat ?? ySpecDataFormatter ?? defaultTickFormatter)(v, {}),\n          );\n        });\n        return acc;\n      },\n      { x: new Map(), y: new Map() },\n    );\n  },\n);\n\nfunction groupAxesByCartesianCoords(sameGroupAxes: AxisSpec[], chartRotation: Rotation = 0) {\n  return sameGroupAxes.reduce<{ x: AxisSpec[]; y: AxisSpec[] }>(\n    (acc, spec) => {\n      acc[isXDomain(spec.position, chartRotation) ? 'x' : 'y'].push(spec);\n      return acc;\n    },\n    { x: [], y: [] },\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getAxesStylesSelector } from './get_axis_styles';\nimport { getAxisSpecsSelector, getAnnotationSpecsSelector } from './get_specs';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { AxisId } from '../../../../utils/ids';\nimport { computeAnnotationDimensions } from '../../annotations/utils';\n\nconst getAxisStyleGetter = createCustomCachedSelector(\n  [getAxesStylesSelector, getChartThemeSelector],\n  (axisStyles, { axes }) =>\n    (id: AxisId = '') =>\n      axisStyles.get(id) ?? axes,\n);\n\n/** @internal */\nexport const computeAnnotationDimensionsSelector = createCustomCachedSelector(\n  [\n    getAnnotationSpecsSelector,\n    getSettingsSpecSelector,\n    computeSeriesGeometriesSelector,\n    getAxisSpecsSelector,\n    isHistogramModeEnabledSelector,\n    computeSmallMultipleScalesSelector,\n    getAxisStyleGetter,\n  ],\n  computeAnnotationDimensions,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getAxesStylesSelector } from './get_axis_styles';\nimport { axisSpecsLookupSelector } from './get_specs';\nimport { getVisibleTickSetsSelector } from './visible_ticks';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getAxesGeometries } from '../../utils/axis_utils';\n\n/** @internal */\nexport const computeAxesGeometriesSelector = createCustomCachedSelector(\n  [\n    computeChartDimensionsSelector,\n    getChartThemeSelector,\n    axisSpecsLookupSelector,\n    getAxesStylesSelector,\n    computeSmallMultipleScalesSelector,\n    getVisibleTickSetsSelector,\n  ],\n  getAxesGeometries,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisLabelFormatter, getAxisTickLabelFormatter } from './axis_tick_formatter';\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { countBarsInClusterSelector } from './count_bars_in_cluster';\nimport { getAxesStylesSelector } from './get_axis_styles';\nimport { getBarPaddingsSelector } from './get_bar_paddings';\nimport { getAxisSpecsSelector, getSeriesSpecsSelector } from './get_specs';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { TextMeasure, withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { AxisId } from '../../../../utils/ids';\nimport { Logger } from '../../../../utils/logger';\nimport { AxisStyle, GridLineStyle } from '../../../../utils/themes/theme';\nimport { isVerticalAxis } from '../../utils/axis_type_utils';\nimport {\n  computeRotatedLabelDimensions,\n  defaultTickFormatter,\n  getScaleForAxisSpec,\n  isXDomain,\n  TickLabelBounds,\n} from '../../utils/axis_utils';\nimport { AxisSpec, TickFormatter } from '../../utils/specs';\n\n/** @internal */\nexport type AxesTicksDimensions = Map<AxisId, TickLabelBounds>;\n\nconst getScaleFunction = createCustomCachedSelector(\n  [\n    computeSeriesDomainsSelector,\n    getSettingsSpecSelector,\n    countBarsInClusterSelector,\n    getBarPaddingsSelector,\n    isHistogramModeEnabledSelector,\n  ],\n  getScaleForAxisSpec,\n);\n\n/** @internal */\nexport const getFallBackTickFormatter = createCustomCachedSelector(\n  [getSeriesSpecsSelector],\n  (seriesSpecs): TickFormatter => seriesSpecs.find(({ tickFormat }) => tickFormat)?.tickFormat ?? defaultTickFormatter,\n);\n\nconst getUnitScales = createCustomCachedSelector([getScaleFunction, getAxisSpecsSelector], (getScale, axesSpecs) =>\n  axesSpecs.reduce<Map<AxisId, ScaleBand | ScaleContinuous>>((unitScales, axisSpec) => {\n    const scale = getScale(axisSpec, [0, 1]);\n    if (scale) unitScales.set(axisSpec.id, scale);\n    else Logger.warn(`Cannot compute scale for axis spec ${axisSpec.id}. Axis will not be displayed.`);\n    return unitScales;\n  }, new Map()),\n);\n\nconst getThemedAxesStyles = createCustomCachedSelector(\n  [getChartThemeSelector, getAxesStylesSelector],\n  (chartTheme, axesStyles): Map<AxisId, AxisStyle> =>\n    [...axesStyles.keys()].reduce((styles, id) => styles.set(id, axesStyles.get(id) ?? chartTheme.axes), new Map()),\n);\n\n/** @internal */\nexport type JoinedAxisData = {\n  axisSpec: AxisSpec;\n  scale: ScaleContinuous | ScaleBand;\n  axesStyle: AxisStyle;\n  gridLine: GridLineStyle;\n  isXAxis: boolean;\n  labelFormatter: AxisLabelFormatter;\n};\n\n/** @internal */\nexport const getJoinedVisibleAxesData = createCustomCachedSelector(\n  [getUnitScales, getAxisSpecsSelector, getThemedAxesStyles, getSettingsSpecSelector, getAxisTickLabelFormatter],\n  (unitScales, axesSpecs, themedAxesStyles, { rotation }, axisTickLabelFormatters) =>\n    axesSpecs.reduce<Map<AxisId, JoinedAxisData>>((axisData, axisSpec) => {\n      const { id, position, hide } = axisSpec;\n      const axesStyle = themedAxesStyles.get(id);\n      const scale = unitScales.get(id);\n\n      if (scale && axesStyle) {\n        const gridLine = isVerticalAxis(position) ? axesStyle.gridLine.vertical : axesStyle.gridLine.horizontal;\n        const axisShown = gridLine.visible || !hide;\n        const isXAxis = isXDomain(position, rotation);\n        const labelFormatter = axisTickLabelFormatters[isXAxis ? 'x' : 'y'].get(id) ?? defaultTickFormatter;\n\n        if (axisShown)\n          axisData.set(id, {\n            axisSpec,\n            scale,\n            axesStyle,\n            gridLine,\n            labelFormatter,\n            isXAxis,\n          });\n      }\n      return axisData;\n    }, new Map()),\n);\n\n/** @internal */\nexport const getLabelBox = (\n  axesStyle: AxisStyle,\n  ticks: Array<string | number>,\n  labelFormatter: AxisLabelFormatter,\n  textMeasure: TextMeasure,\n  axisSpec: AxisSpec,\n  gridLine: GridLineStyle,\n): TickLabelBounds => ({\n  ...(axesStyle.tickLabel.visible ? ticks.map(labelFormatter) : []).reduce(\n    (sizes, labelText) => {\n      const bbox = textMeasure(\n        labelText,\n        {\n          fontStyle: axesStyle.tickLabel.fontStyle ?? 'normal',\n          fontFamily: axesStyle.tickLabel.fontFamily,\n          fontWeight: 'normal',\n          fontVariant: 'normal',\n        },\n        axesStyle.tickLabel.fontSize,\n      );\n      const rotatedBbox = computeRotatedLabelDimensions(bbox, axesStyle.tickLabel.rotation);\n      sizes.maxLabelBboxWidth = Math.max(sizes.maxLabelBboxWidth, Math.ceil(rotatedBbox.width));\n      sizes.maxLabelBboxHeight = Math.max(sizes.maxLabelBboxHeight, Math.ceil(rotatedBbox.height));\n      sizes.maxLabelTextWidth = Math.max(sizes.maxLabelTextWidth, Math.ceil(bbox.width));\n      sizes.maxLabelTextHeight = Math.max(sizes.maxLabelTextHeight, Math.ceil(bbox.height));\n      return sizes;\n    },\n    { maxLabelBboxWidth: 0, maxLabelBboxHeight: 0, maxLabelTextWidth: 0, maxLabelTextHeight: 0 },\n  ),\n  isHidden: axisSpec.hide && gridLine.visible,\n});\n\n/** @internal */\nexport const computeAxisTicksDimensionsSelector = createCustomCachedSelector(\n  [getJoinedVisibleAxesData],\n  (joinedAxesData): AxesTicksDimensions =>\n    withTextMeasure(\n      (textMeasure): AxesTicksDimensions =>\n        [...joinedAxesData].reduce<AxesTicksDimensions>(\n          (axesTicksDimensions, [id, { axisSpec, scale, axesStyle, gridLine, labelFormatter }]) =>\n            axesTicksDimensions.set(\n              id,\n              getLabelBox(axesStyle, scale.ticks(), labelFormatter, textMeasure, axisSpec, gridLine),\n            ),\n          new Map(),\n        ),\n    ),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxisTicksDimensionsSelector } from './compute_axis_ticks_dimensions';\nimport { getAxesStylesSelector } from './get_axis_styles';\nimport { getAxisSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSmallMultiplesSpec } from '../../../../state/selectors/get_small_multiples_spec';\nimport { computeChartDimensions } from '../../utils/dimensions';\n\n/** @internal */\nexport const computeChartDimensionsSelector = createCustomCachedSelector(\n  [\n    getChartContainerDimensionsSelector,\n    getChartThemeSelector,\n    computeAxisTicksDimensionsSelector,\n    getAxesStylesSelector,\n    getAxisSpecsSelector,\n    getSmallMultiplesSpec,\n  ],\n  computeChartDimensions,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Transform } from '../utils/types';\nimport { computeChartTransform } from '../utils/utils';\n\n/** @internal */\nexport const computeChartTransformSelector = createCustomCachedSelector(\n  [computeChartDimensionsSelector, getSettingsSpecSelector],\n  (chartDimensions, settingsSpecs): Transform =>\n    computeChartTransform(chartDimensions.chartDimensions, settingsSpecs.rotation),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { getSeriesColorsSelector } from './get_series_color_map';\nimport { getSiDataSeriesMapSelector } from './get_si_dataseries_map';\nimport { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs';\nimport { LegendItem } from '../../../../common/legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getDeselectedSeriesSelector } from '../../../../state/selectors/get_deselected_data_series';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { computeLegend } from '../../legend/legend';\nimport { DataSeries } from '../../utils/series';\n\n/** @internal */\nexport const computeLegendSelector = createCustomCachedSelector(\n  [\n    getSeriesSpecsSelector,\n    computeSeriesDomainsSelector,\n    getChartThemeSelector,\n    getSeriesColorsSelector,\n    getAxisSpecsSelector,\n    getDeselectedSeriesSelector,\n    getSettingsSpecSelector,\n    getSiDataSeriesMapSelector,\n  ],\n  (\n    seriesSpecs,\n    { formattedDataSeries, xDomain },\n    chartTheme,\n    seriesColors,\n    axesSpecs,\n    deselectedDataSeries,\n    settings,\n    siDataSeriesMap: Record<string, DataSeries>,\n  ): LegendItem[] => {\n    return computeLegend(\n      xDomain,\n      formattedDataSeries,\n      seriesColors,\n      seriesSpecs,\n      axesSpecs,\n      settings,\n      siDataSeriesMap,\n      chartTheme,\n      deselectedDataSeries,\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesGeometriesSelector } from './compute_axes_geometries';\nimport {\n  getPanelTitle,\n  getPerPanelMap,\n  hasSMDomain,\n  PerPanelMap,\n  SmallMultipleScales,\n} from '../../../../common/panel_utils';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSmallMultiplesIndexOrderSelector } from '../../../../state/selectors/get_small_multiples_index_order';\nimport { Position } from '../../../../utils/common';\nimport { isHorizontalAxis, isVerticalAxis } from '../../utils/axis_type_utils';\nimport { AxisGeometry } from '../../utils/axis_utils';\n\n/** @internal */\nexport type PerPanelAxisGeoms = {\n  axesGeoms: AxisGeometry[];\n} & PerPanelMap;\n\nconst isPrimaryColumnFn =\n  ({ horizontal: { domain } }: SmallMultipleScales) =>\n  (position: Position, horizontalValue: any) =>\n    isVerticalAxis(position) && domain[0] === horizontalValue;\n\nconst isPrimaryRowFn =\n  ({ vertical: { domain } }: SmallMultipleScales) =>\n  (position: Position, verticalValue: any) =>\n    isHorizontalAxis(position) && domain[0] === verticalValue;\n\n/** @internal */\nexport const computePerPanelAxesGeomsSelector = createCustomCachedSelector(\n  [computeAxesGeometriesSelector, computeSmallMultipleScalesSelector, getSmallMultiplesIndexOrderSelector],\n  (axesGeoms, scales, groupBySpec): Array<PerPanelAxisGeoms> => {\n    const { horizontal, vertical } = scales;\n    const isPrimaryColumn = isPrimaryColumnFn(scales);\n    const isPrimaryRow = isPrimaryRowFn(scales);\n\n    return getPerPanelMap(scales, (_, h, v) => ({\n      axesGeoms: axesGeoms.map((geom) => {\n        const { position } = geom.axis;\n        const isVertical = isVerticalAxis(position);\n        const usePanelTitle = isVertical ? hasSMDomain(vertical) : hasSMDomain(horizontal);\n        const panelTitle = usePanelTitle ? getPanelTitle(isVertical, v, h, groupBySpec) : undefined;\n        const secondary = !isPrimaryColumn(position, h) && !isPrimaryRow(position, v);\n\n        return { ...geom, axis: { ...geom.axis, panelTitle, secondary } };\n      }),\n    }));\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getScaleConfigsFromSpecsSelector } from './get_api_scale_configs';\nimport { getAnnotationSpecsSelector, getSeriesSpecsSelector } from './get_specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getSmallMultiplesIndexOrderSelector } from '../../../../state/selectors/get_small_multiples_index_order';\nimport { computeSeriesDomains } from '../utils/utils';\n\nconst getDeselectedSeriesSelector = (state: GlobalChartState) => state.interactions.deselectedDataSeries;\n\n/** @internal */\nexport const computeSeriesDomainsSelector = createCustomCachedSelector(\n  [\n    getSeriesSpecsSelector,\n    getScaleConfigsFromSpecsSelector,\n    getAnnotationSpecsSelector,\n    getSettingsSpecSelector,\n    getDeselectedSeriesSelector,\n    getSmallMultiplesIndexOrderSelector,\n  ],\n  computeSeriesDomains,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getFallBackTickFormatter } from './compute_axis_ticks_dimensions';\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { getSeriesColorsSelector } from './get_series_color_map';\nimport { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { computeSeriesGeometries } from '../utils/utils';\n\n/** @internal */\nexport const computeSeriesGeometriesSelector = createCustomCachedSelector(\n  [\n    getSeriesSpecsSelector,\n    computeSeriesDomainsSelector,\n    getSeriesColorsSelector,\n    getChartThemeSelector,\n    getSettingsSpecSelector,\n    getAxisSpecsSelector,\n    computeSmallMultipleScalesSelector,\n    isHistogramModeEnabledSelector,\n    getFallBackTickFormatter,\n  ],\n  (specs, domain, colors, theme, settings, axis, smScales, isHistogram, fallbackFormatter) => {\n    return withTextMeasure((measureText) =>\n      computeSeriesGeometries(\n        specs,\n        domain,\n        colors,\n        theme,\n        settings,\n        axis,\n        smScales,\n        isHistogram,\n        fallbackFormatter,\n        measureText,\n      ),\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { SeriesType } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { groupBy } from '../../utils/group_data_series';\nimport { getBarIndexKey } from '../utils/utils';\n\n/** @internal */\nexport const countBarsInClusterSelector = createCustomCachedSelector(\n  [computeSeriesDomainsSelector],\n  function countBarsInCluster({ formattedDataSeries }): number {\n    const barDataSeries = formattedDataSeries.filter(({ seriesType }) => seriesType === SeriesType.Bar);\n    const dataSeriesGroupedByPanel = groupBy(\n      barDataSeries,\n      ['smVerticalAccessorValue', 'smHorizontalAccessorValue'],\n      false,\n    );\n\n    const barIndexByPanel = Object.keys(dataSeriesGroupedByPanel).reduce<Record<string, string[]>>((acc, panelKey) => {\n      const panelBars = dataSeriesGroupedByPanel[panelKey] ?? [];\n      const barDataSeriesByBarIndex = groupBy(panelBars, getBarIndexKey, false);\n\n      acc[panelKey] = Object.keys(barDataSeriesByBarIndex);\n      return acc;\n    }, {});\n\n    return Object.values(barIndexByPanel).reduce((acc, curr) => {\n      return Math.max(acc, curr.length);\n    }, 0);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAnnotationDimensionsSelector } from './compute_annotations';\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getAnnotationSpecsSelector } from './get_specs';\nimport { getTooltipInfoSelector } from './get_tooltip_values_highlighted_geoms';\nimport { TooltipPortalSettings } from '../../../../components/portal/types';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { DOMElement } from '../../../../state/actions/dom_element';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { AnnotationId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { AnnotationLineProps } from '../../annotations/line/types';\nimport { AnnotationRectProps } from '../../annotations/rect/types';\nimport { computeRectAnnotationTooltipState } from '../../annotations/tooltip';\nimport { AnnotationTooltipState, AnnotationDimensions } from '../../annotations/types';\nimport { AnnotationSpec, AnnotationType } from '../../utils/specs';\nimport { ComputedGeometries } from '../utils/types';\n\nconst getCurrentPointerPosition = (state: GlobalChartState) => state.interactions.pointer.current.position;\nconst getHoveredDOMElement = (state: GlobalChartState) => state.interactions.hoveredDOMElement;\n\n/** @internal */\nexport const getAnnotationTooltipStateSelector = createCustomCachedSelector(\n  [\n    getCurrentPointerPosition,\n    computeChartDimensionsSelector,\n    computeSeriesGeometriesSelector,\n    getChartRotationSelector,\n    getAnnotationSpecsSelector,\n    computeAnnotationDimensionsSelector,\n    getTooltipInfoSelector,\n    getHoveredDOMElement,\n  ],\n  getAnnotationTooltipState,\n);\n\nfunction getAnnotationTooltipState(\n  cursorPosition: Point,\n  {\n    chartDimensions,\n  }: {\n    chartDimensions: Dimensions;\n  },\n  geometries: ComputedGeometries,\n  chartRotation: Rotation,\n  annotationSpecs: AnnotationSpec[],\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  tooltip: TooltipInfo,\n  hoveredDOMElement: DOMElement | null,\n): AnnotationTooltipState | null {\n  const hoveredTooltip = getTooltipStateForDOMElements(\n    chartDimensions,\n    annotationSpecs,\n    annotationDimensions,\n    hoveredDOMElement,\n  );\n\n  if (hoveredTooltip) {\n    return hoveredTooltip;\n  }\n  // get positions relative to chart\n  if (cursorPosition.x < 0 || cursorPosition.y < 0) {\n    return null;\n  }\n  const { xScale, yScales } = geometries.scales;\n  // only if we have a valid cursor position and the necessary scale\n  if (!xScale || !yScales) {\n    return null;\n  }\n  const tooltipState = computeRectAnnotationTooltipState(\n    cursorPosition,\n    annotationDimensions,\n    annotationSpecs,\n    chartRotation,\n    chartDimensions,\n  );\n\n  // If there's a highlighted chart element tooltip value, don't show annotation tooltip\n  const isChartTooltipDisplayed = tooltip.values.some(({ isHighlighted }) => isHighlighted);\n  if (\n    tooltipState &&\n    tooltipState.isVisible &&\n    tooltipState.annotationType === AnnotationType.Rectangle &&\n    isChartTooltipDisplayed\n  ) {\n    return null;\n  }\n\n  return tooltipState;\n}\n\n/** @internal */\nexport function getTooltipStateForDOMElements(\n  chartDimensions: Dimensions,\n  annotationSpecs: AnnotationSpec[],\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  hoveredDOMElement: DOMElement | null,\n): AnnotationTooltipState | null {\n  if (!hoveredDOMElement) {\n    return null;\n  }\n  // current type for hoveredDOMElement is only used for line annotation markers\n  // and we can safety cast the union types to the respective Line types\n  const spec = annotationSpecs.find(({ id }) => id === hoveredDOMElement.createdBySpecId);\n  if (!spec || spec.hideTooltips) {\n    return null;\n  }\n  const dimension = (annotationDimensions.get(hoveredDOMElement.createdBySpecId) ?? [])\n    .filter(isAnnotationLineProps)\n    .find(({ id }) => id === hoveredDOMElement.id);\n\n  if (!dimension) {\n    return null;\n  }\n\n  return {\n    id: dimension.id,\n    specId: spec.id,\n    isVisible: true,\n    annotationType: AnnotationType.Line,\n    datum: dimension.datum,\n    anchor: {\n      y: (dimension.markers[0]?.position.top ?? 0) + dimension.panel.top + chartDimensions.top,\n      x: (dimension.markers[0]?.position.left ?? 0) + dimension.panel.left + chartDimensions.left,\n      width: 0,\n      height: 0,\n    },\n    customTooltipDetails: spec.customTooltipDetails,\n    customTooltip: spec.customTooltip,\n    tooltipSettings: getTooltipSettings(spec),\n  };\n}\n\nfunction isAnnotationLineProps(prop: AnnotationLineProps | AnnotationRectProps): prop is AnnotationLineProps {\n  return 'linePathPoints' in prop;\n}\n\nfunction getTooltipSettings({\n  placement,\n  fallbackPlacements,\n  boundary,\n  offset,\n}: AnnotationSpec): TooltipPortalSettings<'chart'> {\n  return {\n    placement,\n    fallbackPlacements,\n    boundary,\n    offset,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getAxisSpecsSelector, getSeriesSpecsSelector } from './get_specs';\nimport { mergeYCustomDomainsByGroupId } from './merge_y_custom_domains';\nimport { ScaleContinuousType } from '../../../../scales';\nimport { ScaleType } from '../../../../scales/constants';\nimport { SettingsSpec } from '../../../../specs/settings';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { GroupId } from '../../../../utils/ids';\nimport { convertXScaleTypes } from '../../domains/x_domain';\nimport { coerceYScaleTypes } from '../../domains/y_domain';\nimport { X_SCALE_DEFAULT, Y_SCALE_DEFAULT } from '../../scales/scale_defaults';\nimport { isXDomain } from '../../utils/axis_utils';\nimport { groupBy } from '../../utils/group_data_series';\nimport { AxisSpec, BasicSeriesSpec, CustomXDomain, XScaleType, YDomainRange } from '../../utils/specs';\nimport { getSpecDomainGroupId } from '../utils/spec';\n\n/** @internal */\nexport type ScaleConfigBase<T extends ScaleType, D extends CustomXDomain | YDomainRange> = {\n  type: T;\n  nice: boolean;\n  desiredTickCount: number;\n  customDomain?: D;\n};\ntype XScaleConfigBase = ScaleConfigBase<XScaleType, CustomXDomain>;\ntype YScaleConfigBase = ScaleConfigBase<ScaleContinuousType, YDomainRange>;\n\n/** @internal */\nexport interface ScaleConfigs {\n  x: XScaleConfigBase & {\n    isBandScale: boolean;\n    timeZone?: string;\n  };\n  y: Record<GroupId, YScaleConfigBase>;\n}\n\n/** @internal */\nexport const getScaleConfigsFromSpecsSelector = createCustomCachedSelector(\n  [getAxisSpecsSelector, getSeriesSpecsSelector, getSettingsSpecSelector],\n  getScaleConfigsFromSpecs,\n);\n\n/** @internal */\nexport function getScaleConfigsFromSpecs(\n  axisSpecs: AxisSpec[],\n  seriesSpecs: BasicSeriesSpec[],\n  settingsSpec: SettingsSpec,\n): ScaleConfigs {\n  // x axis\n  const xAxesSpecs = axisSpecs.filter((spec) => isXDomain(spec.position, settingsSpec.rotation));\n  const maxTickCountForXAxes = xAxesSpecs.reduce<number>((acc, { ticks = X_SCALE_DEFAULT.desiredTickCount }) => {\n    return Math.max(acc, ticks);\n  }, -Infinity);\n\n  const xScaleConfig = convertXScaleTypes(seriesSpecs);\n  const x: ScaleConfigs['x'] = {\n    customDomain: settingsSpec.xDomain,\n    ...xScaleConfig,\n    desiredTickCount: Number.isFinite(maxTickCountForXAxes) ? maxTickCountForXAxes : X_SCALE_DEFAULT.desiredTickCount,\n  };\n\n  // y axes\n  const scaleConfigsByGroupId = groupBy(seriesSpecs, getSpecDomainGroupId, true).reduce<\n    Record<GroupId, { nice: boolean; type: ScaleContinuousType }>\n  >((acc, series) => {\n    if (series[0]) {\n      const groupId = getSpecDomainGroupId(series[0]);\n      acc[groupId] = coerceYScaleTypes(series);\n    }\n    return acc;\n  }, {});\n\n  const customDomainByGroupId = mergeYCustomDomainsByGroupId(axisSpecs, settingsSpec.rotation);\n\n  const yAxisSpecs = axisSpecs.filter((spec) => !isXDomain(spec.position, settingsSpec.rotation));\n  const y = Object.keys(scaleConfigsByGroupId).reduce<ScaleConfigs['y']>((acc, groupId) => {\n    const maxTickCountYAxes = yAxisSpecs.reduce<number>((maxTickCount, yAxis) => {\n      return yAxis.groupId === groupId\n        ? Math.max(maxTickCount, yAxis.ticks ?? Y_SCALE_DEFAULT.desiredTickCount)\n        : maxTickCount;\n    }, -Infinity);\n    const desiredTickCount = Number.isFinite(maxTickCountYAxes) ? maxTickCountYAxes : Y_SCALE_DEFAULT.desiredTickCount;\n\n    if (!acc[groupId]) {\n      acc[groupId] = {\n        customDomain: customDomainByGroupId.get(groupId),\n        ...(scaleConfigsByGroupId[groupId] || {\n          nice: false,\n          type: ScaleType.Linear,\n        }),\n        desiredTickCount,\n      };\n    }\n\n    acc[groupId]!.desiredTickCount = Math.max(\n      acc[groupId]?.desiredTickCount ?? Number.NEGATIVE_INFINITY,\n      desiredTickCount,\n    );\n\n    return acc;\n  }, {});\n  return { x, y };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getAxisSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { mergePartial } from '../../../../utils/common';\nimport { AxisId } from '../../../../utils/ids';\nimport { AxisStyle } from '../../../../utils/themes/theme';\nimport { isVerticalAxis } from '../../utils/axis_type_utils';\n\n/** @internal */\nexport const getAxesStylesSelector = createCustomCachedSelector(\n  [getAxisSpecsSelector, getChartThemeSelector],\n  (axesSpecs, { axes: sharedAxesStyle }): Map<AxisId, AxisStyle | null> =>\n    axesSpecs.reduce((axesStyles, { id, style, gridLine, position }) => {\n      const gridStyle = gridLine && { gridLine: { [isVerticalAxis(position) ? 'vertical' : 'horizontal']: gridLine } };\n      return axesStyles.set(id, style ? mergePartial(sharedAxesStyle, { ...style, ...gridStyle }) : null);\n    }, new Map()),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\n\n/** @internal */\nexport const getBarPaddingsSelector = createCustomCachedSelector(\n  [isHistogramModeEnabledSelector, getChartThemeSelector],\n  (isHistogramMode, chartTheme): number =>\n    isHistogramMode ? chartTheme.scales.histogramPadding : chartTheme.scales.barsPadding,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { SmallMultipleScales } from '../../../../common/panel_utils';\nimport { BrushAxis } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { clamp, isNil, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Point } from '../../../../utils/point';\nimport { isVerticalRotation } from '../utils/common';\n\nconst MIN_AREA_SIZE = 1;\n\nconst getMouseDownPosition = (state: GlobalChartState) => state.interactions.pointer.down?.position;\nconst getCurrentPointerPosition = (state: GlobalChartState) => state.interactions.pointer.current.position;\n\n/** @internal */\nexport const getBrushAreaSelector = createCustomCachedSelector(\n  [\n    getMouseDownPosition,\n    getCurrentPointerPosition,\n    getChartRotationSelector,\n    computeChartDimensionsSelector,\n    getSettingsSpecSelector,\n    computeSmallMultipleScalesSelector,\n  ],\n  (start, end, chartRotation, { chartDimensions }, { brushAxis }, smallMultipleScales): Dimensions | null => {\n    if (!start) {\n      return null;\n    }\n    const plotStartPointPx = getPlotAreaRestrictedPoint(start, chartDimensions);\n    const plotEndPointPx = getPlotAreaRestrictedPoint(end, chartDimensions);\n    const panelPoints = getPointsConstraintToSinglePanel(plotStartPointPx, plotEndPointPx, smallMultipleScales);\n\n    switch (brushAxis) {\n      case BrushAxis.Y:\n        return getBrushForYAxis(chartRotation, panelPoints);\n      case BrushAxis.Both:\n        return getBrushForBothAxis(panelPoints);\n      case BrushAxis.X:\n      default:\n        return getBrushForXAxis(chartRotation, panelPoints);\n    }\n  },\n);\n\n/** @internal */\nexport type PanelPoints = {\n  start: Point;\n  end: Point;\n  hPanelStart: number;\n  hPanelWidth: number;\n  vPanelStart: number;\n  vPanelHeight: number;\n};\n\n/** @internal */\nexport function getPointsConstraintToSinglePanel(\n  startPlotPoint: Point,\n  endPlotPoint: Point,\n  { horizontal, vertical }: SmallMultipleScales,\n): PanelPoints {\n  const hPanel = horizontal.invert(startPlotPoint.x);\n  const vPanel = vertical.invert(startPlotPoint.y);\n\n  const hPanelStart = (!isNil(hPanel) && horizontal.scale(hPanel)) || 0;\n  const hPanelEnd = hPanelStart + horizontal.bandwidth;\n\n  const vPanelStart = (!isNil(vPanel) && vertical.scale(vPanel)) || 0;\n  const vPanelEnd = vPanelStart + vertical.bandwidth;\n\n  const start = {\n    x: clamp(startPlotPoint.x, hPanelStart, hPanelEnd),\n    y: clamp(startPlotPoint.y, vPanelStart, vPanelEnd),\n  };\n  const end = {\n    x: clamp(endPlotPoint.x, hPanelStart, hPanelEnd),\n    y: clamp(endPlotPoint.y, vPanelStart, vPanelEnd),\n  };\n\n  return {\n    start,\n    end,\n    hPanelStart,\n    hPanelWidth: horizontal.bandwidth,\n    vPanelStart,\n    vPanelHeight: vertical.bandwidth,\n  };\n}\n\n/** @internal */\nexport function getPlotAreaRestrictedPoint({ x, y }: Point, { left, top }: Dimensions) {\n  return {\n    x: x - left,\n    y: y - top,\n  };\n}\n\n/** @internal */\nexport function getBrushForXAxis(\n  chartRotation: Rotation,\n  { hPanelStart, vPanelStart, hPanelWidth, vPanelHeight, start, end }: PanelPoints,\n) {\n  const rotated = isVerticalRotation(chartRotation);\n\n  return {\n    left: rotated ? hPanelStart : start.x,\n    top: rotated ? start.y : vPanelStart,\n    height: rotated ? getMinSize(start.y, end.y) : vPanelHeight,\n    width: rotated ? hPanelWidth : getMinSize(start.x, end.x),\n  };\n}\n\n/** @internal */\nexport function getBrushForYAxis(\n  chartRotation: Rotation,\n  { hPanelStart, vPanelStart, hPanelWidth, vPanelHeight, start, end }: PanelPoints,\n) {\n  const rotated = isVerticalRotation(chartRotation);\n\n  return {\n    left: rotated ? start.x : hPanelStart,\n    top: rotated ? vPanelStart : start.y,\n    height: rotated ? vPanelHeight : getMinSize(start.y, end.y),\n    width: rotated ? getMinSize(start.x, end.x) : hPanelWidth,\n  };\n}\n\n/** @internal */\nexport function getBrushForBothAxis({ start, end }: PanelPoints) {\n  return {\n    left: start.x,\n    top: start.y,\n    height: getMinSize(start.y, end.y),\n    width: getMinSize(start.x, end.x),\n  };\n}\n\nfunction getMinSize(a: number, b: number, minSize = MIN_AREA_SIZE) {\n  const size = b - a;\n  if (Math.abs(size) < minSize) {\n    return minSize;\n  }\n  return size;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSeriesSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { SeriesType } from '../../utils/specs';\n\n/** @internal */\nexport const getChartTypeDescriptionSelector = createCustomCachedSelector([getSeriesSpecsSelector], (specs): string => {\n  const seriesTypes = new Set<SeriesType>();\n  specs.forEach((value) => seriesTypes.add(value.seriesType));\n  return seriesTypes.size > 1 ? `Mixed chart: ${[...seriesTypes].join(' and ')} chart` : `${[...seriesTypes]} chart`;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { ComputedScales } from '../utils/types';\n\n/** @internal */\nexport const getComputedScalesSelector = createCustomCachedSelector(\n  [computeSeriesGeometriesSelector],\n  ({ scales }): ComputedScales => scales,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { countBarsInClusterSelector } from './count_bars_in_cluster';\nimport { getGeometriesIndexKeysSelector } from './get_geometries_index_keys';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { PointerPosition } from './get_projected_pointer_position';\nimport { getSeriesSpecsSelector } from './get_specs';\nimport { isTooltipSnapEnableSelector } from './is_tooltip_snap_enabled';\nimport { SmallMultipleScales } from '../../../../common/panel_utils';\nimport { Rect } from '../../../../geoms/types';\nimport { SettingsSpec, PointerEvent } from '../../../../specs/settings';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { isValidPointerOverEvent } from '../../../../utils/events';\nimport { getCursorBandPosition } from '../../crosshair/crosshair_utils';\nimport { ChartDimensions } from '../../utils/dimensions';\nimport { BasicSeriesSpec } from '../../utils/specs';\nimport { isLineAreaOnlyChart } from '../utils/common';\nimport { ComputedGeometries } from '../utils/types';\n\nconst getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer;\n\n/** @internal */\nexport const getCursorBandPositionSelector = createCustomCachedSelector(\n  [\n    getOrientedProjectedPointerPositionSelector,\n    getExternalPointerEventStateSelector,\n    computeChartDimensionsSelector,\n    getSettingsSpecSelector,\n    computeSeriesGeometriesSelector,\n    getSeriesSpecsSelector,\n    countBarsInClusterSelector,\n    isTooltipSnapEnableSelector,\n    getGeometriesIndexKeysSelector,\n    computeSmallMultipleScalesSelector,\n  ],\n  getCursorBand,\n);\n\nfunction getCursorBand(\n  orientedProjectedPointerPosition: PointerPosition,\n  externalPointerEvent: PointerEvent | null,\n  { chartDimensions }: ChartDimensions,\n  settingsSpec: SettingsSpec,\n  { scales: { xScale } }: Pick<ComputedGeometries, 'scales'>,\n  seriesSpecs: BasicSeriesSpec[],\n  totalBarsInCluster: number,\n  isTooltipSnapEnabled: boolean,\n  geometriesIndexKeys: (string | number)[],\n  smallMultipleScales: SmallMultipleScales,\n): (Rect & { fromExternalEvent: boolean }) | undefined {\n  if (!xScale) {\n    return;\n  }\n  // update che cursorBandPosition based on chart configuration\n  const isLineAreaOnly = isLineAreaOnlyChart(seriesSpecs);\n\n  let pointerPosition = { ...orientedProjectedPointerPosition };\n\n  let xValue;\n  let fromExternalEvent = false;\n  // external pointer events takes precedence over the current mouse pointer\n  if (isValidPointerOverEvent(xScale, externalPointerEvent)) {\n    fromExternalEvent = true;\n    if (isNil(externalPointerEvent.x)) {\n      return;\n    }\n    const x = xScale.pureScale(externalPointerEvent.x);\n    if (Number.isNaN(x) || x > chartDimensions.width || x < 0) {\n      return;\n    }\n    pointerPosition = {\n      x,\n      y: 0,\n      verticalPanelValue: null,\n      horizontalPanelValue: null,\n    };\n    xValue = externalPointerEvent.x;\n  } else {\n    xValue = xScale.invertWithStep(orientedProjectedPointerPosition.x, geometriesIndexKeys as number[]).value; // TODO fix this cast\n    if (isNil(xValue) || Number.isNaN(xValue)) {\n      return;\n    }\n  }\n  const { horizontal, vertical } = smallMultipleScales;\n  const topPos =\n    (!isNil(pointerPosition.verticalPanelValue) && vertical.scale(pointerPosition.verticalPanelValue)) || 0;\n  const leftPos =\n    (!isNil(pointerPosition.horizontalPanelValue) && horizontal.scale(pointerPosition.horizontalPanelValue)) || 0;\n\n  const panel = {\n    width: horizontal.bandwidth,\n    height: vertical.bandwidth,\n    top: chartDimensions.top + topPos,\n    left: chartDimensions.left + leftPos,\n  };\n  const cursorBand = getCursorBandPosition(\n    settingsSpec.rotation,\n    panel,\n    pointerPosition,\n    {\n      value: xValue,\n      withinBandwidth: true,\n    },\n    isTooltipSnapEnabled,\n    xScale,\n    isLineAreaOnly ? 0 : totalBarsInCluster,\n  );\n  return cursorBand && { ...cursorBand, fromExternalEvent };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getProjectedPointerPositionSelector } from './get_projected_pointer_position';\nimport { Line } from '../../../../geoms/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getCursorLinePosition } from '../../crosshair/crosshair_utils';\n\n/** @internal */\nexport const getCursorLinePositionSelector = createCustomCachedSelector(\n  [computeChartDimensionsSelector, getSettingsSpecSelector, getProjectedPointerPositionSelector],\n  (chartDimensions, settingsSpec, projectedPointerPosition): Line | undefined =>\n    getCursorLinePosition(settingsSpec.rotation, chartDimensions.chartDimensions, projectedPointerPosition),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getAnnotationTooltipStateSelector } from './get_annotation_tooltip_state';\nimport { getProjectedScaledValues } from './get_projected_scaled_values';\nimport { getHighlightedGeomsSelector } from './get_tooltip_values_highlighted_geoms';\nimport { isBrushAvailableSelector } from './is_brush_available';\nimport { DEFAULT_CSS_CURSOR } from '../../../../common/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\n\nconst getCurrentPointerPositionSelector = (state: GlobalChartState) => state.interactions.pointer.current.position;\nconst getTooltipInteractionStateSelector = (state: GlobalChartState) => state.interactions.tooltip;\n\n/** @internal */\nexport const getPointerCursorSelector = createCustomCachedSelector(\n  [\n    getHighlightedGeomsSelector,\n    getSettingsSpecSelector,\n    getCurrentPointerPositionSelector,\n    getProjectedScaledValues,\n    computeChartDimensionsSelector,\n    isBrushAvailableSelector,\n    getAnnotationTooltipStateSelector,\n    getTooltipInteractionStateSelector,\n    isBrushingSelector,\n  ],\n  (\n    highlightedGeometries,\n    settingsSpec,\n    currentPointerPosition,\n    projectedValues,\n    { chartDimensions },\n    isBrushAvailable,\n    annotationTooltipState,\n    tooltipState,\n    isBrushing,\n  ): CSSProperties['cursor'] => {\n    if (tooltipState.pinned) return;\n    if (isBrushAvailable && isBrushing) return 'crosshair';\n\n    const { x, y } = currentPointerPosition;\n    // get positions relative to chart\n    const xPos = x - chartDimensions.left;\n    const yPos = y - chartDimensions.top;\n\n    // limit cursorPosition to chartDimensions\n    if (xPos < 0 || xPos >= chartDimensions.width || yPos < 0 || yPos >= chartDimensions.height) {\n      return DEFAULT_CSS_CURSOR;\n    }\n    if (highlightedGeometries.length > 0 && settingsSpec.onElementClick) {\n      return 'pointer';\n    }\n    if (highlightedGeometries.length === 0 && settingsSpec.onAnnotationClick && annotationTooltipState) {\n      return 'pointer';\n    }\n    if (projectedValues !== null && settingsSpec.onProjectionClick) {\n      return 'pointer';\n    }\n    return isBrushAvailable ? 'crosshair' : DEFAULT_CSS_CURSOR;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesGeometriesSelector } from './compute_axes_geometries';\nimport { computeLegendSelector } from './compute_legend';\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getGridLinesSelector } from './get_grid_lines';\nimport { getAnnotationSpecsSelector, getAxisSpecsSelector } from './get_specs';\nimport { LegendItem } from '../../../../common/legend';\nimport { getPredicateFn, Predicate } from '../../../../common/predicate';\nimport { AnnotationSpec, AnnotationType, AxisSpec } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport {\n  DebugState,\n  DebugStateAnnotations,\n  DebugStateArea,\n  DebugStateAxes,\n  DebugStateBar,\n  DebugStateLegend,\n  DebugStateLine,\n  DebugStateValue,\n} from '../../../../state/types';\nimport { Rotation } from '../../../../utils/common';\nimport { AreaGeometry, BandedAccessorType, BarGeometry, LineGeometry, PerPanel } from '../../../../utils/geometry';\nimport { mergeWithDefaultAnnotationLine, mergeWithDefaultAnnotationRect } from '../../../../utils/themes/merge_utils';\nimport { FillStyle, Opacity, StrokeStyle, Visible } from '../../../../utils/themes/theme';\nimport { isHorizontalAxis, isVerticalAxis } from '../../utils/axis_type_utils';\nimport { AxisGeometry } from '../../utils/axis_utils';\nimport { LinesGrid } from '../../utils/grid_lines';\nimport { isHorizontalRotation, isVerticalRotation } from '../utils/common';\n\n/**\n * Returns a stringified version of the `debugState`\n * @internal\n */\nexport const getDebugStateSelector = createCustomCachedSelector(\n  [\n    computeSeriesGeometriesSelector,\n    computeLegendSelector,\n    computeAxesGeometriesSelector,\n    getGridLinesSelector,\n    getAxisSpecsSelector,\n    getSettingsSpecSelector,\n    getAnnotationSpecsSelector,\n  ],\n  ({ geometries }, legend, axes, gridLines, axesSpecs, { rotation, locale }, annotations): DebugState => {\n    const seriesNameMap = getSeriesNameMap(legend);\n    return {\n      legend: getLegendState(legend),\n      axes: getAxes(axes, axesSpecs, gridLines, rotation, locale),\n      areas: geometries.areas.map(getAreaState(seriesNameMap)),\n      lines: geometries.lines.map(getLineState(seriesNameMap)),\n      bars: getBarsState(seriesNameMap, geometries.bars),\n      annotations: getAnnotationsState(annotations),\n    };\n  },\n);\n\nfunction getAxes(\n  axesGeoms: AxisGeometry[],\n  axesSpecs: AxisSpec[],\n  gridLines: LinesGrid[],\n  rotation: Rotation,\n  locale: string,\n): DebugStateAxes {\n  return axesSpecs.reduce<DebugStateAxes>(\n    (acc, { position, title, id }) => {\n      const geom = axesGeoms.find(({ axis }) => axis.id === id);\n      if (!geom) {\n        return acc;\n      }\n\n      const isXAxis =\n        (isHorizontalAxis(position) && isHorizontalRotation(rotation)) ||\n        (isVerticalAxis(position) && isVerticalRotation(rotation));\n\n      // sorted starting from the axis origin\n      const sortingOrder = isHorizontalAxis(position)\n        ? rotation === 0 || rotation === 90\n          ? Predicate.NumAsc\n          : Predicate.NumDesc\n        : rotation === 0 || rotation === -90\n          ? Predicate.NumDesc\n          : Predicate.NumAsc;\n      const visibleTicks = geom.visibleTicks\n        .filter(({ label }) => label !== '')\n        .sort(getPredicateFn(sortingOrder, locale, 'position'));\n\n      const labels = visibleTicks.map(({ label }) => label);\n      const values = visibleTicks.map(({ value }) => value);\n\n      const gridlines = gridLines\n        .flatMap(({ lineGroups }) => lineGroups.find(({ axisId }) => axisId === geom.axis.id)?.lines ?? [])\n        .map(({ x1: x, y1: y }) => ({ x, y }));\n\n      acc[isXAxis ? 'x' : 'y'].push({\n        id,\n        title,\n        position,\n        labels,\n        values,\n        gridlines,\n      });\n\n      return acc;\n    },\n    { x: [], y: [] },\n  );\n}\n\nfunction getBarsState(\n  seriesNameMap: Map<string, string>,\n  barGeometries: Array<PerPanel<BarGeometry[]>>,\n): DebugStateBar[] {\n  const buckets = new Map<string, DebugStateBar>();\n  const bars = barGeometries.reduce<BarGeometry[]>((acc, { value }) => {\n    return [...acc, ...value];\n  }, []);\n  bars.forEach(\n    ({\n      color,\n      seriesIdentifier: { key },\n      seriesStyle: { rect, rectBorder },\n      value: { x, y, mark },\n      displayValue,\n    }: BarGeometry) => {\n      const label = displayValue?.text;\n      const name = seriesNameMap.get(key) ?? '';\n      const bucket: DebugStateBar = buckets.get(key) ?? {\n        key,\n        name,\n        color,\n        bars: [],\n        labels: [],\n        visible: hasVisibleStyle(rect) || hasVisibleStyle(rectBorder),\n      };\n\n      bucket.bars.push({ x, y, mark });\n\n      if (label) {\n        bucket.labels.push(label);\n      }\n\n      buckets.set(key, bucket);\n\n      return buckets;\n    },\n  );\n\n  return [...buckets.values()];\n}\n\nfunction getLineState(seriesNameMap: Map<string, string>) {\n  return ({\n    value: {\n      line: path,\n      points,\n      color,\n      seriesIdentifier: { key },\n      style,\n    },\n  }: PerPanel<LineGeometry>): DebugStateLine => {\n    const name = seriesNameMap.get(key) ?? '';\n\n    return {\n      path,\n      color,\n      key,\n      name,\n      visible: hasVisibleStyle(style.line),\n      visiblePoints: hasVisibleStyle(style.point),\n      points: points.map(({ value: { x, y, mark } }) => ({ x, y, mark })),\n    };\n  };\n}\n\nfunction getAreaState(seriesNameMap: Map<string, string>) {\n  return ({\n    value: {\n      area: path,\n      lines,\n      points,\n      color,\n      seriesIdentifier: { key },\n      style,\n    },\n  }: PerPanel<AreaGeometry>): DebugStateArea => {\n    const [y1Path = '', y0Path] = lines;\n    const linePoints = points.reduce<{\n      y0: DebugStateValue[];\n      y1: DebugStateValue[];\n    }>(\n      (acc, { value: { accessor, ...value } }) => {\n        if (accessor === BandedAccessorType.Y0) {\n          acc.y0.push(value);\n        } else {\n          acc.y1.push(value);\n        }\n\n        return acc;\n      },\n      {\n        y0: [],\n        y1: [],\n      },\n    );\n    const lineVisible = hasVisibleStyle(style.line);\n    const visiblePoints = hasVisibleStyle(style.point);\n    const name = seriesNameMap.get(key) ?? '';\n\n    return {\n      path,\n      color,\n      key,\n      name,\n      visible: hasVisibleStyle(style.area),\n      lines: {\n        y0: y0Path\n          ? {\n              visible: lineVisible,\n              path: y0Path,\n              points: linePoints.y0,\n              visiblePoints,\n            }\n          : undefined,\n        y1: {\n          visible: lineVisible,\n          path: y1Path,\n          points: linePoints.y1,\n          visiblePoints,\n        },\n      },\n    };\n  };\n}\n\n/**\n * returns series key to name mapping\n */\nfunction getSeriesNameMap(legendItems: LegendItem[]): Map<string, string> {\n  return legendItems.reduce((acc, { label: name, seriesIdentifiers }) => {\n    seriesIdentifiers.forEach(({ key }) => {\n      acc.set(key, name);\n    });\n    return acc;\n  }, new Map<string, string>());\n}\n\nfunction getLegendState(legendItems: LegendItem[]): DebugStateLegend {\n  const items = legendItems\n    .filter(({ isSeriesHidden }) => !isSeriesHidden)\n    .flatMap(({ label: name, color, seriesIdentifiers }) => {\n      return seriesIdentifiers.map(({ key }) => ({\n        key,\n        name,\n        color,\n      }));\n    });\n\n  return { items };\n}\n\nfunction getAnnotationsState(annotationSpecs: AnnotationSpec[]): DebugStateAnnotations[] {\n  return annotationSpecs.flatMap<DebugStateAnnotations>((annotation) => {\n    return annotation.dataValues.map((dataValue) => ({\n      data: dataValue,\n      id: annotation.id,\n      style:\n        annotation.annotationType === AnnotationType.Line\n          ? mergeWithDefaultAnnotationLine(annotation?.style)\n          : mergeWithDefaultAnnotationRect(annotation?.style),\n      type: annotation.annotationType,\n      domainType: annotation.annotationType === AnnotationType.Line ? annotation.domainType : undefined,\n    }));\n  });\n}\n\n/**\n * Returns true for styles if they are visible\n * Serves as a catchall for multiple style types\n */\nfunction hasVisibleStyle({\n  visible = true,\n  fill = '#fff',\n  stroke = '#fff',\n  strokeWidth = 1,\n  opacity = 1,\n}: Partial<StrokeStyle & Visible & FillStyle & Opacity>): boolean {\n  return Boolean(visible && opacity > 0 && strokeWidth > 0 && fill && stroke);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { getGeometriesIndexSelector } from './get_geometries_index';\nimport { getGeometriesIndexKeysSelector } from './get_geometries_index_keys';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { PointerPosition } from './get_projected_pointer_position';\nimport { PointerEvent, SettingsSpec } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { isValidPointerOverEvent } from '../../../../utils/events';\nimport { IndexedGeometry } from '../../../../utils/geometry';\nimport { ChartDimensions } from '../../utils/dimensions';\nimport { IndexedGeometryMap } from '../../utils/indexed_geometry_map';\nimport { sortClosestToPoint } from '../utils/common';\nimport { ComputedScales } from '../utils/types';\n\nconst getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer;\n\n/** @internal */\nexport const getElementAtCursorPositionSelector = createCustomCachedSelector(\n  [\n    getOrientedProjectedPointerPositionSelector,\n    getComputedScalesSelector,\n    getGeometriesIndexKeysSelector,\n    getGeometriesIndexSelector,\n    getExternalPointerEventStateSelector,\n    computeChartDimensionsSelector,\n    getSettingsSpecSelector,\n  ],\n  getElementAtCursorPosition,\n);\n\nfunction getElementAtCursorPosition(\n  orientedProjectedPointerPosition: PointerPosition,\n  scales: ComputedScales,\n  geometriesIndexKeys: (string | number)[],\n  geometriesIndex: IndexedGeometryMap,\n  externalPointerEvent: PointerEvent | null,\n  { chartDimensions }: ChartDimensions,\n  { pointBuffer }: SettingsSpec,\n): IndexedGeometry[] {\n  if (isValidPointerOverEvent(scales.xScale, externalPointerEvent)) {\n    if (isNil(externalPointerEvent.x)) {\n      return [];\n    }\n\n    const x = scales.xScale.pureScale(externalPointerEvent.x);\n\n    if (Number.isNaN(x) || x > chartDimensions.width + chartDimensions.left || x < 0) {\n      return [];\n    }\n    // TODO: Handle external event with spatial points\n    return geometriesIndex.find(externalPointerEvent.x, pointBuffer, { x: -1, y: -1 });\n  }\n  const xValue = scales.xScale.invertWithStep(\n    orientedProjectedPointerPosition.x,\n    geometriesIndexKeys as number[],\n  ).value;\n  if (isNil(xValue) || Number.isNaN(xValue)) {\n    return [];\n  }\n  // get the elements at cursor position\n  return geometriesIndex\n    .find(\n      xValue,\n      pointBuffer,\n      orientedProjectedPointerPosition,\n      orientedProjectedPointerPosition.horizontalPanelValue,\n      orientedProjectedPointerPosition.verticalPanelValue,\n    )\n    .sort(sortClosestToPoint(orientedProjectedPointerPosition));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { IndexedGeometryMap } from '../../utils/indexed_geometry_map';\n\n/** @internal */\nexport const getGeometriesIndexSelector = createCustomCachedSelector(\n  [computeSeriesGeometriesSelector],\n  ({ geometriesIndex }): IndexedGeometryMap => geometriesIndex,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { compareByValueAsc } from '../../../../utils/common';\n\n/** @internal */\nexport const getGeometriesIndexKeysSelector = createCustomCachedSelector(\n  [computeSeriesGeometriesSelector],\n  (seriesGeometries): (number | string)[] => seriesGeometries.geometriesIndex.keys().sort(compareByValueAsc),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesGeometriesSelector } from './compute_axes_geometries';\nimport { getAxisSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getGridLines } from '../../utils/grid_lines';\n\n/** @internal */\nexport const getGridLinesSelector = createCustomCachedSelector(\n  [getAxisSpecsSelector, computeAxesGeometriesSelector, getChartThemeSelector, computeSmallMultipleScalesSelector],\n  getGridLines,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getMultipleRectangleAnnotations } from './get_multiple_rectangle_annotations';\nimport { getAnnotationSpecsSelector } from './get_specs';\nimport { getHighlightedGeomsSelector } from './get_tooltip_values_highlighted_geoms';\nimport { DOMElementType } from '../../../../state/actions/dom_element';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { AnnotationType } from '../../utils/specs';\n\nconst getHoveredDOMElement = (state: GlobalChartState) => state.interactions.hoveredDOMElement;\n\n/** @internal */\nexport const getHighlightedAnnotationIdsSelector = createCustomCachedSelector(\n  [getHoveredDOMElement, getMultipleRectangleAnnotations, getAnnotationSpecsSelector, getHighlightedGeomsSelector],\n  (hoveredDOMElement, rectAnnotationTooltips, specs, highlightedGeoms): string[] => {\n    // TODO: Remove when annotation tooltip is integrated into main tooltip\n    // This check is to prevent annotation fading when annotation is behind an actively hovered geometry element\n    if (highlightedGeoms.length > 0) return [];\n\n    // TODO: restore when rect annotation usage is determined\n    const ids: string[] = (rectAnnotationTooltips ?? [])\n      .filter(({ annotationType, isVisible }) => isVisible && annotationType === AnnotationType.Rectangle)\n      .map(({ id }) => id);\n\n    if (hoveredDOMElement?.type === DOMElementType.LineAnnotationMarker && hoveredDOMElement?.id) {\n      ids.push(hoveredDOMElement.id);\n    }\n    return ids;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { LegendItem } from '../../../../common/legend';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\nconst getHighlightedLegendPath = (state: GlobalChartState) => state.interactions.highlightedLegendPath;\n\n/** @internal */\nexport const getHighlightedSeriesSelector = createCustomCachedSelector(\n  [getHighlightedLegendPath, computeLegendSelector],\n  (highlightedLegendPaths, legendItems): LegendItem | undefined => {\n    if (highlightedLegendPaths.length > 0) {\n      const lookup = new Set(highlightedLegendPaths.map(({ value }) => value));\n      return legendItems.find(({ seriesIdentifiers }) => seriesIdentifiers.some(({ key }) => lookup.has(key)));\n    }\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { getTooltipInfoAndGeomsSelector } from './get_tooltip_values_highlighted_geoms';\nimport { LegendItemExtraValues } from '../../../../common/legend';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { ScaleType } from '../../../../scales/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLegendItemExtraValues } from '../../tooltip/tooltip';\n\nconst EMPTY_MAP = new Map();\n/** @internal */\nexport const getLegendItemExtraValuesSelector = createCustomCachedSelector(\n  [getTooltipInfoAndGeomsSelector, getComputedScalesSelector],\n  ({ tooltip: { values } }, { xScale: { type } }): Map<SeriesKey, LegendItemExtraValues> =>\n    // See https://github.com/elastic/elastic-charts/issues/2050\n    type === ScaleType.Ordinal ? EMPTY_MAP : getLegendItemExtraValues(values),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/** @internal */\nexport const getLegendItemsLabelsSelector = createCustomCachedSelector(\n  [computeLegendSelector, getSettingsSpecSelector],\n  (legendItems, { showLegendExtra }): LegendItemLabel[] =>\n    legendItems.map(({ label, defaultExtra }) => ({\n      label:\n        defaultExtra && (defaultExtra.legendSizingLabel ?? null) !== null\n          ? `${label}${showLegendExtra ? defaultExtra.legendSizingLabel : ''}`\n          : label,\n      depth: 0,\n    })),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAnnotationDimensionsSelector } from './compute_annotations';\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getTooltipStateForDOMElements } from './get_annotation_tooltip_state';\nimport { getAnnotationSpecsSelector } from './get_specs';\nimport { getTooltipInfoSelector } from './get_tooltip_values_highlighted_geoms';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { DOMElement } from '../../../../state/actions/dom_element';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { AnnotationId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { computeMultipleRectAnnotationTooltipState } from '../../annotations/tooltip';\nimport { AnnotationTooltipState, AnnotationDimensions } from '../../annotations/types';\nimport { AnnotationSpec, AnnotationType } from '../../utils/specs';\n\nconst getCurrentPointerPosition = (state: GlobalChartState) => state.interactions.pointer.current.position;\nconst getHoveredDOMElement = (state: GlobalChartState) => state.interactions.hoveredDOMElement;\n\n/** @internal */\nexport const getMultipleRectangleAnnotations = createCustomCachedSelector(\n  [\n    getCurrentPointerPosition,\n    computeChartDimensionsSelector,\n    getChartRotationSelector,\n    getAnnotationSpecsSelector,\n    computeAnnotationDimensionsSelector,\n    getTooltipInfoSelector,\n    getHoveredDOMElement,\n  ],\n  getMultipleRectangularAnnotationTooltipState,\n);\n\nfunction getMultipleRectangularAnnotationTooltipState(\n  cursorPosition: Point,\n  {\n    chartDimensions,\n  }: {\n    chartDimensions: Dimensions;\n  },\n  chartRotation: Rotation,\n  annotationSpecs: AnnotationSpec[],\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  tooltip: TooltipInfo,\n  hoveredDOMElement: DOMElement | null,\n): AnnotationTooltipState[] | null {\n  // capture line marker\n  const hoveredTooltip = getTooltipStateForDOMElements(\n    chartDimensions,\n    annotationSpecs,\n    annotationDimensions,\n    hoveredDOMElement,\n  );\n\n  if (hoveredTooltip) {\n    return [hoveredTooltip];\n  }\n  const tooltipState = computeMultipleRectAnnotationTooltipState(\n    cursorPosition,\n    annotationDimensions,\n    annotationSpecs,\n    chartRotation,\n    chartDimensions,\n  );\n\n  // If there's a highlighted chart element tooltip value, don't show annotation tooltip\n  const isChartTooltipDisplayed = tooltip.values.some(({ isHighlighted }) => isHighlighted);\n  tooltipState?.forEach((rectAnnotation) => {\n    if (\n      tooltipState &&\n      rectAnnotation.isVisible &&\n      rectAnnotation.annotationType === AnnotationType.Rectangle &&\n      isChartTooltipDisplayed\n    ) {\n      return null;\n    }\n  });\n  return tooltipState;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getProjectedPointerPositionSelector, PointerPosition } from './get_projected_pointer_position';\nimport { SmallMultipleScales, getPanelSize } from '../../../../common/panel_utils';\nimport { SettingsSpec } from '../../../../specs/settings';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getOrientedXPosition, getOrientedYPosition } from '../../utils/interactions';\n\n/** @internal */\nexport const getOrientedProjectedPointerPositionSelector = createCustomCachedSelector(\n  [getProjectedPointerPositionSelector, getSettingsSpecSelector, computeSmallMultipleScalesSelector],\n  getOrientedProjectedPointerPosition,\n);\n\nfunction getOrientedProjectedPointerPosition(\n  { x, y, horizontalPanelValue, verticalPanelValue }: PointerPosition,\n  settingsSpec: SettingsSpec,\n  scales: SmallMultipleScales,\n): PointerPosition {\n  // get the oriented projected pointer position\n  const panel = getPanelSize(scales);\n  return {\n    x: getOrientedXPosition(x, y, settingsSpec.rotation, panel),\n    y: getOrientedYPosition(x, y, settingsSpec.rotation, panel),\n    horizontalPanelValue,\n    verticalPanelValue,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { SmallMultipleScales } from '../../../../common/panel_utils';\nimport { ScaleBand } from '../../../../scales/scale_band';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Point } from '../../../../utils/point';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\n\n/** @internal */\nexport type PointerPosition = Point & { horizontalPanelValue: PrimitiveValue; verticalPanelValue: PrimitiveValue };\n\n/**\n * Get the x and y pointer position relative to the chart projection area\n * @internal\n */\nexport const getProjectedPointerPositionSelector = createCustomCachedSelector(\n  [getActivePointerPosition, computeChartDimensionsSelector, computeSmallMultipleScalesSelector],\n  (currentPointerPosition, { chartDimensions }, smallMultipleScales): PointerPosition =>\n    getProjectedPointerPosition(currentPointerPosition, chartDimensions, smallMultipleScales),\n);\n\n/**\n * Get the x and y pointer position relative to the chart projection area\n * @param chartAreaPointerPosition the pointer position relative to the chart area\n * @param horizontal SmallMultipleScales horizontal panel scale\n * @param vertical SmallMultipleScales vertical panel scale\n * @param chartAreaDimensions the chart dimensions\n */\nfunction getProjectedPointerPosition(\n  chartAreaPointerPosition: Point,\n  { left, top, width, height }: Dimensions,\n  { horizontal, vertical }: SmallMultipleScales,\n): PointerPosition {\n  const { x, y } = chartAreaPointerPosition;\n  // get positions relative to chart\n  let xPos = x - left;\n  let yPos = y - top;\n\n  // limit cursorPosition to the chart area\n  if (xPos < 0 || xPos >= width) {\n    xPos = -1;\n  }\n  if (yPos < 0 || yPos >= height) {\n    yPos = -1;\n  }\n  const h = getPosRelativeToPanel(horizontal, xPos);\n  const v = getPosRelativeToPanel(vertical, yPos);\n\n  return {\n    x: h.pos,\n    y: v.pos,\n    horizontalPanelValue: h.value,\n    verticalPanelValue: v.value,\n  };\n}\n\nfunction getPosRelativeToPanel(panelScale: ScaleBand, pos: number): { pos: number; value: PrimitiveValue } {\n  const outerPadding = panelScale.outerPadding * panelScale.step;\n  const innerPadding = panelScale.innerPadding * panelScale.step;\n  const numOfDomainSteps = panelScale.domain.length;\n  const rangeWithoutOuterPaddings = numOfDomainSteps * panelScale.bandwidth + (numOfDomainSteps - 1) * innerPadding;\n\n  if (pos < outerPadding || pos > outerPadding + rangeWithoutOuterPaddings) {\n    return { pos: -1, value: null };\n  }\n  const posWOInitialOuterPadding = pos - outerPadding;\n  const minEqualSteps = (numOfDomainSteps - 1) * panelScale.step;\n  if (posWOInitialOuterPadding <= minEqualSteps) {\n    const relativePosIndex = Math.floor(posWOInitialOuterPadding / panelScale.step);\n    const relativePos = posWOInitialOuterPadding - panelScale.step * relativePosIndex;\n    if (relativePos > panelScale.bandwidth) {\n      return { pos: -1, value: null };\n    }\n    return { pos: relativePos, value: panelScale.domain[relativePosIndex] ?? null };\n  }\n  return {\n    pos: posWOInitialOuterPadding - panelScale.step * (numOfDomainSteps - 1),\n    value: panelScale.domain[numOfDomainSteps - 1] ?? null,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getGeometriesIndexKeysSelector } from './get_geometries_index_keys';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { ProjectedValues } from '../../../../specs/settings';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { isNil } from '../../../../utils/common';\n\n/** @internal */\nexport const getProjectedScaledValues = createCustomCachedSelector(\n  [getOrientedProjectedPointerPositionSelector, computeSeriesGeometriesSelector, getGeometriesIndexKeysSelector],\n  (\n    { x, y, verticalPanelValue, horizontalPanelValue },\n    { scales: { xScale, yScales } },\n    geometriesIndexKeys,\n  ): ProjectedValues | undefined => {\n    if (!xScale || x === -1) {\n      return;\n    }\n\n    const xValue = xScale.invertWithStep(x, geometriesIndexKeys as number[]).value; // TODO fix this cast\n    if (isNil(xValue) || Number.isNaN(xValue)) {\n      return;\n    }\n\n    return {\n      x: xValue,\n      y: [...yScales.entries()].map(([groupId, yScale]) => ({ value: yScale.invert(y), groupId })),\n      smVerticalValue: verticalPanelValue,\n      smHorizontalValue: horizontalPanelValue,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { Color } from '../../../../common/colors';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSeriesColors } from '../../utils/series';\nimport { getCustomSeriesColors } from '../utils/utils';\n\nfunction getColorOverrides({ colors }: GlobalChartState) {\n  return colors;\n}\n\n/** @internal */\nexport const getSeriesColorsSelector = createCustomCachedSelector(\n  [computeSeriesDomainsSelector, getChartThemeSelector, getColorOverrides],\n  (seriesDomainsAndData, chartTheme, colorOverrides): Map<SeriesKey, Color> => {\n    const updatedCustomSeriesColors = getCustomSeriesColors(seriesDomainsAndData.formattedDataSeries);\n    return getSeriesColors(\n      seriesDomainsAndData.formattedDataSeries,\n      chartTheme.colors,\n      updatedCustomSeriesColors,\n      colorOverrides,\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { DataSeries, getSeriesKey } from '../../utils/series';\n\n/** @internal */\nexport const getSiDataSeriesMapSelector = createCustomCachedSelector(\n  [computeSeriesDomainsSelector],\n  ({ formattedDataSeries }) => {\n    return formattedDataSeries.reduce<Record<string, DataSeries>>((acc, dataSeries) => {\n      const seriesKey = getSeriesKey(dataSeries, dataSeries.groupId);\n      acc[seriesKey] = dataSeries;\n      return acc;\n    }, {});\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecsFromStore } from '../../../../state/utils';\nimport { AnnotationSpec, AxisSpec, BasicSeriesSpec } from '../../utils/specs';\n\n/** @internal */\nexport const getAxisSpecsSelector = createCustomCachedSelector([getSpecs], (specs): AxisSpec[] =>\n  getSpecsFromStore<AxisSpec>(specs, ChartType.XYAxis, SpecType.Axis),\n);\n\n/** @internal */\nexport const axisSpecsLookupSelector = createCustomCachedSelector(\n  getAxisSpecsSelector,\n  (axisSpecs: AxisSpec[]): Map<string, AxisSpec> => axisSpecs.reduce((acc, spec) => acc.set(spec.id, spec), new Map()),\n);\n\n/** @internal */\nexport const getSeriesSpecsSelector = createCustomCachedSelector([getSpecs], (specs) => {\n  return getSpecsFromStore<BasicSeriesSpec>(specs, ChartType.XYAxis, SpecType.Series);\n});\n\n/** @internal */\nexport const getAnnotationSpecsSelector = createCustomCachedSelector([getSpecs], (specs) =>\n  getSpecsFromStore<AnnotationSpec>(specs, ChartType.XYAxis, SpecType.Annotation),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getCursorBandPositionSelector } from './get_cursor_band';\nimport { getProjectedPointerPositionSelector } from './get_projected_pointer_position';\nimport { AnchorPosition } from '../../../../components/portal/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { isNil } from '../../../../utils/common';\nimport { getTooltipAnchorPosition } from '../../crosshair/crosshair_utils';\n\n/** @internal */\nexport const getTooltipAnchorPositionSelector = createCustomCachedSelector(\n  [\n    computeChartDimensionsSelector,\n    getSettingsSpecSelector,\n    getCursorBandPositionSelector,\n    getProjectedPointerPositionSelector,\n    computeSmallMultipleScalesSelector,\n    getTooltipSpecSelector,\n  ],\n  (\n    chartDimensions,\n    settings,\n    cursorBandPosition,\n    projectedPointerPosition,\n    { horizontal, vertical },\n    tooltip,\n  ): AnchorPosition | null => {\n    if (!cursorBandPosition) {\n      return null;\n    }\n\n    const topPos =\n      (!isNil(projectedPointerPosition.verticalPanelValue) &&\n        vertical.scale(projectedPointerPosition.verticalPanelValue)) ||\n      0;\n    const leftPos =\n      (!isNil(projectedPointerPosition.horizontalPanelValue) &&\n        horizontal.scale(projectedPointerPosition.horizontalPanelValue)) ||\n      0;\n\n    const panel = {\n      width: horizontal.bandwidth,\n      height: vertical.bandwidth,\n      top: chartDimensions.chartDimensions.top + topPos,\n      left: chartDimensions.chartDimensions.left + leftPos,\n    };\n\n    return getTooltipAnchorPosition(\n      settings.rotation,\n      cursorBandPosition,\n      projectedPointerPosition,\n      panel,\n      tooltip.stickTo,\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { getElementAtCursorPositionSelector } from './get_elements_at_cursor_pos';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { getProjectedPointerPositionSelector } from './get_projected_pointer_position';\nimport { getSiDataSeriesMapSelector } from './get_si_dataseries_map';\nimport { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs';\nimport { hasSingleSeriesSelector } from './has_single_series';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport {\n  PointerEvent,\n  isPointerOutEvent,\n  TooltipValue,\n  isFollowTooltipType,\n  SettingsSpec,\n  getTooltipType,\n  TooltipSpec,\n} from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { PointerValue } from '../../../../state/types';\nimport { isNil, Rotation } from '../../../../utils/common';\nimport { isValidPointerOverEvent } from '../../../../utils/events';\nimport { IndexedGeometry } from '../../../../utils/geometry';\nimport { Point } from '../../../../utils/point';\nimport { getTooltipCompareFn } from '../../../../utils/series_sort';\nimport { isPointOnGeometry } from '../../rendering/utils';\nimport { formatTooltipHeader, formatTooltipValue } from '../../tooltip/tooltip';\nimport { defaultXYLegendSeriesSort } from '../../utils/default_series_sort_fn';\nimport { DataSeries, isBandedSpec } from '../../utils/series';\nimport { BasicSeriesSpec, AxisSpec } from '../../utils/specs';\nimport { getAxesSpecForSpecId, getSpecDomainGroupId, getSpecsById } from '../utils/spec';\nimport { ComputedScales } from '../utils/types';\n\nconst EMPTY_VALUES = Object.freeze({\n  tooltip: {\n    header: null,\n    values: [],\n  },\n  highlightedGeometries: [],\n});\n\n/** @internal */\nexport interface TooltipAndHighlightedGeoms {\n  tooltip: TooltipInfo;\n  highlightedGeometries: IndexedGeometry[];\n}\n\nconst getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer;\n\n/** @internal */\nexport const getTooltipInfoAndGeomsSelector = createCustomCachedSelector(\n  [\n    getSeriesSpecsSelector,\n    getAxisSpecsSelector,\n    getSettingsSpecSelector,\n    getProjectedPointerPositionSelector,\n    getOrientedProjectedPointerPositionSelector,\n    getChartRotationSelector,\n    hasSingleSeriesSelector,\n    getComputedScalesSelector,\n    getElementAtCursorPositionSelector,\n    getSiDataSeriesMapSelector,\n    getExternalPointerEventStateSelector,\n    getTooltipSpecSelector,\n  ],\n  getTooltipAndHighlightFromValue,\n);\n\nfunction getTooltipAndHighlightFromValue(\n  seriesSpecs: BasicSeriesSpec[],\n  axesSpecs: AxisSpec[],\n  settings: SettingsSpec,\n  projectedPointerPosition: Point,\n  orientedProjectedPointerPosition: Point,\n  chartRotation: Rotation,\n  hasSingleSeries: boolean,\n  scales: ComputedScales,\n  matchingGeoms: IndexedGeometry[],\n  serialIdentifierDataSeriesMap: Record<string, DataSeries>,\n  externalPointerEvent: PointerEvent | null,\n  tooltip: TooltipSpec,\n): TooltipAndHighlightedGeoms {\n  if (!scales.xScale || !scales.yScales) {\n    return EMPTY_VALUES;\n  }\n\n  let { x, y } = orientedProjectedPointerPosition;\n  let tooltipType = getTooltipType(tooltip, settings);\n  if (isValidPointerOverEvent(scales.xScale, externalPointerEvent)) {\n    tooltipType = getTooltipType(tooltip, settings, true);\n    if (isNil(externalPointerEvent.x)) {\n      return EMPTY_VALUES;\n    }\n    const scaledX = scales.xScale.pureScale(externalPointerEvent.x);\n\n    if (Number.isNaN(scaledX)) {\n      return EMPTY_VALUES;\n    }\n\n    x = scaledX;\n    y = 0;\n  } else if (projectedPointerPosition.x === -1 || projectedPointerPosition.y === -1) {\n    return EMPTY_VALUES;\n  }\n\n  if (tooltipType === TooltipType.None && !externalPointerEvent) {\n    return EMPTY_VALUES;\n  }\n\n  if (matchingGeoms.length === 0) {\n    return EMPTY_VALUES;\n  }\n\n  // build the tooltip value list\n  let header: PointerValue | null = null;\n  const highlightedGeometries: IndexedGeometry[] = [];\n  const xValues = new Set<any>();\n  const hideNullValues = !tooltip.showNullValues;\n  const values = matchingGeoms.reduce<TooltipValue[]>((acc, indexedGeometry) => {\n    if (hideNullValues && indexedGeometry.value.y === null) {\n      return acc;\n    }\n    const {\n      seriesIdentifier: { specId },\n    } = indexedGeometry;\n    const spec = getSpecsById<BasicSeriesSpec>(seriesSpecs, specId);\n\n    // safe guard check\n    if (!spec) {\n      return acc;\n    }\n    const { xAxis, yAxis } = getAxesSpecForSpecId(axesSpecs, spec.groupId, chartRotation);\n\n    // yScales is ensured by the enclosing if\n    const yScale = scales.yScales.get(getSpecDomainGroupId(spec));\n    if (!yScale) {\n      return acc;\n    }\n\n    // check if the pointer is on the geometry (avoid checking if using external pointer event)\n    let isHighlighted = false;\n    if (\n      (!externalPointerEvent || isPointerOutEvent(externalPointerEvent)) &&\n      isPointOnGeometry(x, y, indexedGeometry, settings.pointBuffer)\n    ) {\n      isHighlighted = true;\n      highlightedGeometries.push(indexedGeometry);\n    }\n\n    // format the tooltip values\n    const formattedTooltip = formatTooltipValue(\n      indexedGeometry,\n      spec,\n      isHighlighted,\n      hasSingleSeries,\n      isBandedSpec(spec),\n      yAxis,\n    );\n\n    // format only one time the x value\n    if (!header) {\n      // if we have a tooltipHeaderFormatter, then don't pass in the xAxis as the user will define a formatter\n      const formatterAxis = tooltip.headerFormatter ? undefined : xAxis;\n      header = formatTooltipHeader(indexedGeometry, spec, formatterAxis);\n    }\n\n    xValues.add(indexedGeometry.value.x);\n\n    return [...acc, formattedTooltip];\n  }, []);\n\n  if (values.length > 1 && xValues.size === values.length) {\n    // TODO: remove after tooltip redesign\n    header = null;\n  }\n\n  const tooltipSortFn = getTooltipCompareFn((a, b) => {\n    const aDs = serialIdentifierDataSeriesMap[a.key];\n    const bDs = serialIdentifierDataSeriesMap[b.key];\n    return defaultXYLegendSeriesSort(aDs, bDs);\n  });\n\n  const sortedTooltipValues = values.sort((a, b) => {\n    return tooltipSortFn(a.seriesIdentifier, b.seriesIdentifier);\n  });\n\n  return {\n    tooltip: {\n      header,\n      // to avoid creating a breaking change because of a different sorting order on tooltip\n      values: sortedTooltipValues,\n    },\n    highlightedGeometries,\n  };\n}\n\n/** @internal */\nexport const getHighlightedTooltipTooltipValuesSelector = createCustomCachedSelector(\n  [getTooltipInteractionState, getTooltipInfoAndGeomsSelector, getTooltipSpecSelector, getSettingsSpecSelector],\n  ({ pinned }, values, tooltip, settings): TooltipAndHighlightedGeoms => {\n    const tooltipType = getTooltipType(tooltip, settings);\n    const highlightedValues = values.tooltip.values.filter((v) => v.isHighlighted);\n    const hasTooltipContent = values.tooltip.values.length > tooltip.maxTooltipItems && highlightedValues.length > 0;\n\n    if (!pinned && !tooltip.customTooltip && (isFollowTooltipType(tooltipType) || hasTooltipContent)) {\n      return {\n        ...values,\n        tooltip: {\n          ...values.tooltip,\n          values: highlightedValues,\n        },\n      };\n    }\n    return values;\n  },\n);\n\n/** @internal */\nexport const getTooltipInfoSelector = createCustomCachedSelector(\n  [getHighlightedTooltipTooltipValuesSelector],\n  ({ tooltip }): TooltipInfo => tooltip,\n);\n\n/** @internal */\nexport const getHighlightedGeomsSelector = createCustomCachedSelector(\n  [getHighlightedTooltipTooltipValuesSelector],\n  ({ highlightedGeometries }): IndexedGeometry[] => highlightedGeometries,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const hasSingleSeriesSelector = createCustomCachedSelector(\n  [computeSeriesDomainsSelector],\n  (seriesDomainsAndData): boolean =>\n    Boolean(seriesDomainsAndData) && seriesDomainsAndData.formattedDataSeries.length > 1,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getAnnotationTooltipStateSelector } from './get_annotation_tooltip_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const isAnnotationTooltipVisibleSelector = createCustomCachedSelector(\n  [getAnnotationTooltipStateSelector],\n  (annotationTooltipState): boolean => annotationTooltipState !== null && annotationTooltipState.isVisible,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { ScaleType } from '../../../../scales/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * The brush is available only for Ordinal xScales charts and\n * if we have configured an onBrushEnd listener\n * @internal\n */\nexport const isBrushAvailableSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector, getComputedScalesSelector],\n  (settingsSpec, scales): boolean => scales.xScale.type !== ScaleType.Ordinal && Boolean(settingsSpec.onBrushEnd),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { isAllSeriesDeselected } from '../utils/common';\n\n/** @internal */\nexport const isChartEmptySelector = createCustomCachedSelector([computeLegendSelector], (legendItems): boolean =>\n  isAllSeriesDeselected(legendItems),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSeriesSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { isHistogramModeEnabled } from '../utils/utils';\n\n/** @internal */\nexport const isHistogramModeEnabledSelector = createCustomCachedSelector(\n  [getSeriesSpecsSelector],\n  (seriesSpecs): boolean => isHistogramModeEnabled(seriesSpecs),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\n\n/** @internal */\nexport const isTooltipSnapEnableSelector = createCustomCachedSelector(\n  [computeSeriesGeometriesSelector, getTooltipSpecSelector],\n  (seriesGeometries, { snap }) =>\n    (seriesGeometries.scales.xScale && seriesGeometries.scales.xScale.bandwidth > 0) || snap,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isFollowTooltipType, TooltipSpec } from './../../../../specs/tooltip';\nimport { getTooltipSpecSelector } from './../../../../state/selectors/get_tooltip_spec';\nimport { getProjectedPointerPositionSelector } from './get_projected_pointer_position';\nimport { getTooltipInfoAndGeomsSelector, TooltipAndHighlightedGeoms } from './get_tooltip_values_highlighted_geoms';\nimport { isAnnotationTooltipVisibleSelector } from './is_annotation_tooltip_visible';\nimport { TooltipType } from '../../../../specs/constants';\nimport { InteractionsState, TooltipVisibility } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { isExternalTooltipVisibleSelector } from '../../../../state/selectors/is_external_tooltip_visible';\nimport { Point } from '../../../../utils/point';\n\n/** @internal */\nexport const isTooltipVisibleSelector = createCustomCachedSelector(\n  [\n    getTooltipSpecSelector,\n    getTooltipInteractionState,\n    getProjectedPointerPositionSelector,\n    getTooltipInfoAndGeomsSelector,\n    isAnnotationTooltipVisibleSelector,\n    isExternalTooltipVisibleSelector,\n  ],\n  isTooltipVisible,\n);\n\nfunction isTooltipVisible(\n  { type: tooltipType, maxTooltipItems }: TooltipSpec,\n  { pinned }: InteractionsState['tooltip'],\n  projectedPointerPosition: Point,\n  { tooltip, highlightedGeometries }: TooltipAndHighlightedGeoms,\n  isAnnotationTooltipVisible: boolean,\n  externalTooltipVisible: boolean,\n): TooltipVisibility {\n  const visibleTooltip = isFollowTooltipType(tooltipType)\n    ? highlightedGeometries\n    : tooltip.values.length > maxTooltipItems && highlightedGeometries.length > 0\n      ? highlightedGeometries\n      : tooltip.values;\n  const isLocalTooltip =\n    tooltipType !== TooltipType.None &&\n    projectedPointerPosition.x > -1 &&\n    projectedPointerPosition.y > -1 &&\n    visibleTooltip.length > 0 &&\n    !isAnnotationTooltipVisible;\n  const isExternalTooltip = externalTooltipVisible && visibleTooltip.length > 0;\n\n  return {\n    visible: isLocalTooltip || isExternalTooltip || pinned,\n    isExternal: externalTooltipVisible,\n    displayOnly: false,\n    isPinnable: tooltip.values.length > 0,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Rotation } from '../../../../utils/common';\nimport { GroupId } from '../../../../utils/ids';\nimport { isXDomain } from '../../utils/axis_utils';\nimport { AxisSpec, YDomainRange } from '../../utils/specs';\n\n/** @internal */\nexport function mergeYCustomDomainsByGroupId(\n  axesSpecs: AxisSpec[],\n  chartRotation: Rotation,\n): Map<GroupId, YDomainRange> {\n  const domainsByGroupId = new Map<GroupId, YDomainRange>();\n\n  axesSpecs.forEach((spec: AxisSpec) => {\n    const { id, groupId, domain } = spec;\n\n    if (!domain) return;\n\n    if (isXDomain(spec.position, chartRotation)) {\n      throw new Error(`[Axis ${id}]: custom domain for xDomain should be defined in Settings`);\n    }\n\n    if (domain.min > domain.max) {\n      throw new Error(`[Axis ${id}]: custom domain is invalid, min is greater than max`);\n    }\n\n    const prevGroupDomain = domainsByGroupId.get(groupId);\n\n    if (prevGroupDomain) {\n      const mergedDomain = {\n        min: Math.min(\n          Number.isFinite(domain.min) ? domain.min : Infinity,\n          prevGroupDomain && Number.isFinite(prevGroupDomain.min) ? prevGroupDomain.min : Infinity,\n        ),\n        max: Math.max(\n          Number.isFinite(domain.max) ? domain.max : -Infinity,\n          prevGroupDomain && Number.isFinite(prevGroupDomain.max) ? prevGroupDomain.max : -Infinity,\n        ),\n      };\n\n      if (Number.isFinite(mergedDomain.min) || Number.isFinite(mergedDomain.max)) {\n        domainsByGroupId.set(groupId, mergedDomain);\n      }\n    } else {\n      domainsByGroupId.set(groupId, domain);\n    }\n  });\n  return domainsByGroupId;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getPlotAreaRestrictedPoint, getPointsConstraintToSinglePanel, PanelPoints } from './get_brush_area';\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { getSeriesSpecsSelector } from './get_specs';\nimport { isBrushAvailableSelector } from './is_brush_available';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { ChartType } from '../../..';\nimport { SmallMultipleScales } from '../../../../common/panel_utils';\nimport { ScaleContinuous } from '../../../../scales';\nimport { isContinuousScale } from '../../../../scales/types';\nimport { GroupBrushExtent, SeriesSpecs, XYBrushEvent } from '../../../../specs';\nimport { BrushAxis } from '../../../../specs/constants';\nimport { DragState, GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { clamp, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { hasDragged, DragCheckProps } from '../../../../utils/events';\nimport { GroupId } from '../../../../utils/ids';\nimport { hasHistogramBarSpec } from '../../domains/y_domain';\nimport { isVerticalRotation } from '../utils/common';\n\nconst getLastDragSelector = (state: GlobalChartState) => state.interactions.pointer.lastDrag;\n\n/**\n * Will call the onBrushEnd listener every time the following preconditions are met:\n * - the onBrushEnd listener is available\n * - we dragged the mouse pointer\n * @internal\n */\nexport function createOnBrushEndCaller(): (state: GlobalChartState) => void {\n  let prevProps: DragCheckProps | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      if (!isBrushAvailableSelector(state)) {\n        selector = null;\n        prevProps = null;\n        return;\n      }\n      selector = createCustomCachedSelector(\n        [\n          getLastDragSelector,\n          getSettingsSpecSelector,\n          getComputedScalesSelector,\n          computeChartDimensionsSelector,\n          isHistogramModeEnabledSelector,\n          computeSmallMultipleScalesSelector,\n          getSeriesSpecsSelector,\n        ],\n        (\n          lastDrag,\n          { onBrushEnd, rotation, brushAxis, minBrushDelta, roundHistogramBrushValues, allowBrushingLastHistogramBin },\n          computedScales,\n          { chartDimensions },\n          histogramMode,\n          smallMultipleScales,\n          seriesSpec,\n        ): void => {\n          const nextProps = {\n            lastDrag,\n            onBrushEnd,\n          };\n          const { yScales, xScale } = computedScales;\n          if (lastDrag !== null && hasDragged(prevProps, nextProps) && onBrushEnd && isContinuousScale(xScale)) {\n            const brushAreaEvent: XYBrushEvent = {};\n\n            if (brushAxis === BrushAxis.X || brushAxis === BrushAxis.Both) {\n              brushAreaEvent.x = getXBrushExtent(\n                chartDimensions,\n                lastDrag,\n                rotation,\n                histogramMode,\n                xScale,\n                smallMultipleScales,\n                allowBrushingLastHistogramBin,\n                seriesSpec,\n                minBrushDelta,\n                roundHistogramBrushValues,\n              );\n            }\n            if (brushAxis === BrushAxis.Y || brushAxis === BrushAxis.Both) {\n              brushAreaEvent.y = getYBrushExtents(\n                chartDimensions,\n                lastDrag,\n                rotation,\n                yScales,\n                smallMultipleScales,\n                minBrushDelta,\n              );\n            }\n            if (brushAreaEvent.x !== undefined || brushAreaEvent.y !== undefined) {\n              onBrushEnd(brushAreaEvent);\n            }\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n\nfunction scalePanelPointsToPanelCoordinates(\n  scaleXPoint: boolean,\n  { start, end, vPanelStart, hPanelStart, vPanelHeight, hPanelWidth }: PanelPoints,\n) {\n  // scale screen coordinates down to panel scale\n  const startPos = scaleXPoint ? start.x - hPanelStart : start.y - vPanelStart;\n  const endPos = scaleXPoint ? end.x - hPanelStart : end.y - vPanelStart;\n  const panelMax = scaleXPoint ? hPanelWidth : vPanelHeight;\n  return {\n    minPos: Math.min(startPos, endPos),\n    maxPos: Math.max(startPos, endPos),\n    panelMax,\n  };\n}\n\nfunction getXBrushExtent(\n  chartDimensions: Dimensions,\n  lastDrag: DragState,\n  rotation: Rotation,\n  histogramMode: boolean,\n  xScale: ScaleContinuous, // brush is available only on continuous scale right now\n  smallMultipleScales: SmallMultipleScales,\n  allowBrushingLastHistogramBin: boolean,\n  seriesSpecs: SeriesSpecs,\n  minBrushDelta?: number,\n  roundHistogramBrushValues?: boolean,\n): [number, number] | undefined {\n  const isXHorizontal = !isVerticalRotation(rotation);\n  // scale screen coordinates down to panel scale\n  const scaledPanelPoints = getMinMaxPos(chartDimensions, lastDrag, smallMultipleScales, isXHorizontal);\n  let { minPos, maxPos } = scaledPanelPoints;\n  // reverse the positions if chart is mirrored\n  if (rotation === -90 || rotation === 180) {\n    minPos = scaledPanelPoints.panelMax - minPos;\n    maxPos = scaledPanelPoints.panelMax - maxPos;\n  }\n  if (minBrushDelta !== undefined ? Math.abs(maxPos - minPos) < minBrushDelta : maxPos === minPos) {\n    // if 0 size brush, avoid computing the value\n    return;\n  }\n  const offset = histogramMode ? 0 : -(xScale.bandwidth + xScale.bandwidthPadding) / 2;\n  const histogramEnabled = hasHistogramBarSpec(seriesSpecs);\n  const invertValue =\n    histogramEnabled && roundHistogramBrushValues\n      ? (value: number) => xScale.invertWithStep(value, xScale.domain).value\n      : (value: number) => xScale.invert(value);\n  const minPosScaled = invertValue(minPos + offset);\n  const maxPosScaled = invertValue(maxPos + offset);\n  const [domainStart, domainEnd] = xScale.domain;\n  const maxDomainValue = domainEnd + (histogramEnabled && allowBrushingLastHistogramBin ? xScale.minInterval : 0);\n\n  const minValue = clamp(minPosScaled, domainStart, maxDomainValue);\n  const maxValue = clamp(minPosScaled, maxPosScaled, maxDomainValue);\n\n  return [minValue, maxValue];\n}\n\nfunction getMinMaxPos(\n  chartDimensions: Dimensions,\n  lastDrag: DragState,\n  smallMultipleScales: SmallMultipleScales,\n  scaleXPoint: boolean,\n) {\n  const panelPoints = getPanelPoints(chartDimensions, lastDrag, smallMultipleScales);\n  // scale screen coordinates down to panel scale\n  return scalePanelPointsToPanelCoordinates(scaleXPoint, panelPoints);\n}\n\nfunction getPanelPoints(chartDimensions: Dimensions, lastDrag: DragState, smallMultipleScales: SmallMultipleScales) {\n  const plotStartPointPx = getPlotAreaRestrictedPoint(lastDrag.start.position, chartDimensions);\n  const plotEndPointPx = getPlotAreaRestrictedPoint(lastDrag.end.position, chartDimensions);\n  return getPointsConstraintToSinglePanel(plotStartPointPx, plotEndPointPx, smallMultipleScales);\n}\n\nfunction getYBrushExtents(\n  chartDimensions: Dimensions,\n  lastDrag: DragState,\n  rotation: Rotation,\n  yScales: Map<GroupId, ScaleContinuous>,\n  smallMultipleScales: SmallMultipleScales,\n  minBrushDelta?: number,\n): GroupBrushExtent[] | undefined {\n  const yValues: GroupBrushExtent[] = [];\n  yScales.forEach((yScale, groupId) => {\n    const isXVertical = isVerticalRotation(rotation);\n    // scale screen coordinates down to panel scale\n    const scaledPanelPoints = getMinMaxPos(chartDimensions, lastDrag, smallMultipleScales, isXVertical);\n    let { minPos, maxPos } = scaledPanelPoints;\n\n    if (rotation === 90 || rotation === 180) {\n      minPos = scaledPanelPoints.panelMax - minPos;\n      maxPos = scaledPanelPoints.panelMax - maxPos;\n    }\n    if (minBrushDelta !== undefined ? Math.abs(maxPos - minPos) < minBrushDelta : maxPos === minPos) {\n      // if 0 size brush, avoid computing the value\n      return;\n    }\n\n    const minPosScaled = yScale.invert(minPos);\n    const maxPosScaled = yScale.invert(maxPos);\n    const [domainStart, domainEnd] = yScale.domain;\n    const minValue = clamp(minPosScaled, domainStart, maxPosScaled);\n    const maxValue = clamp(minPosScaled, maxPosScaled, domainEnd);\n    yValues.push({ extent: [minValue, maxValue], groupId });\n  });\n  return yValues.length === 0 ? undefined : yValues;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getMultipleRectangleAnnotations } from './get_multiple_rectangle_annotations';\nimport { getProjectedScaledValues } from './get_projected_scaled_values';\nimport { getHighlightedGeomsSelector } from './get_tooltip_values_highlighted_geoms';\nimport { ChartType } from '../../..';\nimport {\n  AnnotationType,\n  LineAnnotationDatum,\n  ProjectedValues,\n  RectAnnotationDatum,\n  SettingsSpec,\n} from '../../../../specs';\nimport { GlobalChartState, PointerState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastClickSelector } from '../../../../state/selectors/get_last_click';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isClicking } from '../../../../state/utils';\nimport { IndexedGeometry, GeometryValue } from '../../../../utils/geometry';\nimport { AnnotationTooltipState } from '../../annotations/types';\nimport { XYChartSeriesIdentifier } from '../../utils/series';\n\n/**\n * Will call the onElementClick listener every time the following preconditions are met:\n * - the onElementClick listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnClickCaller(): (state: GlobalChartState) => void {\n  let prevClick: PointerState | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector) {\n      return selector(state);\n    }\n    if (state.chartType !== ChartType.XYAxis) {\n      return;\n    }\n    selector = createCustomCachedSelector(\n      [\n        getLastClickSelector,\n        getSettingsSpecSelector,\n        getHighlightedGeomsSelector,\n        getProjectedScaledValues,\n        getMultipleRectangleAnnotations,\n      ],\n      (\n        lastClick: PointerState | null,\n        { onElementClick, onProjectionClick, onAnnotationClick }: SettingsSpec,\n        indexedGeometries: IndexedGeometry[],\n        values,\n        tooltipStates,\n      ): void => {\n        if (!isClicking(prevClick, lastClick)) {\n          return;\n        }\n        const elementClickFired = tryFiringOnElementClick(indexedGeometries, onElementClick);\n        if (!elementClickFired && onAnnotationClick && tooltipStates) {\n          tryFiringOnAnnotationClick(tooltipStates, onAnnotationClick, indexedGeometries);\n        } else if (!elementClickFired) {\n          tryFiringOnProjectionClick(values, onProjectionClick);\n        }\n        prevClick = lastClick;\n      },\n    );\n  };\n}\n\nfunction tryFiringOnElementClick(\n  indexedGeometries: IndexedGeometry[],\n  onElementClick: SettingsSpec['onElementClick'],\n): boolean {\n  if (indexedGeometries.length === 0 || !onElementClick) {\n    return false;\n  }\n  const elements = indexedGeometries.map<[GeometryValue, XYChartSeriesIdentifier]>(({ value, seriesIdentifier }) => [\n    value,\n    seriesIdentifier,\n  ]);\n  onElementClick(elements);\n  return true;\n}\n\nfunction tryFiringOnProjectionClick(\n  values: ProjectedValues | undefined,\n  onProjectionClick: SettingsSpec['onProjectionClick'],\n): boolean {\n  const properClick = values !== undefined && onProjectionClick;\n  if (properClick) onProjectionClick(values);\n  return Boolean(properClick);\n}\n\nfunction tryFiringOnAnnotationClick(\n  annotationState: AnnotationTooltipState[],\n  onAnnotationClick: SettingsSpec['onAnnotationClick'],\n  indexedGeometries: IndexedGeometry[],\n): boolean {\n  if (indexedGeometries.length > 0) return false;\n  if (annotationState.length > 0 && onAnnotationClick) {\n    const rects: { id: string; datum: RectAnnotationDatum }[] = [];\n    const lines: { id: string; datum: LineAnnotationDatum }[] = [];\n    annotationState.forEach((annotation) => {\n      if (annotation.annotationType === AnnotationType.Rectangle) {\n        rects.push({\n          id: annotation.id,\n          datum: annotation.datum as RectAnnotationDatum,\n        });\n      } else if (annotation.annotationType === AnnotationType.Line) {\n        lines.push({\n          id: annotation.id,\n          datum: annotation.datum as LineAnnotationDatum,\n        });\n      }\n    });\n    onAnnotationClick({ rects, lines });\n    return true;\n  }\n  return false;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport {\n  getHighlightedTooltipTooltipValuesSelector,\n  TooltipAndHighlightedGeoms,\n} from './get_tooltip_values_highlighted_geoms';\nimport { ChartType } from '../../..';\nimport { SettingsSpec } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { IndexedGeometry } from '../../../../utils/geometry';\n\ninterface Props {\n  settings: SettingsSpec | undefined;\n  highlightedGeometries: IndexedGeometry[];\n}\n\nconst isOutElement = (prevProps: Props | null, nextProps: Props | null): boolean =>\n  Boolean(\n    prevProps &&\n      nextProps?.settings?.onElementOut &&\n      prevProps.highlightedGeometries.length > 0 &&\n      nextProps.highlightedGeometries.length === 0,\n  );\n\n/**\n * Will call the onElementOut listener every time the following preconditions are met:\n * - the onElementOut listener is available\n * - the highlighted geometries list goes from a list of at least one object to an empty one\n * @internal\n */\nexport function createOnElementOutCaller(): (state: GlobalChartState) => void {\n  let prevProps: Props | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      selector = createCustomCachedSelector(\n        [getHighlightedTooltipTooltipValuesSelector, getSettingsSpecSelector],\n        ({ highlightedGeometries }: TooltipAndHighlightedGeoms, settings: SettingsSpec): void => {\n          const nextProps = {\n            settings,\n            highlightedGeometries,\n          };\n\n          if (isOutElement(prevProps, nextProps) && settings.onElementOut) {\n            settings.onElementOut();\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport {\n  getHighlightedTooltipTooltipValuesSelector,\n  TooltipAndHighlightedGeoms,\n} from './get_tooltip_values_highlighted_geoms';\nimport { ChartType } from '../../..';\nimport { SettingsSpec } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { IndexedGeometry, GeometryValue } from '../../../../utils/geometry';\nimport { XYChartSeriesIdentifier } from '../../utils/series';\n\ninterface Props {\n  settings: SettingsSpec | undefined;\n  highlightedGeometries: IndexedGeometry[];\n}\n\nfunction isOverElement(prevProps: Props | null, nextProps: Props | null) {\n  if (!nextProps || !nextProps.settings || !nextProps.settings.onElementOver) {\n    return false;\n  }\n  const { highlightedGeometries: nextGeomValues } = nextProps;\n  const prevGeomValues = prevProps?.highlightedGeometries ?? [];\n  return (\n    nextGeomValues.length > 0 &&\n    (nextGeomValues.length !== prevGeomValues.length ||\n      !nextGeomValues.every(({ value: next }, index) => {\n        const prev = prevGeomValues[index]?.value;\n        return prev && prev.x === next.x && prev.y === next.y && prev.accessor === next.accessor;\n      }))\n  );\n}\n\n/**\n * Will call the onElementOver listener every time the following preconditions are met:\n * - the onElementOver listener is available\n * - we have a new set of highlighted geometries on our state\n * @internal\n */\nexport function createOnElementOverCaller(): (state: GlobalChartState) => void {\n  let prevProps: Props | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      selector = createCustomCachedSelector(\n        [getHighlightedTooltipTooltipValuesSelector, getSettingsSpecSelector],\n        ({ highlightedGeometries }: TooltipAndHighlightedGeoms, settings: SettingsSpec): void => {\n          const nextProps = {\n            settings,\n            highlightedGeometries,\n          };\n\n          if (isOverElement(prevProps, nextProps) && settings.onElementOver) {\n            const elements = highlightedGeometries.map<[GeometryValue, XYChartSeriesIdentifier]>(\n              ({ value, seriesIdentifier }) => [value, seriesIdentifier],\n            );\n            settings.onElementOver(elements);\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getGeometriesIndexKeysSelector } from './get_geometries_index_keys';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { PointerPosition } from './get_projected_pointer_position';\nimport { ChartType } from '../../..';\nimport { PointerEvent, PointerOverEvent, PointerUpdateTrigger } from '../../../../specs';\nimport { PointerEventType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartIdSelector } from '../../../../state/selectors/get_chart_id';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { ComputedScales } from '../utils/types';\n\nconst getPointerEventSelector = createCustomCachedSelector(\n  [\n    getChartIdSelector,\n    getOrientedProjectedPointerPositionSelector,\n    computeSeriesGeometriesSelector,\n    getGeometriesIndexKeysSelector,\n  ],\n  (chartId, orientedProjectedPointerPosition, seriesGeometries, geometriesIndexKeys): PointerEvent =>\n    getPointerEvent(chartId, orientedProjectedPointerPosition, seriesGeometries.scales, geometriesIndexKeys),\n);\n\nfunction getPointerEvent(\n  chartId: string,\n  orientedProjectedPointerPosition: PointerPosition,\n  { xScale, yScales }: ComputedScales,\n  geometriesIndexKeys: any[],\n): PointerEvent {\n  // update the cursorBandPosition based on chart configuration\n  if (!xScale) {\n    return { chartId, type: PointerEventType.Out };\n  }\n  const { x, y, verticalPanelValue, horizontalPanelValue } = orientedProjectedPointerPosition;\n  if (x === -1 || y === -1) {\n    return { chartId, type: PointerEventType.Out };\n  }\n  const xValue = xScale.invertWithStep(x, geometriesIndexKeys).value;\n  if (isNil(xValue) || Number.isNaN(xValue)) {\n    return { chartId, type: PointerEventType.Out };\n  }\n  return {\n    chartId,\n    type: PointerEventType.Over,\n    unit: xScale.unit,\n    scale: xScale.type,\n    x: xValue,\n    y: [...yScales.entries()].map(([groupId, yScale]) => {\n      return { value: yScale.invert(y), groupId };\n    }),\n    smVerticalValue: verticalPanelValue,\n    smHorizontalValue: horizontalPanelValue,\n  };\n}\n\nfunction isSameEventValue(a: PointerOverEvent, b: PointerOverEvent, changeTrigger: PointerUpdateTrigger) {\n  const checkX = changeTrigger === PointerUpdateTrigger.X || changeTrigger === PointerUpdateTrigger.Both;\n  const checkY = changeTrigger === PointerUpdateTrigger.Y || changeTrigger === PointerUpdateTrigger.Both;\n  return (\n    (!checkX || (a.x === b.x && a.scale === b.scale && a.unit === b.unit)) &&\n    (!checkY || a.y.every((y, i) => y.value === b.y[i]?.value))\n  );\n}\n\nconst hasPointerEventChanged = (prev: PointerEvent, next: PointerEvent | null, changeTrigger: PointerUpdateTrigger) =>\n  next?.type !== prev.type ||\n  (prev.type === PointerEventType.Over &&\n    next?.type === PointerEventType.Over &&\n    !isSameEventValue(prev, next, changeTrigger));\n\n/** @internal */\nexport function createOnPointerMoveCaller(): (state: GlobalChartState) => void {\n  let prevPointerEvent: PointerEvent | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      selector = createCustomCachedSelector(\n        [getSettingsSpecSelector, getPointerEventSelector, getChartIdSelector],\n        ({ onPointerUpdate, pointerUpdateTrigger }, nextPointerEvent, chartId): void => {\n          if (prevPointerEvent === null) {\n            prevPointerEvent = { chartId, type: PointerEventType.Out };\n          }\n          const tempPrev = { ...prevPointerEvent };\n          // we have to update the prevPointerEvents before possibly calling the onPointerUpdate\n          // to avoid a recursive loop of calls caused by the impossibility to update the prevPointerEvent\n          prevPointerEvent = nextPointerEvent;\n\n          if (onPointerUpdate && hasPointerEventChanged(tempPrev, nextPointerEvent, pointerUpdateTrigger))\n            onPointerUpdate(nextPointerEvent);\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { ChartType } from '../../..';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Dimensions } from '../../../../utils/dimensions';\n\nfunction isDiff(prevProps: Dimensions, nextProps: Dimensions) {\n  return (\n    prevProps.top !== nextProps.top ||\n    prevProps.left !== nextProps.left ||\n    prevProps.width !== nextProps.width ||\n    prevProps.height !== nextProps.height\n  );\n}\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/**\n * @internal\n */\nexport function createOnProjectionAreaCaller(): (state: GlobalChartState) => void {\n  let prevProps: { projection: Dimensions; parent: Dimensions } | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      selector = createCustomCachedSelector(\n        [computeChartDimensionsSelector, getSettingsSpecSelector, getParentDimension],\n        ({ chartDimensions }, { onProjectionAreaChange }, parent): void => {\n          const nextProps = { projection: { ...chartDimensions }, parent: { ...parent } };\n          const areDifferent =\n            !prevProps ||\n            isDiff(prevProps.projection, nextProps.projection) ||\n            isDiff(nextProps.parent, nextProps.parent);\n          if (onProjectionAreaChange && areDifferent) {\n            onProjectionAreaChange(nextProps);\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisLabelFormatter } from './axis_tick_formatter';\nimport { getJoinedVisibleAxesData, getLabelBox, JoinedAxisData } from './compute_axis_ticks_dimensions';\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { countBarsInClusterSelector } from './count_bars_in_cluster';\nimport { getBarPaddingsSelector } from './get_bar_paddings';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { getPanelSize, SmallMultipleScales } from '../../../../common/panel_utils';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { ScaleType } from '../../../../scales/constants';\nimport { isContinuousScale } from '../../../../scales/types';\nimport { AxisSpec, SettingsSpec } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isRTLString, Position, Rotation } from '../../../../utils/common';\nimport { Size } from '../../../../utils/dimensions';\nimport { AxisId } from '../../../../utils/ids';\nimport { multilayerAxisEntry } from '../../axes/timeslip/multilayer_ticks';\nimport { isHorizontalAxis, isVerticalAxis } from '../../utils/axis_type_utils';\nimport { AxisTick, TextDirection, TickLabelBounds } from '../../utils/axis_utils';\nimport { computeXScale } from '../../utils/scales';\nimport { SeriesDomainsAndData } from '../utils/types';\n\n/** @internal */\nexport type Projection = { ticks: AxisTick[]; labelBox: TickLabelBounds; scale: ScaleBand | ScaleContinuous };\n\n/** @internal */\nexport type GetMeasuredTicks = (\n  scale: ScaleBand | ScaleContinuous,\n  ticks: (number | string)[],\n  layer: number | undefined,\n  detailedLayer: number,\n  labelFormat: AxisLabelFormatter,\n  showGrid?: boolean,\n) => Projection;\n\ntype Projections = Map<AxisId, Projection>;\n\nconst adaptiveTickCount = true;\n\nfunction axisMinMax(axisPosition: Position, chartRotation: Rotation, { width, height }: Size): [number, number] {\n  const horizontal = isHorizontalAxis(axisPosition);\n  const flipped = horizontal\n    ? chartRotation === -90 || chartRotation === 180\n    : chartRotation === 90 || chartRotation === 180;\n  return horizontal ? [flipped ? width : 0, flipped ? 0 : width] : [flipped ? 0 : height, flipped ? height : 0];\n}\n\nfunction getDirectionFn({ type }: ScaleBand | ScaleContinuous): (label: string) => TextDirection {\n  return type === ScaleType.Ordinal\n    ? (label) => (isRTLString(label) ? 'rtl' : 'ltr') // depends on label\n    : () => 'ltr'; // always use ltr\n}\n\n/** @internal */\nexport function generateTicks(\n  axisSpec: AxisSpec,\n  scale: ScaleBand | ScaleContinuous,\n  ticks: (number | string)[],\n  offset: number,\n  labelFormatter: AxisLabelFormatter,\n  layer: number | undefined,\n  detailedLayer: number,\n  showGrid: boolean,\n): AxisTick[] {\n  const getDirection = getDirectionFn(scale);\n  const isContinuous = isContinuousScale(scale);\n  return ticks.map<AxisTick>((value) => {\n    const domainClampedValue = isContinuous && typeof value === 'number' ? Math.max(value, scale.domain[0]) : value;\n    const label = labelFormatter(value);\n    return {\n      value,\n      domainClampedValue,\n      label,\n      position: (scale.scale(value) || 0) + offset, // todo it doesn't look desirable to convert a NaN into a zero\n      domainClampedPosition: (scale.scale(domainClampedValue) || 0) + offset, // todo it doesn't look desirable to convert a NaN into a zero\n      layer,\n      detailedLayer,\n      showGrid,\n      direction: getDirection(label),\n    };\n  });\n}\n\nfunction getVisibleTicks(\n  axisSpec: AxisSpec,\n  labelBox: TickLabelBounds,\n  totalBarsInCluster: number,\n  labelFormatter: AxisLabelFormatter,\n  rotationOffset: number,\n  scale: ScaleBand | ScaleContinuous,\n  enableHistogramMode: boolean,\n  layer: number | undefined,\n  detailedLayer: number,\n  ticks: (number | string)[],\n  isMultilayerTimeAxis: boolean = false,\n  showGrid = true,\n): AxisTick[] {\n  const isSingleValueScale = scale.domain[0] === scale.domain[1];\n  const makeRaster = enableHistogramMode && scale.bandwidth > 0 && !isMultilayerTimeAxis;\n  const ultimateTick = ticks.at(-1);\n  const penultimateTick = ticks.at(-2);\n  if (makeRaster && !isSingleValueScale && typeof penultimateTick === 'number' && typeof ultimateTick === 'number') {\n    const computedTickDistance = ultimateTick - penultimateTick;\n    const numTicks = scale.minInterval / (computedTickDistance || scale.minInterval); // avoid infinite loop\n    for (let i = 1; i <= numTicks; i++) ticks.push(i * computedTickDistance + ultimateTick);\n  }\n  const shift = totalBarsInCluster > 0 ? totalBarsInCluster : 1;\n  const band = scale.bandwidth / (1 - scale.barsPadding);\n  const halfPadding = (band - scale.bandwidth) / 2;\n  const offset =\n    (enableHistogramMode ? -halfPadding : (scale.bandwidth * shift) / 2) + (scale.isSingleValue() ? 0 : rotationOffset);\n\n  const firstTickValue = ticks[0];\n  const allTicks: AxisTick[] =\n    makeRaster && isSingleValueScale && typeof firstTickValue === 'number'\n      ? [\n          {\n            value: firstTickValue,\n            domainClampedValue: firstTickValue,\n            label: labelFormatter(firstTickValue),\n            position: (scale.scale(firstTickValue) || 0) + offset,\n            domainClampedPosition: (scale.scale(firstTickValue) || 0) + offset,\n            layer: undefined, // no multiple layers with `singleValueScale`s\n            detailedLayer: 0,\n            direction: 'rtl',\n            showGrid,\n          },\n          {\n            value: firstTickValue + scale.minInterval,\n            domainClampedValue: firstTickValue + scale.minInterval,\n            label: labelFormatter(firstTickValue + scale.minInterval),\n            position: scale.bandwidth + halfPadding * 2,\n            domainClampedPosition: scale.bandwidth + halfPadding * 2,\n            layer: undefined, // no multiple layers with `singleValueScale`s\n            detailedLayer: 0,\n            direction: 'rtl',\n            showGrid,\n          },\n        ]\n      : generateTicks(axisSpec, scale, ticks, offset, labelFormatter, layer, detailedLayer, showGrid);\n\n  const { showOverlappingTicks, showOverlappingLabels, position } = axisSpec;\n  const requiredSpace = isVerticalAxis(position) ? labelBox.maxLabelBboxHeight / 2 : labelBox.maxLabelBboxWidth / 2;\n  const bypassOverlapCheck = showOverlappingLabels || isMultilayerTimeAxis;\n  return bypassOverlapCheck\n    ? allTicks\n    : [...allTicks]\n        .sort((a: AxisTick, b: AxisTick) => a.position - b.position)\n        .reduce(\n          (prev, tick) => {\n            const tickLabelFits = tick.position >= prev.occupiedSpace + requiredSpace;\n            if (tickLabelFits || showOverlappingTicks) {\n              prev.visibleTicks.push(tickLabelFits ? tick : { ...tick, label: '' });\n              if (tickLabelFits) prev.occupiedSpace = tick.position + requiredSpace;\n            } else if (adaptiveTickCount && !tickLabelFits && !showOverlappingTicks) {\n              prev.visibleTicks.push({ ...tick, label: '' });\n            }\n            return prev;\n          },\n          { visibleTicks: [] as AxisTick[], occupiedSpace: -Infinity },\n        ).visibleTicks;\n}\n\nfunction getVisibleTickSet(\n  scale: ScaleBand | ScaleContinuous,\n  labelBox: TickLabelBounds,\n  { rotation: chartRotation }: Pick<SettingsSpec, 'rotation'>,\n  axisSpec: AxisSpec,\n  groupCount: number,\n  histogramMode: boolean,\n  layer: number | undefined,\n  detailedLayer: number,\n  ticks: (number | string)[],\n  labelFormatter: AxisLabelFormatter,\n  isMultilayerTimeAxis = false,\n  showGrid = true,\n): AxisTick[] {\n  const vertical = isVerticalAxis(axisSpec.position);\n  const somehowRotated = (vertical && chartRotation === -90) || (!vertical && chartRotation === 180);\n  const rotationOffset = histogramMode && somehowRotated ? scale.step : 0; // todo find the true cause of the this offset issue\n\n  return getVisibleTicks(\n    axisSpec,\n    labelBox,\n    groupCount,\n    labelFormatter,\n    rotationOffset,\n    scale,\n    histogramMode,\n    layer,\n    detailedLayer,\n    ticks,\n    isMultilayerTimeAxis,\n    showGrid,\n  );\n}\n\n/** @internal */\nexport const getVisibleTickSetsSelector = createCustomCachedSelector(\n  [\n    getSettingsSpecSelector,\n    getJoinedVisibleAxesData,\n    computeSeriesDomainsSelector,\n    computeSmallMultipleScalesSelector,\n    countBarsInClusterSelector,\n    isHistogramModeEnabledSelector,\n    getBarPaddingsSelector,\n  ],\n  getVisibleTickSets,\n);\n\nfunction getVisibleTickSets(\n  { rotation: chartRotation, locale }: Pick<SettingsSpec, 'rotation' | 'locale'>,\n  joinedAxesData: Map<AxisId, JoinedAxisData>,\n  { xDomain, yDomains }: Pick<SeriesDomainsAndData, 'xDomain' | 'yDomains'>,\n  smScales: SmallMultipleScales,\n  totalGroupsCount: number,\n  enableHistogramMode: boolean,\n  barsPadding?: number,\n): Projections {\n  return withTextMeasure((textMeasure) => {\n    const panel = getPanelSize(smScales);\n    return [...joinedAxesData].reduce(\n      (acc, [axisId, { axisSpec, axesStyle, gridLine, isXAxis, labelFormatter: userProvidedLabelFormatter }]) => {\n        const { groupId, integersOnly, maximumFractionDigits: mfd, timeAxisLayerCount } = axisSpec;\n        const yDomain = yDomains.find((yd) => yd.groupId === groupId);\n        const domain = isXAxis ? xDomain : yDomain;\n        const range = axisMinMax(axisSpec.position, chartRotation, panel);\n        const maxTickCount = domain?.desiredTickCount ?? 0;\n        const isMultilayerTimeAxis = domain?.type === ScaleType.Time && timeAxisLayerCount > 0;\n        // TODO: remove this fallback when integersOnly is removed\n        const maximumFractionDigits = mfd ?? (integersOnly ? 0 : undefined);\n\n        const getMeasuredTicks = (\n          scale: ScaleBand | ScaleContinuous,\n          ticks: (number | string)[],\n          layer: number | undefined,\n          detailedLayer: number,\n          labelFormatter: AxisLabelFormatter,\n          showGrid = true,\n        ): Projection => {\n          const labelBox = getLabelBox(axesStyle, ticks, labelFormatter, textMeasure, axisSpec, gridLine);\n          return {\n            ticks: getVisibleTickSet(\n              scale,\n              labelBox,\n              { rotation: chartRotation },\n              axisSpec,\n              totalGroupsCount,\n              enableHistogramMode,\n              layer,\n              detailedLayer,\n              ticks,\n              labelFormatter,\n              isMultilayerTimeAxis,\n              showGrid,\n            ),\n            labelBox,\n            scale, // tick count driving nicing; nicing drives domain; therefore scale may vary, downstream needs it\n          };\n        };\n\n        const getScale = (desiredTickCount: number) =>\n          isXAxis\n            ? computeXScale({\n                xDomain: { ...xDomain, desiredTickCount },\n                totalBarsInCluster: totalGroupsCount,\n                range,\n                barsPadding,\n                enableHistogramMode,\n                maximumFractionDigits,\n              })\n            : yDomain &&\n              new ScaleContinuous({ ...yDomain, range }, { ...yDomain, desiredTickCount, maximumFractionDigits });\n\n        const fillLayer = (maxTickCountForLayer: number) => {\n          let fallbackAskedTickCount = 2;\n          let fallbackReceivedTickCount = Infinity;\n          if (adaptiveTickCount) {\n            let previousActualTickCount = NaN;\n            for (let triedTickCount = maxTickCountForLayer; triedTickCount >= 1; triedTickCount--) {\n              const scale = getScale(triedTickCount);\n              const actualTickCount = scale?.ticks().length ?? 0;\n              if (!scale || actualTickCount === previousActualTickCount || actualTickCount < 2) continue;\n              const raster = getMeasuredTicks(scale, scale.ticks(), undefined, 0, userProvidedLabelFormatter);\n              const nonZeroLengthTicks = raster.ticks.filter((tick) => tick.label.length > 0);\n              const uniqueLabels = new Set(raster.ticks.map((tick) => tick.label));\n              const areLabelsUnique = raster.ticks.length === uniqueLabels.size;\n              const areAdjacentTimeLabelsUnique =\n                scale.type === ScaleType.Time &&\n                !axisSpec.showDuplicatedTicks &&\n                (areLabelsUnique || raster.ticks.every((d, i, a) => i === 0 || d.label !== a[i - 1]?.label));\n              const atLeastTwoTicks = uniqueLabels.size >= 2;\n              const allTicksFit = !uniqueLabels.has('');\n              const compliant =\n                axisSpec &&\n                (scale.type === ScaleType.Time || atLeastTwoTicks) &&\n                (scale.type === ScaleType.Log || allTicksFit) &&\n                ((scale.type === ScaleType.Time && (axisSpec.showDuplicatedTicks || areAdjacentTimeLabelsUnique)) ||\n                  (scale.type === ScaleType.Log\n                    ? new Set(nonZeroLengthTicks.map((tick) => tick.label)).size === nonZeroLengthTicks.length\n                    : areLabelsUnique));\n              previousActualTickCount = actualTickCount;\n              if (raster && compliant) {\n                return {\n                  entry: {\n                    ...raster,\n                    ticks: scale.type === ScaleType.Log ? raster.ticks : nonZeroLengthTicks,\n                  },\n                  fallbackAskedTickCount,\n                };\n              } else if (atLeastTwoTicks && uniqueLabels.size <= fallbackReceivedTickCount) {\n                // let's remember the smallest triedTickCount that yielded two distinct ticks\n                fallbackReceivedTickCount = uniqueLabels.size;\n                fallbackAskedTickCount = triedTickCount;\n              }\n            }\n          }\n          return { fallbackAskedTickCount };\n        };\n\n        if (isMultilayerTimeAxis) {\n          const scale = getScale(0); // the scale is only needed for its non-tick props like step, bandwidth, ...\n          if (!scale || !isContinuousScale(scale)) throw new Error('Scale generation for the multilayer axis failed');\n          return acc.set(\n            axisId,\n            multilayerAxisEntry(\n              xDomain,\n              isXAxis && xDomain.isBandScale && enableHistogramMode,\n              range,\n              timeAxisLayerCount,\n              scale,\n              getMeasuredTicks,\n              locale,\n            ),\n          );\n        }\n\n        const { fallbackAskedTickCount, entry } = fillLayer(maxTickCount);\n        if (entry) return acc.set(axisId, entry);\n\n        // todo dry it up\n        const scale = getScale(adaptiveTickCount ? fallbackAskedTickCount : maxTickCount);\n        const lastResortCandidate =\n          scale && getMeasuredTicks(scale, scale.ticks(), undefined, 0, userProvidedLabelFormatter);\n        return lastResortCandidate ? acc.set(axisId, lastResortCandidate) : acc;\n      },\n      new Map(),\n    );\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GeometriesCounts } from './types';\nimport { LegendItem } from '../../../../common/legend';\nimport { getDistance, Rotation } from '../../../../utils/common';\nimport { Point } from '../../../../utils/point';\nimport { BasicSeriesSpec, SeriesType } from '../../utils/specs';\n\n/** @internal */\nexport const MAX_ANIMATABLE_BARS = 300;\n/** @internal */\nexport const MAX_ANIMATABLE_LINES_AREA_POINTS = 600;\n\n/** @internal */\nexport function isHorizontalRotation(chartRotation: Rotation) {\n  return chartRotation === 0 || chartRotation === 180;\n}\n\n/** @internal */\nexport function isVerticalRotation(chartRotation: Rotation) {\n  return chartRotation === -90 || chartRotation === 90;\n}\n/**\n * Check if a specs map contains only line or area specs\n * @param specs Map<SpecId, BasicSeriesSpec>\n * @internal\n */\nexport function isLineAreaOnlyChart(specs: BasicSeriesSpec[]) {\n  return !specs.some((spec) => spec.seriesType === SeriesType.Bar);\n}\n\n/** @internal */\nexport function isChartAnimatable(geometriesCounts: GeometriesCounts, animationEnabled: boolean): boolean {\n  if (!animationEnabled) {\n    return false;\n  }\n  const { bars, linePoints, areasPoints } = geometriesCounts;\n  const isBarsAnimatable = bars <= MAX_ANIMATABLE_BARS;\n  const isLinesAndAreasAnimatable = linePoints + areasPoints <= MAX_ANIMATABLE_LINES_AREA_POINTS;\n  return isBarsAnimatable && isLinesAndAreasAnimatable;\n}\n\n/** @internal */\nexport function isAllSeriesDeselected(legendItems: LegendItem[]): boolean {\n  // eslint-disable-next-line no-restricted-syntax\n  for (const legendItem of legendItems) {\n    if (!legendItem.isSeriesHidden) {\n      return false;\n    }\n  }\n  return true;\n}\n\n/**\n * Sorts points in order from closest to farthest from cursor\n * @internal\n */\nexport const sortClosestToPoint =\n  (cursor: Point) =>\n  (a: Point, b: Point): number => {\n    return getDistance(cursor, a) - getDistance(cursor, b);\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { ScaleType } from '../../../../scales/constants';\nimport { XDomain } from '../../domains/types';\nimport { isDatumFilled } from '../../rendering/utils';\nimport { DataSeries, DataSeriesDatum } from '../../utils/series';\n\n/** @internal */\nexport const LegendValue = Object.freeze({\n  None: 'none' as const,\n  LastValue: 'lastValue' as const,\n  LastNonNullValue: 'lastNonNullValue' as const,\n});\n/** @internal */\nexport type LegendValue = $Values<typeof LegendValue>;\n\n/**\n * This method return a value from a DataSeries that correspond to the type of value requested.\n * It in general compute the last, min, max, avg, sum of the value in a series.\n * NOTE: not every type can work correctly with the data provided, for example a sum will not work when using the percentage chart\n * @internal\n */\nexport function getLegendValue(\n  series: DataSeries,\n  xDomain: XDomain,\n  type: LegendValue,\n  valueAccessor: (d: DataSeriesDatum) => number | null,\n): number | null {\n  // See https://github.com/elastic/elastic-charts/issues/2050\n  if (xDomain.type === ScaleType.Ordinal) {\n    return null;\n  }\n\n  switch (type) {\n    case LegendValue.LastNonNullValue: {\n      const last = series.data.findLast((d) => d.x === xDomain.dataDomain[1] && valueAccessor(d) !== null);\n      return last ? valueAccessor(last) : null;\n    }\n    case LegendValue.LastValue:\n      const last = series.data.findLast((d) => d.x === xDomain.dataDomain[1]);\n      if (last && !isDatumFilled(last)) {\n        return valueAccessor(last);\n      }\n      return null;\n    default:\n    case LegendValue.None:\n      return null;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BasicSeriesSpec, DEFAULT_GLOBAL_ID, Spec } from '../../../../specs';\nimport { Rotation } from '../../../../utils/common';\nimport { GroupId } from '../../../../utils/ids';\nimport { isXDomain } from '../../utils/axis_utils';\nimport { AxisSpec } from '../../utils/specs';\n\n/** @internal */\nexport function getSpecsById<T extends Spec>(specs: T[], id: string): T | undefined {\n  return specs.find((spec) => spec.id === id);\n}\n\n/** @internal */\nexport function getAxesSpecForSpecId(axesSpecs: AxisSpec[], groupId: GroupId, chartRotation: Rotation = 0) {\n  return axesSpecs.reduce<{ xAxis?: AxisSpec; yAxis?: AxisSpec }>((result, spec) => {\n    if (spec.groupId === groupId && isXDomain(spec.position, chartRotation)) result.xAxis = spec;\n    else if (spec.groupId === groupId && !isXDomain(spec.position, chartRotation)) result.yAxis = spec;\n    return result;\n  }, {});\n}\n\n/** @internal */\nexport function getSpecDomainGroupId(spec: BasicSeriesSpec): string {\n  if (!spec.useDefaultGroupDomain) {\n    return spec.groupId;\n  }\n  return typeof spec.useDefaultGroupDomain === 'boolean' ? DEFAULT_GLOBAL_ID : spec.useDefaultGroupDomain;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isHorizontalRotation } from './common';\nimport { getAxesSpecForSpecId, getSpecDomainGroupId, getSpecsById } from './spec';\nimport { ComputedGeometries, GeometriesCounts, SeriesDomainsAndData, Transform } from './types';\nimport { Color } from '../../../../common/colors';\nimport { SmallMultipleScales, SmallMultiplesGroupBy } from '../../../../common/panel_utils';\nimport { getPredicateFn, Predicate } from '../../../../common/predicate';\nimport { SeriesIdentifier, SeriesKey } from '../../../../common/series_id';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { SettingsSpec, TickFormatter } from '../../../../specs';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isFiniteNumber, isNil, isUniqueArray, mergePartial, Rotation } from '../../../../utils/common';\nimport { CurveType } from '../../../../utils/curves';\nimport { Dimensions, Size } from '../../../../utils/dimensions';\nimport {\n  AreaGeometry,\n  BarGeometry,\n  BubbleGeometry,\n  LineGeometry,\n  PerPanel,\n  PointGeometry,\n} from '../../../../utils/geometry';\nimport { GroupId, SpecId } from '../../../../utils/ids';\nimport { getRenderingCompareFn } from '../../../../utils/series_sort';\nimport { ColorConfig, Theme } from '../../../../utils/themes/theme';\nimport { XDomain } from '../../domains/types';\nimport { mergeXDomain } from '../../domains/x_domain';\nimport { isStackedSpec, mergeYDomain } from '../../domains/y_domain';\nimport { renderArea } from '../../rendering/area';\nimport { renderBars } from '../../rendering/bars';\nimport { renderBubble } from '../../rendering/bubble';\nimport { renderLine } from '../../rendering/line';\nimport { getAreaSeriesStyles, getLineSeriesStyles } from '../../rendering/line_area_style';\nimport { defaultXYSeriesSort } from '../../utils/default_series_sort_fn';\nimport { fillSeries } from '../../utils/fill_series';\nimport { groupBy } from '../../utils/group_data_series';\nimport { IndexedGeometryMap } from '../../utils/indexed_geometry_map';\nimport { computeXScale, computeYScales } from '../../utils/scales';\nimport {\n  DataSeries,\n  getDataSeriesFromSpecs,\n  getFormattedDataSeries,\n  getSeriesKey,\n  isBandedSpec,\n} from '../../utils/series';\nimport {\n  AnnotationDomainType,\n  AnnotationSpec,\n  AxisSpec,\n  BasicSeriesSpec,\n  Fit,\n  FitConfig,\n  HistogramModeAlignment,\n  HistogramModeAlignments,\n  isAreaSeriesSpec,\n  isBarSeriesSpec,\n  isBubbleSeriesSpec,\n  isLineAnnotation,\n  isLineSeriesSpec,\n} from '../../utils/specs';\nimport { ScaleConfigs } from '../selectors/get_api_scale_configs';\n\n/**\n * Return map association between `seriesKey` and only the custom colors string\n * @internal\n * @param dataSeries\n */\nexport function getCustomSeriesColors(dataSeries: DataSeries[]): Map<SeriesKey, Color> {\n  const updatedCustomSeriesColors = new Map<SeriesKey, Color>();\n  const counters = new Map<SpecId, number>();\n\n  dataSeries.forEach((ds) => {\n    const { spec, specId } = ds;\n    const dataSeriesKey = {\n      specId: ds.specId,\n      xAccessor: ds.xAccessor,\n      yAccessor: ds.yAccessor,\n      splitAccessors: ds.splitAccessors,\n      smVerticalAccessorValue: undefined,\n      smHorizontalAccessorValue: undefined,\n    };\n    const seriesKey = getSeriesKey(dataSeriesKey, ds.groupId);\n\n    if (!spec || !spec.color) {\n      return;\n    }\n\n    let color: Color | undefined | null;\n\n    if (!color && spec.color) {\n      if (typeof spec.color === 'string') {\n        // eslint-disable-next-line prefer-destructuring\n        color = spec.color;\n      } else {\n        const counter = counters.get(specId) || 0;\n        color = Array.isArray(spec.color) ? spec.color[counter % spec.color.length] : spec.color(ds);\n        counters.set(specId, counter + 1);\n      }\n    }\n\n    if (color) {\n      updatedCustomSeriesColors.set(seriesKey, color);\n    }\n  });\n  return updatedCustomSeriesColors;\n}\n\n/**\n * Compute data domains for all specified specs.\n * @internal\n */\nexport function computeSeriesDomains(\n  seriesSpecs: BasicSeriesSpec[],\n  scaleConfigs: ScaleConfigs,\n  annotations: AnnotationSpec[],\n  settingsSpec: Pick<SettingsSpec, 'orderOrdinalBinsBy' | 'locale'>,\n  deselectedDataSeries: SeriesIdentifier[] = [],\n  smallMultiples?: SmallMultiplesGroupBy,\n): SeriesDomainsAndData {\n  const { orderOrdinalBinsBy, locale } = settingsSpec;\n  const { dataSeries, xValues, fallbackScale, smHValues, smVValues } = getDataSeriesFromSpecs(\n    seriesSpecs,\n    deselectedDataSeries,\n    orderOrdinalBinsBy,\n    smallMultiples,\n  );\n  // compute the x domain merging any custom domain\n  const xDomain = mergeXDomain(scaleConfigs.x, xValues, locale, fallbackScale);\n\n  // fill series with missing x values\n  const filledDataSeries = fillSeries(dataSeries, xValues, xDomain.type);\n\n  const seriesSortFn = getRenderingCompareFn((a: SeriesIdentifier, b: SeriesIdentifier) => {\n    return defaultXYSeriesSort(a as DataSeries, b as DataSeries);\n  });\n\n  const formattedDataSeries = getFormattedDataSeries(seriesSpecs, filledDataSeries, xValues, xDomain.type).sort(\n    seriesSortFn,\n  );\n  const annotationYValueMap = getAnnotationYValueMap(annotations, scaleConfigs.y);\n\n  // let's compute the yDomains after computing all stacked values\n  const yDomains = mergeYDomain(scaleConfigs.y, formattedDataSeries, annotationYValueMap);\n\n  // sort small multiples values\n  const horizontalPredicate = smallMultiples?.horizontal?.sort ?? Predicate.DataIndex;\n  const smHDomain = [...smHValues].sort(getPredicateFn(horizontalPredicate, locale));\n\n  const verticalPredicate = smallMultiples?.vertical?.sort ?? Predicate.DataIndex;\n  const smVDomain = [...smVValues].sort(getPredicateFn(verticalPredicate, locale));\n\n  return {\n    xDomain,\n    yDomains,\n    smHDomain,\n    smVDomain,\n    formattedDataSeries,\n  };\n}\n\nfunction getAnnotationYValueMap(\n  annotations: AnnotationSpec[],\n  yScaleConfig: ScaleConfigs['y'],\n): Map<GroupId, number[]> {\n  return annotations.reduce((acc, spec) => {\n    const { includeDataFromIds = [] } = yScaleConfig[spec.groupId]?.customDomain ?? {};\n    if (!includeDataFromIds.includes(spec.id)) return acc.set(spec.groupId, []);\n    const yValues: number[] = isLineAnnotation(spec)\n      ? spec.domainType === AnnotationDomainType.YDomain\n        ? spec.dataValues.map(({ dataValue }) => dataValue)\n        : []\n      : spec.dataValues.flatMap(({ coordinates: { y0, y1 } }) => [y0, y1]);\n    const groupValues = acc.get(spec.groupId) ?? [];\n    return acc.set(spec.groupId, [...groupValues, ...yValues.filter(isFiniteNumber)]);\n  }, new Map<GroupId, number[]>());\n}\n\n/** @internal */\nexport function computeSeriesGeometries(\n  seriesSpecs: BasicSeriesSpec[],\n  { xDomain, yDomains, formattedDataSeries: nonFilteredDataSeries }: SeriesDomainsAndData,\n  seriesColorMap: Map<SeriesKey, Color>,\n  chartTheme: Theme,\n  { rotation: chartRotation }: Pick<SettingsSpec, 'rotation'>,\n  axesSpecs: AxisSpec[],\n  smallMultiplesScales: SmallMultipleScales,\n  enableHistogramMode: boolean,\n  fallbackTickFormatter: TickFormatter,\n  measureText: TextMeasure,\n): ComputedGeometries {\n  const chartColors: ColorConfig = chartTheme.colors;\n  const formattedDataSeries = nonFilteredDataSeries.filter(({ isFiltered }) => !isFiltered);\n  const barDataSeries = formattedDataSeries.filter(({ spec }) => isBarSeriesSpec(spec));\n  // compute max bar in cluster per panel\n  const dataSeriesGroupedByPanel = groupBy(\n    barDataSeries,\n    ['smVerticalAccessorValue', 'smHorizontalAccessorValue'],\n    false,\n  );\n\n  const barIndexByPanel = Object.keys(dataSeriesGroupedByPanel).reduce<Record<string, string[]>>((acc, panelKey) => {\n    const panelBars = dataSeriesGroupedByPanel[panelKey] ?? [];\n    const barDataSeriesByBarIndex = groupBy(panelBars, getBarIndexKey, false);\n    acc[panelKey] = Object.keys(barDataSeriesByBarIndex);\n    return acc;\n  }, {});\n\n  const { horizontal, vertical } = smallMultiplesScales;\n\n  const yScales = computeYScales({\n    yDomains,\n    range: [isHorizontalRotation(chartRotation) ? vertical.bandwidth : horizontal.bandwidth, 0],\n  });\n\n  const computedGeoms = renderGeometries(\n    formattedDataSeries,\n    xDomain,\n    yScales,\n    vertical,\n    horizontal,\n    barIndexByPanel,\n    seriesSpecs,\n    seriesColorMap,\n    chartColors.defaultVizColor,\n    axesSpecs,\n    chartTheme,\n    enableHistogramMode,\n    chartRotation,\n    fallbackTickFormatter,\n    measureText,\n  );\n\n  const totalBarsInCluster = Object.values(barIndexByPanel).reduce((acc, curr) => Math.max(acc, curr.length), 0);\n\n  const xScale = computeXScale({\n    xDomain,\n    totalBarsInCluster,\n    range: [0, isHorizontalRotation(chartRotation) ? horizontal.bandwidth : vertical.bandwidth],\n    barsPadding: enableHistogramMode ? chartTheme.scales.histogramPadding : chartTheme.scales.barsPadding,\n    enableHistogramMode,\n  });\n\n  return { scales: { xScale, yScales }, ...computedGeoms };\n}\n\n/** @internal */\nexport function setBarSeriesAccessors(isHistogramMode: boolean, seriesSpecs: Map<SpecId, BasicSeriesSpec>): void {\n  if (isHistogramMode) {\n    for (const [, spec] of seriesSpecs) {\n      if (isBarSeriesSpec(spec))\n        spec.stackAccessors = [...(spec.stackAccessors || spec.yAccessors), ...(spec.splitSeriesAccessors || [])];\n    }\n  }\n}\n\n/** @internal */\nexport function isHistogramModeEnabled(seriesSpecs: BasicSeriesSpec[]): boolean {\n  return seriesSpecs.some((spec) => isBarSeriesSpec(spec) && spec.enableHistogramMode);\n}\n\n/** @internal */\nexport function computeXScaleOffset(\n  xScale: ScaleBand | ScaleContinuous,\n  enableHistogramMode: boolean,\n  histogramModeAlignment: HistogramModeAlignment = HistogramModeAlignments.Start,\n): number {\n  if (!enableHistogramMode) {\n    return 0;\n  }\n\n  const { bandwidth, barsPadding } = xScale;\n  const band = bandwidth / (1 - barsPadding);\n  const halfPadding = (band - bandwidth) / 2;\n\n  const startAlignmentOffset = bandwidth / 2 + halfPadding;\n\n  switch (histogramModeAlignment) {\n    case HistogramModeAlignments.Center:\n      return 0;\n    case HistogramModeAlignments.End:\n      return -startAlignmentOffset;\n    default:\n      return startAlignmentOffset;\n  }\n}\n\nfunction renderGeometries(\n  dataSeries: DataSeries[],\n  xDomain: XDomain,\n  yScales: Map<GroupId, ScaleContinuous>,\n  smVScale: ScaleBand,\n  smHScale: ScaleBand,\n  barIndexOrderPerPanel: Record<string, string[]>,\n  seriesSpecs: BasicSeriesSpec[],\n  seriesColorsMap: Map<SeriesKey, Color>,\n  defaultColor: string,\n  axesSpecs: AxisSpec[],\n  chartTheme: Theme,\n  enableHistogramMode: boolean,\n  chartRotation: Rotation,\n  fallBackTickFormatter: TickFormatter,\n  measureText: TextMeasure,\n): Omit<ComputedGeometries, 'scales'> {\n  const points: PointGeometry[] = [];\n  const bars: Array<PerPanel<BarGeometry[]>> = [];\n  const areas: Array<PerPanel<AreaGeometry>> = [];\n  const lines: Array<PerPanel<LineGeometry>> = [];\n  const bubbles: Array<PerPanel<BubbleGeometry>> = [];\n  const geometriesIndex = new IndexedGeometryMap();\n  const isMixedChart = isUniqueArray(seriesSpecs, ({ seriesType }) => seriesType) && seriesSpecs.length > 1;\n  const geometriesCounts: GeometriesCounts = {\n    points: 0,\n    bars: 0,\n    areas: 0,\n    areasPoints: 0,\n    lines: 0,\n    linePoints: 0,\n    bubbles: 0,\n    bubblePoints: 0,\n  };\n  const barsPadding = enableHistogramMode ? chartTheme.scales.histogramPadding : chartTheme.scales.barsPadding;\n\n  dataSeries.forEach((ds) => {\n    const spec = getSpecsById<BasicSeriesSpec>(seriesSpecs, ds.specId);\n    if (spec === undefined) {\n      return;\n    }\n    // compute the y scale\n    const yScale = yScales.get(getSpecDomainGroupId(ds.spec));\n    if (!yScale) {\n      return;\n    }\n    // compute the panel unique key\n    const barPanelKey = [ds.smVerticalAccessorValue, ds.smHorizontalAccessorValue].join('|');\n    const barIndexOrder = barIndexOrderPerPanel[barPanelKey] ?? [];\n    // compute x scale\n    const xScale = computeXScale({\n      xDomain,\n      totalBarsInCluster: barIndexOrder?.length ?? 0,\n      range: [0, isHorizontalRotation(chartRotation) ? smHScale.bandwidth : smVScale.bandwidth],\n      barsPadding,\n      enableHistogramMode,\n    });\n\n    const { stackMode } = ds;\n\n    const leftPos = (!isNil(ds.smHorizontalAccessorValue) && smHScale.scale(ds.smHorizontalAccessorValue)) || 0;\n    const topPos = (!isNil(ds.smVerticalAccessorValue) && smVScale.scale(ds.smVerticalAccessorValue)) || 0;\n    const panel: Dimensions = {\n      width: smHScale.bandwidth,\n      height: smVScale.bandwidth,\n      top: topPos,\n      left: leftPos,\n    };\n    const dataSeriesKey = getSeriesKey(\n      {\n        specId: ds.specId,\n        yAccessor: ds.yAccessor,\n        splitAccessors: ds.splitAccessors,\n      },\n      ds.groupId,\n    );\n\n    const color = seriesColorsMap.get(dataSeriesKey) || defaultColor;\n\n    if (isBarSeriesSpec(spec)) {\n      const shift = barIndexOrder.indexOf(getBarIndexKey(ds));\n\n      if (shift === -1) return; // skip bar dataSeries if index is not available\n\n      const barSeriesStyle = mergePartial(chartTheme.barSeriesStyle, spec.barSeriesStyle);\n      const { yAxis } = getAxesSpecForSpecId(axesSpecs, spec.groupId, chartRotation);\n      const valueFormatter = yAxis?.tickFormat ?? fallBackTickFormatter;\n\n      const displayValueSettings = spec.displayValueSettings\n        ? { valueFormatter, ...spec.displayValueSettings }\n        : undefined;\n\n      const renderedBars = renderBars(\n        measureText,\n        shift,\n        ds,\n        xScale,\n        yScale,\n        panel,\n        chartRotation,\n        spec.minBarHeight ?? 0,\n        color,\n        barSeriesStyle,\n        displayValueSettings,\n        spec.styleAccessor,\n        stackMode,\n      );\n      geometriesIndex.merge(renderedBars.indexedGeometryMap);\n      bars.push({ panel, value: renderedBars.barGeometries });\n      geometriesCounts.bars += renderedBars.barGeometries.length;\n    } else if (isBubbleSeriesSpec(spec)) {\n      const bubbleShift = barIndexOrder && barIndexOrder.length > 0 ? barIndexOrder.length : 1;\n      const bubbleSeriesStyle = spec.bubbleSeriesStyle\n        ? mergePartial(chartTheme.bubbleSeriesStyle, spec.bubbleSeriesStyle)\n        : chartTheme.bubbleSeriesStyle;\n      const xScaleOffset = computeXScaleOffset(xScale, enableHistogramMode);\n      const renderedBubbles = renderBubble(\n        (xScale.bandwidth * bubbleShift) / 2,\n        ds,\n        xScale,\n        yScale,\n        color,\n        panel,\n        isBandedSpec(spec),\n        xScaleOffset,\n        bubbleSeriesStyle,\n        {\n          enabled: spec.markSizeAccessor !== undefined,\n          ratio: chartTheme.markSizeRatio,\n        },\n        isMixedChart,\n        spec.pointStyleAccessor,\n      );\n      geometriesIndex.merge(renderedBubbles.indexedGeometryMap);\n      bubbles.push({\n        panel,\n        value: renderedBubbles.bubbleGeometry,\n      });\n      geometriesCounts.bubblePoints += renderedBubbles.bubbleGeometry.points.length;\n      geometriesCounts.bubbles += 1;\n    } else if (isLineSeriesSpec(spec)) {\n      const lineShift = barIndexOrder && barIndexOrder.length > 0 ? barIndexOrder.length : 1;\n      const lineSeriesStyle = getLineSeriesStyles(chartTheme.lineSeriesStyle, spec.lineSeriesStyle);\n      const xScaleOffset = computeXScaleOffset(xScale, enableHistogramMode, spec.histogramModeAlignment);\n\n      const renderedLines = renderLine(\n        // move the point on half of the bandwidth if we have mixed bars/lines\n        (xScale.bandwidth * lineShift) / 2,\n        ds,\n        xScale,\n        yScale,\n        panel,\n        color,\n        spec.curve || CurveType.LINEAR,\n        isBandedSpec(spec),\n        xScaleOffset,\n        lineSeriesStyle,\n        {\n          enabled: spec.markSizeAccessor !== undefined && lineSeriesStyle.point.visible,\n          ratio: chartTheme.markSizeRatio,\n        },\n        hasFitFnConfigured(spec.fit),\n        spec.pointStyleAccessor,\n      );\n\n      geometriesIndex.merge(renderedLines.indexedGeometryMap);\n      lines.push({\n        panel,\n        value: renderedLines.lineGeometry,\n      });\n      geometriesCounts.linePoints += renderedLines.lineGeometry.points.length;\n      geometriesCounts.lines += 1;\n    } else if (isAreaSeriesSpec(spec)) {\n      const areaShift = barIndexOrder && barIndexOrder.length > 0 ? barIndexOrder.length : 1;\n      const areaSeriesStyle = getAreaSeriesStyles(chartTheme.areaSeriesStyle, spec.areaSeriesStyle);\n      const xScaleOffset = computeXScaleOffset(xScale, enableHistogramMode, spec.histogramModeAlignment);\n      const renderedAreas = renderArea(\n        // move the point on half of the bandwidth if we have mixed bars/lines\n        (xScale.bandwidth * areaShift) / 2,\n        ds,\n        xScale,\n        yScale,\n        panel,\n        color,\n        spec.curve || CurveType.LINEAR,\n        isBandedSpec(spec),\n        xScaleOffset,\n        areaSeriesStyle,\n        {\n          enabled: spec.markSizeAccessor !== undefined && areaSeriesStyle.point.visible,\n          ratio: chartTheme.markSizeRatio,\n        },\n        spec.stackAccessors ? spec.stackAccessors.length > 0 : false,\n        hasFitFnConfigured(spec.fit),\n        spec.pointStyleAccessor,\n      );\n      geometriesIndex.merge(renderedAreas.indexedGeometryMap);\n      areas.push({\n        panel,\n        value: renderedAreas.areaGeometry,\n      });\n      geometriesCounts.areasPoints += renderedAreas.areaGeometry.points.length;\n      geometriesCounts.areas += 1;\n    }\n  });\n\n  return {\n    geometries: {\n      points,\n      bars,\n      areas,\n      lines,\n      bubbles,\n    },\n    geometriesIndex,\n    geometriesCounts,\n  };\n}\n\n/** @internal */\nexport function computeChartTransform({ width, height }: Size, chartRotation: Rotation): Transform {\n  return {\n    x: chartRotation === 90 || chartRotation === 180 ? width : 0,\n    y: chartRotation === -90 || chartRotation === 180 ? height : 0,\n    rotate: chartRotation,\n  };\n}\n\nfunction hasFitFnConfigured(fit?: Fit | FitConfig) {\n  return Boolean(fit && ((fit as FitConfig).type || fit) !== Fit.None);\n}\n\n/** @internal */\nexport function getBarIndexKey({ spec, specId, groupId, yAccessor, splitAccessors }: DataSeries): string {\n  if (isStackedSpec(spec)) {\n    return [groupId, '__stacked__'].join('__-__');\n  }\n\n  return [groupId, specId, ...splitAccessors.values(), yAccessor].join('__-__');\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendItemExtraValues } from '../../../common/legend';\nimport { SeriesKey } from '../../../common/series_id';\nimport { TooltipValue } from '../../../specs';\nimport { PointerValue } from '../../../state/types';\nimport { getAccessorFormatLabel } from '../../../utils/accessor';\nimport { isDefined } from '../../../utils/common';\nimport { BandedAccessorType, IndexedGeometry } from '../../../utils/geometry';\nimport { defaultTickFormatter } from '../utils/axis_utils';\nimport { getSeriesName } from '../utils/series';\nimport { AxisSpec, BasicSeriesSpec, isAreaSeriesSpec, isBarSeriesSpec, TickFormatterOptions } from '../utils/specs';\n\n/** @internal */\nexport const Y0_ACCESSOR_POSTFIX = ' - lower';\n/** @internal */\nexport const Y1_ACCESSOR_POSTFIX = ' - upper';\n\n/** @internal */\nexport function getLegendItemExtraValues(tooltipValues: TooltipValue[]): Map<SeriesKey, LegendItemExtraValues> {\n  const seriesTooltipValues = new Map<SeriesKey, LegendItemExtraValues>();\n\n  tooltipValues.forEach(({ formattedValue, value, seriesIdentifier, valueAccessor }) => {\n    const current: LegendItemExtraValues = seriesTooltipValues.get(seriesIdentifier.key) ?? new Map();\n    if (valueAccessor === BandedAccessorType.Y0 || valueAccessor === BandedAccessorType.Y1) {\n      current.set(valueAccessor, { formatted: formattedValue, raw: value });\n    }\n    seriesTooltipValues.set(seriesIdentifier.key, current);\n  });\n  return seriesTooltipValues;\n}\n\n/** @internal */\nexport function formatTooltipValue(\n  { color, value: { y, mark, accessor, datum }, seriesIdentifier }: IndexedGeometry,\n  spec: BasicSeriesSpec,\n  isHighlighted: boolean,\n  hasSingleSeries: boolean,\n  isBanded: boolean,\n  axisSpec?: AxisSpec,\n): TooltipValue {\n  let label = getSeriesName(seriesIdentifier, hasSingleSeries, true, spec);\n\n  if (isBanded && (isAreaSeriesSpec(spec) || isBarSeriesSpec(spec))) {\n    const { y0AccessorFormat = Y0_ACCESSOR_POSTFIX, y1AccessorFormat = Y1_ACCESSOR_POSTFIX } = spec;\n    const formatter = accessor === BandedAccessorType.Y0 ? y0AccessorFormat : y1AccessorFormat;\n    label = getAccessorFormatLabel(formatter, label);\n  }\n  const isVisible = label.length > 0 && (!spec.filterSeriesInTooltip || spec.filterSeriesInTooltip(seriesIdentifier));\n  const markValue = mark === null || Number.isNaN(mark) ? null : mark;\n  const tickFormatOptions: TickFormatterOptions | undefined = spec.timeZone ? { timeZone: spec.timeZone } : undefined;\n  const tickFormatter = spec.tickFormat ?? axisSpec?.tickFormat ?? defaultTickFormatter;\n\n  return {\n    seriesIdentifier,\n    valueAccessor: accessor,\n    label,\n    value: y,\n    formattedValue: tickFormatter(y, tickFormatOptions),\n    markValue,\n    ...(isDefined(markValue) && {\n      formattedMarkValue: spec.markFormat\n        ? spec.markFormat(markValue, tickFormatOptions)\n        : defaultTickFormatter(markValue),\n    }),\n    color,\n    isHighlighted,\n    isVisible,\n    datum,\n  };\n}\n\n/** @internal */\nexport function formatTooltipHeader(\n  { value: { x } }: IndexedGeometry,\n  spec: BasicSeriesSpec,\n  axisSpec?: AxisSpec,\n): PointerValue {\n  const tickFormatOptions: TickFormatterOptions | undefined = spec.timeZone ? { timeZone: spec.timeZone } : undefined;\n  const tickFormatter = axisSpec?.tickFormat ?? defaultTickFormatter;\n\n  return {\n    value: x,\n    formattedValue: tickFormatter(x, tickFormatOptions),\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Position } from '../../../utils/common';\n\n/** @internal */\nexport function isVerticalAxis(axisPosition: Position): axisPosition is Extract<Position, 'left' | 'right'> {\n  return axisPosition === Position.Left || axisPosition === Position.Right;\n}\n\n/** @internal */\nexport function isHorizontalAxis(axisPosition: Position): axisPosition is Extract<Position, 'top' | 'bottom'> {\n  return axisPosition === Position.Top || axisPosition === Position.Bottom;\n}\n\n/** @internal */\nexport function isVerticalGrid(axisPosition: Position) {\n  return isHorizontalAxis(axisPosition);\n}\n\n/** @internal */\nexport function isHorizontalGrid(axisPosition: Position) {\n  return isVerticalAxis(axisPosition);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isHorizontalAxis, isVerticalAxis } from './axis_type_utils';\nimport { computeXScale, computeYScales } from './scales';\nimport { SmallMultipleScales, hasSMDomain, getPanelSize } from '../../../common/panel_utils';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { AxisSpec, SettingsSpec } from '../../../specs';\nimport {\n  degToRad,\n  getPercentageValue,\n  HorizontalAlignment,\n  Position,\n  Rotation,\n  VerticalAlignment,\n} from '../../../utils/common';\nimport { Dimensions, innerPad, outerPad, PerSideDistance, Size } from '../../../utils/dimensions';\nimport { Range } from '../../../utils/domain';\nimport { AxisId } from '../../../utils/ids';\nimport { Point } from '../../../utils/point';\nimport { AxisStyle, TextAlignment, TextOffset, Theme } from '../../../utils/themes/theme';\nimport { Projection } from '../state/selectors/visible_ticks';\nimport { SeriesDomainsAndData } from '../state/utils/types';\n\ntype TickValue = number | string;\n\n/** @internal */\nexport type TextDirection = 'rtl' | 'ltr';\n\n/** @internal */\nexport interface AxisTick {\n  value: TickValue;\n  domainClampedValue: TickValue;\n  label: string;\n  position: number;\n  domainClampedPosition: number;\n  layer?: number;\n  detailedLayer: number;\n  showGrid: boolean;\n  direction: TextDirection;\n}\n\n/** @internal */\nexport interface TickLabelBounds {\n  maxLabelBboxWidth: number;\n  maxLabelBboxHeight: number;\n  maxLabelTextWidth: number;\n  maxLabelTextHeight: number;\n  isHidden: boolean;\n}\n\ninterface TickLabelProps {\n  x: number;\n  y: number;\n  offsetX: number;\n  offsetY: number;\n  textOffsetX: number;\n  textOffsetY: number;\n  horizontalAlign: Extract<\n    HorizontalAlignment,\n    typeof HorizontalAlignment.Left | typeof HorizontalAlignment.Center | typeof HorizontalAlignment.Right\n  >;\n  verticalAlign: Extract<\n    VerticalAlignment,\n    typeof VerticalAlignment.Top | typeof VerticalAlignment.Middle | typeof VerticalAlignment.Bottom\n  >;\n}\n\n/** @internal */\nexport const defaultTickFormatter = (tick: unknown) => `${tick}`;\n\n/** @internal */\nexport function isXDomain(position: Position, chartRotation: Rotation): boolean {\n  return isHorizontalAxis(position) === (chartRotation % 180 === 0);\n}\n\n/** @internal */\nexport function getScaleForAxisSpec(\n  { xDomain, yDomains }: Pick<SeriesDomainsAndData, 'xDomain' | 'yDomains'>,\n  { rotation: chartRotation }: Pick<SettingsSpec, 'rotation'>,\n  totalBarsInCluster: number,\n  barsPadding?: number,\n  enableHistogramMode?: boolean,\n) {\n  return (\n    {\n      groupId,\n      integersOnly,\n      maximumFractionDigits: mfd,\n      position,\n    }: Pick<AxisSpec, 'groupId' | 'integersOnly' | 'maximumFractionDigits' | 'position'>,\n    range: Range,\n  ): ScaleContinuous | ScaleBand | null => {\n    // TODO: remove this fallback when integersOnly is removed\n    const maximumFractionDigits = mfd ?? (integersOnly ? 0 : undefined);\n\n    return isXDomain(position, chartRotation)\n      ? computeXScale({ xDomain, totalBarsInCluster, range, barsPadding, enableHistogramMode, maximumFractionDigits })\n      : computeYScales({ yDomains, range, maximumFractionDigits }).get(groupId) ?? null;\n  };\n}\n\n/** @internal */\nexport function computeRotatedLabelDimensions(unrotatedDims: Size, degreesRotation: number): Size {\n  const { width, height } = unrotatedDims;\n  const radians = degToRad(degreesRotation);\n  const rotatedHeight = Math.abs(width * Math.sin(radians)) + Math.abs(height * Math.cos(radians));\n  const rotatedWidth = Math.abs(width * Math.cos(radians)) + Math.abs(height * Math.sin(radians));\n  return { width: rotatedWidth, height: rotatedHeight };\n}\n\nfunction getUserTextOffsets(dimensions: TickLabelBounds, { x, y, reference }: TextOffset) {\n  return reference === 'global'\n    ? {\n        local: { x: 0, y: 0 },\n        global: {\n          x: getPercentageValue(x, dimensions.maxLabelBboxWidth, 0),\n          y: getPercentageValue(y, dimensions.maxLabelBboxHeight, 0),\n        },\n      }\n    : {\n        local: {\n          x: getPercentageValue(x, dimensions.maxLabelTextWidth, 0),\n          y: getPercentageValue(y, dimensions.maxLabelTextHeight, 0),\n        },\n        global: { x: 0, y: 0 },\n      };\n}\n\nconst horizontalOffsetMultiplier = {\n  [HorizontalAlignment.Left]: -1,\n  [HorizontalAlignment.Right]: 1,\n  [HorizontalAlignment.Center]: 0,\n};\n\nconst verticalOffsetMultiplier = {\n  [VerticalAlignment.Top]: -1,\n  [VerticalAlignment.Bottom]: 1,\n  [VerticalAlignment.Middle]: 0,\n};\n\nfunction getHorizontalAlign(\n  position: Position,\n  rotation: number,\n  alignment: HorizontalAlignment,\n): Exclude<HorizontalAlignment, typeof HorizontalAlignment.Far | typeof HorizontalAlignment.Near> {\n  if (\n    alignment === HorizontalAlignment.Center ||\n    alignment === HorizontalAlignment.Right ||\n    alignment === HorizontalAlignment.Left\n  ) {\n    return alignment;\n  }\n\n  if (Math.abs(rotation) === 90) {\n    if (position === Position.Top) {\n      return rotation === 90 ? HorizontalAlignment.Right : HorizontalAlignment.Left;\n    } else if (position === Position.Bottom) {\n      return rotation === -90 ? HorizontalAlignment.Right : HorizontalAlignment.Left;\n    }\n  } else {\n    if (position === Position.Left) {\n      return alignment === HorizontalAlignment.Near ? HorizontalAlignment.Right : HorizontalAlignment.Left;\n    } else if (position === Position.Right) {\n      return alignment === HorizontalAlignment.Near ? HorizontalAlignment.Left : HorizontalAlignment.Right;\n    }\n  }\n\n  return HorizontalAlignment.Center; // fallback for near/far on top/bottom axis\n}\n\nfunction getVerticalAlign(\n  position: Position,\n  rotation: number,\n  alignment: VerticalAlignment,\n): Exclude<VerticalAlignment, typeof VerticalAlignment.Far | typeof VerticalAlignment.Near> {\n  if (\n    alignment === VerticalAlignment.Middle ||\n    alignment === VerticalAlignment.Top ||\n    alignment === VerticalAlignment.Bottom\n  ) {\n    return alignment;\n  }\n\n  if (rotation % 180 === 0) {\n    if (position === Position.Left) {\n      return rotation === 0 ? VerticalAlignment.Bottom : VerticalAlignment.Top;\n    } else if (position === Position.Right) {\n      return rotation === 180 ? VerticalAlignment.Bottom : VerticalAlignment.Top;\n    }\n  } else {\n    if (position === Position.Top) {\n      return alignment === VerticalAlignment.Near ? VerticalAlignment.Bottom : VerticalAlignment.Top;\n    } else if (position === Position.Bottom) {\n      return alignment === VerticalAlignment.Near ? VerticalAlignment.Top : VerticalAlignment.Bottom;\n    }\n  }\n\n  return VerticalAlignment.Middle; // fallback for near/far on left/right axis\n}\n\n/** @internal */\nexport function getTickLabelPosition(\n  { tickLine, tickLabel }: AxisStyle,\n  tickPosition: number,\n  pos: Position,\n  rotation: number,\n  axisSize: Size,\n  tickDimensions: TickLabelBounds,\n  showTicks: boolean,\n  textOffset: TextOffset,\n  textAlignment: TextAlignment,\n): TickLabelProps {\n  const { maxLabelBboxWidth, maxLabelTextWidth, maxLabelBboxHeight, maxLabelTextHeight } = tickDimensions;\n  const tickDimension = showTicks ? tickLine.size + tickLine.padding : 0;\n  const labelInnerPadding = innerPad(tickLabel.padding);\n  const horizontalAlign = getHorizontalAlign(pos, rotation, textAlignment.horizontal);\n  const verticalAlign = getVerticalAlign(pos, rotation, textAlignment.vertical);\n  const userOffsets = getUserTextOffsets(tickDimensions, textOffset);\n  const paddedTickDimension = tickDimension + labelInnerPadding;\n  const axisNetSize = (isVerticalAxis(pos) ? axisSize.width : axisSize.height) - paddedTickDimension;\n  const labelBoxHalfGirth = isHorizontalAxis(pos) ? maxLabelBboxHeight / 2 : maxLabelBboxWidth / 2;\n  const labelHalfWidth = maxLabelTextWidth / 2;\n  return {\n    horizontalAlign,\n    verticalAlign,\n    x: pos === Position.Left ? axisNetSize : pos === Position.Right ? paddedTickDimension : tickPosition,\n    y: pos === Position.Top ? axisNetSize : pos === Position.Bottom ? paddedTickDimension : tickPosition,\n    offsetX: userOffsets.global.x + (isHorizontalAxis(pos) ? 0 : horizontalOffsetMultiplier[pos] * labelBoxHalfGirth),\n    offsetY: userOffsets.global.y + (isVerticalAxis(pos) ? 0 : verticalOffsetMultiplier[pos] * labelBoxHalfGirth),\n    textOffsetX:\n      userOffsets.local.x +\n      (isHorizontalAxis(pos) && rotation === 0 ? 0 : labelHalfWidth * horizontalOffsetMultiplier[horizontalAlign]),\n    textOffsetY: userOffsets.local.y + (maxLabelTextHeight / 2) * verticalOffsetMultiplier[verticalAlign],\n  };\n}\n\n/** @internal */\nexport function getTitleDimension({\n  visible,\n  fontSize,\n  padding,\n}: AxisStyle['axisTitle'] | AxisStyle['axisPanelTitle']): number {\n  return visible && fontSize > 0 ? innerPad(padding) + fontSize + outerPad(padding) : 0;\n}\n\n/** @internal */\nexport const getAllAxisLayersGirth = (\n  timeAxisLayerCount: number,\n  maxLabelBoxGirth: number,\n  axisHorizontal: boolean,\n) => {\n  const axisLayerCount = timeAxisLayerCount > 0 && axisHorizontal ? timeAxisLayerCount : 1;\n  return axisLayerCount * maxLabelBoxGirth;\n};\n\n/** @internal */\nexport function getPosition(\n  { chartDimensions }: { chartDimensions: Dimensions },\n  chartMargins: PerSideDistance,\n  { axisTitle, axisPanelTitle, tickLine, tickLabel }: AxisStyle,\n  { title, position, hide, timeAxisLayerCount }: AxisSpec,\n  { maxLabelBboxHeight, maxLabelBboxWidth }: TickLabelBounds,\n  smScales: SmallMultipleScales,\n  { top: cumTopSum, bottom: cumBottomSum, left: cumLeftSum, right: cumRightSum }: PerSideDistance,\n) {\n  const tickDimension = shouldShowTicks(tickLine, hide) ? tickLine.size + tickLine.padding : 0;\n  const labelPaddingSum = tickLabel.visible ? innerPad(tickLabel.padding) + outerPad(tickLabel.padding) : 0;\n  const titleDimension = title ? getTitleDimension(axisTitle) : 0;\n  const vertical = isVerticalAxis(position);\n  const scaleBand = vertical ? smScales.vertical : smScales.horizontal;\n  const panelTitleDimension = hasSMDomain(scaleBand) ? getTitleDimension(axisPanelTitle) : 0;\n  const maxLabelBboxGirth = tickLabel.visible ? (vertical ? maxLabelBboxWidth : maxLabelBboxHeight) : 0;\n  const shownLabelSize = getAllAxisLayersGirth(timeAxisLayerCount, maxLabelBboxGirth, !vertical);\n  const parallelSize = labelPaddingSum + shownLabelSize + tickDimension + titleDimension + panelTitleDimension;\n  return {\n    leftIncrement: position === Position.Left ? parallelSize + chartMargins.left : 0,\n    rightIncrement: position === Position.Right ? parallelSize + chartMargins.right : 0,\n    topIncrement: position === Position.Top ? parallelSize + chartMargins.top : 0,\n    bottomIncrement: position === Position.Bottom ? parallelSize + chartMargins.bottom : 0,\n    dimensions: {\n      left:\n        position === Position.Left\n          ? chartMargins.left + cumLeftSum\n          : chartDimensions.left + (position === Position.Right ? chartDimensions.width + cumRightSum : 0),\n      top:\n        position === Position.Top\n          ? chartMargins.top + cumTopSum\n          : chartDimensions.top + (position === Position.Bottom ? chartDimensions.height + cumBottomSum : 0),\n      width: vertical ? parallelSize : chartDimensions.width,\n      height: vertical ? chartDimensions.height : parallelSize,\n    },\n  };\n}\n\n/** @internal */\nexport function shouldShowTicks({ visible }: AxisStyle['tickLine'], axisHidden: boolean): boolean {\n  return !axisHidden && visible;\n}\n\n/** @internal */\nexport interface AxisGeometry {\n  anchorPoint: Point;\n  size: Size;\n  parentSize: Size;\n  axis: {\n    id: AxisId;\n    position: Position;\n    panelTitle?: string; // defined later per panel\n    secondary?: boolean; // defined later per panel\n  };\n  dimension: TickLabelBounds;\n  visibleTicks: AxisTick[];\n}\n\n/** @internal */\nexport function getAxesGeometries(\n  chartDims: { chartDimensions: Dimensions; leftMargin: number },\n  { chartPaddings, chartMargins, axes: sharedAxesStyle }: Theme,\n  axisSpecs: Map<AxisId, AxisSpec>,\n  axesStyles: Map<AxisId, AxisStyle | null>,\n  smScales: SmallMultipleScales,\n  visibleTicksSet: Map<AxisId, Projection>,\n): AxisGeometry[] {\n  const panel = getPanelSize(smScales);\n  return [...visibleTicksSet].reduce(\n    (acc: PerSideDistance & { geoms: AxisGeometry[] }, [axisId, { ticks, labelBox }]: [AxisId, Projection]) => {\n      const axisSpec = axisSpecs.get(axisId);\n      if (axisSpec) {\n        const vertical = isVerticalAxis(axisSpec.position);\n        const axisStyle = axesStyles.get(axisId) ?? sharedAxesStyle;\n        const { dimensions, topIncrement, bottomIncrement, leftIncrement, rightIncrement } = getPosition(\n          chartDims,\n          chartMargins,\n          axisStyle,\n          axisSpec,\n          labelBox,\n          smScales,\n          acc,\n        );\n        acc.top += topIncrement;\n        acc.bottom += bottomIncrement;\n        acc.left += leftIncrement;\n        acc.right += rightIncrement;\n        acc.geoms.push({\n          axis: { id: axisSpec.id, position: axisSpec.position },\n          anchorPoint: { x: dimensions.left, y: dimensions.top },\n          dimension: labelBox,\n          visibleTicks: ticks,\n          parentSize: { height: dimensions.height, width: dimensions.width },\n          size: {\n            width: labelBox.isHidden ? 0 : vertical ? dimensions.width : panel.width,\n            height: labelBox.isHidden ? 0 : vertical ? panel.height : dimensions.height,\n          },\n        });\n      } else {\n        throw new Error(`Cannot compute scale for axis spec ${axisId}`); // todo move this feedback as upstream as possible\n      }\n      return acc;\n    },\n    { geoms: [], top: 0, bottom: chartPaddings.bottom, left: chartDims.leftMargin, right: chartPaddings.right },\n  ).geoms;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DataSeries } from './series';\n\n/**\n * Return the default sorting used for XY series.\n * Ordered by group insert order, then first stacked, after non stacked.\n * @internal\n */\nexport function defaultXYSeriesSort(a: DataSeries, b: DataSeries) {\n  if (a.groupId !== b.groupId) {\n    return a.insertIndex - b.insertIndex;\n  }\n\n  if (a.isStacked && !b.isStacked) {\n    return -1; // a first then b\n  }\n  if (!a.isStacked && b.isStacked) {\n    return 1; // b first then a\n  }\n  return a.insertIndex - b.insertIndex;\n}\n\n/**\n * Return the default sorting used for XY series.\n * Ordered by group insert order, then first stacked, after non stacked.\n * Stacked series are sorted by their insert order\n * @internal\n */\nexport function defaultXYLegendSeriesSort(a?: DataSeries, b?: DataSeries) {\n  if (!a || !b) return 0;\n  if (a.groupId !== b.groupId) {\n    return a.insertIndex - b.insertIndex;\n  }\n\n  if (a.isStacked && !b.isStacked) {\n    return -1; // a first then b\n  }\n  if (!a.isStacked && b.isStacked) {\n    return 1; // b first then a\n  }\n  return a.insertIndex - b.insertIndex;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisSpec } from './specs';\nimport { SmallMultiplesSpec } from '../../../specs';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { AxisId } from '../../../utils/ids';\nimport { Theme, AxisStyle } from '../../../utils/themes/theme';\nimport { getAxesDimensions } from '../axes/axes_sizes';\nimport { AxesTicksDimensions } from '../state/selectors/compute_axis_ticks_dimensions';\n\n/**\n * @internal\n */\nexport interface ChartDimensions {\n  /**\n   * Dimensions relative to canvas element\n   */\n  chartDimensions: Dimensions;\n  /**\n   * Margin to account for ending text overflow\n   */\n  leftMargin: number;\n} /**/\n\n/**\n * Compute the chart dimensions. It's computed removing from the parent dimensions\n * the axis spaces, the legend and any other specified style margin and padding.\n * @internal\n */ export function computeChartDimensions(\n  parentDimensions: Dimensions,\n  theme: Theme,\n  axisTickDimensions: AxesTicksDimensions,\n  axesStyles: Map<AxisId, AxisStyle | null>,\n  axisSpecs: AxisSpec[],\n  smSpec: SmallMultiplesSpec | null,\n): ChartDimensions {\n  const axesDimensions = getAxesDimensions(theme, axisTickDimensions, axesStyles, axisSpecs, smSpec);\n  const chartWidth = parentDimensions.width - axesDimensions.left - axesDimensions.right;\n  const chartHeight = parentDimensions.height - axesDimensions.top - axesDimensions.bottom;\n  const pad = theme.chartPaddings;\n  return {\n    leftMargin: axesDimensions.margin.left,\n    chartDimensions: {\n      top: axesDimensions.top + pad.top,\n      left: axesDimensions.left + pad.left,\n      width: Math.max(0, chartWidth - pad.left - pad.right),\n      height: Math.max(0, chartHeight - pad.top - pad.bottom),\n    },\n  };\n}\n","/* eslint-disable header/header, no-param-reassign */\n\n/**\n * @notice\n * This product includes code that is adapted from d3-shape@3.0.1,\n * which is available under a \"ISC\" license.\n *\n * ISC License\n *\n * Copyright 2010-2021 Mike Bostock\n * Permission to use, copy, modify, and/or distribute this software for any purpose\n * with or without fee is hereby granted, provided that the above copyright notice\n * and this permission notice appear in all copies.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\n * REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND\n * FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\n * INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS\n * OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER\n * TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF\n * THIS SOFTWARE.\n */\n\nimport { Series, SeriesPoint } from 'd3-shape';\n\nimport { DataSeriesDatum } from './series';\nimport { SeriesKey } from '../../../common/series_id';\n\ntype XValue = string | number;\ntype SeriesValueMap = Map<SeriesKey, DataSeriesDatum>;\n\n/** @internal */\nexport type XValueMap = Map<XValue, SeriesValueMap>;\n/** @internal */\nexport type XValueSeriesDatum = [XValue, SeriesValueMap];\n\n/**\n * Computes required wiggle offset for each x value __WITHOUT__ mutations\n */\nfunction getWiggleOffsets<K = string>(series: Series<XValueSeriesDatum, K>, order: number[]): number[] {\n  const offsets = [];\n  let y, j;\n  for (y = 0, j = 1; j < (series[order[0] ?? 0]?.length ?? 0); ++j) {\n    let i, s1, s2;\n    for (i = 0, s1 = 0, s2 = 0; i < series.length; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const si = series[order[i]] as SeriesPoint<XValueSeriesDatum>[];\n      const sij0 = si[j]?.[1] || 0;\n      const sij1 = si[j - 1]?.[1] || 0;\n      let s3 = (sij0 - sij1) / 2;\n\n      for (let k = 0; k < i; ++k) {\n        // @ts-ignore - d3-shape type here is inaccurate\n        const sk = series[order[k]] as SeriesPoint<XValueSeriesDatum>[];\n        const skj0 = sk[j]?.[1] || 0;\n        const skj1 = sk[j - 1]?.[1] || 0;\n        s3 += skj0 - skj1;\n      }\n      s1 += sij0;\n      s2 += s3 * sij0;\n    }\n\n    offsets.push(y);\n    if (s1) y -= s2 / s1;\n  }\n  offsets.push(y);\n  return offsets;\n}\n\n/** @internal */\nconst divergingOffset = (isSilhouette = false) => {\n  return function <K = 'string'>(series: Series<XValueSeriesDatum, K>, order: number[]): void {\n    const n = series.length;\n    if (!(n > 0)) return;\n    for (let i, j = 0, sumYn, sumYp, yp, yn = 0, s0 = series[order[0] ?? 0], m = s0?.length ?? 0; j < m; ++j) {\n      // sum negative values per x before to maintain original sort for negative values\n      for (yn = 0, sumYn = 0, sumYp = 0, i = 0; i < n; ++i) {\n        // @ts-ignore - d3-shape type here is inaccurate\n        const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n        const dy = d[1] - d[0];\n        if (dy < 0) {\n          sumYn += Math.abs(d[1]) || 0;\n          yn += dy;\n        } else {\n          sumYp += d[1] || 0;\n        }\n      }\n\n      const silhouetteOffset = sumYp / 2 - sumYn / 2;\n      const offset = isSilhouette ? -silhouetteOffset : 0;\n      yn += offset;\n\n      for (yp = offset, i = 0; i < n; ++i) {\n        // @ts-ignore - d3-shape type here is inaccurate\n        const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n        const dy = d[1] - d[0];\n        if (dy >= 0) {\n          d[0] = yp;\n          d[1] = yp += dy;\n        } else {\n          d[1] = yn;\n          d[0] = yn -= dy;\n        }\n      }\n    }\n  };\n};\n\n/**\n * Stacked offset function with diverging polarity offset\n * @internal\n */\nexport const diverging = divergingOffset();\n/**\n * Stacked Silhouette offset function with diverging polarity offset\n * @internal\n */\nexport const divergingSilhouette = divergingOffset(true);\n\n/**\n * Stacked Wiggle offset function to account for diverging offset\n * @internal\n */\nexport function divergingWiggle<K = 'string'>(series: Series<XValueSeriesDatum, K>, order: number[]): void {\n  const n = series.length;\n  const s0 = series[order[0] ?? 0];\n  const m = s0?.length ?? 0;\n  if (!(n > 0) || !(m > 0)) return diverging(series, order);\n\n  const offsets = getWiggleOffsets(series, order);\n\n  for (let i, j = 0, sumYn, yp, yn = 0; j < m; ++j) {\n    // sum negative values per x before to maintain original sort for negative values\n    for (i = 0, yn = 0, sumYn = 0; i < n; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n      if (d[1] - d[0] < 0) {\n        sumYn += Math.abs(d[1]) || 0;\n      }\n    }\n\n    const offset = offsets[j] ?? 0;\n    yn += offset;\n\n    for (yp = offset + sumYn, yn = offset, i = 0; i < n; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n      const dy = d[1] - d[0];\n      if (dy >= 0) {\n        d[0] = yp;\n        d[1] = yp += dy;\n      } else {\n        d[1] = yn;\n        d[0] = yn -= dy;\n      }\n    }\n  }\n}\n\n/**\n * Stacked Percentage offset function with diverging polarity offset\n * Treats percentage as participation for mixed polarity data\n * @internal\n */\nexport function divergingPercentage<K = 'string'>(series: Series<XValueSeriesDatum, K>, order: number[]): void {\n  const n = series.length;\n  if (!(n > 0)) return;\n  for (let i, j = 0, sumYn, sumYp; j < (series[0]?.length ?? 0); ++j) {\n    for (sumYn = sumYp = i = 0; i < n; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n      if (d[1] - d[0] < 0) {\n        sumYn += Math.abs(d[1]) || 0;\n      } else {\n        sumYp += d[1] || 0;\n      }\n    }\n\n    const sumY = sumYn + sumYp;\n    if (sumY === 0) continue; // must not return, else loop will stop\n\n    let yp = sumYn / sumY;\n    let yn = 0;\n\n    for (i = 0; i < n; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n      const dy = d[1] - d[0];\n      const participation = Math.abs(dy / sumY);\n\n      if (dy >= 0) {\n        d[0] = yp;\n        d[1] = yp += participation;\n      } else {\n        d[0] = yn;\n        d[1] = yn += participation;\n      }\n    }\n  }\n}\n\n/* eslint-enable header/header, no-param-reassign */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DataSeries } from './series';\nimport { BasicSeriesSpec, isLineSeriesSpec, isAreaSeriesSpec } from './specs';\nimport { ScaleType } from '../../../scales/constants';\n\n/**\n * @internal\n */\nexport function fillSeries(\n  dataSeries: DataSeries[],\n  xValues: Set<string | number>,\n  groupScaleType: ScaleType,\n): DataSeries[] {\n  const sortedXValues = [...xValues.values()];\n  return dataSeries.map((series) => {\n    const { spec, data, isStacked } = series;\n\n    const noFillRequired = isXFillNotRequired(spec, groupScaleType, isStacked);\n    if (data.length === xValues.size || noFillRequired) {\n      return {\n        ...series,\n        data,\n      };\n    }\n    const filledData: typeof data = [];\n    const missingValues = new Set(xValues);\n\n    data.forEach((datum) => {\n      filledData.push(datum);\n      missingValues.delete(datum.x);\n    });\n\n    const missingValuesArray = [...missingValues.values()];\n\n    missingValuesArray.forEach((missingValue) => {\n      const index = sortedXValues.indexOf(missingValue);\n\n      filledData.splice(index, 0, {\n        x: missingValue,\n        y1: null,\n        y0: null,\n        initialY1: null,\n        initialY0: null,\n        mark: null,\n        datum: undefined,\n        filled: {\n          x: missingValue,\n        },\n      });\n    });\n\n    return {\n      ...series,\n      data: filledData,\n    };\n  });\n}\n\nfunction isXFillNotRequired(spec: BasicSeriesSpec, groupScaleType: ScaleType, isStacked: boolean) {\n  const onlyNoFitAreaLine = (isAreaSeriesSpec(spec) || isLineSeriesSpec(spec)) && !spec.fit;\n  const onlyContinuous =\n    groupScaleType === ScaleType.Linear ||\n    groupScaleType === ScaleType.LinearBinary ||\n    groupScaleType === ScaleType.Time;\n  return onlyNoFitAreaLine && onlyContinuous && !isStacked;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DeepNonNullable } from 'utility-types';\n\nimport { DataSeriesDatum } from './series';\nimport { Fit, FitConfig } from './specs';\nimport { datumXSortPredicate } from './stacked_series_utils';\nimport { ScaleType } from '../../../scales/constants';\nimport { isNil } from '../../../utils/common';\n\n/**\n * Fit type that requires previous and/or next `non-nullable` values\n *\n */\ntype BoundingFit = Exclude<Fit, 'none' | 'explicit'>;\n\n/**\n * `DataSeriesDatum` with non-`null` value for `x` and `y1`\n * @internal\n */\nexport type FullDataSeriesDatum = Omit<DataSeriesDatum, 'y1' | 'x'> &\n  DeepNonNullable<Pick<DataSeriesDatum, 'y1' | 'x'>>;\n\n/**\n * Embellishes `FullDataSeriesDatum` with `fittingIndex` for ordinal scales\n * @internal\n */\nexport type WithIndex<T> = T & { fittingIndex: number };\n\n/**\n * Returns `[x, y1]` values for a given datum with `fittingIndex`\n *\n */\nconst getXYValues = ({ x, y1, fittingIndex }: WithIndex<FullDataSeriesDatum>): [number, number] => [\n  typeof x === 'string' ? fittingIndex : x,\n  y1,\n];\n\n/** @internal */\nexport const getValue = (\n  current: DataSeriesDatum,\n  currentIndex: number,\n  previous: WithIndex<FullDataSeriesDatum> | null,\n  next: WithIndex<FullDataSeriesDatum> | null,\n  type: BoundingFit,\n  endValue?: number | 'nearest',\n): DataSeriesDatum => {\n  if (previous !== null && type === Fit.Carry) {\n    const { y1 } = previous;\n    return {\n      ...current,\n      y1,\n      filled: {\n        ...current.filled,\n        y1,\n      },\n    };\n  }\n  if (next !== null && type === Fit.Lookahead) {\n    const { y1 } = next;\n    return {\n      ...current,\n      y1,\n      filled: {\n        ...current.filled,\n        y1,\n      },\n    };\n  }\n  if (previous !== null && next !== null) {\n    if (type === Fit.Average) {\n      const y1 = (previous.y1 + next.y1) / 2;\n      return {\n        ...current,\n        y1,\n        filled: {\n          ...current.filled,\n          y1,\n        },\n      };\n    }\n    if (current.x !== null && previous.x !== null && next.x !== null) {\n      const [x1, y1] = getXYValues(previous);\n      const [x2, y2] = getXYValues(next);\n      const currentX = typeof current.x === 'string' ? currentIndex : current.x;\n\n      if (type === Fit.Nearest) {\n        const x1Delta = Math.abs(currentX - x1);\n        const x2Delta = Math.abs(currentX - x2);\n        const y1Delta = x1Delta > x2Delta ? y2 : y1;\n        return {\n          ...current,\n          y1: y1Delta,\n          filled: {\n            ...current.filled,\n            y1: y1Delta,\n          },\n        };\n      }\n      if (type === Fit.Linear) {\n        // simple linear interpolation function\n        const linearInterpolatedY1 = previous.y1 + (currentX - x1) * ((y2 - y1) / (x2 - x1));\n        return {\n          ...current,\n          y1: linearInterpolatedY1,\n          filled: {\n            ...current.filled,\n            y1: linearInterpolatedY1,\n          },\n        };\n      }\n    }\n  } else if ((previous !== null || next !== null) && (type === Fit.Nearest || endValue === 'nearest')) {\n    const nearestY1 = previous !== null ? previous.y1 : next!.y1;\n    return {\n      ...current,\n      y1: nearestY1,\n      filled: {\n        ...current.filled,\n        y1: nearestY1,\n      },\n    };\n  }\n\n  if (endValue === undefined || typeof endValue === 'string') {\n    return current;\n  }\n\n  // No matching fit - should only fall here on end conditions\n  return {\n    ...current,\n    y1: endValue,\n    filled: {\n      ...current.filled,\n      y1: endValue,\n    },\n  };\n};\n\n/** @internal */\nexport const parseConfig = (config?: Exclude<Fit, 'explicit'> | FitConfig): FitConfig => {\n  if (!config) {\n    return {\n      type: Fit.None,\n    };\n  }\n\n  if (typeof config === 'string') {\n    return {\n      type: config,\n    };\n  }\n\n  if (config.type === Fit.Explicit && config.value === undefined) {\n    // Using explicit fit function requires a value\n    return {\n      type: Fit.None,\n    };\n  }\n\n  return {\n    type: config.type,\n    value: config.type === Fit.Explicit ? config.value : undefined,\n    endValue: config.endValue,\n  };\n};\n\n/** @internal */\nexport const fitFunction = (\n  data: DataSeriesDatum[],\n  fitConfig: Exclude<Fit, 'explicit'> | FitConfig,\n  xScaleType: ScaleType,\n  sorted = false,\n): DataSeriesDatum[] => {\n  const { type, value, endValue } = parseConfig(fitConfig);\n\n  if (type === Fit.None) {\n    return data;\n  }\n\n  if (type === Fit.Zero) {\n    return data.map((datum) => ({\n      ...datum,\n      y1: datum.y1 === null ? 0 : datum.y1,\n      filled: {\n        ...datum.filled,\n        y1: datum.y1 === null ? 0 : undefined,\n      },\n    }));\n  }\n\n  if (type === Fit.Explicit) {\n    if (value === undefined) {\n      return data;\n    }\n\n    return data.map((datum) => ({\n      ...datum,\n      y1: datum.y1 === null ? value : datum.y1,\n      filled: {\n        ...datum.filled,\n        y1: datum.y1 === null ? value : undefined,\n      },\n    }));\n  }\n\n  const sortedData =\n    sorted || xScaleType === ScaleType.Ordinal ? data : data.slice().sort(datumXSortPredicate(xScaleType));\n  const newData: DataSeriesDatum[] = [];\n  let previousNonNullDatum: WithIndex<FullDataSeriesDatum> | null = null;\n  let nextNonNullDatum: WithIndex<FullDataSeriesDatum> | null = null;\n\n  sortedData.forEach((currentValue, i) => {\n    let j = i;\n\n    if (\n      currentValue.y1 === null &&\n      nextNonNullDatum === null &&\n      (type === Fit.Lookahead ||\n        type === Fit.Nearest ||\n        type === Fit.Average ||\n        type === Fit.Linear ||\n        endValue === 'nearest')\n    ) {\n      // Forward lookahead to get next non-null value\n      for (j = i + 1; j < sortedData.length; j++) {\n        const nextValue = sortedData[j];\n        if (isNil(nextValue)) continue;\n\n        if (nextValue.y1 !== null && nextValue.x !== null) {\n          nextNonNullDatum = {\n            ...(nextValue as FullDataSeriesDatum),\n            fittingIndex: j,\n          };\n          break;\n        }\n      }\n    }\n\n    const newValue =\n      currentValue.y1 === null\n        ? getValue(currentValue, i, previousNonNullDatum, nextNonNullDatum, type, endValue)\n        : currentValue;\n\n    newData[i] = newValue;\n\n    if (currentValue.y1 !== null && currentValue.x !== null) {\n      previousNonNullDatum = {\n        ...(currentValue as FullDataSeriesDatum),\n        fittingIndex: i,\n      };\n    }\n\n    if (nextNonNullDatum !== null && nextNonNullDatum.x <= currentValue.x) {\n      nextNonNullDatum = null;\n    }\n  });\n\n  return newData;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { fitFunction } from './fit_function';\nimport { DataSeries } from './series';\nimport { isAreaSeriesSpec, isLineSeriesSpec, SeriesSpecs, BasicSeriesSpec } from './specs';\nimport { ScaleType } from '../../../scales/constants';\nimport { getSpecsById } from '../state/utils/spec';\n\n/** @internal */\nexport const applyFitFunctionToDataSeries = (\n  dataSeries: DataSeries[],\n  seriesSpecs: SeriesSpecs,\n  xScaleType: ScaleType,\n): DataSeries[] => {\n  return dataSeries.map(({ specId, data, ...rest }) => {\n    const spec = getSpecsById<BasicSeriesSpec>(seriesSpecs, specId);\n\n    if (\n      spec !== null &&\n      spec !== undefined &&\n      (isAreaSeriesSpec(spec) || isLineSeriesSpec(spec)) &&\n      spec.fit !== undefined\n    ) {\n      const fittedData = fitFunction(data, spec.fit, xScaleType);\n\n      return {\n        specId,\n        ...rest,\n        data: fittedData,\n      };\n    }\n    return { specId, data, ...rest };\n  });\n};\n","/* eslint-disable header/header, no-param-reassign */\n\n/**\n * @notice\n * This product includes code that is adapted from d3-array@3.0.4 and d3-scale@4.0.2,\n * which are both available under a \"ISC\" license.\n *\n * ISC License\n *\n * Copyright 2010-2021 Mike Bostock\n * Permission to use, copy, modify, and/or distribute this software for any purpose\n * with or without fee is hereby granted, provided that the above copyright notice\n * and this permission notice appear in all copies.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\n * REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND\n * FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\n * INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS\n * OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER\n * TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF\n * THIS SOFTWARE.\n */\n\nimport { ScaleContinuousNumeric } from 'd3-scale';\n\nimport { isNil } from '../../../utils/common';\nimport { PrimitiveValue } from '../../partition_chart/layout/utils/group_by_rollup';\n\nconst e10 = Math.sqrt(50);\nconst e5 = Math.sqrt(10);\nconst e2 = Math.sqrt(2);\n\n/** @internal */\nexport function getLinearTicks(start: number, stop: number, count: number, base: number = 2): number[] {\n  let reverse,\n    i = -1,\n    n,\n    ticks,\n    step;\n\n  stop = +stop;\n  start = +start;\n  count = +count;\n  if (start === stop && count > 0) return [start];\n  if ((reverse = stop < start)) {\n    n = start;\n    start = stop;\n    stop = n;\n  }\n  if ((step = tickIncrement(start, stop, count, base)) === 0 || !isFinite(step)) return [];\n\n  if (step > 0) {\n    let r0 = Math.round(start / step),\n      r1 = Math.round(stop / step);\n    if (r0 * step < start) ++r0;\n    if (r1 * step > stop) --r1;\n    ticks = new Array((n = r1 - r0 + 1));\n    while (++i < n) ticks[i] = (r0 + i) * step;\n  } else {\n    step = -step;\n    let r0 = Math.round(start * step),\n      r1 = Math.round(stop * step);\n    if (r0 / step < start) ++r0;\n    if (r1 / step > stop) --r1;\n    ticks = new Array((n = r1 - r0 + 1));\n    while (++i < n) ticks[i] = (r0 + i) / step;\n  }\n\n  if (reverse) ticks.reverse();\n\n  return ticks;\n}\n\nfunction tickIncrement(start: number, stop: number, count: number, base: number = 10) {\n  const step = (stop - start) / Math.max(0, count);\n  const power = Math.floor(Math.log(step) / Math.log(base) + Number.EPSILON);\n  const error = step / Math.pow(base, power);\n  return power >= 0\n    ? (error >= e10 ? 10 : error >= e5 ? 5 : error >= e2 ? 2 : 1) * Math.pow(base, power)\n    : -Math.pow(base, -power) / (error >= e10 ? 10 : error >= e5 ? 5 : error >= e2 ? 2 : 1);\n}\n\n/** @internal */\nexport function getNiceLinearTicks(\n  scale: ScaleContinuousNumeric<PrimitiveValue, number>,\n  count: number = 10,\n  base = 10,\n) {\n  const d = scale.domain();\n  let i0 = 0;\n  let i1 = d.length - 1;\n  let start = d[i0];\n  let stop = d[i1];\n  let prestep;\n  let step;\n  let maxIter = 10;\n\n  if (isNil(stop) || isNil(start)) {\n    return scale;\n  }\n\n  if (stop < start) {\n    step = start;\n    start = stop;\n    stop = step;\n\n    step = i0;\n    i0 = i1;\n    i1 = step;\n  }\n\n  while (maxIter-- > 0) {\n    step = tickIncrement(start, stop, count, base);\n    if (step === prestep) {\n      d[i0] = start;\n      d[i1] = stop;\n      return scale.domain(d);\n    } else if (step > 0) {\n      start = Math.floor(start / step) * step;\n      stop = Math.ceil(stop / step) * step;\n    } else if (step < 0) {\n      start = Math.ceil(start * step) / step;\n      stop = Math.floor(stop * step) / step;\n    } else {\n      break;\n    }\n    prestep = step;\n  }\n\n  return scale;\n}\n\n/* eslint-enable header/header, no-param-reassign */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isVerticalAxis } from './axis_type_utils';\nimport { AxisGeometry, AxisTick } from './axis_utils';\nimport { AxisSpec } from './specs';\nimport { colorToRgba, overrideOpacity } from '../../../common/color_library_wrappers';\nimport { SmallMultipleScales, getPanelSize, getPerPanelMap } from '../../../common/panel_utils';\nimport { Line, Stroke } from '../../../geoms/types';\nimport { mergePartial, RecursivePartial } from '../../../utils/common';\nimport { Size } from '../../../utils/dimensions';\nimport { AxisId } from '../../../utils/ids';\nimport { Point } from '../../../utils/point';\nimport { AxisStyle, Theme } from '../../../utils/themes/theme';\nimport { MIN_STROKE_WIDTH } from '../renderer/canvas/primitives/line';\n\n/** @internal */\nexport const HIERARCHICAL_GRID_WIDTH = 1; // constant 1 scales well and solves some render issues due to fixed 1px wide overpaints\n/** @internal */\nexport const OUTSIDE_RANGE_TOLERANCE = 0.01; // can protrude from the scale range by a max of 0.1px, to allow for FP imprecision\n/** @internal */\nexport const HIDE_MINOR_TIME_GRID = false; // experimental: retain ticks but don't show grid lines for minor raster\n\n/** @internal */\nexport interface GridLineGroup {\n  lines: Array<Line>;\n  stroke: Stroke;\n  axisId: AxisId;\n}\n\n/** @internal */\nexport type LinesGrid = {\n  panelAnchor: Point;\n  lineGroups: Array<GridLineGroup>;\n};\n\n/** @internal */\nexport function getGridLines(\n  axesSpecs: Array<AxisSpec>,\n  axesGeoms: Array<AxisGeometry>,\n  { axes: themeAxisStyle }: Pick<Theme, 'axes'>,\n  scales: SmallMultipleScales,\n): Array<LinesGrid> {\n  const panelSize = getPanelSize(scales);\n  return getPerPanelMap(scales, () => {\n    // get grids per panel (depends on all the axis that exist)\n    const lines = axesGeoms.reduce<Array<GridLineGroup>>((linesAcc, { axis, visibleTicks }) => {\n      const axisSpec = axesSpecs.find(({ id }) => id === axis.id);\n      if (!axisSpec) {\n        return linesAcc;\n      }\n      const linesForSpec = getGridLinesForAxis(axisSpec, visibleTicks, themeAxisStyle, panelSize);\n      return linesForSpec.length === 0 ? linesAcc : [...linesAcc, ...linesForSpec];\n    }, []);\n    return { lineGroups: lines };\n  });\n}\n\nfunction getGridLinesForAxis(\n  axisSpec: AxisSpec,\n  visibleTicks: AxisTick[],\n  themeAxisStyle: AxisStyle,\n  panelSize: Size,\n): GridLineGroup[] {\n  // vertical ==> horizontal grid lines\n  const isVertical = isVerticalAxis(axisSpec.position);\n\n  // merge the axis configured style with the theme style\n  const axisStyle = mergePartial(themeAxisStyle, axisSpec.style as RecursivePartial<AxisStyle>);\n  const gridLineThemeStyle = isVertical ? axisStyle.gridLine.vertical : axisStyle.gridLine.horizontal;\n\n  // axis can have a configured grid line style\n  const gridLineStyles = axisSpec.gridLine ? mergePartial(gridLineThemeStyle, axisSpec.gridLine) : gridLineThemeStyle;\n\n  if (!gridLineStyles.visible) {\n    return [];\n  }\n\n  // define the stroke for the specific set of grid lines\n  if (!gridLineStyles.stroke || !gridLineStyles.strokeWidth || gridLineStyles.strokeWidth < MIN_STROKE_WIDTH) {\n    return [];\n  }\n\n  const visibleTicksPerLayer = visibleTicks.reduce((acc: Map<number, AxisTick[]>, tick) => {\n    if (Math.abs(tick.position - tick.domainClampedPosition) > OUTSIDE_RANGE_TOLERANCE) return acc; // no gridline for ticks outside the domain\n    if (typeof tick.layer === 'number' && !tick.showGrid) return acc; // no gridline for ticks outside the domain\n    if (HIDE_MINOR_TIME_GRID && typeof tick.layer === 'number' && tick.detailedLayer === 0) return acc; // no gridline for ticks outside the domain\n    const ticks = acc.get(tick.detailedLayer);\n    if (ticks) {\n      ticks.push(tick);\n    } else {\n      acc.set(tick.detailedLayer, [tick]);\n    }\n    return acc;\n  }, new Map());\n\n  return [...visibleTicksPerLayer]\n    .sort(([k1], [k2]) => (k1 ?? 0) - (k2 ?? 0)) // increasing layer order\n    .map(([detailedLayer, visibleTicksOfLayer]) => {\n      const lines = visibleTicksOfLayer.map<Line>((tick: AxisTick) =>\n        isVertical\n          ? getGridLineForVerticalAxisAt(tick.position, panelSize)\n          : getGridLineForHorizontalAxisAt(tick.position, panelSize),\n      );\n      const strokeColor = overrideOpacity(colorToRgba(gridLineStyles.stroke), (strokeColorOpacity) =>\n        gridLineStyles.opacity !== undefined ? strokeColorOpacity * gridLineStyles.opacity : strokeColorOpacity,\n      );\n      const layered = typeof visibleTicksOfLayer[0]?.layer === 'number';\n\n      const multilayerLuma = themeAxisStyle.gridLine.lumaSteps[detailedLayer] ?? NaN;\n      const stroke: Stroke = {\n        color: layered ? [multilayerLuma, multilayerLuma, multilayerLuma, 1] : strokeColor,\n        width: layered ? HIERARCHICAL_GRID_WIDTH : gridLineStyles.strokeWidth,\n        dash: gridLineStyles.dash,\n      };\n      return { lines, stroke, axisId: axisSpec.id };\n    });\n}\n\n/**\n * Get a horizontal grid line at `tickPosition`\n * used for vertical axis specs\n * @param tickPosition the position of the tick\n * @param panelSize the size of the target panel\n * @internal\n */\nexport function getGridLineForVerticalAxisAt(tickPosition: number, panelSize: Size): Line {\n  return { x1: 0, y1: tickPosition, x2: panelSize.width, y2: tickPosition };\n}\n\n/**\n * Get a vertical grid line at `tickPosition`\n * used for horizontal axis specs\n * @param tickPosition the position of the tick\n * @param panelSize the size of the target panel\n * @internal\n */\nexport function getGridLineForHorizontalAxisAt(tickPosition: number, panelSize: Size): Line {\n  return { x1: tickPosition, y1: 0, x2: tickPosition, y2: panelSize.height };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\ntype Group<T> = Record<string, T[]>;\n\n/** @public */\nexport type GroupByKeyFn<T> = (data: T) => string;\n\n/** @public */\nexport type GroupKeysOrKeyFn<T> = Array<keyof T> | GroupByKeyFn<T>;\n\n/** @internal */\nexport function groupBy<T>(data: T[], keysOrKeyFn: GroupKeysOrKeyFn<T>, asArray: false): Group<T>;\n/** @internal */\nexport function groupBy<T>(data: T[], keysOrKeyFn: GroupKeysOrKeyFn<T>, asArray: true): T[][];\n/** @internal */\nexport function groupBy<T>(data: T[], keysOrKeyFn: GroupKeysOrKeyFn<T>, asArray: boolean): T[][] | Group<T> {\n  const keyFn = Array.isArray(keysOrKeyFn) ? getUniqueKey(keysOrKeyFn) : keysOrKeyFn;\n  const grouped = data.reduce<Group<T>>((acc, curr) => {\n    const key = keyFn(curr);\n    if (!acc[key]) {\n      acc[key] = [];\n    }\n    acc[key]!.push(curr);\n    return acc;\n  }, {});\n  return asArray ? Object.values(grouped) : grouped;\n}\n\n/** @internal */\nexport function getUniqueKey<T>(keys: Array<keyof T>, concat = '|') {\n  return (data: T): string => {\n    return keys\n      .map((key) => {\n        return data[key];\n      })\n      .join(concat);\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { IndexedGeometry } from '../../../utils/geometry';\n\n/** @internal */\nexport class IndexedGeometryLinearMap {\n  private map = new Map<string | number, IndexedGeometry[]>();\n\n  get size() {\n    return this.map.size;\n  }\n\n  set(geometry: IndexedGeometry) {\n    const { x } = geometry.value;\n    const existing = this.map.get(x);\n    if (existing === undefined) {\n      this.map.set(x, [geometry]);\n    } else {\n      this.map.set(x, [geometry, ...existing]);\n    }\n  }\n\n  getMergeData() {\n    return [...this.map.values()];\n  }\n\n  keys(): Array<number | string> {\n    return [...this.map.keys()];\n  }\n\n  find(x: number | string | null): IndexedGeometry[] {\n    if (x === null) {\n      return [];\n    }\n\n    return this.map.get(x) ?? [];\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { IndexedGeometryLinearMap } from './indexed_geometry_linear_map';\nimport { IndexedGeometrySpatialMap } from './indexed_geometry_spatial_map';\nimport { MarkBuffer } from '../../../specs';\nimport { isNil } from '../../../utils/common';\nimport { Bounds } from '../../../utils/d3-delaunay';\nimport { IndexedGeometry, isPointGeometry } from '../../../utils/geometry';\nimport { Point } from '../../../utils/point';\nimport { PrimitiveValue } from '../../partition_chart/layout/utils/group_by_rollup';\n\n/** @internal */\nexport const GeometryType = Object.freeze({\n  linear: 'linear' as const,\n  spatial: 'spatial' as const,\n});\n/** @internal */\nexport type GeometryType = $Values<typeof GeometryType>;\n\n/** @internal */\nexport class IndexedGeometryMap {\n  private linearMap = new IndexedGeometryLinearMap();\n\n  private spatialMap = new IndexedGeometrySpatialMap();\n\n  /**\n   * Returns triangulation instance to render spatial grid\n   *\n   * @param bounds\n   */\n  triangulation(bounds?: Bounds) {\n    return this.spatialMap.triangulation(bounds);\n  }\n\n  keys(): Array<number | string> {\n    return [...this.linearMap.keys(), ...this.spatialMap.keys()];\n  }\n\n  get size(): number {\n    return this.linearMap.size + this.spatialMap.size;\n  }\n\n  set(geometry: IndexedGeometry, type: GeometryType = GeometryType.linear) {\n    if (type === GeometryType.spatial && isPointGeometry(geometry)) {\n      // TODO: Add dev error here when attempting spatial upset with non-point\n      this.spatialMap.set([geometry]);\n    } else {\n      this.linearMap.set(geometry);\n    }\n  }\n\n  find(\n    x: number | string | null,\n    pointBuffer: MarkBuffer,\n    point?: Point,\n    smHorizontalValue?: PrimitiveValue,\n    smVerticalValue?: PrimitiveValue,\n  ): IndexedGeometry[] {\n    if (x === null && !point) {\n      return [];\n    }\n\n    const spatialValues = point === undefined ? [] : this.spatialMap.find(point, pointBuffer);\n    return [...this.linearMap.find(x), ...spatialValues].filter(\n      ({ seriesIdentifier: { smHorizontalAccessorValue, smVerticalAccessorValue } }) =>\n        (isNil(smVerticalValue) || smVerticalAccessorValue === smVerticalValue) &&\n        (isNil(smHorizontalValue) || smHorizontalAccessorValue === smHorizontalValue),\n    );\n  }\n\n  getMergeData() {\n    return {\n      spatialGeometries: this.spatialMap.getMergeData(),\n      linearGeometries: this.linearMap.getMergeData(),\n    };\n  }\n\n  /**\n   * Merge multiple indexedMaps into base indexedMaps\n   * @param indexedMaps\n   */\n  merge(...indexedMaps: IndexedGeometryMap[]) {\n    // eslint-disable-next-line no-restricted-syntax\n    for (const indexedMap of indexedMaps) {\n      const { spatialGeometries, linearGeometries } = indexedMap.getMergeData();\n      this.spatialMap.set(spatialGeometries);\n      linearGeometries.forEach((geometry) => {\n        if (Array.isArray(geometry)) {\n          geometry.forEach((geometry) => this.linearMap.set(geometry));\n        } else {\n          this.linearMap.set(geometry);\n        }\n      });\n    }\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { MarkBuffer } from '../../../specs';\nimport { getDistance, isFiniteNumber } from '../../../utils/common';\nimport { Delaunay, Bounds } from '../../../utils/d3-delaunay';\nimport { IndexedGeometry, PointGeometry } from '../../../utils/geometry';\nimport { Point } from '../../../utils/point';\n\n/** @internal */\nexport type IndexedGeometrySpatialMapPoint = [number, number];\n\n/** @internal */\nexport class IndexedGeometrySpatialMap {\n  private map: Delaunay<IndexedGeometrySpatialMapPoint> | null = null;\n\n  private points: IndexedGeometrySpatialMapPoint[] = [];\n\n  private pointGeometries: PointGeometry[] = [];\n\n  private searchStartIndex: number = 0;\n\n  private maxRadius = -Infinity;\n\n  constructor(points: PointGeometry[] = []) {\n    this.set(points);\n  }\n\n  get size() {\n    return this.points.length;\n  }\n\n  isSpatial() {\n    return this.pointGeometries.length > 0;\n  }\n\n  set(points: PointGeometry[]) {\n    this.maxRadius = Math.max(this.maxRadius, ...points.map(({ radius }) => radius));\n    const { pointGeometries } = this;\n    points.forEach((p) => {\n      if (isFiniteNumber(p.y)) pointGeometries.push(p);\n    });\n    this.points.push(\n      ...points.map<IndexedGeometrySpatialMapPoint>(({ x, y }) => {\n        // TODO: handle coincident points better\n        // This nonce is used to slightly offset every point such that each point\n        // has a unique position in the index. This number is only used in the index.\n        // The other option would be to find the point(s) near a Point and add logic\n        // to account for multiple values in the pointGeometries array. This would be\n        // a very computationally expensive approach having to repeat for every point.\n        const nonce = Math.random() * 0.000001;\n        return [x + nonce, y];\n      }),\n    );\n\n    if (this.points.length > 0) {\n      // TODO: handle write/read init\n      this.map = Delaunay.from(this.points);\n    }\n  }\n\n  triangulation(bounds?: Bounds) {\n    return this.map?.voronoi(bounds);\n  }\n\n  getMergeData() {\n    return [...this.pointGeometries];\n  }\n\n  keys(): Array<number> {\n    return this.pointGeometries.map(({ value: { x } }) => x);\n  }\n\n  find(point: Point, pointBuffer: MarkBuffer): IndexedGeometry[] {\n    const elements = [];\n    if (this.map !== null) {\n      const index = this.map.find(point.x, point.y, this.searchStartIndex);\n      const geometry = this.pointGeometries[index];\n\n      if (geometry) {\n        // Set next starting search index for faster lookup\n        this.searchStartIndex = index;\n        elements.push(geometry);\n        this.getRadialNeighbors(index, point, new Set([index]), pointBuffer).forEach((g) => elements.push(g));\n      }\n    }\n\n    return elements;\n  }\n\n  /**\n   * Gets surrounding points whose radius could be within the active cursor position\n   *\n   */\n  private getRadialNeighbors(\n    selectedIndex: number,\n    point: Point,\n    visitedIndices: Set<number>,\n    pointBuffer: MarkBuffer,\n  ): IndexedGeometry[] {\n    if (this.map === null) {\n      return [];\n    }\n\n    const neighbors = [...this.map.neighbors(selectedIndex)];\n    return neighbors.reduce<IndexedGeometry[]>((acc, i) => {\n      if (visitedIndices.has(i)) {\n        return acc;\n      }\n\n      visitedIndices.add(i);\n      const geometry = this.pointGeometries[i];\n\n      if (geometry) {\n        acc.push(geometry);\n        const radiusBuffer = typeof pointBuffer === 'number' ? pointBuffer : pointBuffer(geometry.radius);\n        if (getDistance(geometry, point) < Math.min(this.maxRadius, radiusBuffer)) {\n          // Gets neighbors based on relation to maxRadius\n          this.getRadialNeighbors(i, point, visitedIndices, pointBuffer).forEach((g) => acc.push(g));\n        }\n      }\n\n      return acc;\n    }, []);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Rotation } from '../../../utils/common';\nimport { Size } from '../../../utils/dimensions';\n\n/**\n * Get the cursor position depending on the chart rotation\n * @param xPos x position relative to chart\n * @param yPos y position relative to chart\n * @param chartRotation the chart rotation\n * @param chartDimension the chart dimension\n * @internal\n */\nexport function getOrientedXPosition(xPos: number, yPos: number, chartRotation: Rotation, chartDimension: Size) {\n  switch (chartRotation) {\n    case 180:\n      return chartDimension.width - xPos;\n    case 90:\n      return yPos;\n    case -90:\n      return chartDimension.height - yPos;\n    case 0:\n    default:\n      return xPos;\n  }\n}\n\n/** @internal */\nexport function getOrientedYPosition(xPos: number, yPos: number, chartRotation: Rotation, chartDimension: Size) {\n  switch (chartRotation) {\n    case 180:\n      return chartDimension.height - yPos;\n    case -90:\n      return xPos;\n    case 90:\n      return chartDimension.width - xPos;\n    case 0:\n    default:\n      return yPos;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { ScaleType } from '../../../scales/constants';\nimport { ContinuousDomain, Range } from '../../../utils/domain';\nimport { GroupId } from '../../../utils/ids';\nimport { XDomain, YDomain } from '../domains/types';\n\nfunction getBandScaleRange(\n  isInverse: boolean,\n  isSingleValueHistogram: boolean,\n  minRange: number,\n  maxRange: number,\n  bandwidth: number,\n): {\n  start: number;\n  end: number;\n} {\n  const rangeEndOffset = isSingleValueHistogram ? 0 : bandwidth;\n  const start = isInverse ? minRange - rangeEndOffset : minRange;\n  const end = isInverse ? maxRange : maxRange - rangeEndOffset;\n  return { start, end };\n}\n\ninterface XScaleOptions {\n  xDomain: XDomain;\n  totalBarsInCluster: number;\n  range: Range;\n  barsPadding?: number;\n  enableHistogramMode?: boolean;\n  maximumFractionDigits?: number;\n  logBase?: number;\n  logMinLimit?: number;\n}\n\n/**\n * Compute the x scale used to align geometries to the x axis.\n * @internal\n */\nexport function computeXScale(options: XScaleOptions): ScaleBand | ScaleContinuous {\n  const { xDomain, totalBarsInCluster, range, barsPadding, enableHistogramMode, maximumFractionDigits } = options;\n  const { type, nice, minInterval, domain, isBandScale, timeZone, logBase, desiredTickCount } = xDomain;\n  const rangeDiff = Math.abs(range[1] - range[0]);\n  const isInverse = range[1] < range[0];\n  if (type === ScaleType.Ordinal) {\n    const dividend = totalBarsInCluster > 0 ? totalBarsInCluster : 1;\n    const bandwidth = rangeDiff / (domain.length * dividend);\n    return new ScaleBand(domain, range, bandwidth, barsPadding);\n  }\n  if (isBandScale) {\n    const [domainMin, domainMax] = domain as ContinuousDomain;\n    const isSingleValueHistogram = !!enableHistogramMode && domainMax - domainMin === 0;\n    const adjustedDomain: [number, number] = [domainMin, isSingleValueHistogram ? domainMin + minInterval : domainMax];\n    const intervalCount = (adjustedDomain[1] - adjustedDomain[0]) / minInterval;\n    const intervalCountOffset = isSingleValueHistogram ? 0 : 1;\n    const bandwidth = rangeDiff / (intervalCount + intervalCountOffset);\n    const { start, end } = getBandScaleRange(isInverse, isSingleValueHistogram, range[0], range[1], bandwidth);\n    return new ScaleContinuous(\n      {\n        type,\n        domain: adjustedDomain,\n        range: [start, end],\n        nice,\n      },\n      {\n        bandwidth: totalBarsInCluster > 0 ? bandwidth / totalBarsInCluster : bandwidth,\n        minInterval,\n        timeZone,\n        totalBarsInCluster,\n        barsPadding,\n        desiredTickCount,\n        isSingleValueHistogram,\n        logBase,\n      },\n    );\n  } else {\n    return new ScaleContinuous(\n      { type, domain: domain as [number, number], range, nice },\n      {\n        bandwidth: 0,\n        minInterval,\n        timeZone,\n        totalBarsInCluster,\n        barsPadding,\n        desiredTickCount,\n        maximumFractionDigits,\n        logBase,\n      },\n    );\n  }\n}\n\ninterface YScaleOptions {\n  yDomains: YDomain[];\n  range: Range;\n  maximumFractionDigits?: number;\n}\n\n/**\n * Compute the y scales, one per groupId for the y axis.\n * @internal\n */\nexport function computeYScales(options: YScaleOptions): Map<GroupId, ScaleContinuous> {\n  const { yDomains, range, maximumFractionDigits } = options;\n  return yDomains.reduce(\n    (\n      yScales,\n      {\n        type,\n        nice,\n        desiredTickCount,\n        domain,\n        groupId,\n        logBase,\n        logMinLimit,\n        domainPixelPadding,\n        constrainDomainPadding,\n      },\n    ) => {\n      const yScale = new ScaleContinuous(\n        { type, domain, range, nice },\n        {\n          desiredTickCount,\n          maximumFractionDigits,\n          logBase,\n          logMinLimit,\n          domainPixelPadding,\n          constrainDomainPadding,\n        },\n      );\n      yScales.set(groupId, yScale);\n      return yScales;\n    },\n    new Map<GroupId, ScaleContinuous>(),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { applyFitFunctionToDataSeries } from './fit_function_utils';\nimport { groupBy } from './group_data_series';\nimport { BaseDatum, BasicSeriesSpec, SeriesNameConfigOptions, SeriesSpecs, SeriesType, StackMode } from './specs';\nimport { datumXSortPredicate, formatStackedDataSeriesValues } from './stacked_series_utils';\nimport { Color, Colors } from '../../../common/colors';\nimport { SmallMultiplesDatum, SmallMultiplesGroupBy } from '../../../common/panel_utils';\nimport { SeriesIdentifier, SeriesKey } from '../../../common/series_id';\nimport { ScaleType } from '../../../scales/constants';\nimport { BinAgg, Direction, XScaleType } from '../../../specs';\nimport { OrderBy } from '../../../specs/settings';\nimport { ColorOverrides } from '../../../state/chart_state';\nimport { Accessor, AccessorFn, getAccessorValue } from '../../../utils/accessor';\nimport { Datum, isNil, stripUndefined } from '../../../utils/common';\nimport { GroupId } from '../../../utils/ids';\nimport { Logger } from '../../../utils/logger';\nimport { ColorConfig } from '../../../utils/themes/theme';\nimport { groupSeriesByYGroup, isStackedSpec } from '../domains/y_domain';\nimport { X_SCALE_DEFAULT } from '../scales/scale_defaults';\n\n/** @internal */\nexport const SERIES_DELIMITER = ' - ';\n\n/** @public */\nexport interface FilledValues {\n  /** the x value */\n  x?: number | string;\n  /** the max y value */\n  y1?: number;\n  /** the minimum y value */\n  y0?: number;\n}\n\n/** @public */\nexport interface DataSeriesDatum<T = any> {\n  /** the x value */\n  x: number | string;\n  /** the max y value */\n  y1: number | null;\n  /** the minimum y value */\n  y0: number | null;\n  /** initial y1 value, non stacked */\n  initialY1: number | null;\n  /** initial y0 value, non stacked */\n  initialY0: number | null;\n  /** the optional mark metric, used for lines and area series */\n  mark: number | null;\n  /** initial datum */\n  datum: T;\n  /** the list of filled values because missing or nulls */\n  filled?: FilledValues;\n}\n\n/** @public */\nexport interface XYChartSeriesIdentifier<D extends BaseDatum = Datum> extends SeriesIdentifier, SmallMultiplesDatum {\n  xAccessor: Accessor<D>;\n  yAccessor: Accessor<D>;\n  splitAccessors: Map<string | number, string | number>; // does the map have a size vs making it optional\n  seriesKeys: (string | number)[];\n}\n\n/** @internal */\nexport type DataSeries<D extends BaseDatum = Datum> = XYChartSeriesIdentifier<D> & {\n  groupId: GroupId;\n  seriesType: SeriesType;\n  data: DataSeriesDatum[];\n  isStacked: boolean;\n  stackMode: StackMode | undefined;\n  spec: Exclude<BasicSeriesSpec, 'data'>;\n  insertIndex: number;\n  isFiltered: boolean;\n};\n\n/** @internal */\nexport type DataSeriesCounts = { [key in SeriesType]: number };\n\n/** @internal */\nexport function getSeriesIndex(series: SeriesIdentifier[], target: SeriesIdentifier): number {\n  if (!series) {\n    return -1;\n  }\n\n  return series.findIndex(({ key }) => target.key === key);\n}\n\n/**\n * Returns string form of accessor. Uses index when accessor is a function.\n * @internal\n */\nexport function getAccessorFieldName<D extends BaseDatum>(\n  accessor: Accessor<D> | AccessorFn<D>,\n  index: number,\n): Accessor<D> | string {\n  return typeof accessor === 'function' ? accessor.fieldName ?? `(index:${index})` : accessor;\n}\n\n/**\n * Split a dataset into multiple series depending on the accessors.\n * Each series is then associated with a key that belongs to its configuration.\n * This method removes every data with an invalid x: a string or number value is required\n * `y` values and `mark` values are casted to number or null.\n * @internal\n */\nexport function splitSeriesDataByAccessors(\n  spec: BasicSeriesSpec,\n  xValueSums: Map<string | number, number>,\n  isStacked = false,\n  isBanded = false,\n  stackMode?: StackMode,\n  groupBySpec?: SmallMultiplesGroupBy,\n): {\n  dataSeries: Map<SeriesKey, DataSeries>;\n  xValues: Array<string | number>;\n} {\n  const {\n    seriesType,\n    id: specId,\n    groupId,\n    data,\n    xAccessor,\n    yAccessors,\n    y0Accessors,\n    markSizeAccessor,\n    splitSeriesAccessors = [],\n  } = spec;\n  const dataSeries = new Map<SeriesKey, DataSeries>();\n  const xValues: Array<string | number> = [];\n  const nonNumericValues: any[] = [];\n\n  if (isStacked && Boolean(y0Accessors?.length)) {\n    Logger.warn(\n      `y0Accessors are not allowed with stackAccessors. y0Accessors will be ignored but available under initialY0.`,\n    );\n  }\n\n  for (let i = 0; i < data.length; i++) {\n    const datum = data[i];\n    const splitAccessors = getSplitAccessors(datum, splitSeriesAccessors);\n    // if splitSeriesAccessors are defined we should have at least one split value to include datum\n    if (splitSeriesAccessors.length > 0 && splitAccessors.size < 1) {\n      continue;\n    }\n\n    // skip if the datum is not an object or null\n    if (typeof datum !== 'object' || datum === null) {\n      continue;\n    }\n    const x = getAccessorValue(datum, xAccessor);\n    // skip if the x value is not a string or a number\n    if (typeof x !== 'string' && typeof x !== 'number') {\n      continue;\n    }\n\n    xValues.push(x);\n    let sum = xValueSums.get(x) ?? 0;\n\n    // extract small multiples aggregation values\n    const smH = groupBySpec?.horizontal?.by?.(spec, datum);\n    const smV = groupBySpec?.vertical?.by?.(spec, datum);\n\n    const xAccessorStr = getAccessorFieldName(xAccessor, 0);\n    yAccessors.forEach((accessor, index) => {\n      const cleanedDatum = extractYAndMarkFromDatum(\n        datum,\n        accessor,\n        nonNumericValues,\n        isBanded,\n        y0Accessors && y0Accessors[index],\n        markSizeAccessor,\n      );\n\n      const yAccessorStr = getAccessorFieldName(accessor, index);\n      const splitAccessorStrs = [...splitAccessors.values()].map((a, si) => getAccessorFieldName(a, si));\n      const seriesKeys = [...splitAccessorStrs, yAccessorStr];\n      const seriesIdentifier: Omit<XYChartSeriesIdentifier, 'key'> = stripUndefined({\n        specId,\n        seriesKeys,\n        xAccessor: xAccessorStr,\n        yAccessor: yAccessorStr,\n        splitAccessors,\n        smVerticalAccessorValue: smV,\n        smHorizontalAccessorValue: smH,\n      });\n      const seriesKey = getSeriesKey(seriesIdentifier, groupId);\n      sum += cleanedDatum.y1 ?? 0;\n      const newDatum = { x, ...cleanedDatum, smH, smV };\n      const series = dataSeries.get(seriesKey);\n      if (series) {\n        series.data.push(newDatum);\n      } else {\n        dataSeries.set(seriesKey, {\n          ...seriesIdentifier,\n          groupId,\n          seriesType,\n          stackMode,\n          isStacked,\n          seriesKeys,\n          key: seriesKey,\n          data: [newDatum],\n          spec,\n          // current default to 0, will be correctly computed on a later stage\n          insertIndex: 0,\n          isFiltered: false,\n        });\n      }\n\n      xValueSums.set(x, sum);\n    });\n  }\n\n  if (nonNumericValues.length > 0) {\n    Logger.warn(\n      `Found non-numeric y value${nonNumericValues.length > 1 ? 's' : ''} in dataset for spec \"${specId}\"`,\n      `(${nonNumericValues.map((v) => JSON.stringify(v)).join(', ')})`,\n    );\n  }\n  return {\n    dataSeries,\n    xValues,\n  };\n}\n\n/**\n * Gets global series key to id any series as a string\n * @internal\n */\nexport function getSeriesKey(\n  {\n    specId,\n    yAccessor,\n    splitAccessors,\n    smVerticalAccessorValue,\n    smHorizontalAccessorValue,\n  }: Pick<\n    XYChartSeriesIdentifier,\n    'specId' | 'yAccessor' | 'splitAccessors' | 'smVerticalAccessorValue' | 'smHorizontalAccessorValue'\n  >,\n  groupId: GroupId,\n): string {\n  const joinedAccessors = [...splitAccessors.entries()]\n    .sort(([a], [b]) => (a > b ? 1 : -1))\n    .map(([key, value]) => `${key}-${value}`)\n    .join('|');\n  const smV = smVerticalAccessorValue ? `smV{${smVerticalAccessorValue}}` : '';\n  const smH = smHorizontalAccessorValue ? `smH{${smHorizontalAccessorValue}}` : '';\n  return `groupId{${groupId}}spec{${specId}}yAccessor{${yAccessor}}splitAccessors{${joinedAccessors}}${smV}${smH}`;\n}\n\n/**\n * Get the array of values that forms a series key\n * @internal\n */\nfunction getSplitAccessors<D extends BaseDatum>(\n  datum: D,\n  accessors: (Accessor<D> | AccessorFn<D>)[] = [],\n): Map<string | number, string | number> {\n  const splitAccessors = new Map<string | number, string | number>();\n  if (typeof datum === 'object' && datum !== null) {\n    accessors.forEach((accessor, index) => {\n      const value = getAccessorValue(datum, accessor);\n      if (typeof value === 'string' || typeof value === 'number') {\n        const accessorStr = getAccessorFieldName(accessor, index);\n        splitAccessors.set(accessorStr, value);\n      }\n    });\n  }\n  return splitAccessors;\n}\n\n/**\n * Extract y1 and y0 and mark properties from Datum. Casting them to numbers or null\n * @internal\n */\nexport function extractYAndMarkFromDatum<D extends BaseDatum>(\n  datum: D,\n  yAccessor: Accessor<D> | AccessorFn<D>,\n  nonNumericValues: any[],\n  bandedSpec: boolean,\n  y0Accessor?: Accessor<D> | AccessorFn<D>,\n  markSizeAccessor?: Accessor<D> | AccessorFn<D>,\n): Pick<DataSeriesDatum, 'y0' | 'y1' | 'mark' | 'datum' | 'initialY0' | 'initialY1'> {\n  const mark =\n    markSizeAccessor === undefined ? null : finiteOrNull(getAccessorValue(datum, markSizeAccessor), nonNumericValues);\n  const y1Value = getAccessorValue(datum, yAccessor);\n  const y1 = finiteOrNull(y1Value, nonNumericValues);\n  const y0 = y0Accessor ? finiteOrNull(getAccessorValue(datum, y0Accessor), nonNumericValues) : null;\n  return { y1, datum, y0: bandedSpec ? y0 : null, mark, initialY0: y0, initialY1: y1 };\n}\n\nfunction finiteOrNull(value: unknown, nonNumericValues: unknown[]): number | null {\n  const candidateNumber = Number(value ?? undefined);\n  const finite = Number.isFinite(candidateNumber);\n  if (!finite) nonNumericValues.push(value);\n  return finite ? candidateNumber : null;\n}\n\n/** Sorts data based on order of xValues */\nconst getSortedDataSeries = (\n  dataSeries: DataSeries[],\n  xValues: Set<string | number>,\n  xScaleType: ScaleType,\n): DataSeries[] =>\n  dataSeries.map(({ data, ...rest }) => ({\n    ...rest,\n    data: [...data].sort(datumXSortPredicate(xScaleType, [...xValues.values()])),\n  }));\n\n/** @internal */\nexport function getFormattedDataSeries(\n  seriesSpecs: SeriesSpecs,\n  availableDataSeries: DataSeries[],\n  xValues: Set<string | number>,\n  xScaleType: ScaleType,\n): DataSeries[] {\n  // apply fit function to every data series\n  const fittedDataSeries = applyFitFunctionToDataSeries(\n    getSortedDataSeries(availableDataSeries, xValues, xScaleType),\n    seriesSpecs,\n    xScaleType,\n  );\n\n  // apply fitting for stacked DataSeries by YGroup, Panel\n  const stackedDataSeries = fittedDataSeries.filter(({ spec }) => isStackedSpec(spec));\n  const stackedGroups = groupBy<DataSeries>(\n    stackedDataSeries,\n    ['smHorizontalAccessorValue', 'smVerticalAccessorValue', 'groupId'],\n    true,\n  );\n\n  const fittedAndStackedDataSeries = stackedGroups.reduce<DataSeries[]>((acc, dataSeries) => {\n    if (!dataSeries[0]) return acc;\n    const [{ stackMode, seriesType }] = dataSeries;\n    const formatted = formatStackedDataSeriesValues(dataSeries, xValues, seriesType, stackMode);\n    return [...acc, ...formatted];\n  }, []);\n  // get already fitted non stacked dataSeries\n  const nonStackedDataSeries = fittedDataSeries.filter(({ spec }) => !isStackedSpec(spec));\n\n  return [...fittedAndStackedDataSeries, ...nonStackedDataSeries];\n}\n\n/** @internal */\nexport function getDataSeriesFromSpecs(\n  seriesSpecs: BasicSeriesSpec[],\n  deselectedDataSeries: SeriesIdentifier[] = [],\n  orderOrdinalBinsBy?: OrderBy,\n  groupBySpec?: SmallMultiplesGroupBy,\n): {\n  dataSeries: DataSeries[];\n  xValues: Set<string | number>;\n  smVValues: Set<string | number>;\n  smHValues: Set<string | number>;\n  fallbackScale?: XScaleType;\n} {\n  let globalDataSeries: DataSeries[] = [];\n  const mutatedXValueSums = new Map<string | number, number>();\n\n  // the unique set of values along the x axis\n  const globalXValues: Set<string | number> = new Set();\n\n  let isNumberArray = true;\n  let isOrdinalScale = false;\n\n  const specsByYGroup = groupSeriesByYGroup(seriesSpecs);\n\n  // eslint-disable-next-line no-restricted-syntax\n  for (const spec of seriesSpecs) {\n    // check scale type and cast to Ordinal if we found at least one series\n    // with Ordinal Scale\n    if (spec.xScaleType === ScaleType.Ordinal) {\n      isOrdinalScale = true;\n    }\n\n    const specGroup = specsByYGroup.get(spec.groupId);\n    const isStacked = Boolean(specGroup?.stacked.find(({ id }) => id === spec.id));\n    const isBanded = isBandedSpec(spec);\n\n    const { dataSeries, xValues } = splitSeriesDataByAccessors(\n      spec,\n      mutatedXValueSums,\n      isStacked,\n      isBanded,\n      specGroup?.stackMode,\n      groupBySpec,\n    );\n\n    // filter deselected DataSeries\n    let filteredDataSeries: DataSeries[] = [...dataSeries.values()];\n    if (deselectedDataSeries.length > 0) {\n      filteredDataSeries = filteredDataSeries.map((series) => ({\n        ...series,\n        isFiltered: deselectedDataSeries.some(({ key: deselectedKey }) => series.key === deselectedKey),\n      }));\n    }\n\n    globalDataSeries = [...globalDataSeries, ...filteredDataSeries];\n\n    // check the nature of the x values. If all of them are numbers\n    // we can use a continuous scale, if not we should use an ordinal scale.\n    // The xValue is already casted to be a valid number or a string\n    // eslint-disable-next-line no-restricted-syntax\n    for (const xValue of xValues) {\n      if (isNumberArray && typeof xValue !== 'number') {\n        isNumberArray = false;\n      }\n      globalXValues.add(xValue);\n    }\n  }\n\n  const xValues =\n    isOrdinalScale || !isNumberArray\n      ? getSortedOrdinalXValues(globalXValues, mutatedXValueSums, orderOrdinalBinsBy)\n      : new Set(\n          [...globalXValues].sort((a, b) => {\n            if (typeof a === 'string' || typeof b === 'string') {\n              return 0;\n            }\n            return a - b;\n          }),\n        );\n\n  const dataSeries = globalDataSeries.map((d, i) => ({\n    ...d,\n    insertIndex: i,\n  }));\n\n  const smallMultipleUniqueValues = dataSeries.reduce<{\n    smVValues: Set<string | number>;\n    smHValues: Set<string | number>;\n  }>(\n    (acc, curr) => {\n      if (curr.isFiltered) {\n        return acc;\n      }\n      if (!isNil(curr.smHorizontalAccessorValue)) {\n        acc.smHValues.add(curr.smHorizontalAccessorValue);\n      }\n      if (!isNil(curr.smVerticalAccessorValue)) {\n        acc.smVValues.add(curr.smVerticalAccessorValue);\n      }\n      return acc;\n    },\n    { smVValues: new Set(), smHValues: new Set() },\n  );\n\n  return {\n    dataSeries,\n    // keep the user order for ordinal scales\n    xValues,\n    ...smallMultipleUniqueValues,\n    fallbackScale: !isOrdinalScale && !isNumberArray ? X_SCALE_DEFAULT.type : undefined,\n  };\n}\n\n/**\n * TODO: Add check for chart type other than area and bar.\n * @internal\n */\nexport function isBandedSpec(spec: BasicSeriesSpec): boolean {\n  return Boolean(spec.y0Accessors && spec.y0Accessors.length > 0 && !isStackedSpec(spec));\n}\n\nfunction getSortedOrdinalXValues(\n  xValues: Set<string | number>,\n  xValueSums: Map<string | number, number>,\n  orderOrdinalBinsBy?: OrderBy,\n) {\n  if (!orderOrdinalBinsBy) {\n    return xValues; // keep the user order for ordinal scales\n  }\n\n  switch (orderOrdinalBinsBy?.binAgg) {\n    case BinAgg.None:\n      return xValues; // keep the user order for ordinal scales\n    case BinAgg.Sum:\n    default:\n      return new Set(\n        [...xValues].sort(\n          (v1, v2) =>\n            (orderOrdinalBinsBy.direction === Direction.Ascending ? 1 : -1) *\n            ((xValueSums.get(v1) ?? 0) - (xValueSums.get(v2) ?? 0)),\n        ),\n      );\n  }\n}\n\nconst BIG_NUMBER = Number.MAX_SAFE_INTEGER; // the sort comparator must yield finite results, can't use infinities\n\nfunction getSeriesNameFromOptions(\n  options: SeriesNameConfigOptions,\n  { yAccessor, splitAccessors }: XYChartSeriesIdentifier,\n  delimiter: string,\n): string | null {\n  if (!options.names) {\n    return null;\n  }\n\n  return (\n    [...options.names]\n      .sort(({ sortIndex: a = BIG_NUMBER }, { sortIndex: b = BIG_NUMBER }) => a - b)\n      .map(({ accessor, value, name }) => {\n        const accessorValue = splitAccessors.get(accessor) ?? null;\n        if (accessorValue === value) {\n          return name ?? value;\n        }\n\n        if (yAccessor === accessor) {\n          return name ?? accessor;\n        }\n        return null;\n      })\n      .filter((d) => Boolean(d) || d === 0)\n      .join(delimiter) || null\n  );\n}\n\n/**\n * Get series name based on `SeriesIdentifier`\n * @internal\n */\nexport function getSeriesName(\n  seriesIdentifier: XYChartSeriesIdentifier,\n  hasSingleSeries: boolean,\n  isTooltip: boolean,\n  spec?: BasicSeriesSpec,\n): string {\n  const customLabel =\n    typeof spec?.name === 'function'\n      ? spec.name(seriesIdentifier, isTooltip)\n      : typeof spec?.name === 'object' // extract booleans once https://github.com/microsoft/TypeScript/issues/12184 is fixed\n        ? getSeriesNameFromOptions(spec.name, seriesIdentifier, spec.name.delimiter ?? SERIES_DELIMITER)\n        : null;\n\n  if (customLabel !== null) {\n    return customLabel.toString();\n  }\n\n  const multipleYAccessors = spec && spec.yAccessors.length > 1;\n  const nameKeys = multipleYAccessors ? seriesIdentifier.seriesKeys : seriesIdentifier.seriesKeys.slice(0, -1);\n  const nonZeroLength = nameKeys.length > 0;\n\n  return nonZeroLength && (spec?.splitSeriesAccessors || !hasSingleSeries)\n    ? nameKeys.join(typeof spec?.name === 'object' ? spec.name.delimiter ?? SERIES_DELIMITER : SERIES_DELIMITER)\n    : spec === undefined\n      ? ''\n      : typeof spec.name === 'string'\n        ? spec.name\n        : spec.id;\n}\n\n/**\n * Helper function to get highest override color.\n * From highest to lowest: `temporary`, `seriesSpec.color` then, unless `temporary` is set to `null`, `persisted`\n */\nfunction getHighestOverride(\n  key: string,\n  customColors: Map<SeriesKey, Color>,\n  overrides: ColorOverrides,\n): Color | undefined {\n  const tempColor: Color | undefined | null = overrides.temporary[key];\n  // Unexpected empty `tempColor` string is falsy and falls through, see comment in `export type Color = ...`\n  // Use default color when temporary and custom colors are null\n  return tempColor || customColors.get(key) || (tempColor === null ? undefined : overrides.persisted[key]);\n}\n\n/**\n * Returns color for a series given all color hierarchies\n * @internal\n */\nexport function getSeriesColors(\n  dataSeries: DataSeries[],\n  chartColors: ColorConfig,\n  customColors: Map<SeriesKey, Color>,\n  overrides: ColorOverrides,\n): Map<SeriesKey, Color> {\n  const seriesColorMap = new Map<SeriesKey, Color>();\n  let counter = 0;\n  const sortedDataSeries = [...dataSeries].sort((a, b) => a.insertIndex - b.insertIndex);\n  groupBy(\n    sortedDataSeries,\n    (ds) => {\n      return [ds.specId, ds.groupId, ds.yAccessor, ...ds.splitAccessors.values()].join('__');\n    },\n    true,\n  ).forEach(([ds]) => {\n    if (!ds) return;\n    const seriesKey = getSeriesKey(\n      {\n        specId: ds.specId,\n        yAccessor: ds.yAccessor,\n        splitAccessors: ds.splitAccessors,\n      },\n      ds.groupId,\n    );\n    const colorOverride = getHighestOverride(seriesKey, customColors, overrides);\n    const color =\n      colorOverride || chartColors.vizColors[counter % chartColors.vizColors.length] || Colors.White.keyword;\n\n    seriesColorMap.set(seriesKey, color);\n    counter++;\n  });\n  return seriesColorMap;\n}\n\n/**\n * Return xy charts series identifier from data series.\n * @internal\n */\nexport function getSeriesIdentifierFromDataSeries(dataSeries: DataSeries): XYChartSeriesIdentifier {\n  const {\n    key,\n    specId,\n    seriesKeys,\n    xAccessor,\n    yAccessor,\n    splitAccessors,\n    smVerticalAccessorValue,\n    smHorizontalAccessorValue,\n  } = dataSeries;\n\n  return stripUndefined({\n    key,\n    specId,\n    seriesKeys,\n    xAccessor,\n    yAccessor,\n    splitAccessors,\n    smVerticalAccessorValue,\n    smHorizontalAccessorValue,\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ReactNode } from 'react';\nimport { $Values } from 'utility-types';\n\nimport { AnimationOptions } from './../renderer/canvas/animations/animation';\nimport { XYChartSeriesIdentifier, DataSeriesDatum } from './series';\nimport { ChartType } from '../../../chart_types';\nimport { Color } from '../../../common/colors';\nimport { TooltipPortalSettings } from '../../../components/portal/types';\nimport { LogScaleOptions, ScaleContinuousType } from '../../../scales';\nimport { ScaleType } from '../../../scales/constants';\nimport { Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { AccessorFormat, AccessorFn, Accessor } from '../../../utils/accessor';\nimport { RecursivePartial, Position, Datum } from '../../../utils/common';\nimport { CurveType } from '../../../utils/curves';\nimport { OrdinalDomain } from '../../../utils/domain';\nimport { AxisId, GroupId, SpecId } from '../../../utils/ids';\nimport {\n  AreaSeriesStyle,\n  BarSeriesStyle,\n  GridLineStyle,\n  LineAnnotationStyle,\n  LineSeriesStyle,\n  PointStyle,\n  RectAnnotationStyle,\n  BubbleSeriesStyle,\n  AxisStyle,\n} from '../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../partition_chart/layout/utils/group_by_rollup';\nimport {\n  AnnotationTooltipFormatter,\n  ComponentWithAnnotationDatum,\n  CustomAnnotationTooltip,\n} from '../annotations/types';\n\n/** @public */\nexport type BarStyleOverride = RecursivePartial<BarSeriesStyle> | Color | null;\n/** @public */\nexport type PointStyleOverride = RecursivePartial<PointStyle> | Color | null;\n\n/** @public */\nexport const SeriesType = Object.freeze({\n  Area: 'area' as const,\n  Bar: 'bar' as const,\n  Line: 'line' as const,\n  Bubble: 'bubble' as const,\n});\n\n/**\n * XY series type\n * @public\n */\nexport type SeriesType = $Values<typeof SeriesType>;\n\n/**\n * The offset and mode applied when stacking values\n * @public\n */\nexport const StackMode = Object.freeze({\n  /** Applies a zero baseline and normalizes the values for each point such that the topline is always one. */\n  Percentage: 'percentage' as const,\n  /** Shifts the baseline so as to minimize the weighted wiggle of layers. */\n  Wiggle: 'wiggle' as const,\n  /** Shifts the baseline down such that the center of the streamgraph is always at zero. */\n  Silhouette: 'silhouette' as const,\n});\n\n/**\n * The offset and mode applied when stacking values\n * @public\n */\nexport type StackMode = $Values<typeof StackMode>;\n\n/**\n * Override for bar styles per datum\n *\n * Return types:\n * - `Color`: Color value as a `string` will set the bar `fill` to that color\n * - `RecursivePartial<BarSeriesStyle>`: Style values to be merged with base bar styles\n * - `null`: Keep existing bar style\n * @public\n */\nexport type BarStyleAccessor = (datum: DataSeriesDatum, seriesIdentifier: XYChartSeriesIdentifier) => BarStyleOverride;\n/**\n * Override for bar styles per datum\n *\n * Return types:\n * - `Color`: Color value as a `string` will set the point `stroke` to that color\n * - `RecursivePartial<PointStyle>`: Style values to be merged with base point styles\n * - `null`: Keep existing point style\n * @public\n */\nexport type PointStyleAccessor = (\n  datum: DataSeriesDatum,\n  seriesIdentifier: XYChartSeriesIdentifier,\n) => PointStyleOverride;\n\n/**\n * The global id used by default to group together series\n * @public\n */\nexport const DEFAULT_GLOBAL_ID = '__global__';\n\n/** @public */\nexport type FilterPredicate = (series: XYChartSeriesIdentifier) => boolean;\n/** @public */\nexport type SeriesName = string | number | null;\n/**\n * Function to create custom series name for a given series\n * @public\n */\nexport type SeriesNameFn = (series: XYChartSeriesIdentifier, isTooltip: boolean) => SeriesName;\n\n/**\n * Accessor mapping to replace names\n * @public\n */\nexport interface SeriesNameConfig {\n  /**\n   * accessor key (i.e. `yAccessors` and `seriesSplitAccessors`)\n   */\n  accessor: string | number;\n  /**\n   * Accessor value (i.e. values from `seriesSplitAccessors`)\n   */\n  value?: string | number;\n  /**\n   * New name for Accessor value\n   *\n   * If not provided, the original value will be used\n   */\n  name?: string | number;\n  /**\n   * Sort order of name, overrides order listed in array.\n   *\n   * lower values - left-most\n   * higher values - right-most\n   */\n  sortIndex?: number;\n}\n\n/** @public */\nexport interface SeriesNameConfigOptions {\n  /**\n   * Array of accessor naming configs to replace series names\n   *\n   * Only provided configs will be included\n   * (i.e. if you only provide a single mapping for `yAccessor`, all other series accessor names will be ignored)\n   *\n   * The order of configs is the order in which the resulting names will\n   * be joined, if no `sortIndex` is specified.\n   *\n   * If no values are found for a giving mapping in a series, the mapping will be ignored.\n   */\n  names?: SeriesNameConfig[];\n  /**\n   * Delimiter to join values/names\n   *\n   * @defaultValue an hyphen with spaces ` - `\n   */\n  delimiter?: string;\n}\n\n/** @public */\nexport type SeriesNameAccessor = string | SeriesNameFn | SeriesNameConfigOptions;\n\n/**\n * The fit function type\n * @public\n */\nexport const Fit = Object.freeze({\n  /**\n   * Don't draw value on the graph. Slices out area between `null` values.\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, null null, 8]\n   * ```\n   */\n  None: 'none' as const,\n  /**\n   * Use the previous non-`null` value\n   *\n   * @remarks\n   * This is the opposite of `Fit.Lookahead`\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 2, 2, 8]\n   * ```\n   */\n  Carry: 'carry' as const,\n  /**\n   * Use the next non-`null` value\n   *\n   * @remarks\n   * This is the opposite of `Fit.Carry`\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 8, 8, 8]\n   * ```\n   */\n  Lookahead: 'lookahead' as const,\n  /**\n   * Use the closest non-`null` value (before or after)\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 2, 8, 8]\n   * ```\n   */\n  Nearest: 'nearest' as const,\n  /**\n   * Average between the closest non-`null` values\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 5, 5, 8]\n   * ```\n   */\n  Average: 'average' as const,\n  /**\n   * Linear interpolation between the closest non-`null` values\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 4, 6, 8]\n   * ```\n   */\n  Linear: 'linear' as const,\n  /**\n   * Sets all `null` values to `0`\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 0, 0, 8]\n   * ```\n   */\n  Zero: 'zero' as const,\n  /**\n   * Specify an explicit value `X`\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, X, X, 8]\n   * ```\n   */\n  Explicit: 'explicit' as const,\n});\n\n/** @public */\nexport type Fit = $Values<typeof Fit>;\n\n/** @public */\nexport interface DomainRange {\n  /**\n   * Custom minInterval for the domain which will affect data bin size.\n   * `min: NaN` or `max: NaN` can be used for either or both extrema, when unbounded.\n   * The minInterval cannot be greater than the computed minimum interval between any two adjacent data points.\n   * Further, if you specify a custom numeric minInterval for a time-series, please note that due to the restriction\n   * above, the specified numeric minInterval will be interpreted as a fixed interval.\n   * This means that, for example, if you have yearly time-series data that ranges from 2016 to 2019 and you manually\n   * compute the interval between 2016 and 2017, you'll have 366 days due to 2016 being a leap year.  This will not\n   * be a valid interval because it is greater than the computed minInterval of 365 days between the other years.\n   */\n  min: number;\n  max: number;\n  minInterval?: number;\n}\n\n/**\n * Padding unit for domain\n * @public\n */\nexport const DomainPaddingUnit = Object.freeze({\n  /**\n   * Raw value in the domain space.\n   *\n   * Example:\n   *\n   * If your domain is `[20, 40]` and your padding value is `10`.\n   * The resulting domain would be `[10, 50]`\n   */\n  Domain: 'domain' as const,\n  /**\n   * Spatial pixel value (aka screenspace) not dependent on domain.\n   *\n   * @alpha\n   */\n  Pixel: 'pixel' as const,\n  /**\n   * Ratio of total domain relative to domain space\n   *\n   * Example:\n   *\n   * If your domain is `[20, 40]` and your padding value is `0.1`.\n   * The resulting padding would be 2 (i.e. `0.1 * (40 - 20)`)\n   * resulting in a domain of `[18, 42]`\n   */\n  DomainRatio: 'domainRatio' as const,\n});\n/**\n * Padding unit\n * @public\n */\nexport type DomainPaddingUnit = $Values<typeof DomainPaddingUnit>;\n\n/**\n * Domain option that **only** apply to `yDomains`.\n * @public\n */\nexport interface YDomainBase {\n  /**\n   * Whether to fit the domain to the data.\n   *\n   * Setting `max` or `min` will override this functionality.\n   * @defaultValue false\n   */\n  fit?: boolean;\n  /**\n   * Specify a series of specIds to include into the domain calculation.\n   * Currently, it will work only for annotations, everything else is already included in the domain automatically.\n   * Setting `domain.max` or `domain.min` will override this functionality.\n   * @defaultValue []\n   */\n  includeDataFromIds?: SpecId[];\n  /**\n   * Padding for computed domain as positive number.\n   * Applied to domain __before__ nicing\n   *\n   * Setting `max` or `min` will override this functionality.\n   */\n  padding?: number;\n  /**\n   * Unit of padding dimension\n   *\n   * @defaultValue 'domain'\n   */\n  paddingUnit?: DomainPaddingUnit;\n  /**\n   * Constrains padded domain to the zero baseline.\n   *\n   * e.g. If your domain is `[10, 100]` and `[-10, 120]` with padding.\n   * The domain would be `[0, 120]` if **constrained** or `[-10, 120]` if **unconstrained**.\n   *\n   * @defaultValue true\n   */\n  constrainPadding?: boolean;\n}\n\n/** @public */\nexport type YDomainRange = YDomainBase & DomainRange & LogScaleOptions;\n\n/** @public */\nexport type CustomXDomain = (DomainRange & Pick<LogScaleOptions, 'logBase'>) | OrdinalDomain;\n\n/** @public */\nexport const LabelOverflowConstraint = Object.freeze({\n  BarGeometry: 'barGeometry' as const,\n  ChartEdges: 'chartEdges' as const,\n});\n\n/** @public */\nexport type LabelOverflowConstraint = $Values<typeof LabelOverflowConstraint>;\n\n/** @public */\nexport interface DisplayValueSpec {\n  /**\n   * Show value label in chart element\n   * @defaultValue false\n   */\n  showValueLabel?: boolean;\n  /**\n   * If value labels are shown, skips every other label\n   * @defaultValue false\n   */\n  isAlternatingValueLabel?: boolean;\n  /**\n   * Function for formatting values; will use axis tickFormatter if none specified\n   * @defaultValue false\n   */\n  valueFormatter?: TickFormatter;\n  /**\n   * An option to hide the value label on certain conditions:\n   * - `barGeometry` the label is not rendered if the width/height overflows the associated bar geometry,\n   * - `chartEdges` the label is not rendered if it overflows the chart projection area.\n   * @defaultValue ['barGeometry', 'chartEdges']\n   */\n  overflowConstraints?: Array<LabelOverflowConstraint>;\n}\n\n/** @public */\nexport interface SeriesSpec<D extends BaseDatum = Datum> extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.XYAxis;\n  /**\n   * The name of the spec. Also a mechanism to provide custom series names.\n   */\n  name?: SeriesNameAccessor;\n  /**\n   * The ID of the spec group\n   * @defaultValue {@link DEFAULT_GLOBAL_ID}\n   */\n  groupId: string;\n  /**\n   * When specify a groupId on this series, this option can be used to compute this series domain as it was part\n   * of the default group (when using the boolean value true)\n   * or as the series was part of the specified group (when issuing a string)\n   */\n  useDefaultGroupDomain?: boolean | string;\n  /** An array of data */\n  data: D[];\n  /** The type of series you are looking to render */\n  seriesType: SeriesType;\n  /** Set colors for specific series */\n  color?: SeriesColorAccessor;\n  /**\n   * If the series should appear in the legend\n   * @defaultValue `false`\n   */\n  hideInLegend?: boolean;\n  displayValueSettings?: DisplayValueSpec;\n  /**\n   * Postfix string or accessor function for y1 accessor when using `y0Accessors`\n   *\n   * @defaultValue ` - upper`\n   */\n  y0AccessorFormat?: AccessorFormat;\n  /**\n   * Postfix string or accessor function for y1 accessor when using `y0Accessors`\n   *\n   * @defaultValue ` - lower`\n   */\n  y1AccessorFormat?: AccessorFormat;\n  /**\n   * Hide series in tooltip\n   */\n  filterSeriesInTooltip?: FilterPredicate;\n  /**\n   * A function called to format every value label.\n   * Uses axis `tickFormat` when not provided.\n   */\n  tickFormat?: TickFormatter;\n}\n\n/** @public */\nexport interface Postfixes {\n  /**\n   * Postfix for y1 accessor when using `y0Accessors`\n   *\n   * @defaultValue `upper`\n   */\n  y0AccessorFormat?: string;\n  /**\n   * Postfix for y1 accessor when using `y0Accessors`\n   *\n   * @defaultValue `lower`\n   */\n  y1AccessorFormat?: string;\n}\n\n/** @public */\nexport type SeriesColorsArray = string[];\n/** @public */\nexport type SeriesColorAccessorFn = (seriesIdentifier: XYChartSeriesIdentifier) => string | null;\n/** @public */\nexport type SeriesColorAccessor = string | SeriesColorsArray | SeriesColorAccessorFn;\n\n/** @public */\nexport interface SeriesAccessors<D extends BaseDatum = any> {\n  /** The field name of the x value on Datum object */\n  xAccessor: Accessor<D> | AccessorFn<D>;\n  /** An array of field names one per y metric value */\n  yAccessors: (Accessor<D> | AccessorFn<D>)[];\n  /** An optional accessor of the y0 value: base point for area/bar charts  */\n  y0Accessors?: (Accessor<D> | AccessorFn<D>)[];\n  /** An array of fields thats indicates the datum series membership */\n  splitSeriesAccessors?: (Accessor<D> | AccessorFn<D>)[];\n  /**\n   * An array of fields thats indicates the stack membership.\n   * Does not depend on datum at the moment.\n   *\n   * TODO pass datum to accessors when applicable\n   */\n  stackAccessors?: (Accessor<any> | AccessorFn<any>)[];\n  /**\n   * Field name of mark size metric on `Datum`\n   *\n   * Only used with line/area series\n   */\n  markSizeAccessor?: Accessor<D> | AccessorFn<D>;\n}\n\n/** @public */\nexport type XScaleType = typeof ScaleType.Ordinal | ScaleContinuousType;\n\n/** @public */\nexport interface SeriesScales {\n  /**\n   * The x axis scale type\n   * @defaultValue `ordinal` {@link (ScaleType:type) | ScaleType.Ordinal}\n   */\n  xScaleType: XScaleType;\n  /**\n   * Extends the x domain so that it starts and ends on nice round values.\n   * @defaultValue `false`\n   */\n  xNice?: boolean;\n  /**\n   * If using a ScaleType.Time this timezone identifier is required to\n   * compute a nice set of xScale ticks. Can be any IANA zone supported by\n   * the host environment, or a fixed-offset name of the form 'utc+3',\n   * or the strings 'local' or 'utc'.\n   * @defaultValue `local`\n   */\n  timeZone?: string;\n  /**\n   * The y axis scale type\n   * @defaultValue `linear` {@link (ScaleType:type) | ScaleType.Linear}\n   */\n  yScaleType: ScaleContinuousType;\n  /**\n   * Extends the y domain so that it starts and ends on nice round values.\n   * @defaultValue `false`\n   */\n  yNice?: boolean;\n}\n\ntype MarkFormatter<Type extends string = ''> = Type extends 'bar'\n  ? // eslint-disable-next-line @typescript-eslint/ban-types\n    {} // these options are to be empty thus {}\n  : {\n      /**\n       * A function called to format every single mark value\n       *\n       * Only used with line/area series\n       */\n      markFormat?: TickFormatter<number>;\n    };\n\n/** @public */\n\nexport type BasicSeriesSpec<D extends BaseDatum = Datum, Type extends string = ''> = SeriesSpec<D> &\n  SeriesAccessors<D> &\n  SeriesScales &\n  MarkFormatter<Type>;\n\n/** @public */\nexport type SeriesSpecs<D extends BaseDatum = Datum, S extends BasicSeriesSpec<D> = BasicSeriesSpec<D>> = Array<S>;\n\n/**\n * Expected shape of unknown data row/datum\n * @public\n */\nexport type BaseDatum = Record<string, any> | any[];\n\n/**\n * This spec describe the dataset configuration used to display a bar series.\n * @public\n */\nexport type BarSeriesSpec<D extends BaseDatum = Datum> = BasicSeriesSpec<D, 'bar'> &\n  Postfixes & {\n    /** @defaultValue `bar` {@link (SeriesType:type) | SeriesType.Bar} */\n    seriesType: typeof SeriesType.Bar;\n    /** If true, will stack all BarSeries and align bars to ticks (instead of centered on ticks) */\n    enableHistogramMode?: boolean;\n    barSeriesStyle?: RecursivePartial<BarSeriesStyle>;\n    /**\n     * Stack each series using a specific mode: Percentage, Wiggle, Silhouette.\n     * The last two modes are generally used for stream graphs\n     */\n    stackMode?: StackMode;\n    /**\n     * Functional accessor to return custom color or style for bar datum\n     */\n    styleAccessor?: BarStyleAccessor;\n    /**\n     * Min height to render bars for highly variable data\n     *\n     * @remarks\n     * i.e. ranges from 100,000 to 1.\n     *\n     * The unit is expressed in `pixel`\n     */\n    minBarHeight?: number;\n  };\n\n/**\n * This spec describe the dataset configuration used to display a histogram bar series.\n * A histogram bar series is identical to a bar series except for the bar width.\n * @public\n */\nexport type HistogramBarSeriesSpec<D extends BaseDatum = Datum> = BarSeriesSpec<D> & {\n  enableHistogramMode: true;\n};\n\n/** @public */\nexport type FitConfig = {\n  /**\n   * Fit type for data with null values\n   */\n  type: Fit;\n  /**\n   * Fit value used when `type` is set to `Fit.Explicit`\n   */\n  value?: number;\n  /**\n   * Value used for first and last point if fitting is not possible\n   *\n   * `'nearest'` will set indeterminate end values to the closes _visible_ point.\n   *\n   * Note: Computed fit values will always take precedence over `endValues`\n   */\n  endValue?: number | 'nearest';\n};\n\n/**\n * This spec describe the dataset configuration used to display a line series.\n * @public\n */\nexport type LineSeriesSpec<D extends BaseDatum = Datum> = BasicSeriesSpec<D, 'line'> &\n  HistogramConfig & {\n    /** @defaultValue `line` {@link (SeriesType:type) | SeriesType.Line} */\n    seriesType: typeof SeriesType.Line;\n    curve?: CurveType;\n    lineSeriesStyle?: RecursivePartial<LineSeriesStyle>;\n    /**\n     * An optional functional accessor to return custom color or style for point datum\n     */\n    pointStyleAccessor?: PointStyleAccessor;\n    /**\n     * Fit config to fill `null` values in dataset\n     */\n    fit?: Exclude<Fit, 'explicit'> | FitConfig;\n  };\n\n/**\n * This spec describe the dataset configuration used to display a line series.\n *\n * @alpha\n */\nexport type BubbleSeriesSpec<D extends BaseDatum = Datum> = BasicSeriesSpec<D, 'bubble'> & {\n  /** @defaultValue `bubble` {@link (SeriesType:type) | SeriesType.Bubble} */\n  seriesType: typeof SeriesType.Bubble;\n  bubbleSeriesStyle?: RecursivePartial<BubbleSeriesStyle>;\n  /**\n   * An optional functional accessor to return custom color or style for point datum\n   */\n  pointStyleAccessor?: PointStyleAccessor;\n};\n\n/**\n * This spec describe the dataset configuration used to display an area series.\n * @public\n */\nexport type AreaSeriesSpec<D extends BaseDatum = Datum> = BasicSeriesSpec<D, 'area'> &\n  HistogramConfig &\n  Postfixes & {\n    /** @defaultValue `area` {@link (SeriesType:type) | SeriesType.Area} */\n    seriesType: typeof SeriesType.Area;\n    /** The type of interpolator to be used to interpolate values between points */\n    curve?: CurveType;\n    areaSeriesStyle?: RecursivePartial<AreaSeriesStyle>;\n    /**\n     * Stack each series using a specific mode: Percentage, Wiggle, Silhouette.\n     * The last two modes are generally used for stream graphs\n     */\n    stackMode?: StackMode;\n    /**\n     * An optional functional accessor to return custom color or style for point datum\n     */\n    pointStyleAccessor?: PointStyleAccessor;\n    /**\n     * Fit config to fill `null` values in dataset\n     */\n    fit?: Exclude<Fit, 'explicit'> | FitConfig;\n  };\n\n/** @public */\nexport interface HistogramConfig {\n  /**\n   *  Determines how points in the series will align to bands in histogram mode\n   * @defaultValue `start`\n   */\n  histogramModeAlignment?: HistogramModeAlignment;\n}\n\n/** @public */\nexport const HistogramModeAlignments = Object.freeze({\n  Start: 'start' as HistogramModeAlignment,\n  Center: 'center' as HistogramModeAlignment,\n  End: 'end' as HistogramModeAlignment,\n});\n\n/** @public */\nexport type HistogramModeAlignment = 'start' | 'center' | 'end';\n\n/**\n * This spec describe the configuration for a chart axis.\n * @public\n */\nexport interface AxisSpec extends Spec {\n  specType: typeof SpecType.Axis;\n  chartType: typeof ChartType.XYAxis;\n  /** The ID of the spec */\n  id: AxisId;\n  /** Style options for grid line */\n  gridLine?: Partial<GridLineStyle>;\n  /**\n   * The ID of the axis group\n   * @defaultValue {@link DEFAULT_GLOBAL_ID}\n   */\n  groupId: GroupId;\n  /** Hide this axis */\n  hide: boolean;\n  /** shows all ticks and gridlines, including those belonging to labels that got culled due to overlapping with other labels */\n  showOverlappingTicks: boolean;\n  /** Shows all labels, also the overlapping ones */\n  showOverlappingLabels: boolean;\n  /** Where the axis appear on the chart */\n  position: Position;\n  /**\n   * A function called to format every tick value label.\n   * Uses first series spec `tickFormat` when not provided.\n   *\n   * used in tooltip when no `tickFormat` is provided from series spec\n   */\n  tickFormat?: TickFormatter;\n  /**\n   * A function called to format every label  (excludes tooltip)\n   *\n   * overrides tickFormat for axis labels\n   */\n  labelFormat?: TickFormatter;\n  /** An approximate count of how many ticks will be generated */\n  ticks?: number;\n  /** The axis title */\n  title?: string;\n  /** Custom style overrides */\n  style?: RecursivePartial<Omit<AxisStyle, 'gridLine'>>;\n  /** If specified, it constrains the domain for these values */\n  domain?: YDomainRange;\n  /**\n   * Show only integar values\n   * @deprecated use `maximumFractionDigits` instead\n   */\n  integersOnly?: boolean;\n  /**\n   * Max fractional digit to limit precision of number ticks\n   */\n  maximumFractionDigits?: number;\n  /**\n   * Show duplicated ticks\n   * @defaultValue `false`\n   */\n  showDuplicatedTicks?: boolean;\n\n  /**\n   * Render a multi-layer time axis. Use 2 or 3 as valid number of layers.\n   * Use 0 to use the alternative, one row, time axis.\n   * @alpha\n   * @defaultValue 0\n   */\n  timeAxisLayerCount: number;\n}\n\n/** @public */\nexport type TickFormatterOptions = {\n  timeZone?: string;\n};\n\n/** @public */\nexport type TickFormatter<V = any> = (value: V, options?: TickFormatterOptions) => string;\n\n/** @public */\nexport const AnnotationType = Object.freeze({\n  Line: 'line' as const,\n  Rectangle: 'rectangle' as const,\n  Text: 'text' as const,\n});\n/** @public */\nexport type AnnotationType = $Values<typeof AnnotationType>;\n\n/**\n * The domain type enum that can be associated with an annotation\n * @public\n */\nexport const AnnotationDomainType = Object.freeze({\n  XDomain: 'xDomain' as const,\n  YDomain: 'yDomain' as const,\n});\n\n/**\n * The domain type that can be associated with an annotation\n * @public\n */\nexport type AnnotationDomainType = $Values<typeof AnnotationDomainType>;\n\n/**\n * The descriptive object of a line annotation\n * @public\n */\nexport interface LineAnnotationDatum<D = any> {\n  /**\n   * The value on the x or y axis according to the domainType configured\n   */\n  dataValue: D;\n  /**\n   * A textual description of the annotation\n   */\n  details?: string;\n  /**\n   * An header of the annotation. If undefined, than the formatted dataValue will be used\n   */\n  header?: string;\n}\n\n/** @public */\nexport const AnnotationAnimationTrigger = Object.freeze({\n  FadeOnFocusingOthers: 'FadeOnFocusingOthers' as const,\n});\n/** @public */\nexport type AnnotationAnimationTrigger = $Values<typeof AnnotationAnimationTrigger>;\n\n/** @public */\nexport interface AnimationConfig<T extends string> {\n  trigger: T;\n  options?: AnimationOptions;\n}\n\n/** @public */\nexport type AnnotationAnimationConfig = AnimationConfig<AnnotationAnimationTrigger>;\n\n/** @public */\nexport type LineAnnotationSpec<D = any> = BaseAnnotationSpec<\n  typeof AnnotationType.Line,\n  LineAnnotationDatum<D>,\n  LineAnnotationStyle,\n  D\n> & {\n  domainType: AnnotationDomainType;\n  /** Optional Custom marker icon centered on data value */\n  marker?: ReactNode | ComponentWithAnnotationDatum<D>;\n  /** Optional marker body, always contained within chart area */\n  markerBody?: ReactNode | ComponentWithAnnotationDatum<D>;\n  /**\n   * Custom marker dimensions; will be computed internally\n   * Any user-supplied values will be overwritten\n   */\n  markerDimensions?: {\n    width: number;\n    height: number;\n  };\n  /**\n   * An optional marker position.\n   *\n   * @remarks\n   * The default position, if this property is not specified, falls back to the linked axis position (if available).\n   * If no axis present on the chart, the marker position is positioned by default on the bottom on the X domain\n   * and on the left of the chart for the Y domain. The specified position is an absolute position and reflect\n   * the spatial position of the marker independently from the chart rotation.\n   */\n  markerPosition?: Position;\n  /** Annotation lines are hidden */\n  hideLines?: boolean;\n  /**\n   * Hide tooltip when hovering over the line\n   * @defaultValue `true`\n   */\n  hideLinesTooltips?: boolean;\n  /**\n   * z-index of the annotation relative to other elements in the chart\n   * @defaultValue 1\n   */\n  zIndex?: number;\n};\n\n/**\n * The descriptive object of a rectangular annotation\n * @public\n */\nexport interface RectAnnotationDatum {\n  /**\n   * The coordinates for the 4 rectangle points.\n   */\n  coordinates: {\n    /**\n     * The minuimum value on the x axis. If undefined, the minuimum value of the x domain will be used.\n     */\n    x0?: PrimitiveValue;\n    /**\n     * The maximum value on the x axis. If undefined, the maximum value of the x domain will be used.\n     */\n    x1?: PrimitiveValue;\n    /**\n     * The minimum value on the y axis. If undefined, the minimum value of the y domain will be used.\n     */\n    y0?: PrimitiveValue;\n    /**\n     * The maximum value on the y axis. If undefined, the maximum value of the y domain will be used.\n     */\n    y1?: PrimitiveValue;\n  };\n  /**\n   * A textual description of the annotation\n   */\n  details?: string;\n}\n\n/** @public */\nexport type RectAnnotationSpec = BaseAnnotationSpec<\n  typeof AnnotationType.Rectangle,\n  RectAnnotationDatum,\n  RectAnnotationStyle\n> & {\n  /**\n   * z-index of the annotation relative to other elements in the chart\n   * @defaultValue -1\n   */\n  zIndex?: number;\n  /**\n   * Renders annotation outside of chart area within axis gutter\n   *\n   * @defaultValue false\n   */\n  outside?: boolean;\n  /**\n   * Dimension, either height or width, of outside annotation\n   */\n  outsideDimension?: number;\n};\n\n/**\n * Portal settings for annotation tooltips\n *\n * @public\n */\nexport type AnnotationPortalSettings = TooltipPortalSettings<'chart'> & {\n  /**\n   * The react component used to render a custom tooltip\n   * @public\n   */\n  customTooltip?: CustomAnnotationTooltip;\n  /**\n   * The react component used to render a custom tooltip details\n   * @public\n   */\n  customTooltipDetails?: AnnotationTooltipFormatter;\n};\n\n/** @public */\nexport interface BaseAnnotationSpec<\n  T extends typeof AnnotationType.Rectangle | typeof AnnotationType.Line,\n  AD extends RectAnnotationDatum | LineAnnotationDatum<D>,\n  S extends RectAnnotationStyle | LineAnnotationStyle,\n  D = never,\n> extends Spec,\n    AnnotationPortalSettings {\n  chartType: typeof ChartType.XYAxis;\n  specType: typeof SpecType.Annotation;\n  /**\n   * Annotation type: line, rectangle\n   */\n  annotationType: T;\n  /**\n   * The ID of the axis group, needed for yDomain position\n   * @defaultValue {@link DEFAULT_GLOBAL_ID}\n   */\n  groupId: GroupId;\n  /**\n   * Data values defined with coordinates and details\n   */\n  dataValues: AD[];\n  /**\n   * Custom annotation style\n   */\n  style?: RecursivePartial<S>;\n  /**\n   * Toggles tooltip annotation visibility\n   */\n  hideTooltips?: boolean;\n  /**\n   * z-index of the annotation relative to other elements in the chart\n   * Default specified per specific annotation spec.\n   */\n  zIndex?: number;\n  /**\n   * Animation configurations for annotations\n   */\n  animations?: AnnotationAnimationConfig[];\n}\n\n/** @public */\nexport type AnnotationSpec<D extends BaseDatum = any> = LineAnnotationSpec<D> | RectAnnotationSpec;\n\n/** @internal */\nexport function isLineAnnotation<D extends BaseDatum>(spec: AnnotationSpec<D>): spec is LineAnnotationSpec<D> {\n  return spec.annotationType === AnnotationType.Line;\n}\n\n/** @internal */\nexport function isRectAnnotation(spec: AnnotationSpec): spec is RectAnnotationSpec {\n  return spec.annotationType === AnnotationType.Rectangle;\n}\n\n/** @internal */\nexport function isBarSeriesSpec<D extends BaseDatum>(spec: BasicSeriesSpec<D>): spec is BarSeriesSpec<D> {\n  return spec.seriesType === SeriesType.Bar;\n}\n\n/** @internal */\nexport function isBubbleSeriesSpec<D extends BaseDatum>(spec: BasicSeriesSpec<D>): spec is BubbleSeriesSpec<D> {\n  return spec.seriesType === SeriesType.Bubble;\n}\n\n/** @internal */\nexport function isLineSeriesSpec<D extends BaseDatum>(spec: BasicSeriesSpec<D>): spec is LineSeriesSpec<D> {\n  return spec.seriesType === SeriesType.Line;\n}\n\n/** @internal */\nexport function isAreaSeriesSpec<D extends BaseDatum>(spec: BasicSeriesSpec<D>): spec is AreaSeriesSpec<D> {\n  return spec.seriesType === SeriesType.Area;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { stack as D3Stack, stackOffsetWiggle, stackOrderNone } from 'd3-shape';\n\nimport {\n  diverging,\n  divergingPercentage,\n  divergingSilhouette,\n  divergingWiggle,\n  XValueMap,\n  XValueSeriesDatum,\n} from './diverging_offsets';\nimport { DataSeries, DataSeriesDatum } from './series';\nimport { SeriesType, StackMode } from './specs';\nimport { SeriesKey } from '../../../common/series_id';\nimport { ScaleType } from '../../../scales/constants';\nimport { clamp, isDefined } from '../../../utils/common';\nimport { Logger } from '../../../utils/logger';\n\n/** @internal */\nexport interface StackedValues {\n  values: number[];\n  percent: Array<number>;\n  total: number;\n}\n\n/** @internal */\nexport const datumXSortPredicate =\n  (xScaleType: ScaleType, sortedXValues?: (string | number)[]) =>\n  (a: { x: number | string }, b: { x: number | string }) => {\n    if (xScaleType === ScaleType.Ordinal || typeof a.x === 'string' || typeof b.x === 'string') {\n      return sortedXValues ? sortedXValues.indexOf(a.x) - sortedXValues.indexOf(b.x) : 0;\n    }\n    return a.x - b.x;\n  };\n\n/** @internal */\nexport function formatStackedDataSeriesValues(\n  dataSeries: DataSeries[],\n  xValues: Set<string | number>,\n  seriesType: SeriesType,\n  stackMode?: StackMode,\n): DataSeries[] {\n  const dataSeriesMap = dataSeries.reduce<Map<SeriesKey, DataSeries>>((acc, curr) => {\n    return acc.set(curr.key, curr);\n  }, new Map());\n  let hasNegative = false;\n  let hasPositive = false;\n\n  // group data series by x values\n  const xMap: XValueMap = new Map();\n  [...xValues].forEach((xValue) => {\n    const seriesMap = new Map<SeriesKey, DataSeriesDatum>();\n    dataSeries.forEach(({ key, data, isFiltered }) => {\n      if (isFiltered) return;\n      const datum = data.find(({ x }) => x === xValue);\n      if (!datum) return;\n      const y1 = datum.y1 ?? 0;\n      if (hasPositive || y1 > 0) hasPositive = true;\n      if (hasNegative || y1 < 0) hasNegative = true;\n      seriesMap.set(`${key}-y0`, datum);\n      seriesMap.set(key, datum);\n    });\n    xMap.set(xValue, seriesMap);\n  });\n\n  if (hasNegative && hasPositive && seriesType === SeriesType.Area) {\n    Logger.warn(\n      `Area series should be avoided with dataset containing positive and negative values. Use a bar series instead.`,\n    );\n  }\n\n  const keys = [...dataSeriesMap.keys()].reduce<string[]>((acc, key) => [...acc, `${key}-y0`, key], []);\n  const stackOffset = getOffsetBasedOnStackMode(stackMode, hasNegative && !hasPositive);\n  const stack = D3Stack<XValueSeriesDatum>()\n    .keys(keys)\n    .value(([, indexMap], key) => {\n      const datum = indexMap.get(key);\n      if (!datum) return 0; // hides filtered series while maintaining their existence\n      return key.endsWith('-y0') ? datum.y0 ?? 0 : datum.y1 ?? 0;\n    })\n    .order(stackOrderNone)\n    .offset(stackOffset)(xMap)\n    .filter(({ key }) => !key.endsWith('-y0'));\n\n  return stack\n    .map<DataSeries | null>((stackedSeries) => {\n      const dataSeriesProps = dataSeriesMap.get(stackedSeries.key);\n      if (!dataSeriesProps) return null;\n      const data = stackedSeries\n        .map<DataSeriesDatum | null>((row) => {\n          const d = row.data[1].get(stackedSeries.key);\n          if (!d || d.x === undefined || d.x === null) return null;\n          const { initialY0, initialY1, mark, datum, filled, x } = d;\n          const [y0, y1] = row;\n\n          return {\n            x,\n            /**\n             * Due to floating point errors, values computed on a stack\n             * could falls out of the current defined domain boundaries.\n             * This in particular cause issues with percent stack, where the domain\n             * is hardcoded to [0,1] and some value can fall outside that domain.\n             */\n            y1: clampIfStackedAsPercentage(y1, stackMode),\n            y0: clampIfStackedAsPercentage(y0, stackMode),\n            initialY0,\n            initialY1,\n            mark,\n            datum,\n            filled,\n          };\n        })\n        .filter(isDefined);\n      return {\n        ...dataSeriesProps,\n        data,\n      };\n    })\n    .filter(isDefined);\n}\n\nfunction clampIfStackedAsPercentage(value: number, stackMode?: StackMode) {\n  return stackMode === StackMode.Percentage ? clamp(value, 0, 1) : value;\n}\n\nfunction getOffsetBasedOnStackMode(stackMode?: StackMode, onlyNegative = false) {\n  // TODO: fix diverging wiggle offset for negative polarity data\n  if (onlyNegative && stackMode === StackMode.Wiggle) return stackOffsetWiggle;\n\n  switch (stackMode) {\n    case StackMode.Percentage:\n      return divergingPercentage;\n    case StackMode.Silhouette:\n      return divergingSilhouette;\n    case StackMode.Wiggle:\n      return divergingWiggle;\n    default:\n      return diverging;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../common/colors';\nimport { Ratio } from '../../../common/geometry';\nimport { Texture } from '../../../geoms/types';\nimport { ColorVariant, degToRad, getColorFromVariant } from '../../../utils/common';\nimport { Point } from '../../../utils/point';\nimport { TexturedStyles, TextureShape } from '../../../utils/themes/theme';\nimport { TextureRendererFn } from '../renderer/shapes_paths';\n\nconst getSpacing = ({ spacing }: TexturedStyles): Point => ({\n  x: typeof spacing === 'number' ? spacing : spacing?.x ?? 0,\n  y: typeof spacing === 'number' ? spacing : spacing?.y ?? 0,\n});\n\nconst getPath = (textureStyle: TexturedStyles, size: number, strokeWidth: number): [path: Path2D, rotation: number] => {\n  if ('path' in textureStyle) {\n    const path = typeof textureStyle.path === 'string' ? new Path2D(textureStyle.path) : textureStyle.path;\n\n    return [path, 0];\n  }\n  const [pathFn, rotation] = TextureRendererFn[textureStyle.shape];\n  // Prevents clipping shapes near edge\n  const strokeWidthPadding = [TextureShape.Circle, TextureShape.Square].includes(textureStyle.shape as any)\n    ? strokeWidth\n    : 0;\n\n  return [new Path2D(pathFn((size - strokeWidthPadding) / 2)), rotation];\n};\n\n/** @internal */\nfunction createPattern(\n  ctx: CanvasRenderingContext2D,\n  dpi: number,\n  patternCanvas: HTMLCanvasElement,\n  baseColor: Color | ColorVariant,\n  sharedGeometryOpacity: Ratio,\n  textureStyle?: TexturedStyles,\n): CanvasPattern | null {\n  const pCtx = patternCanvas.getContext('2d');\n  if (!textureStyle || !pCtx) return null;\n\n  const { size = 10, stroke, strokeWidth = 1, opacity, shapeRotation, fill, dash } = textureStyle;\n\n  const spacing = getSpacing(textureStyle);\n  const cssWidth = size + spacing.x;\n  const cssHeight = size + spacing.y;\n  patternCanvas.width = dpi * cssWidth;\n  patternCanvas.height = dpi * cssHeight;\n\n  pCtx.globalAlpha = sharedGeometryOpacity * (opacity ?? 1);\n  pCtx.lineWidth = strokeWidth;\n\n  pCtx.strokeStyle = getColorFromVariant(baseColor, stroke ?? ColorVariant.Series);\n  if (dash) pCtx.setLineDash(dash);\n\n  if (fill) pCtx.fillStyle = getColorFromVariant(baseColor, fill);\n\n  const [path, pathRotation] = getPath(textureStyle, size, strokeWidth);\n  const itemRotation = (shapeRotation ?? 0) + pathRotation;\n\n  pCtx.scale(dpi, dpi);\n  pCtx.translate(cssWidth / 2, cssHeight / 2);\n\n  if (itemRotation) pCtx.rotate(degToRad(itemRotation));\n\n  pCtx.beginPath();\n\n  if (path) {\n    pCtx.stroke(path);\n    if (fill) pCtx.fill(path);\n  }\n\n  const pattern = ctx.createPattern(patternCanvas, 'repeat')!; // HTMLCanvasElement always yields a CanvasPattern anyway\n\n  const { offset, rotation } = textureStyle;\n  const matrix = new DOMMatrix([1 / dpi, 0, 0, 1 / dpi, 0, 0]);\n  if (offset?.global) matrix.translateSelf(offset.x ?? 0, offset.y ?? 0);\n  matrix.rotateSelf(rotation ?? 0);\n  if (offset && !offset.global) matrix.translateSelf(offset.x ?? 0, offset.y ?? 0);\n\n  pattern.setTransform(matrix);\n  return pattern;\n}\n\n/** @internal */\nexport const getTextureStyles = (\n  ctx: CanvasRenderingContext2D,\n  patternCanvas: HTMLCanvasElement,\n  baseColor: Color | ColorVariant,\n  sharedGeometryOpacity: Ratio,\n  texture?: TexturedStyles,\n): Texture | undefined => {\n  const dpi = window.devicePixelRatio;\n  const pattern = createPattern(ctx, dpi, patternCanvas, baseColor, sharedGeometryOpacity, texture);\n\n  if (!pattern || !texture) return;\n\n  const { rotation, offset } = texture;\n\n  return {\n    pattern,\n    rotation,\n    offset,\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// In preparation of nominal types in future TS versions\n// https://github.com/microsoft/TypeScript/pull/33038\n// eg. to avoid adding angles and coordinates and similar inconsistent number/number ops.\n// could in theory be three-valued (in,on,out)\n// It also serves as documentation.\n\nimport { TimeMs } from './geometry';\n\n/**\n * @public\n *\n * Pre-existing animation config to be refactored using new animation config\n */\nexport interface LegacyAnimationConfig {\n  /** @alpha */\n  animation: {\n    duration: TimeMs;\n  };\n}\n","/* eslint-disable header/header */\n\n/**\n * @notice\n * This product includes code that is adapted from https://github.com/Myndex/SAPC-APCA\n * which is available under a \"W3C SOFTWARE NOTICE AND LICENSE\" license.\n */\n\n/// /////////////////////////////////////////////////////////////////////////////\n/// //\n/// //   *****  SAPC BLOCK  *****\n/// //\n/// //   For Evaluations, this is referred to as: SAPC-8, D-series constants\n/// //                S-LUV Advanced Perceptual Contrast\n/// //   Copyright © 2019-2021 by Andrew Somers. All Rights Reserved.\n/// //\n/// //\n/// //   INCLUDED Extensions or Model Features:\n/// //       • SAPC-8 Core Contrast\n/// //       • SmoothScale™ scaling technique\n/// //       • SoftToe black level soft clamp\n/// //\n/// //   NOT INCLUDED — This Version Does NOT Have These Extensions:\n/// //       • Color Vision Module\n/// //       • Spatial Frequency Module\n/// //       • Light Adaptation Module\n/// //       • Dynamics Module\n/// //       • Alpha Module\n/// //       • Personalization Module\n/// //       • Multiway Module\n/// //       • DynaFont™ font display\n/// //       • ResearchMode middle contrast explorer\n/// //       • ResearchMode static target\n/// //       • CIE function suite\n/// //       • SAPColor listings and sorting suite\n/// //       • RGBcolor() colorString parsing\n/// //\n/// //\n/// /////////////////////////////////////////////////////////////////////////////\n\n/// /////////////////////////////////////////////////////////////////////////////\n/// ////////////////////////////////////////////////////////////////////////////\n/// //  BEGIN SAPC/APCA CONTRAST BLOCK  \\//////////////////////////////////////\n/// /                                    \\////////////////////////////////////\n\n/// /////////////////////////////////////////////////////////////////////////\n/// // SAPC Function with SmoothScale  \\////////////////////////////////////\n/// /                                   \\//////////////////////////////////\n///\n\n/// // *** Polarity is Important: do not mix up background and text *** /////\n\n/// //  Input value must be integer in RGB order (RRGGBB for 0xFFFFFF)  /////\n\nimport { RgbTuple } from './color_library_wrappers';\n\n/**\n * / //  DO NOT use a Y from any other method  /////\n * @internal\n */\nexport function APCAContrast([Rbg, Gbg, Bbg]: RgbTuple, [Rtxt, Gtxt, Btxt]: RgbTuple) {\n  /// //  sRGB Conversion to Relative Luminance (Y)  /////\n\n  const mainTRC = 2.4; // Transfer Curve (aka \"Gamma\") for sRGB linearization\n  // Simple power curve vs piecewise described in docs\n  // Essentially, 2.4 best models actual display\n  // characteristics in combination with the total method\n\n  const Rco = 0.2126729; // sRGB Red Coefficient (from matrix)\n  const Gco = 0.7151522; // sRGB Green Coefficient (from matrix)\n  const Bco = 0.072175; // sRGB Blue Coefficient (from matrix)\n\n  /// //  For Finding Raw SAPC Contrast from Relative Luminance (Y)  /////\n\n  const normBG = 0.56; // Constants for SAPC Power Curve Exponents\n  const normTXT = 0.57; // One pair for normal text, and one for reverse\n  const revTXT = 0.62; // These are the \"beating heart\" of SAPC\n  const revBG = 0.65;\n\n  /// //  For Clamping and Scaling Values  /////\n  // constant updated to https://github.com/Myndex/SAPC-APCA#apca-math-new-098g-4g-constants\n  // new 0.98G 4g constants\n\n  const blkThrs = 0.022; // Level that triggers the soft black clamp\n  const blkClmp = 1.414; // Exponent for the soft black clamp curve\n  const deltaYmin = 0.0005; // Lint trap\n  const scaleBoW = 1.14; // Scaling for dark text on light\n  const scaleWoB = 1.14; // Scaling for light text on dark\n  const loConThresh = 0.035991; // Threshold for new simple offset scale\n  const loConFactor = 27.7847239587675;\n  const loConOffset = 0.027; // The simple offset\n  const loClip = 0.001; // Output clip (lint trap #2)\n\n  // We are only concerned with Y at this point\n  // Ybg and Ytxt: divide sRGB to 0.0-1.0 range, linearize,\n  // and then apply the standard coefficients and sum to Y.\n  // Note that the Y we create here is unique and designed\n  // exclusively for SAPC. Do not use Y from other methods.\n\n  let Ybg =\n    Math.pow(Rbg / 255.0, mainTRC) * Rco + Math.pow(Gbg / 255.0, mainTRC) * Gco + Math.pow(Bbg / 255.0, mainTRC) * Bco;\n\n  let Ytxt =\n    Math.pow(Rtxt / 255.0, mainTRC) * Rco +\n    Math.pow(Gtxt / 255.0, mainTRC) * Gco +\n    Math.pow(Btxt / 255.0, mainTRC) * Bco;\n\n  let SAPC = 0.0; // For holding raw SAPC values\n  let outputContrast = 0.0; // For weighted final values\n\n  /// // TUTORIAL  /////\n\n  // Take Y and soft clamp black, return 0 for very close luminances\n  // determine polarity, and calculate SAPC raw contrast\n  // Then apply the output scaling\n\n  // Note that reverse contrast (white text on black)\n  // intentionally returns a negative number\n  // Proper polarity is important!\n\n  /// ///////   BLACK SOFT CLAMP & INPUT CLIP  ////////////////////////////////\n\n  // Soft clamp Y when near black.\n  // Now clamping all colors to prevent crossover errors\n  Ytxt = Ytxt > blkThrs ? Ytxt : Ytxt + Math.pow(blkThrs - Ytxt, blkClmp);\n\n  Ybg = Ybg > blkThrs ? Ybg : Ybg + Math.pow(blkThrs - Ybg, blkClmp);\n\n  /// //   Return 0 Early for extremely low ∆Y (lint trap #1) /////\n  if (Math.abs(Ybg - Ytxt) < deltaYmin) {\n    return 0.0;\n  }\n\n  /// ///////   SAPC CONTRAST   ///////////////////////////////////////////////\n\n  if (Ybg > Ytxt) {\n    // For normal polarity, black text on white\n\n    /// // Calculate the SAPC contrast value and scale\n\n    SAPC = (Math.pow(Ybg, normBG) - Math.pow(Ytxt, normTXT)) * scaleBoW;\n\n    /// // NEW! SAPC SmoothScale™\n    // Low Contrast Smooth Scale Rollout to prevent polarity reversal\n    // and also a low clip for very low contrasts (lint trap #2)\n    // much of this is for very low contrasts, less than 10\n    // therefore for most reversing needs, only loConOffset is important\n    outputContrast =\n      SAPC < loClip ? 0.0 : SAPC < loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC - loConOffset;\n  } else {\n    // For reverse polarity, light text on dark\n    // WoB should always return negative value.\n\n    SAPC = (Math.pow(Ybg, revBG) - Math.pow(Ytxt, revTXT)) * scaleWoB;\n\n    outputContrast =\n      SAPC > -loClip ? 0.0 : SAPC > -loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC + loConOffset;\n  }\n\n  return outputContrast * 100;\n} // Close APCAcontrast()\n\n/// /\\                            ///////////////////////////////////////////\\\n/// //\\  END OF SAPC/APCA BLOCK  /////////////////////////////////////////////\\\n/// ///////////////////////////////////////////////////////////////////////////\\\n/// ////////////////////////////////////////////////////////////////////////////\\\n/* eslint-enable */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/**\n * A string key is used to uniquely identify categories\n *\n * todo: broaden it; some options:\n *   - allow other values of `PrimitiveValue` type (now: string | number | null) but should add Symbol\n *   - allow a descriptor object, eg. `{ key: PrimitiveValue, label: string }`\n *   - allow an accessor that operates on the key, and maps it to a label\n */\n\n/** @public */\nexport type CategoryKey = string;\n\n/** @public */\nexport type CategoryLabel = string;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Required } from 'utility-types';\n\nimport { APCAContrast } from './apca_color_contrast';\nimport { RgbaTuple, RGBATupleToString, RgbTuple } from './color_library_wrappers';\nimport { ColorDefinition, Colors } from './colors';\nimport { getWCAG2ContrastRatio } from './wcag2_color_contrast';\n\n/** @internal */\nexport function hueInterpolator(colors: RgbTuple[]) {\n  return (d: number) => RGBATupleToString(colors[Math.round(d * 255)] ?? Colors.White.rgba);\n}\n\n/** @internal */\nexport function arrayToLookup(keyFun: (v: any) => any, array: Array<any>) {\n  return Object.assign({}, ...array.map((d) => ({ [keyFun(d)]: d })));\n}\n\n/**\n * Blend a foreground (fg) color with a background (bg) color\n * @internal\n */\nexport function combineColors([fgR, fgG, fgB, fgA]: RgbaTuple, [bgR, bgG, bgB, bgA]: RgbaTuple): RgbaTuple {\n  // combine colors only if foreground has transparency\n  if (fgA === 1) {\n    return [fgR, fgG, fgB, fgA];\n  }\n\n  // For reference on alpha calculations:\n  // https://en.wikipedia.org/wiki/Alpha_compositing\n  const alpha = fgA + bgA * (1 - fgA);\n\n  if (alpha === 0) {\n    return Colors.Transparent.rgba;\n  }\n\n  const r = Math.round((fgR * fgA + bgR * bgA * (1 - fgA)) / alpha);\n  const g = Math.round((fgG * fgA + bgG * bgA * (1 - fgA)) / alpha);\n  const b = Math.round((fgB * fgA + bgB * bgA * (1 - fgA)) / alpha);\n  return [r, g, b, alpha];\n}\n\n/** @internal */\nexport interface ColorContrastOptions {\n  darkColor?: RgbaTuple;\n  lightColor?: RgbaTuple;\n}\n\nconst getOptionWithDefaults = (options: ColorContrastOptions = {}): Required<ColorContrastOptions> => ({\n  darkColor: Colors.Black.rgba,\n  lightColor: Colors.White.rgba,\n  ...options,\n});\n\nfunction getHighContrastColorWCAG2(background: RgbTuple, options: ColorContrastOptions = {}): HighContrastResult {\n  const { lightColor, darkColor } = getOptionWithDefaults(options);\n  const wLight = getWCAG2ContrastRatio(lightColor, background);\n  const wDark = getWCAG2ContrastRatio(darkColor, background);\n  return wLight >= wDark\n    ? {\n        color: {\n          rgba: lightColor,\n          keyword: RGBATupleToString(lightColor),\n        },\n        ratio: wLight,\n        shade: 'light',\n      }\n    : {\n        color: {\n          rgba: darkColor,\n          keyword: RGBATupleToString(darkColor),\n        },\n        ratio: wDark,\n        shade: 'dark',\n      };\n}\n\nfunction getHighContrastColorAPCA(background: RgbTuple, options: ColorContrastOptions = {}): HighContrastResult {\n  const { lightColor, darkColor } = getOptionWithDefaults(options);\n  const wLightText = Math.abs(APCAContrast(background, lightColor));\n  const wDarkText = Math.abs(APCAContrast(background, darkColor));\n\n  return wLightText > wDarkText\n    ? {\n        color: {\n          rgba: lightColor,\n          keyword: RGBATupleToString(lightColor),\n        },\n        ratio: wLightText,\n        shade: 'light',\n      }\n    : {\n        color: {\n          rgba: darkColor,\n          keyword: RGBATupleToString(darkColor),\n        },\n        ratio: wDarkText,\n        shade: 'dark',\n      };\n}\n\nconst HIGH_CONTRAST_FN = {\n  WCAG2: getHighContrastColorWCAG2,\n  WCAG3: getHighContrastColorAPCA,\n};\n\n/** @internal */\nexport interface HighContrastResult {\n  color: ColorDefinition;\n  ratio: number;\n  shade: 'light' | 'dark';\n}\n\n/**\n * Use white or black text depending on the high contrast mode used\n * @internal\n */\nexport function highContrastColor(\n  background: RgbTuple,\n  mode: keyof typeof HIGH_CONTRAST_FN = 'WCAG2',\n  options?: ColorContrastOptions,\n): HighContrastResult {\n  return HIGH_CONTRAST_FN[mode](background, options);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport chroma from 'chroma-js';\n\nimport { Color, Colors } from './colors';\nimport { LRUCache } from './data_structures';\nimport { clamp } from '../utils/common';\nimport { Logger } from '../utils/logger';\n\n/** @public */\nexport type RGB = number;\n\n/** @public */\nexport type A = number;\n\n/** @internal */\nexport type RgbTuple = [r: RGB, g: RGB, b: RGB, alpha?: A];\n\n/** @public */\nexport type RgbaTuple = [r: RGB, g: RGB, b: RGB, alpha: A];\n\n/** @internal */\nexport type OpacityFn = (opacity: number) => number;\n\n/** @internal */\nexport function overrideOpacity([r, g, b, o]: RgbaTuple, opacity?: number | OpacityFn): RgbaTuple {\n  const opacityOverride = opacity === undefined ? o : typeof opacity === 'number' ? opacity : opacity(o);\n\n  // don't apply override on transparent color to avoid unwanted behaviours\n  // todo check if we can apply to every transparent colors\n  if (r === 0 && b === 0 && g === 0 && o === 0) {\n    return Colors.Transparent.rgba;\n  }\n  return [r, g, b, clamp(Number.isFinite(opacityOverride) ? opacityOverride : o, 0, 1)];\n}\n\n/** @internal */\nexport function RGBATupleToString(rgba: RgbTuple): Color {\n  return `rgba(${rgba[0]}, ${rgba[1]}, ${rgba[2]}, ${rgba[3] ?? 1})`;\n}\n\n/** @internal */\nexport function isValid(color: Color): chroma.Color | false {\n  try {\n    // ref https://github.com/gka/chroma.js/issues/280\n    return chroma(color === Colors.Transparent.keyword ? 'rgba(0,0,0,0)' : color);\n  } catch {\n    return false;\n  }\n}\n\n/** @internal */\nexport function getChromaColor(color: string): chroma.Color;\n/** @internal */\nexport function getChromaColor(color: RgbaTuple): chroma.Color;\n/** @internal */\nexport function getChromaColor(color: string | RgbaTuple): chroma.Color {\n  if (typeof color === 'string') return chroma(color.toLowerCase());\n  // chroma mutates the input\n  return chroma(...color);\n}\n\n/** @internal */\nexport function getGreensColorScale(gamma: number, domain: [number, number]): (value: number) => Color {\n  const scale = chroma.scale(chroma.brewer.Greens).gamma(gamma).domain(domain);\n  return (value: number) => scale(value).css();\n}\n\nconst rgbaCache = new LRUCache<Color, RgbaTuple>(200);\n\n/** @internal */\nexport function colorToRgba(color: Color): RgbaTuple {\n  const cachedValue = rgbaCache.get(color);\n  if (cachedValue === undefined) {\n    const chromaColor = isValid(color);\n    if (chromaColor === false) Logger.warn(`The provided color is not a valid CSS color, using RED as fallback`, color);\n    const newValue: RgbaTuple = chromaColor ? chromaColor.rgba() : Colors.Red.rgba;\n    rgbaCache.set(color, newValue);\n    return newValue;\n  }\n  return cachedValue;\n}\n\n/** @internal */\nexport function colorToHsl(color: Color): [h: number, s: number, l: number, a: number] {\n  const [r, g, b, a] = colorToRgba(color);\n  const [h, s, l] = chroma.rgb(r, g, b).hsl(); // alpha not preserved\n  return [h, s, l, a];\n}\n\n/** @internal */\nexport function hslToColor(h: number, s: number, l: number, a = 1): Color {\n  const rgba = chroma.hsl(h, s, l).alpha(a).rgba();\n  return RGBATupleToString(rgba);\n}\n\n/** @internal */\nexport function changeColorLightness(color: Color, lightnessAmount: number, lightnessThreshold: number): Color {\n  const [h, s, l, a] = colorToHsl(color);\n  return hslToColor(h, s, l >= lightnessThreshold ? l - lightnessAmount : l + lightnessAmount, a);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport chroma from 'chroma-js';\n\nimport { RgbaTuple } from './color_library_wrappers';\n\n/**\n * A CSS color keyword or a numerical representation (hex, rgb, rgba, hsl, hsla)\n * @public\n */\nexport type Color = string; // todo static/runtime type it this for proper color string content; several places in the code, and ultimate use, dictate it not be an empty string\n\n/** @internal */\nexport type ColorScale<T = Color> = (value: number) => T;\n\n/** @internal */\nexport type ChromaColorScale = ColorScale<chroma.Color>;\n\n/** @internal */\nexport interface ColorDefinition {\n  keyword: Color;\n  rgba: RgbaTuple;\n}\n\n/** @internal */\nexport const Colors: Record<'Red' | 'White' | 'Black' | 'Transparent' | 'DarkOpaqueRed', ColorDefinition> = {\n  Red: {\n    keyword: 'red',\n    rgba: [255, 0, 0, 1],\n  },\n  DarkOpaqueRed: {\n    keyword: 'red',\n    rgba: [128, 0, 0, 0.5],\n  },\n  White: {\n    keyword: 'white',\n    rgba: [255, 255, 255, 1],\n  },\n  Black: {\n    keyword: 'black',\n    rgba: [0, 0, 0, 1],\n  },\n  Transparent: {\n    keyword: 'transparent',\n    rgba: [0, 0, 0, 0],\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\ninterface PlainConfigItem {\n  type: 'group' | 'color' | 'string' | 'boolean' | 'number';\n  dflt?: any;\n  min?: number;\n  max?: number;\n  reconfigurable?: boolean | string;\n  values?: unknown;\n  documentation?: string;\n}\n\ninterface GroupConfigItem extends PlainConfigItem {\n  type: 'group';\n  values: Record<string, PlainConfigItem>;\n}\n\n// switching to `io-ts` style, generic way of combining static and runtime type info - 1st step\nclass Type<A> {\n  dflt: A;\n\n  reconfigurable: boolean | string;\n\n  documentation: string;\n\n  constructor(dflt: A, reconfigurable: boolean | string, documentation: string) {\n    this.dflt = dflt;\n    this.reconfigurable = reconfigurable;\n    this.documentation = documentation;\n  }\n}\n\n/** @internal */\nexport class Numeric extends Type<number> {\n  min: number;\n\n  max: number;\n\n  type = 'number';\n\n  constructor({\n    dflt,\n    min,\n    max,\n    reconfigurable,\n    documentation,\n  }: {\n    dflt: number;\n    min: number;\n    max: number;\n    reconfigurable: boolean | string;\n    documentation: string;\n  }) {\n    super(dflt, reconfigurable, documentation);\n    this.min = min;\n    this.max = max;\n  }\n}\n\n/** @internal */\nexport type ConfigItem = PlainConfigItem | Numeric;\n\nfunction isGroupConfigItem(item: ConfigItem): item is GroupConfigItem {\n  return item.type === 'group';\n}\n\n/** todo switch to `io-ts` style, generic way of combining static and runtime type info\n * @internal\n */\nexport function configMap<Conf>(mapper: (v: ConfigItem) => unknown, cfgMetadata: Record<string, ConfigItem>): Conf {\n  return Object.assign(\n    {},\n    ...Object.entries(cfgMetadata).map(([k, v]: [string, ConfigItem]) => {\n      if (isGroupConfigItem(v)) {\n        return { [k]: configMap<Conf>(mapper, v.values) };\n      }\n      return { [k]: mapper(v) };\n    }),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const DEFAULT_CSS_CURSOR = undefined;\n/** @internal */\nexport const TAU = 2 * Math.PI;\n/** @internal */\nexport const RIGHT_ANGLE = TAU / 4;\n/** @internal */\nexport const GOLDEN_RATIO = 1.618;\n\n/** @public */\nexport const TOP = 'top' as const;\n/** @public */\nexport const BOTTOM = 'bottom' as const;\n/** @public */\nexport const LEFT = 'left' as const;\n/** @public */\nexport const RIGHT = 'right' as const;\n/** @public */\nexport const MIDDLE = 'middle' as const;\n/** @public */\nexport const CENTER = 'center' as const;\n\n/** @internal\n * Value used to describe the secondary button (usually the right button) on a `MouseEvent.button`\n */\nexport const SECONDARY_BUTTON = 2;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { clamp } from '../utils/common';\n\n/** @internal */\nexport class LRUCache<K, V> {\n  private readonly max: number;\n  private readonly cache: Map<K, V>;\n  constructor(max = 10) {\n    this.max = clamp(max, 1, Infinity);\n    this.cache = new Map();\n  }\n\n  get(key: K) {\n    const item = this.cache.get(key);\n    if (item) {\n      this.cache.delete(key);\n      this.cache.set(key, item);\n    }\n    return item;\n  }\n\n  set(key: K, val: V) {\n    if (this.cache.has(key)) this.cache.delete(key);\n    else if (this.cache.size === this.max) this.cache.delete(this.first());\n    this.cache.set(key, val);\n  }\n\n  first() {\n    return this.cache.keys().next().value;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const DEFAULT_FONT_FAMILY = 'Inter, BlinkMacSystemFont, Helvetica, Arial, sans-serif';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SeriesIdentifier } from './series_id';\nimport { LayerValue, SettingsSpec, Spec } from '../specs';\nimport { PointerStates } from '../state/chart_state';\nimport { isClicking } from '../state/utils';\n\n// todo revise all the complex branching in this file, replace some `if`s and multiple return points with ternaries\n\n/** @internal */\nexport const getOnElementClickSelector =\n  (prev: { click: PointerStates['lastClick'] }) =>\n  (\n    spec: Spec | null,\n    lastClick: PointerStates['lastClick'],\n    settings: SettingsSpec,\n    pickedShapes: LayerValue[][],\n  ): void => {\n    if (!spec) {\n      return;\n    }\n    if (!settings.onElementClick) {\n      return;\n    }\n    const nextPickedShapesLength = pickedShapes.length;\n    if (nextPickedShapesLength > 0 && isClicking(prev.click, lastClick) && settings && settings.onElementClick) {\n      const elements = pickedShapes.map<[LayerValue[], SeriesIdentifier]>((values) => [\n        values,\n        {\n          specId: spec.id,\n          key: `spec{${spec.id}}`,\n        },\n      ]);\n      settings.onElementClick(elements);\n    }\n    prev.click = lastClick;\n  };\n\n/** @internal */\nexport const getOnElementOutSelector =\n  (prev: { pickedShapes: number | null }) =>\n  (spec: Spec | null, pickedShapes: LayerValue[][], settings: SettingsSpec): void => {\n    if (!spec) {\n      return;\n    }\n    if (!settings.onElementOut) {\n      return;\n    }\n    const nextPickedShapes = pickedShapes.length;\n\n    if (prev.pickedShapes !== null && prev.pickedShapes > 0 && nextPickedShapes === 0) {\n      settings.onElementOut();\n    }\n    prev.pickedShapes = nextPickedShapes;\n  };\n\nfunction isNewPickedShapes(prevPickedShapes: LayerValue[][], nextPickedShapes: LayerValue[][]) {\n  if (nextPickedShapes.length === 0) {\n    return;\n  }\n  if (nextPickedShapes.length !== prevPickedShapes.length) {\n    return true;\n  }\n  return !nextPickedShapes.every((nextPickedShapeValues, index) => {\n    const prevPickedShapeValues = prevPickedShapes[index];\n    if (!prevPickedShapeValues) {\n      return false;\n    }\n    if (prevPickedShapeValues.length !== nextPickedShapeValues.length) {\n      return false;\n    }\n    return nextPickedShapeValues.every((layerValue, i) => {\n      const prevPickedValue = prevPickedShapeValues[i];\n      if (!prevPickedValue) {\n        return false;\n      }\n      return layerValue.value === prevPickedValue.value && layerValue.groupByRollup === prevPickedValue.groupByRollup;\n    });\n  });\n}\n\n/** @internal */\nexport const getOnElementOverSelector =\n  (prev: { pickedShapes: LayerValue[][] }) =>\n  (spec: Spec | null, nextPickedShapes: LayerValue[][], settings: SettingsSpec): void => {\n    if (!spec || !settings.onElementOver) return;\n    if (isNewPickedShapes(prev.pickedShapes, nextPickedShapes)) {\n      const elements = nextPickedShapes.map<[LayerValue[], SeriesIdentifier]>((values) => [\n        values,\n        {\n          specId: spec.id,\n          key: `spec{${spec.id}}`,\n        },\n      ]);\n      settings.onElementOver(elements);\n    }\n    prev.pickedShapes = nextPickedShapes;\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ColorContrastOptions, HighContrastResult, combineColors, highContrastColor } from './color_calcs';\nimport { colorToRgba } from './color_library_wrappers';\nimport { Color, Colors } from './colors';\n\n/**\n * limit used to return fallback color\n * @internal\n */\nexport const TRANSPARENT_LIMIT = 0.6;\n\n/**\n * Determine the text color hinging on the parameters of maximizeColorContrast, foreground and container foreground\n * returns high contrast color blend from fg anf bg when suitable, otherwise returns fallback color\n *\n * @internal\n */\nexport function fillTextColor(\n  fallbackBGColor: Color,\n  foreground: Color | null,\n  background: Color = Colors.Transparent.keyword,\n  options?: ColorContrastOptions,\n): HighContrastResult {\n  let backgroundRGBA = colorToRgba(background);\n\n  if (backgroundRGBA[3] < TRANSPARENT_LIMIT) {\n    backgroundRGBA = colorToRgba(fallbackBGColor);\n  }\n\n  if (foreground) {\n    const foregroundRGBA = colorToRgba(foreground);\n    const blendedFgBg = combineColors(foregroundRGBA, backgroundRGBA);\n    return highContrastColor(blendedFgBg, 'WCAG2', options);\n  }\n\n  return highContrastColor(backgroundRGBA, 'WCAG2', options);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// In preparation of nominal types in future TS versions\n// https://github.com/microsoft/TypeScript/pull/33038\n// eg. to avoid adding angles and coordinates and similar inconsistent number/number ops.\n// could in theory be three-valued (in,on,out)\n// It also serves as documentation.\n\nimport { RIGHT_ANGLE, TAU } from './constants';\n\n/** @public */\nexport type Pixels = number;\n/**\n * A finite number that expresses a ratio\n * @public\n */\nexport type Ratio = number;\n/** @public */\nexport type SizeRatio = Ratio;\n/** @public */\nexport type Cartesian = number;\n/** @internal */\nexport type Coordinate = Cartesian;\n/** @public */\nexport type Radius = Cartesian;\n/** @public */\nexport type Radian = Cartesian; // we measure angle in radians, and there's unity between radians and cartesian distances which is the whole point of radians; this is also relevant as we use small-angle approximations\n/** @public */\nexport type Distance = Cartesian;\n\n/** @internal */\nexport type Degrees = number; // angle degrees\n/** @internal */\nexport interface PointObject {\n  x: Coordinate;\n  y: Coordinate;\n}\n\n/** @internal */\nexport type PointTuple = [Coordinate, Coordinate];\n\n/** @internal */\nexport type PointTuples = [PointTuple, ...PointTuple[]]; // at least one point\n\n/** @internal */\nexport class Circline {\n  x: Coordinate = NaN;\n\n  y: Coordinate = NaN;\n\n  r: Radius = NaN;\n}\n\n/** @internal */\nexport interface CirclinePredicate extends Circline {\n  inside: boolean;\n}\n\n/** @internal */\nexport interface CirclineArc extends Circline {\n  from: Radian;\n  to: Radian;\n}\n\n/** @internal */\ntype CirclinePredicateSet = CirclinePredicate[];\n\n/** @internal */\nexport type RingSectorConstruction = CirclinePredicateSet;\n\n/** @public */\nexport type TimeMs = number;\n\n/** @internal */\nexport function wrapToTau(a: Radian) {\n  if (0 <= a && a <= TAU) return a; // efficient shortcut\n  if (a < 0) a -= TAU * Math.floor(a / TAU);\n  return a > TAU ? a % TAU : a;\n}\n\n/** @internal */\nexport function diffAngle(a: Radian, b: Radian) {\n  return ((a - b + Math.PI + TAU) % TAU) - Math.PI;\n}\n\n/** @internal */\nexport function meanAngle(a: Radian, b: Radian) {\n  return (TAU + b + diffAngle(a, b) / 2) % TAU;\n}\n\n/** @internal */\nexport function trueBearingToStandardPositionAngle(alphaIn: number) {\n  return wrapToTau(RIGHT_ANGLE - alphaIn);\n}\n\n/** @internal */\nexport interface Origin {\n  x0: number;\n  y0: number;\n}\n\n/** @internal */\nexport interface Rectangle extends Origin {\n  x1: number;\n  y1: number;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function mapping<InElem, OutElem>(\n  fun: (arg: InElem /*, index: number*/) => OutElem,\n): (iterable: Iterable<InElem>) => Iterable<OutElem> {\n  return function* (iterable: Iterable<InElem>): Iterable<OutElem> {\n    // let i = 0;\n    for (const next of iterable) yield fun(next /*, i++*/);\n  };\n}\n\n/** @internal */\nexport function doing<InElem>(\n  fun: (arg: InElem /*, index: number*/) => void,\n): (iterable: Iterable<InElem>) => Iterable<never> {\n  return function* (iterable: Iterable<InElem>): Iterable<never> {\n    // let i = 0;\n    for (const next of iterable) fun(next /*, i++*/);\n  };\n}\n\n/** @internal */\nexport function filtering<Elem>(\n  fun: (arg: Elem /*, index: number*/) => boolean,\n): (iterable: Iterable<Elem>) => Iterable<Elem> {\n  return function* (iterable: Iterable<Elem>): Iterable<Elem> {\n    //let i = 0;\n    for (const next of iterable) {\n      if (fun(next /*, i++*/)) yield next;\n    }\n  };\n}\n\n// just like [].map except on iterables, to avoid having to materialize both input and output arrays\n/** @internal */\nexport function map<InElem, OutElem>(\n  iterable: Iterable<InElem>,\n  fun: (arg: InElem /*, index: number*/) => OutElem,\n): Iterable<OutElem> {\n  return mapping(fun)(iterable);\n}\n\n/** @internal */\nexport function filter<Elem>(\n  iterable: Iterable<Elem>,\n  fun: (arg: Elem /*, index: number*/) => boolean,\n): Iterable<Elem> {\n  return filtering(fun)(iterable);\n}\n\n/*\n/!** @internal *!/\nexport function finallyDoing<InElem>(\n  fun: (arg: InElem /!*, index: number*!/) => void,\n): (iterable: Iterable<InElem>) => void {\n  return function (iterable: Iterable<InElem>): void {\n    // let i = 0;\n    for (const next of iterable) fun(next /!*, i++*!/);\n  };\n}\n*/\n\n/** @internal */\nexport function executing(iterable: Iterable<unknown>): void {\n  const iterator = iterable[Symbol.iterator]();\n  while (!iterator.next().done) {}\n}\n\n/** @internal */\nexport function pipeline<In>(arg: In): In;\n\n/** @internal */\nexport function pipeline<In, Out>(arg: In, f1: (x: In) => Out): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Out>(arg: In, f1: (x: In) => Mid1, f2: (x: Mid1) => Out): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Mid2, Out>(\n  arg: In,\n  f1: (x: In) => Mid1,\n  f2: (x: Mid1) => Mid2,\n  f3: (x: Mid2) => Out,\n): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Mid2, Mid3, Out>(\n  arg: In,\n  f1: (x: In) => Mid1,\n  f2: (x: Mid1) => Mid2,\n  f3: (x: Mid2) => Mid3,\n  f4: (x: Mid3) => Out,\n): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Mid2, Mid3, Mid4, Out>(\n  arg: In,\n  f1: (x: In) => Mid1,\n  f2: (x: Mid1) => Mid2,\n  f3: (x: Mid2) => Mid3,\n  f4: (x: Mid3) => Mid4,\n  f5: (x: Mid4) => Out,\n): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Mid2, Mid3, Mid4, Mid5, Out>(\n  arg: In,\n  f1: (x: In) => Mid1,\n  f2: (x: Mid1) => Mid2,\n  f3: (x: Mid2) => Mid3,\n  f4: (x: Mid3) => Mid4,\n  f5: (x: Mid4) => Mid5,\n  f6: (x: Mid5) => Out,\n): Out;\n\n/** @internal */\nexport function pipeline(arg: unknown, ...functions: Array<(x: unknown) => unknown>) {\n  return functions.reduce((iterator, fun) => fun(iterator), arg);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GL } from './webgl_constants';\nimport { Logger } from '../utils/logger';\n\nconst GL_DEBUG = true; // to be set to false once GL charts are in non-alpha and broad use for 6-12 months or earlier if perf constrained\n\n/**************\n * Types\n *************/\n\n// there are two shader types\ntype ShaderType = typeof GL.FRAGMENT_SHADER | typeof GL.VERTEX_SHADER;\n\n// a data structure that maps each uniform name (string) to a value setter for that uniform\ntype UniformsMap = Map<string, (...args: any[]) => void>;\n\n// we can use a frame buffer (the Canvas itself, or a texture) for reading, writing or both\ntype FrameBufferTarget = typeof GL.READ_FRAMEBUFFER | typeof GL.DRAW_FRAMEBUFFER | typeof GL.FRAMEBUFFER;\n\n// samplers (texture samplers) act as uniforms; `setUniform` sets the desired texture for the shader code to read (sample) from\ninterface Sampler {\n  setUniform: (location: WebGLUniformLocation) => void;\n}\n\n/**\n * Clearing can be constrained to a rectangle; not just the color buffer but the depth buffer may also be cleared\n * One role of the depth buffer (z-buffer) is to keep track of the Z coordinate closest to the viewer for each pixel on the screen\n * as it can be used to reject future pixel (fragment) shading that would be beneath this and would be invisible anyway\n * The stencil buffer may also be cleared simultaneously https://en.wikipedia.org/wiki/Stencil_buffer\n */\ninterface ClearInfo {\n  rect?: [number, number, number, number];\n  color?: [number, number, number, number];\n  depth?: number;\n  stencilIndex?: number;\n}\n\n// A tuple of texture data for functions like `gl.texImage2D` and `gl.texParameteri` - metadata of a texture\ninterface TextureSpecification {\n  textureIndex: GLuint; // used for identifying the specific texture in a `gl.activeTexture` setter call\n  internalFormat: GLuint; // colors and bits per color https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texImage2D\n  width: GLuint; // texture width in pixels\n  height: GLuint; // texture height in pixels\n  data: ArrayBufferView | null; // the buffer containing the actual pixel grid\n  min?: GLuint; // when using texture for data lookup, we usually want the nearest exact value, rather than interpolated or aggregated\n  mag?: GLuint; // when using texture for data lookup, we usually want the nearest exact value, rather than interpolated or aggregated\n}\n\n/** @internal */\nexport interface Texture {\n  clear: () => void;\n  setUniform: (location: WebGLUniformLocation) => void;\n  target: () => WebGLFramebuffer | null;\n  delete: () => void;\n  width: number;\n  height: number;\n}\n\n/** @internal */\nexport interface UseInfo {\n  uniformValues: any;\n  viewport: { x: number; y: number; width: number; height: number };\n  target: WebGLFramebuffer | null;\n  clear?: ClearInfo;\n  scissor?: [number, number, number, number];\n  draw?: { geom: GLuint; offset: GLuint; count: GLuint; instanceCount?: GLuint };\n}\n\n/** @internal */\nexport type Attributes = Map<string, (data: ArrayBufferView) => void>;\n\n/** @internal */\nexport type Render = (u: UseInfo) => void;\n\n/****************\n * Minimize calls\n *\n * these can be, and should be global like this\n * still doesn't cause memory leak due to weak keys\n *\n ***************/\n\nconst currentPrograms = new WeakMap();\nconst currentVertexArrayObjects = new WeakMap();\nconst currentDepthTests = new WeakMap();\nconst currentReadFrameBuffers = new WeakMap();\nconst currentDrawFrameBuffers = new WeakMap();\nconst currentViewport = new WeakMap();\nconst currentScissor = new WeakMap();\nconst currentClearColor = new WeakMap();\nconst currentClearDepth = new WeakMap();\nconst currentFlags = new WeakMap();\nconst programUniforms = new WeakMap();\nconst locationUniformValues = new WeakMap(); // not sure if this saves significant time; hit rate is high though\nconst setGlobalConstants = new WeakSet();\n\n/** @internal */\nexport const resetState = (gl: WebGL2RenderingContext) => {\n  // all the gl keyed stores need to be erased; other dependent keys go away on their own\n  currentPrograms.delete(gl);\n  currentVertexArrayObjects.delete(gl);\n  currentDepthTests.delete(gl);\n  currentReadFrameBuffers.delete(gl);\n  currentDrawFrameBuffers.delete(gl);\n  currentViewport.delete(gl);\n  currentScissor.delete(gl);\n  currentClearColor.delete(gl);\n  currentClearDepth.delete(gl);\n  currentFlags.delete(gl);\n  setGlobalConstants.delete(gl);\n};\n\nconst setViewport = (gl: WebGL2RenderingContext, ...xyWidthHeight: [number, number, number, number]) => {\n  const key = xyWidthHeight.join('|');\n  if (currentViewport.get(gl) !== key) {\n    gl.viewport(...xyWidthHeight);\n    currentViewport.set(gl, key);\n  }\n};\n\nconst setScissor = (gl: WebGL2RenderingContext, ...xyWidthHeight: [number, number, number, number]) => {\n  const key = xyWidthHeight.join('|');\n  if (currentScissor.get(gl) !== key) {\n    gl.scissor(...xyWidthHeight);\n    currentScissor.set(gl, key);\n  }\n};\n\nconst clearColor = (gl: WebGL2RenderingContext, ...rgba: [number, number, number, number]) => {\n  const key = rgba.join('|');\n  if (currentClearColor.get(gl) !== key) {\n    gl.clearColor(...rgba);\n    currentClearColor.set(gl, key);\n  }\n};\n\nconst clearDepth = (gl: WebGL2RenderingContext, depth: number) => {\n  if (currentClearDepth.get(gl) !== depth) {\n    gl.clearDepth(depth);\n    currentClearDepth.set(gl, depth);\n  }\n};\n\nconst flagSet = (gl: WebGL2RenderingContext, key: number, value: boolean) => {\n  const flags = currentFlags.get(gl);\n  if (flags[key] !== value) {\n    if (value) {\n      gl.enable(key);\n    } else {\n      gl.disable(key);\n    }\n    flags[key] = value;\n  }\n};\n\n/****************\n * Programs\n ***************/\n\n/** @internal */\nexport const createCompiledShader = (\n  gl: WebGL2RenderingContext,\n  shaderType: ShaderType,\n  source: string,\n): WebGLShader => {\n  const shader = gl.createShader(shaderType);\n  if (!shader) throw new Error(`kinGLy exception: shader could not be created`); // just appeasing the TS linter\n  gl.shaderSource(shader, source);\n  gl.compileShader(shader);\n  if (GL_DEBUG && !gl.getShaderParameter(shader, GL.COMPILE_STATUS) && !gl.isContextLost()) {\n    const shaderTypeName = shaderType === GL.VERTEX_SHADER ? 'vertex' : 'fragment';\n    Logger.warn(`kinGLy exception: compilation error in a ${shaderTypeName} shader: ${gl.getShaderInfoLog(shader)}`);\n  }\n  return shader;\n};\n\n/** @internal */\nexport const createLinkedProgram = (\n  gl: WebGL2RenderingContext,\n  vertexShader: WebGLShader,\n  fragmentShader: WebGLShader,\n  attributeLocations: Record<string, number>,\n): WebGLProgram => {\n  const program = gl.createProgram();\n  if (!program) throw new Error(`kinGLy exception: shader program could not be created`); // just appeasing the TS linter https://www.khronos.org/webgl/wiki/HandlingContextLost\n  gl.attachShader(program, vertexShader);\n  gl.attachShader(program, fragmentShader);\n  if (GL_DEBUG && gl.getProgramParameter(program, GL.ATTACHED_SHADERS) !== 2)\n    Logger.warn('kinGLy exception: did not manage to attach the two shaders');\n\n  Object.entries(attributeLocations).forEach(([name, i]) => gl.bindAttribLocation(program, i, name));\n\n  gl.linkProgram(program); // todo consider bulk gl.compileShader iteration, followed by bulk gl.linkProgram iteration https://www.khronos.org/registry/webgl/extensions/KHR_parallel_shader_compile/\n\n  if (GL_DEBUG) {\n    if (!gl.getProgramParameter(program, GL.LINK_STATUS) && !gl.isContextLost())\n      Logger.warn(`kinGLy exception: shader program failed to link: ${gl.getProgramInfoLog(program)}`);\n    gl.validateProgram(program);\n    if (!gl.getProgramParameter(program, GL.LINK_STATUS) && !gl.isContextLost())\n      Logger.warn(`kinGLy exception: could not validate the shader program: ${gl.getProgramInfoLog(program)}`);\n  } else {\n    // no rush with the deletion; avoid adding workload to the synchronous preparation\n    window.setTimeout(() => {\n      gl.detachShader(program, vertexShader);\n      gl.detachShader(program, fragmentShader);\n      gl.deleteShader(vertexShader);\n      gl.deleteShader(fragmentShader);\n    });\n  }\n\n  return program;\n};\n\n/*********************\n * Singular uniforms\n ********************/\n\nconst uniformSetterLookup = {\n  [GL.BOOL]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (value: GLuint) => {\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform1ui(location, value);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.INT]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (value: GLint) => {\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform1i(location, value);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT_VEC2]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (values: Float32List) => {\n    const value = values.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform2fv(location, values);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT_VEC3]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (values: Float32List) => {\n    const value = values.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform3fv(location, values);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.INT_VEC2]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (values: Int32List) => {\n    const value = values.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform2iv(location, values);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (value: GLfloat) => {\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform1f(location, value);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT_MAT2]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (array: Float32List) => {\n    const value = array.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniformMatrix2fv(location, false, array);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT_MAT4]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (array: Float32List) => {\n    const value = array.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniformMatrix4fv(location, false, array);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.SAMPLER_2D]:\n    (gl: WebGL2RenderingContext, location: WebGLUniformLocation) =>\n    ({ setUniform }: Sampler) => {\n      if (locationUniformValues.get(location) !== setUniform) {\n        setUniform(location);\n        locationUniformValues.set(location, setUniform);\n      }\n    },\n};\n\nconst getUniforms = (gl: WebGL2RenderingContext, program: WebGLProgram): UniformsMap => {\n  if (programUniforms.has(program)) return programUniforms.get(program);\n  const uniforms = new Map(\n    [...new Array(gl.getProgramParameter(program, GL.ACTIVE_UNIFORMS /* uniform count */))].flatMap((_, index) => {\n      const activeUniform = gl.getActiveUniform(program, index);\n      if (!activeUniform) {\n        Logger.warn(`kinGLy exception: active uniform not found`);\n        return [];\n      }\n      const { name, type } = activeUniform;\n      const location = gl.getUniformLocation(program, name);\n      if (location === null) {\n        Logger.warn(`kinGLy exception: uniform location ${location} (name: ${name}, type: ${type}) not found`); // just appeasing the TS linter\n        return [];\n      }\n      const setValue = location ? uniformSetterLookup[type]?.(gl, location) : () => {};\n\n      if (!setValue) {\n        Logger.warn(`kinGLy exception: no setValue for uniform GL[${type}] (name: ${name}) implemented yet`);\n        return [];\n      }\n\n      return [[name, setValue]];\n    }),\n  );\n  programUniforms.set(program, uniforms);\n  return uniforms;\n};\n\n/**************\n * Clearing\n *\n * Clears the color, depth and/or stencil index of the canvas or a rectangular area\n * @internal\n *************/\nexport const clearRect = (gl: WebGL2RenderingContext, { rect, color, depth, stencilIndex }: ClearInfo) => {\n  // constrain clearing to a rectangle if needed\n  if (rect) {\n    flagSet(gl, GL.SCISSOR_TEST, true); // allow operation in a specific rectangle\n    setScissor(gl, ...rect); // only operate in this rectangle\n  }\n\n  let flags = 0;\n  if (color) {\n    clearColor(gl, ...color); // set the color for clearing\n    flags |= GL.COLOR_BUFFER_BIT; // include color in the clearing task\n  }\n  if (typeof depth === 'number') {\n    clearDepth(gl, depth); // set the depth for clearing\n    flags |= GL.DEPTH_BUFFER_BIT; // include depth in the clearing task\n  }\n  if (typeof stencilIndex === 'number') {\n    gl.clearStencil(stencilIndex); // set the depth for clearing\n    flags |= GL.STENCIL_BUFFER_BIT; // include stencil in the clearing task\n  }\n\n  // actual clearing\n  gl.clear(flags); // actually do the clearing with the above color, depth and/or stencil index\n};\n\n/****************\n * Textures\n ***************/\n\n// todo add more\nconst textureSrcFormatLookup = {\n  [GL.RGBA8]: GL.RGBA,\n  [GL.RGBA32F]: GL.RGBA,\n};\n\n// todo add more\nconst textureTypeLookup = {\n  [GL.RGBA8]: GL.UNSIGNED_BYTE,\n  [GL.RGBA32F]: GL.FLOAT,\n};\n\n/** @internal */\nexport const bindFramebuffer = (\n  gl: WebGL2RenderingContext,\n  target: FrameBufferTarget,\n  targetFrameBuffer: WebGLFramebuffer | null,\n) => {\n  const updateReadTarget =\n    (target === GL.READ_FRAMEBUFFER || target === GL.FRAMEBUFFER) &&\n    targetFrameBuffer !== currentReadFrameBuffers.get(gl);\n  const updateWriteTarget =\n    (target === GL.DRAW_FRAMEBUFFER || target === GL.FRAMEBUFFER) &&\n    targetFrameBuffer !== currentDrawFrameBuffers.get(gl);\n\n  if (updateReadTarget) currentReadFrameBuffers.set(gl, targetFrameBuffer);\n  if (updateWriteTarget) currentDrawFrameBuffers.set(gl, targetFrameBuffer);\n\n  if (updateReadTarget || updateWriteTarget) {\n    const targetToUpdate =\n      updateReadTarget && updateWriteTarget\n        ? GL.FRAMEBUFFER\n        : updateReadTarget\n          ? GL.READ_FRAMEBUFFER\n          : GL.DRAW_FRAMEBUFFER;\n    gl.bindFramebuffer(targetToUpdate, targetFrameBuffer);\n  }\n};\n\n/** @internal */\nexport const NullTexture: Texture = {\n  clear: () => {},\n  setUniform: () => {},\n  target: () => null,\n  delete: () => {},\n  width: 0,\n  height: 0,\n};\n\n/** @internal */\nexport const createTexture = (\n  gl: WebGL2RenderingContext,\n  { textureIndex, internalFormat, width, height, data, min = GL.NEAREST, mag = GL.NEAREST }: TextureSpecification,\n): Texture => {\n  if (GL_DEBUG && !(0 <= textureIndex && textureIndex <= gl.getParameter(GL.MAX_COMBINED_TEXTURE_IMAGE_UNITS)))\n    Logger.warn(\n      'kinGLy exception: WebGL2 is guaranteed to support at least 32 textures but not necessarily more than that',\n    );\n\n  const srcFormat = textureSrcFormatLookup[internalFormat] ?? NaN;\n  const type = textureTypeLookup[internalFormat] ?? NaN;\n  const texture = gl.createTexture();\n\n  const setTextureContents = () => {\n    gl.activeTexture(GL.TEXTURE0 + textureIndex); // this causes that the `gl.texParameteri`, relying on the notion of \"active texture\", applies to the texture\n    gl.bindTexture(GL.TEXTURE_2D, texture); // this causes that the below `gl.activeTexture` knows which texture we associate to the textureIndex\n    gl.texImage2D(GL.TEXTURE_2D, 0, internalFormat, width, height, 0, srcFormat, type, data); // setting `data` and some other props on the texture\n  };\n\n  setTextureContents();\n\n  // for precise texture pixel reading, even the use of `texelFetch` requires that these be set to `nearest`\n  // also when using float textures, a mandatory part of WebGL2, are not texture filterable by default (without possibly unavailable extensions)\n  gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_MIN_FILTER, min);\n  gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_MAG_FILTER, mag);\n  gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_WRAP_S, GL.CLAMP_TO_EDGE);\n  gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_WRAP_T, GL.CLAMP_TO_EDGE);\n\n  if (GL_DEBUG) {\n    const error = gl.getError(); // todo add getErrors to more places\n    if (error !== gl.NO_ERROR && error !== gl.CONTEXT_LOST_WEBGL)\n      Logger.warn(`kinGLy exception: failed to set the texture with texImage2D, code ${error}`);\n  }\n\n  let frameBuffer: WebGLFramebuffer | null = null; // caching the target framebuffer\n\n  const getTarget = () => {\n    if (!frameBuffer) {\n      frameBuffer = gl.createFramebuffer();\n      bindFramebuffer(gl, GL.DRAW_FRAMEBUFFER, frameBuffer);\n      gl.framebufferTexture2D(GL.FRAMEBUFFER, GL.COLOR_ATTACHMENT0, GL.TEXTURE_2D, texture, 0);\n      if (GL_DEBUG) {\n        const framebufferStatus = gl.checkFramebufferStatus(GL.DRAW_FRAMEBUFFER);\n        if (framebufferStatus !== GL.FRAMEBUFFER_COMPLETE) {\n          Logger.warn(`kinGLy exception: target framebuffer is not complete`);\n        }\n      }\n    }\n    return frameBuffer;\n  };\n\n  return {\n    clear: () => {\n      bindFramebuffer(gl, GL.DRAW_FRAMEBUFFER, getTarget());\n      clearRect(gl, { color: [0, 0, 0, 0] }); // alternatives: texImage2D/texSubImage2D/render\n    },\n    setUniform: (location: WebGLUniformLocation) => gl.uniform1i(location, textureIndex),\n    target: getTarget,\n    delete: (): true => {\n      if (frameBuffer) {\n        if (currentReadFrameBuffers.get(gl) === frameBuffer) bindFramebuffer(gl, GL.READ_FRAMEBUFFER, null);\n        if (currentDrawFrameBuffers.get(gl) === frameBuffer) bindFramebuffer(gl, GL.DRAW_FRAMEBUFFER, null);\n        gl.deleteFramebuffer(frameBuffer);\n      }\n      gl.deleteTexture(texture);\n      return true; // success\n    },\n    width,\n    height,\n  };\n};\n\nconst pickPixel = new Uint8Array(4);\n\n/** @internal */\nexport const readPixel = (gl: WebGL2RenderingContext, canvasX: GLint, canvasY: GLint) => {\n  gl.readPixels(canvasX, canvasY, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pickPixel); // todo use bound FB/texture values to determine the 5th and 6th args\n  return pickPixel;\n};\n\n/****************\n * Attributes\n ***************/\n\n// todo extend these with other attrib types, though we only ever use vec4 atm\nconst attribSizeLookup = { [GL.FLOAT_VEC2]: 2, [GL.FLOAT_VEC4]: 4, [GL.FLOAT]: 1, [GL.INT]: 1 };\nconst attribElementTypeLookup = {\n  [GL.FLOAT_VEC2]: GL.FLOAT,\n  [GL.FLOAT_VEC4]: GL.FLOAT,\n  [GL.FLOAT]: GL.FLOAT,\n  [GL.INT]: GL.INT,\n};\n\nconst integerTypes = new Set([GL.BYTE, GL.SHORT, GL.INT, GL.UNSIGNED_BYTE, GL.UNSIGNED_SHORT, GL.UNSIGNED_INT]);\n\n/** @internal */\nexport const getAttributes = (\n  gl: WebGL2RenderingContext,\n  program: WebGLProgram,\n  attributeLocations: Record<string, GLuint>,\n): Attributes =>\n  new Map(\n    [...new Array(gl.getProgramParameter(program, GL.ACTIVE_ATTRIBUTES) /* attributesCount */)].map((_, index) => {\n      const normalize = false; // don't normalize the data\n      const stride = 0; // default 0 = move forward size * sizeof(type) each iteration to get the next position\n      const offset = 0; // start at the beginning of the buffer\n\n      const activeAttribInfo = gl.getActiveAttrib(program, index);\n      if (!activeAttribInfo) throw new Error(`kinGLy exception: active attribute info could not be read`); // just appeasing the TS linter\n      const { name, type } = activeAttribInfo;\n      if (name.startsWith('gl_')) return [name, () => {}]; // only populate expressly supplied attributes, NOT gl_VertexID or gl_InstanceID\n\n      const location = attributeLocations[name] ?? NaN;\n      const buffer = gl.createBuffer();\n      gl.bindBuffer(GL.ARRAY_BUFFER, buffer);\n      gl.enableVertexAttribArray(location);\n      const attribSize = attribSizeLookup[type] ?? NaN;\n      const attribElementType = attribElementTypeLookup[type] ?? NaN;\n      if (GL_DEBUG && (attribSize === undefined || attribElementType === undefined))\n        throw new Error(`Attribute type ${type} is not yet properly covered`);\n      if (integerTypes.has(attribElementType)) {\n        gl.vertexAttribIPointer(location, attribSize, GL.INT, stride, offset);\n      } else {\n        gl.vertexAttribPointer(location, attribSize, GL.FLOAT, normalize, stride, offset);\n      }\n\n      const setValue = (data: ArrayBufferView) => {\n        gl.bindBuffer(GL.ARRAY_BUFFER, buffer);\n        gl.bufferData(GL.ARRAY_BUFFER, data, GL.STATIC_DRAW);\n      };\n\n      return [name, setValue];\n    }),\n  );\n\n/** @internal */\nexport const bindVertexArray = (gl: WebGL2RenderingContext, vertexArrayObject: WebGLVertexArrayObject | null) => {\n  if (vertexArrayObject !== currentVertexArrayObjects.get(gl)) {\n    currentVertexArrayObjects.set(gl, vertexArrayObject);\n    gl.bindVertexArray(vertexArrayObject);\n  }\n};\n\n/****************\n * Rendering\n ***************/\n\n/**\n * Ensures that the draw calls will operate under the desired state (context flags, bound attribs)\n * @internal\n */\nexport const getRenderer = (\n  gl: WebGL2RenderingContext,\n  program: WebGLProgram,\n  vao: WebGLVertexArrayObject | null,\n  { depthTest = false, blend = true, frontFace = GL.CCW },\n): Render => {\n  const uniforms = getUniforms(gl, program);\n  return ({ uniformValues, viewport, target, clear, scissor, draw }: UseInfo): void => {\n    if (!setGlobalConstants.has(gl)) {\n      setGlobalConstants.add(gl);\n      currentFlags.set(gl, { [GL.DITHER]: true }); // upon context initialization, only the dither flag is enabled by WebGL\n      // blending controls how semitransparent pixels compose with previously painted pixels; it's the \"normal\" CSS default like blending, can be tweaked like in CSS\n      gl.blendFuncSeparate(GL.SRC_ALPHA, GL.ONE_MINUS_SRC_ALPHA, 1, 1);\n      gl.blendEquation(GL.FUNC_ADD);\n\n      // dither off means, don't slow down and alter colors for an illusion of a broader palette (the only GL state variable that's ON by default)\n      flagSet(gl, GL.DITHER, false);\n\n      // depth defaults for when GL.DEPTH_TEST is enabled\n      gl.depthMask(true);\n      gl.depthFunc(GL.LESS);\n      gl.depthRange(0, 1);\n\n      // set polygon vertex order convention\n      gl.frontFace(frontFace);\n\n      // don't render both sides of a triangle (it's dependent on the cw/ccw convention set above)\n      flagSet(gl, GL.CULL_FACE, true);\n      gl.cullFace(GL.BACK);\n\n      // hints\n      gl.hint(GL.FRAGMENT_SHADER_DERIVATIVE_HINT, GL.NICEST); // doesn't seem to make a difference on OS X\n    }\n\n    // depth test means that pixels from a triangle do not paint over preexisting pixels coming from triangles that are closer to the viewer\n    if (depthTest !== currentDepthTests.get(gl)) {\n      currentDepthTests.set(gl, depthTest);\n      flagSet(gl, GL.DEPTH_TEST, depthTest);\n    }\n\n    flagSet(gl, GL.BLEND, blend);\n\n    if (program !== currentPrograms.get(gl)) {\n      currentPrograms.set(gl, program);\n      gl.useProgram(program);\n    }\n\n    if (vao) bindVertexArray(gl, vao);\n\n    if (viewport) setViewport(gl, viewport.x, viewport.y, viewport.width, viewport.height);\n    if (uniformValues) {\n      uniforms.forEach((setValue, name) => uniformValues[name] && setValue(uniformValues[name]));\n    }\n\n    bindFramebuffer(gl, GL.DRAW_FRAMEBUFFER, target);\n\n    if (clear) clearRect(gl, clear);\n\n    if (draw) {\n      // constrain clearing to a rectangle if needed\n      flagSet(gl, GL.SCISSOR_TEST, scissor !== undefined); // allow operation in a specific rectangular area\n      if (scissor) {\n        setScissor(gl, ...scissor); // only operate in this rectangle\n      }\n\n      gl.drawArraysInstanced(draw.geom, draw.offset, draw.count, draw.instanceCount || 1);\n    }\n  };\n};\n\n/***********************\n *\n * Handle context loss\n *\n **********************/\n\n/*\nconst flushErrors = (gl: WebGL2RenderingContext, text: string) => {\n  let hasError;\n  let hasShownError = false;\n  do {\n    const error = gl.getError();\n    hasError = error !== gl.NO_ERROR && error !== gl.CONTEXT_LOST_WEBGL;\n    if (hasError) {\n      if (!hasShownError) {\n        // eslint-disable-next-line no-console\n        console.warn(`GL error(s) shown before ${text}`);\n        hasShownError = true;\n      }\n      // eslint-disable-next-line no-console\n      console.warn(`GL error: ${error}`);\n    }\n  } while (hasError); // clear the error code\n};\n*/\n\n/** @internal */\nexport const testContextLoss = (gl: WebGL2RenderingContext) => {\n  // simulates a context loss at `lossTimeMs` and context recovery at `regainTimeMs` after that\n  const lossTimeMs = 5000;\n  const regainTimeMs = 0;\n  const ext = gl.getExtension('WEBGL_lose_context');\n  if (ext) {\n    window.setInterval(() => {\n      // eslint-disable-next-line no-console\n      console.log('Context loss test triggered, the webgl rendering will freeze or disappear');\n      ext.loseContext();\n      window.setTimeout(() => ext.restoreContext(), regainTimeMs);\n    }, lossTimeMs);\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function logarithm(base: number, y: number) {\n  return Math.log(y) / Math.log(base);\n}\n\n/**\n * Computes the min and max values of an array of numbers\n * @internal\n */\nexport function extent(array: number[]): [min: number, max: number] {\n  const len = array.length;\n  let min = Infinity;\n  let max = -Infinity;\n  for (let i = 0; i < len; i += 1) {\n    const value = array[i] ?? NaN;\n    if (min > value) min = value;\n    if (max < value) max = value;\n  }\n  return [min, max];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { ScaleBand } from '../scales';\nimport { GroupBySpec } from '../specs/group_by';\nimport { safeFormat } from '../utils/common';\nimport { Dimensions, Size } from '../utils/dimensions';\nimport { OrdinalDomain } from '../utils/domain';\nimport { Point } from '../utils/point';\n\ntype Value = string | number;\n\n/** @internal */\nexport interface PerPanelMap {\n  panelAnchor: Point;\n  horizontalValue: NonNullable<PrimitiveValue>;\n  verticalValue: NonNullable<PrimitiveValue>;\n}\n\n/** @internal */\nexport interface SmallMultipleScales {\n  horizontal: ScaleBand;\n  vertical: ScaleBand;\n}\n\n/** @internal */\nexport interface SmallMultiplesGroupBy {\n  vertical?: GroupBySpec;\n  horizontal?: GroupBySpec;\n}\n\n/** @internal */\nexport interface SmallMultiplesSeriesDomains {\n  smVDomain: OrdinalDomain;\n  smHDomain: OrdinalDomain;\n}\n\n/** @public */\nexport interface SmallMultiplesDatum {\n  smHorizontalAccessorValue?: NonNullable<PrimitiveValue>;\n  smVerticalAccessorValue?: NonNullable<PrimitiveValue>;\n}\n\n/** @internal */\nexport function getPerPanelMap<T>(\n  scales: SmallMultipleScales,\n  fn: (anchor: Point, horizontalValue: Value, verticalValue: Value, smScales: SmallMultipleScales) => T | null,\n): Array<T & PerPanelMap> {\n  const { horizontal, vertical } = scales;\n  return vertical.domain.reduce<Array<T & PerPanelMap>>((acc, verticalValue) => {\n    return [\n      ...acc,\n      ...horizontal.domain.reduce<Array<T & PerPanelMap>>((hAcc, horizontalValue) => {\n        const panelAnchor: Point = {\n          x: horizontal.scale(horizontalValue) || 0,\n          y: vertical.scale(verticalValue) || 0,\n        };\n        const fnReturn = fn(panelAnchor, horizontalValue, verticalValue, scales);\n        return fnReturn ? [...hAcc, { panelAnchor, horizontalValue, verticalValue, ...fnReturn }] : hAcc;\n      }, []),\n    ];\n  }, []);\n}\n\n/** @internal */\nexport function getPanelSize({ horizontal, vertical }: SmallMultipleScales): Size {\n  return { width: horizontal.bandwidth, height: vertical.bandwidth };\n}\n\n/**\n * returns true for scales with empty input domains\n * TODO: Cleanup See https://github.com/elastic/elastic-charts/issues/1990\n * @internal\n */\nexport const hasSMDomain = ({ domain }: SmallMultipleScales['horizontal'] | SmallMultipleScales['vertical']) =>\n  domain.length > 0 && domain[0] !== undefined;\n\n/** @internal */\nexport const getPanelTitle = (\n  isVertical: boolean,\n  verticalValue: NonNullable<PrimitiveValue>,\n  horizontalValue: NonNullable<PrimitiveValue>,\n  groupBy?: SmallMultiplesGroupBy,\n): string => {\n  return isVertical\n    ? safeFormat(`${verticalValue}`, groupBy?.vertical?.format)\n    : safeFormat(`${horizontalValue}`, groupBy?.horizontal?.format);\n};\n\n/**\n * Returns true if pointer is within a panel inside the chart area, otherwise false\n * Returns false when pointer is in the padding gutter and axes\n * @internal\n */\nexport const isPointerOverPanelFn =\n  (smScales: SmallMultipleScales, chartDimensions: Dimensions, gridStroke: number) =>\n  (pointer: Point): boolean => {\n    return (\n      isPointerInsideChart(chartDimensions)(pointer) &&\n      isPointerInBandwidth(smScales.horizontal, pointer.x - chartDimensions.left, gridStroke) &&\n      isPointerInBandwidth(smScales.vertical, pointer.y - chartDimensions.top, gridStroke)\n    );\n  };\n\nfunction isPointerInBandwidth(\n  scale: SmallMultipleScales['horizontal'] | SmallMultipleScales['vertical'],\n  dimension: number,\n  gridStroke: number,\n): boolean {\n  const { bandwidth, innerPadding } = scale;\n  const padding = innerPadding * bandwidth;\n  const divisor = bandwidth + padding + gridStroke * 2;\n  const vDiv = Math.floor(dimension / divisor);\n  const lower = vDiv * divisor;\n  const upper = lower + bandwidth + gridStroke * 2;\n\n  return dimension > lower && dimension <= upper;\n}\n\n/**\n * Returns true if the pointer is within the chart dimensions, false otherwise\n * @internal\n */\nexport const isPointerInsideChart =\n  ({ left, top, height, width }: Dimensions) =>\n  ({ x, y }: Point): boolean =>\n    x > left && x < left + width && y > top && y < top + height;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const Predicate = Object.freeze({\n  NumAsc: 'numAsc' as const,\n  NumDesc: 'numDesc' as const,\n  AlphaAsc: 'alphaAsc' as const,\n  AlphaDesc: 'alphaDesc' as const,\n  DataIndex: 'dataIndex' as const,\n});\n\n/** @public */\nexport type Predicate = $Values<typeof Predicate>;\n\n/** @internal */\nexport function getPredicateFn<T>(predicate: Predicate, locale: string, accessor?: keyof T): (a: T, b: T) => number {\n  switch (predicate) {\n    case 'alphaAsc':\n      return (a: T, b: T) => {\n        const aValue = String(accessor ? a[accessor] : a);\n        const bValue = String(accessor ? b[accessor] : b);\n        return aValue.localeCompare(bValue, locale);\n      };\n    case 'alphaDesc':\n      return (a: T, b: T) => {\n        const aValue = String(accessor ? a[accessor] : a);\n        const bValue = String(accessor ? b[accessor] : b);\n        return bValue.localeCompare(aValue, locale);\n      };\n    case 'numDesc':\n      return (a: T, b: T) => {\n        const aValue = Number(accessor ? a[accessor] : a);\n        const bValue = Number(accessor ? b[accessor] : b);\n        return bValue - aValue;\n      };\n    case 'numAsc':\n      return (a: T, b: T) => {\n        const aValue = Number(accessor ? a[accessor] : a);\n        const bValue = Number(accessor ? b[accessor] : b);\n        return aValue - bValue;\n      };\n    case 'dataIndex':\n      return () => 0;\n  }\n}\n\n/** @internal */\nexport const hasKey = <T extends Record<string, unknown>>(obj: T, key: string): key is string & keyof T =>\n  obj.hasOwnProperty(key);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CategoryKey } from './category';\nimport { SpecId } from '../utils/ids';\n\n/**\n * A string key used to uniquely identify a series\n * @public\n */\nexport type SeriesKey = CategoryKey;\n\n/**\n * A series identifier\n * @public\n */\nexport type SeriesIdentifier = {\n  /**\n   * The SpecId, used to identify the spec\n   */\n  specId: SpecId;\n  /**\n   * A string key used to uniquely identify a series\n   */\n  key: SeriesKey;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values as Values } from 'utility-types';\n\nimport { Color } from './colors';\nimport { Pixels, Rectangle } from './geometry';\nimport { ArrayEntry } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { integerSnap, monotonicHillClimb } from '../solvers/monotonic_hill_climb';\nimport { TextMeasure } from '../utils/bbox/canvas_text_bbox_calculator';\nimport { Datum } from '../utils/common';\n\nconst FONT_WEIGHTS_NUMERIC = [100, 200, 300, 400, 500, 600, 700, 800, 900];\nconst FONT_WEIGHTS_ALPHA = ['normal', 'bold', 'lighter', 'bolder', 'inherit', 'initial', 'unset'];\n\n/**\n * todo consider doing tighter control for permissible font families, eg. as in Kibana Canvas - expression language\n *  - though the same applies for permissible (eg. known available or loaded) font weights, styles, variants...\n * @public\n */\nexport type FontFamily = string;\n/** @public */\nexport const FONT_WEIGHTS = Object.freeze([...FONT_WEIGHTS_NUMERIC, ...FONT_WEIGHTS_ALPHA] as const);\n/** @public */\nexport const FONT_VARIANTS = Object.freeze(['normal', 'small-caps'] as const);\n/** @public */\nexport type FontVariant = (typeof FONT_VARIANTS)[number];\n/** @public */\nexport type FontWeight = (typeof FONT_WEIGHTS)[number];\n/** @public */\nexport const FONT_STYLES = Object.freeze(['normal', 'italic', 'oblique', 'inherit', 'initial', 'unset'] as const);\n/** @public */\nexport type FontStyle = (typeof FONT_STYLES)[number];\n/** @public */\nexport type PartialFont = Partial<Font>;\n/** @public */\nexport const TEXT_ALIGNS = Object.freeze(['start', 'end', 'left', 'right', 'center'] as const);\n/** @public */\nexport type TextAlign = (typeof TEXT_ALIGNS)[number];\n/** @public */\nexport type TextBaseline = (typeof TEXT_BASELINE)[number];\n\n/** @internal */\nexport type VerticalAlignments = Values<typeof VerticalAlignments>;\n/** @internal */\nexport type Relation = Array<Datum>;\n\n/**\n * this doesn't include the font size, so it's more like a font face (?) - unfortunately all vague terms\n * @public\n */\nexport interface Font {\n  fontStyle: FontStyle;\n  fontVariant: FontVariant;\n  fontWeight: FontWeight;\n  fontFamily: FontFamily;\n  textColor: Color;\n}\n\n/** @public */\nexport const TEXT_BASELINE = Object.freeze([\n  'top',\n  'hanging',\n  'middle',\n  'alphabetic',\n  'ideographic',\n  'bottom',\n] as const);\n\n/** @internal */\nexport interface Box extends Font {\n  text: string;\n  isValue: boolean;\n}\n\n/** @internal */\nexport interface Part extends Rectangle {\n  node: ArrayEntry;\n}\n\n/** @internal */\nexport function cssFontShorthand(\n  { fontStyle, fontVariant, fontWeight, fontFamily }: Omit<Font, 'textColor'>,\n  fontSize: Pixels,\n) {\n  return `${fontStyle} ${fontVariant} ${fontWeight} ${fontSize}px ${fontFamily}`;\n}\n\n/** @internal */\nexport const VerticalAlignments = Object.freeze({\n  top: 'top' as const,\n  middle: 'middle' as const,\n  bottom: 'bottom' as const,\n  alphabetic: 'alphabetic' as const,\n  hanging: 'hanging' as const,\n  ideographic: 'ideographic' as const,\n});\n\n/** @internal */\nexport const HorizontalAlignment = Object.freeze({\n  left: 'left' as const,\n  center: 'center' as const,\n  right: 'right' as const,\n});\n/** @internal */\nexport type HorizontalAlignment = Values<typeof HorizontalAlignment>;\n\n/** @internal */\nexport function measureOneBoxWidth(measure: TextMeasure, fontSize: number, box: Box) {\n  return measure(box.text, box, fontSize).width;\n}\n\n/** @internal */\nexport function cutToLength(s: string, maxLength: number) {\n  return s.length <= maxLength ? s : `${s.slice(0, Math.max(0, maxLength - 1))}…`; // ellipsis is one char\n}\n\n/** @internal */\nexport function fitText(\n  measure: TextMeasure,\n  desiredText: string,\n  allottedWidth: number,\n  fontSize: number,\n  font: Font,\n) {\n  const desiredLength = desiredText.length;\n  const response = (v: number) => measure(desiredText.slice(0, Math.max(0, v)), font, fontSize).width;\n  const visibleLength = monotonicHillClimb(response, desiredLength, allottedWidth, integerSnap);\n  const text = visibleLength < 2 && desiredLength >= 2 ? '' : cutToLength(desiredText, visibleLength);\n  const { width } = measure(text, font, fontSize);\n  return { width, text };\n}\n\n/** @internal */\nexport function maximiseFontSize(\n  measure: TextMeasure,\n  text: string,\n  font: Font,\n  minFontSize: Pixels,\n  maxFontSize: Pixels,\n  boxWidth: Pixels,\n  boxHeight: Pixels,\n): Pixels {\n  const response = (fontSize: number) => {\n    const { width } = measure(text, font, fontSize);\n    const widthDiff = boxWidth - width;\n    const heightDiff = boxHeight - fontSize;\n    return -Math.min(widthDiff, heightDiff);\n  };\n  return monotonicHillClimb(response, maxFontSize, 0, integerSnap, minFontSize);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Radian } from './geometry';\n\n/** @internal */\nexport type Vec2 = [number, number];\n\n/**\n * Rotate a Vec2 vector by radians\n * @internal\n */\nexport function rotate2(radian: Radian, vector: Vec2): Vec2 {\n  return [\n    Math.cos(radian) * vector[0] - Math.sin(radian) * vector[1],\n    Math.sin(radian) * vector[0] + Math.cos(radian) * vector[1],\n  ];\n}\n\n/**\n * Subtract vector b from a\n * @internal\n */\nexport function sub2(a: Vec2, b: Vec2): Vec2 {\n  return [a[0] - b[0], a[1] - b[1]];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RgbTuple } from './color_library_wrappers';\n\nfunction sRGBtoLin(colorChannel: number) {\n  // Send this function a decimal sRGB gamma encoded color value\n  // between 0.0 and 1.0, and it returns a linearized value.\n  return colorChannel <= 0.03928 ? colorChannel / 12.92 : Math.pow((colorChannel + 0.055) / 1.055, 2.4);\n}\n\nfunction getLuminance([r, g, b]: RgbTuple) {\n  const vR = r / 255;\n  const vG = g / 255;\n  const vB = b / 255;\n  return 0.2126 * sRGBtoLin(vR) + 0.7152 * sRGBtoLin(vG) + 0.0722 * sRGBtoLin(vB);\n}\n\n/** @internal */\nexport function getWCAG2ContrastRatio(foreground: RgbTuple, background: RgbTuple) {\n  const lumA = getLuminance(foreground);\n  const lumB = getLuminance(background);\n\n  return lumA >= lumB ? (lumA + 0.05) / (lumB + 0.05) : (lumB + 0.05) / (lumA + 0.05);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/**\n * WebGL uses integers (GLUInt, just a number in JS) as fake enums (mostly) for WebGL API function call parameters.\n * While it's possible to use the integer code directly, there's documentational value in naming them, in line with specs.\n * WebGL queries, typically run for exception handling and debugging situations, often return such \"enums\" too.\n * By having the number here, it's easy to search for the meaning, though it's possible to do it on the web too.\n * Most of these constants aren't currently used, but it'd be tedious to add them one by one.\n *\n * Note that there are functions (currently, `gl.activeTexture`) that take an \"enum\" but then add offset numbers to it.\n */\n\n/** @internal */\nexport const GL = {\n  DEPTH_BUFFER_BIT: 256,\n  STENCIL_BUFFER_BIT: 1024,\n  COLOR_BUFFER_BIT: 16384,\n  POINTS: 0,\n  LINES: 1,\n  LINE_LOOP: 2,\n  LINE_STRIP: 3,\n  TRIANGLES: 4,\n  TRIANGLE_STRIP: 5,\n  TRIANGLE_FAN: 6,\n  ZERO: 0,\n  ONE: 1,\n  SRC_COLOR: 768,\n  ONE_MINUS_SRC_COLOR: 769,\n  SRC_ALPHA: 770,\n  ONE_MINUS_SRC_ALPHA: 771,\n  DST_ALPHA: 772,\n  ONE_MINUS_DST_ALPHA: 773,\n  DST_COLOR: 774,\n  ONE_MINUS_DST_COLOR: 775,\n  SRC_ALPHA_SATURATE: 776,\n  FUNC_ADD: 32774,\n  BLEND_EQUATION: 32777,\n  BLEND_EQUATION_RGB: 32777,\n  BLEND_EQUATION_ALPHA: 34877,\n  FUNC_SUBTRACT: 32778,\n  FUNC_REVERSE_SUBTRACT: 32779,\n  BLEND_DST_RGB: 32968,\n  BLEND_SRC_RGB: 32969,\n  BLEND_DST_ALPHA: 32970,\n  BLEND_SRC_ALPHA: 32971,\n  CONSTANT_COLOR: 32769,\n  ONE_MINUS_CONSTANT_COLOR: 32770,\n  CONSTANT_ALPHA: 32771,\n  ONE_MINUS_CONSTANT_ALPHA: 32772,\n  BLEND_COLOR: 32773,\n  ARRAY_BUFFER: 34962,\n  ELEMENT_ARRAY_BUFFER: 34963,\n  ARRAY_BUFFER_BINDING: 34964,\n  ELEMENT_ARRAY_BUFFER_BINDING: 34965,\n  STREAM_DRAW: 35040,\n  STATIC_DRAW: 35044,\n  DYNAMIC_DRAW: 35048,\n  BUFFER_SIZE: 34660,\n  BUFFER_USAGE: 34661,\n  CURRENT_VERTEX_ATTRIB: 34342,\n  FRONT: 1028,\n  BACK: 1029,\n  FRONT_AND_BACK: 1032,\n  TEXTURE_2D: 3553,\n  CULL_FACE: 2884,\n  BLEND: 3042,\n  DITHER: 3024,\n  STENCIL_TEST: 2960,\n  DEPTH_TEST: 2929,\n  SCISSOR_TEST: 3089,\n  POLYGON_OFFSET_FILL: 32823,\n  SAMPLE_ALPHA_TO_COVERAGE: 32926,\n  SAMPLE_COVERAGE: 32928,\n  NO_ERROR: 0,\n  INVALID_ENUM: 1280,\n  INVALID_VALUE: 1281,\n  INVALID_OPERATION: 1282,\n  OUT_OF_MEMORY: 1285,\n  CW: 2304,\n  CCW: 2305,\n  LINE_WIDTH: 2849,\n  ALIASED_POINT_SIZE_RANGE: 33901,\n  ALIASED_LINE_WIDTH_RANGE: 33902,\n  CULL_FACE_MODE: 2885,\n  FRONT_FACE: 2886,\n  DEPTH_RANGE: 2928,\n  DEPTH_WRITEMASK: 2930,\n  DEPTH_CLEAR_VALUE: 2931,\n  DEPTH_FUNC: 2932,\n  STENCIL_CLEAR_VALUE: 2961,\n  STENCIL_FUNC: 2962,\n  STENCIL_FAIL: 2964,\n  STENCIL_PASS_DEPTH_FAIL: 2965,\n  STENCIL_PASS_DEPTH_PASS: 2966,\n  STENCIL_REF: 2967,\n  STENCIL_VALUE_MASK: 2963,\n  STENCIL_WRITEMASK: 2968,\n  STENCIL_BACK_FUNC: 34816,\n  STENCIL_BACK_FAIL: 34817,\n  STENCIL_BACK_PASS_DEPTH_FAIL: 34818,\n  STENCIL_BACK_PASS_DEPTH_PASS: 34819,\n  STENCIL_BACK_REF: 36003,\n  STENCIL_BACK_VALUE_MASK: 36004,\n  STENCIL_BACK_WRITEMASK: 36005,\n  VIEWPORT: 2978,\n  SCISSOR_BOX: 3088,\n  COLOR_CLEAR_VALUE: 3106,\n  COLOR_WRITEMASK: 3107,\n  UNPACK_ALIGNMENT: 3317,\n  PACK_ALIGNMENT: 3333,\n  MAX_TEXTURE_SIZE: 3379,\n  MAX_VIEWPORT_DIMS: 3386,\n  SUBPIXEL_BITS: 3408,\n  RED_BITS: 3410,\n  GREEN_BITS: 3411,\n  BLUE_BITS: 3412,\n  ALPHA_BITS: 3413,\n  DEPTH_BITS: 3414,\n  STENCIL_BITS: 3415,\n  POLYGON_OFFSET_UNITS: 10752,\n  POLYGON_OFFSET_FACTOR: 32824,\n  TEXTURE_BINDING_2D: 32873,\n  SAMPLE_BUFFERS: 32936,\n  SAMPLES: 32937,\n  SAMPLE_COVERAGE_VALUE: 32938,\n  SAMPLE_COVERAGE_INVERT: 32939,\n  COMPRESSED_TEXTURE_FORMATS: 34467,\n  DONT_CARE: 4352,\n  FASTEST: 4353,\n  NICEST: 4354,\n  GENERATE_MIPMAP_HINT: 33170,\n  BYTE: 5120,\n  UNSIGNED_BYTE: 5121,\n  SHORT: 5122,\n  UNSIGNED_SHORT: 5123,\n  INT: 5124,\n  UNSIGNED_INT: 5125,\n  FLOAT: 5126,\n  DEPTH_COMPONENT: 6402,\n  ALPHA: 6406,\n  RGB: 6407,\n  RGBA: 6408,\n  LUMINANCE: 6409,\n  LUMINANCE_ALPHA: 6410,\n  UNSIGNED_SHORT_4_4_4_4: 32819,\n  UNSIGNED_SHORT_5_5_5_1: 32820,\n  UNSIGNED_SHORT_5_6_5: 33635,\n  FRAGMENT_SHADER: 35632,\n  VERTEX_SHADER: 35633,\n  MAX_VERTEX_ATTRIBS: 34921,\n  MAX_VERTEX_UNIFORM_VECTORS: 36347,\n  MAX_VARYING_VECTORS: 36348,\n  MAX_COMBINED_TEXTURE_IMAGE_UNITS: 35661,\n  MAX_VERTEX_TEXTURE_IMAGE_UNITS: 35660,\n  MAX_TEXTURE_IMAGE_UNITS: 34930,\n  MAX_FRAGMENT_UNIFORM_VECTORS: 36349,\n  SHADER_TYPE: 35663,\n  DELETE_STATUS: 35712,\n  LINK_STATUS: 35714,\n  VALIDATE_STATUS: 35715,\n  ATTACHED_SHADERS: 35717,\n  ACTIVE_UNIFORMS: 35718,\n  ACTIVE_ATTRIBUTES: 35721,\n  SHADING_LANGUAGE_VERSION: 35724,\n  CURRENT_PROGRAM: 35725,\n  NEVER: 512,\n  LESS: 513,\n  EQUAL: 514,\n  LEQUAL: 515,\n  GREATER: 516,\n  NOTEQUAL: 517,\n  GEQUAL: 518,\n  ALWAYS: 519,\n  KEEP: 7680,\n  REPLACE: 7681,\n  INCR: 7682,\n  DECR: 7683,\n  INVERT: 5386,\n  INCR_WRAP: 34055,\n  DECR_WRAP: 34056,\n  VENDOR: 7936,\n  RENDERER: 7937,\n  VERSION: 7938,\n  NEAREST: 9728,\n  LINEAR: 9729,\n  NEAREST_MIPMAP_NEAREST: 9984,\n  LINEAR_MIPMAP_NEAREST: 9985,\n  NEAREST_MIPMAP_LINEAR: 9986,\n  LINEAR_MIPMAP_LINEAR: 9987,\n  TEXTURE_MAG_FILTER: 10240,\n  TEXTURE_MIN_FILTER: 10241,\n  TEXTURE_WRAP_S: 10242,\n  TEXTURE_WRAP_T: 10243,\n  TEXTURE: 5890,\n  TEXTURE_CUBE_MAP: 34067,\n  TEXTURE_BINDING_CUBE_MAP: 34068,\n  TEXTURE_CUBE_MAP_POSITIVE_X: 34069,\n  TEXTURE_CUBE_MAP_NEGATIVE_X: 34070,\n  TEXTURE_CUBE_MAP_POSITIVE_Y: 34071,\n  TEXTURE_CUBE_MAP_NEGATIVE_Y: 34072,\n  TEXTURE_CUBE_MAP_POSITIVE_Z: 34073,\n  TEXTURE_CUBE_MAP_NEGATIVE_Z: 34074,\n  MAX_CUBE_MAP_TEXTURE_SIZE: 34076,\n  TEXTURE0: 33984,\n  TEXTURE1: 33985,\n  TEXTURE2: 33986,\n  TEXTURE3: 33987,\n  TEXTURE4: 33988,\n  TEXTURE5: 33989,\n  TEXTURE6: 33990,\n  TEXTURE7: 33991,\n  TEXTURE8: 33992,\n  TEXTURE9: 33993,\n  TEXTURE10: 33994,\n  TEXTURE11: 33995,\n  TEXTURE12: 33996,\n  TEXTURE13: 33997,\n  TEXTURE14: 33998,\n  TEXTURE15: 33999,\n  TEXTURE16: 34000,\n  TEXTURE17: 34001,\n  TEXTURE18: 34002,\n  TEXTURE19: 34003,\n  TEXTURE20: 34004,\n  TEXTURE21: 34005,\n  TEXTURE22: 34006,\n  TEXTURE23: 34007,\n  TEXTURE24: 34008,\n  TEXTURE25: 34009,\n  TEXTURE26: 34010,\n  TEXTURE27: 34011,\n  TEXTURE28: 34012,\n  TEXTURE29: 34013,\n  TEXTURE30: 34014,\n  TEXTURE31: 34015,\n  ACTIVE_TEXTURE: 34016,\n  REPEAT: 10497,\n  CLAMP_TO_EDGE: 33071,\n  MIRRORED_REPEAT: 33648,\n  FLOAT_VEC2: 35664,\n  FLOAT_VEC3: 35665,\n  FLOAT_VEC4: 35666,\n  INT_VEC2: 35667,\n  INT_VEC3: 35668,\n  INT_VEC4: 35669,\n  BOOL: 35670,\n  BOOL_VEC2: 35671,\n  BOOL_VEC3: 35672,\n  BOOL_VEC4: 35673,\n  FLOAT_MAT2: 35674,\n  FLOAT_MAT3: 35675,\n  FLOAT_MAT4: 35676,\n  SAMPLER_2D: 35678,\n  SAMPLER_CUBE: 35680,\n  VERTEX_ATTRIB_ARRAY_ENABLED: 34338,\n  VERTEX_ATTRIB_ARRAY_SIZE: 34339,\n  VERTEX_ATTRIB_ARRAY_STRIDE: 34340,\n  VERTEX_ATTRIB_ARRAY_TYPE: 34341,\n  VERTEX_ATTRIB_ARRAY_NORMALIZED: 34922,\n  VERTEX_ATTRIB_ARRAY_POINTER: 34373,\n  VERTEX_ATTRIB_ARRAY_BUFFER_BINDING: 34975,\n  IMPLEMENTATION_COLOR_READ_TYPE: 35738,\n  IMPLEMENTATION_COLOR_READ_FORMAT: 35739,\n  COMPILE_STATUS: 35713,\n  LOW_FLOAT: 36336,\n  MEDIUM_FLOAT: 36337,\n  HIGH_FLOAT: 36338,\n  LOW_INT: 36339,\n  MEDIUM_INT: 36340,\n  HIGH_INT: 36341,\n  FRAMEBUFFER: 36160,\n  RENDERBUFFER: 36161,\n  RGBA4: 32854,\n  RGB5_A1: 32855,\n  RGB565: 36194,\n  DEPTH_COMPONENT16: 33189,\n  STENCIL_INDEX8: 36168,\n  DEPTH_STENCIL: 34041,\n  RENDERBUFFER_WIDTH: 36162,\n  RENDERBUFFER_HEIGHT: 36163,\n  RENDERBUFFER_INTERNAL_FORMAT: 36164,\n  RENDERBUFFER_RED_SIZE: 36176,\n  RENDERBUFFER_GREEN_SIZE: 36177,\n  RENDERBUFFER_BLUE_SIZE: 36178,\n  RENDERBUFFER_ALPHA_SIZE: 36179,\n  RENDERBUFFER_DEPTH_SIZE: 36180,\n  RENDERBUFFER_STENCIL_SIZE: 36181,\n  FRAMEBUFFER_ATTACHMENT_OBJECT_TYPE: 36048,\n  FRAMEBUFFER_ATTACHMENT_OBJECT_NAME: 36049,\n  FRAMEBUFFER_ATTACHMENT_TEXTURE_LEVEL: 36050,\n  FRAMEBUFFER_ATTACHMENT_TEXTURE_CUBE_MAP_FACE: 36051,\n  COLOR_ATTACHMENT0: 36064,\n  DEPTH_ATTACHMENT: 36096,\n  STENCIL_ATTACHMENT: 36128,\n  DEPTH_STENCIL_ATTACHMENT: 33306,\n  NONE: 0,\n  FRAMEBUFFER_COMPLETE: 36053,\n  FRAMEBUFFER_INCOMPLETE_ATTACHMENT: 36054,\n  FRAMEBUFFER_INCOMPLETE_MISSING_ATTACHMENT: 36055,\n  FRAMEBUFFER_INCOMPLETE_DIMENSIONS: 36057,\n  FRAMEBUFFER_UNSUPPORTED: 36061,\n  FRAMEBUFFER_BINDING: 36006,\n  RENDERBUFFER_BINDING: 36007,\n  MAX_RENDERBUFFER_SIZE: 34024,\n  INVALID_FRAMEBUFFER_OPERATION: 1286,\n  UNPACK_FLIP_Y_WEBGL: 37440,\n  UNPACK_PREMULTIPLY_ALPHA_WEBGL: 37441,\n  CONTEXT_LOST_WEBGL: 37442,\n  UNPACK_COLORSPACE_CONVERSION_WEBGL: 37443,\n  BROWSER_DEFAULT_WEBGL: 37444,\n  READ_BUFFER: 3074,\n  UNPACK_ROW_LENGTH: 3314,\n  UNPACK_SKIP_ROWS: 3315,\n  UNPACK_SKIP_PIXELS: 3316,\n  PACK_ROW_LENGTH: 3330,\n  PACK_SKIP_ROWS: 3331,\n  PACK_SKIP_PIXELS: 3332,\n  COLOR: 6144,\n  DEPTH: 6145,\n  STENCIL: 6146,\n  RED: 6403,\n  RGB8: 32849,\n  RGBA8: 32856,\n  RGB10_A2: 32857,\n  TEXTURE_BINDING_3D: 32874,\n  UNPACK_SKIP_IMAGES: 32877,\n  UNPACK_IMAGE_HEIGHT: 32878,\n  TEXTURE_3D: 32879,\n  TEXTURE_WRAP_R: 32882,\n  MAX_3D_TEXTURE_SIZE: 32883,\n  UNSIGNED_INT_2_10_10_10_REV: 33640,\n  MAX_ELEMENTS_VERTICES: 33000,\n  MAX_ELEMENTS_INDICES: 33001,\n  TEXTURE_MIN_LOD: 33082,\n  TEXTURE_MAX_LOD: 33083,\n  TEXTURE_BASE_LEVEL: 33084,\n  TEXTURE_MAX_LEVEL: 33085,\n  MIN: 32775,\n  MAX: 32776,\n  DEPTH_COMPONENT24: 33190,\n  MAX_TEXTURE_LOD_BIAS: 34045,\n  TEXTURE_COMPARE_MODE: 34892,\n  TEXTURE_COMPARE_FUNC: 34893,\n  CURRENT_QUERY: 34917,\n  QUERY_RESULT: 34918,\n  QUERY_RESULT_AVAILABLE: 34919,\n  STREAM_READ: 35041,\n  STREAM_COPY: 35042,\n  STATIC_READ: 35045,\n  STATIC_COPY: 35046,\n  DYNAMIC_READ: 35049,\n  DYNAMIC_COPY: 35050,\n  MAX_DRAW_BUFFERS: 34852,\n  DRAW_BUFFER0: 34853,\n  DRAW_BUFFER1: 34854,\n  DRAW_BUFFER2: 34855,\n  DRAW_BUFFER3: 34856,\n  DRAW_BUFFER4: 34857,\n  DRAW_BUFFER5: 34858,\n  DRAW_BUFFER6: 34859,\n  DRAW_BUFFER7: 34860,\n  DRAW_BUFFER8: 34861,\n  DRAW_BUFFER9: 34862,\n  DRAW_BUFFER10: 34863,\n  DRAW_BUFFER11: 34864,\n  DRAW_BUFFER12: 34865,\n  DRAW_BUFFER13: 34866,\n  DRAW_BUFFER14: 34867,\n  DRAW_BUFFER15: 34868,\n  MAX_FRAGMENT_UNIFORM_COMPONENTS: 35657,\n  MAX_VERTEX_UNIFORM_COMPONENTS: 35658,\n  SAMPLER_3D: 35679,\n  SAMPLER_2D_SHADOW: 35682,\n  FRAGMENT_SHADER_DERIVATIVE_HINT: 35723,\n  PIXEL_PACK_BUFFER: 35051,\n  PIXEL_UNPACK_BUFFER: 35052,\n  PIXEL_PACK_BUFFER_BINDING: 35053,\n  PIXEL_UNPACK_BUFFER_BINDING: 35055,\n  SRGB: 35904,\n  SRGB8: 35905,\n  SRGB8_ALPHA8: 35907,\n  COMPARE_REF_TO_TEXTURE: 34894,\n  RGBA32F: 34836,\n  RGB32F: 34837,\n  RGBA16F: 34842,\n  RGB16F: 34843,\n  VERTEX_ATTRIB_ARRAY_INTEGER: 35069,\n  MAX_ARRAY_TEXTURE_LAYERS: 35071,\n  MIN_PROGRAM_TEXEL_OFFSET: 35076,\n  MAX_PROGRAM_TEXEL_OFFSET: 35077,\n  MAX_VARYING_COMPONENTS: 35659,\n  TEXTURE_2D_ARRAY: 35866,\n  TEXTURE_BINDING_2D_ARRAY: 35869,\n  R11F_G11F_B10F: 35898,\n  UNSIGNED_INT_10F_11F_11F_REV: 35899,\n  RGB9_E5: 35901,\n  UNSIGNED_INT_5_9_9_9_REV: 35902,\n  TRANSFORM_FEEDBACK_BUFFER_MODE: 35967,\n  MAX_TRANSFORM_FEEDBACK_SEPARATE_COMPONENTS: 35968,\n  TRANSFORM_FEEDBACK_VARYINGS: 35971,\n  TRANSFORM_FEEDBACK_BUFFER_START: 35972,\n  TRANSFORM_FEEDBACK_BUFFER_SIZE: 35973,\n  TRANSFORM_FEEDBACK_PRIMITIVES_WRITTEN: 35976,\n  RASTERIZER_DISCARD: 35977,\n  MAX_TRANSFORM_FEEDBACK_INTERLEAVED_COMPONENTS: 35978,\n  MAX_TRANSFORM_FEEDBACK_SEPARATE_ATTRIBS: 35979,\n  INTERLEAVED_ATTRIBS: 35980,\n  SEPARATE_ATTRIBS: 35981,\n  TRANSFORM_FEEDBACK_BUFFER: 35982,\n  TRANSFORM_FEEDBACK_BUFFER_BINDING: 35983,\n  RGBA32UI: 36208,\n  RGB32UI: 36209,\n  RGBA16UI: 36214,\n  RGB16UI: 36215,\n  RGBA8UI: 36220,\n  RGB8UI: 36221,\n  RGBA32I: 36226,\n  RGB32I: 36227,\n  RGBA16I: 36232,\n  RGB16I: 36233,\n  RGBA8I: 36238,\n  RGB8I: 36239,\n  RED_INTEGER: 36244,\n  RGB_INTEGER: 36248,\n  RGBA_INTEGER: 36249,\n  SAMPLER_2D_ARRAY: 36289,\n  SAMPLER_2D_ARRAY_SHADOW: 36292,\n  SAMPLER_CUBE_SHADOW: 36293,\n  UNSIGNED_INT_VEC2: 36294,\n  UNSIGNED_INT_VEC3: 36295,\n  UNSIGNED_INT_VEC4: 36296,\n  INT_SAMPLER_2D: 36298,\n  INT_SAMPLER_3D: 36299,\n  INT_SAMPLER_CUBE: 36300,\n  INT_SAMPLER_2D_ARRAY: 36303,\n  UNSIGNED_INT_SAMPLER_2D: 36306,\n  UNSIGNED_INT_SAMPLER_3D: 36307,\n  UNSIGNED_INT_SAMPLER_CUBE: 36308,\n  UNSIGNED_INT_SAMPLER_2D_ARRAY: 36311,\n  DEPTH_COMPONENT32F: 36012,\n  DEPTH32F_STENCIL8: 36013,\n  FLOAT_32_UNSIGNED_INT_24_8_REV: 36269,\n  FRAMEBUFFER_ATTACHMENT_COLOR_ENCODING: 33296,\n  FRAMEBUFFER_ATTACHMENT_COMPONENT_TYPE: 33297,\n  FRAMEBUFFER_ATTACHMENT_RED_SIZE: 33298,\n  FRAMEBUFFER_ATTACHMENT_GREEN_SIZE: 33299,\n  FRAMEBUFFER_ATTACHMENT_BLUE_SIZE: 33300,\n  FRAMEBUFFER_ATTACHMENT_ALPHA_SIZE: 33301,\n  FRAMEBUFFER_ATTACHMENT_DEPTH_SIZE: 33302,\n  FRAMEBUFFER_ATTACHMENT_STENCIL_SIZE: 33303,\n  FRAMEBUFFER_DEFAULT: 33304,\n  UNSIGNED_INT_24_8: 34042,\n  DEPTH24_STENCIL8: 35056,\n  UNSIGNED_NORMALIZED: 35863,\n  DRAW_FRAMEBUFFER_BINDING: 36006,\n  READ_FRAMEBUFFER: 36008,\n  DRAW_FRAMEBUFFER: 36009,\n  READ_FRAMEBUFFER_BINDING: 36010,\n  RENDERBUFFER_SAMPLES: 36011,\n  FRAMEBUFFER_ATTACHMENT_TEXTURE_LAYER: 36052,\n  MAX_COLOR_ATTACHMENTS: 36063,\n  COLOR_ATTACHMENT1: 36065,\n  COLOR_ATTACHMENT2: 36066,\n  COLOR_ATTACHMENT3: 36067,\n  COLOR_ATTACHMENT4: 36068,\n  COLOR_ATTACHMENT5: 36069,\n  COLOR_ATTACHMENT6: 36070,\n  COLOR_ATTACHMENT7: 36071,\n  COLOR_ATTACHMENT8: 36072,\n  COLOR_ATTACHMENT9: 36073,\n  COLOR_ATTACHMENT10: 36074,\n  COLOR_ATTACHMENT11: 36075,\n  COLOR_ATTACHMENT12: 36076,\n  COLOR_ATTACHMENT13: 36077,\n  COLOR_ATTACHMENT14: 36078,\n  COLOR_ATTACHMENT15: 36079,\n  FRAMEBUFFER_INCOMPLETE_MULTISAMPLE: 36182,\n  MAX_SAMPLES: 36183,\n  HALF_FLOAT: 5131,\n  RG: 33319,\n  RG_INTEGER: 33320,\n  R8: 33321,\n  RG8: 33323,\n  R16F: 33325,\n  R32F: 33326,\n  RG16F: 33327,\n  RG32F: 33328,\n  R8I: 33329,\n  R8UI: 33330,\n  R16I: 33331,\n  R16UI: 33332,\n  R32I: 33333,\n  R32UI: 33334,\n  RG8I: 33335,\n  RG8UI: 33336,\n  RG16I: 33337,\n  RG16UI: 33338,\n  RG32I: 33339,\n  RG32UI: 33340,\n  VERTEX_ARRAY_BINDING: 34229,\n  R8_SNORM: 36756,\n  RG8_SNORM: 36757,\n  RGB8_SNORM: 36758,\n  RGBA8_SNORM: 36759,\n  SIGNED_NORMALIZED: 36764,\n  COPY_READ_BUFFER: 36662,\n  COPY_WRITE_BUFFER: 36663,\n  COPY_READ_BUFFER_BINDING: 36662,\n  COPY_WRITE_BUFFER_BINDING: 36663,\n  UNIFORM_BUFFER: 35345,\n  UNIFORM_BUFFER_BINDING: 35368,\n  UNIFORM_BUFFER_START: 35369,\n  UNIFORM_BUFFER_SIZE: 35370,\n  MAX_VERTEX_UNIFORM_BLOCKS: 35371,\n  MAX_FRAGMENT_UNIFORM_BLOCKS: 35373,\n  MAX_COMBINED_UNIFORM_BLOCKS: 35374,\n  MAX_UNIFORM_BUFFER_BINDINGS: 35375,\n  MAX_UNIFORM_BLOCK_SIZE: 35376,\n  MAX_COMBINED_VERTEX_UNIFORM_COMPONENTS: 35377,\n  MAX_COMBINED_FRAGMENT_UNIFORM_COMPONENTS: 35379,\n  UNIFORM_BUFFER_OFFSET_ALIGNMENT: 35380,\n  ACTIVE_UNIFORM_BLOCKS: 35382,\n  UNIFORM_TYPE: 35383,\n  UNIFORM_SIZE: 35384,\n  UNIFORM_BLOCK_INDEX: 35386,\n  UNIFORM_OFFSET: 35387,\n  UNIFORM_ARRAY_STRIDE: 35388,\n  UNIFORM_MATRIX_STRIDE: 35389,\n  UNIFORM_IS_ROW_MAJOR: 35390,\n  UNIFORM_BLOCK_BINDING: 35391,\n  UNIFORM_BLOCK_DATA_SIZE: 35392,\n  UNIFORM_BLOCK_ACTIVE_UNIFORMS: 35394,\n  UNIFORM_BLOCK_ACTIVE_UNIFORM_INDICES: 35395,\n  UNIFORM_BLOCK_REFERENCED_BY_VERTEX_SHADER: 35396,\n  UNIFORM_BLOCK_REFERENCED_BY_FRAGMENT_SHADER: 35398,\n  INVALID_INDEX: 4294967295,\n  MAX_VERTEX_OUTPUT_COMPONENTS: 37154,\n  MAX_FRAGMENT_INPUT_COMPONENTS: 37157,\n  MAX_SERVER_WAIT_TIMEOUT: 37137,\n  OBJECT_TYPE: 37138,\n  SYNC_CONDITION: 37139,\n  SYNC_STATUS: 37140,\n  SYNC_FLAGS: 37141,\n  SYNC_FENCE: 37142,\n  SYNC_GPU_COMMANDS_COMPLETE: 37143,\n  UNSIGNALED: 37144,\n  SIGNALED: 37145,\n  ALREADY_SIGNALED: 37146,\n  TIMEOUT_EXPIRED: 37147,\n  CONDITION_SATISFIED: 37148,\n  WAIT_FAILED: 37149,\n  SYNC_FLUSH_COMMANDS_BIT: 1,\n  VERTEX_ATTRIB_ARRAY_DIVISOR: 35070,\n  ANY_SAMPLES_PASSED: 35887,\n  ANY_SAMPLES_PASSED_CONSERVATIVE: 36202,\n  SAMPLER_BINDING: 35097,\n  RGB10_A2UI: 36975,\n  INT_2_10_10_10_REV: 36255,\n  TRANSFORM_FEEDBACK: 36386,\n  TRANSFORM_FEEDBACK_PAUSED: 36387,\n  TRANSFORM_FEEDBACK_ACTIVE: 36388,\n  TRANSFORM_FEEDBACK_BINDING: 36389,\n  TEXTURE_IMMUTABLE_FORMAT: 37167,\n  MAX_ELEMENT_INDEX: 36203,\n  TEXTURE_IMMUTABLE_LEVELS: 33503,\n  TIMEOUT_IGNORED: -1,\n  MAX_CLIENT_WAIT_TIMEOUT_WEBGL: 37447,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { A11ySettings } from '../../state/selectors/get_accessibility_config';\n\n/** @internal */\nexport function ScreenReaderDescription(props: A11ySettings) {\n  if (!props.description) return null;\n  return <p id={props.descriptionId}>{props.description}</p>;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { Fragment } from 'react';\n\nimport { BandViewModel } from '../../chart_types/goal_chart/layout/types/viewmodel_types';\nimport { A11ySettings } from '../../state/selectors/get_accessibility_config';\n\ninterface GoalSemanticDescriptionProps {\n  bandLabels: BandViewModel[];\n  firstValue: number;\n}\n\n/** @internal */\nexport const GoalSemanticDescription = ({\n  bandLabels,\n  labelId,\n  firstValue,\n}: A11ySettings & GoalSemanticDescriptionProps) => {\n  return bandLabels[0] && bandLabels[0].text.length > 1 ? (\n    <dl className=\"echScreenReaderOnly echGoalDescription\" key={`goalChart--${labelId}`}>\n      {bandLabels.map(({ value, text }, index) => {\n        if (firstValue === value) return;\n        const prevValue = bandLabels[index - 1];\n        return (\n          <Fragment key={`dtdd--${value}--${text[index]}`}>\n            <dt>{`${prevValue?.value ?? firstValue} - ${value}`}</dt>\n            <dd>{`${text[index]}`}</dd>\n          </Fragment>\n        );\n      })}\n    </dl>\n  ) : null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* @internal */\nexport { ScreenReaderSummary } from './screen_reader_summary';\nexport { ScreenReaderPartitionTable } from './partitions_data_table';\nexport { GoalSemanticDescription } from './goal_semantic_description';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { GoalChartLabels } from '../../chart_types/goal_chart/state/selectors/get_goal_chart_data';\nimport { A11ySettings } from '../../state/selectors/get_accessibility_config';\n\ninterface ScreenReaderLabelProps {\n  goalChartLabels?: GoalChartLabels;\n}\n\n/** @internal */\nexport function ScreenReaderLabel({\n  label,\n  labelHeadingLevel,\n  labelId,\n  goalChartLabels,\n}: A11ySettings & ScreenReaderLabelProps) {\n  const Heading = labelHeadingLevel;\n\n  if (!label && !goalChartLabels?.majorLabel && !goalChartLabels?.minorLabel) return null;\n\n  let unifiedLabel = '';\n  if (!label && goalChartLabels?.majorLabel) {\n    unifiedLabel = goalChartLabels?.majorLabel;\n  } else if (label && !goalChartLabels?.majorLabel) {\n    unifiedLabel = label;\n  } else if (label && goalChartLabels?.majorLabel && label !== goalChartLabels?.majorLabel) {\n    unifiedLabel = `${label}; Chart visible label: ${goalChartLabels?.majorLabel}`;\n  }\n\n  return (\n    <>\n      {unifiedLabel && <Heading id={labelId}>{unifiedLabel}</Heading>}\n      {goalChartLabels?.minorLabel && <p>{goalChartLabels?.minorLabel}</p>}\n    </>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { useRef, memo, useState } from 'react';\nimport { connect } from 'react-redux';\n\nimport {\n  getScreenReaderDataSelector,\n  PartitionData,\n} from '../../chart_types/partition_chart/state/selectors/get_screen_reader_data';\nimport { SettingsSpec } from '../../specs/settings';\nimport { GlobalChartState } from '../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../state/selectors/get_accessibility_config';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../state/selectors/get_settings_spec';\nimport { isNil } from '../../utils/common';\n\ninterface ScreenReaderPartitionTableProps {\n  a11ySettings: A11ySettings;\n  partitionData: PartitionData;\n  debug: SettingsSpec['debug'];\n}\n\n// this currently limit the number of pages shown to the user\nconst TABLE_PAGINATION = 20;\n\nconst ScreenReaderPartitionTableComponent = ({\n  a11ySettings,\n  partitionData,\n  debug,\n}: ScreenReaderPartitionTableProps) => {\n  const [count, setCount] = useState(1);\n  const tableRowRef = useRef<HTMLTableRowElement>(null);\n  const { tableCaption } = a11ySettings;\n\n  const rowLimit = TABLE_PAGINATION * count;\n  const handleMoreData = () => {\n    setCount(count + 1);\n    // generate the next group of data\n    if (tableRowRef.current) {\n      tableRowRef.current.focus();\n    }\n  };\n\n  const { isSmallMultiple, data, hasMultipleLayers } = partitionData;\n  const tableLength = data.length;\n  const showMoreRows = rowLimit < tableLength;\n  let countOfCol: number = 3;\n  const totalColumns: number =\n    hasMultipleLayers && isSmallMultiple\n      ? (countOfCol += 3)\n      : hasMultipleLayers || isSmallMultiple\n        ? (countOfCol += 2)\n        : countOfCol;\n\n  return (\n    <div className={`echScreenReaderOnly ${debug ? 'echScreenReaderOnlyDebug' : ''} echScreenReaderTable`}>\n      <table>\n        <caption>\n          {isNil(tableCaption)\n            ? `The table ${\n                showMoreRows\n                  ? `represents only ${rowLimit} of the ${tableLength} data points`\n                  : `fully represents the dataset of ${tableLength} data point${tableLength > 1 ? 's' : ''}`\n              }`\n            : tableCaption}\n        </caption>\n        <thead>\n          <tr>\n            {isSmallMultiple && <th scope=\"col\">Small multiple title</th>}\n            {hasMultipleLayers && <th scope=\"col\">Depth</th>}\n            <th scope=\"col\">Label</th>\n            {hasMultipleLayers && <th scope=\"col\">Parent</th>}\n            <th scope=\"col\">Value</th>\n            <th scope=\"col\">Percentage</th>\n          </tr>\n        </thead>\n\n        <tbody>\n          {partitionData.data\n            .slice(0, rowLimit)\n            .map(({ panelTitle, depth, label, parentName, valueText, percentage }, index) => {\n              return (\n                <tr key={`row--${index}`} ref={rowLimit === index ? tableRowRef : undefined} tabIndex={-1}>\n                  {isSmallMultiple && <td>{panelTitle}</td>}\n                  {hasMultipleLayers && <td>{depth}</td>}\n                  <th scope=\"row\">{label}</th>\n                  {hasMultipleLayers && <td>{parentName}</td>}\n                  <td>{valueText}</td>\n                  <td>{percentage}</td>\n                </tr>\n              );\n            })}\n        </tbody>\n        {showMoreRows && (\n          <tfoot>\n            <tr>\n              <td colSpan={totalColumns}>\n                <button type=\"submit\" onClick={() => handleMoreData()} tabIndex={-1}>\n                  Click to show more data\n                </button>\n              </td>\n            </tr>\n          </tfoot>\n        )}\n      </table>\n    </div>\n  );\n};\n\nconst DEFAULT_SCREEN_READER_SUMMARY = {\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  partitionData: {\n    isSmallMultiple: false,\n    hasMultipleLayers: false,\n    data: [],\n  },\n  debug: false,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ScreenReaderPartitionTableProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_SCREEN_READER_SUMMARY;\n  }\n  return {\n    a11ySettings: getA11ySettingsSelector(state),\n    partitionData: getScreenReaderDataSelector(state),\n    debug: getSettingsSpecSelector(state).debug,\n  };\n};\n/** @internal */\nexport const ScreenReaderPartitionTable = memo(connect(mapStateToProps)(ScreenReaderPartitionTableComponent));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { memo } from 'react';\nimport { connect } from 'react-redux';\n\nimport { ScreenReaderDescription } from './description';\nimport { ScreenReaderLabel } from './label';\nimport { ScreenReaderTypes } from './types';\nimport {\n  getGoalChartDataSelector,\n  getGoalChartLabelsSelector,\n  GoalChartData,\n  GoalChartLabels,\n} from '../../chart_types/goal_chart/state/selectors/get_goal_chart_data';\nimport { GlobalChartState } from '../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../state/selectors/get_accessibility_config';\nimport { getChartTypeDescriptionSelector } from '../../state/selectors/get_chart_type_description';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\n\ninterface ScreenReaderSummaryStateProps {\n  a11ySettings: A11ySettings;\n  chartTypeDescription: string;\n  goalChartData?: GoalChartData;\n  goalChartLabels?: GoalChartLabels;\n}\n\nconst ScreenReaderSummaryComponent = ({\n  a11ySettings,\n  chartTypeDescription,\n  goalChartData,\n  goalChartLabels,\n}: ScreenReaderSummaryStateProps) => {\n  return (\n    <div className=\"echScreenReaderOnly\">\n      <ScreenReaderLabel {...a11ySettings} goalChartLabels={goalChartLabels} />\n      <ScreenReaderDescription {...a11ySettings} />\n      <ScreenReaderTypes {...a11ySettings} chartTypeDescription={chartTypeDescription} goalChartData={goalChartData} />\n    </div>\n  );\n};\n\nconst DEFAULT_SCREEN_READER_SUMMARY = {\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  chartTypeDescription: '',\n  goalChartData: undefined,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ScreenReaderSummaryStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_SCREEN_READER_SUMMARY;\n  }\n  return {\n    chartTypeDescription: getChartTypeDescriptionSelector(state),\n    a11ySettings: getA11ySettingsSelector(state),\n    goalChartData: getGoalChartDataSelector(state),\n    goalChartLabels: getGoalChartLabelsSelector(state),\n  };\n};\n\n/** @internal */\nexport const ScreenReaderSummary = memo(connect(mapStateToProps)(ScreenReaderSummaryComponent));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { GoalChartData } from '../../chart_types/goal_chart/state/selectors/get_goal_chart_data';\nimport { A11ySettings } from '../../state/selectors/get_accessibility_config';\n\ninterface ScreenReaderTypesProps {\n  chartTypeDescription: string;\n  goalChartData?: GoalChartData;\n}\n\n/** @internal */\nexport function ScreenReaderTypes({\n  goalChartData,\n  defaultSummaryId,\n  chartTypeDescription,\n}: A11ySettings & ScreenReaderTypesProps) {\n  if (!defaultSummaryId && !goalChartData) return null;\n  const validGoalChart =\n    chartTypeDescription === 'goal chart' ||\n    chartTypeDescription === 'horizontalBullet chart' ||\n    chartTypeDescription === 'verticalBullet chart';\n  return (\n    <dl>\n      <dt>Chart type:</dt>\n      <dd id={defaultSummaryId}>{chartTypeDescription}</dd>\n      {validGoalChart && goalChartData && !isNaN(goalChartData.maximum) ? (\n        <>\n          <dt>Minimum:</dt>\n          <dd>{goalChartData.minimum}</dd>\n          <dt>Maximum:</dt>\n          <dd>{goalChartData.maximum}</dd>\n          <dt>Target:</dt>\n          <dd>{goalChartData.target}</dd>\n          <dd>Value:</dd>\n          <dt>{goalChartData.value}</dt>\n        </>\n      ) : null}\n    </dl>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\n\nimport { renderRect } from '../../chart_types/xy_chart/renderer/canvas/primitives/rect';\nimport { RgbaTuple } from '../../common/color_library_wrappers';\nimport { Colors } from '../../common/colors';\nimport { clearCanvas, withContext, withClip } from '../../renderers/canvas';\nimport { GlobalChartState } from '../../state/chart_state';\nimport { getInternalBrushAreaSelector } from '../../state/selectors/get_internal_brush_area';\nimport { getInternalIsBrushingSelector } from '../../state/selectors/get_internal_is_brushing';\nimport { getInternalIsBrushingAvailableSelector } from '../../state/selectors/get_internal_is_brushing_available';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { getInternalMainProjectionAreaSelector } from '../../state/selectors/get_internal_main_projection_area';\nimport { getInternalProjectionContainerAreaSelector } from '../../state/selectors/get_internal_projection_container_area';\nimport { Dimensions } from '../../utils/dimensions';\n\ninterface StateProps {\n  initialized: boolean;\n  mainProjectionArea: Dimensions;\n  projectionContainer: Dimensions;\n  isBrushing: boolean | undefined;\n  isBrushAvailable: boolean | undefined;\n  brushEvent: Dimensions | null;\n  zIndex: number;\n}\n\n// todo move this to theme\nconst DEFAULT_FILL_COLOR: RgbaTuple = [128, 128, 128, 0.6];\n\nclass BrushToolComponent extends React.Component<StateProps> {\n  static displayName = 'BrushTool';\n\n  private readonly devicePixelRatio: number;\n\n  private ctx: CanvasRenderingContext2D | null;\n\n  private canvasRef: RefObject<HTMLCanvasElement>;\n\n  constructor(props: Readonly<StateProps>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n    this.canvasRef = React.createRef();\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    this.drawCanvas();\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n    }\n  }\n\n  render() {\n    const { initialized, isBrushAvailable, isBrushing, projectionContainer, zIndex } = this.props;\n    if (!initialized || !isBrushAvailable || !isBrushing) {\n      this.ctx = null;\n      return null;\n    }\n    const { width, height } = projectionContainer;\n    return (\n      <canvas\n        ref={this.canvasRef}\n        className=\"echBrushTool\"\n        width={width * this.devicePixelRatio}\n        height={height * this.devicePixelRatio}\n        style={{\n          width,\n          height,\n          zIndex,\n        }}\n      />\n    );\n  }\n\n  private drawCanvas = () => {\n    const { brushEvent, mainProjectionArea } = this.props;\n\n    const { ctx } = this;\n    if (!ctx || !brushEvent) {\n      return;\n    }\n    const { top, left, width, height } = brushEvent;\n    withContext(ctx, () => {\n      ctx.scale(this.devicePixelRatio, this.devicePixelRatio);\n      withClip(\n        ctx,\n        {\n          x: mainProjectionArea.left,\n          y: mainProjectionArea.top,\n          width: mainProjectionArea.width,\n          height: mainProjectionArea.height,\n        },\n        () => {\n          clearCanvas(ctx, Colors.Transparent.keyword);\n          ctx.translate(mainProjectionArea.left, mainProjectionArea.top);\n          renderRect(\n            ctx,\n            { x: left, y: top, width, height },\n            { color: DEFAULT_FILL_COLOR },\n            { width: 0, color: Colors.Transparent.rgba },\n          );\n        },\n      );\n    });\n  };\n\n  private tryCanvasContext() {\n    const canvas = this.canvasRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      initialized: false,\n      projectionContainer: {\n        width: 0,\n        height: 0,\n        left: 0,\n        top: 0,\n      },\n      mainProjectionArea: {\n        top: 0,\n        left: 0,\n        width: 0,\n        height: 0,\n      },\n      isBrushing: false,\n      isBrushAvailable: false,\n      brushEvent: null,\n      zIndex: 0,\n    };\n  }\n  return {\n    initialized: state.specsInitialized,\n    projectionContainer: getInternalProjectionContainerAreaSelector(state),\n    mainProjectionArea: getInternalMainProjectionAreaSelector(state),\n    isBrushAvailable: getInternalIsBrushingAvailableSelector(state),\n    isBrushing: getInternalIsBrushingSelector(state),\n    brushEvent: getInternalBrushAreaSelector(state),\n    zIndex: state.zIndex,\n  };\n};\n\n/** @internal */\nexport const BrushTool = connect(mapStateToProps)(BrushToolComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { CSSProperties, ReactNode, createRef } from 'react';\nimport { Provider } from 'react-redux';\nimport { createStore, Store, Unsubscribe } from 'redux';\nimport { OptionalKeys } from 'utility-types';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { ChartBackground } from './chart_background';\nimport { ChartContainer } from './chart_container';\nimport { ChartResizer } from './chart_resizer';\nimport { ChartStatus } from './chart_status';\nimport { ErrorBoundary } from './error_boundary';\nimport { Legend } from './legend/legend';\nimport { getElementZIndex } from './portal/utils';\nimport { Colors } from '../common/colors';\nimport { LegendPositionConfig, PointerEvent } from '../specs';\nimport { SpecsParser } from '../specs/specs_parser';\nimport { updateChartTitles, updateParentDimensions } from '../state/actions/chart_settings';\nimport { onExternalPointerEvent } from '../state/actions/events';\nimport { onComputedZIndex } from '../state/actions/z_index';\nimport { chartStoreReducer, GlobalChartState } from '../state/chart_state';\nimport { getChartThemeSelector } from '../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../state/selectors/get_internal_is_intialized';\nimport { getLegendConfigSelector } from '../state/selectors/get_legend_config_selector';\nimport { ChartSize, getChartSize, getFixedChartSize } from '../utils/chart_size';\nimport { LayoutDirection } from '../utils/common';\nimport { LIGHT_THEME } from '../utils/themes/light_theme';\n\n/** @public */\nexport interface ChartProps {\n  /**\n   * The type of rendered\n   * @defaultValue `canvas`\n   */\n  renderer?: 'svg' | 'canvas';\n  size?: ChartSize;\n  className?: string;\n  id?: string;\n  title?: string;\n  description?: string;\n  children?: ReactNode;\n}\n\ninterface ChartState {\n  legendDirection: LegendPositionConfig['direction'];\n  paddingLeft: number;\n  paddingRight: number;\n  displayTitles: boolean;\n}\n\n/** @public */\nexport class Chart extends React.Component<ChartProps, ChartState> {\n  static defaultProps: Pick<ChartProps, OptionalKeys<ChartProps>> = {\n    renderer: 'canvas',\n  };\n\n  private unsubscribeToStore: Unsubscribe;\n\n  private chartStore: Store<GlobalChartState>;\n\n  private chartContainerRef: React.RefObject<HTMLDivElement>;\n\n  private chartStageRef: React.RefObject<HTMLCanvasElement>;\n\n  constructor(props: ChartProps) {\n    super(props);\n    this.chartContainerRef = createRef();\n    this.chartStageRef = createRef();\n\n    const id = props.id ?? uuidv4();\n    const storeReducer = chartStoreReducer(id, props.title, props.description);\n    this.chartStore = createStore(storeReducer);\n    this.state = {\n      legendDirection: LayoutDirection.Vertical,\n      paddingLeft: LIGHT_THEME.chartMargins.left,\n      paddingRight: LIGHT_THEME.chartMargins.right,\n      displayTitles: true,\n    };\n    this.unsubscribeToStore = this.chartStore.subscribe(() => {\n      const state = this.chartStore.getState();\n      if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n        return;\n      }\n\n      const {\n        legendPosition: { direction },\n      } = getLegendConfigSelector(state);\n      if (this.state.legendDirection !== direction) {\n        this.setState({\n          legendDirection: direction,\n        });\n      }\n      const theme = getChartThemeSelector(state);\n      this.setState({\n        paddingLeft: theme.chartMargins.left,\n        paddingRight: theme.chartMargins.right,\n        displayTitles: state.internalChartState?.canDisplayChartTitles(state) ?? true,\n      });\n      if (state.internalChartState) {\n        state.internalChartState.eventCallbacks(state);\n      }\n    });\n  }\n\n  componentDidMount() {\n    if (this.chartContainerRef.current) {\n      const zIndex = getElementZIndex(this.chartContainerRef.current, document.body);\n      this.chartStore.dispatch(onComputedZIndex(zIndex));\n    }\n  }\n\n  componentWillUnmount() {\n    this.unsubscribeToStore();\n  }\n\n  componentDidUpdate({ title, description, size }: Readonly<ChartProps>) {\n    if (title !== this.props.title || description !== this.props.description) {\n      this.chartStore.dispatch(updateChartTitles(this.props.title, this.props.description));\n    }\n    const prevChartSize = getChartSize(size);\n    const newChartSize = getFixedChartSize(this.props.size);\n    // if the size is specified in pixels then update directly the store\n    if (newChartSize && (newChartSize.width !== prevChartSize.width || newChartSize.height !== prevChartSize.height)) {\n      this.chartStore.dispatch(updateParentDimensions({ ...newChartSize, top: 0, left: 0 }));\n    }\n  }\n\n  getPNGSnapshot(\n    // eslint-disable-next-line unicorn/no-object-as-default-parameter\n    options = {\n      backgroundColor: Colors.Transparent.keyword,\n    },\n  ): {\n    blobOrDataUrl: any;\n    browser: 'IE11' | 'other';\n  } | null {\n    if (!this.chartStageRef.current) {\n      return null;\n    }\n    const canvas = this.chartStageRef.current;\n    const backgroundCanvas = document.createElement('canvas');\n    backgroundCanvas.width = canvas.width;\n    backgroundCanvas.height = canvas.height;\n    const bgCtx = backgroundCanvas.getContext('2d');\n    if (!bgCtx) {\n      return null;\n    }\n    bgCtx.fillStyle = options.backgroundColor;\n    bgCtx.fillRect(0, 0, canvas.width, canvas.height);\n    bgCtx.drawImage(canvas, 0, 0);\n\n    return {\n      blobOrDataUrl: backgroundCanvas.toDataURL(),\n      browser: 'other',\n    };\n  }\n\n  getChartContainerRef = () => this.chartContainerRef;\n\n  dispatchExternalPointerEvent(event: PointerEvent) {\n    this.chartStore.dispatch(onExternalPointerEvent(event));\n  }\n\n  render() {\n    const { size, className } = this.props;\n    const containerSizeStyle = getChartSize(size);\n    const chartContentClassNames = classNames('echChartContent', className, {\n      'echChartContent--column': this.state.legendDirection === LayoutDirection.Horizontal,\n    });\n\n    return (\n      <Provider store={this.chartStore}>\n        <div className=\"echChart\" style={containerSizeStyle}>\n          <Titles\n            displayTitles={this.state.displayTitles}\n            title={this.props.title}\n            description={this.props.description}\n            paddingLeft={this.state.paddingLeft}\n            paddingRight={this.state.paddingRight}\n          />\n          <div className={chartContentClassNames}>\n            <ChartBackground />\n            <ChartStatus />\n            <ChartResizer />\n            <Legend />\n            {/* TODO: Add renderFn to error boundary */}\n            <ErrorBoundary>\n              <SpecsParser>{this.props.children}</SpecsParser>\n              <div className=\"echContainer\" ref={this.chartContainerRef}>\n                <ChartContainer getChartContainerRef={this.getChartContainerRef} forwardStageRef={this.chartStageRef} />\n              </div>\n            </ErrorBoundary>\n          </div>\n        </div>\n      </Provider>\n    );\n  }\n}\n\nfunction Titles({\n  displayTitles,\n  title,\n  description,\n  paddingLeft,\n  paddingRight,\n}: Pick<ChartProps, 'title' | 'description'> & Pick<ChartState, 'displayTitles' | 'paddingLeft' | 'paddingRight'>) {\n  if (!displayTitles || (!title && !description)) return null;\n\n  const titleDescStyle: CSSProperties = {\n    paddingLeft,\n    paddingRight,\n  };\n\n  return (\n    <div className=\"echChart__titles\">\n      {title && (\n        <h3 className=\"echChartTitle\" style={titleDescStyle}>\n          {title}\n        </h3>\n      )}\n      {description && (\n        <h4 className=\"echChartDescription\" style={titleDescStyle}>\n          {description}\n        </h4>\n      )}\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Colors } from '../common/colors';\nimport { GlobalChartState } from '../state/chart_state';\nimport { getChartThemeSelector } from '../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../state/selectors/get_internal_is_intialized';\n\ninterface ChartBackgroundProps {\n  backgroundColor: string;\n}\n\n/** @internal */\nexport class ChartBackgroundComponent extends React.Component<ChartBackgroundProps> {\n  static displayName = 'ChartBackground';\n\n  render() {\n    const { backgroundColor } = this.props;\n    return <div className=\"echChartBackground\" style={{ backgroundColor }} />;\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): ChartBackgroundProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      backgroundColor: Colors.Transparent.keyword,\n    };\n  }\n  return {\n    backgroundColor: getChartThemeSelector(state).background.color,\n  };\n};\n\n/** @internal */\nexport const ChartBackground = connect(mapStateToProps)(ChartBackgroundComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { CSSProperties } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { NoResults } from './no_results';\nimport { ChartType } from '../chart_types';\nimport { DEFAULT_CSS_CURSOR, SECONDARY_BUTTON } from '../common/constants';\nimport { SettingsSpec, TooltipSpec } from '../specs';\nimport { onKeyPress as onKeyPressAction } from '../state/actions/key';\nimport {\n  onMouseUp as onMouseUpAction,\n  onMouseDown as onMouseDownAction,\n  onPointerMove as onPointerMoveAction,\n} from '../state/actions/mouse';\nimport { pinTooltip as pinTooltipAction } from '../state/actions/tooltip';\nimport { GlobalChartState, BackwardRef, TooltipInteractionState } from '../state/chart_state';\nimport { isPinnableTooltip } from '../state/selectors/can_pin_tooltip';\nimport { getInternalChartRendererSelector } from '../state/selectors/get_chart_type_components';\nimport { getInternalPointerCursor } from '../state/selectors/get_internal_cursor_pointer';\nimport { getInternalIsBrushingSelector } from '../state/selectors/get_internal_is_brushing';\nimport { getInternalIsBrushingAvailableSelector } from '../state/selectors/get_internal_is_brushing_available';\nimport { getInternalIsInitializedSelector, InitStatus } from '../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../state/selectors/get_tooltip_spec';\nimport { isInternalChartEmptySelector } from '../state/selectors/is_chart_empty';\nimport { deepEqual } from '../utils/fast_deep_equal';\n\ninterface ChartContainerComponentStateProps {\n  status: InitStatus;\n  isChartEmpty?: boolean;\n  pointerCursor: CSSProperties['cursor'];\n  isBrushing: boolean;\n  tooltipState: TooltipInteractionState;\n  initialized?: boolean;\n  canPinTooltip: boolean;\n  isBrushingAvailable: boolean;\n  settings?: SettingsSpec;\n  tooltip: TooltipSpec;\n  disableInteractions: boolean;\n  internalChartRenderer: (\n    containerRef: BackwardRef,\n    forwardStageRef: React.RefObject<HTMLCanvasElement>,\n  ) => JSX.Element | null;\n}\ninterface ChartContainerComponentDispatchProps {\n  onPointerMove: typeof onPointerMoveAction;\n  onMouseUp: typeof onMouseUpAction;\n  onMouseDown: typeof onMouseDownAction;\n  onKeyPress: typeof onKeyPressAction;\n  pinTooltip: typeof pinTooltipAction;\n}\n\ninterface ChartContainerComponentOwnProps {\n  getChartContainerRef: BackwardRef;\n  forwardStageRef: React.RefObject<HTMLCanvasElement>;\n}\n\ntype ReactiveChartProps = ChartContainerComponentStateProps &\n  ChartContainerComponentDispatchProps &\n  ChartContainerComponentOwnProps;\n\nclass ChartContainerComponent extends React.Component<ReactiveChartProps> {\n  static displayName = 'ChartContainer';\n  static watchedKeys: KeyboardEvent['key'][] = ['Escape'];\n\n  shouldComponentUpdate(nextProps: ReactiveChartProps) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  handleMouseMove = ({\n    nativeEvent: { offsetX, offsetY, timeStamp },\n  }: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, onPointerMove, internalChartRenderer } = this.props;\n    if (isChartEmpty || disableInteractions || internalChartRenderer.name === 'FlameWithTooltip') {\n      // Flame chart does its own event handling, and panning temporarily attaches\n      // an event handler onto `window`. So this `chart_container.handleMouseMove`\n      // can not be avoided with `e.stopPropagation()`. So we should avoid emission\n      return;\n    }\n\n    onPointerMove(\n      {\n        x: offsetX,\n        y: offsetY,\n      },\n      timeStamp,\n    );\n  };\n\n  handleMouseLeave = ({ nativeEvent: { timeStamp } }: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, onPointerMove, isBrushing } = this.props;\n    if (isChartEmpty || disableInteractions || isBrushing) {\n      return;\n    }\n    onPointerMove({ x: -1, y: -1 }, timeStamp);\n  };\n\n  handleMouseDown = ({\n    nativeEvent: { offsetX, offsetY, timeStamp, button, ctrlKey },\n  }: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, onMouseDown, isBrushingAvailable, tooltipState } = this.props;\n\n    // button 2 to block brushing on right click\n    if (tooltipState.pinned || button === SECONDARY_BUTTON || ctrlKey || isChartEmpty || disableInteractions) return;\n\n    if (isBrushingAvailable) {\n      window.addEventListener('mouseup', this.handleBrushEnd);\n    }\n\n    window.addEventListener('keyup', this.handleKeyUp);\n\n    onMouseDown(\n      {\n        x: offsetX,\n        y: offsetY,\n      },\n      timeStamp,\n    );\n  };\n\n  handleUnpinningTooltip = () => {\n    window.removeEventListener('keyup', this.handleKeyUp);\n    window.removeEventListener('click', this.handleUnpinningTooltip);\n    window.removeEventListener('scroll', this.handleUnpinningTooltip);\n    window.removeEventListener('visibilitychange', this.handleUnpinningTooltip);\n    this.props.pinTooltip(false, true);\n  };\n\n  handleContextMenu = (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, tooltipState } = this.props;\n    if (isChartEmpty || disableInteractions) {\n      return;\n    }\n\n    e.preventDefault(); // prevent browser context menu\n\n    if (tooltipState.pinned) {\n      this.handleUnpinningTooltip();\n      return;\n    }\n\n    window.addEventListener('keyup', this.handleKeyUp);\n    window.addEventListener('click', this.handleUnpinningTooltip);\n    window.addEventListener('scroll', this.handleUnpinningTooltip);\n    window.addEventListener('visibilitychange', this.handleUnpinningTooltip);\n\n    this.props.pinTooltip(true);\n  };\n\n  handleMouseUp = ({ nativeEvent: { offsetX, offsetY, timeStamp } }: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, onMouseUp, tooltipState } = this.props;\n    if (tooltipState.pinned || isChartEmpty || disableInteractions) {\n      return;\n    }\n\n    window.removeEventListener('keyup', this.handleKeyUp);\n\n    onMouseUp(\n      {\n        x: offsetX,\n        y: offsetY,\n      },\n      timeStamp,\n    );\n  };\n\n  handleKeyUp = ({ key }: KeyboardEvent) => {\n    if (!ChartContainerComponent.watchedKeys.includes(key)) return;\n\n    window.removeEventListener('keyup', this.handleKeyUp);\n\n    const { isChartEmpty, disableInteractions, onKeyPress } = this.props;\n    if (isChartEmpty || disableInteractions) {\n      return;\n    }\n\n    onKeyPress(key);\n  };\n\n  handleBrushEnd = () => {\n    const { onMouseUp } = this.props;\n\n    window.removeEventListener('mouseup', this.handleBrushEnd);\n    onMouseUp({ x: -1, y: -1 }, Date.now());\n  };\n\n  render() {\n    const { status, isChartEmpty, settings, initialized } = this.props;\n\n    if (!initialized || status === InitStatus.ParentSizeInvalid) {\n      // TODO: Display error on chart\n      return null;\n    }\n\n    if (\n      status === InitStatus.ChartNotInitialized ||\n      status === InitStatus.MissingChartType ||\n      status === InitStatus.SpecNotInitialized ||\n      isChartEmpty\n    ) {\n      return <NoResults renderFn={settings?.noResults} />;\n    }\n\n    const { pointerCursor, internalChartRenderer, getChartContainerRef, forwardStageRef } = this.props;\n\n    return (\n      <div\n        className=\"echChartPointerContainer\"\n        style={{\n          cursor: pointerCursor,\n        }}\n        onMouseMove={this.handleMouseMove}\n        onMouseLeave={this.handleMouseLeave}\n        onMouseDown={this.handleMouseDown}\n        onMouseUp={this.handleMouseUp}\n        onContextMenu={this.props.canPinTooltip ? this.handleContextMenu : undefined}\n      >\n        {internalChartRenderer(getChartContainerRef, forwardStageRef)}\n      </div>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ChartContainerComponentDispatchProps =>\n  bindActionCreators(\n    {\n      onPointerMove: onPointerMoveAction,\n      onMouseUp: onMouseUpAction,\n      onMouseDown: onMouseDownAction,\n      onKeyPress: onKeyPressAction,\n      pinTooltip: pinTooltipAction,\n    },\n    dispatch,\n  );\nconst mapStateToProps = (state: GlobalChartState): ChartContainerComponentStateProps => {\n  const status = getInternalIsInitializedSelector(state);\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const initialized = !state.specParsing && state.specsInitialized;\n  const tooltipState = state.interactions.tooltip;\n\n  if (status !== InitStatus.Initialized) {\n    return {\n      status,\n      initialized,\n      tooltipState,\n      canPinTooltip: false,\n      pointerCursor: DEFAULT_CSS_CURSOR,\n      isBrushingAvailable: false,\n      isBrushing: false,\n      internalChartRenderer: () => null,\n      settings,\n      tooltip,\n      disableInteractions: false,\n    };\n  }\n\n  return {\n    status,\n    initialized,\n    tooltipState,\n    isChartEmpty: isInternalChartEmptySelector(state),\n    canPinTooltip: isPinnableTooltip(state),\n    pointerCursor: getInternalPointerCursor(state),\n    isBrushingAvailable: getInternalIsBrushingAvailableSelector(state),\n    isBrushing: getInternalIsBrushingSelector(state),\n    internalChartRenderer: getInternalChartRendererSelector(state),\n    settings,\n    tooltip,\n    disableInteractions: state.chartType === ChartType.Flame,\n  };\n};\n\n/** @internal */\nexport const ChartContainer = connect(mapStateToProps, mapDispatchToProps)(ChartContainerComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { Dispatch, bindActionCreators } from 'redux';\n\nimport { ResizeListener } from '../specs/settings';\nimport { updateParentDimensions } from '../state/actions/chart_settings';\nimport { GlobalChartState } from '../state/chart_state';\nimport { getSettingsSpecSelector } from '../state/selectors/get_settings_spec';\n\ninterface ResizerStateProps {\n  onResize?: ResizeListener;\n}\n\ninterface ResizerDispatchProps {\n  updateParentDimensions: typeof updateParentDimensions;\n}\n\ntype ResizerProps = ResizerStateProps & ResizerDispatchProps;\ntype ResizeFn = (entries: ResizeObserverEntry[]) => void;\n\nclass Resizer extends React.Component<ResizerProps> {\n  private readonly containerRef: RefObject<HTMLDivElement>;\n\n  private ro: ResizeObserver;\n\n  constructor(props: ResizerProps) {\n    super(props);\n    this.containerRef = React.createRef();\n    this.ro = new ResizeObserver(this.onResize);\n  }\n\n  componentDidMount() {\n    if (this.containerRef.current) {\n      this.ro.observe(this.containerRef.current as Element);\n    }\n  }\n\n  componentWillUnmount() {\n    this.ro.disconnect();\n  }\n\n  onResize: ResizeFn = (entries) => {\n    if (!Array.isArray(entries)) {\n      return;\n    }\n    if (entries.length === 0 || !entries[0]) {\n      return;\n    }\n    const { width, height } = entries[0].contentRect;\n    this.props.updateParentDimensions({ width, height, top: 0, left: 0 });\n    this.props.onResize?.();\n  };\n\n  render() {\n    return <div ref={this.containerRef} className=\"echChartResizer\" />;\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ResizerDispatchProps =>\n  bindActionCreators({ updateParentDimensions }, dispatch);\n\nconst mapStateToProps = (state: GlobalChartState): ResizerStateProps => {\n  const { onResize } = getSettingsSpecSelector(state);\n  return { onResize };\n};\n\n/** @internal */\nexport const ChartResizer = connect(mapStateToProps, mapDispatchToProps)(Resizer);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { RenderChangeListener, WillRenderListener } from '../specs';\nimport { GlobalChartState } from '../state/chart_state';\nimport { globalSelectorCache } from '../state/create_selector';\nimport { getDebugStateSelector } from '../state/selectors/get_debug_state';\nimport { getSettingsSpecSelector } from '../state/selectors/get_settings_spec';\nimport { DebugState } from '../state/types';\n\ninterface ChartStatusStateProps {\n  chartId: string;\n  rendered: boolean;\n  renderedCount: number;\n  onRenderChange?: RenderChangeListener;\n  onWillRender?: WillRenderListener;\n  debugState: DebugState | null;\n}\n\nclass ChartStatusComponent extends React.Component<ChartStatusStateProps> {\n  componentDidMount() {\n    this.dispatchRenderChange();\n  }\n\n  componentDidUpdate() {\n    this.dispatchRenderChange();\n  }\n\n  componentWillUnmount() {\n    globalSelectorCache.removeKeyFromAll(this.props.chartId);\n  }\n\n  dispatchRenderChange = () => {\n    const { onWillRender, onRenderChange, rendered } = this.props;\n    onWillRender?.();\n\n    if (onRenderChange) {\n      window.requestAnimationFrame(() => {\n        onRenderChange(rendered);\n      });\n    }\n  };\n\n  render() {\n    const { rendered, renderedCount, debugState } = this.props;\n    const debugStateString: string | null = debugState && JSON.stringify(debugState);\n    return (\n      <div\n        className=\"echChartStatus\"\n        data-ech-render-complete={rendered}\n        data-ech-render-count={renderedCount}\n        data-ech-debug-state={debugStateString}\n      />\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): ChartStatusStateProps => {\n  const { onWillRender, onRenderChange, debugState } = getSettingsSpecSelector(state);\n\n  return {\n    chartId: state.chartId,\n    rendered: state.chartRendered,\n    renderedCount: state.chartRenderedCount,\n    onWillRender,\n    onRenderChange,\n    debugState: debugState ? getDebugStateSelector(state) : null,\n  };\n};\n\n/** @internal */\nexport const ChartStatus = connect(mapStateToProps)(ChartStatusComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { Component, ReactNode } from 'react';\n\nimport { isGracefulError } from './errors';\nimport { SettingsSpec } from '../../specs/settings';\nimport { NoResults } from '../no_results';\n\ntype ErrorBoundaryProps = {\n  children: ReactNode;\n  renderFn?: SettingsSpec['noResults'];\n};\n\ninterface ErrorBoundaryState {\n  hasError: boolean;\n}\n\n/**\n * Error Boundary to catch and handle custom errors\n * @internal\n */\nexport class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  hasError = false;\n\n  componentDidUpdate() {\n    if (this.hasError) {\n      this.hasError = false;\n    }\n  }\n\n  componentDidCatch(error: Error) {\n    if (isGracefulError(error)) {\n      this.hasError = true;\n      this.forceUpdate();\n    }\n  }\n\n  render() {\n    if (this.hasError) {\n      return <NoResults renderFn={this.props.renderFn} />;\n    }\n\n    return this.props.children;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const ErrorType = Object.freeze({\n  Graceful: 'graceful' as const,\n});\n/** @public */\nexport type ErrorType = $Values<typeof ErrorType>;\n\n/**\n * Error to used to gracefully render empty chart\n * @internal\n */\nexport class GracefulError extends Error {\n  type = ErrorType.Graceful;\n}\n\n/** @internal */\nexport function isGracefulError(error: Error): error is GracefulError {\n  return (error as GracefulError)?.type === ErrorType.Graceful;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* @internal */\nexport { ErrorBoundary } from './error_boundary';\n/* @internal */\nexport * from './errors';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { ComponentType, CSSProperties } from 'react';\n\ninterface AlignedGridProps<D> {\n  data: Array<Array<D | undefined>>;\n  contentComponent: ComponentType<{\n    datum: D;\n    stats: { rows: number; rowIndex: number; columns: number; columnIndex: number };\n  }>;\n}\n\n/** @internal */\nexport function AlignedGrid<D>({ data, contentComponent: ContentComponent }: AlignedGridProps<D>) {\n  const rows = data.length;\n  const columns = data.reduce((acc, row) => {\n    return Math.max(acc, row.length);\n  }, 0);\n\n  const gridStyle: CSSProperties = {\n    gridTemplateColumns: `repeat(${columns}, 1fr`,\n    gridTemplateRows: `repeat(${rows}, max-content 1fr)`,\n  };\n\n  return (\n    <div className=\"echAlignedGrid\" style={gridStyle}>\n      {data.map((row, rowIndex) =>\n        row.map((cell, columnIndex) => {\n          const headerStyle: CSSProperties = {\n            gridRow: rowIndex * 2 + 1,\n            gridColumn: columnIndex + 1,\n          };\n          const contentStyle: CSSProperties = {\n            gridRow: rowIndex * 2 + 2,\n            gridColumn: columnIndex + 1,\n          };\n          const headerClassName = classNames('echAlignedGrid--header', {\n            echAlignedGrid__borderRight: columnIndex < columns - 1,\n          });\n          const contentClassName = classNames('echAlignedGrid--content', {\n            echAlignedGrid__borderRight: columnIndex < columns - 1,\n            echAlignedGrid__borderBottom: rowIndex < rows - 1,\n          });\n          if (!cell) {\n            return (\n              <>\n                <div className={headerClassName} style={headerStyle}></div>\n                <div className={contentClassName} style={contentStyle}></div>\n              </>\n            );\n          }\n\n          return (\n            <div key={`${rowIndex}-${columnIndex}`} className={contentClassName} style={contentStyle}>\n              <ContentComponent datum={cell} stats={{ rowIndex, columnIndex, columns, rows }} />\n            </div>\n          );\n        }),\n      )}\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function AlertIcon(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps}>\n      <path\n        fillRule=\"evenodd\"\n        d=\"M8.378 1.496l6.695 10.984A1 1 0 0 1 14.22 14H1.667a1 1 0 0 1-.883-1.47L6.642 1.545a1 1 0 0 1 1.736-.05zm-.853.52L1.667 13h12.552L7.525 2.016zM7.14 10.06L6.9 5.18h1.3l-.25 4.878h-.81zm.394 1.901a.61.61 0 0 1-.448-.186.606.606 0 0 1-.186-.444c0-.174.062-.323.186-.446a.614.614 0 0 1 .448-.184c.169 0 .315.06.44.182.124.122.186.27.186.448a.6.6 0 0 1-.189.446.607.607 0 0 1-.437.184z\"\n      />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { deepEqual } from '../../../utils/fast_deep_equal';\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport class DotIcon extends React.Component<IconComponentProps> {\n  shouldComponentUpdate(nextProps: IconComponentProps) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  render() {\n    return (\n      <svg width={16} height={16} viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\" {...this.props}>\n        <circle cx={8} cy={8} r={4} />\n      </svg>\n    );\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function DownArrowIcon(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\" width=\"16\" height=\"16\" {...extraProps}>\n      <path d=\"M 9.199 12.345 L 13.78 5.145 C 14.375 4.21 13.692 3 12.581 3 H 3.419 C 2.308 3 1.625 4.21 2.22 5.146 L 6.801 12.346 A 1.425 1.425 90 0 0 9.199 12.346 Z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function EmptyIcon(extraProps: IconComponentProps) {\n  return <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps} />;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function EyeIcon(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps}>\n      <path d=\"M15.98 7.873c.013.03.02.064.02.098v.06a.24.24 0 0 1-.02.097C15.952 8.188 13.291 14 8 14S.047 8.188.02 8.128A.24.24 0 0 1 0 8.03v-.059c0-.034.007-.068.02-.098C.048 7.813 2.709 2 8 2s7.953 5.813 7.98 5.873zm-1.37-.424a12.097 12.097 0 0 0-1.385-1.862C11.739 3.956 9.999 3 8 3c-2 0-3.74.956-5.225 2.587a12.098 12.098 0 0 0-1.701 2.414 12.095 12.095 0 0 0 1.7 2.413C4.26 12.043 6.002 13 8 13s3.74-.956 5.225-2.587A12.097 12.097 0 0 0 14.926 8c-.08-.15-.189-.343-.315-.551zM8 4.75A3.253 3.253 0 0 1 11.25 8 3.254 3.254 0 0 1 8 11.25 3.253 3.253 0 0 1 4.75 8 3.252 3.252 0 0 1 8 4.75zm0 1C6.76 5.75 5.75 6.76 5.75 8S6.76 10.25 8 10.25 10.25 9.24 10.25 8 9.24 5.75 8 5.75zm0 1.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function EyeClosedIcon(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps}>\n      <path d=\"M5.318 13.47l.776-.776A6.04 6.04 0 0 0 8 13c1.999 0 3.74-.956 5.225-2.587A12.097 12.097 0 0 0 14.926 8a12.097 12.097 0 0 0-1.701-2.413l-.011-.012.707-.708c1.359 1.476 2.045 2.976 2.058 3.006.014.03.021.064.021.098v.06a.24.24 0 0 1-.02.097C15.952 8.188 13.291 14 8 14a7.03 7.03 0 0 1-2.682-.53zM2.04 11.092C.707 9.629.034 8.158.02 8.128A.24.24 0 0 1 0 8.03v-.059c0-.034.007-.068.02-.098C.048 7.813 2.709 2 8 2c.962 0 1.837.192 2.625.507l-.78.78A6.039 6.039 0 0 0 8 3c-2 0-3.74.956-5.225 2.587a12.098 12.098 0 0 0-1.701 2.414 12.11 12.11 0 0 0 1.674 2.383l-.708.708zM8.362 4.77L7.255 5.877a2.262 2.262 0 0 0-1.378 1.378L4.77 8.362A3.252 3.252 0 0 1 8.362 4.77zm2.86 2.797a3.254 3.254 0 0 1-3.654 3.654l1.06-1.06a2.262 2.262 0 0 0 1.533-1.533l1.06-1.06zm-9.368 7.287a.5.5 0 0 1-.708-.708l13-13a.5.5 0 0 1 .708.708l-13 13z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function ListIcon(extraProps: IconComponentProps) {\n  return (\n    <svg width={16} height={16} xmlns=\"http://www.w3.org/2000/svg\" {...extraProps}>\n      <path d=\"M2 4V3h2v1H2zm4 0V3h8v1H6zm0 3V6h8v1H6zm0 3V9h8v1H6zM2 7V6h2v1H2zm0 3V9h2v1H2zm4 3v-1h8v1H6zm-4 0v-1h2v1H2z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function QuestionInCircle(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps}>\n      <path d=\"M8 14A6 6 0 1 1 8 2a6 6 0 0 1 0 12zm0-1A5 5 0 1 0 8 3a5 5 0 0 0 0 10zm-.186-1.065A.785.785 0 0 1 7 11.12c0-.48.34-.82.814-.82.475 0 .809.34.809.82 0 .475-.334.815-.809.815zM5.9 6.317C5.96 5.168 6.755 4.4 8.048 4.4c1.218 0 2.091.759 2.091 1.8 0 .736-.36 1.304-1.03 1.707-.56.33-.717.56-.717 1.022v.305l-.1.1H7.47l-.1-.1v-.431c-.005-.646.302-1.104.987-1.514.527-.322.708-.59.708-1.047 0-.536-.416-.91-1.05-.91-.652 0-1.064.374-1.112.998l-.1.092H6l-.1-.105z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { SVGAttributes, memo } from 'react';\n\nimport { AlertIcon } from './assets/alert';\nimport { DotIcon } from './assets/dot';\nimport { DownArrowIcon } from './assets/down_arrow';\nimport { EmptyIcon } from './assets/empty';\nimport { EyeIcon } from './assets/eye';\nimport { EyeClosedIcon } from './assets/eye_closed';\nimport { ListIcon } from './assets/list';\nimport { QuestionInCircle } from './assets/question_in_circle';\nimport { deepEqual } from '../../utils/fast_deep_equal';\n\nconst typeToIconMap = {\n  alert: AlertIcon,\n  dot: DotIcon,\n  empty: EmptyIcon,\n  eye: EyeIcon,\n  eyeClosed: EyeClosedIcon,\n  list: ListIcon,\n  questionInCircle: QuestionInCircle,\n  downArrow: DownArrowIcon,\n};\n\n/** @internal */\nexport type IconColor = string;\n\n/** @internal */\nexport type IconType = keyof typeof typeToIconMap;\n\ninterface IconProps {\n  className?: string;\n  'aria-label'?: string;\n  'data-test-subj'?: string;\n  type?: IconType;\n  color?: IconColor;\n}\n\n/** @internal */\nexport type IconComponentProps = Omit<SVGAttributes<SVGElement>, 'color' | 'type'> & IconProps;\n\nfunction IconComponent({ type, color, className, tabIndex, ...rest }: IconComponentProps) {\n  let optionalCustomStyles = null;\n\n  if (color) {\n    optionalCustomStyles = { color };\n  }\n\n  const classes = classNames('echIcon', className);\n  const Svg = (type && typeToIconMap[type]) || EmptyIcon;\n\n  /*\n   * This is a fix for IE and Edge, which ignores tabindex=\"-1\" on an SVG, but respects\n   * focusable=\"false\".\n   *   - If there's no tab index specified, we'll default the icon to not be focusable,\n   *     which is how SVGs behave in Chrome, Safari, and FF.\n   *   - If tab index is -1, then the consumer wants the icon to not be focusable.\n   *   - For all other values, the consumer wants the icon to be focusable.\n   */\n  const focusable = tabIndex === undefined || tabIndex === -1 ? 'false' : 'true';\n\n  return <Svg className={classes} {...optionalCustomStyles} tabIndex={tabIndex} focusable={focusable} {...rest} />;\n}\n\nIconComponent.displayName = 'Icon';\n\n/** @internal */\nexport const Icon = memo(IconComponent, deepEqual);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './chart';\nexport { Placement, TooltipPortalSettings } from './portal';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { MouseEventHandler, forwardRef, memo } from 'react';\n\nimport { LegendIcon } from './legend_icon';\nimport { PointStyle } from '../../utils/themes/theme';\nimport { Icon } from '../icons/icon';\n\ninterface ColorProps {\n  color: string;\n  seriesName: string;\n  hasColorPicker: boolean;\n  isSeriesHidden?: boolean;\n  pointStyle?: PointStyle;\n  onClick?: MouseEventHandler;\n}\n\n/**\n * Color component used by the legend item\n * @internal\n */\nexport const Color = memo(\n  forwardRef<HTMLButtonElement, ColorProps>(\n    ({ color, seriesName, isSeriesHidden = false, hasColorPicker, onClick, pointStyle }, ref) => {\n      if (isSeriesHidden) {\n        return (\n          <div className=\"echLegendItem__color\" title=\"series hidden\">\n            {/* changing the default viewBox for the eyeClosed icon to keep the same dimensions */}\n            <Icon type=\"eyeClosed\" viewBox=\"-3 -3 22 22\" aria-label={`series ${seriesName} is hidden`} />\n          </div>\n        );\n      }\n\n      if (hasColorPicker) {\n        return (\n          <button\n            type=\"button\"\n            onClick={onClick}\n            className=\"echLegendItem__color echLegendItem__color--changable\"\n            title=\"change series color\"\n            ref={ref}\n          >\n            <LegendIcon pointStyle={pointStyle} color={color} ariaLabel={`Change series color, currently ${color}`} />\n          </button>\n        );\n      }\n\n      return (\n        <div className=\"echLegendItem__color\" title=\"series color\">\n          <LegendIcon pointStyle={pointStyle} color={color} ariaLabel={`series color: ${color}`} />\n        </div>\n      );\n    },\n  ),\n);\nColor.displayName = 'Color';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { CustomLegendProps, CustomLegend as CustomLegendComponent } from '../../specs';\nimport { GlobalChartState } from '../../state/chart_state';\nimport { getPointerValueSelector } from '../../state/selectors/get_pointer_value';\n\ninterface Props extends CustomLegendProps {\n  component: CustomLegendComponent;\n}\n\nconst CustomLegendComponent: React.FC<Props> = ({ component: Component, ...props }) => <Component {...props} />;\n\nconst mapStateToProps = (state: GlobalChartState) => ({\n  pointerValue: getPointerValueSelector(state),\n});\n\n/** @internal */\nexport const CustomLegend = connect(mapStateToProps)(CustomLegendComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\n/**\n * @internal\n * @param extra\n * @param isSeriesHidden\n */\nexport function renderExtra(extra: string) {\n  return (\n    <div className=\"echLegendItem__extra\" title={`${extra}`}>\n      {extra}\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { KeyboardEventHandler, MouseEventHandler, useCallback } from 'react';\n\nimport { isRTLString } from '../../utils/common';\nimport { LegendLabelOptions } from '../../utils/themes/theme';\n\ninterface LabelProps {\n  label: string;\n  isSeriesHidden?: boolean;\n  isToggleable?: boolean;\n  onToggle?: (negate: boolean) => void;\n  options: LegendLabelOptions;\n}\n\n/**\n * Label component used to display text in legend item\n * @internal\n */\nexport function Label({ label, isToggleable, onToggle, isSeriesHidden, options }: LabelProps) {\n  const maxLines = Math.abs(options.maxLines);\n  const labelClassNames = classNames('echLegendItem__label', {\n    'echLegendItem__label--clickable': Boolean(onToggle),\n    'echLegendItem__label--singleline': maxLines === 1,\n    'echLegendItem__label--multiline': maxLines > 1,\n  });\n\n  const onClick: MouseEventHandler = useCallback(({ shiftKey }) => onToggle?.(shiftKey), [onToggle]);\n  const onKeyDown: KeyboardEventHandler = useCallback(\n    ({ key, shiftKey }) => {\n      if (key === ' ' || key === 'Enter') onToggle?.(shiftKey);\n    },\n    [onToggle],\n  );\n\n  const dir = isRTLString(label) ? 'rtl' : 'ltr'; // forced for individual labels in case mixed charset\n  const title = options.maxLines > 0 ? label : ''; // full text already visible\n  const clampStyles = maxLines > 1 ? { WebkitLineClamp: maxLines } : {};\n\n  return isToggleable ? (\n    // This div is required to allow multiline text truncation, all ARIA requirements are still met\n    // https://stackoverflow.com/questions/68673034/webkit-line-clamp-does-not-apply-to-buttons\n    <div\n      role=\"button\"\n      tabIndex={0}\n      dir={dir}\n      className={labelClassNames}\n      title={title}\n      onClick={onClick}\n      onKeyDown={onKeyDown}\n      aria-pressed={isSeriesHidden}\n      style={clampStyles}\n      aria-label={\n        isSeriesHidden ? `${label}; Activate to show series in graph` : `${label}; Activate to hide series in graph`\n      }\n    >\n      {label}\n    </div>\n  ) : (\n    <div dir={dir} className={labelClassNames} title={label} style={clampStyles}>\n      {label}\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React from 'react';\nimport { connect } from 'react-redux';\nimport { Dispatch, bindActionCreators } from 'redux';\n\nimport { CustomLegend } from './custom_legend';\nimport { LegendItemProps, LegendListItem } from './legend_item';\nimport { getLegendPositionConfig, legendPositionStyle } from './position_style';\nimport { getLegendStyle, getLegendListStyle } from './style_utils';\nimport { LegendItem, LegendItemExtraValues } from '../../common/legend';\nimport { DEFAULT_LEGEND_CONFIG, LegendSpec } from '../../specs';\nimport { clearTemporaryColors, setTemporaryColor, setPersistedColor } from '../../state/actions/colors';\nimport {\n  onToggleDeselectSeriesAction,\n  onLegendItemOutAction,\n  onLegendItemOverAction,\n} from '../../state/actions/legend';\nimport { GlobalChartState } from '../../state/chart_state';\nimport { getChartThemeSelector } from '../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { getInternalMainProjectionAreaSelector } from '../../state/selectors/get_internal_main_projection_area';\nimport { getInternalProjectionContainerAreaSelector } from '../../state/selectors/get_internal_projection_container_area';\nimport { getLegendConfigSelector } from '../../state/selectors/get_legend_config_selector';\nimport { getLegendItemsSelector } from '../../state/selectors/get_legend_items';\nimport { getLegendExtraValuesSelector } from '../../state/selectors/get_legend_items_values';\nimport { getLegendSizeSelector } from '../../state/selectors/get_legend_size';\nimport { getSettingsSpecSelector } from '../../state/selectors/get_settings_spec';\nimport { isBrushingSelector } from '../../state/selectors/is_brushing';\nimport { hasMostlyRTLItems, HorizontalAlignment, LayoutDirection, VerticalAlignment } from '../../utils/common';\nimport { Dimensions, Size } from '../../utils/dimensions';\nimport { LIGHT_THEME } from '../../utils/themes/light_theme';\nimport { Theme } from '../../utils/themes/theme';\n\ninterface LegendStateProps {\n  debug: boolean;\n  isBrushing: boolean;\n  chartDimensions: Dimensions;\n  containerDimensions: Dimensions;\n  chartTheme: Theme;\n  size: Size;\n  config: LegendSpec;\n  items: LegendItem[];\n  extraValues: Map<string, LegendItemExtraValues>;\n}\n\ninterface LegendDispatchProps {\n  onItemOutAction: typeof onLegendItemOutAction;\n  onItemOverAction: typeof onLegendItemOverAction;\n  onToggleDeselectSeriesAction: typeof onToggleDeselectSeriesAction;\n  clearTemporaryColors: typeof clearTemporaryColors;\n  setTemporaryColor: typeof setTemporaryColor;\n  setPersistedColor: typeof setPersistedColor;\n}\n\nfunction LegendComponent(props: LegendStateProps & LegendDispatchProps) {\n  const {\n    items,\n    size,\n    debug,\n    isBrushing,\n    chartTheme: { chartMargins, legend },\n    chartDimensions,\n    containerDimensions,\n    config,\n  } = props;\n\n  if (items.every(({ isItemHidden }) => isItemHidden)) {\n    return null;\n  }\n\n  const positionConfig = getLegendPositionConfig(config.legendPosition);\n  const containerStyle = getLegendStyle(positionConfig, size, legend.margin);\n  const listStyle = getLegendListStyle(positionConfig, chartMargins, legend, items.length);\n  const isMostlyRTL = hasMostlyRTLItems(items.map(({ label }) => label));\n\n  const legendClasses = classNames('echLegend', {\n    'echLegend--debug': debug,\n    'echLegend--inert': isBrushing,\n    'echLegend--horizontal': positionConfig.direction === LayoutDirection.Horizontal,\n    'echLegend--vertical': positionConfig.direction === LayoutDirection.Vertical,\n    'echLegend--left': positionConfig.hAlign === HorizontalAlignment.Left,\n    'echLegend--right': positionConfig.hAlign === HorizontalAlignment.Right,\n    'echLegend--top': positionConfig.vAlign === VerticalAlignment.Top,\n    'echLegend--bottom': positionConfig.vAlign === VerticalAlignment.Bottom,\n  });\n\n  const itemProps: Omit<LegendItemProps, 'item'> = {\n    positionConfig,\n    isMostlyRTL,\n    totalItems: items.length,\n    extraValues: props.extraValues,\n    showExtra: config.showLegendExtra,\n    onMouseOut: config.onLegendItemOut,\n    onMouseOver: config.onLegendItemOver,\n    onClick: config.onLegendItemClick,\n    clearTemporaryColorsAction: props.clearTemporaryColors,\n    setPersistedColorAction: props.setPersistedColor,\n    setTemporaryColorAction: props.setTemporaryColor,\n    mouseOutAction: props.onItemOutAction,\n    mouseOverAction: props.onItemOverAction,\n    toggleDeselectSeriesAction: props.onToggleDeselectSeriesAction,\n    colorPicker: config.legendColorPicker,\n    action: config.legendAction,\n    labelOptions: legend.labelOptions,\n    flatLegend: config.flatLegend ?? DEFAULT_LEGEND_CONFIG.flatLegend,\n  };\n  const positionStyle = legendPositionStyle(config, size, chartDimensions, containerDimensions);\n  return (\n    <div className={legendClasses} style={positionStyle} dir={isMostlyRTL ? 'rtl' : 'ltr'}>\n      {config.customLegend ? (\n        <div style={containerStyle}>\n          <CustomLegend\n            component={config.customLegend}\n            items={items.map(({ seriesIdentifiers, childId, path, ...customProps }) => ({\n              ...customProps,\n              seriesIdentifiers,\n              path,\n              extraValue: itemProps.extraValues.get(seriesIdentifiers[0]?.key ?? '')?.get(childId ?? ''),\n              onItemOutAction: itemProps.mouseOutAction,\n              onItemOverActon: () => itemProps.mouseOverAction(path),\n              onItemClickAction: (negate: boolean) => itemProps.toggleDeselectSeriesAction(seriesIdentifiers, negate),\n            }))}\n          />\n        </div>\n      ) : (\n        <div style={containerStyle} className=\"echLegendListContainer\">\n          <ul style={listStyle} className=\"echLegendList\">\n            {items.map((item, index) => (\n              <LegendListItem key={`${index}`} item={item} {...itemProps} />\n            ))}\n          </ul>\n        </div>\n      )}\n    </div>\n  );\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): LegendDispatchProps =>\n  bindActionCreators(\n    {\n      onToggleDeselectSeriesAction,\n      onItemOutAction: onLegendItemOutAction,\n      onItemOverAction: onLegendItemOverAction,\n      clearTemporaryColors,\n      setTemporaryColor,\n      setPersistedColor,\n    },\n    dispatch,\n  );\n\nconst EMPTY_DEFAULT_STATE: LegendStateProps = {\n  chartDimensions: { width: 0, height: 0, left: 0, top: 0 },\n  containerDimensions: { width: 0, height: 0, left: 0, top: 0 },\n  items: [],\n  extraValues: new Map(),\n  debug: false,\n  isBrushing: false,\n  chartTheme: LIGHT_THEME,\n  size: { width: 0, height: 0 },\n  config: DEFAULT_LEGEND_CONFIG,\n};\n\nconst mapStateToProps = (state: GlobalChartState): LegendStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return EMPTY_DEFAULT_STATE;\n  }\n  const config = getLegendConfigSelector(state);\n  if (!config.showLegend) {\n    return EMPTY_DEFAULT_STATE;\n  }\n  const { debug } = getSettingsSpecSelector(state);\n  return {\n    debug,\n    isBrushing: isBrushingSelector(state),\n    chartDimensions: getInternalMainProjectionAreaSelector(state),\n    containerDimensions: getInternalProjectionContainerAreaSelector(state),\n    chartTheme: getChartThemeSelector(state),\n    size: getLegendSizeSelector(state),\n    items: getLegendItemsSelector(state),\n    extraValues: getLegendExtraValuesSelector(state),\n    config,\n  };\n};\n\n/** @internal */\nexport const Legend = connect(mapStateToProps, mapDispatchToProps)(LegendComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { ShapeRendererFn } from '../../chart_types/xy_chart/renderer/shapes_paths';\nimport { Color } from '../../common/colors';\nimport { getColorFromVariant } from '../../utils/common';\nimport { PointShape, PointStyle } from '../../utils/themes/theme';\n\ninterface LegendIconProps {\n  pointStyle?: PointStyle;\n  ariaLabel: string;\n  color: Color;\n}\n\nconst MARKER_SIZE = 8;\n\n/** @internal */\nexport const LegendIcon = ({ pointStyle, color, ariaLabel }: LegendIconProps) => {\n  const {\n    shape = PointShape.Circle,\n    stroke = color,\n    strokeWidth = 1,\n    opacity = 1,\n  } = pointStyle?.shape ? pointStyle : {};\n  const [shapeFn, rotation] = ShapeRendererFn[shape];\n\n  const adjustedSize = MARKER_SIZE - (strokeWidth ?? 0);\n  return (\n    <svg width={MARKER_SIZE * 2} height={MARKER_SIZE * 2} aria-label={ariaLabel}>\n      <g\n        transform={`\n          translate(${MARKER_SIZE}, ${MARKER_SIZE})\n          rotate(${rotation})\n        `}\n      >\n        <path\n          d={shapeFn(adjustedSize / 2)}\n          stroke={getColorFromVariant(color, stroke)}\n          strokeWidth={strokeWidth}\n          fill={color}\n          opacity={opacity}\n        />\n      </g>\n    </svg>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { Component, createRef, MouseEventHandler, CSSProperties } from 'react';\n\nimport { Color as ItemColor } from './color';\nimport { renderExtra } from './extra';\nimport { Label as ItemLabel } from './label';\nimport { getExtra } from './utils';\nimport { Color } from '../../common/colors';\nimport { LegendItem, LegendItemExtraValues } from '../../common/legend';\nimport { SeriesIdentifier } from '../../common/series_id';\nimport {\n  LegendItemListener,\n  BasicListener,\n  LegendColorPicker,\n  LegendAction,\n  LegendPositionConfig,\n} from '../../specs/settings';\nimport {\n  clearTemporaryColors as clearTemporaryColorsAction,\n  setTemporaryColor as setTemporaryColorAction,\n  setPersistedColor as setPersistedColorAction,\n} from '../../state/actions/colors';\nimport {\n  onLegendItemOutAction,\n  onLegendItemOverAction,\n  onToggleDeselectSeriesAction,\n} from '../../state/actions/legend';\nimport { LayoutDirection } from '../../utils/common';\nimport { deepEqual } from '../../utils/fast_deep_equal';\nimport { LegendLabelOptions } from '../../utils/themes/theme';\n\n/** @internal */\nexport const LEGEND_HIERARCHY_MARGIN = 10;\n\n/** @internal */\nexport interface LegendItemProps {\n  item: LegendItem;\n  flatLegend: boolean;\n  totalItems: number;\n  positionConfig: LegendPositionConfig;\n  extraValues: Map<string, LegendItemExtraValues>;\n  showExtra: boolean;\n  isMostlyRTL: boolean;\n  labelOptions: LegendLabelOptions;\n  colorPicker?: LegendColorPicker;\n  action?: LegendAction;\n  onClick?: LegendItemListener;\n  onMouseOut?: BasicListener;\n  onMouseOver?: LegendItemListener;\n  mouseOutAction: typeof onLegendItemOutAction;\n  mouseOverAction: typeof onLegendItemOverAction;\n  clearTemporaryColorsAction: typeof clearTemporaryColorsAction;\n  setTemporaryColorAction: typeof setTemporaryColorAction;\n  setPersistedColorAction: typeof setPersistedColorAction;\n  toggleDeselectSeriesAction: typeof onToggleDeselectSeriesAction;\n}\n\ninterface LegendItemState {\n  isOpen: boolean;\n  actionActive: boolean;\n}\n\n/** @internal */\nexport class LegendListItem extends Component<LegendItemProps, LegendItemState> {\n  static displayName = 'LegendItem';\n\n  shouldClearPersistedColor = false;\n\n  colorRef = createRef<HTMLButtonElement>();\n\n  state: LegendItemState = {\n    isOpen: false,\n    actionActive: false,\n  };\n\n  shouldComponentUpdate(nextProps: LegendItemProps, nextState: LegendItemState) {\n    return !deepEqual(this.props, nextProps) || !deepEqual(this.state, nextState);\n  }\n\n  handleColorClick = (changeable: boolean): MouseEventHandler | undefined =>\n    changeable\n      ? (event) => {\n          event.stopPropagation();\n          this.toggleIsOpen();\n        }\n      : undefined;\n\n  toggleIsOpen = () => {\n    this.setState(({ isOpen }) => ({ isOpen: !isOpen }));\n  };\n\n  onLegendItemMouseOver = () => {\n    const { onMouseOver, mouseOverAction, item } = this.props;\n    // call the settings listener directly if available\n    if (onMouseOver) {\n      onMouseOver(item.seriesIdentifiers);\n    }\n    mouseOverAction(item.path);\n  };\n\n  onLegendItemMouseOut = () => {\n    const { onMouseOut, mouseOutAction } = this.props;\n    // call the settings listener directly if available\n    if (onMouseOut) {\n      onMouseOut();\n    }\n    mouseOutAction();\n  };\n\n  /**\n   * Returns click function only if toggleable or click listern is provided\n   */\n  onLabelToggle = (legendItemId: SeriesIdentifier[]): ((negate: boolean) => void) | undefined => {\n    const { item, onClick, toggleDeselectSeriesAction, totalItems } = this.props;\n    if (totalItems <= 1 || (!item.isToggleable && !onClick)) {\n      return;\n    }\n\n    return (negate) => {\n      if (onClick) {\n        onClick(legendItemId);\n      }\n\n      if (item.isToggleable) {\n        toggleDeselectSeriesAction(legendItemId, negate);\n      }\n    };\n  };\n\n  renderColorPicker() {\n    const {\n      colorPicker: ColorPicker,\n      item,\n      clearTemporaryColorsAction,\n      setTemporaryColorAction,\n      setPersistedColorAction,\n    } = this.props;\n    const { seriesIdentifiers, color } = item;\n    const seriesKeys = seriesIdentifiers.map(({ key }) => key);\n    const handleClose = () => {\n      setPersistedColorAction(seriesKeys, this.shouldClearPersistedColor ? null : color);\n      clearTemporaryColorsAction();\n      requestAnimationFrame(() => this.colorRef?.current?.focus());\n      this.toggleIsOpen();\n    };\n    const handleChange = (c: Color | null) => {\n      this.shouldClearPersistedColor = c === null;\n      setTemporaryColorAction(seriesKeys, c);\n    };\n    if (ColorPicker && this.state.isOpen && this.colorRef.current) {\n      return (\n        <ColorPicker\n          anchor={this.colorRef.current}\n          color={color}\n          onClose={handleClose}\n          onChange={handleChange}\n          seriesIdentifiers={seriesIdentifiers}\n        />\n      );\n    }\n  }\n\n  render() {\n    const {\n      extraValues,\n      item,\n      showExtra,\n      colorPicker,\n      totalItems,\n      action: Action,\n      positionConfig,\n      labelOptions,\n      isMostlyRTL,\n      flatLegend,\n    } = this.props;\n    const { color, isSeriesHidden, isItemHidden, seriesIdentifiers, label, pointStyle } = item;\n\n    if (isItemHidden) return null;\n\n    const itemClassNames = classNames('echLegendItem', {\n      'echLegendItem--hidden': isSeriesHidden,\n      'echLegendItem--vertical': positionConfig.direction === LayoutDirection.Vertical,\n    });\n    const hasColorPicker = Boolean(colorPicker);\n    const extra = showExtra ? getExtra(extraValues, item, totalItems) : null;\n    const style: CSSProperties = flatLegend\n      ? {}\n      : {\n          [isMostlyRTL ? 'marginRight' : 'marginLeft']: LEGEND_HIERARCHY_MARGIN * (item.depth ?? 0),\n        };\n    return (\n      <>\n        <li\n          className={itemClassNames}\n          onMouseEnter={this.onLegendItemMouseOver}\n          onMouseLeave={this.onLegendItemMouseOut}\n          style={style}\n          dir={isMostlyRTL ? 'rtl' : 'ltr'}\n          data-ech-series-name={label}\n        >\n          <div className=\"background\" />\n          <div className=\"colorWrapper\">\n            <ItemColor\n              ref={this.colorRef}\n              color={color}\n              seriesName={label}\n              isSeriesHidden={isSeriesHidden}\n              hasColorPicker={hasColorPicker}\n              onClick={this.handleColorClick(hasColorPicker)}\n              pointStyle={pointStyle}\n            />\n          </div>\n          <ItemLabel\n            label={label}\n            options={labelOptions}\n            isToggleable={totalItems > 1 && item.isToggleable}\n            onToggle={this.onLabelToggle(seriesIdentifiers)}\n            isSeriesHidden={isSeriesHidden}\n          />\n          {extra && !isSeriesHidden && renderExtra(extra.formatted)}\n          {Action && (\n            <div className=\"echLegendItem__action\">\n              <Action series={seriesIdentifiers} color={color} label={label} />\n            </div>\n          )}\n        </li>\n        {this.renderColorPicker()}\n      </>\n    );\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\n\nimport { LegendSpec, LegendPositionConfig } from '../../specs/settings';\nimport { LayoutDirection, Position } from '../../utils/common';\nimport { Dimensions, Size } from '../../utils/dimensions';\n\nconst INSIDE_PADDING = 10;\n\n/** @internal */\nexport function legendPositionStyle(\n  { legendPosition }: LegendSpec,\n  legendSize: Size,\n  chart: Dimensions,\n  container: Dimensions,\n): CSSProperties {\n  const { vAlign, hAlign, direction, floating } = getLegendPositionConfig(legendPosition);\n  // non-float legend doesn't need a special handling\n  if (!floating) {\n    return {};\n  }\n\n  const { Left, Right, Top, Bottom } = Position;\n\n  if (direction === LayoutDirection.Vertical) {\n    return {\n      position: 'absolute',\n      zIndex: 1,\n      right: hAlign === Right ? container.width - chart.width - chart.left + INSIDE_PADDING : undefined,\n      left: hAlign === Left ? chart.left + INSIDE_PADDING : undefined,\n      top: vAlign === Top ? chart.top : undefined,\n      bottom: vAlign === Bottom ? container.height - chart.top - chart.height : undefined,\n      height: legendSize.height >= chart.height ? chart.height : undefined,\n    };\n  }\n\n  return {\n    position: 'absolute',\n    zIndex: 1,\n    right: INSIDE_PADDING,\n    left: chart.left + INSIDE_PADDING,\n    top: vAlign === Top ? chart.top : undefined,\n    bottom: vAlign === Bottom ? container.height - chart.top - chart.height : undefined,\n    height: legendSize.height >= chart.height ? chart.height : undefined,\n  };\n}\n\n/** @internal */\nexport const LEGEND_TO_FULL_CONFIG: Record<Position, LegendPositionConfig> = {\n  [Position.Left]: {\n    vAlign: Position.Top,\n    hAlign: Position.Left,\n    direction: LayoutDirection.Vertical,\n    floating: false,\n    floatingColumns: 1,\n  },\n  [Position.Top]: {\n    vAlign: Position.Top,\n    hAlign: Position.Left,\n    direction: LayoutDirection.Horizontal,\n    floating: false,\n    floatingColumns: 1,\n  },\n  [Position.Bottom]: {\n    vAlign: Position.Bottom,\n    hAlign: Position.Left,\n    direction: LayoutDirection.Horizontal,\n    floating: false,\n    floatingColumns: 1,\n  },\n  [Position.Right]: {\n    vAlign: Position.Top,\n    hAlign: Position.Right,\n    direction: LayoutDirection.Vertical,\n    floating: false,\n    floatingColumns: 1,\n  },\n};\n\n/**\n * @internal\n */\nexport function getLegendPositionConfig(position: LegendSpec['legendPosition']): LegendPositionConfig {\n  return typeof position === 'object' ? position : LEGEND_TO_FULL_CONFIG[position];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendPositionConfig } from '../../specs/settings';\nimport { clamp, LayoutDirection } from '../../utils/common';\nimport { Margins, Size } from '../../utils/dimensions';\nimport { LegendStyle as ThemeLegendStyle } from '../../utils/themes/theme';\n\n/** @internal */\nexport type LegendStyle =\n  | {\n      width?: string;\n      maxWidth?: string;\n      marginLeft?: number;\n      marginRight?: number;\n    }\n  | {\n      height?: string;\n      maxHeight?: string;\n      marginTop?: number;\n      marginBottom?: number;\n    };\n\n/** @internal */\nexport interface LegendListStyle {\n  paddingTop?: number | string;\n  paddingBottom?: number | string;\n  paddingLeft?: number | string;\n  paddingRight?: number | string;\n  gridTemplateColumns?: string;\n}\n\n/**\n * Get the legend list style\n * @internal\n */\nexport function getLegendListStyle(\n  { direction, floating, floatingColumns }: LegendPositionConfig,\n  chartMargins: Margins,\n  legendStyle: ThemeLegendStyle,\n  totalItems: number,\n): LegendListStyle {\n  const { top: paddingTop, bottom: paddingBottom, left: paddingLeft, right: paddingRight } = chartMargins;\n\n  if (direction === LayoutDirection.Horizontal) {\n    return {\n      paddingLeft,\n      paddingRight,\n      gridTemplateColumns: totalItems === 1 ? '1fr' : `repeat(auto-fill, minmax(${legendStyle.verticalWidth}px, 1fr))`,\n    };\n  }\n\n  return {\n    paddingTop,\n    paddingBottom,\n    ...(floating && {\n      gridTemplateColumns: `repeat(${clamp(floatingColumns ?? 1, 1, totalItems)}, auto)`,\n    }),\n  };\n}\n\n/**\n * Get the legend global style\n * @internal\n */\nexport function getLegendStyle({ direction, floating }: LegendPositionConfig, size: Size, margin: number): LegendStyle {\n  if (direction === LayoutDirection.Vertical) {\n    const width = `${size.width}px`;\n    return {\n      width: floating ? undefined : width,\n      maxWidth: floating ? undefined : width,\n      marginLeft: margin,\n      marginRight: margin,\n    };\n  }\n  const height = `${size.height}px`;\n  return {\n    height,\n    maxHeight: height,\n    marginTop: margin,\n    marginBottom: margin,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PrimitiveValue } from '../../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { LegendItemExtraValues, LegendItem } from '../../common/legend';\n\n/** @internal */\nexport function getExtra(\n  extraValues: Map<string, LegendItemExtraValues>,\n  item: LegendItem,\n  totalItems: number,\n): { raw: PrimitiveValue; formatted: string } | null {\n  const { seriesIdentifiers, defaultExtra, childId, path } = item;\n  // don't show extra if the legend item is associated with multiple series\n  if (extraValues.size === 0 || seriesIdentifiers.length > 1 || !seriesIdentifiers[0]) {\n    return defaultExtra ? { formatted: `${defaultExtra.formatted ?? ''}`, raw: defaultExtra.raw } : null;\n  }\n  const [{ key }] = seriesIdentifiers;\n  const extraValueKey = path.map(({ index }) => index).join('__');\n  const itemExtraValues = extraValues.has(extraValueKey) ? extraValues.get(extraValueKey) : extraValues.get(key);\n  const actionExtra = childId !== undefined ? itemExtraValues?.get(childId) : undefined;\n  return actionExtra\n    ? actionExtra\n    : extraValues.size === totalItems && defaultExtra\n      ? { formatted: `${defaultExtra.formatted ?? ''}`, raw: defaultExtra.raw }\n      : null;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { FC, Suspense } from 'react';\n\nimport { SettingsProps } from '../specs';\n\ninterface NoResultsProps {\n  renderFn?: SettingsProps['noResults'];\n}\n\n/** @internal */\nexport const NoResults: FC<NoResultsProps> = ({ renderFn }) => (\n  <Suspense fallback={() => null}>\n    <div className=\"echReactiveChart_noResults\">{renderFn ?? <p>No data to display</p>}</div>\n  </Suspense>\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './tooltip_portal';\nexport * from './types';\nexport * from './utils';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { createPopper, Instance, Placement as PopperPlacement } from '@popperjs/core';\nimport { ReactNode, useCallback, useEffect, useMemo, useRef } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { PortalAnchorRef, PositionedPortalAnchorRef, TooltipPortalSettings } from './types';\nimport { DEFAULT_POPPER_SETTINGS, getOrCreateNode, isHTMLElement } from './utils';\nimport { isDefined, mergePartial } from '../../utils/common';\nimport { Padding } from '../../utils/dimensions';\n\n/**\n * @todo make this type conditional to use PortalAnchorProps or PortalAnchorRefProps\n */\ntype PortalTooltipProps = {\n  zIndex: number;\n  /**\n   * String used to designate unique portal\n   */\n  scope: string;\n  /**\n   * children to render inside the tooltip\n   */\n  children: ReactNode;\n  /**\n   * Used to determine if tooltip is visible\n   */\n  visible: boolean;\n  /**\n   * Settings to control portal positioning\n   */\n  settings?: TooltipPortalSettings;\n  /**\n   * Anchor element to use as position reference\n   */\n  anchor: PortalAnchorRef | PositionedPortalAnchorRef;\n  /**\n   * Chart Id to add new anchor for each chart on the page\n   */\n  chartId: string;\n\n  /**\n   * Called when computed placement changes\n   */\n  onPlacementChange?: (placement: PopperPlacement) => void;\n};\n\nfunction addToPadding(padding: Partial<Padding> | number = 0, extra: number = 0): Padding | number | undefined {\n  if (typeof padding === 'number') return padding + extra;\n\n  const { top = 0, right = 0, bottom = 0, left = 0 } = padding;\n\n  return {\n    top: top + extra,\n    right: right + extra,\n    bottom: bottom + extra,\n    left: left + extra,\n  };\n}\n\nconst TooltipPortalComponent = ({\n  anchor,\n  scope,\n  settings,\n  children,\n  visible,\n  chartId,\n  zIndex,\n  onPlacementChange,\n}: PortalTooltipProps) => {\n  const finalPlacement = useRef<PopperPlacement>('auto');\n  const skipPositioning = isHTMLElement((anchor as PortalAnchorRef).current);\n  const { position } = anchor as PositionedPortalAnchorRef;\n\n  /**\n   * Anchor element used to position tooltip\n   */\n  const anchorNode = useMemo(() => {\n    return (\n      (anchor as PortalAnchorRef)?.current ??\n      getOrCreateNode(\n        `echAnchor${scope}__${chartId}`,\n        undefined,\n        (anchor as PositionedPortalAnchorRef)?.appendRef?.current,\n      )\n    );\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [(anchor as PortalAnchorRef)?.current ?? (anchor as PositionedPortalAnchorRef)?.appendRef?.current]);\n\n  const portalNode = useMemo(() => {\n    return getOrCreateNode(`echTooltipPortal${scope}__${chartId}`, 'echTooltipPortal__invisible', undefined, zIndex);\n  }, [chartId, scope, zIndex]);\n\n  /**\n   * This must not be removed from DOM throughout life of this component.\n   * Otherwise the portal will loose reference to the correct node.\n   */\n  useEffect(() => {\n    document.body.appendChild(portalNode);\n  }, [portalNode]);\n\n  /**\n   * Popper instance used to manage position of tooltip.\n   */\n  const popper = useRef<Instance | null>(null);\n  const popperSettings = useMemo(() => {\n    // @ts-ignore - nesting limitation\n    return mergePartial(DEFAULT_POPPER_SETTINGS, settings);\n  }, [settings]);\n\n  const destroyPopper = useCallback(() => {\n    if (popper.current) {\n      popper.current.destroy();\n      popper.current = null;\n    }\n  }, []);\n\n  const setPopper = useCallback(() => {\n    if (!visible) return;\n\n    const { fallbackPlacements, placement, boundary, offset, boundaryPadding } = popperSettings;\n    popper.current = createPopper(anchorNode, portalNode, {\n      strategy: 'absolute',\n      placement,\n      modifiers: [\n        {\n          name: 'offset',\n          options: {\n            offset: [0, offset],\n          },\n        },\n        {\n          name: 'preventOverflow',\n          options: {\n            boundary,\n            padding: boundaryPadding,\n          },\n        },\n        {\n          name: 'flip',\n          options: {\n            // Note: duplicate values causes lag\n            fallbackPlacements: fallbackPlacements.filter((p) => p !== placement),\n            boundary,\n            // checks main axis overflow before trying to flip\n            altAxis: false,\n            padding: addToPadding(boundaryPadding, offset),\n          },\n        },\n        {\n          name: 'reportPlacement',\n          phase: 'afterWrite',\n          enabled: Boolean(onPlacementChange),\n          fn: ({ state }) => {\n            if (finalPlacement.current !== state.placement) {\n              finalPlacement.current = state.placement;\n              onPlacementChange?.(state.placement);\n            }\n          },\n        },\n      ],\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    visible,\n    popperSettings.fallbackPlacements,\n    popperSettings.placement,\n    popperSettings.boundary,\n    popperSettings.offset,\n  ]);\n\n  useEffect(() => {\n    setPopper();\n    const nodeCopy = portalNode;\n\n    return () => {\n      if (nodeCopy.parentNode) {\n        nodeCopy.parentNode.removeChild(nodeCopy);\n      }\n\n      destroyPopper();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    destroyPopper();\n    setPopper();\n  }, [destroyPopper, setPopper, popperSettings]);\n\n  useEffect(() => {\n    if (!visible) {\n      destroyPopper();\n    } else if (!popper.current) {\n      setPopper();\n    }\n  }, [destroyPopper, setPopper, visible]);\n\n  const updateAnchorDimensions = useCallback(() => {\n    if (!position || !visible || skipPositioning) {\n      return;\n    }\n\n    const { x, y, width, height } = position;\n    anchorNode.style.transform = `translate(${x}px, ${y}px)`;\n\n    if (isDefined(width)) {\n      anchorNode.style.width = `${width}px`;\n    }\n\n    if (isDefined(height)) {\n      anchorNode.style.height = `${height}px`;\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [visible, anchorNode, position?.x, position?.y, position?.width, position?.height]);\n\n  useEffect(() => {\n    if (!position && !skipPositioning) {\n      portalNode.classList.add('echTooltipPortal__invisible');\n      return;\n    }\n    portalNode.classList.remove('echTooltipPortal__invisible');\n  }, [portalNode.classList, position, skipPositioning]);\n\n  useEffect(() => {\n    if (popper.current) {\n      updateAnchorDimensions();\n      void popper.current.update();\n    }\n  }, [updateAnchorDimensions]);\n\n  return createPortal(children, portalNode, 'ech-tooltip-portal');\n};\n\nTooltipPortalComponent.displayName = 'TooltipPortal';\n\n/** @internal */\nexport const TooltipPortal = TooltipPortalComponent;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RefObject } from 'react';\nimport { $Values } from 'utility-types';\n\nimport { Padding } from '../../utils/dimensions';\n\n/**\n * Placement used in positioning tooltip\n * @public\n */\nexport const Placement = Object.freeze({\n  Top: 'top' as const,\n  Bottom: 'bottom' as const,\n  Left: 'left' as const,\n  Right: 'right' as const,\n  TopStart: 'top-start' as const,\n  TopEnd: 'top-end' as const,\n  BottomStart: 'bottom-start' as const,\n  BottomEnd: 'bottom-end' as const,\n  RightStart: 'right-start' as const,\n  RightEnd: 'right-end' as const,\n  LeftStart: 'left-start' as const,\n  LeftEnd: 'left-end' as const,\n  Auto: 'auto' as const,\n  AutoStart: 'auto-start' as const,\n  AutoEnd: 'auto-end' as const,\n});\n\n/**\n * {@inheritDoc (Placement:variable)}\n * @public\n */\nexport type Placement = $Values<typeof Placement>;\n\n/** @internal */\nexport type AnchorPosition = {\n  /**\n   * the right position of anchor\n   */\n  x: number;\n  /**\n   * the top position of the anchor\n   */\n  y: number;\n  /**\n   * the width of the anchor\n   */\n  width: number;\n  /**\n   * the height of the anchor\n   */\n  height: number;\n};\n\n/**\n * Anchor element to position tooltip relative to invisible anchor via ref element\n *\n * @internal\n */\nexport type PortalAnchorRef = RefObject<HTMLElement>;\n\n/**\n * Used to position tooltip relative to invisible anchor via ref element\n *\n * @internal\n */\nexport interface PositionedPortalAnchorRef {\n  /**\n   * Positioning values relative to `anchorRef`. Return `null` if tooltip is not visible.\n   */\n  position: AnchorPosition | null;\n  /**\n   * Element to append new anchor node if anchorRef is not provided\n   *\n   * @defaultValue document.body\n   */\n  appendRef?: RefObject<HTMLElement>;\n}\n\n/**\n * Tooltip portal settings\n *\n * @public\n */\nexport interface TooltipPortalSettings<B = never> {\n  /**\n   * Preferred placement of tooltip relative to anchor.\n   *\n   * This may not be the final placement given the positioning fallbacks.\n   *\n   * @defaultValue `right` {@link (Placement:type) | Placement.Right}\n   */\n  placement?: Placement;\n  /**\n   * If given tooltip placement is not suitable, these `Placement`s will\n   * be used as fallback placements.\n   */\n  fallbackPlacements?: Placement[];\n  /**\n   * Boundary element to contain tooltip within\n   *\n   * `'chart'` will use the chart container as the boundary\n   *\n   * @defaultValue parent scroll container\n   */\n  boundary?: HTMLElement | B;\n  /**\n   * Boundary element padding.\n   * Used to reduce extents of boundary placement when margins or paddings are used on boundary\n   *\n   * @defaultValue 0\n   */\n  boundaryPadding?: Partial<Padding> | number;\n  /**\n   * Custom tooltip offset\n   * @defaultValue 10\n   */\n  offset?: number;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Required } from 'utility-types';\n\nimport { TooltipPortalSettings, Placement } from './types';\n\n/** @internal */\nexport const DEFAULT_POPPER_SETTINGS: Required<TooltipPortalSettings, 'fallbackPlacements' | 'placement' | 'offset'> = {\n  fallbackPlacements: [Placement.Right, Placement.Left, Placement.Top, Placement.Bottom],\n  placement: Placement.Right,\n  offset: 10,\n};\n\n/**\n * Creates new dom element with given id and attaches to parent\n *\n * @internal\n */\nexport function getOrCreateNode(\n  id: string,\n  className?: string,\n  parent?: HTMLElement | null,\n  zIndex: number = 0,\n): HTMLDivElement {\n  // eslint-disable-next-line unicorn/prefer-query-selector\n  const node = document.getElementById(id);\n  if (node) {\n    return node as HTMLDivElement;\n  }\n\n  const newNode = document.createElement('div');\n  newNode.id = id;\n  if (className) {\n    newNode.classList.add(className);\n  }\n  newNode.style.zIndex = `${zIndex}`;\n  (parent ?? document.body).appendChild(newNode);\n  return newNode;\n}\n\n/**\n * @link https://stackoverflow.com/questions/254302/how-can-i-determine-the-type-of-an-html-element-in-javascript\n * @internal\n */\nexport function isHTMLElement(value: any): value is HTMLElement {\n  return typeof value === 'object' && value !== null && 'nodeName' in value;\n}\n\n/**\n * Returns the top-most defined z-index in the element's ancestor hierarchy\n * relative to the `target` element; if no z-index is defined, returns 0\n * @param element {HTMLElement}\n * @param cousin {HTMLElement}\n * @returns {number}\n * @internal\n */\nexport function getElementZIndex(element: HTMLElement, cousin: HTMLElement): number {\n  /**\n   * finding the z-index of `element` is not the full story\n   * its the CSS stacking context that is important\n   * take this DOM for example:\n   * body\n   *   section[z-index: 1000]\n   *     p[z-index: 500]\n   *       button\n   *   div\n   *\n   * what z-index does the `div` need to display next to `button`?\n   * the `div` and `section` are where the stacking context splits\n   * so `div` needs to copy `section`'s z-index in order to\n   * appear next to / over `button`\n   *\n   * calculate this by starting at `button` and finding its offsetParents\n   * then walk the parents from top -> down until the stacking context\n   * split is found, or if there is no split then a specific z-index is unimportant\n   */\n\n  // build the array of the element + its offset parents\n  const nodesToInspect: HTMLElement[] = [];\n  while (true) {\n    nodesToInspect.push(element);\n\n    // AFAICT this is a valid cast - the libdefs appear wrong\n    element = element.offsetParent as HTMLElement;\n\n    // stop if there is no parent\n    if (!element) {\n      break;\n    }\n\n    // stop if the parent contains the related element\n    // as this is the z-index ancestor\n    if (element.contains(cousin)) {\n      break;\n    }\n  }\n\n  // reverse the nodes to walk from top -> element\n  for (let i = nodesToInspect.length - 1; i >= 0; i--) {\n    const node = nodesToInspect[i];\n    if (!node) continue;\n\n    // get this node's z-index css value\n    const zIndex = window.document.defaultView!.getComputedStyle(node).getPropertyValue('z-index');\n\n    // if the z-index is not a number (e.g. \"auto\") return null, else the value\n    const parsedZIndex = parseInt(zIndex, 10);\n    if (Number.isFinite(parsedZIndex)) {\n      return parsedZIndex;\n    }\n  }\n\n  return 0;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// general components\nexport * from './tooltip_wrapper';\nexport * from './tooltip_container';\nexport * from './tooltip_header';\nexport * from './tooltip_footer';\nexport * from './tooltip_divider';\nexport * from './tooltip_metric_row';\n\n// table components and types\nexport * from './types';\nexport * from './tooltip_table';\nexport * from './tooltip_table_body';\nexport * from './tooltip_table_header';\nexport * from './tooltip_table_row';\nexport * from './tooltip_table_footer';\nexport * from './tooltip_table_cell';\nexport * from './tooltip_table_color_cell';\n\nexport * from './tooltip_provider';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { ComponentType, useEffect, useState } from 'react';\n\nimport { TooltipDivider } from './tooltip_divider';\nimport { useTooltipContext } from './tooltip_provider';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipAction, TooltipSpec, TooltipValue } from '../../../specs';\nimport { Datum, renderWithProps } from '../../../utils/common';\n\n/** @internal */\nexport const TooltipActions = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  actions,\n  selectionPrompt,\n  actionsLoading,\n  noActionsLoaded,\n}: Pick<TooltipSpec<D, SI>, 'actions' | 'selectionPrompt' | 'actionsLoading' | 'noActionsLoaded'>) => {\n  const { pinned, selected, values, pinTooltip } = useTooltipContext<D, SI>();\n  const syncActions = Array.isArray(actions);\n  const [loading, setLoading] = useState(true);\n  const [loadedActions, setLoadedActions] = useState<TooltipAction<D, SI>[]>(syncActions ? actions : []);\n\n  useEffect(() => {\n    if (pinned && !syncActions) {\n      const fetchActions = async (\n        asyncActions: (s: TooltipValue<D, SI>[]) => Promise<TooltipAction<D, SI>[]> | TooltipAction<D, SI>[],\n      ) => {\n        setLoading(true);\n        setLoadedActions(await asyncActions(selected));\n        setLoading(false);\n      };\n      void fetchActions(actions);\n      return () => {\n        setLoading(true);\n        setLoadedActions([]);\n      };\n    }\n  }, [syncActions, actions, selected, pinned]);\n\n  if (!syncActions) {\n    if (loading) return renderPromptContent(actionsLoading, selected);\n    if (loadedActions.length === 0) return renderPromptContent(noActionsLoaded, selected);\n  }\n\n  if (pinned && syncActions && loadedActions.length === 0) {\n    return null;\n  }\n\n  const visibleActions = loadedActions.filter(({ hide }) => !hide || hide(selected, values));\n\n  if (visibleActions.length === 0) {\n    return renderPromptContent(selectionPrompt, selected);\n  }\n\n  return (\n    <div className=\"echTooltipActions\">\n      <TooltipDivider />\n      {...visibleActions.map(({ onSelect, label, disabled }, i) => {\n        const reason = disabled && disabled(selected, values);\n\n        return (\n          <button\n            className=\"echTooltipActions__action\"\n            key={`${i}`}\n            title={typeof reason === 'string' ? reason : undefined}\n            disabled={Boolean(reason)}\n            onClick={() => {\n              pinTooltip(false, true);\n              // timeout used to close tooltip before calling action\n              setTimeout(() => {\n                onSelect(selected, values);\n              }, 0);\n            }}\n          >\n            {typeof label === 'string' ? label : label(selected, values)}\n          </button>\n        );\n      })}\n    </div>\n  );\n};\n\nfunction renderPromptContent<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  content: string | ComponentType<{ selected: TooltipValue<D, SI>[] }>,\n  selected: Array<TooltipValue<D, SI>>,\n) {\n  return (\n    <div className=\"echTooltipActions\">\n      <TooltipDivider />\n      <div className=\"echTooltipActions__prompt\">{renderWithProps(content, { selected })}</div>\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { PropsWithChildren } from 'react';\n\nimport { useTooltipContext } from './tooltip_provider';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum } from '../../../specs';\nimport { Datum, renderComplexChildren } from '../../../utils/common';\n\n/** @public */\nexport const TooltipContainer = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  props: PropsWithChildren<{ className?: string }>,\n) => {\n  const { pinned } = useTooltipContext<D, SI>();\n  return (\n    <div className={classNames('echTooltip', props.className, { 'echTooltip--pinned': pinned })}>\n      {renderComplexChildren(props.children)}\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { CSSProperties } from 'react';\n\ninterface TooltipDividerProps {\n  margin?: CSSProperties['margin'];\n}\n\n/** @public */\nexport const TooltipDivider = ({ margin }: TooltipDividerProps) => {\n  return <div style={{ margin }} className=\"echTooltipDivider\"></div>;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { PropsWithChildren } from 'react';\n\nimport { renderComplexChildren } from '../../../utils/common';\n\ntype TooltipFooterProps = PropsWithChildren<{}>;\n\n/** @public */\nexport const TooltipFooter = ({ children }: TooltipFooterProps) => {\n  return <div className=\"echTooltipFooter\">{renderComplexChildren(children)}</div>;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { memo } from 'react';\n\nimport { BaseDatum, TooltipHeaderFormatter } from '../../../specs';\nimport { PointerValue } from '../../../state/types';\nimport { Datum, renderComplexChildren } from '../../../utils/common';\nimport { PropsOrChildrenWithProps } from '../types';\n\n/** @public */\nexport type TooltipHeaderProps<D extends BaseDatum = Datum> = PropsOrChildrenWithProps<{\n  header?: PointerValue<D> | null;\n  formatter?: TooltipHeaderFormatter<D>;\n}>;\n\nconst TooltipHeaderInner = <D extends BaseDatum = Datum>(props: TooltipHeaderProps<D>) => {\n  if ('children' in props) {\n    return <div className=\"echTooltipHeader\">{renderComplexChildren(props.children)}</div>;\n  }\n\n  const { header, formatter } = props;\n\n  if (!header) return null;\n\n  const formattedValue = formatter ? formatter(header) : header.formattedValue;\n\n  if (!formattedValue) return null;\n\n  return <div className=\"echTooltipHeader\">{formattedValue}</div>;\n};\n\n/** @public */\nexport const TooltipHeader = memo(TooltipHeaderInner) as typeof TooltipHeaderInner;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { memo, ReactNode } from 'react';\n\ntype TooltipMetricRowProps = {\n  label: string;\n  metric: ReactNode;\n};\n\n/** @public */\nexport const TooltipMetricRow = memo(({ label, metric }: TooltipMetricRowProps) => {\n  return (\n    <div className=\"echTooltip__metricRow\">\n      {label}\n      <b>{metric}</b>\n    </div>\n  );\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { PropsWithChildren } from 'react';\n\nimport { TooltipDivider } from './tooltip_divider';\n\n/** @internal */\nexport function TooltipPrompt({ children }: PropsWithChildren<{}>) {\n  return (\n    <div className=\"echTooltipPrompt slideDown\" key={Math.random()}>\n      <TooltipDivider />\n      <div className=\"echTooltipPrompt__content\">{children}</div>\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { PropsWithChildren, Context, useContext } from 'react';\n\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { pinTooltip as pinTooltipAction } from '../../../state/actions/tooltip';\nimport { Datum } from '../../../utils/common';\nimport { LIGHT_THEME } from '../../../utils/themes/light_theme';\nimport { TooltipStyle } from '../../../utils/themes/theme';\nimport { CustomTooltipProps, PinTooltipCallback } from '../types';\n\n/** @public */\nexport interface TooltipContext<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> {\n  theme: TooltipStyle;\n  backgroundColor: string;\n  dir: 'rtl' | 'ltr';\n  maxItems: number;\n  actionable: boolean;\n  pinned: boolean;\n  canPinTooltip: boolean;\n  pinTooltip: PinTooltipCallback;\n  values: TooltipValue<D, SI>[];\n  selected: Array<TooltipValue<D, SI>>;\n  toggleSelected: CustomTooltipProps['toggleSelected'];\n  setSelection: CustomTooltipProps['setSelection'];\n}\n\nconst TooltipContext = React.createContext<TooltipContext>({\n  backgroundColor: '#fff',\n  dir: 'ltr',\n  maxItems: 5,\n  pinned: false,\n  actionable: false,\n  canPinTooltip: false,\n  selected: [],\n  toggleSelected: () => {},\n  setSelection: () => {},\n  values: [],\n  pinTooltip: pinTooltipAction,\n  theme: LIGHT_THEME.tooltip,\n});\n\n/** @public */\nexport const useTooltipContext = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>() =>\n  useContext<TooltipContext<D, SI>>(TooltipContext as unknown as Context<TooltipContext<D, SI>>);\n\ntype TooltipProviderProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsWithChildren<TooltipContext<D, SI>>;\n\n/** @internal */\nexport const TooltipProvider = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  children,\n  ...rest\n}: TooltipProviderProps<D, SI>) => {\n  return <TooltipContext.Provider value={rest}>{children}</TooltipContext.Provider>;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { CSSProperties } from 'react';\n\nimport { useTooltipContext } from './tooltip_provider';\nimport { TooltipTableBody } from './tooltip_table_body';\nimport { TooltipTableFooter } from './tooltip_table_footer';\nimport { TooltipTableHeader } from './tooltip_table_header';\nimport { TooltipTableColumn } from './types';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { Datum, isNil } from '../../../utils/common';\nimport { PropsOrChildrenWithProps, ToggleSelectedTooltipItemCallback } from '../types';\n\nconst TOOLTIP_ITEM_HEIGHT = 20;\nconst TOOLTIP_HEADER_HEIGHT = 25;\nconst TOOLTIP_FOOTER_HEIGHT = 25;\n\n/**\n * Manually synced with `$colorStripCheckWidth` scss var in [`_tooltip.scss`](packages/charts/src/components/tooltip/_tooltip.scss)\n */\nconst COLOR_STRIP_CHECK_WIDTH = 11;\n\ntype TooltipTableProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsOrChildrenWithProps<\n  {\n    columns: TooltipTableColumn<D, SI>[];\n    items: TooltipValue<D, SI>[];\n    pinned?: boolean;\n    onSelect?: ToggleSelectedTooltipItemCallback;\n    selected?: TooltipValue<D, SI>[];\n  },\n  {\n    /**\n     * Used to define the column widths, otherwise auto-generated\n     */\n    gridTemplateColumns: CSSProperties['gridTemplateColumns'];\n  },\n  {\n    className?: string;\n    maxHeight?: CSSProperties['maxHeight'];\n  }\n>;\n\n/** @public */\nexport const TooltipTable = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  className,\n  ...props\n}: TooltipTableProps<D, SI>) => {\n  const tooltipContext = useTooltipContext<D, SI>();\n  const pinned = props.pinned ?? tooltipContext.pinned;\n  const wrapperClasses = classNames('echTooltip__tableWrapper', { 'echTooltip__tableWrapper--pinned': pinned });\n  if ('children' in props) {\n    const { gridTemplateColumns, maxHeight } = props;\n    const classes = classNames('echTooltip__table', className, {\n      'echTooltip__table--noGrid': !gridTemplateColumns,\n    });\n    return (\n      <div className={wrapperClasses} style={{ maxHeight }}>\n        <div role=\"table\" className={classes} style={{ gridTemplateColumns }}>\n          {props.children}\n        </div>\n      </div>\n    );\n  }\n  const { items, onSelect, selected = [] } = { selected: tooltipContext.selected, ...props };\n  const columns = props.columns.filter(({ hidden }) => {\n    return !(typeof hidden === 'boolean' ? hidden : hidden?.(props.items) ?? false);\n  });\n\n  const gridTemplateColumns = columns\n    .map(({ type, width }) => width ?? (type === 'color' ? COLOR_STRIP_CHECK_WIDTH : 'auto'))\n    .map((width) => (typeof width === 'number' ? `${width}px` : width))\n    .join(' ');\n\n  return (\n    <div className={wrapperClasses} style={{ maxHeight: props.maxHeight }}>\n      <div role=\"table\" className={classNames('echTooltip__table', className)} style={{ gridTemplateColumns }}>\n        <TooltipTableHeader columns={columns} items={props.items} />\n        <TooltipTableBody columns={columns} items={items} pinned={pinned} onSelect={onSelect} selected={selected} />\n        <TooltipTableFooter columns={columns} items={props.items} />\n      </div>\n    </div>\n  );\n};\n\n/** @internal */\nexport function computeTableMaxHeight<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  pinned: boolean,\n  columns: TooltipTableColumn<D, SI>[],\n  maxHeight: CSSProperties['maxHeight'],\n  maxItems?: number,\n): CSSProperties['maxHeight'] {\n  if (pinned || isNil(maxItems)) return maxHeight;\n  const headerHeight = +columns.some((c) => c.header) * TOOLTIP_HEADER_HEIGHT;\n  const bodyHeight = (Math.max(maxItems, 1) + 0.5) * TOOLTIP_ITEM_HEIGHT;\n  const footerHeight = +columns.some((c) => c.footer) * TOOLTIP_FOOTER_HEIGHT;\n  return headerHeight + bodyHeight + footerHeight;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { ReactNode, useRef } from 'react';\n\nimport { TooltipTableCell } from './tooltip_table_cell';\nimport { TooltipTableColorCell } from './tooltip_table_color_cell';\nimport { TooltipTableRow } from './tooltip_table_row';\nimport { TooltipCellStyle, TooltipTableColumn } from './types';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { Datum } from '../../../utils/common';\nimport { PropsOrChildrenWithProps, ToggleSelectedTooltipItemCallback } from '../types';\n\ntype TooltipTableBodyProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsOrChildrenWithProps<\n  {\n    items: TooltipValue<D, SI>[];\n    columns: TooltipTableColumn<D, SI>[];\n    pinned?: boolean;\n    onSelect?: ToggleSelectedTooltipItemCallback;\n    selected: TooltipValue<D, SI>[];\n  },\n  {},\n  {\n    className?: string;\n  }\n>;\n\n/** @public */\nexport const TooltipTableBody = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  className,\n  ...props\n}: TooltipTableBodyProps<D, SI>) => {\n  const tableBodyRef = useRef<HTMLTableSectionElement | null>(null);\n\n  if ('children' in props) {\n    const classes = classNames('echTooltip__tableBody', className);\n    return (\n      <div role=\"rowgroup\" className={classes}>\n        {props.children}\n      </div>\n    );\n  }\n\n  const { items, pinned, selected, onSelect, columns } = props;\n  const classes = classNames('echTooltip__tableBody');\n  // TODO: find a better way determine this from the data\n  const allHighlighted = items.every((i) => i.isHighlighted);\n\n  return (\n    <div role=\"rowgroup\" className={classes} ref={tableBodyRef}>\n      {items.map((item) => {\n        const { isHighlighted, isVisible, displayOnly } = item;\n        if (!isVisible) return null;\n        return (\n          <TooltipTableRow\n            key={`${item.seriesIdentifier.key}-${item.label}-${item.value}`}\n            isHighlighted={!pinned && !allHighlighted && isHighlighted}\n            isSelected={pinned && selected.includes(item)}\n            onSelect={displayOnly || !onSelect ? undefined : () => onSelect(item)}\n          >\n            {columns.map((column, j) => {\n              return renderCellContent(item, column, column.id ?? `${column.type}-${j}`);\n            })}\n          </TooltipTableRow>\n        );\n      })}\n    </div>\n  );\n};\n\nfunction getCellStyles<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  style,\n  type,\n}: TooltipTableColumn<D, SI>): TooltipCellStyle {\n  const textAlign: TooltipCellStyle['textAlign'] = type === 'number' ? 'right' : type === 'text' ? 'left' : undefined;\n\n  return {\n    textAlign,\n    ...style,\n  };\n}\n\nfunction renderCellContent<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  item: TooltipValue<D, SI>,\n  column: TooltipTableColumn<D, SI>,\n  key: string,\n): ReactNode {\n  if (column.type === 'color') {\n    return <TooltipTableColorCell displayOnly={item.displayOnly} color={item.color} key={key} />;\n  }\n\n  return (\n    <TooltipTableCell truncate={column.truncate} style={getCellStyles(column)} key={key}>\n      {column.cell(item)}\n    </TooltipTableCell>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { PropsWithChildren } from 'react';\n\nimport { TooltipCellStyle } from './types';\nimport { isNonNullablePrimitiveValue } from '../../../utils/common';\n\n/** @public */\nexport type TooltipTableCellProps = PropsWithChildren<{\n  tagName?: 'td' | 'th';\n  truncate?: boolean;\n  className?: string;\n  title?: string;\n  style?: TooltipCellStyle;\n}>;\n\n/** @public */\nexport const TooltipTableCell = ({\n  style,\n  truncate = false,\n  tagName = 'td',\n  className,\n  children,\n  title: manualTitle,\n}: TooltipTableCellProps) => {\n  const classes = classNames('echTooltip__tableCell', className, {\n    'echTooltip__tableCell--truncate': truncate,\n  });\n\n  const title = manualTitle ?? (truncate && isNonNullablePrimitiveValue(children) ? `${children}` : undefined);\n  return (\n    <div role={tagName === 'th' ? 'rowheader' : 'gridcell'} className={classes} style={style} title={title}>\n      {children}\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React from 'react';\n\nimport { useTooltipContext } from './tooltip_provider';\nimport { TooltipTableCell, TooltipTableCellProps } from './tooltip_table_cell';\nimport { combineColors, highContrastColor } from '../../../common/color_calcs';\nimport { colorToRgba } from '../../../common/color_library_wrappers';\nimport { Color, Colors } from '../../../common/colors';\n\n/** @public */\nexport type ColorStripCellProps = Omit<TooltipTableCellProps, 'children' | 'width'> & {\n  color?: string;\n  displayOnly?: boolean;\n};\n\n/**\n * Renders color strip column cell\n * @public\n */\nexport function TooltipTableColorCell({\n  color,\n  className,\n  displayOnly,\n  ...cellProps\n}: ColorStripCellProps): JSX.Element | null {\n  // the backgroundColor is the chart background color, used here to correctly add a background to the stripe\n  // to match the same, optionally semi-transparent, color rendered on the chart\n  const { backgroundColor, theme } = useTooltipContext();\n\n  const getDotColor = (stripColor: string): Color => {\n    if (color === Colors.Transparent.keyword) {\n      return theme.defaultDotColor;\n    }\n    const foregroundRGBA = colorToRgba(stripColor === Colors.Transparent.keyword ? backgroundColor : stripColor);\n    const backgroundRGBA = colorToRgba(backgroundColor);\n    const blendedFgBg = combineColors(foregroundRGBA, backgroundRGBA);\n    return highContrastColor(blendedFgBg, 'WCAG3').color.keyword;\n  };\n\n  const renderColorStrip = () => {\n    if (!color) return null;\n    const dotColor = getDotColor(color);\n\n    return (\n      <>\n        <div className=\"echTooltip__colorStrip--bg\" style={{ backgroundColor }} />\n        <div className=\"echTooltip__colorStrip\" style={{ backgroundColor: color }}>\n          <div className=\"echTooltip__colorStrip--icon\" style={{ fill: dotColor }}>\n            {/* Check svg to match eui - https://github.com/elastic/eui/blob/main/src/components/icon/svgs/check.svg?short_path=5a87b2e */}\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n              <path\n                fillRule=\"evenodd\"\n                d=\"M6.50025,12.00025 C6.37225,12.00025 6.24425,11.95125 6.14625,11.85425 L2.14625,7.85425 C1.95125,7.65825 1.95125,7.34225 2.14625,7.14625 C2.34225,6.95125 2.65825,6.95125 2.85425,7.14625 L6.50025,10.79325 L13.14625,4.14625 C13.34225,3.95125 13.65825,3.95125 13.85425,4.14625 C14.04925,4.34225 14.04925,4.65825 13.85425,4.85425 L6.85425,11.85425 C6.75625,11.95125 6.62825,12.00025 6.50025,12.00025\"\n              />\n            </svg>\n          </div>\n        </div>\n        <div className=\"echTooltip__colorStrip--spacer\" />\n      </>\n    );\n  };\n\n  return (\n    <TooltipTableCell\n      {...cellProps}\n      className={classNames('echTooltip__colorCell', className, {\n        'echTooltip__colorCell--static': displayOnly,\n      })}\n    >\n      {renderColorStrip()}\n    </TooltipTableCell>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React from 'react';\n\nimport { TooltipTableCell } from './tooltip_table_cell';\nimport { TooltipTableColorCell } from './tooltip_table_color_cell';\nimport { TooltipTableRow } from './tooltip_table_row';\nimport { TooltipTableColumn } from './types';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { Datum } from '../../../utils/common';\nimport { PropsOrChildrenWithProps } from '../types';\n\ntype TooltipTableFooterProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsOrChildrenWithProps<\n  {\n    columns: TooltipTableColumn<D, SI>[];\n    items: TooltipValue<D, SI>[];\n  },\n  {},\n  {\n    className?: string;\n  }\n>;\n\n/** @public */\nexport const TooltipTableFooter = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  className,\n  ...props\n}: TooltipTableFooterProps<D, SI>) => {\n  const classes = classNames('echTooltip__tableFooter', className);\n  if ('children' in props) {\n    return (\n      <div role=\"rowgroup\" className={classes}>\n        {props.children}\n      </div>\n    );\n  }\n\n  if (props.columns.every((c) => !c.footer)) return null;\n\n  return (\n    <div role=\"rowgroup\" className={classes}>\n      <TooltipTableRow>\n        {props.columns.map(({ style, id, className: cn, type, footer }, i) => {\n          const key = id ?? `${type}-${i}`;\n          if (type === 'color') return <TooltipTableColorCell className={cn} style={style} key={key} />;\n          return (\n            <TooltipTableCell className={cn} style={style} key={id ?? key}>\n              {footer ? (typeof footer === 'string' ? footer : footer(props.items)) : undefined}\n            </TooltipTableCell>\n          );\n        })}\n      </TooltipTableRow>\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React from 'react';\n\nimport { TooltipTableCell } from './tooltip_table_cell';\nimport { TooltipTableColorCell } from './tooltip_table_color_cell';\nimport { TooltipTableRow } from './tooltip_table_row';\nimport { TooltipTableColumn } from './types';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { Datum } from '../../../utils/common';\nimport { PropsOrChildrenWithProps } from '../types';\n\ntype TooltipTableHeaderProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsOrChildrenWithProps<\n  {\n    columns: TooltipTableColumn<D, SI>[];\n    items: TooltipValue<D, SI>[];\n  },\n  {},\n  {\n    className?: string;\n  }\n>;\n\n/** @public */\nexport const TooltipTableHeader = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  className,\n  ...props\n}: TooltipTableHeaderProps<D, SI>) => {\n  const classes = classNames('echTooltip__tableHeader', className);\n  if ('children' in props) {\n    return (\n      <div role=\"rowgroup\" className={classes}>\n        {props.children}\n      </div>\n    );\n  }\n\n  if (props.columns.every((c) => !c.header)) return null;\n\n  return (\n    <div role=\"rowgroup\" className={classes}>\n      <TooltipTableRow>\n        {props.columns.map(({ header, style, id, className: cn, type }, i) => {\n          const key = id ?? `${type}-${i}`;\n          if (type === 'color') return <TooltipTableColorCell className={cn} style={style} key={key} />;\n          return (\n            <TooltipTableCell className={cn} style={style} key={key}>\n              {header ? (typeof header === 'string' ? header : header(props.items)) : undefined}\n            </TooltipTableCell>\n          );\n        })}\n      </TooltipTableRow>\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { PropsWithChildren } from 'react';\n\nimport { useTooltipContext } from './tooltip_provider';\nimport { isNil } from '../../../utils/common';\n\ntype TooltipTableRowProps = PropsWithChildren<{\n  id?: string;\n  className?: string;\n  isHighlighted?: boolean;\n  isSelected?: boolean;\n  onSelect?: () => void;\n}>;\n\n/** @public */\nexport const TooltipTableRow = ({\n  id,\n  isHighlighted = false,\n  isSelected = false,\n  children,\n  onSelect,\n  className,\n}: TooltipTableRowProps) => {\n  const { actionable } = useTooltipContext();\n\n  const isSelectable = actionable && !isNil(onSelect);\n  const classes = classNames('echTooltip__tableRow', className, {\n    'echTooltip__tableRow--highlighted': isHighlighted,\n    'echTooltip__tableRow--selected': isSelected,\n    'echTooltip__tableRow--selectable': isSelectable,\n  });\n\n  return (\n    // cannot focus row using display: contents to structure grid\n    // eslint-disable-next-line jsx-a11y/interactive-supports-focus\n    <div\n      role=\"row\"\n      id={id}\n      className={classes}\n      onClick={isSelectable ? onSelect : undefined}\n      onKeyPress={isSelectable ? onSelect : undefined}\n    >\n      {children}\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { PropsWithChildren, useEffect, useRef, useState } from 'react';\n\nimport { TooltipActions } from './tooltip_actions';\nimport { TooltipPrompt } from './tooltip_prompt';\nimport { useTooltipContext } from './tooltip_provider';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum } from '../../../specs';\nimport { TooltipSpec } from '../../../specs/tooltip';\nimport { Datum } from '../../../utils/common';\n\ntype TooltipWrapperProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsWithChildren<\n  {\n    className?: string;\n  } & Pick<\n    TooltipSpec<D, SI>,\n    'actions' | 'actionPrompt' | 'pinningPrompt' | 'selectionPrompt' | 'actionsLoading' | 'noActionsLoaded'\n  >\n>;\n\n/** @internal */\nexport const TooltipWrapper = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  children,\n  className,\n  actions,\n  actionPrompt,\n  pinningPrompt,\n  selectionPrompt,\n  actionsLoading,\n  noActionsLoaded,\n}: TooltipWrapperProps<D, SI>) => {\n  const { dir, pinned, canPinTooltip, selected, theme, actionable } = useTooltipContext<D, SI>();\n\n  const tooltipRef = useRef<HTMLDivElement | null>(null);\n  const [minWidth, setMinWidth] = useState(0);\n\n  useEffect(() => {\n    // Capture initial unpinned tooltip width\n    window.requestAnimationFrame(() => {\n      if (tooltipRef.current) {\n        const { width } = tooltipRef.current.getBoundingClientRect();\n        setMinWidth(width);\n      }\n    });\n  }, []);\n\n  useEffect(() => {\n    // Capture pinned tooltip with on change\n    if (pinned && tooltipRef.current && typeof theme.maxWidth === 'number' && minWidth < theme.maxWidth) {\n      const { width } = tooltipRef.current.getBoundingClientRect();\n      if (width > minWidth) setMinWidth(width);\n    }\n  }, [selected, pinned, minWidth, theme.maxWidth]);\n\n  return (\n    <div\n      className={classNames('echTooltip', className, { 'echTooltip--pinned': pinned })}\n      dir={dir}\n      ref={tooltipRef}\n      style={{ minWidth }}\n      onClick={(e) => e.stopPropagation()} // block propagation of tooltip click\n      onKeyPress={(e) => e.stopPropagation()} // block propagation of tooltip click\n    >\n      {children}\n      {!canPinTooltip ? null : pinned ? (\n        <TooltipActions\n          actions={actions}\n          actionsLoading={actionsLoading}\n          noActionsLoaded={noActionsLoaded}\n          selectionPrompt={selectionPrompt}\n        />\n      ) : (\n        <TooltipPrompt>{actionable ? actionPrompt : pinningPrompt}</TooltipPrompt>\n      )}\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties, ReactNode } from 'react';\n\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum } from '../../../specs';\nimport { TooltipValue } from '../../../specs/tooltip';\nimport { Datum } from '../../../utils/common';\n\n/**\n * Styles to apply to tooltip table cell\n * @public */\nexport type TooltipCellStyle = Pick<\n  CSSProperties,\n  'maxHeight' | 'textAlign' | 'padding' | 'paddingTop' | 'paddingRight' | 'paddingBottom' | 'paddingLeft'\n>;\n\n/**\n * Base table column definition\n * @alpha\n */\nexport type TooltipTableColumnBase<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = {\n  /**\n   * Identifier for column to be used in callbacks if needed\n   */\n  id?: string;\n  /**\n   * ClassName to be applied to table cells within column (i.e. `td` or `th`)\n   */\n  className?: string;\n  /**\n   * Table column header\n   */\n  header?: string | ((items: TooltipValue<D, SI>[]) => string);\n  /**\n   * Table column footer\n   */\n  footer?: string | ((items: TooltipValue<D, SI>[]) => string);\n  /**\n   * Boolean to hide entire column from table\n   */\n  hidden?: boolean | ((items: TooltipValue<D, SI>[]) => boolean);\n  /**\n   * Limited styles to apply to table cells within column (i.e. `td` or `th`)\n   */\n  style?: TooltipCellStyle;\n  /**\n   * truncates cell content sharing the available width with other columns.\n   * Set width to control column width for truncating.\n   */\n  truncate?: boolean;\n  /**\n   * Width of column used to generate [gridTemplateColumns](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns).\n   */\n  width?: CSSProperties['gridTemplateColumns'];\n};\n\n/**\n * Table column definition for fully custom values\n * @alpha\n */\nexport interface TooltipTableColumnCustom<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends TooltipTableColumnBase<D, SI> {\n  type: 'custom';\n  /**\n   * Renders column cell element inside a `td` element\n   */\n  cell: (item: TooltipValue<D, SI>) => ReactNode;\n}\n\n/**\n * Table column definition for color strip\n * @alpha\n */\nexport interface TooltipTableColumnColor<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends Omit<TooltipTableColumnBase<D, SI>, 'header' | 'footer'> {\n  type: 'color';\n  header?: never;\n  footer?: never;\n}\n\n/**\n * Table column definition for number values\n * @alpha\n */\nexport interface TooltipTableColumnNumber<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends TooltipTableColumnBase<D, SI> {\n  type: 'number';\n  /**\n   * Renders column cell element inside a `td` element\n   */\n  cell: (item: TooltipValue<D, SI>) => string | number;\n}\n\n/**\n * Table column definition for text values\n * @alpha\n */\nexport interface TooltipTableColumnText<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends TooltipTableColumnBase<D, SI> {\n  type: 'text';\n  /**\n   * Renders column cell element inside a `td` element\n   */\n  cell: (item: TooltipValue<D, SI>) => string;\n}\n\n/**\n * Table column definition for number values\n *\n * @alpha\n */\nexport type TooltipTableColumn<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> =\n  | TooltipTableColumnCustom<D, SI>\n  | TooltipTableColumnColor<D, SI>\n  | TooltipTableColumnNumber<D, SI>\n  | TooltipTableColumnText<D, SI>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './components';\nexport * from './types';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Placement as PopperPlacement } from '@popperjs/core/lib/enums';\nimport { CSSProperties } from 'react';\n\nimport { TooltipStyle } from '../../utils/themes/theme';\n\n/** @internal */\nexport function getStylesFromPlacement(\n  actionable: boolean,\n  { maxWidth }: TooltipStyle,\n  placement?: PopperPlacement,\n): CSSProperties | undefined {\n  if (!actionable) return { maxWidth };\n  switch (placement) {\n    case 'left':\n    case 'left-start':\n    case 'left-end':\n    case 'top-end':\n    case 'bottom-end':\n      return {\n        maxWidth,\n        justifyContent: 'flex-end',\n      };\n    case 'right':\n    case 'right-start':\n    case 'right-end':\n    case 'top-start':\n    case 'bottom-start':\n      return {\n        maxWidth,\n        justifyContent: 'flex-start',\n      };\n    case 'top':\n    case 'bottom':\n      return {\n        maxWidth,\n        justifyContent: 'center',\n      };\n    case 'auto':\n    case 'auto-start':\n    case 'auto-end':\n    default:\n      return {\n        maxWidth,\n      };\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Placement as PopperPlacement } from '@popperjs/core';\nimport React, { useEffect, useMemo, memo, RefObject, useState } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport {\n  computeTableMaxHeight,\n  TooltipDivider,\n  TooltipFooter,\n  TooltipHeader,\n  TooltipTable,\n  TooltipWrapper,\n} from './components';\nimport { TooltipProvider } from './components/tooltip_provider';\nimport { TooltipTableColumn } from './components/types';\nimport { getStylesFromPlacement } from './placement';\nimport {\n  PinTooltipCallback,\n  SetSelectedTooltipItemsCallback,\n  ToggleSelectedTooltipItemCallback,\n  TooltipInfo,\n} from './types';\nimport { Colors } from '../../common/colors';\nimport { SeriesIdentifier } from '../../common/series_id';\nimport { BaseDatum, DEFAULT_TOOLTIP_SPEC, TooltipProps, TooltipSpec, TooltipValue } from '../../specs';\nimport { onPointerMove as onPointerMoveAction } from '../../state/actions/mouse';\nimport {\n  toggleSelectedTooltipItem as toggleSelectedTooltipItemAction,\n  setSelectedTooltipItems as setSelectedTooltipItemsAction,\n  pinTooltip as pinTooltipAction,\n} from '../../state/actions/tooltip';\nimport { BackwardRef, GlobalChartState } from '../../state/chart_state';\nimport { isPinnableTooltip } from '../../state/selectors/can_pin_tooltip';\nimport { getChartRotationSelector } from '../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { getInternalIsTooltipVisibleSelector } from '../../state/selectors/get_internal_is_tooltip_visible';\nimport { getInternalTooltipAnchorPositionSelector } from '../../state/selectors/get_internal_tooltip_anchor_position';\nimport { getInternalTooltipInfoSelector } from '../../state/selectors/get_internal_tooltip_info';\nimport { getTooltipSelectedItems } from '../../state/selectors/get_tooltip_selected_items';\nimport { getTooltipSettings } from '../../state/selectors/get_tooltip_settings';\nimport { getTooltipSpecSelector } from '../../state/selectors/get_tooltip_spec';\nimport { isBrushingSelector } from '../../state/selectors/is_brushing';\nimport { Datum, hasMostlyRTLItems, isDefined, Rotation } from '../../utils/common';\nimport { LIGHT_THEME } from '../../utils/themes/light_theme';\nimport { TooltipStyle } from '../../utils/themes/theme';\nimport { AnchorPosition, Placement, TooltipPortal, TooltipPortalSettings } from '../portal';\n\ninterface TooltipDispatchProps {\n  onPointerMove: typeof onPointerMoveAction;\n  toggleSelectedTooltipItem: ToggleSelectedTooltipItemCallback;\n  setSelectedTooltipItems: SetSelectedTooltipItemsCallback;\n  pinTooltip: PinTooltipCallback;\n}\n\ninterface TooltipStateProps<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> {\n  tooltip: TooltipSpec<D, SI>;\n  zIndex: number;\n  visible: boolean;\n  isExternal: boolean;\n  position: AnchorPosition | null;\n  info?: TooltipInfo<D, SI>;\n  settings?: TooltipProps<D, SI>;\n  rotation: Rotation;\n  chartId: string;\n  canPinTooltip: boolean;\n  backgroundColor: string;\n  pinned: boolean;\n  selected: TooltipValue<D, SI>[];\n  tooltipTheme: TooltipStyle;\n  isBrushing: boolean;\n}\n\ninterface TooltipOwnProps {\n  getChartContainerRef: BackwardRef;\n  anchorRef?: RefObject<HTMLDivElement>;\n}\n\n/** @internal */\nexport type TooltipComponentProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = TooltipDispatchProps & TooltipStateProps<D, SI> & TooltipOwnProps;\n\n/** @internal */\nexport const TooltipComponent = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  tooltip: {\n    header: TooltipCustomHeader,\n    body: TooltipCustomBody,\n    footer: TooltipCustomFooter,\n    actions,\n    headerFormatter,\n    actionPrompt,\n    pinningPrompt,\n    selectionPrompt,\n    actionsLoading,\n    noActionsLoaded,\n    maxVisibleTooltipItems,\n  },\n  anchorRef,\n  info,\n  zIndex,\n  position,\n  getChartContainerRef,\n  settings,\n  tooltipTheme,\n  visible,\n  rotation,\n  chartId,\n  onPointerMove,\n  backgroundColor,\n  pinned,\n  selected,\n  toggleSelectedTooltipItem,\n  setSelectedTooltipItems,\n  pinTooltip,\n  canPinTooltip,\n  isBrushing,\n}: TooltipComponentProps<D, SI>) => {\n  const [computedPlacement, setComputedPlacement] = useState<PopperPlacement | undefined>(settings?.placement);\n  const chartRef = getChartContainerRef();\n\n  const handleScroll = (e: Event) => {\n    if (\n      e.target &&\n      e.target.hasOwnProperty('classList') &&\n      (e.target as Element).classList.contains('echTooltip__tableBody')\n    ) {\n      // catch scroll when scrolling on tableBody\n      e.stopImmediatePropagation();\n      return;\n    }\n    // TODO: handle scroll cursor update\n    onPointerMove({ x: -1, y: -1 }, Date.now());\n  };\n\n  useEffect(() => {\n    window.addEventListener('scroll', handleScroll, true);\n    return () => window.removeEventListener('scroll', handleScroll, true);\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  const popperSettings = useMemo((): TooltipPortalSettings | undefined => {\n    if (!settings || typeof settings === 'string') {\n      return;\n    }\n\n    const { placement, fallbackPlacements, boundary, ...rest } = settings;\n\n    return {\n      ...rest,\n      placement: placement ?? (rotation === 0 || rotation === 180 ? Placement.Right : Placement.Top),\n      fallbackPlacements:\n        fallbackPlacements ??\n        (rotation === 0 || rotation === 180\n          ? [Placement.Right, Placement.Left, Placement.Top, Placement.Bottom]\n          : [Placement.Top, Placement.Bottom, Placement.Right, Placement.Left]),\n      boundary: boundary === 'chart' ? chartRef.current ?? undefined : boundary,\n    };\n  }, [settings, chartRef, rotation]);\n\n  if (!visible || isBrushing) {\n    return null;\n  }\n\n  const isMostlyRTL = hasMostlyRTLItems(info?.values?.map?.(({ label }) => label) ?? []);\n  const textDirectionality = isMostlyRTL ? 'rtl' : 'ltr';\n\n  const columns: TooltipTableColumn<D, SI>[] = [\n    {\n      id: 'color',\n      type: 'color',\n    },\n    {\n      id: 'label',\n      type: 'custom',\n      truncate: true,\n      cell: ({ label }) => (\n        <span className=\"echTooltip__label\" title={label}>\n          {label}\n        </span>\n      ),\n      hidden: (items) => items.every(({ label }) => !label),\n      style: {\n        textAlign: 'left',\n      },\n    },\n    {\n      id: 'value',\n      type: 'custom',\n      cell: ({ formattedValue }) => (\n        <span className=\"echTooltip__value\" dir=\"ltr\">\n          {formattedValue}\n        </span>\n      ),\n      // truncation is fine for values  due to the grid configuration: label-value  as auto-auto.\n      // The value will be truncated at 50% of the max tooltip width (at ~125px) only if both exceed the 50% of the available space.\n      // It got a plenty of space to render correctly any number even with no formatting\n      truncate: true,\n      style: {\n        textAlign: 'right',\n      },\n    },\n    {\n      id: 'markValue',\n      type: 'custom',\n      style: {\n        paddingLeft: 0,\n      },\n      hidden: (items) => items.every(({ markValue }) => !markValue),\n      cell: ({ markValue, formattedMarkValue }) =>\n        isDefined(markValue) ? <span className=\"echTooltip__markValue\">&nbsp;({formattedMarkValue})</span> : null,\n    },\n  ];\n\n  // don't show the tooltip if hidden or no TooltipInfo are available\n  if (!info || !visible) {\n    return null;\n  }\n\n  const hideActions = (info?.disableActions ?? false) || info?.values.every((v) => v.displayOnly);\n  const actionable = actions.length > 0 || !Array.isArray(actions);\n  // divider visibility\n  const hasHeader = TooltipCustomHeader !== 'none' && info.header;\n  const hasBody = TooltipCustomBody !== 'none' && info.values.length > 0;\n  // footer is empty by default, so default and none are the same at the moment\n  const hasFooter = TooltipCustomFooter !== 'default' && TooltipCustomFooter !== 'none';\n  const headerBottomDividerVisibility = hasHeader && (hasBody || hasFooter);\n  const bodyBottomDividerVisibility = hasBody && hasFooter;\n\n  return (\n    <TooltipPortal\n      scope=\"MainTooltip\"\n      // increasing by 100 the tooltip portal zIndex to avoid conflicts with highlighters and other elements in the DOM\n      zIndex={zIndex + 100}\n      anchor={anchorRef ?? { position, appendRef: chartRef }}\n      settings={popperSettings}\n      chartId={chartId}\n      visible={visible}\n      onPlacementChange={setComputedPlacement}\n    >\n      <TooltipProvider\n        backgroundColor={backgroundColor}\n        dir={textDirectionality}\n        pinned={pinned}\n        actionable={actionable}\n        canPinTooltip={canPinTooltip}\n        selected={selected}\n        setSelection={setSelectedTooltipItems}\n        toggleSelected={toggleSelectedTooltipItem}\n        values={info?.values ?? []}\n        pinTooltip={pinTooltip}\n        theme={tooltipTheme}\n        maxItems={maxVisibleTooltipItems}\n      >\n        <div\n          className=\"echTooltip__outerWrapper\"\n          style={getStylesFromPlacement(actionable, tooltipTheme, computedPlacement)}\n        >\n          {settings?.customTooltip ? (\n            <settings.customTooltip\n              {...info}\n              dir={textDirectionality}\n              pinned={pinned}\n              selected={selected}\n              setSelection={setSelectedTooltipItems}\n              toggleSelected={toggleSelectedTooltipItem}\n              headerFormatter={headerFormatter}\n              backgroundColor={backgroundColor}\n            />\n          ) : (\n            <TooltipWrapper\n              actions={hideActions || !canPinTooltip ? [] : actions}\n              actionPrompt={actionPrompt}\n              pinningPrompt={pinningPrompt}\n              selectionPrompt={selectionPrompt}\n              actionsLoading={actionsLoading}\n              noActionsLoaded={noActionsLoaded}\n            >\n              {TooltipCustomHeader === 'none' ? null : TooltipCustomHeader === 'default' ? (\n                <TooltipHeader header={info.header} formatter={headerFormatter} />\n              ) : (\n                <TooltipHeader>\n                  <TooltipCustomHeader items={info.values} header={info.header} />\n                </TooltipHeader>\n              )}\n\n              {headerBottomDividerVisibility && <TooltipDivider />}\n\n              {TooltipCustomBody === 'none' ? null : TooltipCustomBody === 'default' ? (\n                <TooltipTable\n                  columns={columns}\n                  items={info.values}\n                  pinned={pinned}\n                  onSelect={toggleSelectedTooltipItem}\n                  selected={selected}\n                  maxHeight={computeTableMaxHeight(\n                    pinned,\n                    columns,\n                    tooltipTheme.maxTableHeight,\n                    maxVisibleTooltipItems,\n                  )}\n                />\n              ) : (\n                <TooltipCustomBody items={info.values} header={info.header} />\n              )}\n\n              {bodyBottomDividerVisibility && <TooltipDivider />}\n\n              {TooltipCustomFooter === 'default' || TooltipCustomFooter === 'none' ? null : (\n                <TooltipFooter>\n                  <TooltipCustomFooter items={info.values} header={info.header} />\n                </TooltipFooter>\n              )}\n            </TooltipWrapper>\n          )}\n        </div>\n      </TooltipProvider>\n    </TooltipPortal>\n  );\n};\n\nTooltipComponent.displayName = 'Tooltip';\n\nconst HIDDEN_TOOLTIP_PROPS: TooltipStateProps = {\n  tooltip: DEFAULT_TOOLTIP_SPEC,\n  zIndex: 0,\n  visible: false,\n  isExternal: false,\n  info: undefined,\n  position: null,\n  settings: {},\n  rotation: 0 as Rotation,\n  chartId: '',\n  canPinTooltip: false,\n  backgroundColor: Colors.Transparent.keyword,\n  pinned: false,\n  selected: [],\n  tooltipTheme: LIGHT_THEME.tooltip,\n  isBrushing: false,\n};\n\nconst mapDispatchToProps = (dispatch: Dispatch): TooltipDispatchProps =>\n  bindActionCreators(\n    {\n      onPointerMove: onPointerMoveAction,\n      toggleSelectedTooltipItem: toggleSelectedTooltipItemAction,\n      setSelectedTooltipItems: setSelectedTooltipItemsAction,\n      pinTooltip: pinTooltipAction,\n    },\n    dispatch,\n  );\n\ntype BasicTooltipProps = Omit<\n  TooltipStateProps,\n  'visible' | 'position' | 'info' | 'pinned' | 'selected' | 'canPinTooltip'\n>;\nconst mapStateToPropsBasic = (state: GlobalChartState): BasicTooltipProps => {\n  const tooltip = getTooltipSpecSelector(state);\n  const {\n    background: { color: backgroundColor },\n    tooltip: tooltipTheme,\n  } = getChartThemeSelector(state);\n  const { isExternal } = getInternalIsTooltipVisibleSelector(state);\n  return getInternalIsInitializedSelector(state) !== InitStatus.Initialized\n    ? HIDDEN_TOOLTIP_PROPS\n    : {\n        tooltip,\n        isExternal,\n        isBrushing: false,\n        zIndex: state.zIndex,\n        settings: getTooltipSettings(state),\n        tooltipTheme,\n        rotation: getChartRotationSelector(state),\n        chartId: state.chartId,\n        backgroundColor,\n      };\n};\n\nconst mapStateToProps = (state: GlobalChartState): TooltipStateProps =>\n  getInternalIsInitializedSelector(state) !== InitStatus.Initialized\n    ? HIDDEN_TOOLTIP_PROPS\n    : {\n        ...mapStateToPropsBasic(state),\n        visible: getInternalIsTooltipVisibleSelector(state).visible,\n        position: getInternalTooltipAnchorPositionSelector(state),\n        info: getInternalTooltipInfoSelector(state),\n        pinned: state.interactions.tooltip.pinned,\n        selected: getTooltipSelectedItems(state),\n        canPinTooltip: isPinnableTooltip(state),\n        isBrushing: isBrushingSelector(state),\n      };\n\n/** @internal */\nexport const Tooltip = memo(connect(mapStateToProps, mapDispatchToProps)(TooltipComponent));\n\n/** @internal */\nexport const BasicTooltip = memo(connect(mapStateToPropsBasic)(TooltipComponent));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentType, ReactNode } from 'react';\n\nimport { SeriesIdentifier } from '../../common/series_id';\nimport { BaseDatum, TooltipValue, TooltipValueFormatter } from '../../specs';\nimport { PointerValue } from '../../state/types';\nimport { Datum } from '../../utils/common';\n\n/**\n * The set of info used to render the a tooltip.\n * @public\n */\nexport interface TooltipInfo<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> {\n  /**\n   * The TooltipValue for the header. On XYAxis chart the x value\n   */\n  header: PointerValue<D> | null;\n  /**\n   * The array of {@link TooltipValue}s to show on the tooltip.\n   * On XYAxis chart correspond to the set of y values for each series\n   */\n  values: TooltipValue<D, SI>[];\n  /**\n   * Internal flag to disable tooltip actions. Needed for heatmap to hide actions.\n   *\n   * TODO: replace this flag with better internal tooltip info structures\n   * @internal\n   */\n  disableActions?: boolean;\n}\n\n/**\n * The set of info used to render the a tooltip.\n * @public\n */\nexport interface CustomTooltipProps<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends TooltipInfo<D, SI> {\n  headerFormatter?: TooltipValueFormatter<D, SI>;\n  dir: 'ltr' | 'rtl';\n\n  /**\n   * Background color for use with contrast ratios\n   */\n  backgroundColor: string;\n\n  /**\n   * Tooltip is pinned\n   */\n  pinned: boolean;\n\n  /**\n   * Selected items - For use with actions\n   *\n   *\n   * TODO: permit other values than TooltipValue types\n   */\n  selected: TooltipValue<D, SI>[];\n\n  /**\n   * Toggles selected items - For use with actions\n   *\n   *\n   * TODO: permit other values than TooltipValue types\n   */\n  toggleSelected: (item: TooltipValue<D, SI>) => void;\n\n  /**\n   * Allows setting the selected items - For use with actions\n   *\n   * TODO: permit other values than TooltipValue types\n   */\n  setSelection: (items: TooltipValue<D, SI>[]) => void;\n}\n\n/**\n * The react component used to render a custom tooltip\n * @public\n */\nexport type CustomTooltip<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = ComponentType<\n  CustomTooltipProps<D, SI>\n>;\n\n/**\n * Defines exported component props with union of props **with** `children`\n * @public\n */\nexport type PropsWithChildren<\n  ChildrenProps extends Record<string, unknown> = Record<string, any>,\n  ExtraProps extends Record<string, unknown> = Record<string, any>,\n  Props extends Record<string, unknown> = Record<string, any>,\n> = {\n  children: ReactNode;\n} & ChildrenProps &\n  ExtraProps &\n  Neverify<Props>;\n\n/**\n * Defines exported component props with union of props **without** `children`\n * @public\n */\nexport type PropsWithoutChildren<\n  Props extends Record<string, unknown> = Record<string, any>,\n  ExtraProps extends Record<string, unknown> = Record<string, any>,\n  ChildrenProps extends Record<string, unknown> = Record<string, any>,\n> = {\n  children?: never | undefined;\n} & Neverify<ChildrenProps> &\n  Props &\n  ExtraProps;\n\n/**\n * Type used to define a union including and excluding children as a prop\n * @public\n */\nexport type PropsOrChildrenWithProps<\n  Props extends Record<string, unknown> = Record<string, any>,\n  ChildrenProps extends Record<string, unknown> = Record<string, any>,\n  ExtraProps extends Record<string, unknown> = Record<string, any>,\n> = PropsWithChildren<ChildrenProps, ExtraProps, Props> | PropsWithoutChildren<Props, ExtraProps, ChildrenProps>;\n\n/**\n * Converts all properties of a Record to optional-never\n * @public\n */\nexport type Neverify<T extends Record<string, unknown>> = {\n  [Key in keyof T]?: never;\n};\n\n/** @public */\nexport type ToggleSelectedTooltipItemCallback = (item: TooltipValue<any, SeriesIdentifier>) => any;\n/** @public */\nexport type SetSelectedTooltipItemsCallback = (items: TooltipValue<any, SeriesIdentifier>[]) => any;\n/** @public */\nexport type PinTooltipCallback = (pinned: boolean, resetPointer?: boolean) => any;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { line, area } from 'd3-shape';\n\nimport { CurveType, getCurveFactory } from '../utils/curves';\n\ntype SVGPath = string;\n\ntype LineGenerator<D> = (data: D[]) => SVGPath;\n\n/** @internal */\nexport function lineGenerator<D>(\n  xProject: (x: D) => number,\n  yProject: (y: D) => number,\n  defined: (d: D) => boolean,\n  curve: CurveType,\n): LineGenerator<D> {\n  const generator = line<D>().x(xProject).y(yProject).defined(defined).curve(getCurveFactory(curve));\n  return (d) => generator(d) ?? '';\n}\n\ntype AreaGenerator<D> = {\n  y0: (data: D[]) => SVGPath;\n  y1: (data: D[]) => SVGPath;\n  area: (data: D[]) => SVGPath;\n};\n\n/** @internal */\nexport function areaGenerator<D>(\n  xProject: (x: D) => number,\n  y0Project: (y: D) => number,\n  y1Project: (y: D) => number,\n  defined: (d: D) => boolean,\n  curve: CurveType,\n): AreaGenerator<D> {\n  const generator = area<D>().x(xProject).y0(y0Project).y1(y1Project).defined(defined).curve(getCurveFactory(curve));\n  return {\n    y0: (d) => generator.lineY0()(d) ?? '',\n    y1: (d) => generator.lineY1()(d) ?? '',\n    area: (d) => generator(d) ?? '',\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './components';\nexport { ChartType } from './chart_types';\nexport { ChartSize, ChartSizeArray, ChartSizeObject } from './utils/chart_size';\n\nexport { SpecId, GroupId, AxisId, AnnotationId } from './utils/ids';\n\n// Everything related to the specs types and react-components\nexport * from './specs';\nexport {\n  DebugState,\n  DebugStateLine,\n  DebugStateValue,\n  DebugStateAnnotations,\n  DebugStateArea,\n  DebugStateAxes,\n  DebugStateBar,\n  DebugStateLegend,\n  DebugStateLineConfig,\n  DebugStateAxis,\n  DebugStateBase,\n  DebugStateLegendItem,\n  PointerValue,\n} from './state/types';\nexport { toEntries } from './utils/common';\nexport { CurveType } from './utils/curves';\nexport { ContinuousDomain, OrdinalDomain, GenericDomain, Range } from './utils/domain';\nexport { Dimensions, SimplePadding, Padding, PerSideDistance, Margins } from './utils/dimensions';\nexport { timeFormatter, niceTimeFormatter, niceTimeFormatByDay } from './utils/data/formatters';\nexport { SeriesCompareFn } from './utils/series_sort';\nexport { SeriesIdentifier, SeriesKey } from './common/series_id';\nexport { XYChartSeriesIdentifier, DataSeriesDatum, FilledValues } from './chart_types/xy_chart/utils/series';\nexport {\n  AnnotationTooltipFormatter,\n  CustomAnnotationTooltip,\n  ComponentWithAnnotationDatum,\n} from './chart_types/xy_chart/annotations/types';\nexport { GeometryValue, BandedAccessorType } from './utils/geometry';\nexport { LegendPath, LegendPathElement } from './state/actions/legend';\nexport { CategoryKey, CategoryLabel } from './common/category';\nexport { Layer as PartitionLayer, PartitionProps } from './chart_types/partition_chart/specs/index';\nexport { FillLabelConfig as PartitionFillLabel, PartitionStyle } from './utils/themes/partition';\nexport { PartitionLayout } from './chart_types/partition_chart/layout/types/config_types';\n\nexport {\n  Accessor,\n  AccessorFn,\n  IndexedAccessorFn,\n  UnaryAccessorFn,\n  AccessorObjectKey,\n  AccessorArrayIndex,\n} from './utils/accessor';\nexport * from './components/tooltip';\n\n// scales\nexport { ScaleType } from './scales/constants';\nexport { ScaleContinuousType, ScaleOrdinalType, ScaleBandType, LogScaleOptions } from './scales';\n\n// TODO move animation to its own package\nexport {\n  AnimationOptions,\n  AnimatedValue,\n  AnimationSpeed,\n} from './chart_types/xy_chart/renderer/canvas/animations/animation';\n\n// theme\nexport * from './utils/themes/theme';\nexport * from './utils/themes/theme_common';\nexport { LIGHT_THEME } from './utils/themes/light_theme';\nexport { DARK_THEME } from './utils/themes/dark_theme';\nexport { LIGHT_BASE_COLORS, DARK_BASE_COLORS } from './utils/themes/base_colors';\nexport { LEGACY_LIGHT_THEME } from './utils/themes/legacy_light_theme';\nexport { LEGACY_DARK_THEME } from './utils/themes/legacy_dark_theme';\n\n// wordcloud\nexport { WordcloudViewModel } from './chart_types/wordcloud/layout/types/viewmodel_types';\n\n// partition\nexport * from './chart_types/partition_chart/layout/types/viewmodel_types';\nexport * from './chart_types/partition_chart/layout/utils/group_by_rollup';\nexport { AnimKeyframe } from './chart_types/partition_chart/layout/types/config_types';\n\n// heatmap\nexport { Cell } from './chart_types/heatmap/layout/types/viewmodel_types';\nexport { HeatmapCellDatum } from './chart_types/heatmap/layout/viewmodel/viewmodel';\nexport {\n  ColorBand,\n  HeatmapBandsColorScale,\n  HeatmapProps,\n  HeatmapHighlightedData,\n} from './chart_types/heatmap/specs/heatmap';\n\n// utilities\nexport {\n  Datum,\n  Position,\n  Rendering,\n  Rotation,\n  VerticalAlignment,\n  HorizontalAlignment,\n  RecursivePartial,\n  NonAny,\n  IsAny,\n  IsUnknown,\n  ColorVariant,\n  LabelAccessor,\n  ShowAccessor,\n  ValueAccessor,\n  ValueFormatter,\n  LayoutDirection,\n} from './utils/common';\nexport { DataGenerator } from './utils/data_generators/data_generator';\nexport * from './utils/themes/merge_utils';\nexport * from './utils/use_legend_action';\nexport { MODEL_KEY, defaultPartitionValueFormatter } from './chart_types/partition_chart/layout/config';\nexport { LegendStrategy } from './chart_types/partition_chart/layout/utils/highlighted_geoms';\nexport { Pixels, Ratio, TimeMs } from './common/geometry';\nexport { AdditiveNumber } from './utils/accessor';\nexport { FontStyle, FONT_STYLES } from './common/text_utils';\nexport { Color } from './common/colors';\nexport { RGB, A, RgbaTuple } from './common/color_library_wrappers';\nexport { Predicate } from './common/predicate';\nexport { SmallMultiplesDatum } from './common/panel_utils';\n\nexport type {\n  ESCalendarInterval,\n  ESCalendarIntervalUnit,\n  ESFixedInterval,\n  ESFixedIntervalUnit,\n} from './utils/chrono/elasticsearch';\nexport type { UnixTimestamp } from './utils/chrono/types';\nexport { roundDateToESInterval } from './utils/chrono/elasticsearch';\n\n// data utils\nexport { GroupKeysOrKeyFn, GroupByKeyFn } from './chart_types/xy_chart/utils/group_data_series';\nexport { computeRatioByGroups } from './utils/data/data_processing';\nexport { TimeFunction } from './utils/time_functions';\nexport * from './chart_types/flame_chart/flame_api';\nexport * from './chart_types/timeslip/timeslip_api';\nexport { LegacyAnimationConfig } from './common/animation';\n\n// Bullet\nexport {\n  ColorBandValue,\n  ColorBandConfig,\n  ColorBandSimpleConfig,\n  ColorBandComplexConfig,\n  BulletColorConfig,\n} from './chart_types/bullet_graph/utils/color';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/**@internal */\nexport const productPriceNames = [\n  { products_price: 0.0, name: '0' },\n  { products_price: 50.0, name: '50' },\n  { products_price: 100.0, name: '100' },\n  { products_price: 150.0, name: '150' },\n  { products_price: 200.0, name: '200' },\n  { products_price: 350.0, name: '350' },\n  { products_price: 400.0, name: '400' },\n  { products_price: 1050.0, name: '1050' },\n];\n\n/** @internal */\nexport const productDimension = [\n  {\n    sitc1: '0',\n    name: 'Food and live animals',\n    nameAR: 'الغذاء والحيوانات الحية',\n    nameHE: 'מזון וחיות חיות',\n  },\n  {\n    sitc1: '1',\n    name: 'Beverages and tobacco',\n    nameAR: 'المشروبات والتبغ',\n    nameHE: 'משקאות וטבק',\n  },\n  {\n    sitc1: '2',\n    name: 'Crude materials, inedible, except fuels',\n    nameAR: 'المواد الخام غير الصالحة للأكل عدا المحروقات',\n    nameHE: 'חומרים גולמיים, בלתי אכילים, למעט דלקים',\n  },\n  {\n    sitc1: '3',\n    name: 'Mineral fuels, lubricants and related materials',\n    nameAR: 'الوقود المعدني وزيوت التشحيم والمواد ذات الصلة',\n    nameHE: 'דלקים מינרליים, חומרי סיכה וחומרים נלווים',\n  },\n  {\n    sitc1: '4',\n    name: 'Animal and vegetable oils, fats and waxes',\n    nameAR: 'زيوت ودهون وشموع حيوانية ونباتية',\n    nameHE: 'שמנים, שומנים ושעווה מהחי וצומח',\n  },\n  {\n    sitc1: '5',\n    name: 'Chemicals and related products',\n    nameAR: 'الكيماويات والمنتجات ذات الصلة',\n    nameHE: 'כימיקלים ומוצרים נלווים',\n  },\n  {\n    sitc1: '6',\n    name: 'Manufactured goods classified chiefly by material',\n    nameAR: 'البضائع المصنعة مصنفة بشكل رئيسي حسب المادة',\n    nameHE: 'מוצרים מיוצרים המסווגים בעיקר לפי חומר',\n  },\n  {\n    sitc1: '7',\n    name: 'Machinery and transport equipment',\n    nameAR: 'الالات ومعدات النقل',\n    nameHE: 'מכונות וציוד הובלה',\n  },\n  {\n    sitc1: '8',\n    name: 'Miscellaneous manufactured articles',\n    nameAR: 'المواد المصنعة المتنوعة',\n    nameHE: 'מוצרים מיוצרים שונים',\n  },\n  {\n    sitc1: '9',\n    name: 'Commodities and transactions not classified elsewhere',\n    nameAR: 'السلع والمعاملات غير المصنفة في مكان آخر',\n    nameHE: 'סחורות ועסקאות שאינן מסווגות במקום אחר',\n  },\n];\n\n/** @internal */\nexport const regionDimension = [\n  { region: 'af', regionName: 'Africa' },\n  { region: 'as', regionName: 'Asia' },\n  { region: 'eu', regionName: 'Europe' },\n  { region: 'na', regionName: 'North America' },\n  { region: 'sa', regionName: 'South America' },\n  { region: 'oc', regionName: 'Oceania' },\n];\n\n/** @internal */\nexport const countryDimension = [\n  { continentCountry: 'afago', country: 'ago', name: 'Angola' },\n  { continentCountry: 'afbdi', country: 'bdi', name: 'Burundi' },\n  { continentCountry: 'afben', country: 'ben', name: 'Benin' },\n  { continentCountry: 'afbfa', country: 'bfa', name: 'Burkina Faso' },\n  { continentCountry: 'afbwa', country: 'bwa', name: 'Botswana' },\n  { continentCountry: 'afcaf', country: 'caf', name: 'Central African Republic' },\n  { continentCountry: 'afciv', country: 'civ', name: \"Cote d'Ivoire\" },\n  { continentCountry: 'afcmr', country: 'cmr', name: 'Cameroon' },\n  { continentCountry: 'afcod', country: 'cod', name: 'Democratic Republic of the Congo' },\n  { continentCountry: 'afcog', country: 'cog', name: 'Republic of the Congo' },\n  { continentCountry: 'afcom', country: 'com', name: 'Comoros' },\n  { continentCountry: 'afcpv', country: 'cpv', name: 'Cape Verde' },\n  { continentCountry: 'afdji', country: 'dji', name: 'Djibouti' },\n  { continentCountry: 'afdza', country: 'dza', name: 'Algeria' },\n  { continentCountry: 'afegy', country: 'egy', name: 'Egypt' },\n  { continentCountry: 'aferi', country: 'eri', name: 'Eritrea' },\n  { continentCountry: 'afesh', country: 'esh', name: 'Western Sahara' },\n  { continentCountry: 'afeth', country: 'eth', name: 'Ethiopia' },\n  { continentCountry: 'afgab', country: 'gab', name: 'Gabon' },\n  { continentCountry: 'afgha', country: 'gha', name: 'Ghana' },\n  { continentCountry: 'afgin', country: 'gin', name: 'Guinea' },\n  { continentCountry: 'afgmb', country: 'gmb', name: 'Gambia' },\n  { continentCountry: 'afgnb', country: 'gnb', name: 'Guinea-Bissau' },\n  { continentCountry: 'afgnq', country: 'gnq', name: 'Equatorial Guinea' },\n  { continentCountry: 'afken', country: 'ken', name: 'Kenya' },\n  { continentCountry: 'aflbr', country: 'lbr', name: 'Liberia' },\n  { continentCountry: 'aflby', country: 'lby', name: 'Libya' },\n  { continentCountry: 'aflso', country: 'lso', name: 'Lesotho' },\n  { continentCountry: 'afmar', country: 'mar', name: 'Morocco' },\n  { continentCountry: 'afmdg', country: 'mdg', name: 'Madagascar' },\n  { continentCountry: 'afmli', country: 'mli', name: 'Mali' },\n  { continentCountry: 'afmoz', country: 'moz', name: 'Mozambique' },\n  { continentCountry: 'afmrt', country: 'mrt', name: 'Mauritania' },\n  { continentCountry: 'afmus', country: 'mus', name: 'Mauritius' },\n  { continentCountry: 'afmwi', country: 'mwi', name: 'Malawi' },\n  { continentCountry: 'afmyt', country: 'myt', name: 'Mayotte' },\n  { continentCountry: 'afnam', country: 'nam', name: 'Namibia' },\n  { continentCountry: 'afner', country: 'ner', name: 'Niger' },\n  { continentCountry: 'afnga', country: 'nga', name: 'Nigeria' },\n  { continentCountry: 'afreu', country: 'reu', name: 'Reunion' },\n  { continentCountry: 'afrwa', country: 'rwa', name: 'Rwanda' },\n  { continentCountry: 'afsdn', country: 'sdn', name: 'Sudan' },\n  { continentCountry: 'afsen', country: 'sen', name: 'Senegal' },\n  { continentCountry: 'afshn', country: 'shn', name: 'Saint Helena' },\n  { continentCountry: 'afsle', country: 'sle', name: 'Sierra Leone' },\n  { continentCountry: 'afsom', country: 'som', name: 'Somalia' },\n  { continentCountry: 'afssd', country: 'ssd', name: 'South Sudan' },\n  { continentCountry: 'afstp', country: 'stp', name: 'Sao Tome and Principe' },\n  { continentCountry: 'afswz', country: 'swz', name: 'Swaziland' },\n  { continentCountry: 'afsyc', country: 'syc', name: 'Seychelles' },\n  { continentCountry: 'aftcd', country: 'tcd', name: 'Chad' },\n  { continentCountry: 'aftgo', country: 'tgo', name: 'Togo' },\n  { continentCountry: 'aftun', country: 'tun', name: 'Tunisia' },\n  { continentCountry: 'aftza', country: 'tza', name: 'Tanzania' },\n  { continentCountry: 'afuga', country: 'uga', name: 'Uganda' },\n  { continentCountry: 'afzaf', country: 'zaf', name: 'South Africa' },\n  { continentCountry: 'afzmb', country: 'zmb', name: 'Zambia' },\n  { continentCountry: 'afzwe', country: 'zwe', name: 'Zimbabwe' },\n  { continentCountry: 'anata', country: 'ata', name: 'Antarctica' },\n  { continentCountry: 'anatf', country: 'atf', name: 'French South Antarctic Territory' },\n  { continentCountry: 'anbvt', country: 'bvt', name: 'Bouvet Island' },\n  { continentCountry: 'anhmd', country: 'hmd', name: 'Heard Island and McDonald Islands' },\n  { continentCountry: 'ansgs', country: 'sgs', name: 'South Georgia South Sandwich Islands' },\n  { continentCountry: 'asafg', country: 'afg', name: 'Afghanistan' },\n  { continentCountry: 'asare', country: 'are', name: 'United Arab Emirates' },\n  { continentCountry: 'asarm', country: 'arm', name: 'Armenia' },\n  { continentCountry: 'asaze', country: 'aze', name: 'Azerbaijan' },\n  { continentCountry: 'asbgd', country: 'bgd', name: 'Bangladesh' },\n  { continentCountry: 'asbhr', country: 'bhr', name: 'Bahrain' },\n  { continentCountry: 'asbrn', country: 'brn', name: 'Brunei' },\n  { continentCountry: 'asbtn', country: 'btn', name: 'Bhutan' },\n  { continentCountry: 'ascck', country: 'cck', name: 'Cocos (Keeling) Islands' },\n  { continentCountry: 'aschn', country: 'chn', name: 'China' },\n  { continentCountry: 'ascxr', country: 'cxr', name: 'Christmas Island' },\n  { continentCountry: 'ascyp', country: 'cyp', name: 'Cyprus' },\n  { continentCountry: 'asgeo', country: 'geo', name: 'Georgia' },\n  { continentCountry: 'ashkg', country: 'hkg', name: 'Hong Kong' },\n  { continentCountry: 'asidn', country: 'idn', name: 'Indonesia' },\n  { continentCountry: 'asind', country: 'ind', name: 'India' },\n  { continentCountry: 'asiot', country: 'iot', name: 'British Indian Ocean Territory' },\n  { continentCountry: 'asirn', country: 'irn', name: 'Iran' },\n  { continentCountry: 'asirq', country: 'irq', name: 'Iraq' },\n  { continentCountry: 'asisr', country: 'isr', name: 'Israel' },\n  { continentCountry: 'asjor', country: 'jor', name: 'Jordan' },\n  { continentCountry: 'asjpn', country: 'jpn', name: 'Japan' },\n  { continentCountry: 'askaz', country: 'kaz', name: 'Kazakhstan' },\n  { continentCountry: 'askgz', country: 'kgz', name: 'Kyrgyzstan' },\n  { continentCountry: 'askhm', country: 'khm', name: 'Cambodia' },\n  { continentCountry: 'askor', country: 'kor', name: 'South Korea' },\n  { continentCountry: 'askwt', country: 'kwt', name: 'Kuwait' },\n  { continentCountry: 'aslao', country: 'lao', name: 'Laos' },\n  { continentCountry: 'aslbn', country: 'lbn', name: 'Lebanon' },\n  { continentCountry: 'aslka', country: 'lka', name: 'Sri Lanka' },\n  { continentCountry: 'asmac', country: 'mac', name: 'Macau' },\n  { continentCountry: 'asmdv', country: 'mdv', name: 'Maldives' },\n  { continentCountry: 'asmid', country: 'mid', name: 'Midway' },\n  { continentCountry: 'asmmr', country: 'mmr', name: 'Burma' },\n  { continentCountry: 'asmng', country: 'mng', name: 'Mongolia' },\n  { continentCountry: 'asmys', country: 'mys', name: 'Malaysia' },\n  { continentCountry: 'asnpl', country: 'npl', name: 'Nepal' },\n  { continentCountry: 'asomn', country: 'omn', name: 'Oman' },\n  { continentCountry: 'aspak', country: 'pak', name: 'Pakistan' },\n  { continentCountry: 'asphl', country: 'phl', name: 'Philippines' },\n  { continentCountry: 'asprk', country: 'prk', name: 'North Korea' },\n  { continentCountry: 'aspse', country: 'pse', name: 'Palestine' },\n  { continentCountry: 'asqat', country: 'qat', name: 'Qatar' },\n  { continentCountry: 'assau', country: 'sau', name: 'Saudi Arabia' },\n  { continentCountry: 'assgp', country: 'sgp', name: 'Singapore' },\n  { continentCountry: 'assyr', country: 'syr', name: 'Syria' },\n  { continentCountry: 'astha', country: 'tha', name: 'Thailand' },\n  { continentCountry: 'astjk', country: 'tjk', name: 'Tajikistan' },\n  { continentCountry: 'astkm', country: 'tkm', name: 'Turkmenistan' },\n  { continentCountry: 'astls', country: 'tls', name: 'Timor-Leste' },\n  { continentCountry: 'astur', country: 'tur', name: 'Turkey' },\n  { continentCountry: 'astwn', country: 'twn', name: 'Taiwan' },\n  { continentCountry: 'asuzb', country: 'uzb', name: 'Uzbekistan' },\n  { continentCountry: 'asvnm', country: 'vnm', name: 'Vietnam' },\n  { continentCountry: 'asyar', country: 'yar', name: 'Yemen Arab Republic' },\n  { continentCountry: 'asyem', country: 'yem', name: 'Yemen' },\n  { continentCountry: 'asymd', country: 'ymd', name: 'Democratic Yemen' },\n  { continentCountry: 'eualb', country: 'alb', name: 'Albania' },\n  { continentCountry: 'euand', country: 'and', name: 'Andorra' },\n  { continentCountry: 'euaut', country: 'aut', name: 'Austria' },\n  { continentCountry: 'eubel', country: 'bel', name: 'Belgium' },\n  { continentCountry: 'eubgr', country: 'bgr', name: 'Bulgaria' },\n  { continentCountry: 'eubih', country: 'bih', name: 'Bosnia and Herzegovina' },\n  { continentCountry: 'eublr', country: 'blr', name: 'Belarus' },\n  { continentCountry: 'eublx', country: 'blx', name: 'Belgium-Luxembourg' },\n  { continentCountry: 'euche', country: 'che', name: 'Switzerland' },\n  { continentCountry: 'euchi', country: 'chi', name: 'Channel Islands' },\n  { continentCountry: 'eucsk', country: 'csk', name: 'Czechoslovakia' },\n  { continentCountry: 'eucze', country: 'cze', name: 'Czech Republic' },\n  { continentCountry: 'euddr', country: 'ddr', name: 'Democratic Republic of Germany' },\n  { continentCountry: 'eudeu', country: 'deu', name: 'Germany' },\n  { continentCountry: 'eudnk', country: 'dnk', name: 'Denmark' },\n  { continentCountry: 'euesp', country: 'esp', name: 'Spain' },\n  { continentCountry: 'euest', country: 'est', name: 'Estonia' },\n  { continentCountry: 'eufdr', country: 'fdr', name: 'Federal Republic of Germany' },\n  { continentCountry: 'eufin', country: 'fin', name: 'Finland' },\n  { continentCountry: 'eufra', country: 'fra', name: 'France' },\n  { continentCountry: 'eufro', country: 'fro', name: 'Faroe Islands' },\n  { continentCountry: 'eugbr', country: 'gbr', name: 'United Kingdom' },\n  { continentCountry: 'eugib', country: 'gib', name: 'Gibraltar' },\n  { continentCountry: 'eugrc', country: 'grc', name: 'Greece' },\n  { continentCountry: 'euhrv', country: 'hrv', name: 'Croatia' },\n  { continentCountry: 'euhun', country: 'hun', name: 'Hungary' },\n  { continentCountry: 'euimn', country: 'imn', name: 'Isle of Man' },\n  { continentCountry: 'euirl', country: 'irl', name: 'Ireland' },\n  { continentCountry: 'euisl', country: 'isl', name: 'Iceland' },\n  { continentCountry: 'euita', country: 'ita', name: 'Italy' },\n  { continentCountry: 'euksv', country: 'ksv', name: 'Kosovo' },\n  { continentCountry: 'eulie', country: 'lie', name: 'Liechtenstein' },\n  { continentCountry: 'eultu', country: 'ltu', name: 'Lithuania' },\n  { continentCountry: 'eulux', country: 'lux', name: 'Luxembourg' },\n  { continentCountry: 'eulva', country: 'lva', name: 'Latvia' },\n  { continentCountry: 'eumco', country: 'mco', name: 'Monaco' },\n  { continentCountry: 'eumda', country: 'mda', name: 'Moldova' },\n  { continentCountry: 'eumkd', country: 'mkd', name: 'Macedonia' },\n  { continentCountry: 'eumlt', country: 'mlt', name: 'Malta' },\n  { continentCountry: 'eumne', country: 'mne', name: 'Montenegro' },\n  { continentCountry: 'eunld', country: 'nld', name: 'Netherlands' },\n  { continentCountry: 'eunor', country: 'nor', name: 'Norway' },\n  { continentCountry: 'eupol', country: 'pol', name: 'Poland' },\n  { continentCountry: 'euprt', country: 'prt', name: 'Portugal' },\n  { continentCountry: 'eurou', country: 'rou', name: 'Romania' },\n  { continentCountry: 'eurus', country: 'rus', name: 'Russia' },\n  { continentCountry: 'euscg', country: 'scg', name: 'Serbia and Montenegro' },\n  { continentCountry: 'eusjm', country: 'sjm', name: 'Svalbard' },\n  { continentCountry: 'eusmr', country: 'smr', name: 'San Marino' },\n  { continentCountry: 'eusrb', country: 'srb', name: 'Serbia' },\n  { continentCountry: 'eusun', country: 'sun', name: 'USSR' },\n  { continentCountry: 'eusvk', country: 'svk', name: 'Slovakia' },\n  { continentCountry: 'eusvn', country: 'svn', name: 'Slovenia' },\n  { continentCountry: 'euswe', country: 'swe', name: 'Sweden' },\n  { continentCountry: 'euukr', country: 'ukr', name: 'Ukraine' },\n  { continentCountry: 'euvat', country: 'vat', name: 'Holy See (Vatican City)' },\n  { continentCountry: 'euyug', country: 'yug', name: 'Yugoslavia' },\n  { continentCountry: 'naabw', country: 'abw', name: 'Aruba' },\n  { continentCountry: 'naaia', country: 'aia', name: 'Anguilla' },\n  { continentCountry: 'naant', country: 'ant', name: 'Netherlands Antilles' },\n  { continentCountry: 'naatg', country: 'atg', name: 'Antigua and Barbuda' },\n  { continentCountry: 'nabes', country: 'bes', name: 'Bonaire' },\n  { continentCountry: 'nabhs', country: 'bhs', name: 'Bahamas' },\n  { continentCountry: 'nablm', country: 'blm', name: 'Saint Barth√©lemy' },\n  { continentCountry: 'nablz', country: 'blz', name: 'Belize' },\n  { continentCountry: 'nabmu', country: 'bmu', name: 'Bermuda' },\n  { continentCountry: 'nabrb', country: 'brb', name: 'Barbados' },\n  { continentCountry: 'nacan', country: 'can', name: 'Canada' },\n  { continentCountry: 'nacri', country: 'cri', name: 'Costa Rica' },\n  { continentCountry: 'nacub', country: 'cub', name: 'Cuba' },\n  { continentCountry: 'nacuw', country: 'cuw', name: 'Cura√ßao' },\n  { continentCountry: 'nacym', country: 'cym', name: 'Cayman Islands' },\n  { continentCountry: 'nadma', country: 'dma', name: 'Dominica' },\n  { continentCountry: 'nadom', country: 'dom', name: 'Dominican Republic' },\n  { continentCountry: 'nagrd', country: 'grd', name: 'Grenada' },\n  { continentCountry: 'nagrl', country: 'grl', name: 'Greenland' },\n  { continentCountry: 'nagtm', country: 'gtm', name: 'Guatemala' },\n  { continentCountry: 'nahnd', country: 'hnd', name: 'Honduras' },\n  { continentCountry: 'nahti', country: 'hti', name: 'Haiti' },\n  { continentCountry: 'najam', country: 'jam', name: 'Jamaica' },\n  { continentCountry: 'nakna', country: 'kna', name: 'Saint Kitts and Nevis' },\n  { continentCountry: 'nalca', country: 'lca', name: 'Saint Lucia' },\n  { continentCountry: 'namaf', country: 'maf', name: 'Saint Maarten' },\n  { continentCountry: 'namex', country: 'mex', name: 'Mexico' },\n  { continentCountry: 'namsr', country: 'msr', name: 'Montserrat' },\n  { continentCountry: 'namtq', country: 'mtq', name: 'Martinique' },\n  { continentCountry: 'nanaa', country: 'naa', name: 'Netherland Antilles and Aruba' },\n  { continentCountry: 'nanic', country: 'nic', name: 'Nicaragua' },\n  { continentCountry: 'napan', country: 'pan', name: 'Panama' },\n  { continentCountry: 'napci', country: 'pci', name: 'Pacific Island (US)' },\n  { continentCountry: 'napcz', country: 'pcz', name: 'Panama Canal Zone' },\n  { continentCountry: 'napri', country: 'pri', name: 'Puerto Rico' },\n  { continentCountry: 'naslv', country: 'slv', name: 'El Salvador' },\n  { continentCountry: 'naspm', country: 'spm', name: 'Saint Pierre and Miquelon' },\n  { continentCountry: 'natca', country: 'tca', name: 'Turks and Caicos Islands' },\n  { continentCountry: 'natto', country: 'tto', name: 'Trinidad and Tobago' },\n  { continentCountry: 'naumi', country: 'umi', name: 'United States Minor Outlying Islands' },\n  { continentCountry: 'nausa', country: 'usa', name: 'United States' },\n  { continentCountry: 'navct', country: 'vct', name: 'Saint Vincent and the Grenadines' },\n  { continentCountry: 'navgb', country: 'vgb', name: 'British Virgin Islands' },\n  { continentCountry: 'navir', country: 'vir', name: 'Virgin Islands' },\n  { continentCountry: 'ocasm', country: 'asm', name: 'American Samoa' },\n  { continentCountry: 'ocaus', country: 'aus', name: 'Australia' },\n  { continentCountry: 'occok', country: 'cok', name: 'Cook Islands' },\n  { continentCountry: 'ocfji', country: 'fji', name: 'Fiji' },\n  { continentCountry: 'ocfsm', country: 'fsm', name: 'Micronesia' },\n  { continentCountry: 'ocglp', country: 'glp', name: 'Guadeloupe' },\n  { continentCountry: 'ocgum', country: 'gum', name: 'Guam' },\n  { continentCountry: 'ockir', country: 'kir', name: 'Kiribati' },\n  { continentCountry: 'ocmhl', country: 'mhl', name: 'Marshall Islands' },\n  { continentCountry: 'ocmnp', country: 'mnp', name: 'Northern Mariana Islands' },\n  { continentCountry: 'ocncl', country: 'ncl', name: 'New Caledonia' },\n  { continentCountry: 'ocnfk', country: 'nfk', name: 'Norfolk Island' },\n  { continentCountry: 'ocniu', country: 'niu', name: 'Niue' },\n  { continentCountry: 'ocnru', country: 'nru', name: 'Nauru' },\n  { continentCountry: 'ocnzl', country: 'nzl', name: 'New Zealand' },\n  { continentCountry: 'ocpcn', country: 'pcn', name: 'Pitcairn Islands' },\n  { continentCountry: 'ocplw', country: 'plw', name: 'Palau' },\n  { continentCountry: 'ocpng', country: 'png', name: 'Papua New Guinea' },\n  { continentCountry: 'ocpyf', country: 'pyf', name: 'French Polynesia' },\n  { continentCountry: 'ocslb', country: 'slb', name: 'Solomon Islands' },\n  { continentCountry: 'octkl', country: 'tkl', name: 'Tokelau' },\n  { continentCountry: 'octon', country: 'ton', name: 'Tonga' },\n  { continentCountry: 'octuv', country: 'tuv', name: 'Tuvalu' },\n  { continentCountry: 'ocvut', country: 'vut', name: 'Vanuatu' },\n  { continentCountry: 'ocwlf', country: 'wlf', name: 'Wallis and Futuna' },\n  { continentCountry: 'ocwsm', country: 'wsm', name: 'Samoa' },\n  { continentCountry: 'saarg', country: 'arg', name: 'Argentina' },\n  { continentCountry: 'sabol', country: 'bol', name: 'Bolivia' },\n  { continentCountry: 'sabra', country: 'bra', name: 'Brazil' },\n  { continentCountry: 'sachl', country: 'chl', name: 'Chile' },\n  { continentCountry: 'sacol', country: 'col', name: 'Colombia' },\n  { continentCountry: 'saecu', country: 'ecu', name: 'Ecuador' },\n  { continentCountry: 'saflk', country: 'flk', name: 'Falkland Islands' },\n  { continentCountry: 'saguf', country: 'guf', name: 'French Guiana' },\n  { continentCountry: 'saguy', country: 'guy', name: 'Guyana' },\n  { continentCountry: 'saper', country: 'per', name: 'Peru' },\n  { continentCountry: 'sapry', country: 'pry', name: 'Paraguay' },\n  { continentCountry: 'sasur', country: 'sur', name: 'Suriname' },\n  { continentCountry: 'saury', country: 'ury', name: 'Uruguay' },\n  { continentCountry: 'saven', country: 'ven', name: 'Venezuela' },\n  { continentCountry: 'xxwld', country: 'wld', name: 'World' },\n  { continentCountry: 'xxxxh', country: 'xxa', name: 'Areas' },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { manyPieMock } from './many_pie';\nimport { miniSunburstMock } from './mini_sunburst';\nimport { observabilityTreeMock } from './observability_tree';\nimport { pieMock } from './pie';\nimport { sunburstMock } from './sunburst';\n\n/** @internal */\nexport const mocks = {\n  pie: pieMock,\n  sunburst: sunburstMock,\n  miniSunburst: miniSunburstMock,\n  manyPie: manyPieMock,\n  observabilityTree: observabilityTreeMock,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const manyPieMock = [\n  { origin: 'chn', exportVal: 1680027842644 },\n  { origin: 'usa', exportVal: 1102566931395 },\n  { origin: 'deu', exportVal: 1062556067025 },\n  { origin: 'jpn', exportVal: 682060607712 },\n  { origin: 'fra', exportVal: 486717519772 },\n  { origin: 'kor', exportVal: 429341500570 },\n  { origin: 'ita', exportVal: 388082452213 },\n  { origin: 'nld', exportVal: 374451602037 },\n  { origin: 'can', exportVal: 362046595060 },\n  { origin: 'rus', exportVal: 360435750136 },\n  { origin: 'gbr', exportVal: 347628222830 },\n  { origin: 'mex', exportVal: 279440490401 },\n  { origin: 'bel', exportVal: 276331475549 },\n  { origin: 'mys', exportVal: 221211941430 },\n  { origin: 'esp', exportVal: 220725696243 },\n  { origin: 'che', exportVal: 217916829452 },\n  { origin: 'ind', exportVal: 211138300089 },\n  { origin: 'sau', exportVal: 207321414541 },\n  { origin: 'sgp', exportVal: 206513400598 },\n  { origin: 'bra', exportVal: 201273933253 },\n  { origin: 'aus', exportVal: 193277122627 },\n  { origin: 'tha', exportVal: 186564165591 },\n  { origin: 'idn', exportVal: 158159867052 },\n  { origin: 'are', exportVal: 155039720778 },\n  { origin: 'irl', exportVal: 135561950237 },\n  { origin: 'swe', exportVal: 132241085429 },\n  { origin: 'pol', exportVal: 130310102801 },\n  { origin: 'aut', exportVal: 126493546692 },\n  { origin: 'nor', exportVal: 123085657181 },\n  { origin: 'cze', exportVal: 109138761423 },\n  { origin: 'tur', exportVal: 107919189508 },\n  { origin: 'zaf', exportVal: 86865327178 },\n  { origin: 'dnk', exportVal: 80952198584 },\n  { origin: 'hun', exportVal: 79687476997 },\n  { origin: 'irn', exportVal: 77200364074 },\n  { origin: 'hkg', exportVal: 73164278476 },\n  { origin: 'nga', exportVal: 71428776813 },\n  { origin: 'vnm', exportVal: 69896077996 },\n  { origin: 'arg', exportVal: 65108843884 },\n  { origin: 'phl', exportVal: 64380113683 },\n  { origin: 'chl', exportVal: 62968068992 },\n  { origin: 'fin', exportVal: 62202122673 },\n  { origin: 'qat', exportVal: 59326138499 },\n  { origin: 'ven', exportVal: 55500881984 },\n  { origin: 'kwt', exportVal: 55400630374 },\n  { origin: 'ukr', exportVal: 54278860343 },\n  { origin: 'svk', exportVal: 53482619716 },\n  { origin: 'dza', exportVal: 53192494262 },\n  { origin: 'isr', exportVal: 50265596760 },\n  { origin: 'lby', exportVal: 45235556598 },\n  { origin: 'ago', exportVal: 45010895723 },\n  { origin: 'irq', exportVal: 44615332292 },\n  { origin: 'rou', exportVal: 44508446100 },\n  { origin: 'prt', exportVal: 43367388493 },\n  { origin: 'kaz', exportVal: 42068475259 },\n  { origin: 'col', exportVal: 38322220284 },\n  { origin: 'per', exportVal: 33873822574 },\n  { origin: 'egy', exportVal: 28814207699 },\n  { origin: 'nzl', exportVal: 28397440169 },\n  { origin: 'omn', exportVal: 27058636294 },\n  { origin: 'cri', exportVal: 23448846570 },\n  { origin: 'grc', exportVal: 22066497483 },\n  { origin: 'pak', exportVal: 21668594115 },\n  { origin: 'svn', exportVal: 21426115576 },\n  { origin: 'aze', exportVal: 20047358465 },\n  { origin: 'bgr', exportVal: 18841613257 },\n  { origin: 'bgd', exportVal: 18130589863 },\n  { origin: 'ecu', exportVal: 16980863677 },\n  { origin: 'lux', exportVal: 16478009245 },\n  { origin: 'mar', exportVal: 16237430066 },\n  { origin: 'tun', exportVal: 16031014518 },\n  { origin: 'ltu', exportVal: 15737237575 },\n  { origin: 'tto', exportVal: 12810076639 },\n  { origin: 'hrv', exportVal: 10916770107 },\n  { origin: 'est', exportVal: 10354731182 },\n  { origin: 'sdn', exportVal: 9800479528 },\n  { origin: 'srb', exportVal: 9029787907 },\n  { origin: 'cog', exportVal: 8949393562 },\n  { origin: 'blr', exportVal: 8929749700 },\n  { origin: 'lva', exportVal: 8555460871 },\n  { origin: 'civ', exportVal: 8073460547 },\n  { origin: 'brn', exportVal: 7925150288 },\n  { origin: 'gnq', exportVal: 7854023406 },\n  { origin: 'syr', exportVal: 7754782660 },\n  { origin: 'bhr', exportVal: 7529173128 },\n  { origin: 'lka', exportVal: 7339588373 },\n  { origin: 'ury', exportVal: 7165504406 },\n  { origin: 'yem', exportVal: 7158061799 },\n  { origin: 'gtm', exportVal: 7003757867 },\n  { origin: 'hnd', exportVal: 6030839002 },\n  { origin: 'pan', exportVal: 5930135538 },\n  { origin: 'mmr', exportVal: 5831563317 },\n  { origin: 'png', exportVal: 5769279559 },\n  { origin: 'mlt', exportVal: 5510882139 },\n  { origin: 'gab', exportVal: 5465186525 },\n  { origin: 'dom', exportVal: 5436778260 },\n  { origin: 'bol', exportVal: 5419211637 },\n  { origin: 'zmb', exportVal: 5131623093 },\n  { origin: 'khm', exportVal: 5112204572 },\n  { origin: 'cod', exportVal: 5076397761 },\n  { origin: 'uzb', exportVal: 4895581648 },\n  { origin: 'slv', exportVal: 4452895199 },\n  { origin: 'jor', exportVal: 4375537052 },\n  { origin: 'pry', exportVal: 4164535906 },\n  { origin: 'bih', exportVal: 4154602570 },\n  { origin: 'gha', exportVal: 4052850512 },\n  { origin: 'isl', exportVal: 3998498539 },\n  { origin: 'ken', exportVal: 3745974291 },\n  { origin: 'cmr', exportVal: 3744461941 },\n  { origin: 'moz', exportVal: 3235381310 },\n  { origin: 'cyp', exportVal: 3105446728 },\n  { origin: 'mkd', exportVal: 3003234599 },\n  { origin: 'nic', exportVal: 2968741221 },\n  { origin: 'tcd', exportVal: 2803301047 },\n  { origin: 'mng', exportVal: 2785683128 },\n  { origin: 'bhs', exportVal: 2702012957 },\n  { origin: 'nam', exportVal: 2582063735 },\n  { origin: 'bwa', exportVal: 2484287290 },\n  { origin: 'tza', exportVal: 2467509196 },\n  { origin: 'cub', exportVal: 2404595120 },\n  { origin: 'ant', exportVal: 2402558108 },\n  { origin: 'atg', exportVal: 2348417348 },\n  { origin: 'lbn', exportVal: 2341813110 },\n  { origin: 'tkm', exportVal: 2267612447 },\n  { origin: 'geo', exportVal: 1926999336 },\n  { origin: 'gin', exportVal: 1891629964 },\n  { origin: 'mrt', exportVal: 1886427106 },\n  { origin: 'mus', exportVal: 1853024506 },\n  { origin: 'prk', exportVal: 1840466387 },\n  { origin: 'lao', exportVal: 1813066982 },\n  { origin: 'sur', exportVal: 1670933603 },\n  { origin: 'mda', exportVal: 1535895371 },\n  { origin: 'eth', exportVal: 1485000925 },\n  { origin: 'alb', exportVal: 1422153482 },\n  { origin: 'sen', exportVal: 1354504280 },\n  { origin: 'zwe', exportVal: 1267893552 },\n  { origin: 'ncl', exportVal: 1116638208 },\n  { origin: 'kgz', exportVal: 1098720987 },\n  { origin: 'mdg', exportVal: 1076708874 },\n  { origin: 'brb', exportVal: 980638268 },\n  { origin: 'cym', exportVal: 974251949 },\n  { origin: 'tjk', exportVal: 958314400 },\n  { origin: 'guy', exportVal: 954432679 },\n  { origin: 'jam', exportVal: 943069430 },\n  { origin: 'uga', exportVal: 935275666 },\n  { origin: 'mwi', exportVal: 932077166 },\n  { origin: 'mac', exportVal: 887740944 },\n  { origin: 'tgo', exportVal: 838487021 },\n  { origin: 'lbr', exportVal: 801935957 },\n  { origin: 'swz', exportVal: 785406576 },\n  { origin: 'ben', exportVal: 725226637 },\n  { origin: 'arm', exportVal: 718132350 },\n  { origin: 'npl', exportVal: 714792917 },\n  { origin: 'fro', exportVal: 711844362 },\n  { origin: 'bmu', exportVal: 705643821 },\n  { origin: 'hti', exportVal: 617209639 },\n  { origin: 'mli', exportVal: 604706423 },\n  { origin: 'fji', exportVal: 602978562 },\n  { origin: 'grl', exportVal: 582480590 },\n  { origin: 'afg', exportVal: 567904408 },\n  { origin: 'bfa', exportVal: 525591271 },\n  { origin: 'lso', exportVal: 484570865 },\n  { origin: 'vut', exportVal: 435685569 },\n  { origin: 'mne', exportVal: 420770610 },\n  { origin: 'vgb', exportVal: 401903288 },\n  { origin: 'mhl', exportVal: 398834621 },\n  { origin: 'slb', exportVal: 367668498 },\n  { origin: 'blz', exportVal: 360301876 },\n  { origin: 'syc', exportVal: 346263287 },\n  { origin: 'sle', exportVal: 324356717 },\n  { origin: 'ner', exportVal: 296079291 },\n  { origin: 'som', exportVal: 285486366 },\n  { origin: 'gib', exportVal: 280334935 },\n  { origin: 'niu', exportVal: 261210980 },\n  { origin: 'and', exportVal: 234285648 },\n  { origin: 'abw', exportVal: 196774818 },\n  { origin: 'btn', exportVal: 189669110 },\n  { origin: 'pyf', exportVal: 178629453 },\n  { origin: 'rwa', exportVal: 174428177 },\n  { origin: 'smr', exportVal: 159388050 },\n  { origin: 'flk', exportVal: 159227983 },\n  { origin: 'gnb', exportVal: 139648187 },\n  { origin: 'vct', exportVal: 128049639 },\n  { origin: 'mdv', exportVal: 125878962 },\n  { origin: 'caf', exportVal: 118997237 },\n  { origin: 'bvt', exportVal: 113300883 },\n  { origin: 'pse', exportVal: 106543441 },\n  { origin: 'dji', exportVal: 106353077 },\n  { origin: 'bdi', exportVal: 71571028 },\n  { origin: 'kna', exportVal: 69543245 },\n  { origin: 'wsm', exportVal: 69125482 },\n  { origin: 'tls', exportVal: 62816488 },\n  { origin: 'lca', exportVal: 62118974 },\n  { origin: 'gmb', exportVal: 61496143 },\n  { origin: 'ata', exportVal: 54524545 },\n  { origin: 'fsm', exportVal: 51668670 },\n  { origin: 'nru', exportVal: 50706656 },\n  { origin: 'cpv', exportVal: 50405460 },\n  { origin: 'dma', exportVal: 49759430 },\n  { origin: 'umi', exportVal: 36534854 },\n  { origin: 'com', exportVal: 32497602 },\n  { origin: 'asm', exportVal: 30381132 },\n  { origin: 'gum', exportVal: 27562111 },\n  { origin: 'cok', exportVal: 22419977 },\n  { origin: 'kir', exportVal: 20578810 },\n  { origin: 'shn', exportVal: 19041382 },\n  { origin: 'grd', exportVal: 17998604 },\n  { origin: 'tca', exportVal: 17650505 },\n  { origin: 'eri', exportVal: 16165269 },\n  { origin: 'tkl', exportVal: 15171571 },\n  { origin: 'cxr', exportVal: 14415365 },\n  { origin: 'plw', exportVal: 14061574 },\n  { origin: 'tuv', exportVal: 13677929 },\n  { origin: 'stp', exportVal: 12435538 },\n  { origin: 'ton', exportVal: 10576037 },\n  { origin: 'aia', exportVal: 10374477 },\n  { origin: 'cck', exportVal: 8621289 },\n  { origin: 'myt', exportVal: 7502485 },\n  { origin: 'sgs', exportVal: 6000762 },\n  { origin: 'spm', exportVal: 5045811 },\n  { origin: 'vat', exportVal: 4840493 },\n  { origin: 'msr', exportVal: 4343283 },\n  { origin: 'iot', exportVal: 3375434 },\n  { origin: 'atf', exportVal: 3247132 },\n  { origin: 'nfk', exportVal: 2788736 },\n  { origin: 'mnp', exportVal: 2435135 },\n  { origin: 'pcn', exportVal: 1748735 },\n  { origin: 'wlf', exportVal: 1337566 },\n  { origin: 'esh', exportVal: 960601 },\n  { origin: 'hmd', exportVal: 154369 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const miniSunburstMock = [\n  { sitc1: '7', dest: 'usa', exportVal: 553359100104 },\n  { sitc1: '7', dest: 'chn', exportVal: 392617281424 },\n  { sitc1: '3', dest: 'usa', exportVal: 324856796136 },\n  { sitc1: '7', dest: 'deu', exportVal: 253250650864 },\n  { sitc1: '8', dest: 'usa', exportVal: 226628559432 },\n  { sitc1: '7', dest: 'hkg', exportVal: 177490158520 },\n  { sitc1: '3', dest: 'jpn', exportVal: 177421375512 },\n  { sitc1: '2', dest: 'chn', exportVal: 173840557624 },\n  { sitc1: '3', dest: 'chn', exportVal: 167989572088 },\n  { sitc1: '7', dest: 'fra', exportVal: 135443006088 },\n  { sitc1: '6', dest: 'usa', exportVal: 129879187528 },\n  { sitc1: '5', dest: 'usa', exportVal: 127516647672 },\n  { sitc1: '7', dest: 'can', exportVal: 118114362152 },\n  { sitc1: '7', dest: 'gbr', exportVal: 117139481536 },\n  { sitc1: '3', dest: 'kor', exportVal: 108348223232 },\n  { sitc1: '7', dest: 'jpn', exportVal: 106979336520 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// source of data: Martin Spier's https://github.com/spiermar/d3-flame-graph\n\n// prettier-ignore\n\n/** @internal */\nexport const observabilityTreeMock = {c:[{n:'genunix`syscall_mstate',v:89},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`page_lookup_create',v:1}],n:'unix`page_lookup',v:1}],n:'ufs`ufs_getpage',v:1}],n:'genunix`fop_getpage',v:1},{c:[{c:[{c:[{c:[{c:[{n:'genunix`pvn_plist_init',v:1},{n:'unix`lgrp_mem_choose',v:1},{c:[{c:[{c:[{n:'unix`mutex_enter',v:1}],n:'unix`page_get_mnode_freelist',v:1}],n:'unix`page_get_freelist',v:1}],n:'unix`page_create_va',v:1},{c:[{n:'unix`page_lookup_create',v:1}],n:'unix`page_lookup',v:1}],n:'genunix`swap_getapage',v:4}],n:'genunix`swap_getpage',v:4}],n:'genunix`fop_getpage',v:4},{c:[{c:[{n:'unix`hwblkclr',v:3}],n:'unix`pfnzero',v:3}],n:'unix`pagezero',v:3}],n:'genunix`anon_zero',v:7}],n:'genunix`segvn_faultpage',v:7},{n:'ufs`ufs_getpage',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`hment_compare',v:1}],n:'genunix`avl_find',v:1}],n:'genunix`avl_add',v:1}],n:'unix`hment_insert',v:2}],n:'unix`hment_assign',v:2}],n:'unix`hati_pte_map',v:2}],n:'unix`hati_load_common',v:2}],n:'unix`hat_memload',v:2}],n:'unix`hat_memload_region',v:2}],n:'genunix`segvn_fault',v:11}],n:'genunix`as_fault',v:12},{n:'genunix`segvn_fault',v:1}],n:'unix`pagefault',v:13}],n:'unix`trap',v:13}],n:'unix`0xfffffffffb8001d6',v:13},{n:'unix`0xfffffffffb800c7c',v:42},{n:'unix`0xfffffffffb800c81',v:2},{c:[{n:'genunix`gethrtime_unscaled',v:4},{c:[{c:[{n:'unix`tsc_gethrtimeunscaled',v:11},{n:'unix`tsc_read',v:186}],n:'genunix`gethrtime_unscaled',v:203},{n:'unix`tsc_gethrtimeunscaled',v:13}],n:'genunix`syscall_mstate',v:355},{n:'unix`atomic_add_64',v:110}],n:'unix`0xfffffffffb800c86',v:472},{c:[{n:'genunix`audit_getstate',v:27},{n:'genunix`clear_stale_fd',v:10},{n:'genunix`disp_lock_exit',v:27},{c:[{n:'FSS`fss_preempt',v:1},{n:'genunix`audit_getstate',v:15},{n:'genunix`clear_stale_fd',v:44},{c:[{n:'unix`clear_int_flag',v:39},{n:'unix`do_splx',v:1993},{c:[{c:[{c:[{n:'unix`do_splx',v:1}],n:'genunix`disp_lock_exit_nopreempt',v:1}],n:'unix`preempt',v:1}],n:'unix`kpreempt',v:1}],n:'genunix`disp_lock_exit',v:2096},{n:'genunix`sigcheck',v:1},{c:[{n:'unix`clear_int_flag',v:180},{n:'unix`splr',v:400}],n:'genunix`thread_lock',v:670},{n:'unix`do_splx',v:31},{n:'unix`i_ddi_splhigh',v:23},{n:'unix`lock_clear_splx',v:28},{n:'unix`lock_try',v:778},{n:'unix`lwp_getdatamodel',v:6},{c:[{c:[{c:[{c:[{c:[{n:'unix`tsc_gethrtimeunscaled',v:1}],n:'genunix`mstate_thread_onproc_time',v:1}],n:'unix`caps_charge_adjust',v:1}],n:'unix`cpucaps_charge',v:3},{c:[{n:'unix`cmt_balance',v:1},{c:[{n:'unix`bitset_in_set',v:1}],n:'unix`cpu_wakeup_mwait',v:1}],n:'unix`setbackdq',v:5}],n:'FSS`fss_preempt',v:8},{n:'unix`do_splx',v:1},{c:[{n:'genunix`disp_lock_exit_high',v:1},{c:[{n:'unix`membar_enter',v:1}],n:'unix`disp',v:1},{n:'unix`do_splx',v:1},{c:[{c:[{n:'genunix`schedctl_save',v:1}],n:'genunix`savectx',v:2}],n:'unix`resume',v:2}],n:'unix`swtch',v:5}],n:'unix`preempt',v:14},{n:'unix`prunstop',v:36},{n:'unix`splr',v:92},{n:'unix`splx',v:6}],n:'genunix`post_syscall',v:4245},{n:'genunix`thread_lock',v:33},{n:'unix`lwp_getdatamodel',v:3},{n:'unix`prunstop',v:2}],n:'unix`0xfffffffffb800c91',v:4361},{c:[{n:'genunix`gethrtime_unscaled',v:7},{c:[{c:[{n:'unix`tsc_gethrtimeunscaled',v:17},{n:'unix`tsc_read',v:160}],n:'genunix`gethrtime_unscaled',v:182},{n:'unix`tsc_gethrtimeunscaled',v:12}],n:'genunix`syscall_mstate',v:412},{n:'unix`atomic_add_64',v:95}],n:'unix`0xfffffffffb800ca0',v:517},{n:'unix`_sys_rtt',v:6},{c:[{c:[{c:[{c:[{c:[{c:[{n:'genunix`cpu_decay',v:1}],n:'genunix`cpu_grow',v:1}],n:'genunix`cpu_update_pct',v:1}],n:'genunix`new_mstate',v:1}],n:'unix`trap',v:1}],n:'unix`sys_rtt_common',v:1}],n:'unix`_sys_rtt_ints_disabled',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'doorfs`door_close',v:1}],n:'namefs`nm_close',v:1}],n:'genunix`fop_close',v:1}],n:'genunix`closef',v:1}],n:'genunix`close_exec',v:1}],n:'genunix`exec_common',v:1}],n:'genunix`exece',v:1}],n:'unix`_sys_sysenter_post_swapgs',v:1},{c:[{n:'genunix`gethrtime_unscaled',v:11},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`mtype_func',v:1},{n:'unix`mutex_enter',v:1}],n:'unix`page_get_mnode_freelist',v:2}],n:'unix`page_get_freelist',v:2}],n:'unix`page_create_va',v:3}],n:'genunix`pvn_read_kluster',v:3}],n:'ufs`ufs_getpage_ra',v:3}],n:'ufs`ufs_getpage',v:3}],n:'genunix`fop_getpage',v:3}],n:'genunix`segvn_faulta',v:3}],n:'genunix`as_faulta',v:3}],n:'genunix`memcntl',v:3},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`htable_lookup',v:1}],n:'unix`htable_walk',v:1}],n:'unix`hat_unload_callback',v:1}],n:'genunix`segvn_unmap',v:1}],n:'genunix`as_unmap',v:1}],n:'unix`mmapobj_map_elf',v:1}],n:'unix`mmapobj_map_interpret',v:1}],n:'unix`mmapobj',v:1}],n:'genunix`mmapobjsys',v:1},{c:[{n:'genunix`copen',v:7},{c:[{n:'genunix`audit_getstate',v:62},{c:[{n:'genunix`audit_falloc',v:8},{c:[{c:[{c:[{c:[{c:[{n:'unix`swtch',v:1}],n:'unix`preempt',v:1}],n:'unix`kpreempt',v:1}],n:'unix`sys_rtt_common',v:1}],n:'unix`_sys_rtt_ints_disabled',v:1}],n:'genunix`audit_getstate',v:66},{n:'genunix`audit_unfalloc',v:32},{n:'genunix`crfree',v:9},{n:'genunix`crhold',v:5},{n:'genunix`cv_broadcast',v:16},{c:[{c:[{n:'genunix`kmem_cache_alloc',v:11},{c:[{n:'genunix`kmem_cache_alloc',v:66},{n:'unix`mutex_enter',v:122},{n:'unix`mutex_exit',v:46}],n:'genunix`kmem_zalloc',v:280},{n:'unix`bzero',v:8}],n:'genunix`audit_falloc',v:313},{n:'genunix`crhold',v:11},{n:'genunix`kmem_cache_alloc',v:49},{n:'genunix`kmem_zalloc',v:13},{c:[{n:'genunix`fd_find',v:13},{n:'genunix`fd_reserve',v:9},{c:[{n:'genunix`fd_find',v:161},{n:'genunix`fd_reserve',v:15}],n:'genunix`ufalloc_file',v:294},{n:'unix`mutex_enter',v:197},{n:'unix`mutex_exit',v:29}],n:'genunix`ufalloc',v:551},{n:'genunix`ufalloc_file',v:20},{n:'unix`atomic_add_32',v:134},{n:'unix`mutex_enter',v:99},{n:'unix`mutex_exit',v:58}],n:'genunix`falloc',v:1363},{n:'genunix`fd_reserve',v:8},{n:'genunix`kmem_cache_alloc',v:9},{n:'genunix`kmem_cache_free',v:5},{n:'genunix`lookupnameat',v:69},{n:'genunix`set_errno',v:24},{c:[{n:'genunix`audit_getstate',v:31},{n:'genunix`cv_broadcast',v:25},{n:'genunix`fd_reserve',v:35}],n:'genunix`setf',v:187},{n:'genunix`ufalloc',v:10},{c:[{c:[{n:'genunix`kmem_cache_free',v:5},{c:[{n:'genunix`kmem_cache_free',v:73},{n:'unix`mutex_enter',v:111},{n:'unix`mutex_exit',v:55}],n:'genunix`kmem_free',v:288}],n:'genunix`audit_unfalloc',v:340},{n:'genunix`crfree',v:13},{n:'genunix`kmem_cache_free',v:51},{n:'genunix`kmem_free',v:11},{n:'unix`atomic_add_32_nv',v:100},{n:'unix`mutex_enter',v:97},{n:'unix`mutex_exit',v:56}],n:'genunix`unfalloc',v:729},{c:[{c:[{c:[{c:[{n:'genunix`audit_getstate',v:16},{n:'genunix`fop_lookup',v:55},{c:[{n:'genunix`audit_getstate',v:21},{n:'genunix`crgetmapped',v:55},{n:'genunix`fop_inactive',v:39},{c:[{n:'genunix`crgetmapped',v:57},{n:'genunix`dnlc_lookup',v:26},{n:'genunix`fop_lookup',v:85},{n:'genunix`kmem_alloc',v:73},{n:'genunix`traverse',v:30},{n:'genunix`vfs_matchops',v:28},{c:[{c:[{n:'genunix`kmem_cache_alloc',v:241},{n:'unix`mutex_enter',v:366},{n:'unix`mutex_exit',v:149}],n:'genunix`kmem_alloc',v:934},{n:'genunix`kmem_cache_alloc',v:32}],n:'genunix`vn_setpath',v:1969},{c:[{n:'genunix`crgetmapped',v:36},{c:[{n:'genunix`crgetmapped',v:58},{n:'genunix`dnlc_lookup',v:70},{n:'genunix`vn_rele',v:14},{n:'ufs`ufs_iaccess',v:91},{c:[{n:'genunix`crgetuid',v:30},{c:[{n:'genunix`memcmp',v:38},{c:[{n:'genunix`memcmp',v:277}],n:'unix`bcmp',v:295}],n:'genunix`dnlc_lookup',v:1843},{n:'genunix`secpolicy_vnode_access2',v:72},{n:'genunix`vn_rele',v:39},{c:[{n:'genunix`crgetuid',v:22},{n:'genunix`secpolicy_vnode_access2',v:217}],n:'ufs`ufs_iaccess',v:648},{n:'unix`bcmp',v:42},{n:'unix`mutex_enter',v:980},{n:'unix`mutex_exit',v:350},{n:'unix`rw_enter',v:525},{n:'unix`rw_exit',v:439}],n:'ufs`ufs_lookup',v:5399}],n:'genunix`fop_lookup',v:6470},{n:'genunix`kmem_cache_alloc',v:39},{c:[{n:'genunix`rwst_exit',v:18},{n:'genunix`rwst_tryenter',v:32},{n:'genunix`vn_mountedvfs',v:11},{n:'genunix`vn_vfslocks_getlock',v:62},{n:'genunix`vn_vfslocks_rele',v:50},{c:[{n:'genunix`kmem_alloc',v:32},{n:'genunix`rwst_enter_common',v:32},{n:'genunix`rwst_init',v:28},{c:[{n:'genunix`rwst_enter_common',v:264},{n:'unix`mutex_enter',v:337},{n:'unix`mutex_exit',v:105}],n:'genunix`rwst_tryenter',v:734},{c:[{n:'genunix`cv_init',v:53},{c:[{c:[{n:'genunix`kmem_cpu_reload',v:2}],n:'genunix`kmem_cache_alloc',v:168},{n:'unix`mutex_enter',v:379},{n:'unix`mutex_exit',v:155}],n:'genunix`kmem_alloc',v:795},{n:'genunix`kmem_cache_alloc',v:29},{c:[{n:'genunix`cv_init',v:65},{n:'unix`mutex_init',v:53}],n:'genunix`rwst_init',v:236},{n:'unix`mutex_init',v:46}],n:'genunix`vn_vfslocks_getlock',v:1357},{n:'unix`mutex_enter',v:727},{n:'unix`mutex_exit',v:371}],n:'genunix`vn_vfsrlock',v:3342},{c:[{n:'genunix`cv_broadcast',v:25},{n:'genunix`kmem_free',v:35},{n:'genunix`rwst_destroy',v:32},{c:[{n:'genunix`cv_broadcast',v:40}],n:'genunix`rwst_exit',v:167},{n:'genunix`vn_vfslocks_getlock',v:120},{c:[{n:'genunix`cv_destroy',v:77},{n:'genunix`kmem_cache_free',v:22},{c:[{n:'genunix`kmem_cache_free',v:154},{n:'unix`mutex_enter',v:316},{n:'unix`mutex_exit',v:148}],n:'genunix`kmem_free',v:693},{c:[{n:'genunix`cv_destroy',v:42},{n:'unix`mutex_destroy',v:176}],n:'genunix`rwst_destroy',v:296},{n:'unix`mutex_destroy',v:31}],n:'genunix`vn_vfslocks_rele',v:1420},{n:'unix`mutex_enter',v:1202},{n:'unix`mutex_exit',v:512}],n:'genunix`vn_vfsunlock',v:3578}],n:'genunix`traverse',v:7243},{n:'genunix`vfs_getops',v:21},{c:[{n:'genunix`vfs_getops',v:157},{n:'unix`membar_consumer',v:123}],n:'genunix`vfs_matchops',v:336},{n:'genunix`vn_alloc',v:20},{n:'genunix`vn_exists',v:17},{n:'genunix`vn_mountedvfs',v:30},{n:'genunix`vn_setops',v:41},{n:'genunix`vn_vfsrlock',v:13},{n:'genunix`vn_vfsunlock',v:40},{n:'lofs`lfind',v:26},{n:'lofs`lsave',v:27},{n:'lofs`makelfsnode',v:28},{c:[{n:'genunix`kmem_cache_alloc',v:234},{n:'genunix`kmem_cpu_reload',v:1},{c:[{n:'genunix`kmem_cache_alloc',v:179},{n:'genunix`vn_recycle',v:33},{c:[{c:[{n:'genunix`vsd_free',v:155}],n:'genunix`vn_recycle',v:319},{n:'genunix`vsd_free',v:14}],n:'genunix`vn_reinit',v:424},{n:'unix`mutex_enter',v:318},{n:'unix`mutex_exit',v:142}],n:'genunix`vn_alloc',v:1189},{n:'genunix`vn_exists',v:50},{n:'genunix`vn_reinit',v:48},{n:'genunix`vn_setops',v:160},{n:'lofs`lfind',v:278},{n:'lofs`lsave',v:162},{n:'lofs`makelfsnode',v:82},{n:'lofs`table_lock_enter',v:220},{n:'unix`atomic_cas_64',v:318},{n:'unix`membar_consumer',v:237},{n:'unix`mutex_enter',v:640},{n:'unix`mutex_exit',v:138}],n:'lofs`makelonode',v:4212},{n:'lofs`table_lock_enter',v:43},{n:'ufs`ufs_lookup',v:46},{n:'unix`atomic_add_32',v:325},{n:'unix`mutex_exit',v:26}],n:'lofs`lo_lookup',v:19887},{n:'lofs`makelonode',v:39},{n:'unix`bcopy',v:896},{n:'unix`mutex_enter',v:947},{n:'unix`mutex_exit',v:337},{c:[{c:[{c:[{n:'unix`dispatch_hilevel',v:1}],n:'unix`do_interrupt',v:1}],n:'unix`_interrupt',v:1}],n:'unix`strlen',v:2659},{n:'zfs`specvp_check',v:10},{n:'zfs`zfs_fastaccesschk_execute',v:4},{c:[{n:'genunix`crgetuid',v:6},{c:[{n:'genunix`memcmp',v:3},{c:[{n:'genunix`memcmp',v:38}],n:'unix`bcmp',v:45}],n:'genunix`dnlc_lookup',v:263},{n:'unix`bcmp',v:11},{n:'unix`mutex_enter',v:309},{n:'unix`mutex_exit',v:135},{n:'zfs`specvp_check',v:20},{c:[{n:'genunix`crgetuid',v:2}],n:'zfs`zfs_fastaccesschk_execute',v:50}],n:'zfs`zfs_lookup',v:946}],n:'genunix`fop_lookup',v:29216},{n:'genunix`fsop_root',v:62},{n:'genunix`pn_fixslash',v:44},{n:'genunix`pn_getcomponent',v:454},{c:[{c:[{n:'lofs`lo_root',v:80},{n:'unix`mutex_enter',v:95},{n:'unix`mutex_exit',v:59}],n:'genunix`fsop_root',v:297},{n:'genunix`rwst_exit',v:12},{n:'genunix`rwst_tryenter',v:37},{n:'genunix`vn_mountedvfs',v:20},{n:'genunix`vn_rele',v:19},{n:'genunix`vn_vfslocks_getlock',v:47},{n:'genunix`vn_vfslocks_rele',v:34},{c:[{n:'genunix`kmem_alloc',v:11},{n:'genunix`rwst_enter_common',v:28},{n:'genunix`rwst_init',v:13},{c:[{n:'genunix`rwst_enter_common',v:314},{n:'unix`mutex_enter',v:238},{n:'unix`mutex_exit',v:49}],n:'genunix`rwst_tryenter',v:628},{c:[{n:'genunix`cv_init',v:56},{c:[{n:'genunix`kmem_cache_alloc',v:126},{n:'unix`mutex_enter',v:252},{n:'unix`mutex_exit',v:95}],n:'genunix`kmem_alloc',v:533},{n:'genunix`kmem_cache_alloc',v:17},{c:[{n:'genunix`cv_init',v:49},{n:'unix`mutex_init',v:38}],n:'genunix`rwst_init',v:173},{n:'unix`mutex_init',v:31}],n:'genunix`vn_vfslocks_getlock',v:973},{n:'unix`mutex_enter',v:455},{n:'unix`mutex_exit',v:250}],n:'genunix`vn_vfsrlock',v:2414},{c:[{n:'genunix`cv_broadcast',v:14},{n:'genunix`kmem_free',v:17},{n:'genunix`rwst_destroy',v:20},{c:[{n:'genunix`cv_broadcast',v:19}],n:'genunix`rwst_exit',v:110},{n:'genunix`vn_vfslocks_getlock',v:79},{c:[{n:'genunix`cv_destroy',v:81},{n:'genunix`kmem_cache_free',v:18},{c:[{n:'genunix`kmem_cache_free',v:116},{n:'unix`mutex_enter',v:195},{n:'unix`mutex_exit',v:90}],n:'genunix`kmem_free',v:457},{c:[{n:'genunix`cv_destroy',v:31},{n:'unix`mutex_destroy',v:53}],n:'genunix`rwst_destroy',v:146},{n:'unix`mutex_destroy',v:17}],n:'genunix`vn_vfslocks_rele',v:903},{n:'unix`mutex_enter',v:823},{n:'unix`mutex_exit',v:356}],n:'genunix`vn_vfsunlock',v:2372},{n:'lofs`lo_root',v:31},{n:'unix`mutex_enter',v:95},{n:'unix`mutex_exit',v:56}],n:'genunix`traverse',v:5557},{n:'genunix`vn_mountedvfs',v:43},{c:[{n:'genunix`crgetmapped',v:31},{c:[{n:'genunix`crgetmapped',v:41},{n:'lofs`freelonode',v:35},{c:[{n:'genunix`kmem_cache_free',v:29},{n:'genunix`vn_free',v:26},{n:'genunix`vn_invalid',v:20},{n:'genunix`vn_rele',v:25},{c:[{c:[{n:'genunix`kmem_cpu_reload',v:1}],n:'genunix`kmem_cache_free',v:184},{n:'genunix`kmem_free',v:115},{c:[{c:[{n:'genunix`kmem_cpu_reload',v:4}],n:'genunix`kmem_cache_free',v:215},{n:'genunix`kmem_cpu_reload',v:5},{c:[{n:'genunix`kmem_cache_free',v:209},{n:'unix`mutex_enter',v:299},{n:'unix`mutex_exit',v:160}],n:'genunix`kmem_free',v:785},{n:'genunix`vsd_free',v:48},{n:'unix`mutex_enter',v:314},{n:'unix`mutex_exit',v:171}],n:'genunix`vn_free',v:1663},{n:'genunix`vn_invalid',v:47},{n:'genunix`vn_rele',v:64},{n:'genunix`vsd_free',v:17},{n:'lofs`table_lock_enter',v:189},{n:'unix`membar_consumer',v:106},{n:'unix`mutex_enter',v:905},{n:'unix`mutex_exit',v:358},{n:'unix`strlen',v:1238}],n:'lofs`freelonode',v:5313},{n:'lofs`table_lock_enter',v:44},{n:'unix`atomic_add_32',v:292},{n:'unix`mutex_enter',v:279},{n:'unix`mutex_exit',v:212}],n:'lofs`lo_inactive',v:6307}],n:'genunix`fop_inactive',v:6689},{n:'lofs`lo_inactive',v:21}],n:'genunix`vn_rele',v:6943},{n:'genunix`vn_setpath',v:58},{n:'genunix`vn_vfsrlock',v:12},{n:'genunix`vn_vfsunlock',v:20},{n:'lofs`lo_lookup',v:65},{n:'unix`mutex_enter',v:575},{n:'unix`mutex_exit',v:379},{n:'unix`strlen',v:107},{n:'zfs`zfs_lookup',v:22}],n:'genunix`lookuppnvp',v:44242},{n:'genunix`pn_fixslash',v:14},{n:'genunix`pn_getcomponent',v:41},{n:'genunix`traverse',v:17},{n:'genunix`vn_mountedvfs',v:56},{n:'genunix`vn_rele',v:73},{c:[{n:'unix`mutex_delay_default',v:1},{n:'unix`tsc_read',v:1}],n:'unix`mutex_vector_enter',v:2}],n:'genunix`lookuppnatcred',v:44681},{n:'genunix`lookuppnvp',v:10},{c:[{n:'unix`copyinstr',v:25},{n:'unix`copystr',v:598}],n:'genunix`pn_get_buf',v:687},{n:'unix`copyinstr',v:18},{n:'unix`mutex_enter',v:320},{n:'unix`mutex_exit',v:163}],n:'genunix`lookupnameatcred',v:45978},{n:'genunix`lookuppnatcred',v:12},{n:'genunix`pn_get_buf',v:13}],n:'genunix`lookupnameat',v:46075},{n:'genunix`lookupnameatcred',v:22}],n:'genunix`vn_openat',v:46342},{n:'unix`mutex_enter',v:303},{n:'unix`mutex_exit',v:38}],n:'genunix`copen',v:49444},{n:'genunix`falloc',v:36},{n:'genunix`set_errno',v:9},{n:'genunix`setf',v:16},{n:'genunix`unfalloc',v:39},{n:'genunix`vn_openat',v:14}],n:'genunix`openat',v:49647}],n:'genunix`open',v:49669},{n:'genunix`openat',v:17},{c:[{c:[{c:[{n:'genunix`dotoprocs',v:1}],n:'genunix`doprio',v:1}],n:'genunix`priocntl_common',v:1}],n:'genunix`priocntlsys',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'genunix`dnlc_lookup',v:1}],n:'ufs`ufs_lookup',v:1}],n:'genunix`fop_lookup',v:1}],n:'lofs`lo_lookup',v:1}],n:'genunix`fop_lookup',v:1}],n:'genunix`lookuppnvp',v:1}],n:'genunix`lookuppnatcred',v:1}],n:'genunix`lookuppn',v:1}],n:'genunix`resolvepath',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'genunix`kmem_cache_free',v:1}],n:'genunix`kmem_free',v:1}],n:'genunix`removectx',v:1}],n:'genunix`schedctl_lwp_cleanup',v:1}],n:'genunix`exitlwps',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`hment_compare',v:2}],n:'genunix`avl_find',v:2}],n:'unix`hment_remove',v:2},{n:'unix`page_numtopp_nolock',v:1}],n:'unix`hat_pte_unmap',v:3}],n:'unix`hat_unload_callback',v:3}],n:'genunix`segvn_unmap',v:3}],n:'genunix`as_free',v:3}],n:'genunix`relvm',v:3},{c:[{c:[{c:[{c:[{n:'genunix`vmem_free',v:1}],n:'genunix`segkp_release_internal',v:1}],n:'genunix`segkp_release',v:1}],n:'genunix`schedctl_freepage',v:1}],n:'genunix`schedctl_proc_cleanup',v:1}],n:'genunix`proc_exit',v:5}],n:'genunix`exit',v:5}],n:'genunix`rexit',v:5},{c:[{c:[{n:'unix`tsc_gethrtimeunscaled',v:43},{n:'unix`tsc_read',v:367}],n:'genunix`gethrtime_unscaled',v:420},{n:'unix`tsc_gethrtimeunscaled',v:59}],n:'genunix`syscall_mstate',v:1336},{n:'unix`atomic_add_64',v:205}],n:'unix`sys_syscall',v:51908}],n:'root',v:57412};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RgbTuple } from '../../common/color_library_wrappers';\n\nconst CET2s: RgbTuple[] = [\n  [46, 34, 235],\n  [49, 32, 237],\n  [52, 30, 238],\n  [56, 29, 239],\n  [59, 28, 240],\n  [63, 27, 241],\n  [66, 27, 242],\n  [70, 27, 242],\n  [73, 27, 243],\n  [77, 28, 244],\n  [80, 29, 244],\n  [84, 30, 245],\n  [87, 31, 245],\n  [91, 32, 246],\n  [94, 33, 246],\n  [97, 35, 246],\n  [100, 36, 247],\n  [103, 38, 247],\n  [106, 39, 248],\n  [109, 41, 248],\n  [112, 42, 248],\n  [115, 44, 249],\n  [118, 45, 249],\n  [121, 47, 249],\n  [123, 48, 250],\n  [126, 49, 250],\n  [129, 51, 250],\n  [132, 52, 251],\n  [135, 53, 251],\n  [137, 54, 251],\n  [140, 56, 251],\n  [143, 57, 251],\n  [146, 58, 252],\n  [149, 59, 252],\n  [152, 60, 252],\n  [155, 60, 252],\n  [158, 61, 252],\n  [162, 62, 252],\n  [165, 63, 252],\n  [168, 63, 252],\n  [171, 64, 252],\n  [175, 65, 252],\n  [178, 65, 252],\n  [181, 66, 252],\n  [185, 66, 252],\n  [188, 66, 252],\n  [191, 67, 252],\n  [195, 67, 252],\n  [198, 68, 252],\n  [201, 68, 251],\n  [204, 69, 251],\n  [207, 69, 251],\n  [211, 70, 251],\n  [214, 70, 251],\n  [217, 71, 250],\n  [219, 72, 250],\n  [222, 73, 250],\n  [225, 74, 249],\n  [227, 75, 249],\n  [230, 76, 248],\n  [232, 78, 247],\n  [234, 79, 246],\n  [236, 81, 245],\n  [238, 83, 244],\n  [240, 85, 243],\n  [242, 88, 241],\n  [243, 90, 240],\n  [244, 93, 238],\n  [245, 96, 236],\n  [246, 99, 234],\n  [247, 102, 232],\n  [248, 105, 230],\n  [249, 108, 227],\n  [249, 111, 225],\n  [250, 114, 223],\n  [250, 117, 220],\n  [251, 120, 217],\n  [251, 123, 215],\n  [252, 127, 212],\n  [252, 130, 210],\n  [252, 133, 207],\n  [252, 136, 204],\n  [252, 139, 201],\n  [253, 141, 199],\n  [253, 144, 196],\n  [253, 147, 193],\n  [253, 150, 190],\n  [253, 153, 188],\n  [253, 156, 185],\n  [253, 158, 182],\n  [253, 161, 179],\n  [253, 164, 177],\n  [253, 166, 174],\n  [253, 169, 171],\n  [253, 171, 168],\n  [253, 174, 165],\n  [252, 176, 162],\n  [252, 179, 160],\n  [252, 181, 157],\n  [252, 184, 154],\n  [252, 186, 151],\n  [253, 188, 148],\n  [253, 191, 145],\n  [253, 193, 142],\n  [253, 195, 139],\n  [253, 198, 136],\n  [253, 200, 133],\n  [253, 202, 130],\n  [253, 204, 127],\n  [253, 207, 124],\n  [253, 209, 120],\n  [253, 211, 117],\n  [253, 213, 114],\n  [253, 215, 110],\n  [253, 217, 107],\n  [253, 219, 104],\n  [253, 221, 100],\n  [252, 223, 96],\n  [252, 225, 93],\n  [252, 227, 89],\n  [251, 229, 85],\n  [250, 231, 81],\n  [250, 232, 77],\n  [249, 234, 73],\n  [248, 235, 69],\n  [246, 236, 65],\n  [245, 237, 61],\n  [243, 238, 57],\n  [242, 239, 54],\n  [240, 239, 50],\n  [238, 239, 46],\n  [235, 239, 43],\n  [233, 239, 40],\n  [231, 239, 37],\n  [228, 239, 35],\n  [225, 238, 33],\n  [223, 238, 31],\n  [220, 237, 29],\n  [217, 236, 27],\n  [214, 235, 26],\n  [211, 234, 25],\n  [209, 233, 24],\n  [206, 232, 24],\n  [203, 231, 23],\n  [200, 230, 22],\n  [197, 229, 22],\n  [194, 228, 21],\n  [191, 227, 21],\n  [188, 226, 21],\n  [185, 225, 20],\n  [182, 224, 20],\n  [179, 223, 20],\n  [176, 221, 19],\n  [173, 220, 19],\n  [170, 219, 19],\n  [167, 218, 18],\n  [164, 217, 18],\n  [161, 216, 17],\n  [158, 215, 17],\n  [154, 214, 17],\n  [151, 213, 16],\n  [148, 211, 16],\n  [145, 210, 16],\n  [142, 209, 15],\n  [139, 208, 15],\n  [136, 207, 15],\n  [132, 206, 14],\n  [129, 205, 14],\n  [126, 204, 14],\n  [122, 202, 13],\n  [119, 201, 13],\n  [116, 200, 13],\n  [112, 199, 13],\n  [109, 198, 12],\n  [105, 197, 12],\n  [102, 196, 12],\n  [98, 194, 12],\n  [94, 193, 12],\n  [91, 192, 12],\n  [87, 191, 12],\n  [83, 190, 13],\n  [79, 188, 14],\n  [76, 187, 15],\n  [72, 186, 16],\n  [68, 185, 18],\n  [65, 183, 20],\n  [62, 182, 22],\n  [59, 181, 25],\n  [56, 179, 27],\n  [54, 178, 30],\n  [52, 176, 34],\n  [51, 175, 37],\n  [50, 173, 40],\n  [50, 172, 44],\n  [50, 170, 48],\n  [51, 168, 51],\n  [52, 167, 55],\n  [53, 165, 59],\n  [54, 163, 63],\n  [56, 161, 67],\n  [57, 160, 71],\n  [59, 158, 74],\n  [60, 156, 78],\n  [62, 154, 82],\n  [63, 152, 86],\n  [64, 150, 90],\n  [66, 148, 93],\n  [67, 147, 97],\n  [67, 145, 101],\n  [68, 143, 104],\n  [69, 141, 108],\n  [69, 139, 111],\n  [69, 137, 115],\n  [70, 135, 118],\n  [70, 133, 122],\n  [69, 131, 125],\n  [69, 129, 129],\n  [69, 128, 132],\n  [68, 126, 135],\n  [67, 124, 139],\n  [67, 122, 142],\n  [66, 120, 145],\n  [64, 118, 149],\n  [63, 116, 152],\n  [62, 114, 155],\n  [60, 112, 158],\n  [59, 110, 162],\n  [57, 108, 165],\n  [56, 106, 168],\n  [54, 104, 171],\n  [53, 102, 174],\n  [51, 100, 177],\n  [50, 98, 180],\n  [48, 96, 183],\n  [47, 93, 185],\n  [46, 91, 188],\n  [45, 89, 191],\n  [44, 86, 193],\n  [43, 84, 196],\n  [42, 81, 199],\n  [41, 79, 201],\n  [40, 76, 204],\n  [40, 73, 206],\n  [39, 70, 209],\n  [38, 68, 211],\n  [38, 65, 213],\n  [37, 62, 216],\n  [37, 59, 218],\n  [37, 56, 220],\n  [37, 53, 222],\n  [37, 50, 224],\n  [37, 47, 227],\n  [38, 44, 228],\n  [40, 41, 230],\n  [42, 39, 232],\n  [44, 36, 234],\n];\n\nconst turbo: RgbTuple[] = [\n  [48, 18, 59],\n  [50, 21, 67],\n  [51, 24, 74],\n  [52, 27, 81],\n  [53, 30, 88],\n  [54, 33, 95],\n  [55, 36, 102],\n  [56, 39, 109],\n  [57, 42, 115],\n  [58, 45, 121],\n  [59, 47, 128],\n  [60, 50, 134],\n  [61, 53, 139],\n  [62, 56, 145],\n  [63, 59, 151],\n  [63, 62, 156],\n  [64, 64, 162],\n  [65, 67, 167],\n  [65, 70, 172],\n  [66, 73, 177],\n  [66, 75, 181],\n  [67, 78, 186],\n  [68, 81, 191],\n  [68, 84, 195],\n  [68, 86, 199],\n  [69, 89, 203],\n  [69, 92, 207],\n  [69, 94, 211],\n  [70, 97, 214],\n  [70, 100, 218],\n  [70, 102, 221],\n  [70, 105, 224],\n  [70, 107, 227],\n  [71, 110, 230],\n  [71, 113, 233],\n  [71, 115, 235],\n  [71, 118, 238],\n  [71, 120, 240],\n  [71, 123, 242],\n  [70, 125, 244],\n  [70, 128, 246],\n  [70, 130, 248],\n  [70, 133, 250],\n  [70, 135, 251],\n  [69, 138, 252],\n  [69, 140, 253],\n  [68, 143, 254],\n  [67, 145, 254],\n  [66, 148, 255],\n  [65, 150, 255],\n  [64, 153, 255],\n  [62, 155, 254],\n  [61, 158, 254],\n  [59, 160, 253],\n  [58, 163, 252],\n  [56, 165, 251],\n  [55, 168, 250],\n  [53, 171, 248],\n  [51, 173, 247],\n  [49, 175, 245],\n  [47, 178, 244],\n  [46, 180, 242],\n  [44, 183, 240],\n  [42, 185, 238],\n  [40, 188, 235],\n  [39, 190, 233],\n  [37, 192, 231],\n  [35, 195, 228],\n  [34, 197, 226],\n  [32, 199, 223],\n  [31, 201, 221],\n  [30, 203, 218],\n  [28, 205, 216],\n  [27, 208, 213],\n  [26, 210, 210],\n  [26, 212, 208],\n  [25, 213, 205],\n  [24, 215, 202],\n  [24, 217, 200],\n  [24, 219, 197],\n  [24, 221, 194],\n  [24, 222, 192],\n  [24, 224, 189],\n  [25, 226, 187],\n  [25, 227, 185],\n  [26, 228, 182],\n  [28, 230, 180],\n  [29, 231, 178],\n  [31, 233, 175],\n  [32, 234, 172],\n  [34, 235, 170],\n  [37, 236, 167],\n  [39, 238, 164],\n  [42, 239, 161],\n  [44, 240, 158],\n  [47, 241, 155],\n  [50, 242, 152],\n  [53, 243, 148],\n  [56, 244, 145],\n  [60, 245, 142],\n  [63, 246, 138],\n  [67, 247, 135],\n  [70, 248, 132],\n  [74, 248, 128],\n  [78, 249, 125],\n  [82, 250, 122],\n  [85, 250, 118],\n  [89, 251, 115],\n  [93, 252, 111],\n  [97, 252, 108],\n  [101, 253, 105],\n  [105, 253, 102],\n  [109, 254, 98],\n  [113, 254, 95],\n  [117, 254, 92],\n  [121, 254, 89],\n  [125, 255, 86],\n  [128, 255, 83],\n  [132, 255, 81],\n  [136, 255, 78],\n  [139, 255, 75],\n  [143, 255, 73],\n  [146, 255, 71],\n  [150, 254, 68],\n  [153, 254, 66],\n  [156, 254, 64],\n  [159, 253, 63],\n  [161, 253, 61],\n  [164, 252, 60],\n  [167, 252, 58],\n  [169, 251, 57],\n  [172, 251, 56],\n  [175, 250, 55],\n  [177, 249, 54],\n  [180, 248, 54],\n  [183, 247, 53],\n  [185, 246, 53],\n  [188, 245, 52],\n  [190, 244, 52],\n  [193, 243, 52],\n  [195, 241, 52],\n  [198, 240, 52],\n  [200, 239, 52],\n  [203, 237, 52],\n  [205, 236, 52],\n  [208, 234, 52],\n  [210, 233, 53],\n  [212, 231, 53],\n  [215, 229, 53],\n  [217, 228, 54],\n  [219, 226, 54],\n  [221, 224, 55],\n  [223, 223, 55],\n  [225, 221, 55],\n  [227, 219, 56],\n  [229, 217, 56],\n  [231, 215, 57],\n  [233, 213, 57],\n  [235, 211, 57],\n  [236, 209, 58],\n  [238, 207, 58],\n  [239, 205, 58],\n  [241, 203, 58],\n  [242, 201, 58],\n  [244, 199, 58],\n  [245, 197, 58],\n  [246, 195, 58],\n  [247, 193, 58],\n  [248, 190, 57],\n  [249, 188, 57],\n  [250, 186, 57],\n  [251, 184, 56],\n  [251, 182, 55],\n  [252, 179, 54],\n  [252, 177, 54],\n  [253, 174, 53],\n  [253, 172, 52],\n  [254, 169, 51],\n  [254, 167, 50],\n  [254, 164, 49],\n  [254, 161, 48],\n  [254, 158, 47],\n  [254, 155, 45],\n  [254, 153, 44],\n  [254, 150, 43],\n  [254, 147, 42],\n  [254, 144, 41],\n  [253, 141, 39],\n  [253, 138, 38],\n  [252, 135, 37],\n  [252, 132, 35],\n  [251, 129, 34],\n  [251, 126, 33],\n  [250, 123, 31],\n  [249, 120, 30],\n  [249, 117, 29],\n  [248, 114, 28],\n  [247, 111, 26],\n  [246, 108, 25],\n  [245, 105, 24],\n  [244, 102, 23],\n  [243, 99, 21],\n  [242, 96, 20],\n  [241, 93, 19],\n  [240, 91, 18],\n  [239, 88, 17],\n  [237, 85, 16],\n  [236, 83, 15],\n  [235, 80, 14],\n  [234, 78, 13],\n  [232, 75, 12],\n  [231, 73, 12],\n  [229, 71, 11],\n  [228, 69, 10],\n  [226, 67, 10],\n  [225, 65, 9],\n  [223, 63, 8],\n  [221, 61, 8],\n  [220, 59, 7],\n  [218, 57, 7],\n  [216, 55, 6],\n  [214, 53, 6],\n  [212, 51, 5],\n  [210, 49, 5],\n  [208, 47, 5],\n  [206, 45, 4],\n  [204, 43, 4],\n  [202, 42, 4],\n  [200, 40, 3],\n  [197, 38, 3],\n  [195, 37, 3],\n  [193, 35, 2],\n  [190, 33, 2],\n  [188, 32, 2],\n  [185, 30, 2],\n  [183, 29, 2],\n  [180, 27, 1],\n  [178, 26, 1],\n  [175, 24, 1],\n  [172, 23, 1],\n  [169, 22, 1],\n  [167, 20, 1],\n  [164, 19, 1],\n  [161, 18, 1],\n  [158, 16, 1],\n  [155, 15, 1],\n  [152, 14, 1],\n  [149, 13, 1],\n  [146, 11, 1],\n  [142, 10, 1],\n  [139, 9, 2],\n  [136, 8, 2],\n  [133, 7, 2],\n  [129, 6, 2],\n  [126, 5, 2],\n  [122, 4, 3],\n];\n\n/** @internal */\nexport const palettes = {\n  CET2s,\n  turbo,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const pieMock = [\n  { sitc1: '7', exportVal: 3110253391368 },\n  { sitc1: '3', exportVal: 1929578418424 },\n  { sitc1: '5', exportVal: 848173542536 },\n  { sitc1: '8', exportVal: 816837797016 },\n  { sitc1: '6', exportVal: 745168037744 },\n  { sitc1: '9', exportVal: 450507812880 },\n  { sitc1: '2', exportVal: 393895581328 },\n  { sitc1: '0', exportVal: 353335453296 },\n  { sitc1: '1', exportVal: 54461075800 },\n  { sitc1: '4', exportVal: 36006897720 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const sunburstMock = [\n  { sitc1: '7', dest: 'usa', exportVal: 553359100104 },\n  { sitc1: '7', dest: 'chn', exportVal: 392617281424 },\n  { sitc1: '3', dest: 'usa', exportVal: 324856796136 },\n  { sitc1: '7', dest: 'deu', exportVal: 253250650864 },\n  { sitc1: '8', dest: 'usa', exportVal: 226628559432 },\n  { sitc1: '7', dest: 'hkg', exportVal: 177490158520 },\n  { sitc1: '3', dest: 'jpn', exportVal: 177421375512 },\n  { sitc1: '2', dest: 'chn', exportVal: 173840557624 },\n  { sitc1: '3', dest: 'chn', exportVal: 167989572088 },\n  { sitc1: '7', dest: 'fra', exportVal: 135443006088 },\n  { sitc1: '6', dest: 'usa', exportVal: 129879187528 },\n  { sitc1: '5', dest: 'usa', exportVal: 127516647672 },\n  { sitc1: '7', dest: 'can', exportVal: 118114362152 },\n  { sitc1: '7', dest: 'gbr', exportVal: 117139481536 },\n  { sitc1: '3', dest: 'kor', exportVal: 108348223232 },\n  { sitc1: '7', dest: 'jpn', exportVal: 106979336520 },\n  { sitc1: '7', dest: 'mex', exportVal: 99444329328 },\n  { sitc1: '3', dest: 'ind', exportVal: 96948083624 },\n  { sitc1: '7', dest: 'sgp', exportVal: 92225795024 },\n  { sitc1: '5', dest: 'deu', exportVal: 90784113552 },\n  { sitc1: '5', dest: 'chn', exportVal: 90181681968 },\n  { sitc1: '3', dest: 'deu', exportVal: 88253653112 },\n  { sitc1: '7', dest: 'ita', exportVal: 81276009824 },\n  { sitc1: '6', dest: 'chn', exportVal: 79452389712 },\n  { sitc1: '7', dest: 'kor', exportVal: 78794233936 },\n  { sitc1: '3', dest: 'ita', exportVal: 78558945920 },\n  { sitc1: '3', dest: 'fra', exportVal: 74925032472 },\n  { sitc1: '9', dest: 'deu', exportVal: 73071171872 },\n  { sitc1: '5', dest: 'bel', exportVal: 70624508592 },\n  { sitc1: '8', dest: 'deu', exportVal: 70580844576 },\n  { sitc1: '7', dest: 'nld', exportVal: 68849046720 },\n  { sitc1: '6', dest: 'deu', exportVal: 67652211616 },\n  { sitc1: '3', dest: 'sgp', exportVal: 67210539248 },\n  { sitc1: '8', dest: 'chn', exportVal: 63708999648 },\n  { sitc1: '3', dest: 'nld', exportVal: 63266504120 },\n  { sitc1: '9', dest: 'usa', exportVal: 60516229752 },\n  { sitc1: '8', dest: 'jpn', exportVal: 56814537520 },\n  { sitc1: '3', dest: 'gbr', exportVal: 54869262576 },\n  { sitc1: '8', dest: 'hkg', exportVal: 53605517320 },\n  { sitc1: '5', dest: 'fra', exportVal: 52161793136 },\n  { sitc1: '7', dest: 'esp', exportVal: 50643986720 },\n  { sitc1: '7', dest: 'bel', exportVal: 49990475528 },\n  { sitc1: '7', dest: 'mys', exportVal: 49686542376 },\n  { sitc1: '9', dest: 'gbr', exportVal: 49592572344 },\n  { sitc1: '3', dest: 'esp', exportVal: 49335325064 },\n  { sitc1: '0', dest: 'usa', exportVal: 48357009888 },\n  { sitc1: '7', dest: 'rus', exportVal: 48165543208 },\n  { sitc1: '8', dest: 'gbr', exportVal: 47653225184 },\n  { sitc1: '3', dest: 'bel', exportVal: 47114307208 },\n  { sitc1: '8', dest: 'fra', exportVal: 45557265608 },\n  { sitc1: '9', dest: 'ind', exportVal: 41487417688 },\n  { sitc1: '5', dest: 'gbr', exportVal: 41404042128 },\n  { sitc1: '2', dest: 'jpn', exportVal: 41093852032 },\n  { sitc1: '7', dest: 'aus', exportVal: 40800311744 },\n  { sitc1: '7', dest: 'bra', exportVal: 38963332352 },\n  { sitc1: '5', dest: 'ita', exportVal: 38938981872 },\n  { sitc1: '7', dest: 'tha', exportVal: 37165468320 },\n  { sitc1: '5', dest: 'jpn', exportVal: 35950015760 },\n  { sitc1: '0', dest: 'jpn', exportVal: 34492545824 },\n  { sitc1: '3', dest: 'can', exportVal: 34474612000 },\n  { sitc1: '0', dest: 'deu', exportVal: 33477297584 },\n  { sitc1: '6', dest: 'kor', exportVal: 33305898944 },\n  { sitc1: '6', dest: 'jpn', exportVal: 32438828976 },\n  { sitc1: '6', dest: 'fra', exportVal: 31882703000 },\n  { sitc1: '6', dest: 'ind', exportVal: 31268977728 },\n  { sitc1: '6', dest: 'hkg', exportVal: 29394455800 },\n  { sitc1: '7', dest: 'pol', exportVal: 29081774000 },\n  { sitc1: '5', dest: 'can', exportVal: 28752002440 },\n  { sitc1: '7', dest: 'cze', exportVal: 28475442896 },\n  { sitc1: '8', dest: 'can', exportVal: 28272413784 },\n  { sitc1: '7', dest: 'are', exportVal: 27885234800 },\n  { sitc1: '7', dest: 'ind', exportVal: 27758142816 },\n  { sitc1: '6', dest: 'gbr', exportVal: 27633859680 },\n  { sitc1: '3', dest: 'tha', exportVal: 27233135240 },\n  { sitc1: '6', dest: 'can', exportVal: 26907257624 },\n  { sitc1: '7', dest: 'tur', exportVal: 25382715776 },\n  { sitc1: '5', dest: 'nld', exportVal: 25069805448 },\n  { sitc1: '7', dest: 'sau', exportVal: 24929023368 },\n  { sitc1: '6', dest: 'ita', exportVal: 24467435912 },\n  { sitc1: '6', dest: 'bel', exportVal: 24164232160 },\n  { sitc1: '5', dest: 'che', exportVal: 23923665600 },\n  { sitc1: '3', dest: 'bra', exportVal: 23917919768 },\n  { sitc1: '3', dest: 'idn', exportVal: 23793941504 },\n  { sitc1: '2', dest: 'deu', exportVal: 23489678712 },\n  { sitc1: '8', dest: 'ita', exportVal: 23095374432 },\n  { sitc1: '9', dest: 'nld', exportVal: 22850286888 },\n  { sitc1: '7', dest: 'aut', exportVal: 22375876440 },\n  { sitc1: '3', dest: 'tur', exportVal: 22364831560 },\n  { sitc1: '7', dest: 'swe', exportVal: 22362348184 },\n  { sitc1: '7', dest: 'idn', exportVal: 22360516904 },\n  { sitc1: '7', dest: 'che', exportVal: 22029172056 },\n  { sitc1: '5', dest: 'esp', exportVal: 21845165664 },\n  { sitc1: '9', dest: 'chn', exportVal: 21310345576 },\n  { sitc1: '5', dest: 'kor', exportVal: 21172341776 },\n  { sitc1: '0', dest: 'gbr', exportVal: 21018713424 },\n  { sitc1: '8', dest: 'nld', exportVal: 20929434208 },\n  { sitc1: '6', dest: 'mex', exportVal: 20914470128 },\n  { sitc1: '3', dest: 'aus', exportVal: 20317805888 },\n  { sitc1: '2', dest: 'kor', exportVal: 20313758104 },\n  { sitc1: '3', dest: 'mex', exportVal: 20083955848 },\n  { sitc1: '0', dest: 'fra', exportVal: 19532719264 },\n  { sitc1: '7', dest: 'hun', exportVal: 19324152296 },\n  { sitc1: '8', dest: 'che', exportVal: 19322818728 },\n  { sitc1: '5', dest: 'mex', exportVal: 19022488904 },\n  { sitc1: '2', dest: 'usa', exportVal: 18018752920 },\n  { sitc1: '3', dest: 'ukr', exportVal: 17117857400 },\n  { sitc1: '3', dest: 'swe', exportVal: 17081304488 },\n  { sitc1: '8', dest: 'esp', exportVal: 16965769448 },\n  { sitc1: '9', dest: 'che', exportVal: 16908619328 },\n  { sitc1: '6', dest: 'are', exportVal: 16785511464 },\n  { sitc1: '8', dest: 'bel', exportVal: 16569534928 },\n  { sitc1: '8', dest: 'kor', exportVal: 16210034464 },\n  { sitc1: '8', dest: 'mex', exportVal: 16191125592 },\n  { sitc1: '3', dest: 'pol', exportVal: 15907941008 },\n  { sitc1: '0', dest: 'ita', exportVal: 15654747448 },\n  { sitc1: '0', dest: 'nld', exportVal: 15586950392 },\n  { sitc1: '9', dest: 'are', exportVal: 15404570344 },\n  { sitc1: '7', dest: 'phl', exportVal: 15383624208 },\n  { sitc1: '6', dest: 'tha', exportVal: 15148414408 },\n  { sitc1: '5', dest: 'ind', exportVal: 14162411288 },\n  { sitc1: '5', dest: 'bra', exportVal: 14050466400 },\n  { sitc1: '1', dest: 'usa', exportVal: 13823693464 },\n  { sitc1: '9', dest: 'can', exportVal: 13644993280 },\n  { sitc1: '5', dest: 'rus', exportVal: 13476578168 },\n  { sitc1: '3', dest: 'mys', exportVal: 13228401584 },\n  { sitc1: '6', dest: 'nld', exportVal: 13094123616 },\n  { sitc1: '0', dest: 'can', exportVal: 13013471312 },\n  { sitc1: '3', dest: 'hkg', exportVal: 12879879616 },\n  { sitc1: '3', dest: 'zaf', exportVal: 12803323896 },\n  { sitc1: '0', dest: 'chn', exportVal: 12775895680 },\n  { sitc1: '7', dest: 'arg', exportVal: 12686127312 },\n  { sitc1: '9', dest: 'tur', exportVal: 12520989584 },\n  { sitc1: '3', dest: 'che', exportVal: 12243582232 },\n  { sitc1: '3', dest: 'grc', exportVal: 11976563768 },\n  { sitc1: '7', dest: 'lbr', exportVal: 11587009744 },\n  { sitc1: '0', dest: 'bel', exportVal: 11092939192 },\n  { sitc1: '7', dest: 'svk', exportVal: 11063197832 },\n  { sitc1: '3', dest: 'blr', exportVal: 10893808304 },\n  { sitc1: '7', dest: 'nor', exportVal: 10739879720 },\n  { sitc1: '0', dest: 'rus', exportVal: 10581033656 },\n  { sitc1: '3', dest: 'aut', exportVal: 10463844120 },\n  { sitc1: '6', dest: 'che', exportVal: 10426999544 },\n  { sitc1: '9', dest: 'sgp', exportVal: 10338784808 },\n  { sitc1: '8', dest: 'aus', exportVal: 10297853920 },\n  { sitc1: '3', dest: 'fin', exportVal: 10297129144 },\n  { sitc1: '8', dest: 'rus', exportVal: 10219614352 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport seedrandom from 'seedrandom';\n\nimport { DataGenerator, RandomNumberGenerator } from '../utils/data_generators/data_generator';\n\n/**\n * Forces object to be partial type for mocking tests\n *\n * SHOULD NOT BE USED OUTSIDE OF TESTS!!!\n *\n * @param obj partial object type\n * @internal\n */\nexport const forcedType = <T extends Record<string, unknown>>(obj: Partial<T>): T => obj as T;\n\n/**\n * Returns rng seed from `process.env`\n * @internal\n */\nexport const getRNGSeed = (fallback?: string): string | undefined =>\n  process.env.RNG_SEED ?? (process.env.VRT === 'true' ? 'elastic-charts' : fallback);\n\n/**\n * Returns rng function with optional `min`, `max` and `fractionDigits` params\n *\n * @param string seed for deterministic algorithm\n * @internal\n */\nexport const getRandomNumberGenerator = (seed = getRNGSeed()): RandomNumberGenerator => {\n  const rng = seedrandom(seed);\n\n  /**\n   * Random number generator\n   *\n   * @param  {} min=0\n   * @param  {} max=1\n   * @param  {} fractionDigits=0\n   */\n  return function randomNumberGenerator(min = 0, max = 1, fractionDigits = 0, inclusive = true) {\n    const precision = Math.pow(10, Math.max(fractionDigits, 0));\n    const scaledMax = max * precision;\n    const scaledMin = min * precision;\n    const offset = inclusive ? 1 : 0;\n    const num = Math.floor(rng() * (scaledMax - scaledMin + offset)) + scaledMin;\n\n    return num / precision;\n  };\n};\n\n/** @internal */\nexport class SeededDataGenerator extends DataGenerator {\n  constructor(frequency = 500, seed?: string) {\n    super(frequency, getRandomNumberGenerator(seed));\n  }\n}\n\n/**\n * Returns random array or object value\n * @internal\n */\nexport const getRandomEntryFn = (seed = getRNGSeed()) => {\n  const rng = seedrandom(seed);\n\n  return function getRandomEntryClosure<T>(entries: T[] | Record<string, T>) {\n    if (Array.isArray(entries)) {\n      const index = Math.floor(rng() * entries.length);\n\n      return entries[index];\n    }\n\n    const keys = Object.keys(entries);\n    const index = Math.floor(rng() * keys.length);\n    const key = keys[index]!;\n\n    return entries[key];\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../common/colors';\nimport { Rect } from '../../geoms/types';\nimport { ClippedRanges } from '../../utils/geometry';\n\n/** @internal */\nexport type CanvasRenderer<R = void> = (ctx: CanvasRenderingContext2D) => R;\n\n/**\n * withContext abstracts out the otherwise error-prone save/restore pairing; it can be nested and/or put into sequence\n * The idea is that you just set what's needed for the enclosed snippet, which may temporarily override values in the\n * outer withContext. Example: we use a +y = top convention, so when doing text rendering, y has to be flipped (ctx.scale)\n * otherwise the text will render upside down.\n * @param ctx\n * @param fun\n * @internal\n */\nexport function withContext<R = void>(ctx: CanvasRenderingContext2D, fun: CanvasRenderer<R>): R {\n  ctx.save();\n  const r = fun(ctx);\n  ctx.restore();\n  return r;\n}\n\n/** @internal */\nexport function clearCanvas(ctx: CanvasRenderingContext2D, bgColor: Color) {\n  withContext(ctx, () => {\n    ctx.setTransform(1, 0, 0, 1, 0, 0);\n    // with transparent background, clearRect is required\n    ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n    ctx.fillStyle = bgColor;\n    // filling with the background color is required to have a precise text color contrast calculation\n    ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n  });\n}\n\n// order of rendering is important; determined by the order of layers in the array\n/** @internal */\nexport function renderLayers(ctx: CanvasRenderingContext2D, layers: Array<CanvasRenderer>) {\n  layers.forEach((renderLayer) => renderLayer(ctx));\n}\n\n/** @internal */\nexport function withClip(ctx: CanvasRenderingContext2D, clippings: Rect, fun: CanvasRenderer, shouldClip = true) {\n  withContext(ctx, () => {\n    if (shouldClip) {\n      const { x, y, width, height } = clippings;\n      ctx.beginPath();\n      ctx.rect(x, y, width, height);\n      ctx.clip();\n    }\n    withContext(ctx, () => fun(ctx));\n  });\n}\n\n/**\n * Create clip from a set of clipped ranges\n * @internal\n */\nexport function withClipRanges(\n  ctx: CanvasRenderingContext2D,\n  clippedRanges: ClippedRanges,\n  { width, height, y }: Rect,\n  negate: boolean,\n  fun: CanvasRenderer,\n) {\n  withContext(ctx, () => {\n    if (clippedRanges.length > 0) {\n      ctx.beginPath();\n      if (negate) {\n        clippedRanges.forEach(([x0, x1]) => ctx.rect(x0, y, x1 - x0, height));\n      } else {\n        const firstX = clippedRanges[0]?.[0] ?? NaN;\n        const lastX = clippedRanges.at(-1)?.[1] ?? NaN;\n        ctx.rect(0, -0.5, firstX, height);\n        ctx.rect(lastX, y, width - lastX, height);\n        clippedRanges.forEach(([, x0], i) => {\n          if (i < clippedRanges.length - 1) {\n            ctx.rect(x0, y, (clippedRanges[i + 1]?.[0] ?? NaN) - x0, height);\n          }\n        });\n      }\n      ctx.clip();\n    }\n    fun(ctx);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/**\n * The scale type\n * @public\n */\nexport const ScaleType = Object.freeze({\n  /**\n   * Treated as linear scale with ticks in base 2\n   */\n  LinearBinary: 'linear_binary' as const,\n  Linear: 'linear' as const,\n  Ordinal: 'ordinal' as const,\n  Log: 'log' as const,\n  Sqrt: 'sqrt' as const,\n  Time: 'time' as const,\n  Quantize: 'quantize' as const,\n  Quantile: 'quantile' as const,\n  Threshold: 'threshold' as const,\n});\n\n/**\n * The scale type\n * @public\n */\nexport type ScaleType = $Values<typeof ScaleType>;\n\n/** @internal */\nexport const LOG_MIN_ABS_DOMAIN = 1;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleType } from './constants';\n\n/** @public */\nexport type ScaleContinuousType =\n  | typeof ScaleType.LinearBinary\n  | typeof ScaleType.Linear\n  | typeof ScaleType.Time\n  | typeof ScaleType.Log\n  | typeof ScaleType.Sqrt;\n\n/** @public */\nexport type ScaleOrdinalType = typeof ScaleType.Ordinal;\n\n/** @public */\nexport type ScaleBandType = ScaleOrdinalType;\n\n/** @internal */\nexport { ScaleBand } from './scale_band';\n\n/** @internal */\nexport { ScaleContinuous } from './scale_continuous';\n\nexport { LogScaleOptions } from './types';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { scaleBand, scaleQuantize } from 'd3-scale';\n\nimport { ScaleBandType } from '.';\nimport { ScaleType } from './constants';\nimport { Ratio } from '../common/geometry';\nimport { RelativeBandsPadding } from '../specs';\nimport { clamp } from '../utils/common';\nimport { Range } from '../utils/domain';\n\n/**\n * Categorical scale\n * @internal\n */\nexport class ScaleBand {\n  readonly bandwidth: number;\n  readonly bandwidthPadding: number;\n  readonly step: number;\n  readonly outerPadding: number;\n  readonly innerPadding: number;\n  readonly originalBandwidth: number;\n  readonly type: ScaleBandType;\n  readonly domain: (string | number)[];\n  readonly range: [number, number];\n  readonly barsPadding: number;\n  readonly minInterval: number;\n  readonly unit?: string;\n\n  private readonly project: (d: string | number) => number;\n  private readonly inverseProject: (d: number) => string | number | undefined;\n\n  constructor(\n    inputDomain: (string | number)[],\n    range: Range,\n    overrideBandwidth?: number,\n    /**\n     * The proportion of the range that is reserved for blank space between bands\n     * A number between 0 and 1.\n     * @defaultValue 0\n     */\n    barsPadding: Ratio | RelativeBandsPadding = 0,\n  ) {\n    const isObjectPad = typeof barsPadding === 'object';\n    const safeBarPadding = isObjectPad ? 0 : clamp(barsPadding, 0, 1);\n    this.type = ScaleType.Ordinal;\n    const d3Scale = scaleBand<string | number>()\n      .domain(inputDomain.length > 0 ? inputDomain : [undefined as unknown as string | number]) // TODO fix this trick\n      .range(range)\n      .paddingInner(isObjectPad ? barsPadding.inner : safeBarPadding)\n      .paddingOuter(isObjectPad ? barsPadding.outer : safeBarPadding / 2);\n    this.barsPadding = isObjectPad ? barsPadding.inner : safeBarPadding;\n    this.outerPadding = d3Scale.paddingOuter();\n    this.innerPadding = d3Scale.paddingInner();\n    this.bandwidth = overrideBandwidth ? overrideBandwidth * (1 - safeBarPadding) : d3Scale.bandwidth() || 0;\n    this.originalBandwidth = d3Scale.bandwidth() || 0;\n    this.step = d3Scale.step();\n    this.domain = (inputDomain.length > 0 ? [...new Set(inputDomain)] : [undefined]) as (string | number)[];\n    this.range = [range[0], range[1]];\n    this.bandwidthPadding = this.bandwidth;\n    const invertedScale = scaleQuantize<string | number, undefined>()\n      .domain(range)\n      .range(inputDomain.length > 0 ? [...new Set(inputDomain)] : [undefined as unknown as string | number]);\n\n    this.minInterval = 0; // FIXED doesn't exist in reality\n    this.project = (d) => d3Scale(d) ?? NaN;\n    this.inverseProject = (d) => invertedScale(d);\n  }\n\n  scale(value: string | number): number {\n    return this.project(value);\n  }\n\n  // TODO this can be removed, it is there just to simplify the code with the continuous scale\n  pureScale(value: string | number) {\n    return this.scale(value);\n  }\n\n  ticks(): (string | number)[] {\n    return this.domain;\n  }\n\n  invert(value: number): string | number | undefined {\n    return this.inverseProject(value);\n  }\n\n  invertWithStep(value: number): {\n    withinBandwidth: boolean;\n    value: string | number | undefined;\n  } {\n    return {\n      withinBandwidth: true,\n      value: this.inverseProject(value),\n    };\n  }\n\n  isSingleValue() {\n    return this.domain.length < 2;\n  }\n\n  isValueInDomain(value: string | number) {\n    return this.domain.includes(value);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { bisectLeft } from 'd3-array';\nimport {\n  ScaleContinuousNumeric,\n  ScaleLinear,\n  scaleLinear,\n  scaleLog,\n  ScaleLogarithmic,\n  ScalePower,\n  scaleSqrt,\n  scaleUtc,\n  ScaleTime,\n} from 'd3-scale';\nimport { Required } from 'utility-types';\n\nimport { ScaleContinuousType } from '.';\nimport { LOG_MIN_ABS_DOMAIN, ScaleType } from './constants';\nimport { LogScaleOptions } from './types';\nimport { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { getLinearTicks, getNiceLinearTicks } from '../chart_types/xy_chart/utils/get_linear_ticks';\nimport { screenspaceMarkerScaleCompressor } from '../solvers/screenspace_marker_scale_compressor';\nimport { clamp, isDefined, isFiniteNumber, mergePartial, round } from '../utils/common';\nimport { getMomentWithTz } from '../utils/data/date_time';\nimport { ContinuousDomain, Range } from '../utils/domain';\n\ntype ContinuousScaleType =\n  | typeof ScaleType.Time\n  | typeof ScaleType.Linear\n  | typeof ScaleType.Log\n  | typeof ScaleType.Sqrt;\n\nconst SCALES: Record<\n  ContinuousScaleType,\n  () => ScaleContinuousNumeric<number, number, undefined> | ScaleTime<number, number, undefined>\n> = {\n  [ScaleType.Linear]: scaleLinear,\n  [ScaleType.Log]: scaleLog,\n  [ScaleType.Sqrt]: scaleSqrt,\n  [ScaleType.Time]: scaleUtc,\n};\n\nconst defaultScaleOptions: ScaleOptions = {\n  bandwidth: 0,\n  minInterval: 0,\n  timeZone: 'local',\n  totalBarsInCluster: 1,\n  barsPadding: 0,\n  constrainDomainPadding: true,\n  domainPixelPadding: 0,\n  desiredTickCount: 10,\n  isSingleValueHistogram: false,\n  maximumFractionDigits: undefined,\n  logBase: 10,\n  logMinLimit: NaN, // NaN preserves the replaced `undefined` semantics\n  linearBase: 10,\n};\n\nconst isUnitRange = ([r1, r2]: Range) => r1 === 0 && r2 === 1;\n\n/** @internal */\nexport class ScaleContinuous {\n  readonly bandwidth: number;\n  readonly totalBarsInCluster: number;\n  readonly bandwidthPadding: number;\n  readonly minInterval: number;\n  readonly step: number;\n  readonly type: ScaleContinuousType;\n  readonly domain: [number, number];\n  readonly range: Range;\n  readonly isInverted: boolean;\n  readonly linearBase: number;\n  readonly tickValues: number[];\n  readonly timeZone: string;\n  readonly barsPadding: number;\n  readonly isSingleValueHistogram: boolean;\n  readonly unit?: string;\n  private readonly project: (d: number) => number;\n  private readonly inverseProject: (d: number) => number | Date;\n\n  constructor(\n    { type: scaleType = ScaleType.Linear, domain: inputDomain, range, nice = false }: ScaleData,\n    options?: Partial<ScaleOptions>,\n  ) {\n    const isBinary = scaleType === ScaleType.LinearBinary;\n    const type = isBinary ? ScaleType.Linear : scaleType;\n    const scaleOptions: ScaleOptions = mergePartial(defaultScaleOptions, options);\n\n    const min = inputDomain.reduce((p, n) => Math.min(p, n), Infinity);\n    const max = inputDomain.reduce((p, n) => Math.max(p, n), -Infinity);\n    const properLogScale = type === ScaleType.Log && min < max;\n    const dataDomain = properLogScale ? limitLogScaleDomain([min, max], scaleOptions.logMinLimit) : inputDomain;\n    const barsPadding = clamp(scaleOptions.barsPadding, 0, 1);\n    const isNice = nice && type !== ScaleType.Time;\n    const totalRange = Math.abs(range[1] - range[0]);\n    const pixelPadFits = 0 < scaleOptions.domainPixelPadding && scaleOptions.domainPixelPadding * 2 < totalRange;\n    const isPixelPadded = pixelPadFits && type !== ScaleType.Time && !isUnitRange(range);\n    const minInterval = Math.abs(scaleOptions.minInterval);\n    const bandwidth = scaleOptions.bandwidth * (1 - barsPadding);\n    const bandwidthPadding = scaleOptions.bandwidth * barsPadding;\n\n    this.barsPadding = barsPadding;\n    this.bandwidth = bandwidth;\n    this.bandwidthPadding = bandwidthPadding;\n    this.type = type;\n    this.range = range;\n    this.linearBase = isBinary ? 2 : scaleOptions.linearBase;\n    this.minInterval = minInterval;\n    this.step = bandwidth + barsPadding + bandwidthPadding;\n    this.timeZone = scaleOptions.timeZone;\n    this.isInverted = dataDomain[0] > dataDomain[1];\n    this.totalBarsInCluster = scaleOptions.totalBarsInCluster;\n    this.isSingleValueHistogram = scaleOptions.isSingleValueHistogram;\n\n    /** End of Domain  */\n\n    const d3Scale = SCALES[type]();\n    d3Scale.domain(dataDomain);\n    d3Scale.range(range);\n    if (properLogScale) (d3Scale as ScaleLogarithmic<PrimitiveValue, number>).base(scaleOptions.logBase);\n\n    /** Start of Projection (desiredTickCount and screenspace dependent part) */\n\n    if (isNice) {\n      if (type === ScaleType.Linear) {\n        getNiceLinearTicks(\n          d3Scale as ScaleContinuousNumeric<PrimitiveValue, number>,\n          scaleOptions.desiredTickCount,\n          this.linearBase,\n        );\n      } else {\n        (d3Scale as ScaleContinuousNumeric<PrimitiveValue, number>)\n          .domain(dataDomain)\n          .nice(scaleOptions.desiredTickCount);\n      }\n    }\n\n    const niceDomain = isNice ? (d3Scale.domain() as [number, number]) : dataDomain;\n\n    const paddedDomain = isPixelPadded\n      ? getPixelPaddedDomain(\n          totalRange,\n          niceDomain,\n          scaleOptions.domainPixelPadding,\n          scaleOptions.constrainDomainPadding,\n        )\n      : niceDomain;\n\n    d3Scale.domain(paddedDomain); // only need to do this if isPixelPadded is true, but hey\n    if (isPixelPadded && isNice)\n      (d3Scale as ScaleContinuousNumeric<PrimitiveValue, number>).nice(scaleOptions.desiredTickCount);\n\n    const nicePaddedDomain = isPixelPadded && isNice ? (d3Scale.domain() as [number, number]) : paddedDomain;\n\n    this.tickValues =\n      type === ScaleType.Time\n        ? getTimeTicks(\n            nicePaddedDomain,\n            scaleOptions.desiredTickCount,\n            scaleOptions.timeZone,\n            scaleOptions.bandwidth === 0 ? 0 : scaleOptions.minInterval,\n          )\n        : (type === ScaleType.Linear\n            ? getLinearNonDenserTicks(\n                nicePaddedDomain,\n                scaleOptions.desiredTickCount,\n                this.linearBase,\n                scaleOptions.bandwidth === 0 ? 0 : scaleOptions.minInterval,\n              )\n            : (d3Scale as D3ScaleNonTime).ticks(scaleOptions.desiredTickCount)\n          ).filter(\n            scaleOptions.maximumFractionDigits === undefined\n              ? () => true\n              : (n) => round(n, scaleOptions.maximumFractionDigits) === n,\n          );\n\n    this.domain = nicePaddedDomain;\n    // Returning NaN means that the value is projectable/invertible within the domain or range\n    this.project = (d: number) => d3Scale(d) ?? NaN;\n    this.inverseProject = (d: number) => d3Scale.invert(d) ?? NaN;\n  }\n\n  scale(value?: PrimitiveValue): number {\n    return typeof value === 'number'\n      ? this.project(value) + (this.bandwidthPadding / 2) * this.totalBarsInCluster\n      : NaN;\n  }\n\n  pureScale(value?: PrimitiveValue): number {\n    return typeof value === 'number' ? this.project(this.bandwidth === 0 ? value : value + this.minInterval / 2) : NaN;\n  }\n\n  ticks(): number[] {\n    return this.tickValues;\n  }\n\n  invert(value: number): number {\n    const invertedValue = this.inverseProject(value);\n    return this.type === ScaleType.Time\n      ? getMomentWithTz(invertedValue, this.timeZone).valueOf()\n      : Number(invertedValue);\n  }\n\n  invertWithStep(\n    value: number,\n    data: number[],\n  ): {\n    withinBandwidth: boolean;\n    value: number;\n  } {\n    if (data.length === 0) {\n      return { withinBandwidth: false, value: NaN };\n    }\n    const invertedValue = this.invert(value);\n    const bisectValue = this.bandwidth === 0 ? invertedValue + this.minInterval / 2 : invertedValue;\n    const leftIndex = bisectLeft(data, bisectValue);\n\n    if (leftIndex === 0) {\n      const [dataValue = NaN] = data;\n      const withinBandwidth = invertedValue >= dataValue;\n      return {\n        withinBandwidth,\n        value:\n          dataValue +\n          (withinBandwidth ? 0 : -this.minInterval * Math.ceil((dataValue - invertedValue) / this.minInterval)),\n      };\n    }\n    const currentValue = data[leftIndex - 1] ?? NaN;\n    // pure linear scale\n    if (this.bandwidth === 0) {\n      const nextValue = data[leftIndex] ?? NaN;\n      const nextDiff = Math.abs(nextValue - invertedValue);\n      const prevDiff = Math.abs(invertedValue - currentValue);\n      return {\n        withinBandwidth: true,\n        value: nextDiff <= prevDiff ? nextValue : currentValue,\n      };\n    }\n    const withinBandwidth = invertedValue - currentValue <= this.minInterval;\n    return {\n      withinBandwidth,\n      value:\n        currentValue +\n        (withinBandwidth ? 0 : this.minInterval * Math.floor((invertedValue - currentValue) / this.minInterval)),\n    };\n  }\n\n  private isDegenerateDomain(): boolean {\n    return this.domain.every((v) => v === this.domain[0]);\n  }\n\n  isSingleValue(): boolean {\n    return this.isSingleValueHistogram || this.isDegenerateDomain();\n  }\n\n  isValueInDomain(value: unknown): boolean {\n    const [start = NaN, end = NaN] = this.domain;\n    return isFiniteNumber(value) && start <= value && value <= end;\n  }\n}\n\nfunction getTimeTicks(domain: [number, number], desiredTickCount: number, timeZone: string, minInterval: number) {\n  const [start, end] = domain;\n  const startDomain = getMomentWithTz(start, timeZone);\n  const endDomain = getMomentWithTz(end, timeZone);\n  const offset = startDomain.utcOffset();\n  const shiftedDomainMin = startDomain.add(offset, 'minutes').valueOf();\n  const shiftedDomainMax = endDomain.add(offset, 'minutes').valueOf();\n  const tzShiftedScale = scaleUtc().domain([shiftedDomainMin, shiftedDomainMax]);\n  let currentCount = desiredTickCount;\n  let rawTicks = tzShiftedScale.ticks(desiredTickCount);\n  while (\n    rawTicks.length > 2 &&\n    currentCount > 0 &&\n    isDefined(rawTicks[0]) &&\n    isDefined(rawTicks[1]) &&\n    rawTicks[1].valueOf() - rawTicks[0].valueOf() < minInterval\n  ) {\n    currentCount--;\n    rawTicks = tzShiftedScale.ticks(currentCount);\n  }\n\n  const timePerTick = (shiftedDomainMax - shiftedDomainMin) / rawTicks.length;\n  const hasHourTicks = timePerTick < 1000 * 60 * 60 * 12;\n  return rawTicks.map((d: Date) => {\n    const currentDateTime = getMomentWithTz(d, timeZone);\n    const currentOffset = hasHourTicks ? offset : currentDateTime.utcOffset();\n    return currentDateTime.subtract(currentOffset, 'minutes').valueOf();\n  });\n}\n\nfunction getLinearNonDenserTicks(\n  domain: [number, number],\n  desiredTickCount: number,\n  base: number,\n  minInterval: number,\n): number[] {\n  const [start, stop] = domain;\n  let currentCount = desiredTickCount;\n  let ticks = getLinearTicks(start, stop, desiredTickCount, base);\n  while (\n    ticks.length > 2 &&\n    currentCount > 0 &&\n    isDefined(ticks[0]) &&\n    isDefined(ticks[1]) &&\n    ticks[1] - ticks[0] < minInterval\n  ) {\n    currentCount--;\n    ticks = getLinearTicks(start, stop, currentCount, base);\n  }\n  return ticks;\n}\n\n/** @internal */\nexport function limitLogScaleDomain([min, max]: ContinuousDomain, logMinLimit: number): [min: number, max: number] {\n  // todo further simplify this\n  const absLimit = Math.abs(logMinLimit);\n  const fallback = absLimit || LOG_MIN_ABS_DOMAIN;\n  if (absLimit > 0 && min > 0 && min < absLimit) return max > absLimit ? [absLimit, max] : [absLimit, absLimit];\n  if (absLimit > 0 && max < 0 && max > -absLimit) return min < -absLimit ? [min, -absLimit] : [-absLimit, -absLimit];\n  if (min === 0) return max > 0 ? [fallback, max] : max < 0 ? [-fallback, max] : [fallback, fallback];\n  if (max === 0) return min > 0 ? [min, fallback] : min < 0 ? [min, -fallback] : [fallback, fallback];\n  if (min < 0 && max > 0) return Math.abs(max) >= Math.abs(min) ? [fallback, max] : [min, -fallback];\n  if (min > 0 && max < 0) return Math.abs(min) >= Math.abs(max) ? [min, fallback] : [-fallback, max];\n  return [min, max];\n}\n\nfunction getPixelPaddedDomain(\n  chartHeight: number,\n  domain: [number, number],\n  desiredPixelPadding: number,\n  constrainDomainPadding?: boolean,\n  intercept = 0,\n): [number, number] {\n  const inverted = domain[1] < domain[0];\n  const orderedDomain: [number, number] = inverted ? [domain[1], domain[0]] : domain;\n  const { scaleMultiplier } = screenspaceMarkerScaleCompressor(\n    orderedDomain,\n    [\n      [desiredPixelPadding, desiredPixelPadding],\n      [desiredPixelPadding, desiredPixelPadding],\n    ],\n    chartHeight,\n  );\n  const baselinePaddedDomainLo = orderedDomain[0] - desiredPixelPadding / scaleMultiplier;\n  const baselinePaddedDomainHigh = orderedDomain[1] + desiredPixelPadding / scaleMultiplier;\n  const crossBelow = constrainDomainPadding && baselinePaddedDomainLo < intercept && orderedDomain[0] >= intercept;\n  const crossAbove = constrainDomainPadding && baselinePaddedDomainHigh > 0 && orderedDomain[1] <= 0;\n  const paddedDomainLo = crossBelow\n    ? intercept\n    : crossAbove\n      ? orderedDomain[0] -\n        desiredPixelPadding /\n          screenspaceMarkerScaleCompressor(\n            [orderedDomain[0], intercept],\n            [\n              [desiredPixelPadding, desiredPixelPadding],\n              [0, 0],\n            ],\n            chartHeight,\n          ).scaleMultiplier\n      : baselinePaddedDomainLo;\n  const paddedDomainHigh = crossBelow\n    ? orderedDomain[1] +\n      desiredPixelPadding /\n        screenspaceMarkerScaleCompressor(\n          [intercept, orderedDomain[1]],\n          [\n            [0, 0],\n            [desiredPixelPadding, desiredPixelPadding],\n          ],\n          chartHeight,\n        ).scaleMultiplier\n    : crossAbove\n      ? intercept\n      : baselinePaddedDomainHigh;\n\n  return inverted ? [paddedDomainHigh, paddedDomainLo] : [paddedDomainLo, paddedDomainHigh];\n}\n\n/**\n * d3 scales excluding time scale\n */\ntype D3ScaleNonTime<R = PrimitiveValue, O = number> = ScaleLinear<R, O> | ScaleLogarithmic<R, O> | ScalePower<R, O>;\n\n/**\n * All possible d3 scales\n * @internal\n */\n\nexport interface ScaleData {\n  /** The Type of continuous scale */\n  type: ScaleContinuousType;\n  /** The data input domain */\n  domain: [number, number];\n  /** The data output range */\n  range: Range;\n  nice?: boolean;\n}\n\ntype ScaleOptions = Required<LogScaleOptions, 'logBase'> & {\n  /**\n   * The desired bandwidth for a linear band scale.\n   * @defaultValue 0\n   */\n  bandwidth: number;\n  /**\n   * The min interval computed on the XDomain. Not available for yDomains.\n   * @defaultValue 0\n   */\n  minInterval: number;\n  /**\n   * A time zone identifier. Can be any IANA zone supported by he host environment,\n   * or a fixed-offset name of the form 'utc+3', or the strings 'local' or 'utc'.\n   * @defaultValue `local`\n   */\n  timeZone: string;\n  /**\n   * The number of bars in the cluster. Used to correctly compute scales when\n   * using padding between bars.\n   * @defaultValue 1\n   */\n  totalBarsInCluster: number;\n  /**\n   * The proportion of the range that is reserved for blank space between bands\n   * A number between 0 and 1.\n   * @defaultValue 0\n   */\n  barsPadding: number;\n  /**\n   * Pixel value to extend the domain. Applied __before__ nicing.\n   *\n   * Does not apply to time scales\n   * @defaultValue 0\n   */\n  domainPixelPadding: number;\n  /**\n   * Constrains domain pixel padding to the zero baseline\n   * Does not apply to time scales\n   */\n  constrainDomainPadding?: boolean;\n  /**\n   * The approximated number of ticks.\n   * @defaultValue 10\n   */\n  desiredTickCount: number;\n  /**\n   * true if the scale was adjusted to fit one single value histogram\n   */\n  isSingleValueHistogram: boolean;\n  /**\n   * Max fractional digit to limit precision of number ticks\n   */\n  maximumFractionDigits?: number;\n  /**\n   * As log(0) = -Infinite, a log scale domain must be strictly-positive\n   * or strictly-negative; the domain must not include or cross zero value.\n   * We need to limit the domain scale to the right value on all possible cases.\n   */\n  logMinLimit: number;\n  /**\n   * scale base used to determine ticks in linear scales\n   * @defaultValue 10\n   */\n  linearBase: number;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleType } from './constants';\nimport { ScaleBand } from './scale_band';\nimport { ScaleContinuous } from './scale_continuous';\n\n/**\n * Check if a scale is logaritmic\n * @internal\n */\nexport function isLogarithmicScale(scale: ScaleContinuous) {\n  return scale.type === ScaleType.Log;\n}\n\n/**\n * Check if a scale is Band\n * @internal\n */\nexport function isBandScale(scale: ScaleContinuous | ScaleBand): scale is ScaleBand {\n  return scale.type === ScaleType.Ordinal;\n}\n\n/**\n * Check if a scale is continuous\n * @internal\n */\nexport function isContinuousScale(scale: ScaleContinuous | ScaleBand): scale is ScaleContinuous {\n  return scale.type !== ScaleType.Ordinal;\n}\n\n/**\n * Options specific to log scales\n * @public\n */\nexport interface LogScaleOptions {\n  /**\n   * Min value to render on log scale\n   *\n   * Defaults to min value of domain, or LOG_MIN_ABS_DOMAIN if mixed polarity\n   */\n  logMinLimit?: number;\n  /**\n   * Base for log scale\n   *\n   * @defaultValue 10\n   * (i.e. log base 10)\n   */\n  logBase?: number;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function integerSnap(n: number) {\n  return Math.floor(n);\n}\n\ntype NumberMap = (n: number) => number;\n\n/**\n * `monotonicHillClimb` attempts to return a variable value that's associated with the highest valued response (as returned by invoking `getResponse`\n * with said variable) yet still within the bounds for that response value, ie. constrained to smaller than or equal `responseUpperConstraint`.\n * `minVar` and `maxVar` represent a closed interval constraint on the variable itself.\n * `domainSnap` is useful if all real values in the range can't be assumed by the variable; typically, if the variable is integer only,\n * such as the number of characters, or avoiding fractional font sizes.\n * It is required that `getResponse` is a monotonic function over [minVar, maxVar], ie. a larger `n` value in this domain can't lead to\n * a smaller return value. However, as it's an internal function with known use cases, there's no runtime check to assert this.\n * Which is why the name expresses it prominently.\n */\n/** @internal */\nexport function monotonicHillClimb(\n  getResponse: NumberMap,\n  maxVar: number,\n  responseUpperConstraint: number,\n  domainSnap: NumberMap = (n: number) => n,\n  minVar: number = 0,\n) {\n  let loVar = domainSnap(minVar);\n  const loResponse = getResponse(loVar);\n  let hiVar = domainSnap(maxVar);\n  let hiResponse = getResponse(hiVar);\n\n  if (loResponse > responseUpperConstraint || loVar > hiVar) {\n    // bail if even the lowest value doesn't satisfy the constraint\n    return NaN;\n  }\n\n  if (hiResponse <= responseUpperConstraint) {\n    return hiVar; // early bail if maxVar is compliant\n  }\n\n  let pivotVar: number = NaN;\n  let pivotResponse: number = NaN;\n  let lastPivotResponse: number = NaN;\n  while (loVar < hiVar) {\n    const newPivotVar = (loVar + hiVar) / 2;\n    const newPivotResponse = getResponse(domainSnap(newPivotVar));\n    if (newPivotResponse === pivotResponse || newPivotResponse === lastPivotResponse) {\n      return domainSnap(loVar); // bail if we're good and not making further progress\n    }\n    pivotVar = newPivotVar;\n    lastPivotResponse = pivotResponse; // for prevention of bistable oscillation around discretization snap\n    pivotResponse = newPivotResponse;\n    const pivotIsCompliant = pivotResponse <= responseUpperConstraint;\n    if (pivotIsCompliant) {\n      loVar = pivotVar;\n    } else {\n      hiVar = pivotVar;\n      hiResponse = pivotResponse;\n    }\n  }\n  return domainSnap(pivotVar);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Cartesian, Pixels, Ratio } from '../common/geometry';\n\n/** @internal */\nexport type ArrayIndex = number;\n\n/** @internal */\nexport interface ScaleCompression {\n  bounds: ArrayIndex[];\n  scaleMultiplier: Ratio;\n}\n\n/**\n * A set of Cartesian positioned items with screenspace size (eg. axis tick labels, or scatterplot points) are represented as:\n *   - a column vector of Cartesian positions in the domain (can be any unit)\n *   - a column vector of screenspace size (eg. widths in pixels) which has the same number of elements\n * The available room in the same screenspace units (practically, pixels) is supplied.\n *\n * Returns the scale multiplier, as well as the index of the elements determining (compressing) the scale, if solvable.\n * If not solvable, it returns a non-finite number in `scaleMultiplier` and no indices in `bounds`.\n * @internal\n */\nexport const screenspaceMarkerScaleCompressor = (\n  domainPositions: Cartesian[],\n  itemWidths: Array<[Pixels, Pixels]>,\n  outerWidth: Pixels,\n): ScaleCompression => {\n  const result: ScaleCompression = { bounds: [], scaleMultiplier: Infinity };\n  const itemCount = Math.min(domainPositions.length, itemWidths.length);\n  for (let left = 0; left < itemCount; left++) {\n    for (let right = 0; right < itemCount; right++) {\n      const domainLeft = domainPositions[left] ?? NaN;\n      const domainRight = domainPositions[right] ?? NaN;\n      if (domainLeft > domainRight) continue; // must adhere to left <= right\n\n      const range = outerWidth - (itemWidths[left]?.[0] ?? NaN) - (itemWidths[right]?.[1] ?? NaN); // negative if not enough room\n      const domain = domainRight - domainLeft; // always non-negative and finite\n      const scaleMultiplier = range / domain; // may not be finite, and that's OK\n\n      if (scaleMultiplier < result.scaleMultiplier || Number.isNaN(scaleMultiplier)) {\n        result.bounds[0] = left;\n        result.bounds[1] = right;\n        result.scaleMultiplier = scaleMultiplier; // will persist a Number.finite() value for solvable pairs\n      }\n    }\n  }\n\n  return result;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { SettingsSpec } from './settings';\nimport { ChartType } from '../chart_types';\nimport { BOTTOM, CENTER, LEFT, MIDDLE, RIGHT, TOP } from '../common/constants';\nimport { buildSFProps } from '../state/spec_factory';\nimport { Position } from '../utils/common';\nimport { LIGHT_THEME } from '../utils/themes/light_theme';\n\n/** @public */\nexport const SpecType = Object.freeze({\n  Series: 'series' as const,\n  Axis: 'axis' as const,\n  Annotation: 'annotation' as const,\n  Settings: 'settings' as const,\n  Tooltip: 'tooltip' as const,\n  IndexOrder: 'index_order' as const,\n  SmallMultiples: 'small_multiples' as const,\n});\n/** @public */\nexport type SpecType = $Values<typeof SpecType>;\n\n/**\n * Type of bin aggregations\n * @public\n */\nexport const BinAgg = Object.freeze({\n  /**\n   * Order by sum of values in bin\n   */\n  Sum: 'sum' as const,\n  /**\n   * Order of values are used as is\n   */\n  None: 'none' as const,\n});\n/** @public */\nexport type BinAgg = $Values<typeof BinAgg>;\n\n/**\n * Direction of sorting\n * @public\n */\nexport const Direction = Object.freeze({\n  /**\n   * Least to greatest\n   */\n  Ascending: 'ascending' as const,\n  /**\n   * Greatest to least\n   */\n  Descending: 'descending' as const,\n});\n/** @public */\nexport type Direction = $Values<typeof Direction>;\n\n/** @public */\nexport const PointerEventType = Object.freeze({\n  Over: 'Over' as const,\n  Out: 'Out' as const,\n});\n/** @public */\nexport type PointerEventType = $Values<typeof PointerEventType>;\n\n/**\n * This enums provides the available tooltip types\n * @public\n */\nexport const TooltipType = Object.freeze({\n  /** Vertical cursor parallel to x axis */\n  VerticalCursor: 'vertical' as const,\n  /** Vertical and horizontal cursors */\n  Crosshairs: 'cross' as const,\n  /** Follow the mouse coordinates */\n  Follow: 'follow' as const,\n  /** Hide every tooltip */\n  None: 'none' as const,\n});\n/**\n * The TooltipType\n * @public\n */\nexport type TooltipType = $Values<typeof TooltipType>;\n\n/** @public */\nexport const BrushAxis = Object.freeze({\n  X: 'x' as const,\n  Y: 'y' as const,\n  Both: 'both' as const,\n});\n/** @public */\nexport type BrushAxis = $Values<typeof BrushAxis>;\n\n/**\n * pointer update trigger\n * @public\n */\nexport const PointerUpdateTrigger = Object.freeze({\n  X: 'x' as const,\n  Y: 'y' as const,\n  Both: 'both' as const,\n});\n/** @public */\nexport type PointerUpdateTrigger = $Values<typeof PointerUpdateTrigger>;\n\n/**\n * The position to stick the tooltip to\n * @public\n */\nexport const TooltipStickTo = Object.freeze({\n  Top: TOP,\n  Bottom: BOTTOM,\n  Middle: MIDDLE,\n  Left: LEFT,\n  Right: RIGHT,\n  Center: CENTER,\n  MousePosition: 'MousePosition' as const,\n});\n/** @public */\nexport type TooltipStickTo = $Values<typeof TooltipStickTo>;\n\n/**\n * Default legend config\n * @internal\n */\nexport const DEFAULT_LEGEND_CONFIG = {\n  showLegend: false,\n  legendSize: NaN,\n  showLegendExtra: false,\n  legendMaxDepth: Infinity,\n  legendPosition: Position.Right,\n  flatLegend: false,\n};\n\n/** @public */\nexport const settingsBuildProps = buildSFProps<SettingsSpec>()(\n  {\n    id: '__global__settings___' as const,\n    chartType: ChartType.Global,\n    specType: SpecType.Settings,\n  },\n  {\n    rendering: 'canvas' as const,\n    rotation: 0 as const,\n    animateData: true,\n    debug: false,\n    pointerUpdateTrigger: PointerUpdateTrigger.X,\n    externalPointerEvents: {\n      tooltip: {\n        visible: false,\n      },\n    },\n    baseTheme: LIGHT_THEME,\n    brushAxis: BrushAxis.X,\n    minBrushDelta: 2,\n    ariaUseDefaultSummary: true,\n    ariaLabelHeadingLevel: 'p',\n    allowBrushingLastHistogramBin: true,\n    pointBuffer: 10,\n    ...DEFAULT_LEGEND_CONFIG,\n    locale: 'en-US',\n  },\n);\n\n/** @public */\nexport const DEFAULT_SETTINGS_SPEC: SettingsSpec = {\n  ...settingsBuildProps.defaults,\n  ...settingsBuildProps.overrides,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { BaseDatum, Spec } from '.';\nimport { SpecType } from './constants';\nimport { ChartType } from '../chart_types';\nimport { Predicate } from '../common/predicate';\nimport { buildSFProps, SFProps, useSpecFactory } from '../state/spec_factory';\nimport { Datum, stripUndefined } from '../utils/common';\n\n/** @public */\nexport type GroupByAccessor<D extends BaseDatum = any> = (spec: Spec, datum: D) => string | number;\n/** @alpha */\nexport type GroupBySort = Predicate;\n\n/**\n * Title formatter that handles any value returned from the GroupByAccessor\n * @public\n */\nexport type GroupByFormatter<D extends BaseDatum = any> = (value: ReturnType<GroupByAccessor<D>>) => string;\n\n/** @alpha */\nexport interface GroupBySpec<D extends BaseDatum = any> extends Spec {\n  /**\n   * Function to return a unique value __by__ which to group the data\n   */\n  by: GroupByAccessor<D>;\n  /**\n   * Sort predicate used to sort grouped data\n   */\n  sort: GroupBySort;\n  /**\n   * Formatter used on all `by` values.\n   *\n   * Only for displayed values, not used in sorting or other internal computations.\n   */\n  format?: GroupByFormatter<D>;\n}\n\nconst buildProps = buildSFProps<GroupBySpec>()(\n  {\n    chartType: ChartType.Global,\n    specType: SpecType.IndexOrder,\n  },\n  {},\n);\n\n/**\n * Add GroupBy spec to chart\n * @public\n */\nexport const GroupBy = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    GroupBySpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<GroupBySpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type GroupByProps = ComponentProps<typeof GroupBy>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../chart_types';\n\n/** @public */\nexport interface Spec {\n  /** unique Spec identifier */\n  id: string;\n  /** Chart type define the type of chart that use this spec */\n  chartType: ChartType;\n  /** The type of spec, can be series, axis, annotation, settings etc */\n  specType: string;\n}\n\nexport * from './group_by';\nexport * from './small_multiples';\nexport * from './settings';\nexport * from './constants';\nexport * from './tooltip';\nexport * from '../chart_types/specs';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps, ComponentType, ReactChild } from 'react';\n\nimport { CustomXDomain, GroupByAccessor, Spec } from '.';\nimport { BinAgg, BrushAxis, Direction, PointerEventType, PointerUpdateTrigger, settingsBuildProps } from './constants';\nimport { Cell } from '../chart_types/heatmap/layout/types/viewmodel_types';\nimport { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { LegendStrategy } from '../chart_types/partition_chart/layout/utils/highlighted_geoms';\nimport { LineAnnotationDatum, RectAnnotationDatum, SeriesType } from '../chart_types/specs';\nimport { WordModel } from '../chart_types/wordcloud/layout/types/viewmodel_types';\nimport { XYChartSeriesIdentifier } from '../chart_types/xy_chart/utils/series';\nimport { CategoryLabel } from '../common/category';\nimport { Color } from '../common/colors';\nimport { SmallMultiplesDatum } from '../common/panel_utils';\nimport { SeriesIdentifier } from '../common/series_id';\nimport { TooltipPortalSettings } from '../components';\nimport { ScaleContinuousType, ScaleOrdinalType } from '../scales';\nimport { LegendPath } from '../state/actions/legend';\nimport { SFProps, useSpecFactory } from '../state/spec_factory';\nimport { PointerValue } from '../state/types';\nimport {\n  HorizontalAlignment,\n  LayoutDirection,\n  Position,\n  Rendering,\n  Rotation,\n  VerticalAlignment,\n  stripUndefined,\n} from '../utils/common';\nimport { Dimensions } from '../utils/dimensions';\nimport { GeometryValue } from '../utils/geometry';\nimport { GroupId, SpecId } from '../utils/ids';\nimport { SeriesCompareFn } from '../utils/series_sort';\nimport { PartialTheme, PointStyle, Theme } from '../utils/themes/theme';\n\n/** @public */\nexport interface LayerValue {\n  /**\n   * The category value as retrieved by the `groupByRollup` callback\n   */\n  groupByRollup: PrimitiveValue;\n  /**\n   * The small multiples `<GroupBy>` `by` accessor value, to specify which small multiples panel is interacted with\n   */\n  smAccessorValue: ReturnType<GroupByAccessor>;\n  /**\n   * Numerical value of the partition\n   */\n  value: number;\n  /**\n   * The position index of the sub-partition within its containing partition\n   */\n  sortIndex: number;\n  /**\n   * The depth of the partition in terms of the layered partition tree, where\n   * 0 is root (single, not visualized root of the partitioning tree),\n   * 1 is pie chart slices and innermost layer of sunburst, or 1st level treemap/flame/icicle breakdown\n   * 2 and above are increasingly outer layers\n   * maximum value is on the deepest leaf node\n   */\n  depth: number;\n  /**\n   * It contains the full path of the partition node, which is an array of `{index, value}` tuples\n   * where `index` corresponds to `sortIndex` and `value` corresponds `groupByRollup`\n   */\n  path: LegendPath;\n}\n\n/** @public */\nexport interface FlameLayerValue {\n  /**\n   * The zero-based index of the data point\n   */\n  vmIndex: number;\n}\n\n/** @public */\nexport interface GroupBrushExtent {\n  groupId: GroupId;\n  extent: [number, number];\n}\n\n/** @public */\nexport interface XYBrushEvent {\n  x?: [number, number];\n  y?: Array<GroupBrushExtent>;\n}\n\n/** @public */\nexport type XYChartElementEvent = [geometry: GeometryValue, seriesIdentifier: XYChartSeriesIdentifier];\n/** @public */\nexport type PartitionElementEvent = [layers: Array<LayerValue>, seriesIdentifier: SeriesIdentifier];\n/** @public */\nexport type FlameElementEvent = FlameLayerValue;\n/** @public */\nexport type HeatmapElementEvent = [cell: Cell, seriesIdentifier: SeriesIdentifier];\n/** @public */\nexport type WordCloudElementEvent = [model: WordModel, seriesIdentifier: SeriesIdentifier];\n\n/**\n * Describes a Metric element that is the subject of an interaction.\n * In particular, it reports the index of the metric within the two-dimensional data array\n * @public\n */\nexport type MetricElementEvent = {\n  type: 'metricElementEvent';\n  /* the row index of the metric in the data array: data[rowIndex][columIndex] */\n  rowIndex: number;\n  /* the column index of the metric in the data array: data[rowIndex][columIndex] */\n  columnIndex: number;\n};\n\n/**\n * A type-guard for MetricElementEvents\n * @public\n */\nexport function isMetricElementEvent(e: Parameters<ElementClickListener>[0][0]): e is MetricElementEvent {\n  return 'type' in e && e.type === 'metricElementEvent';\n}\n\n/**\n * An object that contains the scaled mouse position based on\n * the current chart configuration.\n * @public\n */\nexport type ProjectedValues = {\n  /**\n   * The independent variable of the chart\n   */\n  x: PrimitiveValue;\n  /**\n   * The set of dependent variable, each one with its own groupId\n   */\n  y: Array<{ value: PrimitiveValue; groupId: string }>;\n  /**\n   * The categorical value used for the vertical placement of the chart\n   * in a small multiple layout\n   */\n  smVerticalValue: PrimitiveValue;\n  /**\n   * The categorical value used for the horizontal placement of the chart\n   * in a small multiple layout\n   */\n  smHorizontalValue: PrimitiveValue;\n};\n\n/**\n * @public\n * The listener type for click on the projection area.\n */\nexport type ProjectionClickListener = (values: ProjectedValues) => void;\n\n/** @public */\nexport type ElementClickListener = (\n  elements: Array<\n    | XYChartElementEvent\n    | PartitionElementEvent\n    | FlameElementEvent\n    | HeatmapElementEvent\n    | WordCloudElementEvent\n    | MetricElementEvent\n  >,\n) => void;\n\n/** @public */\nexport type ElementOverListener = (\n  elements: Array<\n    | XYChartElementEvent\n    | PartitionElementEvent\n    | FlameElementEvent\n    | HeatmapElementEvent\n    | WordCloudElementEvent\n    | MetricElementEvent\n  >,\n) => void;\n\n/** @public */\nexport type BrushEvent = XYBrushEvent | HeatmapBrushEvent;\n\n/** @public */\nexport type BrushEndListener = (brushAreaEvent: BrushEvent) => void;\n\n/** @public */\nexport type ProjectionAreaChangeListener = (areas: { projection: Dimensions; parent: Dimensions }) => void;\n\n/** @public */\nexport interface HeatmapBrushEvent extends SmallMultiplesDatum {\n  cells: Cell[];\n  x: (string | number)[];\n  y: (string | number)[];\n}\n\n/** @public */\nexport type LegendItemListener = (series: SeriesIdentifier[]) => void;\n/**\n * The listener type for generic mouse move\n *\n * @public\n */\nexport type PointerUpdateListener = (event: PointerEvent) => void;\n/**\n * Listener to be called when chart resizes\n * @alpha\n */\nexport type ResizeListener = () => void;\n/**\n * Listener to be called when chart render state changes\n *\n * `isRendered` value is `true` when rendering is complete and `false` otherwise\n * @public\n */\nexport type RenderChangeListener = (isRendered: boolean) => void;\n/**\n * Listener to be called *before* chart renders\n * @public\n */\nexport type WillRenderListener = () => void;\n/** @public */\nexport type BasicListener = () => undefined | void;\n/** @public */\nexport type RectAnnotationEvent = { id: SpecId; datum: RectAnnotationDatum };\n/** @public */\nexport type LineAnnotationEvent = { id: SpecId; datum: LineAnnotationDatum<any> };\n/** @public */\nexport type AnnotationClickListener = (annotations: {\n  rects: RectAnnotationEvent[];\n  lines: LineAnnotationEvent[];\n}) => void;\n\n/** @public */\nexport interface BasePointerEvent {\n  chartId: string;\n  type: PointerEventType;\n}\n\n/**\n * Event used to synchronize pointers/mouse positions between Charts.\n *\n * fired as callback argument for `PointerUpdateListener`\n * @public\n */\nexport interface PointerOverEvent extends BasePointerEvent, ProjectedValues {\n  type: typeof PointerEventType.Over;\n  scale: ScaleContinuousType | ScaleOrdinalType;\n  /**\n   * Unit for event (i.e. `time`, `feet`, `count`, etc.) Not currently used/implemented\n   * @alpha\n   */\n  unit?: string;\n}\n\n/** @public */\nexport interface PointerOutEvent extends BasePointerEvent {\n  type: typeof PointerEventType.Out;\n}\n\n/** @public */\nexport type PointerEvent = PointerOverEvent | PointerOutEvent;\n\n/**\n * The settings for handling external events.\n * TODO consider moving this to Tooltip spec\n * @alpha\n */\nexport interface ExternalPointerEventsSettings {\n  /**\n   * Tooltip settings used for external events\n   */\n  tooltip: TooltipPortalSettings<'chart'> & {\n    /**\n     * `true` to show the tooltip when the chart receive an\n     * external pointer event, 'false' to hide the tooltip.\n     * @defaultValue `false`\n     */\n    visible?: boolean;\n  };\n}\n\n/**\n * Legend action component props\n *\n * @public\n */\nexport interface LegendActionProps {\n  /**\n   * Series identifiers for the given series\n   */\n  series: SeriesIdentifier[];\n  /**\n   * Resolved label/name of given series\n   */\n  label: string;\n  /**\n   * Resolved color of given series\n   */\n  color: string;\n}\n\n/**\n * Legend action component used to render actions next to legend items\n *\n * render slot is constrained to 20px x 16px\n *\n * @public\n */\nexport type LegendAction = ComponentType<LegendActionProps>;\n\n/** @public */\nexport interface LegendColorPickerProps {\n  /**\n   * Anchor used to position picker\n   */\n  anchor: HTMLElement;\n  /**\n   * Current color of the given series\n   */\n  color: Color;\n  /**\n   * Callback to close color picker and set persistent color\n   */\n  onClose: () => void;\n  /**\n   * Callback to update temporary color state\n   */\n  onChange: (color: Color | null) => void;\n  /**\n   * Series ids for the active series\n   */\n  seriesIdentifiers: SeriesIdentifier[];\n}\n\n/** @public */\nexport type LegendColorPicker = ComponentType<LegendColorPickerProps>;\n\n/**\n * Buffer between cursor and point to trigger interaction\n * @public\n */\nexport type MarkBuffer = number | ((radius: number) => number);\n\n/**\n * The legend position configuration.\n * @public\n */\nexport type LegendPositionConfig = {\n  /**\n   * The vertical alignment of the legend\n   */\n  vAlign: typeof VerticalAlignment.Top | typeof VerticalAlignment.Bottom; // TODO typeof VerticalAlignment.Middle\n  /**\n   * The horizontal alignment of the legend\n   */\n  hAlign: typeof HorizontalAlignment.Left | typeof HorizontalAlignment.Right; // TODO typeof HorizontalAlignment.Center\n  /**\n   * The direction of the legend items.\n   * `horizontal` shows all the items listed one a side the other horizontally, wrapping to new lines.\n   * `vertical` shows the items in a vertical list\n   */\n  direction: LayoutDirection;\n  /**\n   * Remove the legend from the outside chart area, making it floating above the chart.\n   * @defaultValue false\n   */\n  floating: boolean;\n  /**\n   * The number of columns in floating configuration\n   * @defaultValue 1\n   */\n  floatingColumns?: number;\n  // TODO add grow factor: fill, shrink, fixed column size\n};\n\n/**\n * The props for {@link CustomLegend}\n * @public\n */\nexport interface CustomLegendProps {\n  pointerValue?: PointerValue;\n  items: {\n    seriesIdentifiers: SeriesIdentifier[];\n    path: LegendPath;\n    color: Color;\n    label: CategoryLabel;\n    seriesType?: SeriesType;\n    pointStyle?: PointStyle;\n    extraValue?: { raw: PrimitiveValue; formatted: string };\n    isSeriesHidden?: boolean;\n    onItemOverActon: () => void;\n    onItemOutAction: () => void;\n    onItemClickAction: (negate: boolean) => void;\n  }[];\n}\n\n/**\n * The react component used to render a custom legend\n * @public\n */\nexport type CustomLegend = ComponentType<CustomLegendProps>;\n\n/**\n * The legend configuration\n * @public\n */\nexport interface LegendSpec {\n  /**\n   * Show the legend\n   * @defaultValue false\n   */\n  showLegend: boolean;\n  /**\n   * Set legend position\n   * @defaultValue Position.Right\n   */\n  legendPosition: Position | LegendPositionConfig;\n  /**\n   * Show an extra parameter on each legend item defined by the chart type\n   * @defaultValue `false`\n   */\n  showLegendExtra: boolean;\n  /**\n   * Limit the legend to the specified maximal depth when showing a hierarchical legend\n   *\n   * @remarks\n   * This is not the max depth, but the number of level shown: 0 none, 1 first, 2 up to the second etc.\n   * See https://github.com/elastic/elastic-charts/issues/1981 for details\n   */\n  legendMaxDepth: number;\n  /**\n   * Sets the exact legend width (vertical) or height (horizontal)\n   *\n   * Limited to max of 70% of the chart container dimension\n   * Vertical legends limited to min of 30% of computed width\n   */\n  legendSize: number;\n  /**\n   * Display the legend as a flat list.\n   * @defaultValue `false`\n   */\n  flatLegend?: boolean;\n  /**\n   * Choose a partition highlighting strategy for hovering over legend items.\n   * @defaultValue `LegendStrategy.Path`\n   */\n  legendStrategy?: LegendStrategy;\n  onLegendItemOver?: LegendItemListener;\n  onLegendItemOut?: BasicListener;\n  onLegendItemClick?: LegendItemListener;\n  onLegendItemPlusClick?: LegendItemListener;\n  onLegendItemMinusClick?: LegendItemListener;\n  /**\n   * Render slot to render action for legend\n   */\n  legendAction?: LegendAction;\n  legendColorPicker?: LegendColorPicker;\n  /**\n   * A SeriesSortFn to sort the legend values (top-bottom)\n   */\n  legendSort?: SeriesCompareFn;\n  /**\n   * Override the legend with a custom component.\n   */\n  customLegend?: CustomLegend;\n}\n\n/**\n * The Spec used for Chart settings\n * @public\n */\nexport interface SettingsSpec extends Spec, LegendSpec {\n  /**\n   * Partial theme to be merged with base\n   *\n   * or\n   *\n   * Array of partial themes to be merged with base\n   * index `0` being the highest priority\n   *\n   * i.e. `[primary, secondary, tertiary]`\n   */\n  theme?: PartialTheme | PartialTheme[];\n  /**\n   * Full default theme to use as base\n   *\n   * @defaultValue `LIGHT_THEME`\n   */\n  baseTheme?: Theme;\n  rendering: Rendering;\n  rotation: Rotation;\n  animateData: boolean;\n\n  /**\n   * {@inheritDoc ExternalPointerEventsSettings}\n   * @alpha\n   */\n  externalPointerEvents: ExternalPointerEventsSettings;\n  /**\n   * Show debug shadow elements on chart\n   */\n  debug: boolean;\n  /**\n   * Show debug render state on `ChartStatus` component\n   * @alpha\n   */\n  debugState?: boolean;\n  /**\n   * Attach a listener for click on the projection area.\n   * The listener will be called with the current x value snapped to the closest\n   * X axis point, and an array of Y values for every groupId used in the chart.\n   */\n  onProjectionClick?: ProjectionClickListener;\n  onElementClick?: ElementClickListener;\n  onElementOver?: ElementOverListener;\n  onElementOut?: BasicListener;\n  onBrushEnd?: BrushEndListener;\n  onPointerUpdate?: PointerUpdateListener;\n  /**\n   * @alpha subject to be removed in the future\n   */\n  onResize?: ResizeListener;\n  onRenderChange?: RenderChangeListener;\n  onWillRender?: WillRenderListener;\n  onProjectionAreaChange?: ProjectionAreaChangeListener;\n\n  /**\n   * The min distance from the rendered point circumference to highlight a cartesian data point in line/area/bubble charts.\n   */\n  pointBuffer: MarkBuffer;\n  xDomain?: CustomXDomain;\n  /**\n   * allows user to set a click handler to the annotations\n   */\n  onAnnotationClick?: AnnotationClickListener;\n\n  /**\n   * debounce delay used for resizing chart\n   * @deprecated currently unused\n   */\n  resizeDebounce?: number;\n\n  /**\n   * debounce delay used for onPointerUpdate listener\n   */\n  pointerUpdateDebounce?: number;\n\n  /**\n   * trigger for onPointerUpdate listener.\n   *\n   *  - `'x'` - only triggers lister when x value changes\n   *  - `'y'` - only triggers lister when y values change\n   *  - `'both'` - triggers lister when x or y values change\n   *\n   * @defaultValue 'x'\n   */\n  pointerUpdateTrigger: PointerUpdateTrigger;\n\n  /**\n   * Block the brush tool on a specific axis: x, y or both.\n   * @defaultValue `x` {@link (BrushAxis:type) | BrushAxis.X}\n   */\n  brushAxis?: BrushAxis;\n  /**\n   * The minimum number of pixel to consider for a valid brush event (in both axis if brushAxis prop is BrushAxis.Both).\n   * E.g. a min value of 2 means that the brush area needs to be at least 2 pixel wide and 2 pixel tall.\n   * @defaultValue 2\n   */\n  minBrushDelta?: number;\n  /**\n   * Boolean to round brushed values to nearest step bounds.\n   *\n   * e.g.\n   * A brush selection range of [1.23, 3.6] with a domain of [1, 2, 3, 4].\n   *\n   * - when true returns [1, 3]\n   * - when false returns [1.23, 3.6]\n   *\n   * @defaultValue false\n   */\n  roundHistogramBrushValues?: boolean;\n  /**\n   * Boolean to allow brushing on last bucket even when outside domain or limit to end of domain.\n   * Should apply only for histogram charts\n   * e.g.\n   * A brush selection range of [1.23, 3.6] with a domain of [1, 2, 3]\n   *\n   * - when true returns [1.23, 3.6]\n   * - when false returns [1.23, 3]\n   *\n   * @defaultValue true\n   */\n  allowBrushingLastHistogramBin: boolean;\n  /**\n   * Orders ordinal x values\n   */\n  orderOrdinalBinsBy?: OrderBy;\n  /**\n   * Render component for no results UI\n   */\n  noResults?: ComponentType | ReactChild;\n  /**\n   * User can specify the heading level for the label\n   * @defaultValue 'h2'\n   */\n  ariaLabelHeadingLevel: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p';\n  /**\n   * A text to label the chart\n   */\n  ariaLabel?: string;\n  /**\n   * An DOM element ID for the chart label. If provided, it will override the ariaLabel prop.\n   */\n  ariaLabelledBy?: string;\n  /**\n   * A description about the chart.\n   */\n  ariaDescription?: string;\n  /**\n   * * An DOM element ID for the chart description. If provided, it will override the ariaDescription prop.\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Renders an autogenerated summary of the chart\n   * @defaultValue true\n   */\n  ariaUseDefaultSummary: boolean;\n  /**\n   * User can provide a table description of the data\n   */\n  ariaTableCaption?: string;\n\n  /**\n   * Unicode Locale Identifier, default `en`\n   */\n  locale: string;\n}\n\n/**\n * Order by options\n * @public\n */\nexport interface OrderBy {\n  binAgg?: BinAgg;\n  direction?: Direction;\n}\n\n/**\n * Adds settings spec to chart specs\n * @public\n */\nexport const Settings = function (\n  props: SFProps<\n    SettingsSpec,\n    keyof (typeof settingsBuildProps)['overrides'],\n    keyof (typeof settingsBuildProps)['defaults'],\n    keyof (typeof settingsBuildProps)['optionals'],\n    keyof (typeof settingsBuildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = settingsBuildProps;\n  useSpecFactory<SettingsSpec>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type SettingsProps = ComponentProps<typeof Settings>;\n\n/** @internal */\nexport function isPointerOutEvent(event: PointerEvent | null | undefined): event is PointerOutEvent {\n  return event?.type === PointerEventType.Out;\n}\n\n/** @internal */\nexport function isPointerOverEvent(event: PointerEvent | null | undefined): event is PointerOverEvent {\n  return event?.type === PointerEventType.Over;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { Spec } from '.';\nimport { SpecType } from './constants';\nimport { ChartType } from '../chart_types';\nimport { Ratio } from '../common/geometry';\nimport { specComponentFactory } from '../state/spec_factory';\n\n/**\n * Can be used for margin or padding start/end (eg. left/right or top/bottom)\n * Todo: this will soon change to `{outer, inner}` for explicit specification\n * @alpha\n */\nexport type RelativeBandsPadding = {\n  /**\n   * Outer padding specifies the padding size *next to* a small multiples panel that's on the edge of the small\n   * multiples grid, expressed as a proportion (ratio) of the panel size\n   */\n  outer: Ratio;\n  /**\n   * Inner padding specifies the padding size *between* small multiples panels in the small multiples grid,\n   * expressed as a proportion (ratio) of the panel size\n   */\n  inner: Ratio;\n};\n\n/** @internal */\nexport const DEFAULT_SM_PANEL_PADDING: RelativeBandsPadding = { outer: 0, inner: 0.1 };\n\n/**\n * Specifies styling and stylistic layout attributes relating to small multiples\n * @alpha\n */\nexport interface SmallMultiplesStyle {\n  /**\n   * Horizontal padding for each panel, expressed as [leftMarginRatio, rightMarginRatio], relative to the gross panel width\n   */\n  horizontalPanelPadding: RelativeBandsPadding;\n  /**\n   * Vertical padding for each panel, expressed as [topMarginRatio, bottomMarginRatio], relative to the gross panel height\n   */\n  verticalPanelPadding: RelativeBandsPadding;\n}\n\n/** @alpha */\nexport interface SmallMultiplesSpec extends Spec {\n  /**\n   * Identifies the `<GroupBy id=\"foo\">` referenced by `splitHorizontally=\"foo\"`, specifying horizontal tiling\n   */\n  splitHorizontally?: string;\n  /**\n   * Identifies the `<GroupBy id=\"bar\">` referenced by `splitVertically=\"bar\"`, specifying vertical tiling\n   */\n  splitVertically?: string;\n  /**\n   * Identifies the `<GroupBy id=\"baz\">` referenced by `splitVertically=\"baz\"`, specifying space-filling tiling in a Z pattern\n   */\n  splitZigzag?: string;\n  /**\n   * Specifies styling and layout properties of the tiling, such as paddings between and outside panels\n   */\n  style?: Partial<SmallMultiplesStyle>;\n}\n\n/**\n * Add small multiples spec to chart\n * @alpha\n */\nexport const SmallMultiples = specComponentFactory<SmallMultiplesSpec>()(\n  {\n    chartType: ChartType.Global,\n    specType: SpecType.SmallMultiples,\n  },\n  {\n    id: '__global__small_multiples___',\n  },\n);\n\n/** @public */\nexport type SmallMultiplesProps = ComponentProps<typeof SmallMultiples>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { useEffect, FC, PropsWithChildren } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { specParsed, specUnmounted } from '../state/actions/specs';\n\nconst SpecsParserComponent: FC<PropsWithChildren<DispatchProps>> = (props) => {\n  const injected = props as DispatchProps;\n  // clean all specs\n  useEffect(() => {\n    injected.specParsed();\n  });\n  useEffect(\n    () => () => {\n      injected.specUnmounted();\n    },\n    [], // eslint-disable-line react-hooks/exhaustive-deps\n  );\n  // TODO eliminate the need for this type casting\n  return props.children ? (props.children as React.ReactElement) : null;\n};\n\ninterface DispatchProps {\n  specParsed: () => void;\n  specUnmounted: () => void;\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      specParsed,\n      specUnmounted,\n    },\n    dispatch,\n  );\n\n/**\n * The Spec Parser component\n * @internal\n */\nexport const SpecsParser = connect(null, mapDispatchToProps)(SpecsParserComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentType, ReactNode } from 'react';\n\nimport { SpecType, TooltipStickTo, TooltipType } from './constants';\nimport { Spec } from './index';\nimport { SettingsSpec } from './settings';\nimport { ChartType } from '../chart_types';\nimport { BaseDatum } from '../chart_types/specs';\nimport { Color } from '../common/colors';\nimport { SeriesIdentifier } from '../common/series_id';\nimport { TooltipPortalSettings } from '../components/portal';\nimport { CustomTooltip } from '../components/tooltip';\nimport { buildSFProps, SFProps, useSpecFactory } from '../state/spec_factory';\nimport { PointerValue } from '../state/types';\nimport { Datum, stripUndefined } from '../utils/common';\n\n/**\n * This interface describe the properties of single value shown in the tooltip\n * @public\n */\nexport interface TooltipValue<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends PointerValue<D> {\n  /**\n   * The label of the tooltip value\n   */\n  label: string;\n  /**\n   * The mark value\n   */\n  markValue?: number | null;\n  /**\n   * The mark value to display\n   */\n  formattedMarkValue?: string | null;\n  /**\n   * The color of the graphic mark (by default the color of the series)\n   */\n  color: Color;\n  /**\n   * True if the mouse is over the graphic mark connected to the tooltip\n   */\n  isHighlighted: boolean;\n  /**\n   * True if the tooltip is visible, false otherwise\n   */\n  isVisible: boolean;\n  /**\n   * The identifier of the related series\n   */\n  seriesIdentifier: SI;\n  /**\n   * The datum associated with the current tooltip value\n   * Maybe not available\n   */\n  datum?: D;\n  /**\n   * Internal flag used to simplify interactions for heatmap tooltip\n   * TODO: replace this flag with better internal tooltip info structures\n   * @internal\n   */\n  displayOnly?: boolean;\n}\n\n/**\n * A value formatter of a {@link TooltipValue}\n * @public\n */\nexport type TooltipValueFormatter<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = (\n  data: TooltipValue<D, SI>,\n) => JSX.Element | string;\n\n/**\n * A header formatter of tooltip {@link PointerValue}\n * @public\n */\nexport type TooltipHeaderFormatter<D extends BaseDatum = Datum> = (data: PointerValue<D>) => JSX.Element | string;\n\n/** @internal */\nexport function isCrosshairTooltipType(type: TooltipType) {\n  return type === TooltipType.VerticalCursor || type === TooltipType.Crosshairs;\n}\n\n/** @internal */\nexport function isFollowTooltipType(type: TooltipType) {\n  return type === TooltipType.Follow;\n}\n\n/** @internal */\nexport function getTooltipType(tooltip: TooltipSpec, settings: SettingsSpec, externalTooltip = false): TooltipType {\n  if (!externalTooltip) return tooltip.type;\n  const { visible } = settings.externalPointerEvents.tooltip;\n  return visible ? TooltipType.VerticalCursor : TooltipType.None;\n}\n\n/**\n * Tooltip action parameters\n * @public\n */\nexport type TooltipAction<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = {\n  /**\n   * Clickable label to display action\n   */\n  label: string | ((selected: TooltipValue<D, SI>[], allItems: TooltipValue<D, SI>[]) => ReactNode);\n  /**\n   * Hides action from list\n   */\n  hide?: (selected: TooltipValue<D, SI>[], allItems: TooltipValue<D, SI>[]) => boolean;\n  /**\n   * Disables action when true or string description is passed\n   * If a string is passed, it will be used as the title to display reason for disablement\n   */\n  disabled?: (selected: TooltipValue<D, SI>[], allItems: TooltipValue<D, SI>[]) => boolean | string;\n  /**\n   * Callback trigger when action is selected\n   */\n  onSelect: (selected: TooltipValue<D, SI>[], allItems: TooltipValue<D, SI>[]) => void;\n};\n\n/**\n * Spec used to configure tooltip for chart\n * @public\n */\nexport interface TooltipSpec<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends Spec,\n    TooltipPortalSettings<'chart'> {\n  /**\n   * The {@link (TooltipType:type) | TooltipType} of the tooltip\n   * @defaultValue vertical\n   */\n  type: TooltipType;\n\n  /**\n   * Whenever the tooltip needs to snap to the x/band position or not\n   * @defaultValue true\n   */\n  snap: boolean;\n\n  /**\n   * A {@link TooltipHeaderFormatter} to format the header value. Ignored when header is defined.\n   */\n  headerFormatter?: TooltipHeaderFormatter<D>;\n\n  /**\n   * Unit for event (i.e. `time`, `feet`, `count`, etc.).\n   * Not currently used/implemented\n   *\n   * @alpha\n   */\n  unit?: string;\n\n  /**\n   * Render custom tooltip given header and values\n   */\n  customTooltip?: CustomTooltip<D, SI>;\n\n  /**\n   * Stick the tooltip to a specific position within the current cursor\n   * @defaultValue mousePosition\n   */\n  stickTo?: TooltipStickTo;\n\n  /**\n   * Show null values on the tooltip\n   * @defaultValue false\n   */\n  showNullValues: boolean;\n\n  /**\n   * Custom header for tooltip. Ignored when used with `customTooltip`.\n   * Note: This is not the table headers but spans the entire tooltip.\n   */\n  header: 'default' | 'none' | ComponentType<{ items: TooltipValue<D, SI>[]; header: PointerValue<D> | null }>;\n\n  /**\n   * Custom body for tooltip. Ignored when used with `customTooltip`.\n   * Note: This is not the table body but spans the entire tooltip.\n   */\n  body: 'default' | 'none' | ComponentType<{ items: TooltipValue<D, SI>[]; header: PointerValue<D> | null }>;\n  /**\n   * Custom footer for tooltip. Ignored when used with `customTooltip`.\n   * Note: This is not the table footers but spans the entire tooltip.\n   */\n  footer: 'default' | 'none' | ComponentType<{ items: TooltipValue<D, SI>[]; header: PointerValue<D> | null }>;\n\n  /**\n   * Actions to enable tooltip selection\n   */\n  actions:\n    | TooltipAction<D, SI>[]\n    | ((selected: TooltipValue<D, SI>[]) => Promise<TooltipAction<D, SI>[]> | TooltipAction<D, SI>[]);\n\n  /**\n   * Shown in place of actions UI while loading async actions\n   */\n  actionsLoading: string | ComponentType<{ selected: TooltipValue<D, SI>[] }>;\n\n  /**\n   * Shown in place of actions UI after loading async actions and finding none\n   */\n  noActionsLoaded: string | ComponentType<{ selected: TooltipValue<D, SI>[] }>;\n\n  /**\n   * Prompt displayed to indicate user can right-click for contextual menu\n   */\n  actionPrompt: string;\n\n  /**\n   * Prompt displayed to indicate user can right-click for contextual menu\n   */\n  pinningPrompt: string;\n\n  /**\n   * Prompt displayed when tooltip is pinned but all actions are hidden\n   */\n  selectionPrompt: string;\n\n  /**\n   * Max number of tooltip items before showing only highlighted values\n   */\n  maxTooltipItems: number;\n\n  /**\n   * Max number of visible tooltip items before scrolling. Does not apply to custom tooltips\n   */\n  maxVisibleTooltipItems: number;\n}\n\n/**\n * Configure tooltip for chart\n * @public\n */\nexport const tooltipBuildProps = buildSFProps<TooltipSpec>()(\n  {\n    id: '__global__tooltip___' as const,\n    chartType: ChartType.Global,\n    specType: SpecType.Tooltip,\n  },\n  {\n    type: TooltipType.VerticalCursor,\n    snap: true,\n    showNullValues: false,\n    actions: [],\n    actionPrompt: 'Right-click to show actions',\n    pinningPrompt: 'Right-click to pin tooltip',\n    selectionPrompt: 'Please select a series',\n    actionsLoading: 'Loading Actions...',\n    noActionsLoaded: 'No actions available',\n    maxTooltipItems: 10,\n    maxVisibleTooltipItems: 10,\n    header: 'default',\n    body: 'default',\n    footer: 'default',\n  },\n);\n\n/** @public */\nexport const DEFAULT_TOOLTIP_SPEC: TooltipSpec = {\n  ...tooltipBuildProps.defaults,\n  ...tooltipBuildProps.overrides,\n};\n\n/**\n * Adds settings spec to chart specs\n * @public\n */\nexport const Tooltip = function <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  props: SFProps<\n    TooltipSpec<D, SI>,\n    keyof (typeof tooltipBuildProps)['overrides'],\n    keyof (typeof tooltipBuildProps)['defaults'],\n    keyof (typeof tooltipBuildProps)['optionals'],\n    keyof (typeof tooltipBuildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = tooltipBuildProps;\n  // @ts-ignore - default generic value\n  useSpecFactory<TooltipSpec<D, SI>>({\n    ...defaults,\n    ...stripUndefined(props),\n    ...overrides,\n  });\n  return null;\n};\n\n/**\n * This interface describe the properties of single value shown in the tooltip\n * @public\n */\nexport type TooltipProps<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = SFProps<\n  TooltipSpec<D, SI>,\n  keyof (typeof tooltipBuildProps)['overrides'],\n  keyof (typeof tooltipBuildProps)['defaults'],\n  keyof (typeof tooltipBuildProps)['optionals'],\n  keyof (typeof tooltipBuildProps)['requires']\n>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const CHART_RENDERED = 'CHART_RENDERED';\n\ninterface ChartRenderedAction {\n  type: typeof CHART_RENDERED;\n}\n\n/** @internal */\nexport function onChartRendered(): ChartRenderedAction {\n  return { type: CHART_RENDERED };\n}\n\n/** @internal */\nexport type ChartActions = ChartRenderedAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../utils/dimensions';\n\n/** @internal */\nexport const UPDATE_PARENT_DIMENSION = 'UPDATE_PARENT_DIMENSION';\n\n/** @internal */\nexport const UPDATE_CHART_TITLES = 'UPDATE_CHART_TITLES';\n\ninterface UpdateParentDimensionAction {\n  type: typeof UPDATE_PARENT_DIMENSION;\n  dimensions: Dimensions;\n}\n\ninterface UpdateChartTitlesAction {\n  type: typeof UPDATE_CHART_TITLES;\n  title?: string;\n  description?: string;\n}\n\n/** @internal */\nexport function updateParentDimensions(dimensions: Dimensions): UpdateParentDimensionAction {\n  return { type: UPDATE_PARENT_DIMENSION, dimensions };\n}\n\n/** @internal */\nexport function updateChartTitles(title?: string, description?: string): UpdateChartTitlesAction {\n  return { type: UPDATE_CHART_TITLES, title, description };\n}\n\n/** @internal */\nexport type ChartSettingsActions = UpdateParentDimensionAction | UpdateChartTitlesAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../common/colors';\nimport { SeriesKey } from '../../common/series_id';\n\n/** @internal */\nexport const CLEAR_TEMPORARY_COLORS = 'CLEAR_TEMPORARY_COLORS';\n\n/** @internal */\nexport const SET_TEMPORARY_COLOR = 'SET_TEMPORARY_COLOR';\n\n/** @internal */\nexport const SET_PERSISTED_COLOR = 'SET_PERSISTED_COLOR';\n\ninterface ClearTemporaryColors {\n  type: typeof CLEAR_TEMPORARY_COLORS;\n}\n\ninterface SetTemporaryColor {\n  type: typeof SET_TEMPORARY_COLOR;\n  keys: SeriesKey[];\n  color: Color | null;\n}\n\ninterface SetPersistedColor {\n  type: typeof SET_PERSISTED_COLOR;\n  keys: SeriesKey[];\n  color: Color | null;\n}\n\n/** @internal */\nexport function clearTemporaryColors(): ClearTemporaryColors {\n  return { type: CLEAR_TEMPORARY_COLORS };\n}\n\n/** @internal */\nexport function setTemporaryColor(keys: SeriesKey[], color: Color | null): SetTemporaryColor {\n  return { type: SET_TEMPORARY_COLOR, keys, color };\n}\n\n/** @internal */\nexport function setPersistedColor(keys: SeriesKey[], color: Color | null): SetPersistedColor {\n  return { type: SET_PERSISTED_COLOR, keys, color };\n}\n\n/** @internal */\nexport type ColorsActions = ClearTemporaryColors | SetTemporaryColor | SetPersistedColor;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/** @internal */\nexport const ON_DOM_ELEMENT_ENTER = 'ON_DOM_ELEMENT_ENTER';\n/** @internal */\nexport const ON_DOM_ELEMENT_LEAVE = 'ON_DOM_ELEMENT_LEAVE';\n/** @internal */\nexport const ON_DOM_ELEMENT_CLICK = 'ON_DOM_ELEMENT_CLICK';\n\n/** @internal */\nexport const DOMElementType = Object.freeze({\n  LineAnnotationMarker: 'LineAnnotationMarker' as const,\n});\n/** @internal */\nexport type DOMElementType = $Values<typeof DOMElementType>;\n\n/** @internal */\nexport interface DOMElement {\n  type: DOMElementType;\n  id: string;\n  createdBySpecId: string; // TODO is that + datum enough to identify the elements?\n  datum: unknown;\n}\ninterface DOMElementEnterAction {\n  type: typeof ON_DOM_ELEMENT_ENTER;\n  element: DOMElement;\n}\n\ninterface DOMElementLeaveAction {\n  type: typeof ON_DOM_ELEMENT_LEAVE;\n}\n\ninterface DOMElementClickAction {\n  type: typeof ON_DOM_ELEMENT_CLICK;\n}\n\n/** @internal */\nexport function onDOMElementLeave(): DOMElementLeaveAction {\n  return { type: ON_DOM_ELEMENT_LEAVE };\n}\n\n/** @internal */\nexport function onDOMElementEnter(element: DOMElement): DOMElementEnterAction {\n  return { type: ON_DOM_ELEMENT_ENTER, element };\n}\n\n/** @internal */\nexport function onDOMElementClick(): DOMElementClickAction {\n  return { type: ON_DOM_ELEMENT_CLICK };\n}\n\n/** @internal */\nexport type DOMElementActions = DOMElementEnterAction | DOMElementLeaveAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PointerEvent } from '../../specs/settings';\n\n/** @internal */\nexport const EXTERNAL_POINTER_EVENT = 'EXTERNAL_POINTER_EVENT';\n\ninterface ExternalPointerEvent {\n  type: typeof EXTERNAL_POINTER_EVENT;\n  event: PointerEvent;\n}\n\n/** @internal */\nexport function onExternalPointerEvent(event: PointerEvent): ExternalPointerEvent {\n  return { type: EXTERNAL_POINTER_EVENT, event };\n}\n\n/** @internal */\nexport type EventsActions = ExternalPointerEvent;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const ON_KEY_UP = 'ON_KEY_UP';\n\ninterface KeyUpAction {\n  type: typeof ON_KEY_UP;\n  /**\n   * Keyboard key from event\n   */\n  key: string;\n}\n\n/**\n * Action called on `keyup` event\n * @param key keyboard key\n * @internal\n */\nexport function onKeyPress(key: string): KeyUpAction {\n  return { type: ON_KEY_UP, key };\n}\n\n/** @internal */\nexport type KeyActions = KeyUpAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CategoryKey } from '../../common/category';\nimport { SeriesIdentifier } from '../../common/series_id';\n\n/** @internal */\nexport const ON_LEGEND_ITEM_OVER = 'ON_LEGEND_ITEM_OVER';\n\n/** @internal */\nexport const ON_LEGEND_ITEM_OUT = 'ON_LEGEND_ITEM_OUT';\n\n/** @internal */\nexport const ON_TOGGLE_DESELECT_SERIES = 'ON_TOGGLE_DESELECT_SERIES';\n\n/** @public */\nexport type LegendPathElement = { index: number; value: CategoryKey };\n\n/**\n * This is an array that defines a path for chart types characterized by hierarchical breakdown of the data, currently\n * partition charts. With partition charts,\n *   - element index 0 is the `groupBy` breakdown: a panel `index` number, and a stringified category `value`\n *      - if the chart is a singleton, ie. there's no trellising, it's `{index: 0, value: NULL_SMALL_MULTIPLES_KEY}`\n *   - element index 1 represents the singular root of a specific pie etc. chart `{index: 0, value: HIERARCHY_ROOT_KEY}`\n *   - element index 2 represents the primary breakdown categories within a pie/treemap/etc.\n *   - element index 3 the next level breakdown, if any (eg. a ring around the pie, ie. sunburst)\n *   etc.\n * @public\n */\nexport type LegendPath = LegendPathElement[];\n\ninterface LegendItemOverAction {\n  type: typeof ON_LEGEND_ITEM_OVER;\n  legendPath: LegendPath;\n}\n\ninterface LegendItemOutAction {\n  type: typeof ON_LEGEND_ITEM_OUT;\n}\n\n/** @internal */\nexport interface ToggleDeselectSeriesAction {\n  type: typeof ON_TOGGLE_DESELECT_SERIES;\n  legendItemIds: SeriesIdentifier[];\n  negate: boolean;\n}\n\n/** @internal */\nexport function onLegendItemOverAction(legendPath: LegendPath): LegendItemOverAction {\n  return { type: ON_LEGEND_ITEM_OVER, legendPath };\n}\n\n/** @internal */\nexport function onLegendItemOutAction(): LegendItemOutAction {\n  return { type: ON_LEGEND_ITEM_OUT };\n}\n\n/** @internal */\nexport function onToggleDeselectSeriesAction(\n  legendItemIds: SeriesIdentifier[],\n  negate = false,\n): ToggleDeselectSeriesAction {\n  return { type: ON_TOGGLE_DESELECT_SERIES, legendItemIds, negate };\n}\n\n/** @internal */\nexport type LegendActions = LegendItemOverAction | LegendItemOutAction | ToggleDeselectSeriesAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Point } from '../../utils/point';\n\n/** @internal */\nexport const ON_POINTER_MOVE = 'ON_POINTER_MOVE';\n\n/** @internal */\nexport const ON_MOUSE_DOWN = 'ON_MOUSE_DOWN';\n\n/** @internal */\nexport const ON_MOUSE_UP = 'ON_MOUSE_UP';\n\n/** @internal */\nexport const ON_MOUSE_RIGHT_CLICK = 'ON_MOUSE_RIGHT_CLICK';\n\ninterface MouseRightClickAction {\n  type: typeof ON_MOUSE_RIGHT_CLICK;\n  position: Point;\n  time: number;\n}\n\ninterface MouseDownAction {\n  type: typeof ON_MOUSE_DOWN;\n  position: Point;\n  time: number;\n}\n\ninterface MouseUpAction {\n  type: typeof ON_MOUSE_UP;\n  position: Point;\n  time: number;\n}\n\ninterface PointerMoveAction {\n  type: typeof ON_POINTER_MOVE;\n  position: Point;\n  time: number;\n}\n\n/**\n * Action called on mouse button down event\n * @param position the x and y position (native event offsetX, offsetY)\n * @param time the timestamp of the event (native event timeStamp)\n * @internal\n */\nexport function onMouseRightClick(position: Point, time: number): MouseRightClickAction {\n  return { type: ON_MOUSE_RIGHT_CLICK, position, time };\n}\n\n/**\n * Action called on mouse button down event\n * @param position the x and y position (native event offsetX, offsetY)\n * @param time the timestamp of the event (native event timeStamp)\n * @internal\n */\nexport function onMouseDown(position: Point, time: number): MouseDownAction {\n  return { type: ON_MOUSE_DOWN, position, time };\n}\n\n/**\n * Action called on mouse button up event\n * @param position the x and y position (native event offsetX, offsetY)\n * @param time the timestamp of the event (native event timeStamp)\n * @internal\n */\nexport function onMouseUp(position: Point, time: number): MouseUpAction {\n  return { type: ON_MOUSE_UP, position, time };\n}\n\n/**\n * Action called with the mouse coordinates relatives to the chart container (exclude the legend)\n * @param position the x and y position (native event offsetX, offsetY)\n * @param time the timestamp of the event (native event timeStamp)\n * @internal\n */\nexport function onPointerMove(position: Point, time: number): PointerMoveAction {\n  return { type: ON_POINTER_MOVE, position, time };\n}\n\n/** @internal */\nexport type MouseActions = MouseDownAction | MouseUpAction | PointerMoveAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Spec } from '../../specs';\n\n/** @internal */\nexport const UPSERT_SPEC = 'UPSERT_SPEC';\n\n/** @internal */\nexport const REMOVE_SPEC = 'REMOVE_SPEC';\n\n/** @internal */\nexport const SPEC_PARSED = 'SPEC_PARSED';\n\n/** @internal */\nexport const SPEC_UNMOUNTED = 'SPEC_UNMOUNTED';\n\ninterface SpecParsedAction {\n  type: typeof SPEC_PARSED;\n}\n\ninterface SpecUnmountedAction {\n  type: typeof SPEC_UNMOUNTED;\n}\n\ninterface UpsertSpecAction {\n  type: typeof UPSERT_SPEC;\n  spec: Spec;\n}\n\ninterface RemoveSpecAction {\n  type: typeof REMOVE_SPEC;\n  id: string;\n}\n\n/** @internal */\nexport function upsertSpec(spec: Spec): UpsertSpecAction {\n  return { type: UPSERT_SPEC, spec };\n}\n\n/** @internal */\nexport function removeSpec(id: string): RemoveSpecAction {\n  return { type: REMOVE_SPEC, id };\n}\n\n/** @internal */\nexport function specParsed(): SpecParsedAction {\n  return { type: SPEC_PARSED };\n}\n\n/** @internal */\nexport function specUnmounted(): SpecUnmountedAction {\n  return { type: SPEC_UNMOUNTED };\n}\n\n/** @internal */\nexport type SpecActions = SpecParsedAction | SpecUnmountedAction | UpsertSpecAction | RemoveSpecAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipValue } from '../../specs';\n\n/** @internal */\nexport const PIN_TOOLTIP = 'PIN_TOOLTIP';\n\n/** @internal */\nexport const TOGGLE_SELECTED_TOOLTIP_ITEM = 'TOGGLE_SELECTED_TOOLTIP_ITEM';\n\n/** @internal */\nexport const SET_SELECTED_TOOLTIP_ITEMS = 'SET_SELECTED_TOOLTIP_ITEMS';\n\n/** @internal */\nexport interface PinTooltipAction {\n  type: typeof PIN_TOOLTIP;\n  pinned: boolean;\n  resetPointer: boolean;\n}\n\n/** @internal */\nexport interface ToggleSelectedTooltipItemAction {\n  type: typeof TOGGLE_SELECTED_TOOLTIP_ITEM;\n  item: TooltipValue;\n}\n\n/** @internal */\nexport interface SetSelectedTooltipItemsAction {\n  type: typeof SET_SELECTED_TOOLTIP_ITEMS;\n  items: TooltipValue[];\n}\n\n/** @internal */\nexport function pinTooltip(pinned: boolean, resetPointer: boolean = false): PinTooltipAction {\n  return { type: PIN_TOOLTIP, pinned, resetPointer };\n}\n\n/** @internal */\nexport function toggleSelectedTooltipItem(item: TooltipValue): ToggleSelectedTooltipItemAction {\n  return { type: TOGGLE_SELECTED_TOOLTIP_ITEM, item };\n}\n\n/** @internal */\nexport function setSelectedTooltipItems(items: TooltipValue[]): SetSelectedTooltipItemsAction {\n  return { type: SET_SELECTED_TOOLTIP_ITEMS, items };\n}\n\n/** @internal */\nexport type TooltipActions = PinTooltipAction | ToggleSelectedTooltipItemAction | SetSelectedTooltipItemsAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const Z_INDEX_EVENT = 'Z_INDEX_EVENT';\n\ninterface ZIndexEvent {\n  type: typeof Z_INDEX_EVENT;\n  zIndex: number;\n}\n\n/** @internal */\nexport function onComputedZIndex(zIndex: number): ZIndexEvent {\n  return { type: Z_INDEX_EVENT, zIndex };\n}\n\n/** @internal */\nexport type ZIndexActions = ZIndexEvent;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { CSSProperties, RefObject } from 'react';\n\nimport { StateActions } from './actions';\nimport { CHART_RENDERED } from './actions/chart';\nimport { UPDATE_CHART_TITLES, UPDATE_PARENT_DIMENSION } from './actions/chart_settings';\nimport { CLEAR_TEMPORARY_COLORS, SET_PERSISTED_COLOR, SET_TEMPORARY_COLOR } from './actions/colors';\nimport { DOMElement } from './actions/dom_element';\nimport { EXTERNAL_POINTER_EVENT } from './actions/events';\nimport { LegendPath } from './actions/legend';\nimport { REMOVE_SPEC, SPEC_PARSED, SPEC_UNMOUNTED, UPSERT_SPEC } from './actions/specs';\nimport { Z_INDEX_EVENT } from './actions/z_index';\nimport { interactionsReducer } from './reducers/interactions';\nimport { getInternalIsInitializedSelector, InitStatus } from './selectors/get_internal_is_intialized';\nimport { getLegendItemsSelector } from './selectors/get_legend_items';\nimport { LegendItemLabel } from './selectors/get_legend_items_labels';\nimport { DebugState } from './types';\nimport { getInitialPointerState, getInitialTooltipState } from './utils';\nimport { ChartType } from '../chart_types';\nimport { BulletState } from '../chart_types/bullet_graph/chart_state';\nimport { FlameState } from '../chart_types/flame_chart/internal_chart_state';\nimport { GoalState } from '../chart_types/goal_chart/state/chart_state';\nimport { HeatmapState } from '../chart_types/heatmap/state/chart_state';\nimport { MetricState } from '../chart_types/metric/state/chart_state';\nimport { PartitionState } from '../chart_types/partition_chart/state/chart_state';\nimport { TimeslipState } from '../chart_types/timeslip/internal_chart_state';\nimport { WordcloudState } from '../chart_types/wordcloud/state/chart_state';\nimport { XYAxisChartState } from '../chart_types/xy_chart/state/chart_state';\nimport { CategoryKey } from '../common/category';\nimport { Color } from '../common/colors';\nimport { LegendItem, LegendItemExtraValues } from '../common/legend';\nimport { SmallMultiplesSeriesDomains } from '../common/panel_utils';\nimport { SeriesIdentifier, SeriesKey } from '../common/series_id';\nimport { AnchorPosition } from '../components/portal/types';\nimport { TooltipInfo } from '../components/tooltip/types';\nimport { DEFAULT_SETTINGS_SPEC, PointerEvent, Spec, TooltipValue } from '../specs';\nimport { keepDistinct } from '../utils/common';\nimport { Dimensions } from '../utils/dimensions';\nimport { Logger } from '../utils/logger';\nimport { Point } from '../utils/point';\n\n/** @internal */\nexport type BackwardRef = () => React.RefObject<HTMLDivElement>;\n\n/** @internal */\nexport interface TooltipVisibility {\n  visible: boolean;\n  isExternal: boolean;\n  isPinnable: boolean;\n  displayOnly: boolean;\n}\n\n/**\n * A set of chart-type-dependant functions that required by all chart type\n * @internal\n */\nexport interface InternalChartState {\n  /**\n   * The chart type\n   */\n  chartType: ChartType;\n  isInitialized(globalState: GlobalChartState): InitStatus;\n  /**\n   * Returns a JSX element with the chart rendered (lenged excluded)\n   * @param containerRef\n   * @param forwardStageRef\n   */\n  chartRenderer(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>): JSX.Element | null;\n  /**\n   * `true` if the brush is available for this chart type\n   * @param globalState\n   */\n  isBrushAvailable(globalState: GlobalChartState): boolean;\n  /**\n   * `true` if the brush is available for this chart type\n   * @param globalState\n   */\n  isBrushing(globalState: GlobalChartState): boolean;\n  /**\n   * `true` if the chart is empty (no data displayed)\n   * @param globalState\n   */\n  isChartEmpty(globalState: GlobalChartState): boolean;\n\n  /**\n   * Returns the list of legend items labels. Mainly used to compute the legend size\n   * based on labels and their hierarchy depth.\n   * @param globalState\n   */\n  getLegendItemsLabels(globalState: GlobalChartState): LegendItemLabel[];\n\n  /**\n   * Returns the list of legend items.\n   * @param globalState\n   */\n  getLegendItems(globalState: GlobalChartState): LegendItem[];\n  /**\n   * Returns the list of extra values for each legend item\n   * @param globalState\n   */\n  getLegendExtraValues(globalState: GlobalChartState): Map<SeriesKey, LegendItemExtraValues>;\n  /**\n   * Returns the CSS pointer cursor depending on the internal chart state\n   * @param globalState\n   */\n  getPointerCursor(globalState: GlobalChartState): CSSProperties['cursor'];\n  /**\n   * Describe if the tooltip is visible and comes from an external source\n   * @param globalState\n   */\n  isTooltipVisible(globalState: GlobalChartState): TooltipVisibility;\n  /**\n   * Get the tooltip information to display\n   * @param globalState the GlobalChartState\n   */\n  getTooltipInfo(globalState: GlobalChartState): TooltipInfo | undefined;\n\n  /**\n   * Get the tooltip anchor position\n   * @param globalState\n   */\n  getTooltipAnchor(globalState: GlobalChartState): AnchorPosition | null;\n\n  /**\n   * Called on every state change to activate any event callback\n   * @param globalState\n   */\n  eventCallbacks(globalState: GlobalChartState): void;\n\n  /**\n   * Get the chart main projection area: exclude legends, axis and other external marks\n   * @param globalState\n   */\n  getMainProjectionArea(globalState: GlobalChartState): Dimensions;\n\n  /**\n   * Get the chart container projection area\n   * @param globalState\n   */\n  getProjectionContainerArea(globalState: GlobalChartState): Dimensions;\n\n  /**\n   * Get the brushed area if available\n   * @param globalState\n   */\n  getBrushArea(globalState: GlobalChartState): Dimensions | null;\n\n  /**\n   * Get debug state of chart\n   * @param globalState\n   */\n  getDebugState(globalState: GlobalChartState): DebugState;\n\n  /**\n   * Get the series types for the screen reader summary component\n   */\n  getChartTypeDescription(globalState: GlobalChartState): string;\n\n  /**\n   * Get the domain of the vertical and horizontal small multiple grids\n   */\n  getSmallMultiplesDomains(globalState: GlobalChartState): SmallMultiplesSeriesDomains;\n\n  /**\n   * Determines if chart titles are displayed when provided\n   */\n  canDisplayChartTitles(globalState: GlobalChartState): boolean;\n}\n\n/** @internal */\nexport interface SpecList {\n  [specId: string]: Spec;\n}\n\n/** @internal */\nexport interface PointerState {\n  position: Point;\n  time: number;\n}\n\n/** @internal */\nexport interface DragState {\n  start: PointerState;\n  end: PointerState;\n}\n\n/** @internal */\nexport interface PointerStates {\n  dragging: boolean;\n  current: PointerState;\n  down: PointerState | null;\n  pinned: PointerState | null;\n  up: PointerState | null;\n  lastDrag: DragState | null;\n  lastClick: PointerState | null;\n}\n\n/** @internal */\nexport interface InteractionsState {\n  pointer: PointerStates;\n  highlightedLegendPath: LegendPath;\n  deselectedDataSeries: SeriesIdentifier[];\n  hoveredDOMElement: DOMElement | null;\n  drilldown: CategoryKey[];\n  prevDrilldown: CategoryKey[];\n  tooltip: TooltipInteractionState;\n}\n\n/** @internal */\nexport interface TooltipInteractionState {\n  pinned: boolean;\n  selected: TooltipValue[];\n}\n\n/** @internal */\nexport interface ExternalEventsState {\n  pointer: PointerEvent | null;\n}\n\n/** @internal */\nexport interface ColorOverrides {\n  temporary: Record<SeriesKey, Color | null>; // null (vs. undefined) means that `overrides.persisted[key]` in `series.ts` not be used\n  persisted: Record<SeriesKey, Color>;\n}\n\n/** @internal */\nexport type ChartId = string;\n\n/** @internal */\nexport interface GlobalChartState {\n  /**\n   * a unique ID for each chart used by re-reselect to memoize selector per chart\n   */\n  chartId: ChartId;\n  /**\n   * Chart title\n   */\n  title?: string;\n  /**\n   * Chart description\n   */\n  description?: string;\n  /**\n   * The Z-Index of the chart component\n   */\n  zIndex: number;\n  /**\n   * true when all all the specs are parsed ad stored into the specs object\n   */\n  specsInitialized: boolean;\n  specParsing: boolean;\n  /**\n   * true if the chart is rendered on dom\n   */\n  chartRendered: boolean;\n  /**\n   * incremental count of the chart rendering\n   */\n  chartRenderedCount: number;\n  /**\n   * the map of parsed specs\n   */\n  specs: SpecList;\n  /**\n   * the chart type depending on the used specs\n   */\n  chartType: ChartType | null;\n  /**\n   * a chart-type-dependant class that is used to render and share chart-type dependant functions\n   */\n  internalChartState: InternalChartState | null;\n  /**\n   * the dimensions of the parent container, including the legend\n   */\n  parentDimensions: Dimensions;\n  /**\n   * the state of the interactions\n   */\n  interactions: InteractionsState;\n  /**\n   * external event state\n   */\n  externalEvents: ExternalEventsState;\n  /**\n   * Color map used to persist color picker changes\n   */\n  colors: ColorOverrides;\n}\n\n/** @internal */\nexport const getInitialState = (chartId: string, title?: string, description?: string): GlobalChartState => ({\n  chartId,\n  title,\n  description,\n  zIndex: 0,\n  specsInitialized: false,\n  specParsing: false,\n  chartRendered: false,\n  chartRenderedCount: 0,\n  specs: {\n    [DEFAULT_SETTINGS_SPEC.id]: DEFAULT_SETTINGS_SPEC,\n  },\n  colors: {\n    temporary: {},\n    persisted: {},\n  },\n  chartType: null,\n  internalChartState: null,\n  interactions: {\n    pointer: getInitialPointerState(),\n    highlightedLegendPath: [],\n    deselectedDataSeries: [],\n    hoveredDOMElement: null,\n    drilldown: [],\n    prevDrilldown: [],\n    tooltip: getInitialTooltipState(),\n  },\n  externalEvents: {\n    pointer: null,\n  },\n  parentDimensions: {\n    height: 0,\n    width: 0,\n    left: 0,\n    top: 0,\n  },\n});\n\n/** @internal */\nexport const chartStoreReducer = (chartId: string, title?: string, description?: string) => {\n  // redux types controls state as first parameter\n  // eslint-disable-next-line @typescript-eslint/default-param-last\n  return (state = getInitialState(chartId, title, description), action: StateActions): GlobalChartState => {\n    switch (action.type) {\n      case Z_INDEX_EVENT:\n        return {\n          ...state,\n          zIndex: action.zIndex,\n        };\n      case SPEC_PARSED:\n        const chartType = chartTypeFromSpecs(state.specs);\n        return {\n          ...state,\n          specsInitialized: true,\n          specParsing: false,\n          chartType,\n          internalChartState: state.chartType === chartType ? state.internalChartState : newInternalState(chartType),\n        };\n      case SPEC_UNMOUNTED:\n        return {\n          ...state,\n          specsInitialized: false,\n          chartRendered: false,\n        };\n      case UPSERT_SPEC:\n        return {\n          ...state,\n          specsInitialized: false,\n          chartRendered: false,\n          specParsing: true,\n          specs: state.specParsing\n            ? { ...state.specs, [action.spec.id]: action.spec }\n            : { [DEFAULT_SETTINGS_SPEC.id]: DEFAULT_SETTINGS_SPEC, [action.spec.id]: action.spec },\n        };\n      case REMOVE_SPEC:\n        const { [action.id]: specToRemove, ...rest } = state.specs;\n        return {\n          ...state,\n          specsInitialized: false,\n          chartRendered: false,\n          specParsing: false,\n          specs: {\n            ...rest,\n          },\n        };\n      case CHART_RENDERED:\n        const chartRenderedCount = state.chartRendered ? state.chartRenderedCount : state.chartRenderedCount + 1;\n        return {\n          ...state,\n          chartRendered: true,\n          chartRenderedCount,\n        };\n      case UPDATE_PARENT_DIMENSION:\n        return {\n          ...state,\n          interactions: {\n            ...state.interactions,\n            prevDrilldown: state.interactions.drilldown,\n            tooltip: getInitialTooltipState(),\n            pointer: {\n              ...state.interactions.pointer,\n              pinned: null,\n            },\n          },\n          parentDimensions: {\n            ...action.dimensions,\n          },\n          chartRendered: false,\n        };\n      case UPDATE_CHART_TITLES:\n        return {\n          ...state,\n          title: action.title,\n          description: action.description,\n        };\n      case EXTERNAL_POINTER_EVENT:\n        // discard events from self if any\n        return {\n          ...state,\n          externalEvents: {\n            ...state.externalEvents,\n            pointer: action.event.chartId === chartId ? null : action.event,\n          },\n          // clear pinned states when syncing external cursors\n          ...(action.event.chartId !== chartId && {\n            interactions: {\n              ...state.interactions,\n              pointer: getInitialPointerState(),\n              tooltip: getInitialTooltipState(),\n            },\n          }),\n        };\n      case CLEAR_TEMPORARY_COLORS:\n        return {\n          ...state,\n          colors: {\n            ...state.colors,\n            temporary: {},\n          },\n        };\n      case SET_TEMPORARY_COLOR:\n        return {\n          ...state,\n          colors: {\n            ...state.colors,\n            temporary: {\n              ...state.colors.temporary,\n              ...action.keys.reduce<Record<string, Color | null>>((acc, curr) => {\n                acc[curr] = action.color;\n                return acc;\n              }, {}),\n            },\n          },\n        };\n      case SET_PERSISTED_COLOR:\n        const persisted = action.keys.reduce<Record<string, Color>>((acc, curr) => {\n          if (action.color) {\n            acc[curr] = action.color;\n          } else {\n            delete acc[curr];\n          }\n          return acc;\n        }, state.colors.persisted);\n\n        return {\n          ...state,\n          colors: {\n            ...state.colors,\n            persisted,\n          },\n        };\n      default:\n        return getInternalIsInitializedSelector(state) === InitStatus.Initialized\n          ? {\n              ...state,\n              interactions: interactionsReducer(state, action, getLegendItemsSelector(state)),\n            }\n          : state;\n    }\n  };\n};\n\nfunction chartTypeFromSpecs(specs: SpecList): ChartType | null {\n  const nonGlobalTypes = Object.values(specs)\n    .map((s) => s.chartType)\n    .filter((type) => type !== ChartType.Global)\n    .filter(keepDistinct);\n  if (!nonGlobalTypes[0]) {\n    Logger.warn(`${nonGlobalTypes.length === 0 ? 'Zero' : 'Multiple'} chart types in the same configuration`);\n    return null;\n  }\n  return nonGlobalTypes[0];\n}\n\nconst constructors: Record<ChartType, () => InternalChartState | null> = {\n  [ChartType.Goal]: () => new GoalState(),\n  [ChartType.Partition]: () => new PartitionState(),\n  [ChartType.Flame]: () => new FlameState(),\n  [ChartType.Timeslip]: () => new TimeslipState(),\n  [ChartType.XYAxis]: () => new XYAxisChartState(),\n  [ChartType.Heatmap]: () => new HeatmapState(),\n  [ChartType.Wordcloud]: () => new WordcloudState(),\n  [ChartType.Metric]: () => new MetricState(),\n  [ChartType.Bullet]: () => new BulletState(),\n  [ChartType.Global]: () => null,\n}; // with no default, TS signals if a new chart type isn't added here too\n\nfunction newInternalState(chartType: ChartType | null): InternalChartState | null {\n  return chartType ? constructors[chartType]() : null;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// eslint-disable-next-line no-restricted-imports\nimport createCachedSelector, { ICacheObject, Options } from 're-reselect';\nimport type { createSelector } from 'reselect';\n\nimport { GlobalChartState } from './chart_state';\n\n/**\n * Custom object cache\n * see https://github.com/toomuchdesign/re-reselect/tree/master/src/cache#write-your-custom-cache-object\n */\nclass CustomMapCache implements ICacheObject {\n  private cache: any = {};\n\n  set(key: string, selectorFn: () => any) {\n    this.cache[key] = selectorFn;\n  }\n\n  get(key: string) {\n    return this.cache[key];\n  }\n\n  remove(key: string) {\n    delete this.cache[key];\n  }\n\n  clear() {\n    this.cache = {};\n  }\n\n  isEmpty() {\n    return Object.keys(this.cache).length === 0;\n  }\n\n  isValidCacheKey(key: string) {\n    return typeof key === 'string';\n  }\n}\n\nclass GlobalSelectorCache {\n  private selectorCaches: CustomMapCache[] = [];\n\n  static keySelector({ chartId }: GlobalChartState) {\n    return chartId;\n  }\n\n  getNewOptions(): Options<GlobalChartState, unknown, unknown> {\n    return {\n      keySelector: GlobalSelectorCache.keySelector,\n      cacheObject: this.getCacheObject(),\n    };\n  }\n\n  removeKeyFromAll(key: string) {\n    this.selectorCaches.forEach((cache) => {\n      cache.remove(key);\n    });\n  }\n\n  private getCacheObject(): CustomMapCache {\n    const cache = new CustomMapCache();\n    this.selectorCaches.push(cache);\n\n    return cache;\n  }\n}\n\n/**\n * Global singleton to manage state of selector caches\n *\n * @internal\n */\nexport const globalSelectorCache = new GlobalSelectorCache();\n\n/**\n * Wrapper around `createCachedSelector` to provide `keySelector` and `cacheObject`\n * for all selector instances in on place. This should be used in place of `createCachedSelector`.\n *\n * The types defining `createCachedSelector` are very complex and essentially hardcoded overloads for having any\n * number of selector inputs up to about 20 with genetic types. Thus the types are extremely hard to duplciate.\n * To fix this I used the type of `createSelector` which is what is the same as that of `createCachedSelector`\n * method with the added curring for the cached options which this wrapper handles.\n *\n * @internal\n */\nexport const createCustomCachedSelector: typeof createSelector = (...args: any[]) => {\n  // @ts-ignore - forced types to simplify usage. All types align correctly\n  return createCachedSelector(...args)(globalSelectorCache.getNewOptions());\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipSpecSelector } from './../selectors/get_tooltip_spec';\nimport { ChartType } from '../../chart_types';\nimport { drilldownActive } from '../../chart_types/partition_chart/state/selectors/drilldown_active';\nimport { getPickedShapesLayerValues } from '../../chart_types/partition_chart/state/selectors/picked_shapes';\nimport { LegendItem } from '../../common/legend';\nimport { SeriesIdentifier } from '../../common/series_id';\nimport { getDelta } from '../../utils/point';\nimport { DOMElementActions, ON_DOM_ELEMENT_ENTER, ON_DOM_ELEMENT_LEAVE } from '../actions/dom_element';\nimport { KeyActions, ON_KEY_UP } from '../actions/key';\nimport {\n  LegendActions,\n  ON_LEGEND_ITEM_OUT,\n  ON_LEGEND_ITEM_OVER,\n  ON_TOGGLE_DESELECT_SERIES,\n  ToggleDeselectSeriesAction,\n} from '../actions/legend';\nimport { MouseActions, ON_MOUSE_DOWN, ON_MOUSE_UP, ON_POINTER_MOVE } from '../actions/mouse';\nimport {\n  TOGGLE_SELECTED_TOOLTIP_ITEM,\n  PIN_TOOLTIP,\n  TooltipActions,\n  SET_SELECTED_TOOLTIP_ITEMS,\n} from '../actions/tooltip';\nimport { GlobalChartState, InteractionsState } from '../chart_state';\nimport { getInternalIsTooltipVisibleSelector } from '../selectors/get_internal_is_tooltip_visible';\nimport { getInternalTooltipInfoSelector } from '../selectors/get_internal_tooltip_info';\nimport { getInitialPointerState, getInitialTooltipState } from '../utils';\n\n/**\n * The minimum number of pixel between two pointer positions to consider for dragging purposes\n */\nconst DRAG_DETECTION_PIXEL_DELTA = 4;\n\n/** @internal */\nexport function interactionsReducer(\n  globalState: GlobalChartState,\n  action: LegendActions | MouseActions | KeyActions | DOMElementActions | TooltipActions,\n  legendItems: LegendItem[],\n): InteractionsState {\n  const { interactions: state } = globalState;\n  switch (action.type) {\n    case ON_KEY_UP:\n      if (action.key === 'Escape') {\n        if (state.tooltip.pinned) {\n          return {\n            ...state,\n            pointer: getInitialPointerState(),\n            tooltip: getInitialTooltipState(),\n          };\n        }\n\n        return {\n          ...state,\n          pointer: getInitialPointerState(),\n        };\n      }\n\n      return state;\n\n    case ON_POINTER_MOVE:\n      // The dragging is enabled when the delta between down and move positions is greater than a constant.\n      // After this initial threshold, the dragging still enabled until the mouse up event\n      const dragging =\n        state.pointer.dragging ||\n        (!!state.pointer.down && getDelta(state.pointer.down.position, action.position) > DRAG_DETECTION_PIXEL_DELTA);\n      return {\n        ...state,\n        pointer: {\n          ...state.pointer,\n          dragging,\n          current: {\n            position: {\n              ...action.position,\n            },\n            time: action.time,\n          },\n        },\n      };\n\n    case ON_MOUSE_DOWN:\n      return {\n        ...state,\n        drilldown: getDrilldownData(globalState),\n        prevDrilldown: state.drilldown,\n        pointer: {\n          ...state.pointer,\n          dragging: false,\n          up: null,\n          down: {\n            position: {\n              ...action.position,\n            },\n            time: action.time,\n          },\n        },\n      };\n\n    case ON_MOUSE_UP: {\n      return {\n        ...state,\n        pointer: {\n          ...state.pointer,\n          lastDrag:\n            state.pointer.down && state.pointer.dragging\n              ? {\n                  start: {\n                    position: {\n                      ...state.pointer.down.position,\n                    },\n                    time: state.pointer.down.time,\n                  },\n                  end: {\n                    position: {\n                      ...state.pointer.current.position,\n                    },\n                    time: action.time,\n                  },\n                }\n              : null,\n          lastClick:\n            state.pointer.down && !state.pointer.dragging\n              ? {\n                  position: {\n                    ...action.position,\n                  },\n                  time: action.time,\n                }\n              : null,\n          dragging: false,\n          down: null,\n          up: {\n            position: {\n              ...action.position,\n            },\n            time: action.time,\n          },\n        },\n      };\n    }\n\n    case ON_LEGEND_ITEM_OUT:\n      return {\n        ...state,\n        highlightedLegendPath: [],\n      };\n\n    case ON_LEGEND_ITEM_OVER:\n      const { legendPath: highlightedLegendPath } = action;\n      return {\n        ...state,\n        highlightedLegendPath,\n      };\n\n    case ON_TOGGLE_DESELECT_SERIES:\n      return {\n        ...state,\n        deselectedDataSeries: toggleDeselectedDataSeries(action, state.deselectedDataSeries, legendItems),\n      };\n\n    case ON_DOM_ELEMENT_ENTER:\n      return {\n        ...state,\n        hoveredDOMElement: action.element,\n      };\n\n    case ON_DOM_ELEMENT_LEAVE:\n      return {\n        ...state,\n        hoveredDOMElement: null,\n      };\n\n    case PIN_TOOLTIP: {\n      if (!action.pinned) {\n        return {\n          ...state,\n          pointer: action.resetPointer\n            ? getInitialPointerState()\n            : {\n                ...state.pointer,\n                pinned: null,\n              },\n          tooltip: getInitialTooltipState(),\n        };\n      }\n\n      const { isPinnable, displayOnly } = getInternalIsTooltipVisibleSelector(globalState);\n\n      if (!isPinnable || displayOnly) {\n        return state;\n      }\n\n      const tooltipSpec = getTooltipSpecSelector(globalState);\n      const getSelectedValues = () => {\n        const values = getInternalTooltipInfoSelector(globalState)?.values ?? [];\n        if (globalState.chartType === ChartType.Heatmap) return values.slice(0, 1); // just use the x value\n        return values.filter((v) =>\n          // TODO find a better way to distinguish these two\n          globalState.chartType === ChartType.XYAxis ? v.isHighlighted : !v.displayOnly,\n        );\n      };\n      const selected =\n        // don't pre-populate selection when values are not actionable\n        Array.isArray(tooltipSpec.actions) && tooltipSpec.actions.length === 0 ? [] : getSelectedValues();\n\n      return {\n        ...state,\n        tooltip: {\n          ...state.tooltip,\n          pinned: true,\n          selected,\n        },\n        pointer: {\n          ...state.pointer,\n          pinned: state.pointer.current,\n        },\n      };\n    }\n\n    case TOGGLE_SELECTED_TOOLTIP_ITEM: {\n      if (!state.tooltip.pinned) return state;\n      let updatedItems = [...state.tooltip.selected];\n      if (updatedItems.includes(action.item)) {\n        updatedItems = updatedItems.filter((item) => item !== action.item);\n      } else {\n        updatedItems.push(action.item);\n      }\n\n      return {\n        ...state,\n        tooltip: {\n          ...state.tooltip,\n          selected: updatedItems,\n        },\n      };\n    }\n\n    case SET_SELECTED_TOOLTIP_ITEMS: {\n      if (!state.tooltip.pinned) return state;\n\n      return {\n        ...state,\n        tooltip: {\n          ...state.tooltip,\n          selected: action.items,\n        },\n      };\n    }\n\n    default:\n      return state;\n  }\n}\n\n/**\n * Helper functions that currently depend on chart type eg. xy or partition\n */\n\nfunction toggleDeselectedDataSeries(\n  { legendItemIds, negate }: ToggleDeselectSeriesAction,\n  deselectedDataSeries: SeriesIdentifier[],\n  legendItems: LegendItem[],\n) {\n  const actionSeriesKeys = legendItemIds.map(({ key }) => key);\n  const deselectedDataSeriesKeys = new Set(deselectedDataSeries.map(({ key }) => key));\n  const legendItemsKeys = legendItems.map(({ seriesIdentifiers }) => seriesIdentifiers);\n\n  const alreadyDeselected = actionSeriesKeys.every((key) => deselectedDataSeriesKeys.has(key));\n\n  // todo consider branch simplifications\n  if (negate) {\n    return alreadyDeselected || deselectedDataSeries.length !== legendItemsKeys.length - 1\n      ? legendItems\n          .flatMap(({ seriesIdentifiers }) => seriesIdentifiers)\n          .filter(({ key }) => !actionSeriesKeys.includes(key))\n      : legendItemIds;\n  } else {\n    return alreadyDeselected\n      ? deselectedDataSeries.filter(({ key }) => !actionSeriesKeys.includes(key))\n      : [...deselectedDataSeries, ...legendItemIds];\n  }\n}\n\nfunction getDrilldownData(globalState: GlobalChartState) {\n  if (globalState.chartType !== ChartType.Partition || !drilldownActive(globalState)) {\n    return [];\n  }\n  const layerValues = getPickedShapesLayerValues(globalState)[0];\n  return layerValues ? layerValues.at(-1)?.path.map((n) => n.value) ?? [] : [];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipSpecSelector } from './get_tooltip_spec';\nimport { isExternalTooltipVisibleSelector } from './is_external_tooltip_visible';\nimport { ChartType } from '../../chart_types';\nimport { getTooltipInfoAndGeomsSelector } from '../../chart_types/xy_chart/state/selectors/get_tooltip_values_highlighted_geoms';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/**\n * Enables tooltip pinning only for certain chart types\n */\nconst pinnableTooltipCharts = new Set<ChartType>([\n  ChartType.XYAxis,\n  ChartType.Heatmap,\n  ChartType.Partition,\n  ChartType.Flame,\n]);\n\nconst getChartType = ({ chartType }: GlobalChartState) => chartType;\n\n/**\n * @internal\n */\nexport const isPinnableTooltip = createCustomCachedSelector(\n  [getChartType, isExternalTooltipVisibleSelector, getTooltipSpecSelector, getTooltipInfoAndGeomsSelector],\n  (\n    chartType,\n    isExternal,\n    { maxVisibleTooltipItems, maxTooltipItems, actions },\n    { tooltip, highlightedGeometries },\n  ): boolean => {\n    const isPinnableChartType = Boolean(chartType && pinnableTooltipCharts.has(chartType));\n    const actionable = actions.length > 0 || !Array.isArray(actions);\n    let hasHiddenSeries = false;\n\n    if (chartType === ChartType.XYAxis) {\n      const infoCount = tooltip.values.length;\n      const highlightCount = highlightedGeometries.length;\n      hasHiddenSeries =\n        (infoCount > highlightCount && infoCount > maxTooltipItems) || infoCount > maxVisibleTooltipItems;\n    }\n\n    return isPinnableChartType && !isExternal && (hasHiddenSeries || actionable);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSmallMultipleScalesSelector } from './compute_small_multiple_scales';\nimport { getPanelSize, getPerPanelMap, PerPanelMap } from '../../common/panel_utils';\nimport { Size } from '../../utils/dimensions';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport type PanelGeoms = Array<Size & PerPanelMap>;\n\n/** @internal */\nexport const computePanelsSelectors = createCustomCachedSelector(\n  [computeSmallMultipleScalesSelector],\n  (scales): PanelGeoms => {\n    const panelSize = getPanelSize(scales);\n    return getPerPanelMap(scales, () => panelSize);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getInternalMainProjectionAreaSelector } from './get_internal_main_projection_area';\nimport { getInternalSmallMultiplesDomains } from './get_internal_sm_domains';\nimport { getSmallMultiplesSpec } from './get_small_multiples_spec';\nimport { SmallMultipleScales } from '../../common/panel_utils';\nimport { ScaleBand } from '../../scales';\nimport { RelativeBandsPadding, DEFAULT_SM_PANEL_PADDING } from '../../specs';\nimport { OrdinalDomain } from '../../utils/domain';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/**\n * Return the small multiple scales for horizontal and vertical grids\n * @internal\n */\nexport const computeSmallMultipleScalesSelector = createCustomCachedSelector(\n  [getInternalSmallMultiplesDomains, getInternalMainProjectionAreaSelector, getSmallMultiplesSpec],\n  ({ smHDomain, smVDomain }, { width, height }, smSpec): SmallMultipleScales => {\n    return {\n      horizontal: getScale(smHDomain, width, smSpec?.style?.horizontalPanelPadding),\n      vertical: getScale(smVDomain, height, smSpec?.style?.verticalPanelPadding),\n    };\n  },\n);\n\n/**\n * @internal\n */\nexport function getScale(\n  domain: OrdinalDomain,\n  maxRange: number,\n  padding: RelativeBandsPadding = DEFAULT_SM_PANEL_PADDING,\n): ScaleBand {\n  const singlePanelSmallMultiple = domain.length <= 1;\n  return new ScaleBand(domain, [0, maxRange], undefined, singlePanelSmallMultiple ? 0 : padding);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getChartIdSelector } from './get_chart_id';\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { DEFAULT_SETTINGS_SPEC } from '../../specs/constants';\nimport { SettingsSpec } from '../../specs/settings';\nimport { isDefined } from '../../utils/common';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport type A11ySettings = {\n  label?: string;\n  labelId?: string;\n  labelHeadingLevel: SettingsSpec['ariaLabelHeadingLevel'];\n  description?: string;\n  descriptionId?: string;\n  defaultSummaryId?: string;\n  tableCaption?: string;\n};\n\n/** @internal */\nexport const DEFAULT_A11Y_SETTINGS: A11ySettings = {\n  labelHeadingLevel: DEFAULT_SETTINGS_SPEC.ariaLabelHeadingLevel,\n};\n\n/** @internal */\nexport const getA11ySettingsSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector, getChartIdSelector],\n  (\n    {\n      ariaDescription,\n      ariaDescribedBy,\n      ariaLabel,\n      ariaLabelledBy,\n      ariaUseDefaultSummary,\n      ariaLabelHeadingLevel,\n      ariaTableCaption,\n    },\n    chartId,\n  ) => {\n    const defaultSummaryId = ariaUseDefaultSummary ? `${chartId}--defaultSummary` : undefined;\n    // use ariaDescribedBy if present, or create a description element if ariaDescription is present.\n    // concat also if default summary id if requested\n    const describeBy = [ariaDescribedBy ?? (ariaDescription && `${chartId}--desc`), defaultSummaryId].filter(isDefined);\n\n    return {\n      // don't render a label if a labelledBy id is provided\n      label: ariaLabelledBy ? undefined : ariaLabel,\n      // use ariaLabelledBy if present, or create an internal label if ariaLabel is present\n      labelId: ariaLabelledBy ?? (ariaLabel && `${chartId}--label`),\n      labelHeadingLevel: isValidHeadingLevel(ariaLabelHeadingLevel)\n        ? ariaLabelHeadingLevel\n        : DEFAULT_A11Y_SETTINGS.labelHeadingLevel,\n      // don't use a description if ariaDescribedBy id is provided\n      description: ariaDescribedBy ? undefined : ariaDescription,\n      // concat all the ids\n      descriptionId: describeBy.length > 0 ? describeBy.join(' ') : undefined,\n      defaultSummaryId,\n      tableCaption: ariaTableCaption,\n    };\n  },\n);\n\nfunction isValidHeadingLevel(ariaLabelHeadingLevel: SettingsSpec['ariaLabelHeadingLevel']): boolean {\n  return ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p'].includes(ariaLabelHeadingLevel);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Point } from '../../utils/point';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getActivePointerPosition = ({ interactions }: GlobalChartState): Point => {\n  return interactions.pointer.pinned?.position ?? interactions.pointer.current.position;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getLegendConfigSelector } from './get_legend_config_selector';\nimport { getLegendSizeSelector } from './get_legend_size';\nimport { LayoutDirection } from '../../utils/common';\nimport { Dimensions } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const getChartContainerDimensionsSelector = createCustomCachedSelector(\n  [getLegendConfigSelector, getLegendSizeSelector, getParentDimension],\n  ({ showLegend, legendPosition: { floating, direction } }, legendSize, parentDimensions): Dimensions =>\n    floating || !showLegend\n      ? parentDimensions\n      : direction === LayoutDirection.Vertical\n        ? {\n            left: 0,\n            top: 0,\n            width: parentDimensions.width - legendSize.width - legendSize.margin * 2,\n            height: parentDimensions.height,\n          }\n        : {\n            left: 0,\n            top: 0,\n            width: parentDimensions.width,\n            height: parentDimensions.height - legendSize.height - legendSize.margin * 2,\n          },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getChartIdSelector = (state: GlobalChartState) => state.chartId;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { Rotation } from '../../utils/common';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport const getChartRotationSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector],\n  (settingsSpec): Rotation => settingsSpec.rotation,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { colorToRgba, overrideOpacity, RGBATupleToString } from '../../common/color_library_wrappers';\nimport { clamp, mergePartial } from '../../utils/common';\nimport { Logger } from '../../utils/logger';\nimport { LIGHT_THEME } from '../../utils/themes/light_theme';\nimport { PartialTheme, Theme } from '../../utils/themes/theme';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport const getChartThemeSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector],\n  (settingsSpec): Theme => getTheme(settingsSpec.baseTheme, settingsSpec.theme),\n);\n\nfunction getTheme(baseTheme?: Theme, theme?: PartialTheme | PartialTheme[]): Theme {\n  const base = baseTheme ?? LIGHT_THEME;\n\n  if (Array.isArray(theme)) {\n    const [firstTheme, ...axillaryThemes] = theme;\n    return validateTheme(mergePartial(base, firstTheme, {}, axillaryThemes));\n  }\n\n  return validateTheme(theme ? mergePartial(base, theme) : base);\n}\n\n/**\n * Validation for final theme object used throughout charts\n *\n * Note: mutates theme in place\n */\nfunction validateTheme(theme: Theme): Theme {\n  const fallbackRGBA = colorToRgba(theme.background.fallbackColor);\n  if (fallbackRGBA[3] !== 1) {\n    Logger.warn(`background.fallbackColor must be opaque, found alpha of ${fallbackRGBA[3]}. Overriding alpha to 1.`);\n    const newFallback = overrideOpacity(fallbackRGBA, 1);\n    theme.background.fallbackColor = RGBATupleToString(newFallback);\n  }\n\n  // heatmap rotation constraint:\n  theme.heatmap.xAxisLabel.rotation = clamp(theme.heatmap.xAxisLabel.rotation, 0, 90);\n\n  return theme;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState, BackwardRef } from '../chart_state';\n\ntype ChartRendererFn = (\n  containerRef: BackwardRef,\n  forwardStageRef: React.RefObject<HTMLCanvasElement>,\n) => JSX.Element | null;\n\n/** @internal */\nexport const getInternalChartRendererSelector = (state: GlobalChartState): ChartRendererFn => {\n  if (state.internalChartState) {\n    return state.internalChartState.chartRenderer;\n  }\n  return () => null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getChartTypeDescriptionSelector = (state: GlobalChartState): string => {\n  if (state.internalChartState) {\n    return state.internalChartState.getChartTypeDescription(state);\n  }\n  // need to return something so there is always a string returned\n  return 'unknown chart type';\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getChartContainerDimensionsSelector } from './get_chart_container_dimensions';\nimport { GlobalChartState } from '../chart_state';\nimport { DebugState } from '../types';\n\n/** @internal */\nexport const getDebugStateSelector = (state: GlobalChartState): DebugState => {\n  if (state.internalChartState) {\n    const { height, width } = getChartContainerDimensionsSelector(state);\n    if (height * width > 0) {\n      return state.internalChartState.getDebugState(state);\n    }\n  }\n  return {};\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getDeselectedSeriesSelector = (state: GlobalChartState) => state.interactions.deselectedDataSeries;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalBrushAreaSelector = (state: GlobalChartState): Dimensions | null => {\n  if (state.internalChartState) {\n    return state.internalChartState.getBrushArea(state);\n  }\n  return null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\n\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalPointerCursor = (state: GlobalChartState): CSSProperties['cursor'] => {\n  return state.internalChartState?.getPointerCursor(state) ?? DEFAULT_CSS_CURSOR;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalIsBrushingSelector = (state: GlobalChartState): boolean => {\n  if (state.internalChartState) {\n    return state.internalChartState.isBrushing(state);\n  }\n  return false;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalIsBrushingAvailableSelector = (state: GlobalChartState): boolean => {\n  if (state.internalChartState) {\n    return state.internalChartState.isBrushAvailable(state);\n  }\n  return false;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const InitStatus = Object.freeze({\n  ParentSizeInvalid: 'ParentSizeInvalid' as const,\n  SpecNotInitialized: 'SpecNotInitialized' as const,\n  MissingChartType: 'MissingChartType' as const,\n  ChartNotInitialized: 'ChartNotInitialized' as const,\n  Initialized: 'Initialized' as const,\n});\n\n/** @internal */\nexport type InitStatus = $Values<typeof InitStatus>;\n\n/** @internal */\nexport const getInternalIsInitializedSelector = (state: GlobalChartState): InitStatus => {\n  const {\n    parentDimensions: { width, height },\n    specsInitialized,\n    internalChartState,\n  } = state;\n\n  if (!specsInitialized) {\n    return InitStatus.SpecNotInitialized;\n  }\n\n  if (!internalChartState) {\n    return InitStatus.MissingChartType;\n  }\n\n  if (width <= 0 || height <= 0) {\n    return InitStatus.ParentSizeInvalid;\n  }\n\n  return internalChartState.isInitialized(state);\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState, TooltipVisibility } from '../chart_state';\n\n/** @internal */\nexport const getInternalIsTooltipVisibleSelector = (state: GlobalChartState): TooltipVisibility => {\n  if (state.internalChartState) {\n    return state.internalChartState.isTooltipVisible(state);\n  }\n  return { visible: false, isExternal: false, displayOnly: false, isPinnable: false };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalMainProjectionAreaSelector = (state: GlobalChartState): Dimensions => {\n  if (state.internalChartState) {\n    return state.internalChartState.getMainProjectionArea(state);\n  }\n  return { width: 0, height: 0, left: 0, top: 0 };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalProjectionContainerAreaSelector = (state: GlobalChartState): Dimensions => {\n  if (state.internalChartState) {\n    return state.internalChartState.getProjectionContainerArea(state);\n  }\n  return { width: 0, height: 0, left: 0, top: 0 };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SmallMultiplesSeriesDomains } from '../../common/panel_utils';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalSmallMultiplesDomains = (state: GlobalChartState): SmallMultiplesSeriesDomains => {\n  if (state.internalChartState) {\n    return state.internalChartState.getSmallMultiplesDomains(state);\n  }\n  return {\n    smHDomain: [],\n    smVDomain: [],\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnchorPosition } from '../../components/portal/types';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalTooltipAnchorPositionSelector = (state: GlobalChartState): AnchorPosition | null => {\n  if (state.internalChartState) {\n    return state.internalChartState.getTooltipAnchor(state);\n  }\n  return null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipInfo } from '../../components/tooltip/types';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalTooltipInfoSelector = (state: GlobalChartState): TooltipInfo | undefined => {\n  if (state.internalChartState) {\n    return state.internalChartState.getTooltipInfo(state);\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport function getLastClickSelector(state: GlobalChartState) {\n  return state.interactions.pointer.lastClick;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport function getLastDragSelector(state: GlobalChartState) {\n  return state.interactions.pointer.lastDrag;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { getLegendPositionConfig } from '../../components/legend/position_style';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport const getLegendConfigSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector],\n  ({\n    flatLegend,\n    legendAction,\n    legendColorPicker,\n    legendMaxDepth,\n    legendSize,\n    legendPosition,\n    legendStrategy,\n    onLegendItemClick,\n    customLegend,\n    showLegend,\n    onLegendItemMinusClick,\n    onLegendItemOut,\n    onLegendItemOver,\n    onLegendItemPlusClick,\n    showLegendExtra,\n  }) => {\n    return {\n      flatLegend,\n      legendAction,\n      legendColorPicker,\n      legendMaxDepth,\n      legendSize,\n      legendPosition: getLegendPositionConfig(legendPosition),\n      legendStrategy,\n      onLegendItemClick,\n      customLegend,\n      showLegend,\n      onLegendItemMinusClick,\n      onLegendItemOut,\n      onLegendItemOver,\n      onLegendItemPlusClick,\n      showLegendExtra,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendItem } from '../../common/legend';\nimport { GlobalChartState } from '../chart_state';\n\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\n\n/** @internal */\nexport const getLegendItemsSelector = (state: GlobalChartState): LegendItem[] => {\n  if (state.internalChartState) {\n    return state.internalChartState.getLegendItems(state);\n  }\n  return EMPTY_LEGEND_LIST;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport interface LegendItemLabel {\n  label: string;\n  depth: number;\n}\n\n/** @internal */\nexport const getLegendItemsLabelsSelector = (state: GlobalChartState): LegendItemLabel[] =>\n  state.internalChartState?.getLegendItemsLabels(state) ?? [];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendItemExtraValues } from '../../common/legend';\nimport { SeriesKey } from '../../common/series_id';\nimport { GlobalChartState } from '../chart_state';\n\nconst EMPTY_ITEM_LIST = new Map<SeriesKey, LegendItemExtraValues>();\n\n/** @internal */\nexport const getLegendExtraValuesSelector = (state: GlobalChartState): Map<SeriesKey, LegendItemExtraValues> => {\n  if (state.internalChartState) {\n    return state.internalChartState.getLegendExtraValues(state);\n  }\n  return EMPTY_ITEM_LIST;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getChartThemeSelector } from './get_chart_theme';\nimport { getLegendConfigSelector } from './get_legend_config_selector';\nimport { getLegendItemsLabelsSelector } from './get_legend_items_labels';\nimport { DEFAULT_FONT_FAMILY } from '../../common/default_theme_attributes';\nimport { LEGEND_HIERARCHY_MARGIN } from '../../components/legend/legend_item';\nimport { LEGEND_TO_FULL_CONFIG } from '../../components/legend/position_style';\nimport { LegendPositionConfig } from '../../specs/settings';\nimport { withTextMeasure } from '../../utils/bbox/canvas_text_bbox_calculator';\nimport { isDefined, LayoutDirection, Position } from '../../utils/common';\nimport { Size } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\nconst getParentDimensionSelector = (state: GlobalChartState) => state.parentDimensions;\n\nconst SCROLL_BAR_WIDTH = 16; // ~1em\nconst MARKER_WIDTH = 16;\nconst SHARED_MARGIN = 4;\nconst VERTICAL_PADDING = 4;\nconst TOP_MARGIN = 2;\n\n/** @internal */\nexport type LegendSizing = Size & {\n  margin: number;\n  position: LegendPositionConfig;\n};\n\n/** @internal */\nexport const getLegendSizeSelector = createCustomCachedSelector(\n  [getLegendConfigSelector, getChartThemeSelector, getParentDimensionSelector, getLegendItemsLabelsSelector],\n  (legendConfig, theme, parentDimensions, labels): LegendSizing => {\n    if (!legendConfig.showLegend) {\n      return { width: 0, height: 0, margin: 0, position: LEGEND_TO_FULL_CONFIG[Position.Right] };\n    }\n\n    const bbox = withTextMeasure((textMeasure) =>\n      labels.reduce(\n        (acc, { label, depth }) => {\n          const { width, height } = textMeasure(\n            label,\n            { fontFamily: DEFAULT_FONT_FAMILY, fontVariant: 'normal', fontWeight: 400, fontStyle: 'normal' },\n            12,\n            1.5,\n          );\n          acc.width = Math.max(acc.width, width + depth * LEGEND_HIERARCHY_MARGIN);\n          acc.height = Math.max(acc.height, height);\n          return acc;\n        },\n        { width: 0, height: 0 },\n      ),\n    );\n\n    const { showLegendExtra: showLegendDisplayValue, legendPosition, legendAction } = legendConfig;\n    const {\n      legend: { verticalWidth, spacingBuffer, margin },\n    } = theme;\n\n    const actionDimension = isDefined(legendAction) ? 24 : 0; // max width plus margin\n    const legendItemWidth = MARKER_WIDTH + SHARED_MARGIN + bbox.width + (showLegendDisplayValue ? SHARED_MARGIN : 0);\n\n    if (legendPosition.direction === LayoutDirection.Vertical) {\n      const legendItemHeight = bbox.height + VERTICAL_PADDING * 2;\n      const legendHeight = legendItemHeight * labels.length + TOP_MARGIN;\n      const scrollBarDimension = legendHeight > parentDimensions.height ? SCROLL_BAR_WIDTH : 0;\n      const staticWidth = spacingBuffer + actionDimension + scrollBarDimension;\n\n      const width = Number.isFinite(legendConfig.legendSize)\n        ? Math.min(Math.max(legendConfig.legendSize, legendItemWidth * 0.3 + staticWidth), parentDimensions.width * 0.7)\n        : Math.floor(Math.min(legendItemWidth + staticWidth, verticalWidth));\n\n      return {\n        width,\n        height: legendHeight,\n        margin,\n        position: legendPosition,\n      };\n    }\n    const isSingleLine = (parentDimensions.width - 20) / 200 > labels.length;\n    const height = Number.isFinite(legendConfig.legendSize)\n      ? Math.min(legendConfig.legendSize, parentDimensions.height * 0.7)\n      : isSingleLine\n        ? bbox.height + 16\n        : bbox.height * 2 + 24;\n\n    return {\n      height,\n      width: Math.floor(Math.min(legendItemWidth + spacingBuffer + actionDimension, verticalWidth)),\n      margin,\n      position: legendPosition,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\nimport { PointerValue } from '../types';\n\n/** @internal */\nexport const getPointerValueSelector = (state: GlobalChartState): PointerValue | undefined => {\n  // TODO: this is taken from the tooltip header currently. Should in the future\n  // be implemented separately (and probably used *as* the tooltip header).\n  const header = state.internalChartState?.getTooltipInfo(state)?.header;\n  if (header) {\n    const { value, formattedValue, valueAccessor } = header;\n    return { value, formattedValue, valueAccessor };\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getChartThemeSelector } from './get_chart_theme';\nimport { colorToRgba, RGBATupleToString } from '../../common/color_library_wrappers';\nimport { Color, Colors } from '../../common/colors';\nimport { TRANSPARENT_LIMIT } from '../../common/fill_text_color';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/**\n * @internal\n */\nexport const getResolvedBackgroundColorSelector = createCustomCachedSelector(\n  [getChartThemeSelector],\n  ({ background: { fallbackColor, color = Colors.Transparent.keyword } }): Color => {\n    let backgroundRGBA = colorToRgba(color);\n\n    if (backgroundRGBA[3] < TRANSPARENT_LIMIT) {\n      backgroundRGBA = colorToRgba(fallbackColor);\n    }\n\n    return RGBATupleToString(backgroundRGBA);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSpecs } from './get_specs';\nimport { ChartType } from '../../chart_types';\nimport { SpecType, DEFAULT_SETTINGS_SPEC } from '../../specs/constants';\nimport { SettingsSpec } from '../../specs/settings';\nimport { debounce } from '../../utils/debounce';\nimport { SpecList } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecsFromStore } from '../utils';\n\nconst DEFAULT_POINTER_UPDATE_DEBOUNCE = 16;\n\n/**\n * @internal\n */\nexport const getSettingsSpecSelector = createCustomCachedSelector([getSpecs], getSettingsSpec);\n\nfunction getSettingsSpec(specs: SpecList): SettingsSpec {\n  const settingsSpecs = getSpecsFromStore<SettingsSpec>(specs, ChartType.Global, SpecType.Settings);\n  const spec = settingsSpecs[0];\n  return spec ? handleListenerDebouncing(spec) : DEFAULT_SETTINGS_SPEC;\n}\n\nfunction handleListenerDebouncing(settings: SettingsSpec): SettingsSpec {\n  const delay = settings.pointerUpdateDebounce ?? DEFAULT_POINTER_UPDATE_DEBOUNCE;\n\n  if (settings.onPointerUpdate) settings.onPointerUpdate = debounce(settings.onPointerUpdate, delay);\n\n  return settings;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSpecs } from './get_specs';\nimport { ChartType } from '../../chart_types';\nimport { SmallMultiplesGroupBy } from '../../common/panel_utils';\nimport { SmallMultiplesSpec, SpecType, GroupBySpec } from '../../specs';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecsFromStore } from '../utils';\n\n/** @internal */\nexport const getSmallMultiplesIndexOrderSelector = createCustomCachedSelector(\n  [getSpecs],\n  (specs): SmallMultiplesGroupBy => {\n    const [smallMultiples] = getSpecsFromStore<SmallMultiplesSpec>(specs, ChartType.Global, SpecType.SmallMultiples);\n    const groupBySpecs = getSpecsFromStore<GroupBySpec>(specs, ChartType.Global, SpecType.IndexOrder);\n\n    return {\n      horizontal: groupBySpecs.find((s) => s.id === smallMultiples?.splitHorizontally),\n      vertical: groupBySpecs.find((s) => s.id === smallMultiples?.splitVertically),\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSpecs } from './get_specs';\nimport { ChartType } from '../../chart_types';\nimport { SpecType } from '../../specs/constants';\nimport { SmallMultiplesSpec } from '../../specs/small_multiples';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecsFromStore, getSpecFromStore } from '../utils';\n\n/**\n * Return the small multiple specs\n * @internal\n */\nexport const getSmallMultiplesSpecs = createCustomCachedSelector([getSpecs], (specs) =>\n  getSpecsFromStore<SmallMultiplesSpec>(specs, ChartType.Global, SpecType.SmallMultiples),\n);\n\n/**\n * Return the small multiple spec\n * @internal\n */\nexport const getSmallMultiplesSpec = createCustomCachedSelector([getSpecs], (specs) =>\n  getSpecFromStore<SmallMultiplesSpec, false>(specs, ChartType.Global, SpecType.SmallMultiples, false),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 're-reselect';\n\nimport { GlobalChartState, SpecList } from '../chart_state';\n\n/**\n * Returns all specs for given chart\n * @internal\n */\nexport const getSpecs: Selector<GlobalChartState, SpecList> = ({ specs }) => specs;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../chart_types';\nimport { Spec, SpecType } from '../../specs';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecsFromStore } from '../utils';\n\n/** @internal */\nexport const getSpecsByType = <S extends Spec>(chartType: ChartType, specType: SpecType) =>\n  createCustomCachedSelector([(state: GlobalChartState) => state.specs], (specs): S[] => {\n    return getSpecsFromStore<S>(specs, chartType, specType);\n  });\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getTooltipInteractionState = ({ interactions }: GlobalChartState) => interactions.tooltip;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipValue } from '../../specs';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport const getTooltipToggledItems = (state: GlobalChartState) => state.interactions.tooltip.selected;\n\n/** @internal */\nexport const getTooltipPinned = (state: GlobalChartState) => state.interactions.tooltip.pinned;\n\n/** @internal */\nexport const getTooltipSelectedItems = createCustomCachedSelector(\n  [getTooltipToggledItems, getTooltipPinned],\n  (toggledItems, tooltipStick): TooltipValue[] => {\n    if (!tooltipStick) {\n      return [];\n    }\n    return toggledItems;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 're-reselect';\n\nimport { getInternalIsTooltipVisibleSelector } from './get_internal_is_tooltip_visible';\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { getTooltipSpecSelector } from './get_tooltip_spec';\nimport type { TooltipProps } from '../../specs';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\nconst getChartId: Selector<GlobalChartState, string> = ({ chartId }) => chartId;\n\n/** @internal */\nconst getTooltipSettingsSingleton = createCustomCachedSelector([getChartId], (): Record<string, never> => ({}));\n\n/** @internal */\nexport const getTooltipSettings = createCustomCachedSelector(\n  [getTooltipSettingsSingleton, getTooltipSpecSelector, getSettingsSpecSelector, getInternalIsTooltipVisibleSelector],\n  (settingsBase, tooltip, { externalPointerEvents }, { isExternal }): TooltipProps => {\n    if (!isExternal) return tooltip;\n\n    return Object.assign(settingsBase, {\n      ...tooltip,\n      ...externalPointerEvents.tooltip,\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSpecs } from './get_specs';\nimport { ChartType } from '../../chart_types';\nimport { SpecType } from '../../specs/constants';\nimport { DEFAULT_TOOLTIP_SPEC, TooltipSpec } from '../../specs/tooltip';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecFromStore } from '../utils';\n\n/**\n * @internal\n */\nexport const getTooltipSpecSelector = createCustomCachedSelector([getSpecs], (specs): TooltipSpec => {\n  const tooltipSpec = getSpecFromStore<TooltipSpec, false>(specs, ChartType.Global, SpecType.Tooltip, false);\n  return tooltipSpec ?? DEFAULT_TOOLTIP_SPEC;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PointerEventType } from '../../specs';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const hasExternalEventSelector = ({ externalEvents: { pointer } }: GlobalChartState) =>\n  pointer !== null && pointer.type !== PointerEventType.Out;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const isBrushingSelector = (state: GlobalChartState): boolean => {\n  return state.interactions.pointer.dragging;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const isInternalChartEmptySelector = (state: GlobalChartState): boolean | undefined => {\n  if (state.internalChartState) {\n    return state.internalChartState.isChartEmpty(state);\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getInternalMainProjectionAreaSelector } from './get_internal_main_projection_area';\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { hasExternalEventSelector } from './has_external_pointer_event';\nimport { getComputedScalesSelector } from '../../chart_types/xy_chart/state/selectors/get_computed_scales';\nimport { PointerEventType } from '../../specs';\nimport { isNil } from '../../utils/common';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\nconst getExternalEventPointer = ({ externalEvents: { pointer } }: GlobalChartState) => pointer;\n\n/** @internal */\nexport const isExternalTooltipVisibleSelector = createCustomCachedSelector(\n  [\n    getSettingsSpecSelector,\n    hasExternalEventSelector,\n    getExternalEventPointer,\n    getComputedScalesSelector,\n    getInternalMainProjectionAreaSelector,\n  ],\n  ({ externalPointerEvents }, hasExternalEvent, pointer, { xScale }, chartDimensions): boolean => {\n    if (\n      !pointer ||\n      pointer.type !== PointerEventType.Over ||\n      isNil(pointer.x) ||\n      externalPointerEvents.tooltip?.visible === false\n    ) {\n      return false;\n    }\n    const x = xScale.pureScale(pointer.x);\n\n    if (Number.isNaN(x) || x > chartDimensions.width + chartDimensions.left || x < 0) {\n      return false;\n    }\n    return Boolean(hasExternalEvent && externalPointerEvents.tooltip?.visible);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { FC, useEffect, useMemo } from 'react';\nimport { useDispatch } from 'react-redux';\nimport { bindActionCreators } from 'redux';\nimport { OptionalKeys, RequiredKeys } from 'utility-types';\n\nimport { upsertSpec as upsertSpecAction, removeSpec as removeSpecAction } from './actions/specs';\nimport { Spec as Spec } from '../specs';\nimport { stripUndefined } from '../utils/common';\n\n/** @internal */\nexport interface DispatchProps {\n  upsertSpec: typeof upsertSpecAction;\n  removeSpec: typeof removeSpecAction;\n}\n\n/**\n * Used inside custom spec component to link component to state as new spec\n * @internal\n */\nexport function useSpecFactory<Props extends Spec>(props: Props) {\n  const dispatch = useDispatch();\n  const { upsertSpec, removeSpec } = useMemo(\n    () => ({\n      upsertSpec: bindActionCreators(upsertSpecAction, dispatch),\n      removeSpec: bindActionCreators(removeSpecAction, dispatch),\n    }),\n    [dispatch],\n  );\n\n  useEffect(() => {\n    upsertSpec(props);\n  });\n  useEffect(\n    () => () => {\n      removeSpec(props.id);\n    },\n    [], // eslint-disable-line react-hooks/exhaustive-deps\n  );\n}\n\n/**\n * Creates spec component factory given overrides and default props.\n *\n * To use this you must pass the Spec type via empty function call...\n *\n * ```ts\n * const MyThing = specComponentFactory<MyThingSpec>()(overrides, defaults)\n * ```\n *\n * > IMPORTANT: Both `overrides` and `defaults` should __NOT__ have explicit types.\n * > The types are determined automatically from thier implicitly defined types, while still\n * > enforing that the types are derived from the defined `Spec`.\n * @internal\n */\nexport const specComponentFactory =\n  <S extends Spec>() =>\n  <\n    Overrides extends SFOverrideKeys<S>,\n    Defaults extends SFDefaultKeys<S, Overrides>,\n    Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n    Requires extends SFRequiredKeys<S, Overrides, Defaults, Optionals>,\n  >(\n    overrides: SFOverrides<S, Overrides>,\n    defaults: SFDefaults<S, Overrides, Defaults>,\n  ): FC<SFProps<S, Overrides, Defaults, Optionals, Requires>> => {\n    return (props) => {\n      // @ts-ignore - All Spec keys are guaranteed to be included\n      useSpecFactory<S>({ ...defaults, ...stripUndefined(props), ...overrides });\n      return null;\n    };\n  };\n\n/**\n * Takes in prop overrides and defaults with enforced types.\n * Determines implicit types of optional and required props.\n *\n * To use this you must pass the Spec type via empty function call...\n *\n * ```ts\n * const MyThingBuildProps = buildSFProps<MyThingSpec>()(overrides, defaults)\n * ```\n *\n * > IMPORTANT: Both `overrides` and `defaults` should __NOT__ have explicit types.\n * > The types are determined automatically from thier implicitly defined types, while still\n * > enforing that the types are derived from the defined `Spec`.\n * @internal\n */\nexport const buildSFProps =\n  <S extends Spec>() =>\n  <\n    Overrides extends SFOverrideKeys<S>,\n    Defaults extends SFDefaultKeys<S, Overrides>,\n    Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n    Requires extends SFRequiredKeys<S, Overrides, Defaults, Optionals>,\n  >(\n    overrides: SFOverrides<S, Overrides>,\n    defaults: SFDefaults<S, Overrides, Defaults>,\n  ): BuildProps<S, Overrides, Defaults, Optionals, Requires> => ({\n    overrides,\n    defaults,\n    optionals: {} as Pick<S, Optionals>, // used to transfer type only\n    requires: {} as Pick<S, Requires>, // used to transfer type only\n  });\n\n/*\n------------------------------------------------------------\n  Reused types to maintain single source of truth\n------------------------------------------------------------\n*/\n\n/**\n * Resulting props for spec given overrides, defaults, optionals and required props\n * @public\n */\nexport type SFProps<\n  S extends Spec,\n  Overrides extends SFOverrideKeys<S>,\n  Defaults extends SFDefaultKeys<S, Overrides>,\n  Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n  Requires extends SFRequiredKeys<S, Overrides, Defaults, Optionals>,\n> = Pick<S, Optionals | Requires> & Partial<Pick<S, Defaults>>;\n\n/** @public */\nexport interface BuildProps<\n  S extends Spec,\n  Overrides extends SFOverrideKeys<S>,\n  Defaults extends SFDefaultKeys<S, Overrides>,\n  Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n  Requires extends SFRequiredKeys<S, Overrides, Defaults, Optionals>,\n> {\n  overrides: SFOverrides<S, Overrides>;\n  defaults: SFDefaults<S, Overrides, Defaults>;\n  /** @deprecated - ignore - used only as type do not use as value */\n  optionals: Pick<S, Optionals>;\n  /** @deprecated - ignore - used only as type do not use as value */\n  requires: Pick<S, Requires>;\n}\n\n/** All specs __must__ provide these as overrides */\ntype RequiredSpecProps = keyof Pick<Spec, 'chartType' | 'specType'>;\n\n/* Types defining keys */\ntype SFOverrideKeys<S extends Spec> = keyof S;\ntype SFDefaultKeys<S extends Spec, Overrides extends keyof S> = keyof Omit<S, Overrides>;\ntype SFOptionalKeys<\n  S extends Spec,\n  Overrides extends keyof S,\n  Defaults extends keyof Omit<S, Overrides>,\n> = OptionalKeys<Omit<S, Overrides | Defaults>>;\ntype SFRequiredKeys<\n  S extends Spec,\n  Overrides extends keyof S,\n  Defaults extends keyof Omit<S, Overrides>,\n  Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n> = RequiredKeys<Omit<S, Overrides | Defaults | Optionals>>;\n\n/* Object types defined from key types above */\ntype SFOverrides<S extends Spec, Overrides extends keyof S> = Required<Pick<S, Overrides | RequiredSpecProps>>;\ntype SFDefaults<\n  S extends Spec,\n  Overrides extends SFOverrideKeys<S>,\n  Defaults extends SFDefaultKeys<S, Overrides>,\n> = Required<Pick<S, Defaults>>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport type { Cell } from '../chart_types/heatmap/layout/types/viewmodel_types';\nimport { Pixels } from '../common/geometry';\nimport { AnnotationType, BaseDatum, LineAnnotationDatum, RectAnnotationDatum } from '../specs';\nimport { Accessor } from '../utils/accessor';\nimport type { Datum, Position } from '../utils/common';\nimport type { GeometryValue } from '../utils/geometry';\nimport { LineAnnotationStyle, RectAnnotationStyle } from '../utils/themes/theme';\n\n/** @public */\nexport interface DebugStateAxis {\n  id: string;\n  position: Position;\n  title?: string;\n  labels: string[];\n  values: any[];\n  gridlines: {\n    y: number;\n    x: number;\n  }[];\n}\n\n/** @public */\nexport interface DebugStateAxes {\n  x: DebugStateAxis[];\n  y: DebugStateAxis[];\n}\n\n/** @public */\nexport interface DebugStateLegendItem {\n  key: string;\n  name: string;\n  color: string;\n}\n\n/** @public */\nexport interface DebugStateLegend {\n  items: DebugStateLegendItem[];\n}\n\n/** @public */\nexport interface DebugStateBase {\n  key: string;\n  name: string;\n  color: string;\n}\n\n/** @public */\nexport type DebugStateValue = Pick<GeometryValue, 'x' | 'y' | 'mark'>;\n\n/**@public */\nexport interface DebugStateLineConfig {\n  visible: boolean;\n  path: string;\n  points: DebugStateValue[];\n  visiblePoints: boolean;\n}\n\n/** @public */\nexport interface DebugStateLine extends DebugStateBase, DebugStateLineConfig {}\n\n/** @public */\nexport type DebugStateArea = Omit<DebugStateLine, 'points' | 'visiblePoints'> & {\n  path: string;\n  lines: {\n    y0?: DebugStateLineConfig;\n    y1: DebugStateLineConfig;\n  };\n};\n\n/** @public */\nexport type DebugStateBar = DebugStateBase & {\n  visible: boolean;\n  bars: DebugStateValue[];\n  labels: any[];\n};\n\ntype CellDebug = Pick<Cell, 'value' | 'formatted' | 'x' | 'y' | 'datum'> & { fill: string };\n\ntype HeatmapDebugState = {\n  cells: CellDebug[];\n  selection: {\n    area: { x: number; y: number; width: number; height: number } | null;\n    data: { x: Array<string | number>; y: Array<string | number> } | null;\n  };\n};\n\n/** @public */\nexport type SinglePartitionDebugState = {\n  name: string;\n  depth: number;\n  color: string;\n  value: number;\n  coords: [Pixels, Pixels];\n};\n\n/** @public */\nexport type PartitionDebugState = {\n  panelTitle: string;\n  partitions: Array<SinglePartitionDebugState>;\n};\n\n/** @public */\nexport type DebugStateAnnotations = {\n  id: string;\n  style: RectAnnotationStyle | LineAnnotationStyle;\n  type: typeof AnnotationType.Line | typeof AnnotationType.Rectangle;\n  domainType?: 'xDomain' | 'yDomain';\n  data: LineAnnotationDatum | RectAnnotationDatum;\n};\n\n/**\n * Describes _visible_ chart state for use in functional tests\n *\n * TODO: add other chart types to debug state\n * @public\n */\nexport interface DebugState {\n  legend?: DebugStateLegend;\n  axes?: DebugStateAxes;\n  areas?: DebugStateArea[];\n  lines?: DebugStateLine[];\n  bars?: DebugStateBar[];\n  annotations?: DebugStateAnnotations[];\n  /** Heatmap chart debug state */\n  heatmap?: HeatmapDebugState;\n  partition?: PartitionDebugState[];\n}\n\n/**\n * Contains the value of the non-dependent variable at the point where the mouse\n * pointer is.\n *\n * @public\n */\nexport interface PointerValue<D extends BaseDatum = Datum> {\n  /**\n   * The value\n   */\n  value: any;\n  /**\n   * The formatted value to display\n   */\n  formattedValue: string;\n  /**\n   * The accessor linked to the current tooltip value\n   */\n  valueAccessor?: Accessor<D>;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PointerState, PointerStates, SpecList, TooltipInteractionState } from './chart_state';\nimport { ChartType } from '../chart_types';\nimport { Spec } from '../specs';\n\n/**\n * Returns all matching specs\n * @internal\n */\nexport function getSpecsFromStore<U extends Spec>(specs: SpecList, chartType: ChartType, specType: string): U[] {\n  return Object.values(specs).filter((spec) => spec.chartType === chartType && spec.specType === specType) as U[];\n}\n\n/**\n * Returns first matching spec\n * @internal\n * TODO: Make these generator types automatic\n */\nexport function getSpecFromStore<U extends Spec, R extends boolean, RR = R extends true ? never : null>(\n  specs: SpecList,\n  chartType: ChartType,\n  specType: string,\n  required: R,\n): U | RR {\n  const spec = Object.values(specs).find((spec) => spec.chartType === chartType && spec.specType === specType) as U;\n\n  if (!spec && required) throw new Error(`Unable to find spec [${chartType} = ${specType}]`);\n\n  return spec ?? null;\n}\n\n/** @internal */\nexport function isClicking(prevClick: PointerState | null, lastClick: PointerState | null) {\n  return lastClick && (!prevClick || prevClick.time !== lastClick.time);\n}\n\n/** @internal */\nexport const getInitialPointerState = (): PointerStates => ({\n  dragging: false,\n  current: { position: { x: -1, y: -1 }, time: 0 },\n  pinned: null,\n  down: null,\n  up: null,\n  lastDrag: null,\n  lastClick: null,\n});\n\n/** @internal */\nexport const getInitialTooltipState = (): TooltipInteractionState => ({\n  pinned: false,\n  selected: [],\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BaseDatum } from '../chart_types/specs';\n\n/**\n * Accessor function\n * @param datum - the datum\n * @public\n */\nexport interface UnaryAccessorFn<D extends BaseDatum = any, Return = any> {\n  /**\n   * Name used as accessor field name in place of function reference\n   */\n  fieldName?: string;\n  (datum: D): Return;\n}\n\n/**\n * Accessor function\n * @param datum - the datum\n * @param index - the index in the array\n * @public\n */\nexport type BinaryAccessorFn<D extends BaseDatum = any, Return = any> = (datum: D, index: number) => Return;\n\n/**\n * An accessor function\n * @public\n */\nexport type AccessorFn<D extends BaseDatum = any, Return = any> = UnaryAccessorFn<D, Return>;\n\n/**\n * An indexed accessor function\n * @public\n */\nexport type IndexedAccessorFn<D extends BaseDatum = any, Return = any> =\n  | UnaryAccessorFn<D, Return>\n  | BinaryAccessorFn<D, Return>;\n\n/**\n * A key accessor string\n * @public\n */\nexport type AccessorObjectKey = string;\n\n/**\n * An index accessor number\n * @public\n */\nexport type AccessorArrayIndex = number;\n\n/**\n * Need to check for array to exclude array prototype keys.\n *\n * TODO: tighten keyof types by removing string fallback. This will make it harder to satisfy the\n * types for complex data values.\n *\n * Note: ignores symbols as keys\n * @public\n */\nexport type DatumKey<D extends BaseDatum> = D extends any[] ? number : Exclude<keyof D, symbol> | string;\n\n/**\n * A datum accessor in form of object key accessor string/number\n * @public\n */\nexport type Accessor<D extends BaseDatum = never> = DatumKey<D> | AccessorObjectKey | AccessorArrayIndex;\n\n/**\n * Accessor format for _banded_ series as postfix string or accessor function\n * @public\n */\nexport type AccessorFormat = string | ((value: string) => string);\n\n/**\n * Return an accessor function using the accessor passed as argument\n * @param accessor the spec accessor\n * @internal\n */\nexport function getAccessorFn<D extends BaseDatum>(accessor: Accessor<D>): AccessorFn<D> {\n  return (datum: D) =>\n    typeof datum === 'object' && datum !== null ? datum[accessor as keyof typeof datum] : undefined;\n}\n\n/**\n * Return the accessor label given as `AccessorFormat`\n * @internal\n */\nexport function getAccessorFormatLabel(accessor: AccessorFormat, label: string): string {\n  if (typeof accessor === 'string') {\n    return `${label}${accessor}`;\n  }\n\n  return accessor(label);\n}\n\n/**\n * Helper function to get accessor value from string, number or function\n * @internal\n */\nexport function getAccessorValue<D extends BaseDatum>(datum: D, accessor: Accessor<D> | AccessorFn<D>) {\n  if (typeof accessor === 'function') {\n    return accessor(datum);\n  }\n\n  try {\n    // @ts-ignore - could throw error if not proper key accessed\n    return datum[accessor];\n  } catch {\n    return undefined;\n  }\n}\n\n/**\n * Additive numbers: numbers whose semantics are conducive to addition; eg. counts and sums are additive, but averages aren't\n * @public\n */\nexport type AdditiveNumber = number;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { cssFontShorthand, Font } from '../../common/text_utils';\nimport { withContext } from '../../renderers/canvas';\nimport { Size } from '../dimensions';\n\n/** @internal */\nexport const withTextMeasure = <T>(fun: (textMeasure: TextMeasure) => T) => {\n  const canvas = document.createElement('canvas');\n  const ctx = canvas.getContext('2d');\n  return fun(ctx ? measureText(ctx) : () => ({ width: 0, height: 0 }));\n};\n\n/** @internal */\nexport type TextMeasure = (text: string, font: Omit<Font, 'textColor'>, fontSize: number, lineHeight?: number) => Size;\n\n/** @internal */\nexport function measureText(ctx: CanvasRenderingContext2D): TextMeasure {\n  return (text, font, fontSize, lineHeight = 1) =>\n    withContext(ctx, (ctx): Size => {\n      if (text.length === 0) {\n        // TODO this is a temporary fix to make the multilayer time axis work\n        return { width: 0, height: fontSize * lineHeight };\n      }\n      ctx.font = cssFontShorthand(font, fontSize);\n      const { width } = ctx.measureText(text);\n      return { width, height: fontSize * lineHeight };\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @public */\nexport type ChartSizeArray = [number | string | undefined, number | string | undefined];\n/** @public */\nexport interface ChartSizeObject {\n  width?: number | string;\n  height?: number | string;\n}\n\n/** @public */\nexport type ChartSize = number | string | ChartSizeArray | ChartSizeObject;\n\n/** @internal */\nexport function getChartSize(size?: ChartSize): Required<ChartSizeObject> {\n  if (Array.isArray(size)) {\n    return {\n      width: size[0] === undefined ? '100%' : size[0],\n      height: size[1] === undefined ? '100%' : size[1],\n    };\n  }\n  if (typeof size === 'object') {\n    return {\n      width: size.width === undefined ? '100%' : size.width,\n      height: size.height === undefined ? '100%' : size.height,\n    };\n  }\n  const sameSize = size === undefined ? '100%' : size;\n  return {\n    width: sameSize,\n    height: sameSize,\n  };\n}\n\n/**\n * Return the requested size if specified in pixel, null otherwise\n * @internal\n */\nexport function getFixedChartSize(size?: ChartSize): { width: number; height: number } | null {\n  const { width, height } = getChartSize(size);\n  return typeof height === 'number' && typeof width === 'number' ? { width, height } : null;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// NOTE: to switch implementation just change the imported file (moment,luxon)\nimport {\n  addTimeToObj,\n  timeObjToUnixTimestamp,\n  startTimeOfObj,\n  endTimeOfObj,\n  timeObjFromAny,\n  timeObjToUTCOffset,\n  subtractTimeToObj,\n  formatTimeObj,\n  diffTimeObjs,\n} from './moment';\nimport { CalendarIntervalUnit, DateTime, FixedIntervalUnit, Minutes, UnixTimestamp } from './types';\n\n/** @internal */\nexport function addTime(\n  dateTime: DateTime,\n  timeZone: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n  count: number,\n): UnixTimestamp {\n  return timeObjToUnixTimestamp(addTimeToObj(getTimeObj(dateTime, timeZone), unit, count));\n}\n\n/** @internal */\nexport function subtractTime(\n  dateTime: DateTime,\n  timeZone: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n  count: number,\n): UnixTimestamp {\n  return timeObjToUnixTimestamp(subtractTimeToObj(getTimeObj(dateTime, timeZone), unit, count));\n}\n\n/** @internal */\nexport function getUnixTimestamp(dateTime: DateTime, timeZone?: string): UnixTimestamp {\n  return timeObjToUnixTimestamp(getTimeObj(dateTime, timeZone));\n}\n\n/** @internal */\nexport function startOf(\n  dateTime: DateTime,\n  timeZone: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n): UnixTimestamp {\n  return timeObjToUnixTimestamp(startTimeOfObj(getTimeObj(dateTime, timeZone), unit));\n}\n\n/** @internal */\nexport function endOf(\n  dateTime: DateTime,\n  timeZone: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n): UnixTimestamp {\n  return timeObjToUnixTimestamp(endTimeOfObj(getTimeObj(dateTime, timeZone), unit));\n}\n\nfunction getTimeObj(dateTime: DateTime, timeZone?: string) {\n  return timeObjFromAny(dateTime, timeZone);\n}\n\n/** @internal */\nexport function getUTCOffset(dateTime: DateTime, timeZone?: string): Minutes {\n  return timeObjToUTCOffset(getTimeObj(dateTime, timeZone));\n}\n\n/** @internal */\nexport function formatTime(dateTime: DateTime, timeZone: string | undefined, format: string) {\n  return formatTimeObj(getTimeObj(dateTime, timeZone), format);\n}\n\n/** @internal */\nexport function diff(\n  dateTime1: DateTime,\n  timeZone1: string | undefined,\n  dateTime2: DateTime,\n  timeZone2: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n) {\n  return diffTimeObjs(getTimeObj(dateTime1, timeZone1), getTimeObj(dateTime2, timeZone2), unit);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { addTime, endOf, getUnixTimestamp, getUTCOffset, startOf } from './chrono';\nimport { CalendarIntervalUnit, FixedIntervalUnit, UnixTimestamp } from './types';\nimport { TimeMs } from '../../common/geometry';\n\n/**\n * An [Elasticsearch Calendar interval unit](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#calendar_intervals)\n * @public\n */\nexport type ESCalendarIntervalUnit =\n  | 'minute'\n  | 'm'\n  | 'hour'\n  | 'h'\n  | 'day'\n  | 'd'\n  | 'week'\n  | 'w'\n  | 'month'\n  | 'M'\n  | 'quarter'\n  | 'q'\n  | 'year'\n  | 'y';\n\n/**\n * An [Elasticsearch fixed interval unit](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#fixed_intervals)\n * @public\n */\nexport type ESFixedIntervalUnit = 'ms' | 's' | 'm' | 'h' | 'd';\n\n/** @internal */\nexport const ES_FIXED_INTERVAL_UNIT_TO_BASE: Record<ESFixedIntervalUnit, TimeMs> = {\n  ms: 1,\n  s: 1000,\n  m: 1000 * 60,\n  h: 1000 * 60 * 60,\n  d: 1000 * 60 * 60 * 24,\n};\n\n/**\n * The definition of an [Elasticsearch Calendar interval](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#calendar_intervals)\n * @public\n */\nexport interface ESCalendarInterval {\n  type: 'calendar';\n  unit: ESCalendarIntervalUnit;\n  value: number;\n}\n\n/**\n * The definition of an [Elasticsearch fixed interval](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#fixed_intervals)\n * @public\n */\nexport interface ESFixedInterval {\n  type: 'fixed';\n  unit: ESFixedIntervalUnit;\n  value: number;\n}\n\nconst esCalendarIntervalToChronoInterval: Record<ESCalendarIntervalUnit, CalendarIntervalUnit | FixedIntervalUnit> = {\n  minute: 'minute',\n  m: 'minute',\n  hour: 'hour',\n  h: 'hour',\n  day: 'day',\n  d: 'day',\n  week: 'week',\n  w: 'week',\n  month: 'month',\n  M: 'month',\n  quarter: 'quarter',\n  q: 'quarter',\n  year: 'year',\n  y: 'year',\n};\n\n/**\n * Round a Date or unix timestamp to the beginning or end of the corresponding Elasticsearch date histogram bucket.\n * It uses the [date histogram aggregation Elasticsearch formula](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#datehistogram-aggregation-time-zone)\n * to compute the fixed interval bucket, and it uses an internal selected date/time library to compute the calendar one.\n *\n * @param date - a unix timestamp or a Date object\n * @param interval - the description of the Elasticsearch interval you want to round to\n * @param snapTo - if you want to snap the date at the `start` or at the `end` of the interval\n * @param timeZone - a IANA timezone\n * @public\n */\nexport function roundDateToESInterval(\n  date: UnixTimestamp | Date,\n  interval: ESCalendarInterval | ESFixedInterval,\n  snapTo: 'start' | 'end',\n  timeZone: string,\n): UnixTimestamp {\n  return isCalendarInterval(interval)\n    ? esCalendarIntervalSnap(date, interval, snapTo, timeZone)\n    : esFixedIntervalSnap(date, interval, snapTo, timeZone);\n}\n\nfunction isCalendarInterval(interval: ESCalendarInterval | ESFixedInterval): interval is ESCalendarInterval {\n  return interval.type === 'calendar';\n}\n\nfunction esCalendarIntervalSnap(\n  date: number | Date,\n  interval: ESCalendarInterval,\n  snapTo: 'start' | 'end',\n  timeZone?: string,\n) {\n  return snapTo === 'start'\n    ? startOf(date, timeZone, esCalendarIntervalToChronoInterval[interval.unit])\n    : endOf(date, timeZone, esCalendarIntervalToChronoInterval[interval.unit]);\n}\n\nfunction esFixedIntervalSnap(\n  date: number | Date,\n  interval: ESFixedInterval,\n  snapTo: 'start' | 'end',\n  timeZone: string,\n): UnixTimestamp {\n  const unitMultiplier = interval.value * ES_FIXED_INTERVAL_UNIT_TO_BASE[interval.unit];\n  const unixTimestamp = getUnixTimestamp(date, timeZone);\n  const utcOffsetInMs = getUTCOffset(date, timeZone) * 60 * 1000;\n  const roundedDate = Math.floor((unixTimestamp + utcOffsetInMs) / unitMultiplier) * unitMultiplier - utcOffsetInMs;\n  return snapTo === 'start' ? roundedDate : roundedDate + unitMultiplier - 1;\n}\n\n/** @internal */\nexport function timeRange(\n  from: number,\n  to: number,\n  interval: ESCalendarInterval | ESFixedInterval,\n  timeZone: string,\n): number[] {\n  return interval.type === 'fixed'\n    ? fixedTimeRange(from, to, interval, timeZone)\n    : calendarTimeRange(from, to, interval, timeZone);\n}\n\nfunction calendarTimeRange(from: number, to: number, interval: ESCalendarInterval, timeZone: string): number[] {\n  const snappedFrom = roundDateToESInterval(from, interval, 'start', timeZone);\n  const snappedTo = roundDateToESInterval(to, interval, 'start', timeZone);\n  const values: number[] = [snappedFrom];\n  let current = snappedFrom;\n  while (addTime(current, timeZone, esCalendarIntervalToChronoInterval[interval.unit], interval.value) < snappedTo) {\n    current = addTime(current, timeZone, esCalendarIntervalToChronoInterval[interval.unit], interval.value);\n    values.push(current);\n  }\n  return values;\n}\n\nfunction fixedTimeRange(from: number, to: number, interval: ESFixedInterval, timeZone: string): number[] {\n  const snappedFrom = roundDateToESInterval(from, interval, 'start', timeZone);\n  const snappedTo = roundDateToESInterval(to, interval, 'start', timeZone);\n  const utcTo = localToUTC(snappedTo, timeZone);\n  let current = localToUTC(snappedFrom, timeZone);\n  const values: number[] = [current];\n  while (current + interval.value * ES_FIXED_INTERVAL_UNIT_TO_BASE[interval.unit] < utcTo) {\n    current = current + interval.value * ES_FIXED_INTERVAL_UNIT_TO_BASE[interval.unit];\n    values.push(current);\n  }\n  // filtering duplicates that can be generated around DST\n  return [...new Set(values.map((d) => utcToLocal(d, timeZone)))];\n}\n\n/** @internal */\nexport function addIntervalToTime(time: number, interval: ESCalendarInterval | ESFixedInterval, timeZone: string) {\n  return interval.type === 'fixed'\n    ? utcToLocal(localToUTC(time, timeZone) + interval.value * ES_FIXED_INTERVAL_UNIT_TO_BASE[interval.unit], timeZone)\n    : addTime(time, timeZone, esCalendarIntervalToChronoInterval[interval.unit], interval.value);\n}\n\nfunction utcToLocal(time: number, timeZone: string) {\n  return time - getUTCOffset(time, timeZone) * 60 * 1000;\n}\nfunction localToUTC(time: number, timeZone: string) {\n  return time + getUTCOffset(time, timeZone) * 60 * 1000;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment-timezone';\n\nimport { CalendarIntervalUnit, CalendarObj, DateTime, FixedIntervalUnit, Minutes, UnixTimestamp } from './types';\n\n/** @internal */\nexport const timeObjFromCalendarObj = (\n  yearMonthDayHour: Partial<CalendarObj>,\n  timeZone: string = 'browser',\n): moment.Moment =>\n  timeZone\n    ? moment.tz(\n        {\n          ...yearMonthDayHour,\n          month: typeof yearMonthDayHour.month === 'number' ? yearMonthDayHour.month - 1 : undefined,\n        },\n        timeZone,\n      )\n    : moment({\n        ...yearMonthDayHour,\n        month: typeof yearMonthDayHour.month === 'number' ? yearMonthDayHour.month - 1 : undefined,\n      });\n\n/** @internal */\nexport const timeObjFromUnixTimestamp = (unixTimestamp: UnixTimestamp, timeZone?: string): moment.Moment =>\n  timeZone ? moment.tz(unixTimestamp, timeZone) : moment(unixTimestamp);\n\n/** @internal */\nexport const timeObjFromDate = (date: Date, timeZone?: string): moment.Moment =>\n  timeZone ? moment.tz(date, timeZone) : moment(date);\n\n/** @internal */\nexport const timeObjFromAny = (time: DateTime, timeZone?: string): moment.Moment => {\n  return typeof time === 'number'\n    ? timeObjFromUnixTimestamp(time, timeZone)\n    : time instanceof Date\n      ? timeObjFromDate(time, timeZone)\n      : timeObjFromCalendarObj(time, timeZone);\n};\n\n/** @internal */\nexport const timeObjToSeconds = (t: moment.Moment) => t.unix();\n/** @internal */\nexport const timeObjToUnixTimestamp = (t: moment.Moment): UnixTimestamp => t.valueOf();\n/** @internal */\nexport const timeObjToWeekday = (t: moment.Moment) => t.isoWeekday();\n/** @internal */\nexport const timeObjToYear = (t: moment.Moment) => t.year();\n/** @internal */\nexport const addTimeToObj = (obj: moment.Moment, unit: CalendarIntervalUnit | FixedIntervalUnit, count: number) =>\n  obj.add(count, unit);\n/** @internal */\nexport const subtractTimeToObj = (obj: moment.Moment, unit: CalendarIntervalUnit | FixedIntervalUnit, count: number) =>\n  obj.subtract(count, unit);\n/** @internal */\nexport const startTimeOfObj = (obj: moment.Moment, unit: CalendarIntervalUnit | FixedIntervalUnit) =>\n  obj.startOf(unit === 'week' ? 'isoWeek' : unit); // we should use the ISO week to align to ES\n\n/** @internal */\nexport const endTimeOfObj = (obj: moment.Moment, unit: CalendarIntervalUnit | FixedIntervalUnit) =>\n  obj.endOf(unit === 'week' ? 'isoWeek' : unit); // we should use the ISO week to align to ES\n\n/** @internal */\nexport const timeObjToUTCOffset = (obj: moment.Moment): Minutes => obj.utcOffset();\n\n/** @internal */\nexport const formatTimeObj = (obj: moment.Moment, format: string): string => obj.format(format);\n\n/** @internal */\nexport const diffTimeObjs = (\n  obj1: moment.Moment,\n  obj2: moment.Moment,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n): number => obj1.diff(obj2, unit);\n\n/** @internal */\nexport const TOKENS = {\n  year: 'Y',\n  year2DGT: 'YY',\n  year4DGT: 'YYYY',\n  monthNPD: 'M',\n  monthORD: 'Mo',\n  monthPD: 'MM',\n  monthAbr: 'MMM',\n  monthFull: 'MMMM',\n  dayOfMonthNP: 'D',\n  dayOfMonthORD: 'Do',\n  dayOfMonthPD: 'DD',\n  dayOfYNP: 'DDD',\n  dayOfYORD: 'DDDo',\n  dayOfYPD: 'DDDD',\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { ComponentType, isValidElement, ReactNode } from 'react';\nimport { $Values, isPrimitive } from 'utility-types';\nimport { v1 as uuidv1 } from 'uuid';\n\nimport { AdditiveNumber } from './accessor';\nimport { Point } from './point';\nimport { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { Color, Colors } from '../common/colors';\nimport { Degrees, Radian } from '../common/geometry';\nimport { BaseDatum } from '../specs';\n\n/** @public */\nexport const Position = Object.freeze({\n  Top: 'top' as const,\n  Bottom: 'bottom' as const,\n  Left: 'left' as const,\n  Right: 'right' as const,\n});\n/** @public */\nexport type Position = $Values<typeof Position>;\n\n/** @public */\nexport const LayoutDirection = Object.freeze({\n  Horizontal: 'horizontal' as const,\n  Vertical: 'vertical' as const,\n});\n/** @public */\nexport type LayoutDirection = $Values<typeof LayoutDirection>;\n\n/**\n * Color variants that are unique to `@elastic/charts`. These go beyond the standard\n * static color allocations.\n * @public\n */\nexport const ColorVariant = Object.freeze({\n  /**\n   * Uses series color. Rather than setting a static color, this will use the\n   * default series color for a given series.\n   */\n  Series: '__use__series__color__' as const,\n  /**\n   * Uses empty color, similar to transparent.\n   */\n  None: '__use__empty__color__' as const,\n  /**\n   * Computes best color based on background contrast\n   */\n  Adaptive: '__use__adaptive__color__' as const,\n});\n/** @public */\nexport type ColorVariant = $Values<typeof ColorVariant>;\n\n/** @public */\nexport const HorizontalAlignment = Object.freeze({\n  Center: 'center' as const,\n  Right: Position.Right,\n  Left: Position.Left,\n  /**\n   * Aligns to near side of axis depending on position\n   *\n   * Examples:\n   * - Left Axis, `Near` will push the label to the `Right`, _near_ the axis\n   * - Right Axis, `Near` will push the axis labels to the `Left`\n   * - Top/Bottom Axes, `Near` will default to `Center`\n   */\n  Near: 'near' as const,\n  /**\n   * Aligns to far side of axis depending on position\n   *\n   * Examples:\n   * - Left Axis, `Far` will push the label to the `Left`, _far_ from the axis\n   * - Right Axis, `Far` will push the axis labels to the `Right`\n   * - Top/Bottom Axes, `Far` will default to `Center`\n   */\n  Far: 'far' as const,\n});\n\n/**\n * Horizontal text alignment\n * @public\n */\nexport type HorizontalAlignment = $Values<typeof HorizontalAlignment>;\n\n/** @public */\nexport const VerticalAlignment = Object.freeze({\n  Middle: 'middle' as const,\n  Top: Position.Top,\n  Bottom: Position.Bottom,\n  /**\n   * Aligns to near side of axis depending on position\n   *\n   * Examples:\n   * - Top Axis, `Near` will push the label to the `Right`, _near_ the axis\n   * - Bottom Axis, `Near` will push the axis labels to the `Left`\n   * - Left/Right Axes, `Near` will default to `Middle`\n   */\n  Near: 'near' as const,\n  /**\n   * Aligns to far side of axis depending on position\n   *\n   * Examples:\n   * - Top Axis, `Far` will push the label to the `Top`, _far_ from the axis\n   * - Bottom Axis, `Far` will push the axis labels to the `Bottom`\n   * - Left/Right Axes, `Far` will default to `Middle`\n   */\n  Far: 'far' as const,\n});\n\n/**\n * Vertical text alignment\n * @public\n */\nexport type VerticalAlignment = $Values<typeof VerticalAlignment>;\n\n/** @public */\nexport type Datum = any; // unknown;\n/** @public */\nexport type Rotation = 0 | 90 | -90 | 180;\n/** @public */\nexport type Rendering = 'canvas' | 'svg';\n/** @public */\nexport type StrokeStyle = Color; // now narrower than string | CanvasGradient | CanvasPattern\n\n/** @internal */\nexport function compareByValueAsc(a: number | string, b: number | string): number {\n  return a > b ? 1 : a < b ? -1 : 0;\n}\n\n/** @internal */\nexport function clamp(value: number, lowerBound: number, upperBound: number): number {\n  return Math.min(Math.max(value, lowerBound), upperBound);\n}\n\n/**\n * Returns color given any color variant\n *\n * @internal\n */\nexport function getColorFromVariant(seriesColor: Color, color?: Color | ColorVariant): Color {\n  if (color === ColorVariant.Series) {\n    return seriesColor;\n  }\n\n  if (color === ColorVariant.None) {\n    return Colors.Transparent.keyword;\n  }\n\n  return color || seriesColor;\n}\n\n/** @internal */\nexport const degToRad = (angle: Degrees): Radian => (angle / 180) * Math.PI;\n\n/** @internal */\nexport const radToDeg = (radian: Radian): Degrees => (radian * 180) / Math.PI;\n\n/**\n * This function returns a function to generate ids.\n * This can be used to generate unique, but predictable ids to pair labels\n * with their inputs. It takes an optional prefix as a parameter. If you don't\n * specify it, it generates a random id prefix. If you specify a custom prefix\n * it should begin with an letter to be HTML4 compliant.\n * @internal\n */\nexport function htmlIdGenerator(idPrefix?: string) {\n  const prefix = idPrefix || `i${uuidv1()}`;\n  return (suffix?: string) => `${prefix}_${suffix || uuidv1()}`;\n}\n\n/**\n * Helper function to identify never type for conditionals\n * See https://github.com/microsoft/TypeScript/issues/31751#issuecomment-498526919\n * @internal\n */\nexport type ExtendsNever<T, Y, N> = [T] extends [never] ? Y : N;\n\n/**\n * Replaces all properties on any type as optional, includes nested types\n *\n * example:\n * ```ts\n * interface Person {\n *  name: string;\n *  age?: number;\n *  spouse: Person;\n *  children: Person[];\n * }\n * type PartialPerson = RecursivePartial<Person>;\n * // results in\n * interface PartialPerson {\n *  name?: string;\n *  age?: number;\n *  spouse?: RecursivePartial<Person>;\n *  children?: RecursivePartial<Person>[]\n * }\n * ```\n * @public\n */\nexport type RecursivePartial<T> = {\n  [P in keyof T]?: T[P] extends NonAny[] // checks for nested any[]\n    ? T[P]\n    : T[P] extends ReadonlyArray<NonAny> // checks for nested ReadonlyArray<any>\n      ? T[P]\n      : T[P] extends (infer U)[]\n        ? RecursivePartial<U>[]\n        : T[P] extends ReadonlyArray<infer U> // eslint-disable-line @typescript-eslint/array-type\n          ? ReadonlyArray<RecursivePartial<U>> // eslint-disable-line @typescript-eslint/array-type\n          : T[P] extends Set<infer V> // checks for Sets\n            ? Set<RecursivePartial<V>>\n            : T[P] extends Map<infer K, infer V> // checks for Maps\n              ? Map<K, RecursivePartial<V>>\n              : T[P] extends NonAny // checks for primitive values\n                ? T[P]\n                : IsUnknown<T[P], 1, 0> extends 1\n                  ? T[P]\n                  : RecursivePartial<T[P]>; // recurse for all non-array and non-primitive values\n};\n\n/**\n * return True if T is `any`, otherwise return False\n * @public\n */\nexport type IsAny<T, True, False = never> = True | False extends (T extends never ? True : False) ? True : False;\n\n/**\n * return True if T is `unknown`, otherwise return False\n * @public\n */\nexport type IsUnknown<T, True, False = never> = unknown extends T ? IsAny<T, False, True> : False;\n\n/** @public */\nexport type NonAny = number | boolean | string | symbol | null;\n\n/** @public */\nexport interface MergeOptions {\n  /**\n   * Includes all available keys of every provided partial at a given level.\n   * This is opposite to normal behavior, which only uses keys from the base\n   * object to merge values.\n   *\n   * @defaultValue false\n   */\n  mergeOptionalPartialValues?: boolean;\n  /**\n   * Merges Maps same as objects. By default this is disabled and Maps are replaced on the base\n   * with a defined Map on any partial.\n   *\n   * @defaultValue false\n   */\n  mergeMaps?: boolean;\n}\n\n/** @internal */\nexport function getPartialValue<T>(base: T, partial?: RecursivePartial<T>, partials: RecursivePartial<T>[] = []): T {\n  const partialWithValue = partial !== undefined ? partial : partials.find((v) => v !== undefined);\n  return partialWithValue !== undefined ? (partialWithValue as T) : base;\n}\n\n/**\n * Returns all top-level keys from one or more objects\n * @param object - first object to get keys\n * @param objects\n * @internal\n */\nexport function getAllKeys(object?: any, objects: any[] = []): Set<any> {\n  return new Set(\n    [object, ...objects].filter(Boolean).reduce((keys: any[], obj) => {\n      if (obj && typeof obj === 'object') {\n        const newKeys = obj instanceof Map ? obj.keys() : Object.keys(obj);\n        keys.push(...newKeys);\n      }\n\n      return keys;\n    }, []),\n  );\n}\n\n/** @internal */\nexport function isArrayOrSet<T>(value: any): value is Array<T> | Set<T> {\n  return Array.isArray(value) || value instanceof Set;\n}\n\n/** @internal */\nexport function isNil(value: any): value is null | undefined {\n  return value === null || value === undefined;\n}\n\n/** @internal */\nexport function hasPartialObjectToMerge<T>(\n  base: T,\n  partial?: RecursivePartial<T>,\n  additionalPartials: RecursivePartial<T>[] = [],\n): boolean {\n  if (isArrayOrSet(base)) {\n    return false;\n  }\n\n  if (typeof base === 'object' && base !== null) {\n    if (typeof partial === 'object' && !isArrayOrSet(partial) && partial !== null) {\n      return true;\n    }\n\n    return additionalPartials.some((p) => typeof p === 'object' && !Array.isArray(p));\n  }\n\n  return false;\n}\n\n/** @internal */\nexport function shallowClone(value: any) {\n  if (Array.isArray(value)) {\n    return [...value];\n  }\n\n  if (value instanceof Set) {\n    return new Set(value);\n  }\n\n  if (typeof value === 'object' && value !== null) {\n    if (value instanceof Map) {\n      return new Map(value.entries());\n    }\n\n    return { ...value };\n  }\n\n  return value;\n}\n\nfunction isReactNode(el: any): el is ReactNode {\n  return isNil(el) || isPrimitive(el) || isValidElement(el);\n}\n\nfunction isReactComponent<P extends Record<string, any>>(el: any): el is ComponentType<P> {\n  return !isReactNode(el);\n}\n\n/**\n * Renders simple react node or react component with props\n * @internal\n */\nexport function renderWithProps<P extends Record<string, any>>(El: ReactNode | ComponentType<P>, props: P): ReactNode {\n  return isReactComponent<P>(El) ? React.createElement(El, props) : El;\n}\n\n/**\n * Aligns component children to the correct output type\n * @internal */\nexport function renderComplexChildren(children: ReactNode): JSX.Element {\n  return (() => <>{children}</>)();\n}\n\n/**\n * Merges values of a partial structure with a base structure.\n *\n * @note No nested array merging\n *\n * @param base structure to be duplicated, must have all props of `partial`\n * @param partial structure to override values from base\n * @param options options to control merge behaviour\n * @param additionalPartials partials to be used before base and after partial\n *\n * @returns new base structure with updated partial values\n * @internal\n */\nexport function mergePartial<T>(\n  base: T,\n  partial?: RecursivePartial<T>,\n  options: MergeOptions = {},\n  additionalPartials: RecursivePartial<T>[] = [],\n): T {\n  const baseClone = shallowClone(base);\n\n  if (hasPartialObjectToMerge(base, partial, additionalPartials)) {\n    const mapCondition = !(baseClone instanceof Map) || options.mergeMaps;\n    const partialKeys = getAllKeys(partial, additionalPartials);\n    if (partialKeys.size > 0 && (options.mergeOptionalPartialValues ?? true) && mapCondition) {\n      partialKeys.forEach((key) => {\n        if (baseClone instanceof Map) {\n          if (!baseClone.has(key)) {\n            baseClone.set(\n              key,\n              (partial as any).get(key) !== undefined\n                ? (partial as any).get(key)\n                : additionalPartials.find((v: any) => v.get(key) !== undefined) || new Map().get(key),\n            );\n          }\n        } else if (!(key in baseClone)) {\n          baseClone[key] =\n            (partial as any)?.[key] !== undefined\n              ? (partial as any)[key]\n              : (additionalPartials.find((v: any) => v?.[key] !== undefined) ?? ({} as any))[key];\n        }\n      });\n    }\n\n    if (baseClone instanceof Map) {\n      if (options.mergeMaps) {\n        return [...baseClone.keys()].reduce((newBase: Map<any, any>, key) => {\n          const partialValue = partial && (partial as any).get(key);\n          const partialValues = additionalPartials.map((v) =>\n            typeof v === 'object' && v instanceof Map ? v.get(key) : undefined,\n          );\n          const baseValue = (base as any).get(key);\n\n          newBase.set(key, mergePartial(baseValue, partialValue, options, partialValues));\n\n          return newBase;\n        }, baseClone as any);\n      }\n\n      if (partial !== undefined) {\n        return partial as any;\n      }\n\n      const additional = additionalPartials.find((p: any) => p !== undefined);\n      if (additional) {\n        return additional as any;\n      }\n\n      return baseClone as any;\n    }\n\n    return Object.keys(baseClone).reduce((newBase, key) => {\n      const partialValue = partial && (partial as any)[key];\n      const partialValues = additionalPartials.map((v) => (typeof v === 'object' ? (v as any)[key] : undefined));\n      const baseValue = (base as any)[key];\n\n      newBase[key] = mergePartial(baseValue, partialValue, options, partialValues);\n\n      return newBase;\n    }, baseClone);\n  }\n\n  return getPartialValue<T>(baseClone, partial, additionalPartials);\n}\n\n/** @public */\nexport type ValueFormatter = (value: number) => string;\n/** @public */\nexport type ValueAccessor<D extends BaseDatum = Datum> = (d: D) => AdditiveNumber;\n/** @public */\nexport type LabelAccessor<T = PrimitiveValue> = (value: T) => string;\n/** @public */\nexport type ShowAccessor = (value: PrimitiveValue) => boolean;\n\n/**\n * Returns planar distance bewtween two points\n * @internal\n */\nexport function getDistance(a: Point, b: Point): number {\n  return Math.sqrt(Math.pow(b.x - a.x, 2) + Math.pow(b.y - a.y, 2));\n}\n\n/** @internal */\nexport function stringifyNullsUndefined(value?: PrimitiveValue): string | number {\n  if (value === undefined) {\n    return 'undefined';\n  }\n\n  if (value === null) {\n    return 'null';\n  }\n\n  return value;\n}\n\n/**\n * Determines if an array has all unique values\n *\n * examples:\n * ```ts\n * isUniqueArray([1, 2]) // => true\n * isUniqueArray([1, 1, 2]) // => false\n * isUniqueArray([{ n: 1 }, { n: 1 }, { n: 2 }], ({ n }) => n) // => false\n * ```\n *\n * @internal\n * @param  {B[]} arr\n * @param  {(d:B)=>T} extractor? extract the value from B\n */\nexport function isUniqueArray<B, T>(arr: B[], extractor?: (value: B) => T) {\n  const values = new Set<B | T>();\n\n  return (function isUniqueArrayFn() {\n    return arr.every((v) => {\n      const value = extractor ? extractor(v) : v;\n\n      if (values.has(value)) {\n        return false;\n      }\n\n      values.add(value);\n      return true;\n    });\n  })();\n}\n\n/**\n * Sorts array of numbers\n * @internal\n */\nexport function sortNumbers<T extends any[]>(arr: T, descending = false): T {\n  return arr.slice().sort(descending ? (a, b) => b - a : (a, b) => a - b) as T;\n}\n\ntype SortTestFn = (n1?: number, n2?: number) => boolean;\n\n/**\n * Returns true if array of numbers is sorted\n * @internal\n */\nexport function isSorted<T extends number[]>(\n  arr: T,\n  options?: { allowDuplicates?: boolean; order?: 'ascending' | 'descending' },\n): boolean {\n  if (arr.length <= 1) return true;\n  const ascending = options?.order === 'ascending' ? true : options?.order === 'descending' ? false : arr[0]! < arr[1]!;\n  const isOrderedPair: SortTestFn =\n    options?.allowDuplicates ?? false\n      ? ascending\n        ? (n1 = NaN, n2 = NaN) => n1 <= n2\n        : (n1 = NaN, n2 = NaN) => n1 >= n2\n      : ascending\n        ? (n1 = NaN, n2 = NaN) => n1 < n2\n        : (n1 = NaN, n2 = NaN) => n1 > n2;\n\n  for (let i = 0; i < arr.length - 1; i++) {\n    if (!isOrderedPair(arr[i], arr[i + 1])) return false;\n  }\n  return true;\n}\n\n/**\n * Returns true if _most_ chars in a string are rtl, exluding spaces and numbers\n * @internal\n */\nexport function isRTLString(s: string, ratio: number = 0.5) {\n  const stripped = s.replaceAll(/[\\u0591-\\u07FF\\uFB1D-\\uFDFD\\uFE70-\\uFEFC]|\\s|\\d/gi, '');\n  return stripped.length / s.replaceAll(/\\s|\\d/gi, '').length < ratio;\n}\n\n/** @internal */\nexport function hasMostlyRTLItems<T extends string>(items: T[], ratio: number = 0.5): boolean {\n  const filteredItems = items.filter(Boolean);\n  const rtlItemCount = filteredItems.filter((s) => isRTLString(s)).length;\n  return rtlItemCount / filteredItems.length > ratio;\n}\n\n/**\n * Returns defined value type if not null nor undefined\n *\n * @internal\n */\nexport function isDefined<T>(value?: T): value is NonNullable<T> {\n  return value !== null && value !== undefined;\n}\n\n/**\n * Returns defined value type if value from getter function is not null nor undefined\n *\n * **IMPORTANT**: You must provide an accurate typeCheck function that will filter out _EVERY_\n * item in the array that is not of type `T`. If not, the type check will override the\n * type as `T` which may be incorrect.\n *\n * @internal\n */\nexport function isDefinedFrom<T>(typeCheck: (value: RecursivePartial<T>) => boolean) {\n  return (value?: RecursivePartial<T>): value is NonNullable<T> => {\n    if (value === undefined) {\n      return false;\n    }\n\n    try {\n      return typeCheck(value);\n    } catch {\n      return false;\n    }\n  };\n}\n\n/**\n * Returns rounded number to given decimals\n *\n * @internal\n */\nexport const round = (value: number, fractionDigits = 0): number => {\n  const precision = Math.pow(10, Math.max(fractionDigits, 0));\n  const scaledValue = Math.floor(value * precision);\n\n  return scaledValue / precision;\n};\n\n/**\n * Returns rounded number to nearest/lowest/highest interval\n *\n * @internal\n */\nexport const roundTo = (\n  value: number,\n  interval: number,\n  options: { min?: number; max?: number; type?: 'round' | 'ceil' | 'floor' } = {},\n): number => {\n  const roundedValue = Math[options.type ?? 'round'](value / interval) * interval;\n  return clamp(roundedValue, options?.min ?? -Infinity, options?.max ?? Infinity);\n};\n\n/**\n * Get number/percentage value from string\n *\n * i.e. `'90%'` with relative value of `100` returns `90`\n * @internal\n */\nexport function getPercentageValue<T>(ratio: string | number, relativeValue: number, defaultValue: T): number | T {\n  if (typeof ratio === 'number') {\n    return Math.abs(ratio);\n  }\n\n  const ratioStr = ratio.trim();\n\n  if (/\\d+%$/.test(ratioStr)) {\n    const percentage = Math.abs(Number.parseInt(ratioStr.slice(0, -1), 10));\n    return relativeValue * (percentage / 100);\n  }\n  const num = Number.parseFloat(ratioStr);\n  return Number.isFinite(num) ? Math.abs(num) : defaultValue;\n}\n\n/**\n * Predicate function, eg. to be called with [].filter, to keep distinct values\n * @example [1, 2, 4, 2, 4, 0, 3, 2].filter(keepDistinct) ==> [1, 2, 4, 0, 3]\n * @internal\n */\nexport function keepDistinct<T>(d: T, i: number, a: T[]): boolean {\n  return a.indexOf(d) === i;\n}\n\n/**\n * Return an object which keys are values of an object and the value is the\n * static one provided\n * @public\n */\nexport function toEntries<T extends Record<string, string>, S>(\n  array: T[],\n  accessor: keyof T,\n  staticValue: S,\n): Record<string, S> {\n  return array.reduce<Record<string, S>>((acc, curr) => {\n    acc[curr[accessor]] = staticValue;\n    return acc;\n  }, {});\n}\n\n/**\n * Safely format values with error handling\n * @internal\n */\nexport function safeFormat<V = any>(value: V, formatter?: (value: V) => string): string {\n  if (formatter) {\n    try {\n      return formatter(value);\n    } catch {\n      // fallthrough\n    }\n  }\n\n  return `${value}`;\n}\n\n/** @internal */\nexport const range = (from: number, to: number, step: number): number[] =>\n  Array.from({ length: Math.abs(Math.round((to - from) / (step || 1))) }, (_, i) => from + i * step);\n\nconst oppositeAlignmentMap: Record<string, HorizontalAlignment | VerticalAlignment> = {\n  [HorizontalAlignment.Left]: HorizontalAlignment.Right,\n  [HorizontalAlignment.Right]: HorizontalAlignment.Left,\n  [VerticalAlignment.Top]: VerticalAlignment.Bottom,\n  [VerticalAlignment.Bottom]: VerticalAlignment.Top,\n};\n\n/** @internal */\nexport function getOppositeAlignment<A extends HorizontalAlignment | VerticalAlignment>(alignment: A): A {\n  return (oppositeAlignmentMap[alignment] as A) ?? alignment;\n}\n\n/** @internal */\nexport function isFiniteNumber(value: unknown): value is number {\n  return Number.isFinite(value);\n}\n\n/** @internal */\nexport function isNonNullablePrimitiveValue(value: unknown): value is NonNullable<PrimitiveValue> {\n  return typeof value === 'string' || typeof value === 'number';\n}\n\n/**\n * Strips all undefined properties from object\n * @internal\n */\nexport function stripUndefined<R extends Record<string, unknown>>(source: R): R {\n  return Object.keys(source).reduce((acc, key) => {\n    const val = source[key];\n    if (val !== undefined) {\n      // @ts-ignore - building new R from {}\n      acc[key] = val;\n    }\n    return acc;\n  }, {} as R);\n}\n\n/**\n * Returns `Array.filter` callback for values between a min and max\n * @internal\n */\nexport const isBetween = (min: number, max: number, exclusive = false): ((n: number) => boolean) =>\n  exclusive ? (n) => n < max && n > min : (n) => n <= max && n >= min;\n\n/**\n * Returns `Array.filter` callback for values between two unordered values\n * @internal\n */\nexport const isWithinRange = (range: [number, number], exclusive = false) => {\n  const [min, max] = sortNumbers(range);\n  return isBetween(min, max, exclusive);\n};\n\n/**\n * Returns `Array.reduce` callback to clamp values and remove duplicates\n * @internal\n */\nexport const clampAll = (\n  min: number,\n  max: number,\n): [callbackfn: (acc: number[], value: number) => number[], initialAcc: number[]] => {\n  const seen = new Set<number>();\n  return [\n    (acc: number[], n: number) => {\n      const clampValue = clamp(n, min, max);\n      if (!seen.has(clampValue)) acc.push(clampValue);\n      seen.add(clampValue);\n      return acc;\n    },\n    [],\n  ];\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  curveBasis,\n  curveCardinal,\n  curveCatmullRom,\n  curveLinear,\n  curveMonotoneX,\n  curveMonotoneY,\n  curveNatural,\n  curveStep,\n  curveStepAfter,\n  curveStepBefore,\n} from 'd3-shape';\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const CurveType = Object.freeze({\n  CURVE_CARDINAL: 0 as const,\n  CURVE_NATURAL: 1 as const,\n  CURVE_MONOTONE_X: 2 as const,\n  CURVE_MONOTONE_Y: 3 as const,\n  CURVE_BASIS: 4 as const,\n  CURVE_CATMULL_ROM: 5 as const,\n  CURVE_STEP: 6 as const,\n  CURVE_STEP_AFTER: 7 as const,\n  CURVE_STEP_BEFORE: 8 as const,\n  LINEAR: 9 as const,\n});\n\n/** @public */\nexport type CurveType = $Values<typeof CurveType>;\n\n/** @internal */\nexport function getCurveFactory(curveType: CurveType = CurveType.LINEAR) {\n  switch (curveType) {\n    case CurveType.CURVE_CARDINAL:\n      return curveCardinal;\n    case CurveType.CURVE_NATURAL:\n      return curveNatural;\n    case CurveType.CURVE_MONOTONE_X:\n      return curveMonotoneX;\n    case CurveType.CURVE_MONOTONE_Y:\n      return curveMonotoneY;\n    case CurveType.CURVE_BASIS:\n      return curveBasis;\n    case CurveType.CURVE_CATMULL_ROM:\n      return curveCatmullRom;\n    case CurveType.CURVE_STEP:\n      return curveStep;\n    case CurveType.CURVE_STEP_AFTER:\n      return curveStepAfter;\n    case CurveType.CURVE_STEP_BEFORE:\n      return curveStepBefore;\n    case CurveType.LINEAR:\n    default:\n      return curveLinear;\n  }\n}\n","/**\n * @notice\n * This product includes code that is adapted d3-delaunay@5.2.1,\n * which is available under a \"ISC\" license.\n *\n * Copyright 2018 Observable, Inc.\n *\n * Permission to use, copy, modify, and/or distribute this software for any purpose\n * with or without fee is hereby granted, provided that the above copyright notice\n * and this permission notice appear in all copies.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\n * REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND\n * FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\n * INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS\n * OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER\n * TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF\n * THIS SOFTWARE.\n */\n\n// @ts-nocheck\n\n/**\n * Delaunay triangulation\n */\ninterface DelaunayI<P> {\n  /**\n   * The coordinates of the points as an array [x0, y0, x1, y1, ...].\n   * Typically, this is a Float64Array, however you can use any array-like type in the constructor.\n   */\n  points: ArrayLike<number>;\n\n  /**\n   * The halfedge indices as an Int32Array [j0, j1, ...].\n   * For each index 0 <= i < halfedges.length, there is a halfedge from triangle vertex j = halfedges[i] to triangle vertex i.\n   */\n  halfedges: Int32Array;\n\n  /**\n   * An arbitrary node on the convex hull.\n   * The convex hull is represented as a circular doubly-linked list of nodes.\n   */\n  hull: Node;\n\n  /**\n   * The triangle vertex indices as an Uint32Array [i0, j0, k0, i1, j1, k1, ...].\n   * Each contiguous triplet of indices i, j, k forms a counterclockwise triangle.\n   * The coordinates of the triangle's points can be found by going through 'points'.\n   */\n  triangles: Uint32Array;\n\n  /**\n   * The incoming halfedge indexes as a Int32Array [e0, e1, e2, ...].\n   * For each point i, inedges[i] is the halfedge index e of an incoming halfedge.\n   * For coincident points, the halfedge index is -1; for points on the convex hull, the incoming halfedge is on the convex hull; for other points, the choice of incoming halfedge is arbitrary.\n   */\n  inedges: Int32Array;\n\n  /**\n   * The outgoing halfedge indexes as a Int32Array [e0, e1, e2, ...].\n   * For each point i on the convex hull, outedges[i] is the halfedge index e of the corresponding outgoing halfedge; for other points, the halfedge index is -1.\n   */\n  outedges: Int32Array;\n\n  /**\n   * Returns the index of the input point that is closest to the specified point ⟨x, y⟩.\n   * The search is started at the specified point i. If i is not specified, it defaults to zero.\n   */\n  find(x: number, y: number, i?: number): number;\n\n  /**\n   * Returns an iterable over the indexes of the neighboring points to the specified point i.\n   * The iterable is empty if i is a coincident point.\n   */\n  neighbors(i: number): IterableIterator<number>;\n\n  /**\n   * Returns the closed polygon [[x0, y0], [x1, y1], ..., [x0, y0]] representing the convex hull.\n   */\n  hullPolygon(): Polygon;\n\n  /**\n   * Returns the closed polygon [[x0, y0], [x1, y1], [x2, y2], [x0, y0]] representing the triangle i.\n   */\n  trianglePolygon(i: number): Triangle;\n\n  /**\n   * Returns an iterable over the polygons for each triangle, in order.\n   */\n  trianglePolygons(): IterableIterator<Triangle>;\n\n  /**\n   * Returns the Voronoi diagram for the associated points.\n   * When rendering, the diagram will be clipped to the specified bounds = [xmin, ymin, xmax, ymax].\n   * If bounds is not specified, it defaults to [0, 0, 960, 500].\n   * See To Infinity and Back Again for an interactive explanation of Voronoi cell clipping.\n   */\n  voronoi(bounds?: Bounds): Voronoi<P>;\n}\n\n/**\n * A point represented as an array tuple [x, y].\n */\ntype Point = number[];\n\n/**\n * A closed polygon [[x0, y0], [x1, y1], [x2, y2], [x0, y0]] representing a triangle.\n */\ntype Triangle = Point[];\n\n/**\n * A closed polygon [[x0, y0], [x1, y1], ..., [x0, y0]].\n */\ntype PolygonI = Point[];\n\n/**\n * A rectangular area [x, y, width, height].\n */\nexport type Bounds = number[];\n\n/**\n * A function to extract a x- or y-coordinate from the specified point.\n */\ntype GetCoordinate<P, PS> = (point: P, i: number, points: PS) => number;\n\n/**\n * A point node on a convex hull (represented as a circular linked list).\n */\ninterface Node {\n  /**\n   * The index of the associated point.\n   */\n  i: number;\n\n  /**\n   * The x-coordinate of the associated point.\n   */\n  x: number;\n\n  /**\n   * The y-coordinate of the associated point.\n   */\n  y: number;\n\n  /**\n   * The index of the (incoming or outgoing?) associated halfedge.\n   */\n  t: number;\n\n  /**\n   * The previous node on the hull.\n   */\n  prev: Node;\n\n  /**\n   * The next node on the hull.\n   */\n  next: Node;\n\n  /**\n   * Whether the node has been removed from the linked list.\n   */\n  removed: boolean;\n}\n\n/**\n * An interface for the rect() method of the CanvasPathMethods API.\n */\ninterface RectContext {\n  /**\n   * rect() method of the CanvasPathMethods API.\n   */\n  rect(x: number, y: number, width: number, height: number): void;\n}\n\n/**\n * An interface for the moveTo() method of the CanvasPathMethods API.\n */\ninterface MoveContext {\n  /**\n   * moveTo() method of the CanvasPathMethods API.\n   */\n  moveTo(x: number, y: number): void;\n}\n\n/**\n * An interface for the lineTo() method of the CanvasPathMethods API.\n */\ninterface LineContext {\n  /**\n   * lineTo() method of the CanvasPathMethods API.\n   */\n  lineTo(x: number, y: number): void;\n}\n\n/**\n * An interface for the arc() method of the CanvasPathMethods API.\n */\ninterface ArcContext {\n  /**\n   * arc() method of the CanvasPathMethods API.\n   */\n  arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, counterclockwise?: boolean): void;\n}\n\n/**\n * An interface for the closePath() method of the CanvasPathMethods API.\n */\ninterface ClosableContext {\n  /**\n   * closePath() method of the CanvasPathMethods API.\n   */\n  closePath(): void;\n}\n\n/**\n * Voronoi regions\n */\ninterface VoronoiI<P> {\n  /**\n   * The Voronoi diagram’s associated Delaunay triangulation.\n   */\n  delaunay: DelaunayI<P>;\n\n  /**\n   * The circumcenters of the Delaunay triangles [cx0, cy0, cx1, cy1, ...].\n   * Each contiguous pair of coordinates cx, cy is the circumcenter for the corresponding triangle.\n   * These circumcenters form the coordinates of the Voronoi cell polygons.\n   */\n  circumcenters: Float64Array;\n\n  /**\n   * An array [vx0, vy0, wx0, wy0, ...] where each non-zero quadruple describes an open (infinite) cell\n   * on the outer hull, giving the directions of two open half-lines.\n   */\n  vectors: Float64Array;\n\n  /**\n   * The bounds of the viewport [xmin, ymin, xmax, ymax] for rendering the Voronoi diagram.\n   * These values only affect the rendering methods (voronoi.render, voronoi.renderBounds, cell.render).\n   */\n  xmin: number;\n  ymin: number;\n  xmax: number;\n  ymax: number;\n\n  /**\n   * Returns true if the cell with the specified index i contains the specified point ⟨x, y⟩.\n   * (This method is not affected by the associated Voronoi diagram’s viewport bounds.)\n   */\n  contains(i: number, x: number, y: number): boolean;\n\n  /**\n   * Returns the convex, closed polygon [[x0, y0], [x1, y1], ..., [x0, y0]] representing the cell for the specified point i.\n   */\n  cellPolygon(i: number): PolygonI;\n\n  /**\n   * Returns an iterable over the polygons for each cell, in order.\n   */\n  cellPolygons(): IterableIterator<PolygonI>;\n}\n\n// https://github.com/d3/d3-delaunay v5.2.1 Copyright 2020 Mike Bostock\n// https://github.com/mapbox/delaunator v4.0.1. Copyright 2019 Mapbox, Inc.\n\n// Type definitions for d3-delaunay 4.1\n// Project: https://github.com/d3/d3-delaunay\n// Definitions by: Bradley Odell <https://github.com/BTOdell>\n// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped\n\nconst EPSILON = Math.pow(2, -52);\nconst EDGE_STACK = new Uint32Array(512);\n\nclass Delaunator {\n  static from(points, getX = defaultGetX, getY = defaultGetY) {\n    const n = points.length;\n    const coords = new Float64Array(n * 2);\n\n    for (let i = 0; i < n; i++) {\n      const p = points[i];\n      coords[2 * i] = getX(p);\n      coords[2 * i + 1] = getY(p);\n    }\n\n    return new Delaunator(coords);\n  }\n\n  constructor(coords) {\n    const n = coords.length >> 1;\n    if (n > 0 && typeof coords[0] !== 'number') throw new Error('Expected coords to contain numbers.');\n\n    this.coords = coords;\n\n    // arrays that will store the triangulation graph\n    const maxTriangles = Math.max(2 * n - 5, 0);\n    this._triangles = new Uint32Array(maxTriangles * 3);\n    this._halfedges = new Int32Array(maxTriangles * 3);\n\n    // temporary arrays for tracking the edges of the advancing convex hull\n    this._hashSize = Math.ceil(Math.sqrt(n));\n    this._hullPrev = new Uint32Array(n); // edge to prev edge\n    this._hullNext = new Uint32Array(n); // edge to next edge\n    this._hullTri = new Uint32Array(n); // edge to adjacent triangle\n    this._hullHash = new Int32Array(this._hashSize).fill(-1); // angular edge hash\n\n    // temporary arrays for sorting points\n    this._ids = new Uint32Array(n);\n    this._dists = new Float64Array(n);\n\n    this.update();\n  }\n\n  update() {\n    const { coords, _hullPrev: hullPrev, _hullNext: hullNext, _hullTri: hullTri, _hullHash: hullHash } = this;\n    const n = coords.length >> 1;\n\n    // populate an array of point indices; calculate input data bbox\n    let minX = Infinity;\n    let minY = Infinity;\n    let maxX = -Infinity;\n    let maxY = -Infinity;\n\n    for (let i = 0; i < n; i++) {\n      const x = coords[2 * i];\n      const y = coords[2 * i + 1];\n      if (x < minX) minX = x;\n      if (y < minY) minY = y;\n      if (x > maxX) maxX = x;\n      if (y > maxY) maxY = y;\n      this._ids[i] = i;\n    }\n    const cx = (minX + maxX) / 2;\n    const cy = (minY + maxY) / 2;\n\n    let minDist = Infinity;\n    let i0, i1, i2;\n\n    // pick a seed point close to the center\n    for (let i = 0; i < n; i++) {\n      const d = dist(cx, cy, coords[2 * i], coords[2 * i + 1]);\n      if (d < minDist) {\n        i0 = i;\n        minDist = d;\n      }\n    }\n    const i0x = coords[2 * i0];\n    const i0y = coords[2 * i0 + 1];\n\n    minDist = Infinity;\n\n    // find the point closest to the seed\n    for (let i = 0; i < n; i++) {\n      if (i === i0) continue;\n      const d = dist(i0x, i0y, coords[2 * i], coords[2 * i + 1]);\n      if (d < minDist && d > 0) {\n        i1 = i;\n        minDist = d;\n      }\n    }\n    let i1x = coords[2 * i1];\n    let i1y = coords[2 * i1 + 1];\n\n    let minRadius = Infinity;\n\n    // find the third point which forms the smallest circumcircle with the first two\n    for (let i = 0; i < n; i++) {\n      if (i === i0 || i === i1) continue;\n      const r = circumradius(i0x, i0y, i1x, i1y, coords[2 * i], coords[2 * i + 1]);\n      if (r < minRadius) {\n        i2 = i;\n        minRadius = r;\n      }\n    }\n    let i2x = coords[2 * i2];\n    let i2y = coords[2 * i2 + 1];\n\n    if (minRadius === Infinity) {\n      // order collinear points by dx (or dy if all x are identical)\n      // and return the list as a hull\n      for (let i = 0; i < n; i++) {\n        this._dists[i] = coords[2 * i] - coords[0] || coords[2 * i + 1] - coords[1];\n      }\n      quicksort(this._ids, this._dists, 0, n - 1);\n      const hull = new Uint32Array(n);\n      let j = 0;\n      for (let i = 0, d0 = -Infinity; i < n; i++) {\n        const id = this._ids[i];\n        if (this._dists[id] > d0) {\n          hull[j++] = id;\n          d0 = this._dists[id];\n        }\n      }\n      this.hull = hull.subarray(0, j);\n      this.triangles = new Uint32Array(0);\n      this.halfedges = new Uint32Array(0);\n      return;\n    }\n\n    // swap the order of the seed points for counter-clockwise orientation\n    if (orient(i0x, i0y, i1x, i1y, i2x, i2y)) {\n      const i = i1;\n      const x = i1x;\n      const y = i1y;\n      i1 = i2;\n      i1x = i2x;\n      i1y = i2y;\n      i2 = i;\n      i2x = x;\n      i2y = y;\n    }\n\n    const center = circumcenter(i0x, i0y, i1x, i1y, i2x, i2y);\n    this._cx = center.x;\n    this._cy = center.y;\n\n    for (let i = 0; i < n; i++) {\n      this._dists[i] = dist(coords[2 * i], coords[2 * i + 1], center.x, center.y);\n    }\n\n    // sort the points by distance from the seed triangle circumcenter\n    quicksort(this._ids, this._dists, 0, n - 1);\n\n    // set up the seed triangle as the starting hull\n    this._hullStart = i0;\n    let hullSize = 3;\n\n    hullNext[i0] = hullPrev[i2] = i1;\n    hullNext[i1] = hullPrev[i0] = i2;\n    hullNext[i2] = hullPrev[i1] = i0;\n\n    hullTri[i0] = 0;\n    hullTri[i1] = 1;\n    hullTri[i2] = 2;\n\n    hullHash.fill(-1);\n    hullHash[this._hashKey(i0x, i0y)] = i0;\n    hullHash[this._hashKey(i1x, i1y)] = i1;\n    hullHash[this._hashKey(i2x, i2y)] = i2;\n\n    this.trianglesLen = 0;\n    this._addTriangle(i0, i1, i2, -1, -1, -1);\n\n    for (let k = 0, xp, yp; k < this._ids.length; k++) {\n      const i = this._ids[k];\n      const x = coords[2 * i];\n      const y = coords[2 * i + 1];\n\n      // skip near-duplicate points\n      if (k > 0 && Math.abs(x - xp) <= EPSILON && Math.abs(y - yp) <= EPSILON) continue;\n      xp = x;\n      yp = y;\n\n      // skip seed triangle points\n      if (i === i0 || i === i1 || i === i2) continue;\n\n      // find a visible edge on the convex hull using edge hash\n      let start = 0;\n      for (let j = 0, key = this._hashKey(x, y); j < this._hashSize; j++) {\n        start = hullHash[(key + j) % this._hashSize];\n        if (start !== -1 && start !== hullNext[start]) break;\n      }\n\n      start = hullPrev[start];\n      let e = start,\n        q;\n      while (((q = hullNext[e]), !orient(x, y, coords[2 * e], coords[2 * e + 1], coords[2 * q], coords[2 * q + 1]))) {\n        e = q;\n        if (e === start) {\n          e = -1;\n          break;\n        }\n      }\n      if (e === -1) continue; // likely a near-duplicate point; skip it\n\n      // add the first triangle from the point\n      let t = this._addTriangle(e, i, hullNext[e], -1, -1, hullTri[e]);\n\n      // recursively flip triangles from the point until they satisfy the Delaunay condition\n      hullTri[i] = this._legalize(t + 2);\n      hullTri[e] = t; // keep track of boundary triangles on the hull\n      hullSize++;\n\n      // walk forward through the hull, adding more triangles and flipping recursively\n      let n = hullNext[e];\n      while (((q = hullNext[n]), orient(x, y, coords[2 * n], coords[2 * n + 1], coords[2 * q], coords[2 * q + 1]))) {\n        t = this._addTriangle(n, i, q, hullTri[i], -1, hullTri[n]);\n        hullTri[i] = this._legalize(t + 2);\n        hullNext[n] = n; // mark as removed\n        hullSize--;\n        n = q;\n      }\n\n      // walk backward from the other side, adding more triangles and flipping\n      if (e === start) {\n        while (((q = hullPrev[e]), orient(x, y, coords[2 * q], coords[2 * q + 1], coords[2 * e], coords[2 * e + 1]))) {\n          t = this._addTriangle(q, i, e, -1, hullTri[e], hullTri[q]);\n          this._legalize(t + 2);\n          hullTri[q] = t;\n          hullNext[e] = e; // mark as removed\n          hullSize--;\n          e = q;\n        }\n      }\n\n      // update the hull indices\n      this._hullStart = hullPrev[i] = e;\n      hullNext[e] = hullPrev[n] = i;\n      hullNext[i] = n;\n\n      // save the two new edges in the hash table\n      hullHash[this._hashKey(x, y)] = i;\n      hullHash[this._hashKey(coords[2 * e], coords[2 * e + 1])] = e;\n    }\n\n    this.hull = new Uint32Array(hullSize);\n    for (let i = 0, e = this._hullStart; i < hullSize; i++) {\n      this.hull[i] = e;\n      e = hullNext[e];\n    }\n\n    // trim typed triangle mesh arrays\n    this.triangles = this._triangles.subarray(0, this.trianglesLen);\n    this.halfedges = this._halfedges.subarray(0, this.trianglesLen);\n  }\n\n  _hashKey(x, y) {\n    return Math.floor(pseudoAngle(x - this._cx, y - this._cy) * this._hashSize) % this._hashSize;\n  }\n\n  _legalize(a) {\n    const { _triangles: triangles, _halfedges: halfedges, coords } = this;\n\n    let i = 0;\n    let ar = 0;\n\n    // recursion eliminated with a fixed-size stack\n    while (true) {\n      const b = halfedges[a];\n\n      /* if the pair of triangles doesn't satisfy the Delaunay condition\n       * (p1 is inside the circumcircle of [p0, pl, pr]), flip them,\n       * then do the same check/flip recursively for the new pair of triangles\n       *\n       *           pl                    pl\n       *          /||\\                  /  \\\n       *       al/ || \\bl            al/    \\a\n       *        /  ||  \\              /      \\\n       *       /  a||b  \\    flip    /___ar___\\\n       *     p0\\   ||   /p1   =>   p0\\---bl---/p1\n       *        \\  ||  /              \\      /\n       *       ar\\ || /br             b\\    /br\n       *          \\||/                  \\  /\n       *           pr                    pr\n       */\n      const a0 = a - (a % 3);\n      ar = a0 + ((a + 2) % 3);\n\n      if (b === -1) {\n        // convex hull edge\n        if (i === 0) break;\n        a = EDGE_STACK[--i];\n        continue;\n      }\n\n      const b0 = b - (b % 3);\n      const al = a0 + ((a + 1) % 3);\n      const bl = b0 + ((b + 2) % 3);\n\n      const p0 = triangles[ar];\n      const pr = triangles[a];\n      const pl = triangles[al];\n      const p1 = triangles[bl];\n\n      const illegal = inCircle(\n        coords[2 * p0],\n        coords[2 * p0 + 1],\n        coords[2 * pr],\n        coords[2 * pr + 1],\n        coords[2 * pl],\n        coords[2 * pl + 1],\n        coords[2 * p1],\n        coords[2 * p1 + 1],\n      );\n\n      if (illegal) {\n        triangles[a] = p1;\n        triangles[b] = p0;\n\n        const hbl = halfedges[bl];\n\n        // edge swapped on the other side of the hull (rare); fix the halfedge reference\n        if (hbl === -1) {\n          let e = this._hullStart;\n          do {\n            if (this._hullTri[e] === bl) {\n              this._hullTri[e] = a;\n              break;\n            }\n            e = this._hullPrev[e];\n          } while (e !== this._hullStart);\n        }\n        this._link(a, hbl);\n        this._link(b, halfedges[ar]);\n        this._link(ar, bl);\n\n        const br = b0 + ((b + 1) % 3);\n\n        // don't worry about hitting the cap: it can only happen on extremely degenerate input\n        if (i < EDGE_STACK.length) {\n          EDGE_STACK[i++] = br;\n        }\n      } else {\n        if (i === 0) break;\n        a = EDGE_STACK[--i];\n      }\n    }\n\n    return ar;\n  }\n\n  _link(a, b) {\n    this._halfedges[a] = b;\n    if (b !== -1) this._halfedges[b] = a;\n  }\n\n  // add a new triangle given vertex indices and adjacent half-edge ids\n  _addTriangle(i0, i1, i2, a, b, c) {\n    const t = this.trianglesLen;\n\n    this._triangles[t] = i0;\n    this._triangles[t + 1] = i1;\n    this._triangles[t + 2] = i2;\n\n    this._link(t, a);\n    this._link(t + 1, b);\n    this._link(t + 2, c);\n\n    this.trianglesLen += 3;\n\n    return t;\n  }\n}\n\n// monotonically increases with real angle, but doesn't need expensive trigonometry\nfunction pseudoAngle(dx, dy) {\n  const p = dx / (Math.abs(dx) + Math.abs(dy));\n  return (dy > 0 ? 3 - p : 1 + p) / 4; // [0..1]\n}\n\nfunction dist(ax, ay, bx, by) {\n  const dx = ax - bx;\n  const dy = ay - by;\n  return dx * dx + dy * dy;\n}\n\n// return 2d orientation sign if we're confident in it through J. Shewchuk's error bound check\nfunction orientIfSure(px, py, rx, ry, qx, qy) {\n  const l = (ry - py) * (qx - px);\n  const r = (rx - px) * (qy - py);\n  return Math.abs(l - r) >= 3.3306690738754716e-16 * Math.abs(l + r) ? l - r : 0;\n}\n\n// a more robust orientation test that's stable in a given triangle (to fix robustness issues)\nfunction orient(rx, ry, qx, qy, px, py) {\n  const sign =\n    orientIfSure(px, py, rx, ry, qx, qy) ||\n    orientIfSure(rx, ry, qx, qy, px, py) ||\n    orientIfSure(qx, qy, px, py, rx, ry);\n  return sign < 0;\n}\n\nfunction inCircle(ax, ay, bx, by, cx, cy, px, py) {\n  const dx = ax - px;\n  const dy = ay - py;\n  const ex = bx - px;\n  const ey = by - py;\n  const fx = cx - px;\n  const fy = cy - py;\n\n  const ap = dx * dx + dy * dy;\n  const bp = ex * ex + ey * ey;\n  const cp = fx * fx + fy * fy;\n\n  return dx * (ey * cp - bp * fy) - dy * (ex * cp - bp * fx) + ap * (ex * fy - ey * fx) < 0;\n}\n\nfunction circumradius(ax, ay, bx, by, cx, cy) {\n  const dx = bx - ax;\n  const dy = by - ay;\n  const ex = cx - ax;\n  const ey = cy - ay;\n\n  const bl = dx * dx + dy * dy;\n  const cl = ex * ex + ey * ey;\n  const d = 0.5 / (dx * ey - dy * ex);\n\n  const x = (ey * bl - dy * cl) * d;\n  const y = (dx * cl - ex * bl) * d;\n\n  return x * x + y * y;\n}\n\nfunction circumcenter(ax, ay, bx, by, cx, cy) {\n  const dx = bx - ax;\n  const dy = by - ay;\n  const ex = cx - ax;\n  const ey = cy - ay;\n\n  const bl = dx * dx + dy * dy;\n  const cl = ex * ex + ey * ey;\n  const d = 0.5 / (dx * ey - dy * ex);\n\n  const x = ax + (ey * bl - dy * cl) * d;\n  const y = ay + (dx * cl - ex * bl) * d;\n\n  return { x, y };\n}\n\nfunction quicksort(ids, dists, left, right) {\n  if (right - left <= 20) {\n    for (let i = left + 1; i <= right; i++) {\n      const temp = ids[i];\n      const tempDist = dists[temp];\n      let j = i - 1;\n      while (j >= left && dists[ids[j]] > tempDist) ids[j + 1] = ids[j--];\n      ids[j + 1] = temp;\n    }\n  } else {\n    const median = (left + right) >> 1;\n    let i = left + 1;\n    let j = right;\n    swap(ids, median, i);\n    if (dists[ids[left]] > dists[ids[right]]) swap(ids, left, right);\n    if (dists[ids[i]] > dists[ids[right]]) swap(ids, i, right);\n    if (dists[ids[left]] > dists[ids[i]]) swap(ids, left, i);\n\n    const temp = ids[i];\n    const tempDist = dists[temp];\n    while (true) {\n      do i++;\n      while (dists[ids[i]] < tempDist);\n      do j--;\n      while (dists[ids[j]] > tempDist);\n      if (j < i) break;\n      swap(ids, i, j);\n    }\n    ids[left + 1] = ids[j];\n    ids[j] = temp;\n\n    if (right - i + 1 >= j - left) {\n      quicksort(ids, dists, i, right);\n      quicksort(ids, dists, left, j - 1);\n    } else {\n      quicksort(ids, dists, left, j - 1);\n      quicksort(ids, dists, i, right);\n    }\n  }\n}\n\nfunction swap(arr, i, j) {\n  const tmp = arr[i];\n  arr[i] = arr[j];\n  arr[j] = tmp;\n}\n\nfunction defaultGetX(p) {\n  return p[0];\n}\nfunction defaultGetY(p) {\n  return p[1];\n}\n\nconst epsilon = 1e-6;\n\nclass Path {\n  constructor() {\n    this._x0 = this._y0 = this._x1 = this._y1 = null; // start of current subpath // end of current subpath\n    this._ = '';\n  }\n  moveTo(x, y) {\n    this._ += `M${(this._x0 = this._x1 = +x)},${(this._y0 = this._y1 = +y)}`;\n  }\n  closePath() {\n    if (this._x1 !== null) {\n      (this._x1 = this._x0), (this._y1 = this._y0);\n      this._ += 'Z';\n    }\n  }\n  lineTo(x, y) {\n    this._ += `L${(this._x1 = +x)},${(this._y1 = +y)}`;\n  }\n  arc(x, y, r) {\n    (x = +x), (y = +y), (r = +r);\n    const x0 = x + r;\n    const y0 = y;\n    if (r < 0) throw new Error('negative radius');\n    if (this._x1 === null) this._ += `M${x0},${y0}`;\n    else if (Math.abs(this._x1 - x0) > epsilon || Math.abs(this._y1 - y0) > epsilon) this._ += 'L' + x0 + ',' + y0;\n    if (!r) return;\n    this._ += `A${r},${r},0,1,1,${x - r},${y}A${r},${r},0,1,1,${(this._x1 = x0)},${(this._y1 = y0)}`;\n  }\n  rect(x, y, w, h) {\n    this._ += `M${(this._x0 = this._x1 = +x)},${(this._y0 = this._y1 = +y)}h${+w}v${+h}h${-w}Z`;\n  }\n  value() {\n    return this._ || null;\n  }\n}\n\nclass Polygon {\n  constructor() {\n    this._ = [];\n  }\n  moveTo(x, y) {\n    this._.push([x, y]);\n  }\n  closePath() {\n    this._.push(this._[0].slice());\n  }\n  lineTo(x, y) {\n    this._.push([x, y]);\n  }\n  value() {\n    return this._.length ? this._ : null;\n  }\n}\n\nexport class Voronoi<P> implements VoronoiI<P> {\n  xmin: number;\n  ymin: number;\n  xmax: number;\n  ymax: number;\n  /**\n   * The Voronoi diagram’s associated Delaunay triangulation.\n   */\n  delaunay: DelaunayI<P>;\n\n  /**\n   * The circumcenters of the Delaunay triangles [cx0, cy0, cx1, cy1, ...].\n   * Each contiguous pair of coordinates cx, cy is the circumcenter for the corresponding triangle.\n   * These circumcenters form the coordinates of the Voronoi cell polygons.\n   */\n  circumcenters: Float64Array;\n\n  /**\n   * An array [vx0, vy0, wx0, wy0, ...] where each non-zero quadruple describes an open (infinite) cell\n   * on the outer hull, giving the directions of two open half-lines.\n   */\n  vectors: Float64Array;\n\n  constructor(delaunay: DelaunayI<P>, [xmin, ymin, xmax, ymax]: Bounds = [0, 0, 960, 500]) {\n    if (!((xmax = +xmax) >= (xmin = +xmin)) || !((ymax = +ymax) >= (ymin = +ymin))) throw new Error('invalid bounds');\n    this.delaunay = delaunay;\n    this._circumcenters = new Float64Array(delaunay.points.length * 2);\n    this.vectors = new Float64Array(delaunay.points.length * 2);\n    (this.xmax = xmax), (this.xmin = xmin);\n    (this.ymax = ymax), (this.ymin = ymin);\n    this._init();\n  }\n  update() {\n    this.delaunay.update();\n    this._init();\n    return this;\n  }\n  _init() {\n    const {\n      delaunay: { points, hull, triangles },\n      vectors,\n    } = this;\n\n    // Compute circumcenters.\n    const circumcenters = (this.circumcenters = this._circumcenters.subarray(0, (triangles.length / 3) * 2));\n    for (let i = 0, j = 0, n = triangles.length, x, y; i < n; i += 3, j += 2) {\n      const t1 = triangles[i] * 2;\n      const t2 = triangles[i + 1] * 2;\n      const t3 = triangles[i + 2] * 2;\n      const x1 = points[t1];\n      const y1 = points[t1 + 1];\n      const x2 = points[t2];\n      const y2 = points[t2 + 1];\n      const x3 = points[t3];\n      const y3 = points[t3 + 1];\n\n      const dx = x2 - x1;\n      const dy = y2 - y1;\n      const ex = x3 - x1;\n      const ey = y3 - y1;\n      const bl = dx * dx + dy * dy;\n      const cl = ex * ex + ey * ey;\n      const ab = (dx * ey - dy * ex) * 2;\n\n      if (!ab) {\n        // degenerate case (collinear diagram)\n        x = (x1 + x3) / 2 - 1e8 * ey;\n        y = (y1 + y3) / 2 + 1e8 * ex;\n      } else if (Math.abs(ab) < 1e-8) {\n        // almost equal points (degenerate triangle)\n        x = (x1 + x3) / 2;\n        y = (y1 + y3) / 2;\n      } else {\n        const d = 1 / ab;\n        x = x1 + (ey * bl - dy * cl) * d;\n        y = y1 + (dx * cl - ex * bl) * d;\n      }\n      circumcenters[j] = x;\n      circumcenters[j + 1] = y;\n    }\n\n    // Compute exterior cell rays.\n    let h = hull[hull.length - 1];\n    let p0,\n      p1 = h * 4;\n    let x0,\n      x1 = points[2 * h];\n    let y0,\n      y1 = points[2 * h + 1];\n    vectors.fill(0);\n    for (let i = 0; i < hull.length; ++i) {\n      h = hull[i];\n      (p0 = p1), (x0 = x1), (y0 = y1);\n      (p1 = h * 4), (x1 = points[2 * h]), (y1 = points[2 * h + 1]);\n      vectors[p0 + 2] = vectors[p1] = y0 - y1;\n      vectors[p0 + 3] = vectors[p1 + 1] = x1 - x0;\n    }\n  }\n  /**\n   * Renders the mesh of Voronoi cells to the specified context.\n   * The specified context must implement the context.moveTo and context.lineTo methods from the CanvasPathMethods API.\n   */\n  render(context: MoveContext & LineContext): void {\n    const buffer = context === null ? (context = new Path()) : undefined;\n    const {\n      delaunay: { halfedges, inedges, hull },\n      circumcenters,\n      vectors,\n    } = this;\n    if (hull.length <= 1) return null;\n    for (let i = 0, n = halfedges.length; i < n; ++i) {\n      const j = halfedges[i];\n      if (j < i) continue;\n      const ti = Math.floor(i / 3) * 2;\n      const tj = Math.floor(j / 3) * 2;\n      const xi = circumcenters[ti];\n      const yi = circumcenters[ti + 1];\n      const xj = circumcenters[tj];\n      const yj = circumcenters[tj + 1];\n      this._renderSegment(xi, yi, xj, yj, context);\n    }\n    let h0,\n      h1 = hull[hull.length - 1];\n    for (let i = 0; i < hull.length; ++i) {\n      (h0 = h1), (h1 = hull[i]);\n      const t = Math.floor(inedges[h1] / 3) * 2;\n      const x = circumcenters[t];\n      const y = circumcenters[t + 1];\n      const v = h0 * 4;\n      const p = this._project(x, y, vectors[v + 2], vectors[v + 3]);\n      if (p) this._renderSegment(x, y, p[0], p[1], context);\n    }\n    return buffer && buffer.value();\n  }\n  /**\n   * Renders the viewport extent to the specified context.\n   * The specified context must implement the context.rect method from the CanvasPathMethods API.\n   * Equivalent to context.rect(voronoi.xmin, voronoi.ymin, voronoi.xmax - voronoi.xmin, voronoi.ymax - voronoi.ymin).\n   */\n  renderBounds(context: RectContext): void {\n    const buffer = context === null ? (context = new Path()) : undefined;\n    context.rect(this.xmin, this.ymin, this.xmax - this.xmin, this.ymax - this.ymin);\n    return buffer && buffer.value();\n  }\n\n  /**\n   * Renders the cell with the specified index i to the specified context.\n   * The specified context must implement the context.moveTo, context.lineTo, and context.closePath methods from the CanvasPathMethods API.\n   */\n  renderCell(i: number, context: MoveContext & LineContext & ClosableContext): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const points = this._clip(i);\n    if (points === null) return;\n    context.moveTo(points[0], points[1]);\n    let n = points.length;\n    while (points[0] === points[n - 2] && points[1] === points[n - 1] && n > 1) n -= 2;\n    for (let i = 2; i < n; i += 2) {\n      if (points[i] !== points[i - 2] || points[i + 1] !== points[i - 1]) context.lineTo(points[i], points[i + 1]);\n    }\n    context.closePath();\n    return buffer && buffer.value();\n  }\n  *cellPolygons() {\n    const {\n      delaunay: { points },\n    } = this;\n    for (let i = 0, n = points.length / 2; i < n; ++i) {\n      const cell = this.cellPolygon(i);\n      if (cell) yield cell;\n    }\n  }\n  cellPolygon(i) {\n    const polygon = new Polygon();\n    this.renderCell(i, polygon);\n    return polygon.value();\n  }\n  _renderSegment(x0, y0, x1, y1, context) {\n    let S;\n    const c0 = this._regioncode(x0, y0);\n    const c1 = this._regioncode(x1, y1);\n    if (c0 === 0 && c1 === 0) {\n      context.moveTo(x0, y0);\n      context.lineTo(x1, y1);\n    } else if ((S = this._clipSegment(x0, y0, x1, y1, c0, c1))) {\n      context.moveTo(S[0], S[1]);\n      context.lineTo(S[2], S[3]);\n    }\n  }\n  contains(i, x, y) {\n    if (((x = +x), x !== x) || ((y = +y), y !== y)) return false;\n    return this.delaunay._step(i, x, y) === i;\n  }\n  *neighbors(i) {\n    const ci = this._clip(i);\n    if (ci)\n      for (const j of this.delaunay.neighbors(i)) {\n        const cj = this._clip(j);\n        // find the common edge\n        if (cj)\n          loop: for (let ai = 0, li = ci.length; ai < li; ai += 2) {\n            for (let aj = 0, lj = cj.length; aj < lj; aj += 2) {\n              if (\n                ci[ai] == cj[aj] &&\n                ci[ai + 1] == cj[aj + 1] &&\n                ci[(ai + 2) % li] == cj[(aj + lj - 2) % lj] &&\n                ci[(ai + 3) % li] == cj[(aj + lj - 1) % lj]\n              ) {\n                yield j;\n                break loop;\n              }\n            }\n          }\n      }\n  }\n  _cell(i) {\n    const {\n      circumcenters,\n      delaunay: { inedges, halfedges, triangles },\n    } = this;\n    const e0 = inedges[i];\n    if (e0 === -1) return null; // coincident point\n    const points = [];\n    let e = e0;\n    do {\n      const t = Math.floor(e / 3);\n      points.push(circumcenters[t * 2], circumcenters[t * 2 + 1]);\n      e = e % 3 === 2 ? e - 2 : e + 1;\n      if (triangles[e] !== i) break; // bad triangulation\n      e = halfedges[e];\n    } while (e !== e0 && e !== -1);\n    return points;\n  }\n  _clip(i) {\n    // degenerate case (1 valid point: return the box)\n    if (i === 0 && this.delaunay.hull.length === 1) {\n      return [this.xmax, this.ymin, this.xmax, this.ymax, this.xmin, this.ymax, this.xmin, this.ymin];\n    }\n    const points = this._cell(i);\n    if (points === null) return null;\n    const { vectors: V } = this;\n    const v = i * 4;\n    return V[v] || V[v + 1]\n      ? this._clipInfinite(i, points, V[v], V[v + 1], V[v + 2], V[v + 3])\n      : this._clipFinite(i, points);\n  }\n  _clipFinite(i, points) {\n    const n = points.length;\n    let P = null;\n    let x0,\n      y0,\n      x1 = points[n - 2],\n      y1 = points[n - 1];\n    let c0,\n      c1 = this._regioncode(x1, y1);\n    let e0, e1;\n    for (let j = 0; j < n; j += 2) {\n      (x0 = x1), (y0 = y1), (x1 = points[j]), (y1 = points[j + 1]);\n      (c0 = c1), (c1 = this._regioncode(x1, y1));\n      if (c0 === 0 && c1 === 0) {\n        (e0 = e1), (e1 = 0);\n        if (P) P.push(x1, y1);\n        else P = [x1, y1];\n      } else {\n        let S, sx0, sy0, sx1, sy1;\n        if (c0 === 0) {\n          if ((S = this._clipSegment(x0, y0, x1, y1, c0, c1)) === null) continue;\n          [sx0, sy0, sx1, sy1] = S;\n        } else {\n          if ((S = this._clipSegment(x1, y1, x0, y0, c1, c0)) === null) continue;\n          [sx1, sy1, sx0, sy0] = S;\n          (e0 = e1), (e1 = this._edgecode(sx0, sy0));\n          if (e0 && e1) this._edge(i, e0, e1, P, P.length);\n          if (P) P.push(sx0, sy0);\n          else P = [sx0, sy0];\n        }\n        (e0 = e1), (e1 = this._edgecode(sx1, sy1));\n        if (e0 && e1) this._edge(i, e0, e1, P, P.length);\n        if (P) P.push(sx1, sy1);\n        else P = [sx1, sy1];\n      }\n    }\n    if (P) {\n      (e0 = e1), (e1 = this._edgecode(P[0], P[1]));\n      if (e0 && e1) this._edge(i, e0, e1, P, P.length);\n    } else if (this.contains(i, (this.xmin + this.xmax) / 2, (this.ymin + this.ymax) / 2)) {\n      return [this.xmax, this.ymin, this.xmax, this.ymax, this.xmin, this.ymax, this.xmin, this.ymin];\n    }\n    return P;\n  }\n  _clipSegment(x0, y0, x1, y1, c0, c1) {\n    while (true) {\n      if (c0 === 0 && c1 === 0) return [x0, y0, x1, y1];\n      if (c0 & c1) return null;\n      let x,\n        y,\n        c = c0 || c1;\n      if (c & 0b1000) (x = x0 + ((x1 - x0) * (this.ymax - y0)) / (y1 - y0)), (y = this.ymax);\n      else if (c & 0b0100) (x = x0 + ((x1 - x0) * (this.ymin - y0)) / (y1 - y0)), (y = this.ymin);\n      else if (c & 0b0010) (y = y0 + ((y1 - y0) * (this.xmax - x0)) / (x1 - x0)), (x = this.xmax);\n      else (y = y0 + ((y1 - y0) * (this.xmin - x0)) / (x1 - x0)), (x = this.xmin);\n      if (c0) (x0 = x), (y0 = y), (c0 = this._regioncode(x0, y0));\n      else (x1 = x), (y1 = y), (c1 = this._regioncode(x1, y1));\n    }\n  }\n  _clipInfinite(i, points, vx0, vy0, vxn, vyn) {\n    let P = Array.from(points),\n      p;\n    if ((p = this._project(P[0], P[1], vx0, vy0))) P.unshift(p[0], p[1]);\n    if ((p = this._project(P[P.length - 2], P[P.length - 1], vxn, vyn))) P.push(p[0], p[1]);\n    if ((P = this._clipFinite(i, P))) {\n      for (let j = 0, n = P.length, c0, c1 = this._edgecode(P[n - 2], P[n - 1]); j < n; j += 2) {\n        (c0 = c1), (c1 = this._edgecode(P[j], P[j + 1]));\n        if (c0 && c1) (j = this._edge(i, c0, c1, P, j)), (n = P.length);\n      }\n    } else if (this.contains(i, (this.xmin + this.xmax) / 2, (this.ymin + this.ymax) / 2)) {\n      P = [this.xmin, this.ymin, this.xmax, this.ymin, this.xmax, this.ymax, this.xmin, this.ymax];\n    }\n    return P;\n  }\n  _edge(i, e0, e1, P, j) {\n    while (e0 !== e1) {\n      let x, y;\n      switch (e0) {\n        case 0b0101:\n          e0 = 0b0100;\n          continue; // top-left\n        case 0b0100:\n          (e0 = 0b0110), (x = this.xmax), (y = this.ymin);\n          break; // top\n        case 0b0110:\n          e0 = 0b0010;\n          continue; // top-right\n        case 0b0010:\n          (e0 = 0b1010), (x = this.xmax), (y = this.ymax);\n          break; // right\n        case 0b1010:\n          e0 = 0b1000;\n          continue; // bottom-right\n        case 0b1000:\n          (e0 = 0b1001), (x = this.xmin), (y = this.ymax);\n          break; // bottom\n        case 0b1001:\n          e0 = 0b0001;\n          continue; // bottom-left\n        case 0b0001:\n          (e0 = 0b0101), (x = this.xmin), (y = this.ymin);\n          break; // left\n      }\n      if ((P[j] !== x || P[j + 1] !== y) && this.contains(i, x, y)) {\n        P.splice(j, 0, x, y), (j += 2);\n      }\n    }\n    if (P.length > 4) {\n      for (let i = 0; i < P.length; i += 2) {\n        const j = (i + 2) % P.length,\n          k = (i + 4) % P.length;\n        if ((P[i] === P[j] && P[j] === P[k]) || (P[i + 1] === P[j + 1] && P[j + 1] === P[k + 1]))\n          P.splice(j, 2), (i -= 2);\n      }\n    }\n    return j;\n  }\n  _project(x0, y0, vx, vy) {\n    let t = Infinity,\n      c,\n      x,\n      y;\n    if (vy < 0) {\n      // top\n      if (y0 <= this.ymin) return null;\n      if ((c = (this.ymin - y0) / vy) < t) (y = this.ymin), (x = x0 + (t = c) * vx);\n    } else if (vy > 0) {\n      // bottom\n      if (y0 >= this.ymax) return null;\n      if ((c = (this.ymax - y0) / vy) < t) (y = this.ymax), (x = x0 + (t = c) * vx);\n    }\n    if (vx > 0) {\n      // right\n      if (x0 >= this.xmax) return null;\n      if ((c = (this.xmax - x0) / vx) < t) (x = this.xmax), (y = y0 + (t = c) * vy);\n    } else if (vx < 0) {\n      // left\n      if (x0 <= this.xmin) return null;\n      if ((c = (this.xmin - x0) / vx) < t) (x = this.xmin), (y = y0 + (t = c) * vy);\n    }\n    return [x, y];\n  }\n  _edgecode(x, y) {\n    return (\n      (x === this.xmin ? 0b0001 : x === this.xmax ? 0b0010 : 0b0000) |\n      (y === this.ymin ? 0b0100 : y === this.ymax ? 0b1000 : 0b0000)\n    );\n  }\n  _regioncode(x, y) {\n    return (\n      (x < this.xmin ? 0b0001 : x > this.xmax ? 0b0010 : 0b0000) |\n      (y < this.ymin ? 0b0100 : y > this.ymax ? 0b1000 : 0b0000)\n    );\n  }\n}\n\nconst tau = 2 * Math.PI;\n\nfunction pointX(p) {\n  return p[0];\n}\n\nfunction pointY(p) {\n  return p[1];\n}\n\n// A triangulation is collinear if all its triangles have a non-null area\nfunction collinear(d) {\n  const { triangles, coords } = d;\n  for (let i = 0; i < triangles.length; i += 3) {\n    const a = 2 * triangles[i],\n      b = 2 * triangles[i + 1],\n      c = 2 * triangles[i + 2],\n      cross =\n        (coords[c] - coords[a]) * (coords[b + 1] - coords[a + 1]) -\n        (coords[b] - coords[a]) * (coords[c + 1] - coords[a + 1]);\n    if (cross > 1e-10) return false;\n  }\n  return true;\n}\n\nfunction jitter(x, y, r) {\n  return [x + Math.sin(x + y) * r, y + Math.cos(x - y) * r];\n}\n\nexport class Delaunay<P> implements DelaunayI<P> {\n  /**\n   * The coordinates of the points as an array [x0, y0, x1, y1, ...].\n   * Typically, this is a Float64Array, however you can use any array-like type in the constructor.\n   */\n  points: ArrayLike<number>;\n\n  /**\n   * The halfedge indices as an Int32Array [j0, j1, ...].\n   * For each index 0 <= i < halfedges.length, there is a halfedge from triangle vertex j = halfedges[i] to triangle vertex i.\n   */\n  halfedges: Int32Array;\n\n  /**\n   * An arbitrary node on the convex hull.\n   * The convex hull is represented as a circular doubly-linked list of nodes.\n   */\n  hull: Node;\n\n  /**\n   * The triangle vertex indices as an Uint32Array [i0, j0, k0, i1, j1, k1, ...].\n   * Each contiguous triplet of indices i, j, k forms a counterclockwise triangle.\n   * The coordinates of the triangle's points can be found by going through 'points'.\n   */\n  triangles: Uint32Array;\n\n  /**\n   * The incoming halfedge indexes as a Int32Array [e0, e1, e2, ...].\n   * For each point i, inedges[i] is the halfedge index e of an incoming halfedge.\n   * For coincident points, the halfedge index is -1; for points on the convex hull, the incoming halfedge is on the convex hull; for other points, the choice of incoming halfedge is arbitrary.\n   */\n  inedges: Int32Array;\n\n  /**\n   * The outgoing halfedge indexes as a Int32Array [e0, e1, e2, ...].\n   * For each point i on the convex hull, outedges[i] is the halfedge index e of the corresponding outgoing halfedge; for other points, the halfedge index is -1.\n   */\n  outedges: Int32Array;\n  /**\n   * Returns the Delaunay triangulation for the given array or iterable of points.\n   * Otherwise, the getX and getY functions are invoked for each point in order, and must return the respective x- and y-coordinate for each point.\n   * If that is specified, the functions getX and getY are invoked with that as this.\n   * (See Array.from for reference.)\n   */\n  static from<P>(\n    points: ArrayLike<P> | Iterable<P>,\n    fx: GetCoordinate<P, ArrayLike<P> | Iterable<P>> = pointX,\n    fy: GetCoordinate<P, ArrayLike<P> | Iterable<P>> = pointY,\n    that?: any,\n  ): Delaunay<P> {\n    return new Delaunay(\n      'length' in points ? flatArray(points, fx, fy, that) : Float64Array.from(flatIterable(points, fx, fy, that)),\n    );\n  }\n  /**\n   * Returns the Delaunay triangulation for the given flat array [x0, y0, x1, y1, …] of points.\n   */\n  constructor(points: ArrayLike<number>) {\n    this._delaunator = new Delaunator(points);\n    this.inedges = new Int32Array(points.length / 2);\n    this._hullIndex = new Int32Array(points.length / 2);\n    this.points = this._delaunator.coords;\n    this._init();\n  }\n  update() {\n    this._delaunator.update();\n    this._init();\n    return this;\n  }\n  _init() {\n    const d = this._delaunator,\n      points = this.points;\n\n    // check for collinear\n    if (d.hull && d.hull.length > 2 && collinear(d)) {\n      this.collinear = Int32Array.from({ length: points.length / 2 }, (_, i) => i).sort(\n        (i, j) => points[2 * i] - points[2 * j] || points[2 * i + 1] - points[2 * j + 1],\n      ); // for exact neighbors\n      const e = this.collinear[0],\n        f = this.collinear[this.collinear.length - 1],\n        bounds = [points[2 * e], points[2 * e + 1], points[2 * f], points[2 * f + 1]],\n        r = 1e-8 * Math.sqrt((bounds[3] - bounds[1]) ** 2 + (bounds[2] - bounds[0]) ** 2);\n      for (let i = 0, n = points.length / 2; i < n; ++i) {\n        const p = jitter(points[2 * i], points[2 * i + 1], r);\n        points[2 * i] = p[0];\n        points[2 * i + 1] = p[1];\n      }\n      this._delaunator = new Delaunator(points);\n    } else {\n      delete this.collinear;\n    }\n\n    const halfedges = (this.halfedges = this._delaunator.halfedges);\n    const hull = (this.hull = this._delaunator.hull);\n    const triangles = (this.triangles = this._delaunator.triangles);\n    const inedges = this.inedges.fill(-1);\n    const hullIndex = this._hullIndex.fill(-1);\n\n    // Compute an index from each point to an (arbitrary) incoming halfedge\n    // Used to give the first neighbor of each point; for this reason,\n    // on the hull we give priority to exterior halfedges\n    for (let e = 0, n = halfedges.length; e < n; ++e) {\n      const p = triangles[e % 3 === 2 ? e - 2 : e + 1];\n      if (halfedges[e] === -1 || inedges[p] === -1) inedges[p] = e;\n    }\n    for (let i = 0, n = hull.length; i < n; ++i) {\n      hullIndex[hull[i]] = i;\n    }\n\n    // degenerate case: 1 or 2 (distinct) points\n    if (hull.length <= 2 && hull.length > 0) {\n      this.triangles = new Int32Array(3).fill(-1);\n      this.halfedges = new Int32Array(3).fill(-1);\n      this.triangles[0] = hull[0];\n      this.triangles[1] = hull[1];\n      this.triangles[2] = hull[1];\n      inedges[hull[0]] = 1;\n      if (hull.length === 2) inedges[hull[1]] = 0;\n    }\n  }\n  voronoi(bounds) {\n    return new Voronoi(this, bounds);\n  }\n  *neighbors(i) {\n    const { inedges, hull, _hullIndex, halfedges, triangles, collinear } = this;\n\n    // degenerate case with several collinear points\n    if (collinear) {\n      const l = collinear.indexOf(i);\n      if (l > 0) yield collinear[l - 1];\n      if (l < collinear.length - 1) yield collinear[l + 1];\n      return;\n    }\n\n    const e0 = inedges[i];\n    if (e0 === -1) return; // coincident point\n    let e = e0,\n      p0 = -1;\n    do {\n      yield (p0 = triangles[e]);\n      e = e % 3 === 2 ? e - 2 : e + 1;\n      if (triangles[e] !== i) return; // bad triangulation\n      e = halfedges[e];\n      if (e === -1) {\n        const p = hull[(_hullIndex[i] + 1) % hull.length];\n        if (p !== p0) yield p;\n        return;\n      }\n    } while (e !== e0);\n  }\n  find(x, y, i = 0) {\n    if (((x = +x), x !== x) || ((y = +y), y !== y)) return -1;\n    const i0 = i;\n    let c;\n    while ((c = this._step(i, x, y)) >= 0 && c !== i && c !== i0) i = c;\n    return c;\n  }\n  _step(i, x, y) {\n    const { inedges, hull, _hullIndex, halfedges, triangles, points } = this;\n    if (inedges[i] === -1 || !points.length) return (i + 1) % (points.length >> 1);\n    let c = i;\n    let dc = (x - points[i * 2]) ** 2 + (y - points[i * 2 + 1]) ** 2;\n    const e0 = inedges[i];\n    let e = e0;\n    do {\n      let t = triangles[e];\n      const dt = (x - points[t * 2]) ** 2 + (y - points[t * 2 + 1]) ** 2;\n      if (dt < dc) (dc = dt), (c = t);\n      e = e % 3 === 2 ? e - 2 : e + 1;\n      if (triangles[e] !== i) break; // bad triangulation\n      e = halfedges[e];\n      if (e === -1) {\n        e = hull[(_hullIndex[i] + 1) % hull.length];\n        if (e !== t) {\n          if ((x - points[e * 2]) ** 2 + (y - points[e * 2 + 1]) ** 2 < dc) return e;\n        }\n        break;\n      }\n    } while (e !== e0);\n    return c;\n  }\n  /**\n   * Renders the edges of the Delaunay triangulation to the specified context.\n   * The specified context must implement the context.moveTo and context.lineTo methods from the CanvasPathMethods API.\n   */\n  render(context: MoveContext & LineContext): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const { points, halfedges, triangles } = this;\n    for (let i = 0, n = halfedges.length; i < n; ++i) {\n      const j = halfedges[i];\n      if (j < i) continue;\n      const ti = triangles[i] * 2;\n      const tj = triangles[j] * 2;\n      context.moveTo(points[ti], points[ti + 1]);\n      context.lineTo(points[tj], points[tj + 1]);\n    }\n    this.renderHull(context);\n    return buffer && buffer.value();\n  }\n  /**\n   * Renders the input points of the Delaunay triangulation to the specified context as circles with the specified radius.\n   * If radius is not specified, it defaults to 2.\n   * The specified context must implement the context.moveTo and context.arc methods from the CanvasPathMethods API.\n   */\n  renderPoints(context: MoveContext & ArcContext, r?: number): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const { points } = this;\n    for (let i = 0, n = points.length; i < n; i += 2) {\n      const x = points[i],\n        y = points[i + 1];\n      context.moveTo(x + r, y);\n      context.arc(x, y, r, 0, tau);\n    }\n    return buffer && buffer.value();\n  }\n  /**\n   * Renders the convex hull of the Delaunay triangulation to the specified context.\n   * The specified context must implement the context.moveTo and context.lineTo methods from the CanvasPathMethods API.\n   */\n  renderHull(context: MoveContext & LineContext): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const { hull, points } = this;\n    const h = hull[0] * 2,\n      n = hull.length;\n    context.moveTo(points[h], points[h + 1]);\n    for (let i = 1; i < n; ++i) {\n      const h = 2 * hull[i];\n      context.lineTo(points[h], points[h + 1]);\n    }\n    context.closePath();\n    return buffer && buffer.value();\n  }\n  hullPolygon() {\n    const polygon = new Polygon();\n    this.renderHull(polygon);\n    return polygon.value();\n  }\n  /**\n   * Renders triangle i of the Delaunay triangulation to the specified context.\n   * The specified context must implement the context.moveTo, context.lineTo and context.closePath methods from the CanvasPathMethods API.\n   */\n  renderTriangle(i: number, context: MoveContext & LineContext & ClosableContext): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const { points, triangles } = this;\n    const t0 = triangles[(i *= 3)] * 2;\n    const t1 = triangles[i + 1] * 2;\n    const t2 = triangles[i + 2] * 2;\n    context.moveTo(points[t0], points[t0 + 1]);\n    context.lineTo(points[t1], points[t1 + 1]);\n    context.lineTo(points[t2], points[t2 + 1]);\n    context.closePath();\n    return buffer && buffer.value();\n  }\n  *trianglePolygons() {\n    const { triangles } = this;\n    for (let i = 0, n = triangles.length / 3; i < n; ++i) {\n      yield this.trianglePolygon(i);\n    }\n  }\n  trianglePolygon(i) {\n    const polygon = new Polygon();\n    this.renderTriangle(i, polygon);\n    return polygon.value();\n  }\n}\n\nfunction flatArray(points, fx, fy, that) {\n  const n = points.length;\n  const array = new Float64Array(n * 2);\n  for (let i = 0; i < n; ++i) {\n    const p = points[i];\n    array[i * 2] = fx.call(that, p, i, points);\n    array[i * 2 + 1] = fy.call(that, p, i, points);\n  }\n  return array;\n}\n\nfunction* flatIterable(points, fx, fy, that) {\n  let i = 0;\n  for (const p of points) {\n    yield fx.call(that, p, i, points);\n    yield fy.call(that, p, i, points);\n    ++i;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { groupBy, GroupKeysOrKeyFn } from '../../chart_types/xy_chart/utils/group_data_series';\nimport { isFiniteNumber } from '../common';\n\n/**\n * The function computes the participation ratio of a value in the total sum of its membership group.\n * It returns a shallow copy of the input array where each object is augmented with the computed ratio.\n *\n * @remarks\n * The ratio is computed using absolute values.\n * Product A made a profit of $200, and product B has a loss of $300. In total, the company lost $100 ($200 – $300).\n * Product A has a weight of: abs(200) / ( abs(200) + abs(-300) ) * 100% = 40%\n * Product B has a weight of: abs(-300) / ( abs(200) + abs(-300) ) * 100% = 60%\n * Product A and product B have respectively a weight of 40% and 60% in the formation of the overall total loss of $100.\n *\n * We don't compute the ratio for non-finite values. In this case, we return the original non-finite value.\n *\n * If the sum of the group values is 0, each ratio is considered 0.\n *\n * @public\n * @param data - an array of objects\n * @param groupAccessors - an array of accessor keys or a fn to describe an unique id for each group\n * @param valueGetterSetters - an array of getter and setter functions for the metric and ratio values\n */\nexport function computeRatioByGroups<T extends Record<string, unknown>>(\n  data: T[],\n  groupAccessors: GroupKeysOrKeyFn<T>,\n  valueGetterSetters: Array<[(datum: T) => unknown, (datum: T, value: number) => T]>,\n): T[] {\n  return groupBy(data, groupAccessors, true).flatMap((groupedData) => {\n    const groupSum = groupedData.reduce((sum, datum) => {\n      return (\n        valueGetterSetters.reduce((valueSum, [getter]) => {\n          const value = getter(datum);\n          return valueSum + (isFiniteNumber(value) ? Math.abs(value) : 0);\n        }, 0) + sum\n      );\n    }, 0);\n    return groupedData.map((datum) => {\n      return valueGetterSetters.reduce<T>((acc, [getter, setter]) => {\n        const value = getter(acc);\n        return isFiniteNumber(value) ? setter(acc, groupSum === 0 ? 0 : Math.abs(value) / groupSum) : acc;\n      }, datum);\n    });\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment-timezone';\n\n/** @internal */\nexport function getMomentWithTz(date: number | Date, timeZone?: string) {\n  if (timeZone === 'local' || !timeZone) {\n    return moment(date);\n  }\n  if (timeZone.toLowerCase().startsWith('utc+') || timeZone.toLowerCase().startsWith('utc-')) {\n    return moment(date).utcOffset(Number(timeZone.slice(3)));\n  }\n  return moment.tz(date, timeZone);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment-timezone';\n\nimport { getMomentWithTz } from './date_time';\nimport { TickFormatter, TickFormatterOptions } from '../../chart_types/xy_chart/utils/specs';\n\n/** @public */\nexport function timeFormatter(format: string): TickFormatter {\n  return (value: number, options?: TickFormatterOptions): string =>\n    getMomentWithTz(value, options && options.timeZone).format(format);\n}\n\n/** @public */\nexport function niceTimeFormatter(domain: [number, number]): TickFormatter {\n  const minDate = moment(domain[0]);\n  const maxDate = moment(domain[1]);\n  const diff = maxDate.diff(minDate, 'days');\n  const format = niceTimeFormatByDay(diff);\n  return timeFormatter(format);\n}\n\n/** @public */\nexport function niceTimeFormatByDay(days: number) {\n  if (days > 30) return 'YYYY-MM-DD';\n  if (days > 7) return 'MMMM DD';\n  if (days > 1) return 'MM-DD HH:mm';\n  return 'HH:mm:ss';\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Simple1DNoise } from './simple_noise';\n\n/** @public */\nexport type RandomNumberGenerator = (\n  min?: number,\n  max?: number,\n  fractionDigits?: number,\n  inclusive?: boolean,\n) => number;\n\nfunction defaultRNG(min = 0, max = 1, fractionDigits = 0, inclusive = true) {\n  const precision = Math.pow(10, Math.max(fractionDigits, 0));\n  const scaledMax = max * precision;\n  const scaledMin = min * precision;\n  const offset = inclusive ? 1 : 0;\n  const num = Math.floor(Math.random() * (scaledMax - scaledMin + offset)) + scaledMin;\n\n  return num / precision;\n}\n\nconst fillGroups = (n: number) => new Array(Math.max(n, 1)).fill(0).map((_, i) => String.fromCharCode(97 + i));\n\n/** @public */\nexport class DataGenerator {\n  private randomNumberGenerator: RandomNumberGenerator;\n\n  private generator: Simple1DNoise;\n\n  private frequency: number;\n\n  constructor(frequency = 500, randomNumberGenerator: RandomNumberGenerator = defaultRNG) {\n    this.randomNumberGenerator = randomNumberGenerator;\n    this.generator = new Simple1DNoise(this.randomNumberGenerator);\n    this.frequency = frequency;\n  }\n\n  generateBasicSeries(totalPoints = 50, offset = 0, amplitude = 1) {\n    const dataPoints = new Array(totalPoints).fill(0).map((_, i) => ({\n      x: i,\n      y: (this.generator.getValue(i) + offset) * amplitude,\n    }));\n    return dataPoints;\n  }\n\n  generateSimpleSeries(totalPoints = 50, groupIndex = 1, groupPrefix = '') {\n    const group = String.fromCharCode(97 + groupIndex);\n    const dataPoints = new Array(totalPoints).fill(0).map((_, i) => ({\n      x: i,\n      y: 3 + Math.sin(i / this.frequency) + this.generator.getValue(i),\n      g: `${groupPrefix}${group}`,\n    }));\n    return dataPoints;\n  }\n\n  generateGroupedSeries(totalPoints = 50, totalGroups = 2, groupPrefix = '') {\n    const groups = new Array(totalGroups).fill(0).map((_, i) => this.generateSimpleSeries(totalPoints, i, groupPrefix));\n    return groups.reduce((acc, curr) => [...acc, ...curr]);\n  }\n\n  generateRandomSeries(totalPoints = 50, groupIndex = 1, groupPrefix = '') {\n    const group = String.fromCharCode(97 + groupIndex);\n    const dataPoints = new Array(totalPoints).fill(0).map(() => ({\n      x: this.randomNumberGenerator(0, 100),\n      y: this.randomNumberGenerator(0, 100),\n      z: this.randomNumberGenerator(0, 100),\n      g: `${groupPrefix}${group}`,\n    }));\n    return dataPoints;\n  }\n\n  generateRandomGroupedSeries(totalPoints = 50, totalGroups = 2, groupPrefix = '') {\n    const groups = new Array(totalGroups).fill(0).map((_, i) => this.generateRandomSeries(totalPoints, i, groupPrefix));\n    return groups.reduce((acc, curr) => [...acc, ...curr]);\n  }\n\n  /**\n   * Generate data given a list or number of vertical and/or horizontal panels\n   */\n  generateSMGroupedSeries<T extends Record<string, any>>(\n    verticalGroups: Array<number | string> | number,\n    horizontalGroups: Array<number | string> | number,\n    seriesGenerator: (h: string | number, v: string | number) => T[],\n  ) {\n    const vGroups = typeof verticalGroups === 'number' ? fillGroups(verticalGroups) : verticalGroups;\n    const hGroups = typeof horizontalGroups === 'number' ? fillGroups(horizontalGroups) : horizontalGroups;\n\n    return vGroups.flatMap((v) => {\n      return hGroups.flatMap((h) => {\n        return seriesGenerator(h, v).map((row) => ({\n          h,\n          v,\n          ...row,\n        }));\n      });\n    });\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RandomNumberGenerator } from './data_generator';\n\n/** @internal */\nexport class Simple1DNoise {\n  private maxVertices: number;\n\n  private maxVerticesMask: number;\n\n  private amplitude: number;\n\n  private scale: number;\n\n  private getRandomNumber: RandomNumberGenerator;\n\n  constructor(randomNumberGenerator: RandomNumberGenerator, maxVertices = 256, amplitude = 5.1, scale = 0.6) {\n    this.getRandomNumber = randomNumberGenerator;\n    this.maxVerticesMask = maxVertices - 1;\n    this.amplitude = amplitude;\n    this.scale = scale;\n    this.maxVertices = maxVertices;\n  }\n\n  getValue(x: number) {\n    const r = new Array(this.maxVertices).fill(0).map(() => this.getRandomNumber(0, 1, 5, true));\n\n    const scaledX = x * this.scale;\n    const xFloor = Math.floor(scaledX);\n    const t = scaledX - xFloor;\n    const tRemapSmoothstep = t * t * (3 - 2 * t);\n\n    const xMin = xFloor & this.maxVerticesMask;\n    const xMax = (xMin + 1) & this.maxVerticesMask;\n\n    const y = this.lerp(r[xMin] ?? 0, r[xMax] ?? 0, tRemapSmoothstep);\n\n    return y * this.amplitude;\n  }\n\n  private lerp(a: number, b: number, t: number) {\n    return a * (1 - t) + b * t;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/**\n * data taken from https://www.data-to-viz.com/graph/streamgraph.html\n * @internal\n */\nexport const BABYNAME_DATA: [year: number, sex: 'F' | 'M', name: string, n1: number, n2: number][] = [\n  [1880, 'F', 'Helen', 636, 0.00651612638826278],\n  [1880, 'F', 'Amanda', 241, 0.00246916109995492],\n  [1880, 'F', 'Betty', 117, 0.00119872136387853],\n  [1880, 'F', 'Dorothy', 112, 0.00114749395516577],\n  [1880, 'F', 'Linda', 27, 0.000276628007048891],\n  [1880, 'F', 'Deborah', 12, 0.000122945780910618],\n  [1880, 'F', 'Jessica', 7, 7.17183721978607e-5],\n  [1881, 'F', 'Helen', 612, 0.00619088564058469],\n  [1881, 'F', 'Amanda', 263, 0.0026604622932578],\n  [1881, 'F', 'Betty', 112, 0.00113297253553184],\n  [1881, 'F', 'Dorothy', 109, 0.00110262505690152],\n  [1881, 'F', 'Linda', 38, 0.000384401395984017],\n  [1881, 'F', 'Deborah', 14, 0.00014162156694148],\n  [1881, 'F', 'Jessica', 7, 7.081078347074e-5],\n  [1882, 'F', 'Helen', 838, 0.00724311990042871],\n  [1882, 'F', 'Amanda', 288, 0.00248928225694925],\n  [1882, 'F', 'Betty', 123, 0.00106313096390541],\n  [1882, 'F', 'Dorothy', 115, 0.000993984234545706],\n  [1882, 'F', 'Linda', 36, 0.000311160282118656],\n  [1882, 'F', 'Deborah', 15, 0.00012965011754944],\n  [1882, 'F', 'Jessica', 8, 6.91467293597013e-5],\n  [1883, 'F', 'Helen', 862, 0.0071798032633955],\n  [1883, 'F', 'Amanda', 287, 0.00239049134175697],\n  [1883, 'F', 'Dorothy', 141, 0.00117442257556701],\n  [1883, 'F', 'Betty', 120, 0.000999508574950649],\n  [1883, 'F', 'Linda', 49, 0.000408132668104848],\n  [1883, 'F', 'Deborah', 16, 0.00013326780999342],\n  [1883, 'F', 'Jessica', 6, 4.99754287475325e-5],\n  [1884, 'F', 'Helen', 986, 0.00716642681668193],\n  [1884, 'F', 'Amanda', 337, 0.00244937711685782],\n  [1884, 'F', 'Dorothy', 163, 0.00118471356097277],\n  [1884, 'F', 'Betty', 144, 0.00104661811521521],\n  [1884, 'F', 'Linda', 33, 0.000239849984736819],\n  [1884, 'F', 'Jessica', 14, 0.000101754538979257],\n  [1884, 'F', 'Deborah', 13, 9.44863576235954e-5],\n  [1884, 'F', 'Patricia', 6, 4.36090881339671e-5],\n  [1885, 'F', 'Helen', 1134, 0.00798878470436565],\n  [1885, 'F', 'Amanda', 339, 0.0023881816708818],\n  [1885, 'F', 'Dorothy', 196, 0.00138077760322369],\n  [1885, 'F', 'Betty', 155, 0.0010919414719371],\n  [1885, 'F', 'Linda', 60, 0.000422687021395008],\n  [1885, 'F', 'Deborah', 10, 7.0447836899168e-5],\n  [1885, 'F', 'Jessica', 6, 4.22687021395008e-5],\n  [1885, 'F', 'Patricia', 5, 3.5223918449584e-5],\n  [1886, 'F', 'Helen', 1267, 0.00824140084300359],\n  [1886, 'F', 'Amanda', 370, 0.0024067232138211],\n  [1886, 'F', 'Dorothy', 230, 0.00149607118696987],\n  [1886, 'F', 'Betty', 167, 0.00108627777488682],\n  [1886, 'F', 'Linda', 49, 0.000318728209397929],\n  [1886, 'F', 'Jessica', 11, 7.15512306811677e-5],\n  [1886, 'F', 'Deborah', 10, 6.50465733465161e-5],\n  [1886, 'F', 'Patricia', 8, 5.20372586772129e-5],\n  [1887, 'F', 'Helen', 1405, 0.00903990426065808],\n  [1887, 'F', 'Amanda', 338, 0.00217472429900529],\n  [1887, 'F', 'Dorothy', 272, 0.00175007399209893],\n  [1887, 'F', 'Betty', 178, 0.00114526900953533],\n  [1887, 'F', 'Linda', 50, 0.000321704777959362],\n  [1887, 'F', 'Deborah', 15, 9.65114333878087e-5],\n  [1887, 'F', 'Patricia', 10, 6.43409555918724e-5],\n  [1887, 'F', 'Jessica', 8, 5.1472764473498e-5],\n  [1888, 'F', 'Helen', 1847, 0.0097494286000834],\n  [1888, 'F', 'Amanda', 404, 0.0021325225524817],\n  [1888, 'F', 'Dorothy', 373, 0.00196888839622691],\n  [1888, 'F', 'Betty', 214, 0.00112960353027496],\n  [1888, 'F', 'Linda', 77, 0.000406446130052205],\n  [1888, 'F', 'Deborah', 26, 0.000137241550407238],\n  [1888, 'F', 'Jessica', 18, 9.50133810511647e-5],\n  [1888, 'F', 'Patricia', 12, 6.33422540341098e-5],\n  [1889, 'F', 'Helen', 1909, 0.010088838858677],\n  [1889, 'F', 'Amanda', 413, 0.00218265607576406],\n  [1889, 'F', 'Dorothy', 377, 0.00199240034034637],\n  [1889, 'F', 'Betty', 189, 0.000998842610942876],\n  [1889, 'F', 'Linda', 74, 0.000391081233914142],\n  [1889, 'F', 'Patricia', 17, 8.9842986169465e-5],\n  [1889, 'F', 'Deborah', 12, 6.34185784725635e-5],\n  [1889, 'F', 'Jessica', 9, 4.75639338544226e-5],\n  [1890, 'F', 'Helen', 2312, 0.0114647849608997],\n  [1890, 'F', 'Dorothy', 458, 0.00227113819727166],\n  [1890, 'F', 'Amanda', 392, 0.00194385627364736],\n  [1890, 'F', 'Betty', 216, 0.00107110447731589],\n  [1890, 'F', 'Linda', 54, 0.000267776119328973],\n  [1890, 'F', 'Deborah', 24, 0.000119011608590655],\n  [1890, 'F', 'Jessica', 18, 8.9258706442991e-5],\n  [1890, 'F', 'Patricia', 11, 5.45469872707167e-5],\n  [1891, 'F', 'Helen', 2417, 0.0122960619025574],\n  [1891, 'F', 'Dorothy', 566, 0.00287942533589056],\n  [1891, 'F', 'Amanda', 371, 0.00188739717246537],\n  [1891, 'F', 'Betty', 239, 0.00121587041568524],\n  [1891, 'F', 'Linda', 78, 0.000396811265370077],\n  [1891, 'F', 'Deborah', 15, 7.63098587250149e-5],\n  [1891, 'F', 'Jessica', 14, 7.12225348100139e-5],\n  [1891, 'F', 'Patricia', 12, 6.10478869800119e-5],\n  [1892, 'F', 'Helen', 2936, 0.0130538203321255],\n  [1892, 'F', 'Dorothy', 626, 0.00278327368116844],\n  [1892, 'F', 'Amanda', 455, 0.00202298646155214],\n  [1892, 'F', 'Betty', 255, 0.00113376164328746],\n  [1892, 'F', 'Linda', 83, 0.000369028299579841],\n  [1892, 'F', 'Patricia', 21, 9.33686059177912e-5],\n  [1892, 'F', 'Deborah', 16, 7.11379854611742e-5],\n  [1892, 'F', 'Jessica', 14, 6.22457372785274e-5],\n  [1893, 'F', 'Helen', 3249, 0.0144251260922071],\n  [1893, 'F', 'Dorothy', 821, 0.00364513035447894],\n  [1893, 'F', 'Amanda', 387, 0.00171822831569226],\n  [1893, 'F', 'Betty', 298, 0.00132308020174753],\n  [1893, 'F', 'Linda', 82, 0.000364069048803012],\n  [1893, 'F', 'Patricia', 28, 0.000124316260566882],\n  [1893, 'F', 'Deborah', 24, 0.000106556794771613],\n  [1893, 'F', 'Jessica', 15, 6.65979967322583e-5],\n  [1894, 'F', 'Helen', 3676, 0.0155781194378994],\n  [1894, 'F', 'Dorothy', 1052, 0.004458156052413],\n  [1894, 'F', 'Amanda', 418, 0.00177139660637703],\n  [1894, 'F', 'Betty', 298, 0.00126286169545539],\n  [1894, 'F', 'Linda', 94, 0.000398352346888614],\n  [1894, 'F', 'Patricia', 36, 0.00015256047327649],\n  [1894, 'F', 'Deborah', 18, 7.62802366382452e-5],\n  [1894, 'F', 'Jessica', 10, 4.23779092434696e-5],\n  [1895, 'F', 'Helen', 4023, 0.0162803967512049],\n  [1895, 'F', 'Dorothy', 1127, 0.00456077731509022],\n  [1895, 'F', 'Amanda', 431, 0.00174418369370354],\n  [1895, 'F', 'Betty', 350, 0.00141639047052491],\n  [1895, 'F', 'Linda', 96, 0.000388495671915405],\n  [1895, 'F', 'Patricia', 35, 0.000141639047052491],\n  [1895, 'F', 'Jessica', 19, 7.68897683999239e-5],\n  [1895, 'F', 'Deborah', 13, 5.26087889052111e-5],\n  [1896, 'F', 'Helen', 4392, 0.0174290555690039],\n  [1896, 'F', 'Dorothy', 1366, 0.00542078549800987],\n  [1896, 'F', 'Amanda', 367, 0.00145638966161758],\n  [1896, 'F', 'Betty', 342, 0.00135718055660276],\n  [1896, 'F', 'Linda', 104, 0.000412709876861659],\n  [1896, 'F', 'Patricia', 37, 0.000146829475421936],\n  [1896, 'F', 'Deborah', 18, 7.14305556106717e-5],\n  [1896, 'F', 'Jessica', 9, 3.57152778053359e-5],\n  [1897, 'F', 'Helen', 4519, 0.0182015909777464],\n  [1897, 'F', 'Dorothy', 1472, 0.00592890947538012],\n  [1897, 'F', 'Betty', 367, 0.00147819957708186],\n  [1897, 'F', 'Amanda', 354, 0.00142583828416071],\n  [1897, 'F', 'Linda', 81, 0.000326251132816433],\n  [1897, 'F', 'Patricia', 49, 0.000197361796395126],\n  [1897, 'F', 'Deborah', 23, 9.26392105528144e-5],\n  [1897, 'F', 'Jessica', 9, 3.62501258684926e-5],\n  [1898, 'F', 'Helen', 5230, 0.0190774258971497],\n  [1898, 'F', 'Dorothy', 1671, 0.00609529228950997],\n  [1898, 'F', 'Betty', 421, 0.00153567806934991],\n  [1898, 'F', 'Amanda', 371, 0.00135329350054351],\n  [1898, 'F', 'Linda', 102, 0.000372064520365061],\n  [1898, 'F', 'Patricia', 47, 0.000171441494678018],\n  [1898, 'F', 'Deborah', 21, 7.6601518898689e-5],\n  [1898, 'F', 'Jessica', 13, 4.74199878896646e-5],\n  [1899, 'F', 'Helen', 5048, 0.0203967837084327],\n  [1899, 'F', 'Dorothy', 1687, 0.0068164370277587],\n  [1899, 'F', 'Betty', 410, 0.00165663259121581],\n  [1899, 'F', 'Amanda', 326, 0.00131722493838135],\n  [1899, 'F', 'Linda', 98, 0.000395975594973534],\n  [1899, 'F', 'Patricia', 56, 0.000226271768556305],\n  [1899, 'F', 'Jessica', 14, 5.65679421390763e-5],\n  [1899, 'F', 'Deborah', 11, 4.44462402521314e-5],\n  [1900, 'F', 'Helen', 6343, 0.0199606639918181],\n  [1900, 'F', 'Dorothy', 2491, 0.00783887971048698],\n  [1900, 'F', 'Betty', 664, 0.00208952875462198],\n  [1900, 'F', 'Amanda', 377, 0.00118637400676579],\n  [1900, 'F', 'Linda', 126, 0.000396506962473448],\n  [1900, 'F', 'Patricia', 89, 0.000280072378255055],\n  [1900, 'F', 'Deborah', 26, 8.18188970183306e-5],\n  [1900, 'F', 'Jessica', 23, 7.2378255054677e-5],\n  [1901, 'F', 'Helen', 5247, 0.0206386292834891],\n  [1901, 'F', 'Dorothy', 2173, 0.00854731111740458],\n  [1901, 'F', 'Betty', 474, 0.00186443878032663],\n  [1901, 'F', 'Amanda', 317, 0.00124689260203279],\n  [1901, 'F', 'Linda', 86, 0.000338273702759684],\n  [1901, 'F', 'Patricia', 68, 0.000267472230089053],\n  [1901, 'F', 'Deborah', 21, 8.26017181157368e-5],\n  [1901, 'F', 'Jessica', 8, 3.14673211869474e-5],\n  [1902, 'F', 'Helen', 5967, 0.0212853998637335],\n  [1902, 'F', 'Dorothy', 2707, 0.00965637295644822],\n  [1902, 'F', 'Betty', 580, 0.00206896797736977],\n  [1902, 'F', 'Amanda', 301, 0.00107372303653155],\n  [1902, 'F', 'Linda', 91, 0.000324613941276981],\n  [1902, 'F', 'Patricia', 85, 0.000303210824269708],\n  [1902, 'F', 'Deborah', 21, 7.49109095254572e-5],\n  [1902, 'F', 'Jessica', 9, 3.21046755109102e-5],\n  [1903, 'F', 'Helen', 6129, 0.0220310713951934],\n  [1903, 'F', 'Dorothy', 3078, 0.0110640622865729],\n  [1903, 'F', 'Betty', 596, 0.00214235903924543],\n  [1903, 'F', 'Amanda', 247, 0.000887856850157082],\n  [1903, 'F', 'Linda', 90, 0.000323510593174645],\n  [1903, 'F', 'Patricia', 79, 0.000283970409564411],\n  [1903, 'F', 'Deborah', 21, 7.54858050740839e-5],\n  [1903, 'F', 'Jessica', 16, 5.75129943421592e-5],\n  [1904, 'F', 'Helen', 6488, 0.0221858992333418],\n  [1904, 'F', 'Dorothy', 3477, 0.0118896996970298],\n  [1904, 'F', 'Betty', 707, 0.00241760646701181],\n  [1904, 'F', 'Amanda', 294, 0.00100534130311382],\n  [1904, 'F', 'Patricia', 124, 0.000424021501993585],\n  [1904, 'F', 'Linda', 101, 0.000345372352430259],\n  [1904, 'F', 'Deborah', 23, 7.86491495633262e-5],\n  [1904, 'F', 'Jessica', 16, 5.471245187014e-5],\n  [1905, 'F', 'Helen', 6811, 0.0219801852389712],\n  [1905, 'F', 'Dorothy', 3937, 0.0127053280407913],\n  [1905, 'F', 'Betty', 807, 0.0026043179397812],\n  [1905, 'F', 'Amanda', 311, 0.00100364669054765],\n  [1905, 'F', 'Patricia', 121, 0.000390486332978346],\n  [1905, 'F', 'Linda', 106, 0.000342078936328138],\n  [1905, 'F', 'Deborah', 18, 5.80888759802498e-5],\n  [1905, 'F', 'Jessica', 17, 5.48617162035692e-5],\n  [1906, 'F', 'Helen', 7176, 0.0228942608018734],\n  [1906, 'F', 'Dorothy', 4326, 0.013801640500126],\n  [1906, 'F', 'Betty', 865, 0.00275969002140754],\n  [1906, 'F', 'Amanda', 260, 0.000829502202966427],\n  [1906, 'F', 'Patricia', 157, 0.000500891714868189],\n  [1906, 'F', 'Linda', 98, 0.000312658522656576],\n  [1906, 'F', 'Deborah', 25, 7.97598272083103e-5],\n  [1906, 'F', 'Jessica', 18, 5.74270755899834e-5],\n  [1907, 'F', 'Helen', 7579, 0.0224607551721379],\n  [1907, 'F', 'Dorothy', 4967, 0.0147199592215343],\n  [1907, 'F', 'Betty', 1018, 0.00301689520586309],\n  [1907, 'F', 'Amanda', 285, 0.000844612115590354],\n  [1907, 'F', 'Patricia', 177, 0.000524548577050852],\n  [1907, 'F', 'Linda', 102, 0.000302282230842864],\n  [1907, 'F', 'Deborah', 21, 6.22345769382366e-5],\n  [1907, 'F', 'Jessica', 17, 5.03803718071439e-5],\n  [1908, 'F', 'Helen', 8439, 0.0238031438540277],\n  [1908, 'F', 'Dorothy', 5703, 0.0160859496859249],\n  [1908, 'F', 'Betty', 1128, 0.00318165022720029],\n  [1908, 'F', 'Amanda', 260, 0.000733359094922052],\n  [1908, 'F', 'Patricia', 205, 0.000578225440227003],\n  [1908, 'F', 'Linda', 93, 0.000262316907029811],\n  [1908, 'F', 'Deborah', 25, 7.05152975886589e-5],\n  [1908, 'F', 'Jessica', 17, 4.7950402360288e-5],\n  [1909, 'F', 'Helen', 9250, 0.0251291775559769],\n  [1909, 'F', 'Dorothy', 6253, 0.0169873240278404],\n  [1909, 'F', 'Betty', 1082, 0.00293943460708833],\n  [1909, 'F', 'Amanda', 271, 0.000736216985694027],\n  [1909, 'F', 'Patricia', 233, 0.00063298360762623],\n  [1909, 'F', 'Linda', 105, 0.000285250123608387],\n  [1909, 'F', 'Deborah', 26, 7.06333639411244e-5],\n  [1909, 'F', 'Jessica', 18, 4.89000211900092e-5],\n  [1910, 'F', 'Helen', 10479, 0.0249781896712004],\n  [1910, 'F', 'Dorothy', 7318, 0.0174434957547327],\n  [1910, 'F', 'Betty', 1389, 0.00331087942106091],\n  [1910, 'F', 'Patricia', 316, 0.000753231027397587],\n  [1910, 'F', 'Amanda', 278, 0.000662652612710535],\n  [1910, 'F', 'Linda', 137, 0.000326559021371739],\n  [1910, 'F', 'Deborah', 33, 7.8660202228229e-5],\n  [1910, 'F', 'Jessica', 28, 6.67419897694064e-5],\n  [1911, 'F', 'Helen', 11802, 0.0267127194372267],\n  [1911, 'F', 'Dorothy', 8869, 0.0200741491856265],\n  [1911, 'F', 'Betty', 1456, 0.00329551936117625],\n  [1911, 'F', 'Patricia', 325, 0.000735607000262555],\n  [1911, 'F', 'Amanda', 280, 0.000633753723303124],\n  [1911, 'F', 'Linda', 130, 0.000294242800105022],\n  [1911, 'F', 'Deborah', 36, 8.14826215675446e-5],\n  [1911, 'F', 'Jessica', 21, 4.75315292477343e-5],\n  [1912, 'F', 'Helen', 16133, 0.0274974944947061],\n  [1912, 'F', 'Dorothy', 12645, 0.0215524588040388],\n  [1912, 'F', 'Betty', 2011, 0.00342759941913183],\n  [1912, 'F', 'Patricia', 504, 0.000859030386495497],\n  [1912, 'F', 'Amanda', 310, 0.000528371864709532],\n  [1912, 'F', 'Linda', 189, 0.000322136394935811],\n  [1912, 'F', 'Jessica', 36, 6.13593133211069e-5],\n  [1912, 'F', 'Deborah', 32, 5.45416118409839e-5],\n  [1913, 'F', 'Helen', 18889, 0.0288423952212843],\n  [1913, 'F', 'Dorothy', 14674, 0.0224063374173925],\n  [1913, 'F', 'Betty', 2239, 0.00341882168989653],\n  [1913, 'F', 'Patricia', 588, 0.000897841515703065],\n  [1913, 'F', 'Amanda', 346, 0.000528321708219831],\n  [1913, 'F', 'Linda', 238, 0.000363412042070288],\n  [1913, 'F', 'Deborah', 42, 6.41315368359332e-5],\n  [1913, 'F', 'Jessica', 25, 3.81735338309126e-5],\n  [1914, 'F', 'Helen', 23221, 0.0291498453442597],\n  [1914, 'F', 'Dorothy', 18782, 0.0235774684662971],\n  [1914, 'F', 'Betty', 2933, 0.00368186109102595],\n  [1914, 'F', 'Patricia', 656, 0.000823491604402667],\n  [1914, 'F', 'Amanda', 375, 0.000470745962882622],\n  [1914, 'F', 'Linda', 219, 0.000274915642323451],\n  [1914, 'F', 'Deborah', 62, 7.78299991965936e-5],\n  [1914, 'F', 'Jessica', 42, 5.27235478428537e-5],\n  [1915, 'F', 'Helen', 30866, 0.0301460519864594],\n  [1915, 'F', 'Dorothy', 25154, 0.0245672841206311],\n  [1915, 'F', 'Betty', 4182, 0.00408445504462428],\n  [1915, 'F', 'Patricia', 895, 0.000874124166652017],\n  [1915, 'F', 'Amanda', 412, 0.000402390119173889],\n  [1915, 'F', 'Linda', 290, 0.000283235763496184],\n  [1915, 'F', 'Deborah', 106, 0.000103527554933088],\n  [1915, 'F', 'Jessica', 55, 5.37171275596211e-5],\n  [1916, 'F', 'Helen', 32661, 0.0300826741628504],\n  [1916, 'F', 'Dorothy', 27415, 0.0252508040836026],\n  [1916, 'F', 'Betty', 5136, 0.00473055370320565],\n  [1916, 'F', 'Patricia', 1078, 0.000992900485213335],\n  [1916, 'F', 'Amanda', 421, 0.000387765402852332],\n  [1916, 'F', 'Linda', 297, 0.000273554215313878],\n  [1916, 'F', 'Deborah', 90, 8.28952167617813e-5],\n  [1916, 'F', 'Jessica', 53, 4.8816072093049e-5],\n  [1917, 'F', 'Helen', 34249, 0.0304787212268021],\n  [1917, 'F', 'Dorothy', 28853, 0.0256767363589279],\n  [1917, 'F', 'Betty', 6639, 0.00590815002554058],\n  [1917, 'F', 'Patricia', 1441, 0.00128236845711763],\n  [1917, 'F', 'Amanda', 445, 0.000396012465938478],\n  [1917, 'F', 'Linda', 291, 0.000258965455254151],\n  [1917, 'F', 'Deborah', 89, 7.92024931876957e-5],\n  [1917, 'F', 'Jessica', 55, 4.89453609586883e-5],\n  [1917, 'F', 'Ashley', 5, 4.44957826897167e-6],\n  [1918, 'F', 'Helen', 36150, 0.030065795437817],\n  [1918, 'F', 'Dorothy', 32034, 0.026642536405395],\n  [1918, 'F', 'Betty', 8802, 0.00732058454892574],\n  [1918, 'F', 'Patricia', 1760, 0.0014637842315507],\n  [1918, 'F', 'Amanda', 397, 0.000330183147685017],\n  [1918, 'F', 'Linda', 322, 0.00026780597872689],\n  [1918, 'F', 'Deborah', 92, 7.65159939219687e-5],\n  [1918, 'F', 'Jessica', 56, 4.65749528220679e-5],\n  [1919, 'F', 'Helen', 33705, 0.0286936534286809],\n  [1919, 'F', 'Dorothy', 31734, 0.0270157068062827],\n  [1919, 'F', 'Betty', 10107, 0.00860426510024262],\n  [1919, 'F', 'Patricia', 2144, 0.00182522453496786],\n  [1919, 'F', 'Amanda', 379, 0.000322649299791427],\n  [1919, 'F', 'Linda', 282, 0.000240071510662751],\n  [1919, 'F', 'Deborah', 70, 5.95922189588388e-5],\n  [1919, 'F', 'Jessica', 40, 3.40526965479079e-5],\n  [1920, 'F', 'Dorothy', 36645, 0.0294564957018998],\n  [1920, 'F', 'Helen', 35098, 0.0282129645557451],\n  [1920, 'F', 'Betty', 14017, 0.011267340708242],\n  [1920, 'F', 'Patricia', 2502, 0.00201119258414936],\n  [1920, 'F', 'Amanda', 379, 0.000304653073298404],\n  [1920, 'F', 'Linda', 349, 0.000280538054303807],\n  [1920, 'F', 'Deborah', 82, 6.59143852518974e-5],\n  [1920, 'F', 'Jessica', 43, 3.45648605589218e-5],\n  [1921, 'F', 'Dorothy', 39083, 0.0305412051909812],\n  [1921, 'F', 'Helen', 34819, 0.0272091247740648],\n  [1921, 'F', 'Betty', 17637, 0.013782341067813],\n  [1921, 'F', 'Patricia', 3382, 0.00264284614681315],\n  [1921, 'F', 'Amanda', 392, 0.000306326342268112],\n  [1921, 'F', 'Linda', 367, 0.000286790223501013],\n  [1921, 'F', 'Deborah', 94, 7.34558065642922e-5],\n  [1921, 'F', 'Jessica', 48, 3.75093480328301e-5],\n  [1922, 'F', 'Dorothy', 37711, 0.0302285073477132],\n  [1922, 'F', 'Helen', 32507, 0.0260570679205567],\n  [1922, 'F', 'Betty', 20893, 0.0167474796217489],\n  [1922, 'F', 'Patricia', 3902, 0.00312777798708008],\n  [1922, 'F', 'Linda', 365, 0.000292577899867819],\n  [1922, 'F', 'Amanda', 341, 0.000273339900972401],\n  [1922, 'F', 'Deborah', 71, 5.69124133989456e-5],\n  [1922, 'F', 'Jessica', 40, 3.20633314923637e-5],\n  [1923, 'F', 'Dorothy', 39045, 0.0311757435229189],\n  [1923, 'F', 'Helen', 31492, 0.0251449997444938],\n  [1923, 'F', 'Betty', 25990, 0.020751890745567],\n  [1923, 'F', 'Patricia', 4800, 0.00383259236547601],\n  [1923, 'F', 'Linda', 423, 0.000337747202207573],\n  [1923, 'F', 'Amanda', 362, 0.000289041340896316],\n  [1923, 'F', 'Deborah', 118, 9.42178956512852e-5],\n  [1923, 'F', 'Jessica', 52, 4.15197506259901e-5],\n  [1924, 'F', 'Dorothy', 39996, 0.0308678753677503],\n  [1924, 'F', 'Helen', 31193, 0.0240739483034863],\n  [1924, 'F', 'Betty', 30602, 0.0236178298330807],\n  [1924, 'F', 'Patricia', 6958, 0.00537000392061223],\n  [1924, 'F', 'Linda', 454, 0.000350385423966363],\n  [1924, 'F', 'Amanda', 341, 0.000263174955005572],\n  [1924, 'F', 'Deborah', 125, 9.64717576999898e-5],\n  [1924, 'F', 'Jessica', 41, 3.16427365255967e-5],\n  [1925, 'F', 'Dorothy', 38572, 0.030538871901736],\n  [1925, 'F', 'Betty', 32817, 0.0259824266099572],\n  [1925, 'F', 'Helen', 29168, 0.023093379021825],\n  [1925, 'F', 'Patricia', 8095, 0.00640910940694163],\n  [1925, 'F', 'Linda', 438, 0.000346780718992024],\n  [1925, 'F', 'Amanda', 310, 0.000245438408419012],\n  [1925, 'F', 'Deborah', 82, 6.49224177108356e-5],\n  [1925, 'F', 'Jessica', 34, 2.69190512459562e-5],\n  [1926, 'F', 'Dorothy', 36614, 0.0297646484033633],\n  [1926, 'F', 'Betty', 32959, 0.026793386320163],\n  [1926, 'F', 'Helen', 26884, 0.0218548316948713],\n  [1926, 'F', 'Patricia', 8590, 0.0069830755936224],\n  [1926, 'F', 'Linda', 479, 0.000389393854405719],\n  [1926, 'F', 'Amanda', 310, 0.000252008548780319],\n  [1926, 'F', 'Deborah', 116, 9.42999730919904e-5],\n  [1926, 'F', 'Jessica', 35, 2.84525780881006e-5],\n  [1927, 'F', 'Dorothy', 35987, 0.0291075004772119],\n  [1927, 'F', 'Betty', 35422, 0.0286505094035013],\n  [1927, 'F', 'Helen', 25316, 0.0204764354372717],\n  [1927, 'F', 'Patricia', 10553, 0.00853562265640418],\n  [1927, 'F', 'Linda', 516, 0.000417358219530423],\n  [1927, 'F', 'Amanda', 234, 0.000189267099554494],\n  [1927, 'F', 'Deborah', 91, 7.360387204897e-5],\n  [1927, 'F', 'Jessica', 39, 3.15445165924157e-5],\n  [1928, 'F', 'Betty', 36078, 0.0301810713703117],\n  [1928, 'F', 'Dorothy', 33728, 0.0282151775369442],\n  [1928, 'F', 'Helen', 22936, 0.0191871238136667],\n  [1928, 'F', 'Patricia', 12332, 0.0103163415970587],\n  [1928, 'F', 'Linda', 554, 0.000463449014334294],\n  [1928, 'F', 'Amanda', 247, 0.000206627990145434],\n  [1928, 'F', 'Deborah', 130, 0.000108751573760755],\n  [1928, 'F', 'Jessica', 36, 3.01158204260552e-5],\n  [1929, 'F', 'Betty', 36669, 0.0316800016587745],\n  [1929, 'F', 'Dorothy', 31477, 0.0271943988713422],\n  [1929, 'F', 'Helen', 20983, 0.0181281593391166],\n  [1929, 'F', 'Patricia', 13626, 0.0117721154818092],\n  [1929, 'F', 'Linda', 509, 0.000439748039060684],\n  [1929, 'F', 'Amanda', 209, 0.000180564518985625],\n  [1929, 'F', 'Deborah', 161, 0.000139095155773615],\n  [1929, 'F', 'Jessica', 42, 3.62856928105083e-5],\n  [1930, 'F', 'Betty', 38239, 0.0327853532062582],\n  [1930, 'F', 'Dorothy', 30404, 0.0260677810320111],\n  [1930, 'F', 'Helen', 19914, 0.0170738650003772],\n  [1930, 'F', 'Patricia', 15749, 0.0135028773672261],\n  [1930, 'F', 'Linda', 493, 0.000422688332087274],\n  [1930, 'F', 'Amanda', 196, 0.00016804647685417],\n  [1930, 'F', 'Deborah', 165, 0.000141467697351725],\n  [1930, 'F', 'Jessica', 38, 3.25804393900942e-5],\n  [1931, 'F', 'Betty', 36102, 0.0327140362625423],\n  [1931, 'F', 'Dorothy', 26521, 0.0240321576566086],\n  [1931, 'F', 'Helen', 17657, 0.0159999927507537],\n  [1931, 'F', 'Patricia', 16468, 0.0149225735186845],\n  [1931, 'F', 'Linda', 534, 0.000483887190853626],\n  [1931, 'F', 'Amanda', 209, 0.00018938655971612],\n  [1931, 'F', 'Deborah', 158, 0.000143172614522234],\n  [1931, 'F', 'Jessica', 39, 3.53400757365008e-5],\n  [1932, 'F', 'Betty', 34411, 0.0311083227035339],\n  [1932, 'F', 'Dorothy', 24968, 0.0225716370132177],\n  [1932, 'F', 'Patricia', 17991, 0.0162642711272349],\n  [1932, 'F', 'Helen', 16375, 0.0148033705579718],\n  [1932, 'F', 'Linda', 774, 0.000699713515228713],\n  [1932, 'F', 'Amanda', 213, 0.00019255682008232],\n  [1932, 'F', 'Deborah', 208, 0.000188036706934848],\n  [1932, 'F', 'Jessica', 44, 3.97769956977563e-5],\n  [1933, 'F', 'Betty', 31526, 0.0301434985810775],\n  [1933, 'F', 'Dorothy', 22050, 0.0210830471265862],\n  [1933, 'F', 'Patricia', 18625, 0.017808242754316],\n  [1933, 'F', 'Helen', 14645, 0.0140027766516488],\n  [1933, 'F', 'Linda', 786, 0.000751531747913687],\n  [1933, 'F', 'Deborah', 243, 0.000232343784660338],\n  [1933, 'F', 'Amanda', 199, 0.000190273305133363],\n  [1933, 'F', 'Jessica', 43, 4.11143322649981e-5],\n  [1934, 'F', 'Betty', 31078, 0.0287181174191951],\n  [1934, 'F', 'Dorothy', 21280, 0.0196641205573226],\n  [1934, 'F', 'Patricia', 20847, 0.0192640000591402],\n  [1934, 'F', 'Helen', 14099, 0.0130284039350419],\n  [1934, 'F', 'Linda', 1001, 0.000924989881479318],\n  [1934, 'F', 'Deborah', 280, 0.000258738428385823],\n  [1934, 'F', 'Amanda', 189, 0.000174648439160431],\n  [1934, 'F', 'Jessica', 46, 4.25070275205281e-5],\n  [1935, 'F', 'Betty', 28673, 0.0263859454097216],\n  [1935, 'F', 'Patricia', 22876, 0.0210513335609385],\n  [1935, 'F', 'Dorothy', 19400, 0.0178525909722944],\n  [1935, 'F', 'Helen', 12778, 0.0117587838888649],\n  [1935, 'F', 'Linda', 1197, 0.00110152326772353],\n  [1935, 'F', 'Deborah', 279, 0.00025674602480774],\n  [1935, 'F', 'Amanda', 211, 0.000194169932739903],\n  [1935, 'F', 'Jessica', 47, 4.32511224586515e-5],\n  [1936, 'F', 'Betty', 25863, 0.0240043659489396],\n  [1936, 'F', 'Patricia', 23912, 0.022193573776091],\n  [1936, 'F', 'Dorothy', 17668, 0.0163982963146528],\n  [1936, 'F', 'Helen', 12232, 0.0113529522594992],\n  [1936, 'F', 'Linda', 2439, 0.0022637222499116],\n  [1936, 'F', 'Deborah', 299, 0.00027751248574152],\n  [1936, 'F', 'Amanda', 192, 0.000178201997533016],\n  [1936, 'F', 'Jessica', 43, 3.99098223641651e-5],\n  [1937, 'F', 'Patricia', 26837, 0.0243591174914203],\n  [1937, 'F', 'Betty', 25328, 0.0229894447152324],\n  [1937, 'F', 'Dorothy', 16571, 0.0150409858013312],\n  [1937, 'F', 'Helen', 11452, 0.0103946273246542],\n  [1937, 'F', 'Linda', 4380, 0.00397559096070428],\n  [1937, 'F', 'Deborah', 323, 0.000293177141622713],\n  [1937, 'F', 'Amanda', 176, 0.00015974977376346],\n  [1937, 'F', 'Jessica', 72, 6.53521801759607e-5],\n  [1938, 'F', 'Patricia', 27555, 0.0241429070846355],\n  [1938, 'F', 'Betty', 25502, 0.0223441268906687],\n  [1938, 'F', 'Dorothy', 16348, 0.0143236525138676],\n  [1938, 'F', 'Helen', 10833, 0.00949156641073696],\n  [1938, 'F', 'Linda', 7047, 0.00617438091908643],\n  [1938, 'F', 'Deborah', 410, 0.000359230335862841],\n  [1938, 'F', 'Amanda', 192, 0.000168224937769916],\n  [1938, 'F', 'Jessica', 50, 4.38085775442489e-5],\n  [1938, 'F', 'Ashley', 7, 6.13320085619484e-6],\n  [1939, 'F', 'Patricia', 29704, 0.0261941652197148],\n  [1939, 'F', 'Betty', 23639, 0.0208458076901709],\n  [1939, 'F', 'Dorothy', 15170, 0.0133775076212993],\n  [1939, 'F', 'Linda', 10714, 0.00944803010247859],\n  [1939, 'F', 'Helen', 10417, 0.00918612372386778],\n  [1939, 'F', 'Deborah', 443, 0.000390654968769648],\n  [1939, 'F', 'Amanda', 185, 0.000163140336845113],\n  [1939, 'F', 'Jessica', 77, 6.79016537139118e-5],\n  [1940, 'F', 'Patricia', 32661, 0.027650413304301],\n  [1940, 'F', 'Betty', 22074, 0.0186875852937491],\n  [1940, 'F', 'Linda', 18368, 0.0155501298666116],\n  [1940, 'F', 'Dorothy', 14874, 0.0125921511125861],\n  [1940, 'F', 'Helen', 10201, 0.00863604501139508],\n  [1940, 'F', 'Deborah', 469, 0.000397049809856317],\n  [1940, 'F', 'Amanda', 218, 0.000184556201596326],\n  [1940, 'F', 'Jessica', 61, 5.16418729237427e-5],\n  [1941, 'F', 'Patricia', 36901, 0.0296201340816562],\n  [1941, 'F', 'Linda', 23715, 0.0190358385882897],\n  [1941, 'F', 'Betty', 20900, 0.0167762608684484],\n  [1941, 'F', 'Dorothy', 14561, 0.0116879968662908],\n  [1941, 'F', 'Helen', 9889, 0.00793782027407113],\n  [1941, 'F', 'Deborah', 608, 0.000488036679809409],\n  [1941, 'F', 'Amanda', 223, 0.000179000295390622],\n  [1941, 'F', 'Jessica', 81, 6.50180445140824e-5],\n  [1941, 'F', 'Ashley', 6, 4.81615144548759e-6],\n  [1942, 'F', 'Patricia', 39454, 0.0283767212206867],\n  [1942, 'F', 'Linda', 31611, 0.0227357564380576],\n  [1942, 'F', 'Betty', 21654, 0.0155743276046218],\n  [1942, 'F', 'Dorothy', 15032, 0.0108115494852071],\n  [1942, 'F', 'Helen', 10013, 0.00720170602683468],\n  [1942, 'F', 'Deborah', 676, 0.000486203263171901],\n  [1942, 'F', 'Amanda', 295, 0.000212174500940401],\n  [1942, 'F', 'Jessica', 127, 9.13429207438335e-5],\n  [1942, 'F', 'Ashley', 8, 5.7538847712651e-6],\n  [1943, 'F', 'Patricia', 39620, 0.0276053892520138],\n  [1943, 'F', 'Linda', 38437, 0.0267811293962558],\n  [1943, 'F', 'Betty', 21595, 0.0150464003255234],\n  [1943, 'F', 'Dorothy', 14785, 0.0103015063122419],\n  [1943, 'F', 'Helen', 9799, 0.00682749140031507],\n  [1943, 'F', 'Deborah', 788, 0.000549042067909815],\n  [1943, 'F', 'Amanda', 284, 0.000197878105693385],\n  [1943, 'F', 'Jessica', 121, 8.43072210876746e-5],\n  [1943, 'F', 'Ashley', 10, 6.96753893286567e-6],\n  [1944, 'F', 'Linda', 38411, 0.0281104982403037],\n  [1944, 'F', 'Patricia', 36872, 0.0269842048141543],\n  [1944, 'F', 'Betty', 19757, 0.0144588558937201],\n  [1944, 'F', 'Dorothy', 13378, 0.00979048307669114],\n  [1944, 'F', 'Helen', 8693, 0.00636183804647003],\n  [1944, 'F', 'Deborah', 1293, 0.000946262118265933],\n  [1944, 'F', 'Amanda', 238, 0.000174176631204402],\n  [1944, 'F', 'Jessica', 124, 9.07474885266633e-5],\n  [1944, 'F', 'Ashley', 12, 8.78201501870935e-6],\n  [1945, 'F', 'Linda', 41464, 0.0308041820109342],\n  [1945, 'F', 'Patricia', 35840, 0.0266260342290151],\n  [1945, 'F', 'Betty', 18383, 0.0136569862508924],\n  [1945, 'F', 'Dorothy', 12328, 0.00915864257743577],\n  [1945, 'F', 'Helen', 8300, 0.00616618538227749],\n  [1945, 'F', 'Deborah', 1464, 0.00108762595176557],\n  [1945, 'F', 'Amanda', 280, 0.00020801589241418],\n  [1945, 'F', 'Jessica', 132, 9.80646349952565e-5],\n  [1945, 'F', 'Ashley', 10, 7.42913901479216e-6],\n  [1946, 'F', 'Linda', 52708, 0.0326804234293612],\n  [1946, 'F', 'Patricia', 46295, 0.028704185373421],\n  [1946, 'F', 'Betty', 19714, 0.012223227356121],\n  [1946, 'F', 'Dorothy', 12796, 0.00793387527893499],\n  [1946, 'F', 'Helen', 8852, 0.00548848577439298],\n  [1946, 'F', 'Deborah', 2470, 0.00153146857916297],\n  [1946, 'F', 'Amanda', 274, 0.000169887607567067],\n  [1946, 'F', 'Jessica', 240, 0.000148806663562394],\n  [1946, 'F', 'Ashley', 7, 4.34019435390317e-6],\n  [1947, 'F', 'Linda', 99680, 0.0548360886157353],\n  [1947, 'F', 'Patricia', 51274, 0.0282069182151205],\n  [1947, 'F', 'Betty', 18962, 0.0104313996020423],\n  [1947, 'F', 'Dorothy', 12751, 0.00701459636776927],\n  [1947, 'F', 'Helen', 8978, 0.00493898880008098],\n  [1947, 'F', 'Deborah', 5838, 0.00321160799898338],\n  [1947, 'F', 'Jessica', 430, 0.000236552147921009],\n  [1947, 'F', 'Amanda', 310, 0.000170537595012821],\n  [1947, 'F', 'Ashley', 11, 6.05133401658396e-6],\n  [1948, 'F', 'Linda', 96211, 0.0552115905834257],\n  [1948, 'F', 'Patricia', 46135, 0.0264750052651604],\n  [1948, 'F', 'Betty', 16622, 0.00953869161195395],\n  [1948, 'F', 'Dorothy', 11326, 0.00649953201762667],\n  [1948, 'F', 'Deborah', 11246, 0.00645362326242535],\n  [1948, 'F', 'Helen', 8305, 0.00476590264933688],\n  [1948, 'F', 'Jessica', 482, 0.000276600250087944],\n  [1948, 'F', 'Amanda', 306, 0.000175600988645043],\n  [1948, 'F', 'Ashley', 13, 7.46017272021426e-6],\n  [1949, 'F', 'Linda', 91010, 0.0518428093664536],\n  [1949, 'F', 'Patricia', 46337, 0.0263953440019049],\n  [1949, 'F', 'Deborah', 19208, 0.0109416183090962],\n  [1949, 'F', 'Betty', 14946, 0.00851381857807951],\n  [1949, 'F', 'Dorothy', 10406, 0.00592765931510072],\n  [1949, 'F', 'Helen', 7709, 0.00439134399962632],\n  [1949, 'F', 'Jessica', 406, 0.000231273273297222],\n  [1949, 'F', 'Amanda', 333, 0.000189689655192056],\n  [1949, 'F', 'Ashley', 11, 6.26602464598385e-6],\n  [1950, 'F', 'Linda', 80439, 0.0457319621154536],\n  [1950, 'F', 'Patricia', 47952, 0.0272621371145866],\n  [1950, 'F', 'Deborah', 29073, 0.0165288645381293],\n  [1950, 'F', 'Betty', 13614, 0.00773996360272735],\n  [1950, 'F', 'Dorothy', 9555, 0.00543230147084324],\n  [1950, 'F', 'Helen', 7060, 0.0040138198204242],\n  [1950, 'F', 'Jessica', 402, 0.000228548947281945],\n  [1950, 'F', 'Amanda', 379, 0.000215472763730988],\n  [1950, 'F', 'Ashley', 15, 8.52794579410241e-6],\n  [1951, 'F', 'Linda', 73947, 0.0400434945769865],\n  [1951, 'F', 'Patricia', 56433, 0.0305593807654547],\n  [1951, 'F', 'Deborah', 42045, 0.0227680464317606],\n  [1951, 'F', 'Betty', 12820, 0.00694223701403664],\n  [1951, 'F', 'Dorothy', 9082, 0.00491804965378165],\n  [1951, 'F', 'Helen', 6945, 0.00376082964605963],\n  [1951, 'F', 'Jessica', 466, 0.000252346524847198],\n  [1951, 'F', 'Amanda', 409, 0.000221480104425974],\n  [1951, 'F', 'Ashley', 15, 8.12274221611151e-6],\n  [1952, 'F', 'Linda', 67092, 0.0352717589878795],\n  [1952, 'F', 'Patricia', 53090, 0.0279105956696256],\n  [1952, 'F', 'Deborah', 49809, 0.0261857008797962],\n  [1952, 'F', 'Betty', 12125, 0.00637438260490131],\n  [1952, 'F', 'Dorothy', 8608, 0.00452541735777241],\n  [1952, 'F', 'Helen', 6470, 0.00340142313020301],\n  [1952, 'F', 'Jessica', 452, 0.000237626469065187],\n  [1952, 'F', 'Amanda', 418, 0.000219751911657629],\n  [1952, 'F', 'Ashley', 24, 1.26173346406294e-5],\n  [1953, 'F', 'Linda', 61264, 0.0317575840515387],\n  [1953, 'F', 'Deborah', 52196, 0.0270569805620611],\n  [1953, 'F', 'Patricia', 51007, 0.0264406354419697],\n  [1953, 'F', 'Betty', 11367, 0.00589234228770306],\n  [1953, 'F', 'Dorothy', 8154, 0.00422681085721217],\n  [1953, 'F', 'Helen', 6120, 0.00317244081998265],\n  [1953, 'F', 'Jessica', 495, 0.000256594478086832],\n  [1953, 'F', 'Amanda', 428, 0.000221863508325584],\n  [1953, 'F', 'Ashley', 15, 7.7755902450555e-6],\n  [1954, 'F', 'Linda', 55371, 0.0278157891564086],\n  [1954, 'F', 'Deborah', 54674, 0.0274656491003862],\n  [1954, 'F', 'Patricia', 49133, 0.0246821110079613],\n  [1954, 'F', 'Betty', 10615, 0.00533247732378461],\n  [1954, 'F', 'Dorothy', 7791, 0.00391383239091907],\n  [1954, 'F', 'Helen', 5940, 0.00298397694802455],\n  [1954, 'F', 'Amanda', 428, 0.000215007093224664],\n  [1954, 'F', 'Jessica', 424, 0.000212997681138453],\n  [1954, 'F', 'Ashley', 21, 1.0549413452612e-5],\n  [1955, 'F', 'Deborah', 52314, 0.026099932497594],\n  [1955, 'F', 'Linda', 51279, 0.0255835615426869],\n  [1955, 'F', 'Patricia', 46210, 0.0230545911364801],\n  [1955, 'F', 'Betty', 9928, 0.00495316989402671],\n  [1955, 'F', 'Dorothy', 7241, 0.00361260104780897],\n  [1955, 'F', 'Helen', 5596, 0.00279189552044455],\n  [1955, 'F', 'Amanda', 452, 0.000225506929099524],\n  [1955, 'F', 'Jessica', 386, 0.000192578926177912],\n  [1955, 'F', 'Ashley', 8, 3.9912730814075e-6],\n  [1956, 'F', 'Linda', 48067, 0.0233410866641092],\n  [1956, 'F', 'Deborah', 47829, 0.0232255150947153],\n  [1956, 'F', 'Patricia', 43332, 0.0210417951469653],\n  [1956, 'F', 'Betty', 9213, 0.00447378516313558],\n  [1956, 'F', 'Dorothy', 6862, 0.00333215171924849],\n  [1956, 'F', 'Helen', 5279, 0.00256345510433005],\n  [1956, 'F', 'Amanda', 643, 0.000312237475295363],\n  [1956, 'F', 'Jessica', 406, 0.00019715150073082],\n  [1956, 'F', 'Ashley', 25, 1.21398707346564e-5],\n  [1957, 'F', 'Linda', 44495, 0.021213187408344],\n  [1957, 'F', 'Deborah', 40065, 0.0191011653784763],\n  [1957, 'F', 'Patricia', 39277, 0.0187254829045404],\n  [1957, 'F', 'Betty', 8474, 0.00404001685803589],\n  [1957, 'F', 'Dorothy', 6401, 0.00305170496911585],\n  [1957, 'F', 'Helen', 5015, 0.0023909233588683],\n  [1957, 'F', 'Amanda', 667, 0.000317995190501527],\n  [1957, 'F', 'Jessica', 476, 0.000226935098468856],\n  [1957, 'F', 'Ashley', 27, 1.28723690307964e-5],\n  [1958, 'F', 'Linda', 41898, 0.0202894802981679],\n  [1958, 'F', 'Patricia', 37932, 0.0183689094150104],\n  [1958, 'F', 'Deborah', 32936, 0.015949551842581],\n  [1958, 'F', 'Betty', 7709, 0.00373315202679308],\n  [1958, 'F', 'Dorothy', 5539, 0.00268231016687078],\n  [1958, 'F', 'Helen', 4763, 0.0023065252436912],\n  [1958, 'F', 'Amanda', 796, 0.00038547010161205],\n  [1958, 'F', 'Jessica', 529, 0.000256172969538661],\n  [1958, 'F', 'Ashley', 38, 1.84018390216808e-5],\n  [1959, 'F', 'Linda', 40409, 0.0194416392387311],\n  [1959, 'F', 'Patricia', 35221, 0.0169455808267303],\n  [1959, 'F', 'Deborah', 29552, 0.0142181029667396],\n  [1959, 'F', 'Betty', 7317, 0.00352036611422691],\n  [1959, 'F', 'Dorothy', 5238, 0.00252011448767535],\n  [1959, 'F', 'Helen', 4378, 0.00210634998607153],\n  [1959, 'F', 'Amanda', 858, 0.000412802258576833],\n  [1959, 'F', 'Jessica', 523, 0.000251626551556741],\n  [1959, 'F', 'Ashley', 37, 1.78014959992341e-5],\n  [1960, 'F', 'Linda', 37314, 0.0179400268278259],\n  [1960, 'F', 'Patricia', 32107, 0.0154365771925017],\n  [1960, 'F', 'Deborah', 25269, 0.012148966551759],\n  [1960, 'F', 'Betty', 6503, 0.00312654752804181],\n  [1960, 'F', 'Dorothy', 5077, 0.00244094753188809],\n  [1960, 'F', 'Helen', 4069, 0.00195631583755223],\n  [1960, 'F', 'Amanda', 977, 0.000469727346593395],\n  [1960, 'F', 'Jessica', 560, 0.000269239830186593],\n  [1960, 'F', 'Ashley', 57, 2.74047684297068e-5],\n  [1961, 'F', 'Linda', 35574, 0.0171339811436622],\n  [1961, 'F', 'Patricia', 28867, 0.0139035990800612],\n  [1961, 'F', 'Deborah', 24092, 0.0116037520018302],\n  [1961, 'F', 'Betty', 5580, 0.00268756998880179],\n  [1961, 'F', 'Dorothy', 4726, 0.00227624655323965],\n  [1961, 'F', 'Helen', 3855, 0.00185673518043565],\n  [1961, 'F', 'Amanda', 1057, 0.0005090970390974],\n  [1961, 'F', 'Jessica', 669, 0.000322219412635914],\n  [1961, 'F', 'Ashley', 80, 3.85314693735024e-5],\n  [1962, 'F', 'Linda', 31462, 0.015521322454956],\n  [1962, 'F', 'Patricia', 26538, 0.0130921383036559],\n  [1962, 'F', 'Deborah', 22893, 0.0112939302956363],\n  [1962, 'F', 'Betty', 4765, 0.00235074380197906],\n  [1962, 'F', 'Dorothy', 4075, 0.00201034228605765],\n  [1962, 'F', 'Helen', 3587, 0.00176959454726105],\n  [1962, 'F', 'Amanda', 948, 0.000467682082744208],\n  [1962, 'F', 'Jessica', 867, 0.000427721904788216],\n  [1962, 'F', 'Ashley', 95, 4.6866875380485e-5],\n  [1963, 'F', 'Linda', 27715, 0.0139419183153997],\n  [1963, 'F', 'Patricia', 25363, 0.0127587542570263],\n  [1963, 'F', 'Deborah', 21062, 0.0105951536553833],\n  [1963, 'F', 'Betty', 4154, 0.00208965284799461],\n  [1963, 'F', 'Dorothy', 3791, 0.00190704717061809],\n  [1963, 'F', 'Helen', 3340, 0.00168017345024121],\n  [1963, 'F', 'Jessica', 1121, 0.000563914502311496],\n  [1963, 'F', 'Amanda', 1035, 0.000520652551197501],\n  [1963, 'F', 'Ashley', 108, 5.4328961864087e-5],\n  [1964, 'F', 'Patricia', 26087, 0.013328857510441],\n  [1964, 'F', 'Linda', 23633, 0.0120750139741731],\n  [1964, 'F', 'Deborah', 19306, 0.00986418227839823],\n  [1964, 'F', 'Betty', 4067, 0.00207798763732755],\n  [1964, 'F', 'Dorothy', 3535, 0.00180616825619692],\n  [1964, 'F', 'Helen', 3095, 0.00158135523420918],\n  [1964, 'F', 'Amanda', 1275, 0.000651446825078097],\n  [1964, 'F', 'Jessica', 1172, 0.000598820140385513],\n  [1964, 'F', 'Ashley', 180, 9.19689635404372e-5],\n  [1965, 'F', 'Patricia', 23551, 0.0128881183708359],\n  [1965, 'F', 'Linda', 19339, 0.0105831311270687],\n  [1965, 'F', 'Deborah', 17083, 0.00934855106488003],\n  [1965, 'F', 'Betty', 3565, 0.00195092106458452],\n  [1965, 'F', 'Dorothy', 2960, 0.00161983908868728],\n  [1965, 'F', 'Helen', 2804, 0.00153446919076998],\n  [1965, 'F', 'Amanda', 1650, 0.000902950843356088],\n  [1965, 'F', 'Jessica', 1529, 0.000836734448176641],\n  [1965, 'F', 'Ashley', 218, 0.000119298959910077],\n  [1966, 'F', 'Patricia', 20115, 0.0114579150183275],\n  [1966, 'F', 'Deborah', 16250, 0.00925633204314305],\n  [1966, 'F', 'Linda', 15560, 0.00886329394408036],\n  [1966, 'F', 'Betty', 2948, 0.00167924103773451],\n  [1966, 'F', 'Dorothy', 2667, 0.00151917769594231],\n  [1966, 'F', 'Helen', 2449, 0.00139500044145584],\n  [1966, 'F', 'Amanda', 2329, 0.00132664598944493],\n  [1966, 'F', 'Jessica', 1665, 0.000948418021651273],\n  [1966, 'F', 'Ashley', 263, 0.000149810173990561],\n  [1967, 'F', 'Patricia', 17746, 0.0103375520052381],\n  [1967, 'F', 'Deborah', 14007, 0.00815947768158289],\n  [1967, 'F', 'Linda', 13199, 0.00768879459693101],\n  [1967, 'F', 'Amanda', 2663, 0.00155127358221284],\n  [1967, 'F', 'Betty', 2543, 0.00148137015379919],\n  [1967, 'F', 'Dorothy', 2316, 0.00134913616838338],\n  [1967, 'F', 'Helen', 2153, 0.00125418401145484],\n  [1967, 'F', 'Jessica', 1761, 0.00102583281197026],\n  [1967, 'F', 'Ashley', 386, 0.000224856028063896],\n  [1968, 'F', 'Patricia', 15806, 0.00924608652923696],\n  [1968, 'F', 'Deborah', 12286, 0.0071869808362777],\n  [1968, 'F', 'Linda', 11368, 0.00664997543112525],\n  [1968, 'F', 'Amanda', 2430, 0.00142148489599176],\n  [1968, 'F', 'Betty', 2134, 0.00124833282635655],\n  [1968, 'F', 'Dorothy', 2084, 0.0012190841659452],\n  [1968, 'F', 'Helen', 1881, 0.00110033460467511],\n  [1968, 'F', 'Jessica', 1841, 0.00107693567634602],\n  [1968, 'F', 'Ashley', 544, 0.000318225425275522],\n  [1969, 'F', 'Patricia', 14957, 0.00848518199146773],\n  [1969, 'F', 'Deborah', 11186, 0.00634587455750204],\n  [1969, 'F', 'Linda', 10248, 0.00581374239811201],\n  [1969, 'F', 'Amanda', 2817, 0.00159809839339203],\n  [1969, 'F', 'Jessica', 2492, 0.00141372424434964],\n  [1969, 'F', 'Betty', 2133, 0.00121006172279205],\n  [1969, 'F', 'Helen', 1857, 0.00105348552237451],\n  [1969, 'F', 'Dorothy', 1778, 0.00100866842153036],\n  [1969, 'F', 'Ashley', 643, 0.000364777162566942],\n  [1970, 'F', 'Patricia', 13404, 0.00731676961673752],\n  [1970, 'F', 'Deborah', 9853, 0.00537840428481907],\n  [1970, 'F', 'Linda', 8734, 0.00476758175414693],\n  [1970, 'F', 'Jessica', 4023, 0.00219601344137086],\n  [1970, 'F', 'Amanda', 3550, 0.00193781946727978],\n  [1970, 'F', 'Betty', 1967, 0.0010737157442646],\n  [1970, 'F', 'Dorothy', 1802, 0.000983648078883991],\n  [1970, 'F', 'Helen', 1715, 0.000936157855319669],\n  [1970, 'F', 'Ashley', 932, 0.000508745843240776],\n  [1971, 'F', 'Patricia', 11466, 0.006543190995437],\n  [1971, 'F', 'Deborah', 8675, 0.00495047809919902],\n  [1971, 'F', 'Linda', 7379, 0.00421090235089217],\n  [1971, 'F', 'Jessica', 5360, 0.00305873920596043],\n  [1971, 'F', 'Amanda', 4133, 0.00235853901832733],\n  [1971, 'F', 'Betty', 1763, 0.00100607410822915],\n  [1971, 'F', 'Dorothy', 1626, 0.000927893647181281],\n  [1971, 'F', 'Helen', 1441, 0.000822321491751676],\n  [1971, 'F', 'Ashley', 1164, 0.000664248588757079],\n  [1972, 'F', 'Patricia', 9602, 0.00595464005496972],\n  [1972, 'F', 'Deborah', 6279, 0.00389389553271765],\n  [1972, 'F', 'Jessica', 6208, 0.00384986518030119],\n  [1972, 'F', 'Linda', 5746, 0.00356335781668986],\n  [1972, 'F', 'Amanda', 4181, 0.00259282962610169],\n  [1972, 'F', 'Betty', 1366, 0.000847119174660346],\n  [1972, 'F', 'Dorothy', 1277, 0.0007919261976876],\n  [1972, 'F', 'Helen', 1245, 0.000772081531809759],\n  [1972, 'F', 'Ashley', 1176, 0.000729291471010664],\n  [1973, 'F', 'Patricia', 8477, 0.00545491634229101],\n  [1973, 'F', 'Jessica', 7226, 0.00464990273556622],\n  [1973, 'F', 'Amanda', 5627, 0.00362095249004029],\n  [1973, 'F', 'Deborah', 4984, 0.00320718450512899],\n  [1973, 'F', 'Linda', 4735, 0.00304695397909024],\n  [1973, 'F', 'Betty', 1323, 0.000851345325097441],\n  [1973, 'F', 'Ashley', 1253, 0.00080630059890181],\n  [1973, 'F', 'Dorothy', 1175, 0.000756107903998106],\n  [1973, 'F', 'Helen', 1133, 0.000729081068280726],\n  [1974, 'F', 'Jessica', 10653, 0.00680199571179919],\n  [1974, 'F', 'Patricia', 8040, 0.00513358166928241],\n  [1974, 'F', 'Amanda', 7476, 0.00477346474621335],\n  [1974, 'F', 'Deborah', 4345, 0.00277430501903384],\n  [1974, 'F', 'Linda', 4085, 0.00260829367151973],\n  [1974, 'F', 'Ashley', 1626, 0.00103820942714592],\n  [1974, 'F', 'Helen', 1140, 0.000727895908331088],\n  [1974, 'F', 'Betty', 1130, 0.000721510856503622],\n  [1974, 'F', 'Dorothy', 1100, 0.000702355701021225],\n  [1975, 'F', 'Jessica', 12930, 0.00828471748344498],\n  [1975, 'F', 'Amanda', 12653, 0.00810723358994813],\n  [1975, 'F', 'Patricia', 7056, 0.00452103376358761],\n  [1975, 'F', 'Linda', 3525, 0.00225859467356099],\n  [1975, 'F', 'Deborah', 3415, 0.00218811370502433],\n  [1975, 'F', 'Ashley', 1988, 0.00127378332228064],\n  [1975, 'F', 'Helen', 1057, 0.000677258034029493],\n  [1975, 'F', 'Betty', 1021, 0.000654191535235679],\n  [1975, 'F', 'Dorothy', 975, 0.000624717675665805],\n  [1976, 'F', 'Jessica', 18370, 0.0116864866171597],\n  [1976, 'F', 'Amanda', 15591, 0.00991856357366017],\n  [1976, 'F', 'Patricia', 6017, 0.00382784920933316],\n  [1976, 'F', 'Linda', 3141, 0.00199821744499176],\n  [1976, 'F', 'Deborah', 2994, 0.00190470010515929],\n  [1976, 'F', 'Ashley', 2292, 0.00145810709453076],\n  [1976, 'F', 'Dorothy', 983, 0.000625357449355907],\n  [1976, 'F', 'Helen', 942, 0.000599274381783586],\n  [1976, 'F', 'Betty', 908, 0.000577644520869953],\n  [1977, 'F', 'Jessica', 24843, 0.0151032385968816],\n  [1977, 'F', 'Amanda', 18280, 0.01111327945703],\n  [1977, 'F', 'Patricia', 5907, 0.00359114561010263],\n  [1977, 'F', 'Linda', 2909, 0.0017685191433534],\n  [1977, 'F', 'Ashley', 2706, 0.00164510581021461],\n  [1977, 'F', 'Deborah', 2677, 0.00162747533405193],\n  [1977, 'F', 'Helen', 992, 0.00060308387425458],\n  [1977, 'F', 'Dorothy', 934, 0.000567822921929212],\n  [1977, 'F', 'Betty', 807, 0.000490613595285732],\n  [1978, 'F', 'Jessica', 26105, 0.0158812818667457],\n  [1978, 'F', 'Amanda', 20522, 0.0124847985623197],\n  [1978, 'F', 'Patricia', 5498, 0.00334477256094111],\n  [1978, 'F', 'Ashley', 3484, 0.00211953212119295],\n  [1978, 'F', 'Linda', 2936, 0.00178614991613734],\n  [1978, 'F', 'Deborah', 2479, 0.00150812862469498],\n  [1978, 'F', 'Helen', 922, 0.000560909476389179],\n  [1978, 'F', 'Dorothy', 913, 0.00055543422119666],\n  [1978, 'F', 'Betty', 715, 0.000434978606961239],\n  [1979, 'F', 'Amanda', 31927, 0.018529201469011],\n  [1979, 'F', 'Jessica', 27777, 0.0161207012624023],\n  [1979, 'F', 'Patricia', 5651, 0.0032796228114568],\n  [1979, 'F', 'Ashley', 4450, 0.0025826086552792],\n  [1979, 'F', 'Linda', 2739, 0.00158961013636174],\n  [1979, 'F', 'Deborah', 2181, 0.00126576842183459],\n  [1979, 'F', 'Dorothy', 889, 0.000515941369560272],\n  [1979, 'F', 'Helen', 879, 0.000510137754604588],\n  [1979, 'F', 'Betty', 711, 0.000412637023349104],\n  [1980, 'F', 'Amanda', 35819, 0.0201204564808553],\n  [1980, 'F', 'Jessica', 33921, 0.0190543009097711],\n  [1980, 'F', 'Ashley', 7296, 0.00409835144711801],\n  [1980, 'F', 'Patricia', 5309, 0.00298220227970799],\n  [1980, 'F', 'Linda', 2805, 0.00157564087296683],\n  [1980, 'F', 'Deborah', 1938, 0.00108862460314072],\n  [1980, 'F', 'Helen', 909, 0.000510608753485509],\n  [1980, 'F', 'Dorothy', 895, 0.00050274459226571],\n  [1980, 'F', 'Betty', 658, 0.000369615577330544],\n  [1981, 'F', 'Jessica', 42527, 0.0237842499463097],\n  [1981, 'F', 'Amanda', 34373, 0.0192239288782304],\n  [1981, 'F', 'Ashley', 8877, 0.00496467624740497],\n  [1981, 'F', 'Patricia', 5285, 0.0029557636552366],\n  [1981, 'F', 'Linda', 2730, 0.00152681831197652],\n  [1981, 'F', 'Deborah', 1905, 0.00106541717374186],\n  [1981, 'F', 'Helen', 896, 0.000501109599828191],\n  [1981, 'F', 'Dorothy', 787, 0.00044014872217052],\n  [1981, 'F', 'Betty', 662, 0.000370239458801632],\n  [1982, 'F', 'Jessica', 45445, 0.0250562932675237],\n  [1982, 'F', 'Amanda', 34210, 0.0188618284229725],\n  [1982, 'F', 'Ashley', 14851, 0.00818816176292209],\n  [1982, 'F', 'Patricia', 5167, 0.00284884733883364],\n  [1982, 'F', 'Linda', 2787, 0.00153662425649881],\n  [1982, 'F', 'Deborah', 1842, 0.00101559450321881],\n  [1982, 'F', 'Helen', 875, 0.000482434956740747],\n  [1982, 'F', 'Dorothy', 828, 0.000456521307635815],\n  [1982, 'F', 'Betty', 635, 0.000350109940034713],\n  [1983, 'F', 'Jessica', 45278, 0.0253076258799791],\n  [1983, 'F', 'Amanda', 33754, 0.0188664164484477],\n  [1983, 'F', 'Ashley', 33290, 0.0186070688975773],\n  [1983, 'F', 'Patricia', 4922, 0.00275109621850031],\n  [1983, 'F', 'Linda', 2473, 0.0013822553734968],\n  [1983, 'F', 'Deborah', 1605, 0.000897096592989232],\n  [1983, 'F', 'Helen', 844, 0.000471744252014275],\n  [1983, 'F', 'Dorothy', 759, 0.000424234463600515],\n  [1983, 'F', 'Betty', 563, 0.000314682480905257],\n  [1984, 'F', 'Jessica', 45851, 0.025436304942746],\n  [1984, 'F', 'Ashley', 38759, 0.0215019463757801],\n  [1984, 'F', 'Amanda', 33906, 0.0188096956530664],\n  [1984, 'F', 'Patricia', 4475, 0.00248255140823075],\n  [1984, 'F', 'Linda', 2334, 0.00129481005291857],\n  [1984, 'F', 'Deborah', 1468, 0.000814387813917932],\n  [1984, 'F', 'Helen', 859, 0.00047653891836206],\n  [1984, 'F', 'Dorothy', 682, 0.000378346382215279],\n  [1984, 'F', 'Betty', 503, 0.000279044325886049],\n  [1985, 'F', 'Jessica', 48343, 0.0261934794528861],\n  [1985, 'F', 'Ashley', 47007, 0.0254696003276962],\n  [1985, 'F', 'Amanda', 39050, 0.0211582932924147],\n  [1985, 'F', 'Patricia', 4398, 0.00238294939564762],\n  [1985, 'F', 'Linda', 2113, 0.00114487768826817],\n  [1985, 'F', 'Deborah', 1401, 0.000759097795202892],\n  [1985, 'F', 'Helen', 809, 0.000438336985238501],\n  [1985, 'F', 'Dorothy', 719, 0.000389572672912833],\n  [1985, 'F', 'Betty', 502, 0.000271996497638724],\n  [1986, 'F', 'Jessica', 52667, 0.0285499155975875],\n  [1986, 'F', 'Ashley', 49674, 0.0269274594602799],\n  [1986, 'F', 'Amanda', 40522, 0.0219663105900363],\n  [1986, 'F', 'Patricia', 4246, 0.00230168685566591],\n  [1986, 'F', 'Linda', 1951, 0.00105760505308624],\n  [1986, 'F', 'Deborah', 1284, 0.000696035309155683],\n  [1986, 'F', 'Helen', 766, 0.000415236017767331],\n  [1986, 'F', 'Dorothy', 629, 0.000340970568114427],\n  [1986, 'F', 'Betty', 407, 0.000220628014662277],\n  [1987, 'F', 'Jessica', 55990, 0.0298840611579793],\n  [1987, 'F', 'Ashley', 54845, 0.029272929705472],\n  [1987, 'F', 'Amanda', 41786, 0.0223028287113293],\n  [1987, 'F', 'Patricia', 3913, 0.00208852172372161],\n  [1987, 'F', 'Linda', 1929, 0.00102958303221543],\n  [1987, 'F', 'Deborah', 1203, 0.000642088329577588],\n  [1987, 'F', 'Helen', 815, 0.000434997496762871],\n  [1987, 'F', 'Dorothy', 614, 0.000327715905536691],\n  [1987, 'F', 'Betty', 435, 0.000232176578026809],\n  [1988, 'F', 'Jessica', 51532, 0.0268079862120844],\n  [1988, 'F', 'Ashley', 49963, 0.025991760752821],\n  [1988, 'F', 'Amanda', 39451, 0.0205232062418098],\n  [1988, 'F', 'Patricia', 3798, 0.00197579623599892],\n  [1988, 'F', 'Linda', 1844, 0.000959286008210115],\n  [1988, 'F', 'Deborah', 1056, 0.000549352507955467],\n  [1988, 'F', 'Helen', 775, 0.000403170637940802],\n  [1988, 'F', 'Dorothy', 608, 0.000316293868216784],\n  [1988, 'F', 'Betty', 395, 0.000205486970305312],\n  [1989, 'F', 'Jessica', 47885, 0.0240412252916602],\n  [1989, 'F', 'Ashley', 47585, 0.0238906067767286],\n  [1989, 'F', 'Amanda', 36827, 0.0184894268312827],\n  [1989, 'F', 'Patricia', 3606, 0.00181043454947743],\n  [1989, 'F', 'Linda', 1844, 0.000925801805112695],\n  [1989, 'F', 'Deborah', 1076, 0.000540218406887885],\n  [1989, 'F', 'Helen', 857, 0.000430266890987842],\n  [1989, 'F', 'Dorothy', 620, 0.000311278264191904],\n  [1989, 'F', 'Betty', 399, 0.000200322624858983],\n  [1990, 'F', 'Jessica', 46470, 0.0226274308541356],\n  [1990, 'F', 'Ashley', 45553, 0.0221809201140185],\n  [1990, 'F', 'Amanda', 34405, 0.0167526739517223],\n  [1990, 'F', 'Patricia', 3578, 0.00174221965991171],\n  [1990, 'F', 'Linda', 1658, 0.000807322581367696],\n  [1990, 'F', 'Deborah', 1094, 0.000532696564545392],\n  [1990, 'F', 'Helen', 861, 0.000419242908659582],\n  [1990, 'F', 'Dorothy', 596, 0.000290207634798038],\n  [1990, 'F', 'Betty', 406, 0.00019769177806712],\n  [1991, 'F', 'Ashley', 43482, 0.0213883278618854],\n  [1991, 'F', 'Jessica', 43394, 0.0213450416089107],\n  [1991, 'F', 'Amanda', 28887, 0.0142092044281837],\n  [1991, 'F', 'Patricia', 3418, 0.00168127741667642],\n  [1991, 'F', 'Linda', 1608, 0.000790957895264976],\n  [1991, 'F', 'Deborah', 1014, 0.00049877568768575],\n  [1991, 'F', 'Helen', 773, 0.000380230381243673],\n  [1991, 'F', 'Dorothy', 498, 0.000244960840697735],\n  [1991, 'F', 'Betty', 345, 0.000169701787230359],\n  [1992, 'F', 'Ashley', 38452, 0.0191860354880783],\n  [1992, 'F', 'Jessica', 38352, 0.0191361394215848],\n  [1992, 'F', 'Amanda', 25034, 0.0124909812859813],\n  [1992, 'F', 'Patricia', 2951, 0.00147243292222301],\n  [1992, 'F', 'Linda', 1580, 0.000788357850597206],\n  [1992, 'F', 'Deborah', 919, 0.00045854485107521],\n  [1992, 'F', 'Helen', 827, 0.000412640469901196],\n  [1992, 'F', 'Dorothy', 508, 0.00025347201778695],\n  [1992, 'F', 'Betty', 296, 0.000147692356820742],\n  [1993, 'F', 'Jessica', 34987, 0.0177506267031079],\n  [1993, 'F', 'Ashley', 34847, 0.0176795978141367],\n  [1993, 'F', 'Amanda', 20809, 0.0105574296471538],\n  [1993, 'F', 'Patricia', 2660, 0.00134954889045265],\n  [1993, 'F', 'Linda', 1487, 0.000754428270715449],\n  [1993, 'F', 'Helen', 868, 0.000440379111621392],\n  [1993, 'F', 'Deborah', 797, 0.000404357317928858],\n  [1993, 'F', 'Dorothy', 476, 0.000241498222502053],\n  [1993, 'F', 'Betty', 292, 0.000148145968425629],\n  [1994, 'F', 'Jessica', 32117, 0.0164797639663909],\n  [1994, 'F', 'Ashley', 30278, 0.0155361426463986],\n  [1994, 'F', 'Amanda', 18715, 0.00960297607594125],\n  [1994, 'F', 'Patricia', 2363, 0.00121249438778783],\n  [1994, 'F', 'Linda', 1281, 0.000657302289782567],\n  [1994, 'F', 'Helen', 848, 0.000435122827272144],\n  [1994, 'F', 'Deborah', 740, 0.000379706240779937],\n  [1994, 'F', 'Dorothy', 442, 0.000226797511384773],\n  [1994, 'F', 'Betty', 275, 0.00014110704893849],\n  [1995, 'F', 'Jessica', 27935, 0.0145416403136851],\n  [1995, 'F', 'Ashley', 26603, 0.0138482640868074],\n  [1995, 'F', 'Amanda', 16345, 0.00850843425549248],\n  [1995, 'F', 'Patricia', 2160, 0.0011243938814233],\n  [1995, 'F', 'Linda', 1233, 0.000641841507312464],\n  [1995, 'F', 'Helen', 837, 0.000435702629051527],\n  [1995, 'F', 'Deborah', 660, 0.000343564797101562],\n  [1995, 'F', 'Dorothy', 376, 0.000195727823803314],\n  [1995, 'F', 'Betty', 234, 0.00012180933715419],\n  [1996, 'F', 'Jessica', 24192, 0.012621838409999],\n  [1996, 'F', 'Ashley', 23676, 0.0123526226105793],\n  [1996, 'F', 'Amanda', 13973, 0.00729021776219062],\n  [1996, 'F', 'Patricia', 1970, 0.00102782000941212],\n  [1996, 'F', 'Linda', 987, 0.000514953476796833],\n  [1996, 'F', 'Helen', 900, 0.000469562440848176],\n  [1996, 'F', 'Deborah', 633, 0.000330258916729884],\n  [1996, 'F', 'Dorothy', 350, 0.000182607615885402],\n  [1996, 'F', 'Betty', 217, 0.000113216721848949],\n  [1997, 'F', 'Jessica', 21043, 0.0110255841966801],\n  [1997, 'F', 'Ashley', 20895, 0.0109480388627872],\n  [1997, 'F', 'Amanda', 12239, 0.00641268473996901],\n  [1997, 'F', 'Patricia', 1781, 0.000933163781508686],\n  [1997, 'F', 'Linda', 1095, 0.00057373067981584],\n  [1997, 'F', 'Helen', 812, 0.000425451426493573],\n  [1997, 'F', 'Deborah', 638, 0.000334283263673522],\n  [1997, 'F', 'Dorothy', 315, 0.000165045812001817],\n  [1997, 'F', 'Betty', 189, 9.90274872010902e-5],\n  [1998, 'F', 'Ashley', 19871, 0.0102549361330773],\n  [1998, 'F', 'Jessica', 18233, 0.00940960447458096],\n  [1998, 'F', 'Amanda', 10908, 0.00562935148405249],\n  [1998, 'F', 'Patricia', 1704, 0.000879392641073107],\n  [1998, 'F', 'Linda', 970, 0.000500593228779879],\n  [1998, 'F', 'Helen', 832, 0.000429374810664803],\n  [1998, 'F', 'Deborah', 553, 0.00028538974795389],\n  [1998, 'F', 'Dorothy', 312, 0.000161015553999301],\n  [1998, 'F', 'Betty', 194, 0.000100118645755976],\n  [1999, 'F', 'Ashley', 18132, 0.00931837897619116],\n  [1999, 'F', 'Jessica', 16346, 0.0084005196748743],\n  [1999, 'F', 'Amanda', 9741, 0.00500608480074333],\n  [1999, 'F', 'Patricia', 1532, 0.000787323879964971],\n  [1999, 'F', 'Linda', 898, 0.000461499245566935],\n  [1999, 'F', 'Helen', 841, 0.000432205863610014],\n  [1999, 'F', 'Deborah', 524, 0.000269293546410995],\n  [1999, 'F', 'Dorothy', 335, 0.000172162858869625],\n  [1999, 'F', 'Betty', 182, 9.35332546694679e-5],\n  [2000, 'F', 'Ashley', 17997, 0.00902349055709788],\n  [2000, 'F', 'Jessica', 15705, 0.00787430789571719],\n  [2000, 'F', 'Amanda', 8550, 0.00428687249337039],\n  [2000, 'F', 'Patricia', 1392, 0.000697932925236442],\n  [2000, 'F', 'Helen', 890, 0.000446235850187093],\n  [2000, 'F', 'Linda', 849, 0.000425678917762744],\n  [2000, 'F', 'Deborah', 545, 0.00027325678466513],\n  [2000, 'F', 'Dorothy', 312, 0.000156433241863341],\n  [2000, 'F', 'Betty', 174, 8.72416156545553e-5],\n  [2001, 'F', 'Ashley', 16524, 0.00834726311913036],\n  [2001, 'F', 'Jessica', 13917, 0.00703031111286233],\n  [2001, 'F', 'Amanda', 6963, 0.00351742877623485],\n  [2001, 'F', 'Patricia', 1223, 0.000617810626645874],\n  [2001, 'F', 'Helen', 884, 0.000446561401434957],\n  [2001, 'F', 'Linda', 837, 0.000422818883485361],\n  [2001, 'F', 'Deborah', 489, 0.000247023218667075],\n  [2001, 'F', 'Dorothy', 317, 0.00016013570617068],\n  [2001, 'F', 'Betty', 153, 7.72894733252811e-5],\n  [2002, 'F', 'Ashley', 15339, 0.00777226488632702],\n  [2002, 'F', 'Jessica', 11913, 0.00603631211883524],\n  [2002, 'F', 'Amanda', 6132, 0.00310708183603607],\n  [2002, 'F', 'Patricia', 1113, 0.000563956634622985],\n  [2002, 'F', 'Helen', 875, 0.000443362134137567],\n  [2002, 'F', 'Linda', 769, 0.000389651978459187],\n  [2002, 'F', 'Deborah', 474, 0.000240175601807093],\n  [2002, 'F', 'Dorothy', 263, 0.000133261990032206],\n  [2002, 'F', 'Betty', 127, 6.43508468976811e-5],\n  [2003, 'F', 'Ashley', 14512, 0.00723815072032368],\n  [2003, 'F', 'Jessica', 10445, 0.00520965299571257],\n  [2003, 'F', 'Amanda', 5339, 0.00266293320671225],\n  [2003, 'F', 'Patricia', 1011, 0.000504256503462462],\n  [2003, 'F', 'Helen', 783, 0.000390536935916031],\n  [2003, 'F', 'Linda', 739, 0.000368591054459702],\n  [2003, 'F', 'Deborah', 421, 0.000209982183934418],\n  [2003, 'F', 'Dorothy', 291, 0.000145142079631628],\n  [2003, 'F', 'Betty', 142, 7.08253446999699e-5],\n  [2004, 'F', 'Ashley', 14370, 0.00712775344818093],\n  [2004, 'F', 'Jessica', 9469, 0.00469677782886745],\n  [2004, 'F', 'Amanda', 4677, 0.00231986798031609],\n  [2004, 'F', 'Patricia', 997, 0.000494528196787501],\n  [2004, 'F', 'Helen', 860, 0.000426573971150703],\n  [2004, 'F', 'Linda', 727, 0.000360603810496001],\n  [2004, 'F', 'Deborah', 427, 0.000211798936838779],\n  [2004, 'F', 'Dorothy', 288, 0.000142852678710933],\n  [2004, 'F', 'Betty', 136, 6.7458209391274e-5],\n  [2005, 'F', 'Ashley', 13270, 0.00654498034039816],\n  [2005, 'F', 'Jessica', 8108, 0.00399899778447237],\n  [2005, 'F', 'Amanda', 4088, 0.00201626824653713],\n  [2005, 'F', 'Helen', 960, 0.000473487650850206],\n  [2005, 'F', 'Patricia', 877, 0.000432550697703782],\n  [2005, 'F', 'Linda', 745, 0.000367446145711879],\n  [2005, 'F', 'Deborah', 425, 0.00020961692876181],\n  [2005, 'F', 'Dorothy', 234, 0.000115412614894738],\n  [2005, 'F', 'Betty', 132, 6.51045519919034e-5],\n  [2006, 'F', 'Ashley', 12340, 0.00590922303294464],\n  [2006, 'F', 'Jessica', 6809, 0.00326060774970179],\n  [2006, 'F', 'Amanda', 3355, 0.00160659994129086],\n  [2006, 'F', 'Helen', 948, 0.000453966242725406],\n  [2006, 'F', 'Patricia', 775, 0.000371122192101466],\n  [2006, 'F', 'Linda', 698, 0.000334249406563643],\n  [2006, 'F', 'Deborah', 423, 0.000202560886785704],\n  [2006, 'F', 'Dorothy', 265, 0.000126899846331469],\n  [2006, 'F', 'Betty', 135, 6.46470915273522e-5],\n  [2007, 'F', 'Ashley', 11423, 0.00540374075290008],\n  [2007, 'F', 'Jessica', 5704, 0.00269832244196289],\n  [2007, 'F', 'Amanda', 3038, 0.00143714999626284],\n  [2007, 'F', 'Helen', 931, 0.000440416934338613],\n  [2007, 'F', 'Patricia', 725, 0.000342967000424806],\n  [2007, 'F', 'Linda', 659, 0.000311745176937858],\n  [2007, 'F', 'Deborah', 371, 0.000175504492631177],\n  [2007, 'F', 'Dorothy', 262, 0.000123941178084551],\n  [2007, 'F', 'Betty', 134, 6.33897628371366e-5],\n  [2008, 'F', 'Ashley', 9402, 0.00452030531532519],\n  [2008, 'F', 'Jessica', 4732, 0.00227505687642191],\n  [2008, 'F', 'Amanda', 2439, 0.00117262546948289],\n  [2008, 'F', 'Helen', 884, 0.000425010625265632],\n  [2008, 'F', 'Patricia', 629, 0.000302411406439007],\n  [2008, 'F', 'Linda', 611, 0.000293757343933598],\n  [2008, 'F', 'Deborah', 355, 0.000170677343856673],\n  [2008, 'F', 'Dorothy', 242, 0.000116349062572718],\n  [2008, 'F', 'Betty', 137, 6.58670312911669e-5],\n  [2009, 'F', 'Ashley', 7811, 0.00386339097012116],\n  [2009, 'F', 'Jessica', 3793, 0.00187605197153624],\n  [2009, 'F', 'Amanda', 1952, 0.000965476785773462],\n  [2009, 'F', 'Helen', 826, 0.000408547041520942],\n  [2009, 'F', 'Patricia', 564, 0.000278959481135365],\n  [2009, 'F', 'Linda', 550, 0.000272034955007891],\n  [2009, 'F', 'Deborah', 346, 0.000171134717150419],\n  [2009, 'F', 'Dorothy', 226, 0.000111781636057788],\n  [2009, 'F', 'Betty', 148, 7.32021333475781e-5],\n  [2010, 'F', 'Ashley', 6306, 0.00322252105804575],\n  [2010, 'F', 'Jessica', 3195, 0.00163272356175962],\n  [2010, 'F', 'Amanda', 1655, 0.000845745694745594],\n  [2010, 'F', 'Helen', 703, 0.000359250286046014],\n  [2010, 'F', 'Patricia', 479, 0.000244780778116701],\n  [2010, 'F', 'Linda', 476, 0.00024324770434979],\n  [2010, 'F', 'Deborah', 354, 0.000180902704495432],\n  [2010, 'F', 'Dorothy', 240, 0.000122645901352835],\n  [2010, 'F', 'Betty', 132, 6.74552457440595e-5],\n  [2011, 'F', 'Ashley', 5398, 0.00279205644940212],\n  [2011, 'F', 'Jessica', 2620, 0.00135516633890952],\n  [2011, 'F', 'Amanda', 1409, 0.000728789836459354],\n  [2011, 'F', 'Helen', 729, 0.000377067275215663],\n  [2011, 'F', 'Linda', 488, 0.000252412661598414],\n  [2011, 'F', 'Patricia', 427, 0.000220861078898612],\n  [2011, 'F', 'Deborah', 332, 0.000171723368136626],\n  [2011, 'F', 'Dorothy', 276, 0.000142757980740086],\n  [2011, 'F', 'Betty', 167, 8.63789231289653e-5],\n  [2012, 'F', 'Ashley', 4696, 0.00242806420306393],\n  [2012, 'F', 'Jessica', 2327, 0.00120317406314518],\n  [2012, 'F', 'Amanda', 1228, 0.00063493672090343],\n  [2012, 'F', 'Helen', 772, 0.000399162173076098],\n  [2012, 'F', 'Linda', 448, 0.000231638152251414],\n  [2012, 'F', 'Patricia', 394, 0.000203717482113967],\n  [2012, 'F', 'Deborah', 336, 0.000173728614188561],\n  [2012, 'F', 'Dorothy', 277, 0.000143222696816165],\n  [2012, 'F', 'Betty', 140, 7.2386922578567e-5],\n  [2013, 'F', 'Ashley', 3936, 0.00204898297876106],\n  [2013, 'F', 'Jessica', 1946, 0.00101303884061713],\n  [2013, 'F', 'Amanda', 1064, 0.000553891740193539],\n  [2013, 'F', 'Helen', 738, 0.000384184308517699],\n  [2013, 'F', 'Linda', 441, 0.000229573550211796],\n  [2013, 'F', 'Patricia', 419, 0.000218120901448396],\n  [2013, 'F', 'Dorothy', 334, 0.000173872031226167],\n  [2013, 'F', 'Deborah', 329, 0.000171269156507213],\n  [2013, 'F', 'Betty', 174, 9.05800402196202e-5],\n  [2014, 'F', 'Ashley', 3547, 0.00182125980653672],\n  [2014, 'F', 'Jessica', 1790, 0.000919102073217006],\n  [2014, 'F', 'Amanda', 1048, 0.000538111157950515],\n  [2014, 'F', 'Helen', 801, 0.000411285341143476],\n  [2014, 'F', 'Linda', 470, 0.000241328477325136],\n  [2014, 'F', 'Dorothy', 382, 0.000196143570932344],\n  [2014, 'F', 'Patricia', 377, 0.000193576246705481],\n  [2014, 'F', 'Deborah', 369, 0.0001894685279425],\n  [2014, 'F', 'Betty', 193, 9.90987151569174e-5],\n  [2015, 'F', 'Ashley', 3409, 0.00176165787043521],\n  [2015, 'F', 'Jessica', 1577, 0.000814941173856356],\n  [2015, 'F', 'Amanda', 1013, 0.000523484723599549],\n  [2015, 'F', 'Helen', 757, 0.000391192434121282],\n  [2015, 'F', 'Linda', 423, 0.000218592337692605],\n  [2015, 'F', 'Dorothy', 395, 0.00020412286853092],\n  [2015, 'F', 'Deborah', 346, 0.00017880129749797],\n  [2015, 'F', 'Patricia', 346, 0.00017880129749797],\n  [2015, 'F', 'Betty', 186, 9.61186165740535e-5],\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const BARCHART_1Y0G = [\n  { x: 0, y: 1 },\n  { x: 1, y: 2 },\n  { x: 2, y: 10 },\n  { x: 3, y: 6 },\n];\n\n/** @internal */\nexport const BARCHART_1Y0G_LINEAR = [\n  { x: 0, y: 1 },\n  { x: 1, y: 2 },\n  { x: 2.5, y: 10 },\n  { x: 3.5, y: 6 },\n];\n/** @internal */\nexport const BARCHART_1Y1G = [\n  { x: 0, g: 'a', y: 1 },\n  { x: 0, g: 'b', y: 2 },\n  { x: 1, g: 'a', y: 2 },\n  { x: 1, g: 'b', y: 3 },\n  { x: 2, g: 'a', y: 3 },\n  { x: 2, g: 'b', y: 4 },\n  { x: 3, g: 'a', y: 4 },\n  { x: 3, g: 'b', y: 5 },\n];\n/** @internal */\nexport const BARCHART_1Y1G_ORDINAL = [\n  { x: 'a', g: 'a', y: 1 },\n  { x: 'a', g: 'b', y: 2 },\n  { x: 'b', g: 'a', y: 2 },\n  { x: 'b', g: 'b', y: 3 },\n  { x: 'c', g: 'a', y: 3 },\n  { x: 'd', g: 'b', y: 4 },\n  { x: 'e', g: 'a', y: 4 },\n  { x: 'e', g: 'b', y: 5 },\n];\n\n/** @internal */\nexport const BARCHART_1Y1G_LINEAR = [\n  { x: 0, g: 'a', y: 1 },\n  { x: 0, g: 'b', y: 1 },\n  { x: 1, g: 'a', y: 2 },\n  { x: 1, g: 'b', y: 2 },\n  { x: 2, g: 'a', y: 10 },\n  { x: 2, g: 'b', y: 20 },\n  { x: 3, g: 'a', y: 6 },\n  { x: 5, g: 'a', y: 2 },\n  { x: 7, g: 'b', y: 3 },\n];\n\n/** @internal */\nexport const BARCHART_1Y2G = [\n  { x: 0, g1: 'a', g2: 's', y: 1 },\n  { x: 0, g1: 'a', g2: 'p', y: 1 },\n  { x: 0, g1: 'b', g2: 's', y: 1 },\n  { x: 0, g1: 'b', g2: 'p', y: 1 },\n  { x: 1, g1: 'a', g2: 's', y: 2 },\n  { x: 1, g1: 'a', g2: 'p', y: 2 },\n  { x: 1, g1: 'b', g2: 's', y: 2 },\n  { x: 1, g1: 'b', g2: 'p', y: 2 },\n  { x: 2, g1: 'a', g2: 's', y: 1 },\n  { x: 2, g1: 'a', g2: 'p', y: 2 },\n  { x: 2, g1: 'b', g2: 's', y: 3 },\n  { x: 2, g1: 'b', g2: 'p', y: 4 },\n  { x: 3, g1: 'a', g2: 's', y: 6 },\n  { x: 3, g1: 'a', g2: 'p', y: 6 },\n  { x: 3, g1: 'b', g2: 's', y: 6 },\n  { x: 3, g1: 'b', g2: 'p', y: 6 },\n];\n\n/** @internal */\nexport const BARCHART_2Y0G = [\n  { x: 0, y1: 1, y2: 3 },\n  { x: 1, y1: 2, y2: 7 },\n  { x: 2, y1: 1, y2: 2 },\n  { x: 3, y1: 6, y2: 10 },\n];\n\n/** @internal */\nexport const CHART_ORDINAL_2Y0G = [\n  { x: 'a', y1: 1, y2: 3 },\n  { x: 'b', y1: 2, y2: 7 },\n  { x: 'c', y1: 1, y2: 2 },\n  { x: 'd', y1: 6, y2: 10 },\n];\n\n/** @internal */\nexport const BARCHART_2Y1G = [\n  { x: 0, g: 'a', y1: 1, y2: 4 },\n  { x: 0, g: 'b', y1: 3, y2: 6 },\n  { x: 1, g: 'a', y1: 2, y2: 1 },\n  { x: 1, g: 'b', y1: 2, y2: 5 },\n  { x: 2, g: 'a', y1: 10, y2: 5 },\n  { x: 2, g: 'b', y1: 3, y2: 1 },\n  { x: 3, g: 'a', y1: 7, y2: 3 },\n  { x: 3, g: 'b', y1: 6, y2: 4 },\n];\n\n/** @internal */\nexport const BARCHART_2Y2G = [\n  { x: 0, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 1, y2: 4 },\n  { x: 0, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 1, y2: 4 },\n  { x: 0, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 3, y2: 6 },\n  { x: 0, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 3, y2: 6 },\n  { x: 1, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 2, y2: 1 },\n  { x: 1, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 2, y2: 1 },\n  { x: 1, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 2, y2: 5 },\n  { x: 1, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 2, y2: 5 },\n  { x: 2, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 10, y2: 5 },\n  { x: 2, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 10, y2: 5 },\n  { x: 2, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 3, y2: 1 },\n  { x: 2, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 3, y2: 1 },\n  { x: 3, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 7, y2: 3 },\n  { x: 3, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 7, y2: 3 },\n  { x: 3, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 6, y2: 4 },\n  { x: 3, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 6, y2: 4 },\n  { x: 6, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 7, y2: 3 },\n  { x: 6, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 7, y2: 3 },\n  { x: 6, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 6, y2: 4 },\n  { x: 6, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 6, y2: 4 },\n];\n\n/** @internal */\nexport const BARCHART_2Y3G = [\n  { x: 0, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 1, y2: 4, g3: 'somevalue' },\n  { x: 0, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 1, y2: 4, g3: 'newvalue' },\n  { x: 0, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 3, y2: 6, g3: 'somevalue' },\n  { x: 0, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 3, y2: 6, g3: 'newvalue' },\n  { x: 1, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 2, y2: 1, g3: 'somevalue' },\n  { x: 1, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 2, y2: 1, g3: 'newvalue' },\n  { x: 1, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 2, y2: 5, g3: 'somevalue' },\n  { x: 1, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 2, y2: 5, g3: 'newvalue' },\n  { x: 2, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 10, y2: 5, g3: 'somevalue' },\n  { x: 2, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 10, y2: 5, g3: 'newvalue' },\n  { x: 2, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 3, y2: 1, g3: 'somevalue' },\n  { x: 2, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 3, y2: 1, g3: 'newvalue' },\n  { x: 3, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 7, y2: 3, g3: 'somevalue' },\n  { x: 3, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 7, y2: 3, g3: 'newvalue' },\n  { x: 3, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 6, y2: 4, g3: 'somevalue' },\n  { x: 3, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 6, y2: 4, g3: 'newvalue' },\n  { x: 6, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 7, y2: 3, g3: 'somevalue' },\n  { x: 6, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 7, y2: 3, g3: 'newvalue' },\n  { x: 6, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 6, y2: 4, g3: 'somevalue' },\n  { x: 6, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 6, y2: 4, g3: 'newvalue' },\n];\n\nconst NOW = Date.now();\nconst DAY = 24 * 60 * 60 * 1000;\n/** @internal */\nexport const TIME_CHART_2Y0G = [\n  { x: NOW, y1: 1, y2: 3 },\n  { x: NOW + DAY, y1: 2, y2: 7 },\n  { x: NOW + DAY * 2, y1: 1, y2: 2 },\n  { x: NOW + DAY * 3, y1: 6, y2: 10 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\n\nimport { HeatmapSpec } from '../../chart_types/heatmap/specs';\nimport { ESCalendarInterval, ESFixedInterval } from '../chrono/elasticsearch';\n\ntype HeatmapDataSets = {\n  domain?: { min: number; max: number };\n  timeZone?: string;\n  data: Array<{ x: number; y: string; value: number }>;\n  interval: ESFixedInterval | ESCalendarInterval;\n  xFormatter?: HeatmapSpec['xAxisLabelFormatter'];\n};\n\n/** @internal */\nexport const DATA_1: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'h', value: 12 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('dd/MM HHa', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    {\n      y: 'AE',\n      x: 1633946400000,\n      value: 1630.1986083984375,\n    },\n    {\n      y: 'AE',\n      x: 1633989600000,\n      value: 589.9012451171875,\n    },\n    {\n      y: 'AE',\n      x: 1634076000000,\n      value: 1320.9326171875,\n    },\n    {\n      y: 'AE',\n      x: 1634162400000,\n      value: 1246.115478515625,\n    },\n    {\n      y: 'AE',\n      x: 1634248800000,\n      value: 1498.811767578125,\n    },\n    {\n      y: 'AE',\n      x: 1634292000000,\n      value: 1184.3049011230469,\n    },\n    {\n      y: 'AE',\n      x: 1634378400000,\n      value: 882.4849243164062,\n    },\n    {\n      y: 'AE',\n      x: 1634508000000,\n      value: 381.0003967285156,\n    },\n    {\n      y: 'AE',\n      x: 1634594400000,\n      value: 1137.0064697265625,\n    },\n    {\n      y: 'AE',\n      x: 1634637600000,\n      value: 221.59982299804688,\n    },\n    {\n      y: 'AR',\n      x: 1633903200000,\n      value: 1071.3580627441406,\n    },\n    {\n      y: 'AR',\n      x: 1633946400000,\n      value: 533.4688110351562,\n    },\n    {\n      y: 'AR',\n      x: 1633989600000,\n      value: 521.6063842773438,\n    },\n    {\n      y: 'AR',\n      x: 1634032800000,\n      value: 1779.9789428710938,\n    },\n    {\n      y: 'AR',\n      x: 1634076000000,\n      value: 1067.8575439453125,\n    },\n    {\n      y: 'AR',\n      x: 1634119200000,\n      value: 1489.5529174804688,\n    },\n    {\n      y: 'AR',\n      x: 1634162400000,\n      value: 1596.3911743164062,\n    },\n    {\n      y: 'AR',\n      x: 1634205600000,\n      value: 1026.2750549316406,\n    },\n    {\n      y: 'AR',\n      x: 1634248800000,\n      value: 1342.860107421875,\n    },\n    {\n      y: 'AR',\n      x: 1634292000000,\n      value: 1527.0611572265625,\n    },\n    {\n      y: 'AR',\n      x: 1634335200000,\n      value: 2064.026611328125,\n    },\n    {\n      y: 'AR',\n      x: 1634378400000,\n      value: 1553.267333984375,\n    },\n    {\n      y: 'AR',\n      x: 1634421600000,\n      value: 1454.1295166015625,\n    },\n    {\n      y: 'AR',\n      x: 1634464800000,\n      value: 1645.395263671875,\n    },\n    {\n      y: 'AR',\n      x: 1634508000000,\n      value: 1369.0120849609375,\n    },\n    {\n      y: 'AR',\n      x: 1634551200000,\n      value: 1482.1971435546875,\n    },\n    {\n      y: 'AR',\n      x: 1634594400000,\n      value: 1205.93310546875,\n    },\n    {\n      y: 'AR',\n      x: 1634637600000,\n      value: 1348.623291015625,\n    },\n    {\n      y: 'AR',\n      x: 1634680800000,\n      value: 959.8377685546875,\n    },\n    {\n      y: 'AT',\n      x: 1633903200000,\n      value: 749.7982788085938,\n    },\n    {\n      y: 'AT',\n      x: 1633946400000,\n      value: 1156.054931640625,\n    },\n    {\n      y: 'AT',\n      x: 1633989600000,\n      value: 1419.3067626953125,\n    },\n    {\n      y: 'AT',\n      x: 1634032800000,\n      value: 1137.7723999023438,\n    },\n    {\n      y: 'AT',\n      x: 1634076000000,\n      value: 1555.2818603515625,\n    },\n    {\n      y: 'AT',\n      x: 1634119200000,\n      value: 1516.8120727539062,\n    },\n    {\n      y: 'AT',\n      x: 1634162400000,\n      value: 1545.7149047851562,\n    },\n    {\n      y: 'AT',\n      x: 1634205600000,\n      value: 1298.5445556640625,\n    },\n    {\n      y: 'AT',\n      x: 1634248800000,\n      value: 1644.07177734375,\n    },\n    {\n      y: 'AT',\n      x: 1634292000000,\n      value: 1570.9822998046875,\n    },\n    {\n      y: 'AT',\n      x: 1634335200000,\n      value: 1123.7603759765625,\n    },\n    {\n      y: 'AT',\n      x: 1634378400000,\n      value: 1502.600341796875,\n    },\n    {\n      y: 'AT',\n      x: 1634421600000,\n      value: 1215.3555908203125,\n    },\n    {\n      y: 'AT',\n      x: 1634464800000,\n      value: 1761.99755859375,\n    },\n    {\n      y: 'AT',\n      x: 1634508000000,\n      value: 1402.3016357421875,\n    },\n    {\n      y: 'AT',\n      x: 1634551200000,\n      value: 1324.6370849609375,\n    },\n    {\n      y: 'AT',\n      x: 1634594400000,\n      value: 1205.5257568359375,\n    },\n    {\n      y: 'AT',\n      x: 1634637600000,\n      value: 1176.2248840332031,\n    },\n    {\n      y: 'AT',\n      x: 1634680800000,\n      value: 934.2395324707031,\n    },\n    {\n      y: 'AU',\n      x: 1633903200000,\n      value: 1228.46826171875,\n    },\n    {\n      y: 'AU',\n      x: 1633946400000,\n      value: 1528.995849609375,\n    },\n    {\n      y: 'AU',\n      x: 1633989600000,\n      value: 729.99755859375,\n    },\n    {\n      y: 'AU',\n      x: 1634032800000,\n      value: 1393.302978515625,\n    },\n    {\n      y: 'AU',\n      x: 1634076000000,\n      value: 971.7767944335938,\n    },\n    {\n      y: 'AU',\n      x: 1634119200000,\n      value: 1033.0284423828125,\n    },\n    {\n      y: 'AU',\n      x: 1634162400000,\n      value: 1826.966064453125,\n    },\n    {\n      y: 'AU',\n      x: 1634205600000,\n      value: 1540.0936889648438,\n    },\n    {\n      y: 'AU',\n      x: 1634248800000,\n      value: 1498.648681640625,\n    },\n    {\n      y: 'AU',\n      x: 1634292000000,\n      value: 1128.2857666015625,\n    },\n    {\n      y: 'AU',\n      x: 1634335200000,\n      value: 1374.63427734375,\n    },\n    {\n      y: 'AU',\n      x: 1634378400000,\n      value: 1749.794677734375,\n    },\n    {\n      y: 'AU',\n      x: 1634421600000,\n      value: 1624.445068359375,\n    },\n    {\n      y: 'AU',\n      x: 1634464800000,\n      value: 1714.9954223632812,\n    },\n    {\n      y: 'AU',\n      x: 1634508000000,\n      value: 1153.7655029296875,\n    },\n    {\n      y: 'AU',\n      x: 1634551200000,\n      value: 1165.4229736328125,\n    },\n    {\n      y: 'AU',\n      x: 1634594400000,\n      value: 1615.3231811523438,\n    },\n    {\n      y: 'AU',\n      x: 1634637600000,\n      value: 799.819580078125,\n    },\n    {\n      y: 'AU',\n      x: 1634680800000,\n      value: 1784.1341552734375,\n    },\n    {\n      y: 'CA',\n      x: 1633903200000,\n      value: 1373.2542724609375,\n    },\n    {\n      y: 'CA',\n      x: 1633946400000,\n      value: 984.0171508789062,\n    },\n    {\n      y: 'CA',\n      x: 1633989600000,\n      value: 667.0845947265625,\n    },\n    {\n      y: 'CA',\n      x: 1634032800000,\n      value: 1149.9925537109375,\n    },\n    {\n      y: 'CA',\n      x: 1634076000000,\n      value: 1397.2909545898438,\n    },\n    {\n      y: 'CA',\n      x: 1634119200000,\n      value: 1390.003662109375,\n    },\n    {\n      y: 'CA',\n      x: 1634162400000,\n      value: 1242.8565673828125,\n    },\n    {\n      y: 'CA',\n      x: 1634205600000,\n      value: 853.4672546386719,\n    },\n    {\n      y: 'CA',\n      x: 1634248800000,\n      value: 937.9247436523438,\n    },\n    {\n      y: 'CA',\n      x: 1634292000000,\n      value: 1240.626953125,\n    },\n    {\n      y: 'CA',\n      x: 1634335200000,\n      value: 1598.92431640625,\n    },\n    {\n      y: 'CA',\n      x: 1634378400000,\n      value: 2096.9384765625,\n    },\n    {\n      y: 'CA',\n      x: 1634421600000,\n      value: 1404.4989013671875,\n    },\n    {\n      y: 'CA',\n      x: 1634464800000,\n      value: 1532.7533569335938,\n    },\n    {\n      y: 'CA',\n      x: 1634508000000,\n      value: 1308.9225463867188,\n    },\n    {\n      y: 'CA',\n      x: 1634551200000,\n      value: 1254.5380859375,\n    },\n    {\n      y: 'CA',\n      x: 1634594400000,\n      value: 1447.060791015625,\n    },\n    {\n      y: 'CA',\n      x: 1634637600000,\n      value: 1026.0033569335938,\n    },\n    {\n      y: 'CA',\n      x: 1634680800000,\n      value: 1454.3275146484375,\n    },\n    {\n      y: 'CA',\n      x: 1634724000000,\n      value: 1378.6402587890625,\n    },\n    {\n      y: 'CH',\n      x: 1633903200000,\n      value: 585.6773834228516,\n    },\n    {\n      y: 'CH',\n      x: 1633946400000,\n      value: 690.4444274902344,\n    },\n    {\n      y: 'CH',\n      x: 1633989600000,\n      value: 695.4150390625,\n    },\n    {\n      y: 'CH',\n      x: 1634032800000,\n      value: 508.3909606933594,\n    },\n    {\n      y: 'CH',\n      x: 1634076000000,\n      value: 1424.2265014648438,\n    },\n    {\n      y: 'CH',\n      x: 1634119200000,\n      value: 1313.9705810546875,\n    },\n    {\n      y: 'CH',\n      x: 1634162400000,\n      value: 1311.3236694335938,\n    },\n    {\n      y: 'CH',\n      x: 1634205600000,\n      value: 1160.4334716796875,\n    },\n    {\n      y: 'CH',\n      x: 1634248800000,\n      value: 549.681884765625,\n    },\n    {\n      y: 'CH',\n      x: 1634292000000,\n      value: 879.4996032714844,\n    },\n    {\n      y: 'CH',\n      x: 1634335200000,\n      value: 1364.97216796875,\n    },\n    {\n      y: 'CH',\n      x: 1634378400000,\n      value: 1379.3760986328125,\n    },\n    {\n      y: 'CH',\n      x: 1634421600000,\n      value: 1590.429931640625,\n    },\n    {\n      y: 'CH',\n      x: 1634464800000,\n      value: 1702.2340698242188,\n    },\n    {\n      y: 'CH',\n      x: 1634508000000,\n      value: 941.3290405273438,\n    },\n    {\n      y: 'CH',\n      x: 1634551200000,\n      value: 1174.7496337890625,\n    },\n    {\n      y: 'CH',\n      x: 1634594400000,\n      value: 729.7496948242188,\n    },\n    {\n      y: 'CH',\n      x: 1634637600000,\n      value: 1526.578369140625,\n    },\n    {\n      y: 'CH',\n      x: 1634680800000,\n      value: 1129.46484375,\n    },\n    {\n      y: 'CL',\n      x: 1633946400000,\n      value: 1536.809814453125,\n    },\n    {\n      y: 'CL',\n      x: 1634076000000,\n      value: 1113.52978515625,\n    },\n    {\n      y: 'CL',\n      x: 1634162400000,\n      value: 1973.97119140625,\n    },\n    {\n      y: 'CL',\n      x: 1634205600000,\n      value: 1560.9017333984375,\n    },\n    {\n      y: 'CL',\n      x: 1634292000000,\n      value: 862.6887512207031,\n    },\n    {\n      y: 'CL',\n      x: 1634335200000,\n      value: 2353.2763671875,\n    },\n    {\n      y: 'CL',\n      x: 1634378400000,\n      value: 1944.758544921875,\n    },\n    {\n      y: 'CL',\n      x: 1634508000000,\n      value: 1354.3873291015625,\n    },\n    {\n      y: 'CL',\n      x: 1634637600000,\n      value: 996.3539428710938,\n    },\n    {\n      y: 'CL',\n      x: 1634680800000,\n      value: 1355.901611328125,\n    },\n    {\n      y: 'CN',\n      x: 1633903200000,\n      value: 1448.720703125,\n    },\n    {\n      y: 'CN',\n      x: 1633946400000,\n      value: 1519.4761352539062,\n    },\n    {\n      y: 'CN',\n      x: 1633989600000,\n      value: 1109.7001953125,\n    },\n    {\n      y: 'CN',\n      x: 1634032800000,\n      value: 1220.62548828125,\n    },\n    {\n      y: 'CN',\n      x: 1634076000000,\n      value: 968.7841186523438,\n    },\n    {\n      y: 'CN',\n      x: 1634119200000,\n      value: 1275.71826171875,\n    },\n    {\n      y: 'CN',\n      x: 1634162400000,\n      value: 1687.98876953125,\n    },\n    {\n      y: 'CN',\n      x: 1634205600000,\n      value: 1047.9259033203125,\n    },\n    {\n      y: 'CN',\n      x: 1634248800000,\n      value: 1552.34521484375,\n    },\n    {\n      y: 'CN',\n      x: 1634292000000,\n      value: 1690.6611328125,\n    },\n    {\n      y: 'CN',\n      x: 1634335200000,\n      value: 2057.9147338867188,\n    },\n    {\n      y: 'CN',\n      x: 1634378400000,\n      value: 1597.23876953125,\n    },\n    {\n      y: 'CN',\n      x: 1634421600000,\n      value: 1500.2396850585938,\n    },\n    {\n      y: 'CN',\n      x: 1634464800000,\n      value: 1854.201416015625,\n    },\n    {\n      y: 'CN',\n      x: 1634508000000,\n      value: 1057.568359375,\n    },\n    {\n      y: 'CN',\n      x: 1634551200000,\n      value: 1644.513671875,\n    },\n    {\n      y: 'CN',\n      x: 1634594400000,\n      value: 924.8408813476562,\n    },\n    {\n      y: 'CN',\n      x: 1634637600000,\n      value: 1176.250244140625,\n    },\n    {\n      y: 'CN',\n      x: 1634680800000,\n      value: 1293.4815673828125,\n    },\n    {\n      y: 'CN',\n      x: 1634724000000,\n      value: 857.4727172851562,\n    },\n    {\n      y: 'CO',\n      x: 1633903200000,\n      value: 1095.269775390625,\n    },\n    {\n      y: 'CO',\n      x: 1633946400000,\n      value: 453.3008728027344,\n    },\n    {\n      y: 'CO',\n      x: 1633989600000,\n      value: 1304.517822265625,\n    },\n    {\n      y: 'CO',\n      x: 1634032800000,\n      value: 1854.322021484375,\n    },\n    {\n      y: 'CO',\n      x: 1634076000000,\n      value: 1052.2171630859375,\n    },\n    {\n      y: 'CO',\n      x: 1634292000000,\n      value: 989.3553466796875,\n    },\n    {\n      y: 'CO',\n      x: 1634335200000,\n      value: 1096.70849609375,\n    },\n    {\n      y: 'CO',\n      x: 1634378400000,\n      value: 1076.895751953125,\n    },\n    {\n      y: 'CO',\n      x: 1634421600000,\n      value: 1075.150390625,\n    },\n    {\n      y: 'CO',\n      x: 1634508000000,\n      value: 871.4742431640625,\n    },\n    {\n      y: 'CO',\n      x: 1634551200000,\n      value: 1245.4185791015625,\n    },\n    {\n      y: 'CO',\n      x: 1634594400000,\n      value: 1923.149658203125,\n    },\n    {\n      y: 'CO',\n      x: 1634680800000,\n      value: 1824.5716552734375,\n    },\n    {\n      y: 'DE',\n      x: 1633946400000,\n      value: 1132.97509765625,\n    },\n    {\n      y: 'DE',\n      x: 1633989600000,\n      value: 1571.764404296875,\n    },\n    {\n      y: 'DE',\n      x: 1634032800000,\n      value: 1040.1160888671875,\n    },\n    {\n      y: 'DE',\n      x: 1634076000000,\n      value: 1529.804931640625,\n    },\n    {\n      y: 'DE',\n      x: 1634119200000,\n      value: 960.6709594726562,\n    },\n    {\n      y: 'DE',\n      x: 1634162400000,\n      value: 950.5629272460938,\n    },\n    {\n      y: 'DE',\n      x: 1634205600000,\n      value: 1107.2994995117188,\n    },\n    {\n      y: 'DE',\n      x: 1634248800000,\n      value: 770.2896118164062,\n    },\n    {\n      y: 'DE',\n      x: 1634292000000,\n      value: 1618.79541015625,\n    },\n    {\n      y: 'DE',\n      x: 1634335200000,\n      value: 1981.40087890625,\n    },\n    {\n      y: 'DE',\n      x: 1634378400000,\n      value: 1429.888916015625,\n    },\n    {\n      y: 'DE',\n      x: 1634421600000,\n      value: 1276.201171875,\n    },\n    {\n      y: 'DE',\n      x: 1634464800000,\n      value: 2380.615478515625,\n    },\n    {\n      y: 'DE',\n      x: 1634551200000,\n      value: 921.33544921875,\n    },\n    {\n      y: 'DE',\n      x: 1634594400000,\n      value: 1053.485107421875,\n    },\n    {\n      y: 'DE',\n      x: 1634637600000,\n      value: 1144.2720947265625,\n    },\n    {\n      y: 'DE',\n      x: 1634680800000,\n      value: 1533.2845458984375,\n    },\n    {\n      y: 'DK',\n      x: 1633903200000,\n      value: 1195.4417114257812,\n    },\n    {\n      y: 'DK',\n      x: 1634032800000,\n      value: 945.0773315429688,\n    },\n    {\n      y: 'DK',\n      x: 1634292000000,\n      value: 1464.6525268554688,\n    },\n    {\n      y: 'DK',\n      x: 1634335200000,\n      value: 1778.8946533203125,\n    },\n    {\n      y: 'DK',\n      x: 1634421600000,\n      value: 1895.1260986328125,\n    },\n    {\n      y: 'DK',\n      x: 1634464800000,\n      value: 2099.8984375,\n    },\n    {\n      y: 'DK',\n      x: 1634508000000,\n      value: 1178.702392578125,\n    },\n    {\n      y: 'DK',\n      x: 1634637600000,\n      value: 1082.788818359375,\n    },\n    {\n      y: 'DK',\n      x: 1634680800000,\n      value: 1333.0047607421875,\n    },\n    {\n      y: 'EC',\n      x: 1633903200000,\n      value: 1260.6492309570312,\n    },\n    {\n      y: 'EC',\n      x: 1633946400000,\n      value: 1139.206298828125,\n    },\n    {\n      y: 'EC',\n      x: 1633989600000,\n      value: 1083.087646484375,\n    },\n    {\n      y: 'EC',\n      x: 1634032800000,\n      value: 1226.3377075195312,\n    },\n    {\n      y: 'EC',\n      x: 1634076000000,\n      value: 1277.2030029296875,\n    },\n    {\n      y: 'EC',\n      x: 1634119200000,\n      value: 1494.2833251953125,\n    },\n    {\n      y: 'EC',\n      x: 1634205600000,\n      value: 1556.5960693359375,\n    },\n    {\n      y: 'EC',\n      x: 1634248800000,\n      value: 888.1316528320312,\n    },\n    {\n      y: 'EC',\n      x: 1634292000000,\n      value: 1607.5115966796875,\n    },\n    {\n      y: 'EC',\n      x: 1634335200000,\n      value: 1786.5728759765625,\n    },\n    {\n      y: 'EC',\n      x: 1634378400000,\n      value: 1059.01220703125,\n    },\n    {\n      y: 'EC',\n      x: 1634421600000,\n      value: 1307.0654907226562,\n    },\n    {\n      y: 'EC',\n      x: 1634464800000,\n      value: 1700.533447265625,\n    },\n    {\n      y: 'EC',\n      x: 1634508000000,\n      value: 1518.436279296875,\n    },\n    {\n      y: 'EC',\n      x: 1634551200000,\n      value: 1680.8818359375,\n    },\n    {\n      y: 'EC',\n      x: 1634594400000,\n      value: 1138.2274169921875,\n    },\n    {\n      y: 'EC',\n      x: 1634637600000,\n      value: 801.6689453125,\n    },\n    {\n      y: 'EC',\n      x: 1634680800000,\n      value: 1023.8098754882812,\n    },\n    {\n      y: 'ES',\n      x: 1634205600000,\n      value: 1095.447250366211,\n    },\n    {\n      y: 'ES',\n      x: 1634248800000,\n      value: 846.2098999023438,\n    },\n    {\n      y: 'ES',\n      x: 1634464800000,\n      value: 513.0786743164062,\n    },\n    {\n      y: 'ES',\n      x: 1634551200000,\n      value: 421.4815673828125,\n    },\n    {\n      y: 'ES',\n      x: 1634680800000,\n      value: 1783.7108154296875,\n    },\n    {\n      y: 'FI',\n      x: 1633946400000,\n      value: 1989.708740234375,\n    },\n    {\n      y: 'FI',\n      x: 1633989600000,\n      value: 1616.2996826171875,\n    },\n    {\n      y: 'FI',\n      x: 1634032800000,\n      value: 1238.53076171875,\n    },\n    {\n      y: 'FI',\n      x: 1634076000000,\n      value: 1953.0860595703125,\n    },\n    {\n      y: 'FI',\n      x: 1634162400000,\n      value: 1701.4493408203125,\n    },\n    {\n      y: 'FI',\n      x: 1634205600000,\n      value: 1323.0477294921875,\n    },\n    {\n      y: 'FI',\n      x: 1634508000000,\n      value: 958.4090576171875,\n    },\n    {\n      y: 'FI',\n      x: 1634551200000,\n      value: 1426.584716796875,\n    },\n    {\n      y: 'FI',\n      x: 1634594400000,\n      value: 1633.1131591796875,\n    },\n    {\n      y: 'FI',\n      x: 1634680800000,\n      value: 778.8355102539062,\n    },\n    {\n      y: 'FR',\n      x: 1633903200000,\n      value: 741.9657592773438,\n    },\n    {\n      y: 'FR',\n      x: 1633946400000,\n      value: 1027.302001953125,\n    },\n    {\n      y: 'FR',\n      x: 1633989600000,\n      value: 933.7100830078125,\n    },\n    {\n      y: 'FR',\n      x: 1634032800000,\n      value: 1727.9757080078125,\n    },\n    {\n      y: 'FR',\n      x: 1634205600000,\n      value: 1445.7293701171875,\n    },\n    {\n      y: 'FR',\n      x: 1634335200000,\n      value: 1083.11572265625,\n    },\n    {\n      y: 'FR',\n      x: 1634378400000,\n      value: 840.2843017578125,\n    },\n    {\n      y: 'FR',\n      x: 1634464800000,\n      value: 1074.0158081054688,\n    },\n    {\n      y: 'FR',\n      x: 1634508000000,\n      value: 1994.239501953125,\n    },\n    {\n      y: 'FR',\n      x: 1634680800000,\n      value: 1290.5693359375,\n    },\n    {\n      y: 'GB',\n      x: 1633903200000,\n      value: 1000.9656982421875,\n    },\n    {\n      y: 'GB',\n      x: 1633946400000,\n      value: 1361.612060546875,\n    },\n    {\n      y: 'GB',\n      x: 1633989600000,\n      value: 1048.4798278808594,\n    },\n    {\n      y: 'GB',\n      x: 1634032800000,\n      value: 1040.1541748046875,\n    },\n    {\n      y: 'GB',\n      x: 1634076000000,\n      value: 1261.7947387695312,\n    },\n    {\n      y: 'GB',\n      x: 1634119200000,\n      value: 1279.813720703125,\n    },\n    {\n      y: 'GB',\n      x: 1634162400000,\n      value: 1494.7257080078125,\n    },\n    {\n      y: 'GB',\n      x: 1634205600000,\n      value: 1481.67041015625,\n    },\n    {\n      y: 'GB',\n      x: 1634248800000,\n      value: 1128.2760009765625,\n    },\n    {\n      y: 'GB',\n      x: 1634292000000,\n      value: 1075.6246337890625,\n    },\n    {\n      y: 'GB',\n      x: 1634335200000,\n      value: 1837.26220703125,\n    },\n    {\n      y: 'GB',\n      x: 1634378400000,\n      value: 1100.0601806640625,\n    },\n    {\n      y: 'GB',\n      x: 1634421600000,\n      value: 2098.5350341796875,\n    },\n    {\n      y: 'GB',\n      x: 1634464800000,\n      value: 1313.1705322265625,\n    },\n    {\n      y: 'GB',\n      x: 1634508000000,\n      value: 1930.4819946289062,\n    },\n    {\n      y: 'GB',\n      x: 1634551200000,\n      value: 1384.9301147460938,\n    },\n    {\n      y: 'GB',\n      x: 1634594400000,\n      value: 1308.79443359375,\n    },\n    {\n      y: 'GB',\n      x: 1634637600000,\n      value: 1189.3238525390625,\n    },\n    {\n      y: 'GB',\n      x: 1634680800000,\n      value: 1454.0706787109375,\n    },\n    {\n      y: '__other__',\n      x: 1633903200000,\n      value: 1193.8202514648438,\n    },\n    {\n      y: '__other__',\n      x: 1633946400000,\n      value: 1200.88037109375,\n    },\n    {\n      y: '__other__',\n      x: 1633989600000,\n      value: 1234.8555908203125,\n    },\n    {\n      y: '__other__',\n      x: 1634032800000,\n      value: 1078.6812133789062,\n    },\n    {\n      y: '__other__',\n      x: 1634076000000,\n      value: 995.9703979492188,\n    },\n    {\n      y: '__other__',\n      x: 1634119200000,\n      value: 1198.1402587890625,\n    },\n    {\n      y: '__other__',\n      x: 1634162400000,\n      value: 1106.43212890625,\n    },\n    {\n      y: '__other__',\n      x: 1634205600000,\n      value: 1180.4904174804688,\n    },\n    {\n      y: '__other__',\n      x: 1634248800000,\n      value: 1319.378173828125,\n    },\n    {\n      y: '__other__',\n      x: 1634292000000,\n      value: 1177.3067016601562,\n    },\n    {\n      y: '__other__',\n      x: 1634335200000,\n      value: 1503.594482421875,\n    },\n    {\n      y: '__other__',\n      x: 1634378400000,\n      value: 1577.262939453125,\n    },\n    {\n      y: '__other__',\n      x: 1634421600000,\n      value: 1739.27294921875,\n    },\n    {\n      y: '__other__',\n      x: 1634464800000,\n      value: 1519.1485595703125,\n    },\n    {\n      y: '__other__',\n      x: 1634508000000,\n      value: 1136.928466796875,\n    },\n    {\n      y: '__other__',\n      x: 1634551200000,\n      value: 1072.9026489257812,\n    },\n    {\n      y: '__other__',\n      x: 1634594400000,\n      value: 1105.2606201171875,\n    },\n    {\n      y: '__other__',\n      x: 1634637600000,\n      value: 1313.4656982421875,\n    },\n    {\n      y: '__other__',\n      x: 1634680800000,\n      value: 1250.16357421875,\n    },\n    {\n      y: '__other__',\n      x: 1634724000000,\n      value: 999.7426681518555,\n    },\n  ],\n};\n\n/** @internal */\nexport const DATA_2: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'h', value: 3 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('dd MMM HHa', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    { y: 'CN', x: 1635285600000, value: 1 },\n    { y: 'CN', x: 1635296400000, value: 1 },\n    { y: 'CN', x: 1635307200000, value: 4 },\n    { y: 'CN', x: 1635318000000, value: 9 },\n    { y: 'CN', x: 1635328800000, value: 13 },\n    { y: 'CN', x: 1635339600000, value: 13 },\n    { y: 'CN', x: 1635350400000, value: 4 },\n    { y: 'CN', x: 1635361200000, value: 1 },\n    { y: 'CN', x: 1635372000000, value: 0 },\n    { y: 'CN', x: 1635382800000, value: 1 },\n    { y: 'CN', x: 1635393600000, value: 0 },\n    { y: 'CN', x: 1635404400000, value: 12 },\n    { y: 'CN', x: 1635415200000, value: 21 },\n    { y: 'CN', x: 1635426000000, value: 6 },\n    { y: 'CN', x: 1635436800000, value: 11 },\n    { y: 'CN', x: 1635447600000, value: 1 },\n    { y: 'CN', x: 1635458400000, value: 0 },\n    { y: 'CN', x: 1635469200000, value: 0 },\n    { y: 'CN', x: 1635480000000, value: 4 },\n    { y: 'CN', x: 1635490800000, value: 8 },\n    { y: 'CN', x: 1635501600000, value: 19 },\n    { y: 'CN', x: 1635512400000, value: 10 },\n    { y: 'CN', x: 1635523200000, value: 5 },\n    { y: 'CN', x: 1635534000000, value: 1 },\n    { y: 'CN', x: 1635544800000, value: 0 },\n    { y: 'CN', x: 1635555600000, value: 0 },\n    { y: 'CN', x: 1635566400000, value: 3 },\n    { y: 'CN', x: 1635577200000, value: 15 },\n    { y: 'CN', x: 1635588000000, value: 12 },\n    { y: 'CN', x: 1635598800000, value: 8 },\n    { y: 'CN', x: 1635609600000, value: 4 },\n    { y: 'CN', x: 1635620400000, value: 2 },\n    { y: 'CN', x: 1635631200000, value: 0 },\n    { y: 'CN', x: 1635645600000, value: 1 },\n    { y: 'CN', x: 1635656400000, value: 6 },\n    { y: 'CN', x: 1635667200000, value: 13 },\n    { y: 'CN', x: 1635678000000, value: 17 },\n    { y: 'CN', x: 1635688800000, value: 10 },\n    { y: 'CN', x: 1635699600000, value: 0 },\n    { y: 'CN', x: 1635710400000, value: 0 },\n    { y: 'CN', x: 1635721200000, value: 0 },\n    { y: 'CN', x: 1635732000000, value: 1 },\n    { y: 'CN', x: 1635742800000, value: 4 },\n    { y: 'CN', x: 1635753600000, value: 13 },\n    { y: 'CN', x: 1635764400000, value: 13 },\n    { y: 'CN', x: 1635775200000, value: 12 },\n    { y: 'CN', x: 1635786000000, value: 7 },\n    { y: 'CN', x: 1635796800000, value: 0 },\n    { y: 'CN', x: 1635807600000, value: 0 },\n    { y: 'CN', x: 1635818400000, value: 3 },\n    { y: 'CN', x: 1635829200000, value: 4 },\n    { y: 'CN', x: 1635840000000, value: 9 },\n    { y: 'CN', x: 1635850800000, value: 9 },\n    { y: 'CN', x: 1635861600000, value: 8 },\n    { y: 'CN', x: 1635872400000, value: 1 },\n    { y: 'CN', x: 1635883200000, value: 1 },\n    { y: 'CN', x: 1635894000000, value: 0 },\n    { y: 'CN', x: 1635904800000, value: 1 },\n    { y: 'CN', x: 1635915600000, value: 6 },\n    { y: 'CN', x: 1635926400000, value: 16 },\n    { y: 'CN', x: 1635937200000, value: 13 },\n    { y: 'CN', x: 1635948000000, value: 14 },\n    { y: 'IN', x: 1635307200000, value: 1 },\n    { y: 'IN', x: 1635318000000, value: 14 },\n    { y: 'IN', x: 1635328800000, value: 15 },\n    { y: 'IN', x: 1635339600000, value: 11 },\n    { y: 'IN', x: 1635350400000, value: 4 },\n    { y: 'IN', x: 1635361200000, value: 0 },\n    { y: 'IN', x: 1635372000000, value: 0 },\n    { y: 'IN', x: 1635382800000, value: 1 },\n    { y: 'IN', x: 1635393600000, value: 4 },\n    { y: 'IN', x: 1635404400000, value: 8 },\n    { y: 'IN', x: 1635415200000, value: 12 },\n    { y: 'IN', x: 1635426000000, value: 11 },\n    { y: 'IN', x: 1635436800000, value: 1 },\n    { y: 'IN', x: 1635447600000, value: 1 },\n    { y: 'IN', x: 1635458400000, value: 0 },\n    { y: 'IN', x: 1635469200000, value: 1 },\n    { y: 'IN', x: 1635480000000, value: 2 },\n    { y: 'IN', x: 1635490800000, value: 7 },\n    { y: 'IN', x: 1635501600000, value: 9 },\n    { y: 'IN', x: 1635512400000, value: 9 },\n    { y: 'IN', x: 1635523200000, value: 4 },\n    { y: 'IN', x: 1635534000000, value: 1 },\n    { y: 'IN', x: 1635544800000, value: 0 },\n    { y: 'IN', x: 1635555600000, value: 2 },\n    { y: 'IN', x: 1635566400000, value: 2 },\n    { y: 'IN', x: 1635577200000, value: 8 },\n    { y: 'IN', x: 1635588000000, value: 8 },\n    { y: 'IN', x: 1635598800000, value: 10 },\n    { y: 'IN', x: 1635609600000, value: 7 },\n    { y: 'IN', x: 1635620400000, value: 0 },\n    { y: 'IN', x: 1635631200000, value: 0 },\n    { y: 'IN', x: 1635645600000, value: 1 },\n    { y: 'IN', x: 1635656400000, value: 4 },\n    { y: 'IN', x: 1635667200000, value: 6 },\n    { y: 'IN', x: 1635678000000, value: 10 },\n    { y: 'IN', x: 1635688800000, value: 3 },\n    { y: 'IN', x: 1635699600000, value: 4 },\n    { y: 'IN', x: 1635710400000, value: 0 },\n    { y: 'IN', x: 1635721200000, value: 1 },\n    { y: 'IN', x: 1635732000000, value: 1 },\n    { y: 'IN', x: 1635742800000, value: 3 },\n    { y: 'IN', x: 1635753600000, value: 6 },\n    { y: 'IN', x: 1635764400000, value: 10 },\n    { y: 'IN', x: 1635775200000, value: 11 },\n    { y: 'IN', x: 1635786000000, value: 1 },\n    { y: 'IN', x: 1635796800000, value: 1 },\n    { y: 'IN', x: 1635807600000, value: 0 },\n    { y: 'IN', x: 1635818400000, value: 2 },\n    { y: 'IN', x: 1635829200000, value: 2 },\n    { y: 'IN', x: 1635840000000, value: 10 },\n    { y: 'IN', x: 1635850800000, value: 17 },\n    { y: 'IN', x: 1635861600000, value: 7 },\n    { y: 'IN', x: 1635872400000, value: 1 },\n    { y: 'IN', x: 1635883200000, value: 1 },\n    { y: 'IN', x: 1635894000000, value: 1 },\n    { y: 'IN', x: 1635904800000, value: 0 },\n    { y: 'IN', x: 1635915600000, value: 3 },\n    { y: 'IN', x: 1635926400000, value: 4 },\n    { y: 'IN', x: 1635937200000, value: 4 },\n    { y: 'IN', x: 1635948000000, value: 10 },\n    { y: 'IN', x: 1635958800000, value: 2 },\n    { y: 'IN', x: 1635969600000, value: 1 },\n    { y: 'US', x: 1635318000000, value: 6 },\n    { y: 'US', x: 1635328800000, value: 6 },\n    { y: 'US', x: 1635339600000, value: 4 },\n    { y: 'US', x: 1635350400000, value: 5 },\n    { y: 'US', x: 1635361200000, value: 0 },\n    { y: 'US', x: 1635372000000, value: 0 },\n    { y: 'US', x: 1635382800000, value: 0 },\n    { y: 'US', x: 1635393600000, value: 1 },\n    { y: 'US', x: 1635404400000, value: 2 },\n    { y: 'US', x: 1635415200000, value: 5 },\n    { y: 'US', x: 1635426000000, value: 6 },\n    { y: 'US', x: 1635436800000, value: 2 },\n    { y: 'US', x: 1635447600000, value: 0 },\n    { y: 'US', x: 1635458400000, value: 0 },\n    { y: 'US', x: 1635469200000, value: 0 },\n    { y: 'US', x: 1635480000000, value: 1 },\n    { y: 'US', x: 1635490800000, value: 4 },\n    { y: 'US', x: 1635501600000, value: 4 },\n    { y: 'US', x: 1635512400000, value: 2 },\n    { y: 'US', x: 1635523200000, value: 0 },\n    { y: 'US', x: 1635534000000, value: 1 },\n    { y: 'US', x: 1635544800000, value: 0 },\n    { y: 'US', x: 1635555600000, value: 0 },\n    { y: 'US', x: 1635566400000, value: 1 },\n    { y: 'US', x: 1635577200000, value: 4 },\n    { y: 'US', x: 1635588000000, value: 9 },\n    { y: 'US', x: 1635598800000, value: 4 },\n    { y: 'US', x: 1635609600000, value: 1 },\n    { y: 'US', x: 1635620400000, value: 1 },\n    { y: 'US', x: 1635631200000, value: 0 },\n    { y: 'US', x: 1635645600000, value: 0 },\n    { y: 'US', x: 1635656400000, value: 3 },\n    { y: 'US', x: 1635667200000, value: 4 },\n    { y: 'US', x: 1635678000000, value: 10 },\n    { y: 'US', x: 1635688800000, value: 3 },\n    { y: 'US', x: 1635699600000, value: 0 },\n    { y: 'US', x: 1635710400000, value: 0 },\n    { y: 'US', x: 1635721200000, value: 0 },\n    { y: 'US', x: 1635732000000, value: 0 },\n    { y: 'US', x: 1635742800000, value: 2 },\n    { y: 'US', x: 1635753600000, value: 6 },\n    { y: 'US', x: 1635764400000, value: 3 },\n    { y: 'US', x: 1635775200000, value: 4 },\n    { y: 'US', x: 1635786000000, value: 1 },\n    { y: 'US', x: 1635796800000, value: 0 },\n    { y: 'US', x: 1635807600000, value: 0 },\n    { y: 'US', x: 1635818400000, value: 0 },\n    { y: 'US', x: 1635829200000, value: 1 },\n    { y: 'US', x: 1635840000000, value: 5 },\n    { y: 'US', x: 1635850800000, value: 4 },\n    { y: 'US', x: 1635861600000, value: 3 },\n    { y: 'US', x: 1635872400000, value: 0 },\n    { y: 'US', x: 1635883200000, value: 0 },\n    { y: 'US', x: 1635894000000, value: 1 },\n    { y: 'US', x: 1635904800000, value: 1 },\n    { y: 'US', x: 1635915600000, value: 4 },\n    { y: 'US', x: 1635926400000, value: 2 },\n    { y: 'US', x: 1635937200000, value: 7 },\n    { y: 'US', x: 1635948000000, value: 0 },\n    { y: 'US', x: 1635958800000, value: 4 },\n    { y: '__other__', x: 1635296400000, value: 1 },\n    { y: '__other__', x: 1635307200000, value: 8 },\n    { y: '__other__', x: 1635318000000, value: 26 },\n    { y: '__other__', x: 1635328800000, value: 39 },\n    { y: '__other__', x: 1635339600000, value: 27 },\n    { y: '__other__', x: 1635350400000, value: 21 },\n    { y: '__other__', x: 1635361200000, value: 3 },\n    { y: '__other__', x: 1635372000000, value: 0 },\n    { y: '__other__', x: 1635382800000, value: 4 },\n    { y: '__other__', x: 1635393600000, value: 12 },\n    { y: '__other__', x: 1635404400000, value: 26 },\n    { y: '__other__', x: 1635415200000, value: 34 },\n    { y: '__other__', x: 1635426000000, value: 32 },\n    { y: '__other__', x: 1635436800000, value: 15 },\n    { y: '__other__', x: 1635447600000, value: 0 },\n    { y: '__other__', x: 1635458400000, value: 1 },\n    { y: '__other__', x: 1635469200000, value: 4 },\n    { y: '__other__', x: 1635480000000, value: 10 },\n    { y: '__other__', x: 1635490800000, value: 31 },\n    { y: '__other__', x: 1635501600000, value: 40 },\n    { y: '__other__', x: 1635512400000, value: 28 },\n    { y: '__other__', x: 1635523200000, value: 19 },\n    { y: '__other__', x: 1635534000000, value: 5 },\n    { y: '__other__', x: 1635544800000, value: 1 },\n    { y: '__other__', x: 1635555600000, value: 3 },\n    { y: '__other__', x: 1635566400000, value: 3 },\n    { y: '__other__', x: 1635577200000, value: 23 },\n    { y: '__other__', x: 1635588000000, value: 50 },\n    { y: '__other__', x: 1635598800000, value: 32 },\n    { y: '__other__', x: 1635609600000, value: 12 },\n    { y: '__other__', x: 1635620400000, value: 5 },\n    { y: '__other__', x: 1635631200000, value: 2 },\n    { y: '__other__', x: 1635645600000, value: 2 },\n    { y: '__other__', x: 1635656400000, value: 16 },\n    { y: '__other__', x: 1635667200000, value: 38 },\n    { y: '__other__', x: 1635678000000, value: 36 },\n    { y: '__other__', x: 1635688800000, value: 29 },\n    { y: '__other__', x: 1635699600000, value: 11 },\n    { y: '__other__', x: 1635710400000, value: 1 },\n    { y: '__other__', x: 1635721200000, value: 2 },\n    { y: '__other__', x: 1635732000000, value: 1 },\n    { y: '__other__', x: 1635742800000, value: 19 },\n    { y: '__other__', x: 1635753600000, value: 32 },\n    { y: '__other__', x: 1635764400000, value: 44 },\n    { y: '__other__', x: 1635775200000, value: 22 },\n    { y: '__other__', x: 1635786000000, value: 9 },\n    { y: '__other__', x: 1635796800000, value: 2 },\n    { y: '__other__', x: 1635807600000, value: 0 },\n    { y: '__other__', x: 1635818400000, value: 7 },\n    { y: '__other__', x: 1635829200000, value: 16 },\n    { y: '__other__', x: 1635840000000, value: 44 },\n    { y: '__other__', x: 1635850800000, value: 40 },\n    { y: '__other__', x: 1635861600000, value: 25 },\n    { y: '__other__', x: 1635872400000, value: 8 },\n    { y: '__other__', x: 1635883200000, value: 1 },\n    { y: '__other__', x: 1635894000000, value: 1 },\n    { y: '__other__', x: 1635904800000, value: 4 },\n    { y: '__other__', x: 1635915600000, value: 13 },\n    { y: '__other__', x: 1635926400000, value: 36 },\n    { y: '__other__', x: 1635937200000, value: 35 },\n    { y: '__other__', x: 1635948000000, value: 33 },\n    { y: '__other__', x: 1635958800000, value: 12 },\n    { y: '__other__', x: 1635969600000, value: 1 },\n  ],\n};\n\n/** @internal */\nexport const DATA_3: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'h', value: 12 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    { x: 1635588000000, y: 'a', value: 1 },\n    { x: 1635631200000, y: 'a', value: 2 },\n    { x: 1635678000000, y: 'a', value: 3 },\n    { x: 1635721200000, y: 'a', value: 4 },\n    { x: 1635764400000, y: 'a', value: 5 },\n  ],\n};\n\n/** @internal */\nexport const DATA_4: HeatmapDataSets = {\n  interval: { type: 'calendar', unit: 'w', value: 1 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('dd/MM HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    { x: 1634508000000, y: 'CN', value: 43 },\n    { x: 1635112800000, y: 'CN', value: 330 },\n    { x: 1635721200000, y: 'CN', value: 155 },\n    { x: 1634508000000, y: 'IN', value: 41 },\n    { x: 1635112800000, y: 'IN', value: 261 },\n    { x: 1635721200000, y: 'IN', value: 115 },\n    { x: 1634508000000, y: 'US', value: 20 },\n    { x: 1635112800000, y: 'US', value: 123 },\n    { x: 1635721200000, y: 'US', value: 53 },\n    { x: 1634508000000, y: '__other__', value: 145 },\n    { x: 1635112800000, y: '__other__', value: 902 },\n    { x: 1635721200000, y: '__other__', value: 448 },\n  ],\n};\n\n/** @internal */\nexport const DATA_5: HeatmapDataSets = {\n  domain: { min: 1635984000000, max: 1636002000000 },\n  interval: { type: 'calendar', unit: 'h', value: 1 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  data: [\n    { x: 1635984000000, y: 'sample_web_logs', value: 4202 },\n    { x: 1635987600000, y: 'sample_web_logs', value: 0 },\n    { x: 1635994800000, y: 'sample_web_logs', value: 5808 },\n    { x: 1635998400000, y: 'sample_web_logs', value: 4629 },\n  ],\n};\n\n/** @internal */\nexport const DATA_6: HeatmapDataSets = {\n  interval: { type: 'fixed', value: 30, unit: 'm' },\n  timeZone: 'UTC',\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'UTC' });\n  },\n  data: [\n    {\n      x: 1572847200000,\n      y: 'i-71a7f77b',\n      value: 0,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-71a7f77b',\n      value: 3,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-71a7f77b',\n      value: 25,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-71a7f77b',\n      value: 50,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-71a7f77b',\n      value: 75,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-71a7f77b',\n      value: 1,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-71a7f77b',\n      value: 2,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-71a7f77b',\n      value: 24,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-71a7f77b',\n      value: 49,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-71a7f77b',\n      value: 74,\n    },\n    {\n      x: 1572908400000,\n      y: 'i-71a7f77b',\n      value: 0.07397995823713518,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-71a7f77b',\n      value: 0.03091943662761636,\n    },\n    {\n      x: 1572836400000,\n      y: 'i-5d303091',\n      value: 0.08552883,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-5d303091',\n      value: 93.72707,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-5d303091',\n      value: 50.42717,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-5d303091',\n      value: 2.397241548271217,\n    },\n    {\n      x: 1572879600000,\n      y: 'i-9f07c700',\n      value: 76.10974,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-9f07c700',\n      value: 90.75613,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-9f07c700',\n      value: 28.016079894074096,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-9f07c700',\n      value: 2.1780847014803517,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-9f07c700',\n      value: 0.02531410357696053,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-9f07c700',\n      value: 2.258382748340588,\n    },\n    {\n      x: 1572849000000,\n      y: 'i-d17dcd4c',\n      value: 4.210354,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-d17dcd4c',\n      value: 89.6491,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-d17dcd4c',\n      value: 21.289199095933952,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-d17dcd4c',\n      value: 2.6694704470251565,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-d17dcd4c',\n      value: 0.5850535152380327,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-d17dcd4c',\n      value: 65.51073,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-d17dcd4c',\n      value: 0.792024488699497,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-d17dcd4c',\n      value: 0.5615131943374475,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-d17dcd4c',\n      value: 0.394169564717292,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-d17dcd4c',\n      value: 0.2046931978696015,\n    },\n    {\n      x: 1572908400000,\n      y: 'i-d17dcd4c',\n      value: 0.15470219555712722,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-d17dcd4c',\n      value: 0.11787869182904363,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-37fbfb39',\n      value: 83.92723,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-37fbfb39',\n      value: 21.49062,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-37fbfb39',\n      value: 0.5619960991147903,\n    },\n    {\n      x: 1572847200000,\n      y: 'i-b118880c',\n      value: 0.7038798,\n    },\n    {\n      x: 1572849000000,\n      y: 'i-b118880c',\n      value: 8.885096,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-b118880c',\n      value: 81.92052,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-b118880c',\n      value: 6.385433818669964,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-b118880c',\n      value: 0.7529454579485226,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-b118880c',\n      value: 0.16135425990161706,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-b118880c',\n      value: 32.23389,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-b118880c',\n      value: 0.7578572100943552,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-b118880c',\n      value: 0.6111162033658646,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-b118880c',\n      value: 0.443324186956941,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-b118880c',\n      value: 0.3075144354570065,\n    },\n    {\n      x: 1572908400000,\n      y: 'i-b118880c',\n      value: 0.18905638316915416,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-b118880c',\n      value: 0.15234682243112949,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-66578749',\n      value: 60.28918,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-66578749',\n      value: 67.31324,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-66578749',\n      value: 81.34977,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-66578749',\n      value: 48.25439,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-66578749',\n      value: 31.06416,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-66578749',\n      value: 3.0462498034282,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-66578749',\n      value: 0.23590009859709954,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-66578749',\n      value: 59.04865,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-66578749',\n      value: 0.9189229698167014,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-66578749',\n      value: 0.3479760519757592,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-66578749',\n      value: 0.09983690866310621,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-66578749',\n      value: 0.026896391677229674,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-5d302081',\n      value: 79.62794,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-5d302081',\n      value: 38.70934,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-5d302081',\n      value: 2.3953009901171605,\n    },\n    {\n      x: 1572849000000,\n      y: 'i-ef74d410',\n      value: 0.1538905,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-ef74d410',\n      value: 77.86751,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-ef74d410',\n      value: 7.1111139045789935,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-ef74d410',\n      value: 0.07120867159413205,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-ef74d410',\n      value: 0.46005659357549517,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-ef74d410',\n      value: 0.38022323217471177,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-ef74d410',\n      value: 0.05279469228246696,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-ef74d410',\n      value: 0.04307715617784296,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-3b3565e0',\n      value: 49.34176,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-3b3565e0',\n      value: 74.35002,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-3b3565e0',\n      value: 70.82227,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-3b3565e0',\n      value: 1.129179725764338,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-3b3565e0',\n      value: 0.08944716315823782,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-3b3565e0',\n      value: 0.025215653478830508,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-7db7c747',\n      value: 56.8998,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-7db7c747',\n      value: 34.59895,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-7db7c747',\n      value: 69.07187,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-7db7c747',\n      value: 20.04246,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-7db7c747',\n      value: 0.501246678069153,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-7db7c747',\n      value: 0.10228357345625516,\n    },\n    {\n      x: 1572858000000,\n      y: 'i-8270d519',\n      value: 23.41472,\n    },\n    {\n      x: 1572870600000,\n      y: 'i-8270d519',\n      value: 0.09778774,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-8270d519',\n      value: 57.96897,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-8270d519',\n      value: 63.73998,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-8270d519',\n      value: 45.19735,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-8270d519',\n      value: 2.166846374797418,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-8270d519',\n      value: 0.2283247569954898,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-8270d519',\n      value: 42.24531,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-8270d519',\n      value: 0.49207037746175214,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-8270d519',\n      value: 0.3243143048875506,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-8270d519',\n      value: 0.10024450293348822,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-8270d519',\n      value: 0.033965805201251434,\n    },\n    {\n      x: 1572847200000,\n      y: 'i-4fefbf6c',\n      value: 0.1867262,\n    },\n    {\n      x: 1572849000000,\n      y: 'i-4fefbf6c',\n      value: 11.47219,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-4fefbf6c',\n      value: 53.59314,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-4fefbf6c',\n      value: 15.91959,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-4fefbf6c',\n      value: 0.5736916311300446,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-4fefbf6c',\n      value: 29.28071,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-4fefbf6c',\n      value: 25.1765,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-4fefbf6c',\n      value: 1.4671989108080628,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-4fefbf6c',\n      value: 0.8367316591855911,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-4fefbf6c',\n      value: 0.48490204846685775,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-4fefbf6c',\n      value: 0.24413767062868427,\n    },\n    {\n      x: 1572908400000,\n      y: 'i-4fefbf6c',\n      value: 0.17736807671463703,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-4fefbf6c',\n      value: 0.10326196476266834,\n    },\n    {\n      x: 1572859800000,\n      y: 'i-16fd8d2a',\n      value: 33.42309,\n    },\n    {\n      x: 1572861600000,\n      y: 'i-16fd8d2a',\n      value: 47.17204,\n    },\n    {\n      x: 1572863400000,\n      y: 'i-16fd8d2a',\n      value: 0.16179846422070132,\n    },\n    {\n      x: 1572847200000,\n      y: 'i-ca80c01a',\n      value: 0.6692097,\n    },\n    {\n      x: 1572870600000,\n      y: 'i-ca80c01a',\n      value: 44.60156,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-ca80c01a',\n      value: 26.06775,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-ca80c01a',\n      value: 0.24539550844649843,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-ca80c01a',\n      value: 0.09130230719255052,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-4a90d021',\n      value: 43.41428,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-4a90d021',\n      value: 20.30829,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-4a90d021',\n      value: 20.706159141229445,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-4ff414ac',\n      value: 42.82781,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-4ff414ac',\n      value: 3.643815188524499,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-4ff414ac',\n      value: 7.987421742621203,\n    },\n    {\n      x: 1572870600000,\n      y: 'i-850643a7',\n      value: 37.51045,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-850643a7',\n      value: 0.08720035850172568,\n    },\n    {\n      x: 1572859800000,\n      y: 'i-c961f137',\n      value: 0.7612613,\n    },\n    {\n      x: 1572861600000,\n      y: 'i-c961f137',\n      value: 36.94459,\n    },\n    {\n      x: 1572863400000,\n      y: 'i-c961f137',\n      value: 3.530620723871948,\n    },\n    {\n      x: 1572874200000,\n      y: 'i-7cdbab5b',\n      value: 3.468401,\n    },\n    {\n      x: 1572876000000,\n      y: 'i-7cdbab5b',\n      value: 15.87705,\n    },\n    {\n      x: 1572877800000,\n      y: 'i-7cdbab5b',\n      value: 21.19452,\n    },\n    {\n      x: 1572879600000,\n      y: 'i-7cdbab5b',\n      value: 22.534,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-7cdbab5b',\n      value: 30.46893,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-7cdbab5b',\n      value: 9.532251,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-7cdbab5b',\n      value: 6.127118137471535,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-7cdbab5b',\n      value: 0.13956047806108005,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-7cdbab5b',\n      value: 0.11986169822285726,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-7cdbab5b',\n      value: 4.098007780030352,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-7cdbab5b',\n      value: 0.6927671145991932,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-7cdbab5b',\n      value: 0.2113142229906149,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-7cdbab5b',\n      value: 0.0823203266441151,\n    },\n  ],\n};\n\n/** @internal */\nexport const DATA_7: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'h', value: 12 },\n  timeZone: 'Europe/Rome',\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('dd/MM HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  data: [\n    {\n      x: 1635026400000,\n      value: 33,\n      y: '',\n    },\n    {\n      x: 1635069600000,\n      value: 59,\n      y: '',\n    },\n    {\n      x: 1635112800000,\n      value: 29,\n      y: '',\n    },\n    {\n      x: 1635156000000,\n      value: 67,\n      y: '',\n    },\n    {\n      x: 1635199200000,\n      value: 27,\n      y: '',\n    },\n    {\n      x: 1635242400000,\n      value: 61,\n      y: '',\n    },\n    {\n      x: 1635285600000,\n      value: 19,\n      y: '',\n    },\n    {\n      x: 1635328800000,\n      value: 71,\n      y: '',\n    },\n    {\n      x: 1635372000000,\n      value: 26,\n      y: '',\n    },\n    {\n      x: 1635415200000,\n      value: 51,\n      y: '',\n    },\n    {\n      x: 1635458400000,\n      value: 30,\n      y: '',\n    },\n    {\n      x: 1635501600000,\n      value: 54,\n      y: '',\n    },\n    {\n      x: 1635544800000,\n      value: 20,\n      y: '',\n    },\n    {\n      x: 1635588000000,\n      value: 59,\n      y: '',\n    },\n    {\n      x: 1635631200000,\n      value: 30,\n      y: '',\n    },\n    {\n      x: 1635678000000,\n      value: 58,\n      y: '',\n    },\n    {\n      x: 1635721200000,\n      value: 34,\n      y: '',\n    },\n    {\n      x: 1635764400000,\n      value: 58,\n      y: '',\n    },\n    {\n      x: 1635807600000,\n      value: 41,\n      y: '',\n    },\n    {\n      x: 1635850800000,\n      value: 48,\n      y: '',\n    },\n    {\n      x: 1635894000000,\n      value: 37,\n      y: '',\n    },\n    {\n      x: 1635937200000,\n      value: 44,\n      y: '',\n    },\n    {\n      x: 1635980400000,\n      value: 37,\n      y: '',\n    },\n    {\n      x: 1636023600000,\n      value: 62,\n      y: '',\n    },\n    {\n      x: 1636066800000,\n      value: 16,\n      y: '',\n    },\n    {\n      x: 1635026400000,\n      value: 18,\n      y: 'gz',\n    },\n    {\n      x: 1635069600000,\n      value: 37,\n      y: 'gz',\n    },\n    {\n      x: 1635112800000,\n      value: 8,\n      y: 'gz',\n    },\n    {\n      x: 1635156000000,\n      value: 27,\n      y: 'gz',\n    },\n    {\n      x: 1635199200000,\n      value: 13,\n      y: 'gz',\n    },\n    {\n      x: 1635242400000,\n      value: 33,\n      y: 'gz',\n    },\n    {\n      x: 1635285600000,\n      value: 13,\n      y: 'gz',\n    },\n    {\n      x: 1635328800000,\n      value: 22,\n      y: 'gz',\n    },\n    {\n      x: 1635372000000,\n      value: 20,\n      y: 'gz',\n    },\n    {\n      x: 1635415200000,\n      value: 36,\n      y: 'gz',\n    },\n    {\n      x: 1635458400000,\n      value: 12,\n      y: 'gz',\n    },\n    {\n      x: 1635501600000,\n      value: 31,\n      y: 'gz',\n    },\n    {\n      x: 1635544800000,\n      value: 9,\n      y: 'gz',\n    },\n    {\n      x: 1635588000000,\n      value: 29,\n      y: 'gz',\n    },\n    {\n      x: 1635631200000,\n      value: 18,\n      y: 'gz',\n    },\n    {\n      x: 1635678000000,\n      value: 22,\n      y: 'gz',\n    },\n    {\n      x: 1635721200000,\n      value: 15,\n      y: 'gz',\n    },\n    {\n      x: 1635764400000,\n      value: 25,\n      y: 'gz',\n    },\n    {\n      x: 1635807600000,\n      value: 12,\n      y: 'gz',\n    },\n    {\n      x: 1635850800000,\n      value: 25,\n      y: 'gz',\n    },\n    {\n      x: 1635894000000,\n      value: 16,\n      y: 'gz',\n    },\n    {\n      x: 1635937200000,\n      value: 28,\n      y: 'gz',\n    },\n    {\n      x: 1635980400000,\n      value: 12,\n      y: 'gz',\n    },\n    {\n      x: 1636023600000,\n      value: 20,\n      y: 'gz',\n    },\n    {\n      x: 1636066800000,\n      value: 10,\n      y: 'gz',\n    },\n    {\n      x: 1635026400000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1635069600000,\n      value: 24,\n      y: 'css',\n    },\n    {\n      x: 1635112800000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1635156000000,\n      value: 38,\n      y: 'css',\n    },\n    {\n      x: 1635199200000,\n      value: 11,\n      y: 'css',\n    },\n    {\n      x: 1635242400000,\n      value: 33,\n      y: 'css',\n    },\n    {\n      x: 1635285600000,\n      value: 18,\n      y: 'css',\n    },\n    {\n      x: 1635328800000,\n      value: 18,\n      y: 'css',\n    },\n    {\n      x: 1635372000000,\n      value: 6,\n      y: 'css',\n    },\n    {\n      x: 1635415200000,\n      value: 26,\n      y: 'css',\n    },\n    {\n      x: 1635458400000,\n      value: 8,\n      y: 'css',\n    },\n    {\n      x: 1635501600000,\n      value: 23,\n      y: 'css',\n    },\n    {\n      x: 1635544800000,\n      value: 10,\n      y: 'css',\n    },\n    {\n      x: 1635588000000,\n      value: 28,\n      y: 'css',\n    },\n    {\n      x: 1635631200000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1635678000000,\n      value: 21,\n      y: 'css',\n    },\n    {\n      x: 1635721200000,\n      value: 17,\n      y: 'css',\n    },\n    {\n      x: 1635764400000,\n      value: 19,\n      y: 'css',\n    },\n    {\n      x: 1635807600000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1635850800000,\n      value: 24,\n      y: 'css',\n    },\n    {\n      x: 1635894000000,\n      value: 14,\n      y: 'css',\n    },\n    {\n      x: 1635937200000,\n      value: 26,\n      y: 'css',\n    },\n    {\n      x: 1635980400000,\n      value: 11,\n      y: 'css',\n    },\n    {\n      x: 1636023600000,\n      value: 24,\n      y: 'css',\n    },\n    {\n      x: 1636066800000,\n      value: 14,\n      y: 'css',\n    },\n    {\n      x: 1635026400000,\n      value: 28,\n      y: '__other__',\n    },\n    {\n      x: 1635069600000,\n      value: 41,\n      y: '__other__',\n    },\n    {\n      x: 1635112800000,\n      value: 17,\n      y: '__other__',\n    },\n    {\n      x: 1635156000000,\n      value: 36,\n      y: '__other__',\n    },\n    {\n      x: 1635199200000,\n      value: 16,\n      y: '__other__',\n    },\n    {\n      x: 1635242400000,\n      value: 35,\n      y: '__other__',\n    },\n    {\n      x: 1635285600000,\n      value: 21,\n      y: '__other__',\n    },\n    {\n      x: 1635328800000,\n      value: 55,\n      y: '__other__',\n    },\n    {\n      x: 1635372000000,\n      value: 19,\n      y: '__other__',\n    },\n    {\n      x: 1635415200000,\n      value: 45,\n      y: '__other__',\n    },\n    {\n      x: 1635458400000,\n      value: 23,\n      y: '__other__',\n    },\n    {\n      x: 1635501600000,\n      value: 49,\n      y: '__other__',\n    },\n    {\n      x: 1635544800000,\n      value: 26,\n      y: '__other__',\n    },\n    {\n      x: 1635588000000,\n      value: 49,\n      y: '__other__',\n    },\n    {\n      x: 1635631200000,\n      value: 32,\n      y: '__other__',\n    },\n    {\n      x: 1635678000000,\n      value: 33,\n      y: '__other__',\n    },\n    {\n      x: 1635721200000,\n      value: 25,\n      y: '__other__',\n    },\n    {\n      x: 1635764400000,\n      value: 38,\n      y: '__other__',\n    },\n    {\n      x: 1635807600000,\n      value: 34,\n      y: '__other__',\n    },\n    {\n      x: 1635850800000,\n      value: 29,\n      y: '__other__',\n    },\n    {\n      x: 1635894000000,\n      value: 26,\n      y: '__other__',\n    },\n    {\n      x: 1635937200000,\n      value: 40,\n      y: '__other__',\n    },\n    {\n      x: 1635980400000,\n      value: 22,\n      y: '__other__',\n    },\n    {\n      x: 1636023600000,\n      value: 42,\n      y: '__other__',\n    },\n    {\n      x: 1636066800000,\n      value: 7,\n      y: '__other__',\n    },\n  ],\n};\n\n/** @internal */\nexport const DATA_8: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'm', value: 60 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    {\n      x: 1616799600000,\n      value: 150,\n      y: 'jpg',\n    },\n    {\n      x: 1616803200000,\n      value: 1,\n      y: 'jpg',\n    },\n    {\n      x: 1616806800000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1616810400000,\n      value: 9,\n      y: 'jpg',\n    },\n    {\n      x: 1616814000000,\n      value: 11,\n      y: 'jpg',\n    },\n    {\n      x: 1616817600000,\n      value: 19,\n      y: 'jpg',\n    },\n    {\n      x: 1616821200000,\n      value: 29,\n      y: 'jpg',\n    },\n    {\n      x: 1616824800000,\n      value: 54,\n      y: 'jpg',\n    },\n    {\n      x: 1616828400000,\n      value: 74,\n      y: 'jpg',\n    },\n    {\n      x: 1616832000000,\n      value: 91,\n      y: 'jpg',\n    },\n    {\n      x: 1616835600000,\n      value: 118,\n      y: 'jpg',\n    },\n    {\n      x: 1616839200000,\n      value: 109,\n      y: 'jpg',\n    },\n    {\n      x: 1616842800000,\n      value: 123,\n      y: 'jpg',\n    },\n    {\n      x: 1616846400000,\n      value: 97,\n      y: 'jpg',\n    },\n    {\n      x: 1616850000000,\n      value: 87,\n      y: 'jpg',\n    },\n    {\n      x: 1616853600000,\n      value: 83,\n      y: 'jpg',\n    },\n    {\n      x: 1616857200000,\n      value: 48,\n      y: 'jpg',\n    },\n    {\n      x: 1616860800000,\n      value: 35,\n      y: 'jpg',\n    },\n    {\n      x: 1616864400000,\n      value: 30,\n      y: 'jpg',\n    },\n    {\n      x: 1616868000000,\n      value: 8,\n      y: 'jpg',\n    },\n    {\n      x: 1616871600000,\n      value: 8,\n      y: 'jpg',\n    },\n    {\n      x: 1616875200000,\n      value: 5,\n      y: 'jpg',\n    },\n    {\n      x: 1616878800000,\n      value: 5,\n      y: 'jpg',\n    },\n    {\n      x: 1616882400000,\n      value: 3,\n      y: 'jpg',\n    },\n    {\n      x: 1616886000000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1616889600000,\n      value: 0,\n      y: 'jpg',\n    },\n    {\n      x: 1616893200000,\n      value: 19,\n      y: 'jpg',\n    },\n    {\n      x: 1616896800000,\n      value: 16,\n      y: 'jpg',\n    },\n    {\n      x: 1616900400000,\n      value: 20,\n      y: 'jpg',\n    },\n    {\n      x: 1616904000000,\n      value: 45,\n      y: 'jpg',\n    },\n    {\n      x: 1616907600000,\n      value: 33,\n      y: 'jpg',\n    },\n    {\n      x: 1616911200000,\n      value: 84,\n      y: 'jpg',\n    },\n    {\n      x: 1616914800000,\n      value: 90,\n      y: 'jpg',\n    },\n    {\n      x: 1616918400000,\n      value: 94,\n      y: 'jpg',\n    },\n    {\n      x: 1616922000000,\n      value: 129,\n      y: 'jpg',\n    },\n    {\n      x: 1616925600000,\n      value: 108,\n      y: 'jpg',\n    },\n    {\n      x: 1616929200000,\n      value: 103,\n      y: 'jpg',\n    },\n    {\n      x: 1616932800000,\n      value: 98,\n      y: 'jpg',\n    },\n    {\n      x: 1616936400000,\n      value: 76,\n      y: 'jpg',\n    },\n    {\n      x: 1616940000000,\n      value: 59,\n      y: 'jpg',\n    },\n    {\n      x: 1616943600000,\n      value: 45,\n      y: 'jpg',\n    },\n    {\n      x: 1616947200000,\n      value: 30,\n      y: 'jpg',\n    },\n    {\n      x: 1616950800000,\n      value: 11,\n      y: 'jpg',\n    },\n    {\n      x: 1616954400000,\n      value: 12,\n      y: 'jpg',\n    },\n    {\n      x: 1616958000000,\n      value: 7,\n      y: 'jpg',\n    },\n    {\n      x: 1616961600000,\n      value: 1,\n      y: 'jpg',\n    },\n    {\n      x: 1616965200000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1616968800000,\n      value: 1,\n      y: 'jpg',\n    },\n    {\n      x: 1616972400000,\n      value: 3,\n      y: 'jpg',\n    },\n    {\n      x: 1616976000000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1616979600000,\n      value: 9,\n      y: 'jpg',\n    },\n    {\n      x: 1616983200000,\n      value: 9,\n      y: 'jpg',\n    },\n    {\n      x: 1616986800000,\n      value: 30,\n      y: 'jpg',\n    },\n    {\n      x: 1616990400000,\n      value: 28,\n      y: 'jpg',\n    },\n    {\n      x: 1616994000000,\n      value: 71,\n      y: 'jpg',\n    },\n    {\n      x: 1616997600000,\n      value: 89,\n      y: 'jpg',\n    },\n    {\n      x: 1617001200000,\n      value: 78,\n      y: 'jpg',\n    },\n    {\n      x: 1617004800000,\n      value: 109,\n      y: 'jpg',\n    },\n    {\n      x: 1617008400000,\n      value: 106,\n      y: 'jpg',\n    },\n    {\n      x: 1617012000000,\n      value: 131,\n      y: 'jpg',\n    },\n    {\n      x: 1617015600000,\n      value: 100,\n      y: 'jpg',\n    },\n    {\n      x: 1617019200000,\n      value: 93,\n      y: 'jpg',\n    },\n    {\n      x: 1617022800000,\n      value: 67,\n      y: 'jpg',\n    },\n    {\n      x: 1617026400000,\n      value: 52,\n      y: 'jpg',\n    },\n    {\n      x: 1617030000000,\n      value: 46,\n      y: 'jpg',\n    },\n    {\n      x: 1617033600000,\n      value: 24,\n      y: 'jpg',\n    },\n    {\n      x: 1617037200000,\n      value: 13,\n      y: 'jpg',\n    },\n    {\n      x: 1617040800000,\n      value: 4,\n      y: 'jpg',\n    },\n    {\n      x: 1617044400000,\n      value: 5,\n      y: 'jpg',\n    },\n    {\n      x: 1617048000000,\n      value: 0,\n      y: 'jpg',\n    },\n    {\n      x: 1617051600000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1617055200000,\n      value: 150,\n      y: 'jpg',\n    },\n    {\n      x: 1616810400000,\n      value: 2,\n      y: 'css',\n    },\n    {\n      x: 1616814000000,\n      value: 5,\n      y: 'css',\n    },\n    {\n      x: 1616817600000,\n      value: 5,\n      y: 'css',\n    },\n    {\n      x: 1616821200000,\n      value: 8,\n      y: 'css',\n    },\n    {\n      x: 1616824800000,\n      value: 15,\n      y: 'css',\n    },\n    {\n      x: 1616828400000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1616832000000,\n      value: 31,\n      y: 'css',\n    },\n    {\n      x: 1616835600000,\n      value: 22,\n      y: 'css',\n    },\n    {\n      x: 1616839200000,\n      value: 26,\n      y: 'css',\n    },\n    {\n      x: 1616842800000,\n      value: 32,\n      y: 'css',\n    },\n    {\n      x: 1616846400000,\n      value: 20,\n      y: 'css',\n    },\n    {\n      x: 1616850000000,\n      value: 20,\n      y: 'css',\n    },\n    {\n      x: 1616853600000,\n      value: 19,\n      y: 'css',\n    },\n    {\n      x: 1616857200000,\n      value: 11,\n      y: 'css',\n    },\n    {\n      x: 1616860800000,\n      value: 10,\n      y: 'css',\n    },\n    {\n      x: 1616864400000,\n      value: 6,\n      y: 'css',\n    },\n    {\n      x: 1616868000000,\n      value: 2,\n      y: 'css',\n    },\n    {\n      x: 1616871600000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616875200000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616878800000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616882400000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616886000000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616889600000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616893200000,\n      value: 2,\n      y: 'css',\n    },\n    {\n      x: 1616896800000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616900400000,\n      value: 7,\n      y: 'css',\n    },\n    {\n      x: 1616904000000,\n      value: 7,\n      y: 'css',\n    },\n    {\n      x: 1616907600000,\n      value: 23,\n      y: 'css',\n    },\n    {\n      x: 1616911200000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1616914800000,\n      value: 19,\n      y: 'css',\n    },\n    {\n      x: 1616918400000,\n      value: 27,\n      y: 'css',\n    },\n    {\n      x: 1616922000000,\n      value: 34,\n      y: 'css',\n    },\n    {\n      x: 1616925600000,\n      value: 24,\n      y: 'css',\n    },\n    {\n      x: 1616929200000,\n      value: 22,\n      y: 'css',\n    },\n    {\n      x: 1616932800000,\n      value: 23,\n      y: 'css',\n    },\n    {\n      x: 1616936400000,\n      value: 23,\n      y: 'css',\n    },\n    {\n      x: 1616940000000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1616943600000,\n      value: 7,\n      y: 'css',\n    },\n    {\n      x: 1616947200000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1616950800000,\n      value: 2,\n      y: 'css',\n    },\n    {\n      x: 1616954400000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616958000000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616961600000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616965200000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616968800000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616972400000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616976000000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616979600000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616983200000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616986800000,\n      value: 5,\n      y: 'css',\n    },\n    {\n      x: 1616990400000,\n      value: 13,\n      y: 'css',\n    },\n    {\n      x: 1616994000000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1616997600000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1617001200000,\n      value: 25,\n      y: 'css',\n    },\n    {\n      x: 1617004800000,\n      value: 26,\n      y: 'css',\n    },\n    {\n      x: 1617008400000,\n      value: 36,\n      y: 'css',\n    },\n    {\n      x: 1617012000000,\n      value: 27,\n      y: 'css',\n    },\n    {\n      x: 1617015600000,\n      value: 29,\n      y: 'css',\n    },\n    {\n      x: 1617019200000,\n      value: 20,\n      y: 'css',\n    },\n    {\n      x: 1617022800000,\n      value: 25,\n      y: 'css',\n    },\n    {\n      x: 1617026400000,\n      value: 14,\n      y: 'css',\n    },\n    {\n      x: 1617030000000,\n      value: 10,\n      y: 'css',\n    },\n    {\n      x: 1617033600000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1617037200000,\n      value: 5,\n      y: 'css',\n    },\n    {\n      x: 1617040800000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1617044400000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1617048000000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616799600000,\n      value: 3,\n      y: 'png',\n    },\n    {\n      x: 1616803200000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616806800000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616810400000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616814000000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616817600000,\n      value: 5,\n      y: 'png',\n    },\n    {\n      x: 1616821200000,\n      value: 6,\n      y: 'png',\n    },\n    {\n      x: 1616824800000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1616828400000,\n      value: 12,\n      y: 'png',\n    },\n    {\n      x: 1616832000000,\n      value: 21,\n      y: 'png',\n    },\n    {\n      x: 1616835600000,\n      value: 11,\n      y: 'png',\n    },\n    {\n      x: 1616839200000,\n      value: 15,\n      y: 'png',\n    },\n    {\n      x: 1616842800000,\n      value: 25,\n      y: 'png',\n    },\n    {\n      x: 1616846400000,\n      value: 14,\n      y: 'png',\n    },\n    {\n      x: 1616850000000,\n      value: 17,\n      y: 'png',\n    },\n    {\n      x: 1616853600000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1616857200000,\n      value: 8,\n      y: 'png',\n    },\n    {\n      x: 1616860800000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1616864400000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616868000000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616871600000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616875200000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616878800000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616882400000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616886000000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616889600000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616893200000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616896800000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616900400000,\n      value: 3,\n      y: 'png',\n    },\n    {\n      x: 1616904000000,\n      value: 5,\n      y: 'png',\n    },\n    {\n      x: 1616907600000,\n      value: 8,\n      y: 'png',\n    },\n    {\n      x: 1616911200000,\n      value: 9,\n      y: 'png',\n    },\n    {\n      x: 1616914800000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1616918400000,\n      value: 24,\n      y: 'png',\n    },\n    {\n      x: 1616922000000,\n      value: 22,\n      y: 'png',\n    },\n    {\n      x: 1616925600000,\n      value: 19,\n      y: 'png',\n    },\n    {\n      x: 1616929200000,\n      value: 19,\n      y: 'png',\n    },\n    {\n      x: 1616932800000,\n      value: 12,\n      y: 'png',\n    },\n    {\n      x: 1616936400000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1616940000000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1616943600000,\n      value: 3,\n      y: 'png',\n    },\n    {\n      x: 1616947200000,\n      value: 4,\n      y: 'png',\n    },\n    {\n      x: 1616950800000,\n      value: 3,\n      y: 'png',\n    },\n    {\n      x: 1616954400000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616958000000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616961600000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616965200000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616968800000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616972400000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616976000000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616979600000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616983200000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616986800000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616990400000,\n      value: 4,\n      y: 'png',\n    },\n    {\n      x: 1616994000000,\n      value: 8,\n      y: 'png',\n    },\n    {\n      x: 1616997600000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1617001200000,\n      value: 17,\n      y: 'png',\n    },\n    {\n      x: 1617004800000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1617008400000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1617012000000,\n      value: 24,\n      y: 'png',\n    },\n    {\n      x: 1617015600000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1617019200000,\n      value: 17,\n      y: 'png',\n    },\n    {\n      x: 1617022800000,\n      value: 11,\n      y: 'png',\n    },\n    {\n      x: 1617026400000,\n      value: 10,\n      y: 'png',\n    },\n    {\n      x: 1617030000000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1617033600000,\n      value: 6,\n      y: 'png',\n    },\n    {\n      x: 1617037200000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616810400000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616814000000,\n      value: 3,\n      y: '__other__',\n    },\n    {\n      x: 1616817600000,\n      value: 2,\n      y: '__other__',\n    },\n    {\n      x: 1616821200000,\n      value: 3,\n      y: '__other__',\n    },\n    {\n      x: 1616824800000,\n      value: 6,\n      y: '__other__',\n    },\n    {\n      x: 1616828400000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1616832000000,\n      value: 19,\n      y: '__other__',\n    },\n    {\n      x: 1616835600000,\n      value: 21,\n      y: '__other__',\n    },\n    {\n      x: 1616839200000,\n      value: 18,\n      y: '__other__',\n    },\n    {\n      x: 1616842800000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1616846400000,\n      value: 17,\n      y: '__other__',\n    },\n    {\n      x: 1616850000000,\n      value: 16,\n      y: '__other__',\n    },\n    {\n      x: 1616853600000,\n      value: 17,\n      y: '__other__',\n    },\n    {\n      x: 1616857200000,\n      value: 13,\n      y: '__other__',\n    },\n    {\n      x: 1616860800000,\n      value: 4,\n      y: '__other__',\n    },\n    {\n      x: 1616864400000,\n      value: 6,\n      y: '__other__',\n    },\n    {\n      x: 1616868000000,\n      value: 4,\n      y: '__other__',\n    },\n    {\n      x: 1616871600000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616875200000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616878800000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616882400000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616886000000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616889600000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616893200000,\n      value: 3,\n      y: '__other__',\n    },\n    {\n      x: 1616896800000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616900400000,\n      value: 3,\n      y: '__other__',\n    },\n    {\n      x: 1616904000000,\n      value: 5,\n      y: '__other__',\n    },\n    {\n      x: 1616907600000,\n      value: 9,\n      y: '__other__',\n    },\n    {\n      x: 1616911200000,\n      value: 9,\n      y: '__other__',\n    },\n    {\n      x: 1616914800000,\n      value: 13,\n      y: '__other__',\n    },\n    {\n      x: 1616918400000,\n      value: 13,\n      y: '__other__',\n    },\n    {\n      x: 1616922000000,\n      value: 26,\n      y: '__other__',\n    },\n    {\n      x: 1616925600000,\n      value: 23,\n      y: '__other__',\n    },\n    {\n      x: 1616929200000,\n      value: 15,\n      y: '__other__',\n    },\n    {\n      x: 1616932800000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1616936400000,\n      value: 14,\n      y: '__other__',\n    },\n    {\n      x: 1616940000000,\n      value: 9,\n      y: '__other__',\n    },\n    {\n      x: 1616943600000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616947200000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616950800000,\n      value: 4,\n      y: '__other__',\n    },\n    {\n      x: 1616954400000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616958000000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616961600000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616965200000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616968800000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616972400000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616976000000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616979600000,\n      value: 2,\n      y: '__other__',\n    },\n    {\n      x: 1616983200000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616986800000,\n      value: 5,\n      y: '__other__',\n    },\n    {\n      x: 1616990400000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616994000000,\n      value: 10,\n      y: '__other__',\n    },\n    {\n      x: 1616997600000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1617001200000,\n      value: 16,\n      y: '__other__',\n    },\n    {\n      x: 1617004800000,\n      value: 14,\n      y: '__other__',\n    },\n    {\n      x: 1617008400000,\n      value: 17,\n      y: '__other__',\n    },\n    {\n      x: 1617012000000,\n      value: 18,\n      y: '__other__',\n    },\n    {\n      x: 1617015600000,\n      value: 12,\n      y: '__other__',\n    },\n    {\n      x: 1617019200000,\n      value: 12,\n      y: '__other__',\n    },\n    {\n      x: 1617022800000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1617026400000,\n      value: 8,\n      y: '__other__',\n    },\n    {\n      x: 1617030000000,\n      value: 9,\n      y: '__other__',\n    },\n    {\n      x: 1617033600000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1617037200000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1617040800000,\n      value: 2,\n      y: '__other__',\n    },\n    {\n      x: 1617044400000,\n      value: 1,\n      y: '__other__',\n    },\n  ],\n};\n\n/** @internal */\nexport const DATA_9: HeatmapDataSets = {\n  // adding 6 hours to the max to include the last data interval that belongs to the max + 60m bucket\n  domain: { min: 1616799600000 - 5 * 60 * 60 * 1000, max: 1617055200000 + 6 * 60 * 60 * 1000 },\n  interval: { type: 'fixed', unit: 'm', value: 60 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: DATA_8.data,\n};\n\n/** @internal */\nexport const ECOMMERCE_DATA = [\n  {\n    x: 'Tigress Haute Couture Haute Couture',\n    y: 'Dress',\n    value: 816,\n  },\n  {\n    x: 'Tigress Haute Couture Haute Couture',\n    y: 'Shoes',\n    value: 556,\n  },\n  {\n    x: 'Tigress Haute Couture Haute Couture',\n    y: 'Shirts',\n    value: 395,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'T-Shirts',\n    value: 1125,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'Sweaters',\n    value: 595,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'Pullovers',\n    value: 355,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'Shoes',\n    value: 233,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'Dress',\n    value: 136,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'T-Shirts',\n    value: 1242,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'Sweaters',\n    value: 528,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'Jumper',\n    value: 2338,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'Shirts',\n    value: 46,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'Dress',\n    value: 1,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'T-Shirts',\n    value: 600,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Dress',\n    value: 418,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Cardigans',\n    value: 286,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Jumpsuit',\n    value: 123,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Sweaters',\n    value: 258,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Shirts',\n    value: 239,\n  },\n  {\n    x: 'Pyramidustries Young Moda',\n    y: 'Dress',\n    value: 747,\n  },\n  {\n    x: 'Pyramidustries Young Moda',\n    y: 'Shoes',\n    value: 425,\n  },\n  {\n    x: 'Pyramidustries Young Moda',\n    y: 'Shirts',\n    value: 377,\n  },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const KIBANA_METRICS = {\n  metrics: {\n    kibana_os_load: {\n      /**\n       * Variant 1 - Load average over the last minute\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.os.load.1m',\n          metricAgg: 'max',\n          label: '1m',\n          title: 'System Load',\n          description: 'Load average over the last minute.',\n          units: '',\n          format: '0,0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 8.3203125],\n          [1551438030000, 7.9140625],\n          [1551438060000, 7.8671875],\n          [1551438090000, 7.125],\n          [1551438120000, 8.765625],\n          [1551438150000, 11.546875],\n          [1551438180000, 12.984375],\n          [1551438210000, 13.546875],\n          [1551438240000, 13.390625],\n          [1551438270000, 11.5625],\n          [1551438300000, 11.5859375],\n          [1551438330000, 10.0546875],\n          [1551438360000, 9.921875],\n          [1551438390000, 9.4921875],\n          [1551438420000, 9.78125],\n          [1551438450000, 10.046875],\n          [1551438480000, 14.0546875],\n          [1551438510000, 10.640625],\n          [1551438540000, 8.2421875],\n          [1551438570000, 8.5],\n          [1551438600000, 7.2578125],\n          [1551438630000, 8.515625],\n          [1551438660000, 10.796875],\n          [1551438690000, 11.125],\n          [1551438720000, 21.40625],\n          [1551438750000, 17.921875],\n          [1551438780000, 26.640625],\n          [1551438810000, 31.390625],\n          [1551438840000, 23.953125],\n          [1551438870000, 16],\n          [1551438900000, 11.9765625],\n          [1551438930000, 9.1640625],\n          [1551438960000, 7.98046875],\n          [1551438990000, 7.1640625],\n          [1551439020000, 7.39453125],\n          [1551439050000, 5.68359375],\n          [1551439080000, 4.95703125],\n          [1551439110000, 4.26171875],\n          [1551439140000, 11.1171875],\n          [1551439170000, 10.8515625],\n          [1551439200000, 12.6171875],\n          [1551439230000, 11.1171875],\n          [1551439260000, 11.6640625],\n          [1551439290000, 11.109375],\n          [1551439320000, 10.6015625],\n          [1551439350000, 11.21875],\n          [1551439380000, 13.53125],\n          [1551439410000, 15.4609375],\n          [1551439440000, 15.1796875],\n          [1551439470000, 11.984375],\n          [1551439500000, 24.8125],\n          [1551439530000, 21.46875],\n          [1551439560000, 14.484375],\n          [1551439590000, 9.9609375],\n          [1551439620000, 10.8515625],\n          [1551439650000, 12.1171875],\n          [1551439680000, 19.375],\n          [1551439710000, 20.609375],\n          [1551439740000, 16.484375],\n          [1551439770000, 15.515625],\n          [1551439800000, 14.9140625],\n          [1551439830000, 10.8828125],\n          [1551439860000, 9.7578125],\n          [1551439890000, 8.625],\n          [1551439920000, 9.21875],\n          [1551439950000, 8.5390625],\n          [1551439980000, 8.40625],\n          [1551440010000, 6.671875],\n          [1551440040000, 7.24609375],\n          [1551440070000, 7.1015625],\n          [1551440100000, 7.09375],\n          [1551440130000, 10.8125],\n          [1551440160000, 10.90625],\n          [1551440190000, 12.453125],\n          [1551440220000, 11.8984375],\n          [1551440250000, 10.875],\n          [1551440280000, 12.4140625],\n          [1551440310000, 12.78125],\n          [1551440340000, 34.28125],\n          [1551440370000, 29.84375],\n          [1551440400000, 22.40625],\n          [1551440430000, 16.046875],\n          [1551440460000, 12.6328125],\n          [1551440490000, 8.8125],\n          [1551440520000, 6.93359375],\n          [1551440550000, 6.12890625],\n          [1551440580000, 5.69921875],\n          [1551440610000, 5.48828125],\n          [1551440640000, 12.0234375],\n          [1551440670000, 14.484375],\n          [1551440700000, 12.890625],\n          [1551440730000, 11.578125],\n          [1551440760000, 10.7578125],\n          [1551440790000, 9.921875],\n          [1551440820000, 10.5078125],\n          [1551440850000, 11.375],\n          [1551440880000, 15.890625],\n          [1551440910000, 14.1953125],\n          [1551440940000, 11.625],\n          [1551440970000, 11.734375],\n          [1551441000000, 10.1640625],\n          [1551441030000, 9.296875],\n          [1551441060000, 7.5546875],\n          [1551441090000, 7.17578125],\n          [1551441120000, 5.8671875],\n          [1551441150000, 6.828125],\n          [1551441180000, 10.578125],\n          [1551441210000, 16.140625],\n          [1551441240000, 15.640625],\n          [1551441270000, 13.1484375],\n          [1551441300000, 11.9140625],\n          [1551441330000, 10.0625],\n          [1551441360000, 7.66015625],\n          [1551441390000, 9.0078125],\n          [1551441420000, 8.78125],\n          [1551441450000, 8.0390625],\n          [1551441480000, 25.515625],\n          [1551441510000, 18.640625],\n          [1551441540000, 13.1953125],\n          [1551441570000, 10.1953125],\n        ] as [number, number][],\n      },\n      /**\n       * Variant 2 - Load average over the last 5 minutes\n       */\n      v2: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.os.load.5m',\n          metricAgg: 'max',\n          label: '5m',\n          title: 'System Load',\n          description: 'Load average over the last 5 minutes.',\n          units: '',\n          format: '0,0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 9.984375],\n          [1551438030000, 9.71875],\n          [1551438060000, 9.28125],\n          [1551438090000, 9.078125],\n          [1551438120000, 8.9921875],\n          [1551438150000, 9.640625],\n          [1551438180000, 10.171875],\n          [1551438210000, 10.421875],\n          [1551438240000, 10.625],\n          [1551438270000, 10.390625],\n          [1551438300000, 10.4296875],\n          [1551438330000, 10.1328125],\n          [1551438360000, 9.984375],\n          [1551438390000, 9.8203125],\n          [1551438420000, 9.8125],\n          [1551438450000, 9.78125],\n          [1551438480000, 10.625],\n          [1551438510000, 10.09375],\n          [1551438540000, 9.5546875],\n          [1551438570000, 9.390625],\n          [1551438600000, 9.015625],\n          [1551438630000, 8.8828125],\n          [1551438660000, 9.359375],\n          [1551438690000, 9.53125],\n          [1551438720000, 11.9453125],\n          [1551438750000, 11.828125],\n          [1551438780000, 14.4609375],\n          [1551438810000, 16.421875],\n          [1551438840000, 15.6875],\n          [1551438870000, 14.5625],\n          [1551438900000, 13.75],\n          [1551438930000, 12.8359375],\n          [1551438960000, 12.2109375],\n          [1551438990000, 11.6328125],\n          [1551439020000, 11.015625],\n          [1551439050000, 10.3828125],\n          [1551439080000, 9.7421875],\n          [1551439110000, 9.046875],\n          [1551439140000, 9.921875],\n          [1551439170000, 9.890625],\n          [1551439200000, 10.34375],\n          [1551439230000, 10.140625],\n          [1551439260000, 10.3515625],\n          [1551439290000, 10.28125],\n          [1551439320000, 10.203125],\n          [1551439350000, 10.296875],\n          [1551439380000, 10.875],\n          [1551439410000, 11.4765625],\n          [1551439440000, 11.484375],\n          [1551439470000, 11.046875],\n          [1551439500000, 13.53125],\n          [1551439530000, 13.1875],\n          [1551439560000, 12.3046875],\n          [1551439590000, 11.3984375],\n          [1551439620000, 11.1328125],\n          [1551439650000, 11.390625],\n          [1551439680000, 13.3046875],\n          [1551439710000, 13.71875],\n          [1551439740000, 13.3671875],\n          [1551439770000, 13.4296875],\n          [1551439800000, 13.3359375],\n          [1551439830000, 12.4765625],\n          [1551439860000, 12.09375],\n          [1551439890000, 11.4765625],\n          [1551439920000, 11.328125],\n          [1551439950000, 10.8984375],\n          [1551439980000, 10.7109375],\n          [1551440010000, 10.0546875],\n          [1551440040000, 9.6328125],\n          [1551440070000, 9.34375],\n          [1551440100000, 9.1953125],\n          [1551440130000, 9.6328125],\n          [1551440160000, 9.7109375],\n          [1551440190000, 10.1171875],\n          [1551440220000, 10.171875],\n          [1551440250000, 10.0546875],\n          [1551440280000, 10.4140625],\n          [1551440310000, 10.5234375],\n          [1551440340000, 15.140625],\n          [1551440370000, 14.90625],\n          [1551440400000, 14.4921875],\n          [1551440430000, 13.65625],\n          [1551440460000, 13.0390625],\n          [1551440490000, 12.09375],\n          [1551440520000, 11.3125],\n          [1551440550000, 10.7265625],\n          [1551440580000, 10.1640625],\n          [1551440610000, 9.4453125],\n          [1551440640000, 10.546875],\n          [1551440670000, 11.1328125],\n          [1551440700000, 10.96875],\n          [1551440730000, 10.875],\n          [1551440760000, 10.7109375],\n          [1551440790000, 10.453125],\n          [1551440820000, 10.546875],\n          [1551440850000, 10.671875],\n          [1551440880000, 11.78125],\n          [1551440910000, 11.5703125],\n          [1551440940000, 11.1640625],\n          [1551440970000, 11.1875],\n          [1551441000000, 10.8671875],\n          [1551441030000, 10.5390625],\n          [1551441060000, 10.03125],\n          [1551441090000, 9.6640625],\n          [1551441120000, 9.0859375],\n          [1551441150000, 8.90625],\n          [1551441180000, 9.453125],\n          [1551441210000, 10.7109375],\n          [1551441240000, 10.734375],\n          [1551441270000, 10.6484375],\n          [1551441300000, 10.5234375],\n          [1551441330000, 10.1796875],\n          [1551441360000, 9.546875],\n          [1551441390000, 9.5390625],\n          [1551441420000, 9.3984375],\n          [1551441450000, 9.21875],\n          [1551441480000, 12.671875],\n          [1551441510000, 12.0859375],\n          [1551441540000, 11.375],\n          [1551441570000, 10.84375],\n        ] as [number, number][],\n      },\n      /**\n       * Variant 3 - Load average over the last 15 minutes\n       */\n      v3: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.os.load.15m',\n          metricAgg: 'max',\n          label: '15m',\n          title: 'System Load',\n          description: 'Load average over the last 15 minutes.',\n          units: '',\n          format: '0,0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 10.3359375],\n          [1551438030000, 10.234375],\n          [1551438060000, 10.046875],\n          [1551438090000, 9.9765625],\n          [1551438120000, 9.8828125],\n          [1551438150000, 10.078125],\n          [1551438180000, 10.234375],\n          [1551438210000, 10.3125],\n          [1551438240000, 10.3828125],\n          [1551438270000, 10.3046875],\n          [1551438300000, 10.3203125],\n          [1551438330000, 10.21875],\n          [1551438360000, 10.15625],\n          [1551438390000, 10.09375],\n          [1551438420000, 10.0859375],\n          [1551438450000, 10.0546875],\n          [1551438480000, 10.328125],\n          [1551438510000, 10.15625],\n          [1551438540000, 9.9765625],\n          [1551438570000, 9.8984375],\n          [1551438600000, 9.7578125],\n          [1551438630000, 9.65625],\n          [1551438660000, 9.796875],\n          [1551438690000, 9.84375],\n          [1551438720000, 10.640625],\n          [1551438750000, 10.6328125],\n          [1551438780000, 11.578125],\n          [1551438810000, 12.265625],\n          [1551438840000, 12.109375],\n          [1551438870000, 11.84375],\n          [1551438900000, 11.6640625],\n          [1551438930000, 11.421875],\n          [1551438960000, 11.2578125],\n          [1551438990000, 11.1015625],\n          [1551439020000, 10.90625],\n          [1551439050000, 10.703125],\n          [1551439080000, 10.4765625],\n          [1551439110000, 10.21875],\n          [1551439140000, 10.4375],\n          [1551439170000, 10.421875],\n          [1551439200000, 10.5390625],\n          [1551439230000, 10.4609375],\n          [1551439260000, 10.5234375],\n          [1551439290000, 10.5],\n          [1551439320000, 10.4609375],\n          [1551439350000, 10.4765625],\n          [1551439380000, 10.65625],\n          [1551439410000, 10.859375],\n          [1551439440000, 10.8671875],\n          [1551439470000, 10.734375],\n          [1551439500000, 11.5390625],\n          [1551439530000, 11.4453125],\n          [1551439560000, 11.203125],\n          [1551439590000, 10.9375],\n          [1551439620000, 10.859375],\n          [1551439650000, 10.9453125],\n          [1551439680000, 11.609375],\n          [1551439710000, 11.7578125],\n          [1551439740000, 11.703125],\n          [1551439770000, 11.8046875],\n          [1551439800000, 11.78125],\n          [1551439830000, 11.546875],\n          [1551439860000, 11.453125],\n          [1551439890000, 11.265625],\n          [1551439920000, 11.21875],\n          [1551439950000, 11.078125],\n          [1551439980000, 11.0078125],\n          [1551440010000, 10.78125],\n          [1551440040000, 10.6171875],\n          [1551440070000, 10.4921875],\n          [1551440100000, 10.3984375],\n          [1551440130000, 10.4765625],\n          [1551440160000, 10.4765625],\n          [1551440190000, 10.5859375],\n          [1551440220000, 10.5859375],\n          [1551440250000, 10.5390625],\n          [1551440280000, 10.625],\n          [1551440310000, 10.65625],\n          [1551440340000, 12.1328125],\n          [1551440370000, 12.125],\n          [1551440400000, 12.0390625],\n          [1551440430000, 11.8359375],\n          [1551440460000, 11.6875],\n          [1551440490000, 11.4140625],\n          [1551440520000, 11.1796875],\n          [1551440550000, 10.984375],\n          [1551440580000, 10.7890625],\n          [1551440610000, 10.53125],\n          [1551440640000, 10.8359375],\n          [1551440670000, 11.0234375],\n          [1551440700000, 10.96875],\n          [1551440730000, 10.9296875],\n          [1551440760000, 10.875],\n          [1551440790000, 10.7890625],\n          [1551440820000, 10.8046875],\n          [1551440850000, 10.828125],\n          [1551440880000, 11.1875],\n          [1551440910000, 11.125],\n          [1551440940000, 11],\n          [1551440970000, 11.015625],\n          [1551441000000, 10.9140625],\n          [1551441030000, 10.796875],\n          [1551441060000, 10.625],\n          [1551441090000, 10.4765625],\n          [1551441120000, 10.2578125],\n          [1551441150000, 10.1640625],\n          [1551441180000, 10.265625],\n          [1551441210000, 10.6484375],\n          [1551441240000, 10.65625],\n          [1551441270000, 10.625],\n          [1551441300000, 10.5859375],\n          [1551441330000, 10.46875],\n          [1551441360000, 10.2421875],\n          [1551441390000, 10.203125],\n          [1551441420000, 10.140625],\n          [1551441450000, 10.0625],\n          [1551441480000, 11.140625],\n          [1551441510000, 10.9921875],\n          [1551441540000, 10.7890625],\n          [1551441570000, 10.625],\n        ] as [number, number][],\n      },\n    },\n    kibana_average_concurrent_connections: {\n      /**\n       * Variant 1 - Total number of open socket connections to the Kibana instance\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.concurrent_connections',\n          metricAgg: 'max',\n          label: 'HTTP Connections',\n          description: 'Total number of open socket connections to the Kibana instance.',\n          units: '',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 20],\n          [1551438030000, 18],\n          [1551438060000, 21],\n          [1551438090000, 21],\n          [1551438120000, 20],\n          [1551438150000, 19],\n          [1551438180000, 19],\n          [1551438210000, 19],\n          [1551438240000, 21],\n          [1551438270000, 21],\n          [1551438300000, 19],\n          [1551438330000, 21],\n          [1551438360000, 18],\n          [1551438390000, 18],\n          [1551438420000, 19],\n          [1551438450000, 19],\n          [1551438480000, 19],\n          [1551438510000, 19],\n          [1551438540000, 20],\n          [1551438570000, 23],\n          [1551438600000, 19],\n          [1551438630000, 21],\n          [1551438660000, 20],\n          [1551438690000, 19],\n          [1551438720000, 24],\n          [1551438750000, 20],\n          [1551438780000, 20],\n          [1551438810000, 19],\n          [1551438840000, 20],\n          [1551438870000, 21],\n          [1551438900000, 20],\n          [1551438930000, 19],\n          [1551438960000, 21],\n          [1551438990000, 20],\n          [1551439020000, 23],\n          [1551439050000, 18],\n          [1551439080000, 18],\n          [1551439110000, 18],\n          [1551439140000, 18],\n          [1551439170000, 17],\n          [1551439200000, 18],\n          [1551439230000, 19],\n          [1551439260000, 20],\n          [1551439290000, 20],\n          [1551439320000, 18],\n          [1551439350000, 20],\n          [1551439380000, 18],\n          [1551439410000, 20],\n          [1551439440000, 18],\n          [1551439470000, 19],\n          [1551439500000, 17],\n          [1551439530000, 17],\n          [1551439560000, 16],\n          [1551439590000, 15],\n          [1551439620000, 17],\n          [1551439650000, 18],\n          [1551439680000, 19],\n          [1551439710000, 20],\n          [1551439740000, 18],\n          [1551439770000, 21],\n          [1551439800000, 19],\n          [1551439830000, 20],\n          [1551439860000, 19],\n          [1551439890000, 18],\n          [1551439920000, 19],\n          [1551439950000, 19],\n          [1551439980000, 20],\n          [1551440010000, 19],\n          [1551440040000, 19],\n          [1551440070000, 19],\n          [1551440100000, 19],\n          [1551440130000, 17],\n          [1551440160000, 18],\n          [1551440190000, 18],\n          [1551440220000, 21],\n          [1551440250000, 18],\n          [1551440280000, 20],\n          [1551440310000, 17],\n          [1551440340000, 19],\n          [1551440370000, 20],\n          [1551440400000, 20],\n          [1551440430000, 20],\n          [1551440460000, 18],\n          [1551440490000, 16],\n          [1551440520000, 16],\n          [1551440550000, 17],\n          [1551440580000, 18],\n          [1551440610000, 16],\n          [1551440640000, 25],\n          [1551440670000, 16],\n          [1551440700000, 18],\n          [1551440730000, 17],\n          [1551440760000, 19],\n          [1551440790000, 17],\n          [1551440820000, 22],\n          [1551440850000, 20],\n          [1551440880000, 22],\n          [1551440910000, 31],\n          [1551440940000, 18],\n          [1551440970000, 17],\n          [1551441000000, 16],\n          [1551441030000, 17],\n          [1551441060000, 18],\n          [1551441090000, 16],\n          [1551441120000, 14],\n          [1551441150000, 14],\n          [1551441180000, 15],\n          [1551441210000, 19],\n          [1551441240000, 16],\n          [1551441270000, 17],\n          [1551441300000, 16],\n          [1551441330000, 16],\n          [1551441360000, 17],\n          [1551441390000, 18],\n          [1551441420000, 18],\n          [1551441450000, 17],\n          [1551441480000, 17],\n          [1551441510000, 16],\n          [1551441540000, 16],\n          [1551441570000, 17],\n        ] as [number, number][],\n      },\n    },\n    kibana_process_delay: {\n      /**\n       * Variant 1 - Delay in Kibana server event loops\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.process.event_loop_delay',\n          metricAgg: 'max',\n          label: 'Event Loop Delay',\n          description: 'Delay in Kibana server event loops.',\n          units: 'ms',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 1.917205810546875],\n          [1551438030000, 1.7739791870117188],\n          [1551438060000, 2.943075180053711],\n          [1551438090000, 5.207357406616211],\n          [1551438120000, 1.6650104522705078],\n          [1551438150000, 2.154033660888672],\n          [1551438180000, 2.118760108947754],\n          [1551438210000, 3.37868595123291],\n          [1551438240000, 2.1819963455200195],\n          [1551438270000, 2.568490982055664],\n          [1551438300000, 353.22412109375],\n          [1551438330000, 4.138860702514648],\n          [1551438360000, 1.835433006286621],\n          [1551438390000, 1.8117866516113281],\n          [1551438420000, 1.7387809753417969],\n          [1551438450000, 2.006241798400879],\n          [1551438480000, 1.8574104309082031],\n          [1551438510000, 2.101459503173828],\n          [1551438540000, 2.2292041778564453],\n          [1551438570000, 1.8641471862792969],\n          [1551438600000, 2.124319076538086],\n          [1551438630000, 2.1186132431030273],\n          [1551438660000, 1.7360162734985352],\n          [1551438690000, 2.1855764389038086],\n          [1551438720000, 3.210604667663574],\n          [1551438750000, 2.510148048400879],\n          [1551438780000, 1.6755142211914062],\n          [1551438810000, 1.9307565689086914],\n          [1551438840000, 9.354450225830078],\n          [1551438870000, 1.9756240844726562],\n          [1551438900000, 2.2764291763305664],\n          [1551438930000, 346.5954284667969],\n          [1551438960000, 4.56385612487793],\n          [1551438990000, 2.3435449600219727],\n          [1551439020000, 3.8228683471679688],\n          [1551439050000, 2.6483001708984375],\n          [1551439080000, 1.8082962036132812],\n          [1551439110000, 1.6172676086425781],\n          [1551439140000, 1.8350811004638672],\n          [1551439170000, 1.659804344177246],\n          [1551439200000, 2.4164390563964844],\n          [1551439230000, 1.999464988708496],\n          [1551439260000, 1.9630374908447266],\n          [1551439290000, 2.0218467712402344],\n          [1551439320000, 2.076573371887207],\n          [1551439350000, 2.4036598205566406],\n          [1551439380000, 2.602895736694336],\n          [1551439410000, 2.5561323165893555],\n          [1551439440000, 2.3957443237304688],\n          [1551439470000, 2.3182430267333984],\n          [1551439500000, 2.0863637924194336],\n          [1551439530000, 1.9851713180541992],\n          [1551439560000, 1.9189224243164062],\n          [1551439590000, 1.937936782836914],\n          [1551439620000, 3.844411849975586],\n          [1551439650000, 5.052459716796875],\n          [1551439680000, 2.012505531311035],\n          [1551439710000, 2.27213191986084],\n          [1551439740000, 1.951359748840332],\n          [1551439770000, 2.6224374771118164],\n          [1551439800000, 2.6582508087158203],\n          [1551439830000, 2.607870101928711],\n          [1551439860000, 2.4416723251342773],\n          [1551439890000, 2.369551658630371],\n          [1551439920000, 2.0154476165771484],\n          [1551439950000, 2.096695899963379],\n          [1551439980000, 1.9279394149780273],\n          [1551440010000, 3.023202896118164],\n          [1551440040000, 3.772576332092285],\n          [1551440070000, 2.4855575561523438],\n          [1551440100000, 4.25732421875],\n          [1551440130000, 2.0820703506469727],\n          [1551440160000, 2.489288330078125],\n          [1551440190000, 2.602682113647461],\n          [1551440220000, 4.733266830444336],\n          [1551440250000, 1.8897781372070312],\n          [1551440280000, 2.365001678466797],\n          [1551440310000, 2.295949935913086],\n          [1551440340000, 3.2801055908203125],\n          [1551440370000, 1.8901805877685547],\n          [1551440400000, 2.0735225677490234],\n          [1551440430000, 1.8940362930297852],\n          [1551440460000, 3.0348567962646484],\n          [1551440490000, 2.0472803115844727],\n          [1551440520000, 2.2077903747558594],\n          [1551440550000, 5.1581220626831055],\n          [1551440580000, 2.039125442504883],\n          [1551440610000, 1.6546344757080078],\n          [1551440640000, 3.1943721771240234],\n          [1551440670000, 2.0258655548095703],\n          [1551440700000, 2.2764244079589844],\n          [1551440730000, 1.8293533325195312],\n          [1551440760000, 2.745746612548828],\n          [1551440790000, 2.426107406616211],\n          [1551440820000, 2.497190475463867],\n          [1551440850000, 2.6376562118530273],\n          [1551440880000, 6.415732383728027],\n          [1551440910000, 22.362375259399414],\n          [1551440940000, 1.8069639205932617],\n          [1551440970000, 2.2364587783813477],\n          [1551441000000, 2.1819095611572266],\n          [1551441030000, 2.6490097045898438],\n          [1551441060000, 3.7438411712646484],\n          [1551441090000, 2.2370100021362305],\n          [1551441120000, 2.1098766326904297],\n          [1551441150000, 3.0454416275024414],\n          [1551441180000, 2.211244583129883],\n          [1551441210000, 2.860243797302246],\n          [1551441240000, 2.255979537963867],\n          [1551441270000, 2.0102500915527344],\n          [1551441300000, 2.06740665435791],\n          [1551441330000, 1.9841184616088867],\n          [1551441360000, 2.046261787414551],\n          [1551441390000, 5.3361921310424805],\n          [1551441420000, 3.9412336349487305],\n          [1551441450000, 2.885173797607422],\n          [1551441480000, 3.661712646484375],\n          [1551441510000, 1.8046932220458984],\n          [1551441540000, 1.9574308395385742],\n          [1551441570000, 1.9149093627929688],\n        ] as [number, number][],\n      },\n    },\n    kibana_memory: {\n      /**\n       * Variant 1 - Limit of memory usage before garbage collection\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.process.memory.heap.size_limit',\n          metricAgg: 'max',\n          label: 'Heap Size Limit',\n          title: 'Memory Size',\n          description: 'Limit of memory usage before garbage collection.',\n          units: 'B',\n          format: '0,0.0 b',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 1501560832],\n          [1551438030000, 1501560832],\n          [1551438060000, 1501560832],\n          [1551438090000, 1501560832],\n          [1551438120000, 1501560832],\n          [1551438150000, 1501560832],\n          [1551438180000, 1501560832],\n          [1551438210000, 1501560832],\n          [1551438240000, 1501560832],\n          [1551438270000, 1501560832],\n          [1551438300000, 1501560832],\n          [1551438330000, 1501560832],\n          [1551438360000, 1501560832],\n          [1551438390000, 1501560832],\n          [1551438420000, 1501560832],\n          [1551438450000, 1501560832],\n          [1551438480000, 1501560832],\n          [1551438510000, 1501560832],\n          [1551438540000, 1501560832],\n          [1551438570000, 1501560832],\n          [1551438600000, 1501560832],\n          [1551438630000, 1501560832],\n          [1551438660000, 1501560832],\n          [1551438690000, 1501560832],\n          [1551438720000, 1501560832],\n          [1551438750000, 1501560832],\n          [1551438780000, 1501560832],\n          [1551438810000, 1501560832],\n          [1551438840000, 1501560832],\n          [1551438870000, 1501560832],\n          [1551438900000, 1501560832],\n          [1551438930000, 1501560832],\n          [1551438960000, 1501560832],\n          [1551438990000, 1501560832],\n          [1551439020000, 1501560832],\n          [1551439050000, 1501560832],\n          [1551439080000, 1501560832],\n          [1551439110000, 1501560832],\n          [1551439140000, 1501560832],\n          [1551439170000, 1501560832],\n          [1551439200000, 1501560832],\n          [1551439230000, 1501560832],\n          [1551439260000, 1501560832],\n          [1551439290000, 1501560832],\n          [1551439320000, 1501560832],\n          [1551439350000, 1501560832],\n          [1551439380000, 1501560832],\n          [1551439410000, 1501560832],\n          [1551439440000, 1501560832],\n          [1551439470000, 1501560832],\n          [1551439500000, 1501560832],\n          [1551439530000, 1501560832],\n          [1551439560000, 1501560832],\n          [1551439590000, 1501560832],\n          [1551439620000, 1501560832],\n          [1551439650000, 1501560832],\n          [1551439680000, 1501560832],\n          [1551439710000, 1501560832],\n          [1551439740000, 1501560832],\n          [1551439770000, 1501560832],\n          [1551439800000, 1501560832],\n          [1551439830000, 1501560832],\n          [1551439860000, 1501560832],\n          [1551439890000, 1501560832],\n          [1551439920000, 1501560832],\n          [1551439950000, 1501560832],\n          [1551439980000, 1501560832],\n          [1551440010000, 1501560832],\n          [1551440040000, 1501560832],\n          [1551440070000, 1501560832],\n          [1551440100000, 1501560832],\n          [1551440130000, 1501560832],\n          [1551440160000, 1501560832],\n          [1551440190000, 1501560832],\n          [1551440220000, 1501560832],\n          [1551440250000, 1501560832],\n          [1551440280000, 1501560832],\n          [1551440310000, 1501560832],\n          [1551440340000, 1501560832],\n          [1551440370000, 1501560832],\n          [1551440400000, 1501560832],\n          [1551440430000, 1501560832],\n          [1551440460000, 1501560832],\n          [1551440490000, 1501560832],\n          [1551440520000, 1501560832],\n          [1551440550000, 1501560832],\n          [1551440580000, 1501560832],\n          [1551440610000, 1501560832],\n          [1551440640000, 1501560832],\n          [1551440670000, 1501560832],\n          [1551440700000, 1501560832],\n          [1551440730000, 1501560832],\n          [1551440760000, 1501560832],\n          [1551440790000, 1501560832],\n          [1551440820000, 1501560832],\n          [1551440850000, 1501560832],\n          [1551440880000, 1501560832],\n          [1551440910000, 1501560832],\n          [1551440940000, 1501560832],\n          [1551440970000, 1501560832],\n          [1551441000000, 1501560832],\n          [1551441030000, 1501560832],\n          [1551441060000, 1501560832],\n          [1551441090000, 1501560832],\n          [1551441120000, 1501560832],\n          [1551441150000, 1501560832],\n          [1551441180000, 1501560832],\n          [1551441210000, 1501560832],\n          [1551441240000, 1501560832],\n          [1551441270000, 1501560832],\n          [1551441300000, 1501560832],\n          [1551441330000, 1501560832],\n          [1551441360000, 1501560832],\n          [1551441390000, 1501560832],\n          [1551441420000, 1501560832],\n          [1551441450000, 1501560832],\n          [1551441480000, 1501560832],\n          [1551441510000, 1501560832],\n          [1551441540000, 1501560832],\n          [1551441570000, 1501560832],\n        ] as [number, number][],\n      },\n      /**\n       * Variant 2 - Total heap used by Kibana running in Node.js\n       */\n      v2: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.process.memory.resident_set_size_in_bytes',\n          metricAgg: 'max',\n          label: 'Memory Size',\n          title: 'Memory Size',\n          description: 'Total heap used by Kibana running in Node.js.',\n          units: 'B',\n          format: '0,0.0 b',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 645689344],\n          [1551438030000, 642293760],\n          [1551438060000, 649953280],\n          [1551438090000, 637751296],\n          [1551438120000, 643112960],\n          [1551438150000, 642781184],\n          [1551438180000, 642899968],\n          [1551438210000, 646262784],\n          [1551438240000, 643276800],\n          [1551438270000, 663547904],\n          [1551438300000, 654954496],\n          [1551438330000, 644222976],\n          [1551438360000, 645672960],\n          [1551438390000, 649728000],\n          [1551438420000, 646631424],\n          [1551438450000, 647000064],\n          [1551438480000, 647114752],\n          [1551438510000, 648630272],\n          [1551438540000, 647720960],\n          [1551438570000, 646979584],\n          [1551438600000, 651296768],\n          [1551438630000, 642248704],\n          [1551438660000, 645177344],\n          [1551438690000, 648171520],\n          [1551438720000, 670048256],\n          [1551438750000, 653139968],\n          [1551438780000, 644583424],\n          [1551438810000, 648630272],\n          [1551438840000, 647925760],\n          [1551438870000, 648986624],\n          [1551438900000, 644399104],\n          [1551438930000, 636719104],\n          [1551438960000, 650260480],\n          [1551438990000, 666669056],\n          [1551439020000, 661057536],\n          [1551439050000, 649957376],\n          [1551439080000, 655093760],\n          [1551439110000, 647913472],\n          [1551439140000, 642232320],\n          [1551439170000, 642490368],\n          [1551439200000, 643133440],\n          [1551439230000, 640008192],\n          [1551439260000, 648654848],\n          [1551439290000, 643506176],\n          [1551439320000, 647127040],\n          [1551439350000, 662966272],\n          [1551439380000, 646635520],\n          [1551439410000, 641519616],\n          [1551439440000, 658214912],\n          [1551439470000, 666677248],\n          [1551439500000, 651583488],\n          [1551439530000, 652963840],\n          [1551439560000, 662065152],\n          [1551439590000, 662417408],\n          [1551439620000, 665919488],\n          [1551439650000, 646316032],\n          [1551439680000, 643153920],\n          [1551439710000, 658288640],\n          [1551439740000, 662052864],\n          [1551439770000, 660353024],\n          [1551439800000, 649293824],\n          [1551439830000, 661753856],\n          [1551439860000, 663977984],\n          [1551439890000, 658100224],\n          [1551439920000, 657711104],\n          [1551439950000, 645820416],\n          [1551439980000, 648531968],\n          [1551440010000, 644272128],\n          [1551440040000, 649019392],\n          [1551440070000, 656228352],\n          [1551440100000, 643280896],\n          [1551440130000, 645763072],\n          [1551440160000, 649703424],\n          [1551440190000, 653647872],\n          [1551440220000, 647307264],\n          [1551440250000, 685629440],\n          [1551440280000, 711311360],\n          [1551440310000, 648220672],\n          [1551440340000, 645439488],\n          [1551440370000, 646225920],\n          [1551440400000, 650481664],\n          [1551440430000, 650178560],\n          [1551440460000, 651149312],\n          [1551440490000, 653852672],\n          [1551440520000, 651427840],\n          [1551440550000, 652050432],\n          [1551440580000, 646492160],\n          [1551440610000, 650129408],\n          [1551440640000, 659320832],\n          [1551440670000, 653029376],\n          [1551440700000, 661946368],\n          [1551440730000, 652808192],\n          [1551440760000, 656105472],\n          [1551440790000, 654086144],\n          [1551440820000, 649216000],\n          [1551440850000, 660570112],\n          [1551440880000, 663560192],\n          [1551440910000, 663306240],\n          [1551440940000, 750891008],\n          [1551440970000, 802795520],\n          [1551441000000, 682393600],\n          [1551441030000, 646311936],\n          [1551441060000, 648204288],\n          [1551441090000, 650903552],\n          [1551441120000, 648257536],\n          [1551441150000, 649920512],\n          [1551441180000, 643801088],\n          [1551441210000, 653606912],\n          [1551441240000, 654901248],\n          [1551441270000, 644833280],\n          [1551441300000, 658534400],\n          [1551441330000, 655249408],\n          [1551441360000, 647827456],\n          [1551441390000, 655147008],\n          [1551441420000, 652087296],\n          [1551441450000, 655159296],\n          [1551441480000, 655753216],\n          [1551441510000, 666820608],\n          [1551441540000, 662138880],\n          [1551441570000, 651341824],\n        ] as [number, number][],\n      },\n    },\n    kibana_response_times: {\n      /**\n       * Variant 1 - Maximum response time for client requests to the Kibana instance\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.response_times.max',\n          metricAgg: 'max',\n          label: 'Max',\n          title: 'Client Response Time',\n          description: 'Maximum response time for client requests to the Kibana instance.',\n          units: 'ms',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 11637],\n          [1551438030000, 12188],\n          [1551438060000, 11802],\n          [1551438090000, 11907],\n          [1551438120000, 11875],\n          [1551438150000, 11835],\n          [1551438180000, 12077],\n          [1551438210000, 11827],\n          [1551438240000, 11870],\n          [1551438270000, 11897],\n          [1551438300000, 12085],\n          [1551438330000, 11829],\n          [1551438360000, 11804],\n          [1551438390000, 12040],\n          [1551438420000, 11906],\n          [1551438450000, 11967],\n          [1551438480000, 11798],\n          [1551438510000, 11587],\n          [1551438540000, 11766],\n          [1551438570000, 11763],\n          [1551438600000, 11848],\n          [1551438630000, 12061],\n          [1551438660000, 11922],\n          [1551438690000, 11805],\n          [1551438720000, 12194],\n          [1551438750000, 11784],\n          [1551438780000, 12097],\n          [1551438810000, 11984],\n          [1551438840000, 11955],\n          [1551438870000, 11378],\n          [1551438900000, 12047],\n          [1551438930000, 11989],\n          [1551438960000, 11925],\n          [1551438990000, 12009],\n          [1551439020000, 11806],\n          [1551439050000, 11761],\n          [1551439080000, 11808],\n          [1551439110000, 11979],\n          [1551439140000, 11945],\n          [1551439170000, 11769],\n          [1551439200000, 12010],\n          [1551439230000, 11746],\n          [1551439260000, 12176],\n          [1551439290000, 12253],\n          [1551439320000, 12093],\n          [1551439350000, 12034],\n          [1551439380000, 12114],\n          [1551439410000, 12135],\n          [1551439440000, 12193],\n          [1551439470000, 12138],\n          [1551439500000, 12116],\n          [1551439530000, 11849],\n          [1551439560000, 12335],\n          [1551439590000, 11988],\n          [1551439620000, 12077],\n          [1551439650000, 11841],\n          [1551439680000, 11956],\n          [1551439710000, 11798],\n          [1551439740000, 11939],\n          [1551439770000, 11929],\n          [1551439800000, 11894],\n          [1551439830000, 11962],\n          [1551439860000, 12348],\n          [1551439890000, 11939],\n          [1551439920000, 12005],\n          [1551439950000, 12550],\n          [1551439980000, 11935],\n          [1551440010000, 11931],\n          [1551440040000, 11814],\n          [1551440070000, 11703],\n          [1551440100000, 11990],\n          [1551440130000, 12050],\n          [1551440160000, 11971],\n          [1551440190000, 11720],\n          [1551440220000, 12085],\n          [1551440250000, 11919],\n          [1551440280000, 12551],\n          [1551440310000, 11873],\n          [1551440340000, 11599],\n          [1551440370000, 11977],\n          [1551440400000, 12002],\n          [1551440430000, 11757],\n          [1551440460000, 11657],\n          [1551440490000, 11291],\n          [1551440520000, 11943],\n          [1551440550000, 12223],\n          [1551440580000, 1482],\n          [1551440610000, 12060],\n          [1551440640000, 12016],\n          [1551440670000, 12318],\n          [1551440700000, 11969],\n          [1551440730000, 11974],\n          [1551440760000, 11779],\n          [1551440790000, 11868],\n          [1551440820000, 12295],\n          [1551440850000, 12077],\n          [1551440880000, 12127],\n          [1551440910000, 12075],\n          [1551440940000, 12472],\n          [1551440970000, 11715],\n          [1551441000000, 12036],\n          [1551441030000, 12020],\n          [1551441060000, 12816],\n          [1551441090000, 12644],\n          [1551441120000, 11907],\n          [1551441150000, 11945],\n          [1551441180000, 12083],\n          [1551441210000, 11998],\n          [1551441240000, 12259],\n          [1551441270000, 11516],\n          [1551441300000, 11969],\n          [1551441330000, 12053],\n          [1551441360000, 12002],\n          [1551441390000, 12016],\n          [1551441420000, 12146],\n          [1551441450000, 11904],\n          [1551441480000, 11942],\n          [1551441510000, 12139],\n          [1551441540000, 11966],\n          [1551441570000, 12051],\n        ] as [number, number][],\n      },\n      /**\n       * Variant 2 - Average response time for client requests to the Kibana instance\n       */\n      v2: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.response_times.average',\n          metricAgg: 'max',\n          label: 'Average',\n          title: 'Client Response Time',\n          description: 'Average response time for client requests to the Kibana instance.',\n          units: 'ms',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 237.5],\n          [1551438030000, 606.875],\n          [1551438060000, 514.413818359375],\n          [1551438090000, 722.0555419921875],\n          [1551438120000, 512],\n          [1551438150000, 294.32073974609375],\n          [1551438180000, 538.6333618164062],\n          [1551438210000, 720.8333129882812],\n          [1551438240000, 468.56097412109375],\n          [1551438270000, 559.5184936523438],\n          [1551438300000, 549.888916015625],\n          [1551438330000, 636.6190185546875],\n          [1551438360000, 626.6818237304688],\n          [1551438390000, 578.8846435546875],\n          [1551438420000, 562.4615478515625],\n          [1551438450000, 582.75],\n          [1551438480000, 491.0967712402344],\n          [1551438510000, 527.5357055664062],\n          [1551438540000, 436.25714111328125],\n          [1551438570000, 504.17242431640625],\n          [1551438600000, 527.8928833007812],\n          [1551438630000, 419.20513916015625],\n          [1551438660000, 494.258056640625],\n          [1551438690000, 529.5184936523438],\n          [1551438720000, 511.2257995605469],\n          [1551438750000, 297.3492126464844],\n          [1551438780000, 622.3666381835938],\n          [1551438810000, 284.5199890136719],\n          [1551438840000, 805.5555419921875],\n          [1551438870000, 519.2857055664062],\n          [1551438900000, 609.4583129882812],\n          [1551438930000, 278.6333312988281],\n          [1551438960000, 537.3461303710938],\n          [1551438990000, 522.0344848632812],\n          [1551439020000, 440.8571472167969],\n          [1551439050000, 518],\n          [1551439080000, 232.17808532714844],\n          [1551439110000, 494.0322570800781],\n          [1551439140000, 597],\n          [1551439170000, 297.7321472167969],\n          [1551439200000, 552.2857055664062],\n          [1551439230000, 270.17742919921875],\n          [1551439260000, 563.3076782226562],\n          [1551439290000, 591.375],\n          [1551439320000, 613.0370483398438],\n          [1551439350000, 557.1142578125],\n          [1551439380000, 474.875],\n          [1551439410000, 282.0428466796875],\n          [1551439440000, 285.3492126464844],\n          [1551439470000, 466.2894592285156],\n          [1551439500000, 452.3714294433594],\n          [1551439530000, 445.9459533691406],\n          [1551439560000, 410.5],\n          [1551439590000, 434.6486511230469],\n          [1551439620000, 243.028564453125],\n          [1551439650000, 477.125],\n          [1551439680000, 245.6666717529297],\n          [1551439710000, 266.63934326171875],\n          [1551439740000, 398.4285583496094],\n          [1551439770000, 395.9761962890625],\n          [1551439800000, 233.9545440673828],\n          [1551439830000, 427.76922607421875],\n          [1551439860000, 366.05999755859375],\n          [1551439890000, 514],\n          [1551439920000, 421.452392578125],\n          [1551439950000, 445.5128173828125],\n          [1551439980000, 279.76812744140625],\n          [1551440010000, 225.01123046875],\n          [1551440040000, 520.6551513671875],\n          [1551440070000, 525],\n          [1551440100000, 317.6000061035156],\n          [1551440130000, 432.9756164550781],\n          [1551440160000, 454.4210510253906],\n          [1551440190000, 507.625],\n          [1551440220000, 300.015869140625],\n          [1551440250000, 512.625],\n          [1551440280000, 476.7250061035156],\n          [1551440310000, 485.8484802246094],\n          [1551440340000, 446.97222900390625],\n          [1551440370000, 519.2142944335938],\n          [1551440400000, 461.941162109375],\n          [1551440430000, 534.74072265625],\n          [1551440460000, 498.258056640625],\n          [1551440490000, 515.6666870117188],\n          [1551440520000, 564.137939453125],\n          [1551440550000, 515.933349609375],\n          [1551440580000, 148.50877380371094],\n          [1551440610000, 445.6388854980469],\n          [1551440640000, 569.923095703125],\n          [1551440670000, 328.4313659667969],\n          [1551440700000, 386.47369384765625],\n          [1551440730000, 514.6785888671875],\n          [1551440760000, 667.6818237304688],\n          [1551440790000, 589.6153564453125],\n          [1551440820000, 337.5918273925781],\n          [1551440850000, 435.868408203125],\n          [1551440880000, 569.774169921875],\n          [1551440910000, 532.0714111328125],\n          [1551440940000, 365.9818115234375],\n          [1551440970000, 616.0833129882812],\n          [1551441000000, 521.8965454101562],\n          [1551441030000, 557.1851806640625],\n          [1551441060000, 540.3793334960938],\n          [1551441090000, 588.076904296875],\n          [1551441120000, 610.2000122070312],\n          [1551441150000, 621.3333129882812],\n          [1551441180000, 534],\n          [1551441210000, 533.8571166992188],\n          [1551441240000, 459.8611145019531],\n          [1551441270000, 508.96429443359375],\n          [1551441300000, 556.8148193359375],\n          [1551441330000, 614.8695678710938],\n          [1551441360000, 469.8285827636719],\n          [1551441390000, 484.18182373046875],\n          [1551441420000, 644.09521484375],\n          [1551441450000, 524],\n          [1551441480000, 719.5789184570312],\n          [1551441510000, 564.4000244140625],\n          [1551441540000, 561.0740966796875],\n          [1551441570000, 329.6833190917969],\n        ] as [number, number][],\n      },\n    },\n    kibana_requests: {\n      /**\n       * Variant 1 - Total number of client requests received by the Kibana instance\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.requests.total',\n          metricAgg: 'max',\n          label: 'Client Requests',\n          description: 'Total number of client requests received by the Kibana instance.',\n          units: '',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 62],\n          [1551438030000, 43],\n          [1551438060000, 64],\n          [1551438090000, 60],\n          [1551438120000, 44],\n          [1551438150000, 56],\n          [1551438180000, 32],\n          [1551438210000, 36],\n          [1551438240000, 56],\n          [1551438270000, 83],\n          [1551438300000, 59],\n          [1551438330000, 62],\n          [1551438360000, 34],\n          [1551438390000, 35],\n          [1551438420000, 30],\n          [1551438450000, 30],\n          [1551438480000, 32],\n          [1551438510000, 30],\n          [1551438540000, 62],\n          [1551438570000, 37],\n          [1551438600000, 33],\n          [1551438630000, 56],\n          [1551438660000, 36],\n          [1551438690000, 31],\n          [1551438720000, 85],\n          [1551438750000, 75],\n          [1551438780000, 53],\n          [1551438810000, 48],\n          [1551438840000, 39],\n          [1551438870000, 57],\n          [1551438900000, 37],\n          [1551438930000, 58],\n          [1551438960000, 91],\n          [1551438990000, 65],\n          [1551439020000, 43],\n          [1551439050000, 35],\n          [1551439080000, 71],\n          [1551439110000, 62],\n          [1551439140000, 34],\n          [1551439170000, 55],\n          [1551439200000, 61],\n          [1551439230000, 74],\n          [1551439260000, 62],\n          [1551439290000, 53],\n          [1551439320000, 97],\n          [1551439350000, 92],\n          [1551439380000, 37],\n          [1551439410000, 71],\n          [1551439440000, 64],\n          [1551439470000, 39],\n          [1551439500000, 60],\n          [1551439530000, 56],\n          [1551439560000, 39],\n          [1551439590000, 36],\n          [1551439620000, 70],\n          [1551439650000, 47],\n          [1551439680000, 66],\n          [1551439710000, 124],\n          [1551439740000, 52],\n          [1551439770000, 98],\n          [1551439800000, 86],\n          [1551439830000, 97],\n          [1551439860000, 50],\n          [1551439890000, 36],\n          [1551439920000, 42],\n          [1551439950000, 41],\n          [1551439980000, 72],\n          [1551440010000, 93],\n          [1551440040000, 53],\n          [1551440070000, 33],\n          [1551440100000, 66],\n          [1551440130000, 43],\n          [1551440160000, 44],\n          [1551440190000, 34],\n          [1551440220000, 104],\n          [1551440250000, 50],\n          [1551440280000, 38],\n          [1551440310000, 35],\n          [1551440340000, 37],\n          [1551440370000, 37],\n          [1551440400000, 40],\n          [1551440430000, 33],\n          [1551440460000, 34],\n          [1551440490000, 31],\n          [1551440520000, 35],\n          [1551440550000, 41],\n          [1551440580000, 59],\n          [1551440610000, 36],\n          [1551440640000, 80],\n          [1551440670000, 41],\n          [1551440700000, 53],\n          [1551440730000, 106],\n          [1551440760000, 62],\n          [1551440790000, 90],\n          [1551440820000, 67],\n          [1551440850000, 107],\n          [1551440880000, 83],\n          [1551440910000, 74],\n          [1551440940000, 91],\n          [1551440970000, 57],\n          [1551441000000, 36],\n          [1551441030000, 33],\n          [1551441060000, 55],\n          [1551441090000, 41],\n          [1551441120000, 32],\n          [1551441150000, 38],\n          [1551441180000, 57],\n          [1551441210000, 57],\n          [1551441240000, 43],\n          [1551441270000, 41],\n          [1551441300000, 34],\n          [1551441330000, 59],\n          [1551441360000, 36],\n          [1551441390000, 71],\n          [1551441420000, 55],\n          [1551441450000, 43],\n          [1551441480000, 67],\n          [1551441510000, 81],\n          [1551441540000, 58],\n          [1551441570000, 97],\n        ] as [number, number][],\n      },\n    },\n  },\n  kibanaSummary: {\n    uuid: '38cd1f5c-fc29-492e-b5b6-34777df7bdf6',\n    name: 'demo.elastic.co',\n    index: '.kibana',\n    host: '0.0.0.0',\n    transport_address: '0.0.0.0:5601',\n    version: '6.5.4',\n    snapshot: false,\n    status: 'green',\n    availability: true,\n    os_memory_free: 74041475072,\n    uptime: 243193903,\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const TSVB_DATASET = {\n  id: '61ca57f0-469d-11e7-af02-69e470af7417',\n  series: [\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:jpg',\n      label: 'jpg',\n      color: 'rgb(104, 188, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 6],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 0],\n        [1552858800000, 1],\n        [1552859400000, 1],\n        [1552860000000, 0],\n        [1552860600000, 1],\n        [1552861200000, 1],\n        [1552861800000, 1],\n        [1552862400000, 0],\n        [1552863000000, 2],\n        [1552863600000, 1],\n        [1552864200000, 0],\n        [1552864800000, 1],\n        [1552865400000, 4],\n        [1552866000000, 6],\n        [1552866600000, 6],\n        [1552867200000, 4],\n        [1552867800000, 7],\n        [1552868400000, 3],\n        [1552869000000, 20],\n        [1552869600000, 30],\n        [1552870200000, 40],\n        [1552870800000, null],\n        [1552871400000, 5],\n        [1552872000000, 6],\n        [1552872600000, 12],\n        [1552873200000, 0],\n        [1552873800000, 10],\n        [1552874400000, 10],\n        [1552875000000, 13],\n        [1552875600000, 8],\n        [1552876200000, 13],\n        [1552876800000, 10],\n        [1552877400000, 10],\n        [1552878000000, 20],\n        [1552878600000, 16],\n        [1552879200000, 16],\n        [1552879800000, 15],\n        [1552880400000, 21],\n        [1552881000000, 19],\n        [1552881600000, 29],\n        [1552882200000, 31],\n        [1552882800000, 28],\n        [1552883400000, 33],\n        [1552884000000, 30],\n        [1552884600000, 29],\n        [1552885200000, 24],\n        [1552885800000, 35],\n        [1552886400000, 33],\n        [1552887000000, 32],\n        [1552887600000, 28],\n        [1552888200000, 48],\n        [1552888800000, 44],\n        [1552889400000, 26],\n        [1552890000000, 44],\n        [1552890600000, 65],\n        [1552891200000, 42],\n        [1552891800000, 49],\n        [1552892400000, 51],\n        [1552893000000, 59],\n        [1552893600000, 47],\n        [1552894200000, 47],\n        [1552894800000, 54],\n        [1552895400000, 48],\n        [1552896000000, 61],\n        [1552896600000, 63],\n        [1552897200000, 59],\n        [1552897800000, 58],\n        [1552898400000, 52],\n        [1552899000000, 61],\n        [1552899600000, 42],\n        [1552900200000, 48],\n        [1552900800000, 47],\n        [1552901400000, 52],\n        [1552902000000, 67],\n        [1552902600000, 49],\n        [1552903200000, 56],\n        [1552903800000, 36],\n        [1552904400000, 38],\n        [1552905000000, 42],\n        [1552905600000, 59],\n        [1552906200000, 41],\n        [1552906800000, 32],\n        [1552907400000, 48],\n        [1552908000000, 41],\n        [1552908600000, 41],\n        [1552909200000, 44],\n        [1552909800000, 46],\n        [1552910400000, 32],\n        [1552911000000, 40],\n        [1552911600000, 33],\n        [1552912200000, 30],\n        [1552912800000, 33],\n        [1552913400000, 31],\n        [1552914000000, 35],\n        [1552914600000, 22],\n        [1552915200000, 26],\n        [1552915800000, 22],\n        [1552916400000, 14],\n        [1552917000000, 22],\n        [1552917600000, 20],\n        [1552918200000, 13],\n        [1552918800000, 21],\n        [1552919400000, 14],\n        [1552920000000, 15],\n        [1552920600000, 13],\n        [1552921200000, 16],\n        [1552921800000, 14],\n        [1552922400000, 12],\n        [1552923000000, 10],\n        [1552923600000, 7],\n        [1552924200000, 12],\n        [1552924800000, 3],\n        [1552925400000, 0],\n        [1552926000000, 3],\n        [1552926600000, 6],\n        [1552927200000, 6],\n        [1552927800000, 7],\n        [1552928400000, 10],\n        [1552929000000, 4],\n        [1552929600000, 6],\n        [1552930200000, 9],\n        [1552930800000, 4],\n        [1552931400000, 2],\n        [1552932000000, 1],\n        [1552932600000, 3],\n        [1552933200000, 4],\n        [1552933800000, 6],\n        [1552934400000, 1],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 0],\n        [1552936800000, 1],\n        [1552937400000, 1],\n        [1552938000000, 0],\n        [1552938600000, 1],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 1],\n        [1552941000000, 0],\n        [1552941600000, 0],\n        [1552942200000, 0],\n        [1552942800000, 2],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 1],\n        [1552945200000, 0],\n        [1552945800000, 2],\n        [1552946400000, 1],\n        [1552947000000, 0],\n        [1552947600000, 1],\n        [1552948200000, 1],\n        [1552948800000, 1],\n        [1552949400000, 2],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:css',\n      label: 'css',\n      color: 'rgb(77, 138, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 0],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 1],\n        [1552858800000, 0],\n        [1552859400000, 0],\n        [1552860000000, 1],\n        [1552860600000, 0],\n        [1552861200000, 0],\n        [1552861800000, 2],\n        [1552862400000, 0],\n        [1552863000000, 0],\n        [1552863600000, 1],\n        [1552864200000, 0],\n        [1552864800000, 1],\n        [1552865400000, 1],\n        [1552866000000, 0],\n        [1552866600000, 0],\n        [1552867200000, 2],\n        [1552867800000, 0],\n        [1552868400000, 4],\n        [1552869000000, 0],\n        [1552869600000, 1],\n        [1552870200000, 0],\n        [1552870800000, 2],\n        [1552871400000, 2],\n        [1552872000000, 2],\n        [1552872600000, 1],\n        [1552873200000, 0],\n        [1552873800000, 2],\n        [1552874400000, 1],\n        [1552875000000, 2],\n        [1552875600000, 4],\n        [1552876200000, 4],\n        [1552876800000, 4],\n        [1552877400000, 3],\n        [1552878000000, 3],\n        [1552878600000, 3],\n        [1552879200000, 0],\n        [1552879800000, 3],\n        [1552880400000, 4],\n        [1552881000000, 4],\n        [1552881600000, 4],\n        [1552882200000, 8],\n        [1552882800000, 7],\n        [1552883400000, 7],\n        [1552884000000, 3],\n        [1552884600000, 8],\n        [1552885200000, 6],\n        [1552885800000, 6],\n        [1552886400000, 8],\n        [1552887000000, 11],\n        [1552887600000, 7],\n        [1552888200000, 8],\n        [1552888800000, 7],\n        [1552889400000, 11],\n        [1552890000000, 16],\n        [1552890600000, 14],\n        [1552891200000, 10],\n        [1552891800000, 12],\n        [1552892400000, 7],\n        [1552893000000, 15],\n        [1552893600000, 13],\n        [1552894200000, 9],\n        [1552894800000, 16],\n        [1552895400000, 15],\n        [1552896000000, 14],\n        [1552896600000, 9],\n        [1552897200000, 10],\n        [1552897800000, 15],\n        [1552898400000, 15],\n        [1552899000000, 13],\n        [1552899600000, 18],\n        [1552900200000, 17],\n        [1552900800000, 18],\n        [1552901400000, 18],\n        [1552902000000, 6],\n        [1552902600000, 19],\n        [1552903200000, 20],\n        [1552903800000, 14],\n        [1552904400000, 11],\n        [1552905000000, 7],\n        [1552905600000, 20],\n        [1552906200000, 11],\n        [1552906800000, 13],\n        [1552907400000, 8],\n        [1552908000000, 15],\n        [1552908600000, 10],\n        [1552909200000, 13],\n        [1552909800000, 16],\n        [1552910400000, 11],\n        [1552911000000, 11],\n        [1552911600000, 11],\n        [1552912200000, 7],\n        [1552912800000, 10],\n        [1552913400000, 6],\n        [1552914000000, 4],\n        [1552914600000, 6],\n        [1552915200000, 4],\n        [1552915800000, 5],\n        [1552916400000, 7],\n        [1552917000000, 7],\n        [1552917600000, 5],\n        [1552918200000, 2],\n        [1552918800000, 3],\n        [1552919400000, 4],\n        [1552920000000, 3],\n        [1552920600000, 4],\n        [1552921200000, 1],\n        [1552921800000, 4],\n        [1552922400000, 4],\n        [1552923000000, 2],\n        [1552923600000, 3],\n        [1552924200000, 3],\n        [1552924800000, 2],\n        [1552925400000, 0],\n        [1552926000000, 1],\n        [1552926600000, 0],\n        [1552927200000, 2],\n        [1552927800000, 4],\n        [1552928400000, 2],\n        [1552929000000, 2],\n        [1552929600000, 0],\n        [1552930200000, 0],\n        [1552930800000, 0],\n        [1552931400000, 2],\n        [1552932000000, 0],\n        [1552932600000, 1],\n        [1552933200000, 1],\n        [1552933800000, 0],\n        [1552934400000, 1],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 0],\n        [1552936800000, 2],\n        [1552937400000, 0],\n        [1552938000000, 0],\n        [1552938600000, 0],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 0],\n        [1552941000000, 0],\n        [1552941600000, 1],\n        [1552942200000, 0],\n        [1552942800000, 1],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 0],\n        [1552945200000, 0],\n        [1552945800000, 0],\n        [1552946400000, 1],\n        [1552947000000, 1],\n        [1552947600000, 0],\n        [1552948200000, 0],\n        [1552948800000, 1],\n        [1552949400000, 0],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:png',\n      label: 'png',\n      color: 'rgb(49, 89, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 2],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 0],\n        [1552858800000, 0],\n        [1552859400000, 0],\n        [1552860000000, 1],\n        [1552860600000, 1],\n        [1552861200000, 0],\n        [1552861800000, 0],\n        [1552862400000, 1],\n        [1552863000000, 0],\n        [1552863600000, 1],\n        [1552864200000, 1],\n        [1552864800000, 0],\n        [1552865400000, 0],\n        [1552866000000, 0],\n        [1552866600000, 1],\n        [1552867200000, 0],\n        [1552867800000, 2],\n        [1552868400000, 0],\n        [1552869000000, 0],\n        [1552869600000, 0],\n        [1552870200000, 0],\n        [1552870800000, 2],\n        [1552871400000, 3],\n        [1552872000000, 0],\n        [1552872600000, 0],\n        [1552873200000, 0],\n        [1552873800000, 0],\n        [1552874400000, 0],\n        [1552875000000, 2],\n        [1552875600000, 4],\n        [1552876200000, 0],\n        [1552876800000, 7],\n        [1552877400000, 0],\n        [1552878000000, 2],\n        [1552878600000, 0],\n        [1552879200000, 2],\n        [1552879800000, 4],\n        [1552880400000, 0],\n        [1552881000000, 2],\n        [1552881600000, 7],\n        [1552882200000, 4],\n        [1552882800000, 2],\n        [1552883400000, 4],\n        [1552884000000, 2],\n        [1552884600000, 6],\n        [1552885200000, 4],\n        [1552885800000, 5],\n        [1552886400000, 2],\n        [1552887000000, 7],\n        [1552887600000, 7],\n        [1552888200000, 5],\n        [1552888800000, 2],\n        [1552889400000, 1],\n        [1552890000000, 10],\n        [1552890600000, 9],\n        [1552891200000, 5],\n        [1552891800000, 10],\n        [1552892400000, 5],\n        [1552893000000, 7],\n        [1552893600000, 14],\n        [1552894200000, 10],\n        [1552894800000, 3],\n        [1552895400000, 11],\n        [1552896000000, 4],\n        [1552896600000, 15],\n        [1552897200000, 13],\n        [1552897800000, 15],\n        [1552898400000, 10],\n        [1552899000000, 4],\n        [1552899600000, 7],\n        [1552900200000, 12],\n        [1552900800000, 6],\n        [1552901400000, 9],\n        [1552902000000, 12],\n        [1552902600000, 3],\n        [1552903200000, 11],\n        [1552903800000, 10],\n        [1552904400000, 9],\n        [1552905000000, 6],\n        [1552905600000, 10],\n        [1552906200000, 5],\n        [1552906800000, 7],\n        [1552907400000, 9],\n        [1552908000000, 6],\n        [1552908600000, 7],\n        [1552909200000, 2],\n        [1552909800000, 3],\n        [1552910400000, 8],\n        [1552911000000, 2],\n        [1552911600000, 4],\n        [1552912200000, 6],\n        [1552912800000, 1],\n        [1552913400000, 6],\n        [1552914000000, 3],\n        [1552914600000, 2],\n        [1552915200000, 6],\n        [1552915800000, 6],\n        [1552916400000, 4],\n        [1552917000000, 3],\n        [1552917600000, 3],\n        [1552918200000, 1],\n        [1552918800000, 2],\n        [1552919400000, 4],\n        [1552920000000, 4],\n        [1552920600000, 2],\n        [1552921200000, 3],\n        [1552921800000, 1],\n        [1552922400000, 4],\n        [1552923000000, 1],\n        [1552923600000, 3],\n        [1552924200000, 1],\n        [1552924800000, 0],\n        [1552925400000, 0],\n        [1552926000000, 1],\n        [1552926600000, 1],\n        [1552927200000, 0],\n        [1552927800000, 0],\n        [1552928400000, 1],\n        [1552929000000, 1],\n        [1552929600000, 1],\n        [1552930200000, 0],\n        [1552930800000, 0],\n        [1552931400000, 0],\n        [1552932000000, 0],\n        [1552932600000, 0],\n        [1552933200000, 0],\n        [1552933800000, 0],\n        [1552934400000, 0],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 0],\n        [1552936800000, 0],\n        [1552937400000, 0],\n        [1552938000000, 0],\n        [1552938600000, 0],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 0],\n        [1552941000000, 0],\n        [1552941600000, 0],\n        [1552942200000, 0],\n        [1552942800000, 0],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 0],\n        [1552945200000, 0],\n        [1552945800000, 0],\n        [1552946400000, 0],\n        [1552947000000, 1],\n        [1552947600000, 0],\n        [1552948200000, 1],\n        [1552948800000, 0],\n        [1552949400000, 1],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:gif',\n      label: 'gif',\n      color: 'rgb(22, 39, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 0],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 0],\n        [1552858800000, 0],\n        [1552859400000, 0],\n        [1552860000000, 0],\n        [1552860600000, 0],\n        [1552861200000, 0],\n        [1552861800000, 0],\n        [1552862400000, 0],\n        [1552863000000, 0],\n        [1552863600000, 0],\n        [1552864200000, 0],\n        [1552864800000, 0],\n        [1552865400000, 0],\n        [1552866000000, 0],\n        [1552866600000, 0],\n        [1552867200000, 1],\n        [1552867800000, 0],\n        [1552868400000, 2],\n        [1552869000000, 1],\n        [1552869600000, 0],\n        [1552870200000, 1],\n        [1552870800000, 1],\n        [1552871400000, 2],\n        [1552872000000, 1],\n        [1552872600000, 2],\n        [1552873200000, 0],\n        [1552873800000, 1],\n        [1552874400000, 0],\n        [1552875000000, 0],\n        [1552875600000, 1],\n        [1552876200000, 1],\n        [1552876800000, 1],\n        [1552877400000, 2],\n        [1552878000000, 0],\n        [1552878600000, 2],\n        [1552879200000, 1],\n        [1552879800000, 2],\n        [1552880400000, 3],\n        [1552881000000, 2],\n        [1552881600000, 1],\n        [1552882200000, 2],\n        [1552882800000, 6],\n        [1552883400000, 4],\n        [1552884000000, 3],\n        [1552884600000, 5],\n        [1552885200000, 3],\n        [1552885800000, 3],\n        [1552886400000, 3],\n        [1552887000000, 3],\n        [1552887600000, 3],\n        [1552888200000, 3],\n        [1552888800000, 5],\n        [1552889400000, 1],\n        [1552890000000, 3],\n        [1552890600000, 4],\n        [1552891200000, 5],\n        [1552891800000, 4],\n        [1552892400000, 6],\n        [1552893000000, 4],\n        [1552893600000, 5],\n        [1552894200000, 5],\n        [1552894800000, 12],\n        [1552895400000, 7],\n        [1552896000000, 2],\n        [1552896600000, 8],\n        [1552897200000, 8],\n        [1552897800000, 5],\n        [1552898400000, 6],\n        [1552899000000, 8],\n        [1552899600000, 6],\n        [1552900200000, 3],\n        [1552900800000, 8],\n        [1552901400000, 4],\n        [1552902000000, 3],\n        [1552902600000, 9],\n        [1552903200000, 6],\n        [1552903800000, 14],\n        [1552904400000, 3],\n        [1552905000000, 7],\n        [1552905600000, 3],\n        [1552906200000, 4],\n        [1552906800000, 3],\n        [1552907400000, 5],\n        [1552908000000, 2],\n        [1552908600000, 3],\n        [1552909200000, 1],\n        [1552909800000, 2],\n        [1552910400000, 2],\n        [1552911000000, 5],\n        [1552911600000, 2],\n        [1552912200000, 1],\n        [1552912800000, 4],\n        [1552913400000, 3],\n        [1552914000000, 3],\n        [1552914600000, 4],\n        [1552915200000, 1],\n        [1552915800000, 4],\n        [1552916400000, 2],\n        [1552917000000, 3],\n        [1552917600000, 2],\n        [1552918200000, 2],\n        [1552918800000, 2],\n        [1552919400000, 0],\n        [1552920000000, 1],\n        [1552920600000, 2],\n        [1552921200000, 1],\n        [1552921800000, 4],\n        [1552922400000, 0],\n        [1552923000000, 0],\n        [1552923600000, 0],\n        [1552924200000, 0],\n        [1552924800000, 0],\n        [1552925400000, 0],\n        [1552926000000, 1],\n        [1552926600000, 2],\n        [1552927200000, 0],\n        [1552927800000, 0],\n        [1552928400000, 0],\n        [1552929000000, 0],\n        [1552929600000, 1],\n        [1552930200000, 0],\n        [1552930800000, 0],\n        [1552931400000, 0],\n        [1552932000000, 1],\n        [1552932600000, 1],\n        [1552933200000, 0],\n        [1552933800000, 0],\n        [1552934400000, 0],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 0],\n        [1552936800000, 0],\n        [1552937400000, 0],\n        [1552938000000, 0],\n        [1552938600000, 0],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 0],\n        [1552941000000, 0],\n        [1552941600000, 0],\n        [1552942200000, 0],\n        [1552942800000, 0],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 0],\n        [1552945200000, 0],\n        [1552945800000, 0],\n        [1552946400000, 0],\n        [1552947000000, 0],\n        [1552947600000, 0],\n        [1552948200000, 0],\n        [1552948800000, 0],\n        [1552949400000, 0],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:php',\n      label: 'php',\n      color: 'rgb(0, 0, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 0],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 0],\n        [1552858800000, 0],\n        [1552859400000, 0],\n        [1552860000000, 0],\n        [1552860600000, 0],\n        [1552861200000, 0],\n        [1552861800000, 0],\n        [1552862400000, 0],\n        [1552863000000, 0],\n        [1552863600000, 0],\n        [1552864200000, 0],\n        [1552864800000, 1],\n        [1552865400000, 0],\n        [1552866000000, 0],\n        [1552866600000, 0],\n        [1552867200000, 0],\n        [1552867800000, 0],\n        [1552868400000, 0],\n        [1552869000000, 0],\n        [1552869600000, 0],\n        [1552870200000, 0],\n        [1552870800000, 0],\n        [1552871400000, 1],\n        [1552872000000, 1],\n        [1552872600000, 1],\n        [1552873200000, 0],\n        [1552873800000, 1],\n        [1552874400000, 0],\n        [1552875000000, 0],\n        [1552875600000, 0],\n        [1552876200000, 0],\n        [1552876800000, 0],\n        [1552877400000, 3],\n        [1552878000000, 0],\n        [1552878600000, 0],\n        [1552879200000, 0],\n        [1552879800000, 0],\n        [1552880400000, 1],\n        [1552881000000, 1],\n        [1552881600000, 1],\n        [1552882200000, 1],\n        [1552882800000, 1],\n        [1552883400000, 2],\n        [1552884000000, 0],\n        [1552884600000, 1],\n        [1552885200000, 1],\n        [1552885800000, 1],\n        [1552886400000, 0],\n        [1552887000000, 1],\n        [1552887600000, 5],\n        [1552888200000, 2],\n        [1552888800000, 1],\n        [1552889400000, 4],\n        [1552890000000, 1],\n        [1552890600000, 2],\n        [1552891200000, 4],\n        [1552891800000, 8],\n        [1552892400000, 3],\n        [1552893000000, 4],\n        [1552893600000, 3],\n        [1552894200000, 2],\n        [1552894800000, 0],\n        [1552895400000, 5],\n        [1552896000000, 3],\n        [1552896600000, 4],\n        [1552897200000, 2],\n        [1552897800000, 1],\n        [1552898400000, 2],\n        [1552899000000, 2],\n        [1552899600000, 1],\n        [1552900200000, 3],\n        [1552900800000, 1],\n        [1552901400000, 1],\n        [1552902000000, 3],\n        [1552902600000, 4],\n        [1552903200000, 2],\n        [1552903800000, 4],\n        [1552904400000, 4],\n        [1552905000000, 4],\n        [1552905600000, 0],\n        [1552906200000, 5],\n        [1552906800000, 2],\n        [1552907400000, 5],\n        [1552908000000, 3],\n        [1552908600000, 0],\n        [1552909200000, 3],\n        [1552909800000, 0],\n        [1552910400000, 4],\n        [1552911000000, 1],\n        [1552911600000, 1],\n        [1552912200000, 0],\n        [1552912800000, 0],\n        [1552913400000, 2],\n        [1552914000000, 1],\n        [1552914600000, 2],\n        [1552915200000, 0],\n        [1552915800000, 0],\n        [1552916400000, 0],\n        [1552917000000, 1],\n        [1552917600000, 0],\n        [1552918200000, 1],\n        [1552918800000, 0],\n        [1552919400000, 2],\n        [1552920000000, 1],\n        [1552920600000, 0],\n        [1552921200000, 0],\n        [1552921800000, 0],\n        [1552922400000, 3],\n        [1552923000000, 0],\n        [1552923600000, 0],\n        [1552924200000, 0],\n        [1552924800000, 0],\n        [1552925400000, 0],\n        [1552926000000, 0],\n        [1552926600000, 0],\n        [1552927200000, 0],\n        [1552927800000, 0],\n        [1552928400000, 0],\n        [1552929000000, 0],\n        [1552929600000, 1],\n        [1552930200000, 0],\n        [1552930800000, 0],\n        [1552931400000, 0],\n        [1552932000000, 0],\n        [1552932600000, 0],\n        [1552933200000, 0],\n        [1552933800000, 0],\n        [1552934400000, 0],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 1],\n        [1552936800000, 0],\n        [1552937400000, 0],\n        [1552938000000, 0],\n        [1552938600000, 0],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 0],\n        [1552941000000, 0],\n        [1552941600000, 0],\n        [1552942200000, 0],\n        [1552942800000, 0],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 0],\n        [1552945200000, 0],\n        [1552945800000, 0],\n        [1552946400000, 0],\n        [1552947000000, 0],\n        [1552947600000, 0],\n        [1552948200000, 0],\n        [1552948800000, 0],\n        [1552949400000, 1],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n  ],\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// eslint-disable-next-line no-restricted-imports\nimport { debounce as tsDebounce, Options } from 'ts-debounce';\n\n/** @internal */\nexport interface DebouncedFunction<Args extends any[], F extends (...args: Args) => any> {\n  (this: ThisParameterType<F>, ...args: Parameters<F> & Args): ReturnType<F>;\n  cancel: (reason?: any) => void;\n}\n\n/**\n * Wrapper around ts-debounce to fix typings\n * @internal\n */\nexport function debounce<Args extends any[], F extends (...args: Args) => any>(\n  func: F,\n  waitMilliseconds?: number,\n  options?: Options<ReturnType<F>>,\n): DebouncedFunction<Args, F> {\n  // TODO refactor code to ignore or use promise\n  // As of ts - debounce@v3.0 it now returns a promise\n  // we also need a better way to designate internal setting from external, the user does\n  // not care that this function is debounced nor should they be providing a debounced function\n  return tsDebounce(func, waitMilliseconds, options) as DebouncedFunction<Args, F>; // cast required to override promise return type\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Pixels } from '../common/geometry';\n\n/** @public */\nexport interface Dimensions {\n  top: number;\n  left: number;\n  width: number;\n  height: number;\n}\n\n/** @internal */\nexport interface Size {\n  width: number;\n  height: number;\n}\n\n/**\n * fixme consider switching from `number` to `Pixels` or similar, once nominal typing is added\n * @public\n */\nexport interface PerSideDistance {\n  top: number;\n  bottom: number;\n  left: number;\n  right: number;\n}\n\n/**\n * fixme consider deactivating \\@typescript-eslint/no-empty-interface\n * see https://github.com/elastic/elastic-charts/pull/660#discussion_r419474171\n * @public\n */\nexport type Margins = PerSideDistance;\n\n/**\n * todo separate type with partition padding type that allows number\n * @public\n */\nexport type Padding = PerSideDistance;\n\n/**\n * Simple padding declaration\n * @public\n */\nexport interface SimplePadding {\n  outer: Pixels;\n  inner: Pixels;\n}\n\n/** @internal */\nexport const innerPad = (padding: number | Partial<SimplePadding>, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding : padding?.inner ?? 0);\n\n/** @internal */\nexport const outerPad = (padding: number | Partial<SimplePadding>, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding : padding?.outer ?? 0);\n\n/** @internal */\nexport const verticalPad = (padding: number | Padding, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding * 2 : padding.top + padding.bottom);\n\n/** @internal */\nexport const horizontalPad = (padding: number | Padding, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding * 2 : padding.left + padding.right);\n\n/** @internal */\nexport const pad = (padding: number | Padding, direction: keyof Padding, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding : padding[direction]);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { extent } from 'd3-array';\n\nimport { ScaleType } from '../scales/constants';\nimport { DomainPaddingUnit, YDomainRange } from '../specs';\n\n/** @public */\nexport type OrdinalDomain = (number | string)[];\n/** @public */\nexport type ContinuousDomain = [min: number, max: number];\n/** @public */\nexport type GenericDomain = [start: number, end: number];\n/** @public */\nexport type Range = [min: number, max: number];\n\nfunction constrainPadding(\n  start: number,\n  end: number,\n  newStart: number,\n  newEnd: number,\n  constrain: boolean = true,\n): [number, number] {\n  return constrain\n    ? start < end\n      ? [newStart >= 0 || start < 0 ? newStart : 0, newEnd <= 0 || end > 0 ? newEnd : 0]\n      : [newEnd >= 0 || end < 0 ? newEnd : 0, newStart <= 0 || start > 0 ? newStart : 0]\n    : [newStart, newEnd];\n}\n\n/** @internal */\nexport function computeOrdinalDataDomain<T>(data: T[], sorted: boolean, removeNull: boolean, locale: string): T[] {\n  const uniqueValues = [...new Set(removeNull ? data.filter((d) => d !== null) : data)];\n  return sorted ? uniqueValues.sort((a, b) => `${a}`.localeCompare(`${b}`, locale)) : uniqueValues;\n}\n\nfunction getPaddedDomain(start: number, end: number, domainOptions: YDomainRange): [number, number] {\n  const { padding, paddingUnit = DomainPaddingUnit.Domain } = domainOptions;\n  if (!padding || paddingUnit === DomainPaddingUnit.Pixel) return [start, end];\n  const computedPadding = Math.abs(padding * (paddingUnit === DomainPaddingUnit.Domain ? 1 : end - start));\n  return constrainPadding(start, end, start - computedPadding, end + computedPadding, domainOptions.constrainPadding);\n}\n\n/** @internal */\nexport function computeDomainExtent(\n  domain: [number, number] | [undefined, undefined],\n  domainOptions: YDomainRange,\n): [number, number] {\n  if (domain[0] === undefined) return [0, 0]; // if domain[1] is undefined, domain[0] is undefined too\n  const inverted = domain[0] > domain[1];\n  const paddedDomain = (([start, end]: Range): Range => {\n    const [paddedStart, paddedEnd] = getPaddedDomain(start, end, domainOptions);\n    if (paddedStart >= 0 && paddedEnd >= 0) return domainOptions.fit ? [paddedStart, paddedEnd] : [0, paddedEnd];\n    if (paddedStart < 0 && paddedEnd < 0) return domainOptions.fit ? [paddedStart, paddedEnd] : [paddedStart, 0];\n    return [paddedStart, paddedEnd];\n  })(inverted ? [domain[1], domain[0]] : domain);\n\n  return inverted ? [paddedDomain[1], paddedDomain[0]] : paddedDomain;\n}\n\n/**\n * Get continuous domain from data. May yield domain to constrain to zero baseline.\n * @internal\n */\nexport function computeContinuousDataDomain(\n  data: number[],\n  scaleType: ScaleType,\n  domainOptions: YDomainRange | undefined,\n): ContinuousDomain {\n  // todo check for DRY violations: this may not be the only place for non-positives removal for the log scale\n  const filteredData = domainOptions?.fit && scaleType === ScaleType.Log ? data.filter((d) => d !== 0) : data;\n  const range = extent<number, number>(filteredData, (d) => d);\n  return domainOptions === undefined ? [range[0] ?? 0, range[1] ?? 0] : computeDomainExtent(range, domainOptions);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleBand, ScaleContinuous } from '../scales';\nimport { BrushEndListener, isPointerOverEvent, PointerEvent, PointerOverEvent } from '../specs';\nimport { DragState } from '../state/chart_state';\n\n/** @internal */\nexport function isValidPointerOverEvent(\n  mainScale: ScaleBand | ScaleContinuous,\n  event: PointerEvent | null | undefined,\n): event is PointerOverEvent {\n  return isPointerOverEvent(event) && (event.unit === undefined || event.unit === mainScale.unit);\n}\n\n/** @internal */\nexport interface DragCheckProps {\n  onBrushEnd: BrushEndListener | undefined;\n  lastDrag: DragState | null;\n}\n\n/** @internal */\nexport function hasDragged(prevProps: DragCheckProps | null, nextProps: DragCheckProps | null) {\n  if (nextProps === null) {\n    return false;\n  }\n  if (!nextProps.onBrushEnd) {\n    return false;\n  }\n  const prevLastDrag = prevProps !== null ? prevProps.lastDrag : null;\n  const nextLastDrag = nextProps.lastDrag;\n  return nextLastDrag !== null && (prevLastDrag === null || prevLastDrag.end.time !== nextLastDrag.end.time);\n}\n","/* eslint-disable header/header, @typescript-eslint/explicit-module-boundary-types, prefer-destructuring, no-restricted-syntax, no-self-compare */\n\n/**\n * @notice\n * This product includes code that is adapted from fast-deep-equal@3.1.1,\n * which is available under a \"MIT\" license.\n *\n * MIT License\n *\n * Copyright (c) 2017 Evgeny Poberezkin\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\n/**\n * Deep object equality (i.e. ==)\n *\n * partial - returns true if partial b matches a\n * @internal\n */\nexport function deepEqual(a: any, b: any, partial = false): boolean {\n  if (a === b) return true;\n\n  if (a && b && typeof a === 'object' && typeof b === 'object') {\n    if (a.constructor !== b.constructor) return false;\n\n    let length: number;\n    let i: any;\n\n    if (Array.isArray(a)) {\n      length = a.length;\n      if (length !== b.length) return false;\n      for (i = length; i-- !== 0; ) if (!deepEqual(a[i], b[i])) return false;\n      return true;\n    }\n    if (a instanceof Map && b instanceof Map) {\n      if (a.size !== b.size) return false;\n      // @ts-ignore - 3rd party code\n      for (i of a.entries()) if (!b.has(i[0])) return false;\n      // @ts-ignore - 3rd party code\n      for (i of a.entries()) if (!deepEqual(i[1], b.get(i[0]))) return false;\n      return true;\n    }\n\n    if (a instanceof Set && b instanceof Set) {\n      if (a.size !== b.size) return false;\n      // @ts-ignore - 3rd party code\n      for (i of a.entries()) if (!b.has(i[0])) return false;\n      return true;\n    }\n\n    if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;\n    if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();\n    if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();\n\n    const keys = Object.keys(a);\n    length = keys.length;\n    if (length !== Object.keys(b).length && !partial) return false;\n\n    for (i = length; i-- !== 0; ) if (!Object.prototype.hasOwnProperty.call(b, keys[i] ?? '')) return false;\n\n    for (i = length; i-- !== 0; ) {\n      const key = keys[i];\n      if (!key || (key === '_owner' && a.$$typeof)) {\n        // React-specific: avoid traversing React elements' _owner.\n        //  _owner contains circular references\n        // and is not needed when comparing the actual elements (and not their owners)\n        continue;\n      }\n      if (!deepEqual(a[key], b[key])) return false;\n    }\n\n    return true;\n  }\n\n  // true if both NaN, false otherwise\n  return a !== a && b !== b;\n}\n\n/* eslint-enable */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { Dimensions } from './dimensions';\nimport { BarSeriesStyle, PointStyle, PointShape, LineSeriesStyle, AreaSeriesStyle } from './themes/theme';\nimport { XYChartSeriesIdentifier } from '../chart_types/xy_chart/utils/series';\nimport { LabelOverflowConstraint } from '../chart_types/xy_chart/utils/specs';\nimport { Color } from '../common/colors';\nimport { Fill, Stroke } from '../geoms/types';\n\n/**\n * The accessor type\n * @public\n */\nexport const BandedAccessorType = Object.freeze({\n  Y0: 'y0' as const,\n  Y1: 'y1' as const,\n});\n\n/** @public */\nexport type BandedAccessorType = $Values<typeof BandedAccessorType>;\n\n/** @public */\nexport interface GeometryValue {\n  y: any;\n  x: any;\n  mark: number | null;\n  accessor: BandedAccessorType;\n  /**\n   * The original datum used for this geometry\n   */\n  datum: any;\n}\n\n/** @internal */\nexport type IndexedGeometry = PointGeometry | BarGeometry;\n\n/**\n * Array of **range** clippings [x1, x2] to be excluded during rendering\n *\n * Note: Must be scaled **range** values (i.e. pixel coordinates) **NOT** domain values\n * @internal\n */\nexport type ClippedRanges = [number, number][];\n\n/** @internal */\nexport interface PointGeometry {\n  seriesIdentifier: XYChartSeriesIdentifier;\n  x: number;\n  y: number;\n  radius: number;\n  color: Color;\n  transform: {\n    x: number;\n    y: number;\n  };\n  value: GeometryValue;\n  style: PointGeometryStyle;\n  panel: Dimensions;\n  isolated: boolean;\n}\n/** @internal */\nexport interface PointGeometryStyle {\n  fill: Fill;\n  stroke: Stroke;\n  shape: PointShape;\n}\n\n/** @internal */\nexport interface PerPanel<T> {\n  panel: Dimensions;\n  value: T;\n}\n\n/** @internal */\nexport interface BarGeometry {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  transform: {\n    x: number;\n    y: number;\n    rotation?: number;\n  };\n  color: Color;\n  displayValue?: {\n    fontScale: number;\n    fontSize: number;\n    text: any;\n    width: number;\n    height: number;\n    overflowConstraints: Set<LabelOverflowConstraint>;\n  };\n  seriesIdentifier: XYChartSeriesIdentifier;\n  value: GeometryValue;\n  seriesStyle: BarSeriesStyle;\n  panel: Dimensions;\n}\n\n/** @internal */\nexport interface LineGeometry {\n  line: string;\n  points: PointGeometry[];\n  color: Color;\n  transform: {\n    x: number;\n    y: number;\n  };\n  seriesIdentifier: XYChartSeriesIdentifier;\n  style: LineSeriesStyle;\n  /**\n   * Ranges of `[x0, x1]` pairs to clip from series\n   */\n  clippedRanges: ClippedRanges;\n  shouldClip: boolean;\n}\n\n/** @internal */\nexport interface AreaGeometry {\n  area: string;\n  lines: string[];\n  points: PointGeometry[];\n  color: Color;\n  transform: {\n    x: number;\n    y: number;\n  };\n  seriesIdentifier: XYChartSeriesIdentifier;\n  style: AreaSeriesStyle;\n  isStacked: boolean;\n  /**\n   * Ranges of `[x0, x1]` pairs to clip from series\n   */\n  clippedRanges: ClippedRanges;\n  shouldClip: boolean;\n}\n\n/** @internal */\nexport interface BubbleGeometry {\n  points: PointGeometry[];\n  color: Color;\n  seriesIdentifier: XYChartSeriesIdentifier;\n  seriesPointStyle: PointStyle;\n}\n\n/** @internal */\nexport function isPointGeometry(ig: IndexedGeometry): ig is PointGeometry {\n  return ig.hasOwnProperty('radius');\n}\n\n/** @internal */\nexport function isBarGeometry(ig: IndexedGeometry): ig is BarGeometry {\n  return ig.hasOwnProperty('width') && ig.hasOwnProperty('height');\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @public */\nexport type GroupId = string;\n/** @public */\nexport type AxisId = string;\n/** @public */\nexport type SpecId = string;\n/** @public */\nexport type AnnotationId = string;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LayoutDirection } from './common';\nimport { LegendPositionConfig } from '../specs/settings';\n\n/** @internal */\nexport const isHorizontalLegend = (legendPosition: LegendPositionConfig) =>\n  legendPosition.direction === LayoutDirection.Horizontal;\n\n/** @internal */\nexport const isHierarchicalLegend = (flatLegend: boolean | undefined, legendPosition: LegendPositionConfig) =>\n  !flatLegend && !isHorizontalLegend(legendPosition);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* eslint-disable no-console */\n\n/**\n * Helper class to assist with logging warnings\n *\n * @internal\n * @todo Add more helpful messages in dev for configuration errors\n */\nexport class Logger {\n  static namespace = '[@elastic/charts]';\n\n  /**\n   * Log warning to console\n   *\n   * @param message\n   * @param optionalParams\n   */\n  static warn(message?: unknown, ...optionalParams: unknown[]) {\n    if (Logger.isDevelopment() && !Logger.isTest()) {\n      console.warn(`${Logger.namespace} ${message}`, ...optionalParams);\n    }\n  }\n\n  /**\n   * Log expected value warning to console\n   */\n  static expected(message: unknown, expected: unknown, received: unknown) {\n    if (Logger.isDevelopment() && !Logger.isTest()) {\n      console.warn(\n        `${Logger.namespace} ${message}`,\n        `\\n\n  Expected: ${expected}\n  Received: ${received}\n`,\n      );\n    }\n  }\n\n  /**\n   * Log error to console\n   *\n   * @param message\n   * @param optionalParams\n   */\n  static error(message?: unknown, ...optionalParams: unknown[]) {\n    if (Logger.isDevelopment() && !Logger.isTest()) {\n      console.error(`${Logger.namespace} ${message}`, ...optionalParams);\n    }\n  }\n\n  /**\n   * Determined development env\n   *\n   * @todo confirm this logic works\n   * @todo add more robust logic\n   */\n  private static isDevelopment(): boolean {\n    return process.env.NODE_ENV !== 'production';\n  }\n\n  /**\n   * Determined development env\n   *\n   * @todo confirm this logic works\n   * @todo add more robust logic\n   */\n  private static isTest(): boolean {\n    return process.env.NODE_ENV === 'test';\n  }\n}\n\n/* eslint-enable */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @public */\nexport interface Point {\n  x: number;\n  y: number;\n}\n\n/** @internal * */\nexport function getDelta(start: Point, end: Point) {\n  return Math.sqrt(Math.pow(end.x - start.x, 2) + Math.pow(end.y - start.y, 2));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SeriesIdentifier } from '../common/series_id';\n\n/**\n * A compare function used to determine the order of the elements. It is expected to return\n * a negative value if first argument is less than second argument, zero if they're equal and a positive\n * value otherwise.\n * @public\n */\nexport type SeriesCompareFn = (siA: SeriesIdentifier, siB: SeriesIdentifier) => number;\n\nconst DEFAULT_SORTING_FN = () => 0; // this should cause no reorder, as [].sort is now a stable sort in browsers\n\n/** @internal */\nexport const getRenderingCompareFn = (defaultSortFn: SeriesCompareFn = DEFAULT_SORTING_FN) => defaultSortFn;\n\n/** @internal */\nexport const getLegendCompareFn = (defaultSortFn: SeriesCompareFn = DEFAULT_SORTING_FN) => defaultSortFn;\n\n/** @internal */\nexport const getTooltipCompareFn = (defaultSortFn: SeriesCompareFn = DEFAULT_SORTING_FN) => defaultSortFn;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Font } from '../../common/text_utils';\nimport { monotonicHillClimb } from '../../solvers/monotonic_hill_climb';\nimport { TextMeasure } from '../bbox/canvas_text_bbox_calculator';\n\nconst ELLIPSIS = '…';\n\ninterface WrapTextLines extends Array<string> {\n  meta: {\n    truncated: boolean;\n  };\n}\n\n/** @internal */\nexport function wrapText(\n  text: string,\n  font: Font,\n  fontSize: number,\n  maxLineWidth: number,\n  maxLines: number,\n  measure: TextMeasure,\n  locale: string,\n): WrapTextLines {\n  const lines: WrapTextLines = [] as any;\n  lines.meta = {\n    truncated: false,\n  };\n\n  if (maxLines <= 0) {\n    return lines;\n  }\n  const segmenter = textSegmenter(locale);\n  // remove new lines and multi-spaces.\n  const cleanedText = text.replaceAll('\\n', ' ').replaceAll(/ +(?= )/g, '');\n\n  const segments = Array.from(segmenter(cleanedText)).map((d) => ({\n    ...d,\n    width: measure(d.segment, font, fontSize).width,\n  }));\n\n  const ellipsisWidth = measure(ELLIPSIS, font, fontSize).width;\n  let currentLineWidth = 0;\n  for (const segment of segments) {\n    // the word is longer then the available space and is not a space\n    if (currentLineWidth + segment.width > maxLineWidth && segment.segment.trimStart().length > 0) {\n      // TODO call breakLongTextIntoLines with the remaining lines\n      const multilineText = breakLongTextIntoLines(segment.segment, font, fontSize, maxLineWidth, Infinity, measure);\n      // required to break the loop when a word can't fit into the next line. In this case, we don't want to skip that\n      // long word, but we want to interrupt the loop\n      if (multilineText.length === 0) {\n        break;\n      }\n      lines.push(...multilineText);\n      currentLineWidth = multilineText.length > 0 ? measure(multilineText.at(-1) ?? '', font, fontSize).width : 0;\n    } else {\n      const lineIndex = lines.length > 0 ? lines.length - 1 : 0;\n      lines[lineIndex] = (lines[lineIndex] ?? '') + segment.segment;\n      currentLineWidth += segment.width;\n    }\n  }\n  if (lines.length > maxLines) {\n    lines.meta.truncated = true;\n    const lastLineMaxLineWidth = maxLineWidth - ellipsisWidth;\n    const lastLine = clipTextToWidth(lines[maxLines - 1] ?? '', font, fontSize, lastLineMaxLineWidth, measure);\n    if (lastLine.length > 0) {\n      lines.splice(maxLines - 1, Infinity, `${lastLine}${ELLIPSIS}`);\n    } else {\n      if (lastLineMaxLineWidth > 0) {\n        lines.splice(maxLines - 1, Infinity, ELLIPSIS);\n      } else {\n        lines.splice(maxLines, Infinity);\n      }\n    }\n  }\n  return lines;\n}\n\nfunction textSegmenter(locale: string): (text: string) => { segment: string; index: number; isWordLike?: boolean }[] {\n  if ('Segmenter' in Intl) {\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    //@ts-ignore\n    const fn = new Intl.Segmenter(locale, { granularity: 'word' });\n    return (text: string) => Array.from(fn.segment(text));\n  } else {\n    return (text: string) => {\n      return text\n        .split(' ')\n        .reduce<{ segment: string; index: number; isWordLike?: boolean }[]>((acc, segment, index, array) => {\n          const currentSegment = {\n            segment,\n            index: index === 0 ? 0 : (acc.at(-1)?.index ?? 0) + 1,\n            isWordLike: true,\n          };\n          acc.push(currentSegment);\n          // adding space to simulate the same behaviour of the segmenter in firefox\n          if (index < array.length - 1) {\n            acc.push({ segment: ' ', index: currentSegment.index + segment.length, isWordLike: false });\n          }\n          return acc;\n        }, []);\n    };\n  }\n}\n\nfunction breakLongTextIntoLines(\n  text: string,\n  font: Font,\n  fontSize: number,\n  lineWidth: number,\n  maxLines: number,\n  measure: TextMeasure,\n) {\n  const lines: string[] = [];\n  let remainingText = text;\n  while (maxLines > lines.length && remainingText.length > 0) {\n    const lineClippedText = clipTextToWidth(remainingText, font, fontSize, lineWidth, measure);\n    if (lineClippedText.length === 0) {\n      break;\n    } else {\n      lines.push(lineClippedText.trimStart());\n      remainingText = remainingText.slice(lineClippedText.length, Infinity);\n    }\n  }\n  return lines;\n}\n\nfunction clipTextToWidth(text: string, font: Font, fontSize: number, width: number, measure: TextMeasure): string {\n  const maxCharsInLine = monotonicHillClimb(\n    (chars) => measure(text.slice(0, chars), font, fontSize).width,\n    text.length,\n    width,\n    (n: number) => Math.floor(n),\n    0,\n  );\n  return text.slice(0, maxCharsInLine || 0);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartBaseColors } from './theme';\n\n/** @public */\nexport const LIGHT_BASE_COLORS: ChartBaseColors = {\n  emptyShade: '#FFF',\n  lightestShade: '#F1F4FA',\n  lightShade: '#D3DAE6',\n  mediumShade: '#98A2B3',\n  darkShade: '#69707D',\n  darkestShade: '#343741',\n  title: '#1A1C21',\n};\n\n/** @public */\nexport const DARK_BASE_COLORS: ChartBaseColors = {\n  emptyShade: '#1D1E24',\n  lightestShade: '#25262E',\n  lightShade: '#343741',\n  mediumShade: '#535966',\n  darkShade: '#98A2B3',\n  darkestShade: '#D4DAE5',\n  title: '#DFE5EF',\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport interface ColorScales {\n  [key: string]: string;\n}\n\ninterface EchPalette {\n  colors: string[];\n}\n\nconst echPaletteColorBlind: EchPalette = {\n  colors: [\n    '#54B399',\n    '#6092C0',\n    '#9170B8',\n    '#CA8EAE',\n    '#D36086',\n    '#E7664C',\n    '#AA6556',\n    '#DA8B45',\n    '#B9A888',\n    '#D6BF57',\n  ],\n  // TODO swap colors for original colors after main changes\n  // colors: [\n  //   '#54B399',\n  //   '#6092C0',\n  //   '#D36086',\n  //   '#9170B8',\n  //   '#CA8EAE',\n  //   '#D6BF57',\n  //   '#B9A888',\n  //   '#DA8B45',\n  //   '#AA6556',\n  //   '#E7664C',\n  // ],\n};\n\nconst echPaletteForLightBackground: EchPalette = {\n  colors: ['#006BB4', '#017D73', '#F5A700', '#BD271E', '#DD0A73'],\n};\n\nconst echPaletteForDarkBackground: EchPalette = {\n  colors: ['#1BA9F5', '#7DE2D1', '#F990C0', '#F66', '#FFCE7A'],\n};\n\nconst echPaletteForStatus: EchPalette = {\n  colors: [\n    '#209280',\n    '#359F8A',\n    '#4AAC94',\n    '#6EB58C',\n    '#A2BA71',\n    '#DD9B53',\n    '#E4784E',\n    '#E2634A',\n    '#D75C46',\n    '#CC5642',\n  ],\n};\n\n/** @internal */\nexport const palettes = {\n  echPaletteColorBlind,\n  echPaletteForLightBackground,\n  echPaletteForDarkBackground,\n  echPaletteForStatus,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DARK_BASE_COLORS } from './base_colors';\nimport { palettes } from './colors';\nimport { Theme } from './theme';\nimport { DEFAULT_CHART_MARGINS, DEFAULT_CHART_PADDING, DEFAULT_GEOMETRY_STYLES } from './theme_common';\nimport { DARK_THEME_BULLET_STYLE } from '../../chart_types/bullet_graph/theme';\nimport { Colors } from '../../common/colors';\nimport { TAU } from '../../common/constants';\nimport { DEFAULT_FONT_FAMILY } from '../../common/default_theme_attributes';\nimport { ColorVariant } from '../common';\n\n/** @public */\nexport const DARK_THEME: Theme = {\n  chartPaddings: DEFAULT_CHART_PADDING,\n  chartMargins: DEFAULT_CHART_MARGINS,\n  lineSeriesStyle: {\n    line: {\n      visible: true,\n      strokeWidth: 2,\n      opacity: 1,\n    },\n    point: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 2,\n      fill: DARK_BASE_COLORS.emptyShade,\n      radius: 3,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n    },\n  },\n  bubbleSeriesStyle: {\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n  },\n  areaSeriesStyle: {\n    area: {\n      visible: true,\n      opacity: 0.3,\n    },\n    line: {\n      visible: true,\n      strokeWidth: 2,\n      opacity: 1,\n    },\n    point: {\n      visible: false,\n      stroke: ColorVariant.Series,\n      strokeWidth: 2,\n      fill: DARK_BASE_COLORS.emptyShade,\n      radius: 3,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n      area: {\n        visible: true,\n        opacity: 0.15,\n        fill: ColorVariant.Series,\n      },\n    },\n  },\n  barSeriesStyle: {\n    rect: {\n      opacity: 1,\n    },\n    rectBorder: {\n      visible: false,\n      strokeWidth: 1,\n    },\n    displayValue: {\n      fontSize: 10,\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      alignment: { horizontal: 'center', vertical: 'middle' },\n      padding: 0,\n      fill: { textBorder: 0 },\n      offsetX: 0,\n      offsetY: 0,\n    },\n  },\n  arcSeriesStyle: {\n    arc: {\n      visible: true,\n      stroke: 'white',\n      strokeWidth: 1,\n      opacity: 1,\n    },\n  },\n  sharedStyle: DEFAULT_GEOMETRY_STYLES,\n  scales: {\n    barsPadding: 0.25,\n    histogramPadding: 0.05,\n  },\n  axes: {\n    axisTitle: {\n      fontSize: 12,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      padding: {\n        inner: 10,\n        outer: 0,\n      },\n      fill: DARK_BASE_COLORS.title,\n      visible: true,\n    },\n    axisPanelTitle: {\n      fontSize: 10,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#D4D4D4',\n      visible: true,\n    },\n    axisLine: {\n      visible: true,\n      stroke: DARK_BASE_COLORS.lightShade,\n      strokeWidth: 1,\n    },\n    tickLabel: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fontStyle: 'normal',\n      fill: '#81858f',\n      padding: { outer: 8, inner: 10 },\n      rotation: 0,\n      offset: {\n        x: 0,\n        y: 0,\n        reference: 'local',\n      },\n      alignment: {\n        vertical: 'near',\n        horizontal: 'near',\n      },\n    },\n    tickLine: {\n      visible: false,\n      stroke: DARK_BASE_COLORS.lightShade,\n      strokeWidth: 1,\n      size: 10,\n      padding: 10,\n    },\n    gridLine: {\n      horizontal: {\n        visible: true,\n        stroke: DARK_BASE_COLORS.lightShade,\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      vertical: {\n        visible: true,\n        stroke: DARK_BASE_COLORS.lightShade,\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [4, 4],\n      },\n      lumaSteps: [63, 103, 159, 191, 223, 255, 255, 255, 255, 255, 255, 255, 255, 255, 255, 255],\n    },\n  },\n  colors: {\n    vizColors: palettes.echPaletteColorBlind.colors,\n    defaultVizColor: '#6092C0',\n  },\n  legend: {\n    verticalWidth: 200,\n    horizontalHeight: 64,\n    spacingBuffer: 10,\n    margin: 0,\n    labelOptions: {\n      maxLines: 1,\n    },\n  },\n  crosshair: {\n    band: {\n      visible: true,\n      fill: '#2a2b33', // DARK_BASE_COLORS.lightestShade,\n    },\n    line: {\n      visible: true,\n      stroke: DARK_BASE_COLORS.darkShade,\n      strokeWidth: 1,\n      dash: [4, 4],\n    },\n    crossLine: {\n      visible: true,\n      stroke: DARK_BASE_COLORS.darkShade,\n      strokeWidth: 1,\n      dash: [4, 4],\n    },\n  },\n  background: {\n    color: DARK_BASE_COLORS.emptyShade,\n    fallbackColor: DARK_BASE_COLORS.emptyShade,\n  },\n  goal: {\n    minFontSize: 8,\n    maxFontSize: 64,\n    maxCircularSize: 360,\n    maxBulletSize: 500,\n    barThicknessMinSizeRatio: 1 / 10,\n    baselineArcThickness: 32,\n    baselineBarThickness: 32,\n    marginRatio: 0.05,\n    maxTickFontSize: 24,\n    maxLabelFontSize: 32,\n    maxCentralFontSize: 38,\n    arcBoxSamplePitch: (5 / 360) * TAU,\n    capturePad: 16,\n    tickLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#81858f',\n    },\n    majorLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: DARK_BASE_COLORS.title,\n    },\n    minorLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#81858f',\n    },\n    majorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: DARK_BASE_COLORS.title,\n    },\n    minorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#81858f',\n    },\n    targetLine: {\n      stroke: '#D4DAE5',\n    },\n    tickLine: {\n      stroke: DARK_BASE_COLORS.mediumShade,\n    },\n    progressLine: {\n      stroke: '#D4DAE5',\n    },\n  },\n  partition: {\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    fontFamily: DEFAULT_FONT_FAMILY,\n    minFontSize: 8,\n    maxFontSize: 64,\n    idealFontSizeJump: 1.05,\n    maximizeFontSize: false,\n    circlePadding: 4,\n    radialPadding: TAU / 360,\n    horizontalTextAngleThreshold: TAU / 12,\n    horizontalTextEnforcer: 1,\n    fillLabel: {\n      textColor: ColorVariant.Adaptive,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      valueFont: {\n        fontWeight: 700,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n      padding: 2,\n      clipText: false,\n    },\n    linkLabel: {\n      maximumSection: 10,\n      fontFamily: 'Sans-Serif',\n      fontSize: 11,\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      gap: 10,\n      spacing: 2,\n      horizontalStemLength: 10,\n      radiusPadding: 10,\n      lineWidth: 1,\n      maxCount: 5,\n      maxTextLength: 100,\n      textColor: DARK_BASE_COLORS.title,\n      minimumStemLength: 0,\n      stemAngle: TAU / 8,\n      padding: 0,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n    },\n    sectorLineWidth: 1.5,\n    sectorLineStroke: DARK_BASE_COLORS.emptyShade,\n  },\n  heatmap: {\n    brushArea: {\n      visible: true,\n      stroke: '#D3DAE6', // DARK_BASE_COLORS.darkestShade,\n      strokeWidth: 2,\n    },\n    brushMask: {\n      visible: true,\n      fill: '#8c8c8c80',\n    },\n    brushTool: {\n      visible: false,\n      fill: 'snow',\n    },\n\n    xAxisLabel: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fontStyle: 'normal',\n      textColor: Colors.White.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n      rotation: 0,\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      fontSize: 12,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fontStyle: 'normal',\n      textColor: Colors.White.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n    },\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'snow',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 'fill',\n      align: 'center',\n      label: {\n        visible: true,\n        maxWidth: 'fill',\n        minFontSize: 8,\n        maxFontSize: 12,\n        fontFamily: DEFAULT_FONT_FAMILY,\n        fontStyle: 'normal',\n        textColor: Colors.White.keyword,\n        fontVariant: 'normal',\n        fontWeight: 'normal',\n        useGlobalMinFontSize: true,\n      },\n      border: {\n        strokeWidth: 1,\n        stroke: 'snow',\n      },\n    },\n  },\n  metric: {\n    text: {\n      lightColor: '#E0E5EE', //DARK_BASE_COLORS.title,\n      darkColor: DARK_BASE_COLORS.lightShade,\n    },\n    border: DARK_BASE_COLORS.lightShade,\n    barBackground: DARK_BASE_COLORS.lightShade,\n    emptyBackground: Colors.Transparent.keyword,\n    nonFiniteText: 'N/A',\n    minHeight: 64,\n  },\n  bulletGraph: DARK_THEME_BULLET_STYLE,\n  tooltip: {\n    maxWidth: 500,\n    maxTableHeight: 120,\n    defaultDotColor: Colors.White.keyword,\n  },\n  // TODO map colors to base color mappings\n  flamegraph: {\n    navigation: {\n      textColor: DARK_BASE_COLORS.title,\n      buttonTextColor: '#36A2EF',\n      buttonDisabledTextColor: '#515761',\n      buttonBackgroundColor: '#36A2EF33',\n      buttonDisabledBackgroundColor: '#34374126',\n    },\n    scrollbarThumb: DARK_BASE_COLORS.title,\n    scrollbarTrack: DARK_BASE_COLORS.lightShade,\n  },\n  highlighter: {\n    point: {\n      opacity: 1,\n      fill: ColorVariant.None,\n      stroke: ColorVariant.Series,\n      strokeWidth: 4,\n      radius: 10,\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { palettes } from './colors';\nimport { Theme } from './theme';\nimport {\n  DEFAULT_GEOMETRY_STYLES,\n  DEFAULT_MISSING_COLOR,\n  LEGACY_CHART_MARGINS,\n  LEGACY_CHART_PADDING,\n} from './theme_common';\nimport { DARK_THEME_BULLET_STYLE } from '../../chart_types/bullet_graph/theme';\nimport { Colors } from '../../common/colors';\nimport { GOLDEN_RATIO, TAU } from '../../common/constants';\nimport { ColorVariant } from '../common';\n\n/**\n * Legacy dark chart theme to be removed at some point\n *\n * @public\n * @deprecated Use new `DARK_THEME`\n */\nexport const LEGACY_DARK_THEME: Theme = {\n  chartPaddings: LEGACY_CHART_PADDING,\n  chartMargins: LEGACY_CHART_MARGINS,\n  lineSeriesStyle: {\n    line: {\n      visible: true,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n    point: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n    },\n  },\n  bubbleSeriesStyle: {\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n  },\n  areaSeriesStyle: {\n    area: {\n      visible: true,\n      opacity: 0.3,\n    },\n    line: {\n      visible: true,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n    point: {\n      visible: false,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n      area: {\n        visible: true,\n        opacity: 0.15,\n        fill: ColorVariant.Series,\n      },\n    },\n  },\n  barSeriesStyle: {\n    rect: {\n      opacity: 1,\n    },\n    rectBorder: {\n      visible: false,\n      strokeWidth: 1,\n    },\n    displayValue: {\n      fontSize: 8,\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      padding: 0,\n      fill: '#999',\n      offsetX: 0,\n      offsetY: 0,\n    },\n  },\n  arcSeriesStyle: {\n    arc: {\n      visible: true,\n      stroke: 'white',\n      strokeWidth: 1,\n      opacity: 1,\n    },\n  },\n  sharedStyle: DEFAULT_GEOMETRY_STYLES,\n  scales: {\n    barsPadding: 0.25,\n    histogramPadding: 0.05,\n  },\n  axes: {\n    axisTitle: {\n      fontSize: 12,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#D4D4D4',\n      visible: true,\n    },\n    axisPanelTitle: {\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#D4D4D4',\n      visible: true,\n    },\n    axisLine: {\n      visible: true,\n      stroke: '#444',\n      strokeWidth: 1,\n    },\n    tickLabel: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      fontStyle: 'normal',\n      fill: '#999',\n      padding: 0,\n      rotation: 0,\n      offset: {\n        x: 0,\n        y: 0,\n        reference: 'local',\n      },\n      alignment: {\n        vertical: 'near',\n        horizontal: 'near',\n      },\n    },\n    tickLine: {\n      visible: true,\n      stroke: '#444',\n      strokeWidth: 1,\n      size: 10,\n      padding: 10,\n    },\n    gridLine: {\n      horizontal: {\n        visible: false,\n        stroke: '#D3DAE6',\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      vertical: {\n        visible: false,\n        stroke: '#D3DAE6',\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      lumaSteps: [63, 103, 159, 191, 223, 255, 255, 255, 255, 255, 255, 255, 255, 255, 255, 255],\n    },\n  },\n  colors: {\n    vizColors: palettes.echPaletteColorBlind.colors,\n    defaultVizColor: DEFAULT_MISSING_COLOR,\n  },\n  legend: {\n    verticalWidth: 200,\n    horizontalHeight: 64,\n    spacingBuffer: 10,\n    margin: 0,\n    labelOptions: {\n      maxLines: 1,\n    },\n  },\n  crosshair: {\n    band: {\n      fill: '#2A2A2A',\n      visible: true,\n    },\n    line: {\n      stroke: '#999',\n      strokeWidth: 1,\n      visible: true,\n    },\n    crossLine: {\n      stroke: '#999',\n      strokeWidth: 1,\n      dash: [5, 5],\n      visible: true,\n    },\n  },\n  background: {\n    color: 'transparent',\n    fallbackColor: Colors.Black.keyword,\n  },\n  goal: {\n    minFontSize: 8,\n    maxFontSize: 64,\n    maxCircularSize: 360,\n    maxBulletSize: 500,\n    barThicknessMinSizeRatio: 1 / 10,\n    baselineArcThickness: 32,\n    baselineBarThickness: 32,\n    marginRatio: 0.05,\n    maxTickFontSize: 24,\n    maxLabelFontSize: 32,\n    maxCentralFontSize: 38,\n    arcBoxSamplePitch: (5 / 360) * TAU,\n    capturePad: 16,\n    tickLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    majorLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    minorLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    majorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    minorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    targetLine: {\n      stroke: 'white',\n    },\n    tickLine: {\n      stroke: 'snow',\n    },\n    progressLine: {\n      stroke: 'white',\n    },\n  },\n  partition: {\n    outerSizeRatio: 1 / GOLDEN_RATIO,\n    emptySizeRatio: 0,\n    fontFamily: 'Sans-Serif',\n    minFontSize: 8,\n    maxFontSize: 64,\n    idealFontSizeJump: 1.05,\n    maximizeFontSize: false,\n    circlePadding: 2,\n    radialPadding: TAU / 360,\n    horizontalTextAngleThreshold: TAU / 12,\n    horizontalTextEnforcer: 1,\n    fillLabel: {\n      textColor: ColorVariant.Adaptive,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n      padding: 2,\n      clipText: false,\n    },\n    linkLabel: {\n      maximumSection: 10,\n      fontFamily: 'Sans-Serif',\n      fontSize: 12,\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      gap: 10,\n      spacing: 2,\n      horizontalStemLength: 10,\n      radiusPadding: 10,\n      lineWidth: 1,\n      maxCount: 36,\n      maxTextLength: 100,\n      textColor: ColorVariant.Adaptive,\n      minimumStemLength: 0,\n      stemAngle: TAU / 8,\n      padding: 0,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n    },\n    sectorLineWidth: 1,\n    sectorLineStroke: Colors.Black.keyword,\n  },\n  heatmap: {\n    brushArea: {\n      visible: true,\n      stroke: '#D3DAE6', // euiColorLightShade,\n      strokeWidth: 2,\n    },\n    brushMask: {\n      visible: true,\n      fill: '#8c8c8c80',\n    },\n    brushTool: {\n      visible: false,\n      fill: 'snow',\n    },\n\n    xAxisLabel: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.White.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n      rotation: 0,\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.White.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n    },\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'snow',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 'fill',\n      align: 'center',\n      label: {\n        visible: true,\n        maxWidth: 'fill',\n        minFontSize: 8,\n        maxFontSize: 12,\n        fontFamily: 'Sans-Serif',\n        fontStyle: 'normal',\n        textColor: Colors.White.keyword,\n        fontVariant: 'normal',\n        fontWeight: 'normal',\n        useGlobalMinFontSize: true,\n      },\n      border: {\n        strokeWidth: 1,\n        stroke: 'snow',\n      },\n    },\n  },\n  metric: {\n    text: {\n      lightColor: '#E0E5EE',\n      darkColor: '#343741',\n    },\n    border: '#343741',\n    barBackground: '#343741',\n    emptyBackground: Colors.Transparent.keyword,\n    nonFiniteText: 'N/A',\n    minHeight: 64,\n  },\n  bulletGraph: DARK_THEME_BULLET_STYLE,\n  tooltip: {\n    maxWidth: 500,\n    maxTableHeight: 120,\n    defaultDotColor: Colors.White.keyword,\n  },\n  flamegraph: {\n    navigation: {\n      textColor: 'rgb(223, 229, 239)',\n      buttonTextColor: 'rgb(54, 162, 239)',\n      buttonDisabledTextColor: 'rgb(81, 87, 97)',\n      buttonBackgroundColor: '#36a2ef33',\n      buttonDisabledBackgroundColor: 'rgba(52, 55, 65, 0.15)',\n    },\n    scrollbarThumb: 'rgb(223, 229, 239)',\n    scrollbarTrack: 'rgb(52, 55, 65)',\n  },\n  highlighter: {\n    point: {\n      opacity: 1,\n      fill: ColorVariant.None,\n      stroke: ColorVariant.Series,\n      strokeWidth: 4,\n      radius: 10,\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { palettes } from './colors';\nimport { Theme } from './theme';\nimport {\n  DEFAULT_GEOMETRY_STYLES,\n  DEFAULT_MISSING_COLOR,\n  LEGACY_CHART_MARGINS,\n  LEGACY_CHART_PADDING,\n} from './theme_common';\nimport { LIGHT_THEME_BULLET_STYLE } from '../../chart_types/bullet_graph/theme';\nimport { Colors } from '../../common/colors';\nimport { GOLDEN_RATIO, TAU } from '../../common/constants';\nimport { ColorVariant } from '../common';\n\n/**\n * Legacy light chart theme to be removed at some point\n *\n * @public\n * @deprecated use new `LIGHT_THEME`\n */\nexport const LEGACY_LIGHT_THEME: Theme = {\n  chartPaddings: LEGACY_CHART_PADDING,\n  chartMargins: LEGACY_CHART_MARGINS,\n  lineSeriesStyle: {\n    line: {\n      visible: true,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      stroke: ColorVariant.Series,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        opacity: 1,\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n      },\n    },\n  },\n  bubbleSeriesStyle: {\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n  },\n  areaSeriesStyle: {\n    area: {\n      visible: true,\n      opacity: 0.3,\n    },\n    line: {\n      visible: true,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n    point: {\n      visible: false,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n      area: {\n        visible: true,\n        opacity: 0.15,\n        fill: ColorVariant.Series,\n      },\n    },\n  },\n  barSeriesStyle: {\n    rect: {\n      opacity: 1,\n    },\n    rectBorder: {\n      visible: false,\n      strokeWidth: 1,\n    },\n    displayValue: {\n      fontSize: 8,\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      padding: 0,\n      fill: '#777',\n      offsetX: 0,\n      offsetY: 0,\n    },\n  },\n  arcSeriesStyle: {\n    arc: {\n      visible: true,\n      stroke: Colors.Black.keyword,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n  },\n  sharedStyle: DEFAULT_GEOMETRY_STYLES,\n  scales: {\n    barsPadding: 0.25,\n    histogramPadding: 0.05,\n  },\n  axes: {\n    axisTitle: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#333',\n    },\n    axisPanelTitle: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#333',\n    },\n    axisLine: {\n      visible: true,\n      stroke: '#eaeaea',\n      strokeWidth: 1,\n    },\n    tickLabel: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      fontStyle: 'normal',\n      fill: '#777',\n      padding: 0,\n      rotation: 0,\n      offset: {\n        x: 0,\n        y: 0,\n        reference: 'local',\n      },\n      alignment: {\n        vertical: 'near',\n        horizontal: 'near',\n      },\n    },\n    tickLine: {\n      visible: true,\n      stroke: '#eaeaea',\n      strokeWidth: 1,\n      size: 10,\n      padding: 10,\n    },\n    gridLine: {\n      horizontal: {\n        visible: false,\n        stroke: '#D3DAE6',\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      vertical: {\n        visible: false,\n        stroke: '#D3DAE6',\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      lumaSteps: [224, 184, 128, 96, 64, 32, 16, 8, 4, 2, 1, 0, 0, 0, 0, 0],\n    },\n  },\n  colors: {\n    vizColors: palettes.echPaletteColorBlind.colors,\n    defaultVizColor: DEFAULT_MISSING_COLOR,\n  },\n  legend: {\n    verticalWidth: 200,\n    horizontalHeight: 64,\n    spacingBuffer: 10,\n    margin: 0,\n    labelOptions: {\n      maxLines: 1,\n    },\n  },\n  crosshair: {\n    band: {\n      fill: '#F5F5F5',\n      visible: true,\n    },\n    line: {\n      stroke: '#98A2B3',\n      strokeWidth: 1,\n      visible: true,\n    },\n    crossLine: {\n      stroke: '#98A2B3',\n      strokeWidth: 1,\n      dash: [5, 5],\n      visible: true,\n    },\n  },\n  background: {\n    color: Colors.Transparent.keyword,\n    fallbackColor: Colors.White.keyword,\n  },\n  goal: {\n    minFontSize: 8,\n    maxFontSize: 64,\n    maxCircularSize: 360,\n    maxBulletSize: 500,\n    barThicknessMinSizeRatio: 1 / 10,\n    baselineArcThickness: 32,\n    baselineBarThickness: 32,\n    marginRatio: 0.05,\n    maxTickFontSize: 24,\n    maxLabelFontSize: 32,\n    maxCentralFontSize: 38,\n    arcBoxSamplePitch: (5 / 360) * TAU,\n    capturePad: 16,\n    tickLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    majorLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    minorLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    majorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    minorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    targetLine: {\n      stroke: Colors.Black.keyword,\n    },\n    tickLine: {\n      stroke: 'darkgrey',\n    },\n    progressLine: {\n      stroke: Colors.Black.keyword,\n    },\n  },\n  partition: {\n    outerSizeRatio: 1 / GOLDEN_RATIO,\n    emptySizeRatio: 0,\n    fontFamily: 'Sans-Serif',\n    minFontSize: 8,\n    maxFontSize: 64,\n    idealFontSizeJump: 1.05,\n    maximizeFontSize: false,\n    circlePadding: 2,\n    radialPadding: TAU / 360,\n    horizontalTextAngleThreshold: TAU / 12,\n    horizontalTextEnforcer: 1,\n    fillLabel: {\n      textColor: ColorVariant.Adaptive,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n      padding: 2,\n      clipText: false,\n    },\n    linkLabel: {\n      maximumSection: 10,\n      fontFamily: 'Sans-Serif',\n      fontSize: 12,\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      gap: 10,\n      spacing: 2,\n      horizontalStemLength: 10,\n      radiusPadding: 10,\n      lineWidth: 1,\n      maxCount: 36,\n      maxTextLength: 100,\n      textColor: ColorVariant.Adaptive,\n      minimumStemLength: 0,\n      stemAngle: TAU / 8,\n      padding: 0,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n    },\n    sectorLineWidth: 1,\n    sectorLineStroke: 'white',\n  },\n  heatmap: {\n    brushArea: {\n      visible: true,\n      stroke: '#69707D', // euiColorDarkShade,\n      strokeWidth: 2,\n    },\n    brushMask: {\n      visible: true,\n      fill: '#73737380',\n    },\n    brushTool: {\n      visible: false,\n      fill: 'gray',\n    },\n    xAxisLabel: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n      rotation: 0,\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n    },\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'gray',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 'fill',\n      align: 'center',\n      label: {\n        visible: true,\n        maxWidth: 'fill',\n        minFontSize: 8,\n        maxFontSize: 12,\n        fontFamily: 'Sans-Serif',\n        fontStyle: 'normal',\n        textColor: Colors.Black.keyword,\n        fontVariant: 'normal',\n        fontWeight: 'normal',\n        useGlobalMinFontSize: true,\n      },\n      border: {\n        strokeWidth: 1,\n        stroke: 'gray',\n      },\n    },\n  },\n  metric: {\n    text: {\n      lightColor: '#E0E5EE',\n      darkColor: '#343741',\n    },\n    border: '#EDF0F5',\n    barBackground: '#EDF0F5',\n    emptyBackground: Colors.Transparent.keyword,\n    nonFiniteText: 'N/A',\n    minHeight: 64,\n  },\n  bulletGraph: LIGHT_THEME_BULLET_STYLE,\n  tooltip: {\n    maxWidth: 500,\n    maxTableHeight: 120,\n    defaultDotColor: Colors.Black.keyword,\n  },\n  flamegraph: {\n    navigation: {\n      textColor: 'rgb(52, 55, 65)',\n      buttonTextColor: 'rgb(0, 97, 166)',\n      buttonDisabledTextColor: 'rgb(162, 171, 186)',\n      buttonBackgroundColor: 'rgb(204, 228, 245)',\n      buttonDisabledBackgroundColor: 'rgba(211, 218, 230, 0.15)',\n    },\n    scrollbarThumb: 'rgb(52, 55, 65)',\n    scrollbarTrack: 'rgb(211, 218, 230)',\n  },\n  highlighter: {\n    point: {\n      opacity: 1,\n      fill: ColorVariant.None,\n      stroke: ColorVariant.Series,\n      strokeWidth: 4,\n      radius: 10,\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LIGHT_BASE_COLORS } from './base_colors';\nimport { palettes } from './colors';\nimport { Theme } from './theme';\nimport { DEFAULT_CHART_MARGINS, DEFAULT_CHART_PADDING, DEFAULT_GEOMETRY_STYLES } from './theme_common';\nimport { LIGHT_THEME_BULLET_STYLE } from '../../chart_types/bullet_graph/theme';\nimport { Colors } from '../../common/colors';\nimport { TAU } from '../../common/constants';\nimport { DEFAULT_FONT_FAMILY } from '../../common/default_theme_attributes';\nimport { ColorVariant } from '../common';\n\n/** @public */\nexport const LIGHT_THEME: Theme = {\n  chartPaddings: DEFAULT_CHART_PADDING,\n  chartMargins: DEFAULT_CHART_MARGINS,\n  lineSeriesStyle: {\n    line: {\n      visible: true,\n      strokeWidth: 2,\n      opacity: 1,\n    },\n    point: {\n      visible: true,\n      strokeWidth: 2,\n      stroke: ColorVariant.Series,\n      fill: LIGHT_BASE_COLORS.emptyShade,\n      radius: 3,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        opacity: 1,\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n      },\n    },\n  },\n  bubbleSeriesStyle: {\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n  },\n  areaSeriesStyle: {\n    area: {\n      visible: true,\n      opacity: 0.3,\n    },\n    line: {\n      visible: true,\n      strokeWidth: 2,\n      opacity: 1,\n    },\n    point: {\n      visible: false,\n      stroke: ColorVariant.Series,\n      strokeWidth: 2,\n      fill: LIGHT_BASE_COLORS.emptyShade,\n      radius: 3,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n      area: {\n        visible: true,\n        opacity: 0.15,\n        fill: ColorVariant.Series,\n      },\n    },\n  },\n  barSeriesStyle: {\n    rect: {\n      opacity: 1,\n    },\n    rectBorder: {\n      visible: false,\n      strokeWidth: 1,\n    },\n    displayValue: {\n      fontSize: 10,\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      alignment: { horizontal: 'center', vertical: 'middle' },\n      padding: 0,\n      fill: { textBorder: 0 },\n      offsetX: 0,\n      offsetY: 0,\n    },\n  },\n  arcSeriesStyle: {\n    arc: {\n      visible: true,\n      stroke: Colors.Black.keyword,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n  },\n  sharedStyle: DEFAULT_GEOMETRY_STYLES,\n  scales: {\n    barsPadding: 0.25,\n    histogramPadding: 0.05,\n  },\n  axes: {\n    axisTitle: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      padding: {\n        inner: 10,\n        outer: 0,\n      },\n      fill: LIGHT_BASE_COLORS.darkestShade,\n    },\n    axisPanelTitle: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#333', // LIGHT_BASE_COLORS.darkestShade,\n    },\n    axisLine: {\n      visible: true,\n      stroke: '#eaedf3', // LIGHT_BASE_COLORS.lightShade,\n      strokeWidth: 1,\n    },\n    tickLabel: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fontStyle: 'normal',\n      fill: '#646a77', // LIGHT_BASE_COLORS.darkShade,\n      padding: { outer: 8, inner: 10 },\n      rotation: 0,\n      offset: {\n        x: 0,\n        y: 0,\n        reference: 'local',\n      },\n      alignment: {\n        vertical: 'near',\n        horizontal: 'near',\n      },\n    },\n    tickLine: {\n      visible: false,\n      stroke: '#eaedf3', // LIGHT_BASE_COLORS.lightShade,\n      strokeWidth: 1,\n      size: 10,\n      padding: 10,\n    },\n    gridLine: {\n      horizontal: {\n        visible: true,\n        stroke: '#eaedf3', // LIGHT_BASE_COLORS.lightShade,\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      vertical: {\n        visible: true,\n        stroke: '#eaedf3', // LIGHT_BASE_COLORS.lightShade,\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [4, 4],\n      },\n      lumaSteps: [224, 184, 128, 96, 64, 32, 16, 8, 4, 2, 1, 0, 0, 0, 0, 0],\n    },\n  },\n  colors: {\n    vizColors: palettes.echPaletteColorBlind.colors,\n    defaultVizColor: '#6092C0',\n  },\n  legend: {\n    verticalWidth: 200,\n    horizontalHeight: 64,\n    spacingBuffer: 10,\n    margin: 0,\n    labelOptions: {\n      maxLines: 1,\n    },\n  },\n  crosshair: {\n    band: {\n      visible: true,\n      fill: LIGHT_BASE_COLORS.lightestShade,\n    },\n    line: {\n      visible: true,\n      stroke: LIGHT_BASE_COLORS.darkShade,\n      strokeWidth: 1,\n      dash: [4, 4],\n    },\n    crossLine: {\n      visible: true,\n      stroke: LIGHT_BASE_COLORS.darkShade,\n      strokeWidth: 1,\n      dash: [4, 4],\n    },\n  },\n  background: {\n    color: LIGHT_BASE_COLORS.emptyShade,\n    fallbackColor: LIGHT_BASE_COLORS.emptyShade,\n  },\n  goal: {\n    minFontSize: 8,\n    maxFontSize: 64,\n    maxCircularSize: 360,\n    maxBulletSize: 500,\n    barThicknessMinSizeRatio: 1 / 10,\n    baselineArcThickness: 32,\n    baselineBarThickness: 32,\n    marginRatio: 0.05,\n    maxTickFontSize: 24,\n    maxLabelFontSize: 32,\n    maxCentralFontSize: 38,\n    arcBoxSamplePitch: (5 / 360) * TAU,\n    capturePad: 16,\n    tickLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#646a77', // LIGHT_BASE_COLORS.darkShade,\n    },\n    majorLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: LIGHT_BASE_COLORS.darkestShade,\n    },\n    minorLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#646a77', // LIGHT_BASE_COLORS.darkShade,\n    },\n    majorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: LIGHT_BASE_COLORS.darkestShade,\n    },\n    minorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#646a77', // LIGHT_BASE_COLORS.darkShade,\n    },\n    targetLine: {\n      stroke: LIGHT_BASE_COLORS.darkestShade,\n    },\n    tickLine: {\n      stroke: LIGHT_BASE_COLORS.mediumShade,\n    },\n    progressLine: {\n      stroke: LIGHT_BASE_COLORS.darkestShade,\n    },\n  },\n  partition: {\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    fontFamily: DEFAULT_FONT_FAMILY,\n    minFontSize: 8,\n    maxFontSize: 16,\n    idealFontSizeJump: 1.05,\n    maximizeFontSize: false,\n    circlePadding: 4,\n    radialPadding: TAU / 360,\n    horizontalTextAngleThreshold: TAU / 12,\n    horizontalTextEnforcer: 1,\n    fillLabel: {\n      textColor: ColorVariant.Adaptive,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      valueFont: {\n        fontWeight: 700,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n      padding: 2,\n      clipText: false,\n    },\n    linkLabel: {\n      maximumSection: 10,\n      fontFamily: 'Sans-Serif',\n      fontSize: 11,\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      gap: 10,\n      spacing: 2,\n      horizontalStemLength: 10,\n      radiusPadding: 10,\n      lineWidth: 1,\n      maxCount: 5,\n      maxTextLength: 100,\n      textColor: LIGHT_BASE_COLORS.darkestShade,\n      minimumStemLength: 0,\n      stemAngle: TAU / 8,\n      padding: 0,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n    },\n    sectorLineWidth: 1.5,\n    sectorLineStroke: LIGHT_BASE_COLORS.emptyShade,\n  },\n  heatmap: {\n    brushArea: {\n      visible: true,\n      stroke: LIGHT_BASE_COLORS.darkShade,\n      strokeWidth: 2,\n    },\n    brushMask: {\n      visible: true,\n      fill: '#73737380',\n    },\n    brushTool: {\n      visible: false,\n      fill: 'gray',\n    },\n    xAxisLabel: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n      rotation: 0,\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n    },\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'gray',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 'fill',\n      align: 'center',\n      label: {\n        visible: true,\n        maxWidth: 'fill',\n        minFontSize: 8,\n        maxFontSize: 12,\n        fontFamily: 'Sans-Serif',\n        fontStyle: 'normal',\n        textColor: Colors.Black.keyword,\n        fontVariant: 'normal',\n        fontWeight: 'normal',\n        useGlobalMinFontSize: true,\n      },\n      border: {\n        strokeWidth: 1,\n        stroke: 'gray',\n      },\n    },\n  },\n  metric: {\n    text: {\n      lightColor: '#E0E5EE', // LIGHT_BASE_COLORS.title,\n      darkColor: LIGHT_BASE_COLORS.darkestShade,\n    },\n    border: '#EDF0F5', // LIGHT_BASE_COLORS.lightShade,\n    barBackground: '#EDF0F5', // LIGHT_BASE_COLORS.lightShade,\n    emptyBackground: Colors.Transparent.keyword,\n    nonFiniteText: 'N/A',\n    minHeight: 64,\n  },\n  bulletGraph: LIGHT_THEME_BULLET_STYLE,\n  tooltip: {\n    maxWidth: 500,\n    maxTableHeight: 120,\n    defaultDotColor: Colors.Black.keyword,\n  },\n  // TODO map colors to base color mappings\n  flamegraph: {\n    navigation: {\n      textColor: LIGHT_BASE_COLORS.darkestShade,\n      buttonTextColor: '#0061A6',\n      buttonDisabledTextColor: '#A2ABBA',\n      buttonBackgroundColor: '#CCE4F5',\n      buttonDisabledBackgroundColor: '#D3DAE626',\n    },\n    scrollbarThumb: LIGHT_BASE_COLORS.darkestShade,\n    scrollbarTrack: LIGHT_BASE_COLORS.lightShade,\n  },\n  highlighter: {\n    point: {\n      opacity: 1,\n      fill: ColorVariant.None,\n      stroke: ColorVariant.Series,\n      strokeWidth: 4,\n      radius: 10,\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LineAnnotationStyle, RectAnnotationStyle } from './theme';\nimport { mergePartial, RecursivePartial } from '../common';\n\n/** @public */\nexport const DEFAULT_ANNOTATION_LINE_STYLE: LineAnnotationStyle = {\n  line: {\n    stroke: '#777',\n    strokeWidth: 1,\n    opacity: 1,\n  },\n};\n/** @public */\nexport const DEFAULT_ANNOTATION_RECT_STYLE: RectAnnotationStyle = {\n  stroke: '#FFEEBC',\n  strokeWidth: 0,\n  opacity: 0.25,\n  fill: '#FFEEBC',\n};\n\n/** @public */\nexport function mergeWithDefaultAnnotationLine(config?: RecursivePartial<LineAnnotationStyle>): LineAnnotationStyle {\n  return mergePartial(DEFAULT_ANNOTATION_LINE_STYLE, config);\n}\n\n/** @public */\nexport function mergeWithDefaultAnnotationRect(config?: RecursivePartial<RectAnnotationStyle>): RectAnnotationStyle {\n  return mergePartial(DEFAULT_ANNOTATION_RECT_STYLE, config);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../common/colors';\nimport { Pixels, Distance, Radian, SizeRatio, Ratio } from '../../common/geometry';\nimport { Font, PartialFont, FontFamily } from '../../common/text_utils';\nimport { ColorVariant, StrokeStyle } from '../common';\nimport { PerSideDistance } from '../dimensions';\n\ninterface LabelConfig extends Font {\n  textColor: Color | typeof ColorVariant.Adaptive;\n  valueFont: PartialFont;\n  padding: Pixels | Partial<Padding>;\n}\n\n/** @public */\nexport type Padding = Pixels | Partial<PerSideDistance>;\n\n/** @public */\nexport interface FillLabelConfig extends LabelConfig {\n  clipText: boolean;\n}\n\n/** @public */\nexport interface FillFontSizeRange {\n  minFontSize: Pixels;\n  maxFontSize: Pixels;\n  idealFontSizeJump: Ratio;\n  /**\n   * When `maximizeFontSize` is false (the default), text font will not be larger than font sizes in larger sectors/rectangles in the same pie chart,\n   * sunburst ring or treemap layer. When it is set to true, the largest font, not exceeding `maxFontSize`, that fits in the slice/sector/rectangle\n   * will be chosen for easier text readability, irrespective of the value.\n   */\n  maximizeFontSize: boolean;\n}\n\n/** @public */\nexport interface LinkLabelConfig extends LabelConfig {\n  fontSize: Pixels; // todo consider putting it in Font\n  /**\n   * Uses linked labels below this limit of the outer sector arc length (in pixels)\n   */\n  maximumSection: Distance;\n  gap: Pixels;\n  spacing: Pixels;\n  minimumStemLength: Distance;\n  stemAngle: Radian;\n  horizontalStemLength: Distance;\n  radiusPadding: Distance;\n  lineWidth: Pixels;\n  /**\n   * Limits the total count of linked labels. The first N largest slices are kept.\n   */\n  maxCount: number;\n  /**\n   * Limits the total number of characters in linked labels.\n   */\n  maxTextLength: number;\n}\n\n/** @public */\nexport interface PartitionStyle extends FillFontSizeRange {\n  /**\n   * The diameter of the inner circle, relative to `outerSizeRatio`\n   */\n  emptySizeRatio: SizeRatio;\n  /**\n   * The diameter of the entire circle, relative to the smaller of the usable rectangular size (smaller of width/height minus the margins)\n   */\n  outerSizeRatio: SizeRatio;\n  fontFamily: FontFamily;\n  circlePadding: Distance;\n  radialPadding: Distance;\n  horizontalTextAngleThreshold: Radian;\n  horizontalTextEnforcer: Ratio;\n  fillLabel: FillLabelConfig;\n  linkLabel: LinkLabelConfig;\n  sectorLineWidth: Pixels;\n  sectorLineStroke: StrokeStyle;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\nimport { $Values } from 'utility-types';\n\nimport { PartitionStyle } from './partition';\nimport { BulletStyle } from '../../chart_types/bullet_graph/theme';\nimport { Color } from '../../common/colors';\nimport { Pixels, Radian, Ratio } from '../../common/geometry';\nimport { Font, FontStyle } from '../../common/text_utils';\nimport { ColorVariant, HorizontalAlignment, RecursivePartial, VerticalAlignment } from '../common';\nimport { Margins, Padding, SimplePadding } from '../dimensions';\nimport { Point } from '../point';\n\n/**\n * Base color definitions - theme-specific\n * @public\n */\nexport interface ChartBaseColors {\n  emptyShade: string;\n  lightShade: string;\n  lightestShade: string;\n  mediumShade: string;\n  darkShade: string;\n  darkestShade: string;\n  title: string;\n}\n\n/** @public */\nexport interface Visible {\n  visible: boolean;\n}\n\n/** @public */\nexport interface TextStyle {\n  fontSize: number;\n  fontFamily: string;\n  fontStyle?: FontStyle;\n  fill: Color;\n  padding: number | SimplePadding;\n}\n\n/**\n * Offset in pixels\n * @public\n */\nexport interface TextOffset {\n  /**\n   * X offset of tick in px or string with % of height\n   */\n  x: number | string;\n  /**\n   * X offset of tick in px or string with % of height\n   */\n  y: number | string;\n  /**\n   * Offset coordinate system reference\n   *\n   * - `global` - aligns offset coordinate system to global (non-rotated) coordinate system\n   * - `local` - aligns offset coordinate system to local rotated coordinate system\n   */\n  reference: 'global' | 'local';\n}\n\n/**\n * Text alignment\n * @public\n */\nexport interface TextAlignment {\n  horizontal: HorizontalAlignment;\n  vertical: VerticalAlignment;\n}\n\n/**\n * Tooltip styles\n * @public\n */\nexport interface TooltipStyle {\n  /**\n   * Sets max width of tooltip\n   */\n  maxWidth: NonNullable<CSSProperties['maxWidth']>;\n  /**\n   * Sets max height of scrolling tooltip table body\n   */\n  maxTableHeight: CSSProperties['maxHeight'];\n  /**\n   * Color used as fallback when contrast logic fails\n   */\n  defaultDotColor: Color;\n}\n\n/**\n * Shared style properties for varies geometries\n * @public\n */\nexport interface GeometryStyle {\n  /**\n   * Opacity multiplier\n   *\n   * if set to `0.5` all given opacities will be halfed\n   */\n  opacity: number;\n}\n\n/**\n * Shared style properties for varies geometries\n * @public\n */\nexport interface GeometryStateStyle {\n  /**\n   * Opacity multiplier\n   *\n   * if set to `0.5` all given opacities will be halfed\n   */\n  opacity: number;\n}\n\n/** @public */\nexport interface SharedGeometryStateStyle<S extends CSSProperties = GeometryStateStyle> {\n  default: S;\n  highlighted: S;\n  unhighlighted: S;\n}\n\n/**\n * The stroke color style\n * @public\n */\nexport interface StrokeStyle<C = Color> {\n  /** The stroke color in hex, rgba, hsl */\n  stroke: C;\n  /** The stroke width in pixel */\n  strokeWidth: number;\n}\n\n/** @public */\nexport type TickStyle = StrokeStyle &\n  Visible & {\n    /**\n     * Amount of padding between tick line and labels\n     */\n    padding: number;\n    /**\n     * length of tick line\n     */\n    size: number;\n  };\n\n/**\n * The dash array for a stroke\n * @public\n */\nexport interface StrokeDashArray {\n  /** The dash array for dashed strokes */\n  dash: number[];\n}\n/** @public */\nexport interface FillStyle {\n  /** The fill color in hex, rgba, hsl */\n  fill: Color;\n}\n/** @public */\nexport interface Opacity {\n  /** The opacity value from 0 to 1 */\n  opacity: number;\n}\n\n/** @public */\nexport interface AxisStyle {\n  axisTitle: TextStyle & Visible;\n  axisPanelTitle: TextStyle & Visible;\n  axisLine: StrokeStyle & Visible;\n  tickLabel: TextStyle &\n    Visible & {\n      /** The degrees of rotation of the tick labels */\n      rotation: number;\n      /**\n       * Offset in pixels to render text relative to anchor\n       *\n       * **Note:** rotation aligns to global cartesian coordinates\n       */\n      offset: TextOffset;\n      alignment: TextAlignment;\n    };\n  tickLine: TickStyle;\n  gridLine: {\n    horizontal: GridLineStyle;\n    vertical: GridLineStyle;\n    lumaSteps: number[];\n  };\n}\n\n/**\n * @public\n */\nexport interface GridLineStyle {\n  visible: boolean;\n  stroke: Color;\n  strokeWidth: number;\n  opacity: number;\n  dash: number[];\n}\n\n/**\n * @public\n */\nexport interface GoalStyles {\n  progressLine: Pick<StrokeStyle, 'stroke'>;\n  targetLine: Pick<StrokeStyle, 'stroke'>;\n  tickLine: Pick<StrokeStyle, 'stroke'>;\n  tickLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  majorLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  minorLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  majorCenterLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  minorCenterLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  minFontSize: number;\n  maxFontSize: number;\n  /**\n   * Circular goal/gauge size limit. The chart will _NOT_ be bigger even if there's ample room.\n   */\n  maxCircularSize: number;\n  /**\n   * Bullet goal/gauge size limit. The chart will _NOT_ be bigger even if there's ample room.\n   */\n  maxBulletSize: number;\n  /**\n   * The bar thickness is a maximum of this fraction of the smaller graph area size\n   */\n  barThicknessMinSizeRatio: number;\n  /**\n   * Bar thickness if there's ample room, no need for greater thickness even if there's a large area\n   */\n  baselineArcThickness: number;\n  /**\n   * Bar thickness if there's ample room, no need for greater thickness even if there's a large area\n   */\n  baselineBarThickness: number;\n  /**\n   * same ratio on each side\n   */\n  marginRatio: number;\n  maxTickFontSize: number;\n  maxLabelFontSize: number;\n  maxCentralFontSize: number;\n  /**\n   * 5-degree pitch ie. a circle is 72 steps\n   */\n  arcBoxSamplePitch: Radian;\n  /**\n   * mouse hover is detected in the padding too (eg. for Fitts law)\n   */\n  capturePad: number;\n}\n\n/**\n * @public\n */\nexport interface HeatmapStyle {\n  /**\n   * Config of the mask over the area outside of the selected cells\n   */\n  brushMask: { visible: boolean; fill: Color };\n  /**\n   * Config of the mask over the selected cells\n   */\n  brushArea: { visible: boolean; fill?: Color; stroke: Color; strokeWidth: number };\n  /**\n   * Config of the brushing tool\n   */\n  brushTool: {\n    visible: boolean;\n    // TODO add support for changing the brush tool color\n    fill: Color;\n  };\n  xAxisLabel: Font & {\n    fontSize: Pixels;\n    visible: boolean;\n    padding: Pixels | Padding;\n    /**\n     * Positive 0 - 90 degree angle\n     * @defaultValue 0\n     */\n    rotation: number;\n  };\n  yAxisLabel: Font & {\n    fontSize: Pixels;\n    width: Pixels | 'auto' | { max: Pixels };\n    visible: boolean;\n    padding: Pixels | Padding;\n  };\n  grid: {\n    stroke: {\n      color: string;\n      width: number;\n    };\n  };\n  cell: {\n    maxWidth: Pixels | 'fill';\n    maxHeight: Pixels | 'fill';\n    align: 'center';\n    label: Font & {\n      minFontSize: Pixels;\n      maxFontSize: Pixels;\n      useGlobalMinFontSize: boolean;\n      maxWidth: Pixels | 'fill';\n      visible: boolean;\n    };\n    border: {\n      strokeWidth: Pixels;\n      stroke: Color;\n    };\n  };\n  maxLegendHeight?: number;\n}\n\n/** @public */\nexport interface MetricStyle {\n  text: {\n    darkColor: Color;\n    lightColor: Color;\n  };\n  border: Color;\n  barBackground: Color;\n  emptyBackground: Color;\n  /**\n   * Optional color used to blend transparent colors. Defaults to `Theme.background`\n   */\n  blendingBackground?: Color;\n  nonFiniteText: string;\n  minHeight: Pixels;\n}\n\n/** @alpha */\nexport interface FlamegraphStyle {\n  navigation: {\n    textColor: Color;\n    buttonTextColor: Color;\n    buttonDisabledTextColor: Color;\n    buttonBackgroundColor: Color;\n    buttonDisabledBackgroundColor: Color;\n  };\n  scrollbarTrack: Color;\n  scrollbarThumb: Color;\n}\n\n/** @public */\nexport interface ScalesConfig {\n  /**\n   * The proportion of the range that is reserved for blank space between bands.\n   * A value of 0 means no blank space between bands, and a value of 1 means a bandwidth of zero.\n   * A number between 0 and 1.\n   */\n  barsPadding: number;\n  /**\n   * The proportion of the range that is reserved for blank space between bands in histogramMode.\n   * A value of 0 means no blank space between bands, and a value of 1 means a bandwidth of zero.\n   * A number between 0 and 1.\n   */\n  histogramPadding: number;\n}\n/** @public */\nexport interface ColorConfig {\n  vizColors: Color[];\n  defaultVizColor: Color;\n}\n/**\n * The background style applied to the chart.\n * This is used to coordinate adequate contrast of the text in partition and treemap charts.\n * @public\n */\nexport interface BackgroundStyle {\n  /**\n   * The background color\n   */\n  color: string;\n  /**\n   * The fallback background color used for constrast logic.\n   * Must be opaque, alpha value will be ignored otherwise.\n   */\n  fallbackColor: Color;\n}\n\n/** @public */\nexport interface LegendLabelOptions {\n  /**\n   * Sets maxlines allowable before truncating\n   *\n   * Setting value to `0` will _never_ truncate the text\n   *\n   * @defaultValue 1\n   */\n  maxLines: number;\n}\n\n/** @public */\nexport interface LegendStyle {\n  /**\n   * Max width used for left/right legend\n   *\n   * or\n   *\n   * Width of `LegendItem` for top/bottom legend\n   */\n  verticalWidth: number;\n  /**\n   * Max height used for top/bottom legend\n   */\n  horizontalHeight: number;\n  /**\n   * Added buffer between label and value.\n   *\n   * Smaller values render a more compact legend\n   */\n  spacingBuffer: number;\n  /**\n   * Legend padding. The Chart margins are independent of the legend.\n   *\n   * TODO: make SimplePadding when after axis changes are added\n   */\n  margin: number;\n  /**\n   * Options to control legend labels\n   */\n  labelOptions: LegendLabelOptions;\n}\n/** @public */\nexport interface Theme {\n  /**\n   * Space btw parent DOM element and first available element of the chart (axis if exists, else the chart itself)\n   */\n  chartMargins: Margins;\n  /**\n   * Space btw the chart geometries and axis; if no axis, pads space btw chart & container\n   */\n  chartPaddings: Margins;\n  /**\n   * Global line styles.\n   *\n   * __Note:__ This is not used to set the color of a specific series. As such, any changes to the styles will not be reflected in the tooltip, legend, etc..\n   *\n   * You may use `SeriesColorAccessor` to assign colors to a given series or replace the `theme.colors.vizColors` colors to your desired colors.\n   */\n  lineSeriesStyle: LineSeriesStyle;\n  /**\n   * Global area styles.\n   *\n   * __Note:__ This is not used to set the color of a specific series. As such, any changes to the styles will not be reflected in the tooltip, legend, etc..\n   *\n   * You may use `SeriesColorAccessor` to assign colors to a given series or replace the `theme.colors.vizColors` colors to your desired colors.\n   */\n  areaSeriesStyle: AreaSeriesStyle;\n  /**\n   * Global bar styles.\n   *\n   * __Note:__ This is not used to set the color of a specific series. As such, any changes to the styles will not be reflected in the tooltip, legend, etc..\n   *\n   * You may use `SeriesColorAccessor` to assign colors to a given series or replace the `theme.colors.vizColors` colors to your desired colors.\n   */\n  barSeriesStyle: BarSeriesStyle;\n  /**\n   * Global bubble styles.\n   *\n   * __Note:__ This is not used to set the color of a specific series. As such, any changes to the styles will not be reflected in the tooltip, legend, etc..\n   *\n   * You may use `SeriesColorAccessor` to assign colors to a given series or replace the `theme.colors.vizColors` colors to your desired colors.\n   */\n  bubbleSeriesStyle: BubbleSeriesStyle;\n  arcSeriesStyle: ArcSeriesStyle;\n  sharedStyle: SharedGeometryStateStyle;\n  axes: AxisStyle;\n  scales: ScalesConfig;\n  colors: ColorConfig;\n  legend: LegendStyle;\n  crosshair: CrosshairStyle;\n  /**\n   * Used to scale radius with `markSizeAccessor`\n   *\n   * value from 1 to 100\n   */\n  markSizeRatio?: number;\n  /**\n   * The background allows the consumer to provide a color of the background container of the chart.\n   * This can then be used to calculate the contrast of the text for partition charts.\n   */\n  background: BackgroundStyle;\n  /**\n   * Theme styles for goal and gauge chart types\n   */\n  goal: GoalStyles;\n  /**\n   * Theme styles for partition chart types\n   */\n  partition: PartitionStyle;\n  /**\n   * Theme styles for heatmap chart types\n   */\n  heatmap: HeatmapStyle;\n  /**\n   * Theme styles for metric chart types\n   */\n  metric: MetricStyle;\n\n  /**\n   * Theme styles for bullet graph types\n   */\n  bulletGraph: BulletStyle;\n  /**\n   * Theme styles for tooltip\n   */\n  tooltip: TooltipStyle;\n\n  /** @alpha */\n  flamegraph: FlamegraphStyle;\n\n  highlighter: HighlighterStyle;\n}\n\n/** @public */\nexport type PartialTheme = RecursivePartial<Theme>;\n\n/** @public */\nexport type DisplayValueStyle = Omit<TextStyle, 'fill' | 'fontSize'> & {\n  offsetX: number;\n  offsetY: number;\n  fontSize:\n    | number\n    | {\n        min: number;\n        max: number;\n      };\n  fill:\n    | Color\n    | { color: Color; borderColor?: Color; borderWidth?: number }\n    | {\n        textBorder?: number;\n      };\n  alignment?: {\n    horizontal: Exclude<HorizontalAlignment, 'far' | 'near'>;\n    vertical: Exclude<VerticalAlignment, 'far' | 'near'>;\n  };\n};\n\n/** @public */\nexport const PointShape = Object.freeze({\n  Circle: 'circle' as const,\n  Square: 'square' as const,\n  Diamond: 'diamond' as const,\n  Plus: 'plus' as const,\n  X: 'x' as const,\n  Triangle: 'triangle' as const,\n});\n/** @public */\nexport type PointShape = $Values<typeof PointShape>;\n\n/** @public */\nexport interface PointStyle {\n  /** is the point visible or hidden */\n  visible: boolean;\n  /** a static stroke color if defined, if not it will use the color of the series */\n  stroke?: Color | ColorVariant;\n  /** the stroke width of the point */\n  strokeWidth: number;\n  /**  a static fill color if defined, if not it will use the color of the series */\n  fill?: Color | ColorVariant;\n  /** the opacity of each point on the theme/series */\n  opacity: number;\n  /** the radius of each point of the theme/series */\n  radius: Pixels;\n  /** shape for the point, default to circle */\n  shape?: PointShape;\n}\n\n/** @public */\nexport interface LineStyle {\n  /** is the line visible or hidden ? */\n  visible: boolean;\n  /** a static stroke color if defined, if not it will use the color of the series */\n  stroke?: Color | ColorVariant;\n  /** the stroke width of the line */\n  strokeWidth: number;\n  /** the opacity of each line on the theme/series */\n  opacity: number;\n  /** the dash array */\n  dash?: number[];\n}\n\n/** @public */\nexport const TextureShape = Object.freeze({\n  ...PointShape,\n  Line: 'line' as const,\n});\n/** @public */\nexport type TextureShape = $Values<typeof TextureShape>;\n\n/** @public */\nexport interface TexturedStylesBase {\n  /** polygon fill color for texture */\n  fill?: Color | ColorVariant;\n  /** polygon stroke color for texture */\n  stroke?: Color | ColorVariant;\n  /** polygon stroke width for texture  */\n  strokeWidth?: number;\n  /** polygon opacity for texture  */\n  opacity?: number;\n  /** polygon opacity for texture  */\n  dash?: number[];\n  /** polygon opacity for texture  */\n  size?: number;\n  /**\n   * The angle of rotation for entire texture\n   * in degrees\n   */\n  rotation?: number;\n  /**\n   * The angle of rotation for polygons\n   * in degrees\n   */\n  shapeRotation?: number;\n  /** texture spacing between polygons */\n  spacing?: Partial<Point> | number;\n  /** overall origin offset of pattern */\n  offset?: Partial<Point> & {\n    /** apply offset along global coordinate axes */\n    global?: boolean;\n  };\n}\n\n/** @public */\nexport interface TexturedShapeStyles extends TexturedStylesBase {\n  /** typed of texture designs currently supported */\n  shape: TextureShape;\n}\n\n/** @public */\nexport interface TexturedPathStyles extends TexturedStylesBase {\n  /** path for polygon texture */\n  path: string | Path2D;\n}\n\n/**\n * @public\n *\n * Texture style config for area spec\n */\nexport type TexturedStyles = TexturedPathStyles | TexturedShapeStyles;\n\n/** @public */\nexport interface AreaStyle {\n  /** applying textures to the area on the theme/series */\n  texture?: TexturedStyles;\n  /** is the area is visible or hidden ? */\n  visible: boolean;\n  /** a static fill color if defined, if not it will use the color of the series */\n  fill?: Color | ColorVariant;\n  /** the opacity of each area on the theme/series */\n  opacity: number;\n}\n\n/** @public */\nexport interface ArcStyle {\n  /** is the arc is visible or hidden ? */\n  visible: boolean;\n  /** a static fill color if defined, if not it will use the color of the series */\n  fill?: Color | ColorVariant;\n  /** a static stroke color if defined, if not it will use the color of the series */\n  stroke?: Color | ColorVariant;\n  /** the stroke width of the line */\n  strokeWidth: number;\n  /** the opacity of each arc on the theme/series */\n  opacity: number;\n}\n\n/** @public */\nexport interface RectStyle {\n  /** a static fill color if defined, if not it will use the color of the series */\n  fill?: Color | ColorVariant;\n  /** the opacity of each rect on the theme/series */\n  opacity: number;\n  /** The width of the rect in pixel. If expressed together with `widthRatio` then the `widthRatio`\n   * will express the max available size, where the `widthPixel` express the derived/min width. */\n  widthPixel?: Pixels;\n  /** The ratio of the width limited to [0,1]. If expressed together with `widthPixel` then the `widthRatio`\n   * will express the max available size, where the `widthPixel` express the derived/min width. */\n  widthRatio?: Ratio;\n  /** applying textures to the bar on the theme/series */\n  texture?: TexturedStyles;\n}\n\n/** @public */\nexport interface RectBorderStyle {\n  /**\n   * Border visibility\n   */\n  visible: boolean;\n  /**\n   * Border stroke color\n   */\n  stroke?: Color | ColorVariant;\n  /**\n   * Border stroke width\n   */\n  strokeWidth: number;\n  /**\n   * Border stroke opacity\n   */\n  strokeOpacity?: number;\n}\n/** @public */\nexport interface BarSeriesStyle {\n  rect: RectStyle;\n  rectBorder: RectBorderStyle;\n  displayValue: DisplayValueStyle;\n}\n\n/** @public */\nexport interface BubbleSeriesStyle {\n  point: PointStyle;\n}\n\n/** @public */\nexport interface LineSeriesStyle {\n  line: LineStyle;\n  point: PointStyle;\n  isolatedPoint: PointStyle;\n  fit: {\n    line: LineFitStyle;\n  };\n}\n\n/** @public */\nexport interface AreaSeriesStyle {\n  area: AreaStyle;\n  line: LineStyle;\n  point: PointStyle;\n  isolatedPoint: PointStyle;\n  fit: {\n    line: LineFitStyle;\n    area: AreaFitStyle;\n  };\n}\n\n/** @public */\nexport type AreaFitStyle = Visible &\n  Opacity & {\n    fill: Color | typeof ColorVariant.Series;\n    texture?: TexturedStyles;\n  };\n\n/** @public */\nexport type LineFitStyle = Visible &\n  Opacity &\n  StrokeDashArray & {\n    stroke: Color | typeof ColorVariant.Series;\n  };\n\n/** @public */\nexport interface ArcSeriesStyle {\n  arc: ArcStyle;\n}\n\n/** @public */\nexport interface CrosshairStyle {\n  band: FillStyle & Visible;\n  line: StrokeStyle & Visible & Partial<StrokeDashArray>;\n  crossLine: StrokeStyle & Visible & Partial<StrokeDashArray>;\n}\n\n/**\n * The style for a linear annotation\n * @public\n */\nexport interface LineAnnotationStyle {\n  /**\n   * The style for the line geometry\n   */\n  line: StrokeStyle & Opacity & Partial<StrokeDashArray>;\n}\n\n/** @public */\nexport type RectAnnotationStyle = StrokeStyle & FillStyle & Opacity & Partial<StrokeDashArray>;\n\n/** @public */\nexport interface HighlighterStyle {\n  point: {\n    fill: Color | ColorVariant;\n    stroke: Color | ColorVariant;\n    strokeWidth: Pixels;\n    opacity: Ratio;\n    radius: Pixels;\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SharedGeometryStateStyle } from './theme';\nimport { Colors } from '../../common/colors';\nimport { Margins } from '../dimensions';\n\n/** @internal */\nexport const DEFAULT_MISSING_COLOR = Colors.Red.keyword;\n\n/** @internal */\nexport const DEFAULT_CHART_PADDING: Margins = {\n  left: 0,\n  right: 0,\n  top: 0,\n  bottom: 0,\n};\n/** @internal */\nexport const DEFAULT_CHART_MARGINS: Margins = {\n  left: 0,\n  right: 0,\n  top: 0,\n  bottom: 0,\n};\n\n/**\n * Remove in next step to limit diffs\n * @internal\n */\nexport const LEGACY_CHART_PADDING: Margins = {\n  left: 0,\n  right: 0,\n  top: 0,\n  bottom: 0,\n};\n\n/**\n * Remove in next step to limit diffs\n * @internal\n */\nexport const LEGACY_CHART_MARGINS: Margins = {\n  left: 10,\n  right: 10,\n  top: 10,\n  bottom: 10,\n};\n\n/** @internal */\nexport const DEFAULT_GEOMETRY_STYLES: SharedGeometryStateStyle = {\n  default: {\n    opacity: 1,\n  },\n  highlighted: {\n    opacity: 1,\n  },\n  unhighlighted: {\n    opacity: 0.25,\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport bezier from 'bezier-easing';\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const TimeFunction = Object.freeze({\n  /**\n   * Animation with the same speed from start to end\n   */\n  linear: 'linear' as const,\n  /**\n   * Animation with a slow start, then fast, then end slowly (this is default)\n   */\n  ease: 'ease' as const,\n  /**\n   * Animation with a slow start\n   */\n  easeIn: 'easeIn' as const,\n  /**\n   * Animation with a slow end\n   */\n  easeOut: 'easeOut' as const,\n  /**\n   * Animation with a slow start and end\n   */\n  easeInOut: 'easeInOut' as const,\n});\n/** @public */\nexport type TimeFunction = $Values<typeof TimeFunction>;\n\n/**\n * Unit normalized time. Value ranges between 0 and 1.\n * @internal */\nexport type UnitTime = number;\n\n/** @internal */\nexport interface TimingFunction {\n  (time: UnitTime): number;\n\n  /**\n   * Inverts timing function, takes a value from 0 to 1 and returns unit time\n   */\n  inverse: (value: number) => UnitTime;\n}\n\n/** @internal */\nexport interface TimingFunctionValues {\n  y0?: number;\n  y1?: number;\n  t0?: number;\n  t1?: number;\n}\n\nconst getBezierFn = (x1: number, y1: number, x2: number, y2: number): TimingFunction => {\n  const fn: TimingFunction = bezier(x1, y1, x2, y2) as TimingFunction;\n  fn.inverse = bezier(y1, x1, y2, x2);\n  return fn;\n};\n\nconst linear: TimingFunction = ((t) => t) as TimingFunction;\nlinear.inverse = (n) => n;\n\n/**\n * Time functions used by CSS spec\n * See https://developer.mozilla.org/en-US/docs/Web/CSS/easing-function\n * @internal\n */\nexport const TimingFunctions: Record<TimeFunction, TimingFunction> = {\n  linear,\n  ease: getBezierFn(0.25, 0.1, 0.25, 1.0),\n  easeIn: getBezierFn(0.42, 0.0, 1.0, 1.0),\n  easeOut: getBezierFn(0.0, 0.0, 0.58, 1.0),\n  easeInOut: getBezierFn(0.42, 0.0, 0.58, 1.0),\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Logger } from './logger';\n\nconst isValidTimeZone = (timeZone?: string): boolean => {\n  if (!timeZone) return false;\n  try {\n    Intl.DateTimeFormat(undefined, { timeZone });\n    return true;\n  } catch (error) {\n    Logger.warn(`The supplied timeZone ${timeZone} does not exist. The default time zone will be used.`);\n    Logger.warn(error);\n    return false;\n  }\n};\n\n/** @internal */\nexport const getValidatedTimeZone = (specifiedTimeZone?: string): string =>\n  specifiedTimeZone && isValidTimeZone(specifiedTimeZone)\n    ? specifiedTimeZone\n    : Intl.DateTimeFormat().resolvedOptions().timeZone;\n\n/** @internal */\nexport const getZoneFromSpecs = (specs: { timeZone?: string }[]): string => {\n  const allValidTimezones = new Set<string>(specs.map((s) => s.timeZone ?? '').filter(isValidTimeZone));\n  return allValidTimezones.size === 1\n    ? allValidTimezones.values().next().value\n    : Intl.DateTimeFormat().resolvedOptions().timeZone;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegacyRef, useRef } from 'react';\n\n/**\n * This hook handles a11y focus management closing of the action popover\n * @param ref - pass this ref to button for focus to be returned once popover is closed\n * @param onClose - callback to trigger the focus on popover close\n * @public\n */\nexport function useLegendAction<T extends HTMLElement>(): [ref: LegacyRef<T>, onClose: () => void] {\n  const ref = useRef<T>(null);\n  const onClose = () => {\n    if (ref.current) {\n      requestAnimationFrame(() => ref?.current?.focus?.());\n    }\n  };\n\n  return [ref, onClose];\n}\n","module.exports = __webpack_public_path__ + \"static/media/atkinson-hyperlegible-v1-latin-700.87519365.woff\";","module.exports = __webpack_public_path__ + \"static/media/atkinson-hyperlegible-v1-latin-700.5c76634a.woff2\";","module.exports = __webpack_public_path__ + \"static/media/atkinson-hyperlegible-v1-latin-regular.a14f70f0.woff\";","module.exports = __webpack_public_path__ + \"static/media/atkinson-hyperlegible-v1-latin-regular.dcacc3a6.woff2\";","\"use strict\";\n\nvar _frameworkImportPath = require(\"@storybook/react\");\n\n/* eslint-disable import/no-unresolved */\n(0, _frameworkImportPath.configure)([require.context('./stories', true, /^\\.(?:(?:^|\\/|(?:(?:(?!(?:^|\\/)\\.).)*?)\\/)(?!\\.)(?=.)[^/]*?\\.(stories|story)\\.ts(?:x)?)$/)], module, false);","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport euiDarkVars from '@elastic/eui/dist/eui_theme_dark.json';\nimport euiLightVars from '@elastic/eui/dist/eui_theme_light.json';\nimport type { Parameters as SBParameters } from '@storybook/addons';\nimport { BackgroundParameter } from 'storybook-addon-background-toggle';\nimport { ThemeParameter } from 'storybook-addon-theme-toggle';\nimport { TogglesParameter } from 'storybook-addon-toggles';\n\nimport { SB_KNOBS_PANEL, SB_SOURCE_PANEL } from './stories/utils/storybook';\n\n/**\n * Parameter accessible at the global level\n */\ntype Parameters = SBParameters & ThemeParameter & BackgroundParameter & TogglesParameter;\n\nconst euiLogoUrl =\n  'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0ibm9uZSIgdmlld0JveD0iMCAwIDMyIDMyIj4KICA8cGF0aCBmaWxsPSIjRkY5NTdEIiBkPSJNMTggMjVjLS41LTUuNS01LjUtMTAuNS0xMS0xMWw3LTdjLjUgNS41IDUuNSAxMC41IDExIDExbC03IDd6Ii8+CiAgPGNpcmNsZSBjeD0iNyIgY3k9IjciIHI9IjciIGZpbGw9IiNGMDRFOTgiLz4KICA8Y2lyY2xlIGN4PSIyNSIgY3k9IjI1IiByPSI3IiBmaWxsPSIjRkVDNTE0Ii8+CiAgPHBhdGggZmlsbD0iIzAwQkZCMyIgZD0iTTMxIDE0Yy03LjE4IDAtMTMtNS44Mi0xMy0xM2gxM3YxM3oiLz4KICA8cGF0aCBmaWxsPSIjMUJBOUY1IiBkPSJNMSAxOGM3LjE4IDAgMTMgNS44MiAxMyAxM0gxVjE4eiIvPgo8L3N2Zz4K';\n\nexport const storybookParameters: Parameters = {\n  options: {\n    selectedPanel: process.env.NODE_ENV === 'development' ? SB_KNOBS_PANEL : SB_SOURCE_PANEL,\n  },\n  previewTabs: {\n    'storybook/docs/panel': {\n      hidden: true,\n    },\n    canvas: {\n      title: 'Story',\n      hidden: false,\n    },\n  },\n  theme: {\n    default: 'light',\n    clearable: false,\n    selector: 'html',\n    themes: [\n      {\n        id: 'light',\n        title: 'Light',\n        class: 'light-theme',\n        color: euiLightVars.euiColorEmptyShade,\n        imageUrl: euiLogoUrl,\n      },\n      {\n        id: 'dark',\n        title: 'Dark',\n        class: 'dark-theme',\n        color: euiDarkVars.euiColorEmptyShade,\n        imageUrl: euiLogoUrl,\n      },\n      {\n        id: 'legacy-light',\n        title: 'Legacy Light',\n        class: ['light-theme', 'legacy'],\n        color: '#fff',\n      },\n      {\n        id: 'legacy-dark',\n        title: 'Legacy Dark',\n        class: ['dark-theme', 'legacy'],\n        color: '#000',\n      },\n    ],\n  },\n  background: {\n    clearable: true,\n    selector: '#none',\n    options: [\n      { id: 'emptyShadeDark', title: 'Empty Shade - Dark', color: euiDarkVars.euiColorEmptyShade },\n      { id: 'emptyShadeLight', title: 'Empty Shade - Light', color: euiLightVars.euiColorEmptyShade },\n      { id: 'black', title: 'Black', color: '#000' },\n      { id: 'white', title: 'White', color: '#fff' },\n      { id: 'red', title: 'Red', color: '#f04d9a' },\n      { id: 'blue', title: 'Blue', color: '#14abf5' },\n      { id: 'yellow', title: 'Yellow', color: '#fec709' },\n      { id: 'green', title: 'Green', color: '#00c1b4' },\n      { id: 'gray', title: 'Gray', color: 'rgb(237, 240, 245)' },\n    ],\n  },\n  toggles: {\n    ignoreQueryParams: false,\n    options: [\n      {\n        id: 'showHeader',\n        title: 'Show story header',\n        defaultValue: true,\n        disabled: {\n          showChartTitle: true,\n          showChartDescription: true,\n        },\n      },\n      {\n        id: 'showChartTitle',\n        title: 'Show chart title',\n        defaultValue: false,\n      },\n      {\n        id: 'showChartDescription',\n        title: 'Show chart description',\n        defaultValue: false,\n      },\n      {\n        id: 'showChartBoundary',\n        title: 'Show chart boundary',\n        defaultValue: false,\n      },\n    ],\n  },\n  viewport: {\n    viewports: {\n      vrt: {\n        // to match vrt default viewport to help with mouse positioning\n        // See e2e/playwright.config.ts#L20\n        name: 'VRT Viewport',\n        styles: {\n          width: '785px',\n          height: '1000px',\n        },\n      },\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { StoryWrapper } from './story_wrapper';\n\nimport './style.scss';\n\nexport const decorators = [StoryWrapper];\n\nexport { storybookParameters as parameters } from './parameters';\n","function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n/* eslint-disable import/no-unresolved */\nimport { addDecorator, addParameters, addLoader, addArgsEnhancer, addArgTypesEnhancer, setGlobalRender } from '/app/node_modules/@storybook/client-api';\nimport { logger } from '/app/node_modules/@storybook/client-logger';\nimport * as config from '/app/storybook/preview.ts';\nObject.keys(config).forEach(function (key) {\n  var value = config[key];\n\n  switch (key) {\n    case 'args':\n    case 'argTypes':\n      {\n        return logger.warn('Invalid args/argTypes in config, ignoring.', JSON.stringify(value));\n      }\n\n    case 'decorators':\n      {\n        return value.forEach(function (decorator) {\n          return addDecorator(decorator, false);\n        });\n      }\n\n    case 'loaders':\n      {\n        return value.forEach(function (loader) {\n          return addLoader(loader, false);\n        });\n      }\n\n    case 'parameters':\n      {\n        return addParameters(_objectSpread({}, value), false);\n      }\n\n    case 'argTypesEnhancers':\n      {\n        return value.forEach(function (enhancer) {\n          return addArgTypesEnhancer(enhancer);\n        });\n      }\n\n    case 'argsEnhancers':\n      {\n        return value.forEach(function (enhancer) {\n          return addArgsEnhancer(enhancer);\n        });\n      }\n\n    case 'render':\n      {\n        return setGlobalRender(value);\n      }\n\n    case 'globals':\n    case 'globalTypes':\n      {\n        var v = {};\n        v[key] = value;\n        return addParameters(v, false);\n      }\n\n    default:\n      {\n        // eslint-disable-next-line prefer-template\n        return console.log(key + ' was not supported :( !');\n      }\n  }\n});","var map = {\n\t\"./annotations/lines/1_x_continuous.story.tsx\": \"./stories/annotations/lines/1_x_continuous.story.tsx\",\n\t\"./annotations/lines/2_x_ordinal.story.tsx\": \"./stories/annotations/lines/2_x_ordinal.story.tsx\",\n\t\"./annotations/lines/3_x_time.story.tsx\": \"./stories/annotations/lines/3_x_time.story.tsx\",\n\t\"./annotations/lines/4_y_domain.story.tsx\": \"./stories/annotations/lines/4_y_domain.story.tsx\",\n\t\"./annotations/lines/5_styling.story.tsx\": \"./stories/annotations/lines/5_styling.story.tsx\",\n\t\"./annotations/lines/6_test_single_bar_histogram.story.tsx\": \"./stories/annotations/lines/6_test_single_bar_histogram.story.tsx\",\n\t\"./annotations/lines/7_tooltip_options.story.tsx\": \"./stories/annotations/lines/7_tooltip_options.story.tsx\",\n\t\"./annotations/lines/8_advanced_markers.story.tsx\": \"./stories/annotations/lines/8_advanced_markers.story.tsx\",\n\t\"./annotations/lines/line.stories.tsx\": \"./stories/annotations/lines/line.stories.tsx\",\n\t\"./annotations/rects/1_linear_bar_chart.story.tsx\": \"./stories/annotations/rects/1_linear_bar_chart.story.tsx\",\n\t\"./annotations/rects/2_ordinal_bar_chart.story.tsx\": \"./stories/annotations/rects/2_ordinal_bar_chart.story.tsx\",\n\t\"./annotations/rects/3_linear_line_chart.story.tsx\": \"./stories/annotations/rects/3_linear_line_chart.story.tsx\",\n\t\"./annotations/rects/4_styling.story.tsx\": \"./stories/annotations/rects/4_styling.story.tsx\",\n\t\"./annotations/rects/5_tooltip_options.story.tsx\": \"./stories/annotations/rects/5_tooltip_options.story.tsx\",\n\t\"./annotations/rects/6_zero_domain.story.tsx\": \"./stories/annotations/rects/6_zero_domain.story.tsx\",\n\t\"./annotations/rects/7_with_group_id.story.tsx\": \"./stories/annotations/rects/7_with_group_id.story.tsx\",\n\t\"./annotations/rects/8_outside.story.tsx\": \"./stories/annotations/rects/8_outside.story.tsx\",\n\t\"./annotations/rects/9_click_handler.story.tsx\": \"./stories/annotations/rects/9_click_handler.story.tsx\",\n\t\"./annotations/rects/rects.stories.tsx\": \"./stories/annotations/rects/rects.stories.tsx\",\n\t\"./area/10_stacked_same_naming.story.tsx\": \"./stories/area/10_stacked_same_naming.story.tsx\",\n\t\"./area/11_test_linear.story.tsx\": \"./stories/area/11_test_linear.story.tsx\",\n\t\"./area/12_test_time.story.tsx\": \"./stories/area/12_test_time.story.tsx\",\n\t\"./area/13_band_area.story.tsx\": \"./stories/area/13_band_area.story.tsx\",\n\t\"./area/15_stacked_grouped.story.tsx\": \"./stories/area/15_stacked_grouped.story.tsx\",\n\t\"./area/16_test_stacked_with_missing.story.tsx\": \"./stories/area/16_test_stacked_with_missing.story.tsx\",\n\t\"./area/17_negative.story.tsx\": \"./stories/area/17_negative.story.tsx\",\n\t\"./area/18_negative_positive.story.tsx\": \"./stories/area/18_negative_positive.story.tsx\",\n\t\"./area/19_negative_band.story.tsx\": \"./stories/area/19_negative_band.story.tsx\",\n\t\"./area/1_basic.story.tsx\": \"./stories/area/1_basic.story.tsx\",\n\t\"./area/20_stepped_area.story.tsx\": \"./stories/area/20_stepped_area.story.tsx\",\n\t\"./area/21_with_time_timeslip.story.tsx\": \"./stories/area/21_with_time_timeslip.story.tsx\",\n\t\"./area/2_with_time.story.tsx\": \"./stories/area/2_with_time.story.tsx\",\n\t\"./area/3_with_linear.story.tsx\": \"./stories/area/3_with_linear.story.tsx\",\n\t\"./area/4_with_log.story.tsx\": \"./stories/area/4_with_log.story.tsx\",\n\t\"./area/5_with_4_axes.story.tsx\": \"./stories/area/5_with_4_axes.story.tsx\",\n\t\"./area/6_with_axis_and_legend.story.tsx\": \"./stories/area/6_with_axis_and_legend.story.tsx\",\n\t\"./area/7_stacked.story.tsx\": \"./stories/area/7_stacked.story.tsx\",\n\t\"./area/8_stacked_percentage.story.tsx\": \"./stories/area/8_stacked_percentage.story.tsx\",\n\t\"./area/8_stacked_percentage_zeros.story.tsx\": \"./stories/area/8_stacked_percentage_zeros.story.tsx\",\n\t\"./area/9_stacked_separate_specs.story.tsx\": \"./stories/area/9_stacked_separate_specs.story.tsx\",\n\t\"./area/area.stories.tsx\": \"./stories/area/area.stories.tsx\",\n\t\"./axes/10_one_domain_bound.story.tsx\": \"./stories/axes/10_one_domain_bound.story.tsx\",\n\t\"./axes/11_fit_domain_extent.story.tsx\": \"./stories/axes/11_fit_domain_extent.story.tsx\",\n\t\"./axes/12_duplicate_ticks.story.tsx\": \"./stories/axes/12_duplicate_ticks.story.tsx\",\n\t\"./axes/13_label_formatting.story.tsx\": \"./stories/axes/13_label_formatting.story.tsx\",\n\t\"./axes/14_duplicate_ticks_2.story.tsx\": \"./stories/axes/14_duplicate_ticks_2.story.tsx\",\n\t\"./axes/15_maximum_fraction_digits.story.tsx\": \"./stories/axes/15_maximum_fraction_digits.story.tsx\",\n\t\"./axes/1_basic.story.tsx\": \"./stories/axes/1_basic.story.tsx\",\n\t\"./axes/2_tick_label_rotation.story.tsx\": \"./stories/axes/2_tick_label_rotation.story.tsx\",\n\t\"./axes/3_axis_4_axes.story.tsx\": \"./stories/axes/3_axis_4_axes.story.tsx\",\n\t\"./axes/4_multi_axis.story.tsx\": \"./stories/axes/4_multi_axis.story.tsx\",\n\t\"./axes/5_multi_axis_bar_lines.story.tsx\": \"./stories/axes/5_multi_axis_bar_lines.story.tsx\",\n\t\"./axes/6_different_tooltip.story.tsx\": \"./stories/axes/6_different_tooltip.story.tsx\",\n\t\"./axes/6a_different_tooltip_formatter.story.tsx\": \"./stories/axes/6a_different_tooltip_formatter.story.tsx\",\n\t\"./axes/7_many_tick_labels.story.tsx\": \"./stories/axes/7_many_tick_labels.story.tsx\",\n\t\"./axes/8_custom_domain.story.tsx\": \"./stories/axes/8_custom_domain.story.tsx\",\n\t\"./axes/9_custom_mixed_domain.story.tsx\": \"./stories/axes/9_custom_mixed_domain.story.tsx\",\n\t\"./axes/axes.stories.tsx\": \"./stories/axes/axes.stories.tsx\",\n\t\"./bar/10_axis_and_legend.story.tsx\": \"./stories/bar/10_axis_and_legend.story.tsx\",\n\t\"./bar/11_stacked_with_axis_and_legend.story.tsx\": \"./stories/bar/11_stacked_with_axis_and_legend.story.tsx\",\n\t\"./bar/12_stacked_as_percentage.story.tsx\": \"./stories/bar/12_stacked_as_percentage.story.tsx\",\n\t\"./bar/13_clustered.story.tsx\": \"./stories/bar/13_clustered.story.tsx\",\n\t\"./bar/14_clustered_multiple.story.tsx\": \"./stories/bar/14_clustered_multiple.story.tsx\",\n\t\"./bar/15_time_clustered.story.tsx\": \"./stories/bar/15_time_clustered.story.tsx\",\n\t\"./bar/17_time_stacked.story.tsx\": \"./stories/bar/17_time_stacked.story.tsx\",\n\t\"./bar/18_bar_chart_1y0g.story.tsx\": \"./stories/bar/18_bar_chart_1y0g.story.tsx\",\n\t\"./bar/19_bar_chart_1y1g.story.tsx\": \"./stories/bar/19_bar_chart_1y1g.story.tsx\",\n\t\"./bar/1_basic.story.tsx\": \"./stories/bar/1_basic.story.tsx\",\n\t\"./bar/20_bar_chart_1y2g.story.tsx\": \"./stories/bar/20_bar_chart_1y2g.story.tsx\",\n\t\"./bar/21_bar_chart_2y0g.story.tsx\": \"./stories/bar/21_bar_chart_2y0g.story.tsx\",\n\t\"./bar/22_barchart_2y1g.story.tsx\": \"./stories/bar/22_barchart_2y1g.story.tsx\",\n\t\"./bar/23_bar_chart_2y2g.story.tsx\": \"./stories/bar/23_bar_chart_2y2g.story.tsx\",\n\t\"./bar/24_tooltip_visibility.story.tsx\": \"./stories/bar/24_tooltip_visibility.story.tsx\",\n\t\"./bar/25_high_data_volume.story.tsx\": \"./stories/bar/25_high_data_volume.story.tsx\",\n\t\"./bar/26_single_data_linear.story.tsx\": \"./stories/bar/26_single_data_linear.story.tsx\",\n\t\"./bar/27_single_data_ordinal.story.tsx\": \"./stories/bar/27_single_data_ordinal.story.tsx\",\n\t\"./bar/28_single_data_clustered.story.tsx\": \"./stories/bar/28_single_data_clustered.story.tsx\",\n\t\"./bar/29_single_data_stacked.story.tsx\": \"./stories/bar/29_single_data_stacked.story.tsx\",\n\t\"./bar/2_label_value.story.tsx\": \"./stories/bar/2_label_value.story.tsx\",\n\t\"./bar/30_stacked_to_extent.story.tsx\": \"./stories/bar/30_stacked_to_extent.story.tsx\",\n\t\"./bar/31_negative_and_positive_x_values.story.tsx\": \"./stories/bar/31_negative_and_positive_x_values.story.tsx\",\n\t\"./bar/32_scale_to_extent.story.tsx\": \"./stories/bar/32_scale_to_extent.story.tsx\",\n\t\"./bar/33_band_bar.story.tsx\": \"./stories/bar/33_band_bar.story.tsx\",\n\t\"./bar/34_test_linear.story.tsx\": \"./stories/bar/34_test_linear.story.tsx\",\n\t\"./bar/35_test_time.story.tsx\": \"./stories/bar/35_test_time.story.tsx\",\n\t\"./bar/36_test_linear_clustered.story.tsx\": \"./stories/bar/36_test_linear_clustered.story.tsx\",\n\t\"./bar/37_test_time_clustered.story.tsx\": \"./stories/bar/37_test_time_clustered.story.tsx\",\n\t\"./bar/38_test_clustered_null_bars.story.tsx\": \"./stories/bar/38_test_clustered_null_bars.story.tsx\",\n\t\"./bar/39_test_stacked_null.story.tsx\": \"./stories/bar/39_test_stacked_null.story.tsx\",\n\t\"./bar/3_with_axis.story.tsx\": \"./stories/bar/3_with_axis.story.tsx\",\n\t\"./bar/40_test_switch.story.tsx\": \"./stories/bar/40_test_switch.story.tsx\",\n\t\"./bar/41_test_histogram_linear.story.tsx\": \"./stories/bar/41_test_histogram_linear.story.tsx\",\n\t\"./bar/42_test_histogram_ordinal.story.tsx\": \"./stories/bar/42_test_histogram_ordinal.story.tsx\",\n\t\"./bar/43_test_discover.story.tsx\": \"./stories/bar/43_test_discover.story.tsx\",\n\t\"./bar/44_test_single_histogram.story.tsx\": \"./stories/bar/44_test_single_histogram.story.tsx\",\n\t\"./bar/45_min_height.story.tsx\": \"./stories/bar/45_min_height.story.tsx\",\n\t\"./bar/46_test_min_height.story.tsx\": \"./stories/bar/46_test_min_height.story.tsx\",\n\t\"./bar/47_stacked_only_grouped.story.tsx\": \"./stories/bar/47_stacked_only_grouped.story.tsx\",\n\t\"./bar/48_test_tooltip.story.tsx\": \"./stories/bar/48_test_tooltip.story.tsx\",\n\t\"./bar/49_test_dual_axis.story.tsx\": \"./stories/bar/49_test_dual_axis.story.tsx\",\n\t\"./bar/4_ordinal.story.tsx\": \"./stories/bar/4_ordinal.story.tsx\",\n\t\"./bar/50_order_bins_by_sum.story.tsx\": \"./stories/bar/50_order_bins_by_sum.story.tsx\",\n\t\"./bar/51_label_value_advanced.story.tsx\": \"./stories/bar/51_label_value_advanced.story.tsx\",\n\t\"./bar/52_multi_group_same_domain.story.tsx\": \"./stories/bar/52_multi_group_same_domain.story.tsx\",\n\t\"./bar/53_use_domain_from_different_groupid.story.tsx\": \"./stories/bar/53_use_domain_from_different_groupid.story.tsx\",\n\t\"./bar/54_functional_accessors.story.tsx\": \"./stories/bar/54_functional_accessors.story.tsx\",\n\t\"./bar/55_tooltip_boundary.story.tsx\": \"./stories/bar/55_tooltip_boundary.story.tsx\",\n\t\"./bar/56_test_use_dfl_gdomain.story.tsx\": \"./stories/bar/56_test_use_dfl_gdomain.story.tsx\",\n\t\"./bar/57_test_rect_border_bars.story.tsx\": \"./stories/bar/57_test_rect_border_bars.story.tsx\",\n\t\"./bar/58_data_values.story.tsx\": \"./stories/bar/58_data_values.story.tsx\",\n\t\"./bar/5_linear.story.tsx\": \"./stories/bar/5_linear.story.tsx\",\n\t\"./bar/6_linear_no_linear_interval.story.tsx\": \"./stories/bar/6_linear_no_linear_interval.story.tsx\",\n\t\"./bar/7_with_time_xaxis.story.tsx\": \"./stories/bar/7_with_time_xaxis.story.tsx\",\n\t\"./bar/8_with_log_yaxis.story.tsx\": \"./stories/bar/8_with_log_yaxis.story.tsx\",\n\t\"./bar/9_with_stacked_log.story.tsx\": \"./stories/bar/9_with_stacked_log.story.tsx\",\n\t\"./bar/bars.stories.tsx\": \"./stories/bar/bars.stories.tsx\",\n\t\"./bubble/1_simple.story.tsx\": \"./stories/bubble/1_simple.story.tsx\",\n\t\"./bubble/2_ordinal.story.tsx\": \"./stories/bubble/2_ordinal.story.tsx\",\n\t\"./bubble/3_multiple.story.tsx\": \"./stories/bubble/3_multiple.story.tsx\",\n\t\"./bubble/4_mixed.story.tsx\": \"./stories/bubble/4_mixed.story.tsx\",\n\t\"./bubble/mixed.stories.tsx\": \"./stories/bubble/mixed.stories.tsx\",\n\t\"./bullet_graph/1_single.story.tsx\": \"./stories/bullet_graph/1_single.story.tsx\",\n\t\"./bullet_graph/2_angular.story.tsx\": \"./stories/bullet_graph/2_angular.story.tsx\",\n\t\"./bullet_graph/3_color_bands.story.tsx\": \"./stories/bullet_graph/3_color_bands.story.tsx\",\n\t\"./bullet_graph/4_single_row.story.tsx\": \"./stories/bullet_graph/4_single_row.story.tsx\",\n\t\"./bullet_graph/5_single_column.story.tsx\": \"./stories/bullet_graph/5_single_column.story.tsx\",\n\t\"./bullet_graph/6_grid.story.tsx\": \"./stories/bullet_graph/6_grid.story.tsx\",\n\t\"./bullet_graph/bullet_graph.stories.tsx\": \"./stories/bullet_graph/bullet_graph.stories.tsx\",\n\t\"./components/tooltip/10_cartesian_chart.story.tsx\": \"./stories/components/tooltip/10_cartesian_chart.story.tsx\",\n\t\"./components/tooltip/11_partition_chart.story.tsx\": \"./stories/components/tooltip/11_partition_chart.story.tsx\",\n\t\"./components/tooltip/12_heatmap.story.tsx\": \"./stories/components/tooltip/12_heatmap.story.tsx\",\n\t\"./components/tooltip/13_flamegraph.story.tsx\": \"./stories/components/tooltip/13_flamegraph.story.tsx\",\n\t\"./components/tooltip/1_composed_list.story.tsx\": \"./stories/components/tooltip/1_composed_list.story.tsx\",\n\t\"./components/tooltip/2_composed_table.story.tsx\": \"./stories/components/tooltip/2_composed_table.story.tsx\",\n\t\"./components/tooltip/3_tabular_data.story.tsx\": \"./stories/components/tooltip/3_tabular_data.story.tsx\",\n\t\"./components/tooltip/4_actions_with_custom_tooltip.story.tsx\": \"./stories/components/tooltip/4_actions_with_custom_tooltip.story.tsx\",\n\t\"./components/tooltip/5_chart_tooltip.story.tsx\": \"./stories/components/tooltip/5_chart_tooltip.story.tsx\",\n\t\"./components/tooltip/6_async_actions.story.tsx\": \"./stories/components/tooltip/6_async_actions.story.tsx\",\n\t\"./components/tooltip/tooltip.stories.tsx\": \"./stories/components/tooltip/tooltip.stories.tsx\",\n\t\"./composable/1_basic.story.tsx\": \"./stories/composable/1_basic.story.tsx\",\n\t\"./composable/composable.stories.tsx\": \"./stories/composable/composable.stories.tsx\",\n\t\"./debug/1_basic.story.tsx\": \"./stories/debug/1_basic.story.tsx\",\n\t\"./debug/2_debug_state.story.tsx\": \"./stories/debug/2_debug_state.story.tsx\",\n\t\"./debug/debug.stories.tsx\": \"./stories/debug/debug.stories.tsx\",\n\t\"./goal/10_band_in_band.story.tsx\": \"./stories/goal/10_band_in_band.story.tsx\",\n\t\"./goal/11_gaps.story.tsx\": \"./stories/goal/11_gaps.story.tsx\",\n\t\"./goal/12_range.story.tsx\": \"./stories/goal/12_range.story.tsx\",\n\t\"./goal/13_confidence_level.story.tsx\": \"./stories/goal/13_confidence_level.story.tsx\",\n\t\"./goal/14_one_third.story.tsx\": \"./stories/goal/14_one_third.story.tsx\",\n\t\"./goal/15_half_circle.story.tsx\": \"./stories/goal/15_half_circle.story.tsx\",\n\t\"./goal/16_two_thirds.story.tsx\": \"./stories/goal/16_two_thirds.story.tsx\",\n\t\"./goal/17_three_quarters.story.tsx\": \"./stories/goal/17_three_quarters.story.tsx\",\n\t\"./goal/17_total_circle.story.tsx\": \"./stories/goal/17_total_circle.story.tsx\",\n\t\"./goal/17_very_small_gap.story.tsx\": \"./stories/goal/17_very_small_gap.story.tsx\",\n\t\"./goal/18_side_gauge.story.tsx\": \"./stories/goal/18_side_gauge.story.tsx\",\n\t\"./goal/18_side_gauge_inverted_angle_relation.story.tsx\": \"./stories/goal/18_side_gauge_inverted_angle_relation.story.tsx\",\n\t\"./goal/19_horizontal_negative.story.tsx\": \"./stories/goal/19_horizontal_negative.story.tsx\",\n\t\"./goal/20_vertical_negative.story.tsx\": \"./stories/goal/20_vertical_negative.story.tsx\",\n\t\"./goal/21_goal_negative.story.tsx\": \"./stories/goal/21_goal_negative.story.tsx\",\n\t\"./goal/22_horizontal_plusminus.story.tsx\": \"./stories/goal/22_horizontal_plusminus.story.tsx\",\n\t\"./goal/23_vertical_plusminus.story.tsx\": \"./stories/goal/23_vertical_plusminus.story.tsx\",\n\t\"./goal/24_goal_plusminus.story.tsx\": \"./stories/goal/24_goal_plusminus.story.tsx\",\n\t\"./goal/25_goal_semantic.story.tsx\": \"./stories/goal/25_goal_semantic.story.tsx\",\n\t\"./goal/26_auto_linear_ticks.story.tsx\": \"./stories/goal/26_auto_linear_ticks.story.tsx\",\n\t\"./goal/2_gauge_with_target.story.tsx\": \"./stories/goal/2_gauge_with_target.story.tsx\",\n\t\"./goal/3_horizontal_bullet.story.tsx\": \"./stories/goal/3_horizontal_bullet.story.tsx\",\n\t\"./goal/4_vertical_bullet.story.tsx\": \"./stories/goal/4_vertical_bullet.story.tsx\",\n\t\"./goal/5_minimal.story.tsx\": \"./stories/goal/5_minimal.story.tsx\",\n\t\"./goal/6_minimal_horizontal.story.tsx\": \"./stories/goal/6_minimal_horizontal.story.tsx\",\n\t\"./goal/7_horizontal_bar.story.tsx\": \"./stories/goal/7_horizontal_bar.story.tsx\",\n\t\"./goal/8_irregular_ticks.story.tsx\": \"./stories/goal/8_irregular_ticks.story.tsx\",\n\t\"./goal/9_minimal_band.story.tsx\": \"./stories/goal/9_minimal_band.story.tsx\",\n\t\"./goal/goal.stories.tsx\": \"./stories/goal/goal.stories.tsx\",\n\t\"./grids/1_basic.story.tsx\": \"./stories/grids/1_basic.story.tsx\",\n\t\"./grids/2_multiple_axes.story.tsx\": \"./stories/grids/2_multiple_axes.story.tsx\",\n\t\"./grids/3_lines.story.tsx\": \"./stories/grids/3_lines.story.tsx\",\n\t\"./grids/grids.stories.tsx\": \"./stories/grids/grids.stories.tsx\",\n\t\"./heatmap/1_basic.story.tsx\": \"./stories/heatmap/1_basic.story.tsx\",\n\t\"./heatmap/2_categorical.story.tsx\": \"./stories/heatmap/2_categorical.story.tsx\",\n\t\"./heatmap/3_time.story.tsx\": \"./stories/heatmap/3_time.story.tsx\",\n\t\"./heatmap/4_test_time_snap.story.tsx\": \"./stories/heatmap/4_test_time_snap.story.tsx\",\n\t\"./heatmap/5_theming.story.tsx\": \"./stories/heatmap/5_theming.story.tsx\",\n\t\"./heatmap/6_label_rotation.story.tsx\": \"./stories/heatmap/6_label_rotation.story.tsx\",\n\t\"./heatmap/7_sorting.story.tsx\": \"./stories/heatmap/7_sorting.story.tsx\",\n\t\"./heatmap/heatmap.stories.tsx\": \"./stories/heatmap/heatmap.stories.tsx\",\n\t\"./icicle/01_unix_icicle.story.tsx\": \"./stories/icicle/01_unix_icicle.story.tsx\",\n\t\"./icicle/02_unix_flame.story.tsx\": \"./stories/icicle/02_unix_flame.story.tsx\",\n\t\"./icicle/03_cpu_profile_flame.story.tsx\": \"./stories/icicle/03_cpu_profile_flame.story.tsx\",\n\t\"./icicle/04_cpu_profile_gl_flame.story.tsx\": \"./stories/icicle/04_cpu_profile_gl_flame.story.tsx\",\n\t\"./icicle/icicle.stories.tsx\": \"./stories/icicle/icicle.stories.tsx\",\n\t\"./interactions/10_brush_selection_bar.story.tsx\": \"./stories/interactions/10_brush_selection_bar.story.tsx\",\n\t\"./interactions/10a_brush_selection_bar_hist.story.tsx\": \"./stories/interactions/10a_brush_selection_bar_hist.story.tsx\",\n\t\"./interactions/11_brush_time.story.tsx\": \"./stories/interactions/11_brush_time.story.tsx\",\n\t\"./interactions/12_brush_time_hist.story.tsx\": \"./stories/interactions/12_brush_time_hist.story.tsx\",\n\t\"./interactions/13_brush_disabled_ordinal.story.tsx\": \"./stories/interactions/13_brush_disabled_ordinal.story.tsx\",\n\t\"./interactions/14_crosshair_time.story.tsx\": \"./stories/interactions/14_crosshair_time.story.tsx\",\n\t\"./interactions/15_render_change.story.tsx\": \"./stories/interactions/15_render_change.story.tsx\",\n\t\"./interactions/16_cursor_update_action.story.tsx\": \"./stories/interactions/16_cursor_update_action.story.tsx\",\n\t\"./interactions/17_png_export.story.tsx\": \"./stories/interactions/17_png_export.story.tsx\",\n\t\"./interactions/18_null_values.story.tsx\": \"./stories/interactions/18_null_values.story.tsx\",\n\t\"./interactions/19_multi_chart_cursor_sync.story.tsx\": \"./stories/interactions/19_multi_chart_cursor_sync.story.tsx\",\n\t\"./interactions/1_bar_clicks.story.tsx\": \"./stories/interactions/1_bar_clicks.story.tsx\",\n\t\"./interactions/2_area_point_clicks.story.tsx\": \"./stories/interactions/2_area_point_clicks.story.tsx\",\n\t\"./interactions/3_line_point_clicks.story.tsx\": \"./stories/interactions/3_line_point_clicks.story.tsx\",\n\t\"./interactions/4_line_area_bar_clicks.story.tsx\": \"./stories/interactions/4_line_area_bar_clicks.story.tsx\",\n\t\"./interactions/4_sunburst_slice_clicks.story.tsx\": \"./stories/interactions/4_sunburst_slice_clicks.story.tsx\",\n\t\"./interactions/5_clicks_legend_items_bar.story.tsx\": \"./stories/interactions/5_clicks_legend_items_bar.story.tsx\",\n\t\"./interactions/6_clicks_legend_items_area.story.tsx\": \"./stories/interactions/6_clicks_legend_items_area.story.tsx\",\n\t\"./interactions/7_clicks_legend_items_line.story.tsx\": \"./stories/interactions/7_clicks_legend_items_line.story.tsx\",\n\t\"./interactions/8_clicks_legend_items_mixed.story.tsx\": \"./stories/interactions/8_clicks_legend_items_mixed.story.tsx\",\n\t\"./interactions/9_brush_selection_linear.story.tsx\": \"./stories/interactions/9_brush_selection_linear.story.tsx\",\n\t\"./interactions/9a_brush_selection_linear.story.tsx\": \"./stories/interactions/9a_brush_selection_linear.story.tsx\",\n\t\"./interactions/interactions.stories.tsx\": \"./stories/interactions/interactions.stories.tsx\",\n\t\"./legend/10_sunburst.story.tsx\": \"./stories/legend/10_sunburst.story.tsx\",\n\t\"./legend/10_sunburst_repeated_label.story.tsx\": \"./stories/legend/10_sunburst_repeated_label.story.tsx\",\n\t\"./legend/11_legend_actions.story.tsx\": \"./stories/legend/11_legend_actions.story.tsx\",\n\t\"./legend/12_legend_margins.story.tsx\": \"./stories/legend/12_legend_margins.story.tsx\",\n\t\"./legend/13_inside_chart.story.tsx\": \"./stories/legend/13_inside_chart.story.tsx\",\n\t\"./legend/14_single_series.story.tsx\": \"./stories/legend/14_single_series.story.tsx\",\n\t\"./legend/15_legend_sort.story.tsx\": \"./stories/legend/15_legend_sort.story.tsx\",\n\t\"./legend/16_custom_legend.story.tsx\": \"./stories/legend/16_custom_legend.story.tsx\",\n\t\"./legend/1_legend_positioning.story.tsx\": \"./stories/legend/1_legend_positioning.story.tsx\",\n\t\"./legend/5_changing_specs.story.tsx\": \"./stories/legend/5_changing_specs.story.tsx\",\n\t\"./legend/6_hide_legend.story.tsx\": \"./stories/legend/6_hide_legend.story.tsx\",\n\t\"./legend/8_spacing_buffer.story.tsx\": \"./stories/legend/8_spacing_buffer.story.tsx\",\n\t\"./legend/9_color_picker.story.tsx\": \"./stories/legend/9_color_picker.story.tsx\",\n\t\"./legend/legend.stories.tsx\": \"./stories/legend/legend.stories.tsx\",\n\t\"./line/10_test_path_ordering.story.tsx\": \"./stories/line/10_test_path_ordering.story.tsx\",\n\t\"./line/11_discontinuous_data_points.story.tsx\": \"./stories/line/11_discontinuous_data_points.story.tsx\",\n\t\"./line/12_isolated_data_points.story.tsx\": \"./stories/line/12_isolated_data_points.story.tsx\",\n\t\"./line/13_line_mark_accessor.story.tsx\": \"./stories/line/13_line_mark_accessor.story.tsx\",\n\t\"./line/14_point_shapes.story.tsx\": \"./stories/line/14_point_shapes.story.tsx\",\n\t\"./line/15_test_negative_points.story.tsx\": \"./stories/line/15_test_negative_points.story.tsx\",\n\t\"./line/1_basic.story.tsx\": \"./stories/line/1_basic.story.tsx\",\n\t\"./line/2_w_axis.story.tsx\": \"./stories/line/2_w_axis.story.tsx\",\n\t\"./line/3_ordinal.story.tsx\": \"./stories/line/3_ordinal.story.tsx\",\n\t\"./line/4_linear.story.tsx\": \"./stories/line/4_linear.story.tsx\",\n\t\"./line/5_w_axis_and_legend.story.tsx\": \"./stories/line/5_w_axis_and_legend.story.tsx\",\n\t\"./line/6_curved.story.tsx\": \"./stories/line/6_curved.story.tsx\",\n\t\"./line/7_multiple.story.tsx\": \"./stories/line/7_multiple.story.tsx\",\n\t\"./line/8_stacked.story.tsx\": \"./stories/line/8_stacked.story.tsx\",\n\t\"./line/9_multi_series.story.tsx\": \"./stories/line/9_multi_series.story.tsx\",\n\t\"./line/line.stories.tsx\": \"./stories/line/line.stories.tsx\",\n\t\"./metric/1_basic.story.tsx\": \"./stories/metric/1_basic.story.tsx\",\n\t\"./metric/2_grid.story.tsx\": \"./stories/metric/2_grid.story.tsx\",\n\t\"./metric/3_body.story.tsx\": \"./stories/metric/3_body.story.tsx\",\n\t\"./metric/metric.stories.tsx\": \"./stories/metric/metric.stories.tsx\",\n\t\"./mixed/1_bars_and_lines.story.tsx\": \"./stories/mixed/1_bars_and_lines.story.tsx\",\n\t\"./mixed/2_lines_and_areas.story.tsx\": \"./stories/mixed/2_lines_and_areas.story.tsx\",\n\t\"./mixed/3_areas_and_bars.story.tsx\": \"./stories/mixed/3_areas_and_bars.story.tsx\",\n\t\"./mixed/4_test_bar.story.tsx\": \"./stories/mixed/4_test_bar.story.tsx\",\n\t\"./mixed/5_test_bar_time.story.tsx\": \"./stories/mixed/5_test_bar_time.story.tsx\",\n\t\"./mixed/6_fitting.story.tsx\": \"./stories/mixed/6_fitting.story.tsx\",\n\t\"./mixed/6_fitting_stacked.story.tsx\": \"./stories/mixed/6_fitting_stacked.story.tsx\",\n\t\"./mixed/7_marks.story.tsx\": \"./stories/mixed/7_marks.story.tsx\",\n\t\"./mixed/8_polarized_stacked.story.tsx\": \"./stories/mixed/8_polarized_stacked.story.tsx\",\n\t\"./mixed/mixed.stories.tsx\": \"./stories/mixed/mixed.stories.tsx\",\n\t\"./mosaic/10_mosaic_simple.story.tsx\": \"./stories/mosaic/10_mosaic_simple.story.tsx\",\n\t\"./mosaic/20_mosaic_with_other.story.tsx\": \"./stories/mosaic/20_mosaic_with_other.story.tsx\",\n\t\"./mosaic/mosaic.stories.tsx\": \"./stories/mosaic/mosaic.stories.tsx\",\n\t\"./rotations/1_ordinal.story.tsx\": \"./stories/rotations/1_ordinal.story.tsx\",\n\t\"./rotations/2_negative_ordinal.story.tsx\": \"./stories/rotations/2_negative_ordinal.story.tsx\",\n\t\"./rotations/3_rotations_ordinal.story.tsx\": \"./stories/rotations/3_rotations_ordinal.story.tsx\",\n\t\"./rotations/4_90_ordinal.story.tsx\": \"./stories/rotations/4_90_ordinal.story.tsx\",\n\t\"./rotations/5_180_ordinal.story.tsx\": \"./stories/rotations/5_180_ordinal.story.tsx\",\n\t\"./rotations/6_negative_linear.story.tsx\": \"./stories/rotations/6_negative_linear.story.tsx\",\n\t\"./rotations/7_rotations_linear.story.tsx\": \"./stories/rotations/7_rotations_linear.story.tsx\",\n\t\"./rotations/8_90_deg_linear.story.tsx\": \"./stories/rotations/8_90_deg_linear.story.tsx\",\n\t\"./rotations/9_180_deg_linear.story.tsx\": \"./stories/rotations/9_180_deg_linear.story.tsx\",\n\t\"./rotations/rotations.stories.tsx\": \"./stories/rotations/rotations.stories.tsx\",\n\t\"./scales/1_different_timezones.story.tsx\": \"./stories/scales/1_different_timezones.story.tsx\",\n\t\"./scales/2_local_tooltip.story.tsx\": \"./stories/scales/2_local_tooltip.story.tsx\",\n\t\"./scales/3_utc_tooltip.story.tsx\": \"./stories/scales/3_utc_tooltip.story.tsx\",\n\t\"./scales/4_specified_timezone.story.tsx\": \"./stories/scales/4_specified_timezone.story.tsx\",\n\t\"./scales/6_x_scale_fallback.story.tsx\": \"./stories/scales/6_x_scale_fallback.story.tsx\",\n\t\"./scales/7_log_scale_options.story.tsx\": \"./stories/scales/7_log_scale_options.story.tsx\",\n\t\"./scales/8_linear_binary.story.tsx\": \"./stories/scales/8_linear_binary.story.tsx\",\n\t\"./scales/scales.stories.tsx\": \"./stories/scales/scales.stories.tsx\",\n\t\"./small_multiples/2_vertical_areas.story.tsx\": \"./stories/small_multiples/2_vertical_areas.story.tsx\",\n\t\"./small_multiples/3_grid_lines.story.tsx\": \"./stories/small_multiples/3_grid_lines.story.tsx\",\n\t\"./small_multiples/4_horizontal_bars.story.tsx\": \"./stories/small_multiples/4_horizontal_bars.story.tsx\",\n\t\"./small_multiples/4_vertical_bars.story.tsx\": \"./stories/small_multiples/4_vertical_bars.story.tsx\",\n\t\"./small_multiples/5_histogram_bars.story.tsx\": \"./stories/small_multiples/5_histogram_bars.story.tsx\",\n\t\"./small_multiples/6_heterogeneous_cartesians.story.tsx\": \"./stories/small_multiples/6_heterogeneous_cartesians.story.tsx\",\n\t\"./small_multiples/7_sunbursts.story.tsx\": \"./stories/small_multiples/7_sunbursts.story.tsx\",\n\t\"./small_multiples/8_sorting.story.tsx\": \"./stories/small_multiples/8_sorting.story.tsx\",\n\t\"./small_multiples/9_heatmap.story.tsx\": \"./stories/small_multiples/9_heatmap.story.tsx\",\n\t\"./small_multiples/small_multiples.stories.tsx\": \"./stories/small_multiples/small_multiples.stories.tsx\",\n\t\"./streamgraph/1_basic.story.tsx\": \"./stories/streamgraph/1_basic.story.tsx\",\n\t\"./streamgraph/streamgraph.stories.tsx\": \"./stories/streamgraph/streamgraph.stories.tsx\",\n\t\"./stylings/10_custom_bars.story.tsx\": \"./stories/stylings/10_custom_bars.story.tsx\",\n\t\"./stylings/11_custom_lines.story.tsx\": \"./stories/stylings/11_custom_lines.story.tsx\",\n\t\"./stylings/12_custom_area.story.tsx\": \"./stories/stylings/12_custom_area.story.tsx\",\n\t\"./stylings/13_custom_series_name.story.tsx\": \"./stories/stylings/13_custom_series_name.story.tsx\",\n\t\"./stylings/13_custom_series_name_config.story.tsx\": \"./stories/stylings/13_custom_series_name_config.story.tsx\",\n\t\"./stylings/14_custom_series_name_formatting.story.tsx\": \"./stories/stylings/14_custom_series_name_formatting.story.tsx\",\n\t\"./stylings/15_tick_label.story.tsx\": \"./stories/stylings/15_tick_label.story.tsx\",\n\t\"./stylings/16_style_accessor.story.tsx\": \"./stories/stylings/16_style_accessor.story.tsx\",\n\t\"./stylings/17_bar_series_color_variant.story.tsx\": \"./stories/stylings/17_bar_series_color_variant.story.tsx\",\n\t\"./stylings/18_line_series_color_variant.story.tsx\": \"./stories/stylings/18_line_series_color_variant.story.tsx\",\n\t\"./stylings/19_area_series_color_variant.story.tsx\": \"./stories/stylings/19_area_series_color_variant.story.tsx\",\n\t\"./stylings/1_chart_size.story.tsx\": \"./stories/stylings/1_chart_size.story.tsx\",\n\t\"./stylings/20_partition_background.story.tsx\": \"./stories/stylings/20_partition_background.story.tsx\",\n\t\"./stylings/21_partition_labels.story.tsx\": \"./stories/stylings/21_partition_labels.story.tsx\",\n\t\"./stylings/22_dark_theme.story.tsx\": \"./stories/stylings/22_dark_theme.story.tsx\",\n\t\"./stylings/23_with_texture.story.tsx\": \"./stories/stylings/23_with_texture.story.tsx\",\n\t\"./stylings/24_texture_multiple_series.story.tsx\": \"./stories/stylings/24_texture_multiple_series.story.tsx\",\n\t\"./stylings/25_mixed_point_shapes.story.tsx\": \"./stories/stylings/25_mixed_point_shapes.story.tsx\",\n\t\"./stylings/26_highlighter_style.story.tsx\": \"./stories/stylings/26_highlighter_style.story.tsx\",\n\t\"./stylings/2_margins.story.tsx\": \"./stories/stylings/2_margins.story.tsx\",\n\t\"./stylings/3_axis.story.tsx\": \"./stories/stylings/3_axis.story.tsx\",\n\t\"./stylings/4_theme_styling.story.tsx\": \"./stories/stylings/4_theme_styling.story.tsx\",\n\t\"./stylings/5_partial_custom_theme.story.tsx\": \"./stories/stylings/5_partial_custom_theme.story.tsx\",\n\t\"./stylings/6_partial_and_base.story.tsx\": \"./stories/stylings/6_partial_and_base.story.tsx\",\n\t\"./stylings/7_multiple_custom.story.tsx\": \"./stories/stylings/7_multiple_custom.story.tsx\",\n\t\"./stylings/8_custom_series_colors_array.story.tsx\": \"./stories/stylings/8_custom_series_colors_array.story.tsx\",\n\t\"./stylings/9_custom_series_colors_function.story.tsx\": \"./stories/stylings/9_custom_series_colors_function.story.tsx\",\n\t\"./stylings/stylings.stories.tsx\": \"./stories/stylings/stylings.stories.tsx\",\n\t\"./sunburst/10_2_slice.story.tsx\": \"./stories/sunburst/10_2_slice.story.tsx\",\n\t\"./sunburst/11_small_large.story.tsx\": \"./stories/sunburst/11_small_large.story.tsx\",\n\t\"./sunburst/12_very_small.story.tsx\": \"./stories/sunburst/12_very_small.story.tsx\",\n\t\"./sunburst/13_empty.story.tsx\": \"./stories/sunburst/13_empty.story.tsx\",\n\t\"./sunburst/14_full_zero.story.tsx\": \"./stories/sunburst/14_full_zero.story.tsx\",\n\t\"./sunburst/15_single.story.tsx\": \"./stories/sunburst/15_single.story.tsx\",\n\t\"./sunburst/15_single_sunburst.story.tsx\": \"./stories/sunburst/15_single_sunburst.story.tsx\",\n\t\"./sunburst/16_single_small.story.tsx\": \"./stories/sunburst/16_single_small.story.tsx\",\n\t\"./sunburst/17_single_very_small.story.tsx\": \"./stories/sunburst/17_single_very_small.story.tsx\",\n\t\"./sunburst/18_no_sliced.story.tsx\": \"./stories/sunburst/18_no_sliced.story.tsx\",\n\t\"./sunburst/19_negative.story.tsx\": \"./stories/sunburst/19_negative.story.tsx\",\n\t\"./sunburst/1_simple.story.tsx\": \"./stories/sunburst/1_simple.story.tsx\",\n\t\"./sunburst/20_total_zero.story.tsx\": \"./stories/sunburst/20_total_zero.story.tsx\",\n\t\"./sunburst/21_high_pie.story.tsx\": \"./stories/sunburst/21_high_pie.story.tsx\",\n\t\"./sunburst/22_counter_clockwise.story.tsx\": \"./stories/sunburst/22_counter_clockwise.story.tsx\",\n\t\"./sunburst/23_clockwise.story.tsx\": \"./stories/sunburst/23_clockwise.story.tsx\",\n\t\"./sunburst/24_linked_label.story.tsx\": \"./stories/sunburst/24_linked_label.story.tsx\",\n\t\"./sunburst/25_no_labels.story.tsx\": \"./stories/sunburst/25_no_labels.story.tsx\",\n\t\"./sunburst/26_percentage.story.tsx\": \"./stories/sunburst/26_percentage.story.tsx\",\n\t\"./sunburst/27_heterogeneous_depth.story.tsx\": \"./stories/sunburst/27_heterogeneous_depth.story.tsx\",\n\t\"./sunburst/28_not_a_number.story.tsx\": \"./stories/sunburst/28_not_a_number.story.tsx\",\n\t\"./sunburst/29_custom_stroke.story.tsx\": \"./stories/sunburst/29_custom_stroke.story.tsx\",\n\t\"./sunburst/2_value_formatted.story.tsx\": \"./stories/sunburst/2_value_formatted.story.tsx\",\n\t\"./sunburst/30_largest_circle.story.tsx\": \"./stories/sunburst/30_largest_circle.story.tsx\",\n\t\"./sunburst/31_bold_link_value.story.tsx\": \"./stories/sunburst/31_bold_link_value.story.tsx\",\n\t\"./sunburst/32_custom_tooltip.story.tsx\": \"./stories/sunburst/32_custom_tooltip.story.tsx\",\n\t\"./sunburst/33_ordered_slices.story.tsx\": \"./stories/sunburst/33_ordered_slices.story.tsx\",\n\t\"./sunburst/3_value_formatted_2.story.tsx\": \"./stories/sunburst/3_value_formatted_2.story.tsx\",\n\t\"./sunburst/4_fill_labels.story.tsx\": \"./stories/sunburst/4_fill_labels.story.tsx\",\n\t\"./sunburst/5_donut.story.tsx\": \"./stories/sunburst/5_donut.story.tsx\",\n\t\"./sunburst/6_pie_chart_labels.story.tsx\": \"./stories/sunburst/6_pie_chart_labels.story.tsx\",\n\t\"./sunburst/6_pie_chart_linked_labels.story.tsx\": \"./stories/sunburst/6_pie_chart_linked_labels.story.tsx\",\n\t\"./sunburst/7_zero_slice.story.tsx\": \"./stories/sunburst/7_zero_slice.story.tsx\",\n\t\"./sunburst/8_sunburst_two_layers.story.tsx\": \"./stories/sunburst/8_sunburst_two_layers.story.tsx\",\n\t\"./sunburst/9_sunburst_three_layers.story.tsx\": \"./stories/sunburst/9_sunburst_three_layers.story.tsx\",\n\t\"./sunburst/sunburst.stories.tsx\": \"./stories/sunburst/sunburst.stories.tsx\",\n\t\"./test_cases/10_highlighter_z_index.story.tsx\": \"./stories/test_cases/10_highlighter_z_index.story.tsx\",\n\t\"./test_cases/1_no_series.story.tsx\": \"./stories/test_cases/1_no_series.story.tsx\",\n\t\"./test_cases/21_domain_edges.story.tsx\": \"./stories/test_cases/21_domain_edges.story.tsx\",\n\t\"./test_cases/2_chrome_path_bug_fix.story.tsx\": \"./stories/test_cases/2_chrome_path_bug_fix.story.tsx\",\n\t\"./test_cases/3_no_axes_annotation.story.tsx\": \"./stories/test_cases/3_no_axes_annotation.story.tsx\",\n\t\"./test_cases/4_filter_zero_values_log.story.tsx\": \"./stories/test_cases/4_filter_zero_values_log.story.tsx\",\n\t\"./test_cases/5_legend_scroll_bar_sizing.story.tsx\": \"./stories/test_cases/5_legend_scroll_bar_sizing.story.tsx\",\n\t\"./test_cases/6_a11y_custom_description.story.tsx\": \"./stories/test_cases/6_a11y_custom_description.story.tsx\",\n\t\"./test_cases/7_rtl_text.story.tsx\": \"./stories/test_cases/7_rtl_text.story.tsx\",\n\t\"./test_cases/8_test_points_outside_of_domain.story.tsx\": \"./stories/test_cases/8_test_points_outside_of_domain.story.tsx\",\n\t\"./test_cases/9_duplicate_labels_in_partition_legend.story.tsx\": \"./stories/test_cases/9_duplicate_labels_in_partition_legend.story.tsx\",\n\t\"./test_cases/test_cases.stories.tsx\": \"./stories/test_cases/test_cases.stories.tsx\",\n\t\"./timeslip/01_timeslip.story.tsx\": \"./stories/timeslip/01_timeslip.story.tsx\",\n\t\"./timeslip/timeslip.stories.tsx\": \"./stories/timeslip/timeslip.stories.tsx\",\n\t\"./treemap/10_three_layers.story.tsx\": \"./stories/treemap/10_three_layers.story.tsx\",\n\t\"./treemap/1_one_layer.story.tsx\": \"./stories/treemap/1_one_layer.story.tsx\",\n\t\"./treemap/2_one_layer_2.story.tsx\": \"./stories/treemap/2_one_layer_2.story.tsx\",\n\t\"./treemap/3_mid_two.story.tsx\": \"./stories/treemap/3_mid_two.story.tsx\",\n\t\"./treemap/4_two_layer_stress.story.tsx\": \"./stories/treemap/4_two_layer_stress.story.tsx\",\n\t\"./treemap/5_multicolor.story.tsx\": \"./stories/treemap/5_multicolor.story.tsx\",\n\t\"./treemap/6_custom_style.story.tsx\": \"./stories/treemap/6_custom_style.story.tsx\",\n\t\"./treemap/7_percentage.story.tsx\": \"./stories/treemap/7_percentage.story.tsx\",\n\t\"./treemap/8_groove_text.story.tsx\": \"./stories/treemap/8_groove_text.story.tsx\",\n\t\"./treemap/9_zero_values.story.tsx\": \"./stories/treemap/9_zero_values.story.tsx\",\n\t\"./treemap/treemap.stories.tsx\": \"./stories/treemap/treemap.stories.tsx\",\n\t\"./utils/text/1_wrap.story.tsx\": \"./stories/utils/text/1_wrap.story.tsx\",\n\t\"./utils/text/text.stories.tsx\": \"./stories/utils/text/text.stories.tsx\",\n\t\"./waffle/1_simple.story.tsx\": \"./stories/waffle/1_simple.story.tsx\",\n\t\"./waffle/2_test.story.tsx\": \"./stories/waffle/2_test.story.tsx\",\n\t\"./waffle/waffle.stories.tsx\": \"./stories/waffle/waffle.stories.tsx\",\n\t\"./wordcloud/1_wordcloud.story.tsx\": \"./stories/wordcloud/1_wordcloud.story.tsx\",\n\t\"./wordcloud/wordcloud.stories.tsx\": \"./stories/wordcloud/wordcloud.stories.tsx\"\n};\n\n\nfunction webpackContext(req) {\n\tvar id = webpackContextResolve(req);\n\treturn __webpack_require__(id);\n}\nfunction webpackContextResolve(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t}\n\treturn map[req];\n}\nwebpackContext.keys = function webpackContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackContext.resolve = webpackContextResolve;\nmodule.exports = webpackContext;\nwebpackContext.id = \"./stories sync recursive ^\\\\.(?:(?:^|\\\\/|(?:(?:(?!(?:^|\\\\/)\\\\.).)*?)\\\\/)(?!\\\\.)(?=.)[^/]*?\\\\.(stories|story)\\\\.ts(?:x)?)$\";","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  LineAnnotationStyle,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n  const data = customKnobs.array('data values', [2.5, 7.2]);\\n  const dataValues = generateAnnotationData(data);\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: 3,\\n      stroke: '#f00',\\n      opacity: 1,\\n    },\\n  };\\n\\n  const isBottom = boolean('x domain axis is bottom', true);\\n  const axisPosition = isBottom ? Position.Bottom : Position.Top;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={axisPosition} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":83},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":83}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  LineAnnotationStyle,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const markerPosition = select(\n    'marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const rotation = customKnobs.enum.rotation();\n  const data = customKnobs.array('data values', [2.5, 7.2]);\n  const dataValues = generateAnnotationData(data);\n\n  const style: Partial<LineAnnotationStyle> = {\n    line: {\n      strokeWidth: 3,\n      stroke: '#f00',\n      opacity: 1,\n    },\n  };\n\n  const isBottom = boolean('x domain axis is bottom', true);\n  const axisPosition = isBottom ? Position.Bottom : Position.Top;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        style={style}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\n      />\n      <Axis id=\"horizontal\" position={axisPosition} title=\"x-domain axis\" />\n      <Axis id=\"vertical\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n  const data = customKnobs.array('data values', [2.5, 7.2]);\\n  const dataValues = generateAnnotationData(data);\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: 3,\\n      stroke: '#f00',\\n      opacity: 1,\\n    },\\n  };\\n\\n  const isBottom = boolean('x domain axis is bottom', true);\\n  const axisPosition = isBottom ? Position.Bottom : Position.Top;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={axisPosition} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"x-domain axis (top)\\\" />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis (bottom)\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":70},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":70}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const markerPosition = select(\n    'marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const rotation = customKnobs.enum.rotation();\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\n      />\n      <Axis id=\"top\" position={Position.Top} title=\"x-domain axis (top)\" />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis (bottom)\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'a', y: 2 },\n          { x: 'b', y: 7 },\n          { x: 'c', y: 3 },\n          { x: 'd', y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"x-domain axis (top)\\\" />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis (bottom)\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { getDebugStateLogger } from '../../utils/debug_state_logger';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nconst dateFormatter = timeFormatter('HH:mm:ss');\\n\\nfunction generateTimeAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({\\n    dataValue: value,\\n    details: `detail-${index}`,\\n    header: dateFormatter(value),\\n  }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('Enable debug state', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const dataValues = generateTimeAnnotationData([\\n    1551438150000, 1551438180000, 1551438390000, 1551438450000, 1551438480000,\\n  ]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        rotation={rotation}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" tickFormat={dateFormatter} />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":84},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":84}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { getDebugStateLogger } from '../../utils/debug_state_logger';\nimport { customKnobs } from '../../utils/knobs';\n\nconst dateFormatter = timeFormatter('HH:mm:ss');\n\nfunction generateTimeAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({\n    dataValue: value,\n    details: `detail-${index}`,\n    header: dateFormatter(value),\n  }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('Enable debug state', false);\n  const markerPosition = select(\n    'marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const rotation = customKnobs.enum.rotation();\n\n  const dataValues = generateTimeAnnotationData([\n    1551438150000, 1551438180000, 1551438390000, 1551438450000, 1551438480000,\n  ]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        rotation={rotation}\n        baseTheme={useBaseTheme()}\n      />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" tickFormat={dateFormatter} />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('Enable debug state', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const dataValues = generateTimeAnnotationData([\\n    1551438150000, 1551438180000, 1551438390000, 1551438450000, 1551438480000,\\n  ]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        rotation={rotation}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" tickFormat={dateFormatter} />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const data = customKnobs.array('data values', [1.5, 7.2]);\\n  const dataValues = generateAnnotationData(data);\\n\\n  const isLeft = boolean('y-domain axis is Position.Left', true);\\n  const axisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n  const axisPosition = isLeft ? Position.Left : Position.Right;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title={axisTitle} position={axisPosition} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":75},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":75}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n  const markerPosition = select(\n    'marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const data = customKnobs.array('data values', [1.5, 7.2]);\n  const dataValues = generateAnnotationData(data);\n\n  const isLeft = boolean('y-domain axis is Position.Left', true);\n  const axisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\n  const axisPosition = isLeft ? Position.Left : Position.Right;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.YDomain}\n        dataValues={dataValues}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title={axisTitle} position={axisPosition} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const data = customKnobs.array('data values', [1.5, 7.2]);\\n  const dataValues = generateAnnotationData(data);\\n\\n  const isLeft = boolean('y-domain axis is Position.Left', true);\\n  const axisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n  const axisPosition = isLeft ? Position.Left : Position.Right;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title={axisTitle} position={axisPosition} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  ScaleType,\\n  Settings,\\n  LineAnnotationStyle,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const data = [2.5, 7.2];\\n  const dataValues = generateAnnotationData(data);\\n\\n  const dashWidth = number('dash line width', 5);\\n  const dashGapWidth = number('dash gap width', 8);\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: number('line stroke width', 5),\\n      stroke: color('line & marker color', 'blue'),\\n      dash: [dashWidth, dashGapWidth],\\n      opacity: number('line opacity', 0.5, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const axisPosition = Position.Bottom;\\n\\n  const marker = select<'alert' | 'eye' | 'questionInCircle'>(\\n    'marker icon (Examples from internal Icon library)',\\n    {\\n      alert: 'alert',\\n      eye: 'eye',\\n      questionInCircle: 'questionInCircle',\\n    },\\n    'alert',\\n  );\\n\\n  const hideLines = boolean('annotation lines hidden', false);\\n  const hideTooltips = boolean('annotation tooltips hidden', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n        marker={<Icon type={marker} />}\\n        hideLines={hideLines}\\n        hideTooltips={hideTooltips}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={axisPosition} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":101},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":101}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  ScaleType,\n  Settings,\n  LineAnnotationStyle,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n\n  const data = [2.5, 7.2];\n  const dataValues = generateAnnotationData(data);\n\n  const dashWidth = number('dash line width', 5);\n  const dashGapWidth = number('dash gap width', 8);\n\n  const style: Partial<LineAnnotationStyle> = {\n    line: {\n      strokeWidth: number('line stroke width', 5),\n      stroke: color('line & marker color', 'blue'),\n      dash: [dashWidth, dashGapWidth],\n      opacity: number('line opacity', 0.5, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n\n  const axisPosition = Position.Bottom;\n\n  const marker = select<'alert' | 'eye' | 'questionInCircle'>(\n    'marker icon (Examples from internal Icon library)',\n    {\n      alert: 'alert',\n      eye: 'eye',\n      questionInCircle: 'questionInCircle',\n    },\n    'alert',\n  );\n\n  const hideLines = boolean('annotation lines hidden', false);\n  const hideTooltips = boolean('annotation tooltips hidden', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        style={style}\n        marker={<Icon type={marker} />}\n        hideLines={hideLines}\n        hideTooltips={hideTooltips}\n      />\n      <Axis id=\"horizontal\" position={axisPosition} title=\"x-domain axis\" />\n      <Axis id=\"vertical\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const data = [2.5, 7.2];\\n  const dataValues = generateAnnotationData(data);\\n\\n  const dashWidth = number('dash line width', 5);\\n  const dashGapWidth = number('dash gap width', 8);\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: number('line stroke width', 5),\\n      stroke: color('line & marker color', 'blue'),\\n      dash: [dashWidth, dashGapWidth],\\n      opacity: number('line opacity', 0.5, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const axisPosition = Position.Bottom;\\n\\n  const marker = select<'alert' | 'eye' | 'questionInCircle'>(\\n    'marker icon (Examples from internal Icon library)',\\n    {\\n      alert: 'alert',\\n      eye: 'eye',\\n      questionInCircle: 'questionInCircle',\\n    },\\n    'alert',\\n  );\\n\\n  const hideLines = boolean('annotation lines hidden', false);\\n  const hideTooltips = boolean('annotation tooltips hidden', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n        marker={<Icon type={marker} />}\\n        hideLines={hideLines}\\n        hideTooltips={hideTooltips}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={axisPosition} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationStyle,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const dataValues = [\\n    {\\n      dataValue: 3.5,\\n    },\\n  ];\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: 3,\\n      stroke: '#f00',\\n      opacity: 1,\\n    },\\n  };\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: NaN,\\n    minInterval: 1,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        enableHistogramMode\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 3, y: 2 }]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationStyle,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n\n  const dataValues = [\n    {\n      dataValue: 3.5,\n    },\n  ];\n\n  const style: Partial<LineAnnotationStyle> = {\n    line: {\n      strokeWidth: 3,\n      stroke: '#f00',\n      opacity: 1,\n    },\n  };\n\n  const xDomain = {\n    min: NaN,\n    max: NaN,\n    minInterval: 1,\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} xDomain={xDomain} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        style={style}\n      />\n      <Axis id=\"horizontal\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"vertical\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        enableHistogramMode\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[{ x: 3, y: 2 }]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const dataValues = [\\n    {\\n      dataValue: 3.5,\\n    },\\n  ];\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: 3,\\n      stroke: '#f00',\\n      opacity: 1,\\n    },\\n  };\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: NaN,\\n    minInterval: 1,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        enableHistogramMode\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 3, y: 2 }]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationTooltipFormatter,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  ScaleType,\\n  Settings,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n  LineAnnotationDatum,\\n} from '@elastic/charts';\\nimport { CustomAnnotationTooltip } from '@elastic/charts/src/chart_types/xy_chart/annotations/types';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const boundary = customKnobs.enum.boundary();\\n  const placement = customKnobs.enum.placement('Tooltip placement');\\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\\n  const offset = number('tooltip offset', 10);\\n  const showCustomTooltip = boolean('custom tooltip', false);\\n  const showCustomDetails = boolean('custom tooltip details', false);\\n\\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\\n\\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\\n    ? ({ header, details }) => (\\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\\n          <h2>custom tooltip -{header}</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\\n    ? (details) => (\\n        <div>\\n          <h2>custom Details</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        offset={offset}\\n        dataValues={dataValues}\\n        boundary={boundary}\\n        placement={placement}\\n        fallbackPlacements={fallbackPlacements}\\n        customTooltip={customTooltip}\\n        customTooltipDetails={customTooltipDetails}\\n        marker={<Icon type=\\\"alert\\\" />}\\n      />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"x-domain axis (top)\\\" />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis (bottom)\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":96},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":96}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationTooltipFormatter,\n  Axis,\n  BarSeries,\n  Chart,\n  ScaleType,\n  Settings,\n  LineAnnotation,\n  AnnotationDomainType,\n  LineAnnotationDatum,\n} from '@elastic/charts';\nimport { CustomAnnotationTooltip } from '@elastic/charts/src/chart_types/xy_chart/annotations/types';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rotation = customKnobs.enum.rotation();\n  const boundary = customKnobs.enum.boundary();\n  const placement = customKnobs.enum.placement('Tooltip placement');\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\n  const offset = number('tooltip offset', 10);\n  const showCustomTooltip = boolean('custom tooltip', false);\n  const showCustomDetails = boolean('custom tooltip details', false);\n\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\n\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\n    ? ({ header, details }) => (\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\n          <h2>custom tooltip -{header}</h2>\n          <p>{details}</p>\n        </div>\n      )\n    : undefined;\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\n    ? (details) => (\n        <div>\n          <h2>custom Details</h2>\n          <p>{details}</p>\n        </div>\n      )\n    : undefined;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        offset={offset}\n        dataValues={dataValues}\n        boundary={boundary}\n        placement={placement}\n        fallbackPlacements={fallbackPlacements}\n        customTooltip={customTooltip}\n        customTooltipDetails={customTooltipDetails}\n        marker={<Icon type=\"alert\" />}\n      />\n      <Axis id=\"top\" position={Position.Top} title=\"x-domain axis (top)\" />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis (bottom)\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'a', y: 2 },\n          { x: 'b', y: 7 },\n          { x: 'c', y: 3 },\n          { x: 'd', y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const boundary = customKnobs.enum.boundary();\\n  const placement = customKnobs.enum.placement('Tooltip placement');\\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\\n  const offset = number('tooltip offset', 10);\\n  const showCustomTooltip = boolean('custom tooltip', false);\\n  const showCustomDetails = boolean('custom tooltip details', false);\\n\\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\\n\\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\\n    ? ({ header, details }) => (\\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\\n          <h2>custom tooltip -{header}</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\\n    ? (details) => (\\n        <div>\\n          <h2>custom Details</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        offset={offset}\\n        dataValues={dataValues}\\n        boundary={boundary}\\n        placement={placement}\\n        fallbackPlacements={fallbackPlacements}\\n        customTooltip={customTooltip}\\n        customTooltipDetails={customTooltipDetails}\\n        marker={<Icon type=\\\"alert\\\" />}\\n      />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"x-domain axis (top)\\\" />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis (bottom)\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiIcon } from '@elastic/eui';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Axis,\\n  Settings,\\n  HistogramBarSeries,\\n  Position,\\n  ScaleType,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n  LineAnnotationSpec,\\n} from '@elastic/charts';\\nimport { isVerticalAxis } from '@elastic/charts/src/chart_types/xy_chart/utils/axis_type_utils';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nconst annotationStyle = {\\n  line: {\\n    strokeWidth: 1,\\n    stroke: 'red',\\n    opacity: 1,\\n  },\\n};\\n\\nconst iconMap = {\\n  [Position.Top]: 'arrowDown',\\n  [Position.Right]: 'arrowLeft',\\n  [Position.Bottom]: 'arrowUp',\\n  [Position.Left]: 'arrowRight',\\n};\\n\\n/**\\n * Used to rotate text while maintaining correct parent dimensions\\n * https://www.kizu.ru/rotated-text/\\n */\\nconst getMarkerBody =\\n  (valueCb: (v: any) => string, isVertical: boolean): LineAnnotationSpec['markerBody'] =>\\n  ({ dataValue }) =>\\n    isVertical ? (\\n      <div\\n        style={{\\n          display: 'inline-block',\\n          overflow: 'hidden',\\n          width: '1.5em',\\n          lineHeight: 1.5,\\n        }}\\n      >\\n        <div\\n          style={{\\n            display: 'inline-block',\\n            whiteSpace: 'nowrap',\\n            transform: 'translate(0, 100%) rotate(-90deg)',\\n            transformOrigin: '0 0',\\n          }}\\n        >\\n          {valueCb(dataValue)}\\n          <div\\n            style={{\\n              float: 'left',\\n              marginTop: '100%',\\n            }}\\n          />\\n        </div>\\n      </div>\\n    ) : (\\n      <div>{valueCb(dataValue)}</div>\\n    );\\n\\n/** formats values correctly for any rotation/side combination */\\nconst looseFormatter = (d: any) => (d < 100 ? String(d) : moment(d).format('L'));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const maxMetric = 30;\\n  const debug = boolean('Debug', true);\\n  const showLegend = boolean('show legend', true);\\n  const rotation = customKnobs.enum.rotation();\\n  const side = customKnobs.enum.position('Side', Position.Bottom);\\n  const padding = number('TickLine padding for markerBody', 30, { step: 5, min: 0, max: 100 });\\n  const start = moment('4/1/2020').startOf('d');\\n  const metric = number('Annotation metric', maxMetric, { step: 1, min: 0, max: maxMetric, range: true });\\n  const isVerticalSide = isVerticalAxis(side);\\n  const isYDomain = rotation === -90 || rotation === 90 ? !isVerticalSide : isVerticalSide;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} showLegend={showLegend} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"count\\\"\\n        maximumFractionDigits={0}\\n        tickFormat={looseFormatter}\\n        position={side === Position.Right ? Position.Right : Position.Left}\\n        style={{ tickLine: { padding: isVerticalSide ? padding : undefined } }}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        style={{ tickLine: { padding: isVerticalSide ? undefined : padding } }}\\n        tickFormat={looseFormatter}\\n        position={side === Position.Top ? Position.Top : Position.Bottom}\\n      />\\n      {isYDomain ? (\\n        <LineAnnotation\\n          id=\\\"annotation_y\\\"\\n          domainType={AnnotationDomainType.YDomain}\\n          dataValues={[{ dataValue: metric }]}\\n          style={annotationStyle}\\n          hideTooltips\\n          marker={<EuiIcon type={iconMap[side]} />}\\n          markerBody={getMarkerBody((v) => `The value is ${v} right here!`, isVerticalSide)}\\n        />\\n      ) : (\\n        <LineAnnotation\\n          id=\\\"annotation_x\\\"\\n          domainType={AnnotationDomainType.XDomain}\\n          dataValues={[{ dataValue: start.clone().add(metric, 'd').valueOf() }]}\\n          style={annotationStyle}\\n          hideTooltips\\n          marker={<EuiIcon type={iconMap[side]} />}\\n          markerBody={getMarkerBody((v) => moment(v).format('lll'), isVerticalSide)}\\n        />\\n      )}\\n      <HistogramBarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={Array.from({ length: maxMetric })\\n          .fill(0)\\n          .map((_, i) => ({ x: start.clone().add(i, 'd').valueOf(), y: maxMetric }))}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `The \\\\`markerBody\\\\` on the \\\\`LineAnnotationSpec\\\\` will be dynamically positioned to show content that would otherwise be hidden or overflow the chart.\\n    The \\\\`marker\\\\` prop (also on the \\\\`LineAnnotationSpec\\\\`) however, will always be positioned centered on the given \\\\`dataValue\\\\`.\\n    These can be used interchangeably to provide a content-rich annotation without losing the data reference.\\n    **Note: you will need to provide the necessary axis padding for the \\\\`markerBody\\\\` content as this is _not_ currently accounted for in the chart dimensioning**`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":86},\"endLoc\":{\"col\":1,\"line\":146},\"startBody\":{\"col\":36,\"line\":86},\"endBody\":{\"col\":1,\"line\":146}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiIcon } from '@elastic/eui';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport moment from 'moment';\nimport React from 'react';\n\nimport {\n  Chart,\n  Axis,\n  Settings,\n  HistogramBarSeries,\n  Position,\n  ScaleType,\n  LineAnnotation,\n  AnnotationDomainType,\n  LineAnnotationSpec,\n} from '@elastic/charts';\nimport { isVerticalAxis } from '@elastic/charts/src/chart_types/xy_chart/utils/axis_type_utils';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nconst annotationStyle = {\n  line: {\n    strokeWidth: 1,\n    stroke: 'red',\n    opacity: 1,\n  },\n};\n\nconst iconMap = {\n  [Position.Top]: 'arrowDown',\n  [Position.Right]: 'arrowLeft',\n  [Position.Bottom]: 'arrowUp',\n  [Position.Left]: 'arrowRight',\n};\n\n/**\n * Used to rotate text while maintaining correct parent dimensions\n * https://www.kizu.ru/rotated-text/\n */\nconst getMarkerBody =\n  (valueCb: (v: any) => string, isVertical: boolean): LineAnnotationSpec['markerBody'] =>\n  ({ dataValue }) =>\n    isVertical ? (\n      <div\n        style={{\n          display: 'inline-block',\n          overflow: 'hidden',\n          width: '1.5em',\n          lineHeight: 1.5,\n        }}\n      >\n        <div\n          style={{\n            display: 'inline-block',\n            whiteSpace: 'nowrap',\n            transform: 'translate(0, 100%) rotate(-90deg)',\n            transformOrigin: '0 0',\n          }}\n        >\n          {valueCb(dataValue)}\n          <div\n            style={{\n              float: 'left',\n              marginTop: '100%',\n            }}\n          />\n        </div>\n      </div>\n    ) : (\n      <div>{valueCb(dataValue)}</div>\n    );\n\n/** formats values correctly for any rotation/side combination */\nconst looseFormatter = (d: any) => (d < 100 ? String(d) : moment(d).format('L'));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const maxMetric = 30;\n  const debug = boolean('Debug', true);\n  const showLegend = boolean('show legend', true);\n  const rotation = customKnobs.enum.rotation();\n  const side = customKnobs.enum.position('Side', Position.Bottom);\n  const padding = number('TickLine padding for markerBody', 30, { step: 5, min: 0, max: 100 });\n  const start = moment('4/1/2020').startOf('d');\n  const metric = number('Annotation metric', maxMetric, { step: 1, min: 0, max: maxMetric, range: true });\n  const isVerticalSide = isVerticalAxis(side);\n  const isYDomain = rotation === -90 || rotation === 90 ? !isVerticalSide : isVerticalSide;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} showLegend={showLegend} rotation={rotation} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"count\"\n        maximumFractionDigits={0}\n        tickFormat={looseFormatter}\n        position={side === Position.Right ? Position.Right : Position.Left}\n        style={{ tickLine: { padding: isVerticalSide ? padding : undefined } }}\n      />\n      <Axis\n        id=\"x\"\n        style={{ tickLine: { padding: isVerticalSide ? undefined : padding } }}\n        tickFormat={looseFormatter}\n        position={side === Position.Top ? Position.Top : Position.Bottom}\n      />\n      {isYDomain ? (\n        <LineAnnotation\n          id=\"annotation_y\"\n          domainType={AnnotationDomainType.YDomain}\n          dataValues={[{ dataValue: metric }]}\n          style={annotationStyle}\n          hideTooltips\n          marker={<EuiIcon type={iconMap[side]} />}\n          markerBody={getMarkerBody((v) => `The value is ${v} right here!`, isVerticalSide)}\n        />\n      ) : (\n        <LineAnnotation\n          id=\"annotation_x\"\n          domainType={AnnotationDomainType.XDomain}\n          dataValues={[{ dataValue: start.clone().add(metric, 'd').valueOf() }]}\n          style={annotationStyle}\n          hideTooltips\n          marker={<EuiIcon type={iconMap[side]} />}\n          markerBody={getMarkerBody((v) => moment(v).format('lll'), isVerticalSide)}\n        />\n      )}\n      <HistogramBarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={Array.from({ length: maxMetric })\n          .fill(0)\n          .map((_, i) => ({ x: start.clone().add(i, 'd').valueOf(), y: maxMetric }))}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `The \\`markerBody\\` on the \\`LineAnnotationSpec\\` will be dynamically positioned to show content that would otherwise be hidden or overflow the chart.\n    The \\`marker\\` prop (also on the \\`LineAnnotationSpec\\`) however, will always be positioned centered on the given \\`dataValue\\`.\n    These can be used interchangeably to provide a content-rich annotation without losing the data reference.\n    **Note: you will need to provide the necessary axis padding for the \\`markerBody\\` content as this is _not_ currently accounted for in the chart dimensioning**`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const maxMetric = 30;\\n  const debug = boolean('Debug', true);\\n  const showLegend = boolean('show legend', true);\\n  const rotation = customKnobs.enum.rotation();\\n  const side = customKnobs.enum.position('Side', Position.Bottom);\\n  const padding = number('TickLine padding for markerBody', 30, { step: 5, min: 0, max: 100 });\\n  const start = moment('4/1/2020').startOf('d');\\n  const metric = number('Annotation metric', maxMetric, { step: 1, min: 0, max: maxMetric, range: true });\\n  const isVerticalSide = isVerticalAxis(side);\\n  const isYDomain = rotation === -90 || rotation === 90 ? !isVerticalSide : isVerticalSide;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} showLegend={showLegend} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"count\\\"\\n        maximumFractionDigits={0}\\n        tickFormat={looseFormatter}\\n        position={side === Position.Right ? Position.Right : Position.Left}\\n        style={{ tickLine: { padding: isVerticalSide ? padding : undefined } }}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        style={{ tickLine: { padding: isVerticalSide ? undefined : padding } }}\\n        tickFormat={looseFormatter}\\n        position={side === Position.Top ? Position.Top : Position.Bottom}\\n      />\\n      {isYDomain ? (\\n        <LineAnnotation\\n          id=\\\"annotation_y\\\"\\n          domainType={AnnotationDomainType.YDomain}\\n          dataValues={[{ dataValue: metric }]}\\n          style={annotationStyle}\\n          hideTooltips\\n          marker={<EuiIcon type={iconMap[side]} />}\\n          markerBody={getMarkerBody((v) => `The value is ${v} right here!`, isVerticalSide)}\\n        />\\n      ) : (\\n        <LineAnnotation\\n          id=\\\"annotation_x\\\"\\n          domainType={AnnotationDomainType.XDomain}\\n          dataValues={[{ dataValue: start.clone().add(metric, 'd').valueOf() }]}\\n          style={annotationStyle}\\n          hideTooltips\\n          marker={<EuiIcon type={iconMap[side]} />}\\n          markerBody={getMarkerBody((v) => moment(v).format('lll'), isVerticalSide)}\\n        />\\n      )}\\n      <HistogramBarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={Array.from({ length: maxMetric })\\n          .fill(0)\\n          .map((_, i) => ({ x: start.clone().add(i, 'd').valueOf(), y: maxMetric }))}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Annotations/Lines',\n};\n\nexport { Example as xContinuousDomain } from './1_x_continuous.story';\nexport { Example as xOrdinalDomain } from './2_x_ordinal.story';\nexport { Example as xTimeDomain } from './3_x_time.story';\nexport { Example as yDomain } from './4_y_domain.story';\nexport { Example as styling } from './5_styling.story';\nexport { Example as tooltipOptions } from './7_tooltip_options.story';\nexport { Example as advancedMarkers } from './8_advanced_markers.story';\n\n// for testing\nexport { Example as singleBarHistogram } from './6_test_single_bar_histogram.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings, Position } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const x0 = select(\\n    'x0 coordinate',\\n    {\\n      0: 0,\\n      1: 1,\\n      3: 3,\\n      '3.1': 3.1,\\n      'not defined': 'none',\\n    },\\n    0,\\n  );\\n\\n  const x1 = select(\\n    'x1 coordinate',\\n    {\\n      0: 0,\\n      1: 1,\\n      3: 3,\\n      '3.1': 3.1,\\n      'not defined': 'none',\\n    },\\n    1,\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        id=\\\"rect\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: x0 === 'none' ? undefined : Number(x0),\\n              x1: x1 === 'none' ? undefined : Number(x1),\\n              y0: 0,\\n              y1: 4,\\n            },\\n            details: 'details about this annotation',\\n          },\\n        ]}\\n        style={{ fill: 'red' }}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `A \\\\`<RectAnnotation />\\\\` can be used to create a rectangular annotation.\\nAs for most chart component, the required props are: \\\\`id\\\\` to uniquely identify the annotation and\\na \\\\`dataValues\\\\` prop that describes one or more annotations.\\n\\nThe \\\\`dataValues\\\\` prop takes an array of objects adhering to the following type:\\n\\n\\\\`\\\\`\\\\`ts\\n\\ninterface RectAnnotationDatum {\\n  coordinates: {\\n    x0?: PrimitiveValue;\\n    x1?: PrimitiveValue;\\n    y0?: PrimitiveValue;\\n    y1?: PrimitiveValue;\\n  };\\n  details?: string;\\n}\\n\\ntype PrimitiveValue = string | number | null;\\n\\\\`\\\\`\\\\`\\n\\nEach coordinate value can be omitted, if omitted then the corresponding min or max value is used instead.\\nA text can be issued to be shown within the tooltip. If omitted, no tooltip will be shown.\\n\\nIn the above Example, we are using a fixed set of coordinates:\\n\\\\`\\\\`\\\\`\\ncoordinates: {\\n  x0: 0,\\n  x1: 1,\\n  y0: 0,\\n  y1: 7,\\n}\\n\\\\`\\\\`\\\\`\\n\\nThis annotation will cover the X axis starting from the \\\\`0\\\\` value to the \\\\`1\\\\` value included. The \\\\`y\\\\` is covered from 0 to 7.\\nIn a barchart with linear or ordinal x scale, the interval covered by the annotation fully include the \\\\`x0\\\\` and \\\\`x1\\\\` values.\\nIf one value is out of the relative domain, we will clip the annotation to the max/min value of the chart domain.\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":79},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":79}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings, Position } from '@elastic/charts';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n  const x0 = select(\n    'x0 coordinate',\n    {\n      0: 0,\n      1: 1,\n      3: 3,\n      '3.1': 3.1,\n      'not defined': 'none',\n    },\n    0,\n  );\n\n  const x1 = select(\n    'x1 coordinate',\n    {\n      0: 0,\n      1: 1,\n      3: 3,\n      '3.1': 3.1,\n      'not defined': 'none',\n    },\n    1,\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <RectAnnotation\n        id=\"rect\"\n        dataValues={[\n          {\n            coordinates: {\n              x0: x0 === 'none' ? undefined : Number(x0),\n              x1: x1 === 'none' ? undefined : Number(x1),\n              y0: 0,\n              y1: 4,\n            },\n            details: 'details about this annotation',\n          },\n        ]}\n        style={{ fill: 'red' }}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `A \\`<RectAnnotation />\\` can be used to create a rectangular annotation.\nAs for most chart component, the required props are: \\`id\\` to uniquely identify the annotation and\na \\`dataValues\\` prop that describes one or more annotations.\n\nThe \\`dataValues\\` prop takes an array of objects adhering to the following type:\n\n\\`\\`\\`ts\n\ninterface RectAnnotationDatum {\n  coordinates: {\n    x0?: PrimitiveValue;\n    x1?: PrimitiveValue;\n    y0?: PrimitiveValue;\n    y1?: PrimitiveValue;\n  };\n  details?: string;\n}\n\ntype PrimitiveValue = string | number | null;\n\\`\\`\\`\n\nEach coordinate value can be omitted, if omitted then the corresponding min or max value is used instead.\nA text can be issued to be shown within the tooltip. If omitted, no tooltip will be shown.\n\nIn the above Example, we are using a fixed set of coordinates:\n\\`\\`\\`\ncoordinates: {\n  x0: 0,\n  x1: 1,\n  y0: 0,\n  y1: 7,\n}\n\\`\\`\\`\n\nThis annotation will cover the X axis starting from the \\`0\\` value to the \\`1\\` value included. The \\`y\\` is covered from 0 to 7.\nIn a barchart with linear or ordinal x scale, the interval covered by the annotation fully include the \\`x0\\` and \\`x1\\` values.\nIf one value is out of the relative domain, we will clip the annotation to the max/min value of the chart domain.\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const x0 = select(\\n    'x0 coordinate',\\n    {\\n      0: 0,\\n      1: 1,\\n      3: 3,\\n      '3.1': 3.1,\\n      'not defined': 'none',\\n    },\\n    0,\\n  );\\n\\n  const x1 = select(\\n    'x1 coordinate',\\n    {\\n      0: 0,\\n      1: 1,\\n      3: 3,\\n      '3.1': 3.1,\\n      'not defined': 'none',\\n    },\\n    1,\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        id=\\\"rect\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: x0 === 'none' ? undefined : Number(x0),\\n              x1: x1 === 'none' ? undefined : Number(x1),\\n              y0: 0,\\n              y1: 4,\\n            },\\n            details: 'details about this annotation',\\n          },\\n        ]}\\n        style={{ fill: 'red' }}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 'a',\\n              x1: 'c',\\n            },\\n            details: 'annotation on ordinal bar chart',\\n          },\\n        ]}\\n        id=\\\"rect\\\"\\n        style={{ fill: 'red' }}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 3 },\\n          { x: 'c', y: 0 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `On Ordinal Bar charts, you can draw a rectangular annotation the same way it's done within a linear bar chart.\\nThe annotation will cover fully the extent defined by the \\\\`coordinate\\\\` object, extending to the max/min domain values any\\nmissing/out-of-range parameters.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":56},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":56}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <RectAnnotation\n        dataValues={[\n          {\n            coordinates: {\n              x0: 'a',\n              x1: 'c',\n            },\n            details: 'annotation on ordinal bar chart',\n          },\n        ]}\n        id=\"rect\"\n        style={{ fill: 'red' }}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'a', y: 2 },\n          { x: 'b', y: 3 },\n          { x: 'c', y: 0 },\n          { x: 'd', y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `On Ordinal Bar charts, you can draw a rectangular annotation the same way it's done within a linear bar chart.\nThe annotation will cover fully the extent defined by the \\`coordinate\\` object, extending to the max/min domain values any\nmissing/out-of-range parameters.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 'a',\\n              x1: 'c',\\n            },\\n            details: 'annotation on ordinal bar chart',\\n          },\\n        ]}\\n        id=\\\"rect\\\"\\n        style={{ fill: 'red' }}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 3 },\\n          { x: 'c', y: 0 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, RectAnnotation, ScaleType, Settings, RectAnnotationDatum } from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\nimport { BandedAccessorType } from '@elastic/charts/src/utils/geometry';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const definedCoordinate = select(\\n    'green annotation defined coordinate',\\n    {\\n      x0: 'x0',\\n      x1: 'x1',\\n      y0: BandedAccessorType.Y0,\\n      y1: BandedAccessorType.Y1,\\n    },\\n    'x0',\\n  );\\n\\n  const dataValuesRed: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: 1,\\n        x1: 1.25,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details: 'red annotation',\\n    },\\n  ];\\n  const dataValuesBlue: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: 2,\\n        x1: 2.1,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details: 'blue annotation',\\n    },\\n  ];\\n  const dataValuesGreen: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: definedCoordinate === 'x0' ? 0.5 : null,\\n        x1: definedCoordinate === 'x1' ? 2.5 : null,\\n        y0: definedCoordinate === BandedAccessorType.Y0 ? 1.5 : null,\\n        y1: definedCoordinate === BandedAccessorType.Y1 ? 5.5 : null,\\n      },\\n      details: 'green annotation',\\n    },\\n  ];\\n\\n  const isLeft = boolean('y-domain axis is Position.Left', true);\\n  const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n  const yAxisPosition = isLeft ? Position.Left : Position.Right;\\n\\n  const isBottom = boolean('x-domain axis is Position.Bottom', true);\\n  const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\\n  const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation dataValues={dataValuesGreen} id=\\\"rect3\\\" style={{ fill: 'lightgreen' }} />\\n      <RectAnnotation dataValues={dataValuesBlue} id=\\\"rect2\\\" style={{ fill: 'blue' }} />\\n      <RectAnnotation dataValues={dataValuesRed} id=\\\"rect1\\\" style={{ fill: 'red' }} />\\n      <Axis id=\\\"bottom\\\" position={xAxisPosition} title={xAxisTitle} />\\n      <Axis id=\\\"left\\\" title={yAxisTitle} position={yAxisPosition} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":99},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":99}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, RectAnnotation, ScaleType, Settings, RectAnnotationDatum } from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\nimport { BandedAccessorType } from '@elastic/charts/src/utils/geometry';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n\n  const definedCoordinate = select(\n    'green annotation defined coordinate',\n    {\n      x0: 'x0',\n      x1: 'x1',\n      y0: BandedAccessorType.Y0,\n      y1: BandedAccessorType.Y1,\n    },\n    'x0',\n  );\n\n  const dataValuesRed: RectAnnotationDatum[] = [\n    {\n      coordinates: {\n        x0: 1,\n        x1: 1.25,\n        y0: 0,\n        y1: 7,\n      },\n      details: 'red annotation',\n    },\n  ];\n  const dataValuesBlue: RectAnnotationDatum[] = [\n    {\n      coordinates: {\n        x0: 2,\n        x1: 2.1,\n        y0: 0,\n        y1: 7,\n      },\n      details: 'blue annotation',\n    },\n  ];\n  const dataValuesGreen: RectAnnotationDatum[] = [\n    {\n      coordinates: {\n        x0: definedCoordinate === 'x0' ? 0.5 : null,\n        x1: definedCoordinate === 'x1' ? 2.5 : null,\n        y0: definedCoordinate === BandedAccessorType.Y0 ? 1.5 : null,\n        y1: definedCoordinate === BandedAccessorType.Y1 ? 5.5 : null,\n      },\n      details: 'green annotation',\n    },\n  ];\n\n  const isLeft = boolean('y-domain axis is Position.Left', true);\n  const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\n  const yAxisPosition = isLeft ? Position.Left : Position.Right;\n\n  const isBottom = boolean('x-domain axis is Position.Bottom', true);\n  const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\n  const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <RectAnnotation dataValues={dataValuesGreen} id=\"rect3\" style={{ fill: 'lightgreen' }} />\n      <RectAnnotation dataValues={dataValuesBlue} id=\"rect2\" style={{ fill: 'blue' }} />\n      <RectAnnotation dataValues={dataValuesRed} id=\"rect1\" style={{ fill: 'red' }} />\n      <Axis id=\"bottom\" position={xAxisPosition} title={xAxisTitle} />\n      <Axis id=\"left\" title={yAxisTitle} position={yAxisPosition} />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const definedCoordinate = select(\\n    'green annotation defined coordinate',\\n    {\\n      x0: 'x0',\\n      x1: 'x1',\\n      y0: BandedAccessorType.Y0,\\n      y1: BandedAccessorType.Y1,\\n    },\\n    'x0',\\n  );\\n\\n  const dataValuesRed: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: 1,\\n        x1: 1.25,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details: 'red annotation',\\n    },\\n  ];\\n  const dataValuesBlue: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: 2,\\n        x1: 2.1,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details: 'blue annotation',\\n    },\\n  ];\\n  const dataValuesGreen: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: definedCoordinate === 'x0' ? 0.5 : null,\\n        x1: definedCoordinate === 'x1' ? 2.5 : null,\\n        y0: definedCoordinate === BandedAccessorType.Y0 ? 1.5 : null,\\n        y1: definedCoordinate === BandedAccessorType.Y1 ? 5.5 : null,\\n      },\\n      details: 'green annotation',\\n    },\\n  ];\\n\\n  const isLeft = boolean('y-domain axis is Position.Left', true);\\n  const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n  const yAxisPosition = isLeft ? Position.Left : Position.Right;\\n\\n  const isBottom = boolean('x-domain axis is Position.Bottom', true);\\n  const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\\n  const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation dataValues={dataValuesGreen} id=\\\"rect3\\\" style={{ fill: 'lightgreen' }} />\\n      <RectAnnotation dataValues={dataValuesBlue} id=\\\"rect2\\\" style={{ fill: 'blue' }} />\\n      <RectAnnotation dataValues={dataValuesRed} id=\\\"rect1\\\" style={{ fill: 'red' }} />\\n      <Axis id=\\\"bottom\\\" position={xAxisPosition} title={xAxisTitle} />\\n      <Axis id=\\\"left\\\" title={yAxisTitle} position={yAxisPosition} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { array, boolean, color, number } from '@storybook/addon-knobs';\\nimport React, { memo, useEffect, useMemo, useState } from 'react';\\n\\nimport {\\n  AnnotationAnimationConfig,\\n  AnnotationDomainType,\\n  Axis,\\n  Chart,\\n  ChartProps,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  RectAnnotation,\\n  RectAnnotationStyle,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { Position, RecursivePartial } from '@elastic/charts/src/utils/common';\\nimport { TimeFunction } from '@elastic/charts/src/utils/time_functions';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nconst rng = getRandomNumberGenerator();\\nconst randomArray = new Array(100).fill(0).map(() => rng(0, 10, 2));\\nconst ExampleChart = memo<{ animationOptions: AnnotationAnimationConfig['options'] } & ChartProps>(\\n  ({ animationOptions, ...chartProps }) => {\\n    const debug = boolean('debug', false);\\n    const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line');\\n    const xScaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Ordinal'] });\\n    const rotation = customKnobs.enum.rotation();\\n    const dataValues = [\\n      {\\n        coordinates: {\\n          x0: -0.1,\\n          x1: 0.25,\\n        },\\n        details: 'annotation 1',\\n      },\\n      {\\n        coordinates: {\\n          x0: 2,\\n          x1: 3,\\n        },\\n        details: 'annotation 2',\\n      },\\n      {\\n        coordinates: {\\n          x0: 8,\\n          x1: 9,\\n        },\\n        details: 'annotation 3',\\n      },\\n    ];\\n    const lineData = dataValues.flatMap<LineAnnotationDatum>(({ coordinates: { x0, x1 } }) => [\\n      { dataValue: x0, details: 'start' },\\n      { dataValue: x1, details: 'end' },\\n    ]);\\n    const zIndex = number('annotation zIndex', 0, {}, 'Styles');\\n    const rectStyle: RecursivePartial<RectAnnotationStyle> = {\\n      strokeWidth: number('rect border stroke width', 1, {}, 'Styles'),\\n      stroke: color('rect border stroke color', '#e5e5e5', 'Styles'),\\n      fill: color('fill color', '#e5e5e5', 'Styles'),\\n      opacity: number(\\n        'annotation opacity',\\n        0.5,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 1,\\n          step: 0.1,\\n        },\\n        'Styles',\\n      ),\\n    };\\n\\n    const hasCustomTooltip = boolean('has custom tooltip render', false, 'Styles');\\n\\n    const customTooltip = ({ details }: { details?: string }) => (\\n      <div>\\n        <Icon type=\\\"alert\\\" />\\n        {details}\\n      </div>\\n    );\\n\\n    const isLeft = boolean('y-domain axis is Position.Left', true, 'Styles');\\n    const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n    const yAxisPosition = isLeft ? Position.Left : Position.Right;\\n\\n    const isBottom = boolean('x-domain axis is Position.Bottom', true, 'Styles');\\n    const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\\n    const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\\n    const hideTooltips = boolean('hide tooltips', false, 'Styles');\\n    const showLineAnnotations = boolean('showLineAnnotations', true, 'Styles');\\n    const minAnnoCount = lineData.length;\\n    const annotationCount = number('annotation count', minAnnoCount, { min: minAnnoCount, max: 100 }, 'Styles');\\n    randomArray.slice(0, annotationCount - minAnnoCount).forEach((dataValue) => {\\n      lineData.push({ dataValue, details: `Autogen value: ${dataValue}` });\\n    });\\n    const fadeOnFocusingOthers = boolean('FadeOnFocusingOthers', true, 'Animations');\\n    const animations: AnnotationAnimationConfig[] = [];\\n\\n    if (fadeOnFocusingOthers) {\\n      animations.push({ trigger: 'FadeOnFocusingOthers', options: animationOptions });\\n    }\\n\\n    return (\\n      <Chart {...chartProps}>\\n        <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n        <RectAnnotation\\n          dataValues={dataValues}\\n          id=\\\"rect\\\"\\n          style={{ ...rectStyle }}\\n          animations={animations}\\n          customTooltip={hasCustomTooltip ? customTooltip : undefined}\\n          zIndex={zIndex}\\n          hideTooltips={hideTooltips}\\n        />\\n        {showLineAnnotations && (\\n          <LineAnnotation\\n            id=\\\"annotation_1\\\"\\n            domainType={AnnotationDomainType.XDomain}\\n            animations={animations}\\n            dataValues={lineData}\\n            marker={<Icon type=\\\"alert\\\" />}\\n          />\\n        )}\\n        <Axis id=\\\"bottom\\\" position={xAxisPosition} title={xAxisTitle} />\\n        <Axis id=\\\"left\\\" title={yAxisTitle} position={yAxisPosition} />\\n        <SeriesType\\n          id=\\\"series\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 2, y: 10 },\\n            { x: 3, y: 3 },\\n            { x: 4, y: 6 },\\n            { x: 5, y: 12 },\\n            { x: 6, y: 2 },\\n            { x: 7, y: 1 },\\n            { x: 8, y: 8 },\\n            { x: 9, y: 11 },\\n            { x: 10, y: 7 },\\n          ]}\\n        />\\n      </Chart>\\n    );\\n  },\\n);\\n\\nlet prevAnimationStr = '';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const [mountCount, setMountCount] = useState(1);\\n  \\n  const animationOptions: Partial<AnnotationAnimationConfig['options']> = {\\n    enabled: boolean('enabled', true, 'Animations'),\\n    delay: number('delay (ms)', 50, { min: 0, max: 10000, step: 50 }, 'Animations'),\\n    duration: number('duration (ms)', 250, { min: 0, max: 10000, step: 50 }, 'Animations'),\\n    timeFunction: customKnobs.fromEnum('time function', TimeFunction, TimeFunction.easeInOut, {\\n      group: 'Animations',\\n    }),\\n    snapValues: array('snap values', [], undefined, 'Animations').map(Number),\\n  };\\n\\n  // The following is a HACK to remount the chart when the animation options change, see description in markdown\\n  const animationsStr = useMemo(() => JSON.stringify(animationOptions), [animationOptions]);\\n\\n  useEffect(() => {\\n    prevAnimationStr = animationsStr;\\n  }, []); \\n\\n  useEffect(() => {\\n    if (prevAnimationStr !== animationsStr) setMountCount(mountCount + 1);\\n    prevAnimationStr = animationsStr;\\n  }, [animationsStr]); \\n\\n  if (mountCount % 2 === 0) {\\n    return <ExampleChart title={title} description={description} animationOptions={animationOptions} />;\\n  }\\n\\n  action('mounted new chart')();\\n  setTimeout(() => setMountCount((c) => c + 1));\\n  return <></>;\\n};\\n\\nExample.parameters = {\\n  markdown: `Annotations animations are configured via \\\\`RectAnnotation.animations\\\\` or \\\\`LineAnnotation.animations\\\\` which are only read once on intial\\nrender.\\n\\n> :warning: Animations options, excluding \\\\`enabled\\\\`, are set _only_ when the chart is _**mounted**_ and _**not**_ on every rerender. \\\\\\nFor demonstration purposes, the chart on this story is forced to re-mount whenever the animation options change, hence the flashing.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":168},\"endLoc\":{\"col\":1,\"line\":200},\"startBody\":{\"col\":36,\"line\":168},\"endBody\":{\"col\":1,\"line\":200}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { array, boolean, color, number } from '@storybook/addon-knobs';\nimport React, { memo, useEffect, useMemo, useState } from 'react';\n\nimport {\n  AnnotationAnimationConfig,\n  AnnotationDomainType,\n  Axis,\n  Chart,\n  ChartProps,\n  LineAnnotation,\n  LineAnnotationDatum,\n  RectAnnotation,\n  RectAnnotationStyle,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { Position, RecursivePartial } from '@elastic/charts/src/utils/common';\nimport { TimeFunction } from '@elastic/charts/src/utils/time_functions';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nconst rng = getRandomNumberGenerator();\nconst randomArray = new Array(100).fill(0).map(() => rng(0, 10, 2));\nconst ExampleChart = memo<{ animationOptions: AnnotationAnimationConfig['options'] } & ChartProps>(\n  ({ animationOptions, ...chartProps }) => {\n    const debug = boolean('debug', false);\n    const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line');\n    const xScaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Ordinal'] });\n    const rotation = customKnobs.enum.rotation();\n    const dataValues = [\n      {\n        coordinates: {\n          x0: -0.1,\n          x1: 0.25,\n        },\n        details: 'annotation 1',\n      },\n      {\n        coordinates: {\n          x0: 2,\n          x1: 3,\n        },\n        details: 'annotation 2',\n      },\n      {\n        coordinates: {\n          x0: 8,\n          x1: 9,\n        },\n        details: 'annotation 3',\n      },\n    ];\n    const lineData = dataValues.flatMap<LineAnnotationDatum>(({ coordinates: { x0, x1 } }) => [\n      { dataValue: x0, details: 'start' },\n      { dataValue: x1, details: 'end' },\n    ]);\n    const zIndex = number('annotation zIndex', 0, {}, 'Styles');\n    const rectStyle: RecursivePartial<RectAnnotationStyle> = {\n      strokeWidth: number('rect border stroke width', 1, {}, 'Styles'),\n      stroke: color('rect border stroke color', '#e5e5e5', 'Styles'),\n      fill: color('fill color', '#e5e5e5', 'Styles'),\n      opacity: number(\n        'annotation opacity',\n        0.5,\n        {\n          range: true,\n          min: 0,\n          max: 1,\n          step: 0.1,\n        },\n        'Styles',\n      ),\n    };\n\n    const hasCustomTooltip = boolean('has custom tooltip render', false, 'Styles');\n\n    const customTooltip = ({ details }: { details?: string }) => (\n      <div>\n        <Icon type=\"alert\" />\n        {details}\n      </div>\n    );\n\n    const isLeft = boolean('y-domain axis is Position.Left', true, 'Styles');\n    const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\n    const yAxisPosition = isLeft ? Position.Left : Position.Right;\n\n    const isBottom = boolean('x-domain axis is Position.Bottom', true, 'Styles');\n    const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\n    const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\n    const hideTooltips = boolean('hide tooltips', false, 'Styles');\n    const showLineAnnotations = boolean('showLineAnnotations', true, 'Styles');\n    const minAnnoCount = lineData.length;\n    const annotationCount = number('annotation count', minAnnoCount, { min: minAnnoCount, max: 100 }, 'Styles');\n    randomArray.slice(0, annotationCount - minAnnoCount).forEach((dataValue) => {\n      lineData.push({ dataValue, details: `Autogen value: ${dataValue}` });\n    });\n    const fadeOnFocusingOthers = boolean('FadeOnFocusingOthers', true, 'Animations');\n    const animations: AnnotationAnimationConfig[] = [];\n\n    if (fadeOnFocusingOthers) {\n      animations.push({ trigger: 'FadeOnFocusingOthers', options: animationOptions });\n    }\n\n    return (\n      <Chart {...chartProps}>\n        <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n        <RectAnnotation\n          dataValues={dataValues}\n          id=\"rect\"\n          style={{ ...rectStyle }}\n          animations={animations}\n          customTooltip={hasCustomTooltip ? customTooltip : undefined}\n          zIndex={zIndex}\n          hideTooltips={hideTooltips}\n        />\n        {showLineAnnotations && (\n          <LineAnnotation\n            id=\"annotation_1\"\n            domainType={AnnotationDomainType.XDomain}\n            animations={animations}\n            dataValues={lineData}\n            marker={<Icon type=\"alert\" />}\n          />\n        )}\n        <Axis id=\"bottom\" position={xAxisPosition} title={xAxisTitle} />\n        <Axis id=\"left\" title={yAxisTitle} position={yAxisPosition} />\n        <SeriesType\n          id=\"series\"\n          xScaleType={xScaleType}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={[\n            { x: 0, y: 2 },\n            { x: 1, y: 3 },\n            { x: 2, y: 10 },\n            { x: 3, y: 3 },\n            { x: 4, y: 6 },\n            { x: 5, y: 12 },\n            { x: 6, y: 2 },\n            { x: 7, y: 1 },\n            { x: 8, y: 8 },\n            { x: 9, y: 11 },\n            { x: 10, y: 7 },\n          ]}\n        />\n      </Chart>\n    );\n  },\n);\n\nlet prevAnimationStr = '';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const [mountCount, setMountCount] = useState(1);\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  const animationOptions: Partial<AnnotationAnimationConfig['options']> = {\n    enabled: boolean('enabled', true, 'Animations'),\n    delay: number('delay (ms)', 50, { min: 0, max: 10000, step: 50 }, 'Animations'),\n    duration: number('duration (ms)', 250, { min: 0, max: 10000, step: 50 }, 'Animations'),\n    timeFunction: customKnobs.fromEnum('time function', TimeFunction, TimeFunction.easeInOut, {\n      group: 'Animations',\n    }),\n    snapValues: array('snap values', [], undefined, 'Animations').map(Number),\n  };\n\n  // The following is a HACK to remount the chart when the animation options change, see description in markdown\n  const animationsStr = useMemo(() => JSON.stringify(animationOptions), [animationOptions]);\n\n  useEffect(() => {\n    prevAnimationStr = animationsStr;\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    if (prevAnimationStr !== animationsStr) setMountCount(mountCount + 1);\n    prevAnimationStr = animationsStr;\n  }, [animationsStr]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  if (mountCount % 2 === 0) {\n    return <ExampleChart title={title} description={description} animationOptions={animationOptions} />;\n  }\n\n  action('mounted new chart')();\n  setTimeout(() => setMountCount((c) => c + 1));\n  return <></>;\n};\n\nExample.parameters = {\n  markdown: `Annotations animations are configured via \\`RectAnnotation.animations\\` or \\`LineAnnotation.animations\\` which are only read once on intial\nrender.\n\n> :warning: Animations options, excluding \\`enabled\\`, are set _only_ when the chart is _**mounted**_ and _**not**_ on every rerender. \\\nFor demonstration purposes, the chart on this story is forced to re-mount whenever the animation options change, hence the flashing.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const [mountCount, setMountCount] = useState(1);\\n  \\n  const animationOptions: Partial<AnnotationAnimationConfig['options']> = {\\n    enabled: boolean('enabled', true, 'Animations'),\\n    delay: number('delay (ms)', 50, { min: 0, max: 10000, step: 50 }, 'Animations'),\\n    duration: number('duration (ms)', 250, { min: 0, max: 10000, step: 50 }, 'Animations'),\\n    timeFunction: customKnobs.fromEnum('time function', TimeFunction, TimeFunction.easeInOut, {\\n      group: 'Animations',\\n    }),\\n    snapValues: array('snap values', [], undefined, 'Animations').map(Number),\\n  };\\n\\n  // The following is a HACK to remount the chart when the animation options change, see description in markdown\\n  const animationsStr = useMemo(() => JSON.stringify(animationOptions), [animationOptions]);\\n\\n  useEffect(() => {\\n    prevAnimationStr = animationsStr;\\n  }, []); \\n\\n  useEffect(() => {\\n    if (prevAnimationStr !== animationsStr) setMountCount(mountCount + 1);\\n    prevAnimationStr = animationsStr;\\n  }, [animationsStr]); \\n\\n  if (mountCount % 2 === 0) {\\n    return <ExampleChart title={title} description={description} animationOptions={animationOptions} />;\\n  }\\n\\n  action('mounted new chart')();\\n  setTimeout(() => setMountCount((c) => c + 1));\\n  return <></>;\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationTooltipFormatter,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  ScaleType,\\n  RectAnnotation,\\n  Settings,\\n} from '@elastic/charts';\\nimport { CustomAnnotationTooltip } from '@elastic/charts/src/chart_types/xy_chart/annotations/types';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const boundary = customKnobs.enum.boundary();\\n  const placement = customKnobs.enum.placement('Tooltip placement');\\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\\n  const rotation = customKnobs.enum.rotation();\\n  const showCustomTooltip = boolean('custom tooltip', false);\\n  const showCustomDetails = boolean('custom tooltip details', false);\\n  const details = select(\\n    'details value',\\n    {\\n      foo: 'foo',\\n      undefined,\\n    },\\n    'foo',\\n  );\\n\\n  const dataValues = [\\n    {\\n      coordinates: {\\n        x0: 0,\\n        x1: 1,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details,\\n    },\\n  ];\\n\\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\\n    ? ({ details }) => (\\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\\n          <h2>custom tooltip</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\\n    ? (details) => (\\n        <div>\\n          <h2>custom Details</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        dataValues={dataValues}\\n        id=\\\"rect\\\"\\n        boundary={boundary}\\n        placement={placement}\\n        fallbackPlacements={fallbackPlacements}\\n        customTooltip={customTooltip}\\n        customTooltipDetails={customTooltipDetails}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":101},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":101}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationTooltipFormatter,\n  Axis,\n  BarSeries,\n  Chart,\n  ScaleType,\n  RectAnnotation,\n  Settings,\n} from '@elastic/charts';\nimport { CustomAnnotationTooltip } from '@elastic/charts/src/chart_types/xy_chart/annotations/types';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const boundary = customKnobs.enum.boundary();\n  const placement = customKnobs.enum.placement('Tooltip placement');\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\n  const rotation = customKnobs.enum.rotation();\n  const showCustomTooltip = boolean('custom tooltip', false);\n  const showCustomDetails = boolean('custom tooltip details', false);\n  const details = select(\n    'details value',\n    {\n      foo: 'foo',\n      undefined,\n    },\n    'foo',\n  );\n\n  const dataValues = [\n    {\n      coordinates: {\n        x0: 0,\n        x1: 1,\n        y0: 0,\n        y1: 7,\n      },\n      details,\n    },\n  ];\n\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\n    ? ({ details }) => (\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\n          <h2>custom tooltip</h2>\n          <p>{details}</p>\n        </div>\n      )\n    : undefined;\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\n    ? (details) => (\n        <div>\n          <h2>custom Details</h2>\n          <p>{details}</p>\n        </div>\n      )\n    : undefined;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\n      <RectAnnotation\n        dataValues={dataValues}\n        id=\"rect\"\n        boundary={boundary}\n        placement={placement}\n        fallbackPlacements={fallbackPlacements}\n        customTooltip={customTooltip}\n        customTooltipDetails={customTooltipDetails}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const boundary = customKnobs.enum.boundary();\\n  const placement = customKnobs.enum.placement('Tooltip placement');\\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\\n  const rotation = customKnobs.enum.rotation();\\n  const showCustomTooltip = boolean('custom tooltip', false);\\n  const showCustomDetails = boolean('custom tooltip details', false);\\n  const details = select(\\n    'details value',\\n    {\\n      foo: 'foo',\\n      undefined,\\n    },\\n    'foo',\\n  );\\n\\n  const dataValues = [\\n    {\\n      coordinates: {\\n        x0: 0,\\n        x1: 1,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details,\\n    },\\n  ];\\n\\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\\n    ? ({ details }) => (\\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\\n          <h2>custom tooltip</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\\n    ? (details) => (\\n        <div>\\n          <h2>custom Details</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        dataValues={dataValues}\\n        id=\\\"rect\\\"\\n        boundary={boundary}\\n        placement={placement}\\n        fallbackPlacements={fallbackPlacements}\\n        customTooltip={customTooltip}\\n        customTooltipDetails={customTooltipDetails}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\n\\nconst getKnobs = () => {\\n  const minY = number('min y', 0);\\n  const maxY = number('max y', 20);\\n  const x0 = number('x0', 5);\\n  const x1 = number('x1', 10);\\n  const enableYValues = boolean('enable y0 and y1 values', true);\\n  return {\\n    minY,\\n    maxY,\\n    x0,\\n    x1,\\n    y0: enableYValues ? number('y0', 1) : undefined,\\n    y1: enableYValues ? number('y1', 5) : undefined,\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const xAxisKnobs = getKnobs();\\n  // only show the fit enable or disable if relevant\\n  const fit = xAxisKnobs.minY === xAxisKnobs.maxY ? boolean('fit to the domain', false) : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <RectAnnotation id=\\\"rect\\\" dataValues={[{ coordinates: xAxisKnobs }]} style={{ fill: 'red' }} />\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        id=\\\"left\\\"\\n        title=\\\"y-domain axis\\\"\\n        position={Position.Left}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: xAxisKnobs.minY },\\n          { x: 5, y: (xAxisKnobs.minY + xAxisKnobs.maxY) / 2 },\\n          { x: 20, y: xAxisKnobs.maxY },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":68},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":68}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\n\nconst getKnobs = () => {\n  const minY = number('min y', 0);\n  const maxY = number('max y', 20);\n  const x0 = number('x0', 5);\n  const x1 = number('x1', 10);\n  const enableYValues = boolean('enable y0 and y1 values', true);\n  return {\n    minY,\n    maxY,\n    x0,\n    x1,\n    y0: enableYValues ? number('y0', 1) : undefined,\n    y1: enableYValues ? number('y1', 5) : undefined,\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const xAxisKnobs = getKnobs();\n  // only show the fit enable or disable if relevant\n  const fit = xAxisKnobs.minY === xAxisKnobs.maxY ? boolean('fit to the domain', false) : undefined;\n\n  return (\n    <Chart title={title} description={description}>\n      <RectAnnotation id=\"rect\" dataValues={[{ coordinates: xAxisKnobs }]} style={{ fill: 'red' }} />\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n        }}\n        id=\"left\"\n        title=\"y-domain axis\"\n        position={Position.Left}\n      />\n      <BarSeries\n        id=\"bars\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={[\n          { x: 0, y: xAxisKnobs.minY },\n          { x: 5, y: (xAxisKnobs.minY + xAxisKnobs.maxY) / 2 },\n          { x: 20, y: xAxisKnobs.maxY },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const xAxisKnobs = getKnobs();\\n  // only show the fit enable or disable if relevant\\n  const fit = xAxisKnobs.minY === xAxisKnobs.maxY ? boolean('fit to the domain', false) : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <RectAnnotation id=\\\"rect\\\" dataValues={[{ coordinates: xAxisKnobs }]} style={{ fill: 'red' }} />\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        id=\\\"left\\\"\\n        title=\\\"y-domain axis\\\"\\n        position={Position.Left}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: xAxisKnobs.minY },\\n          { x: 5, y: (xAxisKnobs.minY + xAxisKnobs.maxY) / 2 },\\n          { x: 20, y: xAxisKnobs.maxY },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\n\\nconst getKnobs = () => {\\n  const enabled = boolean('enable annotation', true);\\n  let groupId: string | undefined = select(\\n    'Annotation groupId',\\n    { group1: 'group1', group2: 'group2', none: 'none' },\\n    'group1',\\n  );\\n  if (groupId === 'none') {\\n    groupId = undefined;\\n  }\\n  const x0 = number('x0', 5);\\n  const x1 = number('x1', 10);\\n  const yDefined = boolean('enable y0 and y1 values', false);\\n  return {\\n    enabled,\\n    groupId,\\n    x0,\\n    x1,\\n    y0: yDefined ? number('y0', 0) : undefined,\\n    y1: yDefined ? number('y1', 3) : undefined,\\n  };\\n};\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const xAxisKnobs = getKnobs();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      {xAxisKnobs.enabled && (\\n        <RectAnnotation\\n          groupId={xAxisKnobs.groupId}\\n          id=\\\"x axis\\\"\\n          dataValues={[{ coordinates: xAxisKnobs }]}\\n          style={{ fill: 'red' }}\\n        />\\n      )}\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" groupId=\\\"group2\\\" position={Position.Bottom} title=\\\"Bottom (groupId=group2)\\\" />\\n      <Axis id=\\\"left\\\" groupId=\\\"group1\\\" position={Position.Left} title=\\\"Left (groupId=group1)\\\" />\\n      <Axis id=\\\"top\\\" groupId=\\\"group1\\\" position={Position.Top} title=\\\"Top (groupId=group1)\\\" />\\n      <Axis id=\\\"right\\\" groupId=\\\"group2\\\" position={Position.Right} title=\\\"Right (groupId=group2)\\\" />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        groupId=\\\"group1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 5 },\\n          { x: 5, y: 1 },\\n          { x: 20, y: 10 },\\n        ]}\\n      />\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        groupId=\\\"group2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 61 },\\n          { x: 5, y: 43 },\\n          { x: 20, y: 49 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":40},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":40},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\n\nconst getKnobs = () => {\n  const enabled = boolean('enable annotation', true);\n  let groupId: string | undefined = select(\n    'Annotation groupId',\n    { group1: 'group1', group2: 'group2', none: 'none' },\n    'group1',\n  );\n  if (groupId === 'none') {\n    groupId = undefined;\n  }\n  const x0 = number('x0', 5);\n  const x1 = number('x1', 10);\n  const yDefined = boolean('enable y0 and y1 values', false);\n  return {\n    enabled,\n    groupId,\n    x0,\n    x1,\n    y0: yDefined ? number('y0', 0) : undefined,\n    y1: yDefined ? number('y1', 3) : undefined,\n  };\n};\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const xAxisKnobs = getKnobs();\n\n  return (\n    <Chart title={title} description={description}>\n      {xAxisKnobs.enabled && (\n        <RectAnnotation\n          groupId={xAxisKnobs.groupId}\n          id=\"x axis\"\n          dataValues={[{ coordinates: xAxisKnobs }]}\n          style={{ fill: 'red' }}\n        />\n      )}\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" groupId=\"group2\" position={Position.Bottom} title=\"Bottom (groupId=group2)\" />\n      <Axis id=\"left\" groupId=\"group1\" position={Position.Left} title=\"Left (groupId=group1)\" />\n      <Axis id=\"top\" groupId=\"group1\" position={Position.Top} title=\"Top (groupId=group1)\" />\n      <Axis id=\"right\" groupId=\"group2\" position={Position.Right} title=\"Right (groupId=group2)\" />\n      <BarSeries\n        id=\"bars\"\n        groupId=\"group1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 5 },\n          { x: 5, y: 1 },\n          { x: 20, y: 10 },\n        ]}\n      />\n      <BarSeries\n        id=\"bars1\"\n        groupId=\"group2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 61 },\n          { x: 5, y: 43 },\n          { x: 20, y: 49 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const xAxisKnobs = getKnobs();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      {xAxisKnobs.enabled && (\\n        <RectAnnotation\\n          groupId={xAxisKnobs.groupId}\\n          id=\\\"x axis\\\"\\n          dataValues={[{ coordinates: xAxisKnobs }]}\\n          style={{ fill: 'red' }}\\n        />\\n      )}\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" groupId=\\\"group2\\\" position={Position.Bottom} title=\\\"Bottom (groupId=group2)\\\" />\\n      <Axis id=\\\"left\\\" groupId=\\\"group1\\\" position={Position.Left} title=\\\"Left (groupId=group1)\\\" />\\n      <Axis id=\\\"top\\\" groupId=\\\"group1\\\" position={Position.Top} title=\\\"Top (groupId=group1)\\\" />\\n      <Axis id=\\\"right\\\" groupId=\\\"group2\\\" position={Position.Right} title=\\\"Right (groupId=group2)\\\" />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        groupId=\\\"group1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 5 },\\n          { x: 5, y: 1 },\\n          { x: 20, y: 10 },\\n        ]}\\n      />\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        groupId=\\\"group2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 61 },\\n          { x: 5, y: 43 },\\n          { x: 20, y: 49 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nconst vGroups = {\\n  Primary: 'primary',\\n  Secondary: 'secondary',\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const tickSize = number('Tick size', 10, { min: 0, max: 20, step: 1 });\\n  const hideAxes = boolean('Hide all axes', false);\\n\\n  const domainAxis = select(\\n    'Domain axis',\\n    {\\n      'X axis': 'x',\\n      'Y axis': 'y',\\n    },\\n    'x',\\n    'Annotations',\\n  );\\n  const isX = domainAxis === 'x';\\n  const isVert = isX ? rotation === 0 || rotation === 180 : rotation === 90 || rotation === -90;\\n  const outside = boolean('Render outside chart', true, 'Annotations');\\n  const outsideDimension = number('Outside dimension', 5, { min: 0, step: 1 }, 'Annotations');\\n  const redGroupId = select('Red groupId', vGroups, vGroups.Primary, 'Annotations');\\n  const blueGroupId = select('Blue groupId', vGroups, vGroups.Secondary, 'Annotations');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        rotation={rotation}\\n        theme={{ axes: { tickLine: { size: tickSize } } }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis\\n        id=\\\"left\\\"\\n        hide={hideAxes}\\n        groupId={isVert ? undefined : vGroups.Primary}\\n        position={Position.Left}\\n        title={isVert ? 'Left' : 'Primary - Left'}\\n      />\\n      {!isVert && (\\n        <Axis\\n          id=\\\"right\\\"\\n          hide={hideAxes}\\n          groupId={vGroups.Secondary}\\n          position={Position.Right}\\n          title=\\\"Secondary - Right\\\"\\n        />\\n      )}\\n      <Axis\\n        id=\\\"bottom\\\"\\n        hide={hideAxes}\\n        groupId={isVert ? vGroups.Primary : undefined}\\n        position={Position.Bottom}\\n        title={isVert ? 'Primary - Bottom' : 'Bottom'}\\n      />\\n      {isVert && (\\n        <Axis id=\\\"top\\\" hide={hideAxes} groupId={vGroups.Secondary} position={Position.Top} title=\\\"Secondary - Top\\\" />\\n      )}\\n\\n      <RectAnnotation\\n        groupId={redGroupId}\\n        dataValues={[\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 2,\\n                  x1: 4,\\n                }\\n              : {\\n                  y0: 1,\\n                  y1: 2,\\n                },\\n            details: 'Red - One',\\n          },\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 7,\\n                  x1: 10,\\n                }\\n              : {\\n                  y0: 5,\\n                  y1: 7,\\n                },\\n            details: 'Red - Two',\\n          },\\n        ]}\\n        id=\\\"red\\\"\\n        style={{ fill: '#b62b39' }}\\n        outside={outside}\\n        outsideDimension={outsideDimension}\\n      />\\n      <RectAnnotation\\n        groupId={blueGroupId}\\n        dataValues={[\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 5,\\n                  x1: 6,\\n                }\\n              : {\\n                  y0: 3,\\n                  y1: 4,\\n                },\\n            details: 'Blue - One',\\n          },\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 17,\\n                  x1: 30,\\n                }\\n              : {\\n                  y0: 8,\\n                  y1: 20,\\n                },\\n            details: 'Blue - Two',\\n          },\\n        ]}\\n        id=\\\"blue\\\"\\n        style={{ fill: '#2b5fb6' }}\\n        outside={outside}\\n        outsideDimension={outsideDimension}\\n      />\\n\\n      <LineSeries\\n        id=\\\"lines1\\\"\\n        groupId={isX ? undefined : vGroups.Primary}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 13, y: 10 },\\n          { x: 20, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines2\\\"\\n        groupId={isX ? undefined : vGroups.Secondary}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 5 },\\n          { x: 13, y: 7 },\\n          { x: 20, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":178},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":178}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nconst vGroups = {\n  Primary: 'primary',\n  Secondary: 'secondary',\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n  const tickSize = number('Tick size', 10, { min: 0, max: 20, step: 1 });\n  const hideAxes = boolean('Hide all axes', false);\n\n  const domainAxis = select(\n    'Domain axis',\n    {\n      'X axis': 'x',\n      'Y axis': 'y',\n    },\n    'x',\n    'Annotations',\n  );\n  const isX = domainAxis === 'x';\n  const isVert = isX ? rotation === 0 || rotation === 180 : rotation === 90 || rotation === -90;\n  const outside = boolean('Render outside chart', true, 'Annotations');\n  const outsideDimension = number('Outside dimension', 5, { min: 0, step: 1 }, 'Annotations');\n  const redGroupId = select('Red groupId', vGroups, vGroups.Primary, 'Annotations');\n  const blueGroupId = select('Blue groupId', vGroups, vGroups.Secondary, 'Annotations');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        rotation={rotation}\n        theme={{ axes: { tickLine: { size: tickSize } } }}\n        baseTheme={useBaseTheme()}\n      />\n\n      <Axis\n        id=\"left\"\n        hide={hideAxes}\n        groupId={isVert ? undefined : vGroups.Primary}\n        position={Position.Left}\n        title={isVert ? 'Left' : 'Primary - Left'}\n      />\n      {!isVert && (\n        <Axis\n          id=\"right\"\n          hide={hideAxes}\n          groupId={vGroups.Secondary}\n          position={Position.Right}\n          title=\"Secondary - Right\"\n        />\n      )}\n      <Axis\n        id=\"bottom\"\n        hide={hideAxes}\n        groupId={isVert ? vGroups.Primary : undefined}\n        position={Position.Bottom}\n        title={isVert ? 'Primary - Bottom' : 'Bottom'}\n      />\n      {isVert && (\n        <Axis id=\"top\" hide={hideAxes} groupId={vGroups.Secondary} position={Position.Top} title=\"Secondary - Top\" />\n      )}\n\n      <RectAnnotation\n        groupId={redGroupId}\n        dataValues={[\n          {\n            coordinates: isX\n              ? {\n                  x0: 2,\n                  x1: 4,\n                }\n              : {\n                  y0: 1,\n                  y1: 2,\n                },\n            details: 'Red - One',\n          },\n          {\n            coordinates: isX\n              ? {\n                  x0: 7,\n                  x1: 10,\n                }\n              : {\n                  y0: 5,\n                  y1: 7,\n                },\n            details: 'Red - Two',\n          },\n        ]}\n        id=\"red\"\n        style={{ fill: '#b62b39' }}\n        outside={outside}\n        outsideDimension={outsideDimension}\n      />\n      <RectAnnotation\n        groupId={blueGroupId}\n        dataValues={[\n          {\n            coordinates: isX\n              ? {\n                  x0: 5,\n                  x1: 6,\n                }\n              : {\n                  y0: 3,\n                  y1: 4,\n                },\n            details: 'Blue - One',\n          },\n          {\n            coordinates: isX\n              ? {\n                  x0: 17,\n                  x1: 30,\n                }\n              : {\n                  y0: 8,\n                  y1: 20,\n                },\n            details: 'Blue - Two',\n          },\n        ]}\n        id=\"blue\"\n        style={{ fill: '#2b5fb6' }}\n        outside={outside}\n        outsideDimension={outsideDimension}\n      />\n\n      <LineSeries\n        id=\"lines1\"\n        groupId={isX ? undefined : vGroups.Primary}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 13, y: 10 },\n          { x: 20, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines2\"\n        groupId={isX ? undefined : vGroups.Secondary}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 5 },\n          { x: 13, y: 7 },\n          { x: 20, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const tickSize = number('Tick size', 10, { min: 0, max: 20, step: 1 });\\n  const hideAxes = boolean('Hide all axes', false);\\n\\n  const domainAxis = select(\\n    'Domain axis',\\n    {\\n      'X axis': 'x',\\n      'Y axis': 'y',\\n    },\\n    'x',\\n    'Annotations',\\n  );\\n  const isX = domainAxis === 'x';\\n  const isVert = isX ? rotation === 0 || rotation === 180 : rotation === 90 || rotation === -90;\\n  const outside = boolean('Render outside chart', true, 'Annotations');\\n  const outsideDimension = number('Outside dimension', 5, { min: 0, step: 1 }, 'Annotations');\\n  const redGroupId = select('Red groupId', vGroups, vGroups.Primary, 'Annotations');\\n  const blueGroupId = select('Blue groupId', vGroups, vGroups.Secondary, 'Annotations');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        rotation={rotation}\\n        theme={{ axes: { tickLine: { size: tickSize } } }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis\\n        id=\\\"left\\\"\\n        hide={hideAxes}\\n        groupId={isVert ? undefined : vGroups.Primary}\\n        position={Position.Left}\\n        title={isVert ? 'Left' : 'Primary - Left'}\\n      />\\n      {!isVert && (\\n        <Axis\\n          id=\\\"right\\\"\\n          hide={hideAxes}\\n          groupId={vGroups.Secondary}\\n          position={Position.Right}\\n          title=\\\"Secondary - Right\\\"\\n        />\\n      )}\\n      <Axis\\n        id=\\\"bottom\\\"\\n        hide={hideAxes}\\n        groupId={isVert ? vGroups.Primary : undefined}\\n        position={Position.Bottom}\\n        title={isVert ? 'Primary - Bottom' : 'Bottom'}\\n      />\\n      {isVert && (\\n        <Axis id=\\\"top\\\" hide={hideAxes} groupId={vGroups.Secondary} position={Position.Top} title=\\\"Secondary - Top\\\" />\\n      )}\\n\\n      <RectAnnotation\\n        groupId={redGroupId}\\n        dataValues={[\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 2,\\n                  x1: 4,\\n                }\\n              : {\\n                  y0: 1,\\n                  y1: 2,\\n                },\\n            details: 'Red - One',\\n          },\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 7,\\n                  x1: 10,\\n                }\\n              : {\\n                  y0: 5,\\n                  y1: 7,\\n                },\\n            details: 'Red - Two',\\n          },\\n        ]}\\n        id=\\\"red\\\"\\n        style={{ fill: '#b62b39' }}\\n        outside={outside}\\n        outsideDimension={outsideDimension}\\n      />\\n      <RectAnnotation\\n        groupId={blueGroupId}\\n        dataValues={[\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 5,\\n                  x1: 6,\\n                }\\n              : {\\n                  y0: 3,\\n                  y1: 4,\\n                },\\n            details: 'Blue - One',\\n          },\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 17,\\n                  x1: 30,\\n                }\\n              : {\\n                  y0: 8,\\n                  y1: 20,\\n                },\\n            details: 'Blue - Two',\\n          },\\n        ]}\\n        id=\\\"blue\\\"\\n        style={{ fill: '#2b5fb6' }}\\n        outside={outside}\\n        outsideDimension={outsideDimension}\\n      />\\n\\n      <LineSeries\\n        id=\\\"lines1\\\"\\n        groupId={isX ? undefined : vGroups.Primary}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 13, y: 10 },\\n          { x: 20, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines2\\\"\\n        groupId={isX ? undefined : vGroups.Secondary}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 5 },\\n          { x: 13, y: 7 },\\n          { x: 20, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  LineSeries,\\n  Chart,\\n  RectAnnotation,\\n  ScaleType,\\n  Settings,\\n  Position,\\n  AnnotationDomainType,\\n  LineAnnotation,\\n  BarSeries,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { getDebugStateLogger } from '../../utils/debug_state_logger';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onAnnotationClick = boolean('onAnnotationClick listener', true);\\n  const onElementClick = boolean('onElementClick listener', true);\\n  const typeOfSeries = select('series type', ['line', 'bar'], 'bar');\\n  const debugState = boolean('Enable debug state', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        baseTheme={useBaseTheme()}\\n        onAnnotationClick={onAnnotationClick ? action('onAnnotationClick') : undefined}\\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect1\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0,\\n              x1: 1,\\n              y0: 0,\\n              y1: 4,\\n            },\\n            details: 'details about this annotation',\\n          },\\n        ]}\\n        style={{ fill: 'red' }}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect2\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0.8,\\n              x1: 2,\\n              y0: 1,\\n              y1: 5,\\n            },\\n            details: 'details about this other annotation',\\n          },\\n        ]}\\n        style={{ fill: 'blue' }}\\n      />\\n      <LineAnnotation\\n        id=\\\"line_annotation\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={[{ dataValue: 2, details: `detail-${0}` }]}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={Position.Top}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      {typeOfSeries === 'line' ? (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 1.5, y: 4 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      ) : (\\n        <BarSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 1.5, y: 4 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":116},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":116}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  LineSeries,\n  Chart,\n  RectAnnotation,\n  ScaleType,\n  Settings,\n  Position,\n  AnnotationDomainType,\n  LineAnnotation,\n  BarSeries,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { getDebugStateLogger } from '../../utils/debug_state_logger';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onAnnotationClick = boolean('onAnnotationClick listener', true);\n  const onElementClick = boolean('onElementClick listener', true);\n  const typeOfSeries = select('series type', ['line', 'bar'], 'bar');\n  const debugState = boolean('Enable debug state', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        baseTheme={useBaseTheme()}\n        onAnnotationClick={onAnnotationClick ? action('onAnnotationClick') : undefined}\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\n      />\n      <RectAnnotation\n        id=\"rect1\"\n        dataValues={[\n          {\n            coordinates: {\n              x0: 0,\n              x1: 1,\n              y0: 0,\n              y1: 4,\n            },\n            details: 'details about this annotation',\n          },\n        ]}\n        style={{ fill: 'red' }}\n      />\n      <RectAnnotation\n        id=\"rect2\"\n        dataValues={[\n          {\n            coordinates: {\n              x0: 0.8,\n              x1: 2,\n              y0: 1,\n              y1: 5,\n            },\n            details: 'details about this other annotation',\n          },\n        ]}\n        style={{ fill: 'blue' }}\n      />\n      <LineAnnotation\n        id=\"line_annotation\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={[{ dataValue: 2, details: `detail-${0}` }]}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={Position.Top}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      {typeOfSeries === 'line' ? (\n        <LineSeries\n          id=\"lines\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={[\n            { x: 0, y: 2 },\n            { x: 1, y: 3 },\n            { x: 1.5, y: 4 },\n            { x: 3, y: 6 },\n          ]}\n        />\n      ) : (\n        <BarSeries\n          id=\"lines\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={[\n            { x: 0, y: 2 },\n            { x: 1, y: 3 },\n            { x: 1.5, y: 4 },\n            { x: 3, y: 6 },\n          ]}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onAnnotationClick = boolean('onAnnotationClick listener', true);\\n  const onElementClick = boolean('onElementClick listener', true);\\n  const typeOfSeries = select('series type', ['line', 'bar'], 'bar');\\n  const debugState = boolean('Enable debug state', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        baseTheme={useBaseTheme()}\\n        onAnnotationClick={onAnnotationClick ? action('onAnnotationClick') : undefined}\\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect1\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0,\\n              x1: 1,\\n              y0: 0,\\n              y1: 4,\\n            },\\n            details: 'details about this annotation',\\n          },\\n        ]}\\n        style={{ fill: 'red' }}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect2\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0.8,\\n              x1: 2,\\n              y0: 1,\\n              y1: 5,\\n            },\\n            details: 'details about this other annotation',\\n          },\\n        ]}\\n        style={{ fill: 'blue' }}\\n      />\\n      <LineAnnotation\\n        id=\\\"line_annotation\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={[{ dataValue: 2, details: `detail-${0}` }]}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={Position.Top}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      {typeOfSeries === 'line' ? (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 1.5, y: 4 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      ) : (\\n        <BarSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 1.5, y: 4 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Annotations/Rects',\n};\n\nexport { Example as linearBarChart } from './1_linear_bar_chart.story';\nexport { Example as ordinalBarChart } from './2_ordinal_bar_chart.story';\nexport { Example as linearLineChart } from './3_linear_line_chart.story';\nexport { Example as styling } from './4_styling.story';\nexport { Example as tooltipOptions } from './5_tooltip_options.story';\nexport { Example as zeroDomain } from './6_zero_domain.story';\nexport { Example as withGroupId } from './7_with_group_id.story';\nexport { Example as outside } from './8_outside.story';\nexport { Example as clickHandleRectAnnotation } from './9_click_handler.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"timestamp per 1 minute\\\"\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"1\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n    />\\n    <AreaSeries\\n      id=\\\"2\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n    />\\n    <AreaSeries\\n      id=\\\"3\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"timestamp per 1 minute\"\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n    <AreaSeries\n      id=\"1\"\n      name=\"Count\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n    />\n    <AreaSeries\n      id=\"2\"\n      name=\"Count\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n    />\n    <AreaSeries\n      id=\"3\"\n      name=\"Count\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"timestamp per 1 minute\\\"\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"1\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n    />\\n    <AreaSeries\\n      id=\\\"2\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n    />\\n    <AreaSeries\\n      id=\\\"3\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1],\\n    [start.plus({ minute: 1 }).toMillis(), 2],\\n    [start.plus({ minute: 2 }).toMillis(), 3],\\n    [start.plus({ minute: 3 }).toMillis(), 4],\\n    [start.plus({ minute: 4 }).toMillis(), 5],\\n    [start.plus({ minute: 5 }).toMillis(), 4],\\n    [start.plus({ minute: 6 }).toMillis(), 3],\\n    [start.plus({ minute: 7 }).toMillis(), 2],\\n    [start.plus({ minute: 8 }).toMillis(), 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data = [\n    [start.toMillis(), 1],\n    [start.plus({ minute: 1 }).toMillis(), 2],\n    [start.plus({ minute: 2 }).toMillis(), 3],\n    [start.plus({ minute: 3 }).toMillis(), 4],\n    [start.plus({ minute: 4 }).toMillis(), 5],\n    [start.plus({ minute: 5 }).toMillis(), 4],\n    [start.plus({ minute: 6 }).toMillis(), 3],\n    [start.plus({ minute: 7 }).toMillis(), 2],\n    [start.plus({ minute: 8 }).toMillis(), 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id=\"data\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1],\\n    [start.plus({ minute: 1 }).toMillis(), 2],\\n    [start.plus({ minute: 2 }).toMillis(), 3],\\n    [start.plus({ minute: 3 }).toMillis(), 4],\\n    [start.plus({ minute: 4 }).toMillis(), 5],\\n    [start.plus({ minute: 5 }).toMillis(), 4],\\n    [start.plus({ minute: 6 }).toMillis(), 3],\\n    [start.plus({ minute: 7 }).toMillis(), 2],\\n    [start.plus({ minute: 8 }).toMillis(), 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const getRandomNumber = getRandomNumberGenerator();\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => ({\\n    x: d[0],\\n    max: d[1] + 4 + 4 * getRandomNumber(),\\n    min: d[1] - 4 - 4 * getRandomNumber(),\\n  }));\\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [d[0], d[1]]);\\n  const fit = boolean('fit Y domain', true);\\n  const y0AccessorFormat = text('y0AccessorFormat', '');\\n  const y1AccessorFormat = text('y1AccessorFormat', '');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['max']}\\n        y0Accessors={['min']}\\n        y1AccessorFormat={y1AccessorFormat || undefined}\\n        y0AccessorFormat={y0AccessorFormat || undefined}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n\\n      <LineSeries\\n        id=\\\"average\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={lineData}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":88},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":88}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const getRandomNumber = getRandomNumberGenerator();\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => ({\n    x: d[0],\n    max: d[1] + 4 + 4 * getRandomNumber(),\n    min: d[1] - 4 - 4 * getRandomNumber(),\n  }));\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [d[0], d[1]]);\n  const fit = boolean('fit Y domain', true);\n  const y0AccessorFormat = text('y0AccessorFormat', '');\n  const y1AccessorFormat = text('y1AccessorFormat', '');\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"timestamp per 1 minute\"\n        position={Position.Bottom}\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis\n        id=\"left\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n        }}\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['max']}\n        y0Accessors={['min']}\n        y1AccessorFormat={y1AccessorFormat || undefined}\n        y0AccessorFormat={y0AccessorFormat || undefined}\n        data={data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n\n      <LineSeries\n        id=\"average\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={lineData}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const getRandomNumber = getRandomNumberGenerator();\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => ({\\n    x: d[0],\\n    max: d[1] + 4 + 4 * getRandomNumber(),\\n    min: d[1] - 4 - 4 * getRandomNumber(),\\n  }));\\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [d[0], d[1]]);\\n  const fit = boolean('fit Y domain', true);\\n  const y0AccessorFormat = text('y0AccessorFormat', '');\\n  const y1AccessorFormat = text('y1AccessorFormat', '');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['max']}\\n        y0Accessors={['min']}\\n        y1AccessorFormat={y1AccessorFormat || undefined}\\n        y0AccessorFormat={y0AccessorFormat || undefined}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n\\n      <LineSeries\\n        id=\\\"average\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={lineData}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n    [5, 5],\\n    [6, 3],\\n    [7, 8],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 1],\\n    [7, 5],\\n    [8, 6],\\n    [9, 7],\\n  ];\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"stacked area 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <AreaSeries\\n        id=\\\"stacked area 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"non stacked area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":89},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":89}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 2],\n    [2, 2],\n    [3, 3],\n    [4, 5],\n    [5, 5],\n    [6, 3],\n    [7, 8],\n    [8, 2],\n    [9, 1],\n  ];\n  const data2 = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 4],\n  ];\n  const data3 = [\n    [1, 6],\n    [2, 6],\n    [3, 3],\n    [4, 2],\n    [5, 1],\n    [6, 1],\n    [7, 5],\n    [8, 6],\n    [9, 7],\n  ];\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id=\"stacked area 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data1}\n      />\n      <AreaSeries\n        id=\"stacked area 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data2}\n      />\n      <AreaSeries\n        id=\"non stacked area\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n    [5, 5],\\n    [6, 3],\\n    [7, 8],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 1],\\n    [7, 5],\\n    [8, 6],\\n    [9, 7],\\n  ];\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"stacked area 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <AreaSeries\\n        id=\\\"stacked area 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"non stacked area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, CurveType, AreaSeries, Position, Axis, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n    <Axis id=\\\"left\\\" position={Position.Left} />\\n    <AreaSeries\\n      id=\\\"path-order\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"col-0-3\\\"\\n      yAccessors={['col-2-5']}\\n      data={data}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n      splitSeriesAccessors={['col-1-6']}\\n      stackAccessors={['col-1-6']}\\n      areaSeriesStyle={{\\n        point: { visible: true },\\n      }}\\n    />\\n  </Chart>\\n);\\n\\nconst data = [\\n  {\\n    'col-0-3': 'ZRH',\\n    'col-1-6': 'Logstash Airways',\\n    'col-2-5': 27,\\n  },\\n  {\\n    'col-0-3': 'ZRH',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 38,\\n  },\\n  {\\n    'col-0-3': 'ZRH',\\n    'col-1-6': 'JetBeats',\\n    'col-2-5': 26,\\n  },\\n  {\\n    'col-0-3': 'ZRH',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 33,\\n  },\\n  {\\n    'col-0-3': 'YYZ',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 5,\\n  },\\n  {\\n    'col-0-3': 'YYZ',\\n    'col-1-6': 'JetBeats',\\n    'col-2-5': 7,\\n  },\\n  {\\n    'col-0-3': 'YYZ',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 4,\\n  },\\n  {\\n    'col-0-3': 'YWG',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 10,\\n  },\\n  {\\n    'col-0-3': 'YWG',\\n    'col-1-6': 'Logstash Airways',\\n    'col-2-5': 17,\\n  },\\n  {\\n    'col-0-3': 'YWG',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 19,\\n  },\\n  {\\n    'col-0-3': 'YUL',\\n    'col-1-6': 'Logstash Airways',\\n    'col-2-5': 4,\\n  },\\n  {\\n    'col-0-3': 'YUL',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 7,\\n  },\\n  {\\n    'col-0-3': 'YUL',\\n    'col-1-6': 'JetBeats',\\n    'col-2-5': 4,\\n  },\\n  {\\n    'col-0-3': 'YUL',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 13,\\n  },\\n  {\\n    'col-0-3': 'YOW',\\n    'col-1-6': 'Logstash Airways',\\n    'col-2-5': 11,\\n  },\\n  {\\n    'col-0-3': 'YOW',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 6,\\n  },\\n  {\\n    'col-0-3': 'YOW',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 14,\\n  },\\n];\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":36},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":36}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, CurveType, AreaSeries, Position, Axis, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} />\n    <Axis id=\"left\" position={Position.Left} />\n    <AreaSeries\n      id=\"path-order\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"col-0-3\"\n      yAccessors={['col-2-5']}\n      data={data}\n      curve={CurveType.CURVE_CATMULL_ROM}\n      splitSeriesAccessors={['col-1-6']}\n      stackAccessors={['col-1-6']}\n      areaSeriesStyle={{\n        point: { visible: true },\n      }}\n    />\n  </Chart>\n);\n\nconst data = [\n  {\n    'col-0-3': 'ZRH',\n    'col-1-6': 'Logstash Airways',\n    'col-2-5': 27,\n  },\n  {\n    'col-0-3': 'ZRH',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 38,\n  },\n  {\n    'col-0-3': 'ZRH',\n    'col-1-6': 'JetBeats',\n    'col-2-5': 26,\n  },\n  {\n    'col-0-3': 'ZRH',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 33,\n  },\n  {\n    'col-0-3': 'YYZ',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 5,\n  },\n  {\n    'col-0-3': 'YYZ',\n    'col-1-6': 'JetBeats',\n    'col-2-5': 7,\n  },\n  {\n    'col-0-3': 'YYZ',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 4,\n  },\n  {\n    'col-0-3': 'YWG',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 10,\n  },\n  {\n    'col-0-3': 'YWG',\n    'col-1-6': 'Logstash Airways',\n    'col-2-5': 17,\n  },\n  {\n    'col-0-3': 'YWG',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 19,\n  },\n  {\n    'col-0-3': 'YUL',\n    'col-1-6': 'Logstash Airways',\n    'col-2-5': 4,\n  },\n  {\n    'col-0-3': 'YUL',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 7,\n  },\n  {\n    'col-0-3': 'YUL',\n    'col-1-6': 'JetBeats',\n    'col-2-5': 4,\n  },\n  {\n    'col-0-3': 'YUL',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 13,\n  },\n  {\n    'col-0-3': 'YOW',\n    'col-1-6': 'Logstash Airways',\n    'col-2-5': 11,\n  },\n  {\n    'col-0-3': 'YOW',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 6,\n  },\n  {\n    'col-0-3': 'YOW',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 14,\n  },\n];\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n    <Axis id=\\\"left\\\" position={Position.Left} />\\n    <AreaSeries\\n      id=\\\"path-order\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"col-0-3\\\"\\n      yAccessors={['col-2-5']}\\n      data={data}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n      splitSeriesAccessors={['col-1-6']}\\n      stackAccessors={['col-1-6']}\\n      areaSeriesStyle={{\\n        point: { visible: true },\\n      }}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map(([x, y]) => [x, -y]);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"negative metric\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\\n        }}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map(([x, y]) => [x, -y]);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title=\"negative metric\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          min: NaN,\n          max: NaN,\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\n        }}\n      />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Time}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"negative metric\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\\n        }}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const dataset = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={dataset.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\\n        }}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={dataset.data.map(([x, y], i) => {\\n          return [x, i < dataset.data.length / 2 ? -y : y];\\n        })}\\n      />\\n      <AreaSeries\\n        id=\\\"area2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={dataset.data.map(([x, y], i) => {\\n          return [x, i >= dataset.data.length / 2 ? -y : y];\\n        })}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const dataset = KIBANA_METRICS.metrics.kibana_os_load.v1;\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"timestamp per 1 minute\"\n        position={Position.Bottom}\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis\n        id=\"left\"\n        title={dataset.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          min: NaN,\n          max: NaN,\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\n        }}\n      />\n\n      <AreaSeries\n        id=\"area1\"\n        xScaleType={ScaleType.Time}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={dataset.data.map(([x, y], i) => {\n          return [x, i < dataset.data.length / 2 ? -y : y];\n        })}\n      />\n      <AreaSeries\n        id=\"area2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={dataset.data.map(([x, y], i) => {\n          return [x, i >= dataset.data.length / 2 ? -y : y];\n        })}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const dataset = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={dataset.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\\n        }}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={dataset.data.map(([x, y], i) => {\\n          return [x, i < dataset.data.length / 2 ? -y : y];\\n        })}\\n      />\\n      <AreaSeries\\n        id=\\\"area2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={dataset.data.map(([x, y], i) => {\\n          return [x, i >= dataset.data.length / 2 ? -y : y];\\n        })}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Fit, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  const data = [\\n    [0, -5, -2],\\n    [1, -6, -2.1],\\n    [2, -8, -0.9],\\n    [3, -3, -1.2],\\n    [4, -2.3, -1.6],\\n    [5, -4, -3.4],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{ areaSeriesStyle: { point: { visible: true } }, lineSeriesStyle: { point: { visible: false } } }}\\n        baseTheme={useBaseTheme()}\\n        xDomain={{\\n          min: NaN,\\n          max: NaN,\\n          minInterval: 1,\\n        }}\\n      />\\n      <Axis id=\\\"bottom\\\" title=\\\"timestamp\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"metric\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"band\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        y0Accessors={[2]}\\n        data={data}\\n      />\\n\\n      <LineSeries\\n        id=\\\"metric\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={Fit.Carry}\\n        data={data.map(([x, y1, y0]) => {\\n          return [x, (y1 + y0) / 2];\\n        })}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":67},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":67}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Fit, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\n\n  const data = [\n    [0, -5, -2],\n    [1, -6, -2.1],\n    [2, -8, -0.9],\n    [3, -3, -1.2],\n    [4, -2.3, -1.6],\n    [5, -4, -3.4],\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{ areaSeriesStyle: { point: { visible: true } }, lineSeriesStyle: { point: { visible: false } } }}\n        baseTheme={useBaseTheme()}\n        xDomain={{\n          min: NaN,\n          max: NaN,\n          minInterval: 1,\n        }}\n      />\n      <Axis id=\"bottom\" title=\"timestamp\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left\" title=\"metric\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <AreaSeries\n        id=\"band\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        y0Accessors={[2]}\n        data={data}\n      />\n\n      <LineSeries\n        id=\"metric\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        fit={Fit.Carry}\n        data={data.map(([x, y1, y0]) => {\n          return [x, (y1 + y0) / 2];\n        })}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  const data = [\\n    [0, -5, -2],\\n    [1, -6, -2.1],\\n    [2, -8, -0.9],\\n    [3, -3, -1.2],\\n    [4, -2.3, -1.6],\\n    [5, -4, -3.4],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{ areaSeriesStyle: { point: { visible: true } }, lineSeriesStyle: { point: { visible: false } } }}\\n        baseTheme={useBaseTheme()}\\n        xDomain={{\\n          min: NaN,\\n          max: NaN,\\n          minInterval: 1,\\n        }}\\n      />\\n      <Axis id=\\\"bottom\\\" title=\\\"timestamp\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"metric\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"band\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        y0Accessors={[2]}\\n        data={data}\\n      />\\n\\n      <LineSeries\\n        id=\\\"metric\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={Fit.Carry}\\n        data={data.map(([x, y1, y0]) => {\\n          return [x, (y1 + y0) / 2];\\n        })}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":32},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":32}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst data = [\\n  {\\n    key: 0,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 107.2871113576205,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 133,\\n    doc_count: 169,\\n  },\\n  {\\n    key: 164.87534966839775,\\n    doc_count: 1984,\\n  },\\n  {\\n    key: 204.39008216749184,\\n    doc_count: 1376,\\n  },\\n  {\\n    key: 253.37508470765238,\\n    doc_count: 692,\\n  },\\n  {\\n    key: 314.100042770181,\\n    doc_count: 287,\\n  },\\n  {\\n    key: 389.378604380393,\\n    doc_count: 222,\\n  },\\n  {\\n    key: 482.69874850082726,\\n    doc_count: 564,\\n  },\\n  {\\n    key: 598.3843980719687,\\n    doc_count: 4045,\\n  },\\n  {\\n    key: 741.7957659265381,\\n    doc_count: 8143,\\n  },\\n  {\\n    key: 919.5777164637204,\\n    doc_count: 15190,\\n  },\\n  {\\n    key: 1139.967650746035,\\n    doc_count: 23055,\\n  },\\n  {\\n    key: 1413.1771806572506,\\n    doc_count: 15015,\\n  },\\n  {\\n    key: 1751.8652767237954,\\n    doc_count: 14600,\\n  },\\n  {\\n    key: 2171.7248125696256,\\n    doc_count: 17494,\\n  },\\n  {\\n    key: 2692.2096831274607,\\n    doc_count: 13394,\\n  },\\n  {\\n    key: 3337.4361871149363,\\n    doc_count: 13903,\\n  },\\n  {\\n    key: 4137.300438695783,\\n    doc_count: 21022,\\n  },\\n  {\\n    key: 5128.863582805883,\\n    doc_count: 30053,\\n  },\\n  {\\n    key: 6358.068997117526,\\n    doc_count: 37550,\\n  },\\n  {\\n    key: 7881.871045981584,\\n    doc_count: 40121,\\n  },\\n  {\\n    key: 9770.874020657398,\\n    doc_count: 41401,\\n  },\\n  {\\n    key: 12112.60353926129,\\n    doc_count: 37269,\\n  },\\n  {\\n    key: 15015.56198443892,\\n    doc_count: 27225,\\n  },\\n  {\\n    key: 18614.255884600516,\\n    doc_count: 19608,\\n  },\\n  {\\n    key: 23075.428178876242,\\n    doc_count: 13488,\\n  },\\n  {\\n    key: 28605.7841333851,\\n    doc_count: 10287,\\n  },\\n  {\\n    key: 35461.56888368852,\\n    doc_count: 7402,\\n  },\\n  {\\n    key: 43960.44037209106,\\n    doc_count: 4775,\\n  },\\n  {\\n    key: 54496.18780394934,\\n    doc_count: 3816,\\n  },\\n  {\\n    key: 67556.97759226183,\\n    doc_count: 2524,\\n  },\\n  {\\n    key: 83747.97220349085,\\n    doc_count: 2613,\\n  },\\n  {\\n    key: 103819.3699328557,\\n    doc_count: 1984,\\n  },\\n  {\\n    key: 128701.16481227305,\\n    doc_count: 2151,\\n  },\\n  {\\n    key: 159546.2372267188,\\n    doc_count: 3005,\\n  },\\n  {\\n    key: 197783.77181227363,\\n    doc_count: 2492,\\n  },\\n  {\\n    key: 245185.47771641501,\\n    doc_count: 1576,\\n  },\\n  {\\n    key: 303947.67948952696,\\n    doc_count: 718,\\n  },\\n  {\\n    key: 376793.0822310816,\\n    doc_count: 453,\\n  },\\n  {\\n    key: 467096.9262066379,\\n    doc_count: 225,\\n  },\\n  {\\n    key: 579043.3762207008,\\n    doc_count: 107,\\n  },\\n  {\\n    key: 717819.3919365238,\\n    doc_count: 63,\\n  },\\n  {\\n    key: 889855.0619871503,\\n    doc_count: 20,\\n  },\\n  {\\n    key: 1103121.537588911,\\n    doc_count: 23,\\n  },\\n  {\\n    key: 1367500.3702008445,\\n    doc_count: 20,\\n  },\\n  {\\n    key: 1695241.366229529,\\n    doc_count: 21,\\n  },\\n  {\\n    key: 2101530.173153578,\\n    doc_count: 10,\\n  },\\n  {\\n    key: 2605191.89576981,\\n    doc_count: 8,\\n  },\\n  {\\n    key: 3229563.3441227335,\\n    doc_count: 33,\\n  },\\n  {\\n    key: 4003574.3281088388,\\n    doc_count: 979,\\n  },\\n  {\\n    key: 4963088.099777182,\\n    doc_count: 2199,\\n  },\\n  {\\n    key: 6152563.051773136,\\n    doc_count: 965,\\n  },\\n  {\\n    key: 7627112.665548564,\\n    doc_count: 72,\\n  },\\n  {\\n    key: 9455059.155583354,\\n    doc_count: 51,\\n  },\\n  {\\n    key: 11721099.130918715,\\n    doc_count: 64,\\n  },\\n  {\\n    key: 14530227.95269304,\\n    doc_count: 12,\\n  },\\n  {\\n    key: 18012604.620013494,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 22329582.59521292,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 27681186.00251957,\\n    doc_count: 3,\\n  },\\n  {\\n    key: 34315377.60452156,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 42539547.981568344,\\n    doc_count: 13,\\n  },\\n  {\\n    key: 52734758.257117845,\\n    doc_count: 13,\\n  },\\n  {\\n    key: 65373396.295644514,\\n    doc_count: 24,\\n  },\\n  {\\n    key: 81041064.46056497,\\n    doc_count: 28,\\n  },\\n  {\\n    key: 100463713.0859759,\\n    doc_count: 51,\\n  },\\n  {\\n    key: 124541276.87245026,\\n    doc_count: 93,\\n  },\\n  {\\n    key: 154389372.72551844,\\n    doc_count: 183,\\n  },\\n  {\\n    key: 191390991.07672492,\\n    doc_count: 208,\\n  },\\n  {\\n    key: 237260575.76809216,\\n    doc_count: 91,\\n  },\\n  {\\n    key: 294123461.59616184,\\n    doc_count: 6,\\n  },\\n  {\\n    key: 364614350.19809616,\\n    doc_count: 5,\\n  },\\n  {\\n    key: 451999387.09042615,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 560327496.2138001,\\n    doc_count: 0.0001,\\n  },\\n  {\\n    key: 694617983.9629189,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 861093105.2018316,\\n    doc_count: 1,\\n  },\\n  {\\n    key: 1067466367.046606,\\n    doc_count: 0.0001,\\n  },\\n  {\\n    key: 1323299928.7673922,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 1640447657.681875,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 2033604369.721831,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 2520986703.3463764,\\n    doc_count: 1,\\n  },\\n  {\\n    key: 3125177174.6136513,\\n    doc_count: 3,\\n  },\\n  {\\n    key: 3874170522.10617,\\n    doc_count: 1,\\n  },\\n  {\\n    key: 4802670823.362817,\\n    doc_count: 4,\\n  },\\n  {\\n    key: 5953699483.790642,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 7380588603.086767,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 9149452080.394913,\\n    doc_count: 10,\\n  },\\n  {\\n    key: 11342248955.107962,\\n    doc_count: 5,\\n  },\\n  {\\n    key: 14060580921.04847,\\n    doc_count: 3,\\n  },\\n  {\\n    key: 17430399969.162903,\\n    doc_count: 6,\\n  },\\n  {\\n    key: 21607844284.02827,\\n    doc_count: 7,\\n  },\\n  {\\n    key: 26786472796.311687,\\n    doc_count: 9,\\n  },\\n  {\\n    key: 33206233599.059467,\\n    doc_count: 11,\\n  },\\n  {\\n    key: 41164581773.04837,\\n    doc_count: 10,\\n  },\\n  {\\n    key: 51030261757.77967,\\n    doc_count: 13,\\n  },\\n  {\\n    key: 63260392864.53983,\\n    doc_count: 6,\\n  },\\n  {\\n    key: 78421649576.7008,\\n    doc_count: 8,\\n  },\\n  {\\n    key: 97216518011.51195,\\n    doc_count: 4,\\n  },\\n  {\\n    key: 120515845117.98601,\\n    doc_count: 0.0001,\\n  },\\n  {\\n    key: 149399188754.96533,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 185204838241.72855,\\n    doc_count: 0,\\n  },\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"X\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis id=\\\"Y\\\" position={Position.Left} />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Log}\\n        yScaleType={ScaleType.Log}\\n        xAccessor=\\\"key\\\"\\n        yAccessors={['doc_count']}\\n        data={data.map((d) => ({ ...d, doc_count: d.doc_count < 1 ? null : d.doc_count }))}\\n        curve={CurveType.CURVE_STEP_AFTER}\\n        tickFormat={(d) => d.toFixed(1)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":423},\"endLoc\":{\"col\":1,\"line\":442},\"startBody\":{\"col\":36,\"line\":423},\"endBody\":{\"col\":1,\"line\":442}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst data = [\n  {\n    key: 0,\n    doc_count: 0,\n  },\n  {\n    key: 107.2871113576205,\n    doc_count: 0,\n  },\n  {\n    key: 133,\n    doc_count: 169,\n  },\n  {\n    key: 164.87534966839775,\n    doc_count: 1984,\n  },\n  {\n    key: 204.39008216749184,\n    doc_count: 1376,\n  },\n  {\n    key: 253.37508470765238,\n    doc_count: 692,\n  },\n  {\n    key: 314.100042770181,\n    doc_count: 287,\n  },\n  {\n    key: 389.378604380393,\n    doc_count: 222,\n  },\n  {\n    key: 482.69874850082726,\n    doc_count: 564,\n  },\n  {\n    key: 598.3843980719687,\n    doc_count: 4045,\n  },\n  {\n    key: 741.7957659265381,\n    doc_count: 8143,\n  },\n  {\n    key: 919.5777164637204,\n    doc_count: 15190,\n  },\n  {\n    key: 1139.967650746035,\n    doc_count: 23055,\n  },\n  {\n    key: 1413.1771806572506,\n    doc_count: 15015,\n  },\n  {\n    key: 1751.8652767237954,\n    doc_count: 14600,\n  },\n  {\n    key: 2171.7248125696256,\n    doc_count: 17494,\n  },\n  {\n    key: 2692.2096831274607,\n    doc_count: 13394,\n  },\n  {\n    key: 3337.4361871149363,\n    doc_count: 13903,\n  },\n  {\n    key: 4137.300438695783,\n    doc_count: 21022,\n  },\n  {\n    key: 5128.863582805883,\n    doc_count: 30053,\n  },\n  {\n    key: 6358.068997117526,\n    doc_count: 37550,\n  },\n  {\n    key: 7881.871045981584,\n    doc_count: 40121,\n  },\n  {\n    key: 9770.874020657398,\n    doc_count: 41401,\n  },\n  {\n    key: 12112.60353926129,\n    doc_count: 37269,\n  },\n  {\n    key: 15015.56198443892,\n    doc_count: 27225,\n  },\n  {\n    key: 18614.255884600516,\n    doc_count: 19608,\n  },\n  {\n    key: 23075.428178876242,\n    doc_count: 13488,\n  },\n  {\n    key: 28605.7841333851,\n    doc_count: 10287,\n  },\n  {\n    key: 35461.56888368852,\n    doc_count: 7402,\n  },\n  {\n    key: 43960.44037209106,\n    doc_count: 4775,\n  },\n  {\n    key: 54496.18780394934,\n    doc_count: 3816,\n  },\n  {\n    key: 67556.97759226183,\n    doc_count: 2524,\n  },\n  {\n    key: 83747.97220349085,\n    doc_count: 2613,\n  },\n  {\n    key: 103819.3699328557,\n    doc_count: 1984,\n  },\n  {\n    key: 128701.16481227305,\n    doc_count: 2151,\n  },\n  {\n    key: 159546.2372267188,\n    doc_count: 3005,\n  },\n  {\n    key: 197783.77181227363,\n    doc_count: 2492,\n  },\n  {\n    key: 245185.47771641501,\n    doc_count: 1576,\n  },\n  {\n    key: 303947.67948952696,\n    doc_count: 718,\n  },\n  {\n    key: 376793.0822310816,\n    doc_count: 453,\n  },\n  {\n    key: 467096.9262066379,\n    doc_count: 225,\n  },\n  {\n    key: 579043.3762207008,\n    doc_count: 107,\n  },\n  {\n    key: 717819.3919365238,\n    doc_count: 63,\n  },\n  {\n    key: 889855.0619871503,\n    doc_count: 20,\n  },\n  {\n    key: 1103121.537588911,\n    doc_count: 23,\n  },\n  {\n    key: 1367500.3702008445,\n    doc_count: 20,\n  },\n  {\n    key: 1695241.366229529,\n    doc_count: 21,\n  },\n  {\n    key: 2101530.173153578,\n    doc_count: 10,\n  },\n  {\n    key: 2605191.89576981,\n    doc_count: 8,\n  },\n  {\n    key: 3229563.3441227335,\n    doc_count: 33,\n  },\n  {\n    key: 4003574.3281088388,\n    doc_count: 979,\n  },\n  {\n    key: 4963088.099777182,\n    doc_count: 2199,\n  },\n  {\n    key: 6152563.051773136,\n    doc_count: 965,\n  },\n  {\n    key: 7627112.665548564,\n    doc_count: 72,\n  },\n  {\n    key: 9455059.155583354,\n    doc_count: 51,\n  },\n  {\n    key: 11721099.130918715,\n    doc_count: 64,\n  },\n  {\n    key: 14530227.95269304,\n    doc_count: 12,\n  },\n  {\n    key: 18012604.620013494,\n    doc_count: 2,\n  },\n  {\n    key: 22329582.59521292,\n    doc_count: 2,\n  },\n  {\n    key: 27681186.00251957,\n    doc_count: 3,\n  },\n  {\n    key: 34315377.60452156,\n    doc_count: 2,\n  },\n  {\n    key: 42539547.981568344,\n    doc_count: 13,\n  },\n  {\n    key: 52734758.257117845,\n    doc_count: 13,\n  },\n  {\n    key: 65373396.295644514,\n    doc_count: 24,\n  },\n  {\n    key: 81041064.46056497,\n    doc_count: 28,\n  },\n  {\n    key: 100463713.0859759,\n    doc_count: 51,\n  },\n  {\n    key: 124541276.87245026,\n    doc_count: 93,\n  },\n  {\n    key: 154389372.72551844,\n    doc_count: 183,\n  },\n  {\n    key: 191390991.07672492,\n    doc_count: 208,\n  },\n  {\n    key: 237260575.76809216,\n    doc_count: 91,\n  },\n  {\n    key: 294123461.59616184,\n    doc_count: 6,\n  },\n  {\n    key: 364614350.19809616,\n    doc_count: 5,\n  },\n  {\n    key: 451999387.09042615,\n    doc_count: 2,\n  },\n  {\n    key: 560327496.2138001,\n    doc_count: 0.0001,\n  },\n  {\n    key: 694617983.9629189,\n    doc_count: 0,\n  },\n  {\n    key: 861093105.2018316,\n    doc_count: 1,\n  },\n  {\n    key: 1067466367.046606,\n    doc_count: 0.0001,\n  },\n  {\n    key: 1323299928.7673922,\n    doc_count: 0,\n  },\n  {\n    key: 1640447657.681875,\n    doc_count: 0,\n  },\n  {\n    key: 2033604369.721831,\n    doc_count: 0,\n  },\n  {\n    key: 2520986703.3463764,\n    doc_count: 1,\n  },\n  {\n    key: 3125177174.6136513,\n    doc_count: 3,\n  },\n  {\n    key: 3874170522.10617,\n    doc_count: 1,\n  },\n  {\n    key: 4802670823.362817,\n    doc_count: 4,\n  },\n  {\n    key: 5953699483.790642,\n    doc_count: 2,\n  },\n  {\n    key: 7380588603.086767,\n    doc_count: 2,\n  },\n  {\n    key: 9149452080.394913,\n    doc_count: 10,\n  },\n  {\n    key: 11342248955.107962,\n    doc_count: 5,\n  },\n  {\n    key: 14060580921.04847,\n    doc_count: 3,\n  },\n  {\n    key: 17430399969.162903,\n    doc_count: 6,\n  },\n  {\n    key: 21607844284.02827,\n    doc_count: 7,\n  },\n  {\n    key: 26786472796.311687,\n    doc_count: 9,\n  },\n  {\n    key: 33206233599.059467,\n    doc_count: 11,\n  },\n  {\n    key: 41164581773.04837,\n    doc_count: 10,\n  },\n  {\n    key: 51030261757.77967,\n    doc_count: 13,\n  },\n  {\n    key: 63260392864.53983,\n    doc_count: 6,\n  },\n  {\n    key: 78421649576.7008,\n    doc_count: 8,\n  },\n  {\n    key: 97216518011.51195,\n    doc_count: 4,\n  },\n  {\n    key: 120515845117.98601,\n    doc_count: 0.0001,\n  },\n  {\n    key: 149399188754.96533,\n    doc_count: 0,\n  },\n  {\n    key: 185204838241.72855,\n    doc_count: 0,\n  },\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"X\" title=\"index\" position={Position.Bottom} />\n      <Axis id=\"Y\" position={Position.Left} />\n\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Log}\n        yScaleType={ScaleType.Log}\n        xAccessor=\"key\"\n        yAccessors={['doc_count']}\n        data={data.map((d) => ({ ...d, doc_count: d.doc_count < 1 ? null : d.doc_count }))}\n        curve={CurveType.CURVE_STEP_AFTER}\n        tickFormat={(d) => d.toFixed(1)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"X\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis id=\\\"Y\\\" position={Position.Left} />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Log}\\n        yScaleType={ScaleType.Log}\\n        xAccessor=\\\"key\\\"\\n        yAccessors={['doc_count']}\\n        data={data.map((d) => ({ ...d, doc_count: d.doc_count < 1 ? null : d.doc_count }))}\\n        curve={CurveType.CURVE_STEP_AFTER}\\n        tickFormat={(d) => d.toFixed(1)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, AxisProps, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { SB_SOURCE_PANEL } from '../utils/storybook';\\n\\nconst fontFamily = '\\\"Atkinson Hyperlegible\\\"';\\nconst tickLabelStyle = { fontSize: 11, fontFamily };\\nconst axisTitleColor = 'rgb(112,112,112)';\\nconst axisTitleFontSize = 15;\\nconst dataInk = 'rgba(96, 146, 192, 1)';\\nconst horizontalGridLineStyle: AxisProps['gridLine'] = {\\n  visible: true,\\n  stroke: 'black',\\n  strokeWidth: 0.15,\\n  opacity: 1,\\n};\\n\\nconst tooltipDateFormatter = (d: any) =>\\n  new Intl.DateTimeFormat('en-US', {\\n    year: 'numeric',\\n    month: 'long',\\n    day: 'numeric',\\n    hour: 'numeric',\\n    minute: 'numeric',\\n  }).format(d);\\n\\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\nconst t0 = data[0][0];\\nconst t1 = data[data.length - 1][0];\\n\\nconst topAxisLabelFormat = (d: any) =>\\n  `${new Intl.DateTimeFormat('en-US', { minute: 'numeric' }).format(d).padStart(2, '0')}′  `;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showLegend = boolean('Show legend', false);\\n  const minorGridLines = boolean('Minor grid lines', true);\\n  const horizontalAxisTitle = boolean('Horizontal axis title', false);\\n  const yAxisTitle = 'CPU utilization';\\n  const timeZoom = number('Time zoom', data.length, {\\n    range: true,\\n    min: 0,\\n    max: data.length,\\n    step: 1,\\n  });\\n  const timeStretch = number('Stretch time', -0.4, {\\n    range: true,\\n    min: -20,\\n    max: 18,\\n    step: 0.2,\\n  });\\n  const timeShift = number('Shift time', 0, {\\n    range: true,\\n    min: -10,\\n    max: 10,\\n    step: 0.05,\\n  });\\n  const binWidth = number('Bin width in ms (0: none specifed)', 0, {\\n    range: false,\\n    min: 0,\\n    max: 10 * 365 * 24 * 60 * 60 * 1000,\\n    step: 1,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend={showLegend}\\n        baseTheme={useBaseTheme()}\\n        theme={{ axes: { tickLine: { visible: true } } }}\\n        xDomain={\\n          binWidth > 0\\n            ? {\\n                min: NaN,\\n                max: NaN,\\n                minInterval: binWidth,\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"x_minor\\\"\\n        position={boolean('Top X axis', false) ? Position.Top : Position.Bottom}\\n        showOverlappingTicks={boolean('showOverlappingTicks time axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels time axis', false)}\\n        gridLine={{\\n          visible: minorGridLines,\\n        }}\\n        style={{\\n          axisLine: { stroke: dataInk },\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            ...tickLabelStyle,\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n\\n          axisTitle: { fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\\n        }}\\n        tickFormat={tooltipDateFormatter}\\n        labelFormat={topAxisLabelFormat}\\n        title=\\\"time (1-minute measurements)\\\"\\n        timeAxisLayerCount={number('layerCount', 3, { range: true, min: 0, max: 3, step: 1 })}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={yAxisTitle}\\n        position={Position.Left}\\n        gridLine={horizontalGridLineStyle}\\n        ticks={4}\\n        style={{\\n          tickLine: { ...horizontalGridLineStyle, size: 8, padding: 4 },\\n          axisLine: { visible: false },\\n          tickLabel: tickLabelStyle,\\n          axisTitle: { visible: !horizontalAxisTitle, fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\\n        }}\\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n      />\\n      <AreaSeries\\n        id=\\\"CPU Utilization\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        yNice\\n        color={dataInk}\\n        areaSeriesStyle={{ area: { opacity: 0.3 }, line: { opacity: 1 } }}\\n        data={data\\n          .slice(0, timeZoom)\\n          .map(([t, v]) => [t0 + (t - t0) * 4 * 2 ** timeStretch - (t1 - t0) * 2 ** timeStretch * timeShift, v])}\\n      />\\n    </Chart>\\n  );\\n};\\n\\n// storybook configuration\\nExample.parameters = {\\n  options: { selectedPanel: SB_SOURCE_PANEL },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":47},\"endLoc\":{\"col\":1,\"line\":147},\"startBody\":{\"col\":36,\"line\":47},\"endBody\":{\"col\":1,\"line\":147}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, AxisProps, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { SB_SOURCE_PANEL } from '../utils/storybook';\n\nconst fontFamily = '\"Atkinson Hyperlegible\"';\nconst tickLabelStyle = { fontSize: 11, fontFamily };\nconst axisTitleColor = 'rgb(112,112,112)';\nconst axisTitleFontSize = 15;\nconst dataInk = 'rgba(96, 146, 192, 1)';\nconst horizontalGridLineStyle: AxisProps['gridLine'] = {\n  visible: true,\n  stroke: 'black',\n  strokeWidth: 0.15,\n  opacity: 1,\n};\n\nconst tooltipDateFormatter = (d: any) =>\n  new Intl.DateTimeFormat('en-US', {\n    year: 'numeric',\n    month: 'long',\n    day: 'numeric',\n    hour: 'numeric',\n    minute: 'numeric',\n  }).format(d);\n\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\nconst t0 = data[0][0];\nconst t1 = data[data.length - 1][0];\n\nconst topAxisLabelFormat = (d: any) =>\n  `${new Intl.DateTimeFormat('en-US', { minute: 'numeric' }).format(d).padStart(2, '0')}′  `;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showLegend = boolean('Show legend', false);\n  const minorGridLines = boolean('Minor grid lines', true);\n  const horizontalAxisTitle = boolean('Horizontal axis title', false);\n  const yAxisTitle = 'CPU utilization';\n  const timeZoom = number('Time zoom', data.length, {\n    range: true,\n    min: 0,\n    max: data.length,\n    step: 1,\n  });\n  const timeStretch = number('Stretch time', -0.4, {\n    range: true,\n    min: -20,\n    max: 18,\n    step: 0.2,\n  });\n  const timeShift = number('Shift time', 0, {\n    range: true,\n    min: -10,\n    max: 10,\n    step: 0.05,\n  });\n  const binWidth = number('Bin width in ms (0: none specifed)', 0, {\n    range: false,\n    min: 0,\n    max: 10 * 365 * 24 * 60 * 60 * 1000,\n    step: 1,\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend={showLegend}\n        baseTheme={useBaseTheme()}\n        theme={{ axes: { tickLine: { visible: true } } }}\n        xDomain={\n          binWidth > 0\n            ? {\n                min: NaN,\n                max: NaN,\n                minInterval: binWidth,\n              }\n            : undefined\n        }\n      />\n      <Axis\n        id=\"x_minor\"\n        position={boolean('Top X axis', false) ? Position.Top : Position.Bottom}\n        showOverlappingTicks={boolean('showOverlappingTicks time axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels time axis', false)}\n        gridLine={{\n          visible: minorGridLines,\n        }}\n        style={{\n          axisLine: { stroke: dataInk },\n          tickLine: { size: 0.0001, padding: 4 },\n          tickLabel: {\n            ...tickLabelStyle,\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n            padding: 0,\n            offset: { x: 0, y: 0 },\n          },\n\n          axisTitle: { fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\n        }}\n        tickFormat={tooltipDateFormatter}\n        labelFormat={topAxisLabelFormat}\n        title=\"time (1-minute measurements)\"\n        timeAxisLayerCount={number('layerCount', 3, { range: true, min: 0, max: 3, step: 1 })}\n      />\n      <Axis\n        id=\"left\"\n        title={yAxisTitle}\n        position={Position.Left}\n        gridLine={horizontalGridLineStyle}\n        ticks={4}\n        style={{\n          tickLine: { ...horizontalGridLineStyle, size: 8, padding: 4 },\n          axisLine: { visible: false },\n          tickLabel: tickLabelStyle,\n          axisTitle: { visible: !horizontalAxisTitle, fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\n        }}\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n      />\n      <AreaSeries\n        id=\"CPU Utilization\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        yNice\n        color={dataInk}\n        areaSeriesStyle={{ area: { opacity: 0.3 }, line: { opacity: 1 } }}\n        data={data\n          .slice(0, timeZoom)\n          .map(([t, v]) => [t0 + (t - t0) * 4 * 2 ** timeStretch - (t1 - t0) * 2 ** timeStretch * timeShift, v])}\n      />\n    </Chart>\n  );\n};\n\n// storybook configuration\nExample.parameters = {\n  options: { selectedPanel: SB_SOURCE_PANEL },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showLegend = boolean('Show legend', false);\\n  const minorGridLines = boolean('Minor grid lines', true);\\n  const horizontalAxisTitle = boolean('Horizontal axis title', false);\\n  const yAxisTitle = 'CPU utilization';\\n  const timeZoom = number('Time zoom', data.length, {\\n    range: true,\\n    min: 0,\\n    max: data.length,\\n    step: 1,\\n  });\\n  const timeStretch = number('Stretch time', -0.4, {\\n    range: true,\\n    min: -20,\\n    max: 18,\\n    step: 0.2,\\n  });\\n  const timeShift = number('Shift time', 0, {\\n    range: true,\\n    min: -10,\\n    max: 10,\\n    step: 0.05,\\n  });\\n  const binWidth = number('Bin width in ms (0: none specifed)', 0, {\\n    range: false,\\n    min: 0,\\n    max: 10 * 365 * 24 * 60 * 60 * 1000,\\n    step: 1,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend={showLegend}\\n        baseTheme={useBaseTheme()}\\n        theme={{ axes: { tickLine: { visible: true } } }}\\n        xDomain={\\n          binWidth > 0\\n            ? {\\n                min: NaN,\\n                max: NaN,\\n                minInterval: binWidth,\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"x_minor\\\"\\n        position={boolean('Top X axis', false) ? Position.Top : Position.Bottom}\\n        showOverlappingTicks={boolean('showOverlappingTicks time axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels time axis', false)}\\n        gridLine={{\\n          visible: minorGridLines,\\n        }}\\n        style={{\\n          axisLine: { stroke: dataInk },\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            ...tickLabelStyle,\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n\\n          axisTitle: { fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\\n        }}\\n        tickFormat={tooltipDateFormatter}\\n        labelFormat={topAxisLabelFormat}\\n        title=\\\"time (1-minute measurements)\\\"\\n        timeAxisLayerCount={number('layerCount', 3, { range: true, min: 0, max: 3, step: 1 })}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={yAxisTitle}\\n        position={Position.Left}\\n        gridLine={horizontalGridLineStyle}\\n        ticks={4}\\n        style={{\\n          tickLine: { ...horizontalGridLineStyle, size: 8, padding: 4 },\\n          axisLine: { visible: false },\\n          tickLabel: tickLabelStyle,\\n          axisTitle: { visible: !horizontalAxisTitle, fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\\n        }}\\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n      />\\n      <AreaSeries\\n        id=\\\"CPU Utilization\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        yNice\\n        color={dataInk}\\n        areaSeriesStyle={{ area: { opacity: 0.3 }, line: { opacity: 1 } }}\\n        data={data\\n          .slice(0, timeZoom)\\n          .map(([t, v]) => [t0 + (t - t0) * 4 * 2 ** timeStretch - (t1 - t0) * 2 ** timeStretch * timeShift, v])}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Placement,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { isDefined } from '@elastic/charts/src/utils/common';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\\n    <Tooltip\\n      stickTo={customKnobs.enum.stickTo('stickTo')}\\n      placement={customKnobs.enum.placement('placement', undefined)}\\n      fallbackPlacements={[customKnobs.enum.placement('fallback placement', Placement.LeftStart)].filter(isDefined)}\\n      offset={number('placement offset', 5)}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"area1\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":63},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":63}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Placement,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  Tooltip,\n} from '@elastic/charts';\nimport { isDefined } from '@elastic/charts/src/utils/common';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\n    <Tooltip\n      stickTo={customKnobs.enum.stickTo('stickTo')}\n      placement={customKnobs.enum.placement('placement', undefined)}\n      fallbackPlacements={[customKnobs.enum.placement('fallback placement', Placement.LeftStart)].filter(isDefined)}\n      offset={number('placement offset', 5)}\n    />\n    <Axis\n      id=\"bottom\"\n      title=\"timestamp per 1 minute\"\n      position={Position.Bottom}\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n    <AreaSeries\n      id=\"area1\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\\n    <Tooltip\\n      stickTo={customKnobs.enum.stickTo('stickTo')}\\n      placement={customKnobs.enum.placement('placement', undefined)}\\n      fallbackPlacements={[customKnobs.enum.placement('fallback placement', Placement.LeftStart)].filter(isDefined)}\\n      offset={number('placement offset', 5)}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"area1\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { clamp } from '@elastic/charts/src/utils/common';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data\\n    .slice(0, 21)\\n    .map((d) => [(d[0] - start) / 30000, clamp(d[1], 0, 30)]);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} ticks={3} tickFormat={(d) => `${d} sec`} />\\n      <Axis\\n        id=\\\"left\\\"\\n        position={Position.Left}\\n        labelFormat={(d) => `${d.toFixed(0)}%`}\\n        tickFormat={(d) => `${d.toFixed(1)}%`}\\n        ticks={5}\\n      />\\n\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        yNice\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\nimport { clamp } from '@elastic/charts/src/utils/common';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data\n    .slice(0, 21)\n    .map((d) => [(d[0] - start) / 30000, clamp(d[1], 0, 30)]);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} ticks={3} tickFormat={(d) => `${d} sec`} />\n      <Axis\n        id=\"left\"\n        position={Position.Left}\n        labelFormat={(d) => `${d.toFixed(0)}%`}\n        tickFormat={(d) => `${d.toFixed(1)}%`}\n        ticks={5}\n      />\n\n      <AreaSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        yNice\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data\\n    .slice(0, 21)\\n    .map((d) => [(d[0] - start) / 30000, clamp(d[1], 0, 30)]);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} ticks={3} tickFormat={(d) => `${d} sec`} />\\n      <Axis\\n        id=\\\"left\\\"\\n        position={Position.Left}\\n        labelFormat={(d) => `${d.toFixed(0)}%`}\\n        tickFormat={(d) => `${d.toFixed(1)}%`}\\n        ticks={5}\\n      />\\n\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        yNice\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => (d[1] < 7 ? [d[0], null] : [d[0], d[1] - 10]));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Log}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":43},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":43}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => (d[1] < 7 ? [d[0], null] : [d[0], d[1] - 10]));\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Log}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => (d[1] < 7 ? [d[0], null] : [d[0], d[1] - 10]));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Log}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debug={false} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <Axis id=\\\"top\\\" position={Position.Top} showOverlappingTicks tickFormat={timeFormatter('HH:mm:ss')} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Right}\\n      tickFormat={(d) => `${Number(d).toFixed(0)} %`}\\n    />\\n\\n    <AreaSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings debug={false} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      title=\"timestamp per 1 minute\"\n      position={Position.Bottom}\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n    <Axis id=\"top\" position={Position.Top} showOverlappingTicks tickFormat={timeFormatter('HH:mm:ss')} />\n    <Axis\n      id=\"right\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Right}\n      tickFormat={(d) => `${Number(d).toFixed(0)} %`}\n    />\n\n    <AreaSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debug={false} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <Axis id=\\\"top\\\" position={Position.Top} showOverlappingTicks tickFormat={timeFormatter('HH:mm:ss')} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Right}\\n      tickFormat={(d) => `${Number(d).toFixed(0)} %`}\\n    />\\n\\n    <AreaSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n\\n    <AreaSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      title=\"timestamp per 1 minute\"\n      position={Position.Bottom}\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n\n    <AreaSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n\\n    <AreaSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\\n  ]);\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\\n  ]);\\n  const data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\\n  ]);\\n  const allMetrics = [...data3, ...data2, ...data1];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"timestamp per 1 minute\\\"\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        splitSeriesAccessors={[2]}\\n        data={allMetrics}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":61},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":61}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\n    ...d,\n    KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\n  ]);\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\n    ...d,\n    KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\n  ]);\n  const data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\n    ...d,\n    KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\n  ]);\n  const allMetrics = [...data3, ...data2, ...data1];\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"timestamp per 1 minute\"\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        splitSeriesAccessors={[2]}\n        data={allMetrics}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\\n  ]);\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\\n  ]);\\n  const data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\\n  ]);\\n  const allMetrics = [...data3, ...data2, ...data1];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"timestamp per 1 minute\\\"\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        splitSeriesAccessors={[2]}\\n        data={allMetrics}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, niceTimeFormatter, Position, ScaleType, Settings, StackMode } from '@elastic/charts';\\nimport DATA from '@elastic/charts/src/utils/data_samples/4_time_series.json';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dataNames = Object.keys(DATA);\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const stackedAsPercentage = boolean('stacked as percentage', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Time\\\"\\n        tickFormat={niceTimeFormatter([1583100000000, 1583622000000])}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => (stackedAsPercentage ? `${Number(d * 100).toFixed(0)} %` : d.toFixed(0))}\\n      />\\n      {Object.values(DATA).map((d, i) => {\\n        return (\\n          <AreaSeries\\n            key={dataNames[i]}\\n            id={dataNames[i]}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"key\\\"\\n            yAccessors={[\\n              (datum) => {\\n                return datum['ffbd09b8-04af-4fcc-ba5f-b0fd50c4862b'].value;\\n              },\\n            ]}\\n            stackMode={stackedAsPercentage ? StackMode.Percentage : undefined}\\n            stackAccessors={['key']}\\n            data={d.buckets}\\n          />\\n        );\\n      })}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, niceTimeFormatter, Position, ScaleType, Settings, StackMode } from '@elastic/charts';\nimport DATA from '@elastic/charts/src/utils/data_samples/4_time_series.json';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dataNames = Object.keys(DATA);\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const stackedAsPercentage = boolean('stacked as percentage', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Time\"\n        tickFormat={niceTimeFormatter([1583100000000, 1583622000000])}\n      />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d) => (stackedAsPercentage ? `${Number(d * 100).toFixed(0)} %` : d.toFixed(0))}\n      />\n      {Object.values(DATA).map((d, i) => {\n        return (\n          <AreaSeries\n            key={dataNames[i]}\n            id={dataNames[i]}\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor=\"key\"\n            yAccessors={[\n              (datum) => {\n                return datum['ffbd09b8-04af-4fcc-ba5f-b0fd50c4862b'].value;\n              },\n            ]}\n            stackMode={stackedAsPercentage ? StackMode.Percentage : undefined}\n            stackAccessors={['key']}\n            data={d.buckets}\n          />\n        );\n      })}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const stackedAsPercentage = boolean('stacked as percentage', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Time\\\"\\n        tickFormat={niceTimeFormatter([1583100000000, 1583622000000])}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => (stackedAsPercentage ? `${Number(d * 100).toFixed(0)} %` : d.toFixed(0))}\\n      />\\n      {Object.values(DATA).map((d, i) => {\\n        return (\\n          <AreaSeries\\n            key={dataNames[i]}\\n            id={dataNames[i]}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"key\\\"\\n            yAccessors={[\\n              (datum) => {\\n                return datum['ffbd09b8-04af-4fcc-ba5f-b0fd50c4862b'].value;\\n              },\\n            ]}\\n            stackMode={stackedAsPercentage ? StackMode.Percentage : undefined}\\n            stackAccessors={['key']}\\n            data={d.buckets}\\n          />\\n        );\\n      })}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, niceTimeFormatter, StackMode } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"Bottom axis\\\"\\n      tickFormat={niceTimeFormatter([1585234800000, 1585836000000])}\\n    />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => `${Number(d * 100).toFixed(0)} %`} />\\n\\n    <AreaSeries\\n      id=\\\"areas1\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[0].data}\\n      stackAccessors={[0]}\\n      stackMode={StackMode.Percentage}\\n    />\\n    <AreaSeries\\n      id=\\\"areas2\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[1].data}\\n      stackAccessors={[0]}\\n      stackMode={StackMode.Percentage}\\n    />\\n    <AreaSeries\\n      id=\\\"areas3\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[2].data}\\n      stackMode={StackMode.Percentage}\\n      stackAccessors={[0]}\\n    />\\n  </Chart>\\n);\\nconst DATA = [\\n  {\\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:200',\\n    label: '200',\\n    color: 'rgb(115, 216, 255)',\\n    data: [\\n      [1585234800000, 10],\\n      [1585249200000, 6],\\n      [1585263600000, 2],\\n      [1585278000000, 5],\\n      [1585292400000, 70],\\n      [1585306800000, 84],\\n      [1585321200000, 32],\\n      [1585335600000, 3],\\n      [1585350000000, 2],\\n      [1585364400000, 18],\\n      [1585378800000, 66],\\n      [1585393200000, 82],\\n      [1585407600000, 32],\\n      [1585422000000, 4],\\n      [1585436400000, 1],\\n      [1585447200000, 9],\\n      [1585461600000, 58],\\n      [1585476000000, 70],\\n      [1585490400000, 58],\\n      [1585504800000, 9],\\n      [1585519200000, 0],\\n      [1585533600000, 10],\\n      [1585548000000, 46],\\n      [1585562400000, 95],\\n      [1585576800000, 43],\\n      [1585591200000, 10],\\n      [1585605600000, 1],\\n      [1585620000000, 8],\\n      [1585634400000, 56],\\n      [1585648800000, 88],\\n      [1585663200000, 50],\\n      [1585677600000, 7],\\n      [1585692000000, 1],\\n      [1585706400000, 9],\\n      [1585720800000, 59],\\n      [1585735200000, 83],\\n      [1585749600000, 46],\\n      [1585764000000, 7],\\n      [1585778400000, null],\\n      [1585792800000, 12],\\n      [1585807200000, 44],\\n      [1585821600000, 84],\\n      [1585836000000, 41],\\n    ],\\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\\n    stack: 'percent',\\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\\n    points: { show: false, radius: 1, lineWidth: 5 },\\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\\n  },\\n  {\\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:404',\\n    label: '404',\\n    color: 'rgb(0, 157, 217)',\\n    data: [\\n      [1585234800000, 0],\\n      [1585249200000, 0],\\n      [1585263600000, 0],\\n      [1585278000000, 1],\\n      [1585292400000, 6],\\n      [1585306800000, 8],\\n      [1585321200000, 3],\\n      [1585335600000, 0],\\n      [1585350000000, 1],\\n      [1585364400000, 1],\\n      [1585378800000, 2],\\n      [1585393200000, 3],\\n      [1585407600000, 1],\\n      [1585422000000, 0],\\n      [1585436400000, 0],\\n      [1585447200000, 1],\\n      [1585461600000, 0],\\n      [1585476000000, 6],\\n      [1585490400000, 3],\\n      [1585504800000, 0],\\n      [1585519200000, 0],\\n      [1585533600000, 1],\\n      [1585548000000, 4],\\n      [1585562400000, 6],\\n      [1585576800000, 1],\\n      [1585591200000, 0],\\n      [1585605600000, 1],\\n      [1585620000000, 0],\\n      [1585634400000, 1],\\n      [1585648800000, 6],\\n      [1585663200000, 4],\\n      [1585677600000, 0],\\n      [1585692000000, 0],\\n      [1585706400000, 0],\\n      [1585720800000, 1],\\n      [1585735200000, 8],\\n      [1585749600000, 2],\\n      [1585764000000, 0],\\n      [1585778400000, null],\\n      [1585792800000, 0],\\n      [1585807200000, 1],\\n      [1585821600000, 6],\\n      [1585836000000, 3],\\n    ],\\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\\n    stack: 'percent',\\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\\n    points: { show: false, radius: 1, lineWidth: 5 },\\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\\n  },\\n  {\\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:503',\\n    label: '503',\\n    color: 'rgb(0, 46, 64)',\\n    data: [\\n      [1585234800000, 0],\\n      [1585249200000, 0],\\n      [1585263600000, 0],\\n      [1585278000000, 1],\\n      [1585292400000, 2],\\n      [1585306800000, 3],\\n      [1585321200000, 3],\\n      [1585335600000, 0],\\n      [1585350000000, 0],\\n      [1585364400000, 0],\\n      [1585378800000, 2],\\n      [1585393200000, 2],\\n      [1585407600000, 2],\\n      [1585422000000, 0],\\n      [1585436400000, 0],\\n      [1585447200000, 0],\\n      [1585461600000, 1],\\n      [1585476000000, 3],\\n      [1585490400000, 2],\\n      [1585504800000, 0],\\n      [1585519200000, 0],\\n      [1585533600000, 0],\\n      [1585548000000, 2],\\n      [1585562400000, 1],\\n      [1585576800000, 3],\\n      [1585591200000, 0],\\n      [1585605600000, 0],\\n      [1585620000000, 0],\\n      [1585634400000, 1],\\n      [1585648800000, 1],\\n      [1585663200000, 1],\\n      [1585677600000, 0],\\n      [1585692000000, 0],\\n      [1585706400000, 0],\\n      [1585720800000, 1],\\n      [1585735200000, 3],\\n      [1585749600000, 1],\\n      [1585764000000, 1],\\n      [1585778400000, null],\\n      [1585792800000, 0],\\n      [1585807200000, 2],\\n      [1585821600000, 1],\\n      [1585836000000, 3],\\n    ],\\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\\n    stack: 'percent',\\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\\n    points: { show: false, radius: 1, lineWidth: 5 },\\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\\n  },\\n];\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":61},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":61}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, niceTimeFormatter, StackMode } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"Bottom axis\"\n      tickFormat={niceTimeFormatter([1585234800000, 1585836000000])}\n    />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => `${Number(d * 100).toFixed(0)} %`} />\n\n    <AreaSeries\n      id=\"areas1\"\n      name=\"area\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={DATA[0].data}\n      stackAccessors={[0]}\n      stackMode={StackMode.Percentage}\n    />\n    <AreaSeries\n      id=\"areas2\"\n      name=\"area\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={DATA[1].data}\n      stackAccessors={[0]}\n      stackMode={StackMode.Percentage}\n    />\n    <AreaSeries\n      id=\"areas3\"\n      name=\"area\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={DATA[2].data}\n      stackMode={StackMode.Percentage}\n      stackAccessors={[0]}\n    />\n  </Chart>\n);\nconst DATA = [\n  {\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:200',\n    label: '200',\n    color: 'rgb(115, 216, 255)',\n    data: [\n      [1585234800000, 10],\n      [1585249200000, 6],\n      [1585263600000, 2],\n      [1585278000000, 5],\n      [1585292400000, 70],\n      [1585306800000, 84],\n      [1585321200000, 32],\n      [1585335600000, 3],\n      [1585350000000, 2],\n      [1585364400000, 18],\n      [1585378800000, 66],\n      [1585393200000, 82],\n      [1585407600000, 32],\n      [1585422000000, 4],\n      [1585436400000, 1],\n      [1585447200000, 9],\n      [1585461600000, 58],\n      [1585476000000, 70],\n      [1585490400000, 58],\n      [1585504800000, 9],\n      [1585519200000, 0],\n      [1585533600000, 10],\n      [1585548000000, 46],\n      [1585562400000, 95],\n      [1585576800000, 43],\n      [1585591200000, 10],\n      [1585605600000, 1],\n      [1585620000000, 8],\n      [1585634400000, 56],\n      [1585648800000, 88],\n      [1585663200000, 50],\n      [1585677600000, 7],\n      [1585692000000, 1],\n      [1585706400000, 9],\n      [1585720800000, 59],\n      [1585735200000, 83],\n      [1585749600000, 46],\n      [1585764000000, 7],\n      [1585778400000, null],\n      [1585792800000, 12],\n      [1585807200000, 44],\n      [1585821600000, 84],\n      [1585836000000, 41],\n    ],\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\n    stack: 'percent',\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\n    points: { show: false, radius: 1, lineWidth: 5 },\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\n  },\n  {\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:404',\n    label: '404',\n    color: 'rgb(0, 157, 217)',\n    data: [\n      [1585234800000, 0],\n      [1585249200000, 0],\n      [1585263600000, 0],\n      [1585278000000, 1],\n      [1585292400000, 6],\n      [1585306800000, 8],\n      [1585321200000, 3],\n      [1585335600000, 0],\n      [1585350000000, 1],\n      [1585364400000, 1],\n      [1585378800000, 2],\n      [1585393200000, 3],\n      [1585407600000, 1],\n      [1585422000000, 0],\n      [1585436400000, 0],\n      [1585447200000, 1],\n      [1585461600000, 0],\n      [1585476000000, 6],\n      [1585490400000, 3],\n      [1585504800000, 0],\n      [1585519200000, 0],\n      [1585533600000, 1],\n      [1585548000000, 4],\n      [1585562400000, 6],\n      [1585576800000, 1],\n      [1585591200000, 0],\n      [1585605600000, 1],\n      [1585620000000, 0],\n      [1585634400000, 1],\n      [1585648800000, 6],\n      [1585663200000, 4],\n      [1585677600000, 0],\n      [1585692000000, 0],\n      [1585706400000, 0],\n      [1585720800000, 1],\n      [1585735200000, 8],\n      [1585749600000, 2],\n      [1585764000000, 0],\n      [1585778400000, null],\n      [1585792800000, 0],\n      [1585807200000, 1],\n      [1585821600000, 6],\n      [1585836000000, 3],\n    ],\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\n    stack: 'percent',\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\n    points: { show: false, radius: 1, lineWidth: 5 },\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\n  },\n  {\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:503',\n    label: '503',\n    color: 'rgb(0, 46, 64)',\n    data: [\n      [1585234800000, 0],\n      [1585249200000, 0],\n      [1585263600000, 0],\n      [1585278000000, 1],\n      [1585292400000, 2],\n      [1585306800000, 3],\n      [1585321200000, 3],\n      [1585335600000, 0],\n      [1585350000000, 0],\n      [1585364400000, 0],\n      [1585378800000, 2],\n      [1585393200000, 2],\n      [1585407600000, 2],\n      [1585422000000, 0],\n      [1585436400000, 0],\n      [1585447200000, 0],\n      [1585461600000, 1],\n      [1585476000000, 3],\n      [1585490400000, 2],\n      [1585504800000, 0],\n      [1585519200000, 0],\n      [1585533600000, 0],\n      [1585548000000, 2],\n      [1585562400000, 1],\n      [1585576800000, 3],\n      [1585591200000, 0],\n      [1585605600000, 0],\n      [1585620000000, 0],\n      [1585634400000, 1],\n      [1585648800000, 1],\n      [1585663200000, 1],\n      [1585677600000, 0],\n      [1585692000000, 0],\n      [1585706400000, 0],\n      [1585720800000, 1],\n      [1585735200000, 3],\n      [1585749600000, 1],\n      [1585764000000, 1],\n      [1585778400000, null],\n      [1585792800000, 0],\n      [1585807200000, 2],\n      [1585821600000, 1],\n      [1585836000000, 3],\n    ],\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\n    stack: 'percent',\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\n    points: { show: false, radius: 1, lineWidth: 5 },\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\n  },\n];\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"Bottom axis\\\"\\n      tickFormat={niceTimeFormatter([1585234800000, 1585836000000])}\\n    />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => `${Number(d * 100).toFixed(0)} %`} />\\n\\n    <AreaSeries\\n      id=\\\"areas1\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[0].data}\\n      stackAccessors={[0]}\\n      stackMode={StackMode.Percentage}\\n    />\\n    <AreaSeries\\n      id=\\\"areas2\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[1].data}\\n      stackAccessors={[0]}\\n      stackMode={StackMode.Percentage}\\n    />\\n    <AreaSeries\\n      id=\\\"areas3\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[2].data}\\n      stackMode={StackMode.Percentage}\\n      stackAccessors={[0]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"timestamp per 1 minute\\\"\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"1\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n    />\\n    <AreaSeries\\n      id=\\\"2\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n    />\\n    <AreaSeries\\n      id=\\\"3\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"timestamp per 1 minute\"\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n    <AreaSeries\n      id=\"1\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n    />\n    <AreaSeries\n      id=\"2\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n    />\n    <AreaSeries\n      id=\"3\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"timestamp per 1 minute\\\"\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"1\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n    />\\n    <AreaSeries\\n      id=\\\"2\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n    />\\n    <AreaSeries\\n      id=\\\"3\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Area Chart',\n};\n\nexport { Example as timeslip } from './21_with_time_timeslip.story';\nexport { Example as basic } from './1_basic.story';\nexport { Example as withTimeXAxis } from './2_with_time.story';\nexport { Example as withLinearXAxis } from './3_with_linear.story';\nexport { Example as withLogYAxis } from './4_with_log.story';\nexport { Example as with4Axes } from './5_with_4_axes.story';\nexport { Example as withAxisAndLegend } from './6_with_axis_and_legend.story';\nexport { Example as stacked } from './7_stacked.story';\nexport { Example as stackedPercentage } from './8_stacked_percentage.story';\nexport { Example as stackedPercentageWithZeros } from './8_stacked_percentage_zeros.story';\nexport { Example as stackedSeparateSpecs } from './9_stacked_separate_specs.story';\nexport { Example as stackedSameNaming } from './10_stacked_same_naming.story';\nexport { Example as bandArea } from './13_band_area.story';\nexport { Example as stackedGrouped } from './15_stacked_grouped.story';\nexport { Example as withNegativeValues } from './17_negative.story';\nexport { Example as withNegativeAndPositive } from './18_negative_positive.story';\nexport { Example as withNegativeBand } from './19_negative_band.story';\nexport { Example as steppedArea } from './20_stepped_area.story';\n\nexport { Example as testLinear } from './11_test_linear.story';\nexport { Example as testTime } from './12_test_time.story';\nexport { Example as testStackedWithMissingValues } from './16_test_stacked_with_missing.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const leftDomain = {\\n    min: number('left min', 0),\\n    max: NaN,\\n  };\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: number('xDomain max', 3),\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={leftDomain}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const leftDomain = {\n    min: number('left min', 0),\n    max: NaN,\n  };\n\n  const xDomain = {\n    min: NaN,\n    max: number('xDomain max', 3),\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis\n        id=\"left\"\n        title=\"Bar axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={leftDomain}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const leftDomain = {\\n    min: number('left min', 0),\\n    max: NaN,\\n  };\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: number('xDomain max', 3),\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={leftDomain}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { array, boolean, number, object, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  DomainPaddingUnit,\\n  LineAnnotation,\\n  Position,\\n  RectAnnotation,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dg = new SeededDataGenerator();\\nconst base = dg.generateBasicSeries(100, 0, 50);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line', { exclude: ['bubble'] });\\n  const positive = base.map(({ x, y }) => ({ x, y: y + 1000 }));\\n  const both = base.map(({ x, y }) => ({ x, y: y - 100 }));\\n  const negative = base.map(({ x, y }) => ({ x, y: y - 1000 }));\\n\\n  const dataTypes = {\\n    positive,\\n    both,\\n    negative,\\n  };\\n  const dataKey = select<'positive' | 'negative' | 'both'>(\\n    'dataset',\\n    {\\n      'Positive values only': 'positive',\\n      'Positive and negative': 'both',\\n      'Negtive values only': 'negative',\\n    },\\n    'both',\\n  );\\n\\n  const dataset = dataTypes[dataKey];\\n  const fit = boolean('fit Y domain to data', true);\\n  const includeDataFromIds = customKnobs.multiSelect<string>(\\n    'Specs to fit (yDomain)',\\n    {\\n      Lines: 'theshold',\\n      Rects: 'rect',\\n    },\\n    ['theshold', 'rect'],\\n    'check',\\n  );\\n  const enableHistogramMode = boolean('enableHistogramMode', true);\\n  const stacked = boolean('stacked', true);\\n  const constrainPadding = boolean('constrain padding', true);\\n  const padding = number('domain padding', 0.1);\\n  const seriesCount = number('number of series', 1, { min: 1, max: 3, range: true });\\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.DomainRatio);\\n  const thesholds = array('thesholds - line', ['200']).filter(Boolean).map(Number);\\n  const rectTheshold = object('theshold - rect', { y0: 100, y1: null });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n          includeDataFromIds,\\n          padding,\\n          paddingUnit,\\n          constrainPadding,\\n        }}\\n        id=\\\"left\\\"\\n        title=\\\"Value\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <LineAnnotation\\n        id=\\\"theshold\\\"\\n        dataValues={thesholds.map((dataValue) => ({ dataValue }))}\\n        domainType=\\\"yDomain\\\"\\n        style={{\\n          line: {\\n            stroke: '#e73c45',\\n            strokeWidth: 2,\\n            opacity: 1,\\n            dash: [4, 4],\\n          },\\n        }}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect\\\"\\n        dataValues={[{ coordinates: rectTheshold }]}\\n        style={{\\n          fill: '#f137407b',\\n        }}\\n      />\\n      {Array.from({ length: seriesCount }, (_, i) => (\\n        <SeriesType\\n          id={`series-${i}`}\\n          key={`series-${i}`}\\n          enableHistogramMode={enableHistogramMode}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          stackAccessors={stacked ? ['true'] : []}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={dataset}\\n        />\\n      ))}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":126},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":126}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { array, boolean, number, object, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  DomainPaddingUnit,\n  LineAnnotation,\n  Position,\n  RectAnnotation,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dg = new SeededDataGenerator();\nconst base = dg.generateBasicSeries(100, 0, 50);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line', { exclude: ['bubble'] });\n  const positive = base.map(({ x, y }) => ({ x, y: y + 1000 }));\n  const both = base.map(({ x, y }) => ({ x, y: y - 100 }));\n  const negative = base.map(({ x, y }) => ({ x, y: y - 1000 }));\n\n  const dataTypes = {\n    positive,\n    both,\n    negative,\n  };\n  const dataKey = select<'positive' | 'negative' | 'both'>(\n    'dataset',\n    {\n      'Positive values only': 'positive',\n      'Positive and negative': 'both',\n      'Negtive values only': 'negative',\n    },\n    'both',\n  );\n\n  const dataset = dataTypes[dataKey];\n  const fit = boolean('fit Y domain to data', true);\n  const includeDataFromIds = customKnobs.multiSelect<string>(\n    'Specs to fit (yDomain)',\n    {\n      Lines: 'theshold',\n      Rects: 'rect',\n    },\n    ['theshold', 'rect'],\n    'check',\n  );\n  const enableHistogramMode = boolean('enableHistogramMode', true);\n  const stacked = boolean('stacked', true);\n  const constrainPadding = boolean('constrain padding', true);\n  const padding = number('domain padding', 0.1);\n  const seriesCount = number('number of series', 1, { min: 1, max: 3, range: true });\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.DomainRatio);\n  const thesholds = array('thesholds - line', ['200']).filter(Boolean).map(Number);\n  const rectTheshold = object('theshold - rect', { y0: 100, y1: null });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n          includeDataFromIds,\n          padding,\n          paddingUnit,\n          constrainPadding,\n        }}\n        id=\"left\"\n        title=\"Value\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <LineAnnotation\n        id=\"theshold\"\n        dataValues={thesholds.map((dataValue) => ({ dataValue }))}\n        domainType=\"yDomain\"\n        style={{\n          line: {\n            stroke: '#e73c45',\n            strokeWidth: 2,\n            opacity: 1,\n            dash: [4, 4],\n          },\n        }}\n      />\n      <RectAnnotation\n        id=\"rect\"\n        dataValues={[{ coordinates: rectTheshold }]}\n        style={{\n          fill: '#f137407b',\n        }}\n      />\n      {Array.from({ length: seriesCount }, (_, i) => (\n        <SeriesType\n          id={`series-${i}`}\n          key={`series-${i}`}\n          enableHistogramMode={enableHistogramMode}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          stackAccessors={stacked ? ['true'] : []}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={dataset}\n        />\n      ))}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line', { exclude: ['bubble'] });\\n  const positive = base.map(({ x, y }) => ({ x, y: y + 1000 }));\\n  const both = base.map(({ x, y }) => ({ x, y: y - 100 }));\\n  const negative = base.map(({ x, y }) => ({ x, y: y - 1000 }));\\n\\n  const dataTypes = {\\n    positive,\\n    both,\\n    negative,\\n  };\\n  const dataKey = select<'positive' | 'negative' | 'both'>(\\n    'dataset',\\n    {\\n      'Positive values only': 'positive',\\n      'Positive and negative': 'both',\\n      'Negtive values only': 'negative',\\n    },\\n    'both',\\n  );\\n\\n  const dataset = dataTypes[dataKey];\\n  const fit = boolean('fit Y domain to data', true);\\n  const includeDataFromIds = customKnobs.multiSelect<string>(\\n    'Specs to fit (yDomain)',\\n    {\\n      Lines: 'theshold',\\n      Rects: 'rect',\\n    },\\n    ['theshold', 'rect'],\\n    'check',\\n  );\\n  const enableHistogramMode = boolean('enableHistogramMode', true);\\n  const stacked = boolean('stacked', true);\\n  const constrainPadding = boolean('constrain padding', true);\\n  const padding = number('domain padding', 0.1);\\n  const seriesCount = number('number of series', 1, { min: 1, max: 3, range: true });\\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.DomainRatio);\\n  const thesholds = array('thesholds - line', ['200']).filter(Boolean).map(Number);\\n  const rectTheshold = object('theshold - rect', { y0: 100, y1: null });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n          includeDataFromIds,\\n          padding,\\n          paddingUnit,\\n          constrainPadding,\\n        }}\\n        id=\\\"left\\\"\\n        title=\\\"Value\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <LineAnnotation\\n        id=\\\"theshold\\\"\\n        dataValues={thesholds.map((dataValue) => ({ dataValue }))}\\n        domainType=\\\"yDomain\\\"\\n        style={{\\n          line: {\\n            stroke: '#e73c45',\\n            strokeWidth: 2,\\n            opacity: 1,\\n            dash: [4, 4],\\n          },\\n        }}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect\\\"\\n        dataValues={[{ coordinates: rectTheshold }]}\\n        style={{\\n          fill: '#f137407b',\\n        }}\\n      />\\n      {Array.from({ length: seriesCount }, (_, i) => (\\n        <SeriesType\\n          id={`series-${i}`}\\n          key={`series-${i}`}\\n          enableHistogramMode={enableHistogramMode}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          stackAccessors={stacked ? ['true'] : []}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={dataset}\\n        />\\n      ))}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport moment from 'moment-timezone';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  niceTimeFormatter,\\n  TickFormatter,\\n  Settings,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const threeDays = moment.duration(3, 'd');\\n  const fourDays = moment.duration(4, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatters: Record<string, TickFormatter> = {\\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\\n    hourly: (d) => moment(d).format('HH:mm'),\\n  };\\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\\n  const formatter = formatters[formatterSelect];\\n\\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: now, y: 2 },\\n          { x: oneDay.add(now).asMilliseconds(), y: 3 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\\n          { x: threeDays.add(now).asMilliseconds(), y: 4 },\\n          { x: fourDays.add(now).asMilliseconds(), y: 8 },\\n          { x: fiveDays.add(now).asMilliseconds(), y: 6 },\\n        ]}\\n        timeZone=\\\"local\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":72},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":72}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport moment from 'moment-timezone';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  niceTimeFormatter,\n  TickFormatter,\n  Settings,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\n  const oneDay = moment.duration(1, 'd');\n  const twoDays = moment.duration(2, 'd');\n  const threeDays = moment.duration(3, 'd');\n  const fourDays = moment.duration(4, 'd');\n  const fiveDays = moment.duration(5, 'd');\n  const formatters: Record<string, TickFormatter> = {\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\n    hourly: (d) => moment(d).format('HH:mm'),\n  };\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\n  const formatter = formatters[formatterSelect];\n\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: now, y: 2 },\n          { x: oneDay.add(now).asMilliseconds(), y: 3 },\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\n          { x: threeDays.add(now).asMilliseconds(), y: 4 },\n          { x: fourDays.add(now).asMilliseconds(), y: 8 },\n          { x: fiveDays.add(now).asMilliseconds(), y: 6 },\n        ]}\n        timeZone=\"local\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const threeDays = moment.duration(3, 'd');\\n  const fourDays = moment.duration(4, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatters: Record<string, TickFormatter> = {\\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\\n    hourly: (d) => moment(d).format('HH:mm'),\\n  };\\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\\n  const formatter = formatters[formatterSelect];\\n\\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: now, y: 2 },\\n          { x: oneDay.add(now).asMilliseconds(), y: 3 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\\n          { x: threeDays.add(now).asMilliseconds(), y: 4 },\\n          { x: fourDays.add(now).asMilliseconds(), y: 8 },\\n          { x: fiveDays.add(now).asMilliseconds(), y: 6 },\\n        ]}\\n        timeZone=\\\"local\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const tickFormatBottom = text('tickFormat bottom', '0.0000');\\n  const labelFormatBottom = text('labelFormat bottom', '0.0');\\n  const tickFormatLeft = text('tickFormat left', '$ 0,0[.]00');\\n  const labelFormatLeft = text('labelFormat left', '$ 0,0');\\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20).map((d) => [(d[0] - start) / 30000, d[1]]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"Weight\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={(d) => numeral(d).format(tickFormatBottom)}\\n        labelFormat={(d) => numeral(d).format(labelFormatBottom)}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Price\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => numeral(d).format(tickFormatLeft)}\\n        labelFormat={(d) => numeral(d).format(labelFormatLeft)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `You can apply different formatter between tick values in the tooltip and legend by using\\n      different values for \\\\`tickFormat\\\\` and \\\\`labelFormat\\\\`.\\n\\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const tickFormatBottom = text('tickFormat bottom', '0.0000');\n  const labelFormatBottom = text('labelFormat bottom', '0.0');\n  const tickFormatLeft = text('tickFormat left', '$ 0,0[.]00');\n  const labelFormatLeft = text('labelFormat left', '$ 0,0');\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20).map((d) => [(d[0] - start) / 30000, d[1]]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"Weight\"\n        position={Position.Bottom}\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\n        tickFormat={(d) => numeral(d).format(tickFormatBottom)}\n        labelFormat={(d) => numeral(d).format(labelFormatBottom)}\n      />\n      <Axis\n        id=\"left\"\n        title=\"Price\"\n        position={Position.Left}\n        tickFormat={(d) => numeral(d).format(tickFormatLeft)}\n        labelFormat={(d) => numeral(d).format(labelFormatLeft)}\n      />\n\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can apply different formatter between tick values in the tooltip and legend by using\n      different values for \\`tickFormat\\` and \\`labelFormat\\`.\n\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const tickFormatBottom = text('tickFormat bottom', '0.0000');\\n  const labelFormatBottom = text('labelFormat bottom', '0.0');\\n  const tickFormatLeft = text('tickFormat left', '$ 0,0[.]00');\\n  const labelFormatLeft = text('labelFormat left', '$ 0,0');\\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20).map((d) => [(d[0] - start) / 30000, d[1]]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"Weight\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={(d) => numeral(d).format(tickFormatBottom)}\\n        labelFormat={(d) => numeral(d).format(labelFormatBottom)}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Price\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => numeral(d).format(tickFormatLeft)}\\n        labelFormat={(d) => numeral(d).format(labelFormatLeft)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport moment from 'moment-timezone';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  niceTimeFormatter,\\n  TickFormatter,\\n  Settings,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const threeDays = moment.duration(3, 'd');\\n  const fourDays = moment.duration(4, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatters: Record<string, TickFormatter> = {\\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\\n    hourly: (d) => moment(d).format('HH:mm'),\\n  };\\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\\n  const formatter = formatters[formatterSelect];\\n\\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\\n        labelFormat={(d) => `${Number(d).toFixed(0)}`}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: now, y: 0.2 },\\n          { x: oneDay.add(now).asMilliseconds(), y: 0.5 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 0.2 },\\n          { x: threeDays.add(now).asMilliseconds(), y: 1.1 },\\n          { x: fourDays.add(now).asMilliseconds(), y: 0.8 },\\n          { x: fiveDays.add(now).asMilliseconds(), y: 1.2 },\\n        ]}\\n        timeZone=\\\"local\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport moment from 'moment-timezone';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  niceTimeFormatter,\n  TickFormatter,\n  Settings,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\n  const oneDay = moment.duration(1, 'd');\n  const twoDays = moment.duration(2, 'd');\n  const threeDays = moment.duration(3, 'd');\n  const fourDays = moment.duration(4, 'd');\n  const fiveDays = moment.duration(5, 'd');\n  const formatters: Record<string, TickFormatter> = {\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\n    hourly: (d) => moment(d).format('HH:mm'),\n  };\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\n  const formatter = formatters[formatterSelect];\n\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\n        labelFormat={(d) => `${Number(d).toFixed(0)}`}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: now, y: 0.2 },\n          { x: oneDay.add(now).asMilliseconds(), y: 0.5 },\n          { x: twoDays.add(now).asMilliseconds(), y: 0.2 },\n          { x: threeDays.add(now).asMilliseconds(), y: 1.1 },\n          { x: fourDays.add(now).asMilliseconds(), y: 0.8 },\n          { x: fiveDays.add(now).asMilliseconds(), y: 1.2 },\n        ]}\n        timeZone=\"local\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const threeDays = moment.duration(3, 'd');\\n  const fourDays = moment.duration(4, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatters: Record<string, TickFormatter> = {\\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\\n    hourly: (d) => moment(d).format('HH:mm'),\\n  };\\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\\n  const formatter = formatters[formatterSelect];\\n\\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\\n        labelFormat={(d) => `${Number(d).toFixed(0)}`}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: now, y: 0.2 },\\n          { x: oneDay.add(now).asMilliseconds(), y: 0.5 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 0.2 },\\n          { x: threeDays.add(now).asMilliseconds(), y: 1.1 },\\n          { x: fourDays.add(now).asMilliseconds(), y: 0.8 },\\n          { x: fiveDays.add(now).asMilliseconds(), y: 1.2 },\\n        ]}\\n        timeZone=\\\"local\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nconst getData = (() => {\\n  const cache = new Map<string, Array<[string, number]>>();\\n  return (min: number, max: number, digits: number) => {\\n    const fractionDigits = Math.max(5, digits + 1);\\n    const key = `${min}:${max}:${fractionDigits}`;\\n    if (cache.has(key)) return cache.get(key)!;\\n    const data: Array<[string, number]> = [];\\n    for (let i = 1; i <= 5; i++) {\\n      data.push([`Sensor ${i}`, rng(min, max, fractionDigits)]);\\n    }\\n    cache.set(key, data);\\n    return data;\\n  };\\n})();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const maximumFractionDigits = number('maximumFractionDigits', 0, { step: 1 });\\n  const dataRange = customKnobs.numbersArray('Data range', [0, 10]);\\n  const [Series] = customKnobs.enum.xySeries('Series type', 'bar', { exclude: ['bubble'] });\\n  const scaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Log', 'Sqrt'] });\\n  const niceValues = boolean('yNice', false);\\n\\n  const min = Math.min(...dataRange);\\n  const max = Math.max(...dataRange);\\n  const data = getData(min, max, maximumFractionDigits);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} maximumFractionDigits={maximumFractionDigits} />\\n\\n      <Series\\n        id=\\\"Thermal changes\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={scaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        yNice={niceValues}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":36},\"endLoc\":{\"col\":1,\"line\":64},\"startBody\":{\"col\":36,\"line\":36},\"endBody\":{\"col\":1,\"line\":64}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst rng = getRandomNumberGenerator();\n\nconst getData = (() => {\n  const cache = new Map<string, Array<[string, number]>>();\n  return (min: number, max: number, digits: number) => {\n    const fractionDigits = Math.max(5, digits + 1);\n    const key = `${min}:${max}:${fractionDigits}`;\n    if (cache.has(key)) return cache.get(key)!;\n    const data: Array<[string, number]> = [];\n    for (let i = 1; i <= 5; i++) {\n      data.push([`Sensor ${i}`, rng(min, max, fractionDigits)]);\n    }\n    cache.set(key, data);\n    return data;\n  };\n})();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const maximumFractionDigits = number('maximumFractionDigits', 0, { step: 1 });\n  const dataRange = customKnobs.numbersArray('Data range', [0, 10]);\n  const [Series] = customKnobs.enum.xySeries('Series type', 'bar', { exclude: ['bubble'] });\n  const scaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Log', 'Sqrt'] });\n  const niceValues = boolean('yNice', false);\n\n  const min = Math.min(...dataRange);\n  const max = Math.max(...dataRange);\n  const data = getData(min, max, maximumFractionDigits);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" position={Position.Left} maximumFractionDigits={maximumFractionDigits} />\n\n      <Series\n        id=\"Thermal changes\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={scaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        yNice={niceValues}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const maximumFractionDigits = number('maximumFractionDigits', 0, { step: 1 });\\n  const dataRange = customKnobs.numbersArray('Data range', [0, 10]);\\n  const [Series] = customKnobs.enum.xySeries('Series type', 'bar', { exclude: ['bubble'] });\\n  const scaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Log', 'Sqrt'] });\\n  const niceValues = boolean('yNice', false);\\n\\n  const min = Math.min(...dataRange);\\n  const max = Math.max(...dataRange);\\n  const data = getData(min, max, maximumFractionDigits);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} maximumFractionDigits={maximumFractionDigits} />\\n\\n      <Series\\n        id=\\\"Thermal changes\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={scaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        yNice={niceValues}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  niceTimeFormatter,\\n  RecursivePartial,\\n  AxisStyle,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding', 0, {\\n        range: true,\\n        min: 2,\\n        max: 30,\\n        step: 1,\\n      }),\\n    },\\n  };\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 60);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        style={customStyle}\\n        showOverlappingLabels={boolean('Bottom overlap labels', false, 'Bottom Axis')}\\n        showOverlappingTicks={boolean('Bottom overlap ticks', true, 'Bottom Axis')}\\n        ticks={number(\\n          'Number of ticks on bottom',\\n          10,\\n          {\\n            range: true,\\n            min: 2,\\n            max: 20,\\n            step: 1,\\n          },\\n          'Bottom Axis',\\n        )}\\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        style={customStyle}\\n        showOverlappingLabels={boolean('Left overlap labels', false, 'Left Axis')}\\n        showOverlappingTicks={boolean('Left overlap ticks', true, 'Left Axis')}\\n        ticks={number(\\n          'Number of ticks on left',\\n          10,\\n          {\\n            range: true,\\n            min: 2,\\n            max: 20,\\n            step: 1,\\n          },\\n          'Left Axis',\\n        )}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  niceTimeFormatter,\n  RecursivePartial,\n  AxisStyle,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customStyle: RecursivePartial<AxisStyle> = {\n    tickLabel: {\n      padding: number('Tick Label Padding', 0, {\n        range: true,\n        min: 2,\n        max: 30,\n        step: 1,\n      }),\n    },\n  };\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 60);\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        style={customStyle}\n        showOverlappingLabels={boolean('Bottom overlap labels', false, 'Bottom Axis')}\n        showOverlappingTicks={boolean('Bottom overlap ticks', true, 'Bottom Axis')}\n        ticks={number(\n          'Number of ticks on bottom',\n          10,\n          {\n            range: true,\n            min: 2,\n            max: 20,\n            step: 1,\n          },\n          'Bottom Axis',\n        )}\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n      />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        style={customStyle}\n        showOverlappingLabels={boolean('Left overlap labels', false, 'Left Axis')}\n        showOverlappingTicks={boolean('Left overlap ticks', true, 'Left Axis')}\n        ticks={number(\n          'Number of ticks on left',\n          10,\n          {\n            range: true,\n            min: 2,\n            max: 20,\n            step: 1,\n          },\n          'Left Axis',\n        )}\n      />\n\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding', 0, {\\n        range: true,\\n        min: 2,\\n        max: 30,\\n        step: 1,\\n      }),\\n    },\\n  };\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 60);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        style={customStyle}\\n        showOverlappingLabels={boolean('Bottom overlap labels', false, 'Bottom Axis')}\\n        showOverlappingTicks={boolean('Bottom overlap ticks', true, 'Bottom Axis')}\\n        ticks={number(\\n          'Number of ticks on bottom',\\n          10,\\n          {\\n            range: true,\\n            min: 2,\\n            max: 20,\\n            step: 1,\\n          },\\n          'Bottom Axis',\\n        )}\\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        style={customStyle}\\n        showOverlappingLabels={boolean('Left overlap labels', false, 'Left Axis')}\\n        showOverlappingTicks={boolean('Left overlap ticks', true, 'Left Axis')}\\n        ticks={number(\\n          'Number of ticks on left',\\n          10,\\n          {\\n            range: true,\\n            min: 2,\\n            max: 20,\\n            step: 1,\\n          },\\n          'Left Axis',\\n        )}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  AxisStyle,\\n  RecursivePartial,\\n  LEGACY_CHART_MARGINS,\\n  DEFAULT_CHART_PADDING,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst getAxisKnobs = (group?: string, gridLines = false): RecursivePartial<AxisStyle> => ({\\n  axisTitle: {\\n    visible: !boolean('Hide axis title', false, group),\\n    padding: {\\n      outer: customKnobs.positiveNumber('Axis title padding - outer', 6, group),\\n      inner: customKnobs.positiveNumber('Axis title padding - inner', 6, group),\\n    },\\n  },\\n  axisLine: {\\n    visible: !boolean('Hide axis line', false, group),\\n  },\\n  tickLine: {\\n    visible: !boolean('Hide tick lines', false, group),\\n    padding: customKnobs.positiveNumber('Tick line padding', 10, group),\\n    size: customKnobs.positiveNumber('Tick line size', 10, group),\\n  },\\n  tickLabel: {\\n    visible: !boolean('Hide tick labels', false, group),\\n    rotation: number(\\n      'Tick label rotation',\\n      0,\\n      {\\n        range: true,\\n        min: -90,\\n        max: 90,\\n        step: 1,\\n      },\\n      group,\\n    ),\\n    padding: {\\n      outer: customKnobs.positiveNumber('Tick label padding - outer', 0, group),\\n      inner: customKnobs.positiveNumber('Tick label padding - inner', 0, group),\\n    },\\n    offset: {\\n      y: number(\\n        'Tick label y offset',\\n        0,\\n        {\\n          range: true,\\n          min: -10,\\n          max: 10,\\n          step: 1,\\n        },\\n        group,\\n      ),\\n      x: number(\\n        'Tick label x offset',\\n        0,\\n        {\\n          range: true,\\n          min: -10,\\n          max: 10,\\n          step: 1,\\n        },\\n        group,\\n      ),\\n      reference: select(\\n        'Tick label offset reference',\\n        {\\n          Global: 'global',\\n          Local: 'local',\\n        },\\n        'local',\\n        group,\\n      ),\\n    },\\n    alignment: {\\n      vertical: customKnobs.enum.verticalTextAlignment(group),\\n      horizontal: customKnobs.enum.horizontalTextAlignment(group),\\n    },\\n  },\\n  ...(gridLines && {\\n    gridLine: {\\n      horizontal: {\\n        visible: boolean('show horizontal gridLines', false, group),\\n      },\\n      vertical: {\\n        visible: boolean('show vertical gridLines', false, group),\\n      },\\n    },\\n  }),\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false, 'general');\\n  const onlyGlobal = !boolean('disable axis overrides', false, 'general');\\n  const chartMargins = {\\n    left: customKnobs.positiveNumber('margin left', LEGACY_CHART_MARGINS.left, 'general'),\\n    right: customKnobs.positiveNumber('margin right', LEGACY_CHART_MARGINS.right, 'general'),\\n    top: customKnobs.positiveNumber('margin top', LEGACY_CHART_MARGINS.top, 'general'),\\n    bottom: customKnobs.positiveNumber('margin bottom', LEGACY_CHART_MARGINS.bottom, 'general'),\\n  };\\n  const chartPaddings = {\\n    left: customKnobs.positiveNumber('padding left', DEFAULT_CHART_PADDING.left, 'general'),\\n    right: customKnobs.positiveNumber('padding right', DEFAULT_CHART_PADDING.right, 'general'),\\n    top: customKnobs.positiveNumber('padding top', DEFAULT_CHART_PADDING.top, 'general'),\\n    bottom: customKnobs.positiveNumber('padding bottom', DEFAULT_CHART_PADDING.bottom, 'general'),\\n  };\\n  const bottomAxisStyles = getAxisKnobs(Position.Bottom);\\n  const leftAxisStyles = getAxisKnobs(Position.Left);\\n  const topAxisStyles = getAxisKnobs(Position.Top);\\n  const rightAxisStyles = getAxisKnobs(Position.Right);\\n  const theme = {\\n    axes: getAxisKnobs('shared', true),\\n    chartMargins,\\n    chartPaddings,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        hide={boolean('hide axis', false, Position.Bottom)}\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Bottom),\\n              }\\n            : undefined\\n        }\\n        style={onlyGlobal ? bottomAxisStyles : undefined}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        hide={boolean('hide axis', false, Position.Left)}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        style={onlyGlobal ? leftAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Left),\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        hide={boolean('hide axis', false, Position.Top)}\\n        title=\\\"Top axis\\\"\\n        position={Position.Top}\\n        style={onlyGlobal ? topAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Top),\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        hide={boolean('hide axis', false, Position.Right)}\\n        title=\\\"Right axis\\\"\\n        position={Position.Right}\\n        style={onlyGlobal ? rightAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Right),\\n              }\\n            : undefined\\n        }\\n        domain={{ min: 0, max: 100 }}\\n      />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 20 },\\n          { x: 1, y: 70 },\\n          { x: 2, y: 30 },\\n          { x: 3, y: 60 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":112},\"endLoc\":{\"col\":1,\"line\":213},\"startBody\":{\"col\":36,\"line\":112},\"endBody\":{\"col\":1,\"line\":213}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  AxisStyle,\n  RecursivePartial,\n  LEGACY_CHART_MARGINS,\n  DEFAULT_CHART_PADDING,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst getAxisKnobs = (group?: string, gridLines = false): RecursivePartial<AxisStyle> => ({\n  axisTitle: {\n    visible: !boolean('Hide axis title', false, group),\n    padding: {\n      outer: customKnobs.positiveNumber('Axis title padding - outer', 6, group),\n      inner: customKnobs.positiveNumber('Axis title padding - inner', 6, group),\n    },\n  },\n  axisLine: {\n    visible: !boolean('Hide axis line', false, group),\n  },\n  tickLine: {\n    visible: !boolean('Hide tick lines', false, group),\n    padding: customKnobs.positiveNumber('Tick line padding', 10, group),\n    size: customKnobs.positiveNumber('Tick line size', 10, group),\n  },\n  tickLabel: {\n    visible: !boolean('Hide tick labels', false, group),\n    rotation: number(\n      'Tick label rotation',\n      0,\n      {\n        range: true,\n        min: -90,\n        max: 90,\n        step: 1,\n      },\n      group,\n    ),\n    padding: {\n      outer: customKnobs.positiveNumber('Tick label padding - outer', 0, group),\n      inner: customKnobs.positiveNumber('Tick label padding - inner', 0, group),\n    },\n    offset: {\n      y: number(\n        'Tick label y offset',\n        0,\n        {\n          range: true,\n          min: -10,\n          max: 10,\n          step: 1,\n        },\n        group,\n      ),\n      x: number(\n        'Tick label x offset',\n        0,\n        {\n          range: true,\n          min: -10,\n          max: 10,\n          step: 1,\n        },\n        group,\n      ),\n      reference: select(\n        'Tick label offset reference',\n        {\n          Global: 'global',\n          Local: 'local',\n        },\n        'local',\n        group,\n      ),\n    },\n    alignment: {\n      vertical: customKnobs.enum.verticalTextAlignment(group),\n      horizontal: customKnobs.enum.horizontalTextAlignment(group),\n    },\n  },\n  ...(gridLines && {\n    gridLine: {\n      horizontal: {\n        visible: boolean('show horizontal gridLines', false, group),\n      },\n      vertical: {\n        visible: boolean('show vertical gridLines', false, group),\n      },\n    },\n  }),\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false, 'general');\n  const onlyGlobal = !boolean('disable axis overrides', false, 'general');\n  const chartMargins = {\n    left: customKnobs.positiveNumber('margin left', LEGACY_CHART_MARGINS.left, 'general'),\n    right: customKnobs.positiveNumber('margin right', LEGACY_CHART_MARGINS.right, 'general'),\n    top: customKnobs.positiveNumber('margin top', LEGACY_CHART_MARGINS.top, 'general'),\n    bottom: customKnobs.positiveNumber('margin bottom', LEGACY_CHART_MARGINS.bottom, 'general'),\n  };\n  const chartPaddings = {\n    left: customKnobs.positiveNumber('padding left', DEFAULT_CHART_PADDING.left, 'general'),\n    right: customKnobs.positiveNumber('padding right', DEFAULT_CHART_PADDING.right, 'general'),\n    top: customKnobs.positiveNumber('padding top', DEFAULT_CHART_PADDING.top, 'general'),\n    bottom: customKnobs.positiveNumber('padding bottom', DEFAULT_CHART_PADDING.bottom, 'general'),\n  };\n  const bottomAxisStyles = getAxisKnobs(Position.Bottom);\n  const leftAxisStyles = getAxisKnobs(Position.Left);\n  const topAxisStyles = getAxisKnobs(Position.Top);\n  const rightAxisStyles = getAxisKnobs(Position.Right);\n  const theme = {\n    axes: getAxisKnobs('shared', true),\n    chartMargins,\n    chartPaddings,\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        hide={boolean('hide axis', false, Position.Bottom)}\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks\n        gridLine={\n          onlyGlobal\n            ? {\n                visible: boolean('show gridLines', false, Position.Bottom),\n              }\n            : undefined\n        }\n        style={onlyGlobal ? bottomAxisStyles : undefined}\n      />\n      <Axis\n        id=\"left\"\n        hide={boolean('hide axis', false, Position.Left)}\n        title=\"Left axis\"\n        position={Position.Left}\n        style={onlyGlobal ? leftAxisStyles : undefined}\n        gridLine={\n          onlyGlobal\n            ? {\n                visible: boolean('show gridLines', false, Position.Left),\n              }\n            : undefined\n        }\n      />\n      <Axis\n        id=\"top\"\n        hide={boolean('hide axis', false, Position.Top)}\n        title=\"Top axis\"\n        position={Position.Top}\n        style={onlyGlobal ? topAxisStyles : undefined}\n        gridLine={\n          onlyGlobal\n            ? {\n                visible: boolean('show gridLines', false, Position.Top),\n              }\n            : undefined\n        }\n      />\n      <Axis\n        id=\"right\"\n        hide={boolean('hide axis', false, Position.Right)}\n        title=\"Right axis\"\n        position={Position.Right}\n        style={onlyGlobal ? rightAxisStyles : undefined}\n        gridLine={\n          onlyGlobal\n            ? {\n                visible: boolean('show gridLines', false, Position.Right),\n              }\n            : undefined\n        }\n        domain={{ min: 0, max: 100 }}\n      />\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 20 },\n          { x: 1, y: 70 },\n          { x: 2, y: 30 },\n          { x: 3, y: 60 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false, 'general');\\n  const onlyGlobal = !boolean('disable axis overrides', false, 'general');\\n  const chartMargins = {\\n    left: customKnobs.positiveNumber('margin left', LEGACY_CHART_MARGINS.left, 'general'),\\n    right: customKnobs.positiveNumber('margin right', LEGACY_CHART_MARGINS.right, 'general'),\\n    top: customKnobs.positiveNumber('margin top', LEGACY_CHART_MARGINS.top, 'general'),\\n    bottom: customKnobs.positiveNumber('margin bottom', LEGACY_CHART_MARGINS.bottom, 'general'),\\n  };\\n  const chartPaddings = {\\n    left: customKnobs.positiveNumber('padding left', DEFAULT_CHART_PADDING.left, 'general'),\\n    right: customKnobs.positiveNumber('padding right', DEFAULT_CHART_PADDING.right, 'general'),\\n    top: customKnobs.positiveNumber('padding top', DEFAULT_CHART_PADDING.top, 'general'),\\n    bottom: customKnobs.positiveNumber('padding bottom', DEFAULT_CHART_PADDING.bottom, 'general'),\\n  };\\n  const bottomAxisStyles = getAxisKnobs(Position.Bottom);\\n  const leftAxisStyles = getAxisKnobs(Position.Left);\\n  const topAxisStyles = getAxisKnobs(Position.Top);\\n  const rightAxisStyles = getAxisKnobs(Position.Right);\\n  const theme = {\\n    axes: getAxisKnobs('shared', true),\\n    chartMargins,\\n    chartPaddings,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        hide={boolean('hide axis', false, Position.Bottom)}\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Bottom),\\n              }\\n            : undefined\\n        }\\n        style={onlyGlobal ? bottomAxisStyles : undefined}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        hide={boolean('hide axis', false, Position.Left)}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        style={onlyGlobal ? leftAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Left),\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        hide={boolean('hide axis', false, Position.Top)}\\n        title=\\\"Top axis\\\"\\n        position={Position.Top}\\n        style={onlyGlobal ? topAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Top),\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        hide={boolean('hide axis', false, Position.Right)}\\n        title=\\\"Right axis\\\"\\n        position={Position.Right}\\n        style={onlyGlobal ? rightAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Right),\\n              }\\n            : undefined\\n        }\\n        domain={{ min: 0, max: 100 }}\\n      />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 20 },\\n          { x: 1, y: 70 },\\n          { x: 2, y: 30 },\\n          { x: 3, y: 60 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"bottom\\\"\\n      showOverlappingTicks\\n      hide={boolean('hide botttom axis', false)}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title=\\\"left\\\"\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      hide={boolean('hide left axis', false)}\\n    />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks hide={boolean('hide top axis', false)} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"right\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      hide={boolean('hide right axis', false)}\\n    />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"bottom\"\n      showOverlappingTicks\n      hide={boolean('hide botttom axis', false)}\n    />\n    <Axis\n      id=\"left\"\n      title=\"left\"\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n      hide={boolean('hide left axis', false)}\n    />\n    <Axis id=\"top\" position={Position.Top} title=\"top\" showOverlappingTicks hide={boolean('hide top axis', false)} />\n    <Axis\n      id=\"right\"\n      title=\"right\"\n      position={Position.Right}\n      tickFormat={(d) => Number(d).toFixed(2)}\n      hide={boolean('hide right axis', false)}\n    />\n\n    <AreaSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"bottom\\\"\\n      showOverlappingTicks\\n      hide={boolean('hide botttom axis', false)}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title=\\\"left\\\"\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      hide={boolean('hide left axis', false)}\\n    />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks hide={boolean('hide top axis', false)} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"right\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      hide={boolean('hide right axis', false)}\\n    />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction createThemeAction(title: string, min: number, max: number, value: number) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step: 1,\\n    },\\n    'theme',\\n  );\\n}\\n\\nfunction renderAxisWithOptions(position: Position, seriesGroup: string, show: boolean) {\\n  const axisTitle = `${position} axis (${seriesGroup})`;\\n\\n  const showAxis = boolean(`show ${axisTitle} axis`, show, `${position} axes`);\\n\\n  if (!showAxis) {\\n    return null;\\n  }\\n\\n  const axisProps = {\\n    id: axisTitle,\\n    position,\\n    title: axisTitle,\\n    showOverlappingTicks: true,\\n  };\\n\\n  return <Axis {...axisProps} />;\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    chartMargins: {\\n      left: createThemeAction('margin left', 0, 50, 0),\\n      right: createThemeAction('margin right', 0, 50, 0),\\n      top: createThemeAction('margin top', 0, 50, 0),\\n      bottom: createThemeAction('margin bottom', 0, 50, 0),\\n    },\\n    chartPaddings: {\\n      left: createThemeAction('padding left', 0, 50, 0),\\n      right: createThemeAction('padding right', 0, 50, 0),\\n      top: createThemeAction('padding top', 0, 50, 0),\\n      bottom: createThemeAction('padding bottom', 0, 50, 0),\\n    },\\n  };\\n  const seriesGroup1 = 'group1';\\n  const seriesGroup2 = 'group2';\\n  return (\\n    <Chart title={title} description={description} size={[500, 300]}>\\n      <Settings showLegend={false} theme={customTheme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\\n      {renderAxisWithOptions(Position.Top, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Top, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Left, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Left, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Bottom, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Bottom, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Right, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Right, seriesGroup2, true)}\\n      <BarSeries\\n        id=\\\"barseries1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 1 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 4 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":50},\"endLoc\":{\"col\":1,\"line\":93},\"startBody\":{\"col\":36,\"line\":50},\"endBody\":{\"col\":1,\"line\":93}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction createThemeAction(title: string, min: number, max: number, value: number) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step: 1,\n    },\n    'theme',\n  );\n}\n\nfunction renderAxisWithOptions(position: Position, seriesGroup: string, show: boolean) {\n  const axisTitle = `${position} axis (${seriesGroup})`;\n\n  const showAxis = boolean(`show ${axisTitle} axis`, show, `${position} axes`);\n\n  if (!showAxis) {\n    return null;\n  }\n\n  const axisProps = {\n    id: axisTitle,\n    position,\n    title: axisTitle,\n    showOverlappingTicks: true,\n  };\n\n  return <Axis {...axisProps} />;\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customTheme: PartialTheme = {\n    chartMargins: {\n      left: createThemeAction('margin left', 0, 50, 0),\n      right: createThemeAction('margin right', 0, 50, 0),\n      top: createThemeAction('margin top', 0, 50, 0),\n      bottom: createThemeAction('margin bottom', 0, 50, 0),\n    },\n    chartPaddings: {\n      left: createThemeAction('padding left', 0, 50, 0),\n      right: createThemeAction('padding right', 0, 50, 0),\n      top: createThemeAction('padding top', 0, 50, 0),\n      bottom: createThemeAction('padding bottom', 0, 50, 0),\n    },\n  };\n  const seriesGroup1 = 'group1';\n  const seriesGroup2 = 'group2';\n  return (\n    <Chart title={title} description={description} size={[500, 300]}>\n      <Settings showLegend={false} theme={customTheme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\n      {renderAxisWithOptions(Position.Top, seriesGroup1, false)}\n      {renderAxisWithOptions(Position.Top, seriesGroup2, true)}\n      {renderAxisWithOptions(Position.Left, seriesGroup1, false)}\n      {renderAxisWithOptions(Position.Left, seriesGroup2, true)}\n      {renderAxisWithOptions(Position.Bottom, seriesGroup1, false)}\n      {renderAxisWithOptions(Position.Bottom, seriesGroup2, true)}\n      {renderAxisWithOptions(Position.Right, seriesGroup1, false)}\n      {renderAxisWithOptions(Position.Right, seriesGroup2, true)}\n      <BarSeries\n        id=\"barseries1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 1 },\n          { x: 1, y: 2 },\n          { x: 2, y: 3 },\n          { x: 3, y: 4 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    chartMargins: {\\n      left: createThemeAction('margin left', 0, 50, 0),\\n      right: createThemeAction('margin right', 0, 50, 0),\\n      top: createThemeAction('margin top', 0, 50, 0),\\n      bottom: createThemeAction('margin bottom', 0, 50, 0),\\n    },\\n    chartPaddings: {\\n      left: createThemeAction('padding left', 0, 50, 0),\\n      right: createThemeAction('padding right', 0, 50, 0),\\n      top: createThemeAction('padding top', 0, 50, 0),\\n      bottom: createThemeAction('padding bottom', 0, 50, 0),\\n    },\\n  };\\n  const seriesGroup1 = 'group1';\\n  const seriesGroup2 = 'group2';\\n  return (\\n    <Chart title={title} description={description} size={[500, 300]}>\\n      <Settings showLegend={false} theme={customTheme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\\n      {renderAxisWithOptions(Position.Top, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Top, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Left, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Left, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Bottom, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Bottom, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Right, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Right, seriesGroup2, true)}\\n      <BarSeries\\n        id=\\\"barseries1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 1 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 4 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"Bar axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"Line axis\\\"\\n      groupId=\\\"group2\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      groupId=\\\"group2\\\"\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left\" title=\"Bar axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n    <Axis\n      id=\"right\"\n      title=\"Line axis\"\n      groupId=\"group2\"\n      position={Position.Right}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      groupId=\"group2\"\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 3 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 10 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"Bar axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"Line axis\\\"\\n      groupId=\\\"group2\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      groupId=\\\"group2\\\"\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left\\\"\\n      groupId=\\\"group1\\\"\\n      title=\\\"Line 1\\\"\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)} %`}\\n    />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"Line 2\\\"\\n      groupId=\\\"group2\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}/s`}\\n    />\\n    <LineSeries\\n      id=\\\"line1\\\"\\n      groupId=\\\"group1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 5 },\\n        { x: 1, y: 4 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 2 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line2\\\"\\n      groupId=\\\"group2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 3 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 5 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":65},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":65}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis\n      id=\"left\"\n      groupId=\"group1\"\n      title=\"Line 1\"\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(2)} %`}\n    />\n    <Axis\n      id=\"right\"\n      title=\"Line 2\"\n      groupId=\"group2\"\n      position={Position.Right}\n      tickFormat={(d) => `${Number(d).toFixed(2)}/s`}\n    />\n    <LineSeries\n      id=\"line1\"\n      groupId=\"group1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 5 },\n        { x: 1, y: 4 },\n        { x: 2, y: 3 },\n        { x: 3, y: 2 },\n      ]}\n    />\n    <LineSeries\n      id=\"line2\"\n      groupId=\"group2\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 3 },\n        { x: 2, y: 4 },\n        { x: 3, y: 5 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left\\\"\\n      groupId=\\\"group1\\\"\\n      title=\\\"Line 1\\\"\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)} %`}\\n    />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"Line 2\\\"\\n      groupId=\\\"group2\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}/s`}\\n    />\\n    <LineSeries\\n      id=\\\"line1\\\"\\n      groupId=\\\"group1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 5 },\\n        { x: 1, y: 4 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 2 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line2\\\"\\n      groupId=\\\"group2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 3 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 5 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { text, boolean } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings, Tooltip } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showLegend = boolean('Show legend', true, 'Y axis');\\n  const disableYAxisFormat = boolean('Disable Axis tickFormat', false, 'Y axis');\\n  const yAxisFormat = text('Axis value format', '0[.]0', 'Y axis');\\n  const yAxisUnit = text('Axis unit', 'pets', 'Y axis');\\n  const disableHeaderFormat = boolean('Disable header tickFormat', false, 'X axis');\\n  const headerUnit = text('Header unit', '(header)', 'X axis');\\n  const disableXAxisFormat = boolean('Disable Axis tickFormat', false, 'X axis');\\n  const xAxisUnit = text('Axis unit', '(axis)', 'X axis');\\n  const disableDogLineFormat = boolean('Disable dog line tickFormat', false, 'Y axis');\\n  const dogLineFormat = text('Dog line unit', 'dogs', 'Y axis');\\n  const disableCatLineFormat = boolean('Disable cat line tickFormat', false, 'Y axis');\\n  const catLineFormat = text('Cat line unit', 'cats', 'Y axis');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} showLegendExtra showLegend={showLegend} />\\n      <Tooltip\\n        headerFormatter={\\n          disableHeaderFormat ? undefined : ({ value }) => `${value}${headerUnit ? ` ${headerUnit}` : ''}`\\n        }\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"Country\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={disableXAxisFormat ? undefined : (value) => `${value}${xAxisUnit ? ` ${xAxisUnit}` : ''}`}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Units\\\"\\n        position={Position.Left}\\n        tickFormat={\\n          disableYAxisFormat ? undefined : (d) => `${numeral(d).format(yAxisFormat)}${yAxisUnit ? ` ${yAxisUnit}` : ''}`\\n        }\\n      />\\n      <LineSeries\\n        id=\\\"Dog line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        tickFormat={disableDogLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${dogLineFormat}`}\\n        data={[\\n          { x: 'USA', y: 8 },\\n          { x: 'Canada', y: 7 },\\n          { x: 'Mexico', y: 18 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"Cat line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        tickFormat={disableCatLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${catLineFormat}`}\\n        data={[\\n          { x: 'USA', y: 14 },\\n          { x: 'Canada', y: 15 },\\n          { x: 'Mexico', y: 14 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: 'Using a single axis with different unit types is discouraged. ',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":83},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":83}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { text, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings, Tooltip } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showLegend = boolean('Show legend', true, 'Y axis');\n  const disableYAxisFormat = boolean('Disable Axis tickFormat', false, 'Y axis');\n  const yAxisFormat = text('Axis value format', '0[.]0', 'Y axis');\n  const yAxisUnit = text('Axis unit', 'pets', 'Y axis');\n  const disableHeaderFormat = boolean('Disable header tickFormat', false, 'X axis');\n  const headerUnit = text('Header unit', '(header)', 'X axis');\n  const disableXAxisFormat = boolean('Disable Axis tickFormat', false, 'X axis');\n  const xAxisUnit = text('Axis unit', '(axis)', 'X axis');\n  const disableDogLineFormat = boolean('Disable dog line tickFormat', false, 'Y axis');\n  const dogLineFormat = text('Dog line unit', 'dogs', 'Y axis');\n  const disableCatLineFormat = boolean('Disable cat line tickFormat', false, 'Y axis');\n  const catLineFormat = text('Cat line unit', 'cats', 'Y axis');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} showLegendExtra showLegend={showLegend} />\n      <Tooltip\n        headerFormatter={\n          disableHeaderFormat ? undefined : ({ value }) => `${value}${headerUnit ? ` ${headerUnit}` : ''}`\n        }\n      />\n      <Axis\n        id=\"bottom\"\n        title=\"Country\"\n        position={Position.Bottom}\n        showOverlappingTicks\n        tickFormat={disableXAxisFormat ? undefined : (value) => `${value}${xAxisUnit ? ` ${xAxisUnit}` : ''}`}\n      />\n      <Axis\n        id=\"left\"\n        title=\"Units\"\n        position={Position.Left}\n        tickFormat={\n          disableYAxisFormat ? undefined : (d) => `${numeral(d).format(yAxisFormat)}${yAxisUnit ? ` ${yAxisUnit}` : ''}`\n        }\n      />\n      <LineSeries\n        id=\"Dog line\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        tickFormat={disableDogLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${dogLineFormat}`}\n        data={[\n          { x: 'USA', y: 8 },\n          { x: 'Canada', y: 7 },\n          { x: 'Mexico', y: 18 },\n        ]}\n      />\n      <LineSeries\n        id=\"Cat line\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        tickFormat={disableCatLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${catLineFormat}`}\n        data={[\n          { x: 'USA', y: 14 },\n          { x: 'Canada', y: 15 },\n          { x: 'Mexico', y: 14 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: 'Using a single axis with different unit types is discouraged. ',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showLegend = boolean('Show legend', true, 'Y axis');\\n  const disableYAxisFormat = boolean('Disable Axis tickFormat', false, 'Y axis');\\n  const yAxisFormat = text('Axis value format', '0[.]0', 'Y axis');\\n  const yAxisUnit = text('Axis unit', 'pets', 'Y axis');\\n  const disableHeaderFormat = boolean('Disable header tickFormat', false, 'X axis');\\n  const headerUnit = text('Header unit', '(header)', 'X axis');\\n  const disableXAxisFormat = boolean('Disable Axis tickFormat', false, 'X axis');\\n  const xAxisUnit = text('Axis unit', '(axis)', 'X axis');\\n  const disableDogLineFormat = boolean('Disable dog line tickFormat', false, 'Y axis');\\n  const dogLineFormat = text('Dog line unit', 'dogs', 'Y axis');\\n  const disableCatLineFormat = boolean('Disable cat line tickFormat', false, 'Y axis');\\n  const catLineFormat = text('Cat line unit', 'cats', 'Y axis');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} showLegendExtra showLegend={showLegend} />\\n      <Tooltip\\n        headerFormatter={\\n          disableHeaderFormat ? undefined : ({ value }) => `${value}${headerUnit ? ` ${headerUnit}` : ''}`\\n        }\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"Country\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={disableXAxisFormat ? undefined : (value) => `${value}${xAxisUnit ? ` ${xAxisUnit}` : ''}`}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Units\\\"\\n        position={Position.Left}\\n        tickFormat={\\n          disableYAxisFormat ? undefined : (d) => `${numeral(d).format(yAxisFormat)}${yAxisUnit ? ` ${yAxisUnit}` : ''}`\\n        }\\n      />\\n      <LineSeries\\n        id=\\\"Dog line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        tickFormat={disableDogLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${dogLineFormat}`}\\n        data={[\\n          { x: 'USA', y: 8 },\\n          { x: 'Canada', y: 7 },\\n          { x: 'Mexico', y: 18 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"Cat line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        tickFormat={disableCatLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${catLineFormat}`}\\n        data={[\\n          { x: 'USA', y: 14 },\\n          { x: 'Canada', y: 15 },\\n          { x: 'Mexico', y: 14 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, RecursivePartial, AxisStyle } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const dg = new SeededDataGenerator();\\n  const data = dg.generateSimpleSeries(31);\\n\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding', 0),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks style={customStyle} />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, RecursivePartial, AxisStyle } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const dg = new SeededDataGenerator();\n  const data = dg.generateSimpleSeries(31);\n\n  const customStyle: RecursivePartial<AxisStyle> = {\n    tickLabel: {\n      padding: number('Tick Label Padding', 0),\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks style={customStyle} />\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const dg = new SeededDataGenerator();\\n  const data = dg.generateSimpleSeries(31);\\n\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding', 0),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks style={customStyle} />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LIGHT_THEME, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customXDomain = boolean('customize X domain', true, 'X axis');\\n  const customBarYDomain = boolean('customize Y domain', true, 'Bar');\\n  const customLineYDomain = boolean('customize Y domain', true, 'Line');\\n  const options = {\\n    range: true,\\n    min: -10,\\n    max: 20,\\n    step: 0.1,\\n  };\\n  const barDomain = {\\n    min: number('Bar min', -5, options, 'Bar'),\\n    max: number('Bar max', 7, options, 'Bar'),\\n  };\\n\\n  const lineDomain = {\\n    min: number('Line min', 0, options, 'Line'),\\n    max: number('Line max', 8, options, 'Line'),\\n  };\\n\\n  const ticksOptions = {\\n    range: true,\\n    min: 1,\\n    max: 15,\\n    step: 1,\\n  };\\n  const barTicks = number('Bar ticks', 4, ticksOptions, 'Bar');\\n  const lineTicks = number('Line ticks', 10, ticksOptions, 'Line');\\n\\n  const xOptions = {\\n    range: true,\\n    min: 0,\\n    max: 6,\\n    step: 1,\\n  };\\n  const xDomain = {\\n    min: number('X min', 0, xOptions, 'X axis'),\\n    max: number('X max', 3, xOptions, 'X axis'),\\n  };\\n\\n  const showBars = boolean('show bars', true, 'Bar');\\n  const niceDomainBar = boolean('nice domain', true, 'Bar');\\n  const niceDomainLine = boolean('nice domain', true, 'Line');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend={false}\\n        theme={{ chartPaddings: { top: 0, left: 10, right: 10, bottom: 0 } }}\\n        baseTheme={useBaseTheme()}\\n        xDomain={customXDomain ? xDomain : undefined}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"X axis\\\"\\n        style={{\\n          tickLine: {\\n            visible: true,\\n          },\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={customBarYDomain ? barDomain : undefined}\\n        hide={boolean('Hide bar axis', false, 'Bar')}\\n        ticks={barTicks}\\n        style={{\\n          axisLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[0],\\n            strokeWidth: 1.5,\\n          },\\n          axisTitle: {\\n            fill: LIGHT_THEME.colors.vizColors[0],\\n          },\\n          tickLabel: {\\n            fill: LIGHT_THEME.colors.vizColors[0],\\n          },\\n          tickLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[0],\\n          },\\n        }}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Line\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={customLineYDomain ? lineDomain : undefined}\\n        hide={boolean('Hide line axis', false, 'Line')}\\n        ticks={lineTicks}\\n        style={{\\n          axisLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[1],\\n            strokeWidth: 1.5,\\n          },\\n          axisTitle: {\\n            fill: LIGHT_THEME.colors.vizColors[1],\\n          },\\n          tickLabel: {\\n            fill: LIGHT_THEME.colors.vizColors[1],\\n          },\\n          tickLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[1],\\n          },\\n        }}\\n      />\\n      {showBars && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          yNice={niceDomainBar}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 7 },\\n            { x: 2, y: -3 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      )}\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        xNice={niceDomainLine}\\n        yScaleType={ScaleType.Linear}\\n        yNice={niceDomainLine}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":162},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":162}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LIGHT_THEME, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customXDomain = boolean('customize X domain', true, 'X axis');\n  const customBarYDomain = boolean('customize Y domain', true, 'Bar');\n  const customLineYDomain = boolean('customize Y domain', true, 'Line');\n  const options = {\n    range: true,\n    min: -10,\n    max: 20,\n    step: 0.1,\n  };\n  const barDomain = {\n    min: number('Bar min', -5, options, 'Bar'),\n    max: number('Bar max', 7, options, 'Bar'),\n  };\n\n  const lineDomain = {\n    min: number('Line min', 0, options, 'Line'),\n    max: number('Line max', 8, options, 'Line'),\n  };\n\n  const ticksOptions = {\n    range: true,\n    min: 1,\n    max: 15,\n    step: 1,\n  };\n  const barTicks = number('Bar ticks', 4, ticksOptions, 'Bar');\n  const lineTicks = number('Line ticks', 10, ticksOptions, 'Line');\n\n  const xOptions = {\n    range: true,\n    min: 0,\n    max: 6,\n    step: 1,\n  };\n  const xDomain = {\n    min: number('X min', 0, xOptions, 'X axis'),\n    max: number('X max', 3, xOptions, 'X axis'),\n  };\n\n  const showBars = boolean('show bars', true, 'Bar');\n  const niceDomainBar = boolean('nice domain', true, 'Bar');\n  const niceDomainLine = boolean('nice domain', true, 'Line');\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend={false}\n        theme={{ chartPaddings: { top: 0, left: 10, right: 10, bottom: 0 } }}\n        baseTheme={useBaseTheme()}\n        xDomain={customXDomain ? xDomain : undefined}\n      />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"X axis\"\n        style={{\n          tickLine: {\n            visible: true,\n          },\n        }}\n      />\n      <Axis\n        id=\"left\"\n        title=\"Bar\"\n        position={Position.Right}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={customBarYDomain ? barDomain : undefined}\n        hide={boolean('Hide bar axis', false, 'Bar')}\n        ticks={barTicks}\n        style={{\n          axisLine: {\n            stroke: LIGHT_THEME.colors.vizColors[0],\n            strokeWidth: 1.5,\n          },\n          axisTitle: {\n            fill: LIGHT_THEME.colors.vizColors[0],\n          },\n          tickLabel: {\n            fill: LIGHT_THEME.colors.vizColors[0],\n          },\n          tickLine: {\n            stroke: LIGHT_THEME.colors.vizColors[0],\n          },\n        }}\n      />\n      <Axis\n        id=\"right\"\n        title=\"Line\"\n        groupId=\"group2\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={customLineYDomain ? lineDomain : undefined}\n        hide={boolean('Hide line axis', false, 'Line')}\n        ticks={lineTicks}\n        style={{\n          axisLine: {\n            stroke: LIGHT_THEME.colors.vizColors[1],\n            strokeWidth: 1.5,\n          },\n          axisTitle: {\n            fill: LIGHT_THEME.colors.vizColors[1],\n          },\n          tickLabel: {\n            fill: LIGHT_THEME.colors.vizColors[1],\n          },\n          tickLine: {\n            stroke: LIGHT_THEME.colors.vizColors[1],\n          },\n        }}\n      />\n      {showBars && (\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          yNice={niceDomainBar}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={[\n            { x: 0, y: 2 },\n            { x: 1, y: 7 },\n            { x: 2, y: -3 },\n            { x: 3, y: 6 },\n          ]}\n        />\n      )}\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        xNice={niceDomainLine}\n        yScaleType={ScaleType.Linear}\n        yNice={niceDomainLine}\n        groupId=\"group2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customXDomain = boolean('customize X domain', true, 'X axis');\\n  const customBarYDomain = boolean('customize Y domain', true, 'Bar');\\n  const customLineYDomain = boolean('customize Y domain', true, 'Line');\\n  const options = {\\n    range: true,\\n    min: -10,\\n    max: 20,\\n    step: 0.1,\\n  };\\n  const barDomain = {\\n    min: number('Bar min', -5, options, 'Bar'),\\n    max: number('Bar max', 7, options, 'Bar'),\\n  };\\n\\n  const lineDomain = {\\n    min: number('Line min', 0, options, 'Line'),\\n    max: number('Line max', 8, options, 'Line'),\\n  };\\n\\n  const ticksOptions = {\\n    range: true,\\n    min: 1,\\n    max: 15,\\n    step: 1,\\n  };\\n  const barTicks = number('Bar ticks', 4, ticksOptions, 'Bar');\\n  const lineTicks = number('Line ticks', 10, ticksOptions, 'Line');\\n\\n  const xOptions = {\\n    range: true,\\n    min: 0,\\n    max: 6,\\n    step: 1,\\n  };\\n  const xDomain = {\\n    min: number('X min', 0, xOptions, 'X axis'),\\n    max: number('X max', 3, xOptions, 'X axis'),\\n  };\\n\\n  const showBars = boolean('show bars', true, 'Bar');\\n  const niceDomainBar = boolean('nice domain', true, 'Bar');\\n  const niceDomainLine = boolean('nice domain', true, 'Line');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend={false}\\n        theme={{ chartPaddings: { top: 0, left: 10, right: 10, bottom: 0 } }}\\n        baseTheme={useBaseTheme()}\\n        xDomain={customXDomain ? xDomain : undefined}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"X axis\\\"\\n        style={{\\n          tickLine: {\\n            visible: true,\\n          },\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={customBarYDomain ? barDomain : undefined}\\n        hide={boolean('Hide bar axis', false, 'Bar')}\\n        ticks={barTicks}\\n        style={{\\n          axisLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[0],\\n            strokeWidth: 1.5,\\n          },\\n          axisTitle: {\\n            fill: LIGHT_THEME.colors.vizColors[0],\\n          },\\n          tickLabel: {\\n            fill: LIGHT_THEME.colors.vizColors[0],\\n          },\\n          tickLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[0],\\n          },\\n        }}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Line\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={customLineYDomain ? lineDomain : undefined}\\n        hide={boolean('Hide line axis', false, 'Line')}\\n        ticks={lineTicks}\\n        style={{\\n          axisLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[1],\\n            strokeWidth: 1.5,\\n          },\\n          axisTitle: {\\n            fill: LIGHT_THEME.colors.vizColors[1],\\n          },\\n          tickLabel: {\\n            fill: LIGHT_THEME.colors.vizColors[1],\\n          },\\n          tickLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[1],\\n          },\\n        }}\\n      />\\n      {showBars && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          yNice={niceDomainBar}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 7 },\\n            { x: 2, y: -3 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      )}\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        xNice={niceDomainLine}\\n        yScaleType={ScaleType.Linear}\\n        yNice={niceDomainLine}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const leftDomain = {\\n    min: number('left min', 0),\\n    max: number('left max', 7),\\n  };\\n\\n  const right1Domain = {\\n    min: number('right1 min', 0),\\n    max: number('right1 max', 10),\\n  };\\n\\n  const xDomain = customKnobs.array('xDomain', ['a', 'b', 'c', 'd', 0, 1, 2, 3]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={leftDomain}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Line axis\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={right1Domain}\\n      />\\n      <Axis\\n        id=\\\"right 2\\\"\\n        title=\\\"Line axis 2\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":87},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":87}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const leftDomain = {\n    min: number('left min', 0),\n    max: number('left max', 7),\n  };\n\n  const right1Domain = {\n    min: number('right1 min', 0),\n    max: number('right1 max', 10),\n  };\n\n  const xDomain = customKnobs.array('xDomain', ['a', 'b', 'c', 'd', 0, 1, 2, 3]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis\n        id=\"left\"\n        title=\"Bar axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={leftDomain}\n      />\n      <Axis\n        id=\"right\"\n        title=\"Line axis\"\n        groupId=\"group2\"\n        position={Position.Right}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={right1Domain}\n      />\n      <Axis\n        id=\"right 2\"\n        title=\"Line axis 2\"\n        groupId=\"group2\"\n        position={Position.Right}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'a', y: 2 },\n          { x: 'b', y: 7 },\n          { x: 'c', y: 3 },\n          { x: 'd', y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        groupId=\"group2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const leftDomain = {\\n    min: number('left min', 0),\\n    max: number('left max', 7),\\n  };\\n\\n  const right1Domain = {\\n    min: number('right1 min', 0),\\n    max: number('right1 max', 10),\\n  };\\n\\n  const xDomain = customKnobs.array('xDomain', ['a', 'b', 'c', 'd', 0, 1, 2, 3]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={leftDomain}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Line axis\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={right1Domain}\\n      />\\n      <Axis\\n        id=\\\"right 2\\\"\\n        title=\\\"Line axis 2\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Axes',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as tickLabelRotation } from './2_tick_label_rotation.story';\nexport { Example as with4Axes } from './3_axis_4_axes.story';\nexport { Example as multiAxes } from './4_multi_axis.story';\nexport { Example as maximumFractionDigits } from './15_maximum_fraction_digits.story';\nexport { Example as barsAndLines } from './5_multi_axis_bar_lines.story';\nexport { Example as differentTooltip } from './6_different_tooltip.story';\nexport { Example as differentTooltipFormatter } from './6a_different_tooltip_formatter.story';\nexport { Example as manyTickLabels } from './7_many_tick_labels.story';\nexport { Example as customDomain } from './8_custom_domain.story';\nexport { Example as customMixed } from './9_custom_mixed_domain.story';\nexport { Example as oneDomainBound } from './10_one_domain_bound.story';\nexport { Example as fitDomain } from './11_fit_domain_extent.story';\nexport { Example as duplicateTicks } from './12_duplicate_ticks.story';\nexport { Example as labelFormatting } from './13_label_formatting.story';\nexport { Example as duplicateTicks2 } from './14_duplicate_ticks_2.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      name=\\\"Simple bar series\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      name=\"Simple bar series\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      name=\\\"Simple bar series\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 2, g: 'a' },\\n        { x: 1, y: 7, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 6, g: 'a' },\\n        { x: 0, y: 4, g: 'b' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 2, y: 8, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      splitSeriesAccessors={['g']}\n      data={[\n        { x: 0, y: 2, g: 'a' },\n        { x: 1, y: 7, g: 'a' },\n        { x: 2, y: 3, g: 'a' },\n        { x: 3, y: 6, g: 'a' },\n        { x: 0, y: 4, g: 'b' },\n        { x: 1, y: 5, g: 'b' },\n        { x: 2, y: 8, g: 'b' },\n        { x: 3, y: 2, g: 'b' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 2, g: 'a' },\\n        { x: 1, y: 7, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 6, g: 'a' },\\n        { x: 0, y: 4, g: 'b' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 2, y: 8, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  StackMode,\\n  computeRatioByGroups,\\n} from '@elastic/charts';\\n\\nimport { AnnotationDomainType, LineAnnotation } from '../../../packages/charts/src/chart_types/specs';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const modes = select(\\n    'mode',\\n    { stack: 'stack', stackAsPercentage: 'stackAsPercentage', unstacked: 'unstacked' },\\n    'stackAsPercentage',\\n  );\\n  const stack = modes !== 'unstacked' ? ['x'] : undefined;\\n  const stackMode = modes === 'stackAsPercentage' ? StackMode.Percentage : undefined;\\n\\n  const originalData = [\\n    { x: 'pos/neg', y: -10, y2: 10, g: 'a' },\\n    { x: 'pos/neg', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'zero/zero', y: 0, y2: 10, g: 'a' },\\n    { x: 'zero/zero', y: 0, y2: 10, g: 'b' },\\n\\n    { x: 'zero/pos', y: 0, y2: 10, g: 'a' },\\n    { x: 'zero/pos', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'null/pos', y: null, y2: 10, g: 'a' },\\n    { x: 'null/pos', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'pos/pos', y: 2, y2: 10, g: 'a' },\\n    { x: 'pos/pos', y: 8, y2: 10, g: 'b' },\\n\\n    { x: 'neg/neg', y: -2, y2: 10, g: 'a' },\\n    { x: 'neg/neg', y: -8, y2: 10, g: 'b' },\\n  ];\\n\\n  const useMultipleY = boolean('use multiple Y accessors', false);\\n  const data = boolean('use computeRatioByGroups fn', false)\\n    ? computeRatioByGroups(\\n        originalData,\\n        ['x'],\\n        useMultipleY\\n          ? [\\n              [(d) => d.y, (d, v) => ({ ...d, y: v })],\\n              [(d) => d.y2, (d, v) => ({ ...d, y2: v })],\\n            ]\\n          : [[(d) => d.y, (d, v) => ({ ...d, y: v })]],\\n      )\\n    : originalData;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n\\n      <Axis\\n        id=\\\"left2\\\"\\n        position={Position.Left}\\n        gridLine={{\\n          visible: true,\\n          stroke: 'rgba(128,128,128,0.5)',\\n          strokeWidth: 0.5,\\n        }}\\n        ticks={5}\\n        style={{ axisLine: { visible: false }, tickLine: { visible: false }, tickLabel: { padding: 5 } }}\\n        tickFormat={(d: any) => (modes === 'stackAsPercentage' ? `${Number(d * 100).toFixed(0)} %` : `${d}`)}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={useMultipleY ? ['y', 'y2'] : ['y']}\\n        stackAccessors={stack}\\n        stackMode={stack && stackMode}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n      <LineAnnotation dataValues={[{ dataValue: 0 }]} id=\\\"baseline\\\" domainType={AnnotationDomainType.YDomain} />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":101},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":101}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  StackMode,\n  computeRatioByGroups,\n} from '@elastic/charts';\n\nimport { AnnotationDomainType, LineAnnotation } from '../../../packages/charts/src/chart_types/specs';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const modes = select(\n    'mode',\n    { stack: 'stack', stackAsPercentage: 'stackAsPercentage', unstacked: 'unstacked' },\n    'stackAsPercentage',\n  );\n  const stack = modes !== 'unstacked' ? ['x'] : undefined;\n  const stackMode = modes === 'stackAsPercentage' ? StackMode.Percentage : undefined;\n\n  const originalData = [\n    { x: 'pos/neg', y: -10, y2: 10, g: 'a' },\n    { x: 'pos/neg', y: 10, y2: 10, g: 'b' },\n\n    { x: 'zero/zero', y: 0, y2: 10, g: 'a' },\n    { x: 'zero/zero', y: 0, y2: 10, g: 'b' },\n\n    { x: 'zero/pos', y: 0, y2: 10, g: 'a' },\n    { x: 'zero/pos', y: 10, y2: 10, g: 'b' },\n\n    { x: 'null/pos', y: null, y2: 10, g: 'a' },\n    { x: 'null/pos', y: 10, y2: 10, g: 'b' },\n\n    { x: 'pos/pos', y: 2, y2: 10, g: 'a' },\n    { x: 'pos/pos', y: 8, y2: 10, g: 'b' },\n\n    { x: 'neg/neg', y: -2, y2: 10, g: 'a' },\n    { x: 'neg/neg', y: -8, y2: 10, g: 'b' },\n  ];\n\n  const useMultipleY = boolean('use multiple Y accessors', false);\n  const data = boolean('use computeRatioByGroups fn', false)\n    ? computeRatioByGroups(\n        originalData,\n        ['x'],\n        useMultipleY\n          ? [\n              [(d) => d.y, (d, v) => ({ ...d, y: v })],\n              [(d) => d.y2, (d, v) => ({ ...d, y2: v })],\n            ]\n          : [[(d) => d.y, (d, v) => ({ ...d, y: v })]],\n      )\n    : originalData;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n\n      <Axis\n        id=\"left2\"\n        position={Position.Left}\n        gridLine={{\n          visible: true,\n          stroke: 'rgba(128,128,128,0.5)',\n          strokeWidth: 0.5,\n        }}\n        ticks={5}\n        style={{ axisLine: { visible: false }, tickLine: { visible: false }, tickLabel: { padding: 5 } }}\n        tickFormat={(d: any) => (modes === 'stackAsPercentage' ? `${Number(d * 100).toFixed(0)} %` : `${d}`)}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={useMultipleY ? ['y', 'y2'] : ['y']}\n        stackAccessors={stack}\n        stackMode={stack && stackMode}\n        splitSeriesAccessors={['g']}\n        data={data}\n      />\n      <LineAnnotation dataValues={[{ dataValue: 0 }]} id=\"baseline\" domainType={AnnotationDomainType.YDomain} />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const modes = select(\\n    'mode',\\n    { stack: 'stack', stackAsPercentage: 'stackAsPercentage', unstacked: 'unstacked' },\\n    'stackAsPercentage',\\n  );\\n  const stack = modes !== 'unstacked' ? ['x'] : undefined;\\n  const stackMode = modes === 'stackAsPercentage' ? StackMode.Percentage : undefined;\\n\\n  const originalData = [\\n    { x: 'pos/neg', y: -10, y2: 10, g: 'a' },\\n    { x: 'pos/neg', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'zero/zero', y: 0, y2: 10, g: 'a' },\\n    { x: 'zero/zero', y: 0, y2: 10, g: 'b' },\\n\\n    { x: 'zero/pos', y: 0, y2: 10, g: 'a' },\\n    { x: 'zero/pos', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'null/pos', y: null, y2: 10, g: 'a' },\\n    { x: 'null/pos', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'pos/pos', y: 2, y2: 10, g: 'a' },\\n    { x: 'pos/pos', y: 8, y2: 10, g: 'b' },\\n\\n    { x: 'neg/neg', y: -2, y2: 10, g: 'a' },\\n    { x: 'neg/neg', y: -8, y2: 10, g: 'b' },\\n  ];\\n\\n  const useMultipleY = boolean('use multiple Y accessors', false);\\n  const data = boolean('use computeRatioByGroups fn', false)\\n    ? computeRatioByGroups(\\n        originalData,\\n        ['x'],\\n        useMultipleY\\n          ? [\\n              [(d) => d.y, (d, v) => ({ ...d, y: v })],\\n              [(d) => d.y2, (d, v) => ({ ...d, y2: v })],\\n            ]\\n          : [[(d) => d.y, (d, v) => ({ ...d, y: v })]],\\n      )\\n    : originalData;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n\\n      <Axis\\n        id=\\\"left2\\\"\\n        position={Position.Left}\\n        gridLine={{\\n          visible: true,\\n          stroke: 'rgba(128,128,128,0.5)',\\n          strokeWidth: 0.5,\\n        }}\\n        ticks={5}\\n        style={{ axisLine: { visible: false }, tickLine: { visible: false }, tickLabel: { padding: 5 } }}\\n        tickFormat={(d: any) => (modes === 'stackAsPercentage' ? `${Number(d * 100).toFixed(0)} %` : `${d}`)}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={useMultipleY ? ['y', 'y2'] : ['y']}\\n        stackAccessors={stack}\\n        stackMode={stack && stackMode}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n      <LineAnnotation dataValues={[{ dataValue: 0 }]} id=\\\"baseline\\\" domainType={AnnotationDomainType.YDomain} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    scales: {\\n      histogramPadding: number('histogram padding', 0.05, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n      barsPadding: number('bar padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        rotation={customKnobs.enum.rotation()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={[\\n          { x: 0, y: 2, g: 'a' },\\n          { x: 1, y: 7, g: 'a' },\\n          { x: 2, y: 3, g: 'a' },\\n          { x: 3, y: 6, g: 'a' },\\n          { x: 0, y: 4, g: 'b' },\\n          { x: 1, y: 5, g: 'b' },\\n          { x: 2, y: 8, g: 'b' },\\n          { x: 3, y: 2, g: 'b' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":68},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":68}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    scales: {\n      histogramPadding: number('histogram padding', 0.05, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      }),\n      barsPadding: number('bar padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      }),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        rotation={customKnobs.enum.rotation()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={[\n          { x: 0, y: 2, g: 'a' },\n          { x: 1, y: 7, g: 'a' },\n          { x: 2, y: 3, g: 'a' },\n          { x: 3, y: 6, g: 'a' },\n          { x: 0, y: 4, g: 'b' },\n          { x: 1, y: 5, g: 'b' },\n          { x: 2, y: 8, g: 'b' },\n          { x: 3, y: 2, g: 'b' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    scales: {\\n      histogramPadding: number('histogram padding', 0.05, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n      barsPadding: number('bar padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        rotation={customKnobs.enum.rotation()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={[\\n          { x: 0, y: 2, g: 'a' },\\n          { x: 1, y: 7, g: 'a' },\\n          { x: 2, y: 3, g: 'a' },\\n          { x: 3, y: 6, g: 'a' },\\n          { x: 0, y: 4, g: 'b' },\\n          { x: 1, y: 5, g: 'b' },\\n          { x: 2, y: 8, g: 'b' },\\n          { x: 3, y: 2, g: 'b' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"elements\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"count\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bar series 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <BarSeries\\n      id=\\\"bar series 2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n    <BarSeries\\n      id=\\\"bar series 3\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 1, g: 'a' },\\n        { x: 1, y: 2, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 4, g: 'a' },\\n        { x: 0, y: 5, g: 'b' },\\n        { x: 1, y: 8, g: 'b' },\\n        { x: 2, y: 9, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":67},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":67}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"elements\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"count\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bar series 1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <BarSeries\n      id=\"bar series 2\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n    <BarSeries\n      id=\"bar series 3\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      data={[\n        { x: 0, y: 1, g: 'a' },\n        { x: 1, y: 2, g: 'a' },\n        { x: 2, y: 3, g: 'a' },\n        { x: 3, y: 4, g: 'a' },\n        { x: 0, y: 5, g: 'b' },\n        { x: 1, y: 8, g: 'b' },\n        { x: 2, y: 9, g: 'b' },\n        { x: 3, y: 2, g: 'b' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"elements\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"count\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bar series 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <BarSeries\\n      id=\\\"bar series 2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n    <BarSeries\\n      id=\\\"bar series 3\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 1, g: 'a' },\\n        { x: 1, y: 2, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 4, g: 'a' },\\n        { x: 0, y: 5, g: 'b' },\\n        { x: 1, y: 8, g: 'b' },\\n        { x: 2, y: 9, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":68},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":68}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\n        tickFormat={formatter}\n      />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      />\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n      />\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  CustomTooltip,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  Tooltip,\\n  TooltipContainer,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst CustomTooltipWithSubChart: CustomTooltip = ({ values }) => {\\n  const [value] = values.filter((v) => v.isHighlighted);\\n  return (\\n    <TooltipContainer>\\n      <div style={{ padding: 10 }}>Hovering: {value.label}</div>\\n    </TooltipContainer>\\n  );\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useCustomTooltip = boolean('Use custom tooltip', false);\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n\\n      {useCustomTooltip && <Tooltip customTooltip={CustomTooltipWithSubChart} type=\\\"follow\\\" />}\\n\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":39},\"endLoc\":{\"col\":1,\"line\":87},\"startBody\":{\"col\":36,\"line\":39},\"endBody\":{\"col\":1,\"line\":87}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  CustomTooltip,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  Tooltip,\n  TooltipContainer,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst CustomTooltipWithSubChart: CustomTooltip = ({ values }) => {\n  const [value] = values.filter((v) => v.isHighlighted);\n  return (\n    <TooltipContainer>\n      <div style={{ padding: 10 }}>Hovering: {value.label}</div>\n    </TooltipContainer>\n  );\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useCustomTooltip = boolean('Use custom tooltip', false);\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n\n      {useCustomTooltip && <Tooltip customTooltip={CustomTooltipWithSubChart} type=\"follow\" />}\n\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\n        tickFormat={formatter}\n      />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\n      />\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\n      />\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useCustomTooltip = boolean('Use custom tooltip', false);\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n\\n      {useCustomTooltip && <Tooltip customTooltip={CustomTooltipWithSubChart} type=\\\"follow\\\" />}\\n\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={TestDatasets.BARCHART_1Y0G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":32},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":32}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={TestDatasets.BARCHART_1Y0G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={TestDatasets.BARCHART_1Y0G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={TestDatasets.BARCHART_1Y1G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":33},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":33}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      data={TestDatasets.BARCHART_1Y1G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={TestDatasets.BARCHART_1Y1G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { BarSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const toggleSpec = boolean('toggle bar spec', true);\\n  const data1 = [\\n    { x: 0, y: 2 },\\n    { x: 1, y: 7 },\\n    { x: 2, y: 3 },\\n    { x: 3, y: 6 },\\n  ];\\n  const data2 = data1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const data = toggleSpec ? data1 : data2;\\n  const specId = toggleSpec ? 'bars1' : 'bars2';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <BarSeries\\n        id={specId}\\n        name=\\\"Simple bar series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { BarSeries, Chart, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const toggleSpec = boolean('toggle bar spec', true);\n  const data1 = [\n    { x: 0, y: 2 },\n    { x: 1, y: 7 },\n    { x: 2, y: 3 },\n    { x: 3, y: 6 },\n  ];\n  const data2 = data1.map((datum) => ({ ...datum, y: datum.y - 1 }));\n  const data = toggleSpec ? data1 : data2;\n  const specId = toggleSpec ? 'bars1' : 'bars2';\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <BarSeries\n        id={specId}\n        name=\"Simple bar series\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const toggleSpec = boolean('toggle bar spec', true);\\n  const data1 = [\\n    { x: 0, y: 2 },\\n    { x: 1, y: 7 },\\n    { x: 2, y: 3 },\\n    { x: 3, y: 6 },\\n  ];\\n  const data2 = data1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const data = toggleSpec ? data1 : data2;\\n  const specId = toggleSpec ? 'bars1' : 'bars2';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <BarSeries\\n        id={specId}\\n        name=\\\"Simple bar series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      data={TestDatasets.BARCHART_1Y2G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":33},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":33}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g1', 'g2']}\n      data={TestDatasets.BARCHART_1Y2G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      data={TestDatasets.BARCHART_1Y2G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      data={TestDatasets.BARCHART_2Y0G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":32},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":32}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y1', 'y2']}\n      data={TestDatasets.BARCHART_2Y0G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      data={TestDatasets.BARCHART_2Y0G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      splitSeriesAccessors={['g']}\\n      data={TestDatasets.BARCHART_2Y1G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":33},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":33}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y1', 'y2']}\n      splitSeriesAccessors={['g']}\n      data={TestDatasets.BARCHART_2Y1G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      splitSeriesAccessors={['g']}\\n      data={TestDatasets.BARCHART_2Y1G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      data={TestDatasets.BARCHART_2Y2G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":32},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":32}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y1', 'y2']}\n      splitSeriesAccessors={['g1', 'g2']}\n      data={TestDatasets.BARCHART_2Y2G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      data={TestDatasets.BARCHART_2Y2G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, FilterPredicate } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const isVisibleFunction: FilterPredicate = (series) => series.splitAccessors.get('g1') === 'cloudflare.com';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n        filterSeriesInTooltip={isVisibleFunction}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, FilterPredicate } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const isVisibleFunction: FilterPredicate = (series) => series.splitAccessors.get('g1') === 'cloudflare.com';\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        data={TestDatasets.BARCHART_2Y2G}\n        filterSeriesInTooltip={isVisibleFunction}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const isVisibleFunction: FilterPredicate = (series) => series.splitAccessors.get('g1') === 'cloudflare.com';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n        filterSeriesInTooltip={isVisibleFunction}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const dg = new SeededDataGenerator();\\n  const data = dg.generateSimpleSeries(15000);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Tooltip type={TooltipType.Follow} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const dg = new SeededDataGenerator();\n  const data = dg.generateSimpleSeries(15000);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Tooltip type={TooltipType.Follow} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const dg = new SeededDataGenerator();\\n  const data = dg.generateSimpleSeries(15000);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Tooltip type={TooltipType.Follow} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hasCustomDomain = boolean('has custom domain', false);\\n  const xDomain = hasCustomDomain\\n    ? {\\n        min: 0,\\n        max: NaN,\\n      }\\n    : undefined;\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 1, y: 10 }]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hasCustomDomain = boolean('has custom domain', false);\n  const xDomain = hasCustomDomain\n    ? {\n        min: 0,\n        max: NaN,\n      }\n    : undefined;\n\n  const theme: PartialTheme = {\n    scales: {\n      barsPadding: number('bars padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[{ x: 1, y: 10 }]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hasCustomDomain = boolean('has custom domain', false);\\n  const xDomain = hasCustomDomain\\n    ? {\\n        min: 0,\\n        max: NaN,\\n      }\\n    : undefined;\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 1, y: 10 }]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hasCustomDomain = boolean('has custom domain', false);\\n  const xDomain = hasCustomDomain ? ['a', 'b'] : undefined;\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 'a', y: 10, g: 1 }]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hasCustomDomain = boolean('has custom domain', false);\n  const xDomain = hasCustomDomain ? ['a', 'b'] : undefined;\n\n  const theme: PartialTheme = {\n    scales: {\n      barsPadding: number('bars padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[{ x: 'a', y: 10, g: 1 }]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hasCustomDomain = boolean('has custom domain', false);\\n  const xDomain = hasCustomDomain ? ['a', 'b'] : undefined;\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 'a', y: 10, g: 1 }]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 1, y: 10, g: 'a' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 1, y: 3, g: 'c' },\\n        { x: 1, y: 10, g: 'd' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      data={[\n        { x: 1, y: 10, g: 'a' },\n        { x: 1, y: 5, g: 'b' },\n        { x: 1, y: 3, g: 'c' },\n        { x: 1, y: 10, g: 'd' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 1, y: 10, g: 'a' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 1, y: 3, g: 'c' },\\n        { x: 1, y: 10, g: 'd' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 1, y: 10, g: 'a' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 1, y: 3, g: 'c' },\\n        { x: 1, y: 10, g: 'd' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":38},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":38}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      stackAccessors={['x']}\n      data={[\n        { x: 1, y: 10, g: 'a' },\n        { x: 1, y: 5, g: 'b' },\n        { x: 1, y: 3, g: 'c' },\n        { x: 1, y: 10, g: 'd' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 1, y: 10, g: 'a' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 1, y: 3, g: 'c' },\\n        { x: 1, y: 10, g: 'd' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  DisplayValueSpec,\\n  LabelOverflowConstraint,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  PartialTheme,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dataGen = new SeededDataGenerator();\\nfunction generateDataWithAdditional(num: number) {\\n  return [...dataGen.generateSimpleSeries(num), { x: num, y: 0.25, g: 0 }, { x: num + 1, y: 8, g: 0 }];\\n}\\nconst frozenDataSmallVolume = generateDataWithAdditional(5);\\nconst frozenDataMediumVolume = generateDataWithAdditional(30);\\nconst frozenDataHighVolume = generateDataWithAdditional(500);\\n\\nconst frozenData: { [key: string]: any[] } = {\\n  s: frozenDataSmallVolume,\\n  m: frozenDataMediumVolume,\\n  h: frozenDataHighVolume,\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const singleSeries = boolean('show single series', false);\\n  const showValueLabel = boolean('show value label', true);\\n  const isAlternatingValueLabel = boolean('alternating value label', false);\\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\\n  if (overflowChartEdges) {\\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\\n  }\\n  if (overflowBarGeometry) {\\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\\n  }\\n  const displayValueSettings = {\\n    showValueLabel,\\n    isAlternatingValueLabel,\\n    overflowConstraints,\\n  };\\n\\n  const debug = boolean('debug', false);\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: Number(number('value font size', 10)),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: 0,\\n        fill: color('value color', '#000'),\\n        offsetX: Number(number('offsetX', 0)),\\n        offsetY: Number(number('offsetY', 0)),\\n      },\\n    },\\n  };\\n\\n  const dataSize = select(\\n    'data volume size',\\n    {\\n      'small volume': 's',\\n      'medium volume': 'm',\\n      'high volume': 'h',\\n    },\\n    's',\\n  );\\n  const data = frozenData[dataSize];\\n\\n  const isSplitSeries = boolean('split series', false);\\n  const isStackedSeries = boolean('stacked series', false);\\n\\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n        rotation={customKnobs.enum.rotation()}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position('legend')}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n      />\\n      {!singleSeries && (\\n        <BarSeries\\n          id=\\\"bars2\\\"\\n          displayValueSettings={displayValueSettings}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={['x']}\\n          splitSeriesAccessors={['g']}\\n          data={[\\n            { x: 0, y: 2, g: 'a' },\\n            { x: 1, y: 7, g: 'a' },\\n            { x: 2, y: 3, g: 'a' },\\n            { x: 3, y: 6, g: 'a' },\\n            { x: 0, y: 4, g: 'b' },\\n            { x: 1, y: 5, g: 'b' },\\n            { x: 2, y: 8, g: 'b' },\\n            { x: 3, y: 2, g: 'b' },\\n          ]}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":43},\"endLoc\":{\"col\":1,\"line\":142},\"startBody\":{\"col\":36,\"line\":43},\"endBody\":{\"col\":1,\"line\":142}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  DisplayValueSpec,\n  LabelOverflowConstraint,\n  Position,\n  ScaleType,\n  Settings,\n  PartialTheme,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dataGen = new SeededDataGenerator();\nfunction generateDataWithAdditional(num: number) {\n  return [...dataGen.generateSimpleSeries(num), { x: num, y: 0.25, g: 0 }, { x: num + 1, y: 8, g: 0 }];\n}\nconst frozenDataSmallVolume = generateDataWithAdditional(5);\nconst frozenDataMediumVolume = generateDataWithAdditional(30);\nconst frozenDataHighVolume = generateDataWithAdditional(500);\n\nconst frozenData: { [key: string]: any[] } = {\n  s: frozenDataSmallVolume,\n  m: frozenDataMediumVolume,\n  h: frozenDataHighVolume,\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const singleSeries = boolean('show single series', false);\n  const showValueLabel = boolean('show value label', true);\n  const isAlternatingValueLabel = boolean('alternating value label', false);\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\n  if (overflowChartEdges) {\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\n  }\n  if (overflowBarGeometry) {\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\n  }\n  const displayValueSettings = {\n    showValueLabel,\n    isAlternatingValueLabel,\n    overflowConstraints,\n  };\n\n  const debug = boolean('debug', false);\n\n  const theme: PartialTheme = {\n    barSeriesStyle: {\n      displayValue: {\n        fontSize: Number(number('value font size', 10)),\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        fontStyle: 'normal',\n        padding: 0,\n        fill: color('value color', '#000'),\n        offsetX: Number(number('offsetX', 0)),\n        offsetY: Number(number('offsetY', 0)),\n      },\n    },\n  };\n\n  const dataSize = select(\n    'data volume size',\n    {\n      'small volume': 's',\n      'medium volume': 'm',\n      'high volume': 'h',\n    },\n    's',\n  );\n  const data = frozenData[dataSize];\n\n  const isSplitSeries = boolean('split series', false);\n  const isStackedSeries = boolean('stacked series', false);\n\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={debug}\n        rotation={customKnobs.enum.rotation()}\n        showLegend\n        showLegendExtra\n        legendPosition={customKnobs.enum.position('legend')}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        displayValueSettings={displayValueSettings}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={splitSeriesAccessors}\n        stackAccessors={stackAccessors}\n        data={data}\n      />\n      {!singleSeries && (\n        <BarSeries\n          id=\"bars2\"\n          displayValueSettings={displayValueSettings}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          stackAccessors={['x']}\n          splitSeriesAccessors={['g']}\n          data={[\n            { x: 0, y: 2, g: 'a' },\n            { x: 1, y: 7, g: 'a' },\n            { x: 2, y: 3, g: 'a' },\n            { x: 3, y: 6, g: 'a' },\n            { x: 0, y: 4, g: 'b' },\n            { x: 1, y: 5, g: 'b' },\n            { x: 2, y: 8, g: 'b' },\n            { x: 3, y: 2, g: 'b' },\n          ]}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const singleSeries = boolean('show single series', false);\\n  const showValueLabel = boolean('show value label', true);\\n  const isAlternatingValueLabel = boolean('alternating value label', false);\\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\\n  if (overflowChartEdges) {\\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\\n  }\\n  if (overflowBarGeometry) {\\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\\n  }\\n  const displayValueSettings = {\\n    showValueLabel,\\n    isAlternatingValueLabel,\\n    overflowConstraints,\\n  };\\n\\n  const debug = boolean('debug', false);\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: Number(number('value font size', 10)),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: 0,\\n        fill: color('value color', '#000'),\\n        offsetX: Number(number('offsetX', 0)),\\n        offsetY: Number(number('offsetY', 0)),\\n      },\\n    },\\n  };\\n\\n  const dataSize = select(\\n    'data volume size',\\n    {\\n      'small volume': 's',\\n      'medium volume': 'm',\\n      'high volume': 'h',\\n    },\\n    's',\\n  );\\n  const data = frozenData[dataSize];\\n\\n  const isSplitSeries = boolean('split series', false);\\n  const isStackedSeries = boolean('stacked series', false);\\n\\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n        rotation={customKnobs.enum.rotation()}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position('legend')}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n      />\\n      {!singleSeries && (\\n        <BarSeries\\n          id=\\\"bars2\\\"\\n          displayValueSettings={displayValueSettings}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={['x']}\\n          splitSeriesAccessors={['g']}\\n          data={[\\n            { x: 0, y: 2, g: 'a' },\\n            { x: 1, y: 7, g: 'a' },\\n            { x: 2, y: 3, g: 'a' },\\n            { x: 3, y: 6, g: 'a' },\\n            { x: 0, y: 4, g: 'b' },\\n            { x: 1, y: 5, g: 'b' },\\n            { x: 2, y: 8, g: 'b' },\\n            { x: 3, y: 2, g: 'b' },\\n          ]}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fit = boolean('fit Y domain to data', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis\\n        id=\\\"left2\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 10, g: 'a' },\\n          { x: 0, y: 20, g: 'b' },\\n          { x: 0, y: 30, g: 'c' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fit = boolean('fit Y domain to data', true);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis\n        id=\"left2\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n        }}\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 10, g: 'a' },\n          { x: 0, y: 20, g: 'b' },\n          { x: 0, y: 30, g: 'c' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fit = boolean('fit Y domain to data', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis\\n        id=\\\"left2\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 10, g: 'a' },\\n          { x: 0, y: 20, g: 'b' },\\n          { x: 0, y: 30, g: 'c' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: -3, y: 1 },\\n        { x: 0, y: 4 },\\n        { x: -2, y: 2 },\\n        { x: 1, y: 3 },\\n        { x: 2, y: 2 },\\n        { x: -1, y: 3 },\\n        { x: 3, y: 1 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: -3, y: 1 },\n        { x: 0, y: 4 },\n        { x: -2, y: 2 },\n        { x: 1, y: 3 },\n        { x: 2, y: 2 },\n        { x: -1, y: 3 },\n        { x: 3, y: 1 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: -3, y: 1 },\\n        { x: 0, y: 4 },\\n        { x: -2, y: 2 },\\n        { x: 1, y: 3 },\\n        { x: 2, y: 2 },\\n        { x: -1, y: 3 },\\n        { x: 3, y: 1 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, DomainPaddingUnit, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { computeContinuousDataDomain } from '@elastic/charts/src/utils/domain';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst logDomains = (data: any[], customDomain: any) => {\\n  const dataY = data.map((d) => d.y);\\n  \\n  console.clear();\\n  console.log('data domain:', JSON.stringify(computeContinuousDataDomain(dataY, ScaleType.Linear, undefined)));\\n  console.log('computed domain:', JSON.stringify(computeContinuousDataDomain(dataY, ScaleType.Linear, customDomain)));\\n  \\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fit = boolean('fit Y domain to data', true);\\n  const constrainPadding = boolean('constrain padding', true);\\n  const nice = boolean('nice ticks', false);\\n  const padding = number('domain padding', 0);\\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.Domain);\\n  const mixed = [\\n    { x: 0, y: -4 },\\n    { x: 1, y: -3 },\\n    { x: 2, y: 2 },\\n    { x: 3, y: 1 },\\n  ];\\n\\n  const allPositive = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) }));\\n  const allNegative = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) * -1 }));\\n\\n  const dataChoice = select(\\n    'data',\\n    {\\n      mixed: 'mixed',\\n      allPositive: 'all positive',\\n      allNegative: 'all negative',\\n    },\\n    'all negative',\\n  );\\n  const [SeriesType] = customKnobs.enum.xySeries();\\n  const shouldLogDomains = boolean('console log domains', true);\\n\\n  let data;\\n  switch (dataChoice) {\\n    case 'all positive':\\n      data = allPositive;\\n      break;\\n    case 'all negative':\\n      data = allNegative;\\n      break;\\n    default:\\n      data = mixed;\\n  }\\n  const customDomain = { fit, padding, paddingUnit, constrainPadding, nice, min: NaN, max: NaN };\\n\\n  if (shouldLogDomains) {\\n    logDomains(data, customDomain);\\n  }\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={customDomain}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <SeriesType\\n        id=\\\"series\\\"\\n        yNice={nice}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":97},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":97}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, DomainPaddingUnit, Position, ScaleType, Settings } from '@elastic/charts';\nimport { computeContinuousDataDomain } from '@elastic/charts/src/utils/domain';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst logDomains = (data: any[], customDomain: any) => {\n  const dataY = data.map((d) => d.y);\n  /* eslint-disable no-console */\n  console.clear();\n  console.log('data domain:', JSON.stringify(computeContinuousDataDomain(dataY, ScaleType.Linear, undefined)));\n  console.log('computed domain:', JSON.stringify(computeContinuousDataDomain(dataY, ScaleType.Linear, customDomain)));\n  /* eslint-enable */\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fit = boolean('fit Y domain to data', true);\n  const constrainPadding = boolean('constrain padding', true);\n  const nice = boolean('nice ticks', false);\n  const padding = number('domain padding', 0);\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.Domain);\n  const mixed = [\n    { x: 0, y: -4 },\n    { x: 1, y: -3 },\n    { x: 2, y: 2 },\n    { x: 3, y: 1 },\n  ];\n\n  const allPositive = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) }));\n  const allNegative = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) * -1 }));\n\n  const dataChoice = select(\n    'data',\n    {\n      mixed: 'mixed',\n      allPositive: 'all positive',\n      allNegative: 'all negative',\n    },\n    'all negative',\n  );\n  const [SeriesType] = customKnobs.enum.xySeries();\n  const shouldLogDomains = boolean('console log domains', true);\n\n  let data;\n  switch (dataChoice) {\n    case 'all positive':\n      data = allPositive;\n      break;\n    case 'all negative':\n      data = allNegative;\n      break;\n    default:\n      data = mixed;\n  }\n  const customDomain = { fit, padding, paddingUnit, constrainPadding, nice, min: NaN, max: NaN };\n\n  if (shouldLogDomains) {\n    logDomains(data, customDomain);\n  }\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" />\n      <Axis\n        id=\"left\"\n        domain={customDomain}\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n\n      <SeriesType\n        id=\"series\"\n        yNice={nice}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fit = boolean('fit Y domain to data', true);\\n  const constrainPadding = boolean('constrain padding', true);\\n  const nice = boolean('nice ticks', false);\\n  const padding = number('domain padding', 0);\\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.Domain);\\n  const mixed = [\\n    { x: 0, y: -4 },\\n    { x: 1, y: -3 },\\n    { x: 2, y: 2 },\\n    { x: 3, y: 1 },\\n  ];\\n\\n  const allPositive = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) }));\\n  const allNegative = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) * -1 }));\\n\\n  const dataChoice = select(\\n    'data',\\n    {\\n      mixed: 'mixed',\\n      allPositive: 'all positive',\\n      allNegative: 'all negative',\\n    },\\n    'all negative',\\n  );\\n  const [SeriesType] = customKnobs.enum.xySeries();\\n  const shouldLogDomains = boolean('console log domains', true);\\n\\n  let data;\\n  switch (dataChoice) {\\n    case 'all positive':\\n      data = allPositive;\\n      break;\\n    case 'all negative':\\n      data = allNegative;\\n      break;\\n    default:\\n      data = mixed;\\n  }\\n  const customDomain = { fit, padding, paddingUnit, constrainPadding, nice, min: NaN, max: NaN };\\n\\n  if (shouldLogDomains) {\\n    logDomains(data, customDomain);\\n  }\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={customDomain}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <SeriesType\\n        id=\\\"series\\\"\\n        yNice={nice}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm:ss');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const getRandomNumber = getRandomNumberGenerator();\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => ({\\n    x: d[0],\\n    max: d[1] + 4 + 4 * getRandomNumber(),\\n    min: d[1] - 4 - 4 * getRandomNumber(),\\n  }));\\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => [d[0], d[1]]);\\n  const fit = boolean('fit Y domain', true);\\n  const useFunctions = boolean('use fn accessors', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={[useFunctions ? (d) => d.max : 'max']}\\n        y0Accessors={[useFunctions ? (d) => d.min : 'min']}\\n        data={data}\\n      />\\n\\n      <LineSeries\\n        id=\\\"average\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={lineData}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm:ss');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const getRandomNumber = getRandomNumberGenerator();\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => ({\n    x: d[0],\n    max: d[1] + 4 + 4 * getRandomNumber(),\n    min: d[1] - 4 - 4 * getRandomNumber(),\n  }));\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => [d[0], d[1]]);\n  const fit = boolean('fit Y domain', true);\n  const useFunctions = boolean('use fn accessors', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"timestamp per 1 minute\"\n        position={Position.Bottom}\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis\n        id=\"left\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n        }}\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={[useFunctions ? (d) => d.max : 'max']}\n        y0Accessors={[useFunctions ? (d) => d.min : 'min']}\n        data={data}\n      />\n\n      <LineSeries\n        id=\"average\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={lineData}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const getRandomNumber = getRandomNumberGenerator();\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => ({\\n    x: d[0],\\n    max: d[1] + 4 + 4 * getRandomNumber(),\\n    min: d[1] - 4 - 4 * getRandomNumber(),\\n  }));\\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => [d[0], d[1]]);\\n  const fit = boolean('fit Y domain', true);\\n  const useFunctions = boolean('use fn accessors', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={[useFunctions ? (d) => d.max : 'max']}\\n        y0Accessors={[useFunctions ? (d) => d.min : 'min']}\\n        data={data}\\n      />\\n\\n      <LineSeries\\n        id=\\\"average\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={lineData}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm:ss');\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1],\\n    [start.plus({ minute: 1 }).toMillis(), 2],\\n    [start.plus({ minute: 2 }).toMillis(), 3],\\n    [start.plus({ minute: 3 }).toMillis(), 4],\\n    [start.plus({ minute: 4 }).toMillis(), 5],\\n    [start.plus({ minute: 5 }).toMillis(), 4],\\n    [start.plus({ minute: 6 }).toMillis(), 3],\\n    [start.plus({ minute: 7 }).toMillis(), 2],\\n    [start.plus({ minute: 8 }).toMillis(), 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm:ss');\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data = [\n    [start.toMillis(), 1],\n    [start.plus({ minute: 1 }).toMillis(), 2],\n    [start.plus({ minute: 2 }).toMillis(), 3],\n    [start.plus({ minute: 3 }).toMillis(), 4],\n    [start.plus({ minute: 4 }).toMillis(), 5],\n    [start.plus({ minute: 5 }).toMillis(), 4],\n    [start.plus({ minute: 6 }).toMillis(), 3],\n    [start.plus({ minute: 7 }).toMillis(), 2],\n    [start.plus({ minute: 8 }).toMillis(), 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"data\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1],\\n    [start.plus({ minute: 1 }).toMillis(), 2],\\n    [start.plus({ minute: 2 }).toMillis(), 3],\\n    [start.plus({ minute: 3 }).toMillis(), 4],\\n    [start.plus({ minute: 4 }).toMillis(), 5],\\n    [start.plus({ minute: 5 }).toMillis(), 4],\\n    [start.plus({ minute: 6 }).toMillis(), 3],\\n    [start.plus({ minute: 7 }).toMillis(), 2],\\n    [start.plus({ minute: 8 }).toMillis(), 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data9 = [\\n    [1, 1, 3],\\n    [2, 2, 4],\\n    [3, 3, 5],\\n    [4, 4, 6],\\n    [5, 5, 7],\\n    [6, 4, 6],\\n    [7, 3, 5],\\n    [8, 2, 4],\\n    [9, 1, 3],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1, 2]}\\n        data={data9}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data9 = [\n    [1, 1, 3],\n    [2, 2, 4],\n    [3, 3, 5],\n    [4, 4, 6],\n    [5, 5, 7],\n    [6, 4, 6],\n    [7, 3, 5],\n    [8, 2, 4],\n    [9, 1, 3],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1, 2]}\n        data={data9}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data9 = [\\n    [1, 1, 3],\\n    [2, 2, 4],\\n    [3, 3, 5],\\n    [4, 4, 6],\\n    [5, 5, 7],\\n    [6, 4, 6],\\n    [7, 3, 5],\\n    [8, 2, 4],\\n    [9, 1, 3],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1, 2]}\\n        data={data9}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm:ss');\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1, 2]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm:ss');\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data = [\n    [start.toMillis(), 1, 4],\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"data\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1, 2]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1, 2]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    [1, 1, 3, 'a'],\\n    [2, null, 4, 'a'],\\n    [3, 3, 5, 'a'],\\n    [4, 4, 6, 'a'],\\n    [1, 1, 3, 'b'],\\n    [2, 2, 4, 'b'],\\n    [3, 3, 5, 'b'],\\n    [4, 4, 6, 'b'],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[3]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    [1, 1, 3, 'a'],\n    [2, null, 4, 'a'],\n    [3, 3, 5, 'a'],\n    [4, 4, 6, 'a'],\n    [1, 1, 3, 'b'],\n    [2, 2, 4, 'b'],\n    [3, 3, 5, 'b'],\n    [4, 4, 6, 'b'],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        splitSeriesAccessors={[3]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    [1, 1, 3, 'a'],\\n    [2, null, 4, 'a'],\\n    [3, 3, 5, 'a'],\\n    [4, 4, 6, 'a'],\\n    [1, 1, 3, 'b'],\\n    [2, 2, 4, 'b'],\\n    [3, 3, 5, 'b'],\\n    [4, 4, 6, 'b'],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[3]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, StackMode } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    [1, 1, 3, 'a'],\\n    [2, null, 4, 'a'],\\n    [3, 3, 5, 'a'],\\n    [4, 4, 6, 'a'],\\n    [1, 1, 3, 'b'],\\n    [2, 2, 4, 'b'],\\n    [3, null, 5, 'b'],\\n    [4, 4, 6, 'b'],\\n  ];\\n  const stackMode = boolean('stack as percentage', false) ? StackMode.Percentage : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[3]}\\n        stackAccessors={[0]}\\n        stackMode={stackMode}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, StackMode } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    [1, 1, 3, 'a'],\n    [2, null, 4, 'a'],\n    [3, 3, 5, 'a'],\n    [4, 4, 6, 'a'],\n    [1, 1, 3, 'b'],\n    [2, 2, 4, 'b'],\n    [3, null, 5, 'b'],\n    [4, 4, 6, 'b'],\n  ];\n  const stackMode = boolean('stack as percentage', false) ? StackMode.Percentage : undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        splitSeriesAccessors={[3]}\n        stackAccessors={[0]}\n        stackMode={stackMode}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    [1, 1, 3, 'a'],\\n    [2, null, 4, 'a'],\\n    [3, 3, 5, 'a'],\\n    [4, 4, 6, 'a'],\\n    [1, 1, 3, 'b'],\\n    [2, 2, 4, 'b'],\\n    [3, null, 5, 'b'],\\n    [4, 4, 6, 'b'],\\n  ];\\n  const stackMode = boolean('stack as percentage', false) ? StackMode.Percentage : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[3]}\\n        stackAccessors={[0]}\\n        stackMode={stackMode}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":38},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":38}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={select(\\n        'scaleType',\\n        {\\n          linear: ScaleType.Linear,\\n          ordinal: ScaleType.Ordinal,\\n        },\\n        ScaleType.Linear,\\n      )}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        // the data is not sorted to verify that the ordinal scale keeps the sorting and the labels are\\n        // correctly aligned see https://github.com/elastic/elastic-charts/issues/1608\\n        { x: 3, y: 6 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 0, y: 2 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={select(\n        'scaleType',\n        {\n          linear: ScaleType.Linear,\n          ordinal: ScaleType.Ordinal,\n        },\n        ScaleType.Linear,\n      )}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        // the data is not sorted to verify that the ordinal scale keeps the sorting and the labels are\n        // correctly aligned see https://github.com/elastic/elastic-charts/issues/1608\n        { x: 3, y: 6 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 0, y: 2 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={select(\\n        'scaleType',\\n        {\\n          linear: ScaleType.Linear,\\n          ordinal: ScaleType.Ordinal,\\n        },\\n        ScaleType.Linear,\\n      )}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        // the data is not sorted to verify that the ordinal scale keeps the sorting and the labels are\\n        // correctly aligned see https://github.com/elastic/elastic-charts/issues/1608\\n        { x: 3, y: 6 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 0, y: 2 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  AreaSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  HistogramBarSeries,\\n  HistogramModeAlignments,\\n  LineAnnotation,\\n  LineSeries,\\n  PartialTheme,\\n  Position,\\n  RectAnnotation,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = TestDatasets.BARCHART_2Y1G;\\n\\n  const lineAnnotationStyle = {\\n    line: {\\n      strokeWidth: 2,\\n      stroke: '#c80000',\\n      opacity: 0.3,\\n    },\\n  };\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n      histogramPadding: number('histogram padding', 0.05, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const otherSeriesSelection = select(\\n    'other series',\\n    {\\n      line: 'line',\\n      area: 'area',\\n    },\\n    'line',\\n  );\\n\\n  const pointAlignment = select('point series alignment', HistogramModeAlignments, HistogramModeAlignments.Center);\\n  const pointData = TestDatasets.BARCHART_1Y0G;\\n\\n  const otherSeries =\\n    otherSeriesSelection === 'line' ? (\\n      <LineSeries\\n        id=\\\"other-series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={pointData}\\n        histogramModeAlignment={pointAlignment}\\n      />\\n    ) : (\\n      <AreaSeries\\n        id=\\\"other-series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={pointData}\\n        histogramModeAlignment={pointAlignment}\\n      />\\n    );\\n\\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\\n  const stacked = boolean('stacked', true);\\n  const stackAccessors = stacked ? ['yes'] : [];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        theme={theme}\\n        debug={boolean('debug', true)}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <LineAnnotation\\n        id=\\\"line-annotation\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={[{ dataValue: 2 }, { dataValue: 2.5 }, { dataValue: 3.5 }]}\\n        style={lineAnnotationStyle}\\n        marker={<div style={{ background: 'red', width: 10, height: 10 }} />}\\n      />\\n      <RectAnnotation\\n        style={{\\n          fill: 'green',\\n        }}\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0.5,\\n            },\\n            details: 'min=0.5, max=max',\\n          },\\n        ]}\\n        id=\\\"rect1\\\"\\n      />\\n      <RectAnnotation\\n        style={{\\n          fill: 'red',\\n        }}\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x1: 3,\\n            },\\n            details: 'min=min, max=3',\\n          },\\n        ]}\\n        id=\\\"rect2\\\"\\n      />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title=\\\"left axis\\\" />\\n      <Axis id=\\\"discover-histogram-bottom-axis\\\" position={Position.Bottom} title=\\\"bottom axis\\\" />\\n      {hasHistogramBarSeries && (\\n        <HistogramBarSeries\\n          id=\\\"histo\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={stackAccessors}\\n          data={pointData}\\n          name=\\\"histogram\\\"\\n        />\\n      )}\\n      <BarSeries\\n        id=\\\"bars-1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stackAccessors}\\n        data={pointData}\\n        name=\\\"bars 1\\\"\\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\\n      />\\n      <BarSeries\\n        id=\\\"bars-2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\\n      />\\n      {otherSeries}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":183},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":183}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  AreaSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  HistogramBarSeries,\n  HistogramModeAlignments,\n  LineAnnotation,\n  LineSeries,\n  PartialTheme,\n  Position,\n  RectAnnotation,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = TestDatasets.BARCHART_2Y1G;\n\n  const lineAnnotationStyle = {\n    line: {\n      strokeWidth: 2,\n      stroke: '#c80000',\n      opacity: 0.3,\n    },\n  };\n\n  const theme: PartialTheme = {\n    scales: {\n      barsPadding: number('bars padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n      histogramPadding: number('histogram padding', 0.05, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n\n  const otherSeriesSelection = select(\n    'other series',\n    {\n      line: 'line',\n      area: 'area',\n    },\n    'line',\n  );\n\n  const pointAlignment = select('point series alignment', HistogramModeAlignments, HistogramModeAlignments.Center);\n  const pointData = TestDatasets.BARCHART_1Y0G;\n\n  const otherSeries =\n    otherSeriesSelection === 'line' ? (\n      <LineSeries\n        id=\"other-series\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={pointData}\n        histogramModeAlignment={pointAlignment}\n      />\n    ) : (\n      <AreaSeries\n        id=\"other-series\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={pointData}\n        histogramModeAlignment={pointAlignment}\n      />\n    );\n\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\n  const stacked = boolean('stacked', true);\n  const stackAccessors = stacked ? ['yes'] : [];\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        rotation={customKnobs.enum.rotation()}\n        theme={theme}\n        debug={boolean('debug', true)}\n        baseTheme={useBaseTheme()}\n      />\n      <LineAnnotation\n        id=\"line-annotation\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={[{ dataValue: 2 }, { dataValue: 2.5 }, { dataValue: 3.5 }]}\n        style={lineAnnotationStyle}\n        marker={<div style={{ background: 'red', width: 10, height: 10 }} />}\n      />\n      <RectAnnotation\n        style={{\n          fill: 'green',\n        }}\n        dataValues={[\n          {\n            coordinates: {\n              x0: 0.5,\n            },\n            details: 'min=0.5, max=max',\n          },\n        ]}\n        id=\"rect1\"\n      />\n      <RectAnnotation\n        style={{\n          fill: 'red',\n        }}\n        dataValues={[\n          {\n            coordinates: {\n              x1: 3,\n            },\n            details: 'min=min, max=3',\n          },\n        ]}\n        id=\"rect2\"\n      />\n      <Axis id=\"discover-histogram-left-axis\" position={Position.Left} title=\"left axis\" />\n      <Axis id=\"discover-histogram-bottom-axis\" position={Position.Bottom} title=\"bottom axis\" />\n      {hasHistogramBarSeries && (\n        <HistogramBarSeries\n          id=\"histo\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          stackAccessors={stackAccessors}\n          data={pointData}\n          name=\"histogram\"\n        />\n      )}\n      <BarSeries\n        id=\"bars-1\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stackAccessors}\n        data={pointData}\n        name=\"bars 1\"\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\n      />\n      <BarSeries\n        id=\"bars-2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={stackAccessors}\n        data={data}\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\n      />\n      {otherSeries}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = TestDatasets.BARCHART_2Y1G;\\n\\n  const lineAnnotationStyle = {\\n    line: {\\n      strokeWidth: 2,\\n      stroke: '#c80000',\\n      opacity: 0.3,\\n    },\\n  };\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n      histogramPadding: number('histogram padding', 0.05, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const otherSeriesSelection = select(\\n    'other series',\\n    {\\n      line: 'line',\\n      area: 'area',\\n    },\\n    'line',\\n  );\\n\\n  const pointAlignment = select('point series alignment', HistogramModeAlignments, HistogramModeAlignments.Center);\\n  const pointData = TestDatasets.BARCHART_1Y0G;\\n\\n  const otherSeries =\\n    otherSeriesSelection === 'line' ? (\\n      <LineSeries\\n        id=\\\"other-series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={pointData}\\n        histogramModeAlignment={pointAlignment}\\n      />\\n    ) : (\\n      <AreaSeries\\n        id=\\\"other-series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={pointData}\\n        histogramModeAlignment={pointAlignment}\\n      />\\n    );\\n\\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\\n  const stacked = boolean('stacked', true);\\n  const stackAccessors = stacked ? ['yes'] : [];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        theme={theme}\\n        debug={boolean('debug', true)}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <LineAnnotation\\n        id=\\\"line-annotation\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={[{ dataValue: 2 }, { dataValue: 2.5 }, { dataValue: 3.5 }]}\\n        style={lineAnnotationStyle}\\n        marker={<div style={{ background: 'red', width: 10, height: 10 }} />}\\n      />\\n      <RectAnnotation\\n        style={{\\n          fill: 'green',\\n        }}\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0.5,\\n            },\\n            details: 'min=0.5, max=max',\\n          },\\n        ]}\\n        id=\\\"rect1\\\"\\n      />\\n      <RectAnnotation\\n        style={{\\n          fill: 'red',\\n        }}\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x1: 3,\\n            },\\n            details: 'min=min, max=3',\\n          },\\n        ]}\\n        id=\\\"rect2\\\"\\n      />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title=\\\"left axis\\\" />\\n      <Axis id=\\\"discover-histogram-bottom-axis\\\" position={Position.Bottom} title=\\\"bottom axis\\\" />\\n      {hasHistogramBarSeries && (\\n        <HistogramBarSeries\\n          id=\\\"histo\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={stackAccessors}\\n          data={pointData}\\n          name=\\\"histogram\\\"\\n        />\\n      )}\\n      <BarSeries\\n        id=\\\"bars-1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stackAccessors}\\n        data={pointData}\\n        name=\\\"bars 1\\\"\\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\\n      />\\n      <BarSeries\\n        id=\\\"bars-2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\\n      />\\n      {otherSeries}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  HistogramBarSeries,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    { x: 'a', y: 2 },\\n    { x: 'b', y: 7 },\\n    { x: 'c', y: 0 },\\n    { x: 'd', y: 6 },\\n  ];\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\\n  const stacked = boolean('stacked', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n      />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title=\\\"left axis\\\" />\\n      <Axis id=\\\"discover-histogram-bottom-axis\\\" position={Position.Bottom} title=\\\"bottom axis\\\" />\\n      {hasHistogramBarSeries && (\\n        <HistogramBarSeries\\n          id=\\\"histo\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={stacked ? ['y'] : []}\\n          data={data}\\n          name=\\\"histogram\\\"\\n        />\\n      )}\\n      <BarSeries\\n        id=\\\"bars-1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stacked ? ['y'] : []}\\n        data={data}\\n        name=\\\"bars 1\\\"\\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\\n      />\\n      <BarSeries\\n        id=\\\"bars-2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stacked ? ['y'] : []}\\n        data={data}\\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":93},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":93}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  HistogramBarSeries,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    { x: 'a', y: 2 },\n    { x: 'b', y: 7 },\n    { x: 'c', y: 0 },\n    { x: 'd', y: 6 },\n  ];\n  const theme: PartialTheme = {\n    scales: {\n      barsPadding: number('bars padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\n  const stacked = boolean('stacked', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        rotation={customKnobs.enum.rotation()}\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', true)}\n      />\n      <Axis id=\"discover-histogram-left-axis\" position={Position.Left} title=\"left axis\" />\n      <Axis id=\"discover-histogram-bottom-axis\" position={Position.Bottom} title=\"bottom axis\" />\n      {hasHistogramBarSeries && (\n        <HistogramBarSeries\n          id=\"histo\"\n          xScaleType={ScaleType.Ordinal}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          stackAccessors={stacked ? ['y'] : []}\n          data={data}\n          name=\"histogram\"\n        />\n      )}\n      <BarSeries\n        id=\"bars-1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stacked ? ['y'] : []}\n        data={data}\n        name=\"bars 1\"\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\n      />\n      <BarSeries\n        id=\"bars-2\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stacked ? ['y'] : []}\n        data={data}\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    { x: 'a', y: 2 },\\n    { x: 'b', y: 7 },\\n    { x: 'c', y: 0 },\\n    { x: 'd', y: 6 },\\n  ];\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\\n  const stacked = boolean('stacked', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n      />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title=\\\"left axis\\\" />\\n      <Axis id=\\\"discover-histogram-bottom-axis\\\" position={Position.Bottom} title=\\\"bottom axis\\\" />\\n      {hasHistogramBarSeries && (\\n        <HistogramBarSeries\\n          id=\\\"histo\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={stacked ? ['y'] : []}\\n          data={data}\\n          name=\\\"histogram\\\"\\n        />\\n      )}\\n      <BarSeries\\n        id=\\\"bars-1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stacked ? ['y'] : []}\\n        data={data}\\n        name=\\\"bars 1\\\"\\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\\n      />\\n      <BarSeries\\n        id=\\\"bars-2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stacked ? ['y'] : []}\\n        data={data}\\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  HistogramBarSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst TEST_DATASET_DISCOVER = {\\n  xAxisLabel: 'timestamp per 30 seconds',\\n  yAxisLabel: 'Count',\\n  series: [\\n    {\\n      x: 1560438420000,\\n      y: 1,\\n    },\\n    {\\n      x: 1560438510000,\\n      y: 1,\\n    },\\n  ],\\n};\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: NaN,\\n    minInterval: 30000,\\n  };\\n\\n  const useCustomMinInterval = boolean('use custom minInterval of 30s', true);\\n  const multiLayerAxis = boolean('use multilayer time axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={useCustomMinInterval ? xDomain : undefined} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title={TEST_DATASET_DISCOVER.yAxisLabel} />\\n      <Axis\\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\\n        id=\\\"discover-histogram-bottom-axis\\\"\\n        position={Position.Bottom}\\n        title={TEST_DATASET_DISCOVER.xAxisLabel}\\n        tickFormat={formatter}\\n        style={\\n          multiLayerAxis\\n            ? {\\n                tickLine: { size: 0.0001, padding: 4 },\\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\\n              }\\n            : {}\\n        }\\n      />\\n\\n      <HistogramBarSeries\\n        id=\\\"discover-histogram\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TEST_DATASET_DISCOVER.series}\\n        timeZone=\\\"local\\\"\\n        name=\\\"Count\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":85},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":85}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  HistogramBarSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst TEST_DATASET_DISCOVER = {\n  xAxisLabel: 'timestamp per 30 seconds',\n  yAxisLabel: 'Count',\n  series: [\n    {\n      x: 1560438420000,\n      y: 1,\n    },\n    {\n      x: 1560438510000,\n      y: 1,\n    },\n  ],\n};\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n\n  const xDomain = {\n    min: NaN,\n    max: NaN,\n    minInterval: 30000,\n  };\n\n  const useCustomMinInterval = boolean('use custom minInterval of 30s', true);\n  const multiLayerAxis = boolean('use multilayer time axis', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={useCustomMinInterval ? xDomain : undefined} baseTheme={useBaseTheme()} />\n      <Axis id=\"discover-histogram-left-axis\" position={Position.Left} title={TEST_DATASET_DISCOVER.yAxisLabel} />\n      <Axis\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\n        id=\"discover-histogram-bottom-axis\"\n        position={Position.Bottom}\n        title={TEST_DATASET_DISCOVER.xAxisLabel}\n        tickFormat={formatter}\n        style={\n          multiLayerAxis\n            ? {\n                tickLine: { size: 0.0001, padding: 4 },\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\n              }\n            : {}\n        }\n      />\n\n      <HistogramBarSeries\n        id=\"discover-histogram\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={TEST_DATASET_DISCOVER.series}\n        timeZone=\"local\"\n        name=\"Count\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: NaN,\\n    minInterval: 30000,\\n  };\\n\\n  const useCustomMinInterval = boolean('use custom minInterval of 30s', true);\\n  const multiLayerAxis = boolean('use multilayer time axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={useCustomMinInterval ? xDomain : undefined} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title={TEST_DATASET_DISCOVER.yAxisLabel} />\\n      <Axis\\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\\n        id=\\\"discover-histogram-bottom-axis\\\"\\n        position={Position.Bottom}\\n        title={TEST_DATASET_DISCOVER.xAxisLabel}\\n        tickFormat={formatter}\\n        style={\\n          multiLayerAxis\\n            ? {\\n                tickLine: { size: 0.0001, padding: 4 },\\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\\n              }\\n            : {}\\n        }\\n      />\\n\\n      <HistogramBarSeries\\n        id=\\\"discover-histogram\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TEST_DATASET_DISCOVER.series}\\n        timeZone=\\\"local\\\"\\n        name=\\\"Count\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  HistogramBarSeries,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useLine = boolean('use lines instead of bars', false);\\n  const multiLayerAxis = boolean('use multilayer time axis', false);\\n  const oddDomain = boolean('non-round time domain start', false);\\n\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n\\n  const binWidthMs = 60000;\\n\\n  const xDomain = {\\n    min: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] - (oddDomain ? 217839 : 0),\\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] + (oddDomain ? 200000 : 0 ?? binWidthMs - 1),\\n    minInterval: binWidthMs,\\n  };\\n\\n  const Series = useLine ? LineSeries : HistogramBarSeries;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks={!multiLayerAxis}\\n        tickFormat={formatter}\\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\\n        style={\\n          multiLayerAxis\\n            ? {\\n                tickLine: { size: 0.0001, padding: 4 },\\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\\n              }\\n            : {}\\n        }\\n      />\\n      <Axis id=\\\"left\\\" title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title} position={Position.Left} />\\n      <Series\\n        id=\\\"series\\\"\\n        timeZone=\\\"local\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 1)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":77},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":77}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  HistogramBarSeries,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useLine = boolean('use lines instead of bars', false);\n  const multiLayerAxis = boolean('use multilayer time axis', false);\n  const oddDomain = boolean('non-round time domain start', false);\n\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n\n  const binWidthMs = 60000;\n\n  const xDomain = {\n    min: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] - (oddDomain ? 217839 : 0),\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] + (oddDomain ? 200000 : 0 ?? binWidthMs - 1),\n    minInterval: binWidthMs,\n  };\n\n  const Series = useLine ? LineSeries : HistogramBarSeries;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={xDomain} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"timestamp per 1 minute\"\n        position={Position.Bottom}\n        showOverlappingTicks={!multiLayerAxis}\n        tickFormat={formatter}\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\n        style={\n          multiLayerAxis\n            ? {\n                tickLine: { size: 0.0001, padding: 4 },\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\n              }\n            : {}\n        }\n      />\n      <Axis id=\"left\" title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title} position={Position.Left} />\n      <Series\n        id=\"series\"\n        timeZone=\"local\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 1)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useLine = boolean('use lines instead of bars', false);\\n  const multiLayerAxis = boolean('use multilayer time axis', false);\\n  const oddDomain = boolean('non-round time domain start', false);\\n\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n\\n  const binWidthMs = 60000;\\n\\n  const xDomain = {\\n    min: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] - (oddDomain ? 217839 : 0),\\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] + (oddDomain ? 200000 : 0 ?? binWidthMs - 1),\\n    minInterval: binWidthMs,\\n  };\\n\\n  const Series = useLine ? LineSeries : HistogramBarSeries;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks={!multiLayerAxis}\\n        tickFormat={formatter}\\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\\n        style={\\n          multiLayerAxis\\n            ? {\\n                tickLine: { size: 0.0001, padding: 4 },\\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\\n              }\\n            : {}\\n        }\\n      />\\n      <Axis id=\\\"left\\\" title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title} position={Position.Left} />\\n      <Series\\n        id=\\\"series\\\"\\n        timeZone=\\\"local\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 1)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const minBarHeight = number('minBarHeight', 5);\\n  const data = [\\n    [1, 100000],\\n    [2, 10000],\\n    [3, 1000],\\n    [4, 100],\\n    [5, 10],\\n    [6, 1],\\n    [7, 0],\\n    [8, 1],\\n    [9, 0],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"Bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" title=\\\"Left\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        minBarHeight={minBarHeight}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const minBarHeight = number('minBarHeight', 5);\n  const data = [\n    [1, 100000],\n    [2, 10000],\n    [3, 1000],\n    [4, 100],\n    [5, 10],\n    [6, 1],\n    [7, 0],\n    [8, 1],\n    [9, 0],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"Bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" title=\"Left\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        minBarHeight={minBarHeight}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const minBarHeight = number('minBarHeight', 5);\\n  const data = [\\n    [1, 100000],\\n    [2, 10000],\\n    [3, 1000],\\n    [4, 100],\\n    [5, 10],\\n    [6, 1],\\n    [7, 0],\\n    [8, 1],\\n    [9, 0],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"Bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" title=\\\"Left\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        minBarHeight={minBarHeight}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const minBarHeight = number('minBarHeight', 10);\\n  const data = [\\n    [1, -100000],\\n    [2, -10000],\\n    [3, -1000],\\n    [4, -100],\\n    [5, -10],\\n    [6, -1],\\n    [7, 0],\\n    [8, -1],\\n    [9, 0],\\n    [10, 0],\\n    [11, 1],\\n    [12, 0],\\n    [13, 1],\\n    [14, 10],\\n    [15, 100],\\n    [16, 1000],\\n    [17, 10000],\\n    [18, 100000],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"Bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" title=\\\"Left\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        minBarHeight={minBarHeight}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":56},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":56}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const minBarHeight = number('minBarHeight', 10);\n  const data = [\n    [1, -100000],\n    [2, -10000],\n    [3, -1000],\n    [4, -100],\n    [5, -10],\n    [6, -1],\n    [7, 0],\n    [8, -1],\n    [9, 0],\n    [10, 0],\n    [11, 1],\n    [12, 0],\n    [13, 1],\n    [14, 10],\n    [15, 100],\n    [16, 1000],\n    [17, 10000],\n    [18, 100000],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"Bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" title=\"Left\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        minBarHeight={minBarHeight}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const minBarHeight = number('minBarHeight', 10);\\n  const data = [\\n    [1, -100000],\\n    [2, -10000],\\n    [3, -1000],\\n    [4, -100],\\n    [5, -10],\\n    [6, -1],\\n    [7, 0],\\n    [8, -1],\\n    [9, 0],\\n    [10, 0],\\n    [11, 1],\\n    [12, 0],\\n    [13, 1],\\n    [14, 10],\\n    [15, 100],\\n    [16, 1000],\\n    [17, 10000],\\n    [18, 100000],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"Bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" title=\\\"Left\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        minBarHeight={minBarHeight}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n    [5, 5],\\n    [6, 3],\\n    [7, 8],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 1],\\n    [7, 5],\\n    [8, 6],\\n    [9, 7],\\n  ];\\n  const data4 = [\\n    [1, 2],\\n    [2, 6],\\n    [3, 2],\\n    [4, 9],\\n    [5, 2],\\n    [6, 3],\\n    [7, 1],\\n    [8, 2],\\n    [9, 7],\\n  ];\\n  const data5 = [\\n    [1, 1],\\n    [2, 7],\\n    [3, 5],\\n    [4, 6],\\n    [5, 5],\\n    [6, 4],\\n    [7, 2],\\n    [8, 4],\\n    [9, 8],\\n  ];\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n        domain={{ min: 0, max: 15 }}\\n      />\\n      <Axis\\n        id=\\\"left group b\\\"\\n        groupId=\\\"gb\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n        hide\\n        domain={{ min: 0, max: 15 }}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId=\\\"gb\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data4}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar B\\\"\\n        groupId=\\\"gb\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data5}\\n      />\\n      <BarSeries\\n        id=\\\"non stacked bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":142},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":142}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 2],\n    [2, 2],\n    [3, 3],\n    [4, 5],\n    [5, 5],\n    [6, 3],\n    [7, 8],\n    [8, 2],\n    [9, 1],\n  ];\n  const data2 = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 4],\n  ];\n  const data3 = [\n    [1, 6],\n    [2, 6],\n    [3, 3],\n    [4, 2],\n    [5, 1],\n    [6, 1],\n    [7, 5],\n    [8, 6],\n    [9, 7],\n  ];\n  const data4 = [\n    [1, 2],\n    [2, 6],\n    [3, 2],\n    [4, 9],\n    [5, 2],\n    [6, 3],\n    [7, 1],\n    [8, 2],\n    [9, 7],\n  ];\n  const data5 = [\n    [1, 1],\n    [2, 7],\n    [3, 5],\n    [4, 6],\n    [5, 5],\n    [6, 4],\n    [7, 2],\n    [8, 4],\n    [9, 8],\n  ];\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n        domain={{ min: 0, max: 15 }}\n      />\n      <Axis\n        id=\"left group b\"\n        groupId=\"gb\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n        hide\n        domain={{ min: 0, max: 15 }}\n      />\n      <BarSeries\n        id=\"stacked bar 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data1}\n      />\n      <BarSeries\n        id=\"stacked bar 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data2}\n      />\n\n      <BarSeries\n        id=\"stacked bar A\"\n        groupId=\"gb\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data4}\n      />\n      <BarSeries\n        id=\"stacked bar B\"\n        groupId=\"gb\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data5}\n      />\n      <BarSeries\n        id=\"non stacked bar\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n    [5, 5],\\n    [6, 3],\\n    [7, 8],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 1],\\n    [7, 5],\\n    [8, 6],\\n    [9, 7],\\n  ];\\n  const data4 = [\\n    [1, 2],\\n    [2, 6],\\n    [3, 2],\\n    [4, 9],\\n    [5, 2],\\n    [6, 3],\\n    [7, 1],\\n    [8, 2],\\n    [9, 7],\\n  ];\\n  const data5 = [\\n    [1, 1],\\n    [2, 7],\\n    [3, 5],\\n    [4, 6],\\n    [5, 5],\\n    [6, 4],\\n    [7, 2],\\n    [8, 4],\\n    [9, 8],\\n  ];\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n        domain={{ min: 0, max: 15 }}\\n      />\\n      <Axis\\n        id=\\\"left group b\\\"\\n        groupId=\\\"gb\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n        hide\\n        domain={{ min: 0, max: 15 }}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId=\\\"gb\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data4}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar B\\\"\\n        groupId=\\\"gb\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data5}\\n      />\\n      <BarSeries\\n        id=\\\"non stacked bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip, TooltipProps } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst CustomTooltip = () => (\\n  <div\\n    style={{\\n      padding: 10,\\n      height: 40,\\n      backgroundColor: 'blue',\\n      color: 'white',\\n    }}\\n  >\\n    My Custom Tooltip\\n  </div>\\n);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const tooltipOptions: TooltipProps = {\\n    stickTo: customKnobs.enum.stickTo('stickTo'),\\n    placement: customKnobs.enum.placement('Tooltip placement'),\\n    fallbackPlacements: customKnobs.enum.fallbackPlacements(),\\n    type: customKnobs.enum.tooltipType(),\\n    boundary: customKnobs.enum.boundary(),\\n    customTooltip: boolean('Custom Tooltip', false) ? CustomTooltip : undefined,\\n    offset: number('Tooltip offset', 10, { min: 0, max: 20, range: true, step: 1 }),\\n  };\\n  const showAxes = boolean('Show axes', false);\\n  const showLegend = boolean('Show Legend', false);\\n\\n  // Added buffer to test tooltip positioning within chart container\\n  return (\\n    <div className=\\\"buffer\\\" style={{ width: '100%', height: '100%', paddingLeft: 80, paddingRight: 80 }}>\\n      <Chart title={title} description={description}>\\n        <Settings rotation={rotation} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n        <Tooltip {...tooltipOptions} />\\n\\n        <Axis id=\\\"bottom\\\" hide={!showAxes} position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n        <Axis\\n          id=\\\"left2\\\"\\n          hide={!showAxes}\\n          title=\\\"Left axis\\\"\\n          position={Position.Left}\\n          tickFormat={(d: any) => Number(d).toFixed(2)}\\n        />\\n\\n        <BarSeries\\n          id=\\\"bars1\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y1', 'y2']}\\n          splitSeriesAccessors={['g']}\\n          data={TestDatasets.BARCHART_2Y1G}\\n        />\\n      </Chart>\\n    </div>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip, TooltipProps } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst CustomTooltip = () => (\n  <div\n    style={{\n      padding: 10,\n      height: 40,\n      backgroundColor: 'blue',\n      color: 'white',\n    }}\n  >\n    My Custom Tooltip\n  </div>\n);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rotation = customKnobs.enum.rotation();\n  const tooltipOptions: TooltipProps = {\n    stickTo: customKnobs.enum.stickTo('stickTo'),\n    placement: customKnobs.enum.placement('Tooltip placement'),\n    fallbackPlacements: customKnobs.enum.fallbackPlacements(),\n    type: customKnobs.enum.tooltipType(),\n    boundary: customKnobs.enum.boundary(),\n    customTooltip: boolean('Custom Tooltip', false) ? CustomTooltip : undefined,\n    offset: number('Tooltip offset', 10, { min: 0, max: 20, range: true, step: 1 }),\n  };\n  const showAxes = boolean('Show axes', false);\n  const showLegend = boolean('Show Legend', false);\n\n  // Added buffer to test tooltip positioning within chart container\n  return (\n    <div className=\"buffer\" style={{ width: '100%', height: '100%', paddingLeft: 80, paddingRight: 80 }}>\n      <Chart title={title} description={description}>\n        <Settings rotation={rotation} showLegend={showLegend} baseTheme={useBaseTheme()} />\n        <Tooltip {...tooltipOptions} />\n\n        <Axis id=\"bottom\" hide={!showAxes} position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n        <Axis\n          id=\"left2\"\n          hide={!showAxes}\n          title=\"Left axis\"\n          position={Position.Left}\n          tickFormat={(d: any) => Number(d).toFixed(2)}\n        />\n\n        <BarSeries\n          id=\"bars1\"\n          xScaleType={ScaleType.Ordinal}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y1', 'y2']}\n          splitSeriesAccessors={['g']}\n          data={TestDatasets.BARCHART_2Y1G}\n        />\n      </Chart>\n    </div>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const tooltipOptions: TooltipProps = {\\n    stickTo: customKnobs.enum.stickTo('stickTo'),\\n    placement: customKnobs.enum.placement('Tooltip placement'),\\n    fallbackPlacements: customKnobs.enum.fallbackPlacements(),\\n    type: customKnobs.enum.tooltipType(),\\n    boundary: customKnobs.enum.boundary(),\\n    customTooltip: boolean('Custom Tooltip', false) ? CustomTooltip : undefined,\\n    offset: number('Tooltip offset', 10, { min: 0, max: 20, range: true, step: 1 }),\\n  };\\n  const showAxes = boolean('Show axes', false);\\n  const showLegend = boolean('Show Legend', false);\\n\\n  // Added buffer to test tooltip positioning within chart container\\n  return (\\n    <div className=\\\"buffer\\\" style={{ width: '100%', height: '100%', paddingLeft: 80, paddingRight: 80 }}>\\n      <Chart title={title} description={description}>\\n        <Settings rotation={rotation} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n        <Tooltip {...tooltipOptions} />\\n\\n        <Axis id=\\\"bottom\\\" hide={!showAxes} position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n        <Axis\\n          id=\\\"left2\\\"\\n          hide={!showAxes}\\n          title=\\\"Left axis\\\"\\n          position={Position.Left}\\n          tickFormat={(d: any) => Number(d).toFixed(2)}\\n        />\\n\\n        <BarSeries\\n          id=\\\"bars1\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y1', 'y2']}\\n          splitSeriesAccessors={['g']}\\n          data={TestDatasets.BARCHART_2Y1G}\\n        />\\n      </Chart>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const stack13 = boolean('Stack bars1 and bars3', true);\\n  const stack24 = boolean('Stack bars2 and bars4', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"count1\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"count2\\\" groupId=\\\"2\\\" title=\\\"count\\\" position={Position.Right} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        groupId=\\\"2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack13 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 252 },\\n          { x: 'watches', y: 499 },\\n          { x: 'bags', y: 489 },\\n          { x: 'cocktail dresses', y: 391 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack24 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 390 },\\n          { x: 'watches', y: 23 },\\n          { x: 'bags', y: 750 },\\n          { x: 'cocktail dresses', y: 853 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars3\\\"\\n        groupId=\\\"2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack13 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 39 },\\n          { x: 'watches', y: 2 },\\n          { x: 'bags', y: 75 },\\n          { x: 'cocktail dresses', y: 150 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars4\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack24 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 39 },\\n          { x: 'watches', y: 2 },\\n          { x: 'bags', y: 75 },\\n          { x: 'cocktail dresses', y: 150 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":85},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":85}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const stack13 = boolean('Stack bars1 and bars3', true);\n  const stack24 = boolean('Stack bars2 and bars4', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend baseTheme={useBaseTheme()} />\n      <Axis id=\"count1\" title=\"count\" position={Position.Left} />\n      <Axis id=\"count2\" groupId=\"2\" title=\"count\" position={Position.Right} />\n      <Axis id=\"x\" title=\"goods\" position={Position.Bottom} />\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        groupId=\"2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stack13 ? ['y'] : undefined}\n        data={[\n          { x: 'trousers', y: 252 },\n          { x: 'watches', y: 499 },\n          { x: 'bags', y: 489 },\n          { x: 'cocktail dresses', y: 391 },\n        ]}\n      />\n\n      <BarSeries\n        id=\"bars2\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stack24 ? ['y'] : undefined}\n        data={[\n          { x: 'trousers', y: 390 },\n          { x: 'watches', y: 23 },\n          { x: 'bags', y: 750 },\n          { x: 'cocktail dresses', y: 853 },\n        ]}\n      />\n\n      <BarSeries\n        id=\"bars3\"\n        groupId=\"2\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stack13 ? ['y'] : undefined}\n        data={[\n          { x: 'trousers', y: 39 },\n          { x: 'watches', y: 2 },\n          { x: 'bags', y: 75 },\n          { x: 'cocktail dresses', y: 150 },\n        ]}\n      />\n\n      <BarSeries\n        id=\"bars4\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stack24 ? ['y'] : undefined}\n        data={[\n          { x: 'trousers', y: 39 },\n          { x: 'watches', y: 2 },\n          { x: 'bags', y: 75 },\n          { x: 'cocktail dresses', y: 150 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const stack13 = boolean('Stack bars1 and bars3', true);\\n  const stack24 = boolean('Stack bars2 and bars4', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"count1\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"count2\\\" groupId=\\\"2\\\" title=\\\"count\\\" position={Position.Right} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        groupId=\\\"2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack13 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 252 },\\n          { x: 'watches', y: 499 },\\n          { x: 'bags', y: 489 },\\n          { x: 'cocktail dresses', y: 391 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack24 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 390 },\\n          { x: 'watches', y: 23 },\\n          { x: 'bags', y: 750 },\\n          { x: 'cocktail dresses', y: 853 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars3\\\"\\n        groupId=\\\"2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack13 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 39 },\\n          { x: 'watches', y: 2 },\\n          { x: 'bags', y: 75 },\\n          { x: 'cocktail dresses', y: 150 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars4\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack24 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 39 },\\n          { x: 'watches', y: 2 },\\n          { x: 'bags', y: 75 },\\n          { x: 'cocktail dresses', y: 150 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 2 },\\n        { x: 'b', y: 7 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":36},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":36}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 2 },\n        { x: 'b', y: 7 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 2 },\\n        { x: 'b', y: 7 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, BinAgg, Direction } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst data = [\\n  { x1: 'b', x2: 2, g1: 'false', g2: 'Canada', y1: 19, y2: 22 },\\n  { x1: 'd', x2: 4, g1: 'false', g2: 'USA', y1: 34, y2: 21 },\\n  { x1: 'd', x2: 4, g1: 'true', g2: 'USA', y1: 49, y2: 169 },\\n  { x1: 'e', x2: 5, g1: 'false', g2: 'Canada', y1: 40, y2: 77 },\\n  { x1: 'b', x2: 2, g1: 'true', g2: 'USA', y1: 28, y2: 84 },\\n  { x1: 'a', x2: 1, g1: 'false', g2: 'USA', y1: 53, y2: 39 },\\n  { x1: 'a', x2: 1, g1: 'true', g2: 'Canada', y1: 93, y2: 42 },\\n  { x1: 'c', x2: 3, g1: 'true', g2: 'USA', y1: 55, y2: 72 },\\n  { x1: 'e', x2: 5, g1: 'true', g2: 'Canada', y1: 96, y2: 74 },\\n  { x1: 'c', x2: 3, g1: 'false', g2: 'Canada', y1: 87, y2: 39 },\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\\n  const dataType = select(\\n    'Data type',\\n    {\\n      linear: 'linear',\\n      ordinal: 'ordinal',\\n    },\\n    'ordinal',\\n  );\\n  const direction =\\n    select<Direction | undefined>(\\n      'Direction',\\n      {\\n        Ascending: Direction.Ascending,\\n        Descending: Direction.Descending,\\n        'Default (Descending)': undefined,\\n      },\\n      Direction.Descending,\\n    ) || undefined;\\n  const binAgg =\\n    select<BinAgg | undefined>(\\n      'BinAgg',\\n      {\\n        Sum: BinAgg.Sum,\\n        None: BinAgg.None,\\n        'Default (sum)': undefined,\\n      },\\n      BinAgg.Sum,\\n    ) || undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        orderOrdinalBinsBy={\\n          orderOrdinalBinsBy\\n            ? {\\n                direction,\\n                binAgg,\\n              }\\n            : undefined\\n        }\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={dataType === 'linear' ? ScaleType.Linear : ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={dataType === 'linear' ? 'x2' : 'x1'}\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        stackAccessors={['g1', 'g2']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, BinAgg, Direction } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst data = [\n  { x1: 'b', x2: 2, g1: 'false', g2: 'Canada', y1: 19, y2: 22 },\n  { x1: 'd', x2: 4, g1: 'false', g2: 'USA', y1: 34, y2: 21 },\n  { x1: 'd', x2: 4, g1: 'true', g2: 'USA', y1: 49, y2: 169 },\n  { x1: 'e', x2: 5, g1: 'false', g2: 'Canada', y1: 40, y2: 77 },\n  { x1: 'b', x2: 2, g1: 'true', g2: 'USA', y1: 28, y2: 84 },\n  { x1: 'a', x2: 1, g1: 'false', g2: 'USA', y1: 53, y2: 39 },\n  { x1: 'a', x2: 1, g1: 'true', g2: 'Canada', y1: 93, y2: 42 },\n  { x1: 'c', x2: 3, g1: 'true', g2: 'USA', y1: 55, y2: 72 },\n  { x1: 'e', x2: 5, g1: 'true', g2: 'Canada', y1: 96, y2: 74 },\n  { x1: 'c', x2: 3, g1: 'false', g2: 'Canada', y1: 87, y2: 39 },\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\n  const dataType = select(\n    'Data type',\n    {\n      linear: 'linear',\n      ordinal: 'ordinal',\n    },\n    'ordinal',\n  );\n  const direction =\n    select<Direction | undefined>(\n      'Direction',\n      {\n        Ascending: Direction.Ascending,\n        Descending: Direction.Descending,\n        'Default (Descending)': undefined,\n      },\n      Direction.Descending,\n    ) || undefined;\n  const binAgg =\n    select<BinAgg | undefined>(\n      'BinAgg',\n      {\n        Sum: BinAgg.Sum,\n        None: BinAgg.None,\n        'Default (sum)': undefined,\n      },\n      BinAgg.Sum,\n    ) || undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        orderOrdinalBinsBy={\n          orderOrdinalBinsBy\n            ? {\n                direction,\n                binAgg,\n              }\n            : undefined\n        }\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left2\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={dataType === 'linear' ? ScaleType.Linear : ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor={dataType === 'linear' ? 'x2' : 'x1'}\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        stackAccessors={['g1', 'g2']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\\n  const dataType = select(\\n    'Data type',\\n    {\\n      linear: 'linear',\\n      ordinal: 'ordinal',\\n    },\\n    'ordinal',\\n  );\\n  const direction =\\n    select<Direction | undefined>(\\n      'Direction',\\n      {\\n        Ascending: Direction.Ascending,\\n        Descending: Direction.Descending,\\n        'Default (Descending)': undefined,\\n      },\\n      Direction.Descending,\\n    ) || undefined;\\n  const binAgg =\\n    select<BinAgg | undefined>(\\n      'BinAgg',\\n      {\\n        Sum: BinAgg.Sum,\\n        None: BinAgg.None,\\n        'Default (sum)': undefined,\\n      },\\n      BinAgg.Sum,\\n    ) || undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        orderOrdinalBinsBy={\\n          orderOrdinalBinsBy\\n            ? {\\n                direction,\\n                binAgg,\\n              }\\n            : undefined\\n        }\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={dataType === 'linear' ? ScaleType.Linear : ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={dataType === 'linear' ? 'x2' : 'x1'}\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        stackAccessors={['g1', 'g2']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  DisplayValueSpec,\\n  LabelOverflowConstraint,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dataGen = new SeededDataGenerator();\\nfunction generateDataWithAdditional(num: number) {\\n  return [...dataGen.generateSimpleSeries(num), { x: num, y: 0.25, g: 0 }, { x: num + 1, y: 8, g: 0 }];\\n}\\nconst frozenDataSmallVolume = generateDataWithAdditional(10);\\nconst frozenDataMediumVolume = generateDataWithAdditional(50);\\nconst frozenDataHighVolume = generateDataWithAdditional(1500);\\n\\nconst frozenData: { [key: string]: any[] } = {\\n  s: frozenDataSmallVolume,\\n  m: frozenDataMediumVolume,\\n  h: frozenDataHighVolume,\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showValueLabel = boolean('show value label', true);\\n  const isAlternatingValueLabel = boolean('alternating value label', false);\\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\\n  if (overflowChartEdges) {\\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\\n  }\\n  if (overflowBarGeometry) {\\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\\n  }\\n  const displayValueSettings = {\\n    showValueLabel,\\n    isAlternatingValueLabel,\\n    overflowConstraints,\\n  };\\n\\n  const debug = boolean('debug', false);\\n  const useBorder = boolean('useBorder', false);\\n  const valueColor = color('value color', '#fff');\\n  const borderColor = color('value border color', 'rgba(0,0,0,1)');\\n  const borderSize = number('value border width', 1.5);\\n\\n  const fixedFontSize = number('Fixed font size', 10);\\n  const useFixedFontSize = boolean('Use fixed font size', false);\\n\\n  const maxFontSize = number('Max font size', 25);\\n  const minFontSize = number('Min font size', 10);\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: useFixedFontSize ? fixedFontSize : { max: maxFontSize, min: minFontSize },\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: 0,\\n        fill: useBorder ? { textBorder: borderSize } : { color: valueColor, borderColor, borderWidth: borderSize },\\n        offsetX: number('offsetX', 0),\\n        offsetY: number('offsetY', 0),\\n        alignment: {\\n          horizontal: select(\\n            'Horizontal alignment',\\n            {\\n              Default: undefined,\\n              Left: 'left',\\n              Center: 'center',\\n              Right: 'right',\\n            },\\n            undefined,\\n          ),\\n          vertical: select(\\n            'Vertical alignment',\\n            {\\n              Default: undefined,\\n              Top: 'top',\\n              Middle: 'middle',\\n              Bottom: 'bottom',\\n            },\\n            undefined,\\n          ),\\n        },\\n      },\\n    },\\n  };\\n\\n  const dataSize = select(\\n    'data volume size',\\n    {\\n      'small volume': 's',\\n      'medium volume': 'm',\\n      'high volume': 'h',\\n    },\\n    's',\\n  );\\n  const data = frozenData[dataSize];\\n\\n  const isSplitSeries = boolean('split series', false);\\n  const isStackedSeries = boolean('stacked series', false);\\n\\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n        rotation={customKnobs.enum.rotation()}\\n        showLegend\\n        showLegendExtra\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n      />\\n      <BarSeries\\n        id=\\\"bars2\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={[\\n          { x: 0, y: 2, g: 'a' },\\n          { x: 1, y: 7, g: 'a' },\\n          { x: 2, y: 3, g: 'a' },\\n          { x: 3, y: 6, g: 'a' },\\n          { x: 0, y: 4, g: 'b' },\\n          { x: 1, y: 5, g: 'b' },\\n          { x: 2, y: 8, g: 'b' },\\n          { x: 3, y: 2, g: 'b' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":43},\"endLoc\":{\"col\":1,\"line\":170},\"startBody\":{\"col\":36,\"line\":43},\"endBody\":{\"col\":1,\"line\":170}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  DisplayValueSpec,\n  LabelOverflowConstraint,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dataGen = new SeededDataGenerator();\nfunction generateDataWithAdditional(num: number) {\n  return [...dataGen.generateSimpleSeries(num), { x: num, y: 0.25, g: 0 }, { x: num + 1, y: 8, g: 0 }];\n}\nconst frozenDataSmallVolume = generateDataWithAdditional(10);\nconst frozenDataMediumVolume = generateDataWithAdditional(50);\nconst frozenDataHighVolume = generateDataWithAdditional(1500);\n\nconst frozenData: { [key: string]: any[] } = {\n  s: frozenDataSmallVolume,\n  m: frozenDataMediumVolume,\n  h: frozenDataHighVolume,\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showValueLabel = boolean('show value label', true);\n  const isAlternatingValueLabel = boolean('alternating value label', false);\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\n  if (overflowChartEdges) {\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\n  }\n  if (overflowBarGeometry) {\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\n  }\n  const displayValueSettings = {\n    showValueLabel,\n    isAlternatingValueLabel,\n    overflowConstraints,\n  };\n\n  const debug = boolean('debug', false);\n  const useBorder = boolean('useBorder', false);\n  const valueColor = color('value color', '#fff');\n  const borderColor = color('value border color', 'rgba(0,0,0,1)');\n  const borderSize = number('value border width', 1.5);\n\n  const fixedFontSize = number('Fixed font size', 10);\n  const useFixedFontSize = boolean('Use fixed font size', false);\n\n  const maxFontSize = number('Max font size', 25);\n  const minFontSize = number('Min font size', 10);\n\n  const theme: PartialTheme = {\n    barSeriesStyle: {\n      displayValue: {\n        fontSize: useFixedFontSize ? fixedFontSize : { max: maxFontSize, min: minFontSize },\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        fontStyle: 'normal',\n        padding: 0,\n        fill: useBorder ? { textBorder: borderSize } : { color: valueColor, borderColor, borderWidth: borderSize },\n        offsetX: number('offsetX', 0),\n        offsetY: number('offsetY', 0),\n        alignment: {\n          horizontal: select(\n            'Horizontal alignment',\n            {\n              Default: undefined,\n              Left: 'left',\n              Center: 'center',\n              Right: 'right',\n            },\n            undefined,\n          ),\n          vertical: select(\n            'Vertical alignment',\n            {\n              Default: undefined,\n              Top: 'top',\n              Middle: 'middle',\n              Bottom: 'bottom',\n            },\n            undefined,\n          ),\n        },\n      },\n    },\n  };\n\n  const dataSize = select(\n    'data volume size',\n    {\n      'small volume': 's',\n      'medium volume': 'm',\n      'high volume': 'h',\n    },\n    's',\n  );\n  const data = frozenData[dataSize];\n\n  const isSplitSeries = boolean('split series', false);\n  const isStackedSeries = boolean('stacked series', false);\n\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={debug}\n        rotation={customKnobs.enum.rotation()}\n        showLegend\n        showLegendExtra\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        displayValueSettings={displayValueSettings}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={splitSeriesAccessors}\n        stackAccessors={stackAccessors}\n        data={data}\n      />\n      <BarSeries\n        id=\"bars2\"\n        displayValueSettings={displayValueSettings}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={[\n          { x: 0, y: 2, g: 'a' },\n          { x: 1, y: 7, g: 'a' },\n          { x: 2, y: 3, g: 'a' },\n          { x: 3, y: 6, g: 'a' },\n          { x: 0, y: 4, g: 'b' },\n          { x: 1, y: 5, g: 'b' },\n          { x: 2, y: 8, g: 'b' },\n          { x: 3, y: 2, g: 'b' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showValueLabel = boolean('show value label', true);\\n  const isAlternatingValueLabel = boolean('alternating value label', false);\\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\\n  if (overflowChartEdges) {\\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\\n  }\\n  if (overflowBarGeometry) {\\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\\n  }\\n  const displayValueSettings = {\\n    showValueLabel,\\n    isAlternatingValueLabel,\\n    overflowConstraints,\\n  };\\n\\n  const debug = boolean('debug', false);\\n  const useBorder = boolean('useBorder', false);\\n  const valueColor = color('value color', '#fff');\\n  const borderColor = color('value border color', 'rgba(0,0,0,1)');\\n  const borderSize = number('value border width', 1.5);\\n\\n  const fixedFontSize = number('Fixed font size', 10);\\n  const useFixedFontSize = boolean('Use fixed font size', false);\\n\\n  const maxFontSize = number('Max font size', 25);\\n  const minFontSize = number('Min font size', 10);\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: useFixedFontSize ? fixedFontSize : { max: maxFontSize, min: minFontSize },\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: 0,\\n        fill: useBorder ? { textBorder: borderSize } : { color: valueColor, borderColor, borderWidth: borderSize },\\n        offsetX: number('offsetX', 0),\\n        offsetY: number('offsetY', 0),\\n        alignment: {\\n          horizontal: select(\\n            'Horizontal alignment',\\n            {\\n              Default: undefined,\\n              Left: 'left',\\n              Center: 'center',\\n              Right: 'right',\\n            },\\n            undefined,\\n          ),\\n          vertical: select(\\n            'Vertical alignment',\\n            {\\n              Default: undefined,\\n              Top: 'top',\\n              Middle: 'middle',\\n              Bottom: 'bottom',\\n            },\\n            undefined,\\n          ),\\n        },\\n      },\\n    },\\n  };\\n\\n  const dataSize = select(\\n    'data volume size',\\n    {\\n      'small volume': 's',\\n      'medium volume': 'm',\\n      'high volume': 'h',\\n    },\\n    's',\\n  );\\n  const data = frozenData[dataSize];\\n\\n  const isSplitSeries = boolean('split series', false);\\n  const isStackedSeries = boolean('stacked series', false);\\n\\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n        rotation={customKnobs.enum.rotation()}\\n        showLegend\\n        showLegendExtra\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n      />\\n      <BarSeries\\n        id=\\\"bars2\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={[\\n          { x: 0, y: 2, g: 'a' },\\n          { x: 1, y: 7, g: 'a' },\\n          { x: 2, y: 3, g: 'a' },\\n          { x: 3, y: 6, g: 'a' },\\n          { x: 0, y: 4, g: 'b' },\\n          { x: 1, y: 5, g: 'b' },\\n          { x: 2, y: 8, g: 'b' },\\n          { x: 3, y: 2, g: 'b' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Settings, Chart, Position, ScaleType } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n  ];\\n  const data4 = [\\n    [1, 2],\\n    [2, 6],\\n    [3, 2],\\n    [4, 9],\\n  ];\\n  const data5 = [\\n    [1, 1],\\n    [2, 7],\\n    [3, 5],\\n    [4, 6],\\n  ];\\n  const useDifferentGroup = boolean('Apply a different groupId to some series', false);\\n  const useDefaultDomain = boolean('Use the same data domain for each group', false);\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left y\\\"\\n        title=\\\"Default groupId\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <Axis\\n        id=\\\"right y\\\"\\n        groupId={useDifferentGroup && !useDefaultDomain ? 'otherGroupId' : undefined}\\n        title={useDifferentGroup ? 'Other groupId' : 'Default groupId'}\\n        position={Position.Right}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\\n        useDefaultGroupDomain={useDefaultDomain}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data4}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar B\\\"\\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\\n        useDefaultGroupDomain={useDefaultDomain}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data5}\\n      />\\n      <BarSeries\\n        id=\\\"non stacked bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `You can group together series specifying a \\\\`groupId\\\\` prop on the series.\\nIn the case of barchart, series with the same \\\\`groupId\\\\` will be grouped and eventually stacked together.\\n\\nThe data Y domain of each group, specified by \\\\`groupId\\\\`, is computed independently. This is reflected also on the rendering\\nwhere the Y value position is scaled independently on the Y axis from the other groups. An axis with the same \\\\`groupId\\\\`\\nwill reflect that scale.\\n\\nUse \\\\`useDefaultGroupDomain\\\\` if the same domain is required on every series. If you sent a \\\\`boolean\\\\` value, it will use\\nthe group id applied by default on every series with no specific groupId. You can also pass a \\\\`string\\\\` to use a different \\\\`groupId\\\\`\\nsee next storybook example.\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":119},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":119}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Settings, Chart, Position, ScaleType } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 2],\n    [2, 2],\n    [3, 3],\n    [4, 5],\n  ];\n  const data2 = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n  ];\n  const data3 = [\n    [1, 6],\n    [2, 6],\n    [3, 3],\n    [4, 2],\n  ];\n  const data4 = [\n    [1, 2],\n    [2, 6],\n    [3, 2],\n    [4, 9],\n  ];\n  const data5 = [\n    [1, 1],\n    [2, 7],\n    [3, 5],\n    [4, 6],\n  ];\n  const useDifferentGroup = boolean('Apply a different groupId to some series', false);\n  const useDefaultDomain = boolean('Use the same data domain for each group', false);\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis\n        id=\"left y\"\n        title=\"Default groupId\"\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <Axis\n        id=\"right y\"\n        groupId={useDifferentGroup && !useDefaultDomain ? 'otherGroupId' : undefined}\n        title={useDifferentGroup ? 'Other groupId' : 'Default groupId'}\n        position={Position.Right}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"stacked bar 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data1}\n      />\n      <BarSeries\n        id=\"stacked bar 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data2}\n      />\n\n      <BarSeries\n        id=\"stacked bar A\"\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\n        useDefaultGroupDomain={useDefaultDomain}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data4}\n      />\n      <BarSeries\n        id=\"stacked bar B\"\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\n        useDefaultGroupDomain={useDefaultDomain}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data5}\n      />\n      <BarSeries\n        id=\"non stacked bar\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can group together series specifying a \\`groupId\\` prop on the series.\nIn the case of barchart, series with the same \\`groupId\\` will be grouped and eventually stacked together.\n\nThe data Y domain of each group, specified by \\`groupId\\`, is computed independently. This is reflected also on the rendering\nwhere the Y value position is scaled independently on the Y axis from the other groups. An axis with the same \\`groupId\\`\nwill reflect that scale.\n\nUse \\`useDefaultGroupDomain\\` if the same domain is required on every series. If you sent a \\`boolean\\` value, it will use\nthe group id applied by default on every series with no specific groupId. You can also pass a \\`string\\` to use a different \\`groupId\\`\nsee next storybook example.\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n  ];\\n  const data4 = [\\n    [1, 2],\\n    [2, 6],\\n    [3, 2],\\n    [4, 9],\\n  ];\\n  const data5 = [\\n    [1, 1],\\n    [2, 7],\\n    [3, 5],\\n    [4, 6],\\n  ];\\n  const useDifferentGroup = boolean('Apply a different groupId to some series', false);\\n  const useDefaultDomain = boolean('Use the same data domain for each group', false);\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left y\\\"\\n        title=\\\"Default groupId\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <Axis\\n        id=\\\"right y\\\"\\n        groupId={useDifferentGroup && !useDefaultDomain ? 'otherGroupId' : undefined}\\n        title={useDifferentGroup ? 'Other groupId' : 'Default groupId'}\\n        position={Position.Right}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\\n        useDefaultGroupDomain={useDefaultDomain}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data4}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar B\\\"\\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\\n        useDefaultGroupDomain={useDefaultDomain}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data5}\\n      />\\n      <BarSeries\\n        id=\\\"non stacked bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Settings, Chart, Position, ScaleType, DEFAULT_GLOBAL_ID } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 1],\\n    [2, 2],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 5],\\n  ];\\n  const data3 = [\\n    [1, 1],\\n    [2, 9],\\n  ];\\n  const groupId1 = select(\\n    'groupId used on blue series',\\n    {\\n      default: DEFAULT_GLOBAL_ID,\\n      group1: 'group1',\\n      group2: 'group2',\\n    },\\n    'group2',\\n  );\\n\\n  const groupId2 = select(\\n    'groupId used on red series',\\n    {\\n      default: DEFAULT_GLOBAL_ID,\\n      group1: 'group1',\\n      group2: 'group2',\\n    },\\n    'group2',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left y\\\" title=\\\"GREEN\\\" position={Position.Right} />\\n      <Axis id=\\\"right 1 y\\\" groupId={groupId1} title=\\\"BLUE\\\" position={Position.Right} />\\n      <Axis id=\\\"right 2 y\\\" groupId={groupId2} title=\\\"RED\\\" position={Position.Right} />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        groupId={groupId1}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId={groupId2}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `You can specify a \\\\`groupId\\\\` in the \\\\`useDefaultGroupDomain\\\\` prop.\\nThis will allows you to match and merge the data domain of two different groups and reuse it on multiple series group.\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Settings, Chart, Position, ScaleType, DEFAULT_GLOBAL_ID } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 1],\n    [2, 2],\n  ];\n  const data2 = [\n    [1, 1],\n    [2, 5],\n  ];\n  const data3 = [\n    [1, 1],\n    [2, 9],\n  ];\n  const groupId1 = select(\n    'groupId used on blue series',\n    {\n      default: DEFAULT_GLOBAL_ID,\n      group1: 'group1',\n      group2: 'group2',\n    },\n    'group2',\n  );\n\n  const groupId2 = select(\n    'groupId used on red series',\n    {\n      default: DEFAULT_GLOBAL_ID,\n      group1: 'group1',\n      group2: 'group2',\n    },\n    'group2',\n  );\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left y\" title=\"GREEN\" position={Position.Right} />\n      <Axis id=\"right 1 y\" groupId={groupId1} title=\"BLUE\" position={Position.Right} />\n      <Axis id=\"right 2 y\" groupId={groupId2} title=\"RED\" position={Position.Right} />\n      <BarSeries\n        id=\"stacked bar 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data1}\n      />\n      <BarSeries\n        id=\"stacked bar 2\"\n        groupId={groupId1}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data2}\n      />\n\n      <BarSeries\n        id=\"stacked bar A\"\n        groupId={groupId2}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can specify a \\`groupId\\` in the \\`useDefaultGroupDomain\\` prop.\nThis will allows you to match and merge the data domain of two different groups and reuse it on multiple series group.\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 1],\\n    [2, 2],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 5],\\n  ];\\n  const data3 = [\\n    [1, 1],\\n    [2, 9],\\n  ];\\n  const groupId1 = select(\\n    'groupId used on blue series',\\n    {\\n      default: DEFAULT_GLOBAL_ID,\\n      group1: 'group1',\\n      group2: 'group2',\\n    },\\n    'group2',\\n  );\\n\\n  const groupId2 = select(\\n    'groupId used on red series',\\n    {\\n      default: DEFAULT_GLOBAL_ID,\\n      group1: 'group1',\\n      group2: 'group2',\\n    },\\n    'group2',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left y\\\" title=\\\"GREEN\\\" position={Position.Right} />\\n      <Axis id=\\\"right 1 y\\\" groupId={groupId1} title=\\\"BLUE\\\" position={Position.Right} />\\n      <Axis id=\\\"right 2 y\\\" groupId={groupId2} title=\\\"RED\\\" position={Position.Right} />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        groupId={groupId1}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId={groupId2}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  AccessorFn,\\n  ElementClickListener,\\n  XYChartElementEvent,\\n} from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const xAccessorFn: AccessorFn = (d) => d.x;\\n  const yAccessorFn: AccessorFn = (d) => d.y;\\n  yAccessorFn.fieldName = text('y fn name', '') || undefined;\\n  const splitAccessorFn: AccessorFn = (d) => d.g2;\\n  splitAccessorFn.fieldName = text('split fn name', '') || undefined;\\n\\n  const onElementClick = ([[, { key }]]: XYChartElementEvent[]) => action('clicked series key')(key);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={onElementClick as ElementClickListener}\\n        showLegend\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={xAccessorFn}\\n        yAccessors={['y', yAccessorFn]}\\n        splitSeriesAccessors={['g1', splitAccessorFn]}\\n        data={TestDatasets.BARCHART_1Y2G}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `An \\\\`AccessorFn\\\\` can be used as any accessor including: \\\\`xAccessor\\\\`, \\\\`yAccessors\\\\`, \\\\`y0Accessors\\\\` and \\\\`splitSeriesAccessors\\\\`.\\n\\nThis enables serialization of complex values, without needing to transform raw data.\\n\\n\\\\`\\\\`\\\\`ts\\n// simple example\\nconst yAccessorFn: AccessorFn = (d) => d.y;\\nyAccessorFn.fieldName = 'simple y value';\\n\\n// complex example\\nconst yAccessorFn: AccessorFn = ({ range }) => \\\\`\\\\${range.to} - \\\\${range.from}\\\\`;\\nyAccessorFn.fieldName = 'complex y value';\\n\\\\`\\\\`\\\\`\\n\\nIf no \\\\`fieldName\\\\` is provided, the default value will be set using the index \\\\`(index:0)\\\\`.\\n\\nTry changing the \\\\`fieldName\\\\` for the y and split accessor functions in the storybook knobs.\\n\\n**Note: All \\\\`fieldName\\\\` and \\\\`Accessor\\\\` values should be unique. Any duplicated values will be ignored.**\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":60},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":60}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  AccessorFn,\n  ElementClickListener,\n  XYChartElementEvent,\n} from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const xAccessorFn: AccessorFn = (d) => d.x;\n  const yAccessorFn: AccessorFn = (d) => d.y;\n  yAccessorFn.fieldName = text('y fn name', '') || undefined;\n  const splitAccessorFn: AccessorFn = (d) => d.g2;\n  splitAccessorFn.fieldName = text('split fn name', '') || undefined;\n\n  const onElementClick = ([[, { key }]]: XYChartElementEvent[]) => action('clicked series key')(key);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onElementClick={onElementClick as ElementClickListener}\n        showLegend\n        legendPosition={Position.Right}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={xAccessorFn}\n        yAccessors={['y', yAccessorFn]}\n        splitSeriesAccessors={['g1', splitAccessorFn]}\n        data={TestDatasets.BARCHART_1Y2G}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `An \\`AccessorFn\\` can be used as any accessor including: \\`xAccessor\\`, \\`yAccessors\\`, \\`y0Accessors\\` and \\`splitSeriesAccessors\\`.\n\nThis enables serialization of complex values, without needing to transform raw data.\n\n\\`\\`\\`ts\n// simple example\nconst yAccessorFn: AccessorFn = (d) => d.y;\nyAccessorFn.fieldName = 'simple y value';\n\n// complex example\nconst yAccessorFn: AccessorFn = ({ range }) => \\`\\${range.to} - \\${range.from}\\`;\nyAccessorFn.fieldName = 'complex y value';\n\\`\\`\\`\n\nIf no \\`fieldName\\` is provided, the default value will be set using the index \\`(index:0)\\`.\n\nTry changing the \\`fieldName\\` for the y and split accessor functions in the storybook knobs.\n\n**Note: All \\`fieldName\\` and \\`Accessor\\` values should be unique. Any duplicated values will be ignored.**\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const xAccessorFn: AccessorFn = (d) => d.x;\\n  const yAccessorFn: AccessorFn = (d) => d.y;\\n  yAccessorFn.fieldName = text('y fn name', '') || undefined;\\n  const splitAccessorFn: AccessorFn = (d) => d.g2;\\n  splitAccessorFn.fieldName = text('split fn name', '') || undefined;\\n\\n  const onElementClick = ([[, { key }]]: XYChartElementEvent[]) => action('clicked series key')(key);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={onElementClick as ElementClickListener}\\n        showLegend\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={xAccessorFn}\\n        yAccessors={['y', yAccessorFn]}\\n        splitSeriesAccessors={['g1', splitAccessorFn]}\\n        data={TestDatasets.BARCHART_1Y2G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React, { useRef } from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip, TooltipProps } from '@elastic/charts';\\nimport { getRandomNumberGenerator, SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst rng = getRandomNumberGenerator();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showAxes = boolean('Show axes', false);\\n  const groups = number('Groups', 5, { min: 2, max: 20, step: 1 });\\n  const offset = number('Offset', 10, { min: 0, step: 1 });\\n  const data = dg.generateGroupedSeries(4, groups).map((d) => {\\n    return {\\n      ...d,\\n      y1: rng(0, 20),\\n      y2: rng(0, 20),\\n      g1: `dog ${d.g}`,\\n      g2: `cat ${d.g}`,\\n    };\\n  });\\n  const red = useRef<HTMLDivElement | null>(null);\\n  const white = useRef<HTMLDivElement | null>(null);\\n  const blue = useRef<HTMLDivElement | null>(null);\\n  const getBoundary: Record<string, TooltipProps['boundary'] | null> = {\\n    default: undefined,\\n    red: red.current,\\n    white: white.current,\\n    blue: blue.current,\\n    chart: 'chart',\\n    root: document.getElementById('story-root'),\\n  };\\n  const boundarySting = select<string>(\\n    'Boundary Element',\\n    {\\n      Default: 'default',\\n      'Root (blanchedalmond)': 'root',\\n      Red: 'red',\\n      White: 'white',\\n      Blue: 'blue',\\n      Chart: 'chart',\\n    },\\n    'default',\\n  );\\n  const boundary = getBoundary[boundarySting] ?? undefined;\\n  const boundaryPadding = {\\n    top: number('Boundary top padding', 0, { min: 0 }),\\n    right: number('Boundary right padding', 0, { min: 0 }),\\n    bottom: number('Boundary bottom padding', 0, { min: 0 }),\\n    left: number('Boundary left padding', 0, { min: 0 }),\\n  };\\n\\n  return (\\n    <div ref={red} style={{ backgroundColor: 'red', padding: 30, height: '100%' }}>\\n      <div ref={white} style={{ backgroundColor: 'white', padding: 30, height: '100%' }}>\\n        <div ref={blue} style={{ backgroundColor: 'blue', padding: 30, height: '100%' }}>\\n          <Chart title={title} description={description}>\\n            <Settings baseTheme={useBaseTheme()} />\\n            <Tooltip boundary={boundary} boundaryPadding={boundaryPadding} offset={offset} />\\n            <Axis id=\\\"bottom\\\" hide={!showAxes} position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n            <Axis\\n              id=\\\"left\\\"\\n              hide={!showAxes}\\n              title=\\\"Left axis\\\"\\n              position={Position.Left}\\n              tickFormat={(d: any) => Number(d).toFixed(2)}\\n            />\\n            <BarSeries\\n              id=\\\"bars\\\"\\n              xScaleType={ScaleType.Ordinal}\\n              yScaleType={ScaleType.Linear}\\n              xAccessor=\\\"x\\\"\\n              yAccessors={['y1', 'y2']}\\n              splitSeriesAccessors={['g1', 'g2']}\\n              data={data}\\n            />\\n          </Chart>\\n        </div>\\n      </div>\\n    </div>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React, { useRef } from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip, TooltipProps } from '@elastic/charts';\nimport { getRandomNumberGenerator, SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst rng = getRandomNumberGenerator();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showAxes = boolean('Show axes', false);\n  const groups = number('Groups', 5, { min: 2, max: 20, step: 1 });\n  const offset = number('Offset', 10, { min: 0, step: 1 });\n  const data = dg.generateGroupedSeries(4, groups).map((d) => {\n    return {\n      ...d,\n      y1: rng(0, 20),\n      y2: rng(0, 20),\n      g1: `dog ${d.g}`,\n      g2: `cat ${d.g}`,\n    };\n  });\n  const red = useRef<HTMLDivElement | null>(null);\n  const white = useRef<HTMLDivElement | null>(null);\n  const blue = useRef<HTMLDivElement | null>(null);\n  const getBoundary: Record<string, TooltipProps['boundary'] | null> = {\n    default: undefined,\n    red: red.current,\n    white: white.current,\n    blue: blue.current,\n    chart: 'chart',\n    root: document.getElementById('story-root'),\n  };\n  const boundarySting = select<string>(\n    'Boundary Element',\n    {\n      Default: 'default',\n      'Root (blanchedalmond)': 'root',\n      Red: 'red',\n      White: 'white',\n      Blue: 'blue',\n      Chart: 'chart',\n    },\n    'default',\n  );\n  const boundary = getBoundary[boundarySting] ?? undefined;\n  const boundaryPadding = {\n    top: number('Boundary top padding', 0, { min: 0 }),\n    right: number('Boundary right padding', 0, { min: 0 }),\n    bottom: number('Boundary bottom padding', 0, { min: 0 }),\n    left: number('Boundary left padding', 0, { min: 0 }),\n  };\n\n  return (\n    <div ref={red} style={{ backgroundColor: 'red', padding: 30, height: '100%' }}>\n      <div ref={white} style={{ backgroundColor: 'white', padding: 30, height: '100%' }}>\n        <div ref={blue} style={{ backgroundColor: 'blue', padding: 30, height: '100%' }}>\n          <Chart title={title} description={description}>\n            <Settings baseTheme={useBaseTheme()} />\n            <Tooltip boundary={boundary} boundaryPadding={boundaryPadding} offset={offset} />\n            <Axis id=\"bottom\" hide={!showAxes} position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n            <Axis\n              id=\"left\"\n              hide={!showAxes}\n              title=\"Left axis\"\n              position={Position.Left}\n              tickFormat={(d: any) => Number(d).toFixed(2)}\n            />\n            <BarSeries\n              id=\"bars\"\n              xScaleType={ScaleType.Ordinal}\n              yScaleType={ScaleType.Linear}\n              xAccessor=\"x\"\n              yAccessors={['y1', 'y2']}\n              splitSeriesAccessors={['g1', 'g2']}\n              data={data}\n            />\n          </Chart>\n        </div>\n      </div>\n    </div>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showAxes = boolean('Show axes', false);\\n  const groups = number('Groups', 5, { min: 2, max: 20, step: 1 });\\n  const offset = number('Offset', 10, { min: 0, step: 1 });\\n  const data = dg.generateGroupedSeries(4, groups).map((d) => {\\n    return {\\n      ...d,\\n      y1: rng(0, 20),\\n      y2: rng(0, 20),\\n      g1: `dog ${d.g}`,\\n      g2: `cat ${d.g}`,\\n    };\\n  });\\n  const red = useRef<HTMLDivElement | null>(null);\\n  const white = useRef<HTMLDivElement | null>(null);\\n  const blue = useRef<HTMLDivElement | null>(null);\\n  const getBoundary: Record<string, TooltipProps['boundary'] | null> = {\\n    default: undefined,\\n    red: red.current,\\n    white: white.current,\\n    blue: blue.current,\\n    chart: 'chart',\\n    root: document.getElementById('story-root'),\\n  };\\n  const boundarySting = select<string>(\\n    'Boundary Element',\\n    {\\n      Default: 'default',\\n      'Root (blanchedalmond)': 'root',\\n      Red: 'red',\\n      White: 'white',\\n      Blue: 'blue',\\n      Chart: 'chart',\\n    },\\n    'default',\\n  );\\n  const boundary = getBoundary[boundarySting] ?? undefined;\\n  const boundaryPadding = {\\n    top: number('Boundary top padding', 0, { min: 0 }),\\n    right: number('Boundary right padding', 0, { min: 0 }),\\n    bottom: number('Boundary bottom padding', 0, { min: 0 }),\\n    left: number('Boundary left padding', 0, { min: 0 }),\\n  };\\n\\n  return (\\n    <div ref={red} style={{ backgroundColor: 'red', padding: 30, height: '100%' }}>\\n      <div ref={white} style={{ backgroundColor: 'white', padding: 30, height: '100%' }}>\\n        <div ref={blue} style={{ backgroundColor: 'blue', padding: 30, height: '100%' }}>\\n          <Chart title={title} description={description}>\\n            <Settings baseTheme={useBaseTheme()} />\\n            <Tooltip boundary={boundary} boundaryPadding={boundaryPadding} offset={offset} />\\n            <Axis id=\\\"bottom\\\" hide={!showAxes} position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n            <Axis\\n              id=\\\"left\\\"\\n              hide={!showAxes}\\n              title=\\\"Left axis\\\"\\n              position={Position.Left}\\n              tickFormat={(d: any) => Number(d).toFixed(2)}\\n            />\\n            <BarSeries\\n              id=\\\"bars\\\"\\n              xScaleType={ScaleType.Ordinal}\\n              yScaleType={ScaleType.Linear}\\n              xAccessor=\\\"x\\\"\\n              yAccessors={['y1', 'y2']}\\n              splitSeriesAccessors={['g1', 'g2']}\\n              data={data}\\n            />\\n          </Chart>\\n        </div>\\n      </div>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"right\\\" groupId=\\\"mainGroup\\\" position={Position.Left} ticks={5} />\\n\\n      <BarSeries\\n        id=\\\"groupB\\\"\\n        groupId=\\\"other\\\"\\n        useDefaultGroupDomain=\\\"mainGroup\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        yNice\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['g']}\\n        data={[\\n          { x: 'A', y: 10, g: 'ga' },\\n          { x: 'A', y: 10, g: 'gb' },\\n          { x: 'A', y: 10, g: 'gc' },\\n          { x: 'B', y: 10, g: 'ga' },\\n          { x: 'B', y: 10, g: 'gb' },\\n          { x: 'B', y: 10, g: 'gc' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"right\" groupId=\"mainGroup\" position={Position.Left} ticks={5} />\n\n      <BarSeries\n        id=\"groupB\"\n        groupId=\"other\"\n        useDefaultGroupDomain=\"mainGroup\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        yNice\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['g']}\n        data={[\n          { x: 'A', y: 10, g: 'ga' },\n          { x: 'A', y: 10, g: 'gb' },\n          { x: 'A', y: 10, g: 'gc' },\n          { x: 'B', y: 10, g: 'ga' },\n          { x: 'B', y: 10, g: 'gb' },\n          { x: 'B', y: 10, g: 'gc' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"right\\\" groupId=\\\"mainGroup\\\" position={Position.Left} ticks={5} />\\n\\n      <BarSeries\\n        id=\\\"groupB\\\"\\n        groupId=\\\"other\\\"\\n        useDefaultGroupDomain=\\\"mainGroup\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        yNice\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['g']}\\n        data={[\\n          { x: 'A', y: 10, g: 'ga' },\\n          { x: 'A', y: 10, g: 'gb' },\\n          { x: 'A', y: 10, g: 'gc' },\\n          { x: 'B', y: 10, g: 'ga' },\\n          { x: 'B', y: 10, g: 'gb' },\\n          { x: 'B', y: 10, g: 'gc' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings theme={useBaseTheme()} />\\n      <Axis id=\\\"count\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        barSeriesStyle={{\\n          rectBorder: {\\n            visible: true,\\n            strokeWidth: 10,\\n            stroke: 'black',\\n          },\\n        }}\\n        data={[\\n          { x: 'A', y: 0, val: 1222 },\\n          { x: 'B', y: 20, val: 1222 },\\n          { x: 'C', y: 750, val: 1222 },\\n          { x: 'D', y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings theme={useBaseTheme()} />\n      <Axis id=\"count\" title=\"count\" position={Position.Left} />\n      <Axis id=\"x\" title=\"goods\" position={Position.Bottom} />\n      <BarSeries\n        id=\"bars\"\n        name=\"amount\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        barSeriesStyle={{\n          rectBorder: {\n            visible: true,\n            strokeWidth: 10,\n            stroke: 'black',\n          },\n        }}\n        data={[\n          { x: 'A', y: 0, val: 1222 },\n          { x: 'B', y: 20, val: 1222 },\n          { x: 'C', y: 750, val: 1222 },\n          { x: 'D', y: 854, val: 1222 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings theme={useBaseTheme()} />\\n      <Axis id=\\\"count\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        barSeriesStyle={{\\n          rectBorder: {\\n            visible: true,\\n            strokeWidth: 10,\\n            stroke: 'black',\\n          },\\n        }}\\n        data={[\\n          { x: 'A', y: 0, val: 1222 },\\n          { x: 'B', y: 20, val: 1222 },\\n          { x: 'C', y: 750, val: 1222 },\\n          { x: 'D', y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\n\\nimport { BARCHART_1Y0G_LINEAR } from '../../../packages/charts/src/utils/data_samples/test_dataset';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: 15,\\n        fill: { textBorder: 2.5, color: 'white', borderColor: 'black' },\\n        alignment: {\\n          horizontal: select(\\n            'Horizontal alignment',\\n            {\\n              Default: undefined,\\n              Left: 'left',\\n              Center: 'center',\\n              Right: 'right',\\n            },\\n            undefined,\\n          ),\\n          vertical: select(\\n            'Vertical alignment',\\n            {\\n              Default: undefined,\\n              Top: 'top',\\n              Middle: 'middle',\\n              Bottom: 'bottom',\\n            },\\n            undefined,\\n          ),\\n        },\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        data={BARCHART_1Y0G_LINEAR}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        displayValueSettings={{ showValueLabel: true }}\\n      />\\n      <Axis id=\\\"bottom-axis\\\" position=\\\"bottom\\\" tickFormat={(d) => `${d} H`} />\\n      <Axis id=\\\"left-axis\\\" position=\\\"left\\\" tickFormat={(d) => `${d} V`} />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, ScaleType, Settings, PartialTheme } from '@elastic/charts';\n\nimport { BARCHART_1Y0G_LINEAR } from '../../../packages/charts/src/utils/data_samples/test_dataset';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    barSeriesStyle: {\n      displayValue: {\n        fontSize: 15,\n        fill: { textBorder: 2.5, color: 'white', borderColor: 'black' },\n        alignment: {\n          horizontal: select(\n            'Horizontal alignment',\n            {\n              Default: undefined,\n              Left: 'left',\n              Center: 'center',\n              Right: 'right',\n            },\n            undefined,\n          ),\n          vertical: select(\n            'Vertical alignment',\n            {\n              Default: undefined,\n              Top: 'top',\n              Middle: 'middle',\n              Bottom: 'bottom',\n            },\n            undefined,\n          ),\n        },\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\n      <BarSeries\n        id=\"bars\"\n        data={BARCHART_1Y0G_LINEAR}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        displayValueSettings={{ showValueLabel: true }}\n      />\n      <Axis id=\"bottom-axis\" position=\"bottom\" tickFormat={(d) => `${d} H`} />\n      <Axis id=\"left-axis\" position=\"left\" tickFormat={(d) => `${d} V`} />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: 15,\\n        fill: { textBorder: 2.5, color: 'white', borderColor: 'black' },\\n        alignment: {\\n          horizontal: select(\\n            'Horizontal alignment',\\n            {\\n              Default: undefined,\\n              Left: 'left',\\n              Center: 'center',\\n              Right: 'right',\\n            },\\n            undefined,\\n          ),\\n          vertical: select(\\n            'Vertical alignment',\\n            {\\n              Default: undefined,\\n              Top: 'top',\\n              Middle: 'middle',\\n              Bottom: 'bottom',\\n            },\\n            undefined,\\n          ),\\n        },\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        data={BARCHART_1Y0G_LINEAR}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        displayValueSettings={{ showValueLabel: true }}\\n      />\\n      <Axis id=\\\"bottom-axis\\\" position=\\\"bottom\\\" tickFormat={(d) => `${d} H`} />\\n      <Axis id=\\\"left-axis\\\" position=\\\"left\\\" tickFormat={(d) => `${d} V`} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    scales: {\\n      histogramPadding: number('histogram padding', 0, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n      barsPadding: number('bar padding', 0, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 2 },\\n          { x: 2, y: 7 },\\n          { x: 4, y: 3 },\\n          { x: 9, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":56},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":56}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    scales: {\n      histogramPadding: number('histogram padding', 0, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      }),\n      barsPadding: number('bar padding', 0, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      }),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 1, y: 2 },\n          { x: 2, y: 7 },\n          { x: 4, y: 3 },\n          { x: 9, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    scales: {\\n      histogramPadding: number('histogram padding', 0, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n      barsPadding: number('bar padding', 0, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 2 },\\n          { x: 2, y: 7 },\\n          { x: 4, y: 3 },\\n          { x: 9, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      xDomain={{\\n        min: NaN,\\n        max: 100,\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 10, y: 7 },\\n        { x: 11.5, y: 9 },\\n        { x: 13.5, y: 3 },\\n        { x: 50, y: 6 },\\n        { x: 66, y: 13 },\\n        { x: 90, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      xDomain={{\n        min: NaN,\n        max: 100,\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 10, y: 7 },\n        { x: 11.5, y: 9 },\n        { x: 13.5, y: 3 },\n        { x: 50, y: 6 },\n        { x: 66, y: 13 },\n        { x: 90, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      xDomain={{\\n        min: NaN,\\n        max: 100,\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 10, y: 7 },\\n        { x: 11.5, y: 9 },\\n        { x: 13.5, y: 3 },\\n        { x: 50, y: 6 },\\n        { x: 66, y: 13 },\\n        { x: 90, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\n        tickFormat={formatter}\n      />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left2\\\"\\n      domain={{\\n        min: NaN,\\n        max: NaN,\\n        fit: true,\\n      }}\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      tickFormat={(d: any) => Number(d).toFixed(2)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Log}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 1, y: 0 },\\n        { x: 2, y: 1 },\\n        { x: 3, y: 2 },\\n        { x: 4, y: 3 },\\n        { x: 5, y: 4 },\\n        { x: 6, y: 5 },\\n        { x: 7, y: 6 },\\n        { x: 8, y: 7 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis\n      id=\"left2\"\n      domain={{\n        min: NaN,\n        max: NaN,\n        fit: true,\n      }}\n      title=\"Left axis\"\n      position={Position.Left}\n      tickFormat={(d: any) => Number(d).toFixed(2)}\n    />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Log}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 1, y: 0 },\n        { x: 2, y: 1 },\n        { x: 3, y: 2 },\n        { x: 4, y: 3 },\n        { x: 5, y: 4 },\n        { x: 6, y: 5 },\n        { x: 7, y: 6 },\n        { x: 8, y: 7 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left2\\\"\\n      domain={{\\n        min: NaN,\\n        max: NaN,\\n        fit: true,\\n      }}\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      tickFormat={(d: any) => Number(d).toFixed(2)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Log}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 1, y: 0 },\\n        { x: 2, y: 1 },\\n        { x: 3, y: 2 },\\n        { x: 4, y: 3 },\\n        { x: 5, y: 4 },\\n        { x: 6, y: 5 },\\n        { x: 7, y: 6 },\\n        { x: 8, y: 7 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left2\\\"\\n      domain={{\\n        min: NaN,\\n        max: NaN,\\n        fit: true,\\n      }}\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      tickFormat={(d: any) => Number(d).toFixed(2)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Log}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 1, y: 0, g: 'a' },\\n        { x: 1, y: 0, g: 'b' },\\n        { x: 2, y: 1, g: 'a' },\\n        { x: 2, y: 1, g: 'b' },\\n        { x: 3, y: 2, g: 'a' },\\n        { x: 3, y: 2, g: 'b' },\\n        { x: 4, y: 3, g: 'a' },\\n        { x: 4, y: 0, g: 'b' },\\n        { x: 5, y: 4, g: 'a' },\\n        { x: 5, y: 0.5, g: 'b' },\\n        { x: 6, y: 5, g: 'a' },\\n        { x: 6, y: 1, g: 'b' },\\n        { x: 7, y: 6, g: 'b' },\\n        { x: 8, y: 7, g: 'a' },\\n        { x: 8, y: 10, g: 'b' },\\n        { x: 9, y: 4, g: 'a' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":60},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":60}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis\n      id=\"left2\"\n      domain={{\n        min: NaN,\n        max: NaN,\n        fit: true,\n      }}\n      title=\"Left axis\"\n      position={Position.Left}\n      tickFormat={(d: any) => Number(d).toFixed(2)}\n    />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Log}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      stackAccessors={['x']}\n      data={[\n        { x: 1, y: 0, g: 'a' },\n        { x: 1, y: 0, g: 'b' },\n        { x: 2, y: 1, g: 'a' },\n        { x: 2, y: 1, g: 'b' },\n        { x: 3, y: 2, g: 'a' },\n        { x: 3, y: 2, g: 'b' },\n        { x: 4, y: 3, g: 'a' },\n        { x: 4, y: 0, g: 'b' },\n        { x: 5, y: 4, g: 'a' },\n        { x: 5, y: 0.5, g: 'b' },\n        { x: 6, y: 5, g: 'a' },\n        { x: 6, y: 1, g: 'b' },\n        { x: 7, y: 6, g: 'b' },\n        { x: 8, y: 7, g: 'a' },\n        { x: 8, y: 10, g: 'b' },\n        { x: 9, y: 4, g: 'a' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left2\\\"\\n      domain={{\\n        min: NaN,\\n        max: NaN,\\n        fit: true,\\n      }}\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      tickFormat={(d: any) => Number(d).toFixed(2)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Log}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 1, y: 0, g: 'a' },\\n        { x: 1, y: 0, g: 'b' },\\n        { x: 2, y: 1, g: 'a' },\\n        { x: 2, y: 1, g: 'b' },\\n        { x: 3, y: 2, g: 'a' },\\n        { x: 3, y: 2, g: 'b' },\\n        { x: 4, y: 3, g: 'a' },\\n        { x: 4, y: 0, g: 'b' },\\n        { x: 5, y: 4, g: 'a' },\\n        { x: 5, y: 0.5, g: 'b' },\\n        { x: 6, y: 5, g: 'a' },\\n        { x: 6, y: 1, g: 'b' },\\n        { x: 7, y: 6, g: 'b' },\\n        { x: 8, y: 7, g: 'a' },\\n        { x: 8, y: 10, g: 'b' },\\n        { x: 9, y: 4, g: 'a' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Bar Chart',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as withValueLabel } from './2_label_value.story';\nexport { Example as withValueLabelAdvanced } from './51_label_value_advanced.story';\nexport { Example as withAxis } from './3_with_axis.story';\nexport { Example as withOrdinalXAxis } from './4_ordinal.story';\nexport { Example as withLinearXAxis } from './5_linear.story';\nexport { Example as withLinearXAxisNoLinearInterval } from './6_linear_no_linear_interval.story';\nexport { Example as withTimeXAxis } from './7_with_time_xaxis.story';\nexport { Example as withLogYAxis } from './8_with_log_yaxis.story';\nexport { Example as withStackedLogYAxis } from './9_with_stacked_log.story';\n\nexport { Example as withAxisAndLegend } from './10_axis_and_legend.story';\nexport { Example as stackedWithAxisAndLegend } from './11_stacked_with_axis_and_legend.story';\nexport { Example as stackedAsPercentage } from './12_stacked_as_percentage.story';\nexport { Example as clusteredWithAxisAndLegend } from './13_clustered.story';\nexport { Example as clusteredMultipleSeriesSpecs } from './14_clustered_multiple.story';\nexport { Example as timeClusteredUsingVariousSpecs } from './15_time_clustered.story';\nexport { Example as timeStackedUsingVariousSpecs } from './17_time_stacked.story';\nexport { Example as barChart1y0g } from './18_bar_chart_1y0g.story';\nexport { Example as barChart1y1g } from './19_bar_chart_1y1g.story';\n\nexport { Example as barChart1y2g } from './20_bar_chart_1y2g.story';\nexport { Example as barChart2y0g } from './21_bar_chart_2y0g.story';\nexport { Example as barChart2y1g } from './22_barchart_2y1g.story';\nexport { Example as barChart2y2g } from './23_bar_chart_2y2g.story';\nexport { Example as tooltipSeriesVisibility } from './24_tooltip_visibility.story';\nexport { Example as withHighDataVolume } from './25_high_data_volume.story';\nexport { Example as singleDataChartLinear } from './26_single_data_linear.story';\nexport { Example as singleDataChartOrdinal } from './27_single_data_ordinal.story';\nexport { Example as singleDataClusteredChart } from './28_single_data_clustered.story';\nexport { Example as singleDataStackedChart } from './29_single_data_stacked.story';\n\nexport { Example as stackedToExtent } from './30_stacked_to_extent.story';\nexport { Example as negativeAndPositiveXValues } from './31_negative_and_positive_x_values.story';\nexport { Example as scaleToExtent } from './32_scale_to_extent.story';\nexport { Example as bandBarChart } from './33_band_bar.story';\nexport { Example as minHeight } from './45_min_height.story';\nexport { Example as stackedOnlyGrouped } from './47_stacked_only_grouped.story';\nexport { Example as dualAxisSameYDomain } from './52_multi_group_same_domain.story';\nexport { Example as specifyDomainFromDifferentGroup } from './53_use_domain_from_different_groupid.story';\nexport { Example as orderBinsBySum } from './50_order_bins_by_sum.story';\nexport { Example as functionalAccessors } from './54_functional_accessors.story';\n\n// for testing purposes only\nexport { Example as testLinear } from './34_test_linear.story';\nexport { Example as testTime } from './35_test_time.story';\nexport { Example as testLinearClustered } from './36_test_linear_clustered.story';\nexport { Example as testTimeClustered } from './37_test_time_clustered.story';\nexport { Example as testClusteredBarChartWithNullBars } from './38_test_clustered_null_bars.story';\nexport { Example as testStackedBarChartWithNullBars } from './39_test_stacked_null.story';\nexport { Example as testSwitchOrdinalLinearAxis } from './40_test_switch.story';\nexport { Example as testHistogramModeLinear } from './41_test_histogram_linear.story';\nexport { Example as testHistogramModeOrdinal } from './42_test_histogram_ordinal.story';\nexport { Example as testDiscover } from './43_test_discover.story';\nexport { Example as testSingleHistogramBarChart } from './44_test_single_histogram.story';\nexport { Example as testMinHeightPositiveAndNegativeValues } from './46_test_min_height.story';\nexport { Example as testTooltipAndRotation } from './48_test_tooltip.story';\nexport { Example as tooltipBoundary } from './55_tooltip_boundary.story';\nexport { Example as testDualYAxis } from './49_test_dual_axis.story';\nexport { Example as testUseDefaultGroupDomain } from './56_test_use_dfl_gdomain.story';\nexport { Example as testRectBorder } from './57_test_rect_border_bars.story';\nexport { Example as dataValue } from './58_data_values.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  BubbleSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  TooltipType,\\n  PointShape,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data = dg.generateRandomSeries(100);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 20, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n  const shape = select<PointShape>('shape', PointShape, PointShape.Circle);\\n  const opacity = number('shape fill opacity', 1, {\\n    range: true,\\n    min: 0,\\n    max: 1,\\n    step: 0.01,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        bubbleSeriesStyle={{\\n          point: {\\n            shape,\\n            opacity,\\n          },\\n        }}\\n        data={data.slice(0, size)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  BubbleSeries,\n  Position,\n  ScaleType,\n  Settings,\n  TooltipType,\n  PointShape,\n  Tooltip,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data = dg.generateRandomSeries(100);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n  const size = number('total points', 20, {\n    range: true,\n    min: 10,\n    max: 100,\n    step: 10,\n  });\n  const shape = select<PointShape>('shape', PointShape, PointShape.Circle);\n  const opacity = number('shape fill opacity', 1, {\n    range: true,\n    min: 0,\n    max: 1,\n    step: 0.01,\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{\n          markSizeRatio,\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Tooltip type={TooltipType.Follow} snap={false} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BubbleSeries\n        id=\"bubbles\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        bubbleSeriesStyle={{\n          point: {\n            shape,\n            opacity,\n          },\n        }}\n        data={data.slice(0, size)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 20, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n  const shape = select<PointShape>('shape', PointShape, PointShape.Circle);\\n  const opacity = number('shape fill opacity', 1, {\\n    range: true,\\n    min: 0,\\n    max: 1,\\n    step: 0.01,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        bubbleSeriesStyle={{\\n          point: {\\n            shape,\\n            opacity,\\n          },\\n        }}\\n        data={data.slice(0, size)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType, Tooltip } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\nconst data = new Array(100).fill(0).map(() => ({\\n  x: String.fromCharCode(rng(97, 122)),\\n  y: rng(0, 100),\\n  z: rng(0, 100),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 30, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data.slice(0, size)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":71},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":71}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType, Tooltip } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\nconst data = new Array(100).fill(0).map(() => ({\n  x: String.fromCharCode(rng(97, 122)),\n  y: rng(0, 100),\n  z: rng(0, 100),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n  const size = number('total points', 30, {\n    range: true,\n    min: 10,\n    max: 100,\n    step: 10,\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          markSizeRatio,\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Tooltip type={TooltipType.Follow} snap={false} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BubbleSeries\n        id=\"bubbles\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={data.slice(0, size)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 30, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data.slice(0, size)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType, Tooltip } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 20, {\\n    range: true,\\n    min: 10,\\n    max: 50,\\n    step: 5,\\n  });\\n  const data = dg.generateRandomGroupedSeries(size, 4);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType, Tooltip } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n  const size = number('total points', 20, {\n    range: true,\n    min: 10,\n    max: 50,\n    step: 5,\n  });\n  const data = dg.generateRandomGroupedSeries(size, 4);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{\n          markSizeRatio,\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Tooltip type={TooltipType.Follow} snap={false} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BubbleSeries\n        id=\"bubbles\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        markSizeAccessor=\"z\"\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 20, {\\n    range: true,\\n    min: 10,\\n    max: 50,\\n    step: 5,\\n  });\\n  const data = dg.generateRandomGroupedSeries(size, 4);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, LineSeries } from '@elastic/charts';\\nimport { SeededDataGenerator, getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst rng = getRandomNumberGenerator();\\nconst lineData = dg.generateGroupedSeries(100, 2);\\nconst bubbleData = new Array(100).fill(0).map((_, i) => ({\\n  x: i,\\n  y: rng(0, 10),\\n  z: rng(0, 100),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n          bubbleSeriesStyle: {\\n            point: {\\n              fill: 'transparent',\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={bubbleData}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={lineData}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":81},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":81}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, LineSeries } from '@elastic/charts';\nimport { SeededDataGenerator, getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst rng = getRandomNumberGenerator();\nconst lineData = dg.generateGroupedSeries(100, 2);\nconst bubbleData = new Array(100).fill(0).map((_, i) => ({\n  x: i,\n  y: rng(0, 10),\n  z: rng(0, 100),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{\n          markSizeRatio,\n          bubbleSeriesStyle: {\n            point: {\n              fill: 'transparent',\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BubbleSeries\n        id=\"bubbles\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={bubbleData}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={lineData}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n          bubbleSeriesStyle: {\\n            point: {\\n              fill: 'transparent',\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={bubbleData}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={lineData}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Bubble Chart (@alpha)',\n};\n\nexport { Example as simple } from './1_simple.story';\nexport { Example as ordinal } from './2_ordinal.story';\nexport { Example as multiple } from './3_multiple.story';\nexport { Example as mixed } from './4_mixed.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { text, number, boolean } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const bulletTitle = text('title', 'Error rate', 'General');\\n  const subtitle = text('subtitle', '', 'General');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\\n  const format = text('format (numeraljs)', '0.[0]', 'General');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\\n\\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\\n  const tickStrategy = customKnobs.multiSelect(\\n    'tick strategy',\\n    {\\n      Auto: 'auto',\\n      TickCount: 'count',\\n      TickPlacements: 'placements',\\n    },\\n    'auto',\\n    'select',\\n    'Ticks',\\n  );\\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\\n  const tickPlacements = customKnobs.numbersArray(\\n    'ticks(placements)',\\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\\n    undefined,\\n    'Ticks',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\\n      <Bullet\\n        id=\\\"bullet\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: bulletTitle,\\n              subtitle,\\n              domain: [start, end],\\n              niceDomain,\\n              ticks:\\n                tickStrategy[0] === 'count'\\n                  ? ticks\\n                  : tickStrategy[0] === 'placements'\\n                    ? () => tickPlacements\\n                    : undefined,\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 500,\\n    height: 500,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":81},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":81}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { text, number, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const bulletTitle = text('title', 'Error rate', 'General');\n  const subtitle = text('subtitle', '', 'General');\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\n  const format = text('format (numeraljs)', '0.[0]', 'General');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\n\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\n  const tickStrategy = customKnobs.multiSelect(\n    'tick strategy',\n    {\n      Auto: 'auto',\n      TickCount: 'count',\n      TickPlacements: 'placements',\n    },\n    'auto',\n    'select',\n    'Ticks',\n  );\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\n  const tickPlacements = customKnobs.numbersArray(\n    'ticks(placements)',\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\n    undefined,\n    'Ticks',\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\n      <Bullet\n        id=\"bullet\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: bulletTitle,\n              subtitle,\n              domain: [start, end],\n              niceDomain,\n              ticks:\n                tickStrategy[0] === 'count'\n                  ? ticks\n                  : tickStrategy[0] === 'placements'\n                    ? () => tickPlacements\n                    : undefined,\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 500,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const bulletTitle = text('title', 'Error rate', 'General');\\n  const subtitle = text('subtitle', '', 'General');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\\n  const format = text('format (numeraljs)', '0.[0]', 'General');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\\n\\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\\n  const tickStrategy = customKnobs.multiSelect(\\n    'tick strategy',\\n    {\\n      Auto: 'auto',\\n      TickCount: 'count',\\n      TickPlacements: 'placements',\\n    },\\n    'auto',\\n    'select',\\n    'Ticks',\\n  );\\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\\n  const tickPlacements = customKnobs.numbersArray(\\n    'ticks(placements)',\\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\\n    undefined,\\n    'Ticks',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\\n      <Bullet\\n        id=\\\"bullet\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: bulletTitle,\\n              subtitle,\\n              domain: [start, end],\\n              niceDomain,\\n              ticks:\\n                tickStrategy[0] === 'count'\\n                  ? ticks\\n                  : tickStrategy[0] === 'placements'\\n                    ? () => tickPlacements\\n                    : undefined,\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { text, number, boolean } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const bulletTitle = text('title', 'A Nice Title');\\n  const subtitle = text('subtitle', 'Subtitle');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 });\\n  const target = number('target', 75, { range: true, min: -200, max: 200 });\\n  const start = number('start', 0, { range: true, min: -200, max: 200 });\\n  const end = number('end', 100, { range: true, min: -200, max: 200 });\\n  const tickSnapStep = number('active tick step', 0, { min: 0, max: 10 });\\n  const angularTickLabelPadding = number('tick label padding', 10, { range: true, min: 0, max: 50 });\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.twoThirdsCircle, {\\n    exclude: ['vertical', 'horizontal'],\\n  });\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          bulletGraph: {\\n            angularTickLabelPadding,\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n      />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        tickSnapStep={tickSnapStep}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: bulletTitle,\\n              subtitle,\\n              domain: [start, end],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 500,\\n    height: 500,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { text, number, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const bulletTitle = text('title', 'A Nice Title');\n  const subtitle = text('subtitle', 'Subtitle');\n  const value = number('value', 56, { range: true, min: -200, max: 200 });\n  const target = number('target', 75, { range: true, min: -200, max: 200 });\n  const start = number('start', 0, { range: true, min: -200, max: 200 });\n  const end = number('end', 100, { range: true, min: -200, max: 200 });\n  const tickSnapStep = number('active tick step', 0, { min: 0, max: 10 });\n  const angularTickLabelPadding = number('tick label padding', 10, { range: true, min: 0, max: 50 });\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.twoThirdsCircle, {\n    exclude: ['vertical', 'horizontal'],\n  });\n  const format = text('format', '0');\n  const formatter = (d: number) => numeral(d).format(format);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          bulletGraph: {\n            angularTickLabelPadding,\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={debug}\n      />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        tickSnapStep={tickSnapStep}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: bulletTitle,\n              subtitle,\n              domain: [start, end],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 500,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const bulletTitle = text('title', 'A Nice Title');\\n  const subtitle = text('subtitle', 'Subtitle');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 });\\n  const target = number('target', 75, { range: true, min: -200, max: 200 });\\n  const start = number('start', 0, { range: true, min: -200, max: 200 });\\n  const end = number('end', 100, { range: true, min: -200, max: 200 });\\n  const tickSnapStep = number('active tick step', 0, { min: 0, max: 10 });\\n  const angularTickLabelPadding = number('tick label padding', 10, { range: true, min: 0, max: 50 });\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.twoThirdsCircle, {\\n    exclude: ['vertical', 'horizontal'],\\n  });\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          bulletGraph: {\\n            angularTickLabelPadding,\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n      />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        tickSnapStep={tickSnapStep}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: bulletTitle,\\n              subtitle,\\n              domain: [start, end],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport {\\n  euiPaletteColorBlind,\\n  euiPaletteComplementary,\\n  euiPaletteCool,\\n  euiPaletteForDarkBackground,\\n  euiPaletteForLightBackground,\\n  euiPaletteForStatus,\\n  euiPaletteForTemperature,\\n  euiPaletteGray,\\n  euiPaletteNegative,\\n  euiPalettePositive,\\n  euiPaletteWarm,\\n} from '@elastic/eui';\\nimport { number, boolean, object, color } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React, { useCallback } from 'react';\\n\\nimport {\\n  Chart,\\n  Bullet,\\n  BulletSubtype,\\n  Settings,\\n  BulletColorConfig,\\n  ColorBandSimpleConfig,\\n  ColorBandComplexConfig,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme, useThemeId } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const isDarkTheme = useThemeId().includes('dark');\\n  const getPalettes = useCallback(\\n    (steps: number) => [\\n      ['#164863', '#427D9D', '#9BBEC8', '#DDF2FD'],\\n      ['#F1EAFF', '#E5D4FF', '#DCBFFF', '#D0A2F7'],\\n      ['#0802A3', '#FF4B91', '#FF7676', '#FFCD4B'],\\n      euiPaletteColorBlind(),\\n      isDarkTheme ? euiPaletteForDarkBackground() : euiPaletteForLightBackground(),\\n      euiPaletteForTemperature(steps),\\n      euiPaletteForStatus(steps),\\n      euiPaletteComplementary(steps),\\n      euiPaletteNegative(steps),\\n      euiPalettePositive(steps),\\n      euiPaletteCool(steps),\\n      euiPaletteWarm(steps),\\n      euiPaletteGray(steps),\\n    ],\\n    [isDarkTheme],\\n  );\\n\\n  // Colors\\n  const colorOptionIndex = getKnobFromEnum(\\n    'color config',\\n    {\\n      '1 Single Color': 1,\\n      '2 Array of Colors via palettes': 2,\\n      '3 Array with options': 3,\\n      '4 Fully custom bands': 4,\\n    },\\n    1,\\n    { group: 'Color Bands' },\\n  );\\n  const colorBands1 = color('Config 1 - Color', 'RGBA(70, 130, 96, 1)', 'Color Bands');\\n  const colorBands2 = getKnobFromEnum(\\n    'Config 2 - Palette',\\n    {\\n      Navy: 0,\\n      Pink: 1,\\n      Mixed: 2,\\n      'eui Palette color blind': 3,\\n      'eui Palette For Temperature': 4,\\n      'eui Palette For Status': 5,\\n      'eui Palette Complementary': 6,\\n      'eui Palette Negative': 7,\\n      'eui Palette Positive': 8,\\n      'eui Palette Cool': 9,\\n      'eui Palette Warm': 10,\\n      'eui Palette Gray': 11,\\n    },\\n    0,\\n    { group: 'Color Bands' },\\n  );\\n  const colorBands2Steps = number('Config 2 - Steps', 5, { min: 1, max: 10, range: true, step: 1 }, 'Color Bands');\\n  const colorBands2Reverse = boolean('Config 2 - Reverse', false, 'Color Bands');\\n\\n  const colorBands3 = object<ColorBandSimpleConfig>(\\n    'Config 3 - json',\\n    {\\n      steps: 5,\\n      colors: ['pink', 'yellow', 'blue'],\\n    },\\n    'Color Bands',\\n  );\\n  const colorBands4 = object<ColorBandComplexConfig>(\\n    'Config 4 - json',\\n    [\\n      { color: 'red', gte: 0, lt: 20 },\\n      { color: 'green', gte: 20, lte: 40 },\\n      {\\n        color: 'blue',\\n        gt: 40,\\n        lte: {\\n          type: 'percentage',\\n          value: 100,\\n        },\\n      },\\n    ],\\n    'Color Bands',\\n  );\\n  const palette = getPalettes(colorBands2Steps)[colorBands2];\\n  const colorOptions = [, [colorBands1], colorBands2Reverse ? palette.reverse() : palette, colorBands3, colorBands4];\\n\\n  // Domain\\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'Domain');\\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'Domain');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'Domain');\\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'Domain');\\n\\n  // Ticks\\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\\n  const tickStrategy = customKnobs.multiSelect(\\n    'tick strategy',\\n    {\\n      Auto: 'auto',\\n      TickCount: 'count',\\n      TickPlacements: 'placements',\\n    },\\n    'auto',\\n    'select',\\n    'Ticks',\\n  );\\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\\n  const tickPlacements = customKnobs.numbersArray(\\n    'ticks(placements)',\\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\\n    undefined,\\n    'Ticks',\\n  );\\n\\n  // Other\\n  const debug = boolean('debug', false);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\\n\\n  const formatter = (d: number) => numeral(d).format('0.[0]');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\\n      <Bullet\\n        id=\\\"bullet\\\"\\n        subtype={subtype}\\n        colorBands={colorOptions[colorOptionIndex] as BulletColorConfig}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: 'The Title',\\n              subtitle: 'The Subtitle',\\n              domain: [start, end],\\n              niceDomain,\\n              ticks:\\n                tickStrategy[0] === 'count'\\n                  ? ticks\\n                  : tickStrategy[0] === 'placements'\\n                    ? () => tickPlacements\\n                    : undefined,\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 500,\\n    height: 500,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":41},\"endLoc\":{\"col\":1,\"line\":187},\"startBody\":{\"col\":36,\"line\":41},\"endBody\":{\"col\":1,\"line\":187}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  euiPaletteColorBlind,\n  euiPaletteComplementary,\n  euiPaletteCool,\n  euiPaletteForDarkBackground,\n  euiPaletteForLightBackground,\n  euiPaletteForStatus,\n  euiPaletteForTemperature,\n  euiPaletteGray,\n  euiPaletteNegative,\n  euiPalettePositive,\n  euiPaletteWarm,\n} from '@elastic/eui';\nimport { number, boolean, object, color } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React, { useCallback } from 'react';\n\nimport {\n  Chart,\n  Bullet,\n  BulletSubtype,\n  Settings,\n  BulletColorConfig,\n  ColorBandSimpleConfig,\n  ColorBandComplexConfig,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme, useThemeId } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const isDarkTheme = useThemeId().includes('dark');\n  const getPalettes = useCallback(\n    (steps: number) => [\n      ['#164863', '#427D9D', '#9BBEC8', '#DDF2FD'],\n      ['#F1EAFF', '#E5D4FF', '#DCBFFF', '#D0A2F7'],\n      ['#0802A3', '#FF4B91', '#FF7676', '#FFCD4B'],\n      euiPaletteColorBlind(),\n      isDarkTheme ? euiPaletteForDarkBackground() : euiPaletteForLightBackground(),\n      euiPaletteForTemperature(steps),\n      euiPaletteForStatus(steps),\n      euiPaletteComplementary(steps),\n      euiPaletteNegative(steps),\n      euiPalettePositive(steps),\n      euiPaletteCool(steps),\n      euiPaletteWarm(steps),\n      euiPaletteGray(steps),\n    ],\n    [isDarkTheme],\n  );\n\n  // Colors\n  const colorOptionIndex = getKnobFromEnum(\n    'color config',\n    {\n      '1 Single Color': 1,\n      '2 Array of Colors via palettes': 2,\n      '3 Array with options': 3,\n      '4 Fully custom bands': 4,\n    },\n    1,\n    { group: 'Color Bands' },\n  );\n  const colorBands1 = color('Config 1 - Color', 'RGBA(70, 130, 96, 1)', 'Color Bands');\n  const colorBands2 = getKnobFromEnum(\n    'Config 2 - Palette',\n    {\n      Navy: 0,\n      Pink: 1,\n      Mixed: 2,\n      'eui Palette color blind': 3,\n      'eui Palette For Temperature': 4,\n      'eui Palette For Status': 5,\n      'eui Palette Complementary': 6,\n      'eui Palette Negative': 7,\n      'eui Palette Positive': 8,\n      'eui Palette Cool': 9,\n      'eui Palette Warm': 10,\n      'eui Palette Gray': 11,\n    },\n    0,\n    { group: 'Color Bands' },\n  );\n  const colorBands2Steps = number('Config 2 - Steps', 5, { min: 1, max: 10, range: true, step: 1 }, 'Color Bands');\n  const colorBands2Reverse = boolean('Config 2 - Reverse', false, 'Color Bands');\n\n  const colorBands3 = object<ColorBandSimpleConfig>(\n    'Config 3 - json',\n    {\n      steps: 5,\n      colors: ['pink', 'yellow', 'blue'],\n    },\n    'Color Bands',\n  );\n  const colorBands4 = object<ColorBandComplexConfig>(\n    'Config 4 - json',\n    [\n      { color: 'red', gte: 0, lt: 20 },\n      { color: 'green', gte: 20, lte: 40 },\n      {\n        color: 'blue',\n        gt: 40,\n        lte: {\n          type: 'percentage',\n          value: 100,\n        },\n      },\n    ],\n    'Color Bands',\n  );\n  const palette = getPalettes(colorBands2Steps)[colorBands2];\n  const colorOptions = [, [colorBands1], colorBands2Reverse ? palette.reverse() : palette, colorBands3, colorBands4];\n\n  // Domain\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'Domain');\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'Domain');\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'Domain');\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'Domain');\n\n  // Ticks\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\n  const tickStrategy = customKnobs.multiSelect(\n    'tick strategy',\n    {\n      Auto: 'auto',\n      TickCount: 'count',\n      TickPlacements: 'placements',\n    },\n    'auto',\n    'select',\n    'Ticks',\n  );\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\n  const tickPlacements = customKnobs.numbersArray(\n    'ticks(placements)',\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\n    undefined,\n    'Ticks',\n  );\n\n  // Other\n  const debug = boolean('debug', false);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\n\n  const formatter = (d: number) => numeral(d).format('0.[0]');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\n      <Bullet\n        id=\"bullet\"\n        subtype={subtype}\n        colorBands={colorOptions[colorOptionIndex] as BulletColorConfig}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: 'The Title',\n              subtitle: 'The Subtitle',\n              domain: [start, end],\n              niceDomain,\n              ticks:\n                tickStrategy[0] === 'count'\n                  ? ticks\n                  : tickStrategy[0] === 'placements'\n                    ? () => tickPlacements\n                    : undefined,\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 500,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const isDarkTheme = useThemeId().includes('dark');\\n  const getPalettes = useCallback(\\n    (steps: number) => [\\n      ['#164863', '#427D9D', '#9BBEC8', '#DDF2FD'],\\n      ['#F1EAFF', '#E5D4FF', '#DCBFFF', '#D0A2F7'],\\n      ['#0802A3', '#FF4B91', '#FF7676', '#FFCD4B'],\\n      euiPaletteColorBlind(),\\n      isDarkTheme ? euiPaletteForDarkBackground() : euiPaletteForLightBackground(),\\n      euiPaletteForTemperature(steps),\\n      euiPaletteForStatus(steps),\\n      euiPaletteComplementary(steps),\\n      euiPaletteNegative(steps),\\n      euiPalettePositive(steps),\\n      euiPaletteCool(steps),\\n      euiPaletteWarm(steps),\\n      euiPaletteGray(steps),\\n    ],\\n    [isDarkTheme],\\n  );\\n\\n  // Colors\\n  const colorOptionIndex = getKnobFromEnum(\\n    'color config',\\n    {\\n      '1 Single Color': 1,\\n      '2 Array of Colors via palettes': 2,\\n      '3 Array with options': 3,\\n      '4 Fully custom bands': 4,\\n    },\\n    1,\\n    { group: 'Color Bands' },\\n  );\\n  const colorBands1 = color('Config 1 - Color', 'RGBA(70, 130, 96, 1)', 'Color Bands');\\n  const colorBands2 = getKnobFromEnum(\\n    'Config 2 - Palette',\\n    {\\n      Navy: 0,\\n      Pink: 1,\\n      Mixed: 2,\\n      'eui Palette color blind': 3,\\n      'eui Palette For Temperature': 4,\\n      'eui Palette For Status': 5,\\n      'eui Palette Complementary': 6,\\n      'eui Palette Negative': 7,\\n      'eui Palette Positive': 8,\\n      'eui Palette Cool': 9,\\n      'eui Palette Warm': 10,\\n      'eui Palette Gray': 11,\\n    },\\n    0,\\n    { group: 'Color Bands' },\\n  );\\n  const colorBands2Steps = number('Config 2 - Steps', 5, { min: 1, max: 10, range: true, step: 1 }, 'Color Bands');\\n  const colorBands2Reverse = boolean('Config 2 - Reverse', false, 'Color Bands');\\n\\n  const colorBands3 = object<ColorBandSimpleConfig>(\\n    'Config 3 - json',\\n    {\\n      steps: 5,\\n      colors: ['pink', 'yellow', 'blue'],\\n    },\\n    'Color Bands',\\n  );\\n  const colorBands4 = object<ColorBandComplexConfig>(\\n    'Config 4 - json',\\n    [\\n      { color: 'red', gte: 0, lt: 20 },\\n      { color: 'green', gte: 20, lte: 40 },\\n      {\\n        color: 'blue',\\n        gt: 40,\\n        lte: {\\n          type: 'percentage',\\n          value: 100,\\n        },\\n      },\\n    ],\\n    'Color Bands',\\n  );\\n  const palette = getPalettes(colorBands2Steps)[colorBands2];\\n  const colorOptions = [, [colorBands1], colorBands2Reverse ? palette.reverse() : palette, colorBands3, colorBands4];\\n\\n  // Domain\\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'Domain');\\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'Domain');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'Domain');\\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'Domain');\\n\\n  // Ticks\\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\\n  const tickStrategy = customKnobs.multiSelect(\\n    'tick strategy',\\n    {\\n      Auto: 'auto',\\n      TickCount: 'count',\\n      TickPlacements: 'placements',\\n    },\\n    'auto',\\n    'select',\\n    'Ticks',\\n  );\\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\\n  const tickPlacements = customKnobs.numbersArray(\\n    'ticks(placements)',\\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\\n    undefined,\\n    'Ticks',\\n  );\\n\\n  // Other\\n  const debug = boolean('debug', false);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\\n\\n  const formatter = (d: number) => numeral(d).format('0.[0]');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\\n      <Bullet\\n        id=\\\"bullet\\\"\\n        subtype={subtype}\\n        colorBands={colorOptions[colorOptionIndex] as BulletColorConfig}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: 'The Title',\\n              subtitle: 'The Subtitle',\\n              domain: [start, end],\\n              niceDomain,\\n              ticks:\\n                tickStrategy[0] === 'count'\\n                  ? ticks\\n                  : tickStrategy[0] === 'placements'\\n                    ? () => tickPlacements\\n                    : undefined,\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              target: 85,\\n              value: 23,\\n              title: 'CPU',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 75,\\n              value: 98,\\n              title: 'Memory',\\n              // subtitle: 'percent',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 25,\\n              value: 35.5,\\n              title: 'Network In',\\n              subtitle: 'bandwidth',\\n              domain: [0, 200],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 25,\\n              value: 91,\\n              title: 'Network out',\\n              subtitle: 'available (percent)',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 600,\\n    height: 270,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const format = text('format', '0');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              target: 85,\n              value: 23,\n              title: 'CPU',\n              domain: [0, 100],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n            {\n              target: 75,\n              value: 98,\n              title: 'Memory',\n              // subtitle: 'percent',\n              domain: [0, 100],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n            {\n              target: 25,\n              value: 35.5,\n              title: 'Network In',\n              subtitle: 'bandwidth',\n              domain: [0, 200],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n            {\n              target: 25,\n              value: 91,\n              title: 'Network out',\n              subtitle: 'available (percent)',\n              domain: [0, 100],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 600,\n    height: 270,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              target: 85,\\n              value: 23,\\n              title: 'CPU',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 75,\\n              value: 98,\\n              title: 'Memory',\\n              // subtitle: 'percent',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 25,\\n              value: 35.5,\\n              title: 'Network In',\\n              subtitle: 'bandwidth',\\n              domain: [0, 200],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 25,\\n              value: 91,\\n              title: 'Network out',\\n              subtitle: 'available (percent)',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              value: 1320,\\n              title: 'Total requests',\\n              domain: [0, 2000],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n          [\\n            {\\n              target: 150,\\n              value: 483,\\n              title: 'Erroring Request duration millis',\\n              subtitle: '90th percentile',\\n              domain: [0, 500],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n          [\\n            {\\n              value: 12,\\n              title: 'Error rate',\\n              subtitle: 'percentage',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 500,\\n    height: 375,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const format = text('format', '0');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              value: 1320,\n              title: 'Total requests',\n              domain: [0, 2000],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n          [\n            {\n              target: 150,\n              value: 483,\n              title: 'Erroring Request duration millis',\n              subtitle: '90th percentile',\n              domain: [0, 500],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n          [\n            {\n              value: 12,\n              title: 'Error rate',\n              subtitle: 'percentage',\n              domain: [0, 100],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 375,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              value: 1320,\\n              title: 'Total requests',\\n              domain: [0, 2000],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n          [\\n            {\\n              target: 150,\\n              value: 483,\\n              title: 'Erroring Request duration millis',\\n              subtitle: '90th percentile',\\n              domain: [0, 500],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n          [\\n            {\\n              value: 12,\\n              title: 'Error rate',\\n              subtitle: 'percentage',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings, Tooltip } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const hideTooltip = boolean('hide tooltip', false);\\n  const syncCursor = boolean('sync cursor', false);\\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\\n  const valueFormat = text('valueFormat', '0');\\n  const targetFormat = text('targetFormat', '');\\n  const tickFormat = text('tickFormat', '0[.]00');\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\\n\\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        tickSnapStep={tickSnapStep}\\n        data={[\\n          [\\n            {\\n              target: 10,\\n              value: 23,\\n              title: 'Network inbound error rate',\\n              // subtitle: 'First row first column subtitle',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n            {\\n              target: 67,\\n              value: 123,\\n              title: 'Network outbound',\\n              subtitle: 'error rate (%)',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n          ],\\n          [\\n            {\\n              target: 50,\\n              value: 11,\\n              title: 'Number of requests',\\n              subtitle: 'Requests per second',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n            {\\n              target: 80,\\n              value: 92,\\n              title: 'Second row second column title',\\n              subtitle: 'percentage',\\n              syncCursor,\\n              domain: [0, 200],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `You can apply different formatter for ticks and values using\\n      different formats for \\\\`tickFormatter\\\\` and \\\\`valueFormatter\\\\`.\\n\\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\\n  resize: {\\n    width: 550,\\n    height: 640,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings, Tooltip } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const hideTooltip = boolean('hide tooltip', false);\n  const syncCursor = boolean('sync cursor', false);\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\n  const valueFormat = text('valueFormat', '0');\n  const targetFormat = text('targetFormat', '');\n  const tickFormat = text('tickFormat', '0[.]00');\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\n\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        tickSnapStep={tickSnapStep}\n        data={[\n          [\n            {\n              target: 10,\n              value: 23,\n              title: 'Network inbound error rate',\n              // subtitle: 'First row first column subtitle',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 67,\n              value: 123,\n              title: 'Network outbound',\n              subtitle: 'error rate (%)',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n          [\n            {\n              target: 50,\n              value: 11,\n              title: 'Number of requests',\n              subtitle: 'Requests per second',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 80,\n              value: 92,\n              title: 'Second row second column title',\n              subtitle: 'percentage',\n              syncCursor,\n              domain: [0, 200],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can apply different formatter for ticks and values using\n      different formats for \\`tickFormatter\\` and \\`valueFormatter\\`.\n\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\n  resize: {\n    width: 550,\n    height: 640,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const hideTooltip = boolean('hide tooltip', false);\\n  const syncCursor = boolean('sync cursor', false);\\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\\n  const valueFormat = text('valueFormat', '0');\\n  const targetFormat = text('targetFormat', '');\\n  const tickFormat = text('tickFormat', '0[.]00');\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\\n\\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        tickSnapStep={tickSnapStep}\\n        data={[\\n          [\\n            {\\n              target: 10,\\n              value: 23,\\n              title: 'Network inbound error rate',\\n              // subtitle: 'First row first column subtitle',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n            {\\n              target: 67,\\n              value: 123,\\n              title: 'Network outbound',\\n              subtitle: 'error rate (%)',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n          ],\\n          [\\n            {\\n              target: 50,\\n              value: 11,\\n              title: 'Number of requests',\\n              subtitle: 'Requests per second',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n            {\\n              target: 80,\\n              value: 92,\\n              title: 'Second row second column title',\\n              subtitle: 'percentage',\\n              syncCursor,\\n              domain: [0, 200],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Bullet Graph',\n};\n\nexport { Example as single } from './1_single.story';\nexport { Example as angular } from './2_angular.story';\nexport { Example as colorBands } from './3_color_bands.story';\nexport { Example as singleRow } from './4_single_row.story';\nexport { Example as singleColumn } from './5_single_column.story';\nexport { Example as grid } from './6_grid.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { select, boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  HistogramBarSeries,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Tooltip,\\n  TooltipAction,\\n} from '@elastic/charts';\\n\\nimport { DATA_SERIES } from './data/series';\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\nimport { SB_SOURCE_PANEL } from '../../utils/storybook';\\nimport { wait } from '../../utils/utils';\\n\\nconst formatter = new Intl.DateTimeFormat('en-US', {\\n  year: 'numeric',\\n  month: 'numeric',\\n  day: 'numeric',\\n  hour: 'numeric',\\n  minute: 'numeric',\\n});\\nconst tooltipDateFormatter = (d: number) => formatter.format(d);\\nconst stringPluralize = (d: unknown[]) => (d.length > 1 ? 's' : '');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const chartType = select('chart type', { bar: 'bar', line: 'line' }, 'line');\\n  const reduceData = boolean('reduce data', false);\\n  const asyncDelay = number('async actions delay', 0, { step: 100, min: 0 });\\n  const disableActions = boolean('disable actions', false);\\n\\n  const actions: TooltipAction[] = [\\n    {\\n      disabled: (d) => d.length !== 1,\\n      label: (d) => (d.length !== 1 ? 'Select to drilldown' : `Drilldown to ${d[0].label}`),\\n      onSelect: (s) => action('drilldown to')(s[0].label),\\n    },\\n    {\\n      label: () => `Filter this 30s time bucket`,\\n      onSelect: (s) => action('filter time bucket')(s[0].datum.timestamp),\\n    },\\n    {\\n      disabled: (d) => d.length < 1,\\n      label: (d) => (d.length < 1 ? 'Select to filter host IDs' : `Filter by ${d.length} host ID${stringPluralize(d)}`),\\n      onSelect: (s) => action('filter')(s.map((d) => d.label)),\\n    },\\n    {\\n      disabled: (d) => d.length < 1,\\n      label: (d) => (d.length < 1 ? 'Select to copy host IDs' : `Copy ${d.length} host ID${stringPluralize(d)}`),\\n      onSelect: (s) => action('copy')(s.map((d) => d.label)),\\n    },\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          axes: { tickLine: { visible: true } },\\n          barSeriesStyle: {\\n            rect: {\\n              opacity: 0.9,\\n            },\\n          },\\n          lineSeriesStyle: {\\n            point: { visible: false },\\n          },\\n        }}\\n      />\\n      <Tooltip\\n        type={customKnobs.enum.tooltipType()}\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={disableActions ? [] : asyncDelay > 0 ? () => wait(asyncDelay, () => actions) : actions}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        position={Position.Bottom}\\n        gridLine={{\\n          visible: true,\\n        }}\\n        style={{\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n        }}\\n        tickFormat={tooltipDateFormatter}\\n        timeAxisLayerCount={2}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        position={Position.Right}\\n        gridLine={{\\n          visible: true,\\n        }}\\n        ticks={4}\\n        tickFormat={(d) => `${Number(d * 100).toFixed(0)}`}\\n      />\\n      {DATA_SERIES.map((d) => {\\n        const data = d.timeseries.rows.slice(0, reduceData ? 20 : undefined);\\n        return chartType === 'bar' ? (\\n          <HistogramBarSeries\\n            key={d.name}\\n            id={d.name}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"timestamp\\\"\\n            yAccessors={['metric_0']}\\n            stackAccessors={['yes']}\\n            yNice\\n            data={data}\\n          />\\n        ) : (\\n          <LineSeries\\n            key={d.name}\\n            id={d.name}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"timestamp\\\"\\n            yAccessors={['metric_0']}\\n            yNice\\n            data={data}\\n          />\\n        );\\n      })}\\n    </Chart>\\n  );\\n};\\n\\n// storybook configuration\\nExample.parameters = {\\n  options: { selectedPanel: SB_SOURCE_PANEL },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":147},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":147}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { select, boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  HistogramBarSeries,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  Tooltip,\n  TooltipAction,\n} from '@elastic/charts';\n\nimport { DATA_SERIES } from './data/series';\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\nimport { SB_SOURCE_PANEL } from '../../utils/storybook';\nimport { wait } from '../../utils/utils';\n\nconst formatter = new Intl.DateTimeFormat('en-US', {\n  year: 'numeric',\n  month: 'numeric',\n  day: 'numeric',\n  hour: 'numeric',\n  minute: 'numeric',\n});\nconst tooltipDateFormatter = (d: number) => formatter.format(d);\nconst stringPluralize = (d: unknown[]) => (d.length > 1 ? 's' : '');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const chartType = select('chart type', { bar: 'bar', line: 'line' }, 'line');\n  const reduceData = boolean('reduce data', false);\n  const asyncDelay = number('async actions delay', 0, { step: 100, min: 0 });\n  const disableActions = boolean('disable actions', false);\n\n  const actions: TooltipAction[] = [\n    {\n      disabled: (d) => d.length !== 1,\n      label: (d) => (d.length !== 1 ? 'Select to drilldown' : `Drilldown to ${d[0].label}`),\n      onSelect: (s) => action('drilldown to')(s[0].label),\n    },\n    {\n      label: () => `Filter this 30s time bucket`,\n      onSelect: (s) => action('filter time bucket')(s[0].datum.timestamp),\n    },\n    {\n      disabled: (d) => d.length < 1,\n      label: (d) => (d.length < 1 ? 'Select to filter host IDs' : `Filter by ${d.length} host ID${stringPluralize(d)}`),\n      onSelect: (s) => action('filter')(s.map((d) => d.label)),\n    },\n    {\n      disabled: (d) => d.length < 1,\n      label: (d) => (d.length < 1 ? 'Select to copy host IDs' : `Copy ${d.length} host ID${stringPluralize(d)}`),\n      onSelect: (s) => action('copy')(s.map((d) => d.label)),\n    },\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        theme={{\n          axes: { tickLine: { visible: true } },\n          barSeriesStyle: {\n            rect: {\n              opacity: 0.9,\n            },\n          },\n          lineSeriesStyle: {\n            point: { visible: false },\n          },\n        }}\n      />\n      <Tooltip\n        type={customKnobs.enum.tooltipType()}\n        maxVisibleTooltipItems={4}\n        maxTooltipItems={4}\n        actions={disableActions ? [] : asyncDelay > 0 ? () => wait(asyncDelay, () => actions) : actions}\n      />\n      <Axis\n        id=\"x\"\n        position={Position.Bottom}\n        gridLine={{\n          visible: true,\n        }}\n        style={{\n          tickLine: { size: 0.0001, padding: 4 },\n          tickLabel: {\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n            padding: 0,\n            offset: { x: 0, y: 0 },\n          },\n        }}\n        tickFormat={tooltipDateFormatter}\n        timeAxisLayerCount={2}\n      />\n      <Axis\n        id=\"left\"\n        position={Position.Right}\n        gridLine={{\n          visible: true,\n        }}\n        ticks={4}\n        tickFormat={(d) => `${Number(d * 100).toFixed(0)}`}\n      />\n      {DATA_SERIES.map((d) => {\n        const data = d.timeseries.rows.slice(0, reduceData ? 20 : undefined);\n        return chartType === 'bar' ? (\n          <HistogramBarSeries\n            key={d.name}\n            id={d.name}\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor=\"timestamp\"\n            yAccessors={['metric_0']}\n            stackAccessors={['yes']}\n            yNice\n            data={data}\n          />\n        ) : (\n          <LineSeries\n            key={d.name}\n            id={d.name}\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor=\"timestamp\"\n            yAccessors={['metric_0']}\n            yNice\n            data={data}\n          />\n        );\n      })}\n    </Chart>\n  );\n};\n\n// storybook configuration\nExample.parameters = {\n  options: { selectedPanel: SB_SOURCE_PANEL },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const chartType = select('chart type', { bar: 'bar', line: 'line' }, 'line');\\n  const reduceData = boolean('reduce data', false);\\n  const asyncDelay = number('async actions delay', 0, { step: 100, min: 0 });\\n  const disableActions = boolean('disable actions', false);\\n\\n  const actions: TooltipAction[] = [\\n    {\\n      disabled: (d) => d.length !== 1,\\n      label: (d) => (d.length !== 1 ? 'Select to drilldown' : `Drilldown to ${d[0].label}`),\\n      onSelect: (s) => action('drilldown to')(s[0].label),\\n    },\\n    {\\n      label: () => `Filter this 30s time bucket`,\\n      onSelect: (s) => action('filter time bucket')(s[0].datum.timestamp),\\n    },\\n    {\\n      disabled: (d) => d.length < 1,\\n      label: (d) => (d.length < 1 ? 'Select to filter host IDs' : `Filter by ${d.length} host ID${stringPluralize(d)}`),\\n      onSelect: (s) => action('filter')(s.map((d) => d.label)),\\n    },\\n    {\\n      disabled: (d) => d.length < 1,\\n      label: (d) => (d.length < 1 ? 'Select to copy host IDs' : `Copy ${d.length} host ID${stringPluralize(d)}`),\\n      onSelect: (s) => action('copy')(s.map((d) => d.label)),\\n    },\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          axes: { tickLine: { visible: true } },\\n          barSeriesStyle: {\\n            rect: {\\n              opacity: 0.9,\\n            },\\n          },\\n          lineSeriesStyle: {\\n            point: { visible: false },\\n          },\\n        }}\\n      />\\n      <Tooltip\\n        type={customKnobs.enum.tooltipType()}\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={disableActions ? [] : asyncDelay > 0 ? () => wait(asyncDelay, () => actions) : actions}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        position={Position.Bottom}\\n        gridLine={{\\n          visible: true,\\n        }}\\n        style={{\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n        }}\\n        tickFormat={tooltipDateFormatter}\\n        timeAxisLayerCount={2}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        position={Position.Right}\\n        gridLine={{\\n          visible: true,\\n        }}\\n        ticks={4}\\n        tickFormat={(d) => `${Number(d * 100).toFixed(0)}`}\\n      />\\n      {DATA_SERIES.map((d) => {\\n        const data = d.timeseries.rows.slice(0, reduceData ? 20 : undefined);\\n        return chartType === 'bar' ? (\\n          <HistogramBarSeries\\n            key={d.name}\\n            id={d.name}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"timestamp\\\"\\n            yAccessors={['metric_0']}\\n            stackAccessors={['yes']}\\n            yNice\\n            data={data}\\n          />\\n        ) : (\\n          <LineSeries\\n            key={d.name}\\n            id={d.name}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"timestamp\\\"\\n            yAccessors={['metric_0']}\\n            yNice\\n            data={data}\\n          />\\n        );\\n      })}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n  Color,\\n  Tooltip,\\n  TooltipAction,\\n  TooltipValue,\\n} from '@elastic/charts';\\nimport { Layer } from '@elastic/charts/src/chart_types/partition_chart/specs';\\nimport { combineColors } from '@elastic/charts/src/common/color_calcs';\\nimport { colorToRgba, RGBATupleToString } from '@elastic/charts/src/common/color_library_wrappers';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    maxFontSize: 18,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nfunction plainColor(foreground: Color, bg: Color): Color {\\n  return RGBATupleToString(combineColors(colorToRgba(foreground), colorToRgba(bg)));\\n}\\n\\nconst stringPluralize = (d: unknown[], one: string, many: string) => (d.length > 1 ? many : one);\\n\\nconst actionByDepth = (depth: number): TooltipAction => {\\n  const name = depth === 1 ? 'categor' : depth === 2 ? 'continent' : 'countr';\\n  const pluralize = depth === 1 ? ['y', 'ies'] : depth === 2 ? ['', 's'] : ['y', 'ies'];\\n  const filter = (d: TooltipValue) => d.valueAccessor === depth;\\n  const actionName = (d: unknown[]) => `${name}${stringPluralize(d, pluralize[0], pluralize[1])}`;\\n  return {\\n    hide: (d) => d.some(filter), //  TODO we should double check this as it seems to work the opposite way\\n    disabled: (d) => d.filter(filter).length < 1,\\n    label: (d) => {\\n      const currentDepthValues = d.filter(filter);\\n      return currentDepthValues.length < 1\\n        ? `Select to filter ${actionName(currentDepthValues)}`\\n        : `Filter by ${currentDepthValues.length} ${actionName(currentDepthValues)}`;\\n    },\\n\\n    onSelect: (s) => action(`filter ${actionName(s.filter(filter))}`)(s.filter(filter).map((d) => d.label)),\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const layout = select<PartitionLayout>(\\n    'layout',\\n    {\\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\\n      [PartitionLayout.waffle]: PartitionLayout.waffle,\\n    },\\n    PartitionLayout.sunburst,\\n  );\\n  type PartitionDatum = (typeof mocks.miniSunburst)[0];\\n  const layers: Layer[] = [\\n    {\\n      groupByRollup: (d: PartitionDatum) => d.sitc1,\\n      nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex) => plainColor(discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex), 'white'),\\n      },\\n    },\\n    {\\n      groupByRollup: (d: PartitionDatum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n      nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex, node) =>\\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex), 'white'),\\n      },\\n    },\\n    {\\n      groupByRollup: (d: PartitionDatum) => d.dest,\\n      nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex, node) =>\\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex), 'white'),\\n      },\\n    },\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={() => {\\n          return [\\n            {\\n              disabled: (d) => d.length !== 1,\\n              label: (d) => {\\n                return d.length !== 1 ? 'Select one to drilldown' : `Drilldown to ${d[0].label}`;\\n              },\\n              onSelect: (s) => action('drilldown to')(s[0].label),\\n            },\\n            actionByDepth(1),\\n            actionByDepth(2),\\n            actionByDepth(3),\\n            {\\n              disabled: (d) => d.length < 1,\\n              label: (d) =>\\n                d.length < 1 ? 'Select to copy labels' : `Copy ${d.length} label${stringPluralize(d, '', 's')}`,\\n              onSelect: (s) => action('copy')(s.map((d) => d.label)),\\n            },\\n          ];\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.miniSunburst}\\n        layout={layout}\\n        valueAccessor={(d) => d.exportVal}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={layers.filter((d, i) => (layout === 'waffle' ? i === 0 : true))}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":90},\"endLoc\":{\"col\":1,\"line\":168},\"startBody\":{\"col\":36,\"line\":90},\"endBody\":{\"col\":1,\"line\":168}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n  Color,\n  Tooltip,\n  TooltipAction,\n  TooltipValue,\n} from '@elastic/charts';\nimport { Layer } from '@elastic/charts/src/chart_types/partition_chart/specs';\nimport { combineColors } from '@elastic/charts/src/common/color_calcs';\nimport { colorToRgba, RGBATupleToString } from '@elastic/charts/src/common/color_library_wrappers';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    maxFontSize: 18,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nfunction plainColor(foreground: Color, bg: Color): Color {\n  return RGBATupleToString(combineColors(colorToRgba(foreground), colorToRgba(bg)));\n}\n\nconst stringPluralize = (d: unknown[], one: string, many: string) => (d.length > 1 ? many : one);\n\nconst actionByDepth = (depth: number): TooltipAction => {\n  const name = depth === 1 ? 'categor' : depth === 2 ? 'continent' : 'countr';\n  const pluralize = depth === 1 ? ['y', 'ies'] : depth === 2 ? ['', 's'] : ['y', 'ies'];\n  const filter = (d: TooltipValue) => d.valueAccessor === depth;\n  const actionName = (d: unknown[]) => `${name}${stringPluralize(d, pluralize[0], pluralize[1])}`;\n  return {\n    hide: (d) => d.some(filter), //  TODO we should double check this as it seems to work the opposite way\n    disabled: (d) => d.filter(filter).length < 1,\n    label: (d) => {\n      const currentDepthValues = d.filter(filter);\n      return currentDepthValues.length < 1\n        ? `Select to filter ${actionName(currentDepthValues)}`\n        : `Filter by ${currentDepthValues.length} ${actionName(currentDepthValues)}`;\n    },\n\n    onSelect: (s) => action(`filter ${actionName(s.filter(filter))}`)(s.filter(filter).map((d) => d.label)),\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const layout = select<PartitionLayout>(\n    'layout',\n    {\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\n      [PartitionLayout.waffle]: PartitionLayout.waffle,\n    },\n    PartitionLayout.sunburst,\n  );\n  type PartitionDatum = (typeof mocks.miniSunburst)[0];\n  const layers: Layer[] = [\n    {\n      groupByRollup: (d: PartitionDatum) => d.sitc1,\n      nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\n      fillLabel: { maximizeFontSize: false },\n      shape: {\n        fillColor: (key, sortIndex) => plainColor(discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex), 'white'),\n      },\n    },\n    {\n      groupByRollup: (d: PartitionDatum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n      nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\n      fillLabel: { maximizeFontSize: false },\n      shape: {\n        fillColor: (key, sortIndex, node) =>\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex), 'white'),\n      },\n    },\n    {\n      groupByRollup: (d: PartitionDatum) => d.dest,\n      nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\n      fillLabel: { maximizeFontSize: false },\n      shape: {\n        fillColor: (key, sortIndex, node) =>\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex), 'white'),\n      },\n    },\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Tooltip\n        maxVisibleTooltipItems={4}\n        maxTooltipItems={4}\n        actions={() => {\n          return [\n            {\n              disabled: (d) => d.length !== 1,\n              label: (d) => {\n                return d.length !== 1 ? 'Select one to drilldown' : `Drilldown to ${d[0].label}`;\n              },\n              onSelect: (s) => action('drilldown to')(s[0].label),\n            },\n            actionByDepth(1),\n            actionByDepth(2),\n            actionByDepth(3),\n            {\n              disabled: (d) => d.length < 1,\n              label: (d) =>\n                d.length < 1 ? 'Select to copy labels' : `Copy ${d.length} label${stringPluralize(d, '', 's')}`,\n              onSelect: (s) => action('copy')(s.map((d) => d.label)),\n            },\n          ];\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.miniSunburst}\n        layout={layout}\n        valueAccessor={(d) => d.exportVal}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={layers.filter((d, i) => (layout === 'waffle' ? i === 0 : true))}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const layout = select<PartitionLayout>(\\n    'layout',\\n    {\\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\\n      [PartitionLayout.waffle]: PartitionLayout.waffle,\\n    },\\n    PartitionLayout.sunburst,\\n  );\\n  type PartitionDatum = (typeof mocks.miniSunburst)[0];\\n  const layers: Layer[] = [\\n    {\\n      groupByRollup: (d: PartitionDatum) => d.sitc1,\\n      nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex) => plainColor(discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex), 'white'),\\n      },\\n    },\\n    {\\n      groupByRollup: (d: PartitionDatum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n      nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex, node) =>\\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex), 'white'),\\n      },\\n    },\\n    {\\n      groupByRollup: (d: PartitionDatum) => d.dest,\\n      nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex, node) =>\\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex), 'white'),\\n      },\\n    },\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={() => {\\n          return [\\n            {\\n              disabled: (d) => d.length !== 1,\\n              label: (d) => {\\n                return d.length !== 1 ? 'Select one to drilldown' : `Drilldown to ${d[0].label}`;\\n              },\\n              onSelect: (s) => action('drilldown to')(s[0].label),\\n            },\\n            actionByDepth(1),\\n            actionByDepth(2),\\n            actionByDepth(3),\\n            {\\n              disabled: (d) => d.length < 1,\\n              label: (d) =>\\n                d.length < 1 ? 'Select to copy labels' : `Copy ${d.length} label${stringPluralize(d, '', 's')}`,\\n              onSelect: (s) => action('copy')(s.map((d) => d.label)),\\n            },\\n          ];\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.miniSunburst}\\n        layout={layout}\\n        valueAccessor={(d) => d.exportVal}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={layers.filter((d, i) => (layout === 'waffle' ? i === 0 : true))}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React, { ReactNode } from 'react';\\n\\nimport { Chart, Heatmap, Settings, Tooltip, TooltipValue } from '@elastic/charts';\\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\n\\nfunction boldMap(d: TooltipValue[]) {\\n  return d.reduce<ReactNode[]>(\\n    (acc, curr, i, array) => {\\n      acc.push(\\n        <b>\\n          {curr.label}:{curr.value}\\n        </b>,\\n      );\\n      if (array.length - 1 > i) {\\n        acc.push(' and ');\\n      }\\n      return acc;\\n    },\\n    ['Filter '],\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        brushAxis=\\\"both\\\"\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: 0,\\n              },\\n            },\\n            cell: {\\n              maxWidth: 'fill',\\n              border: {\\n                stroke: 'transparent',\\n                strokeWidth: 1,\\n              },\\n            },\\n            yAxisLabel: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        onBrushEnd={action('onBrushEnd')}\\n      />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={[\\n          {\\n            disabled: (d) => d.length !== 1,\\n            label: (d) =>\\n              d.length !== 1 ? (\\n                'Select one to drilldown'\\n              ) : (\\n                <span>\\n                  Drilldown to{' '}\\n                  <b>\\n                    {d[0].label}:{d[0].value}\\n                  </b>\\n                </span>\\n              ),\\n            onSelect: (s) => action('drilldown to')(s[0].label),\\n          },\\n          {\\n            label: (d) => (d.length < 1 ? 'Select to filter' : boldMap(d)),\\n            onSelect: (s) => action('filter categories')(s.map((d) => d.label)),\\n          },\\n        ]}\\n      />\\n      <Heatmap\\n        id=\\\"Number of births\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 1000, color: '#AADC32' },\\n            { start: 1000, end: 5000, color: '#35B779' },\\n            { start: 5000, end: 10000, color: '#24868E' },\\n            { start: 10000, end: 50000, color: '#3B528B' },\\n            { start: 50000, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={(d) => d[2]}\\n        yAccessor={(d) => d[0]}\\n        valueAccessor={(d) => d[3]}\\n        valueFormatter={(value) => value.toFixed(0.2)}\\n        xSortPredicate=\\\"alphaAsc\\\"\\n        yAxisLabelName=\\\"Year\\\"\\n        xAxisLabelName=\\\"Name\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":113},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":113}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React, { ReactNode } from 'react';\n\nimport { Chart, Heatmap, Settings, Tooltip, TooltipValue } from '@elastic/charts';\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\n\nfunction boldMap(d: TooltipValue[]) {\n  return d.reduce<ReactNode[]>(\n    (acc, curr, i, array) => {\n      acc.push(\n        <b>\n          {curr.label}:{curr.value}\n        </b>,\n      );\n      if (array.length - 1 > i) {\n        acc.push(' and ');\n      }\n      return acc;\n    },\n    ['Filter '],\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onElementClick={action('onElementClick')}\n        brushAxis=\"both\"\n        baseTheme={useBaseTheme()}\n        theme={{\n          heatmap: {\n            grid: {\n              stroke: {\n                width: 0,\n              },\n            },\n            cell: {\n              maxWidth: 'fill',\n              border: {\n                stroke: 'transparent',\n                strokeWidth: 1,\n              },\n            },\n            yAxisLabel: {\n              visible: true,\n            },\n          },\n        }}\n        onBrushEnd={action('onBrushEnd')}\n      />\n      <Tooltip\n        maxVisibleTooltipItems={4}\n        maxTooltipItems={4}\n        actions={[\n          {\n            disabled: (d) => d.length !== 1,\n            label: (d) =>\n              d.length !== 1 ? (\n                'Select one to drilldown'\n              ) : (\n                <span>\n                  Drilldown to{' '}\n                  <b>\n                    {d[0].label}:{d[0].value}\n                  </b>\n                </span>\n              ),\n            onSelect: (s) => action('drilldown to')(s[0].label),\n          },\n          {\n            label: (d) => (d.length < 1 ? 'Select to filter' : boldMap(d)),\n            onSelect: (s) => action('filter categories')(s.map((d) => d.label)),\n          },\n        ]}\n      />\n      <Heatmap\n        id=\"Number of births\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 1000, color: '#AADC32' },\n            { start: 1000, end: 5000, color: '#35B779' },\n            { start: 5000, end: 10000, color: '#24868E' },\n            { start: 10000, end: 50000, color: '#3B528B' },\n            { start: 50000, end: Infinity, color: '#471164' },\n          ],\n        }}\n        data={data}\n        xAccessor={(d) => d[2]}\n        yAccessor={(d) => d[0]}\n        valueAccessor={(d) => d[3]}\n        valueFormatter={(value) => value.toFixed(0.2)}\n        xSortPredicate=\"alphaAsc\"\n        yAxisLabelName=\"Year\"\n        xAxisLabelName=\"Name\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        brushAxis=\\\"both\\\"\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: 0,\\n              },\\n            },\\n            cell: {\\n              maxWidth: 'fill',\\n              border: {\\n                stroke: 'transparent',\\n                strokeWidth: 1,\\n              },\\n            },\\n            yAxisLabel: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        onBrushEnd={action('onBrushEnd')}\\n      />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={[\\n          {\\n            disabled: (d) => d.length !== 1,\\n            label: (d) =>\\n              d.length !== 1 ? (\\n                'Select one to drilldown'\\n              ) : (\\n                <span>\\n                  Drilldown to{' '}\\n                  <b>\\n                    {d[0].label}:{d[0].value}\\n                  </b>\\n                </span>\\n              ),\\n            onSelect: (s) => action('drilldown to')(s[0].label),\\n          },\\n          {\\n            label: (d) => (d.length < 1 ? 'Select to filter' : boldMap(d)),\\n            onSelect: (s) => action('filter categories')(s.map((d) => d.label)),\\n          },\\n        ]}\\n      />\\n      <Heatmap\\n        id=\\\"Number of births\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 1000, color: '#AADC32' },\\n            { start: 1000, end: 5000, color: '#35B779' },\\n            { start: 5000, end: 10000, color: '#24868E' },\\n            { start: 10000, end: 50000, color: '#3B528B' },\\n            { start: 50000, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={(d) => d[2]}\\n        yAccessor={(d) => d[0]}\\n        valueAccessor={(d) => d[3]}\\n        valueFormatter={(value) => value.toFixed(0.2)}\\n        xSortPredicate=\\\"alphaAsc\\\"\\n        yAxisLabelName=\\\"Year\\\"\\n        xAxisLabelName=\\\"Name\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, button } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Tooltip,\\n  Flame,\\n  Settings,\\n  FlameGlobalControl,\\n  FlameNodeControl,\\n  ColumnarViewModel,\\n} from '@elastic/charts';\\nimport columnarMock from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock_columnar.json';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\n\\nconst position = new Float32Array(columnarMock.position);\\nconst size = new Float32Array(columnarMock.size);\\n\\nconst rng = getRandomNumberGenerator();\\n\\nconst paletteColorBrewerCat12 = [\\n  [141, 211, 199],\\n  [255, 255, 179],\\n  [190, 186, 218],\\n  [251, 128, 114],\\n  [128, 177, 211],\\n  [253, 180, 98],\\n  [179, 222, 105],\\n  [252, 205, 229],\\n  [217, 217, 217],\\n  [188, 128, 189],\\n  [204, 235, 197],\\n  [255, 237, 111],\\n];\\n\\nconst columnarData: ColumnarViewModel = {\\n  label: columnarMock.label.map((index: number) => columnarMock.dictionary[index]), // reversing the dictionary encoding\\n  value: new Float64Array(columnarMock.value),\\n  // color: new Float32Array((columnarMock.color.match(/.{2}/g) ?? []).map((hex: string) => Number.parseInt(hex, 16) / 255)),\\n  color: new Float32Array(\\n    columnarMock.label.flatMap(() => [...paletteColorBrewerCat12[rng(0, 11)].map((c) => c / 255), 1]),\\n  ),\\n  position0: position, // new Float32Array([...position].slice(1)), // try with the wrong array length\\n  position1: position,\\n  size0: size,\\n  size1: size,\\n};\\n\\nconst noop = () => {};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\\n\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  button('Reset focus', () => {\\n    resetFocusControl();\\n  });\\n  button('Set focus on random node', () => {\\n    focusOnNodeControl(rng(0, 19));\\n  });\\n  const debug = boolean('Debug history', false);\\n  const showTooltipActions = boolean('Use tooltip actions', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={\\n          showTooltipActions\\n            ? [\\n                {\\n                  label: () => 'Open detail view',\\n                  onSelect: (s) => action('open detail view')(s[0].datum),\\n                },\\n                {\\n                  label: () => 'Zoom to',\\n                  onSelect: (s) => {\\n                    focusOnNodeControl(s[0]?.valueAccessor as number);\\n                  },\\n                },\\n              ]\\n            : undefined\\n        }\\n      />\\n      <Flame\\n        id=\\\"spec_1\\\"\\n        columnarData={columnarData}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={(value) => `${value}`}\\n        animation={{ duration: 500 }}\\n        controlProviderCallback={{\\n          resetFocus: (control) => (resetFocusControl = control),\\n          focusOnNode: (control) => (focusOnNodeControl = control),\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":64},\"endLoc\":{\"col\":1,\"line\":117},\"startBody\":{\"col\":36,\"line\":64},\"endBody\":{\"col\":1,\"line\":117}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, button } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Tooltip,\n  Flame,\n  Settings,\n  FlameGlobalControl,\n  FlameNodeControl,\n  ColumnarViewModel,\n} from '@elastic/charts';\nimport columnarMock from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock_columnar.json';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\n\nconst position = new Float32Array(columnarMock.position);\nconst size = new Float32Array(columnarMock.size);\n\nconst rng = getRandomNumberGenerator();\n\nconst paletteColorBrewerCat12 = [\n  [141, 211, 199],\n  [255, 255, 179],\n  [190, 186, 218],\n  [251, 128, 114],\n  [128, 177, 211],\n  [253, 180, 98],\n  [179, 222, 105],\n  [252, 205, 229],\n  [217, 217, 217],\n  [188, 128, 189],\n  [204, 235, 197],\n  [255, 237, 111],\n];\n\nconst columnarData: ColumnarViewModel = {\n  label: columnarMock.label.map((index: number) => columnarMock.dictionary[index]), // reversing the dictionary encoding\n  value: new Float64Array(columnarMock.value),\n  // color: new Float32Array((columnarMock.color.match(/.{2}/g) ?? []).map((hex: string) => Number.parseInt(hex, 16) / 255)),\n  color: new Float32Array(\n    columnarMock.label.flatMap(() => [...paletteColorBrewerCat12[rng(0, 11)].map((c) => c / 255), 1]),\n  ),\n  position0: position, // new Float32Array([...position].slice(1)), // try with the wrong array length\n  position1: position,\n  size0: size,\n  size1: size,\n};\n\nconst noop = () => {};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\n\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  button('Reset focus', () => {\n    resetFocusControl();\n  });\n  button('Set focus on random node', () => {\n    focusOnNodeControl(rng(0, 19));\n  });\n  const debug = boolean('Debug history', false);\n  const showTooltipActions = boolean('Use tooltip actions', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\n      <Tooltip\n        maxVisibleTooltipItems={4}\n        maxTooltipItems={4}\n        actions={\n          showTooltipActions\n            ? [\n                {\n                  label: () => 'Open detail view',\n                  onSelect: (s) => action('open detail view')(s[0].datum),\n                },\n                {\n                  label: () => 'Zoom to',\n                  onSelect: (s) => {\n                    focusOnNodeControl(s[0]?.valueAccessor as number);\n                  },\n                },\n              ]\n            : undefined\n        }\n      />\n      <Flame\n        id=\"spec_1\"\n        columnarData={columnarData}\n        valueAccessor={(d: Datum) => d.value as number}\n        valueFormatter={(value) => `${value}`}\n        animation={{ duration: 500 }}\n        controlProviderCallback={{\n          resetFocus: (control) => (resetFocusControl = control),\n          focusOnNode: (control) => (focusOnNodeControl = control),\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\\n\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  button('Reset focus', () => {\\n    resetFocusControl();\\n  });\\n  button('Set focus on random node', () => {\\n    focusOnNodeControl(rng(0, 19));\\n  });\\n  const debug = boolean('Debug history', false);\\n  const showTooltipActions = boolean('Use tooltip actions', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={\\n          showTooltipActions\\n            ? [\\n                {\\n                  label: () => 'Open detail view',\\n                  onSelect: (s) => action('open detail view')(s[0].datum),\\n                },\\n                {\\n                  label: () => 'Zoom to',\\n                  onSelect: (s) => {\\n                    focusOnNodeControl(s[0]?.valueAccessor as number);\\n                  },\\n                },\\n              ]\\n            : undefined\\n        }\\n      />\\n      <Flame\\n        id=\\\"spec_1\\\"\\n        columnarData={columnarData}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={(value) => `${value}`}\\n        animation={{ duration: 500 }}\\n        controlProviderCallback={{\\n          resetFocus: (control) => (resetFocusControl = control),\\n          focusOnNode: (control) => (focusOnNodeControl = control),\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { TooltipTable, TooltipTableColumn } from '@elastic/charts';\\nimport { isDefined } from '@elastic/charts/src/utils/common';\\n\\nimport { tableSimple, simple, long } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const maxVisibleTooltipItems = number('max visible tooltip items', 2);\\n  const dataSet = select(\\n    'dataSet',\\n    {\\n      'Simple - table': 'tableSimple',\\n      'Simple - list': 'simple',\\n      'Long - list': 'long',\\n    },\\n    'simple',\\n  );\\n  const dataSets = {\\n    tableSimple,\\n    simple,\\n    long,\\n  };\\n  const columns: TooltipTableColumn[] = [\\n    {\\n      id: 'label',\\n      type: 'custom',\\n      header: 'label',\\n      truncate: true,\\n      cell: ({ label }) => <span className=\\\"echTooltip__label\\\">{label}</span>,\\n      style: {\\n        textAlign: 'left',\\n      },\\n    },\\n    {\\n      id: 'value',\\n      type: 'custom',\\n      header: 'value',\\n      cell: ({ formattedValue }) => (\\n        <span className=\\\"echTooltip__value\\\" dir=\\\"ltr\\\">\\n          {formattedValue}\\n        </span>\\n      ),\\n      style: {\\n        textAlign: 'right',\\n      },\\n    },\\n    {\\n      id: 'markValue',\\n      type: 'custom',\\n      hidden: (items) => items.every(({ markValue }) => !markValue),\\n      cell: ({ markValue, formattedMarkValue }) =>\\n        isDefined(markValue) ? <span className=\\\"echTooltip__markValue\\\">&nbsp;({formattedMarkValue})</span> : null,\\n    },\\n  ];\\n  const showColor = boolean('show color', true);\\n  const pinned = boolean('pinned', false);\\n\\n  if (showColor) {\\n    columns.unshift({\\n      id: 'color',\\n      type: 'color',\\n    });\\n  }\\n\\n  return (\\n    <TooltipShowcase\\n      info={dataSets[dataSet]}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        maxVisibleTooltipItems,\\n        header: boolean('show default header', true) ? 'default' : 'none',\\n        body: boolean('show default body', false)\\n          ? 'default'\\n          : ({ items }) => (\\n              <TooltipTable columns={columns} items={items} onSelect={(s) => action('onTooltipAction')(s)} />\\n            ),\\n        actions: [\\n          {\\n            label: () => 'Log storybook action',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n        ],\\n      }}\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\\\\n  This example shows how you can build the default list tooltip by defining the \\\\`columns\\\\` on the \\\\`TooltipTable\\\\` component inside a \\\\`CustomTooltip\\\\`.`,\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":19},\"endLoc\":{\"col\":1,\"line\":99},\"startBody\":{\"col\":23,\"line\":19},\"endBody\":{\"col\":1,\"line\":99}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { TooltipTable, TooltipTableColumn } from '@elastic/charts';\nimport { isDefined } from '@elastic/charts/src/utils/common';\n\nimport { tableSimple, simple, long } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const maxVisibleTooltipItems = number('max visible tooltip items', 2);\n  const dataSet = select(\n    'dataSet',\n    {\n      'Simple - table': 'tableSimple',\n      'Simple - list': 'simple',\n      'Long - list': 'long',\n    },\n    'simple',\n  );\n  const dataSets = {\n    tableSimple,\n    simple,\n    long,\n  };\n  const columns: TooltipTableColumn[] = [\n    {\n      id: 'label',\n      type: 'custom',\n      header: 'label',\n      truncate: true,\n      cell: ({ label }) => <span className=\"echTooltip__label\">{label}</span>,\n      style: {\n        textAlign: 'left',\n      },\n    },\n    {\n      id: 'value',\n      type: 'custom',\n      header: 'value',\n      cell: ({ formattedValue }) => (\n        <span className=\"echTooltip__value\" dir=\"ltr\">\n          {formattedValue}\n        </span>\n      ),\n      style: {\n        textAlign: 'right',\n      },\n    },\n    {\n      id: 'markValue',\n      type: 'custom',\n      hidden: (items) => items.every(({ markValue }) => !markValue),\n      cell: ({ markValue, formattedMarkValue }) =>\n        isDefined(markValue) ? <span className=\"echTooltip__markValue\">&nbsp;({formattedMarkValue})</span> : null,\n    },\n  ];\n  const showColor = boolean('show color', true);\n  const pinned = boolean('pinned', false);\n\n  if (showColor) {\n    columns.unshift({\n      id: 'color',\n      type: 'color',\n    });\n  }\n\n  return (\n    <TooltipShowcase\n      info={dataSets[dataSet]}\n      pinned={pinned}\n      canPinTooltip\n      tooltip={{\n        maxVisibleTooltipItems,\n        header: boolean('show default header', true) ? 'default' : 'none',\n        body: boolean('show default body', false)\n          ? 'default'\n          : ({ items }) => (\n              <TooltipTable columns={columns} items={items} onSelect={(s) => action('onTooltipAction')(s)} />\n            ),\n        actions: [\n          {\n            label: () => 'Log storybook action',\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n        ],\n      }}\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\n  This example shows how you can build the default list tooltip by defining the \\`columns\\` on the \\`TooltipTable\\` component inside a \\`CustomTooltip\\`.`,\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const maxVisibleTooltipItems = number('max visible tooltip items', 2);\\n  const dataSet = select(\\n    'dataSet',\\n    {\\n      'Simple - table': 'tableSimple',\\n      'Simple - list': 'simple',\\n      'Long - list': 'long',\\n    },\\n    'simple',\\n  );\\n  const dataSets = {\\n    tableSimple,\\n    simple,\\n    long,\\n  };\\n  const columns: TooltipTableColumn[] = [\\n    {\\n      id: 'label',\\n      type: 'custom',\\n      header: 'label',\\n      truncate: true,\\n      cell: ({ label }) => <span className=\\\"echTooltip__label\\\">{label}</span>,\\n      style: {\\n        textAlign: 'left',\\n      },\\n    },\\n    {\\n      id: 'value',\\n      type: 'custom',\\n      header: 'value',\\n      cell: ({ formattedValue }) => (\\n        <span className=\\\"echTooltip__value\\\" dir=\\\"ltr\\\">\\n          {formattedValue}\\n        </span>\\n      ),\\n      style: {\\n        textAlign: 'right',\\n      },\\n    },\\n    {\\n      id: 'markValue',\\n      type: 'custom',\\n      hidden: (items) => items.every(({ markValue }) => !markValue),\\n      cell: ({ markValue, formattedMarkValue }) =>\\n        isDefined(markValue) ? <span className=\\\"echTooltip__markValue\\\">&nbsp;({formattedMarkValue})</span> : null,\\n    },\\n  ];\\n  const showColor = boolean('show color', true);\\n  const pinned = boolean('pinned', false);\\n\\n  if (showColor) {\\n    columns.unshift({\\n      id: 'color',\\n      type: 'color',\\n    });\\n  }\\n\\n  return (\\n    <TooltipShowcase\\n      info={dataSets[dataSet]}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        maxVisibleTooltipItems,\\n        header: boolean('show default header', true) ? 'default' : 'none',\\n        body: boolean('show default body', false)\\n          ? 'default'\\n          : ({ items }) => (\\n              <TooltipTable columns={columns} items={items} onSelect={(s) => action('onTooltipAction')(s)} />\\n            ),\\n        actions: [\\n          {\\n            label: () => 'Log storybook action',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n        ],\\n      }}\\n    />\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  TooltipTable,\\n  TooltipTableBody,\\n  TooltipTableHeader,\\n  TooltipTableFooter,\\n  TooltipTableRow,\\n  TooltipTableCell,\\n  TooltipTableColorCell,\\n  TooltipSpec,\\n  TooltipCellStyle,\\n} from '@elastic/charts';\\n\\nimport { tableSimple } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const pinned = boolean('pinned', false);\\n  const showColor = boolean('show color', true);\\n  const maxHeight = number('max table height', 120);\\n  const style: TooltipCellStyle = { textAlign: 'right' };\\n\\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\\n    return (\\n      <TooltipTable gridTemplateColumns={`repeat(${showColor ? 4 : 3}, auto)`} maxHeight={maxHeight}>\\n        <TooltipTableHeader>\\n          <TooltipTableRow>\\n            {showColor && <TooltipTableColorCell />}\\n            <TooltipTableCell>X Value</TooltipTableCell>\\n            <TooltipTableCell>Y Value</TooltipTableCell>\\n            <TooltipTableCell>Z Value</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableHeader>\\n        <TooltipTableBody>\\n          {items.map(({ datum, seriesIdentifier: { key }, color }) => (\\n            <TooltipTableRow key={`${key}-${datum.x}`}>\\n              {showColor && <TooltipTableColorCell color={color} />}\\n              <TooltipTableCell style={style}>{datum.x}</TooltipTableCell>\\n              <TooltipTableCell style={style}>{datum.y}</TooltipTableCell>\\n              <TooltipTableCell style={style}>{datum.z}</TooltipTableCell>\\n            </TooltipTableRow>\\n          ))}\\n        </TooltipTableBody>\\n        <TooltipTableFooter>\\n          <TooltipTableRow>\\n            {showColor && <TooltipTableColorCell />}\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { x } }) => s + x, 0)}</TooltipTableCell>\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { y } }) => s + y, 0)}</TooltipTableCell>\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { z } }) => s + z, 0)}</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableFooter>\\n      </TooltipTable>\\n    );\\n  };\\n  return <TooltipShowcase info={tableSimple} pinned={pinned} tooltip={{ body: TooltipBody }} />;\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\\\\n  This example shows how you can build a tabular tooltip by structuring the table components explicitly within \\\\`TooltipTable\\\\` instead of using the \\\\`columns\\\\` option.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":27},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":23,\"line\":27},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  TooltipTable,\n  TooltipTableBody,\n  TooltipTableHeader,\n  TooltipTableFooter,\n  TooltipTableRow,\n  TooltipTableCell,\n  TooltipTableColorCell,\n  TooltipSpec,\n  TooltipCellStyle,\n} from '@elastic/charts';\n\nimport { tableSimple } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const pinned = boolean('pinned', false);\n  const showColor = boolean('show color', true);\n  const maxHeight = number('max table height', 120);\n  const style: TooltipCellStyle = { textAlign: 'right' };\n\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\n    return (\n      <TooltipTable gridTemplateColumns={`repeat(${showColor ? 4 : 3}, auto)`} maxHeight={maxHeight}>\n        <TooltipTableHeader>\n          <TooltipTableRow>\n            {showColor && <TooltipTableColorCell />}\n            <TooltipTableCell>X Value</TooltipTableCell>\n            <TooltipTableCell>Y Value</TooltipTableCell>\n            <TooltipTableCell>Z Value</TooltipTableCell>\n          </TooltipTableRow>\n        </TooltipTableHeader>\n        <TooltipTableBody>\n          {items.map(({ datum, seriesIdentifier: { key }, color }) => (\n            <TooltipTableRow key={`${key}-${datum.x}`}>\n              {showColor && <TooltipTableColorCell color={color} />}\n              <TooltipTableCell style={style}>{datum.x}</TooltipTableCell>\n              <TooltipTableCell style={style}>{datum.y}</TooltipTableCell>\n              <TooltipTableCell style={style}>{datum.z}</TooltipTableCell>\n            </TooltipTableRow>\n          ))}\n        </TooltipTableBody>\n        <TooltipTableFooter>\n          <TooltipTableRow>\n            {showColor && <TooltipTableColorCell />}\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { x } }) => s + x, 0)}</TooltipTableCell>\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { y } }) => s + y, 0)}</TooltipTableCell>\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { z } }) => s + z, 0)}</TooltipTableCell>\n          </TooltipTableRow>\n        </TooltipTableFooter>\n      </TooltipTable>\n    );\n  };\n  return <TooltipShowcase info={tableSimple} pinned={pinned} tooltip={{ body: TooltipBody }} />;\n};\n\nExample.parameters = {\n  showHeader: true,\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\n  This example shows how you can build a tabular tooltip by structuring the table components explicitly within \\`TooltipTable\\` instead of using the \\`columns\\` option.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const pinned = boolean('pinned', false);\\n  const showColor = boolean('show color', true);\\n  const maxHeight = number('max table height', 120);\\n  const style: TooltipCellStyle = { textAlign: 'right' };\\n\\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\\n    return (\\n      <TooltipTable gridTemplateColumns={`repeat(${showColor ? 4 : 3}, auto)`} maxHeight={maxHeight}>\\n        <TooltipTableHeader>\\n          <TooltipTableRow>\\n            {showColor && <TooltipTableColorCell />}\\n            <TooltipTableCell>X Value</TooltipTableCell>\\n            <TooltipTableCell>Y Value</TooltipTableCell>\\n            <TooltipTableCell>Z Value</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableHeader>\\n        <TooltipTableBody>\\n          {items.map(({ datum, seriesIdentifier: { key }, color }) => (\\n            <TooltipTableRow key={`${key}-${datum.x}`}>\\n              {showColor && <TooltipTableColorCell color={color} />}\\n              <TooltipTableCell style={style}>{datum.x}</TooltipTableCell>\\n              <TooltipTableCell style={style}>{datum.y}</TooltipTableCell>\\n              <TooltipTableCell style={style}>{datum.z}</TooltipTableCell>\\n            </TooltipTableRow>\\n          ))}\\n        </TooltipTableBody>\\n        <TooltipTableFooter>\\n          <TooltipTableRow>\\n            {showColor && <TooltipTableColorCell />}\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { x } }) => s + x, 0)}</TooltipTableCell>\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { y } }) => s + y, 0)}</TooltipTableCell>\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { z } }) => s + z, 0)}</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableFooter>\\n      </TooltipTable>\\n    );\\n  };\\n  return <TooltipShowcase info={tableSimple} pinned={pinned} tooltip={{ body: TooltipBody }} />;\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { TooltipTable, TooltipTableColumn, XYChartSeriesIdentifier } from '@elastic/charts';\\n\\nimport { tableMultipleX } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const showColor = boolean('show color', true);\\n  const columns: TooltipTableColumn<any, XYChartSeriesIdentifier>[] = [\\n    { type: 'number', header: 'Value A', cell: ({ datum }) => datum.x },\\n    { type: 'number', header: 'Value B', cell: ({ datum }) => datum.y },\\n    { type: 'number', header: 'sum(A,B)', cell: ({ datum }) => datum.x + datum.y },\\n    { type: 'number', header: 'avg(A,B)', cell: ({ datum }) => ((datum.x + datum.y) / 2).toFixed(1) },\\n  ];\\n  if (showColor) {\\n    columns.unshift({ type: 'color' });\\n  }\\n\\n  return (\\n    <TooltipShowcase\\n      info={tableMultipleX}\\n      tooltip={{ body: ({ items }) => <TooltipTable items={items} columns={columns} /> }}\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":17},\"endLoc\":{\"col\":1,\"line\":35},\"startBody\":{\"col\":23,\"line\":17},\"endBody\":{\"col\":1,\"line\":35}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { TooltipTable, TooltipTableColumn, XYChartSeriesIdentifier } from '@elastic/charts';\n\nimport { tableMultipleX } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const showColor = boolean('show color', true);\n  const columns: TooltipTableColumn<any, XYChartSeriesIdentifier>[] = [\n    { type: 'number', header: 'Value A', cell: ({ datum }) => datum.x },\n    { type: 'number', header: 'Value B', cell: ({ datum }) => datum.y },\n    { type: 'number', header: 'sum(A,B)', cell: ({ datum }) => datum.x + datum.y },\n    { type: 'number', header: 'avg(A,B)', cell: ({ datum }) => ((datum.x + datum.y) / 2).toFixed(1) },\n  ];\n  if (showColor) {\n    columns.unshift({ type: 'color' });\n  }\n\n  return (\n    <TooltipShowcase\n      info={tableMultipleX}\n      tooltip={{ body: ({ items }) => <TooltipTable items={items} columns={columns} /> }}\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const showColor = boolean('show color', true);\\n  const columns: TooltipTableColumn<any, XYChartSeriesIdentifier>[] = [\\n    { type: 'number', header: 'Value A', cell: ({ datum }) => datum.x },\\n    { type: 'number', header: 'Value B', cell: ({ datum }) => datum.y },\\n    { type: 'number', header: 'sum(A,B)', cell: ({ datum }) => datum.x + datum.y },\\n    { type: 'number', header: 'avg(A,B)', cell: ({ datum }) => ((datum.x + datum.y) / 2).toFixed(1) },\\n  ];\\n  if (showColor) {\\n    columns.unshift({ type: 'color' });\\n  }\\n\\n  return (\\n    <TooltipShowcase\\n      info={tableMultipleX}\\n      tooltip={{ body: ({ items }) => <TooltipTable items={items} columns={columns} /> }}\\n    />\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  TooltipTable,\\n  TooltipTableBody,\\n  TooltipTableHeader,\\n  TooltipTableRow,\\n  TooltipTableCell,\\n  TooltipTableColorCell,\\n  TooltipAction,\\n  TooltipSpec,\\n  useTooltipContext,\\n  SeriesIdentifier,\\n} from '@elastic/charts';\\n\\nimport { long } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const actions: TooltipAction<any, SeriesIdentifier>[] = [\\n    {\\n      label: () => 'Log storybook action',\\n      onSelect: (s) => action('onTooltipAction')(s),\\n    },\\n    {\\n      label: ({ length }) => (\\n        <span>\\n          Alert keys of all <b>{length}</b> selected series\\n        </span>\\n      ),\\n      disabled: ({ length }) => (length < 1 ? 'Select at least one series' : false),\\n      onSelect: (series) =>\\n        alert(`Selected the following: \\\\n - ${series.map((s) => s.seriesIdentifier.key).join('\\\\n - ')}`),\\n    },\\n  ];\\n\\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\\n    const { pinned, selected, toggleSelected } = useTooltipContext();\\n    return (\\n      <TooltipTable maxHeight={100} gridTemplateColumns=\\\"11px auto auto\\\">\\n        <TooltipTableHeader>\\n          <TooltipTableRow>\\n            <TooltipTableColorCell />\\n            <TooltipTableCell style={{ textAlign: 'left' }}>Category</TooltipTableCell>\\n            <TooltipTableCell style={{ textAlign: 'right' }}>Value</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableHeader>\\n        <TooltipTableBody>\\n          {items.map((value) => {\\n            const onSelect = () => toggleSelected(value);\\n            return (\\n              <TooltipTableRow\\n                isSelected={pinned && selected.includes(value)}\\n                onSelect={onSelect}\\n                key={`${value.seriesIdentifier.key}-${value.datum.x}`}\\n              >\\n                <TooltipTableColorCell color={value.color} />\\n                <TooltipTableCell style={{ textAlign: 'left' }}>{value.label}</TooltipTableCell>\\n                <TooltipTableCell style={{ textAlign: 'right' }}>{value.formattedValue}</TooltipTableCell>\\n              </TooltipTableRow>\\n            );\\n          })}\\n        </TooltipTableBody>\\n      </TooltipTable>\\n    );\\n  };\\n  return (\\n    <TooltipShowcase\\n      info={long}\\n      pinned={boolean('pinned', false)}\\n      tooltip={{\\n        actions,\\n        body: TooltipBody,\\n        header: boolean('show header', true) ? ({ header }) => <>Time: {header?.formattedValue}</> : ('none' as const),\\n        footer: boolean('show footer', true) ? ({ items }) => <>Total of {items.length} categories</> : 'none',\\n      }}\\n      canPinTooltip\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\\\\n  This example shows how you can build a tabular tooltip by structuring the table components explicitly within \\\\`TooltipTable\\\\` instead of using the \\\\`columns\\\\` option.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":29},\"endLoc\":{\"col\":1,\"line\":90},\"startBody\":{\"col\":23,\"line\":29},\"endBody\":{\"col\":1,\"line\":90}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  TooltipTable,\n  TooltipTableBody,\n  TooltipTableHeader,\n  TooltipTableRow,\n  TooltipTableCell,\n  TooltipTableColorCell,\n  TooltipAction,\n  TooltipSpec,\n  useTooltipContext,\n  SeriesIdentifier,\n} from '@elastic/charts';\n\nimport { long } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const actions: TooltipAction<any, SeriesIdentifier>[] = [\n    {\n      label: () => 'Log storybook action',\n      onSelect: (s) => action('onTooltipAction')(s),\n    },\n    {\n      label: ({ length }) => (\n        <span>\n          Alert keys of all <b>{length}</b> selected series\n        </span>\n      ),\n      disabled: ({ length }) => (length < 1 ? 'Select at least one series' : false),\n      onSelect: (series) =>\n        alert(`Selected the following: \\n - ${series.map((s) => s.seriesIdentifier.key).join('\\n - ')}`),\n    },\n  ];\n\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\n    const { pinned, selected, toggleSelected } = useTooltipContext();\n    return (\n      <TooltipTable maxHeight={100} gridTemplateColumns=\"11px auto auto\">\n        <TooltipTableHeader>\n          <TooltipTableRow>\n            <TooltipTableColorCell />\n            <TooltipTableCell style={{ textAlign: 'left' }}>Category</TooltipTableCell>\n            <TooltipTableCell style={{ textAlign: 'right' }}>Value</TooltipTableCell>\n          </TooltipTableRow>\n        </TooltipTableHeader>\n        <TooltipTableBody>\n          {items.map((value) => {\n            const onSelect = () => toggleSelected(value);\n            return (\n              <TooltipTableRow\n                isSelected={pinned && selected.includes(value)}\n                onSelect={onSelect}\n                key={`${value.seriesIdentifier.key}-${value.datum.x}`}\n              >\n                <TooltipTableColorCell color={value.color} />\n                <TooltipTableCell style={{ textAlign: 'left' }}>{value.label}</TooltipTableCell>\n                <TooltipTableCell style={{ textAlign: 'right' }}>{value.formattedValue}</TooltipTableCell>\n              </TooltipTableRow>\n            );\n          })}\n        </TooltipTableBody>\n      </TooltipTable>\n    );\n  };\n  return (\n    <TooltipShowcase\n      info={long}\n      pinned={boolean('pinned', false)}\n      tooltip={{\n        actions,\n        body: TooltipBody,\n        header: boolean('show header', true) ? ({ header }) => <>Time: {header?.formattedValue}</> : ('none' as const),\n        footer: boolean('show footer', true) ? ({ items }) => <>Total of {items.length} categories</> : 'none',\n      }}\n      canPinTooltip\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\n  This example shows how you can build a tabular tooltip by structuring the table components explicitly within \\`TooltipTable\\` instead of using the \\`columns\\` option.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const actions: TooltipAction<any, SeriesIdentifier>[] = [\\n    {\\n      label: () => 'Log storybook action',\\n      onSelect: (s) => action('onTooltipAction')(s),\\n    },\\n    {\\n      label: ({ length }) => (\\n        <span>\\n          Alert keys of all <b>{length}</b> selected series\\n        </span>\\n      ),\\n      disabled: ({ length }) => (length < 1 ? 'Select at least one series' : false),\\n      onSelect: (series) =>\\n        alert(`Selected the following: \\\\n - ${series.map((s) => s.seriesIdentifier.key).join('\\\\n - ')}`),\\n    },\\n  ];\\n\\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\\n    const { pinned, selected, toggleSelected } = useTooltipContext();\\n    return (\\n      <TooltipTable maxHeight={100} gridTemplateColumns=\\\"11px auto auto\\\">\\n        <TooltipTableHeader>\\n          <TooltipTableRow>\\n            <TooltipTableColorCell />\\n            <TooltipTableCell style={{ textAlign: 'left' }}>Category</TooltipTableCell>\\n            <TooltipTableCell style={{ textAlign: 'right' }}>Value</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableHeader>\\n        <TooltipTableBody>\\n          {items.map((value) => {\\n            const onSelect = () => toggleSelected(value);\\n            return (\\n              <TooltipTableRow\\n                isSelected={pinned && selected.includes(value)}\\n                onSelect={onSelect}\\n                key={`${value.seriesIdentifier.key}-${value.datum.x}`}\\n              >\\n                <TooltipTableColorCell color={value.color} />\\n                <TooltipTableCell style={{ textAlign: 'left' }}>{value.label}</TooltipTableCell>\\n                <TooltipTableCell style={{ textAlign: 'right' }}>{value.formattedValue}</TooltipTableCell>\\n              </TooltipTableRow>\\n            );\\n          })}\\n        </TooltipTableBody>\\n      </TooltipTable>\\n    );\\n  };\\n  return (\\n    <TooltipShowcase\\n      info={long}\\n      pinned={boolean('pinned', false)}\\n      tooltip={{\\n        actions,\\n        body: TooltipBody,\\n        header: boolean('show header', true) ? ({ header }) => <>Time: {header?.formattedValue}</> : ('none' as const),\\n        footer: boolean('show footer', true) ? ({ items }) => <>Total of {items.length} categories</> : 'none',\\n      }}\\n      canPinTooltip\\n    />\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { tableSimple, simple, long, partition } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const maxVisibleTooltipItems = number('max visible tooltip items', 3);\\n  const maxTooltipItems = number('max tooltip items', 3);\\n  const dataSet = select(\\n    'dataSet',\\n    {\\n      '4 elements': 'simple',\\n      '8 elements': 'long',\\n      'Simple - table': 'tableSimple',\\n      partition: 'partition',\\n    },\\n    'simple',\\n  );\\n  const dataSets = {\\n    tableSimple,\\n    simple,\\n    long,\\n    partition,\\n  };\\n\\n  const pinned = boolean('pinned', false);\\n\\n  return (\\n    <TooltipShowcase\\n      info={dataSets[dataSet]}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        maxVisibleTooltipItems,\\n        maxTooltipItems,\\n        actions: [\\n          {\\n            label: () => 'Drilldown to dashboard X',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            disabled: (d) => d.length < 1,\\n            label: (d) =>\\n              d.length < 1 ? 'Select to filter categories' : `Filter categor${d.length > 1 ? 'ies' : 'y'}`,\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            disabled: (d) => d.length < 1,\\n            label: (d) => (d.length < 1 ? 'Select to copy values' : `Copy value${d.length > 1 ? 's' : ''}`),\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            label: () => 'A long action label is truncated at max tooltip width',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n        ],\\n      }}\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\\\\n  This example shows how you can build the default list tooltip by defining the \\\\`columns\\\\` on the \\\\`TooltipTable\\\\` component inside a \\\\`CustomTooltip\\\\`.`,\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":16},\"endLoc\":{\"col\":1,\"line\":70},\"startBody\":{\"col\":23,\"line\":16},\"endBody\":{\"col\":1,\"line\":70}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { tableSimple, simple, long, partition } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const maxVisibleTooltipItems = number('max visible tooltip items', 3);\n  const maxTooltipItems = number('max tooltip items', 3);\n  const dataSet = select(\n    'dataSet',\n    {\n      '4 elements': 'simple',\n      '8 elements': 'long',\n      'Simple - table': 'tableSimple',\n      partition: 'partition',\n    },\n    'simple',\n  );\n  const dataSets = {\n    tableSimple,\n    simple,\n    long,\n    partition,\n  };\n\n  const pinned = boolean('pinned', false);\n\n  return (\n    <TooltipShowcase\n      info={dataSets[dataSet]}\n      pinned={pinned}\n      canPinTooltip\n      tooltip={{\n        maxVisibleTooltipItems,\n        maxTooltipItems,\n        actions: [\n          {\n            label: () => 'Drilldown to dashboard X',\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n          {\n            disabled: (d) => d.length < 1,\n            label: (d) =>\n              d.length < 1 ? 'Select to filter categories' : `Filter categor${d.length > 1 ? 'ies' : 'y'}`,\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n          {\n            disabled: (d) => d.length < 1,\n            label: (d) => (d.length < 1 ? 'Select to copy values' : `Copy value${d.length > 1 ? 's' : ''}`),\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n          {\n            label: () => 'A long action label is truncated at max tooltip width',\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n        ],\n      }}\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\n  This example shows how you can build the default list tooltip by defining the \\`columns\\` on the \\`TooltipTable\\` component inside a \\`CustomTooltip\\`.`,\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const maxVisibleTooltipItems = number('max visible tooltip items', 3);\\n  const maxTooltipItems = number('max tooltip items', 3);\\n  const dataSet = select(\\n    'dataSet',\\n    {\\n      '4 elements': 'simple',\\n      '8 elements': 'long',\\n      'Simple - table': 'tableSimple',\\n      partition: 'partition',\\n    },\\n    'simple',\\n  );\\n  const dataSets = {\\n    tableSimple,\\n    simple,\\n    long,\\n    partition,\\n  };\\n\\n  const pinned = boolean('pinned', false);\\n\\n  return (\\n    <TooltipShowcase\\n      info={dataSets[dataSet]}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        maxVisibleTooltipItems,\\n        maxTooltipItems,\\n        actions: [\\n          {\\n            label: () => 'Drilldown to dashboard X',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            disabled: (d) => d.length < 1,\\n            label: (d) =>\\n              d.length < 1 ? 'Select to filter categories' : `Filter categor${d.length > 1 ? 'ies' : 'y'}`,\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            disabled: (d) => d.length < 1,\\n            label: (d) => (d.length < 1 ? 'Select to copy values' : `Copy value${d.length > 1 ? 's' : ''}`),\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            label: () => 'A long action label is truncated at max tooltip width',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n        ],\\n      }}\\n    />\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { simple } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const pinned = boolean('pinned', true);\\n\\n  return (\\n    <TooltipShowcase\\n      info={simple}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        actionsLoading: \\\"I'm loading some actions...\\\",\\n        maxVisibleTooltipItems: 3,\\n        maxTooltipItems: 3,\\n        actions: (selected) => {\\n          return selected.length > 0\\n            ? new Promise((resolve) => {\\n                setTimeout(() => {\\n                  resolve([\\n                    {\\n                      label: () => `Async action on ${selected.length} selected`,\\n                      onSelect: (s) => action('onTooltipAction')(s),\\n                    },\\n                    {\\n                      label: () => `Sync action`,\\n                      onSelect: (s) => action('onTooltipAction')(s),\\n                    },\\n                  ]);\\n                }, 1000);\\n              })\\n            : [\\n                {\\n                  label: () => `Sync action`,\\n                  onSelect: (s) => action('onTooltipAction')(s),\\n                },\\n              ];\\n        },\\n      }}\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  background: { disable: true },\\n  markdown: 'Select a series to load async actions',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":16},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":23,\"line\":16},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { simple } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const pinned = boolean('pinned', true);\n\n  return (\n    <TooltipShowcase\n      info={simple}\n      pinned={pinned}\n      canPinTooltip\n      tooltip={{\n        actionsLoading: \"I'm loading some actions...\",\n        maxVisibleTooltipItems: 3,\n        maxTooltipItems: 3,\n        actions: (selected) => {\n          return selected.length > 0\n            ? new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve([\n                    {\n                      label: () => `Async action on ${selected.length} selected`,\n                      onSelect: (s) => action('onTooltipAction')(s),\n                    },\n                    {\n                      label: () => `Sync action`,\n                      onSelect: (s) => action('onTooltipAction')(s),\n                    },\n                  ]);\n                }, 1000);\n              })\n            : [\n                {\n                  label: () => `Sync action`,\n                  onSelect: (s) => action('onTooltipAction')(s),\n                },\n              ];\n        },\n      }}\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  background: { disable: true },\n  markdown: 'Select a series to load async actions',\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const pinned = boolean('pinned', true);\\n\\n  return (\\n    <TooltipShowcase\\n      info={simple}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        actionsLoading: \\\"I'm loading some actions...\\\",\\n        maxVisibleTooltipItems: 3,\\n        maxTooltipItems: 3,\\n        actions: (selected) => {\\n          return selected.length > 0\\n            ? new Promise((resolve) => {\\n                setTimeout(() => {\\n                  resolve([\\n                    {\\n                      label: () => `Async action on ${selected.length} selected`,\\n                      onSelect: (s) => action('onTooltipAction')(s),\\n                    },\\n                    {\\n                      label: () => `Sync action`,\\n                      onSelect: (s) => action('onTooltipAction')(s),\\n                    },\\n                  ]);\\n                }, 1000);\\n              })\\n            : [\\n                {\\n                  label: () => `Sync action`,\\n                  onSelect: (s) => action('onTooltipAction')(s),\\n                },\\n              ];\\n        },\\n      }}\\n    />\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './list';\nexport * from './table';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipInfo, XYChartSeriesIdentifier } from '@elastic/charts';\n\nexport const simple: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: {\n    valueAccessor: 'y1',\n    value: 0,\n    formattedValue: '2022-10-31 00:00:00.666',\n  },\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y1',\n      value: 1,\n      formattedValue: '1.00',\n      markValue: null,\n      color: '#54B399',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y2',\n      value: 4,\n      formattedValue: '4.00',\n      markValue: null,\n      color: '#6092C0',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y1',\n      value: 3,\n      formattedValue: '3.00',\n      markValue: null,\n      color: '#D36086',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y2',\n      value: 6,\n      formattedValue: '6.00',\n      markValue: null,\n      color: '#9170B8',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n  ],\n};\n\nexport const long: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: {\n    valueAccessor: 'y1',\n    value: 0,\n    formattedValue: '2022-10-31 00:00:00.666',\n  },\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y1',\n      value: 1,\n      formattedValue: '1.00',\n      markValue: null,\n      color: '#54B399',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y2',\n      value: 4,\n      formattedValue: '4.00',\n      markValue: null,\n      color: '#6092C0',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y1',\n      value: 3,\n      formattedValue: '3.00',\n      markValue: null,\n      color: '#D36086',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y2',\n      value: 6,\n      formattedValue: '6.00',\n      markValue: null,\n      color: '#9170B8',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars2}yAccessor{y1}splitAccessors{g-a}',\n        specId: 'bars2',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y1',\n      value: 1,\n      formattedValue: '1.00',\n      markValue: null,\n      color: '#54B399',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars2}yAccessor{y2}splitAccessors{g-a}',\n        specId: 'bars2',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y2',\n      value: 4,\n      formattedValue: '4.00',\n      markValue: null,\n      color: '#6092C0',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars2}yAccessor{y1}splitAccessors{g-b}',\n        specId: 'bars2',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y1',\n      value: 3,\n      formattedValue: '3.00',\n      markValue: null,\n      color: '#D36086',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars2}yAccessor{y2}splitAccessors{g-b}',\n        specId: 'bars2',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y2',\n      value: 6,\n      formattedValue: '6.00',\n      markValue: null,\n      color: '#9170B8',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n  ],\n};\n\nexport const partition: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: null,\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'EMEA',\n      value: 1,\n      formattedValue: '5.23M (50%)',\n      markValue: null,\n      color: '#72A4CD',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'Italy',\n      value: 4,\n      formattedValue: '2.51M (25%)',\n      markValue: null,\n      color: '#99BFDB',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'Tuscany',\n      value: 3,\n      formattedValue: '5.76k (0.5%)',\n      markValue: null,\n      color: '#CEE0EC',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n  ],\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport const DATA_SERIES = [\n  {\n    name: 'host-6942',\n    max: 0.4045874873797099,\n    value: 0.2962680558363597,\n    avg: 0.3063191495628821,\n    timeseries: {\n      id: 'user',\n      columns: [\n        { name: 'timestamp', type: 'date' },\n        { name: 'metric_0', type: 'number' },\n      ],\n      rows: [\n        { timestamp: 1667332800000, metric_0: 0.34874142706394196 },\n        { timestamp: 1667332830000, metric_0: 0.35777633388837177 },\n        { timestamp: 1667332860000, metric_0: 0.3244831711053848 },\n        { timestamp: 1667332890000, metric_0: 0.2811833620071411 },\n        { timestamp: 1667332920000, metric_0: 0.15896100302537283 },\n        { timestamp: 1667332950000, metric_0: 0.2559752066930135 },\n        { timestamp: 1667332980000, metric_0: 0.3839319944381714 },\n        { timestamp: 1667333010000, metric_0: 0.33599595725536346 },\n        { timestamp: 1667333040000, metric_0: 0.334477037191391 },\n        { timestamp: 1667333070000, metric_0: 0.31254007418950397 },\n        { timestamp: 1667333100000, metric_0: 0.2939229408899943 },\n        { timestamp: 1667333130000, metric_0: 0.2863461921612422 },\n        { timestamp: 1667333160000, metric_0: 0.367951621611913 },\n        { timestamp: 1667333190000, metric_0: 0.3177519639333089 },\n        { timestamp: 1667333220000, metric_0: 0.4045874873797099 },\n        { timestamp: 1667333250000, metric_0: 0.34589988986651105 },\n        { timestamp: 1667333280000, metric_0: 0.3585460086663564 },\n        { timestamp: 1667333310000, metric_0: 0.2979138692220052 },\n        { timestamp: 1667333340000, metric_0: 0.16280274093151093 },\n        { timestamp: 1667333370000, metric_0: 0.32333482801914215 },\n        { timestamp: 1667333400000, metric_0: 0.29096199075380963 },\n        { timestamp: 1667333430000, metric_0: 0.25330813725789386 },\n        { timestamp: 1667333460000, metric_0: 0.38834187388420105 },\n        { timestamp: 1667333490000, metric_0: 0.3326689153909683 },\n        { timestamp: 1667333520000, metric_0: 0.32251523931821185 },\n        { timestamp: 1667333550000, metric_0: 0.3552623987197876 },\n        { timestamp: 1667333580000, metric_0: 0.28945807615915936 },\n        { timestamp: 1667333610000, metric_0: 0.3198018620411555 },\n        { timestamp: 1667333640000, metric_0: 0.28636954228083294 },\n        { timestamp: 1667333670000, metric_0: 0.3299245585997899 },\n        { timestamp: 1667333700000, metric_0: 0.3147045473257701 },\n        { timestamp: 1667333730000, metric_0: 0.3403649826844533 },\n        { timestamp: 1667333760000, metric_0: 0.3060835003852844 },\n        { timestamp: 1667333790000, metric_0: 0.30727096895376843 },\n        { timestamp: 1667333820000, metric_0: 0.2983386317888896 },\n        { timestamp: 1667333850000, metric_0: 0.26111698647340137 },\n        { timestamp: 1667333880000, metric_0: 0.2863030731678009 },\n        { timestamp: 1667333910000, metric_0: 0.35175105929374695 },\n        { timestamp: 1667333940000, metric_0: 0.30486862858136493 },\n        { timestamp: 1667333970000, metric_0: 0.2920278211434682 },\n        { timestamp: 1667334000000, metric_0: 0.3553886612256368 },\n        { timestamp: 1667334030000, metric_0: 0.33247488737106323 },\n        { timestamp: 1667334060000, metric_0: 0.3503577907880147 },\n        { timestamp: 1667334090000, metric_0: 0.32119495670000714 },\n        { timestamp: 1667334120000, metric_0: 0.2809036473433177 },\n        { timestamp: 1667334150000, metric_0: 0.3616585930188497 },\n        { timestamp: 1667334180000, metric_0: 0.35740313430627185 },\n        { timestamp: 1667334210000, metric_0: 0.3608712653319041 },\n        { timestamp: 1667334240000, metric_0: 0.2637135585149129 },\n        { timestamp: 1667334270000, metric_0: 0.2613096684217453 },\n        { timestamp: 1667334300000, metric_0: 0.3533228536446889 },\n        { timestamp: 1667334330000, metric_0: 0.2453788916269938 },\n        { timestamp: 1667334360000, metric_0: 0.3233574728171031 },\n        { timestamp: 1667334390000, metric_0: 0.35204625129699707 },\n        { timestamp: 1667334420000, metric_0: 0.28329822421073914 },\n        { timestamp: 1667334450000, metric_0: 0.27605955799420673 },\n        { timestamp: 1667334480000, metric_0: 0.3174302776654561 },\n        { timestamp: 1667334510000, metric_0: 0.3174441357453664 },\n        { timestamp: 1667334540000, metric_0: 0.3032358189423879 },\n        { timestamp: 1667334570000, metric_0: 0.37016361951828003 },\n        { timestamp: 1667334600000, metric_0: 0.2845376158754031 },\n        { timestamp: 1667334630000, metric_0: 0.28091730177402496 },\n        { timestamp: 1667334660000, metric_0: 0.298275093237559 },\n        { timestamp: 1667334690000, metric_0: 0.28138890862464905 },\n        { timestamp: 1667334720000, metric_0: 0.23357486724853516 },\n        { timestamp: 1667334750000, metric_0: 0.40123457709948224 },\n        { timestamp: 1667334780000, metric_0: 0.2939300686120987 },\n        { timestamp: 1667334810000, metric_0: 0.3072533706823985 },\n        { timestamp: 1667334840000, metric_0: 0.34876759847005206 },\n        { timestamp: 1667334870000, metric_0: 0.2714219739039739 },\n        { timestamp: 1667334900000, metric_0: 0.3688941200574239 },\n        { timestamp: 1667334930000, metric_0: 0.26487817863623303 },\n        { timestamp: 1667334960000, metric_0: 0.31206977367401123 },\n        { timestamp: 1667334990000, metric_0: 0.2907249927520752 },\n        { timestamp: 1667335020000, metric_0: 0.3487333655357361 },\n        { timestamp: 1667335050000, metric_0: 0.30691683292388916 },\n        { timestamp: 1667335080000, metric_0: 0.2549840062856674 },\n        { timestamp: 1667335110000, metric_0: 0.3625897367795308 },\n        { timestamp: 1667335140000, metric_0: 0.2855423291524251 },\n        { timestamp: 1667335170000, metric_0: 0.2462362994750341 },\n        { timestamp: 1667335200000, metric_0: 0.2915644546349843 },\n        { timestamp: 1667335230000, metric_0: 0.3488748570283254 },\n        { timestamp: 1667335260000, metric_0: 0.3100440204143524 },\n        { timestamp: 1667335290000, metric_0: 0.2573837737242381 },\n        { timestamp: 1667335320000, metric_0: 0.3266606132189433 },\n        { timestamp: 1667335350000, metric_0: 0.26736895740032196 },\n        { timestamp: 1667335380000, metric_0: 0.380219042301178 },\n        { timestamp: 1667335410000, metric_0: 0.22705280780792236 },\n        { timestamp: 1667335440000, metric_0: 0.352107306321462 },\n        { timestamp: 1667335470000, metric_0: 0.25591664512952167 },\n        { timestamp: 1667335500000, metric_0: 0.25495874385039013 },\n        { timestamp: 1667335530000, metric_0: 0.2860405544439952 },\n        { timestamp: 1667335560000, metric_0: 0.19073789566755295 },\n        { timestamp: 1667335590000, metric_0: 0.34192585945129395 },\n        { timestamp: 1667335620000, metric_0: 0.29069269200166065 },\n        { timestamp: 1667335650000, metric_0: 0.3985736568768819 },\n        { timestamp: 1667335680000, metric_0: 0.3556165198485057 },\n        { timestamp: 1667335710000, metric_0: 0.30276427666346234 },\n        { timestamp: 1667335740000, metric_0: 0.3264604906241099 },\n        { timestamp: 1667335770000, metric_0: 0.2258296882112821 },\n        { timestamp: 1667335800000, metric_0: 0.3347952465216319 },\n        { timestamp: 1667335830000, metric_0: 0.2713114619255066 },\n        { timestamp: 1667335860000, metric_0: 0.35919984181722003 },\n        { timestamp: 1667335890000, metric_0: 0.31145066022872925 },\n        { timestamp: 1667335920000, metric_0: 0.3422968288262685 },\n        { timestamp: 1667335950000, metric_0: 0.32901568214098614 },\n        { timestamp: 1667335980000, metric_0: 0.30424686272939044 },\n        { timestamp: 1667336010000, metric_0: 0.32844143112500507 },\n        { timestamp: 1667336040000, metric_0: 0.28995340565840405 },\n        { timestamp: 1667336070000, metric_0: 0.3078547269105911 },\n        { timestamp: 1667336100000, metric_0: 0.2830798228581746 },\n        { timestamp: 1667336130000, metric_0: 0.2377857267856598 },\n        { timestamp: 1667336160000, metric_0: 0.21685329576333365 },\n        { timestamp: 1667336190000, metric_0: 0.3035924782355626 },\n        { timestamp: 1667336220000, metric_0: 0.22407410542170206 },\n        { timestamp: 1667336250000, metric_0: 0.3591982622941335 },\n        { timestamp: 1667336280000, metric_0: 0.26838067173957825 },\n        { timestamp: 1667336310000, metric_0: 0.23181848227977753 },\n        { timestamp: 1667336340000, metric_0: 0.2534378618001938 },\n        { timestamp: 1667336370000, metric_0: 0.2962680558363597 },\n      ],\n    },\n  },\n  {\n    name: 'host-3116',\n    max: 0.10114687184492747,\n    value: 0.07406701395908992,\n    avg: 0.07657978739072052,\n    timeseries: {\n      id: 'system',\n      columns: [\n        { name: 'timestamp', type: 'date' },\n        { name: 'metric_0', type: 'number' },\n      ],\n      rows: [\n        { timestamp: 1667332800000, metric_0: 0.08718535676598549 },\n        { timestamp: 1667332830000, metric_0: 0.08944408347209294 },\n        { timestamp: 1667332860000, metric_0: 0.0811207927763462 },\n        { timestamp: 1667332890000, metric_0: 0.07029584050178528 },\n        { timestamp: 1667332920000, metric_0: 0.03974025075634321 },\n        { timestamp: 1667332950000, metric_0: 0.06399380167325337 },\n        { timestamp: 1667332980000, metric_0: 0.09598299860954285 },\n        { timestamp: 1667333010000, metric_0: 0.08399898931384087 },\n        { timestamp: 1667333040000, metric_0: 0.08361925929784775 },\n        { timestamp: 1667333070000, metric_0: 0.07813501854737599 },\n        { timestamp: 1667333100000, metric_0: 0.07348073522249858 },\n        { timestamp: 1667333130000, metric_0: 0.07158654804031055 },\n        { timestamp: 1667333160000, metric_0: 0.09198790540297826 },\n        { timestamp: 1667333190000, metric_0: 0.07943799098332723 },\n        { timestamp: 1667333220000, metric_0: 0.10114687184492747 },\n        { timestamp: 1667333250000, metric_0: 0.08647497246662776 },\n        { timestamp: 1667333280000, metric_0: 0.0896365021665891 },\n        { timestamp: 1667333310000, metric_0: 0.0744784673055013 },\n        { timestamp: 1667333340000, metric_0: 0.04070068523287773 },\n        { timestamp: 1667333370000, metric_0: 0.08083370700478554 },\n        { timestamp: 1667333400000, metric_0: 0.07274049768845241 },\n        { timestamp: 1667333430000, metric_0: 0.06332703431447347 },\n        { timestamp: 1667333460000, metric_0: 0.09708546847105026 },\n        { timestamp: 1667333490000, metric_0: 0.08316722884774208 },\n        { timestamp: 1667333520000, metric_0: 0.08062880982955296 },\n        { timestamp: 1667333550000, metric_0: 0.0888155996799469 },\n        { timestamp: 1667333580000, metric_0: 0.07236451903978984 },\n        { timestamp: 1667333610000, metric_0: 0.07995046551028888 },\n        { timestamp: 1667333640000, metric_0: 0.07159238557020824 },\n        { timestamp: 1667333670000, metric_0: 0.08248113964994748 },\n        { timestamp: 1667333700000, metric_0: 0.07867613683144252 },\n        { timestamp: 1667333730000, metric_0: 0.08509124567111333 },\n        { timestamp: 1667333760000, metric_0: 0.0765208750963211 },\n        { timestamp: 1667333790000, metric_0: 0.07681774223844211 },\n        { timestamp: 1667333820000, metric_0: 0.0745846579472224 },\n        { timestamp: 1667333850000, metric_0: 0.06527924661835034 },\n        { timestamp: 1667333880000, metric_0: 0.07157576829195023 },\n        { timestamp: 1667333910000, metric_0: 0.08793776482343674 },\n        { timestamp: 1667333940000, metric_0: 0.07621715714534123 },\n        { timestamp: 1667333970000, metric_0: 0.07300695528586705 },\n        { timestamp: 1667334000000, metric_0: 0.0888471653064092 },\n        { timestamp: 1667334030000, metric_0: 0.08311872184276581 },\n        { timestamp: 1667334060000, metric_0: 0.08758944769700368 },\n        { timestamp: 1667334090000, metric_0: 0.08029873917500178 },\n        { timestamp: 1667334120000, metric_0: 0.07022591183582942 },\n        { timestamp: 1667334150000, metric_0: 0.09041464825471242 },\n        { timestamp: 1667334180000, metric_0: 0.08935078357656796 },\n        { timestamp: 1667334210000, metric_0: 0.09021781633297603 },\n        { timestamp: 1667334240000, metric_0: 0.06592838962872823 },\n        { timestamp: 1667334270000, metric_0: 0.06532741710543633 },\n        { timestamp: 1667334300000, metric_0: 0.08833071341117223 },\n        { timestamp: 1667334330000, metric_0: 0.06134472290674845 },\n        { timestamp: 1667334360000, metric_0: 0.08083936820427577 },\n        { timestamp: 1667334390000, metric_0: 0.08801156282424927 },\n        { timestamp: 1667334420000, metric_0: 0.07082455605268478 },\n        { timestamp: 1667334450000, metric_0: 0.06901488949855168 },\n        { timestamp: 1667334480000, metric_0: 0.07935756941636403 },\n        { timestamp: 1667334510000, metric_0: 0.0793610339363416 },\n        { timestamp: 1667334540000, metric_0: 0.07580895473559697 },\n        { timestamp: 1667334570000, metric_0: 0.09254090487957001 },\n        { timestamp: 1667334600000, metric_0: 0.07113440396885078 },\n        { timestamp: 1667334630000, metric_0: 0.07022932544350624 },\n        { timestamp: 1667334660000, metric_0: 0.07456877330938975 },\n        { timestamp: 1667334690000, metric_0: 0.07034722715616226 },\n        { timestamp: 1667334720000, metric_0: 0.05839371681213379 },\n        { timestamp: 1667334750000, metric_0: 0.10030864427487056 },\n        { timestamp: 1667334780000, metric_0: 0.07348251715302467 },\n        { timestamp: 1667334810000, metric_0: 0.07681334267059962 },\n        { timestamp: 1667334840000, metric_0: 0.08719189961751302 },\n        { timestamp: 1667334870000, metric_0: 0.06785549347599347 },\n        { timestamp: 1667334900000, metric_0: 0.09222353001435597 },\n        { timestamp: 1667334930000, metric_0: 0.06621954465905826 },\n        { timestamp: 1667334960000, metric_0: 0.07801744341850281 },\n        { timestamp: 1667334990000, metric_0: 0.0726812481880188 },\n        { timestamp: 1667335020000, metric_0: 0.08718334138393402 },\n        { timestamp: 1667335050000, metric_0: 0.07672920823097229 },\n        { timestamp: 1667335080000, metric_0: 0.06374600157141685 },\n        { timestamp: 1667335110000, metric_0: 0.0906474341948827 },\n        { timestamp: 1667335140000, metric_0: 0.07138558228810628 },\n        { timestamp: 1667335170000, metric_0: 0.06155907486875852 },\n        { timestamp: 1667335200000, metric_0: 0.07289111365874608 },\n        { timestamp: 1667335230000, metric_0: 0.08721871425708135 },\n        { timestamp: 1667335260000, metric_0: 0.0775110051035881 },\n        { timestamp: 1667335290000, metric_0: 0.06434594343105952 },\n        { timestamp: 1667335320000, metric_0: 0.08166515330473582 },\n        { timestamp: 1667335350000, metric_0: 0.06684223935008049 },\n        { timestamp: 1667335380000, metric_0: 0.0950547605752945 },\n        { timestamp: 1667335410000, metric_0: 0.05676320195198059 },\n        { timestamp: 1667335440000, metric_0: 0.0880268265803655 },\n        { timestamp: 1667335470000, metric_0: 0.06397916128238042 },\n        { timestamp: 1667335500000, metric_0: 0.06373968596259753 },\n        { timestamp: 1667335530000, metric_0: 0.0715101386109988 },\n        { timestamp: 1667335560000, metric_0: 0.04768447391688824 },\n        { timestamp: 1667335590000, metric_0: 0.08548146486282349 },\n        { timestamp: 1667335620000, metric_0: 0.07267317300041516 },\n        { timestamp: 1667335650000, metric_0: 0.09964341421922047 },\n        { timestamp: 1667335680000, metric_0: 0.08890412996212642 },\n        { timestamp: 1667335710000, metric_0: 0.07569106916586558 },\n        { timestamp: 1667335740000, metric_0: 0.08161512265602748 },\n        { timestamp: 1667335770000, metric_0: 0.056457422052820526 },\n        { timestamp: 1667335800000, metric_0: 0.08369881163040797 },\n        { timestamp: 1667335830000, metric_0: 0.06782786548137665 },\n        { timestamp: 1667335860000, metric_0: 0.08979996045430501 },\n        { timestamp: 1667335890000, metric_0: 0.07786266505718231 },\n        { timestamp: 1667335920000, metric_0: 0.08557420720656712 },\n        { timestamp: 1667335950000, metric_0: 0.08225392053524654 },\n        { timestamp: 1667335980000, metric_0: 0.07606171568234761 },\n        { timestamp: 1667336010000, metric_0: 0.08211035778125127 },\n        { timestamp: 1667336040000, metric_0: 0.07248835141460101 },\n        { timestamp: 1667336070000, metric_0: 0.07696368172764778 },\n        { timestamp: 1667336100000, metric_0: 0.07076995571454366 },\n        { timestamp: 1667336130000, metric_0: 0.05944643169641495 },\n        { timestamp: 1667336160000, metric_0: 0.05421332394083341 },\n        { timestamp: 1667336190000, metric_0: 0.07589811955889066 },\n        { timestamp: 1667336220000, metric_0: 0.056018526355425514 },\n        { timestamp: 1667336250000, metric_0: 0.08979956557353337 },\n        { timestamp: 1667336280000, metric_0: 0.06709516793489456 },\n        { timestamp: 1667336310000, metric_0: 0.05795462056994438 },\n        { timestamp: 1667336340000, metric_0: 0.06335946545004845 },\n        { timestamp: 1667336370000, metric_0: 0.07406701395908992 },\n      ],\n    },\n  },\n  {\n    name: 'host-7182',\n    max: 0.46753058830897015,\n    value: 0.3638165493806203,\n    avg: 0.3188937294400401,\n    timeseries: {\n      id: 'user',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.23674675077199936,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.2762629787127177,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.24578686555226645,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.3769354472557704,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.3355911175409953,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.4029686550299327,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.30126269658406574,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.2926919957002004,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.356646329164505,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.3406519790490468,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.3723626732826233,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.33759743471940357,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.41703038414319354,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.3275140921274821,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.45101575056711835,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.29873551925023395,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.32891859610875446,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.22551120817661285,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.4007841795682907,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.3660312493642171,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.30206019182999927,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.3689626157283783,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.4176250994205475,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.2645139942566554,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.323407843708992,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.21821119884649912,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.3501889109611511,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.2743571599324544,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.27700241903464,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.335186243057251,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.270063837369283,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.335629681746165,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.31076965232690174,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.35983813802401227,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.2921534677346547,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.22411971787611643,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.24860079089800516,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.2793974429368973,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.3124958674112956,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.34034912784894306,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.3348245819409688,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.2546294033527374,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.42620877424875897,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.46753058830897015,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.39495396614074707,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.3399921655654907,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.2703582098086675,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.3471289873123169,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.3251100182533264,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.3618142207463582,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.33241911232471466,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.31730825702349347,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.2720119704802831,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.3457658290863037,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.2804016371568044,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.3279033799966176,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.32536494731903076,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.2926763991514842,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.3490923047065735,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.3012569695711136,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.3905048767725627,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.3501772383848826,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.23744273434082666,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.24697035551071167,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.2929566403230031,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.3091825842857361,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.3344510942697525,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.31740406652291614,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.4040726224581401,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.3170100251833598,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.2928963502248128,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.3328752964735031,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.357511430978775,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.2539384166399638,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.3754552702109019,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.3772915005683899,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.3096510072549184,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.28532365957895917,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.28591565291086835,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.25959018369515735,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.28709276020526886,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.24581093589464822,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.2588135947783788,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.2751153310139974,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.37329648931821185,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.26915471255779266,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.3694015343983968,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.24267461399237314,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.3097536265850067,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.3270740807056427,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.3864440421263377,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.3704795042673747,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.3289842406908671,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.29559480647246045,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.3793505032857259,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.3361785610516866,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.187428280711174,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.34851351380348206,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.2889653543631236,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.2868878245353699,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.3499130805333455,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.34690917531649273,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.2519531498352687,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.3057488799095154,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.2320807675520579,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.3403207063674927,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.2969990720351537,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.21300195157527924,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.3088476558526357,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.3366421163082123,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.43140821655591327,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.41408825914065045,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.29404223958651227,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.3118886748949687,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.29093530774116516,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.2999846190214157,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.2877273013194402,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.3342668016751607,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.29630666474501294,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.3638165493806203,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-9982',\n    max: 0.11688264707724254,\n    value: 0.09095413734515508,\n    avg: 0.07972343236001002,\n    timeseries: {\n      id: 'system',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.05918668769299984,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.06906574467817943,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.06144671638806661,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.0942338618139426,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.08389777938524882,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.10074216375748317,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.07531567414601643,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.0731729989250501,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.08916158229112625,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.0851629947622617,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.09309066832065582,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.08439935867985089,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.10425759603579839,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.08187852303187053,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.11275393764177959,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.07468387981255849,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.08222964902718861,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.056377802044153214,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.10019604489207268,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.09150781234105428,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.07551504795749982,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.09224065393209457,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.10440627485513687,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.06612849856416385,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.080851960927248,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.05455279971162478,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.08754722774028778,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.0685892899831136,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.06925060475866,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.08379656076431274,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.06751595934232076,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.08390742043654124,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.07769241308172543,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.08995953450600307,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.07303836693366368,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.056029929469029106,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.06215019772450129,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.06984936073422432,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.0781239668528239,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.08508728196223576,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.0837061454852422,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.06365735083818436,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.10655219356218974,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.11688264707724254,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.09873849153518677,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.08499804139137268,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.06758955245216687,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.08678224682807922,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.0812775045633316,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.09045355518658955,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.08310477808117867,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.07932706425587337,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.06800299262007077,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.08644145727157593,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.0701004092892011,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.0819758449991544,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.08134123682975769,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.07316909978787105,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.08727307617664337,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.0753142423927784,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.09762621919314067,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.08754430959622066,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.059360683585206665,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.06174258887767792,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.07323916008075078,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.07729564607143402,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.08361277356743813,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.07935101663072903,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.10101815561453502,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.07925250629583995,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.0732240875562032,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.08321882411837578,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.08937785774469376,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.06348460415999095,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.09386381755272548,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.09432287514209747,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.0774127518137296,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.07133091489473979,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.07147891322771709,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.06489754592378934,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.07177319005131721,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.061452733973662056,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.0647033986945947,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.06877883275349934,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.09332412232955296,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.06728867813944817,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.0923503835995992,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.060668653498093285,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.07743840664625168,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.08176852017641068,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.09661101053158443,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.09261987606684367,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.08224606017271678,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.07389870161811511,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.09483762582143147,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.08404464026292165,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.0468570701777935,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.08712837845087051,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.0722413385907809,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.07172195613384247,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.08747827013333638,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.08672729382912318,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.06298828745881717,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.07643721997737885,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.05802019188801447,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.08508017659187317,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.07424976800878842,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.05325048789381981,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.07721191396315892,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.08416052907705307,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.10785205413897832,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.10352206478516261,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.07351055989662807,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.07797216872374217,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.07273382693529129,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.07499615475535393,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.07193182532986005,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.08356670041879018,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.07407666618625323,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.09095413734515508,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-45729',\n    max: 0.4839908679326375,\n    value: 0.3916400372982025,\n    avg: 0.31918529298984344,\n    timeseries: {\n      id: 'user',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.29977621883153915,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.27408987283706665,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.28990548849105835,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.36929385860761005,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.31124788522720337,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.287537083029747,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.2967568635940552,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.20442836980024973,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.31931211551030475,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.36897707482179004,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.30757897595564526,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.2731511394182841,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.4021446208159129,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.29344835380713147,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.3425005276997884,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.25978292028109234,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.3617887695630391,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.29862308502197266,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.3178466558456421,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.3444976607958476,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.2940770337978999,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.2905193418264389,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.3637872139612834,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.23695586621761322,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.3217656562725703,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.2890215516090393,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.26715636750062305,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.37604572375615436,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.3323912521203359,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.38384440541267395,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.27270786464214325,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.2864599774281184,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.27886507908503216,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.3325890898704529,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.29754966497421265,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.32693185408910114,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.35126861929893494,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.3417484561602275,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.34694018959999084,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.28032204508781433,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.30857476592063904,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.32672243813673657,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.16484210391839346,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.24393236140410104,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.413083756963412,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.4839908679326375,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.2674439549446106,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.37867457667986554,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.33084602157274884,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.34167664249738056,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.3647904296716054,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.29186991850535077,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.3487752079963684,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.29593873023986816,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.3503992557525635,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.3810393313566844,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.3757585386435191,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.33935465415318805,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.2924812237421672,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.40377851327260333,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.4146209806203842,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.35354527831077576,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.3889002203941345,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.34190143644809723,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.3362271984418233,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.2866896986961365,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.3073747257391612,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.28786834081013996,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.35283652941385907,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.3152204602956772,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.25821750859419507,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.38528749346733093,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.31602028012275696,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.2641951193412145,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.2657024363676707,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.2444081554810206,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.2947406868139903,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.27855149904886883,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.29675881067911786,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.2986188431580861,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.20048560202121735,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.33882563809553784,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.3105841477711995,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.4018009503682454,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.2732260078191757,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.4052060842514038,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.3772941331068675,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.30714963376522064,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.2264118790626526,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.2921489228804906,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.2651912445823352,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.3499677578608195,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.3379055857658386,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.33196746309598285,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.29919471343358356,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.2668144330382347,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.3223360975583394,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.3942509392897288,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.2585953275362651,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.33873148759206134,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.31809767087300617,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.23975698153177896,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.36557382345199585,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.33297867079575855,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.26561444997787476,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.3063862770795822,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.38469745715459186,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.39382874965667725,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.3812083899974823,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.2574072331190109,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.33985555668671924,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.324711615840594,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.3706111361583074,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.27903997898101807,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.3267780542373657,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.33966315786043805,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.31545838216940564,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.27901268005371094,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.3065330187479655,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.3916400372982025,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-1337',\n    max: 0.12099771698315938,\n    value: 0.09791000932455063,\n    avg: 0.07979632324746086,\n    timeseries: {\n      id: 'system',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.07494405470788479,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.06852246820926666,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.07247637212276459,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.09232346465190251,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.07781197130680084,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.07188427075743675,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.0741892158985138,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.05110709245006243,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.07982802887757619,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.09224426870544751,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.07689474398891132,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.06828778485457103,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.10053615520397823,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.07336208845178287,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.0856251319249471,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.06494573007027309,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.09044719239075978,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.07465577125549316,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.07946166396141052,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.0861244151989619,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.07351925844947498,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.07262983545660973,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.09094680349032085,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.059238966554403305,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.08044141406814258,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.07225538790225983,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.06678909187515576,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.09401143093903859,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.08309781303008397,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.09596110135316849,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.06817696616053581,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.0716149943570296,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.06971626977125804,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.08314727246761322,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.07438741624355316,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.08173296352227528,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.08781715482473373,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.08543711404005687,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.08673504739999771,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.07008051127195358,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.07714369148015976,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.08168060953418414,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.041210525979598366,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.06098309035102526,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.103270939240853,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.12099771698315938,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.06686098873615265,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.09466864416996638,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.08271150539318721,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.08541916062434514,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.09119760741790135,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.07296747962633769,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.0871938019990921,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.07398468255996704,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.08759981393814087,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.0952598328391711,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.09393963466087978,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.08483866353829701,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.0731203059355418,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.10094462831815083,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.10365524515509605,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.08838631957769394,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.09722505509853363,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.08547535911202431,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.08405679961045583,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.07167242467403412,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.0768436814347903,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.07196708520253499,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.08820913235346477,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.0788051150739193,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.06455437714854877,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.09632187336683273,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.07900507003068924,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.06604877983530362,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.06642560909191768,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.06110203887025515,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.07368517170349757,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.06963787476221721,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.07418970266977946,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.07465471078952153,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.05012140050530434,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.08470640952388446,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.07764603694279988,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.10045023759206136,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.06830650195479393,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.10130152106285095,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.09432353327671687,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.07678740844130516,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.05660296976566315,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.07303723072012265,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.0662978111455838,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.08749193946520488,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.08447639644145966,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.08299186577399571,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.07479867835839589,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.06670360825955868,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.08058402438958485,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.0985627348224322,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.06464883188406627,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.08468287189801534,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.07952441771825154,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.05993924538294474,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.09139345586299896,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.08324466769893964,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.06640361249446869,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.07659656926989555,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.09617436428864796,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.09845718741416931,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.09530209749937057,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.06435180827975273,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.08496388917167981,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.0811779039601485,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.09265278403957684,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.06975999474525452,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.08169451355934143,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.08491578946510951,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.07886459554235141,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.06975317001342773,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.07663325468699138,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.09791000932455063,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-993752',\n    max: 0.42341842254002887,\n    value: 0.3657372196515401,\n    avg: 0.3109148617833853,\n    timeseries: {\n      id: 'user',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.26554837822914124,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.3245313912630081,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.292506605386734,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.33190569778283435,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.3270445068677266,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.219671959678332,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.4092471996943156,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.42341842254002887,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.33125580847263336,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.2941380689541499,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.3351229429244995,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.38405293226242065,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.27865228056907654,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.2733519325653712,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.209918146332105,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.28147180875142414,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.3216685752073924,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.30877769986788434,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.3536653021971385,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.27556002140045166,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.28134016195933026,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.3073340505361557,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.308109109600385,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.3141087492307027,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.3253626674413681,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.31740400195121765,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.29565206666787464,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.3159216245015462,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.32625357309977215,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.3004571795463562,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.3162183811267217,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.28908344109853107,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.2806500792503357,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.2616770068804423,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.3122442563374837,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.3697422544161479,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.38436148564020794,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.28180519739786786,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.3253449946641922,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.23849976559480032,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.32709699869155884,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.28809836010138196,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.334033062060674,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.33405157923698425,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.2736254731814067,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.36191598574320477,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.3138476659854253,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.3658759693304698,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.31635376811027527,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.2981712222099304,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.22057300309340158,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.30108100672562915,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.25260060528914136,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.3323913911978404,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.2530389130115509,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.24724195897579193,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.3694608410199483,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.1464558889468511,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.3568643530209859,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.2906121661265691,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.29147279262542725,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.29598700006802875,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.3178882400194804,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.28718478977680206,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.3305741051832835,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.28062058985233307,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.2839128027359645,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.31596046686172485,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.3435437083244324,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.36869652569293976,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.2834072808424632,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.3127775589625041,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.2580890854199727,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.29344111680984497,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.3512902855873108,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.26867932081222534,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.30300448338190716,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.2824061264594396,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.27666042248408,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.3714834849039714,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.2873914490143458,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.32019497950871784,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.3025929580132167,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.33769770463307697,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.38783719142278034,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.27688901623090106,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.2831520438194275,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.30719699958960217,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.41629768411318463,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.34883591532707214,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.3437271366516749,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.3343379447857539,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.3483527700106303,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.31128636995951336,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.3416846493879954,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.32481649518013,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.3340492645899455,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.22142045696576437,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.31097331643104553,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.3083871304988861,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.2768298387527466,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.331269105275472,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.30281810959180194,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.39446720480918884,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.37544288237889606,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.33352212111155194,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.2855232059955597,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.35418395201365155,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.271432821949323,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.23321674267450967,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.3288340965906779,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.29713847239812213,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.3367747962474823,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.2738778442144394,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.4041471878687541,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.33507869640986127,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.3047125041484833,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.3355152557293574,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.22858975330988565,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.3657372196515401,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-1182831',\n    max: 0.10585460563500722,\n    value: 0.09143430491288503,\n    avg: 0.07772871544584632,\n    timeseries: {\n      id: 'system',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.06638709455728531,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.08113284781575203,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.0731266513466835,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.08297642444570859,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.08176112671693166,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.054917989919583,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.1023117999235789,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.10585460563500722,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.08281395211815834,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.07353451723853748,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.08378073573112488,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.09601323306560516,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.06966307014226913,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.0683379831413428,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.05247953658302625,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.07036795218785603,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.0804171438018481,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.07719442496697108,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.08841632554928462,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.06889000535011292,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.07033504048983256,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.07683351263403893,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.07702727740009625,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.07852718730767567,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.08134066686034203,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.07935100048780441,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.07391301666696866,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.07898040612538655,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.08156339327494304,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.07511429488658905,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.07905459528168042,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.07227086027463277,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.07016251981258392,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.06541925172011058,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.07806106408437093,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.09243556360403697,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.09609037141005199,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.07045129934946696,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.08133624866604805,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.05962494139870008,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.08177424967288971,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.07202459002534549,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.0835082655151685,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.08351289480924606,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.06840636829535167,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.09047899643580119,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.07846191649635632,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.09146899233261745,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.07908844202756882,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.0745428055524826,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.055143250773350395,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.07527025168140729,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.06315015132228534,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.0830978477994601,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.06325972825288773,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.06181048974394798,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.09236521025498708,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.036613972236712776,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.08921608825524648,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.07265304153164227,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.07286819815635681,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.07399675001700719,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.0794720600048701,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.07179619744420052,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.08264352629582088,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.07015514746308327,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.07097820068399112,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.07899011671543121,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.0858859270811081,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.09217413142323494,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.0708518202106158,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.07819438974062602,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.06452227135499318,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.07336027920246124,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.0878225713968277,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.06716983020305634,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.07575112084547679,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.0706015316148599,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.06916510562102,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.09287087122599284,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.07184786225358646,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.08004874487717946,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.07564823950330417,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.08442442615826924,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.09695929785569508,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.06922225405772527,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.07078801095485687,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.07679924989740054,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.10407442102829616,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.08720897883176804,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.08593178416291873,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.08358448619643848,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.08708819250265758,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.07782159248987834,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.08542116234699886,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.0812041237950325,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.08351231614748637,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.05535511424144109,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.07774332910776138,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.07709678262472153,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.06920745968818665,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.082817276318868,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.07570452739795049,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.09861680120229721,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.09386072059472401,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.08338053027788798,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.07138080149888992,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.08854598800341289,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.06785820548733075,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.05830418566862742,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.08220852414766948,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.07428461809953053,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.08419369906187057,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.06846946105360985,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.10103679696718852,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.08376967410246532,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.07617812603712082,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.08387881393233936,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.05714743832747141,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.09143430491288503,\n        },\n      ],\n    },\n  },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipInfo, XYChartSeriesIdentifier } from '@elastic/charts';\n\nexport const tableSimple: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: null,\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 19,\n      formattedValue: '19.00',\n      markValue: 49,\n      formattedMarkValue: '49',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: {\n        x: 60,\n        y: 19,\n        z: 49,\n        g: 'c',\n      },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 23,\n      formattedValue: '23.00',\n      markValue: 83,\n      formattedMarkValue: '83',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: {\n        x: 67,\n        y: 23,\n        z: 83,\n        g: 'c',\n      },\n    },\n  ],\n};\n\nexport const tableMultipleX: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: null,\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-a}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'a',\n      value: 62,\n      formattedValue: '62.00',\n      markValue: 63,\n      formattedMarkValue: '63',\n      color: '#54B399',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 17, y: 62, z: 63, g: 'a' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-b}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'b',\n      value: 70,\n      formattedValue: '70.00',\n      markValue: 67,\n      formattedMarkValue: '67',\n      color: '#6092C0',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 16, y: 70, z: 67, g: 'b' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 71,\n      formattedValue: '71.00',\n      markValue: 87,\n      formattedMarkValue: '87',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: { x: 14, y: 71, z: 87, g: 'c' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 65,\n      formattedValue: '65.00',\n      markValue: 50,\n      formattedMarkValue: '50',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: { x: 13, y: 65, z: 50, g: 'c' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 68,\n      formattedValue: '68.00',\n      markValue: 84,\n      formattedMarkValue: '84',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: { x: 19, y: 68, z: 84, g: 'c' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-d}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['d', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'd',\n      value: 68,\n      formattedValue: '68.00',\n      markValue: 86,\n      formattedMarkValue: '86',\n      color: '#9170B8',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 16, y: 68, z: 86, g: 'd' },\n    },\n  ],\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport { Example as ComposedList } from './1_composed_list.story';\nexport { Example as ComposedTable } from './2_composed_table.story';\nexport { Example as TabularData } from './3_tabular_data.story';\nexport { Example as ActionsWithCustomTooltip } from './4_actions_with_custom_tooltip.story';\nexport { Example as DefaultChartsTooltip } from './5_chart_tooltip.story';\nexport { Example as AsyncActions } from './6_async_actions.story';\n\nexport { Example as CartesianCharts } from './10_cartesian_chart.story';\nexport { Example as PartitionCharts } from './11_partition_chart.story';\nexport { Example as HeatmapChart } from './12_heatmap.story';\nexport { Example as Flamegraph } from './13_flamegraph.story';\n\nexport default {\n  title: 'Components/Tooltip',\n};\n","var api = require(\"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n            var content = require(\"!!../../../../node_modules/css-loader/dist/cjs.js??ref--17-1!../../../../node_modules/postcss-loader/dist/cjs.js??ref--17-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--17-3!./tooltip_showcase.scss\");\n\n            content = content.__esModule ? content.default : content;\n\n            if (typeof content === 'string') {\n              content = [[module.id, content, '']];\n            }\n\nvar options = {\"attributes\":{\"nonce\":\"Pk1rZ1XDlMuYe8ubWV3Lh0BzwrTigJQ=\"}};\n\noptions.insert = \"head\";\noptions.singleton = false;\n\nvar update = api(content, options);\n\n\n\nmodule.exports = content.locals || {};","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color } from '@storybook/addon-knobs';\nimport React, { memo, useEffect, useRef, useState } from 'react';\n\nimport {\n  BaseDatum,\n  Datum,\n  SeriesIdentifier,\n  TooltipProps,\n  LIGHT_THEME,\n  DEFAULT_TOOLTIP_SPEC,\n  TooltipSpec,\n  TooltipValue,\n} from '@elastic/charts';\nimport { TooltipComponent, TooltipComponentProps } from '@elastic/charts/src/components/tooltip/tooltip';\n\nimport { customKnobs } from '../../utils/knobs';\n\nimport './tooltip_showcase.scss';\n\ntype BaseTooltipProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = TooltipComponentProps<D, SI>;\n\ntype TooltipShowcaseProps<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = Partial<\n  Omit<TooltipComponentProps<D, SI>, 'settings' | 'visible' | 'tooltip'>\n> & { tooltip?: Partial<TooltipComponentProps<D, SI>['tooltip']> } & Partial<TooltipProps<D, SI>>;\n\nconst TooltipShowcaseInner = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  props: TooltipShowcaseProps<D, SI>,\n) => {\n  const [, setVisible] = useState(false);\n  const [selected, setSelected] = useState<TooltipValue<D, SI>[]>([]);\n  const divRef = useRef<HTMLDivElement | null>(null);\n  const anchorRef = useRef<HTMLDivElement | null>(null);\n\n  // Required to initially rerender tooltip\n  useEffect(() => {\n    setVisible(true);\n    return () => setVisible(false);\n  }, []);\n\n  const tooltipProps: BaseTooltipProps<D, SI> = {\n    zIndex: 200,\n    info: props.info,\n    settings: {\n      ...props,\n      placement: customKnobs.enum.placement(),\n      boundary: divRef.current ?? undefined,\n    },\n    rotation: 0,\n    visible: boolean('visible', true),\n    backgroundColor: color('backgroundColor', '#E8F9FD'),\n    getChartContainerRef: () => divRef,\n    // @ts-ignore - overriding mouse logic\n    onPointerMove: () => {},\n    toggleSelectedTooltipItem: (rawitem) => {\n      const item = rawitem as TooltipValue<D, SI>;\n      const index = selected.indexOf(item);\n      setSelected((prev) => {\n        if (index === -1) return [...prev, item];\n        return prev.filter((i) => i !== item);\n      });\n    },\n    setSelectedTooltipItems: (items) => {\n      setSelected(items as TooltipValue<D, SI>[]);\n    },\n    pinTooltip() {\n      setSelected([]);\n    },\n    canPinTooltip: false,\n    pinned: false,\n    selected,\n    maxTooltipItems: 5,\n    tooltipTheme: LIGHT_THEME.tooltip,\n    ...props,\n    tooltip: {\n      ...(DEFAULT_TOOLTIP_SPEC as unknown as TooltipSpec<D, SI>),\n      ...props.tooltip,\n    },\n  };\n\n  return (\n    <div ref={divRef} style={{ backgroundColor: tooltipProps.backgroundColor }} className=\"showcase\">\n      <div className=\"tooltip-wrapper\">\n        <div id=\"tooltip-anchor\" ref={anchorRef}>\n          Tooltip Anchor\n        </div>\n        <TooltipComponent {...tooltipProps} anchorRef={anchorRef} />\n      </div>\n    </div>\n  );\n};\n\n/**\n * This component is used to render the internal `TooltipComponent` as a standalone element.\n *\n * - No connection to redux\n * - Everything is overridable\n * - Limited defaults, logic must be manually implemented above or when used\n */\nexport const TooltipShowcase = memo(TooltipShowcaseInner) as typeof TooltipShowcaseInner;\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React, { CSSProperties, useState } from 'react';\\n\\nimport { Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { BarSeries } from '../../../packages/charts/src/chart_types/specs';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\ninterface Dimensions {\\n  height: number;\\n  left: number;\\n  top: number;\\n  width: number;\\n}\\n\\nconst Measurement = (props: { text: string; horizontal: boolean; dims: CSSProperties }) => {\\n  return (\\n    <div style={{ position: 'absolute', ...props.dims, zIndex: 2000 }}>\\n      <div\\n        style={{\\n          position: 'relative',\\n          ...(props.horizontal ? { width: '100%', height: 10 } : { width: 10, height: '100%' }),\\n        }}\\n      >\\n        <div\\n          style={{\\n            position: 'absolute',\\n            ...(props.horizontal\\n              ? { width: '100%', height: 10, borderLeft: '1px solid black', borderRight: '1px solid black' }\\n              : {\\n                  width: 10,\\n                  height: '100%',\\n                  borderTop: '1px solid black',\\n                  borderBottom: '1px solid black',\\n                }),\\n          }}\\n        />\\n        <div\\n          style={{\\n            position: 'absolute',\\n            ...(props.horizontal\\n              ? { top: '50%', width: '100%', height: 20, borderTop: '1px solid black' }\\n              : { left: '50%', width: 20, height: '100%', borderLeft: '1px solid black' }),\\n          }}\\n        />\\n        <div\\n          style={{\\n            position: 'absolute',\\n\\n            color: 'black',\\n            fontSize: 10,\\n            width: '100%',\\n            textAlign: 'center',\\n            verticalAlign: 'middle',\\n            ...(props.horizontal\\n              ? {\\n                  top: 8,\\n                }\\n              : {\\n                  height: '100%',\\n                  left: 10,\\n                  writingMode: 'vertical-lr',\\n                }),\\n          }}\\n        >\\n          {props.text}\\n        </div>\\n      </div>\\n    </div>\\n  );\\n};\\n\\nconst HTML_CHART_PADDING = 20;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const legendEnabled = boolean('show legend', true);\\n  const axisYEnabled = boolean('show y axis', true);\\n  const axisXEnabled = boolean('show x axis', true);\\n\\n  const padding = number('chart paddings', 50, { min: 0, max: 100, range: true, step: 1 });\\n\\n  const [dimensions, setDimensions] = useState<{ projection: Dimensions; parent: Dimensions } | null>(null);\\n  const onAreaChangeAction = action('onProjectionAreaChange');\\n  const onAreaChangeHandler = (areas: { projection: Dimensions; parent: Dimensions }) => {\\n    onAreaChangeAction(areas);\\n    setDimensions(areas);\\n  };\\n\\n  return (\\n    <>\\n      {dimensions && (\\n        <>\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING,\\n              left: HTML_CHART_PADDING + dimensions.projection.left,\\n              width: dimensions.projection.width,\\n              height: 20,\\n            }}\\n            horizontal={true}\\n            text={`projection left: ${dimensions.projection.left} width: ${dimensions.projection.width}`}\\n          />\\n\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING + dimensions.projection.top,\\n              left: HTML_CHART_PADDING + 20 + dimensions.projection.left + dimensions.projection.width,\\n              width: 20,\\n              height: dimensions.projection.height,\\n            }}\\n            horizontal={false}\\n            text={`projection top: ${dimensions.projection.top} height: ${dimensions.projection.height}`}\\n          />\\n        </>\\n      )}\\n\\n      {dimensions && (\\n        <>\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING,\\n              left: HTML_CHART_PADDING + 10,\\n              width: 20,\\n              height: dimensions.parent.height,\\n            }}\\n            horizontal={false}\\n            text={`parent height: ${dimensions.parent.height}`}\\n          />\\n\\n          <Measurement\\n            dims={{\\n              bottom: 20,\\n              left: HTML_CHART_PADDING,\\n              width: dimensions.parent.width,\\n              height: HTML_CHART_PADDING,\\n            }}\\n            horizontal={true}\\n            text={`parent width: ${dimensions.parent.width}`}\\n          />\\n        </>\\n      )}\\n      <Chart title={title} description={description}>\\n        <Settings\\n          showLegend={legendEnabled}\\n          baseTheme={useBaseTheme()}\\n          theme={[\\n            {\\n              background: {\\n                color: 'transparent',\\n              },\\n              chartMargins: {\\n                top: padding,\\n                bottom: padding,\\n                left: padding,\\n                right: padding,\\n              },\\n            },\\n          ]}\\n          onProjectionAreaChange={onAreaChangeHandler}\\n        />\\n        {axisXEnabled && (\\n          <Axis\\n            id=\\\"bottom\\\"\\n            position={Position.Bottom}\\n            style={{ tickLine: { visible: false }, tickLabel: { padding: 5 } }}\\n          />\\n        )}\\n        {axisYEnabled && <Axis id=\\\"quantity\\\" position={Position.Left} ticks={5} />}\\n        <BarSeries\\n          id=\\\"data\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={[\\n            ['apples', 10],\\n            ['oranges', 3],\\n            ['bananas', 5],\\n          ]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":85},\"endLoc\":{\"col\":1,\"line\":194},\"startBody\":{\"col\":36,\"line\":85},\"endBody\":{\"col\":1,\"line\":194}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React, { CSSProperties, useState } from 'react';\n\nimport { Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { BarSeries } from '../../../packages/charts/src/chart_types/specs';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\ninterface Dimensions {\n  height: number;\n  left: number;\n  top: number;\n  width: number;\n}\n\nconst Measurement = (props: { text: string; horizontal: boolean; dims: CSSProperties }) => {\n  return (\n    <div style={{ position: 'absolute', ...props.dims, zIndex: 2000 }}>\n      <div\n        style={{\n          position: 'relative',\n          ...(props.horizontal ? { width: '100%', height: 10 } : { width: 10, height: '100%' }),\n        }}\n      >\n        <div\n          style={{\n            position: 'absolute',\n            ...(props.horizontal\n              ? { width: '100%', height: 10, borderLeft: '1px solid black', borderRight: '1px solid black' }\n              : {\n                  width: 10,\n                  height: '100%',\n                  borderTop: '1px solid black',\n                  borderBottom: '1px solid black',\n                }),\n          }}\n        />\n        <div\n          style={{\n            position: 'absolute',\n            ...(props.horizontal\n              ? { top: '50%', width: '100%', height: 20, borderTop: '1px solid black' }\n              : { left: '50%', width: 20, height: '100%', borderLeft: '1px solid black' }),\n          }}\n        />\n        <div\n          style={{\n            position: 'absolute',\n\n            color: 'black',\n            fontSize: 10,\n            width: '100%',\n            textAlign: 'center',\n            verticalAlign: 'middle',\n            ...(props.horizontal\n              ? {\n                  top: 8,\n                }\n              : {\n                  height: '100%',\n                  left: 10,\n                  writingMode: 'vertical-lr',\n                }),\n          }}\n        >\n          {props.text}\n        </div>\n      </div>\n    </div>\n  );\n};\n\nconst HTML_CHART_PADDING = 20;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const legendEnabled = boolean('show legend', true);\n  const axisYEnabled = boolean('show y axis', true);\n  const axisXEnabled = boolean('show x axis', true);\n\n  const padding = number('chart paddings', 50, { min: 0, max: 100, range: true, step: 1 });\n\n  const [dimensions, setDimensions] = useState<{ projection: Dimensions; parent: Dimensions } | null>(null);\n  const onAreaChangeAction = action('onProjectionAreaChange');\n  const onAreaChangeHandler = (areas: { projection: Dimensions; parent: Dimensions }) => {\n    onAreaChangeAction(areas);\n    setDimensions(areas);\n  };\n\n  return (\n    <>\n      {dimensions && (\n        <>\n          <Measurement\n            dims={{\n              top: HTML_CHART_PADDING,\n              left: HTML_CHART_PADDING + dimensions.projection.left,\n              width: dimensions.projection.width,\n              height: 20,\n            }}\n            horizontal={true}\n            text={`projection left: ${dimensions.projection.left} width: ${dimensions.projection.width}`}\n          />\n\n          <Measurement\n            dims={{\n              top: HTML_CHART_PADDING + dimensions.projection.top,\n              left: HTML_CHART_PADDING + 20 + dimensions.projection.left + dimensions.projection.width,\n              width: 20,\n              height: dimensions.projection.height,\n            }}\n            horizontal={false}\n            text={`projection top: ${dimensions.projection.top} height: ${dimensions.projection.height}`}\n          />\n        </>\n      )}\n\n      {dimensions && (\n        <>\n          <Measurement\n            dims={{\n              top: HTML_CHART_PADDING,\n              left: HTML_CHART_PADDING + 10,\n              width: 20,\n              height: dimensions.parent.height,\n            }}\n            horizontal={false}\n            text={`parent height: ${dimensions.parent.height}`}\n          />\n\n          <Measurement\n            dims={{\n              bottom: 20,\n              left: HTML_CHART_PADDING,\n              width: dimensions.parent.width,\n              height: HTML_CHART_PADDING,\n            }}\n            horizontal={true}\n            text={`parent width: ${dimensions.parent.width}`}\n          />\n        </>\n      )}\n      <Chart title={title} description={description}>\n        <Settings\n          showLegend={legendEnabled}\n          baseTheme={useBaseTheme()}\n          theme={[\n            {\n              background: {\n                color: 'transparent',\n              },\n              chartMargins: {\n                top: padding,\n                bottom: padding,\n                left: padding,\n                right: padding,\n              },\n            },\n          ]}\n          onProjectionAreaChange={onAreaChangeHandler}\n        />\n        {axisXEnabled && (\n          <Axis\n            id=\"bottom\"\n            position={Position.Bottom}\n            style={{ tickLine: { visible: false }, tickLabel: { padding: 5 } }}\n          />\n        )}\n        {axisYEnabled && <Axis id=\"quantity\" position={Position.Left} ticks={5} />}\n        <BarSeries\n          id=\"data\"\n          xScaleType={ScaleType.Ordinal}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={[\n            ['apples', 10],\n            ['oranges', 3],\n            ['bananas', 5],\n          ]}\n        />\n      </Chart>\n    </>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const legendEnabled = boolean('show legend', true);\\n  const axisYEnabled = boolean('show y axis', true);\\n  const axisXEnabled = boolean('show x axis', true);\\n\\n  const padding = number('chart paddings', 50, { min: 0, max: 100, range: true, step: 1 });\\n\\n  const [dimensions, setDimensions] = useState<{ projection: Dimensions; parent: Dimensions } | null>(null);\\n  const onAreaChangeAction = action('onProjectionAreaChange');\\n  const onAreaChangeHandler = (areas: { projection: Dimensions; parent: Dimensions }) => {\\n    onAreaChangeAction(areas);\\n    setDimensions(areas);\\n  };\\n\\n  return (\\n    <>\\n      {dimensions && (\\n        <>\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING,\\n              left: HTML_CHART_PADDING + dimensions.projection.left,\\n              width: dimensions.projection.width,\\n              height: 20,\\n            }}\\n            horizontal={true}\\n            text={`projection left: ${dimensions.projection.left} width: ${dimensions.projection.width}`}\\n          />\\n\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING + dimensions.projection.top,\\n              left: HTML_CHART_PADDING + 20 + dimensions.projection.left + dimensions.projection.width,\\n              width: 20,\\n              height: dimensions.projection.height,\\n            }}\\n            horizontal={false}\\n            text={`projection top: ${dimensions.projection.top} height: ${dimensions.projection.height}`}\\n          />\\n        </>\\n      )}\\n\\n      {dimensions && (\\n        <>\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING,\\n              left: HTML_CHART_PADDING + 10,\\n              width: 20,\\n              height: dimensions.parent.height,\\n            }}\\n            horizontal={false}\\n            text={`parent height: ${dimensions.parent.height}`}\\n          />\\n\\n          <Measurement\\n            dims={{\\n              bottom: 20,\\n              left: HTML_CHART_PADDING,\\n              width: dimensions.parent.width,\\n              height: HTML_CHART_PADDING,\\n            }}\\n            horizontal={true}\\n            text={`parent width: ${dimensions.parent.width}`}\\n          />\\n        </>\\n      )}\\n      <Chart title={title} description={description}>\\n        <Settings\\n          showLegend={legendEnabled}\\n          baseTheme={useBaseTheme()}\\n          theme={[\\n            {\\n              background: {\\n                color: 'transparent',\\n              },\\n              chartMargins: {\\n                top: padding,\\n                bottom: padding,\\n                left: padding,\\n                right: padding,\\n              },\\n            },\\n          ]}\\n          onProjectionAreaChange={onAreaChangeHandler}\\n        />\\n        {axisXEnabled && (\\n          <Axis\\n            id=\\\"bottom\\\"\\n            position={Position.Bottom}\\n            style={{ tickLine: { visible: false }, tickLabel: { padding: 5 } }}\\n          />\\n        )}\\n        {axisYEnabled && <Axis id=\\\"quantity\\\" position={Position.Left} ticks={5} />}\\n        <BarSeries\\n          id=\\\"data\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={[\\n            ['apples', 10],\\n            ['oranges', 3],\\n            ['bananas', 5],\\n          ]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Composable',\n};\n\nexport { Example as basic } from './1_basic.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, ScaleType, Settings, Position, Axis, BarSeries, AreaSeries, CurveType } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={[\\n          { x: 0, y: 2.5 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, ScaleType, Settings, Position, Axis, BarSeries, AreaSeries, CurveType } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', true);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={[\n          { x: 0, y: 2.5 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={[\\n          { x: 0, y: 2.5 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  LineSeries,\\n  ScaleType,\\n  CurveType,\\n  AreaSeries,\\n  BarSeries,\\n  Settings,\\n  Axis,\\n  Position,\\n  SeriesNameFn,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('debugState', true);\\n  const line = boolean('show line', true);\\n  const area = boolean('show area', true);\\n  const bar = boolean('show bar', true);\\n  const groupCount = number('number of groups', 1, { min: 1 });\\n  const splitSeriesAccessors = groupCount > 1 ? ['g'] : undefined;\\n  const naming: SeriesNameFn | undefined =\\n    groupCount === 1 ? undefined : ({ specId, seriesKeys }) => `${specId} | ${seriesKeys[0]}`;\\n\\n  const dg = new SeededDataGenerator();\\n  const lineData = dg.generateGroupedSeries(40, groupCount);\\n  const areaData = dg.generateGroupedSeries(40, groupCount);\\n  const barData = dg.generateGroupedSeries(40, groupCount);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debug={debug}\\n        debugState={debugState}\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      {line && (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          data={lineData}\\n        />\\n      )}\\n      {area && (\\n        <AreaSeries\\n          id=\\\"areas\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          data={areaData}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          curve={CurveType.CURVE_MONOTONE_X}\\n        />\\n      )}\\n\\n      {bar && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          data={barData}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":99},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":99}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  LineSeries,\n  ScaleType,\n  CurveType,\n  AreaSeries,\n  BarSeries,\n  Settings,\n  Axis,\n  Position,\n  SeriesNameFn,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('debugState', true);\n  const line = boolean('show line', true);\n  const area = boolean('show area', true);\n  const bar = boolean('show bar', true);\n  const groupCount = number('number of groups', 1, { min: 1 });\n  const splitSeriesAccessors = groupCount > 1 ? ['g'] : undefined;\n  const naming: SeriesNameFn | undefined =\n    groupCount === 1 ? undefined : ({ specId, seriesKeys }) => `${specId} | ${seriesKeys[0]}`;\n\n  const dg = new SeededDataGenerator();\n  const lineData = dg.generateGroupedSeries(40, groupCount);\n  const areaData = dg.generateGroupedSeries(40, groupCount);\n  const barData = dg.generateGroupedSeries(40, groupCount);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onRenderChange={getDebugStateLogger(debugState)}\n        debug={debug}\n        debugState={debugState}\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      {line && (\n        <LineSeries\n          id=\"lines\"\n          name={naming}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          splitSeriesAccessors={splitSeriesAccessors}\n          data={lineData}\n        />\n      )}\n      {area && (\n        <AreaSeries\n          id=\"areas\"\n          name={naming}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          data={areaData}\n          splitSeriesAccessors={splitSeriesAccessors}\n          curve={CurveType.CURVE_MONOTONE_X}\n        />\n      )}\n\n      {bar && (\n        <BarSeries\n          id=\"bars\"\n          name={naming}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          splitSeriesAccessors={splitSeriesAccessors}\n          data={barData}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('debugState', true);\\n  const line = boolean('show line', true);\\n  const area = boolean('show area', true);\\n  const bar = boolean('show bar', true);\\n  const groupCount = number('number of groups', 1, { min: 1 });\\n  const splitSeriesAccessors = groupCount > 1 ? ['g'] : undefined;\\n  const naming: SeriesNameFn | undefined =\\n    groupCount === 1 ? undefined : ({ specId, seriesKeys }) => `${specId} | ${seriesKeys[0]}`;\\n\\n  const dg = new SeededDataGenerator();\\n  const lineData = dg.generateGroupedSeries(40, groupCount);\\n  const areaData = dg.generateGroupedSeries(40, groupCount);\\n  const barData = dg.generateGroupedSeries(40, groupCount);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debug={debug}\\n        debugState={debugState}\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      {line && (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          data={lineData}\\n        />\\n      )}\\n      {area && (\\n        <AreaSeries\\n          id=\\\"areas\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          data={areaData}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          curve={CurveType.CURVE_MONOTONE_X}\\n        />\\n      )}\\n\\n      {bar && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          data={barData}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Debug Options',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as debugState } from './2_debug_state.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  225: 'gray',\\n  300: 'rgb(232,232,232)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={0}\\n      actual={0}\\n      bands={[225, 300]}\\n      domain={{ min: 0, max: 300 }}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  225: 'gray',\n  300: 'rgb(232,232,232)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={0}\n      actual={0}\n      bands={[225, 300]}\n      domain={{ min: 0, max: 300 }}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"225\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={0}\\n      actual={0}\\n      bands={[225, 300]}\\n      domain={{ min: 0, max: 300 }}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  199: 'rgba(255,0,0,0.5)',\\n  201: 'white',\\n  249: 'lightgrey',\\n  251: 'white',\\n  300: 'rgba(0,255,0,0.5)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showTarget = boolean('show target', true);\\n  const target = number('target', 260);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={0}\\n        target={showTarget ? target : undefined}\\n        actual={280}\\n        domain={{ min: 0, max: 300 }}\\n        bands={[199, 201, 249, 251, 300]}\\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor=\\\"280\\\"\\n        centralMinor={showTarget ? `target: ${target}` : undefined}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":55},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":55}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  199: 'rgba(255,0,0,0.5)',\n  201: 'white',\n  249: 'lightgrey',\n  251: 'white',\n  300: 'rgba(0,255,0,0.5)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showTarget = boolean('show target', true);\n  const target = number('target', 260);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={0}\n        target={showTarget ? target : undefined}\n        actual={280}\n        domain={{ min: 0, max: 300 }}\n        bands={[199, 201, 249, 251, 300]}\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={getBandFillColor}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor=\"280\"\n        centralMinor={showTarget ? `target: ${target}` : undefined}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showTarget = boolean('show target', true);\\n  const target = number('target', 260);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={0}\\n        target={showTarget ? target : undefined}\\n        actual={280}\\n        domain={{ min: 0, max: 300 }}\\n        bands={[199, 201, 249, 251, 300]}\\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor=\\\"280\\\"\\n        centralMinor={showTarget ? `target: ${target}` : undefined}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  215: 'rgb(232,232,232)',\\n  235: 'gray',\\n  300: 'rgb(232,232,232)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={0}\\n      actual={0}\\n      bands={[215, 235, 300]}\\n      domain={{ min: 0, max: 300 }}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  215: 'rgb(232,232,232)',\n  235: 'gray',\n  300: 'rgb(232,232,232)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={0}\n      actual={0}\n      bands={[215, 235, 300]}\n      domain={{ min: 0, max: 300 }}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"225\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={0}\\n      actual={0}\\n      bands={[215, 235, 300]}\\n      domain={{ min: 0, max: 300 }}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  210: 'rgb(232,232,232)',\\n  218: '#66c2a4',\\n  224: '#2ca25f',\\n  229: '#006d2c',\\n  235: '#2ca25f',\\n  243: '#66c2a4',\\n  300: 'rgb(232,232,232)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={226.5}\\n      actual={0}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[210, 218, 224, 229, 235, 243, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"226.5\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  210: 'rgb(232,232,232)',\n  218: '#66c2a4',\n  224: '#2ca25f',\n  229: '#006d2c',\n  235: '#2ca25f',\n  243: '#66c2a4',\n  300: 'rgb(232,232,232)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={226.5}\n      actual={0}\n      domain={{ min: 0, max: 300 }}\n      bands={[210, 218, 224, 229, 235, 243, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"226.5\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={226.5}\\n      actual={0}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[210, 218, 224, 229, 235, 243, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"226.5\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI - (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI - (Math.PI - (2 * Math.PI) / 3) / 2}\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI - (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI}\\n      angleEnd={0}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI}\n      angleEnd={0}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI}\\n      angleEnd={0}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = number('startAngle (π)', 1.5, { min: -2, max: 2, step: 1 / 8 });\\n  const end = number('endAngle (π)', -0.5, { min: -2, max: 2, step: 1 / 8 });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={GoalSubtype.Goal}\\n        base={0}\\n        target={260}\\n        actual={280}\\n        domain={{ min: 0, max: 300 }}\\n        bands={[200, 250, 300]}\\n        ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\\n        tickValueFormatter={({ value }) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"\\\"\\n        labelMinor=\\\"\\\"\\n        centralMajor=\\\"280 MB/s\\\"\\n        centralMinor=\\\"\\\"\\n        angleStart={start * Math.PI}\\n        angleEnd={end * Math.PI}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":25},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":25},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = number('startAngle (π)', 1.5, { min: -2, max: 2, step: 1 / 8 });\n  const end = number('endAngle (π)', -0.5, { min: -2, max: 2, step: 1 / 8 });\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec_1\"\n        subtype={GoalSubtype.Goal}\n        base={0}\n        target={260}\n        actual={280}\n        domain={{ min: 0, max: 300 }}\n        bands={[200, 250, 300]}\n        ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\n        tickValueFormatter={({ value }) => String(value)}\n        bandFillColor={getBandFillColor}\n        labelMajor=\"\"\n        labelMinor=\"\"\n        centralMajor=\"280 MB/s\"\n        centralMinor=\"\"\n        angleStart={start * Math.PI}\n        angleEnd={end * Math.PI}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = number('startAngle (π)', 1.5, { min: -2, max: 2, step: 1 / 8 });\\n  const end = number('endAngle (π)', -0.5, { min: -2, max: 2, step: 1 / 8 });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={GoalSubtype.Goal}\\n        base={0}\\n        target={260}\\n        actual={280}\\n        domain={{ min: 0, max: 300 }}\\n        bands={[200, 250, 300]}\\n        ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\\n        tickValueFormatter={({ value }) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"\\\"\\n        labelMinor=\\\"\\\"\\n        centralMajor=\\\"280 MB/s\\\"\\n        centralMinor=\\\"\\\"\\n        angleStart={start * Math.PI}\\n        angleEnd={end * Math.PI}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + Math.PI / 2 - Math.PI / 90}\\n      angleEnd={-Math.PI / 2 + Math.PI / 90}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI + Math.PI / 2 - Math.PI / 90}\n      angleEnd={-Math.PI / 2 + Math.PI / 90}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + Math.PI / 2 - Math.PI / 90}\\n      angleEnd={-Math.PI / 2 + Math.PI / 90}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, BandFillColorAccessorInput, Settings } from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, BandFillColorAccessorInput, Settings } from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={-(Math.PI - (2 * Math.PI) / 3) / 2}\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, BandFillColorAccessorInput, Settings } from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleStart={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, BandFillColorAccessorInput, Settings } from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\n      angleStart={(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleStart={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-200': `rgb(${q1},${q1},${q1})`,\\n  '-250': `rgb(${q2},${q2},${q2})`,\\n  '-300': `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-200': `rgb(${q1},${q1},${q1})`,\n  '-250': `rgb(${q2},${q2},${q2})`,\n  '-300': `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={-260}\n      actual={-280}\n      domain={{ min: -300, max: 0 }}\n      bands={[-200, -250, -300]}\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-280\"\n      centralMinor=\"target: -260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.VerticalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-200': `rgb(${q1},${q1},${q1})`,\\n  '-250': `rgb(${q2},${q2},${q2})`,\\n  '-300': `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.VerticalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-200': `rgb(${q1},${q1},${q1})`,\n  '-250': `rgb(${q2},${q2},${q2})`,\n  '-300': `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={-260}\n      actual={-280}\n      domain={{ min: -300, max: 0 }}\n      bands={[-200, -250, -300]}\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-280\"\n      centralMinor=\"target: -260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-200': `rgb(${q1},${q1},${q1})`,\\n  '-250': `rgb(${q2},${q2},${q2})`,\\n  '-300': `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-200': `rgb(${q1},${q1},${q1})`,\n  '-250': `rgb(${q2},${q2},${q2})`,\n  '-300': `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={-260}\n      actual={-280}\n      domain={{ min: -300, max: 0 }}\n      bands={[-200, -250, -300]}\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-280\"\n      centralMinor=\"target: -260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-100': 'lightcoral',\\n  0: 'indianred',\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -200, max: 300 }}\\n      bands={[-200, -100, 0, 200, 250, 300]}\\n      ticks={[-200, -100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-100': 'lightcoral',\n  0: 'indianred',\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={-80}\n      domain={{ min: -200, max: 300 }}\n      bands={[-200, -100, 0, 200, 250, 300]}\n      ticks={[-200, -100, 0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-80\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -200, max: 300 }}\\n      bands={[-200, -100, 0, 200, 250, 300]}\\n      ticks={[-200, -100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.VerticalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-100': 'lightcoral',\\n  0: 'indianred',\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -200, max: 300 }}\\n      bands={[-200, -100, 0, 200, 250, 300]}\\n      ticks={[-200, -100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.VerticalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-100': 'lightcoral',\n  0: 'indianred',\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={-80}\n      domain={{ min: -200, max: 300 }}\n      bands={[-200, -100, 0, 200, 250, 300]}\n      ticks={[-200, -100, 0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-80\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -200, max: 300 }}\\n      bands={[-200, -100, 0, 200, 250, 300]}\\n      ticks={[-200, -100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-50': 'lightcoral',\\n  0: 'indianred',\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -100, max: 300 }}\\n      bands={[-100, -50, 0, 200, 250, 300]}\\n      ticks={[-100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-50': 'lightcoral',\n  0: 'indianred',\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={-80}\n      domain={{ min: -100, max: 300 }}\n      bands={[-100, -50, 0, 200, 250, 300]}\n      ticks={[-100, 0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-80\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -100, max: 300 }}\\n      bands={[-100, -50, 0, 200, 250, 300]}\\n      ticks={[-100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Color, BandFillColorAccessorInput, Settings } from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const bandLabels = ['freezing', 'chilly', 'brisk'];\\n  const bands = [200, 250, 300];\\n\\n  const opacityMap: { [k: string]: number } = {\\n    '200': 0.2,\\n    '250': 0.12,\\n    '300': 0.05,\\n  };\\n\\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\\n    const defaultValue = opacityMap[band];\\n    acc[band] = `rgba(0, 0, 0, ${defaultValue.toFixed(2)})`;\\n    return acc;\\n  }, {});\\n\\n  const getBandFillColor = getBandFillColorFn(colorMap);\\n\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={0}\\n        target={260}\\n        actual={170}\\n        domain={{ min: 0, max: 300 }}\\n        bands={bands}\\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor=\\\"170\\\"\\n        centralMinor=\\\"\\\"\\n        angleStart={Math.PI}\\n        angleEnd={0}\\n        bandLabels={bandLabels}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":62},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":62}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Color, BandFillColorAccessorInput, Settings } from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const bandLabels = ['freezing', 'chilly', 'brisk'];\n  const bands = [200, 250, 300];\n\n  const opacityMap: { [k: string]: number } = {\n    '200': 0.2,\n    '250': 0.12,\n    '300': 0.05,\n  };\n\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\n    const defaultValue = opacityMap[band];\n    acc[band] = `rgba(0, 0, 0, ${defaultValue.toFixed(2)})`;\n    return acc;\n  }, {});\n\n  const getBandFillColor = getBandFillColorFn(colorMap);\n\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={0}\n        target={260}\n        actual={170}\n        domain={{ min: 0, max: 300 }}\n        bands={bands}\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={getBandFillColor}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor=\"170\"\n        centralMinor=\"\"\n        angleStart={Math.PI}\n        angleEnd={0}\n        bandLabels={bandLabels}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const bandLabels = ['freezing', 'chilly', 'brisk'];\\n  const bands = [200, 250, 300];\\n\\n  const opacityMap: { [k: string]: number } = {\\n    '200': 0.2,\\n    '250': 0.12,\\n    '300': 0.05,\\n  };\\n\\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\\n    const defaultValue = opacityMap[band];\\n    acc[band] = `rgba(0, 0, 0, ${defaultValue.toFixed(2)})`;\\n    return acc;\\n  }, {});\\n\\n  const getBandFillColor = getBandFillColorFn(colorMap);\\n\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={0}\\n        target={260}\\n        actual={170}\\n        domain={{ min: 0, max: 300 }}\\n        bands={bands}\\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor=\\\"170\\\"\\n        centralMinor=\\\"\\\"\\n        angleStart={Math.PI}\\n        angleEnd={0}\\n        bandLabels={bandLabels}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { array, boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const subtype = customKnobs.fromEnum('subtype', GoalSubtype, GoalSubtype.VerticalBullet);\\n  const reverse = boolean('reverse', false);\\n  const start = number('angleStart (π)', 5 / 4, { min: -2, max: 2, step: 1 / 8 });\\n  const end = number('angleEnd (π)', -1 / 4, { min: -2, max: 2, step: 1 / 8 });\\n  const base = number('base', 0);\\n  const target = number('target', 260);\\n  const actual = number('actual', 280);\\n  const min = number('domain min', 0, { min: 0, step: 50 });\\n  const max = number('domain max', 300, { min, step: 50 });\\n  const autoTicks = boolean('auto generate ticks', true);\\n  const ticks = autoTicks ? undefined : array('ticks', ['0', '100', '200', '300']).map(Number);\\n  const autoBands = boolean('auto generate bands', true);\\n  const bands = autoBands ? undefined : array('bands', ['200', '250', '300']).map(Number);\\n\\n  const angleStart = start * Math.PI;\\n  const angleEnd = end * Math.PI;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec\\\"\\n        subtype={subtype}\\n        base={base}\\n        target={target}\\n        actual={actual}\\n        ticks={ticks}\\n        bands={bands}\\n        domain={{ min, max }}\\n        angleStart={reverse ? angleEnd : angleStart}\\n        angleEnd={reverse ? angleStart : angleEnd}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        labelMajor=\\\"Speed average\\\"\\n        labelMinor={subtype === GoalSubtype.Goal ? '' : `${actual} MB/s`}\\n        centralMajor={`${actual} MB/s`}\\n        centralMinor=\\\"\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `Leaving \\\\`ticks\\\\` and/or \\\\`bands\\\\` as \\\\`undefined\\\\` will automatically generate linear values given the specified domain.\\nIf \\\\`ticks\\\\` and/or \\\\`bands\\\\` is set to \\\\`[]\\\\` (empty array), no ticks or bands will be displayed, respectively`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":60},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":60}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { array, boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const subtype = customKnobs.fromEnum('subtype', GoalSubtype, GoalSubtype.VerticalBullet);\n  const reverse = boolean('reverse', false);\n  const start = number('angleStart (π)', 5 / 4, { min: -2, max: 2, step: 1 / 8 });\n  const end = number('angleEnd (π)', -1 / 4, { min: -2, max: 2, step: 1 / 8 });\n  const base = number('base', 0);\n  const target = number('target', 260);\n  const actual = number('actual', 280);\n  const min = number('domain min', 0, { min: 0, step: 50 });\n  const max = number('domain max', 300, { min, step: 50 });\n  const autoTicks = boolean('auto generate ticks', true);\n  const ticks = autoTicks ? undefined : array('ticks', ['0', '100', '200', '300']).map(Number);\n  const autoBands = boolean('auto generate bands', true);\n  const bands = autoBands ? undefined : array('bands', ['200', '250', '300']).map(Number);\n\n  const angleStart = start * Math.PI;\n  const angleEnd = end * Math.PI;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec\"\n        subtype={subtype}\n        base={base}\n        target={target}\n        actual={actual}\n        ticks={ticks}\n        bands={bands}\n        domain={{ min, max }}\n        angleStart={reverse ? angleEnd : angleStart}\n        angleEnd={reverse ? angleStart : angleEnd}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        labelMajor=\"Speed average\"\n        labelMinor={subtype === GoalSubtype.Goal ? '' : `${actual} MB/s`}\n        centralMajor={`${actual} MB/s`}\n        centralMinor=\"\"\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `Leaving \\`ticks\\` and/or \\`bands\\` as \\`undefined\\` will automatically generate linear values given the specified domain.\nIf \\`ticks\\` and/or \\`bands\\` is set to \\`[]\\` (empty array), no ticks or bands will be displayed, respectively`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const subtype = customKnobs.fromEnum('subtype', GoalSubtype, GoalSubtype.VerticalBullet);\\n  const reverse = boolean('reverse', false);\\n  const start = number('angleStart (π)', 5 / 4, { min: -2, max: 2, step: 1 / 8 });\\n  const end = number('angleEnd (π)', -1 / 4, { min: -2, max: 2, step: 1 / 8 });\\n  const base = number('base', 0);\\n  const target = number('target', 260);\\n  const actual = number('actual', 280);\\n  const min = number('domain min', 0, { min: 0, step: 50 });\\n  const max = number('domain max', 300, { min, step: 50 });\\n  const autoTicks = boolean('auto generate ticks', true);\\n  const ticks = autoTicks ? undefined : array('ticks', ['0', '100', '200', '300']).map(Number);\\n  const autoBands = boolean('auto generate bands', true);\\n  const bands = autoBands ? undefined : array('bands', ['200', '250', '300']).map(Number);\\n\\n  const angleStart = start * Math.PI;\\n  const angleEnd = end * Math.PI;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec\\\"\\n        subtype={subtype}\\n        base={base}\\n        target={target}\\n        actual={actual}\\n        ticks={ticks}\\n        bands={bands}\\n        domain={{ min, max }}\\n        angleStart={reverse ? angleEnd : angleStart}\\n        angleEnd={reverse ? angleStart : angleEnd}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        labelMajor=\\\"Speed average\\\"\\n        labelMinor={subtype === GoalSubtype.Goal ? '' : `${actual} MB/s`}\\n        centralMajor={`${actual} MB/s`}\\n        centralMinor=\\\"\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number, color, array, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { Color } from '../../../packages/charts/src/common/colors';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\\n  const bands = array('bands', ['200', '250', '300']).map(Number);\\n\\n  const opacityMap: { [k: string]: number } = {\\n    '200': 0.2,\\n    '250': 0.12,\\n    '300': 0.05,\\n  };\\n\\n  const useColors = boolean('use custom band colors', false, 'colors');\\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\\n    const defaultValue = opacityMap[band] ?? 0;\\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\\n    return acc;\\n  }, {});\\n\\n  const getBandFillColor = getBandFillColorFn(colorMap);\\n\\n  const angleStart =\\n    number('angleStart (n * π/8)', 8, {\\n      step: 1,\\n      min: -2 * 8,\\n      max: 2 * 8,\\n    }) *\\n    (Math.PI / 8);\\n  const angleEnd =\\n    number('angleEnd (n * π/8)', 0, {\\n      step: 1,\\n      min: -2 * 8,\\n      max: 2 * 8,\\n    }) *\\n    (Math.PI / 8);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={base}\\n        target={target}\\n        actual={actual}\\n        bands={bands}\\n        ticks={ticks}\\n        domain={{ min: 0, max: 300 }}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={useColors ? getBandFillColor : undefined}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor={() => `$${actual}k USD`}\\n        centralMinor=\\\"\\\"\\n        angleStart={angleStart}\\n        angleEnd={angleEnd}\\n        tooltipValueFormatter={(d) => `$${d}k USD`}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":84},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":84}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number, color, array, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { Color } from '../../../packages/charts/src/common/colors';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\n  const bands = array('bands', ['200', '250', '300']).map(Number);\n\n  const opacityMap: { [k: string]: number } = {\n    '200': 0.2,\n    '250': 0.12,\n    '300': 0.05,\n  };\n\n  const useColors = boolean('use custom band colors', false, 'colors');\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\n    const defaultValue = opacityMap[band] ?? 0;\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\n    return acc;\n  }, {});\n\n  const getBandFillColor = getBandFillColorFn(colorMap);\n\n  const angleStart =\n    number('angleStart (n * π/8)', 8, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n  const angleEnd =\n    number('angleEnd (n * π/8)', 0, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={base}\n        target={target}\n        actual={actual}\n        bands={bands}\n        ticks={ticks}\n        domain={{ min: 0, max: 300 }}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={useColors ? getBandFillColor : undefined}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor={() => `$${actual}k USD`}\n        centralMinor=\"\"\n        angleStart={angleStart}\n        angleEnd={angleEnd}\n        tooltipValueFormatter={(d) => `$${d}k USD`}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\\n  const bands = array('bands', ['200', '250', '300']).map(Number);\\n\\n  const opacityMap: { [k: string]: number } = {\\n    '200': 0.2,\\n    '250': 0.12,\\n    '300': 0.05,\\n  };\\n\\n  const useColors = boolean('use custom band colors', false, 'colors');\\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\\n    const defaultValue = opacityMap[band] ?? 0;\\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\\n    return acc;\\n  }, {});\\n\\n  const getBandFillColor = getBandFillColorFn(colorMap);\\n\\n  const angleStart =\\n    number('angleStart (n * π/8)', 8, {\\n      step: 1,\\n      min: -2 * 8,\\n      max: 2 * 8,\\n    }) *\\n    (Math.PI / 8);\\n  const angleEnd =\\n    number('angleEnd (n * π/8)', 0, {\\n      step: 1,\\n      min: -2 * 8,\\n      max: 2 * 8,\\n    }) *\\n    (Math.PI / 8);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={base}\\n        target={target}\\n        actual={actual}\\n        bands={bands}\\n        ticks={ticks}\\n        domain={{ min: 0, max: 300 }}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={useColors ? getBandFillColor : undefined}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor={() => `$${actual}k USD`}\\n        centralMinor=\\\"\\\"\\n        angleStart={angleStart}\\n        angleEnd={angleEnd}\\n        tooltipValueFormatter={(d) => `$${d}k USD`}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.VerticalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.VerticalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst colorful = subtype === 'goal';\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: colorful ? 'rgba(255,0,0,0.5)' : `rgb(${q1},${q1},${q1})`,\\n  250: colorful ? 'yellow' : `rgb(${q2},${q2},${q2})`,\\n  300: colorful ? 'rgba(0,255,0,0.5)' : `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.Goal;\n\nconst colorful = subtype === 'goal';\n\nconst getBandFillColor = getBandFillColorFn({\n  200: colorful ? 'rgba(255,0,0,0.5)' : `rgb(${q1},${q1},${q1})`,\n  250: colorful ? 'yellow' : `rgb(${q2},${q2},${q2})`,\n  300: colorful ? 'rgba(0,255,0,0.5)' : `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[300]}\\n      ticks={[0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[300]}\n      ticks={[0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[300]}\\n      ticks={[0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[]}\\n      ticks={[0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[]}\n      ticks={[0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[]}\\n      ticks={[0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: 'rgba(255,0,0,0.5)',\\n  250: 'yellow',\\n  300: 'rgba(0,255,0,0.5)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 100, 200, 250, 260, 270, 280, 290, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: 'rgba(255,0,0,0.5)',\n  250: 'yellow',\n  300: 'rgba(0,255,0,0.5)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 100, 200, 250, 260, 270, 280, 290, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 100, 200, 250, 260, 270, 280, 290, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  300: 'rgb(232,232,232)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={225}\\n      actual={0}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":25},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":25},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  300: 'rgb(232,232,232)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={225}\n      actual={0}\n      domain={{ min: 0, max: 300 }}\n      bands={[300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"225\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={225}\\n      actual={0}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Goal (@alpha)',\n};\n\nexport { Example as gaugeWithTarget } from './2_gauge_with_target.story';\nexport { Example as horizontalBullet } from './3_horizontal_bullet.story';\nexport { Example as verticalBullet } from './4_vertical_bullet.story';\nexport { Example as minimalGoal } from './5_minimal.story';\nexport { Example as minimalHorizontal } from './6_minimal_horizontal.story';\nexport { Example as horizontalBar } from './7_horizontal_bar.story';\nexport { Example as irregularTicks } from './8_irregular_ticks.story';\nexport { Example as minimalBand } from './9_minimal_band.story';\nexport { Example as bandInBand } from './10_band_in_band.story';\nexport { Example as gaps } from './11_gaps.story';\nexport { Example as range } from './12_range.story';\nexport { Example as confidenceLevel } from './13_confidence_level.story';\nexport { Example as third } from './14_one_third.story';\nexport { Example as halfCircle } from './15_half_circle.story';\nexport { Example as twoThirds } from './16_two_thirds.story';\nexport { Example as threeQuarters } from './17_three_quarters.story';\nexport { Example as fullCircle } from './17_total_circle.story';\nexport { Example as smallGap } from './17_very_small_gap.story';\nexport { Example as sideGauge } from './18_side_gauge.story';\nexport { Example as sideGaugeInverted } from './18_side_gauge_inverted_angle_relation.story';\nexport { Example as horizontalNegative } from './19_horizontal_negative.story';\nexport { Example as verticalNegative } from './20_vertical_negative.story';\nexport { Example as goalNegative } from './21_goal_negative.story';\nexport { Example as horizontalPlusMinus } from './22_horizontal_plusminus.story';\nexport { Example as verticalPlusMinus } from './23_vertical_plusminus.story';\nexport { Example as goalPlusMinus } from './24_goal_plusminus.story';\nexport { Example as goalSemantics } from './25_goal_semantic.story';\nexport { Example as autoLinearTicks } from './26_auto_linear_ticks.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  GridLineStyle,\\n  LineSeries,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction generateGridLineStyle(group: string, gridColor = 'purple'): GridLineStyle {\\n  const groupId = `${group} axis`;\\n\\n  return {\\n    visible: true,\\n    stroke: color(`${groupId} grid line stroke color`, gridColor, groupId),\\n    strokeWidth: number(\\n      `${groupId} grid line stroke width`,\\n      1,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 10,\\n        step: 1,\\n      },\\n      groupId,\\n    ),\\n    opacity: number(\\n      `${groupId} grid line stroke opacity`,\\n      1,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      },\\n      groupId,\\n    ),\\n    dash: [\\n      number(\\n        `${groupId} grid line dash length`,\\n        1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 10,\\n          step: 1,\\n        },\\n        groupId,\\n      ),\\n      number(\\n        `${groupId} grid line dash spacing`,\\n        1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 10,\\n          step: 1,\\n        },\\n        groupId,\\n      ),\\n    ],\\n  };\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left, 'lightblue');\\n  const rightAxisGridLineStyle = generateGridLineStyle(Position.Right, 'red');\\n  const topAxisGridLineStyle = generateGridLineStyle(Position.Top, 'teal');\\n  const bottomAxisGridLineStyle = generateGridLineStyle(Position.Bottom, 'blue');\\n  const toggleBottomAxisGridLineStyle = boolean('use axis gridLine vertically', false, 'bottom axis');\\n  const toggleHorizontalAxisGridLineStyle = boolean('use axis gridLine horizontally', false, 'left axis');\\n  const bottomAxisThemeGridLineStyle = generateGridLineStyle('Vertical Axis Theme', 'violet');\\n  const leftAxisThemeGridLineStyle = generateGridLineStyle('Horizontal Axis Theme', 'hotpink');\\n  const theme: PartialTheme = {\\n    axes: {\\n      gridLine: { vertical: leftAxisThemeGridLineStyle, horizontal: bottomAxisThemeGridLineStyle },\\n    },\\n  };\\n  const integersOnlyLeft = boolean('left axis show only integer values', false, 'left axis');\\n  const integersOnlyRight = boolean('right axis show only intger values', false, 'right axis');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        gridLine={{\\n          ...(toggleBottomAxisGridLineStyle && bottomAxisGridLineStyle),\\n          visible: boolean('show bottom axis grid lines', false, 'bottom axis'),\\n        }}\\n        maximumFractionDigits={boolean('bottom axis show only integer values', false, 'bottom axis') ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"left1\\\"\\n        position={Position.Left}\\n        title=\\\"Left axis 1\\\"\\n        tickFormat={integersOnlyLeft ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...(toggleHorizontalAxisGridLineStyle && leftAxisGridLineStyle),\\n          visible: boolean('show left axis grid lines', false, 'left axis'),\\n        }}\\n        maximumFractionDigits={integersOnlyLeft ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title=\\\"Top axis\\\"\\n        showOverlappingTicks\\n        gridLine={{\\n          ...topAxisGridLineStyle,\\n          visible: boolean('show top axis grid lines', false, 'top axis'),\\n        }}\\n        maximumFractionDigits={boolean('top axis show only integer values', false, 'top axis') ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Right axis\\\"\\n        position={Position.Right}\\n        tickFormat={integersOnlyRight ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...rightAxisGridLineStyle,\\n          visible: boolean('show right axis grid lines', false, 'right axis'),\\n        }}\\n        maximumFractionDigits={integersOnlyRight ? 0 : undefined}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":82},\"endLoc\":{\"col\":1,\"line\":175},\"startBody\":{\"col\":36,\"line\":82},\"endBody\":{\"col\":1,\"line\":175}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  GridLineStyle,\n  LineSeries,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction generateGridLineStyle(group: string, gridColor = 'purple'): GridLineStyle {\n  const groupId = `${group} axis`;\n\n  return {\n    visible: true,\n    stroke: color(`${groupId} grid line stroke color`, gridColor, groupId),\n    strokeWidth: number(\n      `${groupId} grid line stroke width`,\n      1,\n      {\n        range: true,\n        min: 0,\n        max: 10,\n        step: 1,\n      },\n      groupId,\n    ),\n    opacity: number(\n      `${groupId} grid line stroke opacity`,\n      1,\n      {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      },\n      groupId,\n    ),\n    dash: [\n      number(\n        `${groupId} grid line dash length`,\n        1,\n        {\n          range: true,\n          min: 0,\n          max: 10,\n          step: 1,\n        },\n        groupId,\n      ),\n      number(\n        `${groupId} grid line dash spacing`,\n        1,\n        {\n          range: true,\n          min: 0,\n          max: 10,\n          step: 1,\n        },\n        groupId,\n      ),\n    ],\n  };\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left, 'lightblue');\n  const rightAxisGridLineStyle = generateGridLineStyle(Position.Right, 'red');\n  const topAxisGridLineStyle = generateGridLineStyle(Position.Top, 'teal');\n  const bottomAxisGridLineStyle = generateGridLineStyle(Position.Bottom, 'blue');\n  const toggleBottomAxisGridLineStyle = boolean('use axis gridLine vertically', false, 'bottom axis');\n  const toggleHorizontalAxisGridLineStyle = boolean('use axis gridLine horizontally', false, 'left axis');\n  const bottomAxisThemeGridLineStyle = generateGridLineStyle('Vertical Axis Theme', 'violet');\n  const leftAxisThemeGridLineStyle = generateGridLineStyle('Horizontal Axis Theme', 'hotpink');\n  const theme: PartialTheme = {\n    axes: {\n      gridLine: { vertical: leftAxisThemeGridLineStyle, horizontal: bottomAxisThemeGridLineStyle },\n    },\n  };\n  const integersOnlyLeft = boolean('left axis show only integer values', false, 'left axis');\n  const integersOnlyRight = boolean('right axis show only intger values', false, 'right axis');\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks\n        gridLine={{\n          ...(toggleBottomAxisGridLineStyle && bottomAxisGridLineStyle),\n          visible: boolean('show bottom axis grid lines', false, 'bottom axis'),\n        }}\n        maximumFractionDigits={boolean('bottom axis show only integer values', false, 'bottom axis') ? 0 : undefined}\n      />\n      <Axis\n        id=\"left1\"\n        position={Position.Left}\n        title=\"Left axis 1\"\n        tickFormat={integersOnlyLeft ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\n        gridLine={{\n          ...(toggleHorizontalAxisGridLineStyle && leftAxisGridLineStyle),\n          visible: boolean('show left axis grid lines', false, 'left axis'),\n        }}\n        maximumFractionDigits={integersOnlyLeft ? 0 : undefined}\n      />\n      <Axis\n        id=\"top\"\n        position={Position.Top}\n        title=\"Top axis\"\n        showOverlappingTicks\n        gridLine={{\n          ...topAxisGridLineStyle,\n          visible: boolean('show top axis grid lines', false, 'top axis'),\n        }}\n        maximumFractionDigits={boolean('top axis show only integer values', false, 'top axis') ? 0 : undefined}\n      />\n      <Axis\n        id=\"right\"\n        title=\"Right axis\"\n        position={Position.Right}\n        tickFormat={integersOnlyRight ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\n        gridLine={{\n          ...rightAxisGridLineStyle,\n          visible: boolean('show right axis grid lines', false, 'right axis'),\n        }}\n        maximumFractionDigits={integersOnlyRight ? 0 : undefined}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        groupId=\"group2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left, 'lightblue');\\n  const rightAxisGridLineStyle = generateGridLineStyle(Position.Right, 'red');\\n  const topAxisGridLineStyle = generateGridLineStyle(Position.Top, 'teal');\\n  const bottomAxisGridLineStyle = generateGridLineStyle(Position.Bottom, 'blue');\\n  const toggleBottomAxisGridLineStyle = boolean('use axis gridLine vertically', false, 'bottom axis');\\n  const toggleHorizontalAxisGridLineStyle = boolean('use axis gridLine horizontally', false, 'left axis');\\n  const bottomAxisThemeGridLineStyle = generateGridLineStyle('Vertical Axis Theme', 'violet');\\n  const leftAxisThemeGridLineStyle = generateGridLineStyle('Horizontal Axis Theme', 'hotpink');\\n  const theme: PartialTheme = {\\n    axes: {\\n      gridLine: { vertical: leftAxisThemeGridLineStyle, horizontal: bottomAxisThemeGridLineStyle },\\n    },\\n  };\\n  const integersOnlyLeft = boolean('left axis show only integer values', false, 'left axis');\\n  const integersOnlyRight = boolean('right axis show only intger values', false, 'right axis');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        gridLine={{\\n          ...(toggleBottomAxisGridLineStyle && bottomAxisGridLineStyle),\\n          visible: boolean('show bottom axis grid lines', false, 'bottom axis'),\\n        }}\\n        maximumFractionDigits={boolean('bottom axis show only integer values', false, 'bottom axis') ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"left1\\\"\\n        position={Position.Left}\\n        title=\\\"Left axis 1\\\"\\n        tickFormat={integersOnlyLeft ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...(toggleHorizontalAxisGridLineStyle && leftAxisGridLineStyle),\\n          visible: boolean('show left axis grid lines', false, 'left axis'),\\n        }}\\n        maximumFractionDigits={integersOnlyLeft ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title=\\\"Top axis\\\"\\n        showOverlappingTicks\\n        gridLine={{\\n          ...topAxisGridLineStyle,\\n          visible: boolean('show top axis grid lines', false, 'top axis'),\\n        }}\\n        maximumFractionDigits={boolean('top axis show only integer values', false, 'top axis') ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Right axis\\\"\\n        position={Position.Right}\\n        tickFormat={integersOnlyRight ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...rightAxisGridLineStyle,\\n          visible: boolean('show right axis grid lines', false, 'right axis'),\\n        }}\\n        maximumFractionDigits={integersOnlyRight ? 0 : undefined}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, GridLineStyle, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction generateGridLineStyle(group: string, gridColor = 'purple'): GridLineStyle {\\n  const groupId = `${group} axis`;\\n\\n  return {\\n    visible: true,\\n    stroke: color(`${groupId} grid line stroke color`, gridColor, groupId),\\n    strokeWidth: number(\\n      `${groupId} grid line stroke width`,\\n      1,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 10,\\n        step: 1,\\n      },\\n      groupId,\\n    ),\\n    opacity: number(\\n      `${groupId} grid line stroke opacity`,\\n      1,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      },\\n      groupId,\\n    ),\\n    dash: [\\n      number(\\n        `${groupId} grid line dash length`,\\n        1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 10,\\n          step: 1,\\n        },\\n        groupId,\\n      ),\\n      number(\\n        `${groupId} grid line dash spacing`,\\n        1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 10,\\n          step: 1,\\n        },\\n        groupId,\\n      ),\\n    ],\\n  };\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left);\\n  const leftAxisGridLineStyle2 = generateGridLineStyle(`${Position.Left}2`);\\n\\n  return (\\n    <Chart title={title} description={description} size={[500, 300]}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"left1\\\"\\n        title=\\\"Left axis 1\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...leftAxisGridLineStyle,\\n          visible: boolean('show left axis grid lines', false, 'left axis'),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis 2\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...leftAxisGridLineStyle2,\\n          visible: boolean('show left axis 2 grid lines', false, 'left2 axis'),\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":72},\"endLoc\":{\"col\":1,\"line\":130},\"startBody\":{\"col\":36,\"line\":72},\"endBody\":{\"col\":1,\"line\":130}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, GridLineStyle, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction generateGridLineStyle(group: string, gridColor = 'purple'): GridLineStyle {\n  const groupId = `${group} axis`;\n\n  return {\n    visible: true,\n    stroke: color(`${groupId} grid line stroke color`, gridColor, groupId),\n    strokeWidth: number(\n      `${groupId} grid line stroke width`,\n      1,\n      {\n        range: true,\n        min: 0,\n        max: 10,\n        step: 1,\n      },\n      groupId,\n    ),\n    opacity: number(\n      `${groupId} grid line stroke opacity`,\n      1,\n      {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      },\n      groupId,\n    ),\n    dash: [\n      number(\n        `${groupId} grid line dash length`,\n        1,\n        {\n          range: true,\n          min: 0,\n          max: 10,\n          step: 1,\n        },\n        groupId,\n      ),\n      number(\n        `${groupId} grid line dash spacing`,\n        1,\n        {\n          range: true,\n          min: 0,\n          max: 10,\n          step: 1,\n        },\n        groupId,\n      ),\n    ],\n  };\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left);\n  const leftAxisGridLineStyle2 = generateGridLineStyle(`${Position.Left}2`);\n\n  return (\n    <Chart title={title} description={description} size={[500, 300]}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"left1\"\n        title=\"Left axis 1\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        gridLine={{\n          ...leftAxisGridLineStyle,\n          visible: boolean('show left axis grid lines', false, 'left axis'),\n        }}\n      />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis 2\"\n        groupId=\"group2\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        gridLine={{\n          ...leftAxisGridLineStyle2,\n          visible: boolean('show left axis 2 grid lines', false, 'left2 axis'),\n        }}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        groupId=\"group2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left);\\n  const leftAxisGridLineStyle2 = generateGridLineStyle(`${Position.Left}2`);\\n\\n  return (\\n    <Chart title={title} description={description} size={[500, 300]}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"left1\\\"\\n        title=\\\"Left axis 1\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...leftAxisGridLineStyle,\\n          visible: boolean('show left axis grid lines', false, 'left axis'),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis 2\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...leftAxisGridLineStyle2,\\n          visible: boolean('show left axis 2 grid lines', false, 'left2 axis'),\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { array, boolean, color, number } from '@storybook/addon-knobs';\\nimport { startCase } from 'lodash';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  LineSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  TooltipType,\\n  PartialTheme,\\n  StrokeStyle,\\n  StrokeDashArray,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dg = new SeededDataGenerator();\\nconst data = dg.generateBasicSeries(20);\\n\\ntype LineProps = StrokeStyle & StrokeDashArray;\\n\\nconst getLineStyles = ({ stroke, strokeWidth, dash }: Partial<LineProps> = {}, group?: string): LineProps => ({\\n  stroke: color('Stroke', stroke ?? '#ccc', group),\\n  strokeWidth: number('Stroke width', strokeWidth ?? 2, { min: 1, max: 6, range: true, step: 1 }, group),\\n  dash: (\\n    array(\\n      'Dash',\\n      (dash ?? []).map((n) => `${n}`),\\n      ',',\\n      group,\\n    ) ?? []\\n  ).map((s) => parseInt(s, 10)),\\n});\\n\\nconst getAxisKnobs = (position: Position) => {\\n  const title = `${startCase(position)} axis`;\\n  const visible = boolean('Show gridline', true, title);\\n  return {\\n    id: position,\\n    position,\\n    title,\\n    tickFormat: (n: number) => n.toFixed(1),\\n    gridLine: {\\n      visible,\\n      opacity: number('Opacity', 0.2, { min: 0, max: 1, range: true, step: 0.1 }, title),\\n      ...getLineStyles(\\n        {\\n          dash: position === Position.Left ? [4, 4] : undefined,\\n        },\\n        title,\\n      ),\\n    },\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    crosshair: {\\n      line: getLineStyles({ stroke: 'red' }, 'Crosshair line'),\\n      crossLine: getLineStyles({ stroke: 'red', dash: [4, 4] }, 'Crosshair cross line'),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip type={customKnobs.enum.tooltipType('Tooltip type', TooltipType.Crosshairs)} />\\n      <Axis {...getAxisKnobs(Position.Left)} />\\n      <Axis {...getAxisKnobs(Position.Bottom)} />\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":71},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":71},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { array, boolean, color, number } from '@storybook/addon-knobs';\nimport { startCase } from 'lodash';\nimport React from 'react';\n\nimport {\n  Axis,\n  LineSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  TooltipType,\n  PartialTheme,\n  StrokeStyle,\n  StrokeDashArray,\n  Tooltip,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dg = new SeededDataGenerator();\nconst data = dg.generateBasicSeries(20);\n\ntype LineProps = StrokeStyle & StrokeDashArray;\n\nconst getLineStyles = ({ stroke, strokeWidth, dash }: Partial<LineProps> = {}, group?: string): LineProps => ({\n  stroke: color('Stroke', stroke ?? '#ccc', group),\n  strokeWidth: number('Stroke width', strokeWidth ?? 2, { min: 1, max: 6, range: true, step: 1 }, group),\n  dash: (\n    array(\n      'Dash',\n      (dash ?? []).map((n) => `${n}`),\n      ',',\n      group,\n    ) ?? []\n  ).map((s) => parseInt(s, 10)),\n});\n\nconst getAxisKnobs = (position: Position) => {\n  const title = `${startCase(position)} axis`;\n  const visible = boolean('Show gridline', true, title);\n  return {\n    id: position,\n    position,\n    title,\n    tickFormat: (n: number) => n.toFixed(1),\n    gridLine: {\n      visible,\n      opacity: number('Opacity', 0.2, { min: 0, max: 1, range: true, step: 0.1 }, title),\n      ...getLineStyles(\n        {\n          dash: position === Position.Left ? [4, 4] : undefined,\n        },\n        title,\n      ),\n    },\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    crosshair: {\n      line: getLineStyles({ stroke: 'red' }, 'Crosshair line'),\n      crossLine: getLineStyles({ stroke: 'red', dash: [4, 4] }, 'Crosshair cross line'),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\n      <Tooltip type={customKnobs.enum.tooltipType('Tooltip type', TooltipType.Crosshairs)} />\n      <Axis {...getAxisKnobs(Position.Left)} />\n      <Axis {...getAxisKnobs(Position.Bottom)} />\n      <LineSeries\n        id=\"line\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    crosshair: {\\n      line: getLineStyles({ stroke: 'red' }, 'Crosshair line'),\\n      crossLine: getLineStyles({ stroke: 'red', dash: [4, 4] }, 'Crosshair cross line'),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip type={customKnobs.enum.tooltipType('Tooltip type', TooltipType.Crosshairs)} />\\n      <Axis {...getAxisKnobs(Position.Left)} />\\n      <Axis {...getAxisKnobs(Position.Bottom)} />\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Grids',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as multipleAxesWithTheSamePosition } from './2_multiple_axes.story';\nexport { Example as lines } from './3_lines.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React, { useMemo } from 'react';\\n\\nimport {\\n  Chart,\\n  Heatmap,\\n  HeatmapStyle,\\n  niceTimeFormatter,\\n  PointerEvent,\\n  RecursivePartial,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { DATA_6 } from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\nimport { useHeatmapSelection } from '../utils/use_heatmap_selection';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const { highlightedData, onElementClick, onBrushEnd } = useHeatmapSelection();\\n\\n  const debugState = boolean('Enable debug state', true);\\n  const showXAxisTitle = boolean('Show x axis title', false);\\n  const showYAxisTitle = boolean('Show y axis title', false);\\n  const showBrushTool = boolean('Show pointer brush area', true);\\n\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n  };\\n\\n  const heatmap = useMemo(() => {\\n    const styles: RecursivePartial<HeatmapStyle> = {\\n      brushTool: {\\n        visible: showBrushTool,\\n      },\\n      grid: {\\n        stroke: {\\n          width: 0.5,\\n          color: '#bababa',\\n        },\\n      },\\n      cell: {\\n        maxWidth: 'fill',\\n        maxHeight: 3,\\n        label: {\\n          visible: false,\\n        },\\n        border: {\\n          stroke: 'transparent',\\n          strokeWidth: 0,\\n        },\\n      },\\n      yAxisLabel: {\\n        visible: true,\\n        width: 'auto',\\n        padding: { left: 10, right: 10 },\\n      },\\n    };\\n\\n    return styles;\\n  }, [showBrushTool]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={onElementClick}\\n        onPointerUpdate={pointerUpdate}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        xDomain={{ min: 1572825600000, max: 1572912000000 }}\\n        debugState={debugState}\\n        theme={{ heatmap }}\\n        baseTheme={useBaseTheme()}\\n        onBrushEnd={onBrushEnd}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\\n            { start: 3.5, end: 25, color: '#8bc8fb' },\\n            { start: 25, end: 50, color: '#fdec25' },\\n            { start: 50, end: 75, color: '#fba740' },\\n            { start: 75, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={DATA_6.data}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\\n        xAxisLabelFormatter={(value) => {\\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\\n        }}\\n        timeZone={DATA_6.timeZone}\\n        highlightedData={highlightedData}\\n        xAxisTitle={showXAxisTitle ? 'Bottom axis' : undefined}\\n        yAxisTitle={showYAxisTitle ? 'Left axis' : undefined}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":118},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":118}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React, { useMemo } from 'react';\n\nimport {\n  Chart,\n  Heatmap,\n  HeatmapStyle,\n  niceTimeFormatter,\n  PointerEvent,\n  RecursivePartial,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\n\nimport { DATA_6 } from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { useHeatmapSelection } from '../utils/use_heatmap_selection';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const { highlightedData, onElementClick, onBrushEnd } = useHeatmapSelection();\n\n  const debugState = boolean('Enable debug state', true);\n  const showXAxisTitle = boolean('Show x axis title', false);\n  const showYAxisTitle = boolean('Show y axis title', false);\n  const showBrushTool = boolean('Show pointer brush area', true);\n\n  const pointerUpdate = (event: PointerEvent) => {\n    action('onPointerUpdate')(event);\n  };\n\n  const heatmap = useMemo(() => {\n    const styles: RecursivePartial<HeatmapStyle> = {\n      brushTool: {\n        visible: showBrushTool,\n      },\n      grid: {\n        stroke: {\n          width: 0.5,\n          color: '#bababa',\n        },\n      },\n      cell: {\n        maxWidth: 'fill',\n        maxHeight: 3,\n        label: {\n          visible: false,\n        },\n        border: {\n          stroke: 'transparent',\n          strokeWidth: 0,\n        },\n      },\n      yAxisLabel: {\n        visible: true,\n        width: 'auto',\n        padding: { left: 10, right: 10 },\n      },\n    };\n\n    return styles;\n  }, [showBrushTool]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onElementClick={onElementClick}\n        onPointerUpdate={pointerUpdate}\n        onRenderChange={getDebugStateLogger(debugState)}\n        showLegend\n        legendPosition=\"right\"\n        brushAxis=\"both\"\n        xDomain={{ min: 1572825600000, max: 1572912000000 }}\n        debugState={debugState}\n        theme={{ heatmap }}\n        baseTheme={useBaseTheme()}\n        onBrushEnd={onBrushEnd}\n      />\n      <Heatmap\n        id=\"heatmap1\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\n            { start: 3.5, end: 25, color: '#8bc8fb' },\n            { start: 25, end: 50, color: '#fdec25' },\n            { start: 50, end: 75, color: '#fba740' },\n            { start: 75, end: Infinity, color: '#fe5050' },\n          ],\n        }}\n        data={DATA_6.data}\n        xAccessor=\"x\"\n        yAccessor=\"y\"\n        valueAccessor=\"value\"\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\n        ySortPredicate=\"numAsc\"\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\n        xAxisLabelFormatter={(value) => {\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\n        }}\n        timeZone={DATA_6.timeZone}\n        highlightedData={highlightedData}\n        xAxisTitle={showXAxisTitle ? 'Bottom axis' : undefined}\n        yAxisTitle={showYAxisTitle ? 'Left axis' : undefined}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const { highlightedData, onElementClick, onBrushEnd } = useHeatmapSelection();\\n\\n  const debugState = boolean('Enable debug state', true);\\n  const showXAxisTitle = boolean('Show x axis title', false);\\n  const showYAxisTitle = boolean('Show y axis title', false);\\n  const showBrushTool = boolean('Show pointer brush area', true);\\n\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n  };\\n\\n  const heatmap = useMemo(() => {\\n    const styles: RecursivePartial<HeatmapStyle> = {\\n      brushTool: {\\n        visible: showBrushTool,\\n      },\\n      grid: {\\n        stroke: {\\n          width: 0.5,\\n          color: '#bababa',\\n        },\\n      },\\n      cell: {\\n        maxWidth: 'fill',\\n        maxHeight: 3,\\n        label: {\\n          visible: false,\\n        },\\n        border: {\\n          stroke: 'transparent',\\n          strokeWidth: 0,\\n        },\\n      },\\n      yAxisLabel: {\\n        visible: true,\\n        width: 'auto',\\n        padding: { left: 10, right: 10 },\\n      },\\n    };\\n\\n    return styles;\\n  }, [showBrushTool]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={onElementClick}\\n        onPointerUpdate={pointerUpdate}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        xDomain={{ min: 1572825600000, max: 1572912000000 }}\\n        debugState={debugState}\\n        theme={{ heatmap }}\\n        baseTheme={useBaseTheme()}\\n        onBrushEnd={onBrushEnd}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\\n            { start: 3.5, end: 25, color: '#8bc8fb' },\\n            { start: 25, end: 50, color: '#fdec25' },\\n            { start: 50, end: 75, color: '#fba740' },\\n            { start: 75, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={DATA_6.data}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\\n        xAxisLabelFormatter={(value) => {\\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\\n        }}\\n        timeZone={DATA_6.timeZone}\\n        highlightedData={highlightedData}\\n        xAxisTitle={showXAxisTitle ? 'Bottom axis' : undefined}\\n        yAxisTitle={showYAxisTitle ? 'Left axis' : undefined}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Heatmap, Settings } from '@elastic/charts';\\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = boolean('filter dataset', true)\\n    ? BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960)\\n    : BABYNAME_DATA;\\n  const showLabels = boolean('show', true, 'labels');\\n  const useGlobalMinFontSize = boolean('use global min fontSize', true, 'labels');\\n\\n  const minFontSize = number('min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'labels');\\n  const maxFontSize = number('max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'labels');\\n\\n  const showXAxisTitle = boolean('Show x axis title', true);\\n  const showYAxisTitle = boolean('Show y axis title', true);\\n\\n  return (\\n    <Chart title={title} description={description} size={['100%', 320]}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: 0,\\n              },\\n            },\\n            cell: {\\n              maxWidth: 'fill',\\n              label: {\\n                minFontSize,\\n                maxFontSize,\\n                visible: showLabels,\\n                useGlobalMinFontSize,\\n              },\\n              border: {\\n                stroke: 'transparent',\\n                strokeWidth: 1,\\n              },\\n            },\\n            yAxisLabel: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        onBrushEnd={action('onBrushEnd')}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap2\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 1000, color: '#AADC32' },\\n            { start: 1000, end: 5000, color: '#35B779' },\\n            { start: 5000, end: 10000, color: '#24868E' },\\n            { start: 10000, end: 50000, color: '#3B528B' },\\n            { start: 50000, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={(d) => d[2]}\\n        yAccessor={(d) => d[0]}\\n        valueAccessor={(d) => d[3]}\\n        valueFormatter={(value) => value.toFixed(0.2)}\\n        xSortPredicate=\\\"alphaAsc\\\"\\n        xAxisTitle={showXAxisTitle ? 'Popular baby names' : undefined}\\n        yAxisTitle={showYAxisTitle ? 'Years' : undefined}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: true,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":90},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":90}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Heatmap, Settings } from '@elastic/charts';\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = boolean('filter dataset', true)\n    ? BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960)\n    : BABYNAME_DATA;\n  const showLabels = boolean('show', true, 'labels');\n  const useGlobalMinFontSize = boolean('use global min fontSize', true, 'labels');\n\n  const minFontSize = number('min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'labels');\n  const maxFontSize = number('max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'labels');\n\n  const showXAxisTitle = boolean('Show x axis title', true);\n  const showYAxisTitle = boolean('Show y axis title', true);\n\n  return (\n    <Chart title={title} description={description} size={['100%', 320]}>\n      <Settings\n        onElementClick={action('onElementClick')}\n        showLegend\n        legendPosition=\"right\"\n        brushAxis=\"both\"\n        baseTheme={useBaseTheme()}\n        theme={{\n          heatmap: {\n            grid: {\n              stroke: {\n                width: 0,\n              },\n            },\n            cell: {\n              maxWidth: 'fill',\n              label: {\n                minFontSize,\n                maxFontSize,\n                visible: showLabels,\n                useGlobalMinFontSize,\n              },\n              border: {\n                stroke: 'transparent',\n                strokeWidth: 1,\n              },\n            },\n            yAxisLabel: {\n              visible: true,\n            },\n          },\n        }}\n        onBrushEnd={action('onBrushEnd')}\n      />\n      <Heatmap\n        id=\"heatmap2\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 1000, color: '#AADC32' },\n            { start: 1000, end: 5000, color: '#35B779' },\n            { start: 5000, end: 10000, color: '#24868E' },\n            { start: 10000, end: 50000, color: '#3B528B' },\n            { start: 50000, end: Infinity, color: '#471164' },\n          ],\n        }}\n        data={data}\n        xAccessor={(d) => d[2]}\n        yAccessor={(d) => d[0]}\n        valueAccessor={(d) => d[3]}\n        valueFormatter={(value) => value.toFixed(0.2)}\n        xSortPredicate=\"alphaAsc\"\n        xAxisTitle={showXAxisTitle ? 'Popular baby names' : undefined}\n        yAxisTitle={showYAxisTitle ? 'Years' : undefined}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: true,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = boolean('filter dataset', true)\\n    ? BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960)\\n    : BABYNAME_DATA;\\n  const showLabels = boolean('show', true, 'labels');\\n  const useGlobalMinFontSize = boolean('use global min fontSize', true, 'labels');\\n\\n  const minFontSize = number('min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'labels');\\n  const maxFontSize = number('max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'labels');\\n\\n  const showXAxisTitle = boolean('Show x axis title', true);\\n  const showYAxisTitle = boolean('Show y axis title', true);\\n\\n  return (\\n    <Chart title={title} description={description} size={['100%', 320]}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: 0,\\n              },\\n            },\\n            cell: {\\n              maxWidth: 'fill',\\n              label: {\\n                minFontSize,\\n                maxFontSize,\\n                visible: showLabels,\\n                useGlobalMinFontSize,\\n              },\\n              border: {\\n                stroke: 'transparent',\\n                strokeWidth: 1,\\n              },\\n            },\\n            yAxisLabel: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        onBrushEnd={action('onBrushEnd')}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap2\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 1000, color: '#AADC32' },\\n            { start: 1000, end: 5000, color: '#35B779' },\\n            { start: 5000, end: 10000, color: '#24868E' },\\n            { start: 10000, end: 50000, color: '#3B528B' },\\n            { start: 50000, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={(d) => d[2]}\\n        yAccessor={(d) => d[0]}\\n        valueAccessor={(d) => d[3]}\\n        valueFormatter={(value) => value.toFixed(0.2)}\\n        xSortPredicate=\\\"alphaAsc\\\"\\n        xAxisTitle={showXAxisTitle ? 'Popular baby names' : undefined}\\n        yAxisTitle={showYAxisTitle ? 'Years' : undefined}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React, { useMemo } from 'react';\\n\\nimport { Chart, Heatmap, RecursivePartial, ScaleType, Settings, HeatmapStyle } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\nconst start = DateTime.fromISO('2021-03-27T20:00:00', { zone: 'UTC' });\\nconst end = DateTime.fromISO('2021-03-28T11:00:00', { zone: 'UTC' });\\nconst data = [...new Array(14)].flatMap((d, i) => {\\n  return [\\n    [start.plus({ hour: i }).toMillis(), 'cat A', rng(-5, 5)],\\n    [start.plus({ hour: i }).toMillis(), 'cat B', rng(-5, 5)],\\n    [start.plus({ hour: i }).toMillis(), 'cat C', rng(-5, 5)],\\n    [start.plus({ hour: i }).toMillis(), 'cat D', rng(-5, 5)],\\n    [start.plus({ hour: i }).toMillis(), 'cat E', rng(-5, 5)],\\n  ];\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const heatmap = useMemo(() => {\\n    const styles: RecursivePartial<HeatmapStyle> = {\\n      grid: {\\n        stroke: {\\n          width: 0.5,\\n          color: 'transparent',\\n        },\\n      },\\n      cell: {\\n        maxWidth: 'fill',\\n        maxHeight: 3,\\n        label: {\\n          visible: false,\\n        },\\n        border: {\\n          stroke: 'transparent',\\n          strokeWidth: 0,\\n        },\\n      },\\n      yAxisLabel: {\\n        visible: true,\\n        width: 'auto',\\n        padding: { left: 10, right: 10 },\\n      },\\n    };\\n\\n    return styles;\\n  }, []);\\n\\n  const startTimeOffset = number('start time offset', 0, {\\n    min: -1000 * 60 * 60 * 24,\\n    max: 1000 * 60 * 60 * 10,\\n    step: 1000,\\n    range: true,\\n  });\\n  const endTimeOffset = number('end time offset', 0, {\\n    min: -1000 * 60 * 60 * 10,\\n    max: 1000 * 60 * 60 * 24,\\n    step: 1000,\\n    range: true,\\n  });\\n\\n  return (\\n    <>\\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\\n        {DateTime.fromMillis(start.toMillis() + startTimeOffset).toISO()} to{' '}\\n        {DateTime.fromMillis(end.toMillis() + endTimeOffset).toISO()}\\n      </div>\\n      <Chart title={title} description={description} size={['100%', 180]} className=\\\"story-chart\\\">\\n        <Settings\\n          showLegend\\n          xDomain={{\\n            min: start.toMillis() + startTimeOffset,\\n            max: end.toMillis() + endTimeOffset,\\n          }}\\n          theme={{ heatmap }}\\n          baseTheme={useBaseTheme()}\\n        />\\n        <Heatmap\\n          id=\\\"heatmap1\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: [\\n              { color: '#ca0020', start: -5, end: -3 },\\n              { color: '#f4a582', start: -3, end: -1 },\\n              { color: '#cecece', start: -1, end: 1 },\\n              { color: '#92c5de', start: 1, end: 3 },\\n              { color: '#0571b0', start: 3, end: 5 },\\n            ],\\n            labelFormatter: (s, e) => `[${s}, ${e})`,\\n          }}\\n          data={data}\\n          xAccessor={(d) => d[0]}\\n          yAccessor={(d) => d[1]}\\n          valueAccessor={(d) => d[2]}\\n          valueFormatter={(d) => d.toFixed(2)}\\n          ySortPredicate=\\\"numAsc\\\"\\n          xAxisLabelFormatter={(value) => {\\n            return DateTime.fromMillis(value as number)\\n              .setZone('UTC')\\n              .toFormat('HH:mm:ss');\\n          }}\\n          timeZone=\\\"UTC\\\"\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: {\\n              type: 'fixed',\\n              unit: 'h',\\n              value: 1,\\n            },\\n          }}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React, { useMemo } from 'react';\n\nimport { Chart, Heatmap, RecursivePartial, ScaleType, Settings, HeatmapStyle } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\nconst start = DateTime.fromISO('2021-03-27T20:00:00', { zone: 'UTC' });\nconst end = DateTime.fromISO('2021-03-28T11:00:00', { zone: 'UTC' });\nconst data = [...new Array(14)].flatMap((d, i) => {\n  return [\n    [start.plus({ hour: i }).toMillis(), 'cat A', rng(-5, 5)],\n    [start.plus({ hour: i }).toMillis(), 'cat B', rng(-5, 5)],\n    [start.plus({ hour: i }).toMillis(), 'cat C', rng(-5, 5)],\n    [start.plus({ hour: i }).toMillis(), 'cat D', rng(-5, 5)],\n    [start.plus({ hour: i }).toMillis(), 'cat E', rng(-5, 5)],\n  ];\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const heatmap = useMemo(() => {\n    const styles: RecursivePartial<HeatmapStyle> = {\n      grid: {\n        stroke: {\n          width: 0.5,\n          color: 'transparent',\n        },\n      },\n      cell: {\n        maxWidth: 'fill',\n        maxHeight: 3,\n        label: {\n          visible: false,\n        },\n        border: {\n          stroke: 'transparent',\n          strokeWidth: 0,\n        },\n      },\n      yAxisLabel: {\n        visible: true,\n        width: 'auto',\n        padding: { left: 10, right: 10 },\n      },\n    };\n\n    return styles;\n  }, []);\n\n  const startTimeOffset = number('start time offset', 0, {\n    min: -1000 * 60 * 60 * 24,\n    max: 1000 * 60 * 60 * 10,\n    step: 1000,\n    range: true,\n  });\n  const endTimeOffset = number('end time offset', 0, {\n    min: -1000 * 60 * 60 * 10,\n    max: 1000 * 60 * 60 * 24,\n    step: 1000,\n    range: true,\n  });\n\n  return (\n    <>\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\n        {DateTime.fromMillis(start.toMillis() + startTimeOffset).toISO()} to{' '}\n        {DateTime.fromMillis(end.toMillis() + endTimeOffset).toISO()}\n      </div>\n      <Chart title={title} description={description} size={['100%', 180]} className=\"story-chart\">\n        <Settings\n          showLegend\n          xDomain={{\n            min: start.toMillis() + startTimeOffset,\n            max: end.toMillis() + endTimeOffset,\n          }}\n          theme={{ heatmap }}\n          baseTheme={useBaseTheme()}\n        />\n        <Heatmap\n          id=\"heatmap1\"\n          colorScale={{\n            type: 'bands',\n            bands: [\n              { color: '#ca0020', start: -5, end: -3 },\n              { color: '#f4a582', start: -3, end: -1 },\n              { color: '#cecece', start: -1, end: 1 },\n              { color: '#92c5de', start: 1, end: 3 },\n              { color: '#0571b0', start: 3, end: 5 },\n            ],\n            labelFormatter: (s, e) => `[${s}, ${e})`,\n          }}\n          data={data}\n          xAccessor={(d) => d[0]}\n          yAccessor={(d) => d[1]}\n          valueAccessor={(d) => d[2]}\n          valueFormatter={(d) => d.toFixed(2)}\n          ySortPredicate=\"numAsc\"\n          xAxisLabelFormatter={(value) => {\n            return DateTime.fromMillis(value as number)\n              .setZone('UTC')\n              .toFormat('HH:mm:ss');\n          }}\n          timeZone=\"UTC\"\n          xScale={{\n            type: ScaleType.Time,\n            interval: {\n              type: 'fixed',\n              unit: 'h',\n              value: 1,\n            },\n          }}\n        />\n      </Chart>\n    </>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const heatmap = useMemo(() => {\\n    const styles: RecursivePartial<HeatmapStyle> = {\\n      grid: {\\n        stroke: {\\n          width: 0.5,\\n          color: 'transparent',\\n        },\\n      },\\n      cell: {\\n        maxWidth: 'fill',\\n        maxHeight: 3,\\n        label: {\\n          visible: false,\\n        },\\n        border: {\\n          stroke: 'transparent',\\n          strokeWidth: 0,\\n        },\\n      },\\n      yAxisLabel: {\\n        visible: true,\\n        width: 'auto',\\n        padding: { left: 10, right: 10 },\\n      },\\n    };\\n\\n    return styles;\\n  }, []);\\n\\n  const startTimeOffset = number('start time offset', 0, {\\n    min: -1000 * 60 * 60 * 24,\\n    max: 1000 * 60 * 60 * 10,\\n    step: 1000,\\n    range: true,\\n  });\\n  const endTimeOffset = number('end time offset', 0, {\\n    min: -1000 * 60 * 60 * 10,\\n    max: 1000 * 60 * 60 * 24,\\n    step: 1000,\\n    range: true,\\n  });\\n\\n  return (\\n    <>\\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\\n        {DateTime.fromMillis(start.toMillis() + startTimeOffset).toISO()} to{' '}\\n        {DateTime.fromMillis(end.toMillis() + endTimeOffset).toISO()}\\n      </div>\\n      <Chart title={title} description={description} size={['100%', 180]} className=\\\"story-chart\\\">\\n        <Settings\\n          showLegend\\n          xDomain={{\\n            min: start.toMillis() + startTimeOffset,\\n            max: end.toMillis() + endTimeOffset,\\n          }}\\n          theme={{ heatmap }}\\n          baseTheme={useBaseTheme()}\\n        />\\n        <Heatmap\\n          id=\\\"heatmap1\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: [\\n              { color: '#ca0020', start: -5, end: -3 },\\n              { color: '#f4a582', start: -3, end: -1 },\\n              { color: '#cecece', start: -1, end: 1 },\\n              { color: '#92c5de', start: 1, end: 3 },\\n              { color: '#0571b0', start: 3, end: 5 },\\n            ],\\n            labelFormatter: (s, e) => `[${s}, ${e})`,\\n          }}\\n          data={data}\\n          xAccessor={(d) => d[0]}\\n          yAccessor={(d) => d[1]}\\n          valueAccessor={(d) => d[2]}\\n          valueFormatter={(d) => d.toFixed(2)}\\n          ySortPredicate=\\\"numAsc\\\"\\n          xAxisLabelFormatter={(value) => {\\n            return DateTime.fromMillis(value as number)\\n              .setZone('UTC')\\n              .toFormat('HH:mm:ss');\\n          }}\\n          timeZone=\\\"UTC\\\"\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: {\\n              type: 'fixed',\\n              unit: 'h',\\n              value: 1,\\n            },\\n          }}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport { extent } from 'd3-array';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Chart, Heatmap, PartialTheme, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ColorBand } from '../../../packages/charts/src/chart_types/heatmap/specs/heatmap';\\nimport {\\n  DATA_1,\\n  DATA_2,\\n  DATA_3,\\n  DATA_4,\\n  DATA_5,\\n  DATA_6,\\n  DATA_7,\\n  DATA_8,\\n  DATA_9,\\n} from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst datasets = [DATA_1, DATA_2, DATA_3, DATA_4, DATA_5, DATA_6, DATA_7, DATA_8, DATA_9];\\n\\nconst theme: PartialTheme = {\\n  heatmap: {\\n    grid: {\\n      stroke: {\\n        width: 1,\\n        color: 'black',\\n      },\\n    },\\n    cell: {\\n      maxWidth: 'fill',\\n      maxHeight: 3,\\n      label: {\\n        visible: true,\\n      },\\n      border: {\\n        stroke: 'transparent',\\n        strokeWidth: 0,\\n      },\\n    },\\n    yAxisLabel: {\\n      visible: true,\\n      width: 'auto',\\n      padding: { left: 10, right: 10 },\\n    },\\n    xAxisLabel: {\\n      padding: { top: 4, bottom: 4 },\\n    },\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const datasetIndex = select('dataset', [1, 2, 3, 4, 5, 6, 7, 8, 9], 1) - 1;\\n  const dataset = datasets[datasetIndex];\\n  const [min = 0, max = 0] = extent(dataset.data, (d) => d.value);\\n  const colors = ['#ca0020', '#f4a582', '#cecece', '#92c5de', '#0571b0'];\\n  const numOfColors = colors.length;\\n  const interval = (max - min) / numOfColors;\\n\\n  const colorBands = Array.from<unknown, ColorBand>({ length: numOfColors }, (d, i) => ({\\n    color: colors[i],\\n    start: Math.floor(min + i * interval),\\n    end: i === numOfColors - 1 ? Infinity : Math.ceil(min + (i + 1) * interval),\\n  }));\\n  const [tMin = 0, tMax = 0] = extent(dataset.data, (d) => d.x);\\n  return (\\n    <>\\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\\n        {DateTime.fromMillis(tMin).toISO()} to {DateTime.fromMillis(tMax).toISO()}{' '}\\n        {`${dataset.interval.type}: ${dataset.interval.value}${dataset.interval.unit} points:${dataset.data.length}`}\\n      </div>\\n      <Chart title={title} description={description} className=\\\"story-chart\\\">\\n        <Settings theme={theme} baseTheme={useBaseTheme()} xDomain={dataset.domain} />\\n        <Heatmap\\n          id=\\\"heatmap1\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: colorBands,\\n            labelFormatter: (s, e) => `[${s}, ${e})`,\\n          }}\\n          data={dataset.data}\\n          xAccessor=\\\"x\\\"\\n          yAccessor=\\\"y\\\"\\n          valueAccessor=\\\"value\\\"\\n          ySortPredicate=\\\"numAsc\\\"\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: dataset.interval,\\n          }}\\n          timeZone={dataset.timeZone ?? 'Europe/Rome'}\\n          xAxisLabelFormatter={dataset.xFormatter}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":63},\"endLoc\":{\"col\":1,\"line\":107},\"startBody\":{\"col\":36,\"line\":63},\"endBody\":{\"col\":1,\"line\":107}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport { extent } from 'd3-array';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Chart, Heatmap, PartialTheme, ScaleType, Settings } from '@elastic/charts';\n\nimport { ColorBand } from '../../../packages/charts/src/chart_types/heatmap/specs/heatmap';\nimport {\n  DATA_1,\n  DATA_2,\n  DATA_3,\n  DATA_4,\n  DATA_5,\n  DATA_6,\n  DATA_7,\n  DATA_8,\n  DATA_9,\n} from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst datasets = [DATA_1, DATA_2, DATA_3, DATA_4, DATA_5, DATA_6, DATA_7, DATA_8, DATA_9];\n\nconst theme: PartialTheme = {\n  heatmap: {\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'black',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 3,\n      label: {\n        visible: true,\n      },\n      border: {\n        stroke: 'transparent',\n        strokeWidth: 0,\n      },\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      padding: { left: 10, right: 10 },\n    },\n    xAxisLabel: {\n      padding: { top: 4, bottom: 4 },\n    },\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const datasetIndex = select('dataset', [1, 2, 3, 4, 5, 6, 7, 8, 9], 1) - 1;\n  const dataset = datasets[datasetIndex];\n  const [min = 0, max = 0] = extent(dataset.data, (d) => d.value);\n  const colors = ['#ca0020', '#f4a582', '#cecece', '#92c5de', '#0571b0'];\n  const numOfColors = colors.length;\n  const interval = (max - min) / numOfColors;\n\n  const colorBands = Array.from<unknown, ColorBand>({ length: numOfColors }, (d, i) => ({\n    color: colors[i],\n    start: Math.floor(min + i * interval),\n    end: i === numOfColors - 1 ? Infinity : Math.ceil(min + (i + 1) * interval),\n  }));\n  const [tMin = 0, tMax = 0] = extent(dataset.data, (d) => d.x);\n  return (\n    <>\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\n        {DateTime.fromMillis(tMin).toISO()} to {DateTime.fromMillis(tMax).toISO()}{' '}\n        {`${dataset.interval.type}: ${dataset.interval.value}${dataset.interval.unit} points:${dataset.data.length}`}\n      </div>\n      <Chart title={title} description={description} className=\"story-chart\">\n        <Settings theme={theme} baseTheme={useBaseTheme()} xDomain={dataset.domain} />\n        <Heatmap\n          id=\"heatmap1\"\n          colorScale={{\n            type: 'bands',\n            bands: colorBands,\n            labelFormatter: (s, e) => `[${s}, ${e})`,\n          }}\n          data={dataset.data}\n          xAccessor=\"x\"\n          yAccessor=\"y\"\n          valueAccessor=\"value\"\n          ySortPredicate=\"numAsc\"\n          xScale={{\n            type: ScaleType.Time,\n            interval: dataset.interval,\n          }}\n          timeZone={dataset.timeZone ?? 'Europe/Rome'}\n          xAxisLabelFormatter={dataset.xFormatter}\n        />\n      </Chart>\n    </>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const datasetIndex = select('dataset', [1, 2, 3, 4, 5, 6, 7, 8, 9], 1) - 1;\\n  const dataset = datasets[datasetIndex];\\n  const [min = 0, max = 0] = extent(dataset.data, (d) => d.value);\\n  const colors = ['#ca0020', '#f4a582', '#cecece', '#92c5de', '#0571b0'];\\n  const numOfColors = colors.length;\\n  const interval = (max - min) / numOfColors;\\n\\n  const colorBands = Array.from<unknown, ColorBand>({ length: numOfColors }, (d, i) => ({\\n    color: colors[i],\\n    start: Math.floor(min + i * interval),\\n    end: i === numOfColors - 1 ? Infinity : Math.ceil(min + (i + 1) * interval),\\n  }));\\n  const [tMin = 0, tMax = 0] = extent(dataset.data, (d) => d.x);\\n  return (\\n    <>\\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\\n        {DateTime.fromMillis(tMin).toISO()} to {DateTime.fromMillis(tMax).toISO()}{' '}\\n        {`${dataset.interval.type}: ${dataset.interval.value}${dataset.interval.unit} points:${dataset.data.length}`}\\n      </div>\\n      <Chart title={title} description={description} className=\\\"story-chart\\\">\\n        <Settings theme={theme} baseTheme={useBaseTheme()} xDomain={dataset.domain} />\\n        <Heatmap\\n          id=\\\"heatmap1\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: colorBands,\\n            labelFormatter: (s, e) => `[${s}, ${e})`,\\n          }}\\n          data={dataset.data}\\n          xAccessor=\\\"x\\\"\\n          yAccessor=\\\"y\\\"\\n          valueAccessor=\\\"value\\\"\\n          ySortPredicate=\\\"numAsc\\\"\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: dataset.interval,\\n          }}\\n          timeZone={dataset.timeZone ?? 'Europe/Rome'}\\n          xAxisLabelFormatter={dataset.xFormatter}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, select, color, number, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Heatmap,\\n  HeatmapStyle,\\n  niceTimeFormatter,\\n  RecursivePartial,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { DATA_6 } from '@elastic/charts/src/utils/data_samples/test_dataset_heatmap';\\n\\nimport { AxisStyle } from '../../../packages/charts/src/utils/themes/theme';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debugState = boolean('Enable debug state', true);\\n  const axes: RecursivePartial<AxisStyle> = {\\n    axisTitle: {\\n      fontSize: number('axisTitle fontSize', 12, { range: true, min: 5, max: 20 }, 'Axis Title'),\\n      fontFamily: 'sans-serif',\\n      fill: color('axisTitle textColor', 'black', 'Axis Title'),\\n      padding: {\\n        inner: number('axisTitle inner pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\\n        outer: number('axisTitle outer pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\\n      },\\n    },\\n  };\\n\\n  const yAxisLabelWidthType = select('yAxisLabel width type', ['auto', 'static', 'max'], 'auto', 'Theme');\\n  const yAxisLabelWidthSize = number('yAxisLabel width max/static', 100, { min: 0, max: 200, step: 1 }, 'Theme');\\n\\n  const heatmap: RecursivePartial<HeatmapStyle> = {\\n    brushArea: {\\n      visible: boolean('brushArea visible', true, 'Theme'),\\n      fill: color('brushArea fill', 'black', 'Theme'),\\n      stroke: color('brushArea stroke', '#69707D', 'Theme'),\\n      strokeWidth: number('brushArea strokeWidth', 2, { range: true, min: 1, max: 10 }, 'Theme'),\\n    },\\n    brushMask: {\\n      visible: boolean('brushMask visible', true, 'Theme'),\\n      fill: color('brushMask fill', 'rgb(115 115 115 / 50%)', 'Theme'),\\n    },\\n    brushTool: {\\n      visible: boolean('brushTool visible', false, 'Theme'),\\n      fill: color('brushTool fill color', 'gray', 'Theme'),\\n    },\\n    xAxisLabel: {\\n      visible: boolean('xAxisLabel visible', true, 'Theme'),\\n      fontSize: number('xAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\\n      textColor: color('xAxisLabel textColor', 'black', 'Theme'),\\n      padding: number('xAxisLabel padding', 6, { range: true, min: 0, max: 15 }, 'Theme'),\\n    },\\n    yAxisLabel: {\\n      visible: boolean('yAxisLabel visible', true, 'Theme'),\\n      fontSize: number('yAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\\n      textColor: color('yAxisLabel textColor', 'black', 'Theme'),\\n      padding: number('yAxisLabel padding', 5, { range: true, min: 0, max: 15 }, 'Theme'),\\n      width:\\n        yAxisLabelWidthType === 'static'\\n          ? yAxisLabelWidthSize\\n          : yAxisLabelWidthType === 'max'\\n            ? { max: yAxisLabelWidthSize }\\n            : 'auto',\\n    },\\n    grid: {\\n      stroke: {\\n        color: color('grid stroke color', 'gray', 'Theme'),\\n        width: number('grid stroke width', 1, { range: true, min: 0, max: 10, step: 1 }, 'Theme'),\\n      },\\n    },\\n    cell: {\\n      label: {\\n        visible: boolean('cell label visible', false, 'Theme'),\\n        textColor: color('cell label textColor', 'black', 'Theme'),\\n        useGlobalMinFontSize: boolean('cell label use global min fontSize', true, 'Theme'),\\n        minFontSize: number('cell label min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'Theme'),\\n        maxFontSize: number('cell label max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'Theme'),\\n      },\\n      border: {\\n        strokeWidth: number('border strokeWidth', 0, { range: true, min: 0, max: 5 }, 'Theme'),\\n        stroke: color('border stroke color', 'gray', 'Theme'),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        onBrushEnd={action('onBrushEnd')}\\n        brushAxis=\\\"both\\\"\\n        xDomain={{ min: 1572868800000, max: 1572912000000, minInterval: 1800000 }}\\n        debugState={debugState}\\n        theme={{ axes, heatmap }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\\n            { start: 3.5, end: 25, color: '#8bc8fb' },\\n            { start: 25, end: 50, color: '#fdec25' },\\n            { start: 50, end: 75, color: '#fba740' },\\n            { start: 75, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={DATA_6.data}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\\n        xAxisLabelFormatter={(value) => {\\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\\n        }}\\n        xAxisTitle={text('xAxisTitle', 'xAxis', 'Axis Title')}\\n        yAxisTitle={text('yAxisTitle', 'yAxis', 'Axis Title')}\\n        timeZone={DATA_6.timeZone}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `\\n> __Warning:__ ⚠️ default \\\\`Theme\\\\` styles are overrided by knob controls. Toggling between themes may show incorrect styles.\\n  `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":141},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":141}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, select, color, number, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Heatmap,\n  HeatmapStyle,\n  niceTimeFormatter,\n  RecursivePartial,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { DATA_6 } from '@elastic/charts/src/utils/data_samples/test_dataset_heatmap';\n\nimport { AxisStyle } from '../../../packages/charts/src/utils/themes/theme';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debugState = boolean('Enable debug state', true);\n  const axes: RecursivePartial<AxisStyle> = {\n    axisTitle: {\n      fontSize: number('axisTitle fontSize', 12, { range: true, min: 5, max: 20 }, 'Axis Title'),\n      fontFamily: 'sans-serif',\n      fill: color('axisTitle textColor', 'black', 'Axis Title'),\n      padding: {\n        inner: number('axisTitle inner pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\n        outer: number('axisTitle outer pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\n      },\n    },\n  };\n\n  const yAxisLabelWidthType = select('yAxisLabel width type', ['auto', 'static', 'max'], 'auto', 'Theme');\n  const yAxisLabelWidthSize = number('yAxisLabel width max/static', 100, { min: 0, max: 200, step: 1 }, 'Theme');\n\n  const heatmap: RecursivePartial<HeatmapStyle> = {\n    brushArea: {\n      visible: boolean('brushArea visible', true, 'Theme'),\n      fill: color('brushArea fill', 'black', 'Theme'),\n      stroke: color('brushArea stroke', '#69707D', 'Theme'),\n      strokeWidth: number('brushArea strokeWidth', 2, { range: true, min: 1, max: 10 }, 'Theme'),\n    },\n    brushMask: {\n      visible: boolean('brushMask visible', true, 'Theme'),\n      fill: color('brushMask fill', 'rgb(115 115 115 / 50%)', 'Theme'),\n    },\n    brushTool: {\n      visible: boolean('brushTool visible', false, 'Theme'),\n      fill: color('brushTool fill color', 'gray', 'Theme'),\n    },\n    xAxisLabel: {\n      visible: boolean('xAxisLabel visible', true, 'Theme'),\n      fontSize: number('xAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\n      textColor: color('xAxisLabel textColor', 'black', 'Theme'),\n      padding: number('xAxisLabel padding', 6, { range: true, min: 0, max: 15 }, 'Theme'),\n    },\n    yAxisLabel: {\n      visible: boolean('yAxisLabel visible', true, 'Theme'),\n      fontSize: number('yAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\n      textColor: color('yAxisLabel textColor', 'black', 'Theme'),\n      padding: number('yAxisLabel padding', 5, { range: true, min: 0, max: 15 }, 'Theme'),\n      width:\n        yAxisLabelWidthType === 'static'\n          ? yAxisLabelWidthSize\n          : yAxisLabelWidthType === 'max'\n            ? { max: yAxisLabelWidthSize }\n            : 'auto',\n    },\n    grid: {\n      stroke: {\n        color: color('grid stroke color', 'gray', 'Theme'),\n        width: number('grid stroke width', 1, { range: true, min: 0, max: 10, step: 1 }, 'Theme'),\n      },\n    },\n    cell: {\n      label: {\n        visible: boolean('cell label visible', false, 'Theme'),\n        textColor: color('cell label textColor', 'black', 'Theme'),\n        useGlobalMinFontSize: boolean('cell label use global min fontSize', true, 'Theme'),\n        minFontSize: number('cell label min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'Theme'),\n        maxFontSize: number('cell label max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'Theme'),\n      },\n      border: {\n        strokeWidth: number('border strokeWidth', 0, { range: true, min: 0, max: 5 }, 'Theme'),\n        stroke: color('border stroke color', 'gray', 'Theme'),\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onRenderChange={getDebugStateLogger(debugState)}\n        showLegend\n        legendPosition=\"right\"\n        onBrushEnd={action('onBrushEnd')}\n        brushAxis=\"both\"\n        xDomain={{ min: 1572868800000, max: 1572912000000, minInterval: 1800000 }}\n        debugState={debugState}\n        theme={{ axes, heatmap }}\n        baseTheme={useBaseTheme()}\n      />\n      <Heatmap\n        id=\"heatmap1\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\n            { start: 3.5, end: 25, color: '#8bc8fb' },\n            { start: 25, end: 50, color: '#fdec25' },\n            { start: 50, end: 75, color: '#fba740' },\n            { start: 75, end: Infinity, color: '#fe5050' },\n          ],\n        }}\n        data={DATA_6.data}\n        xAccessor=\"x\"\n        yAccessor=\"y\"\n        valueAccessor=\"value\"\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\n        ySortPredicate=\"numAsc\"\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\n        xAxisLabelFormatter={(value) => {\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\n        }}\n        xAxisTitle={text('xAxisTitle', 'xAxis', 'Axis Title')}\n        yAxisTitle={text('yAxisTitle', 'yAxis', 'Axis Title')}\n        timeZone={DATA_6.timeZone}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `\n> __Warning:__ ⚠️ default \\`Theme\\` styles are overrided by knob controls. Toggling between themes may show incorrect styles.\n  `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debugState = boolean('Enable debug state', true);\\n  const axes: RecursivePartial<AxisStyle> = {\\n    axisTitle: {\\n      fontSize: number('axisTitle fontSize', 12, { range: true, min: 5, max: 20 }, 'Axis Title'),\\n      fontFamily: 'sans-serif',\\n      fill: color('axisTitle textColor', 'black', 'Axis Title'),\\n      padding: {\\n        inner: number('axisTitle inner pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\\n        outer: number('axisTitle outer pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\\n      },\\n    },\\n  };\\n\\n  const yAxisLabelWidthType = select('yAxisLabel width type', ['auto', 'static', 'max'], 'auto', 'Theme');\\n  const yAxisLabelWidthSize = number('yAxisLabel width max/static', 100, { min: 0, max: 200, step: 1 }, 'Theme');\\n\\n  const heatmap: RecursivePartial<HeatmapStyle> = {\\n    brushArea: {\\n      visible: boolean('brushArea visible', true, 'Theme'),\\n      fill: color('brushArea fill', 'black', 'Theme'),\\n      stroke: color('brushArea stroke', '#69707D', 'Theme'),\\n      strokeWidth: number('brushArea strokeWidth', 2, { range: true, min: 1, max: 10 }, 'Theme'),\\n    },\\n    brushMask: {\\n      visible: boolean('brushMask visible', true, 'Theme'),\\n      fill: color('brushMask fill', 'rgb(115 115 115 / 50%)', 'Theme'),\\n    },\\n    brushTool: {\\n      visible: boolean('brushTool visible', false, 'Theme'),\\n      fill: color('brushTool fill color', 'gray', 'Theme'),\\n    },\\n    xAxisLabel: {\\n      visible: boolean('xAxisLabel visible', true, 'Theme'),\\n      fontSize: number('xAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\\n      textColor: color('xAxisLabel textColor', 'black', 'Theme'),\\n      padding: number('xAxisLabel padding', 6, { range: true, min: 0, max: 15 }, 'Theme'),\\n    },\\n    yAxisLabel: {\\n      visible: boolean('yAxisLabel visible', true, 'Theme'),\\n      fontSize: number('yAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\\n      textColor: color('yAxisLabel textColor', 'black', 'Theme'),\\n      padding: number('yAxisLabel padding', 5, { range: true, min: 0, max: 15 }, 'Theme'),\\n      width:\\n        yAxisLabelWidthType === 'static'\\n          ? yAxisLabelWidthSize\\n          : yAxisLabelWidthType === 'max'\\n            ? { max: yAxisLabelWidthSize }\\n            : 'auto',\\n    },\\n    grid: {\\n      stroke: {\\n        color: color('grid stroke color', 'gray', 'Theme'),\\n        width: number('grid stroke width', 1, { range: true, min: 0, max: 10, step: 1 }, 'Theme'),\\n      },\\n    },\\n    cell: {\\n      label: {\\n        visible: boolean('cell label visible', false, 'Theme'),\\n        textColor: color('cell label textColor', 'black', 'Theme'),\\n        useGlobalMinFontSize: boolean('cell label use global min fontSize', true, 'Theme'),\\n        minFontSize: number('cell label min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'Theme'),\\n        maxFontSize: number('cell label max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'Theme'),\\n      },\\n      border: {\\n        strokeWidth: number('border strokeWidth', 0, { range: true, min: 0, max: 5 }, 'Theme'),\\n        stroke: color('border stroke color', 'gray', 'Theme'),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        onBrushEnd={action('onBrushEnd')}\\n        brushAxis=\\\"both\\\"\\n        xDomain={{ min: 1572868800000, max: 1572912000000, minInterval: 1800000 }}\\n        debugState={debugState}\\n        theme={{ axes, heatmap }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\\n            { start: 3.5, end: 25, color: '#8bc8fb' },\\n            { start: 25, end: 50, color: '#fdec25' },\\n            { start: 50, end: 75, color: '#fba740' },\\n            { start: 75, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={DATA_6.data}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\\n        xAxisLabelFormatter={(value) => {\\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\\n        }}\\n        xAxisTitle={text('xAxisTitle', 'xAxis', 'Axis Title')}\\n        yAxisTitle={text('yAxisTitle', 'yAxis', 'Axis Title')}\\n        timeZone={DATA_6.timeZone}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Heatmap, HeatmapStyle, RecursivePartial, Settings } from '@elastic/charts';\\n\\nimport { ScaleType } from '../../../packages/charts/src/scales/constants';\\nimport { DATA_1, ECOMMERCE_DATA } from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const yAxisAutoWidth = boolean('Y-axis auto width', true);\\n  const yAxisWidth = number('Y-axis width', 50, { range: true, min: 0, max: 100 });\\n  const heatmap: RecursivePartial<HeatmapStyle> = {\\n    xAxisLabel: {\\n      visible: boolean('X-Axis visible', true),\\n      fontSize: number('X-Axis label fontSize', 12, { range: true, min: 5, max: 20 }),\\n      padding: number('X-Axis label padding', 6, { range: true, min: 0, max: 15 }),\\n      rotation: number('X-Axis label rotation', 0, { step: 1, min: 0, max: 90, range: true }),\\n    },\\n    yAxisLabel: {\\n      width: yAxisAutoWidth ? 'auto' : yAxisWidth,\\n    },\\n  };\\n  const useCategoricalDataset = boolean('Use categorical data', false);\\n  const dataset = useCategoricalDataset ? ECOMMERCE_DATA : DATA_1.data;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        showLegend={boolean('Show legend', false)}\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        theme={{ heatmap }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Heatmap<{ x: number | string; y: string; value: number }>\\n        id=\\\"heatmap2\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 100, color: '#AADC32' },\\n            { start: 100, end: 200, color: '#35B779' },\\n            { start: 200, end: 300, color: '#24868E' },\\n            { start: 300, end: 400, color: '#3B528B' },\\n            { start: 400, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        xScale={\\n          useCategoricalDataset\\n            ? {\\n                type: ScaleType.Ordinal,\\n              }\\n            : {\\n                type: ScaleType.Time,\\n                interval: DATA_1.interval,\\n              }\\n        }\\n        data={dataset}\\n        timeZone={DATA_1.timeZone}\\n        xAxisLabelFormatter={useCategoricalDataset ? (d) => `${d}` : DATA_1.xFormatter}\\n        xAccessor={(d) => d.x}\\n        yAccessor={(d) => d.y}\\n        valueAccessor={(d) => d.value}\\n        valueFormatter={(value) => (Number.isFinite(value) ? value.toFixed(0.2) : '')}\\n        xSortPredicate=\\\"dataIndex\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":79},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":79}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Heatmap, HeatmapStyle, RecursivePartial, Settings } from '@elastic/charts';\n\nimport { ScaleType } from '../../../packages/charts/src/scales/constants';\nimport { DATA_1, ECOMMERCE_DATA } from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const yAxisAutoWidth = boolean('Y-axis auto width', true);\n  const yAxisWidth = number('Y-axis width', 50, { range: true, min: 0, max: 100 });\n  const heatmap: RecursivePartial<HeatmapStyle> = {\n    xAxisLabel: {\n      visible: boolean('X-Axis visible', true),\n      fontSize: number('X-Axis label fontSize', 12, { range: true, min: 5, max: 20 }),\n      padding: number('X-Axis label padding', 6, { range: true, min: 0, max: 15 }),\n      rotation: number('X-Axis label rotation', 0, { step: 1, min: 0, max: 90, range: true }),\n    },\n    yAxisLabel: {\n      width: yAxisAutoWidth ? 'auto' : yAxisWidth,\n    },\n  };\n  const useCategoricalDataset = boolean('Use categorical data', false);\n  const dataset = useCategoricalDataset ? ECOMMERCE_DATA : DATA_1.data;\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onElementClick={action('onElementClick')}\n        showLegend={boolean('Show legend', false)}\n        legendPosition=\"right\"\n        brushAxis=\"both\"\n        theme={{ heatmap }}\n        baseTheme={useBaseTheme()}\n      />\n      <Heatmap<{ x: number | string; y: string; value: number }>\n        id=\"heatmap2\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 100, color: '#AADC32' },\n            { start: 100, end: 200, color: '#35B779' },\n            { start: 200, end: 300, color: '#24868E' },\n            { start: 300, end: 400, color: '#3B528B' },\n            { start: 400, end: Infinity, color: '#471164' },\n          ],\n        }}\n        xScale={\n          useCategoricalDataset\n            ? {\n                type: ScaleType.Ordinal,\n              }\n            : {\n                type: ScaleType.Time,\n                interval: DATA_1.interval,\n              }\n        }\n        data={dataset}\n        timeZone={DATA_1.timeZone}\n        xAxisLabelFormatter={useCategoricalDataset ? (d) => `${d}` : DATA_1.xFormatter}\n        xAccessor={(d) => d.x}\n        yAccessor={(d) => d.y}\n        valueAccessor={(d) => d.value}\n        valueFormatter={(value) => (Number.isFinite(value) ? value.toFixed(0.2) : '')}\n        xSortPredicate=\"dataIndex\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const yAxisAutoWidth = boolean('Y-axis auto width', true);\\n  const yAxisWidth = number('Y-axis width', 50, { range: true, min: 0, max: 100 });\\n  const heatmap: RecursivePartial<HeatmapStyle> = {\\n    xAxisLabel: {\\n      visible: boolean('X-Axis visible', true),\\n      fontSize: number('X-Axis label fontSize', 12, { range: true, min: 5, max: 20 }),\\n      padding: number('X-Axis label padding', 6, { range: true, min: 0, max: 15 }),\\n      rotation: number('X-Axis label rotation', 0, { step: 1, min: 0, max: 90, range: true }),\\n    },\\n    yAxisLabel: {\\n      width: yAxisAutoWidth ? 'auto' : yAxisWidth,\\n    },\\n  };\\n  const useCategoricalDataset = boolean('Use categorical data', false);\\n  const dataset = useCategoricalDataset ? ECOMMERCE_DATA : DATA_1.data;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        showLegend={boolean('Show legend', false)}\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        theme={{ heatmap }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Heatmap<{ x: number | string; y: string; value: number }>\\n        id=\\\"heatmap2\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 100, color: '#AADC32' },\\n            { start: 100, end: 200, color: '#35B779' },\\n            { start: 200, end: 300, color: '#24868E' },\\n            { start: 300, end: 400, color: '#3B528B' },\\n            { start: 400, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        xScale={\\n          useCategoricalDataset\\n            ? {\\n                type: ScaleType.Ordinal,\\n              }\\n            : {\\n                type: ScaleType.Time,\\n                interval: DATA_1.interval,\\n              }\\n        }\\n        data={dataset}\\n        timeZone={DATA_1.timeZone}\\n        xAxisLabelFormatter={useCategoricalDataset ? (d) => `${d}` : DATA_1.xFormatter}\\n        xAccessor={(d) => d.x}\\n        yAccessor={(d) => d.y}\\n        valueAccessor={(d) => d.value}\\n        valueFormatter={(value) => (Number.isFinite(value) ? value.toFixed(0.2) : '')}\\n        xSortPredicate=\\\"dataIndex\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Heatmap, Predicate, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const keepNull = boolean('Fill gaps with nulls', true);\\n  const onlyNulls = boolean('Fill everything with nulls', false);\\n  const xSort = customKnobs.fromEnum('X sorting predicate', Predicate, Predicate.DataIndex);\\n  const ySort = customKnobs.fromEnum('Y sorting predicate', Predicate, Predicate.DataIndex);\\n  return (\\n    <Chart title={title} description={description} size={[200, 200]}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        onPointerUpdate={action('onPointerUpdate')}\\n        pointerUpdateTrigger=\\\"both\\\"\\n        theme={{\\n          heatmap: {\\n            cell: {\\n              border: {\\n                strokeWidth: 0.001,\\n                stroke: 'transparent',\\n              },\\n            },\\n          },\\n        }}\\n      />\\n      <Heatmap\\n        id=\\\"sortedHeatmap\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: 0, end: 10, color: '#d2e9f7' },\\n            { start: 10, end: 20, color: '#8bc8fb' },\\n            { start: 20, end: 30, color: '#fdec25' },\\n            { start: 30, end: 40, color: '#fba740' },\\n            { start: 40, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={[\\n          { x: 'A', y: '1', value: null },\\n          { x: 'A', y: '2', value: 15 },\\n          { x: 'A', y: '3', value: 22 },\\n          { x: 'B', y: '1', value: null },\\n          { x: 'B', y: '2', value: null },\\n          { x: 'B', y: '3', value: 32 },\\n          { x: 'C', y: '1', value: 23 },\\n          { x: 'C', y: '2', value: 35 },\\n          { x: 'C', y: '3', value: 50 },\\n        ]\\n          .filter((d) => (keepNull ? true : d.value !== null))\\n          .map((d) => (onlyNulls ? { ...d, value: null } : d))}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\\n        ySortPredicate={ySort}\\n        xSortPredicate={xSort}\\n        xScale={{ type: ScaleType.Ordinal }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":76},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":76}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Heatmap, Predicate, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const keepNull = boolean('Fill gaps with nulls', true);\n  const onlyNulls = boolean('Fill everything with nulls', false);\n  const xSort = customKnobs.fromEnum('X sorting predicate', Predicate, Predicate.DataIndex);\n  const ySort = customKnobs.fromEnum('Y sorting predicate', Predicate, Predicate.DataIndex);\n  return (\n    <Chart title={title} description={description} size={[200, 200]}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        onPointerUpdate={action('onPointerUpdate')}\n        pointerUpdateTrigger=\"both\"\n        theme={{\n          heatmap: {\n            cell: {\n              border: {\n                strokeWidth: 0.001,\n                stroke: 'transparent',\n              },\n            },\n          },\n        }}\n      />\n      <Heatmap\n        id=\"sortedHeatmap\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: 0, end: 10, color: '#d2e9f7' },\n            { start: 10, end: 20, color: '#8bc8fb' },\n            { start: 20, end: 30, color: '#fdec25' },\n            { start: 30, end: 40, color: '#fba740' },\n            { start: 40, end: Infinity, color: '#fe5050' },\n          ],\n        }}\n        data={[\n          { x: 'A', y: '1', value: null },\n          { x: 'A', y: '2', value: 15 },\n          { x: 'A', y: '3', value: 22 },\n          { x: 'B', y: '1', value: null },\n          { x: 'B', y: '2', value: null },\n          { x: 'B', y: '3', value: 32 },\n          { x: 'C', y: '1', value: 23 },\n          { x: 'C', y: '2', value: 35 },\n          { x: 'C', y: '3', value: 50 },\n        ]\n          .filter((d) => (keepNull ? true : d.value !== null))\n          .map((d) => (onlyNulls ? { ...d, value: null } : d))}\n        xAccessor=\"x\"\n        yAccessor=\"y\"\n        valueAccessor=\"value\"\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\n        ySortPredicate={ySort}\n        xSortPredicate={xSort}\n        xScale={{ type: ScaleType.Ordinal }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const keepNull = boolean('Fill gaps with nulls', true);\\n  const onlyNulls = boolean('Fill everything with nulls', false);\\n  const xSort = customKnobs.fromEnum('X sorting predicate', Predicate, Predicate.DataIndex);\\n  const ySort = customKnobs.fromEnum('Y sorting predicate', Predicate, Predicate.DataIndex);\\n  return (\\n    <Chart title={title} description={description} size={[200, 200]}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        onPointerUpdate={action('onPointerUpdate')}\\n        pointerUpdateTrigger=\\\"both\\\"\\n        theme={{\\n          heatmap: {\\n            cell: {\\n              border: {\\n                strokeWidth: 0.001,\\n                stroke: 'transparent',\\n              },\\n            },\\n          },\\n        }}\\n      />\\n      <Heatmap\\n        id=\\\"sortedHeatmap\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: 0, end: 10, color: '#d2e9f7' },\\n            { start: 10, end: 20, color: '#8bc8fb' },\\n            { start: 20, end: 30, color: '#fdec25' },\\n            { start: 30, end: 40, color: '#fba740' },\\n            { start: 40, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={[\\n          { x: 'A', y: '1', value: null },\\n          { x: 'A', y: '2', value: 15 },\\n          { x: 'A', y: '3', value: 22 },\\n          { x: 'B', y: '1', value: null },\\n          { x: 'B', y: '2', value: null },\\n          { x: 'B', y: '3', value: 32 },\\n          { x: 'C', y: '1', value: 23 },\\n          { x: 'C', y: '2', value: 35 },\\n          { x: 'C', y: '3', value: 50 },\\n        ]\\n          .filter((d) => (keepNull ? true : d.value !== null))\\n          .map((d) => (onlyNulls ? { ...d, value: null } : d))}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\\n        ySortPredicate={ySort}\\n        xSortPredicate={xSort}\\n        xScale={{ type: ScaleType.Ordinal }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Heatmap (@alpha)',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as time } from './3_time.story';\nexport { Example as categorical } from './2_categorical.story';\nexport { Example as timeSnap } from './4_test_time_snap.story';\nexport { Example as theming } from './5_theming.story';\nexport { Example as labelRotation } from './6_label_rotation.story';\nexport { Example as sorting } from './7_sorting.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getFlatData, getLayerSpec, maxDepth } from '../utils/hierarchical_input_utils';\\nimport { viridis18 as palette } from '../utils/utils';\\n\\nconst color = palette.slice().reverse();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend\\n        legendMaxDepth={maxDepth}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            minFontSize: 6,\\n            maxFontSize: 10,\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        layout={PartitionLayout.icicle}\\n        data={getFlatData()}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec(color)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getFlatData, getLayerSpec, maxDepth } from '../utils/hierarchical_input_utils';\nimport { viridis18 as palette } from '../utils/utils';\n\nconst color = palette.slice().reverse();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        flatLegend\n        legendMaxDepth={maxDepth}\n        baseTheme={useBaseTheme()}\n        theme={{\n          partition: {\n            minFontSize: 6,\n            maxFontSize: 10,\n          },\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        layout={PartitionLayout.icicle}\n        data={getFlatData()}\n        valueAccessor={(d: Datum) => d.value as number}\n        valueFormatter={() => ''}\n        layers={getLayerSpec(color)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend\\n        legendMaxDepth={maxDepth}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            minFontSize: 6,\\n            maxFontSize: 10,\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        layout={PartitionLayout.icicle}\\n        data={getFlatData()}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec(color)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, LegendStrategy, Partition, PartitionLayout, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getFlatData, getLayerSpec, maxDepth } from '../utils/hierarchical_input_utils';\\nimport { plasma18 as palette } from '../utils/utils';\\n\\nconst color = [...palette].reverse();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend\\n        legendPosition=\\\"right\\\"\\n        legendStrategy={LegendStrategy.PathWithDescendants}\\n        legendMaxDepth={maxDepth}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            minFontSize: 6,\\n            maxFontSize: 10,\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={getFlatData()}\\n        layout={PartitionLayout.flame}\\n        valueAccessor={(d: Datum) => d.value}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec(color)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, LegendStrategy, Partition, PartitionLayout, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getFlatData, getLayerSpec, maxDepth } from '../utils/hierarchical_input_utils';\nimport { plasma18 as palette } from '../utils/utils';\n\nconst color = [...palette].reverse();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        flatLegend\n        legendPosition=\"right\"\n        legendStrategy={LegendStrategy.PathWithDescendants}\n        legendMaxDepth={maxDepth}\n        baseTheme={useBaseTheme()}\n        theme={{\n          partition: {\n            minFontSize: 6,\n            maxFontSize: 10,\n          },\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={getFlatData()}\n        layout={PartitionLayout.flame}\n        valueAccessor={(d: Datum) => d.value}\n        valueFormatter={() => ''}\n        layers={getLayerSpec(color)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend\\n        legendPosition=\\\"right\\\"\\n        legendStrategy={LegendStrategy.PathWithDescendants}\\n        legendMaxDepth={maxDepth}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            minFontSize: 6,\\n            maxFontSize: 10,\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={getFlatData()}\\n        layout={PartitionLayout.flame}\\n        valueAccessor={(d: Datum) => d.value}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec(color)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, PrimitiveValue, Settings, PartialTheme } from '@elastic/charts';\\nimport data from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock.json';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { discreteColor, viridis18 as palette } from '../utils/utils';\\n\\nconst color = palette.slice().reverse();\\n\\nconst getLayerSpec = (maxDepth: number = 30) =>\\n  [...new Array(maxDepth + 1)].map((_, depth) => ({\\n    groupByRollup: (d: Datum) => data.dictionary[d.layers[depth]],\\n    nodeLabel: (d: PrimitiveValue) => `${String(d)}/`,\\n    showAccessor: (d: PrimitiveValue) => d !== undefined,\\n    shape: {\\n      fillColor: () => discreteColor(color, 0.8)(depth),\\n    },\\n  }));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const clipText = boolean(\\\"Allow, and clip, texts that wouldn't otherwise fit\\\", true);\\n  const theme: PartialTheme = {\\n    partition: {\\n      fillLabel: {\\n        clipText,\\n        padding: 0,\\n      },\\n      minFontSize: clipText ? 9 : 6,\\n      maxFontSize: clipText ? 9 : 20,\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} {...onElementListeners} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data.facts}\\n        layout={PartitionLayout.icicle}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec()}\\n        drilldown\\n        maxRowCount={1}\\n        animation={{\\n          duration: 500,\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":67},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":67}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, PrimitiveValue, Settings, PartialTheme } from '@elastic/charts';\nimport data from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock.json';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { discreteColor, viridis18 as palette } from '../utils/utils';\n\nconst color = palette.slice().reverse();\n\nconst getLayerSpec = (maxDepth: number = 30) =>\n  [...new Array(maxDepth + 1)].map((_, depth) => ({\n    groupByRollup: (d: Datum) => data.dictionary[d.layers[depth]],\n    nodeLabel: (d: PrimitiveValue) => `${String(d)}/`,\n    showAccessor: (d: PrimitiveValue) => d !== undefined,\n    shape: {\n      fillColor: () => discreteColor(color, 0.8)(depth),\n    },\n  }));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const clipText = boolean(\"Allow, and clip, texts that wouldn't otherwise fit\", true);\n  const theme: PartialTheme = {\n    partition: {\n      fillLabel: {\n        clipText,\n        padding: 0,\n      },\n      minFontSize: clipText ? 9 : 6,\n      maxFontSize: clipText ? 9 : 20,\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} {...onElementListeners} />\n      <Partition\n        id=\"spec_1\"\n        data={data.facts}\n        layout={PartitionLayout.icicle}\n        valueAccessor={(d: Datum) => d.value as number}\n        valueFormatter={() => ''}\n        layers={getLayerSpec()}\n        drilldown\n        maxRowCount={1}\n        animation={{\n          duration: 500,\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const clipText = boolean(\\\"Allow, and clip, texts that wouldn't otherwise fit\\\", true);\\n  const theme: PartialTheme = {\\n    partition: {\\n      fillLabel: {\\n        clipText,\\n        padding: 0,\\n      },\\n      minFontSize: clipText ? 9 : 6,\\n      maxFontSize: clipText ? 9 : 20,\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} {...onElementListeners} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data.facts}\\n        layout={PartitionLayout.icicle}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec()}\\n        drilldown\\n        maxRowCount={1}\\n        animation={{\\n          duration: 500,\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, button, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Flame,\\n  Settings,\\n  FlameGlobalControl,\\n  FlameNodeControl,\\n  ColumnarViewModel,\\n} from '@elastic/charts';\\nimport columnarMock from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock_columnar.json';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nconst paletteColorBrewerCat12 = [\\n  [141, 211, 199],\\n  [255, 255, 179],\\n  [190, 186, 218],\\n  [251, 128, 114],\\n  [128, 177, 211],\\n  [253, 180, 98],\\n  [179, 222, 105],\\n  [252, 205, 229],\\n  [217, 217, 217],\\n  [188, 128, 189],\\n  [204, 235, 197],\\n  [255, 237, 111],\\n];\\n\\nconst position = new Float32Array(columnarMock.position);\\nconst size = new Float32Array(columnarMock.size);\\n\\nconst columnarData: ColumnarViewModel = {\\n  label: columnarMock.label.map((index: number) => columnarMock.dictionary[index]), // reversing the dictionary encoding\\n  value: new Float64Array(columnarMock.value),\\n  // color: new Float32Array((columnarMock.color.match(/.{2}/g) ?? []).map((hex: string) => Number.parseInt(hex, 16) / 255)),\\n  color: new Float32Array(\\n    columnarMock.label.flatMap(() => [...paletteColorBrewerCat12[rng(0, 11)].map((c) => c / 255), 1]),\\n  ),\\n  position0: position, //position.map((p, i) => (i % 2 === 0 ? 1 - p - size[i / 2] : p)), //.map((p, i) => (i % 2 === 0 ? 1 - p - size[i / 2] : p)), // new Float32Array([...position].slice(1)), // try with the wrong array length\\n  position1: position,\\n  size0: size, //size.map((s) => 0.8 * s),\\n  size1: size,\\n};\\n\\nconst noop = () => {};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\\n\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  button('Reset focus', () => {\\n    resetFocusControl();\\n  });\\n  button('Set focus on random node', () => {\\n    focusOnNodeControl(rng(0, 19));\\n  });\\n  const textSearch = text('Text to search', '');\\n  const textChangeAction = action('Text change');\\n\\n  const debug = boolean('Debug history', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\\n      <Flame\\n        id=\\\"spec_1\\\"\\n        columnarData={columnarData}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={(value) => `${value}`}\\n        animation={{ duration: 500 }}\\n        search={{ text: textSearch }}\\n        onSearchTextChange={(text) => textChangeAction(`text changed to: [${text}]`)}\\n        controlProviderCallback={{\\n          resetFocus: (control) => (resetFocusControl = control),\\n          focusOnNode: (control) => (focusOnNodeControl = control),\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":63},\"endLoc\":{\"col\":1,\"line\":100},\"startBody\":{\"col\":36,\"line\":63},\"endBody\":{\"col\":1,\"line\":100}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, button, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Flame,\n  Settings,\n  FlameGlobalControl,\n  FlameNodeControl,\n  ColumnarViewModel,\n} from '@elastic/charts';\nimport columnarMock from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock_columnar.json';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\n\nconst paletteColorBrewerCat12 = [\n  [141, 211, 199],\n  [255, 255, 179],\n  [190, 186, 218],\n  [251, 128, 114],\n  [128, 177, 211],\n  [253, 180, 98],\n  [179, 222, 105],\n  [252, 205, 229],\n  [217, 217, 217],\n  [188, 128, 189],\n  [204, 235, 197],\n  [255, 237, 111],\n];\n\nconst position = new Float32Array(columnarMock.position);\nconst size = new Float32Array(columnarMock.size);\n\nconst columnarData: ColumnarViewModel = {\n  label: columnarMock.label.map((index: number) => columnarMock.dictionary[index]), // reversing the dictionary encoding\n  value: new Float64Array(columnarMock.value),\n  // color: new Float32Array((columnarMock.color.match(/.{2}/g) ?? []).map((hex: string) => Number.parseInt(hex, 16) / 255)),\n  color: new Float32Array(\n    columnarMock.label.flatMap(() => [...paletteColorBrewerCat12[rng(0, 11)].map((c) => c / 255), 1]),\n  ),\n  position0: position, //position.map((p, i) => (i % 2 === 0 ? 1 - p - size[i / 2] : p)), //.map((p, i) => (i % 2 === 0 ? 1 - p - size[i / 2] : p)), // new Float32Array([...position].slice(1)), // try with the wrong array length\n  position1: position,\n  size0: size, //size.map((s) => 0.8 * s),\n  size1: size,\n};\n\nconst noop = () => {};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\n\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  button('Reset focus', () => {\n    resetFocusControl();\n  });\n  button('Set focus on random node', () => {\n    focusOnNodeControl(rng(0, 19));\n  });\n  const textSearch = text('Text to search', '');\n  const textChangeAction = action('Text change');\n\n  const debug = boolean('Debug history', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\n      <Flame\n        id=\"spec_1\"\n        columnarData={columnarData}\n        valueAccessor={(d: Datum) => d.value as number}\n        valueFormatter={(value) => `${value}`}\n        animation={{ duration: 500 }}\n        search={{ text: textSearch }}\n        onSearchTextChange={(text) => textChangeAction(`text changed to: [${text}]`)}\n        controlProviderCallback={{\n          resetFocus: (control) => (resetFocusControl = control),\n          focusOnNode: (control) => (focusOnNodeControl = control),\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\\n\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  button('Reset focus', () => {\\n    resetFocusControl();\\n  });\\n  button('Set focus on random node', () => {\\n    focusOnNodeControl(rng(0, 19));\\n  });\\n  const textSearch = text('Text to search', '');\\n  const textChangeAction = action('Text change');\\n\\n  const debug = boolean('Debug history', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\\n      <Flame\\n        id=\\\"spec_1\\\"\\n        columnarData={columnarData}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={(value) => `${value}`}\\n        animation={{ duration: 500 }}\\n        search={{ text: textSearch }}\\n        onSearchTextChange={(text) => textChangeAction(`text changed to: [${text}]`)}\\n        controlProviderCallback={{\\n          resetFocus: (control) => (resetFocusControl = control),\\n          focusOnNode: (control) => (focusOnNodeControl = control),\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Flame (@alpha)',\n};\n\nexport { Example as icicleChart } from './01_unix_icicle.story';\nexport { Example as flameChart } from './02_unix_flame.story';\nexport { Example as cpuProfileFlameChart } from './03_cpu_profile_flame.story';\nexport { Example as cpuProfileGLFlameChart } from './04_cpu_profile_gl_flame.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { isVerticalRotation } from '@elastic/charts/src/chart_types/xy_chart/state/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const isVertical = isVerticalRotation(rotation);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onBrushEnd={action('onBrushEnd')} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"bottom\\\"\\n        showOverlappingTicks\\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"left\\\"\\n        position={Position.Left}\\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title=\\\"top\\\"\\n        showOverlappingTicks\\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"right\\\"\\n        position={Position.Right}\\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 2 },\\n          { x: 2, y: 7 },\\n          { x: 3, y: 3 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":67},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":67}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { isVerticalRotation } from '@elastic/charts/src/chart_types/xy_chart/state/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rotation = customKnobs.enum.rotation();\n  const isVertical = isVerticalRotation(rotation);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings onBrushEnd={action('onBrushEnd')} rotation={rotation} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"bottom\"\n        showOverlappingTicks\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\n      />\n      <Axis\n        id=\"left\"\n        title=\"left\"\n        position={Position.Left}\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\n      />\n      <Axis\n        id=\"top\"\n        position={Position.Top}\n        title=\"top\"\n        showOverlappingTicks\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\n      />\n      <Axis\n        id=\"right\"\n        title=\"right\"\n        position={Position.Right}\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\n      />\n\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 1, y: 2 },\n          { x: 2, y: 7 },\n          { x: 3, y: 3 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const isVertical = isVerticalRotation(rotation);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onBrushEnd={action('onBrushEnd')} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"bottom\\\"\\n        showOverlappingTicks\\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"left\\\"\\n        position={Position.Left}\\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title=\\\"top\\\"\\n        showOverlappingTicks\\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"right\\\"\\n        position={Position.Right}\\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 2 },\\n          { x: 2, y: 7 },\\n          { x: 3, y: 3 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      onBrushEnd={action('onBrushEnd')}\\n      rotation={customKnobs.enum.rotation()}\\n      roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\\n      allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      enableHistogramMode\\n      yAccessors={['y']}\\n      data={[\\n        { x: 1, y: 2 },\\n        { x: 2, y: 7 },\\n        { x: 3, y: 8 },\\n        { x: 4, y: 9 },\\n        { x: 5, y: 3 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      baseTheme={useBaseTheme()}\n      onBrushEnd={action('onBrushEnd')}\n      rotation={customKnobs.enum.rotation()}\n      roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\n      allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks />\n    <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n    <Axis id=\"top\" position={Position.Top} title=\"top\" showOverlappingTicks />\n    <Axis id=\"right\" title=\"right\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      enableHistogramMode\n      yAccessors={['y']}\n      data={[\n        { x: 1, y: 2 },\n        { x: 2, y: 7 },\n        { x: 3, y: 8 },\n        { x: 4, y: 9 },\n        { x: 5, y: 3 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      onBrushEnd={action('onBrushEnd')}\\n      rotation={customKnobs.enum.rotation()}\\n      roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\\n      allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      enableHistogramMode\\n      yAccessors={['y']}\\n      data={[\\n        { x: 1, y: 2 },\\n        { x: 2, y: 7 },\\n        { x: 3, y: 8 },\\n        { x: 4, y: 9 },\\n        { x: 5, y: 3 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport * as moment from 'moment-timezone';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  BrushEndListener,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatter,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = 1000 * 60 * 60 * 24;\\n  const oneDays = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatter = niceTimeFormatter([now, fiveDays.add(now).asMilliseconds()]);\\n  const brushEndListener: BrushEndListener = ({ x }) => {\\n    if (!x) {\\n      return;\\n    }\\n    action('onBrushEnd')(formatter(x[0]), formatter(x[1]));\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        onBrushEnd={brushEndListener}\\n        onElementClick={action('onElementClick')}\\n        rotation={customKnobs.enum.rotation()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks tickFormat={formatter} />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: oneDays.add(now).asMilliseconds(), y: 7 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"baras\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: now + oneDay, y: 7 },\\n          { x: now + oneDay * 2, y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport * as moment from 'moment-timezone';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  BrushEndListener,\n  Chart,\n  LineSeries,\n  niceTimeFormatter,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\n  const oneDay = 1000 * 60 * 60 * 24;\n  const oneDays = moment.duration(1, 'd');\n  const twoDays = moment.duration(2, 'd');\n  const fiveDays = moment.duration(5, 'd');\n  const formatter = niceTimeFormatter([now, fiveDays.add(now).asMilliseconds()]);\n  const brushEndListener: BrushEndListener = ({ x }) => {\n    if (!x) {\n      return;\n    }\n    action('onBrushEnd')(formatter(x[0]), formatter(x[1]));\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        onBrushEnd={brushEndListener}\n        onElementClick={action('onElementClick')}\n        rotation={customKnobs.enum.rotation()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks tickFormat={formatter} />\n      <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        timeZone=\"Europe/Rome\"\n        data={[\n          { x: now, y: 2 },\n          { x: oneDays.add(now).asMilliseconds(), y: 7 },\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\n          { x: now + oneDay * 5, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"baras\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        timeZone=\"Europe/Rome\"\n        data={[\n          { x: now, y: 2 },\n          { x: now + oneDay, y: 7 },\n          { x: now + oneDay * 2, y: 3 },\n          { x: now + oneDay * 5, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = 1000 * 60 * 60 * 24;\\n  const oneDays = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatter = niceTimeFormatter([now, fiveDays.add(now).asMilliseconds()]);\\n  const brushEndListener: BrushEndListener = ({ x }) => {\\n    if (!x) {\\n      return;\\n    }\\n    action('onBrushEnd')(formatter(x[0]), formatter(x[1]));\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        onBrushEnd={brushEndListener}\\n        onElementClick={action('onElementClick')}\\n        rotation={customKnobs.enum.rotation()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks tickFormat={formatter} />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: oneDays.add(now).asMilliseconds(), y: 7 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"baras\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: now + oneDay, y: 7 },\\n          { x: now + oneDay * 2, y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  niceTimeFormatter,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  HistogramBarSeries,\\n  BrushEndListener,\\n} from '@elastic/charts';\\nimport { isVerticalRotation } from '@elastic/charts/src/chart_types/xy_chart/state/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const isVertical = isVerticalRotation(rotation);\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = 1000 * 60 * 60 * 24;\\n  const dateFormatter = niceTimeFormatter([now, now + oneDay * 5]);\\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\\n  const brushEndListener: BrushEndListener = ({ x }) => {\\n    if (!x) {\\n      return;\\n    }\\n    action('onBrushEnd')(dateFormatter(x[0]), dateFormatter(x[1]));\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        onBrushEnd={brushEndListener}\\n        onElementClick={action('onElementClick')}\\n        rotation={customKnobs.enum.rotation()}\\n        roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\\n        allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"bottom\\\"\\n        showOverlappingTicks\\n        tickFormat={!isVertical ? dateFormatter : numberFormatter}\\n      />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={isVertical ? dateFormatter : numberFormatter} />\\n\\n      <HistogramBarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: now + oneDay, y: 7 },\\n          { x: now + oneDay * 2, y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":79},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":79}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  niceTimeFormatter,\n  Position,\n  ScaleType,\n  Settings,\n  HistogramBarSeries,\n  BrushEndListener,\n} from '@elastic/charts';\nimport { isVerticalRotation } from '@elastic/charts/src/chart_types/xy_chart/state/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rotation = customKnobs.enum.rotation();\n  const isVertical = isVerticalRotation(rotation);\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\n  const oneDay = 1000 * 60 * 60 * 24;\n  const dateFormatter = niceTimeFormatter([now, now + oneDay * 5]);\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\n  const brushEndListener: BrushEndListener = ({ x }) => {\n    if (!x) {\n      return;\n    }\n    action('onBrushEnd')(dateFormatter(x[0]), dateFormatter(x[1]));\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        onBrushEnd={brushEndListener}\n        onElementClick={action('onElementClick')}\n        rotation={customKnobs.enum.rotation()}\n        roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\n        allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\n      />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"bottom\"\n        showOverlappingTicks\n        tickFormat={!isVertical ? dateFormatter : numberFormatter}\n      />\n      <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={isVertical ? dateFormatter : numberFormatter} />\n\n      <HistogramBarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        timeZone=\"Europe/Rome\"\n        data={[\n          { x: now, y: 2 },\n          { x: now + oneDay, y: 7 },\n          { x: now + oneDay * 2, y: 3 },\n          { x: now + oneDay * 5, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const isVertical = isVerticalRotation(rotation);\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = 1000 * 60 * 60 * 24;\\n  const dateFormatter = niceTimeFormatter([now, now + oneDay * 5]);\\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\\n  const brushEndListener: BrushEndListener = ({ x }) => {\\n    if (!x) {\\n      return;\\n    }\\n    action('onBrushEnd')(dateFormatter(x[0]), dateFormatter(x[1]));\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        onBrushEnd={brushEndListener}\\n        onElementClick={action('onElementClick')}\\n        rotation={customKnobs.enum.rotation()}\\n        roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\\n        allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"bottom\\\"\\n        showOverlappingTicks\\n        tickFormat={!isVertical ? dateFormatter : numberFormatter}\\n      />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={isVertical ? dateFormatter : numberFormatter} />\\n\\n      <HistogramBarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: now + oneDay, y: 7 },\\n          { x: now + oneDay * 2, y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 2 },\\n        { x: 'b', y: 7 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks />\n    <Axis id=\"left\" title=\"left\" position={Position.Left} />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 2 },\n        { x: 'b', y: 7 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 2 },\\n        { x: 'b', y: 7 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  Tooltip,\\n  TooltipType,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hideBars = boolean('hideBars', false);\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  const chartRotation = customKnobs.enum.rotation();\\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\\n\\n  const tooltipType = select(\\n    'tooltipType',\\n    {\\n      cross: TooltipType.Crosshairs,\\n      vertical: TooltipType.VerticalCursor,\\n      follow: TooltipType.Follow,\\n      none: TooltipType.None,\\n    },\\n    TooltipType.Crosshairs,\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} rotation={chartRotation} />\\n      <Tooltip type={tooltipType} snap={boolean('tooltip snap to grid', true)} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        tickFormat={[0, 180].includes(chartRotation) ? formatter : numberFormatter}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit: hideBars,\\n        }}\\n        position={Position.Left}\\n        tickFormat={[0, 180].includes(chartRotation) ? numberFormatter : formatter}\\n      />\\n      {!hideBars && (\\n        <>\\n          <BarSeries\\n            id=\\\"data 1\\\"\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            stackAccessors={[0]}\\n            data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n          />\\n          <BarSeries\\n            id=\\\"data 2\\\"\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            stackAccessors={[0]}\\n            data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\\n          />\\n        </>\\n      )}\\n      <LineSeries\\n        id=\\\"data 3\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":101},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":101}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  Tooltip,\n  TooltipType,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hideBars = boolean('hideBars', false);\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n  const chartRotation = customKnobs.enum.rotation();\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\n\n  const tooltipType = select(\n    'tooltipType',\n    {\n      cross: TooltipType.Crosshairs,\n      vertical: TooltipType.VerticalCursor,\n      follow: TooltipType.Follow,\n      none: TooltipType.None,\n    },\n    TooltipType.Crosshairs,\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} rotation={chartRotation} />\n      <Tooltip type={tooltipType} snap={boolean('tooltip snap to grid', true)} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        tickFormat={[0, 180].includes(chartRotation) ? formatter : numberFormatter}\n      />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit: hideBars,\n        }}\n        position={Position.Left}\n        tickFormat={[0, 180].includes(chartRotation) ? numberFormatter : formatter}\n      />\n      {!hideBars && (\n        <>\n          <BarSeries\n            id=\"data 1\"\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor={0}\n            yAccessors={[1]}\n            stackAccessors={[0]}\n            data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\n          />\n          <BarSeries\n            id=\"data 2\"\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor={0}\n            yAccessors={[1]}\n            stackAccessors={[0]}\n            data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\n          />\n        </>\n      )}\n      <LineSeries\n        id=\"data 3\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hideBars = boolean('hideBars', false);\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  const chartRotation = customKnobs.enum.rotation();\\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\\n\\n  const tooltipType = select(\\n    'tooltipType',\\n    {\\n      cross: TooltipType.Crosshairs,\\n      vertical: TooltipType.VerticalCursor,\\n      follow: TooltipType.Follow,\\n      none: TooltipType.None,\\n    },\\n    TooltipType.Crosshairs,\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} rotation={chartRotation} />\\n      <Tooltip type={tooltipType} snap={boolean('tooltip snap to grid', true)} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        tickFormat={[0, 180].includes(chartRotation) ? formatter : numberFormatter}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit: hideBars,\\n        }}\\n        position={Position.Left}\\n        tickFormat={[0, 180].includes(chartRotation) ? numberFormatter : formatter}\\n      />\\n      {!hideBars && (\\n        <>\\n          <BarSeries\\n            id=\\\"data 1\\\"\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            stackAccessors={[0]}\\n            data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n          />\\n          <BarSeries\\n            id=\\\"data 2\\\"\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            stackAccessors={[0]}\\n            data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\\n          />\\n        </>\\n      )}\\n      <LineSeries\\n        id=\\\"data 3\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onRenderChange = action('onRenderChange');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      onRenderChange={onRenderChange}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown:\\n    'Sends an event every time the chart render state changes. This is provided to bind attributes to the chart for visulaization loading checks.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onRenderChange = action('onRenderChange');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendPosition={Position.Right}\n      onRenderChange={onRenderChange}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown:\n    'Sends an event every time the chart render state changes. This is provided to bind attributes to the chart for visulaization loading checks.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      onRenderChange={onRenderChange}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  PointerEvent,\\n  Placement,\\n  niceTimeFormatter,\\n  TooltipType,\\n  LineSeries,\\n  AreaSeries,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst chartTypes: Record<string, any> = {\\n  bar: BarSeries,\\n  line: LineSeries,\\n  area: AreaSeries,\\n};\\n\\nconst getSeriesKnob = (group?: string) => {\\n  const type =\\n    select<string>(\\n      'Series type',\\n      {\\n        Bar: 'bar',\\n        Line: 'line',\\n        Area: 'area',\\n      },\\n      'bar',\\n      group,\\n    ) ?? 'bar';\\n  return chartTypes[type] ?? BarSeries;\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\\n\\n  const group1 = 'Top Chart';\\n  const group2 = 'Bottom Chart';\\n\\n  const TopSeries = getSeriesKnob(group1);\\n  const BottomSeries = getSeriesKnob(group2);\\n  const topType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group1 });\\n  const bottomType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group2 });\\n  const topVisible = boolean('enable external tooltip', true, group1);\\n  const bottomVisible = boolean('enable external tooltip', true, group2);\\n  const topPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group1 });\\n  const bottomPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group2 });\\n\\n  const debounceDelay = number('pointer update debounce', 20, { min: 0, max: 200, step: 10 });\\n  const trigger =\\n    select(\\n      'pointer update trigger',\\n      {\\n        'Only x': 'x',\\n        'Only y': 'y',\\n        'Both x and y': 'both',\\n      },\\n      'x',\\n    ) ?? 'x';\\n\\n  return (\\n    <>\\n      <Chart title={title} description={description} ref={ref1} size={{ height: '50%' }} id=\\\"chart1\\\">\\n        <Settings\\n          showLegend\\n          showLegendExtra\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          pointerUpdateDebounce={debounceDelay}\\n          pointerUpdateTrigger={trigger}\\n          externalPointerEvents={{\\n            tooltip: { visible: topVisible, placement: topPlacement },\\n          }}\\n        />\\n        <Tooltip type={topType} />\\n\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          title={`External tooltip visible: ${topVisible} - boundary: scroll parent`}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n        <TopSeries\\n          id=\\\"Top\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data1.slice(3, 60)}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} ref={ref2} size={{ height: '50%' }} id=\\\"chart2\\\">\\n        <Settings\\n          showLegend\\n          showLegendExtra\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{\\n            tooltip: { visible: bottomVisible, placement: bottomPlacement, boundary: 'chart' },\\n          }}\\n        />\\n        <Tooltip type={bottomType} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          title={`External tooltip visible: ${bottomVisible} - boundary: chart`}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          tickFormat={(d: any) => Number(d).toFixed(2)}\\n          domain={{ min: 5, max: 20 }}\\n        />\\n\\n        <BottomSeries\\n          id=\\\"Bottom\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Sqrt}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data2.slice(10)}\\n          color={palettes.echPaletteForLightBackground.colors[0]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: 'Sends an event every time the cursor changes. This is provided to sync cursors between multiple charts.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":56},\"endLoc\":{\"col\":1,\"line\":164},\"startBody\":{\"col\":36,\"line\":56},\"endBody\":{\"col\":1,\"line\":164}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  PointerEvent,\n  Placement,\n  niceTimeFormatter,\n  TooltipType,\n  LineSeries,\n  AreaSeries,\n  Tooltip,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst chartTypes: Record<string, any> = {\n  bar: BarSeries,\n  line: LineSeries,\n  area: AreaSeries,\n};\n\nconst getSeriesKnob = (group?: string) => {\n  const type =\n    select<string>(\n      'Series type',\n      {\n        Bar: 'bar',\n        Line: 'line',\n        Area: 'area',\n      },\n      'bar',\n      group,\n    ) ?? 'bar';\n  return chartTypes[type] ?? BarSeries;\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const ref1 = React.useRef<Chart>(null);\n  const ref2 = React.useRef<Chart>(null);\n  const pointerUpdate = (event: PointerEvent) => {\n    action('onPointerUpdate')(event);\n    if (ref1.current) {\n      ref1.current.dispatchExternalPointerEvent(event);\n    }\n    if (ref2.current) {\n      ref2.current.dispatchExternalPointerEvent(event);\n    }\n  };\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\n\n  const group1 = 'Top Chart';\n  const group2 = 'Bottom Chart';\n\n  const TopSeries = getSeriesKnob(group1);\n  const BottomSeries = getSeriesKnob(group2);\n  const topType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group1 });\n  const bottomType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group2 });\n  const topVisible = boolean('enable external tooltip', true, group1);\n  const bottomVisible = boolean('enable external tooltip', true, group2);\n  const topPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group1 });\n  const bottomPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group2 });\n\n  const debounceDelay = number('pointer update debounce', 20, { min: 0, max: 200, step: 10 });\n  const trigger =\n    select(\n      'pointer update trigger',\n      {\n        'Only x': 'x',\n        'Only y': 'y',\n        'Both x and y': 'both',\n      },\n      'x',\n    ) ?? 'x';\n\n  return (\n    <>\n      <Chart title={title} description={description} ref={ref1} size={{ height: '50%' }} id=\"chart1\">\n        <Settings\n          showLegend\n          showLegendExtra\n          baseTheme={useBaseTheme()}\n          onPointerUpdate={pointerUpdate}\n          pointerUpdateDebounce={debounceDelay}\n          pointerUpdateTrigger={trigger}\n          externalPointerEvents={{\n            tooltip: { visible: topVisible, placement: topPlacement },\n          }}\n        />\n        <Tooltip type={topType} />\n\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          title={`External tooltip visible: ${topVisible} - boundary: scroll parent`}\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n        />\n        <Axis id=\"left2\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n        <TopSeries\n          id=\"Top\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data1.slice(3, 60)}\n        />\n      </Chart>\n      <Chart title={title} description={description} ref={ref2} size={{ height: '50%' }} id=\"chart2\">\n        <Settings\n          showLegend\n          showLegendExtra\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{\n            tooltip: { visible: bottomVisible, placement: bottomPlacement, boundary: 'chart' },\n          }}\n        />\n        <Tooltip type={bottomType} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          title={`External tooltip visible: ${bottomVisible} - boundary: chart`}\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n        />\n        <Axis\n          id=\"left2\"\n          position={Position.Left}\n          tickFormat={(d: any) => Number(d).toFixed(2)}\n          domain={{ min: 5, max: 20 }}\n        />\n\n        <BottomSeries\n          id=\"Bottom\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Sqrt}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data2.slice(10)}\n          color={palettes.echPaletteForLightBackground.colors[0]}\n        />\n      </Chart>\n    </>\n  );\n};\n\nExample.parameters = {\n  markdown: 'Sends an event every time the cursor changes. This is provided to sync cursors between multiple charts.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\\n\\n  const group1 = 'Top Chart';\\n  const group2 = 'Bottom Chart';\\n\\n  const TopSeries = getSeriesKnob(group1);\\n  const BottomSeries = getSeriesKnob(group2);\\n  const topType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group1 });\\n  const bottomType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group2 });\\n  const topVisible = boolean('enable external tooltip', true, group1);\\n  const bottomVisible = boolean('enable external tooltip', true, group2);\\n  const topPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group1 });\\n  const bottomPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group2 });\\n\\n  const debounceDelay = number('pointer update debounce', 20, { min: 0, max: 200, step: 10 });\\n  const trigger =\\n    select(\\n      'pointer update trigger',\\n      {\\n        'Only x': 'x',\\n        'Only y': 'y',\\n        'Both x and y': 'both',\\n      },\\n      'x',\\n    ) ?? 'x';\\n\\n  return (\\n    <>\\n      <Chart title={title} description={description} ref={ref1} size={{ height: '50%' }} id=\\\"chart1\\\">\\n        <Settings\\n          showLegend\\n          showLegendExtra\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          pointerUpdateDebounce={debounceDelay}\\n          pointerUpdateTrigger={trigger}\\n          externalPointerEvents={{\\n            tooltip: { visible: topVisible, placement: topPlacement },\\n          }}\\n        />\\n        <Tooltip type={topType} />\\n\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          title={`External tooltip visible: ${topVisible} - boundary: scroll parent`}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n        <TopSeries\\n          id=\\\"Top\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data1.slice(3, 60)}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} ref={ref2} size={{ height: '50%' }} id=\\\"chart2\\\">\\n        <Settings\\n          showLegend\\n          showLegendExtra\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{\\n            tooltip: { visible: bottomVisible, placement: bottomPlacement, boundary: 'chart' },\\n          }}\\n        />\\n        <Tooltip type={bottomType} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          title={`External tooltip visible: ${bottomVisible} - boundary: chart`}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          tickFormat={(d: any) => Number(d).toFixed(2)}\\n          domain={{ min: 5, max: 20 }}\\n        />\\n\\n        <BottomSeries\\n          id=\\\"Bottom\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Sqrt}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data2.slice(10)}\\n          color={palettes.echPaletteForLightBackground.colors[0]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { button, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  niceTimeFormatter,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Partition,\\n  Datum,\\n  Goal,\\n  ChartType,\\n  defaultPartitionValueFormatter,\\n  BandFillColorAccessorInput,\\n} from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { productLookup, indexInterpolatedFillColor, interpolatorCET2s, getBandFillColorFn } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  /**\\n   * The handler section of this story demonstrates the PNG export functionality\\n   */\\n  const chartRef = React.useRef<Chart>(null);\\n  const handler = () => {\\n    if (!chartRef.current) {\\n      return;\\n    }\\n    const snapshot = chartRef.current.getPNGSnapshot({\\n      // you can set the background and pixel ratio for the PNG export\\n      backgroundColor: 'white',\\n    });\\n    if (!snapshot) {\\n      return;\\n    }\\n    // will save as chart.png\\n    const fileName = 'chart.png';\\n    const link = document.createElement('a');\\n    link.download = fileName;\\n    link.href = snapshot.blobOrDataUrl;\\n    document.body.appendChild(link);\\n    link.click();\\n    document.body.removeChild(link);\\n  };\\n  button('Export PNG', handler);\\n  const selectedChart = select('chart type', [ChartType.XYAxis, ChartType.Partition, ChartType.Goal], ChartType.XYAxis);\\n\\n  return (\\n    <Chart title={title} description={description} ref={chartRef}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        showLegend={selectedChart === ChartType.XYAxis}\\n        showLegendExtra={selectedChart === ChartType.XYAxis}\\n      />\\n      {selectedChart === ChartType.Partition\\n        ? renderPartitionChart()\\n        : selectedChart === ChartType.Goal\\n          ? renderGoalchart()\\n          : renderXYAxisChart()}\\n    </Chart>\\n  );\\n};\\n\\nfunction renderPartitionChart() {\\n  return (\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  );\\n}\\n\\nfunction renderXYAxisChart() {\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 100);\\n  return (\\n    <>\\n      <Axis\\n        id=\\\"time\\\"\\n        position={Position.Bottom}\\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n      />\\n      <Axis\\n        id=\\\"count\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit: true,\\n        }}\\n        position={Position.Left}\\n      />\\n\\n      <BarSeries\\n        id=\\\"series bars chart\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </>\\n  );\\n}\\n\\nfunction renderGoalchart() {\\n  const subtype = GoalSubtype.Goal;\\n\\n  const getBandFillColor = getBandFillColorFn({\\n    200: '#fc8d62',\\n    250: 'lightgrey',\\n    300: '#66c2a5',\\n  });\\n\\n  return (\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  );\\n}\\n\\nExample.parameters = {\\n  markdown:\\n    'Generate a PNG of the chart by clicking on the Export PNG button in the knobs section. In this Example, the button handler is setting the PNG background to white with a pixel ratio of 2. If the browser is detected to be IE11, msSaveBlob will be used instead of a PNG capture.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":77},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":77}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { button, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  niceTimeFormatter,\n  Position,\n  ScaleType,\n  Settings,\n  Partition,\n  Datum,\n  Goal,\n  ChartType,\n  defaultPartitionValueFormatter,\n  BandFillColorAccessorInput,\n} from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { productLookup, indexInterpolatedFillColor, interpolatorCET2s, getBandFillColorFn } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  /**\n   * The handler section of this story demonstrates the PNG export functionality\n   */\n  const chartRef = React.useRef<Chart>(null);\n  const handler = () => {\n    if (!chartRef.current) {\n      return;\n    }\n    const snapshot = chartRef.current.getPNGSnapshot({\n      // you can set the background and pixel ratio for the PNG export\n      backgroundColor: 'white',\n    });\n    if (!snapshot) {\n      return;\n    }\n    // will save as chart.png\n    const fileName = 'chart.png';\n    const link = document.createElement('a');\n    link.download = fileName;\n    link.href = snapshot.blobOrDataUrl;\n    document.body.appendChild(link);\n    link.click();\n    document.body.removeChild(link);\n  };\n  button('Export PNG', handler);\n  const selectedChart = select('chart type', [ChartType.XYAxis, ChartType.Partition, ChartType.Goal], ChartType.XYAxis);\n\n  return (\n    <Chart title={title} description={description} ref={chartRef}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        showLegend={selectedChart === ChartType.XYAxis}\n        showLegendExtra={selectedChart === ChartType.XYAxis}\n      />\n      {selectedChart === ChartType.Partition\n        ? renderPartitionChart()\n        : selectedChart === ChartType.Goal\n          ? renderGoalchart()\n          : renderXYAxisChart()}\n    </Chart>\n  );\n};\n\nfunction renderPartitionChart() {\n  return (\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  );\n}\n\nfunction renderXYAxisChart() {\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 100);\n  return (\n    <>\n      <Axis\n        id=\"time\"\n        position={Position.Bottom}\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n      />\n      <Axis\n        id=\"count\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit: true,\n        }}\n        position={Position.Left}\n      />\n\n      <BarSeries\n        id=\"series bars chart\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </>\n  );\n}\n\nfunction renderGoalchart() {\n  const subtype = GoalSubtype.Goal;\n\n  const getBandFillColor = getBandFillColorFn({\n    200: '#fc8d62',\n    250: 'lightgrey',\n    300: '#66c2a5',\n  });\n\n  return (\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  );\n}\n\nExample.parameters = {\n  markdown:\n    'Generate a PNG of the chart by clicking on the Export PNG button in the knobs section. In this Example, the button handler is setting the PNG background to white with a pixel ratio of 2. If the browser is detected to be IE11, msSaveBlob will be used instead of a PNG capture.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  /**\\n   * The handler section of this story demonstrates the PNG export functionality\\n   */\\n  const chartRef = React.useRef<Chart>(null);\\n  const handler = () => {\\n    if (!chartRef.current) {\\n      return;\\n    }\\n    const snapshot = chartRef.current.getPNGSnapshot({\\n      // you can set the background and pixel ratio for the PNG export\\n      backgroundColor: 'white',\\n    });\\n    if (!snapshot) {\\n      return;\\n    }\\n    // will save as chart.png\\n    const fileName = 'chart.png';\\n    const link = document.createElement('a');\\n    link.download = fileName;\\n    link.href = snapshot.blobOrDataUrl;\\n    document.body.appendChild(link);\\n    link.click();\\n    document.body.removeChild(link);\\n  };\\n  button('Export PNG', handler);\\n  const selectedChart = select('chart type', [ChartType.XYAxis, ChartType.Partition, ChartType.Goal], ChartType.XYAxis);\\n\\n  return (\\n    <Chart title={title} description={description} ref={chartRef}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        showLegend={selectedChart === ChartType.XYAxis}\\n        showLegendExtra={selectedChart === ChartType.XYAxis}\\n      />\\n      {selectedChart === ChartType.Partition\\n        ? renderPartitionChart()\\n        : selectedChart === ChartType.Goal\\n          ? renderGoalchart()\\n          : renderXYAxisChart()}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  PointerEvent,\\n  Placement,\\n  niceTimeFormatter,\\n  TooltipType,\\n  LineSeries,\\n  AreaSeries,\\n  RectAnnotation,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst chartTypes: Record<string, any> = {\\n  bar: BarSeries,\\n  line: LineSeries,\\n  area: AreaSeries,\\n};\\n\\nconst getSeriesKnob = (group?: string) => {\\n  const type =\\n    select<string>(\\n      'Series type',\\n      {\\n        Bar: 'bar',\\n        Line: 'line',\\n        Area: 'area',\\n      },\\n      'area',\\n      group,\\n    ) ?? 'area';\\n  return chartTypes[type] ?? BarSeries;\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\\n\\n  const TopSeries = getSeriesKnob();\\n  const BottomSeries = getSeriesKnob();\\n\\n  const showNullValues = boolean('show null values', true);\\n\\n  return (\\n    <>\\n      <Chart\\n        title={title}\\n        description={description}\\n        className=\\\"story-chart\\\"\\n        ref={ref1}\\n        size={{ height: '50%' }}\\n        id=\\\"chart1\\\"\\n      >\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          pointerUpdateDebounce={0}\\n          pointerUpdateTrigger=\\\"x\\\"\\n          externalPointerEvents={{\\n            tooltip: { visible: true, placement: Placement.Left },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          ticks={3}\\n          position={Position.Left}\\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\\n        />\\n        <RectAnnotation\\n          dataValues={[\\n            {\\n              coordinates: { x0: data2[10][0], x1: data2[29][0] },\\n            },\\n          ]}\\n          id=\\\"zoomed\\\"\\n          hideTooltips\\n        />\\n\\n        <TopSeries\\n          id=\\\"Top\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data1.slice(2, 35).map((d, i) => {\\n            if (i === 7 || i === 11 || i === 12) {\\n              return [d[0], null];\\n            }\\n            return d;\\n          })}\\n        />\\n      </Chart>\\n      <Chart\\n        title={title}\\n        description={description}\\n        className=\\\"story-chart\\\"\\n        ref={ref2}\\n        size={{ height: '50%' }}\\n        id=\\\"chart2\\\"\\n      >\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{\\n            tooltip: { visible: true, placement: Placement.Left, boundary: 'chart' },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          ticks={3}\\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\\n          domain={{ min: 5, max: 20 }}\\n        />\\n\\n        <BottomSeries\\n          id=\\\"Bottom\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data2.slice(10, 30).map((d, i) => {\\n            if (i === 4 || i === 10) {\\n              return [d[0], null];\\n            }\\n            return d;\\n          })}\\n          color={palettes.echPaletteForLightBackground.colors[0]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":56},\"endLoc\":{\"col\":1,\"line\":178},\"startBody\":{\"col\":36,\"line\":56},\"endBody\":{\"col\":1,\"line\":178}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  PointerEvent,\n  Placement,\n  niceTimeFormatter,\n  TooltipType,\n  LineSeries,\n  AreaSeries,\n  RectAnnotation,\n  Tooltip,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst chartTypes: Record<string, any> = {\n  bar: BarSeries,\n  line: LineSeries,\n  area: AreaSeries,\n};\n\nconst getSeriesKnob = (group?: string) => {\n  const type =\n    select<string>(\n      'Series type',\n      {\n        Bar: 'bar',\n        Line: 'line',\n        Area: 'area',\n      },\n      'area',\n      group,\n    ) ?? 'area';\n  return chartTypes[type] ?? BarSeries;\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const ref1 = React.useRef<Chart>(null);\n  const ref2 = React.useRef<Chart>(null);\n  const pointerUpdate = (event: PointerEvent) => {\n    action('onPointerUpdate')(event);\n    if (ref1.current) {\n      ref1.current.dispatchExternalPointerEvent(event);\n    }\n    if (ref2.current) {\n      ref2.current.dispatchExternalPointerEvent(event);\n    }\n  };\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\n\n  const TopSeries = getSeriesKnob();\n  const BottomSeries = getSeriesKnob();\n\n  const showNullValues = boolean('show null values', true);\n\n  return (\n    <>\n      <Chart\n        title={title}\n        description={description}\n        className=\"story-chart\"\n        ref={ref1}\n        size={{ height: '50%' }}\n        id=\"chart1\"\n      >\n        <Settings\n          baseTheme={useBaseTheme()}\n          onPointerUpdate={pointerUpdate}\n          pointerUpdateDebounce={0}\n          pointerUpdateTrigger=\"x\"\n          externalPointerEvents={{\n            tooltip: { visible: true, placement: Placement.Left },\n          }}\n        />\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n        />\n        <Axis\n          id=\"left2\"\n          ticks={3}\n          position={Position.Left}\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\n        />\n        <RectAnnotation\n          dataValues={[\n            {\n              coordinates: { x0: data2[10][0], x1: data2[29][0] },\n            },\n          ]}\n          id=\"zoomed\"\n          hideTooltips\n        />\n\n        <TopSeries\n          id=\"Top\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data1.slice(2, 35).map((d, i) => {\n            if (i === 7 || i === 11 || i === 12) {\n              return [d[0], null];\n            }\n            return d;\n          })}\n        />\n      </Chart>\n      <Chart\n        title={title}\n        description={description}\n        className=\"story-chart\"\n        ref={ref2}\n        size={{ height: '50%' }}\n        id=\"chart2\"\n      >\n        <Settings\n          baseTheme={useBaseTheme()}\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{\n            tooltip: { visible: true, placement: Placement.Left, boundary: 'chart' },\n          }}\n        />\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n        />\n        <Axis\n          id=\"left2\"\n          position={Position.Left}\n          ticks={3}\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\n          domain={{ min: 5, max: 20 }}\n        />\n\n        <BottomSeries\n          id=\"Bottom\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data2.slice(10, 30).map((d, i) => {\n            if (i === 4 || i === 10) {\n              return [d[0], null];\n            }\n            return d;\n          })}\n          color={palettes.echPaletteForLightBackground.colors[0]}\n        />\n      </Chart>\n    </>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\\n\\n  const TopSeries = getSeriesKnob();\\n  const BottomSeries = getSeriesKnob();\\n\\n  const showNullValues = boolean('show null values', true);\\n\\n  return (\\n    <>\\n      <Chart\\n        title={title}\\n        description={description}\\n        className=\\\"story-chart\\\"\\n        ref={ref1}\\n        size={{ height: '50%' }}\\n        id=\\\"chart1\\\"\\n      >\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          pointerUpdateDebounce={0}\\n          pointerUpdateTrigger=\\\"x\\\"\\n          externalPointerEvents={{\\n            tooltip: { visible: true, placement: Placement.Left },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          ticks={3}\\n          position={Position.Left}\\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\\n        />\\n        <RectAnnotation\\n          dataValues={[\\n            {\\n              coordinates: { x0: data2[10][0], x1: data2[29][0] },\\n            },\\n          ]}\\n          id=\\\"zoomed\\\"\\n          hideTooltips\\n        />\\n\\n        <TopSeries\\n          id=\\\"Top\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data1.slice(2, 35).map((d, i) => {\\n            if (i === 7 || i === 11 || i === 12) {\\n              return [d[0], null];\\n            }\\n            return d;\\n          })}\\n        />\\n      </Chart>\\n      <Chart\\n        title={title}\\n        description={description}\\n        className=\\\"story-chart\\\"\\n        ref={ref2}\\n        size={{ height: '50%' }}\\n        id=\\\"chart2\\\"\\n      >\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{\\n            tooltip: { visible: true, placement: Placement.Left, boundary: 'chart' },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          ticks={3}\\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\\n          domain={{ min: 5, max: 20 }}\\n        />\\n\\n        <BottomSeries\\n          id=\\\"Bottom\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data2.slice(10, 30).map((d, i) => {\\n            if (i === 4 || i === 10) {\\n              return [d[0], null];\\n            }\\n            return d;\\n          })}\\n          color={palettes.echPaletteForLightBackground.colors[0]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  PointerEvent,\\n  Placement,\\n  TooltipType,\\n  LineSeries,\\n  Heatmap,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator('static');\\n\\nconst aggData = [\\n  ...KIBANA_METRICS.metrics.kibana_os_load.v1.data\\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\\n      if (i % 5 === 0) {\\n        acc.push({ x, y: '2fd4e', value: y });\\n      } else {\\n        acc[acc.length - 1].value += y;\\n      }\\n\\n      return acc;\\n    }, [])\\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\\n  ...KIBANA_METRICS.metrics.kibana_os_load.v2.data\\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\\n      if (i % 5 === 0) {\\n        acc.push({ x, y: '3afad', value: y });\\n      } else {\\n        acc[acc.length - 1].value += y;\\n      }\\n\\n      return acc;\\n    }, [])\\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\\n  ...KIBANA_METRICS.metrics.kibana_os_load.v3.data\\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\\n      if (i % 5 === 0) {\\n        acc.push({ x, y: 'f9560', value: y });\\n      } else {\\n        acc[acc.length - 1].value += y;\\n      }\\n\\n      return acc;\\n    }, [])\\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\\n];\\n\\nexport const Example: ChartsStory = () => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const ref3 = React.useRef<Chart>(null);\\n\\n  const pointerUpdate = (event: PointerEvent) => {\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref3.current) {\\n      ref3.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const baseTheme = useBaseTheme();\\n\\n  return (\\n    <>\\n      <Chart title=\\\"Response times\\\" ref={ref1} size={{ height: '30%' }} id=\\\"chart1\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            lineSeriesStyle: { point: { visible: false } },\\n          }}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          timeAxisLayerCount={2}\\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: {\\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n              padding: 0,\\n            },\\n            axisTitle: { visible: false },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          ticks={2}\\n          position={Position.Left}\\n          tickFormat={(d) => `${d / 1000}s`}\\n          style={{\\n            tickLine: { size: 0 },\\n            tickLabel: { padding: 4 },\\n            axisTitle: { visible: false, padding: 0 },\\n            axisPanelTitle: { visible: false, padding: 0 },\\n          }}\\n        />\\n\\n        <LineSeries\\n          id=\\\"Response time\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={KIBANA_METRICS.metrics.kibana_response_times.v1.data}\\n          yNice\\n          color=\\\"#343741\\\"\\n        />\\n      </Chart>\\n\\n      <br />\\n\\n      <Chart title=\\\"Number of requests\\\" ref={ref2} size={{ height: '30%' }} id=\\\"chart2\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            lineSeriesStyle: { point: { visible: false } },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          timeAxisLayerCount={2}\\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: {\\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n              padding: 0,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          ticks={2}\\n          style={{\\n            tickLine: { size: 0 },\\n            tickLabel: { padding: 4 },\\n            axisTitle: { visible: false, padding: 0 },\\n            axisPanelTitle: { visible: false, padding: 0 },\\n          }}\\n        />\\n        <LineSeries\\n          id=\\\"# Requests\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={KIBANA_METRICS.metrics.kibana_requests.v1.data}\\n          color=\\\"#343741\\\"\\n          yNice\\n        />\\n      </Chart>\\n\\n      <br />\\n\\n      <Chart title=\\\"Memory pressure\\\" ref={ref3} size={{ height: '30%' }} id=\\\"heatmap\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            heatmap: {\\n              grid: {\\n                stroke: {\\n                  color: baseTheme.axes.axisLine.stroke,\\n                  width: baseTheme.axes.axisLine.strokeWidth,\\n                },\\n              },\\n\\n              cell: {\\n                border: {\\n                  stroke: 'transparent',\\n                  strokeWidth: 0,\\n                },\\n              },\\n              yAxisLabel: {\\n                width: 50,\\n                textColor: baseTheme.axes.tickLabel.fill,\\n                fontSize: baseTheme.axes.tickLabel.fontSize,\\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\\n              },\\n              xAxisLabel: {\\n                textColor: baseTheme.axes.tickLabel.fill,\\n                fontSize: baseTheme.axes.tickLabel.fontSize,\\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\\n              },\\n            },\\n          }}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true } }}\\n        />\\n        <Heatmap\\n          id=\\\"CPU temp\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: [\\n              { start: -Infinity, end: 40, color: '#ffffb2' },\\n              { start: 40, end: 50, color: '#fed976' },\\n              { start: 50, end: 60, color: '#feb24c' },\\n              { start: 60, end: 70, color: '#fd8d3c' },\\n              { start: 70, end: 80, color: '#fc4e2a' },\\n              { start: 80, end: 90, color: '#e31a1c' },\\n              { start: 90, end: Infinity, color: '#b10026' },\\n            ],\\n          }}\\n          data={aggData}\\n          xAccessor=\\\"x\\\"\\n          yAccessor=\\\"y\\\"\\n          valueAccessor=\\\"value\\\"\\n          valueFormatter={(d) => `${Number(d.toFixed(1))}℃`}\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: {\\n              type: 'fixed',\\n              unit: 'ms',\\n              value: aggData[1].x - aggData[0].x,\\n            },\\n          }}\\n          xAxisLabelFormatter={(v) =>\\n            DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })\\n          }\\n          xAxisLabelName=\\\"time\\\"\\n          yAxisLabelName=\\\"cluster\\\"\\n          timeZone=\\\"UTC\\\"\\n          ySortPredicate=\\\"dataIndex\\\"\\n          yAxisLabelFormatter={(laneLabel) => `${laneLabel}`}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\\nExample.parameters = {\\n  toggles: {\\n    disabled: true,\\n    overrides: {},\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":69},\"endLoc\":{\"col\":1,\"line\":272},\"startBody\":{\"col\":36,\"line\":69},\"endBody\":{\"col\":1,\"line\":272}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  PointerEvent,\n  Placement,\n  TooltipType,\n  LineSeries,\n  Heatmap,\n  Tooltip,\n} from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator('static');\n\nconst aggData = [\n  ...KIBANA_METRICS.metrics.kibana_os_load.v1.data\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\n      if (i % 5 === 0) {\n        acc.push({ x, y: '2fd4e', value: y });\n      } else {\n        acc[acc.length - 1].value += y;\n      }\n\n      return acc;\n    }, [])\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\n  ...KIBANA_METRICS.metrics.kibana_os_load.v2.data\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\n      if (i % 5 === 0) {\n        acc.push({ x, y: '3afad', value: y });\n      } else {\n        acc[acc.length - 1].value += y;\n      }\n\n      return acc;\n    }, [])\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\n  ...KIBANA_METRICS.metrics.kibana_os_load.v3.data\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\n      if (i % 5 === 0) {\n        acc.push({ x, y: 'f9560', value: y });\n      } else {\n        acc[acc.length - 1].value += y;\n      }\n\n      return acc;\n    }, [])\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\n];\n\nexport const Example: ChartsStory = () => {\n  const ref1 = React.useRef<Chart>(null);\n  const ref2 = React.useRef<Chart>(null);\n  const ref3 = React.useRef<Chart>(null);\n\n  const pointerUpdate = (event: PointerEvent) => {\n    if (ref1.current) {\n      ref1.current.dispatchExternalPointerEvent(event);\n    }\n    if (ref2.current) {\n      ref2.current.dispatchExternalPointerEvent(event);\n    }\n    if (ref3.current) {\n      ref3.current.dispatchExternalPointerEvent(event);\n    }\n  };\n  const baseTheme = useBaseTheme();\n\n  return (\n    <>\n      <Chart title=\"Response times\" ref={ref1} size={{ height: '30%' }} id=\"chart1\">\n        <Settings\n          baseTheme={baseTheme}\n          theme={{\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\n            lineSeriesStyle: { point: { visible: false } },\n          }}\n          pointerUpdateDebounce={0}\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\n        />\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          timeAxisLayerCount={2}\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\n          style={{\n            tickLine: { size: 0.0001, padding: 4 },\n            tickLabel: {\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n              padding: 0,\n            },\n            axisTitle: { visible: false },\n          }}\n        />\n        <Axis\n          id=\"left2\"\n          ticks={2}\n          position={Position.Left}\n          tickFormat={(d) => `${d / 1000}s`}\n          style={{\n            tickLine: { size: 0 },\n            tickLabel: { padding: 4 },\n            axisTitle: { visible: false, padding: 0 },\n            axisPanelTitle: { visible: false, padding: 0 },\n          }}\n        />\n\n        <LineSeries\n          id=\"Response time\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={KIBANA_METRICS.metrics.kibana_response_times.v1.data}\n          yNice\n          color=\"#343741\"\n        />\n      </Chart>\n\n      <br />\n\n      <Chart title=\"Number of requests\" ref={ref2} size={{ height: '30%' }} id=\"chart2\">\n        <Settings\n          baseTheme={baseTheme}\n          pointerUpdateDebounce={0}\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\n          theme={{\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\n            lineSeriesStyle: { point: { visible: false } },\n          }}\n        />\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          timeAxisLayerCount={2}\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\n          style={{\n            tickLine: { size: 0.0001, padding: 4 },\n            tickLabel: {\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n              padding: 0,\n            },\n          }}\n        />\n        <Axis\n          id=\"left2\"\n          position={Position.Left}\n          ticks={2}\n          style={{\n            tickLine: { size: 0 },\n            tickLabel: { padding: 4 },\n            axisTitle: { visible: false, padding: 0 },\n            axisPanelTitle: { visible: false, padding: 0 },\n          }}\n        />\n        <LineSeries\n          id=\"# Requests\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={KIBANA_METRICS.metrics.kibana_requests.v1.data}\n          color=\"#343741\"\n          yNice\n        />\n      </Chart>\n\n      <br />\n\n      <Chart title=\"Memory pressure\" ref={ref3} size={{ height: '30%' }} id=\"heatmap\">\n        <Settings\n          baseTheme={baseTheme}\n          theme={{\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\n            heatmap: {\n              grid: {\n                stroke: {\n                  color: baseTheme.axes.axisLine.stroke,\n                  width: baseTheme.axes.axisLine.strokeWidth,\n                },\n              },\n\n              cell: {\n                border: {\n                  stroke: 'transparent',\n                  strokeWidth: 0,\n                },\n              },\n              yAxisLabel: {\n                width: 50,\n                textColor: baseTheme.axes.tickLabel.fill,\n                fontSize: baseTheme.axes.tickLabel.fontSize,\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\n              },\n              xAxisLabel: {\n                textColor: baseTheme.axes.tickLabel.fill,\n                fontSize: baseTheme.axes.tickLabel.fontSize,\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\n              },\n            },\n          }}\n          pointerUpdateDebounce={0}\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{ tooltip: { visible: true } }}\n        />\n        <Heatmap\n          id=\"CPU temp\"\n          colorScale={{\n            type: 'bands',\n            bands: [\n              { start: -Infinity, end: 40, color: '#ffffb2' },\n              { start: 40, end: 50, color: '#fed976' },\n              { start: 50, end: 60, color: '#feb24c' },\n              { start: 60, end: 70, color: '#fd8d3c' },\n              { start: 70, end: 80, color: '#fc4e2a' },\n              { start: 80, end: 90, color: '#e31a1c' },\n              { start: 90, end: Infinity, color: '#b10026' },\n            ],\n          }}\n          data={aggData}\n          xAccessor=\"x\"\n          yAccessor=\"y\"\n          valueAccessor=\"value\"\n          valueFormatter={(d) => `${Number(d.toFixed(1))}℃`}\n          xScale={{\n            type: ScaleType.Time,\n            interval: {\n              type: 'fixed',\n              unit: 'ms',\n              value: aggData[1].x - aggData[0].x,\n            },\n          }}\n          xAxisLabelFormatter={(v) =>\n            DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })\n          }\n          xAxisLabelName=\"time\"\n          yAxisLabelName=\"cluster\"\n          timeZone=\"UTC\"\n          ySortPredicate=\"dataIndex\"\n          yAxisLabelFormatter={(laneLabel) => `${laneLabel}`}\n        />\n      </Chart>\n    </>\n  );\n};\n\nExample.parameters = {\n  toggles: {\n    disabled: true,\n    overrides: {},\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const ref3 = React.useRef<Chart>(null);\\n\\n  const pointerUpdate = (event: PointerEvent) => {\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref3.current) {\\n      ref3.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const baseTheme = useBaseTheme();\\n\\n  return (\\n    <>\\n      <Chart title=\\\"Response times\\\" ref={ref1} size={{ height: '30%' }} id=\\\"chart1\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            lineSeriesStyle: { point: { visible: false } },\\n          }}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          timeAxisLayerCount={2}\\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: {\\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n              padding: 0,\\n            },\\n            axisTitle: { visible: false },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          ticks={2}\\n          position={Position.Left}\\n          tickFormat={(d) => `${d / 1000}s`}\\n          style={{\\n            tickLine: { size: 0 },\\n            tickLabel: { padding: 4 },\\n            axisTitle: { visible: false, padding: 0 },\\n            axisPanelTitle: { visible: false, padding: 0 },\\n          }}\\n        />\\n\\n        <LineSeries\\n          id=\\\"Response time\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={KIBANA_METRICS.metrics.kibana_response_times.v1.data}\\n          yNice\\n          color=\\\"#343741\\\"\\n        />\\n      </Chart>\\n\\n      <br />\\n\\n      <Chart title=\\\"Number of requests\\\" ref={ref2} size={{ height: '30%' }} id=\\\"chart2\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            lineSeriesStyle: { point: { visible: false } },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          timeAxisLayerCount={2}\\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: {\\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n              padding: 0,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          ticks={2}\\n          style={{\\n            tickLine: { size: 0 },\\n            tickLabel: { padding: 4 },\\n            axisTitle: { visible: false, padding: 0 },\\n            axisPanelTitle: { visible: false, padding: 0 },\\n          }}\\n        />\\n        <LineSeries\\n          id=\\\"# Requests\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={KIBANA_METRICS.metrics.kibana_requests.v1.data}\\n          color=\\\"#343741\\\"\\n          yNice\\n        />\\n      </Chart>\\n\\n      <br />\\n\\n      <Chart title=\\\"Memory pressure\\\" ref={ref3} size={{ height: '30%' }} id=\\\"heatmap\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            heatmap: {\\n              grid: {\\n                stroke: {\\n                  color: baseTheme.axes.axisLine.stroke,\\n                  width: baseTheme.axes.axisLine.strokeWidth,\\n                },\\n              },\\n\\n              cell: {\\n                border: {\\n                  stroke: 'transparent',\\n                  strokeWidth: 0,\\n                },\\n              },\\n              yAxisLabel: {\\n                width: 50,\\n                textColor: baseTheme.axes.tickLabel.fill,\\n                fontSize: baseTheme.axes.tickLabel.fontSize,\\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\\n              },\\n              xAxisLabel: {\\n                textColor: baseTheme.axes.tickLabel.fill,\\n                fontSize: baseTheme.axes.tickLabel.fontSize,\\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\\n              },\\n            },\\n          }}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true } }}\\n        />\\n        <Heatmap\\n          id=\\\"CPU temp\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: [\\n              { start: -Infinity, end: 40, color: '#ffffb2' },\\n              { start: 40, end: 50, color: '#fed976' },\\n              { start: 50, end: 60, color: '#feb24c' },\\n              { start: 60, end: 70, color: '#fd8d3c' },\\n              { start: 70, end: 80, color: '#fc4e2a' },\\n              { start: 80, end: 90, color: '#e31a1c' },\\n              { start: 90, end: Infinity, color: '#b10026' },\\n            ],\\n          }}\\n          data={aggData}\\n          xAccessor=\\\"x\\\"\\n          yAccessor=\\\"y\\\"\\n          valueAccessor=\\\"value\\\"\\n          valueFormatter={(d) => `${Number(d.toFixed(1))}℃`}\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: {\\n              type: 'fixed',\\n              unit: 'ms',\\n              value: aggData[1].x - aggData[0].x,\\n            },\\n          }}\\n          xAxisLabelFormatter={(v) =>\\n            DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })\\n          }\\n          xAxisLabelName=\\\"time\\\"\\n          yAxisLabelName=\\\"cluster\\\"\\n          timeZone=\\\"UTC\\\"\\n          ySortPredicate=\\\"dataIndex\\\"\\n          yAxisLabelFormatter={(laneLabel) => `${laneLabel}`}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Tooltip,\\n  TooltipHeaderFormatter,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n  onProjectionClick: action('onProjectionClick'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useObjectAsX = boolean('use object on x', false);\\n  const headerFormatter: TooltipHeaderFormatter = ({ value }) => {\\n    if (value % 2 === 0) {\\n      return (\\n        <div>\\n          <p>special header for even x values</p>\\n          <p>{value}</p>\\n        </div>\\n      );\\n    }\\n\\n    return value;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onElementListeners}\\n      />\\n      <Tooltip headerFormatter={headerFormatter} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={useObjectAsX ? ScaleType.Ordinal : ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={useObjectAsX ? 'sObj' : 'x'}\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2, obj: { from: 10, to: 20 }, sObj: 'from 10 to 20' },\\n          { x: 1, y: 7, obj: { from: 20, to: 30 }, sObj: 'from 20 to 30' },\\n          { x: 2, y: -3, obj: { from: 30, to: 40 }, sObj: 'from 30 to 40' },\\n          { x: 3, y: 6, obj: { from: 40, to: 50 }, sObj: 'from 40 to 50' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":77},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":77}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  Tooltip,\n  TooltipHeaderFormatter,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n  onProjectionClick: action('onProjectionClick'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useObjectAsX = boolean('use object on x', false);\n  const headerFormatter: TooltipHeaderFormatter = ({ value }) => {\n    if (value % 2 === 0) {\n      return (\n        <div>\n          <p>special header for even x values</p>\n          <p>{value}</p>\n        </div>\n      );\n    }\n\n    return value;\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n        {...onElementListeners}\n      />\n      <Tooltip headerFormatter={headerFormatter} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={useObjectAsX ? ScaleType.Ordinal : ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={useObjectAsX ? 'sObj' : 'x'}\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2, obj: { from: 10, to: 20 }, sObj: 'from 10 to 20' },\n          { x: 1, y: 7, obj: { from: 20, to: 30 }, sObj: 'from 20 to 30' },\n          { x: 2, y: -3, obj: { from: 30, to: 40 }, sObj: 'from 30 to 40' },\n          { x: 3, y: 6, obj: { from: 40, to: 50 }, sObj: 'from 40 to 50' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useObjectAsX = boolean('use object on x', false);\\n  const headerFormatter: TooltipHeaderFormatter = ({ value }) => {\\n    if (value % 2 === 0) {\\n      return (\\n        <div>\\n          <p>special header for even x values</p>\\n          <p>{value}</p>\\n        </div>\\n      );\\n    }\\n\\n    return value;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onElementListeners}\\n      />\\n      <Tooltip headerFormatter={headerFormatter} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={useObjectAsX ? ScaleType.Ordinal : ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={useObjectAsX ? 'sObj' : 'x'}\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2, obj: { from: 10, to: 20 }, sObj: 'from 10 to 20' },\\n          { x: 1, y: 7, obj: { from: 20, to: 30 }, sObj: 'from 20 to 30' },\\n          { x: 2, y: -3, obj: { from: 30, to: 40 }, sObj: 'from 30 to 40' },\\n          { x: 3, y: 6, obj: { from: 40, to: 50 }, sObj: 'from 40 to 50' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"area\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendPosition={Position.Right}\n      {...onElementListeners}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <AreaSeries\n      id=\"area\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"area\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <LineSeries\\n      id=\\\"line 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line 2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 6.8 },\\n        { x: 2, y: 3.001 },\\n        { x: 3, y: 6.1 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":62},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":62}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendPosition={Position.Right}\n      {...onElementListeners}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <LineSeries\n      id=\"line 1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"line 2\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 6.8 },\n        { x: 2, y: 3.001 },\n        { x: 3, y: 6.1 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <LineSeries\\n      id=\\\"line 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line 2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 6.8 },\\n        { x: 2, y: 3.001 },\\n        { x: 3, y: 6.1 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 8 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <AreaSeries\\n      id=\\\"area\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.3 },\\n        { x: 1, y: 7.3 },\\n        { x: 2, y: 6 },\\n        { x: 3, y: 2 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":75},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":75}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { AreaSeries, Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendPosition={Position.Right}\n      {...onElementListeners}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2.3 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 8 },\n      ]}\n    />\n    <LineSeries\n      id=\"line\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <AreaSeries\n      id=\"area\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2.3 },\n        { x: 1, y: 7.3 },\n        { x: 2, y: 6 },\n        { x: 3, y: 2 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 8 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <AreaSeries\\n      id=\\\"area\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.3 },\\n        { x: 1, y: 7.3 },\\n        { x: 2, y: 6 },\\n        { x: 3, y: 2 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Position, Settings, Partition, PartitionLayout } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { discreteColor, colorBrewerCategoricalPastel12 } from '../utils/utils';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\ntype PieDatum = [string, number, string, number];\\n\\nconst pieData: Array<PieDatum> = [\\n  ['CN', 301, 'IN', 44],\\n  ['CN', 301, 'US', 24],\\n  ['CN', 301, 'ID', 13],\\n  ['CN', 301, 'BR', 8],\\n  ['IN', 245, 'US', 22],\\n  ['IN', 245, 'BR', 11],\\n  ['IN', 245, 'ID', 10],\\n  ['US', 130, 'CN', 33],\\n  ['US', 130, 'IN', 23],\\n  ['US', 130, 'US', 9],\\n  ['US', 130, 'ID', 7],\\n  ['US', 130, 'BR', 5],\\n  ['ID', 55, 'BR', 4],\\n  ['ID', 55, 'US', 3],\\n  ['PK', 43, 'FR', 2],\\n  ['PK', 43, 'PK', 2],\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const layout = select('layout', { sunburst: PartitionLayout.sunburst, treemap: PartitionLayout.treemap }, 'sunburst');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onElementListeners}\\n      />\\n      <Partition\\n        id=\\\"pie\\\"\\n        data={pieData}\\n        layout={layout}\\n        valueAccessor={(d) => d[3]}\\n        layers={[\\n          {\\n            groupByRollup: (d: PieDatum) => d[0],\\n            nodeLabel: (d) => `dest: ${d}`,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: PieDatum) => d[2],\\n            nodeLabel: (d) => `source: ${d}`,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalPastel12, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `The \\\\`onElementClick\\\\` receive an argument with the following type definition: \\\\`Array<[Array<LayerValue>, SeriesIdentifier]>\\\\`.\\n\\nUsually the outer array contains only one item but, in a near future, we will group smaller slices into a single one during the interaction.\\n\\nFor every clicked slice, you will have an array of \\\\`LayerValue\\\\`s and a \\\\`SeriesIdentifier\\\\`. The array of \\\\`LayerValues\\\\` is sorted\\nin the same way as the \\\\`layers\\\\` props, and helps you to idenfity the \\\\`groupByRollup\\\\` value and the slice value on every sunburst level.\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":46},\"endLoc\":{\"col\":1,\"line\":82},\"startBody\":{\"col\":36,\"line\":46},\"endBody\":{\"col\":1,\"line\":82}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Position, Settings, Partition, PartitionLayout } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { discreteColor, colorBrewerCategoricalPastel12 } from '../utils/utils';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\ntype PieDatum = [string, number, string, number];\n\nconst pieData: Array<PieDatum> = [\n  ['CN', 301, 'IN', 44],\n  ['CN', 301, 'US', 24],\n  ['CN', 301, 'ID', 13],\n  ['CN', 301, 'BR', 8],\n  ['IN', 245, 'US', 22],\n  ['IN', 245, 'BR', 11],\n  ['IN', 245, 'ID', 10],\n  ['US', 130, 'CN', 33],\n  ['US', 130, 'IN', 23],\n  ['US', 130, 'US', 9],\n  ['US', 130, 'ID', 7],\n  ['US', 130, 'BR', 5],\n  ['ID', 55, 'BR', 4],\n  ['ID', 55, 'US', 3],\n  ['PK', 43, 'FR', 2],\n  ['PK', 43, 'PK', 2],\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const layout = select('layout', { sunburst: PartitionLayout.sunburst, treemap: PartitionLayout.treemap }, 'sunburst');\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n        {...onElementListeners}\n      />\n      <Partition\n        id=\"pie\"\n        data={pieData}\n        layout={layout}\n        valueAccessor={(d) => d[3]}\n        layers={[\n          {\n            groupByRollup: (d: PieDatum) => d[0],\n            nodeLabel: (d) => `dest: ${d}`,\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12, 0.7)(sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: PieDatum) => d[2],\n            nodeLabel: (d) => `source: ${d}`,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalPastel12, 0.5)(node.parent.sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `The \\`onElementClick\\` receive an argument with the following type definition: \\`Array<[Array<LayerValue>, SeriesIdentifier]>\\`.\n\nUsually the outer array contains only one item but, in a near future, we will group smaller slices into a single one during the interaction.\n\nFor every clicked slice, you will have an array of \\`LayerValue\\`s and a \\`SeriesIdentifier\\`. The array of \\`LayerValues\\` is sorted\nin the same way as the \\`layers\\` props, and helps you to idenfity the \\`groupByRollup\\` value and the slice value on every sunburst level.\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const layout = select('layout', { sunburst: PartitionLayout.sunburst, treemap: PartitionLayout.treemap }, 'sunburst');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onElementListeners}\\n      />\\n      <Partition\\n        id=\\\"pie\\\"\\n        data={pieData}\\n        layout={layout}\\n        valueAccessor={(d) => d[3]}\\n        layers={[\\n          {\\n            groupByRollup: (d: PieDatum) => d[0],\\n            nodeLabel: (d) => `dest: ${d}`,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: PieDatum) => d[2],\\n            nodeLabel: (d) => `source: ${d}`,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalPastel12, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { array, boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { BARCHART_2Y2G } from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onLegendItemListeners = {\\n  onLegendItemOver: action('onLegendItemOver'),\\n  onLegendItemOut: action('onLegendItemOut'),\\n  onLegendItemClick: action('onLegendItemClick'),\\n  onLegendItemPlusClick: action('onLegendItemPlusClick'),\\n  onLegendItemMinusClick: action('onLegendItemMinusClick'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const notSpecChange = 'not spec change';\\n  const specChange = 'spec change';\\n\\n  const xDomain = {\\n    min: number('xDomain min', 0, {}, notSpecChange),\\n    max: number('xDomain max', 6, {}, notSpecChange),\\n  };\\n\\n  const yDomain = {\\n    min: number('yDomain min', 0, {}, notSpecChange),\\n    max: number('yDomain max', 10, {}, notSpecChange),\\n  };\\n\\n  const yScaleTypeOptions: { [key: string]: typeof ScaleType.Linear | typeof ScaleType.Log } = {\\n    linear: ScaleType.Linear,\\n    log: ScaleType.Log,\\n  };\\n  const yScaleType = select('yScaleType', yScaleTypeOptions, ScaleType.Linear, specChange);\\n\\n  const xAccessorOptions = { x: 'x', y1: 'y1', y2: 'y2' };\\n  const xAccessor = select('xAccessor', xAccessorOptions, 'x', notSpecChange);\\n\\n  const fit = boolean('fit Y domain', false, specChange);\\n\\n  const splitSeriesAccessors = array('split series accessors', ['g1', 'g2'], ',', specChange);\\n\\n  const hasY2 = boolean('has y2 yAccessor', true, specChange);\\n  const yAccessors = hasY2 ? ['y1', 'y2'] : ['y1'];\\n\\n  const additionalG1Value = { x: 4, g1: '$$$$$$$$', g2: 'indirect-cdn', y1: 7, y2: 3 };\\n  const hasAdditionalG1Value = boolean('has additional g1 value', false, specChange);\\n\\n  const seriesData = BARCHART_2Y2G;\\n\\n  const data = hasAdditionalG1Value ? [...seriesData, additionalG1Value] : seriesData;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onLegendItemListeners}\\n        xDomain={xDomain}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          ...yDomain,\\n          fit,\\n        }}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={xAccessor}\\n        yAccessors={yAccessors}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":97},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":97}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { array, boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { BARCHART_2Y2G } from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onLegendItemListeners = {\n  onLegendItemOver: action('onLegendItemOver'),\n  onLegendItemOut: action('onLegendItemOut'),\n  onLegendItemClick: action('onLegendItemClick'),\n  onLegendItemPlusClick: action('onLegendItemPlusClick'),\n  onLegendItemMinusClick: action('onLegendItemMinusClick'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const notSpecChange = 'not spec change';\n  const specChange = 'spec change';\n\n  const xDomain = {\n    min: number('xDomain min', 0, {}, notSpecChange),\n    max: number('xDomain max', 6, {}, notSpecChange),\n  };\n\n  const yDomain = {\n    min: number('yDomain min', 0, {}, notSpecChange),\n    max: number('yDomain max', 10, {}, notSpecChange),\n  };\n\n  const yScaleTypeOptions: { [key: string]: typeof ScaleType.Linear | typeof ScaleType.Log } = {\n    linear: ScaleType.Linear,\n    log: ScaleType.Log,\n  };\n  const yScaleType = select('yScaleType', yScaleTypeOptions, ScaleType.Linear, specChange);\n\n  const xAccessorOptions = { x: 'x', y1: 'y1', y2: 'y2' };\n  const xAccessor = select('xAccessor', xAccessorOptions, 'x', notSpecChange);\n\n  const fit = boolean('fit Y domain', false, specChange);\n\n  const splitSeriesAccessors = array('split series accessors', ['g1', 'g2'], ',', specChange);\n\n  const hasY2 = boolean('has y2 yAccessor', true, specChange);\n  const yAccessors = hasY2 ? ['y1', 'y2'] : ['y1'];\n\n  const additionalG1Value = { x: 4, g1: '$$$$$$$$', g2: 'indirect-cdn', y1: 7, y2: 3 };\n  const hasAdditionalG1Value = boolean('has additional g1 value', false, specChange);\n\n  const seriesData = BARCHART_2Y2G;\n\n  const data = hasAdditionalG1Value ? [...seriesData, additionalG1Value] : seriesData;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n        {...onLegendItemListeners}\n        xDomain={xDomain}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          ...yDomain,\n          fit,\n        }}\n      />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        xAccessor={xAccessor}\n        yAccessors={yAccessors}\n        splitSeriesAccessors={splitSeriesAccessors}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const notSpecChange = 'not spec change';\\n  const specChange = 'spec change';\\n\\n  const xDomain = {\\n    min: number('xDomain min', 0, {}, notSpecChange),\\n    max: number('xDomain max', 6, {}, notSpecChange),\\n  };\\n\\n  const yDomain = {\\n    min: number('yDomain min', 0, {}, notSpecChange),\\n    max: number('yDomain max', 10, {}, notSpecChange),\\n  };\\n\\n  const yScaleTypeOptions: { [key: string]: typeof ScaleType.Linear | typeof ScaleType.Log } = {\\n    linear: ScaleType.Linear,\\n    log: ScaleType.Log,\\n  };\\n  const yScaleType = select('yScaleType', yScaleTypeOptions, ScaleType.Linear, specChange);\\n\\n  const xAccessorOptions = { x: 'x', y1: 'y1', y2: 'y2' };\\n  const xAccessor = select('xAccessor', xAccessorOptions, 'x', notSpecChange);\\n\\n  const fit = boolean('fit Y domain', false, specChange);\\n\\n  const splitSeriesAccessors = array('split series accessors', ['g1', 'g2'], ',', specChange);\\n\\n  const hasY2 = boolean('has y2 yAccessor', true, specChange);\\n  const yAccessors = hasY2 ? ['y1', 'y2'] : ['y1'];\\n\\n  const additionalG1Value = { x: 4, g1: '$$$$$$$$', g2: 'indirect-cdn', y1: 7, y2: 3 };\\n  const hasAdditionalG1Value = boolean('has additional g1 value', false, specChange);\\n\\n  const seriesData = BARCHART_2Y2G;\\n\\n  const data = hasAdditionalG1Value ? [...seriesData, additionalG1Value] : seriesData;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onLegendItemListeners}\\n        xDomain={xDomain}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          ...yDomain,\\n          fit,\\n        }}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={xAccessor}\\n        yAccessors={yAccessors}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 2, g: 'a' },\\n        { x: 1, y: 7, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 6, g: 'a' },\\n        { x: 0, y: 4, g: 'b' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 2, y: 8, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      baseTheme={useBaseTheme()}\n      legendPosition={Position.Right}\n      onLegendItemClick={action('onLegendItemClick')}\n      onLegendItemOver={action('onLegendItemOver')}\n      onLegendItemOut={action('onLegendItemOut')}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <AreaSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      splitSeriesAccessors={['g']}\n      data={[\n        { x: 0, y: 2, g: 'a' },\n        { x: 1, y: 7, g: 'a' },\n        { x: 2, y: 3, g: 'a' },\n        { x: 3, y: 6, g: 'a' },\n        { x: 0, y: 4, g: 'b' },\n        { x: 1, y: 5, g: 'b' },\n        { x: 2, y: 8, g: 'b' },\n        { x: 3, y: 2, g: 'b' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 2, g: 'a' },\\n        { x: 1, y: 7, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 6, g: 'a' },\\n        { x: 0, y: 4, g: 'b' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 2, y: 8, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <LineSeries\\n      id=\\\"lines1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_BASIS}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines3\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_CARDINAL}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines4\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines5\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_NATURAL}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines6\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.LINEAR}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":116},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":116}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      baseTheme={useBaseTheme()}\n      legendPosition={Position.Right}\n      onLegendItemClick={action('onLegendItemClick')}\n      onLegendItemOver={action('onLegendItemOver')}\n      onLegendItemOut={action('onLegendItemOut')}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <LineSeries\n      id=\"lines1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_MONOTONE_X}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines2\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_BASIS}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines3\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_CARDINAL}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines4\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_CATMULL_ROM}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines5\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_NATURAL}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines6\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.LINEAR}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <LineSeries\\n      id=\\\"lines1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_BASIS}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines3\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_CARDINAL}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines4\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines5\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_NATURAL}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines6\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.LINEAR}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":59},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":59}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      baseTheme={useBaseTheme()}\n      legendPosition={Position.Right}\n      onLegendItemClick={action('onLegendItemClick')}\n      onLegendItemOver={action('onLegendItemOver')}\n      onLegendItemOut={action('onLegendItemOut')}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 3 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 10 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks />\n    <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n    <Axis id=\"top\" position={Position.Top} title=\"top\" showOverlappingTicks />\n    <Axis id=\"right\" title=\"right\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <AreaSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, BrushAxis } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const brushAxisSelect = select(\\n    'brush axis',\\n    {\\n      x: BrushAxis.X,\\n      y: BrushAxis.Y,\\n      both: BrushAxis.Both,\\n    },\\n    BrushAxis.Both,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        brushAxis={brushAxisSelect}\\n        onBrushEnd={action('brush')}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, BrushAxis } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const brushAxisSelect = select(\n    'brush axis',\n    {\n      x: BrushAxis.X,\n      y: BrushAxis.Y,\n      both: BrushAxis.Both,\n    },\n    BrushAxis.Both,\n  );\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        rotation={customKnobs.enum.rotation()}\n        brushAxis={brushAxisSelect}\n        onBrushEnd={action('brush')}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"top\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"right\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const brushAxisSelect = select(\\n    'brush axis',\\n    {\\n      x: BrushAxis.X,\\n      y: BrushAxis.Y,\\n      both: BrushAxis.Both,\\n    },\\n    BrushAxis.Both,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        brushAxis={brushAxisSelect}\\n        onBrushEnd={action('brush')}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Interactions',\n};\n\nexport { Example as barClicksAndHovers } from './1_bar_clicks.story';\nexport { Example as areaPointClicksAndHovers } from './2_area_point_clicks.story';\nexport { Example as linePointClicksAndHovers } from './3_line_point_clicks.story';\nexport { Example as lineAreaBarPointClicksAndHovers } from './4_line_area_bar_clicks.story';\nexport { Example as sunburstSliceClicks } from './4_sunburst_slice_clicks.story';\nexport { Example as clicksHoversOnLegendItemsBarChart } from './5_clicks_legend_items_bar.story';\nexport { Example as clickHoversOnLegendItemsAreaChart } from './6_clicks_legend_items_area.story';\nexport { Example as clickHoversOnLegendItemsLineChart } from './7_clicks_legend_items_line.story';\nexport { Example as clickHoversOnLegendItemsMixedChart } from './8_clicks_legend_items_mixed.story';\nexport { Example as brushSelectionToolOnLinear } from './9_brush_selection_linear.story';\nexport { Example as brushTool } from './9a_brush_selection_linear.story';\n\nexport { Example as brushSelectionToolOnBarChartLinear } from './10_brush_selection_bar.story';\nexport { Example as brushSelectionToolOnBarChartHistogram } from './10a_brush_selection_bar_hist.story';\nexport { Example as brushSelectionToolOnTimeCharts } from './11_brush_time.story';\nexport { Example as brushSelectionToolOnHistogramTimeCharts } from './12_brush_time_hist.story';\nexport { Example as brushDisabledOnOrdinalXAxis } from './13_brush_disabled_ordinal.story';\nexport { Example as crosshairWithTimeAxis } from './14_crosshair_time.story';\nexport { Example as renderChangeAction } from './15_render_change.story';\nexport { Example as cursorUpdateAction } from './16_cursor_update_action.story';\nexport { Example as multiChartCursorSync } from './19_multi_chart_cursor_sync.story';\nexport { Example as interactionWithNullValues } from './18_null_values.story';\nexport { Example as pngExportAction } from './17_png_export.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  LegendStrategy,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n  SeriesIdentifier,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const partitionLayout = select(\\n    'Partition Layout',\\n    {\\n      treemap: PartitionLayout.treemap,\\n      sunburst: PartitionLayout.sunburst,\\n      mosaic: PartitionLayout.mosaic,\\n      waffle: PartitionLayout.waffle,\\n    },\\n    PartitionLayout.sunburst,\\n  );\\n  const flatLegend = boolean('flatLegend', true);\\n  const showLegendExtra = boolean('showLegendExtra', false);\\n  const legendMaxDepth = number('legendMaxDepth', 2, {\\n    min: 0,\\n    max: 3,\\n    step: 1,\\n  });\\n  const legendStrategy = select('legendStrategy', LegendStrategy, LegendStrategy.Key as LegendStrategy);\\n  const maxLines = number('max legend label lines', 1, { min: 0, step: 1 });\\n\\n  const legendSortStrategy = select(\\n    'Custom legend sorting',\\n    { RegionsFirst: 'regionsFirst', ProductsFirst: 'productsFirst', DefaultSort: 'default' },\\n    'regionsFirst',\\n  );\\n\\n  const customLegendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\\n    if (legendSortStrategy === 'regionsFirst') {\\n      if (a.key in regionLookup && b.key in regionLookup) {\\n        return a.key.localeCompare(b.key);\\n      }\\n      return a.key in regionLookup ? -1 : b.key in regionLookup ? 1 : a.key.localeCompare(b.key);\\n    }\\n    if (a.key in productLookup && b.key in productLookup) {\\n      return a.key.localeCompare(b.key);\\n    }\\n    return a.key in productLookup ? -1 : b.key in productLookup ? 1 : a.key.localeCompare(b.key);\\n  };\\n\\n  const partitionTheme: PartialTheme['partition'] = {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  };\\n\\n  const isFlatLegendSupported =\\n    partitionLayout === PartitionLayout.treemap || partitionLayout === PartitionLayout.sunburst;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra={showLegendExtra}\\n        flatLegend={isFlatLegendSupported ? flatLegend : true}\\n        legendStrategy={legendStrategy}\\n        legendMaxDepth={legendMaxDepth}\\n        legendSort={legendSortStrategy !== 'default' ? customLegendSort : undefined}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: partitionTheme,\\n\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        layout={partitionLayout}\\n        data={mocks.miniSunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `To flatten a hierarchical legend (like the rendered in a pie chart or a treemap when using a multi-layer configuration) you can\\nadd the \\\\`flatLegend\\\\` prop into the \\\\`<Settings  baseTheme={useBaseTheme()} />\\\\` component.\\n\\nTo limit displayed hierarchy to a specific depth, you can use the \\\\`legendMaxDepth\\\\` prop. The first layer will have a depth of \\\\`1\\\\`.\\n\\nIt is possible to provide a custom sorting logic for a legend when flattened, when not flattened the \\\\`legendSort\\\\` function is ignored.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":150},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":150}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  LegendStrategy,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n  SeriesIdentifier,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const partitionLayout = select(\n    'Partition Layout',\n    {\n      treemap: PartitionLayout.treemap,\n      sunburst: PartitionLayout.sunburst,\n      mosaic: PartitionLayout.mosaic,\n      waffle: PartitionLayout.waffle,\n    },\n    PartitionLayout.sunburst,\n  );\n  const flatLegend = boolean('flatLegend', true);\n  const showLegendExtra = boolean('showLegendExtra', false);\n  const legendMaxDepth = number('legendMaxDepth', 2, {\n    min: 0,\n    max: 3,\n    step: 1,\n  });\n  const legendStrategy = select('legendStrategy', LegendStrategy, LegendStrategy.Key as LegendStrategy);\n  const maxLines = number('max legend label lines', 1, { min: 0, step: 1 });\n\n  const legendSortStrategy = select(\n    'Custom legend sorting',\n    { RegionsFirst: 'regionsFirst', ProductsFirst: 'productsFirst', DefaultSort: 'default' },\n    'regionsFirst',\n  );\n\n  const customLegendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\n    if (legendSortStrategy === 'regionsFirst') {\n      if (a.key in regionLookup && b.key in regionLookup) {\n        return a.key.localeCompare(b.key);\n      }\n      return a.key in regionLookup ? -1 : b.key in regionLookup ? 1 : a.key.localeCompare(b.key);\n    }\n    if (a.key in productLookup && b.key in productLookup) {\n      return a.key.localeCompare(b.key);\n    }\n    return a.key in productLookup ? -1 : b.key in productLookup ? 1 : a.key.localeCompare(b.key);\n  };\n\n  const partitionTheme: PartialTheme['partition'] = {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  };\n\n  const isFlatLegendSupported =\n    partitionLayout === PartitionLayout.treemap || partitionLayout === PartitionLayout.sunburst;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra={showLegendExtra}\n        flatLegend={isFlatLegendSupported ? flatLegend : true}\n        legendStrategy={legendStrategy}\n        legendMaxDepth={legendMaxDepth}\n        legendSort={legendSortStrategy !== 'default' ? customLegendSort : undefined}\n        baseTheme={useBaseTheme()}\n        theme={{\n          partition: partitionTheme,\n\n          legend: { labelOptions: { maxLines } },\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        layout={partitionLayout}\n        data={mocks.miniSunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: any) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (d: any) => regionLookup[d].regionName,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `To flatten a hierarchical legend (like the rendered in a pie chart or a treemap when using a multi-layer configuration) you can\nadd the \\`flatLegend\\` prop into the \\`<Settings  baseTheme={useBaseTheme()} />\\` component.\n\nTo limit displayed hierarchy to a specific depth, you can use the \\`legendMaxDepth\\` prop. The first layer will have a depth of \\`1\\`.\n\nIt is possible to provide a custom sorting logic for a legend when flattened, when not flattened the \\`legendSort\\` function is ignored.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const partitionLayout = select(\\n    'Partition Layout',\\n    {\\n      treemap: PartitionLayout.treemap,\\n      sunburst: PartitionLayout.sunburst,\\n      mosaic: PartitionLayout.mosaic,\\n      waffle: PartitionLayout.waffle,\\n    },\\n    PartitionLayout.sunburst,\\n  );\\n  const flatLegend = boolean('flatLegend', true);\\n  const showLegendExtra = boolean('showLegendExtra', false);\\n  const legendMaxDepth = number('legendMaxDepth', 2, {\\n    min: 0,\\n    max: 3,\\n    step: 1,\\n  });\\n  const legendStrategy = select('legendStrategy', LegendStrategy, LegendStrategy.Key as LegendStrategy);\\n  const maxLines = number('max legend label lines', 1, { min: 0, step: 1 });\\n\\n  const legendSortStrategy = select(\\n    'Custom legend sorting',\\n    { RegionsFirst: 'regionsFirst', ProductsFirst: 'productsFirst', DefaultSort: 'default' },\\n    'regionsFirst',\\n  );\\n\\n  const customLegendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\\n    if (legendSortStrategy === 'regionsFirst') {\\n      if (a.key in regionLookup && b.key in regionLookup) {\\n        return a.key.localeCompare(b.key);\\n      }\\n      return a.key in regionLookup ? -1 : b.key in regionLookup ? 1 : a.key.localeCompare(b.key);\\n    }\\n    if (a.key in productLookup && b.key in productLookup) {\\n      return a.key.localeCompare(b.key);\\n    }\\n    return a.key in productLookup ? -1 : b.key in productLookup ? 1 : a.key.localeCompare(b.key);\\n  };\\n\\n  const partitionTheme: PartialTheme['partition'] = {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  };\\n\\n  const isFlatLegendSupported =\\n    partitionLayout === PartitionLayout.treemap || partitionLayout === PartitionLayout.sunburst;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra={showLegendExtra}\\n        flatLegend={isFlatLegendSupported ? flatLegend : true}\\n        legendStrategy={legendStrategy}\\n        legendMaxDepth={legendMaxDepth}\\n        legendSort={legendSortStrategy !== 'default' ? customLegendSort : undefined}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: partitionTheme,\\n\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        layout={partitionLayout}\\n        data={mocks.miniSunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, LegendStrategy, Partition, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const flatLegend = boolean('flatLegend', false);\\n  const legendMaxDepth = number('legendMaxDepth', 2, {\\n    min: 0,\\n    max: 3,\\n    step: 1,\\n  });\\n\\n  type TestDatum = { cat1: string; cat2: string; val: number };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend={flatLegend}\\n        legendStrategy={select<LegendStrategy>('legendStrategy', LegendStrategy, LegendStrategy.Key)}\\n        legendMaxDepth={legendMaxDepth}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[\\n          { cat1: 'A', cat2: 'A', val: 1 },\\n          { cat1: 'A', cat2: 'B', val: 1 },\\n          { cat1: 'B', cat2: 'A', val: 1 },\\n          { cat1: 'B', cat2: 'B', val: 1 },\\n          { cat1: 'C', cat2: 'A', val: 1 },\\n          { cat1: 'C', cat2: 'B', val: 1 },\\n        ]}\\n        valueAccessor={(d: TestDatum) => d.val}\\n        layers={[\\n          {\\n            groupByRollup: (d: TestDatum) => d.cat1,\\n          },\\n          {\\n            groupByRollup: (d: TestDatum) => d.cat2,\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `Nested legend with reused node labels means that they can reoccur in various points of the legend tree.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, LegendStrategy, Partition, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const flatLegend = boolean('flatLegend', false);\n  const legendMaxDepth = number('legendMaxDepth', 2, {\n    min: 0,\n    max: 3,\n    step: 1,\n  });\n\n  type TestDatum = { cat1: string; cat2: string; val: number };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        flatLegend={flatLegend}\n        legendStrategy={select<LegendStrategy>('legendStrategy', LegendStrategy, LegendStrategy.Key)}\n        legendMaxDepth={legendMaxDepth}\n        baseTheme={useBaseTheme()}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={[\n          { cat1: 'A', cat2: 'A', val: 1 },\n          { cat1: 'A', cat2: 'B', val: 1 },\n          { cat1: 'B', cat2: 'A', val: 1 },\n          { cat1: 'B', cat2: 'B', val: 1 },\n          { cat1: 'C', cat2: 'A', val: 1 },\n          { cat1: 'C', cat2: 'B', val: 1 },\n        ]}\n        valueAccessor={(d: TestDatum) => d.val}\n        layers={[\n          {\n            groupByRollup: (d: TestDatum) => d.cat1,\n          },\n          {\n            groupByRollup: (d: TestDatum) => d.cat2,\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `Nested legend with reused node labels means that they can reoccur in various points of the legend tree.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const flatLegend = boolean('flatLegend', false);\\n  const legendMaxDepth = number('legendMaxDepth', 2, {\\n    min: 0,\\n    max: 3,\\n    step: 1,\\n  });\\n\\n  type TestDatum = { cat1: string; cat2: string; val: number };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend={flatLegend}\\n        legendStrategy={select<LegendStrategy>('legendStrategy', LegendStrategy, LegendStrategy.Key)}\\n        legendMaxDepth={legendMaxDepth}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[\\n          { cat1: 'A', cat2: 'A', val: 1 },\\n          { cat1: 'A', cat2: 'B', val: 1 },\\n          { cat1: 'B', cat2: 'A', val: 1 },\\n          { cat1: 'B', cat2: 'B', val: 1 },\\n          { cat1: 'C', cat2: 'A', val: 1 },\\n          { cat1: 'C', cat2: 'B', val: 1 },\\n        ]}\\n        valueAccessor={(d: TestDatum) => d.val}\\n        layers={[\\n          {\\n            groupByRollup: (d: TestDatum) => d.cat1,\\n          },\\n          {\\n            groupByRollup: (d: TestDatum) => d.cat2,\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, LegendLabelOptions } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getColorPicker } from '../utils/components/get_color_picker';\\nimport { getLegendAction } from '../utils/components/get_legend_action';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst getLabelOptionKnobs = (): LegendLabelOptions => {\\n  const group = 'Label options';\\n\\n  return {\\n    maxLines: number('max label lines', 1, { min: 0, step: 1 }, group),\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hideActions = boolean('Hide legend action', false, 'Legend');\\n  const showLegendExtra = !boolean('Hide legend extra', false, 'Legend');\\n  const showColorPicker = !boolean('Hide color picker', true, 'Legend');\\n  const legendPosition = customKnobs.enum.position('Legend position', undefined, { group: 'Legend' });\\n  const euiPopoverPosition = customKnobs.enum.euiPopoverPosition(undefined, undefined, { group: 'Legend' });\\n  const labelOptions = getLabelOptionKnobs();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{ legend: { labelOptions } }}\\n        baseTheme={useBaseTheme()}\\n        showLegendExtra={showLegendExtra}\\n        legendPosition={legendPosition}\\n        legendAction={hideActions ? undefined : getLegendAction(euiPopoverPosition)}\\n        legendColorPicker={showColorPicker ? getColorPicker(euiPopoverPosition) : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown:\\n    'The `legendAction` action prop allows you to pass a render function/component that will render next to the legend item.\\\\n\\\\n __Note:__ the context menu, color picker and popover are supplied by [eui](https://elastic.github.io/eui/#).',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":62},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":62}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, LegendLabelOptions } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getColorPicker } from '../utils/components/get_color_picker';\nimport { getLegendAction } from '../utils/components/get_legend_action';\nimport { customKnobs } from '../utils/knobs';\n\nconst getLabelOptionKnobs = (): LegendLabelOptions => {\n  const group = 'Label options';\n\n  return {\n    maxLines: number('max label lines', 1, { min: 0, step: 1 }, group),\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hideActions = boolean('Hide legend action', false, 'Legend');\n  const showLegendExtra = !boolean('Hide legend extra', false, 'Legend');\n  const showColorPicker = !boolean('Hide color picker', true, 'Legend');\n  const legendPosition = customKnobs.enum.position('Legend position', undefined, { group: 'Legend' });\n  const euiPopoverPosition = customKnobs.enum.euiPopoverPosition(undefined, undefined, { group: 'Legend' });\n  const labelOptions = getLabelOptionKnobs();\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{ legend: { labelOptions } }}\n        baseTheme={useBaseTheme()}\n        showLegendExtra={showLegendExtra}\n        legendPosition={legendPosition}\n        legendAction={hideActions ? undefined : getLegendAction(euiPopoverPosition)}\n        legendColorPicker={showColorPicker ? getColorPicker(euiPopoverPosition) : undefined}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        data={TestDatasets.BARCHART_2Y2G}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown:\n    'The `legendAction` action prop allows you to pass a render function/component that will render next to the legend item.\\n\\n __Note:__ the context menu, color picker and popover are supplied by [eui](https://elastic.github.io/eui/#).',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hideActions = boolean('Hide legend action', false, 'Legend');\\n  const showLegendExtra = !boolean('Hide legend extra', false, 'Legend');\\n  const showColorPicker = !boolean('Hide color picker', true, 'Legend');\\n  const legendPosition = customKnobs.enum.position('Legend position', undefined, { group: 'Legend' });\\n  const euiPopoverPosition = customKnobs.enum.euiPopoverPosition(undefined, undefined, { group: 'Legend' });\\n  const labelOptions = getLabelOptionKnobs();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{ legend: { labelOptions } }}\\n        baseTheme={useBaseTheme()}\\n        showLegendExtra={showLegendExtra}\\n        legendPosition={legendPosition}\\n        legendAction={hideActions ? undefined : getLegendAction(euiPopoverPosition)}\\n        legendColorPicker={showColorPicker ? getColorPicker(euiPopoverPosition) : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { BARCHART_1Y1G } from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      theme={{\\n        legend: {\\n          margin: number('legend margins', 20, {\\n            min: 0,\\n          }),\\n          labelOptions: {\\n            maxLines: number('max legend label lines', 2, { min: 0, step: 1 }),\\n          },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={BARCHART_1Y1G}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown:\\n    'The `Theme.chartMargins` does not contain the legend element. Adding legend margins via `Theme.legend.margin` allows adding margins to the Left/right or Top/Bottom of the legend.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { BARCHART_1Y1G } from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      theme={{\n        legend: {\n          margin: number('legend margins', 20, {\n            min: 0,\n          }),\n          labelOptions: {\n            maxLines: number('max legend label lines', 2, { min: 0, step: 1 }),\n          },\n        },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars 1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      data={BARCHART_1Y1G}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown:\n    'The `Theme.chartMargins` does not contain the legend element. Adding legend margins via `Theme.legend.margin` allows adding margins to the Left/right or Top/Bottom of the legend.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      theme={{\\n        legend: {\\n          margin: number('legend margins', 20, {\\n            min: 0,\\n          }),\\n          labelOptions: {\\n            maxLines: number('max legend label lines', 2, { min: 0, step: 1 }),\\n          },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={BARCHART_1Y1G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, boolean, number, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  LegendPositionConfig,\\n  VerticalAlignment,\\n  HorizontalAlignment,\\n  LayoutDirection,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getLegendAction } from '../utils/components/get_legend_action';\\n\\nconst dg = new SeededDataGenerator();\\nconst data = dg.generateGroupedSeries(10, 40);\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const numberOfSeries = number('Number of series', 5, { min: 1, max: 40, step: 1, range: true });\\n  const seriesWithLongName = number('Series with long name', 3, {\\n    min: 0,\\n    max: numberOfSeries - 1,\\n    step: 1,\\n    range: true,\\n  });\\n\\n  const floating: LegendPositionConfig['floating'] = boolean('Inside chart', true, 'Legend');\\n  const showAction = boolean('Show legend action', false, 'Legend');\\n  const floatingColumns: LegendPositionConfig['floatingColumns'] = number(\\n    'floating columns',\\n    2,\\n    { min: 1, max: 10, range: true, step: 1 },\\n    'Legend',\\n  );\\n  const vAlign: LegendPositionConfig['vAlign'] = select(\\n    'vAlign',\\n    {\\n      [Position.Top]: VerticalAlignment.Top,\\n      // not yet implemented\\n      // [VerticalAlignment.Middle]: VerticalAlignment.Middle,\\n      [Position.Bottom]: VerticalAlignment.Bottom,\\n    },\\n    Position.Bottom,\\n    'Legend',\\n  );\\n\\n  const hAlign: LegendPositionConfig['hAlign'] = select(\\n    'hAlign',\\n    {\\n      [Position.Left]: HorizontalAlignment.Left,\\n      // not yet implemented\\n      // [HorizontalAlignment.Center]: HorizontalAlignment.Center,\\n      [Position.Right]: HorizontalAlignment.Right,\\n    },\\n    Position.Right,\\n    'Legend',\\n  );\\n  const direction: LegendPositionConfig['direction'] = select(\\n    'direction',\\n    {\\n      ...LayoutDirection,\\n    },\\n    LayoutDirection.Vertical,\\n    'Legend',\\n  );\\n  const maxLines = number('max label lines', 1, { min: 0, step: 1 }, 'Legend');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={{\\n          vAlign,\\n          hAlign,\\n          direction,\\n          floating,\\n          floatingColumns,\\n        }}\\n        legendAction={showAction ? getLegendAction() : undefined}\\n        theme={{\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data.slice(0, numberOfSeries * 10).map((d, i) => {\\n          if (i >= seriesWithLongName * 10 && i < seriesWithLongName * 10 + 10) {\\n            return {\\n              ...d,\\n              g: text('long label', 'long name', 'Legend'),\\n            };\\n          }\\n          return d;\\n        })}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, boolean, number, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  LegendPositionConfig,\n  VerticalAlignment,\n  HorizontalAlignment,\n  LayoutDirection,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getLegendAction } from '../utils/components/get_legend_action';\n\nconst dg = new SeededDataGenerator();\nconst data = dg.generateGroupedSeries(10, 40);\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const numberOfSeries = number('Number of series', 5, { min: 1, max: 40, step: 1, range: true });\n  const seriesWithLongName = number('Series with long name', 3, {\n    min: 0,\n    max: numberOfSeries - 1,\n    step: 1,\n    range: true,\n  });\n\n  const floating: LegendPositionConfig['floating'] = boolean('Inside chart', true, 'Legend');\n  const showAction = boolean('Show legend action', false, 'Legend');\n  const floatingColumns: LegendPositionConfig['floatingColumns'] = number(\n    'floating columns',\n    2,\n    { min: 1, max: 10, range: true, step: 1 },\n    'Legend',\n  );\n  const vAlign: LegendPositionConfig['vAlign'] = select(\n    'vAlign',\n    {\n      [Position.Top]: VerticalAlignment.Top,\n      // not yet implemented\n      // [VerticalAlignment.Middle]: VerticalAlignment.Middle,\n      [Position.Bottom]: VerticalAlignment.Bottom,\n    },\n    Position.Bottom,\n    'Legend',\n  );\n\n  const hAlign: LegendPositionConfig['hAlign'] = select(\n    'hAlign',\n    {\n      [Position.Left]: HorizontalAlignment.Left,\n      // not yet implemented\n      // [HorizontalAlignment.Center]: HorizontalAlignment.Center,\n      [Position.Right]: HorizontalAlignment.Right,\n    },\n    Position.Right,\n    'Legend',\n  );\n  const direction: LegendPositionConfig['direction'] = select(\n    'direction',\n    {\n      ...LayoutDirection,\n    },\n    LayoutDirection.Vertical,\n    'Legend',\n  );\n  const maxLines = number('max label lines', 1, { min: 0, step: 1 }, 'Legend');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={{\n          vAlign,\n          hAlign,\n          direction,\n          floating,\n          floatingColumns,\n        }}\n        legendAction={showAction ? getLegendAction() : undefined}\n        theme={{\n          legend: { labelOptions: { maxLines } },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data.slice(0, numberOfSeries * 10).map((d, i) => {\n          if (i >= seriesWithLongName * 10 && i < seriesWithLongName * 10 + 10) {\n            return {\n              ...d,\n              g: text('long label', 'long name', 'Legend'),\n            };\n          }\n          return d;\n        })}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const numberOfSeries = number('Number of series', 5, { min: 1, max: 40, step: 1, range: true });\\n  const seriesWithLongName = number('Series with long name', 3, {\\n    min: 0,\\n    max: numberOfSeries - 1,\\n    step: 1,\\n    range: true,\\n  });\\n\\n  const floating: LegendPositionConfig['floating'] = boolean('Inside chart', true, 'Legend');\\n  const showAction = boolean('Show legend action', false, 'Legend');\\n  const floatingColumns: LegendPositionConfig['floatingColumns'] = number(\\n    'floating columns',\\n    2,\\n    { min: 1, max: 10, range: true, step: 1 },\\n    'Legend',\\n  );\\n  const vAlign: LegendPositionConfig['vAlign'] = select(\\n    'vAlign',\\n    {\\n      [Position.Top]: VerticalAlignment.Top,\\n      // not yet implemented\\n      // [VerticalAlignment.Middle]: VerticalAlignment.Middle,\\n      [Position.Bottom]: VerticalAlignment.Bottom,\\n    },\\n    Position.Bottom,\\n    'Legend',\\n  );\\n\\n  const hAlign: LegendPositionConfig['hAlign'] = select(\\n    'hAlign',\\n    {\\n      [Position.Left]: HorizontalAlignment.Left,\\n      // not yet implemented\\n      // [HorizontalAlignment.Center]: HorizontalAlignment.Center,\\n      [Position.Right]: HorizontalAlignment.Right,\\n    },\\n    Position.Right,\\n    'Legend',\\n  );\\n  const direction: LegendPositionConfig['direction'] = select(\\n    'direction',\\n    {\\n      ...LayoutDirection,\\n    },\\n    LayoutDirection.Vertical,\\n    'Legend',\\n  );\\n  const maxLines = number('max label lines', 1, { min: 0, step: 1 }, 'Legend');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={{\\n          vAlign,\\n          hAlign,\\n          direction,\\n          floating,\\n          floatingColumns,\\n        }}\\n        legendAction={showAction ? getLegendAction() : undefined}\\n        theme={{\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data.slice(0, numberOfSeries * 10).map((d, i) => {\\n          if (i >= seriesWithLongName * 10 && i < seriesWithLongName * 10 + 10) {\\n            return {\\n              ...d,\\n              g: text('long label', 'long name', 'Legend'),\\n            };\\n          }\\n          return d;\\n        })}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { BarSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rng = getRandomNumberGenerator();\\n  const maxLines = number('max label lines', 0, { min: 0, step: 1 });\\n  const seriesCount = number('series count', 1, { min: 1, step: 1 });\\n  const data = [\\n    { x: 0, y: 2 },\\n    { x: 1, y: 7 },\\n    { x: 2, y: 3 },\\n    { x: 3, y: 6 },\\n  ];\\n  const renderMoreSeries = () => {\\n    const series: JSX.Element[] = [];\\n\\n    for (let i = 1; i < seriesCount; i++) {\\n      series.push(\\n        <BarSeries\\n          id={`bars${i}`}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          name={`Another long series name - ${i}`}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          data={data.map(({ x, y }) => ({ x, y: y + rng(0, 5) }))}\\n        />,\\n      );\\n    }\\n\\n    return series;\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position('legend position', 'top')}\\n        theme={{\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <BarSeries\\n        id=\\\"bars0\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        name=\\\"Id elit mollit ut est laborum. Lorem laboris laboris laboris quis dolore incididunt eiusmod fugiat nulla culpa dolore exercitation dolore. Voluptate ipsum cillum cillum in ullamco elit eiusmod labore incididunt excepteur. Duis id laboris consequat aliqua officia non ex nisi commodo. Ut do do voluptate sunt sunt cupidatat ea ad.\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={data}\\n      />\\n      {renderMoreSeries()}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":71},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":71}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { BarSeries, Chart, ScaleType, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rng = getRandomNumberGenerator();\n  const maxLines = number('max label lines', 0, { min: 0, step: 1 });\n  const seriesCount = number('series count', 1, { min: 1, step: 1 });\n  const data = [\n    { x: 0, y: 2 },\n    { x: 1, y: 7 },\n    { x: 2, y: 3 },\n    { x: 3, y: 6 },\n  ];\n  const renderMoreSeries = () => {\n    const series: JSX.Element[] = [];\n\n    for (let i = 1; i < seriesCount; i++) {\n      series.push(\n        <BarSeries\n          id={`bars${i}`}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          name={`Another long series name - ${i}`}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          data={data.map(({ x, y }) => ({ x, y: y + rng(0, 5) }))}\n        />,\n      );\n    }\n\n    return series;\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={customKnobs.enum.position('legend position', 'top')}\n        theme={{\n          legend: { labelOptions: { maxLines } },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <BarSeries\n        id=\"bars0\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        name=\"Id elit mollit ut est laborum. Lorem laboris laboris laboris quis dolore incididunt eiusmod fugiat nulla culpa dolore exercitation dolore. Voluptate ipsum cillum cillum in ullamco elit eiusmod labore incididunt excepteur. Duis id laboris consequat aliqua officia non ex nisi commodo. Ut do do voluptate sunt sunt cupidatat ea ad.\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={data}\n      />\n      {renderMoreSeries()}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rng = getRandomNumberGenerator();\\n  const maxLines = number('max label lines', 0, { min: 0, step: 1 });\\n  const seriesCount = number('series count', 1, { min: 1, step: 1 });\\n  const data = [\\n    { x: 0, y: 2 },\\n    { x: 1, y: 7 },\\n    { x: 2, y: 3 },\\n    { x: 3, y: 6 },\\n  ];\\n  const renderMoreSeries = () => {\\n    const series: JSX.Element[] = [];\\n\\n    for (let i = 1; i < seriesCount; i++) {\\n      series.push(\\n        <BarSeries\\n          id={`bars${i}`}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          name={`Another long series name - ${i}`}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          data={data.map(({ x, y }) => ({ x, y: y + rng(0, 5) }))}\\n        />,\\n      );\\n    }\\n\\n    return series;\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position('legend position', 'top')}\\n        theme={{\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <BarSeries\\n        id=\\\"bars0\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        name=\\\"Id elit mollit ut est laborum. Lorem laboris laboris laboris quis dolore incididunt eiusmod fugiat nulla culpa dolore exercitation dolore. Voluptate ipsum cillum cillum in ullamco elit eiusmod labore incididunt excepteur. Duis id laboris consequat aliqua officia non ex nisi commodo. Ut do do voluptate sunt sunt cupidatat ea ad.\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={data}\\n      />\\n      {renderMoreSeries()}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { XYChartSeriesIdentifier } from '../../../packages/charts/src/chart_types/xy_chart/utils/series';\\nimport { SeriesIdentifier } from '../../../packages/charts/src/common/series_id';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data: Array<[number, string, number]> = [\\n    [2010, 'Apple', 10],\\n    [2010, 'Orange', 6],\\n    [2010, 'Banana', 4],\\n    [2011, 'Apple', 9],\\n    [2011, 'Orange', 6],\\n    [2011, 'Banana', 2],\\n    [2012, 'Apple', 7],\\n    [2012, 'Orange', 3],\\n    [2012, 'Banana', 3],\\n    [2013, 'Apple', 12],\\n    [2013, 'Orange', 10],\\n    [2013, 'Banana', 5],\\n  ];\\n  // the sorting value can be part of the dataset or externally defined\\n  const categoricalIndex: Array<unknown> = ['Apple', 'Orange', 'Banana'];\\n\\n  const reverseSort = boolean('reverse', true);\\n  const defaultSort = boolean('default sort', false);\\n\\n  const legendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\\n    // extract the value from the accessors to identify the current selected series\\n    // the SeriesIdentifier can be casted to the chart type specific one\\n    const categoryA = (a as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\\n    const categoryB = (b as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\\n    // find the index of each series\\n    const catAIndex = categoricalIndex.indexOf(categoryA);\\n    const catBIndex = categoricalIndex.indexOf(categoryB);\\n    // compare the indices and return the order\\n    return reverseSort ? catAIndex - catBIndex : catBIndex - catAIndex;\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} legendSort={defaultSort ? undefined : legendSort} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"[2010-2013] harvest\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} ticks={4} tickFormat={(d) => `${d} tons`} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[2]}\\n        splitSeriesAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data}\\n        yNice\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":70},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":70}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { XYChartSeriesIdentifier } from '../../../packages/charts/src/chart_types/xy_chart/utils/series';\nimport { SeriesIdentifier } from '../../../packages/charts/src/common/series_id';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data: Array<[number, string, number]> = [\n    [2010, 'Apple', 10],\n    [2010, 'Orange', 6],\n    [2010, 'Banana', 4],\n    [2011, 'Apple', 9],\n    [2011, 'Orange', 6],\n    [2011, 'Banana', 2],\n    [2012, 'Apple', 7],\n    [2012, 'Orange', 3],\n    [2012, 'Banana', 3],\n    [2013, 'Apple', 12],\n    [2013, 'Orange', 10],\n    [2013, 'Banana', 5],\n  ];\n  // the sorting value can be part of the dataset or externally defined\n  const categoricalIndex: Array<unknown> = ['Apple', 'Orange', 'Banana'];\n\n  const reverseSort = boolean('reverse', true);\n  const defaultSort = boolean('default sort', false);\n\n  const legendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\n    // extract the value from the accessors to identify the current selected series\n    // the SeriesIdentifier can be casted to the chart type specific one\n    const categoryA = (a as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\n    const categoryB = (b as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\n    // find the index of each series\n    const catAIndex = categoricalIndex.indexOf(categoryA);\n    const catBIndex = categoricalIndex.indexOf(categoryB);\n    // compare the indices and return the order\n    return reverseSort ? catAIndex - catBIndex : catBIndex - catAIndex;\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend baseTheme={useBaseTheme()} legendSort={defaultSort ? undefined : legendSort} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"[2010-2013] harvest\" showOverlappingTicks />\n      <Axis id=\"left2\" position={Position.Left} ticks={4} tickFormat={(d) => `${d} tons`} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[2]}\n        splitSeriesAccessors={[1]}\n        stackAccessors={[0]}\n        data={data}\n        yNice\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data: Array<[number, string, number]> = [\\n    [2010, 'Apple', 10],\\n    [2010, 'Orange', 6],\\n    [2010, 'Banana', 4],\\n    [2011, 'Apple', 9],\\n    [2011, 'Orange', 6],\\n    [2011, 'Banana', 2],\\n    [2012, 'Apple', 7],\\n    [2012, 'Orange', 3],\\n    [2012, 'Banana', 3],\\n    [2013, 'Apple', 12],\\n    [2013, 'Orange', 10],\\n    [2013, 'Banana', 5],\\n  ];\\n  // the sorting value can be part of the dataset or externally defined\\n  const categoricalIndex: Array<unknown> = ['Apple', 'Orange', 'Banana'];\\n\\n  const reverseSort = boolean('reverse', true);\\n  const defaultSort = boolean('default sort', false);\\n\\n  const legendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\\n    // extract the value from the accessors to identify the current selected series\\n    // the SeriesIdentifier can be casted to the chart type specific one\\n    const categoryA = (a as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\\n    const categoryB = (b as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\\n    // find the index of each series\\n    const catAIndex = categoricalIndex.indexOf(categoryA);\\n    const catBIndex = categoricalIndex.indexOf(categoryB);\\n    // compare the indices and return the order\\n    return reverseSort ? catAIndex - catBIndex : catBIndex - catAIndex;\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} legendSort={defaultSort ? undefined : legendSort} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"[2010-2013] harvest\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} ticks={4} tickFormat={(d) => `${d} tons`} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[2]}\\n        splitSeriesAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data}\\n        yNice\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  AreaSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  CustomLegend,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\nconst data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\\n  ...d,\\n  KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\\n]);\\nconst data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\\n  ...d,\\n  KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\\n]);\\nconst data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\\n  ...d,\\n  KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\\n]);\\nconst allMetrics = [...data3, ...data2, ...data1];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customLegend: CustomLegend = ({ items, pointerValue }) => (\\n    <div style={{ width: '100%', position: 'relative' }}>\\n      <p style={{ height: '1.5em' }}>{pointerValue ? moment(pointerValue?.value).format('HH:mm') : 'System Load'}</p>\\n      {items.map((i) => (\\n        <button\\n          key={i.seriesIdentifiers[0].key}\\n          onMouseOver={i.onItemOverActon}\\n          onMouseOut={i.onItemOutAction}\\n          onClick={() => i.onItemClickAction(false)}\\n          style={{ display: 'block', color: i.isSeriesHidden ? 'gray' : i.color }}\\n        >\\n          {i.label} {i.extraValue?.formatted}\\n        </button>\\n      ))}\\n    </div>\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n        customLegend={customLegend}\\n        legendSize={100} // always specify a fixed size for a custom legend\\n      />\\n      <Tooltip customTooltip={() => null} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis id=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} ticks={5} />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        splitSeriesAccessors={[2]}\\n        data={allMetrics}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `When using a custom legend, please always specify a fixed \\\\`legendSize\\\\` in the \\\\`Settings\\\\` prop to avoid a wrongly computed default legend size.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":43},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":43},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment';\nimport React from 'react';\n\nimport {\n  Axis,\n  AreaSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  CustomLegend,\n  Tooltip,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\nconst data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\n  ...d,\n  KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\n]);\nconst data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\n  ...d,\n  KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\n]);\nconst data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\n  ...d,\n  KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\n]);\nconst allMetrics = [...data3, ...data2, ...data1];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customLegend: CustomLegend = ({ items, pointerValue }) => (\n    <div style={{ width: '100%', position: 'relative' }}>\n      <p style={{ height: '1.5em' }}>{pointerValue ? moment(pointerValue?.value).format('HH:mm') : 'System Load'}</p>\n      {items.map((i) => (\n        <button\n          key={i.seriesIdentifiers[0].key}\n          onMouseOver={i.onItemOverActon}\n          onMouseOut={i.onItemOutAction}\n          onClick={() => i.onItemClickAction(false)}\n          style={{ display: 'block', color: i.isSeriesHidden ? 'gray' : i.color }}\n        >\n          {i.label} {i.extraValue?.formatted}\n        </button>\n      ))}\n    </div>\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        baseTheme={useBaseTheme()}\n        customLegend={customLegend}\n        legendSize={100} // always specify a fixed size for a custom legend\n      />\n      <Tooltip customTooltip={() => null} />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n      <Axis id=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} ticks={5} />\n      <AreaSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        splitSeriesAccessors={[2]}\n        data={allMetrics}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `When using a custom legend, please always specify a fixed \\`legendSize\\` in the \\`Settings\\` prop to avoid a wrongly computed default legend size.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customLegend: CustomLegend = ({ items, pointerValue }) => (\\n    <div style={{ width: '100%', position: 'relative' }}>\\n      <p style={{ height: '1.5em' }}>{pointerValue ? moment(pointerValue?.value).format('HH:mm') : 'System Load'}</p>\\n      {items.map((i) => (\\n        <button\\n          key={i.seriesIdentifiers[0].key}\\n          onMouseOver={i.onItemOverActon}\\n          onMouseOut={i.onItemOutAction}\\n          onClick={() => i.onItemClickAction(false)}\\n          style={{ display: 'block', color: i.isSeriesHidden ? 'gray' : i.color }}\\n        >\\n          {i.label} {i.extraValue?.formatted}\\n        </button>\\n      ))}\\n    </div>\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n        customLegend={customLegend}\\n        legendSize={100} // always specify a fixed size for a custom legend\\n      />\\n      <Tooltip customTooltip={() => null} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis id=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} ticks={5} />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        splitSeriesAccessors={[2]}\\n        data={allMetrics}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { getLegendSizeKnob } from './legend_size_knob';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position()}\\n        rotation={customKnobs.enum.rotation()}\\n        baseTheme={useBaseTheme()}\\n        legendSize={getLegendSizeKnob()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n        hideInLegend={false}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { getLegendSizeKnob } from './legend_size_knob';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={customKnobs.enum.position()}\n        rotation={customKnobs.enum.rotation()}\n        baseTheme={useBaseTheme()}\n        legendSize={getLegendSizeKnob()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        data={TestDatasets.BARCHART_2Y2G}\n        hideInLegend={false}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position()}\\n        rotation={customKnobs.enum.rotation()}\\n        baseTheme={useBaseTheme()}\\n        legendSize={getLegendSizeKnob()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n        hideInLegend={false}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const splitSeries = boolean('split series', true) ? ['g1', 'g2'] : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Top} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={splitSeries}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const splitSeries = boolean('split series', true) ? ['g1', 'g2'] : undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Top} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={splitSeries}\n        data={TestDatasets.BARCHART_2Y2G}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const splitSeries = boolean('split series', true) ? ['g1', 'g2'] : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Top} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={splitSeries}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hideBarSeriesInLegend = boolean('hide bar series in legend', false);\\n  const hideLineSeriesInLegend = boolean('hide line series in legend', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n        hideInLegend={hideBarSeriesInLegend}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n        hideInLegend={hideLineSeriesInLegend}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hideBarSeriesInLegend = boolean('hide bar series in legend', false);\n  const hideLineSeriesInLegend = boolean('hide line series in legend', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n        hideInLegend={hideBarSeriesInLegend}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n        hideInLegend={hideLineSeriesInLegend}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hideBarSeriesInLegend = boolean('hide bar series in legend', false);\\n  const hideLineSeriesInLegend = boolean('hide line series in legend', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n        hideInLegend={hideBarSeriesInLegend}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n        hideInLegend={hideLineSeriesInLegend}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    legend: {\\n      spacingBuffer: number('legend buffer value', 80),\\n      labelOptions: {\\n        maxLines: number('max legend label lines', 0, { min: 0, step: 1 }),\\n      },\\n    },\\n  };\\n  const longLabels = boolean('use long labels', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={longLabels ? 'Elit exercitation dolore fugiat aliquip Lorem commodo' : 'bars 1'}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 100000000 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <BarSeries\\n        id={\\n          longLabels\\n            ? 'Laborum consectetur ut esse aute sunt adipisicing laboris reprehenderit eu officia labore in laborum'\\n            : 'bars 2'\\n        }\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 100000000 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    legend: {\n      spacingBuffer: number('legend buffer value', 80),\n      labelOptions: {\n        maxLines: number('max legend label lines', 0, { min: 0, step: 1 }),\n      },\n    },\n  };\n  const longLabels = boolean('use long labels', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id={longLabels ? 'Elit exercitation dolore fugiat aliquip Lorem commodo' : 'bars 1'}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 100000000 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <BarSeries\n        id={\n          longLabels\n            ? 'Laborum consectetur ut esse aute sunt adipisicing laboris reprehenderit eu officia labore in laborum'\n            : 'bars 2'\n        }\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 100000000 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    legend: {\\n      spacingBuffer: number('legend buffer value', 80),\\n      labelOptions: {\\n        maxLines: number('max legend label lines', 0, { min: 0, step: 1 }),\\n      },\\n    },\\n  };\\n  const longLabels = boolean('use long labels', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={longLabels ? 'Elit exercitation dolore fugiat aliquip Lorem commodo' : 'bars 1'}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 100000000 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <BarSeries\\n        id={\\n          longLabels\\n            ? 'Laborum consectetur ut esse aute sunt adipisicing laboris reprehenderit eu officia labore in laborum'\\n            : 'bars 2'\\n        }\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 100000000 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React, { useState, useMemo } from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  LegendColorPicker,\\n  Color,\\n  SeriesKey,\\n  toEntries,\\n} from '@elastic/charts';\\nimport { BARCHART_1Y1G } from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getColorPicker } from '../utils/components/get_color_picker';\\nimport { getLegendAction } from '../utils/components/get_legend_action';\\n\\nconst onChangeAction = action('onChange');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const [colors, setColors] = useState<Record<SeriesKey, Color | null>>({});\\n  const showAction = boolean('show legend action', false);\\n\\n  const CustomColorPicker: LegendColorPicker = useMemo(\\n    () =>\\n      ({ anchor, color, onClose, seriesIdentifiers, onChange }) => {\\n        const handleClose = () => {\\n          onClose();\\n          setColors((prevColors) => ({\\n            ...prevColors,\\n            ...toEntries(seriesIdentifiers, 'key', color),\\n          }));\\n        };\\n        const handleChange = (c: Color | null) => {\\n          setColors((prevColors) => ({\\n            ...prevColors,\\n            ...toEntries(seriesIdentifiers, 'key', c),\\n          }));\\n          onChange(c);\\n          onChangeAction(c);\\n        };\\n\\n        return getColorPicker()({\\n          anchor,\\n          color,\\n          onClose: handleClose,\\n          onChange: handleChange,\\n          seriesIdentifiers,\\n        });\\n      },\\n    [setColors],\\n  );\\n  CustomColorPicker.displayName = 'CustomColorPicker';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        legendColorPicker={CustomColorPicker}\\n        baseTheme={useBaseTheme()}\\n        legendAction={showAction ? getLegendAction() : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={BARCHART_1Y1G}\\n        color={({ key }) => colors[key] ?? null}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown:\\n    'Elastic charts will maintain the color selection in memory beyond chart updates. However, to persist colors beyond browser refresh the consumer would need to manage the color state and use the color prop on the SeriesSpec to assign a color via a SeriesColorAccessor.\\\\n\\\\n __Note:__ the context menu, color picker and popover are supplied by [eui](https://elastic.github.io/eui/#).',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React, { useState, useMemo } from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  LegendColorPicker,\n  Color,\n  SeriesKey,\n  toEntries,\n} from '@elastic/charts';\nimport { BARCHART_1Y1G } from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getColorPicker } from '../utils/components/get_color_picker';\nimport { getLegendAction } from '../utils/components/get_legend_action';\n\nconst onChangeAction = action('onChange');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const [colors, setColors] = useState<Record<SeriesKey, Color | null>>({});\n  const showAction = boolean('show legend action', false);\n\n  const CustomColorPicker: LegendColorPicker = useMemo(\n    () =>\n      ({ anchor, color, onClose, seriesIdentifiers, onChange }) => {\n        const handleClose = () => {\n          onClose();\n          setColors((prevColors) => ({\n            ...prevColors,\n            ...toEntries(seriesIdentifiers, 'key', color),\n          }));\n        };\n        const handleChange = (c: Color | null) => {\n          setColors((prevColors) => ({\n            ...prevColors,\n            ...toEntries(seriesIdentifiers, 'key', c),\n          }));\n          onChange(c);\n          onChangeAction(c);\n        };\n\n        return getColorPicker()({\n          anchor,\n          color,\n          onClose: handleClose,\n          onChange: handleChange,\n          seriesIdentifiers,\n        });\n      },\n    [setColors],\n  );\n  CustomColorPicker.displayName = 'CustomColorPicker';\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        legendColorPicker={CustomColorPicker}\n        baseTheme={useBaseTheme()}\n        legendAction={showAction ? getLegendAction() : undefined}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={BARCHART_1Y1G}\n        color={({ key }) => colors[key] ?? null}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown:\n    'Elastic charts will maintain the color selection in memory beyond chart updates. However, to persist colors beyond browser refresh the consumer would need to manage the color state and use the color prop on the SeriesSpec to assign a color via a SeriesColorAccessor.\\n\\n __Note:__ the context menu, color picker and popover are supplied by [eui](https://elastic.github.io/eui/#).',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const [colors, setColors] = useState<Record<SeriesKey, Color | null>>({});\\n  const showAction = boolean('show legend action', false);\\n\\n  const CustomColorPicker: LegendColorPicker = useMemo(\\n    () =>\\n      ({ anchor, color, onClose, seriesIdentifiers, onChange }) => {\\n        const handleClose = () => {\\n          onClose();\\n          setColors((prevColors) => ({\\n            ...prevColors,\\n            ...toEntries(seriesIdentifiers, 'key', color),\\n          }));\\n        };\\n        const handleChange = (c: Color | null) => {\\n          setColors((prevColors) => ({\\n            ...prevColors,\\n            ...toEntries(seriesIdentifiers, 'key', c),\\n          }));\\n          onChange(c);\\n          onChangeAction(c);\\n        };\\n\\n        return getColorPicker()({\\n          anchor,\\n          color,\\n          onClose: handleClose,\\n          onChange: handleChange,\\n          seriesIdentifiers,\\n        });\\n      },\\n    [setColors],\\n  );\\n  CustomColorPicker.displayName = 'CustomColorPicker';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        legendColorPicker={CustomColorPicker}\\n        baseTheme={useBaseTheme()}\\n        legendAction={showAction ? getLegendAction() : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={BARCHART_1Y1G}\\n        color={({ key }) => colors[key] ?? null}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Legend',\n};\n\nexport { Example as positioning } from './1_legend_positioning.story';\nexport { Example as insideChart } from './13_inside_chart.story';\nexport { Example as changingSpecs } from './5_changing_specs.story';\nexport { Example as hideLegendItemsBySeries } from './6_hide_legend.story';\nexport { Example as legendSpacingBuffer } from './8_spacing_buffer.story';\nexport { Example as colorPicker } from './9_color_picker.story';\nexport { Example as piechart } from './10_sunburst.story';\nexport { Example as piechartRepeatedLabels } from './10_sunburst_repeated_label.story';\nexport { Example as actions } from './11_legend_actions.story';\nexport { Example as margins } from './12_legend_margins.story';\nexport { Example as singleSeries } from './14_single_series.story';\nexport { Example as sortItems } from './15_legend_sort.story';\nexport { Example as customLegend } from './16_custom_legend.story';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\n\nexport const getLegendSizeKnob = (group?: string) => {\n  const enabled = boolean('enable legend size', false, group);\n  const size = enabled ? number('legend size', 200, { min: 0, step: 1 }, group) : NaN;\n  return size;\n};\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { shuffle } from 'lodash';\\nimport React from 'react';\\n\\nimport { Axis, LineSeries, Chart, Position, ScaleType, Settings, Direction } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n/**\\n * Data to defined consistent order of series when using shuffle\\n */\\nconst data1 = [\\n  // DestAirportID: Descending\\tCarrier: Descending\\tMax AvgTicketPrice\\tAverage AvgTicketPrice\\tTest\\n  { x: 'XIY', g: 'JetBeats', y1: 1195.87316894531, y2: 735.960746071555, z: 735.960746071555 },\\n  { x: 'XIY', g: 'Kibana Airlines', y1: 1079.14624023438, y2: 742.831329345703, z: 742.831329345703 },\\n  { x: 'XIY', g: 'ES-Air', y1: 929.561462402344, y2: 765.738806152344, z: 765.738806152344 },\\n  { x: 'XIY', g: 'Logstash Airways', y1: 836.307922363281, y2: 487.398278808594, z: 487.398278808594 },\\n];\\n\\nconst data2 = [\\n  { x: 'XHBU', g: 'JetBeats', y1: 1193.38342285156, y2: 702.543407440186, z: 702.543407440186 },\\n  { x: 'XHBU', g: 'Kibana Airlines', y1: 1159.03503417969, y2: 606.558886210124, z: 606.558886210124 },\\n  { x: 'XHBU', g: 'ES-Air', y1: 996.849731445313, y2: 752.394683837891, z: 752.394683837891 },\\n  { x: 'XHBU', g: 'Logstash Airways', y1: 909.167602539063, y2: 564.171913146973, z: 564.171913146973 },\\n  { x: 'NGO', g: 'ES-Air', y1: 1189.08776855469, y2: 1189.08776855469, z: 1189.08776855469 },\\n  { x: 'SCL', g: 'Logstash Airways', y1: 1176.63818359375, y2: 1031.0576171875, z: 1031.0576171875 },\\n  { x: 'VE05', g: 'Kibana Airlines', y1: 1189.53845214844, y2: 563.195382859972, z: 563.195382859972 },\\n  { x: 'VE05', g: 'Logstash Airways', y1: 998.839538574219, y2: 467.636221313477, z: 467.636221313477 },\\n  { x: 'VE05', g: 'JetBeats', y1: 900.798461914063, y2: 569.146169026693, z: 569.146169026693 },\\n  { x: 'VE05', g: 'ES-Air', y1: 820.462463378906, y2: 541.392608642578, z: 541.392608642578 },\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        orderOrdinalBinsBy={\\n          orderOrdinalBinsBy\\n            ? {\\n                direction: Direction.Descending,\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\\n\\n      <LineSeries\\n        id=\\\"bars1\\\"\\n        fit=\\\"linear\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={boolean('Stacked', true) ? ['g'] : undefined}\\n        data={[...data1, ...(orderOrdinalBinsBy ? shuffle(data2) : data2)]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport { shuffle } from 'lodash';\nimport React from 'react';\n\nimport { Axis, LineSeries, Chart, Position, ScaleType, Settings, Direction } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n/**\n * Data to defined consistent order of series when using shuffle\n */\nconst data1 = [\n  // DestAirportID: Descending\tCarrier: Descending\tMax AvgTicketPrice\tAverage AvgTicketPrice\tTest\n  { x: 'XIY', g: 'JetBeats', y1: 1195.87316894531, y2: 735.960746071555, z: 735.960746071555 },\n  { x: 'XIY', g: 'Kibana Airlines', y1: 1079.14624023438, y2: 742.831329345703, z: 742.831329345703 },\n  { x: 'XIY', g: 'ES-Air', y1: 929.561462402344, y2: 765.738806152344, z: 765.738806152344 },\n  { x: 'XIY', g: 'Logstash Airways', y1: 836.307922363281, y2: 487.398278808594, z: 487.398278808594 },\n];\n\nconst data2 = [\n  { x: 'XHBU', g: 'JetBeats', y1: 1193.38342285156, y2: 702.543407440186, z: 702.543407440186 },\n  { x: 'XHBU', g: 'Kibana Airlines', y1: 1159.03503417969, y2: 606.558886210124, z: 606.558886210124 },\n  { x: 'XHBU', g: 'ES-Air', y1: 996.849731445313, y2: 752.394683837891, z: 752.394683837891 },\n  { x: 'XHBU', g: 'Logstash Airways', y1: 909.167602539063, y2: 564.171913146973, z: 564.171913146973 },\n  { x: 'NGO', g: 'ES-Air', y1: 1189.08776855469, y2: 1189.08776855469, z: 1189.08776855469 },\n  { x: 'SCL', g: 'Logstash Airways', y1: 1176.63818359375, y2: 1031.0576171875, z: 1031.0576171875 },\n  { x: 'VE05', g: 'Kibana Airlines', y1: 1189.53845214844, y2: 563.195382859972, z: 563.195382859972 },\n  { x: 'VE05', g: 'Logstash Airways', y1: 998.839538574219, y2: 467.636221313477, z: 467.636221313477 },\n  { x: 'VE05', g: 'JetBeats', y1: 900.798461914063, y2: 569.146169026693, z: 569.146169026693 },\n  { x: 'VE05', g: 'ES-Air', y1: 820.462463378906, y2: 541.392608642578, z: 541.392608642578 },\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        orderOrdinalBinsBy={\n          orderOrdinalBinsBy\n            ? {\n                direction: Direction.Descending,\n              }\n            : undefined\n        }\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left2\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\n\n      <LineSeries\n        id=\"bars1\"\n        fit=\"linear\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={boolean('Stacked', true) ? ['g'] : undefined}\n        data={[...data1, ...(orderOrdinalBinsBy ? shuffle(data2) : data2)]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        orderOrdinalBinsBy={\\n          orderOrdinalBinsBy\\n            ? {\\n                direction: Direction.Descending,\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\\n\\n      <LineSeries\\n        id=\\\"bars1\\\"\\n        fit=\\\"linear\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={boolean('Stacked', true) ? ['g'] : undefined}\\n        data={[...data1, ...(orderOrdinalBinsBy ? shuffle(data2) : data2)]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings, Fit, AreaSeries } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fitEnabled = boolean('enable fit function', false);\\n  const isArea = boolean('switch to area', false);\\n  const LineOrAreaSeries = isArea ? AreaSeries : LineSeries;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n\\n      <LineOrAreaSeries\\n        id=\\\"series 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        data={[\\n          [0, 10],\\n          [1, 12],\\n          [2, 14],\\n          [3, 15],\\n          [4, 5],\\n          [5, 6],\\n          [6, 9],\\n          [8, 11],\\n        ]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n\\n      <LineOrAreaSeries\\n        id=\\\"series 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        data={[\\n          [0, 3],\\n          [1, 3.5],\\n          [3, 4],\\n          [4, 8],\\n          [6, 3],\\n          [7, 2],\\n        ]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings, Fit, AreaSeries } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fitEnabled = boolean('enable fit function', false);\n  const isArea = boolean('switch to area', false);\n  const LineOrAreaSeries = isArea ? AreaSeries : LineSeries;\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"x\" position={Position.Bottom} />\n      <Axis id=\"y\" position={Position.Left} />\n\n      <LineOrAreaSeries\n        id=\"series 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        fit={fitEnabled ? Fit.Linear : undefined}\n        data={[\n          [0, 10],\n          [1, 12],\n          [2, 14],\n          [3, 15],\n          [4, 5],\n          [5, 6],\n          [6, 9],\n          [8, 11],\n        ]}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n\n      <LineOrAreaSeries\n        id=\"series 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        fit={fitEnabled ? Fit.Linear : undefined}\n        data={[\n          [0, 3],\n          [1, 3.5],\n          [3, 4],\n          [4, 8],\n          [6, 3],\n          [7, 2],\n        ]}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fitEnabled = boolean('enable fit function', false);\\n  const isArea = boolean('switch to area', false);\\n  const LineOrAreaSeries = isArea ? AreaSeries : LineSeries;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n\\n      <LineOrAreaSeries\\n        id=\\\"series 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        data={[\\n          [0, 10],\\n          [1, 12],\\n          [2, 14],\\n          [3, 15],\\n          [4, 5],\\n          [5, 6],\\n          [6, 9],\\n          [8, 11],\\n        ]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n\\n      <LineOrAreaSeries\\n        id=\\\"series 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        data={[\\n          [0, 3],\\n          [1, 3.5],\\n          [3, 4],\\n          [4, 8],\\n          [6, 3],\\n          [7, 2],\\n        ]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, CurveType, Position, ScaleType, Settings, Fit } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fitEnabled = boolean('enable fit function', false);\\n  const [Series] = customKnobs.enum.xySeries('series type', 'line', { exclude: ['bar', 'bubble'] });\\n  const maxDataPoints = number('max data points', 60, {\\n    range: true,\\n    min: 0,\\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data.length,\\n    step: 1,\\n  });\\n  const pointRadius = number('default point radius', 0, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const radius = number('isolated point radius', 2, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const overrideRadius = number('override point radius', 0, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const overridePointRadius = boolean('override radius for isolated points', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        legendPosition={Position.Right}\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n              radius: pointRadius,\\n            },\\n            isolatedPoint: {\\n              radius,\\n              shape: customKnobs.enum.pointShape(),\\n            },\\n          },\\n          lineSeriesStyle: {\\n            point: {\\n              visible: true,\\n              radius: pointRadius,\\n            },\\n            isolatedPoint: {\\n              radius,\\n              shape: customKnobs.enum.pointShape(),\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        position={Position.Bottom}\\n        style={{\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n        }}\\n        timeAxisLayerCount={2}\\n        gridLine={{\\n          visible: true,\\n        }}\\n      />\\n      <Axis id=\\\"y\\\" position={Position.Left} ticks={5} />\\n\\n      <Series\\n        id=\\\"Count of records\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[2]}\\n        areaSeriesStyle={\\n          overrideRadius > 0\\n            ? {\\n                point: {\\n                  visible: true,\\n                  radius: overrideRadius,\\n                },\\n                isolatedPoint: overridePointRadius\\n                  ? {\\n                      radius,\\n                    }\\n                  : {},\\n              }\\n            : {}\\n        }\\n        lineSeriesStyle={\\n          overrideRadius > 0\\n            ? {\\n                point: {\\n                  visible: true,\\n                  radius: overrideRadius,\\n                },\\n                isolatedPoint: overridePointRadius\\n                  ? {\\n                      radius,\\n                    }\\n                  : {},\\n              }\\n            : {}\\n        }\\n        data={[\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([1, 10, 12, 20, 22, 24, 28].includes(i)) {\\n              return [d[0], null, 'A'];\\n            }\\n            return [...d, 'A'];\\n          }),\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([5, 7, 33, 35, 20, 22, 35].includes(i)) {\\n              return [d[0], null, 'B'];\\n            }\\n            return [...d, 'B'];\\n          }),\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([9, 11, 13, 45, 47, 61, 62].includes(i)) {\\n              return [d[0], null, 'C'];\\n            }\\n            return [...d, 'C'];\\n          }),\\n        ]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":156},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":156}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, CurveType, Position, ScaleType, Settings, Fit } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fitEnabled = boolean('enable fit function', false);\n  const [Series] = customKnobs.enum.xySeries('series type', 'line', { exclude: ['bar', 'bubble'] });\n  const maxDataPoints = number('max data points', 60, {\n    range: true,\n    min: 0,\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data.length,\n    step: 1,\n  });\n  const pointRadius = number('default point radius', 0, {\n    range: true,\n    min: 0,\n    max: 10,\n    step: 1,\n  });\n  const radius = number('isolated point radius', 2, {\n    range: true,\n    min: 0,\n    max: 10,\n    step: 1,\n  });\n  const overrideRadius = number('override point radius', 0, {\n    range: true,\n    min: 0,\n    max: 10,\n    step: 1,\n  });\n  const overridePointRadius = boolean('override radius for isolated points', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        legendPosition={Position.Right}\n        theme={{\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n              radius: pointRadius,\n            },\n            isolatedPoint: {\n              radius,\n              shape: customKnobs.enum.pointShape(),\n            },\n          },\n          lineSeriesStyle: {\n            point: {\n              visible: true,\n              radius: pointRadius,\n            },\n            isolatedPoint: {\n              radius,\n              shape: customKnobs.enum.pointShape(),\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis\n        id=\"x\"\n        position={Position.Bottom}\n        style={{\n          tickLine: { size: 0.0001, padding: 4 },\n          tickLabel: {\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n            padding: 0,\n            offset: { x: 0, y: 0 },\n          },\n        }}\n        timeAxisLayerCount={2}\n        gridLine={{\n          visible: true,\n        }}\n      />\n      <Axis id=\"y\" position={Position.Left} ticks={5} />\n\n      <Series\n        id=\"Count of records\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        splitSeriesAccessors={[2]}\n        areaSeriesStyle={\n          overrideRadius > 0\n            ? {\n                point: {\n                  visible: true,\n                  radius: overrideRadius,\n                },\n                isolatedPoint: overridePointRadius\n                  ? {\n                      radius,\n                    }\n                  : {},\n              }\n            : {}\n        }\n        lineSeriesStyle={\n          overrideRadius > 0\n            ? {\n                point: {\n                  visible: true,\n                  radius: overrideRadius,\n                },\n                isolatedPoint: overridePointRadius\n                  ? {\n                      radius,\n                    }\n                  : {},\n              }\n            : {}\n        }\n        data={[\n          ...KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map((d, i) => {\n            if ([1, 10, 12, 20, 22, 24, 28].includes(i)) {\n              return [d[0], null, 'A'];\n            }\n            return [...d, 'A'];\n          }),\n          ...KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map((d, i) => {\n            if ([5, 7, 33, 35, 20, 22, 35].includes(i)) {\n              return [d[0], null, 'B'];\n            }\n            return [...d, 'B'];\n          }),\n          ...KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map((d, i) => {\n            if ([9, 11, 13, 45, 47, 61, 62].includes(i)) {\n              return [d[0], null, 'C'];\n            }\n            return [...d, 'C'];\n          }),\n        ]}\n        fit={fitEnabled ? Fit.Linear : undefined}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fitEnabled = boolean('enable fit function', false);\\n  const [Series] = customKnobs.enum.xySeries('series type', 'line', { exclude: ['bar', 'bubble'] });\\n  const maxDataPoints = number('max data points', 60, {\\n    range: true,\\n    min: 0,\\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data.length,\\n    step: 1,\\n  });\\n  const pointRadius = number('default point radius', 0, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const radius = number('isolated point radius', 2, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const overrideRadius = number('override point radius', 0, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const overridePointRadius = boolean('override radius for isolated points', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        legendPosition={Position.Right}\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n              radius: pointRadius,\\n            },\\n            isolatedPoint: {\\n              radius,\\n              shape: customKnobs.enum.pointShape(),\\n            },\\n          },\\n          lineSeriesStyle: {\\n            point: {\\n              visible: true,\\n              radius: pointRadius,\\n            },\\n            isolatedPoint: {\\n              radius,\\n              shape: customKnobs.enum.pointShape(),\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        position={Position.Bottom}\\n        style={{\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n        }}\\n        timeAxisLayerCount={2}\\n        gridLine={{\\n          visible: true,\\n        }}\\n      />\\n      <Axis id=\\\"y\\\" position={Position.Left} ticks={5} />\\n\\n      <Series\\n        id=\\\"Count of records\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[2]}\\n        areaSeriesStyle={\\n          overrideRadius > 0\\n            ? {\\n                point: {\\n                  visible: true,\\n                  radius: overrideRadius,\\n                },\\n                isolatedPoint: overridePointRadius\\n                  ? {\\n                      radius,\\n                    }\\n                  : {},\\n              }\\n            : {}\\n        }\\n        lineSeriesStyle={\\n          overrideRadius > 0\\n            ? {\\n                point: {\\n                  visible: true,\\n                  radius: overrideRadius,\\n                },\\n                isolatedPoint: overridePointRadius\\n                  ? {\\n                      radius,\\n                    }\\n                  : {},\\n              }\\n            : {}\\n        }\\n        data={[\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([1, 10, 12, 20, 22, 24, 28].includes(i)) {\\n              return [d[0], null, 'A'];\\n            }\\n            return [...d, 'A'];\\n          }),\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([5, 7, 33, 35, 20, 22, 35].includes(i)) {\\n              return [d[0], null, 'B'];\\n            }\\n            return [...d, 'B'];\\n          }),\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([9, 11, 13, 45, 47, 61, 62].includes(i)) {\\n              return [d[0], null, 'C'];\\n            }\\n            return [...d, 'C'];\\n          }),\\n        ]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, Position, ScaleType, Settings, LineSeries } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\nconst bubbleData = new Array(30).fill(0).map((_, i) => ({\\n  x: i,\\n  y: rng(2, 3, 2),\\n  z: rng(0, 20),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const markSizeRatio = number('markSizeRatio', 10, {\\n    range: true,\\n    min: 1,\\n    max: 20,\\n    step: 1,\\n  });\\n\\n  const visible = boolean('show line points', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n          lineSeriesStyle: {\\n            point: {\\n              visible,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: 5,\\n        }}\\n      />\\n\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={bubbleData}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":25},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":25},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, Position, ScaleType, Settings, LineSeries } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\nconst bubbleData = new Array(30).fill(0).map((_, i) => ({\n  x: i,\n  y: rng(2, 3, 2),\n  z: rng(0, 20),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const markSizeRatio = number('markSizeRatio', 10, {\n    range: true,\n    min: 1,\n    max: 20,\n    step: 1,\n  });\n\n  const visible = boolean('show line points', true);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{\n          markSizeRatio,\n          lineSeriesStyle: {\n            point: {\n              visible,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          min: NaN,\n          max: 5,\n        }}\n      />\n\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={bubbleData}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const markSizeRatio = number('markSizeRatio', 10, {\\n    range: true,\\n    min: 1,\\n    max: 20,\\n    step: 1,\\n  });\\n\\n  const visible = boolean('show line points', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n          lineSeriesStyle: {\\n            point: {\\n              visible,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: 5,\\n        }}\\n      />\\n\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={bubbleData}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LIGHT_THEME,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  PointShape,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getColorPicker } from '../utils/components/get_color_picker';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20);\\nconst shapes = Object.values(PointShape);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showColorPicker = boolean('Show color picker', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n        legendColorPicker={showColorPicker ? getColorPicker('leftCenter') : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n      />\\n      {shapes.map((shape, i) => {\\n        return (\\n          <LineSeries\\n            key={shape}\\n            id={shape}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            lineSeriesStyle={{ point: { shape, radius: 10 } }}\\n            data={data.map(([x, y]) => [x, y + 10 * i])}\\n          />\\n        );\\n      })}\\n      <LineSeries\\n        id=\\\"multi\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        color=\\\"lightgray\\\" // never overridden\\n        pointStyleAccessor={(datum) => {\\n          return {\\n            shape: shapes[datum.datum[2] % shapes.length],\\n            fill: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\\n            opacity: 0.9,\\n            radius: 5,\\n            stroke: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\\n            strokeWidth: 1,\\n            visible: true,\\n          };\\n        }}\\n        data={data.map(([x, y], i) => [x, y + 60, i])}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":89},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":89}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LIGHT_THEME,\n  LineSeries,\n  niceTimeFormatByDay,\n  PointShape,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getColorPicker } from '../utils/components/get_color_picker';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20);\nconst shapes = Object.values(PointShape);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showColorPicker = boolean('Show color picker', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        baseTheme={useBaseTheme()}\n        legendColorPicker={showColorPicker ? getColorPicker('leftCenter') : undefined}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n      />\n      {shapes.map((shape, i) => {\n        return (\n          <LineSeries\n            key={shape}\n            id={shape}\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor={0}\n            yAccessors={[1]}\n            lineSeriesStyle={{ point: { shape, radius: 10 } }}\n            data={data.map(([x, y]) => [x, y + 10 * i])}\n          />\n        );\n      })}\n      <LineSeries\n        id=\"multi\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        color=\"lightgray\" // never overridden\n        pointStyleAccessor={(datum) => {\n          return {\n            shape: shapes[datum.datum[2] % shapes.length],\n            fill: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\n            opacity: 0.9,\n            radius: 5,\n            stroke: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\n            strokeWidth: 1,\n            visible: true,\n          };\n        }}\n        data={data.map(([x, y], i) => [x, y + 60, i])}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showColorPicker = boolean('Show color picker', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n        legendColorPicker={showColorPicker ? getColorPicker('leftCenter') : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n      />\\n      {shapes.map((shape, i) => {\\n        return (\\n          <LineSeries\\n            key={shape}\\n            id={shape}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            lineSeriesStyle={{ point: { shape, radius: 10 } }}\\n            data={data.map(([x, y]) => [x, y + 10 * i])}\\n          />\\n        );\\n      })}\\n      <LineSeries\\n        id=\\\"multi\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        color=\\\"lightgray\\\" // never overridden\\n        pointStyleAccessor={(datum) => {\\n          return {\\n            shape: shapes[datum.datum[2] % shapes.length],\\n            fill: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\\n            opacity: 0.9,\\n            radius: 5,\\n            stroke: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\\n            strokeWidth: 1,\\n            visible: true,\\n          };\\n        }}\\n        data={data.map(([x, y], i) => [x, y + 60, i])}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport { LineSeries, Chart, ScaleType, Settings, Position, Axis } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const negative = boolean('use negative values', true);\\n  const yScaleType = customKnobs.enum.scaleType('Y scale type', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  const start = moment(1628547917775);\\n  const data = new Array(12).fill(0).map((_, i) => {\\n    // https://github.com/storybookjs/storybook/issues/12208#issuecomment-697044557\\n    const months = 1; // do not simplify\\n    return {\\n      y: i === 10 ? (negative ? -1 : 1) : 0,\\n      x: start.add(months, 'm').valueOf(),\\n    };\\n  });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <LineSeries\\n        fit=\\\"linear\\\"\\n        id=\\\"line\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport moment from 'moment';\nimport React from 'react';\n\nimport { LineSeries, Chart, ScaleType, Settings, Position, Axis } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const negative = boolean('use negative values', true);\n  const yScaleType = customKnobs.enum.scaleType('Y scale type', ScaleType.Linear, { include: ['Linear', 'Log'] });\n\n  const start = moment(1628547917775);\n  const data = new Array(12).fill(0).map((_, i) => {\n    // https://github.com/storybookjs/storybook/issues/12208#issuecomment-697044557\n    const months = 1; // do not simplify\n    return {\n      y: i === 10 ? (negative ? -1 : 1) : 0,\n      x: start.add(months, 'm').valueOf(),\n    };\n  });\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"y\" position={Position.Left} />\n      <Axis id=\"x\" position={Position.Bottom} />\n      <LineSeries\n        fit=\"linear\"\n        id=\"line\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Time}\n        yScaleType={yScaleType}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const negative = boolean('use negative values', true);\\n  const yScaleType = customKnobs.enum.scaleType('Y scale type', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  const start = moment(1628547917775);\\n  const data = new Array(12).fill(0).map((_, i) => {\\n    // https://github.com/storybookjs/storybook/issues/12208#issuecomment-697044557\\n    const months = 1; // do not simplify\\n    return {\\n      y: i === 10 ? (negative ? -1 : 1) : 0,\\n      x: start.add(months, 'm').valueOf(),\\n    };\\n  });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <LineSeries\\n        fit=\\\"linear\\\"\\n        id=\\\"line\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, LineSeries, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const toggleSpec = boolean('toggle line spec', true);\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = data1.map((datum) => [datum[0], datum[1] - 1]);\\n  const data = toggleSpec ? data1 : data2;\\n  const specId = toggleSpec ? 'lines1' : 'lines2';\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <LineSeries\\n        id={specId}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":38},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":38}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, LineSeries, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const toggleSpec = boolean('toggle line spec', true);\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\n  const data2 = data1.map((datum) => [datum[0], datum[1] - 1]);\n  const data = toggleSpec ? data1 : data2;\n  const specId = toggleSpec ? 'lines1' : 'lines2';\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <LineSeries\n        id={specId}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const toggleSpec = boolean('toggle line spec', true);\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = data1.map((datum) => [datum[0], datum[1] - 1]);\\n  const data = toggleSpec ? data1 : data2;\\n  const specId = toggleSpec ? 'lines1' : 'lines2';\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <LineSeries\\n        id={specId}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      xDomain={{\\n        min: NaN,\\n        max: 2,\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      xDomain={{\n        min: NaN,\n        max: 2,\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      xDomain={{\\n        min: NaN,\\n        max: 2,\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n\\n    <LineSeries\\n      id=\\\"monotone x\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n    />\\n    <LineSeries\\n      id=\\\"basis\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_BASIS}\\n    />\\n    <LineSeries\\n      id=\\\"cardinal\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_CARDINAL}\\n    />\\n    <LineSeries\\n      id=\\\"catmull rom\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n    />\\n    <LineSeries\\n      id=\\\"natural\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_NATURAL}\\n    />\\n    <LineSeries\\n      id=\\\"linear\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":95},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":95}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n\n    <LineSeries\n      id=\"monotone x\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_MONOTONE_X}\n    />\n    <LineSeries\n      id=\"basis\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_BASIS}\n    />\n    <LineSeries\n      id=\"cardinal\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_CARDINAL}\n    />\n    <LineSeries\n      id=\"catmull rom\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_CATMULL_ROM}\n    />\n    <LineSeries\n      id=\"natural\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_NATURAL}\n    />\n    <LineSeries\n      id=\"linear\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.LINEAR}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n\\n    <LineSeries\\n      id=\\\"monotone x\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n    />\\n    <LineSeries\\n      id=\\\"basis\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_BASIS}\\n    />\\n    <LineSeries\\n      id=\\\"cardinal\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_CARDINAL}\\n    />\\n    <LineSeries\\n      id=\\\"catmull rom\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n    />\\n    <LineSeries\\n      id=\\\"natural\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_NATURAL}\\n    />\\n    <LineSeries\\n      id=\\\"linear\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      curve={CurveType.LINEAR}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      curve={CurveType.LINEAR}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":68},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":68}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.LINEAR}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n      curve={CurveType.LINEAR}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n      curve={CurveType.LINEAR}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      curve={CurveType.LINEAR}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      curve={CurveType.LINEAR}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":70},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":70}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n      curve={CurveType.LINEAR}\n      stackAccessors={[0]}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n      curve={CurveType.LINEAR}\n      stackAccessors={[0]}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.LINEAR}\n      stackAccessors={[0]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\nimport { TSVB_DATASET } from '@elastic/charts/src/utils/data_samples/test_dataset_tsvb';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    {TSVB_DATASET.series.map((series) => (\\n      <LineSeries\\n        key={series.id}\\n        id={series.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Log}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={series.data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    ))}\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\nimport { TSVB_DATASET } from '@elastic/charts/src/utils/data_samples/test_dataset_tsvb';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n    {TSVB_DATASET.series.map((series) => (\n      <LineSeries\n        key={series.id}\n        id={series.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Log}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={series.data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    ))}\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    {TSVB_DATASET.series.map((series) => (\\n      <LineSeries\\n        key={series.id}\\n        id={series.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Log}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={series.data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    ))}\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Line Chart',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as withAxis } from './2_w_axis.story';\nexport { Example as ordinalWithAxis } from './3_ordinal.story';\nexport { Example as linearWithAxis } from './4_linear.story';\nexport { Example as withAxisAndLegend } from './5_w_axis_and_legend.story';\nexport { Example as curvedWithAxisAndLegend } from './6_curved.story';\nexport { Example as multipleWithAxisAndLegend } from './7_multiple.story';\nexport { Example as stackedWithAxisAndLegend } from './8_stacked.story';\nexport { Example as multiSeriesWithLogValues } from './9_multi_series.story';\nexport { Example as discontinuousDataPoints } from './11_discontinuous_data_points.story';\nexport { Example as isolatedDataPoints } from './12_isolated_data_points.story';\nexport { Example as testPathOrdering } from './10_test_path_ordering.story';\nexport { Example as lineWithMarkAccessor } from './13_line_mark_accessor.story';\nexport { Example as pointShapes } from './14_point_shapes.story';\nexport { Example as testNegativePoints } from './15_test_negative_points.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiIcon } from '@elastic/eui';\\nimport { action } from '@storybook/addon-actions';\\nimport { select, boolean, text, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  isMetricElementEvent,\\n  Metric,\\n  MetricTrendShape,\\n  MetricWProgress,\\n  MetricWTrend,\\n  MetricWText,\\n  MetricWNumber,\\n  Settings,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title: storyTitle, description }) => {\\n  const title = text('title', '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9');\\n  const subtitle = text('subtitle', 'Cluster CPU usage');\\n  const progressOrTrend = select(\\n    'progress or trend',\\n    {\\n      trend: 'trend',\\n      bar: 'bar',\\n      none: 'none',\\n    },\\n    'trend',\\n  );\\n  const progressBarDirection = select(\\n    'progress bar direction',\\n    { horizontal: 'horizontal', vertical: 'vertical' },\\n    'vertical',\\n  );\\n  const maxDataPoints = number('trend data points', 30, { min: 0, max: 50, step: 1 });\\n  const trendShape = customKnobs.fromEnum('trend shape', MetricTrendShape, MetricTrendShape.Area);\\n  const trendA11yTitle = text('trend a11y title', 'The Cluster CPU Usage trend');\\n  const trendA11yDescription = text(\\n    'trend a11y description',\\n    'The trend shows a peak of CPU usage in the last 5 minutes',\\n  );\\n\\n  let extra = text('extra', 'last <b>5m</b>');\\n  const progressMax = number('progress max', 100);\\n  const numberTextSwitch = boolean('is numeric metric', true);\\n  const value = text('value', '55.23');\\n  const valuePrefix = text('value prefix', '');\\n  const valuePostfix = text('value postfix', ' %');\\n  const metricColor = color('color', '#3c3c3c');\\n  const useValueColor = boolean('use value color', false);\\n  const valueColor = color('value color', '#3c3c3c');\\n  extra = extra.replace('&lt;b&gt;', '<b>');\\n  extra = extra.replace('&lt;/b&gt;', '</b>');\\n  const showIcon = boolean('show icon', false);\\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'warning');\\n  const showValueIcon = boolean('show value icon', false);\\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\\n  const useBlendingBackground = boolean('use blending background', false);\\n  const blendingBackground = color('blending background', 'rgba(255,255,255,1)');\\n  const getIcon =\\n    (type: string) =>\\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n    );\\n  const data = {\\n    color: metricColor,\\n    title,\\n    valueColor: useValueColor ? valueColor : undefined,\\n    subtitle,\\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\\n  };\\n\\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\\n    ...data,\\n    value: Number.parseFloat(value),\\n    valueFormatter: (d: number) => `${valuePrefix}${d}${valuePostfix}`,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n          trendShape,\\n          trendA11yTitle,\\n          trendA11yDescription,\\n        }\\n      : {}),\\n  };\\n  const textualData: MetricWText | MetricWTrend = {\\n    ...data,\\n    value,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n          trendShape,\\n          trendA11yTitle,\\n          trendA11yDescription,\\n        }\\n      : {}),\\n  };\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n\\n  const configuredData = [[numberTextSwitch ? numericData : textualData]];\\n  return (\\n    <Chart title={storyTitle} description={description}>\\n      <Settings\\n        theme={{\\n          metric: {\\n            blendingBackground: useBlendingBackground ? blendingBackground : undefined,\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventClickAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOver={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventOverAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOut={() => onEventOutAction('out')}\\n      />\\n      <Metric id=\\\"1\\\" data={configuredData} />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    height: '200px',\\n    width: '200px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":151},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":151}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiIcon } from '@elastic/eui';\nimport { action } from '@storybook/addon-actions';\nimport { select, boolean, text, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  isMetricElementEvent,\n  Metric,\n  MetricTrendShape,\n  MetricWProgress,\n  MetricWTrend,\n  MetricWText,\n  MetricWNumber,\n  Settings,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title: storyTitle, description }) => {\n  const title = text('title', '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9');\n  const subtitle = text('subtitle', 'Cluster CPU usage');\n  const progressOrTrend = select(\n    'progress or trend',\n    {\n      trend: 'trend',\n      bar: 'bar',\n      none: 'none',\n    },\n    'trend',\n  );\n  const progressBarDirection = select(\n    'progress bar direction',\n    { horizontal: 'horizontal', vertical: 'vertical' },\n    'vertical',\n  );\n  const maxDataPoints = number('trend data points', 30, { min: 0, max: 50, step: 1 });\n  const trendShape = customKnobs.fromEnum('trend shape', MetricTrendShape, MetricTrendShape.Area);\n  const trendA11yTitle = text('trend a11y title', 'The Cluster CPU Usage trend');\n  const trendA11yDescription = text(\n    'trend a11y description',\n    'The trend shows a peak of CPU usage in the last 5 minutes',\n  );\n\n  let extra = text('extra', 'last <b>5m</b>');\n  const progressMax = number('progress max', 100);\n  const numberTextSwitch = boolean('is numeric metric', true);\n  const value = text('value', '55.23');\n  const valuePrefix = text('value prefix', '');\n  const valuePostfix = text('value postfix', ' %');\n  const metricColor = color('color', '#3c3c3c');\n  const useValueColor = boolean('use value color', false);\n  const valueColor = color('value color', '#3c3c3c');\n  extra = extra.replace('&lt;b&gt;', '<b>');\n  extra = extra.replace('&lt;/b&gt;', '</b>');\n  const showIcon = boolean('show icon', false);\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'warning');\n  const showValueIcon = boolean('show value icon', false);\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\n  const useBlendingBackground = boolean('use blending background', false);\n  const blendingBackground = color('blending background', 'rgba(255,255,255,1)');\n  const getIcon =\n    (type: string) =>\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\n    );\n  const data = {\n    color: metricColor,\n    title,\n    valueColor: useValueColor ? valueColor : undefined,\n    subtitle,\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\n  };\n\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\n    ...data,\n    value: Number.parseFloat(value),\n    valueFormatter: (d: number) => `${valuePrefix}${d}${valuePostfix}`,\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\n    ...(progressOrTrend === 'trend'\n      ? {\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n          trendShape,\n          trendA11yTitle,\n          trendA11yDescription,\n        }\n      : {}),\n  };\n  const textualData: MetricWText | MetricWTrend = {\n    ...data,\n    value,\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\n    ...(progressOrTrend === 'trend'\n      ? {\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n          trendShape,\n          trendA11yTitle,\n          trendA11yDescription,\n        }\n      : {}),\n  };\n\n  const onEventClickAction = action('click');\n  const onEventOverAction = action('over');\n  const onEventOutAction = action('out');\n\n  const configuredData = [[numberTextSwitch ? numericData : textualData]];\n  return (\n    <Chart title={storyTitle} description={description}>\n      <Settings\n        theme={{\n          metric: {\n            blendingBackground: useBlendingBackground ? blendingBackground : undefined,\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        onElementClick={([d]) => {\n          if (isMetricElementEvent(d)) {\n            const { rowIndex, columnIndex } = d;\n            onEventClickAction(\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\n            );\n          }\n        }}\n        onElementOver={([d]) => {\n          if (isMetricElementEvent(d)) {\n            const { rowIndex, columnIndex } = d;\n            onEventOverAction(\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\n            );\n          }\n        }}\n        onElementOut={() => onEventOutAction('out')}\n      />\n      <Metric id=\"1\" data={configuredData} />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    height: '200px',\n    width: '200px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title: storyTitle, description }) => {\\n  const title = text('title', '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9');\\n  const subtitle = text('subtitle', 'Cluster CPU usage');\\n  const progressOrTrend = select(\\n    'progress or trend',\\n    {\\n      trend: 'trend',\\n      bar: 'bar',\\n      none: 'none',\\n    },\\n    'trend',\\n  );\\n  const progressBarDirection = select(\\n    'progress bar direction',\\n    { horizontal: 'horizontal', vertical: 'vertical' },\\n    'vertical',\\n  );\\n  const maxDataPoints = number('trend data points', 30, { min: 0, max: 50, step: 1 });\\n  const trendShape = customKnobs.fromEnum('trend shape', MetricTrendShape, MetricTrendShape.Area);\\n  const trendA11yTitle = text('trend a11y title', 'The Cluster CPU Usage trend');\\n  const trendA11yDescription = text(\\n    'trend a11y description',\\n    'The trend shows a peak of CPU usage in the last 5 minutes',\\n  );\\n\\n  let extra = text('extra', 'last <b>5m</b>');\\n  const progressMax = number('progress max', 100);\\n  const numberTextSwitch = boolean('is numeric metric', true);\\n  const value = text('value', '55.23');\\n  const valuePrefix = text('value prefix', '');\\n  const valuePostfix = text('value postfix', ' %');\\n  const metricColor = color('color', '#3c3c3c');\\n  const useValueColor = boolean('use value color', false);\\n  const valueColor = color('value color', '#3c3c3c');\\n  extra = extra.replace('&lt;b&gt;', '<b>');\\n  extra = extra.replace('&lt;/b&gt;', '</b>');\\n  const showIcon = boolean('show icon', false);\\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'warning');\\n  const showValueIcon = boolean('show value icon', false);\\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\\n  const useBlendingBackground = boolean('use blending background', false);\\n  const blendingBackground = color('blending background', 'rgba(255,255,255,1)');\\n  const getIcon =\\n    (type: string) =>\\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n    );\\n  const data = {\\n    color: metricColor,\\n    title,\\n    valueColor: useValueColor ? valueColor : undefined,\\n    subtitle,\\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\\n  };\\n\\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\\n    ...data,\\n    value: Number.parseFloat(value),\\n    valueFormatter: (d: number) => `${valuePrefix}${d}${valuePostfix}`,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n          trendShape,\\n          trendA11yTitle,\\n          trendA11yDescription,\\n        }\\n      : {}),\\n  };\\n  const textualData: MetricWText | MetricWTrend = {\\n    ...data,\\n    value,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n          trendShape,\\n          trendA11yTitle,\\n          trendA11yDescription,\\n        }\\n      : {}),\\n  };\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n\\n  const configuredData = [[numberTextSwitch ? numericData : textualData]];\\n  return (\\n    <Chart title={storyTitle} description={description}>\\n      <Settings\\n        theme={{\\n          metric: {\\n            blendingBackground: useBlendingBackground ? blendingBackground : undefined,\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventClickAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOver={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventOverAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOut={() => onEventOutAction('out')}\\n      />\\n      <Metric id=\\\"1\\\" data={configuredData} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiIcon } from '@elastic/eui';\\nimport { action } from '@storybook/addon-actions';\\nimport { select, number, boolean, button, color } from '@storybook/addon-knobs';\\nimport React, { useEffect, useMemo, useState } from 'react';\\n\\nimport { Chart, isMetricElementEvent, Metric, MetricDatum, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nfunction split(a: (any | undefined)[], size: number) {\\n  return Array.from(new Array(Math.ceil(a.length / size))).map((_, index) => a.slice(index * size, (index + 1) * size));\\n}\\n\\nconst getIcon =\\n  (type: string) =>\\n  ({ width, height, color }: { width: number; height: number; color: string }) => (\\n    <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n  );\\n\\nconst arrayToGrid: <T>(array: T[], nColumns: number) => T[][] = (array, nColumns) => {\\n  const ret = [];\\n  for (let i = 0; i < array.length; i += nColumns) {\\n    ret.push(array.slice(i, i + nColumns));\\n  }\\n  return ret;\\n};\\n\\nconst maxTileSideLength = 200;\\nconst getContainerWidth = (_data: (MetricDatum | undefined)[][]) => _data[0].length * maxTileSideLength;\\nconst getContainerHeight = (_data: (MetricDatum | undefined)[][]) => _data.length * maxTileSideLength;\\n\\nconst defaultValueFormatter = (d: number) => `${d}`;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showGridBorder = boolean('show grid border', false);\\n  const addMetricClick = boolean('attach click handler', true);\\n  const useProgressBar = boolean('use progress bar', true);\\n\\n  const progressBarDirection = select('progress bar direction', ['horizontal', 'vertical'], 'vertical');\\n  const maxDataPoints = number('max trend data points', 30, { min: 0, max: 50, step: 1 });\\n  const emptyBackground = color('empty background', 'transparent');\\n\\n  const data: (MetricDatum | undefined)[] = useMemo(\\n    () => [\\n      {\\n        color: '#3c3c3c',\\n        title: 'CPU Usage',\\n        subtitle: 'Overall percentage',\\n        icon: getIcon('compute'),\\n        value: NaN,\\n        valueFormatter: defaultValueFormatter,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last hour CPU percentage trend',\\n        trendA11yDescription:\\n          'The trend shows the CPU Usage in percentage in the last hour. The trend shows a general flat behaviour with peaks every 10 minutes',\\n      },\\n      {\\n        color: '#FF7E62',\\n        title: 'Memory Usage',\\n        subtitle: 'Overall percentage',\\n        value: 33.57,\\n        valueFormatter: (d) => `${d} %`,\\n        trend: KIBANA_METRICS.metrics.kibana_memory.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last hour Memory usage trend',\\n        trendA11yDescription:\\n          'The trend shows the memory usage in the last hour. The trend shows a general flat behaviour across the entire time window',\\n      },\\n      {\\n        color: '#5e5e5e',\\n        title: 'Disk I/O',\\n        subtitle: 'Read',\\n        icon: getIcon('sortUp'),\\n        value: 12.57,\\n        valueFormatter: (d) => `${d} Mb/s`,\\n        ...(useProgressBar && {\\n          domainMax: 100,\\n          progressBarDirection,\\n          extra: (\\n            <span>\\n              max <b>100Mb/s</b>\\n            </span>\\n          ),\\n        }),\\n      },\\n      {\\n        color: '#5e5e5e',\\n        title: 'Disk I/O',\\n        subtitle: 'Write',\\n        icon: getIcon('sortDown'),\\n        value: 41.12,\\n        valueFormatter: (d) => `${d} Mb/s`,\\n        ...(useProgressBar && {\\n          domainMax: 100,\\n          progressBarDirection,\\n          extra: (\\n            <span>\\n              max <b>100Mb/s</b>\\n            </span>\\n          ),\\n        }),\\n      },\\n      {\\n        color: '#6DCCB1',\\n        title: '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9',\\n        subtitle: 'Cluster CPU Usage',\\n        value: 24.85,\\n        valueFormatter: (d) => `${d}%`,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n      },\\n      {\\n        color: '#FFBDAF',\\n        title: 'Inbound Traffic',\\n        subtitle: 'Network eth0',\\n        extra: (\\n          <span>\\n            last <b>5m</b>\\n          </span>\\n        ),\\n        icon: getIcon('sortUp'),\\n        value: 3.57,\\n        valueFormatter: (d) => `${d}KBps`,\\n      },\\n      undefined,\\n      {\\n        color: '#F1D86F',\\n        title: 'Cloud Revenue',\\n        subtitle: 'Quarterly',\\n        extra: (\\n          <span>\\n            This Year <b>10M</b>\\n          </span>\\n        ),\\n        value: 323.57,\\n        valueFormatter: (d) => `$ ${d}k`,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last quarter, daily Cloud Revenue trend',\\n        trendA11yDescription:\\n          'The trend shows the daily Cloud revenue in the last quarter, showing peaks during weekends.',\\n      },\\n    ],\\n    [maxDataPoints, useProgressBar, progressBarDirection],\\n  );\\n\\n  const nColumns = number('number of columns', 4, { min: 1, max: data.length, step: 1 });\\n\\n  const [chartData, setChartData] = useState(arrayToGrid(data, nColumns));\\n  const [containerHeight, setContainerHeight] = useState(getContainerHeight(chartData));\\n  const [containerWidth, setContainerWidth] = useState(getContainerWidth(chartData));\\n\\n  useEffect(() => {\\n    const newData = arrayToGrid(data, nColumns);\\n    setChartData(newData);\\n    setContainerHeight(getContainerHeight(newData));\\n    setContainerWidth(getContainerWidth(newData));\\n  }, [data, progressBarDirection, useProgressBar, maxDataPoints, nColumns]);\\n\\n  button('randomize data', () => {\\n    setChartData(\\n      split(\\n        data\\n          .slice()\\n          .map((d) => {\\n            return rng(0, 1, 3) > 0.8 ? undefined : d;\\n          })\\n          .slice(0, rng(1, data.length)),\\n        rng(1, data.length / 2),\\n      ),\\n    );\\n  });\\n  const debugRandomizedData = boolean('debug randomized data', false);\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n  return (\\n    <div\\n      style={{\\n        resize: 'both',\\n        maxWidth: '100%',\\n        maxHeight: '80vh',\\n        padding: '0px',\\n        overflow: 'auto',\\n        height: `${containerHeight}px`,\\n        width: `${containerWidth}px`,\\n        ...(showGridBorder && {\\n          boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n          borderRadius: '6px',\\n        }),\\n      }}\\n    >\\n      {debugRandomizedData &&\\n        chartData\\n          .flat()\\n          .map((d) => `[${d?.value}]`)\\n          .join(' ')}\\n      <Chart title={title} description={description}>\\n        <Settings\\n          theme={{\\n            metric: {\\n              emptyBackground,\\n            },\\n          }}\\n          baseTheme={useBaseTheme()}\\n          onElementClick={\\n            addMetricClick\\n              ? ([d]) => {\\n                  if (isMetricElementEvent(d)) {\\n                    const { rowIndex, columnIndex } = d;\\n                    onEventClickAction(\\n                      `row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`,\\n                    );\\n                  }\\n                }\\n              : undefined\\n          }\\n          onElementOver={([d]) => {\\n            if (isMetricElementEvent(d)) {\\n              const { rowIndex, columnIndex } = d;\\n              onEventOverAction(`row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`);\\n            }\\n          }}\\n          onElementOut={() => onEventOutAction('out')}\\n        />\\n        <Metric id=\\\"metric\\\" data={chartData} />\\n      </Chart>\\n    </div>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":47},\"endLoc\":{\"col\":1,\"line\":245},\"startBody\":{\"col\":36,\"line\":47},\"endBody\":{\"col\":1,\"line\":245}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiIcon } from '@elastic/eui';\nimport { action } from '@storybook/addon-actions';\nimport { select, number, boolean, button, color } from '@storybook/addon-knobs';\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { Chart, isMetricElementEvent, Metric, MetricDatum, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\n\nfunction split(a: (any | undefined)[], size: number) {\n  return Array.from(new Array(Math.ceil(a.length / size))).map((_, index) => a.slice(index * size, (index + 1) * size));\n}\n\nconst getIcon =\n  (type: string) =>\n  ({ width, height, color }: { width: number; height: number; color: string }) => (\n    <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\n  );\n\nconst arrayToGrid: <T>(array: T[], nColumns: number) => T[][] = (array, nColumns) => {\n  const ret = [];\n  for (let i = 0; i < array.length; i += nColumns) {\n    ret.push(array.slice(i, i + nColumns));\n  }\n  return ret;\n};\n\nconst maxTileSideLength = 200;\nconst getContainerWidth = (_data: (MetricDatum | undefined)[][]) => _data[0].length * maxTileSideLength;\nconst getContainerHeight = (_data: (MetricDatum | undefined)[][]) => _data.length * maxTileSideLength;\n\nconst defaultValueFormatter = (d: number) => `${d}`;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showGridBorder = boolean('show grid border', false);\n  const addMetricClick = boolean('attach click handler', true);\n  const useProgressBar = boolean('use progress bar', true);\n\n  const progressBarDirection = select('progress bar direction', ['horizontal', 'vertical'], 'vertical');\n  const maxDataPoints = number('max trend data points', 30, { min: 0, max: 50, step: 1 });\n  const emptyBackground = color('empty background', 'transparent');\n\n  const data: (MetricDatum | undefined)[] = useMemo(\n    () => [\n      {\n        color: '#3c3c3c',\n        title: 'CPU Usage',\n        subtitle: 'Overall percentage',\n        icon: getIcon('compute'),\n        value: NaN,\n        valueFormatter: defaultValueFormatter,\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n        trendShape: 'area',\n        trendA11yTitle: 'Last hour CPU percentage trend',\n        trendA11yDescription:\n          'The trend shows the CPU Usage in percentage in the last hour. The trend shows a general flat behaviour with peaks every 10 minutes',\n      },\n      {\n        color: '#FF7E62',\n        title: 'Memory Usage',\n        subtitle: 'Overall percentage',\n        value: 33.57,\n        valueFormatter: (d) => `${d} %`,\n        trend: KIBANA_METRICS.metrics.kibana_memory.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n        trendShape: 'area',\n        trendA11yTitle: 'Last hour Memory usage trend',\n        trendA11yDescription:\n          'The trend shows the memory usage in the last hour. The trend shows a general flat behaviour across the entire time window',\n      },\n      {\n        color: '#5e5e5e',\n        title: 'Disk I/O',\n        subtitle: 'Read',\n        icon: getIcon('sortUp'),\n        value: 12.57,\n        valueFormatter: (d) => `${d} Mb/s`,\n        ...(useProgressBar && {\n          domainMax: 100,\n          progressBarDirection,\n          extra: (\n            <span>\n              max <b>100Mb/s</b>\n            </span>\n          ),\n        }),\n      },\n      {\n        color: '#5e5e5e',\n        title: 'Disk I/O',\n        subtitle: 'Write',\n        icon: getIcon('sortDown'),\n        value: 41.12,\n        valueFormatter: (d) => `${d} Mb/s`,\n        ...(useProgressBar && {\n          domainMax: 100,\n          progressBarDirection,\n          extra: (\n            <span>\n              max <b>100Mb/s</b>\n            </span>\n          ),\n        }),\n      },\n      {\n        color: '#6DCCB1',\n        title: '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9',\n        subtitle: 'Cluster CPU Usage',\n        value: 24.85,\n        valueFormatter: (d) => `${d}%`,\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n        trendShape: 'area',\n      },\n      {\n        color: '#FFBDAF',\n        title: 'Inbound Traffic',\n        subtitle: 'Network eth0',\n        extra: (\n          <span>\n            last <b>5m</b>\n          </span>\n        ),\n        icon: getIcon('sortUp'),\n        value: 3.57,\n        valueFormatter: (d) => `${d}KBps`,\n      },\n      undefined,\n      {\n        color: '#F1D86F',\n        title: 'Cloud Revenue',\n        subtitle: 'Quarterly',\n        extra: (\n          <span>\n            This Year <b>10M</b>\n          </span>\n        ),\n        value: 323.57,\n        valueFormatter: (d) => `$ ${d}k`,\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n        trendShape: 'area',\n        trendA11yTitle: 'Last quarter, daily Cloud Revenue trend',\n        trendA11yDescription:\n          'The trend shows the daily Cloud revenue in the last quarter, showing peaks during weekends.',\n      },\n    ],\n    [maxDataPoints, useProgressBar, progressBarDirection],\n  );\n\n  const nColumns = number('number of columns', 4, { min: 1, max: data.length, step: 1 });\n\n  const [chartData, setChartData] = useState(arrayToGrid(data, nColumns));\n  const [containerHeight, setContainerHeight] = useState(getContainerHeight(chartData));\n  const [containerWidth, setContainerWidth] = useState(getContainerWidth(chartData));\n\n  useEffect(() => {\n    const newData = arrayToGrid(data, nColumns);\n    setChartData(newData);\n    setContainerHeight(getContainerHeight(newData));\n    setContainerWidth(getContainerWidth(newData));\n  }, [data, progressBarDirection, useProgressBar, maxDataPoints, nColumns]);\n\n  button('randomize data', () => {\n    setChartData(\n      split(\n        data\n          .slice()\n          .map((d) => {\n            return rng(0, 1, 3) > 0.8 ? undefined : d;\n          })\n          .slice(0, rng(1, data.length)),\n        rng(1, data.length / 2),\n      ),\n    );\n  });\n  const debugRandomizedData = boolean('debug randomized data', false);\n\n  const onEventClickAction = action('click');\n  const onEventOverAction = action('over');\n  const onEventOutAction = action('out');\n  return (\n    <div\n      style={{\n        resize: 'both',\n        maxWidth: '100%',\n        maxHeight: '80vh',\n        padding: '0px',\n        overflow: 'auto',\n        height: `${containerHeight}px`,\n        width: `${containerWidth}px`,\n        ...(showGridBorder && {\n          boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n          borderRadius: '6px',\n        }),\n      }}\n    >\n      {debugRandomizedData &&\n        chartData\n          .flat()\n          .map((d) => `[${d?.value}]`)\n          .join(' ')}\n      <Chart title={title} description={description}>\n        <Settings\n          theme={{\n            metric: {\n              emptyBackground,\n            },\n          }}\n          baseTheme={useBaseTheme()}\n          onElementClick={\n            addMetricClick\n              ? ([d]) => {\n                  if (isMetricElementEvent(d)) {\n                    const { rowIndex, columnIndex } = d;\n                    onEventClickAction(\n                      `row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`,\n                    );\n                  }\n                }\n              : undefined\n          }\n          onElementOver={([d]) => {\n            if (isMetricElementEvent(d)) {\n              const { rowIndex, columnIndex } = d;\n              onEventOverAction(`row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`);\n            }\n          }}\n          onElementOut={() => onEventOutAction('out')}\n        />\n        <Metric id=\"metric\" data={chartData} />\n      </Chart>\n    </div>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showGridBorder = boolean('show grid border', false);\\n  const addMetricClick = boolean('attach click handler', true);\\n  const useProgressBar = boolean('use progress bar', true);\\n\\n  const progressBarDirection = select('progress bar direction', ['horizontal', 'vertical'], 'vertical');\\n  const maxDataPoints = number('max trend data points', 30, { min: 0, max: 50, step: 1 });\\n  const emptyBackground = color('empty background', 'transparent');\\n\\n  const data: (MetricDatum | undefined)[] = useMemo(\\n    () => [\\n      {\\n        color: '#3c3c3c',\\n        title: 'CPU Usage',\\n        subtitle: 'Overall percentage',\\n        icon: getIcon('compute'),\\n        value: NaN,\\n        valueFormatter: defaultValueFormatter,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last hour CPU percentage trend',\\n        trendA11yDescription:\\n          'The trend shows the CPU Usage in percentage in the last hour. The trend shows a general flat behaviour with peaks every 10 minutes',\\n      },\\n      {\\n        color: '#FF7E62',\\n        title: 'Memory Usage',\\n        subtitle: 'Overall percentage',\\n        value: 33.57,\\n        valueFormatter: (d) => `${d} %`,\\n        trend: KIBANA_METRICS.metrics.kibana_memory.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last hour Memory usage trend',\\n        trendA11yDescription:\\n          'The trend shows the memory usage in the last hour. The trend shows a general flat behaviour across the entire time window',\\n      },\\n      {\\n        color: '#5e5e5e',\\n        title: 'Disk I/O',\\n        subtitle: 'Read',\\n        icon: getIcon('sortUp'),\\n        value: 12.57,\\n        valueFormatter: (d) => `${d} Mb/s`,\\n        ...(useProgressBar && {\\n          domainMax: 100,\\n          progressBarDirection,\\n          extra: (\\n            <span>\\n              max <b>100Mb/s</b>\\n            </span>\\n          ),\\n        }),\\n      },\\n      {\\n        color: '#5e5e5e',\\n        title: 'Disk I/O',\\n        subtitle: 'Write',\\n        icon: getIcon('sortDown'),\\n        value: 41.12,\\n        valueFormatter: (d) => `${d} Mb/s`,\\n        ...(useProgressBar && {\\n          domainMax: 100,\\n          progressBarDirection,\\n          extra: (\\n            <span>\\n              max <b>100Mb/s</b>\\n            </span>\\n          ),\\n        }),\\n      },\\n      {\\n        color: '#6DCCB1',\\n        title: '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9',\\n        subtitle: 'Cluster CPU Usage',\\n        value: 24.85,\\n        valueFormatter: (d) => `${d}%`,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n      },\\n      {\\n        color: '#FFBDAF',\\n        title: 'Inbound Traffic',\\n        subtitle: 'Network eth0',\\n        extra: (\\n          <span>\\n            last <b>5m</b>\\n          </span>\\n        ),\\n        icon: getIcon('sortUp'),\\n        value: 3.57,\\n        valueFormatter: (d) => `${d}KBps`,\\n      },\\n      undefined,\\n      {\\n        color: '#F1D86F',\\n        title: 'Cloud Revenue',\\n        subtitle: 'Quarterly',\\n        extra: (\\n          <span>\\n            This Year <b>10M</b>\\n          </span>\\n        ),\\n        value: 323.57,\\n        valueFormatter: (d) => `$ ${d}k`,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last quarter, daily Cloud Revenue trend',\\n        trendA11yDescription:\\n          'The trend shows the daily Cloud revenue in the last quarter, showing peaks during weekends.',\\n      },\\n    ],\\n    [maxDataPoints, useProgressBar, progressBarDirection],\\n  );\\n\\n  const nColumns = number('number of columns', 4, { min: 1, max: data.length, step: 1 });\\n\\n  const [chartData, setChartData] = useState(arrayToGrid(data, nColumns));\\n  const [containerHeight, setContainerHeight] = useState(getContainerHeight(chartData));\\n  const [containerWidth, setContainerWidth] = useState(getContainerWidth(chartData));\\n\\n  useEffect(() => {\\n    const newData = arrayToGrid(data, nColumns);\\n    setChartData(newData);\\n    setContainerHeight(getContainerHeight(newData));\\n    setContainerWidth(getContainerWidth(newData));\\n  }, [data, progressBarDirection, useProgressBar, maxDataPoints, nColumns]);\\n\\n  button('randomize data', () => {\\n    setChartData(\\n      split(\\n        data\\n          .slice()\\n          .map((d) => {\\n            return rng(0, 1, 3) > 0.8 ? undefined : d;\\n          })\\n          .slice(0, rng(1, data.length)),\\n        rng(1, data.length / 2),\\n      ),\\n    );\\n  });\\n  const debugRandomizedData = boolean('debug randomized data', false);\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n  return (\\n    <div\\n      style={{\\n        resize: 'both',\\n        maxWidth: '100%',\\n        maxHeight: '80vh',\\n        padding: '0px',\\n        overflow: 'auto',\\n        height: `${containerHeight}px`,\\n        width: `${containerWidth}px`,\\n        ...(showGridBorder && {\\n          boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n          borderRadius: '6px',\\n        }),\\n      }}\\n    >\\n      {debugRandomizedData &&\\n        chartData\\n          .flat()\\n          .map((d) => `[${d?.value}]`)\\n          .join(' ')}\\n      <Chart title={title} description={description}>\\n        <Settings\\n          theme={{\\n            metric: {\\n              emptyBackground,\\n            },\\n          }}\\n          baseTheme={useBaseTheme()}\\n          onElementClick={\\n            addMetricClick\\n              ? ([d]) => {\\n                  if (isMetricElementEvent(d)) {\\n                    const { rowIndex, columnIndex } = d;\\n                    onEventClickAction(\\n                      `row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`,\\n                    );\\n                  }\\n                }\\n              : undefined\\n          }\\n          onElementOver={([d]) => {\\n            if (isMetricElementEvent(d)) {\\n              const { rowIndex, columnIndex } = d;\\n              onEventOverAction(`row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`);\\n            }\\n          }}\\n          onElementOut={() => onEventOutAction('out')}\\n        />\\n        <Metric id=\\\"metric\\\" data={chartData} />\\n      </Chart>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","var api = require(\"!../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n            var content = require(\"!!../../../node_modules/css-loader/dist/cjs.js??ref--17-1!../../../node_modules/postcss-loader/dist/cjs.js??ref--17-2!../../../node_modules/sass-loader/dist/cjs.js??ref--17-3!./3_body.scss\");\n\n            content = content.__esModule ? content.default : content;\n\n            if (typeof content === 'string') {\n              content = [[module.id, content, '']];\n            }\n\nvar options = {\"attributes\":{\"nonce\":\"Pk1rZ1XDlMuYe8ubWV3Lh0BzwrTigJQ=\"}};\n\noptions.insert = \"head\";\noptions.singleton = false;\n\nvar update = api(content, options);\n\n\n\nmodule.exports = content.locals || {};","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui';\\nimport { action } from '@storybook/addon-actions';\\nimport { select, boolean, text, color, number } from '@storybook/addon-knobs';\\nimport classNames from 'classnames';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  isMetricElementEvent,\\n  Metric,\\n  MetricWProgress,\\n  MetricWTrend,\\n  MetricWNumber,\\n  Settings,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nimport './3_body.scss';\\n\\nexport const Example: ChartsStory = (_, { title: storyTitle, description }) => {\\n  const title = text('title', 'SLO: Frontend Latency');\\n  const subtitle = text('subtitle', '');\\n  const progressOrTrend = select(\\n    'progress or trend',\\n    {\\n      trend: 'trend',\\n      bar: 'bar',\\n      none: 'none',\\n    },\\n    'trend',\\n  );\\n  const progressBarDirection = select(\\n    'progress bar direction',\\n    { horizontal: 'horizontal', vertical: 'vertical' },\\n    'vertical',\\n  );\\n\\n  let extra = text('extra', 'Target <b>99.00%</b>');\\n  const progressMax = number('progress max', 100);\\n  const value = text('value', '99.45');\\n  const valuePostfix = text('value postfix', ' %');\\n  const metricColor = color('color', '#3c3c3c');\\n  extra = extra.replace('&lt;b&gt;', '<b>');\\n  extra = extra.replace('&lt;/b&gt;', '</b>');\\n  const showIcon = boolean('show icon', true);\\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'visGauge');\\n  const showValueIcon = boolean('show value icon', false);\\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\\n  const showBody = boolean('show body contents', true);\\n  const showBodyArea = boolean('show full body area', false);\\n  const getIcon =\\n    (type: string) =>\\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n    );\\n  const data = {\\n    color: metricColor,\\n    title,\\n    subtitle,\\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\\n  };\\n\\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\\n    ...data,\\n    body: !showBody ? null : (\\n      <div className={classNames('myCustomMetricSlot', { showBodyArea })} style={{ paddingTop: 8 }}>\\n        <div>\\n          <EuiFlexGroup wrap responsive={false} gutterSize=\\\"s\\\">\\n            <EuiFlexItem grow={false}>\\n              <EuiBadge color=\\\"success\\\">Healthy</EuiBadge>\\n            </EuiFlexItem>\\n            <EuiFlexItem grow={false}>\\n              <EuiBadge\\n                onMouseDown={(e): void => {\\n                  e.stopPropagation(); // stops propagation of metric onElementClick\\n                }}\\n                onClickAriaLabel=\\\"\\\"\\n                onClick={() => action('badge click')()}\\n                color=\\\"danger\\\"\\n                iconType=\\\"warning\\\"\\n                iconSide=\\\"left\\\"\\n              >\\n                13\\n              </EuiBadge>\\n            </EuiFlexItem>\\n          </EuiFlexGroup>\\n        </div>\\n      </div>\\n    ),\\n    value: Number.parseFloat(value),\\n    valueFormatter: (d: number) => `${d}${valuePostfix}`,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 40).map(([x, y]) => ({ x, y })),\\n        }\\n      : {}),\\n  };\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n\\n  const configuredData = [[numericData]];\\n  return (\\n    <Chart title={storyTitle} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        onElementClick={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventClickAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOver={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventOverAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOut={() => onEventOutAction('out')}\\n      />\\n      <Metric id=\\\"1\\\" data={configuredData} />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    height: '300px',\\n    width: '300px',\\n  },\\n  markdown: `Warning: :warning: This feature should be used with care. The body content does not take up space in order to preserve the rendering of elements of the Metric.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":144},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":144}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui';\nimport { action } from '@storybook/addon-actions';\nimport { select, boolean, text, color, number } from '@storybook/addon-knobs';\nimport classNames from 'classnames';\nimport React from 'react';\n\nimport {\n  Chart,\n  isMetricElementEvent,\n  Metric,\n  MetricWProgress,\n  MetricWTrend,\n  MetricWNumber,\n  Settings,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nimport './3_body.scss';\n\nexport const Example: ChartsStory = (_, { title: storyTitle, description }) => {\n  const title = text('title', 'SLO: Frontend Latency');\n  const subtitle = text('subtitle', '');\n  const progressOrTrend = select(\n    'progress or trend',\n    {\n      trend: 'trend',\n      bar: 'bar',\n      none: 'none',\n    },\n    'trend',\n  );\n  const progressBarDirection = select(\n    'progress bar direction',\n    { horizontal: 'horizontal', vertical: 'vertical' },\n    'vertical',\n  );\n\n  let extra = text('extra', 'Target <b>99.00%</b>');\n  const progressMax = number('progress max', 100);\n  const value = text('value', '99.45');\n  const valuePostfix = text('value postfix', ' %');\n  const metricColor = color('color', '#3c3c3c');\n  extra = extra.replace('&lt;b&gt;', '<b>');\n  extra = extra.replace('&lt;/b&gt;', '</b>');\n  const showIcon = boolean('show icon', true);\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'visGauge');\n  const showValueIcon = boolean('show value icon', false);\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\n  const showBody = boolean('show body contents', true);\n  const showBodyArea = boolean('show full body area', false);\n  const getIcon =\n    (type: string) =>\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\n    );\n  const data = {\n    color: metricColor,\n    title,\n    subtitle,\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\n  };\n\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\n    ...data,\n    body: !showBody ? null : (\n      <div className={classNames('myCustomMetricSlot', { showBodyArea })} style={{ paddingTop: 8 }}>\n        <div>\n          <EuiFlexGroup wrap responsive={false} gutterSize=\"s\">\n            <EuiFlexItem grow={false}>\n              <EuiBadge color=\"success\">Healthy</EuiBadge>\n            </EuiFlexItem>\n            <EuiFlexItem grow={false}>\n              <EuiBadge\n                onMouseDown={(e): void => {\n                  e.stopPropagation(); // stops propagation of metric onElementClick\n                }}\n                onClickAriaLabel=\"\"\n                onClick={() => action('badge click')()}\n                color=\"danger\"\n                iconType=\"warning\"\n                iconSide=\"left\"\n              >\n                13\n              </EuiBadge>\n            </EuiFlexItem>\n          </EuiFlexGroup>\n        </div>\n      </div>\n    ),\n    value: Number.parseFloat(value),\n    valueFormatter: (d: number) => `${d}${valuePostfix}`,\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\n    ...(progressOrTrend === 'trend'\n      ? {\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 40).map(([x, y]) => ({ x, y })),\n        }\n      : {}),\n  };\n\n  const onEventClickAction = action('click');\n  const onEventOverAction = action('over');\n  const onEventOutAction = action('out');\n\n  const configuredData = [[numericData]];\n  return (\n    <Chart title={storyTitle} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        onElementClick={([d]) => {\n          if (isMetricElementEvent(d)) {\n            const { rowIndex, columnIndex } = d;\n            onEventClickAction(\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\n            );\n          }\n        }}\n        onElementOver={([d]) => {\n          if (isMetricElementEvent(d)) {\n            const { rowIndex, columnIndex } = d;\n            onEventOverAction(\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\n            );\n          }\n        }}\n        onElementOut={() => onEventOutAction('out')}\n      />\n      <Metric id=\"1\" data={configuredData} />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    height: '300px',\n    width: '300px',\n  },\n  markdown: `Warning: :warning: This feature should be used with care. The body content does not take up space in order to preserve the rendering of elements of the Metric.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title: storyTitle, description }) => {\\n  const title = text('title', 'SLO: Frontend Latency');\\n  const subtitle = text('subtitle', '');\\n  const progressOrTrend = select(\\n    'progress or trend',\\n    {\\n      trend: 'trend',\\n      bar: 'bar',\\n      none: 'none',\\n    },\\n    'trend',\\n  );\\n  const progressBarDirection = select(\\n    'progress bar direction',\\n    { horizontal: 'horizontal', vertical: 'vertical' },\\n    'vertical',\\n  );\\n\\n  let extra = text('extra', 'Target <b>99.00%</b>');\\n  const progressMax = number('progress max', 100);\\n  const value = text('value', '99.45');\\n  const valuePostfix = text('value postfix', ' %');\\n  const metricColor = color('color', '#3c3c3c');\\n  extra = extra.replace('&lt;b&gt;', '<b>');\\n  extra = extra.replace('&lt;/b&gt;', '</b>');\\n  const showIcon = boolean('show icon', true);\\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'visGauge');\\n  const showValueIcon = boolean('show value icon', false);\\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\\n  const showBody = boolean('show body contents', true);\\n  const showBodyArea = boolean('show full body area', false);\\n  const getIcon =\\n    (type: string) =>\\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n    );\\n  const data = {\\n    color: metricColor,\\n    title,\\n    subtitle,\\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\\n  };\\n\\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\\n    ...data,\\n    body: !showBody ? null : (\\n      <div className={classNames('myCustomMetricSlot', { showBodyArea })} style={{ paddingTop: 8 }}>\\n        <div>\\n          <EuiFlexGroup wrap responsive={false} gutterSize=\\\"s\\\">\\n            <EuiFlexItem grow={false}>\\n              <EuiBadge color=\\\"success\\\">Healthy</EuiBadge>\\n            </EuiFlexItem>\\n            <EuiFlexItem grow={false}>\\n              <EuiBadge\\n                onMouseDown={(e): void => {\\n                  e.stopPropagation(); // stops propagation of metric onElementClick\\n                }}\\n                onClickAriaLabel=\\\"\\\"\\n                onClick={() => action('badge click')()}\\n                color=\\\"danger\\\"\\n                iconType=\\\"warning\\\"\\n                iconSide=\\\"left\\\"\\n              >\\n                13\\n              </EuiBadge>\\n            </EuiFlexItem>\\n          </EuiFlexGroup>\\n        </div>\\n      </div>\\n    ),\\n    value: Number.parseFloat(value),\\n    valueFormatter: (d: number) => `${d}${valuePostfix}`,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 40).map(([x, y]) => ({ x, y })),\\n        }\\n      : {}),\\n  };\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n\\n  const configuredData = [[numericData]];\\n  return (\\n    <Chart title={storyTitle} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        onElementClick={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventClickAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOver={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventOverAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOut={() => onEventOutAction('out')}\\n      />\\n      <Metric id=\\\"1\\\" data={configuredData} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Metric (@alpha)',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as grid } from './2_grid.story';\nexport { Example as bodyContent } from './3_body.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"line\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 3 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 10 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"areas\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.5 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2.8 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <AreaSeries\n      id=\"areas\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2.5 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 2.8 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 10 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"areas\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.5 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2.8 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, BarSeries, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <AreaSeries\\n      id=\\\"areas\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n      data={[\\n        { x: 0, y: 2.5 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, BarSeries, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description} renderer=\"canvas\">\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n    <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n    <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <AreaSeries\n      id=\"areas\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_MONOTONE_X}\n      data={[\n        { x: 0, y: 2.5 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <AreaSeries\\n      id=\\\"areas\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n      data={[\\n        { x: 0, y: 2.5 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 5],\\n    [2, 4],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 2],\\n    [7, 3],\\n    [8, 4],\\n    [9, 5],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"data1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"data2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data2}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":64},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":64}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 1],\n  ];\n  const data2 = [\n    [1, 5],\n    [2, 4],\n    [3, 3],\n    [4, 2],\n    [5, 1],\n    [6, 2],\n    [7, 3],\n    [8, 4],\n    [9, 5],\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"data1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data1}\n      />\n      <LineSeries\n        id=\"data2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data2}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 5],\\n    [2, 4],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 2],\\n    [7, 3],\\n    [8, 4],\\n    [9, 5],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"data1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"data2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data2}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { timeFormatter } from '@elastic/charts/src/utils/data/formatters';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data1 = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  const data2 = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  const dateFormatter = timeFormatter('HH:mm:ss');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"data1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"data2\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[2]}\\n        data={data2}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\nimport { timeFormatter } from '@elastic/charts/src/utils/data/formatters';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data1 = [\n    [start.toMillis(), 1, 4],\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\n  ];\n  const data2 = [\n    [start.toMillis(), 1, 4],\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\n  ];\n  const dateFormatter = timeFormatter('HH:mm:ss');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"data1\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data1}\n      />\n      <LineSeries\n        id=\"data2\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[2]}\n        data={data2}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data1 = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  const data2 = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  const dateFormatter = timeFormatter('HH:mm:ss');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"data1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"data2\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[2]}\\n        data={data2}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, boolean, color, number, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Fit,\\n  SeriesType,\\n  RecursivePartial,\\n} from '@elastic/charts';\\n\\nimport { ColorVariant } from '../../../packages/charts/src/utils/common';\\nimport { AreaFitStyle, LineFitStyle, TextureShape } from '../../../packages/charts/src/utils/themes/theme';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\ninterface MixedDatum {\\n  x: number | string;\\n  y: number | string | null;\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const dataTypes: Record<string, MixedDatum[]> = {\\n    isolated: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 3, y: 4 },\\n      { x: 4, y: null },\\n      { x: 5, y: 5 },\\n      { x: 6, y: null },\\n      { x: 7, y: 12 },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    successive: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 4, y: null },\\n      { x: 6, y: null },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    endPoints: [\\n      { x: 0, y: null },\\n      { x: 1, y: 5 },\\n      { x: 3, y: 4 },\\n      { x: 5, y: 5 },\\n      { x: 7, y: 12 },\\n      { x: 9, y: 10 },\\n      { x: 10, y: null },\\n    ],\\n    ordinal: [\\n      { x: 'a', y: null },\\n      { x: 'b', y: 3 },\\n      { x: 'c', y: 5 },\\n      { x: 'd', y: null },\\n      { x: 'e', y: 4 },\\n      { x: 'f', y: null },\\n      { x: 'g', y: 5 },\\n      { x: 'h', y: 6 },\\n      { x: 'i', y: null },\\n      { x: 'j', y: null },\\n      { x: 'k', y: null },\\n      { x: 'l', y: 12 },\\n      { x: 'm', y: null },\\n    ],\\n    all: [\\n      { x: 0, y: null },\\n      { x: 1, y: 3 },\\n      { x: 2, y: 5 },\\n      { x: 3, y: null },\\n      { x: 4, y: 4 },\\n      { x: 5, y: null },\\n      { x: 6, y: 5 },\\n      { x: 7, y: 6 },\\n      { x: 8, y: null },\\n      { x: 9, y: null },\\n      { x: 10, y: null },\\n      { x: 11, y: 12 },\\n      { x: 12, y: null },\\n    ],\\n  };\\n\\n  const seriesType = select<string>(\\n    'seriesType',\\n    {\\n      Area: SeriesType.Area,\\n      Line: SeriesType.Line,\\n    },\\n    SeriesType.Area,\\n  );\\n  const dataKey = select<keyof typeof dataTypes>(\\n    'dataset',\\n    {\\n      'Isolated Points': 'isolated',\\n      'Successive null Points': 'successive',\\n      'null end points': 'endPoints',\\n      'Ordinal x values': 'ordinal',\\n      'All edge cases': 'all',\\n    },\\n    'all',\\n  );\\n  const dataset = dataTypes[dataKey];\\n  const fit = customKnobs.enum.fit();\\n  const curve = customKnobs.enum.curve();\\n  const endValue = select<number | 'none' | 'nearest'>(\\n    'End value',\\n    {\\n      None: 'none',\\n      nearest: 'nearest',\\n      0: 0,\\n      2: 2,\\n    },\\n    'none',\\n  );\\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\\n  const value = number('Explicit value (using Fit.Explicit)', 5);\\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\\n  const baseTheme = useBaseTheme();\\n\\n  const useSeriesColorLine = boolean('use series color for line', true, 'fit style');\\n  const customLineColor = color('fit line color', 'rgba(0,0,0,1)', 'fit style');\\n\\n  const fitLineStyle: RecursivePartial<LineFitStyle> = {\\n    opacity: number(\\n      'fit line opacity',\\n      seriesType === SeriesType.Area\\n        ? baseTheme.areaSeriesStyle.fit.line.opacity\\n        : baseTheme.lineSeriesStyle.fit.line.opacity,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.05,\\n      },\\n      'fit style',\\n    ),\\n    stroke: useSeriesColorLine ? ColorVariant.Series : customLineColor,\\n    dash: text(\\n      'fit line dash array',\\n      (seriesType === SeriesType.Area\\n        ? baseTheme.areaSeriesStyle.fit.line.dash\\n        : baseTheme.lineSeriesStyle.fit.line.dash\\n      ).join(','),\\n      'fit style',\\n    )\\n      .split(',')\\n      .map(Number),\\n  };\\n  const useSeriesColor = boolean('use series color for area', true, 'fit style');\\n  const fitAreaCustomColor = color('fit area color', 'rgba(0,0,0,1)', 'fit style');\\n  const fitAreaOpacity = number(\\n    'fit area opacity',\\n    baseTheme.areaSeriesStyle.fit.area.opacity,\\n    {\\n      range: true,\\n      min: 0,\\n      max: baseTheme.areaSeriesStyle.area.opacity,\\n      step: 0.01,\\n    },\\n    'fit style',\\n  );\\n  const fitAreaStyle: RecursivePartial<AreaFitStyle> = {\\n    opacity: fitAreaOpacity,\\n    fill: useSeriesColor ? ColorVariant.Series : fitAreaCustomColor,\\n    texture: boolean('use texture on area', false, 'fit style')\\n      ? { shape: TextureShape.Line, rotation: -45, opacity: fitAreaOpacity }\\n      : undefined,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={baseTheme}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} />\\n      {seriesType === SeriesType.Area ? (\\n        <AreaSeries\\n          id=\\\"test\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          curve={curve}\\n          fit={{\\n            type: fit,\\n            value: fit === Fit.Explicit ? value : undefined,\\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\\n          }}\\n          areaSeriesStyle={{\\n            fit: {\\n              line: fitLineStyle,\\n              area: fitAreaStyle,\\n            },\\n          }}\\n          data={dataset}\\n        />\\n      ) : (\\n        <LineSeries\\n          id=\\\"test\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          curve={curve}\\n          fit={{\\n            type: fit,\\n            value: fit === Fit.Explicit ? value : undefined,\\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\\n          }}\\n          lineSeriesStyle={{\\n            fit: {\\n              line: fitLineStyle,\\n            },\\n          }}\\n          data={dataset}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":36},\"endLoc\":{\"col\":1,\"line\":249},\"startBody\":{\"col\":36,\"line\":36},\"endBody\":{\"col\":1,\"line\":249}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, boolean, color, number, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  Fit,\n  SeriesType,\n  RecursivePartial,\n} from '@elastic/charts';\n\nimport { ColorVariant } from '../../../packages/charts/src/utils/common';\nimport { AreaFitStyle, LineFitStyle, TextureShape } from '../../../packages/charts/src/utils/themes/theme';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\ninterface MixedDatum {\n  x: number | string;\n  y: number | string | null;\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const dataTypes: Record<string, MixedDatum[]> = {\n    isolated: [\n      { x: 0, y: 3 },\n      { x: 1, y: 5 },\n      { x: 2, y: null },\n      { x: 3, y: 4 },\n      { x: 4, y: null },\n      { x: 5, y: 5 },\n      { x: 6, y: null },\n      { x: 7, y: 12 },\n      { x: 8, y: null },\n      { x: 9, y: 10 },\n      { x: 10, y: 7 },\n    ],\n    successive: [\n      { x: 0, y: 3 },\n      { x: 1, y: 5 },\n      { x: 2, y: null },\n      { x: 4, y: null },\n      { x: 6, y: null },\n      { x: 8, y: null },\n      { x: 9, y: 10 },\n      { x: 10, y: 7 },\n    ],\n    endPoints: [\n      { x: 0, y: null },\n      { x: 1, y: 5 },\n      { x: 3, y: 4 },\n      { x: 5, y: 5 },\n      { x: 7, y: 12 },\n      { x: 9, y: 10 },\n      { x: 10, y: null },\n    ],\n    ordinal: [\n      { x: 'a', y: null },\n      { x: 'b', y: 3 },\n      { x: 'c', y: 5 },\n      { x: 'd', y: null },\n      { x: 'e', y: 4 },\n      { x: 'f', y: null },\n      { x: 'g', y: 5 },\n      { x: 'h', y: 6 },\n      { x: 'i', y: null },\n      { x: 'j', y: null },\n      { x: 'k', y: null },\n      { x: 'l', y: 12 },\n      { x: 'm', y: null },\n    ],\n    all: [\n      { x: 0, y: null },\n      { x: 1, y: 3 },\n      { x: 2, y: 5 },\n      { x: 3, y: null },\n      { x: 4, y: 4 },\n      { x: 5, y: null },\n      { x: 6, y: 5 },\n      { x: 7, y: 6 },\n      { x: 8, y: null },\n      { x: 9, y: null },\n      { x: 10, y: null },\n      { x: 11, y: 12 },\n      { x: 12, y: null },\n    ],\n  };\n\n  const seriesType = select<string>(\n    'seriesType',\n    {\n      Area: SeriesType.Area,\n      Line: SeriesType.Line,\n    },\n    SeriesType.Area,\n  );\n  const dataKey = select<keyof typeof dataTypes>(\n    'dataset',\n    {\n      'Isolated Points': 'isolated',\n      'Successive null Points': 'successive',\n      'null end points': 'endPoints',\n      'Ordinal x values': 'ordinal',\n      'All edge cases': 'all',\n    },\n    'all',\n  );\n  const dataset = dataTypes[dataKey];\n  const fit = customKnobs.enum.fit();\n  const curve = customKnobs.enum.curve();\n  const endValue = select<number | 'none' | 'nearest'>(\n    'End value',\n    {\n      None: 'none',\n      nearest: 'nearest',\n      0: 0,\n      2: 2,\n    },\n    'none',\n  );\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\n  const value = number('Explicit value (using Fit.Explicit)', 5);\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\n  const baseTheme = useBaseTheme();\n\n  const useSeriesColorLine = boolean('use series color for line', true, 'fit style');\n  const customLineColor = color('fit line color', 'rgba(0,0,0,1)', 'fit style');\n\n  const fitLineStyle: RecursivePartial<LineFitStyle> = {\n    opacity: number(\n      'fit line opacity',\n      seriesType === SeriesType.Area\n        ? baseTheme.areaSeriesStyle.fit.line.opacity\n        : baseTheme.lineSeriesStyle.fit.line.opacity,\n      {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.05,\n      },\n      'fit style',\n    ),\n    stroke: useSeriesColorLine ? ColorVariant.Series : customLineColor,\n    dash: text(\n      'fit line dash array',\n      (seriesType === SeriesType.Area\n        ? baseTheme.areaSeriesStyle.fit.line.dash\n        : baseTheme.lineSeriesStyle.fit.line.dash\n      ).join(','),\n      'fit style',\n    )\n      .split(',')\n      .map(Number),\n  };\n  const useSeriesColor = boolean('use series color for area', true, 'fit style');\n  const fitAreaCustomColor = color('fit area color', 'rgba(0,0,0,1)', 'fit style');\n  const fitAreaOpacity = number(\n    'fit area opacity',\n    baseTheme.areaSeriesStyle.fit.area.opacity,\n    {\n      range: true,\n      min: 0,\n      max: baseTheme.areaSeriesStyle.area.opacity,\n      step: 0.01,\n    },\n    'fit style',\n  );\n  const fitAreaStyle: RecursivePartial<AreaFitStyle> = {\n    opacity: fitAreaOpacity,\n    fill: useSeriesColor ? ColorVariant.Series : fitAreaCustomColor,\n    texture: boolean('use texture on area', false, 'fit style')\n      ? { shape: TextureShape.Line, rotation: -45, opacity: fitAreaOpacity }\n      : undefined,\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={{\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n            },\n          },\n        }}\n        baseTheme={baseTheme}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} />\n      {seriesType === SeriesType.Area ? (\n        <AreaSeries\n          id=\"test\"\n          xScaleType={xScaleType}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          curve={curve}\n          fit={{\n            type: fit,\n            value: fit === Fit.Explicit ? value : undefined,\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\n          }}\n          areaSeriesStyle={{\n            fit: {\n              line: fitLineStyle,\n              area: fitAreaStyle,\n            },\n          }}\n          data={dataset}\n        />\n      ) : (\n        <LineSeries\n          id=\"test\"\n          xScaleType={xScaleType}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          curve={curve}\n          fit={{\n            type: fit,\n            value: fit === Fit.Explicit ? value : undefined,\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\n          }}\n          lineSeriesStyle={{\n            fit: {\n              line: fitLineStyle,\n            },\n          }}\n          data={dataset}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const dataTypes: Record<string, MixedDatum[]> = {\\n    isolated: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 3, y: 4 },\\n      { x: 4, y: null },\\n      { x: 5, y: 5 },\\n      { x: 6, y: null },\\n      { x: 7, y: 12 },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    successive: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 4, y: null },\\n      { x: 6, y: null },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    endPoints: [\\n      { x: 0, y: null },\\n      { x: 1, y: 5 },\\n      { x: 3, y: 4 },\\n      { x: 5, y: 5 },\\n      { x: 7, y: 12 },\\n      { x: 9, y: 10 },\\n      { x: 10, y: null },\\n    ],\\n    ordinal: [\\n      { x: 'a', y: null },\\n      { x: 'b', y: 3 },\\n      { x: 'c', y: 5 },\\n      { x: 'd', y: null },\\n      { x: 'e', y: 4 },\\n      { x: 'f', y: null },\\n      { x: 'g', y: 5 },\\n      { x: 'h', y: 6 },\\n      { x: 'i', y: null },\\n      { x: 'j', y: null },\\n      { x: 'k', y: null },\\n      { x: 'l', y: 12 },\\n      { x: 'm', y: null },\\n    ],\\n    all: [\\n      { x: 0, y: null },\\n      { x: 1, y: 3 },\\n      { x: 2, y: 5 },\\n      { x: 3, y: null },\\n      { x: 4, y: 4 },\\n      { x: 5, y: null },\\n      { x: 6, y: 5 },\\n      { x: 7, y: 6 },\\n      { x: 8, y: null },\\n      { x: 9, y: null },\\n      { x: 10, y: null },\\n      { x: 11, y: 12 },\\n      { x: 12, y: null },\\n    ],\\n  };\\n\\n  const seriesType = select<string>(\\n    'seriesType',\\n    {\\n      Area: SeriesType.Area,\\n      Line: SeriesType.Line,\\n    },\\n    SeriesType.Area,\\n  );\\n  const dataKey = select<keyof typeof dataTypes>(\\n    'dataset',\\n    {\\n      'Isolated Points': 'isolated',\\n      'Successive null Points': 'successive',\\n      'null end points': 'endPoints',\\n      'Ordinal x values': 'ordinal',\\n      'All edge cases': 'all',\\n    },\\n    'all',\\n  );\\n  const dataset = dataTypes[dataKey];\\n  const fit = customKnobs.enum.fit();\\n  const curve = customKnobs.enum.curve();\\n  const endValue = select<number | 'none' | 'nearest'>(\\n    'End value',\\n    {\\n      None: 'none',\\n      nearest: 'nearest',\\n      0: 0,\\n      2: 2,\\n    },\\n    'none',\\n  );\\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\\n  const value = number('Explicit value (using Fit.Explicit)', 5);\\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\\n  const baseTheme = useBaseTheme();\\n\\n  const useSeriesColorLine = boolean('use series color for line', true, 'fit style');\\n  const customLineColor = color('fit line color', 'rgba(0,0,0,1)', 'fit style');\\n\\n  const fitLineStyle: RecursivePartial<LineFitStyle> = {\\n    opacity: number(\\n      'fit line opacity',\\n      seriesType === SeriesType.Area\\n        ? baseTheme.areaSeriesStyle.fit.line.opacity\\n        : baseTheme.lineSeriesStyle.fit.line.opacity,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.05,\\n      },\\n      'fit style',\\n    ),\\n    stroke: useSeriesColorLine ? ColorVariant.Series : customLineColor,\\n    dash: text(\\n      'fit line dash array',\\n      (seriesType === SeriesType.Area\\n        ? baseTheme.areaSeriesStyle.fit.line.dash\\n        : baseTheme.lineSeriesStyle.fit.line.dash\\n      ).join(','),\\n      'fit style',\\n    )\\n      .split(',')\\n      .map(Number),\\n  };\\n  const useSeriesColor = boolean('use series color for area', true, 'fit style');\\n  const fitAreaCustomColor = color('fit area color', 'rgba(0,0,0,1)', 'fit style');\\n  const fitAreaOpacity = number(\\n    'fit area opacity',\\n    baseTheme.areaSeriesStyle.fit.area.opacity,\\n    {\\n      range: true,\\n      min: 0,\\n      max: baseTheme.areaSeriesStyle.area.opacity,\\n      step: 0.01,\\n    },\\n    'fit style',\\n  );\\n  const fitAreaStyle: RecursivePartial<AreaFitStyle> = {\\n    opacity: fitAreaOpacity,\\n    fill: useSeriesColor ? ColorVariant.Series : fitAreaCustomColor,\\n    texture: boolean('use texture on area', false, 'fit style')\\n      ? { shape: TextureShape.Line, rotation: -45, opacity: fitAreaOpacity }\\n      : undefined,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={baseTheme}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} />\\n      {seriesType === SeriesType.Area ? (\\n        <AreaSeries\\n          id=\\\"test\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          curve={curve}\\n          fit={{\\n            type: fit,\\n            value: fit === Fit.Explicit ? value : undefined,\\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\\n          }}\\n          areaSeriesStyle={{\\n            fit: {\\n              line: fitLineStyle,\\n              area: fitAreaStyle,\\n            },\\n          }}\\n          data={dataset}\\n        />\\n      ) : (\\n        <LineSeries\\n          id=\\\"test\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          curve={curve}\\n          fit={{\\n            type: fit,\\n            value: fit === Fit.Explicit ? value : undefined,\\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\\n          }}\\n          lineSeriesStyle={{\\n            fit: {\\n              line: fitLineStyle,\\n            },\\n          }}\\n          data={dataset}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, number, boolean } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, Fit, StackMode } from '@elastic/charts';\\nimport { getRandomNumberGenerator, getRNGSeed } from '@elastic/charts/src/mocks/utils';\\n\\nimport { TextureShape } from '../../../packages/charts/src/utils/themes/theme';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const randomizeBoundingData = getRNGSeed() ? false : boolean('randomize bounding data', false);\\n  const dataTypes: Record<string, Array<{ x: number | string; y: number | null }>> = {\\n    isolated: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 3, y: 4 },\\n      { x: 4, y: null },\\n      { x: 5, y: 5 },\\n      { x: 6, y: null },\\n      { x: 7, y: 12 },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    successive: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 4, y: null },\\n      { x: 6, y: null },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    endPoints: [\\n      { x: 0, y: null },\\n      { x: 1, y: 5 },\\n      { x: 3, y: 4 },\\n      { x: 5, y: 5 },\\n      { x: 7, y: 12 },\\n      { x: 9, y: 10 },\\n      { x: 10, y: null },\\n    ],\\n    ordinal: [\\n      { x: 'a', y: null },\\n      { x: 'b', y: 3 },\\n      { x: 'c', y: 5 },\\n      { x: 'd', y: null },\\n      { x: 'e', y: 4 },\\n      { x: 'f', y: null },\\n      { x: 'g', y: 5 },\\n      { x: 'h', y: 6 },\\n      { x: 'i', y: null },\\n      { x: 'j', y: null },\\n      { x: 'k', y: null },\\n      { x: 'l', y: 12 },\\n      { x: 'm', y: null },\\n    ],\\n    all: [\\n      { x: 0, y: null },\\n      { x: 1, y: 3 },\\n      { x: 2, y: 5 },\\n      { x: 3, y: null },\\n      { x: 4, y: 4 },\\n      { x: 5, y: null },\\n      { x: 6, y: 5 },\\n      { x: 7, y: 6 },\\n      { x: 8, y: null },\\n      { x: 9, y: null },\\n      { x: 10, y: null },\\n      { x: 11, y: 12 },\\n      { x: 12, y: null },\\n    ],\\n  };\\n\\n  const stackMode = select<StackMode | 'none'>(\\n    'stackMode',\\n    {\\n      Percentage: StackMode.Percentage,\\n      Silhouette: StackMode.Silhouette,\\n      Wiggle: StackMode.Wiggle,\\n      None: 'none',\\n    },\\n    'none',\\n  );\\n\\n  const dataKey = select<keyof typeof dataTypes>(\\n    'dataset',\\n    {\\n      'Isolated Points': 'isolated',\\n      'Successive null Points': 'successive',\\n      'null end points': 'endPoints',\\n      'Ordinal x values': 'ordinal',\\n      'All edge cases': 'all',\\n    },\\n    'all',\\n  );\\n\\n  const dataset = dataTypes[dataKey];\\n  const fit = customKnobs.enum.fit();\\n  const curve = customKnobs.enum.curve();\\n  const endValue = select<number | 'none' | 'nearest'>(\\n    'End value',\\n    {\\n      None: 'none',\\n      nearest: 'nearest',\\n      0: 0,\\n      2: 2,\\n    },\\n    'none',\\n  );\\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\\n  const value = number('Explicit value (using Fit.Explicit)', 5);\\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\\n  const rngSeed = randomizeBoundingData ? undefined : getRNGSeed('__seed__');\\n  const rng = getRandomNumberGenerator(rngSeed);\\n  const tickFormat = stackMode === 'percentage' ? (d: any) => numeral(d).format('0[.]00%') : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={tickFormat} />\\n      <AreaSeries\\n        id=\\\"test3\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={curve}\\n        stackAccessors={['x']}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset.map((d: any) => ({\\n          ...d,\\n          y: rng(2, 10),\\n        }))}\\n      />\\n      <AreaSeries\\n        id=\\\"test\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        stackMode={stackMode === 'none' ? undefined : stackMode}\\n        curve={curve}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset}\\n        areaSeriesStyle={\\n          boolean('apply custom fit style', false)\\n            ? {\\n                fit: {\\n                  line: {\\n                    stroke: 'gray',\\n                    opacity: 0.5,\\n                  },\\n                  area: {\\n                    fill: 'gray',\\n                    texture: {\\n                      shape: TextureShape.Line,\\n                      rotation: -45,\\n                      opacity: 0.2,\\n                    },\\n                  },\\n                },\\n              }\\n            : undefined\\n        }\\n      />\\n      <AreaSeries\\n        id=\\\"test2\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={curve}\\n        stackAccessors={['x']}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset.map((d) => ({\\n          ...d,\\n          y: rng(2, 10),\\n        }))}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":220},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":220}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, number, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, Fit, StackMode } from '@elastic/charts';\nimport { getRandomNumberGenerator, getRNGSeed } from '@elastic/charts/src/mocks/utils';\n\nimport { TextureShape } from '../../../packages/charts/src/utils/themes/theme';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const randomizeBoundingData = getRNGSeed() ? false : boolean('randomize bounding data', false);\n  const dataTypes: Record<string, Array<{ x: number | string; y: number | null }>> = {\n    isolated: [\n      { x: 0, y: 3 },\n      { x: 1, y: 5 },\n      { x: 2, y: null },\n      { x: 3, y: 4 },\n      { x: 4, y: null },\n      { x: 5, y: 5 },\n      { x: 6, y: null },\n      { x: 7, y: 12 },\n      { x: 8, y: null },\n      { x: 9, y: 10 },\n      { x: 10, y: 7 },\n    ],\n    successive: [\n      { x: 0, y: 3 },\n      { x: 1, y: 5 },\n      { x: 2, y: null },\n      { x: 4, y: null },\n      { x: 6, y: null },\n      { x: 8, y: null },\n      { x: 9, y: 10 },\n      { x: 10, y: 7 },\n    ],\n    endPoints: [\n      { x: 0, y: null },\n      { x: 1, y: 5 },\n      { x: 3, y: 4 },\n      { x: 5, y: 5 },\n      { x: 7, y: 12 },\n      { x: 9, y: 10 },\n      { x: 10, y: null },\n    ],\n    ordinal: [\n      { x: 'a', y: null },\n      { x: 'b', y: 3 },\n      { x: 'c', y: 5 },\n      { x: 'd', y: null },\n      { x: 'e', y: 4 },\n      { x: 'f', y: null },\n      { x: 'g', y: 5 },\n      { x: 'h', y: 6 },\n      { x: 'i', y: null },\n      { x: 'j', y: null },\n      { x: 'k', y: null },\n      { x: 'l', y: 12 },\n      { x: 'm', y: null },\n    ],\n    all: [\n      { x: 0, y: null },\n      { x: 1, y: 3 },\n      { x: 2, y: 5 },\n      { x: 3, y: null },\n      { x: 4, y: 4 },\n      { x: 5, y: null },\n      { x: 6, y: 5 },\n      { x: 7, y: 6 },\n      { x: 8, y: null },\n      { x: 9, y: null },\n      { x: 10, y: null },\n      { x: 11, y: 12 },\n      { x: 12, y: null },\n    ],\n  };\n\n  const stackMode = select<StackMode | 'none'>(\n    'stackMode',\n    {\n      Percentage: StackMode.Percentage,\n      Silhouette: StackMode.Silhouette,\n      Wiggle: StackMode.Wiggle,\n      None: 'none',\n    },\n    'none',\n  );\n\n  const dataKey = select<keyof typeof dataTypes>(\n    'dataset',\n    {\n      'Isolated Points': 'isolated',\n      'Successive null Points': 'successive',\n      'null end points': 'endPoints',\n      'Ordinal x values': 'ordinal',\n      'All edge cases': 'all',\n    },\n    'all',\n  );\n\n  const dataset = dataTypes[dataKey];\n  const fit = customKnobs.enum.fit();\n  const curve = customKnobs.enum.curve();\n  const endValue = select<number | 'none' | 'nearest'>(\n    'End value',\n    {\n      None: 'none',\n      nearest: 'nearest',\n      0: 0,\n      2: 2,\n    },\n    'none',\n  );\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\n  const value = number('Explicit value (using Fit.Explicit)', 5);\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\n  const rngSeed = randomizeBoundingData ? undefined : getRNGSeed('__seed__');\n  const rng = getRandomNumberGenerator(rngSeed);\n  const tickFormat = stackMode === 'percentage' ? (d: any) => numeral(d).format('0[.]00%') : undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={{\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} tickFormat={tickFormat} />\n      <AreaSeries\n        id=\"test3\"\n        xScaleType={xScaleType}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={curve}\n        stackAccessors={['x']}\n        fit={{\n          type: fit,\n          value: fit === Fit.Explicit ? value : undefined,\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\n        }}\n        data={dataset.map((d: any) => ({\n          ...d,\n          y: rng(2, 10),\n        }))}\n      />\n      <AreaSeries\n        id=\"test\"\n        xScaleType={xScaleType}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        stackMode={stackMode === 'none' ? undefined : stackMode}\n        curve={curve}\n        fit={{\n          type: fit,\n          value: fit === Fit.Explicit ? value : undefined,\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\n        }}\n        data={dataset}\n        areaSeriesStyle={\n          boolean('apply custom fit style', false)\n            ? {\n                fit: {\n                  line: {\n                    stroke: 'gray',\n                    opacity: 0.5,\n                  },\n                  area: {\n                    fill: 'gray',\n                    texture: {\n                      shape: TextureShape.Line,\n                      rotation: -45,\n                      opacity: 0.2,\n                    },\n                  },\n                },\n              }\n            : undefined\n        }\n      />\n      <AreaSeries\n        id=\"test2\"\n        xScaleType={xScaleType}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={curve}\n        stackAccessors={['x']}\n        fit={{\n          type: fit,\n          value: fit === Fit.Explicit ? value : undefined,\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\n        }}\n        data={dataset.map((d) => ({\n          ...d,\n          y: rng(2, 10),\n        }))}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const randomizeBoundingData = getRNGSeed() ? false : boolean('randomize bounding data', false);\\n  const dataTypes: Record<string, Array<{ x: number | string; y: number | null }>> = {\\n    isolated: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 3, y: 4 },\\n      { x: 4, y: null },\\n      { x: 5, y: 5 },\\n      { x: 6, y: null },\\n      { x: 7, y: 12 },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    successive: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 4, y: null },\\n      { x: 6, y: null },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    endPoints: [\\n      { x: 0, y: null },\\n      { x: 1, y: 5 },\\n      { x: 3, y: 4 },\\n      { x: 5, y: 5 },\\n      { x: 7, y: 12 },\\n      { x: 9, y: 10 },\\n      { x: 10, y: null },\\n    ],\\n    ordinal: [\\n      { x: 'a', y: null },\\n      { x: 'b', y: 3 },\\n      { x: 'c', y: 5 },\\n      { x: 'd', y: null },\\n      { x: 'e', y: 4 },\\n      { x: 'f', y: null },\\n      { x: 'g', y: 5 },\\n      { x: 'h', y: 6 },\\n      { x: 'i', y: null },\\n      { x: 'j', y: null },\\n      { x: 'k', y: null },\\n      { x: 'l', y: 12 },\\n      { x: 'm', y: null },\\n    ],\\n    all: [\\n      { x: 0, y: null },\\n      { x: 1, y: 3 },\\n      { x: 2, y: 5 },\\n      { x: 3, y: null },\\n      { x: 4, y: 4 },\\n      { x: 5, y: null },\\n      { x: 6, y: 5 },\\n      { x: 7, y: 6 },\\n      { x: 8, y: null },\\n      { x: 9, y: null },\\n      { x: 10, y: null },\\n      { x: 11, y: 12 },\\n      { x: 12, y: null },\\n    ],\\n  };\\n\\n  const stackMode = select<StackMode | 'none'>(\\n    'stackMode',\\n    {\\n      Percentage: StackMode.Percentage,\\n      Silhouette: StackMode.Silhouette,\\n      Wiggle: StackMode.Wiggle,\\n      None: 'none',\\n    },\\n    'none',\\n  );\\n\\n  const dataKey = select<keyof typeof dataTypes>(\\n    'dataset',\\n    {\\n      'Isolated Points': 'isolated',\\n      'Successive null Points': 'successive',\\n      'null end points': 'endPoints',\\n      'Ordinal x values': 'ordinal',\\n      'All edge cases': 'all',\\n    },\\n    'all',\\n  );\\n\\n  const dataset = dataTypes[dataKey];\\n  const fit = customKnobs.enum.fit();\\n  const curve = customKnobs.enum.curve();\\n  const endValue = select<number | 'none' | 'nearest'>(\\n    'End value',\\n    {\\n      None: 'none',\\n      nearest: 'nearest',\\n      0: 0,\\n      2: 2,\\n    },\\n    'none',\\n  );\\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\\n  const value = number('Explicit value (using Fit.Explicit)', 5);\\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\\n  const rngSeed = randomizeBoundingData ? undefined : getRNGSeed('__seed__');\\n  const rng = getRandomNumberGenerator(rngSeed);\\n  const tickFormat = stackMode === 'percentage' ? (d: any) => numeral(d).format('0[.]00%') : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={tickFormat} />\\n      <AreaSeries\\n        id=\\\"test3\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={curve}\\n        stackAccessors={['x']}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset.map((d: any) => ({\\n          ...d,\\n          y: rng(2, 10),\\n        }))}\\n      />\\n      <AreaSeries\\n        id=\\\"test\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        stackMode={stackMode === 'none' ? undefined : stackMode}\\n        curve={curve}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset}\\n        areaSeriesStyle={\\n          boolean('apply custom fit style', false)\\n            ? {\\n                fit: {\\n                  line: {\\n                    stroke: 'gray',\\n                    opacity: 0.5,\\n                  },\\n                  area: {\\n                    fill: 'gray',\\n                    texture: {\\n                      shape: TextureShape.Line,\\n                      rotation: -45,\\n                      opacity: 0.2,\\n                    },\\n                  },\\n                },\\n              }\\n            : undefined\\n        }\\n      />\\n      <AreaSeries\\n        id=\\\"test2\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={curve}\\n        stackAccessors={['x']}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset.map((d) => ({\\n          ...d,\\n          y: rng(2, 10),\\n        }))}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst getRandomNumber = getRandomNumberGenerator();\\nconst data1 = new Array(100).fill(0).map((_, x) => ({\\n  x,\\n  y: getRandomNumber(0, 100),\\n  z: getRandomNumber(0, 50),\\n}));\\nconst data2 = new Array(100).fill(0).map((_, x) => ({\\n  x,\\n  y: getRandomNumber(0, 100),\\n  z: getRandomNumber(200, 500, 4),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('data size', 20, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n  const markFormat = text('markFormat', '0.0');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          markSizeRatio,\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data1.slice(0, size)}\\n        markFormat={(d) => `${numeral(d).format(markFormat)}%`}\\n      />\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data2.slice(0, size)}\\n        markFormat={(d) => `$${numeral(d).format(markFormat)}`}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":93},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":93}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst getRandomNumber = getRandomNumberGenerator();\nconst data1 = new Array(100).fill(0).map((_, x) => ({\n  x,\n  y: getRandomNumber(0, 100),\n  z: getRandomNumber(0, 50),\n}));\nconst data2 = new Array(100).fill(0).map((_, x) => ({\n  x,\n  y: getRandomNumber(0, 100),\n  z: getRandomNumber(200, 500, 4),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n  const size = number('data size', 20, {\n    range: true,\n    min: 10,\n    max: 100,\n    step: 10,\n  });\n  const markFormat = text('markFormat', '0.0');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          markSizeRatio,\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={data1.slice(0, size)}\n        markFormat={(d) => `${numeral(d).format(markFormat)}%`}\n      />\n      <LineSeries\n        id=\"line\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={data2.slice(0, size)}\n        markFormat={(d) => `$${numeral(d).format(markFormat)}`}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('data size', 20, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n  const markFormat = text('markFormat', '0.0');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          markSizeRatio,\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data1.slice(0, size)}\\n        markFormat={(d) => `${numeral(d).format(markFormat)}%`}\\n      />\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data2.slice(0, size)}\\n        markFormat={(d) => `$${numeral(d).format(markFormat)}`}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  StackMode,\\n  SeriesType,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { data } from '../utils/datasets/product_profits';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const baseTheme = useBaseTheme();\\n  const stacked = boolean('stacked', true);\\n  const polarity = select('data polarity', ['Mixed', 'Positive', 'Negative'], 'Mixed');\\n  const customDomain = boolean('custom domain', false);\\n  const stackMode =\\n    select<StackMode | undefined>(\\n      'stackMode',\\n      {\\n        None: undefined,\\n        Silhouette: StackMode.Silhouette,\\n        Wiggle: StackMode.Wiggle,\\n        Percentage: StackMode.Percentage,\\n      },\\n      undefined,\\n    ) ?? undefined;\\n  const [Series] = customKnobs.enum.xySeries('SeriesType', SeriesType.Bar, {\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={baseTheme} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Products\\\" />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Profit\\\"\\n        position={Position.Left}\\n        domain={customDomain ? { min: -25000, max: 50000 } : undefined}\\n        tickFormat={(d) => numeral(d).format(stackMode === 'percentage' ? '0%' : '$0,0')}\\n      />\\n\\n      <LineAnnotation\\n        id=\\\"zeroBaseline\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        dataValues={[{ dataValue: 0 }]}\\n        style={{ line: { ...baseTheme.axes.axisLine, opacity: 1 } }}\\n        zIndex={-1}\\n      />\\n\\n      <Series\\n        id=\\\"series\\\"\\n        color={['#7BC0F7', '#3C8AD8', '#F18026', '#FEDB69']}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"product\\\"\\n        y0Accessors={[() => 1]} // for testing warning\\n        yAccessors={[\\n          ({ profit }) => (polarity === 'Mixed' ? profit : (polarity === 'Negative' ? -1 : 1) * Math.abs(profit)),\\n        ]}\\n        splitSeriesAccessors={['state']}\\n        stackMode={stackMode}\\n        stackAccessors={stacked ? ['yes'] : undefined}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  StackMode,\n  SeriesType,\n  LineAnnotation,\n  AnnotationDomainType,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { data } from '../utils/datasets/product_profits';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const baseTheme = useBaseTheme();\n  const stacked = boolean('stacked', true);\n  const polarity = select('data polarity', ['Mixed', 'Positive', 'Negative'], 'Mixed');\n  const customDomain = boolean('custom domain', false);\n  const stackMode =\n    select<StackMode | undefined>(\n      'stackMode',\n      {\n        None: undefined,\n        Silhouette: StackMode.Silhouette,\n        Wiggle: StackMode.Wiggle,\n        Percentage: StackMode.Percentage,\n      },\n      undefined,\n    ) ?? undefined;\n  const [Series] = customKnobs.enum.xySeries('SeriesType', SeriesType.Bar, {\n    exclude: [SeriesType.Bubble, SeriesType.Line],\n  });\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={baseTheme} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Products\" />\n      <Axis\n        id=\"left\"\n        title=\"Profit\"\n        position={Position.Left}\n        domain={customDomain ? { min: -25000, max: 50000 } : undefined}\n        tickFormat={(d) => numeral(d).format(stackMode === 'percentage' ? '0%' : '$0,0')}\n      />\n\n      <LineAnnotation\n        id=\"zeroBaseline\"\n        domainType={AnnotationDomainType.YDomain}\n        dataValues={[{ dataValue: 0 }]}\n        style={{ line: { ...baseTheme.axes.axisLine, opacity: 1 } }}\n        zIndex={-1}\n      />\n\n      <Series\n        id=\"series\"\n        color={['#7BC0F7', '#3C8AD8', '#F18026', '#FEDB69']}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"product\"\n        y0Accessors={[() => 1]} // for testing warning\n        yAccessors={[\n          ({ profit }) => (polarity === 'Mixed' ? profit : (polarity === 'Negative' ? -1 : 1) * Math.abs(profit)),\n        ]}\n        splitSeriesAccessors={['state']}\n        stackMode={stackMode}\n        stackAccessors={stacked ? ['yes'] : undefined}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const baseTheme = useBaseTheme();\\n  const stacked = boolean('stacked', true);\\n  const polarity = select('data polarity', ['Mixed', 'Positive', 'Negative'], 'Mixed');\\n  const customDomain = boolean('custom domain', false);\\n  const stackMode =\\n    select<StackMode | undefined>(\\n      'stackMode',\\n      {\\n        None: undefined,\\n        Silhouette: StackMode.Silhouette,\\n        Wiggle: StackMode.Wiggle,\\n        Percentage: StackMode.Percentage,\\n      },\\n      undefined,\\n    ) ?? undefined;\\n  const [Series] = customKnobs.enum.xySeries('SeriesType', SeriesType.Bar, {\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={baseTheme} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Products\\\" />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Profit\\\"\\n        position={Position.Left}\\n        domain={customDomain ? { min: -25000, max: 50000 } : undefined}\\n        tickFormat={(d) => numeral(d).format(stackMode === 'percentage' ? '0%' : '$0,0')}\\n      />\\n\\n      <LineAnnotation\\n        id=\\\"zeroBaseline\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        dataValues={[{ dataValue: 0 }]}\\n        style={{ line: { ...baseTheme.axes.axisLine, opacity: 1 } }}\\n        zIndex={-1}\\n      />\\n\\n      <Series\\n        id=\\\"series\\\"\\n        color={['#7BC0F7', '#3C8AD8', '#F18026', '#FEDB69']}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"product\\\"\\n        y0Accessors={[() => 1]} // for testing warning\\n        yAccessors={[\\n          ({ profit }) => (polarity === 'Mixed' ? profit : (polarity === 'Negative' ? -1 : 1) * Math.abs(profit)),\\n        ]}\\n        splitSeriesAccessors={['state']}\\n        stackMode={stackMode}\\n        stackAccessors={stacked ? ['yes'] : undefined}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Mixed Charts',\n};\n\nexport { Example as barsAndLines } from './1_bars_and_lines.story';\nexport { Example as linesAndAreas } from './2_lines_and_areas.story';\nexport { Example as areasAndBars } from './3_areas_and_bars.story';\nexport { Example as testBarLinesLinear } from './4_test_bar.story';\nexport { Example as testBarLinesTime } from './5_test_bar_time.story';\nexport { Example as fittingFunctionsNonStackedSeries } from './6_fitting.story';\nexport { Example as fittingFunctionsStackedSeries } from './6_fitting_stacked.story';\nexport { Example as markSizeAccessor } from './7_marks.story';\nexport { Example as PolarizedStacked } from './8_polarized_stacked.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, radios } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AdditiveNumber,\\n  ArrayEntry,\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, colorBrewerCategoricalPastel12B, regionLookup } from '../utils/utils';\\n\\nconst productLookup: Record<string, { label: string; position: number }> = {\\n  '3': { label: 'Firefox', position: 1 },\\n  '5': { label: 'Edge (Chromium)', position: 4 },\\n  '6': { label: 'Safari', position: 2 },\\n  '7': { label: 'Chrome', position: 0 },\\n  '8': { label: 'Brave', position: 3 },\\n};\\n\\nconst data = mocks.sunburst\\n  .map((d) => (d.dest === 'chn' ? { ...d, dest: 'zaf' } : d))\\n  .filter(\\n    (d: any) =>\\n      ['eu', 'na', 'as', 'af'].includes(countryLookup[d.dest].continentCountry.slice(0, 2)) &&\\n      ['3', '5', '6', '7', '8'].includes(d.sitc1),\\n  );\\n\\nconst productPalette = colorBrewerCategoricalPastel12B.slice(2);\\n\\nconst productToColor = new Map(\\n  data\\n    .map((d) => d.sitc1)\\n    .filter(keepDistinct)\\n    .sort()\\n    .map((sitc1, i) => [sitc1, `rgba(${productPalette[i % productPalette.length].join(',')}, 0.7)`]),\\n);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const partitionLayout = radios(\\n    'Partition layout',\\n    {\\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.mosaic,\\n  );\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        showLegend={boolean('Show legend', true)}\\n        showLegendExtra={boolean('Show legend values', true)}\\n        flatLegend={boolean('Flat legend', false)}\\n        theme={{\\n          partition: {\\n            linkLabel: { maxCount: 0 }, // relevant for sunburst only\\n            outerSizeRatio: 0.9, // relevant for sunburst only\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={partitionLayout}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (name) => (name !== null ? regionLookup[name].regionName : ''),\\n            fillLabel: {\\n              fontWeight: 400,\\n            },\\n            shape: {\\n              fillColor: partitionLayout === PartitionLayout.sunburst ? 'lightgrey' : 'white',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d) => (d !== null ? `${productLookup[d]?.label}` : ''),\\n            shape: {\\n              fillColor: (nodeKey) => productToColor.get(nodeKey)!,\\n            },\\n            sortPredicate: ([name1]: ArrayEntry, [name2]: ArrayEntry) => {\\n              const position1 = Number(productLookup[name1]?.position);\\n              const position2 = Number(productLookup[name2]?.position);\\n              return position2 - position1;\\n            },\\n            fillLabel: {\\n              fontWeight: 200,\\n              minFontSize: 6,\\n              maxFontSize: 16,\\n              maximizeFontSize: true,\\n              fontFamily: 'Helvetica Neue',\\n              valueFormatter: () => '',\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":55},\"endLoc\":{\"col\":1,\"line\":120},\"startBody\":{\"col\":36,\"line\":55},\"endBody\":{\"col\":1,\"line\":120}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, radios } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AdditiveNumber,\n  ArrayEntry,\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, colorBrewerCategoricalPastel12B, regionLookup } from '../utils/utils';\n\nconst productLookup: Record<string, { label: string; position: number }> = {\n  '3': { label: 'Firefox', position: 1 },\n  '5': { label: 'Edge (Chromium)', position: 4 },\n  '6': { label: 'Safari', position: 2 },\n  '7': { label: 'Chrome', position: 0 },\n  '8': { label: 'Brave', position: 3 },\n};\n\nconst data = mocks.sunburst\n  .map((d) => (d.dest === 'chn' ? { ...d, dest: 'zaf' } : d))\n  .filter(\n    (d: any) =>\n      ['eu', 'na', 'as', 'af'].includes(countryLookup[d.dest].continentCountry.slice(0, 2)) &&\n      ['3', '5', '6', '7', '8'].includes(d.sitc1),\n  );\n\nconst productPalette = colorBrewerCategoricalPastel12B.slice(2);\n\nconst productToColor = new Map(\n  data\n    .map((d) => d.sitc1)\n    .filter(keepDistinct)\n    .sort()\n    .map((sitc1, i) => [sitc1, `rgba(${productPalette[i % productPalette.length].join(',')}, 0.7)`]),\n);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const partitionLayout = radios(\n    'Partition layout',\n    {\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\n    },\n    PartitionLayout.mosaic,\n  );\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings\n        showLegend={boolean('Show legend', true)}\n        showLegendExtra={boolean('Show legend values', true)}\n        flatLegend={boolean('Flat legend', false)}\n        theme={{\n          partition: {\n            linkLabel: { maxCount: 0 }, // relevant for sunburst only\n            outerSizeRatio: 0.9, // relevant for sunburst only\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={data}\n        layout={partitionLayout}\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (name) => (name !== null ? regionLookup[name].regionName : ''),\n            fillLabel: {\n              fontWeight: 400,\n            },\n            shape: {\n              fillColor: partitionLayout === PartitionLayout.sunburst ? 'lightgrey' : 'white',\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d) => (d !== null ? `${productLookup[d]?.label}` : ''),\n            shape: {\n              fillColor: (nodeKey) => productToColor.get(nodeKey)!,\n            },\n            sortPredicate: ([name1]: ArrayEntry, [name2]: ArrayEntry) => {\n              const position1 = Number(productLookup[name1]?.position);\n              const position2 = Number(productLookup[name2]?.position);\n              return position2 - position1;\n            },\n            fillLabel: {\n              fontWeight: 200,\n              minFontSize: 6,\n              maxFontSize: 16,\n              maximizeFontSize: true,\n              fontFamily: 'Helvetica Neue',\n              valueFormatter: () => '',\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const partitionLayout = radios(\\n    'Partition layout',\\n    {\\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.mosaic,\\n  );\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        showLegend={boolean('Show legend', true)}\\n        showLegendExtra={boolean('Show legend values', true)}\\n        flatLegend={boolean('Flat legend', false)}\\n        theme={{\\n          partition: {\\n            linkLabel: { maxCount: 0 }, // relevant for sunburst only\\n            outerSizeRatio: 0.9, // relevant for sunburst only\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={partitionLayout}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (name) => (name !== null ? regionLookup[name].regionName : ''),\\n            fillLabel: {\\n              fontWeight: 400,\\n            },\\n            shape: {\\n              fillColor: partitionLayout === PartitionLayout.sunburst ? 'lightgrey' : 'white',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d) => (d !== null ? `${productLookup[d]?.label}` : ''),\\n            shape: {\\n              fillColor: (nodeKey) => productToColor.get(nodeKey)!,\\n            },\\n            sortPredicate: ([name1]: ArrayEntry, [name2]: ArrayEntry) => {\\n              const position1 = Number(productLookup[name1]?.position);\\n              const position2 = Number(productLookup[name2]?.position);\\n              return position2 - position1;\\n            },\\n            fillLabel: {\\n              fontWeight: 200,\\n              minFontSize: 6,\\n              maxFontSize: 16,\\n              maximizeFontSize: true,\\n              fontFamily: 'Helvetica Neue',\\n              valueFormatter: () => '',\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AdditiveNumber,\\n  ArrayEntry,\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup } from '../utils/utils';\\n\\nconst categoricalColors = ['rgb(110,110,110)', 'rgb(123,123,123)', 'darkgrey', 'lightgrey'];\\n\\nconst data = [\\n  { region: 'Americas', dest: 'usa', other: false, exportVal: 553359100104 },\\n  { region: 'Americas', dest: 'Other', other: true, exportVal: 753359100104 },\\n  { region: 'Asia', dest: 'chn', other: false, exportVal: 392617281424 },\\n  { region: 'Asia', dest: 'jpn', other: false, exportVal: 177490158520 },\\n  { region: 'Asia', dest: 'kor', other: false, exportVal: 177421375512 },\\n  { region: 'Asia', dest: 'Other', other: true, exportVal: 277421375512 },\\n  { region: 'Europe', dest: 'deu', other: false, exportVal: 253250650864 },\\n  { region: 'Europe', dest: 'smr', other: false, exportVal: 135443006088 },\\n  { region: 'Europe', dest: 'Other', other: true, exportVal: 205443006088 },\\n  { region: 'Africa', dest: 'Other', other: true, exportVal: 305443006088 },\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const alphabetical = boolean('Alphabetical outer group sorting', false);\\n  const otherOnBottom = boolean('\\\"Other\\\" on bottom even if not the smallest', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={PartitionLayout.mosaic}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.region,\\n            nodeLabel: (d) => String(d).toUpperCase(),\\n            sortPredicate: alphabetical\\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n                  if (name1 < name2) return -1;\\n                  if (name2 < name1) return 1;\\n\\n                  // otherwise, use the increasing value order\\n                  return node1.value - node2.value;\\n                }\\n              : undefined,\\n            fillLabel: {\\n              valueFormatter: () => ``,\\n              fontWeight: 600,\\n            },\\n            shape: {\\n              fillColor: () => 'white',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\\n            sortPredicate: otherOnBottom\\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n                  if (name1 === 'Other' && name2 !== 'Other') return 1;\\n                  if (name2 === 'Other' && name1 !== 'Other') return -1;\\n\\n                  // otherwise, use the increasing value order\\n                  return node1.value - node2.value;\\n                }\\n              : undefined,\\n            fillLabel: {\\n              fontWeight: 100,\\n              maxFontSize: 16,\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (nodeKey, sortIndex, node) => categoricalColors.slice(0)[node.parent.sortIndex],\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":104},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":104}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AdditiveNumber,\n  ArrayEntry,\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup } from '../utils/utils';\n\nconst categoricalColors = ['rgb(110,110,110)', 'rgb(123,123,123)', 'darkgrey', 'lightgrey'];\n\nconst data = [\n  { region: 'Americas', dest: 'usa', other: false, exportVal: 553359100104 },\n  { region: 'Americas', dest: 'Other', other: true, exportVal: 753359100104 },\n  { region: 'Asia', dest: 'chn', other: false, exportVal: 392617281424 },\n  { region: 'Asia', dest: 'jpn', other: false, exportVal: 177490158520 },\n  { region: 'Asia', dest: 'kor', other: false, exportVal: 177421375512 },\n  { region: 'Asia', dest: 'Other', other: true, exportVal: 277421375512 },\n  { region: 'Europe', dest: 'deu', other: false, exportVal: 253250650864 },\n  { region: 'Europe', dest: 'smr', other: false, exportVal: 135443006088 },\n  { region: 'Europe', dest: 'Other', other: true, exportVal: 205443006088 },\n  { region: 'Africa', dest: 'Other', other: true, exportVal: 305443006088 },\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const alphabetical = boolean('Alphabetical outer group sorting', false);\n  const otherOnBottom = boolean('\"Other\" on bottom even if not the smallest', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={data}\n        layout={PartitionLayout.mosaic}\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.region,\n            nodeLabel: (d) => String(d).toUpperCase(),\n            sortPredicate: alphabetical\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\n                  if (name1 < name2) return -1;\n                  if (name2 < name1) return 1;\n\n                  // otherwise, use the increasing value order\n                  return node1.value - node2.value;\n                }\n              : undefined,\n            fillLabel: {\n              valueFormatter: () => ``,\n              fontWeight: 600,\n            },\n            shape: {\n              fillColor: () => 'white',\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\n            sortPredicate: otherOnBottom\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\n                  if (name1 === 'Other' && name2 !== 'Other') return 1;\n                  if (name2 === 'Other' && name1 !== 'Other') return -1;\n\n                  // otherwise, use the increasing value order\n                  return node1.value - node2.value;\n                }\n              : undefined,\n            fillLabel: {\n              fontWeight: 100,\n              maxFontSize: 16,\n              valueFont: {\n                fontFamily: 'Menlo',\n                fontStyle: 'normal',\n                fontWeight: 100,\n              },\n            },\n            shape: {\n              fillColor: (nodeKey, sortIndex, node) => categoricalColors.slice(0)[node.parent.sortIndex],\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const alphabetical = boolean('Alphabetical outer group sorting', false);\\n  const otherOnBottom = boolean('\\\"Other\\\" on bottom even if not the smallest', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={PartitionLayout.mosaic}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.region,\\n            nodeLabel: (d) => String(d).toUpperCase(),\\n            sortPredicate: alphabetical\\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n                  if (name1 < name2) return -1;\\n                  if (name2 < name1) return 1;\\n\\n                  // otherwise, use the increasing value order\\n                  return node1.value - node2.value;\\n                }\\n              : undefined,\\n            fillLabel: {\\n              valueFormatter: () => ``,\\n              fontWeight: 600,\\n            },\\n            shape: {\\n              fillColor: () => 'white',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\\n            sortPredicate: otherOnBottom\\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n                  if (name1 === 'Other' && name2 !== 'Other') return 1;\\n                  if (name2 === 'Other' && name1 !== 'Other') return -1;\\n\\n                  // otherwise, use the increasing value order\\n                  return node1.value - node2.value;\\n                }\\n              : undefined,\\n            fillLabel: {\\n              fontWeight: 100,\\n              maxFontSize: 16,\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (nodeKey, sortIndex, node) => categoricalColors.slice(0)[node.parent.sortIndex],\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Mosaic (@alpha)',\n};\n\nexport { Example as simpleMosaic } from './10_mosaic_simple.story';\nexport { Example as otherSlices } from './20_mosaic_with_other.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      debug={boolean('Debug', true)}\\n      showLegend={boolean('Legend', true)}\\n      showLegendExtra\\n      legendPosition={select(\\n        'Legend position',\\n        {\\n          Left: Position.Left,\\n          Right: Position.Right,\\n          Top: Position.Top,\\n          Bottom: Position.Bottom,\\n        },\\n        Position.Right,\\n      )}\\n      rotation={select(\\n        'Rotation degree',\\n        {\\n          '0 deg(default)': 0,\\n          '90 deg': 90,\\n          '-90 deg': -90,\\n          '180 deg': 180,\\n        },\\n        0,\\n      )}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"Bottom axis\\\"\\n      showOverlappingTicks\\n      showOverlappingLabels={boolean('bottom show overlapping labels', false)}\\n    />\\n    <Axis\\n      id=\\\"left2\\\"\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      showOverlappingTicks\\n      showOverlappingLabels={boolean('left show overlapping labels', false)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      baseTheme={useBaseTheme()}\n      debug={boolean('Debug', true)}\n      showLegend={boolean('Legend', true)}\n      showLegendExtra\n      legendPosition={select(\n        'Legend position',\n        {\n          Left: Position.Left,\n          Right: Position.Right,\n          Top: Position.Top,\n          Bottom: Position.Bottom,\n        },\n        Position.Right,\n      )}\n      rotation={select(\n        'Rotation degree',\n        {\n          '0 deg(default)': 0,\n          '90 deg': 90,\n          '-90 deg': -90,\n          '180 deg': 180,\n        },\n        0,\n      )}\n    />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"Bottom axis\"\n      showOverlappingTicks\n      showOverlappingLabels={boolean('bottom show overlapping labels', false)}\n    />\n    <Axis\n      id=\"left2\"\n      title=\"Left axis\"\n      position={Position.Left}\n      showOverlappingTicks\n      showOverlappingLabels={boolean('left show overlapping labels', false)}\n    />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      debug={boolean('Debug', true)}\\n      showLegend={boolean('Legend', true)}\\n      showLegendExtra\\n      legendPosition={select(\\n        'Legend position',\\n        {\\n          Left: Position.Left,\\n          Right: Position.Right,\\n          Top: Position.Top,\\n          Bottom: Position.Bottom,\\n        },\\n        Position.Right,\\n      )}\\n      rotation={select(\\n        'Rotation degree',\\n        {\\n          '0 deg(default)': 0,\\n          '90 deg': 90,\\n          '-90 deg': -90,\\n          '180 deg': 180,\\n        },\\n        0,\\n      )}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"Bottom axis\\\"\\n      showOverlappingTicks\\n      showOverlappingLabels={boolean('bottom show overlapping labels', false)}\\n    />\\n    <Axis\\n      id=\\\"left2\\\"\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      showOverlappingTicks\\n      showOverlappingLabels={boolean('left show overlapping labels', false)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\n    <Axis id=\"y top\" position={Position.Top} title=\"y top axis\" />\n    <Axis id=\"x right\" title=\"x right axis\" position={Position.Right} />\n    <Axis id=\"y bottom\" position={Position.Bottom} title=\"y bottom axis\" />\n    <Axis id=\"x left\" title=\"x left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\n    <Axis id=\"x top\" position={Position.Top} title=\"x top axis\" />\n    <Axis id=\"y right\" title=\"y right axis\" position={Position.Right} />\n    <Axis id=\"x bottom\" position={Position.Bottom} title=\"x bottom axis\" />\n    <Axis id=\"y left\" title=\"y left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\n    <Axis id=\"y top\" position={Position.Top} title=\"y top axis\" />\n    <Axis id=\"x right\" title=\"x right axis\" position={Position.Right} />\n    <Axis id=\"y bottom\" position={Position.Bottom} title=\"y bottom axis\" />\n    <Axis id=\"x left\" title=\"x left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\n    <Axis id=\"x top\" position={Position.Top} title=\"x top axis\" />\n    <Axis id=\"y right\" title=\"y right axis\" position={Position.Right} />\n    <Axis id=\"x bottom\" position={Position.Bottom} title=\"x bottom axis\" />\n    <Axis id=\"y left\" title=\"y left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\n    <Axis id=\"y top\" position={Position.Top} title=\"y top axis\" />\n    <Axis id=\"x right\" title=\"x right axis\" position={Position.Right} />\n    <Axis id=\"y bottom\" position={Position.Bottom} title=\"y bottom axis\" />\n    <Axis id=\"x left\" title=\"x left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\n    <Axis id=\"x top\" position={Position.Top} title=\"x top axis\" />\n    <Axis id=\"y right\" title=\"y right axis\" position={Position.Right} />\n    <Axis id=\"x bottom\" position={Position.Bottom} title=\"x bottom axis\" />\n    <Axis id=\"y left\" title=\"y left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\n    <Axis id=\"y top\" position={Position.Top} title=\"y top axis\" />\n    <Axis id=\"x right\" title=\"x right axis\" position={Position.Right} />\n    <Axis id=\"y bottom\" position={Position.Bottom} title=\"y bottom axis\" />\n    <Axis id=\"x left\" title=\"x left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\n    <Axis id=\"x top\" position={Position.Top} title=\"x top axis\" />\n    <Axis id=\"y right\" title=\"y right axis\" position={Position.Right} />\n    <Axis id=\"x bottom\" position={Position.Bottom} title=\"x bottom axis\" />\n    <Axis id=\"y left\" title=\"y left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Rotations',\n};\n\nexport { Example as withOrdinalAxis } from './1_ordinal.story';\nexport { Example as negative90DegreeOrdinal } from './2_negative_ordinal.story';\nexport { Example as rotations0DegOrdinal } from './3_rotations_ordinal.story';\nexport { Example as rotations90DegOrdinal } from './4_90_ordinal.story';\nexport { Example as rotations180DegOrdinal } from './5_180_ordinal.story';\nexport { Example as negative90DegLinear } from './6_negative_linear.story';\nexport { Example as rotations0DegLinear } from './7_rotations_linear.story';\nexport { Example as rotations90DegLinear } from './8_90_deg_linear.story';\nexport { Example as rotations180DegLinear } from './9_180_deg_linear.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst today = Date.now();\\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\\nconst UTC_PLUS8_DATE = DateTime.fromISO('2019-01-01T00:00:00.000+08:00', {\\n  setZone: true,\\n}).toMillis();\\nconst UTC_MINUS8_DATE = DateTime.fromISO('2019-01-01T00:00:00.000-08:00', {\\n  setZone: true,\\n}).toMillis();\\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\\nconst CURRENT_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [today + DAY_INCREMENT_1 * i, i % 5]);\\nconst OTHER_PLUS8_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [UTC_PLUS8_DATE + DAY_INCREMENT_1 * i, i % 5]);\\nconst OTHER_MINUS8_TIMEZONE_DATASET = new Array(10)\\n  .fill(0)\\n  .map((d, i) => [UTC_MINUS8_DATE + DAY_INCREMENT_1 * i, i % 5]);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const timezones = {\\n    utc: 'utc',\\n    local: 'local',\\n    utcplus8: 'utc+8',\\n    utcminus8: 'utc-8',\\n  };\\n  const datasetSelected = select('dataset', timezones, 'utc');\\n  const tooltipSelected = select('tooltip', timezones, 'utc');\\n\\n  let data;\\n  switch (datasetSelected) {\\n    case 'local':\\n      data = CURRENT_TIMEZONE_DATASET;\\n      break;\\n    case 'utc+8':\\n      data = OTHER_PLUS8_TIMEZONE_DATASET;\\n      break;\\n    case 'utc-8':\\n      data = OTHER_MINUS8_TIMEZONE_DATASET;\\n      break;\\n    case 'utc':\\n    default:\\n      data = UTC_DATASET;\\n      break;\\n  }\\n  let tooltipFn: (d: number) => string;\\n  switch (tooltipSelected) {\\n    case 'local':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    case 'utc+8':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc+8' }).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    case 'utc-8':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc-8' }).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    default:\\n    case 'utc':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n  }\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} tickFormat={tooltipFn} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        timeZone={tooltipSelected}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":92},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":92}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst today = Date.now();\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\nconst UTC_PLUS8_DATE = DateTime.fromISO('2019-01-01T00:00:00.000+08:00', {\n  setZone: true,\n}).toMillis();\nconst UTC_MINUS8_DATE = DateTime.fromISO('2019-01-01T00:00:00.000-08:00', {\n  setZone: true,\n}).toMillis();\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\nconst CURRENT_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [today + DAY_INCREMENT_1 * i, i % 5]);\nconst OTHER_PLUS8_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [UTC_PLUS8_DATE + DAY_INCREMENT_1 * i, i % 5]);\nconst OTHER_MINUS8_TIMEZONE_DATASET = new Array(10)\n  .fill(0)\n  .map((d, i) => [UTC_MINUS8_DATE + DAY_INCREMENT_1 * i, i % 5]);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const timezones = {\n    utc: 'utc',\n    local: 'local',\n    utcplus8: 'utc+8',\n    utcminus8: 'utc-8',\n  };\n  const datasetSelected = select('dataset', timezones, 'utc');\n  const tooltipSelected = select('tooltip', timezones, 'utc');\n\n  let data;\n  switch (datasetSelected) {\n    case 'local':\n      data = CURRENT_TIMEZONE_DATASET;\n      break;\n    case 'utc+8':\n      data = OTHER_PLUS8_TIMEZONE_DATASET;\n      break;\n    case 'utc-8':\n      data = OTHER_MINUS8_TIMEZONE_DATASET;\n      break;\n    case 'utc':\n    default:\n      data = UTC_DATASET;\n      break;\n  }\n  let tooltipFn: (d: number) => string;\n  switch (tooltipSelected) {\n    case 'local':\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss');\n      break;\n    case 'utc+8':\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc+8' }).toFormat('yyyy-MM-dd HH:mm:ss');\n      break;\n    case 'utc-8':\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc-8' }).toFormat('yyyy-MM-dd HH:mm:ss');\n      break;\n    default:\n    case 'utc':\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss');\n      break;\n  }\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"time\" position={Position.Bottom} tickFormat={tooltipFn} />\n      <Axis id=\"y\" position={Position.Left} />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        timeZone={tooltipSelected}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const timezones = {\\n    utc: 'utc',\\n    local: 'local',\\n    utcplus8: 'utc+8',\\n    utcminus8: 'utc-8',\\n  };\\n  const datasetSelected = select('dataset', timezones, 'utc');\\n  const tooltipSelected = select('tooltip', timezones, 'utc');\\n\\n  let data;\\n  switch (datasetSelected) {\\n    case 'local':\\n      data = CURRENT_TIMEZONE_DATASET;\\n      break;\\n    case 'utc+8':\\n      data = OTHER_PLUS8_TIMEZONE_DATASET;\\n      break;\\n    case 'utc-8':\\n      data = OTHER_MINUS8_TIMEZONE_DATASET;\\n      break;\\n    case 'utc':\\n    default:\\n      data = UTC_DATASET;\\n      break;\\n  }\\n  let tooltipFn: (d: number) => string;\\n  switch (tooltipSelected) {\\n    case 'local':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    case 'utc+8':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc+8' }).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    case 'utc-8':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc-8' }).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    default:\\n    case 'utc':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n  }\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} tickFormat={tooltipFn} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        timeZone={tooltipSelected}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss')}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      timeZone=\\\"local\\\"\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={UTC_DATASET}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown: `If your data is in UTC timezone, your tooltip and axis labels can be configured\\n      to visualize the time translated to your local timezone. You should be able to see the\\n      first value on \\\\`2019-01-01  01:00:00.000 \\\\``,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"time\"\n      position={Position.Bottom}\n      tickFormat={(d) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss')}\n    />\n    <Axis id=\"y\" position={Position.Left} />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      timeZone=\"local\"\n      xAccessor={0}\n      yAccessors={[1]}\n      data={UTC_DATASET}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown: `If your data is in UTC timezone, your tooltip and axis labels can be configured\n      to visualize the time translated to your local timezone. You should be able to see the\n      first value on \\`2019-01-01  01:00:00.000 \\``,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss')}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      timeZone=\\\"local\\\"\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={UTC_DATASET}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss')}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      timeZone=\\\"utc\\\"\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={UTC_DATASET}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown: `The default timezone is UTC. If you want to visualize data in UTC,\\n      but you are in a different timezone, remember to format the millis from \\\\`tickFormat\\\\`\\n      to UTC. In this Example be able to see the first value on \\\\`2019-01-01  00:00:00.000 \\\\``,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"time\"\n      position={Position.Bottom}\n      tickFormat={(d) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss')}\n    />\n    <Axis id=\"y\" position={Position.Left} />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      timeZone=\"utc\"\n      xAccessor={0}\n      yAccessors={[1]}\n      data={UTC_DATASET}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown: `The default timezone is UTC. If you want to visualize data in UTC,\n      but you are in a different timezone, remember to format the millis from \\`tickFormat\\`\n      to UTC. In this Example be able to see the first value on \\`2019-01-01  00:00:00.000 \\``,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss')}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      timeZone=\\\"utc\\\"\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={UTC_DATASET}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d, { zone: 'Etc/GMT+6' }).toISO()}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={1}\\n      yAccessors={[2]}\\n      timeZone=\\\"Etc/GMT+6\\\"\\n      data={[\\n        ['2014-01-01T00:00:00.000-06:00', 1388556000000, 6206],\\n        ['2015-01-01T00:00:00.000-06:00', 1420092000000, 5674],\\n        ['2016-01-01T00:00:00.000-06:00', 1451628000000, 4148],\\n        ['2017-01-01T00:00:00.000-06:00', 1483250400000, 6206],\\n        ['2018-01-01T00:00:00.000-06:00', 1514786400000, 3698],\\n      ]}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown: `You can visualize data in a different timezone than your local or UTC zones.\\n      Specify the \\\\`timeZone={'Etc/GMT+6'}\\\\` property with the correct timezone and\\n      remember to apply the same timezone also to each formatted tick in \\\\`tickFormat\\\\``,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"time\"\n      position={Position.Bottom}\n      tickFormat={(d) => DateTime.fromMillis(d, { zone: 'Etc/GMT+6' }).toISO()}\n    />\n    <Axis id=\"y\" position={Position.Left} />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={1}\n      yAccessors={[2]}\n      timeZone=\"Etc/GMT+6\"\n      data={[\n        ['2014-01-01T00:00:00.000-06:00', 1388556000000, 6206],\n        ['2015-01-01T00:00:00.000-06:00', 1420092000000, 5674],\n        ['2016-01-01T00:00:00.000-06:00', 1451628000000, 4148],\n        ['2017-01-01T00:00:00.000-06:00', 1483250400000, 6206],\n        ['2018-01-01T00:00:00.000-06:00', 1514786400000, 3698],\n      ]}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown: `You can visualize data in a different timezone than your local or UTC zones.\n      Specify the \\`timeZone={'Etc/GMT+6'}\\` property with the correct timezone and\n      remember to apply the same timezone also to each formatted tick in \\`tickFormat\\``,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d, { zone: 'Etc/GMT+6' }).toISO()}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={1}\\n      yAccessors={[2]}\\n      timeZone=\\\"Etc/GMT+6\\\"\\n      data={[\\n        ['2014-01-01T00:00:00.000-06:00', 1388556000000, 6206],\\n        ['2015-01-01T00:00:00.000-06:00', 1420092000000, 5674],\\n        ['2016-01-01T00:00:00.000-06:00', 1451628000000, 4148],\\n        ['2017-01-01T00:00:00.000-06:00', 1483250400000, 6206],\\n        ['2018-01-01T00:00:00.000-06:00', 1514786400000, 3698],\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, BarSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const includeString = boolean('include string is x data', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={{ min: 0, max: 10 }} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title={includeString ? 'ordinal fallback scale' : 'linear scale'} position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 390, val: 1222 },\\n          { x: 2, y: 23, val: 1222 },\\n          { x: includeString ? '3' : 3, y: 750, val: 1222 },\\n          { x: 4, y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown:\\n    'Using string values with a `Linear` scale will attempt to fallback to an `Ordinal` scale. Notice how the custom `xDomain` is ignored when the scale falls back to `Ordinal`.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, BarSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const includeString = boolean('include string is x data', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={{ min: 0, max: 10 }} baseTheme={useBaseTheme()} />\n      <Axis id=\"y\" title=\"count\" position={Position.Left} />\n      <Axis id=\"x\" title={includeString ? 'ordinal fallback scale' : 'linear scale'} position={Position.Bottom} />\n      <BarSeries\n        id=\"bars\"\n        name=\"amount\"\n        xScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 1, y: 390, val: 1222 },\n          { x: 2, y: 23, val: 1222 },\n          { x: includeString ? '3' : 3, y: 750, val: 1222 },\n          { x: 4, y: 854, val: 1222 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown:\n    'Using string values with a `Linear` scale will attempt to fallback to an `Ordinal` scale. Notice how the custom `xDomain` is ignored when the scale falls back to `Ordinal`.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const includeString = boolean('include string is x data', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={{ min: 0, max: 10 }} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title={includeString ? 'ordinal fallback scale' : 'linear scale'} position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 390, val: 1222 },\\n          { x: 2, y: 23, val: 1222 },\\n          { x: includeString ? '3' : 3, y: 750, val: 1222 },\\n          { x: 4, y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport { range } from 'lodash';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Axis,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  AreaSeries,\\n  YDomainBase,\\n  LogScaleOptions,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { logFormatter } from '../utils/formatters';\\nimport { customKnobs } from '../utils/knobs';\\n\\ntype LogKnobs = LogScaleOptions &\\n  Pick<YDomainBase, 'fit' | 'padding'> & {\\n    dataType: string;\\n    negative: boolean;\\n    scaleType: Extract<ScaleType, 'log' | 'linear'>;\\n  };\\n\\nconst getDataType = (group: string, defaultType = 'increasing') =>\\n  select(\\n    'Data type',\\n    {\\n      Increasing: 'increasing',\\n      Decreasing: 'decreasing',\\n      'Up Down': 'upDown',\\n      'Down Up': 'downUp',\\n    },\\n    defaultType,\\n    group,\\n  );\\n\\nconst getLogKnobs = (isXAxis = false) => {\\n  const group = isXAxis ? 'X - Axis' : 'Y - Axis';\\n  const useDefaultLimit = boolean('Use default limit', isXAxis, group);\\n  const limit = number('Log min limit', 1, { min: 0 }, group);\\n  const logNames = { Common: 'common', Binary: 'binary', Natural: 'natural' };\\n  const logBaseName = customKnobs.fromEnum('Log base', logNames, 'common' as any, {\\n    group,\\n    allowUndefined: true,\\n  }) as 'common' | 'binary' | 'natural';\\n  return {\\n    min: NaN,\\n    max: NaN,\\n    ...(!isXAxis && { fit: boolean('Fit domain', true, group) }),\\n    dataType: getDataType(group, isXAxis ? undefined : 'upDown'),\\n    negative: boolean('Use negative values', false, group),\\n    ...(!isXAxis && { logMinLimit: useDefaultLimit ? undefined : limit }),\\n    logBase: { common: 10, binary: 2, natural: Math.E }[logBaseName] ?? 10,\\n    scaleType: customKnobs.enum.scaleType('Scale Type', ScaleType.Log, { include: ['Linear', 'Log'], group }),\\n    ...(!isXAxis && { padding: number('Padding', 0, { min: 0 }, group) }),\\n  };\\n};\\n\\nconst getDataValue = (type: string, v: number, i: number, length: number) => {\\n  switch (type) {\\n    case 'increasing':\\n      return i - Math.round(length / 2);\\n    case 'decreasing':\\n      return -i + Math.round(length / 2);\\n    case 'upDown':\\n      return v;\\n    case 'downUp':\\n    default:\\n      return -v;\\n  }\\n};\\n\\nconst seriesMap = {\\n  line: LineSeries,\\n  area: AreaSeries,\\n};\\n\\nconst getSeriesType = () =>\\n  select<keyof typeof seriesMap>(\\n    'Series Type',\\n    {\\n      Line: 'line',\\n      Area: 'area',\\n    },\\n    'line',\\n  );\\n\\nconst getInitalData = (rows: number) => {\\n  const quart = Math.round(rows / 4);\\n  return [...range(quart, -quart, -1), ...range(-quart, quart + 1, 1)];\\n};\\n\\nconst getData = (rows: number, yLogKnobs: LogKnobs, xLogKnobs: LogKnobs) =>\\n  getInitalData(rows).map((v, i, { length }) => {\\n    const y0 = getDataValue(yLogKnobs.dataType, v, i, length);\\n    const x0 = getDataValue(xLogKnobs.dataType, v, i, length);\\n    return {\\n      y: Math.pow(yLogKnobs.logBase ?? 10, y0) * (yLogKnobs.negative ? -1 : 1),\\n      x: Math.pow(xLogKnobs.logBase ?? 10, x0) * (xLogKnobs.negative ? -1 : 1),\\n    };\\n  });\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rows = number('Rows in dataset', 11, { min: 5, step: 2, max: 21 });\\n  const yLogKnobs = getLogKnobs(false);\\n  const xLogKnobs = getLogKnobs(true);\\n  const data = getData(rows, yLogKnobs, xLogKnobs);\\n  const type = getSeriesType();\\n  const curve = customKnobs.enum.curve('Curve type');\\n  const Series = seriesMap[type];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xLogKnobs} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" position={Position.Left} domain={yLogKnobs} tickFormat={logFormatter(yLogKnobs.logBase)} />\\n      <Axis\\n        id=\\\"x\\\"\\n        tickFormat={logFormatter(xLogKnobs.logBase)}\\n        position={Position.Bottom}\\n        style={{ tickLabel: { rotation: -90 } }}\\n      />\\n      <Series\\n        id=\\\"series\\\"\\n        curve={curve}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        yScaleType={yLogKnobs.scaleType}\\n        xScaleType={xLogKnobs.scaleType}\\n        areaSeriesStyle={{ point: { visible: true } }}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `With the \\\\`domain.fit\\\\` option enabled, Log scales will try to best fit the y axis data without setting a baseline to a hardcoded value, currently 1.\\n      If you provide a \\\\`logMinLimit\\\\` on the \\\\`Axis.domain\\\\` prop, the scale will be limited to that value.\\n      This is _not_ the same as min domain value, such that if all values are greater than \\\\`logMinLimit\\\\`,\\n      the domain min will be determined solely by the dataset.\\\\n\\\\nThe \\\\`domain.logBase\\\\` and \\\\`xDomain.logBase\\\\` options\\n      provide a way to set the base of the log to one of following:\\n      [\\\\`10\\\\`](https://en.wikipedia.org/wiki/Common_logarithm) (base 10),\\n      [\\\\`2\\\\`](https://en.wikipedia.org/wiki/Binary_logarithm) (base 2),\\n      [\\\\`Math.E\\\\`](https://en.wikipedia.org/wiki/Natural_logarithm) (base e), the default is \\\\`Common\\\\``,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":116},\"endLoc\":{\"col\":1,\"line\":147},\"startBody\":{\"col\":36,\"line\":116},\"endBody\":{\"col\":1,\"line\":147}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport { range } from 'lodash';\nimport React from 'react';\n\nimport {\n  Chart,\n  Axis,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  AreaSeries,\n  YDomainBase,\n  LogScaleOptions,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { logFormatter } from '../utils/formatters';\nimport { customKnobs } from '../utils/knobs';\n\ntype LogKnobs = LogScaleOptions &\n  Pick<YDomainBase, 'fit' | 'padding'> & {\n    dataType: string;\n    negative: boolean;\n    scaleType: Extract<ScaleType, 'log' | 'linear'>;\n  };\n\nconst getDataType = (group: string, defaultType = 'increasing') =>\n  select(\n    'Data type',\n    {\n      Increasing: 'increasing',\n      Decreasing: 'decreasing',\n      'Up Down': 'upDown',\n      'Down Up': 'downUp',\n    },\n    defaultType,\n    group,\n  );\n\nconst getLogKnobs = (isXAxis = false) => {\n  const group = isXAxis ? 'X - Axis' : 'Y - Axis';\n  const useDefaultLimit = boolean('Use default limit', isXAxis, group);\n  const limit = number('Log min limit', 1, { min: 0 }, group);\n  const logNames = { Common: 'common', Binary: 'binary', Natural: 'natural' };\n  const logBaseName = customKnobs.fromEnum('Log base', logNames, 'common' as any, {\n    group,\n    allowUndefined: true,\n  }) as 'common' | 'binary' | 'natural';\n  return {\n    min: NaN,\n    max: NaN,\n    ...(!isXAxis && { fit: boolean('Fit domain', true, group) }),\n    dataType: getDataType(group, isXAxis ? undefined : 'upDown'),\n    negative: boolean('Use negative values', false, group),\n    ...(!isXAxis && { logMinLimit: useDefaultLimit ? undefined : limit }),\n    logBase: { common: 10, binary: 2, natural: Math.E }[logBaseName] ?? 10,\n    scaleType: customKnobs.enum.scaleType('Scale Type', ScaleType.Log, { include: ['Linear', 'Log'], group }),\n    ...(!isXAxis && { padding: number('Padding', 0, { min: 0 }, group) }),\n  };\n};\n\nconst getDataValue = (type: string, v: number, i: number, length: number) => {\n  switch (type) {\n    case 'increasing':\n      return i - Math.round(length / 2);\n    case 'decreasing':\n      return -i + Math.round(length / 2);\n    case 'upDown':\n      return v;\n    case 'downUp':\n    default:\n      return -v;\n  }\n};\n\nconst seriesMap = {\n  line: LineSeries,\n  area: AreaSeries,\n};\n\nconst getSeriesType = () =>\n  select<keyof typeof seriesMap>(\n    'Series Type',\n    {\n      Line: 'line',\n      Area: 'area',\n    },\n    'line',\n  );\n\nconst getInitalData = (rows: number) => {\n  const quart = Math.round(rows / 4);\n  return [...range(quart, -quart, -1), ...range(-quart, quart + 1, 1)];\n};\n\nconst getData = (rows: number, yLogKnobs: LogKnobs, xLogKnobs: LogKnobs) =>\n  getInitalData(rows).map((v, i, { length }) => {\n    const y0 = getDataValue(yLogKnobs.dataType, v, i, length);\n    const x0 = getDataValue(xLogKnobs.dataType, v, i, length);\n    return {\n      y: Math.pow(yLogKnobs.logBase ?? 10, y0) * (yLogKnobs.negative ? -1 : 1),\n      x: Math.pow(xLogKnobs.logBase ?? 10, x0) * (xLogKnobs.negative ? -1 : 1),\n    };\n  });\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rows = number('Rows in dataset', 11, { min: 5, step: 2, max: 21 });\n  const yLogKnobs = getLogKnobs(false);\n  const xLogKnobs = getLogKnobs(true);\n  const data = getData(rows, yLogKnobs, xLogKnobs);\n  const type = getSeriesType();\n  const curve = customKnobs.enum.curve('Curve type');\n  const Series = seriesMap[type];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={xLogKnobs} baseTheme={useBaseTheme()} />\n      <Axis id=\"y\" position={Position.Left} domain={yLogKnobs} tickFormat={logFormatter(yLogKnobs.logBase)} />\n      <Axis\n        id=\"x\"\n        tickFormat={logFormatter(xLogKnobs.logBase)}\n        position={Position.Bottom}\n        style={{ tickLabel: { rotation: -90 } }}\n      />\n      <Series\n        id=\"series\"\n        curve={curve}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        yScaleType={yLogKnobs.scaleType}\n        xScaleType={xLogKnobs.scaleType}\n        areaSeriesStyle={{ point: { visible: true } }}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `With the \\`domain.fit\\` option enabled, Log scales will try to best fit the y axis data without setting a baseline to a hardcoded value, currently 1.\n      If you provide a \\`logMinLimit\\` on the \\`Axis.domain\\` prop, the scale will be limited to that value.\n      This is _not_ the same as min domain value, such that if all values are greater than \\`logMinLimit\\`,\n      the domain min will be determined solely by the dataset.\\n\\nThe \\`domain.logBase\\` and \\`xDomain.logBase\\` options\n      provide a way to set the base of the log to one of following:\n      [\\`10\\`](https://en.wikipedia.org/wiki/Common_logarithm) (base 10),\n      [\\`2\\`](https://en.wikipedia.org/wiki/Binary_logarithm) (base 2),\n      [\\`Math.E\\`](https://en.wikipedia.org/wiki/Natural_logarithm) (base e), the default is \\`Common\\``,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rows = number('Rows in dataset', 11, { min: 5, step: 2, max: 21 });\\n  const yLogKnobs = getLogKnobs(false);\\n  const xLogKnobs = getLogKnobs(true);\\n  const data = getData(rows, yLogKnobs, xLogKnobs);\\n  const type = getSeriesType();\\n  const curve = customKnobs.enum.curve('Curve type');\\n  const Series = seriesMap[type];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xLogKnobs} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" position={Position.Left} domain={yLogKnobs} tickFormat={logFormatter(yLogKnobs.logBase)} />\\n      <Axis\\n        id=\\\"x\\\"\\n        tickFormat={logFormatter(xLogKnobs.logBase)}\\n        position={Position.Bottom}\\n        style={{ tickLabel: { rotation: -90 } }}\\n      />\\n      <Series\\n        id=\\\"series\\\"\\n        curve={curve}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        yScaleType={yLogKnobs.scaleType}\\n        xScaleType={xLogKnobs.scaleType}\\n        areaSeriesStyle={{ point: { visible: true } }}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nfunction generateRandomBinary(bitCount: number) {\\n  return rng(0, 2 ** bitCount - 1);\\n}\\n\\nconst data = new Array(20).fill(1).map((_, x) => ({\\n  x,\\n  'Base 10': rng(0, 2000),\\n  'Base 2': generateRandomBinary(11),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const yAccessor = select('Data type', ['Base 10', 'Base 2'], 'Base 2');\\n  const yScaleType = select(\\n    'yScaleType',\\n    {\\n      Linear: ScaleType.Linear,\\n      'Linear Binary': ScaleType.LinearBinary,\\n    },\\n    ScaleType.LinearBinary,\\n  );\\n  const yNice = boolean('Nice y ticks', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"binary\\\" title={yAccessor} position={Position.Left} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        data={data}\\n        yNice={yNice}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={[yAccessor]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `By default, \\\\`Linear\\\\` scales compute scale ticks per base 10 numerical system.\\n  You may set the \\\\`yScaleType\\\\` to \\\\`LinearBinary\\\\` to compute ticks per base 2 numerical system.\\n  This base is also applied to tick nicing.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\n\nfunction generateRandomBinary(bitCount: number) {\n  return rng(0, 2 ** bitCount - 1);\n}\n\nconst data = new Array(20).fill(1).map((_, x) => ({\n  x,\n  'Base 10': rng(0, 2000),\n  'Base 2': generateRandomBinary(11),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const yAccessor = select('Data type', ['Base 10', 'Base 2'], 'Base 2');\n  const yScaleType = select(\n    'yScaleType',\n    {\n      Linear: ScaleType.Linear,\n      'Linear Binary': ScaleType.LinearBinary,\n    },\n    ScaleType.LinearBinary,\n  );\n  const yNice = boolean('Nice y ticks', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"binary\" title={yAccessor} position={Position.Left} />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        data={data}\n        yNice={yNice}\n        xAccessor=\"x\"\n        yAccessors={[yAccessor]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `By default, \\`Linear\\` scales compute scale ticks per base 10 numerical system.\n  You may set the \\`yScaleType\\` to \\`LinearBinary\\` to compute ticks per base 2 numerical system.\n  This base is also applied to tick nicing.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const yAccessor = select('Data type', ['Base 10', 'Base 2'], 'Base 2');\\n  const yScaleType = select(\\n    'yScaleType',\\n    {\\n      Linear: ScaleType.Linear,\\n      'Linear Binary': ScaleType.LinearBinary,\\n    },\\n    ScaleType.LinearBinary,\\n  );\\n  const yNice = boolean('Nice y ticks', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"binary\\\" title={yAccessor} position={Position.Left} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        data={data}\\n        yNice={yNice}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={[yAccessor]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Scales',\n};\n\nexport { Example as timezoneConfiguration } from './1_different_timezones.story';\nexport { Example as tooltipInLocalTimezone } from './2_local_tooltip.story';\nexport { Example as tooltipInUTC } from './3_utc_tooltip.story';\nexport { Example as specifiedTimezone } from './4_specified_timezone.story';\nexport { Example as xScaleFallback } from './6_x_scale_fallback.story';\nexport { Example as logScaleOptions } from './7_log_scale_options.story';\nexport { Example as linearBinary } from './8_linear_binary.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  AreaSeries,\\n  LIGHT_THEME,\\n  niceTimeFormatByDay,\\n  timeFormatter,\\n  BrushAxis,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 60;\\nconst data = dg.generateGroupedSeries(numOfDays, 6, 'CPU ').map((d) => {\\n  return {\\n    ...d,\\n    x: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\\n    y: d.y * 10,\\n  };\\n});\\nconst dataForLogScale = data.map((d) => ({ ...d, y: d.y - 3 }));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showLegend = boolean('Show Legend', false);\\n  const onElementClick = action('onElementClick');\\n  const tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\\n  const useLogScale = boolean('Use log scale (different data)', false);\\n\\n  return (\\n    <>\\n      <Chart title={title} description={description} size={['100%', 400]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onElementClick={onElementClick}\\n          showLegend={showLegend}\\n          onBrushEnd={(d) => {\\n            if (d.x) {\\n              action('brushEventX')(tickTimeFormatter(d.x[0] ?? 0), tickTimeFormatter(d.x[1] ?? 0), d.y);\\n            }\\n          }}\\n          brushAxis={BrushAxis.X}\\n        />\\n        <Axis\\n          id=\\\"time\\\"\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          tickFormat={tickTimeFormatter}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom }, padding: 0 },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"axis\\\"\\n          position={Position.Right}\\n          gridLine={{ visible: true }}\\n          tickFormat={(d) => d.toFixed(0)}\\n          ticks={2}\\n          style={{\\n            tickLine: { padding: 2, size: 3 },\\n            axisTitle: { visible: false },\\n            axisPanelTitle: { visible: false },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"small multiple categories\\\"\\n          position={Position.Left}\\n          gridLine={{ visible: false }}\\n          tickFormat={(d) => d.toFixed(0)}\\n          ticks={2}\\n          style={{\\n            axisLine: { visible: false },\\n            tickLabel: {\\n              visible: false,\\n            },\\n            tickLine: {\\n              visible: false,\\n            },\\n          }}\\n        />\\n\\n        <GroupBy\\n          id=\\\"v_split\\\"\\n          by={(spec, { g }) => {\\n            return g;\\n          }}\\n          sort=\\\"alphaDesc\\\"\\n        />\\n        <SmallMultiples splitVertically=\\\"v_split\\\" style={{ verticalPanelPadding: { outer: 0, inner: 0.3 } }} />\\n        <AreaSeries\\n          id=\\\"CPU Temp\\\"\\n          name={(d, isTooltip) => (isTooltip ? `${d.smVerticalAccessorValue}` : 'CPU temp in ℃')}\\n          xScaleType={ScaleType.Time}\\n          yScaleType={useLogScale ? ScaleType.Log : ScaleType.Linear}\\n          timeZone=\\\"local\\\"\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          color={LIGHT_THEME.colors.vizColors[1]}\\n          data={useLogScale ? dataForLogScale : data}\\n          yNice\\n          tickFormat={(d) => `${d.toFixed(2)}℃`}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `The above chart shows an example of small multiples technique that splits our dataset into multiple\\n      sub-series vertically positioned one below the other.\\n      The configuration is obtained by defining a \\\\`<GroupBy />\\\\` operation component that define the property used to\\n      divide/group my dataset(via to the \\\\`by\\\\` props) and using the specified \\\\`id\\\\` of that operation inside the\\n      \\\\`<SmallMultiples splitVertically=\\\"id_of_group_by_op\\\" />\\\\` component.\\n\\nEach charts has the same vertical and horizontal axis scale.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":44},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":44},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  AreaSeries,\n  LIGHT_THEME,\n  niceTimeFormatByDay,\n  timeFormatter,\n  BrushAxis,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 60;\nconst data = dg.generateGroupedSeries(numOfDays, 6, 'CPU ').map((d) => {\n  return {\n    ...d,\n    x: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\n    y: d.y * 10,\n  };\n});\nconst dataForLogScale = data.map((d) => ({ ...d, y: d.y - 3 }));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showLegend = boolean('Show Legend', false);\n  const onElementClick = action('onElementClick');\n  const tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\n  const useLogScale = boolean('Use log scale (different data)', false);\n\n  return (\n    <>\n      <Chart title={title} description={description} size={['100%', 400]}>\n        <Settings\n          baseTheme={useBaseTheme()}\n          onElementClick={onElementClick}\n          showLegend={showLegend}\n          onBrushEnd={(d) => {\n            if (d.x) {\n              action('brushEventX')(tickTimeFormatter(d.x[0] ?? 0), tickTimeFormatter(d.x[1] ?? 0), d.y);\n            }\n          }}\n          brushAxis={BrushAxis.X}\n        />\n        <Axis\n          id=\"time\"\n          position={Position.Bottom}\n          gridLine={{ visible: true }}\n          tickFormat={tickTimeFormatter}\n          timeAxisLayerCount={2}\n          style={{\n            tickLine: { size: 0.0001, padding: 4 },\n            tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom }, padding: 0 },\n          }}\n        />\n        <Axis\n          id=\"axis\"\n          position={Position.Right}\n          gridLine={{ visible: true }}\n          tickFormat={(d) => d.toFixed(0)}\n          ticks={2}\n          style={{\n            tickLine: { padding: 2, size: 3 },\n            axisTitle: { visible: false },\n            axisPanelTitle: { visible: false },\n          }}\n        />\n        <Axis\n          id=\"small multiple categories\"\n          position={Position.Left}\n          gridLine={{ visible: false }}\n          tickFormat={(d) => d.toFixed(0)}\n          ticks={2}\n          style={{\n            axisLine: { visible: false },\n            tickLabel: {\n              visible: false,\n            },\n            tickLine: {\n              visible: false,\n            },\n          }}\n        />\n\n        <GroupBy\n          id=\"v_split\"\n          by={(spec, { g }) => {\n            return g;\n          }}\n          sort=\"alphaDesc\"\n        />\n        <SmallMultiples splitVertically=\"v_split\" style={{ verticalPanelPadding: { outer: 0, inner: 0.3 } }} />\n        <AreaSeries\n          id=\"CPU Temp\"\n          name={(d, isTooltip) => (isTooltip ? `${d.smVerticalAccessorValue}` : 'CPU temp in ℃')}\n          xScaleType={ScaleType.Time}\n          yScaleType={useLogScale ? ScaleType.Log : ScaleType.Linear}\n          timeZone=\"local\"\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          color={LIGHT_THEME.colors.vizColors[1]}\n          data={useLogScale ? dataForLogScale : data}\n          yNice\n          tickFormat={(d) => `${d.toFixed(2)}℃`}\n        />\n      </Chart>\n    </>\n  );\n};\nExample.parameters = {\n  markdown: `The above chart shows an example of small multiples technique that splits our dataset into multiple\n      sub-series vertically positioned one below the other.\n      The configuration is obtained by defining a \\`<GroupBy />\\` operation component that define the property used to\n      divide/group my dataset(via to the \\`by\\` props) and using the specified \\`id\\` of that operation inside the\n      \\`<SmallMultiples splitVertically=\"id_of_group_by_op\" />\\` component.\n\nEach charts has the same vertical and horizontal axis scale.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showLegend = boolean('Show Legend', false);\\n  const onElementClick = action('onElementClick');\\n  const tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\\n  const useLogScale = boolean('Use log scale (different data)', false);\\n\\n  return (\\n    <>\\n      <Chart title={title} description={description} size={['100%', 400]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onElementClick={onElementClick}\\n          showLegend={showLegend}\\n          onBrushEnd={(d) => {\\n            if (d.x) {\\n              action('brushEventX')(tickTimeFormatter(d.x[0] ?? 0), tickTimeFormatter(d.x[1] ?? 0), d.y);\\n            }\\n          }}\\n          brushAxis={BrushAxis.X}\\n        />\\n        <Axis\\n          id=\\\"time\\\"\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          tickFormat={tickTimeFormatter}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom }, padding: 0 },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"axis\\\"\\n          position={Position.Right}\\n          gridLine={{ visible: true }}\\n          tickFormat={(d) => d.toFixed(0)}\\n          ticks={2}\\n          style={{\\n            tickLine: { padding: 2, size: 3 },\\n            axisTitle: { visible: false },\\n            axisPanelTitle: { visible: false },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"small multiple categories\\\"\\n          position={Position.Left}\\n          gridLine={{ visible: false }}\\n          tickFormat={(d) => d.toFixed(0)}\\n          ticks={2}\\n          style={{\\n            axisLine: { visible: false },\\n            tickLabel: {\\n              visible: false,\\n            },\\n            tickLine: {\\n              visible: false,\\n            },\\n          }}\\n        />\\n\\n        <GroupBy\\n          id=\\\"v_split\\\"\\n          by={(spec, { g }) => {\\n            return g;\\n          }}\\n          sort=\\\"alphaDesc\\\"\\n        />\\n        <SmallMultiples splitVertically=\\\"v_split\\\" style={{ verticalPanelPadding: { outer: 0, inner: 0.3 } }} />\\n        <AreaSeries\\n          id=\\\"CPU Temp\\\"\\n          name={(d, isTooltip) => (isTooltip ? `${d.smVerticalAccessorValue}` : 'CPU temp in ℃')}\\n          xScaleType={ScaleType.Time}\\n          yScaleType={useLogScale ? ScaleType.Log : ScaleType.Linear}\\n          timeZone=\\\"local\\\"\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          color={LIGHT_THEME.colors.vizColors[1]}\\n          data={useLogScale ? dataForLogScale : data}\\n          yNice\\n          tickFormat={(d) => `${d.toFixed(2)}℃`}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number, text } from '@storybook/addon-knobs';\\nimport { startCase } from 'lodash';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  LineSeries,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  niceTimeFormatByDay,\\n  timeFormatter,\\n  AxisSpec,\\n  XYBrushEvent,\\n} from '@elastic/charts';\\nimport { isVerticalAxis } from '@elastic/charts/src/chart_types/xy_chart/utils/axis_type_utils';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 90;\\nconst groupNames = new Array(16).fill(0).map((d, i) => String.fromCharCode(97 + i));\\nconst data = dg.generateGroupedSeries(numOfDays, 16).map((d) => {\\n  return {\\n    y: d.y,\\n    x: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\\n    g: d.g,\\n    h: groupNames.indexOf(d.g) % 4,\\n    v: Math.floor(groupNames.indexOf(d.g) / 4),\\n  };\\n});\\n\\nconst getAxisStyle = (position: Position): AxisSpec['style'] => ({\\n  tickLabel: {\\n    padding: 5,\\n  },\\n  axisPanelTitle: {\\n    visible: !boolean('Hide panel titles', false, position),\\n  },\\n  axisTitle: {\\n    padding: 2,\\n    visible: !boolean('Hide title', false, position),\\n  },\\n  tickLine: {\\n    visible: false,\\n  },\\n});\\nconst tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\\n\\nconst getAxisOptions = (\\n  position: Position,\\n): Pick<AxisSpec, 'id' | 'title' | 'gridLine' | 'ticks' | 'domain' | 'tickFormat' | 'style' | 'hide' | 'position'> => {\\n  const isPrimary = position === Position.Left || position === Position.Bottom;\\n  const isVertical = isVerticalAxis(position);\\n  return {\\n    id: position,\\n    position,\\n    ticks: isVertical ? 2 : undefined,\\n    tickFormat: isVertical ? (d) => d.toFixed(2) : tickTimeFormatter,\\n    domain: isVertical\\n      ? {\\n          min: NaN,\\n          max: 10,\\n        }\\n      : undefined,\\n    hide: boolean('Hide', !isPrimary, position),\\n    gridLine: {\\n      visible: boolean('Show grid line', isPrimary, position),\\n    },\\n    style: getAxisStyle(position),\\n    title: text(\\n      'Title',\\n      isVertical ? `Metrics - ${startCase(position)}` : `Hosts - ${startCase(position)}`,\\n      position,\\n    ).trim(),\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('Debug', false);\\n  const showLegend = boolean('Show Legend', false);\\n  const onElementClick = action('onElementClick');\\n  const metricPrefix = text('metric prefix', `Metric `).trim();\\n  const hostPrefix = text('host prefix', `Host `).trim();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onElementClick={onElementClick}\\n        showLegend={showLegend}\\n        theme={{\\n          lineSeriesStyle: {\\n            point: {\\n              visible: false,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        onBrushEnd={(e) => {\\n          const { x } = e as XYBrushEvent;\\n          if (x) {\\n            action('brushEvent')(tickTimeFormatter(x[0] ?? 0), tickTimeFormatter(x[1] ?? 0));\\n          }\\n        }}\\n      />\\n      <Axis {...getAxisOptions(Position.Left)} />\\n      <Axis {...getAxisOptions(Position.Bottom)} />\\n      <Axis {...getAxisOptions(Position.Top)} />\\n      <Axis {...getAxisOptions(Position.Right)} />\\n\\n      <GroupBy id=\\\"v_split\\\" by={(_, { v }) => v} format={(v) => `${metricPrefix} ${v}`} sort=\\\"numDesc\\\" />\\n      <GroupBy id=\\\"h_split\\\" by={(_, { h }) => h} format={(v) => `${hostPrefix} ${v}`} sort=\\\"numAsc\\\" />\\n      <SmallMultiples\\n        splitVertically=\\\"v_split\\\"\\n        splitHorizontally=\\\"h_split\\\"\\n        style={{\\n          horizontalPanelPadding: {\\n            outer: number('Horizontal outer pad', 0, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Horizontal inner pad', 0.1, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n          verticalPanelPadding: {\\n            outer: number('Vertical outer pad', 0, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Vertical inner pad', 0.3, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n        }}\\n      />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        name={({ splitAccessors }) => `Host ${splitAccessors.get('h')}`}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"UTC\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['h']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `It is possible to add either a vertical and horizontal \\\\`<GroupBy/>\\\\` operations to create a grid of\\nsmall multiples.\\nThe assignment of the series colors can be handled by defining an accessor in the \\\\`color\\\\` prop of the series that\\nconsider the \\\\`smHorizontalAccessorValue\\\\` or \\\\`smVerticalAccessorValue\\\\` values when returning the assigned color.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":94},\"endLoc\":{\"col\":1,\"line\":177},\"startBody\":{\"col\":36,\"line\":94},\"endBody\":{\"col\":1,\"line\":177}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number, text } from '@storybook/addon-knobs';\nimport { startCase } from 'lodash';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  LineSeries,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  niceTimeFormatByDay,\n  timeFormatter,\n  AxisSpec,\n  XYBrushEvent,\n} from '@elastic/charts';\nimport { isVerticalAxis } from '@elastic/charts/src/chart_types/xy_chart/utils/axis_type_utils';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 90;\nconst groupNames = new Array(16).fill(0).map((d, i) => String.fromCharCode(97 + i));\nconst data = dg.generateGroupedSeries(numOfDays, 16).map((d) => {\n  return {\n    y: d.y,\n    x: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\n    g: d.g,\n    h: groupNames.indexOf(d.g) % 4,\n    v: Math.floor(groupNames.indexOf(d.g) / 4),\n  };\n});\n\nconst getAxisStyle = (position: Position): AxisSpec['style'] => ({\n  tickLabel: {\n    padding: 5,\n  },\n  axisPanelTitle: {\n    visible: !boolean('Hide panel titles', false, position),\n  },\n  axisTitle: {\n    padding: 2,\n    visible: !boolean('Hide title', false, position),\n  },\n  tickLine: {\n    visible: false,\n  },\n});\nconst tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\n\nconst getAxisOptions = (\n  position: Position,\n): Pick<AxisSpec, 'id' | 'title' | 'gridLine' | 'ticks' | 'domain' | 'tickFormat' | 'style' | 'hide' | 'position'> => {\n  const isPrimary = position === Position.Left || position === Position.Bottom;\n  const isVertical = isVerticalAxis(position);\n  return {\n    id: position,\n    position,\n    ticks: isVertical ? 2 : undefined,\n    tickFormat: isVertical ? (d) => d.toFixed(2) : tickTimeFormatter,\n    domain: isVertical\n      ? {\n          min: NaN,\n          max: 10,\n        }\n      : undefined,\n    hide: boolean('Hide', !isPrimary, position),\n    gridLine: {\n      visible: boolean('Show grid line', isPrimary, position),\n    },\n    style: getAxisStyle(position),\n    title: text(\n      'Title',\n      isVertical ? `Metrics - ${startCase(position)}` : `Hosts - ${startCase(position)}`,\n      position,\n    ).trim(),\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('Debug', false);\n  const showLegend = boolean('Show Legend', false);\n  const onElementClick = action('onElementClick');\n  const metricPrefix = text('metric prefix', `Metric `).trim();\n  const hostPrefix = text('host prefix', `Host `).trim();\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onElementClick={onElementClick}\n        showLegend={showLegend}\n        theme={{\n          lineSeriesStyle: {\n            point: {\n              visible: false,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        onBrushEnd={(e) => {\n          const { x } = e as XYBrushEvent;\n          if (x) {\n            action('brushEvent')(tickTimeFormatter(x[0] ?? 0), tickTimeFormatter(x[1] ?? 0));\n          }\n        }}\n      />\n      <Axis {...getAxisOptions(Position.Left)} />\n      <Axis {...getAxisOptions(Position.Bottom)} />\n      <Axis {...getAxisOptions(Position.Top)} />\n      <Axis {...getAxisOptions(Position.Right)} />\n\n      <GroupBy id=\"v_split\" by={(_, { v }) => v} format={(v) => `${metricPrefix} ${v}`} sort=\"numDesc\" />\n      <GroupBy id=\"h_split\" by={(_, { h }) => h} format={(v) => `${hostPrefix} ${v}`} sort=\"numAsc\" />\n      <SmallMultiples\n        splitVertically=\"v_split\"\n        splitHorizontally=\"h_split\"\n        style={{\n          horizontalPanelPadding: {\n            outer: number('Horizontal outer pad', 0, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n            inner: number('Horizontal inner pad', 0.1, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n          },\n          verticalPanelPadding: {\n            outer: number('Vertical outer pad', 0, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n            inner: number('Vertical inner pad', 0.3, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n          },\n        }}\n      />\n\n      <LineSeries\n        id=\"line\"\n        name={({ splitAccessors }) => `Host ${splitAccessors.get('h')}`}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"UTC\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['h']}\n        data={data}\n      />\n    </Chart>\n  );\n};\nExample.parameters = {\n  markdown: `It is possible to add either a vertical and horizontal \\`<GroupBy/>\\` operations to create a grid of\nsmall multiples.\nThe assignment of the series colors can be handled by defining an accessor in the \\`color\\` prop of the series that\nconsider the \\`smHorizontalAccessorValue\\` or \\`smVerticalAccessorValue\\` values when returning the assigned color.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('Debug', false);\\n  const showLegend = boolean('Show Legend', false);\\n  const onElementClick = action('onElementClick');\\n  const metricPrefix = text('metric prefix', `Metric `).trim();\\n  const hostPrefix = text('host prefix', `Host `).trim();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onElementClick={onElementClick}\\n        showLegend={showLegend}\\n        theme={{\\n          lineSeriesStyle: {\\n            point: {\\n              visible: false,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        onBrushEnd={(e) => {\\n          const { x } = e as XYBrushEvent;\\n          if (x) {\\n            action('brushEvent')(tickTimeFormatter(x[0] ?? 0), tickTimeFormatter(x[1] ?? 0));\\n          }\\n        }}\\n      />\\n      <Axis {...getAxisOptions(Position.Left)} />\\n      <Axis {...getAxisOptions(Position.Bottom)} />\\n      <Axis {...getAxisOptions(Position.Top)} />\\n      <Axis {...getAxisOptions(Position.Right)} />\\n\\n      <GroupBy id=\\\"v_split\\\" by={(_, { v }) => v} format={(v) => `${metricPrefix} ${v}`} sort=\\\"numDesc\\\" />\\n      <GroupBy id=\\\"h_split\\\" by={(_, { h }) => h} format={(v) => `${hostPrefix} ${v}`} sort=\\\"numAsc\\\" />\\n      <SmallMultiples\\n        splitVertically=\\\"v_split\\\"\\n        splitHorizontally=\\\"h_split\\\"\\n        style={{\\n          horizontalPanelPadding: {\\n            outer: number('Horizontal outer pad', 0, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Horizontal inner pad', 0.1, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n          verticalPanelPadding: {\\n            outer: number('Vertical outer pad', 0, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Vertical inner pad', 0.3, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n        }}\\n      />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        name={({ splitAccessors }) => `Host ${splitAccessors.get('h')}`}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"UTC\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['h']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  BarSeries,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 7;\\nfunction generateData() {\\n  return dg.generateGroupedSeries(numOfDays, 2).map((d) => {\\n    return {\\n      ...d,\\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\\n      y: Math.floor(d.y * 10),\\n      g: d.g === 'a' ? 'new user' : 'existing user',\\n    };\\n  });\\n}\\nconst data1 = generateData();\\nconst data2 = generateData();\\nconst data3 = generateData();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n  const disableSmallMultiples = boolean('Disable small multiples', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} rotation={90} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Day of week\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec) => {\\n          return spec.id;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      {!disableSmallMultiples && <SmallMultiples splitHorizontally=\\\"h_split\\\" />}\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        name={({ splitAccessors }) => `WebA - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"website b\\\"\\n        name={({ splitAccessors }) => `WebB - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data2}\\n      />\\n      <BarSeries\\n        id=\\\"website c\\\"\\n        name={({ splitAccessors }) => `WebC - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `Similarly to the Vertical Areas example, the above chart shows an example of small multiples technique\\nthat splits our dataset into multiple sub-series horizontally positioned one aside the other.\\nIn this case, the \\\\`<GroupBy />\\\\` id is used to specify the horizontal split via the \\\\`splitHorizontally\\\\` prop.\\n\\nAs for single charts, we can merge and handle multiple data-series together and specify a \\\\`by\\\\` accessor to consider\\nthe specific case. An additional property \\\\`sort\\\\` is available to configure the sorting order of the vertical or\\nhorizontal split.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":47},\"endLoc\":{\"col\":1,\"line\":138},\"startBody\":{\"col\":36,\"line\":47},\"endBody\":{\"col\":1,\"line\":138}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  BarSeries,\n  LineAnnotation,\n  AnnotationDomainType,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 7;\nfunction generateData() {\n  return dg.generateGroupedSeries(numOfDays, 2).map((d) => {\n    return {\n      ...d,\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\n      y: Math.floor(d.y * 10),\n      g: d.g === 'a' ? 'new user' : 'existing user',\n    };\n  });\n}\nconst data1 = generateData();\nconst data2 = generateData();\nconst data3 = generateData();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const marker = (\n    <span\n      style={{\n        backgroundColor: 'lightgray',\n        padding: 2,\n        width: 30,\n        height: 10,\n        margin: 'auto',\n        fontSize: 8,\n        borderRadius: 2,\n      }}\n    >\n      MIN\n    </span>\n  );\n  const showLegend = boolean('Show Legend', true);\n  const onElementClick = action('onElementClick');\n  const disableSmallMultiples = boolean('Disable small multiples', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings onElementClick={onElementClick} rotation={90} showLegend={showLegend} baseTheme={useBaseTheme()} />\n      <Axis id=\"time\" position={Position.Bottom} gridLine={{ visible: false }} />\n      <Axis id=\"y\" title=\"Day of week\" position={Position.Left} gridLine={{ visible: false }} />\n\n      <GroupBy\n        id=\"h_split\"\n        by={(spec) => {\n          return spec.id;\n        }}\n        sort=\"alphaAsc\"\n      />\n      {!disableSmallMultiples && <SmallMultiples splitHorizontally=\"h_split\" />}\n      <LineAnnotation\n        dataValues={[\n          {\n            dataValue: 100,\n            details: 'Minimum # of connected users',\n          },\n        ]}\n        id=\"threshold\"\n        domainType={AnnotationDomainType.YDomain}\n        marker={marker}\n        style={{\n          line: {\n            dash: [5, 10],\n            stroke: 'black',\n            opacity: 0.8,\n            strokeWidth: 1,\n          },\n        }}\n      />\n      <BarSeries\n        id=\"website a\"\n        name={({ splitAccessors }) => `WebA - ${splitAccessors.get('g')}`}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data1}\n      />\n      <BarSeries\n        id=\"website b\"\n        name={({ splitAccessors }) => `WebB - ${splitAccessors.get('g')}`}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data2}\n      />\n      <BarSeries\n        id=\"website c\"\n        name={({ splitAccessors }) => `WebC - ${splitAccessors.get('g')}`}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data3}\n      />\n    </Chart>\n  );\n};\nExample.parameters = {\n  markdown: `Similarly to the Vertical Areas example, the above chart shows an example of small multiples technique\nthat splits our dataset into multiple sub-series horizontally positioned one aside the other.\nIn this case, the \\`<GroupBy />\\` id is used to specify the horizontal split via the \\`splitHorizontally\\` prop.\n\nAs for single charts, we can merge and handle multiple data-series together and specify a \\`by\\` accessor to consider\nthe specific case. An additional property \\`sort\\` is available to configure the sorting order of the vertical or\nhorizontal split.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n  const disableSmallMultiples = boolean('Disable small multiples', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} rotation={90} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Day of week\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec) => {\\n          return spec.id;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      {!disableSmallMultiples && <SmallMultiples splitHorizontally=\\\"h_split\\\" />}\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        name={({ splitAccessors }) => `WebA - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"website b\\\"\\n        name={({ splitAccessors }) => `WebB - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data2}\\n      />\\n      <BarSeries\\n        id=\\\"website c\\\"\\n        name={({ splitAccessors }) => `WebC - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  BarSeries,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n  LIGHT_THEME,\\n  LineSeries,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 7;\\nfunction generateData(totalGroups: number, mappings: Record<string, string>) {\\n  return dg.generateGroupedSeries(numOfDays, totalGroups).map((d) => {\\n    return {\\n      ...d,\\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\\n      y: Math.floor(d.y * 10),\\n      g: mappings[d.g],\\n    };\\n  });\\n}\\nconst data1 = generateData(2, { a: 'new user', b: 'existing user' }).map((d) => ({ ...d, site: 'website A' }));\\nconst data2 = generateData(2, { a: 'new user', b: 'existing user' }).map((d) => ({ ...d, site: 'website B' }));\\n\\nconst datal1 = generateData(2, { a: 'avg new user', b: 'avg existing user' }).map((d) => ({\\n  ...d,\\n  site: 'website A',\\n}));\\nconst datal2 = generateData(2, { a: 'avg new user', b: 'avg existing user' }).map((d) => ({\\n  ...d,\\n  site: 'website B',\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" title=\\\"Day of week\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Count of logins\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec, datum) => {\\n          return datum.site;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      <SmallMultiples splitVertically=\\\"h_split\\\" />\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={[...data1, ...data2]}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <LineSeries\\n        id=\\\"avg\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={[...datal1, ...datal2]}\\n        lineSeriesStyle={{\\n          point: {\\n            radius: 1,\\n            fill: ColorVariant.Series,\\n          },\\n        }}\\n        color={['black', 'darkgray']}\\n      />\\n    </Chart>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `Similarly to the Vertical Areas example, the above chart shows an example of small multiples technique\\nthat splits our dataset into multiple sub-series horizontally positioned one aside the other.\\nIn this case, the \\\\`<GroupBy />\\\\` id is used to specify the horizontal split via the \\\\`splitHorizontally\\\\` prop.\\n\\nAs for single charts, we can merge and handle multiple data-series together and specify a \\\\`by\\\\` accessor to consider\\nthe specific case. An additional property \\\\`sort\\\\` is available to configure the sorting order of the vertical or\\nhorizontal split.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":58},\"endLoc\":{\"col\":1,\"line\":141},\"startBody\":{\"col\":36,\"line\":58},\"endBody\":{\"col\":1,\"line\":141}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  BarSeries,\n  LineAnnotation,\n  AnnotationDomainType,\n  LIGHT_THEME,\n  LineSeries,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 7;\nfunction generateData(totalGroups: number, mappings: Record<string, string>) {\n  return dg.generateGroupedSeries(numOfDays, totalGroups).map((d) => {\n    return {\n      ...d,\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\n      y: Math.floor(d.y * 10),\n      g: mappings[d.g],\n    };\n  });\n}\nconst data1 = generateData(2, { a: 'new user', b: 'existing user' }).map((d) => ({ ...d, site: 'website A' }));\nconst data2 = generateData(2, { a: 'new user', b: 'existing user' }).map((d) => ({ ...d, site: 'website B' }));\n\nconst datal1 = generateData(2, { a: 'avg new user', b: 'avg existing user' }).map((d) => ({\n  ...d,\n  site: 'website A',\n}));\nconst datal2 = generateData(2, { a: 'avg new user', b: 'avg existing user' }).map((d) => ({\n  ...d,\n  site: 'website B',\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const marker = (\n    <span\n      style={{\n        backgroundColor: 'lightgray',\n        padding: 2,\n        width: 30,\n        height: 10,\n        margin: 'auto',\n        fontSize: 8,\n        borderRadius: 2,\n      }}\n    >\n      MIN\n    </span>\n  );\n  const showLegend = boolean('Show Legend', true);\n  const onElementClick = action('onElementClick');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\n      <Axis id=\"time\" title=\"Day of week\" position={Position.Bottom} gridLine={{ visible: false }} />\n      <Axis id=\"y\" title=\"Count of logins\" position={Position.Left} gridLine={{ visible: false }} />\n\n      <GroupBy\n        id=\"h_split\"\n        by={(spec, datum) => {\n          return datum.site;\n        }}\n        sort=\"alphaAsc\"\n      />\n      <SmallMultiples splitVertically=\"h_split\" />\n      <LineAnnotation\n        dataValues={[\n          {\n            dataValue: 100,\n            details: 'Minimum # of connected users',\n          },\n        ]}\n        id=\"threshold\"\n        domainType={AnnotationDomainType.YDomain}\n        marker={marker}\n        style={{\n          line: {\n            dash: [5, 10],\n            stroke: 'black',\n            opacity: 0.8,\n            strokeWidth: 1,\n          },\n        }}\n      />\n      <BarSeries\n        id=\"website a\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={[...data1, ...data2]}\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\n      />\n      <LineSeries\n        id=\"avg\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={[...datal1, ...datal2]}\n        lineSeriesStyle={{\n          point: {\n            radius: 1,\n            fill: ColorVariant.Series,\n          },\n        }}\n        color={['black', 'darkgray']}\n      />\n    </Chart>\n  );\n};\nExample.parameters = {\n  markdown: `Similarly to the Vertical Areas example, the above chart shows an example of small multiples technique\nthat splits our dataset into multiple sub-series horizontally positioned one aside the other.\nIn this case, the \\`<GroupBy />\\` id is used to specify the horizontal split via the \\`splitHorizontally\\` prop.\n\nAs for single charts, we can merge and handle multiple data-series together and specify a \\`by\\` accessor to consider\nthe specific case. An additional property \\`sort\\` is available to configure the sorting order of the vertical or\nhorizontal split.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" title=\\\"Day of week\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Count of logins\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec, datum) => {\\n          return datum.site;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      <SmallMultiples splitVertically=\\\"h_split\\\" />\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={[...data1, ...data2]}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <LineSeries\\n        id=\\\"avg\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={[...datal1, ...datal2]}\\n        lineSeriesStyle={{\\n          point: {\\n            radius: 1,\\n            fill: ColorVariant.Series,\\n          },\\n        }}\\n        color={['black', 'darkgray']}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { ScaleType, Position, Chart, Axis, GroupBy, SmallMultiples, Settings, BarSeries } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst data = [\\n  { x: 30, split: 'Cloudy', y: 9 },\\n  { x: 45, split: 'Sunny', y: 8 },\\n  { x: 60, split: 'Rain', y: 5 },\\n  { x: 75, split: 'Sunny', y: 7 },\\n  { x: 90, split: 'Rain', y: 6 },\\n  { x: 105, split: 'Rain', y: 7 },\\n  { x: 120, split: 'Clear', y: 7 },\\n  { x: 135, split: 'Cloudy', y: 8 },\\n  { x: 150, split: 'Cloudy', y: 8 },\\n  { x: 165, split: 'Rain', y: 8 },\\n  { x: 180, split: 'Rain', y: 10 },\\n  { x: 195, split: 'Rain', y: 10 },\\n  { x: 210, split: 'Sunny', y: 9 },\\n  { x: 225, split: 'Rain', y: 10 },\\n  { x: 240, split: 'Clear', y: 12 },\\n  { x: 255, split: 'Cloudy', y: 9 },\\n  { x: 270, split: 'Clear', y: 12 },\\n  { x: 285, split: 'Cloudy', y: 5 },\\n  { x: 300, split: 'Rain', y: 7 },\\n  { x: 315, split: 'Sunny', y: 8 },\\n  { x: 330, split: 'Cloudy', y: 8 },\\n  { x: 345, split: 'Sunny', y: 8 },\\n  { x: 360, split: 'Sunny', y: 10 },\\n];\\nconst numberOptions = {\\n  min: 0,\\n  max: 1,\\n  step: 0.05,\\n};\\nconst colorMap: Record<string, string> = {\\n  Rain: 'blue',\\n  Sunny: 'orange',\\n  Cloudy: 'gray',\\n  Clear: 'lightblue',\\n  Default: 'red',\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const enableHistogramMode = boolean('EnableHistogramMode', true);\\n  const barsPadding = number('barsPadding', 0, numberOptions);\\n  const histogramPadding = number('histogramPadding', 0, numberOptions);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={{ scales: { barsPadding, histogramPadding } }} showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"y\\\"\\n        title=\\\"Humidity %\\\"\\n        position={Position.Left}\\n        labelFormat={(label) => {\\n          return `${label} %`;\\n        }}\\n      />\\n\\n      <GroupBy id=\\\"splitId\\\" by={(_, datum) => datum.split} sort=\\\"dataIndex\\\" />\\n      <SmallMultiples splitHorizontally=\\\"splitId\\\" />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        enableHistogramMode={enableHistogramMode}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={data}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['split']}\\n        color={(seriesIdentifier) => {\\n          return colorMap[seriesIdentifier.splitAccessors.get('split') ?? 'Default'];\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":55},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":55},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { ScaleType, Position, Chart, Axis, GroupBy, SmallMultiples, Settings, BarSeries } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst data = [\n  { x: 30, split: 'Cloudy', y: 9 },\n  { x: 45, split: 'Sunny', y: 8 },\n  { x: 60, split: 'Rain', y: 5 },\n  { x: 75, split: 'Sunny', y: 7 },\n  { x: 90, split: 'Rain', y: 6 },\n  { x: 105, split: 'Rain', y: 7 },\n  { x: 120, split: 'Clear', y: 7 },\n  { x: 135, split: 'Cloudy', y: 8 },\n  { x: 150, split: 'Cloudy', y: 8 },\n  { x: 165, split: 'Rain', y: 8 },\n  { x: 180, split: 'Rain', y: 10 },\n  { x: 195, split: 'Rain', y: 10 },\n  { x: 210, split: 'Sunny', y: 9 },\n  { x: 225, split: 'Rain', y: 10 },\n  { x: 240, split: 'Clear', y: 12 },\n  { x: 255, split: 'Cloudy', y: 9 },\n  { x: 270, split: 'Clear', y: 12 },\n  { x: 285, split: 'Cloudy', y: 5 },\n  { x: 300, split: 'Rain', y: 7 },\n  { x: 315, split: 'Sunny', y: 8 },\n  { x: 330, split: 'Cloudy', y: 8 },\n  { x: 345, split: 'Sunny', y: 8 },\n  { x: 360, split: 'Sunny', y: 10 },\n];\nconst numberOptions = {\n  min: 0,\n  max: 1,\n  step: 0.05,\n};\nconst colorMap: Record<string, string> = {\n  Rain: 'blue',\n  Sunny: 'orange',\n  Cloudy: 'gray',\n  Clear: 'lightblue',\n  Default: 'red',\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const enableHistogramMode = boolean('EnableHistogramMode', true);\n  const barsPadding = number('barsPadding', 0, numberOptions);\n  const histogramPadding = number('histogramPadding', 0, numberOptions);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={{ scales: { barsPadding, histogramPadding } }} showLegend baseTheme={useBaseTheme()} />\n      <Axis id=\"x\" position={Position.Bottom} />\n      <Axis\n        id=\"y\"\n        title=\"Humidity %\"\n        position={Position.Left}\n        labelFormat={(label) => {\n          return `${label} %`;\n        }}\n      />\n\n      <GroupBy id=\"splitId\" by={(_, datum) => datum.split} sort=\"dataIndex\" />\n      <SmallMultiples splitHorizontally=\"splitId\" />\n\n      <BarSeries\n        id=\"bars\"\n        enableHistogramMode={enableHistogramMode}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={data}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['split']}\n        color={(seriesIdentifier) => {\n          return colorMap[seriesIdentifier.splitAccessors.get('split') ?? 'Default'];\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const enableHistogramMode = boolean('EnableHistogramMode', true);\\n  const barsPadding = number('barsPadding', 0, numberOptions);\\n  const histogramPadding = number('histogramPadding', 0, numberOptions);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={{ scales: { barsPadding, histogramPadding } }} showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"y\\\"\\n        title=\\\"Humidity %\\\"\\n        position={Position.Left}\\n        labelFormat={(label) => {\\n          return `${label} %`;\\n        }}\\n      />\\n\\n      <GroupBy id=\\\"splitId\\\" by={(_, datum) => datum.split} sort=\\\"dataIndex\\\" />\\n      <SmallMultiples splitHorizontally=\\\"splitId\\\" />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        enableHistogramMode={enableHistogramMode}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={data}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['split']}\\n        color={(seriesIdentifier) => {\\n          return colorMap[seriesIdentifier.splitAccessors.get('split') ?? 'Default'];\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  BarSeries,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n  LIGHT_THEME,\\n  LineSeries,\\n  AreaSeries,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 7;\\nfunction generateData() {\\n  return dg.generateGroupedSeries(numOfDays, 2).map((d) => {\\n    return {\\n      ...d,\\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\\n      y: Math.floor(d.y * 10),\\n      g: d.g === 'a' ? 'new user' : 'existing user',\\n    };\\n  });\\n}\\nconst data1 = generateData();\\nconst data2 = generateData();\\nconst data3 = generateData();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n        lineHeight: 8,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Day of week\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec) => {\\n          return spec.id;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      <SmallMultiples splitHorizontally=\\\"h_split\\\" />\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data1}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <LineSeries\\n        id=\\\"website b\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data2}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <AreaSeries\\n        id=\\\"website c\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data3}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":50},\"endLoc\":{\"col\":1,\"line\":141},\"startBody\":{\"col\":36,\"line\":50},\"endBody\":{\"col\":1,\"line\":141}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  BarSeries,\n  LineAnnotation,\n  AnnotationDomainType,\n  LIGHT_THEME,\n  LineSeries,\n  AreaSeries,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 7;\nfunction generateData() {\n  return dg.generateGroupedSeries(numOfDays, 2).map((d) => {\n    return {\n      ...d,\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\n      y: Math.floor(d.y * 10),\n      g: d.g === 'a' ? 'new user' : 'existing user',\n    };\n  });\n}\nconst data1 = generateData();\nconst data2 = generateData();\nconst data3 = generateData();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const marker = (\n    <span\n      style={{\n        backgroundColor: 'lightgray',\n        padding: 2,\n        width: 30,\n        height: 10,\n        margin: 'auto',\n        fontSize: 8,\n        borderRadius: 2,\n        lineHeight: 8,\n      }}\n    >\n      MIN\n    </span>\n  );\n  const showLegend = boolean('Show Legend', true);\n  const onElementClick = action('onElementClick');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\n      <Axis id=\"time\" position={Position.Bottom} gridLine={{ visible: false }} />\n      <Axis id=\"y\" title=\"Day of week\" position={Position.Left} gridLine={{ visible: false }} />\n\n      <GroupBy\n        id=\"h_split\"\n        by={(spec) => {\n          return spec.id;\n        }}\n        sort=\"alphaAsc\"\n      />\n      <SmallMultiples splitHorizontally=\"h_split\" />\n      <LineAnnotation\n        dataValues={[\n          {\n            dataValue: 100,\n            details: 'Minimum # of connected users',\n          },\n        ]}\n        id=\"threshold\"\n        domainType={AnnotationDomainType.YDomain}\n        marker={marker}\n        style={{\n          line: {\n            dash: [5, 10],\n            stroke: 'black',\n            opacity: 0.8,\n            strokeWidth: 1,\n          },\n        }}\n      />\n      <BarSeries\n        id=\"website a\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data1}\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\n      />\n      <LineSeries\n        id=\"website b\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data2}\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\n      />\n      <AreaSeries\n        id=\"website c\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data3}\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n        lineHeight: 8,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Day of week\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec) => {\\n          return spec.id;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      <SmallMultiples splitHorizontally=\\\"h_split\\\" />\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data1}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <LineSeries\\n        id=\\\"website b\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data2}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <AreaSeries\\n        id=\\\"website c\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data3}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, select, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  GroupBy,\\n  LegendStrategy,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  SmallMultiples,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { colorBrewerCategoricalPastel12, countryLookup, productLookup, regionLookup } from '../utils/utils';\\n\\nconst data = mocks.sunburst; // .filter((d) => countryLookup[d.dest].continentCountry.slice(0, 2) === 'eu');\\n\\nconst productToColor = new Map(\\n  data\\n    .map((d) => d.sitc1)\\n    .filter(keepDistinct)\\n    .sort()\\n    .map((sitc1, i) => [sitc1, `rgb(${colorBrewerCategoricalPastel12[i % 12].join(',')})`]),\\n);\\n\\nconst countryToColor = new Map(\\n  data\\n    .map((d) => d.dest)\\n    .filter(keepDistinct)\\n    .sort()\\n    .map((dest, i, a) => {\\n      const luma = Math.floor(96 + 128 * ((a.length - i - 1) / a.length));\\n      return [dest, `rgb(${luma},${luma},${luma})`];\\n    }),\\n);\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\nconst theme: PartialTheme = {\\n  chartPaddings: { top: 6, left: 8, bottom: 6, right: 8 },\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const layout = select(\\n    'Inner breakdown layout',\\n    {\\n      horizontal: 'h',\\n      vertical: 'v',\\n      zigzag: 'z',\\n    },\\n    'z',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        {...onElementListeners}\\n        showLegend={boolean('Show legend', true)}\\n        showLegendExtra={boolean('Show legend extra', false)}\\n        legendStrategy={LegendStrategy.Key}\\n        flatLegend={boolean('Flat legend', true)}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('Debug', false)}\\n      />\\n      <GroupBy\\n        id=\\\"split\\\"\\n        by={(_, d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2)}\\n        format={(name) => regionLookup[name].regionName}\\n        sort={select('Panel order', { alphaAsc: 'alphaAsc', alphaDesc: 'alphaDesc' }, 'alphaAsc')}\\n      />\\n      <SmallMultiples\\n        splitHorizontally={layout === 'h' ? 'split' : undefined}\\n        splitVertically={layout === 'v' ? 'split' : undefined}\\n        splitZigzag={layout === 'z' ? 'split' : undefined}\\n        style={{\\n          horizontalPanelPadding: {\\n            outer: number('Horizontal outer pad', 0.15, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Horizontal inner pad', 0.05, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n          verticalPanelPadding: {\\n            outer: number('Vertical outer pad', 0.15, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Vertical inner pad', 0.05, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_2\\\"\\n        data={data}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            fillLabel: { maximizeFontSize: true },\\n            shape: {\\n              fillColor: (key) => productToColor.get(key)!,\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            fillLabel: { maximizeFontSize: true },\\n            shape: {\\n              fillColor: (key) => countryToColor.get(key)!,\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":83},\"endLoc\":{\"col\":1,\"line\":174},\"startBody\":{\"col\":36,\"line\":83},\"endBody\":{\"col\":1,\"line\":174}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, select, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  GroupBy,\n  LegendStrategy,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  SmallMultiples,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { colorBrewerCategoricalPastel12, countryLookup, productLookup, regionLookup } from '../utils/utils';\n\nconst data = mocks.sunburst; // .filter((d) => countryLookup[d.dest].continentCountry.slice(0, 2) === 'eu');\n\nconst productToColor = new Map(\n  data\n    .map((d) => d.sitc1)\n    .filter(keepDistinct)\n    .sort()\n    .map((sitc1, i) => [sitc1, `rgb(${colorBrewerCategoricalPastel12[i % 12].join(',')})`]),\n);\n\nconst countryToColor = new Map(\n  data\n    .map((d) => d.dest)\n    .filter(keepDistinct)\n    .sort()\n    .map((dest, i, a) => {\n      const luma = Math.floor(96 + 128 * ((a.length - i - 1) / a.length));\n      return [dest, `rgb(${luma},${luma},${luma})`];\n    }),\n);\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\nconst theme: PartialTheme = {\n  chartPaddings: { top: 6, left: 8, bottom: 6, right: 8 },\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const layout = select(\n    'Inner breakdown layout',\n    {\n      horizontal: 'h',\n      vertical: 'v',\n      zigzag: 'z',\n    },\n    'z',\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        {...onElementListeners}\n        showLegend={boolean('Show legend', true)}\n        showLegendExtra={boolean('Show legend extra', false)}\n        legendStrategy={LegendStrategy.Key}\n        flatLegend={boolean('Flat legend', true)}\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('Debug', false)}\n      />\n      <GroupBy\n        id=\"split\"\n        by={(_, d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2)}\n        format={(name) => regionLookup[name].regionName}\n        sort={select('Panel order', { alphaAsc: 'alphaAsc', alphaDesc: 'alphaDesc' }, 'alphaAsc')}\n      />\n      <SmallMultiples\n        splitHorizontally={layout === 'h' ? 'split' : undefined}\n        splitVertically={layout === 'v' ? 'split' : undefined}\n        splitZigzag={layout === 'z' ? 'split' : undefined}\n        style={{\n          horizontalPanelPadding: {\n            outer: number('Horizontal outer pad', 0.15, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n            inner: number('Horizontal inner pad', 0.05, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n          },\n          verticalPanelPadding: {\n            outer: number('Vertical outer pad', 0.15, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n            inner: number('Vertical inner pad', 0.05, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n          },\n        }}\n      />\n      <Partition\n        id=\"spec_2\"\n        data={data}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: any) => productLookup[d].name,\n            fillLabel: { maximizeFontSize: true },\n            shape: {\n              fillColor: (key) => productToColor.get(key)!,\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            fillLabel: { maximizeFontSize: true },\n            shape: {\n              fillColor: (key) => countryToColor.get(key)!,\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const layout = select(\\n    'Inner breakdown layout',\\n    {\\n      horizontal: 'h',\\n      vertical: 'v',\\n      zigzag: 'z',\\n    },\\n    'z',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        {...onElementListeners}\\n        showLegend={boolean('Show legend', true)}\\n        showLegendExtra={boolean('Show legend extra', false)}\\n        legendStrategy={LegendStrategy.Key}\\n        flatLegend={boolean('Flat legend', true)}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('Debug', false)}\\n      />\\n      <GroupBy\\n        id=\\\"split\\\"\\n        by={(_, d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2)}\\n        format={(name) => regionLookup[name].regionName}\\n        sort={select('Panel order', { alphaAsc: 'alphaAsc', alphaDesc: 'alphaDesc' }, 'alphaAsc')}\\n      />\\n      <SmallMultiples\\n        splitHorizontally={layout === 'h' ? 'split' : undefined}\\n        splitVertically={layout === 'v' ? 'split' : undefined}\\n        splitZigzag={layout === 'z' ? 'split' : undefined}\\n        style={{\\n          horizontalPanelPadding: {\\n            outer: number('Horizontal outer pad', 0.15, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Horizontal inner pad', 0.05, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n          verticalPanelPadding: {\\n            outer: number('Vertical outer pad', 0.15, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Vertical inner pad', 0.05, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_2\\\"\\n        data={data}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            fillLabel: { maximizeFontSize: true },\\n            shape: {\\n              fillColor: (key) => productToColor.get(key)!,\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            fillLabel: { maximizeFontSize: true },\\n            shape: {\\n              fillColor: (key) => countryToColor.get(key)!,\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  BarSeries,\\n  Predicate,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n/**\\n * This story is used on VRTs to test the sorting logic of the dataIndex sort predicate\\n */\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data: [string, number][] = [\\n    ['3', 100],\\n    ['5', 80],\\n    ['1', 50],\\n    ['2', 30],\\n    ['6', 12],\\n    ['4', 10],\\n    ['7', 5],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} rotation={90} />\\n      <Axis id=\\\"time\\\" title=\\\"Day of week\\\" position={Position.Left} />\\n      <Axis id=\\\"y\\\" title=\\\"Count of logins\\\" position={Position.Bottom} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec, datum) => {\\n          return datum[0];\\n        }}\\n        sort={select(\\n          'Chart sorting',\\n          {\\n            ...Predicate,\\n          },\\n          Predicate.DataIndex,\\n        )}\\n      />\\n      <SmallMultiples splitVertically=\\\"h_split\\\" />\\n\\n      <BarSeries\\n        id=\\\"Login count\\\"\\n        name={(si) => {\\n          return `#logins day ${si.smVerticalAccessorValue}`;\\n        }}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor={() => ''}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `You can sort your small multiples by the \\\\`GroupBy.by\\\\` value in ascending/descending order.\\n  If the sort is configured with the \\\\`dataIndex\\\\` predicate the small multiples\\n  will keep the order of the passed data array.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":76},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":76}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  BarSeries,\n  Predicate,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n/**\n * This story is used on VRTs to test the sorting logic of the dataIndex sort predicate\n */\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data: [string, number][] = [\n    ['3', 100],\n    ['5', 80],\n    ['1', 50],\n    ['2', 30],\n    ['6', 12],\n    ['4', 10],\n    ['7', 5],\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} rotation={90} />\n      <Axis id=\"time\" title=\"Day of week\" position={Position.Left} />\n      <Axis id=\"y\" title=\"Count of logins\" position={Position.Bottom} />\n\n      <GroupBy\n        id=\"h_split\"\n        by={(spec, datum) => {\n          return datum[0];\n        }}\n        sort={select(\n          'Chart sorting',\n          {\n            ...Predicate,\n          },\n          Predicate.DataIndex,\n        )}\n      />\n      <SmallMultiples splitVertically=\"h_split\" />\n\n      <BarSeries\n        id=\"Login count\"\n        name={(si) => {\n          return `#logins day ${si.smVerticalAccessorValue}`;\n        }}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor={() => ''}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\nExample.parameters = {\n  markdown: `You can sort your small multiples by the \\`GroupBy.by\\` value in ascending/descending order.\n  If the sort is configured with the \\`dataIndex\\` predicate the small multiples\n  will keep the order of the passed data array.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data: [string, number][] = [\\n    ['3', 100],\\n    ['5', 80],\\n    ['1', 50],\\n    ['2', 30],\\n    ['6', 12],\\n    ['4', 10],\\n    ['7', 5],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} rotation={90} />\\n      <Axis id=\\\"time\\\" title=\\\"Day of week\\\" position={Position.Left} />\\n      <Axis id=\\\"y\\\" title=\\\"Count of logins\\\" position={Position.Bottom} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec, datum) => {\\n          return datum[0];\\n        }}\\n        sort={select(\\n          'Chart sorting',\\n          {\\n            ...Predicate,\\n          },\\n          Predicate.DataIndex,\\n        )}\\n      />\\n      <SmallMultiples splitVertically=\\\"h_split\\\" />\\n\\n      <BarSeries\\n        id=\\\"Login count\\\"\\n        name={(si) => {\\n          return `#logins day ${si.smVerticalAccessorValue}`;\\n        }}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor={() => ''}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport { range } from 'lodash';\\nimport { DateTime } from 'luxon';\\nimport React, { useEffect, useMemo } from 'react';\\n\\nimport {\\n  ScaleType,\\n  Chart,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  niceTimeFormatByDay,\\n  timeFormatter,\\n  Heatmap,\\n  SmallMultiplesStyle,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator, getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\nimport { customKnobs } from '../utils/knobs';\\nimport { useHeatmapSelection } from '../utils/use_heatmap_selection';\\nimport { sampleSize } from '../utils/utils';\\n\\nconst rng = getRandomNumberGenerator();\\nconst dg = new SeededDataGenerator(500, 'test');\\nconst numOfDays = 90;\\n\\nconst tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('Debug', false);\\n  const debugState = boolean('Enable debug state', true);\\n  const timeBasedData = boolean('Time data', false);\\n  const showLegend = boolean('Show Legend', false);\\n  const vSplit = boolean('v - split', true, 'Data');\\n  const hSplit = boolean('h - split', true, 'Data');\\n  const vSplitCount = number('v - split count', 2, { min: 0 }, 'Data');\\n  const hSplitCount = number('h - split count', 2, { min: 0 }, 'Data');\\n  const vSplitCountAbs = vSplit ? vSplitCount : 1;\\n  const hSplitCountAbs = hSplit ? hSplitCount : 1;\\n  const categories = number('categories', 4, { min: 1, step: 1, range: true }, 'Data');\\n  const density = number('cell density(%)', 75, { min: 5, max: 100, step: 5, range: true }, 'Data') / 100;\\n  const xScaleType = customKnobs.enum.scaleType('xScaleType', ScaleType.Linear, {\\n    include: ['Linear', 'Ordinal'],\\n    group: 'Data',\\n  });\\n\\n  const smStyles: SmallMultiplesStyle = {\\n    horizontalPanelPadding: {\\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\\n      outer: number(\\n        'Horizontal outer pad',\\n        0,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n      inner: number(\\n        'Horizontal inner pad',\\n        0.05,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n    },\\n    verticalPanelPadding: {\\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\\n      outer: number(\\n        'Vertical outer pad',\\n        0,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n      inner: number(\\n        'Vertical inner pad',\\n        0.1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n    },\\n  };\\n  const showAxesTitles = boolean('Show axes title', true, 'SmallMultiples Styles');\\n  const showAxesPanelTitles = boolean('Show axes panel titles', true, 'SmallMultiples Styles');\\n\\n  const dataCount = timeBasedData ? numOfDays : 10;\\n  const fullData = useMemo(\\n    () =>\\n      dg.generateSMGroupedSeries(vSplitCountAbs, hSplitCountAbs, () => {\\n        return dg.generateSimpleSeries(dataCount).flatMap((d) =>\\n          range(0, categories, 1).map((y) => {\\n            return {\\n              y,\\n              x: d.x,\\n              value: rng(0, 1000),\\n              t: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\\n            };\\n          }),\\n        );\\n      }),\\n    [vSplitCountAbs, hSplitCountAbs, dataCount, categories],\\n  );\\n  const data = useMemo(\\n    () => sampleSize(fullData, vSplitCountAbs * hSplitCountAbs * dataCount * categories * density),\\n    [categories, dataCount, density, fullData, vSplitCountAbs, hSplitCountAbs],\\n  );\\n  const { highlightedData, onElementClick, onBrushEnd, clearSelection } = useHeatmapSelection();\\n\\n  useEffect(() => {\\n    clearSelection();\\n  }, [clearSelection, vSplit, hSplit, vSplitCount, hSplitCount, categories, density, xScaleType]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        debugState={debugState}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        onElementClick={onElementClick}\\n        showLegend={showLegend}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          axes: {\\n            axisTitle: {\\n              visible: showAxesTitles,\\n            },\\n            axisPanelTitle: {\\n              visible: showAxesPanelTitles,\\n            },\\n          },\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: number(\\n                  'Grid stroke',\\n                  1,\\n                  {\\n                    range: true,\\n                    min: 1,\\n                    max: 10,\\n                    step: 1,\\n                  },\\n                  'SmallMultiples Styles',\\n                ),\\n              },\\n            },\\n            cell: {\\n              border: {\\n                strokeWidth: 0,\\n              },\\n            },\\n          },\\n        }}\\n        onBrushEnd={onBrushEnd}\\n      />\\n\\n      <GroupBy id=\\\"v_split\\\" by={(_, { v }) => v} format={(v) => `Metric ${v}`} sort=\\\"numDesc\\\" />\\n      <GroupBy id=\\\"h_split\\\" by={(_, { h }) => h} format={(v) => `Host ${v}`} sort=\\\"numAsc\\\" />\\n      <SmallMultiples\\n        splitVertically={vSplit ? 'v_split' : undefined}\\n        splitHorizontally={hSplit ? 'h_split' : undefined}\\n        style={smStyles}\\n      />\\n\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 200, color: '#d2e9f7' },\\n            { start: 200, end: 300, color: '#8bc8fb' },\\n            { start: 300, end: 500, color: '#fdec25' },\\n            { start: 500, end: 600, color: '#fba740' },\\n            { start: 800, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={timeBasedData ? 't' : 'x'}\\n        yAccessor={(d) => Math.floor(d.y)}\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={\\n          timeBasedData\\n            ? {\\n                type: ScaleType.Time,\\n                interval: {\\n                  type: 'calendar',\\n                  value: 1,\\n                  unit: 'week',\\n                },\\n              }\\n            : {\\n                type: xScaleType,\\n              }\\n        }\\n        xAxisLabelFormatter={timeBasedData ? tickTimeFormatter : (v) => `C${v}`}\\n        yAxisLabelFormatter={(v) => `R${v}`}\\n        timeZone=\\\"UTC\\\"\\n        highlightedData={highlightedData}\\n        xAxisTitle=\\\"Bottom axis\\\"\\n        yAxisTitle=\\\"Left axis\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":40},\"endLoc\":{\"col\":1,\"line\":233},\"startBody\":{\"col\":36,\"line\":40},\"endBody\":{\"col\":1,\"line\":233}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport { range } from 'lodash';\nimport { DateTime } from 'luxon';\nimport React, { useEffect, useMemo } from 'react';\n\nimport {\n  ScaleType,\n  Chart,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  niceTimeFormatByDay,\n  timeFormatter,\n  Heatmap,\n  SmallMultiplesStyle,\n} from '@elastic/charts';\nimport { SeededDataGenerator, getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { customKnobs } from '../utils/knobs';\nimport { useHeatmapSelection } from '../utils/use_heatmap_selection';\nimport { sampleSize } from '../utils/utils';\n\nconst rng = getRandomNumberGenerator();\nconst dg = new SeededDataGenerator(500, 'test');\nconst numOfDays = 90;\n\nconst tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('Debug', false);\n  const debugState = boolean('Enable debug state', true);\n  const timeBasedData = boolean('Time data', false);\n  const showLegend = boolean('Show Legend', false);\n  const vSplit = boolean('v - split', true, 'Data');\n  const hSplit = boolean('h - split', true, 'Data');\n  const vSplitCount = number('v - split count', 2, { min: 0 }, 'Data');\n  const hSplitCount = number('h - split count', 2, { min: 0 }, 'Data');\n  const vSplitCountAbs = vSplit ? vSplitCount : 1;\n  const hSplitCountAbs = hSplit ? hSplitCount : 1;\n  const categories = number('categories', 4, { min: 1, step: 1, range: true }, 'Data');\n  const density = number('cell density(%)', 75, { min: 5, max: 100, step: 5, range: true }, 'Data') / 100;\n  const xScaleType = customKnobs.enum.scaleType('xScaleType', ScaleType.Linear, {\n    include: ['Linear', 'Ordinal'],\n    group: 'Data',\n  });\n\n  const smStyles: SmallMultiplesStyle = {\n    horizontalPanelPadding: {\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\n      outer: number(\n        'Horizontal outer pad',\n        0,\n        {\n          range: true,\n          min: 0,\n          max: 0.5,\n          step: 0.05,\n        },\n        'SmallMultiples Styles',\n      ),\n      inner: number(\n        'Horizontal inner pad',\n        0.05,\n        {\n          range: true,\n          min: 0,\n          max: 0.5,\n          step: 0.05,\n        },\n        'SmallMultiples Styles',\n      ),\n    },\n    verticalPanelPadding: {\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\n      outer: number(\n        'Vertical outer pad',\n        0,\n        {\n          range: true,\n          min: 0,\n          max: 0.5,\n          step: 0.05,\n        },\n        'SmallMultiples Styles',\n      ),\n      inner: number(\n        'Vertical inner pad',\n        0.1,\n        {\n          range: true,\n          min: 0,\n          max: 0.5,\n          step: 0.05,\n        },\n        'SmallMultiples Styles',\n      ),\n    },\n  };\n  const showAxesTitles = boolean('Show axes title', true, 'SmallMultiples Styles');\n  const showAxesPanelTitles = boolean('Show axes panel titles', true, 'SmallMultiples Styles');\n\n  const dataCount = timeBasedData ? numOfDays : 10;\n  const fullData = useMemo(\n    () =>\n      dg.generateSMGroupedSeries(vSplitCountAbs, hSplitCountAbs, () => {\n        return dg.generateSimpleSeries(dataCount).flatMap((d) =>\n          range(0, categories, 1).map((y) => {\n            return {\n              y,\n              x: d.x,\n              value: rng(0, 1000),\n              t: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\n            };\n          }),\n        );\n      }),\n    [vSplitCountAbs, hSplitCountAbs, dataCount, categories],\n  );\n  const data = useMemo(\n    () => sampleSize(fullData, vSplitCountAbs * hSplitCountAbs * dataCount * categories * density),\n    [categories, dataCount, density, fullData, vSplitCountAbs, hSplitCountAbs],\n  );\n  const { highlightedData, onElementClick, onBrushEnd, clearSelection } = useHeatmapSelection();\n\n  useEffect(() => {\n    clearSelection();\n  }, [clearSelection, vSplit, hSplit, vSplitCount, hSplitCount, categories, density, xScaleType]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        debugState={debugState}\n        onRenderChange={getDebugStateLogger(debugState)}\n        onElementClick={onElementClick}\n        showLegend={showLegend}\n        baseTheme={useBaseTheme()}\n        theme={{\n          axes: {\n            axisTitle: {\n              visible: showAxesTitles,\n            },\n            axisPanelTitle: {\n              visible: showAxesPanelTitles,\n            },\n          },\n          heatmap: {\n            grid: {\n              stroke: {\n                width: number(\n                  'Grid stroke',\n                  1,\n                  {\n                    range: true,\n                    min: 1,\n                    max: 10,\n                    step: 1,\n                  },\n                  'SmallMultiples Styles',\n                ),\n              },\n            },\n            cell: {\n              border: {\n                strokeWidth: 0,\n              },\n            },\n          },\n        }}\n        onBrushEnd={onBrushEnd}\n      />\n\n      <GroupBy id=\"v_split\" by={(_, { v }) => v} format={(v) => `Metric ${v}`} sort=\"numDesc\" />\n      <GroupBy id=\"h_split\" by={(_, { h }) => h} format={(v) => `Host ${v}`} sort=\"numAsc\" />\n      <SmallMultiples\n        splitVertically={vSplit ? 'v_split' : undefined}\n        splitHorizontally={hSplit ? 'h_split' : undefined}\n        style={smStyles}\n      />\n\n      <Heatmap\n        id=\"heatmap1\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 200, color: '#d2e9f7' },\n            { start: 200, end: 300, color: '#8bc8fb' },\n            { start: 300, end: 500, color: '#fdec25' },\n            { start: 500, end: 600, color: '#fba740' },\n            { start: 800, end: Infinity, color: '#fe5050' },\n          ],\n        }}\n        data={data}\n        xAccessor={timeBasedData ? 't' : 'x'}\n        yAccessor={(d) => Math.floor(d.y)}\n        valueAccessor=\"value\"\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\n        ySortPredicate=\"numAsc\"\n        xScale={\n          timeBasedData\n            ? {\n                type: ScaleType.Time,\n                interval: {\n                  type: 'calendar',\n                  value: 1,\n                  unit: 'week',\n                },\n              }\n            : {\n                type: xScaleType,\n              }\n        }\n        xAxisLabelFormatter={timeBasedData ? tickTimeFormatter : (v) => `C${v}`}\n        yAxisLabelFormatter={(v) => `R${v}`}\n        timeZone=\"UTC\"\n        highlightedData={highlightedData}\n        xAxisTitle=\"Bottom axis\"\n        yAxisTitle=\"Left axis\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('Debug', false);\\n  const debugState = boolean('Enable debug state', true);\\n  const timeBasedData = boolean('Time data', false);\\n  const showLegend = boolean('Show Legend', false);\\n  const vSplit = boolean('v - split', true, 'Data');\\n  const hSplit = boolean('h - split', true, 'Data');\\n  const vSplitCount = number('v - split count', 2, { min: 0 }, 'Data');\\n  const hSplitCount = number('h - split count', 2, { min: 0 }, 'Data');\\n  const vSplitCountAbs = vSplit ? vSplitCount : 1;\\n  const hSplitCountAbs = hSplit ? hSplitCount : 1;\\n  const categories = number('categories', 4, { min: 1, step: 1, range: true }, 'Data');\\n  const density = number('cell density(%)', 75, { min: 5, max: 100, step: 5, range: true }, 'Data') / 100;\\n  const xScaleType = customKnobs.enum.scaleType('xScaleType', ScaleType.Linear, {\\n    include: ['Linear', 'Ordinal'],\\n    group: 'Data',\\n  });\\n\\n  const smStyles: SmallMultiplesStyle = {\\n    horizontalPanelPadding: {\\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\\n      outer: number(\\n        'Horizontal outer pad',\\n        0,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n      inner: number(\\n        'Horizontal inner pad',\\n        0.05,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n    },\\n    verticalPanelPadding: {\\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\\n      outer: number(\\n        'Vertical outer pad',\\n        0,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n      inner: number(\\n        'Vertical inner pad',\\n        0.1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n    },\\n  };\\n  const showAxesTitles = boolean('Show axes title', true, 'SmallMultiples Styles');\\n  const showAxesPanelTitles = boolean('Show axes panel titles', true, 'SmallMultiples Styles');\\n\\n  const dataCount = timeBasedData ? numOfDays : 10;\\n  const fullData = useMemo(\\n    () =>\\n      dg.generateSMGroupedSeries(vSplitCountAbs, hSplitCountAbs, () => {\\n        return dg.generateSimpleSeries(dataCount).flatMap((d) =>\\n          range(0, categories, 1).map((y) => {\\n            return {\\n              y,\\n              x: d.x,\\n              value: rng(0, 1000),\\n              t: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\\n            };\\n          }),\\n        );\\n      }),\\n    [vSplitCountAbs, hSplitCountAbs, dataCount, categories],\\n  );\\n  const data = useMemo(\\n    () => sampleSize(fullData, vSplitCountAbs * hSplitCountAbs * dataCount * categories * density),\\n    [categories, dataCount, density, fullData, vSplitCountAbs, hSplitCountAbs],\\n  );\\n  const { highlightedData, onElementClick, onBrushEnd, clearSelection } = useHeatmapSelection();\\n\\n  useEffect(() => {\\n    clearSelection();\\n  }, [clearSelection, vSplit, hSplit, vSplitCount, hSplitCount, categories, density, xScaleType]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        debugState={debugState}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        onElementClick={onElementClick}\\n        showLegend={showLegend}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          axes: {\\n            axisTitle: {\\n              visible: showAxesTitles,\\n            },\\n            axisPanelTitle: {\\n              visible: showAxesPanelTitles,\\n            },\\n          },\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: number(\\n                  'Grid stroke',\\n                  1,\\n                  {\\n                    range: true,\\n                    min: 1,\\n                    max: 10,\\n                    step: 1,\\n                  },\\n                  'SmallMultiples Styles',\\n                ),\\n              },\\n            },\\n            cell: {\\n              border: {\\n                strokeWidth: 0,\\n              },\\n            },\\n          },\\n        }}\\n        onBrushEnd={onBrushEnd}\\n      />\\n\\n      <GroupBy id=\\\"v_split\\\" by={(_, { v }) => v} format={(v) => `Metric ${v}`} sort=\\\"numDesc\\\" />\\n      <GroupBy id=\\\"h_split\\\" by={(_, { h }) => h} format={(v) => `Host ${v}`} sort=\\\"numAsc\\\" />\\n      <SmallMultiples\\n        splitVertically={vSplit ? 'v_split' : undefined}\\n        splitHorizontally={hSplit ? 'h_split' : undefined}\\n        style={smStyles}\\n      />\\n\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 200, color: '#d2e9f7' },\\n            { start: 200, end: 300, color: '#8bc8fb' },\\n            { start: 300, end: 500, color: '#fdec25' },\\n            { start: 500, end: 600, color: '#fba740' },\\n            { start: 800, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={timeBasedData ? 't' : 'x'}\\n        yAccessor={(d) => Math.floor(d.y)}\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={\\n          timeBasedData\\n            ? {\\n                type: ScaleType.Time,\\n                interval: {\\n                  type: 'calendar',\\n                  value: 1,\\n                  unit: 'week',\\n                },\\n              }\\n            : {\\n                type: xScaleType,\\n              }\\n        }\\n        xAxisLabelFormatter={timeBasedData ? tickTimeFormatter : (v) => `C${v}`}\\n        yAxisLabelFormatter={(v) => `R${v}`}\\n        timeZone=\\\"UTC\\\"\\n        highlightedData={highlightedData}\\n        xAxisTitle=\\\"Bottom axis\\\"\\n        yAxisTitle=\\\"Left axis\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Small Multiples (@alpha)',\n};\n\nexport { Example as verticalAreas } from './2_vertical_areas.story';\nexport { Example as verticalBars } from './4_vertical_bars.story';\nexport { Example as horizontalBars } from './4_horizontal_bars.story';\n\nexport { Example as gridLines } from './3_grid_lines.story';\nexport { Example as histogramBars } from './5_histogram_bars.story';\nexport { Example as heterogeneous } from './6_heterogeneous_cartesians.story';\nexport { Example as sunbursts } from './7_sunbursts.story';\nexport { Example as heatmap } from './9_heatmap.story';\n\nexport { Example as sorting } from './8_sorting.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Chart, ScaleType, StackMode, Axis, Position, CurveType, Settings } from '@elastic/charts';\\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const stackMode = select<StackMode>(\\n    'stackMode',\\n    {\\n      Silhouette: StackMode.Silhouette,\\n      Wiggle: StackMode.Wiggle,\\n    },\\n    StackMode.Silhouette,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[3]}\\n        splitSeriesAccessors={[2]}\\n        data={BABYNAME_DATA}\\n        stackAccessors={[0]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        stackMode={stackMode}\\n        areaSeriesStyle={{\\n          area: {\\n            opacity: 0.7,\\n          },\\n          line: {\\n            visible: false,\\n          },\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Chart, ScaleType, StackMode, Axis, Position, CurveType, Settings } from '@elastic/charts';\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const stackMode = select<StackMode>(\n    'stackMode',\n    {\n      Silhouette: StackMode.Silhouette,\n      Wiggle: StackMode.Wiggle,\n    },\n    StackMode.Silhouette,\n  );\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"x\" position={Position.Bottom} />\n      <Axis id=\"y\" position={Position.Left} />\n      <AreaSeries\n        id=\"area1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[3]}\n        splitSeriesAccessors={[2]}\n        data={BABYNAME_DATA}\n        stackAccessors={[0]}\n        curve={CurveType.CURVE_MONOTONE_X}\n        stackMode={stackMode}\n        areaSeriesStyle={{\n          area: {\n            opacity: 0.7,\n          },\n          line: {\n            visible: false,\n          },\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const stackMode = select<StackMode>(\\n    'stackMode',\\n    {\\n      Silhouette: StackMode.Silhouette,\\n      Wiggle: StackMode.Wiggle,\\n    },\\n    StackMode.Silhouette,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[3]}\\n        splitSeriesAccessors={[2]}\\n        data={BABYNAME_DATA}\\n        stackAccessors={[0]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        stackMode={stackMode}\\n        areaSeriesStyle={{\\n          area: {\\n            opacity: 0.7,\\n          },\\n          line: {\\n            visible: false,\\n          },\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Streamgraph',\n};\n\nexport { Example as basic } from './1_basic.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const applyBarStyle = boolean('apply bar style (bar 1 series)', true, 'Chart Global Theme');\\n  const changeRectWidthPixel = boolean('enable custom rect width (px)', false, 'Bar width');\\n  const rectWidthPixel = range('rect width (px)', 0, 100, 30, 'Bar width', 1);\\n  const changeRectWidthRatio = boolean('enable custom rect width (ratio)', false, 'Bar width');\\n  const rectWidthRatio = range('rect width (ratio)', 0, 1, 0.5, 'Bar width', 0.01);\\n  const barSeriesStyle = {\\n    rectBorder: {\\n      stroke: color('border stroke', 'blue', 'Bar 1 Style'),\\n      strokeWidth: range('border strokeWidth', 0, 5, 2, 'Bar 1 Style', 0.1),\\n      visible: boolean('border visible', true, 'Bar 1 Style'),\\n    },\\n    rect: {\\n      fill: color('rect fill', '#22C61A', 'Bar 1 Style'),\\n      opacity: range('rect opacity', 0, 1, 0.3, 'Bar 1 Style', 0.1),\\n    },\\n  };\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('theme border stroke', 'red', 'Chart Global Theme'),\\n        strokeWidth: range('theme border strokeWidth', 0, 5, 2, 'Chart Global Theme', 0.1),\\n        visible: boolean('theme border visible', true, 'Chart Global Theme'),\\n      },\\n      rect: {\\n        opacity: range('theme opacity ', 0, 1, 0.9, 'Chart Global Theme', 0.1),\\n        widthPixel: changeRectWidthPixel ? rectWidthPixel : undefined,\\n        widthRatio: changeRectWidthRatio ? rectWidthRatio : undefined,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TestDatasets.BARCHART_1Y0G}\\n        barSeriesStyle={applyBarStyle ? barSeriesStyle : undefined}\\n        name=\\\"bars 1\\\"\\n      />\\n      <BarSeries\\n        id=\\\"bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TestDatasets.BARCHART_1Y0G}\\n        name=\\\"bars 2\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":92},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":92}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const applyBarStyle = boolean('apply bar style (bar 1 series)', true, 'Chart Global Theme');\n  const changeRectWidthPixel = boolean('enable custom rect width (px)', false, 'Bar width');\n  const rectWidthPixel = range('rect width (px)', 0, 100, 30, 'Bar width', 1);\n  const changeRectWidthRatio = boolean('enable custom rect width (ratio)', false, 'Bar width');\n  const rectWidthRatio = range('rect width (ratio)', 0, 1, 0.5, 'Bar width', 0.01);\n  const barSeriesStyle = {\n    rectBorder: {\n      stroke: color('border stroke', 'blue', 'Bar 1 Style'),\n      strokeWidth: range('border strokeWidth', 0, 5, 2, 'Bar 1 Style', 0.1),\n      visible: boolean('border visible', true, 'Bar 1 Style'),\n    },\n    rect: {\n      fill: color('rect fill', '#22C61A', 'Bar 1 Style'),\n      opacity: range('rect opacity', 0, 1, 0.3, 'Bar 1 Style', 0.1),\n    },\n  };\n\n  const theme: PartialTheme = {\n    barSeriesStyle: {\n      rectBorder: {\n        stroke: color('theme border stroke', 'red', 'Chart Global Theme'),\n        strokeWidth: range('theme border strokeWidth', 0, 5, 2, 'Chart Global Theme', 0.1),\n        visible: boolean('theme border visible', true, 'Chart Global Theme'),\n      },\n      rect: {\n        opacity: range('theme opacity ', 0, 1, 0.9, 'Chart Global Theme', 0.1),\n        widthPixel: changeRectWidthPixel ? rectWidthPixel : undefined,\n        widthRatio: changeRectWidthRatio ? rectWidthRatio : undefined,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bar 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={TestDatasets.BARCHART_1Y0G}\n        barSeriesStyle={applyBarStyle ? barSeriesStyle : undefined}\n        name=\"bars 1\"\n      />\n      <BarSeries\n        id=\"bar 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={TestDatasets.BARCHART_1Y0G}\n        name=\"bars 2\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const applyBarStyle = boolean('apply bar style (bar 1 series)', true, 'Chart Global Theme');\\n  const changeRectWidthPixel = boolean('enable custom rect width (px)', false, 'Bar width');\\n  const rectWidthPixel = range('rect width (px)', 0, 100, 30, 'Bar width', 1);\\n  const changeRectWidthRatio = boolean('enable custom rect width (ratio)', false, 'Bar width');\\n  const rectWidthRatio = range('rect width (ratio)', 0, 1, 0.5, 'Bar width', 0.01);\\n  const barSeriesStyle = {\\n    rectBorder: {\\n      stroke: color('border stroke', 'blue', 'Bar 1 Style'),\\n      strokeWidth: range('border strokeWidth', 0, 5, 2, 'Bar 1 Style', 0.1),\\n      visible: boolean('border visible', true, 'Bar 1 Style'),\\n    },\\n    rect: {\\n      fill: color('rect fill', '#22C61A', 'Bar 1 Style'),\\n      opacity: range('rect opacity', 0, 1, 0.3, 'Bar 1 Style', 0.1),\\n    },\\n  };\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('theme border stroke', 'red', 'Chart Global Theme'),\\n        strokeWidth: range('theme border strokeWidth', 0, 5, 2, 'Chart Global Theme', 0.1),\\n        visible: boolean('theme border visible', true, 'Chart Global Theme'),\\n      },\\n      rect: {\\n        opacity: range('theme opacity ', 0, 1, 0.9, 'Chart Global Theme', 0.1),\\n        widthPixel: changeRectWidthPixel ? rectWidthPixel : undefined,\\n        widthRatio: changeRectWidthRatio ? rectWidthRatio : undefined,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TestDatasets.BARCHART_1Y0G}\\n        barSeriesStyle={applyBarStyle ? barSeriesStyle : undefined}\\n        name=\\\"bars 1\\\"\\n      />\\n      <BarSeries\\n        id=\\\"bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TestDatasets.BARCHART_1Y0G}\\n        name=\\\"bars 2\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  LineSeriesStyle,\\n  RecursivePartial,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nfunction generateLineAndPointSeriesStyleKnobs(\\n  groupName: string,\\n  tag: string,\\n  pointFill?: string,\\n  pointStroke?: string,\\n  pointStrokeWidth?: number,\\n  pointRadius?: number,\\n  lineStrokeWidth?: number,\\n  lineStroke?: string,\\n): RecursivePartial<LineSeriesStyle> {\\n  return {\\n    line: {\\n      stroke: lineStroke ? color(`line.stroke (${tag})`, lineStroke, groupName) : undefined,\\n      strokeWidth: range(`line.strokeWidth (${tag})`, 0, 10, lineStrokeWidth || 1, groupName),\\n      visible: boolean(`line.visible (${tag})`, true, groupName),\\n      opacity: range(`line.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\\n    },\\n    point: {\\n      visible: boolean(`point.visible (${tag})`, true, groupName),\\n      radius: range(`point.radius (${tag})`, 0, 20, pointRadius || 5, groupName, 0.5),\\n      opacity: range(`point.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\\n      stroke: color(`point.stroke (${tag})`, pointStroke || 'black', groupName),\\n      fill: color(`point.fill (${tag})`, pointFill || 'lightgray', groupName),\\n      strokeWidth: range(`point.strokeWidth (${tag})`, 0, 5, pointStrokeWidth || 2, groupName, 0.01),\\n    },\\n  };\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\\n  const lineSeriesStyle1 = generateLineAndPointSeriesStyleKnobs('Line 1 style', 'line1', 'lime', 'green', 4, 10, 6);\\n  const lineSeriesStyle2 = generateLineAndPointSeriesStyleKnobs('Line 2 style', 'line2', 'blue', 'violet', 2, 5, 4);\\n\\n  const chartTheme = {\\n    lineSeriesStyle: generateLineAndPointSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\\n  };\\n\\n  const dataset1 = [\\n    { x: 0, y: 3 },\\n    { x: 1, y: 2 },\\n    { x: 2, y: 4 },\\n    { x: 3, y: 10 },\\n  ];\\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={chartTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <LineSeries\\n        id=\\\"lines1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset1}\\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle1 : undefined}\\n      />\\n      <LineSeries\\n        id=\\\"lines2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset2}\\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle2 : undefined}\\n      />\\n      <LineSeries\\n        id=\\\"lines3\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":68},\"endLoc\":{\"col\":1,\"line\":125},\"startBody\":{\"col\":36,\"line\":68},\"endBody\":{\"col\":1,\"line\":125}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  LineSeriesStyle,\n  RecursivePartial,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nfunction generateLineAndPointSeriesStyleKnobs(\n  groupName: string,\n  tag: string,\n  pointFill?: string,\n  pointStroke?: string,\n  pointStrokeWidth?: number,\n  pointRadius?: number,\n  lineStrokeWidth?: number,\n  lineStroke?: string,\n): RecursivePartial<LineSeriesStyle> {\n  return {\n    line: {\n      stroke: lineStroke ? color(`line.stroke (${tag})`, lineStroke, groupName) : undefined,\n      strokeWidth: range(`line.strokeWidth (${tag})`, 0, 10, lineStrokeWidth || 1, groupName),\n      visible: boolean(`line.visible (${tag})`, true, groupName),\n      opacity: range(`line.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\n    },\n    point: {\n      visible: boolean(`point.visible (${tag})`, true, groupName),\n      radius: range(`point.radius (${tag})`, 0, 20, pointRadius || 5, groupName, 0.5),\n      opacity: range(`point.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\n      stroke: color(`point.stroke (${tag})`, pointStroke || 'black', groupName),\n      fill: color(`point.fill (${tag})`, pointFill || 'lightgray', groupName),\n      strokeWidth: range(`point.strokeWidth (${tag})`, 0, 5, pointStrokeWidth || 2, groupName, 0.01),\n    },\n  };\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\n  const lineSeriesStyle1 = generateLineAndPointSeriesStyleKnobs('Line 1 style', 'line1', 'lime', 'green', 4, 10, 6);\n  const lineSeriesStyle2 = generateLineAndPointSeriesStyleKnobs('Line 2 style', 'line2', 'blue', 'violet', 2, 5, 4);\n\n  const chartTheme = {\n    lineSeriesStyle: generateLineAndPointSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\n  };\n\n  const dataset1 = [\n    { x: 0, y: 3 },\n    { x: 1, y: 2 },\n    { x: 2, y: 4 },\n    { x: 3, y: 10 },\n  ];\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={chartTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <LineSeries\n        id=\"lines1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={dataset1}\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle1 : undefined}\n      />\n      <LineSeries\n        id=\"lines2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={dataset2}\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle2 : undefined}\n      />\n      <LineSeries\n        id=\"lines3\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={dataset3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\\n  const lineSeriesStyle1 = generateLineAndPointSeriesStyleKnobs('Line 1 style', 'line1', 'lime', 'green', 4, 10, 6);\\n  const lineSeriesStyle2 = generateLineAndPointSeriesStyleKnobs('Line 2 style', 'line2', 'blue', 'violet', 2, 5, 4);\\n\\n  const chartTheme = {\\n    lineSeriesStyle: generateLineAndPointSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\\n  };\\n\\n  const dataset1 = [\\n    { x: 0, y: 3 },\\n    { x: 1, y: 2 },\\n    { x: 2, y: 4 },\\n    { x: 3, y: 10 },\\n  ];\\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={chartTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <LineSeries\\n        id=\\\"lines1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset1}\\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle1 : undefined}\\n      />\\n      <LineSeries\\n        id=\\\"lines2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset2}\\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle2 : undefined}\\n      />\\n      <LineSeries\\n        id=\\\"lines3\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  LineSeriesStyle,\\n  PartialTheme,\\n  RecursivePartial,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nfunction generateLineAndPointSeriesStyleKnobs(\\n  groupName: string,\\n  tag: string,\\n  pointFill?: string,\\n  pointStroke?: string,\\n  pointStrokeWidth?: number,\\n  pointRadius?: number,\\n  lineStrokeWidth?: number,\\n  lineStroke?: string,\\n): RecursivePartial<LineSeriesStyle> {\\n  return {\\n    line: {\\n      stroke: lineStroke ? color(`line.stroke (${tag})`, lineStroke, groupName) : undefined,\\n      strokeWidth: range(`line.strokeWidth (${tag})`, 0, 10, lineStrokeWidth || 1, groupName),\\n      visible: boolean(`line.visible (${tag})`, true, groupName),\\n      opacity: range(`line.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\\n    },\\n    point: {\\n      visible: boolean(`point.visible (${tag})`, true, groupName),\\n      radius: range(`point.radius (${tag})`, 0, 20, pointRadius || 5, groupName, 0.5),\\n      opacity: range(`point.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\\n      stroke: color(`point.stroke (${tag})`, pointStroke || 'black', groupName),\\n      fill: color(`point.fill (${tag})`, pointFill || 'lightgray', groupName),\\n      strokeWidth: range(`point.strokeWidth (${tag})`, 0, 50, pointStrokeWidth || 2, groupName, 0.01),\\n    },\\n  };\\n}\\n\\nfunction generateAreaSeriesStyleKnobs(\\n  groupName: string,\\n  tag: string,\\n  pointFill?: string,\\n  pointStroke?: string,\\n  pointStrokeWidth?: number,\\n  pointRadius?: number,\\n  lineStrokeWidth?: number,\\n  lineStroke?: string,\\n  areaFill?: string,\\n) {\\n  return {\\n    ...generateLineAndPointSeriesStyleKnobs(\\n      groupName,\\n      tag,\\n      pointFill,\\n      pointStroke,\\n      pointStrokeWidth,\\n      pointRadius,\\n      lineStrokeWidth,\\n      lineStroke,\\n    ),\\n    area: {\\n      fill: areaFill ? color(`area.fill (${tag})`, areaFill, groupName) : undefined,\\n      visible: boolean(`area.visible (${tag})`, true, groupName),\\n      opacity: range(`area.opacity (${tag})`, 0, 1, 0.8, groupName, 0.01),\\n    },\\n  };\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\\n\\n  const chartTheme: PartialTheme = {\\n    areaSeriesStyle: generateAreaSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\\n  };\\n\\n  const dataset1 = [\\n    { x: 0, y: 3 },\\n    { x: 1, y: 6 },\\n    { x: 2, y: 4 },\\n    { x: 3, y: 10 },\\n  ];\\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\\n\\n  const areaStyle1 = generateAreaSeriesStyleKnobs('Area 1 Style', 'area1', 'lime', 'green', 4, 10, 6, 'black');\\n  const areaStyle2 = generateAreaSeriesStyleKnobs('Area 2 Style', 'area2', 'blue', 'violet', 2, 5, 4, undefined, 'red');\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={chartTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset1}\\n        areaSeriesStyle={applyLineStyles ? areaStyle1 : undefined}\\n      />\\n      <AreaSeries\\n        id=\\\"area2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset2}\\n        areaSeriesStyle={applyLineStyles ? areaStyle2 : undefined}\\n      />\\n      <AreaSeries\\n        id=\\\"area3\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":99},\"endLoc\":{\"col\":1,\"line\":160},\"startBody\":{\"col\":36,\"line\":99},\"endBody\":{\"col\":1,\"line\":160}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  LineSeriesStyle,\n  PartialTheme,\n  RecursivePartial,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nfunction generateLineAndPointSeriesStyleKnobs(\n  groupName: string,\n  tag: string,\n  pointFill?: string,\n  pointStroke?: string,\n  pointStrokeWidth?: number,\n  pointRadius?: number,\n  lineStrokeWidth?: number,\n  lineStroke?: string,\n): RecursivePartial<LineSeriesStyle> {\n  return {\n    line: {\n      stroke: lineStroke ? color(`line.stroke (${tag})`, lineStroke, groupName) : undefined,\n      strokeWidth: range(`line.strokeWidth (${tag})`, 0, 10, lineStrokeWidth || 1, groupName),\n      visible: boolean(`line.visible (${tag})`, true, groupName),\n      opacity: range(`line.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\n    },\n    point: {\n      visible: boolean(`point.visible (${tag})`, true, groupName),\n      radius: range(`point.radius (${tag})`, 0, 20, pointRadius || 5, groupName, 0.5),\n      opacity: range(`point.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\n      stroke: color(`point.stroke (${tag})`, pointStroke || 'black', groupName),\n      fill: color(`point.fill (${tag})`, pointFill || 'lightgray', groupName),\n      strokeWidth: range(`point.strokeWidth (${tag})`, 0, 50, pointStrokeWidth || 2, groupName, 0.01),\n    },\n  };\n}\n\nfunction generateAreaSeriesStyleKnobs(\n  groupName: string,\n  tag: string,\n  pointFill?: string,\n  pointStroke?: string,\n  pointStrokeWidth?: number,\n  pointRadius?: number,\n  lineStrokeWidth?: number,\n  lineStroke?: string,\n  areaFill?: string,\n) {\n  return {\n    ...generateLineAndPointSeriesStyleKnobs(\n      groupName,\n      tag,\n      pointFill,\n      pointStroke,\n      pointStrokeWidth,\n      pointRadius,\n      lineStrokeWidth,\n      lineStroke,\n    ),\n    area: {\n      fill: areaFill ? color(`area.fill (${tag})`, areaFill, groupName) : undefined,\n      visible: boolean(`area.visible (${tag})`, true, groupName),\n      opacity: range(`area.opacity (${tag})`, 0, 1, 0.8, groupName, 0.01),\n    },\n  };\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\n\n  const chartTheme: PartialTheme = {\n    areaSeriesStyle: generateAreaSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\n  };\n\n  const dataset1 = [\n    { x: 0, y: 3 },\n    { x: 1, y: 6 },\n    { x: 2, y: 4 },\n    { x: 3, y: 10 },\n  ];\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\n\n  const areaStyle1 = generateAreaSeriesStyleKnobs('Area 1 Style', 'area1', 'lime', 'green', 4, 10, 6, 'black');\n  const areaStyle2 = generateAreaSeriesStyleKnobs('Area 2 Style', 'area2', 'blue', 'violet', 2, 5, 4, undefined, 'red');\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={chartTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <AreaSeries\n        id=\"area1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={dataset1}\n        areaSeriesStyle={applyLineStyles ? areaStyle1 : undefined}\n      />\n      <AreaSeries\n        id=\"area2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={dataset2}\n        areaSeriesStyle={applyLineStyles ? areaStyle2 : undefined}\n      />\n      <AreaSeries\n        id=\"area3\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={dataset3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\\n\\n  const chartTheme: PartialTheme = {\\n    areaSeriesStyle: generateAreaSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\\n  };\\n\\n  const dataset1 = [\\n    { x: 0, y: 3 },\\n    { x: 1, y: 6 },\\n    { x: 2, y: 4 },\\n    { x: 3, y: 10 },\\n  ];\\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\\n\\n  const areaStyle1 = generateAreaSeriesStyleKnobs('Area 1 Style', 'area1', 'lime', 'green', 4, 10, 6, 'black');\\n  const areaStyle2 = generateAreaSeriesStyleKnobs('Area 2 Style', 'area2', 'blue', 'violet', 2, 5, 4, undefined, 'red');\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={chartTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset1}\\n        areaSeriesStyle={applyLineStyles ? areaStyle1 : undefined}\\n      />\\n      <AreaSeries\\n        id=\\\"area2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset2}\\n        areaSeriesStyle={applyLineStyles ? areaStyle2 : undefined}\\n      />\\n      <AreaSeries\\n        id=\\\"area3\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameFn } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }) => {\\n    if (yAccessor === 'y1' && splitAccessors.get('g') === 'a') {\\n      return 'Custom full series name';\\n    }\\n\\n    return null;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n        name={customSeriesNamingFn}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameFn } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }) => {\n    if (yAccessor === 'y1' && splitAccessors.get('g') === 'a') {\n      return 'Custom full series name';\n    }\n\n    return null;\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n        name={customSeriesNamingFn}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }) => {\\n    if (yAccessor === 'y1' && splitAccessors.get('g') === 'a') {\\n      return 'Custom full series name';\\n    }\\n\\n    return null;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n        name={customSeriesNamingFn}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameConfigOptions } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customSeriesNameOptions: SeriesNameConfigOptions = {\\n    names: [\\n      {\\n        // replace split accessor;\\n        accessor: 'g',\\n        value: 'a',\\n        name: 'replace a(from g)',\\n      },\\n      {\\n        // replace y accessor;\\n        accessor: 'y2',\\n        name: 'replace y2',\\n      },\\n    ],\\n    delimiter: ' | ',\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n        name={customSeriesNameOptions}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameConfigOptions } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customSeriesNameOptions: SeriesNameConfigOptions = {\n    names: [\n      {\n        // replace split accessor;\n        accessor: 'g',\n        value: 'a',\n        name: 'replace a(from g)',\n      },\n      {\n        // replace y accessor;\n        accessor: 'y2',\n        name: 'replace y2',\n      },\n    ],\n    delimiter: ' | ',\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n        name={customSeriesNameOptions}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customSeriesNameOptions: SeriesNameConfigOptions = {\\n    names: [\\n      {\\n        // replace split accessor;\\n        accessor: 'g',\\n        value: 'a',\\n        name: 'replace a(from g)',\\n      },\\n      {\\n        // replace y accessor;\\n        accessor: 'y2',\\n        name: 'replace y2',\\n      },\\n    ],\\n    delimiter: ' | ',\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n        name={customSeriesNameOptions}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameFn } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    { x: 1, y: 3, percent: 0.5, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 6, percent: 0.5, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 20, percent: 0.5, time: start.plus({ month: 3 }).toMillis() },\\n    { x: 1, y: 9, percent: 0.7, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 13, percent: 0.7, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 14, percent: 0.7, time: start.plus({ month: 3 }).toMillis() },\\n    { x: 1, y: 15, percent: 0.1, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 18, percent: 1, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 7, percent: 1, time: start.plus({ month: 3 }).toMillis() },\\n  ];\\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }, isTooltip) =>\\n    [\\n      ...[...splitAccessors.entries()].map(([key, value]) => {\\n        if (key === 'time') {\\n          // Format time group\\n          if (isTooltip) {\\n            // Format tooltip time to be longer\\n            return moment(value).format('ll');\\n          }\\n\\n          // Format legend to be shorter\\n          return moment(value).format('M/YYYY');\\n        }\\n\\n        if (key === 'percent') {\\n          // Format percent group\\n          return `${(value as number) * 100}%`;\\n        }\\n\\n        return value;\\n      }),\\n      // don't format yAccessor\\n      yAccessor,\\n    ].join(' - ');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['time', 'percent']}\\n        data={data}\\n        name={customSeriesNamingFn}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport moment from 'moment';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameFn } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data = [\n    { x: 1, y: 3, percent: 0.5, time: start.plus({ month: 1 }).toMillis() },\n    { x: 2, y: 6, percent: 0.5, time: start.plus({ month: 2 }).toMillis() },\n    { x: 3, y: 20, percent: 0.5, time: start.plus({ month: 3 }).toMillis() },\n    { x: 1, y: 9, percent: 0.7, time: start.plus({ month: 1 }).toMillis() },\n    { x: 2, y: 13, percent: 0.7, time: start.plus({ month: 2 }).toMillis() },\n    { x: 3, y: 14, percent: 0.7, time: start.plus({ month: 3 }).toMillis() },\n    { x: 1, y: 15, percent: 0.1, time: start.plus({ month: 1 }).toMillis() },\n    { x: 2, y: 18, percent: 1, time: start.plus({ month: 2 }).toMillis() },\n    { x: 3, y: 7, percent: 1, time: start.plus({ month: 3 }).toMillis() },\n  ];\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }, isTooltip) =>\n    [\n      ...[...splitAccessors.entries()].map(([key, value]) => {\n        if (key === 'time') {\n          // Format time group\n          if (isTooltip) {\n            // Format tooltip time to be longer\n            return moment(value).format('ll');\n          }\n\n          // Format legend to be shorter\n          return moment(value).format('M/YYYY');\n        }\n\n        if (key === 'percent') {\n          // Format percent group\n          return `${(value as number) * 100}%`;\n        }\n\n        return value;\n      }),\n      // don't format yAccessor\n      yAccessor,\n    ].join(' - ');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['time', 'percent']}\n        data={data}\n        name={customSeriesNamingFn}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    { x: 1, y: 3, percent: 0.5, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 6, percent: 0.5, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 20, percent: 0.5, time: start.plus({ month: 3 }).toMillis() },\\n    { x: 1, y: 9, percent: 0.7, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 13, percent: 0.7, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 14, percent: 0.7, time: start.plus({ month: 3 }).toMillis() },\\n    { x: 1, y: 15, percent: 0.1, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 18, percent: 1, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 7, percent: 1, time: start.plus({ month: 3 }).toMillis() },\\n  ];\\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }, isTooltip) =>\\n    [\\n      ...[...splitAccessors.entries()].map(([key, value]) => {\\n        if (key === 'time') {\\n          // Format time group\\n          if (isTooltip) {\\n            // Format tooltip time to be longer\\n            return moment(value).format('ll');\\n          }\\n\\n          // Format legend to be shorter\\n          return moment(value).format('M/YYYY');\\n        }\\n\\n        if (key === 'percent') {\\n          // Format percent group\\n          return `${(value as number) * 100}%`;\\n        }\\n\\n        return value;\\n      }),\\n      // don't format yAccessor\\n      yAccessor,\\n    ].join(' - ');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['time', 'percent']}\\n        data={data}\\n        name={customSeriesNamingFn}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  RecursivePartial,\\n  AxisStyle,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    axes: {\\n      tickLabel: {\\n        fill: color('tickFill', '#333', 'Tick Label'),\\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: number('Tick Label Padding Theme', 1, {}, 'Tick Label'),\\n      },\\n    },\\n  };\\n\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding Axis Spec', 0),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks style={customStyle} />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":41},\"endLoc\":{\"col\":1,\"line\":80},\"startBody\":{\"col\":36,\"line\":41},\"endBody\":{\"col\":1,\"line\":80}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n  RecursivePartial,\n  AxisStyle,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    axes: {\n      tickLabel: {\n        fill: color('tickFill', '#333', 'Tick Label'),\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        fontStyle: 'normal',\n        padding: number('Tick Label Padding Theme', 1, {}, 'Tick Label'),\n      },\n    },\n  };\n\n  const customStyle: RecursivePartial<AxisStyle> = {\n    tickLabel: {\n      padding: number('Tick Label Padding Axis Spec', 0),\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks style={customStyle} />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    axes: {\\n      tickLabel: {\\n        fill: color('tickFill', '#333', 'Tick Label'),\\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: number('Tick Label Padding Theme', 1, {}, 'Tick Label'),\\n      },\\n    },\\n  };\\n\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding Axis Spec', 0),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks style={customStyle} />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  RecursivePartial,\\n  BarSeriesStyle,\\n  PointStyle,\\n  BarStyleAccessor,\\n  PointStyleAccessor,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hasThreshold = boolean('threshold', true);\\n  const threshold = number('min threshold', 3);\\n  const barStyle: RecursivePartial<BarSeriesStyle> = {\\n    rect: {\\n      opacity: 0.5,\\n      fill: 'red',\\n    },\\n  };\\n  const pointStyle: RecursivePartial<PointStyle> = {\\n    fill: 'red',\\n    radius: 10,\\n  };\\n  const barStyleAccessor: BarStyleAccessor = (d, g) => (g.specId === 'bar' && d.y1! > threshold ? barStyle : null);\\n  const pointStyleAccessor: PointStyleAccessor = (d, g) =>\\n    (g.specId === 'line' || g.specId === 'area') && d.y1! > threshold ? pointStyle : null;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        styleAccessor={hasThreshold ? barStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 1 },\\n          { x: 1, y: 6 },\\n          { x: 2, y: 2 },\\n          { x: 3, y: 5 },\\n        ]}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 0.5 },\\n          { x: 1, y: 4 },\\n          { x: 2, y: 1 },\\n          { x: 3, y: 4 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":109},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":109}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  RecursivePartial,\n  BarSeriesStyle,\n  PointStyle,\n  BarStyleAccessor,\n  PointStyleAccessor,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hasThreshold = boolean('threshold', true);\n  const threshold = number('min threshold', 3);\n  const barStyle: RecursivePartial<BarSeriesStyle> = {\n    rect: {\n      opacity: 0.5,\n      fill: 'red',\n    },\n  };\n  const pointStyle: RecursivePartial<PointStyle> = {\n    fill: 'red',\n    radius: 10,\n  };\n  const barStyleAccessor: BarStyleAccessor = (d, g) => (g.specId === 'bar' && d.y1! > threshold ? barStyle : null);\n  const pointStyleAccessor: PointStyleAccessor = (d, g) =>\n    (g.specId === 'line' || g.specId === 'area') && d.y1! > threshold ? pointStyle : null;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bar\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        styleAccessor={hasThreshold ? barStyleAccessor : undefined}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n\n      <LineSeries\n        id=\"line\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\n        data={[\n          { x: 0, y: 1 },\n          { x: 1, y: 6 },\n          { x: 2, y: 2 },\n          { x: 3, y: 5 },\n        ]}\n      />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\n        data={[\n          { x: 0, y: 0.5 },\n          { x: 1, y: 4 },\n          { x: 2, y: 1 },\n          { x: 3, y: 4 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hasThreshold = boolean('threshold', true);\\n  const threshold = number('min threshold', 3);\\n  const barStyle: RecursivePartial<BarSeriesStyle> = {\\n    rect: {\\n      opacity: 0.5,\\n      fill: 'red',\\n    },\\n  };\\n  const pointStyle: RecursivePartial<PointStyle> = {\\n    fill: 'red',\\n    radius: 10,\\n  };\\n  const barStyleAccessor: BarStyleAccessor = (d, g) => (g.specId === 'bar' && d.y1! > threshold ? barStyle : null);\\n  const pointStyleAccessor: PointStyleAccessor = (d, g) =>\\n    (g.specId === 'line' || g.specId === 'area') && d.y1! > threshold ? pointStyle : null;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        styleAccessor={hasThreshold ? barStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 1 },\\n          { x: 1, y: 6 },\\n          { x: 2, y: 2 },\\n          { x: 3, y: 5 },\\n        ]}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 0.5 },\\n          { x: 1, y: 4 },\\n          { x: 2, y: 1 },\\n          { x: 3, y: 4 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fillOption = select(\\n    'fillColor',\\n    {\\n      None: ColorVariant.None,\\n      Series: ColorVariant.Series,\\n      Custom: 'custom',\\n    },\\n    ColorVariant.None,\\n  );\\n  const fillColor = color('custom fill color', 'aquamarine');\\n  const fill = fillOption === 'custom' ? fillColor : fillOption;\\n  const strokeOption = select(\\n    'strokeColor',\\n    {\\n      None: ColorVariant.None,\\n      Series: ColorVariant.Series,\\n      Custom: 'custom',\\n    },\\n    ColorVariant.Series,\\n  );\\n  const strokeColor = color('custom stroke color', 'aquamarine');\\n  const stroke = strokeOption === 'custom' ? strokeColor : strokeOption;\\n  const customTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill,\\n      },\\n      rectBorder: {\\n        visible: true,\\n        strokeWidth: 10,\\n        stroke,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":78},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":78}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fillOption = select(\n    'fillColor',\n    {\n      None: ColorVariant.None,\n      Series: ColorVariant.Series,\n      Custom: 'custom',\n    },\n    ColorVariant.None,\n  );\n  const fillColor = color('custom fill color', 'aquamarine');\n  const fill = fillOption === 'custom' ? fillColor : fillOption;\n  const strokeOption = select(\n    'strokeColor',\n    {\n      None: ColorVariant.None,\n      Series: ColorVariant.Series,\n      Custom: 'custom',\n    },\n    ColorVariant.Series,\n  );\n  const strokeColor = color('custom stroke color', 'aquamarine');\n  const stroke = strokeOption === 'custom' ? strokeColor : strokeOption;\n  const customTheme: PartialTheme = {\n    barSeriesStyle: {\n      rect: {\n        fill,\n      },\n      rectBorder: {\n        visible: true,\n        strokeWidth: 10,\n        stroke,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={customTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bar\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fillOption = select(\\n    'fillColor',\\n    {\\n      None: ColorVariant.None,\\n      Series: ColorVariant.Series,\\n      Custom: 'custom',\\n    },\\n    ColorVariant.None,\\n  );\\n  const fillColor = color('custom fill color', 'aquamarine');\\n  const fill = fillOption === 'custom' ? fillColor : fillOption;\\n  const strokeOption = select(\\n    'strokeColor',\\n    {\\n      None: ColorVariant.None,\\n      Series: ColorVariant.Series,\\n      Custom: 'custom',\\n    },\\n    ColorVariant.Series,\\n  );\\n  const strokeColor = color('custom stroke color', 'aquamarine');\\n  const stroke = strokeOption === 'custom' ? strokeColor : strokeOption;\\n  const customTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill,\\n      },\\n      rectBorder: {\\n        visible: true,\\n        strokeWidth: 10,\\n        stroke,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, LineSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    lineSeriesStyle: {\\n      point: {\\n        radius: 10,\\n        fill: ColorVariant.Series,\\n        stroke: ColorVariant.None,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, LineSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customTheme: PartialTheme = {\n    lineSeriesStyle: {\n      point: {\n        radius: 10,\n        fill: ColorVariant.Series,\n        stroke: ColorVariant.None,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={customTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <LineSeries\n        id=\"line\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    lineSeriesStyle: {\\n      point: {\\n        radius: 10,\\n        fill: ColorVariant.Series,\\n        stroke: ColorVariant.None,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, AreaSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    areaSeriesStyle: {\\n      point: {\\n        visible: true,\\n        radius: 10,\\n        fill: ColorVariant.Series,\\n        stroke: ColorVariant.None,\\n        opacity: 0.5,\\n      },\\n      area: {\\n        opacity: 0.2,\\n      },\\n      line: {\\n        visible: false,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":60},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":60}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, AreaSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customTheme: PartialTheme = {\n    areaSeriesStyle: {\n      point: {\n        visible: true,\n        radius: 10,\n        fill: ColorVariant.Series,\n        stroke: ColorVariant.None,\n        opacity: 0.5,\n      },\n      area: {\n        opacity: 0.2,\n      },\n      line: {\n        visible: false,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={customTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    areaSeriesStyle: {\\n      point: {\\n        visible: true,\\n        radius: 10,\\n        fill: ColorVariant.Series,\\n        stroke: ColorVariant.None,\\n        opacity: 0.5,\\n      },\\n      area: {\\n        opacity: 0.2,\\n      },\\n      line: {\\n        visible: false,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { BarSeries, Chart, ScaleType, Settings, PartialTheme, Tooltip } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data2 = dg.generateSimpleSeries(40);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      bottom: 0,\\n      left: 0,\\n      top: 0,\\n      right: 0,\\n    },\\n  };\\n  return (\\n    <div>\\n      <Chart title={title} description={description} size={{ width: 100, height: 50 }}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={{ height: 50 }}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['50%', 50]}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={[undefined, 50]}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={50}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n    </div>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { BarSeries, Chart, ScaleType, Settings, PartialTheme, Tooltip } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data2 = dg.generateSimpleSeries(40);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    chartMargins: {\n      bottom: 0,\n      left: 0,\n      top: 0,\n      right: 0,\n    },\n  };\n  return (\n    <div>\n      <Chart title={title} description={description} size={{ width: 100, height: 50 }}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n      <Chart title={title} description={description} size={{ height: 50 }}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n      <Chart title={title} description={description} size={['50%', 50]}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n      <Chart title={title} description={description} size={[undefined, 50]}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n      <Chart title={title} description={description} size={50}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n    </div>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      bottom: 0,\\n      left: 0,\\n      top: 0,\\n      right: 0,\\n    },\\n  };\\n  return (\\n    <div>\\n      <Chart title={title} description={description} size={{ width: 100, height: 50 }}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={{ height: 50 }}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['50%', 50]}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={[undefined, 50]}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={50}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  PartialTheme,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const bGColorDisabled = boolean('disable background color', false);\\n  const bgColor = color('Background color', 'rgba(255, 255, 255, 1)');\\n\\n  const theme: PartialTheme = {\\n    background: {\\n      color: bGColorDisabled ? bgColor : undefined,\\n    },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 0,\\n        fontSize: 14,\\n      },\\n      fontFamily: 'Arial',\\n      fillLabel: {\\n        fontStyle: 'italic',\\n        fontWeight: 900,\\n        valueFont: {\\n          fontFamily: 'Menlo',\\n          fontStyle: 'normal',\\n          fontWeight: 100,\\n        },\\n      },\\n      minFontSize: 1,\\n      idealFontSizeJump: 1.1,\\n      outerSizeRatio: 1,\\n      emptySizeRatio: 0,\\n      circlePadding: 4,\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.miniSunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":100},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":100}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  PartialTheme,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const bGColorDisabled = boolean('disable background color', false);\n  const bgColor = color('Background color', 'rgba(255, 255, 255, 1)');\n\n  const theme: PartialTheme = {\n    background: {\n      color: bGColorDisabled ? bgColor : undefined,\n    },\n    partition: {\n      linkLabel: {\n        maxCount: 0,\n        fontSize: 14,\n      },\n      fontFamily: 'Arial',\n      fillLabel: {\n        fontStyle: 'italic',\n        fontWeight: 900,\n        valueFont: {\n          fontFamily: 'Menlo',\n          fontStyle: 'normal',\n          fontWeight: 100,\n        },\n      },\n      minFontSize: 1,\n      idealFontSizeJump: 1.1,\n      outerSizeRatio: 1,\n      emptySizeRatio: 0,\n      circlePadding: 4,\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.miniSunburst}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: any) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (d: any) => regionLookup[d].regionName,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const bGColorDisabled = boolean('disable background color', false);\\n  const bgColor = color('Background color', 'rgba(255, 255, 255, 1)');\\n\\n  const theme: PartialTheme = {\\n    background: {\\n      color: bGColorDisabled ? bgColor : undefined,\\n    },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 0,\\n        fontSize: 14,\\n      },\\n      fontFamily: 'Arial',\\n      fillLabel: {\\n        fontStyle: 'italic',\\n        fontWeight: 900,\\n        valueFont: {\\n          fontFamily: 'Menlo',\\n          fontStyle: 'normal',\\n          fontWeight: 100,\\n        },\\n      },\\n      minFontSize: 1,\\n      idealFontSizeJump: 1.1,\\n      outerSizeRatio: 1,\\n      emptySizeRatio: 0,\\n      circlePadding: 4,\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.miniSunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const partialCustomTheme = {\\n    background: {\\n      color: color('Change background container color', '#1c1c24'),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={partialCustomTheme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const partialCustomTheme = {\n    background: {\n      color: color('Change background container color', '#1c1c24'),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={partialCustomTheme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const partialCustomTheme = {\\n    background: {\\n      color: color('Change background container color', '#1c1c24'),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={partialCustomTheme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Tooltip,\\n  TooltipType,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\nconst data2 = dg.generateSimpleSeries(40);\\nconst data3 = dg.generateSimpleSeries(40);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hideBars = boolean('Hide Bars', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={boolean('Debug', false)} showLegend showLegendExtra />\\n      <Tooltip type={TooltipType.Crosshairs} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      {!hideBars && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          splitSeriesAccessors={['g']}\\n          stackAccessors={['x']}\\n          data={data1}\\n        />\\n      )}\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  theme: { default: 'dark' },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":78},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":78}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  CurveType,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  Tooltip,\n  TooltipType,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\nconst data2 = dg.generateSimpleSeries(40);\nconst data3 = dg.generateSimpleSeries(40);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hideBars = boolean('Hide Bars', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} debug={boolean('Debug', false)} showLegend showLegendExtra />\n      <Tooltip type={TooltipType.Crosshairs} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      {!hideBars && (\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          splitSeriesAccessors={['g']}\n          stackAccessors={['x']}\n          data={data1}\n        />\n      )}\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={data2}\n      />\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  theme: { default: 'dark' },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hideBars = boolean('Hide Bars', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={boolean('Debug', false)} showLegend showLegendExtra />\\n      <Tooltip type={TooltipType.Crosshairs} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      {!hideBars && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          splitSeriesAccessors={['g']}\\n          stackAccessors={['x']}\\n          data={data1}\\n        />\\n      )}\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { array, boolean, color, number, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  Position,\\n  ScaleType,\\n  TexturedStyles,\\n  Settings,\\n  TextureShape,\\n  LIGHT_THEME,\\n  SeriesType,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dg = new SeededDataGenerator();\\nconst barData = dg.generateBasicSeries(4);\\nconst areaData = dg.generateBasicSeries(20, 10);\\n\\nconst group = {\\n  texture: 'Texture',\\n  pattern: 'Pattern',\\n  series: 'Series',\\n};\\nconst STAR =\\n  'M -7.75 -2.5 l 5.9 0 l 1.85 -6.1 l 1.85 6.1 l 5.9 0 l -4.8 3.8 l 1.85 6.1 l -4.8 -3.8 l -4.8 3.8 l 1.85 -6.1 l -4.8 -3.8 z';\\nconst DEFAULT_COLOR = LIGHT_THEME.colors.vizColors[0];\\n\\nconst getTextureKnobs = (useCustomPath: boolean): TexturedStyles => ({\\n  ...(useCustomPath\\n    ? { path: text('Custom path', STAR, group.texture) }\\n    : {\\n        shape: customKnobs.fromEnum('Shape', TextureShape, TextureShape.Line, {\\n          group: group.texture,\\n        }),\\n      }),\\n  stroke: boolean('Use stroke color', true, group.texture)\\n    ? color('Stoke color', DEFAULT_COLOR, group.texture)\\n    : undefined,\\n  strokeWidth: number('Stroke width', 1, { min: 0, max: 10, step: 0.5 }, group.texture),\\n  dash: array('Stroke dash', [], ',', group.texture).map((n) => parseInt(n, 10)),\\n  fill: boolean('Use fill color', true, group.texture) ? color('Fill color', DEFAULT_COLOR, group.texture) : undefined,\\n  rotation: number('Rotation (degrees)', 45, { min: -365, max: 365 }, group.pattern),\\n  opacity: number('Opacity', 1, { min: 0, max: 1, step: 0.1 }, group.texture),\\n  shapeRotation: number('Shape rotation (degrees)', 0, { min: -365, max: 365 }, group.texture),\\n  size: useCustomPath\\n    ? number('Shape size - custom path', 20, { min: 0 }, group.texture)\\n    : number('Shape size', 20, { min: 0 }, group.texture),\\n  spacing: {\\n    x: number('Shape spacing - x', 10, { min: 0 }, group.pattern),\\n    y: number('Shape spacing - y', 0, { min: 0 }, group.pattern),\\n  },\\n  offset: {\\n    x: number('Pattern offset - x', 0, {}, group.pattern),\\n    y: number('Pattern offset - y', 0, {}, group.pattern),\\n    global: boolean('Apply offset along global coordinate axes', true, group.pattern),\\n  },\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useCustomPath = boolean('Use custom path', false, group.texture);\\n  const texture: TexturedStyles = getTextureKnobs(useCustomPath);\\n  const opacity = number('Series opacity', 1, { min: 0, max: 1, step: 0.1 }, group.series);\\n  const showFill = boolean('Show series fill', false, group.series);\\n  const seriesColor = color('Series color', DEFAULT_COLOR, group.series);\\n  const [Series, seriesType] = customKnobs.enum.xySeries('Series type', 'area', {\\n    group: group.series,\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          areaSeriesStyle: {\\n            area: {\\n              texture,\\n              opacity,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n          },\\n          barSeriesStyle: {\\n            rect: {\\n              fill: showFill ? undefined : 'transparent',\\n              opacity,\\n              texture,\\n            },\\n            rectBorder: {\\n              visible: true,\\n              strokeWidth: 2,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <Series\\n        id=\\\"series\\\"\\n        color={seriesColor}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={seriesType === 'bar' ? barData : areaData}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":74},\"endLoc\":{\"col\":1,\"line\":126},\"startBody\":{\"col\":36,\"line\":74},\"endBody\":{\"col\":1,\"line\":126}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { array, boolean, color, number, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  Position,\n  ScaleType,\n  TexturedStyles,\n  Settings,\n  TextureShape,\n  LIGHT_THEME,\n  SeriesType,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dg = new SeededDataGenerator();\nconst barData = dg.generateBasicSeries(4);\nconst areaData = dg.generateBasicSeries(20, 10);\n\nconst group = {\n  texture: 'Texture',\n  pattern: 'Pattern',\n  series: 'Series',\n};\nconst STAR =\n  'M -7.75 -2.5 l 5.9 0 l 1.85 -6.1 l 1.85 6.1 l 5.9 0 l -4.8 3.8 l 1.85 6.1 l -4.8 -3.8 l -4.8 3.8 l 1.85 -6.1 l -4.8 -3.8 z';\nconst DEFAULT_COLOR = LIGHT_THEME.colors.vizColors[0];\n\nconst getTextureKnobs = (useCustomPath: boolean): TexturedStyles => ({\n  ...(useCustomPath\n    ? { path: text('Custom path', STAR, group.texture) }\n    : {\n        shape: customKnobs.fromEnum('Shape', TextureShape, TextureShape.Line, {\n          group: group.texture,\n        }),\n      }),\n  stroke: boolean('Use stroke color', true, group.texture)\n    ? color('Stoke color', DEFAULT_COLOR, group.texture)\n    : undefined,\n  strokeWidth: number('Stroke width', 1, { min: 0, max: 10, step: 0.5 }, group.texture),\n  dash: array('Stroke dash', [], ',', group.texture).map((n) => parseInt(n, 10)),\n  fill: boolean('Use fill color', true, group.texture) ? color('Fill color', DEFAULT_COLOR, group.texture) : undefined,\n  rotation: number('Rotation (degrees)', 45, { min: -365, max: 365 }, group.pattern),\n  opacity: number('Opacity', 1, { min: 0, max: 1, step: 0.1 }, group.texture),\n  shapeRotation: number('Shape rotation (degrees)', 0, { min: -365, max: 365 }, group.texture),\n  size: useCustomPath\n    ? number('Shape size - custom path', 20, { min: 0 }, group.texture)\n    : number('Shape size', 20, { min: 0 }, group.texture),\n  spacing: {\n    x: number('Shape spacing - x', 10, { min: 0 }, group.pattern),\n    y: number('Shape spacing - y', 0, { min: 0 }, group.pattern),\n  },\n  offset: {\n    x: number('Pattern offset - x', 0, {}, group.pattern),\n    y: number('Pattern offset - y', 0, {}, group.pattern),\n    global: boolean('Apply offset along global coordinate axes', true, group.pattern),\n  },\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useCustomPath = boolean('Use custom path', false, group.texture);\n  const texture: TexturedStyles = getTextureKnobs(useCustomPath);\n  const opacity = number('Series opacity', 1, { min: 0, max: 1, step: 0.1 }, group.series);\n  const showFill = boolean('Show series fill', false, group.series);\n  const seriesColor = color('Series color', DEFAULT_COLOR, group.series);\n  const [Series, seriesType] = customKnobs.enum.xySeries('Series type', 'area', {\n    group: group.series,\n    exclude: [SeriesType.Bubble, SeriesType.Line],\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          areaSeriesStyle: {\n            area: {\n              texture,\n              opacity,\n              fill: showFill ? undefined : 'transparent',\n            },\n          },\n          barSeriesStyle: {\n            rect: {\n              fill: showFill ? undefined : 'transparent',\n              opacity,\n              texture,\n            },\n            rectBorder: {\n              visible: true,\n              strokeWidth: 2,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <Series\n        id=\"series\"\n        color={seriesColor}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={seriesType === 'bar' ? barData : areaData}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useCustomPath = boolean('Use custom path', false, group.texture);\\n  const texture: TexturedStyles = getTextureKnobs(useCustomPath);\\n  const opacity = number('Series opacity', 1, { min: 0, max: 1, step: 0.1 }, group.series);\\n  const showFill = boolean('Show series fill', false, group.series);\\n  const seriesColor = color('Series color', DEFAULT_COLOR, group.series);\\n  const [Series, seriesType] = customKnobs.enum.xySeries('Series type', 'area', {\\n    group: group.series,\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          areaSeriesStyle: {\\n            area: {\\n              texture,\\n              opacity,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n          },\\n          barSeriesStyle: {\\n            rect: {\\n              fill: showFill ? undefined : 'transparent',\\n              opacity,\\n              texture,\\n            },\\n            rectBorder: {\\n              visible: true,\\n              strokeWidth: 2,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <Series\\n        id=\\\"series\\\"\\n        color={seriesColor}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={seriesType === 'bar' ? barData : areaData}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, button } from '@storybook/addon-knobs';\\nimport React, { useState } from 'react';\\n\\nimport { Axis, Chart, CurveType, Position, TexturedStyles, Settings, TextureShape, SeriesType } from '@elastic/charts';\\nimport { getRandomNumberGenerator, SeededDataGenerator, getRandomEntryFn } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst group = {\\n  random: 'Randomized parameters',\\n  default: 'Default parameters',\\n};\\nconst dg = new SeededDataGenerator();\\nconst rng = getRandomNumberGenerator();\\nconst getRandomEntry = getRandomEntryFn();\\n\\ninterface Random {\\n  shape: boolean;\\n  rotation: boolean;\\n  shapeRotation: boolean;\\n  size: boolean;\\n  spacing: {\\n    x: boolean;\\n    y: boolean;\\n  };\\n  offset: {\\n    x: boolean;\\n    y: boolean;\\n  };\\n}\\n\\nconst getDefaultTextureKnobs = (): TexturedStyles => ({\\n  shape: customKnobs.fromEnum('Shape', TextureShape, TextureShape.Circle, {\\n    group: group.default,\\n  }),\\n  strokeWidth: number('Stroke width', 1, { min: 0, max: 10, step: 0.5 }, group.default),\\n  rotation: number('Rotation (degrees)', 45, { min: -365, max: 365 }, group.default),\\n  shapeRotation: number('Shape rotation (degrees)', 0, { min: -365, max: 365 }, group.default),\\n  size: number('Shape size', 20, { min: 0 }, group.default),\\n  opacity: number('Opacity', 1, { min: 0, max: 1, step: 0.1 }, group.default),\\n  spacing: {\\n    x: number('Shape spacing - x', 10, { min: 0 }, group.default),\\n    y: number('Shape spacing - y', 10, { min: 0 }, group.default),\\n  },\\n  offset: {\\n    x: number('Pattern offset - x', 0, {}, group.default),\\n    y: number('Pattern offset - y', 0, {}, group.default),\\n    global: true,\\n  },\\n});\\n\\nconst getRandomKnobs = (): Random => ({\\n  shape: boolean('Shape', true, group.random),\\n  rotation: boolean('Rotation', false, group.random),\\n  shapeRotation: boolean('Shape rotation', false, group.random),\\n  size: boolean('Size', true, group.random),\\n  spacing: {\\n    x: boolean('X spacing', false, group.random),\\n    y: boolean('Y spacing', false, group.random),\\n  },\\n  offset: {\\n    x: boolean('X offset', false, group.random),\\n    y: boolean('Y offset', false, group.random),\\n  },\\n});\\n\\nconst getTexture = (randomize: Random): Partial<TexturedStyles> => ({\\n  shape: randomize.shape ? getRandomEntry(TextureShape) : undefined,\\n  rotation: randomize.rotation ? rng(0, 365) : undefined,\\n  shapeRotation: randomize.shapeRotation ? rng(0, 365) : undefined,\\n  size: randomize.size ? rng(5, 30) : undefined,\\n  spacing: {\\n    x: randomize.spacing.x ? rng(0, 30) : undefined,\\n    y: randomize.spacing.y ? rng(0, 30) : undefined,\\n  },\\n  offset: {\\n    x: randomize.offset.x ? rng(0, 30) : undefined,\\n    y: randomize.offset.y ? rng(0, 30) : undefined,\\n  },\\n});\\n\\nconst data = new Array(10).fill(0).map(() => dg.generateBasicSeries(10, 10));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const [count, setCount] = useState(0);\\n  button('Randomize', () => setCount((i) => i + 1), group.random);\\n  const n = number('Total series', 4, { min: 0, max: 10, step: 1 }) ?? 2;\\n  const showLegend = boolean('Show legend', false);\\n  const showFill = boolean('Show series fill', false);\\n  const chartColor = color('Chart color', 'rgba(0,0,0,1)');\\n  const random = getRandomKnobs();\\n  const [Series] = customKnobs.enum.xySeries('Series type', 'area', {\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n  const texture = getDefaultTextureKnobs();\\n\\n  return (\\n    <Chart title={title} description={description} data-count={count}>\\n      <Settings\\n        showLegend={showLegend}\\n        theme={{\\n          areaSeriesStyle: {\\n            area: {\\n              texture,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n          },\\n          barSeriesStyle: {\\n            rect: {\\n              texture,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n            rectBorder: {\\n              visible: true,\\n              strokeWidth: 2,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} />\\n\\n      {new Array(n).fill(0).map((v, i) => (\\n        <Series\\n          key={i}\\n          id={`series-${i}`}\\n          areaSeriesStyle={{\\n            area: {\\n              texture: getTexture(random),\\n            },\\n          }}\\n          barSeriesStyle={{\\n            rect: {\\n              texture: getTexture(random),\\n            },\\n          }}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          color={chartColor}\\n          stackAccessors={['yes']}\\n          data={data[i]}\\n          curve={CurveType.CURVE_MONOTONE_X}\\n        />\\n      ))}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":94},\"endLoc\":{\"col\":1,\"line\":159},\"startBody\":{\"col\":36,\"line\":94},\"endBody\":{\"col\":1,\"line\":159}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, button } from '@storybook/addon-knobs';\nimport React, { useState } from 'react';\n\nimport { Axis, Chart, CurveType, Position, TexturedStyles, Settings, TextureShape, SeriesType } from '@elastic/charts';\nimport { getRandomNumberGenerator, SeededDataGenerator, getRandomEntryFn } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst group = {\n  random: 'Randomized parameters',\n  default: 'Default parameters',\n};\nconst dg = new SeededDataGenerator();\nconst rng = getRandomNumberGenerator();\nconst getRandomEntry = getRandomEntryFn();\n\ninterface Random {\n  shape: boolean;\n  rotation: boolean;\n  shapeRotation: boolean;\n  size: boolean;\n  spacing: {\n    x: boolean;\n    y: boolean;\n  };\n  offset: {\n    x: boolean;\n    y: boolean;\n  };\n}\n\nconst getDefaultTextureKnobs = (): TexturedStyles => ({\n  shape: customKnobs.fromEnum('Shape', TextureShape, TextureShape.Circle, {\n    group: group.default,\n  }),\n  strokeWidth: number('Stroke width', 1, { min: 0, max: 10, step: 0.5 }, group.default),\n  rotation: number('Rotation (degrees)', 45, { min: -365, max: 365 }, group.default),\n  shapeRotation: number('Shape rotation (degrees)', 0, { min: -365, max: 365 }, group.default),\n  size: number('Shape size', 20, { min: 0 }, group.default),\n  opacity: number('Opacity', 1, { min: 0, max: 1, step: 0.1 }, group.default),\n  spacing: {\n    x: number('Shape spacing - x', 10, { min: 0 }, group.default),\n    y: number('Shape spacing - y', 10, { min: 0 }, group.default),\n  },\n  offset: {\n    x: number('Pattern offset - x', 0, {}, group.default),\n    y: number('Pattern offset - y', 0, {}, group.default),\n    global: true,\n  },\n});\n\nconst getRandomKnobs = (): Random => ({\n  shape: boolean('Shape', true, group.random),\n  rotation: boolean('Rotation', false, group.random),\n  shapeRotation: boolean('Shape rotation', false, group.random),\n  size: boolean('Size', true, group.random),\n  spacing: {\n    x: boolean('X spacing', false, group.random),\n    y: boolean('Y spacing', false, group.random),\n  },\n  offset: {\n    x: boolean('X offset', false, group.random),\n    y: boolean('Y offset', false, group.random),\n  },\n});\n\nconst getTexture = (randomize: Random): Partial<TexturedStyles> => ({\n  shape: randomize.shape ? getRandomEntry(TextureShape) : undefined,\n  rotation: randomize.rotation ? rng(0, 365) : undefined,\n  shapeRotation: randomize.shapeRotation ? rng(0, 365) : undefined,\n  size: randomize.size ? rng(5, 30) : undefined,\n  spacing: {\n    x: randomize.spacing.x ? rng(0, 30) : undefined,\n    y: randomize.spacing.y ? rng(0, 30) : undefined,\n  },\n  offset: {\n    x: randomize.offset.x ? rng(0, 30) : undefined,\n    y: randomize.offset.y ? rng(0, 30) : undefined,\n  },\n});\n\nconst data = new Array(10).fill(0).map(() => dg.generateBasicSeries(10, 10));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const [count, setCount] = useState(0);\n  button('Randomize', () => setCount((i) => i + 1), group.random);\n  const n = number('Total series', 4, { min: 0, max: 10, step: 1 }) ?? 2;\n  const showLegend = boolean('Show legend', false);\n  const showFill = boolean('Show series fill', false);\n  const chartColor = color('Chart color', 'rgba(0,0,0,1)');\n  const random = getRandomKnobs();\n  const [Series] = customKnobs.enum.xySeries('Series type', 'area', {\n    exclude: [SeriesType.Bubble, SeriesType.Line],\n  });\n  const texture = getDefaultTextureKnobs();\n\n  return (\n    <Chart title={title} description={description} data-count={count}>\n      <Settings\n        showLegend={showLegend}\n        theme={{\n          areaSeriesStyle: {\n            area: {\n              texture,\n              fill: showFill ? undefined : 'transparent',\n            },\n          },\n          barSeriesStyle: {\n            rect: {\n              texture,\n              fill: showFill ? undefined : 'transparent',\n            },\n            rectBorder: {\n              visible: true,\n              strokeWidth: 2,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" position={Position.Left} />\n\n      {new Array(n).fill(0).map((v, i) => (\n        <Series\n          key={i}\n          id={`series-${i}`}\n          areaSeriesStyle={{\n            area: {\n              texture: getTexture(random),\n            },\n          }}\n          barSeriesStyle={{\n            rect: {\n              texture: getTexture(random),\n            },\n          }}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          color={chartColor}\n          stackAccessors={['yes']}\n          data={data[i]}\n          curve={CurveType.CURVE_MONOTONE_X}\n        />\n      ))}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const [count, setCount] = useState(0);\\n  button('Randomize', () => setCount((i) => i + 1), group.random);\\n  const n = number('Total series', 4, { min: 0, max: 10, step: 1 }) ?? 2;\\n  const showLegend = boolean('Show legend', false);\\n  const showFill = boolean('Show series fill', false);\\n  const chartColor = color('Chart color', 'rgba(0,0,0,1)');\\n  const random = getRandomKnobs();\\n  const [Series] = customKnobs.enum.xySeries('Series type', 'area', {\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n  const texture = getDefaultTextureKnobs();\\n\\n  return (\\n    <Chart title={title} description={description} data-count={count}>\\n      <Settings\\n        showLegend={showLegend}\\n        theme={{\\n          areaSeriesStyle: {\\n            area: {\\n              texture,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n          },\\n          barSeriesStyle: {\\n            rect: {\\n              texture,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n            rectBorder: {\\n              visible: true,\\n              strokeWidth: 2,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} />\\n\\n      {new Array(n).fill(0).map((v, i) => (\\n        <Series\\n          key={i}\\n          id={`series-${i}`}\\n          areaSeriesStyle={{\\n            area: {\\n              texture: getTexture(random),\\n            },\\n          }}\\n          barSeriesStyle={{\\n            rect: {\\n              texture: getTexture(random),\\n            },\\n          }}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          color={chartColor}\\n          stackAccessors={['yes']}\\n          data={data[i]}\\n          curve={CurveType.CURVE_MONOTONE_X}\\n        />\\n      ))}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  Position,\\n  Settings,\\n  AreaSeries,\\n  LineSeries,\\n  BubbleSeries,\\n  ScaleType,\\n  PointShape,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const shapeKnobArea = select(\\n    'area series marker shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobArea = color('area series stroke color', '#54B399');\\n  const fillKnobArea = color('area series fill color', 'white');\\n\\n  const shapeKnobLine = select(\\n    'line series marker shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobLine = color('line series stroke color', '#6092C0');\\n  const fillKnobLine = color('line series fill color', 'white');\\n\\n  const shapeKnobBubble = select(\\n    'bubble marker series shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobBubble = color('bubble series stroke color', '#D36086');\\n  const fillKnobBubble = color('bubble series fill color', 'white');\\n\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} showLegend />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        areaSeriesStyle={{\\n          point: {\\n            shape: shapeKnobArea,\\n            stroke: strokeKnobArea,\\n            fill: fillKnobArea,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 2.5 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        lineSeriesStyle={{\\n          point: {\\n            radius: 20,\\n            shape: shapeKnobLine,\\n            stroke: strokeKnobLine,\\n            fill: fillKnobLine,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 2.8 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        bubbleSeriesStyle={{\\n          point: {\\n            radius: 20,\\n            shape: shapeKnobBubble,\\n            stroke: strokeKnobBubble,\\n            fill: fillKnobBubble,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 5 },\\n          { x: 1, y: 8 },\\n          { x: 2, y: 9 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":121},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":121}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  Position,\n  Settings,\n  AreaSeries,\n  LineSeries,\n  BubbleSeries,\n  ScaleType,\n  PointShape,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const shapeKnobArea = select(\n    'area series marker shape',\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\n    PointShape.Circle,\n  );\n  const strokeKnobArea = color('area series stroke color', '#54B399');\n  const fillKnobArea = color('area series fill color', 'white');\n\n  const shapeKnobLine = select(\n    'line series marker shape',\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\n    PointShape.Circle,\n  );\n  const strokeKnobLine = color('line series stroke color', '#6092C0');\n  const fillKnobLine = color('line series fill color', 'white');\n\n  const shapeKnobBubble = select(\n    'bubble marker series shape',\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\n    PointShape.Circle,\n  );\n  const strokeKnobBubble = color('bubble series stroke color', '#D36086');\n  const fillKnobBubble = color('bubble series fill color', 'white');\n\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings baseTheme={useBaseTheme()} showLegend />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <AreaSeries\n        id=\"areas\"\n        areaSeriesStyle={{\n          point: {\n            shape: shapeKnobArea,\n            stroke: strokeKnobArea,\n            fill: fillKnobArea,\n          },\n        }}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={[\n          { x: 0, y: 2.5 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines\"\n        lineSeriesStyle={{\n          point: {\n            radius: 20,\n            shape: shapeKnobLine,\n            stroke: strokeKnobLine,\n            fill: fillKnobLine,\n          },\n        }}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={[\n          { x: 0, y: 2.8 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n      <BubbleSeries\n        id=\"bubbles\"\n        bubbleSeriesStyle={{\n          point: {\n            radius: 20,\n            shape: shapeKnobBubble,\n            stroke: strokeKnobBubble,\n            fill: fillKnobBubble,\n          },\n        }}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={[\n          { x: 0, y: 5 },\n          { x: 1, y: 8 },\n          { x: 2, y: 9 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const shapeKnobArea = select(\\n    'area series marker shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobArea = color('area series stroke color', '#54B399');\\n  const fillKnobArea = color('area series fill color', 'white');\\n\\n  const shapeKnobLine = select(\\n    'line series marker shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobLine = color('line series stroke color', '#6092C0');\\n  const fillKnobLine = color('line series fill color', 'white');\\n\\n  const shapeKnobBubble = select(\\n    'bubble marker series shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobBubble = color('bubble series stroke color', '#D36086');\\n  const fillKnobBubble = color('bubble series fill color', 'white');\\n\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} showLegend />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        areaSeriesStyle={{\\n          point: {\\n            shape: shapeKnobArea,\\n            stroke: strokeKnobArea,\\n            fill: fillKnobArea,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 2.5 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        lineSeriesStyle={{\\n          point: {\\n            radius: 20,\\n            shape: shapeKnobLine,\\n            stroke: strokeKnobLine,\\n            fill: fillKnobLine,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 2.8 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        bubbleSeriesStyle={{\\n          point: {\\n            radius: 20,\\n            shape: shapeKnobBubble,\\n            stroke: strokeKnobBubble,\\n            fill: fillKnobBubble,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 5 },\\n          { x: 1, y: 8 },\\n          { x: 2, y: 9 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  LineSeries,\\n  Axis,\\n  Chart,\\n  ColorVariant,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendSize={100}\\n      pointBuffer={Infinity}\\n      legendPosition={Position.Right}\\n      baseTheme={useBaseTheme()}\\n      theme={{\\n        highlighter: {\\n          point: {\\n            radius: 4,\\n            opacity: 1,\\n            fill: ColorVariant.Series,\\n            stroke: ColorVariant.None,\\n            strokeWidth: 0,\\n          },\\n        },\\n      }}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n      timeAxisLayerCount={2}\\n      gridLine={{\\n        visible: true,\\n      }}\\n      style={{\\n        tickLine: { size: 0.0001, padding: 4 },\\n        tickLabel: {\\n          alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n          padding: 0,\\n          offset: { x: 0, y: 0 },\\n        },\\n      }}\\n    />\\n    <Tooltip customTooltip={() => null} />\\n    <Axis\\n      id=\\\"left\\\"\\n      position={Position.Left}\\n      gridLine={{\\n        visible: true,\\n      }}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      labelFormat={(d) => Number(d).toFixed(0)}\\n      ticks={5}\\n    />\\n    <LineSeries\\n      id=\\\"1\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n    <LineSeries\\n      id=\\\"2\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n    <LineSeries\\n      id=\\\"3\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  LineSeries,\n  Axis,\n  Chart,\n  ColorVariant,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  Tooltip,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendSize={100}\n      pointBuffer={Infinity}\n      legendPosition={Position.Right}\n      baseTheme={useBaseTheme()}\n      theme={{\n        highlighter: {\n          point: {\n            radius: 4,\n            opacity: 1,\n            fill: ColorVariant.Series,\n            stroke: ColorVariant.None,\n            strokeWidth: 0,\n          },\n        },\n      }}\n    />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n      timeAxisLayerCount={2}\n      gridLine={{\n        visible: true,\n      }}\n      style={{\n        tickLine: { size: 0.0001, padding: 4 },\n        tickLabel: {\n          alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n          padding: 0,\n          offset: { x: 0, y: 0 },\n        },\n      }}\n    />\n    <Tooltip customTooltip={() => null} />\n    <Axis\n      id=\"left\"\n      position={Position.Left}\n      gridLine={{\n        visible: true,\n      }}\n      tickFormat={(d) => Number(d).toFixed(2)}\n      labelFormat={(d) => Number(d).toFixed(0)}\n      ticks={5}\n    />\n    <LineSeries\n      id=\"1\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      yNice\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n      lineSeriesStyle={{\n        point: {\n          visible: false,\n        },\n      }}\n    />\n    <LineSeries\n      id=\"2\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      yNice\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n      lineSeriesStyle={{\n        point: {\n          visible: false,\n        },\n      }}\n    />\n    <LineSeries\n      id=\"3\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      yNice\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      lineSeriesStyle={{\n        point: {\n          visible: false,\n        },\n      }}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendSize={100}\\n      pointBuffer={Infinity}\\n      legendPosition={Position.Right}\\n      baseTheme={useBaseTheme()}\\n      theme={{\\n        highlighter: {\\n          point: {\\n            radius: 4,\\n            opacity: 1,\\n            fill: ColorVariant.Series,\\n            stroke: ColorVariant.None,\\n            strokeWidth: 0,\\n          },\\n        },\\n      }}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n      timeAxisLayerCount={2}\\n      gridLine={{\\n        visible: true,\\n      }}\\n      style={{\\n        tickLine: { size: 0.0001, padding: 4 },\\n        tickLabel: {\\n          alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n          padding: 0,\\n          offset: { x: 0, y: 0 },\\n        },\\n      }}\\n    />\\n    <Tooltip customTooltip={() => null} />\\n    <Axis\\n      id=\\\"left\\\"\\n      position={Position.Left}\\n      gridLine={{\\n        visible: true,\\n      }}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      labelFormat={(d) => Number(d).toFixed(0)}\\n      ticks={5}\\n    />\\n    <LineSeries\\n      id=\\\"1\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n    <LineSeries\\n      id=\\\"2\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n    <LineSeries\\n      id=\\\"3\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      left: range('margin left', 0, 50, 10),\\n      right: range('margin right', 0, 50, 10),\\n      top: range('margin top', 0, 50, 10),\\n      bottom: range('margin bottom', 0, 50, 10),\\n    },\\n    chartPaddings: {\\n      left: range('padding left', 0, 50, 10),\\n      right: range('padding right', 0, 50, 10),\\n      top: range('padding top', 0, 50, 10),\\n      bottom: range('padding bottom', 0, 50, 10),\\n    },\\n    scales: {\\n      barsPadding: range('bar padding', 0, 1, 0.1, undefined, 0.01),\\n    },\\n  };\\n  const withLeftTitle = boolean('left axis with title', true);\\n  const withBottomTitle = boolean('bottom axis with title', true);\\n  const withRightTitle = boolean('right axis with title', true);\\n  const withTopTitle = boolean('top axis with title', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title={withBottomTitle ? 'Bottom axis' : undefined}\\n        showOverlappingTicks\\n        gridLine={{\\n          visible: boolean('show bottom axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title={withLeftTitle ? 'Left axis' : undefined}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          visible: boolean('show left axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title={withTopTitle ? 'Top axis' : undefined}\\n        showOverlappingTicks\\n        gridLine={{\\n          visible: boolean('show top axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title={withRightTitle ? 'Right axis' : undefined}\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          visible: boolean('show right axis grid lines', false),\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":114},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":114}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    chartMargins: {\n      left: range('margin left', 0, 50, 10),\n      right: range('margin right', 0, 50, 10),\n      top: range('margin top', 0, 50, 10),\n      bottom: range('margin bottom', 0, 50, 10),\n    },\n    chartPaddings: {\n      left: range('padding left', 0, 50, 10),\n      right: range('padding right', 0, 50, 10),\n      top: range('padding top', 0, 50, 10),\n      bottom: range('padding bottom', 0, 50, 10),\n    },\n    scales: {\n      barsPadding: range('bar padding', 0, 1, 0.1, undefined, 0.01),\n    },\n  };\n  const withLeftTitle = boolean('left axis with title', true);\n  const withBottomTitle = boolean('bottom axis with title', true);\n  const withRightTitle = boolean('right axis with title', true);\n  const withTopTitle = boolean('top axis with title', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', true)}\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n      />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title={withBottomTitle ? 'Bottom axis' : undefined}\n        showOverlappingTicks\n        gridLine={{\n          visible: boolean('show bottom axis grid lines', false),\n        }}\n      />\n      <Axis\n        id=\"left2\"\n        title={withLeftTitle ? 'Left axis' : undefined}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        gridLine={{\n          visible: boolean('show left axis grid lines', false),\n        }}\n      />\n      <Axis\n        id=\"top\"\n        position={Position.Top}\n        title={withTopTitle ? 'Top axis' : undefined}\n        showOverlappingTicks\n        gridLine={{\n          visible: boolean('show top axis grid lines', false),\n        }}\n      />\n      <Axis\n        id=\"right\"\n        title={withRightTitle ? 'Right axis' : undefined}\n        position={Position.Right}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        gridLine={{\n          visible: boolean('show right axis grid lines', false),\n        }}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      left: range('margin left', 0, 50, 10),\\n      right: range('margin right', 0, 50, 10),\\n      top: range('margin top', 0, 50, 10),\\n      bottom: range('margin bottom', 0, 50, 10),\\n    },\\n    chartPaddings: {\\n      left: range('padding left', 0, 50, 10),\\n      right: range('padding right', 0, 50, 10),\\n      top: range('padding top', 0, 50, 10),\\n      bottom: range('padding bottom', 0, 50, 10),\\n    },\\n    scales: {\\n      barsPadding: range('bar padding', 0, 1, 0.1, undefined, 0.01),\\n    },\\n  };\\n  const withLeftTitle = boolean('left axis with title', true);\\n  const withBottomTitle = boolean('bottom axis with title', true);\\n  const withRightTitle = boolean('right axis with title', true);\\n  const withTopTitle = boolean('top axis with title', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title={withBottomTitle ? 'Bottom axis' : undefined}\\n        showOverlappingTicks\\n        gridLine={{\\n          visible: boolean('show bottom axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title={withLeftTitle ? 'Left axis' : undefined}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          visible: boolean('show left axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title={withTopTitle ? 'Top axis' : undefined}\\n        showOverlappingTicks\\n        gridLine={{\\n          visible: boolean('show top axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title={withRightTitle ? 'Right axis' : undefined}\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          visible: boolean('show right axis grid lines', false),\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    axes: {\\n      axisTitle: {\\n        fill: color('titleFill', '#333', 'Axis Title'),\\n        fontSize: range('titleFontSize', 0, 40, 12, 'Axis Title'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        padding: range('titlePadding', 0, 40, 5, 'Axis Title'),\\n      },\\n      axisLine: {\\n        stroke: color('axisLinecolor', '#333', 'Axis Line'),\\n        strokeWidth: range('axisLineWidth', 0, 5, 1, 'Axis Line'),\\n      },\\n      tickLabel: {\\n        fill: color('tickFill', '#333', 'Tick Label'),\\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: number('tickLabelPadding', 1, {}, 'Tick Label'),\\n      },\\n      tickLine: {\\n        visible: boolean('showTicks', true, 'Tick Line'),\\n        stroke: color('tickLineColor', '#333', 'Tick Line'),\\n        strokeWidth: range('tickLineWidth', 0, 5, 1, 'Tick Line'),\\n      },\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n        rotation={select('rotation', { 0: 0, 90: 90, '-90': -90, 180: 180 }, 0)}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":84},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":84}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    axes: {\n      axisTitle: {\n        fill: color('titleFill', '#333', 'Axis Title'),\n        fontSize: range('titleFontSize', 0, 40, 12, 'Axis Title'),\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        padding: range('titlePadding', 0, 40, 5, 'Axis Title'),\n      },\n      axisLine: {\n        stroke: color('axisLinecolor', '#333', 'Axis Line'),\n        strokeWidth: range('axisLineWidth', 0, 5, 1, 'Axis Line'),\n      },\n      tickLabel: {\n        fill: color('tickFill', '#333', 'Tick Label'),\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        fontStyle: 'normal',\n        padding: number('tickLabelPadding', 1, {}, 'Tick Label'),\n      },\n      tickLine: {\n        visible: boolean('showTicks', true, 'Tick Line'),\n        stroke: color('tickLineColor', '#333', 'Tick Line'),\n        strokeWidth: range('tickLineWidth', 0, 5, 1, 'Tick Line'),\n      },\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', true)}\n        rotation={select('rotation', { 0: 0, 90: 90, '-90': -90, 180: 180 }, 0)}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    axes: {\\n      axisTitle: {\\n        fill: color('titleFill', '#333', 'Axis Title'),\\n        fontSize: range('titleFontSize', 0, 40, 12, 'Axis Title'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        padding: range('titlePadding', 0, 40, 5, 'Axis Title'),\\n      },\\n      axisLine: {\\n        stroke: color('axisLinecolor', '#333', 'Axis Line'),\\n        strokeWidth: range('axisLineWidth', 0, 5, 1, 'Axis Line'),\\n      },\\n      tickLabel: {\\n        fill: color('tickFill', '#333', 'Tick Label'),\\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: number('tickLabelPadding', 1, {}, 'Tick Label'),\\n      },\\n      tickLine: {\\n        visible: boolean('showTicks', true, 'Tick Line'),\\n        stroke: color('tickLineColor', '#333', 'Tick Line'),\\n        strokeWidth: range('tickLineWidth', 0, 5, 1, 'Tick Line'),\\n      },\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n        rotation={select('rotation', { 0: 0, 90: 90, '-90': -90, 180: 180 }, 0)}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  CurveType,\\n  DEFAULT_MISSING_COLOR,\\n  LineSeries,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\nconst data2 = dg.generateSimpleSeries(40);\\nconst data3 = dg.generateSimpleSeries(40);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customizeLineStroke = boolean('customizeLineStroke', false, 'line');\\n  const customizePointStroke = boolean('customizeLinePointStroke', false, 'line');\\n  const customizeAreaFill = boolean('customizeAreaFill', false, 'area');\\n  const customizeAreaLineStroke = boolean('customizeAreaLineStroke', false, 'area');\\n  const customizeRectFill = boolean('customizeRectFill', false, 'bar');\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      left: range('margin left', 0, 50, 10, 'Margins'),\\n      right: range('margin right', 0, 50, 10, 'Margins'),\\n      top: range('margin top', 0, 50, 10, 'Margins'),\\n      bottom: range('margin bottom', 0, 50, 10, 'Margins'),\\n    },\\n    chartPaddings: {\\n      left: range('padding left', 0, 50, 10, 'Paddings'),\\n      right: range('padding right', 0, 50, 10, 'Paddings'),\\n      top: range('padding top', 0, 50, 10, 'Paddings'),\\n      bottom: range('padding bottom', 0, 50, 10, 'Paddings'),\\n    },\\n    lineSeriesStyle: {\\n      line: {\\n        stroke: customizeLineStroke ? color('customLineStroke', 'red', 'line') : undefined,\\n        strokeWidth: range('lineStrokeWidth', 0, 10, 1, 'line'),\\n        visible: boolean('lineVisible', true, 'line'),\\n      },\\n      point: {\\n        visible: boolean('linePointVisible', true, 'line'),\\n        radius: range('linePointRadius', 0, 20, 1, 'line', 0.5),\\n        fill: color('linePointFill', 'white', 'line'),\\n        stroke: customizePointStroke ? color('customLinePointStroke', 'red', 'line') : undefined,\\n        strokeWidth: range('linePointStrokeWidth', 0, 20, 0.5, 'line'),\\n        opacity: range('linePointOpacity', 0, 1, 1, 'line', 0.01),\\n      },\\n    },\\n    areaSeriesStyle: {\\n      area: {\\n        fill: customizeAreaFill ? color('customAreaFill', 'red', 'area') : undefined,\\n        visible: boolean('aAreaVisible', true, 'area'),\\n        opacity: range('aAreaOpacity', 0, 1, 1, 'area'),\\n      },\\n      line: {\\n        stroke: customizeAreaLineStroke ? color('customAreaLineStroke', 'red', 'area') : undefined,\\n        strokeWidth: range('aStrokeWidth', 0, 10, 1, 'area'),\\n        visible: boolean('aLineVisible', true, 'area'),\\n      },\\n      point: {\\n        visible: boolean('aPointVisible', true, 'area'),\\n        fill: color('aPointFill', 'white', 'area'),\\n        radius: range('aPointRadius', 0, 20, 1, 'area'),\\n        stroke: color('aPointStroke', 'white', 'area'),\\n        strokeWidth: range('aPointStrokeWidth', 0, 20, 0.5, 'area'),\\n        opacity: range('aPointOpacity', 0, 1, 0.01, 'area'),\\n      },\\n    },\\n    barSeriesStyle: {\\n      rect: {\\n        fill: customizeRectFill ? color('recCustomFull', 'red', 'bar') : undefined,\\n        opacity: range('rectOpacity', 0, 1, 0.5, 'bar', 0.1),\\n      },\\n      rectBorder: {\\n        stroke: color('bBorderStroke', 'white', 'bar'),\\n        strokeWidth: range('bStrokeWidth', 0, 10, 1, 'bar'),\\n        visible: boolean('bBorderVisible', true, 'bar'),\\n      },\\n    },\\n    sharedStyle: {\\n      default: {\\n        opacity: range('sOpacity', 0, 1, 1, 'Shared', 0.05),\\n      },\\n      highlighted: {\\n        opacity: range('sHighlighted', 0, 1, 1, 'Shared', 0.05),\\n      },\\n      unhighlighted: {\\n        opacity: range('sUnhighlighted', 0, 1, 0.25, 'Shared', 0.05),\\n      },\\n    },\\n    colors: {\\n      vizColors: select(\\n        'vizColors',\\n        {\\n          colorBlind: palettes.echPaletteColorBlind.colors,\\n          darkBackground: palettes.echPaletteForDarkBackground.colors,\\n          lightBackground: palettes.echPaletteForLightBackground.colors,\\n          forStatus: palettes.echPaletteForStatus.colors,\\n        },\\n        palettes.echPaletteColorBlind.colors,\\n        'Colors',\\n      ),\\n      defaultVizColor: DEFAULT_MISSING_COLOR,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":50},\"endLoc\":{\"col\":1,\"line\":186},\"startBody\":{\"col\":36,\"line\":50},\"endBody\":{\"col\":1,\"line\":186}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  CurveType,\n  DEFAULT_MISSING_COLOR,\n  LineSeries,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\nconst data2 = dg.generateSimpleSeries(40);\nconst data3 = dg.generateSimpleSeries(40);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customizeLineStroke = boolean('customizeLineStroke', false, 'line');\n  const customizePointStroke = boolean('customizeLinePointStroke', false, 'line');\n  const customizeAreaFill = boolean('customizeAreaFill', false, 'area');\n  const customizeAreaLineStroke = boolean('customizeAreaLineStroke', false, 'area');\n  const customizeRectFill = boolean('customizeRectFill', false, 'bar');\n  const theme: PartialTheme = {\n    chartMargins: {\n      left: range('margin left', 0, 50, 10, 'Margins'),\n      right: range('margin right', 0, 50, 10, 'Margins'),\n      top: range('margin top', 0, 50, 10, 'Margins'),\n      bottom: range('margin bottom', 0, 50, 10, 'Margins'),\n    },\n    chartPaddings: {\n      left: range('padding left', 0, 50, 10, 'Paddings'),\n      right: range('padding right', 0, 50, 10, 'Paddings'),\n      top: range('padding top', 0, 50, 10, 'Paddings'),\n      bottom: range('padding bottom', 0, 50, 10, 'Paddings'),\n    },\n    lineSeriesStyle: {\n      line: {\n        stroke: customizeLineStroke ? color('customLineStroke', 'red', 'line') : undefined,\n        strokeWidth: range('lineStrokeWidth', 0, 10, 1, 'line'),\n        visible: boolean('lineVisible', true, 'line'),\n      },\n      point: {\n        visible: boolean('linePointVisible', true, 'line'),\n        radius: range('linePointRadius', 0, 20, 1, 'line', 0.5),\n        fill: color('linePointFill', 'white', 'line'),\n        stroke: customizePointStroke ? color('customLinePointStroke', 'red', 'line') : undefined,\n        strokeWidth: range('linePointStrokeWidth', 0, 20, 0.5, 'line'),\n        opacity: range('linePointOpacity', 0, 1, 1, 'line', 0.01),\n      },\n    },\n    areaSeriesStyle: {\n      area: {\n        fill: customizeAreaFill ? color('customAreaFill', 'red', 'area') : undefined,\n        visible: boolean('aAreaVisible', true, 'area'),\n        opacity: range('aAreaOpacity', 0, 1, 1, 'area'),\n      },\n      line: {\n        stroke: customizeAreaLineStroke ? color('customAreaLineStroke', 'red', 'area') : undefined,\n        strokeWidth: range('aStrokeWidth', 0, 10, 1, 'area'),\n        visible: boolean('aLineVisible', true, 'area'),\n      },\n      point: {\n        visible: boolean('aPointVisible', true, 'area'),\n        fill: color('aPointFill', 'white', 'area'),\n        radius: range('aPointRadius', 0, 20, 1, 'area'),\n        stroke: color('aPointStroke', 'white', 'area'),\n        strokeWidth: range('aPointStrokeWidth', 0, 20, 0.5, 'area'),\n        opacity: range('aPointOpacity', 0, 1, 0.01, 'area'),\n      },\n    },\n    barSeriesStyle: {\n      rect: {\n        fill: customizeRectFill ? color('recCustomFull', 'red', 'bar') : undefined,\n        opacity: range('rectOpacity', 0, 1, 0.5, 'bar', 0.1),\n      },\n      rectBorder: {\n        stroke: color('bBorderStroke', 'white', 'bar'),\n        strokeWidth: range('bStrokeWidth', 0, 10, 1, 'bar'),\n        visible: boolean('bBorderVisible', true, 'bar'),\n      },\n    },\n    sharedStyle: {\n      default: {\n        opacity: range('sOpacity', 0, 1, 1, 'Shared', 0.05),\n      },\n      highlighted: {\n        opacity: range('sHighlighted', 0, 1, 1, 'Shared', 0.05),\n      },\n      unhighlighted: {\n        opacity: range('sUnhighlighted', 0, 1, 0.25, 'Shared', 0.05),\n      },\n    },\n    colors: {\n      vizColors: select(\n        'vizColors',\n        {\n          colorBlind: palettes.echPaletteColorBlind.colors,\n          darkBackground: palettes.echPaletteForDarkBackground.colors,\n          lightBackground: palettes.echPaletteForLightBackground.colors,\n          forStatus: palettes.echPaletteForStatus.colors,\n        },\n        palettes.echPaletteColorBlind.colors,\n        'Colors',\n      ),\n      defaultVizColor: DEFAULT_MISSING_COLOR,\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={data1}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={data2}\n      />\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customizeLineStroke = boolean('customizeLineStroke', false, 'line');\\n  const customizePointStroke = boolean('customizeLinePointStroke', false, 'line');\\n  const customizeAreaFill = boolean('customizeAreaFill', false, 'area');\\n  const customizeAreaLineStroke = boolean('customizeAreaLineStroke', false, 'area');\\n  const customizeRectFill = boolean('customizeRectFill', false, 'bar');\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      left: range('margin left', 0, 50, 10, 'Margins'),\\n      right: range('margin right', 0, 50, 10, 'Margins'),\\n      top: range('margin top', 0, 50, 10, 'Margins'),\\n      bottom: range('margin bottom', 0, 50, 10, 'Margins'),\\n    },\\n    chartPaddings: {\\n      left: range('padding left', 0, 50, 10, 'Paddings'),\\n      right: range('padding right', 0, 50, 10, 'Paddings'),\\n      top: range('padding top', 0, 50, 10, 'Paddings'),\\n      bottom: range('padding bottom', 0, 50, 10, 'Paddings'),\\n    },\\n    lineSeriesStyle: {\\n      line: {\\n        stroke: customizeLineStroke ? color('customLineStroke', 'red', 'line') : undefined,\\n        strokeWidth: range('lineStrokeWidth', 0, 10, 1, 'line'),\\n        visible: boolean('lineVisible', true, 'line'),\\n      },\\n      point: {\\n        visible: boolean('linePointVisible', true, 'line'),\\n        radius: range('linePointRadius', 0, 20, 1, 'line', 0.5),\\n        fill: color('linePointFill', 'white', 'line'),\\n        stroke: customizePointStroke ? color('customLinePointStroke', 'red', 'line') : undefined,\\n        strokeWidth: range('linePointStrokeWidth', 0, 20, 0.5, 'line'),\\n        opacity: range('linePointOpacity', 0, 1, 1, 'line', 0.01),\\n      },\\n    },\\n    areaSeriesStyle: {\\n      area: {\\n        fill: customizeAreaFill ? color('customAreaFill', 'red', 'area') : undefined,\\n        visible: boolean('aAreaVisible', true, 'area'),\\n        opacity: range('aAreaOpacity', 0, 1, 1, 'area'),\\n      },\\n      line: {\\n        stroke: customizeAreaLineStroke ? color('customAreaLineStroke', 'red', 'area') : undefined,\\n        strokeWidth: range('aStrokeWidth', 0, 10, 1, 'area'),\\n        visible: boolean('aLineVisible', true, 'area'),\\n      },\\n      point: {\\n        visible: boolean('aPointVisible', true, 'area'),\\n        fill: color('aPointFill', 'white', 'area'),\\n        radius: range('aPointRadius', 0, 20, 1, 'area'),\\n        stroke: color('aPointStroke', 'white', 'area'),\\n        strokeWidth: range('aPointStrokeWidth', 0, 20, 0.5, 'area'),\\n        opacity: range('aPointOpacity', 0, 1, 0.01, 'area'),\\n      },\\n    },\\n    barSeriesStyle: {\\n      rect: {\\n        fill: customizeRectFill ? color('recCustomFull', 'red', 'bar') : undefined,\\n        opacity: range('rectOpacity', 0, 1, 0.5, 'bar', 0.1),\\n      },\\n      rectBorder: {\\n        stroke: color('bBorderStroke', 'white', 'bar'),\\n        strokeWidth: range('bStrokeWidth', 0, 10, 1, 'bar'),\\n        visible: boolean('bBorderVisible', true, 'bar'),\\n      },\\n    },\\n    sharedStyle: {\\n      default: {\\n        opacity: range('sOpacity', 0, 1, 1, 'Shared', 0.05),\\n      },\\n      highlighted: {\\n        opacity: range('sHighlighted', 0, 1, 1, 'Shared', 0.05),\\n      },\\n      unhighlighted: {\\n        opacity: range('sUnhighlighted', 0, 1, 0.25, 'Shared', 0.05),\\n      },\\n    },\\n    colors: {\\n      vizColors: select(\\n        'vizColors',\\n        {\\n          colorBlind: palettes.echPaletteColorBlind.colors,\\n          darkBackground: palettes.echPaletteForDarkBackground.colors,\\n          lightBackground: palettes.echPaletteForLightBackground.colors,\\n          forStatus: palettes.echPaletteForStatus.colors,\\n        },\\n        palettes.echPaletteColorBlind.colors,\\n        'Colors',\\n      ),\\n      defaultVizColor: DEFAULT_MISSING_COLOR,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customPartialTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('BarBorderStroke', 'white'),\\n        visible: true,\\n      },\\n    },\\n    background: {\\n      color: color('Change background container color', 'white'),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={customPartialTheme}\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":59},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":59}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customPartialTheme: PartialTheme = {\n    barSeriesStyle: {\n      rectBorder: {\n        stroke: color('BarBorderStroke', 'white'),\n        visible: true,\n      },\n    },\n    background: {\n      color: color('Change background container color', 'white'),\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={customPartialTheme}\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={data1}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customPartialTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('BarBorderStroke', 'white'),\\n        visible: true,\\n      },\\n    },\\n    background: {\\n      color: color('Change background container color', 'white'),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={customPartialTheme}\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customPartialTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('BarBorderStroke', 'white'),\\n        visible: true,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={customPartialTheme}\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":56},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":56}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customPartialTheme: PartialTheme = {\n    barSeriesStyle: {\n      rectBorder: {\n        stroke: color('BarBorderStroke', 'white'),\n        visible: true,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={customPartialTheme}\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={data1}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customPartialTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('BarBorderStroke', 'white'),\\n        visible: true,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={customPartialTheme}\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const primaryTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill: color('bar fill - primary theme', 'red'),\\n      },\\n    },\\n  };\\n  const secondaryTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill: color('bar fill - secondary theme', 'blue'),\\n        opacity: range('bar opacity - secondary theme', 0.1, 1, 0.7, undefined, 0.1),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={[primaryTheme, secondaryTheme]}\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":77},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":77}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const primaryTheme: PartialTheme = {\n    barSeriesStyle: {\n      rect: {\n        fill: color('bar fill - primary theme', 'red'),\n      },\n    },\n  };\n  const secondaryTheme: PartialTheme = {\n    barSeriesStyle: {\n      rect: {\n        fill: color('bar fill - secondary theme', 'blue'),\n        opacity: range('bar opacity - secondary theme', 0.1, 1, 0.7, undefined, 0.1),\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={[primaryTheme, secondaryTheme]}\n        legendPosition={Position.Right}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={data1}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const primaryTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill: color('bar fill - primary theme', 'red'),\\n      },\\n    },\\n  };\\n  const secondaryTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill: color('bar fill - secondary theme', 'blue'),\\n        opacity: range('bar opacity - secondary theme', 0.1, 1, 0.7, undefined, 0.1),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={[primaryTheme, secondaryTheme]}\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      color={['red', 'orange', 'blue', 'green', 'black', 'lightgrey']}\\n      data={TestDatasets.BARCHART_2Y2G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":34},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":34}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y1']}\n      splitSeriesAccessors={['g1', 'g2']}\n      color={['red', 'orange', 'blue', 'green', 'black', 'lightgrey']}\n      data={TestDatasets.BARCHART_2Y2G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      color={['red', 'orange', 'blue', 'green', 'black', 'lightgrey']}\\n      data={TestDatasets.BARCHART_2Y2G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  SeriesColorAccessor,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const barColor = color('barSeriesColor', '#000');\\n  const barSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\\n    if (\\n      specId === 'bars' &&\\n      yAccessor === 'y1' &&\\n      splitAccessors.get('g1') === 'cloudflare.com' &&\\n      splitAccessors.get('g2') === 'direct-cdn'\\n    ) {\\n      return barColor;\\n    }\\n    return null;\\n  };\\n\\n  const lineColor = color('linelineSeriesColor', '#ff0');\\n  const lineSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\\n    if (specId === 'lines' && yAccessor === 'y' && splitAccessors.size === 0) {\\n      return lineColor;\\n    }\\n    return null;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        color={barSeriesColorAccessor}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        color={lineSeriesColorAccessor}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":81},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":81}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  SeriesColorAccessor,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const barColor = color('barSeriesColor', '#000');\n  const barSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\n    if (\n      specId === 'bars' &&\n      yAccessor === 'y1' &&\n      splitAccessors.get('g1') === 'cloudflare.com' &&\n      splitAccessors.get('g2') === 'direct-cdn'\n    ) {\n      return barColor;\n    }\n    return null;\n  };\n\n  const lineColor = color('linelineSeriesColor', '#ff0');\n  const lineSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\n    if (specId === 'lines' && yAccessor === 'y' && splitAccessors.size === 0) {\n      return lineColor;\n    }\n    return null;\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        color={barSeriesColorAccessor}\n        data={TestDatasets.BARCHART_2Y2G}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        color={lineSeriesColorAccessor}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const barColor = color('barSeriesColor', '#000');\\n  const barSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\\n    if (\\n      specId === 'bars' &&\\n      yAccessor === 'y1' &&\\n      splitAccessors.get('g1') === 'cloudflare.com' &&\\n      splitAccessors.get('g2') === 'direct-cdn'\\n    ) {\\n      return barColor;\\n    }\\n    return null;\\n  };\\n\\n  const lineColor = color('linelineSeriesColor', '#ff0');\\n  const lineSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\\n    if (specId === 'lines' && yAccessor === 'y' && splitAccessors.size === 0) {\\n      return lineColor;\\n    }\\n    return null;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        color={barSeriesColorAccessor}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        color={lineSeriesColorAccessor}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Stylings',\n};\n\nexport { Example as chartSize } from './1_chart_size.story';\nexport { Example as marginsAndPaddings } from './2_margins.story';\nexport { Example as axis } from './3_axis.story';\nexport { Example as themeStyling } from './4_theme_styling.story';\nexport { Example as partialCustomTheme } from './5_partial_custom_theme.story';\nexport { Example as partialCustomThemeWithBaseTheme } from './6_partial_and_base.story';\nexport { Example as multipleCustomPartialThemes } from './7_multiple_custom.story';\nexport { Example as customSeriesColorsViaColorsArray } from './8_custom_series_colors_array.story';\nexport { Example as customSeriesColorsViaAccessorFunction } from './9_custom_series_colors_function.story';\nexport { Example as customSeriesStylesBars } from './10_custom_bars.story';\nexport { Example as customSeriesStylesLines } from './11_custom_lines.story';\nexport { Example as customSeriesStylesArea } from './12_custom_area.story';\nexport { Example as customSeriesName } from './13_custom_series_name.story';\nexport { Example as customSeriesNameConfig } from './13_custom_series_name_config.story';\nexport { Example as customSeriesNameFormatting } from './14_custom_series_name_formatting.story';\nexport { Example as tickLabelPaddingBothPropAndTheme } from './15_tick_label.story';\nexport { Example as styleAccessorOverrides } from './16_style_accessor.story';\nexport { Example as barSeriesColorVariant } from './17_bar_series_color_variant.story';\nexport { Example as lineSeriesColorVariant } from './18_line_series_color_variant.story';\nexport { Example as areaSeriesColorVariant } from './19_area_series_color_variant.story';\nexport { Example as partitionBackground } from './20_partition_background.story';\nexport { Example as partitionLabels } from './21_partition_labels.story';\nexport { Example as darkTheme } from './22_dark_theme.story';\nexport { Example as withTexture } from './23_with_texture.story';\nexport { Example as textureMultipleSeries } from './24_texture_multiple_series.story';\nexport { Example as mixedPointShapes } from './25_mixed_point_shapes.story';\nexport { Example as highlighterStyle } from './26_highlighter_style.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debugState baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 2)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings debugState baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.slice(0, 2)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debugState baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 2)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 1 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 280 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 80 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => d,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      clockwiseSectors\\n      specialFirstInnermostSector={false}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { outerSizeRatio: 1 },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: 'Machinery and transport equipment', exportVal: 280 },\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 80 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => d,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n      clockwiseSectors\n      specialFirstInnermostSector={false}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 1 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 280 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 80 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => d,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      clockwiseSectors\\n      specialFirstInnermostSector={false}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 9 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 1 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => d,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":41},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":41}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: 'Machinery and transport equipment', exportVal: 9 },\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 1 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => d,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 9 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 1 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => d,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: '7', exportVal: 999999 },\\n        { sitc1: '3', exportVal: 1 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":41},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":41}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: '7', exportVal: 999999 },\n        { sitc1: '3', exportVal: 1 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: '7', exportVal: 999999 },\\n        { sitc1: '3', exportVal: 1 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: '7', exportVal: 1000000 },\\n        { sitc1: '3', exportVal: 0 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":41},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":41}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: '7', exportVal: 1000000 },\n        { sitc1: '3', exportVal: 0 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: '7', exportVal: 1000000 },\\n        { sitc1: '3', exportVal: 0 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.slice(0, 1)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName.replaceAll(/\\\\s/g, '\\\\u00A0'),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name.replaceAll(/\\\\s/g, '\\\\u00A0'),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":56},\"endLoc\":{\"col\":1,\"line\":92},\"startBody\":{\"col\":36,\"line\":56},\"endBody\":{\"col\":1,\"line\":92}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.miniSunburst.slice(0, 1)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: any) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName.replaceAll(/\\s/g, '\\u00A0'),\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name.replaceAll(/\\s/g, '\\u00A0'),\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName.replaceAll(/\\\\s/g, '\\\\u00A0'),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name.replaceAll(/\\\\s/g, '\\\\u00A0'),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.15 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { outerSizeRatio: 0.15 },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.slice(0, 1)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.15 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.03 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { outerSizeRatio: 0.03 },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.slice(0, 1)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.03 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":38},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":38}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={[]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie\\n        .slice(0, 2)\\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: -0.1 })))\\n        .concat(mocks.pie.slice(3))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie\n        .slice(0, 2)\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: -0.1 })))\n        .concat(mocks.pie.slice(3))}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie\\n        .slice(0, 2)\\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: -0.1 })))\\n        .concat(mocks.pie.slice(3))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={showDebug} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showDebug = boolean('show table for debugging', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={showDebug} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={showDebug} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((s) => ({ ...s, exportVal: 0 }))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.map((s) => ({ ...s, exportVal: 0 }))}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((s) => ({ ...s, exportVal: 0 }))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: { maxCount: 15 },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.manyPie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.origin,\\n          nodeLabel: (d: Datum) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: {\n          linkLabel: { maxCount: 15 },\n        },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.manyPie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.origin,\n          nodeLabel: (d: Datum) => countryLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: { maxCount: 15 },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.manyPie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.origin,\\n          nodeLabel: (d: Datum) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      clockwiseSectors={false}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n      clockwiseSectors={false}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      clockwiseSectors={false}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      specialFirstInnermostSector={false}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n      specialFirstInnermostSector={false}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      specialFirstInnermostSector={false}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: {\\n            maximumSection: Infinity,\\n            textColor: boolean('custom linkLabel.textColor', true)\\n              ? color('linkLabel.textColor', 'rgba(0, 0, 0, 1)')\\n              : undefined,\\n          },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: {\n          linkLabel: {\n            maximumSection: Infinity,\n            textColor: boolean('custom linkLabel.textColor', true)\n              ? color('linkLabel.textColor', 'rgba(0, 0, 0, 1)')\n              : undefined,\n          },\n        },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: {\\n            maximumSection: Infinity,\\n            textColor: boolean('custom linkLabel.textColor', true)\\n              ? color('linkLabel.textColor', 'rgba(0, 0, 0, 1)')\\n              : undefined,\\n          },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: { maximumSection: Infinity, maxCount: 0 },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: {\n          linkLabel: { maximumSection: Infinity, maxCount: 0 },\n        },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: { maximumSection: Infinity, maxCount: 0 },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_26\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueGetter=\\\"percent\\\"\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      percentFormatter={(d: number) => `${Math.round((d + Number.EPSILON) * 100) / 100}%`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":56},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":56},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_26\"\n      data={mocks.miniSunburst}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueGetter=\"percent\"\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      percentFormatter={(d: number) => `${Math.round((d + Number.EPSILON) * 100) / 100}%`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: any) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_26\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueGetter=\\\"percent\\\"\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      percentFormatter={(d: number) => `${Math.round((d + Number.EPSILON) * 100) / 100}%`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n  PrimitiveValue,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? productLookup[d].name : ''),\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? regionLookup[d].regionName : ''),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? countryLookup[d].name : ''),\\n          showAccessor: (d: PrimitiveValue) => !(['chn', 'hkg', 'jpn', 'kor'] as PrimitiveValue[]).includes(d),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":57},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":57},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n  PrimitiveValue,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.miniSunburst}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? productLookup[d].name : ''),\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? regionLookup[d].regionName : ''),\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? countryLookup[d].name : ''),\n          showAccessor: (d: PrimitiveValue) => !(['chn', 'hkg', 'jpn', 'kor'] as PrimitiveValue[]).includes(d),\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? productLookup[d].name : ''),\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? regionLookup[d].regionName : ''),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? countryLookup[d].name : ''),\\n          showAccessor: (d: PrimitiveValue) => !(['chn', 'hkg', 'jpn', 'kor'] as PrimitiveValue[]).includes(d),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie\\n        .slice(0, 2)\\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: undefined as unknown as number })))\\n        .concat(mocks.pie.slice(3))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie\n        .slice(0, 2)\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: undefined as unknown as number })))\n        .concat(mocks.pie.slice(3))}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie\\n        .slice(0, 2)\\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: undefined as unknown as number })))\\n        .concat(mocks.pie.slice(3))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n  Color,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nconst getColorKnob = (prop: string, defaultColor: Color) =>\\n  boolean(`custom ${prop}`, false) ? color(prop, defaultColor) : undefined;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    background: {\\n      color: color('background.color', '#1c1c24'),\\n      fallbackColor: getColorKnob('background.fallbackColor', 'black'),\\n    },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 15,\\n        textColor: getColorKnob('linkLabel.textColor', 'white'),\\n      },\\n      fillLabel: {\\n        textColor: getColorKnob('fillLabel.textColor', 'white'),\\n      },\\n      sectorLineWidth: 1.2,\\n    },\\n  };\\n\\n  const fillColor = getColorKnob('shape.fillColor', 'blue');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.manyPie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.origin,\\n            nodeLabel: (d: Datum) => countryLookup[d].name,\\n            shape: {\\n              fillColor:\\n                fillColor ??\\n                ((key, sortIndex, node, tree) =>\\n                  indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree)),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  theme: { default: 'dark' },\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n  Color,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nconst getColorKnob = (prop: string, defaultColor: Color) =>\n  boolean(`custom ${prop}`, false) ? color(prop, defaultColor) : undefined;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    background: {\n      color: color('background.color', '#1c1c24'),\n      fallbackColor: getColorKnob('background.fallbackColor', 'black'),\n    },\n    partition: {\n      linkLabel: {\n        maxCount: 15,\n        textColor: getColorKnob('linkLabel.textColor', 'white'),\n      },\n      fillLabel: {\n        textColor: getColorKnob('fillLabel.textColor', 'white'),\n      },\n      sectorLineWidth: 1.2,\n    },\n  };\n\n  const fillColor = getColorKnob('shape.fillColor', 'blue');\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.manyPie}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.origin,\n            nodeLabel: (d: Datum) => countryLookup[d].name,\n            shape: {\n              fillColor:\n                fillColor ??\n                ((key, sortIndex, node, tree) =>\n                  indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree)),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  theme: { default: 'dark' },\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    background: {\\n      color: color('background.color', '#1c1c24'),\\n      fallbackColor: getColorKnob('background.fallbackColor', 'black'),\\n    },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 15,\\n        textColor: getColorKnob('linkLabel.textColor', 'white'),\\n      },\\n      fillLabel: {\\n        textColor: getColorKnob('fillLabel.textColor', 'white'),\\n      },\\n      sectorLineWidth: 1.2,\\n    },\\n  };\\n\\n  const fillColor = getColorKnob('shape.fillColor', 'blue');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.manyPie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.origin,\\n            nodeLabel: (d: Datum) => countryLookup[d].name,\\n            shape: {\\n              fillColor:\\n                fillColor ??\\n                ((key, sortIndex, node, tree) =>\\n                  indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree)),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, PartialTheme, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorTurbo, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementClick = boolean('onElementClick listener', true);\\n  const onElementOver = boolean('onElementOver listener', true);\\n  const theme: PartialTheme = {\\n    partition: {\\n      outerSizeRatio: 0.9,\\n      linkLabel: {\\n        fontStyle: 'italic',\\n        valueFont: { fontWeight: 900 },\\n        maxTextLength: number('maxTextLength', 20, { range: true, min: 1, max: 100 }),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\\n        onElementOver={onElementOver ? action('onElementOver') : undefined}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            fillLabel: {\\n              fontWeight: 100,\\n              fontStyle: 'italic',\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 900,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorTurbo(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, PartialTheme, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorTurbo, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementClick = boolean('onElementClick listener', true);\n  const onElementOver = boolean('onElementOver listener', true);\n  const theme: PartialTheme = {\n    partition: {\n      outerSizeRatio: 0.9,\n      linkLabel: {\n        fontStyle: 'italic',\n        valueFont: { fontWeight: 900 },\n        maxTextLength: number('maxTextLength', 20, { range: true, min: 1, max: 100 }),\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\n        onElementOver={onElementOver ? action('onElementOver') : undefined}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            fillLabel: {\n              fontWeight: 100,\n              fontStyle: 'italic',\n              valueFont: {\n                fontFamily: 'Menlo',\n                fontStyle: 'normal',\n                fontWeight: 900,\n              },\n            },\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorTurbo(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementClick = boolean('onElementClick listener', true);\\n  const onElementOver = boolean('onElementOver listener', true);\\n  const theme: PartialTheme = {\\n    partition: {\\n      outerSizeRatio: 0.9,\\n      linkLabel: {\\n        fontStyle: 'italic',\\n        valueFont: { fontWeight: 900 },\\n        maxTextLength: number('maxTextLength', 20, { range: true, min: 1, max: 100 }),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\\n        onElementOver={onElementOver ? action('onElementOver') : undefined}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            fillLabel: {\\n              fontWeight: 100,\\n              fontStyle: 'italic',\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 900,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorTurbo(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    partition: {\\n      linkLabel: { maximumSection: Infinity, maxCount: 0 },\\n      sectorLineWidth: 10,\\n      sectorLineStroke: color('sectorLineStroke', 'lightgrey'),\\n      outerSizeRatio: 1,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":59},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":59}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    partition: {\n      linkLabel: { maximumSection: Infinity, maxCount: 0 },\n      sectorLineWidth: 10,\n      sectorLineStroke: color('sectorLineStroke', 'lightgrey'),\n      outerSizeRatio: 1,\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    partition: {\\n      linkLabel: { maximumSection: Infinity, maxCount: 0 },\\n      sectorLineWidth: 10,\\n      sectorLineStroke: color('sectorLineStroke', 'lightgrey'),\\n      outerSizeRatio: 1,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, PartialTheme, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":24},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":24},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, PartialTheme, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          fillLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  CustomTooltip as CT,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { CHILDREN_KEY, entryValue, PARENT_KEY } from '@elastic/charts/src';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\\n\\nconst CustomTooltip: CT = ({ values }) => (\\n  <div\\n    style={{\\n      padding: 10,\\n      minHeight: 40,\\n      backgroundColor: 'blue',\\n      color: 'white',\\n    }}\\n  >\\n    My Custom Tooltip:\\n    <br />\\n    {values.map(({ label }) => label)}\\n  </div>\\n);\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 0.95,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip\\n        placement={customKnobs.enum.placement('Tooltip placement')}\\n        fallbackPlacements={customKnobs.enum.fallbackPlacements()}\\n        boundary={customKnobs.enum.boundary()}\\n        customTooltip={boolean('Custom Tooltip', false) ? CustomTooltip : undefined}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.sunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            fillLabel: {\\n              fontFamily: 'Impact',\\n              valueFormatter: (d: number) =>\\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\\\u00A0Tn`,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on the index of the fist children\\n                const rootTree = node[PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node[CHILDREN_KEY][0]));\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on their index\\n                const rootTree = node[PARENT_KEY][PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\\n\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":64},\"endLoc\":{\"col\":1,\"line\":115},\"startBody\":{\"col\":36,\"line\":64},\"endBody\":{\"col\":1,\"line\":115}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  CustomTooltip as CT,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n  Tooltip,\n} from '@elastic/charts';\nimport { CHILDREN_KEY, entryValue, PARENT_KEY } from '@elastic/charts/src';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\n\nconst CustomTooltip: CT = ({ values }) => (\n  <div\n    style={{\n      padding: 10,\n      minHeight: 40,\n      backgroundColor: 'blue',\n      color: 'white',\n    }}\n  >\n    My Custom Tooltip:\n    <br />\n    {values.map(({ label }) => label)}\n  </div>\n);\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 0.95,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} />\n      <Tooltip\n        placement={customKnobs.enum.placement('Tooltip placement')}\n        fallbackPlacements={customKnobs.enum.fallbackPlacements()}\n        boundary={customKnobs.enum.boundary()}\n        customTooltip={boolean('Custom Tooltip', false) ? CustomTooltip : undefined}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.sunburst}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (d: any) => regionLookup[d].regionName,\n            fillLabel: {\n              fontFamily: 'Impact',\n              valueFormatter: (d: number) =>\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\u00A0Tn`,\n            },\n            shape: {\n              fillColor: (key, sortIndex, node) => {\n                // concat all leaf and define the color based on the index of the fist children\n                const rootTree = node[PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node[CHILDREN_KEY][0]));\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\n              },\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node) => {\n                // concat all leaf and define the color based on their index\n                const rootTree = node[PARENT_KEY][PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\n\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\n              },\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip\\n        placement={customKnobs.enum.placement('Tooltip placement')}\\n        fallbackPlacements={customKnobs.enum.fallbackPlacements()}\\n        boundary={customKnobs.enum.boundary()}\\n        customTooltip={boolean('Custom Tooltip', false) ? CustomTooltip : undefined}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.sunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            fillLabel: {\\n              fontFamily: 'Impact',\\n              valueFormatter: (d: number) =>\\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\\\u00A0Tn`,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on the index of the fist children\\n                const rootTree = node[PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node[CHILDREN_KEY][0]));\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on their index\\n                const rootTree = node[PARENT_KEY][PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\\n\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AdditiveNumber,\\n  ArrayEntry,\\n  Chart,\\n  Datum,\\n  Partition,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { discreteColor, countryLookup, colorBrewerCategoricalPastel12B } from '../utils/utils';\\n\\nconst categoricalColors = colorBrewerCategoricalPastel12B.slice(3);\\n\\nconst data = [\\n  { region: 'Americas', dest: 'usa', other: false, exportVal: 553359100104 },\\n  { region: 'Americas', dest: 'Other', other: true, exportVal: 753359100104 },\\n  { region: 'Asia', dest: 'chn', other: false, exportVal: 392617281424 },\\n  { region: 'Asia', dest: 'jpn', other: false, exportVal: 177490158520 },\\n  { region: 'Asia', dest: 'kor', other: false, exportVal: 177421375512 },\\n  { region: 'Asia', dest: 'Other', other: true, exportVal: 277421375512 },\\n  { region: 'Europe', dest: 'deu', other: false, exportVal: 253250650864 },\\n  { region: 'Europe', dest: 'smr', other: false, exportVal: 135443006088 },\\n  { region: 'Europe', dest: 'Other', other: true, exportVal: 205443006088 },\\n  { region: 'Africa', dest: 'Other', other: true, exportVal: 305443006088 },\\n];\\n\\nconst sortPredicate = ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n  // unconditionally put \\\"Other\\\" to the end (as the \\\"Other\\\" slice may be larger than a regular slice, yet should be at the end)\\n  if (name1 === 'Other' && name2 !== 'Other') return 1;\\n  if (name2 === 'Other' && name1 !== 'Other') return -1;\\n\\n  // otherwise, use the decreasing value order\\n  return node2.value - node1.value;\\n};\\n\\n/* Equivalent, since math ops cleanly coerce false, true to 0, 1\\nconst sortPredicate = ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) =>\\n  (name1 === 'Other') - (name2 === 'Other') || node2.value - node1.value;\\n*/\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const sortPredicateEnabled = boolean('Move \\\"Other\\\" to end', true);\\n  const clockwiseSectors = boolean('clockwiseSectors', true);\\n  const specialFirstInnermostSector = boolean('specialFirstInnermostSector', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          partition: { outerSizeRatio: 0.96 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.region,\\n            nodeLabel: (d: any) => d,\\n            fillLabel: {\\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`,\\n              fontWeight: 600,\\n              fontStyle: 'italic',\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(categoricalColors)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\\n            sortPredicate: sortPredicateEnabled ? sortPredicate : null,\\n            fillLabel: {\\n              fontWeight: 600,\\n              fontStyle: 'italic',\\n              maxFontSize: 16,\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => discreteColor(categoricalColors, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n        clockwiseSectors={clockwiseSectors}\\n        specialFirstInnermostSector={specialFirstInnermostSector}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":55},\"endLoc\":{\"col\":1,\"line\":115},\"startBody\":{\"col\":36,\"line\":55},\"endBody\":{\"col\":1,\"line\":115}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AdditiveNumber,\n  ArrayEntry,\n  Chart,\n  Datum,\n  Partition,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { discreteColor, countryLookup, colorBrewerCategoricalPastel12B } from '../utils/utils';\n\nconst categoricalColors = colorBrewerCategoricalPastel12B.slice(3);\n\nconst data = [\n  { region: 'Americas', dest: 'usa', other: false, exportVal: 553359100104 },\n  { region: 'Americas', dest: 'Other', other: true, exportVal: 753359100104 },\n  { region: 'Asia', dest: 'chn', other: false, exportVal: 392617281424 },\n  { region: 'Asia', dest: 'jpn', other: false, exportVal: 177490158520 },\n  { region: 'Asia', dest: 'kor', other: false, exportVal: 177421375512 },\n  { region: 'Asia', dest: 'Other', other: true, exportVal: 277421375512 },\n  { region: 'Europe', dest: 'deu', other: false, exportVal: 253250650864 },\n  { region: 'Europe', dest: 'smr', other: false, exportVal: 135443006088 },\n  { region: 'Europe', dest: 'Other', other: true, exportVal: 205443006088 },\n  { region: 'Africa', dest: 'Other', other: true, exportVal: 305443006088 },\n];\n\nconst sortPredicate = ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\n  // unconditionally put \"Other\" to the end (as the \"Other\" slice may be larger than a regular slice, yet should be at the end)\n  if (name1 === 'Other' && name2 !== 'Other') return 1;\n  if (name2 === 'Other' && name1 !== 'Other') return -1;\n\n  // otherwise, use the decreasing value order\n  return node2.value - node1.value;\n};\n\n/* Equivalent, since math ops cleanly coerce false, true to 0, 1\nconst sortPredicate = ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) =>\n  (name1 === 'Other') - (name2 === 'Other') || node2.value - node1.value;\n*/\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const sortPredicateEnabled = boolean('Move \"Other\" to end', true);\n  const clockwiseSectors = boolean('clockwiseSectors', true);\n  const specialFirstInnermostSector = boolean('specialFirstInnermostSector', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          partition: { outerSizeRatio: 0.96 },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={data}\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.region,\n            nodeLabel: (d: any) => d,\n            fillLabel: {\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`,\n              fontWeight: 600,\n              fontStyle: 'italic',\n              valueFont: {\n                fontFamily: 'Menlo',\n                fontStyle: 'normal',\n                fontWeight: 100,\n              },\n            },\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(categoricalColors)(sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\n            sortPredicate: sortPredicateEnabled ? sortPredicate : null,\n            fillLabel: {\n              fontWeight: 600,\n              fontStyle: 'italic',\n              maxFontSize: 16,\n              valueFont: {\n                fontFamily: 'Menlo',\n                fontStyle: 'normal',\n                fontWeight: 100,\n              },\n            },\n            shape: {\n              fillColor: (key, sortIndex, node) => discreteColor(categoricalColors, 0.5)(node.parent.sortIndex),\n            },\n          },\n        ]}\n        clockwiseSectors={clockwiseSectors}\n        specialFirstInnermostSector={specialFirstInnermostSector}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const sortPredicateEnabled = boolean('Move \\\"Other\\\" to end', true);\\n  const clockwiseSectors = boolean('clockwiseSectors', true);\\n  const specialFirstInnermostSector = boolean('specialFirstInnermostSector', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          partition: { outerSizeRatio: 0.96 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.region,\\n            nodeLabel: (d: any) => d,\\n            fillLabel: {\\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`,\\n              fontWeight: 600,\\n              fontStyle: 'italic',\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(categoricalColors)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\\n            sortPredicate: sortPredicateEnabled ? sortPredicate : null,\\n            fillLabel: {\\n              fontWeight: 600,\\n              fontStyle: 'italic',\\n              maxFontSize: 16,\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => discreteColor(categoricalColors, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n        clockwiseSectors={clockwiseSectors}\\n        specialFirstInnermostSector={specialFirstInnermostSector}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { discreteColor, colorBrewerCategoricalPastel12, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.9 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            fontWeight: 100,\\n            fontStyle: 'italic',\\n            valueFont: {\\n              fontFamily: 'Menlo',\\n              fontStyle: 'normal',\\n              fontWeight: 900,\\n            },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { discreteColor, colorBrewerCategoricalPastel12, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { outerSizeRatio: 0.9 },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          fillLabel: {\n            fontWeight: 100,\n            fontStyle: 'italic',\n            valueFont: {\n              fontFamily: 'Menlo',\n              fontStyle: 'normal',\n              fontWeight: 900,\n            },\n          },\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.9 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            fontWeight: 100,\\n            fontStyle: 'italic',\\n            valueFont: {\\n              fontFamily: 'Menlo',\\n              fontStyle: 'normal',\\n              fontWeight: 900,\\n            },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 32,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 0.9,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":44},\"endLoc\":{\"col\":1,\"line\":65},\"startBody\":{\"col\":36,\"line\":44},\"endBody\":{\"col\":1,\"line\":65}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 32,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 0.9,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartPaddings: { left: 160 },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 32,\\n        fontSize: 14,\\n      },\\n      fontFamily: 'Arial',\\n      fillLabel: {\\n        fontStyle: 'italic',\\n      },\\n      minFontSize: 1,\\n      idealFontSizeJump: 1.1,\\n      outerSizeRatio: 0.9,\\n      // the `emptySizeRatio` prop controls the inner size of the donut\\n      emptySizeRatio: 0.4,\\n      circlePadding: 4,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    chartPaddings: { left: 160 },\n    partition: {\n      linkLabel: {\n        maxCount: 32,\n        fontSize: 14,\n      },\n      fontFamily: 'Arial',\n      fillLabel: {\n        fontStyle: 'italic',\n      },\n      minFontSize: 1,\n      idealFontSizeJump: 1.1,\n      outerSizeRatio: 0.9,\n      // the `emptySizeRatio` prop controls the inner size of the donut\n      emptySizeRatio: 0.4,\n      circlePadding: 4,\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartPaddings: { left: 160 },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 32,\\n        fontSize: 14,\\n      },\\n      fontFamily: 'Arial',\\n      fillLabel: {\\n        fontStyle: 'italic',\\n      },\\n      minFontSize: 1,\\n      idealFontSizeJump: 1.1,\\n      outerSizeRatio: 0.9,\\n      // the `emptySizeRatio` prop controls the inner size of the donut\\n      emptySizeRatio: 0.4,\\n      circlePadding: 4,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { linkLabel: { maximumSection: 10000 } },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { linkLabel: { maximumSection: 10000 } },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { linkLabel: { maximumSection: 10000 } },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description} size={{ height: 180 }}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      theme={{\\n        chartPaddings: { left: 160 },\\n      }}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((d, i) => ({ ...d, exportVal: i === 2 || i === 3 ? 0 : d.exportVal }))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description} size={{ height: 180 }}>\n    <Settings\n      baseTheme={useBaseTheme()}\n      theme={{\n        chartPaddings: { left: 160 },\n      }}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.map((d, i) => ({ ...d, exportVal: i === 2 || i === 3 ? 0 : d.exportVal }))}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description} size={{ height: 180 }}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      theme={{\\n        chartPaddings: { left: 160 },\\n      }}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((d, i) => ({ ...d, exportVal: i === 2 || i === 3 ? 0 : d.exportVal }))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  entryValue,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 0.95,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} debug={showDebug} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.sunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            fillLabel: {\\n              fontFamily: 'Impact',\\n              valueFormatter: (d: number) =>\\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\\\u00A0Tn`,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on the index of the fist children\\n                const rootTree = node.parent.children.flatMap((d) => entryValue(d).children);\\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node.children[0]));\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on their index\\n                const rootTree = node.parent.parent.children.flatMap((d) => entryValue(d).children);\\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":46},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":46},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  entryValue,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 0.95,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showDebug = boolean('show table for debugging', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} debug={showDebug} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.sunburst}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (d: any) => regionLookup[d].regionName,\n            fillLabel: {\n              fontFamily: 'Impact',\n              valueFormatter: (d: number) =>\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\u00A0Tn`,\n            },\n            shape: {\n              fillColor: (key, sortIndex, node) => {\n                // concat all leaf and define the color based on the index of the fist children\n                const rootTree = node.parent.children.flatMap((d) => entryValue(d).children);\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node.children[0]));\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\n              },\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node) => {\n                // concat all leaf and define the color based on their index\n                const rootTree = node.parent.parent.children.flatMap((d) => entryValue(d).children);\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\n              },\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} debug={showDebug} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.sunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            fillLabel: {\\n              fontFamily: 'Impact',\\n              valueFormatter: (d: number) =>\\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\\\u00A0Tn`,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on the index of the fist children\\n                const rootTree = node.parent.children.flatMap((d) => entryValue(d).children);\\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node.children[0]));\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on their index\\n                const rootTree = node.parent.parent.children.flatMap((d) => entryValue(d).children);\\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  discreteColor,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend legendStrategy=\\\"pathWithDescendants\\\" theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 1', true) },\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 2', true) },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":57},\"endLoc\":{\"col\":1,\"line\":96},\"startBody\":{\"col\":36,\"line\":57},\"endBody\":{\"col\":1,\"line\":96}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  discreteColor,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend legendStrategy=\"pathWithDescendants\" theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.miniSunburst}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 1', true) },\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 2', true) },\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend legendStrategy=\\\"pathWithDescendants\\\" theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 1', true) },\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 2', true) },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Sunburst',\n};\n\nexport { Example as mostBasic } from './1_simple.story';\nexport { Example as valueFormatted } from './2_value_formatted.story';\nexport { Example as valueFormattedWithCategoricalColorPalette } from './3_value_formatted_2.story';\nexport { Example as withFillLabels } from './4_fill_labels.story';\nexport { Example as donutChartWithFillLabels } from './5_donut.story';\nexport { Example as withDirectTextLabels } from './6_pie_chart_labels.story';\nexport { Example as withLinkedTextLabels } from './6_pie_chart_linked_labels.story';\nexport { Example as someZeroValueSlice } from './7_zero_slice.story';\nexport { Example as sunburstWithTwoLayers } from './8_sunburst_two_layers.story';\nexport { Example as sunburstWithThreeLayers } from './9_sunburst_three_layers.story';\n\nexport { Example as withTwoSlices } from './10_2_slice.story';\nexport { Example as largeAndSmallSlices } from './11_small_large.story';\nexport { Example as veryLargeAndSmall } from './12_very_small.story';\nexport { Example as nearFullNearEmpty } from './13_empty.story';\nexport { Example as fullAndZeroSlices } from './14_full_zero.story';\nexport { Example as singleSlice } from './15_single.story';\nexport { Example as singleSunburst } from './15_single_sunburst.story';\nexport { Example as singleSmallSice } from './16_single_small.story';\nexport { Example as singleVerySmall } from './17_single_very_small.story';\nexport { Example as noSlice } from './18_no_sliced.story';\nexport { Example as negative } from './19_negative.story';\n\nexport { Example as totalZero } from './20_total_zero.story';\nexport { Example as highNumberOfSlices } from './21_high_pie.story';\nexport { Example as counterClockwiseSpecial } from './22_counter_clockwise.story';\nexport { Example as clockwiseNoSpecial } from './23_clockwise.story';\nexport { Example as linkedLabelsOnly } from './24_linked_label.story';\nexport { Example as noLabels } from './25_no_labels.story';\nexport { Example as percentage } from './26_percentage.story';\nexport { Example as heterogeneous } from './27_heterogeneous_depth.story';\nexport { Example as notANumber } from './28_not_a_number.story';\nexport { Example as customStroke } from './29_custom_stroke.story';\nexport { Example as largestCircle } from './30_largest_circle.story';\nexport { Example as boldLinkValue } from './31_bold_link_value.story';\nexport { Example as customTooltip } from './32_custom_tooltip.story';\nexport { Example as orderedSlices } from './33_ordered_slices.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} showLegend />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} />\\n\\n      <LineSeries\\n        id=\\\"Sensor 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={[\\n          [0, 1],\\n          [1, 0.8],\\n          [2, 0.5],\\n          [3, 0.12],\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"Sensor 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={[\\n          [0, 1],\\n          [1, 0.8],\\n          [2, 0.76],\\n          [3, 0.12],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: 'Currently not correctly rendered due to [#1921](https://github.com/elastic/elastic-charts/issues/1921)',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} showLegend />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" position={Position.Left} />\n\n      <LineSeries\n        id=\"Sensor 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={[\n          [0, 1],\n          [1, 0.8],\n          [2, 0.5],\n          [3, 0.12],\n        ]}\n      />\n      <LineSeries\n        id=\"Sensor 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={[\n          [0, 1],\n          [1, 0.8],\n          [2, 0.76],\n          [3, 0.12],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: 'Currently not correctly rendered due to [#1921](https://github.com/elastic/elastic-charts/issues/1921)',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} showLegend />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} />\\n\\n      <LineSeries\\n        id=\\\"Sensor 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={[\\n          [0, 1],\\n          [1, 0.8],\\n          [2, 0.5],\\n          [3, 0.12],\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"Sensor 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={[\\n          [0, 1],\\n          [1, 0.8],\\n          [2, 0.76],\\n          [3, 0.12],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui';\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport React, { FC } from 'react';\\n\\nimport { Chart, Settings, Axis, Position } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst NoResults: FC<{ msg: string }> = ({ msg }) => (\\n  <EuiFlexItem>\\n    <EuiFlexGroup gutterSize=\\\"s\\\" direction=\\\"column\\\" alignItems=\\\"center\\\" justifyContent=\\\"center\\\">\\n      <EuiIcon type=\\\"visualizeApp\\\" />\\n      <p>{msg}</p>\\n    </EuiFlexGroup>\\n  </EuiFlexItem>\\n);\\n\\n/**\\n * Should render no data value\\n */\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customNoResults = boolean('Show custom no results', true);\\n  const noResultsMsg = text('Custom No Results message', 'No Results');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Axis id=\\\"count\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <Settings noResults={customNoResults ? <NoResults msg={noResultsMsg} /> : undefined} baseTheme={useBaseTheme()} />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":41},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":41}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui';\nimport { boolean, text } from '@storybook/addon-knobs';\nimport React, { FC } from 'react';\n\nimport { Chart, Settings, Axis, Position } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst NoResults: FC<{ msg: string }> = ({ msg }) => (\n  <EuiFlexItem>\n    <EuiFlexGroup gutterSize=\"s\" direction=\"column\" alignItems=\"center\" justifyContent=\"center\">\n      <EuiIcon type=\"visualizeApp\" />\n      <p>{msg}</p>\n    </EuiFlexGroup>\n  </EuiFlexItem>\n);\n\n/**\n * Should render no data value\n */\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customNoResults = boolean('Show custom no results', true);\n  const noResultsMsg = text('Custom No Results message', 'No Results');\n\n  return (\n    <Chart title={title} description={description}>\n      <Axis id=\"count\" title=\"count\" position={Position.Left} />\n      <Axis id=\"x\" title=\"goods\" position={Position.Bottom} />\n      <Settings noResults={customNoResults ? <NoResults msg={noResultsMsg} /> : undefined} baseTheme={useBaseTheme()} />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customNoResults = boolean('Show custom no results', true);\\n  const noResultsMsg = text('Custom No Results message', 'No Results');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Axis id=\\\"count\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <Settings noResults={customNoResults ? <NoResults msg={noResultsMsg} /> : undefined} baseTheme={useBaseTheme()} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  LineSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  ScaleType,\\n  Settings,\\n  Position,\\n  HistogramBarSeries,\\n  niceTimeFormatter,\\n} from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator('chart');\\nconst start = Date.parse('2023-07-01T00:00:00.000Z').valueOf();\\nconst interval = 1000 * 60 * 5;\\nconst data = Array.from({ length: 20 }, (d, i) => {\\n  return [start + interval * i, Math.floor(rng(2, 10))];\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customDomain = boolean('custom domain', false);\\n  const startTimeSlider = number('start time', 0, { min: 0, max: 20, range: true, step: 0.2 });\\n  const rangeSlider = number('end time', 19, { min: 1, max: 25, range: true, step: 0.2 });\\n  const subtract = boolean('subtract 1ms', false);\\n\\n  const tickFormat = (d: number) => new Date(d).toISOString();\\n  const xDomain = customDomain\\n    ? { min: start + interval * startTimeSlider, max: start + interval * rangeSlider - (subtract ? 1 : 0) }\\n    : undefined;\\n  const domain: [number, number] = [xDomain?.min ?? data[0][0] ?? 0, xDomain?.max ?? data.at(-1)?.[0] ?? 0];\\n  const limitedData = data\\n    .filter((d) => d[0] <= (xDomain?.max ?? Infinity))\\n    .map((d, i) => [d[0], i === 10 ? null : d[1]]);\\n\\n  return (\\n    <>\\n      <p>\\n        {xDomain ? 'configured' : 'data'} domain: {new Date(domain[0]).toISOString()} to{' '}\\n        {new Date(domain[1]).toISOString()}\\n      </p>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          showLegend\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0,\\n            },\\n            barSeriesStyle: {\\n              rectBorder: {\\n                visible: true,\\n                strokeWidth: 0,\\n                stroke: 'white',\\n              },\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          tickFormat={tickFormat}\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'left' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <HistogramBarSeries\\n          id=\\\"Area\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n          color=\\\"#FF6666\\\"\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegend\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          tickFormat={tickFormat}\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'left' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <LineSeries\\n          id=\\\"Line\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          showLegend\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0.2,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'center' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n          tickFormat={(d) => niceTimeFormatter(domain)(d, { timeZone: 'UTC' })}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <BarSeries\\n          id=\\\"Categorical\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    height: '100%',\\n    maxHeight: '100%',\\n    overflow: 'hidden',\\n    resize: 'none',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":213},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":213}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  LineSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  ScaleType,\n  Settings,\n  Position,\n  HistogramBarSeries,\n  niceTimeFormatter,\n} from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator('chart');\nconst start = Date.parse('2023-07-01T00:00:00.000Z').valueOf();\nconst interval = 1000 * 60 * 5;\nconst data = Array.from({ length: 20 }, (d, i) => {\n  return [start + interval * i, Math.floor(rng(2, 10))];\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customDomain = boolean('custom domain', false);\n  const startTimeSlider = number('start time', 0, { min: 0, max: 20, range: true, step: 0.2 });\n  const rangeSlider = number('end time', 19, { min: 1, max: 25, range: true, step: 0.2 });\n  const subtract = boolean('subtract 1ms', false);\n\n  const tickFormat = (d: number) => new Date(d).toISOString();\n  const xDomain = customDomain\n    ? { min: start + interval * startTimeSlider, max: start + interval * rangeSlider - (subtract ? 1 : 0) }\n    : undefined;\n  const domain: [number, number] = [xDomain?.min ?? data[0][0] ?? 0, xDomain?.max ?? data.at(-1)?.[0] ?? 0];\n  const limitedData = data\n    .filter((d) => d[0] <= (xDomain?.max ?? Infinity))\n    .map((d, i) => [d[0], i === 10 ? null : d[1]]);\n\n  return (\n    <>\n      <p>\n        {xDomain ? 'configured' : 'data'} domain: {new Date(domain[0]).toISOString()} to{' '}\n        {new Date(domain[1]).toISOString()}\n      </p>\n      <Chart title={title} description={description} size={['100%', 250]}>\n        <Settings\n          baseTheme={useBaseTheme()}\n          showLegend\n          legendPosition={{\n            floatingColumns: 1,\n            floating: true,\n            direction: 'vertical',\n            hAlign: 'right',\n            vAlign: 'top',\n          }}\n          showLegendExtra\n          xDomain={xDomain}\n          theme={{\n            scales: {\n              histogramPadding: 0,\n              barsPadding: 0,\n            },\n            barSeriesStyle: {\n              rectBorder: {\n                visible: true,\n                strokeWidth: 0,\n                stroke: 'white',\n              },\n            },\n          }}\n        />\n        <Axis\n          id=\"x\"\n          tickFormat={tickFormat}\n          position={Position.Bottom}\n          gridLine={{ visible: true }}\n          timeAxisLayerCount={2}\n          style={{\n            tickLabel: {\n              alignment: { horizontal: 'left' },\n              padding: 0,\n            },\n            tickLine: {\n              visible: true,\n              padding: 0,\n              size: 5,\n            },\n          }}\n        />\n        <Axis id=\"y\" position={Position.Left} gridLine={{ visible: true }} />\n        <HistogramBarSeries\n          id=\"Area\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={limitedData}\n          timeZone=\"UTC\"\n          color=\"#FF6666\"\n        />\n      </Chart>\n      <Chart title={title} description={description} size={['100%', 250]}>\n        <Settings\n          baseTheme={useBaseTheme()}\n          legendPosition={{\n            floatingColumns: 1,\n            floating: true,\n            direction: 'vertical',\n            hAlign: 'right',\n            vAlign: 'top',\n          }}\n          showLegend\n          showLegendExtra\n          xDomain={xDomain}\n          theme={{\n            scales: {\n              histogramPadding: 0,\n              barsPadding: 0,\n            },\n          }}\n        />\n        <Axis\n          id=\"x\"\n          tickFormat={tickFormat}\n          position={Position.Bottom}\n          gridLine={{ visible: true }}\n          timeAxisLayerCount={2}\n          style={{\n            tickLabel: {\n              alignment: { horizontal: 'left' },\n              padding: 0,\n            },\n            tickLine: {\n              visible: true,\n              padding: 0,\n              size: 5,\n            },\n          }}\n        />\n        <Axis id=\"y\" position={Position.Left} gridLine={{ visible: true }} />\n        <LineSeries\n          id=\"Line\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={limitedData}\n          timeZone=\"UTC\"\n        />\n      </Chart>\n      <Chart title={title} description={description} size={['100%', 250]}>\n        <Settings\n          baseTheme={useBaseTheme()}\n          showLegend\n          legendPosition={{\n            floatingColumns: 1,\n            floating: true,\n            direction: 'vertical',\n            hAlign: 'right',\n            vAlign: 'top',\n          }}\n          showLegendExtra\n          xDomain={xDomain}\n          theme={{\n            scales: {\n              histogramPadding: 0,\n              barsPadding: 0.2,\n            },\n          }}\n        />\n        <Axis\n          id=\"x\"\n          position={Position.Bottom}\n          gridLine={{ visible: true }}\n          timeAxisLayerCount={2}\n          style={{\n            tickLabel: {\n              alignment: { horizontal: 'center' },\n              padding: 0,\n            },\n            tickLine: {\n              visible: true,\n              padding: 0,\n              size: 5,\n            },\n          }}\n          tickFormat={(d) => niceTimeFormatter(domain)(d, { timeZone: 'UTC' })}\n        />\n        <Axis id=\"y\" position={Position.Left} gridLine={{ visible: true }} />\n        <BarSeries\n          id=\"Categorical\"\n          xScaleType={ScaleType.Ordinal}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={limitedData}\n          timeZone=\"UTC\"\n        />\n      </Chart>\n    </>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    height: '100%',\n    maxHeight: '100%',\n    overflow: 'hidden',\n    resize: 'none',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customDomain = boolean('custom domain', false);\\n  const startTimeSlider = number('start time', 0, { min: 0, max: 20, range: true, step: 0.2 });\\n  const rangeSlider = number('end time', 19, { min: 1, max: 25, range: true, step: 0.2 });\\n  const subtract = boolean('subtract 1ms', false);\\n\\n  const tickFormat = (d: number) => new Date(d).toISOString();\\n  const xDomain = customDomain\\n    ? { min: start + interval * startTimeSlider, max: start + interval * rangeSlider - (subtract ? 1 : 0) }\\n    : undefined;\\n  const domain: [number, number] = [xDomain?.min ?? data[0][0] ?? 0, xDomain?.max ?? data.at(-1)?.[0] ?? 0];\\n  const limitedData = data\\n    .filter((d) => d[0] <= (xDomain?.max ?? Infinity))\\n    .map((d, i) => [d[0], i === 10 ? null : d[1]]);\\n\\n  return (\\n    <>\\n      <p>\\n        {xDomain ? 'configured' : 'data'} domain: {new Date(domain[0]).toISOString()} to{' '}\\n        {new Date(domain[1]).toISOString()}\\n      </p>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          showLegend\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0,\\n            },\\n            barSeriesStyle: {\\n              rectBorder: {\\n                visible: true,\\n                strokeWidth: 0,\\n                stroke: 'white',\\n              },\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          tickFormat={tickFormat}\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'left' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <HistogramBarSeries\\n          id=\\\"Area\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n          color=\\\"#FF6666\\\"\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegend\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          tickFormat={tickFormat}\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'left' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <LineSeries\\n          id=\\\"Line\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          showLegend\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0.2,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'center' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n          tickFormat={(d) => niceTimeFormatter(domain)(d, { timeZone: 'UTC' })}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <BarSeries\\n          id=\\\"Categorical\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    { g: 'css', x: 1614092400000, y: 13 },\\n    { g: 'css', x: 1614103200000, y: 17 },\\n    { g: 'css', x: 1614114000000, y: 9 },\\n    { g: 'css', x: 1614124800000, y: 3 },\\n    { g: 'css', x: 1614135600000, y: 1 },\\n    { g: 'css', x: 1614146400000, y: 0 },\\n    { g: 'css', x: 1614157200000, y: 0 },\\n    { g: 'css', x: 1614168000000, y: 4 },\\n    { g: 'css', x: 1614178800000, y: 14 },\\n    { g: 'css', x: 1614189600000, y: 6 },\\n    { g: 'css', x: 1614200400000, y: 8 },\\n    { g: 'css', x: 1614211200000, y: 2 },\\n    { g: 'css', x: 1614222000000, y: 1 },\\n    { g: 'css', x: 1614232800000, y: 0 },\\n    { g: 'css', x: 1614243600000, y: 0 },\\n    { g: 'css', x: 1614254400000, y: 3 },\\n    { g: 'css', x: 1614265200000, y: 11 },\\n    { g: 'css', x: 1614276000000, y: null },\\n    { g: 'css', x: 1614286800000, y: 6 },\\n    { g: 'css', x: 1614297600000, y: 3 },\\n    { g: 'css', x: 1614308400000, y: 0 },\\n    { g: 'css', x: 1614319200000, y: 0 },\\n    { g: 'css', x: 1614330000000, y: 2 },\\n    { g: 'css', x: 1614340800000, y: 3 },\\n    { g: 'css', x: 1614351600000, y: 6 },\\n    { g: 'gz', x: 1614092400000, y: 15 },\\n    { g: 'gz', x: 1614103200000, y: 16 },\\n    { g: 'gz', x: 1614114000000, y: 7 },\\n    { g: 'gz', x: 1614124800000, y: 4 },\\n    { g: 'gz', x: 1614135600000, y: 1 },\\n    { g: 'gz', x: 1614146400000, y: 0 },\\n    { g: 'gz', x: 1614157200000, y: 1 },\\n    { g: 'gz', x: 1614168000000, y: 6 },\\n    { g: 'gz', x: 1614178800000, y: 9 },\\n    { g: 'gz', x: 1614189600000, y: 5 },\\n    { g: 'gz', x: 1614200400000, y: 6 },\\n    { g: 'gz', x: 1614211200000, y: 7 },\\n    { g: 'gz', x: 1614222000000, y: 1 },\\n    { g: 'gz', x: 1614232800000, y: 0 },\\n    { g: 'gz', x: 1614243600000, y: 2 },\\n    { g: 'gz', x: 1614254400000, y: 4 },\\n    { g: 'gz', x: 1614265200000, y: 20 },\\n    { g: 'gz', x: 1614276000000, y: null },\\n    { g: 'gz', x: 1614286800000, y: 12 },\\n    { g: 'gz', x: 1614297600000, y: 3 },\\n    { g: 'gz', x: 1614308400000, y: 0 },\\n    { g: 'gz', x: 1614319200000, y: 0 },\\n    { g: 'gz', x: 1614330000000, y: 2 },\\n    { g: 'gz', x: 1614340800000, y: 3 },\\n    { g: 'gz', x: 1614351600000, y: 9 },\\n  ].map((d) => ({ ...d, x: moment(d.x).valueOf() }));\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <AreaSeries\\n        id=\\\"test3\\\"\\n        stackMode=\\\"percentage\\\"\\n        xScaleType=\\\"time\\\"\\n        yScaleType={ScaleType.Linear}\\n        stackAccessors={['yes']}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":87},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":87}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment';\nimport React from 'react';\n\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    { g: 'css', x: 1614092400000, y: 13 },\n    { g: 'css', x: 1614103200000, y: 17 },\n    { g: 'css', x: 1614114000000, y: 9 },\n    { g: 'css', x: 1614124800000, y: 3 },\n    { g: 'css', x: 1614135600000, y: 1 },\n    { g: 'css', x: 1614146400000, y: 0 },\n    { g: 'css', x: 1614157200000, y: 0 },\n    { g: 'css', x: 1614168000000, y: 4 },\n    { g: 'css', x: 1614178800000, y: 14 },\n    { g: 'css', x: 1614189600000, y: 6 },\n    { g: 'css', x: 1614200400000, y: 8 },\n    { g: 'css', x: 1614211200000, y: 2 },\n    { g: 'css', x: 1614222000000, y: 1 },\n    { g: 'css', x: 1614232800000, y: 0 },\n    { g: 'css', x: 1614243600000, y: 0 },\n    { g: 'css', x: 1614254400000, y: 3 },\n    { g: 'css', x: 1614265200000, y: 11 },\n    { g: 'css', x: 1614276000000, y: null },\n    { g: 'css', x: 1614286800000, y: 6 },\n    { g: 'css', x: 1614297600000, y: 3 },\n    { g: 'css', x: 1614308400000, y: 0 },\n    { g: 'css', x: 1614319200000, y: 0 },\n    { g: 'css', x: 1614330000000, y: 2 },\n    { g: 'css', x: 1614340800000, y: 3 },\n    { g: 'css', x: 1614351600000, y: 6 },\n    { g: 'gz', x: 1614092400000, y: 15 },\n    { g: 'gz', x: 1614103200000, y: 16 },\n    { g: 'gz', x: 1614114000000, y: 7 },\n    { g: 'gz', x: 1614124800000, y: 4 },\n    { g: 'gz', x: 1614135600000, y: 1 },\n    { g: 'gz', x: 1614146400000, y: 0 },\n    { g: 'gz', x: 1614157200000, y: 1 },\n    { g: 'gz', x: 1614168000000, y: 6 },\n    { g: 'gz', x: 1614178800000, y: 9 },\n    { g: 'gz', x: 1614189600000, y: 5 },\n    { g: 'gz', x: 1614200400000, y: 6 },\n    { g: 'gz', x: 1614211200000, y: 7 },\n    { g: 'gz', x: 1614222000000, y: 1 },\n    { g: 'gz', x: 1614232800000, y: 0 },\n    { g: 'gz', x: 1614243600000, y: 2 },\n    { g: 'gz', x: 1614254400000, y: 4 },\n    { g: 'gz', x: 1614265200000, y: 20 },\n    { g: 'gz', x: 1614276000000, y: null },\n    { g: 'gz', x: 1614286800000, y: 12 },\n    { g: 'gz', x: 1614297600000, y: 3 },\n    { g: 'gz', x: 1614308400000, y: 0 },\n    { g: 'gz', x: 1614319200000, y: 0 },\n    { g: 'gz', x: 1614330000000, y: 2 },\n    { g: 'gz', x: 1614340800000, y: 3 },\n    { g: 'gz', x: 1614351600000, y: 9 },\n  ].map((d) => ({ ...d, x: moment(d.x).valueOf() }));\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <AreaSeries\n        id=\"test3\"\n        stackMode=\"percentage\"\n        xScaleType=\"time\"\n        yScaleType={ScaleType.Linear}\n        stackAccessors={['yes']}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    { g: 'css', x: 1614092400000, y: 13 },\\n    { g: 'css', x: 1614103200000, y: 17 },\\n    { g: 'css', x: 1614114000000, y: 9 },\\n    { g: 'css', x: 1614124800000, y: 3 },\\n    { g: 'css', x: 1614135600000, y: 1 },\\n    { g: 'css', x: 1614146400000, y: 0 },\\n    { g: 'css', x: 1614157200000, y: 0 },\\n    { g: 'css', x: 1614168000000, y: 4 },\\n    { g: 'css', x: 1614178800000, y: 14 },\\n    { g: 'css', x: 1614189600000, y: 6 },\\n    { g: 'css', x: 1614200400000, y: 8 },\\n    { g: 'css', x: 1614211200000, y: 2 },\\n    { g: 'css', x: 1614222000000, y: 1 },\\n    { g: 'css', x: 1614232800000, y: 0 },\\n    { g: 'css', x: 1614243600000, y: 0 },\\n    { g: 'css', x: 1614254400000, y: 3 },\\n    { g: 'css', x: 1614265200000, y: 11 },\\n    { g: 'css', x: 1614276000000, y: null },\\n    { g: 'css', x: 1614286800000, y: 6 },\\n    { g: 'css', x: 1614297600000, y: 3 },\\n    { g: 'css', x: 1614308400000, y: 0 },\\n    { g: 'css', x: 1614319200000, y: 0 },\\n    { g: 'css', x: 1614330000000, y: 2 },\\n    { g: 'css', x: 1614340800000, y: 3 },\\n    { g: 'css', x: 1614351600000, y: 6 },\\n    { g: 'gz', x: 1614092400000, y: 15 },\\n    { g: 'gz', x: 1614103200000, y: 16 },\\n    { g: 'gz', x: 1614114000000, y: 7 },\\n    { g: 'gz', x: 1614124800000, y: 4 },\\n    { g: 'gz', x: 1614135600000, y: 1 },\\n    { g: 'gz', x: 1614146400000, y: 0 },\\n    { g: 'gz', x: 1614157200000, y: 1 },\\n    { g: 'gz', x: 1614168000000, y: 6 },\\n    { g: 'gz', x: 1614178800000, y: 9 },\\n    { g: 'gz', x: 1614189600000, y: 5 },\\n    { g: 'gz', x: 1614200400000, y: 6 },\\n    { g: 'gz', x: 1614211200000, y: 7 },\\n    { g: 'gz', x: 1614222000000, y: 1 },\\n    { g: 'gz', x: 1614232800000, y: 0 },\\n    { g: 'gz', x: 1614243600000, y: 2 },\\n    { g: 'gz', x: 1614254400000, y: 4 },\\n    { g: 'gz', x: 1614265200000, y: 20 },\\n    { g: 'gz', x: 1614276000000, y: null },\\n    { g: 'gz', x: 1614286800000, y: 12 },\\n    { g: 'gz', x: 1614297600000, y: 3 },\\n    { g: 'gz', x: 1614308400000, y: 0 },\\n    { g: 'gz', x: 1614319200000, y: 0 },\\n    { g: 'gz', x: 1614330000000, y: 2 },\\n    { g: 'gz', x: 1614340800000, y: 3 },\\n    { g: 'gz', x: 1614351600000, y: 9 },\\n  ].map((d) => ({ ...d, x: moment(d.x).valueOf() }));\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <AreaSeries\\n        id=\\\"test3\\\"\\n        stackMode=\\\"percentage\\\"\\n        xScaleType=\\\"time\\\"\\n        yScaleType={ScaleType.Linear}\\n        stackAccessors={['yes']}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  LineAnnotationDatum,\\n  Chart,\\n  LineAnnotation,\\n  BarSeries,\\n  ScaleType,\\n  Position,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const markerPositionHorizontal = select(\\n    'horizontal marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const markerPositionVertical = select(\\n    'vertical marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const chartRotation = customKnobs.enum.rotation();\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={chartRotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        domainType={AnnotationDomainType.XDomain}\\n        id=\\\"ann\\\"\\n        dataValues={[{ dataValue: 'bags' }]}\\n        marker={<div style={{ background: 'red' }}>Vertical</div>}\\n        markerPosition={markerPositionVertical === 'undefined' ? undefined : markerPositionVertical}\\n      />\\n      <LineAnnotation\\n        domainType={AnnotationDomainType.YDomain}\\n        id=\\\"ann1\\\"\\n        dataValues={generateAnnotationData([30])}\\n        marker={<div style={{ background: 'yellow' }}>Horizontal</div>}\\n        markerPosition={markerPositionHorizontal === 'undefined' ? undefined : markerPositionHorizontal}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'trousers', y: 390, val: 1222 },\\n          { x: 'watches', y: 23, val: 1222 },\\n          { x: 'bags', y: 750, val: 1222 },\\n          { x: 'cocktail dresses', y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":75},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":75}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  LineAnnotationDatum,\n  Chart,\n  LineAnnotation,\n  BarSeries,\n  ScaleType,\n  Position,\n  Settings,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const markerPositionHorizontal = select(\n    'horizontal marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const markerPositionVertical = select(\n    'vertical marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const chartRotation = customKnobs.enum.rotation();\n  return (\n    <Chart title={title} description={description}>\n      <Settings rotation={chartRotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        domainType={AnnotationDomainType.XDomain}\n        id=\"ann\"\n        dataValues={[{ dataValue: 'bags' }]}\n        marker={<div style={{ background: 'red' }}>Vertical</div>}\n        markerPosition={markerPositionVertical === 'undefined' ? undefined : markerPositionVertical}\n      />\n      <LineAnnotation\n        domainType={AnnotationDomainType.YDomain}\n        id=\"ann1\"\n        dataValues={generateAnnotationData([30])}\n        marker={<div style={{ background: 'yellow' }}>Horizontal</div>}\n        markerPosition={markerPositionHorizontal === 'undefined' ? undefined : markerPositionHorizontal}\n      />\n      <BarSeries\n        id=\"bars\"\n        name=\"amount\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'trousers', y: 390, val: 1222 },\n          { x: 'watches', y: 23, val: 1222 },\n          { x: 'bags', y: 750, val: 1222 },\n          { x: 'cocktail dresses', y: 854, val: 1222 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const markerPositionHorizontal = select(\\n    'horizontal marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const markerPositionVertical = select(\\n    'vertical marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const chartRotation = customKnobs.enum.rotation();\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={chartRotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        domainType={AnnotationDomainType.XDomain}\\n        id=\\\"ann\\\"\\n        dataValues={[{ dataValue: 'bags' }]}\\n        marker={<div style={{ background: 'red' }}>Vertical</div>}\\n        markerPosition={markerPositionVertical === 'undefined' ? undefined : markerPositionVertical}\\n      />\\n      <LineAnnotation\\n        domainType={AnnotationDomainType.YDomain}\\n        id=\\\"ann1\\\"\\n        dataValues={generateAnnotationData([30])}\\n        marker={<div style={{ background: 'yellow' }}>Horizontal</div>}\\n        markerPosition={markerPositionHorizontal === 'undefined' ? undefined : markerPositionHorizontal}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'trousers', y: 390, val: 1222 },\\n          { x: 'watches', y: 23, val: 1222 },\\n          { x: 'bags', y: 750, val: 1222 },\\n          { x: 'cocktail dresses', y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Axis, Position, AreaSeries, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { logFormatter } from '../utils/formatters';\\n\\n/**\\n * Should filter out zero values when fitting domain\\n */\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fit = boolean('fit', true);\\n  const logMinLimit = number('logMinLimit', 0.001);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"count\\\"\\n        position={Position.Left}\\n        domain={{ min: NaN, max: NaN, fit, logMinLimit }}\\n        tickFormat={logFormatter(10)}\\n      />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} maximumFractionDigits={0} />\\n      <AreaSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Log}\\n        areaSeriesStyle={{ point: { visible: true } }}\\n        data={[\\n          { x: 1, y: 100 },\\n          { x: 2, y: 0 },\\n          { x: 3, y: 10 },\\n          { x: 4, y: 0 },\\n          { x: 5, y: 1 },\\n          { x: 6, y: 0 },\\n          { x: 7, y: 0.01 },\\n          { x: 8, y: 0 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":55},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":55}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Axis, Position, AreaSeries, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { logFormatter } from '../utils/formatters';\n\n/**\n * Should filter out zero values when fitting domain\n */\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fit = boolean('fit', true);\n  const logMinLimit = number('logMinLimit', 0.001);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"count\"\n        position={Position.Left}\n        domain={{ min: NaN, max: NaN, fit, logMinLimit }}\n        tickFormat={logFormatter(10)}\n      />\n      <Axis id=\"x\" position={Position.Bottom} maximumFractionDigits={0} />\n      <AreaSeries\n        id=\"bars\"\n        name=\"amount\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Log}\n        areaSeriesStyle={{ point: { visible: true } }}\n        data={[\n          { x: 1, y: 100 },\n          { x: 2, y: 0 },\n          { x: 3, y: 10 },\n          { x: 4, y: 0 },\n          { x: 5, y: 1 },\n          { x: 6, y: 0 },\n          { x: 7, y: 0.01 },\n          { x: 8, y: 0 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fit = boolean('fit', true);\\n  const logMinLimit = number('logMinLimit', 0.001);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"count\\\"\\n        position={Position.Left}\\n        domain={{ min: NaN, max: NaN, fit, logMinLimit }}\\n        tickFormat={logFormatter(10)}\\n      />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} maximumFractionDigits={0} />\\n      <AreaSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Log}\\n        areaSeriesStyle={{ point: { visible: true } }}\\n        data={[\\n          { x: 1, y: 100 },\\n          { x: 2, y: 0 },\\n          { x: 3, y: 10 },\\n          { x: 4, y: 0 },\\n          { x: 5, y: 1 },\\n          { x: 6, y: 0 },\\n          { x: 7, y: 0.01 },\\n          { x: 8, y: 0 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Axis, Position, BarSeries, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst data = [\\n  { g: 'AE', x: '2021-04-06 00:00', y: 1 },\\n  { g: 'AE', x: '2021-04-06 03:00', y: 0 },\\n  { g: 'AF', x: '2021-04-07 06:00', y: 1 },\\n  { g: 'AF', x: '2021-04-07 09:00', y: 0 },\\n  { g: 'AM', x: '2021-04-10 09:00', y: 1 },\\n  { g: 'AO', x: '2021-04-07 09:00', y: 1 },\\n  { g: 'AO', x: '2021-04-07 12:00', y: 0 },\\n  { g: 'AR', x: '2021-04-07 03:00', y: 1 },\\n  { g: 'AR', x: '2021-04-07 06:00', y: 0 },\\n  { g: 'AT', x: '2021-04-12 03:00', y: 1 },\\n  { g: 'AU', x: '2021-04-06 09:00', y: 1 },\\n  { g: 'AU', x: '2021-04-06 12:00', y: 0 },\\n  { g: 'AZ', x: '2021-04-10 15:00', y: 1 },\\n  { g: 'AZ', x: '2021-04-10 18:00', y: 0 },\\n  { g: 'BA', x: '2021-04-09 06:00', y: 1 },\\n  { g: 'BA', x: '2021-04-09 09:00', y: 0 },\\n  { g: 'BD', x: '2021-04-06 03:00', y: 3 },\\n  { g: 'BD', x: '2021-04-06 06:00', y: 2 },\\n  { g: 'BD', x: '2021-04-06 09:00', y: 1 },\\n  { g: 'BD', x: '2021-04-06 12:00', y: 0 },\\n  { g: 'BE', x: '2021-04-07 06:00', y: 1 },\\n  { g: 'BF', x: '2021-04-09 09:00', y: 1 },\\n  { g: 'BJ', x: '2021-04-07 15:00', y: 1 },\\n  { g: 'BJ', x: '2021-04-07 18:00', y: 0 },\\n  { g: 'BO', x: '2021-04-07 06:00', y: 1 },\\n  { g: 'BO', x: '2021-04-07 09:00', y: 0 },\\n  { g: 'BR', x: '2021-04-06 03:00', y: 3 },\\n  { g: 'BR', x: '2021-04-06 06:00', y: 0 },\\n  { g: 'BR', x: '2021-04-06 09:00', y: 2 },\\n  { g: 'BR', x: '2021-04-06 12:00', y: 1 },\\n  { g: 'BR', x: '2021-04-06 15:00', y: 0 },\\n  { g: 'BW', x: '2021-04-06 03:00', y: 1 },\\n  { g: 'BY', x: '2021-04-08 06:00', y: 1 },\\n  { g: 'CA', x: '2021-04-07 09:00', y: 1 },\\n  { g: 'CA', x: '2021-04-07 12:00', y: 0 },\\n  { g: 'CA', x: '2021-04-08 06:00', y: 0 },\\n  { g: 'CA', x: '2021-04-08 09:00', y: 2 },\\n  { g: 'CA', x: '2021-04-08 12:00', y: 0 },\\n  { g: 'CD', x: '2021-04-07 03:00', y: 1 },\\n  { g: 'CD', x: '2021-04-07 06:00', y: 1 },\\n  { g: 'CD', x: '2021-04-07 09:00', y: 1 },\\n  { g: 'CD', x: '2021-04-07 12:00', y: 0 },\\n  { g: 'CG', x: '2021-04-12 06:00', y: 1 },\\n];\\n\\n/**\\n * Should filter out zero values when fitting domain\\n */\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} maximumFractionDigits={0} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":65},\"endLoc\":{\"col\":1,\"line\":83},\"startBody\":{\"col\":36,\"line\":65},\"endBody\":{\"col\":1,\"line\":83}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Axis, Position, BarSeries, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst data = [\n  { g: 'AE', x: '2021-04-06 00:00', y: 1 },\n  { g: 'AE', x: '2021-04-06 03:00', y: 0 },\n  { g: 'AF', x: '2021-04-07 06:00', y: 1 },\n  { g: 'AF', x: '2021-04-07 09:00', y: 0 },\n  { g: 'AM', x: '2021-04-10 09:00', y: 1 },\n  { g: 'AO', x: '2021-04-07 09:00', y: 1 },\n  { g: 'AO', x: '2021-04-07 12:00', y: 0 },\n  { g: 'AR', x: '2021-04-07 03:00', y: 1 },\n  { g: 'AR', x: '2021-04-07 06:00', y: 0 },\n  { g: 'AT', x: '2021-04-12 03:00', y: 1 },\n  { g: 'AU', x: '2021-04-06 09:00', y: 1 },\n  { g: 'AU', x: '2021-04-06 12:00', y: 0 },\n  { g: 'AZ', x: '2021-04-10 15:00', y: 1 },\n  { g: 'AZ', x: '2021-04-10 18:00', y: 0 },\n  { g: 'BA', x: '2021-04-09 06:00', y: 1 },\n  { g: 'BA', x: '2021-04-09 09:00', y: 0 },\n  { g: 'BD', x: '2021-04-06 03:00', y: 3 },\n  { g: 'BD', x: '2021-04-06 06:00', y: 2 },\n  { g: 'BD', x: '2021-04-06 09:00', y: 1 },\n  { g: 'BD', x: '2021-04-06 12:00', y: 0 },\n  { g: 'BE', x: '2021-04-07 06:00', y: 1 },\n  { g: 'BF', x: '2021-04-09 09:00', y: 1 },\n  { g: 'BJ', x: '2021-04-07 15:00', y: 1 },\n  { g: 'BJ', x: '2021-04-07 18:00', y: 0 },\n  { g: 'BO', x: '2021-04-07 06:00', y: 1 },\n  { g: 'BO', x: '2021-04-07 09:00', y: 0 },\n  { g: 'BR', x: '2021-04-06 03:00', y: 3 },\n  { g: 'BR', x: '2021-04-06 06:00', y: 0 },\n  { g: 'BR', x: '2021-04-06 09:00', y: 2 },\n  { g: 'BR', x: '2021-04-06 12:00', y: 1 },\n  { g: 'BR', x: '2021-04-06 15:00', y: 0 },\n  { g: 'BW', x: '2021-04-06 03:00', y: 1 },\n  { g: 'BY', x: '2021-04-08 06:00', y: 1 },\n  { g: 'CA', x: '2021-04-07 09:00', y: 1 },\n  { g: 'CA', x: '2021-04-07 12:00', y: 0 },\n  { g: 'CA', x: '2021-04-08 06:00', y: 0 },\n  { g: 'CA', x: '2021-04-08 09:00', y: 2 },\n  { g: 'CA', x: '2021-04-08 12:00', y: 0 },\n  { g: 'CD', x: '2021-04-07 03:00', y: 1 },\n  { g: 'CD', x: '2021-04-07 06:00', y: 1 },\n  { g: 'CD', x: '2021-04-07 09:00', y: 1 },\n  { g: 'CD', x: '2021-04-07 12:00', y: 0 },\n  { g: 'CG', x: '2021-04-12 06:00', y: 1 },\n];\n\n/**\n * Should filter out zero values when fitting domain\n */\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend baseTheme={useBaseTheme()} />\n      <Axis id=\"count\" position={Position.Left} />\n      <Axis id=\"time\" position={Position.Bottom} maximumFractionDigits={0} />\n      <BarSeries\n        id=\"bars\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['g']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} maximumFractionDigits={0} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const automatedSeries = boolean('Use the default generated series types of charts for screen readers', true);\\n  const customDescriptionForScreenReaders = text('add a description for screen readers', '');\\n  const customLabelForScreenReaders = text('add a label for screen readers', '');\\n  const headingLevelForScreenReaders = customLabelForScreenReaders\\n    ? select('heading level for label', { P: 'p', H1: 'h1', H2: 'h2', H3: 'h3', H4: 'h4', H5: 'h5', H6: 'h6' }, 'h2')\\n    : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        ariaDescription={customDescriptionForScreenReaders}\\n        ariaUseDefaultSummary={automatedSeries}\\n        ariaLabel={customLabelForScreenReaders}\\n        ariaLabelHeadingLevel={headingLevelForScreenReaders}\\n      />\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const automatedSeries = boolean('Use the default generated series types of charts for screen readers', true);\n  const customDescriptionForScreenReaders = text('add a description for screen readers', '');\n  const customLabelForScreenReaders = text('add a label for screen readers', '');\n  const headingLevelForScreenReaders = customLabelForScreenReaders\n    ? select('heading level for label', { P: 'p', H1: 'h1', H2: 'h2', H3: 'h3', H4: 'h4', H5: 'h5', H6: 'h6' }, 'h2')\n    : undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        ariaDescription={customDescriptionForScreenReaders}\n        ariaUseDefaultSummary={automatedSeries}\n        ariaLabel={customLabelForScreenReaders}\n        ariaLabelHeadingLevel={headingLevelForScreenReaders}\n      />\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const automatedSeries = boolean('Use the default generated series types of charts for screen readers', true);\\n  const customDescriptionForScreenReaders = text('add a description for screen readers', '');\\n  const customLabelForScreenReaders = text('add a label for screen readers', '');\\n  const headingLevelForScreenReaders = customLabelForScreenReaders\\n    ? select('heading level for label', { P: 'p', H1: 'h1', H2: 'h2', H3: 'h3', H4: 'h4', H5: 'h5', H6: 'h6' }, 'h2')\\n    : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        ariaDescription={customDescriptionForScreenReaders}\\n        ariaUseDefaultSummary={automatedSeries}\\n        ariaLabel={customLabelForScreenReaders}\\n        ariaLabelHeadingLevel={headingLevelForScreenReaders}\\n      />\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  SeriesType,\\n  BarSeries,\\n  Axis,\\n  Position,\\n  ScaleType,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getColorPicker } from '../utils/components/get_color_picker';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const lang = select(\\n    'rtl language',\\n    {\\n      Hebrew: 'HE',\\n      Arabic: 'AR',\\n    },\\n    'HE',\\n  );\\n  const charSet = select(\\n    'character set',\\n    {\\n      'Right to Left': 'rtl',\\n      'Left to Right': 'ltr',\\n      'Mostly RTL': 'mostly-rtl',\\n      'Mostly LTR': 'mostly-ltr',\\n    },\\n    'rtl',\\n  );\\n  const type = select(\\n    'Chart type',\\n    {\\n      Bar: SeriesType.Bar,\\n      Treemap: PartitionLayout.treemap,\\n      Sunburst: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.treemap,\\n  );\\n  const showLegend = boolean('show legend', true);\\n\\n  const mixedIndices = new Set(['0', '2', '3']);\\n  const valueGetter = {\\n    rtl: (key: string) => productLookup[key][`name${lang}`],\\n    ltr: (key: string) => productLookup[key].name,\\n    'mostly-rtl': (key: string) => {\\n      if (mixedIndices.has(key)) return productLookup[key].name;\\n      return productLookup[key][`name${lang}`];\\n    },\\n    'mostly-ltr': (key: string) => {\\n      if (mixedIndices.has(key)) return productLookup[key][`name${lang}`];\\n      return productLookup[key].name;\\n    },\\n  }[charSet];\\n  const formatter = (d: any) => numeral(d).format('0.0 a');\\n\\n  const renderSeries = () =>\\n    type === SeriesType.Bar ? (\\n      <>\\n        <Axis id=\\\"x\\\" position={Position.Bottom} tickFormat={formatter} />\\n        <Axis id=\\\"y\\\" position={Position.Left} />\\n        <BarSeries\\n          id=\\\"bar\\\"\\n          data={mocks.pie}\\n          xScaleType={ScaleType.Ordinal}\\n          xAccessor={({ sitc1 }) => valueGetter(sitc1)}\\n          yAccessors={[(d: Datum) => d.exportVal]}\\n          splitSeriesAccessors={[({ sitc1 }) => valueGetter(sitc1)]}\\n        />\\n      </>\\n    ) : (\\n      <Partition\\n        id=\\\"partition\\\"\\n        data={mocks.pie}\\n        layout={type}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={formatter}\\n        clockwiseSectors={type === PartitionLayout.sunburst && boolean('clockwiseSectors', true)}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => valueGetter(d),\\n            fillLabel: {\\n              valueFormatter: formatter,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={type === SeriesType.Bar ? 90 : 0}\\n        debugState\\n        showLegend={showLegend}\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendColorPicker={getColorPicker('leftCenter')}\\n      />\\n      {renderSeries()}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  SeriesType,\n  BarSeries,\n  Axis,\n  Position,\n  ScaleType,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getColorPicker } from '../utils/components/get_color_picker';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const lang = select(\n    'rtl language',\n    {\n      Hebrew: 'HE',\n      Arabic: 'AR',\n    },\n    'HE',\n  );\n  const charSet = select(\n    'character set',\n    {\n      'Right to Left': 'rtl',\n      'Left to Right': 'ltr',\n      'Mostly RTL': 'mostly-rtl',\n      'Mostly LTR': 'mostly-ltr',\n    },\n    'rtl',\n  );\n  const type = select(\n    'Chart type',\n    {\n      Bar: SeriesType.Bar,\n      Treemap: PartitionLayout.treemap,\n      Sunburst: PartitionLayout.sunburst,\n    },\n    PartitionLayout.treemap,\n  );\n  const showLegend = boolean('show legend', true);\n\n  const mixedIndices = new Set(['0', '2', '3']);\n  const valueGetter = {\n    rtl: (key: string) => productLookup[key][`name${lang}`],\n    ltr: (key: string) => productLookup[key].name,\n    'mostly-rtl': (key: string) => {\n      if (mixedIndices.has(key)) return productLookup[key].name;\n      return productLookup[key][`name${lang}`];\n    },\n    'mostly-ltr': (key: string) => {\n      if (mixedIndices.has(key)) return productLookup[key][`name${lang}`];\n      return productLookup[key].name;\n    },\n  }[charSet];\n  const formatter = (d: any) => numeral(d).format('0.0 a');\n\n  const renderSeries = () =>\n    type === SeriesType.Bar ? (\n      <>\n        <Axis id=\"x\" position={Position.Bottom} tickFormat={formatter} />\n        <Axis id=\"y\" position={Position.Left} />\n        <BarSeries\n          id=\"bar\"\n          data={mocks.pie}\n          xScaleType={ScaleType.Ordinal}\n          xAccessor={({ sitc1 }) => valueGetter(sitc1)}\n          yAccessors={[(d: Datum) => d.exportVal]}\n          splitSeriesAccessors={[({ sitc1 }) => valueGetter(sitc1)]}\n        />\n      </>\n    ) : (\n      <Partition\n        id=\"partition\"\n        data={mocks.pie}\n        layout={type}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={formatter}\n        clockwiseSectors={type === PartitionLayout.sunburst && boolean('clockwiseSectors', true)}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => valueGetter(d),\n            fillLabel: {\n              valueFormatter: formatter,\n            },\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        rotation={type === SeriesType.Bar ? 90 : 0}\n        debugState\n        showLegend={showLegend}\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendColorPicker={getColorPicker('leftCenter')}\n      />\n      {renderSeries()}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const lang = select(\\n    'rtl language',\\n    {\\n      Hebrew: 'HE',\\n      Arabic: 'AR',\\n    },\\n    'HE',\\n  );\\n  const charSet = select(\\n    'character set',\\n    {\\n      'Right to Left': 'rtl',\\n      'Left to Right': 'ltr',\\n      'Mostly RTL': 'mostly-rtl',\\n      'Mostly LTR': 'mostly-ltr',\\n    },\\n    'rtl',\\n  );\\n  const type = select(\\n    'Chart type',\\n    {\\n      Bar: SeriesType.Bar,\\n      Treemap: PartitionLayout.treemap,\\n      Sunburst: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.treemap,\\n  );\\n  const showLegend = boolean('show legend', true);\\n\\n  const mixedIndices = new Set(['0', '2', '3']);\\n  const valueGetter = {\\n    rtl: (key: string) => productLookup[key][`name${lang}`],\\n    ltr: (key: string) => productLookup[key].name,\\n    'mostly-rtl': (key: string) => {\\n      if (mixedIndices.has(key)) return productLookup[key].name;\\n      return productLookup[key][`name${lang}`];\\n    },\\n    'mostly-ltr': (key: string) => {\\n      if (mixedIndices.has(key)) return productLookup[key][`name${lang}`];\\n      return productLookup[key].name;\\n    },\\n  }[charSet];\\n  const formatter = (d: any) => numeral(d).format('0.0 a');\\n\\n  const renderSeries = () =>\\n    type === SeriesType.Bar ? (\\n      <>\\n        <Axis id=\\\"x\\\" position={Position.Bottom} tickFormat={formatter} />\\n        <Axis id=\\\"y\\\" position={Position.Left} />\\n        <BarSeries\\n          id=\\\"bar\\\"\\n          data={mocks.pie}\\n          xScaleType={ScaleType.Ordinal}\\n          xAccessor={({ sitc1 }) => valueGetter(sitc1)}\\n          yAccessors={[(d: Datum) => d.exportVal]}\\n          splitSeriesAccessors={[({ sitc1 }) => valueGetter(sitc1)]}\\n        />\\n      </>\\n    ) : (\\n      <Partition\\n        id=\\\"partition\\\"\\n        data={mocks.pie}\\n        layout={type}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={formatter}\\n        clockwiseSectors={type === PartitionLayout.sunburst && boolean('clockwiseSectors', true)}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => valueGetter(d),\\n            fillLabel: {\\n              valueFormatter: formatter,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={type === SeriesType.Bar ? 90 : 0}\\n        debugState\\n        showLegend={showLegend}\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendColorPicker={getColorPicker('leftCenter')}\\n      />\\n      {renderSeries()}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, LineSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const typeOfSeries = select('series type', ['line', 'area'], 'area');\\n  const showY0Accessor = typeOfSeries === 'area' ? boolean('show y0Accessor', false) : null;\\n\\n  const data = [\\n    [1, 1],\\n    [2, -3],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, -3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: -2,\\n          max: NaN,\\n        }}\\n      />\\n      {typeOfSeries === 'line' ? (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data}\\n        />\\n      ) : (\\n        <AreaSeries\\n          id=\\\"areas\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          y0Accessors={showY0Accessor ? [([, y]) => y - 1] : undefined}\\n          data={data}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, LineSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const typeOfSeries = select('series type', ['line', 'area'], 'area');\n  const showY0Accessor = typeOfSeries === 'area' ? boolean('show y0Accessor', false) : null;\n\n  const data = [\n    [1, 1],\n    [2, -3],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, -3],\n    [8, 2],\n    [9, 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          min: -2,\n          max: NaN,\n        }}\n      />\n      {typeOfSeries === 'line' ? (\n        <LineSeries\n          id=\"lines\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data}\n        />\n      ) : (\n        <AreaSeries\n          id=\"areas\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          y0Accessors={showY0Accessor ? [([, y]) => y - 1] : undefined}\n          data={data}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const typeOfSeries = select('series type', ['line', 'area'], 'area');\\n  const showY0Accessor = typeOfSeries === 'area' ? boolean('show y0Accessor', false) : null;\\n\\n  const data = [\\n    [1, 1],\\n    [2, -3],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, -3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: -2,\\n          max: NaN,\\n        }}\\n      />\\n      {typeOfSeries === 'line' ? (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data}\\n        />\\n      ) : (\\n        <AreaSeries\\n          id=\\\"areas\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          y0Accessors={showY0Accessor ? [([, y]) => y - 1] : undefined}\\n          data={data}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Partition, PartitionLayout, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        baseTheme={useBaseTheme()}\\n        legendStrategy=\\\"nodeWithDescendants\\\"\\n        legendMaxDepth={1} // testing this option\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[{ g1: 1, g2: 'a', v: 2 }]}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d) => d.v}\\n        layers={[\\n          {\\n            groupByRollup: (d: any) => d.g1,\\n            nodeLabel: () => 'Testing a super duper really long legend',\\n            shape: {\\n              fillColor: () => '#90E0EF',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: any) => d.g2,\\n            nodeLabel: () => 'Testing a super duper really long legend',\\n            shape: {\\n              fillColor: () => '#00B4D8',\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Partition, PartitionLayout, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        baseTheme={useBaseTheme()}\n        legendStrategy=\"nodeWithDescendants\"\n        legendMaxDepth={1} // testing this option\n      />\n      <Partition\n        id=\"spec_1\"\n        data={[{ g1: 1, g2: 'a', v: 2 }]}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d) => d.v}\n        layers={[\n          {\n            groupByRollup: (d: any) => d.g1,\n            nodeLabel: () => 'Testing a super duper really long legend',\n            shape: {\n              fillColor: () => '#90E0EF',\n            },\n          },\n          {\n            groupByRollup: (d: any) => d.g2,\n            nodeLabel: () => 'Testing a super duper really long legend',\n            shape: {\n              fillColor: () => '#00B4D8',\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        baseTheme={useBaseTheme()}\\n        legendStrategy=\\\"nodeWithDescendants\\\"\\n        legendMaxDepth={1} // testing this option\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[{ g1: 1, g2: 'a', v: 2 }]}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d) => d.v}\\n        layers={[\\n          {\\n            groupByRollup: (d: any) => d.g1,\\n            nodeLabel: () => 'Testing a super duper really long legend',\\n            shape: {\\n              fillColor: () => '#90E0EF',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: any) => d.g2,\\n            nodeLabel: () => 'Testing a super duper really long legend',\\n            shape: {\\n              fillColor: () => '#00B4D8',\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Test Cases',\n};\n\nexport { Example as noSeries } from './1_no_series.story';\nexport { Example as chromePathBugFix } from './2_chrome_path_bug_fix.story';\nexport { Example as noAxesAnnotationBugFix } from './3_no_axes_annotation.story';\nexport { Example as filterZerosInLogFitDomain } from './4_filter_zero_values_log.story';\nexport { Example as legendScrollBarSizing } from './5_legend_scroll_bar_sizing.story';\nexport { Example as accessibilityCustomizations } from './6_a11y_custom_description.story';\nexport { Example as rtlText } from './7_rtl_text.story';\nexport { Example as testPointsOutsideOfDomain } from './8_test_points_outside_of_domain.story';\nexport { Example as duplicateLabelsInPartitionLegend } from './9_duplicate_labels_in_partition_legend.story';\nexport { Example as highlighterZIndex } from './10_highlighter_z_index.story';\nexport { Example as domainEdges } from './21_domain_edges.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Timeslip, Settings, GetData } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst getData = (dataDemand: Parameters<GetData>[0]) => {\\n  const from = dataDemand.lo?.minimum ?? NaN;\\n  const to = dataDemand.hi?.supremum ?? NaN;\\n  const binWidthMs = (dataDemand.lo?.supremum ?? NaN) - from;\\n  const result = [];\\n  let time = from;\\n  while (time < to) {\\n    result.push({\\n      epochMs: (time + 0.5 * binWidthMs) * 1000,\\n      value:\\n        8 * Math.sin(time / 100000000) +\\n        4 * Math.sin(time / 1000000) +\\n        2 * Math.sin(time / 10000) +\\n        Math.sin(time / 100) +\\n        0.5 * Math.sin(time) +\\n        0.25 * Math.sin(time * 100) +\\n        0.125 * Math.sin(time * 10000),\\n    });\\n    time += binWidthMs;\\n  }\\n  return result;\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  // fixing width and height at multiples of 256 for now\\n  return (\\n    <Chart title={title} description={description} size={{ width: 1024, height: 512 }}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Timeslip id=\\\"spec_1\\\" getData={getData} />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":39},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":39},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Timeslip, Settings, GetData } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst getData = (dataDemand: Parameters<GetData>[0]) => {\n  const from = dataDemand.lo?.minimum ?? NaN;\n  const to = dataDemand.hi?.supremum ?? NaN;\n  const binWidthMs = (dataDemand.lo?.supremum ?? NaN) - from;\n  const result = [];\n  let time = from;\n  while (time < to) {\n    result.push({\n      epochMs: (time + 0.5 * binWidthMs) * 1000,\n      value:\n        8 * Math.sin(time / 100000000) +\n        4 * Math.sin(time / 1000000) +\n        2 * Math.sin(time / 10000) +\n        Math.sin(time / 100) +\n        0.5 * Math.sin(time) +\n        0.25 * Math.sin(time * 100) +\n        0.125 * Math.sin(time * 10000),\n    });\n    time += binWidthMs;\n  }\n  return result;\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  // fixing width and height at multiples of 256 for now\n  return (\n    <Chart title={title} description={description} size={{ width: 1024, height: 512 }}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Timeslip id=\"spec_1\" getData={getData} />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  // fixing width and height at multiples of 256 for now\\n  return (\\n    <Chart title={title} description={description} size={{ width: 1024, height: 512 }}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Timeslip id=\\\"spec_1\\\" getData={getData} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Timeslip (@alpha)',\n};\n\nexport { Example as timeslipPrototype } from './01_timeslip.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  countryLookup,\\n  indexInterpolatedFillColor,\\n  interpolatorCET2s,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst countries = mocks.sunburst\\n  .map((d: any) => d.dest)\\n  .filter(keepDistinct)\\n  .sort()\\n  .reverse();\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 36,\\n    idealFontSizeJump: 1.01,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            fontFamily: 'Helvetica',\\n            textColor: 'black',\\n            fontWeight: 900,\\n            minFontSize: 2,\\n            maxFontSize: 20,\\n            idealFontSizeJump: 1.01,\\n            maximizeFontSize: boolean('Maximize font size layer 1', true),\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n            minFontSize: 2,\\n            maxFontSize: 10,\\n            idealFontSizeJump: 1.01,\\n            maximizeFontSize: boolean('Maximize font size layer 2', true),\\n          },\\n          shape: {\\n            fillColor: 'rgba(0, 0, 0, 0.07)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key) =>\\n              // pick color by country\\n              indexInterpolatedFillColor(interpolatorCET2s(0.5))(null, countries.indexOf(key), countries),\\n          },\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":49},\"endLoc\":{\"col\":1,\"line\":106},\"startBody\":{\"col\":36,\"line\":49},\"endBody\":{\"col\":1,\"line\":106}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  countryLookup,\n  indexInterpolatedFillColor,\n  interpolatorCET2s,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst countries = mocks.sunburst\n  .map((d: any) => d.dest)\n  .filter(keepDistinct)\n  .sort()\n  .reverse();\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 36,\n    idealFontSizeJump: 1.01,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            fontFamily: 'Helvetica',\n            textColor: 'black',\n            fontWeight: 900,\n            minFontSize: 2,\n            maxFontSize: 20,\n            idealFontSizeJump: 1.01,\n            maximizeFontSize: boolean('Maximize font size layer 1', true),\n          },\n          shape: { fillColor: 'rgba(0,0,0,0)' },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'black',\n            fontWeight: 200,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\n            minFontSize: 2,\n            maxFontSize: 10,\n            idealFontSizeJump: 1.01,\n            maximizeFontSize: boolean('Maximize font size layer 2', true),\n          },\n          shape: {\n            fillColor: 'rgba(0, 0, 0, 0.07)',\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          shape: {\n            fillColor: (key) =>\n              // pick color by country\n              indexInterpolatedFillColor(interpolatorCET2s(0.5))(null, countries.indexOf(key), countries),\n          },\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            fontFamily: 'Helvetica',\\n            textColor: 'black',\\n            fontWeight: 900,\\n            minFontSize: 2,\\n            maxFontSize: 20,\\n            idealFontSizeJump: 1.01,\\n            maximizeFontSize: boolean('Maximize font size layer 1', true),\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n            minFontSize: 2,\\n            maxFontSize: 10,\\n            idealFontSizeJump: 1.01,\\n            maximizeFontSize: boolean('Maximize font size layer 2', true),\\n          },\\n          shape: {\\n            fillColor: 'rgba(0, 0, 0, 0.07)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key) =>\\n              // pick color by country\\n              indexInterpolatedFillColor(interpolatorCET2s(0.5))(null, countries.indexOf(key), countries),\\n          },\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debugState baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings debugState baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n          },\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debugState baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, defaultPartitionValueFormatter, Partition, PartitionLayout, Settings } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { colorBrewerCategoricalPastel12, discreteColor, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const layout = select(\\n    'partitionLayout',\\n    {\\n      Treemap: PartitionLayout.treemap,\\n      Sunburst: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.treemap,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            fillLabel: {\\n              textColor: boolean('custom fillLabel.textColor', false)\\n                ? color('fillLabel.textColor', 'rgba(0, 0, 0, 1)')\\n                : undefined,\\n            },\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={layout}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            fillLabel: {\\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n              valueFont: {\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, defaultPartitionValueFormatter, Partition, PartitionLayout, Settings } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { colorBrewerCategoricalPastel12, discreteColor, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const layout = select(\n    'partitionLayout',\n    {\n      Treemap: PartitionLayout.treemap,\n      Sunburst: PartitionLayout.sunburst,\n    },\n    PartitionLayout.treemap,\n  );\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        theme={{\n          partition: {\n            fillLabel: {\n              textColor: boolean('custom fillLabel.textColor', false)\n                ? color('fillLabel.textColor', 'rgba(0, 0, 0, 1)')\n                : undefined,\n            },\n          },\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        layout={layout}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            fillLabel: {\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n              valueFont: {\n                fontWeight: 100,\n              },\n            },\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const layout = select(\\n    'partitionLayout',\\n    {\\n      Treemap: PartitionLayout.treemap,\\n      Sunburst: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.treemap,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            fillLabel: {\\n              textColor: boolean('custom fillLabel.textColor', false)\\n                ? color('fillLabel.textColor', 'rgba(0, 0, 0, 1)')\\n                : undefined,\\n            },\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={layout}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            fillLabel: {\\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n              valueFont: {\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 84,\\n    idealFontSizeJump: 1.15,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            fontFamily: 'Helvetica',\\n            textColor: 'grey',\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'small-caps',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":80},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":80}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 84,\n    idealFontSizeJump: 1.15,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            fontFamily: 'Helvetica',\n            textColor: 'grey',\n          },\n          shape: { fillColor: 'rgba(0,0,0,0)' },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'black',\n            fontWeight: 200,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            fontVariant: 'small-caps',\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\n              return interpolatorTurbo()(\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\n                  (node.parent.parent.children.length + 1),\n              );\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            fontFamily: 'Helvetica',\\n            textColor: 'grey',\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'small-caps',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, interpolatorTurbo, productLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 84,\\n    idealFontSizeJump: 1.05,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            fontFamily: 'Helvetica',\\n            textColor: 'grey',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0, 0, 0, 0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 100,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'normal',\\n            valueFont: {\\n              fontWeight: 100,\\n            },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":84},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":84}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, interpolatorTurbo, productLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 84,\n    idealFontSizeJump: 1.05,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\n          fillLabel: {\n            valueFormatter: () => '',\n            fontFamily: 'Helvetica',\n            textColor: 'grey',\n          },\n          shape: {\n            fillColor: 'rgba(0, 0, 0, 0)',\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'black',\n            fontWeight: 100,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            fontVariant: 'normal',\n            valueFont: {\n              fontWeight: 100,\n            },\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\n              return interpolatorTurbo()(\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\n                  (node.parent.parent.children.length + 1),\n              );\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            fontFamily: 'Helvetica',\\n            textColor: 'grey',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0, 0, 0, 0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 100,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'normal',\\n            valueFont: {\\n              fontWeight: 100,\\n            },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  CHILDREN_KEY,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 84,\\n    idealFontSizeJump: 1.05,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      topGroove={0}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            textColor: 'black',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0,0,0,0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'rgba(60,60,60,1)',\\n            fontWeight: 100,\\n            fontStyle: 'normal',\\n            fontFamily: 'Din Condensed',\\n            fontVariant: 'normal',\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(\\n                null,\\n                node.parent.sortIndex,\\n                node.parent.parent[CHILDREN_KEY],\\n              ),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":36},\"endLoc\":{\"col\":1,\"line\":81},\"startBody\":{\"col\":36,\"line\":36},\"endBody\":{\"col\":1,\"line\":81}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  CHILDREN_KEY,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 84,\n    idealFontSizeJump: 1.05,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      topGroove={0}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            valueFormatter: () => '',\n            textColor: 'black',\n          },\n          shape: {\n            fillColor: 'rgba(0,0,0,0)',\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'rgba(60,60,60,1)',\n            fontWeight: 100,\n            fontStyle: 'normal',\n            fontFamily: 'Din Condensed',\n            fontVariant: 'normal',\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              indexInterpolatedFillColor(interpolatorCET2s())(\n                null,\n                node.parent.sortIndex,\n                node.parent.parent[CHILDREN_KEY],\n              ),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      topGroove={0}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            textColor: 'black',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0,0,0,0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'rgba(60,60,60,1)',\\n            fontWeight: 100,\\n            fontStyle: 'normal',\\n            fontFamily: 'Din Condensed',\\n            fontVariant: 'normal',\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(\\n                null,\\n                node.parent.sortIndex,\\n                node.parent.parent[CHILDREN_KEY],\\n              ),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 8,\\n    maxFontSize: 14,\\n    idealFontSizeJump: 1.05,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            textColor: 'black',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0,0,0,0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'rgba(60,60,60,1)',\\n            fontWeight: 600,\\n            fontStyle: 'normal',\\n            fontFamily: 'Courier New',\\n            fontVariant: 'normal',\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              const model = node.parent;\\n              const root = model.parent;\\n              const siblingCountLayer1 = root.children.length;\\n              const i = model.sortIndex;\\n              const shade = Math.pow(0.3 + 0.5 * (i / (siblingCountLayer1 - 1)), 1 / 3);\\n              return `rgb(${Math.round(255 * shade)},${Math.round(255 * shade)},${Math.round(255 * shade)})`;\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":81},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":81}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 8,\n    maxFontSize: 14,\n    idealFontSizeJump: 1.05,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            valueFormatter: () => '',\n            textColor: 'black',\n          },\n          shape: {\n            fillColor: 'rgba(0,0,0,0)',\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'rgba(60,60,60,1)',\n            fontWeight: 600,\n            fontStyle: 'normal',\n            fontFamily: 'Courier New',\n            fontVariant: 'normal',\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              const model = node.parent;\n              const root = model.parent;\n              const siblingCountLayer1 = root.children.length;\n              const i = model.sortIndex;\n              const shade = Math.pow(0.3 + 0.5 * (i / (siblingCountLayer1 - 1)), 1 / 3);\n              return `rgb(${Math.round(255 * shade)},${Math.round(255 * shade)},${Math.round(255 * shade)})`;\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            textColor: 'black',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0,0,0,0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'rgba(60,60,60,1)',\\n            fontWeight: 600,\\n            fontStyle: 'normal',\\n            fontFamily: 'Courier New',\\n            fontVariant: 'normal',\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              const model = node.parent;\\n              const root = model.parent;\\n              const siblingCountLayer1 = root.children.length;\\n              const i = model.sortIndex;\\n              const shade = Math.pow(0.3 + 0.5 * (i / (siblingCountLayer1 - 1)), 1 / 3);\\n              return `rgb(${Math.round(255 * shade)},${Math.round(255 * shade)},${Math.round(255 * shade)})`;\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, PartialTheme, Partition, PartitionLayout, Settings } from '@elastic/charts';\\nimport {\\n  defaultPartitionValueFormatter,\\n  percentValueGetter,\\n} from '@elastic/charts/src/chart_types/partition_chart/layout/config';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 84,\\n    idealFontSizeJump: 1.15,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_7\\\"\\n      data={mocks.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      layout={PartitionLayout.treemap}\\n      valueGetter={percentValueGetter}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            fontFamily: 'Helvetica',\\n            textColor: 'black',\\n            fontWeight: 100,\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'small-caps',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":76},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":76}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, PartialTheme, Partition, PartitionLayout, Settings } from '@elastic/charts';\nimport {\n  defaultPartitionValueFormatter,\n  percentValueGetter,\n} from '@elastic/charts/src/chart_types/partition_chart/layout/config';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 84,\n    idealFontSizeJump: 1.15,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_7\"\n      data={mocks.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      layout={PartitionLayout.treemap}\n      valueGetter={percentValueGetter}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            fontFamily: 'Helvetica',\n            textColor: 'black',\n            fontWeight: 100,\n          },\n          shape: { fillColor: 'rgba(0,0,0,0)' },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            textColor: 'black',\n            fontWeight: 200,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            fontVariant: 'small-caps',\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\n              return interpolatorTurbo()(\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\n                  (node.parent.parent.children.length + 1),\n              );\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_7\\\"\\n      data={mocks.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      layout={PartitionLayout.treemap}\\n      valueGetter={percentValueGetter}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            fontFamily: 'Helvetica',\\n            textColor: 'black',\\n            fontWeight: 100,\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'small-caps',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 114,\\n    idealFontSizeJump: 1.01,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            fontFamily: 'Helvetica',\\n            textColor: '#555',\\n            fontWeight: 100,\\n            padding: {\\n              top: number('group padding top', 0, { range: true, min: 0, max: 20 }),\\n              right: number('group padding right', 2, { range: true, min: 0, max: 20 }),\\n              bottom: number('group padding bottom', 0, { range: true, min: 0, max: 20 }),\\n              left: number('group padding left', 2, { range: true, min: 0, max: 20 }),\\n            },\\n            minFontSize: 2,\\n            maxFontSize: 50,\\n            idealFontSizeJump: 1.01,\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n            padding: {\\n              top: number('leaf padding top', 0, { range: true, min: 0, max: 200 }),\\n              right: number('leaf padding right', 2, { range: true, min: 0, max: 200 }),\\n              bottom: number('leaf padding bottom', 0, { range: true, min: 0, max: 200 }),\\n              left: number('leaf padding left', 2, { range: true, min: 0, max: 200 }),\\n            },\\n            minFontSize: 2,\\n            maxFontSize: 100,\\n            idealFontSizeJump: 1.01,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":36},\"endLoc\":{\"col\":1,\"line\":99},\"startBody\":{\"col\":36,\"line\":36},\"endBody\":{\"col\":1,\"line\":99}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 114,\n    idealFontSizeJump: 1.01,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName.toUpperCase(),\n          fillLabel: {\n            valueFormatter: () => '',\n            fontFamily: 'Helvetica',\n            textColor: '#555',\n            fontWeight: 100,\n            padding: {\n              top: number('group padding top', 0, { range: true, min: 0, max: 20 }),\n              right: number('group padding right', 2, { range: true, min: 0, max: 20 }),\n              bottom: number('group padding bottom', 0, { range: true, min: 0, max: 20 }),\n              left: number('group padding left', 2, { range: true, min: 0, max: 20 }),\n            },\n            minFontSize: 2,\n            maxFontSize: 50,\n            idealFontSizeJump: 1.01,\n          },\n          shape: { fillColor: 'rgba(0,0,0,0)' },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'black',\n            fontWeight: 200,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\n            padding: {\n              top: number('leaf padding top', 0, { range: true, min: 0, max: 200 }),\n              right: number('leaf padding right', 2, { range: true, min: 0, max: 200 }),\n              bottom: number('leaf padding bottom', 0, { range: true, min: 0, max: 200 }),\n              left: number('leaf padding left', 2, { range: true, min: 0, max: 200 }),\n            },\n            minFontSize: 2,\n            maxFontSize: 100,\n            idealFontSizeJump: 1.01,\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\n              return interpolatorTurbo()(\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\n                  (node.parent.parent.children.length + 1),\n              );\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            fontFamily: 'Helvetica',\\n            textColor: '#555',\\n            fontWeight: 100,\\n            padding: {\\n              top: number('group padding top', 0, { range: true, min: 0, max: 20 }),\\n              right: number('group padding right', 2, { range: true, min: 0, max: 20 }),\\n              bottom: number('group padding bottom', 0, { range: true, min: 0, max: 20 }),\\n              left: number('group padding left', 2, { range: true, min: 0, max: 20 }),\\n            },\\n            minFontSize: 2,\\n            maxFontSize: 50,\\n            idealFontSizeJump: 1.01,\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n            padding: {\\n              top: number('leaf padding top', 0, { range: true, min: 0, max: 200 }),\\n              right: number('leaf padding right', 2, { range: true, min: 0, max: 200 }),\\n              bottom: number('leaf padding bottom', 0, { range: true, min: 0, max: 200 }),\\n              left: number('leaf padding left', 2, { range: true, min: 0, max: 200 }),\\n            },\\n            minFontSize: 2,\\n            maxFontSize: 100,\\n            idealFontSizeJump: 1.01,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((d: any, i: number) => (i ? d : { ...d, exportVal: 0 }))}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) =>\\n        `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`\\n      }\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) =>\\n              `${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, node.sortIndex, node.parent.children),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.map((d: any, i: number) => (i ? d : { ...d, exportVal: 0 }))}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) =>\n        `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`\n      }\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) =>\n              `${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              indexInterpolatedFillColor(interpolatorCET2s())(null, node.sortIndex, node.parent.children),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((d: any, i: number) => (i ? d : { ...d, exportVal: 0 }))}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) =>\\n        `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`\\n      }\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) =>\\n              `${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, node.sortIndex, node.parent.children),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Treemap',\n};\n\nexport { Example as oneLayer } from './1_one_layer.story';\nexport { Example as oneLayer2 } from './2_one_layer_2.story';\nexport { Example as midTwoLayers } from './3_mid_two.story';\nexport { Example as twoLayersStressTest } from './4_two_layer_stress.story';\nexport { Example as multiColor } from './5_multicolor.story';\nexport { Example as customStyle } from './6_custom_style.story';\nexport { Example as percentage } from './7_percentage.story';\nexport { Example as grooveText } from './8_groove_text.story';\nexport { Example as zeroValues } from './9_zero_values.story';\nexport { Example as threeLayer } from './10_three_layers.story';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  EuiButton,\n  EuiButtonEmpty,\n  EuiColorPicker,\n  EuiFlexItem,\n  EuiSpacer,\n  EuiWrappingPopover,\n  PopoverAnchorPosition,\n} from '@elastic/eui';\nimport React, { FC } from 'react';\n\nimport { LegendColorPickerProps } from '@elastic/charts';\n\nexport const getColorPicker =\n  (anchorPosition: PopoverAnchorPosition = 'leftCenter'): FC<LegendColorPickerProps> =>\n  ({ anchor, color, onClose, onChange }) => (\n    <EuiWrappingPopover\n      isOpen\n      button={anchor}\n      closePopover={onClose}\n      panelStyle={{ padding: 16 }}\n      anchorPosition={anchorPosition}\n      ownFocus\n    >\n      <EuiColorPicker display=\"inline\" color={color} onChange={onChange} />\n      <EuiSpacer size=\"m\" />\n      <EuiFlexItem grow={false}>\n        <EuiButtonEmpty\n          color=\"danger\"\n          style={{ color: '#ab231c' }}\n          size=\"s\"\n          onClick={() => {\n            onChange(null);\n            anchor.focus();\n            onClose();\n          }}\n          title=\"Clear color selection\"\n        >\n          Clear color\n        </EuiButtonEmpty>\n      </EuiFlexItem>\n      <EuiButton\n        fullWidth\n        size=\"s\"\n        iconType=\"check\"\n        title=\"Confirm color selection\"\n        onClick={onClose}\n        style={{ color: '#0061a6', backgroundColor: '#cce4f5', borderRadius: 4 }}\n      >\n        Done\n      </EuiButton>\n    </EuiWrappingPopover>\n  );\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  EuiIcon,\n  EuiPopover,\n  EuiContextMenu,\n  PopoverAnchorPosition,\n  EuiContextMenuPanelDescriptor,\n} from '@elastic/eui';\nimport React, { useState } from 'react';\n\nimport { LegendAction, XYChartSeriesIdentifier, useLegendAction } from '@elastic/charts';\n\nexport const getLegendAction =\n  (anchorPosition: PopoverAnchorPosition = 'leftCenter'): LegendAction =>\n  ({ series, label }) => {\n    const [popoverOpen, setPopoverOpen] = useState(false);\n    const [ref, onClose] = useLegendAction<HTMLButtonElement>();\n\n    const getPanels = (series: XYChartSeriesIdentifier[]): EuiContextMenuPanelDescriptor[] => [\n      {\n        id: 0,\n        title: label,\n        items: [\n          {\n            name: 'Alert series specId',\n            icon: <EuiIcon type=\"iInCircle\" size=\"m\" />,\n            onClick: () => {\n              setPopoverOpen(false);\n              setTimeout(() => {\n                window.alert(`Selected series: ${series.map(({ specId }) => specId).join(', ')}`);\n              }, 100);\n            },\n          },\n          {\n            name: 'Alert series keys',\n            icon: <EuiIcon type=\"tokenKey\" size=\"m\" />,\n            onClick: () => {\n              setPopoverOpen(false);\n              setTimeout(() => {\n                window.alert(\n                  `Selected series: [${series.map(({ seriesKeys }) => seriesKeys.join(', ')).join(' -- ')}]`,\n                );\n              }, 100);\n            },\n          },\n          {\n            name: 'Filter series',\n            icon: <EuiIcon type=\"filter\" size=\"m\" />,\n            onClick: () => {\n              setPopoverOpen(false);\n              setTimeout(() => {\n                window.alert('Series Filtered!');\n              }, 100);\n            },\n          },\n          {\n            name: 'Like series',\n            icon: <EuiIcon type=\"starFilled\" size=\"m\" />,\n            onClick: () => {\n              setPopoverOpen(false);\n              setTimeout(() => {\n                window.alert('Series liked!!!');\n              }, 100);\n            },\n          },\n        ],\n      },\n    ];\n\n    const Button = (\n      <button\n        type=\"button\"\n        ref={ref}\n        style={{\n          display: 'flex',\n          justifyContent: 'center',\n          alignItems: 'center',\n          paddingLeft: 2,\n          paddingRight: 2,\n        }}\n        onClick={() => setPopoverOpen(!popoverOpen)}\n      >\n        <EuiIcon size=\"s\" type=\"pencil\" />\n      </button>\n    );\n\n    return (\n      <EuiPopover\n        id=\"contextMenuNormal\"\n        button={Button}\n        isOpen={popoverOpen}\n        closePopover={() => {\n          setPopoverOpen(false);\n          onClose();\n        }}\n        panelPaddingSize=\"none\"\n        offset={4}\n        anchorPosition={anchorPosition}\n      >\n        <EuiContextMenu initialPanelId={0} panels={getPanels(series as XYChartSeriesIdentifier[])} />\n      </EuiPopover>\n    );\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\ninterface Row {\n  state: string;\n  profit: number;\n  product: string;\n}\n\nexport const data: Row[] = [\n  { state: 'Florida', product: 'Powder', profit: 10000 },\n  { state: 'Florida', product: 'Mascara', profit: 9000 },\n  { state: 'Florida', product: 'Lip gloss', profit: 17000 },\n  { state: 'Florida', product: 'Foundation', profit: 6000 },\n  { state: 'Florida', product: 'Eyeliner', profit: 7000 },\n  { state: 'Florida', product: 'Eyeshadow', profit: 1000 },\n  { state: 'Florida', product: 'Lipstick', profit: 4000 },\n  { state: 'Florida', product: 'Rouge', profit: 6000 },\n  { state: 'Florida', product: 'Concealer', profit: 8000 },\n  { state: 'Florida', product: 'Nail polish', profit: 8000 },\n  { state: 'Texas', product: 'Powder', profit: 9000 },\n  { state: 'Texas', product: 'Mascara', profit: 7000 },\n  { state: 'Texas', product: 'Lip gloss', profit: 8000 },\n  { state: 'Texas', product: 'Foundation', profit: 6000 },\n  { state: 'Texas', product: 'Eyeliner', profit: 10000 },\n  { state: 'Texas', product: 'Eyeshadow', profit: 9000 },\n  { state: 'Texas', product: 'Lipstick', profit: 5000 },\n  { state: 'Texas', product: 'Rouge', profit: -4000 },\n  { state: 'Texas', product: 'Concealer', profit: -3000 },\n  { state: 'Texas', product: 'Nail polish', profit: -2000 },\n  { state: 'Nevada', product: 'Powder', profit: -5000 },\n  { state: 'Nevada', product: 'Mascara', profit: -4000 },\n  { state: 'Nevada', product: 'Lip gloss', profit: 2000 },\n  { state: 'Nevada', product: 'Foundation', profit: -2000 },\n  { state: 'Nevada', product: 'Eyeliner', profit: 1000 },\n  { state: 'Nevada', product: 'Eyeshadow', profit: -2000 },\n  { state: 'Nevada', product: 'Lipstick', profit: 1000 },\n  { state: 'Nevada', product: 'Rouge', profit: -1000 },\n  { state: 'Nevada', product: 'Concealer', profit: -1000 },\n  { state: 'Nevada', product: 'Nail polish', profit: -1000 },\n  { state: 'Arizona', product: 'Powder', profit: 20000 },\n  { state: 'Arizona', product: 'Mascara', profit: 21000 },\n  { state: 'Arizona', product: 'Lip gloss', profit: -1000 },\n  { state: 'Arizona', product: 'Foundation', profit: 8000 },\n  { state: 'Arizona', product: 'Eyeliner', profit: -2000 },\n  { state: 'Arizona', product: 'Eyeshadow', profit: -1000 },\n  { state: 'Arizona', product: 'Lipstick', profit: -4000 },\n  { state: 'Arizona', product: 'Rouge', profit: 2000 },\n  { state: 'Arizona', product: 'Concealer', profit: -1000 },\n  { state: 'Arizona', product: 'Nail polish', profit: -1000 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\n\nimport { DebugState } from '@elastic/charts';\nimport { debounce } from '@elastic/charts/src/utils/debounce';\n\nexport const getDebugStateLogger = (debugState: boolean) => {\n  const dataStateAction = action('DataState');\n  return debounce(() => {\n    if (!debugState) return;\n    const statusEl = document.querySelector<HTMLDivElement>('.echChartStatus');\n\n    if (statusEl) {\n      const dataState = statusEl.dataset.echDebugState\n        ? (JSON.parse(statusEl.dataset.echDebugState) as DebugState)\n        : null;\n      if (dataState) dataStateAction(dataState);\n    }\n  }, 100) as () => void;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport numeral from 'numeral';\n\nconst superStringMap: Record<string, string> = {\n  0: '⁰',\n  1: '¹',\n  2: '²',\n  3: '³',\n  4: '⁴',\n  5: '⁵',\n  6: '⁶',\n  7: '⁷',\n  8: '⁸',\n  9: '⁹',\n};\n\nexport const getSuperScriptNumber = (n: number) =>\n  `${n >= 0 ? '' : '⁻'}${Math.abs(n)\n    .toString()\n    .split('')\n    .map((c) => superStringMap[c])\n    .join('')}`;\n\nexport const logFormatter =\n  (base: number = 10) =>\n  (n: number): string => {\n    if (n === 0) return '0';\n    const sign = n < 0 ? '-' : '';\n    const nAbs = Math.abs(n);\n    const exp = Math.log(nAbs) / Math.log(base) + Number.EPSILON;\n    const roundedExp = Math.floor(exp);\n    const constant = numeral(nAbs / Math.pow(base, roundedExp)).format('0[.]00');\n    const baseLabel = base === Math.E ? 'e' : base;\n    const expString = getSuperScriptNumber(roundedExp);\n    return `${sign}${constant} x ${baseLabel}${expString}`;\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Datum } from '@elastic/charts';\nimport { PrimitiveValue } from '@elastic/charts/src/chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { discreteColor } from './utils';\n\nconst raw = mocks.observabilityTree;\n\ninterface Node {\n  c?: Node[];\n  n: string;\n  v: number;\n}\n\ntype Row = { [layerKey: string]: unknown; value: number; depth: number };\n\nconst flatTree = ({ c, n, v }: Node, depth: number): Row[] => {\n  if (!c) {\n    return [{ [`layer_${depth}`]: n, value: v, depth }];\n  }\n  // as of writing this, the test runner can't run c.flatMap(...)\n  const childrenRows = c.reduce<Row[]>((a, child) => [...a, ...flatTree(child, depth + 1)], []);\n  const childrenTotal = childrenRows.reduce((p, { value }) => p + value, 0);\n  const missing = Math.max(0, v - childrenTotal);\n  if (missing > 0) {\n    childrenRows.unshift({ [`layer_${depth + 1}`]: undefined, value: missing / 2, depth });\n    childrenRows.push({ [`layer_${depth + 1}`]: undefined, value: missing / 2, depth });\n  }\n  childrenRows.forEach((innerChild) => {\n    innerChild[`layer_${depth}`] = n;\n  });\n  return childrenRows;\n};\n\n/** @internal */\nexport const getFlatData = () => flatTree(raw, 0);\n\n/** @internal */\nexport const maxDepth = getFlatData().reduce((p, n) => Math.max(p, n.depth), 0);\n\n/** @internal */\nexport const getLayerSpec = (color: [string, string, string][]) =>\n  [...new Array(maxDepth + 1)].map((_, depth) => ({\n    groupByRollup: (d: Datum) => d[`layer_${depth}`],\n    nodeLabel: (d: PrimitiveValue) => String(d),\n    showAccessor: (d: PrimitiveValue) => d !== undefined,\n    shape: {\n      fillColor: () => discreteColor(color, 0.8)(depth),\n    },\n  }));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// Not sure why this is not an export from eui but manually listing here\n// From: https://github.com/elastic/eui/blob/main/src-docs/src/views/icon/icons.js\nexport const euiIconTypes = {\n  accessibility: 'accessibility',\n  aggregate: 'aggregate',\n  analyzeEvent: 'analyzeEvent',\n  annotation: 'annotation',\n  apmTrace: 'apmTrace',\n  apps: 'apps',\n  arrowDown: 'arrowDown',\n  arrowLeft: 'arrowLeft',\n  arrowRight: 'arrowRight',\n  arrowUp: 'arrowUp',\n  arrowStart: 'arrowStart',\n  arrowEnd: 'arrowEnd',\n  article: 'article',\n  asterisk: 'asterisk',\n  at: 'at',\n  beaker: 'beaker',\n  bell: 'bell',\n  bellSlash: 'bellSlash',\n  beta: 'beta',\n  bolt: 'bolt',\n  boxesHorizontal: 'boxesHorizontal',\n  boxesVertical: 'boxesVertical',\n  branch: 'branch',\n  branchUser: 'branchUser',\n  broom: 'broom',\n  brush: 'brush',\n  bug: 'bug',\n  bullseye: 'bullseye',\n  calendar: 'calendar',\n  check: 'check',\n  checkInCircleFilled: 'checkInCircleFilled',\n  cheer: 'cheer',\n  clock: 'clock',\n  cloudDrizzle: 'cloudDrizzle',\n  cloudStormy: 'cloudStormy',\n  cloudSunny: 'cloudSunny',\n  cluster: 'cluster',\n  color: 'color',\n  compute: 'compute',\n  console: 'console',\n  container: 'container',\n  continuityAbove: 'continuityAbove',\n  continuityAboveBelow: 'continuityAboveBelow',\n  continuityBelow: 'continuityBelow',\n  continuityWithin: 'continuityWithin',\n  controlsHorizontal: 'controlsHorizontal',\n  controlsVertical: 'controlsVertical',\n  copy: 'copy',\n  copyClipboard: 'copyClipboard',\n  cross: 'cross',\n  crosshairs: 'crosshairs',\n  currency: 'currency',\n  cut: 'cut',\n  database: 'database',\n  desktop: 'desktop',\n  discuss: 'discuss',\n  document: 'document',\n  documents: 'documents',\n  documentEdit: 'documentEdit',\n  documentation: 'documentation',\n  dot: 'dot',\n  dotInCircle: 'dotInCircle',\n  doubleArrowLeft: 'doubleArrowLeft',\n  doubleArrowRight: 'doubleArrowRight',\n  download: 'download',\n  email: 'email',\n  empty: 'empty',\n  endpoint: 'endpoint',\n  eql: 'eql',\n  eraser: 'eraser',\n  error: 'error',\n  esqlVis: 'esqlVis',\n  exit: 'exit',\n  expand: 'expand',\n  expandMini: 'expandMini',\n  exportAction: 'exportAction',\n  eye: 'eye',\n  eyeClosed: 'eyeClosed',\n  faceHappy: 'faceHappy',\n  faceNeutral: 'faceNeutral',\n  faceSad: 'faceSad',\n  filter: 'filter',\n  filterExclude: 'filterExclude',\n  filterIgnore: 'filterIgnore',\n  filterInclude: 'filterInclude',\n  filterInCircle: 'filterInCircle',\n  flag: 'flag',\n  fold: 'fold',\n  folderCheck: 'folderCheck',\n  folderClosed: 'folderClosed',\n  folderExclamation: 'folderExclamation',\n  folderOpen: 'folderOpen',\n  frameNext: 'frameNext',\n  framePrevious: 'framePrevious',\n  fullScreen: 'fullScreen',\n  fullScreenExit: 'fullScreenExit',\n  function: 'function',\n  gear: 'gear',\n  glasses: 'glasses',\n  globe: 'globe',\n  grab: 'grab',\n  grabHorizontal: 'grabHorizontal',\n  grabOmnidirectional: 'grabOmnidirectional',\n  gradient: 'gradient',\n  grid: 'grid',\n  heart: 'heart',\n  heatmap: 'heatmap',\n  help: 'help',\n  home: 'home',\n  iInCircle: 'iInCircle',\n  image: 'image',\n  importAction: 'importAction',\n  indexClose: 'indexClose',\n  indexEdit: 'indexEdit',\n  indexFlush: 'indexFlush',\n  indexMapping: 'indexMapping',\n  indexOpen: 'indexOpen',\n  indexRuntime: 'indexRuntime',\n  indexSettings: 'indexSettings',\n  indexTemporary: 'indexTemporary',\n  infinity: 'infinity',\n  inputOutput: 'inputOutput',\n  inspect: 'inspect',\n  invert: 'invert',\n  ip: 'ip',\n  key: 'key',\n  keyboard: 'keyboard',\n  kqlField: 'kqlField',\n  kqlFunction: 'kqlFunction',\n  kqlOperand: 'kqlOperand',\n  kqlSelector: 'kqlSelector',\n  kqlValue: 'kqlValue',\n  kubernetesNode: 'kubernetesNode',\n  kubernetesPod: 'kubernetesPod',\n  launch: 'launch',\n  layers: 'layers',\n  lettering: 'lettering',\n  lineDashed: 'lineDashed',\n  lineDotted: 'lineDotted',\n  lineSolid: 'lineSolid',\n  link: 'link',\n  list: 'list',\n  listAdd: 'listAdd',\n  lock: 'lock',\n  lockOpen: 'lockOpen',\n  logstashFilter: 'logstashFilter',\n  logstashIf: 'logstashIf',\n  logstashInput: 'logstashInput',\n  logstashOutput: 'logstashOutput',\n  logstashQueue: 'logstashQueue',\n  magnifyWithExclamation: 'magnifyWithExclamation',\n  magnifyWithMinus: 'magnifyWithMinus',\n  magnifyWithPlus: 'magnifyWithPlus',\n  magnet: 'magnet',\n  mapMarker: 'mapMarker',\n  memory: 'memory',\n  merge: 'merge',\n  menu: 'menu',\n  menuDown: 'menuDown',\n  menuLeft: 'menuLeft',\n  menuRight: 'menuRight',\n  menuUp: 'menuUp',\n  minimize: 'minimize',\n  minus: 'minus',\n  minusInCircle: 'minusInCircle',\n  minusInCircleFilled: 'minusInCircleFilled',\n  mobile: 'mobile',\n  moon: 'moon',\n  namespace: 'namespace',\n  nested: 'nested',\n  node: 'node',\n  number: 'number',\n  offline: 'offline',\n  online: 'online',\n  package: 'package',\n  pageSelect: 'pageSelect',\n  pagesSelect: 'pagesSelect',\n  palette: 'palette',\n  paperClip: 'paperClip',\n  partial: 'partial',\n  pause: 'pause',\n  payment: 'payment',\n  pencil: 'pencil',\n  percent: 'percent',\n  pin: 'pin',\n  pinFilled: 'pinFilled',\n  pipeBreaks: 'pipeBreaks',\n  pipeNoBreaks: 'pipeNoBreaks',\n  pivot: 'pivot',\n  play: 'play',\n  playFilled: 'playFilled',\n  plus: 'plus',\n  plusInCircle: 'plusInCircle',\n  plusInCircleFilled: 'plusInCircleFilled',\n  popout: 'popout',\n  push: 'push',\n  questionInCircle: 'questionInCircle',\n  quote: 'quote',\n  refresh: 'refresh',\n  reporter: 'reporter',\n  returnKey: 'returnKey',\n  save: 'save',\n  scale: 'scale',\n  search: 'search',\n  securitySignal: 'securitySignal',\n  securitySignalDetected: 'securitySignalDetected',\n  securitySignalResolved: 'securitySignalResolved',\n  sessionViewer: 'sessionViewer',\n  shard: 'shard',\n  share: 'share',\n  snowflake: 'snowflake',\n  sortable: 'sortable',\n  sortAscending: 'sortAscending',\n  sortDescending: 'sortDescending',\n  sortDown: 'sortDown',\n  sortLeft: 'sortLeft',\n  sortRight: 'sortRight',\n  sortUp: 'sortUp',\n  spaces: 'spaces',\n  sparkles: 'sparkles',\n  starEmpty: 'starEmpty',\n  starEmptySpace: 'starEmptySpace',\n  starFilled: 'starFilled',\n  starFilledSpace: 'starFilledSpace',\n  starMinusEmpty: 'starMinusEmpty',\n  starMinusFilled: 'starMinusFilled',\n  starPlusEmpty: 'starPlusEmpty',\n  starPlusFilled: 'starPlusFilled',\n  stats: 'stats',\n  stop: 'stop',\n  stopFilled: 'stopFilled',\n  stopSlash: 'stopSlash',\n  storage: 'storage',\n  string: 'string',\n  submodule: 'submodule',\n  sun: 'sun',\n  symlink: 'symlink',\n  tableOfContents: 'tableOfContents',\n  tableDensityExpanded: 'tableDensityExpanded',\n  tableDensityCompact: 'tableDensityCompact',\n  tableDensityNormal: 'tableDensityNormal',\n  tag: 'tag',\n  tear: 'tear',\n  temperature: 'temperature',\n  timeline: 'timeline',\n  timelineWithArrow: 'timelineWithArrow',\n  timeRefresh: 'timeRefresh',\n  timeslider: 'timeslider',\n  training: 'training',\n  transitionLeftIn: 'transitionLeftIn',\n  transitionLeftOut: 'transitionLeftOut',\n  transitionTopIn: 'transitionTopIn',\n  transitionTopOut: 'transitionTopOut',\n  trash: 'trash',\n  unfold: 'unfold',\n  unlink: 'unlink',\n  user: 'user',\n  userAvatar: 'userAvatar',\n  users: 'users',\n  vector: 'vector',\n  videoPlayer: 'videoPlayer',\n  visArea: 'visArea',\n  visAreaStacked: 'visAreaStacked',\n  visBarHorizontal: 'visBarHorizontal',\n  visBarHorizontalStacked: 'visBarHorizontalStacked',\n  visBarVertical: 'visBarVertical',\n  visBarVerticalStacked: 'visBarVerticalStacked',\n  visGauge: 'visGauge',\n  visGoal: 'visGoal',\n  visLine: 'visLine',\n  visMapCoordinate: 'visMapCoordinate',\n  visMapRegion: 'visMapRegion',\n  visMetric: 'visMetric',\n  visPie: 'visPie',\n  visTable: 'visTable',\n  visTagCloud: 'visTagCloud',\n  visText: 'visText',\n  visTimelion: 'visTimelion',\n  visVega: 'visVega',\n  visVisualBuilder: 'visVisualBuilder',\n  warning: 'warning',\n  wordWrap: 'wordWrap',\n  wordWrapDisabled: 'wordWrapDisabled',\n  wrench: 'wrench',\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, array, number, optionsKnob, boolean } from '@storybook/addon-knobs';\nimport {\n  OptionsTypeKnobSingleValue,\n  OptionsTypeKnobValue,\n  OptionsTypeOptionsProp,\n} from '@storybook/addon-knobs/dist/components/types';\nimport { OptionsKnobOptionsDisplay } from '@storybook/addon-knobs/dist/components/types/Options';\n\nimport { isFiniteNumber } from '@elastic/charts/src/utils/common';\n\n/**\n * Fix default storybook behavior that does not correctly parse numbers/strings in arrays\n */\nexport function getArrayKnob(\n  name: string,\n  values: (string | number)[],\n  separator?: string,\n  group?: string,\n): (string | number)[] {\n  const stringifiedValues = values.map<string>((d) => `${d}`);\n  return array(name, stringifiedValues, separator, group).map<string | number>((value: string) =>\n    Number.isFinite(parseFloat(value)) ? parseFloat(value) : value,\n  );\n}\n\n/**\n * Fix default storybook behavior that does not correctly parse numbers/strings in arrays\n */\nexport function getNumbersArrayKnob<T extends number>(\n  name: string,\n  values: T[],\n  separator?: string,\n  group?: string,\n): T[] {\n  const stringifiedValues = values.map<string>((d) => `${d}`);\n  return array(name, stringifiedValues, separator, group).map(parseFloat).filter(isFiniteNumber) as T[];\n}\n\nexport const getPositiveNumberKnob = (name: string, value: number, group?: string) =>\n  number(name, value, { min: 0 }, group);\n\nexport function getToggledNumberKnob<T>(initEnabled: boolean, fallbackValue: T) {\n  return (...[name, initialValue, options, group]: Parameters<typeof number>) => {\n    const enabled = boolean(`${name} - enabled`, initEnabled, group);\n    const value = number(name, initialValue, options, group);\n    return enabled ? value : fallbackValue;\n  };\n}\n\n/**\n * Treats select option values as numbers\n */\nexport const getNumberSelectKnob = <T extends number>(\n  name: string,\n  options: { [s: string]: T },\n  value: T,\n  group?: string,\n): T => (parseInt(select<T | string>(name, options, value, group) as string, 10) as T) || value;\n\n/**\n * Fix default storybook behavior which,\n * throws from when values array becomes empty :(\n */\nexport function getMultiSelectKnob<T extends OptionsTypeKnobSingleValue>(\n  name: string,\n  valuesObj: OptionsTypeOptionsProp<T>,\n  value: OptionsTypeKnobValue<T>,\n  display: OptionsKnobOptionsDisplay = 'multi-select',\n  group?: string,\n): T[] {\n  const knob = optionsKnob<T>(\n    name,\n    valuesObj,\n    value,\n    {\n      display,\n    },\n    group,\n  );\n\n  if (Array.isArray(knob)) return knob as T[];\n  if (typeof knob === 'string') return knob.split(/\\s*,\\s*/) as T[];\n  if (typeof knob === 'number') return [knob] as T[];\n  return !knob ? [] : knob;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Position, Placement, ScaleType, TooltipStickTo, CurveType, Fit } from '@elastic/charts';\nimport { PointShape } from '@elastic/charts/src';\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\nimport { VerticalAlignment, HorizontalAlignment } from '@elastic/charts/src/utils/common';\n\nimport { getKnobsFnFromEnum } from './utils';\n\nconst getTooltipTypeKnob = getKnobsFnFromEnum(TooltipType, 'tooltip type', TooltipType.VerticalCursor);\n\nconst getPositionKnob = getKnobsFnFromEnum(Position, 'position', Position.Right);\n\nconst getPlacementKnob = getKnobsFnFromEnum(Placement, 'placement', undefined, {\n  allowUndefined: true,\n  undefinedLabel: 'Default',\n});\n\nconst getVerticalTextAlignmentKnob = getKnobsFnFromEnum(VerticalAlignment, 'Vertical Text alignment', undefined, {\n  allowUndefined: true,\n  undefinedLabel: 'None',\n});\n\nconst getHorizontalTextAlignmentKnob = getKnobsFnFromEnum(HorizontalAlignment, 'Horizontal Text alignment', undefined, {\n  allowUndefined: true,\n  undefinedLabel: 'None',\n});\n\nconst getStickToKnob = getKnobsFnFromEnum(TooltipStickTo, 'stickTo', TooltipStickTo.MousePosition, {\n  allowUndefined: true,\n  undefinedLabel: 'Default',\n});\n\nconst getEuiPopoverPositionKnob = getKnobsFnFromEnum(\n  {\n    upCenter: 'upCenter' as const,\n    upLeft: 'upLeft' as const,\n    upRight: 'upRight' as const,\n    downCenter: 'downCenter' as const,\n    downLeft: 'downLeft' as const,\n    downRight: 'downRight' as const,\n    leftCenter: 'leftCenter' as const,\n    leftUp: 'leftUp' as const,\n    leftDown: 'leftDown' as const,\n    rightCenter: 'rightCenter' as const,\n    rightUp: 'rightUp' as const,\n    rightDown: 'rightDown' as const,\n  },\n  'Popover position',\n  'leftCenter',\n  {\n    allowUndefined: false,\n  },\n);\n\nconst getScaleTypeKnob = getKnobsFnFromEnum(ScaleType, 'scaleType', ScaleType.Linear);\n\nconst getCurveTypeKnob = getKnobsFnFromEnum(CurveType, 'Curve', CurveType.CURVE_CARDINAL);\n\nconst getFitKnob = getKnobsFnFromEnum(Fit, 'fitting function', Fit.Average);\n\nconst getPointShapeKnob = getKnobsFnFromEnum(PointShape, 'point shape', PointShape.Circle);\n\nexport const enumKnobs = {\n  tooltipType: getTooltipTypeKnob,\n  position: getPositionKnob,\n  placement: getPlacementKnob,\n  stickTo: getStickToKnob,\n  euiPopoverPosition: getEuiPopoverPositionKnob,\n  verticalTextAlignment: getVerticalTextAlignmentKnob,\n  horizontalTextAlignment: getHorizontalTextAlignmentKnob,\n  scaleType: getScaleTypeKnob,\n  curve: getCurveTypeKnob,\n  fit: getFitKnob,\n  pointShape: getPointShapeKnob,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { euiIconTypes } from './constants';\nimport { getKnobsFnFromEnum } from './utils';\n\nconst getIconTypeKnob = getKnobsFnFromEnum(euiIconTypes, 'iconType', 'warning');\n\nexport const euiKnobs = {\n  getIconTypeKnob,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  getArrayKnob,\n  getNumberSelectKnob,\n  getPositiveNumberKnob,\n  getToggledNumberKnob,\n  getMultiSelectKnob,\n  getNumbersArrayKnob,\n} from './custom';\nimport { enumKnobs } from './enums';\nimport { euiKnobs } from './eui';\nimport { specialEnumKnobs } from './special_enums';\nimport { getKnobFromEnum } from './utils';\n\nexport const customKnobs = {\n  enum: {\n    ...enumKnobs,\n    ...specialEnumKnobs,\n  },\n  eui: euiKnobs,\n  fromEnum: getKnobFromEnum,\n  array: getArrayKnob,\n  numbersArray: getNumbersArrayKnob,\n  positiveNumber: getPositiveNumberKnob,\n  toggledNumber: getToggledNumberKnob,\n  numberSelect: getNumberSelectKnob,\n  multiSelect: getMultiSelectKnob,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport { $Values } from 'utility-types';\n\nimport {\n  Placement,\n  TooltipProps,\n  SeriesType,\n  BarSeries,\n  LineSeries,\n  AreaSeries,\n  BubbleSeries,\n  Rotation,\n} from '@elastic/charts';\n\nimport { getMultiSelectKnob, getNumberSelectKnob } from './custom';\n\n/**\n * Negative numbers do not behave well with vrt slugified naming\n */\nconst getRotationKnob = (name = 'chartRotation') =>\n  getNumberSelectKnob<Rotation>(\n    name,\n    {\n      '0 deg': 0,\n      '90 deg': 90,\n      '-90 deg': -90,\n      '180 deg': 180,\n    },\n    0,\n  );\n\nconst boundaryMap: Record<string, TooltipProps['boundary'] | null> = {\n  default: undefined,\n  chart: 'chart',\n};\n\nconst getBoundaryKnob = () => {\n  const boundaryString =\n    select<string>(\n      'Boundary Element',\n      {\n        Default: 'default',\n        Chart: 'chart',\n      },\n      'default',\n    ) ?? '';\n\n  return boundaryMap[boundaryString] ?? undefined;\n};\n\nconst getFallbackPlacementsKnob = (groupId?: string): Placement[] => {\n  return getMultiSelectKnob<Placement>(\n    'Fallback Placements',\n    {\n      Top: Placement.Top,\n      Bottom: Placement.Bottom,\n      Left: Placement.Left,\n      Right: Placement.Right,\n      TopStart: Placement.TopStart,\n      TopEnd: Placement.TopEnd,\n      BottomStart: Placement.BottomStart,\n      BottomEnd: Placement.BottomEnd,\n      RightStart: Placement.RightStart,\n      RightEnd: Placement.RightEnd,\n      LeftStart: Placement.LeftStart,\n      LeftEnd: Placement.LeftEnd,\n      Auto: Placement.Auto,\n      AutoStart: Placement.AutoStart,\n      AutoEnd: Placement.AutoEnd,\n    },\n    [Placement.Right, Placement.Left, Placement.Top, Placement.Bottom],\n    undefined,\n    groupId,\n  );\n};\n\nconst XYSeriesTypeMap = {\n  [SeriesType.Bar]: BarSeries,\n  [SeriesType.Line]: LineSeries,\n  [SeriesType.Area]: AreaSeries,\n  [SeriesType.Bubble]: BubbleSeries,\n};\n\nexport const getXYSeriesTypeKnob = (\n  name = 'SeriesType',\n  value: SeriesType = SeriesType.Bar,\n  options?: { group?: string; exclude: SeriesType[] },\n) => {\n  return select<SeriesType>(\n    name,\n    Object.fromEntries(Object.entries(SeriesType).filter(([, type]) => !(options?.exclude ?? []).includes(type))),\n    value,\n    options?.group,\n  );\n};\n\nexport const getXYSeriesKnob = (\n  name = 'SeriesType',\n  value: SeriesType = SeriesType.Bar,\n  options?: { group?: string; exclude: SeriesType[] },\n): [$Values<typeof XYSeriesTypeMap>, SeriesType] => {\n  const spectType = getXYSeriesTypeKnob(name, value, options);\n\n  return [XYSeriesTypeMap[spectType], spectType];\n};\n\nexport const specialEnumKnobs = {\n  rotation: getRotationKnob,\n  fallbackPlacements: getFallbackPlacementsKnob,\n  boundary: getBoundaryKnob,\n  xySeriesType: getXYSeriesTypeKnob,\n  xySeries: getXYSeriesKnob,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport { SelectTypeKnobValue } from '@storybook/addon-knobs/dist/components/types';\nimport { kebabCase, startCase } from 'lodash';\n\nimport { ExtendsNever } from '@elastic/charts/src/utils/common';\n\nimport { getNumberSelectKnob } from './custom';\n\nexport type KnobFromEnumBaseOptions<AU extends boolean> = {\n  group?: string;\n  allowUndefined?: AU;\n  undefinedLabel?: string;\n};\n\nexport type KnobFromEnumOptions<\n  O extends Record<string, unknown>,\n  AU extends boolean = false,\n  I extends keyof O = never,\n  E extends keyof O = never,\n> = KnobFromEnumBaseOptions<AU> &\n  (\n    | {\n        include?: I[];\n        exclude?: never;\n      }\n    | {\n        include?: never;\n        exclude?: E[];\n      }\n  );\n\n/**\n * Generates storybook knobs from const enum\n * must be an enum type, types are not inferable from object literals\n *\n * There are a few ts ignores inside the function to force type alignment\n * All exterior input and output types are correctly aligned\n */\nexport const getKnobFromEnum = <\n  O extends Record<keyof O, SelectTypeKnobValue>,\n  T extends O[keyof O],\n  D extends ExtendsNever<I, O[Exclude<keyof O, E>] | AUR, O[Extract<keyof O, I>] | AUR>,\n  AU extends boolean = false,\n  I extends keyof O = never,\n  E extends keyof O = never,\n  AUR = AU extends true ? undefined : never,\n>(\n  name: string,\n  enumObject: O,\n  defaultValue: D,\n  { group, allowUndefined, undefinedLabel, ...rest }: KnobFromEnumOptions<O, AU, I, E> = {},\n): ExtendsNever<I, O[Exclude<keyof O, E>] | AUR, O[Extract<keyof O, I>] | AUR> => {\n  // @ts-ignore - force complex typings\n  const options = (Object.entries<T>(enumObject) as [keyof O, T][])\n    // @ts-ignore - skip key type checks\n    .filter('include' in rest ? ([k]) => rest.include!.includes(k) : () => true)\n    // @ts-ignore - skip key type checks\n    .filter('exclude' in rest ? ([k]) => !rest.exclude!.includes(k) : () => true)\n    .reduce<O>(\n      (acc, [key, value]) => {\n        // @ts-ignore - override key casing\n        acc[startCase(kebabCase(key))] = value;\n        return acc;\n      },\n      (allowUndefined ? { [undefinedLabel || 'Undefined']: undefined } : ({} as unknown)) as O,\n    );\n\n  const hasOnlyNumbers = Object.values(options).every((v) => typeof v === 'number');\n  const selectFunction = hasOnlyNumbers ? getNumberSelectKnob : select;\n  // @ts-ignore - force complex typings\n  const value = selectFunction<T>(name, options, defaultValue, group);\n\n  if (value === '' || value === undefined) {\n    // @ts-ignore - optional undefined return\n    if (allowUndefined) return undefined;\n\n    throw new Error(`Unable to get determine knob value [${name}]`); // likely due to bad or old url params\n  }\n\n  // @ts-ignore - force type alignment\n  return value;\n};\n\n/**\n * Generates reusable generic knob function from enum\n */\nexport function getKnobsFnFromEnum<\n  O extends Record<keyof O, SelectTypeKnobValue>,\n  T extends O[keyof O],\n  DF extends T | UAUR,\n  UAU extends boolean = never,\n  UAUR = UAU extends true ? undefined : never,\n>(\n  enumObject: O,\n  defaultName: string,\n  fallbackDefaultValue: DF,\n  optionOverrides: Pick<KnobFromEnumBaseOptions<UAU>, 'allowUndefined' | 'undefinedLabel'> = {},\n) {\n  return <\n    D extends ExtendsNever<I, O[Exclude<keyof O, E>] | AUR, O[Extract<keyof O, I>] | AUR>,\n    AU extends boolean = UAU,\n    I extends keyof O = never,\n    E extends keyof O = never,\n    AUR = AU extends true ? undefined : never,\n  >(\n    name = defaultName,\n    // @ts-ignore - type always aligned\n    defaultValue: D = fallbackDefaultValue,\n    // @ts-ignore - type always aligned\n    options: Omit<KnobFromEnumOptions<O, AU, I, E>, ExtendsNever<UAU, '', 'allowUndefined'>> = {},\n    // @ts-ignore - type always aligned\n  ) => getKnobFromEnum<O, T, D, AU, I, E, AUR>(name, enumObject, defaultValue, { ...options, ...optionOverrides });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport const SB_ACTION_PANEL = 'storybook/actions/panel';\nexport const SB_SOURCE_PANEL = 'storybook/source-loader/panel';\nexport const SB_KNOBS_PANEL = 'storybookjs/knobs/panel';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React, { useEffect, useRef, useState } from 'react';\\n\\nimport { Font, cssFontShorthand } from '@elastic/charts/src/common/text_utils';\\nimport { withContext } from '@elastic/charts/src/renderers/canvas';\\nimport { withTextMeasure } from '@elastic/charts/src/utils/bbox/canvas_text_bbox_calculator';\\nimport { wrapText } from '@elastic/charts/src/utils/text/wrap';\\n\\nconst fontSize = 24;\\nconst font: Font = {\\n  fontStyle: 'normal',\\n  fontFamily: 'sans-serif',\\n  fontVariant: 'normal',\\n  fontWeight: 500,\\n  textColor: 'red',\\n};\\nconst fontStyle = cssFontShorthand(font, fontSize);\\nconst defaultText =\\n  'Bacon ipsum dolor amet mongoloadgendecoblue58d844d55c-9c24dtip flank kielbasa. Pork strip steak jowl chuck filet mignon, burgdoggen kevin tail.';\\n\\nexport const Example = () => {\\n  const [maxLineWidth, setMaxLineWidth] = useState(250);\\n  const [maxLines, setMaxLines] = useState(3);\\n  const [text, setText] = useState(defaultText);\\n  const canvasRef = useRef<HTMLCanvasElement>(null);\\n\\n  useEffect(() => {\\n    const canvas = canvasRef.current!;\\n    const ctx = canvas.getContext('2d')!;\\n\\n    withContext(ctx, () => {\\n      ctx.scale(window.devicePixelRatio, window.devicePixelRatio);\\n      ctx.fillStyle = 'white';\\n      ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\\n      ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);\\n\\n      ctx.font = fontStyle;\\n      ctx.textBaseline = 'top';\\n      ctx.strokeStyle = 'black';\\n      ctx.fillStyle = 'black';\\n      ctx.strokeRect(0, 0, maxLineWidth, fontSize * maxLines);\\n      withTextMeasure((measure) => {\\n        const lines = wrapText(text, font, fontSize, maxLineWidth, maxLines, measure, 'en');\\n        lines.forEach((line, i) => {\\n          ctx.fillText(line, 0, i * fontSize);\\n        });\\n      });\\n    });\\n  }, [text, maxLineWidth, maxLines]);\\n  const width = 500;\\n  const height = 500;\\n  return (\\n    <div className=\\\"echChart\\\">\\n      <div className=\\\"echChartStatus\\\" data-ech-render-complete={true} />\\n      <div>\\n        <label style={{ display: 'inline-block', width: 200 }}> Max Line Width [{maxLineWidth}px]</label>\\n        <input\\n          type=\\\"range\\\"\\n          min={0}\\n          max={width}\\n          value={maxLineWidth}\\n          className=\\\"slider\\\"\\n          id=\\\"maxLineWidth\\\"\\n          onInput={(e) => setMaxLineWidth(Number(e.currentTarget.value))}\\n        />\\n        <br />\\n        <label style={{ display: 'inline-block', width: 200 }}> Max Lines [{maxLines}]</label>\\n        <input\\n          type=\\\"range\\\"\\n          min=\\\"0\\\"\\n          max=\\\"10\\\"\\n          value={maxLines}\\n          className=\\\"slider\\\"\\n          id=\\\"maxLines\\\"\\n          onInput={(e) => setMaxLines(Number(e.currentTarget.value))}\\n        />\\n        <div\\n          style={{\\n            margin: '20px 0',\\n          }}\\n        >\\n          <p>HTML Text (editable)</p>\\n\\n          <textarea\\n            style={{\\n              padding: 0,\\n              margin: 0,\\n              width: maxLineWidth,\\n              height: maxLines * fontSize,\\n              fontSize,\\n              overflow: 'hidden',\\n              fontFamily: font.fontFamily,\\n              fontStyle: font.fontStyle,\\n              fontVariant: font.fontVariant,\\n              lineHeight: `${fontSize}px`,\\n              resize: 'none',\\n              textOverflow: 'ellipsis',\\n            }}\\n            value={text}\\n            onInput={(e) => setText(e.currentTarget.value)}\\n          />\\n        </div>\\n\\n        <p>Canvas Text</p>\\n        <canvas\\n          ref={canvasRef}\\n          width={width * window.devicePixelRatio}\\n          height={height * window.devicePixelRatio}\\n          style={{ width, height }}\\n        />\\n      </div>\\n    </div>\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":28},\"endLoc\":{\"col\":1,\"line\":121},\"startBody\":{\"col\":23,\"line\":28},\"endBody\":{\"col\":1,\"line\":121}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { Font, cssFontShorthand } from '@elastic/charts/src/common/text_utils';\nimport { withContext } from '@elastic/charts/src/renderers/canvas';\nimport { withTextMeasure } from '@elastic/charts/src/utils/bbox/canvas_text_bbox_calculator';\nimport { wrapText } from '@elastic/charts/src/utils/text/wrap';\n\nconst fontSize = 24;\nconst font: Font = {\n  fontStyle: 'normal',\n  fontFamily: 'sans-serif',\n  fontVariant: 'normal',\n  fontWeight: 500,\n  textColor: 'red',\n};\nconst fontStyle = cssFontShorthand(font, fontSize);\nconst defaultText =\n  'Bacon ipsum dolor amet mongoloadgendecoblue58d844d55c-9c24dtip flank kielbasa. Pork strip steak jowl chuck filet mignon, burgdoggen kevin tail.';\n\nexport const Example = () => {\n  const [maxLineWidth, setMaxLineWidth] = useState(250);\n  const [maxLines, setMaxLines] = useState(3);\n  const [text, setText] = useState(defaultText);\n  const canvasRef = useRef<HTMLCanvasElement>(null);\n\n  useEffect(() => {\n    const canvas = canvasRef.current!;\n    const ctx = canvas.getContext('2d')!;\n\n    withContext(ctx, () => {\n      ctx.scale(window.devicePixelRatio, window.devicePixelRatio);\n      ctx.fillStyle = 'white';\n      ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n      ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n\n      ctx.font = fontStyle;\n      ctx.textBaseline = 'top';\n      ctx.strokeStyle = 'black';\n      ctx.fillStyle = 'black';\n      ctx.strokeRect(0, 0, maxLineWidth, fontSize * maxLines);\n      withTextMeasure((measure) => {\n        const lines = wrapText(text, font, fontSize, maxLineWidth, maxLines, measure, 'en');\n        lines.forEach((line, i) => {\n          ctx.fillText(line, 0, i * fontSize);\n        });\n      });\n    });\n  }, [text, maxLineWidth, maxLines]);\n  const width = 500;\n  const height = 500;\n  return (\n    <div className=\"echChart\">\n      <div className=\"echChartStatus\" data-ech-render-complete={true} />\n      <div>\n        <label style={{ display: 'inline-block', width: 200 }}> Max Line Width [{maxLineWidth}px]</label>\n        <input\n          type=\"range\"\n          min={0}\n          max={width}\n          value={maxLineWidth}\n          className=\"slider\"\n          id=\"maxLineWidth\"\n          onInput={(e) => setMaxLineWidth(Number(e.currentTarget.value))}\n        />\n        <br />\n        <label style={{ display: 'inline-block', width: 200 }}> Max Lines [{maxLines}]</label>\n        <input\n          type=\"range\"\n          min=\"0\"\n          max=\"10\"\n          value={maxLines}\n          className=\"slider\"\n          id=\"maxLines\"\n          onInput={(e) => setMaxLines(Number(e.currentTarget.value))}\n        />\n        <div\n          style={{\n            margin: '20px 0',\n          }}\n        >\n          <p>HTML Text (editable)</p>\n\n          <textarea\n            style={{\n              padding: 0,\n              margin: 0,\n              width: maxLineWidth,\n              height: maxLines * fontSize,\n              fontSize,\n              overflow: 'hidden',\n              fontFamily: font.fontFamily,\n              fontStyle: font.fontStyle,\n              fontVariant: font.fontVariant,\n              lineHeight: `${fontSize}px`,\n              resize: 'none',\n              textOverflow: 'ellipsis',\n            }}\n            value={text}\n            onInput={(e) => setText(e.currentTarget.value)}\n          />\n        </div>\n\n        <p>Canvas Text</p>\n        <canvas\n          ref={canvasRef}\n          width={width * window.devicePixelRatio}\n          height={height * window.devicePixelRatio}\n          style={{ width, height }}\n        />\n      </div>\n    </div>\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const [maxLineWidth, setMaxLineWidth] = useState(250);\\n  const [maxLines, setMaxLines] = useState(3);\\n  const [text, setText] = useState(defaultText);\\n  const canvasRef = useRef<HTMLCanvasElement>(null);\\n\\n  useEffect(() => {\\n    const canvas = canvasRef.current!;\\n    const ctx = canvas.getContext('2d')!;\\n\\n    withContext(ctx, () => {\\n      ctx.scale(window.devicePixelRatio, window.devicePixelRatio);\\n      ctx.fillStyle = 'white';\\n      ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\\n      ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);\\n\\n      ctx.font = fontStyle;\\n      ctx.textBaseline = 'top';\\n      ctx.strokeStyle = 'black';\\n      ctx.fillStyle = 'black';\\n      ctx.strokeRect(0, 0, maxLineWidth, fontSize * maxLines);\\n      withTextMeasure((measure) => {\\n        const lines = wrapText(text, font, fontSize, maxLineWidth, maxLines, measure, 'en');\\n        lines.forEach((line, i) => {\\n          ctx.fillText(line, 0, i * fontSize);\\n        });\\n      });\\n    });\\n  }, [text, maxLineWidth, maxLines]);\\n  const width = 500;\\n  const height = 500;\\n  return (\\n    <div className=\\\"echChart\\\">\\n      <div className=\\\"echChartStatus\\\" data-ech-render-complete={true} />\\n      <div>\\n        <label style={{ display: 'inline-block', width: 200 }}> Max Line Width [{maxLineWidth}px]</label>\\n        <input\\n          type=\\\"range\\\"\\n          min={0}\\n          max={width}\\n          value={maxLineWidth}\\n          className=\\\"slider\\\"\\n          id=\\\"maxLineWidth\\\"\\n          onInput={(e) => setMaxLineWidth(Number(e.currentTarget.value))}\\n        />\\n        <br />\\n        <label style={{ display: 'inline-block', width: 200 }}> Max Lines [{maxLines}]</label>\\n        <input\\n          type=\\\"range\\\"\\n          min=\\\"0\\\"\\n          max=\\\"10\\\"\\n          value={maxLines}\\n          className=\\\"slider\\\"\\n          id=\\\"maxLines\\\"\\n          onInput={(e) => setMaxLines(Number(e.currentTarget.value))}\\n        />\\n        <div\\n          style={{\\n            margin: '20px 0',\\n          }}\\n        >\\n          <p>HTML Text (editable)</p>\\n\\n          <textarea\\n            style={{\\n              padding: 0,\\n              margin: 0,\\n              width: maxLineWidth,\\n              height: maxLines * fontSize,\\n              fontSize,\\n              overflow: 'hidden',\\n              fontFamily: font.fontFamily,\\n              fontStyle: font.fontStyle,\\n              fontVariant: font.fontVariant,\\n              lineHeight: `${fontSize}px`,\\n              resize: 'none',\\n              textOverflow: 'ellipsis',\\n            }}\\n            value={text}\\n            onInput={(e) => setText(e.currentTarget.value)}\\n          />\\n        </div>\\n\\n        <p>Canvas Text</p>\\n        <canvas\\n          ref={canvasRef}\\n          width={width * window.devicePixelRatio}\\n          height={height * window.devicePixelRatio}\\n          style={{ width, height }}\\n        />\\n      </div>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport { Example as wrap } from './1_wrap.story';\n\nexport default {\n  title: 'Utils/Text',\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, button } from '@storybook/addon-knobs';\nimport { useEffect, useCallback, useState } from 'react';\n\nimport { ElementClickListener, HeatmapBrushEvent, HeatmapElementEvent, HeatmapHighlightedData } from '@elastic/charts';\n\nexport const useHeatmapSelection = (disableActions = false) => {\n  const [selection, setSelection] = useState<HeatmapHighlightedData | undefined>();\n  const clearSelection = useCallback(() => setSelection(undefined), []);\n  const onElementClick: ElementClickListener = useCallback(\n    (e) => {\n      if (!disableActions) action('onElementClick')(e);\n      const { x, y, smHorizontalAccessorValue, smVerticalAccessorValue } = (e as HeatmapElementEvent[])[0][0].datum;\n      setSelection({\n        x: [x],\n        y: [y],\n        smHorizontalAccessorValue,\n        smVerticalAccessorValue,\n      });\n    },\n    [disableActions],\n  );\n  const onBrushEnd = useCallback(\n    (e) => {\n      if (!disableActions) action('brushEvent')(e);\n      setSelection(e as HeatmapBrushEvent);\n    },\n    [disableActions],\n  );\n  useEffect(() => {\n    document.addEventListener('keyup', ({ key }) => {\n      if (key === 'Escape') clearSelection();\n    });\n  }, [clearSelection]);\n\n  const persistCellsSelection = boolean('Persist cells selection', true);\n  button('Clear cells selection', clearSelection);\n\n  return {\n    selection,\n    setSelection,\n    onBrushEnd,\n    onElementClick,\n    clearSelection,\n    highlightedData: persistCellsSelection ? selection : undefined,\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport _, { Dictionary, NumericDictionary } from 'lodash';\nimport seedrandom from 'seedrandom';\n\nimport { BandFillColorAccessorInput } from '@elastic/charts';\nimport { arrayToLookup, hueInterpolator } from '@elastic/charts/src/common/color_calcs';\nimport { Color } from '@elastic/charts/src/common/colors';\nimport {\n  countryDimension,\n  productDimension,\n  regionDimension,\n  productPriceNames,\n} from '@elastic/charts/src/mocks/hierarchical/dimension_codes';\nimport { palettes } from '@elastic/charts/src/mocks/hierarchical/palettes';\nimport { getRNGSeed } from '@elastic/charts/src/mocks/utils';\n\nexport const productLookup = arrayToLookup((d: any) => d.sitc1, productDimension);\nexport const regionLookup = arrayToLookup((d: any) => d.region, regionDimension);\nexport const countryLookup = arrayToLookup((d: any) => d.country, countryDimension);\nexport const productPriceLookup = arrayToLookup((d: any) => d.products_price, productPriceNames);\n\ntype ColorMaker = (x: number) => string;\n\nexport const getBandFillColorFn =\n  (colorMap: { [k: number]: Color }) =>\n  ({ value: x }: BandFillColorAccessorInput): Color =>\n    colorMap[x];\n\n// interpolation based, cyclical color example\nexport const interpolatorCET2s = (opacity = 0.7) =>\n  hueInterpolator(palettes.CET2s.map(([r, g, b]) => [r, g, b, opacity]));\nexport const interpolatorTurbo = (opacity = 0.7) =>\n  hueInterpolator(palettes.turbo.map(([r, g, b]) => [r, g, b, opacity]));\nexport const indexInterpolatedFillColor = (colorMaker: ColorMaker) => (d: any, i: number, a: any[]) =>\n  colorMaker(i / (a.length + 1));\n\n// colorbrewer2.org based, categorical color example\ntype RGBStrings = [string, string, string][];\nconst colorBrewerExportMatcher = /rgb\\((\\d{1,3}),(\\d{1,3}),(\\d{1,3})\\)/;\nconst rgbStringToTuple = (s: string) => (colorBrewerExportMatcher.exec(s) as string[]).slice(1);\nconst hexStringToTuple = (s: string) => [\n  String(parseInt(s.slice(1, 3), 16)),\n  String(parseInt(s.slice(3, 5), 16)),\n  String(parseInt(s.slice(5, 7), 16)),\n];\n\nexport const wait = <T extends () => any>(n: number, cb: T): Promise<ReturnType<T>> => {\n  return new Promise<ReturnType<T>>((resolve) => setTimeout(resolve, n)).then(cb);\n};\n\nexport const plasma18 = [\n  '#0d0887',\n  '#2f0596',\n  '#4903a0',\n  '#6100a7',\n  '#7801a8',\n  '#8e0ca4',\n  '#a21d9a',\n  '#b42e8d',\n  '#c43e7f',\n  '#d24f71',\n  '#de6164',\n  '#e97257',\n  '#f3854b',\n  '#f99a3e',\n  '#fdaf31',\n  '#fdc627',\n  '#f8df25',\n  '#f0f921',\n].map(hexStringToTuple) as RGBStrings;\n\nexport const viridis18 = [\n  '#440154',\n  '#481769',\n  '#472a7a',\n  '#433d84',\n  '#3d4e8a',\n  '#355e8d',\n  '#2e6d8e',\n  '#297b8e',\n  '#23898e',\n  '#1f978b',\n  '#21a585',\n  '#2eb37c',\n  '#46c06f',\n  '#65cb5e',\n  '#89d548',\n  '#b0dd2f',\n  '#d8e219',\n  '#fde725',\n].map(hexStringToTuple) as RGBStrings;\n\nexport const cividis18 = [\n  '#002051',\n  '#002b64',\n  '#0f356c',\n  '#23406e',\n  '#374a6e',\n  '#4b556d',\n  '#5c606e',\n  '#6c6b70',\n  '#797673',\n  '#858176',\n  '#928d78',\n  '#9f9978',\n  '#aea575',\n  '#bfb26f',\n  '#d2bf66',\n  '#e4cd5a',\n  '#f4db4e',\n  '#fdea45',\n].map(hexStringToTuple) as RGBStrings;\n\nexport const inferno18 = [\n  '#000004',\n  '#0a0722',\n  '#1e0c45',\n  '#380962',\n  '#510e6c',\n  '#69166e',\n  '#801f6c',\n  '#982766',\n  '#b0315b',\n  '#c63d4d',\n  '#d94d3d',\n  '#e9612b',\n  '#f47918',\n  '#fa9407',\n  '#fcb014',\n  '#f8cd37',\n  '#f2ea69',\n  '#fcffa4',\n].map(hexStringToTuple) as RGBStrings;\n\nexport const colorBrewerSequential9: RGBStrings = [\n  'rgb(255,247,251)',\n  'rgb(236,231,242)',\n  'rgb(208,209,230)',\n  'rgb(166,189,219)',\n  'rgb(116,169,207)',\n  'rgb(54,144,192)',\n  'rgb(5,112,176)',\n  'rgb(4,90,141)',\n  'rgb(2,56,88)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerDiverging11: RGBStrings = [\n  'rgb(158,1,66)',\n  'rgb(213,62,79)',\n  'rgb(244,109,67)',\n  'rgb(253,174,97)',\n  'rgb(254,224,139)',\n  'rgb(255,255,191)',\n  'rgb(230,245,152)',\n  'rgb(171,221,164)',\n  'rgb(102,194,165)',\n  'rgb(50,136,189)',\n  'rgb(94,79,162)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategoricalPastel9: RGBStrings = [\n  'rgb(141,211,199)',\n  'rgb(188,128,189)',\n  'rgb(190,186,218)',\n  'rgb(251,128,114)',\n  'rgb(128,177,211)',\n  'rgb(253,180,98)',\n  'rgb(179,222,105)',\n  'rgb(252,205,229)',\n  'rgb(217,217,217)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategorical12: RGBStrings = [\n  'rgb(166,206,227)',\n  'rgb(31,120,180)',\n  'rgb(178,223,138)',\n  'rgb(51,160,44)',\n  'rgb(251,154,153)',\n  'rgb(227,26,28)',\n  'rgb(253,191,111)',\n  'rgb(255,127,0)',\n  'rgb(202,178,214)',\n  'rgb(106,61,154)',\n  'rgb(255,255,153)',\n  'rgb(177,89,40)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategoricalPastel12: RGBStrings = [\n  'rgb(166,206,227)',\n  'rgb(31,120,180)',\n  'rgb(178,223,138)',\n  'rgb(51,160,44)',\n  'rgb(251,154,153)',\n  'rgb(227,26,28)',\n  'rgb(253,191,111)',\n  'rgb(255,127,0)',\n  'rgb(202,178,214)',\n  'rgb(106,61,154)',\n  'rgb(255,255,153)',\n  'rgb(177,89,40)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategoricalPastel12B: RGBStrings = [\n  'rgb(141,211,199)',\n  'rgb(255,255,179)',\n  'rgb(190,186,218)',\n  'rgb(251,128,114)',\n  'rgb(128,177,211)',\n  'rgb(253,180,98)',\n  'rgb(179,222,105)',\n  'rgb(252,205,229)',\n  'rgb(217,217,217)',\n  'rgb(188,128,189)',\n  'rgb(204,235,197)',\n  'rgb(255,237,111)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategoricalStark9: RGBStrings = [\n  'rgb(228,26,28)',\n  'rgb(55,126,184)',\n  'rgb(77,175,74)',\n  'rgb(152,78,163)',\n  'rgb(255,127,0)',\n  'rgb(255,255,51)',\n  'rgb(166,86,40)',\n  'rgb(247,129,191)',\n  'rgb(153,153,153)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const discreteColor =\n  (categoricalColors: RGBStrings, opacity = 1) =>\n  (i: number) =>\n    `rgba(${categoricalColors[i % categoricalColors.length].concat([opacity.toString()]).join(',')})`;\n\nexport const decreasingOpacityCET2 = (opacity: number) => (d: any, i: number, a: any[]) =>\n  hueInterpolator(palettes.CET2s.map(([r, g, b]) => [r, g, b, opacity]))(i / (a.length + 1));\n\nexport function sampleSize<T>(\n  collection: Dictionary<T> | NumericDictionary<T> | null | undefined,\n  n?: number,\n  seed = getRNGSeed(),\n): T[] {\n  seedrandom(seed, { global: true });\n  const lodash = _.runInContext();\n  return lodash.sampleSize(collection, n);\n}\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ArrayEntry } from '../../../packages/charts/src/chart_types/partition_chart/layout/utils/group_by_rollup';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { colorBrewerCategoricalStark9, discreteColor } from '../utils/utils';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  const ascendingSort = boolean('ascending sort', false);\\n  // this is used to test the sorting capabilities\\n  const data = mocks.pie.slice(0, 4).sort(() => (rng(0, 1, 3) > 0.5 ? 1 : -1));\\n  const names: Record<string, string> = { '7': 'Al', '3': 'Au', '5': 'Ag', '8': 'Cu' };\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        theme={{\\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={showDebug}\\n        showLegend\\n        flatLegend\\n        showLegendExtra\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={PartitionLayout.waffle}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => names[d],\\n            shape: {\\n              fillColor: (nodeKey, sortIndex) => discreteColor(colorBrewerCategoricalStark9.slice(1))(sortIndex),\\n            },\\n            sortPredicate: ascendingSort\\n              ? ([, node1]: ArrayEntry, [, node2]: ArrayEntry) => {\\n                  return node1.value - node2.value;\\n                }\\n              : undefined, // the descending sort is applied by default\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":64},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":64}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ArrayEntry } from '../../../packages/charts/src/chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { colorBrewerCategoricalStark9, discreteColor } from '../utils/utils';\n\nconst rng = getRandomNumberGenerator();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showDebug = boolean('show table for debugging', false);\n  const ascendingSort = boolean('ascending sort', false);\n  // this is used to test the sorting capabilities\n  const data = mocks.pie.slice(0, 4).sort(() => (rng(0, 1, 3) > 0.5 ? 1 : -1));\n  const names: Record<string, string> = { '7': 'Al', '3': 'Au', '5': 'Ag', '8': 'Cu' };\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings\n        theme={{\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={showDebug}\n        showLegend\n        flatLegend\n        showLegendExtra\n      />\n      <Partition\n        id=\"spec_1\"\n        data={data}\n        layout={PartitionLayout.waffle}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => names[d],\n            shape: {\n              fillColor: (nodeKey, sortIndex) => discreteColor(colorBrewerCategoricalStark9.slice(1))(sortIndex),\n            },\n            sortPredicate: ascendingSort\n              ? ([, node1]: ArrayEntry, [, node2]: ArrayEntry) => {\n                  return node1.value - node2.value;\n                }\n              : undefined, // the descending sort is applied by default\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  const ascendingSort = boolean('ascending sort', false);\\n  // this is used to test the sorting capabilities\\n  const data = mocks.pie.slice(0, 4).sort(() => (rng(0, 1, 3) > 0.5 ? 1 : -1));\\n  const names: Record<string, string> = { '7': 'Al', '3': 'Au', '5': 'Ag', '8': 'Cu' };\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        theme={{\\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={showDebug}\\n        showLegend\\n        flatLegend\\n        showLegendExtra\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={PartitionLayout.waffle}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => names[d],\\n            shape: {\\n              fillColor: (nodeKey, sortIndex) => discreteColor(colorBrewerCategoricalStark9.slice(1))(sortIndex),\\n            },\\n            sortPredicate: ascendingSort\\n              ? ([, node1]: ArrayEntry, [, node2]: ArrayEntry) => {\\n                  return node1.value - node2.value;\\n                }\\n              : undefined, // the descending sort is applied by default\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { colorBrewerCategoricalStark9, discreteColor, productPriceLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useOpaqueColor = boolean('use alpha', false);\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        theme={{\\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        showLegend\\n        flatLegend\\n        showLegendExtra\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[\\n          { products_price: 0.0, median_day_of_week_i: 13 },\\n          { products_price: 50.0, median_day_of_week_i: 3 },\\n          { products_price: 100.0, median_day_of_week_i: 4 },\\n          { products_price: 150.0, median_day_of_week_i: 3 },\\n          { products_price: 200.0, median_day_of_week_i: 4 },\\n          { products_price: 350.0, median_day_of_week_i: 0 },\\n          { products_price: 400.0, median_day_of_week_i: 0 },\\n          { products_price: 1050.0, median_day_of_week_i: 0 },\\n        ]}\\n        layout={PartitionLayout.waffle}\\n        valueAccessor={(d: Datum) => d.median_day_of_week_i as number}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.products_price,\\n            nodeLabel: (d: Datum) => productPriceLookup[d].name,\\n            shape: {\\n              fillColor: (nodeKey, sortIndex) =>\\n                discreteColor(colorBrewerCategoricalStark9.slice(1), useOpaqueColor ? 0.5 : 1)(sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { colorBrewerCategoricalStark9, discreteColor, productPriceLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useOpaqueColor = boolean('use alpha', false);\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings\n        theme={{\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\n        }}\n        baseTheme={useBaseTheme()}\n        showLegend\n        flatLegend\n        showLegendExtra\n      />\n      <Partition\n        id=\"spec_1\"\n        data={[\n          { products_price: 0.0, median_day_of_week_i: 13 },\n          { products_price: 50.0, median_day_of_week_i: 3 },\n          { products_price: 100.0, median_day_of_week_i: 4 },\n          { products_price: 150.0, median_day_of_week_i: 3 },\n          { products_price: 200.0, median_day_of_week_i: 4 },\n          { products_price: 350.0, median_day_of_week_i: 0 },\n          { products_price: 400.0, median_day_of_week_i: 0 },\n          { products_price: 1050.0, median_day_of_week_i: 0 },\n        ]}\n        layout={PartitionLayout.waffle}\n        valueAccessor={(d: Datum) => d.median_day_of_week_i as number}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.products_price,\n            nodeLabel: (d: Datum) => productPriceLookup[d].name,\n            shape: {\n              fillColor: (nodeKey, sortIndex) =>\n                discreteColor(colorBrewerCategoricalStark9.slice(1), useOpaqueColor ? 0.5 : 1)(sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useOpaqueColor = boolean('use alpha', false);\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        theme={{\\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        showLegend\\n        flatLegend\\n        showLegendExtra\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[\\n          { products_price: 0.0, median_day_of_week_i: 13 },\\n          { products_price: 50.0, median_day_of_week_i: 3 },\\n          { products_price: 100.0, median_day_of_week_i: 4 },\\n          { products_price: 150.0, median_day_of_week_i: 3 },\\n          { products_price: 200.0, median_day_of_week_i: 4 },\\n          { products_price: 350.0, median_day_of_week_i: 0 },\\n          { products_price: 400.0, median_day_of_week_i: 0 },\\n          { products_price: 1050.0, median_day_of_week_i: 0 },\\n        ]}\\n        layout={PartitionLayout.waffle}\\n        valueAccessor={(d: Datum) => d.median_day_of_week_i as number}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.products_price,\\n            nodeLabel: (d: Datum) => productPriceLookup[d].name,\\n            shape: {\\n              fillColor: (nodeKey, sortIndex) =>\\n                discreteColor(colorBrewerCategoricalStark9.slice(1), useOpaqueColor ? 0.5 : 1)(sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Waffle (@alpha)',\n};\n\nexport { Example as simple } from './1_simple.story';\nexport { Example as test } from './2_test.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Settings, Wordcloud, FontStyle, WordcloudSpec, Color, WordCloudElementEvent } from '@elastic/charts';\\nimport { WeightFn, WordModel } from '@elastic/charts/src/chart_types/wordcloud/layout/types/viewmodel_types';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { palettes as euiPalettes } from '@elastic/charts/src/utils/themes/colors';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst text =\\n  'Webtwo ipsum sifteo twones chegg lijit meevee spotify, joukuu wakoopa greplin. Sclipo octopart wufoo, balihoo. Kiko groupon fleck revver blyve joyent dogster, zoodles zooomr scribd dogster mog. Zinch orkut jabber trulia, sclipo. Chumby imvu rovio ning zoho akismet napster, kippt zillow mzinga zoho. ' +\\n  'Zoho cotweet cloudera zinch spock divvyshot edmodo convore, geni palantir geni woopra divvyshot. Zoho imeem convore orkut oooj foodzie airbnb, jabber rovio klout spotify dropio. Insala octopart wikia xobni airbnb quora mzinga elgg, mog quora blekko boxbe plickers zlio. Sococo chumby trulia ebay sococo zoho lijit, spock nuvvo omgpop heekya koofers. Kazaa voki chegg napster mozy koofers, meebo heroku empressr foodzie. ' +\\n  // 'Meevee movity fleck waze palantir glogster ebay, scribd chegg zinch spotify. Zinch vimeo joukuu insala jaiku squidoo, kaboodle quora shopify. Imeem plickers zapier ning eskobo movity omgpop zillow, voxy knewton napster kippt quora gooru. Whrrl chegg klout hulu greplin, dogster balihoo yuntaa. Oovoo ebay kosmix eduvant meebo ning, akismet zapier meevee. Oooooc blekko cotweet nuvvo sclipo zinch movity kaboodle, zooomr insala sclipo loopt hojoki qeyno. Airbnb palantir skype, etsy. ' +\\n  // 'Joost cotweet knewton bubbli, unigo twones. Akismet skype scribd vimeo, skype omgpop kno imvu, shopify dropio. Jajah heroku xobni glogster twones jabber rovio, jaiku blippy wikia jumo oooooc. Jumo lijit tumblr jibjab zooomr sifteo hojoki mog reddit, jabber twitter zinch doostang wakoopa ebay. Yoono klout weebly geni blippy, twitter kno yoono edmodo, joyent joukuu mzinga. ' +\\n  'zappos. Ning babblely trulia zooomr vimeo, zimbra plaxo. Zooomr blyve stypi joukuu imvu chumby voxy, ideeli omgpop elgg geni qeyno joyent, loopt reddit eskobo flickr odeo. Heekya plickers wesabe lijit kno, hojoki convore.';\\n\\nconst getRandomNumber = getRandomNumberGenerator();\\n\\nconst palettes = {\\n  turquoise: (d: RawDatum, i: number) => ['#5bc0be', '#6fffe9'][i % 2],\\n  vivid: (d: RawDatum, i: number) => ['#2ec4b6', '#e71d36', '#ff9f1c'][i % 3],\\n  warm: (d: RawDatum, i: number) => ['#edc951', '#eb6841', '#cc2a36', '#4f372d', '#00a0b0'][i % 5],\\n  greenBlues: () => `rgb(${getRandomNumber(0, 10)}, ${getRandomNumber(50, 100)}, ${getRandomNumber(50, 100)})`,\\n  redBlue: () => `rgb(${getRandomNumber(100, 255)},${0},${getRandomNumber(100, 255)})`,\\n  greyScale: () => {\\n    const level = getRandomNumber(0, 200);\\n    return `rgb(${level},${level},${level})`;\\n  },\\n  weight: (d: RawDatum) => {\\n    const level = (1 - d.weight ** 15) * 200;\\n    return `rgb(${level},${level},${level})`;\\n  },\\n  colorByWordLength: (d: RawDatum) => {\\n    const level = d.text.length;\\n    return `rgb(${level < 5 ? level * 60 : level < 7 ? level * 40 : level * 25},${\\n      level < 5 ? level * 5 : level < 7 ? level * 10 : level * 5\\n    },${level < 5 ? level * 25 : level < 7 ? level * 40 : level * 15})`;\\n  },\\n  euiLight: (d: RawDatum, i: number) => {\\n    return euiPalettes.echPaletteForLightBackground.colors[i % euiPalettes.echPaletteForLightBackground.colors.length];\\n  },\\n  euiColorBlind: (d: RawDatum, i: number) => {\\n    return euiPalettes.echPaletteColorBlind.colors[i % euiPalettes.echPaletteColorBlind.colors.length];\\n  },\\n};\\n\\ntype WordcloudKnobs = Omit<WordcloudSpec, 'specType' | 'chartType' | 'data' | 'outOfRoomCallback' | 'id'> & {\\n  palette: keyof typeof palettes;\\n  backgroundColor: Color;\\n};\\n\\n// Used in e2e testing\\nexport const TEMPLATES = ['edit', 'single', 'rightAngled', 'multiple', 'squareWords', 'smallWaves', 'sparse'];\\nconst getTemplate = (name: string): WordcloudKnobs => {\\n  switch (name) {\\n    case 'single':\\n      return {\\n        spiral: 'rectangular',\\n        startAngle: 0,\\n        endAngle: 0,\\n        angleCount: 1,\\n        padding: 1,\\n        exponent: 4,\\n        fontWeight: 900,\\n        minFontSize: 14,\\n        maxFontSize: 92,\\n        fontFamily: 'Arial',\\n        fontStyle: 'normal',\\n        palette: 'greyScale',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#9fa714',\\n      };\\n    case 'rightAngled':\\n      return {\\n        spiral: 'rectangular',\\n        startAngle: 0,\\n        endAngle: 90,\\n        angleCount: 2,\\n        padding: 1,\\n        exponent: 4,\\n        fontWeight: 600,\\n        minFontSize: 14,\\n        maxFontSize: 92,\\n        fontFamily: 'Arial Narrow',\\n        fontStyle: 'normal',\\n        palette: 'euiLight',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#ffffff',\\n      };\\n    case 'multiple':\\n      return {\\n        spiral: 'archimedean',\\n        startAngle: -90,\\n        endAngle: 90,\\n        angleCount: 16,\\n        padding: 1,\\n        exponent: 15,\\n        fontWeight: 100,\\n        minFontSize: 16,\\n        maxFontSize: 50,\\n        fontFamily: 'Luminari',\\n        fontStyle: 'italic',\\n        palette: 'redBlue',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#1c1c24',\\n      };\\n    case 'squareWords':\\n      return {\\n        spiral: 'archimedean',\\n        startAngle: -45,\\n        endAngle: 45,\\n        angleCount: 2,\\n        padding: 0,\\n        exponent: 3,\\n        fontWeight: 100,\\n        minFontSize: 10,\\n        maxFontSize: 90,\\n        fontFamily: 'Arial Narrow',\\n        fontStyle: 'normal',\\n        palette: 'weight',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#4a6960',\\n      };\\n    case 'smallWaves':\\n      return {\\n        spiral: 'rectangular',\\n        startAngle: -15,\\n        endAngle: 15,\\n        angleCount: 7,\\n        padding: 0.5,\\n        exponent: 5,\\n        fontWeight: 600,\\n        minFontSize: 17,\\n        maxFontSize: 79,\\n        fontFamily: 'Impact',\\n        fontStyle: 'normal',\\n        palette: 'euiColorBlind',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#ffffff',\\n      };\\n    case 'sparse':\\n      return {\\n        spiral: 'rectangular',\\n        startAngle: 0,\\n        endAngle: 0,\\n        angleCount: 1,\\n        padding: getRandomNumber(2, 22),\\n        exponent: 15,\\n        fontWeight: 600,\\n        minFontSize: 12,\\n        maxFontSize: 60,\\n        fontFamily: 'Courier',\\n        fontStyle: 'normal',\\n        palette: 'vivid',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#1c1c24',\\n      };\\n    case 'edit':\\n    default:\\n      return {\\n        spiral: select('shape', { oval: 'archimedean', rectangular: 'rectangular' }, 'archimedean'),\\n        startAngle: number('startAngle', -90, { range: true, min: -360, max: 360, step: 1 }),\\n        endAngle: number('endAngle', 90, { range: true, min: -360, max: 360, step: 1 }),\\n        angleCount: number('angleCount', 16, { range: true, min: 2, max: 360, step: 1 }),\\n        padding: number('padding', 0.5, { range: true, min: 0, max: 10, step: 0.5 }),\\n        exponent: number('exponent', 15, { range: true, min: 0, max: 15, step: 1 }),\\n        fontWeight: number('fontWeight', 900, { range: true, min: 100, max: 900, step: 100 }),\\n        minFontSize: number('minFontSize', 15, { range: true, min: 6, max: 85, step: 1 }),\\n        maxFontSize: number('maxFontSize', 80, { range: true, min: 15, max: 150, step: 1 }),\\n        fontFamily: select(\\n          'fontFamily',\\n          {\\n            Arial: 'Arial',\\n            'Arial Narrow': 'Arial Narrow',\\n            Courier: 'Courier',\\n            Impact: 'Impact',\\n            Luminari: 'Luminari',\\n          },\\n          'Arial',\\n        ),\\n        fontStyle: select<FontStyle>('fontStyle', { normal: 'normal', italic: 'italic' }, 'italic'),\\n        palette: select(\\n          'palette',\\n          Object.keys(palettes).reduce((p, k) => ({ ...p, [k]: k }), {}),\\n          'turquoise',\\n        ),\\n        weightFn: select(\\n          'weightFn',\\n          {\\n            linear: WeightFn.linear,\\n            exponential: WeightFn.exponential,\\n            squareRoot: WeightFn.squareRoot,\\n            log: WeightFn.log,\\n          },\\n          WeightFn.exponential,\\n        ),\\n        backgroundColor: color('background', '#1c1c24'),\\n      };\\n  }\\n};\\n\\nconst rawData = text\\n  .replaceAll(/[,.]/g, '')\\n  .toLowerCase()\\n  .split(' ')\\n  .filter((d, index, a) => a.indexOf(d) === index)\\n  .map(function wordMapper(d) {\\n    return {\\n      text: d,\\n      weight: getRandomNumber(0, 1, 20),\\n    };\\n  });\\n\\ninterface RawDatum {\\n  text: string;\\n  weight: number;\\n}\\n\\nfunction sampleData(paletteName: keyof typeof palettes): WordModel[] {\\n  return rawData.map(function rawMapper(d, i) {\\n    return {\\n      ...d,\\n      color: palettes[paletteName](d, i),\\n    };\\n  });\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const configName = select(\\n    'template',\\n    TEMPLATES.reduce((p, k) => ({ ...p, [k]: k }), {}),\\n    'edit',\\n  );\\n  const { backgroundColor, palette, ...knobs } = getTemplate(configName);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{ background: { color: backgroundColor } }}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={(d) => {\\n          const datum = (d as WordCloudElementEvent[])[0][0];\\n          action('onElementClick')(`${datum.text}: ${datum.weight}`);\\n        }}\\n        onElementOver={(d) => {\\n          const datum = (d as WordCloudElementEvent[])[0][0];\\n          action('onElementOver')(`${datum.text}: ${datum.weight}`);\\n        }}\\n      />\\n      <Wordcloud\\n        id=\\\"spec_1\\\"\\n        {...knobs}\\n        data={sampleData(palette)}\\n        outOfRoomCallback={(wordCount: number, renderedWordCount: number, renderedWords: string[]) => {\\n          action('outOfRoomCallback')(\\n            `Managed to render ${renderedWordCount} words out of ${wordCount} words: ${renderedWords.join(', ')}`,\\n          );\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":239},\"endLoc\":{\"col\":1,\"line\":273},\"startBody\":{\"col\":36,\"line\":239},\"endBody\":{\"col\":1,\"line\":273}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Settings, Wordcloud, FontStyle, WordcloudSpec, Color, WordCloudElementEvent } from '@elastic/charts';\nimport { WeightFn, WordModel } from '@elastic/charts/src/chart_types/wordcloud/layout/types/viewmodel_types';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { palettes as euiPalettes } from '@elastic/charts/src/utils/themes/colors';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst text =\n  'Webtwo ipsum sifteo twones chegg lijit meevee spotify, joukuu wakoopa greplin. Sclipo octopart wufoo, balihoo. Kiko groupon fleck revver blyve joyent dogster, zoodles zooomr scribd dogster mog. Zinch orkut jabber trulia, sclipo. Chumby imvu rovio ning zoho akismet napster, kippt zillow mzinga zoho. ' +\n  'Zoho cotweet cloudera zinch spock divvyshot edmodo convore, geni palantir geni woopra divvyshot. Zoho imeem convore orkut oooj foodzie airbnb, jabber rovio klout spotify dropio. Insala octopart wikia xobni airbnb quora mzinga elgg, mog quora blekko boxbe plickers zlio. Sococo chumby trulia ebay sococo zoho lijit, spock nuvvo omgpop heekya koofers. Kazaa voki chegg napster mozy koofers, meebo heroku empressr foodzie. ' +\n  // 'Meevee movity fleck waze palantir glogster ebay, scribd chegg zinch spotify. Zinch vimeo joukuu insala jaiku squidoo, kaboodle quora shopify. Imeem plickers zapier ning eskobo movity omgpop zillow, voxy knewton napster kippt quora gooru. Whrrl chegg klout hulu greplin, dogster balihoo yuntaa. Oovoo ebay kosmix eduvant meebo ning, akismet zapier meevee. Oooooc blekko cotweet nuvvo sclipo zinch movity kaboodle, zooomr insala sclipo loopt hojoki qeyno. Airbnb palantir skype, etsy. ' +\n  // 'Joost cotweet knewton bubbli, unigo twones. Akismet skype scribd vimeo, skype omgpop kno imvu, shopify dropio. Jajah heroku xobni glogster twones jabber rovio, jaiku blippy wikia jumo oooooc. Jumo lijit tumblr jibjab zooomr sifteo hojoki mog reddit, jabber twitter zinch doostang wakoopa ebay. Yoono klout weebly geni blippy, twitter kno yoono edmodo, joyent joukuu mzinga. ' +\n  'zappos. Ning babblely trulia zooomr vimeo, zimbra plaxo. Zooomr blyve stypi joukuu imvu chumby voxy, ideeli omgpop elgg geni qeyno joyent, loopt reddit eskobo flickr odeo. Heekya plickers wesabe lijit kno, hojoki convore.';\n\nconst getRandomNumber = getRandomNumberGenerator();\n\nconst palettes = {\n  turquoise: (d: RawDatum, i: number) => ['#5bc0be', '#6fffe9'][i % 2],\n  vivid: (d: RawDatum, i: number) => ['#2ec4b6', '#e71d36', '#ff9f1c'][i % 3],\n  warm: (d: RawDatum, i: number) => ['#edc951', '#eb6841', '#cc2a36', '#4f372d', '#00a0b0'][i % 5],\n  greenBlues: () => `rgb(${getRandomNumber(0, 10)}, ${getRandomNumber(50, 100)}, ${getRandomNumber(50, 100)})`,\n  redBlue: () => `rgb(${getRandomNumber(100, 255)},${0},${getRandomNumber(100, 255)})`,\n  greyScale: () => {\n    const level = getRandomNumber(0, 200);\n    return `rgb(${level},${level},${level})`;\n  },\n  weight: (d: RawDatum) => {\n    const level = (1 - d.weight ** 15) * 200;\n    return `rgb(${level},${level},${level})`;\n  },\n  colorByWordLength: (d: RawDatum) => {\n    const level = d.text.length;\n    return `rgb(${level < 5 ? level * 60 : level < 7 ? level * 40 : level * 25},${\n      level < 5 ? level * 5 : level < 7 ? level * 10 : level * 5\n    },${level < 5 ? level * 25 : level < 7 ? level * 40 : level * 15})`;\n  },\n  euiLight: (d: RawDatum, i: number) => {\n    return euiPalettes.echPaletteForLightBackground.colors[i % euiPalettes.echPaletteForLightBackground.colors.length];\n  },\n  euiColorBlind: (d: RawDatum, i: number) => {\n    return euiPalettes.echPaletteColorBlind.colors[i % euiPalettes.echPaletteColorBlind.colors.length];\n  },\n};\n\ntype WordcloudKnobs = Omit<WordcloudSpec, 'specType' | 'chartType' | 'data' | 'outOfRoomCallback' | 'id'> & {\n  palette: keyof typeof palettes;\n  backgroundColor: Color;\n};\n\n// Used in e2e testing\nexport const TEMPLATES = ['edit', 'single', 'rightAngled', 'multiple', 'squareWords', 'smallWaves', 'sparse'];\nconst getTemplate = (name: string): WordcloudKnobs => {\n  switch (name) {\n    case 'single':\n      return {\n        spiral: 'rectangular',\n        startAngle: 0,\n        endAngle: 0,\n        angleCount: 1,\n        padding: 1,\n        exponent: 4,\n        fontWeight: 900,\n        minFontSize: 14,\n        maxFontSize: 92,\n        fontFamily: 'Arial',\n        fontStyle: 'normal',\n        palette: 'greyScale',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#9fa714',\n      };\n    case 'rightAngled':\n      return {\n        spiral: 'rectangular',\n        startAngle: 0,\n        endAngle: 90,\n        angleCount: 2,\n        padding: 1,\n        exponent: 4,\n        fontWeight: 600,\n        minFontSize: 14,\n        maxFontSize: 92,\n        fontFamily: 'Arial Narrow',\n        fontStyle: 'normal',\n        palette: 'euiLight',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#ffffff',\n      };\n    case 'multiple':\n      return {\n        spiral: 'archimedean',\n        startAngle: -90,\n        endAngle: 90,\n        angleCount: 16,\n        padding: 1,\n        exponent: 15,\n        fontWeight: 100,\n        minFontSize: 16,\n        maxFontSize: 50,\n        fontFamily: 'Luminari',\n        fontStyle: 'italic',\n        palette: 'redBlue',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#1c1c24',\n      };\n    case 'squareWords':\n      return {\n        spiral: 'archimedean',\n        startAngle: -45,\n        endAngle: 45,\n        angleCount: 2,\n        padding: 0,\n        exponent: 3,\n        fontWeight: 100,\n        minFontSize: 10,\n        maxFontSize: 90,\n        fontFamily: 'Arial Narrow',\n        fontStyle: 'normal',\n        palette: 'weight',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#4a6960',\n      };\n    case 'smallWaves':\n      return {\n        spiral: 'rectangular',\n        startAngle: -15,\n        endAngle: 15,\n        angleCount: 7,\n        padding: 0.5,\n        exponent: 5,\n        fontWeight: 600,\n        minFontSize: 17,\n        maxFontSize: 79,\n        fontFamily: 'Impact',\n        fontStyle: 'normal',\n        palette: 'euiColorBlind',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#ffffff',\n      };\n    case 'sparse':\n      return {\n        spiral: 'rectangular',\n        startAngle: 0,\n        endAngle: 0,\n        angleCount: 1,\n        padding: getRandomNumber(2, 22),\n        exponent: 15,\n        fontWeight: 600,\n        minFontSize: 12,\n        maxFontSize: 60,\n        fontFamily: 'Courier',\n        fontStyle: 'normal',\n        palette: 'vivid',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#1c1c24',\n      };\n    case 'edit':\n    default:\n      return {\n        spiral: select('shape', { oval: 'archimedean', rectangular: 'rectangular' }, 'archimedean'),\n        startAngle: number('startAngle', -90, { range: true, min: -360, max: 360, step: 1 }),\n        endAngle: number('endAngle', 90, { range: true, min: -360, max: 360, step: 1 }),\n        angleCount: number('angleCount', 16, { range: true, min: 2, max: 360, step: 1 }),\n        padding: number('padding', 0.5, { range: true, min: 0, max: 10, step: 0.5 }),\n        exponent: number('exponent', 15, { range: true, min: 0, max: 15, step: 1 }),\n        fontWeight: number('fontWeight', 900, { range: true, min: 100, max: 900, step: 100 }),\n        minFontSize: number('minFontSize', 15, { range: true, min: 6, max: 85, step: 1 }),\n        maxFontSize: number('maxFontSize', 80, { range: true, min: 15, max: 150, step: 1 }),\n        fontFamily: select(\n          'fontFamily',\n          {\n            Arial: 'Arial',\n            'Arial Narrow': 'Arial Narrow',\n            Courier: 'Courier',\n            Impact: 'Impact',\n            Luminari: 'Luminari',\n          },\n          'Arial',\n        ),\n        fontStyle: select<FontStyle>('fontStyle', { normal: 'normal', italic: 'italic' }, 'italic'),\n        palette: select(\n          'palette',\n          Object.keys(palettes).reduce((p, k) => ({ ...p, [k]: k }), {}),\n          'turquoise',\n        ),\n        weightFn: select(\n          'weightFn',\n          {\n            linear: WeightFn.linear,\n            exponential: WeightFn.exponential,\n            squareRoot: WeightFn.squareRoot,\n            log: WeightFn.log,\n          },\n          WeightFn.exponential,\n        ),\n        backgroundColor: color('background', '#1c1c24'),\n      };\n  }\n};\n\nconst rawData = text\n  .replaceAll(/[,.]/g, '')\n  .toLowerCase()\n  .split(' ')\n  .filter((d, index, a) => a.indexOf(d) === index)\n  .map(function wordMapper(d) {\n    return {\n      text: d,\n      weight: getRandomNumber(0, 1, 20),\n    };\n  });\n\ninterface RawDatum {\n  text: string;\n  weight: number;\n}\n\nfunction sampleData(paletteName: keyof typeof palettes): WordModel[] {\n  return rawData.map(function rawMapper(d, i) {\n    return {\n      ...d,\n      color: palettes[paletteName](d, i),\n    };\n  });\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const configName = select(\n    'template',\n    TEMPLATES.reduce((p, k) => ({ ...p, [k]: k }), {}),\n    'edit',\n  );\n  const { backgroundColor, palette, ...knobs } = getTemplate(configName);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{ background: { color: backgroundColor } }}\n        baseTheme={useBaseTheme()}\n        onElementClick={(d) => {\n          const datum = (d as WordCloudElementEvent[])[0][0];\n          action('onElementClick')(`${datum.text}: ${datum.weight}`);\n        }}\n        onElementOver={(d) => {\n          const datum = (d as WordCloudElementEvent[])[0][0];\n          action('onElementOver')(`${datum.text}: ${datum.weight}`);\n        }}\n      />\n      <Wordcloud\n        id=\"spec_1\"\n        {...knobs}\n        data={sampleData(palette)}\n        outOfRoomCallback={(wordCount: number, renderedWordCount: number, renderedWords: string[]) => {\n          action('outOfRoomCallback')(\n            `Managed to render ${renderedWordCount} words out of ${wordCount} words: ${renderedWords.join(', ')}`,\n          );\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const configName = select(\\n    'template',\\n    TEMPLATES.reduce((p, k) => ({ ...p, [k]: k }), {}),\\n    'edit',\\n  );\\n  const { backgroundColor, palette, ...knobs } = getTemplate(configName);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{ background: { color: backgroundColor } }}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={(d) => {\\n          const datum = (d as WordCloudElementEvent[])[0][0];\\n          action('onElementClick')(`${datum.text}: ${datum.weight}`);\\n        }}\\n        onElementOver={(d) => {\\n          const datum = (d as WordCloudElementEvent[])[0][0];\\n          action('onElementOver')(`${datum.text}: ${datum.weight}`);\\n        }}\\n      />\\n      <Wordcloud\\n        id=\\\"spec_1\\\"\\n        {...knobs}\\n        data={sampleData(palette)}\\n        outOfRoomCallback={(wordCount: number, renderedWordCount: number, renderedWords: string[]) => {\\n          action('outOfRoomCallback')(\\n            `Managed to render ${renderedWordCount} words out of ${wordCount} words: ${renderedWords.join(', ')}`,\\n          );\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Wordcloud (@alpha)',\n};\n\nexport { Example as simpleWordcloud } from './1_wordcloud.story';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiProvider, EuiMarkdownFormat, EuiFlexGroup, EuiFlexItem, EuiHorizontalRule, EuiText } from '@elastic/eui';\nimport { DecoratorFunction } from '@storybook/addons';\nimport classNames from 'classnames';\nimport React, { CSSProperties, FC, PropsWithChildren } from 'react';\n\nimport { StoryGlobals, StoryParameters } from './types';\nimport { ThemeId, ThemeIdProvider, BackgroundIdProvider } from './use_base_theme';\n\nconst ResizeWrapper: FC<PropsWithChildren<{ resize: StoryParameters['resize'] }>> = ({ resize, children }) =>\n  resize ? (\n    <div id=\"story-resize-wrapper\" style={resize === true ? {} : resize}>\n      {children}\n    </div>\n  ) : (\n    <>{children}</>\n  );\n\nexport const StoryWrapper: DecoratorFunction<JSX.Element> = (Story, context) => {\n  if (!Story) return <div>No Story</div>;\n\n  const globals = (context.globals as StoryGlobals) ?? {};\n  const parameters = (context.parameters as StoryParameters) ?? {};\n\n  const themeId = (globals.theme as ThemeId) ?? ThemeId.Light;\n  const backgroundId = globals.background;\n  const {\n    showHeader = false,\n    showChartTitle = false,\n    showChartDescription = false,\n    showChartBoundary = false,\n  } = globals.toggles ?? {};\n  const { markdown, resize } = parameters;\n  const colorMode = themeId.includes('light') ? 'light' : 'dark';\n\n  return (\n    <EuiProvider colorMode={colorMode}>\n      <ThemeIdProvider value={themeId}>\n        <BackgroundIdProvider value={backgroundId}>\n          <EuiFlexGroup gutterSize=\"none\" direction=\"column\" responsive={false}>\n            {showHeader && !showChartTitle && !showChartDescription && (\n              <EuiFlexItem id=\"story-header\" grow={false}>\n                <EuiFlexGroup gutterSize=\"none\" direction=\"column\" responsive={false}>\n                  <EuiFlexItem>\n                    <EuiText>\n                      <h1 style={{ fontWeight: 200 }}>{context.kind}</h1>\n                    </EuiText>\n                  </EuiFlexItem>\n\n                  <EuiFlexItem>\n                    <EuiText>\n                      <h2 style={{ fontWeight: 400 }}>{context.name}</h2>\n                    </EuiText>\n                  </EuiFlexItem>\n\n                  <EuiHorizontalRule />\n                </EuiFlexGroup>\n              </EuiFlexItem>\n            )}\n\n            <EuiFlexItem grow={false}>\n              <div\n                id=\"story-root\"\n                className={classNames({\n                  showChartBoundary,\n                  resizeHeight: (resize as CSSProperties)?.height === undefined,\n                })}\n              >\n                <ResizeWrapper resize={resize}>\n                  <Story\n                    {...context}\n                    title={showChartTitle ? context.kind : undefined}\n                    description={showChartDescription ? context.name : undefined}\n                  />\n                </ResizeWrapper>\n              </div>\n            </EuiFlexItem>\n            {markdown && (\n              <EuiFlexItem style={{ padding: 24 }}>\n                <EuiMarkdownFormat>{markdown}</EuiMarkdownFormat>\n              </EuiFlexItem>\n            )}\n          </EuiFlexGroup>\n        </BackgroundIdProvider>\n      </ThemeIdProvider>\n    </EuiProvider>\n  );\n};\n","import '@storybook/react';","var api = require(\"!../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n            var content = require(\"!!../node_modules/css-loader/dist/cjs.js??ref--17-1!../node_modules/postcss-loader/dist/cjs.js??ref--17-2!../node_modules/sass-loader/dist/cjs.js??ref--17-3!./style.scss\");\n\n            content = content.__esModule ? content.default : content;\n\n            if (typeof content === 'string') {\n              content = [[module.id, content, '']];\n            }\n\nvar options = {\"attributes\":{\"nonce\":\"Pk1rZ1XDlMuYe8ubWV3Lh0BzwrTigJQ=\"}};\n\noptions.insert = \"head\";\noptions.singleton = false;\n\nvar update = api(content, options);\n\n\n\nmodule.exports = content.locals || {};","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { createContext, useContext } from 'react';\nimport { $Values } from 'utility-types';\n\nimport {\n  Theme,\n  LIGHT_THEME,\n  DARK_THEME,\n  LEGACY_CHART_MARGINS,\n  LEGACY_DARK_THEME,\n  LEGACY_LIGHT_THEME,\n} from '@elastic/charts';\nimport { mergePartial } from '@elastic/charts/src/utils/common';\n\nimport { storybookParameters } from './parameters';\n\n/**\n * Available themes\n * @internal\n */\nexport const ThemeId = Object.freeze({\n  Light: 'light' as const,\n  Dark: 'dark' as const,\n  // TODO remove legacy themes\n  LegacyLight: 'legacy-light' as const,\n  LegacyDark: 'legacy-dark' as const,\n});\n/** @internal */\nexport type ThemeId = $Values<typeof ThemeId>;\n\nconst ThemeContext = createContext<ThemeId>(ThemeId.Light);\nconst BackgroundContext = createContext<string | undefined>(undefined);\n\nexport const ThemeIdProvider = ThemeContext.Provider;\nexport const BackgroundIdProvider = BackgroundContext.Provider;\n\nconst themeMap = {\n  [ThemeId.Light]: LIGHT_THEME,\n  [ThemeId.Dark]: DARK_THEME,\n  [ThemeId.LegacyLight]: LEGACY_LIGHT_THEME,\n  [ThemeId.LegacyDark]: LEGACY_DARK_THEME,\n};\n\nconst getBackground = (backgroundId?: string) => {\n  if (!backgroundId) {\n    return undefined;\n  }\n  const option = (storybookParameters?.background?.options ?? []).find(({ id }) => id === backgroundId);\n  return option?.background ?? option?.color;\n};\n\nexport const useThemeId = (): ThemeId => {\n  return useContext(ThemeContext);\n};\n\nexport const useBaseTheme = (): Theme => {\n  const themeId = useThemeId();\n  const backgroundId = useContext(BackgroundContext);\n  const theme = themeMap[themeId] ?? LIGHT_THEME;\n  const backgroundColor = getBackground(backgroundId);\n\n  return mergePartial(theme, {\n    // Keep this just for consistency for the first pass of theme changes\n    chartMargins: LEGACY_CHART_MARGINS,\n    background: { color: backgroundColor },\n  });\n};\n","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;AC92HA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;ACNA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;ACNA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;ACfA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACnSA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAHA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAWA;AACA;;;AA5BA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAOA;AACA;AACA;AACA;AAFA;AAIA;;;AAEA;AACA;AACA;;;;;;AA5CA;;;;;;;;;;;;;;AC5BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAiBA;AACA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAOA;AACA;AACA;AAEA;AAKA;AAIA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AALA;AAQA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAnIA;AAqIA;AACA;AACA;AAlKA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AA+BA;;;;;AAKA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AAHA;AAIA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAHA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;;;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAoBA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AATA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAtBA;AAyBA;AApDA;AA2DA;;;;AA/IA;AACA;AAAA;AACA;AAgJA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAtBA;AACA;AAwBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAfA;AAoBA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC3RA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA3HA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAOA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAOA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;;;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAtFA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;;;ACVA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAOA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAMA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAOA;AACA;AAMA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;;;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AAxGA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;AACA;AACA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAaA;AACA;AACA;AADA;;;AAGA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAFA;AAKA;AAEA;AAEA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AAKA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AA1FA;AA4FA;;;;;;;;;;;;;;ACrKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AASA;AACA;AACA;AADA;AAGA;AACA;AAEA;AAAA;AAAA;AAEA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAFA;AAIA;AAXA;AAaA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;AAEA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAiDA;AAQA;AAQA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAAA;;;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AACA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AASA;AAYA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AASA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AA9BA;AAgCA;AACA;AACA;AACA;AACA;AACA;AACA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AArBA;AAuBA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAKA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;;;;;;;;;;;;;;AC/QA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAsBA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAFA;AAKA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AAFA;AAhBA;AAsBA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AACA;AAMA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AA/EA;AAiFA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAIA;;;;;;;;;;;;;;ACnNA;;;;;;AAMA;AACA;;;;;;;;AAEA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;AAGA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAVA;AAaA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAVA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAXA;AAaA;AACA;AACA;AACA;;;;;;;;;;;;;;AC9EA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;AAKA;AACA;AACA;AACA;AAAA;AACA;AAAA;AA8BA;AACA;AACA;AADA;AACA;AACA;AACA;AAAA;;;;AAIA;AACA;AACA;AACA;AAVA;AAiCA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AAHA;AAFA;AACA;AADA;AAUA;AAEA;AACA;AAFA;AAOA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AAEA;AAMA;AACA;AACA;AApBA;;;;;;;;;;;;;;ACvGA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAGA;AAiBA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AAFA;AAIA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAGA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AAGA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAEA;AAFA;AAIA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC9IA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAMA;AACA;AAAA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;AAMA;AACA;AAAA;;;AAIA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACpDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AARA;AACA;AAuDA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAOA;AACA;AACA;AAGA;AADA;AAFA;AAAA;AACA;AACA;AAKA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAfA;AAAA;AACA;AAoBA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AACA;AACA;AACA;AADA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AACA;AAAA;AAIA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAnCA;AACA;AA8CA;AACA;AAAA;AAUA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAnBA;AACA;AAmBA;AAKA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;;;;;;;;;;;;;;AC3WA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAcA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAAA;AACA;AAqEA;AAEA;AACA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAQA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AADA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AAAA;AACA;AAKA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAkCA;;;;;AA2DA;AAAA;AACA;AADA;AACA;;;AAAA;AACA;AAzDA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAGA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AA6CA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AA6DA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AACA;AADA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;;AACA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AACA;AAAA;AACA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AACA;AAyBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAmCA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AADA;AACA;AACA;AADA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAOA;AAOA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AAQA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAfA;AAmBA;AACA;AACA;AAFA;AADA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAFA;AAmBA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAFA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAFA;AAeA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAbA;AAsBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAFA;AAeA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAFA;AAgBA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAFA;AAeA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAFA;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAFA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AAaA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAFA;AAIA;AApBA;AAwBA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AACA;AAAA;AAIA;AAMA;AACA;AAWA;AACA;AAEA;AACA;AAmBA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAIA;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;;;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAIA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAzmCA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AAEA;AAEA;AAEA;AAGA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAtCA;AAuCA;AACA;;;AAwBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AAEA;AACA;AACA;;;AAgDA;;;AACA;AACA;;;AAOA;AAAA;AAAA;AACA;AACA;;;AA0BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AAuBA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AARA;AAYA;AACA;AAAA;AACA;;;AA2VA;AACA;AACA;AACA;AACA;AACA;;;AAuUA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;;AArgCA;AACA;AAAA;AAqdA;AACA;AAitBA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAjBA;AAkBA;AACA;AACA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AACA;AADA;;;;;;;;;;;;;;;ACv3CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAOA;AACA;;;AAPA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AA5BA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AACA;AADA;AACA;AANA;AACA;AACA;AA0BA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AA5CA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAYA;AACA;AACA;AACA;;;;;;AA1CA;AAqDA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;;AARA;AACA;AADA;AAWA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;;AARA;AACA;AADA;AAWA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAlCA;AACA;AADA;AAqCA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAEA;;;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;;AAlCA;AACA;AADA;;;;;;;;;;;;;;AC/IA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAoBA;AAEA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AAEA;AAAA;AACA;AACA;AAAA;AAWA;AAXA;AACA;AAmBA;AAAA;AAiBA;AAjBA;AACA;AACA;AAmBA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AAcA;AACA;AAaA;AACA;AAaA;AACA;AAaA;AACA;AACA;AAaA;AACA;AACA;AAaA;AACA;AAaA;AACA;AAaA;AACA;AAGA;AACA;AAUA;AACA;AAGA;AACA;AAUA;AACA;AAaA;AACA;AAEA;AACA;AAaA;AAYA;AAxRA;AACA;AAFA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AADA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA/EA;AAgFA;AACA;AAAA;AAWA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AArCA;;;;;;;;;;;;;;AC5GA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAmBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AAIA;AACA;AACA;AACA;AAJA;AAxBA;AAlBA;AACA;AADA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAIA;AAEA;;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAEA;;AAEA;AACA;AACA;AAOA;AAOA;;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAhDA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAMA;AAAA;AAAA;AAKA;AAAA;AAAA;AAQA;AAAA;AAAA;AAeA;AAAA;AAAA;AAOA;AAAA;AAAA;AASA;AAAA;AAAA;AAQA;AAAA;AAAA;AA2CA;AACA;AAAA;AAkBA;AACA;AAAA;AAsCA;AACA;AAAA;AAiBA;AACA;AAAA;;;;;;;;;;;;;;ACtMA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAsBA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AA6CA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAbA;AAgBA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAhBA;AAmBA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACxGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AASA;AACA;AACA;AADA;AASA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAOA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AAlDA;AAqDA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAYA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAEA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AArFA;AAwFA;AACA;AAAA;AAWA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;;;;AAzDA;AACA;AA2DA;AACA;AACA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAQA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAFA;AAOA;AAEA;AAOA;AAKA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AAPA;AAAA;AAUA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAOA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAHA;AAAA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AANA;AAHA;AAAA;AAaA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AAHA;AAcA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AAHA;AAgBA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AALA;AAHA;AAYA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AALA;AAHA;AAeA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAGA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArQA;;;;;;;;;;;;;;AC7OA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAGA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AAVA;AAWA;;;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;AC1GA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAGA;AAGA;AACA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AACA;AACA;AACA;AAEA;AACA;AAIA;AACA;AACA;AAHA;AAMA;AADA;AAKA;AAIA;AACA;AACA;AAHA;AAMA;AADA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAHA;AAAA;AAKA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAFA;AAAA;AAIA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AA1BA;AACA;AA4BA;AAAA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AA/GA;AACA;AA+GA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACtIA;;;;;;AAMA;AACA;;;;;;;;;;;;AAEA;AAGA;AACA;AACA;AADA;AACA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAuBA;;;;;AASA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AAHA;AAIA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAXA;AAcA;AAAA;AAAA;AAIA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;;AArGA;AACA;AAAA;AACA;AAsGA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAdA;AACA;AAgBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACzMA;;;;;;AAMA;AACA;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AA+DA;AAEA;AACA;AAFA;AASA;;;;AAIA;AACA;AAAA;;;AASA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAMA;AACA;AACA;AAMA;AACA;AACA;AAjCA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AASA;AAAA;AACA;AATA;AACA;AAoHA;AAAA;AAAA;AACA;AA7GA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAEA;AAAA;AACA;AAAA;AAGA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AAnHA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACrCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;AACA;AACA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAgBA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AAAA;AAAA;AAAA;AAAA;AAOA;AARA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAGA;AACA;AACA;AAAA;AACA;AAGA;AAGA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;;;;;;;;;;;;;;ACnEA;;;;;;AAMA;AACA;;;;;;;;AAIA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA;AACA;AAIA;;;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAFA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAXA;AAaA;AAEA;AACA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAOA;AA4DA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAgDA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AARA;AAAA;AACA;AADA;;;;;;;;;;;;;;AC9HA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAGA;AAKA;AACA;AACA;AADA;AAWA;AACA;AAYA;AACA;AACA;AA1BA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AA6BA;AAKA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAOA;AACA;AAEA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAKA;AACA;AAEA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AALA;AAOA;AAEA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAEA;AAOA;AAGA;AAEA;AAEA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AApBA;AAsBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AAGA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;;;AACA;AAMA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AACA;AACA;AAIA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAIA;AAEA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAEA;;;;AAIA;AACA;AACA;AADA;;;AAMA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAVA;AAAA;AACA;AAWA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAKA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;;;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAFA;AADA;AAYA;AACA;AAbA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AAPA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAWA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AAPA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAFA;AAHA;AAQA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAnBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AAzGA;AA2GA;AACA;AA7fA;AACA;AA6fA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AACA;AAGA;AAMA;AACA;AACA;;;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAPA;AASA;AACA;;;;;;;;;;;;;;ACjnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAMA;AAEA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAbA;AAAA;AAgBA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AAGA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAFA;AAGA;AAAA;AACA;AAJA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAOA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAMA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAEA;AAAA;AAJA;AAMA;AAEA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAMA;AACA;AAPA;AAWA;AACA;AACA;AAtBA;AAwBA;AACA;AACA;AA/KA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAuBA;;;;;AASA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AAHA;AAIA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAVA;AAgBA;;;;AAjFA;AACA;AAAA;AACA;AAkFA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAMA;AAnBA;AACA;AAqBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC9LA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAIA;AAEA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAeA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAFA;AAKA;AAAA;AAAA;AACA;AAEA;AAFA;AAIA;AAAA;AAAA;AAAA;AACA;AACA;AAdA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;AAGA;;;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;;;;AAhBA;AACA;AAAA;AACA;AAiBA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AAaA;;;;AAIA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAIA;AACA;AACA;AACA;AACA;AALA;AAYA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AALA;AAeA;AACA;AACA;AACA;AACA;AACA;AANA;AAaA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAaA;AACA;AAtGA;AAuGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAZA;;;;;;;;;;;;;;ACvIA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AClDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;;;AAKA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAlBA;AACA;AAkBA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACpDA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AAEA;AAkFA;AACA;AACA;AADA;AAEA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAoBA;;;AAGA;AACA;AAAA;AASA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACrIA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;;;;;;;;;;;;;ACRA;;;;;;AAMA;AACA;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAEA;AAEA;AAEA;AAEA;AACA;AAyFA;AAAA;AAAA;AACA;AACA;;;AA1FA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAEA;AAAA;AACA;AAAA;AAMA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AAnGA;;;;;;;;;;;;;;AC3CA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAEA;;;AACA;AACA;AACA;AAIA;AACA;AAOA;AACA;AADA;AAIA;AACA;AAOA;AAOA;AAAA;AACA;AAMA;AAOA;AAAA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;;;;;;;;;;;;;;ACjHA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAQA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAFA;AASA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAWA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AARA;AAUA;AACA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AASA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAJA;AATA;AAgBA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAGA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAeA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AACA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAkBA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AAQA;AAAA;AAGA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AAQA;AAAA;AApBA;AAwBA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAAA;AADA;AAWA;AACA;AACA;AAFA;AAZA;AA5BA;AA8CA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;;;AADA;AACA;AACA;AACA;AAHA;AAIA;AAEA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACzGA;;;;;;AAMA;AACA;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AC7CA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAcA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AACA;AASA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAHA;AAKA;;;;;;;;;;;;;;ACzHA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAAA;AACA;AAGA;;;AAGA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACtCA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AACA;;;AADA;AACA;AACA;AAFA;AAGA;AAJA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAwBA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAaA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;ACtCA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAQA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AArCA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AArCA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AArCA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AADA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAMA;;;;;;AAMA;AACA;AACA;AADA;AACA;AAEA;AACA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAIA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AApDA;;;;;;;;;;;;;;AChDA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAGA;AACA;AAAA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AACA;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AACA;AADA;;;;;;;;;;;;;;ACjCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAXA;AACA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAXA;AACA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACxGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAMA;AACA;AACA;AADA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AApBA;AAqBA;AACA;AAAA;AAKA;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AA3BA;AA4BA;AACA;AAAA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAEA;AAFA;AAAA;AACA;AAKA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AAAA;AAEA;AASA;AACA;AACA;AAGA;AACA;AAAA;AAYA;AAZA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAGA;AACA;AACA;AADA;AACA;AACA;AAnFA;AA6FA;AACA;AACA;AACA;AAAA;AAGA;AAAA;AAMA;AAzGA;AACA;AA2FA;AAAA;AACA;AADA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AACA;AACA;AAEA;AACA;AAHA;AAKA;AACA;AAvIA;AACA;AAuIA;;;AASA;AAMA;AAAA;AAAA;AACA;AACA;AAOA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAlCA;AAAA;AAAA;AACA;AACA;AAoCA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAEA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AARA;AAiBA;;;;;;;;;;;;;;AC9SA;;;;;;AAMA;AACA;;;;;;;;;AAGA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAuBA;;;;;;;;;;;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAaA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AALA;AAWA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAFA;AAIA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AAmBA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAFA;AAMA;AAEA;AArEA;AAwEA;;;;AAtHA;AACA;AAAA;AACA;AAuHA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAZA;AACA;AAcA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACpOA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAOA;AACA;AAEA;AAEA;AACA;AACA;AADA;AAgCA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAUA;AAEA;AAGA;AAGA;AACA;AACA;AAIA;AAEA;AAFA;AAKA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA/BA;AAkCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAJA;AAOA;AAAA;AAAA;AAAA;AAAA;AAtDA;AAyDA;AACA;AA/JA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAAA;AAKA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AACA;AAHA;AAOA;AACA;AAEA;AAEA;AANA;AAUA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AADA;AAFA;AASA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAPA;AAYA;AACA;AA7EA;AACA;AA6EA;AAAA;AACA;AAAA;AACA;AAIA;;;;;;;;;;;;;;ACjHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAJA;AAKA;AACA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAIA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AANA;AASA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AArDA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AASA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAEA;AAFA;AACA;AAIA;;;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AASA;AAMA;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AAcA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AASA;;;AACA;AACA;AAAA;AACA;AAEA;AASA;AAXA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AANA;AAQA;AAEA;AACA;AACA;AADA;AASA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAMA;AAEA;AACA;AAEA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AAPA;AADA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AANA;AAgBA;AAAA;AAEA;AACA;AACA;AAHA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAMA;AARA;AAcA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAOA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AARA;AAUA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAHA;AAUA;AAIA;AACA;AAAA;AAAA;AAAA;AAFA;AAKA;AACA;AACA;AACA;AAJA;AAWA;AACA;AA9IA;AACA;AA8IA;AACA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AAIA;;;;;;;;;;;;;;ACnUA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AAEA;AACA;AAAA;AAuDA;AACA;AACA;AADA;AACA;AACA;AAFA;AA0BA;AACA;AAAA;AAEA;AACA;AAFA;AAKA;AADA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAIA;AACA;AANA;AAOA;AACA;AAAA;AACA;AAKA;AACA;AAPA;;;;;;;;;;;;;;ACtIA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAWA;AACA;;;AAXA;AACA;AACA;AACA;AAFA;AAIA;;;AAEA;AACA;AACA;;;;;;AAnCA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;;;AAAA;AACA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;AAEA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;;;;;;;;;;;AAWA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAQA;AACA;AACA;AAVA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AAKA;AACA;AATA;AAUA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AACA;AACA;AAFA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAhBA;AAmBA;AACA;AACA;AACA;;;;;;AAMA;AACA;AACA;AACA;AAVA;AAFA;AAgBA;;;AAGA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAJA;AAFA;AASA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAzBA;AAFA;AAqCA;AACA;AACA;AACA;AAHA;AAjDA;AAFA;AA2DA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AADA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AA3CA;AAFA;AAiDA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA/LA;;;;;;;;;;;;;;AC9HA;;;;;;AAMA;AACA;;;;;;;;;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAcA;AACA;AAGA;AACA;AAkHA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AALA;AAfA;AAFA;AACA;AADA;AAgCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AAAA;AAAA;AAxBA;AAAA;AACA;AADA;AA2BA;AACA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AADA;AAFA;AACA;AADA;;;;;;;;;;;;;;ACvNA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAeA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAjBA;AAkBA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAGA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAZA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AAIA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAzCA;AAyCA;AACA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACpNA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAmCA;;;;AAIA;AACA;AAAA;AAEA;;;;AAIA;AACA;AAAA;AAkBA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AAAA;AAUA;AAAA;AAEA;AACA;AADA;AAGA;AACA;AACA;AACA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AA7CA;AACA;AA6CA;AAAA;AACA;AAAA;AACA;AAOA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AADA;AAKA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAQA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAjDA;AAkDA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArDA;;;;;;;;;;;;;;ACjQA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;AAQA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAHA;AAAA;AADA;AAMA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAFA;AAAA;AADA;AAKA;AACA;AACA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAFA;AAAA;AADA;AAKA;AACA;AACA;AAAA;AAEA;AAEA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAJA;AAAA;AADA;AAjCA;AAyCA;AACA;AAAA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AAxBA;AA8BA;AAEA;AACA;AAAA;AAMA;AACA;AACA;AARA;;;;;;;;;;;;;;AC1FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAaA;AACA;AACA;AADA;AAKA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AATA;AAUA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAAA;AACA;AADA;AAMA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAxBA;AAAA;AAAA;AAAA;AAAA;AACA;AAyBA;;;AAAA;AACA;AACA;AAFA;AAGA;AACA;;;;;;;;;;;;;;AC5EA;;;;;;AAMA;AACA;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAQA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AANA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AACA;AAWA;AAMA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAWA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAKA;AACA;AACA;AACA;AAEA;AAAA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAnEA;;;;;;;;;;;;;;AClHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AAQA;AAAA;AAAA;AAAA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAhDA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAUA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAUA;AAEA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AA7BA;AACA;AA6BA;AAWA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AANA;AAQA;AAEA;AACA;AACA;AADA;AAYA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AANA;AADA;AAAA;AAAA;AAAA;AACA;AAUA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAYA;AACA;AACA;AACA;AAHA;AAKA;AACA;AArDA;AACA;AAqDA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AACA;AACA;AAQA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAgBA;AAKA;AAWA;AACA;;;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AAEA;AAFA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAMA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAkBA;AAlBA;AAoBA;AACA;AACA;AACA;AACA;AAgBA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AALA;AAMA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAAA;AAOA;AAhBA;AAmBA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAYA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;;;AAiBA;AACA;AAiBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AAAA;AAKA;AACA;;;AAaA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AACA;AALA;AAQA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAzEA;;;;;;;;;;;;;;AC/dA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAQA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAKA;AACA;AAEA;;AAEA;AACA;AAAA;AAOA;AAEA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AADA;AACA;AACA;AAxBA;AACA;AAwBA;AACA;AACA;AAAA;AAAA;AADA;AAWA;AACA;AACA;AADA;AAOA;AAGA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAfA;AAgBA;;;AAGA;AACA;AAAA;AAMA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AArBA;;;;;;;;;;;;;;ACzGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AAAA;AAcA;AACA;AACA;AADA;AAaA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AADA;AAEA;AAAA;AAFA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAbA;AAgBA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AA7DA;AACA;AA6DA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA4BA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAOA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAAA;AACA;AACA;AAGA;AAGA;AAAA;AAAA;AAHA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AACA;;;;;;;;;;;;;;ACjNA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAMA;AACA;AACA;AAYA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AALA;AACA;AADA;AAOA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AAAA;AACA;AACA;AACA;AAjCA;AAkCA;AACA;AAAA;AAOA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AACA;AAUA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AACA;AA7BA;AA+BA;AACA;AA9CA;AACA;AA8CA;;;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAXA;AAaA;;;;;;;;;;;;;;ACpJA;;;;;;AAMA;AACA;;;;;;;;AAEA;AACA;AAAA;AACA;AAGA;AACA;AAOA;AACA;AACA;AACA;;;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAQA;AACA;AAWA;AACA;AACA;AAtBA;;;;;;;;;;;;;;ACrCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAMA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAUA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAWA;AACA;AAAA;AACA;AAaA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAAA;AADA;AACA;AADA;AACA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;;;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAxCA;AAyCA;AACA;AAAA;AAKA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAMA;AACA;AAAA;AAAA;AACA;AACA;AA1BA;AACA;AAkCA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAUA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAMA;AACA;AACA;AACA;AAJA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAMA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAhDA;AAkDA;AAEA;AACA;AACA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AACA;AAKA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAWA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAGA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AAOA;AAAA;AADA;AAKA;AAAA;AAGA;AACA;AAcA;AACA;AAEA;AAEA;AACA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAaA;AACA;AAFA;AAOA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA5BA;AA8BA;AACA;AAjOA;AACA;AAiOA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAeA;;;;;;;;;;;;;;AC3hBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAEA;AACA;AAEA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAtFA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAUA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAEA;AAEA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAUA;AAEA;AAEA;AACA;AACA;AAAA;AAEA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAGA;AAAA;AAAA;AAGA;AAAA;AAAA;AAGA;AAAA;AAAA;AAEA;AACA;AACA;AAjFA;;;;;;;;;;;;;;ACtQA;;;;;;AAMA;AACA;;;;;;;;;;;;;AAGA;AAEA;AACA;AAAA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAlDA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AACA;AAAA;AACA;AAqCA;;;;;AAUA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAKA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAZA;AAoBA;;;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAKA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;;AA1HA;AACA;AAAA;AACA;AA2HA;AAAA;AACA;AAAA;AADA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAdA;AACA;AAgBA;;;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACpPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAKA;AACA;AAmBA;AAQA;;;;;;;;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAKA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAJA;AAKA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAXA;AAYA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AACA;AAKA;AACA;AACA;AACA;AAJA;AAOA;AAEA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAIA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAdA;AAqBA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AApBA;AAiCA;;;AAEA;AACA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAKA;AACA;AAFA;AALA;AAcA;;;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAIA;;;;AA3GA;AACA;AADA;AACA;AA6GA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAGA;AACA;AACA;AACA;AACA;AAFA;AAIA;AATA;AAVA;AAwBA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AAVA;;;;;;;;;;;;;;AC5RA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAEA;;;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAEA;;;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAEA;AAAA;AACA;AAAA;AAKA;AACA;AAVA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAqDA;AAEA;AACA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAxBA;AA4BA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACxHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AADA;AASA;AAAA;AACA;AATA;AACA;AAgHA;AAAA;AAAA;AACA;AAzGA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AAhHA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAQA;AACA;AAEA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;;;AAEA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AAIA;AAQA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AALA;AAAA;AACA;AADA;AAMA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AARA;AAcA;AAfA;AAiBA;AACA;AACA;AAAA;AACA;AACA;AArCA;AAAA;AAAA;AAAA;AAAA;AACA;AAqCA;AACA;;;;;;;;;;;;;;AC3IA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAMA;AACA;AACA;AAEA;AAMA;AAOA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAMA;AAMA;AAMA;AAMA;AAMA;AAOA;AAOA;AAMA;AAOA;AAQA;AAEA;AAEA;AAKA;AAMA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAfA;AAuBA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AADA;AAIA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AALA;;;;;;;;;;;;;;AC/NA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;AAGA;AACA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AACA;AAGA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAjBA;AAmBA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAGA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AAAA;AACA;AADA;AAEA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AAEA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AADA;AAFA;AADA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAqBA;;AAEA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAhBA;AAkBA;AAEA;AACA;AACA;AADA;;;AAGA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAKA;;;;;;;;;;;;;;AC5EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;AAIA;AACA;AACA;AADA;AAEA;AACA;AACA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAKA;AACA;AAAA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAGA;AAGA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAWA;;;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AANA;AAQA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AAAA;AAMA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAFA;AALA;AAYA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AADA;AAAA;AAAA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACnDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AACA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAOA;AAAA;AAAA;AACA;AACA;;;AATA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AAjCA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAKA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AAlBA;AAmBA;AACA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAXA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAMA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AArBA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAQA;AACA;AAAA;AAMA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAZA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAoBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AANA;AAAA;AACA;AADA;AASA;;;;;;;;;;;;;;;;;;;;AAoBA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AAEA;AACA;AACA;AANA;AAOA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AANA;AAOA;AACA;AAAA;AAOA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAdA;AAeA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AATA;AAUA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACrMA;;;;;;AAMA;AACA;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AACA;AAKA;AACA;AACA;AADA;AAEA;AAEA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAWA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AANA;AAoCA;AACA;AAAA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AACA;AADA;AAIA;AACA;AACA;AAAA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAzBA;AA4BA;;;AAGA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;;;;;;;;;;;;;;AC3LA;;;;;;AAMA;AACA;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AAAA;AAAA;AAAA;AACA;AACA;AAnBA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;AAsBA;AACA;AAAA;;;AACA;AAIA;AACA;AANA;AAOA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAbA;AAcA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;AAIA;AACA;AAAA;AAMA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AAvBA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AAAA;AAcA;AAEA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AA/BA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AAaA;AACA;AACA;AADA;AAeA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAmBA;AAAA;AAAA;AAAA;AAAA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAxDA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAKA;AACA;AAAA;AAKA;AACA;AAAA;AAWA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAIA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AA/DA;AAAA;AAAA;AAAA;AAAA;AAgEA;AACA;AA5EA;AA6EA;AACA;AAAA;AAWA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAMA;AAQA;AACA;AAcA;AACA;AAAA;AA5DA;AACA;AADA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AA4DA;AA7DA;AAAA;AAAA;AAAA;AAAA;AA8DA;AACA;AA1EA;;;;;;;;;;;;;;ACpGA;;;;;;AAMA;AACA;;;;;;;AAMA;AACA;AAAA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA1BA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;AAGA;AACA;AAIA;AACA;AAAA;AAcA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AA7CA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAMA;AACA;AACA;AACA;AAGA;AACA;AAQA;AASA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AARA;AAAA;AACA;AADA;AAQA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AA5BA;AAAA;AAAA;AAAA;AAAA;AACA;AA4BA;AACA;AACA;AACA;AACA;AACA;AAFA;AAAA;AACA;AADA;AAEA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AATA;AAAA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AAEA;AACA;AACA;AADA;AAQA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAlBA;AACA;AAkBA;AAOA;AAAA;AACA;AADA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAQA;AACA;AACA;AAnBA;AAAA;AAAA;AAAA;AAAA;AAoBA;AAEA;AACA;AACA;AADA;AACA;AA+BA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;AAEA;AAEA;AAEA;AACA;AAMA;AAcA;AACA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AACA;AACA;AACA;AAUA;AACA;AA1IA;AACA;AAFA;;;;;;;;;;;;;;ACvIA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAmBA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAiBA;AACA;AAAA;AACA;AAAA;AACA;AAYA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AACA;AAuBA;AAAA;AACA;AAEA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAdA;AAAA;AACA;AAgBA;AAGA;AAKA;AACA;AAFA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAMA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAiBA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAoBA;AAOA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAEA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAUA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAmBA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAOA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAqBA;AACA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAIA;;;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AA9BA;;;;;;;;;;;;;;ACpfA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;AADA;AACA;AAAA;AACA;AAiBA;AAEA;AACA;AAFA;AAOA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAwBA;;;;;AAAA;AAAA;AACA;AADA;AACA;AADA;AACA;AAGA;AACA;AACA;;AACA;;;AAGA;AACA;AACA;AADA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AARA;AAaA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AA/EA;AA+EA;AACA;;;AA5DA;;;AACA;AAAA;AAAA;AACA;;;;AAtBA;AACA;AAAA;AACA;AA+EA;;;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;AACA;AACA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AACA;AADA;;;;;;;;;;;;;;AC9JA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAdA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AACA;AADA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;;;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AANA;AAOA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AADA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;;;AACA;AAIA;AACA;AANA;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;;;;;AAeA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAiEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAiBA;AACA;AAAA;AAIA;AACA;AAAA;AAEA;AAFA;AAKA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAJA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACrHA;;;;;;AAMA;AACA;;;;;;;AAMA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAgBA;AAAA;AAAA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AA3DA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAAA;AACA;AADA;AAGA;AAAA;AACA;AACA;AALA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;AACA;AAAA;AAKA;AAAA;AAKA;AACA;AACA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAVA;AAgBA;AAIA;AACA;AAiBA;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAJA;AASA;;;;AAzDA;AACA;AAAA;AACA;AA0DA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AAPA;AACA;AASA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACtRA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAQA;;;AAGA;AACA;AACA;AADA;AAEA;AACA;AAFA;AACA;AAWA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACvCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AA8FA;AAAA;AAAA;AACA;AACA;;;AA/FA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;;;AAEA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AA9FA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AAIA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAKA;AAAA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAQA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AAEA;AACA;AAHA;AAjBA;AAwBA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAMA;AAAA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAEA;AAQA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AAEA;AACA;AAHA;AAjBA;AAuBA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AADA;AASA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAOA;AACA;AAxCA;AACA;AAwCA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;AAKA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AAFA;AAlBA;AAuBA;AACA;AA/BA;AACA;AA+BA;AAKA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AAFA;AAlBA;AAuBA;AAEA;;AAEA;AACA;AACA;AADA;AAOA;AACA;AACA;AATA;;;;;;;;;;;;;;ACnYA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AAIA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AANA;AAOA;AACA;AAAA;AAQA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;;;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AAIA;AACA;AAFA;AAKA;AACA;AAFA;AACA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AAGA;AACA;AAFA;AAKA;AACA;AARA;AAWA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAjIA;AACA;AAiIA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAOA;AACA;AACA;AATA;;;;;;;;;;;;;;AC5PA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAMA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAKA;AAAA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAXA;AAaA;AACA;AA3BA;AAAA;AAAA;AAAA;AAAA;AACA;AA4BA;AACA;AACA;AApCA;AACA;AAoCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AAxBA;AA0BA;;;;;;;;;;;;;;ACxFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAOA;AAEA;AACA;AACA;AADA;AAOA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AAEA;AACA;AAOA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AA1CA;AA2CA;AACA;AAAA;AAOA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AAEA;AACA;AAMA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AArCA;AACA;AAqCA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACjHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAQA;AACA;AACA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAVA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAOA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AAjCA;AAkCA;AACA;AAAA;AAOA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAfA;AACA;AAiBA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AArCA;AAsCA;AACA;AAAA;AAOA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAQA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAhDA;;;;;;;;;;;;;;AClHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAKA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;AAOA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AACA;AAKA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAvCA;;;;;;;;;;;;;;AC5DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAFA;AAOA;AACA;AAWA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAXA;AAYA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;;AACA;AAeA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACzCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAYA;AACA;AACA;AADA;AAAA;AACA;AAAA;AADA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AADA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AATA;AACA;AAiEA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AACA;AACA;AAHA;AACA;AALA;AACA;AADA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AACA;AAYA;AAAA;AAKA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAXA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AACA;AAbA;AAEA;AAFA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AALA;AACA;AAuCA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAHA;AAKA;AALA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AANA;AAYA;AACA;AACA;AACA;AACA;AAJA;AACA;AAbA;AAGA;AAHA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AA1BA;AA4BA;AACA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AANA;AAYA;AACA;AACA;AACA;AACA;AAJA;AACA;AAbA;AAGA;AAHA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AA1BA;AA4BA;AAEA;AACA;AACA;AAJA;AAKA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AASA;AAEA;AAAA;AAAA;AAAA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAbA;AAAA;AAAA;AAAA;AACA;AADA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AACA;AAfA;AAEA;AAFA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0BA;AACA;AAhCA;AAkCA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AANA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAOA;AACA;AARA;AAAA;AAAA;AAAA;AACA;AAQA;AACA;AAVA;AAYA;AACA;AACA;AACA;AACA;AAJA;AACA;AAbA;AAEA;AAFA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBA;AACA;AA5BA;AA8BA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAPA;AAYA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AA1BA;AA4BA;AACA;AAAA;AAAA;AAAA;AAAA;AA/BA;AAiCA;AAEA;AAFA;AAIA;AA1CA;AA4CA;AAEA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AANA;AAQA;AAAA;AAAA;AAdA;AAgBA;AAEA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AACA;AAhBA;AAiBA;AAEA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AASA;AAEA;AACA;AACA;AACA;AALA;AAOA;AAEA;AACA;AACA;AACA;AALA;AAOA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAMA;AAqCA;AAqHA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAvjBA;;;;;;;;;;;;;;AChKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AACA;AAFA;AAeA;AACA;AAAA;AASA;AACA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAOA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAAA;AAJA;AACA;AAMA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAAA;AALA;AAYA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AATA;AAYA;AACA;AA7FA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;;;AAEA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AATA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AAhBA;AAAA;AACA;AAoBA;AACA;AACA;AACA;AAHA;AAAA;AACA;AADA;AAGA;AAAA;AACA;AAEA;AANA;AAAA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AAxCA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AACA;AADA;AAEA;AACA;AAAA;AAGA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AAxBA;AAyBA;AACA;AAAA;AAKA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AA7BA;AA8BA;AACA;AAAA;AAYA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAjFA;AAkFA;AACA;AAAA;AAKA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAzCA;;;;;;;;;;;;;;AClKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AATA;AAWA;AACA;AAtFA;AACA;AAsFA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;;;AAGA;AAGA;AACA;AACA;AATA;AAUA;;;;;;;;AAQA;AACA;AAAA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAtBA;;;;;;;;;;;;;;AC1JA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAQA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAOA;AACA;AACA;AACA;AAtBA;AACA;AAsBA;;;AAOA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAOA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AA9BA;AA+BA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACnLA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAgBA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AACA;AADA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AASA;AACA;;;AACA;AACA;AAEA;AAEA;;;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAQA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAEA;AAEA;AACA;AAKA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AAlBA;AACA;AAmBA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AAlBA;AAoBA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAGA;AAAA;AACA;AACA;AAIA;AACA;AAEA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAHA;AAKA;AAEA;AACA;AAlIA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAQA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;AAWA;AACA;AAAA;AAYA;AAAA;AACA;AADA;AACA;;;AAHA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAEA;;AAEA;AACA;AACA;;;AADA;AACA;AACA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;;;;;;AA3GA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAeA;AACA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAEA;AAEA;AACA;AAAA;AACA;AACA;;;AAEA;AACA;AAIA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAtBA;AADA;AACA;AAwBA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AAlEA;;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AASA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AASA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AA3CA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AAEA;AACA;AACA;AADA;AASA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AADA;AAKA;AACA;AA9BA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AAEA;AACA;AACA;AADA;AASA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AACA;AAAA;AAAA;AACA;AAFA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AADA;AAGA;AACA;AA9BA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAEA;AACA;AACA;AADA;AASA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAtDA;AACA;AAsDA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAJA;AAQA;AAUA;AACA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AALA;AASA;AAUA;;;;;;;;;;;;;;AChJA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAIA;AA6BA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AATA;;;;;;;;;;;;;;AC7CA;;;;;;AAMA;AACA;;;;;;;;AAEA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AAKA;AAEA;AACA;AAHA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AARA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAnCA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AAYA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAgBA;AACA;AAvDA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAKA;AAEA;AACA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAMA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAPA;AAQA;AAAA;AAAA;AAdA;AAiBA;AACA;AA3BA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAIA;AAEA;AACA;AACA;AADA;AAQA;;;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAnBA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AAcA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAIA;AAEA;AACA;AACA;AADA;AAQA;AACA;AAAA;AAAA;AACA;;;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AAAA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAxCA;AACA;AAwCA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AALA;AASA;AAUA;AAEA;;;AAGA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACxGA;;;;;;AAMA;AACA;;;;;;;AAIA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AALA;AADA;AAUA;AACA;AAZA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AAEA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAgBA;AACA;AACA;AACA;AAvDA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAQA;AACA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AASA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AApDA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAQA;;;;AAIA;AACA;AACA;AADA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAFA;AAIA;AACA;AACA;AACA;AAdA;AAeA;;;;AAIA;AACA;AAAA;AAQA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAFA;AAIA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAxBA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AATA;AAAA;AACA;AADA;AAUA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAjBA;AAAA;AAAA;AAAA;AAAA;AACA;AAiBA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAIA;AACA;AACA;AADA;AAUA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArBA;AAsBA;AACA;AAAA;AAUA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAfA;AACA;AAeA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACjEA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1BA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAaA;AACA;AACA;AADA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAhCA;AAiCA;AACA;AACA;AAOA;AACA;AAAA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAnGA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAMA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAGA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AAIA;AACA;AACA;AACA;AACA;AACA;AANA;AAHA;AAeA;AAAA;AAAA;AAcA;AAAA;AAAA;AAGA;AAAA;AAAA;AAIA;AAAA;AAAA;AAGA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AADA;AADA;AAcA;AAAA;AAAA;AAcA;AAAA;AAGA;AAAA;AAAA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAtBA;AAwBA;AACA;AACA;AACA;AACA;AACA;AAnJA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AAOA;AACA;AAEA;AAAA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AAlBA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAEA;;;;;;;AAOA;AACA;AACA;AADA;AASA;AACA;AAEA;AAAA;AAEA;AACA;AACA;AAFA;AAKA;AAEA;AACA;AADA;AAAA;AAEA;AACA;AACA;AAFA;AAOA;AAAA;AAAA;AAAA;AACA;AACA;AAhCA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AAGA;;;;;;;AAOA;AACA;AACA;AADA;AAKA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAfA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAGA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAKA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAbA;AAcA;AACA;AAAA;AAMA;AAAA;AAAA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAjBA;AAkBA;AACA;AAAA;AAKA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AArBA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAZA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAWA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AA9CA;AACA;AA8CA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAOA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAMA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAKA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAzEA;AA2EA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAGA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;;;;;;;;;;;;;;ACpOA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAsCA;;;;;AASA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AAKA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAXA;AAkBA;;;;AAhGA;AACA;AAAA;AACA;AAiGA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAzCA;AACA;AA2CA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAtBA;AAwBA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACxRA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAmBA;;;AAGA;AACA;AAAA;AACA;AAAA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AAMA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAtBA;AACA;AAFA;;;;;;;;;;;;;;ACrCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAWA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAHA;AAKA;AAEA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAVA;AAeA;AACA;AAxEA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AA2BA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAcA;AACA;AACA;AACA;AAAA;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAWA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAJA;AAFA;AACA;AAUA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AChOA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AACA;AAgBA;AACA;AAMA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAFA;AAOA;AACA;AACA;AADA;AAFA;AAOA;AACA;AACA;AACA;AAFA;AAFA;AAhBA;AAyBA;AAEA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAbA;AAeA;AAAA;AAAA;AAIA;AAAA;AAAA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAXA;AAaA;AAAA;AAAA;AAIA;AAAA;AAAA;AAMA;AACA;AA1HA;AACA;AA0HA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACxLA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAIA;AAAA;AACA;AAAA;AAIA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AARA;AAUA;AACA;AAhDA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAWA;AACA;AAGA;AACA;AACA;;;;;;;;;;;;;AAGA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AAAA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;;;;AA9BA;AACA;AAAA;AACA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACzGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAQA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAAA;AAAA;AAIA;;;;AA5BA;AACA;AAAA;AACA;AA6BA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC3FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAYA;AACA;AAGA;AACA;AACA;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAWA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;;;;AAhCA;AACA;AAAA;AACA;AAiCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC/GA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAaA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AACA;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AAGA;;;;AA9DA;AACA;AAAA;AACA;AA+DA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAbA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC1JA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAPA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AASA;AACA;AAAA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AASA;AACA;AAIA;AAGA;AACA;AACA;AADA;AAmBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAbA;AAeA;AACA;AACA;AAFA;AAIA;AACA;AA9EA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AAeA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AAEA;AAKA;AACA;AAOA;AAEA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAXA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAvHA;AAwHA;;;AAGA;AACA;AAAA;AAYA;AAAA;AAAA;AAAA;AAEA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AAEA;;;AAGA;AACA;AACA;AADA;AAKA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAlBA;;;;;;;;;;;;;;ACzNA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAOA;AAGA;AACA;AACA;AADA;AAiBA;AAAA;AASA;AATA;AAcA;AAdA;AAAA;AACA;AAiBA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AAIA;AACA;AA9CA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAIA;AAGA;AACA;AACA;AADA;AAkBA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAeA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAXA;AAaA;AACA;AACA;AAFA;AAIA;AACA;AAjEA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AAGA;AACA;AACA;AADA;;;AAIA;AAEA;AAOA;AAGA;AAEA;AAFA;AADA;AASA;AACA;AAzBA;AA0BA;AACA;AAAA;;;AAIA;AAEA;AAOA;AAGA;AAEA;AAFA;AADA;AASA;AACA;AAzBA;;;;;;;;;;;;;;ACvCA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;;;AAKA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AANA;AAQA;AACA;AAhBA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAMA;AAEA;AACA;AACA;AADA;AAkBA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAnBA;AAqBA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAlGA;AAmGA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAnBA;AAoBA;;;;;;;AAOA;AACA;AAAA;AAIA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AADA;AACA;AACA;AAlBA;AAmBA;;;;;;;;;AASA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAIA;AACA;AAFA;AAHA;AAOA;AAAA;AAAA;AARA;AAAA;AACA;AASA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA7BA;AACA;AA6BA;;;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAIA;;;;;;;;;;;;;;ACnPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AAAA;AAUA;;;;AAIA;AACA;AACA;AADA;AAAA;AACA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AATA;AAUA;;;;AAIA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;;;AAMA;AACA;AAAA;AAKA;AACA;AAEA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAvCA;AAwCA;AACA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAjBA;AAkBA;AACA;AAAA;AAMA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAMA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AA3BA;AACA;AA2BA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAUA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AADA;AAMA;AACA;AAVA;AACA;AAUA;AAAA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC5MA;;;;;;AAMA;AACA;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC5BA;;;;;;AAMA;AACA;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AALA;AASA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AANA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AALA;AASA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAJA;AAQA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AALA;AASA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACrCA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AALA;AASA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAiBA;AAAA;AACA;AAsGA;AAAA;AAAA;AACA;AAvGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAGA;AAAA;AAGA;AAAA;AACA;AAAA;AAAA;AAKA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;;;;AAtHA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AASA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAEA;;;;;;;;;;;;;;AC5DA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AAAA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAWA;AAWA;AACA;AAAA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAGA;AAAA;AAEA;AACA;AAEA;AACA;AANA;AASA;AAEA;AACA;AACA;AADA;AAAA;AADA;AAcA;AACA;AAAA;AAEA;AAAA;;;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AACA;AAvBA;AA0BA;AACA;AAAA;AAAA;;;AAUA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AA7BA;AAAA;AACA;AADA;AAgCA;AACA;AAAA;AAEA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAFA;AAFA;;;;;;;;;;;;;;AC/IA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAoBA;AAAA;AACA;AAWA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AADA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AADA;AAIA;AACA;AACA;AADA;AAGA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAAA;AAWA;;;;;;;;;;;;;;ACzDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAaA;AAAA;AAAA;AAcA;;;;;;;;;;;;;;AChDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAMA;;;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AACA;AAMA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAaA;AAYA;AAEA;AACA;AAMA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAMA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;;;AAMA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAdA;AAgBA;AACA;AAxCA;AACA;AAwCA;AACA;AACA;AACA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACjKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAqBA;AACA;AACA;AADA;AAKA;AACA;AAAA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAGA;AAHA;AACA;AAMA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;;;AACA;;;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AAFA;AAIA;AANA;AAQA;AACA;AACA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AA5DA;;;;;;;;;;;;;;AClDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAJA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AASA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAPA;AASA;AAaA;AACA;AAAA;AAGA;AAAA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAhCA;AAiCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AANA;AAOA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAbA;AAcA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAbA;AAcA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AACA;AAQA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC1JA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAeA;AAUA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAGA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAKA;AACA;AAFA;AAQA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACxHA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAsBA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;ACtEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;;;AAGA;AACA;AACA;AADA;AAUA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAEA;AAOA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAIA;AAOA;AACA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AASA;AACA;AACA;AACA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAJA;AATA;AANA;AAuBA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AARA;AAAA;AAUA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACvSA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAYA;AAOA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AASA;;;;;;;;;;;;;;ACjFA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAEA;AAFA;AAAA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AACA;;;AADA;AACA;AAIA;AALA;AAMA;AAPA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAYA;AAWA;AAEA;AACA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACxFA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAIA;AAGA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAQA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAIA;;;;;;AAMA;AACA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAIA;;;;;;;;;;;;;;ACzFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACtCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAGA;AACA;AAMA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAIA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAgBA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAIA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAOA;AAOA;;;;;;;;;;;;;;AChEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AAIA;AALA;AACA;AAaA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAiBA;AAcA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AANA;AAQA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAFA;AAFA;AAOA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAEA;AAAA;AAAA;AAGA;AACA;AAAA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;AC/OA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;AAIA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AAWA;AAMA;AAAA;AAAA;AAAA;AAAA;AAEA;AAKA;AAMA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AC5DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AAGA;AACA;AACA;AADA;AAIA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AALA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1CA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA1EA;AACA;AA0EA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAMA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;;;;;;;;;;;;;;AC9NA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAKA;;;;;;AAMA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAcA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAvCA;AACA;AAuCA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC/HA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAGA;AACA;AAEA;AACA;AAAA;AACA;AAOA;;;AACA;AAKA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AACA;AAIA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACxCA;;;;;;AAMA;AACA;;;;;;;;;;;;AAGA;AACA;AAGA;AACA;AAEA;AACA;AAAA;AACA;AAQA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;;;AAAA;AACA;AACA;AAEA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AACA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAOA;AAAA;AACA;AAGA;AAIA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AADA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAMA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA1BA;;;;;;;;;;;;;;ACnFA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAMA;AACA;AACA;AAAA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAiBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AADA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AA5BA;AACA;AA4BA;AAYA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AATA;AAcA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAYA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAcA;AAEA;AACA;AACA;AADA;AACA;AAYA;AAOA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AAGA;AAAA;AAWA;AACA;AACA;AAjBA;AAkBA;AACA;AACA;AAAA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AAXA;AACA;AAYA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AADA;AAAA;AACA;AACA;AACA;AAMA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AAFA;AAIA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AACA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AAGA;AACA;;;;;;;;;;;;;;ACxWA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAGA;;;;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AATA;AAUA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AANA;AAAA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AATA;AAUA;;;AAGA;AACA;AAAA;AACA;AAEA;AACA;AAHA;AACA;AAFA;;;;;;;;;;;;;;AC/DA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAQA;;;;;AAKA;AACA;AAAA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAbA;AAeA;AACA;AA3BA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAEA;AAGA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAIA;AACA;AAAA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAMA;AAiBA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAvCA;AAwCA;;;AAGA;AACA;AAAA;AAMA;AAAA;AACA;;;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AAGA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAhDA;AACA;AAgDA;AAIA;;;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAUA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAMA;;;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AACA;AAFA;AAKA;AAkBA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAlEA;AAmEA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AADA;AACA;AADA;AACA;AAEA;AAJA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AARA;AASA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AANA;AAQA;AACA;AAxBA;AACA;AAwBA;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AAEA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AAHA;AAQA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AADA;AAIA;AAeA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AAWA;AACA;AAFA;AAOA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAWA;AACA;AAFA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AAWA;AACA;AAFA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAPA;AACA;AAOA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;;;;;;;;;;;;;;AC9gBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AADA;AAKA;AACA;AACA;AACA;AAfA;AAiBA;AACA;AAtCA;AAuCA;AACA;AAAA;AAGA;AACA;;;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AAbA;;;;;;;;;;;;;;AC/EA;;;;;;AAMA;AACA;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAOA;AAoDA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAKA;AAAA;AAAA;AAEA;AAQA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAxBA;AAyBA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAPA;AACA;AAOA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAFA;AAQA;AACA;AACA;AAFA;AAIA;AAAA;AAAA;AAAA;AALA;AAOA;AACA;AACA;AAMA;AACA;AAKA;AAKA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AASA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAVA;AAYA;AACA;AAlCA;AAmCA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AAKA;AACA;AACA;AACA;AARA;AASA;AACA;AAAA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAIA;AACA;AAVA;AALA;AAkBA;AACA;AArCA;AAsCA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAmBA;AACA;AAAA;AAMA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AA/CA;;;;;;;;;;;;;;ACjUA;;;;;;AAMA;AACA;;;;;;;AAGA;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAbA;AAcA;;;;;AAKA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAdA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;AAMA;AAiBA;;;;AAIA;AACA;AACA;AAFA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAFA;AASA;AACA;AAtBA;;;;;;;;;;;;;;AClCA;AACA;;;;;;;AAmCA;;AAEA;AACA;AAAA;;;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;;;AAGA;AACA;AAAA;AAEA;;;AAGA;AACA;AAAA;;;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnCA;AAoCA;;;;AAIA;AACA;AAAA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AApCA;AAqCA;;;;;;;;;;;;;;ACzMA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AAEA;AAFA;AAIA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AARA;AAYA;AAEA;AAEA;AAFA;AAIA;AACA;AACA;AAjDA;AACA;AAiDA;AACA;AACA;AAIA;AACA;;;;;;;;;;;;;;ACxEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAqBA;;;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AADA;AAQA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAnGA;AAoGA;AACA;AAAA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AA1BA;AA2BA;AACA;AAAA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AAFA;AAHA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AAFA;AAHA;AAAA;AAQA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AA5FA;;;;;;;;;;;;;;AC9KA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAMA;AAEA;AACA;AADA;AAGA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACfA;AACA;;;;;;;;;;;;;;AAwBA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAvCA;AACA;AAuCA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AACA;AADA;AAGA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAhDA;AAiDA;;;;;;;;;;;;;;ACpIA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAIA;AAEA;AACA;AACA;AADA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAcA;AACA;AAAA;AAIA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AApBA;AACA;AAoBA;AAMA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAAA;AADA;AAEA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAGA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;;AAMA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC9IA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAaA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AATA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AA+BA;AACA;;;AA9BA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AA/BA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAFA;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAwEA;AAtEA;;;;AAIA;AACA;AACA;;;AADA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAIA;;;AAEA;AACA;AACA;AACA;AAFA;AAIA;AAEA;;;AAGA;AACA;;;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AA1EA;;;;;;;;;;;;;;AC5BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AAOA;AACA;AACA;AADA;AAWA;AAAA;AACA;AADA;AACA;AAXA;AAEA;AAEA;AAEA;AAEA;AAGA;AACA;AACA;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;;;AAEA;;;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;;;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAGA;AACA;;;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AA/GA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;AAIA;;;;;;;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AATA;AAWA;AACA;AAbA;AAcA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AATA;AAWA;AACA;AAbA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAIA;AAUA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAaA;;;AAGA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AApDA;AA2DA;;;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AAGA;AACA;AAlCA;;;;;;;;;;;;;;AC5GA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAuDA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAPA;AAQA;;;AAGA;AACA;AAAA;;;AAIA;AACA;AACA;AANA;AAOA;;;;;;AAMA;AACA;AAAA;AAMA;AAAA;AAAA;AAAA;AACA;;;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAzBA;AA2BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;;;AACA;AASA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AACA;AACA;AACA;AAlGA;AACA;AAyBA;AAAA;AACA;AADA;AAyEA;AACA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AAtHA;AAuHA;;;AAGA;AACA;AAAA;AAWA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AArBA;AAsBA;;;AAGA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAQA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAfA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAKA;AAAA;AACA;AADA;AAEA;AAFA;AAAA;AALA;AAUA;AACA;AACA;AADA;AAMA;AACA;AACA;AAMA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAhCA;AAiCA;AACA;AAAA;AAIA;AAAA;AAAA;AAQA;AACA;AACA;AAEA;AAEA;AACA;AAEA;AACA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAQA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAFA;AAAA;AAIA;AACA;AACA;AAGA;AACA;AACA;AACA;AAvDA;AAAA;AACA;AADA;AAuDA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AA5DA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAoBA;AAAA;AACA;AADA;AAyCA;AA7DA;AAAA;AAAA;AAAA;AAAA;AACA;AA8DA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAAA;AAEA;AAFA;AAAA;AAKA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAHA;AAKA;AALA;AAOA;AACA;AA/GA;AAgHA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AACA;AAGA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;AAGA;AACA;AATA;AAaA;AACA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAGA;AAEA;;;AAGA;AACA;AACA;AADA;;;AAMA;AAGA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAOA;AACA;AA7BA;AA8BA;;;AAGA;AACA;AAAA;AAKA;AAEA;AACA;AAAA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAHA;AAOA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAlCA;AAmCA;;;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AACA;AAvBA;;;;;;;;;;;;;;ACvmBA;;;;;;AAMA;AACA;;;;;;;;;AAyCA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAaA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AANA;AAuCA;;;AAGA;AACA;AAAA;AAiEA;;;AAGA;AACA;AAAA;AACA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;;;;AAUA;AACA;AACA;AAAA;;;;;;;;;;AAUA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AA9EA;AAqGA;;;AAGA;AACA;AAAA;AACA;;;;;;;AAOA;AACA;AACA;AAAA;;;;AAIA;AACA;AACA;AAAA;;;;;;;;AAQA;AACA;AAzBA;AAkFA;AACA;AAAA;AACA;AACA;AAFA;AA0UA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAsFA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AAFA;AA8BA;AACA;AAAA;AACA;AADA;AAiLA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACtgCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AAAA;AACA;AAAA;AASA;AACA;AACA;AADA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AANA;AACA;AAFA;AASA;AACA;AAAA;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAGA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;;;;;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAgBA;AAEA;AAEA;AAFA;AAIA;AAEA;AACA;AApFA;AACA;AAoFA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AARA;AAUA;;;;;;;;;;;;;;AClJA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;;;AADA;AACA;AACA;AAFA;AAGA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAIA;AACA;AAEA;AACA;AACA;AADA;;;AAQA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AADA;AAOA;AACA;AAEA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AApBA;;;;;;;;;;;;;;AC5FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDA;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAKA;AACA;AAAA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AAtGA;AAuGA;AACA;AACA;AACA;AAAA;;;;;;;;;;;;;;ACtKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnBA;AACA;AAyBA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AANA;AASA;AACA;AACA;AAFA;AAIA;AACA;AANA;AAQA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AANA;AASA;AACA;AACA;AAFA;AAIA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AAFA;AAYA;;;AAGA;AACA;AAAA;AAGA;AAAA;AAEA;AACA;AACA;AAPA;;;;;;;;;;;;;;AC5HA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAiBA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAVA;AAWA;AACA;AAAA;;;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAaA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAJA;AAKA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAXA;AAYA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AACA;AACA;AALA;AAMA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAJA;;;;;;;;;;;;;;ACvGA;;;;;;AAMA;AACA;;;;;;;AAuBA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAjBA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA;AACA;AAAA;AAOA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AADA;;;;;AAOA;AAYA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AAfA;AAgBA;AACA;AAHA;AAIA;AACA;;AAxBA;AACA;AADA;AACA;AA4BA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAXA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAEA;;AAEA;AACA;AAAA;;;;;;;;;;;;;;ACjCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AAGA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AAEA;AACA;AAEA;AACA;;;AAEA;AACA;AACA;;;;;;AAzBA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AAGA;AACA;AACA;AADA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAzBA;AACA;AAFA;AA4BA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAdA;AACA;AAFA;AACA;AAgBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAdA;AACA;AAFA;;;;;;;;;;;;;;ACxFA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;;;;;AAKA;AACA;AAAA;AAIA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AApBA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAoCA;AACA;AACA;AADA;AAAA;AACA;AAAA;AAEA;AAEA;AACA;AACA;AAPA;AA4BA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAMA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAGA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAEA;AAAA;AAAA;AACA;AAHA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AARA;AASA;AACA;AAAA;AAGA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AARA;AASA;AACA;AAAA;AAGA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAGA;AAAA;AAHA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAJA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AAVA;AACA;AAWA;AACA;AAAA;AAIA;AACA;AACA;AANA;AAOA;AACA;AAAA;AAIA;AACA;AACA;AANA;AAOA;;;;;;;;;;AAUA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAJA;AAoDA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC3HA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAqEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAcA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AACA;AACA;AADA;AAKA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAfA;AAgBA;AACA;AAAA;AAMA;AACA;AACA;AAAA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnCA;AAoCA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AACA;AAQA;AACA;AACA;AACA;AAAA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;;;;;AAKA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAxBA;AAyBA;;AAEA;AAEA;AACA;AAAA;AACA;AAKA;AAKA;AACA;AAAA;AAKA;AAGA;AAIA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AAzBA;AA0BA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AANA;AASA;AACA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAjBA;AAmBA;AACA;AAvEA;AAwEA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAJA;AAKA;;AAEA;AAEA;AACA;AAAA;AACA;AAOA;AAEA;AACA;AAAA;AAAA;AAMA;AAAA;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AApCA;AACA;AADA;AAuCA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;;AAEA;AACA;AACA;;;AAGA;AACA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArEA;AAsEA;;;;AAIA;AACA;AACA;;;;;;;;;;;;;;;;;;AAkBA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAdA;;;;;;;;;;;;;;AC1oBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AAsCA;AACA;AACA;AADA;AAIA;AAAA;AACA;AACA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAnBA;AAoBA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;AAIA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;;;AAMA;AAGA;AACA;AAVA;AAWA;;;;AAIA;AACA;AAAA;AACA;AAEA;AAKA;AAPA;AACA;AAFA;AACA;AASA;AAKA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AADA;AACA;AAFA;;;;;;;;;;;;;;ACjIA;;;;;;AAMA;AACA;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAWA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AA1BA;AA4BA;AACA;AA9BA;AA+BA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACvDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAMA;AACA;AAGA;AACA;AAQA;AACA;AAAA;AACA;AACA;AAAA;AAKA;AACA;AAAA;AAKA;AACA;AAAA;AAuBA;AACA;AAAA;AAoBA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AANA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAdA;AAeA;AACA;AAAA;AASA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAjBA;;;;;;;;;;;;;;AC3IA;;;;;;AAMA;AACA;;;;;;;AAMA;;;AAGA;AACA;AAAA;AACA;AAIA;AACA;AANA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC5BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AAEA;AACA;AACA;AANA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;AACA;;;;;;;;AAQA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAziBA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAJA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAUA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AAAA;AAKA;AAGA;AACA;AApBA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AASA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAIA;AACA;AA1BA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAKA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAOA;AACA;AACA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAOA;AACA;AAAA;AAaA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAGA;AAAA;AAMA;AAKA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAPA;AACA;AASA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AADA;;;;;;;;;;;;;;AC5IA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAMA;AACA;AAIA;AACA;AAAA;AACA;AAQA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACtEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AAUA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AACA;AACA;AAIA;AAGA;AAAA;AAeA;AACA;AA7BA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAYA;AACA;AACA;;;;;AASA;AAAA;AACA;AADA;AACA;AAAA;AACA;AA6CA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AA5EA;AACA;AACA;AAJA;AAKA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AALA;AAYA;;;AAkCA;AACA;AACA;AACA;;;;AA3FA;AACA;AAAA;AACA;AA4FA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAjBA;AAmBA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACrKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAwBA;AACA;AACA;AADA;;;;;AAaA;AAAA;AACA;AADA;AACA;;;AAAA;AACA;AA2FA;AAAA;AAAA;AACA;AA5FA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAHA;AACA;AAIA;AACA;AACA;AACA;AArCA;AAsCA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AAIA;AADA;AADA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAIA;;;AAIA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AAOA;;;;AAjJA;AACA;AADA;AACA;AACA;AADA;AACA;AAkJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAEA;AAAA;AAAA;AAKA;AAAA;AAAA;AAMA;;;;;;;;;;;;;;AC3OA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAMA;AACA;AACA;AADA;;;;;;;;;;;;;AAGA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;;AANA;AACA;AADA;AACA;AACA;AAOA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AACA;AADA;AAGA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAmCA;;;;;AAAA;AAAA;AACA;AADA;AACA;;;AAOA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAMA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAFA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAFA;AAMA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AA5HA;AAgKA;AACA;;;AA7JA;AACA;AACA;;;AAuHA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AATA;AAcA;;;;AA/JA;AACA;AAAA;AACA;AACA;AA+JA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAFA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAXA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC1RA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAYA;;;;;AAKA;AAAA;AACA;AADA;AACA;AAAA;AACA;AAcA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAzBA;AACA;AAHA;AAIA;AACA;;;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAcA;AACA;AAAA;AAAA;AAAA;AACA;;;;AAnCA;AACA;AAqCA;AAAA;AACA;AAAA;AADA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAWA;;;;;AAAA;AAAA;AACA;AADA;AACA;;;AAYA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAvBA;AAoCA;AACA;;;AApCA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AAHA;AAOA;;;;AAnCA;AACA;AAqCA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC/EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAWA;;;AAGA;AACA;AACA;AADA;;;;;AAAA;AAAA;AACA;AADA;AACA;;AAAA;AADA;AAuBA;AACA;;;AArBA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;;;;AAtBA;AACA;AADA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AADA;AAMA;;;AAGA;AACA;AAAA;;;;;AAAA;AAAA;AACA;AADA;AACA;;AAAA;AADA;AAEA;AACA;;AAHA;AACA;AADA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAUA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAGA;AACA;AACA;AAFA;AACA;AAGA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AA/BA;AAmCA;AACA;AAjDA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAFA;AAMA;AACA;AAVA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;;;;AAXA;AACA;AADA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AACA;AA2BA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;;;;;;;AAOA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAWA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AAGA;;;;;;;;;;;;;;AC7DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAKA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAIA;AACA;AACA;AADA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AAPA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAWA;;;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AATA;AAiBA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AA7CA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAuBA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAUA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAlBA;AAoBA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;;;AADA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AAQA;AAVA;AAcA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAQA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAFA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AATA;AACA;AAWA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACjMA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAOA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AADA;AAOA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AA7BA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAoBA;AACA;AAAA;AAGA;AACA;AACA;AADA;AA8BA;AACA;AAAA;;;;;AAAA;AAAA;AACA;AADA;AACA;;AAEA;AAEA;AAEA;AACA;AACA;AAFA;AACA;AAQA;AAAA;AAGA;AACA;AAAA;AACA;AALA;AACA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAjEA;AAuKA;AACA;;;AA5JA;AACA;AACA;;;AAoDA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;;;AAEA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAKA;AAGA;AACA;AACA;AACA;AACA;AAAA;AALA;AAQA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AALA;AASA;AAAA;AACA;AAAA;AAAA;AAAA;AAOA;;;;AAtKA;AACA;AADA;AACA;;;;;;;;;;;;;;ACxEA;;;;;;AAMA;AACA;;;;;;;;;;AAIA;AACA;AAEA;AAEA;AACA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AApCA;AAqCA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AASA;;AAEA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACzFA;;;;;;AAMA;AACA;;;;;;;;;;AAEA;AA4BA;;;AAGA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAFA;AAIA;AADA;AAIA;AACA;AAxBA;AAyBA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAlBA;;;;;;;;;;;;;;ACtEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;;;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAEA;AACA;AApBA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAQA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAFA;AACA;AADA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;;;ACVA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAsCA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AAAA;;;AACA;AASA;AAEA;AACA;AACA;AAEA;;;AAGA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAFA;AAOA;AACA;AACA;AACA;AAFA;AAFA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AANA;AAFA;AAYA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AATA;AA5BA;AA0CA;AAQA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;;;;;;;;;;;;;;ACnPA;;;;;;AAMA;AACA;;;;;;;;;AAMA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAGA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAMA;;;;AAIA;AACA;AAAA;AAIA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AArBA;AAsBA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;;;;AAOA;AACA;AAAA;AACA;;;;;;;;;;;;;;;;;;AAkBA;AAEA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1DA;;;;;;;;;;;;;;AC9DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AADA;AAKA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AAHA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAKA;AACA;AANA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AAgBA;AAGA;AACA;AAtEA;AACA;AAsEA;AAIA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAGA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAIA;AACA;AAVA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AAMA;AACA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AACA;AAIA;AACA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAGA;AACA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AAEA;AAEA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACtCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAOA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAAA;AAKA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAGA;AACA;AARA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAGA;AACA;AACA;AACA;AAmBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAeA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAQA;AACA;AAAA;AAGA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AACA;AAEA;;AAEA;AACA;AAAA;AAyBA;AACA;AAAA;AAGA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAIA;AACA;AAxCA;AAyCA;AACA;AAAA;AAMA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAZA;;;;;;;;;;;;;;AChGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAwBA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;;;AAOA;AACA;AAGA;AAGA;AACA;AAzCA;AACA;AAyCA;AAGA;AAAA;AACA;AAEA;AACA;AADA;AAIA;AACA;AACA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAIA;;;;;;;;;;;;;;AC1GA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AAWA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAnBA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAQA;;;AAGA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAFA;AAOA;AAAA;AAGA;AACA;AACA;AAGA;AACA;AADA;AAFA;AASA;AACA;AAtDA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAqBA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAIA;AAIA;AACA;AA/BA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAqBA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAIA;AAIA;AACA;AA/BA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAUA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAHA;AAaA;AACA;AA/BA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAkBA;AACA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AANA;AAWA;AACA;AACA;AACA;AAJA;AAWA;AACA;AAxDA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;AAMA;AACA;AAAA;AAGA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AADA;AA7BA;AAiCA;AACA;AAxCA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAsCA;AACA;AACA;AADA;AAiCA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAKA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AAVA;AAeA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AADA;AAZA;AAiBA;AACA;AACA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AADA;AAPA;AACA;AAYA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAeA;AACA;AAFA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAGA;AAAA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AANA;AAcA;AAAA;AAAA;AAOA;AAAA;AAAA;AASA;AACA;AA3OA;AA4OA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AACA;AAiBA;AAAA;AAGA;AACA;AACA;AACA;AAJA;AAFA;AACA;AAcA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AADA;AAcA;AACA;AACA;AADA;AAEA;AACA;AAAA;;;;;;;;;;;;;;ACpZA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AAMA;AACA;AACA;AADA;AAMA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AATA;AAgBA;AACA;AAAA;AAOA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAHA;AAKA;AACA;AAdA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAQA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1JA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAQA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACtWA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;;;;;;;;;;;;;;AC/OA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;AAGA;AAmQA;AAmQA;AACA;AAAA;AACA;AACA;AAFA;;;;;;;;;;;;;;ACjhBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3JA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;;;;;;;AAOA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;;;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAFA;AAGA;;;;;AAKA;AACA;AAAA;AAAA;AACA;AAEA;;;;;;AAMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AApBA;AAqBA;AACA;AAAA;;;;;AACA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAEA;AACA;;AAJA;AACA;AADA;AAMA;;;AAGA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAjBA;;;;;;;;;;;;;;ACnEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA;;;;;;;;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AACA;AAWA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAXA;AAYA;;;AAGA;AACA;AAAA;AAKA;AAAA;AAAA;AAEA;;;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;AClEA;;;;;;AAMA;AACA;;;;;;;;;AAGA;;;AAGA;AACA;AAAA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAqBA;AACA;AAAA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;AAiBA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAEA;AAGA;;;AAGA;AACA;AACA;AADA;AAiBA;AASA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;;;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AAIA;AACA;AACA;AAFA;AAIA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;;;;AAvFA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAaA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAQA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAbA;AACA;AAeA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AACA;AADA;AAmBA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAKA;AACA;AAGA;AACA;AACA;AACA;AAEA;AASA;AACA;AAAA;AAGA;AAEA;AAkBA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;;;AACA;AACA;AAGA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AAGA;;;AAEA;;;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAMA;;;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;;;;;;AArMA;AACA;AAuMA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAOA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AACA;AAYA;AAKA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAcA;AAeA;AACA;;;;;;;;;;;;;;AChYA;;;;;;AAMA;AACA;;;;;;;;AACA;AAIA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAMA;;;;;;;;;AASA;AACA;AAAA;AACA;AAAA;AAKA;AADA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AA3CA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;AAYA;;;;;;;;;AASA;AACA;AAAA;;;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA3BA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;;;AAGA;AACA;AAAA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AARA;AAaA;;;AAGA;AACA;AAAA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AARA;AAaA;AACA;AAAA;AACA;AACA;AAFA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AARA;AAgBA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAvBA;AAyBA;AAzBA;AA6BA;AACA;AAAA;;;;;;;;;;;;;;AC7KA;;;;;;AAMA;AACA;;;;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AA8BA;AAEA;AACA;AAFA;AAOA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;AAIA;AACA;AAaA;AACA;AACA;AA4FA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAghBA;;;AAGA;AACA;AAAA;AASA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAbA;AAiBA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACtqBA;;;;;;AAMA;AACA;;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AAoBA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAqCA;;;AAGA;AACA;AAAA;AAEA;AACA;AAFA;AAKA;AADA;;;;;;;;;;;;;;ACjFA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAKA;AACA;AACA;AAMA;AAAA;AAGA;AACA;AAFA;AAFA;AASA;;;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;;AChDA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAEA;AACA;AAKA;AACA;AACA;AA+DA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AA2IA;;;AAGA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAkBA;AACA;AAAA;AAKA;;;AAGA;AACA;AAAA;AASA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AACA;AAlBA;;;;;;;;;;;;;;AChRA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAMA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAaA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjCA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAkBA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC/CA;;;;;;AAMA;AACA;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AADA;AA0BA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACvDA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAOA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAUA;;;;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAkCA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;AC/DA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AA0BA;;;;;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AClFA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAoBA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAqBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAOA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AACA;AACA;AA2PA;AACA;AACA;AADA;AAAA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAJA;AA9BA;AAAA;AACA;AADA;AAsCA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAFA;AACA;AAGA;AACA;AACA;AAEA;AACA;AACA;AACA;AALA;AACA;AAMA;AACA;AAEA;AACA;AAHA;AACA;AAIA;AACA;AAEA;AACA;AACA;AACA;AALA;AACA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AALA;AACA;AAQA;AACA;AACA;AAEA;AACA;AAHA;AACA;AAIA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AAFA;AAJA;AASA;AAGA;AAdA;AACA;AAeA;AACA;AAEA;AACA;AAHA;AACA;AAIA;AACA;AACA;AAEA;AAEA;AAFA;AAFA;AAQA;AAEA;AACA;AAHA;AADA;AACA;AAOA;AACA;AAEA;AAEA;AAFA;AAFA;AACA;AAMA;AACA;AAEA;AAEA;AAGA;AACA;AACA;AAPA;AAFA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AAEA;AAFA;AAFA;AACA;AAMA;AACA;AAGA;AAHA;AAjIA;AAwIA;AACA;AACA;AA9IA;AACA;AA8IA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;;;;;;;;;;;;;;AC1fA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAKA;;;AAGA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAyBA;AACA;;;AAxBA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;;;;AAGA;AAAA;AAAA;AACA;AAAA;AAyBA;AACA;;;AApBA;AACA;AACA;AACA;AAFA;AAIA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AAEA;AACA;;;AAtBA;AAAA;AACA;AACA;;;;;AAuBA;;;;AAIA;AACA;AACA;AADA;AAEA;;;;;;;;;;AAUA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;;;;;;;;;;;;;;AC5FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAEA;AACA;AAAA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAEA;AACA;AACA;AAGA;AAJA;AAHA;AAFA;AACA;AAaA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAGA;AAJA;AAJA;AAJA;AACA;AAgBA;AAAA;AACA;AAEA;AAEA;AAGA;AACA;AAGA;AAJA;AAMA;AACA;AAGA;AAJA;AAPA;AAeA;AAGA;AAGA;AAJA;AAOA;AACA;AACA;AACA;AAGA;AAJA;AA9BA;AAFA;AAwCA;AACA;AACA;AACA;AAEA;AAFA;AACA;AAIA;AACA;AACA;AAEA;AAFA;AACA;AAIA;AACA;AAEA;AAFA;AACA;AAIA;AACA;AAEA;AAFA;AACA;AAIA;AACA;AAEA;AAFA;AACA;AAIA;AAAA;AACA;AACA;AAEA;AAIA;AAJA;AAMA;AARA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;;;AACA;AACA;AACA;AAAA;AAAA;AAEA;AAFA;AAAA;AAIA;AACA;AAAA;AAEA;AAEA;AAEA;AAEA;AACA;AAHA;AAKA;AAEA;AAFA;AAPA;AAYA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AAEA;AAFA;AAFA;AAOA;AACA;AACA;AACA;AAjNA;AAmNA;AACA;AA1NA;AA2NA;;AAEA;AACA;AACA;AAGA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACxSA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAMA;AAAA;AAAA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;;;;;;;;;;;;;;AClDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAKA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAFA;AAIA;AAGA;;AAEA;AACA;AAAA;AAGA;AAEA;AACA;AACA;AACA;AARA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAaA;AACA;AACA;AADA;AACA;AADA;AAIA;AACA;AAAA;AAaA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAbA;AAeA;AACA;AAEA;AACA;AACA;;;;;;;;;;;;;;ACvEA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAVA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;;;;;;;;;;;;AClDA;;;;;;AAMA;AACA;;;;;;;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAPA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AATA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;AAGA;AAGA;AACA;AACA;AADA;;;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAWA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArBA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AATA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AAiBA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;AAIA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;AASA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAFA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAKA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAFA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAbA;AAiBA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AATA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AAEA;AAEA;AACA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAIA;;;AAGA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;AAKA;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;AAIA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAHA;AACA;AADA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;AAGA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AAIA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;AACA;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAQA;AAAA;AACA;;;AAAA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC3CA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAQA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAAA;AADA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAKA;AACA;AApBA;AAqBA;;;;;;;;;;;;;AAaA;AACA;AAAA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAfA;AACA;AAFA;AAkBA;;;;;;;;;;;;;;AAcA;AACA;AAAA;AACA;AACA;AASA;AACA;AACA;AAAA;AACA;AACA;AALA;AARA;AADA;AACA;AAFA;;;;;;;;;;;;;;AC/FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;AAKA;;;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;AAIA;AACA;AAAA;AAMA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAPA;AAAA;AACA;AADA;AAUA;AACA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACvDA;;;;;;AAMA;AACA;;;;;;;AAyEA;;;;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAJA;AAKA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;;;;;;;;;;;;;;AC1GA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AALA;AASA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAUA;AACA;AAZA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;AAYA;AACA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAnBA;AAoBA;;;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;AACA;AACA;AAAA;AAaA;AACA;AACA;AADA;AAMA;AACA;AACA;AARA;AASA;AACA;AAAA;AAMA;AACA;AACA;AARA;AASA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAKA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AAKA;AACA;AACA;AAPA;AACA;AAOA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAOA;AACA;AACA;AATA;;;;;;;;;;;;;;AChFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AA8BA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;AA4BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAiBA;;;;;;;;;;AAUA;AACA;AAAA;AAMA;AAGA;AACA;AAVA;AACA;AAUA;AACA;AACA;AACA;AACA;AAMA;AAGA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAMA;AAGA;AACA;AAVA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AAGA;AACA;AALA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACxLA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AAAA;AAAA;AAQA;AAHA;AASA;AAFA;AAZA;AACA;AADA;AAiBA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AACA;AAKA;AACA;AAPA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;;;;;;;;;;;;;;ACnFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAIA;AAIA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAJA;AASA;AACA;AAAA;AACA;AACA;AAFA;AAOA;;;;AAIA;AACA;AAAA;AACA;;;AAGA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AAbA;AAkBA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AArBA;AA8BA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AArBA;AAuCA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;;;;;;;AAOA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAJA;AAwFA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAJA;AAKA;;;;;AAKA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAZA;AAaA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAnBA;AAoBA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnBA;AACA;AAmBA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;;;;;;;;AAYA;AACA;AAAA;AAIA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AAIA;AAAA;AAEA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAGA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAvEA;AAiFA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;;;;;;;;;;;;;AAaA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAiBA;;;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAMA;;;AAGA;AACA;AAAA;;;AAIA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AApBA;AAqBA;;;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AALA;AAMA;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;;;;;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAbA;AAcA;;;;AAIA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AANA;AAOA;;;;AAIA;AACA;AAAA;AAIA;AACA;;;AAAA;AACA;AACA;AACA;AARA;AASA;;;;;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAdA;AAeA;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;AAIA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AAVA;AAWA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AADA;AACA;AADA;AAGA;AAOA;AACA;AAAA;;;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAVA;AAWA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AADA;AACA;AADA;AAGA;;;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAJA;AAKA;;;AAGA;AACA;AAAA;AAIA;AACA;AAEA;AACA;AACA;AACA;AACA;AAGA;AACA;AAfA;;;;;;;;;;;;;;ACluBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AAcA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAgBA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AArBA;AAuBA;AACA;AAzBA;;;;;;;;;;;;;;ACxCA;;;;;;;;;;;;;;;;;;AAkBA;AACA;AA4+CA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAzvCA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAcA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AAEA;;;;;;;;;;;;;;AAcA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAUA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;;;AA9WA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAsWA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AACA;AACA;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AACA;AACA;;;;;;AAGA;AAuBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAEA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;;;;AAIA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AAEA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AALA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AANA;AAAA;AAAA;AAAA;AACA;AADA;AAMA;AACA;AAPA;AAIA;AAJA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AASA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;;;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AALA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AARA;AAAA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AATA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAeA;AACA;AAhBA;AAAA;AACA;AADA;AAQA;AARA;AAAA;AACA;AADA;AAOA;AAPA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AAsBA;AACA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAGA;;;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAGA;AAIA;AAEA;AACA;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAxBA;AACA;AAyBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AAIA;;;AACA;AACA;AAIA;;;;;;AA9YA;AAiZA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAsDA;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AANA;AAAA;AAAA;AAAA;AACA;AADA;AAMA;AACA;AAPA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAOA;AACA;AARA;AAAA;AACA;AADA;AAWA;AACA;AAZA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAYA;AACA;AACA;AAdA;AAAA;AAgBA;AACA;AAjBA;AAiBA;AACA;AAlBA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAkBA;AACA;AACA;AApBA;AAAA;AAAA;AAAA;AACA;AAoBA;AACA;AAtBA;AAAA;AAAA;AAAA;AACA;AADA;AAsBA;AACA;AAvBA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AA2BA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;;AAIA;AACA;;;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAJA;AAEA;AAFA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AAMA;AACA;AACA;AACA;AACA;;;;AAjOA;;;;;AAKA;AACA;AAIA;AAAA;AAAA;AAEA;AAGA;;;;;;AArDA;AACA;AAyQA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAGA;AACA;AAJA;AAAA;AAIA;AACA;AALA;AAKA;AACA;AANA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC//CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAEA;;;;;;;;;;;;;;;;;;;AAmBA;AACA;AACA;AADA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAtBA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AATA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAEA;AACA;AAJA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AACA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAAA;AAIA;AACA;;;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AACA;;;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;;;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAMA;AACA;;;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;;AAEA;AACA;;;AAAA;AAKA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAAA;AAKA;AACA;AACA;;;;;;AAxEA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AAWA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AACA;;;AAEA;AACA;AACA;;;;;;AArCA;;;;;;;;;;;;;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AACA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AClKA;;;;;;AAMA;AACA;;;;;;;;AACA;AAaA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAvwCA;AA+wCA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AA7PA;AAiQA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAXA;AAeA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAlBA;AAsBA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAVA;AAcA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAxsBA;AAgtBA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAtfA;AA8fA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAl1CA;AA01CA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC/vIA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AACA;AAyIA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AACA;AAyIA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AA9RA;AAyaA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAdA;AAJA;AA8IA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAdA;AAJA;AA8IA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AACA;AAyIA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AAjJA;AA4RA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AACA;AAyIA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AAjJA;AA4RA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAdA;AAJA;AA9vCA;AA64CA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AA94CA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AAmNA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AAmNA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AAmNA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AAmNA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AA30BA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;AACA;AACA;AAAA;AAQA;;;AAGA;AACA;AACA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;AAkDA;AACA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AACA;AAFA;AAGA;AACA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AACA;AAFA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;AC1EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAUA;AAKA;AAEA;AAKA;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AACA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AAgBA;;;AAGA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;;;ACtEA;;;;;;AAMA;AACA;;;;;;;;AAEA;AAGA;AACA;AACA;AADA;AAIA;AACA;AACA;AANA;AAaA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;AC3BA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA;AACA;AACA;;;;;AAKA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAAA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AALA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAFA;AAAA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1DA;AA2DA;;;;;;;;;;;;;;AC/FA;;;;;;AAMA;AACA;;;;;;;;;AAUA;;;AAGA;AACA;AAAA;AACA;AACA;AAFA;AAoIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC/JA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;AACA;AAGA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;AACA;AACA;AACA;;;;;AAKA;AACA;AAAA;;;;;;;;AAGA;;;;;AAKA;AACA;AACA;AAAA;AACA;AADA;AADA;AACA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AAOA;AACA;AAEA;;;;;AAKA;AACA;;;AAAA;AACA;AAAA;AACA;AADA;AADA;AACA;AACA;AAAA;AACA;AACA;AAEA;;;;;AAKA;AACA;;;AAAA;AACA;AACA;AAEA;;;;;AAKA;AACA;;;AAAA;AACA;AACA;;;;;;AA5DA;AACA;AA8DA;;;;;;;;;;;;;;AC/EA;;;;;;AAMA;AACA;;;;;;;AAOA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AAWA;AAAA;AAAA;AACA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAEA;AAQA;AACA;AAAA;;;AASA;AACA;AACA;AADA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAEA;AAFA;AAAA;AAKA;AACA;AACA;AArBA;AAAA;AACA;AADA;AAqBA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAtCA;AAAA;AAAA;AAAA;AAAA;AACA;AAsCA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AA9DA;AACA;AA8DA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AAAA;AAGA;AACA;;;;;;;;;;;;;;AC9IA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;AAUA;AACA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1BA;AA4BA;AACA;AADA;AAIA;AACA;AADA;AAIA;AACA;AADA;AAeA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAtBA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAPA;AA1BA;AAwCA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AARA;AARA;AAmBA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AARA;AAUA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAbA;AAkBA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAfA;AAnDA;AAqEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AASA;AACA;AACA;AACA;AACA;AAHA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAXA;AAkBA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AA7CA;AAiDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAlBA;AAwBA;AACA;AAnDA;AAqDA;AACA;AACA;AACA;AAAA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAFA;AAhBA;AA3CA;AAiEA;AACA;AACA;AAAA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AA/ZA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAtBA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAPA;AA1BA;AAwCA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AARA;AAkBA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AARA;AAUA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAbA;AAkBA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAfA;AAnDA;AAqEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAVA;AAiBA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AA7CA;AAiDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAlBA;AAwBA;AACA;AAnDA;AAqDA;AACA;AACA;AACA;AAAA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAFA;AAhBA;AA3CA;AAiEA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AA5ZA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAtBA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAPA;AA1BA;AAwCA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AARA;AAkBA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AARA;AAUA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAbA;AAkBA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAfA;AAnDA;AAqEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAVA;AAiBA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AA7CA;AAiDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAlBA;AAwBA;AACA;AAnDA;AAqDA;AACA;AACA;AACA;AAAA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAFA;AAhBA;AA1CA;AAgEA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AA3ZA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAtBA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAPA;AA1BA;AAwCA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AARA;AARA;AAmBA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AATA;AAUA;AACA;AACA;AAAA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAbA;AAkBA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAOA;AAfA;AAnDA;AAqEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAXA;AAkBA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AA7CA;AAiDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAlBA;AAwBA;AACA;AAnDA;AAqDA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAFA;AAhBA;AA1CA;AAgEA;AACA;AACA;AAAA;AACA;AAFA;AAIA;AAAA;AACA;AAAA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AA9ZA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AAEA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAHA;AADA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;AA8hBA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AA2CA;AACA;AAAA;AAEA;AAFA;;;;;;;;;;;;;;ACllBA;;;;;;AAMA;AACA;;;;;;;;AAEA;AAGA;AACA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AACA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AAPA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAGA;AACA;AACA;AADA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AApBA;AACA;AA+CA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;AC1EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAGA;AACA;AANA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;AACA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;AChBA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;;ACAA;AACA;AACA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;;ACLA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAKA;AACA;AAMA;AAGA;AACA;AACA;AADA;AAGA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAJA;AASA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAzBA;AAiCA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAZA;AAeA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AAJA;AAUA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAtBA;AA6BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAJA;AADA;AADA;AA1FA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACdA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAzDA;AA2DA;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtZA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAHA;AADA;AAQA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtCA;AAyCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAKA;AAEA;AAIA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAKA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAJA;AADA;AAcA;AAEA;AAGA;AACA;AACA;AAHA;AAQA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AApEA;AAuEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAEA;AADA;AAKA;AACA;AACA;AACA;AACA;AAHA;AADA;AAQA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AAWA;AACA;AA/CA;AAkDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAOA;AACA;AAAA;AAQA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAVA;AAYA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AA9DA;AAiEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AAQA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AAJA;AADA;AASA;AACA;AACA;AACA;AACA;AAJA;AADA;AAUA;AACA;AACA;AAFA;AADA;AAnBA;AADA;AAgCA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AALA;AAQA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AAWA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAPA;AAWA;AACA;AA7DA;AA8DA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACpKA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAAA;AAAA;AAbA;AAeA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AA9DA;AA+DA;AACA;AADA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAFA;AAIA;AALA;AAQA;AACA;AAAA;AAAA;AAXA;AAaA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtCA;AAuCA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAGA;AACA;AACA;AACA;AAJA;AASA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAWA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AAhFA;AAmFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AALA;AAQA;AACA;AACA;AAFA;AAIA;AALA;AAQA;AACA;AACA;AAFA;AAIA;AALA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAPA;AAiBA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAFA;AACA;AAMA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAjBA;AAsBA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AAPA;AACA;AAUA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAjCA;AAkCA;AACA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3NA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAFA;AAOA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAWA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAOA;AACA;AAAA;AAQA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AA1EA;AA6EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AAnCA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAOA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AA/CA;AAkDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAFA;AACA;AAIA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAGA;AACA;AAFA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AALA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAIA;AAVA;AAaA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAIA;AAVA;AAaA;AACA;AAAA;AAAA;AACA;AACA;AA/BA;AAkCA;AACA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAIA;AAVA;AAaA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAIA;AAVA;AAaA;AACA;AAAA;AAAA;AACA;AACA;AA/BA;AAmCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AA5JA;AA+JA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5LA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAAA;AAAA;AAbA;AAgBA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAAA;AAAA;AAbA;AAgBA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAgBA;AACA;AAtFA;AAyFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC/HA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AApCA;AACA;AADA;AAmDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAlCA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA1DA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AAWA;AAWA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAzEA;AA4EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AADA;AAVA;AALA;AACA;AADA;AAsBA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAHA;AALA;AAaA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAHA;AALA;AAaA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AARA;AAYA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AASA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAJA;AAUA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AATA;AAaA;AACA;AAnDA;AAsDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAhBA;AAmBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AARA;AAYA;AACA;AApBA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpcA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAMA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AADA;AACA;AAQA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AADA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AANA;AAeA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AAOA;AAAA;AAAA;AAAA;AAAA;AAVA;AAYA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAvBA;AA0BA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AAAA;AAAA;AAZA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AADA;AAAA;AAXA;AAeA;AACA;AArGA;AACA;AAsGA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAtBA;AACA;AADA;AAmCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAzBA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AANA;AAxBA;AACA;AADA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AANA;AAjBA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAIA;AAAA;AAAA;AAIA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAbA;AAgBA;AAGA;AACA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAjCA;AACA;AADA;AA8CA;AAEA;AACA;AACA;AACA;AA6CA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AArDA;AAwDA;AACA;AACA;AACA;AA6CA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AArDA;AAwDA;AACA;AACA;AACA;AA6CA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AArDA;AA2DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9OA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AApCA;AACA;AADA;AAmDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC7EA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChCA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtCA;AAyCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AAGA;AACA;AACA;AAHA;AAQA;AACA;AACA;AAGA;AACA;AAFA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AACA;AACA;AAAA;AAAA;AAbA;AAgBA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAJA;AAcA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAHA;AAOA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AADA;AAeA;AACA;AAhGA;AAmGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAdA;AAkBA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAxCA;AAyCA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAdA;AAkBA;AACA;AA7CA;AAgDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA7BA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAlBA;AAqBA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAXA;AAsBA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAnEA;AAsEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAaA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAFA;AAFA;AAOA;AACA;AADA;AAGA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAFA;AAIA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AAFA;AAzBA;AAiCA;AACA;AACA;AAFA;AAlDA;AAhBA;AAwEA;AACA;AACA;AADA;AAGA;AACA;AADA;AAJA;AADA;AAvEA;AACA;AAkFA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AADA;AAKA;AAbA;AAgBA;AACA;AACA;AACA;AACA;AACA;AAGA;AADA;AARA;AAeA;AACA;AACA;AACA;AACA;AACA;AAGA;AADA;AARA;AAeA;AACA;AACA;AACA;AACA;AACA;AAGA;AADA;AAKA;AAAA;AAAA;AAAA;AAbA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtGA;AAyGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/NA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AA1BA;AACA;AADA;AA4CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAcA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAzBA;AACA;AADA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAjCA;AACA;AADA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAFA;AAMA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAlEA;AAmEA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AADA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAzBA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAJA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AAXA;AARA;AAyBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AAXA;AATA;AA2BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAdA;AAmBA;AACA;AAlJA;AAqJA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5KA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAiBA;AACA;AAtEA;AAyEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1BA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AANA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAhBA;AANA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AA3EA;AA8EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AADA;AAgBA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAfA;AAoBA;AACA;AAnDA;AAsDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAfA;AAhCA;AACA;AADA;AAuDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA1CA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AANA;AACA;AADA;AAmBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AANA;AACA;AADA;AAoBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA1BA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AANA;AACA;AADA;AAoBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AANA;AACA;AADA;AAmBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AANA;AACA;AADA;AAoBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AALA;AACA;AADA;AAmBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AArBA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAtBA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAFA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AANA;AAUA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AANA;AAUA;AACA;AA/BA;AAkCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAXA;AANA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAZA;AANA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AADA;AADA;AAcA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAjBA;AAuBA;AACA;AApGA;AAuGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxJA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAXA;AAgBA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAdA;AANA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAGA;AACA;AACA;AAHA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AARA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAtEA;AAyEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AArDA;AAwDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAlCA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAlCA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAvBA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAGA;AACA;AAFA;AAMA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAnBA;AANA;AACA;AADA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAeA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAHA;AADA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AADA;AAiBA;AAGA;AACA;AAFA;AAOA;AACA;AAEA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AALA;AAQA;AACA;AADA;AAGA;AAEA;AACA;AADA;AAGA;AAJA;AAOA;AAZA;AAeA;AACA;AADA;AAGA;AAEA;AACA;AADA;AAGA;AAJA;AAOA;AAZA;AAcA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAcA;AACA;AArJA;AAwJA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjMA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAlEA;AAqEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AARA;AACA;AAeA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AARA;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AATA;AAgBA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAoBA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AAWA;AAWA;AAWA;AAWA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA9HA;AAiIA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxJA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AACA;AAYA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AASA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AArEA;AAwEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AANA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AAFA;AAMA;AAIA;AACA;AACA;AAHA;AAOA;AAIA;AACA;AACA;AAHA;AAOA;AACA;AAAA;AAAA;AAEA;AAGA;AACA;AAFA;AAMA;AACA;AACA;AACA;AAZA;AAcA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA9DA;AAiEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AACA;AACA;AAJA;AAbA;AARA;AADA;AADA;AAoCA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAjBA;AAsBA;AACA;AAhIA;AAmIA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAMA;AAMA;AAMA;AAMA;AAMA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAvGA;AAwGA;AACA;AADA;AAgBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAIA;AAIA;AAIA;AAGA;AACA;AACA;AAHA;AAQA;AAGA;AACA;AACA;AAHA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAtEA;AAuEA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAhCA;AAiCA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAcA;AACA;AA1EA;AA6EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAjBA;AAsBA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAjBA;AAsBA;AACA;AA7BA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AACA;AACA;AAJA;AAbA;AAHA;AADA;AADA;AA+BA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAhDA;AAmDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AADA;AAgBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAFA;AAIA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAbA;AAZA;AACA;AADA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA1BA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAdA;AAhBA;AACA;AADA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAxBA;AAhBA;AACA;AADA;AAgDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACvEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AAAA;AAAA;AAPA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AAbA;AAiBA;AACA;AA5DA;AA+DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AADA;AAGA;AACA;AACA;AAAA;AAAA;AANA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA9CA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AAAA;AAAA;AAPA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAFA;AAQA;AACA;AACA;AAAA;AAAA;AAZA;AAeA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAtDA;AAyDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC5FA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACdA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAGA;AACA;AACA;AAHA;AASA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAAA;AAEA;AACA;AAdA;AALA;AA0BA;AACA;AA9DA;AA+DA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AADA;AAKA;AACA;AAPA;AAUA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AANA;AAoBA;AACA;AAhDA;AAiDA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAkBA;AAGA;AACA;AACA;AACA;AAJA;AAOA;AAAA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAeA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAGA;AACA;AAFA;AAMA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAFA;AAHA;AAWA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAGA;AACA;AACA;AAHA;AASA;AAAA;AAAA;AAAA;AACA;AACA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAAA;AAEA;AACA;AAdA;AANA;AA2BA;AACA;AAnJA;AAoJA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9MA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AA/BA;AA6CA;AACA;AAvDA;AAwDA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAzBA;AAsCA;AACA;AAhDA;AAiDA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAzCA;AAyDA;AACA;AA5EA;AA6EA;AACA;AAIA;AACA;AACA;AACA;AACA;AAJA;AALA;AAeA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACtHA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAHA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AAAA;AAAA;AADA;AAPA;AAFA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAFA;AAQA;AACA;AAfA;AAkBA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAPA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AAGA;AACA;AA1GA;AACA;AA2GA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AACA;AApBA;AADA;AACA;AAwBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AAEA;AAAA;AAAA;AAAA;AAAA;AAVA;AAYA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAWA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAWA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAJA;AAOA;AAtBA;AAyBA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AANA;AAUA;AACA;AA/EA;AAkFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAIA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AACA;AACA;AAFA;AAFA;AAOA;AACA;AADA;AAbA;AADA;AAmBA;AAvBA;AA0BA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAWA;AAAA;AAAA;AAbA;AAgBA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAFA;AAnBA;AA0BA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAnBA;AAuBA;AACA;AA/EA;AAkFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAEA;AAeA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AACA;AACA;AAVA;AACA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AACA;;;AACA;AACA;AAJA;AAVA;AAqBA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AANA;AAaA;AACA;AAtDA;AAyDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AAKA;AACA;AADA;AATA;AAcA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AADA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AATA;AAJA;AAqBA;AACA;AAjFA;AAkFA;AACA;AACA;AAEA;AAAA;AAAA;AAJA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAUA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AALA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAxCA;AAyCA;AACA;AACA;AAFA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AAKA;AACA;AAnBA;AAoBA;AACA;AACA;AAAA;AAAA;AAFA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AADA;AAPA;AACA;AAWA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAKA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AAIA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AAMA;AATA;AAYA;AACA;AA9DA;AA+DA;AACA;AACA;AAFA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AAJA;AAOA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAJA;AAOA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAHA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAnBA;AAJA;AA+BA;AACA;AAvDA;AAwDA;AACA;AACA;AAEA;AAAA;AAAA;AAJA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AA1BA;AAJA;AAkCA;AACA;AAvCA;AAwCA;AACA;AACA;AAAA;AAAA;AACA;AAHA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACvEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAhEA;AAsFA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AA5IA;AAkKA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAzCA;;;;;;;;;;;;;;AClQA;;;;;;AAMA;AACA;;;;;;;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AA9HA;AALA;AAwIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AA9HA;AALA;AAwIA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;;;;;;;;;;;;;;AChuFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAlBA;AA0BA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAlBA;AA5BA;AAwDA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAvGA;;;;;;;;;;;;;;AClEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AADA;;;;;;;;;;;;ACpBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AAUA;;;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhCA;AAkCA;AAlCA;AAwCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAGA;AAAA;AAIA;AAEA;;;;;;AAMA;AACA;AACA;AADA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAHA;AAOA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AALA;AAcA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AALA;AASA;AACA;AAEA;AACA;AACA;AACA;AACA;AAPA;AAUA;AADA;AAIA;AACA;AACA;AAHA;AAbA;AAyBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AAgBA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AAYA;AAAA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAJA;AAJA;AAYA;AAhBA;AAoBA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAHA;AAMA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAeA;AACA;AA9GA;AAiHA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC7MA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACXA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AAzCA;AA4CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAaA;AACA;AAtEA;AAyEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC9GA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACZA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AACA;AAIA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAkBA;AACA;AA1BA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AACA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAoBA;AACA;AA3BA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAjBA;AAqBA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAfA;AAmBA;AACA;AAzCA;AA0CA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AACA;;;AACA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AAHA;AAOA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAjBA;AAqBA;AACA;AA9DA;AAiEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AADA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtCA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAKA;AACA;AACA;AACA;AAJA;AAYA;AACA;AACA;AACA;AAJA;AAxCA;AAkDA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AADA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AATA;AAYA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAFA;AAIA;AATA;AAYA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AATA;AAYA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAFA;AAIA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAiBA;AACA;AA9FA;AAiGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAKA;AACA;AACA;AACA;AAJA;AAYA;AACA;AACA;AACA;AAJA;AAxCA;AAkDA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAFA;AALA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAFA;AANA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAiBA;AACA;AA3DA;AA8DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;;;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AAIA;AAAA;AAVA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AAKA;AADA;AATA;AAgBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAFA;AADA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAxBA;AA2BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACzGA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACbA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AArBA;AA4BA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAXA;AAcA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAzBA;AA6BA;AACA;AAzFA;AA4FA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AARA;AAaA;AACA;AADA;AAnBA;AADA;AAyBA;AA/BA;AAkCA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAnBA;AAuBA;AACA;AAxEA;AAyEA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAlBA;AAyBA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAOA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAFA;AAIA;AAAA;AAAA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AATA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAFA;AAzBA;AAqCA;AACA;AAjGA;AAoGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAWA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AADA;AAvBA;AADA;AACA;AA6BA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAjBA;AAsBA;AACA;AA7CA;AAgDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAGA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAFA;AAJA;AADA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AAAA;AATA;AAYA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AALA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAFA;AARA;AAvCA;AAsDA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAxBA;AA4BA;AACA;AAjHA;AAkHA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7JA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AADA;AAPA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AAGA;AADA;AAIA;AACA;AAFA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AA7BA;AAiCA;AACA;AA5DA;AA+DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AADA;AADA;AAJA;AAgBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AA/BA;AAmCA;AACA;AA1DA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACvFA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AALA;AAaA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AANA;AAUA;AACA;AA1BA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAPA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AANA;AAUA;AACA;AA5BA;AA+BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAAA;AADA;AACA;AASA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AANA;AADA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AADA;AATA;AAeA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AAeA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AACA;AAAA;AACA;AAVA;AACA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AARA;AAeA;AACA;AAtCA;AAyCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC/GA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACdA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAdA;AACA;AADA;AAkCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AAxDA;AA2DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AALA;AACA;AADA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AASA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AATA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAvEA;AA0EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAZA;AACA;AADA;AA4BA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAcA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;;;AACA;AAIA;AACA;AACA;AAHA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AACA;AAHA;AAQA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AAPA;AAWA;AAAA;AAGA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAJA;AAQA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AA7GA;AA8GA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAcA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAYA;AACA;AA3CA;AACA;AA2CA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AANA;AAiBA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAmBA;AACA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/KA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAeA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;;;AACA;AAIA;AACA;AACA;AAHA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AALA;AASA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AAEA;AAAA;AAAA;AAAA;AADA;AAIA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAXA;AAeA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAHA;AAOA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAZA;AAiBA;AACA;AA3HA;AA8HA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5LA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAFA;AAIA;AAAA;AAAA;AANA;AALA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AALA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AALA;AAWA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAFA;AAFA;AALA;AAcA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AAJA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAOA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AAJA;AArBA;AAHA;AAgCA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AApCA;AAuCA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AATA;AAYA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAFA;AAQA;AAAA;AACA;AAAA;AADA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAlCA;AAuCA;AACA;AA5MA;AA6MA;AACA;AACA;AACA;AAFA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjSA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAVA;AAeA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAKA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAZA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAKA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAzBA;AACA;AADA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAKA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAtCA;AACA;AADA;AAwDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAQA;AACA;AAkBA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAbA;AAyBA;AACA;AArCA;AAsCA;AACA;AADA;AAYA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAIA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAFA;AALA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAvEA;AA0EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAhBA;AAdA;AACA;AADA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AApFA;AACA;AADA;AAuGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AA3BA;AACA;AADA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AARA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACpEA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjCA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AAsBA;AAGA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAHA;AARA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAtBA;AAkCA;AACA;AApHA;AAqHA;AACA;AADA;AAYA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1KA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAQA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AADA;AAIA;AAAA;AAAA;AADA;AAfA;AAsBA;AACA;AA1CA;AA2CA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAlCA;AAmCA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AADA;AAJA;AADA;AAUA;AAZA;AAcA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAnBA;AACA;AADA;AA+BA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAGA;AAYA;AAWA;AAQA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AAdA;AAgBA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AAAA;AACA;AAhBA;AAoBA;AACA;AAhGA;AAmGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AArDA;AAwDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAcA;AAEA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AApDA;AAuDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAIA;AAAA;AAAA;AAIA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AALA;AASA;AAbA;AACA;AAgBA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA5CA;AA6CA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA3BA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AApBA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAZA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAbA;AAiBA;AACA;AA1CA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AAFA;AADA;AAQA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAdA;AAmBA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAzBA;AA4BA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AACA;AADA;AAAA;AARA;AAYA;AACA;AA1DA;AA2DA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3GA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACTA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AAGA;AADA;AAJA;AAUA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AAhCA;AAmCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAUA;AAjBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AAfA;AAmBA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AALA;AAUA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AALA;AAXA;AAsBA;AAxBA;AA2BA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAFA;AAQA;AACA;AACA;AADA;AAZA;AAgBA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAFA;AAIA;AAEA;AADA;AANA;AAaA;AAGA;AACA;AACA;AAFA;AAIA;AAEA;AADA;AANA;AAaA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AA1DA;AA8DA;AACA;AA1IA;AA6IA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAFA;AAQA;AACA;AAXA;AAaA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AALA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AARA;AAWA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAlBA;AAsBA;AACA;AAxDA;AA2DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AArBA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAFA;AAIA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAhBA;AACA;AADA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAVA;AACA;AADA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAVA;AACA;AADA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAVA;AACA;AADA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAxDA;AACA;AADA;AAsEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AA7BA;AACA;AADA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AA9BA;AACA;AADA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AADA;AAVA;AACA;AADA;AA2BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AChEA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AADA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AALA;AAMA;AAAA;AACA;AAAA;AAGA;AAEA;AACA;AAAA;AAAA;AAHA;AAIA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAJA;AAQA;AAEA;AAFA;AAGA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAJA;AASA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AADA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AAvBA;AAyBA;AAAA;AAAA;AAGA;AACA;AAzHA;AA0HA;AACA;AACA;AACA;AAFA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AADA;AACA;AAIA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAVA;AAcA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAhCA;AAkCA;AACA;AACA;AAHA;AAWA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAjDA;AAmDA;AACA;AACA;AAHA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAPA;AAUA;AACA;AACA;AACA;AAKA;AACA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAdA;AAnFA;AAwGA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAKA;AACA;AAKA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AAFA;AATA;AAkBA;AAAA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AADA;AAKA;AACA;AAEA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAGA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAzBA;AA2BA;AAAA;AAAA;AAIA;AACA;AAvMA;AA0MA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;AChQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AADA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAKA;AAAA;AACA;AAAA;AAGA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AARA;AAiBA;AACA;AAAA;AAAA;AA5BA;AA6BA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AADA;AAMA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AAlBA;AAoBA;AAAA;AAAA;AAGA;AACA;AAjHA;AAkHA;AACA;AACA;AACA;AAFA;AAIA;AALA;AAUA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACnKA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACbA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAnBA;AACA;AADA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAnBA;AACA;AADA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AArBA;AACA;AADA;AAwCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AAYA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAzDA;AA4DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AA7DA;AAiEA;AAGA;AACA;AAFA;AAMA;AAGA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAMA;AACA;AACA;AACA;AAJA;AAQA;AACA;AAfA;AA0BA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AAQA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AAVA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAFA;AADA;AAMA;AAlBA;AAsBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AADA;AADA;AAKA;AAjBA;AAsBA;AACA;AAtNA;AAyNA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnQA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AA7DA;AAiEA;AAGA;AACA;AACA;AACA;AAJA;AASA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AAVA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAEA;AAFA;AAAA;AAbA;AAmBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAGA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAHA;AAFA;AALA;AADA;AAjBA;AAqCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAEA;AAFA;AAAA;AAbA;AAoBA;AACA;AAxMA;AA2MA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtOA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AADA;AADA;AAFA;AAQA;AACA;AACA;AAAA;AAAA;AAXA;AAcA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AARA;AAYA;AACA;AA9DA;AAiEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AACA;AAOA;AACA;AADA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AALA;AASA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAbA;AAiBA;AACA;AAzDA;AA4DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACjGA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AALA;AAQA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAKA;AAEA;AAEA;AAAA;AAGA;AAAA;AACA;AAEA;AAAA;AACA;AADA;AAAA;AACA;AASA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AADA;AAMA;AAVA;AAaA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AACA;AADA;AANA;AAWA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AAAA;AAAA;AACA;AADA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AANA;AAXA;AAjBA;AAyCA;AACA;AAlEA;AAqEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AAAA;AAAA;AADA;AAhBA;AAqBA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AAAA;AAAA;AADA;AArBA;AA3BA;AAwDA;AACA;AA/DA;AAkEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACnHA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACZA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AACA;AACA;AAJA;AAjBA;AA2BA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AA3CA;AACA;AADA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AChDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAbA;AACA;AAcA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAbA;AACA;AAcA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA3DA;AA8DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AATA;AACA;AADA;AAqBA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AATA;AACA;AADA;AAqBA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAKA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AATA;AACA;AADA;AA2BA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAVA;AAeA;AACA;AAvBA;AAwBA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AAQA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AAJA;AAHA;AACA;AAYA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAGA;AAAA;AACA;AACA;AALA;AAMA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AARA;AASA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAFA;AACA;AAIA;AAAA;AAIA;AACA;AAFA;AAHA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AARA;AACA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AARA;AAYA;AACA;AAhCA;AAiCA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AAFA;AAMA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA7BA;AA8BA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAaA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AANA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAHA;AANA;AAaA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AACA;AADA;AALA;AANA;AAkBA;AACA;AAAA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AArFA;AAqFA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpJA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAaA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AACA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAXA;AAAA;AACA;AAcA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AADA;AAGA;AACA;AAhBA;AAsBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAjBA;AAwBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAcA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAfA;AAHA;AAoCA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AApFA;AAoFA;AACA;AADA;AAUA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClMA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AADA;AAcA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAVA;AAoBA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAcA;AACA;AA5FA;AA4FA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9JA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAaA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AAFA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAEA;AAFA;AAAA;AACA;AAIA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AADA;AAcA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAVA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AAfA;AAmBA;AACA;AApFA;AAoFA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAXA;AAeA;AACA;AArCA;AAwCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAcA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AADA;AAeA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAVA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAcA;AACA;AA5FA;AA+FA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvJA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAGA;AAAA;AAGA;AAEA;AAAA;AAIA;AACA;AACA;AAGA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAlBA;AAFA;AACA;AAuBA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AAQA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAcA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAfA;AAJA;AAoCA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAfA;AA2BA;AACA;AA5FA;AA+FA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAaA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAVA;AAcA;AACA;AA/CA;AA+CA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAhBA;AAyBA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAhBA;AA1BA;AAoDA;AACA;AAEA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAMA;AARA;AAUA;AAZA;AAeA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AADA;AAJA;AAQA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAJA;AADA;AAeA;AACA;AACA;AADA;AADA;AAhBA;AATA;AAgCA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AAHA;AAFA;AASA;AADA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AArCA;AAyCA;AACA;AAlMA;AAqMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACpPA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AAFA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AADA;AAJA;AAXA;AAsBA;AACA;AArCA;AAwCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACjEA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACXA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AANA;AAYA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AANA;AADA;AAeA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA7DA;AAgEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAPA;AAgBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AADA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA1DA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAPA;AAgBA;AACA;AACA;AAWA;AAWA;AACA;AACA;AACA;AAHA;AAXA;AAiBA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA9DA;AAiEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1KA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA5BA;AA+BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAHA;AAMA;AAdA;AAgBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAtBA;AACA;AAwBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAzDA;AA4DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AADA;AAYA;AACA;AACA;AADA;AADA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAxCA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAgBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AAFA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AARA;AAUA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AA/EA;AAkFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAHA;AAJA;AADA;AAaA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA5DA;AA+DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AADA;AAUA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAnCA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AADA;AAGA;AACA;AADA;AAXA;AADA;AAkBA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAWA;AACA;AA1EA;AA6EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AAJA;AA0BA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAtBA;AAkCA;AACA;AApEA;AAqEA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AANA;AAkBA;AACA;AA5BA;AA6BA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA5CA;AA6CA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AAAA;AAEA;AAAA;AAEA;AACA;AADA;AADA;AAKA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAxBA;AAAA;AACA;AA8BA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AAOA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AANA;AARA;AAoBA;AArBA;AAwBA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AArDA;AAwDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAgBA;AAAA;AACA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAbA;AAAA;AACA;AAmBA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AATA;AAAA;AACA;AAcA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AATA;AAAA;AACA;AAcA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AALA;AAPA;AAkBA;AApBA;AAuBA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AAlBA;AADA;AAwBA;AACA;AAlEA;AAqEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AAKA;AACA;AAEA;AAKA;AACA;AAEA;AAKA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AAOA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAjBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAlBA;AAsBA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAlBA;AAuBA;AACA;AA/FA;AAkGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AADA;AAPA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAFA;AATA;AAkBA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AADA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAVA;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAVA;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAVA;AAlFA;AACA;AADA;AAuGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AADA;AAbA;AAiBA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AAUA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AALA;AAUA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AAUA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AALA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AApFA;AAuFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AAHA;AAlBA;AADA;AA0BA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtDA;AAyDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AANA;AAeA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAXA;AAoBA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AALA;AAWA;AACA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AAPA;AAWA;AACA;AAGA;AACA;AACA;AACA;AAJA;AASA;AAZA;AAtEA;AAsFA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAzIA;AA4IA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpMA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AADA;AAPA;AAYA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAvCA;AAwCA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AADA;AASA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AACA;AACA;AACA;AACA;AAFA;AADA;AADA;AASA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AANA;AACA;AADA;AAqBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AAvDA;AA0DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC5FA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrCA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AACA;AApBA;AARA;AACA;AADA;AAmCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AADA;AACA;AAuBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAtBA;AAHA;AACA;AADA;AAwCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AARA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AARA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AANA;AAkBA;AACA;AAxBA;AA2BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AADA;AADA;AAKA;AANA;AASA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAVA;AACA;AADA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAFA;AADA;AADA;AAUA;AAXA;AAcA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAfA;AACA;AADA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AADA;AAKA;AANA;AASA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAVA;AACA;AADA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AADA;AACA;AAuBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAxBA;AAHA;AACA;AADA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AADA;AACA;AAuBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAtBA;AAHA;AACA;AADA;AAyCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAGA;AARA;AALA;AAiBA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AAHA;AAHA;AAPA;AAqBA;AACA;AA5CA;AA6CA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAFA;AADA;AAWA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AAAA;AAAA;AADA;AAZA;AANA;AA2BA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAJA;AADA;AASA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAmBA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AADA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AANA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAJA;AADA;AAUA;AAAA;AAAA;AAXA;AACA;AAcA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAbA;AADA;AACA;AAiBA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AANA;AARA;AAkBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAPA;AAHA;AAxBA;AAyCA;AACA;AApDA;AAuDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;;;AAGA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAJA;AAUA;AACA;AAAA;AAAA;AADA;AAbA;AAkBA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAJA;AAUA;AACA;AAAA;AAAA;AADA;AAdA;AAmBA;AACA;AA3CA;AA+CA;AACA;AA7DA;AAgEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AAAA;AAAA;AADA;AAZA;AANA;AARA;AACA;AADA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAbA;AADA;AACA;AAiBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;AAdA;AAFA;AAoBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAmBA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAFA;AAVA;AAHA;AACA;AADA;AA2BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAFA;AAVA;AARA;AACA;AADA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AADA;AAFA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AARA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAbA;AADA;AACA;AAiBA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AANA;AARA;AAkBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AANA;AAHA;AAxBA;AAwCA;AACA;AA9CA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AADA;AACA;AAuBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAxBA;AAHA;AACA;AADA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3GA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAcA;AACA;AACA;AACA;AACA;AACA;AANA;AAeA;AACA;AApCA;AAqCA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAHA;AASA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAZA;AAeA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AADA;AAAA;AACA;AAAA;AAEA;AAMA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAHA;AADA;AALA;AAZA;AA2BA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AALA;AANA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAZA;AAoBA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AALA;AANA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAZA;AAoBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AALA;AAWA;AAAA;AAAA;AAAA;AAAA;AAhBA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AAnLA;AAoLA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxOA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AAvEA;AA0EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAKA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAVA;AAeA;AACA;AA7CA;AAgDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAhBA;AAqBA;AACA;AAnCA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAnBA;AAsBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA3BA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AAFA;AAMA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AACA;AAWA;AAAA;AAAA;AACA;AACA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AADA;AANA;AARA;AAfA;AACA;AAqCA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAWA;AACA;AAjGA;AAoGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AALA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAPA;AAYA;AACA;AApDA;AAuDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAbA;AAwBA;AACA;AAlCA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC5DA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAWA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AATA;AAYA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACXA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AAAA;AAAA;AAbA;AAgBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AADA;AAfA;AAoBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AAFA;AAAA;AADA;AAKA;AAAA;AAAA;AARA;AAzCA;AAHA;AACA;AADA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AACA;AAAA;AAAA;AADA;AANA;AAPA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AAFA;AAMA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAFA;AAaA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAFA;AAMA;AACA;AAAA;AAAA;AADA;AATA;AAPA;AAwBA;AACA;AAhDA;AAmDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AARA;AAWA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AASA;AACA;AACA;AACA;AAIA;AAPA;AAZA;AAjBA;AAHA;AACA;AADA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAKA;AACA;AADA;AARA;AAaA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAPA;AAWA;AACA;AACA;AACA;AAIA;AAPA;AAdA;AAnBA;AAHA;AACA;AADA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AADA;AAPA;AAYA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AAAA;AADA;AAXA;AAnBA;AAHA;AACA;AADA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AADA;AAPA;AAYA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAXA;AAlBA;AAHA;AACA;AADA;AAkDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AARA;AAWA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AANA;AAQA;AACA;AACA;AACA;AAIA;AAPA;AAXA;AAlBA;AAHA;AACA;AADA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AACA;AAbA;AAeA;AAAA;AAAA;AAlBA;AAqBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AACA;AAfA;AAiBA;AACA;AACA;AACA;AAIA;AAPA;AApBA;AA3BA;AAHA;AACA;AADA;AAmEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAIA;AACA;AAAA;AAAA;AADA;AAPA;AATA;AAHA;AACA;AADA;AA+BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAQA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAeA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AANA;AA1BA;AADA;AACA;AAFA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AARA;AAWA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAVA;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AApCA;AADA;AACA;AAkDA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAVA;AAYA;AAAA;AAAA;AAIA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAAA;AAAA;AAGA;AAzFA;AACA;AAFA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACtDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AAdA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AACA;AAYA;AAAA;AAIA;AAAA;AAJA;AACA;AADA;AACA;AAMA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AACA;AAFA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;AACA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAAA;AADA;AACA;AADA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA5RA;;;;;;;;;;;;;;ACVA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAOA;AAEA;;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AAXA;AAYA;;AAEA;AACA;AAAA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AATA;AACA;AASA;AAAA;AACA;AAAA;AADA;AACA;AADA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAOA;;;AAGA;AACA;AAAA;AAKA;AAAA;AAEA;AAKA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AAtBA;;;;;;;;;;;;;;ACvEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAiBA;AADA;AAKA;AAEA;AAEA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AADA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAUA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AAJA;AAHA;AACA;AAWA;AACA;AACA;AAFA;AACA;AAIA;;;AACA;AAIA;AACA;AAFA;AAOA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AAqBA;AACA;AACA;AACA;AAMA;AAIA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAIA;AACA;AAZA;AACA;AAYA;AAIA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AATA;AAUA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;AClHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAGA;AAyBA;;;;;;AAMA;AACA;AACA;AADA;AAaA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAFA;AAIA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAIA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AA5CA;AA6CA;;AAEA;AACA;AAAA;AAUA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcA;AACA;AA3BA;;;;;;;;;;;;;;AC9FA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACTA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAPA;AAUA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAPA;AAUA;AACA;AADA;AADA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AACA;AAAA;AAAA;AAhBA;AAsBA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AASA;AACA;AA9FA;AA+FA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACxIA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AADA;;;;;;;;;;;;;;ACVA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAGA;AAEA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAzCA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAKA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AADA;AACA;AAFA;AACA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AADA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AADA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAKA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AAqBA;AAqBA;AAqBA;AAqBA;AAYA;AAcA;AAYA;AAeA;AAeA;AAeA;AACA;AAWA;AACA;AAAA;AACA;AAAA;AADA;AACA;AAFA;AACA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AADA;AAAA;AACA;AADA;AACA;AAEA;AAGA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AATA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnPA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAVA;AAPA;AAuBA;AACA;AA1CA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAfA;AA2BA;AACA;AAzCA;AA4CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACZA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAIA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAzBA;AACA;AAiCA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AALA;AASA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAGA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AArCA;AAzGA;AAiJA;AACA;AACA;AAIA;AAAA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AAMA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AADA;AAGA;AACA;AACA;AAGA;AARA;AAYA;AACA;AAnCA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC5RA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAFA;AACA;AAQA;;;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AASA;AAAA;AAEA;AACA;AACA;AACA;AAFA;AAFA;AAOA;AAAA;AAGA;AACA;AAHA;AASA;AAAA;AAAA;AAAA;AASA;AACA;AAtEA;;;;;;;;;;;;;ACzBA;AAAA;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAOA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AAEA;AACA;AAEA;AACA;AAMA;;;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAGA;;;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AACA;AAZA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;A","sourceRoot":""}
\ No newline at end of file
+{"version":3,"file":"main.1c7b681f.iframe.bundle.js","sources":["webpack:///../node_modules/@elastic/eui/es/components/icon/assets lazy ^\\.\\/.*$ namespace object","webpack:///./stories/components/tooltip/tooltip_showcase.scss","webpack:///./stories/metric/3_body.scss","webpack:///./style.scss","webpack:///../node_modules/moment/locale sync ^\\.\\/.*$","webpack:///../packages/charts/src/chart_types/bullet_graph/chart_state.tsx","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/bullet.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/constants.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/index.tsx","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/sub_types/angular.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/sub_types/horizontal.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/sub_types/index.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/renderer/canvas/sub_types/vertical.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/can_display_chart_titles.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_active_value.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_active_values.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_bullet_spec.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_chart_size.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_debug_state.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_layout.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_panel_dimensions.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_tooltip_anchor.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/get_tooltip_info.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/has_chart_titles.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/spec.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/theme.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/utils/angular.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/utils/color.ts","webpack:///../packages/charts/src/chart_types/bullet_graph/utils/ticks.ts","webpack:///../packages/charts/src/chart_types/flame_chart/flame_api.ts","webpack:///../packages/charts/src/chart_types/flame_chart/flame_chart.tsx","webpack:///../packages/charts/src/chart_types/flame_chart/internal_chart_state.ts","webpack:///../packages/charts/src/chart_types/flame_chart/navigation.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/common.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/draw_a_frame.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/draw_canvas.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/draw_webgl.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/ensure_webgl.ts","webpack:///../packages/charts/src/chart_types/flame_chart/render/upload_to_webgl.ts","webpack:///../packages/charts/src/chart_types/flame_chart/shaders.ts","webpack:///../packages/charts/src/chart_types/flame_chart/types.ts","webpack:///../packages/charts/src/chart_types/goal_chart/layout/types/viewmodel_types.ts","webpack:///../packages/charts/src/chart_types/goal_chart/layout/viewmodel/geoms.ts","webpack:///../packages/charts/src/chart_types/goal_chart/layout/viewmodel/utils.ts","webpack:///../packages/charts/src/chart_types/goal_chart/layout/viewmodel/viewmodel.ts","webpack:///../packages/charts/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts","webpack:///../packages/charts/src/chart_types/goal_chart/renderer/canvas/connected_component.tsx","webpack:///../packages/charts/src/chart_types/goal_chart/specs/constants.ts","webpack:///../packages/charts/src/chart_types/goal_chart/specs/index.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/geometries.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/get_chart_type_description.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/get_goal_chart_data.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/get_goal_spec.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/on_element_click_caller.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/on_element_out_caller.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/on_element_over_caller.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/picked_shapes.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/scenegraph.ts","webpack:///../packages/charts/src/chart_types/goal_chart/state/selectors/tooltip.ts","webpack:///../packages/charts/src/chart_types/heatmap/layout/types/viewmodel_types.ts","webpack:///../packages/charts/src/chart_types/heatmap/layout/viewmodel/scenegraph.ts","webpack:///../packages/charts/src/chart_types/heatmap/layout/viewmodel/viewmodel.ts","webpack:///../packages/charts/src/chart_types/heatmap/renderer/canvas/canvas_renderers.ts","webpack:///../packages/charts/src/chart_types/heatmap/renderer/canvas/connected_component.tsx","webpack:///../packages/charts/src/chart_types/heatmap/renderer/canvas/utils.ts","webpack:///../packages/charts/src/chart_types/heatmap/renderer/dom/cursor_band.tsx","webpack:///../packages/charts/src/chart_types/heatmap/renderer/dom/highlighter.tsx","webpack:///../packages/charts/src/chart_types/heatmap/renderer/dom/highlighter_brush.tsx","webpack:///../packages/charts/src/chart_types/heatmap/scales/band_color_scale.ts","webpack:///../packages/charts/src/chart_types/heatmap/specs/heatmap.ts","webpack:///../packages/charts/src/chart_types/heatmap/specs/index.ts","webpack:///../packages/charts/src/chart_types/heatmap/specs/scale_defaults.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/compute_axes_sizes.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/compute_chart_dimensions.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/compute_chart_element_sizes.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/compute_legend.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_brush_area.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_brushed_highlighted_shapes.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_color_scale.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_cursor_band.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_cursor_pointer.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_debug_state.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_heatmap_container_size.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_heatmap_spec.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_heatmap_table.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_highlighted_area.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_highlighted_legend_bands.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_highlighted_legend_item.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_legend_items_labels.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_per_panel_heatmap_geometries.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_picked_cells.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/get_tooltip_anchor.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/is_brush_available.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/is_empty.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_brush_end_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_element_click_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_element_out_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_element_over_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/on_pointer_update_caller.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/picked_shapes.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/selectors/tooltip.ts","webpack:///../packages/charts/src/chart_types/heatmap/state/utils/axis.ts","webpack:///../packages/charts/src/chart_types/index.ts","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/index.tsx","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/metric.tsx","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/progress.tsx","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/sparkline.tsx","webpack:///../packages/charts/src/chart_types/metric/renderer/dom/text.tsx","webpack:///../packages/charts/src/chart_types/metric/specs/index.ts","webpack:///../packages/charts/src/chart_types/metric/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/metric/state/selectors/can_display_chart_titles.ts","webpack:///../packages/charts/src/chart_types/metric/state/selectors/chart_size.ts","webpack:///../packages/charts/src/chart_types/metric/state/selectors/data.ts","webpack:///../packages/charts/src/chart_types/metric/state/selectors/has_chart_titles.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/config.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/types/config_types.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/types/viewmodel_types.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/circline_geometry.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/group_by_rollup.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/highlighted_geoms.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/legend_labels.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/sunburst.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/treemap.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/utils/waffle.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/hierarchy_of_arrays.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/picked_shapes.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/scenegraph.ts","webpack:///../packages/charts/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/canvas/canvas_linear_renderers.ts","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/canvas/canvas_renderers.ts","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/canvas/canvas_wrapped_renderers.ts","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/canvas/partition.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/dom/highlighter.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/dom/highlighter_hover.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/dom/highlighter_legend.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/renderer/dom/layered_partition_chart.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/specs/index.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/compute_legend.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/drilldown_active.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/geometries.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_chart_type_description.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_cursor_pointer.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_debug_state.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_highlighted_shapes.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_legend_items_extra.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_legend_items_labels.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_partition_specs.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/get_screen_reader_data.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/on_element_click_caller.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/on_element_out_caller.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/on_element_over_caller.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/partition_spec.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/picked_shapes.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/tooltip.ts","webpack:///../packages/charts/src/chart_types/partition_chart/state/selectors/tree.ts","webpack:///../packages/charts/src/chart_types/specs.ts","webpack:///../packages/charts/src/chart_types/timeslip/internal_chart_state.ts","webpack:///../packages/charts/src/chart_types/timeslip/projections/axis_model.ts","webpack:///../packages/charts/src/chart_types/timeslip/projections/domain_tween.ts","webpack:///../packages/charts/src/chart_types/timeslip/projections/scale.ts","webpack:///../packages/charts/src/chart_types/timeslip/projections/zoom_pan.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/config.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/data.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/data_fetch.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/annotations/chart_title.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/annotations/time_extent.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/annotations/time_unit.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/cartesian.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/column.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/glyphs/bar.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/glyphs/boxplot.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/glyphs/debug_box.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/render/raster.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip/timeslip_render.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip_api.ts","webpack:///../packages/charts/src/chart_types/timeslip/timeslip_chart.tsx","webpack:///../packages/charts/src/chart_types/timeslip/utils/animation.ts","webpack:///../packages/charts/src/chart_types/timeslip/utils/dom.ts","webpack:///../packages/charts/src/chart_types/timeslip/utils/math.ts","webpack:///../packages/charts/src/chart_types/timeslip/utils/multitouch.ts","webpack:///../packages/charts/src/chart_types/wordcloud/layout/types/viewmodel_types.ts","webpack:///../packages/charts/src/chart_types/wordcloud/layout/viewmodel/viewmodel.ts","webpack:///../packages/charts/src/chart_types/wordcloud/renderer/svg/connected_component.tsx","webpack:///../packages/charts/src/chart_types/wordcloud/specs/index.ts","webpack:///../packages/charts/src/chart_types/wordcloud/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/wordcloud/state/selectors/geometries.ts","webpack:///../packages/charts/src/chart_types/wordcloud/state/selectors/scenegraph.ts","webpack:///../packages/charts/src/chart_types/wordcloud/state/selectors/wordcloud_spec.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/line/dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/rect/dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/rect/tooltip.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/tooltip.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/types.ts","webpack:///../packages/charts/src/chart_types/xy_chart/annotations/utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/axes_sizes.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/chrono/cached_chrono.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/chrono/chrono.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/chrono/chrono_luxon/chrono_luxon.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/continuous_time_rasters.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/multilayer_ticks.ts","webpack:///../packages/charts/src/chart_types/xy_chart/axes/timeslip/numerical_rasters.ts","webpack:///../packages/charts/src/chart_types/xy_chart/crosshair/crosshair_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/domains/x_domain.ts","webpack:///../packages/charts/src/chart_types/xy_chart/domains/y_domain.ts","webpack:///../packages/charts/src/chart_types/xy_chart/legend/legend.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/animations/animation.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/animations/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/annotations/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/annotations/lines.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/annotations/rect.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/areas.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/axes/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/axes/line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/axes/tick.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/axes/tick_label.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/bars.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/bubbles.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/grids.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/lines.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/panel_clipping.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/panels/panels.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/panels/title.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/points.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/path.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/rect.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/shapes.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/primitives/text.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/renderers.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/styles/area.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/styles/bar.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/styles/line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/utils/debug.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/utils/has_mostly_rtl.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/utils/panel_transform.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/values/bar.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/canvas/xy_chart.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/common/utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/annotation_tooltip.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/annotations.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/line_marker.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/annotations/tooltip_content.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/cursor_band.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/cursor_crossline.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/cursor_line.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/dom/highlighter.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/renderer/shapes_paths.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/area.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/bars.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/bubble.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/line_area_style.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/point_style.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/points.ts","webpack:///../packages/charts/src/chart_types/xy_chart/rendering/utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/scales/get_api_scales.ts","webpack:///../packages/charts/src/chart_types/xy_chart/scales/scale_defaults.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/area_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/axis.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/bar_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/bubble_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/histogram_bar_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/line_annotation.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/line_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/specs/rect_annotation.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/chart_state.tsx","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/axis_tick_formatter.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_annotations.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_axes_geometries.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_axis_ticks_dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_chart_dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_chart_transform.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_legend.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_per_panel_axes_geoms.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_series_domains.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/compute_series_geometries.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/count_bars_in_cluster.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_annotation_tooltip_state.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_api_scale_configs.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_axis_styles.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_bar_paddings.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_brush_area.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_chart_type_description.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_computed_scales.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_cursor_band.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_cursor_line.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_cursor_pointer.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_debug_state.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_elements_at_cursor_pos.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_geometries_index.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_geometries_index_keys.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_grid_lines.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_highlighted_annotation_ids_selector.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_highlighted_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_legend_item_extra_values.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_legend_items_labels.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_multiple_rectangle_annotations.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_oriented_projected_pointer_position.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_projected_pointer_position.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_projected_scaled_values.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_series_color_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_si_dataseries_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_specs.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_tooltip_anchor_position.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/get_tooltip_values_highlighted_geoms.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/has_single_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_annotation_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_brush_available.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_chart_empty.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_histogram_mode_enabled.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_tooltip_snap_enabled.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/is_tooltip_visible.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/merge_y_custom_domains.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_brush_end_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_click_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_element_out_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_element_over_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_pointer_move_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/on_projection_area_caller.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/selectors/visible_ticks.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/utils/common.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/utils/get_last_value.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/utils/spec.ts","webpack:///../packages/charts/src/chart_types/xy_chart/state/utils/utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/tooltip/tooltip.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/axis_type_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/axis_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/default_series_sort_fn.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/dimensions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/diverging_offsets.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/fill_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/fit_function.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/fit_function_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/get_linear_ticks.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/grid_lines.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/group_data_series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/indexed_geometry_linear_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/indexed_geometry_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/indexed_geometry_spatial_map.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/interactions.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/scales.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/series.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/specs.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/stacked_series_utils.ts","webpack:///../packages/charts/src/chart_types/xy_chart/utils/texture.ts","webpack:///../packages/charts/src/common/animation.ts","webpack:///../packages/charts/src/common/apca_color_contrast.ts","webpack:///../packages/charts/src/common/category.ts","webpack:///../packages/charts/src/common/color_calcs.ts","webpack:///../packages/charts/src/common/color_library_wrappers.ts","webpack:///../packages/charts/src/common/colors.tsx","webpack:///../packages/charts/src/common/config_objects.ts","webpack:///../packages/charts/src/common/constants.ts","webpack:///../packages/charts/src/common/data_structures.ts","webpack:///../packages/charts/src/common/default_theme_attributes.ts","webpack:///../packages/charts/src/common/event_handler_selectors.ts","webpack:///../packages/charts/src/common/fill_text_color.ts","webpack:///../packages/charts/src/common/geometry.ts","webpack:///../packages/charts/src/common/iterables.ts","webpack:///../packages/charts/src/common/kingly.ts","webpack:///../packages/charts/src/common/math.ts","webpack:///../packages/charts/src/common/panel_utils.ts","webpack:///../packages/charts/src/common/predicate.ts","webpack:///../packages/charts/src/common/series_id.ts","webpack:///../packages/charts/src/common/text_utils.ts","webpack:///../packages/charts/src/common/vectors.ts","webpack:///../packages/charts/src/common/wcag2_color_contrast.ts","webpack:///../packages/charts/src/common/webgl_constants.ts","webpack:///../packages/charts/src/components/accessibility/description.tsx","webpack:///../packages/charts/src/components/accessibility/goal_semantic_description.tsx","webpack:///../packages/charts/src/components/accessibility/index.ts","webpack:///../packages/charts/src/components/accessibility/label.tsx","webpack:///../packages/charts/src/components/accessibility/partitions_data_table.tsx","webpack:///../packages/charts/src/components/accessibility/screen_reader_summary.tsx","webpack:///../packages/charts/src/components/accessibility/types.tsx","webpack:///../packages/charts/src/components/brush/brush.tsx","webpack:///../packages/charts/src/components/chart.tsx","webpack:///../packages/charts/src/components/chart_background.tsx","webpack:///../packages/charts/src/components/chart_container.tsx","webpack:///../packages/charts/src/components/chart_resizer.tsx","webpack:///../packages/charts/src/components/chart_status.tsx","webpack:///../packages/charts/src/components/error_boundary/error_boundary.tsx","webpack:///../packages/charts/src/components/error_boundary/errors.ts","webpack:///../packages/charts/src/components/error_boundary/index.tsx","webpack:///../packages/charts/src/components/grid/aligned_grid.tsx","webpack:///../packages/charts/src/components/icons/assets/alert.tsx","webpack:///../packages/charts/src/components/icons/assets/dot.tsx","webpack:///../packages/charts/src/components/icons/assets/down_arrow.tsx","webpack:///../packages/charts/src/components/icons/assets/empty.tsx","webpack:///../packages/charts/src/components/icons/assets/eye.tsx","webpack:///../packages/charts/src/components/icons/assets/eye_closed.tsx","webpack:///../packages/charts/src/components/icons/assets/list.tsx","webpack:///../packages/charts/src/components/icons/assets/question_in_circle.tsx","webpack:///../packages/charts/src/components/icons/icon.tsx","webpack:///../packages/charts/src/components/index.ts","webpack:///../packages/charts/src/components/legend/color.tsx","webpack:///../packages/charts/src/components/legend/custom_legend.tsx","webpack:///../packages/charts/src/components/legend/extra.tsx","webpack:///../packages/charts/src/components/legend/label.tsx","webpack:///../packages/charts/src/components/legend/legend.tsx","webpack:///../packages/charts/src/components/legend/legend_icon.tsx","webpack:///../packages/charts/src/components/legend/legend_item.tsx","webpack:///../packages/charts/src/components/legend/position_style.ts","webpack:///../packages/charts/src/components/legend/style_utils.ts","webpack:///../packages/charts/src/components/legend/utils.ts","webpack:///../packages/charts/src/components/no_results.tsx","webpack:///../packages/charts/src/components/portal/index.ts","webpack:///../packages/charts/src/components/portal/tooltip_portal.tsx","webpack:///../packages/charts/src/components/portal/types.ts","webpack:///../packages/charts/src/components/portal/utils.ts","webpack:///../packages/charts/src/components/tooltip/components/index.ts","webpack:///../packages/charts/src/components/tooltip/components/tooltip_actions.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_container.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_divider.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_footer.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_header.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_metric_row.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_prompt.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_provider.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_body.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_cell.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_color_cell.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_footer.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_header.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_table_row.tsx","webpack:///../packages/charts/src/components/tooltip/components/tooltip_wrapper.tsx","webpack:///../packages/charts/src/components/tooltip/components/types.ts","webpack:///../packages/charts/src/components/tooltip/index.ts","webpack:///../packages/charts/src/components/tooltip/placement.ts","webpack:///../packages/charts/src/components/tooltip/tooltip.tsx","webpack:///../packages/charts/src/components/tooltip/types.ts","webpack:///../packages/charts/src/geoms/path.ts","webpack:///../packages/charts/src/index.ts","webpack:///../packages/charts/src/mocks/hierarchical/dimension_codes.ts","webpack:///../packages/charts/src/mocks/hierarchical/index.ts","webpack:///../packages/charts/src/mocks/hierarchical/many_pie.ts","webpack:///../packages/charts/src/mocks/hierarchical/mini_sunburst.ts","webpack:///../packages/charts/src/mocks/hierarchical/observability_tree.ts","webpack:///../packages/charts/src/mocks/hierarchical/palettes.ts","webpack:///../packages/charts/src/mocks/hierarchical/pie.ts","webpack:///../packages/charts/src/mocks/hierarchical/sunburst.ts","webpack:///../packages/charts/src/mocks/utils.ts","webpack:///../packages/charts/src/renderers/canvas/index.ts","webpack:///../packages/charts/src/scales/constants.ts","webpack:///../packages/charts/src/scales/index.ts","webpack:///../packages/charts/src/scales/scale_band.ts","webpack:///../packages/charts/src/scales/scale_continuous.ts","webpack:///../packages/charts/src/scales/types.ts","webpack:///../packages/charts/src/solvers/monotonic_hill_climb.ts","webpack:///../packages/charts/src/solvers/screenspace_marker_scale_compressor.ts","webpack:///../packages/charts/src/specs/constants.ts","webpack:///../packages/charts/src/specs/group_by.ts","webpack:///../packages/charts/src/specs/index.ts","webpack:///../packages/charts/src/specs/settings.tsx","webpack:///../packages/charts/src/specs/small_multiples.ts","webpack:///../packages/charts/src/specs/specs_parser.tsx","webpack:///../packages/charts/src/specs/tooltip.ts","webpack:///../packages/charts/src/state/actions/chart.ts","webpack:///../packages/charts/src/state/actions/chart_settings.ts","webpack:///../packages/charts/src/state/actions/colors.ts","webpack:///../packages/charts/src/state/actions/dom_element.ts","webpack:///../packages/charts/src/state/actions/events.ts","webpack:///../packages/charts/src/state/actions/key.ts","webpack:///../packages/charts/src/state/actions/legend.ts","webpack:///../packages/charts/src/state/actions/mouse.ts","webpack:///../packages/charts/src/state/actions/specs.ts","webpack:///../packages/charts/src/state/actions/tooltip.ts","webpack:///../packages/charts/src/state/actions/z_index.ts","webpack:///../packages/charts/src/state/chart_state.ts","webpack:///../packages/charts/src/state/create_selector.ts","webpack:///../packages/charts/src/state/reducers/interactions.ts","webpack:///../packages/charts/src/state/selectors/can_pin_tooltip.ts","webpack:///../packages/charts/src/state/selectors/compute_panels.ts","webpack:///../packages/charts/src/state/selectors/compute_small_multiple_scales.ts","webpack:///../packages/charts/src/state/selectors/get_accessibility_config.ts","webpack:///../packages/charts/src/state/selectors/get_active_pointer_position.ts","webpack:///../packages/charts/src/state/selectors/get_chart_container_dimensions.ts","webpack:///../packages/charts/src/state/selectors/get_chart_id.ts","webpack:///../packages/charts/src/state/selectors/get_chart_rotation.ts","webpack:///../packages/charts/src/state/selectors/get_chart_theme.ts","webpack:///../packages/charts/src/state/selectors/get_chart_type_components.ts","webpack:///../packages/charts/src/state/selectors/get_chart_type_description.ts","webpack:///../packages/charts/src/state/selectors/get_debug_state.ts","webpack:///../packages/charts/src/state/selectors/get_deselected_data_series.ts","webpack:///../packages/charts/src/state/selectors/get_internal_brush_area.ts","webpack:///../packages/charts/src/state/selectors/get_internal_cursor_pointer.ts","webpack:///../packages/charts/src/state/selectors/get_internal_is_brushing.ts","webpack:///../packages/charts/src/state/selectors/get_internal_is_brushing_available.ts","webpack:///../packages/charts/src/state/selectors/get_internal_is_intialized.ts","webpack:///../packages/charts/src/state/selectors/get_internal_is_tooltip_visible.ts","webpack:///../packages/charts/src/state/selectors/get_internal_main_projection_area.ts","webpack:///../packages/charts/src/state/selectors/get_internal_projection_container_area.ts","webpack:///../packages/charts/src/state/selectors/get_internal_sm_domains.ts","webpack:///../packages/charts/src/state/selectors/get_internal_tooltip_anchor_position.ts","webpack:///../packages/charts/src/state/selectors/get_internal_tooltip_info.ts","webpack:///../packages/charts/src/state/selectors/get_last_click.ts","webpack:///../packages/charts/src/state/selectors/get_last_drag.ts","webpack:///../packages/charts/src/state/selectors/get_legend_config_selector.ts","webpack:///../packages/charts/src/state/selectors/get_legend_items.ts","webpack:///../packages/charts/src/state/selectors/get_legend_items_labels.ts","webpack:///../packages/charts/src/state/selectors/get_legend_items_values.ts","webpack:///../packages/charts/src/state/selectors/get_legend_size.ts","webpack:///../packages/charts/src/state/selectors/get_pointer_value.ts","webpack:///../packages/charts/src/state/selectors/get_resolved_background_color.ts","webpack:///../packages/charts/src/state/selectors/get_settings_spec.ts","webpack:///../packages/charts/src/state/selectors/get_small_multiples_index_order.ts","webpack:///../packages/charts/src/state/selectors/get_small_multiples_spec.ts","webpack:///../packages/charts/src/state/selectors/get_specs.ts","webpack:///../packages/charts/src/state/selectors/get_specs_by_type.ts","webpack:///../packages/charts/src/state/selectors/get_tooltip_interaction_state.ts","webpack:///../packages/charts/src/state/selectors/get_tooltip_selected_items.ts","webpack:///../packages/charts/src/state/selectors/get_tooltip_settings.ts","webpack:///../packages/charts/src/state/selectors/get_tooltip_spec.ts","webpack:///../packages/charts/src/state/selectors/has_external_pointer_event.ts","webpack:///../packages/charts/src/state/selectors/is_brushing.ts","webpack:///../packages/charts/src/state/selectors/is_chart_empty.ts","webpack:///../packages/charts/src/state/selectors/is_external_tooltip_visible.ts","webpack:///../packages/charts/src/state/spec_factory.ts","webpack:///../packages/charts/src/state/types.ts","webpack:///../packages/charts/src/state/utils.ts","webpack:///../packages/charts/src/utils/accessor.ts","webpack:///../packages/charts/src/utils/bbox/canvas_text_bbox_calculator.ts","webpack:///../packages/charts/src/utils/chart_size.ts","webpack:///../packages/charts/src/utils/chrono/chrono.ts","webpack:///../packages/charts/src/utils/chrono/elasticsearch.ts","webpack:///../packages/charts/src/utils/chrono/moment.ts","webpack:///../packages/charts/src/utils/common.tsx","webpack:///../packages/charts/src/utils/curves.ts","webpack:///../packages/charts/src/utils/d3-delaunay/index.ts","webpack:///../packages/charts/src/utils/data/data_processing.ts","webpack:///../packages/charts/src/utils/data/date_time.ts","webpack:///../packages/charts/src/utils/data/formatters.ts","webpack:///../packages/charts/src/utils/data_generators/data_generator.ts","webpack:///../packages/charts/src/utils/data_generators/simple_noise.ts","webpack:///../packages/charts/src/utils/data_samples/babynames.ts","webpack:///../packages/charts/src/utils/data_samples/test_dataset.ts","webpack:///../packages/charts/src/utils/data_samples/test_dataset_heatmap.ts","webpack:///../packages/charts/src/utils/data_samples/test_dataset_kibana.ts","webpack:///../packages/charts/src/utils/data_samples/test_dataset_tsvb.ts","webpack:///../packages/charts/src/utils/debounce.ts","webpack:///../packages/charts/src/utils/dimensions.ts","webpack:///../packages/charts/src/utils/domain.ts","webpack:///../packages/charts/src/utils/events.ts","webpack:///../packages/charts/src/utils/fast_deep_equal.ts","webpack:///../packages/charts/src/utils/geometry.ts","webpack:///../packages/charts/src/utils/ids.ts","webpack:///../packages/charts/src/utils/legend.ts","webpack:///../packages/charts/src/utils/logger.ts","webpack:///../packages/charts/src/utils/point.ts","webpack:///../packages/charts/src/utils/series_sort.ts","webpack:///../packages/charts/src/utils/text/wrap.ts","webpack:///../packages/charts/src/utils/themes/base_colors.ts","webpack:///../packages/charts/src/utils/themes/colors.ts","webpack:///../packages/charts/src/utils/themes/dark_theme.ts","webpack:///../packages/charts/src/utils/themes/legacy_dark_theme.ts","webpack:///../packages/charts/src/utils/themes/legacy_light_theme.ts","webpack:///../packages/charts/src/utils/themes/light_theme.ts","webpack:///../packages/charts/src/utils/themes/merge_utils.ts","webpack:///../packages/charts/src/utils/themes/partition.ts","webpack:///../packages/charts/src/utils/themes/theme.ts","webpack:///../packages/charts/src/utils/themes/theme_common.ts","webpack:///../packages/charts/src/utils/time_functions.ts","webpack:///../packages/charts/src/utils/time_zone.ts","webpack:///../packages/charts/src/utils/use_legend_action.ts","webpack:///../public/fonts/atkinson-hyperlegible-v1-latin-700.woff","webpack:///../public/fonts/atkinson-hyperlegible-v1-latin-700.woff2","webpack:///../public/fonts/atkinson-hyperlegible-v1-latin-regular.woff","webpack:///../public/fonts/atkinson-hyperlegible-v1-latin-regular.woff2","webpack:///./generated-stories-entry.js","webpack:///./parameters.ts","webpack:///./preview.ts","webpack:///./preview.ts-generated-config-entry.js","webpack:///\\.)(","webpack:///./stories/annotations/lines/1_x_continuous.story.tsx","webpack:///./stories/annotations/lines/2_x_ordinal.story.tsx","webpack:///./stories/annotations/lines/3_x_time.story.tsx","webpack:///./stories/annotations/lines/4_y_domain.story.tsx","webpack:///./stories/annotations/lines/5_styling.story.tsx","webpack:///./stories/annotations/lines/6_test_single_bar_histogram.story.tsx","webpack:///./stories/annotations/lines/7_tooltip_options.story.tsx","webpack:///./stories/annotations/lines/8_advanced_markers.story.tsx","webpack:///./stories/annotations/lines/line.stories.tsx","webpack:///./stories/annotations/rects/1_linear_bar_chart.story.tsx","webpack:///./stories/annotations/rects/2_ordinal_bar_chart.story.tsx","webpack:///./stories/annotations/rects/3_linear_line_chart.story.tsx","webpack:///./stories/annotations/rects/4_styling.story.tsx","webpack:///./stories/annotations/rects/5_tooltip_options.story.tsx","webpack:///./stories/annotations/rects/6_zero_domain.story.tsx","webpack:///./stories/annotations/rects/7_with_group_id.story.tsx","webpack:///./stories/annotations/rects/8_outside.story.tsx","webpack:///./stories/annotations/rects/9_click_handler.story.tsx","webpack:///./stories/annotations/rects/rects.stories.tsx","webpack:///./stories/area/10_stacked_same_naming.story.tsx","webpack:///./stories/area/11_test_linear.story.tsx","webpack:///./stories/area/12_test_time.story.tsx","webpack:///./stories/area/13_band_area.story.tsx","webpack:///./stories/area/15_stacked_grouped.story.tsx","webpack:///./stories/area/16_test_stacked_with_missing.story.tsx","webpack:///./stories/area/17_negative.story.tsx","webpack:///./stories/area/18_negative_positive.story.tsx","webpack:///./stories/area/19_negative_band.story.tsx","webpack:///./stories/area/1_basic.story.tsx","webpack:///./stories/area/20_stepped_area.story.tsx","webpack:///./stories/area/21_with_time_timeslip.story.tsx","webpack:///./stories/area/2_with_time.story.tsx","webpack:///./stories/area/3_with_linear.story.tsx","webpack:///./stories/area/4_with_log.story.tsx","webpack:///./stories/area/5_with_4_axes.story.tsx","webpack:///./stories/area/6_with_axis_and_legend.story.tsx","webpack:///./stories/area/7_stacked.story.tsx","webpack:///./stories/area/8_stacked_percentage.story.tsx","webpack:///./stories/area/8_stacked_percentage_zeros.story.tsx","webpack:///./stories/area/9_stacked_separate_specs.story.tsx","webpack:///./stories/area/area.stories.tsx","webpack:///./stories/axes/10_one_domain_bound.story.tsx","webpack:///./stories/axes/11_fit_domain_extent.story.tsx","webpack:///./stories/axes/12_duplicate_ticks.story.tsx","webpack:///./stories/axes/13_label_formatting.story.tsx","webpack:///./stories/axes/14_duplicate_ticks_2.story.tsx","webpack:///./stories/axes/15_maximum_fraction_digits.story.tsx","webpack:///./stories/axes/1_basic.story.tsx","webpack:///./stories/axes/2_tick_label_rotation.story.tsx","webpack:///./stories/axes/3_axis_4_axes.story.tsx","webpack:///./stories/axes/4_multi_axis.story.tsx","webpack:///./stories/axes/5_multi_axis_bar_lines.story.tsx","webpack:///./stories/axes/6_different_tooltip.story.tsx","webpack:///./stories/axes/6a_different_tooltip_formatter.story.tsx","webpack:///./stories/axes/7_many_tick_labels.story.tsx","webpack:///./stories/axes/8_custom_domain.story.tsx","webpack:///./stories/axes/9_custom_mixed_domain.story.tsx","webpack:///./stories/axes/axes.stories.tsx","webpack:///./stories/bar/10_axis_and_legend.story.tsx","webpack:///./stories/bar/11_stacked_with_axis_and_legend.story.tsx","webpack:///./stories/bar/12_stacked_as_percentage.story.tsx","webpack:///./stories/bar/13_clustered.story.tsx","webpack:///./stories/bar/14_clustered_multiple.story.tsx","webpack:///./stories/bar/15_time_clustered.story.tsx","webpack:///./stories/bar/17_time_stacked.story.tsx","webpack:///./stories/bar/18_bar_chart_1y0g.story.tsx","webpack:///./stories/bar/19_bar_chart_1y1g.story.tsx","webpack:///./stories/bar/1_basic.story.tsx","webpack:///./stories/bar/20_bar_chart_1y2g.story.tsx","webpack:///./stories/bar/21_bar_chart_2y0g.story.tsx","webpack:///./stories/bar/22_barchart_2y1g.story.tsx","webpack:///./stories/bar/23_bar_chart_2y2g.story.tsx","webpack:///./stories/bar/24_tooltip_visibility.story.tsx","webpack:///./stories/bar/25_high_data_volume.story.tsx","webpack:///./stories/bar/26_single_data_linear.story.tsx","webpack:///./stories/bar/27_single_data_ordinal.story.tsx","webpack:///./stories/bar/28_single_data_clustered.story.tsx","webpack:///./stories/bar/29_single_data_stacked.story.tsx","webpack:///./stories/bar/2_label_value.story.tsx","webpack:///./stories/bar/30_stacked_to_extent.story.tsx","webpack:///./stories/bar/31_negative_and_positive_x_values.story.tsx","webpack:///./stories/bar/32_scale_to_extent.story.tsx","webpack:///./stories/bar/33_band_bar.story.tsx","webpack:///./stories/bar/34_test_linear.story.tsx","webpack:///./stories/bar/35_test_time.story.tsx","webpack:///./stories/bar/36_test_linear_clustered.story.tsx","webpack:///./stories/bar/37_test_time_clustered.story.tsx","webpack:///./stories/bar/38_test_clustered_null_bars.story.tsx","webpack:///./stories/bar/39_test_stacked_null.story.tsx","webpack:///./stories/bar/3_with_axis.story.tsx","webpack:///./stories/bar/40_test_switch.story.tsx","webpack:///./stories/bar/41_test_histogram_linear.story.tsx","webpack:///./stories/bar/42_test_histogram_ordinal.story.tsx","webpack:///./stories/bar/43_test_discover.story.tsx","webpack:///./stories/bar/44_test_single_histogram.story.tsx","webpack:///./stories/bar/45_min_height.story.tsx","webpack:///./stories/bar/46_test_min_height.story.tsx","webpack:///./stories/bar/47_stacked_only_grouped.story.tsx","webpack:///./stories/bar/48_test_tooltip.story.tsx","webpack:///./stories/bar/49_test_dual_axis.story.tsx","webpack:///./stories/bar/4_ordinal.story.tsx","webpack:///./stories/bar/50_order_bins_by_sum.story.tsx","webpack:///./stories/bar/51_label_value_advanced.story.tsx","webpack:///./stories/bar/52_multi_group_same_domain.story.tsx","webpack:///./stories/bar/53_use_domain_from_different_groupid.story.tsx","webpack:///./stories/bar/54_functional_accessors.story.tsx","webpack:///./stories/bar/55_tooltip_boundary.story.tsx","webpack:///./stories/bar/56_test_use_dfl_gdomain.story.tsx","webpack:///./stories/bar/57_test_rect_border_bars.story.tsx","webpack:///./stories/bar/58_data_values.story.tsx","webpack:///./stories/bar/5_linear.story.tsx","webpack:///./stories/bar/6_linear_no_linear_interval.story.tsx","webpack:///./stories/bar/7_with_time_xaxis.story.tsx","webpack:///./stories/bar/8_with_log_yaxis.story.tsx","webpack:///./stories/bar/9_with_stacked_log.story.tsx","webpack:///./stories/bar/bars.stories.tsx","webpack:///./stories/bubble/1_simple.story.tsx","webpack:///./stories/bubble/2_ordinal.story.tsx","webpack:///./stories/bubble/3_multiple.story.tsx","webpack:///./stories/bubble/4_mixed.story.tsx","webpack:///./stories/bubble/mixed.stories.tsx","webpack:///./stories/bullet_graph/1_single.story.tsx","webpack:///./stories/bullet_graph/2_angular.story.tsx","webpack:///./stories/bullet_graph/3_color_bands.story.tsx","webpack:///./stories/bullet_graph/4_single_row.story.tsx","webpack:///./stories/bullet_graph/5_single_column.story.tsx","webpack:///./stories/bullet_graph/6_grid.story.tsx","webpack:///./stories/bullet_graph/bullet_graph.stories.tsx","webpack:///./stories/components/tooltip/10_cartesian_chart.story.tsx","webpack:///./stories/components/tooltip/11_partition_chart.story.tsx","webpack:///./stories/components/tooltip/12_heatmap.story.tsx","webpack:///./stories/components/tooltip/13_flamegraph.story.tsx","webpack:///./stories/components/tooltip/1_composed_list.story.tsx","webpack:///./stories/components/tooltip/2_composed_table.story.tsx","webpack:///./stories/components/tooltip/3_tabular_data.story.tsx","webpack:///./stories/components/tooltip/4_actions_with_custom_tooltip.story.tsx","webpack:///./stories/components/tooltip/5_chart_tooltip.story.tsx","webpack:///./stories/components/tooltip/6_async_actions.story.tsx","webpack:///./stories/components/tooltip/data/index.ts","webpack:///./stories/components/tooltip/data/list.ts","webpack:///./stories/components/tooltip/data/series.ts","webpack:///./stories/components/tooltip/data/table.ts","webpack:///./stories/components/tooltip/tooltip.stories.tsx","webpack:///./stories/components/tooltip/tooltip_showcase.scss?f970","webpack:///./stories/components/tooltip/tooltip_showcase.tsx","webpack:///./stories/composable/1_basic.story.tsx","webpack:///./stories/composable/composable.stories.tsx","webpack:///./stories/debug/1_basic.story.tsx","webpack:///./stories/debug/2_debug_state.story.tsx","webpack:///./stories/debug/debug.stories.tsx","webpack:///./stories/goal/10_band_in_band.story.tsx","webpack:///./stories/goal/11_gaps.story.tsx","webpack:///./stories/goal/12_range.story.tsx","webpack:///./stories/goal/13_confidence_level.story.tsx","webpack:///./stories/goal/14_one_third.story.tsx","webpack:///./stories/goal/15_half_circle.story.tsx","webpack:///./stories/goal/16_two_thirds.story.tsx","webpack:///./stories/goal/17_three_quarters.story.tsx","webpack:///./stories/goal/17_total_circle.story.tsx","webpack:///./stories/goal/17_very_small_gap.story.tsx","webpack:///./stories/goal/18_side_gauge.story.tsx","webpack:///./stories/goal/18_side_gauge_inverted_angle_relation.story.tsx","webpack:///./stories/goal/19_horizontal_negative.story.tsx","webpack:///./stories/goal/20_vertical_negative.story.tsx","webpack:///./stories/goal/21_goal_negative.story.tsx","webpack:///./stories/goal/22_horizontal_plusminus.story.tsx","webpack:///./stories/goal/23_vertical_plusminus.story.tsx","webpack:///./stories/goal/24_goal_plusminus.story.tsx","webpack:///./stories/goal/25_goal_semantic.story.tsx","webpack:///./stories/goal/26_auto_linear_ticks.story.tsx","webpack:///./stories/goal/2_gauge_with_target.story.tsx","webpack:///./stories/goal/3_horizontal_bullet.story.tsx","webpack:///./stories/goal/4_vertical_bullet.story.tsx","webpack:///./stories/goal/5_minimal.story.tsx","webpack:///./stories/goal/6_minimal_horizontal.story.tsx","webpack:///./stories/goal/7_horizontal_bar.story.tsx","webpack:///./stories/goal/8_irregular_ticks.story.tsx","webpack:///./stories/goal/9_minimal_band.story.tsx","webpack:///./stories/goal/goal.stories.tsx","webpack:///./stories/grids/1_basic.story.tsx","webpack:///./stories/grids/2_multiple_axes.story.tsx","webpack:///./stories/grids/3_lines.story.tsx","webpack:///./stories/grids/grids.stories.tsx","webpack:///./stories/heatmap/1_basic.story.tsx","webpack:///./stories/heatmap/2_categorical.story.tsx","webpack:///./stories/heatmap/3_time.story.tsx","webpack:///./stories/heatmap/4_test_time_snap.story.tsx","webpack:///./stories/heatmap/5_theming.story.tsx","webpack:///./stories/heatmap/6_label_rotation.story.tsx","webpack:///./stories/heatmap/7_sorting.story.tsx","webpack:///./stories/heatmap/heatmap.stories.tsx","webpack:///./stories/icicle/01_unix_icicle.story.tsx","webpack:///./stories/icicle/02_unix_flame.story.tsx","webpack:///./stories/icicle/03_cpu_profile_flame.story.tsx","webpack:///./stories/icicle/04_cpu_profile_gl_flame.story.tsx","webpack:///./stories/icicle/icicle.stories.tsx","webpack:///./stories/interactions/10_brush_selection_bar.story.tsx","webpack:///./stories/interactions/10a_brush_selection_bar_hist.story.tsx","webpack:///./stories/interactions/11_brush_time.story.tsx","webpack:///./stories/interactions/12_brush_time_hist.story.tsx","webpack:///./stories/interactions/13_brush_disabled_ordinal.story.tsx","webpack:///./stories/interactions/14_crosshair_time.story.tsx","webpack:///./stories/interactions/15_render_change.story.tsx","webpack:///./stories/interactions/16_cursor_update_action.story.tsx","webpack:///./stories/interactions/17_png_export.story.tsx","webpack:///./stories/interactions/18_null_values.story.tsx","webpack:///./stories/interactions/19_multi_chart_cursor_sync.story.tsx","webpack:///./stories/interactions/1_bar_clicks.story.tsx","webpack:///./stories/interactions/2_area_point_clicks.story.tsx","webpack:///./stories/interactions/3_line_point_clicks.story.tsx","webpack:///./stories/interactions/4_line_area_bar_clicks.story.tsx","webpack:///./stories/interactions/4_sunburst_slice_clicks.story.tsx","webpack:///./stories/interactions/5_clicks_legend_items_bar.story.tsx","webpack:///./stories/interactions/6_clicks_legend_items_area.story.tsx","webpack:///./stories/interactions/7_clicks_legend_items_line.story.tsx","webpack:///./stories/interactions/8_clicks_legend_items_mixed.story.tsx","webpack:///./stories/interactions/9_brush_selection_linear.story.tsx","webpack:///./stories/interactions/9a_brush_selection_linear.story.tsx","webpack:///./stories/interactions/interactions.stories.tsx","webpack:///./stories/legend/10_sunburst.story.tsx","webpack:///./stories/legend/10_sunburst_repeated_label.story.tsx","webpack:///./stories/legend/11_legend_actions.story.tsx","webpack:///./stories/legend/12_legend_margins.story.tsx","webpack:///./stories/legend/13_inside_chart.story.tsx","webpack:///./stories/legend/14_single_series.story.tsx","webpack:///./stories/legend/15_legend_sort.story.tsx","webpack:///./stories/legend/16_custom_legend.story.tsx","webpack:///./stories/legend/1_legend_positioning.story.tsx","webpack:///./stories/legend/5_changing_specs.story.tsx","webpack:///./stories/legend/6_hide_legend.story.tsx","webpack:///./stories/legend/8_spacing_buffer.story.tsx","webpack:///./stories/legend/9_color_picker.story.tsx","webpack:///./stories/legend/legend.stories.tsx","webpack:///./stories/legend/legend_size_knob.ts","webpack:///./stories/line/10_test_path_ordering.story.tsx","webpack:///./stories/line/11_discontinuous_data_points.story.tsx","webpack:///./stories/line/12_isolated_data_points.story.tsx","webpack:///./stories/line/13_line_mark_accessor.story.tsx","webpack:///./stories/line/14_point_shapes.story.tsx","webpack:///./stories/line/15_test_negative_points.story.tsx","webpack:///./stories/line/1_basic.story.tsx","webpack:///./stories/line/2_w_axis.story.tsx","webpack:///./stories/line/3_ordinal.story.tsx","webpack:///./stories/line/4_linear.story.tsx","webpack:///./stories/line/5_w_axis_and_legend.story.tsx","webpack:///./stories/line/6_curved.story.tsx","webpack:///./stories/line/7_multiple.story.tsx","webpack:///./stories/line/8_stacked.story.tsx","webpack:///./stories/line/9_multi_series.story.tsx","webpack:///./stories/line/line.stories.tsx","webpack:///./stories/metric/1_basic.story.tsx","webpack:///./stories/metric/2_grid.story.tsx","webpack:///./stories/metric/3_body.scss?a9a3","webpack:///./stories/metric/3_body.story.tsx","webpack:///./stories/metric/metric.stories.tsx","webpack:///./stories/mixed/1_bars_and_lines.story.tsx","webpack:///./stories/mixed/2_lines_and_areas.story.tsx","webpack:///./stories/mixed/3_areas_and_bars.story.tsx","webpack:///./stories/mixed/4_test_bar.story.tsx","webpack:///./stories/mixed/5_test_bar_time.story.tsx","webpack:///./stories/mixed/6_fitting.story.tsx","webpack:///./stories/mixed/6_fitting_stacked.story.tsx","webpack:///./stories/mixed/7_marks.story.tsx","webpack:///./stories/mixed/8_polarized_stacked.story.tsx","webpack:///./stories/mixed/mixed.stories.tsx","webpack:///./stories/mosaic/10_mosaic_simple.story.tsx","webpack:///./stories/mosaic/20_mosaic_with_other.story.tsx","webpack:///./stories/mosaic/mosaic.stories.tsx","webpack:///./stories/rotations/1_ordinal.story.tsx","webpack:///./stories/rotations/2_negative_ordinal.story.tsx","webpack:///./stories/rotations/3_rotations_ordinal.story.tsx","webpack:///./stories/rotations/4_90_ordinal.story.tsx","webpack:///./stories/rotations/5_180_ordinal.story.tsx","webpack:///./stories/rotations/6_negative_linear.story.tsx","webpack:///./stories/rotations/7_rotations_linear.story.tsx","webpack:///./stories/rotations/8_90_deg_linear.story.tsx","webpack:///./stories/rotations/9_180_deg_linear.story.tsx","webpack:///./stories/rotations/rotations.stories.tsx","webpack:///./stories/scales/1_different_timezones.story.tsx","webpack:///./stories/scales/2_local_tooltip.story.tsx","webpack:///./stories/scales/3_utc_tooltip.story.tsx","webpack:///./stories/scales/4_specified_timezone.story.tsx","webpack:///./stories/scales/6_x_scale_fallback.story.tsx","webpack:///./stories/scales/7_log_scale_options.story.tsx","webpack:///./stories/scales/8_linear_binary.story.tsx","webpack:///./stories/scales/scales.stories.tsx","webpack:///./stories/small_multiples/2_vertical_areas.story.tsx","webpack:///./stories/small_multiples/3_grid_lines.story.tsx","webpack:///./stories/small_multiples/4_horizontal_bars.story.tsx","webpack:///./stories/small_multiples/4_vertical_bars.story.tsx","webpack:///./stories/small_multiples/5_histogram_bars.story.tsx","webpack:///./stories/small_multiples/6_heterogeneous_cartesians.story.tsx","webpack:///./stories/small_multiples/7_sunbursts.story.tsx","webpack:///./stories/small_multiples/8_sorting.story.tsx","webpack:///./stories/small_multiples/9_heatmap.story.tsx","webpack:///./stories/small_multiples/small_multiples.stories.tsx","webpack:///./stories/streamgraph/1_basic.story.tsx","webpack:///./stories/streamgraph/streamgraph.stories.tsx","webpack:///./stories/stylings/10_custom_bars.story.tsx","webpack:///./stories/stylings/11_custom_lines.story.tsx","webpack:///./stories/stylings/12_custom_area.story.tsx","webpack:///./stories/stylings/13_custom_series_name.story.tsx","webpack:///./stories/stylings/13_custom_series_name_config.story.tsx","webpack:///./stories/stylings/14_custom_series_name_formatting.story.tsx","webpack:///./stories/stylings/15_tick_label.story.tsx","webpack:///./stories/stylings/16_style_accessor.story.tsx","webpack:///./stories/stylings/17_bar_series_color_variant.story.tsx","webpack:///./stories/stylings/18_line_series_color_variant.story.tsx","webpack:///./stories/stylings/19_area_series_color_variant.story.tsx","webpack:///./stories/stylings/1_chart_size.story.tsx","webpack:///./stories/stylings/20_partition_background.story.tsx","webpack:///./stories/stylings/21_partition_labels.story.tsx","webpack:///./stories/stylings/22_dark_theme.story.tsx","webpack:///./stories/stylings/23_with_texture.story.tsx","webpack:///./stories/stylings/24_texture_multiple_series.story.tsx","webpack:///./stories/stylings/25_mixed_point_shapes.story.tsx","webpack:///./stories/stylings/26_highlighter_style.story.tsx","webpack:///./stories/stylings/2_margins.story.tsx","webpack:///./stories/stylings/3_axis.story.tsx","webpack:///./stories/stylings/4_theme_styling.story.tsx","webpack:///./stories/stylings/5_partial_custom_theme.story.tsx","webpack:///./stories/stylings/6_partial_and_base.story.tsx","webpack:///./stories/stylings/7_multiple_custom.story.tsx","webpack:///./stories/stylings/8_custom_series_colors_array.story.tsx","webpack:///./stories/stylings/9_custom_series_colors_function.story.tsx","webpack:///./stories/stylings/stylings.stories.tsx","webpack:///./stories/sunburst/10_2_slice.story.tsx","webpack:///./stories/sunburst/11_small_large.story.tsx","webpack:///./stories/sunburst/12_very_small.story.tsx","webpack:///./stories/sunburst/13_empty.story.tsx","webpack:///./stories/sunburst/14_full_zero.story.tsx","webpack:///./stories/sunburst/15_single.story.tsx","webpack:///./stories/sunburst/15_single_sunburst.story.tsx","webpack:///./stories/sunburst/16_single_small.story.tsx","webpack:///./stories/sunburst/17_single_very_small.story.tsx","webpack:///./stories/sunburst/18_no_sliced.story.tsx","webpack:///./stories/sunburst/19_negative.story.tsx","webpack:///./stories/sunburst/1_simple.story.tsx","webpack:///./stories/sunburst/20_total_zero.story.tsx","webpack:///./stories/sunburst/21_high_pie.story.tsx","webpack:///./stories/sunburst/22_counter_clockwise.story.tsx","webpack:///./stories/sunburst/23_clockwise.story.tsx","webpack:///./stories/sunburst/24_linked_label.story.tsx","webpack:///./stories/sunburst/25_no_labels.story.tsx","webpack:///./stories/sunburst/26_percentage.story.tsx","webpack:///./stories/sunburst/27_heterogeneous_depth.story.tsx","webpack:///./stories/sunburst/28_not_a_number.story.tsx","webpack:///./stories/sunburst/29_custom_stroke.story.tsx","webpack:///./stories/sunburst/2_value_formatted.story.tsx","webpack:///./stories/sunburst/30_largest_circle.story.tsx","webpack:///./stories/sunburst/31_bold_link_value.story.tsx","webpack:///./stories/sunburst/32_custom_tooltip.story.tsx","webpack:///./stories/sunburst/33_ordered_slices.story.tsx","webpack:///./stories/sunburst/3_value_formatted_2.story.tsx","webpack:///./stories/sunburst/4_fill_labels.story.tsx","webpack:///./stories/sunburst/5_donut.story.tsx","webpack:///./stories/sunburst/6_pie_chart_labels.story.tsx","webpack:///./stories/sunburst/6_pie_chart_linked_labels.story.tsx","webpack:///./stories/sunburst/7_zero_slice.story.tsx","webpack:///./stories/sunburst/8_sunburst_two_layers.story.tsx","webpack:///./stories/sunburst/9_sunburst_three_layers.story.tsx","webpack:///./stories/sunburst/sunburst.stories.tsx","webpack:///./stories/test_cases/10_highlighter_z_index.story.tsx","webpack:///./stories/test_cases/1_no_series.story.tsx","webpack:///./stories/test_cases/21_domain_edges.story.tsx","webpack:///./stories/test_cases/2_chrome_path_bug_fix.story.tsx","webpack:///./stories/test_cases/3_no_axes_annotation.story.tsx","webpack:///./stories/test_cases/4_filter_zero_values_log.story.tsx","webpack:///./stories/test_cases/5_legend_scroll_bar_sizing.story.tsx","webpack:///./stories/test_cases/6_a11y_custom_description.story.tsx","webpack:///./stories/test_cases/7_rtl_text.story.tsx","webpack:///./stories/test_cases/8_test_points_outside_of_domain.story.tsx","webpack:///./stories/test_cases/9_duplicate_labels_in_partition_legend.story.tsx","webpack:///./stories/test_cases/test_cases.stories.tsx","webpack:///./stories/timeslip/01_timeslip.story.tsx","webpack:///./stories/timeslip/timeslip.stories.tsx","webpack:///./stories/treemap/10_three_layers.story.tsx","webpack:///./stories/treemap/1_one_layer.story.tsx","webpack:///./stories/treemap/2_one_layer_2.story.tsx","webpack:///./stories/treemap/3_mid_two.story.tsx","webpack:///./stories/treemap/4_two_layer_stress.story.tsx","webpack:///./stories/treemap/5_multicolor.story.tsx","webpack:///./stories/treemap/6_custom_style.story.tsx","webpack:///./stories/treemap/7_percentage.story.tsx","webpack:///./stories/treemap/8_groove_text.story.tsx","webpack:///./stories/treemap/9_zero_values.story.tsx","webpack:///./stories/treemap/treemap.stories.tsx","webpack:///./stories/utils/components/get_color_picker.tsx","webpack:///./stories/utils/components/get_legend_action.tsx","webpack:///./stories/utils/datasets/product_profits.ts","webpack:///./stories/utils/debug_state_logger.ts","webpack:///./stories/utils/formatters.ts","webpack:///./stories/utils/hierarchical_input_utils.tsx","webpack:///./stories/utils/knobs/constants.ts","webpack:///./stories/utils/knobs/custom.ts","webpack:///./stories/utils/knobs/enums.ts","webpack:///./stories/utils/knobs/eui.ts","webpack:///./stories/utils/knobs/index.ts","webpack:///./stories/utils/knobs/special_enums.ts","webpack:///./stories/utils/knobs/utils.ts","webpack:///./stories/utils/storybook.ts","webpack:///./stories/utils/text/1_wrap.story.tsx","webpack:///./stories/utils/text/text.stories.tsx","webpack:///./stories/utils/use_heatmap_selection.ts","webpack:///./stories/utils/utils.ts","webpack:///./stories/waffle/1_simple.story.tsx","webpack:///./stories/waffle/2_test.story.tsx","webpack:///./stories/waffle/waffle.stories.tsx","webpack:///./stories/wordcloud/1_wordcloud.story.tsx","webpack:///./stories/wordcloud/wordcloud.stories.tsx","webpack:///./story_wrapper.tsx","webpack:///./storybook-init-framework-entry.js","webpack:///./style.scss?84a2","webpack:///./use_base_theme.ts","webpack:///./util.inspect (ignored)?f2f0","webpack:///./util.inspect (ignored)?a099","webpack:///./util.inspect (ignored)?328e","webpack:///./util.inspect (ignored)?b82f","webpack:///./util.inspect (ignored)?741a","webpack:///./util.inspect (ignored)?22e4","webpack:///./util.inspect (ignored)?a8cd","webpack:///./util.inspect (ignored)","webpack:///crypto (ignored)"],"sourcesContent":["var map = {\n\t\"./\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index.js\",\n\t\t\"icon.\"\n\t],\n\t\"./accessibility\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/accessibility.js\",\n\t\t\"icon.accessibility\"\n\t],\n\t\"./accessibility.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/accessibility.js\",\n\t\t\"icon.accessibility\"\n\t],\n\t\"./aggregate\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/aggregate.js\",\n\t\t\"icon.aggregate\"\n\t],\n\t\"./aggregate.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/aggregate.js\",\n\t\t\"icon.aggregate\"\n\t],\n\t\"./alert\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/alert.js\",\n\t\t\"icon.alert\"\n\t],\n\t\"./alert.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/alert.js\",\n\t\t\"icon.alert\"\n\t],\n\t\"./analyzeEvent\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/analyzeEvent.js\",\n\t\t\"icon.analyzeEvent\"\n\t],\n\t\"./analyzeEvent.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/analyzeEvent.js\",\n\t\t\"icon.analyzeEvent\"\n\t],\n\t\"./analyze_event\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/analyze_event.js\",\n\t\t\"icon.analyze_event\"\n\t],\n\t\"./analyze_event.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/analyze_event.js\",\n\t\t\"icon.analyze_event\"\n\t],\n\t\"./annotation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/annotation.js\",\n\t\t\"icon.annotation\"\n\t],\n\t\"./annotation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/annotation.js\",\n\t\t\"icon.annotation\"\n\t],\n\t\"./apm_trace\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/apm_trace.js\",\n\t\t\"icon.apm_trace\"\n\t],\n\t\"./apm_trace.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/apm_trace.js\",\n\t\t\"icon.apm_trace\"\n\t],\n\t\"./app_add_data\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_add_data.js\",\n\t\t\"icon.app_add_data\"\n\t],\n\t\"./app_add_data.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_add_data.js\",\n\t\t\"icon.app_add_data\"\n\t],\n\t\"./app_advanced_settings\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_advanced_settings.js\",\n\t\t\"icon.app_advanced_settings\"\n\t],\n\t\"./app_advanced_settings.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_advanced_settings.js\",\n\t\t\"icon.app_advanced_settings\"\n\t],\n\t\"./app_agent\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_agent.js\",\n\t\t\"icon.app_agent\"\n\t],\n\t\"./app_agent.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_agent.js\",\n\t\t\"icon.app_agent\"\n\t],\n\t\"./app_apm\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_apm.js\",\n\t\t\"icon.app_apm\"\n\t],\n\t\"./app_apm.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_apm.js\",\n\t\t\"icon.app_apm\"\n\t],\n\t\"./app_app_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_app_search.js\",\n\t\t\"icon.app_app_search\"\n\t],\n\t\"./app_app_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_app_search.js\",\n\t\t\"icon.app_app_search\"\n\t],\n\t\"./app_auditbeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_auditbeat.js\",\n\t\t\"icon.app_auditbeat\"\n\t],\n\t\"./app_auditbeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_auditbeat.js\",\n\t\t\"icon.app_auditbeat\"\n\t],\n\t\"./app_canvas\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_canvas.js\",\n\t\t\"icon.app_canvas\"\n\t],\n\t\"./app_canvas.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_canvas.js\",\n\t\t\"icon.app_canvas\"\n\t],\n\t\"./app_cases\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_cases.js\",\n\t\t\"icon.app_cases\"\n\t],\n\t\"./app_cases.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_cases.js\",\n\t\t\"icon.app_cases\"\n\t],\n\t\"./app_code\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_code.js\",\n\t\t\"icon.app_code\"\n\t],\n\t\"./app_code.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_code.js\",\n\t\t\"icon.app_code\"\n\t],\n\t\"./app_console\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_console.js\",\n\t\t\"icon.app_console\"\n\t],\n\t\"./app_console.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_console.js\",\n\t\t\"icon.app_console\"\n\t],\n\t\"./app_cross_cluster_replication\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_cross_cluster_replication.js\",\n\t\t\"icon.app_cross_cluster_replication\"\n\t],\n\t\"./app_cross_cluster_replication.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_cross_cluster_replication.js\",\n\t\t\"icon.app_cross_cluster_replication\"\n\t],\n\t\"./app_dashboard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_dashboard.js\",\n\t\t\"icon.app_dashboard\"\n\t],\n\t\"./app_dashboard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_dashboard.js\",\n\t\t\"icon.app_dashboard\"\n\t],\n\t\"./app_devtools\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_devtools.js\",\n\t\t\"icon.app_devtools\"\n\t],\n\t\"./app_devtools.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_devtools.js\",\n\t\t\"icon.app_devtools\"\n\t],\n\t\"./app_discover\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_discover.js\",\n\t\t\"icon.app_discover\"\n\t],\n\t\"./app_discover.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_discover.js\",\n\t\t\"icon.app_discover\"\n\t],\n\t\"./app_ems\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_ems.js\",\n\t\t\"icon.app_ems\"\n\t],\n\t\"./app_ems.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_ems.js\",\n\t\t\"icon.app_ems\"\n\t],\n\t\"./app_filebeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_filebeat.js\",\n\t\t\"icon.app_filebeat\"\n\t],\n\t\"./app_filebeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_filebeat.js\",\n\t\t\"icon.app_filebeat\"\n\t],\n\t\"./app_fleet\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_fleet.js\",\n\t\t\"icon.app_fleet\"\n\t],\n\t\"./app_fleet.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_fleet.js\",\n\t\t\"icon.app_fleet\"\n\t],\n\t\"./app_gis\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_gis.js\",\n\t\t\"icon.app_gis\"\n\t],\n\t\"./app_gis.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_gis.js\",\n\t\t\"icon.app_gis\"\n\t],\n\t\"./app_graph\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_graph.js\",\n\t\t\"icon.app_graph\"\n\t],\n\t\"./app_graph.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_graph.js\",\n\t\t\"icon.app_graph\"\n\t],\n\t\"./app_grok\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_grok.js\",\n\t\t\"icon.app_grok\"\n\t],\n\t\"./app_grok.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_grok.js\",\n\t\t\"icon.app_grok\"\n\t],\n\t\"./app_heartbeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_heartbeat.js\",\n\t\t\"icon.app_heartbeat\"\n\t],\n\t\"./app_heartbeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_heartbeat.js\",\n\t\t\"icon.app_heartbeat\"\n\t],\n\t\"./app_index_management\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_management.js\",\n\t\t\"icon.app_index_management\"\n\t],\n\t\"./app_index_management.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_management.js\",\n\t\t\"icon.app_index_management\"\n\t],\n\t\"./app_index_pattern\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_pattern.js\",\n\t\t\"icon.app_index_pattern\"\n\t],\n\t\"./app_index_pattern.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_pattern.js\",\n\t\t\"icon.app_index_pattern\"\n\t],\n\t\"./app_index_rollup\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_rollup.js\",\n\t\t\"icon.app_index_rollup\"\n\t],\n\t\"./app_index_rollup.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_index_rollup.js\",\n\t\t\"icon.app_index_rollup\"\n\t],\n\t\"./app_lens\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_lens.js\",\n\t\t\"icon.app_lens\"\n\t],\n\t\"./app_lens.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_lens.js\",\n\t\t\"icon.app_lens\"\n\t],\n\t\"./app_logs\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_logs.js\",\n\t\t\"icon.app_logs\"\n\t],\n\t\"./app_logs.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_logs.js\",\n\t\t\"icon.app_logs\"\n\t],\n\t\"./app_management\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_management.js\",\n\t\t\"icon.app_management\"\n\t],\n\t\"./app_management.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_management.js\",\n\t\t\"icon.app_management\"\n\t],\n\t\"./app_metricbeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_metricbeat.js\",\n\t\t\"icon.app_metricbeat\"\n\t],\n\t\"./app_metricbeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_metricbeat.js\",\n\t\t\"icon.app_metricbeat\"\n\t],\n\t\"./app_metrics\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_metrics.js\",\n\t\t\"icon.app_metrics\"\n\t],\n\t\"./app_metrics.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_metrics.js\",\n\t\t\"icon.app_metrics\"\n\t],\n\t\"./app_ml\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_ml.js\",\n\t\t\"icon.app_ml\"\n\t],\n\t\"./app_ml.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_ml.js\",\n\t\t\"icon.app_ml\"\n\t],\n\t\"./app_monitoring\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_monitoring.js\",\n\t\t\"icon.app_monitoring\"\n\t],\n\t\"./app_monitoring.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_monitoring.js\",\n\t\t\"icon.app_monitoring\"\n\t],\n\t\"./app_notebook\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_notebook.js\",\n\t\t\"icon.app_notebook\"\n\t],\n\t\"./app_notebook.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_notebook.js\",\n\t\t\"icon.app_notebook\"\n\t],\n\t\"./app_packetbeat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_packetbeat.js\",\n\t\t\"icon.app_packetbeat\"\n\t],\n\t\"./app_packetbeat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_packetbeat.js\",\n\t\t\"icon.app_packetbeat\"\n\t],\n\t\"./app_pipeline\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_pipeline.js\",\n\t\t\"icon.app_pipeline\"\n\t],\n\t\"./app_pipeline.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_pipeline.js\",\n\t\t\"icon.app_pipeline\"\n\t],\n\t\"./app_recently_viewed\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_recently_viewed.js\",\n\t\t\"icon.app_recently_viewed\"\n\t],\n\t\"./app_recently_viewed.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_recently_viewed.js\",\n\t\t\"icon.app_recently_viewed\"\n\t],\n\t\"./app_reporting\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_reporting.js\",\n\t\t\"icon.app_reporting\"\n\t],\n\t\"./app_reporting.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_reporting.js\",\n\t\t\"icon.app_reporting\"\n\t],\n\t\"./app_saved_objects\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_saved_objects.js\",\n\t\t\"icon.app_saved_objects\"\n\t],\n\t\"./app_saved_objects.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_saved_objects.js\",\n\t\t\"icon.app_saved_objects\"\n\t],\n\t\"./app_search_profiler\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_search_profiler.js\",\n\t\t\"icon.app_search_profiler\"\n\t],\n\t\"./app_search_profiler.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_search_profiler.js\",\n\t\t\"icon.app_search_profiler\"\n\t],\n\t\"./app_security\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_security.js\",\n\t\t\"icon.app_security\"\n\t],\n\t\"./app_security.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_security.js\",\n\t\t\"icon.app_security\"\n\t],\n\t\"./app_security_analytics\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_security_analytics.js\",\n\t\t\"icon.app_security_analytics\"\n\t],\n\t\"./app_security_analytics.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_security_analytics.js\",\n\t\t\"icon.app_security_analytics\"\n\t],\n\t\"./app_spaces\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_spaces.js\",\n\t\t\"icon.app_spaces\"\n\t],\n\t\"./app_spaces.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_spaces.js\",\n\t\t\"icon.app_spaces\"\n\t],\n\t\"./app_sql\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_sql.js\",\n\t\t\"icon.app_sql\"\n\t],\n\t\"./app_sql.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_sql.js\",\n\t\t\"icon.app_sql\"\n\t],\n\t\"./app_timelion\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_timelion.js\",\n\t\t\"icon.app_timelion\"\n\t],\n\t\"./app_timelion.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_timelion.js\",\n\t\t\"icon.app_timelion\"\n\t],\n\t\"./app_upgrade_assistant\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_upgrade_assistant.js\",\n\t\t\"icon.app_upgrade_assistant\"\n\t],\n\t\"./app_upgrade_assistant.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_upgrade_assistant.js\",\n\t\t\"icon.app_upgrade_assistant\"\n\t],\n\t\"./app_uptime\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_uptime.js\",\n\t\t\"icon.app_uptime\"\n\t],\n\t\"./app_uptime.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_uptime.js\",\n\t\t\"icon.app_uptime\"\n\t],\n\t\"./app_users_roles\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_users_roles.js\",\n\t\t\"icon.app_users_roles\"\n\t],\n\t\"./app_users_roles.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_users_roles.js\",\n\t\t\"icon.app_users_roles\"\n\t],\n\t\"./app_visualize\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_visualize.js\",\n\t\t\"icon.app_visualize\"\n\t],\n\t\"./app_visualize.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_visualize.js\",\n\t\t\"icon.app_visualize\"\n\t],\n\t\"./app_vulnerability_management\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_vulnerability_management.js\",\n\t\t\"icon.app_vulnerability_management\"\n\t],\n\t\"./app_vulnerability_management.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_vulnerability_management.js\",\n\t\t\"icon.app_vulnerability_management\"\n\t],\n\t\"./app_watches\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_watches.js\",\n\t\t\"icon.app_watches\"\n\t],\n\t\"./app_watches.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_watches.js\",\n\t\t\"icon.app_watches\"\n\t],\n\t\"./app_workplace_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_workplace_search.js\",\n\t\t\"icon.app_workplace_search\"\n\t],\n\t\"./app_workplace_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/app_workplace_search.js\",\n\t\t\"icon.app_workplace_search\"\n\t],\n\t\"./apps\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/apps.js\",\n\t\t\"icon.apps\"\n\t],\n\t\"./apps.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/apps.js\",\n\t\t\"icon.apps\"\n\t],\n\t\"./arrowEnd\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrowEnd.js\",\n\t\t\"icon.arrowEnd\"\n\t],\n\t\"./arrowEnd.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrowEnd.js\",\n\t\t\"icon.arrowEnd\"\n\t],\n\t\"./arrowStart\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrowStart.js\",\n\t\t\"icon.arrowStart\"\n\t],\n\t\"./arrowStart.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrowStart.js\",\n\t\t\"icon.arrowStart\"\n\t],\n\t\"./arrow_down\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_down.js\",\n\t\t\"icon.arrow_down\"\n\t],\n\t\"./arrow_down.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_down.js\",\n\t\t\"icon.arrow_down\"\n\t],\n\t\"./arrow_left\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_left.js\",\n\t\t\"icon.arrow_left\"\n\t],\n\t\"./arrow_left.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_left.js\",\n\t\t\"icon.arrow_left\"\n\t],\n\t\"./arrow_right\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_right.js\",\n\t\t\"icon.arrow_right\"\n\t],\n\t\"./arrow_right.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_right.js\",\n\t\t\"icon.arrow_right\"\n\t],\n\t\"./arrow_up\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_up.js\",\n\t\t\"icon.arrow_up\"\n\t],\n\t\"./arrow_up.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/arrow_up.js\",\n\t\t\"icon.arrow_up\"\n\t],\n\t\"./article\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/article.js\",\n\t\t\"icon.article\"\n\t],\n\t\"./article.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/article.js\",\n\t\t\"icon.article\"\n\t],\n\t\"./asterisk\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/asterisk.js\",\n\t\t\"icon.asterisk\"\n\t],\n\t\"./asterisk.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/asterisk.js\",\n\t\t\"icon.asterisk\"\n\t],\n\t\"./at\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/at.js\",\n\t\t\"icon.at\"\n\t],\n\t\"./at.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/at.js\",\n\t\t\"icon.at\"\n\t],\n\t\"./beaker\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/beaker.js\",\n\t\t\"icon.beaker\"\n\t],\n\t\"./beaker.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/beaker.js\",\n\t\t\"icon.beaker\"\n\t],\n\t\"./bell\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bell.js\",\n\t\t\"icon.bell\"\n\t],\n\t\"./bell.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bell.js\",\n\t\t\"icon.bell\"\n\t],\n\t\"./bellSlash\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bellSlash.js\",\n\t\t\"icon.bellSlash\"\n\t],\n\t\"./bellSlash.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bellSlash.js\",\n\t\t\"icon.bellSlash\"\n\t],\n\t\"./beta\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/beta.js\",\n\t\t\"icon.beta\"\n\t],\n\t\"./beta.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/beta.js\",\n\t\t\"icon.beta\"\n\t],\n\t\"./bolt\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bolt.js\",\n\t\t\"icon.bolt\"\n\t],\n\t\"./bolt.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bolt.js\",\n\t\t\"icon.bolt\"\n\t],\n\t\"./boxes_horizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/boxes_horizontal.js\",\n\t\t\"icon.boxes_horizontal\"\n\t],\n\t\"./boxes_horizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/boxes_horizontal.js\",\n\t\t\"icon.boxes_horizontal\"\n\t],\n\t\"./boxes_vertical\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/boxes_vertical.js\",\n\t\t\"icon.boxes_vertical\"\n\t],\n\t\"./boxes_vertical.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/boxes_vertical.js\",\n\t\t\"icon.boxes_vertical\"\n\t],\n\t\"./branch\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/branch.js\",\n\t\t\"icon.branch\"\n\t],\n\t\"./branch.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/branch.js\",\n\t\t\"icon.branch\"\n\t],\n\t\"./branchUser\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/branchUser.js\",\n\t\t\"icon.branchUser\"\n\t],\n\t\"./branchUser.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/branchUser.js\",\n\t\t\"icon.branchUser\"\n\t],\n\t\"./broom\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/broom.js\",\n\t\t\"icon.broom\"\n\t],\n\t\"./broom.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/broom.js\",\n\t\t\"icon.broom\"\n\t],\n\t\"./brush\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/brush.js\",\n\t\t\"icon.brush\"\n\t],\n\t\"./brush.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/brush.js\",\n\t\t\"icon.brush\"\n\t],\n\t\"./bug\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bug.js\",\n\t\t\"icon.bug\"\n\t],\n\t\"./bug.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bug.js\",\n\t\t\"icon.bug\"\n\t],\n\t\"./bullseye\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bullseye.js\",\n\t\t\"icon.bullseye\"\n\t],\n\t\"./bullseye.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/bullseye.js\",\n\t\t\"icon.bullseye\"\n\t],\n\t\"./calendar\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/calendar.js\",\n\t\t\"icon.calendar\"\n\t],\n\t\"./calendar.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/calendar.js\",\n\t\t\"icon.calendar\"\n\t],\n\t\"./check\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/check.js\",\n\t\t\"icon.check\"\n\t],\n\t\"./check.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/check.js\",\n\t\t\"icon.check\"\n\t],\n\t\"./checkInCircleFilled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/checkInCircleFilled.js\",\n\t\t\"icon.checkInCircleFilled\"\n\t],\n\t\"./checkInCircleFilled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/checkInCircleFilled.js\",\n\t\t\"icon.checkInCircleFilled\"\n\t],\n\t\"./cheer\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cheer.js\",\n\t\t\"icon.cheer\"\n\t],\n\t\"./cheer.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cheer.js\",\n\t\t\"icon.cheer\"\n\t],\n\t\"./clock\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/clock.js\",\n\t\t\"icon.clock\"\n\t],\n\t\"./clock.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/clock.js\",\n\t\t\"icon.clock\"\n\t],\n\t\"./cloudDrizzle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudDrizzle.js\",\n\t\t\"icon.cloudDrizzle\"\n\t],\n\t\"./cloudDrizzle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudDrizzle.js\",\n\t\t\"icon.cloudDrizzle\"\n\t],\n\t\"./cloudStormy\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudStormy.js\",\n\t\t\"icon.cloudStormy\"\n\t],\n\t\"./cloudStormy.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudStormy.js\",\n\t\t\"icon.cloudStormy\"\n\t],\n\t\"./cloudSunny\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudSunny.js\",\n\t\t\"icon.cloudSunny\"\n\t],\n\t\"./cloudSunny.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cloudSunny.js\",\n\t\t\"icon.cloudSunny\"\n\t],\n\t\"./cluster\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cluster.js\",\n\t\t\"icon.cluster\"\n\t],\n\t\"./cluster.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cluster.js\",\n\t\t\"icon.cluster\"\n\t],\n\t\"./color\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/color.js\",\n\t\t\"icon.color\"\n\t],\n\t\"./color.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/color.js\",\n\t\t\"icon.color\"\n\t],\n\t\"./compute\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/compute.js\",\n\t\t\"icon.compute\"\n\t],\n\t\"./compute.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/compute.js\",\n\t\t\"icon.compute\"\n\t],\n\t\"./console\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/console.js\",\n\t\t\"icon.console\"\n\t],\n\t\"./console.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/console.js\",\n\t\t\"icon.console\"\n\t],\n\t\"./container\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/container.js\",\n\t\t\"icon.container\"\n\t],\n\t\"./container.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/container.js\",\n\t\t\"icon.container\"\n\t],\n\t\"./continuityAbove\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityAbove.js\",\n\t\t\"icon.continuityAbove\"\n\t],\n\t\"./continuityAbove.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityAbove.js\",\n\t\t\"icon.continuityAbove\"\n\t],\n\t\"./continuityAboveBelow\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityAboveBelow.js\",\n\t\t\"icon.continuityAboveBelow\"\n\t],\n\t\"./continuityAboveBelow.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityAboveBelow.js\",\n\t\t\"icon.continuityAboveBelow\"\n\t],\n\t\"./continuityBelow\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityBelow.js\",\n\t\t\"icon.continuityBelow\"\n\t],\n\t\"./continuityBelow.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityBelow.js\",\n\t\t\"icon.continuityBelow\"\n\t],\n\t\"./continuityWithin\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityWithin.js\",\n\t\t\"icon.continuityWithin\"\n\t],\n\t\"./continuityWithin.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/continuityWithin.js\",\n\t\t\"icon.continuityWithin\"\n\t],\n\t\"./controls_horizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/controls_horizontal.js\",\n\t\t\"icon.controls_horizontal\"\n\t],\n\t\"./controls_horizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/controls_horizontal.js\",\n\t\t\"icon.controls_horizontal\"\n\t],\n\t\"./controls_vertical\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/controls_vertical.js\",\n\t\t\"icon.controls_vertical\"\n\t],\n\t\"./controls_vertical.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/controls_vertical.js\",\n\t\t\"icon.controls_vertical\"\n\t],\n\t\"./copy\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/copy.js\",\n\t\t\"icon.copy\"\n\t],\n\t\"./copy.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/copy.js\",\n\t\t\"icon.copy\"\n\t],\n\t\"./copy_clipboard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/copy_clipboard.js\",\n\t\t\"icon.copy_clipboard\"\n\t],\n\t\"./copy_clipboard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/copy_clipboard.js\",\n\t\t\"icon.copy_clipboard\"\n\t],\n\t\"./cross\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cross.js\",\n\t\t\"icon.cross\"\n\t],\n\t\"./cross.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cross.js\",\n\t\t\"icon.cross\"\n\t],\n\t\"./crosshairs\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/crosshairs.js\",\n\t\t\"icon.crosshairs\"\n\t],\n\t\"./crosshairs.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/crosshairs.js\",\n\t\t\"icon.crosshairs\"\n\t],\n\t\"./currency\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/currency.js\",\n\t\t\"icon.currency\"\n\t],\n\t\"./currency.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/currency.js\",\n\t\t\"icon.currency\"\n\t],\n\t\"./cut\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cut.js\",\n\t\t\"icon.cut\"\n\t],\n\t\"./cut.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/cut.js\",\n\t\t\"icon.cut\"\n\t],\n\t\"./database\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/database.js\",\n\t\t\"icon.database\"\n\t],\n\t\"./database.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/database.js\",\n\t\t\"icon.database\"\n\t],\n\t\"./desktop\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/desktop.js\",\n\t\t\"icon.desktop\"\n\t],\n\t\"./desktop.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/desktop.js\",\n\t\t\"icon.desktop\"\n\t],\n\t\"./diff\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/diff.js\",\n\t\t\"icon.diff\"\n\t],\n\t\"./diff.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/diff.js\",\n\t\t\"icon.diff\"\n\t],\n\t\"./discuss\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/discuss.js\",\n\t\t\"icon.discuss\"\n\t],\n\t\"./discuss.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/discuss.js\",\n\t\t\"icon.discuss\"\n\t],\n\t\"./document\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/document.js\",\n\t\t\"icon.document\"\n\t],\n\t\"./document.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/document.js\",\n\t\t\"icon.document\"\n\t],\n\t\"./documentEdit\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documentEdit.js\",\n\t\t\"icon.documentEdit\"\n\t],\n\t\"./documentEdit.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documentEdit.js\",\n\t\t\"icon.documentEdit\"\n\t],\n\t\"./documentation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documentation.js\",\n\t\t\"icon.documentation\"\n\t],\n\t\"./documentation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documentation.js\",\n\t\t\"icon.documentation\"\n\t],\n\t\"./documents\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documents.js\",\n\t\t\"icon.documents\"\n\t],\n\t\"./documents.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/documents.js\",\n\t\t\"icon.documents\"\n\t],\n\t\"./dot\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/dot.js\",\n\t\t\"icon.dot\"\n\t],\n\t\"./dot.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/dot.js\",\n\t\t\"icon.dot\"\n\t],\n\t\"./dotInCircle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/dotInCircle.js\",\n\t\t\"icon.dotInCircle\"\n\t],\n\t\"./dotInCircle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/dotInCircle.js\",\n\t\t\"icon.dotInCircle\"\n\t],\n\t\"./doubleArrowLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/doubleArrowLeft.js\",\n\t\t\"icon.doubleArrowLeft\"\n\t],\n\t\"./doubleArrowLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/doubleArrowLeft.js\",\n\t\t\"icon.doubleArrowLeft\"\n\t],\n\t\"./doubleArrowRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/doubleArrowRight.js\",\n\t\t\"icon.doubleArrowRight\"\n\t],\n\t\"./doubleArrowRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/doubleArrowRight.js\",\n\t\t\"icon.doubleArrowRight\"\n\t],\n\t\"./download\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/download.js\",\n\t\t\"icon.download\"\n\t],\n\t\"./download.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/download.js\",\n\t\t\"icon.download\"\n\t],\n\t\"./editorDistributeHorizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorDistributeHorizontal.js\",\n\t\t\"icon.editorDistributeHorizontal\"\n\t],\n\t\"./editorDistributeHorizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorDistributeHorizontal.js\",\n\t\t\"icon.editorDistributeHorizontal\"\n\t],\n\t\"./editorDistributeVertical\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorDistributeVertical.js\",\n\t\t\"icon.editorDistributeVertical\"\n\t],\n\t\"./editorDistributeVertical.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorDistributeVertical.js\",\n\t\t\"icon.editorDistributeVertical\"\n\t],\n\t\"./editorItemAlignBottom\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignBottom.js\",\n\t\t\"icon.editorItemAlignBottom\"\n\t],\n\t\"./editorItemAlignBottom.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignBottom.js\",\n\t\t\"icon.editorItemAlignBottom\"\n\t],\n\t\"./editorItemAlignCenter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignCenter.js\",\n\t\t\"icon.editorItemAlignCenter\"\n\t],\n\t\"./editorItemAlignCenter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignCenter.js\",\n\t\t\"icon.editorItemAlignCenter\"\n\t],\n\t\"./editorItemAlignLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignLeft.js\",\n\t\t\"icon.editorItemAlignLeft\"\n\t],\n\t\"./editorItemAlignLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignLeft.js\",\n\t\t\"icon.editorItemAlignLeft\"\n\t],\n\t\"./editorItemAlignMiddle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignMiddle.js\",\n\t\t\"icon.editorItemAlignMiddle\"\n\t],\n\t\"./editorItemAlignMiddle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignMiddle.js\",\n\t\t\"icon.editorItemAlignMiddle\"\n\t],\n\t\"./editorItemAlignRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignRight.js\",\n\t\t\"icon.editorItemAlignRight\"\n\t],\n\t\"./editorItemAlignRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignRight.js\",\n\t\t\"icon.editorItemAlignRight\"\n\t],\n\t\"./editorItemAlignTop\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignTop.js\",\n\t\t\"icon.editorItemAlignTop\"\n\t],\n\t\"./editorItemAlignTop.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorItemAlignTop.js\",\n\t\t\"icon.editorItemAlignTop\"\n\t],\n\t\"./editorPositionBottomLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionBottomLeft.js\",\n\t\t\"icon.editorPositionBottomLeft\"\n\t],\n\t\"./editorPositionBottomLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionBottomLeft.js\",\n\t\t\"icon.editorPositionBottomLeft\"\n\t],\n\t\"./editorPositionBottomRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionBottomRight.js\",\n\t\t\"icon.editorPositionBottomRight\"\n\t],\n\t\"./editorPositionBottomRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionBottomRight.js\",\n\t\t\"icon.editorPositionBottomRight\"\n\t],\n\t\"./editorPositionTopLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionTopLeft.js\",\n\t\t\"icon.editorPositionTopLeft\"\n\t],\n\t\"./editorPositionTopLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionTopLeft.js\",\n\t\t\"icon.editorPositionTopLeft\"\n\t],\n\t\"./editorPositionTopRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionTopRight.js\",\n\t\t\"icon.editorPositionTopRight\"\n\t],\n\t\"./editorPositionTopRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editorPositionTopRight.js\",\n\t\t\"icon.editorPositionTopRight\"\n\t],\n\t\"./editor_align_center\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_center.js\",\n\t\t\"icon.editor_align_center\"\n\t],\n\t\"./editor_align_center.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_center.js\",\n\t\t\"icon.editor_align_center\"\n\t],\n\t\"./editor_align_left\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_left.js\",\n\t\t\"icon.editor_align_left\"\n\t],\n\t\"./editor_align_left.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_left.js\",\n\t\t\"icon.editor_align_left\"\n\t],\n\t\"./editor_align_right\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_right.js\",\n\t\t\"icon.editor_align_right\"\n\t],\n\t\"./editor_align_right.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_align_right.js\",\n\t\t\"icon.editor_align_right\"\n\t],\n\t\"./editor_bold\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_bold.js\",\n\t\t\"icon.editor_bold\"\n\t],\n\t\"./editor_bold.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_bold.js\",\n\t\t\"icon.editor_bold\"\n\t],\n\t\"./editor_checklist\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_checklist.js\",\n\t\t\"icon.editor_checklist\"\n\t],\n\t\"./editor_checklist.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_checklist.js\",\n\t\t\"icon.editor_checklist\"\n\t],\n\t\"./editor_code_block\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_code_block.js\",\n\t\t\"icon.editor_code_block\"\n\t],\n\t\"./editor_code_block.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_code_block.js\",\n\t\t\"icon.editor_code_block\"\n\t],\n\t\"./editor_comment\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_comment.js\",\n\t\t\"icon.editor_comment\"\n\t],\n\t\"./editor_comment.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_comment.js\",\n\t\t\"icon.editor_comment\"\n\t],\n\t\"./editor_heading\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_heading.js\",\n\t\t\"icon.editor_heading\"\n\t],\n\t\"./editor_heading.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_heading.js\",\n\t\t\"icon.editor_heading\"\n\t],\n\t\"./editor_italic\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_italic.js\",\n\t\t\"icon.editor_italic\"\n\t],\n\t\"./editor_italic.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_italic.js\",\n\t\t\"icon.editor_italic\"\n\t],\n\t\"./editor_link\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_link.js\",\n\t\t\"icon.editor_link\"\n\t],\n\t\"./editor_link.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_link.js\",\n\t\t\"icon.editor_link\"\n\t],\n\t\"./editor_ordered_list\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_ordered_list.js\",\n\t\t\"icon.editor_ordered_list\"\n\t],\n\t\"./editor_ordered_list.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_ordered_list.js\",\n\t\t\"icon.editor_ordered_list\"\n\t],\n\t\"./editor_redo\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_redo.js\",\n\t\t\"icon.editor_redo\"\n\t],\n\t\"./editor_redo.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_redo.js\",\n\t\t\"icon.editor_redo\"\n\t],\n\t\"./editor_strike\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_strike.js\",\n\t\t\"icon.editor_strike\"\n\t],\n\t\"./editor_strike.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_strike.js\",\n\t\t\"icon.editor_strike\"\n\t],\n\t\"./editor_table\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_table.js\",\n\t\t\"icon.editor_table\"\n\t],\n\t\"./editor_table.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_table.js\",\n\t\t\"icon.editor_table\"\n\t],\n\t\"./editor_underline\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_underline.js\",\n\t\t\"icon.editor_underline\"\n\t],\n\t\"./editor_underline.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_underline.js\",\n\t\t\"icon.editor_underline\"\n\t],\n\t\"./editor_undo\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_undo.js\",\n\t\t\"icon.editor_undo\"\n\t],\n\t\"./editor_undo.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_undo.js\",\n\t\t\"icon.editor_undo\"\n\t],\n\t\"./editor_unordered_list\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_unordered_list.js\",\n\t\t\"icon.editor_unordered_list\"\n\t],\n\t\"./editor_unordered_list.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/editor_unordered_list.js\",\n\t\t\"icon.editor_unordered_list\"\n\t],\n\t\"./email\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/email.js\",\n\t\t\"icon.email\"\n\t],\n\t\"./email.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/email.js\",\n\t\t\"icon.email\"\n\t],\n\t\"./empty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/empty.js\"\n\t],\n\t\"./empty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/empty.js\"\n\t],\n\t\"./endpoint\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/endpoint.js\",\n\t\t\"icon.endpoint\"\n\t],\n\t\"./endpoint.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/endpoint.js\",\n\t\t\"icon.endpoint\"\n\t],\n\t\"./eql\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eql.js\",\n\t\t\"icon.eql\"\n\t],\n\t\"./eql.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eql.js\",\n\t\t\"icon.eql\"\n\t],\n\t\"./eraser\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eraser.js\",\n\t\t\"icon.eraser\"\n\t],\n\t\"./eraser.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eraser.js\",\n\t\t\"icon.eraser\"\n\t],\n\t\"./error\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/error.js\",\n\t\t\"icon.error\"\n\t],\n\t\"./error.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/error.js\",\n\t\t\"icon.error\"\n\t],\n\t\"./esqlVis\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/esqlVis.js\",\n\t\t\"icon.esqlVis\"\n\t],\n\t\"./esqlVis.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/esqlVis.js\",\n\t\t\"icon.esqlVis\"\n\t],\n\t\"./exit\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/exit.js\",\n\t\t\"icon.exit\"\n\t],\n\t\"./exit.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/exit.js\",\n\t\t\"icon.exit\"\n\t],\n\t\"./expand\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/expand.js\",\n\t\t\"icon.expand\"\n\t],\n\t\"./expand.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/expand.js\",\n\t\t\"icon.expand\"\n\t],\n\t\"./expandMini\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/expandMini.js\",\n\t\t\"icon.expandMini\"\n\t],\n\t\"./expandMini.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/expandMini.js\",\n\t\t\"icon.expandMini\"\n\t],\n\t\"./export\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/export.js\",\n\t\t\"icon.export\"\n\t],\n\t\"./export.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/export.js\",\n\t\t\"icon.export\"\n\t],\n\t\"./eye\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eye.js\",\n\t\t\"icon.eye\"\n\t],\n\t\"./eye.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eye.js\",\n\t\t\"icon.eye\"\n\t],\n\t\"./eye_closed\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eye_closed.js\",\n\t\t\"icon.eye_closed\"\n\t],\n\t\"./eye_closed.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/eye_closed.js\",\n\t\t\"icon.eye_closed\"\n\t],\n\t\"./face_happy\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_happy.js\",\n\t\t\"icon.face_happy\"\n\t],\n\t\"./face_happy.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_happy.js\",\n\t\t\"icon.face_happy\"\n\t],\n\t\"./face_neutral\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_neutral.js\",\n\t\t\"icon.face_neutral\"\n\t],\n\t\"./face_neutral.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_neutral.js\",\n\t\t\"icon.face_neutral\"\n\t],\n\t\"./face_sad\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_sad.js\",\n\t\t\"icon.face_sad\"\n\t],\n\t\"./face_sad.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/face_sad.js\",\n\t\t\"icon.face_sad\"\n\t],\n\t\"./filter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filter.js\",\n\t\t\"icon.filter\"\n\t],\n\t\"./filter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filter.js\",\n\t\t\"icon.filter\"\n\t],\n\t\"./filterExclude\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterExclude.js\",\n\t\t\"icon.filterExclude\"\n\t],\n\t\"./filterExclude.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterExclude.js\",\n\t\t\"icon.filterExclude\"\n\t],\n\t\"./filterIgnore\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterIgnore.js\",\n\t\t\"icon.filterIgnore\"\n\t],\n\t\"./filterIgnore.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterIgnore.js\",\n\t\t\"icon.filterIgnore\"\n\t],\n\t\"./filterInCircle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterInCircle.js\",\n\t\t\"icon.filterInCircle\"\n\t],\n\t\"./filterInCircle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterInCircle.js\",\n\t\t\"icon.filterInCircle\"\n\t],\n\t\"./filterInclude\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterInclude.js\",\n\t\t\"icon.filterInclude\"\n\t],\n\t\"./filterInclude.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/filterInclude.js\",\n\t\t\"icon.filterInclude\"\n\t],\n\t\"./flag\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/flag.js\",\n\t\t\"icon.flag\"\n\t],\n\t\"./flag.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/flag.js\",\n\t\t\"icon.flag\"\n\t],\n\t\"./fold\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/fold.js\",\n\t\t\"icon.fold\"\n\t],\n\t\"./fold.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/fold.js\",\n\t\t\"icon.fold\"\n\t],\n\t\"./folder_check\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_check.js\",\n\t\t\"icon.folder_check\"\n\t],\n\t\"./folder_check.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_check.js\",\n\t\t\"icon.folder_check\"\n\t],\n\t\"./folder_closed\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_closed.js\",\n\t\t\"icon.folder_closed\"\n\t],\n\t\"./folder_closed.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_closed.js\",\n\t\t\"icon.folder_closed\"\n\t],\n\t\"./folder_exclamation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_exclamation.js\",\n\t\t\"icon.folder_exclamation\"\n\t],\n\t\"./folder_exclamation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_exclamation.js\",\n\t\t\"icon.folder_exclamation\"\n\t],\n\t\"./folder_open\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_open.js\",\n\t\t\"icon.folder_open\"\n\t],\n\t\"./folder_open.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/folder_open.js\",\n\t\t\"icon.folder_open\"\n\t],\n\t\"./frameNext\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/frameNext.js\",\n\t\t\"icon.frameNext\"\n\t],\n\t\"./frameNext.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/frameNext.js\",\n\t\t\"icon.frameNext\"\n\t],\n\t\"./framePrevious\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/framePrevious.js\",\n\t\t\"icon.framePrevious\"\n\t],\n\t\"./framePrevious.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/framePrevious.js\",\n\t\t\"icon.framePrevious\"\n\t],\n\t\"./fullScreenExit\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/fullScreenExit.js\",\n\t\t\"icon.fullScreenExit\"\n\t],\n\t\"./fullScreenExit.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/fullScreenExit.js\",\n\t\t\"icon.fullScreenExit\"\n\t],\n\t\"./full_screen\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/full_screen.js\",\n\t\t\"icon.full_screen\"\n\t],\n\t\"./full_screen.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/full_screen.js\",\n\t\t\"icon.full_screen\"\n\t],\n\t\"./function\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/function.js\",\n\t\t\"icon.function\"\n\t],\n\t\"./function.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/function.js\",\n\t\t\"icon.function\"\n\t],\n\t\"./gear\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/gear.js\",\n\t\t\"icon.gear\"\n\t],\n\t\"./gear.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/gear.js\",\n\t\t\"icon.gear\"\n\t],\n\t\"./glasses\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/glasses.js\",\n\t\t\"icon.glasses\"\n\t],\n\t\"./glasses.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/glasses.js\",\n\t\t\"icon.glasses\"\n\t],\n\t\"./globe\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/globe.js\",\n\t\t\"icon.globe\"\n\t],\n\t\"./globe.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/globe.js\",\n\t\t\"icon.globe\"\n\t],\n\t\"./grab\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grab.js\",\n\t\t\"icon.grab\"\n\t],\n\t\"./grab.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grab.js\",\n\t\t\"icon.grab\"\n\t],\n\t\"./grabOmnidirectional\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grabOmnidirectional.js\",\n\t\t\"icon.grabOmnidirectional\"\n\t],\n\t\"./grabOmnidirectional.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grabOmnidirectional.js\",\n\t\t\"icon.grabOmnidirectional\"\n\t],\n\t\"./grab_horizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grab_horizontal.js\",\n\t\t\"icon.grab_horizontal\"\n\t],\n\t\"./grab_horizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grab_horizontal.js\",\n\t\t\"icon.grab_horizontal\"\n\t],\n\t\"./gradient\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/gradient.js\",\n\t\t\"icon.gradient\"\n\t],\n\t\"./gradient.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/gradient.js\",\n\t\t\"icon.gradient\"\n\t],\n\t\"./grid\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grid.js\",\n\t\t\"icon.grid\"\n\t],\n\t\"./grid.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/grid.js\",\n\t\t\"icon.grid\"\n\t],\n\t\"./heart\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/heart.js\",\n\t\t\"icon.heart\"\n\t],\n\t\"./heart.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/heart.js\",\n\t\t\"icon.heart\"\n\t],\n\t\"./heatmap\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/heatmap.js\",\n\t\t\"icon.heatmap\"\n\t],\n\t\"./heatmap.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/heatmap.js\",\n\t\t\"icon.heatmap\"\n\t],\n\t\"./help\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/help.js\",\n\t\t\"icon.help\"\n\t],\n\t\"./help.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/help.js\",\n\t\t\"icon.help\"\n\t],\n\t\"./home\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/home.js\",\n\t\t\"icon.home\"\n\t],\n\t\"./home.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/home.js\",\n\t\t\"icon.home\"\n\t],\n\t\"./iInCircle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/iInCircle.js\",\n\t\t\"icon.iInCircle\"\n\t],\n\t\"./iInCircle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/iInCircle.js\",\n\t\t\"icon.iInCircle\"\n\t],\n\t\"./image\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/image.js\",\n\t\t\"icon.image\"\n\t],\n\t\"./image.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/image.js\",\n\t\t\"icon.image\"\n\t],\n\t\"./import\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/import.js\",\n\t\t\"icon.import\"\n\t],\n\t\"./import.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/import.js\",\n\t\t\"icon.import\"\n\t],\n\t\"./index\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index.js\",\n\t\t\"icon.\"\n\t],\n\t\"./index.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index.js\",\n\t\t\"icon.\"\n\t],\n\t\"./indexTemporary\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/indexTemporary.js\",\n\t\t\"icon.indexTemporary\"\n\t],\n\t\"./indexTemporary.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/indexTemporary.js\",\n\t\t\"icon.indexTemporary\"\n\t],\n\t\"./index_close\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_close.js\",\n\t\t\"icon.index_close\"\n\t],\n\t\"./index_close.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_close.js\",\n\t\t\"icon.index_close\"\n\t],\n\t\"./index_edit\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_edit.js\",\n\t\t\"icon.index_edit\"\n\t],\n\t\"./index_edit.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_edit.js\",\n\t\t\"icon.index_edit\"\n\t],\n\t\"./index_flush\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_flush.js\",\n\t\t\"icon.index_flush\"\n\t],\n\t\"./index_flush.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_flush.js\",\n\t\t\"icon.index_flush\"\n\t],\n\t\"./index_mapping\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_mapping.js\",\n\t\t\"icon.index_mapping\"\n\t],\n\t\"./index_mapping.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_mapping.js\",\n\t\t\"icon.index_mapping\"\n\t],\n\t\"./index_open\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_open.js\",\n\t\t\"icon.index_open\"\n\t],\n\t\"./index_open.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_open.js\",\n\t\t\"icon.index_open\"\n\t],\n\t\"./index_runtime\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_runtime.js\",\n\t\t\"icon.index_runtime\"\n\t],\n\t\"./index_runtime.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_runtime.js\",\n\t\t\"icon.index_runtime\"\n\t],\n\t\"./index_settings\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_settings.js\",\n\t\t\"icon.index_settings\"\n\t],\n\t\"./index_settings.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/index_settings.js\",\n\t\t\"icon.index_settings\"\n\t],\n\t\"./infinity\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/infinity.js\",\n\t\t\"icon.infinity\"\n\t],\n\t\"./infinity.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/infinity.js\",\n\t\t\"icon.infinity\"\n\t],\n\t\"./inputOutput\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/inputOutput.js\",\n\t\t\"icon.inputOutput\"\n\t],\n\t\"./inputOutput.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/inputOutput.js\",\n\t\t\"icon.inputOutput\"\n\t],\n\t\"./inspect\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/inspect.js\",\n\t\t\"icon.inspect\"\n\t],\n\t\"./inspect.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/inspect.js\",\n\t\t\"icon.inspect\"\n\t],\n\t\"./invert\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/invert.js\",\n\t\t\"icon.invert\"\n\t],\n\t\"./invert.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/invert.js\",\n\t\t\"icon.invert\"\n\t],\n\t\"./ip\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ip.js\",\n\t\t\"icon.ip\"\n\t],\n\t\"./ip.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ip.js\",\n\t\t\"icon.ip\"\n\t],\n\t\"./issue\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/issue.js\",\n\t\t\"icon.issue\"\n\t],\n\t\"./issue.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/issue.js\",\n\t\t\"icon.issue\"\n\t],\n\t\"./key\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/key.js\",\n\t\t\"icon.key\"\n\t],\n\t\"./key.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/key.js\",\n\t\t\"icon.key\"\n\t],\n\t\"./keyboard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/keyboard.js\",\n\t\t\"icon.keyboard\"\n\t],\n\t\"./keyboard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/keyboard.js\",\n\t\t\"icon.keyboard\"\n\t],\n\t\"./kql_field\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_field.js\",\n\t\t\"icon.kql_field\"\n\t],\n\t\"./kql_field.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_field.js\",\n\t\t\"icon.kql_field\"\n\t],\n\t\"./kql_function\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_function.js\",\n\t\t\"icon.kql_function\"\n\t],\n\t\"./kql_function.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_function.js\",\n\t\t\"icon.kql_function\"\n\t],\n\t\"./kql_operand\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_operand.js\",\n\t\t\"icon.kql_operand\"\n\t],\n\t\"./kql_operand.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_operand.js\",\n\t\t\"icon.kql_operand\"\n\t],\n\t\"./kql_selector\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_selector.js\",\n\t\t\"icon.kql_selector\"\n\t],\n\t\"./kql_selector.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_selector.js\",\n\t\t\"icon.kql_selector\"\n\t],\n\t\"./kql_value\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_value.js\",\n\t\t\"icon.kql_value\"\n\t],\n\t\"./kql_value.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kql_value.js\",\n\t\t\"icon.kql_value\"\n\t],\n\t\"./kubernetesNode\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kubernetesNode.js\",\n\t\t\"icon.kubernetesNode\"\n\t],\n\t\"./kubernetesNode.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kubernetesNode.js\",\n\t\t\"icon.kubernetesNode\"\n\t],\n\t\"./kubernetesPod\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kubernetesPod.js\",\n\t\t\"icon.kubernetesPod\"\n\t],\n\t\"./kubernetesPod.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/kubernetesPod.js\",\n\t\t\"icon.kubernetesPod\"\n\t],\n\t\"./launch\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/launch.js\",\n\t\t\"icon.launch\"\n\t],\n\t\"./launch.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/launch.js\",\n\t\t\"icon.launch\"\n\t],\n\t\"./layers\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/layers.js\",\n\t\t\"icon.layers\"\n\t],\n\t\"./layers.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/layers.js\",\n\t\t\"icon.layers\"\n\t],\n\t\"./lettering\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lettering.js\",\n\t\t\"icon.lettering\"\n\t],\n\t\"./lettering.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lettering.js\",\n\t\t\"icon.lettering\"\n\t],\n\t\"./lineDashed\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineDashed.js\",\n\t\t\"icon.lineDashed\"\n\t],\n\t\"./lineDashed.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineDashed.js\",\n\t\t\"icon.lineDashed\"\n\t],\n\t\"./lineDotted\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineDotted.js\",\n\t\t\"icon.lineDotted\"\n\t],\n\t\"./lineDotted.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineDotted.js\",\n\t\t\"icon.lineDotted\"\n\t],\n\t\"./lineSolid\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineSolid.js\",\n\t\t\"icon.lineSolid\"\n\t],\n\t\"./lineSolid.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lineSolid.js\",\n\t\t\"icon.lineSolid\"\n\t],\n\t\"./link\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/link.js\",\n\t\t\"icon.link\"\n\t],\n\t\"./link.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/link.js\",\n\t\t\"icon.link\"\n\t],\n\t\"./list\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/list.js\",\n\t\t\"icon.list\"\n\t],\n\t\"./list.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/list.js\",\n\t\t\"icon.list\"\n\t],\n\t\"./list_add\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/list_add.js\",\n\t\t\"icon.list_add\"\n\t],\n\t\"./list_add.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/list_add.js\",\n\t\t\"icon.list_add\"\n\t],\n\t\"./lock\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lock.js\",\n\t\t\"icon.lock\"\n\t],\n\t\"./lock.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lock.js\",\n\t\t\"icon.lock\"\n\t],\n\t\"./lockOpen\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lockOpen.js\",\n\t\t\"icon.lockOpen\"\n\t],\n\t\"./lockOpen.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/lockOpen.js\",\n\t\t\"icon.lockOpen\"\n\t],\n\t\"./logo_aerospike\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aerospike.js\",\n\t\t\"icon.logo_aerospike\"\n\t],\n\t\"./logo_aerospike.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aerospike.js\",\n\t\t\"icon.logo_aerospike\"\n\t],\n\t\"./logo_apache\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_apache.js\",\n\t\t\"icon.logo_apache\"\n\t],\n\t\"./logo_apache.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_apache.js\",\n\t\t\"icon.logo_apache\"\n\t],\n\t\"./logo_app_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_app_search.js\",\n\t\t\"icon.logo_app_search\"\n\t],\n\t\"./logo_app_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_app_search.js\",\n\t\t\"icon.logo_app_search\"\n\t],\n\t\"./logo_aws\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aws.js\",\n\t\t\"icon.logo_aws\"\n\t],\n\t\"./logo_aws.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aws.js\",\n\t\t\"icon.logo_aws\"\n\t],\n\t\"./logo_aws_mono\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aws_mono.js\",\n\t\t\"icon.logo_aws_mono\"\n\t],\n\t\"./logo_aws_mono.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_aws_mono.js\",\n\t\t\"icon.logo_aws_mono\"\n\t],\n\t\"./logo_azure\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_azure.js\",\n\t\t\"icon.logo_azure\"\n\t],\n\t\"./logo_azure.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_azure.js\",\n\t\t\"icon.logo_azure\"\n\t],\n\t\"./logo_azure_mono\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_azure_mono.js\",\n\t\t\"icon.logo_azure_mono\"\n\t],\n\t\"./logo_azure_mono.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_azure_mono.js\",\n\t\t\"icon.logo_azure_mono\"\n\t],\n\t\"./logo_beats\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_beats.js\",\n\t\t\"icon.logo_beats\"\n\t],\n\t\"./logo_beats.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_beats.js\",\n\t\t\"icon.logo_beats\"\n\t],\n\t\"./logo_business_analytics\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_business_analytics.js\",\n\t\t\"icon.logo_business_analytics\"\n\t],\n\t\"./logo_business_analytics.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_business_analytics.js\",\n\t\t\"icon.logo_business_analytics\"\n\t],\n\t\"./logo_ceph\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ceph.js\",\n\t\t\"icon.logo_ceph\"\n\t],\n\t\"./logo_ceph.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ceph.js\",\n\t\t\"icon.logo_ceph\"\n\t],\n\t\"./logo_cloud\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_cloud.js\",\n\t\t\"icon.logo_cloud\"\n\t],\n\t\"./logo_cloud.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_cloud.js\",\n\t\t\"icon.logo_cloud\"\n\t],\n\t\"./logo_cloud_ece\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_cloud_ece.js\",\n\t\t\"icon.logo_cloud_ece\"\n\t],\n\t\"./logo_cloud_ece.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_cloud_ece.js\",\n\t\t\"icon.logo_cloud_ece\"\n\t],\n\t\"./logo_code\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_code.js\",\n\t\t\"icon.logo_code\"\n\t],\n\t\"./logo_code.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_code.js\",\n\t\t\"icon.logo_code\"\n\t],\n\t\"./logo_codesandbox\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_codesandbox.js\",\n\t\t\"icon.logo_codesandbox\"\n\t],\n\t\"./logo_codesandbox.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_codesandbox.js\",\n\t\t\"icon.logo_codesandbox\"\n\t],\n\t\"./logo_couchbase\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_couchbase.js\",\n\t\t\"icon.logo_couchbase\"\n\t],\n\t\"./logo_couchbase.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_couchbase.js\",\n\t\t\"icon.logo_couchbase\"\n\t],\n\t\"./logo_docker\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_docker.js\",\n\t\t\"icon.logo_docker\"\n\t],\n\t\"./logo_docker.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_docker.js\",\n\t\t\"icon.logo_docker\"\n\t],\n\t\"./logo_dropwizard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_dropwizard.js\",\n\t\t\"icon.logo_dropwizard\"\n\t],\n\t\"./logo_dropwizard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_dropwizard.js\",\n\t\t\"icon.logo_dropwizard\"\n\t],\n\t\"./logo_elastic\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elastic.js\",\n\t\t\"icon.logo_elastic\"\n\t],\n\t\"./logo_elastic.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elastic.js\",\n\t\t\"icon.logo_elastic\"\n\t],\n\t\"./logo_elastic_stack\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elastic_stack.js\",\n\t\t\"icon.logo_elastic_stack\"\n\t],\n\t\"./logo_elastic_stack.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elastic_stack.js\",\n\t\t\"icon.logo_elastic_stack\"\n\t],\n\t\"./logo_elasticsearch\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elasticsearch.js\",\n\t\t\"icon.logo_elasticsearch\"\n\t],\n\t\"./logo_elasticsearch.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_elasticsearch.js\",\n\t\t\"icon.logo_elasticsearch\"\n\t],\n\t\"./logo_enterprise_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_enterprise_search.js\",\n\t\t\"icon.logo_enterprise_search\"\n\t],\n\t\"./logo_enterprise_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_enterprise_search.js\",\n\t\t\"icon.logo_enterprise_search\"\n\t],\n\t\"./logo_etcd\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_etcd.js\",\n\t\t\"icon.logo_etcd\"\n\t],\n\t\"./logo_etcd.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_etcd.js\",\n\t\t\"icon.logo_etcd\"\n\t],\n\t\"./logo_gcp\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gcp.js\",\n\t\t\"icon.logo_gcp\"\n\t],\n\t\"./logo_gcp.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gcp.js\",\n\t\t\"icon.logo_gcp\"\n\t],\n\t\"./logo_gcp_mono\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gcp_mono.js\",\n\t\t\"icon.logo_gcp_mono\"\n\t],\n\t\"./logo_gcp_mono.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gcp_mono.js\",\n\t\t\"icon.logo_gcp_mono\"\n\t],\n\t\"./logo_github\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_github.js\",\n\t\t\"icon.logo_github\"\n\t],\n\t\"./logo_github.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_github.js\",\n\t\t\"icon.logo_github\"\n\t],\n\t\"./logo_gmail\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gmail.js\",\n\t\t\"icon.logo_gmail\"\n\t],\n\t\"./logo_gmail.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_gmail.js\",\n\t\t\"icon.logo_gmail\"\n\t],\n\t\"./logo_golang\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_golang.js\",\n\t\t\"vendors~icon.logo_golang\"\n\t],\n\t\"./logo_golang.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_golang.js\",\n\t\t\"vendors~icon.logo_golang\"\n\t],\n\t\"./logo_google_g\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_google_g.js\",\n\t\t\"icon.logo_google_g\"\n\t],\n\t\"./logo_google_g.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_google_g.js\",\n\t\t\"icon.logo_google_g\"\n\t],\n\t\"./logo_haproxy\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_haproxy.js\",\n\t\t\"icon.logo_haproxy\"\n\t],\n\t\"./logo_haproxy.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_haproxy.js\",\n\t\t\"icon.logo_haproxy\"\n\t],\n\t\"./logo_ibm\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ibm.js\",\n\t\t\"icon.logo_ibm\"\n\t],\n\t\"./logo_ibm.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ibm.js\",\n\t\t\"icon.logo_ibm\"\n\t],\n\t\"./logo_ibm_mono\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ibm_mono.js\",\n\t\t\"icon.logo_ibm_mono\"\n\t],\n\t\"./logo_ibm_mono.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_ibm_mono.js\",\n\t\t\"icon.logo_ibm_mono\"\n\t],\n\t\"./logo_kafka\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kafka.js\",\n\t\t\"icon.logo_kafka\"\n\t],\n\t\"./logo_kafka.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kafka.js\",\n\t\t\"icon.logo_kafka\"\n\t],\n\t\"./logo_kibana\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kibana.js\",\n\t\t\"icon.logo_kibana\"\n\t],\n\t\"./logo_kibana.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kibana.js\",\n\t\t\"icon.logo_kibana\"\n\t],\n\t\"./logo_kubernetes\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kubernetes.js\",\n\t\t\"icon.logo_kubernetes\"\n\t],\n\t\"./logo_kubernetes.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_kubernetes.js\",\n\t\t\"icon.logo_kubernetes\"\n\t],\n\t\"./logo_logging\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_logging.js\",\n\t\t\"icon.logo_logging\"\n\t],\n\t\"./logo_logging.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_logging.js\",\n\t\t\"icon.logo_logging\"\n\t],\n\t\"./logo_logstash\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_logstash.js\",\n\t\t\"icon.logo_logstash\"\n\t],\n\t\"./logo_logstash.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_logstash.js\",\n\t\t\"icon.logo_logstash\"\n\t],\n\t\"./logo_maps\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_maps.js\",\n\t\t\"icon.logo_maps\"\n\t],\n\t\"./logo_maps.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_maps.js\",\n\t\t\"icon.logo_maps\"\n\t],\n\t\"./logo_memcached\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_memcached.js\",\n\t\t\"icon.logo_memcached\"\n\t],\n\t\"./logo_memcached.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_memcached.js\",\n\t\t\"icon.logo_memcached\"\n\t],\n\t\"./logo_metrics\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_metrics.js\",\n\t\t\"icon.logo_metrics\"\n\t],\n\t\"./logo_metrics.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_metrics.js\",\n\t\t\"icon.logo_metrics\"\n\t],\n\t\"./logo_mongodb\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_mongodb.js\",\n\t\t\"icon.logo_mongodb\"\n\t],\n\t\"./logo_mongodb.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_mongodb.js\",\n\t\t\"icon.logo_mongodb\"\n\t],\n\t\"./logo_mysql\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_mysql.js\",\n\t\t\"icon.logo_mysql\"\n\t],\n\t\"./logo_mysql.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_mysql.js\",\n\t\t\"icon.logo_mysql\"\n\t],\n\t\"./logo_nginx\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_nginx.js\",\n\t\t\"icon.logo_nginx\"\n\t],\n\t\"./logo_nginx.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_nginx.js\",\n\t\t\"icon.logo_nginx\"\n\t],\n\t\"./logo_observability\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_observability.js\",\n\t\t\"icon.logo_observability\"\n\t],\n\t\"./logo_observability.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_observability.js\",\n\t\t\"icon.logo_observability\"\n\t],\n\t\"./logo_osquery\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_osquery.js\",\n\t\t\"icon.logo_osquery\"\n\t],\n\t\"./logo_osquery.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_osquery.js\",\n\t\t\"icon.logo_osquery\"\n\t],\n\t\"./logo_php\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_php.js\",\n\t\t\"icon.logo_php\"\n\t],\n\t\"./logo_php.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_php.js\",\n\t\t\"icon.logo_php\"\n\t],\n\t\"./logo_postgres\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_postgres.js\",\n\t\t\"icon.logo_postgres\"\n\t],\n\t\"./logo_postgres.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_postgres.js\",\n\t\t\"icon.logo_postgres\"\n\t],\n\t\"./logo_prometheus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_prometheus.js\",\n\t\t\"icon.logo_prometheus\"\n\t],\n\t\"./logo_prometheus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_prometheus.js\",\n\t\t\"icon.logo_prometheus\"\n\t],\n\t\"./logo_rabbitmq\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_rabbitmq.js\",\n\t\t\"icon.logo_rabbitmq\"\n\t],\n\t\"./logo_rabbitmq.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_rabbitmq.js\",\n\t\t\"icon.logo_rabbitmq\"\n\t],\n\t\"./logo_redis\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_redis.js\",\n\t\t\"icon.logo_redis\"\n\t],\n\t\"./logo_redis.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_redis.js\",\n\t\t\"icon.logo_redis\"\n\t],\n\t\"./logo_security\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_security.js\",\n\t\t\"icon.logo_security\"\n\t],\n\t\"./logo_security.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_security.js\",\n\t\t\"icon.logo_security\"\n\t],\n\t\"./logo_site_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_site_search.js\",\n\t\t\"icon.logo_site_search\"\n\t],\n\t\"./logo_site_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_site_search.js\",\n\t\t\"icon.logo_site_search\"\n\t],\n\t\"./logo_sketch\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_sketch.js\",\n\t\t\"icon.logo_sketch\"\n\t],\n\t\"./logo_sketch.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_sketch.js\",\n\t\t\"icon.logo_sketch\"\n\t],\n\t\"./logo_slack\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_slack.js\",\n\t\t\"icon.logo_slack\"\n\t],\n\t\"./logo_slack.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_slack.js\",\n\t\t\"icon.logo_slack\"\n\t],\n\t\"./logo_uptime\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_uptime.js\",\n\t\t\"icon.logo_uptime\"\n\t],\n\t\"./logo_uptime.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_uptime.js\",\n\t\t\"icon.logo_uptime\"\n\t],\n\t\"./logo_vulnerability_management\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_vulnerability_management.js\",\n\t\t\"icon.logo_vulnerability_management\"\n\t],\n\t\"./logo_vulnerability_management.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_vulnerability_management.js\",\n\t\t\"icon.logo_vulnerability_management\"\n\t],\n\t\"./logo_webhook\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_webhook.js\",\n\t\t\"icon.logo_webhook\"\n\t],\n\t\"./logo_webhook.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_webhook.js\",\n\t\t\"icon.logo_webhook\"\n\t],\n\t\"./logo_windows\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_windows.js\",\n\t\t\"icon.logo_windows\"\n\t],\n\t\"./logo_windows.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_windows.js\",\n\t\t\"icon.logo_windows\"\n\t],\n\t\"./logo_workplace_search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_workplace_search.js\",\n\t\t\"icon.logo_workplace_search\"\n\t],\n\t\"./logo_workplace_search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logo_workplace_search.js\",\n\t\t\"icon.logo_workplace_search\"\n\t],\n\t\"./logstash_filter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_filter.js\",\n\t\t\"icon.logstash_filter\"\n\t],\n\t\"./logstash_filter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_filter.js\",\n\t\t\"icon.logstash_filter\"\n\t],\n\t\"./logstash_if\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_if.js\",\n\t\t\"icon.logstash_if\"\n\t],\n\t\"./logstash_if.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_if.js\",\n\t\t\"icon.logstash_if\"\n\t],\n\t\"./logstash_input\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_input.js\",\n\t\t\"icon.logstash_input\"\n\t],\n\t\"./logstash_input.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_input.js\",\n\t\t\"icon.logstash_input\"\n\t],\n\t\"./logstash_output\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_output.js\",\n\t\t\"icon.logstash_output\"\n\t],\n\t\"./logstash_output.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_output.js\",\n\t\t\"icon.logstash_output\"\n\t],\n\t\"./logstash_queue\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_queue.js\",\n\t\t\"icon.logstash_queue\"\n\t],\n\t\"./logstash_queue.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/logstash_queue.js\",\n\t\t\"icon.logstash_queue\"\n\t],\n\t\"./magnet\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnet.js\",\n\t\t\"icon.magnet\"\n\t],\n\t\"./magnet.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnet.js\",\n\t\t\"icon.magnet\"\n\t],\n\t\"./magnifyWithExclamation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithExclamation.js\",\n\t\t\"icon.magnifyWithExclamation\"\n\t],\n\t\"./magnifyWithExclamation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithExclamation.js\",\n\t\t\"icon.magnifyWithExclamation\"\n\t],\n\t\"./magnifyWithMinus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithMinus.js\",\n\t\t\"icon.magnifyWithMinus\"\n\t],\n\t\"./magnifyWithMinus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithMinus.js\",\n\t\t\"icon.magnifyWithMinus\"\n\t],\n\t\"./magnifyWithPlus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithPlus.js\",\n\t\t\"icon.magnifyWithPlus\"\n\t],\n\t\"./magnifyWithPlus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/magnifyWithPlus.js\",\n\t\t\"icon.magnifyWithPlus\"\n\t],\n\t\"./map_marker\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/map_marker.js\",\n\t\t\"icon.map_marker\"\n\t],\n\t\"./map_marker.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/map_marker.js\",\n\t\t\"icon.map_marker\"\n\t],\n\t\"./memory\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/memory.js\",\n\t\t\"icon.memory\"\n\t],\n\t\"./memory.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/memory.js\",\n\t\t\"icon.memory\"\n\t],\n\t\"./menu\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menu.js\",\n\t\t\"icon.menu\"\n\t],\n\t\"./menu.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menu.js\",\n\t\t\"icon.menu\"\n\t],\n\t\"./menuDown\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuDown.js\",\n\t\t\"icon.menuDown\"\n\t],\n\t\"./menuDown.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuDown.js\",\n\t\t\"icon.menuDown\"\n\t],\n\t\"./menuLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuLeft.js\",\n\t\t\"icon.menuLeft\"\n\t],\n\t\"./menuLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuLeft.js\",\n\t\t\"icon.menuLeft\"\n\t],\n\t\"./menuRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuRight.js\",\n\t\t\"icon.menuRight\"\n\t],\n\t\"./menuRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuRight.js\",\n\t\t\"icon.menuRight\"\n\t],\n\t\"./menuUp\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuUp.js\",\n\t\t\"icon.menuUp\"\n\t],\n\t\"./menuUp.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/menuUp.js\",\n\t\t\"icon.menuUp\"\n\t],\n\t\"./merge\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/merge.js\",\n\t\t\"icon.merge\"\n\t],\n\t\"./merge.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/merge.js\",\n\t\t\"icon.merge\"\n\t],\n\t\"./minimize\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minimize.js\",\n\t\t\"icon.minimize\"\n\t],\n\t\"./minimize.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minimize.js\",\n\t\t\"icon.minimize\"\n\t],\n\t\"./minus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus.js\",\n\t\t\"icon.minus\"\n\t],\n\t\"./minus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus.js\",\n\t\t\"icon.minus\"\n\t],\n\t\"./minus_in_circle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus_in_circle.js\",\n\t\t\"icon.minus_in_circle\"\n\t],\n\t\"./minus_in_circle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus_in_circle.js\",\n\t\t\"icon.minus_in_circle\"\n\t],\n\t\"./minus_in_circle_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus_in_circle_filled.js\",\n\t\t\"icon.minus_in_circle_filled\"\n\t],\n\t\"./minus_in_circle_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/minus_in_circle_filled.js\",\n\t\t\"icon.minus_in_circle_filled\"\n\t],\n\t\"./ml_classification_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_classification_job.js\",\n\t\t\"icon.ml_classification_job\"\n\t],\n\t\"./ml_classification_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_classification_job.js\",\n\t\t\"icon.ml_classification_job\"\n\t],\n\t\"./ml_create_advanced_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_advanced_job.js\",\n\t\t\"icon.ml_create_advanced_job\"\n\t],\n\t\"./ml_create_advanced_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_advanced_job.js\",\n\t\t\"icon.ml_create_advanced_job\"\n\t],\n\t\"./ml_create_multi_metric_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_multi_metric_job.js\",\n\t\t\"icon.ml_create_multi_metric_job\"\n\t],\n\t\"./ml_create_multi_metric_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_multi_metric_job.js\",\n\t\t\"icon.ml_create_multi_metric_job\"\n\t],\n\t\"./ml_create_population_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_population_job.js\",\n\t\t\"icon.ml_create_population_job\"\n\t],\n\t\"./ml_create_population_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_population_job.js\",\n\t\t\"icon.ml_create_population_job\"\n\t],\n\t\"./ml_create_single_metric_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_single_metric_job.js\",\n\t\t\"icon.ml_create_single_metric_job\"\n\t],\n\t\"./ml_create_single_metric_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_create_single_metric_job.js\",\n\t\t\"icon.ml_create_single_metric_job\"\n\t],\n\t\"./ml_data_visualizer\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_data_visualizer.js\",\n\t\t\"icon.ml_data_visualizer\"\n\t],\n\t\"./ml_data_visualizer.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_data_visualizer.js\",\n\t\t\"icon.ml_data_visualizer\"\n\t],\n\t\"./ml_outlier_detection_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_outlier_detection_job.js\",\n\t\t\"icon.ml_outlier_detection_job\"\n\t],\n\t\"./ml_outlier_detection_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_outlier_detection_job.js\",\n\t\t\"icon.ml_outlier_detection_job\"\n\t],\n\t\"./ml_regression_job\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_regression_job.js\",\n\t\t\"icon.ml_regression_job\"\n\t],\n\t\"./ml_regression_job.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/ml_regression_job.js\",\n\t\t\"icon.ml_regression_job\"\n\t],\n\t\"./mobile\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/mobile.js\",\n\t\t\"icon.mobile\"\n\t],\n\t\"./mobile.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/mobile.js\",\n\t\t\"icon.mobile\"\n\t],\n\t\"./moon\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/moon.js\",\n\t\t\"icon.moon\"\n\t],\n\t\"./moon.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/moon.js\",\n\t\t\"icon.moon\"\n\t],\n\t\"./namespace\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/namespace.js\",\n\t\t\"icon.namespace\"\n\t],\n\t\"./namespace.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/namespace.js\",\n\t\t\"icon.namespace\"\n\t],\n\t\"./nested\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/nested.js\",\n\t\t\"icon.nested\"\n\t],\n\t\"./nested.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/nested.js\",\n\t\t\"icon.nested\"\n\t],\n\t\"./new_chat\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/new_chat.js\",\n\t\t\"icon.new_chat\"\n\t],\n\t\"./new_chat.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/new_chat.js\",\n\t\t\"icon.new_chat\"\n\t],\n\t\"./node\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/node.js\",\n\t\t\"icon.node\"\n\t],\n\t\"./node.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/node.js\",\n\t\t\"icon.node\"\n\t],\n\t\"./number\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/number.js\",\n\t\t\"icon.number\"\n\t],\n\t\"./number.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/number.js\",\n\t\t\"icon.number\"\n\t],\n\t\"./offline\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/offline.js\",\n\t\t\"icon.offline\"\n\t],\n\t\"./offline.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/offline.js\",\n\t\t\"icon.offline\"\n\t],\n\t\"./online\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/online.js\",\n\t\t\"icon.online\"\n\t],\n\t\"./online.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/online.js\",\n\t\t\"icon.online\"\n\t],\n\t\"./package\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/package.js\",\n\t\t\"icon.package\"\n\t],\n\t\"./package.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/package.js\",\n\t\t\"icon.package\"\n\t],\n\t\"./pageSelect\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pageSelect.js\",\n\t\t\"icon.pageSelect\"\n\t],\n\t\"./pageSelect.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pageSelect.js\",\n\t\t\"icon.pageSelect\"\n\t],\n\t\"./pagesSelect\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pagesSelect.js\",\n\t\t\"icon.pagesSelect\"\n\t],\n\t\"./pagesSelect.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pagesSelect.js\",\n\t\t\"icon.pagesSelect\"\n\t],\n\t\"./paint\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/paint.js\",\n\t\t\"icon.paint\"\n\t],\n\t\"./paint.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/paint.js\",\n\t\t\"icon.paint\"\n\t],\n\t\"./palette\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/palette.js\",\n\t\t\"icon.palette\"\n\t],\n\t\"./palette.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/palette.js\",\n\t\t\"icon.palette\"\n\t],\n\t\"./paper_clip\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/paper_clip.js\",\n\t\t\"icon.paper_clip\"\n\t],\n\t\"./paper_clip.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/paper_clip.js\",\n\t\t\"icon.paper_clip\"\n\t],\n\t\"./partial\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/partial.js\",\n\t\t\"icon.partial\"\n\t],\n\t\"./partial.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/partial.js\",\n\t\t\"icon.partial\"\n\t],\n\t\"./pause\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pause.js\",\n\t\t\"icon.pause\"\n\t],\n\t\"./pause.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pause.js\",\n\t\t\"icon.pause\"\n\t],\n\t\"./payment\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/payment.js\",\n\t\t\"icon.payment\"\n\t],\n\t\"./payment.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/payment.js\",\n\t\t\"icon.payment\"\n\t],\n\t\"./pencil\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pencil.js\",\n\t\t\"icon.pencil\"\n\t],\n\t\"./pencil.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pencil.js\",\n\t\t\"icon.pencil\"\n\t],\n\t\"./percent\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/percent.js\",\n\t\t\"icon.percent\"\n\t],\n\t\"./percent.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/percent.js\",\n\t\t\"icon.percent\"\n\t],\n\t\"./pin\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pin.js\",\n\t\t\"icon.pin\"\n\t],\n\t\"./pin.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pin.js\",\n\t\t\"icon.pin\"\n\t],\n\t\"./pin_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pin_filled.js\",\n\t\t\"icon.pin_filled\"\n\t],\n\t\"./pin_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pin_filled.js\",\n\t\t\"icon.pin_filled\"\n\t],\n\t\"./pipeBreaks\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pipeBreaks.js\",\n\t\t\"icon.pipeBreaks\"\n\t],\n\t\"./pipeBreaks.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pipeBreaks.js\",\n\t\t\"icon.pipeBreaks\"\n\t],\n\t\"./pipeNoBreaks\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pipeNoBreaks.js\",\n\t\t\"icon.pipeNoBreaks\"\n\t],\n\t\"./pipeNoBreaks.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pipeNoBreaks.js\",\n\t\t\"icon.pipeNoBreaks\"\n\t],\n\t\"./pivot\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pivot.js\",\n\t\t\"icon.pivot\"\n\t],\n\t\"./pivot.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/pivot.js\",\n\t\t\"icon.pivot\"\n\t],\n\t\"./play\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/play.js\",\n\t\t\"icon.play\"\n\t],\n\t\"./play.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/play.js\",\n\t\t\"icon.play\"\n\t],\n\t\"./playFilled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/playFilled.js\",\n\t\t\"icon.playFilled\"\n\t],\n\t\"./playFilled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/playFilled.js\",\n\t\t\"icon.playFilled\"\n\t],\n\t\"./plus\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus.js\",\n\t\t\"icon.plus\"\n\t],\n\t\"./plus.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus.js\",\n\t\t\"icon.plus\"\n\t],\n\t\"./plus_in_circle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus_in_circle.js\",\n\t\t\"icon.plus_in_circle\"\n\t],\n\t\"./plus_in_circle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus_in_circle.js\",\n\t\t\"icon.plus_in_circle\"\n\t],\n\t\"./plus_in_circle_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus_in_circle_filled.js\",\n\t\t\"icon.plus_in_circle_filled\"\n\t],\n\t\"./plus_in_circle_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/plus_in_circle_filled.js\",\n\t\t\"icon.plus_in_circle_filled\"\n\t],\n\t\"./popout\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/popout.js\",\n\t\t\"icon.popout\"\n\t],\n\t\"./popout.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/popout.js\",\n\t\t\"icon.popout\"\n\t],\n\t\"./push\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/push.js\",\n\t\t\"icon.push\"\n\t],\n\t\"./push.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/push.js\",\n\t\t\"icon.push\"\n\t],\n\t\"./question_in_circle\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/question_in_circle.js\",\n\t\t\"icon.question_in_circle\"\n\t],\n\t\"./question_in_circle.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/question_in_circle.js\",\n\t\t\"icon.question_in_circle\"\n\t],\n\t\"./quote\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/quote.js\",\n\t\t\"icon.quote\"\n\t],\n\t\"./quote.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/quote.js\",\n\t\t\"icon.quote\"\n\t],\n\t\"./refresh\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/refresh.js\",\n\t\t\"icon.refresh\"\n\t],\n\t\"./refresh.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/refresh.js\",\n\t\t\"icon.refresh\"\n\t],\n\t\"./reporter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/reporter.js\",\n\t\t\"icon.reporter\"\n\t],\n\t\"./reporter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/reporter.js\",\n\t\t\"icon.reporter\"\n\t],\n\t\"./return_key\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/return_key.js\",\n\t\t\"icon.return_key\"\n\t],\n\t\"./return_key.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/return_key.js\",\n\t\t\"icon.return_key\"\n\t],\n\t\"./save\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/save.js\",\n\t\t\"icon.save\"\n\t],\n\t\"./save.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/save.js\",\n\t\t\"icon.save\"\n\t],\n\t\"./scale\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/scale.js\",\n\t\t\"icon.scale\"\n\t],\n\t\"./scale.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/scale.js\",\n\t\t\"icon.scale\"\n\t],\n\t\"./search\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/search.js\",\n\t\t\"icon.search\"\n\t],\n\t\"./search.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/search.js\",\n\t\t\"icon.search\"\n\t],\n\t\"./securitySignal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignal.js\",\n\t\t\"icon.securitySignal\"\n\t],\n\t\"./securitySignal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignal.js\",\n\t\t\"icon.securitySignal\"\n\t],\n\t\"./securitySignalDetected\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignalDetected.js\",\n\t\t\"icon.securitySignalDetected\"\n\t],\n\t\"./securitySignalDetected.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignalDetected.js\",\n\t\t\"icon.securitySignalDetected\"\n\t],\n\t\"./securitySignalResolved\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignalResolved.js\",\n\t\t\"icon.securitySignalResolved\"\n\t],\n\t\"./securitySignalResolved.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/securitySignalResolved.js\",\n\t\t\"icon.securitySignalResolved\"\n\t],\n\t\"./sessionViewer\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sessionViewer.js\",\n\t\t\"icon.sessionViewer\"\n\t],\n\t\"./sessionViewer.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sessionViewer.js\",\n\t\t\"icon.sessionViewer\"\n\t],\n\t\"./shard\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/shard.js\",\n\t\t\"icon.shard\"\n\t],\n\t\"./shard.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/shard.js\",\n\t\t\"icon.shard\"\n\t],\n\t\"./share\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/share.js\",\n\t\t\"icon.share\"\n\t],\n\t\"./share.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/share.js\",\n\t\t\"icon.share\"\n\t],\n\t\"./snowflake\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/snowflake.js\",\n\t\t\"icon.snowflake\"\n\t],\n\t\"./snowflake.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/snowflake.js\",\n\t\t\"icon.snowflake\"\n\t],\n\t\"./sortAscending\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortAscending.js\",\n\t\t\"icon.sortAscending\"\n\t],\n\t\"./sortAscending.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortAscending.js\",\n\t\t\"icon.sortAscending\"\n\t],\n\t\"./sortDescending\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortDescending.js\",\n\t\t\"icon.sortDescending\"\n\t],\n\t\"./sortDescending.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortDescending.js\",\n\t\t\"icon.sortDescending\"\n\t],\n\t\"./sortLeft\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortLeft.js\",\n\t\t\"icon.sortLeft\"\n\t],\n\t\"./sortLeft.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortLeft.js\",\n\t\t\"icon.sortLeft\"\n\t],\n\t\"./sortRight\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortRight.js\",\n\t\t\"icon.sortRight\"\n\t],\n\t\"./sortRight.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortRight.js\",\n\t\t\"icon.sortRight\"\n\t],\n\t\"./sort_down\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sort_down.js\",\n\t\t\"icon.sort_down\"\n\t],\n\t\"./sort_down.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sort_down.js\",\n\t\t\"icon.sort_down\"\n\t],\n\t\"./sort_up\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sort_up.js\",\n\t\t\"icon.sort_up\"\n\t],\n\t\"./sort_up.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sort_up.js\",\n\t\t\"icon.sort_up\"\n\t],\n\t\"./sortable\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortable.js\",\n\t\t\"icon.sortable\"\n\t],\n\t\"./sortable.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sortable.js\",\n\t\t\"icon.sortable\"\n\t],\n\t\"./spaces\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/spaces.js\",\n\t\t\"icon.spaces\"\n\t],\n\t\"./spaces.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/spaces.js\",\n\t\t\"icon.spaces\"\n\t],\n\t\"./sparkles\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sparkles.js\",\n\t\t\"icon.sparkles\"\n\t],\n\t\"./sparkles.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sparkles.js\",\n\t\t\"icon.sparkles\"\n\t],\n\t\"./starPlusEmpty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/starPlusEmpty.js\",\n\t\t\"icon.starPlusEmpty\"\n\t],\n\t\"./starPlusEmpty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/starPlusEmpty.js\",\n\t\t\"icon.starPlusEmpty\"\n\t],\n\t\"./starPlusFilled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/starPlusFilled.js\",\n\t\t\"icon.starPlusFilled\"\n\t],\n\t\"./starPlusFilled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/starPlusFilled.js\",\n\t\t\"icon.starPlusFilled\"\n\t],\n\t\"./star_empty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_empty.js\",\n\t\t\"icon.star_empty\"\n\t],\n\t\"./star_empty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_empty.js\",\n\t\t\"icon.star_empty\"\n\t],\n\t\"./star_empty_space\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_empty_space.js\",\n\t\t\"icon.star_empty_space\"\n\t],\n\t\"./star_empty_space.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_empty_space.js\",\n\t\t\"icon.star_empty_space\"\n\t],\n\t\"./star_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_filled.js\",\n\t\t\"icon.star_filled\"\n\t],\n\t\"./star_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_filled.js\",\n\t\t\"icon.star_filled\"\n\t],\n\t\"./star_filled_space\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_filled_space.js\",\n\t\t\"icon.star_filled_space\"\n\t],\n\t\"./star_filled_space.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_filled_space.js\",\n\t\t\"icon.star_filled_space\"\n\t],\n\t\"./star_minus_empty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_minus_empty.js\",\n\t\t\"icon.star_minus_empty\"\n\t],\n\t\"./star_minus_empty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_minus_empty.js\",\n\t\t\"icon.star_minus_empty\"\n\t],\n\t\"./star_minus_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_minus_filled.js\",\n\t\t\"icon.star_minus_filled\"\n\t],\n\t\"./star_minus_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/star_minus_filled.js\",\n\t\t\"icon.star_minus_filled\"\n\t],\n\t\"./stats\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stats.js\",\n\t\t\"icon.stats\"\n\t],\n\t\"./stats.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stats.js\",\n\t\t\"icon.stats\"\n\t],\n\t\"./stop\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop.js\",\n\t\t\"icon.stop\"\n\t],\n\t\"./stop.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop.js\",\n\t\t\"icon.stop\"\n\t],\n\t\"./stop_filled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop_filled.js\",\n\t\t\"icon.stop_filled\"\n\t],\n\t\"./stop_filled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop_filled.js\",\n\t\t\"icon.stop_filled\"\n\t],\n\t\"./stop_slash\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop_slash.js\",\n\t\t\"icon.stop_slash\"\n\t],\n\t\"./stop_slash.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/stop_slash.js\",\n\t\t\"icon.stop_slash\"\n\t],\n\t\"./storage\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/storage.js\",\n\t\t\"icon.storage\"\n\t],\n\t\"./storage.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/storage.js\",\n\t\t\"icon.storage\"\n\t],\n\t\"./string\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/string.js\",\n\t\t\"icon.string\"\n\t],\n\t\"./string.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/string.js\",\n\t\t\"icon.string\"\n\t],\n\t\"./submodule\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/submodule.js\",\n\t\t\"icon.submodule\"\n\t],\n\t\"./submodule.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/submodule.js\",\n\t\t\"icon.submodule\"\n\t],\n\t\"./sun\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sun.js\",\n\t\t\"icon.sun\"\n\t],\n\t\"./sun.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/sun.js\",\n\t\t\"icon.sun\"\n\t],\n\t\"./swatch_input\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/swatch_input.js\",\n\t\t\"icon.swatch_input\"\n\t],\n\t\"./swatch_input.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/swatch_input.js\",\n\t\t\"icon.swatch_input\"\n\t],\n\t\"./symlink\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/symlink.js\",\n\t\t\"icon.symlink\"\n\t],\n\t\"./symlink.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/symlink.js\",\n\t\t\"icon.symlink\"\n\t],\n\t\"./tableOfContents\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tableOfContents.js\",\n\t\t\"icon.tableOfContents\"\n\t],\n\t\"./tableOfContents.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tableOfContents.js\",\n\t\t\"icon.tableOfContents\"\n\t],\n\t\"./table_density_compact\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_compact.js\",\n\t\t\"icon.table_density_compact\"\n\t],\n\t\"./table_density_compact.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_compact.js\",\n\t\t\"icon.table_density_compact\"\n\t],\n\t\"./table_density_expanded\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_expanded.js\",\n\t\t\"icon.table_density_expanded\"\n\t],\n\t\"./table_density_expanded.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_expanded.js\",\n\t\t\"icon.table_density_expanded\"\n\t],\n\t\"./table_density_normal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_normal.js\",\n\t\t\"icon.table_density_normal\"\n\t],\n\t\"./table_density_normal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/table_density_normal.js\",\n\t\t\"icon.table_density_normal\"\n\t],\n\t\"./tag\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tag.js\",\n\t\t\"icon.tag\"\n\t],\n\t\"./tag.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tag.js\",\n\t\t\"icon.tag\"\n\t],\n\t\"./tear\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tear.js\",\n\t\t\"icon.tear\"\n\t],\n\t\"./tear.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tear.js\",\n\t\t\"icon.tear\"\n\t],\n\t\"./temperature\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/temperature.js\",\n\t\t\"icon.temperature\"\n\t],\n\t\"./temperature.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/temperature.js\",\n\t\t\"icon.temperature\"\n\t],\n\t\"./timeRefresh\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeRefresh.js\",\n\t\t\"icon.timeRefresh\"\n\t],\n\t\"./timeRefresh.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeRefresh.js\",\n\t\t\"icon.timeRefresh\"\n\t],\n\t\"./timeline\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeline.js\",\n\t\t\"icon.timeline\"\n\t],\n\t\"./timeline.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeline.js\",\n\t\t\"icon.timeline\"\n\t],\n\t\"./timelineWithArrow\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timelineWithArrow.js\",\n\t\t\"icon.timelineWithArrow\"\n\t],\n\t\"./timelineWithArrow.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timelineWithArrow.js\",\n\t\t\"icon.timelineWithArrow\"\n\t],\n\t\"./timeslider\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeslider.js\",\n\t\t\"icon.timeslider\"\n\t],\n\t\"./timeslider.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/timeslider.js\",\n\t\t\"icon.timeslider\"\n\t],\n\t\"./tokenAlias\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenAlias.js\",\n\t\t\"icon.tokenAlias\"\n\t],\n\t\"./tokenAlias.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenAlias.js\",\n\t\t\"icon.tokenAlias\"\n\t],\n\t\"./tokenAnnotation\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenAnnotation.js\",\n\t\t\"icon.tokenAnnotation\"\n\t],\n\t\"./tokenAnnotation.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenAnnotation.js\",\n\t\t\"icon.tokenAnnotation\"\n\t],\n\t\"./tokenArray\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenArray.js\",\n\t\t\"icon.tokenArray\"\n\t],\n\t\"./tokenArray.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenArray.js\",\n\t\t\"icon.tokenArray\"\n\t],\n\t\"./tokenBinary\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenBinary.js\",\n\t\t\"icon.tokenBinary\"\n\t],\n\t\"./tokenBinary.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenBinary.js\",\n\t\t\"icon.tokenBinary\"\n\t],\n\t\"./tokenBoolean\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenBoolean.js\",\n\t\t\"icon.tokenBoolean\"\n\t],\n\t\"./tokenBoolean.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenBoolean.js\",\n\t\t\"icon.tokenBoolean\"\n\t],\n\t\"./tokenClass\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenClass.js\",\n\t\t\"icon.tokenClass\"\n\t],\n\t\"./tokenClass.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenClass.js\",\n\t\t\"icon.tokenClass\"\n\t],\n\t\"./tokenCompletionSuggester\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenCompletionSuggester.js\",\n\t\t\"icon.tokenCompletionSuggester\"\n\t],\n\t\"./tokenCompletionSuggester.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenCompletionSuggester.js\",\n\t\t\"icon.tokenCompletionSuggester\"\n\t],\n\t\"./tokenConstant\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenConstant.js\",\n\t\t\"icon.tokenConstant\"\n\t],\n\t\"./tokenConstant.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenConstant.js\",\n\t\t\"icon.tokenConstant\"\n\t],\n\t\"./tokenDate\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenDate.js\",\n\t\t\"icon.tokenDate\"\n\t],\n\t\"./tokenDate.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenDate.js\",\n\t\t\"icon.tokenDate\"\n\t],\n\t\"./tokenElement\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenElement.js\",\n\t\t\"icon.tokenElement\"\n\t],\n\t\"./tokenElement.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenElement.js\",\n\t\t\"icon.tokenElement\"\n\t],\n\t\"./tokenEnum\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEnum.js\",\n\t\t\"icon.tokenEnum\"\n\t],\n\t\"./tokenEnum.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEnum.js\",\n\t\t\"icon.tokenEnum\"\n\t],\n\t\"./tokenEnumMember\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEnumMember.js\",\n\t\t\"icon.tokenEnumMember\"\n\t],\n\t\"./tokenEnumMember.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEnumMember.js\",\n\t\t\"icon.tokenEnumMember\"\n\t],\n\t\"./tokenEvent\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEvent.js\",\n\t\t\"icon.tokenEvent\"\n\t],\n\t\"./tokenEvent.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenEvent.js\",\n\t\t\"icon.tokenEvent\"\n\t],\n\t\"./tokenException\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenException.js\",\n\t\t\"icon.tokenException\"\n\t],\n\t\"./tokenException.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenException.js\",\n\t\t\"icon.tokenException\"\n\t],\n\t\"./tokenField\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenField.js\",\n\t\t\"icon.tokenField\"\n\t],\n\t\"./tokenField.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenField.js\",\n\t\t\"icon.tokenField\"\n\t],\n\t\"./tokenFile\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFile.js\",\n\t\t\"icon.tokenFile\"\n\t],\n\t\"./tokenFile.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFile.js\",\n\t\t\"icon.tokenFile\"\n\t],\n\t\"./tokenFlattened\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFlattened.js\",\n\t\t\"icon.tokenFlattened\"\n\t],\n\t\"./tokenFlattened.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFlattened.js\",\n\t\t\"icon.tokenFlattened\"\n\t],\n\t\"./tokenFunction\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFunction.js\",\n\t\t\"icon.tokenFunction\"\n\t],\n\t\"./tokenFunction.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenFunction.js\",\n\t\t\"icon.tokenFunction\"\n\t],\n\t\"./tokenGeo\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenGeo.js\",\n\t\t\"icon.tokenGeo\"\n\t],\n\t\"./tokenGeo.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenGeo.js\",\n\t\t\"icon.tokenGeo\"\n\t],\n\t\"./tokenHistogram\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenHistogram.js\",\n\t\t\"icon.tokenHistogram\"\n\t],\n\t\"./tokenHistogram.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenHistogram.js\",\n\t\t\"icon.tokenHistogram\"\n\t],\n\t\"./tokenIP\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenIP.js\",\n\t\t\"icon.tokenIP\"\n\t],\n\t\"./tokenIP.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenIP.js\",\n\t\t\"icon.tokenIP\"\n\t],\n\t\"./tokenInterface\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenInterface.js\",\n\t\t\"icon.tokenInterface\"\n\t],\n\t\"./tokenInterface.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenInterface.js\",\n\t\t\"icon.tokenInterface\"\n\t],\n\t\"./tokenJoin\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenJoin.js\",\n\t\t\"icon.tokenJoin\"\n\t],\n\t\"./tokenJoin.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenJoin.js\",\n\t\t\"icon.tokenJoin\"\n\t],\n\t\"./tokenKey\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenKey.js\",\n\t\t\"icon.tokenKey\"\n\t],\n\t\"./tokenKey.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenKey.js\",\n\t\t\"icon.tokenKey\"\n\t],\n\t\"./tokenKeyword\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenKeyword.js\",\n\t\t\"icon.tokenKeyword\"\n\t],\n\t\"./tokenKeyword.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenKeyword.js\",\n\t\t\"icon.tokenKeyword\"\n\t],\n\t\"./tokenMethod\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMethod.js\",\n\t\t\"icon.tokenMethod\"\n\t],\n\t\"./tokenMethod.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMethod.js\",\n\t\t\"icon.tokenMethod\"\n\t],\n\t\"./tokenMetricCounter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMetricCounter.js\",\n\t\t\"icon.tokenMetricCounter\"\n\t],\n\t\"./tokenMetricCounter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMetricCounter.js\",\n\t\t\"icon.tokenMetricCounter\"\n\t],\n\t\"./tokenMetricGauge\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMetricGauge.js\",\n\t\t\"icon.tokenMetricGauge\"\n\t],\n\t\"./tokenMetricGauge.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenMetricGauge.js\",\n\t\t\"icon.tokenMetricGauge\"\n\t],\n\t\"./tokenModule\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenModule.js\",\n\t\t\"icon.tokenModule\"\n\t],\n\t\"./tokenModule.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenModule.js\",\n\t\t\"icon.tokenModule\"\n\t],\n\t\"./tokenNamespace\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNamespace.js\",\n\t\t\"icon.tokenNamespace\"\n\t],\n\t\"./tokenNamespace.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNamespace.js\",\n\t\t\"icon.tokenNamespace\"\n\t],\n\t\"./tokenNested\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNested.js\",\n\t\t\"icon.tokenNested\"\n\t],\n\t\"./tokenNested.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNested.js\",\n\t\t\"icon.tokenNested\"\n\t],\n\t\"./tokenNull\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNull.js\",\n\t\t\"icon.tokenNull\"\n\t],\n\t\"./tokenNull.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNull.js\",\n\t\t\"icon.tokenNull\"\n\t],\n\t\"./tokenNumber\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNumber.js\",\n\t\t\"icon.tokenNumber\"\n\t],\n\t\"./tokenNumber.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenNumber.js\",\n\t\t\"icon.tokenNumber\"\n\t],\n\t\"./tokenObject\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenObject.js\",\n\t\t\"icon.tokenObject\"\n\t],\n\t\"./tokenObject.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenObject.js\",\n\t\t\"icon.tokenObject\"\n\t],\n\t\"./tokenOperator\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenOperator.js\",\n\t\t\"icon.tokenOperator\"\n\t],\n\t\"./tokenOperator.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenOperator.js\",\n\t\t\"icon.tokenOperator\"\n\t],\n\t\"./tokenPackage\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenPackage.js\",\n\t\t\"icon.tokenPackage\"\n\t],\n\t\"./tokenPackage.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenPackage.js\",\n\t\t\"icon.tokenPackage\"\n\t],\n\t\"./tokenParameter\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenParameter.js\",\n\t\t\"icon.tokenParameter\"\n\t],\n\t\"./tokenParameter.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenParameter.js\",\n\t\t\"icon.tokenParameter\"\n\t],\n\t\"./tokenPercolator\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenPercolator.js\",\n\t\t\"icon.tokenPercolator\"\n\t],\n\t\"./tokenPercolator.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenPercolator.js\",\n\t\t\"icon.tokenPercolator\"\n\t],\n\t\"./tokenProperty\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenProperty.js\",\n\t\t\"icon.tokenProperty\"\n\t],\n\t\"./tokenProperty.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenProperty.js\",\n\t\t\"icon.tokenProperty\"\n\t],\n\t\"./tokenRange\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRange.js\",\n\t\t\"icon.tokenRange\"\n\t],\n\t\"./tokenRange.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRange.js\",\n\t\t\"icon.tokenRange\"\n\t],\n\t\"./tokenRankFeature\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRankFeature.js\",\n\t\t\"icon.tokenRankFeature\"\n\t],\n\t\"./tokenRankFeature.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRankFeature.js\",\n\t\t\"icon.tokenRankFeature\"\n\t],\n\t\"./tokenRankFeatures\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRankFeatures.js\",\n\t\t\"icon.tokenRankFeatures\"\n\t],\n\t\"./tokenRankFeatures.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRankFeatures.js\",\n\t\t\"icon.tokenRankFeatures\"\n\t],\n\t\"./tokenRepo\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRepo.js\",\n\t\t\"icon.tokenRepo\"\n\t],\n\t\"./tokenRepo.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenRepo.js\",\n\t\t\"icon.tokenRepo\"\n\t],\n\t\"./tokenSearchType\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenSearchType.js\",\n\t\t\"icon.tokenSearchType\"\n\t],\n\t\"./tokenSearchType.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenSearchType.js\",\n\t\t\"icon.tokenSearchType\"\n\t],\n\t\"./tokenShape\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenShape.js\",\n\t\t\"icon.tokenShape\"\n\t],\n\t\"./tokenShape.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenShape.js\",\n\t\t\"icon.tokenShape\"\n\t],\n\t\"./tokenString\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenString.js\",\n\t\t\"icon.tokenString\"\n\t],\n\t\"./tokenString.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenString.js\",\n\t\t\"icon.tokenString\"\n\t],\n\t\"./tokenStruct\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenStruct.js\",\n\t\t\"icon.tokenStruct\"\n\t],\n\t\"./tokenStruct.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenStruct.js\",\n\t\t\"icon.tokenStruct\"\n\t],\n\t\"./tokenSymbol\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenSymbol.js\",\n\t\t\"icon.tokenSymbol\"\n\t],\n\t\"./tokenSymbol.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenSymbol.js\",\n\t\t\"icon.tokenSymbol\"\n\t],\n\t\"./tokenTag\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenTag.js\",\n\t\t\"icon.tokenTag\"\n\t],\n\t\"./tokenTag.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenTag.js\",\n\t\t\"icon.tokenTag\"\n\t],\n\t\"./tokenText\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenText.js\",\n\t\t\"icon.tokenText\"\n\t],\n\t\"./tokenText.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenText.js\",\n\t\t\"icon.tokenText\"\n\t],\n\t\"./tokenTokenCount\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenTokenCount.js\",\n\t\t\"icon.tokenTokenCount\"\n\t],\n\t\"./tokenTokenCount.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenTokenCount.js\",\n\t\t\"icon.tokenTokenCount\"\n\t],\n\t\"./tokenVariable\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVariable.js\",\n\t\t\"icon.tokenVariable\"\n\t],\n\t\"./tokenVariable.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVariable.js\",\n\t\t\"icon.tokenVariable\"\n\t],\n\t\"./tokenVectorDense\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVectorDense.js\",\n\t\t\"icon.tokenVectorDense\"\n\t],\n\t\"./tokenVectorDense.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVectorDense.js\",\n\t\t\"icon.tokenVectorDense\"\n\t],\n\t\"./tokenVectorSparse\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVectorSparse.js\",\n\t\t\"icon.tokenVectorSparse\"\n\t],\n\t\"./tokenVectorSparse.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/tokenVectorSparse.js\",\n\t\t\"icon.tokenVectorSparse\"\n\t],\n\t\"./training\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/training.js\",\n\t\t\"icon.training\"\n\t],\n\t\"./training.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/training.js\",\n\t\t\"icon.training\"\n\t],\n\t\"./transitionLeftIn\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionLeftIn.js\",\n\t\t\"icon.transitionLeftIn\"\n\t],\n\t\"./transitionLeftIn.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionLeftIn.js\",\n\t\t\"icon.transitionLeftIn\"\n\t],\n\t\"./transitionLeftOut\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionLeftOut.js\",\n\t\t\"icon.transitionLeftOut\"\n\t],\n\t\"./transitionLeftOut.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionLeftOut.js\",\n\t\t\"icon.transitionLeftOut\"\n\t],\n\t\"./transitionTopIn\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionTopIn.js\",\n\t\t\"icon.transitionTopIn\"\n\t],\n\t\"./transitionTopIn.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionTopIn.js\",\n\t\t\"icon.transitionTopIn\"\n\t],\n\t\"./transitionTopOut\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionTopOut.js\",\n\t\t\"icon.transitionTopOut\"\n\t],\n\t\"./transitionTopOut.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/transitionTopOut.js\",\n\t\t\"icon.transitionTopOut\"\n\t],\n\t\"./trash\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/trash.js\",\n\t\t\"icon.trash\"\n\t],\n\t\"./trash.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/trash.js\",\n\t\t\"icon.trash\"\n\t],\n\t\"./unfold\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/unfold.js\",\n\t\t\"icon.unfold\"\n\t],\n\t\"./unfold.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/unfold.js\",\n\t\t\"icon.unfold\"\n\t],\n\t\"./unlink\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/unlink.js\",\n\t\t\"icon.unlink\"\n\t],\n\t\"./unlink.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/unlink.js\",\n\t\t\"icon.unlink\"\n\t],\n\t\"./user\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/user.js\",\n\t\t\"icon.user\"\n\t],\n\t\"./user.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/user.js\",\n\t\t\"icon.user\"\n\t],\n\t\"./userAvatar\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/userAvatar.js\",\n\t\t\"icon.userAvatar\"\n\t],\n\t\"./userAvatar.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/userAvatar.js\",\n\t\t\"icon.userAvatar\"\n\t],\n\t\"./users\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/users.js\",\n\t\t\"icon.users\"\n\t],\n\t\"./users.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/users.js\",\n\t\t\"icon.users\"\n\t],\n\t\"./vector\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vector.js\",\n\t\t\"icon.vector\"\n\t],\n\t\"./vector.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vector.js\",\n\t\t\"icon.vector\"\n\t],\n\t\"./videoPlayer\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/videoPlayer.js\",\n\t\t\"icon.videoPlayer\"\n\t],\n\t\"./videoPlayer.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/videoPlayer.js\",\n\t\t\"icon.videoPlayer\"\n\t],\n\t\"./vis_area\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_area.js\",\n\t\t\"icon.vis_area\"\n\t],\n\t\"./vis_area.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_area.js\",\n\t\t\"icon.vis_area\"\n\t],\n\t\"./vis_area_stacked\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_area_stacked.js\",\n\t\t\"icon.vis_area_stacked\"\n\t],\n\t\"./vis_area_stacked.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_area_stacked.js\",\n\t\t\"icon.vis_area_stacked\"\n\t],\n\t\"./vis_bar_horizontal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_horizontal.js\",\n\t\t\"icon.vis_bar_horizontal\"\n\t],\n\t\"./vis_bar_horizontal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_horizontal.js\",\n\t\t\"icon.vis_bar_horizontal\"\n\t],\n\t\"./vis_bar_horizontal_stacked\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_horizontal_stacked.js\",\n\t\t\"icon.vis_bar_horizontal_stacked\"\n\t],\n\t\"./vis_bar_horizontal_stacked.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_horizontal_stacked.js\",\n\t\t\"icon.vis_bar_horizontal_stacked\"\n\t],\n\t\"./vis_bar_vertical\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_vertical.js\",\n\t\t\"icon.vis_bar_vertical\"\n\t],\n\t\"./vis_bar_vertical.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_vertical.js\",\n\t\t\"icon.vis_bar_vertical\"\n\t],\n\t\"./vis_bar_vertical_stacked\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_vertical_stacked.js\",\n\t\t\"icon.vis_bar_vertical_stacked\"\n\t],\n\t\"./vis_bar_vertical_stacked.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_bar_vertical_stacked.js\",\n\t\t\"icon.vis_bar_vertical_stacked\"\n\t],\n\t\"./vis_gauge\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_gauge.js\",\n\t\t\"icon.vis_gauge\"\n\t],\n\t\"./vis_gauge.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_gauge.js\",\n\t\t\"icon.vis_gauge\"\n\t],\n\t\"./vis_goal\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_goal.js\",\n\t\t\"icon.vis_goal\"\n\t],\n\t\"./vis_goal.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_goal.js\",\n\t\t\"icon.vis_goal\"\n\t],\n\t\"./vis_line\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_line.js\",\n\t\t\"icon.vis_line\"\n\t],\n\t\"./vis_line.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_line.js\",\n\t\t\"icon.vis_line\"\n\t],\n\t\"./vis_map_coordinate\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_map_coordinate.js\",\n\t\t\"icon.vis_map_coordinate\"\n\t],\n\t\"./vis_map_coordinate.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_map_coordinate.js\",\n\t\t\"icon.vis_map_coordinate\"\n\t],\n\t\"./vis_map_region\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_map_region.js\",\n\t\t\"icon.vis_map_region\"\n\t],\n\t\"./vis_map_region.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_map_region.js\",\n\t\t\"icon.vis_map_region\"\n\t],\n\t\"./vis_metric\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_metric.js\",\n\t\t\"icon.vis_metric\"\n\t],\n\t\"./vis_metric.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_metric.js\",\n\t\t\"icon.vis_metric\"\n\t],\n\t\"./vis_pie\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_pie.js\",\n\t\t\"icon.vis_pie\"\n\t],\n\t\"./vis_pie.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_pie.js\",\n\t\t\"icon.vis_pie\"\n\t],\n\t\"./vis_table\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_table.js\",\n\t\t\"icon.vis_table\"\n\t],\n\t\"./vis_table.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_table.js\",\n\t\t\"icon.vis_table\"\n\t],\n\t\"./vis_tag_cloud\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_tag_cloud.js\",\n\t\t\"icon.vis_tag_cloud\"\n\t],\n\t\"./vis_tag_cloud.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_tag_cloud.js\",\n\t\t\"icon.vis_tag_cloud\"\n\t],\n\t\"./vis_text\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_text.js\",\n\t\t\"icon.vis_text\"\n\t],\n\t\"./vis_text.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_text.js\",\n\t\t\"icon.vis_text\"\n\t],\n\t\"./vis_timelion\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_timelion.js\",\n\t\t\"icon.vis_timelion\"\n\t],\n\t\"./vis_timelion.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_timelion.js\",\n\t\t\"icon.vis_timelion\"\n\t],\n\t\"./vis_vega\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_vega.js\",\n\t\t\"icon.vis_vega\"\n\t],\n\t\"./vis_vega.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_vega.js\",\n\t\t\"icon.vis_vega\"\n\t],\n\t\"./vis_visual_builder\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_visual_builder.js\",\n\t\t\"icon.vis_visual_builder\"\n\t],\n\t\"./vis_visual_builder.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/vis_visual_builder.js\",\n\t\t\"icon.vis_visual_builder\"\n\t],\n\t\"./warning\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/warning.js\",\n\t\t\"icon.warning\"\n\t],\n\t\"./warning.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/warning.js\",\n\t\t\"icon.warning\"\n\t],\n\t\"./wordWrap\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wordWrap.js\",\n\t\t\"icon.wordWrap\"\n\t],\n\t\"./wordWrap.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wordWrap.js\",\n\t\t\"icon.wordWrap\"\n\t],\n\t\"./wordWrapDisabled\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wordWrapDisabled.js\",\n\t\t\"icon.wordWrapDisabled\"\n\t],\n\t\"./wordWrapDisabled.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wordWrapDisabled.js\",\n\t\t\"icon.wordWrapDisabled\"\n\t],\n\t\"./wrench\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wrench.js\",\n\t\t\"icon.wrench\"\n\t],\n\t\"./wrench.js\": [\n\t\t\"../node_modules/@elastic/eui/es/components/icon/assets/wrench.js\",\n\t\t\"icon.wrench\"\n\t]\n};\nfunction webpackAsyncContext(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\treturn Promise.resolve().then(function() {\n\t\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\t\te.code = 'MODULE_NOT_FOUND';\n\t\t\tthrow e;\n\t\t});\n\t}\n\n\tvar ids = map[req], id = ids[0];\n\treturn Promise.all(ids.slice(1).map(__webpack_require__.e)).then(function() {\n\t\treturn __webpack_require__(id);\n\t});\n}\nwebpackAsyncContext.keys = function webpackAsyncContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackAsyncContext.id = \"../node_modules/@elastic/eui/es/components/icon/assets lazy recursive ^\\\\.\\\\/.*$\";\nmodule.exports = webpackAsyncContext;","// Imports\nvar ___CSS_LOADER_API_IMPORT___ = require(\"../../../../node_modules/css-loader/dist/runtime/api.js\");\nexports = ___CSS_LOADER_API_IMPORT___(false);\n// Module\nexports.push([module.id, \".showcase {\\n  height: 100%;\\n  width: 100%;\\n  min-width: 500px;\\n  display: flex;\\n  align-items: center;\\n}\\n.showcase .tooltip-wrapper {\\n  margin-left: 30px;\\n}\\n.showcase #tooltip-anchor {\\n  background-color: #0aa1dd;\\n  padding: 20px;\\n  color: white;\\n  font-weight: bold;\\n  cursor: not-allowed;\\n  border-radius: 10px;\\n}\", \"\"]);\n// Exports\nmodule.exports = exports;\n","// Imports\nvar ___CSS_LOADER_API_IMPORT___ = require(\"../../../node_modules/css-loader/dist/runtime/api.js\");\nexports = ___CSS_LOADER_API_IMPORT___(false);\n// Module\nexports.push([module.id, \".myCustomMetricSlot {\\n  display: flex;\\n  height: 100%;\\n}\\n.myCustomMetricSlot .euiBadge {\\n  padding-inline: 8px;\\n}\\n.myCustomMetricSlot.showSlotArea {\\n  background: repeating-linear-gradient(45deg, #cd252588, #cd252588 10px, #fff0 10px, #fff0 20px);\\n}\", \"\"]);\n// Exports\nmodule.exports = exports;\n","// Imports\nvar ___CSS_LOADER_API_IMPORT___ = require(\"../node_modules/css-loader/dist/runtime/api.js\");\nvar ___CSS_LOADER_GET_URL_IMPORT___ = require(\"../node_modules/css-loader/dist/runtime/getUrl.js\");\nvar ___CSS_LOADER_URL_IMPORT_0___ = require(\"../public/fonts/atkinson-hyperlegible-v1-latin-regular.woff2\");\nvar ___CSS_LOADER_URL_IMPORT_1___ = require(\"../public/fonts/atkinson-hyperlegible-v1-latin-regular.woff\");\nvar ___CSS_LOADER_URL_IMPORT_2___ = require(\"../public/fonts/atkinson-hyperlegible-v1-latin-700.woff2\");\nvar ___CSS_LOADER_URL_IMPORT_3___ = require(\"../public/fonts/atkinson-hyperlegible-v1-latin-700.woff\");\nexports = ___CSS_LOADER_API_IMPORT___(false);\nvar ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);\nvar ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___);\nvar ___CSS_LOADER_URL_REPLACEMENT_2___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_2___);\nvar ___CSS_LOADER_URL_REPLACEMENT_3___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_3___);\n// Module\nexports.push([module.id, \"@charset \\\"UTF-8\\\";\\n/**\\nThe MIT License (MIT)\\n\\nCopyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\nPermission is hereby granted, free of charge, to any person obtaining a copy\\nof this software and associated documentation files (the \\\"Software\\\"), to deal\\nin the Software without restriction, including without limitation the rights\\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\ncopies of the Software, and to permit persons to whom the Software is\\nfurnished to do so, subject to the following conditions:\\n\\nThe above copyright notice and this permission notice shall be included in all\\ncopies or substantial portions of the Software.\\n\\nTHE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\nSOFTWARE.\\n */\\n/**\\nThe MIT License (MIT)\\n\\nCopyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\nPermission is hereby granted, free of charge, to any person obtaining a copy\\nof this software and associated documentation files (the \\\"Software\\\"), to deal\\nin the Software without restriction, including without limitation the rights\\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\ncopies of the Software, and to permit persons to whom the Software is\\nfurnished to do so, subject to the following conditions:\\n\\nThe above copyright notice and this permission notice shall be included in all\\ncopies or substantial portions of the Software.\\n\\nTHE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\nSOFTWARE.\\n */\\n/**\\n * Text truncation\\n *\\n * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n *\\n * 1. Ensure that the node has a maximum width after which truncation can occur.\\n */\\n/**\\n * Text weight shifting\\n *\\n * When changing the font-weight based the state of the component\\n * this mixin will ensure that the sizing is dependent on the boldest\\n * weight so it doesn't shifter sibling content.\\n */\\n/**\\n * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n *    Others like Safari, won't show anything at all.\\n * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n */\\n/**\\n * For quickly applying a full-height element whether using flex or not\\n */\\n/*\\n * Creates the Amsterdam style of button with a transparent background\\n */\\n/*\\n * Creates the Amsterdam style of fill button\\n */\\n/*\\nThe CSS in JS version of this file lives in:\\n  - src/components/form/range/range.styles.ts\\n\\nThe following files still use the Sass version:\\n  - src/themes/amsterdam/overrides/_color_stops.scss\\n  - src/themes/amsterdam/overrides/_hue.scss\\n*/\\n@-webkit-keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@-webkit-keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@-webkit-keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #0071c2;\\n  }\\n}\\n@keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #0071c2;\\n  }\\n}\\n@-webkit-keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #0071c2;\\n  }\\n}\\n@keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #0071c2;\\n  }\\n}\\n@-webkit-keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\n@keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\n/**\\n * LEGEND\\n * __day-name : Week headers like Su, Mo, etc\\n * __day : Number on the calendar\\n *       --highlighted\\n *       --disabled :               _this.isDisabled(),\\n *       --selected :               _this.isSameDay(_this.props.selected),\\n    *       --range-start :            _this.isRangeStart(),\\n    *       --range-end :              _this.isRangeEnd(),\\n *       --keyboard-selected :      _this.isKeyboardSelected(),\\n *       --in-range :               _this.isInRange(),\\n    *       --in-selecting-range :     _this.isInSelectingRange(),\\n    *       --selecting-range-start :  _this.isSelectingRangeStart(),\\n    *       --selecting-range-end :    _this.isSelectingRangeEnd(),\\n *       --today :                  _this.isSameDay(now(_this.props.utcOffset)),\\n *       --weekend :                _this.isWeekend(),\\n *       --outside-month :          _this.isOutsideMonth()\\n */\\n.react-datepicker__day-names,\\n.react-datepicker__week {\\n  white-space: nowrap;\\n  display: flex;\\n  justify-content: space-between;\\n  flex-grow: 1;\\n}\\n\\n.react-datepicker__day-name,\\n.react-datepicker__day {\\n  font-weight: 500;\\n  text-align: center;\\n  color: #1a1c21;\\n  display: inline-block;\\n  width: 32px;\\n  line-height: 32px;\\n  border-radius: 4px;\\n  margin: 2px;\\n}\\n\\n.react-datepicker__day-name {\\n  color: #69707D;\\n}\\n\\n.react-datepicker__day {\\n  cursor: pointer;\\n  transition: transform 90ms ease-in-out;\\n}\\n\\n.react-datepicker__day:hover {\\n  color: #0061a6;\\n  background-color: rgba(0, 119, 204, 0.2);\\n  text-decoration: underline;\\n}\\n\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  .react-datepicker__day:hover {\\n    transform: scale(1.1);\\n  }\\n}\\n.react-datepicker__day--today {\\n  color: #07C;\\n  font-weight: 700;\\n}\\n\\n.react-datepicker__day--outside-month {\\n  color: #69707D;\\n}\\n\\n.react-datepicker__day--highlighted, .react-datepicker__day--highlighted:hover {\\n  color: #00726b;\\n  background-color: rgba(0, 191, 179, 0.2);\\n}\\n\\n.react-datepicker__day--in-range, .react-datepicker__day--in-range:hover {\\n  color: #0061a6;\\n  background-color: rgba(0, 119, 204, 0.2);\\n}\\n\\n.react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover), .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected), .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover {\\n  box-shadow: -2px 0 rgba(0, 119, 204, 0.2), 2px 0 rgba(0, 119, 204, 0.2);\\n  border-radius: 0;\\n}\\n\\n.react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):first-of-type, .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):first-of-type, .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:first-of-type {\\n  box-shadow: 2px 0 rgba(0, 119, 204, 0.2);\\n}\\n\\n.react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):last-of-type, .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):last-of-type, .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:last-of-type {\\n  box-shadow: -2px 0 rgba(0, 119, 204, 0.2);\\n}\\n\\n.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\n\\n.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range) {\\n  background-color: rgba(189, 39, 30, 0.5);\\n}\\n\\n.react-datepicker__day--disabled, .react-datepicker__day--disabled:hover {\\n  background-color: rgba(171, 180, 196, 0.1);\\n  color: #a2abba;\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  transform: none;\\n}\\n\\n.react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected), .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover, .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected), .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover {\\n  color: #8c9daa;\\n  background-color: rgba(0, 119, 204, 0.2);\\n}\\n\\n.react-datepicker__day--disabled.react-datepicker__day--selected, .react-datepicker__day--disabled.react-datepicker__day--selected:hover {\\n  color: #BD271E;\\n  background-color: rgba(189, 39, 30, 0.2);\\n}\\n\\n/**\\n * LEGEND\\n * __time-list-item :\\n *       --preselected : closest current time but not selected (also applied when using arrow keys to indicate focus)\\n *       --selected\\n *       --disabled\\n *       --injected\\n */\\n.react-datepicker__header--time {\\n  display: none;\\n}\\n\\n.react-datepicker__time-container {\\n  border-left: #D3DAE6;\\n  width: auto;\\n  display: flex;\\n  margin-top: 40px;\\n  margin-left: 8px;\\n  flex-grow: 1;\\n  background-color: #fafbfd;\\n  border-radius: 6px;\\n}\\n\\n.react-datepicker__time-container--focus .react-datepicker__time-list-item--preselected {\\n  text-decoration: underline;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .react-datepicker__time-container {\\n    margin-top: 0;\\n  }\\n}\\n.react-datepicker__time,\\n.react-datepicker__time-box {\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n}\\n\\n.react-datepicker__time-list {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  padding: 4px 12px;\\n  height: 100px !important;\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n  align-items: center;\\n  gap: 4px;\\n}\\n\\n.react-datepicker__time-list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.react-datepicker__time-list::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.react-datepicker__time-list::-webkit-scrollbar-corner, .react-datepicker__time-list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.react-datepicker__time-list:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.react-datepicker__time-list[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.react-datepicker__time-list-item {\\n  display: inline-block;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  cursor: pointer;\\n  height: 40px;\\n  line-height: 40px;\\n  text-align: center;\\n  white-space: nowrap;\\n  max-width: 100%;\\n  vertical-align: middle;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 500;\\n  text-decoration: none;\\n  outline-offset: -1px;\\n  transform: none !important;\\n  /* 1 */\\n  -webkit-animation: none !important;\\n  animation: none !important;\\n  /* 1 */\\n  transition-timing-function: ease-in;\\n  /* 2 */\\n  transition-duration: 150ms;\\n  /* 2 */\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 12px;\\n}\\n\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  .react-datepicker__time-list-item {\\n    transition: transform 250ms ease-in-out, background-color 250ms ease-in-out;\\n  }\\n\\n  .react-datepicker__time-list-item:hover:not(:disabled) {\\n    transform: translateY(-1px);\\n  }\\n\\n  .react-datepicker__time-list-item:focus {\\n    -webkit-animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n    animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  }\\n\\n  .react-datepicker__time-list-item:active:not(:disabled) {\\n    transform: translateY(1px);\\n  }\\n}\\n.react-datepicker__time-list-item:hover:not(:disabled), .react-datepicker__time-list-item:focus {\\n  text-decoration: underline;\\n}\\n\\n.react-datepicker__time-list-item--disabled, .react-datepicker__time-list-item--disabled:hover {\\n  text-decoration: none !important;\\n  cursor: not-allowed;\\n  color: #ABB4C4;\\n  background-color: transparent;\\n}\\n\\n.react-datepicker__time-list-item--injected, .react-datepicker__time-list-item--injected:hover {\\n  color: #00726b;\\n  background-color: rgba(0, 191, 179, 0.2);\\n}\\n\\n.react-datepicker__time-list-item--preselected, .react-datepicker__time-list-item--preselected:hover {\\n  background: rgba(0, 119, 204, 0.1);\\n}\\n\\n.react-datepicker__time-list-item--selected, .react-datepicker__time-list-item--selected:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\n\\n.react-datepicker--time-only {\\n  padding: 0 !important;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__time-container {\\n  background-color: transparent;\\n  margin: 0;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__time-list {\\n  height: 204px !important;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__time-list-item {\\n  font-size: 14px;\\n  min-width: 112px;\\n  text-align: left;\\n}\\n\\n/**\\n * LEGEND\\n * __header__dropdown : Contains the month and year, but affords for the navigational arrows\\n\\n *   __month-dropdown-container: Contains both static/selected control and the dropdown\\n *     __month-read-view: The static control\\n *     __month-dropdown: The absolutely positioned list\\n *       __month-option: Each option in the list\\n *                       --selected_month\\n *                       --selected\\n *                       --preselected\\n\\n *   __year-dropdown-container: Contains both static/selected control and the dropdown\\n *     __year-read-view: The static control\\n *     __year-dropdown: The absolutely positioned list\\n *       __year-option: Each option in the list\\n *                       --selected_year\\n *                       --selected\\n *                       --preselected\\n */\\n.react-datepicker__header__dropdown {\\n  padding: 8px;\\n  display: flex;\\n  gap: 4px;\\n  position: absolute;\\n  top: 0;\\n  left: 36px;\\n  right: 36px;\\n  justify-content: center;\\n}\\n\\n/**\\n * Make the top selectors look like select inputs\\n */\\n.react-datepicker__year-read-view,\\n.react-datepicker__month-read-view,\\n.react-datepicker__month-year-read-view {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  height: 32px;\\n  font-weight: 500;\\n  display: flex;\\n  flex-direction: row-reverse;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .react-datepicker__year-read-view,\\n.react-datepicker__month-read-view,\\n.react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.react-datepicker__year-read-view::-moz-placeholder,\\n.react-datepicker__month-read-view::-moz-placeholder,\\n.react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.react-datepicker__year-read-view::-moz-placeholder, .react-datepicker__month-read-view::-moz-placeholder, .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.react-datepicker__year-read-view:-ms-input-placeholder, .react-datepicker__month-read-view:-ms-input-placeholder, .react-datepicker__month-year-read-view:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.react-datepicker__year-read-view::placeholder,\\n.react-datepicker__month-read-view::placeholder,\\n.react-datepicker__month-year-read-view::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .react-datepicker__year-read-view,\\n.react-datepicker__month-read-view,\\n.react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.react-datepicker__year-read-view:hover,\\n.react-datepicker__month-read-view:hover,\\n.react-datepicker__month-year-read-view:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\n\\n.react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__month-read-view--down-arrow,\\n.react-datepicker__month-year-read-view--down-arrow {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiI+ICA8ZGVmcz4gICAgPHBhdGggaWQ9ImFycm93X2Rvd24tYSIgZD0iTTEzLjA2ODg1MDgsNS4xNTcyNTAzOCBMOC4zODQyMzk3NSw5Ljc2ODI3NDI4IEM4LjE3MDU0NDE1LDkuOTc4NjEzMDggNy44Mjk5OTIxNCw5Ljk3OTE0MDk1IDcuNjE1NzYwMjUsOS43NjgyNzQyOCBMMi45MzExNDkxNSw1LjE1NzI1MDM4IEMyLjcxODEzNTksNC45NDc1ODMyMSAyLjM3Mjc3MzE5LDQuOTQ3NTgzMjEgMi4xNTk3NTk5NCw1LjE1NzI1MDM4IEMxLjk0Njc0NjY5LDUuMzY2OTE3NTYgMS45NDY3NDY2OSw1LjcwNjg1NTIyIDIuMTU5NzU5OTQsNS45MTY1MjI0IEw2Ljg0NDM3MTA0LDEwLjUyNzU0NjMgQzcuNDg1MTc0MjQsMTEuMTU4MjgzNiA4LjUxNjQ0OTc5LDExLjE1NjY4NTEgOS4xNTU2Mjg5NiwxMC41Mjc1NDYzIEwxMy44NDAyNDAxLDUuOTE2NTIyNCBDMTQuMDUzMjUzMyw1LjcwNjg1NTIyIDE0LjA1MzI1MzMsNS4zNjY5MTc1NiAxMy44NDAyNDAxLDUuMTU3MjUwMzggQzEzLjYyNzIyNjgsNC45NDc1ODMyMSAxMy4yODE4NjQxLDQuOTQ3NTgzMjEgMTMuMDY4ODUwOCw1LjE1NzI1MDM4IFoiLz4gIDwvZGVmcz4gIDxnIGZpbGwtcnVsZT0iZXZlbm9kZCI+ICAgIDx1c2UgZmlsbC1ydWxlPSJub256ZXJvIiB4bGluazpocmVmPSIjYXJyb3dfZG93bi1hIi8+ICA8L2c+PC9zdmc+);\\n  right: 8px;\\n  height: 12px;\\n  width: 12px;\\n  display: inline-block;\\n  background-size: cover;\\n}\\n\\n.react-datepicker__year-read-view--selected-month, .react-datepicker__year-read-view--selected-year,\\n.react-datepicker__month-read-view--selected-month,\\n.react-datepicker__month-read-view--selected-year,\\n.react-datepicker__month-year-read-view--selected-month,\\n.react-datepicker__month-year-read-view--selected-year {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n.react-datepicker__year-dropdown-container,\\n.react-datepicker__month-dropdown-container {\\n  position: relative;\\n  display: inline-block;\\n  flex-grow: 1;\\n  max-width: 400px;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view]),\\n.react-datepicker__month-dropdown {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n  height: auto;\\n  max-height: 250px;\\n  background-color: #FFF;\\n  position: absolute;\\n  z-index: 1;\\n  border-radius: 6px;\\n  min-width: 100px;\\n  width: 100%;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar,\\n.react-datepicker__month-dropdown::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-thumb,\\n.react-datepicker__month-dropdown::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-corner, .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-track,\\n.react-datepicker__month-dropdown::-webkit-scrollbar-corner,\\n.react-datepicker__month-dropdown::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view]):focus,\\n.react-datepicker__month-dropdown:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view])[tabindex=\\\"0\\\"]:focus:focus-visible,\\n.react-datepicker__month-dropdown[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.react-datepicker__year-dropdown-container > div:not([class*=read-view]) .react-datepicker__year-dropdown {\\n  padding: 4px;\\n  display: flex;\\n  flex-direction: column-reverse;\\n  justify-content: flex-end;\\n}\\n\\n.react-datepicker__month-dropdown-container {\\n  flex-grow: 2;\\n}\\n\\n.react-datepicker__month-dropdown-container .react-datepicker__month-dropdown {\\n  padding: 4px;\\n  min-width: 140px;\\n}\\n\\n.react-datepicker__year-option,\\n.react-datepicker__month-option,\\n.react-datepicker__month-year-option {\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 14px;\\n  margin: 4px 0;\\n  cursor: pointer;\\n}\\n\\n.react-datepicker__year-option:hover, .react-datepicker__year-option:focus,\\n.react-datepicker__month-option:hover,\\n.react-datepicker__month-option:focus,\\n.react-datepicker__month-year-option:hover,\\n.react-datepicker__month-year-option:focus {\\n  text-decoration: underline;\\n}\\n\\n.react-datepicker__year-option--selected,\\n.react-datepicker__month-option--selected,\\n.react-datepicker__month-year-option--selected {\\n  display: none;\\n}\\n\\n.react-datepicker__year-option--preselected, .react-datepicker__year-option--preselected:hover,\\n.react-datepicker__month-option--preselected,\\n.react-datepicker__month-option--preselected:hover {\\n  background: rgba(0, 119, 204, 0.1);\\n}\\n\\n.react-datepicker__year-option--selected_year, .react-datepicker__year-option--selected_year:hover,\\n.react-datepicker__month-option--selected_month,\\n.react-datepicker__month-option--selected_month:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\n\\n.react-datepicker__navigation--next,\\n.react-datepicker__navigation--previous {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZmlsbD0iIzM0Mzc0MSIgZD0iTTExLjY5MiA3SDMuNTU2QzMuMjQ5IDcgMyA3LjIyNCAzIDcuNXMuMjQ5LjUuNTU2LjVoOC4xMzZsLTQuMDk2IDQuMDk2YS41LjUgMCAwMC43MDcuNzA3bDQuMjQzLTQuMjQyYy4yNTgtLjI1OS40MDMtLjU4Ny40MzMtLjkyNWEuNDU0LjQ1NCAwIDAwMC0uMjcyIDEuNDk0IDEuNDk0IDAgMDAtLjQzMy0uOTI1TDguMzAzIDIuMTk3YS41LjUgMCAxMC0uNzA3LjcwN0wxMS42OTIgN3oiLz48L3N2Zz4=);\\n  cursor: pointer;\\n  position: absolute;\\n  top: 8px;\\n  height: 32px;\\n  width: 32px;\\n  z-index: 1;\\n  text-indent: -999em;\\n  overflow: hidden;\\n  background-repeat: no-repeat;\\n  border-radius: 4px;\\n  background-position: center;\\n}\\n\\n.react-datepicker__navigation--next:hover, .react-datepicker__navigation--next:focus,\\n.react-datepicker__navigation--previous:hover,\\n.react-datepicker__navigation--previous:focus {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.react-datepicker__navigation--previous {\\n  left: 8px;\\n  transform: rotate(180deg);\\n  transform-origin: center;\\n}\\n\\n.react-datepicker__navigation--next {\\n  right: 8px;\\n}\\n\\n/* This file is a heavy retheme of react-datepicker's Sass as of v1.4.0\\n** https://github.com/Hacker0x01/react-datepicker\\n*/\\n.euiDatePicker {\\n  display: block;\\n  /**\\n   * Inline datepickers\\n   */\\n}\\n\\n.euiDatePicker .euiFormControlLayout {\\n  height: auto;\\n}\\n\\n.euiDatePicker--inline .euiFormControlLayout {\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n  background-color: transparent;\\n  box-shadow: none;\\n  padding: 0;\\n}\\n\\n.euiDatePicker--inline .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: transparent;\\n  flex-direction: column;\\n}\\n\\n.euiDatePicker--inline .euiFormControlLayoutIcons {\\n  justify-content: center;\\n  -webkit-padding-after: 8px;\\n  padding-block-end: 8px;\\n}\\n\\n.euiDatePicker--shadow .euiFormControlLayout {\\n  box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n}\\n\\n.euiDatePicker--shadow .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #FFF;\\n}\\n\\n.react-datepicker {\\n  font-size: 12px;\\n  color: #343741;\\n  display: flex;\\n  border-radius: 6px;\\n  padding: 8px;\\n  justify-content: center;\\n}\\n\\n.react-datepicker--non-interactive {\\n  pointer-events: none;\\n}\\n\\n.react-datepicker__current-month,\\n.react-datepicker-time__header {\\n  display: none;\\n}\\n\\n.react-datepicker__screenReaderOnly {\\n  position: absolute;\\n  top: auto;\\n  left: -10000px;\\n  width: 1px;\\n  height: 1px;\\n  clip: rect(0 0 0 0);\\n  -webkit-clip-path: inset(50%);\\n  clip-path: inset(50%);\\n  overflow: hidden;\\n  margin: -1px;\\n}\\n\\n.react-datepicker__focusTrap {\\n  display: flex;\\n  justify-content: center;\\n}\\n\\n.react-datepicker__month-container {\\n  flex-grow: 1;\\n  margin-top: 36px;\\n}\\n\\n.react-datepicker__header {\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.react-datepicker-time__header {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n.react-datepicker__month {\\n  text-align: center;\\n  border-radius: 6px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .react-datepicker__focusTrap,\\n.react-datepicker {\\n    flex-direction: column;\\n  }\\n\\n  .react-datepicker__time-box {\\n    margin-top: 0;\\n  }\\n}\\n.euiColorPicker {\\n  position: relative;\\n  width: 152px;\\n}\\n\\n.euiColorPicker__popoverAnchor .euiColorPicker__input {\\n  padding-right: 40px;\\n}\\n\\n.euiColorPicker__popoverAnchor .euiColorPicker__input[class*=\\\"--compressed\\\"] {\\n  padding-right: 32px;\\n}\\n\\n.euiColorPicker__popoverAnchor .euiColorPicker__input + .euiFormControlLayoutIcons {\\n  color: inherit;\\n}\\n\\n.euiColorPicker__swatches {\\n  display: flex;\\n  flex-wrap: wrap;\\n  margin: -4px;\\n}\\n\\n.euiColorPicker__swatch-item {\\n  margin: 4px;\\n}\\n\\n.euiSwatchInput__stroke {\\n  fill: none;\\n  stroke: rgba(0, 0, 0, 0.2);\\n}\\n\\n.euiColorPicker__popoverPanel--pickerOnly {\\n  padding-bottom: 0 !important;\\n}\\n\\n.euiColorPicker__input--inGroup {\\n  height: 38px !important;\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiColorPicker__input--inGroup.euiFieldText--compressed {\\n  height: 30px !important;\\n  border-radius: 0;\\n}\\n\\n.euiColorPicker__alphaRange .euiRangeInput {\\n  min-width: 0;\\n}\\n\\n.euiColorPickerSwatch {\\n  display: inline-block;\\n  height: 24px;\\n  width: 24px;\\n  border-radius: 3px;\\n  cursor: pointer;\\n  border: solid 1px rgba(0, 0, 0, 0.1);\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);\\n}\\n\\n.euiColorPickerSwatch:disabled {\\n  cursor: default;\\n}\\n\\n.euiColorPickerSwatch:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiColorPickerSwatch:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiColorPickerSwatch:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiHue {\\n  background: linear-gradient(to right, #FF3232 0%, #FFF130 20%, #45FF30 35%, #28FFF0 52%, #282CFF 71%, #FF28FB 88%, #FF0094 100%);\\n  height: 24px;\\n  margin: 4px 0;\\n  position: relative;\\n}\\n\\n.euiHue::before, .euiHue::after {\\n  content: \\\"\\\";\\n  left: 0;\\n  position: absolute;\\n  height: 8px;\\n  background: #FFF;\\n  width: 100%;\\n}\\n\\n.euiHue::after {\\n  bottom: 0;\\n}\\n\\n.euiHue__range {\\n  position: relative;\\n  height: 24px;\\n  width: calc(100% + 2px);\\n  margin: 0 -1px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  background: transparent;\\n  z-index: 2;\\n}\\n\\n.euiHue__range::-webkit-slider-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -webkit-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\n\\n.euiHue__range::-moz-range-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -moz-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\n\\n.euiHue__range::-ms-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -ms-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\n\\n.euiHue__range::-webkit-slider-thumb {\\n  -webkit-appearance: none;\\n  margin-top: 0;\\n}\\n\\n.euiHue__range::-ms-thumb {\\n  margin-top: 0;\\n}\\n\\n.euiHue__range::-ms-track {\\n  height: 24px;\\n  background: transparent;\\n  border-color: transparent;\\n  color: transparent;\\n}\\n\\n.euiHue__range::-moz-focus-outer {\\n  border: none;\\n}\\n\\n.euiHue__range::-ms-fill-lower, .euiHue__range::-ms-fill-upper {\\n  background: transparent;\\n}\\n\\n.euiHue__range:focus {\\n  outline: none;\\n}\\n\\n.euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\n\\n.euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\n\\n.euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\n\\n.euiSaturation {\\n  position: relative;\\n  width: 100%;\\n  padding-bottom: 100%;\\n  border-radius: 3px;\\n  touch-action: none;\\n  z-index: 3;\\n}\\n\\n.euiSaturation .euiSaturation__lightness,\\n.euiSaturation .euiSaturation__saturation {\\n  position: absolute;\\n  top: -1px;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  border-radius: 3px;\\n}\\n\\n.euiSaturation .euiSaturation__lightness {\\n  background: linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0));\\n}\\n\\n.euiSaturation .euiSaturation__saturation {\\n  background: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));\\n}\\n\\n.euiSaturation .euiSaturation__indicator {\\n  position: absolute;\\n  height: 12px;\\n  width: 12px;\\n  border-radius: 100%;\\n  margin-top: -6px;\\n  margin-left: -6px;\\n  border: 1px solid #343741;\\n}\\n\\n.euiSaturation .euiSaturation__indicator::before {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 100%;\\n  border: 1px solid #F5F7FA;\\n}\\n\\n.euiSaturation:focus {\\n  outline: none;\\n}\\n\\n.euiSaturation:focus .euiSaturation__indicator {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\n\\n.euiColorPalettePicker__itemTitle {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\n\\n.euiColorPalettePicker__itemTitle + .euiColorPaletteDisplay {\\n  margin-top: 4px;\\n}\\n\\n.euiColorPaletteDisplay {\\n  display: flex;\\n  flex-direction: row;\\n  overflow: hidden;\\n  height: 8px;\\n}\\n\\n.euiColorPaletteDisplay--sizeExtraSmall {\\n  position: relative;\\n  height: 4px;\\n  border-radius: 4px;\\n}\\n\\n.euiColorPaletteDisplay--sizeExtraSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 4px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\n\\n.euiColorPaletteDisplay--sizeExtraSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 4px;\\n}\\n\\n.euiColorPaletteDisplay--sizeSmall {\\n  position: relative;\\n  height: 8px;\\n  border-radius: 8px;\\n}\\n\\n.euiColorPaletteDisplay--sizeSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 8px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\n\\n.euiColorPaletteDisplay--sizeSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 8px;\\n}\\n\\n.euiColorPaletteDisplay--sizeMedium {\\n  position: relative;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\n\\n.euiColorPaletteDisplay--sizeMedium::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 16px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\n\\n.euiColorPaletteDisplay--sizeMedium .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 16px;\\n}\\n\\n.euiColorPaletteDisplayFixed__bleedArea {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  display: flex;\\n  height: 8px;\\n  width: calc(100% + 1px);\\n}\\n\\n.euiComboBox {\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  position: relative;\\n  /**\\n   * 1. Allow pills to truncate their text with an ellipsis.\\n   * 2. Don't allow pills/placeholder to overlap with the caret, loading icon or clear button.\\n   * 3. The height on combo can be larger than normal text inputs except for single-selection comboboxes.\\n   */\\n  /**\\n   * 1. Force field height to match other field heights.\\n   * 2. Force input height to expand to fill this element.\\n   * 3. Reset input appearance to mimic text\\n   * 4. Ensure that no input states are visible on the hidden input\\n   */\\n}\\n\\n.euiComboBox--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiComboBox--compressed {\\n  height: 32px;\\n}\\n\\n.euiComboBox--inGroup {\\n  height: 100%;\\n}\\n\\n.euiComboBox--compressed:not(.euiComboBox--appended, .euiComboBox--prepended) {\\n  height: auto;\\n  /* 3 */\\n}\\n\\n.euiComboBox:not(.euiComboBox--appended, .euiComboBox--prepended) .euiFormControlLayout {\\n  height: auto;\\n  /* 3 */\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  padding: 4px 8px;\\n  padding-right: var(--eui-form-control-layout-icons-padding, 8px);\\n  /* 2 */\\n  display: flex;\\n  /* 1 */\\n  outline: none;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiComboBox .euiComboBox__inputWrap {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiComboBox .euiComboBox__inputWrap--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiComboBox .euiComboBox__inputWrap--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap .euiComboBoxPill {\\n  max-width: calc(100% - 2px - 16px);\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap:not(.euiComboBox__inputWrap--noWrap) {\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  padding-left: 4px;\\n  height: auto;\\n  /* 3 */\\n  flex-wrap: wrap;\\n  /* 1 */\\n  align-content: flex-start;\\n  cursor: text;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--noWrap {\\n  align-items: center;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 8px;\\n  padding-inline-start: 8px;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend, .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  flex-shrink: 0;\\n  margin-inline: 2px;\\n  display: flex;\\n  /* Vertically centers any icons */\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend {\\n  -webkit-margin-start: 4px;\\n  margin-inline-start: 4px;\\n}\\n\\n.euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  -webkit-margin-end: 4px;\\n  margin-inline-end: 4px;\\n}\\n\\n.euiComboBox .euiComboBox__input {\\n  block-size: 24px;\\n  /* 2 */\\n  min-inline-size: 2px;\\n  max-inline-size: 100%;\\n  margin: 4px;\\n  /* 3 */\\n  background: transparent;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  /* 4 */\\n  -webkit-appearance: none !important;\\n  -moz-appearance: none !important;\\n  appearance: none !important;\\n  border: none !important;\\n  box-shadow: none !important;\\n  outline: none !important;\\n}\\n\\n.euiComboBox .euiComboBox__input::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiComboBox .euiComboBox__input:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox .euiComboBox__input:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap--compressed {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiComboBox.euiComboBox-isInvalid .euiComboBox__inputWrap {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  -webkit-text-fill-color: unset;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap,\\n.euiComboBox.euiComboBox-isDisabled .euiComboBoxPill {\\n  cursor: not-allowed;\\n}\\n\\n.euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap {\\n  line-height: 32px;\\n  /* 2 */\\n  padding-block: 0;\\n}\\n\\n.euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 4px;\\n  padding-inline-start: 4px;\\n}\\n\\n/*\\n * 1. Overwrites the base styling of EuiBadge, to give it a larger size and margins\\n * that make sense in the input wrap.\\n */\\n.euiComboBoxPill {\\n  height: 22px;\\n  line-height: 20px;\\n  vertical-align: baseline;\\n  /* Fix append/prepend vertical alignment */\\n}\\n\\n.euiComboBoxPill, .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 4px;\\n}\\n\\n.euiComboBox--compressed .euiComboBoxPill, .euiComboBox--compressed .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 5px 4px 0 0;\\n}\\n\\n.euiComboBoxPill__prepend {\\n  margin-right: 4px;\\n}\\n\\n.euiComboBoxPill__append {\\n  margin-left: 4px;\\n}\\n\\n.euiComboBoxPill .euiBadge__text {\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiComboBoxPill .euiBadge__text .euiIcon {\\n  display: block;\\n}\\n\\n/**\\n * 1. Using specificity to override panel shadow\\n * 2. Prevent really long input from overflowing the container.\\n */\\n.euiComboBoxOptionsList {\\n  max-height: 200px;\\n  overflow: hidden;\\n  /* Kibana FTR affordance - without this, Selenium complains about the overlaid\\n     text intercepting the button click. Since `title` is always present, and\\n     users can't highlight or copy combobox options anyway, we might as well\\n     disable clicks on text */\\n}\\n\\n.euiComboBoxOptionsList__virtualization {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\n\\n.euiComboBoxOptionsList__virtualization::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiComboBoxOptionsList__virtualization::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiComboBoxOptionsList__virtualization::-webkit-scrollbar-corner, .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiComboBoxOptionsList .euiTextTruncate {\\n  pointer-events: none;\\n}\\n\\n.euiComboBoxOptionsList__empty {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 2 */\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n}\\n\\n.euiComboBoxOption {\\n  font-size: 14px;\\n  padding: 4px 8px 4px 16px;\\n  width: 100%;\\n  text-align: left;\\n  border: 1px solid #D3DAE6;\\n  border-color: transparent;\\n  display: flex;\\n  align-items: center;\\n  /* Fix vertical alignment of EuiIcons in prepend/append nodes */\\n}\\n\\n.euiComboBoxOption:hover {\\n  text-decoration: underline;\\n}\\n\\n.euiComboBoxOption.euiComboBoxOption-isFocused {\\n  cursor: pointer;\\n  color: #0071c2;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiComboBoxOption.euiComboBoxOption-isDisabled {\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\n\\n.euiComboBoxOption.euiComboBoxOption-isDisabled:hover {\\n  text-decoration: none;\\n}\\n\\n.euiComboBoxOption__contentWrapper {\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiComboBoxOption__content {\\n  text-overflow: ellipsis;\\n  overflow: hidden;\\n  white-space: nowrap;\\n  flex: 1;\\n  text-align: left;\\n}\\n\\n.euiComboBoxOption__emptyStateText {\\n  flex: 1;\\n  text-align: left;\\n  /* Extra specificity required to override EuiText's <p> styling */\\n}\\n\\n.euiComboBoxOptionsList__empty .euiComboBoxOption__emptyStateText {\\n  margin-bottom: 0;\\n}\\n\\n.euiComboBoxOption__enterBadge {\\n  margin-left: 4px;\\n}\\n\\n.euiComboBoxOption__prepend {\\n  margin-right: 8px;\\n}\\n\\n.euiComboBoxOption__append {\\n  margin-left: 8px;\\n}\\n\\n.euiComboBoxOption__prepend .euiIcon, .euiComboBoxOption__append .euiIcon {\\n  display: block;\\n}\\n\\n/**\\n * 1. Force each title to be the same height as an option, so that the virtualized scroll logic\\n *    works.\\n */\\n.euiComboBoxTitle {\\n  font-size: 12px;\\n  padding: 11px 8px 4px;\\n  /* 1 */\\n  width: 100%;\\n  font-weight: 700;\\n  color: #000;\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow {\\n  padding: 0 8px 8px;\\n  /* A bit of a visual trickery to make the format \\\"hint\\\" become an \\\"error\\\" text.\\n     NOTE: Normally reordering visually (vs DOM) isn't super great for screen reader users,\\n     but as the help text is already read out via `aria-describedby`, and the error text\\n     is read out immediately via `aria-live`, we can fairly safely prioritize visuals instead */\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow .euiFormRow__fieldWrapper {\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow .euiFormControlLayout {\\n  order: 0;\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow .euiFormHelpText {\\n  order: 1;\\n}\\n\\n.euiSuperDatePicker__absoluteDateFormRow .euiFormErrorText {\\n  order: 2;\\n}\\n\\n.euiDatePopoverButton {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  background-size: 100%;\\n}\\n\\n.euiDatePopoverButton::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiDatePopoverButton:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiDatePopoverButton::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiDatePopoverButton--compressed {\\n  line-height: 30px;\\n  height: 30px;\\n}\\n\\n.euiDatePopoverButton:focus, .euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n}\\n\\n.euiDatePopoverButton-needsUpdating {\\n  background-color: #e6f9f7;\\n  color: #007e77;\\n}\\n\\n.euiDatePopoverButton-needsUpdating:focus, .euiDatePopoverButton-needsUpdating.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #00BFB3, #00BFB3 2px, transparent 2px, transparent 100%);\\n}\\n\\n.euiDatePopoverButton-isInvalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n  background-color: transparent;\\n  color: #BD271E;\\n}\\n\\n.euiDatePopoverButton-isInvalid:focus, .euiDatePopoverButton-isInvalid.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n}\\n\\n.euiDatePopoverButton:disabled {\\n  background-color: #eef2f7;\\n  background-image: none;\\n  color: #69707D;\\n  cursor: default;\\n}\\n\\n.euiDatePopoverButton--start {\\n  text-align: center;\\n}\\n\\n.euiDatePopoverButton--end {\\n  text-align: center;\\n}\\n\\n.euiDatePopoverContent,\\n.euiDatePopoverContent .react-datepicker {\\n  width: 400px;\\n  max-width: 100%;\\n}\\n\\n.euiDatePopoverContent__padded {\\n  padding: 8px;\\n}\\n\\n.euiDatePopoverContent__padded--large {\\n  padding: 16px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiDatePopoverContent {\\n    width: 284px;\\n  }\\n}\\n.euiQuickSelectPopover__content {\\n  width: 400px;\\n  max-width: 100%;\\n}\\n\\n.euiQuickSelectPopover__content .euiQuickSelectPopover__panel:not(:first-child) {\\n  border-top: 1px solid #D3DAE6;\\n  padding-top: 12px;\\n  margin-top: 12px;\\n}\\n\\n.euiQuickSelectPopover__content .euiQuickSelectPopover__panel .euiQuickSelectPopover__panelTitle {\\n  float: left;\\n  margin-bottom: 12px;\\n}\\n\\n.euiQuickSelectPopover__section {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 132px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n  margin: 8px 0 0;\\n  clear: both;\\n}\\n\\n.euiQuickSelectPopover__section::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiQuickSelectPopover__section::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiQuickSelectPopover__section::-webkit-scrollbar-corner, .euiQuickSelectPopover__section::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiQuickSelectPopover__buttonContent {\\n  gap: 4px;\\n}\\n\\n.euiQuickSelectPopover__sectionItem {\\n  font-size: 14px;\\n  line-height: 14px;\\n}\\n\\n.euiQuickSelectPopover__sectionItem--recentlyUsed:not(:last-of-type) {\\n  margin-bottom: 8px;\\n}\\n\\n.euiQuickSelect__applyButton {\\n  min-width: 0;\\n}\\n\\n.euiRefreshInterval__startButton {\\n  min-width: 90px;\\n}\\n\\n.euiSuperDatePicker {\\n  display: flex;\\n  gap: 8px;\\n  max-width: 100%;\\n  min-width: min(326px, 100%);\\n  width: 606px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\n.euiSuperDatePicker--isAutoRefreshOnly {\\n  min-width: min(200px, 100%);\\n  width: 400px;\\n}\\n\\n.euiSuperDatePicker--noUpdateButton {\\n  min-width: min(200px, 100%);\\n  width: 480px;\\n}\\n\\n.euiSuperDatePicker--fullWidth {\\n  width: 100%;\\n}\\n\\n.euiSuperDatePicker--isQuickSelectOnly {\\n  min-width: 0;\\n}\\n\\n.euiSuperDatePicker--autoWidth {\\n  display: inline-flex;\\n  width: auto;\\n}\\n\\n.euiSuperDatePicker .euiDatePickerRange {\\n  flex-grow: 1;\\n}\\n\\n.euiSuperDatePicker .euiFormControlLayout {\\n  max-width: 100%;\\n}\\n\\n.euiSuperDatePicker .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  overflow: hidden;\\n  background-color: #fbfcfd;\\n}\\n\\n.euiSuperDatePicker .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\n\\n.euiSuperDatePicker .euiFormControlLayout__childrenWrapper > .euiFormControlLayoutDelimited__input {\\n  flex-grow: 1;\\n}\\n\\n.euiSuperDatePicker__prettyFormat {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  display: flex;\\n  justify-content: space-between;\\n  text-align: left;\\n}\\n\\n.euiSuperDatePicker__prettyFormat::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperDatePicker__prettyFormat:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperDatePicker__prettyFormat::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperDatePicker__prettyFormat:not(:disabled):hover, .euiSuperDatePicker__prettyFormat:focus {\\n  text-decoration: none;\\n}\\n\\n.euiSuperDatePicker__prettyFormat:disabled {\\n  background-color: #eef2f7;\\n  color: #69707D;\\n  cursor: not-allowed;\\n}\\n\\n/**\\n* Make the arrow delimiter match the colors of `.euiDatePopoverButton-needsUpdating`\\n*/\\n.euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #e6f9f7;\\n}\\n\\n.euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayoutDelimited__delimiter {\\n  color: #007e77;\\n}\\n\\n.euiSuperDatePicker--needsUpdating .euiFormControlLayout__childrenWrapper {\\n  transition: background 150ms ease-in;\\n}\\n\\n.euiDataGrid {\\n  display: flex;\\n  flex-direction: column;\\n  align-items: stretch;\\n  overflow: hidden;\\n  height: 100%;\\n}\\n\\n.euiDataGrid--fullScreen {\\n  height: 100%;\\n  position: fixed;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  z-index: 999;\\n  background: #FFF;\\n}\\n\\n.euiDataGrid--fullScreen .euiDataGrid__pagination {\\n  padding-bottom: 4px;\\n  background: #F5F7FA;\\n  box-shadow: 1px 0 0 1px #D3DAE6;\\n}\\n\\n.euiDataGrid__content {\\n  flex-grow: 1;\\n  height: 100%;\\n  max-width: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  z-index: 1;\\n  position: relative;\\n  background: #fafbfd;\\n  font-feature-settings: \\\"tnum\\\" 1;\\n}\\n\\n.euiDataGrid__customRenderBody {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #FFF;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  width: 100%;\\n  overflow: auto;\\n}\\n\\n.euiDataGrid__customRenderBody::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGrid__customRenderBody::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #FFF;\\n}\\n\\n.euiDataGrid__customRenderBody::-webkit-scrollbar-corner, .euiDataGrid__customRenderBody::-webkit-scrollbar-track {\\n  background-color: #FFF;\\n}\\n\\n.euiDataGrid__pagination {\\n  z-index: 2;\\n  padding-top: 4px;\\n  flex-grow: 0;\\n}\\n\\n.euiDataGrid__restrictBody {\\n  height: 100vh;\\n  overflow: hidden;\\n}\\n\\n.euiDataGrid__restrictBody .euiHeader[data-fixed-header] {\\n  z-index: 998 !important;\\n}\\n\\n.euiDataGrid__restrictBody .euiOverlayMask[data-relative-to-header=below] {\\n  top: 0;\\n}\\n\\n.euiDataGrid__restrictBody .euiFlyout {\\n  top: 0;\\n  height: 100%;\\n}\\n\\n.euiDataGrid__focusWrap {\\n  height: 100%;\\n}\\n\\n.euiDataGrid__virtualized {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #FFF;\\n  scrollbar-width: thin;\\n  scroll-padding: 0;\\n}\\n\\n.euiDataGrid__virtualized::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGrid__virtualized::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #FFF;\\n}\\n\\n.euiDataGrid__virtualized::-webkit-scrollbar-corner, .euiDataGrid__virtualized::-webkit-scrollbar-track {\\n  background-color: #FFF;\\n}\\n\\n.euiDataGrid__scrollOverlay {\\n  position: absolute;\\n  top: -1px;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  pointer-events: none;\\n  box-shadow: inset 0 0 0 1px #D3DAE6;\\n}\\n\\n.euiDataGrid--bordersHorizontal .euiDataGrid__scrollOverlay {\\n  box-shadow: inset 0 -2px 0 -1px #D3DAE6;\\n}\\n\\n.euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayBottom {\\n  position: absolute;\\n  width: 100%;\\n  height: 1px;\\n  background-color: #D3DAE6;\\n}\\n\\n.euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayRight {\\n  position: absolute;\\n  height: 100%;\\n  width: 1px;\\n  background-color: #D3DAE6;\\n}\\n\\n.euiDataGridHeader {\\n  display: flex;\\n  z-index: 999;\\n  background: #FFF;\\n  position: sticky;\\n  top: 0;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\n\\n.euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  padding: 6px;\\n  flex: 0 0 auto;\\n  position: relative;\\n  align-items: center;\\n  display: flex;\\n}\\n\\n.euiDataGridHeaderCell > [data-focus-lock-disabled] {\\n  width: 100%;\\n}\\n\\n.euiDataGridHeaderCell:focus, .euiDataGridHeaderCell--hasColumnActions:focus-within, .euiDataGridHeaderCell--isActionsPopoverOpen {\\n  outline: none;\\n}\\n\\n.euiDataGridHeaderCell:focus::after, .euiDataGridHeaderCell--hasColumnActions:focus-within::after, .euiDataGridHeaderCell--isActionsPopoverOpen::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #0071c2);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__button {\\n  position: relative;\\n  display: flex;\\n  align-items: center;\\n  gap: 4px;\\n  width: 100%;\\n  font-weight: 700;\\n  outline: none;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__content {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__sortingArrow {\\n  flex: 0 0 auto;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__icon {\\n  flex: 0 0 auto;\\n  margin-left: auto;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  height: 16px;\\n  overflow: hidden;\\n  width: 0;\\n  opacity: 0;\\n  transition: width 150ms ease-in, opacity 350ms ease-in;\\n}\\n\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):focus-within .euiDataGridHeaderCell__icon, .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):hover .euiDataGridHeaderCell__icon,\\n.euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiPopover-isOpen .euiDataGridHeaderCell__icon {\\n  width: 16px;\\n  opacity: 1;\\n}\\n\\n.euiDataGridHeaderCell.euiDataGridHeaderCell--numeric .euiDataGridHeaderCell__content, .euiDataGridHeaderCell.euiDataGridHeaderCell--currency .euiDataGridHeaderCell__content {\\n  flex-grow: 1;\\n  text-align: right;\\n}\\n\\n.euiDataGridHeader__action--selected {\\n  font-weight: 700 !important;\\n}\\n\\n.euiDataGrid--bordersNone.euiDataGrid--bordersHorizontal .euiDataGridHeader {\\n  background: #FFF;\\n}\\n\\n.euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-left: none;\\n  border-right: none;\\n  border-bottom: 2px solid #D3DAE6;\\n  border-bottom-color: #343741;\\n}\\n\\n.euiDataGrid--bordersNone.euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-bottom: 2px solid #D3DAE6;\\n  border-color: #343741;\\n}\\n\\n.euiDataGrid--headerShade .euiDataGridHeaderCell {\\n  background: #f5f7fa;\\n}\\n\\n.euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-right: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  border-left: none;\\n}\\n\\n.euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell:first-of-type {\\n  border-left: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGrid--headerShade.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-bottom: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGrid--bordersNone .euiDataGridHeaderCell {\\n  border: none;\\n}\\n\\n.euiDataGrid--borderhorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-right: none;\\n  border-left: none;\\n}\\n\\n.euiDataGrid--fontSizeSmall .euiDataGridHeaderCell {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\n\\n.euiDataGrid--fontSizeLarge .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\n\\n.euiDataGrid--paddingSmall .euiDataGridHeaderCell {\\n  padding: 4px;\\n}\\n\\n.euiDataGrid--paddingLarge .euiDataGridHeaderCell {\\n  padding: 8px;\\n}\\n\\n.euiDataGrid--noControls.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-top: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGrid--noControls.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGridFooter {\\n  display: flex;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\n\\n.euiDataGridRowCell.euiDataGridFooterCell {\\n  flex: 0 0 auto;\\n  position: relative;\\n  font-weight: 700;\\n}\\n\\n.euiDataGrid--stickyFooter .euiDataGridFooter {\\n  position: sticky;\\n  bottom: 0;\\n}\\n\\n.euiDataGrid--footerOverline .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-top: 2px solid #D3DAE6;\\n  border-top-color: #343741 !important;\\n  background: #FFF !important;\\n}\\n\\n.euiDataGrid--bordersNone .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\n\\n.euiDataGrid--bordersHorizontal .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\n\\n.euiDataGrid--footerShade .euiDataGridRowCell.euiDataGridFooterCell {\\n  background: #f5f7fa;\\n}\\n\\n.euiDataGridColumnResizer {\\n  position: absolute;\\n  top: 0;\\n  right: -8px;\\n  height: 100%;\\n  width: 16px;\\n  cursor: ew-resize;\\n  opacity: 0;\\n  z-index: 2;\\n}\\n\\n.euiDataGridColumnResizer::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  left: 7px;\\n  top: 0;\\n  bottom: 0;\\n  width: 3px;\\n  background-color: #07C;\\n}\\n\\n.euiDataGridColumnResizer:hover, .euiDataGridColumnResizer:active {\\n  opacity: 1;\\n}\\n\\n.euiDataGridColumnResizer:hover ~ .euiDataGridHeaderCell__content, .euiDataGridColumnResizer:active ~ .euiDataGridHeaderCell__content {\\n  -webkit-user-select: none;\\n  -moz-user-select: none;\\n  -ms-user-select: none;\\n      user-select: none;\\n}\\n\\n.euiDataGridHeaderCell:last-child .euiDataGridColumnResizer {\\n  right: 0;\\n  width: 8px;\\n}\\n\\n.euiDataGridHeaderCell:last-child .euiDataGridColumnResizer::after {\\n  left: auto;\\n  right: 0;\\n}\\n\\n.euiDataGridRow {\\n  background-color: #FFF;\\n}\\n\\n.euiDataGridRowCell {\\n  position: relative;\\n  border-right: solid 1px #edf0f5;\\n  border-bottom: 1px solid #D3DAE6;\\n  --euiDataGridCellOutlineColor: #07C;\\n}\\n\\n.euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 6px;\\n  height: 100%;\\n  overflow: hidden;\\n}\\n\\n.euiDataGridRowCell .euiDataGridRowCell__content--autoHeight {\\n  height: auto;\\n}\\n\\n.euiDataGridRowCell > [data-focus-lock-disabled] {\\n  height: 100%;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--firstColumn {\\n  border-left: 1px solid #D3DAE6;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--lastColumn {\\n  border-right-color: #D3DAE6;\\n}\\n\\n.euiDataGridRowCell:hover, .euiDataGridRowCell:focus, .euiDataGridRowCell.euiDataGridRowCell--open {\\n  outline: none;\\n}\\n\\n.euiDataGridRowCell:hover::after, .euiDataGridRowCell:focus::after, .euiDataGridRowCell.euiDataGridRowCell--open::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #0071c2);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\n\\n.euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) {\\n  --euiDataGridCellOutlineColor: #69707D;\\n}\\n\\n.euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) .euiDataGridRowCell__actions {\\n  -webkit-animation-delay: 350ms;\\n  animation-delay: 350ms;\\n}\\n\\n.euiDataGridRowCell:hover .euiDataGridRowCell__actions, .euiDataGridRowCell:focus .euiDataGridRowCell__actions, .euiDataGridRowCell:focus-within .euiDataGridRowCell__actions, .euiDataGridRowCell.euiDataGridRowCell--open .euiDataGridRowCell__actions, .euiDataGridRowCell[data-keyboard-closing] .euiDataGridRowCell__actions {\\n  -webkit-animation-duration: 90ms;\\n  animation-duration: 90ms;\\n  -webkit-animation-name: euiDataGridCellActionsSlideIn;\\n  animation-name: euiDataGridCellActionsSlideIn;\\n  -webkit-animation-iteration-count: 1;\\n  animation-iteration-count: 1;\\n  -webkit-animation-fill-mode: forwards;\\n  animation-fill-mode: forwards;\\n}\\n\\n.euiDataGridRowCell:not(:hover):not(:focus):not(.euiDataGridRowCell--open):not([data-keyboard-closing]) .euiDataGridRowCell__actions {\\n  display: none;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--numeric {\\n  text-align: right;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--currency {\\n  text-align: right;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--uppercase {\\n  text-transform: uppercase;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--lowercase {\\n  text-transform: lowercase;\\n}\\n\\n.euiDataGridRowCell.euiDataGridRowCell--capitalize {\\n  text-transform: capitalize;\\n}\\n\\n.euiDataGridRowCell__popover {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  overflow: auto;\\n  z-index: 1000 !important;\\n  filter: none;\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  -webkit-animation-duration: 250ms;\\n  animation-duration: 250ms;\\n  -webkit-animation-name: euiDataGridCellPopover;\\n  animation-name: euiDataGridCellPopover;\\n}\\n\\n.euiDataGridRowCell__popover::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGridRowCell__popover::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiDataGridRowCell__popover::-webkit-scrollbar-corner, .euiDataGridRowCell__popover::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiDataGridRowCell--controlColumn .euiDataGridRowCell__content {\\n  max-height: 100%;\\n  height: auto;\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiDataGridRowCell__actions,\\n.euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  position: absolute;\\n  bottom: 100%;\\n}\\n\\n.euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions,\\n.euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  left: 0;\\n}\\n\\n.euiDataGridRowCell--alignRight .euiDataGridRowCell__actions,\\n.euiDataGridRowCell--alignRight .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  right: 0;\\n}\\n\\n.euiDataGridRowCell__actions {\\n  z-index: 998;\\n  margin-bottom: -1px;\\n  display: flex;\\n  gap: 2px;\\n  padding-inline: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n  color: #FFF;\\n  border: 1px solid var(--euiDataGridCellOutlineColor);\\n  border-top-left-radius: 3px;\\n  border-top-right-radius: 3px;\\n  transform: scaleY(0);\\n  transform-origin: bottom;\\n}\\n\\n.euiDataGridRowCell[data-gridcell-visible-row-index=\\\"0\\\"] > .euiDataGridRowCell__actions {\\n  z-index: 999;\\n}\\n\\n.euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions {\\n  border-bottom-right-radius: 3px;\\n}\\n\\n.euiDataGridRowCell--alignRight .euiDataGridRowCell__actions {\\n  border-bottom-left-radius: 3px;\\n}\\n\\n.euiDataGridRowCell__actions::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 100%;\\n  height: 2px;\\n  width: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n}\\n\\n.euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions::after {\\n  left: -1px;\\n}\\n\\n.euiDataGridRowCell--alignRight .euiDataGridRowCell__actions::after {\\n  right: -1px;\\n}\\n\\n.euiDataGridRowCell__actionButtonIcon {\\n  height: 20px;\\n  width: 16px;\\n  border-radius: 0;\\n  /* Force all cell action buttons to match EUI colors */\\n  /* Manually increase the size of the expand cell icon - it's a bit small by default */\\n}\\n\\n.euiDataGridRowCell__actionButtonIcon,\\n.euiDataGridRowCell__actionButtonIcon svg {\\n  background-color: transparent !important;\\n  color: currentColor !important;\\n  fill: currentColor !important;\\n}\\n\\n.euiDataGridRowCell__actionButtonIcon.euiDataGridRowCell__expandCell .euiIcon {\\n  width: 120%;\\n  height: 100%;\\n}\\n\\n.euiDataGrid--stripes .euiDataGridRow--striped {\\n  background-color: #F5F7FA;\\n}\\n\\n.euiDataGrid--rowHoverHighlight .euiDataGridRow:hover {\\n  background-color: #fff9e8;\\n}\\n\\n.euiDataGrid--bordersNone .euiDataGridRowCell {\\n  border-color: transparent !important;\\n}\\n\\n.euiDataGrid--bordersHorizontal .euiDataGridRowCell {\\n  border-right-color: transparent;\\n  border-left-color: transparent;\\n}\\n\\n.euiDataGrid--fontSizeSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\n\\n.euiDataGrid--fontSizeLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\n\\n.euiDataGrid--paddingSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 4px;\\n}\\n\\n.euiDataGrid--paddingLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 8px;\\n}\\n\\n@-webkit-keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@-webkit-keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n.euiDataGrid__controls {\\n  background: #fafbfd;\\n  position: relative;\\n  z-index: 2;\\n  border: 1px solid #D3DAE6;\\n  padding: 4px 4px 4px 0;\\n  display: flex;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\n\\n.euiDataGrid__rightControls {\\n  white-space: nowrap;\\n}\\n\\n.euiDataGrid__rightControls:only-child {\\n  margin-left: auto;\\n}\\n\\n.euiDataGrid__rightControls > * + * {\\n  margin-left: 8px;\\n}\\n\\n.euiDataGrid__leftControls > * + * {\\n  margin-left: 2px;\\n}\\n\\n.euiDataGrid--bordersNone .euiDataGrid__controls {\\n  border: none;\\n  background: #FFF;\\n}\\n\\n.euiDataGrid--bordersHorizontal .euiDataGrid__controls {\\n  border-right: none;\\n  border-left: none;\\n  border-top: none;\\n  background: #FFF;\\n}\\n\\n.euiDataGrid__controlScroll {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  padding: 8px;\\n  margin: -8px;\\n}\\n\\n.euiDataGrid__controlScroll::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGrid__controlScroll::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiDataGrid__controlScroll::-webkit-scrollbar-corner, .euiDataGrid__controlScroll::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiDataGrid__controlScroll:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.euiDataGrid__controlScroll[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.euiDataGridColumnSelector__item {\\n  padding: 4px;\\n}\\n\\n.euiDataGridColumnSelector__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  background: #FFF;\\n}\\n\\n.euiDataGridColumnSelector__columnList {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  margin: 0 -8px;\\n}\\n\\n.euiDataGridColumnSelector__columnList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGridColumnSelector__columnList::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiDataGridColumnSelector__columnList::-webkit-scrollbar-corner, .euiDataGridColumnSelector__columnList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiDataGridColumnSelector__columnList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.euiDataGridColumnSelector__columnList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.euiDataGridColumnSelector__itemLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\n\\n.euiDataGridColumnSorting__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  background: #FFF;\\n}\\n\\n.euiDataGridColumnSorting__fieldList {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  max-height: 300px;\\n}\\n\\n.euiDataGridColumnSorting__fieldList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiDataGridColumnSorting__fieldList::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiDataGridColumnSorting__fieldList::-webkit-scrollbar-corner, .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiDataGridColumnSorting__fieldList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\n\\n.euiDataGridColumnSorting__fieldList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\n\\n.euiDataGridColumnSorting__field {\\n  display: block;\\n  padding: 4px 8px;\\n  width: 100%;\\n  outline-offset: -2px;\\n}\\n\\n.euiDataGridColumnSorting__field:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\n\\n.euiDataGridColumnSorting__field:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiDataGridColumnSorting__field:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #ABB4C4;\\n}\\n\\n.euiDataGridColumnSorting__name {\\n  padding-right: 24px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\n.euiDataGridColumnSorting__order {\\n  min-width: 200px;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\n.euiDataGridColumnSorting__order .euiButtonGroup__buttons {\\n  border: none;\\n}\\n\\n.euiDataGridColumnSorting__order .euiButtonGroupButton {\\n  font-size: 12px;\\n}\\n\\n.euiDataGrid__displayPopoverPanel {\\n  width: 416px;\\n}\\n\\n.euiDataGrid__keyboardShortcuts {\\n  display: block;\\n  max-inline-size: 400px;\\n  max-block-size: 80vh;\\n  overflow-y: auto;\\n  overflow-block: auto;\\n}\\n\\n.euiDataGrid__keyboardShortcuts .euiDescriptionList {\\n  row-gap: 0;\\n}\\n\\n/**\\n  * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n  *    they actually click this input.\\n  */\\n.euiCheckbox {\\n  position: relative;\\n}\\n\\n.euiCheckbox .euiCheckbox__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\n\\n.euiCheckbox .euiCheckbox__input ~ .euiCheckbox__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\n\\n.euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 4px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:checked + .euiCheckbox__square {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%28255, 255, 255%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiCheckbox .euiCheckbox__input:indeterminate + .euiCheckbox__square {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%28255, 255, 255%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiCheckbox .euiCheckbox__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\n\\n.euiCheckbox .euiCheckbox__input[disabled] ~ .euiCheckbox__label {\\n  color: #98A2B3;\\n  cursor: not-allowed !important;\\n}\\n\\n.euiCheckbox .euiCheckbox__input[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:checked[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%2894, 100, 111%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiCheckbox .euiCheckbox__input:indeterminate[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%2894, 100, 111%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiCheckbox.euiCheckbox--inList, .euiCheckbox.euiCheckbox--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\n\\n.euiCheckbox.euiCheckbox--inList .euiCheckbox__input,\\n.euiCheckbox.euiCheckbox--inList .euiCheckbox__square, .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input,\\n.euiCheckbox.euiCheckbox--noLabel .euiCheckbox__square {\\n  top: 0;\\n}\\n\\n.euiCheckbox.euiCheckbox--inList .euiCheckbox__input, .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input {\\n  margin: 0;\\n}\\n\\n.euiCheckboxGroup__item + .euiCheckboxGroup__item {\\n  margin-top: 4px;\\n}\\n\\n.euiCheckboxGroup__item + .euiCheckboxGroup__item.euiCheckbox--compressed {\\n  margin-top: 0;\\n}\\n\\n.euiDescribedFormGroup {\\n  max-width: 800px;\\n}\\n\\n.euiDescribedFormGroup + * {\\n  margin-top: 24px;\\n}\\n\\n.euiDescribedFormGroup.euiDescribedFormGroup--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiDescribedFormGroup .euiDescribedFormGroup__description {\\n  padding-top: 8px;\\n}\\n\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields {\\n  min-width: 0;\\n}\\n\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child,\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel) {\\n  margin-top: 0;\\n}\\n\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child::before,\\n.euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel)::before {\\n  content: \\\"\\\";\\n}\\n\\n.euiDescribedFormGroup__descriptionColumn {\\n  min-width: min(20rem, 50%);\\n}\\n\\n.euiFieldNumber {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\n\\n.euiFieldNumber--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFieldNumber--compressed {\\n  height: 32px;\\n}\\n\\n.euiFieldNumber--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldNumber {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiFieldNumber::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldNumber:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiFieldNumber:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiFieldNumber--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldNumber--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFieldNumber--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldNumber--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldNumber--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldNumber--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiFieldNumber--withIcon {\\n  padding-left: 40px;\\n}\\n\\n.euiFieldNumber--withIcon.euiFieldNumber--compressed {\\n  padding-left: 32px;\\n}\\n\\n.euiFieldPassword {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n}\\n\\n.euiFieldPassword--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFieldPassword--compressed {\\n  height: 32px;\\n}\\n\\n.euiFieldPassword--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldPassword {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiFieldPassword::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldPassword:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiFieldPassword:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiFieldPassword--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldPassword--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFieldPassword--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldPassword--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldPassword--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldPassword--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiFieldPassword.euiFieldPassword--compressed {\\n  padding-left: 32px;\\n}\\n\\n.euiFieldPassword--withToggle::-ms-reveal {\\n  display: none;\\n}\\n\\n/*\\n * 1. Fix for Safari to ensure that it renders like a normal text input\\n *    and doesn't add extra spacing around text\\n*/\\n.euiFieldSearch {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n  -webkit-appearance: textfield;\\n  /* 1 */\\n}\\n\\n.euiFieldSearch--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFieldSearch--compressed {\\n  height: 32px;\\n}\\n\\n.euiFieldSearch--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldSearch {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiFieldSearch::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldSearch:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiFieldSearch:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiFieldSearch--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldSearch--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFieldSearch--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldSearch--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldSearch--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldSearch--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiFieldSearch-isLoading {\\n  padding-right: 40px;\\n}\\n\\n.euiFieldSearch-isLoading.euiFieldSearch--compressed {\\n  padding-right: 32px;\\n}\\n\\n.euiFieldSearch::-webkit-search-decoration, .euiFieldSearch::-webkit-search-cancel-button {\\n  -webkit-appearance: none;\\n  /* 1, 2 */\\n}\\n\\n.euiFieldSearch--compressed {\\n  padding-left: 32px;\\n}\\n\\n.euiFieldText {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\n\\n.euiFieldText--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFieldText--compressed {\\n  height: 32px;\\n}\\n\\n.euiFieldText--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldText {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiFieldText::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldText:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldText::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiFieldText:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldText:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiFieldText:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiFieldText--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFieldText--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFieldText--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFieldText--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFieldText--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFieldText--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiFieldText--withIcon {\\n  padding-left: 40px;\\n}\\n\\n.euiFieldText--withIcon.euiFieldText--compressed {\\n  padding-left: 32px;\\n}\\n\\n/**\\n  * REMEMBER: --large modifiers must come last to override --compressed\\n  */\\n.euiFilePicker {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  position: relative;\\n}\\n\\n.euiFilePicker--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFilePicker--compressed {\\n  height: 32px;\\n}\\n\\n.euiFilePicker--inGroup {\\n  height: 100%;\\n}\\n\\n.euiFilePicker.euiFilePicker--large {\\n  border-radius: 6px;\\n  overflow: hidden;\\n  height: auto;\\n}\\n\\n.euiFilePicker.euiFilePicker--large.euiFilePicker--compressed {\\n  border-radius: 4px;\\n}\\n\\n.euiFilePicker__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\n\\n.euiFilePicker__input:hover {\\n  cursor: pointer;\\n}\\n\\n.euiFilePicker__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\n\\n.euiFilePicker__input:disabled {\\n  opacity: 0;\\n}\\n\\n.euiFilePicker__input:disabled ~ .euiFilePicker__prompt {\\n  color: #98A2B3;\\n}\\n\\n.euiFilePicker__icon {\\n  position: absolute;\\n  left: 12px;\\n  top: 12px;\\n  transition: transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\n\\n.euiFilePicker--compressed .euiFilePicker__icon {\\n  top: 8px;\\n  left: 8px;\\n}\\n\\n.euiFilePicker--large .euiFilePicker__icon {\\n  position: static;\\n  margin-bottom: 16px;\\n}\\n\\n/**\\n  * 1. Don't block the user from dropping files onto the filepicker.\\n  * 2. Ensure space for import icon, loading spinner, and clear button (only if it has files)\\n  * 4. Static height so that it doesn't shift its surrounding contents around\\n  */\\n.euiFilePicker__prompt {\\n  padding-left: 40px;\\n  /* 2 */\\n  height: 40px;\\n  padding-top: 12px;\\n  padding-right: 12px;\\n  padding-bottom: 12px;\\n  pointer-events: none;\\n  /* 1 */\\n  border: 2px dashed #D3DAE6;\\n  border-radius: 6px;\\n  transition: border-color 150ms ease-in, background-color 150ms ease-in;\\n}\\n\\n.euiFilePicker--compressed .euiFilePicker__prompt {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  padding-left: 32px;\\n  /* 2 */\\n  height: 32px;\\n  border-radius: 4px;\\n  box-shadow: none;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFilePicker--compressed .euiFilePicker__prompt {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFilePicker--large .euiFilePicker__prompt {\\n  height: 128px;\\n  /* 4 */\\n  padding: 0 24px;\\n  display: flex;\\n  flex-direction: column;\\n  align-items: center;\\n  justify-content: center;\\n}\\n\\n.euiFilePicker--large.euiFilePicker--compressed .euiFilePicker__prompt {\\n  height: 104px;\\n  /* 4 */\\n}\\n\\n.euiFilePicker-isInvalid:not(.euiFilePicker__showDrop) .euiFilePicker__input:not(:disabled):not(:focus) + .euiFilePicker__prompt {\\n  border-color: #BD271E;\\n}\\n\\n.euiFilePicker__promptText {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  line-height: 16px;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) .euiFilePicker__promptText {\\n  color: #0071c2;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__promptText {\\n  margin-top: -2px;\\n}\\n\\n.euiFilePicker__clearButton,\\n.euiFilePicker__loadingSpinner {\\n  position: absolute;\\n  right: 12px;\\n  top: 12px;\\n}\\n\\n.euiFilePicker--compressed .euiFilePicker__clearButton,\\n.euiFilePicker--compressed .euiFilePicker__loadingSpinner {\\n  top: 8px;\\n}\\n\\n/**\\n  * 1. Undo the pointer-events: none applied to the enclosing prompt.\\n  */\\n.euiFilePicker__clearButton {\\n  pointer-events: auto;\\n  /* 1 */\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton .euiFilePicker__clearIcon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 2px;\\n}\\n\\n.euiFilePicker--large .euiFilePicker__clearButton {\\n  position: relative;\\n  top: 0;\\n  right: 0;\\n}\\n\\n.euiFilePicker__showDrop .euiFilePicker__prompt,\\n.euiFilePicker__input:focus + .euiFilePicker__prompt {\\n  border-color: #07C;\\n}\\n\\n.euiFilePicker__input:disabled + .euiFilePicker__prompt {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  box-shadow: none;\\n}\\n\\n.euiFilePicker__input:disabled + .euiFilePicker__prompt::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFilePicker__input:disabled + .euiFilePicker__prompt:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFilePicker__input:disabled + .euiFilePicker__prompt::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFilePicker:not(.euiFilePicker--large).euiFilePicker-isLoading .euiFilePicker__prompt, .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-hasFiles .euiFilePicker__prompt {\\n  padding-right: 40px;\\n  /* 2 */\\n}\\n\\n.euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  color: #343741;\\n}\\n\\n.euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__promptText,\\n.euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\n\\n.euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__icon,\\n.euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\n\\n.euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\n\\n.euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\n\\n.euiFilePicker--large.euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  font-weight: 700;\\n}\\n\\n.euiForm__error {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  list-style: disc;\\n}\\n\\n.euiForm__errors {\\n  margin-bottom: 16px;\\n}\\n\\n/**\\n * 1. Ensure the descenders don't get cut off\\n */\\n.euiSelect {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\n\\n.euiSelect--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiSelect--compressed {\\n  height: 32px;\\n}\\n\\n.euiSelect--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiSelect {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiSelect::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSelect:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSelect::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSelect:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSelect:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiSelect:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiSelect--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiSelect--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiSelect--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSelect--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSelect--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSelect--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiSelect--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\n\\n.euiSelect--inGroup {\\n  line-height: 38px;\\n  /* 1 */\\n}\\n\\n.euiSelect--inGroup.euiSelect--compressed {\\n  line-height: 30px;\\n  /* 1 */\\n}\\n\\n.euiSelect::-ms-expand {\\n  display: none;\\n}\\n\\n.euiSelect:focus::-ms-value {\\n  color: #343741;\\n  background: transparent;\\n}\\n\\n.euiSelect:-moz-focusring {\\n  color: transparent;\\n  text-shadow: 0 0 0 #343741;\\n}\\n\\n.euiSuperSelect__listbox {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 300px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n}\\n\\n.euiSuperSelect__listbox::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiSuperSelect__listbox::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiSuperSelect__listbox::-webkit-scrollbar-corner, .euiSuperSelect__listbox::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiSuperSelect__item {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 8px;\\n}\\n\\n.euiSuperSelect__item:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\n\\n.euiSuperSelect__item:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiSuperSelect__item:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #ABB4C4;\\n}\\n\\n.euiSuperSelect__item--hasDividers:not(:last-of-type) {\\n  border-bottom: 1px solid #D3DAE6;\\n}\\n\\n/**\\n * 1. Ensure the descenders don't get cut off\\n * 2. Makes sure the height is correct when there's no selection\\n */\\n.euiSuperSelectControl {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  display: block;\\n  /* 2 */\\n  text-align: left;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\n\\n.euiSuperSelectControl--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiSuperSelectControl--compressed {\\n  height: 32px;\\n}\\n\\n.euiSuperSelectControl--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiSuperSelectControl {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiSuperSelectControl::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSuperSelectControl:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiSuperSelectControl:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiSuperSelectControl--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiSuperSelectControl--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiSuperSelectControl--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSuperSelectControl--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiSuperSelectControl--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiSuperSelectControl--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiSuperSelectControl-isInvalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiSuperSelectControl--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\n\\n.euiSuperSelectControl__placeholder {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n}\\n\\n.euiSuperSelectControl.euiSuperSelect--isOpen__button {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFormControlLayout {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n}\\n\\n.euiFormControlLayout--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFormControlLayout--compressed {\\n  height: 32px;\\n}\\n\\n.euiFormControlLayout--inGroup {\\n  height: 100%;\\n}\\n\\n.euiFormControlLayout--1icons {\\n  --eui-form-control-layout-icons-padding: 34px;\\n  padding-right: 34px;\\n}\\n\\n.euiFormControlLayout--1icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 26px;\\n  padding-right: 26px;\\n}\\n\\n.euiFormControlLayout--2icons {\\n  --eui-form-control-layout-icons-padding: 56px;\\n  padding-right: 56px;\\n}\\n\\n.euiFormControlLayout--2icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 44px;\\n  padding-right: 44px;\\n}\\n\\n.euiFormControlLayout--3icons {\\n  --eui-form-control-layout-icons-padding: 78px;\\n  padding-right: 78px;\\n}\\n\\n.euiFormControlLayout--3icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 62px;\\n  padding-right: 62px;\\n}\\n\\n.euiFormControlLayout--4icons {\\n  --eui-form-control-layout-icons-padding: 100px;\\n  padding-right: 100px;\\n}\\n\\n.euiFormControlLayout--4icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 80px;\\n  padding-right: 80px;\\n}\\n\\n.euiFormControlLayout--5icons {\\n  --eui-form-control-layout-icons-padding: 122px;\\n  padding-right: 122px;\\n}\\n\\n.euiFormControlLayout--5icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 98px;\\n  padding-right: 98px;\\n}\\n\\n.euiFormControlLayout__childrenWrapper {\\n  position: relative;\\n}\\n\\n/**\\n * 1. Account for inner box-shadow style border\\n * 2. Ensure truncation works in children elements\\n */\\n.euiFormControlLayout--group {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFormControlLayout--group {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFormControlLayout--group > *,\\n.euiFormControlLayout--group .euiButtonEmpty,\\n.euiFormControlLayout--group .euiText,\\n.euiFormControlLayout--group .euiFormLabel,\\n.euiFormControlLayout--group .euiButtonIcon {\\n  height: 100%;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper {\\n  flex-grow: 1;\\n  overflow: hidden;\\n  /* 2 */\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend,\\n.euiFormControlLayout--group .euiFormControlLayout__append {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  flex-shrink: 0;\\n  height: 100%;\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend.euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n  background-color: #e9edf3;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon, .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty {\\n  transform: none !important;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon .euiIcon, .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon .euiIcon,\\n.euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty .euiIcon {\\n  background: none !important;\\n  padding: 0;\\n  width: 16px;\\n}\\n\\n.euiFormControlLayout--group .euiButtonIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group .euiButtonIcon:not(:focus) {\\n  background-color: #e9edf3;\\n}\\n\\n.euiFormControlLayout--group .euiButtonIcon:focus-visible {\\n  outline: 2px solid #0071c2;\\n  outline-offset: -2px;\\n}\\n\\n.euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  height: 100%;\\n  background-color: #e9edf3;\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group > .euiFormControlLayout__prepend,\\n.euiFormControlLayout--group > .euiFormControlLayout__append {\\n  max-width: 50%;\\n}\\n\\n.euiFormControlLayout--group .euiFormLabel,\\n.euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  background-color: #e9edf3;\\n  padding: 12px;\\n  line-height: 16px !important;\\n  cursor: default !important;\\n}\\n\\n.euiFormControlLayout--group .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper):not(input),\\n.euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper):not(input) {\\n  margin-left: -12px;\\n}\\n\\n.euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\n.euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -12px;\\n}\\n\\n.euiFormControlLayout--group .euiButtonEmpty {\\n  border-right: none;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ .euiButtonEmpty,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ * .euiButtonEmpty {\\n  border-right: none;\\n  border-left: none;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n  overflow: hidden;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel,\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  padding: 8px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper),\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper) {\\n  margin-left: -8px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\n.euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -8px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--readOnly {\\n  cursor: default;\\n  background: #e9edf3;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px #e9edf3;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--readOnly input {\\n  background-color: #FFF;\\n}\\n\\n.euiFormControlLayoutDelimited {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFormControlLayoutDelimited {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFormControlLayoutDelimited > .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  width: 100%;\\n  background-color: #fbfcfd;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper, .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper > *:not(.euiFormControlLayoutDelimited__delimiter):not(.euiFormControlLayoutIcons) {\\n  width: 100%;\\n  max-width: none;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled] {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled]::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled]:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled]::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=-isDisabled] .euiFormControlLayout__childrenWrapper {\\n  background-color: #eef2f7;\\n}\\n\\n.euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] .euiFormControlLayout__childrenWrapper {\\n  background-color: #FFF;\\n}\\n\\n.euiFormControlLayoutDelimited--isInvalid .euiFormControlLayout__childrenWrapper {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiFormControlLayoutDelimited__input {\\n  box-shadow: none !important;\\n  border-radius: 0 !important;\\n  text-align: center;\\n  height: 100%;\\n  min-width: 0;\\n}\\n\\n.euiFormControlLayoutDelimited__delimiter {\\n  align-self: stretch;\\n  flex-grow: 0;\\n  display: flex;\\n  align-items: center;\\n  line-height: 1;\\n}\\n\\n.euiFormControlLayoutIcons {\\n  pointer-events: none;\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiFormControlLayoutIcons > * + * {\\n  margin-left: 6px;\\n}\\n\\n.euiFormControlLayoutIcons--absolute {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 12px;\\n}\\n\\n.euiFormControlLayout--compressed .euiFormControlLayoutIcons--absolute {\\n  left: 8px;\\n}\\n\\n.euiFormControlLayoutIcons--static {\\n  position: static;\\n  height: 100%;\\n  align-self: stretch;\\n  flex-grow: 0;\\n  padding-inline: 12px;\\n}\\n\\n.euiFormControlLayout--compressed .euiFormControlLayoutIcons--static {\\n  padding-inline: 8px;\\n}\\n\\n.euiFormControlLayoutIcons--left {\\n  z-index: 1;\\n}\\n\\n.euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 12px;\\n}\\n\\n.euiFormControlLayout--compressed .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 8px;\\n}\\n\\n*:disabled + .euiFormControlLayoutIcons {\\n  cursor: not-allowed;\\n  color: #98A2B3;\\n}\\n\\n.euiFormControlLayoutClearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\n\\n.euiFormControlLayoutClearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiFormControlLayoutClearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFormControlLayoutClearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFormControlLayoutClearButton .euiFormControlLayoutClearButton__icon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 2px;\\n}\\n\\n.euiFormControlLayoutClearButton--small {\\n  width: 12px;\\n  height: 12px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 12px;\\n  line-height: 0;\\n}\\n\\n.euiFormControlLayoutClearButton--small:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiFormControlLayoutClearButton--small:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFormControlLayoutClearButton--small:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFormControlLayoutClearButton--small .euiFormControlLayoutClearButton__icon {\\n  width: 6px;\\n  height: 6px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 4px;\\n}\\n\\n.euiFormControlLayoutCustomIcon {\\n  pointer-events: none;\\n  font-size: 0;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable .euiFormControlLayoutCustomIcon__icon {\\n  vertical-align: baseline;\\n  transform: none;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable:focus {\\n  outline: 2px solid currentColor;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFormControlLayoutCustomIcon--clickable:disabled {\\n  cursor: not-allowed;\\n  color: #98A2B3;\\n}\\n\\n.euiFormErrorText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #BD271E;\\n}\\n\\n.euiFormLegend {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-weight: 600;\\n}\\n\\n.euiFormLegend:not(.euiFormLegend-isHidden) {\\n  margin-bottom: 8px;\\n}\\n\\n.euiFormLegend:not(.euiFormLegend-isHidden).euiFormLegend--compressed {\\n  margin-bottom: 4px;\\n}\\n\\n.euiFormHelpText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #69707D;\\n}\\n\\n/**\\n * 1. Focused state overrides invalid state.\\n * 2. Disabled state overrides pointer.\\n */\\n.euiFormLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-weight: 600;\\n  display: inline-block;\\n  transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\n\\n.euiFormLabel.euiFormLabel-isInvalid {\\n  color: #BD271E;\\n  /* 1 */\\n}\\n\\n.euiFormLabel.euiFormLabel-isFocused {\\n  color: #07C;\\n  /* 1 */\\n}\\n\\n.euiFormLabel[for] {\\n  cursor: pointer;\\n  /* 2 */\\n}\\n\\n.euiFormLabel[for].euiFormLabel-isDisabled {\\n  cursor: default;\\n  /* 2 */\\n}\\n\\n/**\\n * 1. Coerce inline form elements to behave as block-level elements.\\n * 2. For inline forms, we need to add margin if the label doesn't exist.\\n */\\n.euiFormRow {\\n  display: flex;\\n  /* 1 */\\n  flex-direction: column;\\n  /* 1 */\\n  max-width: 400px;\\n}\\n\\n.euiFormRow + .euiFormRow,\\n.euiFormRow + .euiButton {\\n  margin-top: 16px;\\n}\\n\\n.euiFormRow--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiFormRow--hasEmptyLabelSpace {\\n  margin-top: 20px;\\n  /* 2 */\\n  min-height: 40px;\\n  padding-bottom: 0;\\n  justify-content: center;\\n}\\n\\n.euiFormRow__labelWrapper {\\n  display: flex;\\n  flex-wrap: wrap;\\n  justify-content: space-between;\\n  margin-bottom: 4px;\\n}\\n\\n.euiFormRow--horizontal {\\n  flex-direction: row;\\n  align-items: stretch;\\n}\\n\\n.euiFormRow--horizontal .euiFormRow__label {\\n  -webkit-hyphens: auto;\\n  -ms-hyphens: auto;\\n      hyphens: auto;\\n}\\n\\n.euiFormRow--horizontal .euiFormRow__labelWrapper {\\n  display: block;\\n  line-height: 31px;\\n  width: calc(33% - 8px);\\n  margin-right: 8px;\\n  margin-bottom: 0;\\n}\\n\\n.euiFormRow--horizontal .euiFormRow__fieldWrapper {\\n  width: 67%;\\n}\\n\\n.euiFormRow--horizontal + .euiFormRow--horizontal {\\n  margin-top: 8px;\\n}\\n\\n.euiFormRow--horizontal + .euiFormRow--horizontal.euiFormRow--hasSwitch {\\n  margin-top: 12px;\\n}\\n\\n.euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__labelWrapper {\\n  line-height: 19px;\\n  width: auto;\\n  min-width: calc(33% - 8px);\\n}\\n\\n.euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper {\\n  width: auto;\\n}\\n\\n.euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper .euiSwitch--compressed {\\n  margin-top: 2px;\\n}\\n\\n.euiFormRow--horizontal.euiFormRow--hasSwitch + .euiFormRow--horizontal {\\n  margin-top: 12px;\\n}\\n\\n.euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 40px;\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiFormRow--compressed.euiFormRow--hasEmptyLabelSpace {\\n  min-height: 32px;\\n}\\n\\n.euiFormRow--compressed .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 32px;\\n}\\n\\n/**\\n  * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n  *    they actually click this input.\\n  */\\n.euiRadio {\\n  position: relative;\\n}\\n\\n.euiRadio .euiRadio__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\n\\n.euiRadio .euiRadio__input ~ .euiRadio__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\n\\n.euiRadio .euiRadio__input + .euiRadio__circle {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\n\\n.euiRadio .euiRadio__input:checked + .euiRadio__circle {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%28255, 255, 255%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiRadio .euiRadio__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\n\\n.euiRadio .euiRadio__input[disabled] ~ .euiRadio__label {\\n  color: #98A2B3;\\n  cursor: not-allowed !important;\\n}\\n\\n.euiRadio .euiRadio__input[disabled] + .euiRadio__circle {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n}\\n\\n.euiRadio .euiRadio__input:checked[disabled] + .euiRadio__circle {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%2894, 100, 111%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\n\\n.euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\n\\n.euiRadio .euiRadio__input:focus + .euiRadio__circle:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiRadio .euiRadio__input:focus + .euiRadio__circle:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiRadio.euiRadio--inList, .euiRadio.euiRadio--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\n\\n.euiRadio.euiRadio--inList .euiRadio__input,\\n.euiRadio.euiRadio--inList .euiRadio__circle, .euiRadio.euiRadio--noLabel .euiRadio__input,\\n.euiRadio.euiRadio--noLabel .euiRadio__circle {\\n  top: 0;\\n}\\n\\n.euiRadio.euiRadio--inList .euiRadio__input, .euiRadio.euiRadio--noLabel .euiRadio__input {\\n  margin: 0;\\n}\\n\\n.euiRadioGroup__item + .euiRadioGroup__item {\\n  margin-top: 4px;\\n}\\n\\n.euiRadioGroup__item + .euiRadioGroup__item.euiRadio--compressed {\\n  margin-top: 0;\\n}\\n\\n.euiSwitch {\\n  position: relative;\\n  display: inline-flex;\\n  align-items: flex-start;\\n  min-height: 20px;\\n}\\n\\n.euiSwitch .euiSwitch__label {\\n  cursor: pointer;\\n  padding-left: 8px;\\n  line-height: 20px;\\n  font-size: 14px;\\n  vertical-align: middle;\\n  display: inline-block;\\n}\\n\\n.euiSwitch .euiSwitch__button {\\n  flex-shrink: 0;\\n  line-height: 0;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus .euiSwitch__track:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus .euiSwitch__track:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__body {\\n  background-color: rgba(105, 112, 125, 0.75);\\n}\\n\\n.euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 0;\\n}\\n\\n.euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon {\\n  right: -8px;\\n}\\n\\n.euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon.euiSwitch__icon--checked {\\n  right: auto;\\n  left: -34px;\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled:hover,\\n.euiSwitch .euiSwitch__button:disabled ~ .euiSwitch__label:hover {\\n  cursor: not-allowed;\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled .euiSwitch__body {\\n  background-color: rgba(211, 218, 230, 0.5);\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled .euiSwitch__thumb {\\n  background-color: rgba(0, 0, 0, 0);\\n  border-color: rgba(105, 112, 125, 0.5);\\n  box-shadow: none;\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled .euiSwitch__icon {\\n  fill: #69707D;\\n}\\n\\n.euiSwitch .euiSwitch__button:disabled + .euiSwitch__label {\\n  color: #98A2B3;\\n}\\n\\n.euiSwitch .euiSwitch__body {\\n  pointer-events: none;\\n  width: 44px;\\n  height: 20px;\\n  background-color: #07C;\\n  display: inline-block;\\n  position: relative;\\n  border-radius: 20px;\\n  vertical-align: middle;\\n}\\n\\n.euiSwitch .euiSwitch__thumb {\\n  padding: 9px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 18px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  position: absolute;\\n  display: inline-block;\\n  left: 24px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\n\\n.euiSwitch .euiSwitch__track {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  overflow: hidden;\\n  border-radius: 20px;\\n}\\n\\n.euiSwitch .euiSwitch__icon {\\n  position: absolute;\\n  right: -34px;\\n  top: 2px;\\n  bottom: 0;\\n  width: 42px;\\n  height: 16px;\\n  transition: left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), right 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  fill: #FFF;\\n}\\n\\n.euiSwitch .euiSwitch__icon--checked {\\n  right: auto;\\n  left: -8px;\\n  fill: #FFF;\\n}\\n\\n.euiSwitch:hover .euiSwitch__button:not(:disabled) .euiSwitch__thumb {\\n  transform: scale(1.05);\\n}\\n\\n.euiSwitch:hover .euiSwitch__button:active .euiSwitch__thumb {\\n  transform: scale(0.95);\\n}\\n\\n.euiSwitch.euiSwitch--compressed {\\n  min-height: 16px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__label {\\n  line-height: 16px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__body {\\n  width: 28px;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__thumb {\\n  padding: 6px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 12px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__track {\\n  border-radius: 16px;\\n}\\n\\n.euiSwitch.euiSwitch--mini {\\n  min-height: 10px;\\n}\\n\\n.euiSwitch.euiSwitch--mini .euiSwitch__label {\\n  line-height: 10px;\\n  font-size: 12px;\\n}\\n\\n.euiSwitch.euiSwitch--mini .euiSwitch__body {\\n  width: 22px;\\n  height: 10px;\\n  border-radius: 10px;\\n}\\n\\n.euiSwitch.euiSwitch--mini .euiSwitch__thumb {\\n  padding: 3px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 6px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\n\\n.euiSwitch.euiSwitch--mini .euiSwitch__track {\\n  border-radius: 10px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb, .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 1px;\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\n.euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb, .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\n.euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb {\\n  border-color: rgba(105, 112, 125, 0.5);\\n}\\n\\n.euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true] .euiSwitch__thumb, .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true] .euiSwitch__thumb {\\n  border-color: #07C;\\n}\\n\\n.euiTextArea {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  line-height: 1.5;\\n}\\n\\n.euiTextArea--fullWidth {\\n  max-width: 100%;\\n}\\n\\n.euiTextArea--compressed {\\n  height: 32px;\\n}\\n\\n.euiTextArea--inGroup {\\n  height: 100%;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiTextArea {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n\\n.euiTextArea::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiTextArea:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiTextArea::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiTextArea:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiTextArea:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\n\\n.euiTextArea:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\n\\n.euiTextArea--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n\\n@supports (-moz-appearance: none) {\\n  .euiTextArea--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\n.euiTextArea--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\n\\n.euiTextArea--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\n\\n.euiTextArea--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\n\\n.euiTextArea--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\n\\n.euiTextArea, .euiTextArea--compressed {\\n  height: auto;\\n}\\n\\n.euiFormControlLayout--euiTextArea {\\n  height: auto;\\n}\\n\\n.euiFormControlLayout--euiTextArea .euiFormControlLayoutIcons {\\n  top: auto;\\n  bottom: 12px;\\n}\\n\\n.euiTextArea--resizeVertical {\\n  resize: vertical;\\n}\\n\\n.euiTextArea--resizeHorizontal {\\n  resize: horizontal;\\n}\\n\\n.euiTextArea--resizeBoth {\\n  resize: both;\\n}\\n\\n.euiTextArea--resizeNone {\\n  resize: none;\\n}\\n\\n.euiMarkdownEditor {\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.euiMarkdownEditor--isPreviewing .euiMarkdownEditor__toggleContainer {\\n  display: none;\\n}\\n\\n.euiMarkdownEditor--fullHeight {\\n  height: 100%;\\n}\\n\\n.euiMarkdownEditor--fullHeight .euiMarkdownEditorTextArea {\\n  resize: none;\\n}\\n\\n.euiMarkdownEditor--fullHeight .euiMarkdownEditorDropZone {\\n  height: 100%;\\n}\\n\\n.euiMarkdownEditorDropZone {\\n  display: flex;\\n  position: relative;\\n  flex-direction: column;\\n  min-height: \\\"150px\\\";\\n}\\n\\n.euiMarkdownEditorDropZone__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\n\\n.euiMarkdownEditorDropZone__input:hover {\\n  cursor: pointer;\\n}\\n\\n.euiMarkdownEditorDropZone__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\n\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorFooter,\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus,\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(0, 119, 204, 0.1) !important;\\n}\\n\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\n.euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%) !important;\\n}\\n\\n.euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorFooter,\\n.euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea,\\n.euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea:focus,\\n.euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(189, 39, 30, 0.1) !important;\\n}\\n\\n.euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea,\\n.euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%) !important;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__blockquote {\\n  border-left-color: rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiHorizontalRule {\\n  background-color: rgba(0, 0, 0, 0.15);\\n  color: rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table {\\n  border-left: 1px solid rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td {\\n  border-top: 1px solid rgba(0, 0, 0, 0.15);\\n  border-bottom: 1px solid rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid rgba(0, 0, 0, 0.15);\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__blockquote {\\n  border-left-color: #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiHorizontalRule {\\n  background-color: #69707D;\\n  color: #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table {\\n  border-left: 1px solid #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #69707D;\\n  border-bottom: 1px solid #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #69707D;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__blockquote {\\n  border-left-color: #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiHorizontalRule {\\n  background-color: #00BFB3;\\n  color: #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table {\\n  border-left: 1px solid #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #00BFB3;\\n  border-bottom: 1px solid #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #00BFB3;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiHorizontalRule {\\n  background-color: #F04E98;\\n  color: #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F04E98;\\n  border-bottom: 1px solid #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F04E98;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiHorizontalRule {\\n  background-color: #FEC514;\\n  color: #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FEC514;\\n  border-bottom: 1px solid #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FEC514;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__blockquote {\\n  border-left-color: #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiHorizontalRule {\\n  background-color: #BD271E;\\n  color: #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table {\\n  border-left: 1px solid #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #BD271E;\\n  border-bottom: 1px solid #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #BD271E;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiHorizontalRule {\\n  background-color: #FFF;\\n  color: #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FFF;\\n  border-bottom: 1px solid #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FFF;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th,\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th:last-child,\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\n\\n.euiMarkdownFormat .euiCheckbox {\\n  margin-bottom: 0 !important;\\n}\\n\\n.euiMarkdownFormat .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  top: 50%;\\n  transform: translateY(-50%);\\n}\\n\\n.euiMarkdownFormat .euiMarkdownFormat__table {\\n  display: block;\\n  width: 100%;\\n  overflow: auto;\\n  border-spacing: 0;\\n  border-collapse: collapse;\\n}\\n\\n.euiMarkdownEditorFooter {\\n  display: inline-flex;\\n  padding: 4px;\\n  border: 1px solid #D3DAE6;\\n  align-items: center;\\n  background: #fafbfd;\\n}\\n\\n.euiMarkdownEditorFooter__popover {\\n  width: 300px;\\n}\\n\\n.euiMarkdownEditorFooter__actions {\\n  flex: 1;\\n  display: inline-flex;\\n}\\n\\n.euiMarkdownEditorFooter__actions > button,\\n.euiMarkdownEditorFooter__actions > span {\\n  margin-right: 4px;\\n  align-self: center;\\n}\\n\\n.euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError {\\n  position: relative;\\n  left: -1px;\\n  line-height: 1;\\n  border-radius: 6px;\\n}\\n\\n.euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError > span {\\n  padding: 0 4px;\\n}\\n\\n.euiMarkdownEditorFooter__helpButton > svg {\\n  width: 26px;\\n}\\n\\n.euiMarkdownEditorPreview {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background: #FFF;\\n  min-height: \\\"150px\\\";\\n  overflow-y: auto;\\n  border: 1px solid #D3DAE6;\\n  padding: 12px;\\n}\\n\\n.euiMarkdownEditorPreview::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiMarkdownEditorPreview::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiMarkdownEditorPreview::-webkit-scrollbar-corner, .euiMarkdownEditorPreview::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input ~ .euiCheckbox__label {\\n  cursor: default;\\n}\\n\\n.euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input:focus:not(:checked) + .euiCheckbox__square {\\n  border-color: #939496;\\n}\\n\\n.euiMarkdownEditorTextArea {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  width: 100%;\\n  height: 100%;\\n  min-height: \\\"150px\\\";\\n  padding: 12px;\\n  border: 1px solid #D3DAE6;\\n  border-bottom: none;\\n  line-height: 1.5;\\n  resize: vertical;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  margin: 0;\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n}\\n\\n.euiMarkdownEditorTextArea::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiMarkdownEditorTextArea:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiMarkdownEditorTextArea::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n\\n.euiMarkdownEditorTextArea::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiMarkdownEditorTextArea::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiMarkdownEditorTextArea::-webkit-scrollbar-corner, .euiMarkdownEditorTextArea::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiMarkdownEditorTextArea:focus, .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n}\\n\\n.euiMarkdownEditorTextArea-isReadOnly {\\n  background: #FFF;\\n  cursor: unset;\\n}\\n\\n.euiMarkdownEditorTextArea-isReadOnly:focus, .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea-isReadOnly {\\n  background: none;\\n}\\n\\n.euiMarkdownEditorToolbar {\\n  display: flex;\\n  flex-wrap: wrap;\\n  background: #F5F7FA;\\n  border: 1px solid #D3DAE6;\\n  border-color: #D3DAE6;\\n  border-bottom: none;\\n  padding: 4px;\\n}\\n\\n.euiMarkdownEditorToolbar__buttons {\\n  display: flex;\\n  flex-wrap: wrap;\\n  flex: 1;\\n  align-items: center;\\n}\\n\\n.euiMarkdownEditorToolbar__buttons > * {\\n  margin-right: 4px;\\n}\\n\\n.euiMarkdownEditorToolbar__divider {\\n  content: \\\"\\\";\\n  height: 24px;\\n  display: block;\\n  margin-left: 4px;\\n  padding-right: 4px;\\n  border-left: 1px solid #D3DAE6;\\n}\\n\\n.euiMarkdownTooltip__icon {\\n  transform: translateY(-1px);\\n}\\n\\n.euiSelectable {\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.euiSelectable-fullHeight {\\n  height: 100%;\\n}\\n\\n.euiSelectableList:has(:focus-visible) {\\n  outline: 2px solid currentColor;\\n  outline-style: auto;\\n  outline-offset: 1px;\\n}\\n\\n.euiSelectableList-fullHeight {\\n  flex-grow: 1;\\n}\\n\\n.euiSelectableList-bordered {\\n  overflow: hidden;\\n  border: 1px solid #D3DAE6;\\n  border-radius: 6px;\\n}\\n\\n.euiSelectableList__list {\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\n\\n.euiSelectableList__list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\n\\n.euiSelectableList__list::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\n\\n.euiSelectableList__list::-webkit-scrollbar-corner, .euiSelectableList__list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\n\\n.euiSelectableList__list:focus, .euiSelectableList__list > ul:focus {\\n  outline: none;\\n}\\n\\n.euiSelectableList__groupLabel {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 700;\\n  display: flex;\\n  align-items: center;\\n  border-bottom: 1px solid #eef2f7;\\n  padding: 4px 12px;\\n}\\n\\n.euiSelectableListItem {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  display: inline-flex;\\n  width: 100%;\\n  text-align: left;\\n  cursor: pointer;\\n  overflow: hidden;\\n}\\n\\n.euiSelectableListItem:not(:last-of-type) {\\n  border-bottom: 1px solid #eef2f7;\\n}\\n\\n.euiSelectableListItem-isFocused:not([aria-disabled=true]), .euiSelectableListItem:hover:not([aria-disabled=true]) {\\n  color: #0071c2;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiSelectableListItem-isFocused:not([aria-disabled=true]) .euiSelectableListItem__text, .euiSelectableListItem:hover:not([aria-disabled=true]) .euiSelectableListItem__text {\\n  text-decoration: underline;\\n}\\n\\n.euiSelectableListItem[aria-disabled=true] {\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\n\\n.euiSelectableListItem--paddingSmall .euiSelectableListItem__content {\\n  padding: 4px 12px;\\n}\\n\\n.euiSelectableListItem__content {\\n  width: 100%;\\n  display: flex;\\n  align-items: center;\\n}\\n\\n.euiSelectableListItem__icon,\\n.euiSelectableListItem__prepend {\\n  margin-right: 12px;\\n  flex-shrink: 0;\\n}\\n\\n.euiSelectableListItem__append {\\n  margin-left: 12px;\\n  flex-shrink: 0;\\n}\\n\\n.euiSelectableListItem__text {\\n  flex-grow: 1;\\n}\\n\\n.euiSelectableListItem__text--truncate {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n/**\\n  * 1. Prevent really long input from overflowing the container.\\n  */\\n.euiSelectableMessage {\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n  /* 1 */\\n  display: flex;\\n  flex-direction: column;\\n  justify-content: center;\\n  align-items: center;\\n}\\n\\n.euiSelectableMessage--bordered {\\n  overflow: hidden;\\n  border: 1px solid #D3DAE6;\\n  border-radius: 6px;\\n}\\n\\n.euiSelectableTemplateSitewide__listItem .euiSelectableListItem__text {\\n  text-decoration: none !important;\\n}\\n\\n.euiSelectableTemplateSitewide__listItem[class*=-isFocused]:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle, .euiSelectableTemplateSitewide__listItem:hover:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle {\\n  text-decoration: underline;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMetasList {\\n  display: block;\\n  margin-top: 4px;\\n  font-size: 12px;\\n  color: #69707D;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta:not(:last-of-type)::after {\\n  content: \\\"•\\\";\\n  margin: 0 4px;\\n  color: #69707D;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--application {\\n  color: #4a7194;\\n  font-weight: 500;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--deployment {\\n  color: #387765;\\n  font-weight: 500;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--article {\\n  color: #7c609e;\\n  font-weight: 500;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--case {\\n  color: #aa4b38;\\n  font-weight: 500;\\n}\\n\\n.euiSelectableTemplateSitewide__optionMeta--platform {\\n  color: #7a6c31;\\n  font-weight: 500;\\n}\\n\\n.euiTable {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-feature-settings: \\\"calt\\\" 1, \\\"kern\\\" 1, \\\"liga\\\" 1, \\\"tnum\\\" 1;\\n  width: 100%;\\n  table-layout: fixed;\\n  border: none;\\n  border-collapse: collapse;\\n  background-color: #FFF;\\n}\\n\\n.euiTable.euiTable--auto {\\n  table-layout: auto;\\n}\\n\\n.euiTableCaption {\\n  position: relative;\\n}\\n\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n.euiTableFooterCell,\\n.euiTableHeaderCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  font-weight: 500;\\n  border: none;\\n}\\n\\n.euiTableFooterCell .euiTableHeaderButton,\\n.euiTableHeaderCell .euiTableHeaderButton {\\n  text-align: left;\\n  font-weight: 500;\\n}\\n\\n.euiTableFooterCell .euiTableCellContent__text,\\n.euiTableHeaderCell .euiTableCellContent__text {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 600;\\n}\\n\\n.euiTableHeaderButton {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  color: inherit;\\n  width: 100%;\\n}\\n\\n.euiTableHeaderButton:hover .euiTableCellContent__text, .euiTableHeaderButton:focus .euiTableCellContent__text {\\n  text-decoration: underline;\\n  color: #07C;\\n}\\n\\n.euiTableHeaderButton:hover .euiTableSortIcon, .euiTableHeaderButton:focus .euiTableSortIcon {\\n  fill: #07C;\\n}\\n\\n.euiTableSortIcon {\\n  margin-left: 4px;\\n  flex-shrink: 0;\\n}\\n\\n.euiTableHeaderButton-isSorted .euiTableSortIcon {\\n  fill: #1a1c21;\\n}\\n\\n.euiTableHeaderCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n  border: none;\\n}\\n\\n.euiTableRow:hover {\\n  background-color: #fafbfd;\\n}\\n\\n.euiTableRow.euiTableRow-isClickable:hover {\\n  background-color: rgba(0, 119, 204, 0.05);\\n  cursor: pointer;\\n}\\n\\n.euiTableRow.euiTableRow-isClickable:focus {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiTableRow.euiTableRow-isExpandedRow {\\n  background-color: #fafbfd;\\n}\\n\\n.euiTableRow.euiTableRow-isExpandedRow.euiTableRow-isSelectable .euiTableCellContent {\\n  padding-left: 40px;\\n}\\n\\n.euiTableRow.euiTableRow-isSelected {\\n  background-color: rgba(227, 240, 249, 0.37);\\n}\\n\\n.euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(227, 240, 249, 0.37);\\n}\\n\\n.euiTableRow.euiTableRow-isSelected:hover, .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\n\\n.euiTableRowCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  color: #343741;\\n}\\n\\n.euiTableRowCell--top {\\n  vertical-align: top;\\n}\\n\\n.euiTableRowCell--bottom {\\n  vertical-align: bottom;\\n}\\n\\n.euiTableRowCell--baseline {\\n  vertical-align: baseline;\\n}\\n\\n.euiTableRowCell.euiTableRowCell--isMobileHeader {\\n  display: none;\\n}\\n\\n.euiTableRowCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n}\\n\\n.euiTableFooterCell {\\n  background-color: #F5F7FA;\\n}\\n\\n/**\\n * 1. Vertically align all children.\\n * 2. The padding on this div allows the ellipsis to show if the content is truncated. If\\n *    the padding was on the cell, the ellipsis would be cropped.\\n * 4. Prevent very long single words (e.g. the name of a field in a document) from overflowing\\n *    the cell.\\n */\\n.euiTableCellContent {\\n  overflow: hidden;\\n  /* 4 */\\n  display: flex;\\n  align-items: center;\\n  /* 1 */\\n  padding: 8px;\\n  /* 2 */\\n}\\n\\n.euiTableCellContent__text {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 4 */\\n  min-width: 0;\\n  text-overflow: ellipsis;\\n}\\n\\n.euiTableCellContent--alignRight {\\n  justify-content: flex-end;\\n  text-align: right;\\n}\\n\\n.euiTableCellContent--alignCenter {\\n  justify-content: center;\\n  text-align: center;\\n}\\n\\n.euiTableHeaderCell,\\n.euiTableFooterCell,\\n.euiTableCellContent--truncateText {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\n\\n.euiTableHeaderCell .euiTableCellContent__text,\\n.euiTableFooterCell .euiTableCellContent__text,\\n.euiTableCellContent--truncateText .euiTableCellContent__text {\\n  overflow: hidden;\\n}\\n\\n.euiTableCellContent--overflowingContent {\\n  overflow: visible;\\n  white-space: normal;\\n  word-break: break-word;\\n}\\n\\n.euiTableCellContent--showOnHover > *:not(:first-child) {\\n  margin-left: 8px;\\n}\\n\\n.euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n  flex-shrink: 0;\\n  opacity: 0.7;\\n  filter: grayscale(100%);\\n  transition: opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1), filter 250ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\n\\n.euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n  filter: grayscale(0%);\\n  opacity: 0;\\n}\\n\\n.euiTableRow-hasActions:hover .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem,\\n.euiTableRow-hasActions .euiTableCellContent--showOnHover:focus-within .euiTableCellContent__hoverItem {\\n  opacity: 1;\\n  filter: grayscale(0%);\\n}\\n\\n.euiTableRow-isExpandedRow .euiTableCellContent {\\n  -webkit-animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n  animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n}\\n\\n@-webkit-keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\n@keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\n.euiTableRowCell__mobileHeader {\\n  display: none;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (max-width: 574px) {\\n  .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #69707D;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n\\n  .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #D3DAE6;\\n    box-shadow: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #fafbfd;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #feedf5;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #e6f1fa;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #e6f9f7;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #fff9e8;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #f8e9e9;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    background-color: #FFF;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(152, 162, 179, 0.1);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\n.euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(227, 240, 249, 0.37);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #69707D;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n\\n  .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #D3DAE6;\\n    box-shadow: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #fafbfd;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #feedf5;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #e6f1fa;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #e6f9f7;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #fff9e8;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #f8e9e9;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    background-color: #FFF;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(152, 162, 179, 0.1);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\n.euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(227, 240, 249, 0.37);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #FFF;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n\\n  .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\n.euiTableHeaderMobile,\\n.euiTableHeaderCell--hideForDesktop {\\n  display: none;\\n}\\n\\n@media only screen and (max-width: 574px) {\\n  .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n\\n  .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n\\n  .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\n.euiComboBox--appended .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 6px;\\n  border-bottom-left-radius: 6px;\\n}\\n\\n.euiComboBox--appended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n}\\n\\n.euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\n\\n.euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\n\\n.euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 6px;\\n  border-bottom-right-radius: 6px;\\n}\\n\\n.euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 4px;\\n  border-bottom-right-radius: 4px;\\n}\\n\\n.euiDataGrid--fontSizeLarge .euiDataGridRowCell {\\n  font-size: 16px;\\n  font-size: 1.1428571429rem;\\n  line-height: 1.7142857143rem;\\n}\\n\\n.euiFormControlLayout--group {\\n  border-radius: 6px;\\n  background-color: #e9edf3;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend:first-child {\\n  border-radius: 5px 0 0 5px;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__append:last-child {\\n  border-radius: 0 5px 5px 0;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 5px 5px 0;\\n}\\n\\n.euiFormControlLayout--group [class*=euiButton]:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: -2px;\\n}\\n\\n.euiFormControlLayout--group [class*=euiButton]:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiFormControlLayout--group [class*=euiButton]:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 5px 5px 0;\\n}\\n\\n.euiFormControlLayout--group .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\n\\n.euiFormControlLayout--group .euiToolTipAnchor:last-child [class*=euiButton],\\n.euiFormControlLayout--group .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 5px 5px 0;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSuperSelectControl,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 6px 0 0 6px;\\n}\\n\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSuperSelectControl,\\n.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 6px 6px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  border-radius: 4px;\\n  background-color: #e9edf3;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed.euiFormControlLayout--readOnly input {\\n  background-color: #FFF;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child {\\n  border-radius: 3px 0 0 3px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 4px 0 0 4px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 3px 0 0 3px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child [class*=euiButton],\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 3px 0 0 3px;\\n}\\n\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\n.euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 3px 3px 0;\\n}\\n\\n.euiFormControlLayoutDelimited {\\n  border-radius: 6px;\\n}\\n\\n.euiFormControlLayoutDelimited.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 6px 0 0 6px;\\n}\\n\\n.euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 6px;\\n  overflow: hidden;\\n}\\n\\n.euiFormControlLayoutDelimited .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\n\\n.euiFormControlLayoutDelimited.euiFormControlLayout--compressed.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 4px 0 0 4px;\\n}\\n\\n.euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 4px;\\n  overflow: hidden;\\n}\\n\\n.euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 4px 4px 0;\\n}\\n\\n.euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\n\\n.euiRadio .euiRadio__input:focus:focus-visible + .euiRadio__circle {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\n\\n.euiRadio .euiRadio__input:focus:not(:focus-visible) + .euiRadio__circle {\\n  outline: none;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus:focus-visible + .euiCheckbox__square {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\n\\n.euiCheckbox .euiCheckbox__input:focus:not(:focus-visible) + .euiCheckbox__square {\\n  outline: none;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus:focus-visible {\\n  outline-style: auto;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus:not(:focus-visible) {\\n  outline: none;\\n}\\n\\n.euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: none;\\n}\\n\\n.euiHue {\\n  position: relative;\\n  height: 12px;\\n  border-radius: 12px;\\n  margin: 8px 0;\\n}\\n\\n.euiHue::before, .euiHue::after {\\n  display: none;\\n}\\n\\n.euiHue__range {\\n  top: -6px;\\n}\\n\\n.euiHue__range::-webkit-slider-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\n\\n.euiHue__range::-moz-range-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\n\\n.euiHue__range::-ms-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\n\\n.euiHue__range:focus {\\n  outline: none;\\n}\\n\\n.euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\n\\n.euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\n\\n.euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\n\\n.euiHue__range:focus:not(:focus-visible)::-webkit-slider-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\n\\n.euiHue__range:focus:not(:focus-visible)::-moz-range-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\n\\n.euiHue__range:focus:not(:focus-visible)::-ms-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\n\\n.euiHue__range:focus:focus-visible {\\n  outline: none;\\n}\\n\\n.euiMarkdownEditorToolbar {\\n  border-radius: 6px 6px 0 0;\\n}\\n\\n.euiMarkdownEditorTextArea:focus {\\n  outline: none;\\n}\\n\\n.euiMarkdownEditorTextArea:focus:focus-visible {\\n  outline-style: none;\\n}\\n\\n.euiMarkdownEditorPreview,\\n.euiMarkdownEditorFooter {\\n  border-radius: 0 0 6px 6px;\\n}\\n\\n/* atkinson-hyperlegible-regular - latin */\\n@font-face {\\n  font-family: \\\"Atkinson Hyperlegible\\\";\\n  font-style: normal;\\n  font-weight: 400;\\n  src: local(\\\"\\\"), url(\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \") format(\\\"woff2\\\"), url(\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \") format(\\\"woff\\\");\\n  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\\n}\\n/* atkinson-hyperlegible-700 - latin */\\n@font-face {\\n  font-family: \\\"Atkinson Hyperlegible\\\";\\n  font-style: normal;\\n  font-weight: 700;\\n  src: local(\\\"\\\"), url(\" + ___CSS_LOADER_URL_REPLACEMENT_2___ + \") format(\\\"woff2\\\"), url(\" + ___CSS_LOADER_URL_REPLACEMENT_3___ + \") format(\\\"woff\\\");\\n  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\\n}\\nhtml {\\n  font-size: 14px !important;\\n}\\nhtml.light-theme {\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n   * LEGEND\\n   * __day-name : Week headers like Su, Mo, etc\\n   * __day : Number on the calendar\\n   *       --highlighted\\n   *       --disabled :               _this.isDisabled(),\\n   *       --selected :               _this.isSameDay(_this.props.selected),\\n      *       --range-start :            _this.isRangeStart(),\\n      *       --range-end :              _this.isRangeEnd(),\\n   *       --keyboard-selected :      _this.isKeyboardSelected(),\\n   *       --in-range :               _this.isInRange(),\\n      *       --in-selecting-range :     _this.isInSelectingRange(),\\n      *       --selecting-range-start :  _this.isSelectingRangeStart(),\\n      *       --selecting-range-end :    _this.isSelectingRangeEnd(),\\n   *       --today :                  _this.isSameDay(now(_this.props.utcOffset)),\\n   *       --weekend :                _this.isWeekend(),\\n   *       --outside-month :          _this.isOutsideMonth()\\n   */\\n  /**\\n   * LEGEND\\n   * __time-list-item :\\n   *       --preselected : closest current time but not selected (also applied when using arrow keys to indicate focus)\\n   *       --selected\\n   *       --disabled\\n   *       --injected\\n   */\\n  /**\\n   * LEGEND\\n   * __header__dropdown : Contains the month and year, but affords for the navigational arrows\\n\\n   *   __month-dropdown-container: Contains both static/selected control and the dropdown\\n   *     __month-read-view: The static control\\n   *     __month-dropdown: The absolutely positioned list\\n   *       __month-option: Each option in the list\\n   *                       --selected_month\\n   *                       --selected\\n   *                       --preselected\\n\\n   *   __year-dropdown-container: Contains both static/selected control and the dropdown\\n   *     __year-read-view: The static control\\n   *     __year-dropdown: The absolutely positioned list\\n   *       __year-option: Each option in the list\\n   *                       --selected_year\\n   *                       --selected\\n   *                       --preselected\\n   */\\n  /**\\n   * Make the top selectors look like select inputs\\n   */\\n  /* This file is a heavy retheme of react-datepicker's Sass as of v1.4.0\\n  ** https://github.com/Hacker0x01/react-datepicker\\n  */\\n  /*\\n   * 1. Overwrites the base styling of EuiBadge, to give it a larger size and margins\\n   * that make sense in the input wrap.\\n   */\\n  /**\\n   * 1. Using specificity to override panel shadow\\n   * 2. Prevent really long input from overflowing the container.\\n   */\\n  /**\\n   * 1. Force each title to be the same height as an option, so that the virtualized scroll logic\\n   *    works.\\n   */\\n  /**\\n  * Make the arrow delimiter match the colors of `.euiDatePopoverButton-needsUpdating`\\n  */\\n  /**\\n    * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n    *    they actually click this input.\\n    */\\n  /*\\n   * 1. Fix for Safari to ensure that it renders like a normal text input\\n   *    and doesn't add extra spacing around text\\n  */\\n  /**\\n    * REMEMBER: --large modifiers must come last to override --compressed\\n    */\\n  /**\\n    * 1. Don't block the user from dropping files onto the filepicker.\\n    * 2. Ensure space for import icon, loading spinner, and clear button (only if it has files)\\n    * 4. Static height so that it doesn't shift its surrounding contents around\\n    */\\n  /**\\n    * 1. Undo the pointer-events: none applied to the enclosing prompt.\\n    */\\n  /**\\n   * 1. Ensure the descenders don't get cut off\\n   */\\n  /**\\n   * 1. Ensure the descenders don't get cut off\\n   * 2. Makes sure the height is correct when there's no selection\\n   */\\n  /**\\n   * 1. Account for inner box-shadow style border\\n   * 2. Ensure truncation works in children elements\\n   */\\n  /**\\n   * 1. Focused state overrides invalid state.\\n   * 2. Disabled state overrides pointer.\\n   */\\n  /**\\n   * 1. Coerce inline form elements to behave as block-level elements.\\n   * 2. For inline forms, we need to add margin if the label doesn't exist.\\n   */\\n  /**\\n    * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n    *    they actually click this input.\\n    */\\n  /**\\n    * 1. Prevent really long input from overflowing the container.\\n    */\\n  /**\\n   * 1. Vertically align all children.\\n   * 2. The padding on this div allows the ellipsis to show if the content is truncated. If\\n   *    the padding was on the cell, the ellipsis would be cropped.\\n   * 4. Prevent very long single words (e.g. the name of a field in a document) from overflowing\\n   *    the cell.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n   * Adapted from Eric Meyer's reset (http://meyerweb.com/eric/tools/css/reset/, v2.0 | 20110126).\\n   *\\n   */\\n  /* HTML5 display-role reset for older browsers */\\n  /* Chrome has an issue around RTL languages in SVGs when letter-spacing is negative\\n   * https://bugs.chromium.org/p/chromium/issues/detail?id=966480\\n   */\\n  /* Chrome has an issue around RTL languages in SVGs when letter-spacing is negative\\n   * https://bugs.chromium.org/p/chromium/issues/detail?id=966480\\n   */\\n  /**\\n   * Manually synced with `COLOR_STRIP_CHECK_WIDTH` const in [`tooltip_table.tsx`](packages/charts/src/components/tooltip/components/tooltip_table.tsx)\\n   */\\n}\\n@-webkit-keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@-webkit-keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@-webkit-keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #0071c2;\\n  }\\n}\\n@keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #0071c2;\\n  }\\n}\\n@-webkit-keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #0071c2;\\n  }\\n}\\n@keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(0, 119, 204, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #0071c2;\\n  }\\n}\\n@-webkit-keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\n@keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\nhtml.light-theme .react-datepicker__day-names,\\nhtml.light-theme .react-datepicker__week {\\n  white-space: nowrap;\\n  display: flex;\\n  justify-content: space-between;\\n  flex-grow: 1;\\n}\\nhtml.light-theme .react-datepicker__day-name,\\nhtml.light-theme .react-datepicker__day {\\n  font-weight: 500;\\n  text-align: center;\\n  color: #1a1c21;\\n  display: inline-block;\\n  width: 32px;\\n  line-height: 32px;\\n  border-radius: 4px;\\n  margin: 2px;\\n}\\nhtml.light-theme .react-datepicker__day-name {\\n  color: #69707D;\\n}\\nhtml.light-theme .react-datepicker__day {\\n  cursor: pointer;\\n  transition: transform 90ms ease-in-out;\\n}\\nhtml.light-theme .react-datepicker__day:hover {\\n  color: #0061a6;\\n  background-color: rgba(0, 119, 204, 0.2);\\n  text-decoration: underline;\\n}\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  html.light-theme .react-datepicker__day:hover {\\n    transform: scale(1.1);\\n  }\\n}\\nhtml.light-theme .react-datepicker__day--today {\\n  color: #07C;\\n  font-weight: 700;\\n}\\nhtml.light-theme .react-datepicker__day--outside-month {\\n  color: #69707D;\\n}\\nhtml.light-theme .react-datepicker__day--highlighted, html.light-theme .react-datepicker__day--highlighted:hover {\\n  color: #00726b;\\n  background-color: rgba(0, 191, 179, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--in-range, html.light-theme .react-datepicker__day--in-range:hover {\\n  color: #0061a6;\\n  background-color: rgba(0, 119, 204, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover), html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected), html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover {\\n  box-shadow: -2px 0 rgba(0, 119, 204, 0.2), 2px 0 rgba(0, 119, 204, 0.2);\\n  border-radius: 0;\\n}\\nhtml.light-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):first-of-type, html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):first-of-type, html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:first-of-type {\\n  box-shadow: 2px 0 rgba(0, 119, 204, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):last-of-type, html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):last-of-type, html.light-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:last-of-type {\\n  box-shadow: -2px 0 rgba(0, 119, 204, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--selected, html.light-theme .react-datepicker__day--in-selecting-range, html.light-theme .react-datepicker__day--selected:hover, html.light-theme .react-datepicker__day--in-selecting-range:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\nhtml.light-theme .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range) {\\n  background-color: rgba(189, 39, 30, 0.5);\\n}\\nhtml.light-theme .react-datepicker__day--disabled, html.light-theme .react-datepicker__day--disabled:hover {\\n  background-color: rgba(171, 180, 196, 0.1);\\n  color: #a2abba;\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  transform: none;\\n}\\nhtml.light-theme .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected), html.light-theme .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover, html.light-theme .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected), html.light-theme .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover {\\n  color: #8c9daa;\\n  background-color: rgba(0, 119, 204, 0.2);\\n}\\nhtml.light-theme .react-datepicker__day--disabled.react-datepicker__day--selected, html.light-theme .react-datepicker__day--disabled.react-datepicker__day--selected:hover {\\n  color: #BD271E;\\n  background-color: rgba(189, 39, 30, 0.2);\\n}\\nhtml.light-theme .react-datepicker__header--time {\\n  display: none;\\n}\\nhtml.light-theme .react-datepicker__time-container {\\n  border-left: #D3DAE6;\\n  width: auto;\\n  display: flex;\\n  margin-top: 40px;\\n  margin-left: 8px;\\n  flex-grow: 1;\\n  background-color: #fafbfd;\\n  border-radius: 6px;\\n}\\nhtml.light-theme .react-datepicker__time-container--focus .react-datepicker__time-list-item--preselected {\\n  text-decoration: underline;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .react-datepicker__time-container {\\n    margin-top: 0;\\n  }\\n}\\nhtml.light-theme .react-datepicker__time,\\nhtml.light-theme .react-datepicker__time-box {\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n}\\nhtml.light-theme .react-datepicker__time-list {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  padding: 4px 12px;\\n  height: 100px !important;\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n  align-items: center;\\n  gap: 4px;\\n}\\nhtml.light-theme .react-datepicker__time-list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .react-datepicker__time-list::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .react-datepicker__time-list::-webkit-scrollbar-corner, html.light-theme .react-datepicker__time-list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .react-datepicker__time-list:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .react-datepicker__time-list[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .react-datepicker__time-list-item {\\n  display: inline-block;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  cursor: pointer;\\n  height: 40px;\\n  line-height: 40px;\\n  text-align: center;\\n  white-space: nowrap;\\n  max-width: 100%;\\n  vertical-align: middle;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 500;\\n  text-decoration: none;\\n  outline-offset: -1px;\\n  transform: none !important;\\n  /* 1 */\\n  -webkit-animation: none !important;\\n  animation: none !important;\\n  /* 1 */\\n  transition-timing-function: ease-in;\\n  /* 2 */\\n  transition-duration: 150ms;\\n  /* 2 */\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 12px;\\n}\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  html.light-theme .react-datepicker__time-list-item {\\n    transition: transform 250ms ease-in-out, background-color 250ms ease-in-out;\\n  }\\n  html.light-theme .react-datepicker__time-list-item:hover:not(:disabled) {\\n    transform: translateY(-1px);\\n  }\\n  html.light-theme .react-datepicker__time-list-item:focus {\\n    -webkit-animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n    animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  }\\n  html.light-theme .react-datepicker__time-list-item:active:not(:disabled) {\\n    transform: translateY(1px);\\n  }\\n}\\nhtml.light-theme .react-datepicker__time-list-item:hover:not(:disabled), html.light-theme .react-datepicker__time-list-item:focus {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .react-datepicker__time-list-item--disabled, html.light-theme .react-datepicker__time-list-item--disabled:hover {\\n  text-decoration: none !important;\\n  cursor: not-allowed;\\n  color: #ABB4C4;\\n  background-color: transparent;\\n}\\nhtml.light-theme .react-datepicker__time-list-item--injected, html.light-theme .react-datepicker__time-list-item--injected:hover {\\n  color: #00726b;\\n  background-color: rgba(0, 191, 179, 0.2);\\n}\\nhtml.light-theme .react-datepicker__time-list-item--preselected, html.light-theme .react-datepicker__time-list-item--preselected:hover {\\n  background: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .react-datepicker__time-list-item--selected, html.light-theme .react-datepicker__time-list-item--selected:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\nhtml.light-theme .react-datepicker--time-only {\\n  padding: 0 !important;\\n}\\nhtml.light-theme .react-datepicker--time-only .react-datepicker__time-container {\\n  background-color: transparent;\\n  margin: 0;\\n}\\nhtml.light-theme .react-datepicker--time-only .react-datepicker__time-list {\\n  height: 204px !important;\\n}\\nhtml.light-theme .react-datepicker--time-only .react-datepicker__time-list-item {\\n  font-size: 14px;\\n  min-width: 112px;\\n  text-align: left;\\n}\\nhtml.light-theme .react-datepicker__header__dropdown {\\n  padding: 8px;\\n  display: flex;\\n  gap: 4px;\\n  position: absolute;\\n  top: 0;\\n  left: 36px;\\n  right: 36px;\\n  justify-content: center;\\n}\\nhtml.light-theme .react-datepicker__year-read-view,\\nhtml.light-theme .react-datepicker__month-read-view,\\nhtml.light-theme .react-datepicker__month-year-read-view {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  height: 32px;\\n  font-weight: 500;\\n  display: flex;\\n  flex-direction: row-reverse;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .react-datepicker__year-read-view,\\nhtml.light-theme .react-datepicker__month-read-view,\\nhtml.light-theme .react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .react-datepicker__year-read-view::-moz-placeholder,\\nhtml.light-theme .react-datepicker__month-read-view::-moz-placeholder,\\nhtml.light-theme .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .react-datepicker__year-read-view::-moz-placeholder, html.light-theme .react-datepicker__month-read-view::-moz-placeholder, html.light-theme .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .react-datepicker__year-read-view:-ms-input-placeholder, html.light-theme .react-datepicker__month-read-view:-ms-input-placeholder, html.light-theme .react-datepicker__month-year-read-view:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .react-datepicker__year-read-view::placeholder,\\nhtml.light-theme .react-datepicker__month-read-view::placeholder,\\nhtml.light-theme .react-datepicker__month-year-read-view::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .react-datepicker__year-read-view,\\nhtml.light-theme .react-datepicker__month-read-view,\\nhtml.light-theme .react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .react-datepicker__year-read-view:hover,\\nhtml.light-theme .react-datepicker__month-read-view:hover,\\nhtml.light-theme .react-datepicker__month-year-read-view:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.light-theme .react-datepicker__year-read-view--down-arrow,\\nhtml.light-theme .react-datepicker__month-read-view--down-arrow,\\nhtml.light-theme .react-datepicker__month-year-read-view--down-arrow {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiI+ICA8ZGVmcz4gICAgPHBhdGggaWQ9ImFycm93X2Rvd24tYSIgZD0iTTEzLjA2ODg1MDgsNS4xNTcyNTAzOCBMOC4zODQyMzk3NSw5Ljc2ODI3NDI4IEM4LjE3MDU0NDE1LDkuOTc4NjEzMDggNy44Mjk5OTIxNCw5Ljk3OTE0MDk1IDcuNjE1NzYwMjUsOS43NjgyNzQyOCBMMi45MzExNDkxNSw1LjE1NzI1MDM4IEMyLjcxODEzNTksNC45NDc1ODMyMSAyLjM3Mjc3MzE5LDQuOTQ3NTgzMjEgMi4xNTk3NTk5NCw1LjE1NzI1MDM4IEMxLjk0Njc0NjY5LDUuMzY2OTE3NTYgMS45NDY3NDY2OSw1LjcwNjg1NTIyIDIuMTU5NzU5OTQsNS45MTY1MjI0IEw2Ljg0NDM3MTA0LDEwLjUyNzU0NjMgQzcuNDg1MTc0MjQsMTEuMTU4MjgzNiA4LjUxNjQ0OTc5LDExLjE1NjY4NTEgOS4xNTU2Mjg5NiwxMC41Mjc1NDYzIEwxMy44NDAyNDAxLDUuOTE2NTIyNCBDMTQuMDUzMjUzMyw1LjcwNjg1NTIyIDE0LjA1MzI1MzMsNS4zNjY5MTc1NiAxMy44NDAyNDAxLDUuMTU3MjUwMzggQzEzLjYyNzIyNjgsNC45NDc1ODMyMSAxMy4yODE4NjQxLDQuOTQ3NTgzMjEgMTMuMDY4ODUwOCw1LjE1NzI1MDM4IFoiLz4gIDwvZGVmcz4gIDxnIGZpbGwtcnVsZT0iZXZlbm9kZCI+ICAgIDx1c2UgZmlsbC1ydWxlPSJub256ZXJvIiB4bGluazpocmVmPSIjYXJyb3dfZG93bi1hIi8+ICA8L2c+PC9zdmc+);\\n  right: 8px;\\n  height: 12px;\\n  width: 12px;\\n  display: inline-block;\\n  background-size: cover;\\n}\\nhtml.light-theme .react-datepicker__year-read-view--selected-month, html.light-theme .react-datepicker__year-read-view--selected-year,\\nhtml.light-theme .react-datepicker__month-read-view--selected-month,\\nhtml.light-theme .react-datepicker__month-read-view--selected-year,\\nhtml.light-theme .react-datepicker__month-year-read-view--selected-month,\\nhtml.light-theme .react-datepicker__month-year-read-view--selected-year {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container,\\nhtml.light-theme .react-datepicker__month-dropdown-container {\\n  position: relative;\\n  display: inline-block;\\n  flex-grow: 1;\\n  max-width: 400px;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]),\\nhtml.light-theme .react-datepicker__month-dropdown {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n  height: auto;\\n  max-height: 250px;\\n  background-color: #FFF;\\n  position: absolute;\\n  z-index: 1;\\n  border-radius: 6px;\\n  min-width: 100px;\\n  width: 100%;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar,\\nhtml.light-theme .react-datepicker__month-dropdown::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-thumb,\\nhtml.light-theme .react-datepicker__month-dropdown::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-corner, html.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-track,\\nhtml.light-theme .react-datepicker__month-dropdown::-webkit-scrollbar-corner,\\nhtml.light-theme .react-datepicker__month-dropdown::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]):focus,\\nhtml.light-theme .react-datepicker__month-dropdown:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])[tabindex=\\\"0\\\"]:focus:focus-visible,\\nhtml.light-theme .react-datepicker__month-dropdown[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]) .react-datepicker__year-dropdown {\\n  padding: 4px;\\n  display: flex;\\n  flex-direction: column-reverse;\\n  justify-content: flex-end;\\n}\\nhtml.light-theme .react-datepicker__month-dropdown-container {\\n  flex-grow: 2;\\n}\\nhtml.light-theme .react-datepicker__month-dropdown-container .react-datepicker__month-dropdown {\\n  padding: 4px;\\n  min-width: 140px;\\n}\\nhtml.light-theme .react-datepicker__year-option,\\nhtml.light-theme .react-datepicker__month-option,\\nhtml.light-theme .react-datepicker__month-year-option {\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 14px;\\n  margin: 4px 0;\\n  cursor: pointer;\\n}\\nhtml.light-theme .react-datepicker__year-option:hover, html.light-theme .react-datepicker__year-option:focus,\\nhtml.light-theme .react-datepicker__month-option:hover,\\nhtml.light-theme .react-datepicker__month-option:focus,\\nhtml.light-theme .react-datepicker__month-year-option:hover,\\nhtml.light-theme .react-datepicker__month-year-option:focus {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .react-datepicker__year-option--selected,\\nhtml.light-theme .react-datepicker__month-option--selected,\\nhtml.light-theme .react-datepicker__month-year-option--selected {\\n  display: none;\\n}\\nhtml.light-theme .react-datepicker__year-option--preselected, html.light-theme .react-datepicker__year-option--preselected:hover,\\nhtml.light-theme .react-datepicker__month-option--preselected,\\nhtml.light-theme .react-datepicker__month-option--preselected:hover {\\n  background: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .react-datepicker__year-option--selected_year, html.light-theme .react-datepicker__year-option--selected_year:hover,\\nhtml.light-theme .react-datepicker__month-option--selected_month,\\nhtml.light-theme .react-datepicker__month-option--selected_month:hover {\\n  background-color: #07C;\\n  color: #FFF;\\n}\\nhtml.light-theme .react-datepicker__navigation--next,\\nhtml.light-theme .react-datepicker__navigation--previous {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZmlsbD0iIzM0Mzc0MSIgZD0iTTExLjY5MiA3SDMuNTU2QzMuMjQ5IDcgMyA3LjIyNCAzIDcuNXMuMjQ5LjUuNTU2LjVoOC4xMzZsLTQuMDk2IDQuMDk2YS41LjUgMCAwMC43MDcuNzA3bDQuMjQzLTQuMjQyYy4yNTgtLjI1OS40MDMtLjU4Ny40MzMtLjkyNWEuNDU0LjQ1NCAwIDAwMC0uMjcyIDEuNDk0IDEuNDk0IDAgMDAtLjQzMy0uOTI1TDguMzAzIDIuMTk3YS41LjUgMCAxMC0uNzA3LjcwN0wxMS42OTIgN3oiLz48L3N2Zz4=);\\n  cursor: pointer;\\n  position: absolute;\\n  top: 8px;\\n  height: 32px;\\n  width: 32px;\\n  z-index: 1;\\n  text-indent: -999em;\\n  overflow: hidden;\\n  background-repeat: no-repeat;\\n  border-radius: 4px;\\n  background-position: center;\\n}\\nhtml.light-theme .react-datepicker__navigation--next:hover, html.light-theme .react-datepicker__navigation--next:focus,\\nhtml.light-theme .react-datepicker__navigation--previous:hover,\\nhtml.light-theme .react-datepicker__navigation--previous:focus {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .react-datepicker__navigation--previous {\\n  left: 8px;\\n  transform: rotate(180deg);\\n  transform-origin: center;\\n}\\nhtml.light-theme .react-datepicker__navigation--next {\\n  right: 8px;\\n}\\nhtml.light-theme .euiDatePicker {\\n  display: block;\\n  /**\\n   * Inline datepickers\\n   */\\n}\\nhtml.light-theme .euiDatePicker .euiFormControlLayout {\\n  height: auto;\\n}\\nhtml.light-theme .euiDatePicker--inline .euiFormControlLayout {\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n  background-color: transparent;\\n  box-shadow: none;\\n  padding: 0;\\n}\\nhtml.light-theme .euiDatePicker--inline .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: transparent;\\n  flex-direction: column;\\n}\\nhtml.light-theme .euiDatePicker--inline .euiFormControlLayoutIcons {\\n  justify-content: center;\\n  -webkit-padding-after: 8px;\\n  padding-block-end: 8px;\\n}\\nhtml.light-theme .euiDatePicker--shadow .euiFormControlLayout {\\n  box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n}\\nhtml.light-theme .euiDatePicker--shadow .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .react-datepicker {\\n  font-size: 12px;\\n  color: #343741;\\n  display: flex;\\n  border-radius: 6px;\\n  padding: 8px;\\n  justify-content: center;\\n}\\nhtml.light-theme .react-datepicker--non-interactive {\\n  pointer-events: none;\\n}\\nhtml.light-theme .react-datepicker__current-month,\\nhtml.light-theme .react-datepicker-time__header {\\n  display: none;\\n}\\nhtml.light-theme .react-datepicker__screenReaderOnly {\\n  position: absolute;\\n  top: auto;\\n  left: -10000px;\\n  width: 1px;\\n  height: 1px;\\n  clip: rect(0 0 0 0);\\n  -webkit-clip-path: inset(50%);\\n  clip-path: inset(50%);\\n  overflow: hidden;\\n  margin: -1px;\\n}\\nhtml.light-theme .react-datepicker__focusTrap {\\n  display: flex;\\n  justify-content: center;\\n}\\nhtml.light-theme .react-datepicker__month-container {\\n  flex-grow: 1;\\n  margin-top: 36px;\\n}\\nhtml.light-theme .react-datepicker__header {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .react-datepicker-time__header {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .react-datepicker__month {\\n  text-align: center;\\n  border-radius: 6px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .react-datepicker__focusTrap,\\nhtml.light-theme .react-datepicker {\\n    flex-direction: column;\\n  }\\n  html.light-theme .react-datepicker__time-box {\\n    margin-top: 0;\\n  }\\n}\\nhtml.light-theme .euiColorPicker {\\n  position: relative;\\n  width: 152px;\\n}\\nhtml.light-theme .euiColorPicker__popoverAnchor .euiColorPicker__input {\\n  padding-right: 40px;\\n}\\nhtml.light-theme .euiColorPicker__popoverAnchor .euiColorPicker__input[class*=\\\"--compressed\\\"] {\\n  padding-right: 32px;\\n}\\nhtml.light-theme .euiColorPicker__popoverAnchor .euiColorPicker__input + .euiFormControlLayoutIcons {\\n  color: inherit;\\n}\\nhtml.light-theme .euiColorPicker__swatches {\\n  display: flex;\\n  flex-wrap: wrap;\\n  margin: -4px;\\n}\\nhtml.light-theme .euiColorPicker__swatch-item {\\n  margin: 4px;\\n}\\nhtml.light-theme .euiSwatchInput__stroke {\\n  fill: none;\\n  stroke: rgba(0, 0, 0, 0.2);\\n}\\nhtml.light-theme .euiColorPicker__popoverPanel--pickerOnly {\\n  padding-bottom: 0 !important;\\n}\\nhtml.light-theme .euiColorPicker__input--inGroup {\\n  height: 38px !important;\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiColorPicker__input--inGroup.euiFieldText--compressed {\\n  height: 30px !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiColorPicker__alphaRange .euiRangeInput {\\n  min-width: 0;\\n}\\nhtml.light-theme .euiColorPickerSwatch {\\n  display: inline-block;\\n  height: 24px;\\n  width: 24px;\\n  border-radius: 3px;\\n  cursor: pointer;\\n  border: solid 1px rgba(0, 0, 0, 0.1);\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);\\n}\\nhtml.light-theme .euiColorPickerSwatch:disabled {\\n  cursor: default;\\n}\\nhtml.light-theme .euiColorPickerSwatch:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiColorPickerSwatch:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiColorPickerSwatch:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiHue {\\n  background: linear-gradient(to right, #FF3232 0%, #FFF130 20%, #45FF30 35%, #28FFF0 52%, #282CFF 71%, #FF28FB 88%, #FF0094 100%);\\n  height: 24px;\\n  margin: 4px 0;\\n  position: relative;\\n}\\nhtml.light-theme .euiHue::before, html.light-theme .euiHue::after {\\n  content: \\\"\\\";\\n  left: 0;\\n  position: absolute;\\n  height: 8px;\\n  background: #FFF;\\n  width: 100%;\\n}\\nhtml.light-theme .euiHue::after {\\n  bottom: 0;\\n}\\nhtml.light-theme .euiHue__range {\\n  position: relative;\\n  height: 24px;\\n  width: calc(100% + 2px);\\n  margin: 0 -1px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  background: transparent;\\n  z-index: 2;\\n}\\nhtml.light-theme .euiHue__range::-webkit-slider-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -webkit-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.light-theme .euiHue__range::-moz-range-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -moz-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.light-theme .euiHue__range::-ms-thumb {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  -ms-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #FFF, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #FFF;\\n  cursor: pointer;\\n  background-color: #69707D;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.light-theme .euiHue__range::-webkit-slider-thumb {\\n  -webkit-appearance: none;\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiHue__range::-ms-thumb {\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiHue__range::-ms-track {\\n  height: 24px;\\n  background: transparent;\\n  border-color: transparent;\\n  color: transparent;\\n}\\nhtml.light-theme .euiHue__range::-moz-focus-outer {\\n  border: none;\\n}\\nhtml.light-theme .euiHue__range::-ms-fill-lower, html.light-theme .euiHue__range::-ms-fill-upper {\\n  background: transparent;\\n}\\nhtml.light-theme .euiHue__range:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiSaturation {\\n  position: relative;\\n  width: 100%;\\n  padding-bottom: 100%;\\n  border-radius: 3px;\\n  touch-action: none;\\n  z-index: 3;\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__lightness,\\nhtml.light-theme .euiSaturation .euiSaturation__saturation {\\n  position: absolute;\\n  top: -1px;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  border-radius: 3px;\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__lightness {\\n  background: linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0));\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__saturation {\\n  background: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__indicator {\\n  position: absolute;\\n  height: 12px;\\n  width: 12px;\\n  border-radius: 100%;\\n  margin-top: -6px;\\n  margin-left: -6px;\\n  border: 1px solid #343741;\\n}\\nhtml.light-theme .euiSaturation .euiSaturation__indicator::before {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 100%;\\n  border: 1px solid #F5F7FA;\\n}\\nhtml.light-theme .euiSaturation:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiSaturation:focus .euiSaturation__indicator {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiColorPalettePicker__itemTitle {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.light-theme .euiColorPalettePicker__itemTitle + .euiColorPaletteDisplay {\\n  margin-top: 4px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay {\\n  display: flex;\\n  flex-direction: row;\\n  overflow: hidden;\\n  height: 8px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeExtraSmall {\\n  position: relative;\\n  height: 4px;\\n  border-radius: 4px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeExtraSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 4px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeExtraSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 4px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeSmall {\\n  position: relative;\\n  height: 8px;\\n  border-radius: 8px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 8px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 8px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeMedium {\\n  position: relative;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeMedium::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 16px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(52, 55, 65, 0.2);\\n}\\nhtml.light-theme .euiColorPaletteDisplay--sizeMedium .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 16px;\\n}\\nhtml.light-theme .euiColorPaletteDisplayFixed__bleedArea {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  display: flex;\\n  height: 8px;\\n  width: calc(100% + 1px);\\n}\\nhtml.light-theme .euiComboBox {\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  position: relative;\\n  /**\\n   * 1. Allow pills to truncate their text with an ellipsis.\\n   * 2. Don't allow pills/placeholder to overlap with the caret, loading icon or clear button.\\n   * 3. The height on combo can be larger than normal text inputs except for single-selection comboboxes.\\n   */\\n  /**\\n   * 1. Force field height to match other field heights.\\n   * 2. Force input height to expand to fill this element.\\n   * 3. Reset input appearance to mimic text\\n   * 4. Ensure that no input states are visible on the hidden input\\n   */\\n}\\nhtml.light-theme .euiComboBox--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiComboBox--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiComboBox--inGroup {\\n  height: 100%;\\n}\\nhtml.light-theme .euiComboBox--compressed:not(.euiComboBox--appended, .euiComboBox--prepended) {\\n  height: auto;\\n  /* 3 */\\n}\\nhtml.light-theme .euiComboBox:not(.euiComboBox--appended, .euiComboBox--prepended) .euiFormControlLayout {\\n  height: auto;\\n  /* 3 */\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  padding: 4px 8px;\\n  padding-right: var(--eui-form-control-layout-icons-padding, 8px);\\n  /* 2 */\\n  display: flex;\\n  /* 1 */\\n  outline: none;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiComboBox .euiComboBox__inputWrap {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPill {\\n  max-width: calc(100% - 2px - 16px);\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap:not(.euiComboBox__inputWrap--noWrap) {\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  padding-left: 4px;\\n  height: auto;\\n  /* 3 */\\n  flex-wrap: wrap;\\n  /* 1 */\\n  align-content: flex-start;\\n  cursor: text;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--noWrap {\\n  align-items: center;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 8px;\\n  padding-inline-start: 8px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend, html.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  flex-shrink: 0;\\n  margin-inline: 2px;\\n  display: flex;\\n  /* Vertically centers any icons */\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend {\\n  -webkit-margin-start: 4px;\\n  margin-inline-start: 4px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  -webkit-margin-end: 4px;\\n  margin-inline-end: 4px;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input {\\n  block-size: 24px;\\n  /* 2 */\\n  min-inline-size: 2px;\\n  max-inline-size: 100%;\\n  margin: 4px;\\n  /* 3 */\\n  background: transparent;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  /* 4 */\\n  -webkit-appearance: none !important;\\n  -moz-appearance: none !important;\\n  appearance: none !important;\\n  border: none !important;\\n  box-shadow: none !important;\\n  outline: none !important;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox .euiComboBox__input:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap--compressed {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isInvalid .euiComboBox__inputWrap {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  -webkit-text-fill-color: unset;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap,\\nhtml.light-theme .euiComboBox.euiComboBox-isDisabled .euiComboBoxPill {\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap {\\n  line-height: 32px;\\n  /* 2 */\\n  padding-block: 0;\\n}\\nhtml.light-theme .euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 4px;\\n  padding-inline-start: 4px;\\n}\\nhtml.light-theme .euiComboBoxPill {\\n  height: 22px;\\n  line-height: 20px;\\n  vertical-align: baseline;\\n  /* Fix append/prepend vertical alignment */\\n}\\nhtml.light-theme .euiComboBoxPill, html.light-theme .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 4px;\\n}\\nhtml.light-theme .euiComboBox--compressed .euiComboBoxPill, html.light-theme .euiComboBox--compressed .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 5px 4px 0 0;\\n}\\nhtml.light-theme .euiComboBoxPill__prepend {\\n  margin-right: 4px;\\n}\\nhtml.light-theme .euiComboBoxPill__append {\\n  margin-left: 4px;\\n}\\nhtml.light-theme .euiComboBoxPill .euiBadge__text {\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiComboBoxPill .euiBadge__text .euiIcon {\\n  display: block;\\n}\\nhtml.light-theme .euiComboBoxOptionsList {\\n  max-height: 200px;\\n  overflow: hidden;\\n  /* Kibana FTR affordance - without this, Selenium complains about the overlaid\\n     text intercepting the button click. Since `title` is always present, and\\n     users can't highlight or copy combobox options anyway, we might as well\\n     disable clicks on text */\\n}\\nhtml.light-theme .euiComboBoxOptionsList__virtualization {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\nhtml.light-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-corner, html.light-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiComboBoxOptionsList .euiTextTruncate {\\n  pointer-events: none;\\n}\\nhtml.light-theme .euiComboBoxOptionsList__empty {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 2 */\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n}\\nhtml.light-theme .euiComboBoxOption {\\n  font-size: 14px;\\n  padding: 4px 8px 4px 16px;\\n  width: 100%;\\n  text-align: left;\\n  border: 1px solid #D3DAE6;\\n  border-color: transparent;\\n  display: flex;\\n  align-items: center;\\n  /* Fix vertical alignment of EuiIcons in prepend/append nodes */\\n}\\nhtml.light-theme .euiComboBoxOption:hover {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiComboBoxOption.euiComboBoxOption-isFocused {\\n  cursor: pointer;\\n  color: #0071c2;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiComboBoxOption.euiComboBoxOption-isDisabled {\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiComboBoxOption.euiComboBoxOption-isDisabled:hover {\\n  text-decoration: none;\\n}\\nhtml.light-theme .euiComboBoxOption__contentWrapper {\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiComboBoxOption__content {\\n  text-overflow: ellipsis;\\n  overflow: hidden;\\n  white-space: nowrap;\\n  flex: 1;\\n  text-align: left;\\n}\\nhtml.light-theme .euiComboBoxOption__emptyStateText {\\n  flex: 1;\\n  text-align: left;\\n  /* Extra specificity required to override EuiText's <p> styling */\\n}\\nhtml.light-theme .euiComboBoxOptionsList__empty .euiComboBoxOption__emptyStateText {\\n  margin-bottom: 0;\\n}\\nhtml.light-theme .euiComboBoxOption__enterBadge {\\n  margin-left: 4px;\\n}\\nhtml.light-theme .euiComboBoxOption__prepend {\\n  margin-right: 8px;\\n}\\nhtml.light-theme .euiComboBoxOption__append {\\n  margin-left: 8px;\\n}\\nhtml.light-theme .euiComboBoxOption__prepend .euiIcon, html.light-theme .euiComboBoxOption__append .euiIcon {\\n  display: block;\\n}\\nhtml.light-theme .euiComboBoxTitle {\\n  font-size: 12px;\\n  padding: 11px 8px 4px;\\n  /* 1 */\\n  width: 100%;\\n  font-weight: 700;\\n  color: #000;\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow {\\n  padding: 0 8px 8px;\\n  /* A bit of a visual trickery to make the format \\\"hint\\\" become an \\\"error\\\" text.\\n     NOTE: Normally reordering visually (vs DOM) isn't super great for screen reader users,\\n     but as the help text is already read out via `aria-describedby`, and the error text\\n     is read out immediately via `aria-live`, we can fairly safely prioritize visuals instead */\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormRow__fieldWrapper {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormControlLayout {\\n  order: 0;\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormHelpText {\\n  order: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormErrorText {\\n  order: 2;\\n}\\nhtml.light-theme .euiDatePopoverButton {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiDatePopoverButton::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDatePopoverButton:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDatePopoverButton::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDatePopoverButton--compressed {\\n  line-height: 30px;\\n  height: 30px;\\n}\\nhtml.light-theme .euiDatePopoverButton:focus, html.light-theme .euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n}\\nhtml.light-theme .euiDatePopoverButton-needsUpdating {\\n  background-color: #e6f9f7;\\n  color: #007e77;\\n}\\nhtml.light-theme .euiDatePopoverButton-needsUpdating:focus, html.light-theme .euiDatePopoverButton-needsUpdating.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #00BFB3, #00BFB3 2px, transparent 2px, transparent 100%);\\n}\\nhtml.light-theme .euiDatePopoverButton-isInvalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n  background-color: transparent;\\n  color: #BD271E;\\n}\\nhtml.light-theme .euiDatePopoverButton-isInvalid:focus, html.light-theme .euiDatePopoverButton-isInvalid.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n}\\nhtml.light-theme .euiDatePopoverButton:disabled {\\n  background-color: #eef2f7;\\n  background-image: none;\\n  color: #69707D;\\n  cursor: default;\\n}\\nhtml.light-theme .euiDatePopoverButton--start {\\n  text-align: center;\\n}\\nhtml.light-theme .euiDatePopoverButton--end {\\n  text-align: center;\\n}\\nhtml.light-theme .euiDatePopoverContent,\\nhtml.light-theme .euiDatePopoverContent .react-datepicker {\\n  width: 400px;\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiDatePopoverContent__padded {\\n  padding: 8px;\\n}\\nhtml.light-theme .euiDatePopoverContent__padded--large {\\n  padding: 16px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiDatePopoverContent {\\n    width: 284px;\\n  }\\n}\\nhtml.light-theme .euiQuickSelectPopover__content {\\n  width: 400px;\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiQuickSelectPopover__content .euiQuickSelectPopover__panel:not(:first-child) {\\n  border-top: 1px solid #D3DAE6;\\n  padding-top: 12px;\\n  margin-top: 12px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__content .euiQuickSelectPopover__panel .euiQuickSelectPopover__panelTitle {\\n  float: left;\\n  margin-bottom: 12px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__section {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 132px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n  margin: 8px 0 0;\\n  clear: both;\\n}\\nhtml.light-theme .euiQuickSelectPopover__section::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__section::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiQuickSelectPopover__section::-webkit-scrollbar-corner, html.light-theme .euiQuickSelectPopover__section::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiQuickSelectPopover__buttonContent {\\n  gap: 4px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__sectionItem {\\n  font-size: 14px;\\n  line-height: 14px;\\n}\\nhtml.light-theme .euiQuickSelectPopover__sectionItem--recentlyUsed:not(:last-of-type) {\\n  margin-bottom: 8px;\\n}\\nhtml.light-theme .euiQuickSelect__applyButton {\\n  min-width: 0;\\n}\\nhtml.light-theme .euiRefreshInterval__startButton {\\n  min-width: 90px;\\n}\\nhtml.light-theme .euiSuperDatePicker {\\n  display: flex;\\n  gap: 8px;\\n  max-width: 100%;\\n  min-width: min(326px, 100%);\\n  width: 606px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\nhtml.light-theme .euiSuperDatePicker--isAutoRefreshOnly {\\n  min-width: min(200px, 100%);\\n  width: 400px;\\n}\\nhtml.light-theme .euiSuperDatePicker--noUpdateButton {\\n  min-width: min(200px, 100%);\\n  width: 480px;\\n}\\nhtml.light-theme .euiSuperDatePicker--fullWidth {\\n  width: 100%;\\n}\\nhtml.light-theme .euiSuperDatePicker--isQuickSelectOnly {\\n  min-width: 0;\\n}\\nhtml.light-theme .euiSuperDatePicker--autoWidth {\\n  display: inline-flex;\\n  width: auto;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiDatePickerRange {\\n  flex-grow: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiFormControlLayout {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  overflow: hidden;\\n  background-color: #fbfcfd;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.light-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper > .euiFormControlLayoutDelimited__input {\\n  flex-grow: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  display: flex;\\n  justify-content: space-between;\\n  text-align: left;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat:not(:disabled):hover, html.light-theme .euiSuperDatePicker__prettyFormat:focus {\\n  text-decoration: none;\\n}\\nhtml.light-theme .euiSuperDatePicker__prettyFormat:disabled {\\n  background-color: #eef2f7;\\n  color: #69707D;\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #e6f9f7;\\n}\\nhtml.light-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayoutDelimited__delimiter {\\n  color: #007e77;\\n}\\nhtml.light-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayout__childrenWrapper {\\n  transition: background 150ms ease-in;\\n}\\nhtml.light-theme .euiDataGrid {\\n  display: flex;\\n  flex-direction: column;\\n  align-items: stretch;\\n  overflow: hidden;\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGrid--fullScreen {\\n  height: 100%;\\n  position: fixed;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  z-index: 999;\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGrid--fullScreen .euiDataGrid__pagination {\\n  padding-bottom: 4px;\\n  background: #F5F7FA;\\n  box-shadow: 1px 0 0 1px #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid__content {\\n  flex-grow: 1;\\n  height: 100%;\\n  max-width: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  z-index: 1;\\n  position: relative;\\n  background: #fafbfd;\\n  font-feature-settings: \\\"tnum\\\" 1;\\n}\\nhtml.light-theme .euiDataGrid__customRenderBody {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #FFF;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  width: 100%;\\n  overflow: auto;\\n}\\nhtml.light-theme .euiDataGrid__customRenderBody::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #FFF;\\n}\\nhtml.light-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-corner, html.light-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-track {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiDataGrid__pagination {\\n  z-index: 2;\\n  padding-top: 4px;\\n  flex-grow: 0;\\n}\\nhtml.light-theme .euiDataGrid__restrictBody {\\n  height: 100vh;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiDataGrid__restrictBody .euiHeader[data-fixed-header] {\\n  z-index: 998 !important;\\n}\\nhtml.light-theme .euiDataGrid__restrictBody .euiOverlayMask[data-relative-to-header=below] {\\n  top: 0;\\n}\\nhtml.light-theme .euiDataGrid__restrictBody .euiFlyout {\\n  top: 0;\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGrid__focusWrap {\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGrid__virtualized {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #FFF;\\n  scrollbar-width: thin;\\n  scroll-padding: 0;\\n}\\nhtml.light-theme .euiDataGrid__virtualized::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGrid__virtualized::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #FFF;\\n}\\nhtml.light-theme .euiDataGrid__virtualized::-webkit-scrollbar-corner, html.light-theme .euiDataGrid__virtualized::-webkit-scrollbar-track {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiDataGrid__scrollOverlay {\\n  position: absolute;\\n  top: -1px;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  pointer-events: none;\\n  box-shadow: inset 0 0 0 1px #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid--bordersHorizontal .euiDataGrid__scrollOverlay {\\n  box-shadow: inset 0 -2px 0 -1px #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayBottom {\\n  position: absolute;\\n  width: 100%;\\n  height: 1px;\\n  background-color: #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayRight {\\n  position: absolute;\\n  height: 100%;\\n  width: 1px;\\n  background-color: #D3DAE6;\\n}\\nhtml.light-theme .euiDataGridHeader {\\n  display: flex;\\n  z-index: 999;\\n  background: #FFF;\\n  position: sticky;\\n  top: 0;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\nhtml.light-theme .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  padding: 6px;\\n  flex: 0 0 auto;\\n  position: relative;\\n  align-items: center;\\n  display: flex;\\n}\\nhtml.light-theme .euiDataGridHeaderCell > [data-focus-lock-disabled] {\\n  width: 100%;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:focus, html.light-theme .euiDataGridHeaderCell--hasColumnActions:focus-within, html.light-theme .euiDataGridHeaderCell--isActionsPopoverOpen {\\n  outline: none;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:focus::after, html.light-theme .euiDataGridHeaderCell--hasColumnActions:focus-within::after, html.light-theme .euiDataGridHeaderCell--isActionsPopoverOpen::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #0071c2);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__button {\\n  position: relative;\\n  display: flex;\\n  align-items: center;\\n  gap: 4px;\\n  width: 100%;\\n  font-weight: 700;\\n  outline: none;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__content {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__sortingArrow {\\n  flex: 0 0 auto;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__icon {\\n  flex: 0 0 auto;\\n  margin-left: auto;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  height: 16px;\\n  overflow: hidden;\\n  width: 0;\\n  opacity: 0;\\n  transition: width 150ms ease-in, opacity 350ms ease-in;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):focus-within .euiDataGridHeaderCell__icon, html.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):hover .euiDataGridHeaderCell__icon,\\nhtml.light-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiPopover-isOpen .euiDataGridHeaderCell__icon {\\n  width: 16px;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDataGridHeaderCell.euiDataGridHeaderCell--numeric .euiDataGridHeaderCell__content, html.light-theme .euiDataGridHeaderCell.euiDataGridHeaderCell--currency .euiDataGridHeaderCell__content {\\n  flex-grow: 1;\\n  text-align: right;\\n}\\nhtml.light-theme .euiDataGridHeader__action--selected {\\n  font-weight: 700 !important;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone.euiDataGrid--bordersHorizontal .euiDataGridHeader {\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-left: none;\\n  border-right: none;\\n  border-bottom: 2px solid #D3DAE6;\\n  border-bottom-color: #343741;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone.euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-bottom: 2px solid #D3DAE6;\\n  border-color: #343741;\\n}\\nhtml.light-theme .euiDataGrid--headerShade .euiDataGridHeaderCell {\\n  background: #f5f7fa;\\n}\\nhtml.light-theme .euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-right: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  border-left: none;\\n}\\nhtml.light-theme .euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell:first-of-type {\\n  border-left: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid--headerShade.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-bottom: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone .euiDataGridHeaderCell {\\n  border: none;\\n}\\nhtml.light-theme .euiDataGrid--borderhorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-right: none;\\n  border-left: none;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeSmall .euiDataGridHeaderCell {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeLarge .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.light-theme .euiDataGrid--paddingSmall .euiDataGridHeaderCell {\\n  padding: 4px;\\n}\\nhtml.light-theme .euiDataGrid--paddingLarge .euiDataGridHeaderCell {\\n  padding: 8px;\\n}\\nhtml.light-theme .euiDataGrid--noControls.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-top: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGrid--noControls.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGridFooter {\\n  display: flex;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridFooterCell {\\n  flex: 0 0 auto;\\n  position: relative;\\n  font-weight: 700;\\n}\\nhtml.light-theme .euiDataGrid--stickyFooter .euiDataGridFooter {\\n  position: sticky;\\n  bottom: 0;\\n}\\nhtml.light-theme .euiDataGrid--footerOverline .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-top: 2px solid #D3DAE6;\\n  border-top-color: #343741 !important;\\n  background: #FFF !important;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\nhtml.light-theme .euiDataGrid--bordersHorizontal .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\nhtml.light-theme .euiDataGrid--footerShade .euiDataGridRowCell.euiDataGridFooterCell {\\n  background: #f5f7fa;\\n}\\nhtml.light-theme .euiDataGridColumnResizer {\\n  position: absolute;\\n  top: 0;\\n  right: -8px;\\n  height: 100%;\\n  width: 16px;\\n  cursor: ew-resize;\\n  opacity: 0;\\n  z-index: 2;\\n}\\nhtml.light-theme .euiDataGridColumnResizer::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  left: 7px;\\n  top: 0;\\n  bottom: 0;\\n  width: 3px;\\n  background-color: #07C;\\n}\\nhtml.light-theme .euiDataGridColumnResizer:hover, html.light-theme .euiDataGridColumnResizer:active {\\n  opacity: 1;\\n}\\nhtml.light-theme .euiDataGridColumnResizer:hover ~ .euiDataGridHeaderCell__content, html.light-theme .euiDataGridColumnResizer:active ~ .euiDataGridHeaderCell__content {\\n  -webkit-user-select: none;\\n  -moz-user-select: none;\\n  -ms-user-select: none;\\n      user-select: none;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:last-child .euiDataGridColumnResizer {\\n  right: 0;\\n  width: 8px;\\n}\\nhtml.light-theme .euiDataGridHeaderCell:last-child .euiDataGridColumnResizer::after {\\n  left: auto;\\n  right: 0;\\n}\\nhtml.light-theme .euiDataGridRow {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiDataGridRowCell {\\n  position: relative;\\n  border-right: solid 1px #edf0f5;\\n  border-bottom: 1px solid #D3DAE6;\\n  --euiDataGridCellOutlineColor: #07C;\\n}\\nhtml.light-theme .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 6px;\\n  height: 100%;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiDataGridRowCell .euiDataGridRowCell__content--autoHeight {\\n  height: auto;\\n}\\nhtml.light-theme .euiDataGridRowCell > [data-focus-lock-disabled] {\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--firstColumn {\\n  border-left: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--lastColumn {\\n  border-right-color: #D3DAE6;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover, html.light-theme .euiDataGridRowCell:focus, html.light-theme .euiDataGridRowCell.euiDataGridRowCell--open {\\n  outline: none;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover::after, html.light-theme .euiDataGridRowCell:focus::after, html.light-theme .euiDataGridRowCell.euiDataGridRowCell--open::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #0071c2);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) {\\n  --euiDataGridCellOutlineColor: #69707D;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) .euiDataGridRowCell__actions {\\n  -webkit-animation-delay: 350ms;\\n  animation-delay: 350ms;\\n}\\nhtml.light-theme .euiDataGridRowCell:hover .euiDataGridRowCell__actions, html.light-theme .euiDataGridRowCell:focus .euiDataGridRowCell__actions, html.light-theme .euiDataGridRowCell:focus-within .euiDataGridRowCell__actions, html.light-theme .euiDataGridRowCell.euiDataGridRowCell--open .euiDataGridRowCell__actions, html.light-theme .euiDataGridRowCell[data-keyboard-closing] .euiDataGridRowCell__actions {\\n  -webkit-animation-duration: 90ms;\\n  animation-duration: 90ms;\\n  -webkit-animation-name: euiDataGridCellActionsSlideIn;\\n  animation-name: euiDataGridCellActionsSlideIn;\\n  -webkit-animation-iteration-count: 1;\\n  animation-iteration-count: 1;\\n  -webkit-animation-fill-mode: forwards;\\n  animation-fill-mode: forwards;\\n}\\nhtml.light-theme .euiDataGridRowCell:not(:hover):not(:focus):not(.euiDataGridRowCell--open):not([data-keyboard-closing]) .euiDataGridRowCell__actions {\\n  display: none;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--numeric {\\n  text-align: right;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--currency {\\n  text-align: right;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--uppercase {\\n  text-transform: uppercase;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--lowercase {\\n  text-transform: lowercase;\\n}\\nhtml.light-theme .euiDataGridRowCell.euiDataGridRowCell--capitalize {\\n  text-transform: capitalize;\\n}\\nhtml.light-theme .euiDataGridRowCell__popover {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  overflow: auto;\\n  z-index: 1000 !important;\\n  filter: none;\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  -webkit-animation-duration: 250ms;\\n  animation-duration: 250ms;\\n  -webkit-animation-name: euiDataGridCellPopover;\\n  animation-name: euiDataGridCellPopover;\\n}\\nhtml.light-theme .euiDataGridRowCell__popover::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGridRowCell__popover::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiDataGridRowCell__popover::-webkit-scrollbar-corner, html.light-theme .euiDataGridRowCell__popover::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiDataGridRowCell--controlColumn .euiDataGridRowCell__content {\\n  max-height: 100%;\\n  height: auto;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiDataGridRowCell__actions,\\nhtml.light-theme .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  position: absolute;\\n  bottom: 100%;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions,\\nhtml.light-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  left: 0;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions,\\nhtml.light-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  right: 0;\\n}\\nhtml.light-theme .euiDataGridRowCell__actions {\\n  z-index: 998;\\n  margin-bottom: -1px;\\n  display: flex;\\n  gap: 2px;\\n  padding-inline: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n  color: #FFF;\\n  border: 1px solid var(--euiDataGridCellOutlineColor);\\n  border-top-left-radius: 3px;\\n  border-top-right-radius: 3px;\\n  transform: scaleY(0);\\n  transform-origin: bottom;\\n}\\nhtml.light-theme .euiDataGridRowCell[data-gridcell-visible-row-index=\\\"0\\\"] > .euiDataGridRowCell__actions {\\n  z-index: 999;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions {\\n  border-bottom-right-radius: 3px;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions {\\n  border-bottom-left-radius: 3px;\\n}\\nhtml.light-theme .euiDataGridRowCell__actions::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 100%;\\n  height: 2px;\\n  width: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n}\\nhtml.light-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions::after {\\n  left: -1px;\\n}\\nhtml.light-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions::after {\\n  right: -1px;\\n}\\nhtml.light-theme .euiDataGridRowCell__actionButtonIcon {\\n  height: 20px;\\n  width: 16px;\\n  border-radius: 0;\\n  /* Force all cell action buttons to match EUI colors */\\n  /* Manually increase the size of the expand cell icon - it's a bit small by default */\\n}\\nhtml.light-theme .euiDataGridRowCell__actionButtonIcon,\\nhtml.light-theme .euiDataGridRowCell__actionButtonIcon svg {\\n  background-color: transparent !important;\\n  color: currentColor !important;\\n  fill: currentColor !important;\\n}\\nhtml.light-theme .euiDataGridRowCell__actionButtonIcon.euiDataGridRowCell__expandCell .euiIcon {\\n  width: 120%;\\n  height: 100%;\\n}\\nhtml.light-theme .euiDataGrid--stripes .euiDataGridRow--striped {\\n  background-color: #F5F7FA;\\n}\\nhtml.light-theme .euiDataGrid--rowHoverHighlight .euiDataGridRow:hover {\\n  background-color: #fff9e8;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone .euiDataGridRowCell {\\n  border-color: transparent !important;\\n}\\nhtml.light-theme .euiDataGrid--bordersHorizontal .euiDataGridRowCell {\\n  border-right-color: transparent;\\n  border-left-color: transparent;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.light-theme .euiDataGrid--paddingSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 4px;\\n}\\nhtml.light-theme .euiDataGrid--paddingLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 8px;\\n}\\n@-webkit-keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@-webkit-keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\nhtml.light-theme .euiDataGrid__controls {\\n  background: #fafbfd;\\n  position: relative;\\n  z-index: 2;\\n  border: 1px solid #D3DAE6;\\n  padding: 4px 4px 4px 0;\\n  display: flex;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\nhtml.light-theme .euiDataGrid__rightControls {\\n  white-space: nowrap;\\n}\\nhtml.light-theme .euiDataGrid__rightControls:only-child {\\n  margin-left: auto;\\n}\\nhtml.light-theme .euiDataGrid__rightControls > * + * {\\n  margin-left: 8px;\\n}\\nhtml.light-theme .euiDataGrid__leftControls > * + * {\\n  margin-left: 2px;\\n}\\nhtml.light-theme .euiDataGrid--bordersNone .euiDataGrid__controls {\\n  border: none;\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGrid--bordersHorizontal .euiDataGrid__controls {\\n  border-right: none;\\n  border-left: none;\\n  border-top: none;\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  padding: 8px;\\n  margin: -8px;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll::-webkit-scrollbar-corner, html.light-theme .euiDataGrid__controlScroll::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiDataGrid__controlScroll:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .euiDataGrid__controlScroll[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .euiDataGridColumnSelector__item {\\n  padding: 4px;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  margin: 0 -8px;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-corner, html.light-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .euiDataGridColumnSelector__columnList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .euiDataGridColumnSelector__itemLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  background: #FFF;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  max-height: 300px;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-corner, html.light-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .euiDataGridColumnSorting__fieldList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .euiDataGridColumnSorting__field {\\n  display: block;\\n  padding: 4px 8px;\\n  width: 100%;\\n  outline-offset: -2px;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__field:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__field:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiDataGridColumnSorting__field:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #ABB4C4;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__name {\\n  padding-right: 24px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\nhtml.light-theme .euiDataGridColumnSorting__order {\\n  min-width: 200px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\nhtml.light-theme .euiDataGridColumnSorting__order .euiButtonGroup__buttons {\\n  border: none;\\n}\\nhtml.light-theme .euiDataGridColumnSorting__order .euiButtonGroupButton {\\n  font-size: 12px;\\n}\\nhtml.light-theme .euiDataGrid__displayPopoverPanel {\\n  width: 416px;\\n}\\nhtml.light-theme .euiDataGrid__keyboardShortcuts {\\n  display: block;\\n  max-inline-size: 400px;\\n  max-block-size: 80vh;\\n  overflow-y: auto;\\n  overflow-block: auto;\\n}\\nhtml.light-theme .euiDataGrid__keyboardShortcuts .euiDescriptionList {\\n  row-gap: 0;\\n}\\nhtml.light-theme .euiCheckbox {\\n  position: relative;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input ~ .euiCheckbox__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 4px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:checked + .euiCheckbox__square {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%28255, 255, 255%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:indeterminate + .euiCheckbox__square {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%28255, 255, 255%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input[disabled] ~ .euiCheckbox__label {\\n  color: #98A2B3;\\n  cursor: not-allowed !important;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:checked[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%2894, 100, 111%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:indeterminate[disabled] + .euiCheckbox__square {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%2894, 100, 111%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiCheckbox.euiCheckbox--inList, html.light-theme .euiCheckbox.euiCheckbox--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\nhtml.light-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__input,\\nhtml.light-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__square, html.light-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input,\\nhtml.light-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__square {\\n  top: 0;\\n}\\nhtml.light-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__input, html.light-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input {\\n  margin: 0;\\n}\\nhtml.light-theme .euiCheckboxGroup__item + .euiCheckboxGroup__item {\\n  margin-top: 4px;\\n}\\nhtml.light-theme .euiCheckboxGroup__item + .euiCheckboxGroup__item.euiCheckbox--compressed {\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiDescribedFormGroup {\\n  max-width: 800px;\\n}\\nhtml.light-theme .euiDescribedFormGroup + * {\\n  margin-top: 24px;\\n}\\nhtml.light-theme .euiDescribedFormGroup.euiDescribedFormGroup--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__description {\\n  padding-top: 8px;\\n}\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields {\\n  min-width: 0;\\n}\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child,\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel) {\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child::before,\\nhtml.light-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel)::before {\\n  content: \\\"\\\";\\n}\\nhtml.light-theme .euiDescribedFormGroup__descriptionColumn {\\n  min-width: min(20rem, 50%);\\n}\\nhtml.light-theme .euiFieldNumber {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\nhtml.light-theme .euiFieldNumber--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFieldNumber--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFieldNumber--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldNumber {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldNumber::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldNumber:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiFieldNumber:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFieldNumber--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldNumber--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldNumber--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldNumber--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldNumber--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldNumber--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFieldNumber--withIcon {\\n  padding-left: 40px;\\n}\\nhtml.light-theme .euiFieldNumber--withIcon.euiFieldNumber--compressed {\\n  padding-left: 32px;\\n}\\nhtml.light-theme .euiFieldPassword {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n}\\nhtml.light-theme .euiFieldPassword--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFieldPassword--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFieldPassword--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldPassword {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldPassword::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldPassword:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiFieldPassword:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFieldPassword--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldPassword--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldPassword--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldPassword--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldPassword--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldPassword--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFieldPassword.euiFieldPassword--compressed {\\n  padding-left: 32px;\\n}\\nhtml.light-theme .euiFieldPassword--withToggle::-ms-reveal {\\n  display: none;\\n}\\nhtml.light-theme .euiFieldSearch {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n  -webkit-appearance: textfield;\\n  /* 1 */\\n}\\nhtml.light-theme .euiFieldSearch--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFieldSearch--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFieldSearch--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldSearch {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldSearch::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldSearch:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiFieldSearch:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFieldSearch--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldSearch--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldSearch--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldSearch--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldSearch--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldSearch--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFieldSearch-isLoading {\\n  padding-right: 40px;\\n}\\nhtml.light-theme .euiFieldSearch-isLoading.euiFieldSearch--compressed {\\n  padding-right: 32px;\\n}\\nhtml.light-theme .euiFieldSearch::-webkit-search-decoration, html.light-theme .euiFieldSearch::-webkit-search-cancel-button {\\n  -webkit-appearance: none;\\n  /* 1, 2 */\\n}\\nhtml.light-theme .euiFieldSearch--compressed {\\n  padding-left: 32px;\\n}\\nhtml.light-theme .euiFieldText {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\nhtml.light-theme .euiFieldText--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFieldText--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFieldText--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldText {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldText::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldText:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiFieldText:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFieldText--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFieldText--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFieldText--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFieldText--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFieldText--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFieldText--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFieldText--withIcon {\\n  padding-left: 40px;\\n}\\nhtml.light-theme .euiFieldText--withIcon.euiFieldText--compressed {\\n  padding-left: 32px;\\n}\\nhtml.light-theme .euiFilePicker {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  position: relative;\\n}\\nhtml.light-theme .euiFilePicker--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFilePicker--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFilePicker--inGroup {\\n  height: 100%;\\n}\\nhtml.light-theme .euiFilePicker.euiFilePicker--large {\\n  border-radius: 6px;\\n  overflow: hidden;\\n  height: auto;\\n}\\nhtml.light-theme .euiFilePicker.euiFilePicker--large.euiFilePicker--compressed {\\n  border-radius: 4px;\\n}\\nhtml.light-theme .euiFilePicker__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiFilePicker__input:hover {\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiFilePicker__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled {\\n  opacity: 0;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled ~ .euiFilePicker__prompt {\\n  color: #98A2B3;\\n}\\nhtml.light-theme .euiFilePicker__icon {\\n  position: absolute;\\n  left: 12px;\\n  top: 12px;\\n  transition: transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.light-theme .euiFilePicker--compressed .euiFilePicker__icon {\\n  top: 8px;\\n  left: 8px;\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__icon {\\n  position: static;\\n  margin-bottom: 16px;\\n}\\nhtml.light-theme .euiFilePicker__prompt {\\n  padding-left: 40px;\\n  /* 2 */\\n  height: 40px;\\n  padding-top: 12px;\\n  padding-right: 12px;\\n  padding-bottom: 12px;\\n  pointer-events: none;\\n  /* 1 */\\n  border: 2px dashed #D3DAE6;\\n  border-radius: 6px;\\n  transition: border-color 150ms ease-in, background-color 150ms ease-in;\\n}\\nhtml.light-theme .euiFilePicker--compressed .euiFilePicker__prompt {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  padding-left: 32px;\\n  /* 2 */\\n  height: 32px;\\n  border-radius: 4px;\\n  box-shadow: none;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFilePicker--compressed .euiFilePicker__prompt {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__prompt {\\n  height: 128px;\\n  /* 4 */\\n  padding: 0 24px;\\n  display: flex;\\n  flex-direction: column;\\n  align-items: center;\\n  justify-content: center;\\n}\\nhtml.light-theme .euiFilePicker--large.euiFilePicker--compressed .euiFilePicker__prompt {\\n  height: 104px;\\n  /* 4 */\\n}\\nhtml.light-theme .euiFilePicker-isInvalid:not(.euiFilePicker__showDrop) .euiFilePicker__input:not(:disabled):not(:focus) + .euiFilePicker__prompt {\\n  border-color: #BD271E;\\n}\\nhtml.light-theme .euiFilePicker__promptText {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  line-height: 16px;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) .euiFilePicker__promptText {\\n  color: #0071c2;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__promptText {\\n  margin-top: -2px;\\n}\\nhtml.light-theme .euiFilePicker__clearButton,\\nhtml.light-theme .euiFilePicker__loadingSpinner {\\n  position: absolute;\\n  right: 12px;\\n  top: 12px;\\n}\\nhtml.light-theme .euiFilePicker--compressed .euiFilePicker__clearButton,\\nhtml.light-theme .euiFilePicker--compressed .euiFilePicker__loadingSpinner {\\n  top: 8px;\\n}\\nhtml.light-theme .euiFilePicker__clearButton {\\n  pointer-events: auto;\\n  /* 1 */\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton .euiFilePicker__clearIcon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 2px;\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__clearButton {\\n  position: relative;\\n  top: 0;\\n  right: 0;\\n}\\nhtml.light-theme .euiFilePicker__showDrop .euiFilePicker__prompt,\\nhtml.light-theme .euiFilePicker__input:focus + .euiFilePicker__prompt {\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  box-shadow: none;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-isLoading .euiFilePicker__prompt, html.light-theme .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-hasFiles .euiFilePicker__prompt {\\n  padding-right: 40px;\\n  /* 2 */\\n}\\nhtml.light-theme .euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  color: #343741;\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__promptText,\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__icon,\\nhtml.light-theme .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\nhtml.light-theme .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\nhtml.light-theme .euiFilePicker--large.euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  font-weight: 700;\\n}\\nhtml.light-theme .euiForm__error {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  list-style: disc;\\n}\\nhtml.light-theme .euiForm__errors {\\n  margin-bottom: 16px;\\n}\\nhtml.light-theme .euiSelect {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSelect--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiSelect--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiSelect--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiSelect {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiSelect::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSelect:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiSelect:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiSelect--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiSelect--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiSelect--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSelect--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSelect--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSelect--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiSelect--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSelect--inGroup {\\n  line-height: 38px;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSelect--inGroup.euiSelect--compressed {\\n  line-height: 30px;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSelect::-ms-expand {\\n  display: none;\\n}\\nhtml.light-theme .euiSelect:focus::-ms-value {\\n  color: #343741;\\n  background: transparent;\\n}\\nhtml.light-theme .euiSelect:-moz-focusring {\\n  color: transparent;\\n  text-shadow: 0 0 0 #343741;\\n}\\nhtml.light-theme .euiSuperSelect__listbox {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 300px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n}\\nhtml.light-theme .euiSuperSelect__listbox::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiSuperSelect__listbox::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiSuperSelect__listbox::-webkit-scrollbar-corner, html.light-theme .euiSuperSelect__listbox::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiSuperSelect__item {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 8px;\\n}\\nhtml.light-theme .euiSuperSelect__item:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiSuperSelect__item:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiSuperSelect__item:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #ABB4C4;\\n}\\nhtml.light-theme .euiSuperSelect__item--hasDividers:not(:last-of-type) {\\n  border-bottom: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiSuperSelectControl {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  display: block;\\n  /* 2 */\\n  text-align: left;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\nhtml.light-theme .euiSuperSelectControl--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiSuperSelectControl--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiSuperSelectControl {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiSuperSelectControl::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSuperSelectControl:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiSuperSelectControl:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiSuperSelectControl--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiSuperSelectControl--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiSuperSelectControl-isInvalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiSuperSelectControl--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.light-theme .euiSuperSelectControl__placeholder {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n}\\nhtml.light-theme .euiSuperSelectControl.euiSuperSelect--isOpen__button {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFormControlLayout {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n}\\nhtml.light-theme .euiFormControlLayout--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFormControlLayout--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiFormControlLayout--inGroup {\\n  height: 100%;\\n}\\nhtml.light-theme .euiFormControlLayout--1icons {\\n  --eui-form-control-layout-icons-padding: 34px;\\n  padding-right: 34px;\\n}\\nhtml.light-theme .euiFormControlLayout--1icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 26px;\\n  padding-right: 26px;\\n}\\nhtml.light-theme .euiFormControlLayout--2icons {\\n  --eui-form-control-layout-icons-padding: 56px;\\n  padding-right: 56px;\\n}\\nhtml.light-theme .euiFormControlLayout--2icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 44px;\\n  padding-right: 44px;\\n}\\nhtml.light-theme .euiFormControlLayout--3icons {\\n  --eui-form-control-layout-icons-padding: 78px;\\n  padding-right: 78px;\\n}\\nhtml.light-theme .euiFormControlLayout--3icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 62px;\\n  padding-right: 62px;\\n}\\nhtml.light-theme .euiFormControlLayout--4icons {\\n  --eui-form-control-layout-icons-padding: 100px;\\n  padding-right: 100px;\\n}\\nhtml.light-theme .euiFormControlLayout--4icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 80px;\\n  padding-right: 80px;\\n}\\nhtml.light-theme .euiFormControlLayout--5icons {\\n  --eui-form-control-layout-icons-padding: 122px;\\n  padding-right: 122px;\\n}\\nhtml.light-theme .euiFormControlLayout--5icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 98px;\\n  padding-right: 98px;\\n}\\nhtml.light-theme .euiFormControlLayout__childrenWrapper {\\n  position: relative;\\n}\\nhtml.light-theme .euiFormControlLayout--group {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFormControlLayout--group {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFormControlLayout--group > *,\\nhtml.light-theme .euiFormControlLayout--group .euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiText,\\nhtml.light-theme .euiFormControlLayout--group .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group .euiButtonIcon {\\n  height: 100%;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper {\\n  flex-grow: 1;\\n  overflow: hidden;\\n  /* 2 */\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  flex-shrink: 0;\\n  height: 100%;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n  background-color: #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon, html.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty {\\n  transform: none !important;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon .euiIcon, html.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon .euiIcon,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty .euiIcon {\\n  background: none !important;\\n  padding: 0;\\n  width: 16px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiButtonIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiButtonIcon:not(:focus) {\\n  background-color: #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiButtonIcon:focus-visible {\\n  outline: 2px solid #0071c2;\\n  outline-offset: -2px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  height: 100%;\\n  background-color: #e9edf3;\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group > .euiFormControlLayout__prepend,\\nhtml.light-theme .euiFormControlLayout--group > .euiFormControlLayout__append {\\n  max-width: 50%;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  background-color: #e9edf3;\\n  padding: 12px;\\n  line-height: 16px !important;\\n  cursor: default !important;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper):not(input),\\nhtml.light-theme .euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper):not(input) {\\n  margin-left: -12px;\\n}\\nhtml.light-theme .euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -12px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiButtonEmpty {\\n  border-right: none;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ .euiButtonEmpty,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ * .euiButtonEmpty {\\n  border-right: none;\\n  border-left: none;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n  overflow: hidden;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  padding: 8px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper),\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper) {\\n  margin-left: -8px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -8px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--readOnly {\\n  cursor: default;\\n  background: #e9edf3;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--readOnly input {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFormControlLayoutDelimited {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited > .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  width: 100%;\\n  background-color: #fbfcfd;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper, html.light-theme .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper > *:not(.euiFormControlLayoutDelimited__delimiter):not(.euiFormControlLayoutIcons) {\\n  width: 100%;\\n  max-width: none;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled] {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled]::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled]:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled]::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=-isDisabled] .euiFormControlLayout__childrenWrapper {\\n  background-color: #eef2f7;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] .euiFormControlLayout__childrenWrapper {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited--isInvalid .euiFormControlLayout__childrenWrapper {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited__input {\\n  box-shadow: none !important;\\n  border-radius: 0 !important;\\n  text-align: center;\\n  height: 100%;\\n  min-width: 0;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited__delimiter {\\n  align-self: stretch;\\n  flex-grow: 0;\\n  display: flex;\\n  align-items: center;\\n  line-height: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons {\\n  pointer-events: none;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons > * + * {\\n  margin-left: 6px;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons--absolute {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 12px;\\n}\\nhtml.light-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--absolute {\\n  left: 8px;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons--static {\\n  position: static;\\n  height: 100%;\\n  align-self: stretch;\\n  flex-grow: 0;\\n  padding-inline: 12px;\\n}\\nhtml.light-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--static {\\n  padding-inline: 8px;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons--left {\\n  z-index: 1;\\n}\\nhtml.light-theme .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 12px;\\n}\\nhtml.light-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 8px;\\n}\\nhtml.light-theme *:disabled + .euiFormControlLayoutIcons {\\n  cursor: not-allowed;\\n  color: #98A2B3;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton .euiFormControlLayoutClearButton__icon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 2px;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small {\\n  width: 12px;\\n  height: 12px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 12px;\\n  line-height: 0;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFormControlLayoutClearButton--small .euiFormControlLayoutClearButton__icon {\\n  width: 6px;\\n  height: 6px;\\n  fill: #FFF;\\n  stroke: #FFF;\\n  stroke-width: 4px;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon {\\n  pointer-events: none;\\n  font-size: 0;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable .euiFormControlLayoutCustomIcon__icon {\\n  vertical-align: baseline;\\n  transform: none;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFormControlLayoutCustomIcon--clickable:disabled {\\n  cursor: not-allowed;\\n  color: #98A2B3;\\n}\\nhtml.light-theme .euiFormErrorText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #BD271E;\\n}\\nhtml.light-theme .euiFormLegend {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-weight: 600;\\n}\\nhtml.light-theme .euiFormLegend:not(.euiFormLegend-isHidden) {\\n  margin-bottom: 8px;\\n}\\nhtml.light-theme .euiFormLegend:not(.euiFormLegend-isHidden).euiFormLegend--compressed {\\n  margin-bottom: 4px;\\n}\\nhtml.light-theme .euiFormHelpText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #69707D;\\n}\\nhtml.light-theme .euiFormLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-weight: 600;\\n  display: inline-block;\\n  transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.light-theme .euiFormLabel.euiFormLabel-isInvalid {\\n  color: #BD271E;\\n  /* 1 */\\n}\\nhtml.light-theme .euiFormLabel.euiFormLabel-isFocused {\\n  color: #07C;\\n  /* 1 */\\n}\\nhtml.light-theme .euiFormLabel[for] {\\n  cursor: pointer;\\n  /* 2 */\\n}\\nhtml.light-theme .euiFormLabel[for].euiFormLabel-isDisabled {\\n  cursor: default;\\n  /* 2 */\\n}\\nhtml.light-theme .euiFormRow {\\n  display: flex;\\n  /* 1 */\\n  flex-direction: column;\\n  /* 1 */\\n  max-width: 400px;\\n}\\nhtml.light-theme .euiFormRow + .euiFormRow,\\nhtml.light-theme .euiFormRow + .euiButton {\\n  margin-top: 16px;\\n}\\nhtml.light-theme .euiFormRow--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiFormRow--hasEmptyLabelSpace {\\n  margin-top: 20px;\\n  /* 2 */\\n  min-height: 40px;\\n  padding-bottom: 0;\\n  justify-content: center;\\n}\\nhtml.light-theme .euiFormRow__labelWrapper {\\n  display: flex;\\n  flex-wrap: wrap;\\n  justify-content: space-between;\\n  margin-bottom: 4px;\\n}\\nhtml.light-theme .euiFormRow--horizontal {\\n  flex-direction: row;\\n  align-items: stretch;\\n}\\nhtml.light-theme .euiFormRow--horizontal .euiFormRow__label {\\n  -webkit-hyphens: auto;\\n  -ms-hyphens: auto;\\n      hyphens: auto;\\n}\\nhtml.light-theme .euiFormRow--horizontal .euiFormRow__labelWrapper {\\n  display: block;\\n  line-height: 31px;\\n  width: calc(33% - 8px);\\n  margin-right: 8px;\\n  margin-bottom: 0;\\n}\\nhtml.light-theme .euiFormRow--horizontal .euiFormRow__fieldWrapper {\\n  width: 67%;\\n}\\nhtml.light-theme .euiFormRow--horizontal + .euiFormRow--horizontal {\\n  margin-top: 8px;\\n}\\nhtml.light-theme .euiFormRow--horizontal + .euiFormRow--horizontal.euiFormRow--hasSwitch {\\n  margin-top: 12px;\\n}\\nhtml.light-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__labelWrapper {\\n  line-height: 19px;\\n  width: auto;\\n  min-width: calc(33% - 8px);\\n}\\nhtml.light-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper {\\n  width: auto;\\n}\\nhtml.light-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper .euiSwitch--compressed {\\n  margin-top: 2px;\\n}\\nhtml.light-theme .euiFormRow--horizontal.euiFormRow--hasSwitch + .euiFormRow--horizontal {\\n  margin-top: 12px;\\n}\\nhtml.light-theme .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 40px;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiFormRow--compressed.euiFormRow--hasEmptyLabelSpace {\\n  min-height: 32px;\\n}\\nhtml.light-theme .euiFormRow--compressed .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 32px;\\n}\\nhtml.light-theme .euiRadio {\\n  position: relative;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\nhtml.light-theme .euiRadio .euiRadio__input ~ .euiRadio__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input + .euiRadio__circle {\\n  padding: 7px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 14px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:checked + .euiRadio__circle {\\n  border-color: #07C;\\n  background-color: #07C;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%28255, 255, 255%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiRadio .euiRadio__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input[disabled] ~ .euiRadio__label {\\n  color: #98A2B3;\\n  cursor: not-allowed !important;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input[disabled] + .euiRadio__circle {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:checked[disabled] + .euiRadio__circle {\\n  border-color: #D3DAE6;\\n  background-color: #D3DAE6;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%2894, 100, 111%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiRadio.euiRadio--inList, html.light-theme .euiRadio.euiRadio--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\nhtml.light-theme .euiRadio.euiRadio--inList .euiRadio__input,\\nhtml.light-theme .euiRadio.euiRadio--inList .euiRadio__circle, html.light-theme .euiRadio.euiRadio--noLabel .euiRadio__input,\\nhtml.light-theme .euiRadio.euiRadio--noLabel .euiRadio__circle {\\n  top: 0;\\n}\\nhtml.light-theme .euiRadio.euiRadio--inList .euiRadio__input, html.light-theme .euiRadio.euiRadio--noLabel .euiRadio__input {\\n  margin: 0;\\n}\\nhtml.light-theme .euiRadioGroup__item + .euiRadioGroup__item {\\n  margin-top: 4px;\\n}\\nhtml.light-theme .euiRadioGroup__item + .euiRadioGroup__item.euiRadio--compressed {\\n  margin-top: 0;\\n}\\nhtml.light-theme .euiSwitch {\\n  position: relative;\\n  display: inline-flex;\\n  align-items: flex-start;\\n  min-height: 20px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__label {\\n  cursor: pointer;\\n  padding-left: 8px;\\n  line-height: 20px;\\n  font-size: 14px;\\n  vertical-align: middle;\\n  display: inline-block;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button {\\n  flex-shrink: 0;\\n  line-height: 0;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__body {\\n  background-color: rgba(105, 112, 125, 0.75);\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 0;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon {\\n  right: -8px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon.euiSwitch__icon--checked {\\n  right: auto;\\n  left: -34px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled:hover,\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled ~ .euiSwitch__label:hover {\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__body {\\n  background-color: rgba(211, 218, 230, 0.5);\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__thumb {\\n  background-color: rgba(0, 0, 0, 0);\\n  border-color: rgba(105, 112, 125, 0.5);\\n  box-shadow: none;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__icon {\\n  fill: #69707D;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:disabled + .euiSwitch__label {\\n  color: #98A2B3;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__body {\\n  pointer-events: none;\\n  width: 44px;\\n  height: 20px;\\n  background-color: #07C;\\n  display: inline-block;\\n  position: relative;\\n  border-radius: 20px;\\n  vertical-align: middle;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__thumb {\\n  padding: 9px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 18px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  position: absolute;\\n  display: inline-block;\\n  left: 24px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__track {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  overflow: hidden;\\n  border-radius: 20px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__icon {\\n  position: absolute;\\n  right: -34px;\\n  top: 2px;\\n  bottom: 0;\\n  width: 42px;\\n  height: 16px;\\n  transition: left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), right 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  fill: #FFF;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__icon--checked {\\n  right: auto;\\n  left: -8px;\\n  fill: #FFF;\\n}\\nhtml.light-theme .euiSwitch:hover .euiSwitch__button:not(:disabled) .euiSwitch__thumb {\\n  transform: scale(1.05);\\n}\\nhtml.light-theme .euiSwitch:hover .euiSwitch__button:active .euiSwitch__thumb {\\n  transform: scale(0.95);\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed {\\n  min-height: 16px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__label {\\n  line-height: 16px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__body {\\n  width: 28px;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__thumb {\\n  padding: 6px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 12px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__track {\\n  border-radius: 16px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini {\\n  min-height: 10px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__label {\\n  line-height: 10px;\\n  font-size: 12px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__body {\\n  width: 22px;\\n  height: 10px;\\n  border-radius: 10px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__thumb {\\n  padding: 3px;\\n  border: 1px solid #939496;\\n  background: #FFF no-repeat center;\\n  border-radius: 6px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__track {\\n  border-radius: 10px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb, html.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 1px;\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb, html.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\nhtml.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb {\\n  border-color: rgba(105, 112, 125, 0.5);\\n}\\nhtml.light-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true] .euiSwitch__thumb, html.light-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true] .euiSwitch__thumb {\\n  border-color: #07C;\\n}\\nhtml.light-theme .euiTextArea {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  line-height: 1.5;\\n}\\nhtml.light-theme .euiTextArea--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.light-theme .euiTextArea--compressed {\\n  height: 32px;\\n}\\nhtml.light-theme .euiTextArea--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiTextArea {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiTextArea::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiTextArea:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.light-theme .euiTextArea:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.light-theme .euiTextArea--compressed {\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.light-theme .euiTextArea--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.light-theme .euiTextArea--compressed:invalid {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.light-theme .euiTextArea--compressed:focus {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea--compressed:disabled {\\n  color: #98A2B3;\\n  -webkit-text-fill-color: #98A2B3;\\n  cursor: not-allowed;\\n  background: #eef2f7;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea--compressed:disabled::-moz-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea--compressed:disabled:-ms-input-placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea--compressed:disabled::placeholder {\\n  color: #98A2B3;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiTextArea--compressed[readOnly] {\\n  cursor: default;\\n  color: #343741;\\n  -webkit-text-fill-color: #343741;\\n  background: #FFF;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(17, 42, 134, 0.1);\\n}\\nhtml.light-theme .euiTextArea--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiTextArea, html.light-theme .euiTextArea--compressed {\\n  height: auto;\\n}\\nhtml.light-theme .euiFormControlLayout--euiTextArea {\\n  height: auto;\\n}\\nhtml.light-theme .euiFormControlLayout--euiTextArea .euiFormControlLayoutIcons {\\n  top: auto;\\n  bottom: 12px;\\n}\\nhtml.light-theme .euiTextArea--resizeVertical {\\n  resize: vertical;\\n}\\nhtml.light-theme .euiTextArea--resizeHorizontal {\\n  resize: horizontal;\\n}\\nhtml.light-theme .euiTextArea--resizeBoth {\\n  resize: both;\\n}\\nhtml.light-theme .euiTextArea--resizeNone {\\n  resize: none;\\n}\\nhtml.light-theme .euiMarkdownEditor {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .euiMarkdownEditor--isPreviewing .euiMarkdownEditor__toggleContainer {\\n  display: none;\\n}\\nhtml.light-theme .euiMarkdownEditor--fullHeight {\\n  height: 100%;\\n}\\nhtml.light-theme .euiMarkdownEditor--fullHeight .euiMarkdownEditorTextArea {\\n  resize: none;\\n}\\nhtml.light-theme .euiMarkdownEditor--fullHeight .euiMarkdownEditorDropZone {\\n  height: 100%;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone {\\n  display: flex;\\n  position: relative;\\n  flex-direction: column;\\n  min-height: \\\"150px\\\";\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone__input:hover {\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorFooter,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(0, 119, 204, 0.1) !important;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%) !important;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorFooter,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea:focus,\\nhtml.light-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(189, 39, 30, 0.1) !important;\\n}\\nhtml.light-theme .euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea,\\nhtml.light-theme .euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #BD271E, #BD271E 2px, transparent 2px, transparent 100%) !important;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__blockquote {\\n  border-left-color: rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiHorizontalRule {\\n  background-color: rgba(0, 0, 0, 0.15);\\n  color: rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table {\\n  border-left: 1px solid rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td {\\n  border-top: 1px solid rgba(0, 0, 0, 0.15);\\n  border-bottom: 1px solid rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid rgba(0, 0, 0, 0.15);\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__blockquote {\\n  border-left-color: #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiHorizontalRule {\\n  background-color: #69707D;\\n  color: #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table {\\n  border-left: 1px solid #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #69707D;\\n  border-bottom: 1px solid #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #69707D;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__blockquote {\\n  border-left-color: #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiHorizontalRule {\\n  background-color: #00BFB3;\\n  color: #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table {\\n  border-left: 1px solid #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #00BFB3;\\n  border-bottom: 1px solid #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #00BFB3;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiHorizontalRule {\\n  background-color: #F04E98;\\n  color: #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F04E98;\\n  border-bottom: 1px solid #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F04E98;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiHorizontalRule {\\n  background-color: #FEC514;\\n  color: #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FEC514;\\n  border-bottom: 1px solid #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FEC514;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__blockquote {\\n  border-left-color: #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiHorizontalRule {\\n  background-color: #BD271E;\\n  color: #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table {\\n  border-left: 1px solid #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #BD271E;\\n  border-bottom: 1px solid #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #BD271E;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiHorizontalRule {\\n  background-color: #FFF;\\n  color: #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FFF;\\n  border-bottom: 1px solid #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FFF;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th:last-child,\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\nhtml.light-theme .euiMarkdownFormat .euiCheckbox {\\n  margin-bottom: 0 !important;\\n}\\nhtml.light-theme .euiMarkdownFormat .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  top: 50%;\\n  transform: translateY(-50%);\\n}\\nhtml.light-theme .euiMarkdownFormat .euiMarkdownFormat__table {\\n  display: block;\\n  width: 100%;\\n  overflow: auto;\\n  border-spacing: 0;\\n  border-collapse: collapse;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter {\\n  display: inline-flex;\\n  padding: 4px;\\n  border: 1px solid #D3DAE6;\\n  align-items: center;\\n  background: #fafbfd;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__popover {\\n  width: 300px;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__actions {\\n  flex: 1;\\n  display: inline-flex;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__actions > button,\\nhtml.light-theme .euiMarkdownEditorFooter__actions > span {\\n  margin-right: 4px;\\n  align-self: center;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError {\\n  position: relative;\\n  left: -1px;\\n  line-height: 1;\\n  border-radius: 6px;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError > span {\\n  padding: 0 4px;\\n}\\nhtml.light-theme .euiMarkdownEditorFooter__helpButton > svg {\\n  width: 26px;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background: #FFF;\\n  min-height: \\\"150px\\\";\\n  overflow-y: auto;\\n  border: 1px solid #D3DAE6;\\n  padding: 12px;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview::-webkit-scrollbar-corner, html.light-theme .euiMarkdownEditorPreview::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input ~ .euiCheckbox__label {\\n  cursor: default;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input:focus:not(:checked) + .euiCheckbox__square {\\n  border-color: #939496;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  width: 100%;\\n  height: 100%;\\n  min-height: \\\"150px\\\";\\n  padding: 12px;\\n  border: 1px solid #D3DAE6;\\n  border-bottom: none;\\n  line-height: 1.5;\\n  resize: vertical;\\n  background-color: #fbfcfd;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  margin: 0;\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::-moz-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea:-ms-input-placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::placeholder {\\n  color: #69707D;\\n  opacity: 1;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-corner, html.light-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea:focus, html.light-theme .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: white;\\n  background-image: linear-gradient(to top, #07C, #07C 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea-isReadOnly {\\n  background: #FFF;\\n  cursor: unset;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea-isReadOnly:focus, html.light-theme .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea-isReadOnly {\\n  background: none;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar {\\n  display: flex;\\n  flex-wrap: wrap;\\n  background: #F5F7FA;\\n  border: 1px solid #D3DAE6;\\n  border-color: #D3DAE6;\\n  border-bottom: none;\\n  padding: 4px;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar__buttons {\\n  display: flex;\\n  flex-wrap: wrap;\\n  flex: 1;\\n  align-items: center;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar__buttons > * {\\n  margin-right: 4px;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar__divider {\\n  content: \\\"\\\";\\n  height: 24px;\\n  display: block;\\n  margin-left: 4px;\\n  padding-right: 4px;\\n  border-left: 1px solid #D3DAE6;\\n}\\nhtml.light-theme .euiMarkdownTooltip__icon {\\n  transform: translateY(-1px);\\n}\\nhtml.light-theme .euiSelectable {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .euiSelectable-fullHeight {\\n  height: 100%;\\n}\\nhtml.light-theme .euiSelectableList:has(:focus-visible) {\\n  outline: 2px solid currentColor;\\n  outline-style: auto;\\n  outline-offset: 1px;\\n}\\nhtml.light-theme .euiSelectableList-fullHeight {\\n  flex-grow: 1;\\n}\\nhtml.light-theme .euiSelectableList-bordered {\\n  overflow: hidden;\\n  border: 1px solid #D3DAE6;\\n  border-radius: 6px;\\n}\\nhtml.light-theme .euiSelectableList__list {\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\nhtml.light-theme .euiSelectableList__list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .euiSelectableList__list::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .euiSelectableList__list::-webkit-scrollbar-corner, html.light-theme .euiSelectableList__list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .euiSelectableList__list:focus, html.light-theme .euiSelectableList__list > ul:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiSelectableList__groupLabel {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 700;\\n  display: flex;\\n  align-items: center;\\n  border-bottom: 1px solid #eef2f7;\\n  padding: 4px 12px;\\n}\\nhtml.light-theme .euiSelectableListItem {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  display: inline-flex;\\n  width: 100%;\\n  text-align: left;\\n  cursor: pointer;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiSelectableListItem:not(:last-of-type) {\\n  border-bottom: 1px solid #eef2f7;\\n}\\nhtml.light-theme .euiSelectableListItem-isFocused:not([aria-disabled=true]), html.light-theme .euiSelectableListItem:hover:not([aria-disabled=true]) {\\n  color: #0071c2;\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiSelectableListItem-isFocused:not([aria-disabled=true]) .euiSelectableListItem__text, html.light-theme .euiSelectableListItem:hover:not([aria-disabled=true]) .euiSelectableListItem__text {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiSelectableListItem[aria-disabled=true] {\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\nhtml.light-theme .euiSelectableListItem--paddingSmall .euiSelectableListItem__content {\\n  padding: 4px 12px;\\n}\\nhtml.light-theme .euiSelectableListItem__content {\\n  width: 100%;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.light-theme .euiSelectableListItem__icon,\\nhtml.light-theme .euiSelectableListItem__prepend {\\n  margin-right: 12px;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .euiSelectableListItem__append {\\n  margin-left: 12px;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .euiSelectableListItem__text {\\n  flex-grow: 1;\\n}\\nhtml.light-theme .euiSelectableListItem__text--truncate {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .euiSelectableMessage {\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n  /* 1 */\\n  display: flex;\\n  flex-direction: column;\\n  justify-content: center;\\n  align-items: center;\\n}\\nhtml.light-theme .euiSelectableMessage--bordered {\\n  overflow: hidden;\\n  border: 1px solid #D3DAE6;\\n  border-radius: 6px;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__listItem .euiSelectableListItem__text {\\n  text-decoration: none !important;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__listItem[class*=-isFocused]:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle, html.light-theme .euiSelectableTemplateSitewide__listItem:hover:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMetasList {\\n  display: block;\\n  margin-top: 4px;\\n  font-size: 12px;\\n  color: #69707D;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta:not(:last-of-type)::after {\\n  content: \\\"•\\\";\\n  margin: 0 4px;\\n  color: #69707D;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--application {\\n  color: #4a7194;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--deployment {\\n  color: #387765;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--article {\\n  color: #7c609e;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--case {\\n  color: #aa4b38;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiSelectableTemplateSitewide__optionMeta--platform {\\n  color: #7a6c31;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiTable {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-feature-settings: \\\"calt\\\" 1, \\\"kern\\\" 1, \\\"liga\\\" 1, \\\"tnum\\\" 1;\\n  width: 100%;\\n  table-layout: fixed;\\n  border: none;\\n  border-collapse: collapse;\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiTable.euiTable--auto {\\n  table-layout: auto;\\n}\\nhtml.light-theme .euiTableCaption {\\n  position: relative;\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  html.light-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  html.light-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  html.light-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\nhtml.light-theme .euiTableFooterCell,\\nhtml.light-theme .euiTableHeaderCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #1a1c21;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  font-weight: 500;\\n  border: none;\\n}\\nhtml.light-theme .euiTableFooterCell .euiTableHeaderButton,\\nhtml.light-theme .euiTableHeaderCell .euiTableHeaderButton {\\n  text-align: left;\\n  font-weight: 500;\\n}\\nhtml.light-theme .euiTableFooterCell .euiTableCellContent__text,\\nhtml.light-theme .euiTableHeaderCell .euiTableCellContent__text {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 600;\\n}\\nhtml.light-theme .euiTableHeaderButton {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  color: inherit;\\n  width: 100%;\\n}\\nhtml.light-theme .euiTableHeaderButton:hover .euiTableCellContent__text, html.light-theme .euiTableHeaderButton:focus .euiTableCellContent__text {\\n  text-decoration: underline;\\n  color: #07C;\\n}\\nhtml.light-theme .euiTableHeaderButton:hover .euiTableSortIcon, html.light-theme .euiTableHeaderButton:focus .euiTableSortIcon {\\n  fill: #07C;\\n}\\nhtml.light-theme .euiTableSortIcon {\\n  margin-left: 4px;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .euiTableHeaderButton-isSorted .euiTableSortIcon {\\n  fill: #1a1c21;\\n}\\nhtml.light-theme .euiTableHeaderCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n  border: none;\\n}\\nhtml.light-theme .euiTableRow:hover {\\n  background-color: #fafbfd;\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isClickable:hover {\\n  background-color: rgba(0, 119, 204, 0.05);\\n  cursor: pointer;\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isClickable:focus {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isExpandedRow {\\n  background-color: #fafbfd;\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isExpandedRow.euiTableRow-isSelectable .euiTableCellContent {\\n  padding-left: 40px;\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isSelected {\\n  background-color: rgba(227, 240, 249, 0.37);\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(227, 240, 249, 0.37);\\n}\\nhtml.light-theme .euiTableRow.euiTableRow-isSelected:hover, html.light-theme .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .euiTableRowCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  color: #343741;\\n}\\nhtml.light-theme .euiTableRowCell--top {\\n  vertical-align: top;\\n}\\nhtml.light-theme .euiTableRowCell--bottom {\\n  vertical-align: bottom;\\n}\\nhtml.light-theme .euiTableRowCell--baseline {\\n  vertical-align: baseline;\\n}\\nhtml.light-theme .euiTableRowCell.euiTableRowCell--isMobileHeader {\\n  display: none;\\n}\\nhtml.light-theme .euiTableRowCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #D3DAE6;\\n  border-bottom: 1px solid #D3DAE6;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n}\\nhtml.light-theme .euiTableFooterCell {\\n  background-color: #F5F7FA;\\n}\\nhtml.light-theme .euiTableCellContent {\\n  overflow: hidden;\\n  /* 4 */\\n  display: flex;\\n  align-items: center;\\n  /* 1 */\\n  padding: 8px;\\n  /* 2 */\\n}\\nhtml.light-theme .euiTableCellContent__text {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 4 */\\n  min-width: 0;\\n  text-overflow: ellipsis;\\n}\\nhtml.light-theme .euiTableCellContent--alignRight {\\n  justify-content: flex-end;\\n  text-align: right;\\n}\\nhtml.light-theme .euiTableCellContent--alignCenter {\\n  justify-content: center;\\n  text-align: center;\\n}\\nhtml.light-theme .euiTableHeaderCell,\\nhtml.light-theme .euiTableFooterCell,\\nhtml.light-theme .euiTableCellContent--truncateText {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .euiTableHeaderCell .euiTableCellContent__text,\\nhtml.light-theme .euiTableFooterCell .euiTableCellContent__text,\\nhtml.light-theme .euiTableCellContent--truncateText .euiTableCellContent__text {\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiTableCellContent--overflowingContent {\\n  overflow: visible;\\n  white-space: normal;\\n  word-break: break-word;\\n}\\nhtml.light-theme .euiTableCellContent--showOnHover > *:not(:first-child) {\\n  margin-left: 8px;\\n}\\nhtml.light-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n  flex-shrink: 0;\\n  opacity: 0.7;\\n  filter: grayscale(100%);\\n  transition: opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1), filter 250ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.light-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n  filter: grayscale(0%);\\n  opacity: 0;\\n}\\nhtml.light-theme .euiTableRow-hasActions:hover .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem,\\nhtml.light-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover:focus-within .euiTableCellContent__hoverItem {\\n  opacity: 1;\\n  filter: grayscale(0%);\\n}\\nhtml.light-theme .euiTableRow-isExpandedRow .euiTableCellContent {\\n  -webkit-animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n  animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n}\\n@-webkit-keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\n@keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\nhtml.light-theme .euiTableRowCell__mobileHeader {\\n  display: none;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  html.light-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  html.light-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  html.light-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #69707D;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n  html.light-theme .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #D3DAE6;\\n    box-shadow: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #fafbfd;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #feedf5;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #e6f1fa;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #e6f9f7;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #fff9e8;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #f8e9e9;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    background-color: #FFF;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(152, 162, 179, 0.1);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\nhtml.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(227, 240, 249, 0.37);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #69707D;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n  html.light-theme .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.08), 0 2.6px 8px -1px rgba(0, 0, 0, 0.06), 0 5.7px 12px -1px rgba(0, 0, 0, 0.05), 0 15px 15px -1px rgba(0, 0, 0, 0.04);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #D3DAE6;\\n    box-shadow: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #fafbfd;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #feedf5;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #e6f1fa;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #e6f9f7;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #fff9e8;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #f8e9e9;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    background-color: #FFF;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(152, 162, 179, 0.1);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\nhtml.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(227, 240, 249, 0.37);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(152, 162, 179, 0.1) 0, rgba(152, 162, 179, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #FFF;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n  html.light-theme .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\nhtml.light-theme .euiTableHeaderMobile,\\nhtml.light-theme .euiTableHeaderCell--hideForDesktop {\\n  display: none;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.light-theme .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n  html.light-theme .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.light-theme .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n  html.light-theme .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\nhtml.light-theme .euiComboBox--appended .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 6px;\\n  border-bottom-left-radius: 6px;\\n}\\nhtml.light-theme .euiComboBox--appended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n}\\nhtml.light-theme .euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 6px;\\n  border-bottom-right-radius: 6px;\\n}\\nhtml.light-theme .euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 4px;\\n  border-bottom-right-radius: 4px;\\n}\\nhtml.light-theme .euiDataGrid--fontSizeLarge .euiDataGridRowCell {\\n  font-size: 16px;\\n  font-size: 1.1428571429rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.light-theme .euiFormControlLayout--group {\\n  border-radius: 6px;\\n  background-color: #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend:first-child {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append:last-child {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group [class*=euiButton]:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: -2px;\\n}\\nhtml.light-theme .euiFormControlLayout--group [class*=euiButton]:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiFormControlLayout--group [class*=euiButton]:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor:last-child [class*=euiButton],\\nhtml.light-theme .euiFormControlLayout--group .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSuperSelectControl,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 6px 0 0 6px;\\n}\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSuperSelectControl,\\nhtml.light-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  border-radius: 4px;\\n  background-color: #e9edf3;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed.euiFormControlLayout--readOnly input {\\n  background-color: #FFF;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 4px 0 0 4px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child [class*=euiButton],\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\nhtml.light-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited {\\n  border-radius: 6px;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 6px 0 0 6px;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 6px;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 4px 0 0 4px;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 4px;\\n  overflow: hidden;\\n}\\nhtml.light-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 4px 4px 0;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus:focus-visible + .euiRadio__circle {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiRadio .euiRadio__input:focus:not(:focus-visible) + .euiRadio__circle {\\n  outline: none;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus:focus-visible + .euiCheckbox__square {\\n  outline: 2px solid #0071c2;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiCheckbox .euiCheckbox__input:focus:not(:focus-visible) + .euiCheckbox__square {\\n  outline: none;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: none;\\n}\\nhtml.light-theme .euiHue {\\n  position: relative;\\n  height: 12px;\\n  border-radius: 12px;\\n  margin: 8px 0;\\n}\\nhtml.light-theme .euiHue::before, html.light-theme .euiHue::after {\\n  display: none;\\n}\\nhtml.light-theme .euiHue__range {\\n  top: -6px;\\n}\\nhtml.light-theme .euiHue__range::-webkit-slider-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.light-theme .euiHue__range::-moz-range-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.light-theme .euiHue__range::-ms-thumb {\\n  border: 3px solid #FFF;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.light-theme .euiHue__range:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\nhtml.light-theme .euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\nhtml.light-theme .euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #0071c2;\\n  border: 3px solid #FFF;\\n}\\nhtml.light-theme .euiHue__range:focus:not(:focus-visible)::-webkit-slider-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.light-theme .euiHue__range:focus:not(:focus-visible)::-moz-range-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.light-theme .euiHue__range:focus:not(:focus-visible)::-ms-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.light-theme .euiHue__range:focus:focus-visible {\\n  outline: none;\\n}\\nhtml.light-theme .euiMarkdownEditorToolbar {\\n  border-radius: 6px 6px 0 0;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea:focus {\\n  outline: none;\\n}\\nhtml.light-theme .euiMarkdownEditorTextArea:focus:focus-visible {\\n  outline-style: none;\\n}\\nhtml.light-theme .euiMarkdownEditorPreview,\\nhtml.light-theme .euiMarkdownEditorFooter {\\n  border-radius: 0 0 6px 6px;\\n}\\nhtml.light-theme *, html.light-theme *::before, html.light-theme *::after {\\n  box-sizing: border-box;\\n}\\nhtml.light-theme html, html.light-theme body, html.light-theme div, html.light-theme span, html.light-theme applet, html.light-theme object, html.light-theme iframe,\\nhtml.light-theme h1, html.light-theme h2, html.light-theme h3, html.light-theme h4, html.light-theme h5, html.light-theme h6, html.light-theme p, html.light-theme blockquote, html.light-theme pre,\\nhtml.light-theme a, html.light-theme abbr, html.light-theme acronym, html.light-theme address, html.light-theme big, html.light-theme cite, html.light-theme code,\\nhtml.light-theme del, html.light-theme dfn, html.light-theme em, html.light-theme img, html.light-theme ins, html.light-theme kbd, html.light-theme q, html.light-theme s, html.light-theme samp,\\nhtml.light-theme small, html.light-theme strike, html.light-theme strong, html.light-theme sub, html.light-theme sup, html.light-theme tt, html.light-theme var,\\nhtml.light-theme b, html.light-theme u, html.light-theme i, html.light-theme center,\\nhtml.light-theme dl, html.light-theme dt, html.light-theme dd, html.light-theme ol, html.light-theme ul, html.light-theme li,\\nhtml.light-theme fieldset, html.light-theme form, html.light-theme label, html.light-theme legend,\\nhtml.light-theme table, html.light-theme caption, html.light-theme tbody, html.light-theme tfoot, html.light-theme thead, html.light-theme tr, html.light-theme th, html.light-theme td,\\nhtml.light-theme article, html.light-theme aside, html.light-theme canvas, html.light-theme details, html.light-theme embed,\\nhtml.light-theme figure, html.light-theme figcaption, html.light-theme footer, html.light-theme header, html.light-theme hgroup,\\nhtml.light-theme menu, html.light-theme nav, html.light-theme output, html.light-theme ruby, html.light-theme section, html.light-theme summary,\\nhtml.light-theme time, html.light-theme mark, html.light-theme audio, html.light-theme video {\\n  margin: 0;\\n  padding: 0;\\n  border: none;\\n  vertical-align: baseline;\\n}\\nhtml.light-theme code, html.light-theme pre, html.light-theme kbd, html.light-theme samp {\\n  font-family: \\\"Roboto Mono\\\", Menlo, Courier, monospace;\\n}\\nhtml.light-theme h1, html.light-theme h2, html.light-theme h3, html.light-theme h4, html.light-theme h5, html.light-theme h6, html.light-theme p {\\n  font-family: inherit;\\n  font-weight: inherit;\\n  font-size: inherit;\\n}\\nhtml.light-theme input, html.light-theme textarea, html.light-theme select, html.light-theme button {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n}\\nhtml.light-theme em {\\n  font-style: italic;\\n}\\nhtml.light-theme strong {\\n  font-weight: 700;\\n}\\nhtml.light-theme article, html.light-theme aside, html.light-theme details, html.light-theme figcaption, html.light-theme figure,\\nhtml.light-theme footer, html.light-theme header, html.light-theme hgroup, html.light-theme menu, html.light-theme nav, html.light-theme section {\\n  display: block;\\n}\\nhtml.light-theme html {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #343741;\\n  height: 100%;\\n  background-color: #fafbfd;\\n}\\nhtml.light-theme body {\\n  line-height: 1;\\n}\\nhtml.light-theme *:focus {\\n  outline: none;\\n}\\nhtml.light-theme *:focus::-moz-focus-inner {\\n  border: none;\\n}\\nhtml.light-theme *:focus:-moz-focusring {\\n  outline: none;\\n}\\nhtml.light-theme a {\\n  text-decoration: none;\\n  color: #07C;\\n}\\nhtml.light-theme a:hover {\\n  text-decoration: none;\\n}\\nhtml.light-theme a:focus {\\n  text-decoration: none;\\n  outline: none;\\n}\\nhtml.light-theme a:hover, html.light-theme button, html.light-theme [role=button] {\\n  cursor: pointer;\\n}\\nhtml.light-theme input {\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.light-theme input:disabled {\\n  opacity: 1;\\n  /* required on iOS */\\n}\\nhtml.light-theme button {\\n  background: none;\\n  border: none;\\n  padding: 0;\\n  margin: 0;\\n  outline: none;\\n  font-size: inherit;\\n  color: inherit;\\n  border-radius: 0;\\n}\\nhtml.light-theme button:hover {\\n  cursor: pointer;\\n}\\nhtml.light-theme ol, html.light-theme ul {\\n  list-style: none;\\n}\\nhtml.light-theme blockquote, html.light-theme q {\\n  quotes: none;\\n}\\nhtml.light-theme blockquote::before, html.light-theme blockquote::after,\\nhtml.light-theme q::before, html.light-theme q::after {\\n  content: \\\"\\\";\\n  content: none;\\n}\\nhtml.light-theme table {\\n  border-collapse: collapse;\\n  border-spacing: 0;\\n}\\nhtml.light-theme hr {\\n  margin: 0;\\n}\\nhtml.light-theme fieldset {\\n  min-inline-size: auto;\\n}\\nhtml.light-theme svg text {\\n  letter-spacing: normal !important;\\n}\\nhtml.light-theme html {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) #f3f3f5;\\n}\\nhtml.light-theme html::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme html::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 4px solid #f3f3f5;\\n}\\nhtml.light-theme html::-webkit-scrollbar-corner, html.light-theme html::-webkit-scrollbar-track {\\n  background-color: #f3f3f5;\\n}\\nhtml.light-theme svg text {\\n  letter-spacing: normal !important;\\n}\\nhtml.light-theme html,\\nhtml.light-theme body {\\n  font-family: Inter, BlinkMacSystemFont, Helvetica, Arial, sans-serif !important;\\n}\\nhtml.light-theme .echChartStatus {\\n  visibility: hidden;\\n  pointer-events: none;\\n  z-index: -100000;\\n  width: 0;\\n  height: 0;\\n  position: absolute;\\n}\\nhtml.light-theme .echChartBackground {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n}\\nhtml.light-theme .echChart {\\n  height: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.light-theme .echChart__titles {\\n  margin-right: 24px;\\n}\\nhtml.light-theme .echChartContent {\\n  position: relative;\\n  display: flex;\\n  flex-direction: row;\\n  flex-grow: 1;\\n  height: 1px;\\n  width: 100%;\\n}\\nhtml.light-theme .echChartContent--column {\\n  flex-direction: column;\\n}\\nhtml.light-theme .echChartTitle {\\n  font-style: normal;\\n  font-weight: bold;\\n  font-size: 16px;\\n  line-height: 19px;\\n  padding: 8px;\\n  white-space: nowrap;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .echChartTitle + .echChartDescription {\\n  padding-top: 0;\\n}\\nhtml.light-theme .echChartDescription {\\n  padding: 8px;\\n  font-style: normal;\\n  font-weight: normal;\\n  font-size: 14px;\\n  line-height: 17px;\\n  white-space: nowrap;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  flex-shrink: 0;\\n}\\nhtml.light-theme .echContainer {\\n  flex: 1;\\n  position: relative;\\n  overflow: hidden;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.light-theme .echChartPointerContainer {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  right: 0;\\n  left: 0;\\n  box-sizing: border-box;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n}\\nhtml.light-theme .echChartResizer {\\n  z-index: -10000000;\\n  position: absolute;\\n  bottom: 0;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  box-sizing: border-box;\\n}\\nhtml.light-theme .echBrushTool {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  margin: 0;\\n  padding: 0;\\n  box-sizing: border-box;\\n  overflow: hidden;\\n  pointer-events: none;\\n}\\nhtml.light-theme .echTooltip {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1), 0 3.6px 13px rgba(0, 0, 0, 0.07), 0 8.4px 23px rgba(0, 0, 0, 0.06), 0 23px 35px rgba(0, 0, 0, 0.05);\\n  border-radius: 6px;\\n  background-color: #404040;\\n  color: #FFF;\\n  z-index: 9000;\\n  max-width: 256px;\\n  overflow-wrap: break-word;\\n  padding: 8px;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding: 0;\\n  max-width: 100%;\\n  pointer-events: none;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  background-color: #FFF;\\n  color: #343741;\\n  overflow: hidden;\\n  cursor: default;\\n  transition: box-shadow 400ms, opacity 250ms;\\n  border: 1px solid #FFF;\\n}\\nhtml.light-theme .echTooltip .euiHorizontalRule {\\n  background-color: #595959;\\n}\\nhtml.light-theme .echTooltip__outerWrapper {\\n  display: flex;\\n}\\nhtml.light-theme .echTooltip--pinned {\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05), 0 4.5px 10px rgba(0, 0, 0, 0.05);\\n  pointer-events: auto;\\n  -webkit-user-select: auto;\\n     -moz-user-select: auto;\\n      -ms-user-select: auto;\\n          user-select: auto;\\n}\\nhtml.light-theme .echTooltip--pinned .echTooltip__tableRow--selectable {\\n  cursor: pointer;\\n}\\nhtml.light-theme .echTooltip--pinned .echTooltipActions {\\n  pointer-events: auto;\\n}\\nhtml.light-theme .echTooltip--pinned .echTooltip__tableWrapper {\\n  pointer-events: auto;\\n}\\nhtml.light-theme .echTooltip .echTooltip__tableCell--truncate {\\n  text-overflow: ellipsis;\\n  display: -webkit-box;\\n  -webkit-line-clamp: 2;\\n  /* number of lines to show */\\n  line-clamp: 2;\\n  -webkit-box-orient: vertical;\\n  overflow: hidden;\\n}\\nhtml.light-theme .echTooltip__metricRow {\\n  padding: 4px 8px;\\n  display: flex;\\n  justify-content: space-between;\\n}\\nhtml.light-theme .echTooltip__tableWrapper {\\n  overflow: hidden;\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background-color: #FFF;\\n}\\nhtml.light-theme .echTooltip__tableWrapper::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .echTooltip__tableWrapper::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .echTooltip__tableWrapper::-webkit-scrollbar-corner, html.light-theme .echTooltip__tableWrapper::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .echTooltip__tableWrapper--pinned {\\n  overflow: auto;\\n}\\nhtml.light-theme .echTooltip__table {\\n  display: grid;\\n  width: 100%;\\n}\\nhtml.light-theme .echTooltip__table--noGrid {\\n  display: table;\\n}\\nhtml.light-theme .echTooltip__tableHeader .echTooltip__tableCell, html.light-theme .echTooltip__tableFooter .echTooltip__tableCell {\\n  cursor: default;\\n  font-weight: 600;\\n  background-color: #FFF;\\n  position: sticky;\\n  z-index: 1;\\n}\\nhtml.light-theme .echTooltip__tableHeader, html.light-theme .echTooltip__tableBody, html.light-theme .echTooltip__tableFooter, html.light-theme .echTooltip__tableRow {\\n  display: contents;\\n}\\nhtml.light-theme .echTooltip__tableHeader {\\n  margin-bottom: 0;\\n  top: 0;\\n}\\nhtml.light-theme .echTooltip__tableHeader .echTooltip__tableCell {\\n  border-bottom: solid 1px #D3DAE6;\\n  top: 0;\\n}\\nhtml.light-theme .echTooltip__tableFooter {\\n  margin-top: 0;\\n  bottom: 0;\\n}\\nhtml.light-theme .echTooltip__tableFooter .echTooltip__tableCell {\\n  border-top: solid 1px #D3DAE6;\\n  bottom: 0;\\n}\\nhtml.light-theme .echTooltip__tableCell:not(.echTooltip__colorCell) {\\n  padding: 4px;\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableCell:not(.echTooltip__colorCell) {\\n  padding: 2px 4px;\\n  transition: margin 200ms, padding 200ms;\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__colorCell + .echTooltip__tableCell {\\n  margin-left: 10px;\\n  padding-left: 10px;\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected:hover .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selected:hover .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selectable:hover .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.light-theme .echTooltip__tableBody .echTooltip__tableRow--selectable:hover .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(0, 119, 204, 0.05);\\n}\\nhtml.light-theme .echTooltip__tableRow {\\n  position: relative;\\n}\\nhtml.light-theme .echTooltip__tableRow--highlighted .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.light-theme .echTooltip__tableRow--highlighted .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(211, 218, 230, 0.5);\\n}\\nhtml.light-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip {\\n  width: 21px;\\n}\\nhtml.light-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip--spacer {\\n  width: 0;\\n  min-width: 0;\\n}\\nhtml.light-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip--icon {\\n  opacity: 1;\\n}\\nhtml.light-theme .echTooltip__colorCell {\\n  padding: 0;\\n  height: 100%;\\n  position: relative;\\n  overflow: hidden;\\n  width: 21px;\\n}\\nhtml.light-theme .echTooltip__colorCell--static {\\n  width: 5px;\\n}\\nhtml.light-theme .echTooltip__colorStrip, html.light-theme .echTooltip__colorStrip--bg, html.light-theme .echTooltip__colorStrip--spacer {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  bottom: 0;\\n  width: 5px;\\n  transition: width 200ms;\\n}\\nhtml.light-theme .echTooltip__colorStrip--icon {\\n  opacity: 0;\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  height: 100%;\\n  transition: opacity 200ms;\\n  padding: 0 4px;\\n}\\nhtml.light-theme .echTooltip__colorStrip--spacer {\\n  left: auto;\\n  right: 10px;\\n  width: 6px;\\n  min-width: 6px;\\n}\\nhtml.light-theme .echTooltip__label {\\n  min-width: 1px;\\n  flex: 1 1 auto;\\n  text-align: left;\\n}\\nhtml.light-theme .echTooltip__value {\\n  text-align: right;\\n  font-feature-settings: \\\"tnum\\\";\\n}\\nhtml.light-theme .echTooltip[dir=rtl] .echTooltip__colorStrip {\\n  left: auto;\\n  right: 0;\\n}\\nhtml.light-theme .echTooltipHeader {\\n  font-weight: 600;\\n  margin-bottom: 0;\\n  padding: 4px 8px;\\n}\\nhtml.light-theme .echTooltipFooter {\\n  font-weight: 600;\\n  margin-top: 0;\\n  padding: 4px 8px;\\n}\\nhtml.light-theme .echTooltipDivider {\\n  width: 100%;\\n  border-bottom: solid 1px #D3DAE6;\\n}\\n@-webkit-keyframes promptSlideDown {\\n  100% {\\n    opacity: 1;\\n    top: 0;\\n    height: 26px;\\n  }\\n}\\n@keyframes promptSlideDown {\\n  100% {\\n    opacity: 1;\\n    top: 0;\\n    height: 26px;\\n  }\\n}\\nhtml.light-theme .echTooltipPrompt {\\n  position: relative;\\n  width: 100%;\\n  z-index: -1;\\n}\\nhtml.light-theme .echTooltipPrompt__content {\\n  color: #69707D;\\n  font-style: normal;\\n  font-size: 12px;\\n  line-height: 26px;\\n  padding: 0 8px;\\n}\\nhtml.light-theme .echTooltipPrompt.slideDown {\\n  opacity: 0;\\n  top: -26px;\\n  height: 0;\\n  -webkit-animation: promptSlideDown 0.25s forwards;\\n          animation: promptSlideDown 0.25s forwards;\\n  -webkit-animation-delay: 1.5s;\\n          animation-delay: 1.5s;\\n}\\nhtml.light-theme .echTooltipActions {\\n  position: relative;\\n  display: flex;\\n  align-items: flex-start;\\n  flex-direction: column;\\n  width: 100%;\\n  font-style: normal;\\n  font-size: 12px;\\n  line-height: 21px;\\n}\\nhtml.light-theme .echTooltipActions__prompt {\\n  position: relative;\\n  height: 26px;\\n  padding: 0 8px;\\n  line-height: 26px;\\n  width: 100%;\\n  color: #69707D;\\n  font-style: normal;\\n  font-size: 12px;\\n}\\nhtml.light-theme .echTooltipActions__action {\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n  display: block;\\n  text-align: left;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 21px;\\n  cursor: pointer;\\n  color: #343741;\\n}\\nhtml.light-theme .echTooltipActions__action:nth-child(2) {\\n  padding-top: 4px;\\n}\\nhtml.light-theme .echTooltipActions__action:last-child {\\n  padding-bottom: 2px;\\n}\\nhtml.light-theme .echTooltipActions__action:hover, html.light-theme .echTooltipActions__action:focus {\\n  text-decoration: underline;\\n}\\nhtml.light-theme .echTooltipActions__action[disabled] {\\n  cursor: default;\\n  color: #ABB4C4;\\n}\\nhtml.light-theme .echTooltipActions__action[disabled]:hover, html.light-theme .echTooltipActions__action[disabled]:focus {\\n  text-decoration: none;\\n}\\nhtml.light-theme [id^=echTooltipPortal] {\\n  pointer-events: none;\\n}\\nhtml.light-theme [id^=echAnchor] {\\n  position: absolute;\\n  pointer-events: none;\\n}\\nhtml.light-theme .echTooltipPortal__invisible {\\n  position: fixed;\\n  visibility: hidden;\\n  width: 0;\\n  height: 0;\\n}\\nhtml.light-theme .echIcon {\\n  flex-shrink: 0;\\n  display: inline-block;\\n  vertical-align: middle;\\n  fill: currentColor;\\n}\\nhtml.light-theme .echIcon svg {\\n  transform: translate(0, 0);\\n}\\nhtml.light-theme .echIcon:focus {\\n  opacity: 1;\\n  background: rgba(0, 119, 204, 0.1);\\n}\\nhtml.light-theme .echLegend .echLegendList {\\n  display: grid;\\n  grid-template-columns: minmax(0, 1fr);\\n  -webkit-padding-start: 0;\\n          padding-inline-start: 0;\\n  -webkit-padding-end: 0;\\n          padding-inline-end: 0;\\n  -webkit-margin-before: 0;\\n          margin-block-start: 0;\\n  -webkit-margin-after: 0;\\n          margin-block-end: 0;\\n}\\nhtml.light-theme .echLegend--horizontal .echLegendList {\\n  grid-column-gap: 24px;\\n  grid-row-gap: 8px;\\n  margin-top: 8px;\\n  margin-bottom: 8px;\\n}\\nhtml.light-theme .echLegend--top, html.light-theme .echLegend--left {\\n  order: 0;\\n}\\nhtml.light-theme .echLegend--bottom, html.light-theme .echLegend--right {\\n  order: 1;\\n}\\nhtml.light-theme .echLegend--debug {\\n  background: rgba(238, 130, 238, 0.2);\\n  position: relative;\\n}\\nhtml.light-theme .echLegend--inert {\\n  pointer-events: none;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer {\\n  scrollbar-color: rgba(105, 112, 125, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n          mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  width: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer::-webkit-scrollbar-thumb {\\n  background-color: rgba(105, 112, 125, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer::-webkit-scrollbar-corner, html.light-theme .echLegend .echLegendListContainer::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.light-theme .echLegend .echLegendListContainer[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.light-theme .echLegend .echLegendListContainer :focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 1px;\\n  background-color: rgba(0, 119, 204, 0.1);\\n  border-radius: 3px;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer :focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.light-theme .echLegend .echLegendListContainer :focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.light-theme .echLegendItem {\\n  color: #343741;\\n  display: flex;\\n  flex-wrap: nowrap;\\n  justify-content: space-between;\\n  align-items: flex-start;\\n  position: relative;\\n}\\nhtml.light-theme .echLegendItem .colorWrapper > *:first-of-type {\\n  height: 18px;\\n}\\nhtml.light-theme .echLegendItem:not([dir=rtl]) > *:not(.background) {\\n  margin-left: 4px;\\n}\\nhtml.light-theme .echLegendItem:not([dir=rtl]) > *:not(.background):last-child:not(.echLegendItem__extra) {\\n  margin-right: 4px;\\n}\\nhtml.light-theme .echLegendItem[dir=rtl] > *:not(.background) {\\n  margin-right: 4px;\\n}\\nhtml.light-theme .echLegendItem[dir=rtl] > *:not(.background):last-child:not(.echLegendItem__extra) {\\n  margin-left: 4px;\\n}\\nhtml.light-theme .echLegendItem:not(html.light-theme .echLegendItem--hidden) .echLegendItem__color--changable {\\n  cursor: pointer;\\n}\\nhtml.light-theme .echLegendItem:hover .background {\\n  background-color: #F5F7FA;\\n}\\nhtml.light-theme .echLegendItem .background {\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  z-index: -1;\\n}\\nhtml.light-theme .echLegendItem__action {\\n  cursor: pointer;\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  height: 18px;\\n  max-width: calc(18px + 8px);\\n}\\nhtml.light-theme .echLegendItem__action .euiPopover,\\nhtml.light-theme .echLegendItem__action .euiPopover__anchor,\\nhtml.light-theme .echLegendItem__action .euiPopover__anchor > *:first-child {\\n  height: 100%;\\n  width: 100%;\\n  display: flex;\\n}\\nhtml.light-theme .echLegendItem__color {\\n  display: flex;\\n  line-height: 1.5;\\n  align-items: center;\\n}\\nhtml.light-theme .echLegendItem__label {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  flex: 1 1 auto;\\n  text-align: left;\\n  vertical-align: baseline;\\n  letter-spacing: unset;\\n  align-items: center;\\n  overflow-wrap: break-word;\\n  word-wrap: break-word;\\n  word-break: break-all;\\n  word-break: break-word;\\n  -webkit-hyphens: auto;\\n      -ms-hyphens: auto;\\n          hyphens: auto;\\n  overflow: hidden;\\n  min-width: 1px;\\n}\\nhtml.light-theme .echLegendItem__label--singleline {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.light-theme .echLegendItem__label--multiline:is(div) {\\n  display: -webkit-box;\\n  -webkit-box-orient: vertical;\\n  -webkit-line-clamp: 2;\\n}\\nhtml.light-theme .echLegendItem__label--clickable:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.light-theme .echLegendItem__extra {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  text-align: right;\\n  flex: 0 0 auto;\\n  margin-left: 4px;\\n  font-feature-settings: \\\"tnum\\\";\\n  letter-spacing: unset;\\n  direction: ltr;\\n}\\nhtml.light-theme .echLegendItem--vertical {\\n  padding-top: 2px;\\n  padding-bottom: 2px;\\n}\\nhtml.light-theme .echLegendItem--vertical:first-of-type {\\n  margin-top: 2px;\\n}\\nhtml.light-theme .echLegendItem--vertical .background {\\n  margin-top: 2px;\\n  margin-bottom: 2px;\\n}\\nhtml.light-theme .echLegendItem--hidden {\\n  color: #69707D;\\n}\\nhtml.light-theme .echLegendItem[dir=rtl] .echLegendItem__label {\\n  text-align: right;\\n}\\nhtml.light-theme .echReactiveChart_noResults {\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  width: 100%;\\n  height: 100%;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  color: #69707D;\\n}\\nhtml.light-theme .echGridContainer {\\n  display: grid;\\n  width: 100%;\\n  height: 100%;\\n  align-content: start;\\n  justify-content: stretch;\\n  align-items: stretch;\\n  -webkit-user-select: text;\\n     -moz-user-select: text;\\n      -ms-user-select: text;\\n          user-select: text;\\n}\\nhtml.light-theme .echGridCell {\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n  overflow: hidden;\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.light-theme .echGridCell--rightBorder {\\n  border-right: 1px solid #343741;\\n}\\nhtml.light-theme .echGridCell--bottomBorder {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.light-theme .echAlignedGrid {\\n  display: grid;\\n  align-content: stretch;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.light-theme .echAlignedGrid--header {\\n  width: 100%;\\n  height: 100%;\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.light-theme .echAlignedGrid__borderRight {\\n  border-right: 1px solid #edf0f5;\\n}\\nhtml.light-theme .echAlignedGrid__borderBottom {\\n  border-bottom: 1px solid #edf0f5;\\n}\\nhtml.light-theme .echAlignedGrid--content {\\n  width: 100%;\\n  min-height: 0;\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.light-theme .echHighlighter {\\n  position: absolute;\\n  pointer-events: none;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.light-theme .echHighlighterOverlay__fill {\\n  fill: rgba(255, 255, 255, 0.2);\\n}\\nhtml.light-theme .echHighlighterOverlay__stroke {\\n  stroke: rgba(255, 255, 255, 0.2);\\n}\\nhtml.light-theme .echHighlighter__mask {\\n  fill: rgba(255, 255, 255, 0.5);\\n}\\nhtml.light-theme .echCrosshair,\\nhtml.light-theme .echCrosshair__cursor,\\nhtml.light-theme .echCrosshair__crossLine {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  pointer-events: none;\\n}\\nhtml.light-theme .echScreenReaderOnly {\\n  position: absolute;\\n  left: -10000px;\\n  top: auto;\\n  width: 1px;\\n  height: 1px;\\n  overflow: hidden;\\n}\\nhtml.light-theme .echScreenReaderOnlyDebug {\\n  left: 0 !important;\\n  top: 0 !important;\\n  right: 0 !important;\\n  bottom: 0 !important;\\n  width: 100% !important;\\n  height: 100% !important;\\n  overflow: auto !important;\\n  background: rgba(255, 255, 255, 0.8);\\n}\\nhtml.light-theme .echScreenReaderOnlyDebug table,\\nhtml.light-theme .echScreenReaderOnlyDebug td,\\nhtml.light-theme .echScreenReaderOnlyDebug th {\\n  border: 1px solid black;\\n  font-size: 12px;\\n}\\nhtml.light-theme .echScreenReaderTable {\\n  overflow-x: auto;\\n  text-align: left;\\n}\\nhtml.light-theme .echAnnotation {\\n  padding: 0;\\n  transition: opacity 250ms;\\n  pointer-events: none;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  max-width: 260px;\\n}\\nhtml.light-theme .echAnnotation__marker {\\n  position: absolute;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  font-size: 12px;\\n  font-weight: 700;\\n  line-height: normal;\\n}\\nhtml.light-theme .echAnnotation__details {\\n  padding: 4px 8px;\\n}\\nhtml.light-theme .echAnnotation__icon {\\n  position: relative;\\n}\\nhtml.light-theme .echAnnotation__body {\\n  white-space: nowrap;\\n}\\nhtml.light-theme .echCanvasRenderer {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  padding: 0;\\n  margin: 0;\\n  border: 0;\\n  background: transparent;\\n}\\nhtml.light-theme .echMetricContainer {\\n  display: grid;\\n  width: 100%;\\n  height: 100%;\\n  align-content: start;\\n  justify-content: stretch;\\n  align-items: stretch;\\n  -webkit-user-select: text;\\n     -moz-user-select: text;\\n      -ms-user-select: text;\\n          user-select: text;\\n}\\nhtml.light-theme .echMetric {\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n  overflow: hidden;\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.light-theme .echMetric .echMetric--outline {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  pointer-events: none;\\n}\\nhtml.light-theme .echMetric:focus-within .echMetric--outline {\\n  outline: auto;\\n  outline-offset: -1.5px;\\n}\\nhtml.light-theme .echMetric:focus-within button {\\n  outline: none;\\n}\\nhtml.light-theme .echMetric--rightBorder {\\n  border-right: 1px solid #343741;\\n}\\nhtml.light-theme .echMetric--topBorder {\\n  border-top: 1px solid #343741;\\n}\\nhtml.light-theme .echMetric--bottomBorder {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.light-theme .echMetric--vertical.echMetric--withProgressBar--small {\\n  padding-left: 10px;\\n}\\nhtml.light-theme .echMetric--vertical.echMetric--withTargetProgressBar--small {\\n  padding-left: 14px;\\n}\\nhtml.light-theme .echMetric--horizontal.echMetric--withProgressBar--small {\\n  padding-bottom: 10px;\\n}\\nhtml.light-theme .echMetric--horizontal.echMetric--withTargetProgressBar--small {\\n  padding-bottom: 12px;\\n}\\nhtml.light-theme .echMetricEmpty {\\n  position: absolute;\\n  bottom: 9px;\\n  right: 11px;\\n  width: 20px;\\n  border-bottom: 1px solid;\\n}\\nhtml.light-theme .echMetricText {\\n  position: relative;\\n  padding: 8px;\\n  height: 100%;\\n  z-index: 1;\\n  display: grid;\\n  grid-template-columns: 100%;\\n  grid-template-rows: -webkit-min-content -webkit-min-content auto -webkit-min-content -webkit-min-content;\\n  grid-template-rows: min-content min-content auto min-content min-content;\\n  text-align: left;\\n  line-height: 1.2;\\n}\\nhtml.light-theme .echMetricText__title {\\n  font-weight: bold;\\n  word-wrap: break-word;\\n}\\nhtml.light-theme .echMetricText__title button {\\n  font-weight: bold;\\n  width: 100%;\\n  text-align: left;\\n}\\nhtml.light-theme .echMetricText__icon {\\n  position: absolute;\\n  right: 8px;\\n  top: 8px;\\n}\\nhtml.light-theme .echMetricText__subtitle {\\n  padding-top: 5px;\\n  font-weight: normal;\\n  text-align: left;\\n}\\nhtml.light-theme .echMetricText__extra {\\n  text-align: right;\\n  font-weight: normal;\\n}\\nhtml.light-theme .echMetricText__value {\\n  position: relative;\\n  font-weight: bold;\\n  text-align: right;\\n  white-space: nowrap;\\n  overflow: hidden;\\n}\\nhtml.light-theme .echMetricText__valueIcon {\\n  display: inline-block;\\n  position: absolute;\\n  right: 8px;\\n  bottom: 8px;\\n}\\nhtml.light-theme .echMetricText__part {\\n  font-weight: bold;\\n}\\nhtml.light-theme .echMetricText__gap {\\n  position: relative;\\n}\\nhtml.light-theme .echMetricText__body {\\n  overflow: hidden;\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n}\\nhtml.light-theme .echSingleMetricProgress {\\n  position: absolute;\\n}\\nhtml.light-theme .echSingleMetricProgress--vertical {\\n  left: 0;\\n  right: 0;\\n  top: 0;\\n  bottom: 0;\\n  height: 100%;\\n  width: 100%;\\n}\\nhtml.light-theme .echSingleMetricProgress--vertical.echSingleMetricProgress--small {\\n  right: auto;\\n  width: 10px;\\n}\\nhtml.light-theme .echSingleMetricProgress--horizontal {\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  top: 0;\\n  bottom: 0;\\n  height: 100%;\\n}\\nhtml.light-theme .echSingleMetricProgress--horizontal.echSingleMetricProgress--small {\\n  top: auto;\\n  height: 10px;\\n}\\nhtml.light-theme .echSingleMetricProgressBar {\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.light-theme .echSingleMetricProgressBar--vertical {\\n  position: absolute;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  width: 100%;\\n}\\nhtml.light-theme .echSingleMetricProgressBar--horizontal {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  height: 100%;\\n}\\nhtml.light-theme .echSingleMetricTarget {\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  overflow: visible;\\n  z-index: 1;\\n}\\nhtml.light-theme .echSingleMetricTarget--vertical {\\n  transform: rotate(90deg);\\n  position: absolute;\\n  left: 100%;\\n  bottom: 0;\\n}\\nhtml.light-theme .echSingleMetricTarget--horizontal {\\n  position: absolute;\\n  bottom: 100%;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline {\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  overflow: visible;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline--vertical {\\n  position: absolute;\\n  left: 0;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline--vertical.echSingleMetricZeroBaseline--small {\\n  right: auto;\\n  height: 2px;\\n  width: 13px;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline--horizontal {\\n  position: absolute;\\n  bottom: 0;\\n}\\nhtml.light-theme .echSingleMetricZeroBaseline--horizontal.echSingleMetricZeroBaseline--small {\\n  top: auto;\\n  width: 2px;\\n  height: 13px;\\n}\\nhtml.light-theme .echSingleMetricSparkline {\\n  position: absolute;\\n  overflow: hidden;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n}\\nhtml.light-theme .echSingleMetricSparkline__svg {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.light-theme .echSingleMetricSparkline__svg rect,\\nhtml.light-theme .echSingleMetricSparkline__svg path {\\n  transition: fill ease-in-out 0.1s;\\n}\\nhtml.light-theme .echSingleMetricChart--small {\\n  position: absolute;\\n  top: auto;\\n  left: auto;\\n  bottom: 0;\\n  right: 0;\\n  width: 100px;\\n  height: 30px;\\n}\\nhtml.light-theme:not(.legacy) {\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n}\\nhtml.light-theme:not(.legacy) body,\\nhtml.light-theme:not(.legacy) .echChart {\\n  background: #FFF !important;\\n}\\nhtml.light-theme:not(.legacy) .euiText {\\n  color: #1a1c21;\\n}\\nhtml.dark-theme {\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n   * LEGEND\\n   * __day-name : Week headers like Su, Mo, etc\\n   * __day : Number on the calendar\\n   *       --highlighted\\n   *       --disabled :               _this.isDisabled(),\\n   *       --selected :               _this.isSameDay(_this.props.selected),\\n      *       --range-start :            _this.isRangeStart(),\\n      *       --range-end :              _this.isRangeEnd(),\\n   *       --keyboard-selected :      _this.isKeyboardSelected(),\\n   *       --in-range :               _this.isInRange(),\\n      *       --in-selecting-range :     _this.isInSelectingRange(),\\n      *       --selecting-range-start :  _this.isSelectingRangeStart(),\\n      *       --selecting-range-end :    _this.isSelectingRangeEnd(),\\n   *       --today :                  _this.isSameDay(now(_this.props.utcOffset)),\\n   *       --weekend :                _this.isWeekend(),\\n   *       --outside-month :          _this.isOutsideMonth()\\n   */\\n  /**\\n   * LEGEND\\n   * __time-list-item :\\n   *       --preselected : closest current time but not selected (also applied when using arrow keys to indicate focus)\\n   *       --selected\\n   *       --disabled\\n   *       --injected\\n   */\\n  /**\\n   * LEGEND\\n   * __header__dropdown : Contains the month and year, but affords for the navigational arrows\\n\\n   *   __month-dropdown-container: Contains both static/selected control and the dropdown\\n   *     __month-read-view: The static control\\n   *     __month-dropdown: The absolutely positioned list\\n   *       __month-option: Each option in the list\\n   *                       --selected_month\\n   *                       --selected\\n   *                       --preselected\\n\\n   *   __year-dropdown-container: Contains both static/selected control and the dropdown\\n   *     __year-read-view: The static control\\n   *     __year-dropdown: The absolutely positioned list\\n   *       __year-option: Each option in the list\\n   *                       --selected_year\\n   *                       --selected\\n   *                       --preselected\\n   */\\n  /**\\n   * Make the top selectors look like select inputs\\n   */\\n  /* This file is a heavy retheme of react-datepicker's Sass as of v1.4.0\\n  ** https://github.com/Hacker0x01/react-datepicker\\n  */\\n  /*\\n   * 1. Overwrites the base styling of EuiBadge, to give it a larger size and margins\\n   * that make sense in the input wrap.\\n   */\\n  /**\\n   * 1. Using specificity to override panel shadow\\n   * 2. Prevent really long input from overflowing the container.\\n   */\\n  /**\\n   * 1. Force each title to be the same height as an option, so that the virtualized scroll logic\\n   *    works.\\n   */\\n  /**\\n  * Make the arrow delimiter match the colors of `.euiDatePopoverButton-needsUpdating`\\n  */\\n  /**\\n    * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n    *    they actually click this input.\\n    */\\n  /*\\n   * 1. Fix for Safari to ensure that it renders like a normal text input\\n   *    and doesn't add extra spacing around text\\n  */\\n  /**\\n    * REMEMBER: --large modifiers must come last to override --compressed\\n    */\\n  /**\\n    * 1. Don't block the user from dropping files onto the filepicker.\\n    * 2. Ensure space for import icon, loading spinner, and clear button (only if it has files)\\n    * 4. Static height so that it doesn't shift its surrounding contents around\\n    */\\n  /**\\n    * 1. Undo the pointer-events: none applied to the enclosing prompt.\\n    */\\n  /**\\n   * 1. Ensure the descenders don't get cut off\\n   */\\n  /**\\n   * 1. Ensure the descenders don't get cut off\\n   * 2. Makes sure the height is correct when there's no selection\\n   */\\n  /**\\n   * 1. Account for inner box-shadow style border\\n   * 2. Ensure truncation works in children elements\\n   */\\n  /**\\n   * 1. Focused state overrides invalid state.\\n   * 2. Disabled state overrides pointer.\\n   */\\n  /**\\n   * 1. Coerce inline form elements to behave as block-level elements.\\n   * 2. For inline forms, we need to add margin if the label doesn't exist.\\n   */\\n  /**\\n    * 1. Float above the visual radio and match its dimension, so that when users try to click it\\n    *    they actually click this input.\\n    */\\n  /**\\n    * 1. Prevent really long input from overflowing the container.\\n    */\\n  /**\\n   * 1. Vertically align all children.\\n   * 2. The padding on this div allows the ellipsis to show if the content is truncated. If\\n   *    the padding was on the cell, the ellipsis would be cropped.\\n   * 4. Prevent very long single words (e.g. the name of a field in a document) from overflowing\\n   *    the cell.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n  /**\\n   * Text truncation\\n   *\\n   * Prevent text from wrapping onto multiple lines, and truncate with an ellipsis.\\n   *\\n   * 1. Ensure that the node has a maximum width after which truncation can occur.\\n   */\\n  /**\\n   * Text weight shifting\\n   *\\n   * When changing the font-weight based the state of the component\\n   * this mixin will ensure that the sizing is dependent on the boldest\\n   * weight so it doesn't shifter sibling content.\\n   */\\n  /**\\n   * 1. Focus rings shouldn't be visible on scrollable regions, but a11y requires them to be focusable.\\n   *    Browser's supporting `:focus-visible` will still show outline on keyboard focus only.\\n   *    Others like Safari, won't show anything at all.\\n   * 2. Force the `:focus-visible` when the `tabindex=0` (is tabbable)\\n   */\\n  /**\\n   * For quickly applying a full-height element whether using flex or not\\n   */\\n  /*\\n   * Creates the Amsterdam style of button with a transparent background\\n   */\\n  /*\\n   * Creates the Amsterdam style of fill button\\n   */\\n  /*\\n  The CSS in JS version of this file lives in:\\n    - src/components/form/range/range.styles.ts\\n\\n  The following files still use the Sass version:\\n    - src/themes/amsterdam/overrides/_color_stops.scss\\n    - src/themes/amsterdam/overrides/_hue.scss\\n  */\\n  /**\\n   * Adapted from Eric Meyer's reset (http://meyerweb.com/eric/tools/css/reset/, v2.0 | 20110126).\\n   *\\n   */\\n  /* HTML5 display-role reset for older browsers */\\n  /* Chrome has an issue around RTL languages in SVGs when letter-spacing is negative\\n   * https://bugs.chromium.org/p/chromium/issues/detail?id=966480\\n   */\\n  /* Chrome has an issue around RTL languages in SVGs when letter-spacing is negative\\n   * https://bugs.chromium.org/p/chromium/issues/detail?id=966480\\n   */\\n  /**\\n   * Manually synced with `COLOR_STRIP_CHECK_WIDTH` const in [`tooltip_table.tsx`](packages/charts/src/components/tooltip/components/tooltip_table.tsx)\\n   */\\n}\\n@-webkit-keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiAnimFadeIn {\\n  0% {\\n    opacity: 0;\\n  }\\n  100% {\\n    opacity: 1;\\n  }\\n}\\n@-webkit-keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@keyframes euiGrow {\\n  0% {\\n    opacity: 0;\\n  }\\n  1% {\\n    opacity: 0;\\n    transform: scale(0);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: scale(1);\\n  }\\n}\\n@-webkit-keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(54, 162, 239, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #36A2EF;\\n  }\\n}\\n@keyframes focusRingAnimate {\\n  0% {\\n    box-shadow: 0 0 0 2px rgba(54, 162, 239, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 2px #36A2EF;\\n  }\\n}\\n@-webkit-keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(54, 162, 239, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #36A2EF;\\n  }\\n}\\n@keyframes focusRingAnimateLarge {\\n  0% {\\n    box-shadow: 0 0 0 10px rgba(54, 162, 239, 0);\\n  }\\n  100% {\\n    box-shadow: 0 0 0 4px #36A2EF;\\n  }\\n}\\n@-webkit-keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\n@keyframes euiButtonActive {\\n  50% {\\n    transform: translateY(1px);\\n  }\\n}\\nhtml.dark-theme .react-datepicker__day-names,\\nhtml.dark-theme .react-datepicker__week {\\n  white-space: nowrap;\\n  display: flex;\\n  justify-content: space-between;\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .react-datepicker__day-name,\\nhtml.dark-theme .react-datepicker__day {\\n  font-weight: 500;\\n  text-align: center;\\n  color: #DFE5EF;\\n  display: inline-block;\\n  width: 32px;\\n  line-height: 32px;\\n  border-radius: 4px;\\n  margin: 2px;\\n}\\nhtml.dark-theme .react-datepicker__day-name {\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .react-datepicker__day {\\n  cursor: pointer;\\n  transition: transform 90ms ease-in-out;\\n}\\nhtml.dark-theme .react-datepicker__day:hover {\\n  color: #36A2EF;\\n  background-color: rgba(54, 162, 239, 0.2);\\n  text-decoration: underline;\\n}\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  html.dark-theme .react-datepicker__day:hover {\\n    transform: scale(1.1);\\n  }\\n}\\nhtml.dark-theme .react-datepicker__day--today {\\n  color: #36A2EF;\\n  font-weight: 700;\\n}\\nhtml.dark-theme .react-datepicker__day--outside-month {\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .react-datepicker__day--highlighted, html.dark-theme .react-datepicker__day--highlighted:hover {\\n  color: #7DDED8;\\n  background-color: rgba(125, 222, 216, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--in-range, html.dark-theme .react-datepicker__day--in-range:hover {\\n  color: #36A2EF;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover), html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected), html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover {\\n  box-shadow: -2px 0 rgba(54, 162, 239, 0.2), 2px 0 rgba(54, 162, 239, 0.2);\\n  border-radius: 0;\\n}\\nhtml.dark-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):first-of-type, html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):first-of-type, html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:first-of-type {\\n  box-shadow: 2px 0 rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--in-range:not(.react-datepicker__day--selected):not(:hover):last-of-type, html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):last-of-type, html.dark-theme .react-datepicker__day--in-range.react-datepicker__day--disabled:not(.react-datepicker__day--selected):hover:last-of-type {\\n  box-shadow: -2px 0 rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--selected, html.dark-theme .react-datepicker__day--in-selecting-range, html.dark-theme .react-datepicker__day--selected:hover, html.dark-theme .react-datepicker__day--in-selecting-range:hover {\\n  background-color: #36A2EF;\\n  color: #000;\\n}\\nhtml.dark-theme .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range) {\\n  background-color: rgba(248, 107, 99, 0.5);\\n}\\nhtml.dark-theme .react-datepicker__day--disabled, html.dark-theme .react-datepicker__day--disabled:hover {\\n  background-color: rgba(81, 87, 97, 0.1);\\n  color: #515761;\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  transform: none;\\n}\\nhtml.dark-theme .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected), html.dark-theme .react-datepicker__day--disabled.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover, html.dark-theme .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected), html.dark-theme .react-datepicker__day--disabled:hover.react-datepicker__day--in-range:not(.react-datepicker__day--selected):hover {\\n  color: #4e5f6e;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__day--disabled.react-datepicker__day--selected, html.dark-theme .react-datepicker__day--disabled.react-datepicker__day--selected:hover {\\n  color: #F86B63;\\n  background-color: rgba(248, 107, 99, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__header--time {\\n  display: none;\\n}\\nhtml.dark-theme .react-datepicker__time-container {\\n  border-left: #343741;\\n  width: auto;\\n  display: flex;\\n  margin-top: 40px;\\n  margin-left: 8px;\\n  flex-grow: 1;\\n  background-color: #141519;\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .react-datepicker__time-container--focus .react-datepicker__time-list-item--preselected {\\n  text-decoration: underline;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .react-datepicker__time-container {\\n    margin-top: 0;\\n  }\\n}\\nhtml.dark-theme .react-datepicker__time,\\nhtml.dark-theme .react-datepicker__time-box {\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .react-datepicker__time-list {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  padding: 4px 12px;\\n  height: 100px !important;\\n  display: flex;\\n  flex-direction: column;\\n  flex-grow: 1;\\n  align-items: center;\\n  gap: 4px;\\n}\\nhtml.dark-theme .react-datepicker__time-list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .react-datepicker__time-list::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .react-datepicker__time-list::-webkit-scrollbar-corner, html.dark-theme .react-datepicker__time-list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .react-datepicker__time-list:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .react-datepicker__time-list[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .react-datepicker__time-list-item {\\n  display: inline-block;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  cursor: pointer;\\n  height: 40px;\\n  line-height: 40px;\\n  text-align: center;\\n  white-space: nowrap;\\n  max-width: 100%;\\n  vertical-align: middle;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 500;\\n  text-decoration: none;\\n  outline-offset: -1px;\\n  transform: none !important;\\n  /* 1 */\\n  -webkit-animation: none !important;\\n  animation: none !important;\\n  /* 1 */\\n  transition-timing-function: ease-in;\\n  /* 2 */\\n  transition-duration: 150ms;\\n  /* 2 */\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 12px;\\n}\\n@media screen and (prefers-reduced-motion: no-preference) {\\n  html.dark-theme .react-datepicker__time-list-item {\\n    transition: transform 250ms ease-in-out, background-color 250ms ease-in-out;\\n  }\\n  html.dark-theme .react-datepicker__time-list-item:hover:not(:disabled) {\\n    transform: translateY(-1px);\\n  }\\n  html.dark-theme .react-datepicker__time-list-item:focus {\\n    -webkit-animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n    animation: euiButtonActive 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  }\\n  html.dark-theme .react-datepicker__time-list-item:active:not(:disabled) {\\n    transform: translateY(1px);\\n  }\\n}\\nhtml.dark-theme .react-datepicker__time-list-item:hover:not(:disabled), html.dark-theme .react-datepicker__time-list-item:focus {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .react-datepicker__time-list-item--disabled, html.dark-theme .react-datepicker__time-list-item--disabled:hover {\\n  text-decoration: none !important;\\n  cursor: not-allowed;\\n  color: #515761;\\n  background-color: transparent;\\n}\\nhtml.dark-theme .react-datepicker__time-list-item--injected, html.dark-theme .react-datepicker__time-list-item--injected:hover {\\n  color: #7DDED8;\\n  background-color: rgba(125, 222, 216, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__time-list-item--preselected, html.dark-theme .react-datepicker__time-list-item--preselected:hover {\\n  background: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__time-list-item--selected, html.dark-theme .react-datepicker__time-list-item--selected:hover {\\n  background-color: #36A2EF;\\n  color: #000;\\n}\\nhtml.dark-theme .react-datepicker--time-only {\\n  padding: 0 !important;\\n}\\nhtml.dark-theme .react-datepicker--time-only .react-datepicker__time-container {\\n  background-color: transparent;\\n  margin: 0;\\n}\\nhtml.dark-theme .react-datepicker--time-only .react-datepicker__time-list {\\n  height: 204px !important;\\n}\\nhtml.dark-theme .react-datepicker--time-only .react-datepicker__time-list-item {\\n  font-size: 14px;\\n  min-width: 112px;\\n  text-align: left;\\n}\\nhtml.dark-theme .react-datepicker__header__dropdown {\\n  padding: 8px;\\n  display: flex;\\n  gap: 4px;\\n  position: absolute;\\n  top: 0;\\n  left: 36px;\\n  right: 36px;\\n  justify-content: center;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view,\\nhtml.dark-theme .react-datepicker__month-read-view,\\nhtml.dark-theme .react-datepicker__month-year-read-view {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  height: 32px;\\n  font-weight: 500;\\n  display: flex;\\n  flex-direction: row-reverse;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .react-datepicker__year-read-view,\\nhtml.dark-theme .react-datepicker__month-read-view,\\nhtml.dark-theme .react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .react-datepicker__year-read-view::-moz-placeholder,\\nhtml.dark-theme .react-datepicker__month-read-view::-moz-placeholder,\\nhtml.dark-theme .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view::-moz-placeholder, html.dark-theme .react-datepicker__month-read-view::-moz-placeholder, html.dark-theme .react-datepicker__month-year-read-view::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view:-ms-input-placeholder, html.dark-theme .react-datepicker__month-read-view:-ms-input-placeholder, html.dark-theme .react-datepicker__month-year-read-view:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view::placeholder,\\nhtml.dark-theme .react-datepicker__month-read-view::placeholder,\\nhtml.dark-theme .react-datepicker__month-year-read-view::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .react-datepicker__year-read-view,\\nhtml.dark-theme .react-datepicker__month-read-view,\\nhtml.dark-theme .react-datepicker__month-year-read-view {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .react-datepicker__year-read-view:hover,\\nhtml.dark-theme .react-datepicker__month-read-view:hover,\\nhtml.dark-theme .react-datepicker__month-year-read-view:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view--down-arrow,\\nhtml.dark-theme .react-datepicker__month-read-view--down-arrow,\\nhtml.dark-theme .react-datepicker__month-year-read-view--down-arrow {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiI+ICA8ZGVmcz4gICAgPHBhdGggaWQ9ImRvd25hcnJvd3doaXRlLWEiIGQ9Ik0xMy4wNjg4NTA4LDUuMTU3MjUwMzggTDguMzg0MjM5NzUsOS43NjgyNzQyOCBDOC4xNzA1NDQxNSw5Ljk3ODYxMzA4IDcuODI5OTkyMTQsOS45NzkxNDA5NSA3LjYxNTc2MDI1LDkuNzY4Mjc0MjggTDIuOTMxMTQ5MTUsNS4xNTcyNTAzOCBDMi43MTgxMzU5LDQuOTQ3NTgzMjEgMi4zNzI3NzMxOSw0Ljk0NzU4MzIxIDIuMTU5NzU5OTQsNS4xNTcyNTAzOCBDMS45NDY3NDY2OSw1LjM2NjkxNzU2IDEuOTQ2NzQ2NjksNS43MDY4NTUyMiAyLjE1OTc1OTk0LDUuOTE2NTIyNCBMNi44NDQzNzEwNCwxMC41Mjc1NDYzIEM3LjQ4NTE3NDI0LDExLjE1ODI4MzYgOC41MTY0NDk3OSwxMS4xNTY2ODUxIDkuMTU1NjI4OTYsMTAuNTI3NTQ2MyBMMTMuODQwMjQwMSw1LjkxNjUyMjQgQzE0LjA1MzI1MzMsNS43MDY4NTUyMiAxNC4wNTMyNTMzLDUuMzY2OTE3NTYgMTMuODQwMjQwMSw1LjE1NzI1MDM4IEMxMy42MjcyMjY4LDQuOTQ3NTgzMjEgMTMuMjgxODY0MSw0Ljk0NzU4MzIxIDEzLjA2ODg1MDgsNS4xNTcyNTAzOCBaIi8+ICA8L2RlZnM+ICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPiAgICA8dXNlIGZpbGw9IiNGRkYiIGZpbGwtcnVsZT0ibm9uemVybyIgeGxpbms6aHJlZj0iI2Rvd25hcnJvd3doaXRlLWEiLz4gIDwvZz48L3N2Zz4=);\\n  right: 8px;\\n  height: 12px;\\n  width: 12px;\\n  display: inline-block;\\n  background-size: cover;\\n}\\nhtml.dark-theme .react-datepicker__year-read-view--selected-month, html.dark-theme .react-datepicker__year-read-view--selected-year,\\nhtml.dark-theme .react-datepicker__month-read-view--selected-month,\\nhtml.dark-theme .react-datepicker__month-read-view--selected-year,\\nhtml.dark-theme .react-datepicker__month-year-read-view--selected-month,\\nhtml.dark-theme .react-datepicker__month-year-read-view--selected-year {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container,\\nhtml.dark-theme .react-datepicker__month-dropdown-container {\\n  position: relative;\\n  display: inline-block;\\n  flex-grow: 1;\\n  max-width: 400px;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]),\\nhtml.dark-theme .react-datepicker__month-dropdown {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n  height: auto;\\n  max-height: 250px;\\n  background-color: #1D1E24;\\n  position: absolute;\\n  z-index: 1;\\n  border-radius: 6px;\\n  min-width: 100px;\\n  width: 100%;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar,\\nhtml.dark-theme .react-datepicker__month-dropdown::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-thumb,\\nhtml.dark-theme .react-datepicker__month-dropdown::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-corner, html.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])::-webkit-scrollbar-track,\\nhtml.dark-theme .react-datepicker__month-dropdown::-webkit-scrollbar-corner,\\nhtml.dark-theme .react-datepicker__month-dropdown::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]):focus,\\nhtml.dark-theme .react-datepicker__month-dropdown:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view])[tabindex=\\\"0\\\"]:focus:focus-visible,\\nhtml.dark-theme .react-datepicker__month-dropdown[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .react-datepicker__year-dropdown-container > div:not([class*=read-view]) .react-datepicker__year-dropdown {\\n  padding: 4px;\\n  display: flex;\\n  flex-direction: column-reverse;\\n  justify-content: flex-end;\\n}\\nhtml.dark-theme .react-datepicker__month-dropdown-container {\\n  flex-grow: 2;\\n}\\nhtml.dark-theme .react-datepicker__month-dropdown-container .react-datepicker__month-dropdown {\\n  padding: 4px;\\n  min-width: 140px;\\n}\\nhtml.dark-theme .react-datepicker__year-option,\\nhtml.dark-theme .react-datepicker__month-option,\\nhtml.dark-theme .react-datepicker__month-year-option {\\n  padding: 0 8px;\\n  height: 24px;\\n  line-height: 24px;\\n  border-radius: 4px;\\n  font-size: 14px;\\n  margin: 4px 0;\\n  cursor: pointer;\\n}\\nhtml.dark-theme .react-datepicker__year-option:hover, html.dark-theme .react-datepicker__year-option:focus,\\nhtml.dark-theme .react-datepicker__month-option:hover,\\nhtml.dark-theme .react-datepicker__month-option:focus,\\nhtml.dark-theme .react-datepicker__month-year-option:hover,\\nhtml.dark-theme .react-datepicker__month-year-option:focus {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .react-datepicker__year-option--selected,\\nhtml.dark-theme .react-datepicker__month-option--selected,\\nhtml.dark-theme .react-datepicker__month-year-option--selected {\\n  display: none;\\n}\\nhtml.dark-theme .react-datepicker__year-option--preselected, html.dark-theme .react-datepicker__year-option--preselected:hover,\\nhtml.dark-theme .react-datepicker__month-option--preselected,\\nhtml.dark-theme .react-datepicker__month-option--preselected:hover {\\n  background: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__year-option--selected_year, html.dark-theme .react-datepicker__year-option--selected_year:hover,\\nhtml.dark-theme .react-datepicker__month-option--selected_month,\\nhtml.dark-theme .react-datepicker__month-option--selected_month:hover {\\n  background-color: #36A2EF;\\n  color: #000;\\n}\\nhtml.dark-theme .react-datepicker__navigation--next,\\nhtml.dark-theme .react-datepicker__navigation--previous {\\n  background-position: center;\\n  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZmlsbD0iI0ZGRiIgZD0iTTExLjY5MiA3SDMuNTU2QzMuMjQ5IDcgMyA3LjIyNCAzIDcuNXMuMjQ5LjUuNTU2LjVoOC4xMzZsLTQuMDk2IDQuMDk2YS41LjUgMCAwMC43MDcuNzA3bDQuMjQzLTQuMjQyYy4yNTgtLjI1OS40MDMtLjU4Ny40MzMtLjkyNWEuNDU0LjQ1NCAwIDAwMC0uMjcyIDEuNDk0IDEuNDk0IDAgMDAtLjQzMy0uOTI1TDguMzAzIDIuMTk3YS41LjUgMCAxMC0uNzA3LjcwN0wxMS42OTIgN3oiLz48L3N2Zz4=);\\n  cursor: pointer;\\n  position: absolute;\\n  top: 8px;\\n  height: 32px;\\n  width: 32px;\\n  z-index: 1;\\n  text-indent: -999em;\\n  overflow: hidden;\\n  background-repeat: no-repeat;\\n  border-radius: 4px;\\n  background-position: center;\\n}\\nhtml.dark-theme .react-datepicker__navigation--next:hover, html.dark-theme .react-datepicker__navigation--next:focus,\\nhtml.dark-theme .react-datepicker__navigation--previous:hover,\\nhtml.dark-theme .react-datepicker__navigation--previous:focus {\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .react-datepicker__navigation--previous {\\n  left: 8px;\\n  transform: rotate(180deg);\\n  transform-origin: center;\\n}\\nhtml.dark-theme .react-datepicker__navigation--next {\\n  right: 8px;\\n}\\nhtml.dark-theme .euiDatePicker {\\n  display: block;\\n  /**\\n   * Inline datepickers\\n   */\\n}\\nhtml.dark-theme .euiDatePicker .euiFormControlLayout {\\n  height: auto;\\n}\\nhtml.dark-theme .euiDatePicker--inline .euiFormControlLayout {\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n  background-color: transparent;\\n  box-shadow: none;\\n  padding: 0;\\n}\\nhtml.dark-theme .euiDatePicker--inline .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: transparent;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .euiDatePicker--inline .euiFormControlLayoutIcons {\\n  justify-content: center;\\n  -webkit-padding-after: 8px;\\n  padding-block-end: 8px;\\n}\\nhtml.dark-theme .euiDatePicker--shadow .euiFormControlLayout {\\n  box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.2), 0 2.6px 8px -1px rgba(0, 0, 0, 0.15), 0 5.7px 12px -1px rgba(0, 0, 0, 0.125), 0 15px 15px -1px rgba(0, 0, 0, 0.1);\\n}\\nhtml.dark-theme .euiDatePicker--shadow .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .react-datepicker {\\n  font-size: 12px;\\n  color: #DFE5EF;\\n  display: flex;\\n  border-radius: 6px;\\n  padding: 8px;\\n  justify-content: center;\\n}\\nhtml.dark-theme .react-datepicker--non-interactive {\\n  pointer-events: none;\\n}\\nhtml.dark-theme .react-datepicker__current-month,\\nhtml.dark-theme .react-datepicker-time__header {\\n  display: none;\\n}\\nhtml.dark-theme .react-datepicker__screenReaderOnly {\\n  position: absolute;\\n  top: auto;\\n  left: -10000px;\\n  width: 1px;\\n  height: 1px;\\n  clip: rect(0 0 0 0);\\n  -webkit-clip-path: inset(50%);\\n  clip-path: inset(50%);\\n  overflow: hidden;\\n  margin: -1px;\\n}\\nhtml.dark-theme .react-datepicker__focusTrap {\\n  display: flex;\\n  justify-content: center;\\n}\\nhtml.dark-theme .react-datepicker__month-container {\\n  flex-grow: 1;\\n  margin-top: 36px;\\n}\\nhtml.dark-theme .react-datepicker__header {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .react-datepicker-time__header {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .react-datepicker__month {\\n  text-align: center;\\n  border-radius: 6px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .react-datepicker__focusTrap,\\nhtml.dark-theme .react-datepicker {\\n    flex-direction: column;\\n  }\\n  html.dark-theme .react-datepicker__time-box {\\n    margin-top: 0;\\n  }\\n}\\nhtml.dark-theme .euiColorPicker {\\n  position: relative;\\n  width: 152px;\\n}\\nhtml.dark-theme .euiColorPicker__popoverAnchor .euiColorPicker__input {\\n  padding-right: 40px;\\n}\\nhtml.dark-theme .euiColorPicker__popoverAnchor .euiColorPicker__input[class*=\\\"--compressed\\\"] {\\n  padding-right: 32px;\\n}\\nhtml.dark-theme .euiColorPicker__popoverAnchor .euiColorPicker__input + .euiFormControlLayoutIcons {\\n  color: inherit;\\n}\\nhtml.dark-theme .euiColorPicker__swatches {\\n  display: flex;\\n  flex-wrap: wrap;\\n  margin: -4px;\\n}\\nhtml.dark-theme .euiColorPicker__swatch-item {\\n  margin: 4px;\\n}\\nhtml.dark-theme .euiSwatchInput__stroke {\\n  fill: none;\\n  stroke: rgba(255, 255, 255, 0.2);\\n}\\nhtml.dark-theme .euiColorPicker__popoverPanel--pickerOnly {\\n  padding-bottom: 0 !important;\\n}\\nhtml.dark-theme .euiColorPicker__input--inGroup {\\n  height: 38px !important;\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiColorPicker__input--inGroup.euiFieldText--compressed {\\n  height: 30px !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiColorPicker__alphaRange .euiRangeInput {\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiColorPickerSwatch {\\n  display: inline-block;\\n  height: 24px;\\n  width: 24px;\\n  border-radius: 3px;\\n  cursor: pointer;\\n  border: solid 1px rgba(255, 255, 255, 0.1);\\n  box-shadow: inset 0 0 0 1px rgba(29, 30, 36, 0.05);\\n}\\nhtml.dark-theme .euiColorPickerSwatch:disabled {\\n  cursor: default;\\n}\\nhtml.dark-theme .euiColorPickerSwatch:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiColorPickerSwatch:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiColorPickerSwatch:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiHue {\\n  background: linear-gradient(to right, #FF3232 0%, #FFF130 20%, #45FF30 35%, #28FFF0 52%, #282CFF 71%, #FF28FB 88%, #FF0094 100%);\\n  height: 24px;\\n  margin: 4px 0;\\n  position: relative;\\n}\\nhtml.dark-theme .euiHue::before, html.dark-theme .euiHue::after {\\n  content: \\\"\\\";\\n  left: 0;\\n  position: absolute;\\n  height: 8px;\\n  background: #1D1E24;\\n  width: 100%;\\n}\\nhtml.dark-theme .euiHue::after {\\n  bottom: 0;\\n}\\nhtml.dark-theme .euiHue__range {\\n  position: relative;\\n  height: 24px;\\n  width: calc(100% + 2px);\\n  margin: 0 -1px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  background: transparent;\\n  z-index: 2;\\n}\\nhtml.dark-theme .euiHue__range::-webkit-slider-thumb {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 14px;\\n  -webkit-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #1D1E24, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #1D1E24;\\n  cursor: pointer;\\n  background-color: #98A2B3;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme .euiHue__range::-moz-range-thumb {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 14px;\\n  -moz-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #1D1E24, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #1D1E24;\\n  cursor: pointer;\\n  background-color: #98A2B3;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme .euiHue__range::-ms-thumb {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 14px;\\n  -ms-transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  box-shadow: 0 0 0 1px #1D1E24, 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  border: 2px solid #1D1E24;\\n  cursor: pointer;\\n  background-color: #98A2B3;\\n  padding: 0;\\n  height: 16px;\\n  width: 16px;\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme .euiHue__range::-webkit-slider-thumb {\\n  -webkit-appearance: none;\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiHue__range::-ms-thumb {\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiHue__range::-ms-track {\\n  height: 24px;\\n  background: transparent;\\n  border-color: transparent;\\n  color: transparent;\\n}\\nhtml.dark-theme .euiHue__range::-moz-focus-outer {\\n  border: none;\\n}\\nhtml.dark-theme .euiHue__range::-ms-fill-lower, html.dark-theme .euiHue__range::-ms-fill-upper {\\n  background: transparent;\\n}\\nhtml.dark-theme .euiHue__range:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiSaturation {\\n  position: relative;\\n  width: 100%;\\n  padding-bottom: 100%;\\n  border-radius: 3px;\\n  touch-action: none;\\n  z-index: 3;\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__lightness,\\nhtml.dark-theme .euiSaturation .euiSaturation__saturation {\\n  position: absolute;\\n  top: -1px;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  border-radius: 3px;\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__lightness {\\n  background: linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0));\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__saturation {\\n  background: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__indicator {\\n  position: absolute;\\n  height: 12px;\\n  width: 12px;\\n  border-radius: 100%;\\n  margin-top: -6px;\\n  margin-left: -6px;\\n  border: 1px solid #D4DAE5;\\n}\\nhtml.dark-theme .euiSaturation .euiSaturation__indicator::before {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 100%;\\n  border: 1px solid #25262E;\\n}\\nhtml.dark-theme .euiSaturation:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSaturation:focus .euiSaturation__indicator {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiColorPalettePicker__itemTitle {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.dark-theme .euiColorPalettePicker__itemTitle + .euiColorPaletteDisplay {\\n  margin-top: 4px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay {\\n  display: flex;\\n  flex-direction: row;\\n  overflow: hidden;\\n  height: 8px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeExtraSmall {\\n  position: relative;\\n  height: 4px;\\n  border-radius: 4px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeExtraSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 4px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(212, 218, 229, 0.2);\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeExtraSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 4px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeSmall {\\n  position: relative;\\n  height: 8px;\\n  border-radius: 8px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeSmall::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 8px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(212, 218, 229, 0.2);\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeSmall .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 8px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeMedium {\\n  position: relative;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeMedium::after {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  border-radius: 16px;\\n  content: \\\"\\\";\\n  pointer-events: none;\\n  border: 1px solid rgba(212, 218, 229, 0.2);\\n}\\nhtml.dark-theme .euiColorPaletteDisplay--sizeMedium .euiColorPaletteDisplayFixed__bleedArea {\\n  height: 16px;\\n}\\nhtml.dark-theme .euiColorPaletteDisplayFixed__bleedArea {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  display: flex;\\n  height: 8px;\\n  width: calc(100% + 1px);\\n}\\nhtml.dark-theme .euiComboBox {\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  position: relative;\\n  /**\\n   * 1. Allow pills to truncate their text with an ellipsis.\\n   * 2. Don't allow pills/placeholder to overlap with the caret, loading icon or clear button.\\n   * 3. The height on combo can be larger than normal text inputs except for single-selection comboboxes.\\n   */\\n  /**\\n   * 1. Force field height to match other field heights.\\n   * 2. Force input height to expand to fill this element.\\n   * 3. Reset input appearance to mimic text\\n   * 4. Ensure that no input states are visible on the hidden input\\n   */\\n}\\nhtml.dark-theme .euiComboBox--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiComboBox--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiComboBox--inGroup {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiComboBox--compressed:not(.euiComboBox--appended, .euiComboBox--prepended) {\\n  height: auto;\\n  /* 3 */\\n}\\nhtml.dark-theme .euiComboBox:not(.euiComboBox--appended, .euiComboBox--prepended) .euiFormControlLayout {\\n  height: auto;\\n  /* 3 */\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  max-width: 400px;\\n  width: 100%;\\n  height: auto;\\n  padding: 4px 8px;\\n  padding-right: var(--eui-form-control-layout-icons-padding, 8px);\\n  /* 2 */\\n  display: flex;\\n  /* 1 */\\n  outline: none;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiComboBox .euiComboBox__inputWrap {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap--inGroup {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPill {\\n  max-width: calc(100% - 2px - 16px);\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap:not(.euiComboBox__inputWrap--noWrap) {\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  padding-left: 4px;\\n  height: auto;\\n  /* 3 */\\n  flex-wrap: wrap;\\n  /* 1 */\\n  align-content: flex-start;\\n  cursor: text;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--noWrap {\\n  align-items: center;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap.euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 8px;\\n  padding-inline-start: 8px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend, html.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  flex-shrink: 0;\\n  margin-inline: 2px;\\n  display: flex;\\n  /* Vertically centers any icons */\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__prepend {\\n  -webkit-margin-start: 4px;\\n  margin-inline-start: 4px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__inputWrap .euiComboBoxPlainTextSelection__append {\\n  -webkit-margin-end: 4px;\\n  margin-inline-end: 4px;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input {\\n  block-size: 24px;\\n  /* 2 */\\n  min-inline-size: 2px;\\n  max-inline-size: 100%;\\n  margin: 4px;\\n  /* 3 */\\n  background: transparent;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  /* 4 */\\n  -webkit-appearance: none !important;\\n  -moz-appearance: none !important;\\n  appearance: none !important;\\n  border: none !important;\\n  box-shadow: none !important;\\n  outline: none !important;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox .euiComboBox__input:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isOpen .euiComboBox__inputWrap--compressed {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isInvalid .euiComboBox__inputWrap {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  -webkit-text-fill-color: unset;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBox__inputWrap,\\nhtml.dark-theme .euiComboBox.euiComboBox-isDisabled .euiComboBoxPill {\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap {\\n  line-height: 32px;\\n  /* 2 */\\n  padding-block: 0;\\n}\\nhtml.dark-theme .euiComboBox.euiComboBox--compressed .euiComboBox__inputWrap--plainText {\\n  -webkit-padding-start: 4px;\\n  padding-inline-start: 4px;\\n}\\nhtml.dark-theme .euiComboBoxPill {\\n  height: 22px;\\n  line-height: 20px;\\n  vertical-align: baseline;\\n  /* Fix append/prepend vertical alignment */\\n}\\nhtml.dark-theme .euiComboBoxPill, html.dark-theme .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 4px;\\n}\\nhtml.dark-theme .euiComboBox--compressed .euiComboBoxPill, html.dark-theme .euiComboBox--compressed .euiComboBoxPill + .euiComboBoxPill {\\n  margin: 5px 4px 0 0;\\n}\\nhtml.dark-theme .euiComboBoxPill__prepend {\\n  margin-right: 4px;\\n}\\nhtml.dark-theme .euiComboBoxPill__append {\\n  margin-left: 4px;\\n}\\nhtml.dark-theme .euiComboBoxPill .euiBadge__text {\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiComboBoxPill .euiBadge__text .euiIcon {\\n  display: block;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList {\\n  max-height: 200px;\\n  overflow: hidden;\\n  /* Kibana FTR affordance - without this, Selenium complains about the overlaid\\n     text intercepting the button click. Since `title` is always present, and\\n     users can't highlight or copy combobox options anyway, we might as well\\n     disable clicks on text */\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__virtualization {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-corner, html.dark-theme .euiComboBoxOptionsList__virtualization::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList .euiTextTruncate {\\n  pointer-events: none;\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__empty {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 2 */\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n}\\nhtml.dark-theme .euiComboBoxOption {\\n  font-size: 14px;\\n  padding: 4px 8px 4px 16px;\\n  width: 100%;\\n  text-align: left;\\n  border: 1px solid #343741;\\n  border-color: transparent;\\n  display: flex;\\n  align-items: center;\\n  /* Fix vertical alignment of EuiIcons in prepend/append nodes */\\n}\\nhtml.dark-theme .euiComboBoxOption:hover {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiComboBoxOption.euiComboBoxOption-isFocused {\\n  cursor: pointer;\\n  color: #36A2EF;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiComboBoxOption.euiComboBoxOption-isDisabled {\\n  color: #535966;\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiComboBoxOption.euiComboBoxOption-isDisabled:hover {\\n  text-decoration: none;\\n}\\nhtml.dark-theme .euiComboBoxOption__contentWrapper {\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiComboBoxOption__content {\\n  text-overflow: ellipsis;\\n  overflow: hidden;\\n  white-space: nowrap;\\n  flex: 1;\\n  text-align: left;\\n}\\nhtml.dark-theme .euiComboBoxOption__emptyStateText {\\n  flex: 1;\\n  text-align: left;\\n  /* Extra specificity required to override EuiText's <p> styling */\\n}\\nhtml.dark-theme .euiComboBoxOptionsList__empty .euiComboBoxOption__emptyStateText {\\n  margin-bottom: 0;\\n}\\nhtml.dark-theme .euiComboBoxOption__enterBadge {\\n  margin-left: 4px;\\n}\\nhtml.dark-theme .euiComboBoxOption__prepend {\\n  margin-right: 8px;\\n}\\nhtml.dark-theme .euiComboBoxOption__append {\\n  margin-left: 8px;\\n}\\nhtml.dark-theme .euiComboBoxOption__prepend .euiIcon, html.dark-theme .euiComboBoxOption__append .euiIcon {\\n  display: block;\\n}\\nhtml.dark-theme .euiComboBoxTitle {\\n  font-size: 12px;\\n  padding: 11px 8px 4px;\\n  /* 1 */\\n  width: 100%;\\n  font-weight: 700;\\n  color: #FFF;\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow {\\n  padding: 0 8px 8px;\\n  /* A bit of a visual trickery to make the format \\\"hint\\\" become an \\\"error\\\" text.\\n     NOTE: Normally reordering visually (vs DOM) isn't super great for screen reader users,\\n     but as the help text is already read out via `aria-describedby`, and the error text\\n     is read out immediately via `aria-live`, we can fairly safely prioritize visuals instead */\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormRow__fieldWrapper {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormControlLayout {\\n  order: 0;\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormHelpText {\\n  order: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__absoluteDateFormRow .euiFormErrorText {\\n  order: 2;\\n}\\nhtml.dark-theme .euiDatePopoverButton {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiDatePopoverButton::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDatePopoverButton:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDatePopoverButton::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDatePopoverButton--compressed {\\n  line-height: 30px;\\n  height: 30px;\\n}\\nhtml.dark-theme .euiDatePopoverButton:focus, html.dark-theme .euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n}\\nhtml.dark-theme .euiDatePopoverButton-needsUpdating {\\n  background-color: #264341;\\n  color: #7DDED8;\\n}\\nhtml.dark-theme .euiDatePopoverButton-needsUpdating:focus, html.dark-theme .euiDatePopoverButton-needsUpdating.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #7DDED8, #7DDED8 2px, transparent 2px, transparent 100%);\\n}\\nhtml.dark-theme .euiDatePopoverButton-isInvalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n  background-color: transparent;\\n  color: #F86B63;\\n}\\nhtml.dark-theme .euiDatePopoverButton-isInvalid:focus, html.dark-theme .euiDatePopoverButton-isInvalid.euiDatePopoverButton-isSelected {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n}\\nhtml.dark-theme .euiDatePopoverButton:disabled {\\n  background-color: #202128;\\n  background-image: none;\\n  color: #98A2B3;\\n  cursor: default;\\n}\\nhtml.dark-theme .euiDatePopoverButton--start {\\n  text-align: center;\\n}\\nhtml.dark-theme .euiDatePopoverButton--end {\\n  text-align: center;\\n}\\nhtml.dark-theme .euiDatePopoverContent,\\nhtml.dark-theme .euiDatePopoverContent .react-datepicker {\\n  width: 400px;\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiDatePopoverContent__padded {\\n  padding: 8px;\\n}\\nhtml.dark-theme .euiDatePopoverContent__padded--large {\\n  padding: 16px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiDatePopoverContent {\\n    width: 284px;\\n  }\\n}\\nhtml.dark-theme .euiQuickSelectPopover__content {\\n  width: 400px;\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__content .euiQuickSelectPopover__panel:not(:first-child) {\\n  border-top: 1px solid #343741;\\n  padding-top: 12px;\\n  margin-top: 12px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__content .euiQuickSelectPopover__panel .euiQuickSelectPopover__panelTitle {\\n  float: left;\\n  margin-bottom: 12px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__section {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 132px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n  margin: 8px 0 0;\\n  clear: both;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__section::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__section::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__section::-webkit-scrollbar-corner, html.dark-theme .euiQuickSelectPopover__section::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__buttonContent {\\n  gap: 4px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__sectionItem {\\n  font-size: 14px;\\n  line-height: 14px;\\n}\\nhtml.dark-theme .euiQuickSelectPopover__sectionItem--recentlyUsed:not(:last-of-type) {\\n  margin-bottom: 8px;\\n}\\nhtml.dark-theme .euiQuickSelect__applyButton {\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiRefreshInterval__startButton {\\n  min-width: 90px;\\n}\\nhtml.dark-theme .euiSuperDatePicker {\\n  display: flex;\\n  gap: 8px;\\n  max-width: 100%;\\n  min-width: min(326px, 100%);\\n  width: 606px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiSuperDatePicker {\\n    width: 100%;\\n  }\\n}\\nhtml.dark-theme .euiSuperDatePicker--isAutoRefreshOnly {\\n  min-width: min(200px, 100%);\\n  width: 400px;\\n}\\nhtml.dark-theme .euiSuperDatePicker--noUpdateButton {\\n  min-width: min(200px, 100%);\\n  width: 480px;\\n}\\nhtml.dark-theme .euiSuperDatePicker--fullWidth {\\n  width: 100%;\\n}\\nhtml.dark-theme .euiSuperDatePicker--isQuickSelectOnly {\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiSuperDatePicker--autoWidth {\\n  display: inline-flex;\\n  width: auto;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiDatePickerRange {\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiFormControlLayout {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  overflow: hidden;\\n  background-color: #16171c;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.dark-theme .euiSuperDatePicker .euiFormControlLayout__childrenWrapper > .euiFormControlLayoutDelimited__input {\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  display: block;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 38px;\\n  height: 38px;\\n  word-break: break-all;\\n  transition: background 150ms ease-in;\\n  display: flex;\\n  justify-content: space-between;\\n  text-align: left;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat:not(:disabled):hover, html.dark-theme .euiSuperDatePicker__prettyFormat:focus {\\n  text-decoration: none;\\n}\\nhtml.dark-theme .euiSuperDatePicker__prettyFormat:disabled {\\n  background-color: #202128;\\n  color: #98A2B3;\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper {\\n  background-color: #264341;\\n}\\nhtml.dark-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayoutDelimited .euiFormControlLayoutDelimited__delimiter {\\n  color: #7DDED8;\\n}\\nhtml.dark-theme .euiSuperDatePicker--needsUpdating .euiFormControlLayout__childrenWrapper {\\n  transition: background 150ms ease-in;\\n}\\nhtml.dark-theme .euiDataGrid {\\n  display: flex;\\n  flex-direction: column;\\n  align-items: stretch;\\n  overflow: hidden;\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGrid--fullScreen {\\n  height: 100%;\\n  position: fixed;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  z-index: 999;\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid--fullScreen .euiDataGrid__pagination {\\n  padding-bottom: 4px;\\n  background: #25262E;\\n  box-shadow: 1px 0 0 1px #343741;\\n}\\nhtml.dark-theme .euiDataGrid__content {\\n  flex-grow: 1;\\n  height: 100%;\\n  max-width: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  z-index: 1;\\n  position: relative;\\n  background: #141519;\\n  font-feature-settings: \\\"tnum\\\" 1;\\n}\\nhtml.dark-theme .euiDataGrid__customRenderBody {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) #1D1E24;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  width: 100%;\\n  overflow: auto;\\n}\\nhtml.dark-theme .euiDataGrid__customRenderBody::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-corner, html.dark-theme .euiDataGrid__customRenderBody::-webkit-scrollbar-track {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__pagination {\\n  z-index: 2;\\n  padding-top: 4px;\\n  flex-grow: 0;\\n}\\nhtml.dark-theme .euiDataGrid__restrictBody {\\n  height: 100vh;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiDataGrid__restrictBody .euiHeader[data-fixed-header] {\\n  z-index: 998 !important;\\n}\\nhtml.dark-theme .euiDataGrid__restrictBody .euiOverlayMask[data-relative-to-header=below] {\\n  top: 0;\\n}\\nhtml.dark-theme .euiDataGrid__restrictBody .euiFlyout {\\n  top: 0;\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGrid__focusWrap {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGrid__virtualized {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) #1D1E24;\\n  scrollbar-width: thin;\\n  scroll-padding: 0;\\n}\\nhtml.dark-theme .euiDataGrid__virtualized::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGrid__virtualized::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__virtualized::-webkit-scrollbar-corner, html.dark-theme .euiDataGrid__virtualized::-webkit-scrollbar-track {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__scrollOverlay {\\n  position: absolute;\\n  top: -1px;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  pointer-events: none;\\n  box-shadow: inset 0 0 0 1px #343741;\\n}\\nhtml.dark-theme .euiDataGrid--bordersHorizontal .euiDataGrid__scrollOverlay {\\n  box-shadow: inset 0 -2px 0 -1px #343741;\\n}\\nhtml.dark-theme .euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayBottom {\\n  position: absolute;\\n  width: 100%;\\n  height: 1px;\\n  background-color: #343741;\\n}\\nhtml.dark-theme .euiDataGrid__scrollOverlay .euiDataGrid__scrollBarOverlayRight {\\n  position: absolute;\\n  height: 100%;\\n  width: 1px;\\n  background-color: #343741;\\n}\\nhtml.dark-theme .euiDataGridHeader {\\n  display: flex;\\n  z-index: 999;\\n  background: #1D1E24;\\n  position: sticky;\\n  top: 0;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  padding: 6px;\\n  flex: 0 0 auto;\\n  position: relative;\\n  align-items: center;\\n  display: flex;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell > [data-focus-lock-disabled] {\\n  width: 100%;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:focus, html.dark-theme .euiDataGridHeaderCell--hasColumnActions:focus-within, html.dark-theme .euiDataGridHeaderCell--isActionsPopoverOpen {\\n  outline: none;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:focus::after, html.dark-theme .euiDataGridHeaderCell--hasColumnActions:focus-within::after, html.dark-theme .euiDataGridHeaderCell--isActionsPopoverOpen::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #36A2EF);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__button {\\n  position: relative;\\n  display: flex;\\n  align-items: center;\\n  gap: 4px;\\n  width: 100%;\\n  font-weight: 700;\\n  outline: none;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__content {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__sortingArrow {\\n  flex: 0 0 auto;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiDataGridHeaderCell__icon {\\n  flex: 0 0 auto;\\n  margin-left: auto;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  height: 16px;\\n  overflow: hidden;\\n  width: 0;\\n  opacity: 0;\\n  transition: width 150ms ease-in, opacity 350ms ease-in;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):focus-within .euiDataGridHeaderCell__icon, html.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn):hover .euiDataGridHeaderCell__icon,\\nhtml.dark-theme .euiDataGridHeaderCell:not(.euiDataGridHeaderCell--controlColumn) .euiPopover-isOpen .euiDataGridHeaderCell__icon {\\n  width: 16px;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell.euiDataGridHeaderCell--numeric .euiDataGridHeaderCell__content, html.dark-theme .euiDataGridHeaderCell.euiDataGridHeaderCell--currency .euiDataGridHeaderCell__content {\\n  flex-grow: 1;\\n  text-align: right;\\n}\\nhtml.dark-theme .euiDataGridHeader__action--selected {\\n  font-weight: 700 !important;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone.euiDataGrid--bordersHorizontal .euiDataGridHeader {\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-left: none;\\n  border-right: none;\\n  border-bottom: 2px solid #343741;\\n  border-bottom-color: #DFE5EF;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone.euiDataGrid--headerUnderline .euiDataGridHeaderCell {\\n  border-bottom: 2px solid #343741;\\n  border-color: #DFE5EF;\\n}\\nhtml.dark-theme .euiDataGrid--headerShade .euiDataGridHeaderCell {\\n  background: #212229;\\n}\\nhtml.dark-theme .euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-right: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  border-left: none;\\n}\\nhtml.dark-theme .euiDataGrid--headerShade.euiDataGrid--bordersAll .euiDataGridHeaderCell:first-of-type {\\n  border-left: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGrid--headerShade.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone .euiDataGridHeaderCell {\\n  border: none;\\n}\\nhtml.dark-theme .euiDataGrid--borderhorizontal .euiDataGridHeaderCell {\\n  border-top: none;\\n  border-right: none;\\n  border-left: none;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeSmall .euiDataGridHeaderCell {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeLarge .euiDataGridHeaderCell {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.dark-theme .euiDataGrid--paddingSmall .euiDataGridHeaderCell {\\n  padding: 4px;\\n}\\nhtml.dark-theme .euiDataGrid--paddingLarge .euiDataGridHeaderCell {\\n  padding: 8px;\\n}\\nhtml.dark-theme .euiDataGrid--noControls.euiDataGrid--bordersAll .euiDataGridHeaderCell {\\n  border-top: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGrid--noControls.euiDataGrid--bordersHorizontal .euiDataGridHeaderCell {\\n  border-top: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGridFooter {\\n  display: flex;\\n  width: -webkit-fit-content;\\n  width: -moz-fit-content;\\n  width: fit-content;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridFooterCell {\\n  flex: 0 0 auto;\\n  position: relative;\\n  font-weight: 700;\\n}\\nhtml.dark-theme .euiDataGrid--stickyFooter .euiDataGridFooter {\\n  position: sticky;\\n  bottom: 0;\\n}\\nhtml.dark-theme .euiDataGrid--footerOverline .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-top: 2px solid #343741;\\n  border-top-color: #DFE5EF !important;\\n  background: #1D1E24 !important;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\nhtml.dark-theme .euiDataGrid--bordersHorizontal .euiDataGridRowCell.euiDataGridFooterCell {\\n  border-left: none;\\n  border-right: none;\\n}\\nhtml.dark-theme .euiDataGrid--footerShade .euiDataGridRowCell.euiDataGridFooterCell {\\n  background: #212229;\\n}\\nhtml.dark-theme .euiDataGridColumnResizer {\\n  position: absolute;\\n  top: 0;\\n  right: -8px;\\n  height: 100%;\\n  width: 16px;\\n  cursor: ew-resize;\\n  opacity: 0;\\n  z-index: 2;\\n}\\nhtml.dark-theme .euiDataGridColumnResizer::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  left: 7px;\\n  top: 0;\\n  bottom: 0;\\n  width: 3px;\\n  background-color: #36A2EF;\\n}\\nhtml.dark-theme .euiDataGridColumnResizer:hover, html.dark-theme .euiDataGridColumnResizer:active {\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiDataGridColumnResizer:hover ~ .euiDataGridHeaderCell__content, html.dark-theme .euiDataGridColumnResizer:active ~ .euiDataGridHeaderCell__content {\\n  -webkit-user-select: none;\\n  -moz-user-select: none;\\n  -ms-user-select: none;\\n      user-select: none;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:last-child .euiDataGridColumnResizer {\\n  right: 0;\\n  width: 8px;\\n}\\nhtml.dark-theme .euiDataGridHeaderCell:last-child .euiDataGridColumnResizer::after {\\n  left: auto;\\n  right: 0;\\n}\\nhtml.dark-theme .euiDataGridRow {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGridRowCell {\\n  position: relative;\\n  border-right: solid 1px #24272e;\\n  border-bottom: 1px solid #343741;\\n  --euiDataGridCellOutlineColor: #36A2EF;\\n}\\nhtml.dark-theme .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 6px;\\n  height: 100%;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiDataGridRowCell .euiDataGridRowCell__content--autoHeight {\\n  height: auto;\\n}\\nhtml.dark-theme .euiDataGridRowCell > [data-focus-lock-disabled] {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--firstColumn {\\n  border-left: 1px solid #343741;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--lastColumn {\\n  border-right-color: #343741;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover, html.dark-theme .euiDataGridRowCell:focus, html.dark-theme .euiDataGridRowCell.euiDataGridRowCell--open {\\n  outline: none;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover::after, html.dark-theme .euiDataGridRowCell:focus::after, html.dark-theme .euiDataGridRowCell.euiDataGridRowCell--open::after {\\n  content: \\\"\\\";\\n  display: block;\\n  width: 100%;\\n  height: 100%;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  border: 2px solid var(--euiDataGridCellOutlineColor, #36A2EF);\\n  border-radius: 3px;\\n  z-index: 2;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) {\\n  --euiDataGridCellOutlineColor: #98A2B3;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover:not(:focus, :focus-within, .euiDataGridRowCell--open) .euiDataGridRowCell__actions {\\n  -webkit-animation-delay: 350ms;\\n  animation-delay: 350ms;\\n}\\nhtml.dark-theme .euiDataGridRowCell:hover .euiDataGridRowCell__actions, html.dark-theme .euiDataGridRowCell:focus .euiDataGridRowCell__actions, html.dark-theme .euiDataGridRowCell:focus-within .euiDataGridRowCell__actions, html.dark-theme .euiDataGridRowCell.euiDataGridRowCell--open .euiDataGridRowCell__actions, html.dark-theme .euiDataGridRowCell[data-keyboard-closing] .euiDataGridRowCell__actions {\\n  -webkit-animation-duration: 90ms;\\n  animation-duration: 90ms;\\n  -webkit-animation-name: euiDataGridCellActionsSlideIn;\\n  animation-name: euiDataGridCellActionsSlideIn;\\n  -webkit-animation-iteration-count: 1;\\n  animation-iteration-count: 1;\\n  -webkit-animation-fill-mode: forwards;\\n  animation-fill-mode: forwards;\\n}\\nhtml.dark-theme .euiDataGridRowCell:not(:hover):not(:focus):not(.euiDataGridRowCell--open):not([data-keyboard-closing]) .euiDataGridRowCell__actions {\\n  display: none;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--numeric {\\n  text-align: right;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--currency {\\n  text-align: right;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--uppercase {\\n  text-transform: uppercase;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--lowercase {\\n  text-transform: lowercase;\\n}\\nhtml.dark-theme .euiDataGridRowCell.euiDataGridRowCell--capitalize {\\n  text-transform: capitalize;\\n}\\nhtml.dark-theme .euiDataGridRowCell__popover {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  overflow: auto;\\n  z-index: 1000 !important;\\n  filter: none;\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n  -webkit-animation-duration: 250ms;\\n  animation-duration: 250ms;\\n  -webkit-animation-name: euiDataGridCellPopover;\\n  animation-name: euiDataGridCellPopover;\\n}\\nhtml.dark-theme .euiDataGridRowCell__popover::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGridRowCell__popover::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiDataGridRowCell__popover::-webkit-scrollbar-corner, html.dark-theme .euiDataGridRowCell__popover::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiDataGridRowCell--controlColumn .euiDataGridRowCell__content {\\n  max-height: 100%;\\n  height: auto;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actions,\\nhtml.dark-theme .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  position: absolute;\\n  bottom: 100%;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions,\\nhtml.dark-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  left: 0;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions,\\nhtml.dark-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions + [data-euiportal] > .euiPopover {\\n  right: 0;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actions {\\n  z-index: 998;\\n  margin-bottom: -1px;\\n  display: flex;\\n  gap: 2px;\\n  padding-inline: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n  color: #1D1E24;\\n  border: 1px solid var(--euiDataGridCellOutlineColor);\\n  border-top-left-radius: 3px;\\n  border-top-right-radius: 3px;\\n  transform: scaleY(0);\\n  transform-origin: bottom;\\n}\\nhtml.dark-theme .euiDataGridRowCell[data-gridcell-visible-row-index=\\\"0\\\"] > .euiDataGridRowCell__actions {\\n  z-index: 999;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions {\\n  border-bottom-right-radius: 3px;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions {\\n  border-bottom-left-radius: 3px;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actions::after {\\n  content: \\\"\\\";\\n  position: absolute;\\n  top: 100%;\\n  height: 2px;\\n  width: 2px;\\n  background-color: var(--euiDataGridCellOutlineColor);\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignLeft .euiDataGridRowCell__actions::after {\\n  left: -1px;\\n}\\nhtml.dark-theme .euiDataGridRowCell--alignRight .euiDataGridRowCell__actions::after {\\n  right: -1px;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actionButtonIcon {\\n  height: 20px;\\n  width: 16px;\\n  border-radius: 0;\\n  /* Force all cell action buttons to match EUI colors */\\n  /* Manually increase the size of the expand cell icon - it's a bit small by default */\\n}\\nhtml.dark-theme .euiDataGridRowCell__actionButtonIcon,\\nhtml.dark-theme .euiDataGridRowCell__actionButtonIcon svg {\\n  background-color: transparent !important;\\n  color: currentColor !important;\\n  fill: currentColor !important;\\n}\\nhtml.dark-theme .euiDataGridRowCell__actionButtonIcon.euiDataGridRowCell__expandCell .euiIcon {\\n  width: 120%;\\n  height: 100%;\\n}\\nhtml.dark-theme .euiDataGrid--stripes .euiDataGridRow--striped {\\n  background-color: #25262E;\\n}\\nhtml.dark-theme .euiDataGrid--rowHoverHighlight .euiDataGridRow:hover {\\n  background-color: #2E2D25;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone .euiDataGridRowCell {\\n  border-color: transparent !important;\\n}\\nhtml.dark-theme .euiDataGrid--bordersHorizontal .euiDataGridRowCell {\\n  border-right-color: transparent;\\n  border-left-color: transparent;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.dark-theme .euiDataGrid--paddingSmall .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 4px;\\n}\\nhtml.dark-theme .euiDataGrid--paddingLarge .euiDataGridRowCell .euiDataGridRowCell__content {\\n  padding: 8px;\\n}\\n@-webkit-keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@keyframes euiDataGridCellActionsSlideIn {\\n  from {\\n    transform: scaleY(0);\\n  }\\n  to {\\n    transform: scaleY(1);\\n  }\\n}\\n@-webkit-keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\n@keyframes euiDataGridCellPopover {\\n  from {\\n    opacity: 0;\\n  }\\n  to {\\n    opacity: 1;\\n  }\\n}\\nhtml.dark-theme .euiDataGrid__controls {\\n  background: #141519;\\n  position: relative;\\n  z-index: 2;\\n  border: 1px solid #343741;\\n  padding: 4px 4px 4px 0;\\n  display: flex;\\n  justify-content: space-between;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiDataGrid__rightControls {\\n  white-space: nowrap;\\n}\\nhtml.dark-theme .euiDataGrid__rightControls:only-child {\\n  margin-left: auto;\\n}\\nhtml.dark-theme .euiDataGrid__rightControls > * + * {\\n  margin-left: 8px;\\n}\\nhtml.dark-theme .euiDataGrid__leftControls > * + * {\\n  margin-left: 2px;\\n}\\nhtml.dark-theme .euiDataGrid--bordersNone .euiDataGrid__controls {\\n  border: none;\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid--bordersHorizontal .euiDataGrid__controls {\\n  border-right: none;\\n  border-left: none;\\n  border-top: none;\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  padding: 8px;\\n  margin: -8px;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll::-webkit-scrollbar-corner, html.dark-theme .euiDataGrid__controlScroll::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiDataGrid__controlScroll[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__item {\\n  padding: 4px;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  max-height: 400px;\\n  margin: 0 -8px;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-corner, html.dark-theme .euiDataGridColumnSelector__columnList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__columnList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiDataGridColumnSelector__itemLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__item-isDragging {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n  background: #1D1E24;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  padding-top: 4px;\\n  padding-bottom: 4px;\\n  max-height: 300px;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-corner, html.dark-theme .euiDataGridColumnSorting__fieldList::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__fieldList[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__field {\\n  display: block;\\n  padding: 4px 8px;\\n  width: 100%;\\n  outline-offset: -2px;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__field:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__field:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__field:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #515761;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__name {\\n  padding-right: 24px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiDataGridColumnSorting__name {\\n    padding-right: 4px;\\n  }\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__order {\\n  min-width: 200px;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiDataGridColumnSorting__order {\\n    min-width: unset;\\n  }\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__order .euiButtonGroup__buttons {\\n  border: none;\\n}\\nhtml.dark-theme .euiDataGridColumnSorting__order .euiButtonGroupButton {\\n  font-size: 12px;\\n}\\nhtml.dark-theme .euiDataGrid__displayPopoverPanel {\\n  width: 416px;\\n}\\nhtml.dark-theme .euiDataGrid__keyboardShortcuts {\\n  display: block;\\n  max-inline-size: 400px;\\n  max-block-size: 80vh;\\n  overflow-y: auto;\\n  overflow-block: auto;\\n}\\nhtml.dark-theme .euiDataGrid__keyboardShortcuts .euiDescriptionList {\\n  row-gap: 0;\\n}\\nhtml.dark-theme .euiCheckbox {\\n  position: relative;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input ~ .euiCheckbox__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 4px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:checked + .euiCheckbox__square {\\n  border-color: #36A2EF;\\n  background-color: #36A2EF;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%2829, 30, 36%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:indeterminate + .euiCheckbox__square {\\n  border-color: #36A2EF;\\n  background-color: #36A2EF;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%2829, 30, 36%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input[disabled] ~ .euiCheckbox__label {\\n  color: #535966;\\n  cursor: not-allowed !important;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input[disabled] + .euiCheckbox__square {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:checked[disabled] + .euiCheckbox__square {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M.375 2.625L3.375 5.625M3.375 5.625L8.625.375' fill='none' fill-rule='evenodd' stroke='rgb%28166, 170, 176%29' stroke-linecap='round' stroke-width='1.5' transform='translate(.5 1)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:indeterminate[disabled] + .euiCheckbox__square {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Crect width='6' height='6' fill='rgb%28166, 170, 176%29' fill-rule='evenodd'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiCheckbox.euiCheckbox--inList, html.dark-theme .euiCheckbox.euiCheckbox--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\nhtml.dark-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__input,\\nhtml.dark-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__square, html.dark-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input,\\nhtml.dark-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__square {\\n  top: 0;\\n}\\nhtml.dark-theme .euiCheckbox.euiCheckbox--inList .euiCheckbox__input, html.dark-theme .euiCheckbox.euiCheckbox--noLabel .euiCheckbox__input {\\n  margin: 0;\\n}\\nhtml.dark-theme .euiCheckboxGroup__item + .euiCheckboxGroup__item {\\n  margin-top: 4px;\\n}\\nhtml.dark-theme .euiCheckboxGroup__item + .euiCheckboxGroup__item.euiCheckbox--compressed {\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiDescribedFormGroup {\\n  max-width: 800px;\\n}\\nhtml.dark-theme .euiDescribedFormGroup + * {\\n  margin-top: 24px;\\n}\\nhtml.dark-theme .euiDescribedFormGroup.euiDescribedFormGroup--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__description {\\n  padding-top: 8px;\\n}\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields {\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child,\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel) {\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow--hasEmptyLabelSpace:first-child::before,\\nhtml.dark-theme .euiDescribedFormGroup .euiDescribedFormGroup__fields > .euiFormRow:first-child:not(.euiFormRow--hasLabel)::before {\\n  content: \\\"\\\";\\n}\\nhtml.dark-theme .euiDescribedFormGroup__descriptionColumn {\\n  min-width: min(20rem, 50%);\\n}\\nhtml.dark-theme .euiFieldNumber {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\nhtml.dark-theme .euiFieldNumber--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFieldNumber--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldNumber {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldNumber::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldNumber:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiFieldNumber:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldNumber--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldNumber--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldNumber--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFieldNumber--withIcon {\\n  padding-left: 40px;\\n}\\nhtml.dark-theme .euiFieldNumber--withIcon.euiFieldNumber--compressed {\\n  padding-left: 32px;\\n}\\nhtml.dark-theme .euiFieldPassword {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n}\\nhtml.dark-theme .euiFieldPassword--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFieldPassword--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldPassword {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldPassword::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldPassword:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiFieldPassword:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldPassword--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldPassword--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldPassword--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFieldPassword.euiFieldPassword--compressed {\\n  padding-left: 32px;\\n}\\nhtml.dark-theme .euiFieldPassword--withToggle::-ms-reveal {\\n  display: none;\\n}\\nhtml.dark-theme .euiFieldSearch {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  padding-left: 40px;\\n  -webkit-appearance: textfield;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiFieldSearch--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFieldSearch--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldSearch {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldSearch::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldSearch:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiFieldSearch:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldSearch--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldSearch--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldSearch--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFieldSearch-isLoading {\\n  padding-right: 40px;\\n}\\nhtml.dark-theme .euiFieldSearch-isLoading.euiFieldSearch--compressed {\\n  padding-right: 32px;\\n}\\nhtml.dark-theme .euiFieldSearch::-webkit-search-decoration, html.dark-theme .euiFieldSearch::-webkit-search-cancel-button {\\n  -webkit-appearance: none;\\n  /* 1, 2 */\\n}\\nhtml.dark-theme .euiFieldSearch--compressed {\\n  padding-left: 32px;\\n}\\nhtml.dark-theme .euiFieldText {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n}\\nhtml.dark-theme .euiFieldText--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFieldText--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFieldText--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldText {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldText::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldText:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiFieldText:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiFieldText--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFieldText--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFieldText--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFieldText--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFieldText--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFieldText--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFieldText--withIcon {\\n  padding-left: 40px;\\n}\\nhtml.dark-theme .euiFieldText--withIcon.euiFieldText--compressed {\\n  padding-left: 32px;\\n}\\nhtml.dark-theme .euiFilePicker {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  position: relative;\\n}\\nhtml.dark-theme .euiFilePicker--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFilePicker--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFilePicker--inGroup {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiFilePicker.euiFilePicker--large {\\n  border-radius: 6px;\\n  overflow: hidden;\\n  height: auto;\\n}\\nhtml.dark-theme .euiFilePicker.euiFilePicker--large.euiFilePicker--compressed {\\n  border-radius: 4px;\\n}\\nhtml.dark-theme .euiFilePicker__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiFilePicker__input:hover {\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiFilePicker__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled {\\n  opacity: 0;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled ~ .euiFilePicker__prompt {\\n  color: #535966;\\n}\\nhtml.dark-theme .euiFilePicker__icon {\\n  position: absolute;\\n  left: 12px;\\n  top: 12px;\\n  transition: transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.dark-theme .euiFilePicker--compressed .euiFilePicker__icon {\\n  top: 8px;\\n  left: 8px;\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__icon {\\n  position: static;\\n  margin-bottom: 16px;\\n}\\nhtml.dark-theme .euiFilePicker__prompt {\\n  padding-left: 40px;\\n  /* 2 */\\n  height: 40px;\\n  padding-top: 12px;\\n  padding-right: 12px;\\n  padding-bottom: 12px;\\n  pointer-events: none;\\n  /* 1 */\\n  border: 2px dashed #343741;\\n  border-radius: 6px;\\n  transition: border-color 150ms ease-in, background-color 150ms ease-in;\\n}\\nhtml.dark-theme .euiFilePicker--compressed .euiFilePicker__prompt {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n  padding-left: 32px;\\n  /* 2 */\\n  height: 32px;\\n  border-radius: 4px;\\n  box-shadow: none;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFilePicker--compressed .euiFilePicker__prompt {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__prompt {\\n  height: 128px;\\n  /* 4 */\\n  padding: 0 24px;\\n  display: flex;\\n  flex-direction: column;\\n  align-items: center;\\n  justify-content: center;\\n}\\nhtml.dark-theme .euiFilePicker--large.euiFilePicker--compressed .euiFilePicker__prompt {\\n  height: 104px;\\n  /* 4 */\\n}\\nhtml.dark-theme .euiFilePicker-isInvalid:not(.euiFilePicker__showDrop) .euiFilePicker__input:not(:disabled):not(:focus) + .euiFilePicker__prompt {\\n  border-color: #F86B63;\\n}\\nhtml.dark-theme .euiFilePicker__promptText {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  line-height: 16px;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) .euiFilePicker__promptText {\\n  color: #36A2EF;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__promptText {\\n  margin-top: -2px;\\n}\\nhtml.dark-theme .euiFilePicker__clearButton,\\nhtml.dark-theme .euiFilePicker__loadingSpinner {\\n  position: absolute;\\n  right: 12px;\\n  top: 12px;\\n}\\nhtml.dark-theme .euiFilePicker--compressed .euiFilePicker__clearButton,\\nhtml.dark-theme .euiFilePicker--compressed .euiFilePicker__loadingSpinner {\\n  top: 8px;\\n}\\nhtml.dark-theme .euiFilePicker__clearButton {\\n  pointer-events: auto;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton .euiFilePicker__clearIcon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #1D1E24;\\n  stroke: #1D1E24;\\n  stroke-width: 2px;\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__clearButton {\\n  position: relative;\\n  top: 0;\\n  right: 0;\\n}\\nhtml.dark-theme .euiFilePicker__showDrop .euiFilePicker__prompt,\\nhtml.dark-theme .euiFilePicker__input:focus + .euiFilePicker__prompt {\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  box-shadow: none;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFilePicker__input:disabled + .euiFilePicker__prompt::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-isLoading .euiFilePicker__prompt, html.dark-theme .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-hasFiles .euiFilePicker__prompt {\\n  padding-right: 40px;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  color: #DFE5EF;\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__promptText,\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__icon,\\nhtml.dark-theme .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\nhtml.dark-theme .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__promptText {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__icon {\\n  transform: scale(1.1);\\n}\\nhtml.dark-theme .euiFilePicker--large.euiFilePicker-hasFiles .euiFilePicker__promptText {\\n  font-weight: 700;\\n}\\nhtml.dark-theme .euiForm__error {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  list-style: disc;\\n}\\nhtml.dark-theme .euiForm__errors {\\n  margin-bottom: 16px;\\n}\\nhtml.dark-theme .euiSelect {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  -webkit-appearance: none;\\n  -moz-appearance: none;\\n  appearance: none;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSelect--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiSelect--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiSelect--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiSelect {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiSelect::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSelect:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiSelect:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiSelect--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiSelect--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiSelect--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSelect--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSelect--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSelect--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiSelect--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSelect--inGroup {\\n  line-height: 38px;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSelect--inGroup.euiSelect--compressed {\\n  line-height: 30px;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSelect::-ms-expand {\\n  display: none;\\n}\\nhtml.dark-theme .euiSelect:focus::-ms-value {\\n  color: #DFE5EF;\\n  background: transparent;\\n}\\nhtml.dark-theme .euiSelect:-moz-focusring {\\n  color: transparent;\\n  text-shadow: 0 0 0 #DFE5EF;\\n}\\nhtml.dark-theme .euiSuperSelect__listbox {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  max-height: 300px;\\n  overflow: hidden;\\n  overflow-y: auto;\\n}\\nhtml.dark-theme .euiSuperSelect__listbox::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiSuperSelect__listbox::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiSuperSelect__listbox::-webkit-scrollbar-corner, html.dark-theme .euiSuperSelect__listbox::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiSuperSelect__item {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  padding: 8px;\\n}\\nhtml.dark-theme .euiSuperSelect__item:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiSuperSelect__item:focus {\\n  cursor: pointer;\\n  text-decoration: underline;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiSuperSelect__item:disabled {\\n  cursor: not-allowed;\\n  text-decoration: none;\\n  color: #515761;\\n}\\nhtml.dark-theme .euiSuperSelect__item--hasDividers:not(:last-of-type) {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.dark-theme .euiSuperSelectControl {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  display: block;\\n  /* 2 */\\n  text-align: left;\\n  line-height: 40px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n}\\nhtml.dark-theme .euiSuperSelectControl--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiSuperSelectControl--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiSuperSelectControl {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiSuperSelectControl::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSuperSelectControl:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiSuperSelectControl:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiSuperSelectControl--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiSuperSelectControl--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiSuperSelectControl-isInvalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiSuperSelectControl--compressed {\\n  line-height: 32px;\\n  /* 1 */\\n  padding-top: 0;\\n  /* 1 */\\n  padding-bottom: 0;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiSuperSelectControl__placeholder {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n}\\nhtml.dark-theme .euiSuperSelectControl.euiSuperSelect--isOpen__button {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFormControlLayout {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n}\\nhtml.dark-theme .euiFormControlLayout--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFormControlLayout--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiFormControlLayout--inGroup {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiFormControlLayout--1icons {\\n  --eui-form-control-layout-icons-padding: 34px;\\n  padding-right: 34px;\\n}\\nhtml.dark-theme .euiFormControlLayout--1icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 26px;\\n  padding-right: 26px;\\n}\\nhtml.dark-theme .euiFormControlLayout--2icons {\\n  --eui-form-control-layout-icons-padding: 56px;\\n  padding-right: 56px;\\n}\\nhtml.dark-theme .euiFormControlLayout--2icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 44px;\\n  padding-right: 44px;\\n}\\nhtml.dark-theme .euiFormControlLayout--3icons {\\n  --eui-form-control-layout-icons-padding: 78px;\\n  padding-right: 78px;\\n}\\nhtml.dark-theme .euiFormControlLayout--3icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 62px;\\n  padding-right: 62px;\\n}\\nhtml.dark-theme .euiFormControlLayout--4icons {\\n  --eui-form-control-layout-icons-padding: 100px;\\n  padding-right: 100px;\\n}\\nhtml.dark-theme .euiFormControlLayout--4icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 80px;\\n  padding-right: 80px;\\n}\\nhtml.dark-theme .euiFormControlLayout--5icons {\\n  --eui-form-control-layout-icons-padding: 122px;\\n  padding-right: 122px;\\n}\\nhtml.dark-theme .euiFormControlLayout--5icons[class*=compressed] {\\n  --eui-form-control-layout-icons-padding: 98px;\\n  padding-right: 98px;\\n}\\nhtml.dark-theme .euiFormControlLayout__childrenWrapper {\\n  position: relative;\\n}\\nhtml.dark-theme .euiFormControlLayout--group {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFormControlLayout--group {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFormControlLayout--group > *,\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiText,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonIcon {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper {\\n  flex-grow: 1;\\n  overflow: hidden;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n  flex-shrink: 0;\\n  height: 100%;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n  background-color: #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon, html.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty {\\n  transform: none !important;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonIcon .euiIcon, html.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend.euiButtonEmpty .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonIcon .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend .euiButtonEmpty .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonIcon .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append.euiButtonEmpty .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonIcon .euiIcon,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append .euiButtonEmpty .euiIcon {\\n  background: none !important;\\n  padding: 0;\\n  width: 16px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonIcon {\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonIcon:not(:focus) {\\n  background-color: #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonIcon:focus-visible {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: -2px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  height: 100%;\\n  background-color: #2c2f37;\\n  padding: 0 8px;\\n  width: 32px;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group > .euiFormControlLayout__prepend,\\nhtml.dark-theme .euiFormControlLayout--group > .euiFormControlLayout__append {\\n  max-width: 50%;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  background-color: #2c2f37;\\n  padding: 12px;\\n  line-height: 16px !important;\\n  cursor: default !important;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper):not(input),\\nhtml.dark-theme .euiFormControlLayout--group .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper):not(input) {\\n  margin-left: -12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiButtonEmpty {\\n  border-right: none;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ .euiButtonEmpty,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper ~ * .euiButtonEmpty {\\n  border-right: none;\\n  border-left: none;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n  overflow: hidden;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) {\\n  padding: 8px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormLabel + *:not(.euiFormControlLayout__childrenWrapper),\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiText:not(.euiFormControlLayoutDelimited__delimiter) + *:not(.euiFormControlLayout__childrenWrapper) {\\n  margin-left: -8px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiFormLabel,\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed > *:not(.euiFormControlLayout__childrenWrapper) + .euiText {\\n  margin-left: -8px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--readOnly {\\n  cursor: default;\\n  background: #2c2f37;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--readOnly input {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  display: flex;\\n  align-items: stretch;\\n  padding: 1px;\\n  /* 1 */\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFormControlLayoutDelimited {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited > .euiFormControlLayout__childrenWrapper {\\n  display: flex;\\n  align-items: center;\\n  width: 100%;\\n  background-color: #16171c;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  border-radius: 3px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--compressed\\\"] {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper, html.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--fullWidth\\\"] .euiFormControlLayout__childrenWrapper > *:not(.euiFormControlLayoutDelimited__delimiter):not(.euiFormControlLayoutIcons) {\\n  width: 100%;\\n  max-width: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled] {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled]::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled]:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled]::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=-isDisabled] .euiFormControlLayout__childrenWrapper {\\n  background-color: #202128;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited[class*=\\\"--readOnly\\\"] .euiFormControlLayout__childrenWrapper {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited--isInvalid .euiFormControlLayout__childrenWrapper {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited__input {\\n  box-shadow: none !important;\\n  border-radius: 0 !important;\\n  text-align: center;\\n  height: 100%;\\n  min-width: 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited__delimiter {\\n  align-self: stretch;\\n  flex-grow: 0;\\n  display: flex;\\n  align-items: center;\\n  line-height: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons {\\n  pointer-events: none;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons > * + * {\\n  margin-left: 6px;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons--absolute {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--absolute {\\n  left: 8px;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons--static {\\n  position: static;\\n  height: 100%;\\n  align-self: stretch;\\n  flex-grow: 0;\\n  padding-inline: 12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--static {\\n  padding-inline: 8px;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons--left {\\n  z-index: 1;\\n}\\nhtml.dark-theme .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 12px;\\n}\\nhtml.dark-theme .euiFormControlLayout--compressed .euiFormControlLayoutIcons--right {\\n  left: auto;\\n  right: 8px;\\n}\\nhtml.dark-theme *:disabled + .euiFormControlLayoutIcons {\\n  cursor: not-allowed;\\n  color: #535966;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 16px;\\n  line-height: 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton .euiFormControlLayoutClearButton__icon {\\n  width: 8px;\\n  height: 8px;\\n  fill: #1D1E24;\\n  stroke: #1D1E24;\\n  stroke-width: 2px;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small {\\n  width: 12px;\\n  height: 12px;\\n  pointer-events: all;\\n  background-color: #98A2B3;\\n  border-radius: 12px;\\n  line-height: 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutClearButton--small .euiFormControlLayoutClearButton__icon {\\n  width: 6px;\\n  height: 6px;\\n  fill: #1D1E24;\\n  stroke: #1D1E24;\\n  stroke-width: 4px;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon {\\n  pointer-events: none;\\n  font-size: 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable {\\n  width: 16px;\\n  height: 16px;\\n  pointer-events: all;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable .euiFormControlLayoutCustomIcon__icon {\\n  vertical-align: baseline;\\n  transform: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable:focus {\\n  outline: 2px solid currentColor;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFormControlLayoutCustomIcon--clickable:disabled {\\n  cursor: not-allowed;\\n  color: #535966;\\n}\\nhtml.dark-theme .euiFormErrorText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #F86B63;\\n}\\nhtml.dark-theme .euiFormLegend {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #DFE5EF;\\n  font-weight: 600;\\n}\\nhtml.dark-theme .euiFormLegend:not(.euiFormLegend-isHidden) {\\n  margin-bottom: 8px;\\n}\\nhtml.dark-theme .euiFormLegend:not(.euiFormLegend-isHidden).euiFormLegend--compressed {\\n  margin-bottom: 4px;\\n}\\nhtml.dark-theme .euiFormHelpText {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding-top: 4px;\\n  color: #98A2B3;\\n}\\nhtml.dark-theme .euiFormLabel {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #DFE5EF;\\n  font-weight: 600;\\n  display: inline-block;\\n  transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.dark-theme .euiFormLabel.euiFormLabel-isInvalid {\\n  color: #F86B63;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiFormLabel.euiFormLabel-isFocused {\\n  color: #36A2EF;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiFormLabel[for] {\\n  cursor: pointer;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiFormLabel[for].euiFormLabel-isDisabled {\\n  cursor: default;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiFormRow {\\n  display: flex;\\n  /* 1 */\\n  flex-direction: column;\\n  /* 1 */\\n  max-width: 400px;\\n}\\nhtml.dark-theme .euiFormRow + .euiFormRow,\\nhtml.dark-theme .euiFormRow + .euiButton {\\n  margin-top: 16px;\\n}\\nhtml.dark-theme .euiFormRow--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiFormRow--hasEmptyLabelSpace {\\n  margin-top: 20px;\\n  /* 2 */\\n  min-height: 40px;\\n  padding-bottom: 0;\\n  justify-content: center;\\n}\\nhtml.dark-theme .euiFormRow__labelWrapper {\\n  display: flex;\\n  flex-wrap: wrap;\\n  justify-content: space-between;\\n  margin-bottom: 4px;\\n}\\nhtml.dark-theme .euiFormRow--horizontal {\\n  flex-direction: row;\\n  align-items: stretch;\\n}\\nhtml.dark-theme .euiFormRow--horizontal .euiFormRow__label {\\n  -webkit-hyphens: auto;\\n  -ms-hyphens: auto;\\n      hyphens: auto;\\n}\\nhtml.dark-theme .euiFormRow--horizontal .euiFormRow__labelWrapper {\\n  display: block;\\n  line-height: 31px;\\n  width: calc(33% - 8px);\\n  margin-right: 8px;\\n  margin-bottom: 0;\\n}\\nhtml.dark-theme .euiFormRow--horizontal .euiFormRow__fieldWrapper {\\n  width: 67%;\\n}\\nhtml.dark-theme .euiFormRow--horizontal + .euiFormRow--horizontal {\\n  margin-top: 8px;\\n}\\nhtml.dark-theme .euiFormRow--horizontal + .euiFormRow--horizontal.euiFormRow--hasSwitch {\\n  margin-top: 12px;\\n}\\nhtml.dark-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__labelWrapper {\\n  line-height: 19px;\\n  width: auto;\\n  min-width: calc(33% - 8px);\\n}\\nhtml.dark-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper {\\n  width: auto;\\n}\\nhtml.dark-theme .euiFormRow--horizontal.euiFormRow--hasSwitch .euiFormRow__fieldWrapper .euiSwitch--compressed {\\n  margin-top: 2px;\\n}\\nhtml.dark-theme .euiFormRow--horizontal.euiFormRow--hasSwitch + .euiFormRow--horizontal {\\n  margin-top: 12px;\\n}\\nhtml.dark-theme .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 40px;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiFormRow--compressed.euiFormRow--hasEmptyLabelSpace {\\n  min-height: 32px;\\n}\\nhtml.dark-theme .euiFormRow--compressed .euiFormRow__fieldWrapperDisplayOnly {\\n  min-height: 32px;\\n}\\nhtml.dark-theme .euiRadio {\\n  position: relative;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input {\\n  width: 16px;\\n  height: 16px;\\n  top: 3px;\\n  cursor: pointer;\\n  position: absolute;\\n  /* 1 */\\n  opacity: 0;\\n  /* 1 */\\n  z-index: 1;\\n  /* 1 */\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input ~ .euiRadio__label {\\n  display: inline-block;\\n  padding-left: 24px;\\n  line-height: 24px;\\n  font-size: 14px;\\n  position: relative;\\n  z-index: 2;\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input + .euiRadio__circle {\\n  padding: 7px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 14px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  display: inline-block;\\n  position: absolute;\\n  left: 0;\\n  top: 3px;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:checked + .euiRadio__circle {\\n  border-color: #36A2EF;\\n  background-color: #36A2EF;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%2829, 30, 36%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input[disabled] {\\n  cursor: not-allowed !important;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input[disabled] ~ .euiRadio__label {\\n  color: #535966;\\n  cursor: not-allowed !important;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input[disabled] + .euiRadio__circle {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:checked[disabled] + .euiRadio__circle {\\n  border-color: #343741;\\n  background-color: #343741;\\n  box-shadow: none;\\n  background-image: url(\\\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 6 6'%3E%3Ccircle cx='8' cy='11' r='3' fill='rgb%28166, 170, 176%29' fill-rule='evenodd' transform='translate(-5 -8)'/%3E%3C/svg%3E\\\");\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiRadio.euiRadio--inList, html.dark-theme .euiRadio.euiRadio--noLabel {\\n  min-height: 16px;\\n  min-width: 16px;\\n}\\nhtml.dark-theme .euiRadio.euiRadio--inList .euiRadio__input,\\nhtml.dark-theme .euiRadio.euiRadio--inList .euiRadio__circle, html.dark-theme .euiRadio.euiRadio--noLabel .euiRadio__input,\\nhtml.dark-theme .euiRadio.euiRadio--noLabel .euiRadio__circle {\\n  top: 0;\\n}\\nhtml.dark-theme .euiRadio.euiRadio--inList .euiRadio__input, html.dark-theme .euiRadio.euiRadio--noLabel .euiRadio__input {\\n  margin: 0;\\n}\\nhtml.dark-theme .euiRadioGroup__item + .euiRadioGroup__item {\\n  margin-top: 4px;\\n}\\nhtml.dark-theme .euiRadioGroup__item + .euiRadioGroup__item.euiRadio--compressed {\\n  margin-top: 0;\\n}\\nhtml.dark-theme .euiSwitch {\\n  position: relative;\\n  display: inline-flex;\\n  align-items: flex-start;\\n  min-height: 20px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__label {\\n  cursor: pointer;\\n  padding-left: 8px;\\n  line-height: 20px;\\n  font-size: 14px;\\n  vertical-align: middle;\\n  display: inline-block;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button {\\n  flex-shrink: 0;\\n  line-height: 0;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__body {\\n  background-color: rgba(152, 162, 179, 0.6);\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 0;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon {\\n  right: -8px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button[aria-checked=false] .euiSwitch__icon.euiSwitch__icon--checked {\\n  right: auto;\\n  left: -34px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled:hover,\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled ~ .euiSwitch__label:hover {\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__body {\\n  background-color: rgba(152, 162, 179, 0.6);\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__thumb {\\n  background-color: rgba(0, 0, 0, 0);\\n  border-color: #98A2B3;\\n  box-shadow: none;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled .euiSwitch__icon {\\n  fill: #98A2B3;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:disabled + .euiSwitch__label {\\n  color: #535966;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__body {\\n  pointer-events: none;\\n  width: 44px;\\n  height: 20px;\\n  background-color: #36A2EF;\\n  display: inline-block;\\n  position: relative;\\n  border-radius: 20px;\\n  vertical-align: middle;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__thumb {\\n  padding: 9px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 18px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  position: absolute;\\n  display: inline-block;\\n  left: 24px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__track {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  overflow: hidden;\\n  border-radius: 20px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__icon {\\n  position: absolute;\\n  right: -34px;\\n  top: 2px;\\n  bottom: 0;\\n  width: 42px;\\n  height: 16px;\\n  transition: left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), right 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n  fill: #1D1E24;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__icon--checked {\\n  right: auto;\\n  left: -8px;\\n  fill: #1D1E24;\\n}\\nhtml.dark-theme .euiSwitch:hover .euiSwitch__button:not(:disabled) .euiSwitch__thumb {\\n  transform: scale(1.05);\\n}\\nhtml.dark-theme .euiSwitch:hover .euiSwitch__button:active .euiSwitch__thumb {\\n  transform: scale(0.95);\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed {\\n  min-height: 16px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__label {\\n  line-height: 16px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__body {\\n  width: 28px;\\n  height: 16px;\\n  border-radius: 16px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__thumb {\\n  padding: 6px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 12px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__track {\\n  border-radius: 16px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini {\\n  min-height: 10px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__label {\\n  line-height: 10px;\\n  font-size: 12px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__body {\\n  width: 22px;\\n  height: 10px;\\n  border-radius: 10px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__thumb {\\n  padding: 3px;\\n  border: 1px solid #69696f;\\n  background: #1D1E24 no-repeat center;\\n  border-radius: 6px;\\n  transition: background-color 150ms ease-in, border-color 150ms ease-in;\\n  left: 13px;\\n  top: 1px;\\n  transition: border-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), background-color 250ms cubic-bezier(0.34, 1.61, 0.7, 1), left 250ms cubic-bezier(0.34, 1.61, 0.7, 1), transform 250ms cubic-bezier(0.34, 1.61, 0.7, 1);\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__track {\\n  border-radius: 10px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb, html.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb {\\n  left: 1px;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb, html.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=false] .euiSwitch__thumb,\\nhtml.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true]:disabled .euiSwitch__thumb {\\n  border-color: #98A2B3;\\n}\\nhtml.dark-theme .euiSwitch.euiSwitch--compressed .euiSwitch__button[aria-checked=true] .euiSwitch__thumb, html.dark-theme .euiSwitch.euiSwitch--mini .euiSwitch__button[aria-checked=true] .euiSwitch__thumb {\\n  border-color: #36A2EF;\\n}\\nhtml.dark-theme .euiTextArea {\\n  max-width: 400px;\\n  width: 100%;\\n  height: 40px;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: 0 0 transparent, inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  border: none;\\n  border-radius: 6px;\\n  padding: 12px;\\n  line-height: 1.5;\\n}\\nhtml.dark-theme .euiTextArea--fullWidth {\\n  max-width: 100%;\\n}\\nhtml.dark-theme .euiTextArea--compressed {\\n  height: 32px;\\n}\\nhtml.dark-theme .euiTextArea--inGroup {\\n  height: 100%;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiTextArea {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiTextArea::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiTextArea:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea:-webkit-autofill {\\n  -webkit-text-fill-color: #343741;\\n}\\nhtml.dark-theme .euiTextArea:-webkit-autofill ~ .euiFormControlLayoutIcons {\\n  color: #343741;\\n}\\nhtml.dark-theme .euiTextArea--compressed {\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n  padding: 8px;\\n  border-radius: 4px;\\n}\\n@supports (-moz-appearance: none) {\\n  html.dark-theme .euiTextArea--compressed {\\n    transition-property: box-shadow, background-image, background-size;\\n  }\\n}\\nhtml.dark-theme .euiTextArea--compressed:invalid {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%);\\n  background-size: 100%;\\n}\\nhtml.dark-theme .euiTextArea--compressed:focus {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n  outline: none;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea--compressed:disabled {\\n  color: #535966;\\n  -webkit-text-fill-color: #535966;\\n  cursor: not-allowed;\\n  background: #202128;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea--compressed:disabled::-moz-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea--compressed:disabled:-ms-input-placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea--compressed:disabled::placeholder {\\n  color: #535966;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiTextArea--compressed[readOnly] {\\n  cursor: default;\\n  color: #DFE5EF;\\n  -webkit-text-fill-color: #DFE5EF;\\n  background: #1D1E24;\\n  border-color: transparent;\\n  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);\\n}\\nhtml.dark-theme .euiTextArea--inGroup {\\n  box-shadow: none !important;\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiTextArea, html.dark-theme .euiTextArea--compressed {\\n  height: auto;\\n}\\nhtml.dark-theme .euiFormControlLayout--euiTextArea {\\n  height: auto;\\n}\\nhtml.dark-theme .euiFormControlLayout--euiTextArea .euiFormControlLayoutIcons {\\n  top: auto;\\n  bottom: 12px;\\n}\\nhtml.dark-theme .euiTextArea--resizeVertical {\\n  resize: vertical;\\n}\\nhtml.dark-theme .euiTextArea--resizeHorizontal {\\n  resize: horizontal;\\n}\\nhtml.dark-theme .euiTextArea--resizeBoth {\\n  resize: both;\\n}\\nhtml.dark-theme .euiTextArea--resizeNone {\\n  resize: none;\\n}\\nhtml.dark-theme .euiMarkdownEditor {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .euiMarkdownEditor--isPreviewing .euiMarkdownEditor__toggleContainer {\\n  display: none;\\n}\\nhtml.dark-theme .euiMarkdownEditor--fullHeight {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiMarkdownEditor--fullHeight .euiMarkdownEditorTextArea {\\n  resize: none;\\n}\\nhtml.dark-theme .euiMarkdownEditor--fullHeight .euiMarkdownEditorDropZone {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone {\\n  display: flex;\\n  position: relative;\\n  flex-direction: column;\\n  min-height: \\\"150px\\\";\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone__input {\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  width: 100%;\\n  height: 100%;\\n  opacity: 0;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone__input:hover {\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone__input:hover:disabled {\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorFooter,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(54, 162, 239, 0.1) !important;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDragging .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%) !important;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorFooter,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditorTextArea:focus,\\nhtml.dark-theme .euiMarkdownEditorDropZone--isDraggingError .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: rgba(248, 107, 99, 0.1) !important;\\n}\\nhtml.dark-theme .euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea,\\nhtml.dark-theme .euiMarkdownEditorDropZone--hasError .euiMarkdownEditorTextArea:focus {\\n  background-image: linear-gradient(to top, #F86B63, #F86B63 2px, transparent 2px, transparent 100%) !important;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__blockquote {\\n  border-left-color: rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiHorizontalRule {\\n  background-color: rgba(255, 255, 255, 0.15);\\n  color: rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table {\\n  border-left: 1px solid rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td {\\n  border-top: 1px solid rgba(255, 255, 255, 0.15);\\n  border-bottom: 1px solid rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-default] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid rgba(255, 255, 255, 0.15);\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__blockquote {\\n  border-left-color: #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiHorizontalRule {\\n  background-color: #7a7f89;\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table {\\n  border-left: 1px solid #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #7a7f89;\\n  border-bottom: 1px solid #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-subdued] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #7a7f89;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__blockquote {\\n  border-left-color: #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiHorizontalRule {\\n  background-color: #7DDED8;\\n  color: #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table {\\n  border-left: 1px solid #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #7DDED8;\\n  border-bottom: 1px solid #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-success] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #7DDED8;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiHorizontalRule {\\n  background-color: #F68FBE;\\n  color: #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F68FBE;\\n  border-bottom: 1px solid #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-accent] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F68FBE;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiHorizontalRule {\\n  background-color: #F3D371;\\n  color: #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F3D371;\\n  border-bottom: 1px solid #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-warning] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F3D371;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__blockquote {\\n  border-left-color: #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiHorizontalRule {\\n  background-color: #F86B63;\\n  color: #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table {\\n  border-left: 1px solid #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #F86B63;\\n  border-bottom: 1px solid #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-danger] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #F86B63;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__blockquote {\\n  border-left-color: #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiHorizontalRule {\\n  background-color: #FFF;\\n  color: #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table {\\n  border-left: 1px solid #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td {\\n  border-top: 1px solid #FFF;\\n  border-bottom: 1px solid #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-ghost] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid #FFF;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-inherit] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__blockquote {\\n  border-left-color: currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiHorizontalRule {\\n  background-color: currentColor;\\n  color: currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table {\\n  border-left: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td {\\n  border-top: 1px solid currentColor;\\n  border-bottom: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table th:last-child,\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table td:last-child {\\n  border-right: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat[class*=euiTextColor-custom] .euiMarkdownFormat__table tr {\\n  border-top: 1px solid currentColor;\\n}\\nhtml.dark-theme .euiMarkdownFormat .euiCheckbox {\\n  margin-bottom: 0 !important;\\n}\\nhtml.dark-theme .euiMarkdownFormat .euiCheckbox .euiCheckbox__input + .euiCheckbox__square {\\n  top: 50%;\\n  transform: translateY(-50%);\\n}\\nhtml.dark-theme .euiMarkdownFormat .euiMarkdownFormat__table {\\n  display: block;\\n  width: 100%;\\n  overflow: auto;\\n  border-spacing: 0;\\n  border-collapse: collapse;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter {\\n  display: inline-flex;\\n  padding: 4px;\\n  border: 1px solid #343741;\\n  align-items: center;\\n  background: #141519;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__popover {\\n  width: 300px;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__actions {\\n  flex: 1;\\n  display: inline-flex;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__actions > button,\\nhtml.dark-theme .euiMarkdownEditorFooter__actions > span {\\n  margin-right: 4px;\\n  align-self: center;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError {\\n  position: relative;\\n  left: -1px;\\n  line-height: 1;\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__actions .euiMarkdownEditorFooter__uploadError > span {\\n  padding: 0 4px;\\n}\\nhtml.dark-theme .euiMarkdownEditorFooter__helpButton > svg {\\n  width: 26px;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background: #1D1E24;\\n  min-height: \\\"150px\\\";\\n  overflow-y: auto;\\n  border: 1px solid #343741;\\n  padding: 12px;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview::-webkit-scrollbar-corner, html.dark-theme .euiMarkdownEditorPreview::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input ~ .euiCheckbox__label {\\n  cursor: default;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview-isReadOnly .euiCheckbox__input:focus:not(:checked) + .euiCheckbox__square {\\n  border-color: #69696f;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  width: 100%;\\n  height: 100%;\\n  min-height: \\\"150px\\\";\\n  padding: 12px;\\n  border: 1px solid #343741;\\n  border-bottom: none;\\n  line-height: 1.5;\\n  resize: vertical;\\n  background-color: #16171c;\\n  background-repeat: no-repeat;\\n  background-size: 0% 100%;\\n  margin: 0;\\n  transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::-moz-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea:-ms-input-placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::placeholder {\\n  color: #81858f;\\n  opacity: 1;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-corner, html.dark-theme .euiMarkdownEditorTextArea::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea:focus, html.dark-theme .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea {\\n  background-color: #111216;\\n  background-image: linear-gradient(to top, #36A2EF, #36A2EF 2px, transparent 2px, transparent 100%);\\n  background-size: 100% 100%;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea-isReadOnly {\\n  background: #1D1E24;\\n  cursor: unset;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea-isReadOnly:focus, html.dark-theme .euiMarkdownEditor:focus-within .euiMarkdownEditorTextArea-isReadOnly {\\n  background: none;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar {\\n  display: flex;\\n  flex-wrap: wrap;\\n  background: #25262E;\\n  border: 1px solid #343741;\\n  border-color: #343741;\\n  border-bottom: none;\\n  padding: 4px;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar__buttons {\\n  display: flex;\\n  flex-wrap: wrap;\\n  flex: 1;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar__buttons > * {\\n  margin-right: 4px;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar__divider {\\n  content: \\\"\\\";\\n  height: 24px;\\n  display: block;\\n  margin-left: 4px;\\n  padding-right: 4px;\\n  border-left: 1px solid #343741;\\n}\\nhtml.dark-theme .euiMarkdownTooltip__icon {\\n  transform: translateY(-1px);\\n}\\nhtml.dark-theme .euiSelectable {\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .euiSelectable-fullHeight {\\n  height: 100%;\\n}\\nhtml.dark-theme .euiSelectableList:has(:focus-visible) {\\n  outline: 2px solid currentColor;\\n  outline-style: auto;\\n  outline-offset: 1px;\\n}\\nhtml.dark-theme .euiSelectableList-fullHeight {\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .euiSelectableList-bordered {\\n  overflow: hidden;\\n  border: 1px solid #343741;\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .euiSelectableList__list {\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n}\\nhtml.dark-theme .euiSelectableList__list::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .euiSelectableList__list::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .euiSelectableList__list::-webkit-scrollbar-corner, html.dark-theme .euiSelectableList__list::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .euiSelectableList__list:focus, html.dark-theme .euiSelectableList__list > ul:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSelectableList__groupLabel {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #DFE5EF;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 700;\\n  display: flex;\\n  align-items: center;\\n  border-bottom: 1px solid #202128;\\n  padding: 4px 12px;\\n}\\nhtml.dark-theme .euiSelectableListItem {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  display: inline-flex;\\n  width: 100%;\\n  text-align: left;\\n  cursor: pointer;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiSelectableListItem:not(:last-of-type) {\\n  border-bottom: 1px solid #202128;\\n}\\nhtml.dark-theme .euiSelectableListItem-isFocused:not([aria-disabled=true]), html.dark-theme .euiSelectableListItem:hover:not([aria-disabled=true]) {\\n  color: #36A2EF;\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiSelectableListItem-isFocused:not([aria-disabled=true]) .euiSelectableListItem__text, html.dark-theme .euiSelectableListItem:hover:not([aria-disabled=true]) .euiSelectableListItem__text {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiSelectableListItem[aria-disabled=true] {\\n  color: #535966;\\n  cursor: not-allowed;\\n}\\nhtml.dark-theme .euiSelectableListItem--paddingSmall .euiSelectableListItem__content {\\n  padding: 4px 12px;\\n}\\nhtml.dark-theme .euiSelectableListItem__content {\\n  width: 100%;\\n  display: flex;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiSelectableListItem__icon,\\nhtml.dark-theme .euiSelectableListItem__prepend {\\n  margin-right: 12px;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .euiSelectableListItem__append {\\n  margin-left: 12px;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .euiSelectableListItem__text {\\n  flex-grow: 1;\\n}\\nhtml.dark-theme .euiSelectableListItem__text--truncate {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .euiSelectableMessage {\\n  padding: 8px;\\n  text-align: center;\\n  word-wrap: break-word;\\n  /* 1 */\\n  display: flex;\\n  flex-direction: column;\\n  justify-content: center;\\n  align-items: center;\\n}\\nhtml.dark-theme .euiSelectableMessage--bordered {\\n  overflow: hidden;\\n  border: 1px solid #343741;\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__listItem .euiSelectableListItem__text {\\n  text-decoration: none !important;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__listItem[class*=-isFocused]:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle, html.dark-theme .euiSelectableTemplateSitewide__listItem:hover:not([aria-disabled=true]) .euiSelectableTemplateSitewide__listItemTitle {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMetasList {\\n  display: block;\\n  margin-top: 4px;\\n  font-size: 12px;\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta:not(:last-of-type)::after {\\n  content: \\\"•\\\";\\n  margin: 0 4px;\\n  color: #7a7f89;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--application {\\n  color: #7ea6cc;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--deployment {\\n  color: #54B399;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--article {\\n  color: #ae96cb;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--case {\\n  color: #eb836e;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiSelectableTemplateSitewide__optionMeta--platform {\\n  color: #D6BF57;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiTable {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-feature-settings: \\\"calt\\\" 1, \\\"kern\\\" 1, \\\"liga\\\" 1, \\\"tnum\\\" 1;\\n  width: 100%;\\n  table-layout: fixed;\\n  border: none;\\n  border-collapse: collapse;\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiTable.euiTable--auto {\\n  table-layout: auto;\\n}\\nhtml.dark-theme .euiTableCaption {\\n  position: relative;\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  html.dark-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  html.dark-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  html.dark-theme .euiTable--compressed .euiTableCellContent {\\n    font-size: 12px;\\n    font-size: 0.8571428571rem;\\n    line-height: 1.1428571429rem;\\n    padding: 4px;\\n  }\\n}\\nhtml.dark-theme .euiTableFooterCell,\\nhtml.dark-theme .euiTableHeaderCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  font-weight: inherit;\\n  text-align: left;\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  color: #DFE5EF;\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  font-weight: 700;\\n  font-weight: 500;\\n  border: none;\\n}\\nhtml.dark-theme .euiTableFooterCell .euiTableHeaderButton,\\nhtml.dark-theme .euiTableHeaderCell .euiTableHeaderButton {\\n  text-align: left;\\n  font-weight: 500;\\n}\\nhtml.dark-theme .euiTableFooterCell .euiTableCellContent__text,\\nhtml.dark-theme .euiTableHeaderCell .euiTableCellContent__text {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  font-weight: 600;\\n}\\nhtml.dark-theme .euiTableHeaderButton {\\n  font-size: 14px;\\n  font-size: 1rem;\\n  line-height: 1.7142857143rem;\\n  color: inherit;\\n  width: 100%;\\n}\\nhtml.dark-theme .euiTableHeaderButton:hover .euiTableCellContent__text, html.dark-theme .euiTableHeaderButton:focus .euiTableCellContent__text {\\n  text-decoration: underline;\\n  color: #36A2EF;\\n}\\nhtml.dark-theme .euiTableHeaderButton:hover .euiTableSortIcon, html.dark-theme .euiTableHeaderButton:focus .euiTableSortIcon {\\n  fill: #36A2EF;\\n}\\nhtml.dark-theme .euiTableSortIcon {\\n  margin-left: 4px;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .euiTableHeaderButton-isSorted .euiTableSortIcon {\\n  fill: #DFE5EF;\\n}\\nhtml.dark-theme .euiTableHeaderCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n  border: none;\\n}\\nhtml.dark-theme .euiTableRow:hover {\\n  background-color: #1e1e25;\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isClickable:hover {\\n  background-color: rgba(54, 162, 239, 0.05);\\n  cursor: pointer;\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isClickable:focus {\\n  background-color: rgba(54, 162, 239, 0.1);\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isExpandedRow {\\n  background-color: #1e1e25;\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isExpandedRow.euiTableRow-isSelectable .euiTableCellContent {\\n  padding-left: 40px;\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isSelected {\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .euiTableRow.euiTableRow-isSelected:hover, html.dark-theme .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n  background-color: rgba(27, 81, 120, 0.28);\\n}\\nhtml.dark-theme .euiTableRowCell {\\n  vertical-align: middle;\\n  border-top: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  font-weight: inherit;\\n  text-align: left;\\n  color: #DFE5EF;\\n}\\nhtml.dark-theme .euiTableRowCell--top {\\n  vertical-align: top;\\n}\\nhtml.dark-theme .euiTableRowCell--bottom {\\n  vertical-align: bottom;\\n}\\nhtml.dark-theme .euiTableRowCell--baseline {\\n  vertical-align: baseline;\\n}\\nhtml.dark-theme .euiTableRowCell.euiTableRowCell--isMobileHeader {\\n  display: none;\\n}\\nhtml.dark-theme .euiTableRowCellCheckbox {\\n  vertical-align: middle;\\n  border-top: 1px solid #343741;\\n  border-bottom: 1px solid #343741;\\n  font-weight: inherit;\\n  text-align: left;\\n  width: 32px;\\n  vertical-align: middle;\\n}\\nhtml.dark-theme .euiTableFooterCell {\\n  background-color: #25262E;\\n}\\nhtml.dark-theme .euiTableCellContent {\\n  overflow: hidden;\\n  /* 4 */\\n  display: flex;\\n  align-items: center;\\n  /* 1 */\\n  padding: 8px;\\n  /* 2 */\\n}\\nhtml.dark-theme .euiTableCellContent__text {\\n  overflow-wrap: break-word !important;\\n  word-break: break-word;\\n  /* 4 */\\n  min-width: 0;\\n  text-overflow: ellipsis;\\n}\\nhtml.dark-theme .euiTableCellContent--alignRight {\\n  justify-content: flex-end;\\n  text-align: right;\\n}\\nhtml.dark-theme .euiTableCellContent--alignCenter {\\n  justify-content: center;\\n  text-align: center;\\n}\\nhtml.dark-theme .euiTableHeaderCell,\\nhtml.dark-theme .euiTableFooterCell,\\nhtml.dark-theme .euiTableCellContent--truncateText {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .euiTableHeaderCell .euiTableCellContent__text,\\nhtml.dark-theme .euiTableFooterCell .euiTableCellContent__text,\\nhtml.dark-theme .euiTableCellContent--truncateText .euiTableCellContent__text {\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiTableCellContent--overflowingContent {\\n  overflow: visible;\\n  white-space: normal;\\n  word-break: break-word;\\n}\\nhtml.dark-theme .euiTableCellContent--showOnHover > *:not(:first-child) {\\n  margin-left: 8px;\\n}\\nhtml.dark-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n  flex-shrink: 0;\\n  opacity: 0.7;\\n  filter: grayscale(100%);\\n  transition: opacity 250ms cubic-bezier(0.694, 0.0482, 0.335, 1), filter 250ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n}\\nhtml.dark-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n  filter: grayscale(0%);\\n  opacity: 0;\\n}\\nhtml.dark-theme .euiTableRow-hasActions:hover .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem,\\nhtml.dark-theme .euiTableRow-hasActions .euiTableCellContent--showOnHover:focus-within .euiTableCellContent__hoverItem {\\n  opacity: 1;\\n  filter: grayscale(0%);\\n}\\nhtml.dark-theme .euiTableRow-isExpandedRow .euiTableCellContent {\\n  -webkit-animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n  animation: 150ms cubic-bezier(0.694, 0.0482, 0.335, 1) 1 normal none growExpandedRow;\\n}\\n@-webkit-keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\n@keyframes growExpandedRow {\\n  0% {\\n    opacity: 0;\\n    transform: translateY(-12px);\\n  }\\n  100% {\\n    opacity: 1;\\n    transform: translateY(0);\\n  }\\n}\\nhtml.dark-theme .euiTableRowCell__mobileHeader {\\n  display: none;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiTableRowCell--hideForMobile {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 768px) and (max-width: 991px) {\\n  html.dark-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 992px) and (max-width: 1199px) {\\n  html.dark-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (min-width: 1200px) {\\n  html.dark-theme .euiTableRowCell--hideForDesktop {\\n    display: none !important;\\n  }\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #98A2B3;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n  html.dark-theme .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.2), 0 2.6px 8px -1px rgba(0, 0, 0, 0.15), 0 5.7px 12px -1px rgba(0, 0, 0, 0.125), 0 15px 15px -1px rgba(0, 0, 0, 0.1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #343741;\\n    box-shadow: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #141519;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #4a2b39;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #103148;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #264341;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #493f22;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #4a201e;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n    background-color: #1D1E24;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(83, 89, 102, 0.1) 0, rgba(83, 89, 102, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(83, 89, 102, 0.1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\nhtml.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(54, 162, 239, 0.2);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(83, 89, 102, 0.1) 0, rgba(83, 89, 102, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiTable.euiTable--responsive thead {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive tfoot {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    max-width: 100%;\\n    overflow: hidden !important;\\n    text-overflow: ellipsis !important;\\n    white-space: nowrap !important;\\n    font-size: 9.625px;\\n    font-size: 0.6875rem;\\n    display: block;\\n    color: #98A2B3;\\n    padding: 8px;\\n    padding-bottom: 0;\\n    margin-bottom: -8px;\\n    min-height: 24px;\\n  }\\n  html.dark-theme .euiTableRowCell:only-child .euiTable.euiTable--responsive .euiTableRowCell__mobileHeader {\\n    min-height: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell--enlargeForMobile {\\n    font-size: 16px;\\n    font-size: 1.1428571429rem;\\n    line-height: 1.7142857143rem;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow {\\n    flex-grow: 1;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--flexGrowZero {\\n    flex-grow: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasShadow {\\n    box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.2), 0 2.6px 8px -1px rgba(0, 0, 0, 0.15), 0 5.7px 12px -1px rgba(0, 0, 0, 0.125), 0 15px 15px -1px rgba(0, 0, 0, 0.1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--hasBorder {\\n    border: 1px solid #343741;\\n    box-shadow: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable {\\n    transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:enabled {\\n    display: block;\\n    width: 100%;\\n    text-align: left;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:hover, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--isClickable:focus {\\n    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n    transform: translateY(-2px);\\n    cursor: pointer;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusNone {\\n    border-radius: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--borderRadiusMedium {\\n    border-radius: 6px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--transparent {\\n    background-color: transparent;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--plain {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--subdued {\\n    background-color: #141519;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--accent {\\n    background-color: #4a2b39;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--primary {\\n    background-color: #103148;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--success {\\n    background-color: #264341;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--warning {\\n    background-color: #493f22;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow--danger {\\n    background-color: #4a201e;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow {\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n    background-color: #1D1E24;\\n    border-radius: 6px;\\n    display: flex;\\n    flex-wrap: wrap;\\n    padding: 8px;\\n    margin-bottom: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:hover {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions {\\n    background-image: linear-gradient(to right, rgba(83, 89, 102, 0.1) 0, rgba(83, 89, 102, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    padding-right: 40px;\\n    position: relative;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions {\\n    min-width: 0;\\n    width: 24px;\\n    position: absolute;\\n    top: 16px;\\n    right: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander::before, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions::before {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent {\\n    flex-direction: column;\\n    padding: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandable .euiTableRowCell--isExpander .euiTableCellContent .euiLink, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions .euiTableRowCell--hasActions .euiTableCellContent .euiLink {\\n    padding: 4px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child {\\n    width: 100%;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child::before {\\n    content: \\\"\\\";\\n    position: absolute;\\n    left: 0;\\n    right: 0;\\n    height: 1px;\\n    background-color: rgba(83, 89, 102, 0.1);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow:not(.euiTableRow-hasActions) .euiTableRowCell--hasActions:last-child .euiTableCellContent {\\n    position: relative;\\n    top: 4px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-hasActions.euiTableRow-isExpandable .euiTableRowCell--isExpander {\\n    top: auto;\\n    bottom: 16px;\\n    right: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable {\\n    padding-left: 36px;\\n    position: relative;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelectable .euiTableRowCellCheckbox {\\n    position: absolute;\\n    left: 4px;\\n    top: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover,\\nhtml.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected + .euiTableRow.euiTableRow-isExpandedRow, html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isSelected:hover + .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    background-color: rgba(54, 162, 239, 0.2);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow {\\n    background-image: linear-gradient(to right, rgba(83, 89, 102, 0.1) 0, rgba(83, 89, 102, 0.1) 1px, transparent 1px, transparent 100%);\\n    background-size: 40px 100%;\\n    background-position-x: right;\\n    background-repeat: no-repeat;\\n    box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n    margin-top: -16px;\\n    position: relative;\\n    z-index: 2;\\n    border-top: none;\\n    border-top-left-radius: 0;\\n    border-top-right-radius: 0;\\n    padding-left: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow:hover {\\n    background-color: #1D1E24;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell {\\n    width: calc(100% - 40px);\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow.euiTableRow-isExpandedRow .euiTableRowCell::before {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCell {\\n    min-width: 50%;\\n    border: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRowCellCheckbox {\\n    border: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover > * {\\n    margin-left: 0;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .expandedItemActions__completelyHide {\\n    display: none;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableRow-hasActions .euiTableCellContent--showOnHover .euiTableCellContent__hoverItem {\\n    opacity: 1;\\n    filter: none;\\n    margin-left: 0;\\n    margin-bottom: 8px;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableCellContent--alignRight {\\n    justify-content: flex-start;\\n  }\\n  html.dark-theme .euiTable.euiTable--responsive .euiTableCellContent--alignCenter {\\n    justify-content: flex-start;\\n  }\\n}\\nhtml.dark-theme .euiTableHeaderMobile,\\nhtml.dark-theme .euiTableHeaderCell--hideForDesktop {\\n  display: none;\\n}\\n@media only screen and (max-width: 574px) {\\n  html.dark-theme .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n  html.dark-theme .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\n@media only screen and (min-width: 575px) and (max-width: 767px) {\\n  html.dark-theme .euiTableHeaderMobile {\\n    display: flex;\\n    justify-content: flex-end;\\n    padding: 8px 0;\\n  }\\n  html.dark-theme .euiTableSortMobile {\\n    display: block;\\n  }\\n}\\nhtml.dark-theme .euiComboBox--appended .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 6px;\\n  border-bottom-left-radius: 6px;\\n}\\nhtml.dark-theme .euiComboBox--appended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-left-radius: 4px;\\n  border-bottom-left-radius: 4px;\\n}\\nhtml.dark-theme .euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiComboBox--appended.euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiComboBox--prepended .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 6px;\\n  border-bottom-right-radius: 6px;\\n}\\nhtml.dark-theme .euiComboBox--prepended .euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper {\\n  border-top-right-radius: 4px;\\n  border-bottom-right-radius: 4px;\\n}\\nhtml.dark-theme .euiDataGrid--fontSizeLarge .euiDataGridRowCell {\\n  font-size: 16px;\\n  font-size: 1.1428571429rem;\\n  line-height: 1.7142857143rem;\\n}\\nhtml.dark-theme .euiFormControlLayout--group {\\n  border-radius: 6px;\\n  background-color: #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend:first-child {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append:last-child {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group [class*=euiButton]:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: -2px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group [class*=euiButton]:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiFormControlLayout--group [class*=euiButton]:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 5px 0 0 5px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor:last-child [class*=euiButton],\\nhtml.dark-theme .euiFormControlLayout--group .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 5px 5px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child .euiSuperSelectControl,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 6px 0 0 6px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child .euiSuperSelectControl,\\nhtml.dark-theme .euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed {\\n  border-radius: 4px;\\n  background-color: #2c2f37;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed.euiFormControlLayout--readOnly input {\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__prepend:first-child [class*=euiButton] {\\n  border-radius: 4px 0 0 4px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__append:last-child [class*=euiButton] {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor > .euiIcon {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:first-child [class*=euiButton] {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child [class*=euiButton],\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiToolTipAnchor:last-child .euiText {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(2) [class*=euiField],\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:nth-child(3) [class*=euiField] {\\n  border-radius: 0;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child .euiSelect,\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:first-child [class*=euiField] {\\n  border-radius: 3px 0 0 3px;\\n}\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child .euiSelect,\\nhtml.dark-theme .euiFormControlLayout--group.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:last-child [class*=euiField] {\\n  border-radius: 0 3px 3px 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited {\\n  border-radius: 6px;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 6px 0 0 6px;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 6px;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 6px 6px 0;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed.euiFormControlLayout--group .euiFormControlLayout__childrenWrapper:first-child {\\n  border-radius: 4px 0 0 4px;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__childrenWrapper:only-child {\\n  border-radius: 4px;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .euiFormControlLayoutDelimited.euiFormControlLayout--compressed .euiFormControlLayout__prepend + .euiFormControlLayout__childrenWrapper:last-child {\\n  border-radius: 0 4px 4px 0;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus + .euiRadio__circle {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus:focus-visible + .euiRadio__circle {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiRadio .euiRadio__input:focus:not(:focus-visible) + .euiRadio__circle {\\n  outline: none;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus + .euiCheckbox__square {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus:focus-visible + .euiCheckbox__square {\\n  outline: 2px solid #36A2EF;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiCheckbox .euiCheckbox__input:focus:not(:focus-visible) + .euiCheckbox__square {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 2px;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .euiSwitch .euiSwitch__button:focus .euiSwitch__track {\\n  outline: none;\\n}\\nhtml.dark-theme .euiHue {\\n  position: relative;\\n  height: 12px;\\n  border-radius: 12px;\\n  margin: 8px 0;\\n}\\nhtml.dark-theme .euiHue::before, html.dark-theme .euiHue::after {\\n  display: none;\\n}\\nhtml.dark-theme .euiHue__range {\\n  top: -6px;\\n}\\nhtml.dark-theme .euiHue__range::-webkit-slider-thumb {\\n  border: 3px solid #1D1E24;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.dark-theme .euiHue__range::-moz-range-thumb {\\n  border: 3px solid #1D1E24;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.dark-theme .euiHue__range::-ms-thumb {\\n  border: 3px solid #1D1E24;\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n  background-color: inherit;\\n}\\nhtml.dark-theme .euiHue__range:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiHue__range:focus::-webkit-slider-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border: 3px solid #1D1E24;\\n}\\nhtml.dark-theme .euiHue__range:focus::-moz-range-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border: 3px solid #1D1E24;\\n}\\nhtml.dark-theme .euiHue__range:focus::-ms-thumb {\\n  box-shadow: 0 0 0 2px #36A2EF;\\n  border: 3px solid #1D1E24;\\n}\\nhtml.dark-theme .euiHue__range:focus:not(:focus-visible)::-webkit-slider-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.dark-theme .euiHue__range:focus:not(:focus-visible)::-moz-range-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.dark-theme .euiHue__range:focus:not(:focus-visible)::-ms-thumb {\\n  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.2), 0 1px 5px -2px rgba(0, 0, 0, 0.2);\\n}\\nhtml.dark-theme .euiHue__range:focus:focus-visible {\\n  outline: none;\\n}\\nhtml.dark-theme .euiMarkdownEditorToolbar {\\n  border-radius: 6px 6px 0 0;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea:focus {\\n  outline: none;\\n}\\nhtml.dark-theme .euiMarkdownEditorTextArea:focus:focus-visible {\\n  outline-style: none;\\n}\\nhtml.dark-theme .euiMarkdownEditorPreview,\\nhtml.dark-theme .euiMarkdownEditorFooter {\\n  border-radius: 0 0 6px 6px;\\n}\\nhtml.dark-theme *, html.dark-theme *::before, html.dark-theme *::after {\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme html, html.dark-theme body, html.dark-theme div, html.dark-theme span, html.dark-theme applet, html.dark-theme object, html.dark-theme iframe,\\nhtml.dark-theme h1, html.dark-theme h2, html.dark-theme h3, html.dark-theme h4, html.dark-theme h5, html.dark-theme h6, html.dark-theme p, html.dark-theme blockquote, html.dark-theme pre,\\nhtml.dark-theme a, html.dark-theme abbr, html.dark-theme acronym, html.dark-theme address, html.dark-theme big, html.dark-theme cite, html.dark-theme code,\\nhtml.dark-theme del, html.dark-theme dfn, html.dark-theme em, html.dark-theme img, html.dark-theme ins, html.dark-theme kbd, html.dark-theme q, html.dark-theme s, html.dark-theme samp,\\nhtml.dark-theme small, html.dark-theme strike, html.dark-theme strong, html.dark-theme sub, html.dark-theme sup, html.dark-theme tt, html.dark-theme var,\\nhtml.dark-theme b, html.dark-theme u, html.dark-theme i, html.dark-theme center,\\nhtml.dark-theme dl, html.dark-theme dt, html.dark-theme dd, html.dark-theme ol, html.dark-theme ul, html.dark-theme li,\\nhtml.dark-theme fieldset, html.dark-theme form, html.dark-theme label, html.dark-theme legend,\\nhtml.dark-theme table, html.dark-theme caption, html.dark-theme tbody, html.dark-theme tfoot, html.dark-theme thead, html.dark-theme tr, html.dark-theme th, html.dark-theme td,\\nhtml.dark-theme article, html.dark-theme aside, html.dark-theme canvas, html.dark-theme details, html.dark-theme embed,\\nhtml.dark-theme figure, html.dark-theme figcaption, html.dark-theme footer, html.dark-theme header, html.dark-theme hgroup,\\nhtml.dark-theme menu, html.dark-theme nav, html.dark-theme output, html.dark-theme ruby, html.dark-theme section, html.dark-theme summary,\\nhtml.dark-theme time, html.dark-theme mark, html.dark-theme audio, html.dark-theme video {\\n  margin: 0;\\n  padding: 0;\\n  border: none;\\n  vertical-align: baseline;\\n}\\nhtml.dark-theme code, html.dark-theme pre, html.dark-theme kbd, html.dark-theme samp {\\n  font-family: \\\"Roboto Mono\\\", Menlo, Courier, monospace;\\n}\\nhtml.dark-theme h1, html.dark-theme h2, html.dark-theme h3, html.dark-theme h4, html.dark-theme h5, html.dark-theme h6, html.dark-theme p {\\n  font-family: inherit;\\n  font-weight: inherit;\\n  font-size: inherit;\\n}\\nhtml.dark-theme input, html.dark-theme textarea, html.dark-theme select, html.dark-theme button {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n}\\nhtml.dark-theme em {\\n  font-style: italic;\\n}\\nhtml.dark-theme strong {\\n  font-weight: 700;\\n}\\nhtml.dark-theme article, html.dark-theme aside, html.dark-theme details, html.dark-theme figcaption, html.dark-theme figure,\\nhtml.dark-theme footer, html.dark-theme header, html.dark-theme hgroup, html.dark-theme menu, html.dark-theme nav, html.dark-theme section {\\n  display: block;\\n}\\nhtml.dark-theme html {\\n  font-family: \\\"Inter\\\", BlinkMacSystemFont, Helvetica, Arial, sans-serif;\\n  font-weight: 400;\\n  letter-spacing: normal;\\n  -webkit-text-size-adjust: 100%;\\n  -ms-text-size-adjust: 100%;\\n  font-kerning: normal;\\n  font-size: 14px;\\n  color: #DFE5EF;\\n  height: 100%;\\n  background-color: #141519;\\n}\\nhtml.dark-theme body {\\n  line-height: 1;\\n}\\nhtml.dark-theme *:focus {\\n  outline: none;\\n}\\nhtml.dark-theme *:focus::-moz-focus-inner {\\n  border: none;\\n}\\nhtml.dark-theme *:focus:-moz-focusring {\\n  outline: none;\\n}\\nhtml.dark-theme a {\\n  text-decoration: none;\\n  color: #36A2EF;\\n}\\nhtml.dark-theme a:hover {\\n  text-decoration: none;\\n}\\nhtml.dark-theme a:focus {\\n  text-decoration: none;\\n  outline: none;\\n}\\nhtml.dark-theme a:hover, html.dark-theme button, html.dark-theme [role=button] {\\n  cursor: pointer;\\n}\\nhtml.dark-theme input {\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.dark-theme input:disabled {\\n  opacity: 1;\\n  /* required on iOS */\\n}\\nhtml.dark-theme button {\\n  background: none;\\n  border: none;\\n  padding: 0;\\n  margin: 0;\\n  outline: none;\\n  font-size: inherit;\\n  color: inherit;\\n  border-radius: 0;\\n}\\nhtml.dark-theme button:hover {\\n  cursor: pointer;\\n}\\nhtml.dark-theme ol, html.dark-theme ul {\\n  list-style: none;\\n}\\nhtml.dark-theme blockquote, html.dark-theme q {\\n  quotes: none;\\n}\\nhtml.dark-theme blockquote::before, html.dark-theme blockquote::after,\\nhtml.dark-theme q::before, html.dark-theme q::after {\\n  content: \\\"\\\";\\n  content: none;\\n}\\nhtml.dark-theme table {\\n  border-collapse: collapse;\\n  border-spacing: 0;\\n}\\nhtml.dark-theme hr {\\n  margin: 0;\\n}\\nhtml.dark-theme fieldset {\\n  min-inline-size: auto;\\n}\\nhtml.dark-theme svg text {\\n  letter-spacing: normal !important;\\n}\\nhtml.dark-theme html {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) #242529;\\n}\\nhtml.dark-theme html::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme html::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 4px solid #242529;\\n}\\nhtml.dark-theme html::-webkit-scrollbar-corner, html.dark-theme html::-webkit-scrollbar-track {\\n  background-color: #242529;\\n}\\nhtml.dark-theme svg text {\\n  letter-spacing: normal !important;\\n}\\nhtml.dark-theme html,\\nhtml.dark-theme body {\\n  font-family: Inter, BlinkMacSystemFont, Helvetica, Arial, sans-serif !important;\\n}\\nhtml.dark-theme .echChartStatus {\\n  visibility: hidden;\\n  pointer-events: none;\\n  z-index: -100000;\\n  width: 0;\\n  height: 0;\\n  position: absolute;\\n}\\nhtml.dark-theme .echChartBackground {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n}\\nhtml.dark-theme .echChart {\\n  height: 100%;\\n  width: 100%;\\n  overflow: hidden;\\n  display: flex;\\n  flex-direction: column;\\n}\\nhtml.dark-theme .echChart__titles {\\n  margin-right: 24px;\\n}\\nhtml.dark-theme .echChartContent {\\n  position: relative;\\n  display: flex;\\n  flex-direction: row;\\n  flex-grow: 1;\\n  height: 1px;\\n  width: 100%;\\n}\\nhtml.dark-theme .echChartContent--column {\\n  flex-direction: column;\\n}\\nhtml.dark-theme .echChartTitle {\\n  font-style: normal;\\n  font-weight: bold;\\n  font-size: 16px;\\n  line-height: 19px;\\n  padding: 8px;\\n  white-space: nowrap;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .echChartTitle + .echChartDescription {\\n  padding-top: 0;\\n}\\nhtml.dark-theme .echChartDescription {\\n  padding: 8px;\\n  font-style: normal;\\n  font-weight: normal;\\n  font-size: 14px;\\n  line-height: 17px;\\n  white-space: nowrap;\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  flex-shrink: 0;\\n}\\nhtml.dark-theme .echContainer {\\n  flex: 1;\\n  position: relative;\\n  overflow: hidden;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.dark-theme .echChartPointerContainer {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  right: 0;\\n  left: 0;\\n  box-sizing: border-box;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n}\\nhtml.dark-theme .echChartResizer {\\n  z-index: -10000000;\\n  position: absolute;\\n  bottom: 0;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  box-sizing: border-box;\\n}\\nhtml.dark-theme .echBrushTool {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  margin: 0;\\n  padding: 0;\\n  box-sizing: border-box;\\n  overflow: hidden;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echTooltip {\\n  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);\\n  border-radius: 6px;\\n  background-color: black;\\n  color: #FFF;\\n  z-index: 9000;\\n  max-width: 256px;\\n  overflow-wrap: break-word;\\n  padding: 8px;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  padding: 0;\\n  max-width: 100%;\\n  pointer-events: none;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  background-color: #1D1E24;\\n  color: #DFE5EF;\\n  overflow: hidden;\\n  cursor: default;\\n  transition: box-shadow 400ms, opacity 250ms;\\n  border: 1px solid #1D1E24;\\n}\\nhtml.dark-theme .echTooltip .euiHorizontalRule {\\n  background-color: #333333;\\n}\\nhtml.dark-theme .echTooltip__outerWrapper {\\n  display: flex;\\n}\\nhtml.dark-theme .echTooltip--pinned {\\n  box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.175), 0 1.9px 4px rgba(0, 0, 0, 0.125), 0 4.5px 10px rgba(0, 0, 0, 0.125);\\n  pointer-events: auto;\\n  -webkit-user-select: auto;\\n     -moz-user-select: auto;\\n      -ms-user-select: auto;\\n          user-select: auto;\\n}\\nhtml.dark-theme .echTooltip--pinned .echTooltip__tableRow--selectable {\\n  cursor: pointer;\\n}\\nhtml.dark-theme .echTooltip--pinned .echTooltipActions {\\n  pointer-events: auto;\\n}\\nhtml.dark-theme .echTooltip--pinned .echTooltip__tableWrapper {\\n  pointer-events: auto;\\n}\\nhtml.dark-theme .echTooltip .echTooltip__tableCell--truncate {\\n  text-overflow: ellipsis;\\n  display: -webkit-box;\\n  -webkit-line-clamp: 2;\\n  /* number of lines to show */\\n  line-clamp: 2;\\n  -webkit-box-orient: vertical;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .echTooltip__metricRow {\\n  padding: 4px 8px;\\n  display: flex;\\n  justify-content: space-between;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper {\\n  overflow: hidden;\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  background-color: #1D1E24;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper::-webkit-scrollbar-corner, html.dark-theme .echTooltip__tableWrapper::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .echTooltip__tableWrapper--pinned {\\n  overflow: auto;\\n}\\nhtml.dark-theme .echTooltip__table {\\n  display: grid;\\n  width: 100%;\\n}\\nhtml.dark-theme .echTooltip__table--noGrid {\\n  display: table;\\n}\\nhtml.dark-theme .echTooltip__tableHeader .echTooltip__tableCell, html.dark-theme .echTooltip__tableFooter .echTooltip__tableCell {\\n  cursor: default;\\n  font-weight: 600;\\n  background-color: #1D1E24;\\n  position: sticky;\\n  z-index: 1;\\n}\\nhtml.dark-theme .echTooltip__tableHeader, html.dark-theme .echTooltip__tableBody, html.dark-theme .echTooltip__tableFooter, html.dark-theme .echTooltip__tableRow {\\n  display: contents;\\n}\\nhtml.dark-theme .echTooltip__tableHeader {\\n  margin-bottom: 0;\\n  top: 0;\\n}\\nhtml.dark-theme .echTooltip__tableHeader .echTooltip__tableCell {\\n  border-bottom: solid 1px #343741;\\n  top: 0;\\n}\\nhtml.dark-theme .echTooltip__tableFooter {\\n  margin-top: 0;\\n  bottom: 0;\\n}\\nhtml.dark-theme .echTooltip__tableFooter .echTooltip__tableCell {\\n  border-top: solid 1px #343741;\\n  bottom: 0;\\n}\\nhtml.dark-theme .echTooltip__tableCell:not(.echTooltip__colorCell) {\\n  padding: 4px;\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableCell:not(.echTooltip__colorCell) {\\n  padding: 2px 4px;\\n  transition: margin 200ms, padding 200ms;\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(27, 81, 120, 0.28);\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected .echTooltip__colorCell + .echTooltip__tableCell {\\n  margin-left: 10px;\\n  padding-left: 10px;\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected:hover .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selected:hover .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(27, 81, 120, 0.28);\\n}\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selectable:hover .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.dark-theme .echTooltip__tableBody .echTooltip__tableRow--selectable:hover .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(54, 162, 239, 0.05);\\n}\\nhtml.dark-theme .echTooltip__tableRow {\\n  position: relative;\\n}\\nhtml.dark-theme .echTooltip__tableRow--highlighted .echTooltip__tableCell:not(.echTooltip__colorCell),\\nhtml.dark-theme .echTooltip__tableRow--highlighted .echTooltip__colorCell .echTooltip__colorStrip--spacer {\\n  background-color: rgba(52, 55, 65, 0.5);\\n}\\nhtml.dark-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip {\\n  width: 21px;\\n}\\nhtml.dark-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip--spacer {\\n  width: 0;\\n  min-width: 0;\\n}\\nhtml.dark-theme .echTooltip__tableRow--selected :not(.echTooltip__colorCell--static) .echTooltip__colorStrip--icon {\\n  opacity: 1;\\n}\\nhtml.dark-theme .echTooltip__colorCell {\\n  padding: 0;\\n  height: 100%;\\n  position: relative;\\n  overflow: hidden;\\n  width: 21px;\\n}\\nhtml.dark-theme .echTooltip__colorCell--static {\\n  width: 5px;\\n}\\nhtml.dark-theme .echTooltip__colorStrip, html.dark-theme .echTooltip__colorStrip--bg, html.dark-theme .echTooltip__colorStrip--spacer {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  bottom: 0;\\n  width: 5px;\\n  transition: width 200ms;\\n}\\nhtml.dark-theme .echTooltip__colorStrip--icon {\\n  opacity: 0;\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  height: 100%;\\n  transition: opacity 200ms;\\n  padding: 0 4px;\\n}\\nhtml.dark-theme .echTooltip__colorStrip--spacer {\\n  left: auto;\\n  right: 10px;\\n  width: 6px;\\n  min-width: 6px;\\n}\\nhtml.dark-theme .echTooltip__label {\\n  min-width: 1px;\\n  flex: 1 1 auto;\\n  text-align: left;\\n}\\nhtml.dark-theme .echTooltip__value {\\n  text-align: right;\\n  font-feature-settings: \\\"tnum\\\";\\n}\\nhtml.dark-theme .echTooltip[dir=rtl] .echTooltip__colorStrip {\\n  left: auto;\\n  right: 0;\\n}\\nhtml.dark-theme .echTooltipHeader {\\n  font-weight: 600;\\n  margin-bottom: 0;\\n  padding: 4px 8px;\\n}\\nhtml.dark-theme .echTooltipFooter {\\n  font-weight: 600;\\n  margin-top: 0;\\n  padding: 4px 8px;\\n}\\nhtml.dark-theme .echTooltipDivider {\\n  width: 100%;\\n  border-bottom: solid 1px #343741;\\n}\\n@keyframes promptSlideDown {\\n  100% {\\n    opacity: 1;\\n    top: 0;\\n    height: 26px;\\n  }\\n}\\nhtml.dark-theme .echTooltipPrompt {\\n  position: relative;\\n  width: 100%;\\n  z-index: -1;\\n}\\nhtml.dark-theme .echTooltipPrompt__content {\\n  color: #7a7f89;\\n  font-style: normal;\\n  font-size: 12px;\\n  line-height: 26px;\\n  padding: 0 8px;\\n}\\nhtml.dark-theme .echTooltipPrompt.slideDown {\\n  opacity: 0;\\n  top: -26px;\\n  height: 0;\\n  -webkit-animation: promptSlideDown 0.25s forwards;\\n          animation: promptSlideDown 0.25s forwards;\\n  -webkit-animation-delay: 1.5s;\\n          animation-delay: 1.5s;\\n}\\nhtml.dark-theme .echTooltipActions {\\n  position: relative;\\n  display: flex;\\n  align-items: flex-start;\\n  flex-direction: column;\\n  width: 100%;\\n  font-style: normal;\\n  font-size: 12px;\\n  line-height: 21px;\\n}\\nhtml.dark-theme .echTooltipActions__prompt {\\n  position: relative;\\n  height: 26px;\\n  padding: 0 8px;\\n  line-height: 26px;\\n  width: 100%;\\n  color: #7a7f89;\\n  font-style: normal;\\n  font-size: 12px;\\n}\\nhtml.dark-theme .echTooltipActions__action {\\n  overflow: hidden;\\n  text-overflow: ellipsis;\\n  white-space: nowrap;\\n  display: block;\\n  text-align: left;\\n  width: 100%;\\n  padding: 0 8px;\\n  line-height: 21px;\\n  cursor: pointer;\\n  color: #DFE5EF;\\n}\\nhtml.dark-theme .echTooltipActions__action:nth-child(2) {\\n  padding-top: 4px;\\n}\\nhtml.dark-theme .echTooltipActions__action:last-child {\\n  padding-bottom: 2px;\\n}\\nhtml.dark-theme .echTooltipActions__action:hover, html.dark-theme .echTooltipActions__action:focus {\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .echTooltipActions__action[disabled] {\\n  cursor: default;\\n  color: #515761;\\n}\\nhtml.dark-theme .echTooltipActions__action[disabled]:hover, html.dark-theme .echTooltipActions__action[disabled]:focus {\\n  text-decoration: none;\\n}\\nhtml.dark-theme [id^=echTooltipPortal] {\\n  pointer-events: none;\\n}\\nhtml.dark-theme [id^=echAnchor] {\\n  position: absolute;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echTooltipPortal__invisible {\\n  position: fixed;\\n  visibility: hidden;\\n  width: 0;\\n  height: 0;\\n}\\nhtml.dark-theme .echIcon {\\n  flex-shrink: 0;\\n  display: inline-block;\\n  vertical-align: middle;\\n  fill: currentColor;\\n}\\nhtml.dark-theme .echIcon svg {\\n  transform: translate(0, 0);\\n}\\nhtml.dark-theme .echIcon:focus {\\n  opacity: 1;\\n  background: rgba(54, 162, 239, 0.2);\\n}\\nhtml.dark-theme .echLegend .echLegendList {\\n  display: grid;\\n  grid-template-columns: minmax(0, 1fr);\\n  -webkit-padding-start: 0;\\n          padding-inline-start: 0;\\n  -webkit-padding-end: 0;\\n          padding-inline-end: 0;\\n  -webkit-margin-before: 0;\\n          margin-block-start: 0;\\n  -webkit-margin-after: 0;\\n          margin-block-end: 0;\\n}\\nhtml.dark-theme .echLegend--horizontal .echLegendList {\\n  grid-column-gap: 24px;\\n  grid-row-gap: 8px;\\n  margin-top: 8px;\\n  margin-bottom: 8px;\\n}\\nhtml.dark-theme .echLegend--top, html.dark-theme .echLegend--left {\\n  order: 0;\\n}\\nhtml.dark-theme .echLegend--bottom, html.dark-theme .echLegend--right {\\n  order: 1;\\n}\\nhtml.dark-theme .echLegend--debug {\\n  background: rgba(238, 130, 238, 0.2);\\n  position: relative;\\n}\\nhtml.dark-theme .echLegend--inert {\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer {\\n  scrollbar-color: rgba(152, 162, 179, 0.5) transparent;\\n  scrollbar-width: thin;\\n  height: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n  -webkit-mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n          mask-image: linear-gradient(to bottom, rgba(255, 0, 0, 0.1) 0%, red 7.5px, red calc(100% - 7.5px), rgba(255, 0, 0, 0.1) 100%);\\n  width: 100%;\\n  overflow-y: auto;\\n  overflow-x: hidden;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer::-webkit-scrollbar {\\n  width: 16px;\\n  height: 16px;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer::-webkit-scrollbar-thumb {\\n  background-color: rgba(152, 162, 179, 0.5);\\n  background-clip: content-box;\\n  border-radius: 16px;\\n  border: 6px solid transparent;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer::-webkit-scrollbar-corner, html.dark-theme .echLegend .echLegendListContainer::-webkit-scrollbar-track {\\n  background-color: transparent;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer:focus {\\n  outline: none;\\n  /* 1 */\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer[tabindex=\\\"0\\\"]:focus:focus-visible {\\n  outline-style: auto;\\n  /* 2 */\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer :focus {\\n  outline: 2px solid currentColor;\\n  outline-offset: 1px;\\n  background-color: rgba(54, 162, 239, 0.2);\\n  border-radius: 3px;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer :focus:focus-visible {\\n  outline-style: auto;\\n}\\nhtml.dark-theme .echLegend .echLegendListContainer :focus:not(:focus-visible) {\\n  outline: none;\\n}\\nhtml.dark-theme .echLegendItem {\\n  color: #DFE5EF;\\n  display: flex;\\n  flex-wrap: nowrap;\\n  justify-content: space-between;\\n  align-items: flex-start;\\n  position: relative;\\n}\\nhtml.dark-theme .echLegendItem .colorWrapper > *:first-of-type {\\n  height: 18px;\\n}\\nhtml.dark-theme .echLegendItem:not([dir=rtl]) > *:not(.background) {\\n  margin-left: 4px;\\n}\\nhtml.dark-theme .echLegendItem:not([dir=rtl]) > *:not(.background):last-child:not(.echLegendItem__extra) {\\n  margin-right: 4px;\\n}\\nhtml.dark-theme .echLegendItem[dir=rtl] > *:not(.background) {\\n  margin-right: 4px;\\n}\\nhtml.dark-theme .echLegendItem[dir=rtl] > *:not(.background):last-child:not(.echLegendItem__extra) {\\n  margin-left: 4px;\\n}\\nhtml.dark-theme .echLegendItem:not(html.dark-theme .echLegendItem--hidden) .echLegendItem__color--changable {\\n  cursor: pointer;\\n}\\nhtml.dark-theme .echLegendItem:hover .background {\\n  background-color: #25262E;\\n}\\nhtml.dark-theme .echLegendItem .background {\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n  z-index: -1;\\n}\\nhtml.dark-theme .echLegendItem__action {\\n  cursor: pointer;\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  height: 18px;\\n  max-width: calc(18px + 8px);\\n}\\nhtml.dark-theme .echLegendItem__action .euiPopover,\\nhtml.dark-theme .echLegendItem__action .euiPopover__anchor,\\nhtml.dark-theme .echLegendItem__action .euiPopover__anchor > *:first-child {\\n  height: 100%;\\n  width: 100%;\\n  display: flex;\\n}\\nhtml.dark-theme .echLegendItem__color {\\n  display: flex;\\n  line-height: 1.5;\\n  align-items: center;\\n}\\nhtml.dark-theme .echLegendItem__label {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  flex: 1 1 auto;\\n  text-align: left;\\n  vertical-align: baseline;\\n  letter-spacing: unset;\\n  align-items: center;\\n  overflow-wrap: break-word;\\n  word-wrap: break-word;\\n  word-break: break-all;\\n  word-break: break-word;\\n  -webkit-hyphens: auto;\\n      -ms-hyphens: auto;\\n          hyphens: auto;\\n  overflow: hidden;\\n  min-width: 1px;\\n}\\nhtml.dark-theme .echLegendItem__label--singleline {\\n  max-width: 100%;\\n  overflow: hidden !important;\\n  text-overflow: ellipsis !important;\\n  white-space: nowrap !important;\\n}\\nhtml.dark-theme .echLegendItem__label--multiline:is(div) {\\n  display: -webkit-box;\\n  -webkit-box-orient: vertical;\\n  -webkit-line-clamp: 2;\\n}\\nhtml.dark-theme .echLegendItem__label--clickable:hover {\\n  cursor: pointer;\\n  text-decoration: underline;\\n}\\nhtml.dark-theme .echLegendItem__extra {\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  text-align: right;\\n  flex: 0 0 auto;\\n  margin-left: 4px;\\n  font-feature-settings: \\\"tnum\\\";\\n  letter-spacing: unset;\\n  direction: ltr;\\n}\\nhtml.dark-theme .echLegendItem--vertical {\\n  padding-top: 2px;\\n  padding-bottom: 2px;\\n}\\nhtml.dark-theme .echLegendItem--vertical:first-of-type {\\n  margin-top: 2px;\\n}\\nhtml.dark-theme .echLegendItem--vertical .background {\\n  margin-top: 2px;\\n  margin-bottom: 2px;\\n}\\nhtml.dark-theme .echLegendItem--hidden {\\n  color: #98A2B3;\\n}\\nhtml.dark-theme .echLegendItem[dir=rtl] .echLegendItem__label {\\n  text-align: right;\\n}\\nhtml.dark-theme .echReactiveChart_noResults {\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  width: 100%;\\n  height: 100%;\\n  font-size: 12px;\\n  font-size: 0.8571428571rem;\\n  line-height: 1.1428571429rem;\\n  color: #98A2B3;\\n}\\nhtml.dark-theme .echGridContainer {\\n  display: grid;\\n  width: 100%;\\n  height: 100%;\\n  align-content: start;\\n  justify-content: stretch;\\n  align-items: stretch;\\n  -webkit-user-select: text;\\n     -moz-user-select: text;\\n      -ms-user-select: text;\\n          user-select: text;\\n}\\nhtml.dark-theme .echGridCell {\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n  overflow: hidden;\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.dark-theme .echGridCell--rightBorder {\\n  border-right: 1px solid #343741;\\n}\\nhtml.dark-theme .echGridCell--bottomBorder {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.dark-theme .echAlignedGrid {\\n  display: grid;\\n  align-content: stretch;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.dark-theme .echAlignedGrid--header {\\n  width: 100%;\\n  height: 100%;\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.dark-theme .echAlignedGrid__borderRight {\\n  border-right: 1px solid #edf0f5;\\n}\\nhtml.dark-theme .echAlignedGrid__borderBottom {\\n  border-bottom: 1px solid #edf0f5;\\n}\\nhtml.dark-theme .echAlignedGrid--content {\\n  width: 100%;\\n  min-height: 0;\\n  margin: 0;\\n  padding: 0;\\n}\\nhtml.dark-theme .echHighlighter {\\n  position: absolute;\\n  pointer-events: none;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.dark-theme .echHighlighterOverlay__fill {\\n  fill: rgba(255, 255, 255, 0.2);\\n}\\nhtml.dark-theme .echHighlighterOverlay__stroke {\\n  stroke: rgba(255, 255, 255, 0.2);\\n}\\nhtml.dark-theme .echHighlighter__mask {\\n  fill: rgba(29, 30, 36, 0.5);\\n}\\nhtml.dark-theme .echCrosshair,\\nhtml.dark-theme .echCrosshair__cursor,\\nhtml.dark-theme .echCrosshair__crossLine {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echScreenReaderOnly {\\n  position: absolute;\\n  left: -10000px;\\n  top: auto;\\n  width: 1px;\\n  height: 1px;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .echScreenReaderOnlyDebug {\\n  left: 0 !important;\\n  top: 0 !important;\\n  right: 0 !important;\\n  bottom: 0 !important;\\n  width: 100% !important;\\n  height: 100% !important;\\n  overflow: auto !important;\\n  background: rgba(255, 255, 255, 0.8);\\n}\\nhtml.dark-theme .echScreenReaderOnlyDebug table,\\nhtml.dark-theme .echScreenReaderOnlyDebug td,\\nhtml.dark-theme .echScreenReaderOnlyDebug th {\\n  border: 1px solid black;\\n  font-size: 12px;\\n}\\nhtml.dark-theme .echScreenReaderTable {\\n  overflow-x: auto;\\n  text-align: left;\\n}\\nhtml.dark-theme .echAnnotation {\\n  padding: 0;\\n  transition: opacity 250ms;\\n  pointer-events: none;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  max-width: 260px;\\n}\\nhtml.dark-theme .echAnnotation__marker {\\n  position: absolute;\\n  -webkit-user-select: none;\\n     -moz-user-select: none;\\n      -ms-user-select: none;\\n          user-select: none;\\n  font-size: 12px;\\n  font-weight: 700;\\n  line-height: normal;\\n}\\nhtml.dark-theme .echAnnotation__details {\\n  padding: 4px 8px;\\n}\\nhtml.dark-theme .echAnnotation__icon {\\n  position: relative;\\n}\\nhtml.dark-theme .echAnnotation__body {\\n  white-space: nowrap;\\n}\\nhtml.dark-theme .echCanvasRenderer {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  padding: 0;\\n  margin: 0;\\n  border: 0;\\n  background: transparent;\\n}\\nhtml.dark-theme .echMetricContainer {\\n  display: grid;\\n  width: 100%;\\n  height: 100%;\\n  align-content: start;\\n  justify-content: stretch;\\n  align-items: stretch;\\n  -webkit-user-select: text;\\n     -moz-user-select: text;\\n      -ms-user-select: text;\\n          user-select: text;\\n}\\nhtml.dark-theme .echMetric {\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n  overflow: hidden;\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.dark-theme .echMetric .echMetric--outline {\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  pointer-events: none;\\n}\\nhtml.dark-theme .echMetric:focus-within .echMetric--outline {\\n  outline: auto;\\n  outline-offset: -1.5px;\\n}\\nhtml.dark-theme .echMetric:focus-within button {\\n  outline: none;\\n}\\nhtml.dark-theme .echMetric--rightBorder {\\n  border-right: 1px solid #343741;\\n}\\nhtml.dark-theme .echMetric--topBorder {\\n  border-top: 1px solid #343741;\\n}\\nhtml.dark-theme .echMetric--bottomBorder {\\n  border-bottom: 1px solid #343741;\\n}\\nhtml.dark-theme .echMetric--vertical.echMetric--withProgressBar--small {\\n  padding-left: 10px;\\n}\\nhtml.dark-theme .echMetric--vertical.echMetric--withTargetProgressBar--small {\\n  padding-left: 14px;\\n}\\nhtml.dark-theme .echMetric--horizontal.echMetric--withProgressBar--small {\\n  padding-bottom: 10px;\\n}\\nhtml.dark-theme .echMetric--horizontal.echMetric--withTargetProgressBar--small {\\n  padding-bottom: 12px;\\n}\\nhtml.dark-theme .echMetricEmpty {\\n  position: absolute;\\n  bottom: 9px;\\n  right: 11px;\\n  width: 20px;\\n  border-bottom: 1px solid;\\n}\\nhtml.dark-theme .echMetricText {\\n  position: relative;\\n  padding: 8px;\\n  height: 100%;\\n  z-index: 1;\\n  display: grid;\\n  grid-template-columns: 100%;\\n  grid-template-rows: -webkit-min-content -webkit-min-content auto -webkit-min-content -webkit-min-content;\\n  grid-template-rows: min-content min-content auto min-content min-content;\\n  text-align: left;\\n  line-height: 1.2;\\n}\\nhtml.dark-theme .echMetricText__title {\\n  font-weight: bold;\\n  word-wrap: break-word;\\n}\\nhtml.dark-theme .echMetricText__title button {\\n  font-weight: bold;\\n  width: 100%;\\n  text-align: left;\\n}\\nhtml.dark-theme .echMetricText__icon {\\n  position: absolute;\\n  right: 8px;\\n  top: 8px;\\n}\\nhtml.dark-theme .echMetricText__subtitle {\\n  padding-top: 5px;\\n  font-weight: normal;\\n  text-align: left;\\n}\\nhtml.dark-theme .echMetricText__extra {\\n  text-align: right;\\n  font-weight: normal;\\n}\\nhtml.dark-theme .echMetricText__value {\\n  position: relative;\\n  font-weight: bold;\\n  text-align: right;\\n  white-space: nowrap;\\n  overflow: hidden;\\n}\\nhtml.dark-theme .echMetricText__valueIcon {\\n  display: inline-block;\\n  position: absolute;\\n  right: 8px;\\n  bottom: 8px;\\n}\\nhtml.dark-theme .echMetricText__part {\\n  font-weight: bold;\\n}\\nhtml.dark-theme .echMetricText__gap {\\n  position: relative;\\n}\\nhtml.dark-theme .echMetricText__body {\\n  overflow: hidden;\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  bottom: 0;\\n  left: 0;\\n}\\nhtml.dark-theme .echSingleMetricProgress {\\n  position: absolute;\\n}\\nhtml.dark-theme .echSingleMetricProgress--vertical {\\n  left: 0;\\n  right: 0;\\n  top: 0;\\n  bottom: 0;\\n  height: 100%;\\n  width: 100%;\\n}\\nhtml.dark-theme .echSingleMetricProgress--vertical.echSingleMetricProgress--small {\\n  right: auto;\\n  width: 10px;\\n}\\nhtml.dark-theme .echSingleMetricProgress--horizontal {\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  top: 0;\\n  bottom: 0;\\n  height: 100%;\\n}\\nhtml.dark-theme .echSingleMetricProgress--horizontal.echSingleMetricProgress--small {\\n  top: auto;\\n  height: 10px;\\n}\\nhtml.dark-theme .echSingleMetricProgressBar {\\n  transition: background-color ease-in-out 0.1s;\\n}\\nhtml.dark-theme .echSingleMetricProgressBar--vertical {\\n  position: absolute;\\n  left: 0;\\n  right: 0;\\n  bottom: 0;\\n  width: 100%;\\n}\\nhtml.dark-theme .echSingleMetricProgressBar--horizontal {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  height: 100%;\\n}\\nhtml.dark-theme .echSingleMetricTarget {\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  overflow: visible;\\n  z-index: 1;\\n}\\nhtml.dark-theme .echSingleMetricTarget--vertical {\\n  transform: rotate(90deg);\\n  position: absolute;\\n  left: 100%;\\n  bottom: 0;\\n}\\nhtml.dark-theme .echSingleMetricTarget--horizontal {\\n  position: absolute;\\n  bottom: 100%;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline {\\n  display: flex;\\n  justify-content: center;\\n  align-items: center;\\n  overflow: visible;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline--vertical {\\n  position: absolute;\\n  left: 0;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline--vertical.echSingleMetricZeroBaseline--small {\\n  right: auto;\\n  height: 2px;\\n  width: 13px;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline--horizontal {\\n  position: absolute;\\n  bottom: 0;\\n}\\nhtml.dark-theme .echSingleMetricZeroBaseline--horizontal.echSingleMetricZeroBaseline--small {\\n  top: auto;\\n  width: 2px;\\n  height: 13px;\\n}\\nhtml.dark-theme .echSingleMetricSparkline {\\n  position: absolute;\\n  overflow: hidden;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n}\\nhtml.dark-theme .echSingleMetricSparkline__svg {\\n  position: absolute;\\n  top: 0;\\n  bottom: 0;\\n  left: 0;\\n  right: 0;\\n  width: 100%;\\n  height: 100%;\\n}\\nhtml.dark-theme .echSingleMetricSparkline__svg rect,\\nhtml.dark-theme .echSingleMetricSparkline__svg path {\\n  transition: fill ease-in-out 0.1s;\\n}\\nhtml.dark-theme .echSingleMetricChart--small {\\n  position: absolute;\\n  top: auto;\\n  left: auto;\\n  bottom: 0;\\n  right: 0;\\n  width: 100px;\\n  height: 30px;\\n}\\nhtml.dark-theme:not(.legacy) {\\n  /**\\n  The MIT License (MIT)\\n\\n  Copyright (c) 2015 strarsis https://github.com/strarsis/sass-math-pow\\n\\n  Permission is hereby granted, free of charge, to any person obtaining a copy\\n  of this software and associated documentation files (the \\\"Software\\\"), to deal\\n  in the Software without restriction, including without limitation the rights\\n  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\\n  copies of the Software, and to permit persons to whom the Software is\\n  furnished to do so, subject to the following conditions:\\n\\n  The above copyright notice and this permission notice shall be included in all\\n  copies or substantial portions of the Software.\\n\\n  THE SOFTWARE IS PROVIDED \\\"AS IS\\\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\\n  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\\n  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\\n  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\\n  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\\n  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\\n  SOFTWARE.\\n   */\\n}\\nhtml.dark-theme:not(.legacy) body,\\nhtml.dark-theme:not(.legacy) .echChart {\\n  background: #1D1E24 !important;\\n}\\nhtml.dark-theme:not(.legacy) .euiText {\\n  color: #DFE5EF;\\n}\\nhtml.legacy.dark-theme body,\\nhtml.legacy.dark-theme .echChart {\\n  background: black !important;\\n}\\nhtml.legacy.light-theme body,\\nhtml.legacy.light-theme .echChart {\\n  background: white !important;\\n}\\nhtml.disable-animations *,\\nhtml.disable-animations *::after,\\nhtml.disable-animations *::before {\\n  transition-delay: 0s !important;\\n  transition-duration: 0s !important;\\n  -webkit-animation-delay: -0.0001s !important;\\n          animation-delay: -0.0001s !important;\\n  -webkit-animation-duration: 0s !important;\\n          animation-duration: 0s !important;\\n  -webkit-animation-play-state: paused !important;\\n          animation-play-state: paused !important;\\n  caret-color: transparent !important;\\n}\\nhtml.disable-animations .echLegend .echLegendListContainer :focus {\\n  -webkit-animation-duration: 0s !important;\\n          animation-duration: 0s !important;\\n}\\nhtml.disable-animations .euiSaturation:focus .euiSaturation__indicator {\\n  -webkit-animation: none !important;\\n          animation: none !important;\\n}\\nhtml.echVisualTesting,\\nhtml.echVisualTesting body,\\nhtml.echVisualTesting #root {\\n  background: blanchedalmond !important;\\n}\\nhtml.echVisualTesting #story-header {\\n  display: none;\\n}\\nhtml.echVisualTesting #root {\\n  width: 785px;\\n  height: 1000px;\\n  display: flex;\\n  align-items: center;\\n}\\n\\nbody {\\n  min-height: 100%;\\n}\\n\\n#root {\\n  z-index: 200;\\n  position: relative;\\n}\\n\\n#story-root {\\n  padding: 20px;\\n  min-width: 100%;\\n  min-height: 400px;\\n  position: relative;\\n  z-index: 500;\\n  box-sizing: border-box;\\n}\\n#story-root.showChartBoundary {\\n  background-color: blanchedalmond;\\n}\\n#story-root.resizeHeight {\\n  height: 0;\\n}\\n\\n#story-resize-wrapper {\\n  resize: both;\\n  height: 100%;\\n  width: 100%;\\n  overflow: auto;\\n  max-width: 100%;\\n  max-height: 80vh;\\n}\\n#story-resize-wrapper.e2e-server {\\n  resize: none;\\n}\\n\\n#story-header {\\n  padding: 20px 40px 16px;\\n}\\n\\n.sb-show-main {\\n  padding: 0 !important;\\n}\\n\\n.echChart {\\n  box-sizing: border-box;\\n}\\n\\n.echInvisible {\\n  visibility: hidden;\\n}\\n\\n#story-root + div table {\\n  border: 1px solid gray;\\n}\\n\\n#story-root + div table th {\\n  border: 1px solid gray;\\n  padding: 5px;\\n}\\n\\n#story-root + div table td {\\n  border: 1px solid gray;\\n  padding: 5px;\\n}\\n\\n.Pane.vertical.Pane1 {\\n  background: red;\\n}\\n\\n.euiPopover__anchor {\\n  width: 100%;\\n}\\n\\n.resizable {\\n  resize: both;\\n  overflow: auto;\\n  width: 500px;\\n  height: 600px;\\n}\", \"\"]);\n// Exports\nmodule.exports = exports;\n","var map = {\n\t\"./af\": \"../node_modules/moment/locale/af.js\",\n\t\"./af.js\": \"../node_modules/moment/locale/af.js\",\n\t\"./ar\": \"../node_modules/moment/locale/ar.js\",\n\t\"./ar-dz\": \"../node_modules/moment/locale/ar-dz.js\",\n\t\"./ar-dz.js\": \"../node_modules/moment/locale/ar-dz.js\",\n\t\"./ar-kw\": \"../node_modules/moment/locale/ar-kw.js\",\n\t\"./ar-kw.js\": \"../node_modules/moment/locale/ar-kw.js\",\n\t\"./ar-ly\": \"../node_modules/moment/locale/ar-ly.js\",\n\t\"./ar-ly.js\": \"../node_modules/moment/locale/ar-ly.js\",\n\t\"./ar-ma\": \"../node_modules/moment/locale/ar-ma.js\",\n\t\"./ar-ma.js\": \"../node_modules/moment/locale/ar-ma.js\",\n\t\"./ar-sa\": \"../node_modules/moment/locale/ar-sa.js\",\n\t\"./ar-sa.js\": \"../node_modules/moment/locale/ar-sa.js\",\n\t\"./ar-tn\": \"../node_modules/moment/locale/ar-tn.js\",\n\t\"./ar-tn.js\": \"../node_modules/moment/locale/ar-tn.js\",\n\t\"./ar.js\": \"../node_modules/moment/locale/ar.js\",\n\t\"./az\": \"../node_modules/moment/locale/az.js\",\n\t\"./az.js\": \"../node_modules/moment/locale/az.js\",\n\t\"./be\": \"../node_modules/moment/locale/be.js\",\n\t\"./be.js\": \"../node_modules/moment/locale/be.js\",\n\t\"./bg\": \"../node_modules/moment/locale/bg.js\",\n\t\"./bg.js\": \"../node_modules/moment/locale/bg.js\",\n\t\"./bm\": \"../node_modules/moment/locale/bm.js\",\n\t\"./bm.js\": \"../node_modules/moment/locale/bm.js\",\n\t\"./bn\": \"../node_modules/moment/locale/bn.js\",\n\t\"./bn-bd\": \"../node_modules/moment/locale/bn-bd.js\",\n\t\"./bn-bd.js\": \"../node_modules/moment/locale/bn-bd.js\",\n\t\"./bn.js\": \"../node_modules/moment/locale/bn.js\",\n\t\"./bo\": \"../node_modules/moment/locale/bo.js\",\n\t\"./bo.js\": \"../node_modules/moment/locale/bo.js\",\n\t\"./br\": \"../node_modules/moment/locale/br.js\",\n\t\"./br.js\": \"../node_modules/moment/locale/br.js\",\n\t\"./bs\": \"../node_modules/moment/locale/bs.js\",\n\t\"./bs.js\": \"../node_modules/moment/locale/bs.js\",\n\t\"./ca\": \"../node_modules/moment/locale/ca.js\",\n\t\"./ca.js\": \"../node_modules/moment/locale/ca.js\",\n\t\"./cs\": \"../node_modules/moment/locale/cs.js\",\n\t\"./cs.js\": \"../node_modules/moment/locale/cs.js\",\n\t\"./cv\": \"../node_modules/moment/locale/cv.js\",\n\t\"./cv.js\": \"../node_modules/moment/locale/cv.js\",\n\t\"./cy\": \"../node_modules/moment/locale/cy.js\",\n\t\"./cy.js\": \"../node_modules/moment/locale/cy.js\",\n\t\"./da\": \"../node_modules/moment/locale/da.js\",\n\t\"./da.js\": \"../node_modules/moment/locale/da.js\",\n\t\"./de\": \"../node_modules/moment/locale/de.js\",\n\t\"./de-at\": \"../node_modules/moment/locale/de-at.js\",\n\t\"./de-at.js\": \"../node_modules/moment/locale/de-at.js\",\n\t\"./de-ch\": \"../node_modules/moment/locale/de-ch.js\",\n\t\"./de-ch.js\": \"../node_modules/moment/locale/de-ch.js\",\n\t\"./de.js\": \"../node_modules/moment/locale/de.js\",\n\t\"./dv\": \"../node_modules/moment/locale/dv.js\",\n\t\"./dv.js\": \"../node_modules/moment/locale/dv.js\",\n\t\"./el\": \"../node_modules/moment/locale/el.js\",\n\t\"./el.js\": \"../node_modules/moment/locale/el.js\",\n\t\"./en-au\": \"../node_modules/moment/locale/en-au.js\",\n\t\"./en-au.js\": \"../node_modules/moment/locale/en-au.js\",\n\t\"./en-ca\": \"../node_modules/moment/locale/en-ca.js\",\n\t\"./en-ca.js\": \"../node_modules/moment/locale/en-ca.js\",\n\t\"./en-gb\": \"../node_modules/moment/locale/en-gb.js\",\n\t\"./en-gb.js\": \"../node_modules/moment/locale/en-gb.js\",\n\t\"./en-ie\": \"../node_modules/moment/locale/en-ie.js\",\n\t\"./en-ie.js\": \"../node_modules/moment/locale/en-ie.js\",\n\t\"./en-il\": \"../node_modules/moment/locale/en-il.js\",\n\t\"./en-il.js\": \"../node_modules/moment/locale/en-il.js\",\n\t\"./en-in\": \"../node_modules/moment/locale/en-in.js\",\n\t\"./en-in.js\": \"../node_modules/moment/locale/en-in.js\",\n\t\"./en-nz\": \"../node_modules/moment/locale/en-nz.js\",\n\t\"./en-nz.js\": \"../node_modules/moment/locale/en-nz.js\",\n\t\"./en-sg\": \"../node_modules/moment/locale/en-sg.js\",\n\t\"./en-sg.js\": \"../node_modules/moment/locale/en-sg.js\",\n\t\"./eo\": \"../node_modules/moment/locale/eo.js\",\n\t\"./eo.js\": \"../node_modules/moment/locale/eo.js\",\n\t\"./es\": \"../node_modules/moment/locale/es.js\",\n\t\"./es-do\": \"../node_modules/moment/locale/es-do.js\",\n\t\"./es-do.js\": \"../node_modules/moment/locale/es-do.js\",\n\t\"./es-mx\": \"../node_modules/moment/locale/es-mx.js\",\n\t\"./es-mx.js\": \"../node_modules/moment/locale/es-mx.js\",\n\t\"./es-us\": \"../node_modules/moment/locale/es-us.js\",\n\t\"./es-us.js\": \"../node_modules/moment/locale/es-us.js\",\n\t\"./es.js\": \"../node_modules/moment/locale/es.js\",\n\t\"./et\": \"../node_modules/moment/locale/et.js\",\n\t\"./et.js\": \"../node_modules/moment/locale/et.js\",\n\t\"./eu\": \"../node_modules/moment/locale/eu.js\",\n\t\"./eu.js\": \"../node_modules/moment/locale/eu.js\",\n\t\"./fa\": \"../node_modules/moment/locale/fa.js\",\n\t\"./fa.js\": \"../node_modules/moment/locale/fa.js\",\n\t\"./fi\": \"../node_modules/moment/locale/fi.js\",\n\t\"./fi.js\": \"../node_modules/moment/locale/fi.js\",\n\t\"./fil\": \"../node_modules/moment/locale/fil.js\",\n\t\"./fil.js\": \"../node_modules/moment/locale/fil.js\",\n\t\"./fo\": \"../node_modules/moment/locale/fo.js\",\n\t\"./fo.js\": \"../node_modules/moment/locale/fo.js\",\n\t\"./fr\": \"../node_modules/moment/locale/fr.js\",\n\t\"./fr-ca\": \"../node_modules/moment/locale/fr-ca.js\",\n\t\"./fr-ca.js\": \"../node_modules/moment/locale/fr-ca.js\",\n\t\"./fr-ch\": \"../node_modules/moment/locale/fr-ch.js\",\n\t\"./fr-ch.js\": \"../node_modules/moment/locale/fr-ch.js\",\n\t\"./fr.js\": \"../node_modules/moment/locale/fr.js\",\n\t\"./fy\": \"../node_modules/moment/locale/fy.js\",\n\t\"./fy.js\": \"../node_modules/moment/locale/fy.js\",\n\t\"./ga\": \"../node_modules/moment/locale/ga.js\",\n\t\"./ga.js\": \"../node_modules/moment/locale/ga.js\",\n\t\"./gd\": \"../node_modules/moment/locale/gd.js\",\n\t\"./gd.js\": \"../node_modules/moment/locale/gd.js\",\n\t\"./gl\": \"../node_modules/moment/locale/gl.js\",\n\t\"./gl.js\": \"../node_modules/moment/locale/gl.js\",\n\t\"./gom-deva\": \"../node_modules/moment/locale/gom-deva.js\",\n\t\"./gom-deva.js\": \"../node_modules/moment/locale/gom-deva.js\",\n\t\"./gom-latn\": \"../node_modules/moment/locale/gom-latn.js\",\n\t\"./gom-latn.js\": \"../node_modules/moment/locale/gom-latn.js\",\n\t\"./gu\": \"../node_modules/moment/locale/gu.js\",\n\t\"./gu.js\": \"../node_modules/moment/locale/gu.js\",\n\t\"./he\": \"../node_modules/moment/locale/he.js\",\n\t\"./he.js\": \"../node_modules/moment/locale/he.js\",\n\t\"./hi\": \"../node_modules/moment/locale/hi.js\",\n\t\"./hi.js\": \"../node_modules/moment/locale/hi.js\",\n\t\"./hr\": \"../node_modules/moment/locale/hr.js\",\n\t\"./hr.js\": \"../node_modules/moment/locale/hr.js\",\n\t\"./hu\": \"../node_modules/moment/locale/hu.js\",\n\t\"./hu.js\": \"../node_modules/moment/locale/hu.js\",\n\t\"./hy-am\": \"../node_modules/moment/locale/hy-am.js\",\n\t\"./hy-am.js\": \"../node_modules/moment/locale/hy-am.js\",\n\t\"./id\": \"../node_modules/moment/locale/id.js\",\n\t\"./id.js\": \"../node_modules/moment/locale/id.js\",\n\t\"./is\": \"../node_modules/moment/locale/is.js\",\n\t\"./is.js\": \"../node_modules/moment/locale/is.js\",\n\t\"./it\": \"../node_modules/moment/locale/it.js\",\n\t\"./it-ch\": \"../node_modules/moment/locale/it-ch.js\",\n\t\"./it-ch.js\": \"../node_modules/moment/locale/it-ch.js\",\n\t\"./it.js\": \"../node_modules/moment/locale/it.js\",\n\t\"./ja\": \"../node_modules/moment/locale/ja.js\",\n\t\"./ja.js\": \"../node_modules/moment/locale/ja.js\",\n\t\"./jv\": \"../node_modules/moment/locale/jv.js\",\n\t\"./jv.js\": \"../node_modules/moment/locale/jv.js\",\n\t\"./ka\": \"../node_modules/moment/locale/ka.js\",\n\t\"./ka.js\": \"../node_modules/moment/locale/ka.js\",\n\t\"./kk\": \"../node_modules/moment/locale/kk.js\",\n\t\"./kk.js\": \"../node_modules/moment/locale/kk.js\",\n\t\"./km\": \"../node_modules/moment/locale/km.js\",\n\t\"./km.js\": \"../node_modules/moment/locale/km.js\",\n\t\"./kn\": \"../node_modules/moment/locale/kn.js\",\n\t\"./kn.js\": \"../node_modules/moment/locale/kn.js\",\n\t\"./ko\": \"../node_modules/moment/locale/ko.js\",\n\t\"./ko.js\": \"../node_modules/moment/locale/ko.js\",\n\t\"./ku\": \"../node_modules/moment/locale/ku.js\",\n\t\"./ku.js\": \"../node_modules/moment/locale/ku.js\",\n\t\"./ky\": \"../node_modules/moment/locale/ky.js\",\n\t\"./ky.js\": \"../node_modules/moment/locale/ky.js\",\n\t\"./lb\": \"../node_modules/moment/locale/lb.js\",\n\t\"./lb.js\": \"../node_modules/moment/locale/lb.js\",\n\t\"./lo\": \"../node_modules/moment/locale/lo.js\",\n\t\"./lo.js\": \"../node_modules/moment/locale/lo.js\",\n\t\"./lt\": \"../node_modules/moment/locale/lt.js\",\n\t\"./lt.js\": \"../node_modules/moment/locale/lt.js\",\n\t\"./lv\": \"../node_modules/moment/locale/lv.js\",\n\t\"./lv.js\": \"../node_modules/moment/locale/lv.js\",\n\t\"./me\": \"../node_modules/moment/locale/me.js\",\n\t\"./me.js\": \"../node_modules/moment/locale/me.js\",\n\t\"./mi\": \"../node_modules/moment/locale/mi.js\",\n\t\"./mi.js\": \"../node_modules/moment/locale/mi.js\",\n\t\"./mk\": \"../node_modules/moment/locale/mk.js\",\n\t\"./mk.js\": \"../node_modules/moment/locale/mk.js\",\n\t\"./ml\": \"../node_modules/moment/locale/ml.js\",\n\t\"./ml.js\": \"../node_modules/moment/locale/ml.js\",\n\t\"./mn\": \"../node_modules/moment/locale/mn.js\",\n\t\"./mn.js\": \"../node_modules/moment/locale/mn.js\",\n\t\"./mr\": \"../node_modules/moment/locale/mr.js\",\n\t\"./mr.js\": \"../node_modules/moment/locale/mr.js\",\n\t\"./ms\": \"../node_modules/moment/locale/ms.js\",\n\t\"./ms-my\": \"../node_modules/moment/locale/ms-my.js\",\n\t\"./ms-my.js\": \"../node_modules/moment/locale/ms-my.js\",\n\t\"./ms.js\": \"../node_modules/moment/locale/ms.js\",\n\t\"./mt\": \"../node_modules/moment/locale/mt.js\",\n\t\"./mt.js\": \"../node_modules/moment/locale/mt.js\",\n\t\"./my\": \"../node_modules/moment/locale/my.js\",\n\t\"./my.js\": \"../node_modules/moment/locale/my.js\",\n\t\"./nb\": \"../node_modules/moment/locale/nb.js\",\n\t\"./nb.js\": \"../node_modules/moment/locale/nb.js\",\n\t\"./ne\": \"../node_modules/moment/locale/ne.js\",\n\t\"./ne.js\": \"../node_modules/moment/locale/ne.js\",\n\t\"./nl\": \"../node_modules/moment/locale/nl.js\",\n\t\"./nl-be\": \"../node_modules/moment/locale/nl-be.js\",\n\t\"./nl-be.js\": \"../node_modules/moment/locale/nl-be.js\",\n\t\"./nl.js\": \"../node_modules/moment/locale/nl.js\",\n\t\"./nn\": \"../node_modules/moment/locale/nn.js\",\n\t\"./nn.js\": \"../node_modules/moment/locale/nn.js\",\n\t\"./oc-lnc\": \"../node_modules/moment/locale/oc-lnc.js\",\n\t\"./oc-lnc.js\": \"../node_modules/moment/locale/oc-lnc.js\",\n\t\"./pa-in\": \"../node_modules/moment/locale/pa-in.js\",\n\t\"./pa-in.js\": \"../node_modules/moment/locale/pa-in.js\",\n\t\"./pl\": \"../node_modules/moment/locale/pl.js\",\n\t\"./pl.js\": \"../node_modules/moment/locale/pl.js\",\n\t\"./pt\": \"../node_modules/moment/locale/pt.js\",\n\t\"./pt-br\": \"../node_modules/moment/locale/pt-br.js\",\n\t\"./pt-br.js\": \"../node_modules/moment/locale/pt-br.js\",\n\t\"./pt.js\": \"../node_modules/moment/locale/pt.js\",\n\t\"./ro\": \"../node_modules/moment/locale/ro.js\",\n\t\"./ro.js\": \"../node_modules/moment/locale/ro.js\",\n\t\"./ru\": \"../node_modules/moment/locale/ru.js\",\n\t\"./ru.js\": \"../node_modules/moment/locale/ru.js\",\n\t\"./sd\": \"../node_modules/moment/locale/sd.js\",\n\t\"./sd.js\": \"../node_modules/moment/locale/sd.js\",\n\t\"./se\": \"../node_modules/moment/locale/se.js\",\n\t\"./se.js\": \"../node_modules/moment/locale/se.js\",\n\t\"./si\": \"../node_modules/moment/locale/si.js\",\n\t\"./si.js\": \"../node_modules/moment/locale/si.js\",\n\t\"./sk\": \"../node_modules/moment/locale/sk.js\",\n\t\"./sk.js\": \"../node_modules/moment/locale/sk.js\",\n\t\"./sl\": \"../node_modules/moment/locale/sl.js\",\n\t\"./sl.js\": \"../node_modules/moment/locale/sl.js\",\n\t\"./sq\": \"../node_modules/moment/locale/sq.js\",\n\t\"./sq.js\": \"../node_modules/moment/locale/sq.js\",\n\t\"./sr\": \"../node_modules/moment/locale/sr.js\",\n\t\"./sr-cyrl\": \"../node_modules/moment/locale/sr-cyrl.js\",\n\t\"./sr-cyrl.js\": \"../node_modules/moment/locale/sr-cyrl.js\",\n\t\"./sr.js\": \"../node_modules/moment/locale/sr.js\",\n\t\"./ss\": \"../node_modules/moment/locale/ss.js\",\n\t\"./ss.js\": \"../node_modules/moment/locale/ss.js\",\n\t\"./sv\": \"../node_modules/moment/locale/sv.js\",\n\t\"./sv.js\": \"../node_modules/moment/locale/sv.js\",\n\t\"./sw\": \"../node_modules/moment/locale/sw.js\",\n\t\"./sw.js\": \"../node_modules/moment/locale/sw.js\",\n\t\"./ta\": \"../node_modules/moment/locale/ta.js\",\n\t\"./ta.js\": \"../node_modules/moment/locale/ta.js\",\n\t\"./te\": \"../node_modules/moment/locale/te.js\",\n\t\"./te.js\": \"../node_modules/moment/locale/te.js\",\n\t\"./tet\": \"../node_modules/moment/locale/tet.js\",\n\t\"./tet.js\": \"../node_modules/moment/locale/tet.js\",\n\t\"./tg\": \"../node_modules/moment/locale/tg.js\",\n\t\"./tg.js\": \"../node_modules/moment/locale/tg.js\",\n\t\"./th\": \"../node_modules/moment/locale/th.js\",\n\t\"./th.js\": \"../node_modules/moment/locale/th.js\",\n\t\"./tk\": \"../node_modules/moment/locale/tk.js\",\n\t\"./tk.js\": \"../node_modules/moment/locale/tk.js\",\n\t\"./tl-ph\": \"../node_modules/moment/locale/tl-ph.js\",\n\t\"./tl-ph.js\": \"../node_modules/moment/locale/tl-ph.js\",\n\t\"./tlh\": \"../node_modules/moment/locale/tlh.js\",\n\t\"./tlh.js\": \"../node_modules/moment/locale/tlh.js\",\n\t\"./tr\": \"../node_modules/moment/locale/tr.js\",\n\t\"./tr.js\": \"../node_modules/moment/locale/tr.js\",\n\t\"./tzl\": \"../node_modules/moment/locale/tzl.js\",\n\t\"./tzl.js\": \"../node_modules/moment/locale/tzl.js\",\n\t\"./tzm\": \"../node_modules/moment/locale/tzm.js\",\n\t\"./tzm-latn\": \"../node_modules/moment/locale/tzm-latn.js\",\n\t\"./tzm-latn.js\": \"../node_modules/moment/locale/tzm-latn.js\",\n\t\"./tzm.js\": \"../node_modules/moment/locale/tzm.js\",\n\t\"./ug-cn\": \"../node_modules/moment/locale/ug-cn.js\",\n\t\"./ug-cn.js\": \"../node_modules/moment/locale/ug-cn.js\",\n\t\"./uk\": \"../node_modules/moment/locale/uk.js\",\n\t\"./uk.js\": \"../node_modules/moment/locale/uk.js\",\n\t\"./ur\": \"../node_modules/moment/locale/ur.js\",\n\t\"./ur.js\": \"../node_modules/moment/locale/ur.js\",\n\t\"./uz\": \"../node_modules/moment/locale/uz.js\",\n\t\"./uz-latn\": \"../node_modules/moment/locale/uz-latn.js\",\n\t\"./uz-latn.js\": \"../node_modules/moment/locale/uz-latn.js\",\n\t\"./uz.js\": \"../node_modules/moment/locale/uz.js\",\n\t\"./vi\": \"../node_modules/moment/locale/vi.js\",\n\t\"./vi.js\": \"../node_modules/moment/locale/vi.js\",\n\t\"./x-pseudo\": \"../node_modules/moment/locale/x-pseudo.js\",\n\t\"./x-pseudo.js\": \"../node_modules/moment/locale/x-pseudo.js\",\n\t\"./yo\": \"../node_modules/moment/locale/yo.js\",\n\t\"./yo.js\": \"../node_modules/moment/locale/yo.js\",\n\t\"./zh-cn\": \"../node_modules/moment/locale/zh-cn.js\",\n\t\"./zh-cn.js\": \"../node_modules/moment/locale/zh-cn.js\",\n\t\"./zh-hk\": \"../node_modules/moment/locale/zh-hk.js\",\n\t\"./zh-hk.js\": \"../node_modules/moment/locale/zh-hk.js\",\n\t\"./zh-mo\": \"../node_modules/moment/locale/zh-mo.js\",\n\t\"./zh-mo.js\": \"../node_modules/moment/locale/zh-mo.js\",\n\t\"./zh-tw\": \"../node_modules/moment/locale/zh-tw.js\",\n\t\"./zh-tw.js\": \"../node_modules/moment/locale/zh-tw.js\"\n};\n\n\nfunction webpackContext(req) {\n\tvar id = webpackContextResolve(req);\n\treturn __webpack_require__(id);\n}\nfunction webpackContextResolve(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t}\n\treturn map[req];\n}\nwebpackContext.keys = function webpackContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackContext.resolve = webpackContextResolve;\nmodule.exports = webpackContext;\nwebpackContext.id = \"../node_modules/moment/locale sync recursive ^\\\\.\\\\/.*$\";","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { BulletRenderer } from './renderer/canvas';\nimport { canDisplayChartTitles } from './selectors/can_display_chart_titles';\nimport { getDebugStateSelector } from './selectors/get_debug_state';\nimport { getTooltipAnchor } from './selectors/get_tooltip_anchor';\nimport { getTooltipInfo } from './selectors/get_tooltip_info';\nimport { isTooltipVisible } from './selectors/is_tooltip_visible';\nimport { ChartType } from '../../chart_types';\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { LegendItem } from '../../common/legend';\nimport { Tooltip } from '../../components/tooltip/tooltip';\nimport { BackwardRef, GlobalChartState, InternalChartState } from '../../state/chart_state';\nimport { InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { LegendItemLabel } from '../../state/selectors/get_legend_items_labels';\n\nconst EMPTY_MAP = new Map();\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\nconst EMPTY_LEGEND_ITEM_LIST: LegendItemLabel[] = [];\n\n/** @internal */\nexport class BulletState implements InternalChartState {\n  chartType = ChartType.Bullet;\n  getChartTypeDescription = () => 'Bullet chart';\n  chartRenderer = (containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) => (\n    <>\n      <BulletRenderer forwardStageRef={forwardStageRef} />\n      <Tooltip getChartContainerRef={containerRef} />\n    </>\n  );\n\n  isInitialized = () => InitStatus.Initialized;\n  isBrushAvailable = () => false;\n  isBrushing = () => false;\n  isChartEmpty = () => false;\n  getLegendItems = () => EMPTY_LEGEND_LIST;\n  getLegendItemsLabels = () => EMPTY_LEGEND_ITEM_LIST;\n  getLegendExtraValues = () => EMPTY_MAP;\n  getPointerCursor = () => DEFAULT_CSS_CURSOR;\n  isTooltipVisible(globalState: GlobalChartState) {\n    return isTooltipVisible(globalState);\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfo(globalState);\n  }\n\n  getTooltipAnchor(globalState: GlobalChartState) {\n    return getTooltipAnchor(globalState);\n  }\n\n  eventCallbacks = () => {};\n  getProjectionContainerArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getMainProjectionArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getBrushArea = () => null;\n  getDebugState = (state: GlobalChartState) => getDebugStateSelector(state);\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles(globalState: GlobalChartState) {\n    return canDisplayChartTitles(globalState);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { angularBullet, horizontalBullet, verticalBullet } from './sub_types';\nimport { Color, Colors } from '../../../../common/colors';\nimport { Ratio } from '../../../../common/geometry';\nimport { cssFontShorthand } from '../../../../common/text_utils';\nimport { withContext, clearCanvas } from '../../../../renderers/canvas';\nimport { A11ySettings } from '../../../../state/selectors/get_accessibility_config';\nimport { renderDebugPoint, renderDebugRect } from '../../../xy_chart/renderer/canvas/utils/debug';\nimport { ActiveValue } from '../../selectors/get_active_values';\nimport { BulletDimensions } from '../../selectors/get_panel_dimensions';\nimport { BulletSpec, BulletSubtype } from '../../spec';\nimport {\n  BulletStyle,\n  FONT_PADDING,\n  HEADER_PADDING,\n  SUBTITLE_FONT,\n  SUBTITLE_FONT_SIZE,\n  TARGET_FONT,\n  TARGET_FONT_SIZE,\n  TITLE_FONT,\n  TITLE_FONT_SIZE,\n  TITLE_LINE_SPACING,\n  VALUE_FONT,\n  VALUE_FONT_SIZE,\n  getMaxTargetValueAssent,\n  getTextAscentHeight,\n} from '../../theme';\n\n/** @internal */\nexport function renderBullet(\n  ctx: CanvasRenderingContext2D,\n  dpr: Ratio,\n  props: {\n    debug: boolean;\n    spec?: BulletSpec;\n    a11y: A11ySettings;\n    dimensions: BulletDimensions;\n    activeValues: (ActiveValue | null)[][];\n    style: BulletStyle;\n    backgroundColor: Color;\n  },\n) {\n  const { debug, style, dimensions, activeValues, spec, backgroundColor } = props;\n  withContext(ctx, (ctx) => {\n    ctx.scale(dpr, dpr);\n    clearCanvas(ctx, backgroundColor);\n\n    // clear only if need to render metric or no spec available\n    if (!spec || dimensions.shouldRenderMetric) {\n      return;\n    }\n\n    // render each Small multiple\n    ctx.fillStyle = backgroundColor;\n\n    // layout.headerLayout.forEach((row, rowIndex) =>\n    dimensions.rows.forEach((row, rowIndex) =>\n      row.forEach((bulletGraph, columnIndex) => {\n        if (!bulletGraph) return;\n        const { panel, multiline } = bulletGraph;\n        withContext(ctx, (ctx) => {\n          const verticalAlignment = dimensions.layoutAlignment[rowIndex]!;\n          const activeValue = activeValues?.[rowIndex]?.[columnIndex];\n\n          if (debug) {\n            renderDebugRect(ctx, panel);\n          }\n\n          // move to panel origin\n          ctx.translate(panel.x, panel.y);\n\n          // paint right border\n          ctx.strokeStyle = style.border;\n          // TODO: check paddings\n          if (row.length > 1 && columnIndex < row.length - 1) {\n            ctx.beginPath();\n            ctx.moveTo(panel.width, 0);\n            ctx.lineTo(panel.width, panel.height);\n            ctx.stroke();\n          }\n\n          if (dimensions.rows.length > 1 && columnIndex < dimensions.rows.length) {\n            ctx.beginPath();\n            ctx.moveTo(0, panel.height);\n            ctx.lineTo(panel.width, panel.height);\n            ctx.stroke();\n          }\n\n          // this helps render the header without considering paddings\n          ctx.translate(HEADER_PADDING.left, HEADER_PADDING.top);\n\n          ctx.textBaseline = 'alphabetic';\n\n          const MAX_TARGET_VALUE_ASCENT = getMaxTargetValueAssent(bulletGraph.target);\n          const commonYBaseline = // to share baseline with value and target\n            Math.max(\n              getTextAscentHeight(TITLE_FONT_SIZE, verticalAlignment.maxTitleRows, TITLE_LINE_SPACING) +\n                (verticalAlignment.maxSubtitleRows > 0 ? FONT_PADDING : 0) +\n                getTextAscentHeight(SUBTITLE_FONT_SIZE, verticalAlignment.maxSubtitleRows),\n              verticalAlignment.multiline ? 0 : MAX_TARGET_VALUE_ASCENT,\n            );\n\n          // Title\n          ctx.fillStyle = props.style.textColor;\n          ctx.textAlign = 'start';\n          ctx.font = cssFontShorthand(TITLE_FONT, TITLE_FONT_SIZE);\n\n          const titleYBaseline =\n            commonYBaseline -\n            getTextAscentHeight(SUBTITLE_FONT_SIZE, verticalAlignment.maxSubtitleRows) -\n            (verticalAlignment.maxSubtitleRows > 0 ? FONT_PADDING : 0);\n\n          bulletGraph.title\n            .slice()\n            .reverse()\n            .forEach((titleLine, lineIndex) => {\n              const y = titleYBaseline - lineIndex * (getTextAscentHeight(TITLE_FONT_SIZE) + TITLE_LINE_SPACING);\n              ctx.fillText(titleLine, 0, y);\n            });\n\n          // Subtitle\n          if (bulletGraph.subtitle) {\n            ctx.font = cssFontShorthand(SUBTITLE_FONT, SUBTITLE_FONT_SIZE);\n            ctx.fillText(bulletGraph.subtitle, 0, commonYBaseline);\n          }\n\n          // Value\n          ctx.font = cssFontShorthand(VALUE_FONT, VALUE_FONT_SIZE);\n          if (!multiline) ctx.textAlign = 'end';\n          {\n            const y = commonYBaseline + (multiline ? MAX_TARGET_VALUE_ASCENT + FONT_PADDING : 0);\n            const x = multiline ? 0 : bulletGraph.header.width - bulletGraph.targetWidth;\n\n            ctx.fillText(bulletGraph.value, x, y);\n          }\n\n          // Target\n          if (bulletGraph.target) {\n            ctx.font = cssFontShorthand(TARGET_FONT, TARGET_FONT_SIZE);\n            if (!multiline) ctx.textAlign = 'end';\n            const x = multiline ? bulletGraph.valueWidth : bulletGraph.header.width;\n            const y = commonYBaseline + (multiline ? MAX_TARGET_VALUE_ASCENT + FONT_PADDING : 0);\n            ctx.fillText(bulletGraph.target, x, y);\n          }\n\n          ctx.translate(-HEADER_PADDING.left, -HEADER_PADDING.top);\n\n          const { graphArea } = bulletGraph;\n\n          if (spec.subtype !== BulletSubtype.horizontal) {\n            ctx.strokeStyle = style.border;\n            ctx.beginPath();\n            ctx.moveTo(HEADER_PADDING.left, graphArea.origin.y);\n            ctx.lineTo(panel.width - HEADER_PADDING.right, graphArea.origin.y);\n            ctx.stroke();\n          }\n\n          withContext(ctx, (ctx) => {\n            ctx.translate(graphArea.origin.x, graphArea.origin.y);\n\n            if (spec.subtype === BulletSubtype.horizontal) {\n              horizontalBullet(ctx, bulletGraph, style, backgroundColor, activeValue);\n            } else if (spec.subtype === BulletSubtype.vertical) {\n              verticalBullet(ctx, bulletGraph, style, backgroundColor, activeValue);\n            } else {\n              angularBullet(ctx, bulletGraph, style, backgroundColor, spec, debug, activeValue);\n            }\n          });\n\n          if (debug) {\n            withContext(ctx, (ctx) => {\n              ctx.translate(graphArea.origin.x, graphArea.origin.y);\n              renderDebugRect(\n                ctx,\n                {\n                  ...graphArea.size,\n                  x: 0,\n                  y: 0,\n                },\n                0,\n                { color: Colors.Transparent.rgba },\n              );\n              renderDebugPoint(ctx, 0, 0);\n              renderDebugPoint(ctx, graphArea.size.width / 2, graphArea.size.height / 2);\n            });\n          }\n        });\n      }),\n    );\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const TARGET_SIZE = 40;\n\n/** @internal */\nexport const TARGET_STROKE_WIDTH = 3;\n\n/** @internal */\nexport const BULLET_SIZE = 32;\n\n/** @internal */\nexport const BAR_SIZE = 12;\n\n/** @internal */\nexport const TICK_WIDTH = 1;\n\n/** @internal */\nexport const MIN_TICK_COUNT = 3;\n\n/** @internal */\nexport const MAX_TICK_COUNT = 8;\n\n/** @internal */\nexport const HOVER_SLOP = 20;\n\n/** @internal */\nexport const TICK_INTERVAL = 100;\n\n/** @internal */\nexport const ANGULAR_TICK_INTERVAL = 120;\n\n/**\n * Space between the target/value line and the tick label\n * @internal\n */\nexport const TICK_LABEL_PADDING = 3;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { renderBullet } from './bullet';\nimport { ColorContrastOptions } from '../../../../common/color_calcs';\nimport { colorToRgba } from '../../../../common/color_library_wrappers';\nimport { Color, Colors } from '../../../../common/colors';\nimport { ScreenReaderSummary } from '../../../../components/accessibility';\nimport { AlignedGrid } from '../../../../components/grid/aligned_grid';\nimport { ElementOverListener, settingsBuildProps } from '../../../../specs';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getResolvedBackgroundColorSelector } from '../../../../state/selectors/get_resolved_background_color';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Size } from '../../../../utils/dimensions';\nimport { deepEqual } from '../../../../utils/fast_deep_equal';\nimport { Point } from '../../../../utils/point';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Metric } from '../../../metric/renderer/dom/metric';\nimport { BulletMetricWProgress, MetricDatum } from '../../../metric/specs';\nimport { ActiveValue, getActiveValues } from '../../selectors/get_active_values';\nimport { getBulletSpec } from '../../selectors/get_bullet_spec';\nimport { getChartSize } from '../../selectors/get_chart_size';\nimport { BulletDimensions, getPanelDimensions } from '../../selectors/get_panel_dimensions';\nimport { hasChartTitles } from '../../selectors/has_chart_titles';\nimport { BulletDatum, BulletSpec, BulletSubtype, mergeValueLabels } from '../../spec';\nimport { BulletStyle, LIGHT_THEME_BULLET_STYLE } from '../../theme';\nimport { BulletColorConfig } from '../../utils/color';\n\ninterface StateProps {\n  initialized: boolean;\n  debug: boolean;\n  chartId: string;\n  hasTitles: boolean;\n  spec?: BulletSpec;\n  a11y: A11ySettings;\n  size: Size;\n  dimensions: BulletDimensions;\n  activeValues: (ActiveValue | null)[][];\n  style: BulletStyle;\n  backgroundColor: Color;\n  locale: string;\n  pointerPosition?: Point;\n  colorBands: BulletColorConfig;\n  contrastOptions: ColorContrastOptions;\n  onElementOver?: ElementOverListener;\n}\n\ninterface DispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface OwnProps {\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype Props = DispatchProps & StateProps & OwnProps;\n\nclass Component extends React.Component<Props> {\n  static displayName = 'Bullet';\n  private ctx: CanvasRenderingContext2D | null;\n  private readonly devicePixelRatio: number;\n\n  constructor(props: Readonly<Props>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n  }\n\n  componentDidMount() {\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  shouldComponentUpdate(nextProps: Props) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      renderBullet(this.ctx, this.devicePixelRatio, this.props);\n    }\n  }\n\n  render() {\n    /* eslint-disable prettier/prettier */\n    // TODO - Prettier is going crazy on this line, need to investigate\n    const {\n      initialized,\n      size,\n      forwardStageRef,\n      a11y,\n      dimensions,\n      spec,\n      style,\n      backgroundColor,\n      locale,\n      contrastOptions,\n    } = this.props;\n    /* eslint-enable prettier/prettier */\n\n    if (!initialized || size.width === 0 || size.height === 0 || !spec) {\n      return null;\n    }\n\n    const valueLabels = mergeValueLabels(spec.valueLabels);\n\n    return (\n      <figure\n        aria-labelledby={a11y.labelId}\n        aria-describedby={a11y.descriptionId}\n        style={{ width: '100%', height: '100%' }}\n      >\n        <canvas\n          ref={forwardStageRef}\n          className=\"echCanvasRenderer\"\n          width={size.width * this.devicePixelRatio}\n          height={size.height * this.devicePixelRatio}\n          style={size}\n          // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n          role=\"presentation\"\n        >\n          <ScreenReaderSummary />\n        </canvas>\n        {dimensions.shouldRenderMetric && (\n          <div className=\"echBulletAsMetric\" style={{ width: '100%', height: '100%' }}>\n            <AlignedGrid<BulletDatum>\n              data={spec.data}\n              contentComponent={({ datum, stats }) => {\n                const colorScale =\n                  this.props.dimensions.rows[stats.rowIndex]?.[stats.columnIndex]?.colorScale ??\n                  (() => ({ hex: () => this.props.style.fallbackBandColor })); // should never happen\n                const bulletDatum: BulletMetricWProgress = {\n                  value: datum.value,\n                  target: datum.target,\n                  valueFormatter: datum.valueFormatter,\n                  targetFormatter: datum.targetFormatter,\n                  color: style.barBackground,\n                  progressBarDirection: spec.subtype === BulletSubtype.vertical ? 'vertical' : 'horizontal',\n                  title: datum.title,\n                  subtitle: datum.subtitle,\n                  domain: datum.domain,\n                  niceDomain: datum.niceDomain,\n                  valueLabels,\n                  extra: datum.target ? (\n                    <span>\n                      {valueLabels.target}:{' '}\n                      <strong>{(datum.targetFormatter ?? datum.valueFormatter)(datum.target)}</strong>\n                    </span>\n                  ) : undefined,\n                };\n\n                return (\n                  <Metric\n                    chartId=\"XX\"\n                    datum={bulletDatum as MetricDatum} // forcing internal type use\n                    hasTitles={this.props.hasTitles}\n                    totalRows={stats.rows}\n                    totalColumns={stats.columns}\n                    columnIndex={stats.columnIndex}\n                    rowIndex={stats.rowIndex}\n                    style={{\n                      barBackground: colorScale(datum.value).hex(),\n                      emptyBackground: Colors.Transparent.keyword,\n                      border: 'gray',\n                      minHeight: 0,\n                      text: {\n                        lightColor: 'white',\n                        darkColor: 'black',\n                      },\n                      nonFiniteText: 'N/A',\n                    }}\n                    locale={locale}\n                    backgroundColor={backgroundColor}\n                    contrastOptions={contrastOptions}\n                    panel={{ width: size.width / stats.columns, height: size.height / stats.rows }}\n                  />\n                );\n              }}\n            />\n            );\n          </div>\n        )}\n      </figure>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: StateProps = {\n  initialized: false,\n  debug: false,\n  chartId: '',\n  spec: undefined,\n  hasTitles: false,\n  size: {\n    width: 0,\n    height: 0,\n  },\n  a11y: DEFAULT_A11Y_SETTINGS,\n  dimensions: {\n    rows: [],\n    panel: { height: 0, width: 0 },\n    layoutAlignment: [],\n    shouldRenderMetric: false,\n  },\n  activeValues: [],\n  style: LIGHT_THEME_BULLET_STYLE,\n  backgroundColor: LIGHT_THEME.background.color,\n  locale: settingsBuildProps.defaults.locale,\n  colorBands: LIGHT_THEME.bulletGraph.colorBands,\n  contrastOptions: {},\n};\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  const { bulletGraph: style, metric: metricStyle } = getChartThemeSelector(state);\n\n  const { debug, onElementOver, locale } = getSettingsSpecSelector(state);\n\n  return {\n    initialized: true,\n    debug,\n    chartId: state.chartId,\n    hasTitles: hasChartTitles(state),\n    spec: getBulletSpec(state),\n    size: getChartSize(state),\n    a11y: getA11ySettingsSelector(state),\n    dimensions: getPanelDimensions(state),\n    activeValues: getActiveValues(state),\n    style,\n    locale,\n    backgroundColor: getResolvedBackgroundColorSelector(state),\n    colorBands: style.colorBands,\n    onElementOver,\n    contrastOptions: {\n      lightColor: colorToRgba(metricStyle.text.lightColor),\n      darkColor: colorToRgba(metricStyle.text.darkColor),\n    },\n  };\n};\n\n/** @internal */\nexport const BulletRenderer = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../../../common/colors';\nimport { cssFontShorthand } from '../../../../../common/text_utils';\nimport { measureText } from '../../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { clamp, isBetween, isFiniteNumber, sortNumbers } from '../../../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../../../utils/domain';\nimport { drawPolarLine } from '../../../../xy_chart/renderer/canvas/lines';\nimport { renderDebugPoint } from '../../../../xy_chart/renderer/canvas/utils/debug';\nimport { ActiveValue } from '../../../selectors/get_active_values';\nimport { BulletPanelDimensions } from '../../../selectors/get_panel_dimensions';\nimport { BulletSpec } from '../../../spec';\nimport { BulletStyle, GRAPH_PADDING, TICK_FONT, TICK_FONT_SIZE } from '../../../theme';\nimport { getAngledChartSizing } from '../../../utils/angular';\nimport { TARGET_SIZE, BULLET_SIZE, TICK_WIDTH, BAR_SIZE, TARGET_STROKE_WIDTH } from '../constants';\n\n/** @internal */\nexport function angularBullet(\n  ctx: CanvasRenderingContext2D,\n  dimensions: BulletPanelDimensions,\n  style: BulletStyle,\n  backgroundColor: Color,\n  spec: BulletSpec,\n  debug: boolean,\n  activeValue?: ActiveValue | null,\n) {\n  const { datum, graphArea, scale, ticks, colorBands } = dimensions;\n  const { radius } = getAngledChartSizing(graphArea.size, spec.subtype);\n  const [startAngle, endAngle] = scale.range() as [number, number];\n  const center = {\n    x: graphArea.center.x,\n    y: radius + TARGET_SIZE / 2,\n  };\n\n  ctx.translate(GRAPH_PADDING.left, GRAPH_PADDING.top);\n\n  const [start, end] = scale.domain() as GenericDomain;\n  // const counterClockwise = true;\n  const counterClockwise = startAngle < endAngle && start > end;\n  const [min, max] = sortNumbers([start, end]) as ContinuousDomain;\n  const formatterColorTicks = ticks.map((v) => ({ value: v, formattedValue: datum.tickFormatter(v) }));\n\n  // Color bands\n  colorBands.forEach((band) => {\n    ctx.beginPath();\n    ctx.arc(center.x, center.y, radius, band.start, band.end, false);\n    ctx.lineWidth = BULLET_SIZE;\n    ctx.strokeStyle = band.color;\n    ctx.stroke();\n  });\n\n  // Ticks\n  ctx.beginPath();\n  ctx.strokeStyle = backgroundColor;\n  ctx.lineWidth = TICK_WIDTH;\n  formatterColorTicks\n    .filter((tick) => tick.value > min && tick.value < max)\n    .forEach((tick) => {\n      const bulletWidth = BULLET_SIZE + 4; // TODO fix arbitrary extension\n      drawPolarLine(ctx, scale(tick.value), radius, bulletWidth, center);\n    });\n\n  ctx.stroke();\n\n  // Bar\n  const confinedValue = clamp(datum.value, min, max);\n  const adjustedZero = clamp(0, min, max);\n  ctx.beginPath();\n  ctx.lineWidth = BAR_SIZE;\n  ctx.strokeStyle = style.barBackground;\n  ctx.arc(\n    center.x,\n    center.y,\n    radius,\n    confinedValue > 0 ? scale(adjustedZero) : scale(confinedValue),\n    confinedValue > 0 ? scale(confinedValue) : scale(adjustedZero),\n    counterClockwise,\n  );\n  ctx.stroke();\n\n  // Target\n  if (isFiniteNumber(datum.target) && datum.target <= max && datum.target >= min) {\n    ctx.beginPath();\n    ctx.strokeStyle = style.barBackground;\n    ctx.lineWidth = TARGET_STROKE_WIDTH;\n\n    drawPolarLine(ctx, scale(datum.target), radius, TARGET_SIZE, center);\n\n    ctx.stroke();\n  }\n\n  // Zero baseline\n  if (isBetween(min, max, true)(0)) {\n    ctx.beginPath();\n    ctx.strokeStyle = style.barBackground;\n    ctx.lineWidth = TICK_WIDTH;\n\n    drawPolarLine(ctx, scale(0), radius, BULLET_SIZE, center);\n\n    ctx.stroke();\n  }\n\n  const measure = measureText(ctx);\n  // Assumes mostly homogenous formatting\n  const maxTickWidth = formatterColorTicks.reduce((acc, t) => {\n    const { width } = measure(t.formattedValue, TICK_FONT, TICK_FONT_SIZE);\n    return Math.max(acc, width);\n  }, 0);\n\n  // Tick labels\n  ctx.fillStyle = style.textColor;\n  ctx.textBaseline = 'middle';\n  ctx.font = cssFontShorthand(TICK_FONT, TICK_FONT_SIZE);\n  formatterColorTicks\n    .filter((tick) => tick.value >= min && tick.value <= max)\n    .forEach((tick) => {\n      ctx.textAlign = 'center';\n      const textPadding = style.angularTickLabelPadding + maxTickWidth / 2;\n      const start = scale(tick.value);\n      const y1 = Math.sin(start) * (radius - BULLET_SIZE / 2 - textPadding);\n      const x1 = Math.cos(start) * (radius - BULLET_SIZE / 2 - textPadding);\n\n      ctx.fillText(tick.formattedValue, center.x + x1, center.y + y1);\n    });\n\n  if (activeValue) {\n    ctx.beginPath();\n    ctx.strokeStyle = style.barBackground;\n    ctx.lineWidth = TARGET_STROKE_WIDTH;\n    drawPolarLine(ctx, activeValue.value, radius, TARGET_SIZE, center);\n\n    ctx.stroke();\n  }\n\n  ctx.beginPath();\n\n  if (debug) {\n    renderDebugPoint(ctx, center.x, center.y); // arch center\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../../../common/colors';\nimport { cssFontShorthand } from '../../../../../common/text_utils';\nimport { measureText } from '../../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { clamp, isBetween, isFiniteNumber, sortNumbers } from '../../../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../../../utils/domain';\nimport { ActiveValue } from '../../../selectors/get_active_values';\nimport { BulletPanelDimensions } from '../../../selectors/get_panel_dimensions';\nimport { BulletStyle, GRAPH_PADDING, TICK_FONT, TICK_FONT_SIZE } from '../../../theme';\nimport { TARGET_SIZE, BULLET_SIZE, TICK_WIDTH, BAR_SIZE, TARGET_STROKE_WIDTH, TICK_LABEL_PADDING } from '../constants';\n\n/** @internal */\nexport function horizontalBullet(\n  ctx: CanvasRenderingContext2D,\n  dimensions: BulletPanelDimensions,\n  style: BulletStyle,\n  backgroundColor: Color,\n  activeValue?: ActiveValue | null,\n) {\n  ctx.translate(GRAPH_PADDING.left, 0);\n\n  const { datum, colorBands, ticks, scale } = dimensions;\n  const [start, end] = scale.domain() as GenericDomain;\n  const [min, max] = sortNumbers([start, end]) as ContinuousDomain;\n\n  // Color bands\n  const verticalAlignment = TARGET_SIZE / 2;\n  colorBands.forEach((band) => {\n    ctx.fillStyle = band.color;\n    ctx.fillRect(band.start, verticalAlignment - BULLET_SIZE / 2, band.size, BULLET_SIZE);\n  });\n\n  // Ticks\n  ctx.beginPath();\n  ctx.strokeStyle = backgroundColor;\n  ctx.lineWidth = TICK_WIDTH;\n  ticks\n    .filter((tick) => tick > min && tick < max)\n    .forEach((tick) => {\n      ctx.moveTo(scale(tick), verticalAlignment - BULLET_SIZE / 2);\n      ctx.lineTo(scale(tick), verticalAlignment + BULLET_SIZE / 2);\n    });\n  ctx.stroke();\n\n  // Bar\n  const confinedValue = clamp(datum.value, min, max);\n  const adjustedZero = clamp(0, min, max);\n  ctx.fillStyle = style.barBackground;\n  ctx.fillRect(\n    datum.value > 0 ? scale(adjustedZero) : scale(confinedValue),\n    verticalAlignment - BAR_SIZE / 2,\n    confinedValue > 0 ? scale(confinedValue) - scale(adjustedZero) : scale(adjustedZero) - scale(confinedValue),\n    BAR_SIZE,\n  );\n\n  // Target\n  if (isFiniteNumber(datum.target) && datum.target <= max && datum.target >= min) {\n    ctx.fillRect(\n      scale(datum.target) - TARGET_STROKE_WIDTH / 2,\n      verticalAlignment - TARGET_SIZE / 2,\n      TARGET_STROKE_WIDTH,\n      TARGET_SIZE,\n    );\n  }\n\n  // Zero baseline\n  if (isBetween(min, max, true)(0)) {\n    ctx.fillRect(scale(0) - TICK_WIDTH / 2, verticalAlignment - BULLET_SIZE / 2, TICK_WIDTH, BULLET_SIZE);\n  }\n\n  // Active Value\n  if (activeValue && (datum.syncCursor || !activeValue.external)) {\n    ctx.fillRect(\n      activeValue.value - TARGET_STROKE_WIDTH / 2,\n      verticalAlignment - TARGET_SIZE / 2,\n      TARGET_STROKE_WIDTH,\n      TARGET_SIZE,\n    );\n  }\n\n  // Tick labels\n  ctx.fillStyle = style.textColor;\n  ctx.textBaseline = 'top';\n  ctx.font = cssFontShorthand(TICK_FONT, TICK_FONT_SIZE);\n  ticks\n    .filter((tick) => tick >= min && tick <= max)\n    .forEach((tick, i) => {\n      const labelText = datum.tickFormatter(tick);\n      if (i === ticks.length - 1) {\n        const availableWidth = Math.abs((start > end ? min : max) - (ticks.at(i) ?? NaN));\n        const { width: labelWidth } = measureText(ctx)(labelText, TICK_FONT, TICK_FONT_SIZE);\n        ctx.textAlign = labelWidth >= Math.abs(scale(availableWidth) - scale(0)) ? 'end' : 'start';\n      } else {\n        ctx.textAlign = 'start';\n      }\n      ctx.fillText(labelText, scale(tick), verticalAlignment + TARGET_SIZE / 2 + TICK_LABEL_PADDING);\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './horizontal';\nexport * from './vertical';\nexport * from './angular';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../../../common/colors';\nimport { cssFontShorthand } from '../../../../../common/text_utils';\nimport { clamp, isBetween, isFiniteNumber, sortNumbers } from '../../../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../../../utils/domain';\nimport { ActiveValue } from '../../../selectors/get_active_values';\nimport { BulletPanelDimensions } from '../../../selectors/get_panel_dimensions';\nimport { BulletStyle, GRAPH_PADDING, TICK_FONT, TICK_FONT_SIZE } from '../../../theme';\nimport { TARGET_SIZE, BULLET_SIZE, TICK_WIDTH, BAR_SIZE, TARGET_STROKE_WIDTH, TICK_LABEL_PADDING } from '../constants';\n\n/** @internal */\nexport function verticalBullet(\n  ctx: CanvasRenderingContext2D,\n  dimensions: BulletPanelDimensions,\n  style: BulletStyle,\n  backgroundColor: Color,\n  activeValue?: ActiveValue | null,\n) {\n  ctx.translate(0, GRAPH_PADDING.top);\n\n  const { datum, graphArea, scale, colorBands, ticks } = dimensions;\n  const [start, end] = scale.domain() as GenericDomain;\n  const [min, max] = sortNumbers([start, end]) as ContinuousDomain;\n  const graphPaddedHeight = graphArea.size.height - GRAPH_PADDING.bottom - GRAPH_PADDING.top;\n\n  // color bands\n  colorBands.reverse().forEach((band) => {\n    ctx.fillStyle = band.color;\n    ctx.fillRect(\n      graphArea.size.width / 2 - BULLET_SIZE / 2,\n      graphPaddedHeight - band.start - band.size,\n      BULLET_SIZE,\n      band.size,\n    );\n  });\n\n  // Ticks\n  ctx.beginPath();\n  ctx.strokeStyle = backgroundColor;\n  ctx.lineWidth = TICK_WIDTH;\n\n  ticks\n    .filter((tick) => tick > min && tick < max)\n    .forEach((tick) => {\n      ctx.moveTo(graphArea.size.width / 2 - BULLET_SIZE / 2, graphPaddedHeight - scale(tick));\n      ctx.lineTo(graphArea.size.width / 2 + BULLET_SIZE / 2, graphPaddedHeight - scale(tick));\n    });\n  ctx.stroke();\n\n  // Bar\n  const confinedValue = clamp(datum.value, min, max);\n  const adjustedZero = clamp(0, min, max);\n  ctx.fillStyle = style.barBackground;\n  ctx.fillRect(\n    graphArea.size.width / 2 - BAR_SIZE / 2,\n    confinedValue > 0 ? graphPaddedHeight - scale(confinedValue) : graphPaddedHeight - scale(adjustedZero),\n    BAR_SIZE,\n    confinedValue > 0 ? scale(confinedValue) - scale(adjustedZero) : scale(adjustedZero) - scale(confinedValue),\n  );\n\n  // Target\n  if (isFiniteNumber(datum.target) && datum.target <= max && datum.target >= min) {\n    ctx.fillRect(\n      graphArea.size.width / 2 - TARGET_SIZE / 2,\n      graphPaddedHeight - scale(datum.target) - TARGET_STROKE_WIDTH / 2,\n      TARGET_SIZE,\n      TARGET_STROKE_WIDTH,\n    );\n  }\n\n  // Zero baseline\n  if (isBetween(min, max, true)(0)) {\n    ctx.fillRect(\n      graphArea.size.width / 2 - BULLET_SIZE / 2,\n      graphPaddedHeight - scale(0) - TICK_WIDTH / 2,\n      BULLET_SIZE,\n      TICK_WIDTH,\n    );\n  }\n\n  // Active Value\n  if (activeValue && (datum.syncCursor || !activeValue.external)) {\n    ctx.fillRect(\n      graphArea.size.width / 2 - TARGET_SIZE / 2,\n      graphPaddedHeight - activeValue.value - TARGET_STROKE_WIDTH / 2,\n      TARGET_SIZE,\n      TARGET_STROKE_WIDTH,\n    );\n  }\n\n  // Tick labels\n  ctx.textBaseline = 'top';\n  ctx.fillStyle = style.textColor;\n  ctx.font = cssFontShorthand(TICK_FONT, TICK_FONT_SIZE);\n  ticks\n    .filter((tick) => tick >= min && tick <= max)\n    .forEach((tick, i) => {\n      ctx.textAlign = 'end';\n\n      const labelText = datum.tickFormatter(tick);\n      if (i === ticks.length - 1) {\n        const availableHeight = Math.abs((start > end ? min : max) - (ticks.at(i) ?? NaN));\n        const labelHeight = TICK_FONT_SIZE;\n        ctx.textBaseline = labelHeight >= Math.abs(scale(availableHeight) - scale(0)) ? 'hanging' : 'bottom';\n      } else {\n        ctx.textBaseline = 'bottom';\n      }\n\n      ctx.fillText(\n        labelText,\n        graphArea.size.width / 2 - TARGET_SIZE / 2 - TICK_LABEL_PADDING,\n        graphPaddedHeight - scale(tick),\n      );\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getBulletSpec } from './get_bullet_spec';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\n\n/** @internal */\nexport const canDisplayChartTitles = createCustomCachedSelector([getBulletSpec], (spec): boolean => {\n  return (spec?.data?.length ?? 0) > 1 || (spec?.data?.[0]?.length ?? 0) > 1;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getBulletSpec } from './get_bullet_spec';\nimport { BulletPanelDimensions, getPanelDimensions } from './get_panel_dimensions';\nimport { TAU } from '../../../common/constants';\nimport { Radian } from '../../../common/geometry';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../state/selectors/get_active_pointer_position';\nimport { isBetween, isFiniteNumber, roundTo, sortNumbers } from '../../../utils/common';\nimport { ContinuousDomain, Range } from '../../../utils/domain';\nimport { Point } from '../../../utils/point';\nimport { BULLET_SIZE, HOVER_SLOP, TARGET_SIZE } from '../renderer/canvas/constants';\nimport { BulletSpec, BulletSubtype } from '../spec';\nimport { GRAPH_PADDING } from '../theme';\nimport { getAngledChartSizing } from '../utils/angular';\n\n/** @internal */\nexport interface ActiveValueDetails {\n  value: number;\n  snapValue: number;\n  color: string;\n  pixelValue: number;\n  rowIndex: number;\n  columnIndex: number;\n  panel: BulletPanelDimensions;\n}\n\n/** @internal */\nexport const getActiveValue = createCustomCachedSelector(\n  [getActivePointerPosition, getPanelDimensions, getBulletSpec],\n  (pointer, dimensions, spec): ActiveValueDetails | null => {\n    if (!pointer) return null;\n    const { x, y } = pointer;\n\n    const rowIndex = Math.ceil(y / dimensions.panel.height) - 1;\n    const columnIndex = Math.ceil(x / dimensions.panel.width) - 1;\n    const activePanel = dimensions.rows?.[rowIndex]?.[columnIndex];\n\n    if (!activePanel) return null;\n\n    const relativePointer = {\n      x: x - activePanel.panel.x,\n      y: y - activePanel.panel.y,\n    };\n\n    const valueDetails = getPanelValue(activePanel, relativePointer, spec);\n\n    if (!valueDetails || !isFiniteNumber(valueDetails.value)) return null;\n\n    return {\n      ...valueDetails,\n      rowIndex,\n      columnIndex,\n      panel: activePanel,\n    };\n  },\n);\n\nfunction getPanelValue(\n  panel: BulletPanelDimensions,\n  pointer: Point,\n  spec: BulletSpec,\n): Pick<ActiveValueDetails, 'value' | 'snapValue' | 'color' | 'pixelValue'> | undefined {\n  const { graphArea, scale } = panel;\n  const [min, max] = sortNumbers(scale.domain()) as ContinuousDomain;\n  const isWithinDomain = isBetween(min, max);\n\n  switch (spec.subtype) {\n    case BulletSubtype.circle:\n    case BulletSubtype.halfCircle:\n    case BulletSubtype.twoThirdsCircle: {\n      const { radius } = getAngledChartSizing(graphArea.size, spec.subtype);\n      const center = {\n        x: graphArea.center.x,\n        y: radius + TARGET_SIZE / 2,\n      };\n      const { x, y } = pointer;\n      const normalizedPointer = {\n        x: x - center.x - graphArea.origin.x - GRAPH_PADDING.left,\n        y: y - center.y - graphArea.origin.y - GRAPH_PADDING.top,\n      };\n\n      const distance = Math.sqrt(Math.pow(normalizedPointer.x, 2) + Math.pow(normalizedPointer.y, 2));\n      const outerLimit = radius + BULLET_SIZE / 2 + HOVER_SLOP;\n      const innerLimit = radius - BULLET_SIZE / 2 - HOVER_SLOP;\n\n      if (distance <= outerLimit && distance >= innerLimit) {\n        // TODO find why to determine angle between origin and point\n        // The angle goes from -π in Quadrant 2 to +π in Quadrant 3\n        // This angle offset is a temporary fix\n        const angleOffset = normalizedPointer.x < 0 && normalizedPointer.y > 0 ? -TAU : 0;\n        const angle: Radian = Math.atan2(normalizedPointer.y, normalizedPointer.x) + angleOffset;\n        const value = scale.invert(angle);\n        const snapValue = spec.tickSnapStep ? roundTo(value, spec.tickSnapStep) : value;\n\n        if (isWithinDomain(snapValue)) {\n          return {\n            value,\n            snapValue,\n            color: panel.colorScale(snapValue).hex(),\n            pixelValue: angle,\n          };\n        }\n      }\n      break;\n    }\n\n    case BulletSubtype.horizontal: {\n      const yCenterOffset = Math.abs(pointer.y - graphArea.origin.y - TARGET_SIZE / 2);\n\n      if (yCenterOffset > TARGET_SIZE / 2 + HOVER_SLOP) return;\n\n      const relativeX = pointer.x - GRAPH_PADDING.left;\n      const [min, max] = scale.range() as Range;\n\n      if (relativeX < min || relativeX > max) break;\n\n      const value = panel.scale.invert(relativeX);\n      const snapValue = spec.tickSnapStep ? roundTo(value, spec.tickSnapStep) : value;\n\n      if (isWithinDomain(snapValue)) {\n        return {\n          value,\n          snapValue,\n          color: panel.colorScale(snapValue).hex(),\n          pixelValue: relativeX,\n        };\n      }\n\n      break;\n    }\n\n    case BulletSubtype.vertical: {\n      const xCenterOffset = Math.abs(pointer.x - graphArea.center.x - GRAPH_PADDING.left);\n\n      if (xCenterOffset > TARGET_SIZE / 2 + HOVER_SLOP) return;\n\n      const relativeY = panel.panel.height - pointer.y - GRAPH_PADDING.bottom;\n      const [min, max] = scale.range() as Range;\n\n      if (relativeY < min || relativeY > max) break;\n\n      const value = panel.scale.invert(relativeY);\n      const snapValue = spec.tickSnapStep ? roundTo(value, spec.tickSnapStep) : value;\n\n      if (isWithinDomain(snapValue)) {\n        return {\n          value,\n          snapValue,\n          color: panel.colorScale(snapValue).hex(),\n          pixelValue: relativeY,\n        };\n      }\n      break;\n    }\n\n    default:\n      return;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActiveValue } from './get_active_value';\nimport { getPanelDimensions } from './get_panel_dimensions';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { sortNumbers } from '../../../utils/common';\nimport { ContinuousDomain } from '../../../utils/domain';\n\n/** @internal */\nexport interface ActiveValue {\n  value: number;\n  external: boolean;\n}\n\n/** @internal */\nexport const getActiveValues = createCustomCachedSelector(\n  [getActiveValue, getPanelDimensions],\n  (activeValue, dimensions): (ActiveValue | null)[][] => {\n    if (!activeValue) return [];\n\n    // Synced cursor values should always use the snapValue to avoid strange diffs\n    const { snapValue, rowIndex, columnIndex } = activeValue;\n\n    return dimensions.rows.map((row, ri) =>\n      row.map((panel, ci): ActiveValue | null => {\n        const external = !(rowIndex === ri && columnIndex === ci);\n        if (!panel || (!panel.datum.syncCursor && external)) return null;\n        const [min, max] = sortNumbers(panel.scale.domain()) as ContinuousDomain;\n        if (snapValue > max || snapValue < min) return null;\n\n        return {\n          value: panel.scale(snapValue),\n          external,\n        };\n      }),\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../../chart_types';\nimport { BulletSpec } from '../../../chart_types/bullet_graph/spec';\nimport { SpecType } from '../../../specs';\nimport { GlobalChartState } from '../../../state/chart_state';\nimport { getSpecFromStore } from '../../../state/utils';\n\n/** @internal */\n\nexport function getBulletSpec(state: GlobalChartState): BulletSpec {\n  return getSpecFromStore<BulletSpec, true>(state.specs, ChartType.Bullet, SpecType.Series, true);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { Dimensions } from '../../../utils/dimensions';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const getChartSize = createCustomCachedSelector([getParentDimension], (container): Dimensions => {\n  return { ...container };\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActiveValue } from './get_active_value';\nimport { getBulletSpec } from './get_bullet_spec';\nimport { getPanelDimensions } from './get_panel_dimensions';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { BulletDebugStateRow, DebugState } from '../../../state/types';\n\n/** @internal */\nexport const getDebugStateSelector = createCustomCachedSelector(\n  [getPanelDimensions, getActiveValue, getBulletSpec],\n  (dimensions, activeValue, spec): DebugState => {\n    return {\n      bullet: {\n        rows: dimensions.rows.map((row) => {\n          return row.map((d): BulletDebugStateRow | null => {\n            if (!d) return d;\n\n            const { datum, colorBands, ticks, domain } = d;\n            const { title, subtitle, target, value } = datum;\n            return {\n              title,\n              subtitle,\n              target,\n              value,\n              subtype: spec.subtype,\n              colorBands: colorBands.map((b) => b.color),\n              ticks,\n              domain,\n            };\n          });\n        }),\n        activeValue: activeValue?.value,\n      },\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getBulletSpec } from './get_bullet_spec';\nimport { getChartSize } from './get_chart_size';\nimport { BulletDatum, BulletSubtype } from '../../../chart_types/bullet_graph/spec';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../state/selectors/get_settings_spec';\nimport { withTextMeasure } from '../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Size } from '../../../utils/dimensions';\nimport { wrapText } from '../../../utils/text/wrap';\nimport {\n  FONT_PADDING,\n  HEADER_PADDING,\n  SUBTITLE_FONT,\n  SUBTITLE_FONT_SIZE,\n  TARGET_FONT,\n  TARGET_FONT_SIZE,\n  TITLE_FONT,\n  TITLE_FONT_SIZE,\n  TITLE_LINE_SPACING,\n  VALUE_FONT,\n  VALUE_FONT_SIZE,\n  getMaxTargetValueAssent,\n  getTextAscentHeight,\n} from '../theme';\n\n/** @internal */\nexport interface BulletHeaderLayout {\n  panel: Size;\n  header: Size;\n  title: string[];\n  subtitle: string | undefined;\n  value: string;\n  target: string;\n  multiline: boolean;\n  valueWidth: number;\n  targetWidth: number;\n  sizes: { title: number; subtitle: number; value: number; target: number };\n  datum: BulletDatum;\n}\n\n/** @internal */\nexport interface BulletLayoutAlignment {\n  maxTitleRows: number;\n  maxSubtitleRows: number;\n  multiline: boolean;\n  headerHeight: number;\n  minHeight: number;\n  minWidth: number;\n}\n\n/** @internal */\nexport interface BulletLayout {\n  /** Common panel size */\n  panel: Size;\n  headerLayout: (BulletHeaderLayout | null)[][];\n  layoutAlignment: BulletLayoutAlignment[];\n  shouldRenderMetric: boolean;\n}\n\nconst minChartHeights: Record<BulletSubtype, number> = {\n  [BulletSubtype.horizontal]: 50,\n  [BulletSubtype.vertical]: 100,\n  [BulletSubtype.circle]: 160,\n  [BulletSubtype.halfCircle]: 160,\n  [BulletSubtype.twoThirdsCircle]: 160,\n};\n\nconst minChartWidths: Record<BulletSubtype, number> = {\n  [BulletSubtype.horizontal]: 140,\n  [BulletSubtype.vertical]: 140,\n  [BulletSubtype.circle]: 160,\n  [BulletSubtype.halfCircle]: 160,\n  [BulletSubtype.twoThirdsCircle]: 160,\n};\n\n/** @internal */\nexport const getLayout = createCustomCachedSelector(\n  [getBulletSpec, getChartSize, getSettingsSpecSelector],\n  (spec, chartSize, { locale }): BulletLayout => {\n    const { data } = spec;\n    const rows = data.length;\n    const columns = data.reduce((acc, row) => {\n      return Math.max(acc, row.length);\n    }, 0);\n\n    const panel: Size = { width: chartSize.width / columns, height: chartSize.height / rows };\n    const headerSize: Size = {\n      width: panel.width - HEADER_PADDING.left - HEADER_PADDING.right,\n      height: panel.height - HEADER_PADDING.top - HEADER_PADDING.bottom,\n    };\n\n    return withTextMeasure((textMeasurer) => {\n      // collect header elements title, subtitles and values\n      const header = data.map((row) =>\n        row.map((cell) => {\n          if (!cell) return null;\n\n          const content = {\n            title: cell.title.trim(),\n            subtitle: cell.subtitle?.trim(),\n            value: `${cell.valueFormatter(cell.value)}${cell.target ? ' ' : ''}`,\n            target: cell.target ? `/ ${(cell.targetFormatter ?? cell.valueFormatter)(cell.target)}` : '',\n            datum: cell,\n          };\n          const widths = {\n            title: textMeasurer(content.title.trim(), TITLE_FONT, TITLE_FONT_SIZE).width,\n            subtitle: content.subtitle ? textMeasurer(content.subtitle, TITLE_FONT, TITLE_FONT_SIZE).width : 0,\n            value: textMeasurer(content.value, VALUE_FONT, VALUE_FONT_SIZE).width,\n            target: textMeasurer(content.target, TARGET_FONT, TARGET_FONT_SIZE).width,\n          };\n          return { content, widths };\n        }),\n      );\n\n      const valueIsBelowTitles = header.some((row) => {\n        return row.some((cell) => {\n          if (!cell) return false;\n          const valuesWidth = cell.widths.value + cell.widths.target;\n          const availableWidth = 0.95 * (headerSize.width - valuesWidth);\n\n          if (\n            availableWidth < 0.5 * headerSize.width &&\n            (cell.widths.title > availableWidth || cell.widths.subtitle > availableWidth)\n          ) {\n            return true;\n          }\n\n          const titleTruncated = wrapText(\n            cell.content.title,\n            TITLE_FONT,\n            TITLE_FONT_SIZE,\n            availableWidth,\n            2,\n            textMeasurer,\n            locale,\n          ).meta.truncated;\n          const subtitleTruncated = cell.content.subtitle\n            ? wrapText(\n                cell.content.subtitle,\n                SUBTITLE_FONT,\n                SUBTITLE_FONT_SIZE,\n                availableWidth,\n                1,\n                textMeasurer,\n                locale,\n              ).meta.truncated\n            : false;\n\n          return titleTruncated || subtitleTruncated;\n        });\n      });\n\n      const headerLayout = header.map((row) => {\n        return row.map((cell) => {\n          if (!cell) return null;\n\n          const valuesWidth = cell.widths.value + cell.widths.target;\n          const availableWidth = 0.95 * (headerSize.width - valuesWidth);\n\n          if (valueIsBelowTitles) {\n            return {\n              panel,\n              header: headerSize,\n              // wrap only title if necessary\n              title: wrapText(\n                cell.content.title,\n                TITLE_FONT,\n                TITLE_FONT_SIZE,\n                headerSize.width,\n                2,\n                textMeasurer,\n                locale,\n              ),\n              subtitle: cell.content.subtitle\n                ? wrapText(\n                    cell.content.subtitle,\n                    SUBTITLE_FONT,\n                    SUBTITLE_FONT_SIZE,\n                    headerSize.width,\n                    1,\n                    textMeasurer,\n                    locale,\n                  )[0]\n                : undefined,\n              value: cell.content.value,\n              target: cell.content.target,\n              multiline: true,\n              valueWidth: cell.widths.value,\n              targetWidth: cell.widths.target,\n              sizes: cell.widths,\n              datum: cell.content.datum,\n            };\n          }\n\n          return {\n            panel,\n            header: headerSize,\n            title: wrapText(cell.content.title, TITLE_FONT, TITLE_FONT_SIZE, availableWidth, 2, textMeasurer, locale),\n            subtitle: cell.content.subtitle\n              ? wrapText(\n                  cell.content.subtitle,\n                  SUBTITLE_FONT,\n                  SUBTITLE_FONT_SIZE,\n                  availableWidth,\n                  1,\n                  textMeasurer,\n                  locale,\n                )[0]\n              : undefined,\n            value: cell.content.value,\n            target: cell.content.target,\n            multiline: false,\n            valueWidth: cell.widths.value,\n            targetWidth: cell.widths.target,\n            sizes: cell.widths,\n            datum: cell.content.datum,\n          };\n        });\n      });\n      const layoutAlignment = headerLayout.map((curr) => {\n        return curr.reduce<BulletLayoutAlignment>(\n          (rowStats, cell) => {\n            const MAX_TARGET_VALUE_ASCENT = getMaxTargetValueAssent(cell?.target);\n            const multiline = cell?.multiline ?? false;\n            const maxTitleRows = Math.max(rowStats.maxTitleRows, cell?.title.length ?? 0);\n            const maxSubtitleRows = Math.max(rowStats.maxSubtitleRows, cell?.subtitle ? 1 : 0);\n            const leftHeaderHeight =\n              getTextAscentHeight(TITLE_FONT_SIZE, maxTitleRows, TITLE_LINE_SPACING) +\n              (maxSubtitleRows > 0 ? FONT_PADDING : 0) +\n              getTextAscentHeight(SUBTITLE_FONT_SIZE, maxSubtitleRows) +\n              (cell?.multiline ? MAX_TARGET_VALUE_ASCENT + FONT_PADDING : 0);\n            const rightHeaderHeight = cell?.multiline ? 0 : MAX_TARGET_VALUE_ASCENT;\n            const headerHeight =\n              Math.max(leftHeaderHeight, rightHeaderHeight) + HEADER_PADDING.top + HEADER_PADDING.bottom;\n\n            return {\n              multiline,\n              maxTitleRows,\n              maxSubtitleRows,\n              headerHeight,\n              minHeight: headerHeight + minChartHeights[spec.subtype],\n              minWidth: minChartWidths[spec.subtype],\n            };\n          },\n          { maxTitleRows: 0, maxSubtitleRows: 0, multiline: false, headerHeight: 0, minHeight: 0, minWidth: 0 },\n        );\n      });\n\n      const totalHeight = layoutAlignment.reduce((acc, curr) => {\n        return acc + curr.minHeight;\n      }, 0);\n\n      const totalWidth = layoutAlignment.reduce((acc, curr) => {\n        return Math.max(acc, curr.minWidth);\n      }, 0);\n      const shouldRenderMetric = chartSize.height <= totalHeight || chartSize.width <= totalWidth * columns;\n\n      return {\n        panel,\n        headerLayout,\n        layoutAlignment,\n        shouldRenderMetric,\n      };\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleLinear, scaleLinear } from 'd3-scale';\n\nimport { getBulletSpec } from './get_bullet_spec';\nimport { BulletLayout, BulletHeaderLayout, getLayout } from './get_layout';\nimport { ChromaColorScale, Color } from '../../../common/colors';\nimport { Rect } from '../../../geoms/types';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../state/selectors/get_chart_theme';\nimport { getResolvedBackgroundColorSelector } from '../../../state/selectors/get_resolved_background_color';\nimport { isWithinRange } from '../../../utils/common';\nimport { Size } from '../../../utils/dimensions';\nimport { GenericDomain, Range } from '../../../utils/domain';\nimport { Point } from '../../../utils/point';\nimport { ANGULAR_TICK_INTERVAL, TICK_INTERVAL } from '../renderer/canvas/constants';\nimport { BulletDatum, BulletSpec, BulletSubtype } from '../spec';\nimport { BulletStyle, GRAPH_PADDING } from '../theme';\nimport { getAngledChartSizing, getAnglesBySize } from '../utils/angular';\nimport { ColorTick, getColorScaleWithBands } from '../utils/color';\nimport { TickOptions, getTicks } from '../utils/ticks';\n\n/** @internal */\nexport type BulletPanelDimensions = {\n  graphArea: {\n    size: Size;\n    origin: Point;\n    center: Point;\n  };\n  scale: ScaleLinear<number, number>;\n  ticks: number[];\n  domain: GenericDomain;\n  colorScale: ChromaColorScale;\n  colorBands: ColorTick[];\n  panel: Rect;\n} & Omit<BulletHeaderLayout, 'panel'>;\n\n/** @internal */\nexport type BulletDimensions = {\n  rows: (BulletPanelDimensions | null)[][];\n  panel: Size;\n} & Pick<BulletLayout, 'layoutAlignment' | 'shouldRenderMetric'>;\n\n/** @internal */\nexport const getPanelDimensions = createCustomCachedSelector(\n  [getLayout, getBulletSpec, getChartThemeSelector, getResolvedBackgroundColorSelector],\n  (\n    { shouldRenderMetric, headerLayout, layoutAlignment, panel: panelSize },\n    spec,\n    { bulletGraph: bulletGraphStyles },\n    backgroundColor,\n  ): BulletDimensions => {\n    // TODO: simplify color scale lookup for shouldRenderMetric case. Now we do more computations\n    // than necessary but for now this provides the same color bands / scale between Metric and bullet rendering\n\n    const rows = headerLayout.map((row, rowIndex) => {\n      return row.map((bulletGraph, columnIndex): BulletPanelDimensions | null => {\n        if (!bulletGraph) return null;\n        const { panel, multiline, datum, ...rest } = bulletGraph;\n        const verticalAlignment = layoutAlignment[rowIndex]!;\n\n        const graphSize = {\n          width: panel.width,\n          height: panel.height - verticalAlignment.headerHeight,\n        };\n\n        return {\n          ...rest,\n          ...getSubtypeDimensions(spec, graphSize, datum, bulletGraphStyles, backgroundColor),\n          datum,\n          multiline,\n          graphArea: {\n            size: graphSize,\n            origin: {\n              x: 0,\n              y: panel.height - graphSize.height,\n            },\n            center: {\n              x: graphSize.width / 2 - GRAPH_PADDING.left,\n              y: graphSize.height / 2 - GRAPH_PADDING.top,\n            },\n          },\n          panel: {\n            x: panel.width * columnIndex,\n            y: panel.height * rowIndex,\n            ...panel,\n          },\n        };\n      });\n    });\n\n    return {\n      rows,\n      panel: panelSize,\n      layoutAlignment,\n      shouldRenderMetric,\n    };\n  },\n);\n\nfunction getSubtypeDimensions(\n  { subtype, colorBands: colorBandsConfig }: BulletSpec,\n  graphSize: Size,\n  { ticks: desiredTicks, domain, niceDomain }: BulletDatum,\n  { colorBands: defaultColorBandsConfig, fallbackBandColor }: BulletStyle,\n  backgroundColor: Color,\n): Pick<BulletPanelDimensions, 'scale' | 'colorScale' | 'colorBands' | 'ticks' | 'domain'> {\n  switch (subtype) {\n    case BulletSubtype.circle:\n    case BulletSubtype.halfCircle:\n    case BulletSubtype.twoThirdsCircle: {\n      const [startAngle, endAngle] = getAnglesBySize(subtype);\n      const { radius } = getAngledChartSizing(graphSize, subtype);\n\n      const { scale, ticks } = getScaleWithTicks(domain, [startAngle, endAngle], {\n        rangeMultiplier: radius,\n        desiredTicks,\n        nice: niceDomain,\n        interval: ANGULAR_TICK_INTERVAL,\n      });\n\n      const { bands: colorBands, scale: colorScale } = getColorScaleWithBands(\n        scale,\n        colorBandsConfig ?? defaultColorBandsConfig,\n        ticks,\n        backgroundColor,\n        fallbackBandColor,\n      );\n\n      return {\n        scale,\n        domain: scale.domain() as GenericDomain,\n        ticks,\n        colorBands,\n        colorScale,\n      };\n    }\n\n    case BulletSubtype.horizontal: {\n      const paddedWidth = graphSize.width - GRAPH_PADDING.left - GRAPH_PADDING.right;\n      const { scale, ticks } = getScaleWithTicks(domain, [0, paddedWidth], {\n        desiredTicks,\n        nice: niceDomain,\n        interval: TICK_INTERVAL,\n      });\n\n      const { bands: colorBands, scale: colorScale } = getColorScaleWithBands(\n        scale,\n        colorBandsConfig ?? defaultColorBandsConfig,\n        ticks,\n        backgroundColor,\n        fallbackBandColor,\n      );\n\n      return {\n        scale,\n        domain: scale.domain() as GenericDomain,\n        ticks,\n        colorBands,\n        colorScale,\n      };\n    }\n\n    case BulletSubtype.vertical: {\n      const paddedHeight = graphSize.height - GRAPH_PADDING.bottom - GRAPH_PADDING.top;\n      const { scale, ticks } = getScaleWithTicks(domain, [0, paddedHeight], {\n        desiredTicks,\n        nice: niceDomain,\n        interval: TICK_INTERVAL,\n      });\n\n      const { bands: colorBands, scale: colorScale } = getColorScaleWithBands(\n        scale,\n        colorBandsConfig ?? defaultColorBandsConfig,\n        ticks,\n        backgroundColor,\n        fallbackBandColor,\n      );\n\n      return {\n        scale,\n        domain: scale.domain() as GenericDomain,\n        ticks,\n        colorBands,\n        colorScale,\n      };\n    }\n\n    default:\n      throw new Error('Unknown Bullet subtype');\n  }\n}\n\nfunction getScaleWithTicks(domain: GenericDomain, range: Range, tickOptions: TickOptions) {\n  let scale = scaleLinear().domain(domain).range(range);\n  const scaleRange: Range = scale.range() as Range;\n  const ticks = getTicks(Math.abs(scaleRange[1] - scaleRange[0]) * (tickOptions.rangeMultiplier || 1), tickOptions);\n  const customRange = typeof ticks !== 'number';\n\n  if (tickOptions.nice) {\n    scale = scale.nice(customRange ? undefined : ticks);\n  }\n\n  const updatedDomain = scale.domain() as GenericDomain;\n\n  return {\n    scale,\n    ticks: customRange ? ticks(updatedDomain).filter(isWithinRange(updatedDomain)) : scale.ticks(ticks),\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnchorPosition } from '../../../components/portal';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../state/selectors/get_active_pointer_position';\n\n/** @internal */\nexport const getTooltipAnchor = createCustomCachedSelector(\n  [getActivePointerPosition],\n  (pointer): AnchorPosition | null => {\n    return {\n      x: pointer?.x ?? 0,\n      y: pointer?.y ?? 0,\n      width: 0,\n      height: 0,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActiveValue } from './get_active_value';\nimport { getBulletSpec } from './get_bullet_spec';\nimport { TooltipInfo } from '../../../components/tooltip';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { isBetween } from '../../../utils/common';\nimport { mergeValueLabels } from '../spec';\n\n/** @internal */\nexport const getTooltipInfo = createCustomCachedSelector(\n  [getActiveValue, getBulletSpec],\n  (activeValue, spec): TooltipInfo | undefined => {\n    if (!activeValue) return;\n\n    const useHighlighter = false;\n    const highlightMargin = 2;\n    const valueLabels = mergeValueLabels(spec.valueLabels);\n\n    const activeDatum = activeValue.panel.datum;\n    const tooltipInfo: TooltipInfo = {\n      header: null,\n      values: [],\n    };\n\n    tooltipInfo.values.push({\n      label: valueLabels.active,\n      value: activeValue.value,\n      color: activeValue.color,\n      isHighlighted: false,\n      seriesIdentifier: {\n        specId: 'bullet',\n        key: 'active',\n      },\n      isVisible: true,\n      formattedValue: activeDatum.valueFormatter(activeValue.snapValue),\n    });\n\n    const isHighlighted = useHighlighter\n      ? isBetween(activeValue.pixelValue - highlightMargin, activeValue.pixelValue + highlightMargin)\n      : () => false;\n\n    tooltipInfo.values.push({\n      label: valueLabels.value,\n      value: activeDatum.value,\n      color: activeValue.panel.colorScale(activeDatum.value).hex(),\n      isHighlighted: isHighlighted(activeValue.panel.scale(activeDatum.value)),\n      seriesIdentifier: {\n        specId: 'bullet',\n        key: 'value',\n      },\n      isVisible: true,\n      formattedValue: activeDatum.valueFormatter(activeDatum.value),\n    });\n\n    if (activeDatum.target) {\n      tooltipInfo.values.push({\n        label: valueLabels.target,\n        value: activeDatum.target,\n        color: activeValue.panel.colorScale(activeDatum.target).hex(),\n        isHighlighted: isHighlighted(activeValue.panel.scale(activeDatum.target)),\n        seriesIdentifier: {\n          // TODO make this better\n          specId: 'bullet',\n          key: 'target',\n        },\n        isVisible: true,\n        formattedValue: activeDatum.valueFormatter(activeDatum.target),\n      });\n    }\n\n    return tooltipInfo;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { canDisplayChartTitles } from './can_display_chart_titles';\nimport { GlobalChartState } from '../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\n\nconst getChartTitleOrDescription = ({ title, description }: GlobalChartState) => Boolean(title || description);\n\n/** @internal */\nexport const hasChartTitles = createCustomCachedSelector(\n  [canDisplayChartTitles, getChartTitleOrDescription],\n  (displayTitles, hasTitles): boolean => {\n    return displayTitles && hasTitles;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipInfo } from './get_tooltip_info';\nimport { TooltipType } from '../../../specs';\nimport { TooltipVisibility } from '../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../state/create_selector';\nimport { getTooltipSpecSelector } from '../../../state/selectors/get_tooltip_spec';\n\n/** @internal */\nexport const isTooltipVisible = createCustomCachedSelector(\n  [getTooltipSpecSelector, getTooltipInfo],\n  ({ type }, tooltipInfo): TooltipVisibility => {\n    return {\n      visible: type !== TooltipType.None && (tooltipInfo?.values.length ?? 0) > 0,\n      isExternal: false,\n      displayOnly: false,\n      isPinnable: false,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\nimport { $Values, Optional } from 'utility-types';\n\nimport { BulletColorConfig } from './utils/color';\nimport { ChartType } from '../../chart_types/index';\nimport { Spec } from '../../specs';\nimport { SpecType } from '../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../state/spec_factory';\nimport { mergePartial, stripUndefined, ValueFormatter } from '../../utils/common';\nimport { GenericDomain } from '../../utils/domain';\n\n/** @public */\nexport interface BulletDatum {\n  title: string;\n  subtitle?: string;\n  value: number;\n  target?: number;\n  domain: GenericDomain;\n  niceDomain?: boolean;\n  /**\n   * Approximate number of ticks to be returned. Must be greater than 0.\n   *\n   * Or\n   *\n   * Function that returns the exact ticks to use, this if you pass bad ticks we will not be able to help you!\n   * Sort order must match the direction of the domain.\n   *\n   * Defaults to auto ticks based on length\n   *\n   * See https://d3js.org/d3-scale/linear#linear_ticks\n   */\n  ticks?: number | ((domain: GenericDomain) => number[]);\n  syncCursor?: boolean;\n  valueFormatter: ValueFormatter;\n  targetFormatter?: ValueFormatter;\n  tickFormatter: ValueFormatter;\n}\n\n/** @public */\nexport const BulletSubtype = Object.freeze({\n  vertical: 'vertical' as const,\n  horizontal: 'horizontal' as const,\n  /**\n   * This bullet subtype is not yet fully supported\n   * See https://github.com/elastic/elastic-charts/issues/2200\n   * @alpha\n   */\n  circle: 'circle' as const,\n  halfCircle: 'half-circle' as const,\n  twoThirdsCircle: 'two-thirds-circle' as const,\n});\n/** @public */\nexport type BulletSubtype = $Values<typeof BulletSubtype>;\n\n/** @public */\nexport interface BulletValueLabels {\n  active: string;\n  value: string;\n  target: string;\n}\n\n/** @alpha */\nexport interface BulletSpec extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Bullet;\n  data: (BulletDatum | undefined)[][];\n  subtype: BulletSubtype;\n  tickSnapStep?: number;\n  colorBands?: BulletColorConfig;\n  valueLabels?: Optional<BulletValueLabels>;\n}\n\n/** @internal */\nexport const mergeValueLabels = (labels?: BulletSpec['valueLabels']) =>\n  mergePartial<BulletValueLabels>(\n    {\n      active: 'Active',\n      value: 'Value',\n      target: 'Target',\n    },\n    labels,\n  );\n\nconst buildProps = buildSFProps<BulletSpec>()(\n  {\n    specType: SpecType.Series,\n    chartType: ChartType.Bullet,\n  },\n  {},\n);\n\n/**\n * Add Goal spec to chart\n * @alpha\n */\nexport const Bullet = function (\n  props: SFProps<\n    BulletSpec,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  const constraints = {};\n\n  useSpecFactory<BulletSpec>({\n    ...defaults,\n    ...stripUndefined(props),\n    ...overrides,\n    ...constraints,\n  });\n  return null;\n};\n\n/** @public */\nexport type BulletProps = ComponentProps<typeof Bullet>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BulletColorConfig } from './utils/color';\nimport { Color } from '../../common/colors';\nimport { DEFAULT_FONT_FAMILY } from '../../common/default_theme_attributes';\nimport { Pixels } from '../../common/geometry';\nimport { Font } from '../../common/text_utils';\nimport { Padding } from '../../utils/dimensions';\nimport { DARK_BASE_COLORS, LIGHT_BASE_COLORS } from '../../utils/themes/base_colors';\n\n/** @public */\nexport interface BulletStyle {\n  textColor: Color;\n  border: Color;\n  barBackground: Color;\n  /**\n   * Default band colors when not defined on spec\n   */\n  colorBands: BulletColorConfig;\n  nonFiniteText: string;\n  minHeight: Pixels;\n  angularTickLabelPadding: Pixels;\n  fallbackBandColor: Color;\n}\n\n/** @internal */\nexport const LIGHT_THEME_BULLET_STYLE: BulletStyle = {\n  textColor: LIGHT_BASE_COLORS.darkestShade,\n  border: '#EDF0F5',\n  barBackground: LIGHT_BASE_COLORS.darkestShade,\n  colorBands: ['#AA87D1', '#D9C6EF'],\n  nonFiniteText: 'N/A',\n  minHeight: 64,\n  angularTickLabelPadding: 10,\n  fallbackBandColor: LIGHT_BASE_COLORS.mediumShade,\n};\n\n/** @internal */\nexport const DARK_THEME_BULLET_STYLE: BulletStyle = {\n  textColor: '#E0E5EE',\n  border: DARK_BASE_COLORS.lightShade,\n  barBackground: '#FFF',\n  colorBands: ['#6092C0', '#3F4E61'],\n  nonFiniteText: 'N/A',\n  minHeight: 64,\n  angularTickLabelPadding: 10,\n  fallbackBandColor: DARK_BASE_COLORS.mediumShade,\n};\n\n/** @internal */\nexport const TITLE_FONT: Font = {\n  fontStyle: 'normal',\n  fontFamily: DEFAULT_FONT_FAMILY,\n  fontVariant: 'normal',\n  fontWeight: 'bold',\n  textColor: 'black',\n};\n\n/**\n * Approximate height of font ascent from the baseline\n * @internal\n */\nexport const TEXT_ASCENT_RATIO = 0.8;\n\n/** @internal */\nexport const FONT_PADDING = 8;\n\n/** @internal */\nexport const TITLE_FONT_SIZE = 16;\n\n/** @internal */\nexport const TITLE_FONT_ASCENT = TITLE_FONT_SIZE * TEXT_ASCENT_RATIO;\n\n/** @internal */\nexport const TITLE_LINE_SPACING = 4;\n\n/** @internal */\nexport const SUBTITLE_FONT: Font = {\n  ...TITLE_FONT,\n  fontWeight: 'normal',\n};\n/** @internal */\nexport const SUBTITLE_FONT_SIZE = 14;\n\n/** @internal */\nexport const SUBTITLE_FONT_ASCENT = SUBTITLE_FONT_SIZE * TEXT_ASCENT_RATIO;\n\n/** @internal */\nexport const VALUE_FONT: Font = {\n  ...TITLE_FONT,\n};\n/** @internal */\nexport const VALUE_FONT_SIZE = 22;\n\nconst VALUE_FONT_ASCENT = VALUE_FONT_SIZE * TEXT_ASCENT_RATIO;\n\n/** @internal */\nexport const TARGET_FONT: Font = {\n  ...SUBTITLE_FONT,\n};\n/** @internal */\nexport const TARGET_FONT_SIZE = 16;\n\nconst TARGET_FONT_ASCENT = TARGET_FONT_SIZE * TEXT_ASCENT_RATIO;\n\n/** @internal */\nexport const getMaxTargetValueAssent = (target?: string) =>\n  !target ? VALUE_FONT_ASCENT : Math.max(VALUE_FONT_ASCENT, TARGET_FONT_ASCENT);\n\n/** @internal */\nexport const TICK_FONT: Font = {\n  ...TITLE_FONT,\n  fontWeight: 'normal',\n};\n/** @internal */\nexport const TICK_FONT_SIZE = 10;\n\n/** @internal */\nexport const HEADER_PADDING: Padding = {\n  top: 8,\n  bottom: 10, // allow more space for descenders\n  left: 8,\n  right: 8,\n};\n/** @internal */\nexport const GRAPH_PADDING: Padding = {\n  top: 8,\n  bottom: 8,\n  left: 8,\n  right: 8,\n};\n\n/**\n * Returns approx ascent height of text reduced by descent height for characters with descenders\n * @internal\n */\nexport function getTextAscentHeight(fontSize: number, lines = 1, lineSpacing = 0) {\n  return lines * (fontSize * TEXT_ASCENT_RATIO) + (lines - 1) * lineSpacing;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TAU } from '../../../common/constants';\nimport { clamp } from '../../../utils/common';\nimport { Size } from '../../../utils/dimensions';\nimport { TARGET_SIZE } from '../renderer/canvas/constants';\nimport { BulletSubtype } from '../spec';\nimport { GRAPH_PADDING } from '../theme';\n\ntype AngularBulletSubtypes = Extract<BulletSubtype, 'circle' | 'half-circle' | 'two-thirds-circle'>;\n\nconst sizeAngles: Record<AngularBulletSubtypes, { startAngle: number; endAngle: number }> = {\n  [BulletSubtype.halfCircle]: {\n    startAngle: 1 * Math.PI,\n    endAngle: 0,\n  },\n  [BulletSubtype.twoThirdsCircle]: {\n    startAngle: 1.25 * Math.PI,\n    endAngle: -0.25 * Math.PI,\n  },\n  [BulletSubtype.circle]: {\n    startAngle: 1.5 * Math.PI,\n    endAngle: -0.5 * Math.PI,\n  },\n};\n\n/** @internal */\nexport function getAnglesBySize(subtype: BulletSubtype): [startAngle: number, endAngle: number] {\n  if (subtype === BulletSubtype.vertical || subtype === BulletSubtype.horizontal) {\n    throw new Error('Attempting to retrieve angle size from horizontal/vertical bullet');\n  }\n  const angles = sizeAngles[subtype] ?? sizeAngles[BulletSubtype.twoThirdsCircle];\n  // Negative angles used to match current radian pattern\n  const startAngle = -angles.startAngle;\n  // limit endAngle to startAngle +/- 2π\n  const endAngle = clamp(-angles.endAngle, startAngle - TAU, startAngle + TAU);\n  return [startAngle, endAngle];\n}\n\nconst heightModifiers: Record<AngularBulletSubtypes, number> = {\n  [BulletSubtype.halfCircle]: 0.5,\n  [BulletSubtype.twoThirdsCircle]: 0.86, // approximated to account for flare of arc stroke at the bottom\n  [BulletSubtype.circle]: 1,\n};\n\n/** @internal */\nexport function getAngledChartSizing(\n  graphSize: Size,\n  subtype: BulletSubtype,\n): { maxWidth: number; maxHeight: number; radius: number } {\n  if (subtype === BulletSubtype.vertical || subtype === BulletSubtype.horizontal) {\n    throw new Error('Attempting to retrieve angle size from horizontal/vertical bullet');\n  }\n  const heightModifier = heightModifiers[subtype] ?? 1;\n  const maxWidth = graphSize.width - GRAPH_PADDING.left - GRAPH_PADDING.right;\n  const maxHeight = graphSize.height - GRAPH_PADDING.top - GRAPH_PADDING.bottom;\n  const modifiedHeight = maxHeight / heightModifier;\n  const radius = Math.min(maxWidth, modifiedHeight) / 2 - TARGET_SIZE / 2;\n\n  return { maxWidth, maxHeight: modifiedHeight, radius };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport chroma from 'chroma-js';\nimport { extent } from 'd3-array';\nimport { ScaleLinear } from 'd3-scale';\nimport { $Values, Required } from 'utility-types';\n\nimport { BaseBoundsConfig, OpenClosedBoundsConfig } from './bounds';\nimport { combineColors } from '../../../common/color_calcs';\nimport { RGBATupleToString, colorToRgba, getChromaColor } from '../../../common/color_library_wrappers';\nimport { ChromaColorScale, Color, Colors } from '../../../common/colors';\nimport { clamp, isFiniteNumber, isNil, isSorted, isWithinRange, sortNumbers } from '../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../utils/domain';\nimport { Logger } from '../../../utils/logger';\n\n/**\n * @public\n */\nexport const ColorBandValueType = Object.freeze({\n  /**\n   * Value in the scaled space\n   */\n  Scale: 'scale' as const,\n  /**\n   * Percentage of the scaled space as a ratio from `0` to `1`\n   */\n  Percentage: 'percentage' as const,\n});\n/** @public */\nexport type ColorBandValueType = $Values<typeof ColorBandValueType>;\n\n/** @public */\nexport interface ColorBandValue {\n  /**\n   * Type of value\n   *\n   * @defaultValue `scale`\n   */\n  type: ColorBandValueType;\n  value: number;\n}\n\n/** @public */\nexport type ColorBandConfig = OpenClosedBoundsConfig<number | ColorBandValue> & {\n  /**\n   * Color to be applied to band\n   */\n  color: Color;\n};\n\n/** @public */\nexport interface ColorBandSimpleConfig {\n  /**\n   * Distinct color steps to defined discrete color breakdown\n   * Defaults to intervals between ticks\n   *\n   * Number - scales colors evenly n times, does not support continuous color blending (i.e. n \\>\\> 10)\n   * Array of numbers - defines the color stop positions\n   *\n   * See https://gka.github.io/chroma.js/#scale-classes\n   */\n  steps?: number | number[];\n  colors: Color[];\n}\n\n/** @public */\nexport type ColorBandComplexConfig = ColorBandConfig[];\n\n/**\n * Defines the color of bullet chart bands\n * @public\n */\nexport type BulletColorConfig = Color[] | ColorBandSimpleConfig | ColorBandComplexConfig;\n\nconst getValueByTypeFn = ([min, max]: ContinuousDomain) => {\n  const domainLength = max - min;\n  const minOffset = domainLength / 100000; // TODO validate approach\n  return (bandValue: ColorBandValue | number, openOffset: -1 | 0 | 1 = 0): number | null => {\n    const openOffsetValue = openOffset * minOffset;\n    if (typeof bandValue === 'number') return bandValue + openOffsetValue;\n    const { type, value } = bandValue;\n    if (type === 'scale') return value + openOffsetValue;\n    if (type === 'percentage') return min + (value / 100) * domainLength + openOffsetValue;\n    return null;\n  };\n};\n\nconst getBandValueFn = (domain: ContinuousDomain) => {\n  const getValueByType = getValueByTypeFn(domain);\n  return (bandValue?: number | ColorBandValue, openOffset?: -1 | 0 | 1): number | null => {\n    if (isNil(bandValue)) return null;\n    return getValueByType(bandValue, openOffset);\n  };\n};\n\nconst getDomainPairFn = (domain: ContinuousDomain) => {\n  const getBandValue = getBandValueFn(domain);\n  return (config: BaseBoundsConfig<number | ColorBandValue>): [start: number | null, end: number | null] => {\n    return [\n      getBandValue(config.gt, 1) ?? getBandValue(config.gte),\n      getBandValue(config.lt, -1) ?? getBandValue(config.lte),\n    ];\n  };\n};\n\nconst isComplexConfig = (config: BulletColorConfig): config is ColorBandComplexConfig =>\n  Array.isArray(config) && typeof config[0] !== 'string';\n\nconst getColorBandsFromTicks = ([min, max]: ContinuousDomain, ticks: number[]): number[] => {\n  const fullTicks = ticks.slice();\n  const first = fullTicks.at(0)!;\n  const last = fullTicks.at(-1)!;\n  const minIndex = first > last ? -1 : 0;\n  const maxIndex = first < last ? -1 : 0;\n  if (fullTicks.at(minIndex) !== min) {\n    if (minIndex === 0) fullTicks.unshift(min);\n    else fullTicks.push(min);\n  }\n  if (fullTicks.at(maxIndex) !== max) {\n    if (maxIndex === 0) fullTicks.unshift(max);\n    else fullTicks.push(max);\n  }\n  return fullTicks.flatMap((n, i, { length }) => (i === 0 || i === length - 1 ? [n] : [n, n]));\n};\n\ninterface ScaleInputs {\n  colorBandDomain?: number[];\n  colors: string[];\n  steps?: number | number[];\n}\n\nfunction getScaleInputs(baseDomain: ContinuousDomain, config: BulletColorConfig, backgroundColor: Color): ScaleInputs {\n  if (!Array.isArray(config) || !isComplexConfig(config)) {\n    const { colors: rawColors, steps }: { colors: string[]; steps?: number | number[] } = !Array.isArray(config)\n      ? config\n      : {\n          colors: config,\n        };\n\n    // TODO - fix thrown error for RGBA colors from storybook\n    const colors = rawColors.map((c) => c.toLowerCase());\n    if (colors.length === 1) {\n      // Adds second color\n      const [color] = colors;\n      // should always have color\n      if (color) {\n        const secondary = getChromaColor(color).alpha(0.7).hex();\n        const blendedSecondary = combineColors(colorToRgba(secondary), colorToRgba(backgroundColor));\n        colors.push(RGBATupleToString(blendedSecondary));\n      }\n    }\n\n    return {\n      colors,\n      steps,\n    };\n  }\n\n  if (!isComplexConfig(config)) {\n    return {\n      colors: config,\n    };\n  }\n\n  const getDomainPair = getDomainPairFn(baseDomain);\n  const { colors, boundedDomains } = config.reduce<{\n    boundedDomains: [number | null, number | null][];\n    colors: string[];\n  }>(\n    (acc, colorConfig) => {\n      if (typeof colorConfig === 'string') {\n        acc.colors.push(colorConfig);\n      } else {\n        acc.colors.push(colorConfig.color);\n        const domainPair = getDomainPair(colorConfig);\n        acc.boundedDomains.push(domainPair);\n      }\n\n      return acc;\n    },\n    {\n      boundedDomains: [],\n      colors: [],\n    },\n  );\n\n  let prevMax = -Infinity;\n  return boundedDomains.reduce<Required<ScaleInputs, 'colorBandDomain'>>(\n    (acc, [min, max], i) => {\n      // TODO: Add better error handling around this logic, the complex config right now assumes the following:\n      // - All ranges are ordered from min to max\n      // - All ranges are compatible with each other such that there is no overlapping or excluded ranges\n      // Ideally we validate the config and fix it the best we can based on what is provided, filling or clamping as needed\n      const testMinValue = isFiniteNumber(min) ? min : isFiniteNumber(max) ? max : null;\n      if (testMinValue === null || testMinValue < prevMax) {\n        Logger.warn(`Error with ColorBandComplexConfig:\n\nRanges are incompatible with each other such that there is either overlapping or excluded range pairs`);\n        return acc;\n      }\n      const newMaxValue = isFiniteNumber(max) ? max : isFiniteNumber(min) ? min : null;\n      if (newMaxValue === null) return acc;\n\n      prevMax = newMaxValue;\n      const color = colors[i] ?? Colors.Transparent.keyword;\n\n      if (isFiniteNumber(min)) {\n        acc.colorBandDomain.push(min);\n        acc.colors.push(color);\n      }\n      if (isFiniteNumber(max)) {\n        acc.colorBandDomain.push(max);\n        acc.colors.push(color);\n      }\n\n      return acc;\n    },\n    {\n      colorBandDomain: [],\n      colors: [],\n    },\n  );\n}\n\n/** @internal */\nexport function getColorScale(\n  baseDomain: ContinuousDomain,\n  config: BulletColorConfig,\n  backgroundColor: Color,\n  fallbackBandColor: Color,\n): [colorScale: ChromaColorScale, scaleInputs: ScaleInputs] {\n  const { colors, colorBandDomain, steps: userSteps } = getScaleInputs(baseDomain, config, backgroundColor);\n  const scale = chroma\n    .scale(colors)\n    .mode('lab')\n    .domain(colorBandDomain ?? baseDomain);\n  let steps = userSteps;\n  let scaleDomain = baseDomain;\n\n  if (steps !== undefined) {\n    if (Array.isArray(steps) && !isSorted(steps, { order: 'ascending' })) {\n      Logger.warn(\n        `Ignoring Bullet.colorBands.steps. Expected a sorted ascending array of numbers without duplicates.\\n\\n\\tReceived:${JSON.stringify(steps)}`,\n      );\n      steps = undefined;\n    } else if (typeof steps === 'number' && steps < 1) {\n      Logger.warn(`Ignoring Bullet.colorBands.steps. Expected a positive number.\\n\\n\\tReceived:${steps}`);\n      steps = undefined;\n    } else {\n      if (Array.isArray(steps)) {\n        const [min = NaN, max = NaN] = extent(steps);\n        scaleDomain = [min, max];\n      }\n      scale.classes(steps);\n    }\n  }\n  const isInDomain = isWithinRange(scaleDomain);\n\n  return [(n) => (isInDomain(n) ? scale(n) : getChromaColor(fallbackBandColor)), { colors, colorBandDomain, steps }];\n}\n\n/** @internal */\nexport interface BandPositions {\n  start: number;\n  end: number;\n  size: number;\n}\n\n/** @internal */\nexport type ColorTick = { color: Color } & BandPositions;\n\n// TODO memoize for duplicate calls\n/** @internal */\nexport function getColorScaleWithBands(\n  scale: ScaleLinear<number, number>,\n  config: BulletColorConfig,\n  ticks: number[],\n  backgroundColor: Color,\n  fallbackBandColor: Color,\n): {\n  scale: ChromaColorScale;\n  bands: ColorTick[];\n} {\n  const domain = scale.domain() as GenericDomain;\n  const baseDomain = sortNumbers(domain) as ContinuousDomain;\n  const [colorScale, colorScaleInputs] = getColorScale(baseDomain, config, backgroundColor, fallbackBandColor);\n\n  return {\n    scale: colorScale,\n    bands: getColorBands(scale, colorScale, ticks, baseDomain, colorScaleInputs),\n  };\n}\n\nfunction getColorBands(\n  scale: ScaleLinear<number, number>,\n  colorScale: ChromaColorScale,\n  ticks: number[],\n  baseDomain: ContinuousDomain,\n  { colorBandDomain, steps }: ScaleInputs,\n): ColorTick[] {\n  const [min, max] = baseDomain;\n  if (steps) {\n    if (Array.isArray(steps)) {\n      const bands: ColorTick[] = [];\n\n      for (let i = 0; i < steps.length - 1; i++) {\n        const start = steps[i]!;\n        const end = steps[i + 1]!;\n        const [scaledStart, scaledEnd] = sortNumbers([scale(clamp(start, min, max)), scale(clamp(end, min, max))]);\n\n        bands.push({\n          start: scaledStart,\n          end: scaledEnd,\n          size: Math.abs(scaledEnd - scaledStart),\n          color: colorScale(start + Math.abs(end - start) / 2).hex(),\n        });\n      }\n\n      return bands;\n    }\n    const domainDelta = max - min;\n    const size = domainDelta / steps;\n\n    return Array.from({ length: steps }, (_, i) => {\n      const [start, end] = sortNumbers([scale(i * size + min), scale((i + 1) * size + min)]);\n\n      return {\n        start,\n        end,\n        color: colorScale((i + 0.5) * size + min).hex(),\n        size: Math.abs(end - start),\n      };\n    });\n  }\n\n  const bandPositions = colorBandDomain ?? getColorBandsFromTicks(baseDomain, ticks);\n  const scaledColorBands: ColorTick[] = [];\n\n  for (let i = 0; i < bandPositions.length; i += 2) {\n    const [start, end] = bandPositions.slice(i, i + 2);\n    if (start === undefined || end === undefined) continue;\n\n    const [scaledStart, scaledEnd] = sortNumbers([scale(clamp(start, min, max)), scale(clamp(end, min, max))]);\n    const size = Math.abs(scaledEnd - scaledStart);\n    const tick = clamp(start + (end - start) / 2, min, max); // pegs color at middle of band - maybe allow control of this later\n\n    if (scaledStart === scaledEnd) continue;\n\n    scaledColorBands.push({\n      start: scaledStart,\n      end: scaledEnd,\n      size,\n      color: colorScale(tick).hex(),\n    });\n  }\n\n  return scaledColorBands;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { clamp, isFiniteNumber } from '../../../utils/common';\nimport { MAX_TICK_COUNT, MIN_TICK_COUNT } from '../renderer/canvas/constants';\nimport { BulletDatum } from '../spec';\n\n/** @internal */\nexport interface TickOptions {\n  nice?: boolean;\n  interval: number;\n  desiredTicks: BulletDatum['ticks'];\n  /**\n   * Amplifies range by constant, use for angular to convert angles to arc lengths\n   */\n  rangeMultiplier?: number;\n}\n\n/** @internal */\nexport function getTicks(length: number, { desiredTicks, interval }: Omit<TickOptions, 'nice'>) {\n  if ((isFiniteNumber(desiredTicks) && desiredTicks > 0) || typeof desiredTicks === 'function') return desiredTicks;\n  const target = Math.floor(length / interval);\n  return clamp(target, MIN_TICK_COUNT, MAX_TICK_COUNT);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '..';\nimport { LegacyAnimationConfig } from '../../common/animation';\nimport { BaseDatum, Spec } from '../../specs';\nimport { SpecType } from '../../specs/constants'; // kept as long-winded import on separate line otherwise import circularity emerges\nimport { buildSFProps, SFProps, useSpecFactory } from '../../state/spec_factory';\nimport { Datum, stripUndefined, ValueAccessor, ValueFormatter } from '../../utils/common';\n\n/**\n * Control function for resetting chart focus\n * @public\n */\nexport type FlameGlobalControl = () => void; // takes no argument\n\n/**\n * Control function for setting chart focus on a specific node\n * @public\n */\nexport type FlameNodeControl = (nodeIndex: number) => void; // takes no arguments\n\n/**\n * Control function for setting chart focus on a specific node\n * @public\n */\nexport type FlameSearchControl = (text: string) => void; // takes no arguments\n\n/**\n * Provides direct controls for the Flame component user.\n * The call site supplied callback function is invoked on the chart component initialization as well as on component update,\n * so the callback must be idempotent.\n * @public\n */\nexport interface ControlReceiverCallbacks {\n  resetFocus: (control: FlameGlobalControl) => void; // call site responsibility to store and use the `control` function\n  focusOnNode: (control: FlameNodeControl) => void; // same but the control function passed to the call site uses one arg\n  search: (control: FlameSearchControl) => void;\n}\n\n/**\n * Column oriented data input for N data points:\n *   - label: array of N strings\n *   - value: Float64Array of N numbers, for tooltip value display\n *   - color: Float32Array of 4 * N numbers, eg. green[i] = color[4 * i + 1]\n *   - position0: Tween from: Float32Array of 2 * N numbers with unit coordinates [x0, y0, x1, y1, ..., xN-1, yN-1]\n *   - position1: Tween to: Float32Array of 2 * N numbers with unit coordinates [x0, y0, x1, y1, ..., xN-1, yN-1]\n *   - size0: Tween from: Float32Array of N numbers with unit widths [width0, width1, ... , widthN-1]\n *   - size1: Tween to: Float32Array of N numbers with unit widths [width0, width1, ... , widthN-1]\n * If position0 === position1 and size0 === size1, then the nodes are not animated\n * @public\n */\nexport interface ColumnarViewModel {\n  label: string[];\n  value: Float64Array;\n  color: Float32Array;\n  position0: Float32Array;\n  position1: Float32Array;\n  size0: Float32Array;\n  size1: Float32Array;\n}\n\n/**\n * Specifies the flame chart\n * @public\n */\nexport interface FlameSpec<D extends BaseDatum = Datum> extends Spec, LegacyAnimationConfig {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Flame;\n  columnarData: ColumnarViewModel;\n  controlProviderCallback: Partial<ControlReceiverCallbacks>; // call site may grab any number of controls\n  valueAccessor: ValueAccessor<D>;\n  valueFormatter: ValueFormatter;\n  valueGetter: (datumIndex: number) => number;\n  search?: { text: string };\n  onSearchTextChange?: (text: string) => void;\n}\n\nconst buildProps = buildSFProps<FlameSpec>()(\n  {\n    chartType: ChartType.Flame,\n    specType: SpecType.Series,\n  },\n  {\n    valueAccessor: (d) => (typeof d === 'number' ? d : 0),\n    valueGetter: (n) => n, // fixme abracadabra\n    valueFormatter: (d) => String(d),\n    animation: { duration: 0 },\n  },\n);\n\n/**\n * Adds flame spec to chart specs\n * @public\n */\nexport const Flame = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    FlameSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<FlameSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { createRef, CSSProperties, RefObject, WheelEventHandler } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { FlameSpec } from './flame_api';\nimport { NavigationStrategy, NavButtonControlledZoomPanHistory } from './navigation';\nimport { roundUpSize } from './render/common';\nimport { drawFrame, EPSILON, PADDING_BOTTOM, PADDING_LEFT, PADDING_RIGHT, PADDING_TOP } from './render/draw_a_frame';\nimport { ensureWebgl } from './render/ensure_webgl';\nimport { uploadToWebgl } from './render/upload_to_webgl';\nimport { attributeLocations, GEOM_INDEX_OFFSET } from './shaders';\nimport { GLResources, NULL_GL_RESOURCES, nullColumnarViewModel, PickFunction } from './types';\nimport { ChartType } from '..';\nimport { DEFAULT_CSS_CURSOR, SECONDARY_BUTTON } from '../../common/constants';\nimport { bindFramebuffer, createTexture, NullTexture, readPixel, Texture } from '../../common/kingly';\nimport { GL } from '../../common/webgl_constants';\nimport { BasicTooltip } from '../../components/tooltip/tooltip';\nimport { SettingsSpec, SpecType, TooltipType, TooltipValue } from '../../specs';\nimport { onChartRendered } from '../../state/actions/chart';\nimport { ON_POINTER_MOVE } from '../../state/actions/mouse';\nimport { BackwardRef, GlobalChartState } from '../../state/chart_state';\nimport { isPinnableTooltip } from '../../state/selectors/can_pin_tooltip';\nimport { getA11ySettingsSelector } from '../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../state/selectors/get_tooltip_spec';\nimport { getSpecsFromStore } from '../../state/utils';\nimport { clamp, isFiniteNumber, isNil } from '../../utils/common';\nimport { Size } from '../../utils/dimensions';\nimport { FlamegraphStyle } from '../../utils/themes/theme';\n\nconst PINCH_ZOOM_CHECK_INTERVAL_MS = 100;\nconst SIDE_OVERSHOOT_RATIO = 0.05; // e.g. 0.05 means, extend the domain 5% to the left and 5% to the right\nconst RECURRENCE_ALPHA_PER_MS_X = 0.01;\nconst RECURRENCE_ALPHA_PER_MS_Y = 0.0062;\nconst SINGLE_CLICK_EMPTY_FOCUS = true;\nconst IS_META_REQUIRED_FOR_ZOOM = false;\nconst ZOOM_SPEED = 0.0015;\nconst DEEPEST_ZOOM_RATIO = 1e-7; // FP calcs seem precise enough down to a 10 000 000 times zoom: 1e-7\nconst ZOOM_FROM_EDGE_BAND = 16; // so the user needs not be precisely at the edge to zoom in one direction\nconst ZOOM_FROM_EDGE_BAND_LEFT = ZOOM_FROM_EDGE_BAND + PADDING_LEFT;\nconst ZOOM_FROM_EDGE_BAND_RIGHT = ZOOM_FROM_EDGE_BAND + PADDING_RIGHT;\nconst ZOOM_FROM_EDGE_BAND_TOP = ZOOM_FROM_EDGE_BAND + PADDING_TOP;\nconst ZOOM_FROM_EDGE_BAND_BOTTOM = ZOOM_FROM_EDGE_BAND + PADDING_BOTTOM;\nconst LEFT_MOUSE_BUTTON = 1;\nconst MINIMAP_SIZE_RATIO_X = 3;\nconst MINIMAP_SIZE_RATIO_Y = 3;\nconst SHOWN_ANCESTOR_COUNT = 2; // how many rows above the focused in node should be shown\nconst SHOULD_DISABLE_WOBBLE = (typeof process === 'object' && process.env && process.env.VRT) === 'true';\nconst WOBBLE_DURATION = SHOULD_DISABLE_WOBBLE ? 0 : 1000;\nconst WOBBLE_REPEAT_COUNT = 2;\nconst WOBBLE_FREQUENCY = SHOULD_DISABLE_WOBBLE ? 0 : 2 * Math.PI * (WOBBLE_REPEAT_COUNT / WOBBLE_DURATION); // e.g. 1/30 means a cycle of every 30ms\nconst NODE_TWEEN_DURATION_MS = 500;\n\nconst unitRowPitch = (position: Float32Array) => (position.length >= 4 ? (position[1] ?? 0) - (position[3] ?? 0) : 1);\nconst initialPixelRowPitch = () => 16;\nconst specValueFormatter = (d: number) => d; // fixme use the formatter from the spec\nconst browserRootWindow = () => {\n  let rootWindow = window; // we might be in an iframe, and visualViewport.scale is toplevel only\n  while (window.parent && window.parent.window !== rootWindow) rootWindow = rootWindow.parent.window;\n  return rootWindow;\n};\n\nconst columnToRowPositions = ({ position1, size1 }: FlameSpec['columnarData'], i: number) => ({\n  x0: position1[i * 2] ?? 0,\n  x1: (position1[i * 2] ?? 0) + (size1[i] ?? 0),\n  y0: position1[i * 2 + 1] ?? 0,\n  y1: (position1[i * 2 + 1] ?? 0) + unitRowPitch(position1),\n});\n\n/** @internal */\nexport interface FocusRect {\n  x0: number;\n  x1: number;\n  y0: number;\n  y1: number;\n}\n\nconst focusForArea = (chartHeight: number, { x0, x1, y0, y1 }: { x0: number; x1: number; y0: number; y1: number }) => {\n  // horizontal\n  const sideOvershoot = SIDE_OVERSHOOT_RATIO * (x1 - x0);\n\n  // vertical\n  const unitRowHeight = y1 - y0;\n  const chartHeightInUnit = (chartHeight / initialPixelRowPitch()) * unitRowHeight;\n  const y = Math.min(1, y1 + unitRowHeight * SHOWN_ANCESTOR_COUNT);\n  const intendedY0 = y - chartHeightInUnit;\n  const bottomOvershoot = Math.max(0, -intendedY0);\n  const top = Math.min(1, y + bottomOvershoot);\n\n  return {\n    x0: Math.max(0, x0 - sideOvershoot),\n    x1: Math.min(1, x1 + sideOvershoot),\n    y0: Math.max(0, intendedY0),\n    y1: Math.min(1, top),\n  };\n};\n\nconst focusRect = (\n  columnarViewModel: FlameSpec['columnarData'],\n  chartHeight: number,\n  drilldownDatumIndex: number,\n): FocusRect => focusForArea(chartHeight, columnToRowPositions(columnarViewModel, drilldownDatumIndex || 0));\n\nconst getColor = (c: Float32Array, i: number) => {\n  const r = Math.round(255 * (c[4 * i] ?? 0));\n  const g = Math.round(255 * (c[4 * i + 1] ?? 0));\n  const b = Math.round(255 * (c[4 * i + 2] ?? 0));\n  const a = c[4 * i + 3];\n  return `rgba(${r}, ${g}, ${b}, ${a})`;\n};\n\nconst colorToDatumIndex = (pixel: Uint8Array) => {\n  // this is the inverse of what's done via BIT_SHIFTERS in shader code (bijective color/index mapping)\n  const [p0 = 0, p1 = 0, p2 = 0, p3 = 0] = pixel;\n  const isEmptyArea = p0 + p1 + p2 + p3 < GEOM_INDEX_OFFSET; // ie. zero\n  return isEmptyArea ? NaN : p3 + 256 * (p2 + 256 * (p1 + 256 * p0)) - GEOM_INDEX_OFFSET;\n};\n\nconst getRegExp = (searchString: string): RegExp => {\n  let regex: RegExp;\n  try {\n    regex = new RegExp(searchString);\n  } catch {\n    return new RegExp('iIUiUYIuiGjhG678987gjhgfytr678576'); // todo find a quick failing regex\n  }\n  return regex;\n};\n\nconst isAttributeKey = (keyCandidate: string): keyCandidate is keyof typeof attributeLocations =>\n  keyCandidate in attributeLocations;\n\ninterface StateProps {\n  theme: FlamegraphStyle;\n  debugHistory: boolean;\n  columnarViewModel: FlameSpec['columnarData'];\n  controlProviderCallback: FlameSpec['controlProviderCallback'];\n  animationDuration: number;\n  chartDimensions: Size;\n  a11ySettings: ReturnType<typeof getA11ySettingsSelector>;\n  tooltipRequired: boolean;\n  canPinTooltip: boolean;\n  search: NonNullable<FlameSpec['search']>;\n  onSeachTextChange: (text: string) => void;\n  onElementOver: NonNullable<SettingsSpec['onElementOver']>;\n  onElementClick: NonNullable<SettingsSpec['onElementClick']>;\n  onElementOut: NonNullable<SettingsSpec['onElementOut']>;\n  onRenderChange: NonNullable<SettingsSpec['onRenderChange']>;\n}\n\ninterface DispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface OwnProps {\n  containerRef: BackwardRef;\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype FlameProps = StateProps & DispatchProps & OwnProps;\n\n/** @internal */\nexport type NavRect = FocusRect & { index: number };\n\nclass FlameComponent extends React.Component<FlameProps> {\n  static displayName = 'Flame';\n\n  // DOM API Canvas2d and WebGL resources\n  private ctx: CanvasRenderingContext2D | null = null;\n  private glContext: WebGL2RenderingContext | null = null;\n  private pickTexture: Texture = NullTexture;\n  private glResources: GLResources = NULL_GL_RESOURCES;\n  private readonly glCanvasRef: RefObject<HTMLCanvasElement> = createRef();\n\n  // native browser pinch zoom handling\n  private pinchZoomSetInterval: number = NaN;\n  private pinchZoomScale: number;\n\n  // mouse coordinates for the tooltip\n  private pointerX: number = NaN;\n  private pointerY: number = NaN;\n\n  // mouse coordinates for pinned tooltip\n  private pinnedPointerX: number = NaN;\n  private pinnedPointerY: number = NaN;\n\n  // pinned tooltip state\n  private tooltipPinned: boolean = false;\n  private tooltipSelectedSeries: TooltipValue[] = [];\n\n  // currently hovered over datum\n  private hoverIndex: number = NaN;\n  private tooltipValues: TooltipValue[] = [];\n\n  // drilldown animation\n  private animationRafId: number = NaN;\n  private prevFocusTime: number = NaN;\n  private prevNodeTweenTime: number = NaN;\n  private currentFocus: FocusRect;\n  private targetFocus: FocusRect;\n\n  // panning\n  private startOfDragX: number = NaN;\n  private startOfDragY: number = NaN;\n  private startOfDragFocusLeft: number = NaN;\n  private startOfDragFocusTop: number = NaN; // todo top or bottom...does it even matter?\n\n  // text search\n  private readonly searchInputRef: RefObject<HTMLInputElement> = createRef();\n  private currentSearchString = '';\n  private currentSearchHitCount = 0;\n  private currentColor: Float32Array;\n  private caseSensitive = false;\n  private useRegex = false;\n  private focusedMatchIndex = NaN;\n\n  // wobble\n  private wobbleTimeLeft = 0;\n  private wobbleIndex = NaN;\n\n  // navigation\n  private navigator: NavigationStrategy;\n\n  constructor(props: Readonly<FlameProps>) {\n    super(props);\n    const columns = this.props.columnarViewModel;\n\n    // vector length checks\n    const datumCount = columns.position1.length / 2;\n    if (datumCount % 1) throw new Error('flame error: position1 vector must have even values (x/y pairs)');\n    if (datumCount * 2 !== columns.position0.length)\n      throw new Error('flame error: Mismatch between position0 (xy) and position1 (xy) length');\n    if (datumCount !== columns.size0.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and size0 length');\n    if (datumCount !== columns.size1.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and size1 length');\n    if (datumCount * 4 !== columns.color.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and color (rgba) length');\n    if (datumCount !== columns.value.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and value length');\n    if (datumCount !== columns.label.length)\n      throw new Error('flame error: Mismatch between position1 (xy) and label length');\n\n    this.targetFocus = this.getFocusOnRoot();\n\n    this.bindControls();\n    this.currentFocus = { ...this.targetFocus };\n\n    // Initialize nav queue with the root element\n    this.navigator = new NavButtonControlledZoomPanHistory({ ...this.getFocusOnRoot(), index: 0 });\n\n    // browser pinch zoom handling\n    this.pinchZoomSetInterval = NaN;\n    this.pinchZoomScale = browserRootWindow().visualViewport?.scale ?? 1;\n    this.setupViewportScaleChangeListener();\n\n    // search\n    this.currentColor = columns.color;\n\n    // node size/position tween time\n    this.prevNodeTweenTime =\n      columns.position0 === columns.position1 && columns.size0 === columns.size1 ? -Infinity : Infinity; // if nothing to tween, then skip it\n  }\n\n  private pinTooltip = (pinned: boolean): void => {\n    if (!pinned) {\n      this.unpinTooltip(true);\n      return;\n    }\n\n    this.tooltipPinned = true;\n    this.tooltipSelectedSeries = this.tooltipValues;\n    // this.setState({});\n  };\n\n  private toggleSelectedTooltipItem = (tooltipValue: TooltipValue): void => {\n    // selection is arbitrary for flame elements - just toggle single selection\n    if (!this.tooltipPinned) return;\n    this.tooltipSelectedSeries = this.tooltipSelectedSeries.length === 0 ? [tooltipValue] : [];\n    this.setState({});\n  };\n\n  private setSelectedTooltipItems = (tooltipValues: TooltipValue[]): void => {\n    this.tooltipSelectedSeries = tooltipValues;\n    this.setState({});\n  };\n\n  private focusOnNavElement(element?: NavRect) {\n    if (!element) {\n      return;\n    }\n    if (isFiniteNumber(element.index)) {\n      this.focusOnNode(element.index);\n    } else {\n      this.focusOnRect(element);\n    }\n  }\n\n  private bindControls() {\n    const { controlProviderCallback } = this.props;\n    if (controlProviderCallback.resetFocus) {\n      controlProviderCallback.resetFocus(() => this.resetFocus());\n    }\n    if (controlProviderCallback.focusOnNode) {\n      controlProviderCallback.focusOnNode((nodeIndex: number) => {\n        const rect = focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, nodeIndex);\n        this.navigator.add({ ...rect, index: nodeIndex });\n        this.focusOnNode(nodeIndex);\n      });\n    }\n    if (controlProviderCallback.search) {\n      controlProviderCallback.search((text: string) => {\n        if (!this.searchInputRef.current) return;\n        this.searchInputRef.current.value = text;\n        this.searchForText(false);\n      });\n    }\n  }\n\n  private resetFocus() {\n    this.navigator.reset();\n    this.targetFocus = this.getFocusOnRoot();\n    this.wobble(0);\n  }\n\n  private focusOnNode(nodeIndex: number) {\n    this.targetFocus = focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, nodeIndex);\n    this.wobble(nodeIndex);\n  }\n\n  private focusOnRect(rect: FocusRect) {\n    this.targetFocus = rect;\n    this.setState({});\n  }\n\n  private wobble(nodeIndex: number) {\n    this.wobbleTimeLeft = WOBBLE_DURATION;\n    this.wobbleIndex = nodeIndex;\n    this.prevFocusTime = NaN;\n    this.hoverIndex = NaN; // no highlight\n    this.setState({});\n  }\n\n  private getFocusOnRoot() {\n    return focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, 0);\n  }\n\n  private setupDevicePixelRatioChangeListener = () => {\n    // redraw if the devicePixelRatio changed, for example:\n    //   - applied browser zoom from the browser's top right hamburger menu (NOT the pinch zoom)\n    //   - changed monitor resolution\n    //   - dragged the browser to a monitor with a differing devicePixelRatio\n    window.matchMedia(`(resolution: ${window.devicePixelRatio}dppx)`).addEventListener(\n      'change',\n      () => {\n        this.setState({});\n        // this re-adds the `once` event listener (not sure if componentDidMount guarantees single execution)\n        // and the value in the `watchMedia` resolution needs to change as well\n        this.setupDevicePixelRatioChangeListener();\n      },\n      { once: true },\n    );\n  };\n\n  private setupViewportScaleChangeListener = () => {\n    window.clearInterval(this.pinchZoomSetInterval);\n    this.pinchZoomSetInterval = window.setInterval(() => {\n      const pinchZoomScale = browserRootWindow().visualViewport?.scale ?? 1; // not cached, to avoid holding a reference to a `window` object\n      if (pinchZoomScale !== this.pinchZoomScale) {\n        this.pinchZoomScale = pinchZoomScale;\n        this.setState({});\n      }\n    }, PINCH_ZOOM_CHECK_INTERVAL_MS);\n  };\n\n  componentDidMount = () => {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n\n    if (this.props.search.text.length > 0 && this.searchInputRef.current) {\n      this.searchInputRef.current.value = this.props.search.text;\n      this.searchForText(false);\n    }\n\n    this.drawCanvas();\n    this.props.onChartRendered();\n    this.setupDevicePixelRatioChangeListener();\n    this.props.containerRef().current?.addEventListener('wheel', this.preventScroll, { passive: false });\n  };\n\n  componentWillUnmount() {\n    this.props.containerRef().current?.removeEventListener('wheel', this.preventScroll);\n  }\n\n  private ensureTextureAndDraw = () => {\n    this.ensurePickTexture();\n    this.drawCanvas();\n  };\n\n  private chartDimensionsChanged({ height, width }: Size): boolean {\n    return this.props.chartDimensions.height !== height || this.props.chartDimensions.width !== width;\n  }\n\n  componentDidUpdate = ({ chartDimensions, search }: FlameProps) => {\n    if (!this.ctx) this.tryCanvasContext();\n    if (this.tooltipPinned && this.chartDimensionsChanged(chartDimensions)) {\n      this.unpinTooltip();\n    }\n    this.bindControls();\n    if (search.text !== this.props.search.text && this.searchInputRef.current) {\n      this.searchInputRef.current.value = this.props.search.text;\n      this.searchForText(false);\n    }\n\n    this.ensureTextureAndDraw();\n\n    // eg. due to chartDimensions (parentDimensions) change\n    // this.props.onChartRendered() // creates and infinite update loop\n  };\n\n  private pointerInMinimap = (x: number, y: number) =>\n    x === clamp(x, this.getMinimapLeft(), this.getMinimapLeft() + this.getMinimapWidth()) &&\n    y === clamp(y, this.getMinimapTop(), this.getMinimapTop() + this.getMinimapHeight());\n\n  private datumAtXY: PickFunction = (x, y) =>\n    this.glContext ? colorToDatumIndex(readPixel(this.glContext, x, y)) : NaN;\n\n  private updatePointerLocation(e: { clientX: number; clientY: number }) {\n    if (!this.props.forwardStageRef.current || !this.ctx) return;\n    const box = this.props.forwardStageRef.current.getBoundingClientRect();\n    this.pointerX = e.clientX - box.left;\n    this.pointerY = e.clientY - box.top;\n\n    if (!this.tooltipPinned) {\n      this.pinnedPointerX = this.pointerX;\n      this.pinnedPointerY = this.pointerY;\n    }\n  }\n\n  private unpinTooltip(redraw = false) {\n    this.pinnedPointerX = NaN;\n    this.pinnedPointerY = NaN;\n    this.tooltipPinned = false;\n    this.tooltipSelectedSeries = [];\n    this.updateHoverIndex();\n    if (redraw) {\n      this.smartDraw();\n    }\n  }\n\n  private getHoveredDatumIndex = () => {\n    const pr = window.devicePixelRatio * this.pinchZoomScale;\n    const x = this.tooltipPinned ? this.pinnedPointerX : this.pointerX;\n    const y = this.tooltipPinned ? this.pinnedPointerY : this.pointerY;\n    return this.datumAtXY(pr * x, pr * (this.props.chartDimensions.height - y));\n  };\n\n  private getDragDistanceX = () => this.pointerX - this.startOfDragX;\n  private getDragDistanceY = () => -(this.pointerY - this.startOfDragY);\n  private isDragging = ({ buttons }: { buttons: number }) => buttons & LEFT_MOUSE_BUTTON;\n\n  private handleMouseHoverMove = (e: React.MouseEvent<HTMLCanvasElement, MouseEvent>) => {\n    if (!this.isDragging(e)) {\n      e.stopPropagation();\n      this.updatePointerLocation(e);\n      if (!this.tooltipPinned) {\n        this.updateHoverIndex();\n      }\n    }\n  };\n\n  private updateHoverIndex() {\n    const hoveredDatumIndex = this.getHoveredDatumIndex();\n    const prevHoverIndex = this.hoverIndex >= 0 ? this.hoverIndex : NaN;\n    this.hoverIndex = hoveredDatumIndex;\n    if (!Object.is(this.hoverIndex, prevHoverIndex)) {\n      if (Number.isFinite(hoveredDatumIndex)) {\n        this.props.onElementOver([{ vmIndex: hoveredDatumIndex }]); // userland callback\n      } else {\n        this.hoverIndex = NaN;\n        this.props.onElementOut(); // userland callback\n      }\n    }\n\n    if (prevHoverIndex !== this.hoverIndex) {\n      const columns = this.props.columnarViewModel;\n      const hoverValue = this.hoverIndex >= 0 ? columns.value[this.hoverIndex] : null;\n      this.tooltipValues = !isNil(hoverValue)\n        ? [\n            {\n              label: columns.label[this.hoverIndex] ?? '',\n              color: getColor(columns.color, this.hoverIndex),\n              isHighlighted: false,\n              isVisible: true,\n              seriesIdentifier: { specId: '', key: '' },\n              value: hoverValue,\n              formattedValue: `${specValueFormatter(hoverValue)}`,\n              valueAccessor: this.hoverIndex,\n            },\n          ]\n        : [];\n    }\n    this.setState({}); // exact tooltip location needs an update\n  }\n\n  private handleMouseDragMove = (e: MouseEvent) => {\n    e.stopPropagation();\n    this.updatePointerLocation(e);\n\n    if (this.isDragging(e)) {\n      const dragInMinimap = this.pointerInMinimap(this.startOfDragX, this.startOfDragY);\n      const focusMoveDirection = dragInMinimap ? 1 : -1; // focus box moves in direction of drag: positive; opposite: negative\n      const { x0, x1, y0, y1 } = this.currentFocus;\n      const focusWidth = x1 - x0; // this stays constant during panning\n      const focusHeight = y1 - y0; // this stays constant during panning\n      if (Number.isNaN(this.startOfDragFocusLeft)) this.startOfDragFocusLeft = x0;\n      if (Number.isNaN(this.startOfDragFocusTop)) this.startOfDragFocusTop = y0;\n      const dragDistanceX = this.getDragDistanceX();\n      const dragDistanceY = this.getDragDistanceY();\n      const { width: chartWidth, height: chartHeight } = this.props.chartDimensions;\n      const focusChartWidth = chartWidth - PADDING_LEFT - PADDING_RIGHT;\n      const focusChartHeight = chartHeight - PADDING_TOP - PADDING_BOTTOM;\n      const dragSpeedX = (dragInMinimap ? MINIMAP_SIZE_RATIO_X / focusWidth : 1) / focusChartWidth;\n      const dragSpeedY = (dragInMinimap ? MINIMAP_SIZE_RATIO_Y / focusHeight : 1) / focusChartHeight;\n      const deltaIntentX = focusMoveDirection * dragDistanceX * dragSpeedX * focusWidth;\n      const deltaIntentY = focusMoveDirection * dragDistanceY * dragSpeedY * focusHeight;\n      const deltaCorrectionX =\n        deltaIntentX > 0\n          ? Math.min(0, 1 - (this.startOfDragFocusLeft + focusWidth + deltaIntentX))\n          : -Math.min(0, this.startOfDragFocusLeft + deltaIntentX);\n      const deltaCorrectionY =\n        deltaIntentY > 0\n          ? Math.min(0, 1 - (this.startOfDragFocusTop + focusHeight + deltaIntentY))\n          : -Math.min(0, this.startOfDragFocusTop + deltaIntentY);\n      const deltaX = deltaIntentX + deltaCorrectionX; // todo allow a bit of overdrag: use 0.95-0.98 times deltaCorrectionX and snap back on mouseup\n      const deltaY = deltaIntentY + deltaCorrectionY; // todo allow a bit of overdrag: use 0.95-0.98 times deltaCorrectionX and snap back on mouseup\n      const newX0 = clamp(this.startOfDragFocusLeft + deltaX, 0, 1); // to avoid negligible FP domain breaches\n      const newX1 = clamp(this.startOfDragFocusLeft + focusWidth + deltaX, 0, 1); // to avoid negligible FP domain breaches\n      const newY0 = clamp(this.startOfDragFocusTop + deltaY, 0, 1); // to avoid negligible FP domain breaches\n      const newY1 = clamp(this.startOfDragFocusTop + focusHeight + deltaY, 0, 1); // to avoid negligible FP domain breaches\n      const newFocus = { x0: newX0, x1: newX1, y0: newY0, y1: newY1 };\n      this.currentFocus = newFocus;\n      this.targetFocus = newFocus;\n      this.navigator.add({ ...newFocus, index: NaN });\n      this.smartDraw();\n    }\n  };\n\n  private clearDrag = () => {\n    this.startOfDragX = NaN;\n    this.startOfDragY = NaN;\n    this.startOfDragFocusLeft = NaN;\n    this.startOfDragFocusTop = NaN;\n  };\n\n  private resetDrag = () => {\n    this.startOfDragX = this.pointerX;\n    this.startOfDragY = this.pointerY;\n  };\n\n  private handleMouseDown = (e: React.MouseEvent<HTMLCanvasElement>) => {\n    e.stopPropagation();\n    if (e.button === SECONDARY_BUTTON || e.ctrlKey) return; // context menu click\n    if (Number.isNaN(this.pointerX + this.pointerY)) return; // don't reset from minimap\n    if (this.tooltipPinned) return; // prevent dragging while tooltip is pinned\n\n    this.resetDrag();\n\n    window.addEventListener('mousemove', this.handleMouseDragMove, { passive: true });\n    window.addEventListener('mouseup', this.handleMouseUp, { passive: true });\n  };\n\n  private handleContextMenu = (e: React.MouseEvent<HTMLCanvasElement>) => {\n    e.stopPropagation();\n    e.preventDefault(); // prevent browser context menu\n\n    if (this.tooltipPinned) {\n      this.handleUnpinningTooltip();\n      return;\n    }\n    if (!Number.isFinite(this.getHoveredDatumIndex())) {\n      // NOP if not hover a node\n      return;\n    }\n    window.addEventListener('keyup', this.handleKeyUp);\n    window.addEventListener('click', this.handleUnpinningTooltip);\n    window.addEventListener('visibilitychange', this.handleUnpinningTooltip);\n    this.pinTooltip(true);\n    this.setState({}); // updates cursor\n  };\n\n  private handleMouseUp = (e: MouseEvent) => {\n    e.stopPropagation();\n\n    window.removeEventListener('mousemove', this.handleMouseDragMove);\n    window.removeEventListener('mouseup', this.handleMouseUp);\n\n    if (this.tooltipPinned) {\n      this.unpinTooltip();\n      this.clearDrag();\n      return;\n    }\n\n    this.updatePointerLocation(e); // just in case: eg. the user tabbed away, moved mouse elsewhere, and came back\n    const dragDistanceX = this.getDragDistanceX(); // zero or NaN means that a non-zero drag didn't happen\n    const dragDistanceY = this.getDragDistanceY(); // zero or NaN means that a non-zero drag didn't happen\n    if (!dragDistanceX && !dragDistanceY) {\n      const hoveredDatumIndex = this.getHoveredDatumIndex();\n      const isDoubleClick = e.detail > 1;\n      const hasClickedOnRectangle = Number.isFinite(hoveredDatumIndex);\n      const mustFocus = SINGLE_CLICK_EMPTY_FOCUS || isDoubleClick !== hasClickedOnRectangle; // xor: either double-click on empty space, or single-click on a node\n      const isContextClick = e.button === SECONDARY_BUTTON || e.ctrlKey;\n\n      if (mustFocus && !isContextClick && !this.pointerInMinimap(this.pointerX, this.pointerY)) {\n        const rect = focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, hoveredDatumIndex);\n        this.navigator.add({ ...rect, index: hoveredDatumIndex });\n        this.focusOnNode(hoveredDatumIndex);\n        this.props.onElementClick([{ vmIndex: hoveredDatumIndex }]); // userland callback\n      }\n    }\n    this.clearDrag();\n    this.setState({});\n  };\n\n  private handleUnpinningTooltip = () => {\n    window.removeEventListener('keyup', this.handleKeyUp);\n    window.removeEventListener('click', this.handleUnpinningTooltip);\n    window.removeEventListener('visibilitychange', this.handleUnpinningTooltip);\n    this.pinTooltip(false);\n  };\n\n  static watchedKeys: KeyboardEvent['key'][] = ['Escape'];\n  private handleKeyUp = ({ key }: KeyboardEvent) => {\n    if (!FlameComponent.watchedKeys.includes(key)) return;\n\n    window.removeEventListener('keyup', this.handleKeyUp);\n\n    this.unpinTooltip();\n  };\n\n  private handleMouseLeave = (e: React.MouseEvent<HTMLCanvasElement>) => {\n    e.stopPropagation();\n    if (!this.tooltipPinned) {\n      this.smartDraw();\n    }\n  };\n\n  private preventScroll = (e: WheelEvent) => e.metaKey === IS_META_REQUIRED_FOR_ZOOM && e.preventDefault();\n\n  private handleWheel: WheelEventHandler = (e) => {\n    if (e.metaKey !== IS_META_REQUIRED_FOR_ZOOM) return; // one way: zoom; other way: let scroll happen\n\n    this.unpinTooltip();\n    this.updatePointerLocation(e);\n\n    const { x0, x1, y0, y1 } = this.currentFocus;\n    const wheelDelta = -e.deltaY; // mapbox convention: scroll down increases magnification\n    const delta = wheelDelta * ZOOM_SPEED;\n\n    const unitX = this.pointerX / this.props.chartDimensions.width;\n    const unitY = (this.props.chartDimensions.height - this.pointerY) / this.props.chartDimensions.height;\n    const zoomOut = delta <= 0;\n    const midX =\n      Math.abs(x0) < EPSILON && (zoomOut || this.pointerX < ZOOM_FROM_EDGE_BAND_LEFT)\n        ? 0\n        : Math.abs(x1 - 1) < EPSILON &&\n            (zoomOut || this.pointerX > this.props.chartDimensions.width - ZOOM_FROM_EDGE_BAND_RIGHT)\n          ? 1\n          : clamp(x0 + unitX * Math.abs(x1 - x0), 0, 1);\n    const midY =\n      Math.abs(y0) < EPSILON &&\n      (zoomOut || this.pointerY > this.props.chartDimensions.height - ZOOM_FROM_EDGE_BAND_BOTTOM)\n        ? 0\n        : Math.abs(y1 - 1) < EPSILON && (zoomOut || this.pointerY < ZOOM_FROM_EDGE_BAND_TOP)\n          ? 1\n          : clamp(y0 + unitY * Math.abs(y1 - y0), 0, 1);\n    const targetX0 = clamp(x0 - delta * (x0 - midX), 0, 1);\n    const targetX1 = clamp(x1 + delta * (midX - x1), 0, 1);\n    const targetY0 = clamp(y0 - delta * (y0 - midY), 0, 1);\n    const targetY1 = clamp(y1 + delta * (midY - y1), 0, 1);\n    const newX0 = Math.min(targetX0, midX); // to prevent lo/hi values from switching places\n    const newX1 = Math.max(targetX1, midX); // to prevent lo/hi values from switching places\n    const newY0 = Math.min(targetY0, midY); // to prevent lo/hi values from switching places\n    const newY1 = Math.max(targetY1, midY); // to prevent lo/hi values from switching places\n\n    const xZoom = (e.ctrlKey || !e.altKey) && newX1 - newX0 >= DEEPEST_ZOOM_RATIO;\n    const yZoom = (e.ctrlKey || e.altKey) && newY1 - newY0 >= unitRowPitch(this.props.columnarViewModel.position1);\n\n    if (xZoom || yZoom) {\n      const newFocus = {\n        x0: xZoom ? newX0 : x0,\n        x1: xZoom ? newX1 : x1,\n        y0: yZoom ? newY0 : y0,\n        y1: yZoom ? newY1 : y1,\n      };\n      this.navigator.add({ ...newFocus, index: NaN });\n      this.currentFocus = newFocus;\n      this.targetFocus = newFocus;\n    }\n    this.smartDraw();\n  };\n\n  private focusOnAllMatches = () => {\n    this.currentSearchHitCount = 0;\n    const searchString = this.currentSearchString;\n    const customizedSearchString = this.caseSensitive ? searchString : searchString.toLowerCase();\n    const regex = this.useRegex && getRegExp(searchString);\n    const columns = this.props.columnarViewModel;\n    this.currentColor = new Float32Array(columns.color);\n    const labels = columns.label;\n    const size = columns.size1;\n    const position = columns.position1;\n    const rowHeight = unitRowPitch(position);\n    const datumCount = labels.length;\n    let x0 = Infinity;\n    let x1 = -Infinity;\n    let y0 = Infinity;\n    let y1 = -Infinity;\n    // todo unify with matcher loop and setup in focusOnHit\n    for (let i = 0; i < datumCount; i++) {\n      const label = this.caseSensitive ? labels[i] : labels[i]?.toLowerCase();\n      if (regex ? label?.match(regex) : label?.includes(customizedSearchString)) {\n        this.currentSearchHitCount++;\n        x0 = Math.min(x0, position[2 * i] ?? 0);\n        x1 = Math.max(x1, (position[2 * i] ?? 0) + (size[i] ?? 0));\n        y0 = Math.min(y0, position[2 * i + 1] ?? 0);\n        y1 = Math.max(y1, (position[2 * i + 1] ?? 0) + rowHeight);\n      } else {\n        this.currentColor[4 * i + 3] *= 0.25; // multiply alpha\n      }\n    }\n\n    if (Number.isFinite(x0) && searchString.length > 0) {\n      Object.assign(this.targetFocus, focusForArea(this.props.chartDimensions.height, { x0, x1, y0, y1 }));\n      // disabled for now, reintroduce it if we want to include it into the history nav\n      // this.navigator.add({ ...this.targetFocus, index: NaN });\n    }\n  };\n\n  private uploadSearchColors = () => {\n    const colorSetter = this.glResources.attributes.get('color');\n    if (this.glContext && colorSetter && this.currentColor.length === this.props.columnarViewModel.color.length) {\n      uploadToWebgl(this.glContext, new Map([['color', colorSetter]]), { color: this.currentColor });\n    }\n  };\n\n  private searchForText = (force: boolean) => {\n    const input = this.searchInputRef.current;\n    const searchString = input?.value;\n    if (!input || typeof searchString !== 'string' || (searchString === this.currentSearchString && !force)) return;\n    this.currentSearchString = searchString;\n\n    // update focus rectangle if needed\n    this.focusOnAllMatches();\n\n    // update colors\n    this.uploadSearchColors();\n\n    // render\n    this.focusedMatchIndex = NaN;\n    this.setState({});\n  };\n\n  private handleEnterKey = (e: React.KeyboardEvent<HTMLCanvasElement | HTMLInputElement>) => {\n    e.stopPropagation();\n    if (e.key === 'Enter') {\n      if (e.shiftKey) {\n        this.previousHit();\n      } else {\n        this.nextHit();\n      }\n      return true;\n    }\n    return false;\n  };\n\n  private clearSearchText = () => {\n    if (!this.searchInputRef.current) return;\n    this.searchInputRef.current.value = '';\n    this.searchForText(false);\n  };\n\n  private handleEscapeKey = (e: React.KeyboardEvent<HTMLCanvasElement | HTMLInputElement>) => {\n    if (e.key === 'Escape') {\n      this.clearSearchText();\n    }\n  };\n\n  private handleSearchFieldKeyPress = (e: React.KeyboardEvent<HTMLCanvasElement | HTMLInputElement>) => {\n    if (this.handleEnterKey(e)) {\n      e.stopPropagation();\n    }\n  };\n\n  private focusOnHit = () => {\n    if (Number.isNaN(this.focusedMatchIndex)) {\n      // resetting to focus on everything\n      this.focusOnAllMatches();\n    } else {\n      let datumIndex = NaN;\n      let hitEnumerator = -1;\n      const searchString = this.currentSearchString;\n      const customizedSearchString = this.caseSensitive ? searchString : searchString.toLowerCase();\n      const regex = this.useRegex && getRegExp(searchString);\n      const labels = this.props.columnarViewModel.label;\n      // todo unify with matcher loop and setup in focusOnAllMatches\n      for (let i = 0; i < labels.length; i++) {\n        const label = this.caseSensitive ? labels[i] : labels[i]?.toLowerCase();\n        if (regex ? label?.match(regex) : label?.includes(customizedSearchString)) {\n          datumIndex = i;\n          hitEnumerator++;\n          if (hitEnumerator === this.focusedMatchIndex) break;\n        }\n      }\n      if (hitEnumerator >= 0) {\n        this.targetFocus = focusRect(this.props.columnarViewModel, this.props.chartDimensions.height, datumIndex);\n        // disable until we consider that part of the navigation\n        // this.navigator.add({ ...this.targetFocus, index: NaN });\n        this.prevFocusTime = NaN;\n        this.hoverIndex = NaN; // no highlight\n        this.wobbleTimeLeft = WOBBLE_DURATION;\n        this.wobbleIndex = datumIndex;\n      }\n    }\n  };\n\n  private previousHit = () => {\n    const hitCount = this.currentSearchHitCount;\n    if (!this.currentSearchString || hitCount === 0) return;\n    this.focusedMatchIndex = Number.isNaN(this.focusedMatchIndex)\n      ? hitCount - 1\n      : this.focusedMatchIndex === 0\n        ? NaN\n        : this.focusedMatchIndex - 1;\n    this.focusOnHit();\n    this.setState({});\n  };\n\n  private nextHit = () => {\n    const hitCount = this.currentSearchHitCount;\n    if (!this.currentSearchString || hitCount === 0) return;\n    this.focusedMatchIndex = this.focusedMatchIndex = Number.isNaN(this.focusedMatchIndex)\n      ? 0\n      : this.focusedMatchIndex === hitCount - 1\n        ? NaN\n        : this.focusedMatchIndex + 1;\n    this.focusOnHit();\n    this.setState({});\n  };\n\n  private getActiveCursor(): CSSProperties['cursor'] {\n    if (this.tooltipPinned) return DEFAULT_CSS_CURSOR;\n    if (this.startOfDragX) return 'grabbing';\n    if (this.hoverIndex >= 0) return 'pointer';\n    return 'grab';\n  }\n\n  render = () => {\n    const {\n      forwardStageRef,\n      chartDimensions: { width: requestedWidth, height: requestedHeight },\n      a11ySettings,\n      debugHistory,\n      theme,\n      canPinTooltip,\n    } = this.props;\n    const width = roundUpSize(requestedWidth);\n    const height = roundUpSize(requestedHeight);\n    const style: CSSProperties = {\n      width,\n      height,\n      top: 0,\n      left: 0,\n      padding: 0,\n      margin: 0,\n      border: 0,\n      position: 'absolute',\n      cursor: this.getActiveCursor(),\n    };\n\n    const dpr = window.devicePixelRatio * this.pinchZoomScale;\n    const canvasWidth = width * dpr;\n    const canvasHeight = height * dpr;\n    const hitCount = this.currentSearchHitCount;\n\n    const {\n      textColor,\n      buttonDisabledTextColor,\n      buttonBackgroundColor,\n      buttonDisabledBackgroundColor,\n      buttonTextColor,\n    } = theme.navigation;\n\n    return (\n      <>\n        <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n          <canvas /* WebGL2 layer */\n            ref={this.glCanvasRef}\n            className=\"echCanvasRenderer\"\n            width={canvasWidth}\n            height={canvasHeight}\n            style={style}\n            // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n            role=\"presentation\"\n          />\n          <canvas /* Canvas2d layer */\n            ref={forwardStageRef}\n            tabIndex={0}\n            className=\"echCanvasRenderer\"\n            width={canvasWidth}\n            height={canvasHeight}\n            onMouseMove={this.handleMouseHoverMove}\n            onMouseDown={this.handleMouseDown}\n            onContextMenu={canPinTooltip ? this.handleContextMenu : undefined}\n            onMouseLeave={this.handleMouseLeave}\n            onKeyPress={this.handleEnterKey}\n            onKeyUp={this.handleEscapeKey}\n            onWheel={this.handleWheel}\n            style={{ ...style, outline: 'none' }}\n            // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n            role=\"presentation\"\n          />\n        </figure>\n        <div\n          style={{\n            position: 'absolute',\n            transform: `translateY(${this.props.chartDimensions.height - PADDING_BOTTOM + 4}px)`,\n          }}\n        >\n          <label\n            title=\"Navigate back\"\n            style={{\n              color: this.navigator.canNavBackward() ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              marginLeft: 16,\n              marginRight: 4,\n              borderRadius: 4,\n              paddingInline: 4,\n              width: 18,\n              display: 'inline-block',\n              height: 16,\n              verticalAlign: 'middle',\n              textAlign: 'center',\n              backgroundColor: this.navigator.canNavBackward() ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n            }}\n          >\n            ᐸ\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => this.focusOnNavElement(this.navigator.navBackward())}\n              style={{ display: 'none' }}\n            />\n          </label>\n          <label\n            title=\"Reset\"\n            style={{\n              color: buttonTextColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              borderRadius: 4,\n              verticalAlign: 'middle',\n              backgroundColor: buttonBackgroundColor,\n            }}\n          >\n            ▲\n            <input type=\"button\" tabIndex={0} onClick={() => this.resetFocus()} style={{ display: 'none' }} />\n          </label>\n          <label\n            title=\"Navigate forward\"\n            style={{\n              color: this.navigator.canNavForward() ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              marginLeft: 4,\n              marginRight: 16,\n              borderRadius: 4,\n              paddingInline: 4,\n              verticalAlign: 'middle',\n              backgroundColor: this.navigator.canNavForward() ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n            }}\n          >\n            ᐳ\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => this.focusOnNavElement(this.navigator.navForward())}\n              style={{ display: 'none' }}\n            />\n          </label>\n          <input\n            ref={this.searchInputRef}\n            title=\"Search string or regex pattern\"\n            size={16}\n            type=\"text\"\n            tabIndex={0}\n            placeholder=\"Search string\"\n            onKeyPress={this.handleSearchFieldKeyPress}\n            onKeyUp={this.handleEscapeKey}\n            onChange={(e) => {\n              this.searchForText(false);\n              this.props.onSeachTextChange(e.currentTarget.value);\n            }}\n            style={{\n              border: 'none',\n              padding: 3,\n              outline: 'none',\n              color: textColor,\n              background: 'transparent',\n            }}\n          />\n          <label\n            title=\"Clear text\"\n            style={{\n              color: buttonTextColor,\n              background: buttonBackgroundColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              marginInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n            }}\n          >\n            Clear\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => {\n                if (this.currentSearchString && this.searchInputRef.current) {\n                  this.clearSearchText();\n                  this.props.onSeachTextChange('');\n                }\n              }}\n              style={{ display: 'none' }}\n            />\n          </label>\n\n          <label\n            title=\"Case sensitivity (highlighted: case sensitive)\"\n            style={{\n              backgroundColor:\n                this.caseSensitive && !this.useRegex ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n              color: this.caseSensitive && !this.useRegex ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              marginInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n            }}\n          >\n            Cc\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => {\n                if (!this.currentSearchString) return;\n                this.caseSensitive = !this.caseSensitive;\n                this.searchForText(true);\n              }}\n              style={{ display: 'none' }}\n            />\n          </label>\n          <label\n            title=\"Regex matching (highlighted: use regex)\"\n            style={{\n              color: this.useRegex ? buttonTextColor : buttonDisabledTextColor,\n              backgroundColor: this.useRegex ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              marginInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n            }}\n          >\n            . *\n            <input\n              type=\"button\"\n              tabIndex={0}\n              onClick={() => {\n                if (!this.currentSearchString) return;\n                this.useRegex = !this.useRegex;\n                this.searchForText(true);\n              }}\n              style={{ display: 'none' }}\n            />\n          </label>\n          <label\n            title=\"Previous hit\"\n            style={{\n              backgroundColor: hitCount ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n              color: hitCount ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              marginLeft: 16,\n              marginRight: 4,\n              paddingInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n              verticalAlign: 'middle',\n            }}\n          >\n            ◀\n            <input type=\"button\" tabIndex={0} onClick={this.previousHit} style={{ display: 'none' }} />\n          </label>\n          <label\n            title=\"Next hit\"\n            style={{\n              backgroundColor: hitCount ? buttonBackgroundColor : buttonDisabledBackgroundColor,\n              color: hitCount ? buttonTextColor : buttonDisabledTextColor,\n              fontWeight: 500,\n              paddingInline: 4,\n              borderRadius: 4,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n              verticalAlign: 'middle',\n            }}\n          >\n            ▶\n            <input type=\"button\" tabIndex={0} onClick={this.nextHit} style={{ display: 'none' }} />\n          </label>\n\n          <p\n            style={{\n              float: 'right',\n              padding: 3,\n              opacity: this.currentSearchString ? 1 : 0,\n              transition: 'opacity 250ms ease-in-out',\n              color: textColor,\n            }}\n          >\n            {`Match${Number.isNaN(this.focusedMatchIndex) ? 'es:' : `: ${this.focusedMatchIndex + 1} /`} ${hitCount}`}\n          </p>\n        </div>\n        <BasicTooltip\n          canPinTooltip={canPinTooltip}\n          onPointerMove={() => ({ type: ON_POINTER_MOVE, position: { x: NaN, y: NaN }, time: NaN })}\n          position={\n            this.tooltipPinned\n              ? { x: this.pinnedPointerX, y: this.pinnedPointerY, width: 0, height: 0 }\n              : { x: this.pointerX, y: this.pointerY, width: 0, height: 0 }\n          }\n          pinned={this.tooltipPinned}\n          selected={this.tooltipSelectedSeries}\n          pinTooltip={this.pinTooltip}\n          toggleSelectedTooltipItem={this.toggleSelectedTooltipItem}\n          setSelectedTooltipItems={this.setSelectedTooltipItems}\n          visible={\n            this.tooltipPinned || (this.props.tooltipRequired && this.hoverIndex >= 0 && !(this.wobbleTimeLeft > 0))\n          }\n          info={{\n            header: null,\n            values: this.tooltipValues,\n          }}\n          getChartContainerRef={this.props.containerRef}\n        />\n        {debugHistory && (\n          <div\n            style={{\n              position: 'absolute',\n              transform: `translate(20px, 20px)`,\n              background: 'beige',\n              opacity: 0.8,\n            }}\n          >\n            history:\n            <ul>\n              {this.navigator.queue().map((d, i) => {\n                return (\n                  <li key={`${d.index}-${i}`}>{`${Number.isNaN(d.index) ? 'ZOOM/PAN' : d.index}${\n                    this.navigator.index() === i ? '⬅' : ''\n                  }`}</li>\n                );\n              })}\n            </ul>\n          </div>\n        )}\n      </>\n    );\n  };\n\n  private smartDraw() {\n    // avoids an unnecessary setState for high frequency interactions once the tooltip is off\n    if (Number.isFinite(this.hoverIndex)) {\n      this.hoverIndex = NaN; // it's disturbing to have a tooltip while zooming/panning\n      this.setState({});\n    } else {\n      this.drawCanvas();\n    }\n  }\n\n  private drawCanvas = () => {\n    if (!this.ctx || !this.glContext || !this.pickTexture) return;\n\n    const renderFrame = drawFrame(\n      this.ctx,\n      this.glContext,\n      this.props.chartDimensions.width,\n      this.props.chartDimensions.height,\n      this.getMinimapWidth(),\n      this.getMinimapHeight(),\n      this.getMinimapLeft(),\n      this.getMinimapTop(),\n      window.devicePixelRatio * this.pinchZoomScale,\n      this.props.columnarViewModel,\n      this.pickTexture,\n      this.glResources.pickTextureRenderer,\n      this.glResources.roundedRectRenderer,\n      this.hoverIndex,\n      unitRowPitch(this.props.columnarViewModel.position1),\n      this.currentColor,\n      this.props.theme,\n    );\n\n    const anim = (t: DOMHighResTimeStamp) => {\n      const focusTimeDeltaMs = Number.isNaN(this.prevFocusTime) ? 0 : t - this.prevFocusTime;\n      this.prevFocusTime = t;\n\n      if (this.prevNodeTweenTime === Infinity) this.prevNodeTweenTime = t;\n      const nodeTweenTime = clamp((t - this.prevNodeTweenTime) / NODE_TWEEN_DURATION_MS, 0, 1);\n      const nodeTweenInProgress = nodeTweenTime < 1;\n\n      const dx0 = this.targetFocus.x0 - this.currentFocus.x0;\n      const dx1 = this.targetFocus.x1 - this.currentFocus.x1;\n      const dy0 = this.targetFocus.y0 - this.currentFocus.y0;\n      const dy1 = this.targetFocus.y1 - this.currentFocus.y1;\n\n      const currentExtentX = this.currentFocus.x1 - this.currentFocus.x0;\n      const currentExtentY = this.currentFocus.y1 - this.currentFocus.y0;\n\n      const relativeExpansionX = Math.max(1, (currentExtentX + dx1 - dx0) / currentExtentX);\n      const relativeExpansionY = Math.max(1, (currentExtentX + dy1 - dy0) / currentExtentY);\n      const jointRelativeExpansion = (relativeExpansionX + relativeExpansionY) / 2;\n\n      const convergenceRateX = Math.min(1, focusTimeDeltaMs * RECURRENCE_ALPHA_PER_MS_X) / jointRelativeExpansion;\n      const convergenceRateY = Math.min(1, focusTimeDeltaMs * RECURRENCE_ALPHA_PER_MS_Y) / jointRelativeExpansion;\n\n      this.currentFocus.x0 += convergenceRateX * dx0;\n      this.currentFocus.x1 += convergenceRateX * dx1;\n      this.currentFocus.y0 += convergenceRateY * dy0;\n      this.currentFocus.y1 += convergenceRateY * dy1;\n\n      this.wobbleTimeLeft -= focusTimeDeltaMs;\n      const wobbleAnimationInProgress = this.wobbleTimeLeft > 0;\n      const timeFromWobbleStart = clamp(WOBBLE_DURATION - this.wobbleTimeLeft, 0, WOBBLE_DURATION);\n\n      renderFrame(\n        [this.currentFocus.x0, this.currentFocus.x1, this.currentFocus.y0, this.currentFocus.y1],\n        this.wobbleIndex,\n        wobbleAnimationInProgress ? 0.01 + 0.99 * (0.5 - 0.5 * Math.cos(timeFromWobbleStart * WOBBLE_FREQUENCY)) : 0, // positive if it must wobble\n        nodeTweenTime,\n      );\n\n      const maxDiff = Math.max(Math.abs(dx0), Math.abs(dx1), Math.abs(dy0), Math.abs(dy1));\n      const focusAnimationInProgress = maxDiff > 1e-12;\n      if (focusAnimationInProgress || wobbleAnimationInProgress || nodeTweenInProgress) {\n        this.animationRafId = window.requestAnimationFrame(anim);\n      } else {\n        this.prevFocusTime = NaN;\n        this.currentFocus.x0 = this.targetFocus.x0;\n        this.currentFocus.x1 = this.targetFocus.x1;\n        this.currentFocus.y0 = this.targetFocus.y0;\n        this.currentFocus.y1 = this.targetFocus.y1;\n      }\n    };\n    window.cancelAnimationFrame(this.animationRafId);\n    this.animationRafId = window.requestAnimationFrame(anim);\n\n    this.props.onRenderChange(true); // emit API callback\n  };\n\n  private getMinimapWidth = () => this.props.chartDimensions.width / MINIMAP_SIZE_RATIO_X;\n  private getMinimapHeight = () => this.props.chartDimensions.height / MINIMAP_SIZE_RATIO_Y;\n  private getMinimapLeft = () => this.props.chartDimensions.width - this.getMinimapWidth();\n  private getMinimapTop = () => this.props.chartDimensions.height - this.getMinimapHeight();\n\n  private ensurePickTexture = () => {\n    const { width, height } = this.props.chartDimensions;\n    const pr = window.devicePixelRatio * this.pinchZoomScale;\n    const textureWidth = pr * width;\n    const textureHeight = pr * height;\n    const current = this.pickTexture;\n    if (\n      this.glContext &&\n      (current === NullTexture || current.width !== textureWidth || current.height !== textureHeight)\n    ) {\n      // (re)create texture\n      current.delete();\n      this.pickTexture =\n        createTexture(this.glContext, {\n          textureIndex: 0,\n          width: textureWidth,\n          height: textureHeight,\n          internalFormat: GL.RGBA8,\n          data: null,\n        }) ?? NullTexture;\n      bindFramebuffer(this.glContext, GL.READ_FRAMEBUFFER, this.pickTexture.target());\n    }\n  };\n\n  private initializeGL = (gl: WebGL2RenderingContext) => {\n    this.glResources = ensureWebgl(gl, Object.keys(this.props.columnarViewModel).filter(isAttributeKey));\n    uploadToWebgl(gl, this.glResources.attributes, this.props.columnarViewModel);\n  };\n\n  private restoreGL = (gl: WebGL2RenderingContext) => {\n    this.initializeGL(gl);\n    this.pickTexture = NullTexture;\n    this.uploadSearchColors();\n    this.ensureTextureAndDraw();\n  };\n\n  private tryCanvasContext = () => {\n    const canvas = this.props.forwardStageRef.current;\n    const glCanvas = this.glCanvasRef.current;\n\n    this.ctx = canvas && canvas.getContext('2d');\n    this.glContext = glCanvas && glCanvas.getContext('webgl2');\n\n    this.ensurePickTexture();\n\n    if (glCanvas && this.glContext && this.glResources === NULL_GL_RESOURCES) {\n      glCanvas.addEventListener('webglcontextlost', this.contextLossHandler, false);\n      glCanvas.addEventListener('webglcontextrestored', this.contextRestoreHandler, false);\n\n      this.initializeGL(this.glContext);\n      // testContextLoss(this.glContext);\n    }\n  };\n\n  private contextLossHandler = (event: { preventDefault: () => void }) => {\n    // we could log it for telemetry etc todo add the option for a callback\n    window.cancelAnimationFrame(this.animationRafId);\n    event.preventDefault(); // this is needed for the context restoration callback to happen\n  };\n\n  private contextRestoreHandler = () => {\n    // browser trivia: the duplicate calling of ensureContextAndInitialRender and changing/resetting the width are needed for Chrome and Safari to properly restore the context upon loss\n    // we could log context loss/regain for telemetry etc todo add the option for a callback\n    const glCanvas = this.glCanvasRef.current;\n    if (!glCanvas || !this.glContext) return;\n    this.restoreGL(this.glContext);\n    const widthCss = glCanvas.style.width;\n    const widthNum = parseFloat(widthCss);\n    glCanvas.style.width = `${widthNum + 0.1}px`;\n    window.setTimeout(() => {\n      glCanvas.style.width = widthCss;\n      if (this.glContext) this.restoreGL(this.glContext);\n    }, 0);\n  };\n}\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  const flameSpec = getSpecsFromStore<FlameSpec>(state.specs, ChartType.Flame, SpecType.Series)[0];\n  const settingsSpec = getSettingsSpecSelector(state);\n  const tooltipSpec = getTooltipSpecSelector(state);\n  return {\n    theme: getChartThemeSelector(state).flamegraph,\n    debugHistory: settingsSpec.debug,\n    columnarViewModel: flameSpec?.columnarData ?? nullColumnarViewModel,\n    controlProviderCallback: flameSpec?.controlProviderCallback ?? {},\n    animationDuration: flameSpec?.animation.duration ?? 0,\n    chartDimensions: state.parentDimensions,\n    a11ySettings: getA11ySettingsSelector(state),\n    tooltipRequired: tooltipSpec.type !== TooltipType.None,\n    canPinTooltip: isPinnableTooltip(state),\n    search: flameSpec?.search ?? { text: '' },\n    onSeachTextChange: flameSpec?.onSearchTextChange ?? (() => {}),\n    // mandatory charts API protocol; todo extract these mappings once there are other charts like Flame\n    onElementOver: settingsSpec.onElementOver ?? (() => {}),\n    onElementClick: settingsSpec.onElementClick ?? (() => {}),\n    onElementOut: settingsSpec.onElementOut ?? (() => {}),\n    onRenderChange: settingsSpec.onRenderChange ?? (() => {}), // todo eventually also update data props on a local .echChartStatus element: data-ech-render-complete={rendered} data-ech-render-count={renderedCount} data-ech-debug-state={debugStateString}\n  };\n};\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst FlameChartLayers = connect(mapStateToProps, mapDispatchToProps)(FlameComponent);\n\n/** @internal */\nexport const FlameWithTooltip = (containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) => (\n  <FlameChartLayers forwardStageRef={forwardStageRef} containerRef={containerRef} />\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { FlameWithTooltip } from './flame_chart';\nimport { ChartType } from '..';\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { LegendItemExtraValues } from '../../common/legend';\nimport { SeriesKey } from '../../common/series_id';\nimport { InternalChartState } from '../../state/chart_state';\nimport { InitStatus } from '../../state/selectors/get_internal_is_intialized';\n\n/** @internal */\nexport class FlameState implements InternalChartState {\n  chartType = ChartType.Flame;\n  getChartTypeDescription = () => 'Flame chart';\n  chartRenderer = FlameWithTooltip;\n\n  // default empty properties, unused in Flame\n  eventCallbacks = () => {};\n  isInitialized = () => InitStatus.Initialized;\n  isBrushAvailable = () => false;\n  isBrushing = () => false;\n  isChartEmpty = () => false;\n  canDisplayChartTitles = () => false;\n  getLegendItemsLabels = () => [];\n  getLegendItems = () => [];\n  getLegendExtraValues = () => new Map<SeriesKey, LegendItemExtraValues>();\n  getPointerCursor = () => DEFAULT_CSS_CURSOR;\n  getTooltipAnchor = () => ({ x: 0, y: 0, width: 0, height: 0 });\n  isTooltipVisible = () => ({ visible: false, isExternal: false, displayOnly: false, isPinnable: false });\n  getTooltipInfo = () => ({ header: null, values: [] });\n  getProjectionContainerArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getMainProjectionArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getBrushArea = () => null;\n  getDebugState = () => ({});\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { NavRect } from './flame_chart';\n\nfunction isZoomPanNav(nav?: NavRect) {\n  return nav && Number.isNaN(nav.index);\n}\n\n/** @internal */\nexport abstract class NavigationStrategy {\n  navIndex = 0;\n  navQueue: NavRect[] = [];\n  root: NavRect;\n  lastZoom: NavRect | undefined;\n\n  constructor(root: NavRect) {\n    this.root = root;\n    this.navQueue.push(this.root);\n  }\n\n  abstract add(toAdd: NavRect): void;\n\n  navForward() {\n    if (!this.canNavForward()) {\n      return;\n    }\n    this.navIndex++;\n    return this.current();\n  }\n\n  navBackward() {\n    if (!this.canNavBackward()) {\n      return;\n    }\n    this.navIndex--;\n    return this.current();\n  }\n\n  canNavForward = () => this.navIndex < this.navQueue.length - 1;\n\n  canNavBackward = () => this.navQueue.length > 0 && this.navIndex > 0;\n\n  current = (): NavRect | undefined => this.navQueue[this.navIndex];\n\n  next = (): NavRect | undefined => this.navQueue[this.navIndex + 1];\n\n  prev = (): NavRect | undefined => this.navQueue[this.navIndex - 1];\n\n  reset() {\n    this.navIndex = 0;\n    this.navQueue.splice(this.navIndex, Infinity, this.root);\n  }\n\n  backToTop = () => (this.navIndex = 0);\n\n  queue = () => this.navQueue;\n\n  index = () => this.navIndex;\n\n  lastInQueue = () => this.navIndex === this.navQueue.length - 1;\n}\n\n/**\n * Insert a click event between the current history item and the next one.\n * @internal\n */\nexport class InsertClicksEverywhere extends NavigationStrategy {\n  add(toAdd: NavRect) {\n    if (isZoomPanNav(toAdd)) {\n      return;\n    }\n    if (this.current()?.index !== toAdd.index) {\n      this.navQueue.splice(++this.navIndex, 0, toAdd);\n    }\n  }\n}\n\n/**\n * Add a click event after the current history item, and clear the rest of the history from here.\n * @internal\n */\nexport class ClearQueueTipAndAddClick extends NavigationStrategy {\n  add(toAdd: NavRect) {\n    if (isZoomPanNav(toAdd)) {\n      return;\n    }\n    if (this.current()?.index !== toAdd.index) {\n      this.navQueue.splice(++this.navIndex, Infinity, toAdd);\n    }\n  }\n}\n\n/**\n * Same as ClearQueueTipAndAddClick but  includes zoom/pan events only at the tip of the queue\n * @internal\n */\nexport class PushZoomPanToQueueTip extends NavigationStrategy {\n  add(toAdd: NavRect) {\n    if (isZoomPanNav(toAdd)) {\n      // do not add zoom/pan event if not at the end of the queue\n      if (!this.lastInQueue()) {\n        return;\n      } else {\n        // at the end of the queue, add the zoom event\n        if (isZoomPanNav(this.current())) {\n          // update the zoom event if the last is zoom\n          this.navQueue.splice(this.navIndex, 1, toAdd);\n        } else {\n          // add only at the last place\n          this.navQueue.splice(++this.navIndex, 0, toAdd);\n        }\n      }\n    } else {\n      if (this.lastInQueue()) {\n        if (isZoomPanNav(this.current())) {\n          // replace if last is zoom\n          this.navQueue.splice(this.navIndex, 1, toAdd);\n        } else {\n          // add only if differ from current\n          if (this.current()?.index !== toAdd.index) {\n            this.navQueue.splice(++this.navIndex, 0, toAdd);\n          }\n        }\n      } else {\n        // add only if differ from current\n        if (this.current()?.index !== toAdd.index) {\n          this.navQueue.splice(++this.navIndex, Infinity, toAdd);\n        }\n      }\n    }\n  }\n}\n\n/**\n * Add Zoom/Pan events when back/forward button are clicked\n * @internal\n */\nexport class NavButtonControlledZoomPanHistory extends NavigationStrategy {\n  navForward() {\n    if (!this.canNavForward()) {\n      return;\n    }\n    if (this.lastZoom) {\n      this.navQueue.splice(++this.navIndex, 0, { ...this.lastZoom });\n      this.lastZoom = undefined;\n    }\n    this.navIndex++;\n    return this.current();\n  }\n\n  navBackward() {\n    if (!this.canNavBackward()) {\n      return;\n    }\n    if (this.lastZoom) {\n      this.navQueue.splice(++this.navIndex, 0, { ...this.lastZoom });\n      this.lastZoom = undefined;\n    }\n    this.navIndex--;\n    return this.current();\n  }\n\n  add(toAdd: NavRect) {\n    if (isZoomPanNav(toAdd)) {\n      this.lastZoom = { ...toAdd };\n    } else {\n      this.lastZoom = undefined;\n      if (this.current()?.index !== toAdd.index) {\n        this.navQueue.splice(++this.navIndex, Infinity, toAdd);\n      }\n    }\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const BOX_GAP_HORIZONTAL = 0.5;\n\n/** @internal */\nexport const BOX_GAP_VERTICAL = 2;\n\nconst CANVAS_SIZE_INCREMENT = 256; // to avoid thrashing the layout and canvases on every one pixel width/height change\n\n/** @internal */\nexport const roundUpSize = (cssPixelSize: number) =>\n  CANVAS_SIZE_INCREMENT * Math.ceil(cssPixelSize / CANVAS_SIZE_INCREMENT);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { roundUpSize } from './common';\nimport { drawCanvas2d, drawRect } from './draw_canvas';\nimport { drawWebgl } from './draw_webgl';\nimport { Render, Texture } from '../../../common/kingly';\nimport { FlamegraphStyle } from '../../../utils/themes/theme';\nimport { ColumnarViewModel } from '../flame_api';\n\nconst CHART_BOX_LINE_WIDTH = 0.5;\nconst MINIMAP_FOCUS_BOX_LINE_WIDTH = 1;\nconst MINIMAP_BOX_LINE_WIDTH = 1;\n/** @internal */\nexport const PADDING_TOP = 16; // for the UI controls and the minimap protrusion\n/** @internal */\nexport const PADDING_BOTTOM = 24; // for the UI controls and the minimap protrusion\n/** @internal */\nexport const PADDING_LEFT = 16; // for the location indicator or edge zoom\n/** @internal */\nexport const PADDING_RIGHT = 16; // for aesthetic purposes or edge zoom\nconst FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH = 0.5;\nconst MINIMUM_FOCUS_INDICATOR_LENGTH = 4;\nconst TERMINAL_TICK_LINE_WIDTH = 1;\nconst TERMINAL_TICK_LINE_LENGTH = 4;\n\n/** @internal */\nexport const EPSILON = 1e-4;\n\n/** @internal */\nexport const drawFrame =\n  (\n    ctx: CanvasRenderingContext2D,\n    gl: WebGL2RenderingContext,\n    cssWidth: number,\n    cssHeight: number,\n    minimapWidth: number,\n    minimapHeight: number,\n    minimapLeft: number,\n    minimapTop: number,\n    dpr: number,\n    columnarGeomData: ColumnarViewModel,\n    pickTexture: Texture,\n    pickTextureRenderer: Render,\n    roundedRectRenderer: Render,\n    hoverIndex: number,\n    unitRowHeight: number,\n    currentColor: Float32Array,\n    theme: FlamegraphStyle,\n  ) =>\n  (currentFocus: [number, number, number, number], wobbleIndex: number, wobble: number, nodeTweenTime: number) => {\n    const canvasHeightExcess = (roundUpSize(cssHeight) - cssHeight) * dpr;\n\n    const minimapBottom = minimapTop + minimapHeight;\n\n    const minimapCanvasWidth = minimapWidth * dpr;\n    const minimapCanvasHeight = minimapHeight * dpr;\n    const minimapCanvasX = minimapLeft * dpr;\n    const minimapCanvasY = canvasHeightExcess;\n\n    const focusLayerCssWidth = cssWidth - PADDING_LEFT - PADDING_RIGHT;\n    const focusLayerCanvasWidth = focusLayerCssWidth * dpr;\n    const focusLayerCanvasOffsetX = PADDING_LEFT * dpr;\n\n    const focusLayerCssHeight = cssHeight - PADDING_TOP - PADDING_BOTTOM;\n\n    const fullFocus: [number, number, number, number] = [0, 1, 0, 1];\n\n    const { scrollbarThumb, scrollbarTrack } = theme;\n\n    const drawFocusLayer = (pickLayer: boolean) =>\n      drawWebgl(\n        gl,\n        nodeTweenTime,\n        focusLayerCanvasWidth,\n        focusLayerCssHeight * dpr,\n        focusLayerCanvasOffsetX,\n        (pickLayer ? 0 : canvasHeightExcess) + dpr * PADDING_BOTTOM,\n        pickTexture,\n        pickLayer ? pickTextureRenderer : roundedRectRenderer,\n        wobble ? NaN : hoverIndex, // no hover highlight during wobble\n        unitRowHeight,\n        currentFocus,\n        columnarGeomData.label.length,\n        true,\n        pickLayer,\n        wobbleIndex,\n        wobble,\n      );\n\n    const drawContextLayer = (pickLayer: boolean) =>\n      drawWebgl(\n        gl,\n        nodeTweenTime,\n        minimapCanvasWidth,\n        minimapCanvasHeight,\n        minimapCanvasX,\n        pickLayer ? 0 : minimapCanvasY,\n        pickTexture,\n        pickLayer ? pickTextureRenderer : roundedRectRenderer,\n        hoverIndex,\n        unitRowHeight,\n        fullFocus,\n        columnarGeomData.label.length,\n        false,\n        pickLayer,\n        wobbleIndex, // useful to wobble on the minimap too\n        wobble,\n      );\n\n    // base (focus) layer\n    drawFocusLayer(false);\n\n    // minimap geoms\n    drawContextLayer(false);\n\n    // base (focus) pick layer\n    drawFocusLayer(true);\n\n    // minimap pick layer -- just for clearing, to avoid hover tooltip\n    drawContextLayer(true);\n\n    // focus layer text\n    drawCanvas2d(\n      ctx,\n      nodeTweenTime,\n      focusLayerCssWidth,\n      focusLayerCssHeight,\n      PADDING_LEFT,\n      PADDING_TOP,\n      dpr,\n      columnarGeomData,\n      unitRowHeight,\n      currentFocus,\n      currentColor,\n    );\n\n    // focus chart border\n    drawRect(\n      ctx,\n      focusLayerCssWidth,\n      focusLayerCssHeight,\n      PADDING_LEFT,\n      focusLayerCssHeight + PADDING_TOP,\n      dpr,\n      fullFocus,\n      '',\n      'black',\n      CHART_BOX_LINE_WIDTH,\n    );\n\n    // focus chart horizontal placeholder\n    drawRect(\n      ctx,\n      focusLayerCssWidth,\n      0,\n      PADDING_LEFT,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH / 2,\n      dpr,\n      fullFocus,\n      '',\n      scrollbarTrack,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH,\n    );\n\n    // focus chart horizontal focus indicator\n    drawRect(\n      ctx,\n      Math.max(0, focusLayerCssWidth * (currentFocus[1] - currentFocus[0])),\n      0,\n      PADDING_LEFT + focusLayerCssWidth * currentFocus[0],\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH / 2,\n      dpr,\n      fullFocus,\n      '',\n      scrollbarThumb,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH,\n    );\n\n    // focus chart horizontal focus terminal - start\n    const atWallLeft = Math.abs(currentFocus[0]) < EPSILON ? 4 : 1;\n    drawRect(\n      ctx,\n      TERMINAL_TICK_LINE_WIDTH * atWallLeft,\n      TERMINAL_TICK_LINE_LENGTH * atWallLeft,\n      PADDING_LEFT + focusLayerCssWidth * currentFocus[0] - (TERMINAL_TICK_LINE_WIDTH * atWallLeft) / 2,\n      TERMINAL_TICK_LINE_LENGTH + (FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH * atWallLeft) / 2,\n      dpr,\n      fullFocus,\n      scrollbarThumb,\n      '',\n      0,\n    );\n\n    // focus chart horizontal focus terminal - end\n    const atWallRight = Math.abs(currentFocus[1] - 1) < EPSILON ? 4 : 1;\n    drawRect(\n      ctx,\n      TERMINAL_TICK_LINE_WIDTH * atWallRight,\n      TERMINAL_TICK_LINE_LENGTH * atWallRight,\n      PADDING_LEFT + focusLayerCssWidth * currentFocus[1] - (TERMINAL_TICK_LINE_WIDTH * atWallRight) / 2,\n      TERMINAL_TICK_LINE_LENGTH + (FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH * atWallRight) / 2,\n      dpr,\n      fullFocus,\n      scrollbarThumb,\n      '',\n      0,\n    );\n\n    // focus chart vertical placeholder\n    drawRect(\n      ctx,\n      0,\n      focusLayerCssHeight,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH / 2,\n      focusLayerCssHeight + PADDING_TOP,\n      dpr,\n      fullFocus,\n      '',\n      scrollbarTrack,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH,\n    );\n\n    // focus chart vertical focus indicator\n    drawRect(\n      ctx,\n      0,\n      Math.max(MINIMUM_FOCUS_INDICATOR_LENGTH, focusLayerCssHeight * (currentFocus[3] - currentFocus[2])),\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH / 2,\n      focusLayerCssHeight * (1 - currentFocus[2]) + PADDING_TOP,\n      dpr,\n      fullFocus,\n      '',\n      scrollbarThumb,\n      FOCUS_INDICATOR_PLACEHOLDER_LINE_WIDTH,\n    );\n\n    // focus chart vertical focus terminal - start\n    const atWallTop = Math.abs(currentFocus[2]) < EPSILON ? 4 : 1;\n    drawRect(\n      ctx,\n      TERMINAL_TICK_LINE_LENGTH + 1, // 1 is added to make it the same side as horizontal; todo check why\n      TERMINAL_TICK_LINE_WIDTH * atWallTop,\n      0,\n      focusLayerCssHeight * (1 - currentFocus[2]) + PADDING_TOP,\n      dpr,\n      fullFocus,\n      scrollbarThumb,\n      '',\n      0,\n    );\n\n    // focus chart vertical focus terminal - end\n    const atWallBottom = Math.abs(currentFocus[3] - 1) < EPSILON ? 4 : 1;\n    drawRect(\n      ctx,\n      TERMINAL_TICK_LINE_LENGTH + 1, // 1 is added to make it the same side as horizontal; todo check why\n      TERMINAL_TICK_LINE_WIDTH * atWallBottom,\n      0,\n      focusLayerCssHeight * (1 - currentFocus[3]) + PADDING_TOP,\n      dpr,\n      fullFocus,\n      scrollbarThumb,\n      '',\n      0,\n    );\n\n    // minimap box - erase Canvas2d text from the main chart that falls within the minimap area\n    drawRect(\n      ctx,\n      minimapWidth,\n      minimapHeight,\n      minimapLeft,\n      minimapBottom,\n      dpr,\n      fullFocus,\n      'rgba(255,255,255,1)',\n      '',\n      0,\n    );\n\n    // minimap box - make the Canvas2d transparent, so that the webgl layer underneath (minimap geoms) show up\n    drawRect(ctx, minimapWidth, minimapHeight, minimapLeft, minimapBottom, dpr, fullFocus, 'transparent', '', 0);\n\n    // minimap focus border\n    drawRect(\n      ctx,\n      minimapWidth,\n      minimapHeight,\n      minimapLeft,\n      minimapBottom,\n      dpr,\n      currentFocus,\n      '',\n      'magenta',\n      MINIMAP_FOCUS_BOX_LINE_WIDTH,\n    );\n\n    // minimap box rectangle\n    drawRect(\n      ctx,\n      minimapWidth,\n      minimapHeight,\n      minimapLeft,\n      minimapBottom,\n      dpr,\n      fullFocus,\n      '',\n      'black',\n      MINIMAP_BOX_LINE_WIDTH,\n    );\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BOX_GAP_HORIZONTAL, BOX_GAP_VERTICAL, roundUpSize } from './common';\nimport { DEFAULT_FONT_FAMILY } from '../../../common/default_theme_attributes';\nimport { cssFontShorthand } from '../../../common/text_utils';\nimport { LabelAccessor } from '../../../utils/common';\nimport { ColumnarViewModel } from '../flame_api';\n\nconst scale = (value: number, from: number, to: number) => (value - from) / (to - from);\nconst formatter: LabelAccessor<string> = (label: string) => label; // todo loop in API value\n\nconst TEXT_PAD_LEFT = 4;\nconst TEXT_PAD_RIGHT = 4;\nconst MIN_TEXT_LENGTH = 0; // in font height, so 1 means roughly 2 characters (latin characters are tall on average)\nconst ROW_OFFSET_Y = 0.45; // approx. middle line (text is middle anchored so tall bars with small fonts can still have vertically centered text)\nconst MAX_FONT_HEIGHT_RATIO = 1; // relative to the row height\nconst MAX_FONT_SIZE = 12;\n\nconst mix = (a: number = 1, b: number = 1, x: number = 1) => (1 - x) * a + x * b; // like the GLSL `mix`\n\n/** @internal */\nexport const drawCanvas2d = (\n  ctx: CanvasRenderingContext2D,\n  logicalTime: number,\n  cssWidth: number,\n  cssHeight: number,\n  cssOffsetX: number,\n  cssOffsetY: number,\n  dpr: number,\n  columnarGeomData: ColumnarViewModel,\n  rowHeight: number,\n  [focusLoX, focusHiX, focusLoY, focusHiY]: [number, number, number, number],\n  color: Float32Array,\n) => {\n  const zoomedRowHeight = rowHeight / Math.abs(focusHiY - focusLoY);\n  const rowHeightPx = zoomedRowHeight * cssHeight;\n  const fontSize = Math.min(\n    2.6 * Math.log2((zoomedRowHeight * cssHeight - BOX_GAP_VERTICAL) * MAX_FONT_HEIGHT_RATIO),\n    MAX_FONT_SIZE,\n  );\n  const minTextLengthCssPix = MIN_TEXT_LENGTH * fontSize; // don't render shorter text than this\n  const minRectWidthForTextInCssPix = minTextLengthCssPix + TEXT_PAD_LEFT + TEXT_PAD_RIGHT;\n  const minRectWidth = minRectWidthForTextInCssPix / cssWidth;\n  const textColor = 'black'; // todo it could come from config / theme or automatic decision like in other charts\n\n  // text rendering\n  ctx.save();\n  ctx.textAlign = 'left';\n  ctx.textBaseline = 'middle';\n  ctx.scale(dpr, dpr);\n  ctx.font = cssFontShorthand(\n    { fontFamily: DEFAULT_FONT_FAMILY, fontStyle: 'normal', fontVariant: 'normal', fontWeight: 'normal' },\n    fontSize,\n  );\n  ctx.clearRect(0, 0, roundUpSize(cssWidth + cssOffsetX), roundUpSize(cssHeight + cssOffsetY));\n  ctx.translate(cssOffsetX, cssOffsetY);\n  ctx.beginPath();\n  ctx.rect(0, 0, roundUpSize(cssWidth), cssHeight);\n  ctx.clip();\n  let lastTextColor = '';\n  let lastTextAlpha = 1;\n\n  columnarGeomData.label.forEach((dataName, i) => {\n    const label = formatter(dataName);\n    const size = mix(columnarGeomData.size0[i], columnarGeomData.size1[i], logicalTime);\n    // todo also trivially skip text outside the current view (eg. more than 1 row above currently selected node; or left/right of the currently selected node\n    // otherwise it becomes too choppy as the horizontal magnification makes rectangles wider for text even outside the chart\n    const scaledSize = size / (focusHiX - focusLoX);\n    if (label && scaledSize >= minRectWidth) {\n      const xNorm = mix(columnarGeomData.position0[2 * i], columnarGeomData.position1[2 * i], logicalTime);\n      const yNorm = mix(columnarGeomData.position0[2 * i + 1], columnarGeomData.position1[2 * i + 1], logicalTime);\n      if (xNorm + size < focusLoX || xNorm > focusHiX || yNorm + rowHeight < focusLoY || yNorm > focusHiY) return; // don't render what's outside\n      const baseX = scale(xNorm, focusLoX, focusHiX) * cssWidth;\n      const leftOutside = Math.max(0, -baseX);\n      const x = baseX + leftOutside; // don't start the text in the negative range, b/c it's not readable there\n      const y = cssHeight * (1 - scale(yNorm, focusLoY, focusHiY));\n      const baseWidth = scaledSize * cssWidth - BOX_GAP_HORIZONTAL - TEXT_PAD_RIGHT;\n      const width = baseWidth - leftOutside; // if a box is partially cut on the left, the remaining box becomes smaller\n      ctx.beginPath();\n      const renderedWidth = Math.min(width, cssWidth - x); // to not let text protrude on the right when zooming\n      ctx.rect(x, y - zoomedRowHeight * cssHeight, renderedWidth, rowHeightPx);\n      if (textColor !== lastTextColor) {\n        // as we're sorting the iteration, the number of color changes (API calls) is minimized\n        ctx.fillStyle = textColor;\n        lastTextColor = textColor;\n      }\n      const textAlpha = color[i * 4 + 3] ?? 1;\n      if (textAlpha !== lastTextAlpha) {\n        // as we're sorting the iteration, the number of color changes (API calls) is minimized\n        ctx.globalAlpha = textAlpha;\n        lastTextAlpha = textAlpha;\n      }\n      ctx.save();\n      ctx.clip();\n      ctx.fillText(label, x + TEXT_PAD_LEFT, y - ROW_OFFSET_Y * zoomedRowHeight * cssHeight);\n      ctx.restore();\n    }\n  });\n  ctx.restore();\n};\n\n/** @internal */\nexport const drawRect = (\n  ctx: CanvasRenderingContext2D,\n  cssWidth: number,\n  cssHeight: number,\n  left: number,\n  bottom: number,\n  dpr: number,\n  [focusLoX, focusHiX, focusLoY, focusHiY]: [number, number, number, number],\n  fillColor: string,\n  borderColor: string,\n  borderLineWidth: number,\n) => {\n  // text rendering\n  ctx.save();\n  ctx.scale(dpr, dpr);\n  ctx.beginPath();\n  const boxHeight = cssHeight * Math.abs(focusHiY - focusLoY);\n  const x = left + cssWidth * focusLoX + borderLineWidth / 2;\n  const y = bottom - boxHeight - focusLoY * cssHeight + borderLineWidth / 2;\n  const width = Math.max(borderLineWidth, cssWidth * (focusHiX - focusLoX) - borderLineWidth);\n  const height = Math.max(borderLineWidth, boxHeight - borderLineWidth);\n  if (fillColor === 'transparent') {\n    ctx.clearRect(x, y, width, height);\n  } else {\n    ctx.rect(x, y, width, height);\n  }\n  if (fillColor && fillColor !== 'transparent') {\n    ctx.fillStyle = fillColor;\n    ctx.fill();\n  }\n  if (borderColor && borderLineWidth > 0) {\n    ctx.strokeStyle = borderColor;\n    ctx.lineWidth = borderLineWidth;\n    ctx.stroke();\n  }\n  ctx.restore();\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BOX_GAP_HORIZONTAL, BOX_GAP_VERTICAL } from './common';\nimport { Render, Texture } from '../../../common/kingly';\nimport { GEOM_INDEX_OFFSET } from '../shaders';\n\n// text rendering and other config\nconst MAX_PADDING_RATIO = 0.25;\nconst MIN_FILL_RATIO = [1 - MAX_PADDING_RATIO, 0.6]; // retain at least 90% of the width and 60% of the height\nconst CORNER_RADIUS_RATIO = 0.25; // as a proportion of the shorter rectangle edge length\nconst VERTICES_PER_GEOM = 4; // assuming `gl.TRIANGLE_STRIP`\nconst DUMMY_INDEX = -1; // GLSL doesn't guarantee a NaN, and it's a shader integer anyway, so let's find a safe special number\n\n/** @internal */\nexport const drawWebgl = (\n  gl: WebGL2RenderingContext,\n  nodeTweenTime: number,\n  canvasWidth: number,\n  canvasHeight: number,\n  xOffset: number,\n  yOffset: number,\n  pickTexture: Texture,\n  renderer: Render,\n  hoverIndex: number,\n  rowHeight: number,\n  f: [number, number, number, number],\n  instanceCount: number,\n  focusLayer: boolean,\n  pickLayer: boolean,\n  wobbleIndex: number,\n  wobble: number,\n) =>\n  renderer({\n    target: pickLayer ? pickTexture.target() : null,\n    uniformValues: {\n      pickLayer,\n      nodeTweenTime: Math.max(0.001, nodeTweenTime), // for some reason, an exact zero will lead to `mix` as if it were 1 (glitch)\n      resolution: [canvasWidth, canvasHeight],\n      gapPx: pickLayer || !focusLayer ? [0, 0] : [BOX_GAP_HORIZONTAL, BOX_GAP_VERTICAL], // in CSS pixels (but let's not leave a gap for shape picking)\n      minFillRatio: MIN_FILL_RATIO,\n      cornerRadiusPx: pickLayer ? 0 : canvasHeight * rowHeight * CORNER_RADIUS_RATIO, // note that for perf reasons the fragment shaders are split anyway\n      hoverIndex: Number.isFinite(hoverIndex) ? hoverIndex + GEOM_INDEX_OFFSET : DUMMY_INDEX,\n      wobbleIndex: Number.isFinite(wobbleIndex) ? wobbleIndex + GEOM_INDEX_OFFSET : DUMMY_INDEX,\n      wobble,\n      rowHeight0: rowHeight,\n      rowHeight1: rowHeight,\n      focus: [f[0], f[1], 0, 0, f[2], f[3], 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],\n    },\n    viewport: { x: xOffset, y: yOffset, width: canvasWidth, height: canvasHeight }, // may conditionalize on textureWidthChanged || textureHeightChanged\n    clear: {\n      color: [0, 0, 0, focusLayer || pickLayer ? 0 : 0.03],\n      rect: [xOffset, yOffset, canvasWidth, canvasHeight],\n    },\n    draw:\n      pickLayer && !focusLayer\n        ? undefined\n        : {\n            geom: gl.TRIANGLE_STRIP,\n            offset: 0,\n            count: VERTICES_PER_GEOM,\n            instanceCount,\n          },\n  });\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  bindVertexArray,\n  createCompiledShader,\n  createLinkedProgram,\n  getAttributes,\n  getRenderer,\n  resetState,\n} from '../../../common/kingly';\nimport { GL } from '../../../common/webgl_constants';\nimport { attributeLocations, colorFrag, roundedRectFrag, roundedRectVert, simpleRectVert } from '../shaders';\nimport { GLResources, NULL_GL_RESOURCES } from '../types';\n\n/** @internal */\nexport function ensureWebgl(\n  gl: WebGL2RenderingContext,\n  instanceAttributes: Array<keyof typeof attributeLocations>,\n): GLResources {\n  resetState(gl);\n\n  /**\n   * Vertex array attributes\n   */\n\n  const vao = gl.createVertexArray();\n  if (!vao) return NULL_GL_RESOURCES;\n\n  bindVertexArray(gl, vao);\n\n  // by how many instances should each attribute advance?\n  instanceAttributes.forEach((name) => gl.vertexAttribDivisor(attributeLocations[name], 1));\n\n  /**\n   * Programs\n   */\n\n  const geomProgram = createLinkedProgram(\n    gl,\n    createCompiledShader(gl, GL.VERTEX_SHADER, roundedRectVert),\n    createCompiledShader(gl, GL.FRAGMENT_SHADER, roundedRectFrag),\n    attributeLocations,\n  );\n\n  const pickProgram = createLinkedProgram(\n    gl,\n    createCompiledShader(gl, GL.VERTEX_SHADER, simpleRectVert),\n    createCompiledShader(gl, GL.FRAGMENT_SHADER, colorFrag),\n    attributeLocations,\n  );\n\n  /**\n   * Resource allocation: Render setup\n   */\n\n  // couple the program with the attribute input and global GL flags\n  const roundedRectRenderer = getRenderer(gl, geomProgram, vao, { depthTest: false, blend: true });\n  const pickTextureRenderer = getRenderer(gl, pickProgram, vao, { depthTest: false, blend: false });\n\n  const attributes = getAttributes(gl, geomProgram, attributeLocations);\n\n  return { roundedRectRenderer, pickTextureRenderer, attributes };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Attributes } from '../../../common/kingly';\nimport { ColumnarViewModel } from '../flame_api';\n\n/** @internal */\nexport function uploadToWebgl(\n  gl: WebGL2RenderingContext,\n  attributes: Attributes,\n  columnarViewModel: Partial<ColumnarViewModel>,\n) {\n  attributes.forEach((setValue, key) => {\n    const value = columnarViewModel[key as keyof ColumnarViewModel];\n    if (value instanceof Float32Array) setValue(value);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const attributeLocations = {\n  position0: 0,\n  position1: 1,\n  size0: 2,\n  size1: 3,\n  color: 4,\n};\n\n/** @internal */\nexport const GEOM_INDEX_OFFSET = 1; // zero color means, empty area (no rectangle) so the rectangles are base 1 indexed for pick coloring\n\nconst vertTop = /* language=GLSL */ `#version 300 es\n  #pragma STDGL invariant(all)\n  precision highp int;\n  precision highp float;\n`;\n\nconst fragTop = /* language=GLSL */ `#version 300 es\n  precision highp int;\n  precision highp float;\n`;\n\nconst attribDefs = /* language=GLSL */ `\n  layout(location=${attributeLocations.position0}) in vec2 position0;\n  layout(location=${attributeLocations.position1}) in vec2 position1;\n  layout(location=${attributeLocations.size0}) in float size0;\n  layout(location=${attributeLocations.size1}) in float size1;\n  layout(location=${attributeLocations.color}) in vec4 color;\n`;\n\nconst uniformDefs = /* language=GLSL */ `\n  uniform mat4 focus; // [[focusLoX, focusHiX], [focusLoY, focusHiY]]\n  uniform vec2 resolution;\n  uniform vec2 gapPx;\n  uniform vec2 minFillRatio; // at least this ratio of the rectangle's full width/height must be filled\n  uniform float rowHeight0;\n  uniform float rowHeight1;\n  uniform float nodeTweenTime; // 0: start position; 1: end position\n  uniform float cornerRadiusPx;\n  uniform float hoverIndex;\n  uniform float wobbleIndex;\n  uniform float wobble;\n  uniform bool pickLayer;\n`;\n\nconst constants = /* language=GLSL */ `\n  const vec4 UNIT4 = vec4(1.0);\n  const uvec4 BIT_SHIFTERS = uvec4(24, 16, 8, 0); // helps pack a 32bit unsigned integer into the RGBA bytes\n  const float HOVER_OPACITY = 0.382; // arbitrary; set to the smaller part of the golden ratio\n  const int GEOM_INDEX_OFFSET = ${GEOM_INDEX_OFFSET};\n`;\n\nconst structGeom = /* language=GLSL */ `\n  struct Geom {\n    vec2 unitSquareCoord;\n    vec2 size;\n    vec4 glPosition;\n    vec4 fragmentColor;\n  };\n`;\n\nconst getViewable = /* language=GLSL */ `\n  vec2 getViewable() {\n    float viewableX = focus[0][1] - focus[0][0];\n    float viewableY = focus[1][1] - focus[1][0];\n    return vec2(viewableX, viewableY);\n  }\n`;\n\nconst getGeom = /* language=GLSL */ `\n  Geom getGeom(vec2 viewable, vec2 gap, vec2 maxGapRatio) {\n    // calculate the basic geometry invariant of gaps, rounding or zoom levels\n    int x = gl_VertexID & 1;        // x yields 0, 1, 0, 1 for gl_VertexID 0, 1, 2, 3\n    int y = (gl_VertexID >> 1) & 1; // y yields 0, 0, 1, 1 for gl_VertexID 0, 1, 2, 3\n    vec2 unitSquareCoord = vec2(x, y);\n    vec2 position = mix(position0, position1, nodeTweenTime);\n    vec2 size = mix(vec2(size0, rowHeight0), vec2(size1, rowHeight1), nodeTweenTime);\n    vec2 fullSizeXY = size * unitSquareCoord;\n\n    // determine what we're zooming/panning into\n    vec2 baseXY = fullSizeXY + position;\n    vec2 pan = vec2(focus[0][0], focus[1][0]);\n\n    // gl_VertexID iterates as an integer index 0, 1, 2, ..., (offset + 0, offset + 1, ..., offset + count - 1)\n    // these four coordinates form a rectangle, set up as two counterclockwise triangles with gl.TRIANGLE_STRIP\n    // clip coordinate x/y goes from -1 to 1 of the viewport, so we center with this 0.5 subtraction\n    vec2 gr = min(gap, maxGapRatio * fullSizeXY);\n    vec2 xy = baseXY - unitSquareCoord * gr;\n    vec2 zoomPannedXY = (xy - pan) / viewable;\n\n    // output the position and color values (approx. return values of our vertex shader)\n    // project [0, 1] normalized values to [-1, 1] homogeneous clip space values\n    vec4 glPosition = vec4(2.0 * zoomPannedXY - 1.0, 0, 1);\n\n    vec4 fragmentColor = pickLayer\n      ? vec4((uvec4(gl_InstanceID + GEOM_INDEX_OFFSET) >> BIT_SHIFTERS) % uvec4(256)) / 255.0\n      : vec4(\n          color.rgb,\n          color.a\n            * (gl_InstanceID == int(hoverIndex) - GEOM_INDEX_OFFSET ? HOVER_OPACITY : 1.0)\n            * (gl_InstanceID == int(wobbleIndex) - GEOM_INDEX_OFFSET && wobble > 0.0 ? 1.0 - wobble : 1.0)\n        );\n\n    return Geom(\n      unitSquareCoord,\n      size,\n      glPosition,\n      fragmentColor\n    );\n  }\n`;\n\n/** @internal */\nexport const simpleRectVert = /* language=GLSL */ `${vertTop}\n  ${attribDefs}\n  ${uniformDefs}\n\n  out vec4 fragmentColor;\n\n  ${constants}\n  ${structGeom}\n  ${getViewable}\n  ${getGeom}\n\n  void main() {\n    Geom g = getGeom(getViewable(), vec2(0), vec2(0));\n    gl_Position = g.glPosition;\n    fragmentColor = g.fragmentColor;\n  }\n`;\n\n/** @internal */\nexport const roundedRectVert = /* language=GLSL */ `${vertTop}\n  ${attribDefs}\n  ${uniformDefs}\n\n  out vec4 fragmentColor;\n  out vec2 corners[4];\n  out float radiusPx;\n\n  ${constants}\n  ${structGeom}\n  ${getViewable}\n  ${getGeom}\n\n  void main() {\n    vec2 viewable = getViewable();\n\n    // calculate the gap-aware geometry\n    vec2 zoomedResolution = resolution / viewable;\n    vec2 gap = gapPx / zoomedResolution;\n\n    vec2 maxGapRatio = 1.0 - minFillRatio;\n    Geom g = getGeom(viewable, gap, maxGapRatio);\n\n    gl_Position = g.glPosition;\n    fragmentColor = g.fragmentColor;\n\n    // calculate rounded corner metrics for interpolation\n    vec2 pixelSize = g.size * zoomedResolution;\n    radiusPx = min(cornerRadiusPx, 0.5 * min(pixelSize.x, pixelSize.y));\n\n    // output the corner helper values  (approx. return values of our vertex shader)\n    corners[0] = g.unitSquareCoord * g.size * zoomedResolution - radiusPx;\n    corners[1] = (g.unitSquareCoord * vec2(-1, 1) + vec2(1, 0)) * g.size * zoomedResolution - radiusPx;\n    corners[2] = (g.unitSquareCoord * vec2(1, -1) + vec2(0, 1)) * g.size * zoomedResolution - radiusPx;\n    corners[3] = (1.0 - g.unitSquareCoord) * g.size * zoomedResolution - radiusPx;\n  }\n`;\n\n/** @internal */\nexport const roundedRectFrag = /* language=GLSL */ `${fragTop}\n  in vec4 fragmentColor;\n  in vec2 corners[4];\n  in float radiusPx;\n\n  out vec4 fragColor;\n\n  void main() {\n    if((   min(0.0, sign(corners[0].x) + sign(corners[0].y) + sign(radiusPx - length(corners[0])) + 2.0)\n         + min(0.0, sign(corners[1].x) + sign(corners[1].y) + sign(radiusPx - length(corners[1])) + 2.0)\n         + min(0.0, sign(corners[2].x) + sign(corners[2].y) + sign(radiusPx - length(corners[2])) + 2.0)\n         + min(0.0, sign(corners[3].x) + sign(corners[3].y) + sign(radiusPx - length(corners[3])) + 2.0)\n       ) < 0.0) discard;\n    fragColor = fragmentColor;\n  }\n`;\n\n/** @internal */\nexport const colorFrag = /* language=GLSL */ `${fragTop}\n  in vec4 fragmentColor;\n  out vec4 fragColor;\n  void main() { fragColor = fragmentColor; }\n`;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Pixels } from '../../common/geometry';\nimport { Attributes, UseInfo } from '../../common/kingly';\n\n/** @internal */\nexport interface GLResources {\n  roundedRectRenderer: (u: UseInfo) => void;\n  pickTextureRenderer: (u: UseInfo) => void;\n  attributes: Attributes;\n}\n\n/** @internal */\nexport const NULL_GL_RESOURCES: GLResources = {\n  roundedRectRenderer: () => {},\n  pickTextureRenderer: () => {},\n  attributes: new Map(),\n};\n\n/** @internal */\nexport interface ContinuousDomainFocus {\n  currentTimestamp: number;\n  currentFocusX0: number;\n  currentFocusY0: number;\n  currentFocusX1: number;\n  currentFocusY1: number;\n  prevFocusX0: number;\n  prevFocusY0: number;\n  prevFocusX1: number;\n  prevFocusY1: number;\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels) => number;\n\n/** @internal */\nexport const nullColumnarViewModel = {\n  label: [],\n  value: new Float64Array(),\n  color: new Float32Array(),\n  position0: new Float32Array(),\n  position1: new Float32Array(),\n  size0: new Float32Array(),\n  size1: new Float32Array(),\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getGreensColorScale } from '../../../../common/color_library_wrappers';\nimport { Pixels, PointObject } from '../../../../common/geometry';\nimport { SpecType } from '../../../../specs/constants';\nimport { ValueFormatter } from '../../../../utils/common';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { BandFillColorAccessorInput, GoalLabelAccessor } from '../../specs';\nimport { GoalSubtype } from '../../specs/constants';\n\n/** @internal */\nexport interface BandViewModel {\n  value: number;\n  fillColor: string;\n  text: string[];\n}\n\ninterface TickViewModel {\n  value: number;\n  text: string;\n}\n\n/** @internal */\nexport interface BulletViewModel {\n  subtype: string;\n  base: number;\n  target?: number;\n  actual: number;\n  bands: Array<BandViewModel>;\n  ticks: Array<TickViewModel>;\n  labelMajor: string;\n  labelMinor: string;\n  centralMajor: string | GoalLabelAccessor;\n  centralMinor: string;\n  highestValue: number;\n  lowestValue: number;\n  aboveBaseCount: number;\n  belowBaseCount: number;\n  angleStart: number;\n  angleEnd: number;\n  tooltipValueFormatter: ValueFormatter;\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels) => Array<BulletViewModel>;\n\n/** @internal */\nexport type ShapeViewModel = {\n  theme: Theme['goal'];\n  bulletViewModel: BulletViewModel;\n  chartCenter: PointObject;\n  pickQuads: PickFunction;\n};\n\nconst commonDefaults = {\n  base: 0,\n  actual: 50,\n};\n\n/** @internal */\nexport const defaultGoalSpec = {\n  ...commonDefaults,\n  bandFillColor: ({ value, highestValue, lowestValue }: BandFillColorAccessorInput) => {\n    return getGreensColorScale(0.5, [highestValue, lowestValue])(value);\n  },\n  tickValueFormatter: ({ value }: BandFillColorAccessorInput) => String(value),\n  labelMajor: ({ base }: BandFillColorAccessorInput) => String(base),\n  labelMinor: () => 'unit',\n  centralMajor: ({ base }: BandFillColorAccessorInput) => String(base),\n  centralMinor: ({ target }: BandFillColorAccessorInput) => (target ? String(target) : ''),\n  bandLabels: [],\n  angleStart: Math.PI + Math.PI / 4,\n  angleEnd: -Math.PI / 4,\n  tooltipValueFormatter: (value: number) => String(value),\n};\n\n/** @internal */\nexport const nullGoalViewModel = {\n  ...commonDefaults,\n  specType: SpecType.Series,\n  subtype: GoalSubtype.Goal,\n  bands: [],\n  ticks: [],\n  labelMajor: '',\n  labelMinor: '',\n  centralMajor: '',\n  centralMinor: '',\n  highestValue: 100,\n  lowestValue: 0,\n  aboveBaseCount: 0,\n  belowBaseCount: 0,\n  angleStart: 0,\n  angleEnd: 0,\n  tooltipValueFormatter: () => '',\n};\n\n/** @internal */\nexport const nullShapeViewModel = ({ goal }: Theme = LIGHT_THEME): ShapeViewModel => ({\n  theme: goal,\n  bulletViewModel: nullGoalViewModel,\n  chartCenter: { x: 0, y: 0 },\n  pickQuads: () => [],\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSagitta, getMinSagitta, getTransformDirection } from './utils';\nimport { GOLDEN_RATIO, TAU } from '../../../../common/constants';\nimport { PointObject, Radian, Rectangle } from '../../../../common/geometry';\nimport { cssFontShorthand, Font } from '../../../../common/text_utils';\nimport { CanvasRenderer } from '../../../../renderers/canvas';\nimport { measureText } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { GoalSubtype } from '../../specs/constants';\nimport { BulletViewModel } from '../types/viewmodel_types';\n\n/** @internal */\nexport interface Mark {\n  boundingBoxes: (ctx: CanvasRenderingContext2D) => Rectangle[];\n  render: CanvasRenderer;\n}\n\n/** @internal */\nexport class Section implements Mark {\n  protected readonly x: number;\n  protected readonly y: number;\n  protected readonly xTo: number;\n  protected readonly yTo: number;\n  protected readonly lineWidth: number;\n  protected readonly strokeStyle: string;\n  protected readonly capturePad: number;\n\n  constructor(\n    x: number,\n    y: number,\n    xTo: number,\n    yTo: number,\n    lineWidth: number,\n    strokeStyle: string,\n    capturePad: number,\n  ) {\n    this.x = x;\n    this.y = y;\n    this.xTo = xTo;\n    this.yTo = yTo;\n    this.lineWidth = lineWidth;\n    this.strokeStyle = strokeStyle;\n    this.capturePad = capturePad;\n  }\n\n  boundingBoxes() {\n    // modifying with half the line width is a simple yet imprecise method for ensuring that the\n    // entire ink is in the bounding box; depending on orientation and line ending, the bounding\n    // box may overstate the data ink bounding box, which is preferable to understating it\n    return this.lineWidth === 0\n      ? []\n      : [\n          {\n            x0: Math.min(this.x, this.xTo) - this.lineWidth / 2 - this.capturePad,\n            y0: Math.min(this.y, this.yTo) - this.lineWidth / 2 - this.capturePad,\n            x1: Math.max(this.x, this.xTo) + this.lineWidth / 2 + this.capturePad,\n            y1: Math.max(this.y, this.yTo) + this.lineWidth / 2 + this.capturePad,\n          },\n        ];\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    ctx.beginPath();\n    ctx.lineWidth = this.lineWidth;\n    ctx.strokeStyle = this.strokeStyle;\n    ctx.moveTo(this.x, this.y);\n    ctx.lineTo(this.xTo, this.yTo);\n    ctx.stroke();\n  }\n}\n\n/** @internal */\nexport const initialBoundingBox = (): Rectangle => ({ x0: Infinity, y0: Infinity, x1: -Infinity, y1: -Infinity });\n\n/** @internal */\nexport class Arc implements Mark {\n  protected readonly x: number;\n  protected readonly y: number;\n  protected readonly radius: number;\n  protected readonly startAngle: Radian;\n  protected readonly endAngle: Radian;\n  protected readonly anticlockwise: boolean;\n  protected readonly lineWidth: number;\n  protected readonly strokeStyle: string;\n  protected readonly arcBoxSamplePitch: number;\n  protected readonly capturePad: number;\n\n  constructor(\n    x: number,\n    y: number,\n    radius: number,\n    startAngle: number,\n    endAngle: number,\n    anticlockwise: boolean,\n    lineWidth: number,\n    strokeStyle: string,\n    capturePad: number,\n    arcBoxSamplePitch: number,\n  ) {\n    this.x = x;\n    this.y = y;\n    this.radius = radius;\n    this.startAngle = startAngle;\n    this.endAngle = endAngle;\n    this.anticlockwise = anticlockwise;\n    this.lineWidth = lineWidth;\n    this.strokeStyle = strokeStyle;\n    this.capturePad = capturePad;\n    this.arcBoxSamplePitch = arcBoxSamplePitch;\n  }\n\n  boundingBoxes() {\n    if (this.lineWidth === 0) return [];\n\n    const box = initialBoundingBox();\n\n    // instead of an analytical solution, we approximate with a GC-free grid sampler\n\n    // full circle rotations such that `startAngle' and `endAngle` are positive\n    const rotationCount = Math.ceil(Math.max(0, -this.startAngle, -this.endAngle) / TAU);\n    const startAngle = this.startAngle + rotationCount * TAU;\n    const endAngle = this.endAngle + rotationCount * TAU;\n\n    // snapping to the closest `arcBoxSamplePitch` increment\n    const angleFrom: Radian = Math.round(startAngle / this.arcBoxSamplePitch) * this.arcBoxSamplePitch;\n    const angleTo: Radian = Math.round(endAngle / this.arcBoxSamplePitch) * this.arcBoxSamplePitch;\n    const signedIncrement = this.arcBoxSamplePitch * Math.sign(angleTo - angleFrom);\n\n    for (let angle: Radian = angleFrom; angle <= angleTo; angle += signedIncrement) {\n      // unit vector for the angle direction\n      const vx = Math.cos(angle);\n      const vy = Math.sin(angle);\n      const innerRadius = this.radius - this.lineWidth / 2;\n      const outerRadius = this.radius + this.lineWidth / 2;\n\n      // inner point of the sector\n      const innerX = this.x + vx * innerRadius;\n      const innerY = this.y + vy * innerRadius;\n\n      // outer point of the sector\n      const outerX = this.x + vx * outerRadius;\n      const outerY = this.y + vy * outerRadius;\n\n      box.x0 = Math.min(box.x0, innerX - this.capturePad, outerX - this.capturePad);\n      box.y0 = Math.min(box.y0, innerY - this.capturePad, outerY - this.capturePad);\n      box.x1 = Math.max(box.x1, innerX + this.capturePad, outerX + this.capturePad);\n      box.y1 = Math.max(box.y1, innerY + this.capturePad, outerY + this.capturePad);\n\n      if (signedIncrement === 0) break; // happens if fromAngle === toAngle\n    }\n\n    return Number.isFinite(box.x0) ? [box] : [];\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    ctx.beginPath();\n    ctx.lineWidth = this.lineWidth;\n    ctx.strokeStyle = this.strokeStyle;\n    ctx.arc(this.x, this.y, this.radius, this.startAngle, this.endAngle, this.anticlockwise);\n    ctx.stroke();\n  }\n}\n\n/** @internal */\nexport class Text implements Mark {\n  protected readonly x: number;\n  protected readonly y: number;\n  protected readonly text: string;\n  protected readonly textAlign: CanvasTextAlign;\n  protected readonly textBaseline: CanvasTextBaseline;\n  protected readonly fontShape: Font;\n  protected readonly fontSize: number;\n  protected readonly fillStyle: string;\n  protected readonly capturePad: number;\n\n  constructor(\n    x: number,\n    y: number,\n    text: string,\n    textAlign: CanvasTextAlign,\n    textBaseline: CanvasTextBaseline,\n    fontShape: Font,\n    fontSize: number,\n    fillStyle: string,\n    capturePad: number,\n  ) {\n    this.x = x;\n    this.y = y;\n    this.text = text;\n    this.textAlign = textAlign;\n    this.textBaseline = textBaseline;\n    this.fontShape = fontShape;\n    this.fontSize = fontSize;\n    this.fillStyle = fillStyle;\n    this.capturePad = capturePad;\n  }\n\n  setCanvasTextState(ctx: CanvasRenderingContext2D) {\n    ctx.textAlign = this.textAlign;\n    ctx.textBaseline = this.textBaseline;\n    ctx.font = cssFontShorthand(this.fontShape, this.fontSize);\n  }\n\n  boundingBoxes(ctx: CanvasRenderingContext2D) {\n    if (this.text.length === 0) return [];\n    const box = measureText(ctx)(this.text, this.fontShape, this.fontSize);\n    return [\n      {\n        x0: -box.width / 2 + this.x - this.capturePad,\n        y0: -box.height / 2 + this.y - this.capturePad,\n        x1: box.width / 2 + this.x + this.capturePad,\n        y1: box.height / 2 + this.y + this.capturePad,\n      },\n    ];\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    this.setCanvasTextState(ctx);\n    ctx.beginPath();\n    ctx.fillStyle = this.fillStyle;\n    ctx.fillText(this.text, this.x, this.y);\n  }\n}\n\nfunction get<T>(o: { [k: string]: any }, name: string, dflt: T) {\n  return name in o ? o[name] || dflt : dflt;\n}\n\n/** @internal */\nexport function geoms(\n  bulletViewModel: BulletViewModel,\n  theme: Theme['goal'],\n  parentDimensions: Dimensions,\n  chartCenter: PointObject,\n): Mark[] {\n  const {\n    subtype,\n    lowestValue,\n    highestValue,\n    base,\n    target,\n    actual,\n    bands,\n    ticks,\n    labelMajor,\n    labelMinor,\n    centralMajor,\n    centralMinor,\n    angleEnd,\n    angleStart,\n  } = bulletViewModel;\n\n  const circular = subtype === GoalSubtype.Goal;\n  const vertical = subtype === GoalSubtype.VerticalBullet;\n\n  const domain: [number, number] = [lowestValue, highestValue];\n  const data = {\n    base: { value: base },\n    ...Object.fromEntries(bands.map(({ value }, index) => [`qualitative_${index}`, { value }])),\n    target: { value: target },\n    actual: { value: actual },\n    yOffset: { value: 0 },\n    labelMajor: { value: domain[circular || !vertical ? 0 : 1], text: labelMajor },\n    labelMinor: { value: domain[circular || !vertical ? 0 : 1], text: labelMinor },\n    ...Object.assign({}, ...ticks.map(({ value, text }, i) => ({ [`tick_${i}`]: { value, text } }))),\n    ...(circular\n      ? {\n          centralMajor: { value: 0, text: centralMajor },\n          centralMinor: { value: 0, text: centralMinor },\n        }\n      : {}),\n  };\n\n  const minSize = Math.min(parentDimensions.width, parentDimensions.height);\n\n  const referenceSize =\n    Math.min(\n      circular ? theme.maxCircularSize : theme.maxBulletSize,\n      circular ? minSize : vertical ? parentDimensions.height : parentDimensions.width,\n    ) *\n    (1 - 2 * theme.marginRatio);\n\n  const barThickness = Math.min(\n    circular ? theme.baselineArcThickness : theme.baselineBarThickness,\n    referenceSize * theme.barThicknessMinSizeRatio,\n  );\n\n  const tickLength = barThickness * Math.pow(1 / GOLDEN_RATIO, 3);\n  const tickOffset = -tickLength / 2 - barThickness / 2;\n  const tickFontSize = Math.min(theme.maxTickFontSize, referenceSize / 25);\n  const labelFontSize = Math.min(theme.maxLabelFontSize, referenceSize / 18);\n  const centralFontSize = Math.min(theme.maxCentralFontSize, referenceSize / 14);\n\n  const shape = circular ? 'arc' : 'line';\n\n  const abstractGeoms = [\n    ...bulletViewModel.bands.map((b, i) => ({\n      order: 0,\n      landmarks: {\n        from: i ? `qualitative_${i - 1}` : 'base',\n        to: `qualitative_${i}`,\n        yOffset: 'yOffset',\n      },\n      aes: { shape, fillColor: b.fillColor, lineWidth: barThickness },\n    })),\n    {\n      order: 1,\n      landmarks: { from: 'base', to: 'actual', yOffset: 'yOffset' },\n      aes: { shape, fillColor: theme.progressLine.stroke, lineWidth: tickLength },\n    },\n    ...(target\n      ? [\n          {\n            order: 2,\n            landmarks: { at: 'target', yOffset: 'yOffset' },\n            aes: { shape, fillColor: theme.targetLine.stroke, lineWidth: barThickness / GOLDEN_RATIO },\n          },\n        ]\n      : []),\n    ...bulletViewModel.ticks.map((b, i) => ({\n      order: 3,\n      landmarks: { at: `tick_${i}`, yOffset: 'yOffset' },\n      aes: { shape, fillColor: theme.tickLine.stroke, lineWidth: tickLength, axisNormalOffset: tickOffset },\n    })),\n    ...bulletViewModel.ticks.map((b, i) => ({\n      order: 4,\n      landmarks: { at: `tick_${i}`, yOffset: 'yOffset' },\n      aes: {\n        shape: 'text',\n        textAlign: vertical ? 'right' : 'center',\n        textBaseline: vertical ? 'middle' : 'top',\n        fillColor: theme.tickLabel.fill,\n        fontShape: { ...theme.tickLabel, fontVariant: 'normal', fontWeight: '500' },\n        axisNormalOffset: -barThickness,\n      },\n    })),\n    {\n      order: 5,\n      landmarks: { at: 'labelMajor' },\n      aes: {\n        shape: 'text',\n        axisNormalOffset: 0,\n        axisTangentOffset: circular || !vertical ? 0 : 2 * labelFontSize,\n        textAlign: vertical ? 'center' : 'right',\n        textBaseline: 'bottom',\n        fillColor: theme.majorLabel.fill,\n        fontShape: { ...theme.majorLabel, fontVariant: 'normal', fontWeight: '900' },\n      },\n    },\n    {\n      order: 5,\n      landmarks: { at: 'labelMinor' },\n      aes: {\n        shape: 'text',\n        axisNormalOffset: 0,\n        axisTangentOffset: circular || !vertical ? 0 : 2 * labelFontSize,\n        textAlign: vertical ? 'center' : 'right',\n        textBaseline: 'top',\n        fillColor: theme.minorLabel.fill,\n        fontShape: { ...theme.minorLabel, fontVariant: 'normal', fontWeight: '300' },\n      },\n    },\n    ...(circular\n      ? [\n          {\n            order: 6,\n            landmarks: { at: 'centralMajor', yOffset: 'yOffset' },\n            aes: {\n              shape: 'text',\n              textAlign: 'center',\n              textBaseline: 'bottom',\n              fillColor: theme.majorCenterLabel.fill,\n              fontShape: { ...theme.majorCenterLabel, fontVariant: 'normal', fontWeight: '900' },\n            },\n          },\n          {\n            order: 6,\n            landmarks: { at: 'centralMinor', yOffset: 'yOffset' },\n            aes: {\n              shape: 'text',\n              textAlign: 'center',\n              textBaseline: 'top',\n              fillColor: theme.minorCenterLabel.fill,\n              fontShape: { ...theme.minorCenterLabel, fontVariant: 'normal', fontWeight: '300' },\n            },\n          },\n        ]\n      : []),\n  ];\n\n  const maxWidth = abstractGeoms.reduce((p, g) => Math.max(p, get<number>(g.aes, 'lineWidth', 0)), 0);\n  const r = 0.5 * referenceSize - maxWidth / 2;\n\n  if (circular) {\n    const sagitta = getMinSagitta(angleStart, angleEnd, r);\n    const maxSagitta = getSagitta((3 / 2) * Math.PI, r);\n    const direction = getTransformDirection(angleStart, angleEnd);\n    data.yOffset.value = Math.abs(sagitta) >= maxSagitta ? 0 : (direction * (maxSagitta - sagitta)) / 2;\n  }\n\n  const fullSize = referenceSize;\n  const labelSize = fullSize / 2;\n  const pxRangeFrom = -fullSize / 2 + (circular || vertical ? 0 : labelSize);\n  const pxRangeTo = fullSize / 2 + (!circular && vertical ? -2 * labelFontSize : 0);\n  const pxRangeMid = (pxRangeFrom + pxRangeTo) / 2;\n  const pxRange = pxRangeTo - pxRangeFrom;\n\n  const domainExtent = domain[1] - domain[0];\n\n  const linearScale = (x: number) => pxRangeFrom + (pxRange * (x - domain[0])) / domainExtent;\n\n  const angleRange = angleEnd - angleStart;\n  const angleScale = (x: number) => angleStart + (angleRange * (x - domain[0])) / domainExtent;\n  const clockwise = angleStart > angleEnd; // todo refine this crude approach\n\n  return [...abstractGeoms]\n    .sort((a, b) => a.order - b.order)\n    .map(({ landmarks, aes }) => {\n      const at = get(landmarks, 'at', '');\n      const from = get(landmarks, 'from', '');\n      const to = get(landmarks, 'to', '');\n      const yOffset = get(landmarks, 'yOffset', '');\n      const textAlign = circular ? 'center' : get(aes, 'textAlign', '');\n      const fontShape = get(aes, 'fontShape', '');\n      const axisNormalOffset = get(aes, 'axisNormalOffset', 0);\n      const axisTangentOffset = get(aes, 'axisTangentOffset', 0);\n      const lineWidth = get(aes, 'lineWidth', 0);\n      const yOffsetValue = data[yOffset]?.value ?? 0;\n\n      const strokeStyle = get(aes, 'fillColor', '');\n      if (aes.shape === 'text') {\n        const { text } = data[at];\n        const label = at.slice(0, 5) === 'label';\n        const central = at.slice(0, 7) === 'central';\n        const textBaseline = label || central || !circular ? get(aes, 'textBaseline', '') : 'middle';\n        const fontSize = circular && label ? labelFontSize : circular && central ? centralFontSize : tickFontSize;\n        const scaledValue = circular ? angleScale(data[at].value) : data[at] && linearScale(data[at].value);\n        // prettier-ignore\n        const x = circular\n          ? (label || central ? 0 : (r - GOLDEN_RATIO * barThickness) * Math.cos(scaledValue))\n          : (vertical ? axisNormalOffset : axisTangentOffset + scaledValue);\n        // prettier-ignore\n        const y = circular\n          ? (label ? r : central ? 0 : -(r - GOLDEN_RATIO * barThickness) * Math.sin(scaledValue))\n          : (vertical ? -axisTangentOffset - scaledValue : -axisNormalOffset);\n        return new Text(\n          x + chartCenter.x,\n          y + chartCenter.y + yOffsetValue,\n          text,\n          textAlign,\n          textBaseline,\n          fontShape,\n          fontSize,\n          strokeStyle,\n          theme.capturePad,\n        );\n      } else if (aes.shape === 'arc') {\n        const cx = chartCenter.x + pxRangeMid;\n        const cy = chartCenter.y + yOffsetValue;\n        const radius = at ? r + axisNormalOffset : r;\n        const startAngle = at ? angleScale(data[at].value) + Math.PI / 360 : angleScale(data[from].value);\n        const endAngle = at ? angleScale(data[at].value) - Math.PI / 360 : angleScale(data[to].value);\n        // prettier-ignore\n        const anticlockwise = at || clockwise === (data[from].value < data[to].value);\n        return new Arc(\n          cx,\n          cy,\n          radius,\n          -startAngle,\n          -endAngle,\n          !anticlockwise,\n          lineWidth,\n          strokeStyle,\n          theme.capturePad,\n          theme.arcBoxSamplePitch,\n        );\n      } else {\n        const translateX = chartCenter.x + (vertical ? axisNormalOffset : axisTangentOffset);\n        const translateY = chartCenter.y - (vertical ? axisTangentOffset : axisNormalOffset) + yOffsetValue;\n        const atPx = data[at] && linearScale(data[at].value);\n        const fromPx = at ? atPx - 1 : linearScale(data[from].value);\n        const toPx = at ? atPx + 1 : linearScale(data[to].value);\n        const x0 = vertical ? translateX : translateX + fromPx;\n        const y0 = vertical ? translateY - fromPx : translateY;\n        const x1 = vertical ? translateX : translateX + toPx;\n        const y1 = vertical ? translateY - toPx : translateY;\n        return new Section(x0, y0, x1, y1, lineWidth, strokeStyle, theme.capturePad);\n      }\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TAU } from '../../../../common/constants';\nimport { Radian } from '../../../../common/geometry';\nimport { round } from '../../../../utils/common';\n\n/**\n * Set to half circle such that anything smaller than a half circle will not\n * continue to increase offset\n */\nconst LIMITING_ANGLE = Math.PI / 2;\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst hasTopGap = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return a <= -Math.PI / 2 && a >= (-Math.PI * 3) / 2 && b >= -Math.PI / 2 && b <= Math.PI / 2;\n};\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst hasBottomGap = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return a >= -Math.PI / 2 && a <= Math.PI / 2 && b < (Math.PI * 3) / 2 && b >= Math.PI / 2;\n};\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst isOnlyTopHalf = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return a >= 0 && b <= Math.PI;\n};\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst isOnlyBottomHalf = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return (a >= Math.PI && b <= 2 * Math.PI) || (a >= -Math.PI && b <= 0);\n};\n\n/**\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst isWithinLimitedDomain = (angleStart: Radian, angleEnd: Radian): boolean => {\n  const [a, b] = ([angleStart, angleEnd] as [number, number]).sort();\n  return a > -2 * Math.PI && b < 2 * Math.PI;\n};\n\n/** @internal */\nexport const getTransformDirection = (angleStart: Radian, angleEnd: Radian): 1 | -1 =>\n  hasTopGap(angleStart, angleEnd) || isOnlyBottomHalf(angleStart, angleEnd) ? -1 : 1;\n\n/**\n * Returns limiting angle form π/2 towards 3/2π from left and right, top and bottom\n * Angles are relative to mathematical angles of a unit circle from -2π > θ > 2π\n */\nconst controllingAngle = (angleStart: Radian, angleEnd: Radian): number => {\n  if (!isWithinLimitedDomain(angleStart, angleEnd)) return LIMITING_ANGLE * 2;\n  if (isOnlyTopHalf(angleStart, angleEnd) || isOnlyBottomHalf(angleStart, angleEnd)) return LIMITING_ANGLE;\n  if (!hasTopGap(angleStart, angleEnd) && !hasBottomGap(angleStart, angleEnd)) return LIMITING_ANGLE * 2;\n  const offset = hasBottomGap(angleStart, angleEnd) ? -Math.PI / 2 : Math.PI / 2;\n  return Math.max(Math.abs(angleStart + offset), Math.abs(angleEnd + offset), LIMITING_ANGLE);\n};\n\n/**\n * Normalize angles to minimum equivalent pair within -2π >= θ >= 2π\n * Assumes angles are no more that 2π apart.\n * @internal\n */\nexport function normalizeAngles(\n  angleStart: Radian,\n  angleEnd: Radian,\n  multiplier = 1,\n): [angleStart: Radian, angleEnd: Radian] {\n  const maxOffset = Math.max(Math.ceil(Math.abs(angleStart) / TAU), Math.ceil(Math.abs(angleEnd) / TAU)) - 1;\n  const offsetDirection = angleStart > 0 && angleEnd > 0 ? -1 : 1;\n  const offset = offsetDirection * maxOffset * TAU;\n  return [multiplier * (angleStart + offset), multiplier * (angleEnd + offset)];\n}\n\n/**\n * Angles are relative to mathmatical angles of a unit circle from -2π > θ > 2π\n * @internal\n */\nexport function getSagitta(angle: Radian, radius: number, fractionDigits: number = 1) {\n  const arcLength = angle * radius;\n  const halfCord = radius * Math.sin(arcLength / (2 * radius));\n  const lengthMiltiplier = arcLength > Math.PI ? 1 : -1;\n  const sagitta = radius + lengthMiltiplier * Math.sqrt(Math.pow(radius, 2) - Math.pow(halfCord, 2));\n  return round(sagitta, fractionDigits);\n}\n\n/**\n * Angles are relative to mathmatical angles of a unit circle from -2π > θ > 2π\n * @internal\n */\nexport function getMinSagitta(angleStart: Radian, angleEnd: Radian, radius: number, fractionDigits?: number) {\n  const normalizedAngles = normalizeAngles(angleStart, angleEnd);\n  const limitingAngle = controllingAngle(...normalizedAngles);\n  return getSagitta(limitingAngle * 2, radius, fractionDigits);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { clamp, clampAll, isBetween, isFiniteNumber, isNil } from './../../../../utils/common';\nimport { Radian } from '../../../../common/geometry';\nimport { ScaleContinuous } from '../../../../scales';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { GoalSpec } from '../../specs';\nimport { GoalSubtype } from '../../specs/constants';\nimport { BulletViewModel, PickFunction, ShapeViewModel } from '../types/viewmodel_types';\n\n/** @internal */\nexport function shapeViewModel(spec: GoalSpec, theme: Theme, chartDimensions: Dimensions): ShapeViewModel {\n  const { width, height } = chartDimensions;\n  const { chartMargins: margin } = theme;\n  const innerWidth = width - margin.left - margin.right;\n  const innerHeight = height - margin.top - margin.bottom;\n  const chartCenter = {\n    x: margin.left + innerWidth / 2,\n    y: margin.top + innerHeight / 2,\n  };\n\n  const {\n    subtype,\n    ticks,\n    bands,\n    domain,\n    bandFillColor,\n    tickValueFormatter,\n    labelMajor,\n    labelMinor,\n    centralMajor,\n    centralMinor,\n    bandLabels,\n    angleStart,\n    angleEnd,\n  } = spec;\n  const lowestValue = isFiniteNumber(domain.min) ? domain.min : 0;\n  const highestValue = isFiniteNumber(domain.max) ? domain.max : 1;\n  const base = clamp(spec.base, lowestValue, highestValue);\n  const target =\n    !isNil(spec.target) && spec.target <= highestValue && spec.target >= lowestValue ? spec.target : undefined;\n  const actual = clamp(spec.actual, lowestValue, highestValue);\n  const finalTicks = Array.isArray(ticks)\n    ? ticks.filter(isBetween(lowestValue, highestValue))\n    : new ScaleContinuous(\n        {\n          type: 'linear',\n          domain: [lowestValue, highestValue],\n          range: [0, 1],\n        },\n        {\n          desiredTickCount: ticks ?? getDesiredTicks(subtype, angleStart, angleEnd),\n        },\n      ).ticks();\n\n  const finalBands = Array.isArray(bands)\n    ? bands.reduce(...clampAll(lowestValue, highestValue))\n    : new ScaleContinuous(\n        {\n          type: 'linear',\n          domain: [lowestValue, highestValue],\n          range: [0, 1],\n        },\n        {\n          desiredTickCount: bands ?? getDesiredTicks(subtype, angleStart, angleEnd),\n        },\n      ).ticks();\n\n  const aboveBaseCount = finalBands.filter((b: number) => b > base).length;\n  const belowBaseCount = finalBands.filter((b: number) => b <= base).length;\n\n  const callbackArgs = {\n    base,\n    target,\n    actual,\n    highestValue,\n    lowestValue,\n    aboveBaseCount,\n    belowBaseCount,\n  };\n\n  const bulletViewModel: BulletViewModel = {\n    subtype,\n    base,\n    target,\n    actual,\n    bands: finalBands.map((value: number, index: number) => ({\n      value,\n      fillColor: bandFillColor({ value, index, ...callbackArgs }),\n      text: bandLabels,\n    })),\n    ticks: finalTicks.map((value: number, index: number) => ({\n      value,\n      text: tickValueFormatter({ value, index, ...callbackArgs }),\n    })),\n    labelMajor: typeof labelMajor === 'string' ? labelMajor : labelMajor({ value: NaN, index: 0, ...callbackArgs }),\n    labelMinor: typeof labelMinor === 'string' ? labelMinor : labelMinor({ value: NaN, index: 0, ...callbackArgs }),\n    centralMajor:\n      typeof centralMajor === 'string' ? centralMajor : centralMajor({ value: NaN, index: 0, ...callbackArgs }),\n    centralMinor:\n      typeof centralMinor === 'string' ? centralMinor : centralMinor({ value: NaN, index: 0, ...callbackArgs }),\n    highestValue,\n    lowestValue,\n    aboveBaseCount,\n    belowBaseCount,\n    angleStart,\n    angleEnd,\n    tooltipValueFormatter: () => '',\n  };\n\n  const pickQuads: PickFunction = (x, y) =>\n    -innerWidth / 2 <= x && x <= innerWidth / 2 && -innerHeight / 2 <= y && y <= innerHeight / 2\n      ? [bulletViewModel]\n      : [];\n\n  return {\n    theme: theme.goal,\n    chartCenter,\n    bulletViewModel,\n    pickQuads,\n  };\n}\n\nfunction getDesiredTicks(subtype: GoalSubtype, angleStart: Radian, angleEnd: Radian) {\n  if (subtype !== GoalSubtype.Goal) return 5;\n  const arc = Math.abs(angleStart - angleEnd);\n  return Math.ceil(arc / (Math.PI / 4));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../../common/colors';\nimport { clearCanvas, renderLayers, withContext } from '../../../../renderers/canvas';\nimport { Mark } from '../../layout/viewmodel/geoms';\n\n/** @internal */\nexport function renderCanvas2d(ctx: CanvasRenderingContext2D, dpr: number, geomObjects: Mark[], background: Color) {\n  withContext(ctx, () => {\n    // set some defaults for the overall rendering\n\n    // let's set the devicePixelRatio once and for all; then we'll never worry about it again\n    ctx.scale(dpr, dpr);\n\n    // all texts are currently center-aligned because\n    //     - the calculations manually compute and lay out text (word) boxes, so we can choose whatever\n    //     - but center/middle has mathematical simplicity and the most unassuming thing\n    //     - due to using the math x/y convention (+y is up) while Canvas uses screen convention (+y is down)\n    //         text rendering must be y-flipped, which is a bit easier this way\n    ctx.textAlign = 'center';\n    ctx.textBaseline = 'middle';\n    // this applies the mathematical x/y conversion (+y is North) which is easier when developing geometry\n    // functions - also, all renderers have flexibility (eg. SVG scale) and WebGL NDC is also +y up\n    // - in any case, it's possible to refactor for a -y = North convention if that's deemed preferable\n\n    renderLayers(ctx, [\n      // clear the canvas\n      () => clearCanvas(ctx, background),\n      () => geomObjects.forEach((mark) => withContext(ctx, () => mark.render(ctx))),\n    ]);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { MouseEvent, RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { renderCanvas2d } from './canvas_renderers';\nimport { Color, Colors } from '../../../../common/colors';\nimport { Rectangle } from '../../../../common/geometry';\nimport { GoalSemanticDescription, ScreenReaderSummary } from '../../../../components/accessibility';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { BandViewModel, nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { initialBoundingBox, Mark } from '../../layout/viewmodel/geoms';\nimport { geometries, getPrimitiveGeoms } from '../../state/selectors/geometries';\nimport { getFirstTickValueSelector, getGoalChartSemanticDataSelector } from '../../state/selectors/get_goal_chart_data';\nimport { getCaptureBoundingBox } from '../../state/selectors/picked_shapes';\n\ninterface ReactiveChartStateProps {\n  initialized: boolean;\n  geometries: ShapeViewModel;\n  geoms: Mark[];\n  chartContainerDimensions: Dimensions;\n  a11ySettings: A11ySettings;\n  bandLabels: BandViewModel[];\n  firstValue: number;\n  captureBoundingBox: Rectangle;\n  background: Color;\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface ReactiveChartOwnProps {\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype Props = ReactiveChartStateProps & ReactiveChartDispatchProps & ReactiveChartOwnProps;\n\nclass Component extends React.Component<Props> {\n  static displayName = 'Goal';\n\n  // firstRender = true; // this'll be useful for stable resizing of treemaps\n  private ctx: CanvasRenderingContext2D | null;\n\n  // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example\n  private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `<canvas>` dimensions\n\n  constructor(props: Readonly<Props>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  handleMouseMove(e: MouseEvent<HTMLCanvasElement>) {\n    const {\n      initialized,\n      chartContainerDimensions: { width, height },\n      forwardStageRef,\n      geometries,\n      captureBoundingBox: capture,\n    } = this.props;\n    if (!forwardStageRef.current || !this.ctx || !initialized || width === 0 || height === 0) {\n      return;\n    }\n    const picker = geometries.pickQuads;\n    const box = forwardStageRef.current.getBoundingClientRect();\n    const { chartCenter } = geometries;\n    const x = e.clientX - box.left;\n    const y = e.clientY - box.top;\n    if (capture.x0 <= x && x <= capture.x1 && capture.y0 <= y && y <= capture.y1) {\n      return picker(x - chartCenter.x, y - chartCenter.y);\n    }\n  }\n\n  render() {\n    const {\n      initialized,\n      chartContainerDimensions: { width, height },\n      forwardStageRef,\n      a11ySettings,\n      bandLabels,\n      firstValue,\n    } = this.props;\n    if (!initialized || width === 0 || height === 0) {\n      return null;\n    }\n    return (\n      <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n        <canvas\n          ref={forwardStageRef}\n          className=\"echCanvasRenderer\"\n          width={width * this.devicePixelRatio}\n          height={height * this.devicePixelRatio}\n          onMouseMove={this.handleMouseMove.bind(this)}\n          style={{\n            width,\n            height,\n          }}\n          // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n          role=\"presentation\"\n        >\n          <ScreenReaderSummary />\n          <GoalSemanticDescription bandLabels={bandLabels} firstValue={firstValue} {...a11ySettings} />\n        </canvas>\n      </figure>\n    );\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      renderCanvas2d(this.ctx, this.devicePixelRatio, this.props.geoms, this.props.background);\n    }\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  initialized: false,\n  geometries: nullShapeViewModel(),\n  geoms: [],\n  chartContainerDimensions: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  bandLabels: [],\n  firstValue: 0,\n  captureBoundingBox: initialBoundingBox(),\n  background: Colors.Transparent.keyword,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  return {\n    initialized: true,\n    geometries: geometries(state),\n    chartContainerDimensions: state.parentDimensions,\n    a11ySettings: getA11ySettingsSelector(state),\n    bandLabels: getGoalChartSemanticDataSelector(state),\n    firstValue: getFirstTickValueSelector(state),\n    geoms: getPrimitiveGeoms(state),\n    captureBoundingBox: getCaptureBoundingBox(state),\n    background: getChartThemeSelector(state).background.color,\n  };\n};\n\n/** @internal */\nexport const Goal = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const GoalSubtype = Object.freeze({\n  Goal: 'goal' as const,\n  HorizontalBullet: 'horizontalBullet' as const,\n  VerticalBullet: 'verticalBullet' as const,\n});\n/** @public */\nexport type GoalSubtype = $Values<typeof GoalSubtype>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { GoalSubtype } from './constants';\nimport { ChartType } from '../..';\nimport { Color } from '../../../common/colors';\nimport { TAU } from '../../../common/constants';\nimport { Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { LabelAccessor, round, stripUndefined, ValueFormatter } from '../../../utils/common';\nimport { Logger } from '../../../utils/logger';\nimport { defaultGoalSpec } from '../layout/types/viewmodel_types';\n\n/** @alpha */\nexport interface BandFillColorAccessorInput {\n  value: number;\n  index: number;\n  base: number;\n  target?: number;\n  highestValue: number;\n  lowestValue: number;\n  aboveBaseCount: number;\n  belowBaseCount: number;\n}\n\n/** @alpha */\nexport type BandFillColorAccessor = (input: BandFillColorAccessorInput) => Color;\n\n/** @alpha */\nexport type GoalLabelAccessor = LabelAccessor<BandFillColorAccessorInput>;\n\n/** @alpha */\nexport interface GoalDomainRange {\n  /**\n   * A finite number to defined the lower bound of the domain. Defaults to 0 if _not_ finite.\n   */\n  min: number;\n  /**\n   * A finite number to defined the upper bound of the domain. Defaults to 1 if _not_ finite.\n   */\n  max: number;\n}\n\n/** @alpha */\nexport interface GoalSpec extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Goal;\n  subtype: GoalSubtype;\n  base: number;\n  target?: number;\n  actual: number;\n  /**\n   * array of discrete band intervals or approximate number of desired bands\n   */\n  bands?: number | number[];\n  /**\n   * Array of discrete tick values or approximate number of desired ticks\n   */\n  ticks?: number | number[];\n  /**\n   * Domain of goal charts. Limits every value to within domain.\n   */\n  domain: GoalDomainRange;\n  bandFillColor: BandFillColorAccessor;\n  tickValueFormatter: GoalLabelAccessor;\n  labelMajor: string | GoalLabelAccessor;\n  labelMinor: string | GoalLabelAccessor;\n  centralMajor: string | GoalLabelAccessor;\n  centralMinor: string | GoalLabelAccessor;\n  angleStart: number;\n  angleEnd: number;\n  bandLabels: string[];\n  tooltipValueFormatter: ValueFormatter;\n}\n\nconst buildProps = buildSFProps<GoalSpec>()(\n  {\n    specType: SpecType.Series,\n    chartType: ChartType.Goal,\n  },\n  {\n    ...defaultGoalSpec,\n  },\n);\n\n/**\n * Add Goal spec to chart\n * @deprecated please use `Bullet` spec instead\n * @alpha\n */\nexport const Goal = function (\n  props: SFProps<\n    GoalSpec,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  const angleStart = props.angleStart ?? defaults.angleStart;\n  const angleEnd = props.angleEnd ?? defaults.angleEnd;\n  const constraints: Pick<typeof props, 'angleEnd'> = {};\n\n  if (Math.abs(angleEnd - angleStart) > TAU) {\n    constraints.angleEnd = angleStart + TAU * Math.sign(angleEnd - angleStart);\n\n    Logger.warn(`The total angle of the goal chart must not exceed 2π radians.\\\nTo prevent overlapping, the value of \\`angleEnd\\` will be replaced.\n\n  original: ${angleEnd} (~${round(angleEnd / Math.PI, 3)}π)\n  replaced: ${constraints.angleEnd} (~${round(constraints.angleEnd / Math.PI, 3)}π)\n`);\n  }\n\n  useSpecFactory<GoalSpec>({\n    ...defaults,\n    ...stripUndefined(props),\n    ...overrides,\n    ...constraints,\n  });\n  return null;\n};\n\n/** @public */\nexport type GoalProps = ComponentProps<typeof Goal>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { getChartTypeDescriptionSelector } from './selectors/get_chart_type_description';\nimport { getGoalSpecSelector } from './selectors/get_goal_spec';\nimport { isTooltipVisibleSelector } from './selectors/is_tooltip_visible';\nimport { createOnElementClickCaller } from './selectors/on_element_click_caller';\nimport { createOnElementOutCaller } from './selectors/on_element_out_caller';\nimport { createOnElementOverCaller } from './selectors/on_element_over_caller';\nimport { getTooltipInfoSelector } from './selectors/tooltip';\nimport { ChartType } from '../..';\nimport { DEFAULT_CSS_CURSOR } from '../../../common/constants';\nimport { LegendItem } from '../../../common/legend';\nimport { Tooltip } from '../../../components/tooltip/tooltip';\nimport { InternalChartState, GlobalChartState, BackwardRef, TooltipVisibility } from '../../../state/chart_state';\nimport { getActivePointerPosition } from '../../../state/selectors/get_active_pointer_position';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { LegendItemLabel } from '../../../state/selectors/get_legend_items_labels';\nimport { DebugState } from '../../../state/types';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { Goal } from '../renderer/canvas/connected_component';\n\nconst EMPTY_MAP = new Map();\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\nconst EMPTY_LEGEND_ITEM_LIST: LegendItemLabel[] = [];\n\n/** @internal */\nexport class GoalState implements InternalChartState {\n  chartType = ChartType.Goal;\n\n  onElementClickCaller: (state: GlobalChartState) => void;\n\n  onElementOverCaller: (state: GlobalChartState) => void;\n\n  onElementOutCaller: (state: GlobalChartState) => void;\n\n  constructor() {\n    this.onElementClickCaller = createOnElementClickCaller();\n    this.onElementOverCaller = createOnElementOverCaller();\n    this.onElementOutCaller = createOnElementOutCaller();\n  }\n\n  isInitialized(globalState: GlobalChartState) {\n    return getGoalSpecSelector(globalState) !== null ? InitStatus.Initialized : InitStatus.ChartNotInitialized;\n  }\n\n  isBrushAvailable() {\n    return false;\n  }\n\n  isBrushing() {\n    return false;\n  }\n\n  isChartEmpty() {\n    return false;\n  }\n\n  getLegendItems() {\n    return EMPTY_LEGEND_LIST;\n  }\n\n  getLegendItemsLabels() {\n    return EMPTY_LEGEND_ITEM_LIST;\n  }\n\n  getLegendExtraValues() {\n    return EMPTY_MAP;\n  }\n\n  chartRenderer(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) {\n    return (\n      <>\n        <Tooltip getChartContainerRef={containerRef} />\n        <Goal forwardStageRef={forwardStageRef} />\n      </>\n    );\n  }\n\n  getPointerCursor() {\n    return DEFAULT_CSS_CURSOR;\n  }\n\n  isTooltipVisible(globalState: GlobalChartState): TooltipVisibility {\n    return {\n      visible: isTooltipVisibleSelector(globalState),\n      isExternal: false,\n      displayOnly: false,\n      isPinnable: false,\n    };\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfoSelector(globalState);\n  }\n\n  getTooltipAnchor(state: GlobalChartState) {\n    const position = getActivePointerPosition(state);\n    return {\n      isRotated: false,\n      x: position.x,\n      width: 0,\n      y: position.y,\n      height: 0,\n    };\n  }\n\n  eventCallbacks(globalState: GlobalChartState) {\n    this.onElementOverCaller(globalState);\n    this.onElementOutCaller(globalState);\n    this.onElementClickCaller(globalState);\n  }\n\n  getChartTypeDescription(globalState: GlobalChartState) {\n    return getChartTypeDescriptionSelector(globalState);\n  }\n\n  // TODO\n  getProjectionContainerArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getMainProjectionArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getBrushArea(): Dimensions | null {\n    return null;\n  }\n\n  // TODO\n  getDebugState(): DebugState {\n    return {};\n  }\n\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  // TODO enable for small multiples\n  canDisplayChartTitles = () => false;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { render } from './scenegraph';\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { geoms, Mark } from '../../layout/viewmodel/geoms';\nimport { GoalSpec } from '../../specs';\n\nconst getParentDimensions = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const geometries = createCustomCachedSelector(\n  [getSpecs, getParentDimensions, getChartThemeSelector],\n  (specs, parentDimensions, theme): ShapeViewModel => {\n    const goalSpec = getSpecFromStore<GoalSpec, false>(specs, ChartType.Goal, SpecType.Series, false);\n    return goalSpec ? render(goalSpec, parentDimensions, theme) : nullShapeViewModel(theme);\n  },\n);\n\n/** @internal */\nexport const getPrimitiveGeoms = createCustomCachedSelector(\n  [geometries, getParentDimensions],\n  (shapeViewModel, parentDimensions): Mark[] => {\n    const { chartCenter, bulletViewModel, theme } = shapeViewModel;\n    return geoms(bulletViewModel, theme, parentDimensions, chartCenter);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const getChartTypeDescriptionSelector = createCustomCachedSelector([getGoalSpecSelector], (spec) => {\n  return `${spec?.subtype ?? 'goal'} chart`;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { geometries } from './geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport type GoalChartData = {\n  maximum: number;\n  minimum: number;\n  target?: number;\n  value: number;\n};\n\n/** @internal */\nexport type GoalChartLabels = {\n  minorLabel: string;\n  majorLabel: string;\n};\n\n/** @internal */\nexport const getGoalChartDataSelector = createCustomCachedSelector([geometries], (geoms): GoalChartData => {\n  const goalChartData: GoalChartData = {\n    maximum: geoms.bulletViewModel.highestValue,\n    minimum: geoms.bulletViewModel.lowestValue,\n    target: geoms.bulletViewModel.target,\n    value: geoms.bulletViewModel.actual,\n  };\n  return goalChartData;\n});\n\n/** @internal */\nexport const getGoalChartLabelsSelector = createCustomCachedSelector([geometries], (geoms) => {\n  return { majorLabel: geoms.bulletViewModel.labelMajor, minorLabel: geoms.bulletViewModel.labelMinor };\n});\n\n/** @internal */\nexport const getGoalChartSemanticDataSelector = createCustomCachedSelector([geometries], (geoms) => {\n  return geoms.bulletViewModel.bands ?? [];\n});\n\n/** @internal */\nexport const getFirstTickValueSelector = createCustomCachedSelector([geometries], (geoms) => {\n  return geoms.bulletViewModel.lowestValue;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { GoalSpec } from '../../specs';\n\n/** @internal */\nexport function getGoalSpecSelector(state: GlobalChartState): GoalSpec {\n  return getSpecFromStore<GoalSpec, true>(state.specs, ChartType.Goal, SpecType.Series, true);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipInfoSelector } from './tooltip';\nimport { TooltipType } from '../../../../specs/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\n\n/** @internal */\nexport const isTooltipVisibleSelector = createCustomCachedSelector(\n  [getTooltipSpecSelector, getTooltipInfoSelector],\n  ({ type }, tooltipInfo): boolean => {\n    if (type === TooltipType.None) return false;\n    return tooltipInfo.values.length > 0;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementClickSelector } from '../../../../common/event_handler_selectors';\nimport { GlobalChartState, PointerStates } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastClickSelector } from '../../../../state/selectors/get_last_click';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementClick listener every time the following preconditions are met:\n * - the onElementClick listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnElementClickCaller(): (state: GlobalChartState) => void {\n  const prev: { click: PointerStates['lastClick'] } = { click: null };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Goal) {\n      selector = createCustomCachedSelector(\n        [getGoalSpecSelector, getLastClickSelector, getSettingsSpecSelector, getPickedShapesLayerValues],\n        getOnElementClickSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementOutSelector } from '../../../../common/event_handler_selectors';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementOut listener every time the following preconditions are met:\n * - the onElementOut listener is available\n * - the highlighted geometries list goes from a list of at least one object to an empty one\n * @internal\n */\nexport function createOnElementOutCaller(): (state: GlobalChartState) => void {\n  const prev: { pickedShapes: number | null } = { pickedShapes: null };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Goal) {\n      selector = createCustomCachedSelector(\n        [getGoalSpecSelector, getPickedShapesLayerValues, getSettingsSpecSelector],\n        getOnElementOutSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementOverSelector } from '../../../../common/event_handler_selectors';\nimport { LayerValue } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementOver listener every time the following preconditions are met:\n * - the onElementOver listener is available\n * - we have a new set of highlighted geometries on our state\n * @internal\n */\nexport function createOnElementOverCaller(): (state: GlobalChartState) => void {\n  const prev: { pickedShapes: LayerValue[][] } = { pickedShapes: [] };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Goal) {\n      selector = createCustomCachedSelector(\n        [getGoalSpecSelector, getPickedShapesLayerValues, getSettingsSpecSelector],\n        getOnElementOverSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActivePointerPosition } from './../../../../state/selectors/get_active_pointer_position';\nimport { geometries, getPrimitiveGeoms } from './geometries';\nimport { Rectangle } from '../../../../common/geometry';\nimport { LayerValue } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { BulletViewModel } from '../../layout/types/viewmodel_types';\nimport { initialBoundingBox, Mark } from '../../layout/viewmodel/geoms';\n\nfunction fullBoundingBox(ctx: CanvasRenderingContext2D | null, geoms: Mark[]) {\n  const box = initialBoundingBox();\n  if (ctx) {\n    for (const g of geoms) {\n      for (const { x0, y0, x1, y1 } of g.boundingBoxes(ctx)) {\n        box.x0 = Math.min(box.x0, x0, x1);\n        box.y0 = Math.min(box.y0, y0, y1);\n        box.x1 = Math.max(box.x1, x0, x1);\n        box.y1 = Math.max(box.y1, y0, y1);\n      }\n    }\n  }\n  return box;\n}\n\n/** @internal */\nexport const getCaptureBoundingBox = createCustomCachedSelector([getPrimitiveGeoms], (geoms): Rectangle => {\n  const textMeasurer = document.createElement('canvas');\n  const ctx = textMeasurer.getContext('2d');\n  return fullBoundingBox(ctx, geoms);\n});\n\n/** @internal */\nexport const getPickedShapes = createCustomCachedSelector(\n  [geometries, getActivePointerPosition, getCaptureBoundingBox],\n  (geoms, pointerPosition, capture): BulletViewModel[] => {\n    const picker = geoms.pickQuads;\n    const { chartCenter } = geoms;\n    const { x, y } = pointerPosition;\n    return capture.x0 <= x && x <= capture.x1 && capture.y0 <= y && y <= capture.y1\n      ? picker(x - chartCenter.x, y - chartCenter.y)\n      : [];\n  },\n);\n\n/** @internal */\nexport const getPickedShapesLayerValues = createCustomCachedSelector(\n  [getPickedShapes],\n  (pickedShapes): Array<Array<LayerValue>> => {\n    return pickedShapes.map<Array<LayerValue>>((model) => {\n      const values: Array<LayerValue> = [];\n      values.push({\n        smAccessorValue: '',\n        groupByRollup: 'Actual',\n        value: model.actual,\n        sortIndex: 0,\n        path: [],\n        depth: 0,\n      });\n      return values.reverse();\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { shapeViewModel } from '../../layout/viewmodel/viewmodel';\nimport { GoalSpec } from '../../specs';\n\n/** @internal */\nexport function render(spec: GoalSpec, parentDimensions: Dimensions, theme: Theme): ShapeViewModel {\n  return shapeViewModel(spec, theme, parentDimensions);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getGoalSpecSelector } from './get_goal_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { Colors } from '../../../../common/colors';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { BandViewModel } from '../../layout/types/viewmodel_types';\n\nconst EMPTY_TOOLTIP = Object.freeze({\n  header: null,\n  values: [],\n});\n\nconst getBandColor = (value: number, bands: BandViewModel[]) =>\n  bands.find(({ value: v }) => {\n    return v >= value;\n  })?.fillColor ?? Colors.White.keyword;\n\n/** @internal */\nexport const getTooltipInfoSelector = createCustomCachedSelector(\n  [getGoalSpecSelector, getPickedShapes],\n  (spec, pickedShapes): TooltipInfo => {\n    if (!spec) {\n      return EMPTY_TOOLTIP;\n    }\n    const { tooltipValueFormatter, id } = spec;\n\n    const tooltipInfo: TooltipInfo = {\n      header: null,\n      values: [],\n    };\n\n    pickedShapes.forEach(({ actual: value, bands }) => {\n      tooltipInfo.values.push({\n        label: 'Actual',\n        color: getBandColor(value, bands),\n        isHighlighted: false,\n        isVisible: true,\n        seriesIdentifier: {\n          specId: id,\n          key: id,\n        },\n        value,\n        formattedValue: tooltipValueFormatter(value),\n        datum: value,\n      });\n    });\n\n    return tooltipInfo;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { Color } from '../../../../common/colors';\nimport { Pixels } from '../../../../common/geometry';\nimport { PerPanelMap } from '../../../../common/panel_utils';\nimport { Box, Font, TextAlign } from '../../../../common/text_utils';\nimport { Fill, Line, Rect, Stroke } from '../../../../geoms/types';\nimport { HeatmapBrushEvent } from '../../../../specs/settings';\nimport { Point } from '../../../../utils/point';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Visible, HeatmapStyle } from '../../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\nimport { HeatmapCellDatum } from '../viewmodel/viewmodel';\n\n/** @public */\nexport interface Cell {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  yIndex: number;\n  fill: Fill;\n  stroke: Stroke;\n  value: number;\n  formatted: string;\n  visible: boolean;\n  datum: HeatmapCellDatum;\n  textColor: Color;\n  fontSize: Pixels;\n}\n\n/** @internal */\nexport type GridCell = { x: NonNullable<PrimitiveValue>; y: NonNullable<PrimitiveValue> };\n\n/** @internal */\nexport interface TextBox extends Box {\n  value: NonNullable<PrimitiveValue>;\n  x: number;\n  y: number;\n  align: TextAlign;\n}\n\n/** @internal */\nexport type HeatmapTitleConfig = Font &\n  Visible & {\n    fontSize: number;\n    text: string;\n    origin: Point;\n    rotation: 0 | -90;\n  };\n\n/** @internal */\nexport interface HeatmapViewModel extends PerPanelMap {\n  gridOrigin: {\n    x: number;\n    y: number;\n  };\n  gridLines: {\n    x: Line[];\n    y: Line[];\n    stroke: Stroke;\n  };\n  cells: Cell[];\n  cellFontSize: (c: Cell) => Pixels;\n  xValues: Array<TextBox>;\n  yValues: Array<TextBox>;\n  titles: HeatmapTitleConfig[];\n}\n\n/** @internal */\nexport function isPickedCells(v: unknown): v is Cell[] {\n  return Array.isArray(v);\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels) => Cell[] | TextBox;\n\n/** @internal */\nexport type PickDragFunction = (points: [start: Point, end: Point]) => HeatmapBrushEvent;\n\n/** @internal */\nexport type PickDragShapeFunction = (points: [start: Point, end: Point]) => Rect | null;\n\n/**\n * From x and y coordinates in the data domain space to a canvas projected rectangle\n * that cover entirely the data domain coordinates provided.\n * If the data domain coordinates leaves within a bucket, then the full bucket is taken in consideration.\n * Used mainly for the Highlighter that shows the rounded selected area.\n * @internal\n */\nexport type PickHighlightedArea = (\n  x: Array<NonNullable<PrimitiveValue>>,\n  y: Array<NonNullable<PrimitiveValue>>,\n  smHorizontalAccessorValue?: string | number,\n  smVerticalAccessorValue?: string | number,\n) => Rect | null;\n\n/** @internal */\nexport type PickCursorBand = (x: NonNullable<PrimitiveValue>) => Rect | undefined;\n\n/** @internal */\nexport type PickGridCell = (x: Pixels, y: Pixels) => GridCell | undefined;\n\n/** @internal */\nexport type DragShape = ReturnType<PickDragShapeFunction>;\n\n/** @internal */\nexport type ShapeViewModel = {\n  theme: HeatmapStyle;\n  heatmapViewModels: HeatmapViewModel[];\n  pickQuads: PickFunction;\n  pickDragArea: PickDragFunction;\n  pickDragShape: PickDragShapeFunction;\n  pickHighlightedArea: PickHighlightedArea;\n  pickGridCell: PickGridCell;\n  pickCursorBand: PickCursorBand;\n};\n\n/** @internal */\nexport const nullShapeViewModel = (): ShapeViewModel => ({\n  theme: LIGHT_THEME.heatmap,\n  heatmapViewModels: [],\n  pickQuads: () => [],\n  pickDragArea: () => ({ cells: [], x: [], y: [], chartType: ChartType.Heatmap }),\n  pickDragShape: () => ({ x: 0, y: 0, width: 0, height: 0 }),\n  pickHighlightedArea: () => ({ x: 0, y: 0, width: 0, height: 0 }),\n  pickGridCell: () => undefined,\n  pickCursorBand: () => undefined,\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ColorScale } from '../../../../common/colors';\nimport { SmallMultipleScales, SmallMultiplesGroupBy } from '../../../../common/panel_utils';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { ChartDimensions } from '../../../xy_chart/utils/dimensions';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { shapeViewModel } from '../../layout/viewmodel/viewmodel';\nimport { HeatmapSpec } from '../../specs';\nimport { ChartElementSizes } from '../../state/selectors/compute_chart_element_sizes';\nimport { HeatmapTable } from '../../state/selectors/get_heatmap_table';\n\n/** @internal */\nexport function computeScenegraph(\n  spec: HeatmapSpec,\n  chartDimensions: ChartDimensions,\n  elementSizes: ChartElementSizes,\n  smScales: SmallMultipleScales,\n  groupBySpec: SmallMultiplesGroupBy,\n  heatmapTable: HeatmapTable,\n  colorScale: ColorScale,\n  bandsToHide: Array<[number, number]>,\n  theme: Theme,\n): ShapeViewModel {\n  return withTextMeasure((measureText) => {\n    return shapeViewModel(\n      measureText,\n      spec,\n      theme,\n      chartDimensions,\n      elementSizes,\n      heatmapTable,\n      colorScale,\n      smScales,\n      groupBySpec,\n      bandsToHide,\n    );\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleBand, scaleBand, scaleQuantize } from 'd3-scale';\n\nimport { BaseDatum } from './../../../xy_chart/utils/specs';\nimport { colorToRgba } from '../../../../common/color_library_wrappers';\nimport { ColorScale } from '../../../../common/colors';\nimport { fillTextColor } from '../../../../common/fill_text_color';\nimport { Pixels } from '../../../../common/geometry';\nimport {\n  getPanelSize,\n  getPanelTitle,\n  getPerPanelMap,\n  hasSMDomain,\n  isPointerOverPanelFn,\n  SmallMultipleScales,\n  SmallMultiplesDatum,\n  SmallMultiplesGroupBy,\n} from '../../../../common/panel_utils';\nimport { Box, Font, maximiseFontSize } from '../../../../common/text_utils';\nimport { ScaleType } from '../../../../scales/constants';\nimport { LinearScale, OrdinalScale, RasterTimeScale } from '../../../../specs';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { addIntervalToTime, roundDateToESInterval } from '../../../../utils/chrono/elasticsearch';\nimport { clamp, Datum, isFiniteNumber, isNil } from '../../../../utils/common';\nimport { innerPad, pad } from '../../../../utils/dimensions';\nimport { Logger } from '../../../../utils/logger';\nimport { HeatmapStyle, Theme, Visible } from '../../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\nimport { ChartDimensions } from '../../../xy_chart/utils/dimensions';\nimport { HeatmapSpec } from '../../specs';\nimport { ChartElementSizes } from '../../state/selectors/compute_chart_element_sizes';\nimport { HeatmapTable } from '../../state/selectors/get_heatmap_table';\nimport {\n  Cell,\n  GridCell,\n  HeatmapTitleConfig,\n  PickCursorBand,\n  PickDragFunction,\n  PickDragShapeFunction,\n  PickHighlightedArea,\n  ShapeViewModel,\n  TextBox,\n} from '../types/viewmodel_types';\n\n/** @public */\nexport interface HeatmapCellDatum extends SmallMultiplesDatum {\n  x: NonNullable<PrimitiveValue>;\n  y: NonNullable<PrimitiveValue>;\n  value: number;\n  originalIndex: number;\n}\n\ntype CellMap = Map<string, Cell>;\ntype PanelCellMap = Map<string, CellMap>;\n\nfunction getValuesInRange(\n  values: NonNullable<PrimitiveValue>[],\n  startValue: NonNullable<PrimitiveValue>,\n  endValue: NonNullable<PrimitiveValue>,\n) {\n  const startIndex = values.indexOf(startValue);\n  const endIndex = Math.min(values.indexOf(endValue) + 1, values.length);\n  return values.slice(startIndex, endIndex);\n}\n\n/** @internal */\nexport function clampWithOffset(value: number, lowerBound: number, upperBound: number, offset: number): number {\n  return clamp(value, lowerBound + offset, upperBound + offset) - offset;\n}\n\n/** @internal */\nexport function shapeViewModel<D extends BaseDatum = Datum>(\n  textMeasure: TextMeasure,\n  spec: HeatmapSpec<D>,\n  { heatmap: heatmapTheme, axes: { axisTitle, axisPanelTitle }, background }: Theme,\n  { chartDimensions }: ChartDimensions,\n  elementSizes: ChartElementSizes,\n  heatmapTable: HeatmapTable,\n  colorScale: ColorScale,\n  smScales: SmallMultipleScales,\n  groupBySpec: SmallMultiplesGroupBy,\n  bandsToHide: Array<[number, number]>,\n): ShapeViewModel {\n  const { table, yValues, xValues } = heatmapTable;\n  const gridStrokeWidth = heatmapTheme.grid.stroke.width;\n  const isPointerOverPanel = isPointerOverPanelFn(smScales, chartDimensions, gridStrokeWidth);\n\n  // measure the text width of all rows values to get the grid area width\n  const boxedYValues = yValues.map<Box & { value: NonNullable<PrimitiveValue> }>((value) => ({\n    text: spec.yAxisLabelFormatter(value),\n    value,\n    isValue: false,\n    ...heatmapTheme.yAxisLabel,\n  }));\n\n  const panelSize = getPanelSize(smScales);\n\n  // compute the scale for the rows positions\n  const yScale = scaleBand<NonNullable<PrimitiveValue>>().domain(yValues).range([0, panelSize.height]);\n\n  const yInvertedScale = scaleQuantize<NonNullable<PrimitiveValue>>().domain([0, panelSize.height]).range(yValues);\n\n  // compute the scale for the columns positions\n  const xScale = scaleBand<NonNullable<PrimitiveValue>>().domain(xValues).range([0, panelSize.width]);\n  const xInvertedScale = scaleQuantize<NonNullable<PrimitiveValue>>().domain([0, panelSize.width]).range(xValues);\n\n  // compute the cell width, can be smaller then the available size depending on config\n  const cellWidth =\n    heatmapTheme.cell.maxWidth !== 'fill' && xScale.bandwidth() > heatmapTheme.cell.maxWidth\n      ? heatmapTheme.cell.maxWidth\n      : xScale.bandwidth();\n\n  // compute the cell height, we already computed the max size for that\n  const cellHeight = yScale.bandwidth();\n\n  // compute the position of each column label\n  const textXValues = getXTicks(spec, heatmapTheme.xAxisLabel, xScale, heatmapTable.xValues);\n\n  const { padding } = heatmapTheme.yAxisLabel;\n\n  // compute the position of each row label\n  const textYValues = boxedYValues.map<TextBox>((d) => {\n    return {\n      ...d,\n      // position of the Y labels\n      x: -pad(padding, 'right'),\n      y: cellHeight / 2 + (yScale(d.value) || 0),\n      align: 'right',\n    };\n  });\n\n  const cellWidthInner = cellWidth - gridStrokeWidth;\n  const cellHeightInner = cellHeight - gridStrokeWidth;\n\n  if (colorToRgba(background.color)[3] < 1) {\n    // TODO: centralize this check and bg color fallback across all chart types\n    Logger.expected(\n      'Text contrast requires a opaque background color, using fallbackColor',\n      'an opaque color',\n      background.color,\n    );\n  }\n\n  let tableMinFontSize = Infinity;\n\n  // compute each available cell position, color and value\n  const panelCellMap = table.reduce<PanelCellMap>((acc, d) => {\n    const x = xScale(String(d.x));\n    const y = yScale(String(d.y));\n    const yIndex = yValues.indexOf(d.y);\n\n    if (!isFiniteNumber(x) || !isFiniteNumber(y) || yIndex === -1) {\n      return acc;\n    }\n    const cellBackgroundColor = colorScale(d.value);\n    const panelKey = getPanelKey(d.smHorizontalAccessorValue, d.smVerticalAccessorValue);\n    const cellKey = getCellKey(d.x, d.y);\n\n    const formattedValue = spec.valueFormatter(d.value);\n\n    const fontSize = maximiseFontSize(\n      textMeasure,\n      formattedValue,\n      heatmapTheme.cell.label,\n      heatmapTheme.cell.label.minFontSize,\n      heatmapTheme.cell.label.maxFontSize,\n      // adding 3px padding per side to avoid that text touches the edges\n      cellWidthInner - 6,\n      cellHeightInner - 6,\n    );\n    tableMinFontSize = Math.min(tableMinFontSize, fontSize);\n\n    const cellMap = acc.get(panelKey) ?? new Map<string, Cell>();\n\n    if (!acc.has(panelKey)) acc.set(panelKey, cellMap);\n\n    cellMap.set(cellKey, {\n      x:\n        (heatmapTheme.cell.maxWidth !== 'fill' ? x + xScale.bandwidth() / 2 - heatmapTheme.cell.maxWidth / 2 : x) +\n        gridStrokeWidth / 2,\n      y: y + gridStrokeWidth / 2,\n      yIndex,\n      width: cellWidthInner,\n      height: cellHeightInner,\n      datum: d,\n      fill: {\n        color: colorToRgba(cellBackgroundColor),\n      },\n      stroke: {\n        color: colorToRgba(heatmapTheme.cell.border.stroke),\n        width: heatmapTheme.cell.border.strokeWidth,\n      },\n      value: d.value,\n      visible: !isValueInRanges(d.value, bandsToHide),\n      formatted: formattedValue,\n      fontSize,\n      textColor: fillTextColor(background.fallbackColor, cellBackgroundColor, background.color).color.keyword,\n    });\n    return acc;\n  }, new Map());\n\n  const getScaledSMValue = (value: number | string, scale: 'horizontal' | 'vertical') => {\n    return hasSMDomain(smScales[scale]) ? smScales[scale].scale(value) : 0;\n  };\n\n  const getPanelPointCoordinate = (value: Pixels, scale: 'horizontal' | 'vertical') => {\n    const category = smScales[scale].invert(value) ?? '';\n    const panelOffset = getScaledSMValue(category, scale);\n    const invertedScale = scale === 'horizontal' ? xInvertedScale : yInvertedScale;\n\n    return {\n      category,\n      panelOffset,\n      panelPixelValue: value - panelOffset,\n      panelValue: invertedScale(value - panelOffset),\n    };\n  };\n\n  const getPanelPointCoordinates = (x: Pixels, y: Pixels) => {\n    const { category: v, panelValue: panelY, panelOffset: panelOffsetY } = getPanelPointCoordinate(y, 'vertical');\n    const {\n      category: h,\n      panelValue: panelX,\n      panelOffset: panelOffsetX,\n    } = getPanelPointCoordinate(x - chartDimensions.left, 'horizontal');\n\n    return {\n      x: panelX,\n      y: panelY,\n      v,\n      h,\n      panelOffsetY,\n      panelOffsetX,\n    };\n  };\n\n  /**\n   * Returns the corresponding x & y values of grid cell from the x & y positions\n   * @param x\n   * @param y\n   */\n  const pickGridCell = (x: Pixels, y: Pixels): GridCell | undefined => {\n    if (x < chartDimensions.left || y < chartDimensions.top) return undefined;\n    if (x > chartDimensions.width + chartDimensions.left || y > chartDimensions.top + chartDimensions.height)\n      return undefined;\n\n    const xValue = xInvertedScale(x - chartDimensions.left);\n    const yValue = yInvertedScale(y);\n\n    if (xValue === undefined || yValue === undefined) return undefined;\n\n    return { x: xValue, y: yValue };\n  };\n\n  /**\n   * Returns selected elements based on coordinates.\n   * @param x\n   * @param y\n   */\n  const pickQuads = (x: Pixels, y: Pixels): Array<Cell> | TextBox => {\n    if (\n      x > 0 &&\n      x < chartDimensions.left &&\n      y > chartDimensions.top &&\n      y < chartDimensions.top + chartDimensions.height\n    ) {\n      // look up for a Y axis elements\n      const { y: yLabelKey } = getPanelPointCoordinates(x - chartDimensions.left, y);\n      const yLabelValue = textYValues.find((v) => v.value === yLabelKey);\n      if (yLabelValue) {\n        return yLabelValue;\n      }\n    }\n\n    if (!isPointerOverPanel({ x, y })) {\n      return [];\n    }\n\n    const { x: panelXValue, y: panelYValue, h, v } = getPanelPointCoordinates(x, y);\n\n    if (panelXValue === undefined || panelYValue === undefined) {\n      return [];\n    }\n\n    const panelKey = getPanelKey(h, v);\n    const cellKey = getCellKey(panelXValue, panelYValue);\n    const cell = panelCellMap.get(panelKey)?.get(cellKey);\n\n    if (cell) return [cell];\n    return [];\n  };\n\n  /**\n   * Return selected cells and X,Y ranges based on the drag selection.\n   */\n  const pickDragArea: PickDragFunction = (bound) => {\n    const [start, end] = bound;\n\n    const { left, top } = chartDimensions;\n    const topLeft: [number, number] = [Math.min(start.x, end.x) - left, Math.min(start.y, end.y) - top];\n    const bottomRight: [number, number] = [Math.max(start.x, end.x) - left, Math.max(start.y, end.y) - top];\n\n    // Find panel based on start pointer\n    const { category: smHorizontalAccessorValue, panelOffset: horizontalPanelOffset } = getPanelPointCoordinate(\n      start.x - chartDimensions.left,\n      'horizontal',\n    );\n    const { category: smVerticalAccessorValue, panelOffset: verticalPanelOffset } = getPanelPointCoordinate(\n      start.y,\n      'vertical',\n    );\n\n    // confine selection to start panel\n    const panelStartX = clampWithOffset(topLeft[0], 0, panelSize.width, horizontalPanelOffset);\n    const panelStartY = clampWithOffset(topLeft[1], 0, panelSize.height, verticalPanelOffset);\n    const panelEndX = clampWithOffset(bottomRight[0], 0, panelSize.width, horizontalPanelOffset);\n    const panelEndY = clampWithOffset(bottomRight[1], 0, panelSize.height, verticalPanelOffset);\n\n    const startX = xInvertedScale(panelStartX);\n    const startY = yInvertedScale(panelStartY);\n    const endX = xInvertedScale(panelEndX);\n    const endY = yInvertedScale(panelEndY);\n\n    const allXValuesInRange: Array<NonNullable<PrimitiveValue>> = getValuesInRange(xValues, startX, endX);\n    const allYValuesInRange: Array<NonNullable<PrimitiveValue>> = getValuesInRange(yValues, startY, endY);\n    const invertedXValues: Array<NonNullable<PrimitiveValue>> =\n      isRasterTimeScale(spec.xScale) && typeof endX === 'number'\n        ? [startX, addIntervalToTime(endX, spec.xScale.interval, spec.timeZone)]\n        : [...allXValuesInRange];\n    const cells: Cell[] = [];\n\n    allXValuesInRange.forEach((x) => {\n      allYValuesInRange.forEach((y) => {\n        const panelKey = getPanelKey(smHorizontalAccessorValue, smVerticalAccessorValue);\n        const cellKey = getCellKey(x, y);\n        const cellValue = panelCellMap.get(panelKey)?.get(cellKey);\n        if (cellValue) cells.push(cellValue);\n      });\n    });\n\n    return {\n      cells: cells.filter(Boolean),\n      x: invertedXValues,\n      y: allYValuesInRange,\n      smHorizontalAccessorValue,\n      smVerticalAccessorValue,\n    };\n  };\n\n  /**\n   * Resolves rect area based on provided X and Y ranges\n   * @param x\n   * @param y\n   */\n  const pickHighlightedArea: PickHighlightedArea = (\n    x: Array<NonNullable<PrimitiveValue>>,\n    y: Array<NonNullable<PrimitiveValue>>,\n    smHorizontalAccessorValue?: string | number,\n    smVerticalAccessorValue?: string | number,\n  ) => {\n    const startValue = x[0];\n    const endValue = x.at(-1);\n    const leftIndex = xValues.indexOf(startValue ?? NaN);\n    const rightIndex = xValues.indexOf(endValue ?? NaN) + (isRasterTimeScale(spec.xScale) && x.length > 1 ? 0 : 1);\n\n    const isRightOutOfRange = rightIndex > xValues.length - 1 || rightIndex < 0;\n    const isLeftOutOfRange = leftIndex > xValues.length - 1 || leftIndex < 0;\n\n    const startFromScale = xScale((isLeftOutOfRange ? xValues[0] : xValues[leftIndex]) ?? NaN);\n    const endFromScale = xScale((isRightOutOfRange ? xValues.at(-1) : xValues[rightIndex]) ?? NaN);\n\n    if (startFromScale === undefined || endFromScale === undefined) {\n      return null;\n    }\n\n    const panelXOffset = isNil(smHorizontalAccessorValue)\n      ? 0\n      : getScaledSMValue(smHorizontalAccessorValue, 'horizontal');\n    const panelYOffset = isNil(smVerticalAccessorValue) ? 0 : getScaledSMValue(smVerticalAccessorValue, 'vertical');\n\n    const xStart = chartDimensions.left + startFromScale + panelXOffset;\n\n    // extend the range in case the right boundary has been selected\n    const width = endFromScale - startFromScale + (isRightOutOfRange || isLeftOutOfRange ? cellWidth : 0);\n\n    // resolve Y coordinated making sure the order is correct\n    const { y: yStart, totalHeight } = y\n      .filter((v) => yValues.includes(v))\n      .reduce(\n        (acc, current, i) => {\n          if (i === 0) {\n            acc.y = (yScale(current) || 0) + panelYOffset;\n          }\n          acc.totalHeight += cellHeight;\n          return acc;\n        },\n        { y: 0, totalHeight: 0 },\n      );\n    return {\n      x: xStart,\n      y: yStart,\n      width,\n      height: totalHeight,\n    };\n  };\n\n  /**\n   * Resolves coordinates and metrics of the selected rect area.\n   */\n  const pickDragShape: PickDragShapeFunction = (bound) => {\n    const { x, y, smHorizontalAccessorValue, smVerticalAccessorValue } = pickDragArea(bound);\n    return pickHighlightedArea(x, y, smHorizontalAccessorValue, smVerticalAccessorValue);\n  };\n\n  const pickCursorBand: PickCursorBand = (x) => {\n    // TODO for Linear scale we need to round the numerical interval. see also https://github.com/elastic/elastic-charts/issues/1701\n    const roundedValue =\n      isRasterTimeScale(spec.xScale) && isFiniteNumber(x)\n        ? roundDateToESInterval(x, spec.xScale.interval, 'start', spec.timeZone)\n        : x;\n\n    const index = xValues.indexOf(roundedValue);\n    return index < 0\n      ? undefined\n      : {\n          width: cellWidth,\n          x: chartDimensions.left + (xScale(xValues[index] ?? NaN) ?? NaN),\n          y: chartDimensions.top,\n          height: chartDimensions.height,\n        };\n  };\n\n  // ordered left-right vertical lines\n  const xLines = Array.from({ length: xValues.length + 1 }, (d, i) => {\n    const xAxisExtension = i % elementSizes.xAxisTickCadence === 0 ? 5 : 0;\n    return {\n      x1: i * cellWidth,\n      x2: i * cellWidth,\n      y1: 0,\n      y2: panelSize.height + xAxisExtension,\n    };\n  });\n\n  // horizontal lines\n  const yLines = Array.from({ length: yValues.length + 1 }, (d, i) => ({\n    x1: 0,\n    x2: panelSize.width,\n    y1: i * cellHeight,\n    y2: i * cellHeight,\n  }));\n\n  // TODO introduce missing styles into axes.axisTitle\n  const axisTitleFont: Visible & Font & { fontSize: Pixels } = {\n    visible: axisTitle.visible,\n    fontFamily: axisTitle.fontFamily,\n    fontStyle: axisTitle.fontStyle ?? 'normal',\n    fontVariant: 'normal',\n    fontWeight: 'bold',\n    textColor: axisTitle.fill,\n    fontSize: axisTitle.fontSize,\n  };\n\n  const axisPanelTitleFont: Visible & Font & { fontSize: Pixels } = {\n    visible: axisPanelTitle.visible,\n    fontFamily: axisPanelTitle.fontFamily,\n    fontStyle: axisPanelTitle.fontStyle ?? 'normal',\n    fontVariant: 'normal',\n    fontWeight: 'bold',\n    textColor: axisPanelTitle.fill,\n    fontSize: axisPanelTitle.fontSize,\n  };\n\n  return {\n    theme: heatmapTheme,\n    heatmapViewModels: getPerPanelMap(smScales, (anchor, h, v) => {\n      const primaryColumn = smScales.vertical.domain[0] === v;\n      const primaryRow = smScales.horizontal.domain[0] === h;\n      const lastColumn = smScales.vertical.domain.at(-1) === v;\n\n      const titles: HeatmapTitleConfig[] = [];\n      // TODO this should be filtered by the pageSize AND the pageNumber\n      const cells = [...(panelCellMap.get(getPanelKey(h, v))?.values() ?? [])];\n\n      if (primaryColumn && primaryRow) {\n        if (spec.xAxisTitle) {\n          const axisPanelTitleHeight =\n            groupBySpec.horizontal && axisPanelTitle.visible\n              ? axisPanelTitle.fontSize + innerPad(axisPanelTitle.padding) / 2\n              : 0;\n\n          titles.push({\n            origin: {\n              x: chartDimensions.width / 2,\n              y:\n                chartDimensions.top +\n                chartDimensions.height +\n                elementSizes.xAxis.height +\n                axisPanelTitleHeight +\n                innerPad(axisTitle.padding) / 2 +\n                axisTitle.fontSize / 2,\n            },\n            ...axisTitleFont,\n            text: spec.xAxisTitle,\n            rotation: 0,\n          });\n        }\n\n        if (spec.yAxisTitle) {\n          titles.push({\n            origin: {\n              x: -chartDimensions.left + axisTitle.fontSize / 2,\n              y: chartDimensions.top + chartDimensions.height / 2,\n            },\n            ...axisTitleFont,\n            text: spec.yAxisTitle,\n            rotation: -90,\n          });\n        }\n      }\n\n      if (primaryColumn && groupBySpec.horizontal) {\n        titles.push({\n          origin: {\n            x: panelSize.width / 2,\n            y:\n              chartDimensions.top +\n              chartDimensions.height +\n              elementSizes.xAxis.height +\n              innerPad(axisPanelTitle.padding) +\n              axisPanelTitle.fontSize / 2,\n          },\n          ...axisPanelTitleFont,\n          text: getPanelTitle(false, v, h, groupBySpec),\n          rotation: 0,\n        });\n      }\n\n      if (primaryRow && groupBySpec.vertical) {\n        const axisTitleWidth = axisTitle.visible ? axisTitle.fontSize + innerPad(axisTitle.padding) : 0;\n        titles.push({\n          origin: {\n            x: -chartDimensions.left + axisTitleWidth + axisPanelTitle.fontSize / 2,\n            y: chartDimensions.top + panelSize.height / 2,\n          },\n          ...axisPanelTitleFont,\n          text: getPanelTitle(true, v, h, groupBySpec),\n          rotation: -90,\n        });\n      }\n\n      return {\n        anchor,\n        panelSize,\n        gridOrigin: {\n          x: anchor.x + chartDimensions.left,\n          y: anchor.y + chartDimensions.top,\n        },\n        gridLines: {\n          x: xLines,\n          y: yLines,\n          stroke: {\n            color: colorToRgba(heatmapTheme.grid.stroke.color),\n            width: gridStrokeWidth,\n          },\n        },\n        cells,\n        cellFontSize: (cell: Cell) => (heatmapTheme.cell.label.useGlobalMinFontSize ? tableMinFontSize : cell.fontSize),\n        xValues: lastColumn ? textXValues : [],\n        yValues: primaryRow ? textYValues : [],\n        titles,\n      };\n    }),\n    pickGridCell,\n    pickQuads,\n    pickDragArea,\n    pickDragShape,\n    pickHighlightedArea,\n    pickCursorBand,\n  };\n}\n\nfunction getCellKey(x: NonNullable<PrimitiveValue>, y: NonNullable<PrimitiveValue>) {\n  return [String(x), String(y)].join('&_&');\n}\n\nfunction getPanelKey(h: NonNullable<PrimitiveValue> = '', v: NonNullable<PrimitiveValue> = '') {\n  return [String(h), String(v)].join('&_&');\n}\n\n/** @internal */\nexport function isValueInRanges(value: number, ranges: Array<[number, number]>) {\n  return ranges.some(([min, max]) => min <= value && value < max);\n}\n\n/** @internal */\nexport function isRasterTimeScale(scale: RasterTimeScale | OrdinalScale | LinearScale): scale is RasterTimeScale {\n  return scale.type === ScaleType.Time;\n}\n\nfunction getXTicks(\n  spec: HeatmapSpec,\n  style: HeatmapStyle['xAxisLabel'],\n  scale: ScaleBand<NonNullable<PrimitiveValue>>,\n  values: NonNullable<PrimitiveValue>[],\n): Array<TextBox> {\n  const isTimeScale = isRasterTimeScale(spec.xScale);\n  const isRotated = style.rotation !== 0;\n  return values.map<TextBox>((value) => {\n    return {\n      text: spec.xAxisLabelFormatter(value),\n      value,\n      isValue: false,\n      ...style,\n      y: style.fontSize / 2 + pad(style.padding, 'top'),\n      x: (scale(value) ?? 0) + (isTimeScale ? 0 : scale.bandwidth() / 2),\n      align: isRotated ? 'right' : isTimeScale ? 'left' : 'center',\n    };\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ReactiveChartStateProps } from './connected_component';\nimport { getColorBandStyle, getGeometryStateStyle } from './utils';\nimport { clearCanvas, renderLayers, withContext } from '../../../../renderers/canvas';\nimport { radToDeg } from '../../../../utils/common';\nimport { horizontalPad } from '../../../../utils/dimensions';\nimport { renderMultiLine } from '../../../xy_chart/renderer/canvas/primitives/line';\nimport { renderRect } from '../../../xy_chart/renderer/canvas/primitives/rect';\nimport { renderText, TextFont, wrapLines } from '../../../xy_chart/renderer/canvas/primitives/text';\n\n/** @internal */\nexport function renderHeatmapCanvas2d(ctx: CanvasRenderingContext2D, dpr: number, props: ReactiveChartStateProps) {\n  const { theme } = props.geometries;\n  const { heatmapViewModels } = props.geometries;\n  const {\n    theme: { sharedStyle: sharedGeometryStyle },\n    background,\n    elementSizes,\n    highlightedLegendBands,\n  } = props;\n  if (heatmapViewModels.length === 0) return;\n\n  withContext(ctx, () => {\n    // set some defaults for the overall rendering\n\n    // let's set the devicePixelRatio once and for all; then we'll never worry about it again\n    ctx.scale(dpr, dpr);\n\n    // all texts are currently center-aligned because\n    //     - the calculations manually compute and lay out text (word) boxes, so we can choose whatever\n    //     - but center/middle has mathematical simplicity and the most unassuming thing\n    //     - due to using the math x/y convention (+y is up) while Canvas uses screen convention (+y is down)\n    //         text rendering must be y-flipped, which is a bit easier this way\n    ctx.textAlign = 'center';\n    ctx.textBaseline = 'middle';\n    ctx.lineCap = 'square';\n    // ctx.translate(chartCenter.x, chartCenter.y);\n    // this applies the mathematical x/y conversion (+y is North) which is easier when developing geometry\n    // functions - also, all renderers have flexibility (eg. SVG scale) and WebGL NDC is also +y up\n    // - in any case, it's possible to refactor for a -y = North convention if that's deemed preferable\n    // ctx.scale(1, -1);\n\n    renderLayers(ctx, [\n      () => clearCanvas(ctx, background),\n\n      () => {\n        // Grid\n        heatmapViewModels.forEach(({ gridOrigin: { x, y }, gridLines }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y);\n            renderMultiLine(ctx, gridLines.x, gridLines.stroke);\n            renderMultiLine(ctx, gridLines.y, gridLines.stroke);\n          });\n        });\n      },\n\n      () =>\n        // Cells\n        heatmapViewModels.forEach(({ gridOrigin: { x, y }, cells }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y);\n            cells.forEach((cell) => {\n              if (cell.visible) {\n                const geometryStateStyle = getGeometryStateStyle(cell, sharedGeometryStyle, highlightedLegendBands);\n                const style = getColorBandStyle(cell, geometryStateStyle);\n                renderRect(ctx, cell, style.fill, style.stroke);\n              }\n            });\n          });\n        }),\n\n      // Text on cells\n      () => {\n        if (!theme.cell.label.visible) return;\n\n        heatmapViewModels.forEach(({ cellFontSize, gridOrigin: { x, y }, cells }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y);\n            cells.forEach((cell) => {\n              const fontSize = cellFontSize(cell);\n              if (cell.visible && Number.isFinite(fontSize))\n                renderText(ctx, { x: cell.x + cell.width / 2, y: cell.y + cell.height / 2 }, cell.formatted, {\n                  ...theme.cell.label,\n                  fontSize,\n                  align: 'center',\n                  baseline: 'middle',\n                  textColor: cell.textColor,\n                });\n            });\n          });\n        });\n      },\n\n      // render text on Y axis\n      () => {\n        if (!theme.yAxisLabel.visible) return;\n\n        heatmapViewModels.forEach(({ yValues, gridOrigin: { x, y } }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y);\n            const font: TextFont = {\n              ...theme.yAxisLabel,\n              baseline: 'middle' /* fixed */,\n              align: 'right' /* fixed */,\n            };\n            const { padding } = theme.yAxisLabel;\n            const horizontalPadding = horizontalPad(padding);\n            yValues.forEach(({ x, y, text }) => {\n              const textLines = wrapLines(\n                ctx,\n                text,\n                font,\n                theme.yAxisLabel.fontSize,\n                Math.max(elementSizes.yAxis.width - horizontalPadding, 0),\n                theme.yAxisLabel.fontSize,\n                { shouldAddEllipsis: true, wrapAtWord: false },\n              ).lines;\n              // TODO improve the `wrapLines` code to handle results with short width\n              if (textLines[0]) renderText(ctx, { x, y }, textLines[0], font);\n            });\n          });\n        });\n      },\n\n      // render text on X axis\n      () => {\n        if (!theme.xAxisLabel.visible) return;\n\n        heatmapViewModels.forEach(({ xValues, gridOrigin: { x, y } }) => {\n          withContext(ctx, () => {\n            ctx.translate(x, y + elementSizes.xAxis.top);\n            xValues\n              .filter((_, i) => i % elementSizes.xAxisTickCadence === 0)\n              .forEach(({ x, y, text, align }) => {\n                const textLines = wrapLines(\n                  ctx,\n                  text,\n                  theme.xAxisLabel,\n                  theme.xAxisLabel.fontSize,\n                  // TODO wrap into multilines\n                  Infinity,\n                  16,\n                  { shouldAddEllipsis: true, wrapAtWord: false },\n                ).lines;\n                if (textLines[0]) {\n                  renderText(\n                    ctx,\n                    { x, y },\n                    textLines[0],\n                    { ...theme.xAxisLabel, baseline: 'middle', align },\n                    // negative rotation due to the canvas rotation direction\n                    radToDeg(-elementSizes.xLabelRotation),\n                  );\n                }\n              });\n          });\n        });\n      },\n\n      // render axes and panel titles\n      () =>\n        heatmapViewModels\n          .filter(({ titles }) => titles.length > 0)\n          .forEach(({ titles, gridOrigin: { x, y } }) => {\n            withContext(ctx, () => {\n              ctx.translate(x, y);\n              titles\n                .filter((t) => t.visible && t.text !== '')\n                .forEach((title) => {\n                  renderText(\n                    ctx,\n                    title.origin,\n                    title.text,\n                    {\n                      ...title,\n                      baseline: 'middle',\n                      align: 'center',\n                    },\n                    title.rotation,\n                  );\n                });\n            });\n          }),\n    ]);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { renderHeatmapCanvas2d } from './canvas_renderers';\nimport { Color, Colors } from '../../../../common/colors';\nimport { ScreenReaderSummary } from '../../../../components/accessibility';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { GenericDomain } from '../../../../utils/domain';\nimport { deepEqual } from '../../../../utils/fast_deep_equal';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { ChartElementSizes, computeChartElementSizesSelector } from '../../state/selectors/compute_chart_element_sizes';\nimport { getHeatmapContainerSizeSelector } from '../../state/selectors/get_heatmap_container_size';\nimport { getHighlightedLegendBandsSelector } from '../../state/selectors/get_highlighted_legend_bands';\nimport { getPerPanelHeatmapGeometries } from '../../state/selectors/get_per_panel_heatmap_geometries';\n\n/** @internal */\nexport interface ReactiveChartStateProps {\n  initialized: boolean;\n  geometries: ShapeViewModel;\n  chartContainerDimensions: Dimensions;\n  highlightedLegendBands: Array<GenericDomain>;\n  theme: Theme;\n  a11ySettings: A11ySettings;\n  background: Color;\n  elementSizes: ChartElementSizes;\n  debug: boolean;\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface ReactiveChartOwnProps {\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype Props = ReactiveChartStateProps & ReactiveChartDispatchProps & ReactiveChartOwnProps;\nclass Component extends React.Component<Props> {\n  static displayName = 'Heatmap';\n\n  // firstRender = true; // this will be useful for stable resizing of treemaps\n  private ctx: CanvasRenderingContext2D | null;\n\n  // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example\n  private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `<canvas>` dimensions\n\n  constructor(props: Readonly<Props>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  shouldComponentUpdate(nextProps: ReactiveChartStateProps) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      renderHeatmapCanvas2d(this.ctx, this.devicePixelRatio, this.props);\n    }\n  }\n\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  render() {\n    const {\n      initialized,\n      chartContainerDimensions: { width, height },\n      forwardStageRef,\n      a11ySettings,\n    } = this.props;\n    if (!initialized || width === 0 || height === 0) {\n      return null;\n    }\n    return (\n      <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n        <canvas\n          ref={forwardStageRef}\n          className=\"echCanvasRenderer\"\n          width={width * this.devicePixelRatio}\n          height={height * this.devicePixelRatio}\n          style={{\n            width,\n            height,\n          }}\n          // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n          role=\"presentation\"\n        >\n          <ScreenReaderSummary />\n        </canvas>\n      </figure>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  initialized: false,\n  geometries: nullShapeViewModel(),\n  chartContainerDimensions: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  theme: LIGHT_THEME,\n  highlightedLegendBands: [],\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  background: Colors.Transparent.keyword,\n  elementSizes: {\n    xAxis: { width: 0, height: 0, left: 0, top: 0 },\n    yAxis: { width: 0, height: 0, left: 0, top: 0 },\n    xAxisTickCadence: 1,\n    xLabelRotation: 0,\n  },\n  debug: false,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  return {\n    initialized: true,\n    geometries: getPerPanelHeatmapGeometries(state),\n    chartContainerDimensions: getHeatmapContainerSizeSelector(state),\n    highlightedLegendBands: getHighlightedLegendBandsSelector(state),\n    theme: getChartThemeSelector(state),\n    a11ySettings: getA11ySettingsSelector(state),\n    background: getChartThemeSelector(state).background.color,\n    elementSizes: computeChartElementSizesSelector(state),\n    debug: getSettingsSpecSelector(state).debug,\n  };\n};\n\n/** @internal */\nexport const Heatmap = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { overrideOpacity } from '../../../../common/color_library_wrappers';\nimport { Fill, Stroke } from '../../../../geoms/types';\nimport { GenericDomain } from '../../../../utils/domain';\nimport { GeometryStateStyle, SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { Cell } from '../../layout/types/viewmodel_types';\nimport { isValueInRanges } from '../../layout/viewmodel/viewmodel';\n\n/** @internal */\nexport function getGeometryStateStyle(\n  cell: Cell,\n  sharedGeometryStyle: SharedGeometryStateStyle,\n  highlightedLegendBands: Array<GenericDomain>,\n): GeometryStateStyle {\n  const { default: defaultStyles, highlighted, unhighlighted } = sharedGeometryStyle;\n\n  if (highlightedLegendBands.length > 0) {\n    const isHighlightedBand = isValueInRanges(cell.value, highlightedLegendBands);\n    return isHighlightedBand ? highlighted : unhighlighted;\n  }\n\n  return defaultStyles;\n}\n\n/** @internal */\nexport function getColorBandStyle(cell: Cell, geometryStateStyle: GeometryStateStyle): { fill: Fill; stroke: Stroke } {\n  const fillColor = overrideOpacity(cell.fill.color, (opacity) => opacity * geometryStateStyle.opacity);\n  const fill: Fill = {\n    ...cell.fill,\n    color: fillColor,\n  };\n\n  const strokeColor = overrideOpacity(cell.stroke.color, (opacity) => opacity * geometryStateStyle.opacity);\n  const stroke: Stroke = {\n    ...cell.stroke,\n    color: strokeColor,\n  };\n  return { fill, stroke };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Rect } from '../../../../geoms/types';\nimport { getTooltipType } from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { getCursorBandPositionSelector } from '../../state/selectors/get_cursor_band';\n\ninterface CursorBandProps {\n  bandStyle: Theme['crosshair']['band'];\n  cursorPosition?: Rect;\n  tooltipType: TooltipType;\n  fromExternalEvent?: boolean;\n}\n\nfunction canRenderBand(type: TooltipType, visible: boolean, fromExternalEvent?: boolean) {\n  return visible && (type === TooltipType.Crosshairs || type === TooltipType.VerticalCursor || fromExternalEvent);\n}\n\nclass CursorBandComponent extends React.Component<CursorBandProps> {\n  static displayName = 'CursorBand';\n\n  render() {\n    const { bandStyle, cursorPosition, tooltipType, fromExternalEvent } = this.props;\n    const isBand = (cursorPosition?.width ?? 0) > 0 && (cursorPosition?.height ?? 0) > 0;\n    if (!isBand || !cursorPosition || !canRenderBand(tooltipType, bandStyle.visible, fromExternalEvent)) {\n      return null;\n    }\n    const { x, y, width, height } = cursorPosition;\n    const { fill } = bandStyle;\n    return (\n      <svg className=\"echCrosshair__cursor\" width=\"100%\" height=\"100%\">\n        <rect {...{ x, y, width, height, fill, opacity: 0.5 }} />\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): CursorBandProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      bandStyle: LIGHT_THEME.crosshair.band,\n      tooltipType: TooltipType.None,\n    };\n  }\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const cursorBandPosition = getCursorBandPositionSelector(state);\n  const fromExternalEvent = cursorBandPosition?.fromExternalEvent;\n  const tooltipType = getTooltipType(tooltip, settings, fromExternalEvent);\n\n  return {\n    bandStyle: getChartThemeSelector(state).crosshair.band,\n    cursorPosition: cursorBandPosition,\n    tooltipType,\n    fromExternalEvent,\n  };\n};\n\n/** @internal */\nexport const CursorBand = connect(mapStateToProps)(CursorBandComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { FC } from 'react';\n\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { HeatmapStyle } from '../../../../utils/themes/theme';\nimport { DragShape, nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\n\n/** @internal */\nexport interface HighlighterCellsProps {\n  chartId: string;\n  initialized: boolean;\n  canvasDimension: Dimensions;\n  geometries: ShapeViewModel;\n  dragShape: DragShape | null;\n  brushMask: HeatmapStyle['brushMask'];\n  brushArea: HeatmapStyle['brushArea'];\n}\n\n/**\n * @internal\n *\n * Component for highlighting selected cells\n */\nexport const HighlighterCellsComponent: FC<HighlighterCellsProps> = ({\n  initialized,\n  dragShape,\n  chartId,\n  canvasDimension,\n  brushArea,\n  brushMask,\n}) => {\n  if (!initialized || dragShape === null) return null;\n\n  return (\n    <svg className=\"echHighlighter\" width=\"100%\" height=\"100%\">\n      <defs>\n        <mask id={`echHighlighterMask__${chartId}`}>\n          {/* the entire chart */}\n          {brushMask.visible && (\n            <rect\n              x={0}\n              y={0}\n              width={canvasDimension.width + canvasDimension.left}\n              height={canvasDimension.height}\n              fill=\"#eee\"\n            />\n          )}\n          {brushArea.visible && (\n            <>\n              {/* the rectangle box */}\n              <rect\n                x={dragShape.x}\n                y={dragShape.y}\n                width={dragShape.width}\n                height={dragShape.height}\n                fill={brushArea.fill}\n              />\n              {/* the left axis labels */}\n              <rect\n                x={0}\n                y={dragShape.y}\n                width={canvasDimension.left}\n                height={dragShape.height}\n                fill={brushArea.fill}\n              />\n            </>\n          )}\n        </mask>\n      </defs>\n      <g>\n        {/* the entire chart */}\n        {brushMask.visible && (\n          <rect\n            x={0}\n            y={0}\n            width={canvasDimension.width + canvasDimension.left}\n            height={canvasDimension.height}\n            mask={`url(#echHighlighterMask__${chartId})`}\n            fill={brushMask.fill}\n          />\n        )}\n        {brushArea.visible && (\n          <>\n            {/* top line for the box */}\n            <line\n              x1={dragShape.x}\n              y1={dragShape.y}\n              x2={dragShape.x + dragShape.width}\n              y2={dragShape.y}\n              stroke={brushArea.stroke}\n              strokeWidth={brushArea.strokeWidth}\n            />\n            {/* bottom line */}\n            <line\n              x1={dragShape.x}\n              y1={dragShape.y + dragShape.height}\n              x2={dragShape.x + dragShape.width}\n              y2={dragShape.y + dragShape.height}\n              stroke={brushArea.stroke}\n              strokeWidth={brushArea.strokeWidth}\n            />\n            {/* left line */}\n            <line\n              x1={dragShape.x}\n              y1={dragShape.y}\n              x2={dragShape.x}\n              y2={dragShape.y + dragShape.height}\n              stroke={brushArea.stroke}\n              strokeWidth={brushArea.strokeWidth}\n            />\n            {/* right line */}\n            <line\n              x1={dragShape.x + dragShape.width}\n              y1={dragShape.y}\n              x2={dragShape.x + dragShape.width}\n              y2={dragShape.y + dragShape.height}\n              stroke={brushArea.stroke}\n              strokeWidth={brushArea.strokeWidth}\n            />\n          </>\n        )}\n      </g>\n    </svg>\n  );\n};\n\n/** @internal */\nexport const DEFAULT_PROPS: HighlighterCellsProps = {\n  chartId: 'empty',\n  initialized: false,\n  canvasDimension: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  geometries: nullShapeViewModel(),\n  dragShape: { x: 0, y: 0, height: 0, width: 0 },\n  brushArea: LIGHT_THEME.heatmap.brushArea,\n  brushMask: LIGHT_THEME.heatmap.brushMask,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { connect } from 'react-redux';\n\nimport { DEFAULT_PROPS, HighlighterCellsComponent, HighlighterCellsProps } from './highlighter';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions';\nimport { getBrushedHighlightedShapesSelector } from '../../state/selectors/get_brushed_highlighted_shapes';\nimport { getHighlightedAreaSelector } from '../../state/selectors/get_highlighted_area';\nimport { getPerPanelHeatmapGeometries } from '../../state/selectors/get_per_panel_heatmap_geometries';\n\nconst brushMapStateToProps = (state: GlobalChartState): HighlighterCellsProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n\n  let dragShape = getBrushedHighlightedShapesSelector(state);\n  const highlightedArea = getHighlightedAreaSelector(state);\n\n  if (highlightedArea) {\n    dragShape = highlightedArea;\n  }\n\n  const { chartId } = state;\n  const geoms = getPerPanelHeatmapGeometries(state);\n  const canvasDimension = computeChartDimensionsSelector(state).chartDimensions;\n  const { brushMask, brushArea } = getChartThemeSelector(state).heatmap;\n\n  return {\n    chartId,\n    initialized: true,\n    canvasDimension,\n    geometries: geoms,\n    dragShape,\n    brushMask,\n    brushArea,\n  };\n};\n\n/**\n * @internal\n */\nexport const HighlighterFromBrush = connect(brushMapStateToProps)(HighlighterCellsComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Colors, ColorScale } from '../../../common/colors';\nimport { getPredicateFn } from '../../../common/predicate';\nimport { isFiniteNumber, safeFormat, ValueFormatter } from '../../../utils/common';\nimport { ColorBand, HeatmapBandsColorScale } from '../specs/heatmap';\n\nfunction defaultColorBandFormatter(valueFormatter?: ValueFormatter) {\n  return (startValue: number, endValue: number) => {\n    const finiteStart = Number.isFinite(startValue);\n    const finiteEnd = Number.isFinite(endValue);\n    const start = safeFormat(startValue, valueFormatter);\n    const end = safeFormat(endValue, valueFormatter);\n    return !finiteStart && finiteEnd ? `< ${end}` : finiteStart && !finiteEnd ? `≥ ${start}` : `${start} - ${end}`;\n  };\n}\n\n/** @internal */\nexport function getBandsColorScale(\n  colorScale: HeatmapBandsColorScale,\n  locale: string,\n  valueFormatter?: ValueFormatter,\n): { scale: ColorScale; bands: Required<ColorBand>[] } {\n  const labelFormatter = colorScale.labelFormatter ?? defaultColorBandFormatter(valueFormatter);\n  const ascendingSortFn = getPredicateFn('numAsc', locale, 'start');\n  const bands = colorScale.bands\n    .reduce<Required<ColorBand>[]>((acc, { start, end, color, label }) => {\n      // admit only proper bands\n      if (start < end) acc.push({ start, end, color, label: label ?? labelFormatter(start, end) });\n      return acc;\n    }, [])\n    .sort(ascendingSortFn);\n\n  const scale = getBandScale(bands);\n  return { scale, bands };\n}\n\nfunction getBandScale(bands: ColorBand[]): ColorScale {\n  return (value) => {\n    // this prevents assigning a color to NaN values\n    if (!isFiniteNumber(value)) {\n      return Colors.Transparent.keyword;\n    }\n\n    return bands.find(({ start, end }) => start <= value && value < end)?.color ?? Colors.Transparent.keyword;\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { X_SCALE_DEFAULT } from './scale_defaults';\nimport { ChartType } from '../..';\nimport { Color } from '../../../common/colors';\nimport { SmallMultiplesDatum } from '../../../common/panel_utils';\nimport { Predicate } from '../../../common/predicate';\nimport { ScaleType } from '../../../scales/constants';\nimport { BaseDatum, Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Accessor, AccessorFn } from '../../../utils/accessor';\nimport { ESCalendarInterval, ESFixedInterval } from '../../../utils/chrono/elasticsearch';\nimport { Datum, LabelAccessor, stripUndefined, ValueFormatter } from '../../../utils/common';\nimport { Cell } from '../layout/types/viewmodel_types';\n\n/** @public */\nexport type HeatmapScaleType =\n  | typeof ScaleType.Linear\n  | typeof ScaleType.Quantile\n  | typeof ScaleType.Quantize\n  | typeof ScaleType.Threshold;\n\n/** @alpha */\nexport type ColorBand = {\n  start: number;\n  end: number;\n  color: Color;\n  label?: string;\n};\n\n/** @alpha */\nexport interface HeatmapBandsColorScale {\n  type: 'bands';\n  bands: Array<ColorBand>;\n  /** called on ColorBands without a provided label */\n  labelFormatter?: (start: number, end: number) => string;\n}\n\n/** @public */\nexport type HeatmapBrushEvent = HeatmapHighlightedData & {\n  cells: Cell[];\n};\n/** @public */\nexport interface TimeScale {\n  type: typeof ScaleType.Time;\n}\n\n/** @public */\nexport interface RasterTimeScale extends TimeScale {\n  interval: ESCalendarInterval | ESFixedInterval;\n}\n\n/** @public */\nexport interface LinearScale {\n  type: typeof ScaleType.Linear;\n}\n\n/** @public */\nexport interface OrdinalScale {\n  type: typeof ScaleType.Ordinal;\n}\n\n/**\n * @public\n */\nexport interface HeatmapHighlightedData extends SmallMultiplesDatum {\n  x: Array<string | number>;\n  y: Array<string | number>;\n}\n\n/** @alpha */\nexport interface HeatmapSpec<D extends BaseDatum = Datum> extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Heatmap;\n  data: D[];\n  colorScale: HeatmapBandsColorScale;\n  xAccessor: Accessor<D> | AccessorFn<D>;\n  yAccessor: Accessor<D> | AccessorFn<D>;\n  valueAccessor: Accessor<never> | AccessorFn;\n  valueFormatter: ValueFormatter;\n  xSortPredicate: Predicate;\n  ySortPredicate: Predicate;\n  xScale: RasterTimeScale | OrdinalScale | LinearScale;\n  highlightedData?: HeatmapHighlightedData;\n  name?: string;\n  timeZone: string;\n  xAxisTitle: string;\n  xAxisLabelName: string;\n  xAxisLabelFormatter: LabelAccessor<string | number>;\n  yAxisTitle: string;\n  yAxisLabelName: string;\n  yAxisLabelFormatter: LabelAccessor<string | number>;\n}\n\n/** @internal */\nexport const heatmapBuildProps = buildSFProps<HeatmapSpec>()(\n  {\n    chartType: ChartType.Heatmap,\n    specType: SpecType.Series,\n  },\n  {\n    data: [],\n    valueAccessor: ({ value }) => value,\n    xScale: { type: X_SCALE_DEFAULT.type },\n    valueFormatter: (value) => `${value}`,\n    xSortPredicate: Predicate.AlphaAsc,\n    ySortPredicate: Predicate.AlphaAsc,\n    // TODO: make accessors required\n    xAccessor: (d) => d?.x,\n    yAccessor: (d) => d?.y,\n    timeZone: 'UTC',\n    xAxisTitle: '',\n    yAxisTitle: '',\n    xAxisLabelName: 'X Value',\n    xAxisLabelFormatter: String,\n    yAxisLabelName: 'Y Value',\n    yAxisLabelFormatter: String,\n  },\n);\n\n/**\n * Adds heatmap spec to chart specs\n * @alpha\n */\nexport const Heatmap = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    HeatmapSpec<D>,\n    keyof (typeof heatmapBuildProps)['overrides'],\n    keyof (typeof heatmapBuildProps)['defaults'],\n    keyof (typeof heatmapBuildProps)['optionals'],\n    keyof (typeof heatmapBuildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = heatmapBuildProps;\n  useSpecFactory<HeatmapSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type HeatmapProps = ComponentProps<typeof Heatmap>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './heatmap';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleType } from '../../../scales/constants';\n\n/** @internal */\nexport const X_SCALE_DEFAULT = {\n  type: ScaleType.Ordinal,\n  nice: false,\n  desiredTickCount: 10,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { computeChartDimensionsSelector } from './selectors/compute_chart_dimensions';\nimport { computeLegendSelector } from './selectors/compute_legend';\nimport { getBrushAreaSelector } from './selectors/get_brush_area';\nimport { getPointerCursorSelector } from './selectors/get_cursor_pointer';\nimport { getDebugStateSelector } from './selectors/get_debug_state';\nimport { getHeatmapTableSelector } from './selectors/get_heatmap_table';\nimport { getLegendItemsLabelsSelector } from './selectors/get_legend_items_labels';\nimport { getTooltipAnchorSelector } from './selectors/get_tooltip_anchor';\nimport { isBrushAvailableSelector } from './selectors/is_brush_available';\nimport { isEmptySelector } from './selectors/is_empty';\nimport { isTooltipVisibleSelector } from './selectors/is_tooltip_visible';\nimport { createOnBrushEndCaller } from './selectors/on_brush_end_caller';\nimport { createOnElementClickCaller } from './selectors/on_element_click_caller';\nimport { createOnElementOutCaller } from './selectors/on_element_out_caller';\nimport { createOnElementOverCaller } from './selectors/on_element_over_caller';\nimport { createOnPointerUpdateCaller } from './selectors/on_pointer_update_caller';\nimport { getTooltipInfoSelector } from './selectors/tooltip';\nimport { ChartType } from '../..';\nimport { SmallMultiplesSeriesDomains } from '../../../common/panel_utils';\nimport { BrushTool } from '../../../components/brush/brush';\nimport { Tooltip } from '../../../components/tooltip/tooltip';\nimport { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state';\nimport { getChartContainerDimensionsSelector } from '../../../state/selectors/get_chart_container_dimensions';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { isBrushingSelector } from '../../../state/selectors/is_brushing';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { Heatmap } from '../renderer/canvas/connected_component';\nimport { CursorBand } from '../renderer/dom/cursor_band';\nimport { HighlighterFromBrush } from '../renderer/dom/highlighter_brush';\n\nconst EMPTY_MAP = new Map();\n\n/** @internal */\nexport class HeatmapState implements InternalChartState {\n  chartType = ChartType.Heatmap;\n\n  onElementClickCaller: (state: GlobalChartState) => void = createOnElementClickCaller();\n\n  onElementOverCaller: (state: GlobalChartState) => void = createOnElementOverCaller();\n\n  onElementOutCaller: (state: GlobalChartState) => void = createOnElementOutCaller();\n\n  onBrushEndCaller: (state: GlobalChartState) => void = createOnBrushEndCaller();\n\n  onPointerUpdate: (state: GlobalChartState) => void = createOnPointerUpdateCaller();\n\n  isInitialized() {\n    return InitStatus.Initialized;\n  }\n\n  isBrushAvailable(globalState: GlobalChartState) {\n    return isBrushAvailableSelector(globalState);\n  }\n\n  isBrushing(globalState: GlobalChartState) {\n    return isBrushingSelector(globalState);\n  }\n\n  isChartEmpty(globalState: GlobalChartState) {\n    return isEmptySelector(globalState);\n  }\n\n  getLegendItems(globalState: GlobalChartState) {\n    return computeLegendSelector(globalState);\n  }\n\n  getLegendItemsLabels(globalState: GlobalChartState) {\n    return getLegendItemsLabelsSelector(globalState);\n  }\n\n  getLegendExtraValues() {\n    return EMPTY_MAP;\n  }\n\n  chartRenderer(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) {\n    return (\n      <>\n        <Tooltip getChartContainerRef={containerRef} />\n        <Heatmap forwardStageRef={forwardStageRef} />\n        <CursorBand />\n        <BrushTool />\n        <HighlighterFromBrush />\n      </>\n    );\n  }\n\n  getPointerCursor(globalState: GlobalChartState) {\n    return getPointerCursorSelector(globalState);\n  }\n\n  isTooltipVisible(globalState: GlobalChartState) {\n    return isTooltipVisibleSelector(globalState);\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfoSelector(globalState);\n  }\n\n  getTooltipAnchor(globalState: GlobalChartState) {\n    return getTooltipAnchorSelector(globalState);\n  }\n\n  getProjectionContainerArea(globalState: GlobalChartState): Dimensions {\n    return getChartContainerDimensionsSelector(globalState);\n  }\n\n  getMainProjectionArea(globalState: GlobalChartState): Dimensions {\n    return computeChartDimensionsSelector(globalState).chartDimensions;\n  }\n\n  getBrushArea(globalState: GlobalChartState): Dimensions | null {\n    return getBrushAreaSelector(globalState);\n  }\n\n  getDebugState(globalState: GlobalChartState) {\n    return getDebugStateSelector(globalState);\n  }\n\n  getChartTypeDescription() {\n    return 'Heatmap chart';\n  }\n\n  getSmallMultiplesDomains(globalState: GlobalChartState): SmallMultiplesSeriesDomains {\n    return getHeatmapTableSelector(globalState);\n  }\n\n  eventCallbacks(globalState: GlobalChartState) {\n    this.onElementOverCaller(globalState);\n    this.onElementOutCaller(globalState);\n    this.onElementClickCaller(globalState);\n    this.onBrushEndCaller(globalState);\n    this.onPointerUpdate(globalState);\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getHeatmapTableSelector } from './get_heatmap_table';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getScale } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalSmallMultiplesDomains } from '../../../../state/selectors/get_internal_sm_domains';\nimport { getLegendSizeSelector } from '../../../../state/selectors/get_legend_size';\nimport { getSmallMultiplesSpec } from '../../../../state/selectors/get_small_multiples_spec';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isHorizontalLegend } from '../../../../utils/legend';\nimport { isRasterTimeScale } from '../../layout/viewmodel/viewmodel';\nimport { getTextSizeDimension, getYAxisHorizontalUsedSpace, getXAxisSize } from '../utils/axis';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/**\n * Returns grid and axes sizes and positions.\n * @internal\n */\nexport const computeAxesSizesSelector = createCustomCachedSelector(\n  [\n    getParentDimension,\n    getLegendSizeSelector,\n    getHeatmapTableSelector,\n    getChartThemeSelector,\n    getHeatmapSpecSelector,\n    getSmallMultiplesSpec,\n    getInternalSmallMultiplesDomains,\n  ],\n  (\n    container,\n    legendSize,\n    { yValues, xValues },\n    { heatmap, axes: { axisTitle: axisTitleStyle, axisPanelTitle: axisPanelTitleStyle } },\n    { xAxisTitle, yAxisTitle, xAxisLabelFormatter, yAxisLabelFormatter, xScale },\n    smSpec,\n    { smHDomain },\n  ) => {\n    // TODO find a cleaner way without circular dependencies\n    const panelWidth = getScale(smHDomain, container.width, smSpec?.style?.horizontalPanelPadding).bandwidth;\n\n    return withTextMeasure((textMeasure) => {\n      const isLegendHorizontal = isHorizontalLegend(legendSize.position);\n      const legendWidth = !isLegendHorizontal ? legendSize.width + legendSize.margin * 2 : 0;\n      const legendHeight = isLegendHorizontal\n        ? heatmap.maxLegendHeight ?? legendSize.height + legendSize.margin * 2\n        : 0;\n\n      const yAxisTitleHorizontalSize = getTextSizeDimension(yAxisTitle, axisTitleStyle, textMeasure, 'height');\n      const yAxisPanelTitleHorizontalSize = getTextSizeDimension(\n        yAxisTitle,\n        axisPanelTitleStyle,\n        textMeasure,\n        'height',\n        !smSpec?.splitVertically,\n      );\n      const yAxis = {\n        width: getYAxisHorizontalUsedSpace(yValues, heatmap.yAxisLabel, yAxisLabelFormatter, textMeasure),\n      };\n\n      const xAxisTitleVerticalSize = getTextSizeDimension(xAxisTitle, axisTitleStyle, textMeasure, 'height');\n      const xAxisPanelTitleVerticalSize = getTextSizeDimension(\n        xAxisTitle,\n        axisPanelTitleStyle,\n        textMeasure,\n        'height',\n        !smSpec?.splitHorizontally,\n      );\n      const xAxis = getXAxisSize(\n        !isRasterTimeScale(xScale),\n        heatmap.xAxisLabel,\n        xAxisLabelFormatter,\n        xValues,\n        textMeasure,\n        panelWidth - legendWidth - heatmap.grid.stroke.width / 2, // we should consider also the grid width\n        [\n          yAxisTitleHorizontalSize + yAxisPanelTitleHorizontalSize + yAxis.width,\n          0, // this can be used if we have a right Y axis\n        ],\n      );\n\n      // TODO simplify this width calculation\n      const chartWidth = getXAxisSize(\n        !isRasterTimeScale(xScale),\n        heatmap.xAxisLabel,\n        xAxisLabelFormatter,\n        xValues,\n        textMeasure,\n        container.width - legendWidth - heatmap.grid.stroke.width / 2, // we should consider also the grid width\n        [\n          yAxisTitleHorizontalSize + yAxisPanelTitleHorizontalSize + yAxis.width,\n          0, // this can be used if we have a right Y axis\n        ],\n      ).width;\n\n      return {\n        yAxis,\n        xAxis,\n        legendHeight,\n        xAxisTitleVerticalSize,\n        xAxisPanelTitleVerticalSize,\n        chartWidth,\n      };\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesSizesSelector } from './compute_axes_sizes';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { ChartDimensions } from '../../../xy_chart/utils/dimensions';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/**\n * Returns chart dimensions  axes sizes and positions.\n * @internal\n */\nexport const computeChartDimensionsSelector = createCustomCachedSelector(\n  [getParentDimension, computeAxesSizesSelector, getChartThemeSelector],\n  (parentDimensions, axesSizes, { heatmap, chartPaddings }): ChartDimensions => {\n    const chartHeight =\n      parentDimensions.height -\n      axesSizes.xAxisTitleVerticalSize -\n      axesSizes.xAxisPanelTitleVerticalSize -\n      axesSizes.xAxis.height -\n      axesSizes.legendHeight -\n      heatmap.grid.stroke.width / 2;\n\n    const { chartWidth } = axesSizes;\n\n    return {\n      leftMargin: NaN, // not used\n      chartDimensions: {\n        top: parentDimensions.top + heatmap.grid.stroke.width / 2 + chartPaddings.top,\n        left: parentDimensions.left + axesSizes.xAxis.left + chartPaddings.left,\n        width: Math.max(0, chartWidth - chartPaddings.left - chartPaddings.right),\n        height: Math.max(0, chartHeight - chartPaddings.top - chartPaddings.bottom),\n      },\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesSizesSelector } from './compute_axes_sizes';\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getPanelSize } from '../../../../common/panel_utils';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { Dimensions } from '../../../../utils/dimensions';\n\n/** @internal */\nexport type ChartElementSizes = {\n  yAxis: Dimensions;\n  xAxis: Dimensions;\n  xAxisTickCadence: number;\n  xLabelRotation: number;\n};\n\n/**\n * Returns grid and axes sizes and positions.\n * @internal\n */\nexport const computeChartElementSizesSelector = createCustomCachedSelector(\n  [computeChartDimensionsSelector, computeAxesSizesSelector, getChartThemeSelector, computeSmallMultipleScalesSelector],\n  ({ chartDimensions }, axesSizes, { heatmap }, smScales): ChartElementSizes => {\n    const panelHeight = getPanelSize(smScales).height;\n    const grid: Dimensions = {\n      width: axesSizes.xAxis.width,\n      height: panelHeight,\n      left: chartDimensions.left + axesSizes.xAxis.left,\n      top: chartDimensions.top + heatmap.grid.stroke.width / 2,\n    };\n\n    const yAxis: Dimensions = {\n      width: axesSizes.yAxis.width,\n      height: grid.height,\n      top: grid.top,\n      left: grid.left - axesSizes.yAxis.width,\n    };\n\n    const xAxis: Dimensions = {\n      width: grid.width,\n      height: axesSizes.xAxis.height,\n      top: grid.top + grid.height,\n      left: grid.left,\n    };\n\n    return {\n      yAxis,\n      xAxis,\n      xAxisTickCadence: axesSizes.xAxis.tickCadence,\n      xLabelRotation: axesSizes.xAxis.minRotation,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getColorScale } from './get_color_scale';\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { isEmptySelector } from './is_empty';\nimport { LegendItem } from '../../../../common/legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getDeselectedSeriesSelector } from '../../../../state/selectors/get_deselected_data_series';\n\nconst EMPTY_LEGEND: LegendItem[] = [];\n/** @internal */\nexport const computeLegendSelector = createCustomCachedSelector(\n  [getHeatmapSpecSelector, getColorScale, getDeselectedSeriesSelector, isEmptySelector],\n  (spec, { bands }, deselectedDataSeries, empty): LegendItem[] => {\n    if (spec === null || empty) {\n      return EMPTY_LEGEND;\n    }\n\n    return bands.map(({ label, color }) => {\n      return {\n        // the band label is considered unique by construction\n        seriesIdentifiers: [{ key: label, specId: label }],\n        color,\n        label,\n        isSeriesHidden: deselectedDataSeries.some(({ key }) => key === label),\n        isToggleable: true,\n        path: [{ index: 0, value: label }],\n        keys: [],\n      };\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getBrushedHighlightedShapesSelector } from './get_brushed_highlighted_shapes';\nimport { BrushAxis } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\nimport { clamp } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\n\nconst getMouseDownPosition = (state: GlobalChartState) => state.interactions.pointer.down;\n\n/** @internal */\nexport const getBrushAreaSelector = createCustomCachedSelector(\n  [\n    isBrushingSelector,\n    getMouseDownPosition,\n    getActivePointerPosition,\n    getSettingsSpecSelector,\n    computeChartDimensionsSelector,\n    getBrushedHighlightedShapesSelector,\n  ],\n  (isBrushing, mouseDownPosition, end, { brushAxis }, { chartDimensions }, dragShape): Dimensions | null => {\n    if (!isBrushing || !mouseDownPosition || !dragShape) {\n      return null;\n    }\n\n    const start = {\n      x: mouseDownPosition.position.x - chartDimensions.left,\n      y: mouseDownPosition.position.y,\n    };\n\n    const clampedEndY = clamp(end.y, 0, chartDimensions.height);\n    switch (brushAxis) {\n      case BrushAxis.Both:\n        return {\n          top: start.y,\n          left: start.x,\n          width: end.x - start.x - chartDimensions.left,\n          height: clampedEndY - start.y,\n        };\n      default:\n        return {\n          top: start.y,\n          left: start.x,\n          width: end.x - start.x - chartDimensions.left,\n          height: clampedEndY - start.y,\n        };\n    }\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActivePointerPosition } from './../../../../state/selectors/get_active_pointer_position';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { DragShape } from '../../layout/types/viewmodel_types';\n\nfunction getCurrentPointerStates(state: GlobalChartState) {\n  return state.interactions.pointer;\n}\n\n/** @internal */\nexport const getBrushedHighlightedShapesSelector = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getCurrentPointerStates, getActivePointerPosition],\n  (geoms, pointerStates, activePosition): DragShape => {\n    if (!pointerStates.dragging || !pointerStates.down) {\n      return null;\n    }\n\n    return geoms.pickDragShape([pointerStates.down.position, activePosition]);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { ColorScale } from '../../../../common/colors';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getBandsColorScale } from '../../scales/band_color_scale';\nimport { ColorBand } from '../../specs/heatmap';\n\n/**\n * @internal\n * Gets color scale based on specification and values range.\n */\nexport const getColorScale = createCustomCachedSelector(\n  [getSettingsSpecSelector, getHeatmapSpecSelector],\n  (\n    { locale },\n    spec,\n  ): {\n    scale: ColorScale;\n    bands: Required<ColorBand>[];\n  } => getBandsColorScale(spec.colorScale, locale, spec.valueFormatter),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { getTooltipAnchorSelector } from './get_tooltip_anchor';\nimport { getPickedShapes, hasPicketVisibleCells } from './picked_shapes';\nimport { Rect } from '../../../../geoms/types';\nimport { isPointerOverEvent } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getInternalIsBrushingSelector } from '../../../../state/selectors/get_internal_is_brushing';\nimport { isNil } from '../../../../utils/common';\n\nconst getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer;\n\n/** @internal */\nexport const getCursorBandPositionSelector = createCustomCachedSelector(\n  [\n    getPerPanelHeatmapGeometries,\n    getExternalPointerEventStateSelector,\n    getPickedShapes,\n    getTooltipAnchorSelector,\n    getInternalIsBrushingSelector,\n  ],\n  (\n    geoms,\n    externalPointerEvent,\n    pickedShapes,\n    tooltipShape,\n    isBrushing,\n  ): (Rect & { fromExternalEvent: boolean }) | undefined => {\n    // block cursor when brusing\n    if (isBrushing) return;\n\n    // external pointer events takes precedence over the current mouse pointer\n    if (isPointerOverEvent(externalPointerEvent)) {\n      const { x } = externalPointerEvent;\n      if (!isNil(x)) {\n        const band = geoms.pickCursorBand(x);\n        if (band) {\n          return {\n            ...band,\n            fromExternalEvent: true,\n          };\n        }\n      }\n    }\n\n    if (hasPicketVisibleCells(pickedShapes)) {\n      return {\n        ...tooltipShape,\n        fromExternalEvent: false,\n      };\n    }\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\n\nimport { getPickedShapes, hasPicketVisibleCells } from './picked_shapes';\nimport { DEFAULT_CSS_CURSOR } from '../../../../common/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\n\n/** @internal */\nexport const getPointerCursorSelector = createCustomCachedSelector(\n  [getPickedShapes, isBrushingSelector, getTooltipInteractionState],\n  (pickedShapes, isBrushing, tooltipState): CSSProperties['cursor'] => {\n    if (tooltipState.pinned) return;\n    return isBrushing || hasPicketVisibleCells(pickedShapes) ? 'pointer' : DEFAULT_CSS_CURSOR;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartElementSizesSelector } from './compute_chart_element_sizes';\nimport { computeLegendSelector } from './compute_legend';\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getHighlightedAreaSelector, getHighlightedDataSelector } from './get_highlighted_area';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { LegendItem } from '../../../../common/legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { DebugState, DebugStateLegend } from '../../../../state/types';\nimport { Position } from '../../../../utils/common';\n\n/**\n * Returns a stringified version of the `debugState`\n * @internal\n */\nexport const getDebugStateSelector = createCustomCachedSelector(\n  [\n    getPerPanelHeatmapGeometries,\n    computeLegendSelector,\n    getHighlightedAreaSelector,\n    getHighlightedDataSelector,\n    getChartThemeSelector,\n    computeChartElementSizesSelector,\n    getHeatmapSpecSelector,\n  ],\n  (\n    geoms,\n    legend,\n    pickedArea,\n    highlightedData,\n    { heatmap },\n    { xAxisTickCadence },\n    { xAxisTitle, yAxisTitle },\n  ): DebugState => {\n    const heatmapViewModel = geoms.heatmapViewModels[0];\n    const xAxisValues = heatmapViewModel?.xValues.filter((_, i) => i % xAxisTickCadence === 0) ?? [];\n\n    return {\n      // Common debug state\n      legend: getLegendState(legend),\n      axes: {\n        x: [\n          {\n            id: 'x',\n            position: Position.Left,\n            labels: xAxisValues.map(({ text }) => text),\n            values: xAxisValues.map(({ value }) => value),\n            // vertical lines\n            gridlines: (heatmapViewModel?.gridLines?.x ?? []).map((line) => ({ x: line.x1, y: line.y2 })),\n            ...(xAxisTitle ? { title: xAxisTitle } : {}),\n          },\n        ],\n        y: [\n          {\n            id: 'y',\n            position: Position.Bottom,\n            labels: (heatmapViewModel?.yValues ?? []).map(({ text }) => text),\n            values: (heatmapViewModel?.yValues ?? []).map(({ value }) => value),\n            // horizontal lines\n            gridlines: (heatmapViewModel?.gridLines?.y ?? []).map((line) => ({ x: line.x2, y: line.y1 })),\n            ...(yAxisTitle ? { title: yAxisTitle } : {}),\n          },\n        ],\n      },\n      // Heatmap debug state\n      heatmap: {\n        cells: geoms.heatmapViewModels.flatMap((vm) =>\n          vm.cells.map((cell) => ({\n            x: cell.x,\n            y: cell.y,\n            datum: cell.datum,\n            fill: RGBATupleToString(cell.fill.color),\n            formatted: cell.formatted,\n            value: cell.value,\n            valueShown: heatmap.cell.label.visible && Number.isFinite(vm.cellFontSize(cell)),\n          })),\n        ),\n        selection: {\n          area: pickedArea,\n          data: highlightedData,\n        },\n      },\n    };\n  },\n);\n\nfunction getLegendState(legendItems: LegendItem[]): DebugStateLegend {\n  const items = legendItems\n    .filter(({ isSeriesHidden }) => !isSeriesHidden)\n    .map(({ label: name, color, seriesIdentifiers: [seriesIdentifier] }) => ({\n      key: seriesIdentifier?.key ?? '',\n      name,\n      color,\n    }));\n\n  return { items };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getLegendConfigSelector } from '../../../../state/selectors/get_legend_config_selector';\nimport { getLegendSizeSelector } from '../../../../state/selectors/get_legend_size';\nimport { LayoutDirection } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/**\n * Gets charts grid area excluding legend and X,Y axis labels and paddings.\n * @internal\n */\nexport const getHeatmapContainerSizeSelector = createCustomCachedSelector(\n  [getParentDimension, getLegendSizeSelector, getChartThemeSelector, getLegendConfigSelector],\n  (parentDimensions, legendSize, { heatmap: { maxLegendHeight } }, { showLegend, legendPosition }): Dimensions => {\n    if (!showLegend || legendPosition.floating) {\n      return parentDimensions;\n    }\n    if (legendPosition.direction === LayoutDirection.Vertical) {\n      return {\n        left: 0,\n        top: 0,\n        width: parentDimensions.width - legendSize.width - legendSize.margin * 2,\n        height: parentDimensions.height,\n      };\n    }\n\n    const legendHeight = maxLegendHeight ?? legendSize.height + legendSize.margin * 2;\n\n    return {\n      left: 0,\n      top: 0,\n      width: parentDimensions.width,\n      height: parentDimensions.height - legendHeight,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { HeatmapSpec } from '../../specs';\n\n/** @internal */\nexport const getHeatmapSpecSelector = createCustomCachedSelector([getSpecs], (specs): HeatmapSpec => {\n  return getSpecFromStore<HeatmapSpec, true>(specs, ChartType.Heatmap, SpecType.Series, true);\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { extent } from 'd3-array';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { SmallMultiplesSeriesDomains } from '../../../../common/panel_utils';\nimport { getPredicateFn, Predicate } from '../../../../common/predicate';\nimport { ScaleType } from '../../../../scales/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getSmallMultiplesIndexOrderSelector } from '../../../../state/selectors/get_small_multiples_index_order';\nimport { getAccessorValue } from '../../../../utils/accessor';\nimport { addIntervalToTime, timeRange } from '../../../../utils/chrono/elasticsearch';\nimport { isFiniteNumber, isNil, isNonNullablePrimitiveValue } from '../../../../utils/common';\nimport { HeatmapCellDatum } from '../../layout/viewmodel/viewmodel';\n\n/**\n * @internal\n */\nexport interface HeatmapTable extends SmallMultiplesSeriesDomains {\n  table: Array<HeatmapCellDatum>;\n  yValues: Array<string | number>;\n  xValues: Array<string | number>;\n  xNumericExtent: [number, number];\n  extent: [number, number];\n}\n\n/**\n * Extracts axis and cell values from the input data.\n * @internal\n */\nexport const getHeatmapTableSelector = createCustomCachedSelector(\n  [getHeatmapSpecSelector, getSettingsSpecSelector, getSmallMultiplesIndexOrderSelector],\n  (spec, { xDomain, locale }, smallMultiples): HeatmapTable => {\n    const { data, valueAccessor, xAccessor, yAccessor, xSortPredicate, ySortPredicate, xScale, timeZone } = spec;\n    const smVValues = new Set<string | number>();\n    const smHValues = new Set<string | number>();\n    const resultData = data.reduce<HeatmapTable>(\n      (acc, curr, index) => {\n        const x = getAccessorValue(curr, xAccessor);\n        const y = getAccessorValue(curr, yAccessor);\n        const value = getAccessorValue(curr, valueAccessor);\n\n        if (!isNonNullablePrimitiveValue(x) || !isNonNullablePrimitiveValue(y)) {\n          return acc;\n        }\n        // add a cell and update extent only if the value is finite\n        if (isFiniteNumber(value)) {\n          acc.extent = [Math.min(acc.extent[0], value), Math.max(acc.extent[1], value)];\n\n          // extract small multiples aggregation values\n          const smH = smallMultiples?.horizontal?.by?.(spec, curr);\n          const smV = smallMultiples?.vertical?.by?.(spec, curr);\n\n          if (!isNil(smH)) smHValues.add(smH);\n          if (!isNil(smV)) smVValues.add(smV);\n\n          acc.table.push({\n            x,\n            y,\n            value,\n            originalIndex: index,\n            smVerticalAccessorValue: smV,\n            smHorizontalAccessorValue: smH,\n          });\n        }\n        // the x and y values are used for the scale domain, and we want to keep track of every element, even non-finite values\n        if (!acc.xValues.includes(x)) {\n          acc.xValues.push(x);\n        }\n        if (!acc.yValues.includes(y)) {\n          acc.yValues.push(y);\n        }\n\n        return acc;\n      },\n      {\n        table: [],\n        xValues: [],\n        yValues: [],\n        smHDomain: [],\n        smVDomain: [],\n        extent: [+Infinity, -Infinity],\n        xNumericExtent: [+Infinity, -Infinity],\n      },\n    );\n    if (xScale.type === ScaleType.Time) {\n      const [xDataMin = NaN, xDataMax = NaN] = extent(resultData.xValues as number[]);\n      // to correctly compute the time extent from data, we need to add an interval to the max value of the dataset\n      const dataMaxExtended = xDataMax ? addIntervalToTime(xDataMax, xScale.interval, timeZone) : NaN;\n\n      const [customMin, customMax] = !Array.isArray(xDomain) ? [xDomain?.min ?? NaN, xDomain?.max ?? NaN] : [NaN, NaN];\n      const [min, max] = extent([xDataMin, customMin, customMax, dataMaxExtended]);\n      resultData.xNumericExtent = [min ?? NaN, max ?? NaN];\n      resultData.xValues =\n        isFiniteNumber(min) && isFiniteNumber(max) ? timeRange(min, max, xScale.interval, timeZone) : [];\n    } else if (xScale.type === ScaleType.Ordinal) {\n      resultData.xValues.sort(getPredicateFn(xSortPredicate, locale));\n    }\n\n    // sort Y values by their predicates\n    resultData.yValues.sort(getPredicateFn(ySortPredicate, locale));\n\n    // sort small multiples values\n    const horizontalPredicate = smallMultiples?.horizontal?.sort ?? Predicate.DataIndex;\n    const smHDomain = [...smHValues].sort(getPredicateFn(horizontalPredicate, locale));\n\n    const verticalPredicate = smallMultiples?.vertical?.sort ?? Predicate.DataIndex;\n    const smVDomain = [...smVValues].sort(getPredicateFn(verticalPredicate, locale));\n\n    return {\n      ...resultData,\n      smHDomain,\n      smVDomain,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\n\n/**\n * @internal\n */\nexport const getHighlightedDataSelector = createCustomCachedSelector(\n  [getHeatmapSpecSelector, isBrushingSelector],\n  (spec, isBrushing) => {\n    if (!spec.highlightedData || isBrushing) {\n      return null;\n    }\n    return spec.highlightedData;\n  },\n);\n\n/**\n * Returns rect position of the highlighted selection.\n * @internal\n */\nexport const getHighlightedAreaSelector = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getHeatmapSpecSelector, isBrushingSelector],\n  (geoms, spec, isBrushing) => {\n    if (!spec.highlightedData || isBrushing) {\n      return null;\n    }\n    const { x, y, smHorizontalAccessorValue, smVerticalAccessorValue } = spec.highlightedData;\n    return geoms.pickHighlightedArea(x, y, smHorizontalAccessorValue, smVerticalAccessorValue);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getColorScale } from './get_color_scale';\nimport { getHighlightedLegendItemSelector } from './get_highlighted_legend_item';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { GenericDomain } from '../../../../utils/domain';\n\n/** @internal */\nexport const getHighlightedLegendBandsSelector = createCustomCachedSelector(\n  [getHighlightedLegendItemSelector, getColorScale],\n  (highlightedLegendItem, { bands }): Array<GenericDomain> => {\n    if (!highlightedLegendItem) return [];\n    // instead of using the specId, each legend item is associated with an unique band label\n    return bands.filter(({ label }) => highlightedLegendItem.label === label).map(({ start, end }) => [start, end]);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { LegendItem } from '../../../../common/legend';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\nconst getHighlightedLegendPath = (state: GlobalChartState) => state.interactions.highlightedLegendPath;\n\n/** @internal */\nexport const getHighlightedLegendItemSelector = createCustomCachedSelector(\n  [getHighlightedLegendPath, computeLegendSelector],\n  (highlightedLegendPaths, legendItems): LegendItem | undefined => {\n    if (highlightedLegendPaths.length > 0) {\n      const lookup = new Set(highlightedLegendPaths.map(({ value }) => value));\n      return legendItems.find(({ seriesIdentifiers }) => seriesIdentifiers.some(({ key }) => lookup.has(key)));\n    }\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/** @internal */\nexport const getLegendItemsLabelsSelector = createCustomCachedSelector(\n  [computeLegendSelector, getSettingsSpecSelector],\n  (legendItems, { showLegendExtra }): LegendItemLabel[] =>\n    legendItems.map(({ label, defaultExtra }) => ({\n      label: `${label}${showLegendExtra ? defaultExtra?.formatted ?? '' : ''}`,\n      depth: 0,\n    })),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { computeChartElementSizesSelector } from './compute_chart_element_sizes';\nimport { getColorScale } from './get_color_scale';\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getHeatmapTableSelector } from './get_heatmap_table';\nimport { isEmptySelector } from './is_empty';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSmallMultiplesIndexOrderSelector } from '../../../../state/selectors/get_small_multiples_index_order';\nimport { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { computeScenegraph } from '../../layout/viewmodel/scenegraph';\n\nconst getDeselectedSeriesSelector = (state: GlobalChartState) => state.interactions.deselectedDataSeries;\n\n/** @internal */\nexport const getPerPanelHeatmapGeometries = createCustomCachedSelector(\n  [\n    getHeatmapSpecSelector,\n    computeChartDimensionsSelector,\n    computeChartElementSizesSelector,\n    getHeatmapTableSelector,\n    getColorScale,\n    getDeselectedSeriesSelector,\n    getChartThemeSelector,\n    isEmptySelector,\n    computeSmallMultipleScalesSelector,\n    getSmallMultiplesIndexOrderSelector,\n  ],\n  (\n    heatmapSpec,\n    chartDimensions,\n    elementSizes,\n    heatmapTable,\n    { bands, scale: colorScale },\n    deselectedSeries,\n    theme,\n    empty,\n    smScales,\n    groupBySpec,\n  ): ShapeViewModel => {\n    // instead of using the specId, each legend item is associated with an unique band label\n    const disabledBandLabels = new Set(deselectedSeries.map(({ specId }) => specId));\n    const bandsToHide: Array<[number, number]> = bands\n      .filter(({ label }) => disabledBandLabels.has(label))\n      .map(({ start, end }) => [start, end]);\n\n    return heatmapSpec && !empty\n      ? computeScenegraph(\n          heatmapSpec,\n          chartDimensions,\n          elementSizes,\n          smScales,\n          groupBySpec,\n          heatmapTable,\n          colorScale,\n          bandsToHide,\n          theme,\n        )\n      : nullShapeViewModel();\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastDragSelector } from '../../../../state/selectors/get_last_drag';\nimport { PickDragFunction } from '../../layout/types/viewmodel_types';\n\n/** @internal */\nexport const getPickedCells = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getLastDragSelector, computeChartDimensionsSelector],\n  (geoms, dragState, { chartDimensions }): ReturnType<PickDragFunction> | null => {\n    if (!dragState) {\n      return null;\n    }\n\n    // the pointer is not on the cells but over the y- axis and does not cross the y-axis\n    if (dragState.start.position.x < chartDimensions.left && dragState.end.position.x < chartDimensions.left) {\n      const fittedDragStateStart = { x: chartDimensions.left, y: dragState.start.position.y };\n      const { y, cells } = geoms.pickDragArea([fittedDragStateStart, dragState.end.position]);\n      // TODO: fix with small multiples\n      return { x: [], y, cells };\n    }\n\n    // the pointer is not on the cells by over the x-axis and does not cross the x-axis\n    if (dragState.start.position.y > chartDimensions.height && dragState.end.position.y > chartDimensions.height) {\n      const fittedDragStateStart = { x: dragState.start.position.x, y: chartDimensions.height };\n      const { x, cells } = geoms.pickDragArea([fittedDragStateStart, dragState.end.position]);\n      // TODO: fix with small multiples\n      return { x, y: [], cells };\n    }\n    return geoms.pickDragArea([dragState.start.position, dragState.end.position]);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getPickedShapes } from './picked_shapes';\nimport { AnchorPosition } from '../../../../components/portal/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\n\n/** @internal */\nexport const getTooltipAnchorSelector = createCustomCachedSelector(\n  [\n    getPickedShapes,\n    computeChartDimensionsSelector,\n    getActivePointerPosition,\n    computeSmallMultipleScalesSelector,\n    getChartThemeSelector,\n  ],\n  (shapes, { chartDimensions }, position, smScales, { heatmap }): AnchorPosition => {\n    const shape = Array.isArray(shapes) && shapes[0];\n    if (shape) {\n      const {\n        x,\n        y,\n        width,\n        height,\n        datum: { smHorizontalAccessorValue = '', smVerticalAccessorValue = '' },\n      } = shape;\n\n      const scaledPanelXOffset = smScales.horizontal.scale(smHorizontalAccessorValue);\n      const scaledPanelYOffset = smScales.vertical.scale(smVerticalAccessorValue);\n\n      const panelXOffset = isNaN(scaledPanelXOffset) ? 0 : scaledPanelXOffset;\n      const panelYOffset = isNaN(scaledPanelYOffset) ? 0 : scaledPanelYOffset;\n\n      return {\n        x: x + chartDimensions.left + panelXOffset,\n        width,\n        y: y - chartDimensions.top + panelYOffset + heatmap.grid.stroke.width,\n        height,\n      };\n    }\n\n    return {\n      x: position.x,\n      width: 0,\n      y: position.y,\n      height: 0,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * The brush is available only if a onBrushEnd listener is configured\n * @internal\n */\nexport const isBrushAvailableSelector = createCustomCachedSelector(\n  [getChartThemeSelector, getSettingsSpecSelector],\n  ({ heatmap: { brushTool } }, { onBrushEnd }): boolean => Boolean(onBrushEnd) && brushTool.visible,\n);\n\n/** @internal */\nexport const isBrushEndProvided = createCustomCachedSelector([getSettingsSpecSelector], ({ onBrushEnd }): boolean =>\n  Boolean(onBrushEnd),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapTableSelector } from './get_heatmap_table';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const isEmptySelector = createCustomCachedSelector([getHeatmapTableSelector], (heatmap): boolean => {\n  return heatmap.xValues.length === 0 || heatmap.yValues.length === 0;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipInfoSelector } from './tooltip';\nimport { TooltipType } from '../../../../specs/constants';\nimport { TooltipVisibility } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\n\n/** @internal */\nexport const isTooltipVisibleSelector = createCustomCachedSelector(\n  [getTooltipSpecSelector, getTooltipInfoSelector, getTooltipInteractionState],\n  ({ type }, tooltipInfo, { pinned }): TooltipVisibility => {\n    if (type === TooltipType.None) {\n      return {\n        visible: false,\n        isExternal: false,\n        displayOnly: false,\n        isPinnable: false,\n      };\n    }\n\n    return {\n      visible: tooltipInfo.values.length > 0 || pinned,\n      displayOnly: tooltipInfo.values.every(({ displayOnly }) => displayOnly),\n      isExternal: false,\n      isPinnable: tooltipInfo.values.length > 0,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { OutputSelector } from 'reselect';\n\nimport { getPickedCells } from './get_picked_cells';\nimport { isBrushEndProvided } from './is_brush_available';\nimport { ChartType } from '../../..';\nimport { HeatmapBrushEvent, SettingsSpec } from '../../../../specs/settings';\nimport { DragState, GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastDragSelector } from '../../../../state/selectors/get_last_drag';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { DragCheckProps, hasDragged } from '../../../../utils/events';\n\n/**\n * Will call the onBrushEnd listener every time the following preconditions are met:\n * - the onBrushEnd listener is available\n * - we dragged the mouse pointer\n * @internal\n */\nexport function createOnBrushEndCaller(): (state: GlobalChartState) => void {\n  let prevProps: DragCheckProps | null = null;\n  let selector: OutputSelector<\n    GlobalChartState,\n    void,\n    (res1: DragState | null, res3: SettingsSpec, res4: HeatmapBrushEvent | null) => void\n  > | null = null;\n\n  return (state) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      if (!isBrushEndProvided(state)) {\n        selector = null;\n        prevProps = null;\n        return;\n      }\n      selector = createCustomCachedSelector(\n        [getLastDragSelector, getSettingsSpecSelector, getPickedCells],\n        (lastDrag, { onBrushEnd }, pickedCells): void => {\n          const nextProps: DragCheckProps = {\n            lastDrag,\n            onBrushEnd,\n          };\n          if (!onBrushEnd || pickedCells === null) {\n            return;\n          }\n          if (lastDrag !== null && hasDragged(prevProps, nextProps)) {\n            onBrushEnd(pickedCells);\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { SeriesIdentifier } from '../../../../common/series_id';\nimport { SettingsSpec } from '../../../../specs';\nimport { GlobalChartState, PointerState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastClickSelector } from '../../../../state/selectors/get_last_click';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isClicking } from '../../../../state/utils';\nimport { Cell, isPickedCells } from '../../layout/types/viewmodel_types';\n\n/**\n * Will call the onElementClick listener every time the following preconditions are met:\n * - the onElementClick listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnElementClickCaller(): (state: GlobalChartState) => void {\n  let prevClick: PointerState | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      selector = createCustomCachedSelector(\n        [getHeatmapSpecSelector, getLastClickSelector, getSettingsSpecSelector, getPickedShapes],\n        (spec, lastClick: PointerState | null, settings: SettingsSpec, pickedShapes): void => {\n          if (!spec) {\n            return;\n          }\n          if (!settings.onElementClick) {\n            return;\n          }\n          if (!isPickedCells(pickedShapes)) {\n            return;\n          }\n          const nextPickedShapesLength = pickedShapes.length;\n          if (nextPickedShapesLength > 0 && isClicking(prevClick, lastClick)) {\n            const elements = pickedShapes.map<[Cell, SeriesIdentifier]>((value) => [\n              value,\n              {\n                specId: spec.id,\n                key: `spec{${spec.id}}`,\n              },\n            ]);\n            settings.onElementClick(elements);\n          }\n          prevClick = lastClick;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isPickedCells } from '../../layout/types/viewmodel_types';\n\n/**\n * Will call the onElementOut listener every time the following preconditions are met:\n * - the onElementOut listener is available\n * - the highlighted geometries list goes from a list of at least one object to an empty one\n * @internal\n */\nexport function createOnElementOutCaller(): (state: GlobalChartState) => void {\n  let prevPickedShapes: number | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      selector = createCustomCachedSelector(\n        [getHeatmapSpecSelector, getPickedShapes, getSettingsSpecSelector],\n        (spec, pickedShapes, settings): void => {\n          if (!spec) {\n            return;\n          }\n          if (!settings.onElementOut) {\n            return;\n          }\n          const nextPickedShapes = isPickedCells(pickedShapes) ? pickedShapes.length : 0;\n\n          if (prevPickedShapes !== null && prevPickedShapes > 0 && nextPickedShapes === 0) {\n            settings.onElementOut();\n          }\n          prevPickedShapes = nextPickedShapes;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { SeriesIdentifier } from '../../../../common/series_id';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { Cell, isPickedCells } from '../../layout/types/viewmodel_types';\n\nfunction isOverElement(prev: Cell[], next: Cell[]) {\n  if (next.length === 0) {\n    return;\n  }\n  if (next.length !== prev.length) {\n    return true;\n  }\n  return !next.every((nextCell, index) => {\n    const prevCell = prev[index];\n    if (isNil(prevCell)) {\n      return false;\n    }\n    return nextCell.value === prevCell.value && nextCell.x === prevCell.x && nextCell.y === prevCell.y;\n  });\n}\n\n/**\n * Will call the onElementOver listener every time the following preconditions are met:\n * - the onElementOver listener is available\n * - we have a new set of highlighted geometries on our state\n * @internal\n */\nexport function createOnElementOverCaller(): (state: GlobalChartState) => void {\n  let prevPickedShapes: Cell[] = [];\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      selector = createCustomCachedSelector(\n        [getHeatmapSpecSelector, getPickedShapes, getSettingsSpecSelector],\n        (spec, nextPickedShapes, settings): void => {\n          if (!spec) {\n            return;\n          }\n          if (!settings.onElementOver) {\n            return;\n          }\n          if (!isPickedCells(nextPickedShapes)) {\n            return;\n          }\n\n          if (isOverElement(prevPickedShapes, nextPickedShapes)) {\n            const elements = nextPickedShapes.map<[Cell, SeriesIdentifier]>((value) => [\n              value,\n              {\n                specId: spec.id,\n                key: `spec{${spec.id}}`,\n              },\n            ]);\n            settings.onElementOver(elements);\n          }\n          prevPickedShapes = nextPickedShapes;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedGridCell } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport {\n  PointerEvent,\n  PointerEventType,\n  PointerOverEvent,\n  PointerUpdateTrigger,\n  SettingsSpec,\n} from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { getChartIdSelector } from '../../../../state/selectors/get_chart_id';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\nfunction isSameEventValue(a: PointerOverEvent, b: PointerOverEvent, changeTrigger: PointerUpdateTrigger) {\n  const checkX = changeTrigger === PointerUpdateTrigger.X || changeTrigger === PointerUpdateTrigger.Both;\n  const checkY = changeTrigger === PointerUpdateTrigger.Y || changeTrigger === PointerUpdateTrigger.Both;\n  return (\n    (!checkX || (a.x === b.x && a.scale === b.scale && a.unit === b.unit)) &&\n    (!checkY || a.y.every((y, i) => y.value === b.y[i]?.value))\n  );\n}\n\nconst hasPointerEventChanged = (prev: PointerEvent, next: PointerEvent | null, changeTrigger: PointerUpdateTrigger) =>\n  next?.type !== prev.type ||\n  (prev.type === PointerEventType.Over &&\n    next?.type === PointerEventType.Over &&\n    !isSameEventValue(prev, next, changeTrigger));\n\n/**\n * Will call the onPointerUpdate listener every time the following preconditions are met:\n * - the onPointerUpdate listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnPointerUpdateCaller(): (state: GlobalChartState) => void {\n  let prevPointerEvent: PointerEvent | null = null;\n\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Heatmap) {\n      selector = createCustomCachedSelector(\n        [\n          getHeatmapSpecSelector,\n          getSettingsSpecSelector,\n          getActivePointerPosition,\n          getPickedGridCell,\n          getChartIdSelector,\n        ],\n        (spec, settings: SettingsSpec, currentPointer, gridCell, chartId): void => {\n          if (!spec) {\n            return;\n          }\n\n          if (prevPointerEvent === null) {\n            prevPointerEvent = { chartId, type: PointerEventType.Out };\n          }\n          const tempPrev = { ...prevPointerEvent };\n          const nextPointerEvent: PointerEvent = gridCell\n            ? {\n                chartId: state.chartId,\n                type: currentPointer.x === -1 && currentPointer.y === -1 ? PointerEventType.Out : PointerEventType.Over,\n                scale: spec.xScale.type,\n                x: gridCell.x,\n                y: [{ value: gridCell.y, groupId: '' }],\n                smHorizontalValue: null,\n                smVerticalValue: null,\n              }\n            : { chartId, type: PointerEventType.Out };\n          // we have to update the prevPointerEvents before possibly calling the onPointerUpdate\n          // to avoid a recursive loop of calls caused by the impossibility to update the prevPointerEvent\n          prevPointerEvent = nextPointerEvent;\n\n          if (\n            settings.onPointerUpdate &&\n            hasPointerEventChanged(tempPrev, nextPointerEvent, settings.pointerUpdateTrigger)\n          ) {\n            settings.onPointerUpdate(nextPointerEvent);\n          }\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartElementSizesSelector } from './compute_chart_element_sizes';\nimport { getPerPanelHeatmapGeometries } from './get_per_panel_heatmap_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { Cell, GridCell, TextBox } from '../../layout/types/viewmodel_types';\n\n/** @internal */\nexport const getPickedShapes = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getActivePointerPosition],\n  (geoms, pointerPosition): Cell[] | TextBox => {\n    const picker = geoms.pickQuads;\n    const { x, y } = pointerPosition;\n    return picker(x, y);\n  },\n);\n\n/** @internal */\nexport const getPickedGridCell = createCustomCachedSelector(\n  [getPerPanelHeatmapGeometries, getActivePointerPosition, computeChartElementSizesSelector],\n  (geoms, pointerPosition): GridCell | undefined => {\n    return geoms.pickGridCell(pointerPosition.x, pointerPosition.y);\n  },\n);\n\n/** @internal */\nexport const hasPicketVisibleCells = (pickedShapes: Cell[] | TextBox) =>\n  Array.isArray(pickedShapes) && pickedShapes.some(({ visible }) => visible);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getHeatmapSpecSelector } from './get_heatmap_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Colors } from '../../../../common/colors';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\nconst EMPTY_TOOLTIP = Object.freeze({\n  header: null,\n  values: [],\n  disableActions: false,\n});\n\n/** @internal */\nexport const getTooltipInfoSelector = createCustomCachedSelector(\n  [getHeatmapSpecSelector, getPickedShapes],\n  (spec, pickedShapes): TooltipInfo => {\n    if (!spec) {\n      return EMPTY_TOOLTIP;\n    }\n\n    const tooltipInfo: TooltipInfo = {\n      header: null,\n      values: [],\n      disableActions: false,\n    };\n\n    if (Array.isArray(pickedShapes)) {\n      pickedShapes\n        .filter(({ visible }) => visible)\n        .forEach((shape) => {\n          // X-axis value\n          tooltipInfo.values.push({\n            label: spec.xAxisLabelName,\n            color: Colors.Transparent.keyword,\n            isHighlighted: false,\n            isVisible: true,\n            seriesIdentifier: {\n              specId: spec.id,\n              key: spec.id,\n            },\n            value: `${shape.datum.x}`,\n            formattedValue: spec.xAxisLabelFormatter(shape.datum.x),\n            datum: shape.datum,\n          });\n\n          // Y-axis value\n          tooltipInfo.values.push({\n            label: spec.yAxisLabelName,\n            color: Colors.Transparent.keyword,\n            isHighlighted: false,\n            isVisible: true,\n            seriesIdentifier: {\n              specId: spec.id,\n              key: spec.id,\n            },\n            value: `${shape.datum.y}`,\n            formattedValue: spec.yAxisLabelFormatter(shape.datum.y),\n            datum: shape.datum,\n          });\n\n          // Cell value\n          tooltipInfo.values.push({\n            label: spec.name ?? spec.id,\n            color: RGBATupleToString(shape.fill.color),\n            isHighlighted: false,\n            isVisible: true,\n            seriesIdentifier: {\n              specId: spec.id,\n              key: spec.id,\n            },\n            value: `${shape.value}`,\n            formattedValue: `${shape.formatted}`,\n            datum: shape.datum,\n            displayOnly: true,\n          });\n        });\n    } else {\n      tooltipInfo.values.push({\n        label: '',\n        color: Colors.Transparent.keyword,\n        isHighlighted: false,\n        isVisible: true,\n        seriesIdentifier: {\n          specId: spec.id,\n          key: spec.id,\n        },\n        value: `${pickedShapes.value}`,\n        formattedValue: `${pickedShapes.text}`,\n        datum: pickedShapes.value,\n        displayOnly: true,\n      });\n      tooltipInfo.disableActions = true;\n    }\n\n    return tooltipInfo;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { scaleBand } from 'd3-scale';\n\nimport { Radian } from '../../../../common/geometry';\nimport { extent } from '../../../../common/math';\nimport { Vec2, rotate2, sub2 } from '../../../../common/vectors';\nimport { screenspaceMarkerScaleCompressor } from '../../../../solvers/screenspace_marker_scale_compressor';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isFiniteNumber, degToRad } from '../../../../utils/common';\nimport { horizontalPad, innerPad, outerPad, pad, Size } from '../../../../utils/dimensions';\nimport { HeatmapStyle, AxisStyle } from '../../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\nimport { HeatmapSpec } from '../../specs';\nimport { HeatmapTable } from '../selectors/get_heatmap_table';\n\n/** @internal */\nexport function getYAxisHorizontalUsedSpace(\n  yValues: HeatmapTable['yValues'],\n  style: HeatmapStyle['yAxisLabel'],\n  formatter: HeatmapSpec['yAxisLabelFormatter'],\n  textMeasure: TextMeasure,\n): number {\n  if (!style.visible) {\n    return 0;\n  }\n  if (typeof style.width === 'number' && isFiniteNumber(style.width)) {\n    return style.width;\n  }\n  // account for the space required to show the longest Y axis label\n  const longestLabelWidth = yValues.reduce<number>((acc, value) => {\n    const { width } = textMeasure(formatter(value), style, style.fontSize);\n    return Math.max(width + horizontalPad(style.padding), acc);\n  }, 0);\n\n  return style.width === 'auto' ? longestLabelWidth : Math.min(longestLabelWidth, style.width.max);\n}\n\n/** @internal */\nexport function getTextSizeDimension(\n  text: string,\n  style: AxisStyle['axisTitle'],\n  textMeasure: TextMeasure,\n  param: 'height' | 'width',\n  hidden = false,\n): number {\n  if (!style.visible || text === '' || hidden) {\n    return 0;\n  }\n  const textPadding = innerPad(style.padding) + outerPad(style.padding);\n  if (param === 'height') {\n    return style.fontSize + textPadding;\n  }\n\n  const textBox = textMeasure(\n    text,\n    {\n      fontFamily: style.fontFamily,\n      fontVariant: 'normal',\n      fontWeight: 'bold',\n      fontStyle: style.fontStyle ?? 'normal',\n    },\n    style.fontSize,\n  );\n  return textBox.width + textPadding;\n}\n\n/** @internal */\nexport function getXAxisSize(\n  isCategoricalScale: boolean,\n  style: HeatmapStyle['xAxisLabel'],\n  formatter: HeatmapSpec['xAxisLabelFormatter'],\n  labels: (string | number)[],\n  textMeasure: TextMeasure,\n  containerWidth: number,\n  surroundingSpace: [left: number, right: number],\n): Size & { right: number; left: number; tickCadence: number; minRotation: Radian } {\n  if (!style.visible) {\n    return {\n      height: 0,\n      width: Math.max(containerWidth - surroundingSpace[0] - surroundingSpace[1], 0),\n      left: surroundingSpace[0],\n      right: surroundingSpace[1],\n      tickCadence: NaN,\n      minRotation: 0,\n    };\n  }\n  const isRotated = style.rotation !== 0;\n  const normalizedScale = scaleBand<NonNullable<PrimitiveValue>>().domain(labels).range([0, 1]);\n\n  const alignment = isRotated ? 'right' : isCategoricalScale ? 'center' : 'left';\n  const alignmentOffset = isCategoricalScale ? normalizedScale.bandwidth() / 2 : 0;\n  const scale = (d: NonNullable<PrimitiveValue>) => (normalizedScale(d) ?? 0) + alignmentOffset;\n\n  // use positive angle from 0 to 90 only\n  const rotationRad = degToRad(style.rotation);\n\n  const measuredLabels = labels.map((label) => ({\n    ...textMeasure(formatter(label), style, style.fontSize),\n    label,\n  }));\n\n  // don't filter ticks if categorical scale or with rotated labels\n  if (isCategoricalScale || isRotated) {\n    const maxLabelBBox = measuredLabels.reduce(\n      (acc, curr) => {\n        return {\n          height: Math.max(acc.height, curr.height),\n          width: Math.max(acc.width, curr.width),\n        };\n      },\n      { height: 0, width: 0 },\n    );\n    const compressedScale = computeCompressedScale(\n      style,\n      scale,\n      measuredLabels,\n      containerWidth,\n      surroundingSpace,\n      alignment,\n      rotationRad,\n    );\n    const scaleStep = compressedScale.width / labels.length;\n    // this optimal rotation is computed on a suboptimal compressed scale, it can be further enhanced with a monotonic hill climber\n    const optimalRotation =\n      scaleStep > maxLabelBBox.width ? 0 : Math.asin(Math.min(maxLabelBBox.height / scaleStep, 1));\n    // if the current requested rotation is not at least bigger then the optimal one, recalculate the compression\n    // using the optimal one forcing the rotation to be without overlaps\n    const { width, height, left, right, minRotation } = {\n      ...(rotationRad !== 0 && optimalRotation > rotationRad\n        ? computeCompressedScale(\n            style,\n            scale,\n            measuredLabels,\n            containerWidth,\n            surroundingSpace,\n            alignment,\n            optimalRotation,\n          )\n        : compressedScale),\n      minRotation: isRotated ? Math.max(optimalRotation, rotationRad) : 0,\n    };\n\n    const validCompression = isFiniteNumber(width);\n    return {\n      height: validCompression ? height : 0,\n      width: validCompression ? width : Math.max(containerWidth - surroundingSpace[0] - surroundingSpace[1], 0),\n      left: validCompression ? left : surroundingSpace[0],\n      right: validCompression ? right : surroundingSpace[1],\n      tickCadence: validCompression ? 1 : NaN,\n      minRotation,\n    };\n  }\n\n  // TODO refactor and move to monotonic hill climber and no mutations\n  // reduce the tick cadence on time scale to avoid overlaps and overflows\n  let tickCadence = 1;\n  let dimension = computeCompressedScale(\n    style,\n    scale,\n    measuredLabels,\n    containerWidth,\n    surroundingSpace,\n    alignment,\n    rotationRad,\n  );\n\n  for (let i = 1; i < measuredLabels.length; i++) {\n    if ((!dimension.overlaps && !dimension.overflow.right) || !isFiniteNumber(dimension.width)) {\n      break;\n    }\n    dimension = computeCompressedScale(\n      style,\n      scale,\n      measuredLabels.filter((_, index) => index % (i + 1) === 0),\n      containerWidth,\n      surroundingSpace,\n      alignment,\n      rotationRad,\n    );\n    tickCadence++;\n  }\n\n  // hide the axis because there is no space for labels\n  if (!isFiniteNumber(dimension.width)) {\n    return {\n      // hide the whole axis\n      height: 0,\n      width: Math.max(containerWidth - surroundingSpace[0] - surroundingSpace[1], 0),\n      left: surroundingSpace[0],\n      right: surroundingSpace[1],\n      // hide all ticks\n      tickCadence: NaN,\n      minRotation: rotationRad,\n    };\n  }\n\n  return {\n    ...dimension,\n    tickCadence,\n    minRotation: rotationRad,\n  };\n}\n\nfunction computeCompressedScale(\n  style: HeatmapStyle['xAxisLabel'],\n  scale: (d: NonNullable<PrimitiveValue>) => number,\n  labels: Array<Size & { label: number | NonNullable<PrimitiveValue> }>,\n  containerWidth: number,\n  surroundingSpace: [number, number],\n  alignment: 'left' | 'right' | 'center',\n  rotation: Radian,\n): Size & { left: number; right: number; overlaps: boolean; overflow: { left: boolean; right: boolean } } {\n  const { itemsPerSideSize, domainPositions, hMax } = labels.reduce<{\n    wMax: number;\n    hMax: number;\n    itemsPerSideSize: [number, number][];\n    domainPositions: number[];\n  }>(\n    (acc, { width, height, label }) => {\n      // rotate the label box coordinates\n      const labelRect: Vec2[] = [\n        [0, 0],\n        [width, 0],\n        [width, height],\n        [0, height],\n      ];\n\n      const rotationOrigin: Vec2 =\n        alignment === 'right' ? [width, height / 2] : alignment === 'left' ? [0, height / 2] : [width / 2, height / 2];\n\n      const rotatedVectors = labelRect.map((vector) => rotate2(rotation, sub2(vector, rotationOrigin)));\n\n      // find the rotated bounding box\n      const x = extent(rotatedVectors.map((v) => v[0]));\n      const y = extent(rotatedVectors.map((v) => v[1]));\n      acc.wMax = Math.max(acc.wMax, Math.abs(x[1] - x[0]));\n      acc.hMax = Math.max(acc.hMax, Math.abs(y[1] - y[0]));\n\n      // describe the item width as the left and right vector size from the rotation origin\n      acc.itemsPerSideSize.push([Math.abs(x[0]), Math.abs(x[1])]);\n\n      // use a categorical scale with labels aligned to the center to compute the domain position\n      const domainPosition = scale(label);\n      acc.domainPositions.push(domainPosition);\n      return acc;\n    },\n    { wMax: -Infinity, hMax: -Infinity, itemsPerSideSize: [], domainPositions: [] },\n  );\n\n  // account for the left and right space (Y axes, overflows etc)\n  const globalDomainPositions = [0, ...domainPositions, 1];\n  const globalItemWidth: [number, number][] = [[surroundingSpace[0], 0], ...itemsPerSideSize, [0, surroundingSpace[1]]];\n\n  const { scaleMultiplier, bounds } = screenspaceMarkerScaleCompressor(\n    globalDomainPositions,\n    globalItemWidth,\n    containerWidth,\n  );\n\n  // check label overlaps using the computed compressed scale\n  const overlaps = itemsPerSideSize.some(([, rightSide], i) => {\n    if (i >= itemsPerSideSize.length - 2) {\n      return false;\n    }\n\n    const currentItemRightSide = (domainPositions[i] ?? 0) * scaleMultiplier + rightSide + pad(style.padding, 'right');\n    const nextItemLeftSize =\n      (domainPositions[i + 1] ?? 0) * scaleMultiplier -\n      (itemsPerSideSize[i + 1]?.[0] ?? 0) -\n      pad(style.padding, 'left');\n    return currentItemRightSide > nextItemLeftSize;\n  });\n\n  const leftMargin = isFiniteNumber(bounds[0])\n    ? (globalItemWidth[bounds[0]]?.[0] ?? 0) - scaleMultiplier * (globalDomainPositions[bounds[0]] ?? 0)\n    : 0;\n  const rightMargin = isFiniteNumber(bounds[1]) ? globalItemWidth[bounds[1]]?.[1] ?? 0 : 0;\n\n  return {\n    // the horizontal space\n    width: scaleMultiplier,\n    right: rightMargin,\n    left: leftMargin,\n    // the height represent the height of the max rotated bbox plus the padding and the vertical position of the rotation origin\n    height: hMax + pad(style.padding, 'top') + style.fontSize / 2,\n    overlaps,\n    overflow: {\n      // true if a label exist protrude to the left making the scale shrink from the left\n      // the current check is based on the way we construct globalItemWidth and globalDomainPositions\n      left: bounds[0] !== 0,\n      // true if a label exist protrude to the right making the scale shrink from the right\n      // the current check is based on the way we construct globalItemWidth and globalDomainPositions\n      right: bounds[1] !== globalDomainPositions.length - 1,\n    },\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/**\n * Available chart types\n * @public\n */\nexport const ChartType = Object.freeze({\n  Global: 'global' as const,\n  Goal: 'goal' as const,\n  Partition: 'partition' as const,\n  Flame: 'flame' as const,\n  Timeslip: 'timeslip' as const,\n  XYAxis: 'xy_axis' as const,\n  Heatmap: 'heatmap' as const,\n  Wordcloud: 'wordcloud' as const,\n  Metric: 'metric' as const,\n  Bullet: 'bullet' as const,\n});\n/** @public */\nexport type ChartType = $Values<typeof ChartType>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* eslint-disable-next-line eslint-comments/disable-enable-pair */\n/* eslint-disable react/no-array-index-key */\n\nimport classNames from 'classnames';\nimport React from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { Metric as MetricComponent } from './metric';\nimport { ColorContrastOptions, combineColors, highContrastColor } from '../../../../common/color_calcs';\nimport { colorToRgba, RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Color } from '../../../../common/colors';\nimport { BasicListener, ElementClickListener, ElementOverListener, settingsBuildProps } from '../../../../specs';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getResolvedBackgroundColorSelector } from '../../../../state/selectors/get_resolved_background_color';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { MetricStyle } from '../../../../utils/themes/theme';\nimport { MetricSpec } from '../../specs';\nimport { chartSize } from '../../state/selectors/chart_size';\nimport { getMetricSpecs } from '../../state/selectors/data';\nimport { hasChartTitles } from '../../state/selectors/has_chart_titles';\n\ninterface StateProps {\n  initialized: boolean;\n  chartId: string;\n  hasTitles: boolean;\n  size: {\n    width: number;\n    height: number;\n  };\n  specs: MetricSpec[];\n  a11y: A11ySettings;\n  style: MetricStyle;\n  backgroundColor: Color;\n  locale: string;\n  onElementClick?: ElementClickListener;\n  onElementOut?: BasicListener;\n  onElementOver?: ElementOverListener;\n}\n\ninterface DispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\nclass Component extends React.Component<StateProps & DispatchProps> {\n  static displayName = 'Metric';\n  componentDidMount() {\n    this.props.onChartRendered();\n  }\n\n  componentDidUpdate() {\n    this.props.onChartRendered();\n  }\n\n  render() {\n    const {\n      chartId,\n      hasTitles,\n      initialized,\n      size: { width, height },\n      a11y,\n      specs: [spec], // ignoring other specs\n      style,\n      backgroundColor,\n      onElementClick,\n      onElementOut,\n      onElementOver,\n      locale,\n    } = this.props;\n    if (!initialized || !spec || width === 0 || height === 0) {\n      return null;\n    }\n\n    const { data } = spec;\n\n    const totalRows = data.length;\n    const maxColumns = data.reduce((acc, row) => {\n      return Math.max(acc, row.length);\n    }, 0);\n\n    const panel = { width: width / maxColumns, height: height / totalRows };\n    const contrastOptions: ColorContrastOptions = {\n      lightColor: colorToRgba(style.text.lightColor),\n      darkColor: colorToRgba(style.text.darkColor),\n    };\n\n    const emptyBackgroundRGBA = combineColors(colorToRgba(style.emptyBackground), colorToRgba(backgroundColor));\n    const emptyBackground = RGBATupleToString(emptyBackgroundRGBA);\n    const { color: emptyForegroundColor } = highContrastColor(emptyBackgroundRGBA, undefined, contrastOptions);\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-redundant-roles\n      <ul\n        role=\"list\"\n        className=\"echMetricContainer\"\n        aria-labelledby={a11y.labelId}\n        aria-describedby={a11y.descriptionId}\n        style={{\n          gridTemplateColumns: `repeat(${maxColumns}, minmax(0, 1fr)`,\n          gridTemplateRows: `repeat(${totalRows}, minmax(${style.minHeight}px, 1fr)`,\n        }}\n      >\n        {data.flatMap((columns, rowIndex) => {\n          return [\n            ...columns.map((datum, columnIndex) => {\n              // fill undefined with empty panels\n              const emptyMetricClassName = classNames('echMetric', {\n                'echMetric--rightBorder': columnIndex < maxColumns - 1,\n                'echMetric--bottomBorder': rowIndex < totalRows - 1,\n                'echMetric--topBorder': hasTitles && rowIndex === 0,\n              });\n              return !datum ? (\n                <li key={`${columnIndex}-${rowIndex}`} role=\"presentation\">\n                  <div\n                    className={emptyMetricClassName}\n                    style={{ borderColor: style.border, backgroundColor: emptyBackground }}\n                  >\n                    <div className=\"echMetricEmpty\" style={{ borderColor: emptyForegroundColor.keyword }}></div>\n                  </div>\n                </li>\n              ) : (\n                <li key={`${columnIndex}-${rowIndex}`}>\n                  <MetricComponent\n                    chartId={chartId}\n                    hasTitles={hasTitles}\n                    datum={datum}\n                    totalRows={totalRows}\n                    totalColumns={maxColumns}\n                    rowIndex={rowIndex}\n                    columnIndex={columnIndex}\n                    panel={panel}\n                    style={style}\n                    backgroundColor={backgroundColor}\n                    contrastOptions={contrastOptions}\n                    onElementClick={onElementClick}\n                    onElementOut={onElementOut}\n                    onElementOver={onElementOver}\n                    locale={locale}\n                  />\n                </li>\n              );\n            }),\n            // fill the grid row with empty panels\n            ...Array.from({ length: maxColumns - columns.length }, (_, zeroBasedColumnIndex) => {\n              const columnIndex = zeroBasedColumnIndex + columns.length;\n              const emptyMetricClassName = classNames('echMetric', {\n                'echMetric--bottomBorder': rowIndex < totalRows - 1,\n                'echMetric--topBorder': hasTitles && rowIndex === 0,\n              });\n              return (\n                <li key={`missing-${columnIndex}-${rowIndex}`} role=\"presentation\">\n                  <div\n                    className={emptyMetricClassName}\n                    style={{ borderColor: style.border, backgroundColor: emptyBackground }}\n                  ></div>\n                </li>\n              );\n            }),\n          ];\n        })}\n      </ul>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: StateProps = {\n  initialized: false,\n  chartId: '',\n  hasTitles: false,\n  specs: [],\n  size: {\n    width: 0,\n    height: 0,\n  },\n  a11y: DEFAULT_A11Y_SETTINGS,\n  style: LIGHT_THEME.metric,\n  backgroundColor: LIGHT_THEME.background.color,\n  locale: settingsBuildProps.defaults.locale,\n};\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  const { onElementClick, onElementOut, onElementOver, locale } = getSettingsSpecSelector(state);\n  const { metric: style } = getChartThemeSelector(state);\n  return {\n    initialized: true,\n    chartId: state.chartId,\n    hasTitles: hasChartTitles(state),\n    specs: getMetricSpecs(state),\n    size: chartSize(state),\n    a11y: getA11ySettingsSelector(state),\n    onElementClick,\n    onElementOver,\n    onElementOut,\n    backgroundColor: getResolvedBackgroundColorSelector(state),\n    style,\n    locale,\n  };\n};\n\n/** @internal */\nexport const Metric = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { CSSProperties, useState } from 'react';\n\nimport { ProgressBar } from './progress';\nimport { SparkLine, getSparkLineColor } from './sparkline';\nimport { MetricText } from './text';\nimport { ColorContrastOptions, combineColors } from '../../../../common/color_calcs';\nimport { RGBATupleToString, changeColorLightness, colorToRgba } from '../../../../common/color_library_wrappers';\nimport { Color } from '../../../../common/colors';\nimport { DEFAULT_CSS_CURSOR } from '../../../../common/constants';\nimport { fillTextColor } from '../../../../common/fill_text_color';\nimport {\n  BasicListener,\n  ElementClickListener,\n  ElementOverListener,\n  MetricDatum,\n  MetricElementEvent,\n} from '../../../../specs';\nimport { LayoutDirection, isNil } from '../../../../utils/common';\nimport { Size } from '../../../../utils/dimensions';\nimport { MetricStyle } from '../../../../utils/themes/theme';\nimport { MetricWNumber, isMetricWProgress, isMetricWTrend } from '../../specs';\n\n/** @internal */\nexport const Metric: React.FunctionComponent<{\n  chartId: string;\n  hasTitles: boolean;\n  rowIndex: number;\n  columnIndex: number;\n  totalColumns: number;\n  totalRows: number;\n  datum: MetricDatum;\n  panel: Size;\n  style: MetricStyle;\n  backgroundColor: Color;\n  contrastOptions: ColorContrastOptions;\n  locale: string;\n  onElementClick?: ElementClickListener;\n  onElementOver?: ElementOverListener;\n  onElementOut?: BasicListener;\n}> = ({\n  chartId,\n  hasTitles,\n  rowIndex,\n  columnIndex,\n  totalColumns,\n  totalRows,\n  datum,\n  panel,\n  style,\n  backgroundColor: chartBackgroundColor,\n  contrastOptions,\n  locale,\n  onElementClick,\n  onElementOver,\n  onElementOut,\n}) => {\n  const progressBarSize = 'small'; // currently we provide only the small progress bar;\n  const [mouseState, setMouseState] = useState<'leave' | 'enter' | 'down'>('leave');\n  const [lastMouseDownTimestamp, setLastMouseDownTimestamp] = useState<number>(0);\n  const metricHTMLId = `echMetric-${chartId}-${rowIndex}-${columnIndex}`;\n  const hasProgressBar = isMetricWProgress(datum);\n  const progressBarDirection = hasProgressBar ? datum.progressBarDirection : undefined;\n\n  const containerClassName = classNames('echMetric', {\n    'echMetric--rightBorder': columnIndex < totalColumns - 1,\n    'echMetric--bottomBorder': rowIndex < totalRows - 1,\n    'echMetric--topBorder': hasTitles && rowIndex === 0,\n    'echMetric--vertical': progressBarDirection === LayoutDirection.Vertical,\n    'echMetric--horizontal': progressBarDirection === LayoutDirection.Horizontal,\n    [`echMetric--withProgressBar--${progressBarSize}`]: hasProgressBar,\n    [`echMetric--withTargetProgressBar--${progressBarSize}`]: !isNil((datum as MetricWNumber)?.target),\n  });\n\n  const lightnessAmount = mouseState === 'leave' ? 0 : mouseState === 'enter' ? 0.05 : 0.1;\n\n  const backgroundColor = datum.background\n    ? RGBATupleToString(combineColors(colorToRgba(datum.background), colorToRgba(chartBackgroundColor)))\n    : chartBackgroundColor;\n  const blendingBackgroundColor = !style.blendingBackground\n    ? colorToRgba(backgroundColor)\n    : combineColors(colorToRgba(style.blendingBackground), colorToRgba(backgroundColor));\n  const interactionColor = changeColorLightness(hasProgressBar ? backgroundColor : datum.color, lightnessAmount, 0.8);\n  const blendedColor = RGBATupleToString(combineColors(colorToRgba(datum.color), blendingBackgroundColor));\n  const blendedInteractionColor = RGBATupleToString(\n    combineColors(colorToRgba(interactionColor), blendingBackgroundColor),\n  );\n\n  const datumWithInteractionColor: MetricDatum = {\n    ...datum,\n    color: blendedInteractionColor,\n  };\n\n  const event: MetricElementEvent = { type: 'metricElementEvent', rowIndex, columnIndex };\n\n  const containerStyle: CSSProperties = {\n    backgroundColor: isMetricWTrend(datumWithInteractionColor) ? backgroundColor : datumWithInteractionColor.color,\n    cursor: onElementClick ? 'pointer' : DEFAULT_CSS_CURSOR,\n    borderColor: style.border,\n  };\n\n  const highContrastTextColor = fillTextColor(\n    backgroundColor,\n    isMetricWProgress(datum) ? backgroundColor : blendedColor,\n    undefined,\n    contrastOptions,\n  );\n  let finalTextColor = highContrastTextColor.color;\n\n  if (isMetricWTrend(datum)) {\n    const { ratio, color, shade } = fillTextColor(\n      backgroundColor,\n      getSparkLineColor(blendedColor),\n      undefined,\n      contrastOptions,\n    );\n\n    // TODO verify this check is applied correctly\n    if (shade !== highContrastTextColor.shade && ratio > highContrastTextColor.ratio) {\n      finalTextColor = color;\n    }\n  }\n\n  const onElementClickHandler = () => onElementClick && onElementClick([event]);\n\n  return (\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions,jsx-a11y/click-events-have-key-events\n    <div\n      role=\"figure\"\n      aria-labelledby={datum.title && metricHTMLId}\n      className={containerClassName}\n      style={containerStyle}\n      onMouseLeave={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('leave');\n        if (onElementOut) onElementOut();\n      }}\n      onMouseEnter={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('enter');\n        if (onElementOver) onElementOver([event]);\n      }}\n      onMouseDown={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('down');\n        setLastMouseDownTimestamp(Date.now());\n      }}\n      onMouseUp={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('enter');\n        if (Date.now() - lastMouseDownTimestamp < 200 && onElementClick) {\n          onElementClickHandler();\n        }\n      }}\n      onFocus={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('enter');\n      }}\n      onBlur={() => {\n        if (onElementOut || onElementOver || onElementClick) setMouseState('leave');\n      }}\n      onClick={(e) => {\n        e.stopPropagation();\n      }}\n    >\n      <MetricText\n        id={metricHTMLId}\n        datum={datumWithInteractionColor}\n        panel={panel}\n        style={style}\n        onElementClick={onElementClick ? onElementClickHandler : undefined}\n        progressBarSize={progressBarSize}\n        highContrastTextColor={finalTextColor.keyword}\n        locale={locale}\n      />\n      {isMetricWTrend(datumWithInteractionColor) && <SparkLine id={metricHTMLId} datum={datumWithInteractionColor} />}\n      {isMetricWProgress(datumWithInteractionColor) && (\n        <ProgressBar\n          datum={datumWithInteractionColor}\n          barBackground={style.barBackground}\n          blendedBarColor={blendedColor}\n          size={progressBarSize}\n        />\n      )}\n      <div className=\"echMetric--outline\" style={{ color: finalTextColor.keyword }}></div>\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport { scaleLinear } from 'd3-scale';\nimport React from 'react';\n\nimport { Color } from '../../../../common/colors';\nimport { Icon } from '../../../../components/icons/icon';\nimport { isNil, LayoutDirection, sortNumbers } from '../../../../utils/common';\nimport { ContinuousDomain, GenericDomain } from '../../../../utils/domain';\nimport { BulletMetricWProgress, isBulletMetric, MetricWProgress } from '../../specs';\n\nconst TARGET_SIZE = 8;\nconst BASELINE_SIZE = 2;\n\ninterface ProgressBarProps {\n  datum: MetricWProgress | BulletMetricWProgress;\n  barBackground: Color;\n  blendedBarColor: Color;\n  size: 'small';\n}\n\n/** @internal */\nexport const ProgressBar: React.FunctionComponent<ProgressBarProps> = ({\n  datum,\n  barBackground,\n  blendedBarColor,\n  size,\n}) => {\n  const { title, value, target, valueFormatter, targetFormatter, progressBarDirection } = datum;\n  const isBullet = isBulletMetric(datum);\n  const isVertical = progressBarDirection === LayoutDirection.Vertical;\n  const domain: GenericDomain = isBulletMetric(datum) ? datum.domain : [0, datum.domainMax];\n  // TODO clamp and round values\n  const scale = scaleLinear().domain(domain).range([0, 100]);\n\n  if (isBulletMetric(datum) && datum.niceDomain) {\n    scale.nice();\n  }\n\n  const updatedDomain = scale.domain() as GenericDomain;\n  const [domainMin, domainMax] = sortNumbers(updatedDomain) as ContinuousDomain;\n  const scaledValue = scale(value);\n  const [min, max] = sortNumbers([scale(0), scaledValue]);\n  const positionStyle = isVertical\n    ? {\n        bottom: `${min}%`,\n        top: `${100 - max}%`,\n      }\n    : {\n        left: `${min}%`,\n        right: `${100 - max}%`,\n      };\n\n  const targetPlacement = isNil(target) ? null : `calc(${scale(target)}% - ${TARGET_SIZE / 2}px)`;\n  const zeroPlacement = domainMin >= 0 || domainMax <= 0 ? null : `calc(${scale(0)}% - ${BASELINE_SIZE / 2}px)`;\n  const labelType = isBullet ? 'Value' : 'Percentage';\n\n  return (\n    <div\n      className={getDirectionalClasses('Progress', isVertical, size)}\n      style={{ backgroundColor: size === 'small' ? barBackground : undefined }}\n      title={!isBullet ? '' : `${updatedDomain[0]} to ${updatedDomain[1]}`}\n    >\n      {targetPlacement && (\n        <div\n          className={getDirectionalClasses('Target', isVertical, size)}\n          style={{\n            [isVertical ? 'bottom' : 'left']: targetPlacement,\n          }}\n          aria-valuenow={target}\n          title={`${isBullet ? `${datum.valueLabels.target}: ` : ''}${(targetFormatter ?? valueFormatter)(\n            target || 0,\n          )}`}\n        >\n          <Icon height={TARGET_SIZE} width={TARGET_SIZE} type=\"downArrow\" color={blendedBarColor} />\n        </div>\n      )}\n      {zeroPlacement && (\n        <div\n          className={getDirectionalClasses('ZeroBaseline', isVertical, size)}\n          style={{\n            backgroundColor: blendedBarColor,\n            [isVertical ? 'bottom' : 'left']: zeroPlacement,\n          }}\n        />\n      )}\n      <div\n        className={getDirectionalClasses('ProgressBar', isVertical, size)}\n        style={{ ...positionStyle, backgroundColor: blendedBarColor }}\n        role=\"meter\"\n        title={isBullet ? `${datum.valueLabels.value}: ${valueFormatter(value)}` : `${scaledValue}%`}\n        aria-label={title ? `${labelType} of ${title}` : labelType}\n        aria-valuemin={isBullet ? domainMin : 0}\n        aria-valuemax={isBullet ? domainMax : 100}\n        aria-valuenow={isBullet ? value : scaledValue}\n      />\n    </div>\n  );\n};\n\nfunction getDirectionalClasses(element: string, isVertical: boolean, size: ProgressBarProps['size']) {\n  const base = `echSingleMetric${element}`;\n  return classNames(base, `${base}--${size}`, {\n    [`${base}--vertical`]: isVertical,\n    [`${base}--horizontal`]: !isVertical,\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { FunctionComponent } from 'react';\n\nimport { colorToHsl, hslToColor } from '../../../../common/color_library_wrappers';\nimport { extent } from '../../../../common/math';\nimport { areaGenerator } from '../../../../geoms/path';\nimport { isFiniteNumber } from '../../../../utils/common';\nimport { CurveType } from '../../../../utils/curves';\nimport { MetricTrendShape, MetricWTrend } from '../../specs';\n\n/** @internal */\nexport const getSparkLineColor = (color: MetricWTrend['color']) => {\n  const [h, s, l, a] = colorToHsl(color);\n  return hslToColor(h, s, l >= 0.8 ? l - 0.1 : l + 0.1, a);\n};\n\n/** @internal */\nexport const SparkLine: FunctionComponent<{\n  id: string;\n  datum: MetricWTrend;\n}> = ({ id, datum: { color, trend, trendA11yTitle, trendA11yDescription, trendShape } }) => {\n  if (!trend) {\n    return null;\n  }\n  const [xMin, xMax] = extent(trend.map((d) => d.x));\n  const [, yMax] = extent(trend.map((d) => d.y));\n  const xScale = (value: number) => (value - xMin) / (xMax - xMin);\n  const yScale = (value: number) => value / yMax;\n\n  const path = areaGenerator<{ x: number; y: number }>(\n    (d) => xScale(d.x),\n    () => 1,\n    (d) => 1 - yScale(d.y),\n    (d) => isFiniteNumber(d.x) && isFiniteNumber(d.y),\n    trendShape === MetricTrendShape.Bars ? CurveType.CURVE_STEP_AFTER : CurveType.LINEAR,\n  );\n\n  const titleId = `${id}-trend-title`;\n  const descriptionId = `${id}-trend-description`;\n  return (\n    <div className=\"echSingleMetricSparkline\">\n      <svg\n        className=\"echSingleMetricSparkline__svg\"\n        width=\"100%\"\n        height=\"100%\"\n        viewBox=\"0 0 1 1\"\n        preserveAspectRatio=\"none\"\n        role=\"img\"\n        aria-labelledby={`${titleId} ${descriptionId}`}\n      >\n        <title id={titleId} className=\"echScreenReaderOnly\">\n          {trendA11yTitle}\n        </title>\n        <text id={descriptionId} className=\"echScreenReaderOnly\" fontSize={0}>\n          {trendA11yDescription}\n        </text>\n\n        <rect x={0} y={0} width={1} height={1} fill={color} />\n\n        <path\n          d={path.area(trend)}\n          transform=\"translate(0, 0.5),scale(1,0.5)\"\n          fill={getSparkLineColor(color)}\n          stroke=\"none\"\n          strokeWidth={0}\n        />\n      </svg>\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { CSSProperties } from 'react';\n\nimport { Color } from '../../../../common/colors';\nimport { DEFAULT_FONT_FAMILY } from '../../../../common/default_theme_attributes';\nimport { Font } from '../../../../common/text_utils';\nimport { TextMeasure, withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isFiniteNumber, LayoutDirection, renderWithProps } from '../../../../utils/common';\nimport { Size } from '../../../../utils/dimensions';\nimport { wrapText } from '../../../../utils/text/wrap';\nimport { MetricStyle } from '../../../../utils/themes/theme';\nimport { isMetricWNumber, isMetricWProgress, MetricDatum } from '../../specs';\n\ntype BreakPoint = 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';\n\nconst WIDTH_BP: [number, number, BreakPoint][] = [\n  [0, 180, 's'],\n  [180, 250, 'm'],\n  [250, 600, 'l'],\n  [600, 1000, 'xl'],\n  [1000, 2000, 'xxl'],\n  [2000, Infinity, 'xxxl'],\n];\n\nconst PADDING = 8;\nconst LINE_HEIGHT = 1.2; // aligned with our CSS\nconst ICON_SIZE: Record<BreakPoint, number> = { s: 16, m: 16, l: 24, xl: 36, xxl: 44, xxxl: 64 };\nconst TITLE_FONT_SIZE: Record<BreakPoint, number> = { s: 12, m: 16, l: 16, xl: 24, xxl: 32, xxxl: 42 };\nconst SUBTITLE_FONT_SIZE: Record<BreakPoint, number> = { s: 10, m: 14, l: 14, xl: 20, xxl: 26, xxxl: 26 };\nconst EXTRA_FONT_SIZE: Record<BreakPoint, number> = { s: 10, m: 14, l: 14, xl: 20, xxl: 26, xxxl: 26 };\nconst VALUE_FONT_SIZE: Record<BreakPoint, number> = { s: 22, m: 27, l: 34, xl: 56, xxl: 88, xxxl: 140 };\nconst VALUE_PART_FONT_SIZE: Record<BreakPoint, number> = { s: 16, m: 20, l: 24, xl: 40, xxl: 68, xxxl: 110 };\n\nconst TITLE_FONT: Font = {\n  fontStyle: 'normal',\n  fontFamily: DEFAULT_FONT_FAMILY,\n  fontVariant: 'normal',\n  fontWeight: 'bold',\n  textColor: 'black',\n};\nconst SUBTITLE_FONT: Font = {\n  ...TITLE_FONT,\n  fontWeight: 'normal',\n};\n\nfunction findRange(ranges: [number, number, BreakPoint][], value: number): BreakPoint {\n  const range = ranges.find(([min, max]) => min <= value && value < max);\n  return range ? range[2] : ranges[0]?.[2] ?? 's';\n}\n\ntype ElementVisibility = {\n  titleMaxLines: number;\n  subtitleMaxLines: number;\n  title: boolean;\n  subtitle: boolean;\n  extra: boolean;\n};\n\nfunction elementVisibility(\n  datum: MetricDatum,\n  panel: Size,\n  size: BreakPoint,\n  locale: string,\n): ElementVisibility & { titleLines: string[]; subtitleLines: string[] } {\n  const LEFT_RIGHT_PADDING = 16;\n  const maxTitlesWidth = (size === 's' ? 1 : 0.8) * panel.width - (datum.icon ? 24 : 0) - LEFT_RIGHT_PADDING;\n\n  const titleHeight = (maxLines: number, textMeasure: TextMeasure) => {\n    return datum.title\n      ? PADDING +\n          wrapText(datum.title, TITLE_FONT, TITLE_FONT_SIZE[size], maxTitlesWidth, maxLines, textMeasure, locale)\n            .length *\n            TITLE_FONT_SIZE[size] *\n            LINE_HEIGHT\n      : 0;\n  };\n\n  const subtitleHeight = (maxLines: number, textMeasure: TextMeasure) => {\n    return datum.subtitle\n      ? PADDING +\n          wrapText(\n            datum.subtitle,\n            SUBTITLE_FONT,\n            SUBTITLE_FONT_SIZE[size],\n            maxTitlesWidth,\n            maxLines,\n            textMeasure,\n            locale,\n          ).length *\n            SUBTITLE_FONT_SIZE[size] *\n            LINE_HEIGHT\n      : 0;\n  };\n\n  const extraHeight = EXTRA_FONT_SIZE[size] * LINE_HEIGHT;\n  const valueHeight = VALUE_FONT_SIZE[size] * LINE_HEIGHT + PADDING;\n\n  const responsiveBreakPoints: Array<ElementVisibility> = [\n    { titleMaxLines: 3, subtitleMaxLines: 2, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },\n    { titleMaxLines: 3, subtitleMaxLines: 1, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },\n    { titleMaxLines: 2, subtitleMaxLines: 1, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },\n    { titleMaxLines: 1, subtitleMaxLines: 1, title: !!datum.title, subtitle: !!datum.subtitle, extra: !!datum.extra },\n    { titleMaxLines: 1, subtitleMaxLines: 0, title: !!datum.title, subtitle: false, extra: !!datum.extra },\n    { titleMaxLines: 1, subtitleMaxLines: 0, title: !!datum.title, subtitle: false, extra: false },\n    { titleMaxLines: 1, subtitleMaxLines: 0, title: !!datum.title, subtitle: false, extra: false },\n  ];\n\n  const isVisible = (\n    { titleMaxLines, subtitleMaxLines, title, subtitle, extra }: ElementVisibility,\n    measure: TextMeasure,\n  ) =>\n    (title && titleMaxLines > 0 ? titleHeight(titleMaxLines, measure) : 0) +\n      (subtitle && subtitleMaxLines > 0 ? subtitleHeight(subtitleMaxLines, measure) : 0) +\n      (extra ? extraHeight : 0) +\n      valueHeight <\n    panel.height;\n\n  return withTextMeasure((textMeasure) => {\n    const visibilityBreakpoint =\n      responsiveBreakPoints.find((breakpoint) => isVisible(breakpoint, textMeasure)) ?? responsiveBreakPoints.at(-1)!;\n    return {\n      ...visibilityBreakpoint,\n      titleLines: wrapText(\n        datum.title ?? '',\n        TITLE_FONT,\n        TITLE_FONT_SIZE[size],\n        maxTitlesWidth,\n        visibilityBreakpoint.titleMaxLines,\n        textMeasure,\n        locale,\n      ),\n      subtitleLines: wrapText(\n        datum.subtitle ?? '',\n        SUBTITLE_FONT,\n        SUBTITLE_FONT_SIZE[size],\n        maxTitlesWidth,\n        visibilityBreakpoint.subtitleMaxLines,\n        textMeasure,\n        locale,\n      ),\n    };\n  });\n}\n\nfunction lineClamp(maxLines: number): CSSProperties {\n  return {\n    textOverflow: 'ellipsis',\n    display: '-webkit-box',\n    WebkitLineClamp: maxLines, // due to an issue with react CSSProperties filtering out this line, see https://github.com/facebook/react/issues/23033\n    lineClamp: maxLines,\n    WebkitBoxOrient: 'vertical',\n    overflow: 'hidden',\n  };\n}\n\n/** @internal */\nexport const MetricText: React.FunctionComponent<{\n  id: string;\n  datum: MetricDatum;\n  panel: Size;\n  style: MetricStyle;\n  onElementClick?: () => void;\n  highContrastTextColor: Color;\n  progressBarSize: 'small';\n  locale: string;\n}> = ({ id, datum, panel, style, onElementClick, highContrastTextColor, progressBarSize, locale }) => {\n  const { extra, value, body } = datum;\n\n  const size = findRange(WIDTH_BP, panel.width);\n  const hasProgressBar = isMetricWProgress(datum);\n  const progressBarDirection = isMetricWProgress(datum) ? datum.progressBarDirection : undefined;\n  const containerClassName = classNames('echMetricText', {\n    [`echMetricText--${progressBarSize}`]: hasProgressBar,\n    'echMetricText--vertical': progressBarDirection === LayoutDirection.Vertical,\n    'echMetricText--horizontal': progressBarDirection === LayoutDirection.Horizontal,\n  });\n\n  const visibility = elementVisibility(datum, panel, size, locale);\n\n  const titleWidthMaxSize = size === 's' ? '100%' : '80%';\n  const titlesWidth = `min(${titleWidthMaxSize}, calc(${titleWidthMaxSize} - ${datum.icon ? '24px' : '0px'}))`;\n\n  const isNumericalMetric = isMetricWNumber(datum);\n  const textParts = isNumericalMetric\n    ? isFiniteNumber(value)\n      ? splitNumericSuffixPrefix(datum.valueFormatter(value))\n      : [{ emphasis: 'normal', text: style.nonFiniteText }]\n    : [{ emphasis: 'normal', text: datum.value }];\n  const TitleElement = () => (\n    <span\n      style={{\n        fontSize: `${TITLE_FONT_SIZE[size]}px`,\n        whiteSpace: 'pre-wrap',\n        width: titlesWidth,\n        ...lineClamp(visibility.titleLines.length),\n      }}\n      title={datum.title}\n    >\n      {datum.title}\n    </span>\n  );\n  return (\n    <div className={containerClassName} style={{ color: highContrastTextColor }}>\n      <div>\n        {visibility.title && (\n          <h2 id={id} className=\"echMetricText__title\">\n            {onElementClick ? (\n              <button\n                onMouseDown={(e) => e.stopPropagation()}\n                onMouseUp={(e) => e.stopPropagation()}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  onElementClick();\n                }}\n              >\n                <TitleElement />\n              </button>\n            ) : (\n              <TitleElement />\n            )}\n          </h2>\n        )}\n        {datum.icon && (\n          <div className=\"echMetricText__icon\">\n            {renderWithProps(datum.icon, {\n              width: ICON_SIZE[size],\n              height: ICON_SIZE[size],\n              color: highContrastTextColor,\n            })}\n          </div>\n        )}\n      </div>\n      <div>\n        {visibility.subtitle && (\n          <p\n            className=\"echMetricText__subtitle\"\n            style={{\n              fontSize: `${SUBTITLE_FONT_SIZE[size]}px`,\n              width: titlesWidth,\n              whiteSpace: 'pre-wrap',\n              ...lineClamp(visibility.subtitleLines.length),\n            }}\n            title={datum.subtitle}\n          >\n            {datum.subtitle}\n          </p>\n        )}\n      </div>\n      <div className=\"echMetricText__gap\">{body && <div className=\"echMetricText__body\">{body}</div>}</div>\n      <div>\n        {visibility.extra && (\n          <p className=\"echMetricText__extra\" style={{ fontSize: `${EXTRA_FONT_SIZE[size]}px` }}>\n            {extra}\n          </p>\n        )}\n      </div>\n      <div>\n        <p\n          className=\"echMetricText__value\"\n          style={{\n            fontSize: `${VALUE_FONT_SIZE[size]}px`,\n            textOverflow: isNumericalMetric ? undefined : 'ellipsis',\n            marginRight: datum.valueIcon ? ICON_SIZE[size] + 8 : undefined,\n            color: datum.valueColor,\n          }}\n          title={textParts.map(({ text }) => text).join('')}\n        >\n          {textParts.map(({ emphasis, text }, i) => {\n            return emphasis === 'small' ? (\n              <span\n                key={`${text}${i}`}\n                className=\"echMetricText__part\"\n                style={{ fontSize: `${VALUE_PART_FONT_SIZE[size]}px` }}\n              >\n                {text}\n              </span>\n            ) : (\n              text\n            );\n          })}\n        </p>\n        {datum.valueIcon && (\n          <p\n            className=\"echMetricText__valueIcon\"\n            style={{ fontSize: `${VALUE_FONT_SIZE[size]}px`, color: datum.valueColor ?? highContrastTextColor }}\n          >\n            {renderWithProps(datum.valueIcon, {\n              width: VALUE_PART_FONT_SIZE[size],\n              height: VALUE_PART_FONT_SIZE[size],\n              color: datum.valueColor ?? highContrastTextColor,\n              verticalAlign: 'middle',\n            })}\n          </p>\n        )}\n      </div>\n    </div>\n  );\n};\n\nfunction splitNumericSuffixPrefix(text: string): { emphasis: 'normal' | 'small'; text: string }[] {\n  return text\n    .split('')\n    .reduce<{ emphasis: 'normal' | 'small'; textParts: string[] }[]>((acc, curr) => {\n      const emphasis = curr === '.' || curr === ',' || isFiniteNumber(Number.parseInt(curr)) ? 'normal' : 'small';\n      if (acc.length > 0 && acc.at(-1)?.emphasis === emphasis) {\n        acc.at(-1)?.textParts.push(curr);\n      } else {\n        acc.push({ emphasis, textParts: [curr] });\n      }\n      return acc;\n    }, [])\n    .map(({ emphasis, textParts }) => ({\n      emphasis,\n      text: textParts.join(''),\n    }));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps, ComponentType, ReactElement, ReactNode } from 'react';\nimport { $Values } from 'utility-types';\n\nimport { ChartType } from '../..';\nimport { Color } from '../../../common/colors';\nimport { Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { specComponentFactory } from '../../../state/spec_factory';\nimport { LayoutDirection, ValueFormatter } from '../../../utils/common';\nimport { GenericDomain } from '../../../utils/domain';\nimport { BulletValueLabels } from '../../bullet_graph/spec';\n\n/** @alpha */\nexport type MetricBase = {\n  color: Color;\n  /**\n   * Overrides background color from `Theme.background` and `Theme.metric.emptyBackground`\n   */\n  background?: Color;\n  title?: string;\n  valueColor?: Color;\n  valueIcon?: ComponentType<{ width: number; height: number; color: Color; verticalAlign: 'middle' }>;\n  subtitle?: string;\n  extra?: ReactElement;\n  icon?: ComponentType<{ width: number; height: number; color: Color }>;\n  body?: ReactNode;\n};\n\n/** @alpha */\nexport type MetricWText = MetricBase & {\n  value: string;\n};\n\n/** @alpha */\nexport type MetricWNumber = MetricBase & {\n  value: number;\n  target?: number;\n  valueFormatter: ValueFormatter;\n  /**\n   * Used for header display only, defaults to `valueFormatter`\n   */\n  targetFormatter?: ValueFormatter;\n};\n\n/** @alpha */\nexport type MetricWProgress = MetricWNumber & {\n  domainMax: number;\n  progressBarDirection: LayoutDirection;\n};\n\n/**\n * Type used internally by bullet\n * TODO - discuss usage of this externally\n *\n * @internal\n */\nexport type BulletMetricWProgress = Omit<MetricWProgress, 'domainMax'> & {\n  domain: GenericDomain;\n  niceDomain?: boolean;\n  valueLabels: Omit<BulletValueLabels, 'active'>;\n};\n\n/** @alpha */\nexport const MetricTrendShape = Object.freeze({\n  Bars: 'bars' as const,\n  Area: 'area' as const,\n});\n\n/** @alpha */\nexport type MetricTrendShape = $Values<typeof MetricTrendShape>;\n\n/** @alpha */\nexport type MetricWTrend = (MetricWNumber | MetricWText) & {\n  trend: { x: number; y: number }[];\n  trendShape: MetricTrendShape;\n  trendA11yTitle?: string;\n  trendA11yDescription?: string;\n};\n\n/** @alpha */\nexport type MetricDatum = MetricWNumber | MetricWText | MetricWProgress | MetricWTrend;\n\n/** @alpha */\nexport interface MetricSpec extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Metric;\n  data: (MetricDatum | undefined)[][];\n}\n\n/** @alpha */\nexport const Metric = specComponentFactory<MetricSpec>()(\n  {\n    chartType: ChartType.Metric,\n    specType: SpecType.Series,\n  },\n  {\n    data: [],\n  },\n);\n\n/** @alpha */\nexport type MetricSpecProps = ComponentProps<typeof Metric>;\n\n/** @internal */\nexport function isBulletMetric(datum: MetricDatum): datum is BulletMetricWProgress {\n  return Array.isArray((datum as BulletMetricWProgress).domain);\n}\n\n/** @internal */\nexport function isMetricWNumber(datum: MetricDatum): datum is MetricWNumber {\n  return typeof datum.value === 'number' && datum.hasOwnProperty('valueFormatter');\n}\n/** @internal */\nexport function isMetricWText(datum: MetricDatum): datum is MetricWNumber {\n  return typeof datum.value === 'string';\n}\n\n/** @internal */\nexport function isMetricWProgress(datum: MetricDatum): datum is MetricWProgress {\n  return (\n    (isMetricWNumber(datum) && datum.hasOwnProperty('domainMax') && !datum.hasOwnProperty('trend')) ||\n    isBulletMetric(datum)\n  );\n}\n\n/** @internal */\nexport function isMetricWTrend(datum: MetricDatum): datum is MetricWTrend {\n  return (\n    (isMetricWNumber(datum) || isMetricWText(datum)) &&\n    datum.hasOwnProperty('trend') &&\n    !datum.hasOwnProperty('domainMax')\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { canDisplayChartTitles } from './selectors/can_display_chart_titles';\nimport { ChartType } from '../..';\nimport { DEFAULT_CSS_CURSOR } from '../../../common/constants';\nimport { LegendItem } from '../../../common/legend';\nimport { GlobalChartState, InternalChartState } from '../../../state/chart_state';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { LegendItemLabel } from '../../../state/selectors/get_legend_items_labels';\nimport { Metric } from '../renderer/dom';\n\nconst EMPTY_MAP = new Map();\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\nconst EMPTY_LEGEND_ITEM_LIST: LegendItemLabel[] = [];\n\n/** @internal */\nexport class MetricState implements InternalChartState {\n  chartType = ChartType.Metric;\n  getChartTypeDescription = () => 'Metric chart';\n  chartRenderer = () => <Metric />;\n  isInitialized = () => InitStatus.Initialized;\n  isBrushAvailable = () => false;\n  isBrushing = () => false;\n  isChartEmpty = () => false;\n  getLegendItems = () => EMPTY_LEGEND_LIST;\n  getLegendItemsLabels = () => EMPTY_LEGEND_ITEM_LIST;\n  getLegendExtraValues = () => EMPTY_MAP;\n  getPointerCursor = () => DEFAULT_CSS_CURSOR;\n  isTooltipVisible = () => ({\n    visible: false,\n    isExternal: false,\n    displayOnly: false,\n    isPinnable: false,\n  });\n\n  getTooltipInfo = () => undefined;\n  getTooltipAnchor = () => null;\n  eventCallbacks = () => {};\n  getProjectionContainerArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getMainProjectionArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getBrushArea = () => null;\n  getDebugState = () => ({});\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles(globalState: GlobalChartState) {\n    return canDisplayChartTitles(globalState);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getMetricSpecs } from './data';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const canDisplayChartTitles = createCustomCachedSelector([getMetricSpecs], ([spec]): boolean => {\n  return (spec?.data?.length ?? 0) > 1 || (spec?.data?.[0]?.length ?? 0) > 1;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { Dimensions } from '../../../../utils/dimensions';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const chartSize = createCustomCachedSelector([getParentDimension], (container): Dimensions => {\n  return { ...container };\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs';\nimport { getSpecsByType } from '../../../../state/selectors/get_specs_by_type';\nimport { MetricSpec } from '../../specs';\n\n/** @internal */\nexport const getMetricSpecs = getSpecsByType<MetricSpec>(ChartType.Metric, SpecType.Series);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from './../../../../state/chart_state';\nimport { canDisplayChartTitles } from './can_display_chart_titles';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\nconst getChartTitleOrDescription = ({ title, description }: GlobalChartState) => Boolean(title || description);\n\n/** @internal */\nexport const hasChartTitles = createCustomCachedSelector(\n  [canDisplayChartTitles, getChartTitleOrDescription],\n  (displayTitles, hasTitles): boolean => {\n    return displayTitles && hasTitles;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PartitionLayout } from './types/config_types';\nimport { ShapeTreeNode } from './types/viewmodel_types';\nimport { AGGREGATE_KEY, STATISTICS_KEY } from './utils/group_by_rollup';\nimport { Colors } from '../../../common/colors';\nimport { ConfigItem, Numeric } from '../../../common/config_objects';\nimport { GOLDEN_RATIO, TAU } from '../../../common/constants';\nimport { FONT_STYLES, FONT_VARIANTS } from '../../../common/text_utils';\nimport { ColorVariant } from '../../../utils/common';\n\nfunction significantDigitCount(d: number): number {\n  let n = Math.abs(parseFloat(String(d).replace('.', '')));\n  if (n === 0) {\n    return 0;\n  }\n  while (n !== 0 && n % 10 === 0) {\n    n /= 10;\n  }\n  return Math.floor(Math.log10(n)) + 1;\n}\n\n/** @internal */\nexport function sumValueGetter(node: ShapeTreeNode): number {\n  return node[AGGREGATE_KEY];\n}\n\n/*\n * It's an unfortunate accident that 'parent' is used both\n *   - for linking an ArrayNode to a QuadViewModel, and\n *   - for recursively linking the parent ArrayNode to an ArrayNode (child) in the tree\n *\n * By extracting out the 'MODEL_KEY', we make the distinction clear, while the API, which depends on this, doesn't\n * change. This makes an eventual API change a single-line change, assuming `[MODEL_KEY]` is used where needed, and just there\n *\n *  Todo:\n *   - replace users' use of `s.parent` with `s[MODEL_KEY]` for the ShapeTreeNode -> ArrayNode access\n *   - change MODEL_KEY to something other than 'parent' when it's done (might still be breaking change)\n */\n/** @public */\nexport const MODEL_KEY = 'parent';\n\n/** @public */\nexport function percentValueGetter(node: {\n  [AGGREGATE_KEY]: number;\n  [MODEL_KEY]: {\n    [STATISTICS_KEY]: {\n      globalAggregate: number;\n    };\n  };\n}): number {\n  return (100 * node[AGGREGATE_KEY]) / node[MODEL_KEY][STATISTICS_KEY].globalAggregate;\n}\n\n/** @public */\nexport function ratioValueGetter(node: ShapeTreeNode): number {\n  return node[AGGREGATE_KEY] / node[MODEL_KEY][STATISTICS_KEY].globalAggregate;\n}\n\n/** @public */\nexport const VALUE_GETTERS = Object.freeze({ percent: percentValueGetter, ratio: ratioValueGetter } as const);\n\n/** @public */\nexport type ValueGetterName = keyof typeof VALUE_GETTERS;\n\n/** @public */\nexport function defaultPartitionValueFormatter(d: number): string {\n  return Math.abs(d) >= 10000000 || Math.abs(d) < 0.001\n    ? d.toExponential(Math.min(2, Math.max(0, significantDigitCount(d) - 1)))\n    : d.toLocaleString(undefined, {\n        maximumSignificantDigits: 4,\n        maximumFractionDigits: 3,\n        useGrouping: true,\n      });\n}\n\n/** @internal */\nexport function percentFormatter(d: number): string {\n  return `${Math.round(d)}%`;\n}\n\nconst fontSettings = {\n  fontFamily: {\n    dflt: 'Sans-Serif',\n    type: 'string',\n  },\n  fontSize: { dflt: 12, min: 4, max: 32, type: 'number' },\n  fontStyle: {\n    dflt: 'normal',\n    type: 'string',\n    values: FONT_STYLES,\n  },\n  fontVariant: {\n    dflt: 'normal',\n    type: 'string',\n    values: FONT_VARIANTS,\n  },\n  fontWeight: { dflt: 400, min: 100, max: 900, type: 'number' },\n};\n\nconst valueFont = {\n  type: 'group',\n  values: {\n    /*\n     * Object.assign interprets the extant `undefined` as legit, so commenting it out till moving away from Object.assign in `const valueFont = ...`\n     * fontFamily: {\n     *   dflt: undefined,\n     *   type: 'string',\n     * },\n     */\n    fontWeight: fontSettings.fontWeight,\n    fontStyle: fontSettings.fontStyle,\n    fontVariant: fontSettings.fontVariant,\n  },\n};\n\n/**\n * Keeping for future config validation checks\n * @internal\n */\nexport const configMetadata: Record<string, ConfigItem> = {\n  // shape geometry\n  width: { dflt: 300, min: 0, max: 1024, type: 'number', reconfigurable: false },\n  height: { dflt: 150, min: 0, max: 1024, type: 'number', reconfigurable: false },\n  margin: {\n    type: 'group',\n    values: {\n      left: { dflt: 0, min: -0.25, max: 0.25, type: 'number' },\n      right: { dflt: 0, min: -0.25, max: 0.25, type: 'number' },\n      top: { dflt: 0, min: -0.25, max: 0.25, type: 'number' },\n      bottom: { dflt: 0, min: -0.25, max: 0.25, type: 'number' },\n    },\n  },\n  outerSizeRatio: new Numeric({\n    dflt: 1 / GOLDEN_RATIO,\n    min: 0.25,\n    max: 1,\n    reconfigurable: true,\n    documentation:\n      'The diameter of the entire circle, relative to the smaller of the usable rectangular size (smaller of width/height minus the margins)',\n  }), // todo switch to `io-ts` style, generic way of combining static and runtime type info\n  emptySizeRatio: new Numeric({\n    dflt: 0,\n    min: 0,\n    max: 0.8,\n    reconfigurable: true,\n    documentation: 'The diameter of the inner circle, relative to `outerSizeRatio`',\n  }), // todo switch to `io-ts` style, generic way of combining static and runtime type info\n  clockwiseSectors: {\n    dflt: true,\n    type: 'boolean',\n    documentation: 'Largest to smallest sectors are positioned in a clockwise order',\n  },\n  specialFirstInnermostSector: {\n    dflt: true,\n    type: 'boolean',\n    documentation: 'Starts placement with the second largest slice, for the innermost pie/ring',\n  },\n\n  // general text config\n  fontFamily: {\n    dflt: 'Sans-Serif',\n    type: 'string',\n  },\n\n  // fill text config\n  minFontSize: { dflt: 8, min: 0.1, max: 8, type: 'number', reconfigurable: true },\n  maxFontSize: { dflt: 64, min: 0.1, max: 64, type: 'number' },\n  idealFontSizeJump: {\n    dflt: 1.05, // Math.pow(goldenRatio, 1 / 3),\n    min: 1.05,\n    max: GOLDEN_RATIO,\n    type: 'number',\n    reconfigurable: false, // there's no real reason to reconfigure it; finding the largest possible font is good for readability\n  },\n  maximizeFontSize: {\n    dflt: false,\n    type: 'boolean',\n  },\n  partitionLayout: {\n    dflt: PartitionLayout.sunburst,\n    type: 'string',\n    values: Object.keys(PartitionLayout),\n  },\n  drilldown: {\n    dflt: false,\n    type: 'boolean',\n  },\n\n  // fill text layout config\n  circlePadding: { dflt: 2, min: 0.0, max: 8, type: 'number' },\n  radialPadding: { dflt: TAU / 360, min: 0, max: 0.035, type: 'number' },\n  horizontalTextAngleThreshold: { dflt: TAU / 12, min: 0, max: TAU, type: 'number' },\n  horizontalTextEnforcer: { dflt: 1, min: 0, max: 1, type: 'number' },\n  maxRowCount: { dflt: 12, min: 1, max: 16, type: 'number' },\n  fillOutside: { dflt: false, type: 'boolean' },\n  radiusOutside: { dflt: 128, min: 0, max: 1024, type: 'number' },\n  fillRectangleWidth: { dflt: Infinity, reconfigurable: false, type: 'number' },\n  fillRectangleHeight: { dflt: Infinity, reconfigurable: false, type: 'number' },\n  fillLabel: {\n    type: 'group',\n    values: {\n      textColor: { type: 'color', dflt: ColorVariant.Adaptive },\n      ...fontSettings,\n      valueGetter: {\n        dflt: sumValueGetter,\n        type: 'function',\n      },\n      valueFormatter: {\n        dflt: defaultPartitionValueFormatter,\n        type: 'function',\n      },\n      valueFont,\n      padding: {\n        type: 'group',\n        values: {\n          top: {\n            dflt: 2,\n            min: 0,\n            max: 20,\n            type: 'number',\n            reconfigurable: true,\n            documentation: 'Top padding for fill text',\n          },\n          bottom: {\n            dflt: 2,\n            min: 0,\n            max: 20,\n            type: 'number',\n            reconfigurable: true,\n            documentation: 'Bottom padding for fill text',\n          },\n          left: {\n            dflt: 2,\n            min: 0,\n            max: 20,\n            type: 'number',\n            reconfigurable: true,\n            documentation: 'Left padding for fill text',\n          },\n          right: {\n            dflt: 2,\n            min: 0,\n            max: 20,\n            type: 'number',\n            reconfigurable: true,\n            documentation: 'Right padding for fill text',\n          },\n        },\n      },\n      clipText: {\n        type: 'boolean',\n        dflt: false,\n        documentation: \"Renders, but clips, text that's longer than what would fit in a box entirely\",\n      },\n    },\n  },\n\n  // linked labels (primarily: single-line)\n  linkLabel: {\n    type: 'group',\n    values: {\n      maximumSection: {\n        dflt: 10,\n        min: 0,\n        max: 10000,\n        type: 'number',\n        reconfigurable: true,\n        documentation: 'Uses linked labels below this limit of the outer sector arc length (in pixels)',\n      },\n      ...fontSettings,\n      gap: { dflt: 10, min: 6, max: 16, type: 'number' },\n      spacing: { dflt: 2, min: 0, max: 16, type: 'number' },\n      horizontalStemLength: { dflt: 10, min: 6, max: 16, type: 'number' },\n      radiusPadding: { dflt: 10, min: 6, max: 16, type: 'number' },\n      lineWidth: { dflt: 1, min: 0.1, max: 2, type: 'number' },\n      maxCount: {\n        dflt: 36,\n        min: 2,\n        max: 64,\n        type: 'number',\n        documentation: 'Limits the total count of linked labels. The first N largest slices are kept.',\n      },\n      maxTextLength: {\n        dflt: 100,\n        min: 2,\n        max: 200,\n        documentation: 'Limits the total number of characters in linked labels.',\n      },\n      textColor: { dflt: ColorVariant.Adaptive, type: 'color' },\n      minimumStemLength: {\n        dflt: 0,\n        min: 0,\n        max: 16,\n        type: 'number',\n        reconfigurable: false, // currently only 0 is reliable\n      },\n      stemAngle: {\n        dflt: TAU / 8,\n        min: 0,\n        max: TAU,\n        type: 'number',\n        reconfigurable: false, // currently only tau / 8 is reliable\n      },\n      valueFont,\n    },\n  },\n\n  backgroundColor: { dflt: Colors.White.keyword, type: 'color' },\n  sectorLineWidth: { dflt: 1, min: 0, max: 4, type: 'number' },\n  sectorLineStroke: { dflt: Colors.White.keyword, type: 'string' },\n  animation: { type: 'group', values: { duration: { dflt: 0, min: 0, max: 3000, type: 'number' } } },\n};\n\n/**\n * Part-to-whole visualizations such as treemap, sunburst, pie hinge on an aggregation\n * function such that the value is independent of the order of how the constituents are aggregated\n * https://en.wikipedia.org/wiki/Associative_property\n * Hierarchical, space-filling part-to-whole visualizations also need that the\n * the value of a node is equal to the sum of the values of its children\n * https://mboehm7.github.io/teaching/ss19_dbs/04_RelationalAlgebra.pdf p21\n * It's now `count` and `sum` but subject to change\n *\n * potential internal, or removable\n * @internal\n */\nexport type AdditiveAggregation = 'count' | 'sum';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { Ratio } from '../../../../common/geometry';\n\n/** @public */\nexport const PartitionLayout = Object.freeze({\n  sunburst: 'sunburst' as const,\n  treemap: 'treemap' as const,\n  icicle: 'icicle' as const,\n  flame: 'flame' as const,\n  mosaic: 'mosaic' as const,\n  waffle: 'waffle' as const,\n});\n\n/** @public */\nexport type PartitionLayout = $Values<typeof PartitionLayout>; // could use ValuesType<typeof HierarchicalChartTypes>\n\n/** @alpha */\nexport type EasingFunction = (x: Ratio) => Ratio;\n\n/** @alpha */\nexport interface AnimKeyframe {\n  time: number;\n  easingFunction: EasingFunction;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PartitionLayout } from './config_types';\nimport { LegacyAnimationConfig } from '../../../../common/animation';\nimport { CategoryKey } from '../../../../common/category';\nimport { Color, Colors } from '../../../../common/colors';\nimport {\n  Coordinate,\n  Distance,\n  Pixels,\n  PointObject,\n  PointTuple,\n  PointTuples,\n  Radian,\n  SizeRatio,\n} from '../../../../common/geometry';\nimport { Font, HorizontalAlignment, VerticalAlignments } from '../../../../common/text_utils';\nimport { GroupByAccessor } from '../../../../specs';\nimport { LegendPath } from '../../../../state/actions/legend';\nimport { Size } from '../../../../utils/dimensions';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { ContinuousDomainFocus } from '../../renderer/canvas/partition';\nimport { Layer } from '../../specs';\nimport { MODEL_KEY, ValueGetterName } from '../config';\nimport { ArrayNode, HierarchyOfArrays, Key } from '../utils/group_by_rollup';\nimport { LinkLabelsViewModelSpec } from '../viewmodel/link_text_layout';\n\n/** @internal */\nexport type LinkLabelVM = {\n  isRTL: boolean;\n  linkLabels: PointTuples;\n  translate: PointTuple;\n  textAlign: CanvasTextAlign;\n  text: string;\n  valueText: string;\n  width: Distance;\n  valueWidth: Distance;\n};\n\n/** @internal */\nexport interface RowBox extends Font {\n  text: string;\n  width: Distance;\n  wordBeginning: Distance;\n  isValue?: boolean;\n}\n\ninterface RowAnchor {\n  rowAnchorX: Coordinate;\n  rowAnchorY: Coordinate;\n}\n\n/** @internal */\nexport interface RowSpace extends RowAnchor {\n  maximumRowLength: Distance;\n}\n\n/** @internal */\nexport interface TextRow extends RowAnchor {\n  length: number;\n  maximumLength: number;\n  rowWords: Array<RowBox>;\n}\n\n/** @internal */\nexport interface RowSet {\n  id: string;\n  rows: Array<TextRow>;\n  fillTextColor?: string;\n  fontSize: number;\n  rotation: Radian;\n  verticalAlignment: VerticalAlignments;\n  horizontalAlignment: HorizontalAlignment;\n  isRTL: boolean;\n  container?: any;\n  clipText?: boolean;\n}\n\n/** @internal */\nexport interface SmallMultiplesDescriptors {\n  smAccessorValue: ReturnType<GroupByAccessor>;\n  index: number;\n  innerIndex: number;\n}\n\n/** @internal */\nexport interface QuadViewModel extends ShapeTreeNode, SmallMultiplesDescriptors {\n  strokeWidth: number;\n  strokeStyle: string;\n  fillColor: string;\n  textColor: string;\n}\n\n/** @internal */\nexport interface OutsideLinksViewModel {\n  points: Array<PointTuple>;\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels, focus: ContinuousDomainFocus) => Array<QuadViewModel>;\n\n/** @internal */\nexport interface PartitionSmallMultiplesModel extends SmallMultiplesDescriptors {\n  smAccessorValue: number | string;\n  layout: PartitionLayout;\n  top: SizeRatio;\n  left: SizeRatio;\n  width: SizeRatio;\n  height: SizeRatio;\n  innerRowCount: number;\n  innerColumnCount: number;\n  innerRowIndex: number;\n  innerColumnIndex: number;\n  marginLeftPx: Pixels;\n  marginTopPx: Pixels;\n  panel: {\n    title: string;\n    innerWidth: Pixels;\n    innerHeight: Pixels;\n    fontFace: Font;\n    fontSize: number;\n  };\n}\n\n/** @internal */\nexport interface ShapeViewModel extends PartitionSmallMultiplesModel, LegacyAnimationConfig {\n  style: Theme['partition'];\n  chartDimensions: Size;\n  layers: Layer[];\n  quadViewModel: QuadViewModel[];\n  rowSets: RowSet[];\n  linkLabelViewModels: LinkLabelsViewModelSpec;\n  outsideLinksViewModel: OutsideLinksViewModel[];\n  diskCenter: PointObject;\n  pickQuads: PickFunction;\n  outerRadius: number;\n}\n\nconst defaultFont: Font = {\n  fontStyle: 'normal',\n  fontVariant: 'normal',\n  fontFamily: '',\n  fontWeight: 'normal',\n  textColor: Colors.Black.keyword,\n};\n\n/** @internal */\nexport const nullPartitionSmallMultiplesModel = (\n  layout: PartitionLayout = PartitionLayout.sunburst,\n): PartitionSmallMultiplesModel => ({\n  index: 0,\n  innerIndex: 0,\n  smAccessorValue: '',\n  top: 0,\n  left: 0,\n  width: 0,\n  height: 0,\n  innerRowCount: 0,\n  innerColumnCount: 0,\n  innerRowIndex: 0,\n  innerColumnIndex: 0,\n  marginLeftPx: 0,\n  marginTopPx: 0,\n  layout,\n  panel: {\n    title: '',\n    innerWidth: 0,\n    innerHeight: 0,\n    fontSize: 10,\n    fontFace: {\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      fontFamily: 'sans-serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n    },\n  },\n});\n\n/** @internal */\nexport const nullShapeViewModel = (\n  layout: PartitionLayout = PartitionLayout.sunburst,\n  style: Theme['partition'] = LIGHT_THEME.partition,\n  diskCenter?: PointObject,\n): ShapeViewModel => ({\n  ...nullPartitionSmallMultiplesModel(layout),\n  style,\n  layers: [],\n  quadViewModel: [],\n  rowSets: [],\n  linkLabelViewModels: {\n    linkLabels: [],\n    labelFontSpec: defaultFont,\n    valueFontSpec: defaultFont,\n    strokeColor: '',\n  },\n  outsideLinksViewModel: [],\n  diskCenter: diskCenter || { x: 0, y: 0 },\n  pickQuads: () => [],\n  outerRadius: 0,\n  chartDimensions: {\n    width: 0,\n    height: 0,\n  },\n  animation: { duration: 0 },\n});\n\n/** @internal */\nexport const hasMostlyRTLLabels = (geoms: ShapeViewModel[]): boolean =>\n  geoms.reduce(\n    (surplus: number, { rowSets }) =>\n      surplus + rowSets.reduce((excess: number, { isRTL }) => excess + (isRTL ? 1 : -1), 0),\n    0,\n  ) > 0;\n\n/** @public */\nexport type TreeLevel = number;\n\n/** @public */\nexport interface AngleFromTo {\n  x0: Radian;\n  x1: Radian;\n}\n\n/** @internal */\nexport interface LayerFromTo {\n  y0: TreeLevel;\n  y1: TreeLevel;\n}\n\n/**\n * @public\n */\nexport interface TreeNode extends AngleFromTo {\n  x0: Radian;\n  x1: Radian;\n  y0: TreeLevel;\n  y1: TreeLevel;\n  fill?: Color;\n}\n\n/**\n * @public\n */\nexport interface SectorGeomSpecY {\n  y0px: Distance;\n  y1px: Distance;\n}\n\n/** @public */\nexport type DataName = CategoryKey; // todo consider narrowing it to eg. primitives\n\n/** @public */\nexport interface ShapeTreeNode extends TreeNode, SectorGeomSpecY {\n  yMidPx: Distance;\n  depth: number;\n  sortIndex: number;\n  path: LegendPath;\n  dataName: DataName;\n  value: number;\n  [MODEL_KEY]: ArrayNode;\n}\n\n/** @public */\nexport type RawTextGetter = (node: ShapeTreeNode) => string;\n/** @public */\nexport type ValueGetterFunction = (node: ShapeTreeNode) => number;\n/** @public */\nexport type ValueGetter = ValueGetterFunction | ValueGetterName;\n/** @public */\nexport type NodeColorAccessor = (key: Key, sortIndex: number, node: ArrayNode, tree: HierarchyOfArrays) => string;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TAU } from '../../../../common/constants';\nimport {\n  Circline,\n  CirclineArc,\n  CirclinePredicate,\n  Coordinate,\n  Distance,\n  PointObject,\n  Radian,\n  Radius,\n  RingSectorConstruction,\n  trueBearingToStandardPositionAngle,\n} from '../../../../common/geometry';\nimport { PartitionStyle } from '../../../../utils/themes/partition';\nimport { PartitionSpec } from '../../specs';\nimport { AngleFromTo, LayerFromTo, ShapeTreeNode } from '../types/viewmodel_types';\n\nfunction euclideanDistance({ x: x1, y: y1 }: PointObject, { x: x2, y: y2 }: PointObject): Distance {\n  return Math.sqrt(Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2));\n}\n\nfunction fullyContained(c1: Circline, c2: Circline): boolean {\n  return euclideanDistance(c1, c2) + c2.r <= c1.r;\n}\n\nfunction noOverlap(c1: Circline, c2: Circline): boolean {\n  return euclideanDistance(c1, c2) >= c1.r + c2.r;\n}\n\nfunction circlineIntersect(c1: Circline, c2: Circline): PointObject[] {\n  const d = Math.sqrt((c1.x - c2.x) * (c1.x - c2.x) + (c1.y - c2.y) * (c1.y - c2.y));\n  if (c1.r + c2.r >= d && d >= Math.abs(c1.r - c2.r)) {\n    const a1 = d + c1.r + c2.r;\n    const a2 = d + c1.r - c2.r;\n    const a3 = d - c1.r + c2.r;\n    const a4 = -d + c1.r + c2.r;\n    const area = Math.sqrt(a1 * a2 * a3 * a4) / 4;\n\n    const xAux1 = (c1.x + c2.x) / 2 + ((c2.x - c1.x) * (c1.r * c1.r - c2.r * c2.r)) / (2 * d * d);\n    const xAux2 = (2 * (c1.y - c2.y) * area) / (d * d);\n    const x1 = xAux1 + xAux2;\n    const x2 = xAux1 - xAux2;\n\n    const yAux1 = (c1.y + c2.y) / 2 + ((c2.y - c1.y) * (c1.r * c1.r - c2.r * c2.r)) / (2 * d * d);\n    const yAux2 = (2 * (c1.x - c2.x) * area) / (d * d);\n    const y1 = yAux1 - yAux2;\n    const y2 = yAux1 + yAux2;\n\n    return [\n      { x: x1, y: y1 },\n      { x: x2, y: y2 },\n    ];\n  }\n  return [];\n}\n\nfunction circlineValidSectors(refC: CirclinePredicate, c: CirclineArc): CirclineArc[] {\n  const { inside } = refC;\n  const { x, y, r, from, to } = c;\n  const fullContainment = fullyContained(refC, c);\n  const fullyOutside = noOverlap(refC, c) || fullyContained(c, refC);\n\n  // handle clear cases\n\n  // nothing kept:\n  if ((inside && fullContainment) || (!inside && fullyOutside)) {\n    return [];\n  }\n\n  // the entire sector is kept\n  if ((inside && fullyOutside) || (!inside && fullContainment)) {\n    return [c];\n  }\n\n  // now we know there's intersection and we're supposed to get back two distinct points\n  const circlineIntersections = circlineIntersect(refC, c);\n  // These conditions don't happen; kept for documentation purposes:\n  // if (circlineIntersections.length !== 2) throw new Error('Problem in intersection calculation.')\n  // if (from > to) throw new Error('From/to problem in intersection calculation.')\n  const [p1, p2] = circlineIntersections;\n  if (!p1 || !p2) return [];\n  const aPre1 = Math.atan2(p1.y - c.y, p1.x - c.x);\n  const aPre2 = Math.atan2(p2.y - c.y, p2.x - c.x);\n  const a1p = Math.max(from, Math.min(to, aPre1 < 0 ? aPre1 + TAU : aPre1));\n  const a2p = Math.max(from, Math.min(to, aPre2 < 0 ? aPre2 + TAU : aPre2));\n  const a1 = Math.min(a1p, a2p);\n  const a2 = a1p === a2p ? TAU : Math.max(a1p, a2p); // make a2 drop out in next step\n\n  // imperative, slightly optimized buildup of `breakpoints` as it's in the hot loop:\n  const breakpoints = [from];\n  if (from < a1 && a1 < to) breakpoints.push(a1);\n  if (from < a2 && a2 < to) breakpoints.push(a2);\n  breakpoints.push(to);\n\n  const predicate = inside ? noOverlap : fullyContained;\n\n  // imperative, slightly optimized buildup of `result` as it's in the hot loop:\n  const result = [];\n  for (let i = 0; i < breakpoints.length - 1; i++) {\n    const from = breakpoints[i] ?? 0;\n    const to = breakpoints[i + 1] ?? 0;\n    const midAngle = (from + to) / 2; // no winding clip ie. `meanAngle()` would be wrong here\n    const xx = x + r * Math.cos(midAngle);\n    const yy = y + r * Math.sin(midAngle);\n    if (predicate(refC, { x: xx, y: yy, r: 0 })) result.push({ x, y, r, from, to });\n  }\n  return result;\n}\n\n/** @internal */\nexport function conjunctiveConstraint(constraints: RingSectorConstruction, c: CirclineArc): CirclineArc[] {\n  // imperative, slightly optimized buildup of `valids` as it's in the hot loop:\n  let valids = [c];\n  for (let i = 0; i < constraints.length; i++) {\n    const refC = constraints[i]; // reference circle\n    const nextValids: CirclineArc[] = [];\n    if (!refC) break;\n    for (let j = 0; j < valids.length; j++) {\n      const cc = valids[j];\n      if (!cc) continue;\n      const currentValids = circlineValidSectors(refC, cc);\n      nextValids.push(...currentValids);\n    }\n    valids = nextValids;\n  }\n  return valids;\n}\n\n/** @internal */\nexport const INFINITY_RADIUS = 1e4; // far enough for a sub-2px precision on a 4k screen, good enough for text bounds; 64 bit floats still work well with it\n\n/** @internal */\nexport function angleToCircline(\n  midRadius: Radius,\n  alpha: Radian,\n  direction: 1 | -1 /* 1 for clockwise and -1 for anticlockwise circline */,\n) {\n  const sectorRadiusLineX = Math.cos(alpha) * midRadius;\n  const sectorRadiusLineY = Math.sin(alpha) * midRadius;\n  const normalAngle = alpha + (direction * Math.PI) / 2;\n  const x = sectorRadiusLineX + INFINITY_RADIUS * Math.cos(normalAngle);\n  const y = sectorRadiusLineY + INFINITY_RADIUS * Math.sin(normalAngle);\n  return { x, y, r: INFINITY_RADIUS, inside: false, from: 0, to: TAU };\n}\n\nfunction ringSectorStartAngle(d: AngleFromTo): Radian {\n  return trueBearingToStandardPositionAngle(d.x0 + Math.max(0, d.x1 - d.x0 - TAU / 2) / 2);\n}\n\nfunction ringSectorEndAngle(d: AngleFromTo): Radian {\n  return trueBearingToStandardPositionAngle(d.x1 - Math.max(0, d.x1 - d.x0 - TAU / 2) / 2);\n}\n\nfunction ringSectorInnerRadius(innerRadius: Radian, ringThickness: Distance) {\n  return (d: LayerFromTo): Radius => innerRadius + d.y0 * ringThickness;\n}\n\nfunction ringSectorOuterRadius(innerRadius: Radian, ringThickness: Distance) {\n  return (d: LayerFromTo): Radius => innerRadius + (d.y0 + 1) * ringThickness;\n}\n\n/** @internal */\nexport function ringSectorConstruction(\n  { fillOutside, radiusOutside, fillRectangleWidth, fillRectangleHeight }: PartitionSpec,\n  { circlePadding, radialPadding }: PartitionStyle,\n  innerRadius: Radius,\n  ringThickness: Distance,\n) {\n  return (ringSector: ShapeTreeNode): RingSectorConstruction => {\n    const radiusGetter = fillOutside ? ringSectorOuterRadius : ringSectorInnerRadius;\n    const geometricInnerRadius = radiusGetter(innerRadius, ringThickness)(ringSector);\n    const innerR = geometricInnerRadius + circlePadding * 2;\n    const outerR = Math.max(\n      innerR,\n      ringSectorOuterRadius(innerRadius, ringThickness)(ringSector) - circlePadding + (fillOutside ? radiusOutside : 0),\n    );\n    const startAngle = ringSectorStartAngle(ringSector);\n    const endAngle = ringSectorEndAngle(ringSector);\n    const innerCircline = { x: 0, y: 0, r: innerR, inside: true, from: 0, to: TAU };\n    const outerCircline = { x: 0, y: 0, r: outerR, inside: false, from: 0, to: TAU };\n    const midRadius = (innerR + outerR) / 2;\n    const sectorStartCircle = angleToCircline(midRadius, startAngle - radialPadding, -1);\n    const sectorEndCircle = angleToCircline(midRadius, endAngle + radialPadding, 1);\n    const outerRadiusFromRectangleWidth = fillRectangleWidth / 2;\n    const outerRadiusFromRectanglHeight = fillRectangleHeight / 2;\n    const fullCircle = ringSector.x0 === 0 && ringSector.x1 === TAU && geometricInnerRadius === 0;\n    const sectorCirclines = [\n      ...(fullCircle && innerRadius === 0 ? [] : [innerCircline]),\n      outerCircline,\n      ...(fullCircle ? [] : [sectorStartCircle, sectorEndCircle]),\n    ];\n    const rectangleCirclines =\n      outerRadiusFromRectangleWidth === Infinity && outerRadiusFromRectanglHeight === Infinity\n        ? []\n        : [\n            { x: INFINITY_RADIUS - outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true },\n            { x: -INFINITY_RADIUS + outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true },\n            { x: 0, y: INFINITY_RADIUS - outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true },\n            { x: 0, y: -INFINITY_RADIUS + outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true },\n          ];\n    return [...sectorCirclines, ...rectangleCirclines];\n  };\n}\n/** @internal */\nexport function makeRowCircline(\n  cx: Coordinate,\n  cy: Coordinate,\n  radialOffset: Distance,\n  rotation: Radian,\n  fontSize: number,\n  offsetSign: -1 | 0 | 1,\n) {\n  const r = INFINITY_RADIUS;\n  const offset = (offsetSign * fontSize) / 2;\n  const topRadius = r - offset;\n  const x = cx + topRadius * Math.cos(-rotation + TAU / 4);\n  const y = cy + topRadius * Math.cos(-rotation + TAU / 2);\n  return { r: r + radialOffset, x, y };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CategoryKey } from '../../../../common/category';\nimport { Relation } from '../../../../common/text_utils';\nimport { LegendPath } from '../../../../state/actions/legend';\nimport { Datum, ValueAccessor } from '../../../../utils/common';\n\n/** @public */\nexport const AGGREGATE_KEY = 'value';\n/** @public */\nexport const STATISTICS_KEY = 'statistics';\n/** @public */\nexport const DEPTH_KEY = 'depth';\n/** @public */\nexport const CHILDREN_KEY = 'children';\n/** @public */\nexport const INPUT_KEY = 'inputIndex';\n/** @public */\nexport const PARENT_KEY = 'parent';\n/** @public */\nexport const SORT_INDEX_KEY = 'sortIndex';\n/** @public */\nexport const PATH_KEY = 'path';\n\n/** @public */\nexport interface Statistics {\n  globalAggregate: number;\n}\n\n/** @public */\nexport interface NodeDescriptor {\n  [AGGREGATE_KEY]: number;\n  [DEPTH_KEY]: number;\n  [STATISTICS_KEY]: Statistics;\n  [INPUT_KEY]?: Array<number>;\n}\n\n/** @public */\nexport type ArrayEntry = [Key, ArrayNode];\n/** @public */\nexport type HierarchyOfArrays = Array<ArrayEntry>;\n\n/** @public */\nexport interface ArrayNode extends NodeDescriptor {\n  [CHILDREN_KEY]: HierarchyOfArrays;\n  [PARENT_KEY]: ArrayNode;\n  [SORT_INDEX_KEY]: number;\n  [PATH_KEY]: LegendPath;\n}\n\ntype HierarchyOfMaps = Map<Key, MapNode>;\n\ninterface MapNode extends NodeDescriptor {\n  [CHILDREN_KEY]?: HierarchyOfMaps;\n  [PARENT_KEY]?: ArrayNode;\n}\n\n/**\n * Used in the first position of a `LegendPath` array, which indicates the stringified value of the `groupBy` value\n * in case of small multiples, but has no applicable `groupBy` for singleton (non-small-multiples) charts\n * @public\n */\nexport const NULL_SMALL_MULTIPLES_KEY: Key = '__null_small_multiples_key__';\n\n/**\n * Indicates that a node is the root of a specific partition chart, eg. the root of a single pie chart, or one pie\n * chart in a small multiples setting. Used in the second position of a `LegendPath` array\n * @public\n */\nexport const HIERARCHY_ROOT_KEY: Key = '__root_key__';\n\n/**\n * A primitive JavaScript value, possibly further restricted\n * @public\n */\nexport type PrimitiveValue = string | number | null; // there could be more but sufficient for now\n/** @public */\nexport type Key = CategoryKey;\n/** @public */\nexport type Sorter = (a: number, b: number) => number;\n\n/**\n * Binary predicate function used for `[].sort`ing partitions represented as ArrayEntries\n * @public\n */\nexport type NodeSorter = (a: ArrayEntry, b: ArrayEntry) => number;\n\n/** @public */\nexport const entryKey = ([key]: ArrayEntry) => key;\n/** @public */\nexport const entryValue = ([, value]: ArrayEntry) => value;\n\n/** @public */\nexport function depthAccessor(n: ArrayEntry) {\n  return entryValue(n)[DEPTH_KEY];\n}\n\n/** @public */\nexport function aggregateAccessor(n: ArrayEntry): number {\n  return entryValue(n)[AGGREGATE_KEY];\n}\n\n/** @public */\nexport function parentAccessor(n: ArrayEntry): ArrayNode {\n  return entryValue(n)[PARENT_KEY];\n}\n\n/** @public */\nexport function childrenAccessor(n: ArrayEntry) {\n  return entryValue(n)[CHILDREN_KEY];\n}\n\n/** @public */\nexport function sortIndexAccessor(n: ArrayEntry) {\n  return entryValue(n)[SORT_INDEX_KEY];\n}\n\n/** @public */\nexport function pathAccessor(n: ArrayEntry) {\n  return entryValue(n)[PATH_KEY];\n}\n\n/** @public */\nexport function getNodeName(node: ArrayNode): string {\n  const index = node[SORT_INDEX_KEY];\n  const arrayEntry = node[PARENT_KEY][CHILDREN_KEY][index];\n  return arrayEntry ? entryKey(arrayEntry) : '';\n}\n\n/** @internal */\nexport function groupByRollup(\n  keyAccessors: Array<((a: Datum) => Key) | ((a: Datum, i: number) => Key)>,\n  valueAccessor: ValueAccessor,\n  {\n    reducer,\n    identity,\n  }: {\n    reducer: (prev: number, next: number) => number;\n    identity: () => any;\n  },\n  factTable: Relation,\n): HierarchyOfMaps {\n  const statistics: Statistics = {\n    globalAggregate: NaN,\n  };\n  const reductionMap: HierarchyOfMaps = factTable.reduce((p: HierarchyOfMaps, n, index) => {\n    const keyCount = keyAccessors.length;\n    let pointer: HierarchyOfMaps = p;\n    keyAccessors.forEach((keyAccessor, i) => {\n      const key: Key = keyAccessor(n, index);\n      const last = i === keyCount - 1;\n      const node = pointer.get(key);\n      const inputIndices = node?.[INPUT_KEY] ?? [];\n      const childrenMap = node?.[CHILDREN_KEY] ?? new Map();\n      const aggregate = node?.[AGGREGATE_KEY] ?? identity();\n      const reductionValue = reducer(aggregate, valueAccessor(n));\n      pointer.set(key, {\n        [AGGREGATE_KEY]: reductionValue,\n        [STATISTICS_KEY]: statistics,\n        [INPUT_KEY]: [...inputIndices, index],\n        [DEPTH_KEY]: i,\n        ...(!last && { [CHILDREN_KEY]: childrenMap }),\n      });\n      if (childrenMap) {\n        // will always be true except when exiting from forEach, ie. upon encountering the leaf node\n        pointer = childrenMap;\n      }\n    });\n    return p;\n  }, new Map());\n  if (reductionMap.get(HIERARCHY_ROOT_KEY) !== undefined) {\n    statistics.globalAggregate = (reductionMap.get(HIERARCHY_ROOT_KEY) as MapNode)[AGGREGATE_KEY];\n  }\n  return reductionMap;\n}\n\nfunction getRootArrayNode(): ArrayNode {\n  const children: HierarchyOfArrays = [];\n  const bootstrap: Omit<ArrayNode, typeof PARENT_KEY> = {\n    [AGGREGATE_KEY]: NaN,\n    [DEPTH_KEY]: NaN,\n    [CHILDREN_KEY]: children,\n    [INPUT_KEY]: [] as number[],\n    [PATH_KEY]: [] as LegendPath,\n    [SORT_INDEX_KEY]: 0,\n    [STATISTICS_KEY]: { globalAggregate: 0 },\n  };\n  (bootstrap as ArrayNode)[PARENT_KEY] = bootstrap as ArrayNode;\n  return bootstrap as ArrayNode; // TS doesn't yet handle bootstrapping but the `Omit` above retains guarantee for all props except `[PARENT_KEY]`\n}\n\n/** @internal */\nexport function mapsToArrays(\n  root: HierarchyOfMaps,\n  sortSpecs: (NodeSorter | null)[],\n  innerGroups: LegendPath,\n): HierarchyOfArrays {\n  const groupByMap = (node: HierarchyOfMaps, parent: ArrayNode) => {\n    const items = Array.from(node, ([key, value]: [Key, MapNode]): ArrayEntry => {\n      const valueElement = value[CHILDREN_KEY];\n      const resultNode: ArrayNode = {\n        [AGGREGATE_KEY]: NaN,\n        [STATISTICS_KEY]: { globalAggregate: NaN },\n        [CHILDREN_KEY]: [],\n        [DEPTH_KEY]: NaN,\n        [SORT_INDEX_KEY]: NaN,\n        [PARENT_KEY]: parent,\n        [INPUT_KEY]: [],\n        [PATH_KEY]: [],\n      };\n      const newValue: ArrayNode = Object.assign(\n        resultNode,\n        value,\n        valueElement && { [CHILDREN_KEY]: groupByMap(valueElement, resultNode) },\n      );\n      return [key, newValue];\n    });\n    if (sortSpecs.some((s) => s !== null)) {\n      items.sort((e1: ArrayEntry, e2: ArrayEntry) => {\n        const node1 = e1[1];\n        const node2 = e2[1];\n        if (node1[DEPTH_KEY] !== node2[DEPTH_KEY]) return node1[DEPTH_KEY] - node2[DEPTH_KEY];\n        const depth = node1[DEPTH_KEY];\n        const sorterWithinLayer = sortSpecs[depth];\n        return sorterWithinLayer ? sorterWithinLayer(e1, e2) : node2.value - node1.value;\n      });\n    }\n    return items.map((n: ArrayEntry, i) => {\n      entryValue(n).sortIndex = i;\n      return n;\n    });\n  }; // with the current algo, decreasing order is important\n  const tree = groupByMap(root, getRootArrayNode());\n  const buildPaths = ([key, mapNode]: ArrayEntry, currentPath: LegendPath) => {\n    const newPath = [...currentPath, { index: mapNode[SORT_INDEX_KEY], value: key }];\n    mapNode[PATH_KEY] = newPath; // in-place mutation, so disabled `no-param-reassign`\n    mapNode.children.forEach((entry) => buildPaths(entry, newPath));\n  };\n  if (tree[0]) buildPaths(tree[0], innerGroups);\n  return tree;\n}\n\n/** @internal */\nexport function mapEntryValue(entry: ArrayEntry) {\n  return entryValue(entry)[AGGREGATE_KEY];\n}\n\n// type MeanReduction = { sum: number; count: number };\n// type MedianReduction = Array<number>;\n\n/** @internal */\nexport const aggregators = {\n  one: {\n    identity: () => 0,\n    reducer: () => 1,\n  },\n  count: {\n    identity: () => 0,\n    reducer: (r: number) => r + 1,\n  },\n  sum: {\n    identity: () => 0,\n    reducer: (r: number, n: number) => r + n,\n  },\n  min: {\n    identity: () => Infinity,\n    reducer: (r: number, n: number) => Math.min(r, n),\n  },\n  max: {\n    identity: () => -Infinity,\n    reducer: (r: number, n: number) => Math.max(r, n),\n  },\n  min0: {\n    identity: () => 0,\n    reducer: (r: number, n: number) => Math.min(r, n),\n  },\n  max0: {\n    identity: () => 0,\n    reducer: (r: number, n: number) => Math.max(r, n),\n  },\n  // todo more TS typing is needed to use these\n  // mean: {\n  //   identity: (): MeanReduction => ({ sum: 0, count: 0 }),\n  //   reducer: (r: MeanReduction, n: number) => {\n  //     r.sum += n;\n  //     r.count++;\n  //     return r;\n  //   },\n  //   finalizer: (r: MeanReduction): number => r.sum / r.count,\n  // },\n  // median: {\n  //   identity: (): MedianReduction => [],\n  //   reducer: (r: MedianReduction, n: number) => {\n  //     r.push(n);\n  //     return r;\n  //   },\n  //   finalizer: (r: MedianReduction): number => {\n  //     const sorted = r.sort(ascending);\n  //     const len = r.length;\n  //     const even = len === len % 2;\n  //     const half = len / 2;\n  //     return even ? (sorted[half - 1] + sorted[half]) / 2 : sorted[half - 0.5];\n  //   },\n  // },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values as Values } from 'utility-types';\n\nimport { LegendPath } from '../../../../state/actions/legend';\nimport { DataName, QuadViewModel } from '../types/viewmodel_types';\n\ntype LegendStrategyFn = (legendPath: LegendPath) => (partialShape: { path: LegendPath; dataName: DataName }) => boolean;\n\nconst legendStrategies: Record<LegendStrategy, LegendStrategyFn> = {\n  node:\n    (legendPath) =>\n    ({ path }) =>\n      // highlight exact match in the path only\n      legendPath.length === path.length &&\n      legendPath.every(({ index, value }, i) => index === path[i]?.index && value === path[i]?.value),\n\n  path:\n    (legendPath) =>\n    ({ path }) =>\n      // highlight members of the exact path; ie. exact match in the path, plus all its ancestors\n      path.every(({ index, value }, i) => index === legendPath[i]?.index && value === legendPath[i]?.value),\n\n  keyInLayer:\n    (legendPath) =>\n    ({ path, dataName }) =>\n      // highlight all identically named items which are within the same depth (ring) as the hovered legend depth\n      legendPath.length === path.length && dataName === legendPath.at(-1)?.value,\n\n  key:\n    (legendPath) =>\n    ({ dataName }) =>\n      // highlight all identically named items, no matter where they are\n      dataName === legendPath.at(-1)?.value,\n\n  nodeWithDescendants:\n    (legendPath) =>\n    ({ path }) =>\n      // highlight exact match in the path, and everything that is its descendant in that branch\n      legendPath.every(({ index, value }, i) => index === path[i]?.index && value === path[i]?.value),\n\n  pathWithDescendants:\n    (legendPath) =>\n    ({ path }) =>\n      // highlight exact match in the path, and everything that is its ancestor, or its descendant in that branch\n      legendPath\n        .slice(0, path.length)\n        .every(({ index, value }, i) => index === path[i]?.index && value === path[i]?.value),\n};\n\n/** @public */\nexport const LegendStrategy = Object.freeze({\n  /**\n   * Highlight the specific node(s) that the legend item stands for.\n   */\n  Node: 'node' as const,\n  /**\n   * Highlight members of the exact path; ie. like `Node`, plus all its ancestors\n   */\n  Path: 'path' as const,\n  /**\n   * Highlight all identically named (labelled) items within the tree layer (depth or ring) of the specific node(s) that the legend item stands for\n   */\n  KeyInLayer: 'keyInLayer' as const,\n  /**\n   * Highlight all identically named (labelled) items, no matter where they are\n   */\n  Key: 'key' as const,\n  /**\n   * Highlight the specific node(s) that the legend item stands for, plus all descendants\n   */\n  NodeWithDescendants: 'nodeWithDescendants' as const,\n  /**\n   * Highlight the specific node(s) that the legend item stands for, plus all ancestors and descendants\n   */\n  PathWithDescendants: 'pathWithDescendants' as const,\n});\n\n/** @public */\nexport type LegendStrategy = Values<typeof LegendStrategy>;\n\nconst defaultStrategy: LegendStrategy = LegendStrategy.Path;\n\n/** @internal */\nexport function highlightedGeoms(\n  legendStrategy: LegendStrategy | undefined,\n  flatLegend: boolean | undefined,\n  quadViewModel: QuadViewModel[],\n  highlightedLegendItemPath: LegendPath,\n) {\n  return quadViewModel.filter(legendStrategies[legendStrategy ?? defaultStrategy](highlightedLegendItemPath));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  CHILDREN_KEY,\n  HIERARCHY_ROOT_KEY,\n  HierarchyOfArrays,\n  PATH_KEY,\n  ArrayNode,\n  NULL_SMALL_MULTIPLES_KEY,\n  AGGREGATE_KEY,\n} from './group_by_rollup';\nimport { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels';\nimport { ValueFormatter } from '../../../../utils/common';\nimport { Layer } from '../../specs';\n\n/** @internal */\nexport function getLegendLabelsAndValue(\n  layers: Layer[],\n  tree: HierarchyOfArrays,\n  legendMaxDepth: number,\n  // if used the resulting label will be concatenated with the formatted value, use () => '' to avoid that\n  valueFormatter: ValueFormatter,\n): LegendItemLabel[] {\n  return flatSlicesNames(layers, 0, tree, valueFormatter).filter(({ depth }) => depth <= legendMaxDepth);\n}\n\n/** @internal */\nfunction getArrayNodeKey(arrayNode: ArrayNode): string {\n  return arrayNode[PATH_KEY].reduce<string>((acc, { value, index }) => {\n    if (value === HIERARCHY_ROOT_KEY || value === NULL_SMALL_MULTIPLES_KEY) return acc;\n    return `${acc}(${index}):${value}__`;\n  }, '__');\n}\n\nfunction flatSlicesNames(\n  layers: Layer[],\n  depth: number,\n  tree: HierarchyOfArrays,\n  valueFormatter: ValueFormatter,\n  keys: Map<string, string> = new Map(),\n  depths: Map<string, number> = new Map(),\n): LegendItemLabel[] {\n  if (tree.length === 0) {\n    return [];\n  }\n\n  for (const [key, arrayNode] of tree) {\n    // format the key with the layer formatter\n    const layer = layers[depth - 1];\n    const formatter = layer?.nodeLabel;\n    const formattedKey = formatter ? formatter(key) : `${key}`;\n    // preventing errors from external formatters\n    if (formattedKey && formattedKey !== HIERARCHY_ROOT_KEY) {\n      // Node key must be unique for each node in the tree\n      const nodeKey = getArrayNodeKey(arrayNode);\n      // save only the max depth, so we can compute the the max extension of the legend\n      depths.set(nodeKey, depth);\n\n      const formattedValue = valueFormatter(arrayNode[AGGREGATE_KEY]);\n      keys.set(nodeKey, `${formattedKey}${formattedValue}`);\n    }\n\n    const children = arrayNode[CHILDREN_KEY];\n    flatSlicesNames(layers, depth + 1, children, valueFormatter, keys, depths);\n  }\n\n  return [...depths.keys()].map((key) => ({\n    label: keys.get(key) ?? '',\n    depth: depths.get(key) ?? 0,\n  }));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ArrayEntry, childrenAccessor, HierarchyOfArrays } from './group_by_rollup';\nimport { Origin } from '../../../../common/geometry';\nimport { Part } from '../../../../common/text_utils';\n\n/** @internal */\nexport function sunburst(\n  outerNodes: HierarchyOfArrays,\n  areaAccessor: (e: ArrayEntry) => number,\n  { x0: outerX0, y0: outerY0 }: Origin,\n  clockwiseSectors: boolean,\n  specialFirstInnermostSector: boolean,\n  heightStep: number = 1,\n): Array<Part> {\n  const result: Array<Part> = [];\n  const laySubtree = (nodes: HierarchyOfArrays, { x0, y0 }: Origin, depth: number) => {\n    let currentOffsetX = x0;\n    const nodeCount = nodes.length;\n    for (let i = 0; i < nodeCount; i++) {\n      const index = clockwiseSectors ? i : nodeCount - i - 1;\n      const node = nodes[depth === 1 && specialFirstInnermostSector ? (index + 1) % nodeCount : index];\n      if (!node) continue;\n      const area = areaAccessor(node);\n      result.push({ node, x0: currentOffsetX, y0, x1: currentOffsetX + area, y1: y0 + heightStep });\n      const children = childrenAccessor(node);\n      if (children.length > 0) {\n        laySubtree(children, { x0: currentOffsetX, y0: y0 + heightStep }, depth + 1);\n      }\n      currentOffsetX += area;\n    }\n  };\n  laySubtree(outerNodes, { x0: outerX0, y0: outerY0 }, 0);\n  return result;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values as Values } from 'utility-types';\n\nimport { ArrayEntry, CHILDREN_KEY, DEPTH_KEY, entryValue, HierarchyOfArrays } from './group_by_rollup';\nimport { GOLDEN_RATIO } from '../../../../common/constants';\nimport { Pixels } from '../../../../common/geometry';\nimport { Part } from '../../../../common/text_utils';\n\nconst MAX_U_PADDING_RATIO = 0.0256197; // this limits area distortion to <10% (which occurs due to pixel padding) with very small rectangles\nconst MAX_TOP_PADDING_RATIO = 0.33; // this limits further area distortion to ~33%\n\ninterface LayoutElement {\n  nodes: HierarchyOfArrays;\n  dependentSize: number;\n  sectionSizes: number[];\n  sectionOffsets: number[];\n}\n\nfunction layVector(\n  nodes: HierarchyOfArrays,\n  independentSize: number,\n  areaAccessor: (e: ArrayEntry) => number,\n): LayoutElement {\n  const area = nodes.reduce((p, n) => p + areaAccessor(n), 0);\n  const dependentSize = independentSize === 0 ? 0 : area / independentSize; // here we lose a bit of accuracy\n  let currentOffset = 0;\n  const sectionOffsets = [currentOffset];\n  const sectionSizes = nodes.map((e, i) => {\n    const sectionSize = dependentSize === 0 ? 0 : areaAccessor(e) / dependentSize; // here we gain back a bit of accuracy\n    if (i < nodes.length - 1) sectionOffsets.push((currentOffset += sectionSize));\n    return sectionSize;\n  });\n\n  return { nodes, dependentSize, sectionSizes, sectionOffsets }; // descriptor for a vector (column or row) of elements (nodes)\n}\n\n/** @internal */\nexport function leastSquarishAspectRatio({ sectionSizes, dependentSize }: LayoutElement) {\n  if (dependentSize === 0) {\n    return 1;\n  }\n  return sectionSizes.reduce((p, n) => Math.min(p, n / dependentSize, dependentSize / n), 1);\n}\n\nconst NullLayoutElement: LayoutElement = {\n  nodes: [],\n  dependentSize: NaN,\n  sectionSizes: [],\n  sectionOffsets: [],\n};\n\n/**\n * Specifies whether partitions are laid out horizontally, vertically or treemap-like tiling for preferably squarish aspect ratios\n * @public\n */\nexport const LayerLayout = Object.freeze({\n  horizontal: 'horizontal' as const,\n  vertical: 'vertical' as const,\n  squarifying: 'squarifying' as const,\n});\n\n/**\n * Specifies whether partitions are laid out horizontally, vertically or treemap-like tiling for preferably squarish aspect ratios\n * @public\n */\nexport type LayerLayout = Values<typeof LayerLayout>; // could use ValuesType<typeof HierarchicalChartTypes>\n\nfunction bestVector(\n  nodes: HierarchyOfArrays,\n  height: number,\n  areaAccessor: (e: ArrayEntry) => number,\n  layout: LayerLayout | null,\n): LayoutElement {\n  let previousWorstAspectRatio = -1;\n  let currentWorstAspectRatio = 0;\n\n  let previousVectorLayout: LayoutElement = NullLayoutElement;\n  let currentVectorLayout: LayoutElement = NullLayoutElement;\n  let currentCount = 1;\n  do {\n    previousVectorLayout = currentVectorLayout;\n    previousWorstAspectRatio = currentWorstAspectRatio;\n    currentVectorLayout = layVector(nodes.slice(0, currentCount), height, areaAccessor);\n    currentWorstAspectRatio = leastSquarishAspectRatio(currentVectorLayout);\n  } while (currentCount++ < nodes.length && (layout || currentWorstAspectRatio > previousWorstAspectRatio));\n\n  return layout || currentWorstAspectRatio >= previousWorstAspectRatio ? currentVectorLayout : previousVectorLayout;\n}\n\nfunction vectorNodeCoordinates(vectorLayout: LayoutElement, x0Base: number, y0Base: number, vertical: boolean) {\n  const { nodes, dependentSize, sectionSizes, sectionOffsets } = vectorLayout;\n  return nodes.map((e: ArrayEntry, i: number) => {\n    const offset = sectionOffsets[i] ?? 0;\n    const size = sectionSizes[i] ?? 0;\n    const x0 = vertical ? x0Base + offset : x0Base;\n    const y0 = vertical ? y0Base : y0Base + offset;\n    const x1 = vertical ? x0 + size : x0 + dependentSize;\n    const y1 = vertical ? y0 + dependentSize : y0 + size;\n    return { node: e, x0, y0, x1, y1 };\n  });\n}\n\n/** @internal */\nexport const getTopPadding = (requestedTopPadding: number, fullHeight: Pixels) =>\n  Math.min(requestedTopPadding, fullHeight * MAX_TOP_PADDING_RATIO);\n\n/** @internal */\nexport function treemap(\n  nodes: HierarchyOfArrays,\n  areaAccessor: (e: ArrayEntry) => number,\n  topPaddingAccessor: (e: ArrayEntry) => number,\n  paddingAccessor: (e: ArrayEntry) => number,\n  {\n    x0: outerX0,\n    y0: outerY0,\n    width: outerWidth,\n    height: outerHeight,\n  }: { x0: number; y0: number; width: number; height: number },\n  layouts: LayerLayout[],\n): Array<Part> {\n  if (nodes.length === 0) return [];\n  // some bias toward horizontal rectangles with a golden ratio of width to height\n  const depth = (nodes[0]?.[1][DEPTH_KEY] ?? 1) - 1;\n  const layerLayout = layouts[depth] ?? null;\n  const vertical = layerLayout === LayerLayout.vertical || (!layerLayout && outerWidth / GOLDEN_RATIO <= outerHeight);\n  const independentSize = vertical ? outerWidth : outerHeight;\n  const vectorElements = bestVector(nodes, independentSize, areaAccessor, layerLayout);\n  const vector = vectorNodeCoordinates(vectorElements, outerX0, outerY0, vertical);\n  const { dependentSize } = vectorElements;\n  return vector\n    .concat(\n      ...vector.map(({ node, x0, y0, x1, y1 }) => {\n        const childrenNodes = entryValue(node)[CHILDREN_KEY];\n        if (childrenNodes.length === 0) {\n          return [];\n        }\n        const fullWidth = x1 - x0;\n        const fullHeight = y1 - y0;\n        const uPadding = Math.min(\n          paddingAccessor(node),\n          fullWidth * MAX_U_PADDING_RATIO * 2,\n          fullHeight * MAX_U_PADDING_RATIO * 2,\n        );\n        const topPadding = getTopPadding(topPaddingAccessor(node), fullHeight);\n        const width = fullWidth - 2 * uPadding;\n        const height = fullHeight - uPadding - topPadding;\n        return treemap(\n          childrenNodes,\n          (d) => ((width * height) / (fullWidth * fullHeight)) * areaAccessor(d),\n          topPaddingAccessor,\n          paddingAccessor,\n          {\n            x0: x0 + uPadding,\n            y0: y0 + topPadding,\n            width,\n            height,\n          },\n          layouts,\n        );\n      }),\n    )\n    .concat(\n      treemap(\n        nodes.slice(vector.length),\n        areaAccessor,\n        topPaddingAccessor,\n        paddingAccessor,\n        vertical\n          ? { x0: outerX0, y0: outerY0 + dependentSize, width: outerWidth, height: outerHeight - dependentSize }\n          : { x0: outerX0 + dependentSize, y0: outerY0, width: outerWidth - dependentSize, height: outerHeight },\n        layouts,\n      ),\n    );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CHILDREN_KEY, HierarchyOfArrays } from './group_by_rollup';\nimport { Part } from '../../../../common/text_utils';\n\n// 10 x 10 grid for 100 cells ie. one cell is 1%\nconst rowCount = 10;\nconst columnCount = 10;\n\n/** @internal */\nexport function waffle(\n  tree: HierarchyOfArrays,\n  totalValue: number,\n  {\n    x0: outerX0,\n    y0: outerY0,\n    width: outerWidth,\n    height: outerHeight,\n  }: { x0: number; y0: number; width: number; height: number },\n): Array<Part> {\n  const root = tree[0];\n  if (!root || !root[1]) return [];\n\n  const size = Math.min(outerWidth, outerHeight);\n  const widthOffset = Math.max(0, outerWidth - size) / 2;\n  const heightOffset = Math.max(0, outerHeight - size) / 2;\n  const rowHeight = size / rowCount;\n  const columnWidth = size / columnCount;\n  const cellCount = rowCount * columnCount;\n  const valuePerCell = totalValue / cellCount;\n  let valueSoFar = 0;\n  let lastIndex = 0;\n\n  return [\n    { node: root, x0: 0, y0: 0, x1: size, y1: size },\n    ...root[1][CHILDREN_KEY].flatMap((entry) => {\n      const [, { value }] = entry;\n      valueSoFar += value;\n      const toIndex = Math.round(valueSoFar / valuePerCell);\n      const cells = [];\n      for (let i = lastIndex; i < toIndex; i++) {\n        const columnIndex = i % columnCount;\n        const rowIndex = (i - columnIndex) / columnCount;\n        const x0 = outerX0 + widthOffset + columnIndex * columnWidth;\n        const y0 = outerY0 + heightOffset + rowIndex * rowHeight;\n        cells.push({\n          node: entry,\n          x0,\n          y0,\n          x1: x0 + columnWidth,\n          y1: y0 + rowHeight,\n        });\n      }\n      lastIndex = toIndex;\n      return cells;\n    }),\n  ];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RectangleConstruction } from './viewmodel';\nimport { TAU } from '../../../../common/constants';\nimport {\n  Coordinate,\n  Distance,\n  Pixels,\n  PointTuple,\n  Radian,\n  Ratio,\n  RingSectorConstruction,\n  trueBearingToStandardPositionAngle,\n  wrapToTau,\n} from '../../../../common/geometry';\nimport { logarithm } from '../../../../common/math';\nimport { Box, Font, HorizontalAlignment, PartialFont, VerticalAlignments } from '../../../../common/text_utils';\nimport { integerSnap, monotonicHillClimb } from '../../../../solvers/monotonic_hill_climb';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { ValueFormatter, getOppositeAlignment, isRTLString } from '../../../../utils/common';\nimport { FillLabelConfig, Padding, PartitionStyle } from '../../../../utils/themes/partition';\nimport { Layer } from '../../specs';\nimport {\n  QuadViewModel,\n  RawTextGetter,\n  RowBox,\n  RowSet,\n  RowSpace,\n  ShapeTreeNode,\n  ValueGetterFunction,\n} from '../types/viewmodel_types';\nimport { conjunctiveConstraint, INFINITY_RADIUS, makeRowCircline } from '../utils/circline_geometry';\n\n/**\n * todo pick a better unique key for the slices (D3 doesn't keep track of an index)\n * @internal\n */\nexport function nodeId(node: ShapeTreeNode): string {\n  return `${node.x0}|${node.y0}`;\n}\n\n/** @internal */\nexport const getSectorRowGeometry: GetShapeRowGeometry<RingSectorConstruction> = (\n  ringSector,\n  cx,\n  cy,\n  totalRowCount,\n  linePitch,\n  rowIndex,\n  fontSize,\n  rotation,\n) => {\n  const offset = (totalRowCount / 2) * fontSize + fontSize / 2 - linePitch * rowIndex;\n\n  const topCircline = makeRowCircline(cx, cy, offset, rotation, fontSize, 1);\n  const bottomCircline = makeRowCircline(cx, cy, offset, rotation, fontSize, -1);\n  const midCircline = makeRowCircline(cx, cy, offset, rotation, 0, 0);\n\n  const valid1 = conjunctiveConstraint(ringSector, { ...topCircline, from: 0, to: TAU })[0];\n  if (!valid1) return { rowAnchorX: cx, rowAnchorY: cy, maximumRowLength: 0 };\n  const valid2 = conjunctiveConstraint(ringSector, { ...bottomCircline, from: 0, to: TAU })[0];\n  if (!valid2) return { rowAnchorX: cx, rowAnchorY: cy, maximumRowLength: 0 };\n  const from = Math.max(valid1.from, valid2.from);\n  const to = Math.min(valid1.to, valid2.to);\n  const midAngle = (from + to) / 2;\n  const cheapTangent = Math.max(0, to - from); /* Math.tan(Math.max(0, to - from)) */ // https://en.wikipedia.org/wiki/Small-angle_approximation\n  const rowAnchorX = midCircline.r * Math.cos(midAngle) + midCircline.x;\n  const rowAnchorY = midCircline.r * Math.sin(midAngle) + midCircline.y;\n  const maximumRowLength = cheapTangent * INFINITY_RADIUS;\n  return { rowAnchorX, rowAnchorY, maximumRowLength };\n};\n\nfunction getVerticalAlignment(\n  container: RectangleConstruction,\n  verticalAlignment: VerticalAlignments,\n  linePitch: Pixels,\n  totalRowCount: number,\n  rowIndex: number,\n  paddingTop: Pixels,\n  paddingBottom: Pixels,\n  fontSize: Pixels,\n  overhang: Ratio,\n) {\n  switch (verticalAlignment) {\n    case VerticalAlignments.top:\n      return -(container.y0 + linePitch * rowIndex + paddingTop + fontSize * overhang);\n    case VerticalAlignments.bottom:\n      return -(container.y1 - linePitch * (totalRowCount - 1 - rowIndex) - paddingBottom - fontSize * overhang);\n    default:\n      return -((container.y0 + container.y1) / 2 + (linePitch * (rowIndex + 1 - totalRowCount)) / 2);\n  }\n}\n\n/** @internal */\nexport const getRectangleRowGeometry: GetShapeRowGeometry<RectangleConstruction> = (\n  container,\n  cx,\n  cy,\n  totalRowCount,\n  linePitch,\n  rowIndex,\n  fontSize,\n  _rotation,\n  verticalAlignment,\n  padding,\n) => {\n  const defaultPad: Pixels = 2;\n  const { top, right, bottom, left } =\n    typeof padding === 'number'\n      ? { top: padding, right: padding, bottom: padding, left: padding }\n      : {\n          top: defaultPad,\n          right: defaultPad,\n          bottom: defaultPad,\n          left: defaultPad,\n          ...padding,\n        };\n\n  const overhang = 0.05;\n  const topPaddingAdjustment = fontSize < 6 ? 0 : Math.max(1, Math.min(2, fontSize / 16));\n  const adjustedTop = top + topPaddingAdjustment; // taper out paddingTop with small fonts\n  if ((container.y1 - container.y0 - adjustedTop - bottom) / totalRowCount < linePitch) {\n    return {\n      rowAnchorX: NaN,\n      rowAnchorY: NaN,\n      maximumRowLength: 0,\n    };\n  }\n\n  const rowAnchorY = getVerticalAlignment(\n    container,\n    verticalAlignment,\n    linePitch,\n    totalRowCount,\n    rowIndex,\n    adjustedTop,\n    bottom,\n    fontSize,\n    overhang,\n  );\n\n  return {\n    rowAnchorX: cx + left / 2 - right / 2,\n    rowAnchorY,\n    maximumRowLength: container.x1 - container.x0 - left - right,\n  };\n};\n\nfunction rowSetComplete(rowSet: RowSet, measuredBoxes: RowBox[]) {\n  return (\n    measuredBoxes.length === 0 &&\n    !rowSet.rows.some((r) => !Number.isFinite(r.length) || r.rowWords.every((rw) => rw.text.length === 0))\n  );\n}\n\nfunction identityRowSet(): RowSet {\n  return {\n    id: '',\n    rows: [],\n    fontSize: NaN,\n    fillTextColor: '',\n    rotation: NaN,\n    isRTL: false,\n    verticalAlignment: VerticalAlignments.middle,\n    horizontalAlignment: HorizontalAlignment.center,\n  };\n}\n\nfunction getAllBoxes(\n  rawTextGetter: RawTextGetter,\n  valueGetter: ValueGetterFunction,\n  valueFormatter: ValueFormatter,\n  sizeInvariantFontShorthand: Font,\n  valueFont: PartialFont,\n  node: ShapeTreeNode,\n): Box[] {\n  return rawTextGetter(node)\n    .split(' ')\n    .filter(Boolean)\n    .map<Box>((text) => ({ text, ...sizeInvariantFontShorthand, isValue: false }))\n    .concat(\n      [valueFormatter(valueGetter(node))]\n        .filter(Boolean)\n        .map<Box>((text) => ({ text, ...sizeInvariantFontShorthand, ...valueFont, isValue: true })),\n    );\n}\n\nfunction getWordSpacing(fontSize: number) {\n  return fontSize / 4;\n}\n\ntype GetShapeRowGeometry<C> = (\n  container: C,\n  cx: Distance,\n  cy: Distance,\n  targetRowCount: number,\n  linePitch: Pixels,\n  currentRowIndex: number,\n  fontSize: Pixels,\n  rotation: Radian,\n  verticalAlignment: VerticalAlignments,\n  padding: Padding,\n) => RowSpace;\n\ntype ShapeConstructor<C> = (n: ShapeTreeNode) => C;\n\nfunction fill<C>(\n  shapeConstructor: ShapeConstructor<C>,\n  getShapeRowGeometry: GetShapeRowGeometry<C>,\n  getRotation: GetRotation,\n) {\n  return function fillClosure(\n    fillLabel: FillLabelConfig,\n    layers: Layer[],\n    measure: TextMeasure,\n    rawTextGetter: RawTextGetter,\n    valueGetter: ValueGetterFunction,\n    formatter: ValueFormatter,\n    maxRowCount: number,\n    leftAlign: boolean,\n    middleAlign: boolean,\n  ) {\n    const horizontalAlignment = leftAlign ? HorizontalAlignment.left : HorizontalAlignment.center;\n    return (allFontSizes: Pixels[][], textFillOrigin: PointTuple, node: QuadViewModel): RowSet => {\n      const container = shapeConstructor(node);\n      const rotation = getRotation(node);\n\n      const layer = layers[node.depth - 1];\n\n      if (!layer) {\n        throw new Error(`Failed to find layer at ${node.depth - 1}`);\n      }\n\n      const verticalAlignment = middleAlign\n        ? VerticalAlignments.middle\n        : node.depth < layers.length\n          ? VerticalAlignments.bottom\n          : VerticalAlignments.top;\n      const fontSizes = allFontSizes[Math.min(node.depth, allFontSizes.length) - 1] ?? [];\n      const { fontStyle, fontVariant, fontFamily, fontWeight, valueFormatter, padding, clipText } = {\n        ...fillLabel,\n        valueFormatter: formatter,\n        ...layer.fillLabel,\n        ...layer.shape,\n      };\n\n      const valueFont = {\n        ...fillLabel,\n        ...fillLabel.valueFont,\n        ...layer.fillLabel,\n        ...layer.fillLabel?.valueFont,\n      };\n\n      const sizeInvariantFont: Font = {\n        fontStyle,\n        fontVariant,\n        fontWeight,\n        fontFamily,\n        textColor: node.textColor,\n      };\n      const isRtlString = isRTLString(rawTextGetter(node));\n      const allBoxes = getAllBoxes(rawTextGetter, valueGetter, valueFormatter, sizeInvariantFont, valueFont, node);\n      const [cx, cy] = textFillOrigin;\n\n      return {\n        ...getRowSet(\n          allBoxes,\n          maxRowCount,\n          fontSizes,\n          measure,\n          rotation,\n          verticalAlignment,\n          horizontalAlignment,\n          container,\n          getShapeRowGeometry,\n          cx,\n          cy,\n          padding,\n          node,\n          clipText,\n          isRtlString,\n        ),\n        fillTextColor: node.textColor,\n      };\n    };\n  };\n}\n\nfunction tryFontSize<C>(\n  measure: TextMeasure,\n  rotation: Radian,\n  verticalAlignment: VerticalAlignments,\n  horizontalAlignment: HorizontalAlignment,\n  container: C,\n  getShapeRowGeometry: GetShapeRowGeometry<C>,\n  cx: Coordinate,\n  cy: Coordinate,\n  padding: Padding,\n  node: ShapeTreeNode,\n  boxes: Box[],\n  maxRowCount: number,\n  clipText: boolean,\n  isRTL: boolean,\n) {\n  const adjustedHorizontalAlignment = isRTL ? getOppositeAlignment(horizontalAlignment) : horizontalAlignment;\n  return function tryFontSizeFn(initialRowSet: RowSet, fontSize: Pixels): { rowSet: RowSet; completed: boolean } {\n    let rowSet: RowSet = initialRowSet;\n\n    const wordSpacing = getWordSpacing(fontSize);\n\n    // model text pieces, obtaining their width at the current font size\n    const allMeasuredBoxes = boxes.map<RowBox>((box) => {\n      const { width } = measure(box.text, box, fontSize);\n      return {\n        width,\n        wordBeginning: NaN,\n        ...box,\n        fontSize, // iterated fontSize overrides a possible more global fontSize\n      };\n    });\n    const linePitch = fontSize;\n\n    // rowSet building starts\n    let targetRowCount = 0;\n    let measuredBoxes = allMeasuredBoxes.slice();\n    let innerCompleted = false;\n\n    // iterate through possible target row counts\n    while (++targetRowCount <= maxRowCount && !innerCompleted) {\n      measuredBoxes = allMeasuredBoxes.slice();\n      rowSet = {\n        id: nodeId(node),\n        fontSize,\n        fillTextColor: '',\n        rotation,\n        verticalAlignment,\n        horizontalAlignment: adjustedHorizontalAlignment,\n        clipText,\n        isRTL,\n        rows: [...new Array(targetRowCount)].map(() => ({\n          rowWords: [],\n          rowAnchorX: NaN,\n          rowAnchorY: NaN,\n          maximumLength: NaN,\n          length: NaN,\n        })),\n        container,\n      };\n\n      let currentRowIndex = 0;\n\n      // iterate through rows\n      while (currentRowIndex < targetRowCount) {\n        const currentRow = rowSet.rows[currentRowIndex];\n\n        if (!currentRow) {\n          currentRowIndex++;\n          continue;\n        }\n\n        const currentRowWords = currentRow.rowWords;\n\n        // current row geometries\n        const { maximumRowLength, rowAnchorX, rowAnchorY } = getShapeRowGeometry(\n          container,\n          cx,\n          cy,\n          targetRowCount,\n          linePitch,\n          currentRowIndex,\n          fontSize,\n          rotation,\n          verticalAlignment,\n          padding,\n        );\n\n        currentRow.rowAnchorX = rowAnchorX;\n        currentRow.rowAnchorY = rowAnchorY;\n        currentRow.maximumLength = maximumRowLength;\n\n        // row building starts\n        let currentRowLength = 0;\n        let rowHasRoom = true;\n\n        // iterate through words: keep adding words while there's room\n        while (measuredBoxes.length > 0 && rowHasRoom) {\n          // adding box to row\n          const [currentBox] = measuredBoxes;\n          if (!currentBox) continue;\n          const wordBeginning = currentRowLength;\n          currentRowLength += currentBox.width + wordSpacing;\n\n          if (clipText || currentRowLength <= currentRow.maximumLength) {\n            currentRowWords.push({ ...currentBox, wordBeginning });\n            currentRow.length = currentRowLength;\n            measuredBoxes.shift();\n          } else {\n            rowHasRoom = false;\n          }\n        }\n\n        currentRowIndex++;\n      }\n\n      innerCompleted = rowSetComplete(rowSet, measuredBoxes);\n    }\n    const completed = measuredBoxes.length === 0;\n    return { rowSet, completed };\n  };\n}\n\nfunction getRowSet<C>(\n  boxes: Box[],\n  maxRowCount: number,\n  fontSizes: Pixels[],\n  measure: TextMeasure,\n  rotation: Radian,\n  verticalAlignment: VerticalAlignments,\n  horizontalAlignment: HorizontalAlignment,\n  container: C,\n  getShapeRowGeometry: GetShapeRowGeometry<C>,\n  cx: Coordinate,\n  cy: Coordinate,\n  padding: Padding,\n  node: ShapeTreeNode,\n  clipText: boolean,\n  isRtl: boolean,\n): RowSet {\n  const tryFunction = tryFontSize(\n    measure,\n    rotation,\n    verticalAlignment,\n    horizontalAlignment,\n    container,\n    getShapeRowGeometry,\n    cx,\n    cy,\n    padding,\n    node,\n    boxes,\n    maxRowCount,\n    clipText,\n    isRtl,\n  );\n\n  // find largest fitting font size\n  const largestIndex = fontSizes.length - 1;\n  const response = (i: number) =>\n    i + (tryFunction(identityRowSet(), fontSizes[i] ?? 0).completed ? 0 : largestIndex + 1);\n  const fontSizeIndex = monotonicHillClimb(response, largestIndex, largestIndex, integerSnap);\n\n  if (!(fontSizeIndex >= 0)) {\n    return identityRowSet();\n  }\n\n  const { rowSet, completed } = tryFunction(identityRowSet(), fontSizes[fontSizeIndex] ?? 0); // todo in the future, make the hill climber also yield the result to avoid this +1 call\n  return { ...rowSet, rows: rowSet.rows.filter((r) => completed && Number.isFinite(r.length)) };\n}\n\n/** @internal */\nexport function inSectorRotation(horizontalTextEnforcer: number, horizontalTextAngleThreshold: number) {\n  return (node: ShapeTreeNode): Radian => {\n    let rotation = trueBearingToStandardPositionAngle((node.x0 + node.x1) / 2);\n    if (Math.abs(node.x1 - node.x0) > horizontalTextAngleThreshold && horizontalTextEnforcer > 0)\n      rotation *= 1 - horizontalTextEnforcer;\n    if (TAU / 4 < rotation && rotation < (3 * TAU) / 4) rotation = wrapToTau(rotation - TAU / 2);\n    return rotation;\n  };\n}\n\ntype GetRotation = (node: ShapeTreeNode) => Radian;\n\n/** @internal */\nexport function fillTextLayout<C>(\n  shapeConstructor: ShapeConstructor<C>,\n  getShapeRowGeometry: GetShapeRowGeometry<C>,\n  getRotation: GetRotation,\n) {\n  const specificFiller = fill(shapeConstructor, getShapeRowGeometry, getRotation);\n  return function fillTextLayoutClosure(\n    measure: TextMeasure,\n    rawTextGetter: RawTextGetter,\n    valueGetter: ValueGetterFunction,\n    valueFormatter: ValueFormatter,\n    childNodes: QuadViewModel[],\n    style: PartitionStyle,\n    layers: Layer[],\n    textFillOrigins: PointTuple[],\n    maxRowCount: number,\n    leftAlign: boolean,\n    middleAlign: boolean,\n  ): RowSet[] {\n    const allFontSizes: Pixels[][] = [];\n    for (let l = 0; l <= layers.length; l++) {\n      // get font size spec from config, which layer.fillLabel properties can override\n      const { minFontSize, maxFontSize, idealFontSizeJump } = {\n        ...style,\n        ...(l < layers.length && layers[l]?.fillLabel),\n      };\n      const fontSizeMagnification = maxFontSize / minFontSize;\n      const fontSizeJumpCount = Math.round(logarithm(idealFontSizeJump, fontSizeMagnification));\n      const realFontSizeJump = Math.pow(fontSizeMagnification, 1 / fontSizeJumpCount);\n      const fontSizes: Pixels[] = [];\n      for (let i = 0; i <= fontSizeJumpCount; i++) {\n        const fontSize = Math.round(minFontSize * Math.pow(realFontSizeJump, i));\n        if (!fontSizes.includes(fontSize)) {\n          fontSizes.push(fontSize);\n        }\n      }\n      allFontSizes.push(fontSizes);\n    }\n\n    const filler = specificFiller(\n      style.fillLabel,\n      layers,\n      measure,\n      rawTextGetter,\n      valueGetter,\n      valueFormatter,\n      maxRowCount,\n      leftAlign,\n      middleAlign,\n    );\n\n    return childNodes\n      .map((node: QuadViewModel, i: number) => ({ node, origin: textFillOrigins[i] }))\n      .sort((a, b) => b.node.value - a.node.value)\n      .reduce<{ rowSets: RowSet[]; fontSizes: Pixels[][] }>(\n        ({ rowSets, fontSizes }, { node, origin }) => {\n          if (!origin) return { rowSets, fontSizes };\n          const nextRowSet = filler(fontSizes, origin, node);\n          const { fontSize } = nextRowSet;\n          const layerIndex = node.depth - 1;\n          return {\n            rowSets: [...rowSets, nextRowSet],\n            fontSizes: fontSizes.map((layerFontSizes: Pixels[], index: number) =>\n              Number.isFinite(fontSize) && index === layerIndex && !layers[layerIndex]?.fillLabel?.maximizeFontSize\n                ? layerFontSizes.filter((size: Pixels) => size <= fontSize)\n                : layerFontSizes,\n            ),\n          };\n        },\n        { rowSets: [], fontSizes: allFontSizes },\n      ).rowSets;\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isMosaic, isSunburst, isTreemap, isWaffle } from './viewmodel';\nimport { LegendItemExtraValues } from '../../../../common/legend';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { Relation } from '../../../../common/text_utils';\nimport { LegendPath } from '../../../../state/actions/legend';\nimport { IndexedAccessorFn } from '../../../../utils/accessor';\nimport { Datum, ValueAccessor, ValueFormatter } from '../../../../utils/common';\nimport { Layer } from '../../specs';\nimport { PartitionLayout } from '../types/config_types';\nimport {\n  aggregators,\n  CHILDREN_KEY,\n  groupByRollup,\n  HIERARCHY_ROOT_KEY,\n  HierarchyOfArrays,\n  mapEntryValue,\n  mapsToArrays,\n  NodeSorter,\n  Sorter,\n} from '../utils/group_by_rollup';\n\nfunction aggregateComparator(accessor: (v: any) => any, sorter: Sorter): NodeSorter {\n  return (a, b) => sorter(accessor(a), accessor(b));\n}\n\nconst ascending: Sorter = (a, b) => a - b;\nconst descending: Sorter = (a, b) => b - a;\n\nconst childOrders = {\n  ascending,\n  descending,\n};\n\nconst descendingValueNodes = aggregateComparator(mapEntryValue, childOrders.descending);\nconst ascendingValueNodes = aggregateComparator(mapEntryValue, childOrders.ascending);\n\n/**\n * @internal\n */\nexport function getHierarchyOfArrays(\n  rawFacts: Relation,\n  valueAccessor: ValueAccessor,\n  groupByRollupAccessors: IndexedAccessorFn[],\n  sortSpecs: (NodeSorter | null)[],\n  innerGroups: LegendPath,\n): HierarchyOfArrays {\n  const aggregator = aggregators.sum;\n\n  const facts = rawFacts.filter((n) => {\n    const value = valueAccessor(n);\n    return Number.isFinite(value) && value >= 0;\n  });\n\n  // don't render anything if the total, the width or height is not positive or zero\n  if (facts.reduce((p: number, n) => aggregator.reducer(p, valueAccessor(n)), aggregator.identity()) <= 0) {\n    return [];\n  }\n\n  // We can precompute things invariant of how the rectangle is divvied up.\n  // By introducing `scale`, we no longer need to deal with the dichotomy of\n  // size as data value vs size as number of pixels in the rectangle\n  return mapsToArrays(groupByRollup(groupByRollupAccessors, valueAccessor, aggregator, facts), sortSpecs, innerGroups);\n}\n\nconst sorter =\n  (layout: PartitionLayout) =>\n  ({ sortPredicate }: Layer, i: number) =>\n    sortPredicate ||\n    (isTreemap(layout) || isSunburst(layout) || isWaffle(layout)\n      ? descendingValueNodes\n      : isMosaic(layout)\n        ? i === 2\n          ? ascendingValueNodes\n          : descendingValueNodes\n        : null);\n\n/** @internal */\nexport function partitionTree(\n  data: Datum[],\n  valueAccessor: ValueAccessor,\n  layers: Layer[],\n  layout: PartitionLayout,\n  innerGroups: LegendPath,\n) {\n  return getHierarchyOfArrays(\n    data,\n    valueAccessor,\n    [() => HIERARCHY_ROOT_KEY, ...layers.map(({ groupByRollup }) => groupByRollup)],\n    [null, ...layers.map(sorter(layout))],\n    innerGroups,\n  );\n}\n\n/**\n * Creates flat extra value map from nested key path\n * @internal\n */\nexport function getExtraValueMap(\n  layers: Layer[],\n  valueFormatter: ValueFormatter,\n  tree: HierarchyOfArrays,\n  maxDepth: number,\n  depth: number = 0,\n  keys: Map<SeriesKey, LegendItemExtraValues> = new Map(),\n): Map<SeriesKey, LegendItemExtraValues> {\n  for (let i = 0; i < tree.length; i++) {\n    const branch = tree[i];\n    if (!branch) continue;\n    const [key, arrayNode] = branch;\n    const { value, path, [CHILDREN_KEY]: children } = arrayNode;\n    const values: LegendItemExtraValues = new Map();\n    const formattedValue = valueFormatter ? valueFormatter(value) : `${value}`;\n    values.set(key, { formatted: formattedValue, raw: value });\n    keys.set(path.map(({ index }) => index).join('__'), values);\n    if (depth < maxDepth) getExtraValueMap(layers, valueFormatter, children, maxDepth, depth + 1, keys);\n  }\n  return keys;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba } from '../../../../common/color_library_wrappers';\nimport { Color } from '../../../../common/colors';\nimport { TAU } from '../../../../common/constants';\nimport { fillTextColor } from '../../../../common/fill_text_color';\nimport {\n  Distance,\n  meanAngle,\n  Pixels,\n  PointTuple,\n  PointTuples,\n  trueBearingToStandardPositionAngle,\n} from '../../../../common/geometry';\nimport { cutToLength, fitText, Font, measureOneBoxWidth } from '../../../../common/text_utils';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { ColorVariant, isRTLString, ValueFormatter } from '../../../../utils/common';\nimport { Logger } from '../../../../utils/logger';\nimport { Point } from '../../../../utils/point';\nimport { LinkLabelConfig, PartitionStyle } from '../../../../utils/themes/partition';\nimport { BackgroundStyle } from '../../../../utils/themes/theme';\nimport { LinkLabelVM, RawTextGetter, ShapeTreeNode, ValueGetterFunction } from '../types/viewmodel_types';\n\n/** @internal */\nexport interface LinkLabelsViewModelSpec {\n  linkLabels: LinkLabelVM[];\n  labelFontSpec: Font;\n  valueFontSpec: Font;\n  strokeColor: Color;\n}\n\n/** @internal */\nexport function linkTextLayout(\n  rectWidth: Distance,\n  rectHeight: Distance,\n  measure: TextMeasure,\n  style: PartitionStyle,\n  nodesWithoutRoom: ShapeTreeNode[],\n  currentY: Distance[],\n  anchorRadius: Distance,\n  rawTextGetter: RawTextGetter,\n  valueGetter: ValueGetterFunction,\n  valueFormatter: ValueFormatter,\n  maxTextLength: number,\n  diskCenter: Point,\n  { color: backgroundColor, fallbackColor: fallbackBGColor }: BackgroundStyle,\n): LinkLabelsViewModelSpec {\n  const { linkLabel } = style;\n  const maxDepth = nodesWithoutRoom.reduce((p: number, n: ShapeTreeNode) => Math.max(p, n.depth), 0);\n  const yRelativeIncrement = Math.sin(linkLabel.stemAngle) * linkLabel.minimumStemLength;\n  const rowPitch = linkLabel.fontSize + linkLabel.spacing;\n\n  const linkLabels: LinkLabelVM[] = nodesWithoutRoom\n    .filter((n: ShapeTreeNode) => n.depth === maxDepth) // only the outermost ring can have links\n    .sort((n1: ShapeTreeNode, n2: ShapeTreeNode) => Math.abs(n2.x0 - n2.x1) - Math.abs(n1.x0 - n1.x1))\n    .slice(0, linkLabel.maxCount) // largest linkLabel.MaxCount slices\n    .sort(linkLabelCompare)\n    .map(\n      nodeToLinkLabel({\n        linkLabel,\n        anchorRadius,\n        currentY,\n        rowPitch,\n        yRelativeIncrement,\n        rawTextGetter,\n        maxTextLength,\n        valueFormatter,\n        valueGetter,\n        measure,\n        rectWidth,\n        rectHeight,\n        diskCenter,\n      }),\n    )\n    .filter(({ text }) => text !== ''); // cull linked labels whose text was truncated to nothing;\n\n  if (colorToRgba(backgroundColor)[3] < 1) {\n    // Override handled in fill_text_color.ts\n    Logger.expected(\n      'Text contrast requires an opaque background color, using fallbackColor',\n      'an opaque color',\n      backgroundColor,\n    );\n  }\n  const textColor =\n    linkLabel.textColor === ColorVariant.Adaptive\n      ? fillTextColor(fallbackBGColor, null, backgroundColor).color.keyword\n      : linkLabel.textColor;\n  const labelFontSpec: Font = { ...linkLabel, textColor };\n  const valueFontSpec: Font = { ...linkLabel, ...linkLabel.valueFont, textColor };\n\n  return { linkLabels, valueFontSpec, labelFontSpec, strokeColor: textColor };\n}\n\nfunction linkLabelCompare(n1: ShapeTreeNode, n2: ShapeTreeNode) {\n  const mid1 = meanAngle(n1.x0, n1.x1);\n  const mid2 = meanAngle(n2.x0, n2.x1);\n  const dist1 = Math.min(Math.abs(mid1 - TAU / 4), Math.abs(mid1 - (3 * TAU) / 4));\n  const dist2 = Math.min(Math.abs(mid2 - TAU / 4), Math.abs(mid2 - (3 * TAU) / 4));\n  return dist1 - dist2;\n}\n\nfunction nodeToLinkLabel({\n  linkLabel,\n  anchorRadius,\n  currentY,\n  rowPitch,\n  yRelativeIncrement,\n  rawTextGetter,\n  maxTextLength,\n  valueFormatter,\n  valueGetter,\n  measure,\n  rectWidth,\n  rectHeight,\n  diskCenter,\n}: {\n  linkLabel: LinkLabelConfig;\n  anchorRadius: Distance;\n  currentY: Distance[];\n  rowPitch: Pixels;\n  yRelativeIncrement: Distance;\n  rawTextGetter: RawTextGetter;\n  maxTextLength: number;\n  valueFormatter: ValueFormatter;\n  valueGetter: ValueGetterFunction;\n  measure: TextMeasure;\n  rectWidth: Distance;\n  rectHeight: Distance;\n  diskCenter: Point;\n}) {\n  const labelFont: Font = linkLabel; // only interested in the font properties\n  const valueFont: Font = { ...labelFont, ...linkLabel.valueFont }; // only interested in the font properties\n  return function nodeToLinkLabelMap(node: ShapeTreeNode): LinkLabelVM {\n    // geometry\n    const midAngle = trueBearingToStandardPositionAngle((node.x0 + node.x1) / 2);\n    const north = midAngle < TAU / 2 ? 1 : -1;\n    const rightSide = TAU / 4 < midAngle && midAngle < (3 * TAU) / 4 ? 0 : 1;\n    const west = rightSide ? 1 : -1;\n    const cos = Math.cos(midAngle);\n    const sin = Math.sin(midAngle);\n    const x0 = cos * anchorRadius;\n    const y0 = sin * anchorRadius;\n    const x = cos * (anchorRadius + linkLabel.radiusPadding);\n    const y = sin * (anchorRadius + linkLabel.radiusPadding);\n    const stemFromX = x; // might be different in the future, eg. to allow a small gap: doc purpose\n    const stemFromY = y; // might be different in the future, eg. to allow a small gap: doc purpose\n\n    // calculate and remember vertical offset, as linked labels accrete\n    const poolIndex = rightSide + (1 - north);\n    const relativeY = north * y;\n    const yOffset = Math.max((currentY[poolIndex] ?? 0) + rowPitch, relativeY + yRelativeIncrement, rowPitch / 2);\n    currentY[poolIndex] = yOffset;\n\n    // more geometry: the part that depends on vertical position\n    const cy = north * yOffset;\n    const stemToX = x + north * west * cy - west * relativeY;\n    const stemToY = cy;\n    const translateX = stemToX + west * (linkLabel.horizontalStemLength + linkLabel.gap);\n    const translate: PointTuple = [translateX, stemToY];\n\n    // the path points of the label link, ie. a polyline\n    const linkLabels: PointTuples = [\n      [x0, y0],\n      [stemFromX, stemFromY],\n      [stemToX, stemToY],\n      [stemToX + west * linkLabel.horizontalStemLength, stemToY],\n    ];\n\n    const rawLabelText = rawTextGetter(node);\n    const isRTL = isRTLString(rawLabelText);\n\n    // value text is simple: the full, formatted value is always shown, not truncated\n    const valueText = valueFormatter(valueGetter(node));\n    const valueWidth = measureOneBoxWidth(measure, linkLabel.fontSize, {\n      ...valueFont,\n      text: valueText,\n      isValue: false,\n    });\n    const widthAdjustment = valueWidth + 2 * linkLabel.fontSize; // gap between label and value, plus possibly 2em wide ellipsis\n\n    // label text removes space allotted for value and gaps, then tries to fit as much as possible\n    const labelText = cutToLength(rawLabelText, maxTextLength);\n    const allottedLabelWidth = Math.max(\n      0,\n      rightSide ? rectWidth - diskCenter.x - translateX - widthAdjustment : diskCenter.x + translateX - widthAdjustment,\n    );\n    const { text, width } =\n      linkLabel.fontSize / 2 <= cy + diskCenter.y && cy + diskCenter.y <= rectHeight - linkLabel.fontSize / 2\n        ? fitText(measure, labelText, allottedLabelWidth, linkLabel.fontSize, labelFont)\n        : { text: '', width: 0 };\n\n    return {\n      isRTL,\n      linkLabels,\n      translate,\n      text,\n      valueText,\n      width,\n      valueWidth,\n      textAlign: rightSide ? 'left' : 'right',\n    };\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isLinear } from './viewmodel';\nimport { TooltipInfo } from '../../../../components/tooltip';\nimport { LayerValue, TooltipValue } from '../../../../specs';\nimport { LabelAccessor, ValueFormatter } from '../../../../utils/common';\nimport { SpecId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { ContinuousDomainFocus } from '../../renderer/canvas/partition';\nimport { MODEL_KEY, percentValueGetter } from '../config';\nimport { QuadViewModel, ShapeViewModel } from '../types/viewmodel_types';\nimport {\n  AGGREGATE_KEY,\n  ArrayNode,\n  CHILDREN_KEY,\n  DEPTH_KEY,\n  entryValue,\n  getNodeName,\n  PARENT_KEY,\n  PATH_KEY,\n  SORT_INDEX_KEY,\n} from '../utils/group_by_rollup';\n\n/** @internal */\nexport const pickedShapes = (\n  models: ShapeViewModel[],\n  { x, y }: Point,\n  [focus]: ContinuousDomainFocus[],\n): QuadViewModel[] =>\n  focus ? models.flatMap(({ diskCenter, pickQuads }) => pickQuads(x - diskCenter.x, y - diskCenter.y, focus)) : [];\n\n/** @internal */\nexport function pickShapesLayerValues(shapes: QuadViewModel[]): LayerValue[][] {\n  const maxDepth = shapes.reduce((acc, curr) => Math.max(acc, curr.depth), 0);\n  return shapes\n    .filter(({ depth }) => depth === maxDepth) // eg. lowest layer in a treemap, where layers overlap in screen space; doesn't apply to sunburst/flame\n    .map<LayerValue[]>((viewModel) => {\n      const values: LayerValue[] = [\n        {\n          smAccessorValue: viewModel.smAccessorValue,\n          groupByRollup: viewModel.dataName,\n          value: viewModel[AGGREGATE_KEY],\n          depth: viewModel[DEPTH_KEY],\n          sortIndex: viewModel[SORT_INDEX_KEY],\n          path: viewModel[PATH_KEY],\n        },\n      ];\n      let node = viewModel[MODEL_KEY];\n      while (node[DEPTH_KEY] > 0) {\n        const value = node[AGGREGATE_KEY];\n        const dataName = getNodeName(node);\n        values.push({\n          smAccessorValue: viewModel.smAccessorValue,\n          groupByRollup: dataName,\n          value,\n          depth: node[DEPTH_KEY],\n          sortIndex: node[SORT_INDEX_KEY],\n          path: node[PATH_KEY],\n        });\n\n        node = node[PARENT_KEY];\n      }\n      return values.reverse();\n    });\n}\n\n/** @internal */\nexport function pickShapesTooltipValues(\n  shapes: QuadViewModel[],\n  shapeViewModel: ShapeViewModel[],\n  valueFormatter: ValueFormatter,\n  percentFormatter: ValueFormatter,\n  id: SpecId,\n): TooltipInfo {\n  const maxDepth = shapes.reduce((acc, curr) => Math.max(acc, curr.depth), 0);\n  const currentShapeViewModel = shapeViewModel.find((d) => d.smAccessorValue === shapes[0]?.smAccessorValue);\n  if (!currentShapeViewModel) {\n    return { values: [], header: null };\n  }\n  const labelFormatters = currentShapeViewModel.layers.map((d) => d.nodeLabel);\n\n  return {\n    header: null,\n    values: shapes\n      .filter(({ depth }) => depth === maxDepth) // eg. lowest layer in a treemap, where layers overlap in screen space; doesn't apply to sunburst/flame\n      .flatMap<TooltipValue>((viewModel) => {\n        const entryNode = viewModel[PARENT_KEY][CHILDREN_KEY][viewModel[SORT_INDEX_KEY]];\n        if (!entryNode) return [];\n        const values: TooltipValue[] = [\n          getTooltipValueFromNode(\n            entryValue(entryNode),\n            labelFormatters,\n            valueFormatter,\n            percentFormatter,\n            currentShapeViewModel,\n            id,\n          ),\n        ];\n        // return only the leaf node if flame/icicle to avoid its highly hierarchical nature\n        if (isLinear(currentShapeViewModel.layout)) {\n          return values;\n        }\n        let node = viewModel[MODEL_KEY];\n        while (node[DEPTH_KEY] > 0) {\n          values.push(\n            getTooltipValueFromNode(node, labelFormatters, valueFormatter, percentFormatter, currentShapeViewModel, id),\n          );\n          node = node[PARENT_KEY];\n        }\n        return values.reverse();\n      }),\n  };\n}\n\nfunction getTooltipValueFromNode(\n  node: ArrayNode,\n  labelFormatters: (LabelAccessor | undefined)[],\n  valueFormatter: ValueFormatter,\n  percentFormatter: ValueFormatter,\n  shapeViewModel: ShapeViewModel,\n  id: SpecId,\n): TooltipValue {\n  const depth = node[DEPTH_KEY];\n  const value = node[AGGREGATE_KEY];\n  const dataName = getNodeName(node);\n  const formatter = labelFormatters[depth - 1];\n  const model = shapeViewModel.quadViewModel.find(\n    (d) => d.depth === depth && d.dataName === dataName && d.value === value,\n  );\n  return {\n    label: formatter ? formatter(dataName) : dataName,\n    color: model?.fillColor ?? 'transparent',\n    isHighlighted: false,\n    isVisible: true,\n    seriesIdentifier: {\n      specId: id,\n      key: model?.dataName ?? '',\n    },\n    value: node[AGGREGATE_KEY],\n    formattedValue: `${valueFormatter(value)}\\u00A0(${percentFormatter(percentValueGetter(node))})`,\n    valueAccessor: node[DEPTH_KEY],\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BackgroundStyle } from './../../../../utils/themes/theme';\nimport { shapeViewModel } from './viewmodel';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { PartitionStyle } from '../../../../utils/themes/partition';\nimport { Layer, PartitionSpec } from '../../specs';\nimport { VALUE_GETTERS } from '../config';\nimport {\n  PartitionSmallMultiplesModel,\n  RawTextGetter,\n  ShapeTreeNode,\n  ShapeViewModel,\n  ValueGetter,\n} from '../types/viewmodel_types';\nimport { DEPTH_KEY, HierarchyOfArrays } from '../utils/group_by_rollup';\n\nfunction rawTextGetter(layers: Layer[]): RawTextGetter {\n  return (node: ShapeTreeNode) => {\n    const accessorFn = layers[node[DEPTH_KEY] - 1]?.nodeLabel || ((d) => d);\n    return `${accessorFn(node.dataName)}`;\n  };\n}\n\n/** @internal */\nexport function valueGetterFunction(valueGetter: ValueGetter) {\n  return typeof valueGetter === 'function' ? valueGetter : VALUE_GETTERS[valueGetter];\n}\n\n/** @internal */\nexport function getShapeViewModel(\n  spec: PartitionSpec,\n  parentDimensions: Dimensions,\n  tree: HierarchyOfArrays,\n  backgroundStyle: BackgroundStyle,\n  style: PartitionStyle,\n  panelModel: PartitionSmallMultiplesModel,\n): ShapeViewModel {\n  return withTextMeasure((measureText) => {\n    return shapeViewModel(\n      measureText,\n      spec,\n      style,\n      parentDimensions,\n      rawTextGetter(spec.layers),\n      valueGetterFunction(spec.valueGetter),\n      tree,\n      backgroundStyle,\n      panelModel,\n    );\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  fillTextLayout,\n  getRectangleRowGeometry,\n  getSectorRowGeometry,\n  inSectorRotation,\n  nodeId,\n} from './fill_text_layout';\nimport { linkTextLayout } from './link_text_layout';\nimport { colorToRgba, RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Colors } from '../../../../common/colors';\nimport { TAU } from '../../../../common/constants';\nimport { fillTextColor } from '../../../../common/fill_text_color';\nimport {\n  Distance,\n  meanAngle,\n  Pixels,\n  PointTuple,\n  Radius,\n  trueBearingToStandardPositionAngle,\n} from '../../../../common/geometry';\nimport { Part } from '../../../../common/text_utils';\nimport { GroupByAccessor } from '../../../../specs';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { ColorVariant, StrokeStyle } from '../../../../utils/common';\nimport { Size } from '../../../../utils/dimensions';\nimport { Logger } from '../../../../utils/logger';\nimport { FillLabelConfig, PartitionStyle } from '../../../../utils/themes/partition';\nimport { BackgroundStyle } from '../../../../utils/themes/theme';\nimport { Layer, PartitionSpec } from '../../specs';\nimport { MODEL_KEY, percentValueGetter } from '../config';\nimport { PartitionLayout } from '../types/config_types';\nimport {\n  nullShapeViewModel,\n  OutsideLinksViewModel,\n  PartitionSmallMultiplesModel,\n  PickFunction,\n  QuadViewModel,\n  RawTextGetter,\n  RowSet,\n  ShapeTreeNode,\n  ShapeViewModel,\n  ValueGetterFunction,\n} from '../types/viewmodel_types';\nimport { ringSectorConstruction } from '../utils/circline_geometry';\nimport {\n  aggregateAccessor,\n  ArrayEntry,\n  CHILDREN_KEY,\n  depthAccessor,\n  entryKey,\n  entryValue,\n  HierarchyOfArrays,\n  mapEntryValue,\n  parentAccessor,\n  pathAccessor,\n  SORT_INDEX_KEY,\n  sortIndexAccessor,\n} from '../utils/group_by_rollup';\nimport { sunburst } from '../utils/sunburst';\nimport { getTopPadding, LayerLayout, treemap } from '../utils/treemap';\nimport { waffle } from '../utils/waffle';\n\n/** @internal */\nexport const isMosaic = (p: PartitionLayout | undefined) => p === PartitionLayout.mosaic;\n\n/** @internal */\nexport const isTreemap = (p: PartitionLayout | undefined) => p === PartitionLayout.treemap;\n\n/** @internal */\nexport const isSunburst = (p: PartitionLayout | undefined) => p === PartitionLayout.sunburst;\n\n/** @internal */\nexport const isIcicle = (p: PartitionLayout | undefined) => p === PartitionLayout.icicle;\n\n/** @internal */\nexport const isFlame = (p: PartitionLayout | undefined) => p === PartitionLayout.flame;\n\n/** @internal */\nexport const isWaffle = (p: PartitionLayout | undefined) => p === PartitionLayout.waffle;\n\n/** @internal */\nexport const isLinear = (p: PartitionLayout | undefined) => isFlame(p) || isIcicle(p);\n\n/** @internal */\nexport const isSimpleLinear = (layout: PartitionLayout, fillLabel: FillLabelConfig, layers: Layer[]) =>\n  isLinear(layout) && layers.every((l) => l.fillLabel?.clipText ?? fillLabel?.clipText);\n\nfunction grooveAccessor(n: ArrayEntry) {\n  return entryValue(n).depth > 1 ? 1 : [0, 2][entryValue(n).depth] ?? NaN;\n}\n\nfunction topGrooveAccessor(topGroovePx: Pixels) {\n  return (n: ArrayEntry) => (entryValue(n).depth > 0 ? topGroovePx : grooveAccessor(n));\n}\n\nfunction rectangleFillOrigins(n: ShapeTreeNode): PointTuple {\n  return [(n.x0 + n.x1) / 2, (n.y0 + n.y1) / 2];\n}\n\n/**\n * @internal\n */\nexport const ringSectorInnerRadius = (n: ShapeTreeNode): Radius => n.y0px;\n\n/**\n * @internal\n */\nexport const ringSectorOuterRadius = (n: ShapeTreeNode): Radius => n.y1px;\n\n/**\n * @internal\n */\nexport const ringSectorMiddleRadius = (n: ShapeTreeNode): Radius => n.yMidPx;\n\nfunction sectorFillOrigins(fillOutside: boolean) {\n  return (node: ShapeTreeNode): [number, number] => {\n    const midAngle = (node.x0 + node.x1) / 2;\n    const divider = 10;\n    const innerBias = fillOutside ? 9 : 1;\n    const outerBias = divider - innerBias;\n    const radius = (innerBias * ringSectorInnerRadius(node) + outerBias * ringSectorOuterRadius(node)) / divider;\n    const cx = Math.cos(trueBearingToStandardPositionAngle(midAngle)) * radius;\n    const cy = Math.sin(trueBearingToStandardPositionAngle(midAngle)) * radius;\n    return [cx, cy];\n  };\n}\n\nconst minRectHeightForText: Pixels = 8;\n\n/** @internal */\nexport function makeQuadViewModel(\n  childNodes: ShapeTreeNode[],\n  layers: Layer[],\n  sectorLineWidth: Pixels,\n  sectorLineStroke: StrokeStyle,\n  smAccessorValue: ReturnType<GroupByAccessor>,\n  index: number,\n  innerIndex: number,\n  fillLabel: FillLabelConfig,\n  { color: backgroundColor, fallbackColor: fallbackBGColor }: BackgroundStyle,\n): QuadViewModel[] {\n  if (colorToRgba(backgroundColor)[3] < 1) {\n    // Override handled in fill_text_color.ts\n    Logger.expected(\n      'Text contrast requires an opaque background color, using fallbackColor',\n      'an opaque color',\n      backgroundColor,\n    );\n  }\n  return childNodes.map((node) => {\n    const layer = layers[node.depth - 1];\n    const fill = layer?.shape?.fillColor ?? RGBATupleToString(Colors.DarkOpaqueRed.rgba);\n    const entry = node[MODEL_KEY][CHILDREN_KEY][node[SORT_INDEX_KEY]];\n    const fillColor = !entry\n      ? RGBATupleToString(Colors.DarkOpaqueRed.rgba)\n      : typeof fill === 'function'\n        ? fill(node.dataName, node.sortIndex, entryValue(entry), node[MODEL_KEY].children)\n        : fill;\n    const strokeWidth = sectorLineWidth;\n    const strokeStyle = sectorLineStroke;\n    const textNegligible = node.y1px - node.y0px < minRectHeightForText;\n    const textColor = textNegligible\n      ? Colors.Transparent.keyword\n      : fillLabel.textColor === ColorVariant.Adaptive\n        ? fillTextColor(fallbackBGColor, fillColor, backgroundColor).color.keyword\n        : fillLabel.textColor;\n\n    return { index, innerIndex, smAccessorValue, strokeWidth, strokeStyle, fillColor, textColor, ...node };\n  });\n}\n\n/** @internal */\nexport function makeOutsideLinksViewModel(\n  outsideFillNodes: ShapeTreeNode[],\n  rowSets: RowSet[],\n  linkLabelRadiusPadding: Distance,\n): OutsideLinksViewModel[] {\n  return outsideFillNodes\n    .map<OutsideLinksViewModel>((node, i: number) => {\n      const rowSet = rowSets[i];\n      if (!rowSet?.rows.reduce((p, row) => p + row.rowWords.length, 0)) return { points: [] };\n      const radius = ringSectorOuterRadius(node);\n      const midAngle = trueBearingToStandardPositionAngle(meanAngle(node.x0, node.x1));\n      const cos = Math.cos(midAngle);\n      const sin = Math.sin(midAngle);\n      const x0 = cos * radius;\n      const y0 = sin * radius;\n      const x = cos * (radius + linkLabelRadiusPadding);\n      const y = sin * (radius + linkLabelRadiusPadding);\n      return {\n        points: [\n          [x0, y0],\n          [x, y],\n        ],\n      };\n    })\n    .filter(({ points }: OutsideLinksViewModel) => points.length > 1);\n}\n\n/** @internal */\nexport interface RectangleConstruction {\n  x0: Pixels;\n  x1: Pixels;\n  y0: Pixels;\n  y1: Pixels;\n}\n\nfunction rectangleConstruction(treeHeight: number, topGroove: number | null) {\n  return function rectangleConstructionClosure(node: ShapeTreeNode): RectangleConstruction {\n    return node.depth < treeHeight && topGroove !== null\n      ? {\n          x0: node.x0,\n          y0: node.y0px,\n          x1: node.x1,\n          y1: node.y0px + getTopPadding(topGroove, node.y1px - node.y0px),\n        }\n      : {\n          x0: node.x0,\n          y0: node.y0px,\n          x1: node.x1,\n          y1: node.y1px,\n        };\n  };\n}\n\nconst rawChildNodes = (\n  partitionLayout: PartitionLayout,\n  tree: HierarchyOfArrays,\n  topGroove: number,\n  width: number,\n  height: number,\n  clockwiseSectors: boolean,\n  specialFirstInnermostSector: boolean,\n  maxDepth: number,\n): Array<Part> => {\n  const totalValue = tree.reduce((p: number, n: ArrayEntry): number => p + mapEntryValue(n), 0);\n  switch (partitionLayout) {\n    case PartitionLayout.sunburst:\n      const sunburstValueToAreaScale = TAU / totalValue;\n      const sunburstAreaAccessor = (e: ArrayEntry) => sunburstValueToAreaScale * mapEntryValue(e);\n      return sunburst(tree, sunburstAreaAccessor, { x0: 0, y0: -1 }, clockwiseSectors, specialFirstInnermostSector);\n\n    case PartitionLayout.treemap:\n    case PartitionLayout.mosaic:\n      const treemapInnerArea = width * height; // assuming 1 x 1 unit square\n      const treemapValueToAreaScale = treemapInnerArea / totalValue;\n      const treemapAreaAccessor = (e: ArrayEntry) => treemapValueToAreaScale * mapEntryValue(e);\n      return treemap(\n        tree,\n        treemapAreaAccessor,\n        topGrooveAccessor(topGroove),\n        grooveAccessor,\n        {\n          x0: 0,\n          y0: 0,\n          width,\n          height,\n        },\n        isMosaic(partitionLayout) ? [LayerLayout.vertical, LayerLayout.horizontal] : [],\n      );\n\n    case PartitionLayout.waffle:\n      return waffle(tree, totalValue, {\n        x0: 0,\n        y0: 0,\n        width,\n        height,\n      });\n\n    case PartitionLayout.icicle:\n    case PartitionLayout.flame:\n      const icicleLayout = isIcicle(partitionLayout);\n      const icicleValueToAreaScale = width / totalValue;\n      const icicleAreaAccessor = (e: ArrayEntry) => icicleValueToAreaScale * mapEntryValue(e);\n      const icicleRowHeight = height / (maxDepth - 1);\n      const result = sunburst(tree, icicleAreaAccessor, { x0: 0, y0: -icicleRowHeight }, true, false, icicleRowHeight);\n      return icicleLayout\n        ? result\n        : result.map(({ y0, y1, ...rest }) => ({ y0: height - y1, y1: height - y0, ...rest }));\n\n    default:\n      // Let's ensure TS complains if we add a new PartitionLayout type in the future without creating a `case` for it\n      // Hopefully, a future TS version will do away with the need for this boilerplate `default`. Now TS even needs a `default` even if all possible cases are covered.\n      // Even in runtime it does something sensible (returns the empty set); explicit throwing is avoided as it can deopt the function\n      return ((layout: never) => layout ?? [])(partitionLayout);\n  }\n};\n\n/** @internal */\nexport function shapeViewModel(\n  textMeasure: TextMeasure,\n  spec: PartitionSpec,\n  style: PartitionStyle,\n  chartDimensions: Size,\n  rawTextGetter: RawTextGetter,\n  valueGetter: ValueGetterFunction,\n  tree: HierarchyOfArrays,\n  backgroundStyle: BackgroundStyle,\n  panelModel: PartitionSmallMultiplesModel,\n): ShapeViewModel {\n  const {\n    layout,\n    layers,\n    topGroove,\n    valueFormatter: specifiedValueFormatter,\n    percentFormatter: specifiedPercentFormatter,\n    fillOutside,\n    clockwiseSectors,\n    maxRowCount,\n    specialFirstInnermostSector,\n    animation,\n  } = spec;\n  const { emptySizeRatio, outerSizeRatio, linkLabel, minFontSize, sectorLineWidth, sectorLineStroke, fillLabel } =\n    style;\n  const { width, height } = chartDimensions;\n  const { marginLeftPx, marginTopPx, panel } = panelModel;\n\n  const treemapLayout = isTreemap(layout);\n  const mosaicLayout = isMosaic(layout);\n  const sunburstLayout = isSunburst(layout);\n  const icicleLayout = isIcicle(layout);\n  const flameLayout = isFlame(layout);\n  const simpleLinear = isSimpleLinear(layout, fillLabel, layers);\n  const waffleLayout = isWaffle(layout);\n\n  const diskCenter = isSunburst(layout)\n    ? {\n        x: marginLeftPx + panel.innerWidth / 2,\n        y: marginTopPx + panel.innerHeight / 2,\n      }\n    : {\n        x: marginLeftPx,\n        y: marginTopPx,\n      };\n\n  // use the smaller of the two sizes, as a circle fits into a square\n  const circleMaximumSize = Math.min(\n    panel.innerWidth,\n    panel.innerHeight - (panel.title.length > 0 ? panel.fontSize * 2 : 0),\n  );\n  const outerRadius: Radius = Math.min(outerSizeRatio * circleMaximumSize, circleMaximumSize - sectorLineWidth) / 2;\n  // don't render anything if the total, the width or height is not positive\n  if (!(width > 0) || !(height > 0) || tree.length === 0 || outerRadius <= 0) {\n    return nullShapeViewModel(layout, style, diskCenter);\n  }\n\n  const longestPath = (entry?: ArrayEntry): number => {\n    const [, node] = entry ?? [];\n    if (!node) return NaN; // should never happen\n    const { children, path } = node;\n    return children.length > 0 ? children.reduce((p, n) => Math.max(p, longestPath(n)), 0) : path.length;\n  };\n\n  const maxDepth = longestPath(tree[0]) - 2; // don't include the root node\n  const childNodes = rawChildNodes(\n    layout,\n    tree,\n    topGroove,\n    panel.innerWidth,\n    panel.innerHeight,\n    clockwiseSectors,\n    specialFirstInnermostSector,\n    maxDepth,\n  );\n\n  const shownChildNodes = childNodes.filter((n: Part) => {\n    const layerIndex = entryValue(n.node).depth - 1;\n    const layer = layers[layerIndex];\n    return !layer || !layer.showAccessor || layer.showAccessor(entryKey(n.node));\n  });\n\n  const innerRadius: Radius = outerRadius - (1 - emptySizeRatio) * outerRadius;\n  const treeHeight = shownChildNodes.reduce((p: number, n: Part) => Math.max(p, entryValue(n.node).depth), 0); // 1: pie, 2: two-ring donut etc.\n  const ringThickness = (outerRadius - innerRadius) / treeHeight;\n  const partToShapeFn = partToShapeTreeNode(!sunburstLayout, innerRadius, ringThickness);\n  const quadViewModel = makeQuadViewModel(\n    shownChildNodes.slice(1).map(partToShapeFn),\n    layers,\n    sectorLineWidth,\n    sectorLineStroke,\n    panelModel.smAccessorValue,\n    panelModel.index,\n    panelModel.innerIndex,\n    fillLabel,\n    backgroundStyle,\n  );\n\n  // fill text\n  const roomCondition = (n: ShapeTreeNode) => {\n    const diff = n.x1 - n.x0;\n    return sunburstLayout\n      ? (diff < 0 ? TAU + diff : diff) * ringSectorMiddleRadius(n) > Math.max(minFontSize, linkLabel.maximumSection)\n      : n.x1 - n.x0 > minFontSize && n.y1px - n.y0px > minFontSize;\n  };\n\n  const nodesWithRoom = quadViewModel.filter(roomCondition);\n  const outsideFillNodes = fillOutside && sunburstLayout ? nodesWithRoom : [];\n\n  const textFillOrigins = nodesWithRoom.map(sunburstLayout ? sectorFillOrigins(fillOutside) : rectangleFillOrigins);\n\n  const valueFormatter = valueGetter === percentValueGetter ? specifiedPercentFormatter : specifiedValueFormatter;\n\n  const getRowSets = sunburstLayout\n    ? fillTextLayout(\n        ringSectorConstruction(spec, style, innerRadius, ringThickness),\n        getSectorRowGeometry,\n        inSectorRotation(style.horizontalTextEnforcer, style.horizontalTextAngleThreshold),\n      )\n    : simpleLinear || waffleLayout\n      ? () => [] // no multirow layout needed for simpleLinear partitions; no text at all for waffles\n      : fillTextLayout(\n          rectangleConstruction(treeHeight, treemapLayout || mosaicLayout ? topGroove : null),\n          getRectangleRowGeometry,\n          () => 0,\n        );\n\n  const rowSets: RowSet[] = getRowSets(\n    textMeasure,\n    rawTextGetter,\n    valueGetter,\n    valueFormatter,\n    nodesWithRoom,\n    style,\n    layers,\n    textFillOrigins,\n    maxRowCount,\n    !sunburstLayout,\n    !(treemapLayout || mosaicLayout),\n  );\n\n  // whiskers (ie. just lines, no text) for fill text outside the outer radius\n  const outsideLinksViewModel = makeOutsideLinksViewModel(outsideFillNodes, rowSets, linkLabel.radiusPadding);\n\n  // linked text\n  const currentY = [-height, -height, -height, -height];\n\n  const nodesWithoutRoom =\n    fillOutside || treemapLayout || mosaicLayout || icicleLayout || flameLayout || waffleLayout\n      ? [] // outsideFillNodes and linkLabels are in inherent conflict due to very likely overlaps\n      : quadViewModel.filter((n: ShapeTreeNode) => {\n          const id = nodeId(n);\n          const foundInFillText = rowSets.find((r: RowSet) => r.id === id);\n          // successful text render if found, and has some row(s)\n          return !(foundInFillText && foundInFillText.rows.length > 0);\n        });\n  const maxLinkedLabelTextLength = style.linkLabel.maxTextLength;\n  const linkLabelViewModels = linkTextLayout(\n    panel.innerWidth,\n    panel.innerHeight,\n    textMeasure,\n    style,\n    nodesWithoutRoom,\n    currentY,\n    outerRadius,\n    rawTextGetter,\n    valueGetter,\n    valueFormatter,\n    maxLinkedLabelTextLength,\n    {\n      x: width * panelModel.left + panel.innerWidth / 2,\n      y: height * panelModel.top + panel.innerHeight / 2,\n    },\n    backgroundStyle,\n  );\n\n  const pickQuads: PickFunction = sunburstLayout\n    ? (x, y) => {\n        return quadViewModel.filter(({ x0, y0px, x1, y1px }) => {\n          const angleX = (Math.atan2(y, x) + TAU / 4 + TAU) % TAU;\n          const yPx = Math.hypot(x, y);\n          return x0 <= angleX && angleX <= x1 && y0px <= yPx && yPx <= y1px;\n        });\n      }\n    : (x, y, { currentFocusX0, currentFocusX1 }) => {\n        return quadViewModel.filter(({ x0, y0px, x1, y1px }) => {\n          const scale = width / (currentFocusX1 - currentFocusX0);\n          const fx0 = Math.max((x0 - currentFocusX0) * scale, 0);\n          const fx1 = Math.min((x1 - currentFocusX0) * scale, width);\n          return fx0 <= x && x < fx1 && y0px < y && y <= y1px;\n        });\n      };\n\n  // combined viewModel\n  return {\n    layout,\n    smAccessorValue: panelModel.smAccessorValue,\n    index: panelModel.index,\n    innerIndex: panelModel.innerIndex,\n    width: panelModel.width,\n    height: panelModel.height,\n    top: panelModel.top,\n    left: panelModel.left,\n    innerRowCount: panelModel.innerRowCount,\n    innerColumnCount: panelModel.innerColumnCount,\n    innerRowIndex: panelModel.innerRowIndex,\n    innerColumnIndex: panelModel.innerColumnIndex,\n    marginLeftPx: panelModel.marginLeftPx,\n    marginTopPx: panelModel.marginTopPx,\n    panel: {\n      ...panelModel.panel,\n    },\n    style,\n    layers,\n    diskCenter,\n    quadViewModel,\n    rowSets,\n    linkLabelViewModels,\n    outsideLinksViewModel,\n    pickQuads,\n    outerRadius,\n    chartDimensions,\n    animation,\n  };\n}\n\nfunction partToShapeTreeNode(treemapLayout: boolean, innerRadius: Radius, ringThickness: number) {\n  return ({ node, x0, x1, y0, y1 }: Part): ShapeTreeNode => ({\n    dataName: entryKey(node),\n    depth: depthAccessor(node),\n    value: aggregateAccessor(node),\n    [MODEL_KEY]: parentAccessor(node),\n    sortIndex: sortIndexAccessor(node),\n    path: pathAccessor(node),\n    x0,\n    x1,\n    y0,\n    y1,\n    y0px: treemapLayout ? y0 : innerRadius + y0 * ringThickness,\n    y1px: treemapLayout ? y1 : innerRadius + y1 * ringThickness,\n    yMidPx: treemapLayout ? (y0 + y1) / 2 : innerRadius + ((y0 + y1) / 2) * ringThickness,\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnimationState, ContinuousDomainFocus } from './partition';\nimport { Colors } from '../../../../common/colors';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\n\nconst linear = (x: number) => x;\nconst easeInOut = (alpha: number) => (x: number) => x ** alpha / (x ** alpha + (1 - x) ** alpha);\n\nconst MAX_PADDING_RATIO = 0.25;\n\n/** @internal */\nexport function renderLinearPartitionCanvas2d(\n  ctx: CanvasRenderingContext2D,\n  dpr: number,\n  {\n    style: { sectorLineWidth: padding },\n    quadViewModel,\n    diskCenter,\n    width: panelWidth,\n    height: panelHeight,\n    layers,\n    chartDimensions: { width: containerWidth, height: containerHeight },\n    animation,\n  }: ShapeViewModel,\n  { currentFocusX0, currentFocusX1, prevFocusX0, prevFocusX1 }: ContinuousDomainFocus,\n  animationState: AnimationState,\n) {\n  if (animation?.duration) {\n    window.cancelAnimationFrame(animationState.rafId);\n    render(0);\n    const focusChanged = currentFocusX0 !== prevFocusX0 || currentFocusX1 !== prevFocusX1;\n    if (focusChanged) {\n      animationState.rafId = window.requestAnimationFrame((epochStartTime) => {\n        const anim = (t: number) => {\n          const unitNormalizedTime = Math.max(0, Math.min(1, (t - epochStartTime) / animation.duration));\n          render(unitNormalizedTime);\n          if (unitNormalizedTime < 1) {\n            animationState.rafId = window.requestAnimationFrame(anim);\n          }\n        };\n        animationState.rafId = window.requestAnimationFrame(anim);\n      });\n    }\n  } else {\n    render(1);\n  }\n\n  function render(\n    logicalTime: number,\n    timeFunction: (time: number) => number = animation?.duration\n      ? easeInOut(Math.min(5, animation.duration / 100))\n      : linear,\n  ) {\n    const width = containerWidth * panelWidth;\n    const height = containerHeight * panelHeight;\n    const t = timeFunction(logicalTime);\n    const focusX0 = t * currentFocusX0 + (1 - t) * prevFocusX0 || 0;\n    const focusX1 = t * currentFocusX1 + (1 - t) * prevFocusX1 || 0;\n    const scale = containerWidth / (focusX1 - focusX0);\n\n    ctx.save();\n    ctx.textAlign = 'left';\n    ctx.textBaseline = 'middle';\n    ctx.scale(dpr, dpr);\n    ctx.translate(diskCenter.x, diskCenter.y);\n    ctx.clearRect(0, 0, width, height);\n\n    quadViewModel.forEach(({ fillColor, x0, x1, y0px: y0, y1px: y1, dataName, textColor, depth }) => {\n      if (y1 - y0 <= padding) return;\n\n      const fx0 = Math.max((x0 - focusX0) * scale, 0);\n      const fx1 = Math.min((x1 - focusX0) * scale, width);\n\n      if (fx1 < 0 || fx0 > width) return;\n\n      const layer = layers[depth - 1]; // depth === 0 corresponds to root layer (above API `layers`)\n      const formatter = layer?.nodeLabel ?? String;\n\n      const label = formatter(dataName);\n      const fWidth = fx1 - fx0;\n      const fPadding = Math.min(padding, MAX_PADDING_RATIO * fWidth);\n\n      ctx.fillStyle = fillColor;\n      ctx.beginPath();\n      ctx.rect(fx0 + fPadding, y0 + padding / 2, fWidth - fPadding, y1 - y0 - padding);\n      ctx.fill();\n      if (textColor === Colors.Transparent.keyword || label === '' || fWidth < 4) return;\n      ctx.fillStyle = textColor;\n      ctx.save();\n      ctx.clip(); // undoing a clip needs context save/restore, which is why it's wrapped in a save/restore\n      ctx.fillText(label, fx0 + 3 * fPadding, (y0 + y1) / 2);\n      ctx.restore();\n    });\n\n    ctx.restore();\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Color } from '../../../../common/colors';\nimport { TAU } from '../../../../common/constants';\nimport { Pixels } from '../../../../common/geometry';\nimport { cssFontShorthand, HorizontalAlignment } from '../../../../common/text_utils';\nimport { renderLayers, withContext } from '../../../../renderers/canvas';\nimport { MIN_STROKE_WIDTH } from '../../../xy_chart/renderer/canvas/primitives/line';\nimport {\n  LinkLabelVM,\n  OutsideLinksViewModel,\n  QuadViewModel,\n  RowBox,\n  RowSet,\n  ShapeViewModel,\n  TextRow,\n} from '../../layout/types/viewmodel_types';\nimport { LinkLabelsViewModelSpec } from '../../layout/viewmodel/link_text_layout';\nimport { isSunburst } from '../../layout/viewmodel/viewmodel';\n\n// the burnout avoidance in the center of the pie\nconst LINE_WIDTH_MULT = 10; // border can be a maximum 1/LINE_WIDTH_MULT - th of the sector angle, otherwise the border would dominate\nconst TAPER_OFF_LIMIT = 50; // taper off within a radius of TAPER_OFF_LIMIT to avoid burnout in the middle of the pie when there are hundreds of pies\n\nconst getCurrentRowX = (row: TextRow, horizontalAlignment: HorizontalAlignment, rotation: number) => {\n  // TODO account for text rotation if needed\n  const rowLength = Math.cos(rotation) * row.length;\n  const offset =\n    horizontalAlignment === HorizontalAlignment.left\n      ? -row.maximumLength / 2\n      : horizontalAlignment === HorizontalAlignment.right\n        ? row.maximumLength / 2 - rowLength\n        : -rowLength / 2;\n  return row.rowAnchorX + offset;\n};\n\nconst getFillTextXOffset = (box: RowBox, rowLength: number, isRTL: boolean) => {\n  // TODO account for text rotation if needed\n  return isRTL ? rowLength - box.width / 2 - box.wordBeginning : box.width / 2 + box.wordBeginning;\n};\n\nfunction renderTextRow(\n  ctx: CanvasRenderingContext2D,\n  { fontSize, fillTextColor, rotation, verticalAlignment, horizontalAlignment, container, clipText, isRTL }: RowSet,\n  linkLabelTextColor: string,\n) {\n  return (currentRow: TextRow) => {\n    const crx = getCurrentRowX(currentRow, horizontalAlignment, rotation);\n    const cry = -currentRow.rowAnchorY + (Math.sin(rotation) * currentRow.length) / 2;\n    if (!Number.isFinite(crx) || !Number.isFinite(cry)) {\n      return;\n    }\n\n    withContext(ctx, () => {\n      ctx.scale(1, -1);\n      if (clipText) {\n        ctx.rect(container.x0 + 1, container.y0 + 1, container.x1 - container.x0 - 2, container.y1 - container.y0 - 2);\n        ctx.clip();\n      }\n      ctx.beginPath();\n      ctx.translate(crx, cry);\n      ctx.rotate(-rotation);\n      ctx.fillStyle = fillTextColor ?? linkLabelTextColor;\n      ctx.textBaseline = verticalAlignment;\n      ctx.direction = isRTL ? 'rtl' : 'ltr'; // used for mixed charsets\n\n      currentRow.rowWords.forEach((box) => {\n        if (box.isValue) ctx.direction = 'ltr'; // force value text direction\n        ctx.font = cssFontShorthand(box, fontSize);\n        ctx.fillText(box.text, getFillTextXOffset(box, currentRow.length, isRTL), 0);\n      });\n      ctx.closePath();\n    });\n    // for debug use: this draws magenta boxes for where the text needs to fit\n    // note: `container` is a property of the RowSet, needs to be added\n    // withContext(ctx, () => {\n    //   ctx.scale(1, -1);\n    //   ctx.rotate(-rotation);\n    //   ctx.beginPath();\n    //   ctx.strokeStyle = 'magenta';\n    //   ctx.fillStyle = 'magenta';\n    //   ctx.lineWidth = 1;\n    //   ctx.rect(container.x0 + 1, container.y0 + 1, container.x1 - container.x0 - 2, container.y1 - container.y0 - 2);\n    //   ctx.stroke();\n    // });\n  };\n}\n\nfunction renderTextRows(ctx: CanvasRenderingContext2D, rowSet: RowSet, linkLabelTextColor: string) {\n  rowSet.rows.forEach(renderTextRow(ctx, rowSet, linkLabelTextColor));\n}\n\nfunction renderRowSets(ctx: CanvasRenderingContext2D, rowSets: RowSet[], linkLabelTextColor: string) {\n  rowSets.forEach((rowSet: RowSet) => renderTextRows(ctx, rowSet, linkLabelTextColor));\n}\n\nfunction renderTaperedBorder(\n  ctx: CanvasRenderingContext2D,\n  { strokeWidth, strokeStyle, fillColor, x0, x1, y0px, y1px }: QuadViewModel,\n) {\n  const X0 = x0 - TAU / 4;\n  const X1 = x1 - TAU / 4;\n  ctx.fillStyle = fillColor;\n  ctx.beginPath();\n  // only draw circular arcs if it would be distinguishable from a straight line ie. angle is not very small\n  ctx.arc(0, 0, y0px, X0, X0);\n  ctx.arc(0, 0, y1px, X0, X1, false);\n  ctx.arc(0, 0, y0px, X1, X0, true);\n\n  ctx.fill();\n  if (strokeWidth > 0.001 && !(x0 === 0 && x1 === TAU)) {\n    // canvas2d uses a default of 1 if the lineWidth is assigned 0, so we use a small value to test, to avoid it\n    // ... and also don't draw a separator if we have a single sector that's the full ring (eg. single-fact-row pie)\n    // outer arc\n    ctx.lineWidth = strokeWidth;\n    const tapered = x1 - x0 < (15 * TAU) / 360; // burnout seems visible, and tapering invisible, with less than 15deg\n    if (tapered) {\n      ctx.beginPath();\n      ctx.arc(0, 0, y1px, X0, X1, false);\n      ctx.stroke();\n\n      // inner arc\n      ctx.beginPath();\n      ctx.arc(0, 0, y0px, X1, X0, true);\n      ctx.stroke();\n\n      ctx.fillStyle = strokeStyle;\n\n      // each side (radial 'line') is modeled as a pentagon (some lines can be short arcs though)\n      ctx.beginPath();\n      const yThreshold = Math.max(TAPER_OFF_LIMIT, (LINE_WIDTH_MULT * strokeWidth) / (X1 - X0));\n      const beta = strokeWidth / yThreshold; // angle where strokeWidth equals the lineWidthMult limit at a radius of yThreshold\n      ctx.arc(0, 0, y0px, X0, X0 + beta * (yThreshold / y0px));\n      ctx.arc(0, 0, Math.min(yThreshold, y1px), X0 + beta, X0 + beta);\n      ctx.arc(0, 0, y1px, X0 + beta * (yThreshold / y1px), X0, true);\n      ctx.arc(0, 0, y0px, X0, X0);\n      ctx.fill();\n    } else {\n      ctx.strokeStyle = strokeStyle;\n      ctx.stroke();\n    }\n  }\n}\n\nfunction renderSectors(ctx: CanvasRenderingContext2D, quadViewModel: QuadViewModel[]) {\n  withContext(ctx, () => {\n    ctx.scale(1, -1); // D3 and Canvas2d use a left-handed coordinate system (+y = down) but the ViewModel uses +y = up, so we must locally invert Y\n    quadViewModel.forEach((quad: QuadViewModel) => {\n      if (quad.x0 !== quad.x1) renderTaperedBorder(ctx, quad);\n    });\n  });\n}\n\nfunction renderRectangles(ctx: CanvasRenderingContext2D, quadViewModel: QuadViewModel[]) {\n  withContext(ctx, () => {\n    ctx.scale(1, -1); // D3 and Canvas2d use a left-handed coordinate system (+y = down) but the ViewModel uses +y = up, so we must locally invert Y\n    quadViewModel.forEach(({ strokeWidth, fillColor, x0, x1, y0px, y1px }) => {\n      // only draw a shape if it would show up at all\n      if (x1 - x0 >= 1 && y1px - y0px >= 1) {\n        ctx.fillStyle = fillColor;\n        ctx.beginPath();\n        ctx.moveTo(x0, y0px);\n        ctx.lineTo(x0, y1px);\n        ctx.lineTo(x1, y1px);\n        ctx.lineTo(x1, y0px);\n        ctx.lineTo(x0, y0px);\n        ctx.fill();\n        if (strokeWidth > MIN_STROKE_WIDTH) {\n          // Canvas2d stroke ignores an exact zero line width\n          ctx.lineWidth = strokeWidth;\n          ctx.stroke();\n        }\n      }\n    });\n  });\n}\n\nfunction renderFillOutsideLinks(\n  ctx: CanvasRenderingContext2D,\n  outsideLinksViewModel: OutsideLinksViewModel[],\n  linkLabelTextColor: string,\n  linkLabelLineWidth: Pixels,\n) {\n  withContext(ctx, () => {\n    ctx.lineWidth = linkLabelLineWidth;\n    ctx.strokeStyle = linkLabelTextColor;\n    outsideLinksViewModel.forEach(({ points }) => {\n      ctx.beginPath();\n\n      points.forEach(([x, y], index) => {\n        return index === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);\n      });\n\n      ctx.stroke();\n    });\n  });\n}\n\nfunction getLinkTextXOffset(\n  { textAlign, width, valueWidth, isRTL }: Pick<LinkLabelVM, 'textAlign' | 'width' | 'valueWidth' | 'isRTL'>,\n  labelValueGap: number,\n): [label: number, value: number] {\n  const isRightAligned = textAlign === HorizontalAlignment.right;\n  const multiplier = isRightAligned ? -1 : 1;\n  const isAligned = isRightAligned === isRTL;\n  const to = multiplier * (labelValueGap + (isAligned ? width : valueWidth));\n  return isAligned ? [0, to] : [to, 0];\n}\n\nfunction renderLinkLabels(\n  ctx: CanvasRenderingContext2D,\n  linkLabelFontSize: Pixels,\n  linkLabelLineWidth: Pixels,\n  { linkLabels: allLinkLabels, labelFontSpec, valueFontSpec, strokeColor }: LinkLabelsViewModelSpec,\n  linkLineColor: Color,\n) {\n  const labelColor = RGBATupleToString(colorToRgba(labelFontSpec.textColor));\n  const valueColor = RGBATupleToString(colorToRgba(valueFontSpec.textColor));\n  const labelValueGap = linkLabelFontSize / 2; // one en space\n  withContext(ctx, () => {\n    ctx.lineWidth = linkLabelLineWidth;\n    allLinkLabels.forEach(\n      ({ linkLabels, translate, textAlign, text, valueText, width, valueWidth, isRTL }: LinkLabelVM) => {\n        // label lines\n        ctx.beginPath();\n        ctx.moveTo(...linkLabels[0]);\n        linkLabels.slice(1).forEach((point) => ctx.lineTo(...point));\n        ctx.strokeStyle = strokeColor ?? linkLineColor;\n        ctx.stroke();\n\n        const [labelX, valueX] = getLinkTextXOffset({ textAlign, width, valueWidth, isRTL }, labelValueGap);\n\n        withContext(ctx, () => {\n          ctx.translate(...translate);\n          ctx.scale(1, -1); // flip for text rendering not to be upside down\n          ctx.textAlign = textAlign;\n          // label text\n          ctx.fillStyle = labelColor;\n          ctx.font = cssFontShorthand(labelFontSpec, linkLabelFontSize);\n          ctx.direction = isRTL ? 'rtl' : 'ltr'; // used for mixed charsets\n          ctx.fillText(text, labelX, 0);\n          // value text\n          ctx.fillStyle = valueColor;\n          ctx.font = cssFontShorthand(valueFontSpec, linkLabelFontSize);\n          ctx.direction = 'ltr'; // force value text direction\n          ctx.fillText(valueText, valueX, 0);\n        });\n      },\n    );\n  });\n}\n\nconst midlineOffset = 0.35; // 0.35 is a [common constant](http://tavmjong.free.fr/SVG/TEXT_IN_A_BOX/index.html) representing half height\n\n/** @internal */\nexport function renderPartitionCanvas2d(\n  ctx: CanvasRenderingContext2D,\n  dpr: number,\n  {\n    layout,\n    width,\n    height,\n    style,\n    quadViewModel,\n    rowSets,\n    outsideLinksViewModel,\n    linkLabelViewModels,\n    diskCenter,\n    outerRadius,\n    panel,\n    chartDimensions,\n  }: ShapeViewModel,\n) {\n  const { sectorLineWidth, sectorLineStroke, linkLabel } = style;\n\n  const linkLineColor = linkLabelViewModels.strokeColor;\n\n  withContext(ctx, () => {\n    // set some defaults for the overall rendering\n\n    // let's set the devicePixelRatio once and for all; then we'll never worry about it again\n    ctx.scale(dpr, dpr);\n\n    // all texts are currently center-aligned because\n    //     - the calculations manually compute and lay out text (word) boxes, so we can choose whatever\n    //     - but center/middle has mathematical simplicity and the most unassuming thing\n    //     - due to using the math x/y convention (+y is up) while Canvas uses screen convention (+y is down)\n    //         text rendering must be y-flipped, which is a bit easier this way\n    ctx.textAlign = 'center';\n    ctx.textBaseline = 'bottom';\n\n    // panel titles\n    ctx.font = cssFontShorthand(panel.fontFace, panel.fontSize);\n    ctx.fillStyle = panel.fontFace.textColor;\n    const innerPad = midlineOffset * panel.fontSize; // todo replace it with theme.axisPanelTitle.padding.inner\n    ctx.fillText(\n      panel.title,\n      isSunburst(layout) ? diskCenter.x : diskCenter.x + (chartDimensions.width * width) / 2,\n      isSunburst(layout)\n        ? style.linkLabel.maxCount > 0\n          ? diskCenter.y - (chartDimensions.height * height) / 2 + panel.fontSize\n          : diskCenter.y - outerRadius - innerPad\n        : diskCenter.y + 12,\n    );\n\n    ctx.textBaseline = 'middle';\n\n    ctx.translate(diskCenter.x, diskCenter.y);\n    // this applies the mathematical x/y conversion (+y is North) which is easier when developing geometry\n    // functions - also, all renderers have flexibility (eg. SVG scale) and WebGL NDC is also +y up\n    // - in any case, it's possible to refactor for a -y = North convention if that's deemed preferable\n    ctx.scale(1, -1);\n\n    ctx.lineJoin = 'round';\n    ctx.strokeStyle = sectorLineStroke;\n    ctx.lineWidth = sectorLineWidth;\n\n    // painter's algorithm, like that of SVG: the sequence determines what overdraws what; first element of the array is drawn first\n    // (of course, with SVG, it's for ambiguous situations only, eg. when 3D transforms with different Z values aren't used, but\n    // unlike SVG and esp. WebGL, Canvas2d doesn't support the 3rd dimension well, see ctx.transform / ctx.setTransform).\n    // The layers are callbacks, because of the need to not bake in the `ctx`, it feels more composable and uncoupled this way.\n    renderLayers(ctx, [\n      // bottom layer: sectors (pie slices, ring sectors etc.)\n      () => (isSunburst(layout) ? renderSectors(ctx, quadViewModel) : renderRectangles(ctx, quadViewModel)),\n\n      // all the fill-based, potentially multirow text, whether inside or outside the sector\n      () => renderRowSets(ctx, rowSets, linkLineColor),\n\n      // the link lines for the outside-fill text\n      () => renderFillOutsideLinks(ctx, outsideLinksViewModel, linkLineColor, linkLabel.lineWidth),\n\n      // all the text and link lines for single-row outside texts\n      () => renderLinkLabels(ctx, linkLabel.fontSize, linkLabel.lineWidth, linkLabelViewModels, linkLineColor),\n    ]);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\n\nconst MAX_PADDING_RATIO = 0.25;\n\n/** @internal */\nexport function renderWrappedPartitionCanvas2d(\n  ctx: CanvasRenderingContext2D,\n  dpr: number,\n  {\n    style: { sectorLineWidth: padding },\n    quadViewModel,\n    diskCenter,\n    width: panelWidth,\n    height: panelHeight,\n    chartDimensions: { width: containerWidth, height: containerHeight },\n  }: ShapeViewModel,\n) {\n  const width = containerWidth * panelWidth;\n  const height = containerHeight * panelHeight;\n  const cornerRatio = 0.2;\n\n  ctx.save();\n  ctx.textAlign = 'left';\n  ctx.textBaseline = 'middle';\n  ctx.lineCap = 'round';\n  ctx.lineJoin = 'round';\n  ctx.scale(dpr, dpr);\n  ctx.translate(diskCenter.x, diskCenter.y);\n  ctx.clearRect(0, 0, width, height);\n\n  quadViewModel.forEach(({ fillColor, x0, x1, y0px: y0, y1px: y1 }) => {\n    if (y1 - y0 <= padding) return;\n\n    const fWidth = x1 - x0;\n    const fPadding = Math.min(padding, MAX_PADDING_RATIO * fWidth);\n    const w = fWidth - fPadding;\n    const h = y1 - y0 - padding;\n    const x = x0 + fPadding;\n    const y = y0 + padding / 2;\n    const r = cornerRatio * Math.min(w, h);\n\n    ctx.fillStyle = fillColor;\n\n    ctx.beginPath();\n    ctx.moveTo(x + r, y);\n    ctx.arcTo(x + w, y, x + w, y + h, r);\n    ctx.arcTo(x + w, y + h, x, y + h, r);\n    ctx.arcTo(x, y + h, x, y, r);\n    ctx.arcTo(x, y, x + w, y, r);\n    ctx.closePath();\n    ctx.fill();\n  });\n\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { MouseEvent, RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { renderLinearPartitionCanvas2d } from './canvas_linear_renderers';\nimport { renderPartitionCanvas2d } from './canvas_renderers';\nimport { renderWrappedPartitionCanvas2d } from './canvas_wrapped_renderers';\nimport { Color, Colors } from '../../../../common/colors';\nimport { ScreenReaderSummary, ScreenReaderPartitionTable } from '../../../../components/accessibility';\nimport { clearCanvas } from '../../../../renderers/canvas';\nimport { SettingsSpec } from '../../../../specs/settings';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { MODEL_KEY } from '../../layout/config';\nimport {\n  hasMostlyRTLLabels,\n  nullShapeViewModel,\n  QuadViewModel,\n  ShapeViewModel,\n  SmallMultiplesDescriptors,\n} from '../../layout/types/viewmodel_types';\nimport { INPUT_KEY } from '../../layout/utils/group_by_rollup';\nimport { isSimpleLinear, isWaffle } from '../../layout/viewmodel/viewmodel';\nimport { partitionDrilldownFocus, partitionMultiGeometries } from '../../state/selectors/geometries';\n\n/** @internal */\nexport interface ContinuousDomainFocus {\n  currentFocusX0: number;\n  currentFocusX1: number;\n  prevFocusX0: number;\n  prevFocusX1: number;\n}\n\n/** @internal */\nexport interface IndexedContinuousDomainFocus extends ContinuousDomainFocus, SmallMultiplesDescriptors {}\n\ninterface ReactiveChartStateProps {\n  isRTL: boolean;\n  initialized: boolean;\n  geometries: ShapeViewModel;\n  geometriesFoci: ContinuousDomainFocus[];\n  multiGeometries: ShapeViewModel[];\n  chartDimensions: Dimensions;\n  a11ySettings: A11ySettings;\n  debug: SettingsSpec['debug'];\n  background: Color;\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface ReactiveChartOwnProps {\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype PartitionProps = ReactiveChartStateProps & ReactiveChartDispatchProps & ReactiveChartOwnProps;\n\n/** @internal */\nexport type AnimationState = { rafId: number };\n\nclass PartitionComponent extends React.Component<PartitionProps> {\n  static displayName = 'Partition';\n\n  // firstRender = true; // this will be useful for stable resizing of treemaps\n  private ctx: CanvasRenderingContext2D | null;\n  private animationState: AnimationState;\n\n  // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example\n  private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `<canvas>` dimensions\n\n  constructor(props: Readonly<PartitionProps>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n    this.animationState = { rafId: NaN };\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  handleMouseMove(e: MouseEvent<HTMLCanvasElement>) {\n    const {\n      initialized,\n      chartDimensions: { width, height },\n      forwardStageRef,\n    } = this.props;\n    const [focus] = this.props.geometriesFoci;\n    if (!forwardStageRef.current || !this.ctx || !initialized || width === 0 || height === 0 || !focus) {\n      return;\n    }\n    const picker = this.props.geometries.pickQuads;\n    const box = forwardStageRef.current.getBoundingClientRect();\n    const { diskCenter } = this.props.geometries;\n    const x = e.clientX - box.left - diskCenter.x;\n    const y = e.clientY - box.top - diskCenter.y;\n    const pickedShapes: Array<QuadViewModel> = picker(x, y, focus);\n    const datumIndices = new Set();\n    pickedShapes.forEach((shape) => {\n      const node = shape[MODEL_KEY];\n      const shapeNode = node.children.find(([key]) => key === shape.dataName);\n      if (shapeNode) {\n        const indices = shapeNode[1][INPUT_KEY] || [];\n        indices.forEach((i) => datumIndices.add(i));\n      }\n    });\n\n    return pickedShapes; // placeholder\n  }\n\n  render() {\n    const {\n      forwardStageRef,\n      initialized,\n      chartDimensions: { width, height },\n      a11ySettings,\n      debug,\n      isRTL,\n    } = this.props;\n    return width === 0 || height === 0 || !initialized ? null : (\n      <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n        <canvas\n          dir={isRTL ? 'rtl' : 'ltr'}\n          ref={forwardStageRef}\n          className=\"echCanvasRenderer\"\n          width={width * this.devicePixelRatio}\n          height={height * this.devicePixelRatio}\n          onMouseMove={this.handleMouseMove.bind(this)}\n          style={{\n            width,\n            height,\n          }}\n          // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n          role=\"presentation\"\n        >\n          <ScreenReaderSummary />\n          {!debug && <ScreenReaderPartitionTable />}\n        </canvas>\n        {debug && <ScreenReaderPartitionTable />}\n      </figure>\n    );\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      const { ctx, devicePixelRatio, props } = this;\n      clearCanvas(ctx, props.background);\n      props.multiGeometries.forEach((geometries, geometryIndex) => {\n        const focus = props.geometriesFoci[geometryIndex];\n        if (!focus) return;\n\n        const renderer = isSimpleLinear(geometries.layout, geometries.style.fillLabel, geometries.layers)\n          ? renderLinearPartitionCanvas2d\n          : isWaffle(geometries.layout)\n            ? renderWrappedPartitionCanvas2d\n            : renderPartitionCanvas2d;\n        renderer(ctx, devicePixelRatio, geometries, focus, this.animationState);\n      });\n    }\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators({ onChartRendered }, dispatch);\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  isRTL: false,\n  initialized: false,\n  geometries: nullShapeViewModel(),\n  geometriesFoci: [],\n  multiGeometries: [],\n  chartDimensions: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  debug: false,\n  background: Colors.Transparent.keyword,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  const multiGeometries = partitionMultiGeometries(state);\n\n  return {\n    isRTL: hasMostlyRTLLabels(multiGeometries),\n    initialized: true,\n    geometries: multiGeometries[0] ?? nullShapeViewModel(),\n    multiGeometries,\n    chartDimensions: getChartContainerDimensionsSelector(state),\n    geometriesFoci: partitionDrilldownFocus(state),\n    a11ySettings: getA11ySettingsSelector(state),\n    debug: getSettingsSpecSelector(state).debug,\n    background: getChartThemeSelector(state).background.color,\n  };\n};\n\n/** @internal */\nexport const Partition = connect(mapStateToProps, mapDispatchToProps)(PartitionComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Colors } from '../../../../common/colors';\nimport { TAU } from '../../../../common/constants';\nimport { PointObject } from '../../../../common/geometry';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { PartitionLayout } from '../../layout/types/config_types';\nimport {\n  nullPartitionSmallMultiplesModel,\n  PartitionSmallMultiplesModel,\n  QuadViewModel,\n  ShapeViewModel,\n} from '../../layout/types/viewmodel_types';\nimport { isSunburst, isTreemap, isMosaic } from '../../layout/viewmodel/viewmodel';\nimport { ContinuousDomainFocus, IndexedContinuousDomainFocus } from '../canvas/partition';\n\ninterface HighlightSet extends PartitionSmallMultiplesModel {\n  geometries: QuadViewModel[];\n  geometriesFoci: ContinuousDomainFocus[];\n  diskCenter: PointObject;\n  outerRadius: number;\n  layout: PartitionLayout;\n}\n\n/** @internal */\nexport interface HighlighterProps {\n  chartId: string;\n  initialized: boolean;\n  canvasDimension: Dimensions;\n  renderAsOverlay: boolean;\n  highlightSets: HighlightSet[];\n}\n\nconst EPSILON = 1e-6;\n\ninterface SVGStyle {\n  color?: string;\n  fillClassName?: string;\n  strokeClassName?: string;\n}\n\n/**\n * This function return an SVG arc path from the same parameters of the canvas.arc function call\n * @param x The horizontal coordinate of the arc's center\n * @param y The vertical coordinate of the arc's center\n * @param r The arc's radius. Must be positive\n * @param a0 The angle at which the arc starts in radians, measured from the positive x-axis\n * @param a1 The angle at which the arc ends in radians, measured from the positive x-axis\n * @param ccw If true, draws the arc counter-clockwise between the start and end angles\n */\nfunction getSectorShapeFromCanvasArc(x: number, y: number, r: number, a0: number, a1: number, ccw: boolean): string {\n  const cw = ccw ? 0 : 1;\n  const diff = a1 - a0;\n  const direction = ccw ? -1 : 1;\n  return `A${r},${r},0,${+(direction * diff >= Math.PI)},${cw},${x + r * Math.cos(a1)},${y + r * Math.sin(a1)}`;\n}\n\n/**\n * Renders an SVG Rect from a partition chart QuadViewModel\n */\nfunction renderRectangles(\n  geometry: QuadViewModel,\n  key: string,\n  style: SVGStyle,\n  { currentFocusX0, currentFocusX1 }: ContinuousDomainFocus,\n  width: number,\n) {\n  const { x0, x1, y0px, y1px } = geometry;\n  const props = style.color ? { fill: style.color } : { className: style.fillClassName };\n  const scale = width / (currentFocusX1 - currentFocusX0);\n  const fx0 = Math.max((x0 - currentFocusX0) * scale, 0);\n  const fx1 = Math.min((x1 - currentFocusX0) * scale, width);\n  return <rect key={key} x={fx0} y={y0px} width={Math.abs(fx1 - fx0)} height={Math.abs(y1px - y0px)} {...props} />;\n}\n\n/**\n * Render an SVG path or circle from a partition chart QuadViewModel\n */\nfunction renderSector(geometry: QuadViewModel, key: string, { color, fillClassName, strokeClassName }: SVGStyle) {\n  const { x0, x1, y0px, y1px } = geometry;\n  if ((Math.abs(x0 - x1) + TAU) % TAU < EPSILON) {\n    const props =\n      y0px === 0\n        ? {\n            key,\n            r: y1px,\n            stroke: 'none',\n            ...(color ? { fill: color } : { className: fillClassName }),\n          }\n        : {\n            key,\n            r: (y0px + y1px) / 2,\n            strokeWidth: y1px - y0px,\n            fill: 'none',\n            ...(color ? { stroke: color } : { className: strokeClassName }),\n          };\n    return <circle {...props} />;\n  }\n  const X0 = x0 - TAU / 4;\n  const X1 = x1 - TAU / 4;\n  const path = [\n    `M${y0px * Math.cos(X0)},${y0px * Math.sin(X0)}`,\n    getSectorShapeFromCanvasArc(0, 0, y0px, X0, X1, false),\n    `L${y1px * Math.cos(X1)},${y1px * Math.sin(X1)}`,\n    getSectorShapeFromCanvasArc(0, 0, y1px, X1, X0, true),\n    'Z',\n  ].join(' ');\n  const props = color ? { fill: color } : { className: fillClassName };\n  return <path key={key} d={path} {...props} />;\n}\n\nfunction renderGeometries(\n  geoms: QuadViewModel[],\n  partitionLayout: PartitionLayout,\n  style: SVGStyle,\n  foci: ContinuousDomainFocus[],\n  width: number,\n) {\n  const maxDepth = geoms.reduce((acc, geom) => Math.max(acc, geom.depth), 0);\n  // we should render only the deepest geometries of the tree to avoid overlaying highlighted geometries\n  const highlightedGeoms =\n    isTreemap(partitionLayout) || isMosaic(partitionLayout) ? geoms.filter((g) => g.depth >= maxDepth) : geoms;\n  const renderGeom = isSunburst(partitionLayout) ? renderSector : renderRectangles;\n  return highlightedGeoms.map((geometry, index) =>\n    renderGeom(\n      geometry,\n      `${index}`,\n      style,\n      foci[0] ?? {\n        currentFocusX0: NaN,\n        currentFocusX1: NaN,\n        prevFocusX0: NaN,\n        prevFocusX1: NaN,\n      },\n      width,\n    ),\n  );\n}\n\n/** @internal */\nexport class HighlighterComponent extends React.Component<HighlighterProps> {\n  static displayName = 'Highlighter';\n\n  renderAsMask() {\n    const {\n      chartId,\n      canvasDimension: { width },\n      highlightSets,\n    } = this.props;\n\n    const maskId = (ind: number, ind2: number) => `echHighlighterMask__${chartId}__${ind}__${ind2}`;\n\n    const someGeometriesHighlighted = highlightSets.some(({ geometries }) => geometries.length > 0);\n    const renderedHighlightSet = someGeometriesHighlighted ? highlightSets : [];\n\n    return (\n      <>\n        <defs>\n          {renderedHighlightSet\n            .filter(({ geometries, outerRadius }) => geometries.length > 0 && outerRadius > 0)\n            .map(\n              ({\n                geometries,\n                geometriesFoci,\n                diskCenter,\n                index,\n                innerIndex,\n                layout,\n                marginLeftPx,\n                marginTopPx,\n                panel: { innerWidth, innerHeight },\n              }) => (\n                <mask key={maskId(index, innerIndex)} id={maskId(index, innerIndex)}>\n                  <rect x={marginLeftPx} y={marginTopPx} width={innerWidth} height={innerHeight} fill=\"white\" />\n                  <g transform={`translate(${diskCenter.x}, ${diskCenter.y})`}>\n                    {renderGeometries(geometries, layout, { color: Colors.Black.keyword }, geometriesFoci, width)}\n                  </g>\n                </mask>\n              ),\n            )}\n        </defs>\n        {renderedHighlightSet\n          .filter(({ outerRadius }) => outerRadius > 0)\n          .map(\n            ({\n              diskCenter,\n              outerRadius,\n              index,\n              innerIndex,\n              layout,\n              marginLeftPx,\n              marginTopPx,\n              panel: { innerWidth, innerHeight },\n            }) =>\n              isSunburst(layout) ? (\n                <circle\n                  key={`${index}__${innerIndex}`}\n                  cx={diskCenter.x}\n                  cy={diskCenter.y}\n                  r={outerRadius}\n                  mask={`url(#${maskId(index, innerIndex)})`}\n                  className=\"echHighlighter__mask\"\n                />\n              ) : (\n                <rect\n                  key={`${index}__${innerIndex}`}\n                  x={marginLeftPx}\n                  y={marginTopPx}\n                  width={innerWidth}\n                  height={innerHeight}\n                  mask={`url(#${maskId(index, innerIndex)})`}\n                  className=\"echHighlighter__mask\"\n                />\n              ),\n          )}\n      </>\n    );\n  }\n\n  renderAsOverlay() {\n    const {\n      canvasDimension: { width },\n    } = this.props;\n    return this.props.highlightSets\n      .filter(({ geometries, outerRadius }) => geometries.length > 0 && outerRadius > 0)\n      .map(({ index, innerIndex, layout, geometries, diskCenter, geometriesFoci }) => (\n        <g key={`${index}|${innerIndex}`} transform={`translate(${diskCenter.x}, ${diskCenter.y})`}>\n          {renderGeometries(\n            geometries,\n            layout,\n            {\n              fillClassName: 'echHighlighterOverlay__fill',\n              strokeClassName: 'echHighlighterOverlay__stroke',\n            },\n            geometriesFoci,\n            width,\n          )}\n        </g>\n      ));\n  }\n\n  render() {\n    return (\n      <svg className=\"echHighlighter\" width=\"100%\" height=\"100%\">\n        {this.props.renderAsOverlay ? this.renderAsOverlay() : this.renderAsMask()}\n      </svg>\n    );\n  }\n}\n\n/** @internal */\nexport const DEFAULT_PROPS: HighlighterProps = {\n  chartId: 'empty',\n  initialized: false,\n  renderAsOverlay: false,\n  canvasDimension: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  highlightSets: [\n    {\n      ...nullPartitionSmallMultiplesModel(),\n      geometries: [],\n      geometriesFoci: [],\n      diskCenter: {\n        x: 0,\n        y: 0,\n      },\n      outerRadius: 10,\n    },\n  ],\n};\n\n/** @internal */\nexport function highlightSetMapper(geometries: QuadViewModel[], foci: IndexedContinuousDomainFocus[]) {\n  return (vm: ShapeViewModel): HighlightSet => {\n    const { index, innerIndex } = vm;\n    return {\n      ...vm,\n      geometries: geometries.filter(({ index: i, innerIndex: ii }) => index === i && innerIndex === ii),\n      geometriesFoci: foci.filter(({ index: i, innerIndex: ii }) => index === i && innerIndex === ii),\n    };\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { connect } from 'react-redux';\n\nimport { DEFAULT_PROPS, HighlighterComponent, HighlighterProps, highlightSetMapper } from './highlighter';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { partitionDrilldownFocus, partitionMultiGeometries } from '../../state/selectors/geometries';\nimport { getPickedShapes } from '../../state/selectors/picked_shapes';\n\nconst hoverMapStateToProps = (state: GlobalChartState): HighlighterProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n\n  const canvasDimension = getChartContainerDimensionsSelector(state);\n  const { chartId } = state;\n\n  const allGeometries = partitionMultiGeometries(state);\n  const geometriesFoci = partitionDrilldownFocus(state);\n  const pickedGeometries = getPickedShapes(state);\n\n  const highlightSets = allGeometries.map(highlightSetMapper(pickedGeometries, geometriesFoci));\n\n  return {\n    chartId,\n    initialized: true,\n    renderAsOverlay: true,\n    canvasDimension,\n    highlightSets,\n  };\n};\n\n/**\n * Partition chart highlighter from mouse hover events\n * @internal\n */\nexport const HighlighterFromHover = connect(hoverMapStateToProps)(HighlighterComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { connect } from 'react-redux';\n\nimport { HighlighterComponent, HighlighterProps, DEFAULT_PROPS, highlightSetMapper } from './highlighter';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { partitionDrilldownFocus, partitionMultiGeometries } from '../../state/selectors/geometries';\nimport { legendHoverHighlightNodes } from '../../state/selectors/get_highlighted_shapes';\n\nconst legendMapStateToProps = (state: GlobalChartState): HighlighterProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n\n  const { chartId } = state;\n\n  const geometries = legendHoverHighlightNodes(state);\n  const geometriesFoci = partitionDrilldownFocus(state);\n  const canvasDimension = getChartContainerDimensionsSelector(state);\n  const multiGeometries = partitionMultiGeometries(state);\n  const highlightMapper = highlightSetMapper(geometries, geometriesFoci);\n  const highlightSets = multiGeometries.map(highlightMapper);\n\n  return {\n    chartId,\n    initialized: true,\n    renderAsOverlay: false,\n    canvasDimension,\n    highlightSets,\n  };\n};\n\n/**\n * Partition chart highlighter from legend events\n * @internal\n */\nexport const HighlighterFromLegend = connect(legendMapStateToProps)(HighlighterComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { HighlighterFromHover } from './highlighter_hover';\nimport { HighlighterFromLegend } from './highlighter_legend';\nimport { Tooltip } from '../../../../components/tooltip/tooltip';\nimport { BackwardRef } from '../../../../state/chart_state';\nimport { Partition } from '../canvas/partition';\n\n/** @internal */\nexport function render(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) {\n  return (\n    <>\n      <Tooltip getChartContainerRef={containerRef} />\n      <Partition forwardStageRef={forwardStageRef} />\n      <HighlighterFromHover />\n      <HighlighterFromLegend />\n    </>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { LegacyAnimationConfig } from '../../../common/animation';\nimport { Distance, Pixels, Radius } from '../../../common/geometry';\nimport { BaseDatum, Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants'; // kept as unshortened import on separate line otherwise import circularity emerges\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { IndexedAccessorFn } from '../../../utils/accessor';\nimport {\n  Datum,\n  LabelAccessor,\n  ShowAccessor,\n  ValueAccessor,\n  ValueFormatter,\n  stripUndefined,\n} from '../../../utils/common';\nimport { FillFontSizeRange, FillLabelConfig } from '../../../utils/themes/partition';\nimport { percentFormatter } from '../layout/config';\nimport { PartitionLayout } from '../layout/types/config_types';\nimport { NodeColorAccessor, ValueGetter } from '../layout/types/viewmodel_types';\nimport { NodeSorter, AGGREGATE_KEY } from '../layout/utils/group_by_rollup';\n\ninterface ExtendedFillLabelConfig extends FillLabelConfig, FillFontSizeRange {\n  valueFormatter: ValueFormatter;\n}\n\n/**\n * Specification for a given layer in the partition chart\n * @public\n */\nexport interface Layer<D extends BaseDatum = Datum> {\n  groupByRollup: IndexedAccessorFn<D>;\n  sortPredicate?: NodeSorter | null;\n  nodeLabel?: LabelAccessor;\n  fillLabel?: Partial<ExtendedFillLabelConfig>;\n  showAccessor?: ShowAccessor;\n  shape?: { fillColor: string | NodeColorAccessor };\n}\n\n/**\n * Specifies the partition chart\n * @public\n */\nexport interface PartitionSpec<D extends BaseDatum = Datum> extends Spec, LegacyAnimationConfig {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Partition;\n  data: D[];\n  valueAccessor: ValueAccessor<D>;\n  valueFormatter: ValueFormatter;\n  valueGetter: ValueGetter;\n  percentFormatter: ValueFormatter;\n  topGroove: Pixels;\n  smallMultiples: string | null;\n  layers: Layer<D>[];\n  /**\n   * Largest to smallest sectors are positioned in a clockwise order\n   */\n  clockwiseSectors: boolean;\n  /**\n   * Starts placement with the second largest slice, for the innermost pie/ring\n   */\n  specialFirstInnermostSector: boolean;\n  layout: PartitionLayout;\n  maxRowCount: number;\n  /** @alpha */\n  drilldown: boolean;\n\n  // These need examples or documentation\n  fillOutside: boolean;\n  radiusOutside: Radius;\n  fillRectangleWidth: Distance;\n  fillRectangleHeight: Distance;\n}\n\nconst buildProps = buildSFProps<PartitionSpec>()(\n  {\n    chartType: ChartType.Partition,\n    specType: SpecType.Series,\n  },\n  {\n    valueAccessor: (d) => (typeof d === 'number' ? d : 0),\n    valueGetter: (n) => n[AGGREGATE_KEY],\n    valueFormatter: (d) => String(d),\n    percentFormatter,\n    topGroove: 20,\n    smallMultiples: '__global__small_multiples___',\n    layers: [\n      {\n        groupByRollup: (_, i) => i,\n        nodeLabel: (d) => String(d),\n        showAccessor: () => true,\n        fillLabel: {},\n      },\n    ],\n    clockwiseSectors: true,\n    specialFirstInnermostSector: true,\n    layout: PartitionLayout.sunburst,\n    drilldown: false,\n    maxRowCount: 12,\n    fillOutside: false,\n    radiusOutside: 128,\n    fillRectangleWidth: Infinity,\n    fillRectangleHeight: Infinity,\n    animation: { duration: 0 },\n  },\n);\n\n/**\n * Adds partition spec to chart specs\n * @public\n */\nexport const Partition = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    PartitionSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<PartitionSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type PartitionProps = ComponentProps<typeof Partition>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RefObject } from 'react';\n\nimport { computeLegendSelector } from './selectors/compute_legend';\nimport { getChartTypeDescriptionSelector } from './selectors/get_chart_type_description';\nimport { getPointerCursorSelector } from './selectors/get_cursor_pointer';\nimport { getDebugStateSelector } from './selectors/get_debug_state';\nimport { getLegendItemsExtra } from './selectors/get_legend_items_extra';\nimport { getLegendItemsLabels } from './selectors/get_legend_items_labels';\nimport { isTooltipVisibleSelector } from './selectors/is_tooltip_visible';\nimport { createOnElementClickCaller } from './selectors/on_element_click_caller';\nimport { createOnElementOutCaller } from './selectors/on_element_out_caller';\nimport { createOnElementOverCaller } from './selectors/on_element_over_caller';\nimport { getPartitionSpec } from './selectors/partition_spec';\nimport { getTooltipInfoSelector } from './selectors/tooltip';\nimport { ChartType } from '../..';\nimport { BackwardRef, GlobalChartState, InternalChartState } from '../../../state/chart_state';\nimport { getActivePointerPosition } from '../../../state/selectors/get_active_pointer_position';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { DebugState } from '../../../state/types';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { render } from '../renderer/dom/layered_partition_chart';\n\n/** @internal */\nexport class PartitionState implements InternalChartState {\n  chartType = ChartType.Partition;\n\n  onElementClickCaller: (state: GlobalChartState) => void;\n\n  onElementOverCaller: (state: GlobalChartState) => void;\n\n  onElementOutCaller: (state: GlobalChartState) => void;\n\n  constructor() {\n    this.onElementClickCaller = createOnElementClickCaller();\n    this.onElementOverCaller = createOnElementOverCaller();\n    this.onElementOutCaller = createOnElementOutCaller();\n  }\n\n  isInitialized(globalState: GlobalChartState) {\n    return getPartitionSpec(globalState) !== null ? InitStatus.Initialized : InitStatus.SpecNotInitialized;\n  }\n\n  isBrushAvailable() {\n    return false;\n  }\n\n  isBrushing() {\n    return false;\n  }\n\n  isChartEmpty() {\n    return false;\n  }\n\n  getLegendItemsLabels(globalState: GlobalChartState) {\n    // order doesn't matter, but it needs to return the highest depth of the label occurrence so enough horizontal width is allocated\n    // the label item strings needs to be a concatenation of the label + the extra formatted value if available.\n    // this is required to compute the legend automatic width\n    return getLegendItemsLabels(globalState);\n  }\n\n  getLegendItems(globalState: GlobalChartState) {\n    return computeLegendSelector(globalState);\n  }\n\n  getLegendExtraValues(globalState: GlobalChartState) {\n    return getLegendItemsExtra(globalState);\n  }\n\n  chartRenderer(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) {\n    return render(containerRef, forwardStageRef);\n  }\n\n  getPointerCursor(globalState: GlobalChartState) {\n    return getPointerCursorSelector(globalState);\n  }\n\n  isTooltipVisible(globalState: GlobalChartState) {\n    return {\n      visible: isTooltipVisibleSelector(globalState),\n      isExternal: false,\n      displayOnly: false,\n      isPinnable: true,\n    };\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfoSelector(globalState);\n  }\n\n  getTooltipAnchor(state: GlobalChartState) {\n    const position = getActivePointerPosition(state);\n    return {\n      isRotated: false,\n      x: position.x,\n      width: 0,\n      y: position.y,\n      height: 0,\n    };\n  }\n\n  eventCallbacks(globalState: GlobalChartState) {\n    this.onElementOverCaller(globalState);\n    this.onElementOutCaller(globalState);\n    this.onElementClickCaller(globalState);\n  }\n\n  // TODO\n  getProjectionContainerArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getMainProjectionArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getBrushArea(): Dimensions | null {\n    return null;\n  }\n\n  getDebugState(state: GlobalChartState): DebugState {\n    return getDebugStateSelector(state);\n  }\n\n  getChartTypeDescription(state: GlobalChartState): string {\n    return getChartTypeDescriptionSelector(state);\n  }\n\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { getTrees } from './tree';\nimport { RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { Colors } from '../../../../common/colors';\nimport { LegendItem } from '../../../../common/legend';\nimport { SeriesIdentifier } from '../../../../common/series_id';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLegendConfigSelector } from '../../../../state/selectors/get_legend_config_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { SpecId } from '../../../../utils/ids';\nimport { isHierarchicalLegend } from '../../../../utils/legend';\nimport { PartitionLayout } from '../../layout/types/config_types';\nimport {\n  AGGREGATE_KEY,\n  ArrayNode,\n  CHILDREN_KEY,\n  DEPTH_KEY,\n  HIERARCHY_ROOT_KEY,\n  HierarchyOfArrays,\n  PATH_KEY,\n} from '../../layout/utils/group_by_rollup';\nimport { isLinear } from '../../layout/viewmodel/viewmodel';\nimport { Layer, PartitionSpec } from '../../specs';\n\nfunction compareLegendItemNames(aItem: LegendNode, bItem: LegendNode, locale: string): number {\n  return aItem.item.label.localeCompare(bItem.item.label, locale);\n}\n\nfunction compareDescendingLegendItemValues(aItem: LegendNode, bItem: LegendNode): number {\n  return (aItem.item.depth ?? -1) - (bItem.item.depth ?? -1) || bItem.node[AGGREGATE_KEY] - aItem.node[AGGREGATE_KEY];\n}\n\n/** @internal */\nexport const computeLegendSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector, getPartitionSpecs, getLegendConfigSelector, getTrees],\n  (settings, [spec], { flatLegend, legendMaxDepth, legendPosition }, trees): LegendItem[] => {\n    if (!spec) return [];\n\n    const sortingFn = flatLegend && settings.legendSort;\n    const { locale } = settings;\n    return trees.flatMap((tree) => {\n      const customSortingFn = sortingFn\n        ? (aItem: LegendNode, bItem: LegendNode) =>\n            sortingFn(\n              {\n                smAccessorValue: tree.smAccessorValue,\n                specId: aItem.item.seriesIdentifiers[0]?.specId,\n                key: aItem.item.seriesIdentifiers[0]?.key,\n              } as SeriesIdentifier,\n              {\n                smAccessorValue: tree.smAccessorValue,\n                specId: bItem.item.seriesIdentifiers[0]?.specId,\n                key: bItem.item.seriesIdentifiers[0]?.key,\n              } as SeriesIdentifier,\n            )\n        : undefined;\n      const useHierarchicalLegend = isHierarchicalLegend(flatLegend, legendPosition);\n      const { valueFormatter } = spec;\n      const items = walkTree(spec.id, useHierarchicalLegend, valueFormatter, tree.tree, spec.layers, 0);\n      return items\n        .filter((d) => {\n          const depth = d.item.depth ?? -1;\n          // remove hierarchy root\n          if (d.item.childId === HIERARCHY_ROOT_KEY) {\n            return false;\n          }\n          return depth < legendMaxDepth;\n        })\n        .sort(\n          customSortingFn ??\n            (spec.layout === PartitionLayout.waffle // waffle has inherent top to bottom descending order\n              ? compareDescendingLegendItemValues\n              : isLinear(spec.layout) // icicle/flame are sorted by name\n                ? (a, b) => compareLegendItemNames(a, b, locale)\n                : () => 0), // all others are sorted by hierarchy\n        )\n        .map(({ item }) => item);\n    });\n  },\n);\n\ntype LegendNode = { item: LegendItem; node: ArrayNode };\n\nfunction walkTree(\n  specId: SpecId,\n  useHierarchicalLegend: boolean,\n  valueFormatter: PartitionSpec['valueFormatter'],\n  tree: HierarchyOfArrays,\n  layers: Layer[],\n  depth: number,\n  uniqueNames: Set<string> = new Set(),\n  legendItems: Array<{ item: LegendItem; node: ArrayNode }> = [],\n): { item: LegendItem; node: ArrayNode }[] {\n  if (tree.length === 0) {\n    return legendItems;\n  }\n\n  for (const [key, node] of tree) {\n    const layer = layers[depth - 1];\n    const formatter = layer?.nodeLabel ?? ((d) => `${d}`);\n\n    const fill = layer?.shape?.fillColor ?? RGBATupleToString(Colors.DarkOpaqueRed.rgba);\n    const fillColor = typeof fill === 'function' ? fill(key, node.sortIndex, node, tree) : fill;\n    const label = formatter(key);\n    const joinedPath = node[PATH_KEY].map((d) => d.value).join('##');\n    const uniqueKey = `${depth}--${joinedPath}--${label}--${fillColor}--${node[AGGREGATE_KEY]}`;\n    if (!isNil(key) && !uniqueNames.has(uniqueKey)) {\n      legendItems.push({\n        item: {\n          color: fillColor,\n          childId: key,\n          label,\n          path: node[PATH_KEY],\n          depth: node[DEPTH_KEY] - 1,\n          seriesIdentifiers: [{ key, specId }],\n          keys: [],\n          defaultExtra: {\n            raw: node[AGGREGATE_KEY],\n            formatted: valueFormatter(node[AGGREGATE_KEY]),\n            legendSizingLabel: `${node[AGGREGATE_KEY]}`,\n          },\n        },\n        node,\n      });\n      uniqueNames.add(uniqueKey);\n    }\n    const children = node[CHILDREN_KEY];\n    walkTree(specId, useHierarchicalLegend, valueFormatter, children, layers, depth + 1, uniqueNames, legendItems);\n  }\n  return legendItems;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './partition_spec';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { isSimpleLinear } from '../../layout/viewmodel/viewmodel';\n\n/** @internal */\nexport const drilldownActive = createCustomCachedSelector(\n  [getPartitionSpecs, getChartThemeSelector],\n  (specs, { partition }) => {\n    return specs.length === 1 && specs[0] && isSimpleLinear(specs[0].layout, partition.fillLabel, specs[0].layers);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { getTrees, StyledTree } from './tree';\nimport { ChartType } from '../../..';\nimport { CategoryKey } from '../../../../common/category';\nimport { Pixels } from '../../../../common/geometry';\nimport { Font } from '../../../../common/text_utils';\nimport { RelativeBandsPadding, SmallMultiplesSpec, SpecType } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecsFromStore } from '../../../../state/utils';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { nullShapeViewModel, QuadViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { getShapeViewModel } from '../../layout/viewmodel/scenegraph';\nimport { IndexedContinuousDomainFocus } from '../../renderer/canvas/partition';\n\nconst horizontalSplit = (s?: SmallMultiplesSpec) => s?.splitHorizontally;\nconst verticalSplit = (s?: SmallMultiplesSpec) => s?.splitVertically;\n\nfunction bandwidth(range: Pixels, bandCount: number, { outer, inner }: RelativeBandsPadding) {\n  // same convention as d3.scaleBand https://observablehq.com/@d3/d3-scaleband\n  return range / (2 * outer + bandCount + bandCount * inner - inner);\n}\n\n/** @internal */\nexport const partitionMultiGeometries = createCustomCachedSelector(\n  [getSpecs, getPartitionSpecs, getChartContainerDimensionsSelector, getTrees, getChartThemeSelector],\n  (\n    specs,\n    partitionSpecs,\n    parentDimensions,\n    trees,\n    { background, axes: { axisPanelTitle }, chartMargins, chartPaddings, partition: partitionStyle },\n  ): ShapeViewModel[] => {\n    const smallMultiplesSpecs = getSpecsFromStore<SmallMultiplesSpec>(specs, ChartType.Global, SpecType.SmallMultiples);\n    const { width, height } = parentDimensions;\n    const chartWidth = width - chartMargins.left - chartMargins.right;\n    const chartHeight = height - chartMargins.top - chartMargins.bottom;\n\n    // todo make it part of configuration\n    const outerSpecDirection = ['horizontal', 'vertical', 'zigzag'][0];\n\n    const innerBreakdownDirection = horizontalSplit(smallMultiplesSpecs[0])\n      ? 'horizontal'\n      : verticalSplit(smallMultiplesSpecs[0])\n        ? 'vertical'\n        : 'zigzag';\n\n    const outerPanelCount = partitionSpecs.length;\n    const zigzagColumnCount = Math.ceil(Math.sqrt(outerPanelCount));\n    const zigzagRowCount = Math.ceil(outerPanelCount / zigzagColumnCount);\n\n    const outerWidthRatio =\n      outerSpecDirection === 'horizontal'\n        ? 1 / outerPanelCount\n        : outerSpecDirection === 'zigzag'\n          ? 1 / zigzagColumnCount\n          : 1;\n    const outerHeightRatio =\n      outerSpecDirection === 'vertical'\n        ? 1 / outerPanelCount\n        : outerSpecDirection === 'zigzag'\n          ? 1 / zigzagRowCount\n          : 1;\n\n    const result = partitionSpecs.flatMap((spec, index) => {\n      const innerWidth = chartWidth - chartPaddings.left - chartPaddings.right;\n      const innerHeight = chartHeight - chartPaddings.top - chartPaddings.bottom;\n\n      return trees.map(({ name, smAccessorValue, style, tree: t }: StyledTree, innerIndex, a) => {\n        const innerPanelCount = a.length;\n        const outerPanelWidth = innerWidth * outerWidthRatio;\n        const outerPanelHeight = innerHeight * outerHeightRatio;\n        const outerPanelArea = outerPanelWidth * outerPanelHeight;\n        const innerPanelTargetArea = outerPanelArea / innerPanelCount;\n        const innerPanelTargetHeight = Math.sqrt(innerPanelTargetArea); // attempting squarish inner panels\n\n        const innerZigzagRowCountEstimate = Math.max(1, Math.floor(outerPanelHeight / innerPanelTargetHeight)); // err on the side of landscape aspect ratio\n        const innerZigzagColumnCount = Math.ceil(a.length / innerZigzagRowCountEstimate);\n        const innerZigzagRowCount = Math.ceil(a.length / innerZigzagColumnCount);\n        const innerRowCount =\n          innerBreakdownDirection === 'vertical'\n            ? a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? innerZigzagRowCount\n              : 1;\n        const innerColumnCount =\n          innerBreakdownDirection === 'vertical'\n            ? 1\n            : innerBreakdownDirection === 'zigzag'\n              ? innerZigzagColumnCount\n              : a.length;\n        const innerRowIndex =\n          innerBreakdownDirection === 'vertical'\n            ? innerIndex\n            : innerBreakdownDirection === 'zigzag'\n              ? Math.floor(innerIndex / innerZigzagColumnCount)\n              : 0;\n        const innerColumnIndex =\n          innerBreakdownDirection === 'vertical'\n            ? 0\n            : innerBreakdownDirection === 'zigzag'\n              ? innerIndex % innerZigzagColumnCount\n              : innerIndex;\n        const topOuterRatio =\n          outerSpecDirection === 'vertical'\n            ? index / outerPanelCount\n            : outerSpecDirection === 'zigzag'\n              ? Math.floor(index / zigzagColumnCount) / zigzagRowCount\n              : 0;\n        const topInnerRatio =\n          outerHeightRatio *\n          (innerBreakdownDirection === 'vertical'\n            ? innerIndex / a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? Math.floor(innerIndex / innerZigzagColumnCount) / innerZigzagRowCount\n              : 0);\n        const panelHeightRatio =\n          outerHeightRatio *\n          (innerBreakdownDirection === 'vertical'\n            ? 1 / a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? 1 / innerZigzagRowCount\n              : 1);\n        const leftOuterRatio =\n          outerSpecDirection === 'horizontal'\n            ? index / outerPanelCount\n            : outerSpecDirection === 'zigzag'\n              ? (index % zigzagColumnCount) / zigzagColumnCount\n              : 0;\n        const leftInnerRatio =\n          outerWidthRatio *\n          (innerBreakdownDirection === 'horizontal'\n            ? innerIndex / a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? (innerIndex % innerZigzagColumnCount) / innerZigzagColumnCount\n              : 0);\n        const panelWidthRatio =\n          outerWidthRatio *\n          (innerBreakdownDirection === 'horizontal'\n            ? 1 / a.length\n            : innerBreakdownDirection === 'zigzag'\n              ? 1 / innerZigzagColumnCount\n              : 1);\n\n        const panelInnerWidth = bandwidth(innerWidth, innerColumnCount, style.horizontalPanelPadding);\n\n        const panelInnerHeight = bandwidth(innerHeight, innerRowCount, style.verticalPanelPadding);\n\n        const marginLeftPx =\n          chartMargins.left +\n          chartPaddings.left +\n          panelInnerWidth * style.horizontalPanelPadding.outer +\n          innerColumnIndex * (panelInnerWidth * (1 + style.horizontalPanelPadding.inner));\n        const marginTopPx =\n          chartMargins.top +\n          chartPaddings.top +\n          panelInnerHeight * style.verticalPanelPadding.outer +\n          innerRowIndex * (panelInnerHeight * (1 + style.verticalPanelPadding.inner));\n\n        const fontFace: Font = {\n          fontStyle: axisPanelTitle.fontStyle ?? 'normal',\n          fontFamily: axisPanelTitle.fontFamily,\n          fontWeight: 'normal',\n          fontVariant: 'normal',\n          textColor: axisPanelTitle.fill,\n        };\n        return getShapeViewModel(spec, parentDimensions, t, background, partitionStyle, {\n          index,\n          innerIndex,\n          layout: spec.layout,\n          smAccessorValue,\n          top: topOuterRatio + topInnerRatio,\n          height: panelHeightRatio,\n          left: leftOuterRatio + leftInnerRatio,\n          width: panelWidthRatio,\n          innerRowCount,\n          innerColumnCount,\n          innerRowIndex,\n          innerColumnIndex,\n          marginLeftPx,\n          marginTopPx,\n          panel: {\n            title: String(name),\n            innerWidth: panelInnerWidth,\n            innerHeight: panelInnerHeight,\n            fontFace,\n            fontSize: axisPanelTitle.fontSize,\n          },\n        });\n      });\n    });\n\n    return result.length === 0\n      ? [nullShapeViewModel(undefined, undefined, { x: outerWidthRatio, y: outerHeightRatio })]\n      : result;\n  },\n);\n\nfunction focusRect(quadViewModel: QuadViewModel[], { left, width }: Dimensions, drilldown: CategoryKey[]) {\n  return drilldown.length === 0\n    ? { x0: left, x1: left + width }\n    : quadViewModel.find(\n        ({ path }) => path.length === drilldown.length && path.every(({ value }, i) => value === drilldown[i]),\n      ) ?? { x0: left, x1: left + width };\n}\n/** @internal */\nexport const partitionDrilldownFocus = createCustomCachedSelector(\n  [\n    partitionMultiGeometries,\n    getChartContainerDimensionsSelector,\n    (state) => state.interactions.drilldown,\n    (state) => state.interactions.prevDrilldown,\n  ],\n  (multiGeometries, chartDimensions, drilldown, prevDrilldown): IndexedContinuousDomainFocus[] =>\n    multiGeometries.map(({ quadViewModel, smAccessorValue, index, innerIndex }) => {\n      const { x0: currentFocusX0, x1: currentFocusX1 } = focusRect(quadViewModel, chartDimensions, drilldown);\n      const { x0: prevFocusX0, x1: prevFocusX1 } = focusRect(quadViewModel, chartDimensions, prevDrilldown);\n      return { currentFocusX0, currentFocusX1, prevFocusX0, prevFocusX1, smAccessorValue, index, innerIndex };\n    }),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpec } from './partition_spec';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const getChartTypeDescriptionSelector = createCustomCachedSelector(\n  [getPartitionSpec],\n  (partitionSpec): string => {\n    return `${partitionSpec?.layout} chart` ?? 'Partition chart';\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPickedShapes } from './picked_shapes';\nimport { DEFAULT_CSS_CURSOR } from '../../../../common/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\n\n/** @internal */\nexport const getPointerCursorSelector = createCustomCachedSelector(\n  [getPickedShapes, getSettingsSpecSelector, getTooltipInteractionState],\n  (pickedShapes, { onElementClick, onElementOver }, tooltipState) => {\n    if (tooltipState.pinned) return;\n    return Array.isArray(pickedShapes) && pickedShapes.length > 0 && (onElementClick || onElementOver)\n      ? 'pointer'\n      : DEFAULT_CSS_CURSOR;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { partitionMultiGeometries } from './geometries';\nimport { TAU } from '../../../../common/constants';\nimport { Pixels, PointObject } from '../../../../common/geometry';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { DebugState, PartitionDebugState } from '../../../../state/types';\nimport { QuadViewModel } from '../../layout/types/viewmodel_types';\nimport { isSunburst } from '../../layout/viewmodel/viewmodel';\n\n/** @internal */\nexport const getDebugStateSelector = createCustomCachedSelector([partitionMultiGeometries], (geoms): DebugState => {\n  return {\n    partition: geoms.reduce<PartitionDebugState[]>((acc, { layout, panel, quadViewModel, diskCenter }) => {\n      const partitions: PartitionDebugState['partitions'] = quadViewModel.map((model) => {\n        const { dataName, depth, fillColor, value } = model;\n        return {\n          name: dataName,\n          depth,\n          color: fillColor,\n          value,\n          coords: isSunburst(layout) ? getCoordsForSector(model, diskCenter) : getCoordsForRectangle(model, diskCenter),\n        };\n      });\n      acc.push({\n        panelTitle: panel.title,\n        partitions,\n      });\n      return acc;\n    }, []),\n  };\n});\n\nfunction getCoordsForSector({ x0, x1, y1px, y0px }: QuadViewModel, diskCenter: PointObject): [Pixels, Pixels] {\n  const X0 = x0 - TAU / 4;\n  const X1 = x1 - TAU / 4;\n  const cr = y0px + (y1px - y0px) / 2;\n  const angle = X0 + (X1 - X0) / 2;\n  const x = Math.round(Math.cos(angle) * cr + diskCenter.x);\n  const y = Math.round(Math.sin(angle) * cr + diskCenter.y);\n  return [x, y];\n}\n\nfunction getCoordsForRectangle({ x0, x1, y1px, y0px }: QuadViewModel, diskCenter: PointObject): [Pixels, Pixels] {\n  const y = Math.round(y0px + (y1px - y0px) / 2 + diskCenter.y);\n  const x = Math.round(x0 + (x1 - x0) / 2 + diskCenter.x);\n  return [x, y];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { partitionMultiGeometries } from './geometries';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { QuadViewModel } from '../../layout/types/viewmodel_types';\nimport { highlightedGeoms } from '../../layout/utils/highlighted_geoms';\n\nconst getHighlightedLegendItemPath = (state: GlobalChartState) => state.interactions.highlightedLegendPath;\n\n/** @internal */\nexport const legendHoverHighlightNodes = createCustomCachedSelector(\n  [getSettingsSpecSelector, getHighlightedLegendItemPath, partitionMultiGeometries],\n  ({ legendStrategy, flatLegend }, highlightedLegendItemPath, geometries): QuadViewModel[] => {\n    if (highlightedLegendItemPath.length === 0) return [];\n    return geometries.flatMap(({ quadViewModel }) =>\n      highlightedGeoms(legendStrategy, flatLegend, quadViewModel, highlightedLegendItemPath),\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpec } from './partition_spec';\nimport { getTrees } from './tree';\nimport { LegendItemExtraValues } from '../../../../common/legend';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getExtraValueMap } from '../../layout/viewmodel/hierarchy_of_arrays';\n\n/** @internal */\nexport const getLegendItemsExtra = createCustomCachedSelector(\n  [getPartitionSpec, getSettingsSpecSelector, getTrees],\n  (spec, { legendMaxDepth }, trees): Map<SeriesKey, LegendItemExtraValues> => {\n    const emptyMap = new Map<SeriesKey, LegendItemExtraValues>();\n    return spec && !Number.isNaN(legendMaxDepth) && legendMaxDepth > 0\n      ? trees.reduce((result, { tree }) => {\n          const treeData = getExtraValueMap(spec.layers, spec.valueFormatter, tree, legendMaxDepth);\n          for (const [key, value] of treeData) {\n            result.set(key, value);\n          }\n          return result;\n        }, emptyMap)\n      : emptyMap;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { getTrees } from './tree';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getLegendLabelsAndValue } from '../../layout/utils/legend_labels';\n\n/** @internal */\nexport const getLegendItemsLabels = createCustomCachedSelector(\n  [getPartitionSpecs, getSettingsSpecSelector, getTrees],\n  (specs, { legendMaxDepth, showLegend, showLegendExtra }, trees): LegendItemLabel[] =>\n    specs.flatMap(({ layers, valueFormatter }) =>\n      showLegend\n        ? trees.flatMap(({ tree }) =>\n            getLegendLabelsAndValue(layers, tree, legendMaxDepth, showLegendExtra ? valueFormatter : () => ''),\n          )\n        : [],\n    ),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecsFromStore } from '../../../../state/utils';\nimport { PartitionSpec } from '../../specs';\n\n/** @internal */\nexport const getPartitionSpecs = createCustomCachedSelector([getSpecs], (specs) => {\n  return getSpecsFromStore<PartitionSpec>(specs, ChartType.Partition, SpecType.Series);\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { partitionMultiGeometries } from './geometries';\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { STATISTICS_KEY } from '../../layout/utils/group_by_rollup';\nimport { PartitionSpec } from '../../specs';\n\n/** @internal */\nexport interface PartitionSectionData {\n  panelTitle?: string;\n  label: string;\n  parentName: string | undefined;\n  depth: number;\n  percentage: string;\n  value: number;\n  valueText: string;\n}\n\n/** @internal */\nexport interface PartitionData {\n  hasMultipleLayers: boolean;\n  isSmallMultiple: boolean;\n  data: PartitionSectionData[];\n}\n\n/**\n * @internal\n */\nconst getScreenReaderDataForPartitions = (\n  [spec]: PartitionSpec[],\n  shapeViewModels: ShapeViewModel[],\n): PartitionSectionData[] => {\n  return shapeViewModels.flatMap(({ quadViewModel, layers, panel }) =>\n    quadViewModel.map(({ depth, value, dataName, parent, path }) => {\n      const label = layers[depth - 1]?.nodeLabel?.(dataName) ?? dataName;\n      const parentValue = path.length > 1 ? path.at(-2)?.value : undefined;\n      const parentName =\n        depth > 1 && parentValue ? layers[depth - 2]?.nodeLabel?.(parentValue) ?? path.at(-1)?.value : 'none';\n\n      return {\n        panelTitle: panel.title,\n        depth,\n        label,\n        parentName,\n        percentage: `${Math.round((value / parent[STATISTICS_KEY].globalAggregate) * 100)}%`,\n        value,\n        valueText: spec?.valueFormatter ? spec.valueFormatter(value) : `${value}`,\n      };\n    }),\n  );\n};\n\n/** @internal */\nexport const getScreenReaderDataSelector = createCustomCachedSelector(\n  [getPartitionSpecs, partitionMultiGeometries],\n  (specs, shapeViewModel): PartitionData => {\n    if (specs.length === 0) {\n      return {\n        hasMultipleLayers: false,\n        isSmallMultiple: false,\n        data: [],\n      };\n    }\n    return {\n      hasMultipleLayers: (specs[0]?.layers.length ?? NaN) > 1,\n      isSmallMultiple: shapeViewModel.length > 1,\n      data: getScreenReaderDataForPartitions(specs, shapeViewModel),\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipInfoSelector } from './tooltip';\nimport { TooltipType } from '../../../../specs/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\n\n/**\n * The brush is available only for Ordinal xScales charts and\n * if we have configured an onBrushEnd listener\n * @internal\n */\nexport const isTooltipVisibleSelector = createCustomCachedSelector(\n  [getTooltipSpecSelector, getTooltipInfoSelector],\n  ({ type }, tooltipInfo): boolean => {\n    return type !== TooltipType.None && tooltipInfo.values.length > 0;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getPartitionSpec } from './partition_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementClickSelector } from '../../../../common/event_handler_selectors';\nimport { GlobalChartState, PointerStates } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastClickSelector } from '../../../../state/selectors/get_last_click';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementClick listener every time the following preconditions are met:\n * - the onElementClick listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnElementClickCaller(): (state: GlobalChartState) => void {\n  const prev: { click: PointerStates['lastClick'] } = { click: null };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Partition) {\n      selector = createCustomCachedSelector(\n        [getPartitionSpec, getLastClickSelector, getSettingsSpecSelector, getPickedShapesLayerValues],\n        getOnElementClickSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getPartitionSpec } from './partition_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementOutSelector } from '../../../../common/event_handler_selectors';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementOut listener every time the following preconditions are met:\n * - the onElementOut listener is available\n * - the highlighted geometries list goes from a list of at least one object to an empty one\n * @internal\n */\nexport function createOnElementOutCaller(): (state: GlobalChartState) => void {\n  const prev: { pickedShapes: number | null } = { pickedShapes: null };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Partition) {\n      selector = createCustomCachedSelector(\n        [getPartitionSpec, getPickedShapesLayerValues, getSettingsSpecSelector],\n        getOnElementOutSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { getPartitionSpec } from './partition_spec';\nimport { getPickedShapesLayerValues } from './picked_shapes';\nimport { ChartType } from '../../..';\nimport { getOnElementOverSelector } from '../../../../common/event_handler_selectors';\nimport { LayerValue } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * Will call the onElementOver listener every time the following preconditions are met:\n * - the onElementOver listener is available\n * - we have a new set of highlighted geometries on our state\n * @internal\n */\nexport function createOnElementOverCaller(): (state: GlobalChartState) => void {\n  const prev: { pickedShapes: LayerValue[][] } = { pickedShapes: [] };\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.Partition) {\n      selector = createCustomCachedSelector(\n        [getPartitionSpec, getPickedShapesLayerValues, getSettingsSpecSelector],\n        getOnElementOverSelector(prev),\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getSpecsFromStore, getSpecFromStore } from '../../../../state/utils';\nimport { PartitionSpec } from '../../specs';\n\n/** @internal */\nexport function getPartitionSpecs(state: GlobalChartState): PartitionSpec[] {\n  return getSpecsFromStore<PartitionSpec>(state.specs, ChartType.Partition, SpecType.Series);\n}\n\n/** @internal */\nexport function getPartitionSpec(state: GlobalChartState): PartitionSpec | null {\n  return getSpecFromStore<PartitionSpec, false>(state.specs, ChartType.Partition, SpecType.Series, false);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getActivePointerPosition } from './../../../../state/selectors/get_active_pointer_position';\nimport { partitionDrilldownFocus, partitionMultiGeometries } from './geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { pickedShapes, pickShapesLayerValues } from '../../layout/viewmodel/picked_shapes';\n\n/** @internal */\nexport const getPickedShapes = createCustomCachedSelector(\n  [partitionMultiGeometries, getActivePointerPosition, partitionDrilldownFocus],\n  pickedShapes,\n);\n\n/** @internal */\nexport const getPickedShapesLayerValues = createCustomCachedSelector([getPickedShapes], pickShapesLayerValues);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { partitionMultiGeometries } from './geometries';\nimport { getPartitionSpec } from './partition_spec';\nimport { getPickedShapes } from './picked_shapes';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { pickShapesTooltipValues } from '../../layout/viewmodel/picked_shapes';\n\nconst EMPTY_TOOLTIP = Object.freeze({ header: null, values: [] });\n\n/** @internal */\nexport const getTooltipInfoSelector = createCustomCachedSelector(\n  [getPartitionSpec, getPickedShapes, partitionMultiGeometries],\n  (spec, pickedShapes, shapeViewModel): TooltipInfo => {\n    return spec\n      ? pickShapesTooltipValues(pickedShapes, shapeViewModel, spec.valueFormatter, spec.percentFormatter, spec.id)\n      : EMPTY_TOOLTIP;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPartitionSpecs } from './get_partition_specs';\nimport { ChartType } from '../../..';\nimport { getPredicateFn } from '../../../../common/predicate';\nimport {\n  DEFAULT_SM_PANEL_PADDING,\n  GroupByAccessor,\n  GroupBySpec,\n  SmallMultiplesSpec,\n  SmallMultiplesStyle,\n  SpecType,\n} from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getSmallMultiplesSpecs } from '../../../../state/selectors/get_small_multiples_spec';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecsFromStore } from '../../../../state/utils';\nimport { Datum } from '../../../../utils/common';\nimport { HierarchyOfArrays, NULL_SMALL_MULTIPLES_KEY } from '../../layout/utils/group_by_rollup';\nimport { partitionTree } from '../../layout/viewmodel/hierarchy_of_arrays';\nimport { PartitionSpec } from '../../specs';\n\nconst getGroupBySpecs = createCustomCachedSelector([getSpecs], (specs) =>\n  getSpecsFromStore<GroupBySpec>(specs, ChartType.Global, SpecType.IndexOrder),\n);\n\n/** @internal */\nexport type StyledTree = {\n  smAccessorValue: ReturnType<GroupByAccessor>;\n  name: string;\n  style: SmallMultiplesStyle;\n  tree: HierarchyOfArrays;\n};\n\nfunction getTreesForSpec(\n  spec: PartitionSpec,\n  smSpecs: SmallMultiplesSpec[],\n  groupBySpecs: GroupBySpec[],\n  locale: string,\n): StyledTree[] {\n  const { layout, data, valueAccessor, layers, smallMultiples: smId } = spec;\n  const smSpec = smSpecs.find((s) => s.id === smId);\n  const smStyle: SmallMultiplesStyle = {\n    horizontalPanelPadding: smSpec\n      ? smSpec.style?.horizontalPanelPadding ?? DEFAULT_SM_PANEL_PADDING\n      : { outer: 0, inner: 0 },\n    verticalPanelPadding: smSpec\n      ? smSpec.style?.verticalPanelPadding ?? DEFAULT_SM_PANEL_PADDING\n      : { outer: 0, inner: 0 },\n  };\n  const groupBySpec = groupBySpecs.find(\n    (s) => s.id === smSpec?.splitHorizontally || s.id === smSpec?.splitVertically || s.id === smSpec?.splitZigzag,\n  );\n\n  if (groupBySpec) {\n    const { by, sort, format = (name) => String(name) } = groupBySpec;\n    const accessorSpec = { id: spec.id, chartType: spec.chartType, specType: SpecType.Series };\n    const groups = data.reduce((map: Map<ReturnType<GroupByAccessor>, Datum[]>, next) => {\n      const groupingValue = by(accessorSpec, next);\n      const preexistingGroup = map.get(groupingValue);\n      const group = preexistingGroup ?? [];\n      if (!preexistingGroup) map.set(groupingValue, group);\n      group.push(next);\n      return map;\n    }, new Map<string, HierarchyOfArrays>());\n    return [...groups].sort(getPredicateFn(sort, locale)).map(([groupKey, subData], innerIndex) => ({\n      name: format(groupKey),\n      smAccessorValue: groupKey,\n      style: smStyle,\n      tree: partitionTree(subData, valueAccessor, layers, layout, [{ index: innerIndex, value: String(groupKey) }]),\n    }));\n  } else {\n    return [\n      {\n        name: '',\n        smAccessorValue: '',\n        style: smStyle,\n        tree: partitionTree(data, valueAccessor, layers, layout, [\n          {\n            index: 0,\n            value: NULL_SMALL_MULTIPLES_KEY,\n          },\n        ]),\n      },\n    ];\n  }\n}\n\n/** @internal */\nexport const getTrees = createCustomCachedSelector(\n  [getPartitionSpecs, getSmallMultiplesSpecs, getGroupBySpecs, getSettingsSpecSelector],\n  ([spec], smallMultiplesSpecs, groupBySpecs, { locale }): StyledTree[] =>\n    spec ? getTreesForSpec(spec, smallMultiplesSpecs, groupBySpecs, locale) : [],\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport {\n  AreaSeries,\n  AreaSeriesProps,\n  Axis,\n  AxisProps,\n  BarSeries,\n  BarSeriesProps,\n  BubbleSeries,\n  BubbleSeriesProps,\n  HistogramBarSeries,\n  HistogramBarSeriesProps,\n  LineAnnotation,\n  LineAnnotationProps,\n  LineSeries,\n  LineSeriesProps,\n  RectAnnotation,\n  RectAnnotationProps,\n} from './xy_chart/specs';\n\nexport * from './xy_chart/utils/specs';\n\nexport * from './wordcloud/specs';\n\nexport * from './goal_chart/specs';\n\nexport { Partition } from './partition_chart/specs';\n\nexport { Heatmap, HeatmapSpec, RasterTimeScale, TimeScale, LinearScale, OrdinalScale } from './heatmap/specs';\n\nexport {\n  Metric,\n  MetricSpecProps,\n  MetricSpec,\n  MetricBase,\n  MetricWText,\n  MetricWNumber,\n  MetricWProgress,\n  MetricWTrend,\n  MetricTrendShape,\n  MetricDatum,\n} from './metric/specs';\n\nexport { Bullet, BulletProps, BulletSpec, BulletDatum, BulletSubtype, BulletValueLabels } from './bullet_graph/spec';\nexport { BulletStyle } from './bullet_graph/theme';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TimeslipWithTooltip } from './timeslip_chart';\nimport { ChartType } from '..';\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { LegendItemExtraValues } from '../../common/legend';\nimport { SeriesKey } from '../../common/series_id';\nimport { InternalChartState } from '../../state/chart_state';\nimport { InitStatus } from '../../state/selectors/get_internal_is_intialized';\n\n/** @internal */\nexport class TimeslipState implements InternalChartState {\n  chartType = ChartType.Timeslip;\n  getChartTypeDescription = () => 'Timeslip chart';\n  chartRenderer = TimeslipWithTooltip;\n\n  // default empty properties, unused in Timeslip\n  eventCallbacks = () => {};\n  isInitialized = () => InitStatus.Initialized;\n  isBrushAvailable = () => false;\n  isBrushing = () => false;\n  isChartEmpty = () => false;\n  getLegendItemsLabels = () => [];\n  getLegendItems = () => [];\n  getLegendExtraValues = () => new Map<SeriesKey, LegendItemExtraValues>();\n  getPointerCursor = () => DEFAULT_CSS_CURSOR;\n  getTooltipAnchor = () => ({ x: 0, y: 0, width: 0, height: 0 });\n  isTooltipVisible = () => ({\n    visible: false,\n    isExternal: false,\n    displayOnly: false,\n    isPinnable: false,\n  });\n\n  getTooltipInfo = () => ({ header: null, values: [] });\n  getProjectionContainerArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getMainProjectionArea = () => ({ width: 0, height: 0, top: 0, left: 0 });\n  getBrushArea = () => null;\n  getDebugState = () => ({});\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isDefined } from '../../../utils/common';\n\n/** @internal */\nexport const oneTwoFive = (mantissa: number) => (mantissa > 5 ? 10 : mantissa > 2 ? 5 : mantissa > 1 ? 2 : 1);\n/** @internal */\nexport const oneFive = (mantissa: number) => (mantissa > 5 ? 10 : mantissa > 1 ? 5 : 1);\n\nconst getNiceTicksForApproxCount = (\n  domainMin: number,\n  domainMax: number,\n  approxDesiredTickCount: number,\n  mantissaFun = oneTwoFive,\n) => {\n  const diff = domainMax - domainMin;\n  const rawPitch = diff / approxDesiredTickCount;\n  const exponent = Math.floor(Math.log10(rawPitch));\n  const orderOfMagnitude = 10 ** exponent; // this represents the order of magnitude eg. 10000, so that...\n  const mantissa = rawPitch / orderOfMagnitude; // it's always the case that 1 <= mantissa <= 9.99999999999\n  const niceMantissa = mantissaFun(mantissa); // snap to 10, 5, 2 or 1\n  const tickInterval = niceMantissa * orderOfMagnitude;\n  if (!isFinite(tickInterval)) {\n    return [];\n  }\n  const result = [];\n  for (let i = Math.floor(domainMin / tickInterval); i <= Math.ceil(domainMax / tickInterval); i++) {\n    result.push(i * tickInterval);\n  }\n  return result;\n};\n\n/** @internal */\nexport const getDecimalTicks = (\n  domainMin: number,\n  domainMax: number,\n  maximumTickCount: number,\n  mantissaFun = oneTwoFive,\n): number[] => {\n  let bestCandidate: number[] = [];\n  for (let i = 0; i <= maximumTickCount; i++) {\n    const candidate = getNiceTicksForApproxCount(domainMin, domainMax, maximumTickCount - i, mantissaFun);\n    if (candidate.length <= maximumTickCount && candidate.length > 0) return candidate;\n    if (bestCandidate.length === 0 || maximumTickCount - candidate.length < maximumTickCount - bestCandidate.length) {\n      bestCandidate = candidate;\n    }\n  }\n  return bestCandidate.length > maximumTickCount\n    ? [...(maximumTickCount > 1 && isDefined(bestCandidate[0]) ? [bestCandidate[0]] : []), bestCandidate.at(-1) ?? NaN]\n    : [];\n};\n\n/** @internal */\nexport const axisModel = (\n  domainLandmarks: number[],\n  desiredTickCount: number,\n): { niceDomainMin: number; niceDomainMax: number; niceTicks: number[] } => {\n  const domainMin = Math.min(...domainLandmarks);\n  const domainMax = Math.max(...domainLandmarks);\n  const niceTicks = getDecimalTicks(domainMin, domainMax, desiredTickCount);\n  const niceDomainMin = niceTicks.length >= 2 ? niceTicks[0]! : domainMin;\n  const niceDomainMax = niceTicks.length >= 2 ? niceTicks.at(-1)! : domainMax;\n  return { niceDomainMin, niceDomainMax, niceTicks };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { mix } from '../utils/math';\n\nconst REFERENCE_AF_LENGTH = 16.67; // ms\nconst REFERENCE_Y_RECURRENCE_ALPHA = 0.1;\nconst TWEEN_DONE_EPSILON = 0.001;\n\n/** @internal */\nexport const domainTween = (\n  interactionState: { niceDomainMin: number; niceDomainMax: number },\n  deltaT: number,\n  targetMin: number,\n  targetMax: number,\n) => {\n  const { niceDomainMin: currentMin, niceDomainMax: currentMax } = interactionState;\n\n  // pure logic\n  const speedExp = Math.pow((currentMax - currentMin) / (targetMax - targetMin), 0.2); // speeds up big decreases\n  const advance = 1 - (1 - REFERENCE_Y_RECURRENCE_ALPHA) ** ((speedExp * deltaT) / REFERENCE_AF_LENGTH);\n  const min = Number.isFinite(currentMin) ? mix(currentMin, targetMin, advance) : targetMin;\n  const max = Number.isFinite(currentMax) ? mix(currentMax, targetMax, advance) : targetMax;\n  const tweenIncomplete = Math.abs(1 - (max - min) / (targetMax - targetMin)) > TWEEN_DONE_EPSILON;\n\n  // remember\n  interactionState.niceDomainMin = min;\n  interactionState.niceDomainMax = max;\n\n  return tweenIncomplete;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const getDesiredTickCount = (cartesianHeight: number, fontSize: number, sparse: boolean) => {\n  const desiredMaxTickCount = Math.floor(cartesianHeight / (3 * fontSize));\n  return sparse ? 1 + Math.ceil(Math.pow(desiredMaxTickCount, 0.25)) : 1 + Math.ceil(Math.sqrt(desiredMaxTickCount));\n};\n\n/** @internal */\nexport type NumericScale = (n: number) => number;\n\n/** @internal */\nexport const makeLinearScale = (\n  domainFrom: number,\n  domainTo: number,\n  rangeFrom: number,\n  rangeTo: number,\n): NumericScale => {\n  const domainExtent = domainTo - domainFrom;\n  const rangeExtent = rangeTo - rangeFrom;\n  const scale = rangeExtent / domainExtent;\n  const offset = rangeFrom - scale * domainFrom;\n  return (d: number) => offset + scale * d;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { clamp, mix, unitClamp } from '../utils/math';\n\nconst VELOCITY_THRESHOLD = 0.01;\nconst DRAG_VELOCITY_ATTENUATION = 0.92; // these two change together: the kinetic friction deceleration from a click drag, and from a wheel drag should match\nconst INITIAL_ZOOM = 5.248;\nconst INITIAL_PAN = 0.961; // doesn't matter if INITIAL_ZOOM is 0, this is just a ratio\n\ninterface Focus {\n  zoom: number; // Exponential: 0: full domain is in view; 1: half, 2: quarter, ie. the visible view is a 1 / 2^zoom multiple of the full domain\n  pan: number; // 0: left side of focus is flush with the left side of the full domain, given zoom level, 1: right side of focus is flush with the right side of the full domain\n}\n\n/** @internal */\nexport interface ZoomPan {\n  focus: Focus;\n  flyVelocity: number;\n\n  // interaction auxiliary state\n  focusStart: Focus;\n  dragStartPosition: number;\n\n  // kinetic pan gesture state\n  lastDragPosition: number;\n  dragVelocity: number;\n}\n\n/** @internal */\nexport const initialZoomPan = () => ({\n  focus: { zoom: INITIAL_ZOOM, pan: INITIAL_PAN },\n  flyVelocity: NaN,\n  focusStart: { zoom: NaN, pan: NaN },\n  dragStartPosition: NaN,\n  lastDragPosition: NaN,\n  dragVelocity: NaN,\n});\n\n/**\n * What's essential about zooming and panning?\n *\n * Conceptual cornerstone elements:\n *   - Reference domain: a connected subset of a totally ordered set, which represents the entire domain relative to which we can zoom and pan.\n *       Examples: a time interval, real interval, integer interval, or a finite ordinal set eg. Jan-Dec categories, Likert scale etc.\n *       Note that while the Domain represents the reference interval, it's possible to zoom outside the domain, unless constrained\n *   - Focus: it is also a connected subset of a totally ordered set\n *\n * Derivable elements:\n *   - Zoom: a number such that (referenceDomainTo - referenceDomainFrom) * 1 / 2^zoom represents the currently focused domain\n *   - Pan: 0: left side of focus is flush with the left side of the reference domain, given zoom level, 1: right side of focus is flush with the right side of the reference domain\n *\n *    Note that while these are derivable, it's also legit to directly control zoom and pan, and derive the focus domain from that and the reference domain, like map zoom/pan\n *\n * Desirable properties:\n *   - resolution invariance: should not know anything about pixel sizes of the focus, or pixel length of the drag interaction\n *   - underlying domain invariance: should work with time, reals, integers, ordinals (incl. ordered categories)\n *   - reference domain from/to invariance? possible with zoom&pan but maybe it's not the final say\n *   - nicely integrate with the scale function\n */\n\nconst ZOOM_MIN = 0; // 0 means, entire reference view\nconst ZOOM_MAX = 35; // 35 means, reference domain divided by 2^35\nconst PAN_MIN = 0; // 0 means, cannot breach the left side of the reference domain\nconst PAN_MAX = 1; // 1 means, cannot breach the right side of the reference domain\n\nconst zoomToMultiplier = (zoom: number) => 1 / 2 ** zoom;\n\n/** @internal */\nexport const multiplierToZoom = (multiplier: number): number => Math.log2(1 / multiplier);\n\nconst getFocusDomainRatio = (zoom: number) => 1 / (1 - zoomToMultiplier(zoom)) - 1;\nconst clampZoom = (zoom: number) => clamp(zoom, ZOOM_MIN, ZOOM_MAX) || 0;\nconst clampPan = (pan: number) => clamp(pan, PAN_MIN, PAN_MAX) || 0;\n\nconst setPan = (focus: Focus, pan: number) => (focus.pan = pan);\n\nconst setZoomPan = (focus: Focus, newZoomPan: Focus) => Object.assign(focus, newZoomPan);\n\nconst getFocusForNewZoom = (focus: Focus, pointerUnitLocation: number, newZoom: number, panDelta: number) => {\n  const oldInvisibleFraction = 1 - zoomToMultiplier(focus.zoom);\n  const zoom = clampZoom(newZoom);\n  const newInvisibleFraction = 1 - zoomToMultiplier(zoom);\n  const requestedPan = mix(pointerUnitLocation + panDelta, focus.pan, oldInvisibleFraction / newInvisibleFraction);\n  const pan = clampPan(requestedPan);\n  return { zoom, pan };\n};\n\nconst getPanFromDelta = (focus: Focus, panStart: number, relativeDelta: number) => {\n  const panDeltaPerDrag = getFocusDomainRatio(focus.zoom);\n  const panDifference = panDeltaPerDrag * relativeDelta;\n  return clampPan(panStart - panDifference);\n};\n\n/** @internal */\nexport const doPanFromJumpDelta = (zoomPan: ZoomPan, normalizedDeltaPan: number) => {\n  const deltaPan = zoomToMultiplier(zoomPan.focus.zoom) * normalizedDeltaPan;\n  const newPan = clampPan(zoomPan.focus.pan + deltaPan);\n\n  setPan(zoomPan.focus, newPan);\n};\n\n/** @internal */\nexport const doZoomFromJumpDelta = (zoomPan: ZoomPan, normalizedDeltaZoom: number, center: number) => {\n  const newZoom = zoomPan.focus.zoom + normalizedDeltaZoom;\n  const newZoomPan = getFocusForNewZoom(zoomPan.focus, center, newZoom, 0);\n\n  setZoomPan(zoomPan.focus, newZoomPan);\n};\n\n/** @internal */\nexport const doZoomAroundPosition = (\n  zoomPan: ZoomPan,\n  { innerSize: cartesianWidth, innerLeading: cartesianLeft }: { innerSize: number; innerLeading: number },\n  center: number,\n  zoomChange: number,\n  panDelta: number,\n  touch: boolean,\n) => {\n  const unitZoomCenter = unitClamp((center - cartesianLeft) / cartesianWidth);\n  const base = touch ? zoomPan.focusStart.zoom : zoomPan.focus.zoom;\n  const newZoomPan = getFocusForNewZoom(zoomPan.focus, unitZoomCenter, base + zoomChange, panDelta);\n\n  setZoomPan(zoomPan.focus, newZoomPan);\n};\n\n/** @internal */\nexport const kineticFlywheel = (zoomPan: ZoomPan, size: number) => {\n  const velocity = zoomPan.flyVelocity;\n  const needsViewUpdate = Math.abs(velocity) > VELOCITY_THRESHOLD;\n  if (needsViewUpdate) {\n    const newPan = getPanFromDelta(zoomPan.focus, zoomPan.focus.pan, velocity / size);\n    setPan(zoomPan.focus, newPan);\n    zoomPan.flyVelocity *= DRAG_VELOCITY_ATTENUATION;\n  } else {\n    zoomPan.flyVelocity = NaN;\n  }\n  return needsViewUpdate;\n};\n\n/** @internal */\nexport const getFocusDomain = (zoomPan: ZoomPan, referenceDomainFrom: number, referenceDomainTo: number) => {\n  const { zoom, pan } = zoomPan.focus;\n  const referenceDomainExtent = referenceDomainTo - referenceDomainFrom;\n  const focusDomainExtent = referenceDomainExtent * zoomToMultiplier(zoom);\n  const leeway = referenceDomainExtent - focusDomainExtent;\n  const domainFrom = referenceDomainFrom + pan * leeway;\n  const domainTo = referenceDomainTo - (1 - pan) * leeway;\n  return { domainFrom, domainTo };\n};\n\n/** @internal */\nexport const markDragStartPosition = (zoomPan: ZoomPan, position: number) => {\n  zoomPan.dragStartPosition = position;\n  zoomPan.lastDragPosition = position;\n  zoomPan.dragVelocity = NaN;\n  zoomPan.flyVelocity = NaN;\n  zoomPan.focusStart.pan = zoomPan.focus.pan;\n};\n\n/** @internal */\nexport const endDrag = (zoomPan: ZoomPan) => {\n  zoomPan.flyVelocity = zoomPan.dragVelocity;\n  zoomPan.dragVelocity = NaN;\n  zoomPan.dragStartPosition = NaN;\n  zoomPan.focusStart.pan = NaN;\n};\n\n/** @internal */\nexport const doPanFromPosition = (zoomPan: ZoomPan, innerSize: number, currentPosition: number) => {\n  const positionDelta = currentPosition - zoomPan.lastDragPosition;\n  const { dragVelocity } = zoomPan;\n  zoomPan.dragVelocity =\n    positionDelta * dragVelocity > 0 && Math.abs(positionDelta) < Math.abs(dragVelocity)\n      ? dragVelocity // mix(dragVelocity, positionDelta, 0.04)\n      : positionDelta;\n  zoomPan.lastDragPosition = currentPosition;\n  const delta = currentPosition - zoomPan.dragStartPosition;\n  const newPan = getPanFromDelta(zoomPan.focus, zoomPan.focusStart.pan, delta / innerSize);\n  setPan(zoomPan.focus, newPan);\n};\n\n/** @internal */\nexport const startTouchZoom = (zoomPan: ZoomPan) => (zoomPan.focusStart.zoom = zoomPan.focus.zoom);\n\n/** @internal */\nexport const resetTouchZoom = (zoomPan: ZoomPan) => (zoomPan.focusStart.zoom = NaN);\n\n/** @internal */\nexport const touchOngoing = (zoomPan: ZoomPan) => Number.isFinite(zoomPan.focusStart.pan);\n\n/** @internal */\nexport const panOngoing = (zoomPan: ZoomPan) => Number.isFinite(zoomPan.dragStartPosition);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LocaleOptions } from './render/annotations/time_extent';\nimport { getValidatedTimeZone, getZoneFromSpecs } from '../../../utils/time_zone';\nimport { cachedZonedDateTimeFrom, TimeProp } from '../../xy_chart/axes/timeslip/chrono/cached_chrono';\nimport { RasterConfig, TimeFormatter } from '../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { MINIMUM_TICK_PIXEL_DISTANCE } from '../../xy_chart/axes/timeslip/multilayer_ticks';\n\n/** @internal */\nexport type AxisType = 'continuousTime' | 'continuousNumeric';\n\n/** @internal */\nexport const HORIZONTAL_AXIS: AxisType = 'continuousTime';\n\nconst initialDarkMode = false;\n\n/** @internal */\nexport const drawCartesianBox = false;\n\n// these are hand tweaked constants that fulfill various design constraints, let's discuss before changing them\nconst lineThicknessSteps = [/*0,*/ 0.5, 0.75, 1, 1, 1, 1.25, 1.25, 1.5, 1.5, 1.75, 1.75, 2, 2, 2, 2, 2];\nconst lumaSteps = [/*255,*/ 192, 72, 32, 16, 8, 4, 2, 1, 0, 0, 0, 0, 0, 0, 0, 0];\nconst smallFontSize = 12;\n\n/** @internal */\nexport const timeZone = getValidatedTimeZone(getZoneFromSpecs([])); // should eventually come from settings\ntype RGBObject = { r: number; g: number; b: number };\n\ninterface TimeslipTheme {\n  defaultFontColor: string;\n  subduedFontColor: string;\n  offHourFontColor: string;\n  weekendFontColor: string;\n  backgroundColor: RGBObject;\n  lumaSteps: number[];\n}\n\nconst themeLight: TimeslipTheme = {\n  defaultFontColor: 'black',\n  subduedFontColor: '#393939',\n  offHourFontColor: 'black',\n  weekendFontColor: 'darkred',\n  backgroundColor: { r: 255, g: 255, b: 255 },\n  lumaSteps,\n};\n\nconst themeDark: TimeslipTheme = {\n  defaultFontColor: 'white',\n  subduedFontColor: 'darkgrey',\n  offHourFontColor: 'white',\n  weekendFontColor: 'indianred',\n  backgroundColor: { r: 0, g: 0, b: 0 },\n  lumaSteps: lumaSteps.map((l) => 255 - l),\n};\n\ntype CompactDisplay = 'short' | 'long'; // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat\n\n/** @internal */\nexport interface TimeslipConfig extends TimeslipTheme, RasterConfig {\n  darkMode: boolean;\n  sparse: false;\n  implicit: false;\n  maxLabelRowCount: 1 | 2 | 3;\n  a11y: { contrast: 'low' | 'medium' | 'high' };\n  numUnit: CompactDisplay | 'none';\n  barChroma: RGBObject;\n  barFillAlpha: number;\n  lineThicknessSteps: number[];\n  domainFrom: number;\n  domainTo: number;\n  smallFontSize: number;\n  cssFontShorthand: string;\n  monospacedFontShorthand: string;\n  rowPixelPitch: number;\n  horizontalPixelOffset: number;\n  verticalPixelOffset: number;\n  clipLeft: boolean;\n  clipRight: boolean;\n  yTickOverhang: number;\n  yTickGap: number;\n}\n\n/** @internal */\nexport const rasterConfig: RasterConfig = {\n  minimumTickPixelDistance: MINIMUM_TICK_PIXEL_DISTANCE,\n  locale: 'en-US',\n};\n\n/** @internal */\nexport const config: TimeslipConfig = {\n  darkMode: initialDarkMode,\n  ...(initialDarkMode ? themeDark : themeLight),\n  ...rasterConfig,\n  sparse: false,\n  implicit: false,\n  maxLabelRowCount: 2, // can be 1, 2, 3\n  a11y: {\n    contrast: 'medium',\n  },\n  numUnit: 'short',\n  barChroma: { r: 96, g: 146, b: 192 },\n  barFillAlpha: 0.3,\n  lineThicknessSteps,\n  domainFrom: cachedZonedDateTimeFrom({ timeZone, year: 2002, month: 1, day: 1 })[TimeProp.EpochSeconds],\n  domainTo: cachedZonedDateTimeFrom({ timeZone, year: 2022, month: 1, day: 1 })[TimeProp.EpochSeconds],\n  smallFontSize,\n  cssFontShorthand: `normal normal 100 ${smallFontSize}px Inter, Helvetica, Arial, sans-serif`,\n  monospacedFontShorthand: `normal normal 100 ${smallFontSize}px \"Roboto Mono\", Consolas, Menlo, Courier, monospace`,\n  rowPixelPitch: 16,\n  horizontalPixelOffset: 4,\n  verticalPixelOffset: 6,\n  clipLeft: true,\n  clipRight: true,\n  yTickOverhang: 8,\n  yTickGap: 8,\n};\n\n/**\n * constants for Y\n * @internal\n */\nexport const ZERO_Y_BASE = true;\n/** @internal */\nexport const horizontalCartesianAreaPad: [number, number] = [0.04, 0.04];\n/** @internal */\nexport const verticalCartesianAreaPad: [number, number] = [0.3, 0.12];\n/** @internal */\nexport const localeOptions: LocaleOptions = {\n  hour12: false,\n  year: 'numeric',\n  month: 'short',\n  day: '2-digit',\n  hour: '2-digit',\n  minute: '2-digit',\n  second: '2-digit',\n};\n\nconst defaultLabelFormatter = new Intl.DateTimeFormat(config.locale, {\n  weekday: 'short',\n  hour: 'numeric',\n  minute: 'numeric',\n  timeZone,\n});\n/**\n * todo this may need an update with locale change\n * @internal\n */\nexport const defaultLabelFormat: TimeFormatter = (value) => defaultLabelFormatter.format(value);\n\nconst defaultMinorTickLabelFormatter = new Intl.DateTimeFormat(config.locale, {\n  weekday: 'short',\n  hour: 'numeric',\n  minute: 'numeric',\n  timeZone,\n});\n/**\n * todo this may need an update with locale change\n * @internal\n */\nexport const defaultMinorTickLabelFormat: TimeFormatter = (value) => defaultMinorTickLabelFormatter.format(value);\n\n/** @internal */\nexport const fadeOutPixelWidth = 12; // todo add to config\n\n/** @internal */\nexport const chartTopFontSize = config.smallFontSize + 2; // todo move to config\nconst background = config.backgroundColor;\n\n/** @internal */\nexport const backgroundFillStyle = `rgba(${background.r},${background.g},${background.b},1)`;\n\n/** @internal */\nexport const wheelPanVelocity = 1;\n\n/** @internal */\nexport const wheelZoomVelocity = 2; // zoom is usually centered, so with 1 the apparent speed is half, compared to wheelPan\n\n/** @internal */\nexport const keyZoomVelocityDivisor = 2; // 1 means, on each up/down keypress, double/halve the visible time domain\n\n/** @internal */\nexport const keyPanVelocityDivisor = 10; // 1 means, on each left/right keypress, move the whole of current visible time domain\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const getEnrichedData = (rows: { epochMs: number; value?: number }[]) => {\n  const stats = rows.reduce(\n    (p, { epochMs, value }) => {\n      const { minEpochMs, maxEpochMs, minValue, maxValue } = p;\n      p.minEpochMs = Math.min(minEpochMs, epochMs);\n      p.maxEpochMs = Math.max(maxEpochMs, epochMs);\n      p.minValue = Math.min(minValue, value ?? minValue);\n      p.maxValue = Math.max(maxValue, value ?? maxValue);\n      return p;\n    },\n    {\n      minEpochMs: Infinity,\n      maxEpochMs: -Infinity,\n      minValue: Infinity,\n      maxValue: -Infinity,\n    },\n  );\n  return { rows, stats };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DataDemand } from './render/cartesian';\nimport { BoxplotRow } from './render/glyphs/boxplot';\nimport { BinUnit, Interval } from '../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { GetData } from '../timeslip_api';\n\ntype DataResponse = { stats: { minValue: number; maxValue: number }; rows: TimeslipDataRows };\n\n/** @public */\nexport type TimeslipDataRows = Array<{ epochMs: number; boxplot?: BoxplotRow['boxplot']; value?: number }>;\n\n/** @internal */\nexport interface DataState {\n  valid: boolean;\n  pending: boolean;\n  lo: (Interval & Partial<Record<BinUnit, number>>) | null;\n  hi: (Interval & Partial<Record<BinUnit, number>>) | null;\n  binUnit: BinUnit;\n  binUnitCount: number;\n  dataResponse: DataResponse;\n}\n\n/** @internal */\nexport const invalid = (dataState: DataState, dataDemand: DataDemand) =>\n  !dataState.valid ||\n  dataState.binUnit !== dataDemand.binUnit ||\n  dataState.binUnitCount !== dataDemand.binUnitCount ||\n  (dataDemand.lo?.minimum ?? -Infinity) < (dataState.lo?.minimum ?? -Infinity) ||\n  (dataDemand.hi?.minimum ?? Infinity) > (dataState.hi?.minimum ?? Infinity);\n\n/** @internal */\nexport const updateDataState = (\n  dataState: DataState,\n  dataDemand: Parameters<GetData>[0],\n  dataResponse: DataResponse,\n) => {\n  dataState.pending = false;\n  dataState.valid = true;\n  dataState.lo = dataDemand.lo;\n  dataState.hi = dataDemand.hi;\n  dataState.binUnit = dataDemand.binUnit;\n  dataState.binUnitCount = dataDemand.binUnitCount;\n  dataState.dataResponse = dataResponse;\n};\n\n/** @internal */\nexport const getNullDataState = (): DataState => ({\n  valid: false,\n  pending: false,\n  lo: { minimum: Infinity, supremum: Infinity, labelSupremum: Infinity },\n  hi: { minimum: -Infinity, supremum: -Infinity, labelSupremum: -Infinity },\n  binUnit: 'year',\n  binUnitCount: NaN,\n  dataResponse: { stats: { minValue: NaN, maxValue: NaN }, rows: [] },\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function renderChartTitle(ctx: CanvasRenderingContext2D, fontColor: string, chartWidth: number) {\n  ctx.save();\n  const titleFontSize = 32; // todo move to config\n  ctx.textBaseline = 'top';\n  ctx.textAlign = 'center';\n  ctx.font = `normal normal 200 ${titleFontSize}px Inter, Helvetica, Arial, sans-serif`; // todo move to config\n  ctx.fillStyle = fontColor;\n  ctx.fillText('machine.ram', chartWidth / 2, titleFontSize * 0.5);\n  ctx.fillText('KiB', chartWidth / 2, titleFontSize * 1.5);\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport type LocaleOptions = Parameters<Date['toLocaleString']>[1];\n\n/** @internal */\nexport function renderTimeExtentAnnotation(\n  ctx: CanvasRenderingContext2D,\n  config: { locale: string; monospacedFontShorthand: string; subduedFontColor: string },\n  localeOptions: LocaleOptions,\n  { domainFrom, domainTo }: { domainFrom: number; domainTo: number },\n  cartesianWidth: number,\n  yOffset: number,\n) {\n  ctx.save();\n  ctx.textBaseline = 'bottom';\n  ctx.textAlign = 'right';\n  ctx.font = config.monospacedFontShorthand;\n  ctx.fillStyle = config.subduedFontColor;\n  // todo switch to new Intl.DateTimeFormat for more performance https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat\n  ctx.fillText(\n    `${new Date(domainFrom * 1000).toLocaleString(config.locale, localeOptions)} — ${new Date(\n      domainTo * 1000,\n    ).toLocaleString(config.locale, localeOptions)}`,\n    cartesianWidth,\n    yOffset,\n  );\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BinUnit } from '../../../../xy_chart/axes/timeslip/continuous_time_rasters';\n\n/** @internal */\nconst LOCALE_TRANSLATIONS = {\n  bar: 'bar',\n  year: ['year', 'years'],\n  month: ['month', 'months'],\n  week: ['week', 'weeks'],\n  day: ['day', 'days'],\n  hour: ['hour', 'hours'],\n  minute: ['minute', 'minutes'],\n  second: ['second', 'seconds'],\n  millisecond: ['millisecond', 'milliseconds'],\n  one: ['', ''],\n};\n\n/** @internal */\nexport function renderTimeUnitAnnotation(\n  ctx: CanvasRenderingContext2D,\n  config: {\n    monospacedFontShorthand: string;\n    subduedFontColor: string;\n    defaultFontColor: string;\n    a11y: { contrast: 'low' | 'medium' | 'high' };\n  },\n  binUnitCount: number,\n  binUnit: BinUnit,\n  chartTopFontSize: number,\n  yOffset: number,\n  unitBarMaxWidthPixels: number,\n) {\n  const unitBarY = yOffset - chartTopFontSize * 1.7;\n\n  ctx.save();\n  ctx.textBaseline = 'bottom';\n  ctx.textAlign = 'left';\n  ctx.font = config.monospacedFontShorthand;\n  ctx.fillStyle = config.a11y.contrast === 'low' ? config.subduedFontColor : config.defaultFontColor;\n  ctx.fillText(\n    `1 ${LOCALE_TRANSLATIONS.bar} = ${binUnitCount} ${LOCALE_TRANSLATIONS[binUnit][binUnitCount === 1 ? 0 : 1]}`,\n    0,\n    yOffset,\n  );\n  ctx.fillRect(0, unitBarY, unitBarMaxWidthPixels, 1);\n  ctx.fillRect(0, unitBarY - 3, 1, 7);\n  ctx.fillRect(unitBarMaxWidthPixels - 1, unitBarY - 3, 1, 7);\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderRaster } from './raster';\nimport {\n  BinUnit,\n  NumberFormatter,\n  continuousTimeRasters,\n  Interval,\n  TimeFormatter,\n} from '../../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { MAX_TIME_TICK_COUNT, notTooDense } from '../../../xy_chart/axes/timeslip/multilayer_ticks';\nimport { makeLinearScale, NumericScale } from '../../projections/scale';\nimport { TimeslipConfig } from '../config';\nimport { DataState } from '../data_fetch';\n\n/** @public */\nexport type DataDemand = {\n  lo: Interval | null;\n  hi: Interval | null;\n  binUnit: BinUnit;\n  binUnitCount: number;\n  unitBarMaxWidthPixels: number;\n};\n\n/** @internal */\nexport const renderCartesian = (\n  ctx: CanvasRenderingContext2D,\n  config: TimeslipConfig,\n  dataState: DataState,\n  defaultMinorTickLabelFormat: TimeFormatter,\n  emWidth: number,\n  fadeOutPixelWidth: number,\n  defaultLabelFormat: TimeFormatter,\n  yTickNumberFormatter: NumberFormatter,\n  rasterSelector: ReturnType<typeof continuousTimeRasters>,\n  cartesianWidth: number,\n  cartesianHeight: number,\n  { domainFrom, domainTo }: { domainFrom: number; domainTo: number },\n  yUnitScale: NumericScale,\n  niceTicks: number[],\n): DataDemand => {\n  ctx.textBaseline = 'top';\n  ctx.fillStyle = config.defaultFontColor;\n  ctx.font = config.cssFontShorthand;\n  ctx.textAlign = 'left';\n\n  const getPixelX = makeLinearScale(domainFrom, domainTo, 0, cartesianWidth);\n  const layers = rasterSelector(notTooDense(domainFrom, domainTo, 0, cartesianWidth, MAX_TIME_TICK_COUNT));\n\n  const loHi = layers.reduce(\n    renderRaster(\n      ctx,\n      config,\n      dataState,\n      fadeOutPixelWidth,\n      emWidth,\n      defaultMinorTickLabelFormat,\n      defaultLabelFormat,\n      yTickNumberFormatter,\n      domainFrom,\n      domainTo,\n      getPixelX,\n      cartesianWidth,\n      cartesianHeight,\n      niceTicks,\n      yUnitScale,\n      layers,\n    ),\n    { lo: null, hi: null, unitBarMaxWidthPixelsSum: 0, unitBarMaxWidthPixelsCount: 0 },\n  );\n\n  const finestLayer = layers[0];\n\n  return {\n    lo: loHi.lo,\n    hi: loHi.hi,\n    binUnit: finestLayer?.unit ?? 'millisecond',\n    binUnitCount: finestLayer?.unitMultiplier ?? 1,\n    unitBarMaxWidthPixels: loHi.unitBarMaxWidthPixelsSum / loHi.unitBarMaxWidthPixelsCount,\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BarRow, renderBarGlyph } from './glyphs/bar';\nimport { BoxplotRow, renderBoxplotGlyph } from './glyphs/boxplot';\nimport { Interval, TimeFormatter, AxisLayer } from '../../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { NumericScale } from '../../projections/scale';\nimport { TimeslipConfig } from '../config';\nimport { TimeslipDataRows } from '../data_fetch';\n\nconst textOffset = 0.35; // customary value\nconst showMissingValuesAsZero = false;\n\n/** @internal */\nexport type Layers = AxisLayer<Interval>[];\n\n/** @internal */\nexport const renderColumnTickLabels = (\n  ctx: CanvasRenderingContext2D,\n  config: TimeslipConfig,\n  fadeOutPixelWidth: number,\n  emWidth: number,\n  getPixelX: NumericScale,\n  labelFormat: TimeFormatter,\n  minorLabelFormat: TimeFormatter,\n  textNestLevelRowLimited: number,\n  cartesianWidth: number,\n  binStartList: Iterable<Interval>,\n) => {\n  for (const { minimum, supremum } of binStartList) {\n    const text =\n      textNestLevelRowLimited === config.maxLabelRowCount\n        ? labelFormat(minimum * 1000)\n        : minorLabelFormat(minimum * 1000);\n    if (text.length <= 0) continue;\n    const pixelX = Math.max(0, getPixelX(minimum));\n    const textX = pixelX + config.horizontalPixelOffset;\n    const y = config.verticalPixelOffset + (textNestLevelRowLimited - 1) * config.rowPixelPitch;\n    // the measured text width, plus the `config.horizontalPixelOffset` on the left side must fit inside `maxWidth`\n    const maxWidth = getPixelX(supremum) - config.horizontalPixelOffset;\n    const leftShortening =\n      maxWidth >= cartesianWidth\n        ? 0\n        : Math.max(0, ctx.measureText(text).width + config.horizontalPixelOffset - maxWidth);\n    const rightShortening =\n      textX + Math.min(maxWidth, text.length * emWidth) < cartesianWidth\n        ? 0\n        : Math.max(0, textX + ctx.measureText(text).width - cartesianWidth);\n    const maxWidthRight = Math.max(0, cartesianWidth - textX);\n    const clipLeft = config.clipLeft && leftShortening > 0;\n    const clipRight = config.clipRight && rightShortening > 0;\n    if (clipLeft) {\n      ctx.save();\n      ctx.beginPath();\n      ctx.rect(config.horizontalPixelOffset, y - textOffset * config.rowPixelPitch, maxWidth, config.rowPixelPitch);\n      ctx.clip();\n    }\n    if (clipRight) {\n      ctx.save();\n      ctx.beginPath();\n      ctx.rect(textX, y - textOffset * config.rowPixelPitch, maxWidthRight, config.rowPixelPitch);\n      ctx.clip();\n    }\n    ctx.fillStyle = config.a11y.contrast === 'low' ? config.subduedFontColor : config.defaultFontColor;\n    ctx.fillText(text, textX - leftShortening, y);\n    if (clipRight) {\n      const { r, g, b } = config.backgroundColor;\n      const fadeOutRight = ctx.createLinearGradient(textX, 0, textX + maxWidthRight, 0);\n      fadeOutRight.addColorStop(0, `rgba(${r},${g},${b},0)`);\n      fadeOutRight.addColorStop(\n        maxWidthRight <= 0 ? 0.5 : Math.max(0, 1 - fadeOutPixelWidth / maxWidthRight),\n        `rgba(${r},${g},${b},0)`,\n      );\n      fadeOutRight.addColorStop(1, `rgba(${r},${g},${b},1)`);\n      ctx.fillStyle = fadeOutRight;\n      ctx.fill();\n      ctx.restore();\n    }\n    if (clipLeft) {\n      const { r, g, b } = config.backgroundColor;\n      const fadeOutLeft = ctx.createLinearGradient(0, 0, maxWidth, 0);\n      fadeOutLeft.addColorStop(0, `rgba(${r},${g},${b},1)`);\n      fadeOutLeft.addColorStop(\n        maxWidth <= 0 ? 0.5 : Math.min(1, fadeOutPixelWidth / maxWidth),\n        `rgba(${r},${g},${b},0)`,\n      );\n      fadeOutLeft.addColorStop(1, `rgba(${r},${g},${b},0)`);\n      ctx.fillStyle = fadeOutLeft;\n      ctx.fill();\n      ctx.restore();\n    }\n  }\n};\n\n/** @internal */\nexport const renderColumnBars = (\n  ctx: CanvasRenderingContext2D,\n  getPixelX: NumericScale,\n  cartesianWidth: number,\n  cartesianHeight: number,\n  barPad: number,\n  rows: TimeslipDataRows,\n  yUnitScale: NumericScale,\n  barChroma: TimeslipConfig['barChroma'],\n  barFillAlpha: number,\n  timeBins: Iterable<Interval>,\n) => {\n  for (const { minimum, supremum } of timeBins) {\n    const foundRow = rows.find((r) => minimum * 1000 <= r.epochMs && r.epochMs < supremum * 1000);\n    if (!foundRow && !showMissingValuesAsZero) continue;\n\n    const fullBarPixelX = getPixelX(minimum);\n    const barMaxWidthPixels = getPixelX(supremum) - fullBarPixelX - 2 * barPad;\n    const pixelX = Math.max(0, fullBarPixelX);\n\n    // left side special case\n    const leftShortfall = Math.abs(pixelX - fullBarPixelX);\n    const leftOpacityMultiplier = leftShortfall ? 1 - Math.max(0, Math.min(1, leftShortfall / barMaxWidthPixels)) : 1;\n\n    // right side special case\n    const barX = pixelX + barPad;\n    const rightShortfall = Math.max(0, barX + barMaxWidthPixels - cartesianWidth);\n\n    const maxBarHeight = cartesianHeight;\n    const barWidthPixels = barMaxWidthPixels - rightShortfall;\n\n    const rightOpacityMultiplier = rightShortfall\n      ? 1 - Math.max(0, Math.min(1, rightShortfall / barMaxWidthPixels))\n      : 1;\n    const { r, g, b } = barChroma;\n    const maxOpacity = barFillAlpha;\n    const opacityMultiplier = leftOpacityMultiplier * rightOpacityMultiplier;\n    const opacity = maxOpacity * opacityMultiplier;\n    const opacityDependentLineThickness = opacityMultiplier === 1 ? 1 : Math.sqrt(opacityMultiplier);\n    ctx.save();\n    if (foundRow?.boxplot) {\n      renderBoxplotGlyph(\n        ctx,\n        barMaxWidthPixels,\n        barX,\n        leftShortfall,\n        foundRow as BoxplotRow, // todo remove as\n        maxBarHeight,\n        yUnitScale,\n        opacityMultiplier,\n        r,\n        g,\n        b,\n        maxOpacity,\n      );\n    } else {\n      renderBarGlyph(\n        ctx,\n        barWidthPixels,\n        leftShortfall,\n        maxBarHeight,\n        yUnitScale,\n        foundRow as BarRow,\n        r,\n        g,\n        b,\n        opacity,\n        barX,\n        opacityDependentLineThickness,\n      );\n    }\n    ctx.restore();\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { NumericScale } from '../../../projections/scale';\n\n/** @internal */\nexport type BarRow = { value: number };\n\n/** @internal */\nexport function renderBarGlyph(\n  ctx: CanvasRenderingContext2D,\n  barWidthPixels: number,\n  leftShortfall: number,\n  maxBarHeight: number,\n  yUnitScale: NumericScale,\n  foundRow: BarRow,\n  r: number,\n  g: number,\n  b: number,\n  opacity: number,\n  barX: number,\n  opacityDependentLineThickness: number,\n) {\n  const renderedBarWidth = Math.max(0, barWidthPixels - leftShortfall);\n  const barEnd = -maxBarHeight * yUnitScale(foundRow.value);\n  const barStart = -maxBarHeight * yUnitScale(0);\n  const barHeight = Math.abs(barStart - barEnd);\n  const barY = Math.min(barStart, barEnd);\n  ctx.fillStyle = `rgba(${r},${g},${b},${opacity})`;\n  ctx.fillRect(barX, barY, renderedBarWidth, barHeight);\n  if (barEnd === barEnd) {\n    ctx.fillStyle = `rgba(${r},${g},${b},1)`;\n    ctx.fillRect(barX, barEnd, renderedBarWidth, opacityDependentLineThickness); // avoid Math.sqrt\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { NumericScale } from '../../../projections/scale';\n\nconst goldenRatio = 1.618; // todo move it into constants\n\n/** @public */\nexport type BoxplotRow = { boxplot: { lower: number; q1: number; q2: number; q3: number; upper: number } };\n\n/** @internal */\nexport function renderBoxplotGlyph(\n  ctx: CanvasRenderingContext2D,\n  barMaxWidthPixels: number,\n  barX: number,\n  leftShortfall: number,\n  foundRow: BoxplotRow,\n  maxBarHeight: number,\n  yUnitScale: NumericScale,\n  opacityMultiplier: number,\n  r: number,\n  g: number,\n  b: number,\n  maxOpacity: number,\n) {\n  const boxplotWidth = barMaxWidthPixels / goldenRatio; // - clamp(rightShortfall etc etc)\n  const whiskerWidth = boxplotWidth / 2;\n  const boxplotLeftX = barX + (barMaxWidthPixels - boxplotWidth) / 2 - leftShortfall;\n  const boxplotCenterX = boxplotLeftX + boxplotWidth / 2;\n  const { /*min, */ lower, q1, q2, q3, upper /*max */ } = foundRow.boxplot;\n  const lowerY = maxBarHeight * yUnitScale(lower);\n  const q1Y = maxBarHeight * yUnitScale(q1);\n  const q2Y = maxBarHeight * yUnitScale(q2);\n  const q3Y = maxBarHeight * yUnitScale(q3);\n  const upperY = maxBarHeight * yUnitScale(upper);\n  // boxplot rectangle body with border\n  if (lowerY !== upperY && q1Y !== q2Y && q2Y !== q3Y) {\n    const unitVisibility = opacityMultiplier ** 5;\n    ctx.beginPath();\n    ctx.rect(boxplotLeftX, -q3Y, boxplotWidth, q3Y - q1Y);\n    ctx.fillStyle = `rgba(${r},${g},${b},${maxOpacity * unitVisibility})`;\n    ctx.fill();\n    ctx.strokeStyle = `rgba(${r},${g},${b},1)`;\n    ctx.lineWidth = unitVisibility;\n    //ctx.stroke()\n    // boxplot whiskers\n    ctx.fillStyle = `rgba(${r},${g},${b},1)`;\n    ctx.fillRect(boxplotCenterX - whiskerWidth / 2, -upperY, whiskerWidth, unitVisibility); // upper horizontal\n    ctx.fillRect(boxplotCenterX - boxplotWidth / 2, -q3Y, boxplotWidth, unitVisibility); // q2 horizontal\n    ctx.fillRect(boxplotCenterX - boxplotWidth / 2, -q2Y, boxplotWidth, unitVisibility); // q2 horizontal\n    ctx.fillRect(boxplotCenterX - boxplotWidth / 2, -q1Y, boxplotWidth, unitVisibility); // q2 horizontal\n    ctx.fillRect(boxplotCenterX - whiskerWidth / 2, -lowerY, whiskerWidth, unitVisibility); // lower horizontal\n    ctx.fillRect(boxplotCenterX, -upperY, unitVisibility, upperY - q3Y); // top vertical\n    ctx.fillRect(boxplotCenterX, -q1Y, unitVisibility, q1Y - lowerY); // bottom vertical\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function renderDebugBox(ctx: CanvasRenderingContext2D, cartesianWidth: number, cartesianHeight: number) {\n  ctx.save();\n  ctx.beginPath();\n  ctx.rect(0, 0, cartesianWidth, cartesianHeight);\n  ctx.strokeStyle = 'magenta';\n  ctx.setLineDash([5, 5]);\n  ctx.lineWidth = 1;\n  ctx.stroke();\n  ctx.restore();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Layers, renderColumnBars, renderColumnTickLabels } from './column';\nimport { doing, executing, filtering, mapping, pipeline } from '../../../../common/iterables';\nimport { isNil } from '../../../../utils/common';\nimport {\n  NumberFormatter,\n  Interval,\n  TimeFormatter,\n  AxisLayer,\n} from '../../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { MAX_TIME_GRID_COUNT, notTooDense } from '../../../xy_chart/axes/timeslip/multilayer_ticks';\nimport { NumericScale } from '../../projections/scale';\nimport { clamp } from '../../utils/math';\nimport { TimeslipConfig } from '../config';\nimport { DataState } from '../data_fetch';\n\nconst TIMESLIP_MAX_TIME_GRID_COUNT = 100 || MAX_TIME_GRID_COUNT; // use either\n\ninterface LoHi {\n  lo: Interval | null;\n  hi: Interval | null;\n  unitBarMaxWidthPixelsSum: number;\n  unitBarMaxWidthPixelsCount: number;\n}\n\nconst renderHorizontalGridLines = (\n  ctx: CanvasRenderingContext2D,\n  config: TimeslipConfig,\n  niceTicks: number[],\n  yUnitScale: NumericScale,\n  cartesianHeight: number,\n  yTickNumberFormatter: NumberFormatter,\n  cartesianWidth: number,\n) => {\n  ctx.save();\n  const { r, g, b } = config.backgroundColor;\n  const lineStyle = config.implicit\n    ? `rgb(${r},${g},${b})`\n    : `rgba(128,128,128,${config.a11y.contrast === 'low' ? 0.5 : 1})`;\n  ctx.textBaseline = 'middle';\n  ctx.font = config.cssFontShorthand;\n  for (const gridDomainValueY of niceTicks) {\n    const yUnit = yUnitScale(gridDomainValueY);\n    if (yUnit !== clamp(yUnit, -0.01, 1.01)) {\n      // todo set it back to 0 and 1 if recurrence relation of transitioning can reach 1 in finite time\n      continue;\n    }\n    const y = -cartesianHeight * yUnit;\n    const text = yTickNumberFormatter(gridDomainValueY);\n    ctx.fillStyle = gridDomainValueY === 0 ? config.defaultFontColor : lineStyle;\n    ctx.fillRect(\n      -config.yTickOverhang,\n      y,\n      cartesianWidth + 2 * config.yTickOverhang,\n      gridDomainValueY === 0 ? 0.5 : config.implicit ? 0.2 : 0.1,\n    );\n    ctx.fillStyle = config.subduedFontColor;\n    ctx.textAlign = 'left';\n    ctx.fillText(text, cartesianWidth + config.yTickOverhang + config.yTickGap, y);\n    ctx.textAlign = 'right';\n    ctx.fillText(text, -config.yTickOverhang - config.yTickGap, y);\n  }\n  ctx.restore();\n};\n\nconst binsToRender = (binStarts: Iterable<Interval>, domainFrom: number, domainTo: number) => {\n  const binStartList: Interval[] = [];\n  for (const binStart of binStarts) {\n    if (binStart.minimum > domainTo) break;\n    if (binStart.minimum < domainFrom) {\n      binStartList[0] = binStart;\n    } else {\n      binStartList.push(binStart);\n    }\n  }\n  return binStartList;\n};\n\n/** @internal */\nexport const calcColumnBar = (\n  getPixelX: NumericScale,\n  unitBarMaxWidthPixelsSum: number,\n  unitBarMaxWidthPixelsCount: number,\n  i: number,\n  halfLineThickness: number,\n  implicit: boolean,\n  { minimum, supremum }: Interval,\n) => {\n  if (i !== 0) return { unitBarMaxWidthPixelsSum, unitBarMaxWidthPixelsCount };\n  const barPad = implicit ? halfLineThickness : 0;\n  const fullBarPixelX = getPixelX(minimum);\n  const barMaxWidthPixels = getPixelX(supremum) - fullBarPixelX - 2 * barPad;\n  return {\n    unitBarMaxWidthPixelsSum: unitBarMaxWidthPixelsSum + barMaxWidthPixels,\n    unitBarMaxWidthPixelsCount: unitBarMaxWidthPixelsCount + 1,\n  };\n};\n\nconst updateLoHi = (\n  binStarts: Iterable<Interval>,\n  implicit: boolean,\n  halfLineThickness: number,\n  getPixelX: NumericScale,\n  loHi: LoHi,\n  i: number,\n) => {\n  for (const binStart of binStarts) {\n    if (i === 0) {\n      loHi.lo = loHi.lo || binStart;\n      loHi.hi = binStart;\n    }\n\n    // update loHi\n    const { unitBarMaxWidthPixelsSum, unitBarMaxWidthPixelsCount } = calcColumnBar(\n      getPixelX,\n      loHi.unitBarMaxWidthPixelsSum,\n      loHi.unitBarMaxWidthPixelsCount,\n      i,\n      halfLineThickness,\n      implicit,\n      binStart,\n    );\n    loHi.unitBarMaxWidthPixelsSum = unitBarMaxWidthPixelsSum;\n    loHi.unitBarMaxWidthPixelsCount = unitBarMaxWidthPixelsCount;\n  }\n};\n\n/** @internal */\nexport const renderRaster =\n  (\n    ctx: CanvasRenderingContext2D,\n    config: TimeslipConfig,\n    dataState: DataState,\n    fadeOutPixelWidth: number,\n    emWidth: number,\n    defaultMinorTickLabelFormat: TimeFormatter,\n    defaultLabelFormat: TimeFormatter,\n    yTickNumberFormatter: NumberFormatter,\n    domainFrom: number,\n    domainTo: number,\n    getPixelX: NumericScale,\n    cartesianWidth: number,\n    cartesianHeight: number,\n    niceTicks: number[],\n    yUnitScale: NumericScale,\n    layers: Layers,\n  ) =>\n  (\n    loHi: LoHi,\n    {\n      labeled,\n      intervals,\n      minorTickLabelFormat,\n      detailedLabelFormat,\n      minimumTickPixelDistance,\n      unit,\n      unitMultiplier,\n    }: AxisLayer<Interval>,\n    i: number,\n    a: Layers,\n  ) => {\n    const {\n      valid,\n      dataResponse: { rows },\n    } = dataState;\n\n    const minorLabelFormat = minorTickLabelFormat ?? defaultMinorTickLabelFormat;\n    const labelFormat = detailedLabelFormat ?? minorLabelFormat ?? defaultLabelFormat;\n    const textNestLevel = a.slice(0, i + 1).filter((layer) => layer.labeled).length;\n    const lineNestLevel = a[i] === a[0] ? 0 : textNestLevel;\n    const textNestLevelRowLimited = Math.min(config.maxLabelRowCount, textNestLevel); // max. N rows\n    const lineNestLevelRowLimited = Math.min(config.maxLabelRowCount, lineNestLevel);\n    const lineThickness = config.lineThicknessSteps[i] ?? NaN;\n    const luma =\n      (config.lumaSteps[i] ?? NaN) *\n      (config.darkMode ? (config.a11y.contrast === 'low' ? 0.5 : 1) : config.a11y.contrast === 'low' ? 1.5 : 1);\n    const halfLineThickness = lineThickness / 2;\n    const notTooDenseGridLayer = notTooDense(domainFrom, domainTo, 0, cartesianWidth, TIMESLIP_MAX_TIME_GRID_COUNT);\n\n    const binStartList = binsToRender(intervals(domainFrom, domainTo), domainFrom, domainTo);\n\n    updateLoHi(binStartList, config.implicit, halfLineThickness, getPixelX, loHi, i);\n\n    const finestRaster = i === 0;\n    const renderBar =\n      finestRaster &&\n      valid &&\n      dataState.binUnit === layers[0]?.unit &&\n      dataState.binUnitCount === layers[0].unitMultiplier;\n\n    if (labeled && textNestLevel <= config.maxLabelRowCount)\n      renderColumnTickLabels(\n        ctx,\n        config,\n        fadeOutPixelWidth,\n        emWidth,\n        getPixelX,\n        labelFormat,\n        minorLabelFormat,\n        textNestLevelRowLimited,\n        cartesianWidth,\n        binStartList,\n      );\n\n    if (renderBar)\n      renderColumnBars(\n        ctx,\n        getPixelX,\n        cartesianWidth,\n        cartesianHeight,\n        config.implicit ? halfLineThickness : 0,\n        rows,\n        yUnitScale,\n        config.barChroma,\n        config.barFillAlpha,\n        binStartList,\n      );\n    if (notTooDenseGridLayer({ minimumTickPixelDistance, unit, unitMultiplier })) {\n      const { rowPixelPitch } = config;\n      ctx.fillStyle = `rgb(${luma},${luma},${luma})`;\n      const lastBinForClosingGridline = binStartList.slice(-1).map((bin) => ({ ...bin, binStart: bin.supremum }));\n      pipeline(\n        [...binStartList, ...lastBinForClosingGridline],\n        mapping(({ minimum }) => minimum),\n        filtering((binStart) => binStart >= domainFrom),\n        mapping(getPixelX),\n        doing((pixelX: number) => {\n          const left = pixelX - 0.5 * lineThickness;\n          const height = cartesianHeight + lineNestLevelRowLimited * rowPixelPitch;\n          ctx.fillRect(left, -cartesianHeight, lineThickness, height);\n        }),\n        executing,\n      );\n    }\n\n    // render specially the tick that just precedes the domain, therefore may insert into it (eg. intentionally, via needing to see tick texts)\n    if (!isNil(binStartList[0]) && binStartList[0].minimum < domainFrom) {\n      const precedingBinStart = binStartList[0];\n      if (finestRaster) {\n        // condition necessary, otherwise it'll be the binStart of some temporally coarser bin\n        loHi.lo = precedingBinStart; // partial bin on the left\n      }\n      const { unitBarMaxWidthPixelsSum, unitBarMaxWidthPixelsCount } = calcColumnBar(\n        getPixelX,\n        loHi.unitBarMaxWidthPixelsSum,\n        loHi.unitBarMaxWidthPixelsCount,\n        i,\n        halfLineThickness,\n        config.implicit,\n        precedingBinStart,\n      );\n\n      loHi.unitBarMaxWidthPixelsSum = unitBarMaxWidthPixelsSum;\n      loHi.unitBarMaxWidthPixelsCount = unitBarMaxWidthPixelsCount;\n    }\n\n    renderHorizontalGridLines(\n      ctx,\n      config,\n      niceTicks,\n      yUnitScale,\n      cartesianHeight,\n      yTickNumberFormatter,\n      cartesianWidth,\n    );\n\n    return loHi;\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  backgroundFillStyle,\n  chartTopFontSize,\n  config,\n  defaultLabelFormat,\n  defaultMinorTickLabelFormat,\n  drawCartesianBox,\n  fadeOutPixelWidth,\n  horizontalCartesianAreaPad,\n  keyPanVelocityDivisor,\n  keyZoomVelocityDivisor,\n  localeOptions,\n  rasterConfig,\n  timeZone,\n  verticalCartesianAreaPad,\n  wheelPanVelocity,\n  wheelZoomVelocity,\n  HORIZONTAL_AXIS,\n  ZERO_Y_BASE,\n} from './config';\nimport { getEnrichedData } from './data';\nimport { DataState, getNullDataState, invalid, updateDataState } from './data_fetch';\nimport { renderChartTitle } from './render/annotations/chart_title';\nimport { renderTimeExtentAnnotation } from './render/annotations/time_extent';\nimport { renderTimeUnitAnnotation } from './render/annotations/time_unit';\nimport { renderCartesian } from './render/cartesian';\nimport { renderDebugBox } from './render/glyphs/debug_box';\nimport { continuousTimeRasters, NumberFormatter } from '../../xy_chart/axes/timeslip/continuous_time_rasters';\nimport { numericalRasters } from '../../xy_chart/axes/timeslip/numerical_rasters';\nimport { axisModel } from '../projections/axis_model';\nimport { domainTween } from '../projections/domain_tween';\nimport { getDesiredTickCount, makeLinearScale } from '../projections/scale';\nimport {\n  doPanFromJumpDelta,\n  doPanFromPosition,\n  doZoomAroundPosition,\n  doZoomFromJumpDelta,\n  endDrag,\n  getFocusDomain,\n  initialZoomPan,\n  kineticFlywheel,\n  markDragStartPosition,\n  multiplierToZoom,\n  panOngoing,\n  resetTouchZoom,\n  startTouchZoom,\n  touchOngoing,\n  ZoomPan,\n} from '../projections/zoom_pan';\nimport { GetData } from '../timeslip_api';\nimport { withAnimation, withDeltaTime } from '../utils/animation';\nimport { elementSize, ElementSize, zoomSafePointerX, zoomSafePointerY } from '../utils/dom';\nimport {\n  continuedTwoPointTouch,\n  eraseMultitouch,\n  getPinchRatio,\n  initialMultitouch,\n  Multitouch,\n  setNewMultitouch,\n  touches,\n  touchMidpoint,\n  twoTouchPinch,\n  zeroTouch,\n} from '../utils/multitouch';\n\nconst HEADER_ROW_Y_OFFSET = 3; // 3 normal text height gap between unit/range annotation on top and the Cartesian area\n\nconst getNullDimensions = (): ElementSize => ({\n  outerSize: NaN,\n  innerLeading: NaN,\n  innerTrailing: NaN,\n  innerSize: NaN,\n});\n\n/** @internal */\nexport interface InteractionState {\n  // remembering touch points for zoom/pam\n  multitouch: Multitouch;\n\n  // zoom/pan\n  horizontalZoomPan: ZoomPan;\n\n  // Y domain\n  niceDomainMin: number;\n  niceDomainMax: number;\n\n  // other\n  horizontalScreenDimensions: ElementSize;\n  verticalScreenDimensions: ElementSize;\n}\n\nconst getNullInteractionState = (): InteractionState => ({\n  // current zoom and pan level\n\n  horizontalZoomPan: initialZoomPan(),\n\n  // remembering touch points for zoom/pam\n  multitouch: initialMultitouch(),\n\n  // Y domain\n  niceDomainMin: NaN,\n  niceDomainMax: NaN,\n\n  // other\n  horizontalScreenDimensions: getNullDimensions(),\n  verticalScreenDimensions: getNullDimensions(),\n});\n\nconst rasterSelector =\n  HORIZONTAL_AXIS === 'continuousTime' ? continuousTimeRasters(rasterConfig, timeZone) : numericalRasters(rasterConfig);\n\nconst yTickNumberFormatter = new Intl.NumberFormat(\n  config.locale,\n  config.numUnit === 'none'\n    ? {}\n    : {\n        notation: 'compact',\n        compactDisplay: config.numUnit,\n      },\n);\n\nconst yTickNumberFormat: NumberFormatter = (value) => yTickNumberFormatter.format(value);\n\nconst touchUpdate = (interactionState: InteractionState, newMultitouch: Multitouch) => {\n  const { multitouch, horizontalZoomPan: zoomPan, horizontalScreenDimensions } = interactionState;\n  const noPreviousTouch = zeroTouch(multitouch);\n  const isTwoTouchPinch = twoTouchPinch(newMultitouch);\n  const center = touchMidpoint(newMultitouch);\n  const isPinchStart = noPreviousTouch && isTwoTouchPinch;\n  if (isPinchStart) {\n    setNewMultitouch(multitouch, newMultitouch);\n    startTouchZoom(zoomPan);\n    markDragStartPosition(zoomPan, center);\n  } else if (!isTwoTouchPinch || !continuedTwoPointTouch(multitouch, newMultitouch)) {\n    eraseMultitouch(multitouch);\n    resetTouchZoom(zoomPan);\n  }\n  const isPinchZoom = twoTouchPinch(multitouch);\n  const isTouchOngoing = touchOngoing(zoomPan);\n  const isPanOngoing = panOngoing(zoomPan);\n  if (isPinchZoom) {\n    const pinchRatio = getPinchRatio(multitouch, newMultitouch);\n    const desiredZoomChange = multiplierToZoom(pinchRatio);\n    doZoomAroundPosition(\n      zoomPan,\n      horizontalScreenDimensions,\n      center,\n      desiredZoomChange,\n      0, // panFromPosition(center),\n      true,\n    );\n    // doing both clashes in ways\n    // doPanFromPosition(zoomPan, horizontalScreenDimensions.innerSize, center);\n  } else {\n    const inCartesianBand = true; // let's assume for now\n    if (inCartesianBand || isTouchOngoing) {\n      if (isPanOngoing) {\n        doPanFromPosition(zoomPan, horizontalScreenDimensions.innerSize, center);\n      } else {\n        markDragStartPosition(zoomPan, center); // was dragStart(e)\n      }\n    }\n  }\n  return isPinchZoom || (isTouchOngoing && isPanOngoing);\n};\n\nconst inCartesianBand = (size: ElementSize, value: number) => size.innerLeading <= value && value <= size.innerTrailing;\n\nconst ensureCanvasResolution = (\n  canvas: HTMLCanvasElement,\n  outerWidth: number,\n  outerHeight: number,\n  newCanvasWidth: number,\n  newCanvasHeight: number,\n) => {\n  if (newCanvasWidth !== outerWidth) {\n    canvas.setAttribute('width', String(newCanvasWidth));\n  }\n  if (newCanvasHeight !== outerHeight) {\n    canvas.setAttribute('height', String(newCanvasHeight));\n  }\n};\n\nconst doCartesian = (\n  ctx: CanvasRenderingContext2D,\n  cartesianHeight: number,\n  interactionState: InteractionState,\n  deltaT: number,\n  cartesianWidth: number,\n  timeDomain: { domainFrom: number; domainTo: number },\n  dataState: DataState,\n  emWidth: number,\n) => {\n  ctx.save();\n  ctx.translate(0, cartesianHeight);\n\n  const domainLandmarks = [\n    dataState.dataResponse.stats.minValue,\n    dataState.dataResponse.stats.maxValue,\n    ...(ZERO_Y_BASE ? [0] : []),\n  ];\n  const desiredTickCount = getDesiredTickCount(cartesianHeight, config.smallFontSize, config.sparse);\n  const { niceDomainMin, niceDomainMax, niceTicks } = axisModel(domainLandmarks, desiredTickCount);\n  const yTweenOngoing = domainTween(interactionState, deltaT, niceDomainMin, niceDomainMax); // updates interactionState\n  const yUnitScale = makeLinearScale(interactionState.niceDomainMin, interactionState.niceDomainMax, 0, 1);\n\n  const dataDemand = renderCartesian(\n    ctx,\n    config,\n    dataState,\n    defaultMinorTickLabelFormat,\n    emWidth,\n    fadeOutPixelWidth,\n    defaultLabelFormat,\n    yTickNumberFormat,\n    rasterSelector,\n    cartesianWidth,\n    cartesianHeight,\n    timeDomain,\n    yUnitScale,\n    niceTicks,\n  );\n\n  ctx.restore();\n\n  return { yTweenOngoing, dataDemand };\n};\n\nconst renderChartWithTime = (\n  ctx: CanvasRenderingContext2D,\n  backgroundFillStyle: string,\n  newCanvasWidth: number,\n  newCanvasHeight: number,\n  config: {\n    locale: string;\n    monospacedFontShorthand: string;\n    subduedFontColor: string;\n    defaultFontColor: string;\n    a11y: { contrast: 'low' | 'medium' | 'high' };\n  },\n  chartWidth: number,\n  cartesianTop: number,\n  cartesianLeft: number,\n  cartesianHeight: number,\n  interactionState: InteractionState,\n  deltaT: number,\n  cartesianWidth: number,\n  drawCartesianBox: boolean, // set to true for debug border around the Cartesian plot area\n  chartTopFontSize: number,\n  dataState: DataState,\n  emWidth: number,\n  dpi: number,\n  fromSec: number,\n  toSec: number,\n) => {\n  ctx.save();\n  ctx.scale(dpi, dpi);\n  ctx.fillStyle = backgroundFillStyle;\n  // clearRect is not enough, as browser image copy ignores canvas background color\n  ctx.fillRect(0, 0, newCanvasWidth, newCanvasHeight);\n\n  // chart title\n  renderChartTitle(ctx, config.subduedFontColor, chartWidth /*, cartesianTop*/);\n\n  ctx.translate(cartesianLeft, cartesianTop);\n\n  const timeDomain = getFocusDomain(interactionState.horizontalZoomPan, fromSec, toSec);\n\n  // cartesian\n  const { yTweenOngoing, dataDemand } = doCartesian(\n    ctx,\n    cartesianHeight,\n    interactionState,\n    deltaT,\n    cartesianWidth,\n    timeDomain,\n    dataState,\n    emWidth,\n  );\n\n  // cartesian area box\n  if (drawCartesianBox) {\n    renderDebugBox(ctx, cartesianWidth, cartesianHeight);\n  }\n\n  const headerRowOffsetY = -chartTopFontSize * HEADER_ROW_Y_OFFSET;\n\n  // chart time unit info\n  renderTimeUnitAnnotation(\n    ctx,\n    config,\n    dataDemand.binUnitCount,\n    dataDemand.binUnit,\n    chartTopFontSize,\n    headerRowOffsetY,\n    dataDemand.unitBarMaxWidthPixels,\n  );\n\n  // chart time from/to extent info\n  renderTimeExtentAnnotation(ctx, config, localeOptions, timeDomain, cartesianWidth, headerRowOffsetY);\n\n  ctx.restore();\n  return { yTweenOngoing, dataDemand };\n};\n\nconst chartWithTime = (\n  canvas: HTMLCanvasElement,\n  ctx: CanvasRenderingContext2D,\n  config: {\n    locale: string;\n    monospacedFontShorthand: string;\n    subduedFontColor: string;\n    defaultFontColor: string;\n    a11y: { contrast: 'low' | 'medium' | 'high' };\n\n    domainFrom: number;\n    domainTo: number;\n  },\n  interactionState: InteractionState,\n  dataState: DataState,\n  deltaT: number,\n  dpi: number,\n  emWidth: number,\n) => {\n  const newHorizontalScreenDimensions = elementSize(canvas, true, horizontalCartesianAreaPad);\n  const chartWidth = newHorizontalScreenDimensions.outerSize;\n  const cartesianLeft = newHorizontalScreenDimensions.innerLeading;\n  const cartesianWidth = newHorizontalScreenDimensions.innerSize;\n\n  const newVerticalScreenDimensions = elementSize(canvas, false, verticalCartesianAreaPad);\n  const chartHeight = newVerticalScreenDimensions.outerSize;\n  const cartesianTop = newVerticalScreenDimensions.innerLeading;\n  const cartesianHeight = newVerticalScreenDimensions.innerSize;\n\n  // resize if needed\n  const newCanvasWidth = dpi * chartWidth;\n  const newCanvasHeight = dpi * chartHeight;\n  ensureCanvasResolution(\n    canvas,\n    interactionState.horizontalScreenDimensions.outerSize,\n    interactionState.verticalScreenDimensions.outerSize,\n    newCanvasWidth,\n    newCanvasHeight,\n  );\n  interactionState.horizontalScreenDimensions = newHorizontalScreenDimensions;\n  interactionState.verticalScreenDimensions = newVerticalScreenDimensions;\n\n  // render chart\n  const { yTweenOngoing, dataDemand } = renderChartWithTime(\n    ctx,\n    backgroundFillStyle,\n    newCanvasWidth,\n    newCanvasHeight,\n    config,\n    chartWidth,\n    cartesianTop,\n    cartesianLeft,\n    cartesianHeight,\n    interactionState,\n    deltaT,\n    cartesianWidth,\n    drawCartesianBox,\n    chartTopFontSize,\n    dataState,\n    emWidth,\n    dpi,\n    config.domainFrom,\n    config.domainTo,\n  );\n\n  const dataArrived =\n    !dataState.pending &&\n    invalid(dataState, dataDemand) &&\n    dataDemand.lo &&\n    dataDemand.hi &&\n    dataDemand.binUnit &&\n    dataDemand.binUnitCount;\n  if (dataArrived) {\n    dataState.pending = true;\n  }\n  return { dataArrived, yTweenOngoing, dataDemand };\n};\n\nconst setupEventHandlers = (\n  canvas: HTMLCanvasElement,\n  interactionState: InteractionState,\n  timedRender: FrameRequestCallback,\n  scheduleChartRender: () => void,\n) => {\n  const wheel = (e: WheelEvent) => {\n    // resolution and DOM dependent part\n    const isPanning = e.metaKey;\n    const wheeledDistanceRatio = e.deltaY / interactionState.horizontalScreenDimensions.innerSize; // for resolution independence\n    if (!inCartesianBand(interactionState.verticalScreenDimensions, zoomSafePointerY(e))) return;\n\n    // resolution independent part\n    if (isPanning) {\n      const innerSizeRelativeDelta = wheeledDistanceRatio * wheelPanVelocity;\n      doPanFromJumpDelta(interactionState.horizontalZoomPan, -innerSizeRelativeDelta);\n    } else {\n      const desiredZoomChange = -wheeledDistanceRatio * wheelZoomVelocity;\n      doZoomAroundPosition(\n        interactionState.horizontalZoomPan,\n        interactionState.horizontalScreenDimensions,\n        zoomSafePointerX(e),\n        desiredZoomChange,\n        0,\n        false,\n      );\n    }\n    scheduleChartRender();\n  };\n\n  const dragStart = (e: MouseEvent) => markDragStartPosition(interactionState.horizontalZoomPan, zoomSafePointerX(e));\n\n  const kineticDragFlywheel = (t: DOMHighResTimeStamp) => {\n    const needsRerender = kineticFlywheel(\n      interactionState.horizontalZoomPan,\n      interactionState.horizontalScreenDimensions.innerSize,\n    );\n    if (needsRerender) {\n      timedRender(t); // it's important that it be synchronous (rather than scheduleChartRender()) otherwise zoom-pan combos freeze a bit\n      window.requestAnimationFrame(kineticDragFlywheel);\n    }\n  };\n\n  const dragEnd = () => {\n    endDrag(interactionState.horizontalZoomPan);\n    window.requestAnimationFrame(kineticDragFlywheel);\n  };\n\n  const touchmove = (e: TouchEvent) => {\n    const shouldUpdate = touchUpdate(interactionState, touches(e));\n    if (shouldUpdate) scheduleChartRender();\n  };\n\n  const mousemove = (e: MouseEvent) => {\n    if (e.buttons !== 1) return;\n    interactionState.multitouch = initialMultitouch();\n    const zoomPan = interactionState.horizontalZoomPan;\n    resetTouchZoom(zoomPan);\n    if (\n      (inCartesianBand(interactionState.horizontalScreenDimensions, zoomSafePointerX(e)) &&\n        inCartesianBand(interactionState.verticalScreenDimensions, zoomSafePointerY(e))) ||\n      touchOngoing(zoomPan)\n    ) {\n      if (panOngoing(zoomPan)) {\n        doPanFromPosition(zoomPan, interactionState.horizontalScreenDimensions.innerSize, zoomSafePointerX(e));\n        scheduleChartRender();\n      } else {\n        dragStart(e);\n      }\n    }\n  };\n\n  const mousedown = (e: MouseEvent) =>\n    inCartesianBand(interactionState.horizontalScreenDimensions, zoomSafePointerX(e)) &&\n    inCartesianBand(interactionState.verticalScreenDimensions, zoomSafePointerY(e)) &&\n    dragStart(e);\n\n  const keydown = (e: KeyboardEvent) => {\n    const panDirection = { ArrowLeft: -1, ArrowRight: 1 }[e.code] ?? 0;\n    const zoomDirection = { ArrowUp: -1, ArrowDown: 1 }[e.code] ?? 0;\n\n    // todo move to zoompan ts\n    if (panDirection || zoomDirection) {\n      if (panDirection) {\n        const normalizedDeltaPan = panDirection / keyPanVelocityDivisor;\n        doPanFromJumpDelta(interactionState.horizontalZoomPan, normalizedDeltaPan);\n      }\n      if (zoomDirection) {\n        const normalizedDeltaZoom = zoomDirection / keyZoomVelocityDivisor;\n        const center = 0.5;\n        doZoomFromJumpDelta(interactionState.horizontalZoomPan, normalizedDeltaZoom, center);\n      }\n      e.preventDefault(); // preventDefault needed because otherwise a right arrow key takes the user to the next element\n      scheduleChartRender();\n    }\n  };\n\n  window.addEventListener('resize', scheduleChartRender, { passive: false });\n  canvas.addEventListener('wheel', wheel, { passive: false });\n  canvas.addEventListener('mousemove', mousemove, { passive: false });\n  canvas.addEventListener('mousedown', mousedown, { passive: false });\n  canvas.addEventListener('mouseup', dragEnd, { passive: false });\n  canvas.addEventListener('touchmove', touchmove, { passive: false });\n  canvas.addEventListener('touchend', dragEnd, { passive: false });\n  canvas.addEventListener('touchcancel', dragEnd, { passive: false });\n  canvas.addEventListener('keydown', keydown, { passive: false });\n};\n\n/** @internal */\nexport const timeslipRender = (canvas: HTMLCanvasElement, ctx: CanvasRenderingContext2D, getData: GetData) => {\n  const dpi = window.devicePixelRatio;\n  const emWidth = ctx.measureText('mmmmmmmmmm').width / 10; // approx width to avoid too many measurements\n\n  const interactionState = getNullInteractionState();\n  const dataState = getNullDataState();\n\n  const chartWithUpdate = (t: DOMHighResTimeStamp) => {\n    const { dataArrived, yTweenOngoing, dataDemand } = chartWithTime(\n      canvas,\n      ctx,\n      config,\n      interactionState,\n      dataState,\n      t,\n      dpi,\n      emWidth,\n    );\n    if (dataArrived) updateDataState(dataState, dataDemand, getEnrichedData(getData(dataDemand)));\n    if (dataArrived || yTweenOngoing) scheduleChartRender();\n  };\n\n  const timedRender = withDeltaTime(chartWithUpdate);\n  const scheduleChartRender = withAnimation(timedRender);\n\n  // initial render\n  scheduleChartRender();\n\n  setupEventHandlers(canvas, interactionState, timedRender, scheduleChartRender);\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TimeslipDataRows } from './timeslip/data_fetch';\nimport { DataDemand } from './timeslip/render/cartesian';\nimport { ChartType } from '..';\nimport { Spec } from '../../specs';\nimport { SpecType } from '../../specs/constants'; // kept as long-winded import on separate line otherwise import circularity emerges\nimport { buildSFProps, SFProps, useSpecFactory } from '../../state/spec_factory';\nimport { stripUndefined } from '../../utils/common';\n\n/**\n * data getter function\n * @public\n */\nexport type GetData = (dataDemand: DataDemand) => TimeslipDataRows;\n\n/**\n * Specifies the timeslip chart\n * @public\n */\nexport interface TimeslipSpec extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.Timeslip;\n  getData: GetData;\n}\n\nconst buildProps = buildSFProps<TimeslipSpec>()(\n  {\n    chartType: ChartType.Timeslip,\n    specType: SpecType.Series,\n  },\n  {},\n);\n\n/**\n * Adds timeslip spec to chart specs\n * @public\n */\nexport const Timeslip = (\n  props: SFProps<\n    TimeslipSpec,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) => {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<TimeslipSpec>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { CSSProperties, RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { timeslipRender } from './timeslip/timeslip_render';\nimport { TimeslipSpec, GetData } from './timeslip_api';\nimport { ChartType } from '..';\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { SettingsSpec, SpecType, TooltipType } from '../../specs';\nimport { onChartRendered } from '../../state/actions/chart';\nimport { BackwardRef, GlobalChartState } from '../../state/chart_state';\nimport { getA11ySettingsSelector } from '../../state/selectors/get_accessibility_config';\nimport { getSettingsSpecSelector } from '../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../state/selectors/get_tooltip_spec';\nimport { getSpecsFromStore } from '../../state/utils';\nimport { Size } from '../../utils/dimensions';\nimport { roundUpSize } from '../flame_chart/render/common';\n// @ts-ignore until it becomes TS\n\ninterface StateProps {\n  getData: GetData;\n  chartDimensions: Size;\n  a11ySettings: ReturnType<typeof getA11ySettingsSelector>;\n  tooltipRequired: boolean;\n  onElementOver: NonNullable<SettingsSpec['onElementOver']>;\n  onElementClick: NonNullable<SettingsSpec['onElementClick']>;\n  onElementOut: NonNullable<SettingsSpec['onElementOut']>;\n  onRenderChange: NonNullable<SettingsSpec['onRenderChange']>;\n}\n\ninterface DispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface OwnProps {\n  containerRef: BackwardRef;\n  forwardStageRef: RefObject<HTMLCanvasElement>;\n}\n\ntype TimeslipProps = StateProps & DispatchProps & OwnProps;\n\nclass TimeslipComponent extends React.Component<TimeslipProps> {\n  static displayName = 'Timeslip';\n\n  // DOM API Canvas2d and WebGL resources\n  private ctx: CanvasRenderingContext2D | null = null;\n\n  componentDidMount = () => {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    this.drawCanvas();\n    this.props.onChartRendered();\n    this.props.containerRef().current?.addEventListener('wheel', (e) => e.preventDefault(), { passive: false });\n\n    const canvas = this.props.forwardStageRef.current;\n    if (canvas && this.ctx) timeslipRender(canvas, this.ctx, this.props.getData);\n  };\n\n  componentWillUnmount() {\n    this.props.containerRef().current?.removeEventListener('wheel', (e) => e.preventDefault());\n  }\n\n  componentDidUpdate = () => {\n    if (!this.ctx) this.tryCanvasContext();\n  };\n\n  render = () => {\n    const {\n      forwardStageRef,\n      chartDimensions: { width: requestedWidth, height: requestedHeight },\n      a11ySettings,\n    } = this.props;\n    const width = roundUpSize(requestedWidth);\n    const height = roundUpSize(requestedHeight);\n    const style: CSSProperties = {\n      width,\n      height,\n      top: 0,\n      left: 0,\n      padding: 0,\n      margin: 0,\n      border: 0,\n      position: 'absolute',\n      cursor: DEFAULT_CSS_CURSOR,\n      touchAction: 'none',\n    };\n\n    const dpr = window.devicePixelRatio; /* * this.pinchZoomScale */\n    const canvasWidth = width * dpr;\n    const canvasHeight = height * dpr;\n    return (\n      <>\n        <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n          <canvas /* Canvas2d layer */\n            ref={forwardStageRef}\n            tabIndex={0}\n            className=\"echCanvasRenderer\"\n            width={canvasWidth}\n            height={canvasHeight}\n            style={{ ...style, outline: 'none' }}\n            // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n            role=\"presentation\"\n          />\n        </figure>\n      </>\n    );\n  };\n\n  private drawCanvas = () => {\n    if (!this.ctx) return;\n    this.props.onRenderChange(true); // emit API callback\n  };\n\n  private tryCanvasContext = () => {\n    const canvas = this.props.forwardStageRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  };\n}\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  const timeslipSpec = getSpecsFromStore<TimeslipSpec>(state.specs, ChartType.Timeslip, SpecType.Series)[0];\n  const settingsSpec = getSettingsSpecSelector(state);\n  return {\n    getData: timeslipSpec?.getData ?? (() => []),\n    chartDimensions: state.parentDimensions,\n    a11ySettings: getA11ySettingsSelector(state),\n    tooltipRequired: getTooltipSpecSelector(state).type !== TooltipType.None,\n\n    // mandatory charts API protocol; todo extract these mappings once there are other charts like Timeslip\n    onElementOver: settingsSpec.onElementOver ?? (() => {}),\n    onElementClick: settingsSpec.onElementClick ?? (() => {}),\n    onElementOut: settingsSpec.onElementOut ?? (() => {}),\n    onRenderChange: settingsSpec.onRenderChange ?? (() => {}), // todo eventually also update data props on a local .echChartStatus element: data-ech-render-complete={rendered} data-ech-render-count={renderedCount} data-ech-debug-state={debugStateString}\n  };\n};\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst TimeslipChartLayers = connect(mapStateToProps, mapDispatchToProps)(TimeslipComponent);\n\n/** @internal */\nexport const TimeslipWithTooltip = (containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>) => (\n  <TimeslipChartLayers forwardStageRef={forwardStageRef} containerRef={containerRef} />\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const withAnimation = (renderer: FrameRequestCallback) => {\n  let rAF = -1;\n  return () => {\n    window.cancelAnimationFrame(rAF);\n    rAF = window.requestAnimationFrame(renderer);\n  };\n};\n\n/** @internal */\nexport const withDeltaTime = (renderer: FrameRequestCallback) => {\n  let prevT = 0;\n  return (t: DOMHighResTimeStamp) => {\n    const deltaT = t - prevT;\n    prevT = t;\n    renderer(deltaT);\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const zoomSafePointerX = (e: MouseEvent) => e.offsetX; // robust against Chrome, Safari, Firefox menu zooms and/or pinch zoom (FF needs zero margin)\n\n/** @internal */\nexport const zoomSafePointerY = (e: MouseEvent) => e.offsetY; // robust against Chrome, Safari, Firefox menu zooms and/or pinch zoom (FF needs zero margin)\n\n/** @internal */\nexport interface ElementSize {\n  outerSize: number;\n  innerLeading: number;\n  innerTrailing: number;\n  innerSize: number;\n}\n\n/** @internal */\nexport const elementSize = (canvas: HTMLCanvasElement, horizontal: boolean, pad: [number, number]): ElementSize => {\n  const outerSize = Number.parseFloat(horizontal ? canvas.style.width : canvas.style.height);\n\n  const innerLeading = outerSize * pad[0];\n  const innerSize = outerSize * (1 - pad.reduce((p, n) => p + n));\n  const innerTrailing = innerLeading + innerSize;\n\n  return {\n    outerSize,\n    innerLeading,\n    innerTrailing,\n    innerSize,\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const mix = (start: number, end: number, a: number) => start * (1 - a) + end * a; // like the glsl function\n/** @internal */\nexport const clamp = (n: number, lo: number, hi: number) => (n < lo ? lo : n > hi ? hi : n);\n/** @internal */\nexport const unitClamp = (n: number) => (n <= 0 ? 0 : n >= 1 ? 1 : n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\ninterface MappedTouch {\n  id: number;\n  position: number;\n}\n\n/** @internal */\nexport type Multitouch = MappedTouch[];\n\n/** @internal */\nexport const initialMultitouch = (): Multitouch => [];\n\n/** @internal */\nexport const touchMidpoint = (multitouch: MappedTouch[]) =>\n  multitouch.reduce((sum, { position }) => sum + position, 0) / multitouch.length;\n\nconst isNonNull = <T>(thing: T | null): thing is T => thing !== null;\n\n/** @internal */\nexport const touches = (e: TouchEvent) =>\n  [...new Array(e.touches?.length ?? 0)]\n    .map((_, i: number) => e.touches.item(i))\n    .filter(isNonNull)\n    .map((t: Touch) => ({ id: t.identifier, position: t.clientX }))\n    .sort(({ position: a }, { position: b }) => a - b);\n\n/** @internal */\nexport const continuedTwoPointTouch = (multitouch: MappedTouch[], newMultitouch: MappedTouch[]) =>\n  [...newMultitouch, ...multitouch].filter((t, i, a) => a.findIndex((tt) => tt.id === t.id) === i).length === 2;\n\n/** @internal */\nexport const setNewMultitouch = (multitouch: MappedTouch[], newMultitouch: MappedTouch[]) =>\n  multitouch.splice(0, Infinity, ...newMultitouch);\n\n/** @internal */\nexport const eraseMultitouch = (multitouch: MappedTouch[]) => multitouch.splice(0, Infinity);\n\n/** @internal */\nexport const getPinchRatio = (multitouch: MappedTouch[], newMultitouch: MappedTouch[]) => {\n  return (\n    (multitouch[1]?.position ?? NaN - (multitouch[0]?.position ?? NaN)) /\n    ((newMultitouch[1]?.position ?? NaN) - (newMultitouch[0]?.position ?? NaN))\n  );\n};\n\n/** @internal */\nexport const twoTouchPinch = (multitouch: MappedTouch[]) => multitouch.length === 2;\n\n/** @internal */\nexport const zeroTouch = (multitouch: MappedTouch[]) => multitouch.length === 0;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Word as D3Word } from 'd3-cloud';\nimport { $Values as Values } from 'utility-types';\n\nimport { Color } from '../../../../common/colors';\nimport { Pixels, PointObject } from '../../../../common/geometry';\nimport { FontStyle } from '../../../../common/text_utils';\n\n/** @public */\nexport interface WordModel {\n  text: string;\n  weight: number;\n  color: Color;\n}\n\n/** @public */\nexport const WeightFn = Object.freeze({\n  log: 'log' as const,\n  linear: 'linear' as const,\n  exponential: 'exponential' as const,\n  squareRoot: 'squareRoot' as const,\n});\n\n/** @public */\nexport type WeightFn = Values<typeof WeightFn>;\n\n/**\n * Word properties extends `D3Word` except for explicitly defined values.\n *\n * `D3Word` values are added datum via d3TagCloud, but may be undefined\n * @internal\n */\nexport interface Word extends D3Word {\n  datum: WordModel;\n  text: string;\n  color: string;\n  fontFamily: string;\n  style: string;\n  fontWeight: number;\n  size: number;\n}\n\n/** @public */\nexport type OutOfRoomCallback = (wordCount: number, renderedWordCount: number, renderedWords: string[]) => void;\n\n/** @public */\nexport interface WordcloudViewModel {\n  startAngle: number;\n  endAngle: number;\n  angleCount: number;\n  padding: number;\n  fontWeight: number;\n  fontFamily: string;\n  fontStyle: FontStyle;\n  minFontSize: number;\n  maxFontSize: number;\n  spiral: string;\n  exponent: number;\n  data: WordModel[];\n  weightFn: WeightFn;\n  outOfRoomCallback: OutOfRoomCallback;\n}\n\n/** @internal */\nexport interface Datum {\n  text: string;\n  weight: number;\n  color: string;\n}\n\n/** @internal */\nexport type PickFunction = (x: Pixels, y: Pixels) => Array<WordcloudViewModel>;\n\n/** @internal */\nexport type ShapeViewModel = {\n  wordcloudViewModel: WordcloudViewModel;\n  chartCenter: PointObject;\n  pickQuads: PickFunction;\n  specId: string;\n};\n\nconst commonDefaults: WordcloudViewModel = {\n  startAngle: -20,\n  endAngle: 20,\n  angleCount: 5,\n  padding: 2,\n  fontWeight: 300,\n  fontFamily: 'Impact',\n  fontStyle: 'italic',\n  minFontSize: 10,\n  maxFontSize: 50,\n  spiral: 'archimedean',\n  exponent: 3,\n  data: [],\n  weightFn: 'exponential',\n  outOfRoomCallback: () => {},\n};\n\n/** @internal */\nexport const defaultWordcloudSpec = {\n  ...commonDefaults,\n};\n\n/** @internal */\nexport const nullWordcloudViewModel: WordcloudViewModel = {\n  ...commonDefaults,\n  data: [],\n};\n\n/** @internal */\nexport const nullShapeViewModel = (): ShapeViewModel => ({\n  wordcloudViewModel: nullWordcloudViewModel,\n  chartCenter: { x: 0, y: 0 },\n  pickQuads: () => [],\n  specId: 'empty',\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { WordcloudSpec } from '../../specs';\nimport { WordcloudViewModel, PickFunction, ShapeViewModel } from '../types/viewmodel_types';\n\n/** @internal */\nexport function shapeViewModel(spec: WordcloudSpec, theme: Theme, chartDimensions: Dimensions): ShapeViewModel {\n  const { width, height } = chartDimensions;\n  const { chartMargins: margin } = theme;\n  const innerWidth = width - margin.left - margin.right;\n  const innerHeight = height - margin.top - margin.bottom;\n\n  const chartCenter = {\n    x: width * margin.left + innerWidth / 2,\n    y: height * margin.top + innerHeight / 2,\n  };\n\n  const {\n    id,\n    startAngle,\n    endAngle,\n    angleCount,\n    padding,\n    fontWeight,\n    fontFamily,\n    fontStyle,\n    minFontSize,\n    maxFontSize,\n    spiral,\n    exponent,\n    data,\n    weightFn,\n    outOfRoomCallback,\n  } = spec;\n\n  const wordcloudViewModel: WordcloudViewModel = {\n    startAngle,\n    endAngle,\n    angleCount,\n    padding,\n    fontWeight,\n    fontFamily,\n    fontStyle,\n    minFontSize,\n    maxFontSize,\n    spiral,\n    exponent,\n    data,\n    weightFn,\n    outOfRoomCallback,\n  };\n\n  const pickQuads: PickFunction = (x, y) =>\n    -innerWidth / 2 <= x && x <= innerWidth / 2 && -innerHeight / 2 <= y && y <= innerHeight / 2\n      ? [wordcloudViewModel]\n      : [];\n\n  // combined viewModel\n  return {\n    chartCenter,\n    wordcloudViewModel,\n    pickQuads,\n    specId: id,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport d3TagCloud from 'd3-cloud';\nimport React from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { ScreenReaderSummary } from '../../../../components/accessibility';\nimport { SettingsSpec, WordCloudElementEvent } from '../../../../specs/settings';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Size } from '../../../../utils/dimensions';\nimport { nullShapeViewModel, ShapeViewModel, Word, WordcloudViewModel } from '../../layout/types/viewmodel_types';\nimport { geometries } from '../../state/selectors/geometries';\n\nfunction getFont(d: Word) {\n  return d.fontFamily;\n}\n\nfunction getFontStyle(d: Word) {\n  return d.style;\n}\n\nfunction getFontWeight(d: Word) {\n  return d.fontWeight;\n}\n\nfunction getFontSize(d: Word) {\n  return d.size;\n}\n\nfunction hashWithinRange(str: string, max: number) {\n  str = JSON.stringify(str);\n  let hash = 0;\n  for (const ch of str) {\n    hash = (hash * 31 + ch.charCodeAt(0)) % max;\n  }\n  return Math.abs(hash) % max;\n}\n\nfunction getRotation(startAngle: number, endAngle: number, count: number, text: string) {\n  const angleRange = endAngle - startAngle;\n  const angleCount = count ?? 360;\n  const interval = count - 1;\n  const angleStep = interval === 0 ? 0 : angleRange / interval;\n  const index = hashWithinRange(text, angleCount);\n  return index * angleStep + startAngle;\n}\n\nfunction exponential(minFontSize: number, maxFontSize: number, exponent: number, weight: number) {\n  return minFontSize + (maxFontSize - minFontSize) * weight ** exponent;\n}\n\nfunction linear(minFontSize: number, maxFontSize: number, _exponent: number, weight: number) {\n  return minFontSize + (maxFontSize - minFontSize) * weight;\n}\n\nfunction squareRoot(minFontSize: number, maxFontSize: number, _exponent: number, weight: number) {\n  return minFontSize + (maxFontSize - minFontSize) * Math.sqrt(weight);\n}\n\nfunction log(minFontSize: number, maxFontSize: number, _exponent: number, weight: number) {\n  return minFontSize + (maxFontSize - minFontSize) * Math.log2(weight + 1);\n}\n\nconst weightFnLookup = { linear, exponential, log, squareRoot };\n\nfunction layoutMaker({ data, ...viewModel }: WordcloudViewModel, chartSize: Size) {\n  const { height, width } = chartSize;\n  const words = data.map<Word>((d) => {\n    const weightFn = weightFnLookup[viewModel.weightFn];\n    return {\n      datum: d,\n      text: d.text,\n      color: d.color,\n      fontFamily: viewModel.fontFamily,\n      style: viewModel.fontStyle,\n      fontWeight: viewModel.fontWeight,\n      size: weightFn(viewModel.minFontSize, viewModel.maxFontSize, viewModel.exponent, d.weight),\n    };\n  });\n\n  return d3TagCloud<Word>()\n    .random(() => 0.5)\n    .size([width, height])\n    .words(words)\n    .spiral(viewModel.spiral ?? 'archimedean')\n    .padding(viewModel.padding ?? 5)\n    .rotate((d) => getRotation(viewModel.startAngle, viewModel.endAngle, viewModel.angleCount, d.text))\n    .font(getFont)\n    .fontStyle(getFontStyle)\n    .fontWeight(getFontWeight)\n    .fontSize(getFontSize);\n}\n\nconst View = ({\n  words,\n  size: { height, width },\n  actions: { onElementClick, onElementOver, onElementOut },\n  specId,\n}: {\n  words: Word[];\n  size: Size;\n  actions: {\n    onElementClick?: SettingsSpec['onElementClick'];\n    onElementOver?: SettingsSpec['onElementOver'];\n    onElementOut?: SettingsSpec['onElementOut'];\n  };\n  specId: string;\n}) => {\n  return (\n    <svg width={width} height={height} role=\"presentation\">\n      <g transform={`translate(${width / 2}, ${height / 2})`}>\n        {words.map((d, i) => {\n          const elements: WordCloudElementEvent[] = [[d.datum, { specId, key: specId }]];\n          const actions = {\n            ...(onElementClick && {\n              onClick: () => {\n                onElementClick(elements);\n              },\n            }),\n            ...(onElementOver && {\n              onMouseOver: () => {\n                onElementOver(elements);\n              },\n            }),\n            ...(onElementOut && {\n              onMouseOut: () => {\n                onElementOut();\n              },\n            }),\n          };\n          return (\n            <text\n              key={String(i)}\n              style={{\n                fontSize: getFontSize(d),\n                fontStyle: getFontStyle(d),\n                fontFamily: getFont(d),\n                fontWeight: getFontWeight(d),\n                fill: d.color,\n              }}\n              textAnchor=\"middle\"\n              transform={`translate(${d.x}, ${d.y}) rotate(${d.rotate})`}\n              {...actions}\n            >\n              {d.text}\n            </text>\n          );\n        })}\n      </g>\n    </svg>\n  );\n};\n\ninterface ReactiveChartStateProps {\n  initialized: boolean;\n  geometries: ShapeViewModel;\n  chartSize: Size;\n  a11ySettings: A11ySettings;\n  onElementClick?: SettingsSpec['onElementClick'];\n  onElementOver?: SettingsSpec['onElementOver'];\n  onElementOut?: SettingsSpec['onElementOut'];\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ntype Props = ReactiveChartStateProps & ReactiveChartDispatchProps;\n\nclass Component extends React.Component<Props> {\n  static displayName = 'Wordcloud';\n\n  componentDidMount() {\n    if (this.props.initialized) {\n      this.props.onChartRendered();\n    }\n  }\n\n  componentDidUpdate() {\n    if (this.props.initialized) {\n      this.props.onChartRendered();\n    }\n  }\n\n  render() {\n    const {\n      initialized,\n      chartSize,\n      geometries: { wordcloudViewModel, specId },\n      a11ySettings,\n      onElementClick,\n      onElementOver,\n      onElementOut,\n    } = this.props;\n\n    if (!initialized || chartSize.width === 0 || chartSize.height === 0) {\n      return null;\n    }\n\n    const layout = layoutMaker(wordcloudViewModel, chartSize);\n\n    let renderedWordObjects: Word[] = [];\n    layout.on('end', (w) => (renderedWordObjects = w)).start();\n\n    const wordCount = wordcloudViewModel.data.length;\n    const renderedWordCount: number = renderedWordObjects.length;\n    const notAllWordsFit = wordCount !== renderedWordCount;\n    if (notAllWordsFit && wordcloudViewModel.outOfRoomCallback instanceof Function) {\n      wordcloudViewModel.outOfRoomCallback(\n        wordCount,\n        renderedWordCount,\n        renderedWordObjects.map((word) => word.text),\n      );\n    }\n\n    return (\n      <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n        <View\n          words={renderedWordObjects}\n          size={chartSize}\n          actions={{ onElementClick, onElementOut, onElementOver }}\n          specId={specId}\n        />\n        <ScreenReaderSummary />\n      </figure>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  initialized: false,\n  geometries: nullShapeViewModel(),\n  chartSize: {\n    width: 0,\n    height: 0,\n  },\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n  return {\n    initialized: true,\n    geometries: geometries(state),\n    chartSize: state.parentDimensions,\n    a11ySettings: getA11ySettingsSelector(state),\n    onElementClick: getSettingsSpecSelector(state).onElementClick,\n    onElementOver: getSettingsSpecSelector(state).onElementOver,\n    onElementOut: getSettingsSpecSelector(state).onElementOut,\n  };\n};\n\n/** @internal */\nexport const Wordcloud = connect(mapStateToProps, mapDispatchToProps)(Component);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { specComponentFactory } from '../../../state/spec_factory';\nimport { defaultWordcloudSpec, WordcloudViewModel } from '../layout/types/viewmodel_types';\n\n/** @alpha */\nexport interface WordcloudSpec extends Spec, WordcloudViewModel {\n  chartType: typeof ChartType.Wordcloud;\n  specType: typeof SpecType.Series;\n}\n\n/**\n * Adds wordcloud spec to chart\n * @alpha\n */\nexport const Wordcloud = specComponentFactory<WordcloudSpec>()(\n  {\n    chartType: ChartType.Wordcloud,\n    specType: SpecType.Series,\n  },\n  {\n    ...defaultWordcloudSpec,\n  },\n);\n\n/** @public */\nexport type WordcloudProps = ComponentProps<typeof Wordcloud>;\n\nexport { WordModel, WeightFn, OutOfRoomCallback } from '../layout/types/viewmodel_types';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { getWordcloudSpecSelector } from './selectors/wordcloud_spec';\nimport { ChartType } from '../..';\nimport { DEFAULT_CSS_CURSOR } from '../../../common/constants';\nimport { LegendItem } from '../../../common/legend';\nimport { InternalChartState, GlobalChartState } from '../../../state/chart_state';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { LegendItemLabel } from '../../../state/selectors/get_legend_items_labels';\nimport { DebugState } from '../../../state/types';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { Wordcloud } from '../renderer/svg/connected_component';\n\nconst EMPTY_MAP = new Map();\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\nconst EMPTY_LEGEND_ITEM_LIST: LegendItemLabel[] = [];\nconst EMPTY_TOOLTIP = Object.freeze({ header: null, values: [] });\n\n/** @internal */\nexport class WordcloudState implements InternalChartState {\n  chartType = ChartType.Wordcloud;\n\n  isInitialized(globalState: GlobalChartState) {\n    return getWordcloudSpecSelector(globalState) !== null ? InitStatus.Initialized : InitStatus.ChartNotInitialized;\n  }\n\n  isBrushAvailable() {\n    return false;\n  }\n\n  isBrushing() {\n    return false;\n  }\n\n  isChartEmpty() {\n    return false;\n  }\n\n  getLegendItems() {\n    return EMPTY_LEGEND_LIST;\n  }\n\n  getLegendItemsLabels() {\n    return EMPTY_LEGEND_ITEM_LIST;\n  }\n\n  getLegendExtraValues() {\n    return EMPTY_MAP;\n  }\n\n  chartRenderer() {\n    return <Wordcloud />;\n  }\n\n  getPointerCursor() {\n    return DEFAULT_CSS_CURSOR;\n  }\n\n  isTooltipVisible() {\n    return {\n      visible: false,\n      isExternal: false,\n      displayOnly: false,\n      isPinnable: false,\n    };\n  }\n\n  getTooltipInfo() {\n    return EMPTY_TOOLTIP;\n  }\n\n  getTooltipAnchor(state: GlobalChartState) {\n    const { position } = state.interactions.pointer.current;\n    return {\n      isRotated: false,\n      x: position.x,\n      width: 0,\n      y: position.y,\n      height: 0,\n    };\n  }\n\n  eventCallbacks() {}\n\n  getChartTypeDescription() {\n    return 'Word cloud chart';\n  }\n\n  // TODO\n  getProjectionContainerArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getMainProjectionArea(): Dimensions {\n    return { width: 0, height: 0, top: 0, left: 0 };\n  }\n\n  // TODO\n  getBrushArea(): Dimensions | null {\n    return null;\n  }\n\n  // TODO\n  getDebugState(): DebugState {\n    return {};\n  }\n\n  getSmallMultiplesDomains() {\n    return {\n      smHDomain: [],\n      smVDomain: [],\n    };\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { render } from './scenegraph';\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { nullShapeViewModel, ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { WordcloudSpec } from '../../specs';\n\nconst getParentDimensions = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const geometries = createCustomCachedSelector(\n  [getSpecs, getChartThemeSelector, getParentDimensions],\n  (specs, theme, parentDimensions): ShapeViewModel => {\n    const wordcloudSpec = getSpecFromStore<WordcloudSpec, false>(specs, ChartType.Wordcloud, SpecType.Series, false);\n    return wordcloudSpec ? render(wordcloudSpec, theme, parentDimensions) : nullShapeViewModel();\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { ShapeViewModel } from '../../layout/types/viewmodel_types';\nimport { shapeViewModel } from '../../layout/viewmodel/viewmodel';\nimport { WordcloudSpec } from '../../specs';\n\n/** @internal */\nexport function render(spec: WordcloudSpec, theme: Theme, parentDimensions: Dimensions): ShapeViewModel {\n  return shapeViewModel(spec, theme, parentDimensions);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getSpecFromStore } from '../../../../state/utils';\nimport { WordcloudSpec } from '../../specs';\n\n/** @internal */\nexport function getWordcloudSpecSelector(state: GlobalChartState): WordcloudSpec | null {\n  return getSpecFromStore<WordcloudSpec, false>(state.specs, ChartType.Wordcloud, SpecType.Series, false);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnnotationLineProps } from './types';\nimport { Colors } from '../../../../common/colors';\nimport { SmallMultipleScales, getPanelSize } from '../../../../common/panel_utils';\nimport { Line } from '../../../../geoms/types';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { isBandScale, isContinuousScale } from '../../../../scales/types';\nimport { Position, Rotation } from '../../../../utils/common';\nimport { Dimensions, Size } from '../../../../utils/dimensions';\nimport { GroupId } from '../../../../utils/ids';\nimport { mergeWithDefaultAnnotationLine } from '../../../../utils/themes/merge_utils';\nimport { isHorizontalRotation, isVerticalRotation } from '../../state/utils/common';\nimport { computeXScaleOffset } from '../../state/utils/utils';\nimport { AnnotationDomainType, LineAnnotationDatum, LineAnnotationSpec } from '../../utils/specs';\n\nfunction computeYDomainLineAnnotationDimensions(\n  annotationSpec: LineAnnotationSpec,\n  yScale: ScaleContinuous,\n  { vertical, horizontal }: SmallMultipleScales,\n  chartRotation: Rotation,\n  axisPosition?: Position,\n): AnnotationLineProps[] {\n  const {\n    id: specId,\n    dataValues,\n    marker: icon,\n    markerBody: body,\n    markerDimensions: dimension,\n    markerPosition: specMarkerPosition,\n    style,\n  } = annotationSpec;\n  const lineStyle = mergeWithDefaultAnnotationLine(style);\n  const color = lineStyle?.line?.stroke ?? Colors.Red.keyword;\n  const isHorizontalChartRotation = isHorizontalRotation(chartRotation);\n  // let's use a default Bottom-X/Left-Y axis orientation if we are not showing an axis\n  // but we are displaying a line annotation\n\n  const lineProps: AnnotationLineProps[] = [];\n  const [domainStart, domainEnd] = yScale.domain;\n\n  const panelSize = getPanelSize({ vertical, horizontal });\n\n  dataValues.forEach((datum: LineAnnotationDatum, i) => {\n    const { dataValue } = datum;\n\n    // avoid rendering invalid annotation value\n    if (!dataValue && dataValue !== 0) return;\n\n    const annotationValueYPosition = yScale.scale(dataValue);\n    // avoid rendering non scalable annotation values\n    if (Number.isNaN(annotationValueYPosition)) return;\n\n    // avoid rendering annotation with values outside the scale domain\n    if (dataValue < domainStart || dataValue > domainEnd) return;\n\n    vertical.domain.forEach((verticalValue) => {\n      horizontal.domain.forEach((horizontalValue) => {\n        const top = vertical.scale(verticalValue);\n        const left = horizontal.scale(horizontalValue);\n        if (Number.isNaN(top + left)) return;\n\n        const width = isHorizontalChartRotation ? horizontal.bandwidth : vertical.bandwidth;\n        const height = isHorizontalChartRotation ? vertical.bandwidth : horizontal.bandwidth;\n        const linePathPoints = getYLinePath({ width, height }, annotationValueYPosition);\n        const alignment = getAnchorPosition(false, chartRotation, axisPosition, specMarkerPosition);\n\n        const position = getMarkerPositionForYAnnotation(\n          panelSize,\n          chartRotation,\n          alignment,\n          annotationValueYPosition,\n          dimension,\n        );\n\n        const lineProp: AnnotationLineProps = {\n          specId,\n          id: getAnnotationLinePropsId(specId, datum, i, verticalValue, horizontalValue),\n          datum,\n          linePathPoints,\n          markers: icon\n            ? [\n                {\n                  icon,\n                  body,\n                  color,\n                  dimension,\n                  position,\n                  alignment,\n                },\n              ]\n            : [],\n          panel: {\n            ...panelSize,\n            top,\n            left,\n          },\n        };\n\n        lineProps.push(lineProp);\n      });\n    });\n  });\n\n  return lineProps;\n}\n\nfunction computeXDomainLineAnnotationDimensions(\n  annotationSpec: LineAnnotationSpec,\n  xScale: ScaleContinuous | ScaleBand,\n  { vertical, horizontal }: SmallMultipleScales,\n  chartRotation: Rotation,\n  isHistogramMode: boolean,\n  axisPosition?: Position,\n): AnnotationLineProps[] {\n  const {\n    id: specId,\n    dataValues,\n    marker: icon,\n    markerBody: body,\n    markerDimensions: dimension,\n    markerPosition: specMarkerPosition,\n    style,\n  } = annotationSpec;\n  const lineStyle = mergeWithDefaultAnnotationLine(style);\n  const color = lineStyle?.line?.stroke ?? Colors.Red.keyword;\n\n  const lineProps: AnnotationLineProps[] = [];\n  const isHorizontalChartRotation = isHorizontalRotation(chartRotation);\n  const panelSize = getPanelSize({ vertical, horizontal });\n\n  dataValues.forEach((datum: LineAnnotationDatum, i) => {\n    const { dataValue } = datum;\n    let annotationValueXPosition = xScale.scale(dataValue);\n    if (Number.isNaN(annotationValueXPosition)) {\n      return;\n    }\n    if (isContinuousScale(xScale) && typeof dataValue === 'number') {\n      const [minDomain, scaleMaxDomain] = xScale.domain;\n      const maxDomain = isHistogramMode ? scaleMaxDomain + xScale.minInterval : scaleMaxDomain;\n      if (dataValue < minDomain || dataValue > maxDomain) {\n        return;\n      }\n      if (isHistogramMode) {\n        const offset = computeXScaleOffset(xScale, true);\n        const pureScaledValue = xScale.pureScale(dataValue);\n        if (!Number.isNaN(pureScaledValue)) {\n          // Number.isFinite is regrettably not a type guard yet https://github.com/microsoft/TypeScript/issues/10038#issuecomment-924115831\n          annotationValueXPosition = pureScaledValue - offset;\n        }\n      } else {\n        annotationValueXPosition += (xScale.bandwidth * xScale.totalBarsInCluster) / 2;\n      }\n    } else if (isBandScale(xScale)) {\n      annotationValueXPosition += isHistogramMode\n        ? -(xScale.step - xScale.originalBandwidth) / 2\n        : xScale.originalBandwidth / 2;\n    } else {\n      return;\n    }\n    if (!isFinite(annotationValueXPosition)) {\n      return;\n    }\n\n    vertical.domain.forEach((verticalValue) => {\n      horizontal.domain.forEach((horizontalValue) => {\n        if (Number.isNaN(annotationValueXPosition)) return;\n\n        const top = vertical.scale(verticalValue);\n        const left = horizontal.scale(horizontalValue);\n        if (Number.isNaN(top + left)) return;\n\n        const width = isHorizontalChartRotation ? horizontal.bandwidth : vertical.bandwidth;\n        const height = isHorizontalChartRotation ? vertical.bandwidth : horizontal.bandwidth;\n\n        const linePathPoints = getXLinePath({ width, height }, annotationValueXPosition);\n        const alignment = getAnchorPosition(true, chartRotation, axisPosition, specMarkerPosition);\n\n        const position = getMarkerPositionForXAnnotation(\n          panelSize,\n          chartRotation,\n          alignment,\n          annotationValueXPosition,\n          dimension,\n        );\n\n        const lineProp: AnnotationLineProps = {\n          specId,\n          id: getAnnotationLinePropsId(specId, datum, i, verticalValue, horizontalValue),\n          datum,\n          linePathPoints,\n          markers: icon\n            ? [\n                {\n                  icon,\n                  body,\n                  color,\n                  dimension,\n                  position,\n                  alignment,\n                },\n              ]\n            : [],\n          panel: {\n            ...panelSize,\n            top,\n            left,\n          },\n        };\n        lineProps.push(lineProp);\n      });\n    });\n  });\n\n  return lineProps;\n}\n\n/** @internal */\nexport function computeLineAnnotationDimensions(\n  annotationSpec: LineAnnotationSpec,\n  chartRotation: Rotation,\n  yScales: Map<GroupId, ScaleContinuous>,\n  xScale: ScaleContinuous | ScaleBand,\n  smallMultipleScales: SmallMultipleScales,\n  isHistogramMode: boolean,\n  axisPosition?: Position,\n): AnnotationLineProps[] | null {\n  const { domainType, hideLines } = annotationSpec;\n\n  if (hideLines) {\n    return null;\n  }\n\n  if (domainType === AnnotationDomainType.XDomain) {\n    return computeXDomainLineAnnotationDimensions(\n      annotationSpec,\n      xScale,\n      smallMultipleScales,\n      chartRotation,\n      isHistogramMode,\n      axisPosition,\n    );\n  }\n\n  const { groupId } = annotationSpec;\n  const yScale = yScales.get(groupId);\n  if (!yScale) {\n    return null;\n  }\n\n  return computeYDomainLineAnnotationDimensions(\n    annotationSpec,\n    yScale,\n    smallMultipleScales,\n    chartRotation,\n    axisPosition,\n  );\n}\n\nfunction getAnchorPosition(\n  isXDomain: boolean,\n  chartRotation: Rotation,\n  axisPosition?: Position,\n  specMarkerPosition?: Position,\n): Position {\n  const dflPositionFromAxis = getDefaultMarkerPositionFromAxis(isXDomain, chartRotation, axisPosition);\n  if (specMarkerPosition !== undefined) {\n    // validate specMarkerPosition against domain\n    const validatedPosFromMarkerPos = validateMarkerPosition(isXDomain, chartRotation, specMarkerPosition);\n    return validatedPosFromMarkerPos ?? dflPositionFromAxis;\n  }\n  return dflPositionFromAxis;\n}\n\nfunction validateMarkerPosition(isXDomain: boolean, chartRotation: Rotation, position: Position): Position | undefined {\n  if ((isXDomain && isHorizontalRotation(chartRotation)) || (!isXDomain && isVerticalRotation(chartRotation))) {\n    return position === Position.Top || position === Position.Bottom ? position : undefined;\n  }\n  return position === Position.Left || position === Position.Right ? position : undefined;\n}\n\nfunction getDefaultMarkerPositionFromAxis(\n  isXDomain: boolean,\n  chartRotation: Rotation,\n  axisPosition?: Position,\n): Position {\n  if (axisPosition) {\n    return axisPosition;\n  }\n  if ((isXDomain && isVerticalRotation(chartRotation)) || (!isXDomain && isHorizontalRotation(chartRotation))) {\n    return Position.Left;\n  }\n  return Position.Bottom;\n}\n\nfunction getXLinePath({ height }: Size, value: number): Line {\n  return {\n    x1: value,\n    y1: 0,\n    x2: value,\n    y2: height,\n  };\n}\n\nfunction getYLinePath({ width }: Size, value: number): Line {\n  return {\n    x1: 0,\n    y1: value,\n    x2: width,\n    y2: value,\n  };\n}\n\n/** @internal */\nexport function getMarkerPositionForXAnnotation(\n  { width, height }: Size,\n  rotation: Rotation,\n  position: Position,\n  value: number,\n  { width: mWidth, height: mHeight }: Size = { width: 0, height: 0 },\n): Pick<Dimensions, 'top' | 'left'> {\n  switch (position) {\n    case Position.Right:\n      return {\n        top: rotation === -90 ? height - value - mHeight / 2 : value - mHeight / 2,\n        left: width,\n      };\n    case Position.Left:\n      return {\n        top: rotation === -90 ? height - value - mHeight / 2 : value - mHeight / 2,\n        left: -mWidth,\n      };\n    case Position.Top:\n      return {\n        top: 0 - mHeight,\n        left: rotation === 180 ? width - value - mWidth / 2 : value - mWidth / 2,\n      };\n    case Position.Bottom:\n    default:\n      return {\n        top: height,\n        left: rotation === 180 ? width - value - mWidth / 2 : value - mWidth / 2,\n      };\n  }\n}\n\nfunction getMarkerPositionForYAnnotation(\n  { width, height }: Size,\n  rotation: Rotation,\n  position: Position,\n  value: number,\n  { width: mWidth, height: mHeight }: Size = { width: 0, height: 0 },\n): Pick<Dimensions, 'top' | 'left'> {\n  switch (position) {\n    case Position.Right:\n      return {\n        top: rotation === 180 ? height - value - mHeight / 2 : value - mHeight / 2,\n        left: width,\n      };\n    case Position.Left:\n      return {\n        top: rotation === 180 ? height - value - mHeight / 2 : value - mHeight / 2,\n        left: -mWidth,\n      };\n    case Position.Top:\n      return {\n        top: -mHeight,\n        left: rotation === 90 ? width - value - mWidth / 2 : value - mWidth / 2,\n      };\n    case Position.Bottom:\n    default:\n      return {\n        top: height,\n        left: rotation === 90 ? width - value - mWidth / 2 : value - mWidth / 2,\n      };\n  }\n}\n\n/**\n * @internal\n */\nexport function getAnnotationLinePropsId(\n  specId: string,\n  datum: LineAnnotationDatum,\n  index: number,\n  verticalValue?: any,\n  horizontalValue?: any,\n) {\n  return [specId, verticalValue, horizontalValue, datum.header, datum.details, index].join('__');\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnnotationRectProps } from './types';\nimport { getPanelSize, SmallMultipleScales } from '../../../../common/panel_utils';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { isBandScale, isContinuousScale } from '../../../../scales/types';\nimport { isDefined, isNil, Position, Rotation } from '../../../../utils/common';\nimport { AxisId, GroupId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { AxisStyle } from '../../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\nimport { isHorizontalRotation, isVerticalRotation } from '../../state/utils/common';\nimport { getAxesSpecForSpecId } from '../../state/utils/spec';\nimport { AxisSpec, RectAnnotationDatum, RectAnnotationSpec } from '../../utils/specs';\nimport { Bounds } from '../types';\n\n/** @internal */\nexport function isWithinRectBounds({ x, y }: Point, { startX, endX, startY, endY }: Bounds): boolean {\n  const withinXBounds = x >= startX && x <= endX;\n  const withinYBounds = y >= startY && y <= endY;\n\n  return withinXBounds && withinYBounds;\n}\n\n/** @internal */\nexport function computeRectAnnotationDimensions(\n  annotationSpec: RectAnnotationSpec,\n  yScales: Map<GroupId, ScaleContinuous>,\n  xScale: ScaleBand | ScaleContinuous,\n  axesSpecs: AxisSpec[],\n  smallMultiplesScales: SmallMultipleScales,\n  chartRotation: Rotation,\n  getAxisStyle: (id?: AxisId) => AxisStyle,\n  isHistogram: boolean = false,\n): AnnotationRectProps[] | null {\n  const { dataValues, groupId, outside, id: annotationSpecId } = annotationSpec;\n  const { xAxis, yAxis } = getAxesSpecForSpecId(axesSpecs, groupId);\n  const yScale = yScales.get(groupId);\n  const rectsProps: Omit<AnnotationRectProps, 'id' | 'panel'>[] = [];\n  const panelSize = getPanelSize(smallMultiplesScales);\n\n  dataValues.forEach((datum: RectAnnotationDatum) => {\n    const { x0: initialX0, x1: initialX1, y0: initialY0, y1: initialY1 } = datum.coordinates;\n\n    // if everything is null, return; otherwise we coerce the other coordinates\n    if (initialX0 === null && initialX1 === null && initialY0 === null && initialY1 === null) {\n      return;\n    }\n    let height: number | undefined;\n\n    const [x0, x1] = limitValueToDomainRange(xScale, initialX0, initialX1, isHistogram);\n    // something is wrong with the data types, don't draw this annotation\n    if (x0 === null || x1 === null) {\n      return;\n    }\n\n    let xAndWidth: { x: number; width: number } | null = null;\n\n    if (isBandScale(xScale)) {\n      xAndWidth = scaleXonBandScale(xScale, x0, x1);\n    } else if (isContinuousScale(xScale)) {\n      xAndWidth = scaleXonContinuousScale(xScale, x0, x1, isHistogram);\n    }\n    // something is wrong with scales, don't draw\n    if (!xAndWidth) {\n      return;\n    }\n\n    if (!yScale) {\n      if (!isDefined(initialY0) && !isDefined(initialY1)) {\n        const isLeftSide =\n          (chartRotation === 0 && xAxis?.position === Position.Bottom) ||\n          (chartRotation === 180 && xAxis?.position === Position.Top) ||\n          (chartRotation === -90 && yAxis?.position === Position.Right) ||\n          (chartRotation === 90 && yAxis?.position === Position.Left);\n        const orthoDimension = isHorizontalRotation(chartRotation) ? panelSize.height : panelSize.width;\n        const outsideDim = annotationSpec.outsideDimension ?? getOutsideDimension(getAxisStyle(xAxis?.id ?? yAxis?.id));\n        const rectDimensions = {\n          ...xAndWidth,\n          ...(outside\n            ? {\n                y: isLeftSide ? orthoDimension : -outsideDim,\n                height: outsideDim,\n              }\n            : {\n                y: 0,\n                height: orthoDimension,\n              }),\n        };\n        rectsProps.push({\n          specId: annotationSpecId,\n          rect: rectDimensions,\n          datum,\n        });\n      }\n      return;\n    }\n\n    const [y0, y1] = limitValueToDomainRange(yScale, initialY0, initialY1);\n    // something is wrong with the data types, don't draw this annotation\n    if (!Number.isFinite(y0) || !Number.isFinite(y1)) return;\n\n    let scaledY1 = yScale.pureScale(y1);\n    const scaledY0 = yScale.pureScale(y0);\n    if (Number.isNaN(scaledY1) || Number.isNaN(scaledY0)) return;\n\n    height = Math.abs(scaledY0 - scaledY1);\n    // if the annotation height is 0 override it with the height from chart dimension and if the values in the domain are the same\n    if (height === 0 && yScale.domain.length === 2 && yScale.domain[0] === yScale.domain[1]) {\n      // eslint-disable-next-line prefer-destructuring\n      height = panelSize.height;\n      scaledY1 = 0;\n    }\n\n    const orthoDimension = isVerticalRotation(chartRotation) ? panelSize.height : panelSize.width;\n    const isLeftSide =\n      (chartRotation === 0 && yAxis?.position === Position.Left) ||\n      (chartRotation === 180 && yAxis?.position === Position.Right) ||\n      (chartRotation === -90 && xAxis?.position === Position.Bottom) ||\n      (chartRotation === 90 && xAxis?.position === Position.Top);\n    const outsideDim = annotationSpec.outsideDimension ?? getOutsideDimension(getAxisStyle(xAxis?.id ?? yAxis?.id));\n    const rectDimensions = {\n      ...(!isDefined(initialX0) && !isDefined(initialX1) && outside\n        ? {\n            x: isLeftSide ? -outsideDim : orthoDimension,\n            width: outsideDim,\n          }\n        : xAndWidth),\n      y: scaledY1,\n      height,\n    };\n\n    rectsProps.push({\n      specId: annotationSpecId,\n      rect: rectDimensions,\n      datum,\n    });\n  });\n\n  return rectsProps.reduce<AnnotationRectProps[]>((acc, props, i) => {\n    const duplicated: AnnotationRectProps[] = [];\n    smallMultiplesScales.vertical.domain.forEach((vDomainValue) => {\n      smallMultiplesScales.horizontal.domain.forEach((hDomainValue) => {\n        const id = getAnnotationRectPropsId(annotationSpecId, props.datum, i, vDomainValue, hDomainValue);\n        const top = smallMultiplesScales.vertical.scale(vDomainValue);\n        const left = smallMultiplesScales.horizontal.scale(hDomainValue);\n        if (Number.isNaN(top + left)) return;\n        const panel = { ...panelSize, top, left };\n        duplicated.push({ ...props, panel, id });\n      });\n    });\n    return [...acc, ...duplicated];\n  }, []);\n}\n\nfunction scaleXonBandScale(\n  xScale: ScaleBand,\n  x0: string | number,\n  x1: string | number,\n): { x: number; width: number } | null {\n  // the band scale return the start of the band, we need to cover\n  // also the inner padding of the bar\n  const padding = (xScale.step - xScale.originalBandwidth) / 2;\n  let scaledX1 = xScale.scale(x1);\n  let scaledX0 = xScale.scale(x0);\n  if (Number.isNaN(scaledX1 + scaledX0)) {\n    return null;\n  }\n  // extend the x1 scaled value to fully cover the last bar\n  scaledX1 += xScale.originalBandwidth + padding;\n  // give the x1 value a maximum of the chart range\n  if (scaledX1 > xScale.range[1]) {\n    scaledX1 = xScale.range[1];\n  }\n\n  scaledX0 -= padding;\n  if (scaledX0 < xScale.range[0]) {\n    scaledX0 = xScale.range[0];\n  }\n  const width = Math.abs(scaledX1 - scaledX0);\n  return {\n    x: scaledX0,\n    width,\n  };\n}\n\nfunction scaleXonContinuousScale(\n  xScale: ScaleContinuous,\n  x0: PrimitiveValue,\n  x1: PrimitiveValue,\n  isHistogramModeEnabled: boolean = false,\n): { x: number; width: number } | null {\n  if (typeof x1 !== 'number' || typeof x0 !== 'number') {\n    return null;\n  }\n  const scaledX0 = xScale.scale(x0);\n  const scaledX1 =\n    xScale.totalBarsInCluster > 0 && !isHistogramModeEnabled ? xScale.scale(x1 + xScale.minInterval) : xScale.scale(x1);\n  // the width needs to be computed before adjusting the x anchor\n  const width = Math.abs(scaledX1 - scaledX0);\n  return Number.isNaN(width)\n    ? null\n    : { width, x: scaledX0 - (xScale.bandwidthPadding / 2) * xScale.totalBarsInCluster };\n}\n\n/**\n * This function extend and limits the values in a scale domain\n * @param scale the scale\n * @param minValue a min value\n * @param maxValue a max value\n * @param isHistogram\n */\nfunction limitValueToDomainRange(\n  scale: ScaleBand | ScaleContinuous,\n  minValue?: PrimitiveValue,\n  maxValue?: PrimitiveValue,\n  isHistogram = false,\n): [PrimitiveValue, PrimitiveValue] {\n  if (isContinuousScale(scale)) {\n    const [domainStartValue, domainEndValue] = scale.domain;\n    const min = maxOf(domainStartValue, minValue);\n    const max = minOf(isHistogram ? domainEndValue + scale.minInterval : domainEndValue, maxValue);\n    // extend to edge values if values are null/undefined\n    return min !== null && max !== null && min > max ? [null, null] : [min, max];\n  } else {\n    const min = isNil(minValue) || !scale.domain.includes(minValue) ? scale.domain[0] : minValue;\n    const max = isNil(maxValue) || !scale.domain.includes(maxValue) ? scale.domain.at(-1) : maxValue;\n    return [min ?? null, max ?? null];\n  }\n}\n\nfunction minOf(base: number, value?: number | string | null | undefined): number | string {\n  return typeof value === 'number' ? Math.min(value, base) : typeof value === 'string' ? value : base;\n}\n\nfunction maxOf(base: number, value: number | string | null | undefined): number | string {\n  return typeof value === 'number' ? Math.max(value, base) : typeof value === 'string' ? value : base;\n}\n\nfunction getOutsideDimension({ tickLine: { visible, size } }: AxisStyle): number {\n  return visible ? size : 0;\n}\n\n/**\n * @internal\n */\nexport function getAnnotationRectPropsId(\n  specId: string,\n  datum: RectAnnotationDatum,\n  index: number,\n  verticalValue: number | string,\n  horizontalValue: number | string,\n) {\n  return [specId, verticalValue, horizontalValue, ...Object.values(datum.coordinates), datum.details, index].join('__');\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isWithinRectBounds } from './dimensions';\nimport { AnnotationRectProps } from './types';\nimport { Rect } from '../../../../geoms/types';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { SpecId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { isHorizontalRotation } from '../../state/utils/common';\nimport { AnnotationType } from '../../utils/specs';\nimport { AnnotationTooltipState, Bounds } from '../types';\n\n/** @internal */\nexport function getRectAnnotationTooltipState(\n  cursorPosition: Point,\n  annotationRects: AnnotationRectProps[],\n  rotation: Rotation,\n  chartDimensions: Dimensions,\n  specId: SpecId,\n): AnnotationTooltipState | null {\n  for (const annotationRect of annotationRects) {\n    const { rect, panel, datum, id } = annotationRect;\n    const newRect = transformRotateRect(rect, rotation, panel);\n    const startX = newRect.x + chartDimensions.left + panel.left;\n    const endX = startX + newRect.width;\n    const startY = newRect.y + chartDimensions.top + panel.top;\n    const endY = startY + newRect.height;\n    const bounds: Bounds = { startX, endX, startY, endY };\n    const isWithinBounds = isWithinRectBounds(cursorPosition, bounds);\n\n    if (isWithinBounds) {\n      return {\n        id, // annotation id\n        specId,\n        isVisible: true,\n        annotationType: AnnotationType.Rectangle,\n        anchor: {\n          x: cursorPosition.x,\n          y: cursorPosition.y,\n          width: 0,\n          height: 0,\n        },\n        datum,\n      };\n    }\n  }\n\n  return null;\n}\n\nfunction transformRotateRect(rect: Rect, rotation: Rotation, dim: Dimensions): Rect {\n  const isHorizontalRotated = isHorizontalRotation(rotation);\n  const width = isHorizontalRotated ? dim.width : dim.height;\n  const height = isHorizontalRotated ? dim.height : dim.width;\n\n  switch (rotation) {\n    case 90:\n      return {\n        x: height - rect.height - rect.y,\n        y: rect.x,\n        width: rect.height,\n        height: rect.width,\n      };\n    case -90:\n      return {\n        x: rect.y,\n        y: width - rect.x - rect.width,\n        width: rect.height,\n        height: rect.width,\n      };\n    case 180:\n      return {\n        x: width - rect.x - rect.width,\n        y: height - rect.y - rect.height,\n        width: rect.width,\n        height: rect.height,\n      };\n    case 0:\n    default:\n      return rect;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getRectAnnotationTooltipState } from './rect/tooltip';\nimport { AnnotationRectProps } from './rect/types';\nimport { AnnotationDimensions, AnnotationTooltipState } from './types';\nimport { TooltipPortalSettings } from '../../../components/portal';\nimport { Rotation } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { AnnotationId } from '../../../utils/ids';\nimport { Point } from '../../../utils/point';\nimport { AnnotationSpec, isRectAnnotation } from '../utils/specs';\n\n/** @internal */\nexport function computeRectAnnotationTooltipState(\n  cursorPosition: Point,\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  annotationSpecs: AnnotationSpec[],\n  chartRotation: Rotation,\n  chartDimensions: Dimensions,\n): AnnotationTooltipState | null {\n  // allow picking up the last spec added as the top most or use its zIndex value\n  const sortedAnnotationSpecs = annotationSpecs\n    .filter(isRectAnnotation)\n    .sort(({ zIndex: a = Number.MIN_SAFE_INTEGER }, { zIndex: b = Number.MIN_SAFE_INTEGER }) => a - b);\n\n  for (let i = 0; i < sortedAnnotationSpecs.length; i++) {\n    const spec = sortedAnnotationSpecs[i];\n    const annotationDimension = spec?.id && annotationDimensions.get(spec.id);\n    if (!spec || spec.hideTooltips || !annotationDimension) {\n      continue;\n    }\n    const { customTooltip, customTooltipDetails } = spec;\n\n    const tooltipSettings = getTooltipSettings(spec);\n\n    const rectAnnotationTooltipState = getRectAnnotationTooltipState(\n      cursorPosition,\n      annotationDimension as AnnotationRectProps[],\n      chartRotation,\n      chartDimensions,\n      spec.id,\n    );\n\n    if (rectAnnotationTooltipState) {\n      return {\n        ...rectAnnotationTooltipState,\n        tooltipSettings,\n        customTooltip,\n        customTooltipDetails,\n      };\n    }\n  }\n\n  return null;\n}\n\n/** @internal */\nexport function computeMultipleRectAnnotationTooltipState(\n  cursorPosition: Point,\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  annotationSpecs: AnnotationSpec[],\n  chartRotation: Rotation,\n  chartDimensions: Dimensions,\n): AnnotationTooltipState[] {\n  // allow picking up the last spec added as the top most or use its zIndex value\n  const sortedAnnotationSpecs = annotationSpecs\n    .filter(isRectAnnotation)\n    .sort(({ zIndex: a = Number.MIN_SAFE_INTEGER }, { zIndex: b = Number.MIN_SAFE_INTEGER }) => a - b);\n  return sortedAnnotationSpecs.reduce<AnnotationTooltipState[]>((acc, spec) => {\n    const annotationDimension = annotationDimensions.get(spec.id);\n    if (!spec.hideTooltips && annotationDimension) {\n      const { customTooltip, customTooltipDetails } = spec;\n\n      const tooltipSettings = getTooltipSettings(spec);\n\n      const rectAnnotationTooltipState = getRectAnnotationTooltipState(\n        cursorPosition,\n        annotationDimension as AnnotationRectProps[],\n        chartRotation,\n        chartDimensions,\n        spec.id,\n      );\n      if (rectAnnotationTooltipState) {\n        acc.push({\n          ...rectAnnotationTooltipState,\n          tooltipSettings,\n          customTooltip,\n          customTooltipDetails,\n        });\n      }\n    }\n    return acc;\n  }, [] as AnnotationTooltipState[]);\n}\n\nfunction getTooltipSettings({\n  placement,\n  fallbackPlacements,\n  boundary,\n  offset,\n}: AnnotationSpec): TooltipPortalSettings<'chart'> {\n  return {\n    placement,\n    fallbackPlacements,\n    boundary,\n    offset,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentType, ReactNode } from 'react';\n\nimport { AnnotationLineProps } from './line/types';\nimport { AnnotationRectProps } from './rect/types';\nimport { Color } from '../../../common/colors';\nimport { TooltipPortalSettings } from '../../../components/portal';\nimport { Position } from '../../../utils/common';\nimport { AnnotationId, SpecId } from '../../../utils/ids';\nimport { AnnotationType, LineAnnotationDatum, RectAnnotationDatum } from '../utils/specs';\n\n/** @public */\nexport type AnnotationTooltipFormatter = ComponentType<{ details?: string }>;\n\n/** @public */\nexport type CustomAnnotationTooltip = ComponentType<{\n  header?: string;\n  details?: string;\n  datum: LineAnnotationDatum | RectAnnotationDatum;\n}> | null;\n\n/**\n * The header and description strings for an Annotation\n * @internal\n */\nexport interface AnnotationDetails {\n  headerText?: string;\n  detailsText?: string;\n}\n\n/**\n * Component to render based on annotation datum\n *\n * @public\n */\nexport type ComponentWithAnnotationDatum<D = any> = ComponentType<LineAnnotationDatum<D>>;\n\n/**\n * The marker for an Annotation. Usually a JSX element\n * @internal\n */\nexport interface AnnotationMarker {\n  icon?: ReactNode | ComponentWithAnnotationDatum;\n  position: {\n    top: number;\n    left: number;\n  };\n  dimension?: {\n    width: number;\n    height: number;\n  };\n  body?: ReactNode | ComponentWithAnnotationDatum;\n  alignment: Position;\n  color: Color;\n}\n\n/** @internal */\nexport interface AnnotationTooltipState {\n  id: AnnotationId;\n  specId: SpecId;\n  isVisible: true;\n  annotationType: AnnotationType;\n  datum: LineAnnotationDatum | RectAnnotationDatum;\n  anchor: {\n    x: number;\n    y: number;\n    width: number;\n    height: number;\n  };\n  customTooltipDetails?: AnnotationTooltipFormatter;\n  customTooltip?: CustomAnnotationTooltip;\n  tooltipSettings?: TooltipPortalSettings<'chart'>;\n}\n\n/** @internal */\nexport type AnnotationDimensions = Array<AnnotationLineProps | AnnotationRectProps>;\n\n/** @internal */\nexport type Bounds = {\n  startX: number;\n  endX: number;\n  startY: number;\n  endY: number;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLineAnnotationDimensions } from './line/dimensions';\nimport { computeRectAnnotationDimensions } from './rect/dimensions';\nimport { AnnotationDimensions } from './types';\nimport { SmallMultipleScales } from '../../../common/panel_utils';\nimport { SettingsSpec } from '../../../specs';\nimport { Rotation, Position } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { AnnotationId, AxisId, GroupId } from '../../../utils/ids';\nimport { Point } from '../../../utils/point';\nimport { AxisStyle } from '../../../utils/themes/theme';\nimport { getAxesSpecForSpecId } from '../state/utils/spec';\nimport { ComputedGeometries } from '../state/utils/types';\nimport { AnnotationDomainType, AnnotationSpec, AxisSpec, isLineAnnotation } from '../utils/specs';\n\n/** @internal */\nexport function getAnnotationAxis(\n  axesSpecs: AxisSpec[],\n  groupId: GroupId,\n  domainType: AnnotationDomainType,\n  chartRotation: Rotation,\n): Position | undefined {\n  const { xAxis, yAxis } = getAxesSpecForSpecId(axesSpecs, groupId, chartRotation);\n  const isXDomainAnnotation = isXDomain(domainType);\n  return isXDomainAnnotation ? xAxis?.position : yAxis?.position;\n}\n\n/** @internal */\nexport function isXDomain(domainType: AnnotationDomainType): boolean {\n  return domainType === AnnotationDomainType.XDomain;\n}\n\n/** @internal */\nexport function getTransformedCursor(\n  cursorPosition: Point,\n  chartDimensions: Dimensions,\n  chartRotation: Rotation | null,\n  /**\n   * getTransformedCursor to account for projected cursor position relative to chart dimensions\n   */\n  projectArea = false,\n): Point {\n  const { height, width, left, top } = chartDimensions;\n  let { x, y } = cursorPosition;\n\n  if (projectArea) {\n    x = cursorPosition.x - left;\n    y = cursorPosition.y - top;\n  }\n\n  if (chartRotation === null) {\n    return { x, y };\n  }\n\n  switch (chartRotation) {\n    case 90:\n      return { x: y, y: width - x };\n    case -90:\n      return { x: height - y, y: x };\n    case 180:\n      return { x: width - x, y: height - y };\n    case 0:\n    default:\n      return { x, y };\n  }\n}\n\n/** @internal */\nexport function invertTransformedCursor(\n  cursorPosition: Point,\n  chartDimensions: Dimensions,\n  chartRotation: Rotation | null,\n  /**\n   * Used to account for projected cursor position relative to chart dimensions\n   */\n  projectArea = false,\n): Point {\n  const { height, width, left, top } = chartDimensions;\n  let { x, y } = cursorPosition;\n\n  switch (chartRotation) {\n    case 0:\n    case null:\n      break;\n    case 90:\n      x = width - cursorPosition.y;\n      y = cursorPosition.x;\n      break;\n    case -90:\n      y = height - cursorPosition.x;\n      x = cursorPosition.y;\n      break;\n    case 180:\n    default:\n      y = height - cursorPosition.y;\n      x = width - cursorPosition.x;\n  }\n\n  if (projectArea) {\n    x += left;\n    y += top;\n  }\n\n  return { x, y };\n}\n\n/** @internal */\nexport function computeAnnotationDimensions(\n  annotations: AnnotationSpec[],\n  { rotation: chartRotation }: Pick<SettingsSpec, 'rotation'>,\n  { scales: { xScale, yScales } }: Pick<ComputedGeometries, 'scales'>,\n  axesSpecs: AxisSpec[],\n  isHistogramModeEnabled: boolean,\n  smallMultipleScales: SmallMultipleScales,\n  getAxisStyle: (id?: AxisId) => AxisStyle,\n): Map<AnnotationId, AnnotationDimensions> {\n  return annotations.reduce<Map<AnnotationId, AnnotationDimensions>>((annotationDimensions, annotationSpec) => {\n    const { id } = annotationSpec;\n\n    if (isLineAnnotation(annotationSpec)) {\n      const { groupId, domainType } = annotationSpec;\n      const annotationAxisPosition = getAnnotationAxis(axesSpecs, groupId, domainType, chartRotation);\n\n      const dimensions = computeLineAnnotationDimensions(\n        annotationSpec,\n        chartRotation,\n        yScales,\n        xScale,\n        smallMultipleScales,\n        isHistogramModeEnabled,\n        annotationAxisPosition,\n      );\n      if (dimensions) {\n        annotationDimensions.set(id, dimensions);\n      }\n      return annotationDimensions;\n    } else {\n      const dimensions = computeRectAnnotationDimensions(\n        annotationSpec,\n        yScales,\n        xScale,\n        axesSpecs,\n        smallMultipleScales,\n        chartRotation,\n        getAxisStyle,\n        isHistogramModeEnabled,\n      );\n\n      if (dimensions) {\n        annotationDimensions.set(id, dimensions);\n      }\n      return annotationDimensions;\n    }\n  }, new Map());\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SmallMultiplesSpec } from '../../../specs';\nimport { Position } from '../../../utils/common';\nimport { innerPad, outerPad, PerSideDistance } from '../../../utils/dimensions';\nimport { AxisId } from '../../../utils/ids';\nimport { AxisStyle, Theme } from '../../../utils/themes/theme';\nimport { AxesTicksDimensions } from '../state/selectors/compute_axis_ticks_dimensions';\nimport { getSpecsById } from '../state/utils/spec';\nimport { isHorizontalAxis, isVerticalAxis } from '../utils/axis_type_utils';\nimport { getAllAxisLayersGirth, getTitleDimension, shouldShowTicks, TickLabelBounds } from '../utils/axis_utils';\nimport { AxisSpec } from '../utils/specs';\n\nconst getAxisSizeForLabel = (\n  axisSpec: AxisSpec,\n  { axes: sharedAxesStyles, chartMargins }: Theme,\n  axesStyles: Map<AxisId, AxisStyle | null>,\n  { maxLabelBboxWidth = 0, maxLabelBboxHeight = 0 }: TickLabelBounds,\n  smSpec: SmallMultiplesSpec | null,\n) => {\n  const { tickLine, axisTitle, axisPanelTitle, tickLabel } = axesStyles.get(axisSpec.id) ?? sharedAxesStyles;\n  const horizontal = isHorizontalAxis(axisSpec.position);\n  const maxLabelBoxGirth = horizontal ? maxLabelBboxHeight : maxLabelBboxWidth;\n  const allLayersGirth = getAllAxisLayersGirth(axisSpec.timeAxisLayerCount, maxLabelBoxGirth, horizontal);\n  const hasPanelTitle = isVerticalAxis(axisSpec.position) ? smSpec?.splitVertically : smSpec?.splitHorizontally;\n  const panelTitleDimension = hasPanelTitle ? getTitleDimension(axisPanelTitle) : 0;\n  const titleDimension = axisSpec.title ? getTitleDimension(axisTitle) : 0;\n  const tickDimension = shouldShowTicks(tickLine, axisSpec.hide) ? tickLine.size + tickLine.padding : 0;\n  const labelPaddingSum = tickLabel.visible ? innerPad(tickLabel.padding) + outerPad(tickLabel.padding) : 0;\n  const axisDimension = labelPaddingSum + tickDimension + titleDimension + panelTitleDimension;\n  const maxAxisGirth = axisDimension + (tickLabel.visible ? allLayersGirth : 0);\n  // gives space to longer labels: if vertical use half of the label height, if horizontal, use half of the max label (not ideal)\n  // don't overflow when the multiTimeAxis layer is used.\n  const maxLabelBoxHalfLength = isVerticalAxis(axisSpec.position)\n    ? maxLabelBboxHeight / 2\n    : axisSpec.timeAxisLayerCount > 0\n      ? 0\n      : maxLabelBboxWidth / 2;\n  return horizontal\n    ? {\n        top: axisSpec.position === Position.Top ? maxAxisGirth + chartMargins.top : 0,\n        bottom: axisSpec.position === Position.Bottom ? maxAxisGirth + chartMargins.bottom : 0,\n        left: maxLabelBoxHalfLength,\n        right: maxLabelBoxHalfLength,\n      }\n    : {\n        top: maxLabelBoxHalfLength,\n        bottom: maxLabelBoxHalfLength,\n        left: axisSpec.position === Position.Left ? maxAxisGirth + chartMargins.left : 0,\n        right: axisSpec.position === Position.Right ? maxAxisGirth + chartMargins.right : 0,\n      };\n};\n\n/** @internal */\nexport function getAxesDimensions(\n  theme: Theme,\n  axisDimensions: AxesTicksDimensions,\n  axesStyles: Map<AxisId, AxisStyle | null>,\n  axisSpecs: AxisSpec[],\n  smSpec: SmallMultiplesSpec | null,\n): PerSideDistance & { margin: { left: number } } {\n  const sizes = [...axisDimensions].reduce(\n    (acc, [id, tickLabelBounds]) => {\n      const axisSpec = getSpecsById<AxisSpec>(axisSpecs, id);\n      if (tickLabelBounds.isHidden || !axisSpec) return acc;\n      // TODO use first and last labels\n      const { top, bottom, left, right } = getAxisSizeForLabel(axisSpec, theme, axesStyles, tickLabelBounds, smSpec);\n      if (isVerticalAxis(axisSpec.position)) {\n        acc.axisLabelOverflow.top = Math.max(acc.axisLabelOverflow.top, top);\n        acc.axisLabelOverflow.bottom = Math.max(acc.axisLabelOverflow.bottom, bottom);\n        acc.axisMainSize.left += left;\n        acc.axisMainSize.right += right;\n      } else {\n        // find the max half label size to accommodate the left/right labels\n        acc.axisMainSize.top += top;\n        acc.axisMainSize.bottom += bottom;\n        acc.axisLabelOverflow.left = Math.max(acc.axisLabelOverflow.left, left);\n        acc.axisLabelOverflow.right = Math.max(acc.axisLabelOverflow.right, right);\n      }\n      return acc;\n    },\n    {\n      axisMainSize: { left: 0, right: 0, top: 0, bottom: 0 },\n      axisLabelOverflow: { left: 0, right: 0, top: 0, bottom: 0 },\n    },\n  );\n\n  const left = Math.max(sizes.axisLabelOverflow.left + theme.chartMargins.left, sizes.axisMainSize.left);\n  const right = Math.max(sizes.axisLabelOverflow.right + theme.chartMargins.right, sizes.axisMainSize.right);\n  const top = Math.max(sizes.axisLabelOverflow.top + theme.chartMargins.top, sizes.axisMainSize.top);\n  const bottom = Math.max(sizes.axisLabelOverflow.bottom + theme.chartMargins.bottom, sizes.axisMainSize.bottom);\n  return { left, right, top, bottom, margin: { left: left - sizes.axisMainSize.left } };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { addTime, propsFromCalendarObj, CalendarUnit } from './chrono';\n\nconst timeProps = ['epochSeconds', 'dayOfWeek'];\n\n/** @internal */\nexport const timeProp = Object.fromEntries(timeProps.map((propName, i) => [propName, i]));\n\n/** @public */\nexport const TimeProp = Object.freeze({\n  EpochSeconds: 0 as const,\n  DayOfWeek: 1 as const,\n});\n/** @public */\nexport type TimeProp = $Values<typeof TimeProp>;\n\nconst zonedDateTimeFromCache: Record<string, [number, number]> = {}; // without caching, even luxon is choppy with zoom and pan\n\ninterface TemporalArgs {\n  timeZone: string;\n  year: number;\n  month: number;\n  day: number;\n  hour?: number;\n  minute?: number;\n  second?: number;\n}\n\n/** @internal */\nexport const cachedZonedDateTimeFrom = (temporalArgs: TemporalArgs) => {\n  const { timeZone, year, month, day, hour = 0 } = temporalArgs;\n  const key = `_${year}_${month}_${day}_${hour}_${timeZone}`;\n  const cachedValue = zonedDateTimeFromCache[key];\n  if (cachedValue) {\n    return cachedValue;\n  }\n  const result = propsFromCalendarObj({ year, month, day, hour }, timeZone);\n  zonedDateTimeFromCache[key] = result;\n  return result;\n};\n\nconst deltaTimeCache: Record<string, number> = {}; // without caching, even luxon is choppy with zoom and pan\n\n/** @internal */\nexport const cachedTimeDelta = (temporalArgs: TemporalArgs, unit: CalendarUnit, count: number) => {\n  const { timeZone, year, month, day } = temporalArgs;\n  const key = `_${year}_${month}_${day}_${timeZone}_${count}_${unit}`;\n  const cachedValue = deltaTimeCache[key];\n  if (cachedValue) {\n    return cachedValue;\n  }\n  const result = addTime({ year, month, day }, timeZone, unit, count);\n  deltaTimeCache[key] = result;\n  return result;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  addTimeToObj,\n  CalendarObject,\n  timeObjFromCalendarObj,\n  timeObjFromEpochSeconds,\n  timeObjToSeconds,\n  timeObjToWeekday,\n  timeObjToYear,\n} from './chrono_luxon/chrono_luxon';\n//from './chrono-moment/chrono-moment'\n//from './chrono-proposal-temporal/chrono-proposal-temporal'\n\n/** @internal */\nexport type CalendarUnit = 'days'; // luxon has a lot of others but we don't use them here\n\n/**\n * library independent part\n * @internal\n */\nexport const propsFromCalendarObj = (calendarObj: CalendarObject, timeZone: string): [number, number] => {\n  const t = timeObjFromCalendarObj(calendarObj, timeZone);\n  return [timeObjToSeconds(t), timeObjToWeekday(t)];\n};\n\n/** @internal */\nexport const epochInSecondsToYear = (timeZone: string, seconds: number) =>\n  timeObjToYear(timeObjFromEpochSeconds(timeZone, seconds));\n\n/** @internal */\nexport const epochDaysInMonth = (timeZone: string, seconds: number) =>\n  timeObjFromEpochSeconds(timeZone, seconds).daysInMonth;\n\n/** @internal */\nexport const addTime = (calendarObj: CalendarObject, timeZone: string, unit: CalendarUnit, count: number) =>\n  timeObjToSeconds(addTimeToObj(timeObjFromCalendarObj(calendarObj, timeZone), unit, count));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport { DateTime } from 'luxon';\n\n/** @internal */\nexport interface CalendarObject {\n  year: number;\n  month: number;\n  day: number;\n  hour?: number;\n}\n\ntype CalendarUnit = 'days'; // luxon has a lot of others but we don't use them here\n\n/** @internal */\nexport const timeObjFromCalendarObj = (yearMonthDayHour: CalendarObject, timeZone: string) =>\n  DateTime.fromObject({ ...yearMonthDayHour, zone: timeZone });\n/** @internal */\nexport const timeObjFromEpochSeconds = (timeZone: string, seconds: number) =>\n  DateTime.fromSeconds(seconds, { zone: timeZone });\n/** @internal */\nexport const timeObjToSeconds = (t: DateTime) => t.toSeconds();\n/** @internal */\nexport const timeObjToWeekday = (t: DateTime) => t.weekday;\n/** @internal */\nexport const timeObjToYear = (t: DateTime) => t.year;\n/** @internal */\nexport const addTimeToObj = (obj: DateTime, unit: CalendarUnit, count: number) => obj.plus({ [unit]: count });\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* eslint-disable-next-line eslint-comments/disable-enable-pair */\n/* eslint-disable @typescript-eslint/unbound-method */\n\nimport { cachedTimeDelta, cachedZonedDateTimeFrom, TimeProp } from './chrono/cached_chrono';\nimport { epochDaysInMonth, epochInSecondsToYear } from './chrono/chrono';\n\n/** @public */\nexport type BinUnit = 'year' | 'month' | 'week' | 'day' | 'hour' | 'minute' | 'second' | 'millisecond' | 'one';\n\n// utils\n/** @public */\nexport const unitIntervalWidth: Record<BinUnit, number> = {\n  year: 365.25 * 24 * 60 * 60,\n  month: (365.25 * 24 * 60 * 60) / 12,\n  week: 7 * 24 * 60 * 60,\n  day: 24 * 60 * 60,\n  hour: 60 * 60,\n  minute: 60,\n  second: 1, // for time, one second is the unit\n  millisecond: 0.001,\n  one: 1,\n};\n\n/**\n * Left closed, right open interval on (connected subset of) on a partially ordered set\n * Poset covers real numbers, integers, time, ordinals incl. ordered categories, trees, DAGs\n * Valid but useless for fully unordered categorical (nominal) values.\n * It's simply called Interval because we don't currently model other interval types eg. closed.\n * @public\n */\nexport interface Interval {\n  /**\n   * Lower bound of interval (included)\n   */\n  minimum: number;\n  /**\n   * Upper bound of interval (excluded)\n   */\n  supremum: number;\n  /**\n   * Upper bound of interval to stick text label\n   */\n  labelSupremum: number;\n}\n\ntype IntervalIterableMaker<T extends Interval> = (domainFrom: number, domainTo: number) => Iterable<T>;\n\ntype YearsAxisLayer = AxisLayer<Interval & { year: number }>;\n\n/** @internal */\nexport type NumberFormatter = (n: number) => string;\n\n/** @internal */\nexport type TimeFormatter = NumberFormatter & ReturnType<typeof Intl.DateTimeFormat>['format']; // numeric input to Intl.DateTimeFormat only\n\n/**\n * Partition of a connected subset of a totally ordered set into sub-intervals (ie. the sub-intervals are\n * gapless and overlap-free, covering a totally ordered set)\n * @internal\n */\n\nexport interface AxisLayer<T extends Interval> {\n  unit: BinUnit;\n  unitMultiplier: number;\n  labeled: boolean;\n  minimumTickPixelDistance: number;\n  intervals: IntervalIterableMaker<T>;\n  detailedLabelFormat: TimeFormatter;\n  minorTickLabelFormat: TimeFormatter;\n}\n\n/** @internal */\nexport interface RasterConfig {\n  minimumTickPixelDistance: number;\n  locale: string;\n}\n\nconst millisecondIntervals = (rasterMs: number): IntervalIterableMaker<Interval> =>\n  function* (domainFrom, domainTo) {\n    for (let t = Math.floor((domainFrom * 1000) / rasterMs); t < Math.ceil((domainTo * 1000) / rasterMs); t++) {\n      const minimum = (t * rasterMs) / 1000;\n      const supremum = minimum + rasterMs / 1000;\n      yield {\n        minimum,\n        supremum,\n        labelSupremum: supremum,\n      };\n    }\n  };\n\nconst monthBasedIntervals = (\n  years: YearsAxisLayer,\n  timeZone: string,\n  unitMultiplier: number,\n): IntervalIterableMaker<Interval & { year: number; month: number; days: number }> =>\n  function* (domainFrom, domainTo) {\n    for (const { year } of years.intervals(domainFrom, domainTo)) {\n      for (let month = 1; month <= 12; month += unitMultiplier) {\n        const timePoint = cachedZonedDateTimeFrom({ timeZone, year, month, day: 1 });\n        const binStart = timePoint[TimeProp.EpochSeconds];\n        const binEnd = cachedZonedDateTimeFrom({\n          timeZone,\n          year: month <= 12 - unitMultiplier ? year : year + 1,\n          month: ((month + unitMultiplier - 1) % 12) + 1,\n          day: 1,\n        })[TimeProp.EpochSeconds];\n        const days = epochDaysInMonth(timeZone, binStart);\n        yield {\n          year,\n          month,\n          days,\n          minimum: binStart,\n          supremum: binEnd,\n          labelSupremum: binEnd,\n        };\n      }\n    }\n  };\n\ninterface YearToDay {\n  year: number;\n  month: number;\n  dayOfMonth: number;\n  dayOfWeek: number;\n}\n\ninterface YearToHour extends YearToDay {\n  hour: number;\n}\n\nconst hourCycle = 'h23';\n\nconst hourFormat: Partial<ConstructorParameters<typeof Intl.DateTimeFormat>[1]> = {\n  hour: '2-digit',\n  minute: '2-digit',\n  // this is mutual exclusive with `hour12` and\n  // fix the issue of rendering the time from midnight starting at 24:00 to 24:59 to 01:00\n  hourCycle,\n};\n\nconst englishOrdinalEndings = {\n  zero: 'th',\n  one: 'st',\n  two: 'nd',\n  few: 'rd',\n  many: 'th',\n  other: 'th',\n};\nconst englishPluralRules = new Intl.PluralRules('en-US', { type: 'ordinal' });\nconst englishOrdinalEnding = (signedNumber: number) => englishOrdinalEndings[englishPluralRules.select(signedNumber)];\n\n/** @internal */\nexport const continuousTimeRasters = ({ minimumTickPixelDistance, locale }: RasterConfig, timeZone: string) => {\n  const minorDayBaseFormat = new Intl.DateTimeFormat(locale, { day: 'numeric', timeZone }).format;\n  const minorDayFormat = (d: number) => {\n    const numberString = minorDayBaseFormat(d);\n    const number = Number.parseInt(numberString, 10);\n    return locale.substring(0, 2) === 'en' ? `${numberString}${englishOrdinalEnding(number)}` : numberString;\n  };\n  const detailedDayFormat = new Intl.DateTimeFormat(locale, {\n    year: 'numeric',\n    month: 'long',\n    day: 'numeric',\n    timeZone,\n  }).format;\n\n  const detailedHourFormatBase = new Intl.DateTimeFormat(locale, {\n    year: 'numeric',\n    month: 'long',\n    day: 'numeric',\n    ...hourFormat,\n    timeZone,\n  }).format;\n  const detailedHourFormat = (d: number) => `${detailedHourFormatBase(d)}h`;\n\n  const years: YearsAxisLayer = {\n    unit: 'year',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 1.5,\n    intervals: function* (domainFrom, domainTo) {\n      const fromYear = epochInSecondsToYear(timeZone, domainFrom);\n      const toYear = epochInSecondsToYear(timeZone, domainTo);\n      for (let year = fromYear; year <= toYear; year++) {\n        const timePoint = cachedZonedDateTimeFrom({ timeZone, year, month: 1, day: 1 });\n        const binStart = timePoint[TimeProp.EpochSeconds];\n        const binEnd = cachedZonedDateTimeFrom({\n          timeZone,\n          year: year + 1,\n          month: 1,\n          day: 1,\n        })[TimeProp.EpochSeconds];\n        yield {\n          year,\n          minimum: binStart,\n          supremum: binEnd,\n          labelSupremum: binEnd,\n        };\n      }\n    },\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', timeZone }).format,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', timeZone }).format,\n  };\n  const unlabeledGridMinimumPixelDistance = minimumTickPixelDistance / 1.618;\n  const yearsUnlabelled: YearsAxisLayer = {\n    ...years,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const decades: YearsAxisLayer = {\n    unit: 'year',\n    unitMultiplier: 10,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 1.5,\n    intervals: function* (domainFrom, domainTo) {\n      const fromYear = epochInSecondsToYear(timeZone, domainFrom);\n      const toYear = epochInSecondsToYear(timeZone, domainTo);\n      for (let year = Math.floor(fromYear / 10) * 10; year <= Math.ceil(toYear / 10) * 10; year += 10) {\n        const timePoint = cachedZonedDateTimeFrom({ timeZone, year, month: 1, day: 1 });\n        const binStart = timePoint[TimeProp.EpochSeconds];\n        const binEnd = cachedZonedDateTimeFrom({\n          timeZone,\n          year: year + 10,\n          month: 1,\n          day: 1,\n        })[TimeProp.EpochSeconds];\n        yield {\n          year,\n          minimum: binStart,\n          supremum: binEnd,\n          labelSupremum: binEnd,\n        };\n      }\n    },\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', timeZone }).format,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', timeZone }).format,\n  };\n  const decadesUnlabelled: YearsAxisLayer = {\n    ...decades,\n    labeled: false,\n    minimumTickPixelDistance: 1, // it should change if we ever add centuries and millennia\n  };\n  const months: AxisLayer<Interval & { year: number; month: number; days: number }> = {\n    unit: 'month',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 3.6, // wow some Greek names are long\n    intervals: monthBasedIntervals(years, timeZone, 1),\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, { year: 'numeric', month: 'long', timeZone }).format,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, { month: 'long', timeZone }).format,\n  };\n  const shortMonths = {\n    ...months,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, { month: 'short', timeZone }).format,\n    minimumTickPixelDistance: minimumTickPixelDistance * 2,\n  };\n  const quarters: AxisLayer<Interval & { year: number; month: number }> = {\n    ...shortMonths,\n    unitMultiplier: 3,\n    intervals: monthBasedIntervals(years, timeZone, 3),\n  };\n  const quartersUnlabelled = {\n    ...quarters,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n    labeled: false,\n  };\n  const days: AxisLayer<Interval & YearToDay> = {\n    unit: 'day',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 1.5,\n    intervals: function* (domainFrom, domainTo) {\n      for (const { year, month } of months.intervals(domainFrom, domainTo)) {\n        for (let dayOfMonth = 1; dayOfMonth <= 31; dayOfMonth++) {\n          const temporalArgs = {\n            timeZone,\n            year,\n            month,\n            day: dayOfMonth,\n          };\n          const timePoint = cachedZonedDateTimeFrom(temporalArgs);\n          const dayOfWeek: number = timePoint[TimeProp.DayOfWeek];\n          const binStart = timePoint[TimeProp.EpochSeconds];\n          const binEnd = cachedTimeDelta(temporalArgs, 'days', 1);\n          if (Number.isFinite(binStart) && Number.isFinite(binEnd))\n            yield {\n              year,\n              month,\n              dayOfMonth,\n              dayOfWeek,\n              minimum: binStart,\n              supremum: binEnd,\n              labelSupremum: binEnd,\n            };\n        }\n      }\n    },\n    detailedLabelFormat: detailedDayFormat,\n    minorTickLabelFormat: minorDayFormat,\n  };\n  const weekStartDays: AxisLayer<Interval & { dayOfMonth: number }> = {\n    unit: 'week',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * 1.5,\n    intervals: function* (domainFrom, domainTo) {\n      for (const { year, month, days: daysInMonth } of months.intervals(domainFrom, domainTo)) {\n        for (let dayOfMonth = 1; dayOfMonth <= 31; dayOfMonth++) {\n          const temporalArgs = { timeZone, year, month, day: dayOfMonth };\n          const timePoint = cachedZonedDateTimeFrom(temporalArgs);\n          const dayOfWeek = timePoint[TimeProp.DayOfWeek];\n          if (dayOfWeek !== 1) continue;\n          const binStart = timePoint[TimeProp.EpochSeconds];\n          if (Number.isFinite(binStart)) {\n            const daysFromEnd = daysInMonth - dayOfMonth + 1;\n            const supremum = cachedTimeDelta(temporalArgs, 'days', 7);\n\n            yield {\n              dayOfMonth,\n              minimum: binStart,\n              supremum,\n              labelSupremum: daysFromEnd < 7 ? cachedTimeDelta(temporalArgs, 'days', daysFromEnd) : supremum,\n            };\n          }\n        }\n      }\n    },\n    minorTickLabelFormat: minorDayFormat,\n    detailedLabelFormat: detailedDayFormat,\n  };\n  const daysUnlabelled: AxisLayer<Interval & YearToDay> = {\n    ...days,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const weeksUnlabelled: AxisLayer<Interval & { dayOfMonth: number }> = {\n    ...weekStartDays,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const monthsUnlabelled = {\n    ...months,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const hhMmDistanceMultiplier = 1.8;\n  const hhMmSsDistanceMultiplier = 2.5;\n  const hours: AxisLayer<Interval> = {\n    unit: 'hour',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: hhMmDistanceMultiplier * minimumTickPixelDistance,\n    intervals: millisecondIntervals(60 * 60 * 1000),\n    detailedLabelFormat: detailedHourFormat,\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, {\n      ...hourFormat,\n      timeZone,\n    }).format,\n  };\n  const hoursUnlabelled = {\n    ...hours,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const sixHours: AxisLayer<Interval & YearToHour> = {\n    unit: 'hour',\n    unitMultiplier: 6,\n    labeled: true,\n    minimumTickPixelDistance: 2 * minimumTickPixelDistance,\n    intervals: (domainFrom, domainTo) =>\n      (\n        [...days.intervals(domainFrom, domainTo)].flatMap(({ year, month, dayOfMonth, dayOfWeek }) =>\n          [0, 6, 12, 18].map((hour) => {\n            const temporalArgs = {\n              timeZone,\n              year,\n              month,\n              day: dayOfMonth,\n              hour,\n            };\n            const timePoint = cachedZonedDateTimeFrom(temporalArgs);\n            const binStart = timePoint[TimeProp.EpochSeconds];\n            const supremum = binStart + 6 * 60 * 60; // fixme this is not correct in case the day is 23hrs long due to winter->summer time switch\n\n            return Number.isNaN(binStart)\n              ? []\n              : {\n                  dayOfMonth,\n                  // fontColor: offHourFontColor && (hour < workHourMin || hour > workHourMax) ? offHourFontColor : defaultFontColor,\n                  dayOfWeek,\n                  hour,\n                  year,\n                  month,\n                  minimum: binStart,\n                  supremum,\n                  labelSupremum: supremum,\n                };\n          }),\n        ) as Array<Interval & YearToHour>\n      ).map((b: Interval & YearToHour, i, a) =>\n        Object.assign(b, { supremum: i === a.length - 1 ? b.supremum : a[i + 1]?.minimum }),\n      ),\n    minorTickLabelFormat: new Intl.DateTimeFormat(locale, {\n      ...hourFormat,\n      timeZone,\n    }).format,\n    detailedLabelFormat: detailedHourFormat,\n  };\n  const sixHoursUnlabelled = {\n    ...sixHours,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const minutesFormatter = new Intl.DateTimeFormat(locale, { hour: '2-digit', minute: '2-digit', timeZone, hourCycle });\n  const secondsFormatter = new Intl.DateTimeFormat(locale, {\n    hour: '2-digit',\n    minute: '2-digit',\n    second: '2-digit',\n    timeZone,\n    hourCycle,\n  });\n  const minutes: AxisLayer<Interval> = {\n    unit: 'minute',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: hhMmDistanceMultiplier * minimumTickPixelDistance,\n    intervals: millisecondIntervals(60 * 1000),\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, {\n      year: 'numeric',\n      month: 'long',\n      day: 'numeric',\n      ...hourFormat,\n      minute: 'numeric',\n      timeZone,\n    }).format,\n    minorTickLabelFormat: (d) => `${minutesFormatter.format(d)}`,\n  };\n  const quarterHours = {\n    ...minutes,\n    unitMultiplier: 15,\n    labeled: true,\n    intervals: millisecondIntervals(15 * 60 * 1000),\n  };\n  const quarterHoursUnlabelled = {\n    ...quarterHours,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const fiveMinutes = {\n    ...minutes,\n    unitMultiplier: 5,\n    labeled: true,\n    intervals: millisecondIntervals(5 * 60 * 1000),\n  };\n  const fiveMinutesUnlabelled = {\n    ...fiveMinutes,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const minutesUnlabelled = {\n    ...minutes,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const seconds: AxisLayer<Interval> = {\n    unit: 'second',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: hhMmSsDistanceMultiplier * minimumTickPixelDistance,\n    intervals: millisecondIntervals(1000),\n    detailedLabelFormat: new Intl.DateTimeFormat(locale, {\n      year: 'numeric',\n      month: 'long',\n      day: 'numeric',\n      ...hourFormat,\n      minute: 'numeric',\n      second: 'numeric',\n      timeZone,\n    }).format,\n    minorTickLabelFormat: (d) => `${secondsFormatter.format(d).padStart(2, '0')}`, // what DateTimeFormat doing?\n  };\n  const quarterMinutes = {\n    ...seconds,\n    unitMultiplier: 15,\n    labeled: true,\n    intervals: millisecondIntervals(15 * 1000),\n  };\n  const quarterMinutesUnlabelled = {\n    ...quarterMinutes,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const fiveSeconds = {\n    ...seconds,\n    unitMultiplier: 5,\n    labeled: true,\n    intervals: millisecondIntervals(5 * 1000),\n  };\n  const fiveSecondsUnlabelled = {\n    ...fiveSeconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const secondsUnlabelled = {\n    ...seconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const millisecondDistanceMultiplier = 1.8;\n  const milliseconds: AxisLayer<Interval> = {\n    unit: 'millisecond',\n    unitMultiplier: 1,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * millisecondDistanceMultiplier,\n    intervals: millisecondIntervals(1),\n    minorTickLabelFormat: (d: number) => `${d % 1000}ms`,\n    detailedLabelFormat: (d: number) => `${d % 1000}ms`,\n  };\n  const tenMilliseconds = {\n    ...milliseconds,\n    unitMultiplier: 10,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * millisecondDistanceMultiplier,\n    intervals: millisecondIntervals(10),\n  };\n  const hundredMilliseconds = {\n    ...milliseconds,\n    unitMultiplier: 100,\n    labeled: true,\n    minimumTickPixelDistance: minimumTickPixelDistance * millisecondDistanceMultiplier,\n    intervals: millisecondIntervals(100),\n  };\n  const millisecondsUnlabelled = {\n    ...milliseconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const tenMillisecondsUnlabelled = {\n    ...tenMilliseconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n  const hundredMillisecondsUnlabelled = {\n    ...hundredMilliseconds,\n    labeled: false,\n    minimumTickPixelDistance: unlabeledGridMinimumPixelDistance,\n  };\n\n  const allRasters = [\n    decades,\n    yearsUnlabelled,\n    years,\n    quartersUnlabelled,\n    quarters,\n    monthsUnlabelled,\n    shortMonths,\n    months,\n    weeksUnlabelled,\n    weekStartDays,\n    daysUnlabelled,\n    days,\n    sixHoursUnlabelled,\n    sixHours,\n    hoursUnlabelled,\n    hours,\n    quarterHoursUnlabelled,\n    quarterHours,\n    fiveMinutesUnlabelled,\n    fiveMinutes,\n    minutesUnlabelled,\n    minutes,\n    quarterMinutesUnlabelled,\n    quarterMinutes,\n    fiveSecondsUnlabelled,\n    fiveSeconds,\n    secondsUnlabelled,\n    seconds,\n    hundredMillisecondsUnlabelled,\n    hundredMilliseconds,\n    tenMillisecondsUnlabelled,\n    tenMilliseconds,\n    millisecondsUnlabelled,\n    milliseconds,\n  ];\n\n  const replacements: Array<[AxisLayer<Interval>, Map<AxisLayer<Interval>, Array<AxisLayer<Interval>>>]> = [\n    [decadesUnlabelled, new Map([])],\n    [decades, new Map([[decadesUnlabelled, []]])],\n    [\n      years,\n      new Map([\n        [decades, [decadesUnlabelled]],\n        [yearsUnlabelled, []],\n      ]),\n    ],\n    [\n      quarters,\n      new Map([\n        [quartersUnlabelled, []],\n        [decadesUnlabelled, []],\n      ]),\n    ],\n    [\n      shortMonths,\n      new Map([\n        [monthsUnlabelled, []],\n        [quarters, [quartersUnlabelled]],\n      ]),\n    ],\n    [\n      months,\n      new Map([\n        [monthsUnlabelled, []],\n        [shortMonths, []],\n      ]),\n    ],\n    [weekStartDays, new Map([[weeksUnlabelled, []]])],\n    [weeksUnlabelled, new Map([[quartersUnlabelled, []]])],\n    [\n      days,\n      new Map([\n        [daysUnlabelled, []],\n        [weekStartDays, [weeksUnlabelled]],\n      ]),\n    ],\n    [sixHours, new Map([[sixHoursUnlabelled, []]])],\n    [\n      hours,\n      new Map([\n        [hoursUnlabelled, []],\n        [sixHours, [sixHoursUnlabelled]],\n      ]),\n    ],\n    [\n      quarterHours,\n      new Map([\n        [quarterHoursUnlabelled, []],\n        [hours, []],\n        [sixHours, []],\n      ]),\n    ],\n    [\n      fiveMinutes,\n      new Map([\n        [fiveMinutesUnlabelled, []],\n        [quarterHours, [quarterHoursUnlabelled]],\n        [hours, []],\n        [sixHours, []],\n      ]),\n    ],\n    [\n      minutes,\n      new Map([\n        [minutesUnlabelled, []],\n        [quarterHours, [quarterHoursUnlabelled]],\n        [fiveMinutes, [fiveMinutesUnlabelled]],\n        [hours, []],\n        [sixHours, []],\n      ]),\n    ],\n    [\n      quarterMinutes,\n      new Map([\n        [quarterMinutesUnlabelled, []],\n        [minutes, []],\n      ]),\n    ],\n    [\n      fiveSeconds,\n      new Map([\n        [fiveSecondsUnlabelled, []],\n        [quarterMinutes, [quarterMinutesUnlabelled]],\n        [minutes, []],\n      ]),\n    ],\n    [\n      seconds,\n      new Map([\n        [secondsUnlabelled, []],\n        [quarterMinutes, [quarterMinutesUnlabelled]],\n        [fiveSeconds, [fiveSecondsUnlabelled]],\n        [minutes, []],\n      ]),\n    ],\n    [hundredMilliseconds, new Map([[hundredMillisecondsUnlabelled, []]])],\n    [\n      tenMilliseconds,\n      new Map([\n        [tenMillisecondsUnlabelled, []],\n        [hundredMilliseconds, [hundredMillisecondsUnlabelled]],\n      ]),\n    ],\n    [\n      milliseconds,\n      new Map([\n        [millisecondsUnlabelled, []],\n        [tenMilliseconds, [tenMillisecondsUnlabelled]],\n        [hundredMilliseconds, [hundredMillisecondsUnlabelled]],\n      ]),\n    ],\n  ];\n\n  return (filter: (layer: AxisLayer<Interval>) => boolean) => {\n    // keep increasingly finer granularities, but only until there's enough pixel width for them to fit\n    let layers: Set<AxisLayer<Interval>> = new Set();\n    for (const layer of allRasters) {\n      if (filter(layer)) layers.add(layer);\n      else break; // `rasters` is ordered, so we exit the loop here, it's already too dense, remaining ones are ignored\n    }\n\n    replacements.forEach(([key, ruleMap]) => {\n      if (layers.has(key)) {\n        layers = new Set([...layers].flatMap((l) => ruleMap.get(l) ?? l));\n      }\n    });\n\n    return [...layers].reverse(); // while we iterated from coarse to dense, the result follows the axis layer order: finer toward coarser\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { unitIntervalWidth, AxisLayer, Interval, continuousTimeRasters } from './continuous_time_rasters';\nimport { ScaleContinuous } from '../../../../scales';\nimport { XDomain } from '../../domains/types';\nimport { AxisLabelFormatter } from '../../state/selectors/axis_tick_formatter';\nimport { GetMeasuredTicks, Projection } from '../../state/selectors/visible_ticks';\n\nconst WIDTH_FUDGE = 1.05; // raster bin widths are sometimes approximate, but there's no raster that's just 5% denser/sparser, so it's safe\n\n/** @internal */\nexport const MAX_TIME_TICK_COUNT = 50; // this doesn't do much for narrow charts, but limits tick count to a maximum on wider ones\n\n/** @internal */\nexport const MAX_TIME_GRID_COUNT = 12;\n\n/** @internal */\nexport const MINIMUM_TICK_PIXEL_DISTANCE = 24;\n\n/** @internal */\nexport const notTooDense =\n  (domainFrom: number, domainTo: number, intervalWidth: number, cartesianWidth: number, maxTickCount: number) =>\n  ({\n    unit,\n    unitMultiplier,\n    minimumTickPixelDistance,\n  }: Pick<AxisLayer<Interval>, 'unit' | 'unitMultiplier' | 'minimumTickPixelDistance'>) => {\n    const domainSize = domainTo - domainFrom;\n    const partitionIntervalWidth = unitIntervalWidth[unit] * unitMultiplier;\n    const maximumTickCount = Math.min(maxTickCount, cartesianWidth / minimumTickPixelDistance);\n    const tickCountConstraint = domainSize / maximumTickCount;\n    const spacingConstraint = intervalWidth / WIDTH_FUDGE;\n    return partitionIntervalWidth >= Math.max(tickCountConstraint, spacingConstraint); // heed both constraints\n  };\n\n/** @internal */\nexport function multilayerAxisEntry(\n  xDomain: XDomain,\n  extendByOneBin: boolean,\n  range: [number, number],\n  timeAxisLayerCount: number,\n  scale: ScaleContinuous,\n  getMeasuredTicks: GetMeasuredTicks,\n  locale: string,\n): Projection {\n  const rasterSelector = continuousTimeRasters(\n    { minimumTickPixelDistance: MINIMUM_TICK_PIXEL_DISTANCE, locale },\n    xDomain.timeZone,\n  );\n  const domainValues = xDomain.domain; // todo consider a property or object type rename\n  const domainFromS = Number(domainValues[0]) / 1000; // todo rely on a type guard or check rather than conversion\n  const binWidthMs = xDomain.minInterval;\n  const binWidth = binWidthMs / 1000; // seconds to milliseconds\n  const domainExtension = extendByOneBin ? binWidthMs : 0;\n  const domainToS = ((Number(domainValues.at(-1)) || NaN) + domainExtension) / 1000;\n  const cartesianWidth = Math.abs(range[1] - range[0]);\n  const layers = rasterSelector(notTooDense(domainFromS, domainToS, binWidth, cartesianWidth, MAX_TIME_TICK_COUNT));\n  let layerIndex = -1;\n  const fillLayerTimeslip = (\n    layer: number,\n    detailedLayer: number,\n    timeTicks: number[],\n    labelFormat: AxisLabelFormatter<number>,\n    showGrid: boolean,\n  ) => {\n    return {\n      entry: getMeasuredTicks(scale, timeTicks, layer, detailedLayer, labelFormat as AxisLabelFormatter, showGrid),\n      fallbackAskedTickCount: NaN,\n    };\n  };\n\n  const binStartsFrom = domainFromS - binWidth;\n  const binStartsTo = domainToS + binWidth;\n\n  return layers.reduce<Projection>(\n    (combinedEntry, l, detailedLayerIndex) => {\n      if (l.labeled) layerIndex++; // we want three (or however many) _labeled_ axis layers; others are useful for minor ticks/gridlines, and for giving coarser structure eg. stronger gridline for every 6th hour of the day\n      if (layerIndex >= timeAxisLayerCount) return combinedEntry;\n      const timeTicks = [...l.intervals(binStartsFrom, binStartsTo)]\n        .filter((b) => {\n          if (b.labelSupremum !== b.supremum && b.minimum < domainFromS) return false;\n          return b.supremum > domainFromS && b.minimum <= domainToS;\n        })\n        .map((b) => 1000 * b.minimum);\n\n      if (timeTicks.length === 0) {\n        return combinedEntry;\n      }\n\n      const { entry } = fillLayerTimeslip(\n        layerIndex,\n        detailedLayerIndex,\n        timeTicks,\n        !l.labeled ? () => '' : layerIndex === timeAxisLayerCount - 1 ? l.detailedLabelFormat : l.minorTickLabelFormat,\n        notTooDense(domainFromS, domainToS, binWidth, cartesianWidth, MAX_TIME_GRID_COUNT)(l),\n      );\n      const minLabelGap = 4;\n\n      const lastTick = entry.ticks.at(-1);\n      if (lastTick && lastTick.position + entry.labelBox.maxLabelBboxWidth > range[1]) {\n        lastTick.label = '';\n      }\n\n      return {\n        ...combinedEntry,\n        ...entry,\n        ticks: (combinedEntry.ticks || []).concat(\n          entry.ticks.filter(\n            (tick, i, a) =>\n              i > 0 ||\n              !a[1] ||\n              a[1].domainClampedPosition - tick.domainClampedPosition >= entry.labelBox.maxLabelBboxWidth + minLabelGap,\n          ),\n        ),\n      };\n    },\n    {\n      ticks: [],\n      labelBox: {\n        maxLabelBboxWidth: 0,\n        maxLabelBboxHeight: 0,\n        maxLabelTextWidth: 0,\n        maxLabelTextHeight: 0,\n        isHidden: true,\n      },\n      scale,\n    },\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* eslint-disable-next-line eslint-comments/disable-enable-pair */\n/* eslint-disable @typescript-eslint/unbound-method */\n\nimport { AxisLayer, Interval, NumberFormatter, RasterConfig } from './continuous_time_rasters';\nimport { getDecimalTicks, oneFive } from '../../../timeslip/projections/axis_model';\n\nconst numericalLayerCount = 2;\n\n/** @internal */\nexport const numericalRasters = ({ minimumTickPixelDistance, locale }: RasterConfig) => {\n  const numberFormatter = new Intl.NumberFormat(locale, {\n    notation: 'standard',\n    maximumFractionDigits: 0,\n  });\n  const format: NumberFormatter = (value) => numberFormatter.format(value);\n  const allRasters: AxisLayer<Interval>[] = [...new Array(numericalLayerCount)]\n    .map(\n      (_, i): AxisLayer<Interval> => ({\n        unit: 'one',\n        unitMultiplier: Infinity,\n        labeled: i === 0,\n        minimumTickPixelDistance,\n        intervals: (domainFrom, domainTo) =>\n          getDecimalTicks(domainFrom, domainTo, i === 0 ? 20 : 5, oneFive).map((d, i, a) => {\n            const supremum = i < a.length - 1 ? a[i + 1] ?? NaN : d + (d - (a[i - 1] ?? NaN));\n\n            return {\n              minimum: d,\n              supremum,\n              labelSupremum: supremum,\n            };\n          }),\n        detailedLabelFormat: (n: number) => format((n - 1300000000000) / 1e6),\n        minorTickLabelFormat: (n: number) => format((n - 1300000000000) / 1e6),\n      }),\n    )\n    .reverse();\n\n  return (filter: (layer: AxisLayer<Interval>) => boolean) => {\n    // keep increasingly finer granularities, but only until there's enough pixel width for them to fit\n    const layers: Set<AxisLayer<Interval>> = new Set();\n    for (const layer of allRasters) {\n      if (filter(layer)) layers.add(layer);\n      else break; // `rasters` is ordered, so we exit the loop here, it's already too dense, remaining ones are ignored\n    }\n\n    return [...layers].reverse(); // while we iterated from coarse to dense, the result follows the axis layer order: finer toward coarser\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnchorPosition } from '../../../components/portal/types';\nimport { Line, Rect } from '../../../geoms/types';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { isContinuousScale } from '../../../scales/types';\nimport { TooltipStickTo } from '../../../specs/constants';\nimport { Rotation } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { Point } from '../../../utils/point';\nimport { isHorizontalRotation, isVerticalRotation } from '../state/utils/common';\n\n/** @internal */\nexport const DEFAULT_SNAP_POSITION_BAND = 1;\n\n/** @internal */\nexport function getSnapPosition(\n  value: string | number,\n  scale: ScaleBand | ScaleContinuous,\n  totalBarsInCluster = 1,\n): { band: number; position: number } | undefined {\n  const position = scale.scale(value);\n  if (Number.isNaN(position)) {\n    return;\n  }\n\n  if (scale.bandwidth > 0) {\n    const band = scale.bandwidth / (1 - scale.barsPadding);\n\n    const halfPadding = (band - scale.bandwidth) / 2;\n    return {\n      position: position - halfPadding * totalBarsInCluster,\n      band: band * totalBarsInCluster,\n    };\n  }\n  return {\n    position,\n    band: DEFAULT_SNAP_POSITION_BAND,\n  };\n}\n\n/** @internal */\nexport function getCursorLinePosition(\n  chartRotation: Rotation,\n  chartDimensions: Dimensions,\n  projectedPointerPosition: { x: number; y: number },\n): Line | undefined {\n  const { x, y } = projectedPointerPosition;\n  if (x < 0 || y < 0) {\n    return undefined;\n  }\n  const { left, top, width, height } = chartDimensions;\n  const isHorizontalRotated = isHorizontalRotation(chartRotation);\n  if (isHorizontalRotated) {\n    const crosshairTop = y + top;\n    return {\n      x1: left,\n      x2: left + width,\n      y1: crosshairTop,\n      y2: crosshairTop,\n    };\n  }\n  const crosshairLeft = x + left;\n\n  return {\n    x1: crosshairLeft,\n    x2: crosshairLeft,\n    y1: top,\n    y2: top + height,\n  };\n}\n\n/** @internal */\nexport function getCursorBandPosition(\n  chartRotation: Rotation,\n  panel: Dimensions,\n  cursorPosition: Point,\n  invertedValue: {\n    value: string | number;\n    withinBandwidth: boolean;\n  },\n  snapEnabled: boolean,\n  xScale: ScaleBand | ScaleContinuous,\n  totalBarsInCluster?: number,\n): Rect | undefined {\n  const { top, left, width, height } = panel;\n  const { x, y } = cursorPosition;\n  const isHorizontalRotated = isHorizontalRotation(chartRotation);\n  const chartWidth = isHorizontalRotated ? width : height;\n  const chartHeight = isHorizontalRotated ? height : width;\n\n  const isLineOrAreaOnly = !totalBarsInCluster;\n\n  if (x > chartWidth || y > chartHeight || x < 0 || y < 0 || !invertedValue.withinBandwidth) {\n    return undefined;\n  }\n\n  const snappedPosition = getSnapPosition(invertedValue.value, xScale, isLineOrAreaOnly ? 1 : totalBarsInCluster);\n  if (!snappedPosition) {\n    return undefined;\n  }\n\n  const { position, band } = snappedPosition;\n  const bandOffset = xScale.bandwidth > 0 ? band : 0;\n\n  if (isHorizontalRotated) {\n    const adjustedLeft = snapEnabled ? position : cursorPosition.x;\n    let leftPosition = chartRotation === 0 ? left + adjustedLeft : left + width - adjustedLeft - bandOffset;\n    let adjustedWidth = band;\n    if (band > 1 && leftPosition + band > left + width) {\n      adjustedWidth = left + width - leftPosition;\n    } else if (band > 1 && leftPosition < left) {\n      adjustedWidth = band - (left - leftPosition);\n      leftPosition = left;\n    }\n    if (isLineOrAreaOnly && isContinuousScale(xScale)) {\n      return {\n        x: leftPosition,\n        width: 0,\n        y: top,\n        height,\n      };\n    }\n    return {\n      x: leftPosition,\n      y: top,\n      width: adjustedWidth,\n      height,\n    };\n  }\n  const adjustedTop = snapEnabled ? position : cursorPosition.x;\n  let topPosition = chartRotation === 90 ? top + adjustedTop : height + top - adjustedTop - bandOffset;\n  let adjustedHeight = band;\n  if (band > 1 && topPosition + band > top + height) {\n    adjustedHeight = band - (topPosition + band - (top + height));\n  } else if (band > 1 && topPosition < top) {\n    adjustedHeight = band - (top - topPosition);\n    topPosition = top;\n  }\n  if (isLineOrAreaOnly && isContinuousScale(xScale)) {\n    return {\n      x: left,\n      width,\n      y: topPosition,\n      height: 0,\n    };\n  }\n  return {\n    y: topPosition,\n    x: left,\n    width,\n    height: adjustedHeight,\n  };\n}\n\n/** @internal */\nexport function getTooltipAnchorPosition(\n  chartRotation: Rotation,\n  cursorBandPosition: Rect,\n  cursorPosition: { x: number; y: number },\n  panel: Dimensions,\n  stickTo: TooltipStickTo = TooltipStickTo.MousePosition,\n): AnchorPosition {\n  const { x, y, width, height } = cursorBandPosition;\n  const isRotated = isVerticalRotation(chartRotation);\n  // horizontal movement of cursor\n  if (!isRotated) {\n    const stickY =\n      stickTo === TooltipStickTo.MousePosition\n        ? cursorPosition.y + panel.top\n        : stickTo === TooltipStickTo.Middle\n          ? y + height / 2\n          : stickTo === TooltipStickTo.Bottom\n            ? y + height\n            : y; // TooltipStickTo.Top is also ok with that value\n    return {\n      x,\n      width,\n      y: stickY,\n      height: 0,\n    };\n  }\n  const stickX =\n    stickTo === TooltipStickTo.MousePosition\n      ? cursorPosition.x + panel.left\n      : stickTo === TooltipStickTo.Right\n        ? x + width\n        : stickTo === TooltipStickTo.Center\n          ? x + width / 2\n          : x; // TooltipStickTo.Left\n  return {\n    x: stickX,\n    width: 0,\n    y,\n    height,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Optional } from 'utility-types';\n\nimport { XDomain } from './types';\nimport { ScaleType } from '../../../scales/constants';\nimport { compareByValueAsc } from '../../../utils/common';\nimport { computeContinuousDataDomain, computeOrdinalDataDomain } from '../../../utils/domain';\nimport { Logger } from '../../../utils/logger';\nimport { getZoneFromSpecs, getValidatedTimeZone } from '../../../utils/time_zone';\nimport { getXNiceFromSpec, getXScaleTypeFromSpec } from '../scales/get_api_scales';\nimport { ScaleConfigs } from '../state/selectors/get_api_scale_configs';\nimport { BasicSeriesSpec, SeriesType, XScaleType } from '../utils/specs';\n\n/**\n * Merge X domain value between a set of chart specification.\n * @internal\n */\nexport function mergeXDomain(\n  { type, nice, isBandScale, timeZone, desiredTickCount, customDomain }: ScaleConfigs['x'],\n  xValues: Set<string | number>,\n  locale: string,\n  fallbackScale?: XScaleType,\n): XDomain {\n  let domain;\n  let dataDomain;\n  let minInterval = 0;\n\n  if (type === ScaleType.Ordinal || fallbackScale === ScaleType.Ordinal) {\n    if (type !== ScaleType.Ordinal) {\n      Logger.warn(`Each X value in a ${type} x scale needs be be a number. Using ordinal x scale as fallback.`);\n    }\n\n    dataDomain = computeOrdinalDataDomain([...xValues], false, true, locale);\n    domain = dataDomain;\n    if (customDomain) {\n      if (Array.isArray(customDomain)) {\n        domain = [...customDomain];\n      } else {\n        if (fallbackScale === ScaleType.Ordinal) {\n          Logger.warn(`xDomain ignored for fallback ordinal scale. Options to resolve:\n1) Correct data to match ${type} scale type (see previous warning)\n2) Change xScaleType to ordinal and set xDomain to Domain array`);\n        } else {\n          Logger.warn(\n            'xDomain for ordinal scale should be an array of values, not a DomainRange object. xDomain is ignored.',\n          );\n        }\n      }\n    }\n  } else {\n    const domainOptions = { min: NaN, max: NaN, fit: true };\n    dataDomain = computeContinuousDataDomain([...xValues] as number[], type, domainOptions);\n    domain = dataDomain;\n    let customMinInterval: undefined | number;\n\n    if (customDomain) {\n      if (Array.isArray(customDomain)) {\n        Logger.warn('xDomain for continuous scale should be a DomainRange object, not an array');\n      } else {\n        customMinInterval = customDomain.minInterval;\n        const [computedDomainMin, computedDomainMax] = domain;\n\n        if (Number.isFinite(customDomain.min) && Number.isFinite(customDomain.max)) {\n          if (customDomain.min > customDomain.max) {\n            Logger.warn('Custom xDomain is invalid: min is greater than max. Custom domain is ignored.');\n          } else {\n            domain = [customDomain.min, customDomain.max];\n          }\n        } else if (Number.isFinite(customDomain.min)) {\n          if (customDomain.min > computedDomainMax) {\n            Logger.warn(\n              'Custom xDomain is invalid: custom min is greater than computed max. Custom domain is ignored.',\n            );\n          } else {\n            domain = [customDomain.min, computedDomainMax];\n          }\n        } else if (Number.isFinite(customDomain.max)) {\n          if (computedDomainMin > customDomain.max) {\n            Logger.warn(\n              'Custom xDomain is invalid: computed min is greater than custom max. Custom domain is ignored.',\n            );\n          } else {\n            domain = [computedDomainMin, customDomain.max];\n          }\n        }\n      }\n    }\n    const computedMinInterval = findMinInterval([...xValues.values()] as number[]);\n    minInterval = getMinInterval(computedMinInterval, xValues.size, customMinInterval);\n  }\n\n  return {\n    type: fallbackScale ?? type,\n    nice,\n    isBandScale,\n    domain,\n    dataDomain,\n    minInterval,\n    timeZone: getValidatedTimeZone(timeZone),\n    logBase: customDomain && 'logBase' in customDomain ? customDomain.logBase : 10, // fixme preexisting TS workaround\n    desiredTickCount,\n  };\n}\n\nfunction getMinInterval(computedMinInterval: number, size: number, customMinInterval?: number): number {\n  if (customMinInterval === undefined) {\n    return computedMinInterval;\n  }\n  // Allow greater custom min if xValues has 1 member.\n  if (size > 1 && customMinInterval > computedMinInterval) {\n    Logger.warn(\n      'Custom xDomain is invalid: custom minInterval is greater than computed minInterval. Using computed minInterval.',\n    );\n    return computedMinInterval;\n  }\n  if (customMinInterval < 0) {\n    Logger.warn('Custom xDomain is invalid: custom minInterval is less than 0. Using computed minInterval.');\n    return computedMinInterval;\n  }\n\n  return customMinInterval;\n}\n\n/**\n * Find the minimum interval between xValues.\n * Default to 0 if an empty array, 1 if one item array\n * @internal\n */\nexport function findMinInterval(xValues: number[]): number {\n  return xValues.length < 2\n    ? xValues.length\n    : [...xValues].sort(compareByValueAsc).reduce((minInterval, current, i, sortedValues) => {\n        return i < xValues.length - 1\n          ? Math.min(minInterval, Math.abs((sortedValues[i + 1] ?? 0) - current))\n          : minInterval;\n      }, Infinity);\n}\n\n/**\n * Convert the scale types of a set of specification to a generic one.\n * If there are at least one `ordinal` scale type, the resulting scale is coerced to ordinal.\n * If there are only `continuous` scale types, the resulting scale is coerced to linear.\n * If there are only `time` scales, we coerce the timeZone to `local` only if we have multiple\n * different timezones.\n * @returns the coerced scale type, the timezone and a parameter that describe if its a bandScale or not\n * @internal\n */\nexport function convertXScaleTypes(\n  specs: Optional<Pick<BasicSeriesSpec, 'seriesType' | 'xScaleType' | 'xNice' | 'timeZone'>, 'seriesType'>[],\n): {\n  type: XScaleType;\n  nice: boolean;\n  isBandScale: boolean;\n  timeZone: string;\n} {\n  const seriesTypes = new Set<string | undefined>(specs.map((s) => s.seriesType));\n  const scaleTypes = new Set(specs.map((s) => getXScaleTypeFromSpec(s.xScaleType)));\n  const niceDomains = specs.map((s) => getXNiceFromSpec(s.xNice));\n  const timeZone = getZoneFromSpecs(specs);\n  const type =\n    scaleTypes.size === 1\n      ? scaleTypes.values().next().value // pick the only scaleType present\n      : scaleTypes.has(ScaleType.Ordinal)\n        ? ScaleType.Ordinal\n        : ScaleType.Linear; // if Ordinal is not present, coerce to Linear, whether it's present or not\n  const nice = !niceDomains.includes(false);\n  const isBandScale = seriesTypes.has(SeriesType.Bar);\n  return { type, nice, isBandScale, timeZone };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { YDomain } from './types';\nimport { ScaleType } from '../../../scales/constants';\nimport { computeContinuousDataDomain, ContinuousDomain } from '../../../utils/domain';\nimport { GroupId } from '../../../utils/ids';\nimport { Logger } from '../../../utils/logger';\nimport { getYNiceFromSpec, getYScaleTypeFromSpec } from '../scales/get_api_scales';\nimport { ScaleConfigs } from '../state/selectors/get_api_scale_configs';\nimport { getSpecDomainGroupId } from '../state/utils/spec';\nimport { groupBy } from '../utils/group_data_series';\nimport { DataSeries } from '../utils/series';\nimport { BasicSeriesSpec, DomainPaddingUnit, SeriesScales, SeriesType, StackMode, YDomainRange } from '../utils/specs';\n\n/** @internal */\nexport type YBasicSeriesSpec = Pick<\n  BasicSeriesSpec,\n  'id' | 'seriesType' | 'yScaleType' | 'groupId' | 'stackAccessors' | 'useDefaultGroupDomain'\n> & { stackMode?: StackMode; enableHistogramMode?: boolean };\n\n/** @internal */\nexport function mergeYDomain(\n  yScaleAPIConfig: ScaleConfigs['y'],\n  dataSeries: DataSeries[],\n  annotationYValueMap: Map<GroupId, number[]>,\n): YDomain[] {\n  const dataSeriesByGroupId = groupBy(dataSeries, ({ spec }) => getSpecDomainGroupId(spec), true);\n  return dataSeriesByGroupId.reduce<YDomain[]>((acc, groupedDataSeries) => {\n    const stacked = groupedDataSeries.filter(({ isStacked, isFiltered }) => isStacked && !isFiltered);\n    const nonStacked = groupedDataSeries.filter(({ isStacked, isFiltered }) => !isStacked && !isFiltered);\n    const hasNonZeroBaselineTypes = groupedDataSeries.some(\n      ({ seriesType, isFiltered }) => seriesType === SeriesType.Bar || (seriesType === SeriesType.Area && !isFiltered),\n    );\n    const domain = mergeYDomainForGroup(\n      stacked,\n      nonStacked,\n      annotationYValueMap,\n      hasNonZeroBaselineTypes,\n      yScaleAPIConfig,\n    );\n    return domain ? [...acc, domain] : acc;\n  }, []);\n}\n\nfunction mergeYDomainForGroup(\n  stacked: DataSeries[],\n  nonStacked: DataSeries[],\n  annotationYValueMap: Map<GroupId, number[]>,\n  hasZeroBaselineSpecs: boolean,\n  yScaleConfig: ScaleConfigs['y'],\n): YDomain | null {\n  const dataSeries = [...stacked, ...nonStacked];\n  if (!dataSeries[0]) return null;\n\n  const [{ isStacked, stackMode, spec }] = dataSeries;\n  const groupId = getSpecDomainGroupId(spec);\n  const scaleConfig = yScaleConfig[groupId];\n\n  if (!scaleConfig) return null;\n\n  const { customDomain, type, nice, desiredTickCount } = scaleConfig;\n  const newCustomDomain: YDomainRange = customDomain ? { ...customDomain } : { min: NaN, max: NaN };\n  const { paddingUnit, padding, constrainPadding } = newCustomDomain;\n\n  let mergedDomain: ContinuousDomain;\n  if (isStacked && stackMode === StackMode.Percentage) {\n    mergedDomain = computeContinuousDataDomain([0, 1], type, customDomain);\n  } else {\n    const annotationData = annotationYValueMap.get(groupId) ?? [];\n    const stackedDomain = computeYDomain(stacked, annotationData, hasZeroBaselineSpecs, type, newCustomDomain);\n    const nonStackedDomain = computeYDomain(nonStacked, annotationData, hasZeroBaselineSpecs, type, newCustomDomain);\n    mergedDomain = computeContinuousDataDomain([...stackedDomain, ...nonStackedDomain], type, newCustomDomain);\n    const [computedDomainMin, computedDomainMax] = mergedDomain;\n\n    if (newCustomDomain && Number.isFinite(newCustomDomain.min) && Number.isFinite(newCustomDomain.max)) {\n      // Don't need to check min > max because this has been validated on axis domain merge\n      mergedDomain = [newCustomDomain.min, newCustomDomain.max];\n    } else if (newCustomDomain && Number.isFinite(newCustomDomain.min)) {\n      if (newCustomDomain.min > computedDomainMax) {\n        Logger.warn(`custom yDomain for ${groupId} is invalid, custom min is greater than computed max.`);\n        mergedDomain = [newCustomDomain.min, newCustomDomain.min];\n      } else {\n        mergedDomain = [newCustomDomain.min, computedDomainMax];\n      }\n    } else if (newCustomDomain && Number.isFinite(newCustomDomain.max)) {\n      if (computedDomainMin > newCustomDomain.max) {\n        Logger.warn(`custom yDomain for ${groupId} is invalid, custom max is less than computed max.`);\n        mergedDomain = [newCustomDomain.max, newCustomDomain.max];\n      } else {\n        mergedDomain = [computedDomainMin, newCustomDomain.max];\n      }\n    }\n  }\n\n  return {\n    type,\n    nice,\n    isBandScale: false,\n    groupId,\n    domain: mergedDomain,\n    logBase: customDomain?.logBase,\n    logMinLimit: customDomain?.logMinLimit,\n    desiredTickCount,\n    domainPixelPadding: paddingUnit === DomainPaddingUnit.Pixel ? padding : 0,\n    constrainDomainPadding: constrainPadding,\n  };\n}\n\nfunction computeYDomain(\n  dataSeries: DataSeries[],\n  annotationYValues: number[],\n  hasZeroBaselineSpecs: boolean,\n  scaleType: ScaleType,\n  customDomain: YDomainRange,\n) {\n  const yValues = new Set<any>();\n  dataSeries.forEach(({ data }) => {\n    for (const datum of data) {\n      yValues.add(datum.y1);\n      if (hasZeroBaselineSpecs && datum.y0 !== null) yValues.add(datum.y0);\n    }\n  });\n  if (yValues.size === 0) {\n    return [];\n  }\n  // padding already applied, set to 0 here to avoid duplicating\n  const domainOptions = { ...customDomain, padding: 0 };\n  return computeContinuousDataDomain([...yValues, ...annotationYValues], scaleType, domainOptions);\n}\n\n/** @internal */\nexport function groupSeriesByYGroup(specs: YBasicSeriesSpec[]) {\n  const specsByGroupIds = new Map<\n    GroupId,\n    { stackMode: StackMode | undefined; stacked: YBasicSeriesSpec[]; nonStacked: YBasicSeriesSpec[] }\n  >();\n\n  // split each specs by groupId and by stacked or not\n  specs.forEach((spec) => {\n    const group = specsByGroupIds.get(spec.groupId) || {\n      stackMode: undefined,\n      stacked: [],\n      nonStacked: [],\n    };\n\n    if (isStackedSpec(spec)) {\n      group.stacked.push(spec);\n    } else {\n      group.nonStacked.push(spec);\n    }\n    if (group.stackMode === undefined && spec.stackMode !== undefined) {\n      group.stackMode = spec.stackMode;\n    }\n    if (spec.stackMode !== undefined && group.stackMode !== undefined && group.stackMode !== spec.stackMode) {\n      Logger.warn(`Is not possible to mix different stackModes, please align all stackMode on the same GroupId\n      to the same mode. The default behaviour will be to use the first encountered stackMode on the series`);\n    }\n    specsByGroupIds.set(spec.groupId, group);\n  });\n  return specsByGroupIds;\n}\n\n/** @internal */\nexport function hasHistogramBarSpec(specs: YBasicSeriesSpec[]) {\n  return specs.some(({ seriesType, enableHistogramMode }) => seriesType === SeriesType.Bar && enableHistogramMode);\n}\n\n/** @internal */\nexport function isStackedSpec(spec: YBasicSeriesSpec) {\n  return spec.stackAccessors && spec.stackAccessors.length > 0;\n}\n\n/** @internal */\nexport function coerceYScaleTypes(series: Pick<SeriesScales, 'yScaleType' | 'yNice'>[]) {\n  const scaleTypes = new Set(series.map((s) => getYScaleTypeFromSpec(s.yScaleType)));\n  const niceDomains = series.map((s) => getYNiceFromSpec(s.yNice));\n  const type = scaleTypes.size === 1 ? scaleTypes.values().next().value : ScaleType.Linear;\n  return { type, nice: !niceDomains.includes(false) };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../common/colors';\nimport { LegendItem } from '../../../common/legend';\nimport { SeriesKey, SeriesIdentifier } from '../../../common/series_id';\nimport { SettingsSpec } from '../../../specs';\nimport { isDefined, mergePartial } from '../../../utils/common';\nimport { BandedAccessorType } from '../../../utils/geometry';\nimport { getLegendCompareFn, SeriesCompareFn } from '../../../utils/series_sort';\nimport { PointStyle, Theme } from '../../../utils/themes/theme';\nimport { XDomain } from '../domains/types';\nimport { LegendValue, getLegendValue } from '../state/utils/get_last_value';\nimport { getAxesSpecForSpecId, getSpecsById } from '../state/utils/spec';\nimport { Y0_ACCESSOR_POSTFIX, Y1_ACCESSOR_POSTFIX } from '../tooltip/tooltip';\nimport { defaultTickFormatter } from '../utils/axis_utils';\nimport { defaultXYLegendSeriesSort } from '../utils/default_series_sort_fn';\nimport { groupBy } from '../utils/group_data_series';\nimport {\n  getSeriesIndex,\n  getSeriesName,\n  DataSeries,\n  getSeriesKey,\n  getSeriesIdentifierFromDataSeries,\n  isBandedSpec,\n} from '../utils/series';\nimport {\n  AxisSpec,\n  BasicSeriesSpec,\n  Postfixes,\n  StackMode,\n  isAreaSeriesSpec,\n  isBarSeriesSpec,\n  isBubbleSeriesSpec,\n  isLineSeriesSpec,\n} from '../utils/specs';\n\n/** @internal */\nexport interface FormattedLastValues {\n  y0: number | string | null;\n  y1: number | string | null;\n}\n\nfunction getPostfix(spec: BasicSeriesSpec): Postfixes {\n  if (isAreaSeriesSpec(spec) || isBarSeriesSpec(spec)) {\n    const { y0AccessorFormat = Y0_ACCESSOR_POSTFIX, y1AccessorFormat = Y1_ACCESSOR_POSTFIX } = spec;\n    return { y0AccessorFormat, y1AccessorFormat };\n  }\n\n  return {};\n}\n\nfunction getBandedLegendItemLabel(name: string, yAccessor: BandedAccessorType, postfixes: Postfixes) {\n  return yAccessor === BandedAccessorType.Y1\n    ? `${name}${postfixes.y1AccessorFormat}`\n    : `${name}${postfixes.y0AccessorFormat}`;\n}\n\n/** @internal */\nfunction getPointStyle(spec: BasicSeriesSpec, theme: Theme): PointStyle | undefined {\n  if (isBubbleSeriesSpec(spec)) {\n    return mergePartial(theme.bubbleSeriesStyle.point, spec.bubbleSeriesStyle?.point);\n  } else if (isLineSeriesSpec(spec)) {\n    return mergePartial(theme.lineSeriesStyle.point, spec.lineSeriesStyle?.point);\n  } else if (isAreaSeriesSpec(spec)) {\n    return mergePartial(theme.areaSeriesStyle.point, spec.areaSeriesStyle?.point);\n  }\n}\n\n/** @internal */\nexport function computeLegend(\n  xDomain: XDomain,\n  dataSeries: DataSeries[],\n  seriesColors: Map<SeriesKey, Color>,\n  specs: BasicSeriesSpec[],\n  axesSpecs: AxisSpec[],\n  settingsSpec: SettingsSpec,\n  serialIdentifierDataSeriesMap: Record<string, DataSeries>,\n  theme: Theme,\n  deselectedDataSeries: SeriesIdentifier[] = [],\n): LegendItem[] {\n  const legendItems: LegendItem[] = [];\n  const defaultColor = theme.colors.defaultVizColor;\n\n  const legendValueMode = LegendValue.LastValue;\n\n  dataSeries.forEach((series) => {\n    const { specId, yAccessor } = series;\n    const banded = isBandedSpec(series.spec);\n    const spec = getSpecsById<BasicSeriesSpec>(specs, specId);\n    const dataSeriesKey = getSeriesKey(\n      {\n        specId: series.specId,\n        yAccessor: series.yAccessor,\n        splitAccessors: series.splitAccessors,\n      },\n      series.groupId,\n    );\n\n    const color = seriesColors.get(dataSeriesKey) || defaultColor;\n    const hasSingleSeries = dataSeries.length === 1;\n    const name = getSeriesName(series, hasSingleSeries, false, spec);\n    const isSeriesHidden = deselectedDataSeries && getSeriesIndex(deselectedDataSeries, series) >= 0;\n    if (name === '' || !spec) return;\n\n    const postFixes = getPostfix(spec);\n    // Use this to get axis spec w/ tick formatter\n    const { yAxis } = getAxesSpecForSpecId(axesSpecs, spec.groupId, settingsSpec.rotation);\n    const formatter = spec.tickFormat ?? yAxis?.tickFormat ?? defaultTickFormatter;\n    const { hideInLegend } = spec;\n\n    const seriesIdentifier = getSeriesIdentifierFromDataSeries(series);\n\n    const pointStyle = getPointStyle(spec, theme);\n\n    const itemValue = getLegendValue(series, xDomain, legendValueMode, (d) => {\n      return series.stackMode === StackMode.Percentage\n        ? d.y1 === null || d.y0 === null\n          ? null\n          : d.y1 - d.y0\n        : d.initialY1;\n    });\n    const formattedItemValue = itemValue !== null ? formatter(itemValue) : '';\n\n    legendItems.push({\n      color,\n      label: banded ? getBandedLegendItemLabel(name, BandedAccessorType.Y1, postFixes) : name,\n      seriesIdentifiers: [seriesIdentifier],\n      childId: BandedAccessorType.Y1,\n      isSeriesHidden,\n      isItemHidden: hideInLegend,\n      isToggleable: true,\n      defaultExtra:\n        itemValue !== null\n          ? {\n              raw: itemValue,\n              formatted: formattedItemValue,\n              legendSizingLabel: formattedItemValue,\n            }\n          : undefined,\n      path: [{ index: 0, value: seriesIdentifier.key }],\n      keys: [specId, spec.groupId, yAccessor, ...series.splitAccessors.values()],\n      pointStyle,\n    });\n    if (banded) {\n      const bandedItemValue = getLegendValue(series, xDomain, legendValueMode, (d) => {\n        return series.stackMode === StackMode.Percentage ? d.y0 : d.initialY0;\n      });\n      const bandedFormattedItemValue = bandedItemValue !== null ? formatter(bandedItemValue) : '';\n\n      const labelY0 = getBandedLegendItemLabel(name, BandedAccessorType.Y0, postFixes);\n      legendItems.push({\n        color,\n        label: labelY0,\n        seriesIdentifiers: [seriesIdentifier],\n        childId: BandedAccessorType.Y0,\n        isSeriesHidden,\n        isItemHidden: hideInLegend,\n        isToggleable: true,\n        defaultExtra:\n          bandedItemValue !== null\n            ? {\n                raw: bandedItemValue,\n                formatted: bandedFormattedItemValue,\n                legendSizingLabel: bandedFormattedItemValue,\n              }\n            : undefined,\n        path: [{ index: 0, value: seriesIdentifier.key }],\n        keys: [specId, spec.groupId, yAccessor, ...series.splitAccessors.values()],\n        pointStyle,\n      });\n    }\n  });\n\n  const legendSortFn = getLegendCompareFn((a, b) => {\n    const aDs = serialIdentifierDataSeriesMap[a.key];\n    const bDs = serialIdentifierDataSeriesMap[b.key];\n    return defaultXYLegendSeriesSort(aDs, bDs);\n  });\n  const sortFn: SeriesCompareFn = settingsSpec.legendSort ?? legendSortFn;\n\n  return groupBy(\n    legendItems.sort((a, b) =>\n      a.seriesIdentifiers[0] && b.seriesIdentifiers[0] ? sortFn(a.seriesIdentifiers[0], b.seriesIdentifiers[0]) : 0,\n    ),\n    ({ keys, childId }) => {\n      return [...keys, childId].join('__'); // childId is used for band charts\n    },\n    true,\n  )\n    .map((d) => {\n      if (!d[0]) return;\n      return {\n        ...d[0],\n        seriesIdentifiers: d.map(({ seriesIdentifiers: [s] }) => s).filter(isDefined),\n        path: d.map(({ path: [p] }) => p).filter(isDefined),\n      };\n    })\n    .filter(isDefined);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Keys } from 'utility-types';\n\nimport { TimeFunction, TimingFunctions } from './../../../../../utils/time_functions';\nimport { TimeMs } from '../../../../../common/geometry';\nimport { clamp, isFiniteNumber } from '../../../../../utils/common';\n\n/**\n * TODO add logic for other types like colors\n * @public\n */\nexport type AnimatedValue = number;\n\n/**\n * Shared animation speeds in ms\n * @public\n */\nexport const AnimationSpeed = Object.freeze({\n  extraFast: 90,\n  fast: 150,\n  normal: 250,\n  slow: 350,\n  extraSlow: 500,\n});\n\n/** @public */\nexport type AnimationSpeed = $Keys<typeof AnimationSpeed>;\n\n/** @internal */\nexport class Animation {\n  private initial: AnimatedValue;\n  private target: AnimatedValue;\n  private previousTarget: AnimatedValue | null;\n  private current: AnimatedValue;\n  private snapValues: AnimatedValue[];\n  private timeFunction: TimeFunction;\n  private delay: TimeMs;\n  private duration: TimeMs;\n  private timeOffset: TimeMs;\n  private timingFn: (n: number) => number = TimingFunctions.linear;\n\n  constructor(value: AnimatedValue, options: AnimationOptions = {}) {\n    this.initial = options?.initialValue ?? value;\n    this.current = options?.initialValue ?? value;\n    this.target = value;\n    this.previousTarget = value;\n    this.timeOffset = 0;\n    this.delay = (typeof options?.delay === 'string' ? AnimationSpeed[options.delay] : options?.delay) ?? 0;\n    this.duration =\n      typeof options?.duration === 'string'\n        ? AnimationSpeed[options.duration]\n        : options?.duration ?? AnimationSpeed.slow;\n    this.timeFunction = options?.timeFunction ?? TimeFunction.linear;\n    this.snapValues = options?.snapValues ?? [];\n    this.setTimingFn();\n  }\n\n  /**\n   * Animation is delayed and value has not started tweening\n   */\n  isDelayed(t: TimeMs) {\n    if (this.timeOffset !== 0) return false;\n    return t < this.delay;\n  }\n\n  /**\n   * Animation is delayed or actively tweening\n   */\n  isActive(t: TimeMs) {\n    if (!isFiniteNumber(this.initial) || !isFiniteNumber(this.target) || this.initial === this.target) {\n      return false;\n    }\n\n    return t - this.delay + this.timeOffset < this.duration;\n  }\n\n  /**\n   * Sets the target value to trigger tweening of value\n   */\n  setTarget(value: AnimatedValue) {\n    if (this.snapValues.includes(value)) {\n      this.current = value;\n      this.clear();\n    } else if (this.target !== value) {\n      if (this.previousTarget) {\n        this.initial = this.previousTarget;\n        this.target = value;\n        this.setTimingFn();\n        this.timeOffset = this.invertTimingFn();\n      } else {\n        this.timeOffset = 0;\n        this.initial = this.current;\n        this.target = value;\n        this.setTimingFn();\n      }\n    }\n  }\n\n  private invertTimingFn() {\n    const scaledValue = this.current - this.initial;\n    const scalar = this.target - this.initial;\n    const multiplier = scaledValue / scalar;\n    const timeDelta = clamp(TimingFunctions[this.timeFunction].inverse(multiplier), 0, 1);\n    return timeDelta * this.duration + this.delay;\n  }\n\n  private setTimingFn() {\n    const scalar = this.target - this.initial;\n    this.timingFn =\n      scalar === 0\n        ? () => this.initial\n        : (t) => {\n            const multiplier = TimingFunctions[this.timeFunction](t);\n            return this.initial + scalar * multiplier;\n          };\n  }\n\n  /**\n   * Get animated value at time t\n   */\n  valueAtTime(t: TimeMs): AnimatedValue {\n    if (this.isDelayed(t)) return this.initial;\n    const unitNormalizedTime = Math.max(0, Math.min(1, (t - this.delay + this.timeOffset) / this.duration));\n    const value = this.timingFn(unitNormalizedTime);\n    this.current = value; // need to set for clear to be called with no time value\n    return value;\n  }\n\n  /**\n   * Pause animation at current time/value and clears initial and target values\n   */\n  clear() {\n    this.previousTarget = this.current === this.target ? null : this.target;\n    this.initial = this.current;\n    this.target = this.current;\n    this.setTimingFn();\n  }\n}\n\n/** @public */\nexport interface AnimationOptions {\n  /**\n   * Enables animations on annotations\n   */\n  enabled?: boolean;\n  /**\n   * Set initial value for initial render animations.\n   * By default, the initial value is determined on the initial render\n   * then animates any change thereafter.\n   *\n   * @example\n   * ```ts\n   * // Initially animates the height from 0 to 100 with no value change\n   * atx.getValue('bar-height', 100, { initialValue: 0 })\n   * ```\n   */\n  initialValue?: AnimatedValue;\n  /**\n   * start delay in ms\n   */\n  delay?: TimeMs | AnimationSpeed;\n  /**\n   * Snaps back to initial value instantly\n   */\n  snapValues?: AnimatedValue[];\n  /**\n   * The speed curve of the animation\n   */\n  timeFunction?: TimeFunction;\n  /**\n   * Duration from start of animation to completion in ms\n   */\n  duration?: TimeMs | AnimationSpeed;\n}\n\n/** @internal */\nexport interface AnimationState {\n  rafId: number;\n  pool: Map<string, Animation>;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Logger } from './../../../../../utils/logger';\nimport { AnimatedValue, Animation, AnimationOptions, AnimationState } from './animation';\nimport { debounce } from '../../../../../utils/debounce';\n\n// TODO find a better way to do this when we have an actual build process\nconst DISABLE_ANIMATIONS = (typeof process === 'object' && process.env && process.env.VRT) === 'true';\n\n/**\n * Function used to animate values from within a render context.\n *\n * `options` are applied only on initial render and never changed.\n * @internal\n */\nexport type AnimateFn = (options?: AnimationOptions) => (key: string, value: AnimatedValue) => AnimatedValue;\n\n/** @internal */\nexport interface AnimationContext {\n  getValue: AnimateFn;\n}\n\n/** @internal */\nexport const getAnimationPoolFn = (\n  animationState: AnimationState,\n  renderFn: (animationCtx: AnimationContext) => void,\n) => {\n  // Must clear raf/pool outside of debounce to maintain active state\n  window.cancelAnimationFrame(animationState.rafId);\n  animationState.pool.forEach((a) => a.clear());\n\n  return debounce(\n    function getAnimationPoolFnDebounce() {\n      const propValuesForRun = new Map<string, number>();\n      const getAnimatedValueFn =\n        (t: number): AnimateFn =>\n        (options) =>\n        (key, value) => {\n          if (t === 0 && propValuesForRun.has(key) && propValuesForRun.get(key) !== value) {\n            Logger.error(\n              `aCtx.getValue(\\`${key}\\`, <value>) was called multiple times in a single render with different values.\\\n Please animate these values independently to avoid collisions.`,\n            );\n          }\n\n          if (DISABLE_ANIMATIONS || !(options?.enabled ?? true)) return value;\n\n          propValuesForRun.set(key, value);\n          if (!animationState.pool.has(key)) {\n            animationState.pool.set(key, new Animation(value, options));\n          }\n\n          const animation = animationState.pool.get(key);\n          if (!animation) return value;\n\n          animation.setTarget(value);\n\n          return animation.valueAtTime(t);\n        };\n\n      function getAnimationContext(t: number): AnimationContext {\n        // TODO build out simplified functions for different usages\n        return {\n          getValue: getAnimatedValueFn(t),\n        };\n      }\n\n      renderFn(getAnimationContext(0));\n\n      animationState.rafId = window.requestAnimationFrame((epochStartTime) => {\n        const anim = (t: number) => {\n          const elapsed = t - epochStartTime;\n          const animations = [...animationState.pool.values()];\n\n          // skips render if all animations are actively delayed\n          if (!animations.every((a) => a.isDelayed(elapsed))) {\n            renderFn(getAnimationContext(elapsed));\n          }\n          if (animations.some((a) => a.isActive(elapsed))) {\n            animationState.rafId = window.requestAnimationFrame(anim);\n          }\n        };\n        animationState.rafId = window.requestAnimationFrame(anim);\n      });\n    },\n    300,\n    { isImmediate: true }, // ensures the hovered ids are correct\n  )();\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderLineAnnotations } from './lines';\nimport { renderRectAnnotations } from './rect';\nimport { Rotation } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { AnnotationId } from '../../../../../utils/ids';\nimport {\n  mergeWithDefaultAnnotationLine,\n  mergeWithDefaultAnnotationRect,\n} from '../../../../../utils/themes/merge_utils';\nimport { SharedGeometryStateStyle } from '../../../../../utils/themes/theme';\nimport { AnnotationLineProps } from '../../../annotations/line/types';\nimport { AnnotationRectProps } from '../../../annotations/rect/types';\nimport { AnnotationDimensions } from '../../../annotations/types';\nimport { getSpecsById } from '../../../state/utils/spec';\nimport { AnnotationSpec, isLineAnnotation, isRectAnnotation } from '../../../utils/specs';\nimport { getAnnotationHoverParamsFn } from '../../common/utils';\nimport { AnimationContext } from '../animations';\n\n/** @internal */\nexport function renderAnnotations(\n  ctx: CanvasRenderingContext2D,\n  aCtx: AnimationContext,\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  annotationSpecs: AnnotationSpec[],\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  sharedStyle: SharedGeometryStateStyle,\n  hoveredAnnotationIds: string[],\n  renderOnBackground: boolean = true,\n) {\n  annotationDimensions.forEach((annotation, id) => {\n    const spec = getSpecsById<AnnotationSpec>(annotationSpecs, id);\n    const isBackground = (spec?.zIndex ?? 0) <= 0;\n\n    if (spec && isBackground === renderOnBackground) {\n      const getHoverParams = getAnnotationHoverParamsFn(hoveredAnnotationIds, sharedStyle, spec.animations);\n      if (isLineAnnotation(spec)) {\n        const lineStyle = mergeWithDefaultAnnotationLine(spec.style);\n        renderLineAnnotations(\n          ctx,\n          aCtx,\n          annotation as AnnotationLineProps[],\n          lineStyle,\n          getHoverParams,\n          rotation,\n          renderingArea,\n        );\n      } else if (isRectAnnotation(spec)) {\n        const rectStyle = mergeWithDefaultAnnotationRect(spec.style);\n        renderRectAnnotations(\n          ctx,\n          aCtx,\n          annotation as AnnotationRectProps[],\n          rectStyle,\n          getHoverParams,\n          rotation,\n          renderingArea,\n        );\n      }\n    }\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Stroke } from '../../../../../geoms/types';\nimport { Rotation } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { LineAnnotationStyle } from '../../../../../utils/themes/theme';\nimport { AnnotationLineProps } from '../../../annotations/line/types';\nimport { GetAnnotationParamsFn } from '../../common/utils';\nimport { AnimationContext } from '../animations';\nimport { renderMultiLine } from '../primitives/line';\nimport { withPanelTransform } from '../utils/panel_transform';\n\n/** @internal */\nexport function renderLineAnnotations(\n  ctx: CanvasRenderingContext2D,\n  aCtx: AnimationContext,\n  annotations: AnnotationLineProps[],\n  lineStyle: LineAnnotationStyle,\n  getHoverParams: GetAnnotationParamsFn,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n) {\n  const getStroke = (id: string): Stroke => {\n    const { style, options } = getHoverParams(id);\n    const opacityKey = `anno-rect-opacity--${id}`;\n    const hoverOpacity = aCtx.getValue(options)(opacityKey, style.opacity);\n    const strokeColor = overrideOpacity(\n      colorToRgba(lineStyle.line.stroke),\n      (opacity) => opacity * lineStyle.line.opacity * hoverOpacity,\n    );\n    return {\n      color: strokeColor,\n      width: lineStyle.line.strokeWidth,\n      dash: lineStyle.line.dash,\n    };\n  };\n\n  annotations.forEach(({ linePathPoints, panel, id }) =>\n    withPanelTransform(ctx, panel, rotation, renderingArea, () =>\n      renderMultiLine(ctx, [linePathPoints], getStroke(id)),\n    ),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Fill, Stroke } from '../../../../../geoms/types';\nimport { Rotation } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { RectAnnotationStyle } from '../../../../../utils/themes/theme';\nimport { AnnotationRectProps } from '../../../annotations/rect/types';\nimport { GetAnnotationParamsFn } from '../../common/utils';\nimport { AnimationContext } from '../animations';\nimport { renderRect } from '../primitives/rect';\nimport { withPanelTransform } from '../utils/panel_transform';\n\n/** @internal */\nexport function renderRectAnnotations(\n  ctx: CanvasRenderingContext2D,\n  aCtx: AnimationContext,\n  annotations: AnnotationRectProps[],\n  rectStyle: RectAnnotationStyle,\n  getHoverParams: GetAnnotationParamsFn,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n) {\n  const getFillAndStroke = (id: string): [Fill, Stroke] => {\n    const { style, options } = getHoverParams(id);\n\n    const opacityKey = `anno-rect-opacity--${id}`;\n    const hoverOpacity = aCtx.getValue(options)(opacityKey, style.opacity);\n\n    const fill: Fill = {\n      color: overrideOpacity(colorToRgba(rectStyle.fill), (opacity) => opacity * rectStyle.opacity * hoverOpacity),\n    };\n    const stroke: Stroke = {\n      color: overrideOpacity(colorToRgba(rectStyle.stroke), (opacity) => opacity * rectStyle.opacity * hoverOpacity),\n      width: rectStyle.strokeWidth,\n    };\n\n    return [fill, stroke];\n  };\n\n  annotations.forEach(({ rect, panel, id }) =>\n    withPanelTransform(ctx, panel, rotation, renderingArea, () => renderRect(ctx, rect, ...getFillAndStroke(id))),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPanelClipping } from './panel_clipping';\nimport { renderPoints } from './points';\nimport { renderLinePaths, renderAreaPath } from './primitives/path';\nimport { buildAreaStyles } from './styles/area';\nimport { buildLineStyles } from './styles/line';\nimport { withPanelTransform } from './utils/panel_transform';\nimport { colorToRgba, overrideOpacity } from '../../../../common/color_library_wrappers';\nimport { LegendItem } from '../../../../common/legend';\nimport { Fill, Rect, Stroke } from '../../../../geoms/types';\nimport { withContext } from '../../../../renderers/canvas';\nimport { ColorVariant, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { AreaGeometry, PerPanel } from '../../../../utils/geometry';\nimport { SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { getGeometryStateStyle } from '../../rendering/utils';\nimport { getTextureStyles } from '../../utils/texture';\n\n/** @internal */\nexport function renderAreas(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  areas: Array<PerPanel<AreaGeometry>>,\n  sharedStyle: SharedGeometryStateStyle,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  highlightedLegendItem?: LegendItem,\n) {\n  withContext(ctx, () => {\n    // first render all the areas and lines\n    areas.forEach(({ panel, value: area }) => {\n      const { style } = area;\n      const clippings = getPanelClipping(panel, rotation);\n      if (style.area.visible) {\n        withPanelTransform(\n          ctx,\n          panel,\n          rotation,\n          renderingArea,\n          () => renderArea(ctx, imgCanvas, area, sharedStyle, clippings, highlightedLegendItem),\n          { area: clippings, shouldClip: true },\n        );\n      }\n      if (style.line.visible) {\n        withPanelTransform(\n          ctx,\n          panel,\n          rotation,\n          renderingArea,\n          () => renderAreaLines(ctx, area, sharedStyle, clippings, highlightedLegendItem),\n          { area: clippings, shouldClip: true },\n        );\n      }\n    });\n    // now we can render the visible points on top of each the areas/lines\n    areas.forEach(({ panel, value: area }) => {\n      const { style, seriesIdentifier, points } = area;\n      const visiblePoints = style.point.visible ? points : points.filter(({ isolated }) => isolated);\n      if (visiblePoints.length === 0) {\n        return;\n      }\n      const geometryStateStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n      withPanelTransform(\n        ctx,\n        panel,\n        rotation,\n        renderingArea,\n        () => renderPoints(ctx, visiblePoints, geometryStateStyle),\n        { area: getPanelClipping(panel, rotation), shouldClip: points[0]?.value.mark !== null },\n      );\n    });\n  });\n}\n\nfunction renderArea(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  geometry: AreaGeometry,\n  sharedStyle: SharedGeometryStateStyle,\n  clippings: Rect,\n  highlightedLegendItem?: LegendItem,\n) {\n  const { area, color, transform, seriesIdentifier, style, clippedRanges, shouldClip } = geometry;\n  const geometryStateStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n  const areaFill = buildAreaStyles(ctx, imgCanvas, color, style.area, geometryStateStyle);\n\n  const fitAreaFillColor = style.fit.area.fill === ColorVariant.Series ? color : style.fit.area.fill;\n  const fitAreaFill: Fill = {\n    texture: getTextureStyles(ctx, imgCanvas, fitAreaFillColor, geometryStateStyle.opacity, style.fit.area.texture),\n    color: overrideOpacity(\n      colorToRgba(fitAreaFillColor),\n      (opacity) => opacity * geometryStateStyle.opacity * style.fit.area.opacity,\n    ),\n  };\n\n  renderAreaPath(\n    ctx,\n    transform,\n    area,\n    areaFill,\n    fitAreaFill,\n    clippedRanges,\n    clippings,\n    shouldClip && style.fit.area.visible,\n  );\n}\n\nfunction renderAreaLines(\n  ctx: CanvasRenderingContext2D,\n  geometry: AreaGeometry,\n  sharedStyle: SharedGeometryStateStyle,\n  clippings: Rect,\n  highlightedLegendItem?: LegendItem,\n) {\n  const { lines, color, seriesIdentifier, transform, style, clippedRanges, shouldClip } = geometry;\n  const geometryStateStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n  const lineStyle = buildLineStyles(color, style.line, geometryStateStyle);\n\n  const fitLineStroke: Stroke = {\n    dash: style.fit.line.dash,\n    width: style.line.strokeWidth,\n    color: overrideOpacity(\n      colorToRgba(style.fit.line.stroke === ColorVariant.Series ? color : style.fit.line.stroke),\n      (opacity) => opacity * geometryStateStyle.opacity * style.fit.line.opacity,\n    ),\n  };\n\n  renderLinePaths(\n    ctx,\n    transform,\n    lines,\n    lineStyle,\n    fitLineStroke,\n    clippedRanges,\n    clippings,\n    shouldClip && style.fit.line.visible,\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderAxisLine } from './line';\nimport { renderTick } from './tick';\nimport { renderTickLabel } from './tick_label';\nimport { Dimensions, Size } from '../../../../../utils/dimensions';\nimport { Point } from '../../../../../utils/point';\nimport { AxisStyle } from '../../../../../utils/themes/theme';\nimport { PerPanelAxisGeoms } from '../../../state/selectors/compute_per_panel_axes_geoms';\nimport { AxisTick, TickLabelBounds, shouldShowTicks } from '../../../utils/axis_utils';\nimport { AxisSpec } from '../../../utils/specs';\n\n/** @internal */\nexport interface AxisProps {\n  panelTitle?: string;\n  secondary?: boolean;\n  panelAnchor: Point;\n  axisStyle: AxisStyle; // todo rename to just style (it's in Axis... already)\n  axisSpec: AxisSpec; // todo rename to just spec (it's in Axis... already)\n  size: Size;\n  anchorPoint: Point;\n  dimension: TickLabelBounds;\n  ticks: AxisTick[];\n  debug: boolean;\n  renderingArea: Dimensions;\n  layerGirth: number;\n}\n\n/** @internal */\nexport interface AxesProps {\n  axesSpecs: AxisSpec[];\n  perPanelAxisGeoms: PerPanelAxisGeoms[];\n  axesStyles: Map<string, AxisStyle | null>;\n  sharedAxesStyle: AxisStyle;\n  debug: boolean;\n  renderingArea: Dimensions;\n}\n\n/** @internal */\nexport function renderAxis(ctx: CanvasRenderingContext2D, props: AxisProps) {\n  const { ticks, axisStyle, axisSpec, secondary, layerGirth } = props;\n  const showTicks = shouldShowTicks(axisStyle.tickLine, axisSpec.hide);\n\n  renderAxisLine(ctx, props); // render the axis line\n  if (!secondary && showTicks) ticks.forEach((tick) => renderTick(ctx, tick, props));\n  if (!secondary && axisStyle.tickLabel.visible)\n    ticks.forEach((tick) => renderTickLabel(ctx, tick, showTicks, props, layerGirth ?? 0));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisProps } from '.';\nimport { Position as P } from '../../../../../utils/common';\n\n/** @internal */\nexport function renderAxisLine(\n  ctx: CanvasRenderingContext2D,\n  { axisSpec: { position: p }, size: { width, height }, axisStyle: { axisLine } }: AxisProps,\n) {\n  if (!axisLine.visible) return;\n  ctx.beginPath();\n  ctx.moveTo(p === P.Left ? width : 0, p === P.Top ? height : 0);\n  ctx.lineTo(p !== P.Right ? width : 0, p !== P.Bottom ? height : 0);\n  ctx.strokeStyle = axisLine.stroke;\n  ctx.lineWidth = axisLine.strokeWidth;\n  ctx.stroke();\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisProps } from '.';\nimport { colorToRgba, RgbaTuple } from '../../../../../common/color_library_wrappers';\nimport { Position } from '../../../../../utils/common';\nimport { isHorizontalAxis } from '../../../utils/axis_type_utils';\nimport { AxisTick } from '../../../utils/axis_utils';\nimport { HIDE_MINOR_TIME_GRID, HIERARCHICAL_GRID_WIDTH, OUTSIDE_RANGE_TOLERANCE } from '../../../utils/grid_lines';\nimport { renderMultiLine } from '../primitives/line';\n\nconst BASELINE_CORRECTION = 2; // the bottom of the em is a bit higher than the bottom alignment; todo consider measuring\n\n/** @internal */\nexport function renderTick(\n  ctx: CanvasRenderingContext2D,\n  { position, domainClampedPosition: tickPosition, layer, detailedLayer }: AxisTick,\n  {\n    axisSpec: { position: axisPosition, timeAxisLayerCount },\n    size: { width, height },\n    axisStyle: { tickLine, gridLine },\n    layerGirth,\n  }: AxisProps,\n) {\n  if (Math.abs(tickPosition - position) > OUTSIDE_RANGE_TOLERANCE) return;\n  const tickOnTheSide = timeAxisLayerCount > 0 && typeof layer === 'number';\n  const extensionLayer = tickOnTheSide ? layer + 1 : 0;\n  const tickSize =\n    tickLine.size +\n    (tickOnTheSide && (detailedLayer > 0 || !HIDE_MINOR_TIME_GRID)\n      ? extensionLayer * layerGirth + (extensionLayer < 1 ? 0 : tickLine.padding - BASELINE_CORRECTION)\n      : 0);\n  const xy = isHorizontalAxis(axisPosition)\n    ? {\n        x1: tickPosition,\n        x2: tickPosition,\n        ...(axisPosition === Position.Top ? { y1: height - tickSize, y2: height } : { y1: 0, y2: tickSize }),\n      }\n    : {\n        y1: tickPosition,\n        y2: tickPosition,\n        ...(axisPosition === Position.Left ? { x1: width, x2: width - tickSize } : { x1: 0, x2: tickSize }),\n      };\n  const layered = typeof layer === 'number';\n  const multilayerLuma = gridLine.lumaSteps[detailedLayer] ?? NaN;\n  const strokeWidth = layered ? HIERARCHICAL_GRID_WIDTH : tickLine.strokeWidth;\n  const color: RgbaTuple = layered ? [multilayerLuma, multilayerLuma, multilayerLuma, 1] : colorToRgba(tickLine.stroke);\n  renderMultiLine(ctx, [xy], { color, width: strokeWidth });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisProps } from '.';\nimport { Position } from '../../../../../utils/common';\nimport { AxisTick, getTickLabelPosition } from '../../../utils/axis_utils';\nimport { renderText } from '../primitives/text';\nimport { renderDebugRectCenterRotated } from '../utils/debug';\n\nconst TICK_TO_LABEL_GAP = 2;\n\n/** @internal */\nexport function renderTickLabel(\n  ctx: CanvasRenderingContext2D,\n  tick: AxisTick,\n  showTicks: boolean,\n  { axisSpec: { position, timeAxisLayerCount }, dimension, size, debug, axisStyle }: AxisProps,\n  layerGirth: number,\n) {\n  const labelStyle = axisStyle.tickLabel;\n  const tickLabelProps = getTickLabelPosition(\n    axisStyle,\n    tick.domainClampedPosition,\n    position,\n    labelStyle.rotation,\n    size,\n    dimension,\n    showTicks,\n    labelStyle.offset,\n    labelStyle.alignment,\n  );\n\n  const center = { x: tickLabelProps.x + tickLabelProps.offsetX, y: tickLabelProps.y + tickLabelProps.offsetY };\n\n  if (debug) {\n    const { maxLabelBboxWidth, maxLabelBboxHeight, maxLabelTextWidth: width, maxLabelTextHeight: height } = dimension;\n    // full text container\n    renderDebugRectCenterRotated(ctx, center, { ...center, width, height }, undefined, undefined, labelStyle.rotation);\n    // rotated text container\n    if (labelStyle.rotation % 90 !== 0) {\n      renderDebugRectCenterRotated(ctx, center, { ...center, width: maxLabelBboxWidth, height: maxLabelBboxHeight });\n    }\n  }\n\n  const tickOnTheSide = timeAxisLayerCount > 0 && Number.isFinite(tick.layer);\n\n  renderText(\n    ctx,\n    center,\n    tick.label,\n    {\n      fontFamily: labelStyle.fontFamily,\n      fontStyle: labelStyle.fontStyle ?? 'normal',\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      textColor: labelStyle.fill,\n      fontSize: labelStyle.fontSize,\n      align: tickLabelProps.horizontalAlign,\n      baseline: tickLabelProps.verticalAlign,\n    },\n    labelStyle.rotation,\n    tickLabelProps.textOffsetX + (tickOnTheSide ? TICK_TO_LABEL_GAP : 0),\n    tickLabelProps.textOffsetY + (tick.layer || 0) * layerGirth * (position === Position.Top ? -1 : 1),\n    1,\n    tick.direction,\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPanelClipping } from './panel_clipping';\nimport { renderRect } from './primitives/rect';\nimport { buildBarStyle } from './styles/bar';\nimport { withPanelTransform } from './utils/panel_transform';\nimport { LegendItem } from '../../../../common/legend';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { BarGeometry, PerPanel } from '../../../../utils/geometry';\nimport { SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { getGeometryStateStyle } from '../../rendering/utils';\n\n/** @internal */\nexport function renderBars(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  geoms: Array<PerPanel<BarGeometry[]>>,\n  sharedStyle: SharedGeometryStateStyle,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  highlightedLegendItem?: LegendItem,\n) {\n  geoms.forEach(({ panel, value: bars }: PerPanel<BarGeometry[]>) =>\n    withPanelTransform(\n      ctx,\n      panel,\n      rotation,\n      renderingArea,\n      () =>\n        bars.forEach((barGeometry) => {\n          const { x, y, width, height, color, seriesStyle: style, seriesIdentifier } = barGeometry;\n          const rect = { x, y, width, height };\n          const geometryStateStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n          const barStyle = buildBarStyle(ctx, imgCanvas, color, style.rect, style.rectBorder, geometryStateStyle, rect);\n          renderRect(ctx, rect, barStyle.fill, barStyle.stroke);\n        }),\n      { area: getPanelClipping(panel, rotation), shouldClip: true },\n    ),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderPointGroup } from './points';\nimport { LegendItem } from '../../../../common/legend';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { withContext } from '../../../../renderers/canvas';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { BubbleGeometry, PerPanel } from '../../../../utils/geometry';\nimport { SharedGeometryStateStyle, GeometryStateStyle } from '../../../../utils/themes/theme';\nimport { getGeometryStateStyle } from '../../rendering/utils';\n\n/** @internal */\nexport function renderBubbles(\n  ctx: CanvasRenderingContext2D,\n  bubbles: Array<PerPanel<BubbleGeometry>>,\n  sharedStyle: SharedGeometryStateStyle,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  highlightedLegendItem?: LegendItem,\n) {\n  withContext(ctx, () => {\n    const styles: Record<SeriesKey, GeometryStateStyle> = {};\n    const allPoints = bubbles.flatMap(({ value: { seriesIdentifier, points } }) => {\n      styles[seriesIdentifier.key] = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n      return points;\n    });\n\n    const shouldClip = allPoints[0]?.value.mark !== null; // TODO: add padding over clipping\n    renderPointGroup(ctx, allPoints, styles, rotation, renderingArea, shouldClip);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderMultiLine } from './primitives/line';\nimport { withContext } from '../../../../renderers/canvas';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { AxisStyle } from '../../../../utils/themes/theme';\nimport { LinesGrid } from '../../utils/grid_lines';\nimport { AxisSpec } from '../../utils/specs';\n\ninterface GridProps {\n  sharedAxesStyle: AxisStyle;\n  perPanelGridLines: Array<LinesGrid>;\n  axesSpecs: AxisSpec[];\n  renderingArea: Dimensions;\n  axesStyles: Map<string, AxisStyle | null>;\n}\n\n/** @internal */\nexport function renderGrids(\n  ctx: CanvasRenderingContext2D,\n  { perPanelGridLines, renderingArea: { left, top } }: GridProps,\n) {\n  withContext(ctx, () => {\n    ctx.translate(left, top);\n    perPanelGridLines.forEach(({ lineGroups, panelAnchor: { x, y } }) => {\n      withContext(ctx, () => {\n        ctx.translate(x, y);\n        lineGroups.forEach(({ lines, stroke }) => renderMultiLine(ctx, lines, stroke));\n      });\n    });\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPanelClipping } from './panel_clipping';\nimport { renderPoints } from './points';\nimport { renderLinePaths } from './primitives/path';\nimport { buildLineStyles } from './styles/line';\nimport { withPanelTransform } from './utils/panel_transform';\nimport { colorToRgba, overrideOpacity } from '../../../../common/color_library_wrappers';\nimport { Radian } from '../../../../common/geometry';\nimport { LegendItem } from '../../../../common/legend';\nimport { Rect, Stroke } from '../../../../geoms/types';\nimport { withContext } from '../../../../renderers/canvas';\nimport { ColorVariant, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { LineGeometry, PerPanel } from '../../../../utils/geometry';\nimport { Point } from '../../../../utils/point';\nimport { SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { getGeometryStateStyle } from '../../rendering/utils';\n\n/** @internal */\nexport function renderLines(\n  ctx: CanvasRenderingContext2D,\n  lines: Array<PerPanel<LineGeometry>>,\n  sharedStyle: SharedGeometryStateStyle,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  highlightedLegendItem?: LegendItem,\n) {\n  withContext(ctx, () => {\n    lines.forEach(({ panel, value: line }) => {\n      const { style, points } = line;\n      const clippings = getPanelClipping(panel, rotation);\n      if (style.line.visible) {\n        withPanelTransform(\n          ctx,\n          panel,\n          rotation,\n          renderingArea,\n          () => renderLine(ctx, line, sharedStyle, clippings, highlightedLegendItem),\n          { area: clippings, shouldClip: true },\n        );\n      }\n\n      const visiblePoints = style.point.visible ? points : points.filter(({ isolated }) => isolated);\n      if (visiblePoints.length === 0) {\n        return;\n      }\n      const geometryStyle = getGeometryStateStyle(line.seriesIdentifier, sharedStyle, highlightedLegendItem);\n      withPanelTransform(\n        ctx,\n        panel,\n        rotation,\n        renderingArea,\n        () => renderPoints(ctx, visiblePoints, geometryStyle),\n        // TODO: add padding over clipping\n        { area: clippings, shouldClip: line.points[0]?.value.mark !== null },\n      );\n    });\n  });\n}\n\nfunction renderLine(\n  ctx: CanvasRenderingContext2D,\n  line: LineGeometry,\n  sharedStyle: SharedGeometryStateStyle,\n  clippings: Rect,\n  highlightedLegendItem?: LegendItem,\n) {\n  const { color, transform, seriesIdentifier, style, clippedRanges, shouldClip } = line;\n  const geometryStyle = getGeometryStateStyle(seriesIdentifier, sharedStyle, highlightedLegendItem);\n\n  const lineStroke = buildLineStyles(color, style.line, geometryStyle);\n  const fitLineStrokeColor = style.fit.line.stroke === ColorVariant.Series ? color : style.fit.line.stroke;\n  const fitLineStroke: Stroke = {\n    dash: style.fit.line.dash,\n    width: style.line.strokeWidth,\n    color: overrideOpacity(\n      colorToRgba(fitLineStrokeColor),\n      (opacity) => opacity * geometryStyle.opacity * style.fit.line.opacity,\n    ),\n  };\n\n  renderLinePaths(\n    ctx,\n    transform,\n    [line.line],\n    lineStroke,\n    fitLineStroke,\n    clippedRanges,\n    clippings,\n    shouldClip && style.fit.line.visible,\n  );\n}\n\n/**\n * Draws line along a polar axis\n * @internal\n */\nexport function drawPolarLine(\n  ctx: CanvasRenderingContext2D,\n  angle: Radian,\n  radius: number,\n  length: number,\n  center: Point = { x: 0, y: 0 },\n) {\n  const y1 = Math.sin(angle) * (radius - length / 2);\n  const x1 = Math.cos(angle) * (radius - length / 2);\n  const y2 = Math.sin(angle) * (radius + length / 2);\n  const x2 = Math.cos(angle) * (radius + length / 2);\n\n  ctx.moveTo(center.x + x1, center.y + y1);\n  ctx.lineTo(center.x + x2, center.y + y2);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Rect } from '../../../../geoms/types';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nconst CLIPPING_MARGIN = 0.5;\n\n/** @internal */\nexport function getPanelClipping(panel: Dimensions, rotation: Rotation): Rect {\n  const vertical = Math.abs(rotation) === 90;\n  const width = (vertical ? panel.height : panel.width) + CLIPPING_MARGIN * 2;\n  const height = (vertical ? panel.width : panel.height) + CLIPPING_MARGIN * 2;\n  return { x: -CLIPPING_MARGIN, y: -CLIPPING_MARGIN, width, height };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderTitle } from './title';\nimport { Colors } from '../../../../../common/colors';\nimport { withContext } from '../../../../../renderers/canvas';\nimport { PanelGeoms } from '../../../../../state/selectors/compute_panels';\nimport { Position } from '../../../../../utils/common';\nimport { AxisId } from '../../../../../utils/ids';\nimport { Point } from '../../../../../utils/point';\nimport { getSpecsById } from '../../../state/utils/spec';\nimport { AxisSpec } from '../../../utils/specs';\nimport { AxesProps, AxisProps, renderAxis } from '../axes';\nimport { renderRect } from '../primitives/rect';\nimport { renderDebugRect } from '../utils/debug';\n\n/** @internal */\nexport function renderGridPanels(ctx: CanvasRenderingContext2D, { x: chartX, y: chartY }: Point, panels: PanelGeoms) {\n  panels.forEach(({ width, height, panelAnchor: { x: panelX, y: panelY } }) =>\n    withContext(ctx, () =>\n      renderRect(\n        ctx,\n        { x: chartX + panelX, y: chartY + panelY, width, height },\n        { color: Colors.Transparent.rgba },\n        { color: Colors.Black.rgba, width: 1 },\n      ),\n    ),\n  );\n}\n\nfunction renderPanel(ctx: CanvasRenderingContext2D, props: AxisProps, locale: string) {\n  const { size, anchorPoint, debug, axisStyle, axisSpec, panelAnchor, secondary } = props;\n  const { position } = axisSpec;\n  const x = anchorPoint.x + (position === Position.Right ? -1 : 1) * panelAnchor.x;\n  const y = anchorPoint.y + (position === Position.Bottom ? -1 : 1) * panelAnchor.y;\n\n  withContext(ctx, () => {\n    ctx.translate(x, y);\n    if (debug && !secondary) renderDebugRect(ctx, { x: 0, y: 0, ...size });\n    renderAxis(ctx, props); // TODO: compute axis dimensions per panel, For now, just render the axis line\n    if (!secondary) {\n      const { panelTitle, dimension } = props;\n      renderTitle(\n        ctx,\n        true,\n        { panelTitle, axisSpec, axisStyle, size, dimension, debug, anchorPoint: { x: 0, y: 0 } },\n        locale,\n      ); // TODO: should we use the axisSpec/Style for the title of small multiple or use their own style?\n    }\n  });\n}\n\n/** @internal */\nexport function renderPanelSubstrates(ctx: CanvasRenderingContext2D, props: AxesProps, locale: string) {\n  const { axesSpecs, perPanelAxisGeoms, axesStyles, sharedAxesStyle, debug, renderingArea } = props;\n  const seenAxesTitleIds = new Set<AxisId>();\n\n  perPanelAxisGeoms.forEach(({ axesGeoms, panelAnchor }) => {\n    axesGeoms.forEach((geometry) => {\n      const {\n        axis: { panelTitle, id, position, secondary },\n        anchorPoint,\n        size,\n        dimension,\n        visibleTicks: ticks,\n        parentSize,\n      } = geometry;\n      const axisSpec = getSpecsById<AxisSpec>(axesSpecs, id);\n\n      if (!axisSpec || !dimension || !position || axisSpec.hide) {\n        return;\n      }\n\n      const axisStyle = axesStyles.get(axisSpec.id) ?? sharedAxesStyle;\n\n      if (!seenAxesTitleIds.has(id)) {\n        seenAxesTitleIds.add(id);\n        renderTitle(\n          ctx,\n          false,\n          { size: parentSize, debug, panelTitle, anchorPoint, dimension, axisStyle, axisSpec },\n          locale,\n        );\n      }\n\n      const layerGirth = dimension.maxLabelBboxHeight;\n\n      renderPanel(\n        ctx,\n        {\n          panelTitle,\n          secondary,\n          panelAnchor,\n          axisSpec,\n          anchorPoint,\n          size,\n          dimension,\n          ticks,\n          axisStyle,\n          debug,\n          renderingArea,\n          layerGirth,\n        },\n        locale,\n      );\n    });\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { measureText } from '../../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { Position } from '../../../../../utils/common';\nimport { innerPad, outerPad } from '../../../../../utils/dimensions';\nimport { Point } from '../../../../../utils/point';\nimport { wrapText } from '../../../../../utils/text/wrap';\nimport { isHorizontalAxis } from '../../../utils/axis_type_utils';\nimport { getAllAxisLayersGirth, getTitleDimension, shouldShowTicks } from '../../../utils/axis_utils';\nimport { AxisProps } from '../axes';\nimport { renderText, TextFont } from '../primitives/text';\nimport { renderDebugRect } from '../utils/debug';\n\ntype PanelTitleProps = Pick<AxisProps, 'panelTitle' | 'axisSpec' | 'axisStyle' | 'size' | 'dimension' | 'debug'>;\ntype TitleProps = PanelTitleProps & { anchorPoint: Point };\n\nconst titleFontDefaults: Omit<TextFont, 'fontFamily' | 'textColor' | 'fontSize'> = {\n  fontVariant: 'normal',\n  fontStyle: 'normal', // may be overridden (happens if prop on axis style is defined)\n  fontWeight: 'bold',\n  align: 'center',\n  baseline: 'middle',\n};\n\n/** @internal */\nexport function renderTitle(\n  ctx: CanvasRenderingContext2D,\n  panel: boolean,\n  {\n    size: { width, height },\n    dimension: { maxLabelBboxWidth, maxLabelBboxHeight },\n    axisSpec: { position, hide: hideAxis, title, timeAxisLayerCount },\n    axisStyle: { axisPanelTitle, axisTitle, tickLabel, tickLine },\n    panelTitle,\n    debug,\n    anchorPoint,\n  }: TitleProps,\n  locale: string,\n) {\n  const titleToRender = panel ? panelTitle : title;\n  const axisTitleToUse = panel ? axisPanelTitle : axisTitle;\n  if (!titleToRender || !axisTitleToUse.visible) {\n    return;\n  }\n  const otherAxisTitleToUse = panel ? axisTitle : axisPanelTitle;\n  const otherTitle = panel ? title : panelTitle;\n  const horizontal = isHorizontalAxis(position);\n  const font: TextFont = { ...titleFontDefaults, ...axisTitleToUse, textColor: axisTitleToUse.fill };\n  const tickDimension = shouldShowTicks(tickLine, hideAxis) ? tickLine.size + tickLine.padding : 0;\n  const maxLabelBoxGirth = horizontal ? maxLabelBboxHeight : maxLabelBboxWidth;\n  const allLayersGirth = getAllAxisLayersGirth(timeAxisLayerCount, maxLabelBoxGirth, horizontal);\n  const labelPaddingSum = innerPad(tickLabel.padding) + outerPad(tickLabel.padding);\n  const labelSize = tickLabel.visible ? allLayersGirth + labelPaddingSum : 0;\n  const otherTitleDimension = otherTitle ? getTitleDimension(otherAxisTitleToUse) : 0;\n  const titlePadding = panel || (axisTitleToUse.visible && title) ? axisTitleToUse.padding : 0;\n  const rotation = horizontal ? 0 : -90;\n  const offset =\n    position === Position.Left || position === Position.Top\n      ? outerPad(titlePadding) + (panel ? otherTitleDimension : 0)\n      : tickDimension + labelSize + innerPad(titlePadding) + (panel ? 0 : otherTitleDimension);\n  const x = anchorPoint.x + (horizontal ? 0 : offset);\n  const y = anchorPoint.y + (horizontal ? offset : height);\n  const textX = horizontal ? width / 2 + (panel ? 0 : x) : font.fontSize / 2 + (panel ? offset : x);\n  const textY = horizontal ? font.fontSize / 2 + (panel ? offset : y) : (panel ? height : -height + 2 * y) / 2;\n  const wrappedText = wrapText(\n    titleToRender ?? '',\n    font,\n    font.fontSize,\n    horizontal ? width : height,\n    1,\n    measureText(ctx),\n    locale,\n  );\n  if (!wrappedText[0]) return;\n  if (debug) renderDebugRect(ctx, { x, y, width: horizontal ? width : height, height: font.fontSize }, rotation);\n  renderText(ctx, { x: textX, y: textY }, wrappedText[0], font, rotation);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getPanelClipping } from './panel_clipping';\nimport { renderShape } from './primitives/shapes';\nimport { withPanelTransform } from './utils/panel_transform';\nimport { overrideOpacity } from '../../../../common/color_library_wrappers';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { Circle, Fill, Stroke } from '../../../../geoms/types';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { PointGeometry } from '../../../../utils/geometry';\nimport { GeometryStateStyle } from '../../../../utils/themes/theme';\n\n/**\n * Renders points from single series\n *\n * @internal\n */\nexport function renderPoints(ctx: CanvasRenderingContext2D, points: PointGeometry[], { opacity }: GeometryStateStyle) {\n  points\n    .slice()\n    .sort(({ radius: a }, { radius: b }) => b - a)\n    .forEach(({ x, y, radius, transform, style }) => {\n      const coordinates = { x: x + transform.x, y: y + transform.y, radius };\n      const fill = { color: overrideOpacity(style.fill.color, (fillOpacity) => fillOpacity * opacity) };\n      const stroke = {\n        ...style.stroke,\n        color: overrideOpacity(style.stroke.color, (fillOpacity) => fillOpacity * opacity),\n      };\n      renderShape(ctx, style.shape, coordinates, fill, stroke);\n    });\n}\n\n/**\n * Renders points in group from multiple series on a single layer\n *\n * @internal\n */\nexport function renderPointGroup(\n  ctx: CanvasRenderingContext2D,\n  points: PointGeometry[],\n  geometryStateStyles: Record<SeriesKey, GeometryStateStyle>,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  shouldClip: boolean,\n) {\n  points\n    .slice()\n    .sort(({ radius: a }, { radius: b }) => b - a)\n    .forEach(({ x, y, radius, transform, style, seriesIdentifier: { key }, panel }) => {\n      const opacity = geometryStateStyles[key]?.opacity ?? 1;\n      const fill: Fill = { color: overrideOpacity(style.fill.color, (fillOpacity) => fillOpacity * opacity) };\n      const stroke: Stroke = {\n        ...style.stroke,\n        color: overrideOpacity(style.stroke.color, (fillOpacity) => fillOpacity * opacity),\n      };\n      const coordinates: Circle = { x: x + transform.x, y, radius };\n      const renderer = () => renderShape(ctx, style.shape, coordinates, fill, stroke);\n      const clippings = { area: getPanelClipping(panel, rotation), shouldClip };\n      withPanelTransform(ctx, panel, rotation, renderingArea, renderer, clippings);\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Line, Stroke } from '../../../../../geoms/types';\nimport { withContext } from '../../../../../renderers/canvas';\n\n/**\n * Canvas2d stroke ignores an exact zero line width\n * Any value that's equal to or larger than MIN_STROKE_WIDTH\n * @internal\n */\nexport const MIN_STROKE_WIDTH = 0.001;\n\n/** @internal */\nexport function renderMultiLine(ctx: CanvasRenderingContext2D, lines: Line[] | string[], stroke: Stroke) {\n  if (stroke.width < MIN_STROKE_WIDTH || lines.length === 0) {\n    return;\n  }\n  withContext(ctx, () => {\n    ctx.strokeStyle = RGBATupleToString(stroke.color);\n    ctx.lineJoin = 'round';\n    ctx.lineWidth = stroke.width;\n    if (stroke.dash) {\n      ctx.setLineDash(stroke.dash);\n    }\n\n    ctx.beginPath();\n\n    for (const line of lines) {\n      if (typeof line === 'string') {\n        ctx.stroke(new Path2D(line));\n      } else {\n        ctx.moveTo(line.x1, line.y1);\n        ctx.lineTo(line.x2, line.y2);\n      }\n    }\n    ctx.stroke();\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderMultiLine } from './line';\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Fill, Rect, Stroke } from '../../../../../geoms/types';\nimport { withClipRanges } from '../../../../../renderers/canvas';\nimport { ClippedRanges } from '../../../../../utils/geometry';\nimport { Point } from '../../../../../utils/point';\n\n/** @internal */\nexport function renderLinePaths(\n  ctx: CanvasRenderingContext2D,\n  transform: Point,\n  linePaths: Array<string>,\n  stroke: Stroke,\n  fitStroke: Stroke,\n  clippedRanges: ClippedRanges,\n  clippings: Rect,\n  shouldClip: boolean,\n) {\n  withClipRanges(ctx, clippedRanges, clippings, false, () => {\n    ctx.translate(transform.x, transform.y);\n    renderMultiLine(ctx, linePaths, stroke);\n  });\n  if (clippedRanges.length > 0 && shouldClip) {\n    withClipRanges(ctx, clippedRanges, clippings, true, () => {\n      ctx.translate(transform.x, transform.y);\n      renderMultiLine(ctx, linePaths, fitStroke);\n    });\n  }\n}\n\n/** @internal */\nexport function renderAreaPath(\n  ctx: CanvasRenderingContext2D,\n  transform: Point,\n  area: string,\n  fill: Fill,\n  fitFill: Fill,\n  clippedRanges: ClippedRanges,\n  clippings: Rect,\n  shouldClip: boolean,\n) {\n  withClipRanges(ctx, clippedRanges, clippings, false, () => renderPathFill(ctx, area, fill, transform));\n  if (clippedRanges.length > 0 && shouldClip) {\n    withClipRanges(ctx, clippedRanges, clippings, true, () => renderPathFill(ctx, area, fitFill, transform));\n  }\n}\n\nfunction renderPathFill(ctx: CanvasRenderingContext2D, path: string, fill: Fill, { x, y }: Point) {\n  ctx.translate(x, y);\n  const path2d = new Path2D(path);\n  ctx.fillStyle = RGBATupleToString(fill.color);\n  ctx.fill(path2d);\n\n  if (fill.texture) {\n    ctx.fillStyle = fill.texture.pattern;\n    ctx.fill(path2d);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { MIN_STROKE_WIDTH } from './line';\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Fill, Rect, Stroke } from '../../../../../geoms/types';\n\n/** @internal */\nexport function renderRect(\n  ctx: CanvasRenderingContext2D,\n  { x, y, width, height }: Rect,\n  { color, texture }: Fill,\n  stroke: Stroke,\n  disableBorderOffset: boolean = false,\n) {\n  const borderOffset = !disableBorderOffset && stroke.width >= MIN_STROKE_WIDTH ? stroke.width : 0;\n  if (stroke.width >= MIN_STROKE_WIDTH && height >= borderOffset && width >= borderOffset) {\n    ctx.strokeStyle = RGBATupleToString(stroke.color);\n    ctx.lineWidth = stroke.width;\n    ctx.beginPath();\n    ctx.rect(x + borderOffset / 2, y + borderOffset / 2, width - borderOffset, height - borderOffset);\n    ctx.setLineDash(stroke.dash ?? []); // no dash if stroke.dash is undefined\n    ctx.lineCap = stroke.dash?.length ? 'butt' : 'square';\n    ctx.stroke();\n  }\n\n  ctx.beginPath();\n  ctx.rect(x + borderOffset, y + borderOffset, width - borderOffset * 2, height - borderOffset * 2);\n  ctx.fillStyle = RGBATupleToString(color);\n  ctx.fill();\n\n  if (texture) {\n    ctx.fillStyle = texture.pattern;\n    ctx.fill();\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { MIN_STROKE_WIDTH } from './line';\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Circle, Fill, Stroke } from '../../../../../geoms/types';\nimport { withContext } from '../../../../../renderers/canvas';\nimport { degToRad } from '../../../../../utils/common';\nimport { PointShape } from '../../../../../utils/themes/theme';\nimport { ShapeRendererFn } from '../../shapes_paths';\n\n/** @internal */\nexport function renderShape(\n  ctx: CanvasRenderingContext2D,\n  shape: PointShape,\n  { x, y, radius }: Circle,\n  { color: fillColor }: Fill,\n  { width, dash, color: strokeColor }: Stroke,\n) {\n  withContext(ctx, () => {\n    const [pathFn, rotation] = ShapeRendererFn[shape];\n    ctx.translate(x, y);\n    ctx.rotate(degToRad(rotation));\n    ctx.beginPath();\n\n    const path = new Path2D(pathFn(radius));\n\n    ctx.fillStyle = RGBATupleToString(fillColor);\n    ctx.fill(path);\n\n    if (width > MIN_STROKE_WIDTH) {\n      ctx.strokeStyle = RGBATupleToString(strokeColor);\n      ctx.lineWidth = width;\n      ctx.setLineDash(dash ?? []);\n      ctx.stroke(path);\n    }\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Degrees } from '../../../../../common/geometry';\nimport { cssFontShorthand, Font, TextAlign, TextBaseline } from '../../../../../common/text_utils';\nimport { withContext } from '../../../../../renderers/canvas';\nimport { measureText } from '../../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { degToRad } from '../../../../../utils/common';\nimport { Point } from '../../../../../utils/point';\nimport { TextDirection } from '../../../utils/axis_utils';\n\n/** @internal */\nexport type TextFont = Font & {\n  fontSize: number;\n  align: TextAlign;\n  baseline: TextBaseline;\n  shadow?: string;\n  shadowSize?: number;\n};\n\n/** @internal */\nexport function renderText(\n  ctx: CanvasRenderingContext2D,\n  origin: Point,\n  text: string,\n  font: TextFont,\n  angle: Degrees = 0,\n  translateX: number = 0,\n  translateY: number = 0,\n  scale: number = 1,\n  // optional until all chart types support direction\n  direction?: TextDirection,\n) {\n  withContext(ctx, () => {\n    ctx.translate(origin.x, origin.y);\n    ctx.rotate(degToRad(angle));\n    ctx.translate(translateX, translateY);\n    ctx.scale(scale, scale);\n    ctx.fillStyle = font.textColor;\n    ctx.textAlign = font.align;\n    ctx.textBaseline = font.baseline;\n    ctx.font = cssFontShorthand(font, font.fontSize);\n    const shadowSize = font.shadowSize ?? 0;\n    if (direction) ctx.direction = direction;\n    if (font.shadow && shadowSize > 0) {\n      ctx.lineJoin = 'round';\n      ctx.lineWidth = shadowSize;\n      ctx.strokeStyle = font.shadow;\n      ctx.strokeText(text, 0, 0);\n    }\n    ctx.fillText(text, 0, 0);\n  });\n}\n\nconst SPACE = ' ';\nconst ELLIPSIS = '…';\nconst DASH = '-';\n\ninterface Options {\n  wrapAtWord: boolean;\n  shouldAddEllipsis: boolean;\n}\n\n/** @internal */\nexport function wrapLines(\n  ctx: CanvasRenderingContext2D,\n  text: string,\n  font: Font,\n  fontSize: number,\n  fixedWidth: number,\n  fixedHeight: number,\n  { wrapAtWord, shouldAddEllipsis }: Options = { wrapAtWord: true, shouldAddEllipsis: false },\n) {\n  const lineHeight = 1;\n  const lines = text.split('\\n');\n  let textWidth = 0;\n  const lineHeightPx = lineHeight * fontSize;\n\n  const padding = 0;\n  const maxWidth = Math.max(fixedWidth - padding * 2, 0);\n  const maxHeightPx = Math.max(fixedHeight - padding * 2, 0);\n  let currentHeightPx = 0;\n  const shouldWrap = true;\n  const textArr: string[] = [];\n  const textMeasureProcessor = measureText(ctx);\n  const getTextWidth = (textString: string) => {\n    return textMeasureProcessor(textString, font, fontSize).width;\n  };\n\n  const additionalWidth = shouldAddEllipsis ? getTextWidth(ELLIPSIS) : 0;\n  for (let i = 0, max = lines.length; i < max; ++i) {\n    let line = lines[i];\n    if (!line) continue;\n    let lineWidth = getTextWidth(line);\n    if (lineWidth > maxWidth) {\n      while (line.length > 0) {\n        let low = 0;\n        let high = line.length;\n        let match = '';\n        let matchWidth = 0;\n        while (low < high) {\n          const mid = (low + high) >>> 1;\n          const substr = line.slice(0, mid + 1);\n          const substrWidth = getTextWidth(substr) + additionalWidth;\n          if (substrWidth <= maxWidth) {\n            low = mid + 1;\n            match = substr + (shouldAddEllipsis ? ELLIPSIS : '');\n            matchWidth = substrWidth;\n          } else {\n            high = mid;\n          }\n        }\n        if (match) {\n          if (wrapAtWord) {\n            const nextChar = line[match.length];\n            const nextIsSpaceOrDash = nextChar === SPACE || nextChar === DASH;\n            const wrapIndex =\n              nextIsSpaceOrDash && matchWidth <= maxWidth\n                ? match.length\n                : Math.max(match.lastIndexOf(SPACE), match.lastIndexOf(DASH)) + 1;\n            if (wrapIndex > 0) {\n              low = wrapIndex;\n              match = match.slice(0, low);\n              matchWidth = getTextWidth(match);\n            }\n          }\n          match = match.trimEnd();\n          textArr.push(match);\n          textWidth = Math.max(textWidth, matchWidth);\n          currentHeightPx += lineHeightPx;\n          if (!shouldWrap || (fixedHeight && currentHeightPx + lineHeightPx > maxHeightPx)) {\n            break;\n          }\n          line = line.slice(low);\n          line = line.trimStart();\n          if (line.length > 0) {\n            lineWidth = getTextWidth(line);\n            if (lineWidth <= maxWidth) {\n              textArr.push(line);\n              currentHeightPx += lineHeightPx;\n              textWidth = Math.max(textWidth, lineWidth);\n              break;\n            }\n          }\n        } else {\n          break;\n        }\n      }\n    } else {\n      textArr.push(line);\n      currentHeightPx += lineHeightPx;\n      textWidth = Math.max(textWidth, lineWidth);\n    }\n    if (fixedHeight && currentHeightPx + lineHeightPx > maxHeightPx) {\n      break;\n    }\n  }\n  return {\n    lines: textArr,\n    height: fontSize,\n    width: textWidth,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnimationContext, getAnimationPoolFn } from './animations';\nimport { AnimationState } from './animations/animation';\nimport { renderAnnotations } from './annotations';\nimport { renderAreas } from './areas';\nimport { renderBars } from './bars';\nimport { renderBubbles } from './bubbles';\nimport { renderGrids } from './grids';\nimport { renderLines } from './lines';\nimport { renderGridPanels, renderPanelSubstrates } from './panels/panels';\nimport { renderDebugRect } from './utils/debug';\nimport { renderBarValues } from './values/bar';\nimport { ReactiveChartStateProps } from './xy_chart';\nimport { Colors } from '../../../../common/colors';\nimport { clearCanvas, renderLayers, withContext } from '../../../../renderers/canvas';\n\n/** @internal */\nexport function renderXYChartCanvas2d(\n  ctx: CanvasRenderingContext2D,\n  dpr: number,\n  props: ReactiveChartStateProps,\n  animationState: AnimationState,\n) {\n  function render(aCtx: AnimationContext) {\n    const imgCanvas = document.createElement('canvas');\n\n    withContext(ctx, () => {\n      // let's set the devicePixelRatio once and for all; then we'll never worry about it again\n      ctx.scale(dpr, dpr);\n      const {\n        renderingArea,\n        chartTransform,\n        rotation,\n        geometries,\n        geometriesIndex,\n        theme: { axes: sharedAxesStyle, sharedStyle, barSeriesStyle, background },\n        highlightedLegendItem,\n        annotationDimensions,\n        annotationSpecs,\n        perPanelAxisGeoms,\n        perPanelGridLines,\n        axesSpecs,\n        axesStyles,\n        debug,\n        panelGeoms,\n        hoveredAnnotationIds,\n        locale,\n      } = props;\n\n      const transform = { x: renderingArea.left + chartTransform.x, y: renderingArea.top + chartTransform.y };\n\n      renderLayers(ctx, [\n        () => clearCanvas(ctx, 'transparent'),\n\n        // render panel grid\n        () => debug && renderGridPanels(ctx, transform, panelGeoms),\n\n        () =>\n          renderGrids(ctx, {\n            axesSpecs,\n            renderingArea,\n            perPanelGridLines,\n            axesStyles,\n            sharedAxesStyle,\n          }),\n\n        () =>\n          renderPanelSubstrates(\n            ctx,\n            {\n              axesSpecs,\n              perPanelAxisGeoms,\n              renderingArea,\n              debug,\n              axesStyles,\n              sharedAxesStyle,\n            },\n            locale,\n          ),\n\n        // rendering background annotations\n        () =>\n          renderAnnotations(\n            ctx,\n            aCtx,\n            annotationDimensions,\n            annotationSpecs,\n            rotation,\n            renderingArea,\n            sharedStyle,\n            hoveredAnnotationIds,\n            true,\n          ),\n\n        // rendering bars\n        () => renderBars(ctx, imgCanvas, geometries.bars, sharedStyle, rotation, renderingArea, highlightedLegendItem),\n\n        // rendering areas\n        () =>\n          renderAreas(ctx, imgCanvas, geometries.areas, sharedStyle, rotation, renderingArea, highlightedLegendItem),\n\n        // rendering lines\n        () => renderLines(ctx, geometries.lines, sharedStyle, rotation, renderingArea, highlightedLegendItem),\n\n        // rendering bubbles\n        () => renderBubbles(ctx, geometries.bubbles, sharedStyle, rotation, renderingArea, highlightedLegendItem),\n\n        () =>\n          geometries.bars.forEach(({ value: bars, panel }) =>\n            renderBarValues(ctx, {\n              bars,\n              panel,\n              renderingArea,\n              rotation,\n              debug,\n              barSeriesStyle,\n              background,\n            }),\n          ),\n\n        // rendering foreground annotations\n        () =>\n          renderAnnotations(\n            ctx,\n            aCtx,\n            annotationDimensions,\n            annotationSpecs,\n            rotation,\n            renderingArea,\n            sharedStyle,\n            hoveredAnnotationIds,\n            false,\n          ),\n\n        // rendering debugger\n        () =>\n          debug &&\n          withContext(ctx, () => {\n            const { left, top, width, height } = renderingArea;\n\n            renderDebugRect(\n              ctx,\n              { x: left, y: top, width, height },\n              0,\n              { color: Colors.Transparent.rgba },\n              { color: Colors.Red.rgba, width: 4, dash: [4, 4] },\n            );\n            const voronoi = geometriesIndex.triangulation([0, 0, width, height]);\n            if (voronoi) {\n              ctx.beginPath();\n              ctx.translate(left, top);\n              ctx.setLineDash([5, 5]);\n              voronoi.render(ctx);\n              ctx.lineWidth = 1;\n              ctx.strokeStyle = 'blue';\n              ctx.stroke();\n            }\n          }),\n      ]);\n    });\n  }\n\n  void getAnimationPoolFn(animationState, render);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Color } from '../../../../../common/colors';\nimport { Fill } from '../../../../../geoms/types';\nimport { ColorVariant, getColorFromVariant } from '../../../../../utils/common';\nimport { GeometryStateStyle, AreaStyle } from '../../../../../utils/themes/theme';\nimport { getTextureStyles } from '../../../utils/texture';\n\n/**\n * Return the rendering props for an area. The color of the area will be overwritten\n * by the fill color of the themeAreaStyle parameter if present\n * @internal\n */\nexport function buildAreaStyles(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  baseColor: Color | ColorVariant,\n  themeAreaStyle: AreaStyle,\n  geometryStateStyle: GeometryStateStyle,\n): Fill {\n  const texture = getTextureStyles(ctx, imgCanvas, baseColor, geometryStateStyle.opacity, themeAreaStyle.texture);\n  const color = overrideOpacity(\n    colorToRgba(getColorFromVariant(baseColor, themeAreaStyle.fill)),\n    (opacity) => opacity * geometryStateStyle.opacity * themeAreaStyle.opacity,\n  );\n\n  return {\n    color,\n    texture,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Stroke, Fill, Rect } from '../../../../../geoms/types';\nimport { getColorFromVariant } from '../../../../../utils/common';\nimport { GeometryStateStyle, RectStyle, RectBorderStyle } from '../../../../../utils/themes/theme';\nimport { getTextureStyles } from '../../../utils/texture';\n\n/**\n * Return the rendering styles (stroke and fill) for a bar.\n * The full color of the bar will be overwritten by the fill color\n * of the themeRectStyle parameter if present.\n * The stroke color of the bar will be overwritten by the stroke color\n * of the themeRectBorderStyle parameter if present.\n * @internal\n */\nexport function buildBarStyle(\n  ctx: CanvasRenderingContext2D,\n  imgCanvas: HTMLCanvasElement,\n  baseColor: string,\n  themeRectStyle: RectStyle,\n  themeRectBorderStyle: RectBorderStyle,\n  geometryStateStyle: GeometryStateStyle,\n  rect: Rect,\n): { fill: Fill; stroke: Stroke } {\n  const texture = getTextureStyles(ctx, imgCanvas, baseColor, geometryStateStyle.opacity, themeRectStyle.texture);\n  const fillColor = overrideOpacity(\n    colorToRgba(getColorFromVariant(baseColor, themeRectStyle.fill)),\n    (opacity) => opacity * themeRectStyle.opacity * geometryStateStyle.opacity,\n  );\n  const fill: Fill = {\n    color: fillColor,\n    texture,\n  };\n\n  const strokeColor = overrideOpacity(\n    colorToRgba(getColorFromVariant(baseColor, themeRectBorderStyle.stroke)),\n    (opacity) => opacity * geometryStateStyle.opacity * (themeRectBorderStyle.strokeOpacity ?? themeRectStyle.opacity),\n  );\n  const stroke: Stroke = {\n    color: strokeColor,\n    width:\n      themeRectBorderStyle.visible && rect.height > themeRectBorderStyle.strokeWidth\n        ? themeRectBorderStyle.strokeWidth\n        : 0,\n  };\n  return { fill, stroke };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, overrideOpacity } from '../../../../../common/color_library_wrappers';\nimport { Stroke } from '../../../../../geoms/types';\nimport { getColorFromVariant } from '../../../../../utils/common';\nimport { GeometryStateStyle, LineStyle } from '../../../../../utils/themes/theme';\n\n/**\n * Return the rendering props for a line. The color of the line will be overwritten\n * by the stroke color of the themeLineStyle parameter if present\n * @param baseColor the assigned color of the line for this series\n * @param themeLineStyle the theme style for the line series\n * @param geometryStateStyle the highlight geometry style\n * @internal\n */\nexport function buildLineStyles(\n  baseColor: string,\n  themeLineStyle: LineStyle,\n  geometryStateStyle: GeometryStateStyle,\n): Stroke {\n  const strokeColor = overrideOpacity(\n    colorToRgba(getColorFromVariant(baseColor, themeLineStyle.stroke)),\n    (opacity) => opacity * themeLineStyle.opacity * geometryStateStyle.opacity,\n  );\n  return {\n    color: strokeColor,\n    width: themeLineStyle.strokeWidth,\n    dash: themeLineStyle.dash,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RGBATupleToString } from '../../../../../common/color_library_wrappers';\nimport { Fill, Stroke, Rect } from '../../../../../geoms/types';\nimport { withContext } from '../../../../../renderers/canvas';\nimport { degToRad } from '../../../../../utils/common';\nimport { Point } from '../../../../../utils/point';\nimport { renderRect } from '../primitives/rect';\n\nconst DEFAULT_DEBUG_FILL: Fill = {\n  color: [238, 130, 238, 0.2], // violet\n};\nconst DEFAULT_DEBUG_STROKE: Stroke = {\n  color: [0, 0, 0, 0.2],\n  width: 1,\n};\n\n/** @internal */\nexport function renderDebugRect(\n  ctx: CanvasRenderingContext2D,\n  rect: Rect,\n  rotation = 0,\n  fill = DEFAULT_DEBUG_FILL,\n  stroke = DEFAULT_DEBUG_STROKE,\n) {\n  withContext(ctx, () => {\n    ctx.translate(rect.x, rect.y);\n    ctx.rotate(degToRad(rotation));\n    renderRect(ctx, { ...rect, x: 0, y: 0 }, fill, stroke, true);\n  });\n}\n\n/** @internal */\nexport function renderDebugRectCenterRotated(\n  ctx: CanvasRenderingContext2D,\n  center: Point,\n  rect: Rect,\n  fill = DEFAULT_DEBUG_FILL,\n  stroke = DEFAULT_DEBUG_STROKE,\n  rotation: number = 0,\n) {\n  const { x, y } = center;\n\n  withContext(ctx, () => {\n    ctx.translate(x, y);\n    ctx.rotate(degToRad(rotation));\n    ctx.translate(-x, -y);\n    renderRect(ctx, { ...rect, x: x - rect.width / 2, y: y - rect.height / 2 }, fill, stroke);\n  });\n}\n\n/** @internal */\nexport function renderDebugPoint(\n  ctx: CanvasRenderingContext2D,\n  x: number,\n  y: number,\n  size = 16,\n  stroke = DEFAULT_DEBUG_STROKE,\n) {\n  withContext(ctx, () => {\n    ctx.beginPath();\n    ctx.lineWidth = stroke.width;\n    ctx.strokeStyle = RGBATupleToString(stroke.color);\n\n    ctx.moveTo(x - size, y);\n    ctx.lineTo(x + size, y);\n\n    ctx.moveTo(x, y - size);\n    ctx.lineTo(x, y + size);\n\n    ctx.stroke();\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { hasMostlyRTLItems } from '../../../../../utils/common';\nimport { PerPanelAxisGeoms } from '../../../state/selectors/compute_per_panel_axes_geoms';\n\n/** @internal */\nexport function hasMostlyRTL(geoms: PerPanelAxisGeoms[]): boolean {\n  // returns all string value labels\n  const labels = geoms.flatMap(({ axesGeoms }) => {\n    return axesGeoms.flatMap(({ visibleTicks }) => {\n      return visibleTicks\n        .filter(({ value, label }) => typeof value === 'string' && label !== '')\n        .map(({ label }) => label);\n    });\n  });\n\n  return hasMostlyRTLItems(labels);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Rect } from '../../../../../geoms/types';\nimport { CanvasRenderer, withContext } from '../../../../../renderers/canvas';\nimport { degToRad, Rotation } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { computeChartTransform } from '../../../state/utils/utils';\n\n/** @internal */\nexport function withPanelTransform(\n  ctx: CanvasRenderingContext2D,\n  panel: Dimensions,\n  rotation: Rotation,\n  renderingArea: Dimensions,\n  fn: CanvasRenderer,\n  clippings?: {\n    area: Rect;\n    shouldClip?: boolean;\n  },\n) {\n  const transform = computeChartTransform(panel, rotation);\n  withContext(ctx, () => {\n    ctx.translate(renderingArea.left + panel.left + transform.x, renderingArea.top + panel.top + transform.y);\n    ctx.rotate(degToRad(rotation));\n\n    if (clippings?.shouldClip) {\n      const { x, y, width, height } = clippings.area;\n      ctx.beginPath();\n      ctx.rect(x, y, width, height);\n      ctx.clip();\n    }\n    fn(ctx);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Colors } from '../../../../../common/colors';\nimport { fillTextColor } from '../../../../../common/fill_text_color';\nimport { Font, TextAlign, TextBaseline } from '../../../../../common/text_utils';\nimport { Rect } from '../../../../../geoms/types';\nimport { HorizontalAlignment, Rotation, VerticalAlignment } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { BarGeometry } from '../../../../../utils/geometry';\nimport { BackgroundStyle, TextAlignment, Theme } from '../../../../../utils/themes/theme';\nimport { LabelOverflowConstraint } from '../../../utils/specs';\nimport { renderText } from '../primitives/text';\nimport { renderDebugRect } from '../utils/debug';\nimport { withPanelTransform } from '../utils/panel_transform';\n\ninterface BarValuesProps {\n  barSeriesStyle: Theme['barSeriesStyle'];\n  renderingArea: Dimensions;\n  rotation: Rotation;\n  debug: boolean;\n  bars: BarGeometry[];\n  panel: Dimensions;\n  background: BackgroundStyle;\n}\n\nconst CHART_DIRECTION: Record<string, Rotation> = {\n  BottomUp: 0,\n  TopToBottom: 180,\n  LeftToRight: 90,\n  RightToLeft: -90,\n};\n\n/** @internal */\nexport function renderBarValues(ctx: CanvasRenderingContext2D, props: BarValuesProps) {\n  const { bars, debug, rotation, renderingArea, barSeriesStyle, panel, background } = props;\n  const { fontFamily, fontStyle, fill, alignment } = barSeriesStyle.displayValue;\n  bars.forEach((bar) => {\n    if (!bar.displayValue) {\n      return;\n    }\n    const { text, fontSize, fontScale, overflowConstraints } = bar.displayValue;\n    const shadowSize = getTextBorderSize(fill);\n    const { fillColor, shadowColor } = getTextColors(fill, bar.color, background);\n    const font: Font = {\n      fontFamily,\n      fontStyle: fontStyle ?? 'normal',\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      textColor: fillColor,\n    };\n\n    const { x, y, align, baseline, rect, overflow } = positionText(\n      bar,\n      bar.displayValue,\n      rotation,\n      barSeriesStyle.displayValue,\n      alignment,\n    );\n\n    if (overflowConstraints.has(LabelOverflowConstraint.ChartEdges) && isOverflow(rect, renderingArea, rotation)) {\n      return;\n    }\n    if (overflowConstraints.has(LabelOverflowConstraint.BarGeometry) && overflow) {\n      return;\n    }\n    const lines = [text];\n    const { width, height } = bar.displayValue;\n\n    if (debug) withPanelTransform(ctx, panel, rotation, renderingArea, () => renderDebugRect(ctx, rect));\n\n    lines.forEach((textLine, j) => {\n      const origin = lineOrigin(x, y, rotation, j, lines.length, width, height);\n      const fontAugment = { fontSize, align, baseline, shadow: shadowColor, shadowSize };\n      withPanelTransform(ctx, panel, rotation, renderingArea, () =>\n        renderText(ctx, origin, textLine, { ...font, ...fontAugment }, -rotation, 0, 0, fontScale),\n      );\n    });\n  });\n}\n\nfunction lineOrigin(x: number, y: number, rotation: Rotation, i: number, max: number, width: number, height: number) {\n  const size = Math.abs(rotation) === 90 ? width : height;\n  const sizeMultiplier = rotation > 0 ? -(i - max + 1) : rotation === 0 ? i : 0;\n  return { x, y: y + size * sizeMultiplier };\n}\n\nfunction positionText(\n  geom: BarGeometry,\n  valueBox: { width: number; height: number },\n  chartRotation: Rotation,\n  offsets: { offsetX: number; offsetY: number },\n  alignment?: TextAlignment,\n): { x: number; y: number; align: TextAlign; baseline: TextBaseline; rect: Rect; overflow: boolean } {\n  const { offsetX, offsetY } = offsets;\n\n  const horizontal = alignment?.horizontal;\n  const vertical = alignment?.vertical;\n  const horizontalOverflow = valueBox.width > geom.width || valueBox.height > geom.height;\n  const verticalOverflow = valueBox.height > geom.width || valueBox.width > geom.height;\n\n  switch (chartRotation) {\n    case CHART_DIRECTION.TopToBottom: {\n      const alignmentOffsetX =\n        horizontal === HorizontalAlignment.Left\n          ? geom.width / 2 - valueBox.width / 2\n          : horizontal === HorizontalAlignment.Right\n            ? -geom.width / 2 + valueBox.width / 2\n            : 0;\n      const alignmentOffsetY =\n        vertical === VerticalAlignment.Top\n          ? geom.height - valueBox.height\n          : vertical === VerticalAlignment.Middle\n            ? geom.height / 2 - valueBox.height / 2\n            : 0;\n      const x = geom.x + geom.width / 2 - offsetX + alignmentOffsetX;\n      const y = geom.y + offsetY + alignmentOffsetY;\n      const rect = { x: x - valueBox.width / 2, y, width: valueBox.width, height: valueBox.height };\n      return { x, y, rect, align: 'center', baseline: 'bottom', overflow: horizontalOverflow };\n    }\n    case CHART_DIRECTION.RightToLeft: {\n      const alignmentOffsetX =\n        horizontal === HorizontalAlignment.Right\n          ? geom.height - valueBox.width\n          : horizontal === HorizontalAlignment.Center\n            ? geom.height / 2 - valueBox.width / 2\n            : 0;\n      const alignmentOffsetY =\n        vertical === VerticalAlignment.Bottom\n          ? -geom.width + valueBox.height\n          : vertical === VerticalAlignment.Middle\n            ? -geom.width / 2 + valueBox.height / 2\n            : 0;\n      const x = geom.x + geom.width + offsetY + alignmentOffsetY;\n      const y = geom.y - offsetX + alignmentOffsetX;\n      const rect = { x: x - valueBox.height, y, width: valueBox.height, height: valueBox.width };\n      return { x, y, rect, align: 'left', baseline: 'top', overflow: verticalOverflow };\n    }\n    case CHART_DIRECTION.LeftToRight: {\n      const alignmentOffsetX =\n        horizontal === HorizontalAlignment.Left\n          ? geom.height - valueBox.width\n          : horizontal === HorizontalAlignment.Center\n            ? geom.height / 2 - valueBox.width / 2\n            : 0;\n      const alignmentOffsetY =\n        vertical === VerticalAlignment.Bottom\n          ? geom.width - valueBox.height\n          : vertical === VerticalAlignment.Middle\n            ? geom.width / 2 - valueBox.height / 2\n            : 0;\n      const x = geom.x - offsetY + alignmentOffsetY;\n      const y = geom.y + offsetX + alignmentOffsetX;\n      const rect = { x, y, width: valueBox.height, height: valueBox.width };\n      return { x, y, rect, align: 'right', baseline: 'top', overflow: verticalOverflow };\n    }\n    case CHART_DIRECTION.BottomUp:\n    default: {\n      const alignmentOffsetX =\n        horizontal === HorizontalAlignment.Left\n          ? -geom.width / 2 + valueBox.width / 2\n          : horizontal === HorizontalAlignment.Right\n            ? geom.width / 2 - valueBox.width / 2\n            : 0;\n      const alignmentOffsetY =\n        vertical === VerticalAlignment.Bottom\n          ? geom.height - valueBox.height\n          : vertical === VerticalAlignment.Middle\n            ? geom.height / 2 - valueBox.height / 2\n            : 0;\n      const x = geom.x + geom.width / 2 - offsetX + alignmentOffsetX;\n      const y = geom.y - offsetY + alignmentOffsetY;\n      const rect = { x: x - valueBox.width / 2, y, width: valueBox.width, height: valueBox.height };\n      return { x, y, rect, align: 'center', baseline: 'top', overflow: horizontalOverflow };\n    }\n  }\n}\n\nfunction isOverflow(rect: Rect, chartDimensions: Dimensions, chartRotation: Rotation) {\n  const vertical = Math.abs(chartRotation) === 90;\n  const cWidth = vertical ? chartDimensions.height : chartDimensions.width;\n  const cHeight = vertical ? chartDimensions.width : chartDimensions.height;\n  return rect.x < 0 || rect.x + rect.width > cWidth || rect.y < 0 || rect.y + rect.height > cHeight;\n}\n\ntype ValueFillDefinition = Theme['barSeriesStyle']['displayValue']['fill'];\n\nfunction getTextColors(\n  fillDefinition: ValueFillDefinition,\n  geometryColor: string,\n  { color: backgroundColor, fallbackColor: fallbackBGColor }: BackgroundStyle,\n): { fillColor: string; shadowColor: string } {\n  if (typeof fillDefinition === 'string') {\n    return { fillColor: fillDefinition, shadowColor: Colors.Transparent.keyword };\n  }\n  if ('color' in fillDefinition) {\n    return {\n      fillColor: fillDefinition.color,\n      shadowColor: fillDefinition.borderColor || Colors.Transparent.keyword,\n    };\n  }\n  const fillColor = fillTextColor(fallbackBGColor, geometryColor, backgroundColor).color.keyword;\n  const shadowColor = fillTextColor(fallbackBGColor, fillColor, backgroundColor).color.keyword;\n\n  return {\n    fillColor,\n    shadowColor,\n  };\n}\n\nconst DEFAULT_BORDER_WIDTH = 1.5;\nconst MAX_BORDER_WIDTH = 8;\n\nfunction getTextBorderSize(fill: ValueFillDefinition): number {\n  if (typeof fill === 'string') {\n    return DEFAULT_BORDER_WIDTH;\n  }\n  if ('borderWidth' in fill) {\n    return Math.min(fill.borderWidth ?? DEFAULT_BORDER_WIDTH, MAX_BORDER_WIDTH);\n  }\n  const borderWidth =\n    'textBorder' in fill && typeof fill.textBorder === 'number' ? fill.textBorder : DEFAULT_BORDER_WIDTH;\n  return Math.min(borderWidth, MAX_BORDER_WIDTH);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { AnimationState } from './animations/animation';\nimport { renderXYChartCanvas2d } from './renderers';\nimport { hasMostlyRTL } from './utils/has_mostly_rtl';\nimport { LegendItem } from '../../../../common/legend';\nimport { ScreenReaderSummary } from '../../../../components/accessibility';\nimport { settingsBuildProps } from '../../../../specs';\nimport { onChartRendered } from '../../../../state/actions/chart';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { computePanelsSelectors, PanelGeoms } from '../../../../state/selectors/compute_panels';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../../../state/selectors/get_accessibility_config';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { deepEqual } from '../../../../utils/fast_deep_equal';\nimport { AnnotationId, AxisId } from '../../../../utils/ids';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme, AxisStyle } from '../../../../utils/themes/theme';\nimport { AnnotationDimensions } from '../../annotations/types';\nimport { computeAnnotationDimensionsSelector } from '../../state/selectors/compute_annotations';\nimport { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions';\nimport { computeChartTransformSelector } from '../../state/selectors/compute_chart_transform';\nimport {\n  computePerPanelAxesGeomsSelector,\n  PerPanelAxisGeoms,\n} from '../../state/selectors/compute_per_panel_axes_geoms';\nimport { computeSeriesGeometriesSelector } from '../../state/selectors/compute_series_geometries';\nimport { getAxesStylesSelector } from '../../state/selectors/get_axis_styles';\nimport { getGridLinesSelector } from '../../state/selectors/get_grid_lines';\nimport { getHighlightedAnnotationIdsSelector } from '../../state/selectors/get_highlighted_annotation_ids_selector';\nimport { getHighlightedSeriesSelector } from '../../state/selectors/get_highlighted_series';\nimport { getAnnotationSpecsSelector, getAxisSpecsSelector } from '../../state/selectors/get_specs';\nimport { isChartEmptySelector } from '../../state/selectors/is_chart_empty';\nimport { Geometries, Transform } from '../../state/utils/types';\nimport { LinesGrid } from '../../utils/grid_lines';\nimport { IndexedGeometryMap } from '../../utils/indexed_geometry_map';\nimport { AxisSpec, AnnotationSpec } from '../../utils/specs';\n\n/** @internal */\nexport interface ReactiveChartStateProps {\n  isRTL: boolean;\n  initialized: boolean;\n  debug: boolean;\n  isChartEmpty: boolean;\n  geometries: Geometries;\n  geometriesIndex: IndexedGeometryMap;\n  theme: Theme;\n  chartContainerDimensions: Dimensions;\n  rotation: Rotation;\n  renderingArea: Dimensions;\n  chartTransform: Transform;\n  highlightedLegendItem?: LegendItem;\n  hoveredAnnotationIds: string[];\n  axesSpecs: AxisSpec[];\n  perPanelAxisGeoms: Array<PerPanelAxisGeoms>;\n  perPanelGridLines: Array<LinesGrid>;\n  axesStyles: Map<AxisId, AxisStyle | null>;\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>;\n  annotationSpecs: AnnotationSpec[];\n  panelGeoms: PanelGeoms;\n  a11ySettings: A11ySettings;\n  locale: string;\n}\n\ninterface ReactiveChartDispatchProps {\n  onChartRendered: typeof onChartRendered;\n}\n\ninterface ReactiveChartOwnProps {\n  forwardCanvasRef: RefObject<HTMLCanvasElement>;\n}\n\ntype XYChartProps = ReactiveChartStateProps & ReactiveChartDispatchProps & ReactiveChartOwnProps;\n\nclass XYChartComponent extends React.Component<XYChartProps> {\n  static displayName = 'XYChart';\n\n  private ctx: CanvasRenderingContext2D | null;\n  private animationState: AnimationState;\n\n  // see example https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio#Example\n  private readonly devicePixelRatio: number; // fixme this be no constant: multi-monitor window drag may necessitate modifying the `<canvas>` dimensions\n\n  constructor(props: Readonly<XYChartProps>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n    this.animationState = { rafId: NaN, pool: new Map() };\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  shouldComponentUpdate(nextProps: ReactiveChartStateProps) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n      this.props.onChartRendered();\n    }\n  }\n\n  componentWillUnmount() {\n    window.cancelAnimationFrame(this.animationState.rafId);\n    this.animationState.pool.clear();\n  }\n\n  private drawCanvas() {\n    if (this.ctx) {\n      renderXYChartCanvas2d(this.ctx, this.devicePixelRatio, this.props, this.animationState);\n    }\n  }\n\n  private tryCanvasContext() {\n    const canvas = this.props.forwardCanvasRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  render() {\n    const {\n      forwardCanvasRef,\n      initialized,\n      isChartEmpty,\n      chartContainerDimensions: { width, height },\n      a11ySettings,\n      debug,\n      isRTL,\n    } = this.props;\n\n    if (!initialized || isChartEmpty) {\n      this.ctx = null;\n      return null;\n    }\n\n    return (\n      <>\n        <figure aria-labelledby={a11ySettings.labelId} aria-describedby={a11ySettings.descriptionId}>\n          <canvas\n            dir={isRTL ? 'rtl' : 'ltr'}\n            ref={forwardCanvasRef}\n            className=\"echCanvasRenderer\"\n            width={width * this.devicePixelRatio}\n            height={height * this.devicePixelRatio}\n            style={{\n              width,\n              height,\n            }}\n            // eslint-disable-next-line jsx-a11y/no-interactive-element-to-noninteractive-role\n            role=\"presentation\"\n          />\n          {!debug && <ScreenReaderSummary />}\n        </figure>\n        {debug && <ScreenReaderSummary />}\n      </>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ReactiveChartDispatchProps =>\n  bindActionCreators(\n    {\n      onChartRendered,\n    },\n    dispatch,\n  );\n\nconst DEFAULT_PROPS: ReactiveChartStateProps = {\n  isRTL: false,\n  initialized: false,\n  debug: false,\n  isChartEmpty: true,\n  geometries: {\n    areas: [],\n    bars: [],\n    lines: [],\n    points: [],\n    bubbles: [],\n  },\n  geometriesIndex: new IndexedGeometryMap(),\n  theme: LIGHT_THEME,\n  chartContainerDimensions: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  rotation: 0 as const,\n  renderingArea: {\n    width: 0,\n    height: 0,\n    left: 0,\n    top: 0,\n  },\n  chartTransform: {\n    x: 0,\n    y: 0,\n    rotate: 0,\n  },\n  axesSpecs: [],\n  perPanelAxisGeoms: [],\n  perPanelGridLines: [],\n  axesStyles: new Map(),\n  hoveredAnnotationIds: [],\n  annotationDimensions: new Map(),\n  annotationSpecs: [],\n  panelGeoms: [],\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  locale: settingsBuildProps.defaults.locale,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ReactiveChartStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_PROPS;\n  }\n\n  const { geometries, geometriesIndex } = computeSeriesGeometriesSelector(state);\n  const { debug, locale } = getSettingsSpecSelector(state);\n  const perPanelAxisGeoms = computePerPanelAxesGeomsSelector(state);\n\n  return {\n    locale,\n    isRTL: hasMostlyRTL(perPanelAxisGeoms),\n    initialized: true,\n    isChartEmpty: isChartEmptySelector(state),\n    debug,\n    geometries,\n    geometriesIndex,\n    theme: getChartThemeSelector(state),\n    chartContainerDimensions: getChartContainerDimensionsSelector(state),\n    highlightedLegendItem: getHighlightedSeriesSelector(state),\n    hoveredAnnotationIds: getHighlightedAnnotationIdsSelector(state),\n    rotation: getChartRotationSelector(state),\n    renderingArea: computeChartDimensionsSelector(state).chartDimensions,\n    chartTransform: computeChartTransformSelector(state),\n    axesSpecs: getAxisSpecsSelector(state),\n    perPanelAxisGeoms,\n    perPanelGridLines: getGridLinesSelector(state),\n    axesStyles: getAxesStylesSelector(state),\n    annotationDimensions: computeAnnotationDimensionsSelector(state),\n    annotationSpecs: getAnnotationSpecsSelector(state),\n    panelGeoms: computePanelsSelectors(state),\n    a11ySettings: getA11ySettingsSelector(state),\n  };\n};\n\n/** @internal */\nexport const XYChart = connect(mapStateToProps, mapDispatchToProps)(XYChartComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnimationConfig, AnnotationAnimationTrigger } from './../../utils/specs';\nimport { mergePartial } from '../../../../utils/common';\nimport { GeometryStateStyle, SharedGeometryStateStyle } from '../../../../utils/themes/theme';\nimport { TimeFunction } from '../../../../utils/time_functions';\nimport { AnimationOptions } from '../canvas/animations/animation';\n\nconst DEFAULT_ANNOTATION_ANIMATION_OPTIONS: AnimationOptions = {\n  enabled: true,\n  duration: 250,\n  delay: 50,\n  snapValues: [],\n  timeFunction: TimeFunction.easeInOut,\n};\n\n/** @internal */\nexport interface AnnotationHoverParams {\n  style: GeometryStateStyle;\n  isHighlighted: boolean;\n  shouldTransition: boolean;\n  options: AnimationOptions;\n}\n\n/** @internal */\nexport type GetAnnotationParamsFn = (id: string) => AnnotationHoverParams;\n\n/**\n * Returns function to get geometry styles for a given id\n * @internal\n */\nexport const getAnnotationHoverParamsFn =\n  (\n    hoveredElementIds: string[],\n    styles: SharedGeometryStateStyle,\n    animations: AnimationConfig<AnnotationAnimationTrigger>[] = [],\n  ): GetAnnotationParamsFn =>\n  (id) => {\n    const fadeOutConfig = animations.find(({ trigger }) => trigger === AnnotationAnimationTrigger.FadeOnFocusingOthers);\n    const isHighlighted = hoveredElementIds.includes(id);\n    const style =\n      hoveredElementIds.length === 0 || !fadeOutConfig\n        ? styles.default\n        : isHighlighted\n          ? styles.highlighted\n          : styles.unhighlighted;\n    const shouldTransition = !isHighlighted && hoveredElementIds.length > 0;\n\n    return {\n      style,\n      isHighlighted,\n      shouldTransition,\n      options: mergePartial(DEFAULT_ANNOTATION_ANIMATION_OPTIONS, fadeOutConfig?.options),\n    };\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { useCallback, useMemo, useEffect, RefObject } from 'react';\n\nimport { TooltipContent } from './tooltip_content';\nimport { TooltipPortal, Placement, TooltipPortalSettings } from '../../../../../components/portal';\nimport { TooltipWrapper } from '../../../../../components/tooltip';\nimport { AnnotationTooltipState } from '../../../annotations/types';\n\ninterface AnnotationTooltipProps {\n  state: AnnotationTooltipState | null;\n  chartRef: RefObject<HTMLDivElement>;\n  chartId: string;\n  zIndex: number;\n  onScroll?: () => void;\n}\n\n/** @internal */\nexport const AnnotationTooltip = ({ state, chartRef, chartId, onScroll, zIndex }: AnnotationTooltipProps) => {\n  const renderTooltip = useCallback(() => {\n    if (!state || !state.isVisible) {\n      return null;\n    }\n\n    return (\n      <TooltipWrapper\n        // actions not used on annotations yet\n        actions={[]}\n        actionPrompt=\"\"\n        pinningPrompt=\"\"\n        selectionPrompt=\"\"\n        actionsLoading=\"\"\n        noActionsLoaded=\"\"\n        className=\"echAnnotation\"\n      >\n        <TooltipContent {...state} />\n      </TooltipWrapper>\n    );\n  }, [state]);\n\n  const handleScroll = () => {\n    // TODO: handle scroll cursor update\n    if (onScroll) {\n      onScroll();\n    }\n  };\n\n  useEffect(() => {\n    if (onScroll) {\n      window.addEventListener('scroll', handleScroll, true);\n      return () => window.removeEventListener('scroll', handleScroll, true);\n    }\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  const popperSettings = useMemo((): TooltipPortalSettings | undefined => {\n    const settings = state?.tooltipSettings;\n    if (!settings) {\n      return;\n    }\n\n    const { placement, boundary, ...rest } = settings;\n\n    return {\n      ...rest,\n      placement: placement ?? Placement.Right,\n      boundary: boundary === 'chart' ? chartRef.current ?? undefined : boundary,\n    };\n  }, [state?.tooltipSettings, chartRef]);\n\n  const position = useMemo(() => state?.anchor ?? null, [state?.anchor]);\n  if (!state?.isVisible) {\n    return null;\n  }\n  return (\n    <TooltipPortal\n      scope=\"AnnotationTooltip\"\n      chartId={chartId}\n      // increasing by 100 the tooltip portal zIndex to avoid conflicts with highlighters and other elements in the DOM\n      zIndex={zIndex + 100}\n      anchor={{\n        position,\n        appendRef: chartRef,\n      }}\n      visible={state?.isVisible ?? false}\n      settings={popperSettings}\n    >\n      {renderTooltip()}\n    </TooltipPortal>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject, useCallback } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { AnnotationTooltip } from './annotation_tooltip';\nimport { LineMarker } from './line_marker';\nimport {\n  onDOMElementEnter as onDOMElementEnterAction,\n  onDOMElementLeave as onDOMElementLeaveAction,\n  onDOMElementClick as onDOMElementClickAction,\n  onDOMElementClick,\n} from '../../../../../state/actions/dom_element';\nimport { onPointerMove as onPointerMoveAction } from '../../../../../state/actions/mouse';\nimport { GlobalChartState, BackwardRef } from '../../../../../state/chart_state';\nimport { getChartThemeSelector } from '../../../../../state/selectors/get_chart_theme';\nimport {\n  getInternalIsInitializedSelector,\n  InitStatus,\n} from '../../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../../state/selectors/get_settings_spec';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { AnnotationId } from '../../../../../utils/ids';\nimport { LIGHT_THEME } from '../../../../../utils/themes/light_theme';\nimport { SharedGeometryStateStyle } from '../../../../../utils/themes/theme';\nimport { AnnotationLineProps } from '../../../annotations/line/types';\nimport { AnnotationDimensions, AnnotationTooltipState } from '../../../annotations/types';\nimport { computeAnnotationDimensionsSelector } from '../../../state/selectors/compute_annotations';\nimport { computeChartDimensionsSelector } from '../../../state/selectors/compute_chart_dimensions';\nimport { getAnnotationTooltipStateSelector } from '../../../state/selectors/get_annotation_tooltip_state';\nimport { getHighlightedAnnotationIdsSelector } from '../../../state/selectors/get_highlighted_annotation_ids_selector';\nimport { getAnnotationSpecsSelector } from '../../../state/selectors/get_specs';\nimport { isChartEmptySelector } from '../../../state/selectors/is_chart_empty';\nimport { getSpecsById } from '../../../state/utils/spec';\nimport { isLineAnnotation, AnnotationSpec, AnnotationAnimationConfig } from '../../../utils/specs';\nimport { getAnnotationHoverParamsFn } from '../../common/utils';\n\ninterface AnnotationsDispatchProps {\n  onPointerMove: typeof onPointerMoveAction;\n  onDOMElementEnter: typeof onDOMElementEnterAction;\n  onDOMElementLeave: typeof onDOMElementLeaveAction;\n}\n\ninterface AnnotationsStateProps {\n  isChartEmpty: boolean;\n  tooltipState: AnnotationTooltipState | null;\n  chartDimensions: Dimensions;\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>;\n  sharedStyle: SharedGeometryStateStyle;\n  annotationSpecs: AnnotationSpec[];\n  chartId: string;\n  zIndex: number;\n  hoveredAnnotationIds: string[];\n  clickable: boolean;\n}\n\ninterface AnnotationsOwnProps {\n  getChartContainerRef: BackwardRef;\n  chartAreaRef: RefObject<HTMLCanvasElement>;\n}\n\ntype AnnotationsProps = AnnotationsDispatchProps & AnnotationsStateProps & AnnotationsOwnProps;\n\nfunction renderAnnotationLineMarkers(\n  chartAreaRef: RefObject<HTMLCanvasElement>,\n  chartDimensions: Dimensions,\n  annotationLines: AnnotationLineProps[],\n  onDOMElementEnter: typeof onDOMElementEnterAction,\n  onDOMElementLeave: typeof onDOMElementLeaveAction,\n  hoveredIds: string[],\n  sharedStyle: SharedGeometryStateStyle,\n  clickable: boolean,\n  animations?: AnnotationAnimationConfig[],\n) {\n  const getHoverParams = getAnnotationHoverParamsFn(hoveredIds, sharedStyle, animations);\n  return annotationLines.reduce<JSX.Element[]>((acc, { markers, ...props }: AnnotationLineProps) => {\n    if (!markers[0]) return acc;\n\n    acc.push(\n      <LineMarker\n        {...props}\n        marker={markers[0]}\n        key={`annotation-${props.id}`}\n        chartAreaRef={chartAreaRef}\n        chartDimensions={chartDimensions}\n        onDOMElementEnter={onDOMElementEnter}\n        onDOMElementLeave={onDOMElementLeave}\n        onDOMElementClick={onDOMElementClick}\n        clickable={clickable}\n        getHoverParams={getHoverParams}\n      />,\n    );\n\n    return acc;\n  }, []);\n}\nconst AnnotationsComponent = ({\n  tooltipState,\n  isChartEmpty,\n  chartDimensions,\n  annotationSpecs,\n  annotationDimensions,\n  getChartContainerRef,\n  chartAreaRef,\n  chartId,\n  zIndex,\n  onPointerMove,\n  onDOMElementEnter,\n  onDOMElementLeave,\n  clickable,\n  hoveredAnnotationIds,\n  sharedStyle,\n}: AnnotationsProps) => {\n  const renderAnnotationMarkers = useCallback((): JSX.Element[] => {\n    const markers: JSX.Element[] = [];\n    annotationDimensions.forEach((dimensions: AnnotationDimensions, id: AnnotationId) => {\n      const annotationSpec = getSpecsById<AnnotationSpec>(annotationSpecs, id);\n      if (!annotationSpec) {\n        return;\n      }\n\n      if (isLineAnnotation(annotationSpec)) {\n        const annotationLines = dimensions as AnnotationLineProps[];\n        const lineMarkers = renderAnnotationLineMarkers(\n          chartAreaRef,\n          chartDimensions,\n          annotationLines,\n          onDOMElementEnter,\n          onDOMElementLeave,\n          hoveredAnnotationIds,\n          sharedStyle,\n          clickable,\n          annotationSpec.animations,\n        );\n        lineMarkers.forEach((m) => markers.push(m));\n      }\n    });\n\n    return markers;\n  }, [\n    annotationDimensions,\n    annotationSpecs,\n    chartAreaRef,\n    chartDimensions,\n    onDOMElementEnter,\n    onDOMElementLeave,\n    hoveredAnnotationIds,\n    sharedStyle,\n    clickable,\n  ]);\n\n  const onScroll = useCallback(() => {\n    onPointerMove({ x: -1, y: -1 }, Date.now());\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  if (isChartEmpty) {\n    return null;\n  }\n\n  return (\n    <>\n      {renderAnnotationMarkers()}\n      <AnnotationTooltip\n        chartId={chartId}\n        zIndex={zIndex}\n        state={tooltipState}\n        chartRef={getChartContainerRef()}\n        onScroll={onScroll}\n      />\n    </>\n  );\n};\n\nAnnotationsComponent.displayName = 'Annotations';\n\nconst mapDispatchToProps = (dispatch: Dispatch): AnnotationsDispatchProps =>\n  bindActionCreators(\n    {\n      onPointerMove: onPointerMoveAction,\n      onDOMElementLeave: onDOMElementLeaveAction,\n      onDOMElementEnter: onDOMElementEnterAction,\n      onDOMElementClick: onDOMElementClickAction,\n    },\n    dispatch,\n  );\n\nconst mapStateToProps = (state: GlobalChartState): AnnotationsStateProps => {\n  const { zIndex, chartId } = state;\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      isChartEmpty: true,\n      chartDimensions: { top: 0, left: 0, width: 0, height: 0 },\n      sharedStyle: LIGHT_THEME.sharedStyle,\n      annotationDimensions: new Map(),\n      annotationSpecs: [],\n      tooltipState: null,\n      chartId,\n      zIndex,\n      hoveredAnnotationIds: [],\n      clickable: false,\n    };\n  }\n  return {\n    isChartEmpty: isChartEmptySelector(state),\n    chartDimensions: computeChartDimensionsSelector(state).chartDimensions,\n    sharedStyle: getChartThemeSelector(state).sharedStyle,\n    annotationDimensions: computeAnnotationDimensionsSelector(state),\n    annotationSpecs: getAnnotationSpecsSelector(state),\n    tooltipState: getAnnotationTooltipStateSelector(state),\n    chartId,\n    zIndex,\n    hoveredAnnotationIds: getHighlightedAnnotationIdsSelector(state),\n    clickable: Boolean(getSettingsSpecSelector(state).onAnnotationClick),\n  };\n};\n\n/** @internal */\nexport const Annotations = connect(mapStateToProps, mapDispatchToProps)(AnnotationsComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport { Annotations } from './annotations';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { createPopper, Instance } from '@popperjs/core';\nimport React, { RefObject, useRef, useEffect, useCallback, CSSProperties } from 'react';\n\nimport { DEFAULT_CSS_CURSOR } from '../../../../../common/constants';\nimport {\n  DOMElementType,\n  onDOMElementEnter as onDOMElementEnterAction,\n  onDOMElementLeave as onDOMElementLeaveAction,\n  onDOMElementClick as onDOMElementClickAction,\n} from '../../../../../state/actions/dom_element';\nimport { Position, renderWithProps } from '../../../../../utils/common';\nimport { Dimensions } from '../../../../../utils/dimensions';\nimport { AnnotationLineProps } from '../../../annotations/line/types';\nimport { AnimationOptions } from '../../canvas/animations/animation';\nimport { GetAnnotationParamsFn } from '../../common/utils';\n\ntype LineMarkerProps = Pick<AnnotationLineProps, 'id' | 'specId' | 'datum' | 'panel'> & {\n  marker: AnnotationLineProps['markers'][number];\n  chartAreaRef: RefObject<HTMLCanvasElement>;\n  chartDimensions: Dimensions;\n  onDOMElementEnter: typeof onDOMElementEnterAction;\n  onDOMElementLeave: typeof onDOMElementLeaveAction;\n  onDOMElementClick: typeof onDOMElementClickAction;\n  clickable: boolean;\n  getHoverParams: GetAnnotationParamsFn;\n};\n\nconst MARKER_TRANSFORMS = {\n  [Position.Right]: 'translate(0%, -50%)',\n  [Position.Left]: 'translate(-100%, -50%)',\n  [Position.Top]: 'translate(-50%, -100%)',\n  [Position.Bottom]: 'translate(-50%, 0%)',\n};\n\nfunction getMarkerCentredTransform(alignment: Position, hasMarkerDimensions: boolean): string | undefined {\n  return hasMarkerDimensions ? undefined : MARKER_TRANSFORMS[alignment];\n}\n\n/**\n * LineMarker component used to display line annotation markers\n * @internal\n */\nexport function LineMarker({\n  id,\n  specId,\n  datum,\n  panel,\n  marker: { icon, body, color, position, alignment, dimension },\n  chartAreaRef,\n  chartDimensions,\n  onDOMElementEnter,\n  onDOMElementLeave,\n  onDOMElementClick,\n  clickable,\n  getHoverParams,\n}: LineMarkerProps) {\n  const { style, options } = getHoverParams(id);\n  const iconRef = useRef<HTMLDivElement | null>(null);\n  const testRef = useRef<HTMLDivElement | null>(null);\n  const popper = useRef<Instance | null>(null);\n  const markerStyle: CSSProperties = {\n    ...style,\n    ...getAnimatedStyles(options, style),\n    color,\n    top: chartDimensions.top + position.top + panel.top,\n    left: chartDimensions.left + position.left + panel.left,\n    cursor: clickable ? 'pointer' : DEFAULT_CSS_CURSOR,\n  };\n\n  const transform = { transform: getMarkerCentredTransform(alignment, Boolean(dimension)) };\n  const setPopper = useCallback(() => {\n    if (!iconRef.current || !testRef.current) return;\n\n    popper.current = createPopper(iconRef.current, testRef.current, {\n      strategy: 'absolute',\n      placement: alignment,\n      modifiers: [\n        {\n          name: 'offset',\n          options: {\n            offset: [0, 0],\n          },\n        },\n        {\n          name: 'preventOverflow',\n          options: {\n            boundary: chartAreaRef.current,\n          },\n        },\n        {\n          name: 'flip',\n          options: {\n            // prevents default flip modifier\n            fallbackPlacements: [],\n          },\n        },\n      ],\n    });\n  }, [chartAreaRef, alignment]);\n\n  useEffect(() => {\n    if (!popper.current && body) {\n      setPopper();\n    }\n\n    return () => {\n      popper?.current?.destroy?.();\n      popper.current = null;\n    };\n  }, [setPopper, body]);\n\n  void popper?.current?.update?.();\n\n  // want it to be tabbable if interactive if there is a click handler\n  return clickable ? (\n    <button\n      className=\"echAnnotation__marker\"\n      onMouseEnter={() => {\n        onDOMElementEnter({\n          createdBySpecId: specId,\n          id,\n          type: DOMElementType.LineAnnotationMarker,\n          datum,\n        });\n      }}\n      onMouseLeave={onDOMElementLeave}\n      onClick={onDOMElementClick}\n      style={{ ...markerStyle, ...transform }}\n      type=\"button\"\n    >\n      <div ref={iconRef} className=\"echAnnotation__icon\">\n        {renderWithProps(icon, datum)}\n      </div>\n      {body && (\n        <div ref={testRef} className=\"echAnnotation__body\">\n          {renderWithProps(body, datum)}\n        </div>\n      )}\n    </button>\n  ) : (\n    <div\n      className=\"echAnnotation__marker\"\n      onMouseEnter={() => {\n        onDOMElementEnter({\n          createdBySpecId: specId,\n          id,\n          type: DOMElementType.LineAnnotationMarker,\n          datum,\n        });\n      }}\n      onMouseLeave={onDOMElementLeave}\n      style={{ ...markerStyle, ...transform }}\n    >\n      <div ref={iconRef} className=\"echAnnotation__icon\">\n        {renderWithProps(icon, datum)}\n      </div>\n      {body && (\n        <div ref={testRef} className=\"echAnnotation__body\">\n          {renderWithProps(body, datum)}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction getAnimatedStyles(\n  { duration, delay, timeFunction, snapValues = [], enabled }: AnimationOptions,\n  { opacity }: CSSProperties,\n): CSSProperties {\n  if (!enabled || (typeof opacity === 'number' && snapValues.includes(opacity))) return {};\n  return {\n    transitionDuration: `${duration}ms`,\n    transitionDelay: `${delay}ms`,\n    transitionProperty: 'opacity',\n    transitionTimingFunction: timeFunction,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { useCallback } from 'react';\n\nimport { TooltipDivider, TooltipHeader } from '../../../../../components/tooltip';\nimport { renderWithProps } from '../../../../../utils/common';\nimport { AnnotationType, LineAnnotationDatum, RectAnnotationDatum } from '../../../../specs';\nimport { AnnotationTooltipState } from '../../../annotations/types';\n\n/** @internal */\nexport const TooltipContent = ({\n  annotationType,\n  datum,\n  customTooltip: CustomTooltip,\n  customTooltipDetails,\n}: AnnotationTooltipState) => {\n  const renderLine = useCallback(() => {\n    const { details, dataValue, header = dataValue.toString() } = datum as LineAnnotationDatum;\n    return (\n      <>\n        <TooltipHeader>{header}</TooltipHeader>\n        <TooltipDivider />\n        <div className=\"echAnnotation__details\">\n          {customTooltipDetails ? renderWithProps(customTooltipDetails, { details }) : details}\n        </div>\n      </>\n    );\n  }, [datum, customTooltipDetails]);\n\n  const renderRect = useCallback(() => {\n    const { details } = datum as RectAnnotationDatum;\n    const tooltipContent = customTooltipDetails ? renderWithProps(customTooltipDetails, { details }) : details;\n    if (!tooltipContent) {\n      return null;\n    }\n\n    return <div className=\"echAnnotation__details\">{tooltipContent}</div>;\n  }, [datum, customTooltipDetails]);\n\n  if (CustomTooltip) {\n    const { details } = datum;\n    if ('header' in datum) {\n      return <CustomTooltip details={details} header={datum.header} datum={datum} />;\n    }\n    return <CustomTooltip details={details} datum={datum} />;\n  }\n\n  switch (annotationType) {\n    case AnnotationType.Line: {\n      return renderLine();\n    }\n    case AnnotationType.Rectangle: {\n      return renderRect();\n    }\n    default:\n      return null;\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Rect } from '../../../../geoms/types';\nimport { getTooltipType } from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState, TooltipInteractionState } from '../../../../state/chart_state';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\nimport { getInitialTooltipState } from '../../../../state/utils';\nimport { Rotation } from '../../../../utils/common';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { getCursorBandPositionSelector } from '../../state/selectors/get_cursor_band';\n\ninterface CursorBandProps {\n  theme: Theme;\n  isBrushing: boolean;\n  chartRotation: Rotation;\n  cursorPosition?: Rect;\n  tooltipType: TooltipType;\n  fromExternalEvent?: boolean;\n  tooltipState: TooltipInteractionState;\n}\n\nfunction canRenderBand(type: TooltipType, pinned: boolean, visible: boolean, fromExternalEvent?: boolean) {\n  return (\n    pinned || (visible && (type === TooltipType.Crosshairs || type === TooltipType.VerticalCursor || fromExternalEvent))\n  );\n}\n\nclass CursorBandComponent extends React.Component<CursorBandProps> {\n  static displayName = 'CursorBand';\n\n  render() {\n    const {\n      theme: {\n        crosshair: { band },\n      },\n      isBrushing,\n      cursorPosition,\n      tooltipType,\n      fromExternalEvent,\n      tooltipState: { pinned },\n    } = this.props;\n    const isBand = (cursorPosition?.width ?? 0) > 0 && (cursorPosition?.height ?? 0) > 0;\n    if (\n      isBrushing ||\n      !isBand ||\n      !cursorPosition ||\n      !canRenderBand(tooltipType, pinned, band.visible, fromExternalEvent)\n    ) {\n      return null;\n    }\n    const { x, y, width, height } = cursorPosition;\n    const { fill } = band;\n    return (\n      <svg className=\"echCrosshair__cursor\" width=\"100%\" height=\"100%\">\n        <rect {...{ x, y, width, height, fill }} />\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): CursorBandProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      isBrushing: false,\n      theme: LIGHT_THEME,\n      chartRotation: 0,\n      tooltipType: TooltipType.None,\n      tooltipState: getInitialTooltipState(),\n    };\n  }\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const cursorBandPosition = getCursorBandPositionSelector(state);\n  const fromExternalEvent = cursorBandPosition?.fromExternalEvent;\n  const tooltipType = getTooltipType(tooltip, settings, fromExternalEvent);\n\n  return {\n    isBrushing: isBrushingSelector(state),\n    theme: getChartThemeSelector(state),\n    chartRotation: getChartRotationSelector(state),\n    cursorPosition: cursorBandPosition,\n    tooltipType,\n    fromExternalEvent,\n    tooltipState: getTooltipInteractionState(state),\n  };\n};\n\n/** @internal */\nexport const CursorBand = connect(mapStateToProps)(CursorBandComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Line } from '../../../../geoms/types';\nimport { getTooltipType } from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { Rotation } from '../../../../utils/common';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { getCursorBandPositionSelector } from '../../state/selectors/get_cursor_band';\nimport { getCursorLinePositionSelector } from '../../state/selectors/get_cursor_line';\n\ninterface CursorCrossLineProps {\n  theme: Theme;\n  chartRotation: Rotation;\n  cursorCrossLinePosition?: Line;\n  tooltipType: TooltipType;\n}\n\nfunction canRenderHelpLine(type: TooltipType, visible: boolean) {\n  return visible && type === TooltipType.Crosshairs;\n}\n\nclass CursorCrossLineComponent extends React.Component<CursorCrossLineProps> {\n  static displayName = 'CursorCrossLine';\n\n  render() {\n    const {\n      theme: {\n        crosshair: { crossLine },\n      },\n      cursorCrossLinePosition,\n      tooltipType,\n    } = this.props;\n\n    if (!cursorCrossLinePosition || !canRenderHelpLine(tooltipType, crossLine.visible)) {\n      return null;\n    }\n\n    const { strokeWidth, stroke, dash } = crossLine;\n    const style = {\n      strokeWidth,\n      stroke,\n      strokeDasharray: (dash ?? []).join(' '),\n    };\n\n    return (\n      <svg className=\"echCrosshair__crossLine\" width=\"100%\" height=\"100%\">\n        <line {...cursorCrossLinePosition} {...style} />\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): CursorCrossLineProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      theme: LIGHT_THEME,\n      chartRotation: 0,\n      tooltipType: TooltipType.None,\n    };\n  }\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const cursorBandPosition = getCursorBandPositionSelector(state);\n  const fromExternalEvent = cursorBandPosition?.fromExternalEvent;\n  const tooltipType = getTooltipType(tooltip, settings, fromExternalEvent);\n\n  return {\n    theme: getChartThemeSelector(state),\n    chartRotation: getChartRotationSelector(state),\n    cursorCrossLinePosition: getCursorLinePositionSelector(state),\n    tooltipType,\n  };\n};\n\n/** @internal */\nexport const CursorCrossLine = connect(mapStateToProps)(CursorCrossLineComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Rect } from '../../../../geoms/types';\nimport { getTooltipType } from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState, TooltipInteractionState } from '../../../../state/chart_state';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\nimport { getInitialTooltipState } from '../../../../state/utils';\nimport { Rotation } from '../../../../utils/common';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { Theme } from '../../../../utils/themes/theme';\nimport { getCursorBandPositionSelector } from '../../state/selectors/get_cursor_band';\n\ninterface CursorLineProps {\n  theme: Theme;\n  isBrushing: boolean;\n  chartRotation: Rotation;\n  cursorPosition?: Rect;\n  tooltipType: TooltipType;\n  fromExternalEvent?: boolean;\n  isLine: boolean;\n  tooltipState: TooltipInteractionState;\n}\n\nfunction canRenderBand(type: TooltipType, pinned: boolean, visible: boolean, fromExternalEvent?: boolean) {\n  return (\n    pinned || (visible && (type === TooltipType.Crosshairs || type === TooltipType.VerticalCursor || fromExternalEvent))\n  );\n}\n\nclass CursorLineComponent extends React.Component<CursorLineProps> {\n  static displayName = 'CursorLine';\n\n  render() {\n    const {\n      theme: {\n        crosshair: { band, line },\n      },\n      isBrushing,\n      cursorPosition,\n      tooltipType,\n      fromExternalEvent,\n      isLine,\n      tooltipState: { pinned },\n    } = this.props;\n\n    if (\n      isBrushing ||\n      !cursorPosition ||\n      !canRenderBand(tooltipType, pinned, band.visible, fromExternalEvent) ||\n      !isLine\n    ) {\n      return null;\n    }\n    const { x, y, width, height } = cursorPosition;\n    const { strokeWidth, stroke, dash } = line;\n    const strokeDasharray = (dash ?? []).join(' ');\n    return (\n      <svg className=\"echCrosshair__cursor\" width=\"100%\" height=\"100%\">\n        <line {...{ x1: x, x2: x + width, y1: y, y2: y + height, strokeWidth, stroke, strokeDasharray }} />\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): CursorLineProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      isBrushing: false,\n      theme: LIGHT_THEME,\n      chartRotation: 0,\n      tooltipType: TooltipType.None,\n      isLine: false,\n      tooltipState: getInitialTooltipState(),\n    };\n  }\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const cursorBandPosition = getCursorBandPositionSelector(state);\n  const fromExternalEvent = cursorBandPosition?.fromExternalEvent;\n  const tooltipType = getTooltipType(tooltip, settings, fromExternalEvent);\n  const isLine = cursorBandPosition?.width === 0 || cursorBandPosition?.height === 0;\n\n  return {\n    isBrushing: isBrushingSelector(state),\n    theme: getChartThemeSelector(state),\n    chartRotation: getChartRotationSelector(state),\n    cursorPosition: cursorBandPosition,\n    tooltipType,\n    fromExternalEvent,\n    isLine,\n    tooltipState: getTooltipInteractionState(state),\n  };\n};\n\n/** @internal */\nexport const CursorLine = connect(mapStateToProps)(CursorLineComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { RGBATupleToString } from '../../../../common/color_library_wrappers';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { InitStatus, getInternalIsInitializedSelector } from '../../../../state/selectors/get_internal_is_intialized';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\nimport { getColorFromVariant, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { isPointGeometry, IndexedGeometry, PointGeometry } from '../../../../utils/geometry';\nimport { LIGHT_THEME } from '../../../../utils/themes/light_theme';\nimport { HighlighterStyle } from '../../../../utils/themes/theme';\nimport { computeChartDimensionsSelector } from '../../state/selectors/compute_chart_dimensions';\nimport { computeChartTransformSelector } from '../../state/selectors/compute_chart_transform';\nimport { getHighlightedGeomsSelector } from '../../state/selectors/get_tooltip_values_highlighted_geoms';\nimport { Transform } from '../../state/utils/types';\nimport { computeChartTransform } from '../../state/utils/utils';\nimport { ShapeRendererFn } from '../shapes_paths';\n\ninterface HighlighterProps {\n  initialized: boolean;\n  chartId: string;\n  zIndex: number;\n  isBrushing: boolean;\n  highlightedGeometries: IndexedGeometry[];\n  chartTransform: Transform;\n  chartDimensions: Dimensions;\n  chartRotation: Rotation;\n  style: HighlighterStyle;\n}\n\nfunction getTransformForPanel(panel: Dimensions, rotation: Rotation, { left, top }: Pick<Dimensions, 'top' | 'left'>) {\n  const { x, y } = computeChartTransform(panel, rotation);\n  return `translate(${left + panel.left + x}, ${top + panel.top + y}) rotate(${rotation})`;\n}\n\nfunction renderPath(geom: PointGeometry, radius: number) {\n  // keep the highlighter radius to a minimum\n  const [shapeFn, rotate] = ShapeRendererFn[geom.style.shape];\n  return {\n    d: shapeFn(radius),\n    rotate,\n  };\n}\n\nclass HighlighterComponent extends React.Component<HighlighterProps> {\n  static displayName = 'Highlighter';\n\n  render() {\n    const { highlightedGeometries, chartDimensions, chartRotation, chartId, zIndex, isBrushing, style } = this.props;\n    if (isBrushing) return null;\n    const clipWidth = [90, -90].includes(chartRotation) ? chartDimensions.height : chartDimensions.width;\n    const clipHeight = [90, -90].includes(chartRotation) ? chartDimensions.width : chartDimensions.height;\n    const clipPathId = `echHighlighterClipPath__${chartId}`;\n    return (\n      <svg className=\"echHighlighter\" style={{ zIndex }}>\n        <defs>\n          <clipPath id={clipPathId}>\n            <rect x=\"0\" y=\"0\" width={clipWidth} height={clipHeight} />\n          </clipPath>\n        </defs>\n\n        {highlightedGeometries.map((geom, i) => {\n          const { panel } = geom;\n          const x = geom.x + geom.transform.x;\n          const y = geom.y + geom.transform.y;\n          const geomTransform = getTransformForPanel(panel, chartRotation, chartDimensions);\n\n          if (isPointGeometry(geom)) {\n            // using the stroke because the fill is always white on points\n            const fillColor = getColorFromVariant(RGBATupleToString(geom.style.stroke.color), style.point.fill);\n            const strokeColor = getColorFromVariant(RGBATupleToString(geom.style.stroke.color), style.point.stroke);\n\n            const radius = Math.max(geom.radius, style.point.radius);\n            const { d, rotate } = renderPath(geom, radius);\n            return (\n              <g\n                key={i}\n                transform={geomTransform}\n                clipPath={geom.value.mark !== null ? `url(#${clipPathId})` : undefined}\n              >\n                <path\n                  d={d}\n                  transform={`translate(${x}, ${y}) rotate(${rotate || 0})`}\n                  fill={fillColor}\n                  stroke={strokeColor}\n                  strokeWidth={style.point.strokeWidth}\n                  opacity={style.point.opacity}\n                />\n              </g>\n            );\n          }\n          return (\n            <rect\n              key={i}\n              x={x}\n              y={y}\n              width={geom.width}\n              height={geom.height}\n              transform={geomTransform}\n              className=\"echHighlighterOverlay__fill\"\n              clipPath={`url(#${clipPathId})`}\n            />\n          );\n        })}\n      </svg>\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): HighlighterProps => {\n  const { chartId, zIndex } = state;\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      initialized: false,\n      chartId,\n      zIndex,\n      isBrushing: false,\n      highlightedGeometries: [],\n      chartTransform: {\n        x: 0,\n        y: 0,\n        rotate: 0,\n      },\n      chartDimensions: { top: 0, left: 0, width: 0, height: 0 },\n      chartRotation: 0,\n      style: LIGHT_THEME.highlighter,\n    };\n  }\n\n  return {\n    initialized: true,\n    chartId,\n    zIndex,\n    isBrushing: isBrushingSelector(state),\n    highlightedGeometries: getHighlightedGeomsSelector(state),\n    chartTransform: computeChartTransformSelector(state),\n    chartDimensions: computeChartDimensionsSelector(state).chartDimensions,\n    chartRotation: getChartRotationSelector(state),\n    style: getChartThemeSelector(state).highlighter,\n  };\n};\n\n/** @internal */\nexport const Highlighter = connect(mapStateToProps)(HighlighterComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { degToRad } from '../../../utils/common';\nimport { PointShape, TextureShape } from '../../../utils/themes/theme';\n\n/** @internal */\nexport type SVGPath = string;\n\n/** @internal */\nexport type SVGPathFn = (radius: number) => SVGPath;\n\nconst cross: SVGPathFn = (r: number) => {\n  return `M ${-r} 0 L ${r} 0 M 0 ${r} L 0 ${-r}`;\n};\n\nconst triangle: SVGPathFn = (r: number) => {\n  const h = (r * Math.sqrt(3)) / 2;\n  const hr = r / 2;\n  return `M ${-h} ${hr} L ${h} ${hr} L 0 ${-r} Z`;\n};\n\n/**\n * Returns shape function based on rotation of square in degrees\n */\nconst square =\n  (rotation = 0): SVGPathFn =>\n  (r: number) => {\n    const d = degToRad(rotation);\n    const s = Math.abs(Math.cos(d) + Math.sin(d));\n    // scaled r to account for rotation;\n    const sr = s > 0 ? r / s : r;\n    return `M ${-sr} ${-sr} L ${-sr} ${sr} L ${sr} ${sr} L ${sr} ${-sr} Z`;\n  };\n\nconst circle: SVGPathFn = (r: number) => {\n  return `M ${-r} 0 a ${r},${r} 0 1,0 ${r * 2},0 a ${r},${r} 0 1,0 ${-r * 2},0`;\n};\n\nconst line: SVGPathFn = (r: number) => {\n  return `M 0 ${-r} l 0 ${r * 2}`;\n};\n\n/** @internal */\nexport const ShapeRendererFn: Record<PointShape, [SVGPathFn, number]> = {\n  [PointShape.Circle]: [circle, 0],\n  [PointShape.X]: [cross, 45],\n  [PointShape.Plus]: [cross, 0],\n  [PointShape.Diamond]: [square(45), 45],\n  [PointShape.Square]: [square(0), 0],\n  [PointShape.Triangle]: [triangle, 0],\n};\n\n/** @internal */\nexport const TextureRendererFn: Record<TextureShape, [SVGPathFn, number]> = {\n  ...ShapeRendererFn,\n  [TextureShape.Line]: [line, 0],\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { area } from 'd3-shape';\n\nimport { renderPoints } from './points';\nimport {\n  getClippedRanges,\n  getY0ScaledValueFn,\n  getY1ScaledValueFn,\n  getYDatumValueFn,\n  isYValueDefinedFn,\n  MarkSizeOptions,\n} from './utils';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { CurveType, getCurveFactory } from '../../../utils/curves';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { AreaGeometry } from '../../../utils/geometry';\nimport { AreaSeriesStyle } from '../../../utils/themes/theme';\nimport { IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport { DataSeries, DataSeriesDatum, getSeriesIdentifierFromDataSeries } from '../utils/series';\nimport { PointStyleAccessor } from '../utils/specs';\n\n/** @internal */\nexport function renderArea(\n  shift: number,\n  dataSeries: DataSeries,\n  xScale: ScaleBand | ScaleContinuous,\n  yScale: ScaleContinuous,\n  panel: Dimensions,\n  color: Color,\n  curve: CurveType,\n  isBandedSpec: boolean,\n  xScaleOffset: number,\n  style: AreaSeriesStyle,\n  markSizeOptions: MarkSizeOptions,\n  isStacked: boolean,\n  hasFit: boolean,\n  pointStyleAccessor?: PointStyleAccessor,\n): {\n  areaGeometry: AreaGeometry;\n  indexedGeometryMap: IndexedGeometryMap;\n} {\n  const y1Fn = getY1ScaledValueFn(yScale);\n  const y0Fn = getY0ScaledValueFn(yScale);\n  const definedFn = isYValueDefinedFn(yScale, xScale);\n  const y1DatumAccessor = getYDatumValueFn();\n  const y0DatumAccessor = getYDatumValueFn('y0');\n  const pathGenerator = area<DataSeriesDatum>()\n    .x(({ x }) => xScale.scale(x) - xScaleOffset)\n    .y1(y1Fn)\n    .y0(y0Fn)\n    .defined((datum) => {\n      return definedFn(datum, y1DatumAccessor) && (isBandedSpec ? definedFn(datum, y0DatumAccessor) : true);\n    })\n    .curve(getCurveFactory(curve));\n\n  // TODO we can probably avoid this function call if no fit function is applied.\n  const clippedRanges = getClippedRanges(dataSeries.data, xScale, xScaleOffset);\n\n  const lines: string[] = [];\n  const y0Line = isBandedSpec && pathGenerator.lineY0()(dataSeries.data);\n  const y1Line = pathGenerator.lineY1()(dataSeries.data);\n  if (y1Line) lines.push(y1Line);\n  if (y0Line) lines.push(y0Line);\n\n  const { pointGeometries, indexedGeometryMap } = renderPoints(\n    shift - xScaleOffset,\n    dataSeries,\n    xScale,\n    yScale,\n    panel,\n    color,\n    style.point,\n    style.isolatedPoint,\n    isBandedSpec,\n    markSizeOptions,\n    false,\n    true,\n    pointStyleAccessor,\n  );\n\n  const areaGeometry: AreaGeometry = {\n    area: pathGenerator(dataSeries.data) || '',\n    lines,\n    points: pointGeometries,\n    color,\n    transform: {\n      y: 0,\n      x: shift,\n    },\n    seriesIdentifier: getSeriesIdentifierFromDataSeries(dataSeries),\n    style,\n    isStacked,\n    clippedRanges,\n    shouldClip: hasFit,\n  };\n  return {\n    areaGeometry,\n    indexedGeometryMap,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getDatumYValue } from './points';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { ScaleType } from '../../../scales/constants';\nimport { TextMeasure } from '../../../utils/bbox/canvas_text_bbox_calculator';\nimport { clamp, mergePartial } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { BandedAccessorType, BarGeometry } from '../../../utils/geometry';\nimport { BarSeriesStyle, DisplayValueStyle } from '../../../utils/themes/theme';\nimport { IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport {\n  DataSeries,\n  DataSeriesDatum,\n  getSeriesIdentifierFromDataSeries,\n  XYChartSeriesIdentifier,\n} from '../utils/series';\nimport { BarStyleAccessor, DisplayValueSpec, LabelOverflowConstraint, StackMode } from '../utils/specs';\n\nconst PADDING = 1; // default padding for now\nconst FONT_SIZE_FACTOR = 0.7; // Take 70% of space for the label text\n\ntype BarTuple = {\n  barGeometries: BarGeometry[];\n  indexedGeometryMap: IndexedGeometryMap;\n};\n\n/** @internal */\nexport function renderBars(\n  measureText: TextMeasure,\n  orderIndex: number,\n  dataSeries: DataSeries,\n  xScale: ScaleContinuous | ScaleBand,\n  yScale: ScaleContinuous,\n  panel: Dimensions,\n  chartRotation: number,\n  minBarHeight: number,\n  color: Color,\n  sharedSeriesStyle: BarSeriesStyle,\n  displayValueSettings?: DisplayValueSpec,\n  styleAccessor?: BarStyleAccessor,\n  stackMode?: StackMode,\n): BarTuple {\n  const { fontSize, fontFamily } = sharedSeriesStyle.displayValue;\n  const initialBarTuple: BarTuple = { barGeometries: [], indexedGeometryMap: new IndexedGeometryMap() } as BarTuple;\n  const isLogY = yScale.type === ScaleType.Log;\n  const isInvertedY = yScale.isInverted;\n  return dataSeries.data.reduce((barTuple: BarTuple, datum) => {\n    const xScaled = xScale.scale(datum.x);\n    if (!xScale.isValueInDomain(datum.x) || Number.isNaN(xScaled)) {\n      return barTuple; // don't create a bar if not within the xScale domain\n    }\n    const { barGeometries, indexedGeometryMap } = barTuple;\n    const { y0, y1, initialY1, filled } = datum;\n    const rawY = isLogY && (y1 === 0 || y1 === null) ? yScale.range[0] : yScale.scale(y1);\n\n    const y0Scaled = isLogY\n      ? y0 === 0 || y0 === null\n        ? yScale.range[isInvertedY ? 1 : 0]\n        : yScale.scale(y0)\n      : yScale.scale(y0 === null ? 0 : y0);\n\n    const finiteHeight = y0Scaled - rawY || 0;\n    const absHeight = Math.abs(finiteHeight);\n    const height = absHeight === 0 ? absHeight : Math.max(minBarHeight, absHeight); // extend nonzero bars\n    const heightExtension = height - absHeight;\n    const isUpsideDown = finiteHeight < 0;\n    const finiteY = Number.isNaN(y0Scaled + rawY) ? 0 : rawY;\n    const y = isUpsideDown ? finiteY - height + heightExtension : finiteY - heightExtension;\n\n    const seriesIdentifier: XYChartSeriesIdentifier = getSeriesIdentifierFromDataSeries(dataSeries);\n\n    const seriesStyle = getBarStyleOverrides(datum, seriesIdentifier, sharedSeriesStyle, styleAccessor);\n\n    const maxPixelWidth = clamp(seriesStyle.rect.widthRatio ?? 1, 0, 1) * xScale.bandwidth;\n    const minPixelWidth = clamp(seriesStyle.rect.widthPixel ?? 0, 0, maxPixelWidth);\n\n    const width = clamp(seriesStyle.rect.widthPixel ?? xScale.bandwidth, minPixelWidth, maxPixelWidth);\n    const x = xScaled + xScale.bandwidth * orderIndex + xScale.bandwidth / 2 - width / 2;\n\n    const y1Value = getDatumYValue(datum, false, false, stackMode);\n    const formattedDisplayValue = displayValueSettings?.valueFormatter?.(y1Value);\n\n    // only show displayValue for even bars if showOverlappingValue\n    const displayValueText =\n      displayValueSettings?.isAlternatingValueLabel && barGeometries.length % 2 ? undefined : formattedDisplayValue;\n\n    const { displayValueWidth, fixedFontScale } = computeBoxWidth(displayValueText ?? '', {\n      padding: PADDING,\n      fontSize,\n      fontFamily,\n      measureText,\n    });\n\n    const isHorizontalRotation = chartRotation % 180 === 0;\n    // Pick the right side of the label's box to use as factor reference\n    const referenceWidth = Math.max(isHorizontalRotation ? displayValueWidth : fixedFontScale, 1);\n\n    const textScalingFactor = getFinalFontScalingFactor(\n      (width * FONT_SIZE_FACTOR) / referenceWidth,\n      fixedFontScale,\n      fontSize,\n    );\n    const overflowConstraints: Set<LabelOverflowConstraint> = new Set(\n      displayValueSettings?.overflowConstraints ?? [\n        LabelOverflowConstraint.ChartEdges,\n        LabelOverflowConstraint.BarGeometry,\n      ],\n    );\n\n    // Based on rotation scale the width of the text box\n    const bboxWidthFactor = isHorizontalRotation ? textScalingFactor : 1;\n\n    const displayValue: BarGeometry['displayValue'] | undefined =\n      displayValueText && displayValueSettings?.showValueLabel\n        ? {\n            fontScale: textScalingFactor,\n            fontSize: fixedFontScale,\n            text: displayValueText,\n            width: bboxWidthFactor * displayValueWidth,\n            height: textScalingFactor * fixedFontScale,\n            overflowConstraints,\n          }\n        : undefined;\n\n    const barGeometry: BarGeometry = {\n      displayValue,\n      x,\n      y,\n      transform: { x: 0, y: 0 },\n      width,\n      height,\n      color,\n      value: { x: datum.x, y: y1Value, mark: null, accessor: BandedAccessorType.Y1, datum: datum.datum },\n      seriesIdentifier,\n      seriesStyle,\n      panel,\n    };\n    indexedGeometryMap.set(barGeometry);\n\n    if (y1 !== null && initialY1 !== null && filled?.y1 === undefined) {\n      barGeometries.push(barGeometry);\n    }\n\n    return barTuple;\n  }, initialBarTuple);\n}\n\n/**\n * Workout the text box size and fixedFontSize based on a collection of options\n * @internal\n */\nfunction computeBoxWidth(\n  text: string,\n  {\n    padding,\n    fontSize,\n    fontFamily,\n    measureText,\n  }: {\n    padding: number;\n    fontSize: number | { min: number; max: number };\n    fontFamily: string;\n    measureText: TextMeasure;\n  },\n): { fixedFontScale: number; displayValueWidth: number } {\n  const fixedFontScale = Math.max(typeof fontSize === 'number' ? fontSize : fontSize.min, 1);\n\n  const computedDisplayValueWidth = measureText(\n    text,\n    { fontFamily, fontWeight: 'normal', fontStyle: 'normal', fontVariant: 'normal' },\n    fixedFontScale,\n  ).width;\n  if (typeof fontSize !== 'number') {\n    return {\n      fixedFontScale,\n      displayValueWidth: computedDisplayValueWidth + padding,\n    };\n  }\n  return {\n    fixedFontScale,\n    displayValueWidth: computedDisplayValueWidth,\n  };\n}\n\n/**\n * Returns a safe scaling factor for label text for fixed or range size inputs\n * @internal\n */\nfunction getFinalFontScalingFactor(\n  scale: number,\n  fixedFontSize: number,\n  limits: DisplayValueStyle['fontSize'],\n): number {\n  if (typeof limits === 'number') {\n    // it's a fixed size, so it's always ok\n    return 1;\n  }\n  const finalFontSize = scale * fixedFontSize;\n  if (finalFontSize > limits.max) {\n    return limits.max / fixedFontSize;\n  }\n  if (finalFontSize < limits.min) {\n    // it's technically 1, but keep it generic in case the fixedFontSize changes\n    return limits.min / fixedFontSize;\n  }\n  return scale;\n}\n\n/** @internal */\nexport function getBarStyleOverrides(\n  datum: DataSeriesDatum,\n  seriesIdentifier: XYChartSeriesIdentifier,\n  seriesStyle: BarSeriesStyle,\n  styleAccessor?: BarStyleAccessor,\n): BarSeriesStyle {\n  const styleOverride = styleAccessor && styleAccessor(datum, seriesIdentifier);\n\n  if (!styleOverride) {\n    return seriesStyle;\n  }\n\n  if (typeof styleOverride === 'string') {\n    return { ...seriesStyle, rect: { ...seriesStyle.rect, fill: styleOverride } };\n  }\n\n  return mergePartial(seriesStyle, styleOverride);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { renderPoints } from './points';\nimport { MarkSizeOptions } from './utils';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { BubbleGeometry } from '../../../utils/geometry';\nimport { BubbleSeriesStyle } from '../../../utils/themes/theme';\nimport { IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport { DataSeries, getSeriesIdentifierFromDataSeries } from '../utils/series';\nimport { PointStyleAccessor } from '../utils/specs';\n\n/** @internal */\nexport function renderBubble(\n  shift: number,\n  dataSeries: DataSeries,\n  xScale: ScaleContinuous | ScaleBand,\n  yScale: ScaleContinuous,\n  color: Color,\n  panel: Dimensions,\n  hasY0Accessors: boolean,\n  xScaleOffset: number,\n  seriesStyle: BubbleSeriesStyle,\n  markSizeOptions: MarkSizeOptions,\n  isMixedChart: boolean,\n  pointStyleAccessor?: PointStyleAccessor,\n): {\n  bubbleGeometry: BubbleGeometry;\n  indexedGeometryMap: IndexedGeometryMap;\n} {\n  const { pointGeometries, indexedGeometryMap } = renderPoints(\n    shift - xScaleOffset,\n    dataSeries,\n    xScale,\n    yScale,\n    panel,\n    color,\n    seriesStyle.point,\n    // there is no concept of isolated point in bubble chart, so we mark it as invisible\n    { ...seriesStyle.point, visible: false },\n    hasY0Accessors,\n    markSizeOptions,\n    !isMixedChart,\n    // don't allow rendering of isolated points\n    false,\n    pointStyleAccessor,\n  );\n\n  const bubbleGeometry = {\n    points: pointGeometries,\n    color,\n    seriesIdentifier: getSeriesIdentifierFromDataSeries(dataSeries),\n    seriesPointStyle: seriesStyle.point,\n  };\n  return {\n    bubbleGeometry,\n    indexedGeometryMap,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { line } from 'd3-shape';\n\nimport { renderPoints } from './points';\nimport { getClippedRanges, getY1ScaledValueFn, getYDatumValueFn, isYValueDefinedFn, MarkSizeOptions } from './utils';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { CurveType, getCurveFactory } from '../../../utils/curves';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { LineGeometry } from '../../../utils/geometry';\nimport { LineSeriesStyle } from '../../../utils/themes/theme';\nimport { IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport { DataSeries, DataSeriesDatum, getSeriesIdentifierFromDataSeries } from '../utils/series';\nimport { PointStyleAccessor } from '../utils/specs';\n\n/** @internal */\nexport function renderLine(\n  shift: number,\n  dataSeries: DataSeries,\n  xScale: ScaleBand | ScaleContinuous,\n  yScale: ScaleContinuous,\n  panel: Dimensions,\n  color: Color,\n  curve: CurveType,\n  hasY0Accessors: boolean,\n  xScaleOffset: number,\n  seriesStyle: LineSeriesStyle,\n  markSizeOptions: MarkSizeOptions,\n  hasFit: boolean,\n  pointStyleAccessor?: PointStyleAccessor,\n): {\n  lineGeometry: LineGeometry;\n  indexedGeometryMap: IndexedGeometryMap;\n} {\n  const y1Fn = getY1ScaledValueFn(yScale);\n  const definedFn = isYValueDefinedFn(yScale, xScale);\n  const y1Accessor = getYDatumValueFn();\n\n  const pathGenerator = line<DataSeriesDatum>()\n    .x(({ x }) => xScale.scale(x) - xScaleOffset)\n    .y(y1Fn)\n    .defined((datum) => definedFn(datum, y1Accessor))\n    .curve(getCurveFactory(curve));\n\n  const { pointGeometries, indexedGeometryMap } = renderPoints(\n    shift - xScaleOffset,\n    dataSeries,\n    xScale,\n    yScale,\n    panel,\n    color,\n    seriesStyle.point,\n    seriesStyle.isolatedPoint,\n    hasY0Accessors,\n    markSizeOptions,\n    false,\n    true,\n    pointStyleAccessor,\n  );\n\n  // TODO we can probably avoid computing the clipped ranges if no fit function is applied.\n  const clippedRanges = getClippedRanges(dataSeries.data, xScale, xScaleOffset);\n\n  const lineGeometry = {\n    line: pathGenerator(dataSeries.data) || '',\n    points: pointGeometries,\n    color,\n    transform: {\n      x: shift,\n      y: 0,\n    },\n    seriesIdentifier: getSeriesIdentifierFromDataSeries(dataSeries),\n    style: seriesStyle,\n    clippedRanges,\n    shouldClip: hasFit,\n  };\n  return {\n    lineGeometry,\n    indexedGeometryMap,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RecursivePartial, mergePartial } from '../../../utils/common';\nimport { AreaSeriesStyle, LineSeriesStyle } from '../../../utils/themes/theme';\n\n/** @internal */\nexport function getLineSeriesStyles(\n  baseStyle: LineSeriesStyle,\n  seriesStyle?: RecursivePartial<LineSeriesStyle>,\n): LineSeriesStyle {\n  if (!seriesStyle) return baseStyle;\n\n  const isolatedPointStyleOverrides = mergePartial<LineSeriesStyle['isolatedPoint']>(\n    baseStyle.isolatedPoint,\n    seriesStyle.isolatedPoint,\n    undefined,\n    seriesStyle.point ? [seriesStyle.point] : [],\n  );\n\n  return mergePartial(\n    baseStyle,\n    {\n      isolatedPoint: {\n        ...isolatedPointStyleOverrides,\n        visible: seriesStyle?.isolatedPoint?.visible ?? baseStyle.isolatedPoint.visible,\n      },\n    },\n    undefined,\n    [seriesStyle],\n  );\n}\n\n/** @internal */\nexport function getAreaSeriesStyles(\n  baseStyle: AreaSeriesStyle,\n  seriesStyle?: RecursivePartial<AreaSeriesStyle>,\n): AreaSeriesStyle {\n  if (!seriesStyle) return baseStyle;\n\n  const isolatedPointStyleOverrides = mergePartial<AreaSeriesStyle['isolatedPoint']>(\n    baseStyle.isolatedPoint,\n    seriesStyle.isolatedPoint,\n    undefined,\n    seriesStyle.point ? [seriesStyle.point] : [],\n  );\n\n  return mergePartial(\n    baseStyle,\n    {\n      isolatedPoint: {\n        ...isolatedPointStyleOverrides,\n        visible: seriesStyle?.isolatedPoint?.visible ?? baseStyle.isolatedPoint.visible,\n      },\n    },\n    undefined,\n    [seriesStyle],\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { colorToRgba, OpacityFn, overrideOpacity } from '../../../common/color_library_wrappers';\nimport { getColorFromVariant, mergePartial } from '../../../utils/common';\nimport { PointGeometryStyle } from '../../../utils/geometry';\nimport { PointShape, PointStyle } from '../../../utils/themes/theme';\n\n/** @internal */\nexport function buildPointGeometryStyles(\n  color: string,\n  themePointStyle: PointStyle,\n  overrides?: Partial<PointStyle>,\n): PointGeometryStyle {\n  const pointStyle = mergePartial(themePointStyle, overrides);\n  const opacityFn: OpacityFn = (opacity) => opacity * pointStyle.opacity;\n  return {\n    fill: { color: overrideOpacity(colorToRgba(getColorFromVariant(color, pointStyle.fill)), opacityFn) },\n    stroke: {\n      color: overrideOpacity(colorToRgba(getColorFromVariant(color, pointStyle.stroke)), opacityFn),\n      width: pointStyle.strokeWidth,\n    },\n    shape: pointStyle.shape ?? PointShape.Circle,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { buildPointGeometryStyles } from './point_style';\nimport {\n  getY0ScaledValueFn,\n  getY1ScaledValueFn,\n  getYDatumValueFn,\n  isDatumFilled,\n  isYValueDefinedFn,\n  MarkSizeOptions,\n  YDefinedFn,\n} from './utils';\nimport { Color } from '../../../common/colors';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { isFiniteNumber, isNil } from '../../../utils/common';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { BandedAccessorType, PointGeometry } from '../../../utils/geometry';\nimport { PointStyle } from '../../../utils/themes/theme';\nimport { GeometryType, IndexedGeometryMap } from '../utils/indexed_geometry_map';\nimport {\n  DataSeries,\n  DataSeriesDatum,\n  FilledValues,\n  getSeriesIdentifierFromDataSeries,\n  XYChartSeriesIdentifier,\n} from '../utils/series';\nimport { PointStyleAccessor, StackMode } from '../utils/specs';\n\n/** @internal */\nexport function renderPoints(\n  shift: number,\n  dataSeries: DataSeries,\n  xScale: ScaleBand | ScaleContinuous,\n  yScale: ScaleContinuous,\n  panel: Dimensions,\n  color: Color,\n  pointStyle: PointStyle,\n  isolatedPointThemeStyle: PointStyle,\n  isBandChart: boolean,\n  markSizeOptions: MarkSizeOptions,\n  useSpatialIndex: boolean,\n  allowIsolated: boolean,\n  styleAccessor?: PointStyleAccessor,\n): {\n  pointGeometries: PointGeometry[];\n  indexedGeometryMap: IndexedGeometryMap;\n} {\n  const indexedGeometryMap = new IndexedGeometryMap();\n  const getRadius = markSizeOptions.enabled\n    ? getRadiusFn(dataSeries.data, pointStyle.strokeWidth, markSizeOptions.ratio)\n    : () => 0;\n  const geometryType = useSpatialIndex ? GeometryType.spatial : GeometryType.linear;\n\n  const y1Fn = getY1ScaledValueFn(yScale);\n  const y0Fn = getY0ScaledValueFn(yScale);\n  const yDefined = isYValueDefinedFn(yScale, xScale);\n\n  const pointGeometries = dataSeries.data.reduce((acc, datum, dataIndex) => {\n    const { x: xValue, mark } = datum;\n    const prev = dataSeries.data[dataIndex - 1];\n    const next = dataSeries.data[dataIndex + 1];\n    // don't create the point if not within the xScale domain\n    if (!xScale.isValueInDomain(xValue)) return acc;\n\n    // don't create the point if it that point was filled\n    const x = xScale.scale(xValue);\n\n    if (Number.isNaN(x)) return acc;\n\n    const points: PointGeometry[] = [];\n    const yDatumKeyNames: Array<keyof Omit<FilledValues, 'x'>> = isBandChart ? ['y0', 'y1'] : ['y1'];\n\n    yDatumKeyNames.forEach((yDatumKeyName, keyIndex) => {\n      const valueAccessor = getYDatumValueFn(yDatumKeyName);\n      const y = yDatumKeyName === 'y1' ? y1Fn(datum) : y0Fn(datum);\n      const originalY = getDatumYValue(datum, keyIndex === 0, isBandChart, dataSeries.stackMode);\n      const seriesIdentifier: XYChartSeriesIdentifier = getSeriesIdentifierFromDataSeries(dataSeries);\n      const styleOverrides = getPointStyleOverrides(datum, seriesIdentifier, styleAccessor);\n      const style = buildPointGeometryStyles(color, pointStyle, styleOverrides);\n      const isPointIsolated = allowIsolated && isIsolatedPoint(dataIndex, dataSeries.data.length, yDefined, prev, next);\n      const isolatedPointStyle = buildPointGeometryStyles(color, isolatedPointThemeStyle);\n      // if radius is defined with the mark, limit the minimum radius to the theme radius value\n      const radius = isPointIsolated\n        ? isolatedPointThemeStyle.radius\n        : markSizeOptions.enabled\n          ? Math.max(getRadius(mark), pointStyle.radius)\n          : styleOverrides?.radius ?? pointStyle.radius;\n\n      const pointGeometry: PointGeometry = {\n        x,\n        y: y === null ? NaN : y,\n        radius,\n        color,\n        style: isolatedPointThemeStyle.visible && isPointIsolated ? isolatedPointStyle : style,\n        value: {\n          x: xValue,\n          y: originalY,\n          mark,\n          accessor: isBandChart && keyIndex === 0 ? BandedAccessorType.Y0 : BandedAccessorType.Y1,\n          datum: datum.datum,\n        },\n        transform: {\n          x: shift,\n          y: 0,\n        },\n        seriesIdentifier,\n        panel,\n        isolated: isPointIsolated,\n      };\n      indexedGeometryMap.set(pointGeometry, geometryType);\n      // use the geometry only if the yDatum in contained in the current yScale domain\n      if (\n        isFiniteNumber(y) &&\n        yDefined(datum, valueAccessor) &&\n        yScale.isValueInDomain(valueAccessor(datum)) &&\n        !isDatumFilled(datum)\n      ) {\n        points.push(pointGeometry);\n      }\n    });\n    return [...acc, ...points];\n  }, [] as PointGeometry[]);\n  return {\n    pointGeometries,\n    indexedGeometryMap,\n  };\n}\n\n/** @internal */\nexport function getPointStyleOverrides(\n  datum: DataSeriesDatum,\n  seriesIdentifier: XYChartSeriesIdentifier,\n  pointStyleAccessor?: PointStyleAccessor,\n): Partial<PointStyle> | undefined {\n  const styleOverride = pointStyleAccessor && pointStyleAccessor(datum, seriesIdentifier);\n\n  if (!styleOverride) {\n    return;\n  }\n\n  if (typeof styleOverride === 'string') {\n    return {\n      stroke: styleOverride,\n    };\n  }\n\n  return styleOverride;\n}\n\n/**\n * Get the original/initial Y value from the datum\n * @param datum a DataSeriesDatum\n * @param lookingForY0 if we are interested in the y0 value, false for y1\n * @param isBandChart if the chart is a band chart\n * @param stackMode an optional stack mode\n * @internal\n */\nexport function getDatumYValue(\n  { y1, y0, initialY1, initialY0 }: DataSeriesDatum,\n  lookingForY0: boolean,\n  isBandChart: boolean,\n  stackMode?: StackMode,\n) {\n  if (isBandChart) {\n    // on band stacked charts in percentage mode, the values I'm looking for are the percentage value\n    // that are already computed and available on y0 and y1\n    // in all other cases for band charts, I want to get back the original/initial value of y0 and y1\n    // not the computed value\n    return stackMode === StackMode.Percentage ? (lookingForY0 ? y0 : y1) : lookingForY0 ? initialY0 : initialY1;\n  }\n  // if not a band chart get use the original/initial value in every case except for stack as percentage\n  // in this case, we should take the difference between the bottom position of the bar and the top position\n  // of the bar\n  return stackMode === StackMode.Percentage ? (isNil(y1) || isNil(initialY1) ? null : y1 - (y0 ?? 0)) : initialY1;\n}\n\n/**\n * Get radius function form ratio and min/max mark size\n *\n * @todo add continuous/non-stepped function\n *\n * @param  {DataSeriesDatum[]} data\n * @param  {number} lineWidth\n * @param  {number=50} markSizeRatio - 0 to 100\n * @internal\n */\nexport function getRadiusFn(\n  data: DataSeriesDatum[],\n  lineWidth: number,\n  markSizeRatio: number = 50,\n): (mark: number | null, defaultRadius?: number) => number {\n  if (data.length === 0) {\n    return () => 0;\n  }\n  const { min, max } = data.reduce(\n    (acc, { mark }) =>\n      mark === null\n        ? acc\n        : {\n            min: Math.min(acc.min, mark / 2),\n            max: Math.max(acc.max, mark / 2),\n          },\n    { min: Infinity, max: -Infinity },\n  );\n  const adjustedMarkSizeRatio = Math.min(Math.max(markSizeRatio, 0), 100);\n  const radiusStep = (max - min || max * 100) / Math.pow(adjustedMarkSizeRatio, 2);\n  return function getRadius(mark, defaultRadius = 0): number {\n    if (mark === null) {\n      return defaultRadius;\n    }\n    const circleRadius = (mark / 2 - min) / radiusStep;\n    const baseMagicNumber = 2;\n    return circleRadius ? Math.sqrt(circleRadius + baseMagicNumber) + lineWidth : lineWidth;\n  };\n}\n\nfunction yAccessorForIsolatedPointCheck(datum: DataSeriesDatum): number | null {\n  return datum.filled?.y1 ? null : datum.y1;\n}\n\nfunction isIsolatedPoint(\n  index: number,\n  length: number,\n  yDefined: YDefinedFn,\n  prev?: DataSeriesDatum,\n  next?: DataSeriesDatum,\n): boolean {\n  if (index === 0 && (isNil(next) || !yDefined(next, yAccessorForIsolatedPointCheck))) {\n    return true;\n  }\n  if (index === length - 1 && (isNil(prev) || !yDefined(prev, yAccessorForIsolatedPointCheck))) {\n    return true;\n  }\n  return (\n    (isNil(prev) || !yDefined(prev, yAccessorForIsolatedPointCheck)) &&\n    (isNil(next) || !yDefined(next, yAccessorForIsolatedPointCheck))\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendItem } from '../../../common/legend';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { isLogarithmicScale } from '../../../scales/types';\nimport { MarkBuffer } from '../../../specs';\nimport { getDistance } from '../../../utils/common';\nimport { BarGeometry, ClippedRanges, isPointGeometry, PointGeometry } from '../../../utils/geometry';\nimport { GeometryStateStyle, SharedGeometryStateStyle } from '../../../utils/themes/theme';\nimport { DataSeriesDatum, FilledValues, XYChartSeriesIdentifier } from '../utils/series';\n\n/** @internal */\nexport interface MarkSizeOptions {\n  enabled: boolean;\n  ratio?: number;\n}\n\n/**\n * Returns value of `y1` or `filled.y1` or null by default.\n * Passing a filled key (x, y1, y0) it will return that value or the filled one\n * @internal\n */\nexport function getYDatumValueFn(valueName: keyof Omit<FilledValues, 'x'> = 'y1') {\n  return (datum: DataSeriesDatum, returnFilled = true): number | null => {\n    const value = datum[valueName];\n    if (value !== null || !returnFilled) {\n      return value;\n    }\n    return datum.filled?.[valueName] ?? null;\n  };\n}\n\n/**\n *\n * @param param0\n * @internal\n */\nexport function isDatumFilled({ filled, initialY1 }: DataSeriesDatum) {\n  return filled?.x !== undefined || filled?.y1 !== undefined || initialY1 === null || initialY1 === undefined;\n}\n\n/**\n * Gets clipped ranges that have been fitted to values\n * @param dataset\n * @param xScale\n * @param xScaleOffset\n * @internal\n */\nexport function getClippedRanges(\n  dataset: DataSeriesDatum[],\n  xScale: ScaleBand | ScaleContinuous,\n  xScaleOffset: number,\n): ClippedRanges {\n  let firstNonNullX: number | null = null;\n  let hasNull = false;\n\n  const completeDatasetIsNull = dataset.every((datum) => isDatumFilled(datum));\n\n  if (completeDatasetIsNull) return [[xScale.range[0], xScale.range[1]]];\n\n  return dataset.reduce<ClippedRanges>((acc, data) => {\n    const xScaled = xScale.scale(data.x);\n    if (Number.isNaN(xScaled)) return acc;\n\n    const xValue = xScaled - xScaleOffset + xScale.bandwidth / 2;\n\n    if (isDatumFilled(data)) {\n      const endXValue = xScale.range[1] - xScale.bandwidth * (2 / 3);\n      if (firstNonNullX !== null && xValue === endXValue) {\n        acc.push([firstNonNullX, xValue]);\n      }\n      hasNull = true;\n    } else {\n      if (hasNull) {\n        if (firstNonNullX !== null) {\n          acc.push([firstNonNullX, xValue]);\n        } else {\n          acc.push([0, xValue]);\n        }\n        hasNull = false;\n      }\n\n      firstNonNullX = xValue;\n    }\n    return acc;\n  }, []);\n}\n\n/** @internal */\nexport function getGeometryStateStyle(\n  seriesIdentifier: XYChartSeriesIdentifier,\n  sharedGeometryStyle: SharedGeometryStateStyle,\n  highlightedLegendItem?: LegendItem,\n): GeometryStateStyle {\n  const { default: defaultStyles, highlighted, unhighlighted } = sharedGeometryStyle;\n\n  if (highlightedLegendItem) {\n    const isPartOfHighlightedSeries = highlightedLegendItem.seriesIdentifiers.some(\n      ({ key }) => key === seriesIdentifier.key,\n    );\n\n    return isPartOfHighlightedSeries ? highlighted : unhighlighted;\n  }\n\n  return defaultStyles;\n}\n\n/** @internal */\nexport function isPointOnGeometry(\n  xCoordinate: number,\n  yCoordinate: number,\n  indexedGeometry: BarGeometry | PointGeometry,\n  buffer: MarkBuffer,\n) {\n  const { x, y, transform } = indexedGeometry;\n  if (isPointGeometry(indexedGeometry)) {\n    const { radius } = indexedGeometry;\n    const distance = getDistance(\n      {\n        x: xCoordinate,\n        y: yCoordinate,\n      },\n      {\n        x: x + transform.x,\n        y: y + transform.y,\n      },\n    );\n\n    const radiusBuffer = typeof buffer === 'number' ? buffer : buffer(radius);\n\n    return distance <= radius + radiusBuffer;\n  }\n  const { width, height } = indexedGeometry;\n  return yCoordinate >= y && yCoordinate <= y + height && xCoordinate >= x && xCoordinate <= x + width;\n}\n\nconst getScaleTypeValueValidator = (yScale: ScaleContinuous): ((n: number) => boolean) => {\n  if (!isLogarithmicScale(yScale)) return () => true;\n  const domainPolarity = getDomainPolarity(yScale.domain);\n  return (yValue: number) => domainPolarity === Math.sign(yValue);\n};\n\n/**\n * The default zero baseline for area charts.\n */\nconst DEFAULT_ZERO_BASELINE = 0;\n\n/** @internal */\nexport type YDefinedFn = (datum: DataSeriesDatum, getValueAccessor: (d: DataSeriesDatum) => number | null) => boolean;\n\n/** @internal */\nexport function isYValueDefinedFn(yScale: ScaleContinuous, xScale: ScaleBand | ScaleContinuous): YDefinedFn {\n  const validator = getScaleTypeValueValidator(yScale);\n  return (datum, getValueAccessor) => {\n    const yValue = getValueAccessor(datum);\n    return yValue !== null && validator(yValue) && xScale.isValueInDomain(datum.x);\n  };\n}\n\n/** @internal */\nexport const CHROME_PINCH_BUG_EPSILON = 0.5;\n\n/**\n * Temporary fix for Chromium bug\n * Shift a small pixel value when pixel diff is <= 0.5px\n * https://github.com/elastic/elastic-charts/issues/1053\n * https://bugs.chromium.org/p/chromium/issues/detail?id=1163912\n */\nfunction chromeRenderBugBuffer(y1: number, y0: number): number {\n  return Math.abs(y1 - y0) <= CHROME_PINCH_BUG_EPSILON ? 0.5 : 0;\n}\n\n/** @internal */\nexport function getY1ScaledValueFn(yScale: ScaleContinuous): (datum: DataSeriesDatum) => number {\n  const datumAccessor = getYDatumValueFn();\n  const scaleY0Value = getY0ScaledValueFn(yScale);\n  return (datum) => {\n    const y1Value = yScale.scale(datumAccessor(datum));\n    const y0Value = scaleY0Value(datum);\n    return y1Value - chromeRenderBugBuffer(y1Value, y0Value);\n  };\n}\n\n/** @internal */\nexport function getY0ScaledValueFn(yScale: ScaleContinuous): (datum: DataSeriesDatum) => number {\n  const domainPolarity = getDomainPolarity(yScale.domain);\n  const logBaseline = domainPolarity >= 0 ? Math.min(...yScale.domain) : Math.max(...yScale.domain);\n  return ({ y0 }) =>\n    isLogarithmicScale(yScale) // checking wrong y0 polarity\n      ? y0 === null || domainPolarity !== Math.sign(y0) // if all positive domain use 1 as baseline, -1 otherwise\n        ? yScale.scale(logBaseline)\n        : yScale.scale(y0) // if negative value, use -1 as max reference, 1 otherwise\n      : yScale.scale(y0 === null ? DEFAULT_ZERO_BASELINE : y0);\n}\n\nfunction getDomainPolarity(domain: number[]): number {\n  // 1 if both numbers are positive, -1 if both are negative, 0 if zeros or mixed\n  return Math.sign(Math.sign(domain[0] ?? NaN) + Math.sign(domain[1] ?? NaN));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { X_SCALE_DEFAULT, Y_SCALE_DEFAULT } from './scale_defaults';\nimport { ScaleContinuousType } from '../../../scales';\nimport { BasicSeriesSpec, XScaleType } from '../utils/specs';\n\n/** @internal */\nexport function getXScaleTypeFromSpec(type?: BasicSeriesSpec['xScaleType']): XScaleType {\n  return type ?? X_SCALE_DEFAULT.type;\n}\n\n/** @internal */\nexport function getXNiceFromSpec(nice?: BasicSeriesSpec['xNice']): boolean {\n  return nice ?? X_SCALE_DEFAULT.nice;\n}\n\n/** @internal */\nexport function getYScaleTypeFromSpec(type?: BasicSeriesSpec['yScaleType']): ScaleContinuousType {\n  return type ?? Y_SCALE_DEFAULT.type;\n}\n\n/** @internal */\nexport function getYNiceFromSpec(nice?: BasicSeriesSpec['yNice']): boolean {\n  return nice ?? Y_SCALE_DEFAULT.nice;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleType } from '../../../scales/constants';\n\n/** @internal */\nexport const X_SCALE_DEFAULT = {\n  type: ScaleType.Ordinal,\n  nice: false,\n  desiredTickCount: 10,\n};\n\n/** @internal */\nexport const Y_SCALE_DEFAULT = {\n  type: ScaleType.Linear,\n  nice: false,\n  desiredTickCount: 5,\n  constrainDomainPadding: undefined,\n  domainPixelPadding: 0,\n  logBase: undefined,\n  logMinLimit: undefined,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { AreaSeriesSpec, HistogramModeAlignments, DEFAULT_GLOBAL_ID, SeriesType, BaseDatum } from '../utils/specs';\n\nconst buildProps = buildSFProps<AreaSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Area,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Linear,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n    histogramModeAlignment: HistogramModeAlignments.Center,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const AreaSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    AreaSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<AreaSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type AreaSeriesProps = ComponentProps<typeof AreaSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { SpecType } from '../../../specs/constants';\nimport { specComponentFactory } from '../../../state/spec_factory';\nimport { Position } from '../../../utils/common';\nimport { AxisSpec, DEFAULT_GLOBAL_ID } from '../utils/specs';\n\n/**\n * Add axis spec to chart\n * @public\n */\nexport const Axis = specComponentFactory<AxisSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Axis,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    hide: false,\n    showOverlappingTicks: false,\n    showOverlappingLabels: false,\n    position: Position.Left,\n    timeAxisLayerCount: 0,\n  },\n);\n\n/** @public */\nexport type AxisProps = ComponentProps<typeof Axis>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { useSpecFactory, SFProps, buildSFProps } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { BarSeriesSpec, BaseDatum, DEFAULT_GLOBAL_ID, SeriesType } from '../utils/specs';\n\nconst buildProps = buildSFProps<BarSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Bar,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Ordinal,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n    enableHistogramMode: false,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const BarSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    BarSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<BarSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type BarSeriesProps = ComponentProps<typeof BarSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { BaseDatum, BubbleSeriesSpec, DEFAULT_GLOBAL_ID, SeriesType } from '../utils/specs';\n\nconst buildProps = buildSFProps<BubbleSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Bubble,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Ordinal,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const BubbleSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    BubbleSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<BubbleSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type BubbleSeriesProps = ComponentProps<typeof BubbleSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { HistogramBarSeriesSpec, DEFAULT_GLOBAL_ID, SeriesType, BaseDatum } from '../utils/specs';\n\nconst buildProps = buildSFProps<HistogramBarSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Bar,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Linear,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n    enableHistogramMode: true as const,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const HistogramBarSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    HistogramBarSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<HistogramBarSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type HistogramBarSeriesProps = ComponentProps<typeof HistogramBarSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './area_series';\nexport * from './axis';\nexport * from './bar_series';\nexport * from './bubble_series';\nexport * from './histogram_bar_series';\nexport * from './line_annotation';\nexport * from './line_series';\nexport * from './rect_annotation';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { SpecType } from '../../../specs/constants';\nimport { buildSFProps, SFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { stripUndefined } from '../../../utils/common';\nimport { DEFAULT_ANNOTATION_LINE_STYLE } from '../../../utils/themes/merge_utils';\nimport { LineAnnotationSpec, DEFAULT_GLOBAL_ID, AnnotationType } from '../utils/specs';\n\nconst buildProps = buildSFProps<LineAnnotationSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Annotation,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    annotationType: AnnotationType.Line,\n    style: DEFAULT_ANNOTATION_LINE_STYLE,\n    hideLines: false,\n    hideTooltips: false,\n    hideLinesTooltips: true,\n    zIndex: 1,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const LineAnnotation = function <D = any>(\n  props: SFProps<\n    LineAnnotationSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<LineAnnotationSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type LineAnnotationProps = ComponentProps<typeof LineAnnotation>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { ScaleType } from '../../../scales/constants';\nimport { SpecType } from '../../../specs/constants';\nimport { SFProps, buildSFProps, useSpecFactory } from '../../../state/spec_factory';\nimport { Datum, stripUndefined } from '../../../utils/common';\nimport { LineSeriesSpec, DEFAULT_GLOBAL_ID, HistogramModeAlignments, SeriesType, BaseDatum } from '../utils/specs';\n\nconst buildProps = buildSFProps<LineSeriesSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Series,\n    seriesType: SeriesType.Line,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    xScaleType: ScaleType.Ordinal,\n    yScaleType: ScaleType.Linear,\n    hideInLegend: false,\n    histogramModeAlignment: HistogramModeAlignments.Center,\n  },\n);\n\n/**\n * Adds bar series to chart specs\n * @public\n */\nexport const LineSeries = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    LineSeriesSpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<LineSeriesSpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type LineSeriesProps = ComponentProps<typeof LineSeries>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { ChartType } from '../..';\nimport { SpecType } from '../../../specs/constants';\nimport { specComponentFactory } from '../../../state/spec_factory';\nimport { DEFAULT_ANNOTATION_RECT_STYLE } from '../../../utils/themes/merge_utils';\nimport { RectAnnotationSpec, DEFAULT_GLOBAL_ID, AnnotationType } from '../utils/specs';\n\n/** @public */\nexport const RectAnnotation = specComponentFactory<RectAnnotationSpec>()(\n  {\n    chartType: ChartType.XYAxis,\n    specType: SpecType.Annotation,\n  },\n  {\n    groupId: DEFAULT_GLOBAL_ID,\n    annotationType: AnnotationType.Rectangle,\n    zIndex: -1,\n    style: DEFAULT_ANNOTATION_RECT_STYLE,\n    outside: false,\n  },\n);\n\n/** @public */\nexport type RectAnnotationProps = ComponentProps<typeof RectAnnotation>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\n\nimport { computeChartDimensionsSelector } from './selectors/compute_chart_dimensions';\nimport { computeLegendSelector } from './selectors/compute_legend';\nimport { computeSeriesDomainsSelector } from './selectors/compute_series_domains';\nimport { getBrushAreaSelector } from './selectors/get_brush_area';\nimport { getChartTypeDescriptionSelector } from './selectors/get_chart_type_description';\nimport { getPointerCursorSelector } from './selectors/get_cursor_pointer';\nimport { getDebugStateSelector } from './selectors/get_debug_state';\nimport { getLegendItemExtraValuesSelector } from './selectors/get_legend_item_extra_values';\nimport { getLegendItemsLabelsSelector } from './selectors/get_legend_items_labels';\nimport { getSeriesSpecsSelector } from './selectors/get_specs';\nimport { getTooltipAnchorPositionSelector } from './selectors/get_tooltip_anchor_position';\nimport { getTooltipInfoSelector } from './selectors/get_tooltip_values_highlighted_geoms';\nimport { isBrushAvailableSelector } from './selectors/is_brush_available';\nimport { isChartEmptySelector } from './selectors/is_chart_empty';\nimport { isTooltipVisibleSelector } from './selectors/is_tooltip_visible';\nimport { createOnBrushEndCaller } from './selectors/on_brush_end_caller';\nimport { createOnClickCaller } from './selectors/on_click_caller';\nimport { createOnElementOutCaller } from './selectors/on_element_out_caller';\nimport { createOnElementOverCaller } from './selectors/on_element_over_caller';\nimport { createOnPointerMoveCaller } from './selectors/on_pointer_move_caller';\nimport { createOnProjectionAreaCaller } from './selectors/on_projection_area_caller';\nimport { ChartType } from '../..';\nimport { LegendItemExtraValues } from '../../../common/legend';\nimport { SeriesKey } from '../../../common/series_id';\nimport { BrushTool } from '../../../components/brush/brush';\nimport { Tooltip } from '../../../components/tooltip/tooltip';\nimport { InternalChartState, GlobalChartState, BackwardRef } from '../../../state/chart_state';\nimport { getChartContainerDimensionsSelector } from '../../../state/selectors/get_chart_container_dimensions';\nimport { InitStatus } from '../../../state/selectors/get_internal_is_intialized';\nimport { isBrushingSelector } from '../../../state/selectors/is_brushing';\nimport { htmlIdGenerator } from '../../../utils/common';\nimport { XYChart } from '../renderer/canvas/xy_chart';\nimport { Annotations } from '../renderer/dom/annotations';\nimport { CursorBand } from '../renderer/dom/cursor_band';\nimport { CursorCrossLine } from '../renderer/dom/cursor_crossline';\nimport { CursorLine } from '../renderer/dom/cursor_line';\nimport { Highlighter } from '../renderer/dom/highlighter';\n\n/** @internal */\nexport class XYAxisChartState implements InternalChartState {\n  chartType: ChartType;\n\n  legendId: string;\n\n  onClickCaller: (state: GlobalChartState) => void;\n\n  onElementOverCaller: (state: GlobalChartState) => void;\n\n  onElementOutCaller: (state: GlobalChartState) => void;\n\n  onBrushEndCaller: (state: GlobalChartState) => void;\n\n  onPointerMoveCaller: (state: GlobalChartState) => void;\n\n  onProjectionAreaCaller: (state: GlobalChartState) => void;\n\n  constructor() {\n    this.onClickCaller = createOnClickCaller();\n    this.onElementOverCaller = createOnElementOverCaller();\n    this.onElementOutCaller = createOnElementOutCaller();\n    this.onBrushEndCaller = createOnBrushEndCaller();\n    this.onPointerMoveCaller = createOnPointerMoveCaller();\n    this.onProjectionAreaCaller = createOnProjectionAreaCaller();\n    this.chartType = ChartType.XYAxis;\n    this.legendId = htmlIdGenerator()('legend');\n  }\n\n  isInitialized(globalState: GlobalChartState) {\n    return getSeriesSpecsSelector(globalState).length > 0 ? InitStatus.Initialized : InitStatus.SpecNotInitialized;\n  }\n\n  isBrushAvailable(globalState: GlobalChartState) {\n    return isBrushAvailableSelector(globalState);\n  }\n\n  isBrushing(globalState: GlobalChartState) {\n    return this.isBrushAvailable(globalState) && isBrushingSelector(globalState);\n  }\n\n  isChartEmpty(globalState: GlobalChartState) {\n    return isChartEmptySelector(globalState);\n  }\n\n  getMainProjectionArea(globalState: GlobalChartState) {\n    return computeChartDimensionsSelector(globalState).chartDimensions;\n  }\n\n  getProjectionContainerArea(globalState: GlobalChartState) {\n    return getChartContainerDimensionsSelector(globalState);\n  }\n\n  getBrushArea(globalState: GlobalChartState) {\n    return getBrushAreaSelector(globalState);\n  }\n\n  getLegendItemsLabels(globalState: GlobalChartState) {\n    return getLegendItemsLabelsSelector(globalState);\n  }\n\n  getLegendItems(globalState: GlobalChartState) {\n    return computeLegendSelector(globalState);\n  }\n\n  getLegendExtraValues(globalState: GlobalChartState): Map<SeriesKey, LegendItemExtraValues> {\n    return getLegendItemExtraValuesSelector(globalState);\n  }\n\n  chartRenderer(containerRef: BackwardRef, forwardCanvasRef: RefObject<HTMLCanvasElement>) {\n    return (\n      <>\n        <CursorBand />\n        <XYChart forwardCanvasRef={forwardCanvasRef} />\n        <CursorLine />\n        <CursorCrossLine />\n        <Tooltip getChartContainerRef={containerRef} />\n        <Annotations getChartContainerRef={containerRef} chartAreaRef={forwardCanvasRef} />\n        <Highlighter />\n        <BrushTool />\n      </>\n    );\n  }\n\n  getPointerCursor(globalState: GlobalChartState) {\n    return getPointerCursorSelector(globalState);\n  }\n\n  isTooltipVisible(globalState: GlobalChartState) {\n    return isTooltipVisibleSelector(globalState);\n  }\n\n  getTooltipInfo(globalState: GlobalChartState) {\n    return getTooltipInfoSelector(globalState);\n  }\n\n  getTooltipAnchor(globalState: GlobalChartState) {\n    return getTooltipAnchorPositionSelector(globalState);\n  }\n\n  getSmallMultiplesDomains(globalState: GlobalChartState) {\n    return computeSeriesDomainsSelector(globalState);\n  }\n\n  eventCallbacks(globalState: GlobalChartState) {\n    this.onElementOverCaller(globalState);\n    this.onElementOutCaller(globalState);\n    this.onClickCaller(globalState);\n    this.onBrushEndCaller(globalState);\n    this.onPointerMoveCaller(globalState);\n    this.onProjectionAreaCaller(globalState);\n  }\n\n  getDebugState(globalState: GlobalChartState) {\n    return getDebugStateSelector(globalState);\n  }\n\n  getChartTypeDescription(globalState: GlobalChartState) {\n    return getChartTypeDescriptionSelector(globalState);\n  }\n\n  canDisplayChartTitles = () => true;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getScaleConfigsFromSpecsSelector } from './get_api_scale_configs';\nimport { getAxisSpecsSelector, getSeriesSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Rotation } from '../../../../utils/common';\nimport { SpecId } from '../../../../utils/ids';\nimport { defaultTickFormatter, isXDomain } from '../../utils/axis_utils';\nimport { groupBy } from '../../utils/group_data_series';\nimport { AxisSpec } from '../../utils/specs';\n\n/** @internal */\nexport type AxisLabelFormatter<V = unknown> = (value: V) => string;\n\n/** @internal */\nexport type AxisLabelFormatters = { x: Map<SpecId, AxisLabelFormatter>; y: Map<SpecId, AxisLabelFormatter> };\n\n/** @internal */\nexport const getAxisTickLabelFormatter = createCustomCachedSelector(\n  [getSeriesSpecsSelector, getAxisSpecsSelector, getSettingsSpecSelector, getScaleConfigsFromSpecsSelector],\n  (seriesSpecs, axesSpecs, { rotation }, scaleConfigs): AxisLabelFormatters => {\n    const seriesByGroupId = groupBy(seriesSpecs, ['groupId'], false);\n    const axesByGroupId = groupBy(axesSpecs, ['groupId'], false);\n    const groupIds = [...new Set([...Object.keys(seriesByGroupId), ...Object.keys(axesByGroupId)])];\n    const { timeZone } = scaleConfigs.x;\n    // we need to do that by groupId to find the first Y spec formatter fallback\n    return groupIds.reduce<AxisLabelFormatters>(\n      (acc, groupId) => {\n        const ySpecDataFormatter = (seriesByGroupId[groupId] ?? []).find(({ tickFormat }) => tickFormat)?.tickFormat;\n        const axes = groupAxesByCartesianCoords(axesByGroupId[groupId] ?? [], rotation);\n        axes.x.forEach((spec) => {\n          acc.x.set(spec.id, (v) => (spec?.labelFormat ?? spec?.tickFormat ?? defaultTickFormatter)(v, { timeZone }));\n        });\n        axes.y.forEach((spec) => {\n          acc.y.set(spec.id, (v) =>\n            (spec.labelFormat ?? spec.tickFormat ?? ySpecDataFormatter ?? defaultTickFormatter)(v, {}),\n          );\n        });\n        return acc;\n      },\n      { x: new Map(), y: new Map() },\n    );\n  },\n);\n\nfunction groupAxesByCartesianCoords(sameGroupAxes: AxisSpec[], chartRotation: Rotation = 0) {\n  return sameGroupAxes.reduce<{ x: AxisSpec[]; y: AxisSpec[] }>(\n    (acc, spec) => {\n      acc[isXDomain(spec.position, chartRotation) ? 'x' : 'y'].push(spec);\n      return acc;\n    },\n    { x: [], y: [] },\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getAxesStylesSelector } from './get_axis_styles';\nimport { getAxisSpecsSelector, getAnnotationSpecsSelector } from './get_specs';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { AxisId } from '../../../../utils/ids';\nimport { computeAnnotationDimensions } from '../../annotations/utils';\n\nconst getAxisStyleGetter = createCustomCachedSelector(\n  [getAxesStylesSelector, getChartThemeSelector],\n  (axisStyles, { axes }) =>\n    (id: AxisId = '') =>\n      axisStyles.get(id) ?? axes,\n);\n\n/** @internal */\nexport const computeAnnotationDimensionsSelector = createCustomCachedSelector(\n  [\n    getAnnotationSpecsSelector,\n    getSettingsSpecSelector,\n    computeSeriesGeometriesSelector,\n    getAxisSpecsSelector,\n    isHistogramModeEnabledSelector,\n    computeSmallMultipleScalesSelector,\n    getAxisStyleGetter,\n  ],\n  computeAnnotationDimensions,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getAxesStylesSelector } from './get_axis_styles';\nimport { axisSpecsLookupSelector } from './get_specs';\nimport { getVisibleTickSetsSelector } from './visible_ticks';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getAxesGeometries } from '../../utils/axis_utils';\n\n/** @internal */\nexport const computeAxesGeometriesSelector = createCustomCachedSelector(\n  [\n    computeChartDimensionsSelector,\n    getChartThemeSelector,\n    axisSpecsLookupSelector,\n    getAxesStylesSelector,\n    computeSmallMultipleScalesSelector,\n    getVisibleTickSetsSelector,\n  ],\n  getAxesGeometries,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisLabelFormatter, getAxisTickLabelFormatter } from './axis_tick_formatter';\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { countBarsInClusterSelector } from './count_bars_in_cluster';\nimport { getAxesStylesSelector } from './get_axis_styles';\nimport { getBarPaddingsSelector } from './get_bar_paddings';\nimport { getAxisSpecsSelector, getSeriesSpecsSelector } from './get_specs';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { TextMeasure, withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { AxisId } from '../../../../utils/ids';\nimport { Logger } from '../../../../utils/logger';\nimport { AxisStyle, GridLineStyle } from '../../../../utils/themes/theme';\nimport { isVerticalAxis } from '../../utils/axis_type_utils';\nimport {\n  computeRotatedLabelDimensions,\n  defaultTickFormatter,\n  getScaleForAxisSpec,\n  isXDomain,\n  TickLabelBounds,\n} from '../../utils/axis_utils';\nimport { AxisSpec, TickFormatter } from '../../utils/specs';\n\n/** @internal */\nexport type AxesTicksDimensions = Map<AxisId, TickLabelBounds>;\n\nconst getScaleFunction = createCustomCachedSelector(\n  [\n    computeSeriesDomainsSelector,\n    getSettingsSpecSelector,\n    countBarsInClusterSelector,\n    getBarPaddingsSelector,\n    isHistogramModeEnabledSelector,\n  ],\n  getScaleForAxisSpec,\n);\n\n/** @internal */\nexport const getFallBackTickFormatter = createCustomCachedSelector(\n  [getSeriesSpecsSelector],\n  (seriesSpecs): TickFormatter => seriesSpecs.find(({ tickFormat }) => tickFormat)?.tickFormat ?? defaultTickFormatter,\n);\n\nconst getUnitScales = createCustomCachedSelector([getScaleFunction, getAxisSpecsSelector], (getScale, axesSpecs) =>\n  axesSpecs.reduce<Map<AxisId, ScaleBand | ScaleContinuous>>((unitScales, axisSpec) => {\n    const scale = getScale(axisSpec, [0, 1]);\n    if (scale) unitScales.set(axisSpec.id, scale);\n    else Logger.warn(`Cannot compute scale for axis spec ${axisSpec.id}. Axis will not be displayed.`);\n    return unitScales;\n  }, new Map()),\n);\n\nconst getThemedAxesStyles = createCustomCachedSelector(\n  [getChartThemeSelector, getAxesStylesSelector],\n  (chartTheme, axesStyles): Map<AxisId, AxisStyle> =>\n    [...axesStyles.keys()].reduce((styles, id) => styles.set(id, axesStyles.get(id) ?? chartTheme.axes), new Map()),\n);\n\n/** @internal */\nexport type JoinedAxisData = {\n  axisSpec: AxisSpec;\n  scale: ScaleContinuous | ScaleBand;\n  axesStyle: AxisStyle;\n  gridLine: GridLineStyle;\n  isXAxis: boolean;\n  labelFormatter: AxisLabelFormatter;\n};\n\n/** @internal */\nexport const getJoinedVisibleAxesData = createCustomCachedSelector(\n  [getUnitScales, getAxisSpecsSelector, getThemedAxesStyles, getSettingsSpecSelector, getAxisTickLabelFormatter],\n  (unitScales, axesSpecs, themedAxesStyles, { rotation }, axisTickLabelFormatters) =>\n    axesSpecs.reduce<Map<AxisId, JoinedAxisData>>((axisData, axisSpec) => {\n      const { id, position, hide } = axisSpec;\n      const axesStyle = themedAxesStyles.get(id);\n      const scale = unitScales.get(id);\n\n      if (scale && axesStyle) {\n        const gridLine = isVerticalAxis(position) ? axesStyle.gridLine.vertical : axesStyle.gridLine.horizontal;\n        const axisShown = gridLine.visible || !hide;\n        const isXAxis = isXDomain(position, rotation);\n        const labelFormatter = axisTickLabelFormatters[isXAxis ? 'x' : 'y'].get(id) ?? defaultTickFormatter;\n\n        if (axisShown)\n          axisData.set(id, {\n            axisSpec,\n            scale,\n            axesStyle,\n            gridLine,\n            labelFormatter,\n            isXAxis,\n          });\n      }\n      return axisData;\n    }, new Map()),\n);\n\n/** @internal */\nexport const getLabelBox = (\n  axesStyle: AxisStyle,\n  ticks: Array<string | number>,\n  labelFormatter: AxisLabelFormatter,\n  textMeasure: TextMeasure,\n  axisSpec: AxisSpec,\n  gridLine: GridLineStyle,\n): TickLabelBounds => ({\n  ...(axesStyle.tickLabel.visible ? ticks.map(labelFormatter) : []).reduce(\n    (sizes, labelText) => {\n      const bbox = textMeasure(\n        labelText,\n        {\n          fontStyle: axesStyle.tickLabel.fontStyle ?? 'normal',\n          fontFamily: axesStyle.tickLabel.fontFamily,\n          fontWeight: 'normal',\n          fontVariant: 'normal',\n        },\n        axesStyle.tickLabel.fontSize,\n      );\n      const rotatedBbox = computeRotatedLabelDimensions(bbox, axesStyle.tickLabel.rotation);\n      sizes.maxLabelBboxWidth = Math.max(sizes.maxLabelBboxWidth, Math.ceil(rotatedBbox.width));\n      sizes.maxLabelBboxHeight = Math.max(sizes.maxLabelBboxHeight, Math.ceil(rotatedBbox.height));\n      sizes.maxLabelTextWidth = Math.max(sizes.maxLabelTextWidth, Math.ceil(bbox.width));\n      sizes.maxLabelTextHeight = Math.max(sizes.maxLabelTextHeight, Math.ceil(bbox.height));\n      return sizes;\n    },\n    { maxLabelBboxWidth: 0, maxLabelBboxHeight: 0, maxLabelTextWidth: 0, maxLabelTextHeight: 0 },\n  ),\n  isHidden: axisSpec.hide && gridLine.visible,\n});\n\n/** @internal */\nexport const computeAxisTicksDimensionsSelector = createCustomCachedSelector(\n  [getJoinedVisibleAxesData],\n  (joinedAxesData): AxesTicksDimensions =>\n    withTextMeasure(\n      (textMeasure): AxesTicksDimensions =>\n        [...joinedAxesData].reduce<AxesTicksDimensions>(\n          (axesTicksDimensions, [id, { axisSpec, scale, axesStyle, gridLine, labelFormatter }]) =>\n            axesTicksDimensions.set(\n              id,\n              getLabelBox(axesStyle, scale.ticks(), labelFormatter, textMeasure, axisSpec, gridLine),\n            ),\n          new Map(),\n        ),\n    ),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxisTicksDimensionsSelector } from './compute_axis_ticks_dimensions';\nimport { getAxesStylesSelector } from './get_axis_styles';\nimport { getAxisSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartContainerDimensionsSelector } from '../../../../state/selectors/get_chart_container_dimensions';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSmallMultiplesSpec } from '../../../../state/selectors/get_small_multiples_spec';\nimport { computeChartDimensions } from '../../utils/dimensions';\n\n/** @internal */\nexport const computeChartDimensionsSelector = createCustomCachedSelector(\n  [\n    getChartContainerDimensionsSelector,\n    getChartThemeSelector,\n    computeAxisTicksDimensionsSelector,\n    getAxesStylesSelector,\n    getAxisSpecsSelector,\n    getSmallMultiplesSpec,\n  ],\n  computeChartDimensions,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Transform } from '../utils/types';\nimport { computeChartTransform } from '../utils/utils';\n\n/** @internal */\nexport const computeChartTransformSelector = createCustomCachedSelector(\n  [computeChartDimensionsSelector, getSettingsSpecSelector],\n  (chartDimensions, settingsSpecs): Transform =>\n    computeChartTransform(chartDimensions.chartDimensions, settingsSpecs.rotation),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { getSeriesColorsSelector } from './get_series_color_map';\nimport { getSiDataSeriesMapSelector } from './get_si_dataseries_map';\nimport { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs';\nimport { LegendItem } from '../../../../common/legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getDeselectedSeriesSelector } from '../../../../state/selectors/get_deselected_data_series';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { computeLegend } from '../../legend/legend';\nimport { DataSeries } from '../../utils/series';\n\n/** @internal */\nexport const computeLegendSelector = createCustomCachedSelector(\n  [\n    getSeriesSpecsSelector,\n    computeSeriesDomainsSelector,\n    getChartThemeSelector,\n    getSeriesColorsSelector,\n    getAxisSpecsSelector,\n    getDeselectedSeriesSelector,\n    getSettingsSpecSelector,\n    getSiDataSeriesMapSelector,\n  ],\n  (\n    seriesSpecs,\n    { formattedDataSeries, xDomain },\n    chartTheme,\n    seriesColors,\n    axesSpecs,\n    deselectedDataSeries,\n    settings,\n    siDataSeriesMap: Record<string, DataSeries>,\n  ): LegendItem[] => {\n    return computeLegend(\n      xDomain,\n      formattedDataSeries,\n      seriesColors,\n      seriesSpecs,\n      axesSpecs,\n      settings,\n      siDataSeriesMap,\n      chartTheme,\n      deselectedDataSeries,\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesGeometriesSelector } from './compute_axes_geometries';\nimport {\n  getPanelTitle,\n  getPerPanelMap,\n  hasSMDomain,\n  PerPanelMap,\n  SmallMultipleScales,\n} from '../../../../common/panel_utils';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSmallMultiplesIndexOrderSelector } from '../../../../state/selectors/get_small_multiples_index_order';\nimport { Position } from '../../../../utils/common';\nimport { isHorizontalAxis, isVerticalAxis } from '../../utils/axis_type_utils';\nimport { AxisGeometry } from '../../utils/axis_utils';\n\n/** @internal */\nexport type PerPanelAxisGeoms = {\n  axesGeoms: AxisGeometry[];\n} & PerPanelMap;\n\nconst isPrimaryColumnFn =\n  ({ horizontal: { domain } }: SmallMultipleScales) =>\n  (position: Position, horizontalValue: any) =>\n    isVerticalAxis(position) && domain[0] === horizontalValue;\n\nconst isPrimaryRowFn =\n  ({ vertical: { domain } }: SmallMultipleScales) =>\n  (position: Position, verticalValue: any) =>\n    isHorizontalAxis(position) && domain[0] === verticalValue;\n\n/** @internal */\nexport const computePerPanelAxesGeomsSelector = createCustomCachedSelector(\n  [computeAxesGeometriesSelector, computeSmallMultipleScalesSelector, getSmallMultiplesIndexOrderSelector],\n  (axesGeoms, scales, groupBySpec): Array<PerPanelAxisGeoms> => {\n    const { horizontal, vertical } = scales;\n    const isPrimaryColumn = isPrimaryColumnFn(scales);\n    const isPrimaryRow = isPrimaryRowFn(scales);\n\n    return getPerPanelMap(scales, (_, h, v) => ({\n      axesGeoms: axesGeoms.map((geom) => {\n        const { position } = geom.axis;\n        const isVertical = isVerticalAxis(position);\n        const usePanelTitle = isVertical ? hasSMDomain(vertical) : hasSMDomain(horizontal);\n        const panelTitle = usePanelTitle ? getPanelTitle(isVertical, v, h, groupBySpec) : undefined;\n        const secondary = !isPrimaryColumn(position, h) && !isPrimaryRow(position, v);\n\n        return { ...geom, axis: { ...geom.axis, panelTitle, secondary } };\n      }),\n    }));\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getScaleConfigsFromSpecsSelector } from './get_api_scale_configs';\nimport { getAnnotationSpecsSelector, getSeriesSpecsSelector } from './get_specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getSmallMultiplesIndexOrderSelector } from '../../../../state/selectors/get_small_multiples_index_order';\nimport { computeSeriesDomains } from '../utils/utils';\n\nconst getDeselectedSeriesSelector = (state: GlobalChartState) => state.interactions.deselectedDataSeries;\n\n/** @internal */\nexport const computeSeriesDomainsSelector = createCustomCachedSelector(\n  [\n    getSeriesSpecsSelector,\n    getScaleConfigsFromSpecsSelector,\n    getAnnotationSpecsSelector,\n    getSettingsSpecSelector,\n    getDeselectedSeriesSelector,\n    getSmallMultiplesIndexOrderSelector,\n  ],\n  computeSeriesDomains,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getFallBackTickFormatter } from './compute_axis_ticks_dimensions';\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { getSeriesColorsSelector } from './get_series_color_map';\nimport { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { computeSeriesGeometries } from '../utils/utils';\n\n/** @internal */\nexport const computeSeriesGeometriesSelector = createCustomCachedSelector(\n  [\n    getSeriesSpecsSelector,\n    computeSeriesDomainsSelector,\n    getSeriesColorsSelector,\n    getChartThemeSelector,\n    getSettingsSpecSelector,\n    getAxisSpecsSelector,\n    computeSmallMultipleScalesSelector,\n    isHistogramModeEnabledSelector,\n    getFallBackTickFormatter,\n  ],\n  (specs, domain, colors, theme, settings, axis, smScales, isHistogram, fallbackFormatter) => {\n    return withTextMeasure((measureText) =>\n      computeSeriesGeometries(\n        specs,\n        domain,\n        colors,\n        theme,\n        settings,\n        axis,\n        smScales,\n        isHistogram,\n        fallbackFormatter,\n        measureText,\n      ),\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { SeriesType } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { groupBy } from '../../utils/group_data_series';\nimport { getBarIndexKey } from '../utils/utils';\n\n/** @internal */\nexport const countBarsInClusterSelector = createCustomCachedSelector(\n  [computeSeriesDomainsSelector],\n  function countBarsInCluster({ formattedDataSeries }): number {\n    const barDataSeries = formattedDataSeries.filter(({ seriesType }) => seriesType === SeriesType.Bar);\n    const dataSeriesGroupedByPanel = groupBy(\n      barDataSeries,\n      ['smVerticalAccessorValue', 'smHorizontalAccessorValue'],\n      false,\n    );\n\n    const barIndexByPanel = Object.keys(dataSeriesGroupedByPanel).reduce<Record<string, string[]>>((acc, panelKey) => {\n      const panelBars = dataSeriesGroupedByPanel[panelKey] ?? [];\n      const barDataSeriesByBarIndex = groupBy(panelBars, getBarIndexKey, false);\n\n      acc[panelKey] = Object.keys(barDataSeriesByBarIndex);\n      return acc;\n    }, {});\n\n    return Object.values(barIndexByPanel).reduce((acc, curr) => {\n      return Math.max(acc, curr.length);\n    }, 0);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAnnotationDimensionsSelector } from './compute_annotations';\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getAnnotationSpecsSelector } from './get_specs';\nimport { getTooltipInfoSelector } from './get_tooltip_values_highlighted_geoms';\nimport { TooltipPortalSettings } from '../../../../components/portal/types';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { DOMElement } from '../../../../state/actions/dom_element';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { AnnotationId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { AnnotationLineProps } from '../../annotations/line/types';\nimport { AnnotationRectProps } from '../../annotations/rect/types';\nimport { computeRectAnnotationTooltipState } from '../../annotations/tooltip';\nimport { AnnotationTooltipState, AnnotationDimensions } from '../../annotations/types';\nimport { AnnotationSpec, AnnotationType } from '../../utils/specs';\nimport { ComputedGeometries } from '../utils/types';\n\nconst getCurrentPointerPosition = (state: GlobalChartState) => state.interactions.pointer.current.position;\nconst getHoveredDOMElement = (state: GlobalChartState) => state.interactions.hoveredDOMElement;\n\n/** @internal */\nexport const getAnnotationTooltipStateSelector = createCustomCachedSelector(\n  [\n    getCurrentPointerPosition,\n    computeChartDimensionsSelector,\n    computeSeriesGeometriesSelector,\n    getChartRotationSelector,\n    getAnnotationSpecsSelector,\n    computeAnnotationDimensionsSelector,\n    getTooltipInfoSelector,\n    getHoveredDOMElement,\n  ],\n  getAnnotationTooltipState,\n);\n\nfunction getAnnotationTooltipState(\n  cursorPosition: Point,\n  {\n    chartDimensions,\n  }: {\n    chartDimensions: Dimensions;\n  },\n  geometries: ComputedGeometries,\n  chartRotation: Rotation,\n  annotationSpecs: AnnotationSpec[],\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  tooltip: TooltipInfo,\n  hoveredDOMElement: DOMElement | null,\n): AnnotationTooltipState | null {\n  const hoveredTooltip = getTooltipStateForDOMElements(\n    chartDimensions,\n    annotationSpecs,\n    annotationDimensions,\n    hoveredDOMElement,\n  );\n\n  if (hoveredTooltip) {\n    return hoveredTooltip;\n  }\n  // get positions relative to chart\n  if (cursorPosition.x < 0 || cursorPosition.y < 0) {\n    return null;\n  }\n  const { xScale, yScales } = geometries.scales;\n  // only if we have a valid cursor position and the necessary scale\n  if (!xScale || !yScales) {\n    return null;\n  }\n  const tooltipState = computeRectAnnotationTooltipState(\n    cursorPosition,\n    annotationDimensions,\n    annotationSpecs,\n    chartRotation,\n    chartDimensions,\n  );\n\n  // If there's a highlighted chart element tooltip value, don't show annotation tooltip\n  const isChartTooltipDisplayed = tooltip.values.some(({ isHighlighted }) => isHighlighted);\n  if (\n    tooltipState &&\n    tooltipState.isVisible &&\n    tooltipState.annotationType === AnnotationType.Rectangle &&\n    isChartTooltipDisplayed\n  ) {\n    return null;\n  }\n\n  return tooltipState;\n}\n\n/** @internal */\nexport function getTooltipStateForDOMElements(\n  chartDimensions: Dimensions,\n  annotationSpecs: AnnotationSpec[],\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  hoveredDOMElement: DOMElement | null,\n): AnnotationTooltipState | null {\n  if (!hoveredDOMElement) {\n    return null;\n  }\n  // current type for hoveredDOMElement is only used for line annotation markers\n  // and we can safety cast the union types to the respective Line types\n  const spec = annotationSpecs.find(({ id }) => id === hoveredDOMElement.createdBySpecId);\n  if (!spec || spec.hideTooltips) {\n    return null;\n  }\n  const dimension = (annotationDimensions.get(hoveredDOMElement.createdBySpecId) ?? [])\n    .filter(isAnnotationLineProps)\n    .find(({ id }) => id === hoveredDOMElement.id);\n\n  if (!dimension) {\n    return null;\n  }\n\n  return {\n    id: dimension.id,\n    specId: spec.id,\n    isVisible: true,\n    annotationType: AnnotationType.Line,\n    datum: dimension.datum,\n    anchor: {\n      y: (dimension.markers[0]?.position.top ?? 0) + dimension.panel.top + chartDimensions.top,\n      x: (dimension.markers[0]?.position.left ?? 0) + dimension.panel.left + chartDimensions.left,\n      width: 0,\n      height: 0,\n    },\n    customTooltipDetails: spec.customTooltipDetails,\n    customTooltip: spec.customTooltip,\n    tooltipSettings: getTooltipSettings(spec),\n  };\n}\n\nfunction isAnnotationLineProps(prop: AnnotationLineProps | AnnotationRectProps): prop is AnnotationLineProps {\n  return 'linePathPoints' in prop;\n}\n\nfunction getTooltipSettings({\n  placement,\n  fallbackPlacements,\n  boundary,\n  offset,\n}: AnnotationSpec): TooltipPortalSettings<'chart'> {\n  return {\n    placement,\n    fallbackPlacements,\n    boundary,\n    offset,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getAxisSpecsSelector, getSeriesSpecsSelector } from './get_specs';\nimport { mergeYCustomDomainsByGroupId } from './merge_y_custom_domains';\nimport { ScaleContinuousType } from '../../../../scales';\nimport { ScaleType } from '../../../../scales/constants';\nimport { SettingsSpec } from '../../../../specs/settings';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { GroupId } from '../../../../utils/ids';\nimport { convertXScaleTypes } from '../../domains/x_domain';\nimport { coerceYScaleTypes } from '../../domains/y_domain';\nimport { X_SCALE_DEFAULT, Y_SCALE_DEFAULT } from '../../scales/scale_defaults';\nimport { isXDomain } from '../../utils/axis_utils';\nimport { groupBy } from '../../utils/group_data_series';\nimport { AxisSpec, BasicSeriesSpec, CustomXDomain, XScaleType, YDomainRange } from '../../utils/specs';\nimport { getSpecDomainGroupId } from '../utils/spec';\n\n/** @internal */\nexport type ScaleConfigBase<T extends ScaleType, D extends CustomXDomain | YDomainRange> = {\n  type: T;\n  nice: boolean;\n  desiredTickCount: number;\n  customDomain?: D;\n};\ntype XScaleConfigBase = ScaleConfigBase<XScaleType, CustomXDomain>;\ntype YScaleConfigBase = ScaleConfigBase<ScaleContinuousType, YDomainRange>;\n\n/** @internal */\nexport interface ScaleConfigs {\n  x: XScaleConfigBase & {\n    isBandScale: boolean;\n    timeZone?: string;\n  };\n  y: Record<GroupId, YScaleConfigBase>;\n}\n\n/** @internal */\nexport const getScaleConfigsFromSpecsSelector = createCustomCachedSelector(\n  [getAxisSpecsSelector, getSeriesSpecsSelector, getSettingsSpecSelector],\n  getScaleConfigsFromSpecs,\n);\n\n/** @internal */\nexport function getScaleConfigsFromSpecs(\n  axisSpecs: AxisSpec[],\n  seriesSpecs: BasicSeriesSpec[],\n  settingsSpec: SettingsSpec,\n): ScaleConfigs {\n  // x axis\n  const xAxesSpecs = axisSpecs.filter((spec) => isXDomain(spec.position, settingsSpec.rotation));\n  const maxTickCountForXAxes = xAxesSpecs.reduce<number>((acc, { ticks = X_SCALE_DEFAULT.desiredTickCount }) => {\n    return Math.max(acc, ticks);\n  }, -Infinity);\n\n  const xScaleConfig = convertXScaleTypes(seriesSpecs);\n  const x: ScaleConfigs['x'] = {\n    customDomain: settingsSpec.xDomain,\n    ...xScaleConfig,\n    desiredTickCount: Number.isFinite(maxTickCountForXAxes) ? maxTickCountForXAxes : X_SCALE_DEFAULT.desiredTickCount,\n  };\n\n  // y axes\n  const scaleConfigsByGroupId = groupBy(seriesSpecs, getSpecDomainGroupId, true).reduce<\n    Record<GroupId, { nice: boolean; type: ScaleContinuousType }>\n  >((acc, series) => {\n    if (series[0]) {\n      const groupId = getSpecDomainGroupId(series[0]);\n      acc[groupId] = coerceYScaleTypes(series);\n    }\n    return acc;\n  }, {});\n\n  const customDomainByGroupId = mergeYCustomDomainsByGroupId(axisSpecs, settingsSpec.rotation);\n\n  const yAxisSpecs = axisSpecs.filter((spec) => !isXDomain(spec.position, settingsSpec.rotation));\n  const y = Object.keys(scaleConfigsByGroupId).reduce<ScaleConfigs['y']>((acc, groupId) => {\n    const maxTickCountYAxes = yAxisSpecs.reduce<number>((maxTickCount, yAxis) => {\n      return yAxis.groupId === groupId\n        ? Math.max(maxTickCount, yAxis.ticks ?? Y_SCALE_DEFAULT.desiredTickCount)\n        : maxTickCount;\n    }, -Infinity);\n    const desiredTickCount = Number.isFinite(maxTickCountYAxes) ? maxTickCountYAxes : Y_SCALE_DEFAULT.desiredTickCount;\n\n    if (!acc[groupId]) {\n      acc[groupId] = {\n        customDomain: customDomainByGroupId.get(groupId),\n        ...(scaleConfigsByGroupId[groupId] || {\n          nice: false,\n          type: ScaleType.Linear,\n        }),\n        desiredTickCount,\n      };\n    }\n\n    acc[groupId]!.desiredTickCount = Math.max(\n      acc[groupId]?.desiredTickCount ?? Number.NEGATIVE_INFINITY,\n      desiredTickCount,\n    );\n\n    return acc;\n  }, {});\n  return { x, y };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getAxisSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { mergePartial } from '../../../../utils/common';\nimport { AxisId } from '../../../../utils/ids';\nimport { AxisStyle } from '../../../../utils/themes/theme';\nimport { isVerticalAxis } from '../../utils/axis_type_utils';\n\n/** @internal */\nexport const getAxesStylesSelector = createCustomCachedSelector(\n  [getAxisSpecsSelector, getChartThemeSelector],\n  (axesSpecs, { axes: sharedAxesStyle }): Map<AxisId, AxisStyle | null> =>\n    axesSpecs.reduce((axesStyles, { id, style, gridLine, position }) => {\n      const gridStyle = gridLine && { gridLine: { [isVerticalAxis(position) ? 'vertical' : 'horizontal']: gridLine } };\n      return axesStyles.set(id, style ? mergePartial(sharedAxesStyle, { ...style, ...gridStyle }) : null);\n    }, new Map()),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\n\n/** @internal */\nexport const getBarPaddingsSelector = createCustomCachedSelector(\n  [isHistogramModeEnabledSelector, getChartThemeSelector],\n  (isHistogramMode, chartTheme): number =>\n    isHistogramMode ? chartTheme.scales.histogramPadding : chartTheme.scales.barsPadding,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { SmallMultipleScales } from '../../../../common/panel_utils';\nimport { BrushAxis } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { clamp, isNil, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Point } from '../../../../utils/point';\nimport { isVerticalRotation } from '../utils/common';\n\nconst MIN_AREA_SIZE = 1;\n\nconst getMouseDownPosition = (state: GlobalChartState) => state.interactions.pointer.down?.position;\nconst getCurrentPointerPosition = (state: GlobalChartState) => state.interactions.pointer.current.position;\n\n/** @internal */\nexport const getBrushAreaSelector = createCustomCachedSelector(\n  [\n    getMouseDownPosition,\n    getCurrentPointerPosition,\n    getChartRotationSelector,\n    computeChartDimensionsSelector,\n    getSettingsSpecSelector,\n    computeSmallMultipleScalesSelector,\n  ],\n  (start, end, chartRotation, { chartDimensions }, { brushAxis }, smallMultipleScales): Dimensions | null => {\n    if (!start) {\n      return null;\n    }\n    const plotStartPointPx = getPlotAreaRestrictedPoint(start, chartDimensions);\n    const plotEndPointPx = getPlotAreaRestrictedPoint(end, chartDimensions);\n    const panelPoints = getPointsConstraintToSinglePanel(plotStartPointPx, plotEndPointPx, smallMultipleScales);\n\n    switch (brushAxis) {\n      case BrushAxis.Y:\n        return getBrushForYAxis(chartRotation, panelPoints);\n      case BrushAxis.Both:\n        return getBrushForBothAxis(panelPoints);\n      case BrushAxis.X:\n      default:\n        return getBrushForXAxis(chartRotation, panelPoints);\n    }\n  },\n);\n\n/** @internal */\nexport type PanelPoints = {\n  start: Point;\n  end: Point;\n  hPanelStart: number;\n  hPanelWidth: number;\n  vPanelStart: number;\n  vPanelHeight: number;\n};\n\n/** @internal */\nexport function getPointsConstraintToSinglePanel(\n  startPlotPoint: Point,\n  endPlotPoint: Point,\n  { horizontal, vertical }: SmallMultipleScales,\n): PanelPoints {\n  const hPanel = horizontal.invert(startPlotPoint.x);\n  const vPanel = vertical.invert(startPlotPoint.y);\n\n  const hPanelStart = (!isNil(hPanel) && horizontal.scale(hPanel)) || 0;\n  const hPanelEnd = hPanelStart + horizontal.bandwidth;\n\n  const vPanelStart = (!isNil(vPanel) && vertical.scale(vPanel)) || 0;\n  const vPanelEnd = vPanelStart + vertical.bandwidth;\n\n  const start = {\n    x: clamp(startPlotPoint.x, hPanelStart, hPanelEnd),\n    y: clamp(startPlotPoint.y, vPanelStart, vPanelEnd),\n  };\n  const end = {\n    x: clamp(endPlotPoint.x, hPanelStart, hPanelEnd),\n    y: clamp(endPlotPoint.y, vPanelStart, vPanelEnd),\n  };\n\n  return {\n    start,\n    end,\n    hPanelStart,\n    hPanelWidth: horizontal.bandwidth,\n    vPanelStart,\n    vPanelHeight: vertical.bandwidth,\n  };\n}\n\n/** @internal */\nexport function getPlotAreaRestrictedPoint({ x, y }: Point, { left, top }: Dimensions) {\n  return {\n    x: x - left,\n    y: y - top,\n  };\n}\n\n/** @internal */\nexport function getBrushForXAxis(\n  chartRotation: Rotation,\n  { hPanelStart, vPanelStart, hPanelWidth, vPanelHeight, start, end }: PanelPoints,\n) {\n  const rotated = isVerticalRotation(chartRotation);\n\n  return {\n    left: rotated ? hPanelStart : start.x,\n    top: rotated ? start.y : vPanelStart,\n    height: rotated ? getMinSize(start.y, end.y) : vPanelHeight,\n    width: rotated ? hPanelWidth : getMinSize(start.x, end.x),\n  };\n}\n\n/** @internal */\nexport function getBrushForYAxis(\n  chartRotation: Rotation,\n  { hPanelStart, vPanelStart, hPanelWidth, vPanelHeight, start, end }: PanelPoints,\n) {\n  const rotated = isVerticalRotation(chartRotation);\n\n  return {\n    left: rotated ? start.x : hPanelStart,\n    top: rotated ? vPanelStart : start.y,\n    height: rotated ? vPanelHeight : getMinSize(start.y, end.y),\n    width: rotated ? getMinSize(start.x, end.x) : hPanelWidth,\n  };\n}\n\n/** @internal */\nexport function getBrushForBothAxis({ start, end }: PanelPoints) {\n  return {\n    left: start.x,\n    top: start.y,\n    height: getMinSize(start.y, end.y),\n    width: getMinSize(start.x, end.x),\n  };\n}\n\nfunction getMinSize(a: number, b: number, minSize = MIN_AREA_SIZE) {\n  const size = b - a;\n  if (Math.abs(size) < minSize) {\n    return minSize;\n  }\n  return size;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSeriesSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { SeriesType } from '../../utils/specs';\n\n/** @internal */\nexport const getChartTypeDescriptionSelector = createCustomCachedSelector([getSeriesSpecsSelector], (specs): string => {\n  const seriesTypes = new Set<SeriesType>();\n  specs.forEach((value) => seriesTypes.add(value.seriesType));\n  return seriesTypes.size > 1 ? `Mixed chart: ${[...seriesTypes].join(' and ')} chart` : `${[...seriesTypes]} chart`;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { ComputedScales } from '../utils/types';\n\n/** @internal */\nexport const getComputedScalesSelector = createCustomCachedSelector(\n  [computeSeriesGeometriesSelector],\n  ({ scales }): ComputedScales => scales,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { countBarsInClusterSelector } from './count_bars_in_cluster';\nimport { getGeometriesIndexKeysSelector } from './get_geometries_index_keys';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { PointerPosition } from './get_projected_pointer_position';\nimport { getSeriesSpecsSelector } from './get_specs';\nimport { isTooltipSnapEnableSelector } from './is_tooltip_snap_enabled';\nimport { SmallMultipleScales } from '../../../../common/panel_utils';\nimport { Rect } from '../../../../geoms/types';\nimport { SettingsSpec, PointerEvent } from '../../../../specs/settings';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { isValidPointerOverEvent } from '../../../../utils/events';\nimport { getCursorBandPosition } from '../../crosshair/crosshair_utils';\nimport { ChartDimensions } from '../../utils/dimensions';\nimport { BasicSeriesSpec } from '../../utils/specs';\nimport { isLineAreaOnlyChart } from '../utils/common';\nimport { ComputedGeometries } from '../utils/types';\n\nconst getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer;\n\n/** @internal */\nexport const getCursorBandPositionSelector = createCustomCachedSelector(\n  [\n    getOrientedProjectedPointerPositionSelector,\n    getExternalPointerEventStateSelector,\n    computeChartDimensionsSelector,\n    getSettingsSpecSelector,\n    computeSeriesGeometriesSelector,\n    getSeriesSpecsSelector,\n    countBarsInClusterSelector,\n    isTooltipSnapEnableSelector,\n    getGeometriesIndexKeysSelector,\n    computeSmallMultipleScalesSelector,\n  ],\n  getCursorBand,\n);\n\nfunction getCursorBand(\n  orientedProjectedPointerPosition: PointerPosition,\n  externalPointerEvent: PointerEvent | null,\n  { chartDimensions }: ChartDimensions,\n  settingsSpec: SettingsSpec,\n  { scales: { xScale } }: Pick<ComputedGeometries, 'scales'>,\n  seriesSpecs: BasicSeriesSpec[],\n  totalBarsInCluster: number,\n  isTooltipSnapEnabled: boolean,\n  geometriesIndexKeys: (string | number)[],\n  smallMultipleScales: SmallMultipleScales,\n): (Rect & { fromExternalEvent: boolean }) | undefined {\n  if (!xScale) {\n    return;\n  }\n  // update che cursorBandPosition based on chart configuration\n  const isLineAreaOnly = isLineAreaOnlyChart(seriesSpecs);\n\n  let pointerPosition = { ...orientedProjectedPointerPosition };\n\n  let xValue;\n  let fromExternalEvent = false;\n  // external pointer events takes precedence over the current mouse pointer\n  if (isValidPointerOverEvent(xScale, externalPointerEvent)) {\n    fromExternalEvent = true;\n    if (isNil(externalPointerEvent.x)) {\n      return;\n    }\n    const x = xScale.pureScale(externalPointerEvent.x);\n    if (Number.isNaN(x) || x > chartDimensions.width || x < 0) {\n      return;\n    }\n    pointerPosition = {\n      x,\n      y: 0,\n      verticalPanelValue: null,\n      horizontalPanelValue: null,\n    };\n    xValue = externalPointerEvent.x;\n  } else {\n    xValue = xScale.invertWithStep(orientedProjectedPointerPosition.x, geometriesIndexKeys as number[]).value; // TODO fix this cast\n    if (isNil(xValue) || Number.isNaN(xValue)) {\n      return;\n    }\n  }\n  const { horizontal, vertical } = smallMultipleScales;\n  const topPos =\n    (!isNil(pointerPosition.verticalPanelValue) && vertical.scale(pointerPosition.verticalPanelValue)) || 0;\n  const leftPos =\n    (!isNil(pointerPosition.horizontalPanelValue) && horizontal.scale(pointerPosition.horizontalPanelValue)) || 0;\n\n  const panel = {\n    width: horizontal.bandwidth,\n    height: vertical.bandwidth,\n    top: chartDimensions.top + topPos,\n    left: chartDimensions.left + leftPos,\n  };\n  const cursorBand = getCursorBandPosition(\n    settingsSpec.rotation,\n    panel,\n    pointerPosition,\n    {\n      value: xValue,\n      withinBandwidth: true,\n    },\n    isTooltipSnapEnabled,\n    xScale,\n    isLineAreaOnly ? 0 : totalBarsInCluster,\n  );\n  return cursorBand && { ...cursorBand, fromExternalEvent };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getProjectedPointerPositionSelector } from './get_projected_pointer_position';\nimport { Line } from '../../../../geoms/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getCursorLinePosition } from '../../crosshair/crosshair_utils';\n\n/** @internal */\nexport const getCursorLinePositionSelector = createCustomCachedSelector(\n  [computeChartDimensionsSelector, getSettingsSpecSelector, getProjectedPointerPositionSelector],\n  (chartDimensions, settingsSpec, projectedPointerPosition): Line | undefined =>\n    getCursorLinePosition(settingsSpec.rotation, chartDimensions.chartDimensions, projectedPointerPosition),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getAnnotationTooltipStateSelector } from './get_annotation_tooltip_state';\nimport { getProjectedScaledValues } from './get_projected_scaled_values';\nimport { getHighlightedGeomsSelector } from './get_tooltip_values_highlighted_geoms';\nimport { isBrushAvailableSelector } from './is_brush_available';\nimport { DEFAULT_CSS_CURSOR } from '../../../../common/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isBrushingSelector } from '../../../../state/selectors/is_brushing';\n\nconst getCurrentPointerPositionSelector = (state: GlobalChartState) => state.interactions.pointer.current.position;\nconst getTooltipInteractionStateSelector = (state: GlobalChartState) => state.interactions.tooltip;\n\n/** @internal */\nexport const getPointerCursorSelector = createCustomCachedSelector(\n  [\n    getHighlightedGeomsSelector,\n    getSettingsSpecSelector,\n    getCurrentPointerPositionSelector,\n    getProjectedScaledValues,\n    computeChartDimensionsSelector,\n    isBrushAvailableSelector,\n    getAnnotationTooltipStateSelector,\n    getTooltipInteractionStateSelector,\n    isBrushingSelector,\n  ],\n  (\n    highlightedGeometries,\n    settingsSpec,\n    currentPointerPosition,\n    projectedValues,\n    { chartDimensions },\n    isBrushAvailable,\n    annotationTooltipState,\n    tooltipState,\n    isBrushing,\n  ): CSSProperties['cursor'] => {\n    if (tooltipState.pinned) return;\n    if (isBrushAvailable && isBrushing) return 'crosshair';\n\n    const { x, y } = currentPointerPosition;\n    // get positions relative to chart\n    const xPos = x - chartDimensions.left;\n    const yPos = y - chartDimensions.top;\n\n    // limit cursorPosition to chartDimensions\n    if (xPos < 0 || xPos >= chartDimensions.width || yPos < 0 || yPos >= chartDimensions.height) {\n      return DEFAULT_CSS_CURSOR;\n    }\n    if (highlightedGeometries.length > 0 && settingsSpec.onElementClick) {\n      return 'pointer';\n    }\n    if (highlightedGeometries.length === 0 && settingsSpec.onAnnotationClick && annotationTooltipState) {\n      return 'pointer';\n    }\n    if (projectedValues !== null && settingsSpec.onProjectionClick) {\n      return 'pointer';\n    }\n    return isBrushAvailable ? 'crosshair' : DEFAULT_CSS_CURSOR;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesGeometriesSelector } from './compute_axes_geometries';\nimport { computeLegendSelector } from './compute_legend';\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getGridLinesSelector } from './get_grid_lines';\nimport { getAnnotationSpecsSelector, getAxisSpecsSelector } from './get_specs';\nimport { LegendItem } from '../../../../common/legend';\nimport { getPredicateFn, Predicate } from '../../../../common/predicate';\nimport { AnnotationSpec, AnnotationType, AxisSpec } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport {\n  DebugState,\n  DebugStateAnnotations,\n  DebugStateArea,\n  DebugStateAxes,\n  DebugStateBar,\n  DebugStateLegend,\n  DebugStateLine,\n  DebugStateValue,\n} from '../../../../state/types';\nimport { Rotation } from '../../../../utils/common';\nimport { AreaGeometry, BandedAccessorType, BarGeometry, LineGeometry, PerPanel } from '../../../../utils/geometry';\nimport { mergeWithDefaultAnnotationLine, mergeWithDefaultAnnotationRect } from '../../../../utils/themes/merge_utils';\nimport { FillStyle, Opacity, StrokeStyle, Visible } from '../../../../utils/themes/theme';\nimport { isHorizontalAxis, isVerticalAxis } from '../../utils/axis_type_utils';\nimport { AxisGeometry } from '../../utils/axis_utils';\nimport { LinesGrid } from '../../utils/grid_lines';\nimport { isHorizontalRotation, isVerticalRotation } from '../utils/common';\n\n/**\n * Returns a stringified version of the `debugState`\n * @internal\n */\nexport const getDebugStateSelector = createCustomCachedSelector(\n  [\n    computeSeriesGeometriesSelector,\n    computeLegendSelector,\n    computeAxesGeometriesSelector,\n    getGridLinesSelector,\n    getAxisSpecsSelector,\n    getSettingsSpecSelector,\n    getAnnotationSpecsSelector,\n  ],\n  ({ geometries }, legend, axes, gridLines, axesSpecs, { rotation, locale }, annotations): DebugState => {\n    const seriesNameMap = getSeriesNameMap(legend);\n    return {\n      legend: getLegendState(legend),\n      axes: getAxes(axes, axesSpecs, gridLines, rotation, locale),\n      areas: geometries.areas.map(getAreaState(seriesNameMap)),\n      lines: geometries.lines.map(getLineState(seriesNameMap)),\n      bars: getBarsState(seriesNameMap, geometries.bars),\n      annotations: getAnnotationsState(annotations),\n    };\n  },\n);\n\nfunction getAxes(\n  axesGeoms: AxisGeometry[],\n  axesSpecs: AxisSpec[],\n  gridLines: LinesGrid[],\n  rotation: Rotation,\n  locale: string,\n): DebugStateAxes {\n  return axesSpecs.reduce<DebugStateAxes>(\n    (acc, { position, title, id }) => {\n      const geom = axesGeoms.find(({ axis }) => axis.id === id);\n      if (!geom) {\n        return acc;\n      }\n\n      const isXAxis =\n        (isHorizontalAxis(position) && isHorizontalRotation(rotation)) ||\n        (isVerticalAxis(position) && isVerticalRotation(rotation));\n\n      // sorted starting from the axis origin\n      const sortingOrder = isHorizontalAxis(position)\n        ? rotation === 0 || rotation === 90\n          ? Predicate.NumAsc\n          : Predicate.NumDesc\n        : rotation === 0 || rotation === -90\n          ? Predicate.NumDesc\n          : Predicate.NumAsc;\n      const visibleTicks = geom.visibleTicks\n        .filter(({ label }) => label !== '')\n        .sort(getPredicateFn(sortingOrder, locale, 'position'));\n\n      const labels = visibleTicks.map(({ label }) => label);\n      const values = visibleTicks.map(({ value }) => value);\n\n      const gridlines = gridLines\n        .flatMap(({ lineGroups }) => lineGroups.find(({ axisId }) => axisId === geom.axis.id)?.lines ?? [])\n        .map(({ x1: x, y1: y }) => ({ x, y }));\n\n      acc[isXAxis ? 'x' : 'y'].push({\n        id,\n        title,\n        position,\n        labels,\n        values,\n        gridlines,\n      });\n\n      return acc;\n    },\n    { x: [], y: [] },\n  );\n}\n\nfunction getBarsState(\n  seriesNameMap: Map<string, string>,\n  barGeometries: Array<PerPanel<BarGeometry[]>>,\n): DebugStateBar[] {\n  const buckets = new Map<string, DebugStateBar>();\n  const bars = barGeometries.reduce<BarGeometry[]>((acc, { value }) => {\n    return [...acc, ...value];\n  }, []);\n  bars.forEach(\n    ({\n      color,\n      seriesIdentifier: { key },\n      seriesStyle: { rect, rectBorder },\n      value: { x, y, mark },\n      displayValue,\n    }: BarGeometry) => {\n      const label = displayValue?.text;\n      const name = seriesNameMap.get(key) ?? '';\n      const bucket: DebugStateBar = buckets.get(key) ?? {\n        key,\n        name,\n        color,\n        bars: [],\n        labels: [],\n        visible: hasVisibleStyle(rect) || hasVisibleStyle(rectBorder),\n      };\n\n      bucket.bars.push({ x, y, mark });\n\n      if (label) {\n        bucket.labels.push(label);\n      }\n\n      buckets.set(key, bucket);\n\n      return buckets;\n    },\n  );\n\n  return [...buckets.values()];\n}\n\nfunction getLineState(seriesNameMap: Map<string, string>) {\n  return ({\n    value: {\n      line: path,\n      points,\n      color,\n      seriesIdentifier: { key },\n      style,\n    },\n  }: PerPanel<LineGeometry>): DebugStateLine => {\n    const name = seriesNameMap.get(key) ?? '';\n\n    return {\n      path,\n      color,\n      key,\n      name,\n      visible: hasVisibleStyle(style.line),\n      visiblePoints: hasVisibleStyle(style.point),\n      points: points.map(({ value: { x, y, mark } }) => ({ x, y, mark })),\n    };\n  };\n}\n\nfunction getAreaState(seriesNameMap: Map<string, string>) {\n  return ({\n    value: {\n      area: path,\n      lines,\n      points,\n      color,\n      seriesIdentifier: { key },\n      style,\n    },\n  }: PerPanel<AreaGeometry>): DebugStateArea => {\n    const [y1Path = '', y0Path] = lines;\n    const linePoints = points.reduce<{\n      y0: DebugStateValue[];\n      y1: DebugStateValue[];\n    }>(\n      (acc, { value: { accessor, ...value } }) => {\n        if (accessor === BandedAccessorType.Y0) {\n          acc.y0.push(value);\n        } else {\n          acc.y1.push(value);\n        }\n\n        return acc;\n      },\n      {\n        y0: [],\n        y1: [],\n      },\n    );\n    const lineVisible = hasVisibleStyle(style.line);\n    const visiblePoints = hasVisibleStyle(style.point);\n    const name = seriesNameMap.get(key) ?? '';\n\n    return {\n      path,\n      color,\n      key,\n      name,\n      visible: hasVisibleStyle(style.area),\n      lines: {\n        y0: y0Path\n          ? {\n              visible: lineVisible,\n              path: y0Path,\n              points: linePoints.y0,\n              visiblePoints,\n            }\n          : undefined,\n        y1: {\n          visible: lineVisible,\n          path: y1Path,\n          points: linePoints.y1,\n          visiblePoints,\n        },\n      },\n    };\n  };\n}\n\n/**\n * returns series key to name mapping\n */\nfunction getSeriesNameMap(legendItems: LegendItem[]): Map<string, string> {\n  return legendItems.reduce((acc, { label: name, seriesIdentifiers }) => {\n    seriesIdentifiers.forEach(({ key }) => {\n      acc.set(key, name);\n    });\n    return acc;\n  }, new Map<string, string>());\n}\n\nfunction getLegendState(legendItems: LegendItem[]): DebugStateLegend {\n  const items = legendItems\n    .filter(({ isSeriesHidden }) => !isSeriesHidden)\n    .flatMap(({ label: name, color, seriesIdentifiers }) => {\n      return seriesIdentifiers.map(({ key }) => ({\n        key,\n        name,\n        color,\n      }));\n    });\n\n  return { items };\n}\n\nfunction getAnnotationsState(annotationSpecs: AnnotationSpec[]): DebugStateAnnotations[] {\n  return annotationSpecs.flatMap<DebugStateAnnotations>((annotation) => {\n    return annotation.dataValues.map((dataValue) => ({\n      data: dataValue,\n      id: annotation.id,\n      style:\n        annotation.annotationType === AnnotationType.Line\n          ? mergeWithDefaultAnnotationLine(annotation?.style)\n          : mergeWithDefaultAnnotationRect(annotation?.style),\n      type: annotation.annotationType,\n      domainType: annotation.annotationType === AnnotationType.Line ? annotation.domainType : undefined,\n    }));\n  });\n}\n\n/**\n * Returns true for styles if they are visible\n * Serves as a catchall for multiple style types\n */\nfunction hasVisibleStyle({\n  visible = true,\n  fill = '#fff',\n  stroke = '#fff',\n  strokeWidth = 1,\n  opacity = 1,\n}: Partial<StrokeStyle & Visible & FillStyle & Opacity>): boolean {\n  return Boolean(visible && opacity > 0 && strokeWidth > 0 && fill && stroke);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { getGeometriesIndexSelector } from './get_geometries_index';\nimport { getGeometriesIndexKeysSelector } from './get_geometries_index_keys';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { PointerPosition } from './get_projected_pointer_position';\nimport { PointerEvent, SettingsSpec } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { isValidPointerOverEvent } from '../../../../utils/events';\nimport { IndexedGeometry } from '../../../../utils/geometry';\nimport { ChartDimensions } from '../../utils/dimensions';\nimport { IndexedGeometryMap } from '../../utils/indexed_geometry_map';\nimport { sortClosestToPoint } from '../utils/common';\nimport { ComputedScales } from '../utils/types';\n\nconst getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer;\n\n/** @internal */\nexport const getElementAtCursorPositionSelector = createCustomCachedSelector(\n  [\n    getOrientedProjectedPointerPositionSelector,\n    getComputedScalesSelector,\n    getGeometriesIndexKeysSelector,\n    getGeometriesIndexSelector,\n    getExternalPointerEventStateSelector,\n    computeChartDimensionsSelector,\n    getSettingsSpecSelector,\n  ],\n  getElementAtCursorPosition,\n);\n\nfunction getElementAtCursorPosition(\n  orientedProjectedPointerPosition: PointerPosition,\n  scales: ComputedScales,\n  geometriesIndexKeys: (string | number)[],\n  geometriesIndex: IndexedGeometryMap,\n  externalPointerEvent: PointerEvent | null,\n  { chartDimensions }: ChartDimensions,\n  { pointBuffer }: SettingsSpec,\n): IndexedGeometry[] {\n  if (isValidPointerOverEvent(scales.xScale, externalPointerEvent)) {\n    if (isNil(externalPointerEvent.x)) {\n      return [];\n    }\n\n    const x = scales.xScale.pureScale(externalPointerEvent.x);\n\n    if (Number.isNaN(x) || x > chartDimensions.width + chartDimensions.left || x < 0) {\n      return [];\n    }\n    // TODO: Handle external event with spatial points\n    return geometriesIndex.find(externalPointerEvent.x, pointBuffer, { x: -1, y: -1 });\n  }\n  const xValue = scales.xScale.invertWithStep(\n    orientedProjectedPointerPosition.x,\n    geometriesIndexKeys as number[],\n  ).value;\n  if (isNil(xValue) || Number.isNaN(xValue)) {\n    return [];\n  }\n  // get the elements at cursor position\n  return geometriesIndex\n    .find(\n      xValue,\n      pointBuffer,\n      orientedProjectedPointerPosition,\n      orientedProjectedPointerPosition.horizontalPanelValue,\n      orientedProjectedPointerPosition.verticalPanelValue,\n    )\n    .sort(sortClosestToPoint(orientedProjectedPointerPosition));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { IndexedGeometryMap } from '../../utils/indexed_geometry_map';\n\n/** @internal */\nexport const getGeometriesIndexSelector = createCustomCachedSelector(\n  [computeSeriesGeometriesSelector],\n  ({ geometriesIndex }): IndexedGeometryMap => geometriesIndex,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { compareByValueAsc } from '../../../../utils/common';\n\n/** @internal */\nexport const getGeometriesIndexKeysSelector = createCustomCachedSelector(\n  [computeSeriesGeometriesSelector],\n  (seriesGeometries): (number | string)[] => seriesGeometries.geometriesIndex.keys().sort(compareByValueAsc),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAxesGeometriesSelector } from './compute_axes_geometries';\nimport { getAxisSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getGridLines } from '../../utils/grid_lines';\n\n/** @internal */\nexport const getGridLinesSelector = createCustomCachedSelector(\n  [getAxisSpecsSelector, computeAxesGeometriesSelector, getChartThemeSelector, computeSmallMultipleScalesSelector],\n  getGridLines,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getMultipleRectangleAnnotations } from './get_multiple_rectangle_annotations';\nimport { getAnnotationSpecsSelector } from './get_specs';\nimport { getHighlightedGeomsSelector } from './get_tooltip_values_highlighted_geoms';\nimport { DOMElementType } from '../../../../state/actions/dom_element';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { AnnotationType } from '../../utils/specs';\n\nconst getHoveredDOMElement = (state: GlobalChartState) => state.interactions.hoveredDOMElement;\n\n/** @internal */\nexport const getHighlightedAnnotationIdsSelector = createCustomCachedSelector(\n  [getHoveredDOMElement, getMultipleRectangleAnnotations, getAnnotationSpecsSelector, getHighlightedGeomsSelector],\n  (hoveredDOMElement, rectAnnotationTooltips, specs, highlightedGeoms): string[] => {\n    // TODO: Remove when annotation tooltip is integrated into main tooltip\n    // This check is to prevent annotation fading when annotation is behind an actively hovered geometry element\n    if (highlightedGeoms.length > 0) return [];\n\n    // TODO: restore when rect annotation usage is determined\n    const ids: string[] = (rectAnnotationTooltips ?? [])\n      .filter(({ annotationType, isVisible }) => isVisible && annotationType === AnnotationType.Rectangle)\n      .map(({ id }) => id);\n\n    if (hoveredDOMElement?.type === DOMElementType.LineAnnotationMarker && hoveredDOMElement?.id) {\n      ids.push(hoveredDOMElement.id);\n    }\n    return ids;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { LegendItem } from '../../../../common/legend';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\nconst getHighlightedLegendPath = (state: GlobalChartState) => state.interactions.highlightedLegendPath;\n\n/** @internal */\nexport const getHighlightedSeriesSelector = createCustomCachedSelector(\n  [getHighlightedLegendPath, computeLegendSelector],\n  (highlightedLegendPaths, legendItems): LegendItem | undefined => {\n    if (highlightedLegendPaths.length > 0) {\n      const lookup = new Set(highlightedLegendPaths.map(({ value }) => value));\n      return legendItems.find(({ seriesIdentifiers }) => seriesIdentifiers.some(({ key }) => lookup.has(key)));\n    }\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { getTooltipInfoAndGeomsSelector } from './get_tooltip_values_highlighted_geoms';\nimport { LegendItemExtraValues } from '../../../../common/legend';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { ScaleType } from '../../../../scales/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLegendItemExtraValues } from '../../tooltip/tooltip';\n\nconst EMPTY_MAP = new Map();\n/** @internal */\nexport const getLegendItemExtraValuesSelector = createCustomCachedSelector(\n  [getTooltipInfoAndGeomsSelector, getComputedScalesSelector],\n  ({ tooltip: { values } }, { xScale: { type } }): Map<SeriesKey, LegendItemExtraValues> =>\n    // See https://github.com/elastic/elastic-charts/issues/2050\n    type === ScaleType.Ordinal ? EMPTY_MAP : getLegendItemExtraValues(values),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { LegendItemLabel } from '../../../../state/selectors/get_legend_items_labels';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/** @internal */\nexport const getLegendItemsLabelsSelector = createCustomCachedSelector(\n  [computeLegendSelector, getSettingsSpecSelector],\n  (legendItems, { showLegendExtra }): LegendItemLabel[] =>\n    legendItems.map(({ label, defaultExtra }) => ({\n      label:\n        defaultExtra && (defaultExtra.legendSizingLabel ?? null) !== null\n          ? `${label}${showLegendExtra ? defaultExtra.legendSizingLabel : ''}`\n          : label,\n      depth: 0,\n    })),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeAnnotationDimensionsSelector } from './compute_annotations';\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getTooltipStateForDOMElements } from './get_annotation_tooltip_state';\nimport { getAnnotationSpecsSelector } from './get_specs';\nimport { getTooltipInfoSelector } from './get_tooltip_values_highlighted_geoms';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport { DOMElement } from '../../../../state/actions/dom_element';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { AnnotationId } from '../../../../utils/ids';\nimport { Point } from '../../../../utils/point';\nimport { computeMultipleRectAnnotationTooltipState } from '../../annotations/tooltip';\nimport { AnnotationTooltipState, AnnotationDimensions } from '../../annotations/types';\nimport { AnnotationSpec, AnnotationType } from '../../utils/specs';\n\nconst getCurrentPointerPosition = (state: GlobalChartState) => state.interactions.pointer.current.position;\nconst getHoveredDOMElement = (state: GlobalChartState) => state.interactions.hoveredDOMElement;\n\n/** @internal */\nexport const getMultipleRectangleAnnotations = createCustomCachedSelector(\n  [\n    getCurrentPointerPosition,\n    computeChartDimensionsSelector,\n    getChartRotationSelector,\n    getAnnotationSpecsSelector,\n    computeAnnotationDimensionsSelector,\n    getTooltipInfoSelector,\n    getHoveredDOMElement,\n  ],\n  getMultipleRectangularAnnotationTooltipState,\n);\n\nfunction getMultipleRectangularAnnotationTooltipState(\n  cursorPosition: Point,\n  {\n    chartDimensions,\n  }: {\n    chartDimensions: Dimensions;\n  },\n  chartRotation: Rotation,\n  annotationSpecs: AnnotationSpec[],\n  annotationDimensions: Map<AnnotationId, AnnotationDimensions>,\n  tooltip: TooltipInfo,\n  hoveredDOMElement: DOMElement | null,\n): AnnotationTooltipState[] | null {\n  // capture line marker\n  const hoveredTooltip = getTooltipStateForDOMElements(\n    chartDimensions,\n    annotationSpecs,\n    annotationDimensions,\n    hoveredDOMElement,\n  );\n\n  if (hoveredTooltip) {\n    return [hoveredTooltip];\n  }\n  const tooltipState = computeMultipleRectAnnotationTooltipState(\n    cursorPosition,\n    annotationDimensions,\n    annotationSpecs,\n    chartRotation,\n    chartDimensions,\n  );\n\n  // If there's a highlighted chart element tooltip value, don't show annotation tooltip\n  const isChartTooltipDisplayed = tooltip.values.some(({ isHighlighted }) => isHighlighted);\n  tooltipState?.forEach((rectAnnotation) => {\n    if (\n      tooltipState &&\n      rectAnnotation.isVisible &&\n      rectAnnotation.annotationType === AnnotationType.Rectangle &&\n      isChartTooltipDisplayed\n    ) {\n      return null;\n    }\n  });\n  return tooltipState;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getProjectedPointerPositionSelector, PointerPosition } from './get_projected_pointer_position';\nimport { SmallMultipleScales, getPanelSize } from '../../../../common/panel_utils';\nimport { SettingsSpec } from '../../../../specs/settings';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getOrientedXPosition, getOrientedYPosition } from '../../utils/interactions';\n\n/** @internal */\nexport const getOrientedProjectedPointerPositionSelector = createCustomCachedSelector(\n  [getProjectedPointerPositionSelector, getSettingsSpecSelector, computeSmallMultipleScalesSelector],\n  getOrientedProjectedPointerPosition,\n);\n\nfunction getOrientedProjectedPointerPosition(\n  { x, y, horizontalPanelValue, verticalPanelValue }: PointerPosition,\n  settingsSpec: SettingsSpec,\n  scales: SmallMultipleScales,\n): PointerPosition {\n  // get the oriented projected pointer position\n  const panel = getPanelSize(scales);\n  return {\n    x: getOrientedXPosition(x, y, settingsSpec.rotation, panel),\n    y: getOrientedYPosition(x, y, settingsSpec.rotation, panel),\n    horizontalPanelValue,\n    verticalPanelValue,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { SmallMultipleScales } from '../../../../common/panel_utils';\nimport { ScaleBand } from '../../../../scales/scale_band';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getActivePointerPosition } from '../../../../state/selectors/get_active_pointer_position';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { Point } from '../../../../utils/point';\nimport { PrimitiveValue } from '../../../partition_chart/layout/utils/group_by_rollup';\n\n/** @internal */\nexport type PointerPosition = Point & { horizontalPanelValue: PrimitiveValue; verticalPanelValue: PrimitiveValue };\n\n/**\n * Get the x and y pointer position relative to the chart projection area\n * @internal\n */\nexport const getProjectedPointerPositionSelector = createCustomCachedSelector(\n  [getActivePointerPosition, computeChartDimensionsSelector, computeSmallMultipleScalesSelector],\n  (currentPointerPosition, { chartDimensions }, smallMultipleScales): PointerPosition =>\n    getProjectedPointerPosition(currentPointerPosition, chartDimensions, smallMultipleScales),\n);\n\n/**\n * Get the x and y pointer position relative to the chart projection area\n * @param chartAreaPointerPosition the pointer position relative to the chart area\n * @param horizontal SmallMultipleScales horizontal panel scale\n * @param vertical SmallMultipleScales vertical panel scale\n * @param chartAreaDimensions the chart dimensions\n */\nfunction getProjectedPointerPosition(\n  chartAreaPointerPosition: Point,\n  { left, top, width, height }: Dimensions,\n  { horizontal, vertical }: SmallMultipleScales,\n): PointerPosition {\n  const { x, y } = chartAreaPointerPosition;\n  // get positions relative to chart\n  let xPos = x - left;\n  let yPos = y - top;\n\n  // limit cursorPosition to the chart area\n  if (xPos < 0 || xPos >= width) {\n    xPos = -1;\n  }\n  if (yPos < 0 || yPos >= height) {\n    yPos = -1;\n  }\n  const h = getPosRelativeToPanel(horizontal, xPos);\n  const v = getPosRelativeToPanel(vertical, yPos);\n\n  return {\n    x: h.pos,\n    y: v.pos,\n    horizontalPanelValue: h.value,\n    verticalPanelValue: v.value,\n  };\n}\n\nfunction getPosRelativeToPanel(panelScale: ScaleBand, pos: number): { pos: number; value: PrimitiveValue } {\n  const outerPadding = panelScale.outerPadding * panelScale.step;\n  const innerPadding = panelScale.innerPadding * panelScale.step;\n  const numOfDomainSteps = panelScale.domain.length;\n  const rangeWithoutOuterPaddings = numOfDomainSteps * panelScale.bandwidth + (numOfDomainSteps - 1) * innerPadding;\n\n  if (pos < outerPadding || pos > outerPadding + rangeWithoutOuterPaddings) {\n    return { pos: -1, value: null };\n  }\n  const posWOInitialOuterPadding = pos - outerPadding;\n  const minEqualSteps = (numOfDomainSteps - 1) * panelScale.step;\n  if (posWOInitialOuterPadding <= minEqualSteps) {\n    const relativePosIndex = Math.floor(posWOInitialOuterPadding / panelScale.step);\n    const relativePos = posWOInitialOuterPadding - panelScale.step * relativePosIndex;\n    if (relativePos > panelScale.bandwidth) {\n      return { pos: -1, value: null };\n    }\n    return { pos: relativePos, value: panelScale.domain[relativePosIndex] ?? null };\n  }\n  return {\n    pos: posWOInitialOuterPadding - panelScale.step * (numOfDomainSteps - 1),\n    value: panelScale.domain[numOfDomainSteps - 1] ?? null,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getGeometriesIndexKeysSelector } from './get_geometries_index_keys';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { ProjectedValues } from '../../../../specs/settings';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { isNil } from '../../../../utils/common';\n\n/** @internal */\nexport const getProjectedScaledValues = createCustomCachedSelector(\n  [getOrientedProjectedPointerPositionSelector, computeSeriesGeometriesSelector, getGeometriesIndexKeysSelector],\n  (\n    { x, y, verticalPanelValue, horizontalPanelValue },\n    { scales: { xScale, yScales } },\n    geometriesIndexKeys,\n  ): ProjectedValues | undefined => {\n    if (!xScale || x === -1) {\n      return;\n    }\n\n    const xValue = xScale.invertWithStep(x, geometriesIndexKeys as number[]).value; // TODO fix this cast\n    if (isNil(xValue) || Number.isNaN(xValue)) {\n      return;\n    }\n\n    return {\n      x: xValue,\n      y: [...yScales.entries()].map(([groupId, yScale]) => ({ value: yScale.invert(y), groupId })),\n      smVerticalValue: verticalPanelValue,\n      smHorizontalValue: horizontalPanelValue,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { Color } from '../../../../common/colors';\nimport { SeriesKey } from '../../../../common/series_id';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartThemeSelector } from '../../../../state/selectors/get_chart_theme';\nimport { getSeriesColors } from '../../utils/series';\nimport { getCustomSeriesColors } from '../utils/utils';\n\nfunction getColorOverrides({ colors }: GlobalChartState) {\n  return colors;\n}\n\n/** @internal */\nexport const getSeriesColorsSelector = createCustomCachedSelector(\n  [computeSeriesDomainsSelector, getChartThemeSelector, getColorOverrides],\n  (seriesDomainsAndData, chartTheme, colorOverrides): Map<SeriesKey, Color> => {\n    const updatedCustomSeriesColors = getCustomSeriesColors(seriesDomainsAndData.formattedDataSeries);\n    return getSeriesColors(\n      seriesDomainsAndData.formattedDataSeries,\n      chartTheme.colors,\n      updatedCustomSeriesColors,\n      colorOverrides,\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { DataSeries, getSeriesKey } from '../../utils/series';\n\n/** @internal */\nexport const getSiDataSeriesMapSelector = createCustomCachedSelector(\n  [computeSeriesDomainsSelector],\n  ({ formattedDataSeries }) => {\n    return formattedDataSeries.reduce<Record<string, DataSeries>>((acc, dataSeries) => {\n      const seriesKey = getSeriesKey(dataSeries, dataSeries.groupId);\n      acc[seriesKey] = dataSeries;\n      return acc;\n    }, {});\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../..';\nimport { SpecType } from '../../../../specs/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSpecs } from '../../../../state/selectors/get_specs';\nimport { getSpecsFromStore } from '../../../../state/utils';\nimport { AnnotationSpec, AxisSpec, BasicSeriesSpec } from '../../utils/specs';\n\n/** @internal */\nexport const getAxisSpecsSelector = createCustomCachedSelector([getSpecs], (specs): AxisSpec[] =>\n  getSpecsFromStore<AxisSpec>(specs, ChartType.XYAxis, SpecType.Axis),\n);\n\n/** @internal */\nexport const axisSpecsLookupSelector = createCustomCachedSelector(\n  getAxisSpecsSelector,\n  (axisSpecs: AxisSpec[]): Map<string, AxisSpec> => axisSpecs.reduce((acc, spec) => acc.set(spec.id, spec), new Map()),\n);\n\n/** @internal */\nexport const getSeriesSpecsSelector = createCustomCachedSelector([getSpecs], (specs) => {\n  return getSpecsFromStore<BasicSeriesSpec>(specs, ChartType.XYAxis, SpecType.Series);\n});\n\n/** @internal */\nexport const getAnnotationSpecsSelector = createCustomCachedSelector([getSpecs], (specs) =>\n  getSpecsFromStore<AnnotationSpec>(specs, ChartType.XYAxis, SpecType.Annotation),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getCursorBandPositionSelector } from './get_cursor_band';\nimport { getProjectedPointerPositionSelector } from './get_projected_pointer_position';\nimport { AnchorPosition } from '../../../../components/portal/types';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { isNil } from '../../../../utils/common';\nimport { getTooltipAnchorPosition } from '../../crosshair/crosshair_utils';\n\n/** @internal */\nexport const getTooltipAnchorPositionSelector = createCustomCachedSelector(\n  [\n    computeChartDimensionsSelector,\n    getSettingsSpecSelector,\n    getCursorBandPositionSelector,\n    getProjectedPointerPositionSelector,\n    computeSmallMultipleScalesSelector,\n    getTooltipSpecSelector,\n  ],\n  (\n    chartDimensions,\n    settings,\n    cursorBandPosition,\n    projectedPointerPosition,\n    { horizontal, vertical },\n    tooltip,\n  ): AnchorPosition | null => {\n    if (!cursorBandPosition) {\n      return null;\n    }\n\n    const topPos =\n      (!isNil(projectedPointerPosition.verticalPanelValue) &&\n        vertical.scale(projectedPointerPosition.verticalPanelValue)) ||\n      0;\n    const leftPos =\n      (!isNil(projectedPointerPosition.horizontalPanelValue) &&\n        horizontal.scale(projectedPointerPosition.horizontalPanelValue)) ||\n      0;\n\n    const panel = {\n      width: horizontal.bandwidth,\n      height: vertical.bandwidth,\n      top: chartDimensions.chartDimensions.top + topPos,\n      left: chartDimensions.chartDimensions.left + leftPos,\n    };\n\n    return getTooltipAnchorPosition(\n      settings.rotation,\n      cursorBandPosition,\n      projectedPointerPosition,\n      panel,\n      tooltip.stickTo,\n    );\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { getElementAtCursorPositionSelector } from './get_elements_at_cursor_pos';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { getProjectedPointerPositionSelector } from './get_projected_pointer_position';\nimport { getSiDataSeriesMapSelector } from './get_si_dataseries_map';\nimport { getSeriesSpecsSelector, getAxisSpecsSelector } from './get_specs';\nimport { hasSingleSeriesSelector } from './has_single_series';\nimport { TooltipInfo } from '../../../../components/tooltip/types';\nimport {\n  PointerEvent,\n  isPointerOutEvent,\n  TooltipValue,\n  isFollowTooltipType,\n  SettingsSpec,\n  getTooltipType,\n  TooltipSpec,\n} from '../../../../specs';\nimport { TooltipType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartRotationSelector } from '../../../../state/selectors/get_chart_rotation';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\nimport { PointerValue } from '../../../../state/types';\nimport { isNil, Rotation } from '../../../../utils/common';\nimport { isValidPointerOverEvent } from '../../../../utils/events';\nimport { IndexedGeometry } from '../../../../utils/geometry';\nimport { Point } from '../../../../utils/point';\nimport { getTooltipCompareFn } from '../../../../utils/series_sort';\nimport { isPointOnGeometry } from '../../rendering/utils';\nimport { formatTooltipHeader, formatTooltipValue } from '../../tooltip/tooltip';\nimport { defaultXYLegendSeriesSort } from '../../utils/default_series_sort_fn';\nimport { DataSeries, isBandedSpec } from '../../utils/series';\nimport { BasicSeriesSpec, AxisSpec } from '../../utils/specs';\nimport { getAxesSpecForSpecId, getSpecDomainGroupId, getSpecsById } from '../utils/spec';\nimport { ComputedScales } from '../utils/types';\n\nconst EMPTY_VALUES = Object.freeze({\n  tooltip: {\n    header: null,\n    values: [],\n  },\n  highlightedGeometries: [],\n});\n\n/** @internal */\nexport interface TooltipAndHighlightedGeoms {\n  tooltip: TooltipInfo;\n  highlightedGeometries: IndexedGeometry[];\n}\n\nconst getExternalPointerEventStateSelector = (state: GlobalChartState) => state.externalEvents.pointer;\n\n/** @internal */\nexport const getTooltipInfoAndGeomsSelector = createCustomCachedSelector(\n  [\n    getSeriesSpecsSelector,\n    getAxisSpecsSelector,\n    getSettingsSpecSelector,\n    getProjectedPointerPositionSelector,\n    getOrientedProjectedPointerPositionSelector,\n    getChartRotationSelector,\n    hasSingleSeriesSelector,\n    getComputedScalesSelector,\n    getElementAtCursorPositionSelector,\n    getSiDataSeriesMapSelector,\n    getExternalPointerEventStateSelector,\n    getTooltipSpecSelector,\n  ],\n  getTooltipAndHighlightFromValue,\n);\n\nfunction getTooltipAndHighlightFromValue(\n  seriesSpecs: BasicSeriesSpec[],\n  axesSpecs: AxisSpec[],\n  settings: SettingsSpec,\n  projectedPointerPosition: Point,\n  orientedProjectedPointerPosition: Point,\n  chartRotation: Rotation,\n  hasSingleSeries: boolean,\n  scales: ComputedScales,\n  matchingGeoms: IndexedGeometry[],\n  serialIdentifierDataSeriesMap: Record<string, DataSeries>,\n  externalPointerEvent: PointerEvent | null,\n  tooltip: TooltipSpec,\n): TooltipAndHighlightedGeoms {\n  if (!scales.xScale || !scales.yScales) {\n    return EMPTY_VALUES;\n  }\n\n  let { x, y } = orientedProjectedPointerPosition;\n  let tooltipType = getTooltipType(tooltip, settings);\n  if (isValidPointerOverEvent(scales.xScale, externalPointerEvent)) {\n    tooltipType = getTooltipType(tooltip, settings, true);\n    if (isNil(externalPointerEvent.x)) {\n      return EMPTY_VALUES;\n    }\n    const scaledX = scales.xScale.pureScale(externalPointerEvent.x);\n\n    if (Number.isNaN(scaledX)) {\n      return EMPTY_VALUES;\n    }\n\n    x = scaledX;\n    y = 0;\n  } else if (projectedPointerPosition.x === -1 || projectedPointerPosition.y === -1) {\n    return EMPTY_VALUES;\n  }\n\n  if (tooltipType === TooltipType.None && !externalPointerEvent) {\n    return EMPTY_VALUES;\n  }\n\n  if (matchingGeoms.length === 0) {\n    return EMPTY_VALUES;\n  }\n\n  // build the tooltip value list\n  let header: PointerValue | null = null;\n  const highlightedGeometries: IndexedGeometry[] = [];\n  const xValues = new Set<any>();\n  const hideNullValues = !tooltip.showNullValues;\n  const values = matchingGeoms.reduce<TooltipValue[]>((acc, indexedGeometry) => {\n    if (hideNullValues && indexedGeometry.value.y === null) {\n      return acc;\n    }\n    const {\n      seriesIdentifier: { specId },\n    } = indexedGeometry;\n    const spec = getSpecsById<BasicSeriesSpec>(seriesSpecs, specId);\n\n    // safe guard check\n    if (!spec) {\n      return acc;\n    }\n    const { xAxis, yAxis } = getAxesSpecForSpecId(axesSpecs, spec.groupId, chartRotation);\n\n    // yScales is ensured by the enclosing if\n    const yScale = scales.yScales.get(getSpecDomainGroupId(spec));\n    if (!yScale) {\n      return acc;\n    }\n\n    // check if the pointer is on the geometry (avoid checking if using external pointer event)\n    let isHighlighted = false;\n    if (\n      (!externalPointerEvent || isPointerOutEvent(externalPointerEvent)) &&\n      isPointOnGeometry(x, y, indexedGeometry, settings.pointBuffer)\n    ) {\n      isHighlighted = true;\n      highlightedGeometries.push(indexedGeometry);\n    }\n\n    // format the tooltip values\n    const formattedTooltip = formatTooltipValue(\n      indexedGeometry,\n      spec,\n      isHighlighted,\n      hasSingleSeries,\n      isBandedSpec(spec),\n      yAxis,\n    );\n\n    // format only one time the x value\n    if (!header) {\n      // if we have a tooltipHeaderFormatter, then don't pass in the xAxis as the user will define a formatter\n      const formatterAxis = tooltip.headerFormatter ? undefined : xAxis;\n      header = formatTooltipHeader(indexedGeometry, spec, formatterAxis);\n    }\n\n    xValues.add(indexedGeometry.value.x);\n\n    return [...acc, formattedTooltip];\n  }, []);\n\n  if (values.length > 1 && xValues.size === values.length) {\n    // TODO: remove after tooltip redesign\n    header = null;\n  }\n\n  const tooltipSortFn = getTooltipCompareFn((a, b) => {\n    const aDs = serialIdentifierDataSeriesMap[a.key];\n    const bDs = serialIdentifierDataSeriesMap[b.key];\n    return defaultXYLegendSeriesSort(aDs, bDs);\n  });\n\n  const sortedTooltipValues = values.sort((a, b) => {\n    return tooltipSortFn(a.seriesIdentifier, b.seriesIdentifier);\n  });\n\n  return {\n    tooltip: {\n      header,\n      // to avoid creating a breaking change because of a different sorting order on tooltip\n      values: sortedTooltipValues,\n    },\n    highlightedGeometries,\n  };\n}\n\n/** @internal */\nexport const getHighlightedTooltipTooltipValuesSelector = createCustomCachedSelector(\n  [getTooltipInteractionState, getTooltipInfoAndGeomsSelector, getTooltipSpecSelector, getSettingsSpecSelector],\n  ({ pinned }, values, tooltip, settings): TooltipAndHighlightedGeoms => {\n    const tooltipType = getTooltipType(tooltip, settings);\n    const highlightedValues = values.tooltip.values.filter((v) => v.isHighlighted);\n    const hasTooltipContent = values.tooltip.values.length > tooltip.maxTooltipItems && highlightedValues.length > 0;\n\n    if (!pinned && !tooltip.customTooltip && (isFollowTooltipType(tooltipType) || hasTooltipContent)) {\n      return {\n        ...values,\n        tooltip: {\n          ...values.tooltip,\n          values: highlightedValues,\n        },\n      };\n    }\n    return values;\n  },\n);\n\n/** @internal */\nexport const getTooltipInfoSelector = createCustomCachedSelector(\n  [getHighlightedTooltipTooltipValuesSelector],\n  ({ tooltip }): TooltipInfo => tooltip,\n);\n\n/** @internal */\nexport const getHighlightedGeomsSelector = createCustomCachedSelector(\n  [getHighlightedTooltipTooltipValuesSelector],\n  ({ highlightedGeometries }): IndexedGeometry[] => highlightedGeometries,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const hasSingleSeriesSelector = createCustomCachedSelector(\n  [computeSeriesDomainsSelector],\n  (seriesDomainsAndData): boolean =>\n    Boolean(seriesDomainsAndData) && seriesDomainsAndData.formattedDataSeries.length > 1,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getAnnotationTooltipStateSelector } from './get_annotation_tooltip_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\n\n/** @internal */\nexport const isAnnotationTooltipVisibleSelector = createCustomCachedSelector(\n  [getAnnotationTooltipStateSelector],\n  (annotationTooltipState): boolean => annotationTooltipState !== null && annotationTooltipState.isVisible,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { ScaleType } from '../../../../scales/constants';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\n\n/**\n * The brush is available only for Ordinal xScales charts and\n * if we have configured an onBrushEnd listener\n * @internal\n */\nexport const isBrushAvailableSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector, getComputedScalesSelector],\n  (settingsSpec, scales): boolean => scales.xScale.type !== ScaleType.Ordinal && Boolean(settingsSpec.onBrushEnd),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeLegendSelector } from './compute_legend';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { isAllSeriesDeselected } from '../utils/common';\n\n/** @internal */\nexport const isChartEmptySelector = createCustomCachedSelector([computeLegendSelector], (legendItems): boolean =>\n  isAllSeriesDeselected(legendItems),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSeriesSpecsSelector } from './get_specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { isHistogramModeEnabled } from '../utils/utils';\n\n/** @internal */\nexport const isHistogramModeEnabledSelector = createCustomCachedSelector(\n  [getSeriesSpecsSelector],\n  (seriesSpecs): boolean => isHistogramModeEnabled(seriesSpecs),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipSpecSelector } from '../../../../state/selectors/get_tooltip_spec';\n\n/** @internal */\nexport const isTooltipSnapEnableSelector = createCustomCachedSelector(\n  [computeSeriesGeometriesSelector, getTooltipSpecSelector],\n  (seriesGeometries, { snap }) =>\n    (seriesGeometries.scales.xScale && seriesGeometries.scales.xScale.bandwidth > 0) || snap,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isFollowTooltipType, TooltipSpec } from './../../../../specs/tooltip';\nimport { getTooltipSpecSelector } from './../../../../state/selectors/get_tooltip_spec';\nimport { getProjectedPointerPositionSelector } from './get_projected_pointer_position';\nimport { getTooltipInfoAndGeomsSelector, TooltipAndHighlightedGeoms } from './get_tooltip_values_highlighted_geoms';\nimport { isAnnotationTooltipVisibleSelector } from './is_annotation_tooltip_visible';\nimport { TooltipType } from '../../../../specs/constants';\nimport { InteractionsState, TooltipVisibility } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getTooltipInteractionState } from '../../../../state/selectors/get_tooltip_interaction_state';\nimport { isExternalTooltipVisibleSelector } from '../../../../state/selectors/is_external_tooltip_visible';\nimport { Point } from '../../../../utils/point';\n\n/** @internal */\nexport const isTooltipVisibleSelector = createCustomCachedSelector(\n  [\n    getTooltipSpecSelector,\n    getTooltipInteractionState,\n    getProjectedPointerPositionSelector,\n    getTooltipInfoAndGeomsSelector,\n    isAnnotationTooltipVisibleSelector,\n    isExternalTooltipVisibleSelector,\n  ],\n  isTooltipVisible,\n);\n\nfunction isTooltipVisible(\n  { type: tooltipType, maxTooltipItems }: TooltipSpec,\n  { pinned }: InteractionsState['tooltip'],\n  projectedPointerPosition: Point,\n  { tooltip, highlightedGeometries }: TooltipAndHighlightedGeoms,\n  isAnnotationTooltipVisible: boolean,\n  externalTooltipVisible: boolean,\n): TooltipVisibility {\n  const visibleTooltip = isFollowTooltipType(tooltipType)\n    ? highlightedGeometries\n    : tooltip.values.length > maxTooltipItems && highlightedGeometries.length > 0\n      ? highlightedGeometries\n      : tooltip.values;\n  const isLocalTooltip =\n    tooltipType !== TooltipType.None &&\n    projectedPointerPosition.x > -1 &&\n    projectedPointerPosition.y > -1 &&\n    visibleTooltip.length > 0 &&\n    !isAnnotationTooltipVisible;\n  const isExternalTooltip = externalTooltipVisible && visibleTooltip.length > 0;\n\n  return {\n    visible: isLocalTooltip || isExternalTooltip || pinned,\n    isExternal: externalTooltipVisible,\n    displayOnly: false,\n    isPinnable: tooltip.values.length > 0,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Rotation } from '../../../../utils/common';\nimport { GroupId } from '../../../../utils/ids';\nimport { isXDomain } from '../../utils/axis_utils';\nimport { AxisSpec, YDomainRange } from '../../utils/specs';\n\n/** @internal */\nexport function mergeYCustomDomainsByGroupId(\n  axesSpecs: AxisSpec[],\n  chartRotation: Rotation,\n): Map<GroupId, YDomainRange> {\n  const domainsByGroupId = new Map<GroupId, YDomainRange>();\n\n  axesSpecs.forEach((spec: AxisSpec) => {\n    const { id, groupId, domain } = spec;\n\n    if (!domain) return;\n\n    if (isXDomain(spec.position, chartRotation)) {\n      throw new Error(`[Axis ${id}]: custom domain for xDomain should be defined in Settings`);\n    }\n\n    if (domain.min > domain.max) {\n      throw new Error(`[Axis ${id}]: custom domain is invalid, min is greater than max`);\n    }\n\n    const prevGroupDomain = domainsByGroupId.get(groupId);\n\n    if (prevGroupDomain) {\n      const mergedDomain = {\n        min: Math.min(\n          Number.isFinite(domain.min) ? domain.min : Infinity,\n          prevGroupDomain && Number.isFinite(prevGroupDomain.min) ? prevGroupDomain.min : Infinity,\n        ),\n        max: Math.max(\n          Number.isFinite(domain.max) ? domain.max : -Infinity,\n          prevGroupDomain && Number.isFinite(prevGroupDomain.max) ? prevGroupDomain.max : -Infinity,\n        ),\n      };\n\n      if (Number.isFinite(mergedDomain.min) || Number.isFinite(mergedDomain.max)) {\n        domainsByGroupId.set(groupId, mergedDomain);\n      }\n    } else {\n      domainsByGroupId.set(groupId, domain);\n    }\n  });\n  return domainsByGroupId;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { getPlotAreaRestrictedPoint, getPointsConstraintToSinglePanel, PanelPoints } from './get_brush_area';\nimport { getComputedScalesSelector } from './get_computed_scales';\nimport { getSeriesSpecsSelector } from './get_specs';\nimport { isBrushAvailableSelector } from './is_brush_available';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { ChartType } from '../../..';\nimport { SmallMultipleScales } from '../../../../common/panel_utils';\nimport { ScaleContinuous } from '../../../../scales';\nimport { isContinuousScale } from '../../../../scales/types';\nimport { GroupBrushExtent, SeriesSpecs, XYBrushEvent } from '../../../../specs';\nimport { BrushAxis } from '../../../../specs/constants';\nimport { DragState, GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { clamp, Rotation } from '../../../../utils/common';\nimport { Dimensions } from '../../../../utils/dimensions';\nimport { hasDragged, DragCheckProps } from '../../../../utils/events';\nimport { GroupId } from '../../../../utils/ids';\nimport { hasHistogramBarSpec } from '../../domains/y_domain';\nimport { isVerticalRotation } from '../utils/common';\n\nconst getLastDragSelector = (state: GlobalChartState) => state.interactions.pointer.lastDrag;\n\n/**\n * Will call the onBrushEnd listener every time the following preconditions are met:\n * - the onBrushEnd listener is available\n * - we dragged the mouse pointer\n * @internal\n */\nexport function createOnBrushEndCaller(): (state: GlobalChartState) => void {\n  let prevProps: DragCheckProps | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      if (!isBrushAvailableSelector(state)) {\n        selector = null;\n        prevProps = null;\n        return;\n      }\n      selector = createCustomCachedSelector(\n        [\n          getLastDragSelector,\n          getSettingsSpecSelector,\n          getComputedScalesSelector,\n          computeChartDimensionsSelector,\n          isHistogramModeEnabledSelector,\n          computeSmallMultipleScalesSelector,\n          getSeriesSpecsSelector,\n        ],\n        (\n          lastDrag,\n          { onBrushEnd, rotation, brushAxis, minBrushDelta, roundHistogramBrushValues, allowBrushingLastHistogramBin },\n          computedScales,\n          { chartDimensions },\n          histogramMode,\n          smallMultipleScales,\n          seriesSpec,\n        ): void => {\n          const nextProps = {\n            lastDrag,\n            onBrushEnd,\n          };\n          const { yScales, xScale } = computedScales;\n          if (lastDrag !== null && hasDragged(prevProps, nextProps) && onBrushEnd && isContinuousScale(xScale)) {\n            const brushAreaEvent: XYBrushEvent = {};\n\n            if (brushAxis === BrushAxis.X || brushAxis === BrushAxis.Both) {\n              brushAreaEvent.x = getXBrushExtent(\n                chartDimensions,\n                lastDrag,\n                rotation,\n                histogramMode,\n                xScale,\n                smallMultipleScales,\n                allowBrushingLastHistogramBin,\n                seriesSpec,\n                minBrushDelta,\n                roundHistogramBrushValues,\n              );\n            }\n            if (brushAxis === BrushAxis.Y || brushAxis === BrushAxis.Both) {\n              brushAreaEvent.y = getYBrushExtents(\n                chartDimensions,\n                lastDrag,\n                rotation,\n                yScales,\n                smallMultipleScales,\n                minBrushDelta,\n              );\n            }\n            if (brushAreaEvent.x !== undefined || brushAreaEvent.y !== undefined) {\n              onBrushEnd(brushAreaEvent);\n            }\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n\nfunction scalePanelPointsToPanelCoordinates(\n  scaleXPoint: boolean,\n  { start, end, vPanelStart, hPanelStart, vPanelHeight, hPanelWidth }: PanelPoints,\n) {\n  // scale screen coordinates down to panel scale\n  const startPos = scaleXPoint ? start.x - hPanelStart : start.y - vPanelStart;\n  const endPos = scaleXPoint ? end.x - hPanelStart : end.y - vPanelStart;\n  const panelMax = scaleXPoint ? hPanelWidth : vPanelHeight;\n  return {\n    minPos: Math.min(startPos, endPos),\n    maxPos: Math.max(startPos, endPos),\n    panelMax,\n  };\n}\n\nfunction getXBrushExtent(\n  chartDimensions: Dimensions,\n  lastDrag: DragState,\n  rotation: Rotation,\n  histogramMode: boolean,\n  xScale: ScaleContinuous, // brush is available only on continuous scale right now\n  smallMultipleScales: SmallMultipleScales,\n  allowBrushingLastHistogramBin: boolean,\n  seriesSpecs: SeriesSpecs,\n  minBrushDelta?: number,\n  roundHistogramBrushValues?: boolean,\n): [number, number] | undefined {\n  const isXHorizontal = !isVerticalRotation(rotation);\n  // scale screen coordinates down to panel scale\n  const scaledPanelPoints = getMinMaxPos(chartDimensions, lastDrag, smallMultipleScales, isXHorizontal);\n  let { minPos, maxPos } = scaledPanelPoints;\n  // reverse the positions if chart is mirrored\n  if (rotation === -90 || rotation === 180) {\n    minPos = scaledPanelPoints.panelMax - minPos;\n    maxPos = scaledPanelPoints.panelMax - maxPos;\n  }\n  if (minBrushDelta !== undefined ? Math.abs(maxPos - minPos) < minBrushDelta : maxPos === minPos) {\n    // if 0 size brush, avoid computing the value\n    return;\n  }\n  const offset = histogramMode ? 0 : -(xScale.bandwidth + xScale.bandwidthPadding) / 2;\n  const histogramEnabled = hasHistogramBarSpec(seriesSpecs);\n  const invertValue =\n    histogramEnabled && roundHistogramBrushValues\n      ? (value: number) => xScale.invertWithStep(value, xScale.domain).value\n      : (value: number) => xScale.invert(value);\n  const minPosScaled = invertValue(minPos + offset);\n  const maxPosScaled = invertValue(maxPos + offset);\n  const [domainStart, domainEnd] = xScale.domain;\n  const maxDomainValue = domainEnd + (histogramEnabled && allowBrushingLastHistogramBin ? xScale.minInterval : 0);\n\n  const minValue = clamp(minPosScaled, domainStart, maxDomainValue);\n  const maxValue = clamp(minPosScaled, maxPosScaled, maxDomainValue);\n\n  return [minValue, maxValue];\n}\n\nfunction getMinMaxPos(\n  chartDimensions: Dimensions,\n  lastDrag: DragState,\n  smallMultipleScales: SmallMultipleScales,\n  scaleXPoint: boolean,\n) {\n  const panelPoints = getPanelPoints(chartDimensions, lastDrag, smallMultipleScales);\n  // scale screen coordinates down to panel scale\n  return scalePanelPointsToPanelCoordinates(scaleXPoint, panelPoints);\n}\n\nfunction getPanelPoints(chartDimensions: Dimensions, lastDrag: DragState, smallMultipleScales: SmallMultipleScales) {\n  const plotStartPointPx = getPlotAreaRestrictedPoint(lastDrag.start.position, chartDimensions);\n  const plotEndPointPx = getPlotAreaRestrictedPoint(lastDrag.end.position, chartDimensions);\n  return getPointsConstraintToSinglePanel(plotStartPointPx, plotEndPointPx, smallMultipleScales);\n}\n\nfunction getYBrushExtents(\n  chartDimensions: Dimensions,\n  lastDrag: DragState,\n  rotation: Rotation,\n  yScales: Map<GroupId, ScaleContinuous>,\n  smallMultipleScales: SmallMultipleScales,\n  minBrushDelta?: number,\n): GroupBrushExtent[] | undefined {\n  const yValues: GroupBrushExtent[] = [];\n  yScales.forEach((yScale, groupId) => {\n    const isXVertical = isVerticalRotation(rotation);\n    // scale screen coordinates down to panel scale\n    const scaledPanelPoints = getMinMaxPos(chartDimensions, lastDrag, smallMultipleScales, isXVertical);\n    let { minPos, maxPos } = scaledPanelPoints;\n\n    if (rotation === 90 || rotation === 180) {\n      minPos = scaledPanelPoints.panelMax - minPos;\n      maxPos = scaledPanelPoints.panelMax - maxPos;\n    }\n    if (minBrushDelta !== undefined ? Math.abs(maxPos - minPos) < minBrushDelta : maxPos === minPos) {\n      // if 0 size brush, avoid computing the value\n      return;\n    }\n\n    const minPosScaled = yScale.invert(minPos);\n    const maxPosScaled = yScale.invert(maxPos);\n    const [domainStart, domainEnd] = yScale.domain;\n    const minValue = clamp(minPosScaled, domainStart, maxPosScaled);\n    const maxValue = clamp(minPosScaled, maxPosScaled, domainEnd);\n    yValues.push({ extent: [minValue, maxValue], groupId });\n  });\n  return yValues.length === 0 ? undefined : yValues;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { getMultipleRectangleAnnotations } from './get_multiple_rectangle_annotations';\nimport { getProjectedScaledValues } from './get_projected_scaled_values';\nimport { getHighlightedGeomsSelector } from './get_tooltip_values_highlighted_geoms';\nimport { ChartType } from '../../..';\nimport {\n  AnnotationType,\n  LineAnnotationDatum,\n  ProjectedValues,\n  RectAnnotationDatum,\n  SettingsSpec,\n} from '../../../../specs';\nimport { GlobalChartState, PointerState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getLastClickSelector } from '../../../../state/selectors/get_last_click';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isClicking } from '../../../../state/utils';\nimport { IndexedGeometry, GeometryValue } from '../../../../utils/geometry';\nimport { AnnotationTooltipState } from '../../annotations/types';\nimport { XYChartSeriesIdentifier } from '../../utils/series';\n\n/**\n * Will call the onElementClick listener every time the following preconditions are met:\n * - the onElementClick listener is available\n * - we have at least one highlighted geometry\n * - the pointer state goes from down state to up state\n * @internal\n */\nexport function createOnClickCaller(): (state: GlobalChartState) => void {\n  let prevClick: PointerState | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector) {\n      return selector(state);\n    }\n    if (state.chartType !== ChartType.XYAxis) {\n      return;\n    }\n    selector = createCustomCachedSelector(\n      [\n        getLastClickSelector,\n        getSettingsSpecSelector,\n        getHighlightedGeomsSelector,\n        getProjectedScaledValues,\n        getMultipleRectangleAnnotations,\n      ],\n      (\n        lastClick: PointerState | null,\n        { onElementClick, onProjectionClick, onAnnotationClick }: SettingsSpec,\n        indexedGeometries: IndexedGeometry[],\n        values,\n        tooltipStates,\n      ): void => {\n        if (!isClicking(prevClick, lastClick)) {\n          return;\n        }\n        const elementClickFired = tryFiringOnElementClick(indexedGeometries, onElementClick);\n        if (!elementClickFired && onAnnotationClick && tooltipStates) {\n          tryFiringOnAnnotationClick(tooltipStates, onAnnotationClick, indexedGeometries);\n        } else if (!elementClickFired) {\n          tryFiringOnProjectionClick(values, onProjectionClick);\n        }\n        prevClick = lastClick;\n      },\n    );\n  };\n}\n\nfunction tryFiringOnElementClick(\n  indexedGeometries: IndexedGeometry[],\n  onElementClick: SettingsSpec['onElementClick'],\n): boolean {\n  if (indexedGeometries.length === 0 || !onElementClick) {\n    return false;\n  }\n  const elements = indexedGeometries.map<[GeometryValue, XYChartSeriesIdentifier]>(({ value, seriesIdentifier }) => [\n    value,\n    seriesIdentifier,\n  ]);\n  onElementClick(elements);\n  return true;\n}\n\nfunction tryFiringOnProjectionClick(\n  values: ProjectedValues | undefined,\n  onProjectionClick: SettingsSpec['onProjectionClick'],\n): boolean {\n  const properClick = values !== undefined && onProjectionClick;\n  if (properClick) onProjectionClick(values);\n  return Boolean(properClick);\n}\n\nfunction tryFiringOnAnnotationClick(\n  annotationState: AnnotationTooltipState[],\n  onAnnotationClick: SettingsSpec['onAnnotationClick'],\n  indexedGeometries: IndexedGeometry[],\n): boolean {\n  if (indexedGeometries.length > 0) return false;\n  if (annotationState.length > 0 && onAnnotationClick) {\n    const rects: { id: string; datum: RectAnnotationDatum }[] = [];\n    const lines: { id: string; datum: LineAnnotationDatum }[] = [];\n    annotationState.forEach((annotation) => {\n      if (annotation.annotationType === AnnotationType.Rectangle) {\n        rects.push({\n          id: annotation.id,\n          datum: annotation.datum as RectAnnotationDatum,\n        });\n      } else if (annotation.annotationType === AnnotationType.Line) {\n        lines.push({\n          id: annotation.id,\n          datum: annotation.datum as LineAnnotationDatum,\n        });\n      }\n    });\n    onAnnotationClick({ rects, lines });\n    return true;\n  }\n  return false;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport {\n  getHighlightedTooltipTooltipValuesSelector,\n  TooltipAndHighlightedGeoms,\n} from './get_tooltip_values_highlighted_geoms';\nimport { ChartType } from '../../..';\nimport { SettingsSpec } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { IndexedGeometry } from '../../../../utils/geometry';\n\ninterface Props {\n  settings: SettingsSpec | undefined;\n  highlightedGeometries: IndexedGeometry[];\n}\n\nconst isOutElement = (prevProps: Props | null, nextProps: Props | null): boolean =>\n  Boolean(\n    prevProps &&\n      nextProps?.settings?.onElementOut &&\n      prevProps.highlightedGeometries.length > 0 &&\n      nextProps.highlightedGeometries.length === 0,\n  );\n\n/**\n * Will call the onElementOut listener every time the following preconditions are met:\n * - the onElementOut listener is available\n * - the highlighted geometries list goes from a list of at least one object to an empty one\n * @internal\n */\nexport function createOnElementOutCaller(): (state: GlobalChartState) => void {\n  let prevProps: Props | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      selector = createCustomCachedSelector(\n        [getHighlightedTooltipTooltipValuesSelector, getSettingsSpecSelector],\n        ({ highlightedGeometries }: TooltipAndHighlightedGeoms, settings: SettingsSpec): void => {\n          const nextProps = {\n            settings,\n            highlightedGeometries,\n          };\n\n          if (isOutElement(prevProps, nextProps) && settings.onElementOut) {\n            settings.onElementOut();\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport {\n  getHighlightedTooltipTooltipValuesSelector,\n  TooltipAndHighlightedGeoms,\n} from './get_tooltip_values_highlighted_geoms';\nimport { ChartType } from '../../..';\nimport { SettingsSpec } from '../../../../specs';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { IndexedGeometry, GeometryValue } from '../../../../utils/geometry';\nimport { XYChartSeriesIdentifier } from '../../utils/series';\n\ninterface Props {\n  settings: SettingsSpec | undefined;\n  highlightedGeometries: IndexedGeometry[];\n}\n\nfunction isOverElement(prevProps: Props | null, nextProps: Props | null) {\n  if (!nextProps || !nextProps.settings || !nextProps.settings.onElementOver) {\n    return false;\n  }\n  const { highlightedGeometries: nextGeomValues } = nextProps;\n  const prevGeomValues = prevProps?.highlightedGeometries ?? [];\n  return (\n    nextGeomValues.length > 0 &&\n    (nextGeomValues.length !== prevGeomValues.length ||\n      !nextGeomValues.every(({ value: next }, index) => {\n        const prev = prevGeomValues[index]?.value;\n        return prev && prev.x === next.x && prev.y === next.y && prev.accessor === next.accessor;\n      }))\n  );\n}\n\n/**\n * Will call the onElementOver listener every time the following preconditions are met:\n * - the onElementOver listener is available\n * - we have a new set of highlighted geometries on our state\n * @internal\n */\nexport function createOnElementOverCaller(): (state: GlobalChartState) => void {\n  let prevProps: Props | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      selector = createCustomCachedSelector(\n        [getHighlightedTooltipTooltipValuesSelector, getSettingsSpecSelector],\n        ({ highlightedGeometries }: TooltipAndHighlightedGeoms, settings: SettingsSpec): void => {\n          const nextProps = {\n            settings,\n            highlightedGeometries,\n          };\n\n          if (isOverElement(prevProps, nextProps) && settings.onElementOver) {\n            const elements = highlightedGeometries.map<[GeometryValue, XYChartSeriesIdentifier]>(\n              ({ value, seriesIdentifier }) => [value, seriesIdentifier],\n            );\n            settings.onElementOver(elements);\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'reselect';\n\nimport { computeSeriesGeometriesSelector } from './compute_series_geometries';\nimport { getGeometriesIndexKeysSelector } from './get_geometries_index_keys';\nimport { getOrientedProjectedPointerPositionSelector } from './get_oriented_projected_pointer_position';\nimport { PointerPosition } from './get_projected_pointer_position';\nimport { ChartType } from '../../..';\nimport { PointerEvent, PointerOverEvent, PointerUpdateTrigger } from '../../../../specs';\nimport { PointerEventType } from '../../../../specs/constants';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getChartIdSelector } from '../../../../state/selectors/get_chart_id';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { isNil } from '../../../../utils/common';\nimport { ComputedScales } from '../utils/types';\n\nconst getPointerEventSelector = createCustomCachedSelector(\n  [\n    getChartIdSelector,\n    getOrientedProjectedPointerPositionSelector,\n    computeSeriesGeometriesSelector,\n    getGeometriesIndexKeysSelector,\n  ],\n  (chartId, orientedProjectedPointerPosition, seriesGeometries, geometriesIndexKeys): PointerEvent =>\n    getPointerEvent(chartId, orientedProjectedPointerPosition, seriesGeometries.scales, geometriesIndexKeys),\n);\n\nfunction getPointerEvent(\n  chartId: string,\n  orientedProjectedPointerPosition: PointerPosition,\n  { xScale, yScales }: ComputedScales,\n  geometriesIndexKeys: any[],\n): PointerEvent {\n  // update the cursorBandPosition based on chart configuration\n  if (!xScale) {\n    return { chartId, type: PointerEventType.Out };\n  }\n  const { x, y, verticalPanelValue, horizontalPanelValue } = orientedProjectedPointerPosition;\n  if (x === -1 || y === -1) {\n    return { chartId, type: PointerEventType.Out };\n  }\n  const xValue = xScale.invertWithStep(x, geometriesIndexKeys).value;\n  if (isNil(xValue) || Number.isNaN(xValue)) {\n    return { chartId, type: PointerEventType.Out };\n  }\n  return {\n    chartId,\n    type: PointerEventType.Over,\n    unit: xScale.unit,\n    scale: xScale.type,\n    x: xValue,\n    y: [...yScales.entries()].map(([groupId, yScale]) => {\n      return { value: yScale.invert(y), groupId };\n    }),\n    smVerticalValue: verticalPanelValue,\n    smHorizontalValue: horizontalPanelValue,\n  };\n}\n\nfunction isSameEventValue(a: PointerOverEvent, b: PointerOverEvent, changeTrigger: PointerUpdateTrigger) {\n  const checkX = changeTrigger === PointerUpdateTrigger.X || changeTrigger === PointerUpdateTrigger.Both;\n  const checkY = changeTrigger === PointerUpdateTrigger.Y || changeTrigger === PointerUpdateTrigger.Both;\n  return (\n    (!checkX || (a.x === b.x && a.scale === b.scale && a.unit === b.unit)) &&\n    (!checkY || a.y.every((y, i) => y.value === b.y[i]?.value))\n  );\n}\n\nconst hasPointerEventChanged = (prev: PointerEvent, next: PointerEvent | null, changeTrigger: PointerUpdateTrigger) =>\n  next?.type !== prev.type ||\n  (prev.type === PointerEventType.Over &&\n    next?.type === PointerEventType.Over &&\n    !isSameEventValue(prev, next, changeTrigger));\n\n/** @internal */\nexport function createOnPointerMoveCaller(): (state: GlobalChartState) => void {\n  let prevPointerEvent: PointerEvent | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      selector = createCustomCachedSelector(\n        [getSettingsSpecSelector, getPointerEventSelector, getChartIdSelector],\n        ({ onPointerUpdate, pointerUpdateTrigger }, nextPointerEvent, chartId): void => {\n          if (prevPointerEvent === null) {\n            prevPointerEvent = { chartId, type: PointerEventType.Out };\n          }\n          const tempPrev = { ...prevPointerEvent };\n          // we have to update the prevPointerEvents before possibly calling the onPointerUpdate\n          // to avoid a recursive loop of calls caused by the impossibility to update the prevPointerEvent\n          prevPointerEvent = nextPointerEvent;\n\n          if (onPointerUpdate && hasPointerEventChanged(tempPrev, nextPointerEvent, pointerUpdateTrigger))\n            onPointerUpdate(nextPointerEvent);\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 'react-redux';\n\nimport { computeChartDimensionsSelector } from './compute_chart_dimensions';\nimport { ChartType } from '../../..';\nimport { GlobalChartState } from '../../../../state/chart_state';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { Dimensions } from '../../../../utils/dimensions';\n\nfunction isDiff(prevProps: Dimensions, nextProps: Dimensions) {\n  return (\n    prevProps.top !== nextProps.top ||\n    prevProps.left !== nextProps.left ||\n    prevProps.width !== nextProps.width ||\n    prevProps.height !== nextProps.height\n  );\n}\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/**\n * @internal\n */\nexport function createOnProjectionAreaCaller(): (state: GlobalChartState) => void {\n  let prevProps: { projection: Dimensions; parent: Dimensions } | null = null;\n  let selector: Selector<GlobalChartState, void> | null = null;\n  return (state: GlobalChartState) => {\n    if (selector === null && state.chartType === ChartType.XYAxis) {\n      selector = createCustomCachedSelector(\n        [computeChartDimensionsSelector, getSettingsSpecSelector, getParentDimension],\n        ({ chartDimensions }, { onProjectionAreaChange }, parent): void => {\n          const nextProps = { projection: { ...chartDimensions }, parent: { ...parent } };\n          const areDifferent =\n            !prevProps ||\n            isDiff(prevProps.projection, nextProps.projection) ||\n            isDiff(nextProps.parent, nextProps.parent);\n          if (onProjectionAreaChange && areDifferent) {\n            onProjectionAreaChange(nextProps);\n          }\n          prevProps = nextProps;\n        },\n      );\n    }\n    if (selector) {\n      selector(state);\n    }\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisLabelFormatter } from './axis_tick_formatter';\nimport { getJoinedVisibleAxesData, getLabelBox, JoinedAxisData } from './compute_axis_ticks_dimensions';\nimport { computeSeriesDomainsSelector } from './compute_series_domains';\nimport { countBarsInClusterSelector } from './count_bars_in_cluster';\nimport { getBarPaddingsSelector } from './get_bar_paddings';\nimport { isHistogramModeEnabledSelector } from './is_histogram_mode_enabled';\nimport { getPanelSize, SmallMultipleScales } from '../../../../common/panel_utils';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { ScaleType } from '../../../../scales/constants';\nimport { isContinuousScale } from '../../../../scales/types';\nimport { AxisSpec, SettingsSpec } from '../../../../specs';\nimport { createCustomCachedSelector } from '../../../../state/create_selector';\nimport { computeSmallMultipleScalesSelector } from '../../../../state/selectors/compute_small_multiple_scales';\nimport { getSettingsSpecSelector } from '../../../../state/selectors/get_settings_spec';\nimport { withTextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isRTLString, Position, Rotation } from '../../../../utils/common';\nimport { Size } from '../../../../utils/dimensions';\nimport { AxisId } from '../../../../utils/ids';\nimport { multilayerAxisEntry } from '../../axes/timeslip/multilayer_ticks';\nimport { isHorizontalAxis, isVerticalAxis } from '../../utils/axis_type_utils';\nimport { AxisTick, TextDirection, TickLabelBounds } from '../../utils/axis_utils';\nimport { computeXScale } from '../../utils/scales';\nimport { SeriesDomainsAndData } from '../utils/types';\n\n/** @internal */\nexport type Projection = { ticks: AxisTick[]; labelBox: TickLabelBounds; scale: ScaleBand | ScaleContinuous };\n\n/** @internal */\nexport type GetMeasuredTicks = (\n  scale: ScaleBand | ScaleContinuous,\n  ticks: (number | string)[],\n  layer: number | undefined,\n  detailedLayer: number,\n  labelFormat: AxisLabelFormatter,\n  showGrid?: boolean,\n) => Projection;\n\ntype Projections = Map<AxisId, Projection>;\n\nconst adaptiveTickCount = true;\n\nfunction axisMinMax(axisPosition: Position, chartRotation: Rotation, { width, height }: Size): [number, number] {\n  const horizontal = isHorizontalAxis(axisPosition);\n  const flipped = horizontal\n    ? chartRotation === -90 || chartRotation === 180\n    : chartRotation === 90 || chartRotation === 180;\n  return horizontal ? [flipped ? width : 0, flipped ? 0 : width] : [flipped ? 0 : height, flipped ? height : 0];\n}\n\nfunction getDirectionFn({ type }: ScaleBand | ScaleContinuous): (label: string) => TextDirection {\n  return type === ScaleType.Ordinal\n    ? (label) => (isRTLString(label) ? 'rtl' : 'ltr') // depends on label\n    : () => 'ltr'; // always use ltr\n}\n\n/** @internal */\nexport function generateTicks(\n  axisSpec: AxisSpec,\n  scale: ScaleBand | ScaleContinuous,\n  ticks: (number | string)[],\n  offset: number,\n  labelFormatter: AxisLabelFormatter,\n  layer: number | undefined,\n  detailedLayer: number,\n  showGrid: boolean,\n): AxisTick[] {\n  const getDirection = getDirectionFn(scale);\n  const isContinuous = isContinuousScale(scale);\n  return ticks.map<AxisTick>((value) => {\n    const domainClampedValue = isContinuous && typeof value === 'number' ? Math.max(value, scale.domain[0]) : value;\n    const label = labelFormatter(value);\n    return {\n      value,\n      domainClampedValue,\n      label,\n      position: (scale.scale(value) || 0) + offset, // todo it doesn't look desirable to convert a NaN into a zero\n      domainClampedPosition: (scale.scale(domainClampedValue) || 0) + offset, // todo it doesn't look desirable to convert a NaN into a zero\n      layer,\n      detailedLayer,\n      showGrid,\n      direction: getDirection(label),\n    };\n  });\n}\n\nfunction getVisibleTicks(\n  axisSpec: AxisSpec,\n  labelBox: TickLabelBounds,\n  totalBarsInCluster: number,\n  labelFormatter: AxisLabelFormatter,\n  rotationOffset: number,\n  scale: ScaleBand | ScaleContinuous,\n  enableHistogramMode: boolean,\n  layer: number | undefined,\n  detailedLayer: number,\n  ticks: (number | string)[],\n  isMultilayerTimeAxis: boolean = false,\n  showGrid = true,\n): AxisTick[] {\n  const isSingleValueScale = scale.domain[0] === scale.domain[1];\n  const makeRaster = enableHistogramMode && scale.bandwidth > 0 && !isMultilayerTimeAxis;\n  const ultimateTick = ticks.at(-1);\n  const penultimateTick = ticks.at(-2);\n  if (makeRaster && !isSingleValueScale && typeof penultimateTick === 'number' && typeof ultimateTick === 'number') {\n    const computedTickDistance = ultimateTick - penultimateTick;\n    const numTicks = scale.minInterval / (computedTickDistance || scale.minInterval); // avoid infinite loop\n    for (let i = 1; i <= numTicks; i++) ticks.push(i * computedTickDistance + ultimateTick);\n  }\n  const shift = totalBarsInCluster > 0 ? totalBarsInCluster : 1;\n  const band = scale.bandwidth / (1 - scale.barsPadding);\n  const halfPadding = (band - scale.bandwidth) / 2;\n  const offset =\n    (enableHistogramMode ? -halfPadding : (scale.bandwidth * shift) / 2) + (scale.isSingleValue() ? 0 : rotationOffset);\n\n  const firstTickValue = ticks[0];\n  const allTicks: AxisTick[] =\n    makeRaster && isSingleValueScale && typeof firstTickValue === 'number'\n      ? [\n          {\n            value: firstTickValue,\n            domainClampedValue: firstTickValue,\n            label: labelFormatter(firstTickValue),\n            position: (scale.scale(firstTickValue) || 0) + offset,\n            domainClampedPosition: (scale.scale(firstTickValue) || 0) + offset,\n            layer: undefined, // no multiple layers with `singleValueScale`s\n            detailedLayer: 0,\n            direction: 'rtl',\n            showGrid,\n          },\n          {\n            value: firstTickValue + scale.minInterval,\n            domainClampedValue: firstTickValue + scale.minInterval,\n            label: labelFormatter(firstTickValue + scale.minInterval),\n            position: scale.bandwidth + halfPadding * 2,\n            domainClampedPosition: scale.bandwidth + halfPadding * 2,\n            layer: undefined, // no multiple layers with `singleValueScale`s\n            detailedLayer: 0,\n            direction: 'rtl',\n            showGrid,\n          },\n        ]\n      : generateTicks(axisSpec, scale, ticks, offset, labelFormatter, layer, detailedLayer, showGrid);\n\n  const { showOverlappingTicks, showOverlappingLabels, position } = axisSpec;\n  const requiredSpace = isVerticalAxis(position) ? labelBox.maxLabelBboxHeight / 2 : labelBox.maxLabelBboxWidth / 2;\n  const bypassOverlapCheck = showOverlappingLabels || isMultilayerTimeAxis;\n  return bypassOverlapCheck\n    ? allTicks\n    : [...allTicks]\n        .sort((a: AxisTick, b: AxisTick) => a.position - b.position)\n        .reduce(\n          (prev, tick) => {\n            const tickLabelFits = tick.position >= prev.occupiedSpace + requiredSpace;\n            if (tickLabelFits || showOverlappingTicks) {\n              prev.visibleTicks.push(tickLabelFits ? tick : { ...tick, label: '' });\n              if (tickLabelFits) prev.occupiedSpace = tick.position + requiredSpace;\n            } else if (adaptiveTickCount && !tickLabelFits && !showOverlappingTicks) {\n              prev.visibleTicks.push({ ...tick, label: '' });\n            }\n            return prev;\n          },\n          { visibleTicks: [] as AxisTick[], occupiedSpace: -Infinity },\n        ).visibleTicks;\n}\n\nfunction getVisibleTickSet(\n  scale: ScaleBand | ScaleContinuous,\n  labelBox: TickLabelBounds,\n  { rotation: chartRotation }: Pick<SettingsSpec, 'rotation'>,\n  axisSpec: AxisSpec,\n  groupCount: number,\n  histogramMode: boolean,\n  layer: number | undefined,\n  detailedLayer: number,\n  ticks: (number | string)[],\n  labelFormatter: AxisLabelFormatter,\n  isMultilayerTimeAxis = false,\n  showGrid = true,\n): AxisTick[] {\n  const vertical = isVerticalAxis(axisSpec.position);\n  const somehowRotated = (vertical && chartRotation === -90) || (!vertical && chartRotation === 180);\n  const rotationOffset = histogramMode && somehowRotated ? scale.step : 0; // todo find the true cause of the this offset issue\n\n  return getVisibleTicks(\n    axisSpec,\n    labelBox,\n    groupCount,\n    labelFormatter,\n    rotationOffset,\n    scale,\n    histogramMode,\n    layer,\n    detailedLayer,\n    ticks,\n    isMultilayerTimeAxis,\n    showGrid,\n  );\n}\n\n/** @internal */\nexport const getVisibleTickSetsSelector = createCustomCachedSelector(\n  [\n    getSettingsSpecSelector,\n    getJoinedVisibleAxesData,\n    computeSeriesDomainsSelector,\n    computeSmallMultipleScalesSelector,\n    countBarsInClusterSelector,\n    isHistogramModeEnabledSelector,\n    getBarPaddingsSelector,\n  ],\n  getVisibleTickSets,\n);\n\nfunction getVisibleTickSets(\n  { rotation: chartRotation, locale }: Pick<SettingsSpec, 'rotation' | 'locale'>,\n  joinedAxesData: Map<AxisId, JoinedAxisData>,\n  { xDomain, yDomains }: Pick<SeriesDomainsAndData, 'xDomain' | 'yDomains'>,\n  smScales: SmallMultipleScales,\n  totalGroupsCount: number,\n  enableHistogramMode: boolean,\n  barsPadding?: number,\n): Projections {\n  return withTextMeasure((textMeasure) => {\n    const panel = getPanelSize(smScales);\n    return [...joinedAxesData].reduce(\n      (acc, [axisId, { axisSpec, axesStyle, gridLine, isXAxis, labelFormatter: userProvidedLabelFormatter }]) => {\n        const { groupId, integersOnly, maximumFractionDigits: mfd, timeAxisLayerCount } = axisSpec;\n        const yDomain = yDomains.find((yd) => yd.groupId === groupId);\n        const domain = isXAxis ? xDomain : yDomain;\n        const range = axisMinMax(axisSpec.position, chartRotation, panel);\n        const maxTickCount = domain?.desiredTickCount ?? 0;\n        const isMultilayerTimeAxis = domain?.type === ScaleType.Time && timeAxisLayerCount > 0;\n        // TODO: remove this fallback when integersOnly is removed\n        const maximumFractionDigits = mfd ?? (integersOnly ? 0 : undefined);\n\n        const getMeasuredTicks = (\n          scale: ScaleBand | ScaleContinuous,\n          ticks: (number | string)[],\n          layer: number | undefined,\n          detailedLayer: number,\n          labelFormatter: AxisLabelFormatter,\n          showGrid = true,\n        ): Projection => {\n          const labelBox = getLabelBox(axesStyle, ticks, labelFormatter, textMeasure, axisSpec, gridLine);\n          return {\n            ticks: getVisibleTickSet(\n              scale,\n              labelBox,\n              { rotation: chartRotation },\n              axisSpec,\n              totalGroupsCount,\n              enableHistogramMode,\n              layer,\n              detailedLayer,\n              ticks,\n              labelFormatter,\n              isMultilayerTimeAxis,\n              showGrid,\n            ),\n            labelBox,\n            scale, // tick count driving nicing; nicing drives domain; therefore scale may vary, downstream needs it\n          };\n        };\n\n        const getScale = (desiredTickCount: number) =>\n          isXAxis\n            ? computeXScale({\n                xDomain: { ...xDomain, desiredTickCount },\n                totalBarsInCluster: totalGroupsCount,\n                range,\n                barsPadding,\n                enableHistogramMode,\n                maximumFractionDigits,\n              })\n            : yDomain &&\n              new ScaleContinuous({ ...yDomain, range }, { ...yDomain, desiredTickCount, maximumFractionDigits });\n\n        const fillLayer = (maxTickCountForLayer: number) => {\n          let fallbackAskedTickCount = 2;\n          let fallbackReceivedTickCount = Infinity;\n          if (adaptiveTickCount) {\n            let previousActualTickCount = NaN;\n            for (let triedTickCount = maxTickCountForLayer; triedTickCount >= 1; triedTickCount--) {\n              const scale = getScale(triedTickCount);\n              const actualTickCount = scale?.ticks().length ?? 0;\n              if (!scale || actualTickCount === previousActualTickCount || actualTickCount < 2) continue;\n              const raster = getMeasuredTicks(scale, scale.ticks(), undefined, 0, userProvidedLabelFormatter);\n              const nonZeroLengthTicks = raster.ticks.filter((tick) => tick.label.length > 0);\n              const uniqueLabels = new Set(raster.ticks.map((tick) => tick.label));\n              const areLabelsUnique = raster.ticks.length === uniqueLabels.size;\n              const areAdjacentTimeLabelsUnique =\n                scale.type === ScaleType.Time &&\n                !axisSpec.showDuplicatedTicks &&\n                (areLabelsUnique || raster.ticks.every((d, i, a) => i === 0 || d.label !== a[i - 1]?.label));\n              const atLeastTwoTicks = uniqueLabels.size >= 2;\n              const allTicksFit = !uniqueLabels.has('');\n              const compliant =\n                axisSpec &&\n                (scale.type === ScaleType.Time || atLeastTwoTicks) &&\n                (scale.type === ScaleType.Log || allTicksFit) &&\n                ((scale.type === ScaleType.Time && (axisSpec.showDuplicatedTicks || areAdjacentTimeLabelsUnique)) ||\n                  (scale.type === ScaleType.Log\n                    ? new Set(nonZeroLengthTicks.map((tick) => tick.label)).size === nonZeroLengthTicks.length\n                    : areLabelsUnique));\n              previousActualTickCount = actualTickCount;\n              if (raster && compliant) {\n                return {\n                  entry: {\n                    ...raster,\n                    ticks: scale.type === ScaleType.Log ? raster.ticks : nonZeroLengthTicks,\n                  },\n                  fallbackAskedTickCount,\n                };\n              } else if (atLeastTwoTicks && uniqueLabels.size <= fallbackReceivedTickCount) {\n                // let's remember the smallest triedTickCount that yielded two distinct ticks\n                fallbackReceivedTickCount = uniqueLabels.size;\n                fallbackAskedTickCount = triedTickCount;\n              }\n            }\n          }\n          return { fallbackAskedTickCount };\n        };\n\n        if (isMultilayerTimeAxis) {\n          const scale = getScale(0); // the scale is only needed for its non-tick props like step, bandwidth, ...\n          if (!scale || !isContinuousScale(scale)) throw new Error('Scale generation for the multilayer axis failed');\n          return acc.set(\n            axisId,\n            multilayerAxisEntry(\n              xDomain,\n              isXAxis && xDomain.isBandScale && enableHistogramMode,\n              range,\n              timeAxisLayerCount,\n              scale,\n              getMeasuredTicks,\n              locale,\n            ),\n          );\n        }\n\n        const { fallbackAskedTickCount, entry } = fillLayer(maxTickCount);\n        if (entry) return acc.set(axisId, entry);\n\n        // todo dry it up\n        const scale = getScale(adaptiveTickCount ? fallbackAskedTickCount : maxTickCount);\n        const lastResortCandidate =\n          scale && getMeasuredTicks(scale, scale.ticks(), undefined, 0, userProvidedLabelFormatter);\n        return lastResortCandidate ? acc.set(axisId, lastResortCandidate) : acc;\n      },\n      new Map(),\n    );\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GeometriesCounts } from './types';\nimport { LegendItem } from '../../../../common/legend';\nimport { getDistance, Rotation } from '../../../../utils/common';\nimport { Point } from '../../../../utils/point';\nimport { BasicSeriesSpec, SeriesType } from '../../utils/specs';\n\n/** @internal */\nexport const MAX_ANIMATABLE_BARS = 300;\n/** @internal */\nexport const MAX_ANIMATABLE_LINES_AREA_POINTS = 600;\n\n/** @internal */\nexport function isHorizontalRotation(chartRotation: Rotation) {\n  return chartRotation === 0 || chartRotation === 180;\n}\n\n/** @internal */\nexport function isVerticalRotation(chartRotation: Rotation) {\n  return chartRotation === -90 || chartRotation === 90;\n}\n/**\n * Check if a specs map contains only line or area specs\n * @param specs Map<SpecId, BasicSeriesSpec>\n * @internal\n */\nexport function isLineAreaOnlyChart(specs: BasicSeriesSpec[]) {\n  return !specs.some((spec) => spec.seriesType === SeriesType.Bar);\n}\n\n/** @internal */\nexport function isChartAnimatable(geometriesCounts: GeometriesCounts, animationEnabled: boolean): boolean {\n  if (!animationEnabled) {\n    return false;\n  }\n  const { bars, linePoints, areasPoints } = geometriesCounts;\n  const isBarsAnimatable = bars <= MAX_ANIMATABLE_BARS;\n  const isLinesAndAreasAnimatable = linePoints + areasPoints <= MAX_ANIMATABLE_LINES_AREA_POINTS;\n  return isBarsAnimatable && isLinesAndAreasAnimatable;\n}\n\n/** @internal */\nexport function isAllSeriesDeselected(legendItems: LegendItem[]): boolean {\n  // eslint-disable-next-line no-restricted-syntax\n  for (const legendItem of legendItems) {\n    if (!legendItem.isSeriesHidden) {\n      return false;\n    }\n  }\n  return true;\n}\n\n/**\n * Sorts points in order from closest to farthest from cursor\n * @internal\n */\nexport const sortClosestToPoint =\n  (cursor: Point) =>\n  (a: Point, b: Point): number => {\n    return getDistance(cursor, a) - getDistance(cursor, b);\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { ScaleType } from '../../../../scales/constants';\nimport { XDomain } from '../../domains/types';\nimport { isDatumFilled } from '../../rendering/utils';\nimport { DataSeries, DataSeriesDatum } from '../../utils/series';\n\n/** @internal */\nexport const LegendValue = Object.freeze({\n  None: 'none' as const,\n  LastValue: 'lastValue' as const,\n  LastNonNullValue: 'lastNonNullValue' as const,\n});\n/** @internal */\nexport type LegendValue = $Values<typeof LegendValue>;\n\n/**\n * This method return a value from a DataSeries that correspond to the type of value requested.\n * It in general compute the last, min, max, avg, sum of the value in a series.\n * NOTE: not every type can work correctly with the data provided, for example a sum will not work when using the percentage chart\n * @internal\n */\nexport function getLegendValue(\n  series: DataSeries,\n  xDomain: XDomain,\n  type: LegendValue,\n  valueAccessor: (d: DataSeriesDatum) => number | null,\n): number | null {\n  // See https://github.com/elastic/elastic-charts/issues/2050\n  if (xDomain.type === ScaleType.Ordinal) {\n    return null;\n  }\n\n  switch (type) {\n    case LegendValue.LastNonNullValue: {\n      const last = series.data.findLast((d) => d.x === xDomain.dataDomain[1] && valueAccessor(d) !== null);\n      return last ? valueAccessor(last) : null;\n    }\n    case LegendValue.LastValue:\n      const last = series.data.findLast((d) => d.x === xDomain.dataDomain[1]);\n      if (last && !isDatumFilled(last)) {\n        return valueAccessor(last);\n      }\n      return null;\n    default:\n    case LegendValue.None:\n      return null;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BasicSeriesSpec, DEFAULT_GLOBAL_ID, Spec } from '../../../../specs';\nimport { Rotation } from '../../../../utils/common';\nimport { GroupId } from '../../../../utils/ids';\nimport { isXDomain } from '../../utils/axis_utils';\nimport { AxisSpec } from '../../utils/specs';\n\n/** @internal */\nexport function getSpecsById<T extends Spec>(specs: T[], id: string): T | undefined {\n  return specs.find((spec) => spec.id === id);\n}\n\n/** @internal */\nexport function getAxesSpecForSpecId(axesSpecs: AxisSpec[], groupId: GroupId, chartRotation: Rotation = 0) {\n  return axesSpecs.reduce<{ xAxis?: AxisSpec; yAxis?: AxisSpec }>((result, spec) => {\n    if (spec.groupId === groupId && isXDomain(spec.position, chartRotation)) result.xAxis = spec;\n    else if (spec.groupId === groupId && !isXDomain(spec.position, chartRotation)) result.yAxis = spec;\n    return result;\n  }, {});\n}\n\n/** @internal */\nexport function getSpecDomainGroupId(spec: BasicSeriesSpec): string {\n  if (!spec.useDefaultGroupDomain) {\n    return spec.groupId;\n  }\n  return typeof spec.useDefaultGroupDomain === 'boolean' ? DEFAULT_GLOBAL_ID : spec.useDefaultGroupDomain;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isHorizontalRotation } from './common';\nimport { getAxesSpecForSpecId, getSpecDomainGroupId, getSpecsById } from './spec';\nimport { ComputedGeometries, GeometriesCounts, SeriesDomainsAndData, Transform } from './types';\nimport { Color } from '../../../../common/colors';\nimport { SmallMultipleScales, SmallMultiplesGroupBy } from '../../../../common/panel_utils';\nimport { getPredicateFn, Predicate } from '../../../../common/predicate';\nimport { SeriesIdentifier, SeriesKey } from '../../../../common/series_id';\nimport { ScaleBand, ScaleContinuous } from '../../../../scales';\nimport { SettingsSpec, TickFormatter } from '../../../../specs';\nimport { TextMeasure } from '../../../../utils/bbox/canvas_text_bbox_calculator';\nimport { isFiniteNumber, isNil, isUniqueArray, mergePartial, Rotation } from '../../../../utils/common';\nimport { CurveType } from '../../../../utils/curves';\nimport { Dimensions, Size } from '../../../../utils/dimensions';\nimport {\n  AreaGeometry,\n  BarGeometry,\n  BubbleGeometry,\n  LineGeometry,\n  PerPanel,\n  PointGeometry,\n} from '../../../../utils/geometry';\nimport { GroupId, SpecId } from '../../../../utils/ids';\nimport { getRenderingCompareFn } from '../../../../utils/series_sort';\nimport { ColorConfig, Theme } from '../../../../utils/themes/theme';\nimport { XDomain } from '../../domains/types';\nimport { mergeXDomain } from '../../domains/x_domain';\nimport { isStackedSpec, mergeYDomain } from '../../domains/y_domain';\nimport { renderArea } from '../../rendering/area';\nimport { renderBars } from '../../rendering/bars';\nimport { renderBubble } from '../../rendering/bubble';\nimport { renderLine } from '../../rendering/line';\nimport { getAreaSeriesStyles, getLineSeriesStyles } from '../../rendering/line_area_style';\nimport { defaultXYSeriesSort } from '../../utils/default_series_sort_fn';\nimport { fillSeries } from '../../utils/fill_series';\nimport { groupBy } from '../../utils/group_data_series';\nimport { IndexedGeometryMap } from '../../utils/indexed_geometry_map';\nimport { computeXScale, computeYScales } from '../../utils/scales';\nimport {\n  DataSeries,\n  getDataSeriesFromSpecs,\n  getFormattedDataSeries,\n  getSeriesKey,\n  isBandedSpec,\n} from '../../utils/series';\nimport {\n  AnnotationDomainType,\n  AnnotationSpec,\n  AxisSpec,\n  BasicSeriesSpec,\n  Fit,\n  FitConfig,\n  HistogramModeAlignment,\n  HistogramModeAlignments,\n  isAreaSeriesSpec,\n  isBarSeriesSpec,\n  isBubbleSeriesSpec,\n  isLineAnnotation,\n  isLineSeriesSpec,\n} from '../../utils/specs';\nimport { ScaleConfigs } from '../selectors/get_api_scale_configs';\n\n/**\n * Return map association between `seriesKey` and only the custom colors string\n * @internal\n * @param dataSeries\n */\nexport function getCustomSeriesColors(dataSeries: DataSeries[]): Map<SeriesKey, Color> {\n  const updatedCustomSeriesColors = new Map<SeriesKey, Color>();\n  const counters = new Map<SpecId, number>();\n\n  dataSeries.forEach((ds) => {\n    const { spec, specId } = ds;\n    const dataSeriesKey = {\n      specId: ds.specId,\n      xAccessor: ds.xAccessor,\n      yAccessor: ds.yAccessor,\n      splitAccessors: ds.splitAccessors,\n      smVerticalAccessorValue: undefined,\n      smHorizontalAccessorValue: undefined,\n    };\n    const seriesKey = getSeriesKey(dataSeriesKey, ds.groupId);\n\n    if (!spec || !spec.color) {\n      return;\n    }\n\n    let color: Color | undefined | null;\n\n    if (!color && spec.color) {\n      if (typeof spec.color === 'string') {\n        // eslint-disable-next-line prefer-destructuring\n        color = spec.color;\n      } else {\n        const counter = counters.get(specId) || 0;\n        color = Array.isArray(spec.color) ? spec.color[counter % spec.color.length] : spec.color(ds);\n        counters.set(specId, counter + 1);\n      }\n    }\n\n    if (color) {\n      updatedCustomSeriesColors.set(seriesKey, color);\n    }\n  });\n  return updatedCustomSeriesColors;\n}\n\n/**\n * Compute data domains for all specified specs.\n * @internal\n */\nexport function computeSeriesDomains(\n  seriesSpecs: BasicSeriesSpec[],\n  scaleConfigs: ScaleConfigs,\n  annotations: AnnotationSpec[],\n  settingsSpec: Pick<SettingsSpec, 'orderOrdinalBinsBy' | 'locale'>,\n  deselectedDataSeries: SeriesIdentifier[] = [],\n  smallMultiples?: SmallMultiplesGroupBy,\n): SeriesDomainsAndData {\n  const { orderOrdinalBinsBy, locale } = settingsSpec;\n  const { dataSeries, xValues, fallbackScale, smHValues, smVValues } = getDataSeriesFromSpecs(\n    seriesSpecs,\n    deselectedDataSeries,\n    orderOrdinalBinsBy,\n    smallMultiples,\n  );\n  // compute the x domain merging any custom domain\n  const xDomain = mergeXDomain(scaleConfigs.x, xValues, locale, fallbackScale);\n\n  // fill series with missing x values\n  const filledDataSeries = fillSeries(dataSeries, xValues, xDomain.type);\n\n  const seriesSortFn = getRenderingCompareFn((a: SeriesIdentifier, b: SeriesIdentifier) => {\n    return defaultXYSeriesSort(a as DataSeries, b as DataSeries);\n  });\n\n  const formattedDataSeries = getFormattedDataSeries(seriesSpecs, filledDataSeries, xValues, xDomain.type).sort(\n    seriesSortFn,\n  );\n  const annotationYValueMap = getAnnotationYValueMap(annotations, scaleConfigs.y);\n\n  // let's compute the yDomains after computing all stacked values\n  const yDomains = mergeYDomain(scaleConfigs.y, formattedDataSeries, annotationYValueMap);\n\n  // sort small multiples values\n  const horizontalPredicate = smallMultiples?.horizontal?.sort ?? Predicate.DataIndex;\n  const smHDomain = [...smHValues].sort(getPredicateFn(horizontalPredicate, locale));\n\n  const verticalPredicate = smallMultiples?.vertical?.sort ?? Predicate.DataIndex;\n  const smVDomain = [...smVValues].sort(getPredicateFn(verticalPredicate, locale));\n\n  return {\n    xDomain,\n    yDomains,\n    smHDomain,\n    smVDomain,\n    formattedDataSeries,\n  };\n}\n\nfunction getAnnotationYValueMap(\n  annotations: AnnotationSpec[],\n  yScaleConfig: ScaleConfigs['y'],\n): Map<GroupId, number[]> {\n  return annotations.reduce((acc, spec) => {\n    const { includeDataFromIds = [] } = yScaleConfig[spec.groupId]?.customDomain ?? {};\n    if (!includeDataFromIds.includes(spec.id)) return acc.set(spec.groupId, []);\n    const yValues: number[] = isLineAnnotation(spec)\n      ? spec.domainType === AnnotationDomainType.YDomain\n        ? spec.dataValues.map(({ dataValue }) => dataValue)\n        : []\n      : spec.dataValues.flatMap(({ coordinates: { y0, y1 } }) => [y0, y1]);\n    const groupValues = acc.get(spec.groupId) ?? [];\n    return acc.set(spec.groupId, [...groupValues, ...yValues.filter(isFiniteNumber)]);\n  }, new Map<GroupId, number[]>());\n}\n\n/** @internal */\nexport function computeSeriesGeometries(\n  seriesSpecs: BasicSeriesSpec[],\n  { xDomain, yDomains, formattedDataSeries: nonFilteredDataSeries }: SeriesDomainsAndData,\n  seriesColorMap: Map<SeriesKey, Color>,\n  chartTheme: Theme,\n  { rotation: chartRotation }: Pick<SettingsSpec, 'rotation'>,\n  axesSpecs: AxisSpec[],\n  smallMultiplesScales: SmallMultipleScales,\n  enableHistogramMode: boolean,\n  fallbackTickFormatter: TickFormatter,\n  measureText: TextMeasure,\n): ComputedGeometries {\n  const chartColors: ColorConfig = chartTheme.colors;\n  const formattedDataSeries = nonFilteredDataSeries.filter(({ isFiltered }) => !isFiltered);\n  const barDataSeries = formattedDataSeries.filter(({ spec }) => isBarSeriesSpec(spec));\n  // compute max bar in cluster per panel\n  const dataSeriesGroupedByPanel = groupBy(\n    barDataSeries,\n    ['smVerticalAccessorValue', 'smHorizontalAccessorValue'],\n    false,\n  );\n\n  const barIndexByPanel = Object.keys(dataSeriesGroupedByPanel).reduce<Record<string, string[]>>((acc, panelKey) => {\n    const panelBars = dataSeriesGroupedByPanel[panelKey] ?? [];\n    const barDataSeriesByBarIndex = groupBy(panelBars, getBarIndexKey, false);\n    acc[panelKey] = Object.keys(barDataSeriesByBarIndex);\n    return acc;\n  }, {});\n\n  const { horizontal, vertical } = smallMultiplesScales;\n\n  const yScales = computeYScales({\n    yDomains,\n    range: [isHorizontalRotation(chartRotation) ? vertical.bandwidth : horizontal.bandwidth, 0],\n  });\n\n  const computedGeoms = renderGeometries(\n    formattedDataSeries,\n    xDomain,\n    yScales,\n    vertical,\n    horizontal,\n    barIndexByPanel,\n    seriesSpecs,\n    seriesColorMap,\n    chartColors.defaultVizColor,\n    axesSpecs,\n    chartTheme,\n    enableHistogramMode,\n    chartRotation,\n    fallbackTickFormatter,\n    measureText,\n  );\n\n  const totalBarsInCluster = Object.values(barIndexByPanel).reduce((acc, curr) => Math.max(acc, curr.length), 0);\n\n  const xScale = computeXScale({\n    xDomain,\n    totalBarsInCluster,\n    range: [0, isHorizontalRotation(chartRotation) ? horizontal.bandwidth : vertical.bandwidth],\n    barsPadding: enableHistogramMode ? chartTheme.scales.histogramPadding : chartTheme.scales.barsPadding,\n    enableHistogramMode,\n  });\n\n  return { scales: { xScale, yScales }, ...computedGeoms };\n}\n\n/** @internal */\nexport function setBarSeriesAccessors(isHistogramMode: boolean, seriesSpecs: Map<SpecId, BasicSeriesSpec>): void {\n  if (isHistogramMode) {\n    for (const [, spec] of seriesSpecs) {\n      if (isBarSeriesSpec(spec))\n        spec.stackAccessors = [...(spec.stackAccessors || spec.yAccessors), ...(spec.splitSeriesAccessors || [])];\n    }\n  }\n}\n\n/** @internal */\nexport function isHistogramModeEnabled(seriesSpecs: BasicSeriesSpec[]): boolean {\n  return seriesSpecs.some((spec) => isBarSeriesSpec(spec) && spec.enableHistogramMode);\n}\n\n/** @internal */\nexport function computeXScaleOffset(\n  xScale: ScaleBand | ScaleContinuous,\n  enableHistogramMode: boolean,\n  histogramModeAlignment: HistogramModeAlignment = HistogramModeAlignments.Start,\n): number {\n  if (!enableHistogramMode) {\n    return 0;\n  }\n\n  const { bandwidth, barsPadding } = xScale;\n  const band = bandwidth / (1 - barsPadding);\n  const halfPadding = (band - bandwidth) / 2;\n\n  const startAlignmentOffset = bandwidth / 2 + halfPadding;\n\n  switch (histogramModeAlignment) {\n    case HistogramModeAlignments.Center:\n      return 0;\n    case HistogramModeAlignments.End:\n      return -startAlignmentOffset;\n    default:\n      return startAlignmentOffset;\n  }\n}\n\nfunction renderGeometries(\n  dataSeries: DataSeries[],\n  xDomain: XDomain,\n  yScales: Map<GroupId, ScaleContinuous>,\n  smVScale: ScaleBand,\n  smHScale: ScaleBand,\n  barIndexOrderPerPanel: Record<string, string[]>,\n  seriesSpecs: BasicSeriesSpec[],\n  seriesColorsMap: Map<SeriesKey, Color>,\n  defaultColor: string,\n  axesSpecs: AxisSpec[],\n  chartTheme: Theme,\n  enableHistogramMode: boolean,\n  chartRotation: Rotation,\n  fallBackTickFormatter: TickFormatter,\n  measureText: TextMeasure,\n): Omit<ComputedGeometries, 'scales'> {\n  const points: PointGeometry[] = [];\n  const bars: Array<PerPanel<BarGeometry[]>> = [];\n  const areas: Array<PerPanel<AreaGeometry>> = [];\n  const lines: Array<PerPanel<LineGeometry>> = [];\n  const bubbles: Array<PerPanel<BubbleGeometry>> = [];\n  const geometriesIndex = new IndexedGeometryMap();\n  const isMixedChart = isUniqueArray(seriesSpecs, ({ seriesType }) => seriesType) && seriesSpecs.length > 1;\n  const geometriesCounts: GeometriesCounts = {\n    points: 0,\n    bars: 0,\n    areas: 0,\n    areasPoints: 0,\n    lines: 0,\n    linePoints: 0,\n    bubbles: 0,\n    bubblePoints: 0,\n  };\n  const barsPadding = enableHistogramMode ? chartTheme.scales.histogramPadding : chartTheme.scales.barsPadding;\n\n  dataSeries.forEach((ds) => {\n    const spec = getSpecsById<BasicSeriesSpec>(seriesSpecs, ds.specId);\n    if (spec === undefined) {\n      return;\n    }\n    // compute the y scale\n    const yScale = yScales.get(getSpecDomainGroupId(ds.spec));\n    if (!yScale) {\n      return;\n    }\n    // compute the panel unique key\n    const barPanelKey = [ds.smVerticalAccessorValue, ds.smHorizontalAccessorValue].join('|');\n    const barIndexOrder = barIndexOrderPerPanel[barPanelKey] ?? [];\n    // compute x scale\n    const xScale = computeXScale({\n      xDomain,\n      totalBarsInCluster: barIndexOrder?.length ?? 0,\n      range: [0, isHorizontalRotation(chartRotation) ? smHScale.bandwidth : smVScale.bandwidth],\n      barsPadding,\n      enableHistogramMode,\n    });\n\n    const { stackMode } = ds;\n\n    const leftPos = (!isNil(ds.smHorizontalAccessorValue) && smHScale.scale(ds.smHorizontalAccessorValue)) || 0;\n    const topPos = (!isNil(ds.smVerticalAccessorValue) && smVScale.scale(ds.smVerticalAccessorValue)) || 0;\n    const panel: Dimensions = {\n      width: smHScale.bandwidth,\n      height: smVScale.bandwidth,\n      top: topPos,\n      left: leftPos,\n    };\n    const dataSeriesKey = getSeriesKey(\n      {\n        specId: ds.specId,\n        yAccessor: ds.yAccessor,\n        splitAccessors: ds.splitAccessors,\n      },\n      ds.groupId,\n    );\n\n    const color = seriesColorsMap.get(dataSeriesKey) || defaultColor;\n\n    if (isBarSeriesSpec(spec)) {\n      const shift = barIndexOrder.indexOf(getBarIndexKey(ds));\n\n      if (shift === -1) return; // skip bar dataSeries if index is not available\n\n      const barSeriesStyle = mergePartial(chartTheme.barSeriesStyle, spec.barSeriesStyle);\n      const { yAxis } = getAxesSpecForSpecId(axesSpecs, spec.groupId, chartRotation);\n      const valueFormatter = yAxis?.tickFormat ?? fallBackTickFormatter;\n\n      const displayValueSettings = spec.displayValueSettings\n        ? { valueFormatter, ...spec.displayValueSettings }\n        : undefined;\n\n      const renderedBars = renderBars(\n        measureText,\n        shift,\n        ds,\n        xScale,\n        yScale,\n        panel,\n        chartRotation,\n        spec.minBarHeight ?? 0,\n        color,\n        barSeriesStyle,\n        displayValueSettings,\n        spec.styleAccessor,\n        stackMode,\n      );\n      geometriesIndex.merge(renderedBars.indexedGeometryMap);\n      bars.push({ panel, value: renderedBars.barGeometries });\n      geometriesCounts.bars += renderedBars.barGeometries.length;\n    } else if (isBubbleSeriesSpec(spec)) {\n      const bubbleShift = barIndexOrder && barIndexOrder.length > 0 ? barIndexOrder.length : 1;\n      const bubbleSeriesStyle = spec.bubbleSeriesStyle\n        ? mergePartial(chartTheme.bubbleSeriesStyle, spec.bubbleSeriesStyle)\n        : chartTheme.bubbleSeriesStyle;\n      const xScaleOffset = computeXScaleOffset(xScale, enableHistogramMode);\n      const renderedBubbles = renderBubble(\n        (xScale.bandwidth * bubbleShift) / 2,\n        ds,\n        xScale,\n        yScale,\n        color,\n        panel,\n        isBandedSpec(spec),\n        xScaleOffset,\n        bubbleSeriesStyle,\n        {\n          enabled: spec.markSizeAccessor !== undefined,\n          ratio: chartTheme.markSizeRatio,\n        },\n        isMixedChart,\n        spec.pointStyleAccessor,\n      );\n      geometriesIndex.merge(renderedBubbles.indexedGeometryMap);\n      bubbles.push({\n        panel,\n        value: renderedBubbles.bubbleGeometry,\n      });\n      geometriesCounts.bubblePoints += renderedBubbles.bubbleGeometry.points.length;\n      geometriesCounts.bubbles += 1;\n    } else if (isLineSeriesSpec(spec)) {\n      const lineShift = barIndexOrder && barIndexOrder.length > 0 ? barIndexOrder.length : 1;\n      const lineSeriesStyle = getLineSeriesStyles(chartTheme.lineSeriesStyle, spec.lineSeriesStyle);\n      const xScaleOffset = computeXScaleOffset(xScale, enableHistogramMode, spec.histogramModeAlignment);\n\n      const renderedLines = renderLine(\n        // move the point on half of the bandwidth if we have mixed bars/lines\n        (xScale.bandwidth * lineShift) / 2,\n        ds,\n        xScale,\n        yScale,\n        panel,\n        color,\n        spec.curve || CurveType.LINEAR,\n        isBandedSpec(spec),\n        xScaleOffset,\n        lineSeriesStyle,\n        {\n          enabled: spec.markSizeAccessor !== undefined && lineSeriesStyle.point.visible,\n          ratio: chartTheme.markSizeRatio,\n        },\n        hasFitFnConfigured(spec.fit),\n        spec.pointStyleAccessor,\n      );\n\n      geometriesIndex.merge(renderedLines.indexedGeometryMap);\n      lines.push({\n        panel,\n        value: renderedLines.lineGeometry,\n      });\n      geometriesCounts.linePoints += renderedLines.lineGeometry.points.length;\n      geometriesCounts.lines += 1;\n    } else if (isAreaSeriesSpec(spec)) {\n      const areaShift = barIndexOrder && barIndexOrder.length > 0 ? barIndexOrder.length : 1;\n      const areaSeriesStyle = getAreaSeriesStyles(chartTheme.areaSeriesStyle, spec.areaSeriesStyle);\n      const xScaleOffset = computeXScaleOffset(xScale, enableHistogramMode, spec.histogramModeAlignment);\n      const renderedAreas = renderArea(\n        // move the point on half of the bandwidth if we have mixed bars/lines\n        (xScale.bandwidth * areaShift) / 2,\n        ds,\n        xScale,\n        yScale,\n        panel,\n        color,\n        spec.curve || CurveType.LINEAR,\n        isBandedSpec(spec),\n        xScaleOffset,\n        areaSeriesStyle,\n        {\n          enabled: spec.markSizeAccessor !== undefined && areaSeriesStyle.point.visible,\n          ratio: chartTheme.markSizeRatio,\n        },\n        spec.stackAccessors ? spec.stackAccessors.length > 0 : false,\n        hasFitFnConfigured(spec.fit),\n        spec.pointStyleAccessor,\n      );\n      geometriesIndex.merge(renderedAreas.indexedGeometryMap);\n      areas.push({\n        panel,\n        value: renderedAreas.areaGeometry,\n      });\n      geometriesCounts.areasPoints += renderedAreas.areaGeometry.points.length;\n      geometriesCounts.areas += 1;\n    }\n  });\n\n  return {\n    geometries: {\n      points,\n      bars,\n      areas,\n      lines,\n      bubbles,\n    },\n    geometriesIndex,\n    geometriesCounts,\n  };\n}\n\n/** @internal */\nexport function computeChartTransform({ width, height }: Size, chartRotation: Rotation): Transform {\n  return {\n    x: chartRotation === 90 || chartRotation === 180 ? width : 0,\n    y: chartRotation === -90 || chartRotation === 180 ? height : 0,\n    rotate: chartRotation,\n  };\n}\n\nfunction hasFitFnConfigured(fit?: Fit | FitConfig) {\n  return Boolean(fit && ((fit as FitConfig).type || fit) !== Fit.None);\n}\n\n/** @internal */\nexport function getBarIndexKey({ spec, specId, groupId, yAccessor, splitAccessors }: DataSeries): string {\n  if (isStackedSpec(spec)) {\n    return [groupId, '__stacked__'].join('__-__');\n  }\n\n  return [groupId, specId, ...splitAccessors.values(), yAccessor].join('__-__');\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendItemExtraValues } from '../../../common/legend';\nimport { SeriesKey } from '../../../common/series_id';\nimport { TooltipValue } from '../../../specs';\nimport { PointerValue } from '../../../state/types';\nimport { getAccessorFormatLabel } from '../../../utils/accessor';\nimport { isDefined } from '../../../utils/common';\nimport { BandedAccessorType, IndexedGeometry } from '../../../utils/geometry';\nimport { defaultTickFormatter } from '../utils/axis_utils';\nimport { getSeriesName } from '../utils/series';\nimport { AxisSpec, BasicSeriesSpec, isAreaSeriesSpec, isBarSeriesSpec, TickFormatterOptions } from '../utils/specs';\n\n/** @internal */\nexport const Y0_ACCESSOR_POSTFIX = ' - lower';\n/** @internal */\nexport const Y1_ACCESSOR_POSTFIX = ' - upper';\n\n/** @internal */\nexport function getLegendItemExtraValues(tooltipValues: TooltipValue[]): Map<SeriesKey, LegendItemExtraValues> {\n  const seriesTooltipValues = new Map<SeriesKey, LegendItemExtraValues>();\n\n  tooltipValues.forEach(({ formattedValue, value, seriesIdentifier, valueAccessor }) => {\n    const current: LegendItemExtraValues = seriesTooltipValues.get(seriesIdentifier.key) ?? new Map();\n    if (valueAccessor === BandedAccessorType.Y0 || valueAccessor === BandedAccessorType.Y1) {\n      current.set(valueAccessor, { formatted: formattedValue, raw: value });\n    }\n    seriesTooltipValues.set(seriesIdentifier.key, current);\n  });\n  return seriesTooltipValues;\n}\n\n/** @internal */\nexport function formatTooltipValue(\n  { color, value: { y, mark, accessor, datum }, seriesIdentifier }: IndexedGeometry,\n  spec: BasicSeriesSpec,\n  isHighlighted: boolean,\n  hasSingleSeries: boolean,\n  isBanded: boolean,\n  axisSpec?: AxisSpec,\n): TooltipValue {\n  let label = getSeriesName(seriesIdentifier, hasSingleSeries, true, spec);\n\n  if (isBanded && (isAreaSeriesSpec(spec) || isBarSeriesSpec(spec))) {\n    const { y0AccessorFormat = Y0_ACCESSOR_POSTFIX, y1AccessorFormat = Y1_ACCESSOR_POSTFIX } = spec;\n    const formatter = accessor === BandedAccessorType.Y0 ? y0AccessorFormat : y1AccessorFormat;\n    label = getAccessorFormatLabel(formatter, label);\n  }\n  const isVisible = label.length > 0 && (!spec.filterSeriesInTooltip || spec.filterSeriesInTooltip(seriesIdentifier));\n  const markValue = mark === null || Number.isNaN(mark) ? null : mark;\n  const tickFormatOptions: TickFormatterOptions | undefined = spec.timeZone ? { timeZone: spec.timeZone } : undefined;\n  const tickFormatter = spec.tickFormat ?? axisSpec?.tickFormat ?? defaultTickFormatter;\n\n  return {\n    seriesIdentifier,\n    valueAccessor: accessor,\n    label,\n    value: y,\n    formattedValue: tickFormatter(y, tickFormatOptions),\n    markValue,\n    ...(isDefined(markValue) && {\n      formattedMarkValue: spec.markFormat\n        ? spec.markFormat(markValue, tickFormatOptions)\n        : defaultTickFormatter(markValue),\n    }),\n    color,\n    isHighlighted,\n    isVisible,\n    datum,\n  };\n}\n\n/** @internal */\nexport function formatTooltipHeader(\n  { value: { x } }: IndexedGeometry,\n  spec: BasicSeriesSpec,\n  axisSpec?: AxisSpec,\n): PointerValue {\n  const tickFormatOptions: TickFormatterOptions | undefined = spec.timeZone ? { timeZone: spec.timeZone } : undefined;\n  const tickFormatter = axisSpec?.tickFormat ?? defaultTickFormatter;\n\n  return {\n    value: x,\n    formattedValue: tickFormatter(x, tickFormatOptions),\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Position } from '../../../utils/common';\n\n/** @internal */\nexport function isVerticalAxis(axisPosition: Position): axisPosition is Extract<Position, 'left' | 'right'> {\n  return axisPosition === Position.Left || axisPosition === Position.Right;\n}\n\n/** @internal */\nexport function isHorizontalAxis(axisPosition: Position): axisPosition is Extract<Position, 'top' | 'bottom'> {\n  return axisPosition === Position.Top || axisPosition === Position.Bottom;\n}\n\n/** @internal */\nexport function isVerticalGrid(axisPosition: Position) {\n  return isHorizontalAxis(axisPosition);\n}\n\n/** @internal */\nexport function isHorizontalGrid(axisPosition: Position) {\n  return isVerticalAxis(axisPosition);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isHorizontalAxis, isVerticalAxis } from './axis_type_utils';\nimport { computeXScale, computeYScales } from './scales';\nimport { SmallMultipleScales, hasSMDomain, getPanelSize } from '../../../common/panel_utils';\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { AxisSpec, SettingsSpec } from '../../../specs';\nimport {\n  degToRad,\n  getPercentageValue,\n  HorizontalAlignment,\n  Position,\n  Rotation,\n  VerticalAlignment,\n} from '../../../utils/common';\nimport { Dimensions, innerPad, outerPad, PerSideDistance, Size } from '../../../utils/dimensions';\nimport { Range } from '../../../utils/domain';\nimport { AxisId } from '../../../utils/ids';\nimport { Point } from '../../../utils/point';\nimport { AxisStyle, TextAlignment, TextOffset, Theme } from '../../../utils/themes/theme';\nimport { Projection } from '../state/selectors/visible_ticks';\nimport { SeriesDomainsAndData } from '../state/utils/types';\n\ntype TickValue = number | string;\n\n/** @internal */\nexport type TextDirection = 'rtl' | 'ltr';\n\n/** @internal */\nexport interface AxisTick {\n  value: TickValue;\n  domainClampedValue: TickValue;\n  label: string;\n  position: number;\n  domainClampedPosition: number;\n  layer?: number;\n  detailedLayer: number;\n  showGrid: boolean;\n  direction: TextDirection;\n}\n\n/** @internal */\nexport interface TickLabelBounds {\n  maxLabelBboxWidth: number;\n  maxLabelBboxHeight: number;\n  maxLabelTextWidth: number;\n  maxLabelTextHeight: number;\n  isHidden: boolean;\n}\n\ninterface TickLabelProps {\n  x: number;\n  y: number;\n  offsetX: number;\n  offsetY: number;\n  textOffsetX: number;\n  textOffsetY: number;\n  horizontalAlign: Extract<\n    HorizontalAlignment,\n    typeof HorizontalAlignment.Left | typeof HorizontalAlignment.Center | typeof HorizontalAlignment.Right\n  >;\n  verticalAlign: Extract<\n    VerticalAlignment,\n    typeof VerticalAlignment.Top | typeof VerticalAlignment.Middle | typeof VerticalAlignment.Bottom\n  >;\n}\n\n/** @internal */\nexport const defaultTickFormatter = (tick: unknown) => `${tick}`;\n\n/** @internal */\nexport function isXDomain(position: Position, chartRotation: Rotation): boolean {\n  return isHorizontalAxis(position) === (chartRotation % 180 === 0);\n}\n\n/** @internal */\nexport function getScaleForAxisSpec(\n  { xDomain, yDomains }: Pick<SeriesDomainsAndData, 'xDomain' | 'yDomains'>,\n  { rotation: chartRotation }: Pick<SettingsSpec, 'rotation'>,\n  totalBarsInCluster: number,\n  barsPadding?: number,\n  enableHistogramMode?: boolean,\n) {\n  return (\n    {\n      groupId,\n      integersOnly,\n      maximumFractionDigits: mfd,\n      position,\n    }: Pick<AxisSpec, 'groupId' | 'integersOnly' | 'maximumFractionDigits' | 'position'>,\n    range: Range,\n  ): ScaleContinuous | ScaleBand | null => {\n    // TODO: remove this fallback when integersOnly is removed\n    const maximumFractionDigits = mfd ?? (integersOnly ? 0 : undefined);\n\n    return isXDomain(position, chartRotation)\n      ? computeXScale({ xDomain, totalBarsInCluster, range, barsPadding, enableHistogramMode, maximumFractionDigits })\n      : computeYScales({ yDomains, range, maximumFractionDigits }).get(groupId) ?? null;\n  };\n}\n\n/** @internal */\nexport function computeRotatedLabelDimensions(unrotatedDims: Size, degreesRotation: number): Size {\n  const { width, height } = unrotatedDims;\n  const radians = degToRad(degreesRotation);\n  const rotatedHeight = Math.abs(width * Math.sin(radians)) + Math.abs(height * Math.cos(radians));\n  const rotatedWidth = Math.abs(width * Math.cos(radians)) + Math.abs(height * Math.sin(radians));\n  return { width: rotatedWidth, height: rotatedHeight };\n}\n\nfunction getUserTextOffsets(dimensions: TickLabelBounds, { x, y, reference }: TextOffset) {\n  return reference === 'global'\n    ? {\n        local: { x: 0, y: 0 },\n        global: {\n          x: getPercentageValue(x, dimensions.maxLabelBboxWidth, 0),\n          y: getPercentageValue(y, dimensions.maxLabelBboxHeight, 0),\n        },\n      }\n    : {\n        local: {\n          x: getPercentageValue(x, dimensions.maxLabelTextWidth, 0),\n          y: getPercentageValue(y, dimensions.maxLabelTextHeight, 0),\n        },\n        global: { x: 0, y: 0 },\n      };\n}\n\nconst horizontalOffsetMultiplier = {\n  [HorizontalAlignment.Left]: -1,\n  [HorizontalAlignment.Right]: 1,\n  [HorizontalAlignment.Center]: 0,\n};\n\nconst verticalOffsetMultiplier = {\n  [VerticalAlignment.Top]: -1,\n  [VerticalAlignment.Bottom]: 1,\n  [VerticalAlignment.Middle]: 0,\n};\n\nfunction getHorizontalAlign(\n  position: Position,\n  rotation: number,\n  alignment: HorizontalAlignment,\n): Exclude<HorizontalAlignment, typeof HorizontalAlignment.Far | typeof HorizontalAlignment.Near> {\n  if (\n    alignment === HorizontalAlignment.Center ||\n    alignment === HorizontalAlignment.Right ||\n    alignment === HorizontalAlignment.Left\n  ) {\n    return alignment;\n  }\n\n  if (Math.abs(rotation) === 90) {\n    if (position === Position.Top) {\n      return rotation === 90 ? HorizontalAlignment.Right : HorizontalAlignment.Left;\n    } else if (position === Position.Bottom) {\n      return rotation === -90 ? HorizontalAlignment.Right : HorizontalAlignment.Left;\n    }\n  } else {\n    if (position === Position.Left) {\n      return alignment === HorizontalAlignment.Near ? HorizontalAlignment.Right : HorizontalAlignment.Left;\n    } else if (position === Position.Right) {\n      return alignment === HorizontalAlignment.Near ? HorizontalAlignment.Left : HorizontalAlignment.Right;\n    }\n  }\n\n  return HorizontalAlignment.Center; // fallback for near/far on top/bottom axis\n}\n\nfunction getVerticalAlign(\n  position: Position,\n  rotation: number,\n  alignment: VerticalAlignment,\n): Exclude<VerticalAlignment, typeof VerticalAlignment.Far | typeof VerticalAlignment.Near> {\n  if (\n    alignment === VerticalAlignment.Middle ||\n    alignment === VerticalAlignment.Top ||\n    alignment === VerticalAlignment.Bottom\n  ) {\n    return alignment;\n  }\n\n  if (rotation % 180 === 0) {\n    if (position === Position.Left) {\n      return rotation === 0 ? VerticalAlignment.Bottom : VerticalAlignment.Top;\n    } else if (position === Position.Right) {\n      return rotation === 180 ? VerticalAlignment.Bottom : VerticalAlignment.Top;\n    }\n  } else {\n    if (position === Position.Top) {\n      return alignment === VerticalAlignment.Near ? VerticalAlignment.Bottom : VerticalAlignment.Top;\n    } else if (position === Position.Bottom) {\n      return alignment === VerticalAlignment.Near ? VerticalAlignment.Top : VerticalAlignment.Bottom;\n    }\n  }\n\n  return VerticalAlignment.Middle; // fallback for near/far on left/right axis\n}\n\n/** @internal */\nexport function getTickLabelPosition(\n  { tickLine, tickLabel }: AxisStyle,\n  tickPosition: number,\n  pos: Position,\n  rotation: number,\n  axisSize: Size,\n  tickDimensions: TickLabelBounds,\n  showTicks: boolean,\n  textOffset: TextOffset,\n  textAlignment: TextAlignment,\n): TickLabelProps {\n  const { maxLabelBboxWidth, maxLabelTextWidth, maxLabelBboxHeight, maxLabelTextHeight } = tickDimensions;\n  const tickDimension = showTicks ? tickLine.size + tickLine.padding : 0;\n  const labelInnerPadding = innerPad(tickLabel.padding);\n  const horizontalAlign = getHorizontalAlign(pos, rotation, textAlignment.horizontal);\n  const verticalAlign = getVerticalAlign(pos, rotation, textAlignment.vertical);\n  const userOffsets = getUserTextOffsets(tickDimensions, textOffset);\n  const paddedTickDimension = tickDimension + labelInnerPadding;\n  const axisNetSize = (isVerticalAxis(pos) ? axisSize.width : axisSize.height) - paddedTickDimension;\n  const labelBoxHalfGirth = isHorizontalAxis(pos) ? maxLabelBboxHeight / 2 : maxLabelBboxWidth / 2;\n  const labelHalfWidth = maxLabelTextWidth / 2;\n  return {\n    horizontalAlign,\n    verticalAlign,\n    x: pos === Position.Left ? axisNetSize : pos === Position.Right ? paddedTickDimension : tickPosition,\n    y: pos === Position.Top ? axisNetSize : pos === Position.Bottom ? paddedTickDimension : tickPosition,\n    offsetX: userOffsets.global.x + (isHorizontalAxis(pos) ? 0 : horizontalOffsetMultiplier[pos] * labelBoxHalfGirth),\n    offsetY: userOffsets.global.y + (isVerticalAxis(pos) ? 0 : verticalOffsetMultiplier[pos] * labelBoxHalfGirth),\n    textOffsetX:\n      userOffsets.local.x +\n      (isHorizontalAxis(pos) && rotation === 0 ? 0 : labelHalfWidth * horizontalOffsetMultiplier[horizontalAlign]),\n    textOffsetY: userOffsets.local.y + (maxLabelTextHeight / 2) * verticalOffsetMultiplier[verticalAlign],\n  };\n}\n\n/** @internal */\nexport function getTitleDimension({\n  visible,\n  fontSize,\n  padding,\n}: AxisStyle['axisTitle'] | AxisStyle['axisPanelTitle']): number {\n  return visible && fontSize > 0 ? innerPad(padding) + fontSize + outerPad(padding) : 0;\n}\n\n/** @internal */\nexport const getAllAxisLayersGirth = (\n  timeAxisLayerCount: number,\n  maxLabelBoxGirth: number,\n  axisHorizontal: boolean,\n) => {\n  const axisLayerCount = timeAxisLayerCount > 0 && axisHorizontal ? timeAxisLayerCount : 1;\n  return axisLayerCount * maxLabelBoxGirth;\n};\n\n/** @internal */\nexport function getPosition(\n  { chartDimensions }: { chartDimensions: Dimensions },\n  chartMargins: PerSideDistance,\n  { axisTitle, axisPanelTitle, tickLine, tickLabel }: AxisStyle,\n  { title, position, hide, timeAxisLayerCount }: AxisSpec,\n  { maxLabelBboxHeight, maxLabelBboxWidth }: TickLabelBounds,\n  smScales: SmallMultipleScales,\n  { top: cumTopSum, bottom: cumBottomSum, left: cumLeftSum, right: cumRightSum }: PerSideDistance,\n) {\n  const tickDimension = shouldShowTicks(tickLine, hide) ? tickLine.size + tickLine.padding : 0;\n  const labelPaddingSum = tickLabel.visible ? innerPad(tickLabel.padding) + outerPad(tickLabel.padding) : 0;\n  const titleDimension = title ? getTitleDimension(axisTitle) : 0;\n  const vertical = isVerticalAxis(position);\n  const scaleBand = vertical ? smScales.vertical : smScales.horizontal;\n  const panelTitleDimension = hasSMDomain(scaleBand) ? getTitleDimension(axisPanelTitle) : 0;\n  const maxLabelBboxGirth = tickLabel.visible ? (vertical ? maxLabelBboxWidth : maxLabelBboxHeight) : 0;\n  const shownLabelSize = getAllAxisLayersGirth(timeAxisLayerCount, maxLabelBboxGirth, !vertical);\n  const parallelSize = labelPaddingSum + shownLabelSize + tickDimension + titleDimension + panelTitleDimension;\n  return {\n    leftIncrement: position === Position.Left ? parallelSize + chartMargins.left : 0,\n    rightIncrement: position === Position.Right ? parallelSize + chartMargins.right : 0,\n    topIncrement: position === Position.Top ? parallelSize + chartMargins.top : 0,\n    bottomIncrement: position === Position.Bottom ? parallelSize + chartMargins.bottom : 0,\n    dimensions: {\n      left:\n        position === Position.Left\n          ? chartMargins.left + cumLeftSum\n          : chartDimensions.left + (position === Position.Right ? chartDimensions.width + cumRightSum : 0),\n      top:\n        position === Position.Top\n          ? chartMargins.top + cumTopSum\n          : chartDimensions.top + (position === Position.Bottom ? chartDimensions.height + cumBottomSum : 0),\n      width: vertical ? parallelSize : chartDimensions.width,\n      height: vertical ? chartDimensions.height : parallelSize,\n    },\n  };\n}\n\n/** @internal */\nexport function shouldShowTicks({ visible }: AxisStyle['tickLine'], axisHidden: boolean): boolean {\n  return !axisHidden && visible;\n}\n\n/** @internal */\nexport interface AxisGeometry {\n  anchorPoint: Point;\n  size: Size;\n  parentSize: Size;\n  axis: {\n    id: AxisId;\n    position: Position;\n    panelTitle?: string; // defined later per panel\n    secondary?: boolean; // defined later per panel\n  };\n  dimension: TickLabelBounds;\n  visibleTicks: AxisTick[];\n}\n\n/** @internal */\nexport function getAxesGeometries(\n  chartDims: { chartDimensions: Dimensions; leftMargin: number },\n  { chartPaddings, chartMargins, axes: sharedAxesStyle }: Theme,\n  axisSpecs: Map<AxisId, AxisSpec>,\n  axesStyles: Map<AxisId, AxisStyle | null>,\n  smScales: SmallMultipleScales,\n  visibleTicksSet: Map<AxisId, Projection>,\n): AxisGeometry[] {\n  const panel = getPanelSize(smScales);\n  return [...visibleTicksSet].reduce(\n    (acc: PerSideDistance & { geoms: AxisGeometry[] }, [axisId, { ticks, labelBox }]: [AxisId, Projection]) => {\n      const axisSpec = axisSpecs.get(axisId);\n      if (axisSpec) {\n        const vertical = isVerticalAxis(axisSpec.position);\n        const axisStyle = axesStyles.get(axisId) ?? sharedAxesStyle;\n        const { dimensions, topIncrement, bottomIncrement, leftIncrement, rightIncrement } = getPosition(\n          chartDims,\n          chartMargins,\n          axisStyle,\n          axisSpec,\n          labelBox,\n          smScales,\n          acc,\n        );\n        acc.top += topIncrement;\n        acc.bottom += bottomIncrement;\n        acc.left += leftIncrement;\n        acc.right += rightIncrement;\n        acc.geoms.push({\n          axis: { id: axisSpec.id, position: axisSpec.position },\n          anchorPoint: { x: dimensions.left, y: dimensions.top },\n          dimension: labelBox,\n          visibleTicks: ticks,\n          parentSize: { height: dimensions.height, width: dimensions.width },\n          size: {\n            width: labelBox.isHidden ? 0 : vertical ? dimensions.width : panel.width,\n            height: labelBox.isHidden ? 0 : vertical ? panel.height : dimensions.height,\n          },\n        });\n      } else {\n        throw new Error(`Cannot compute scale for axis spec ${axisId}`); // todo move this feedback as upstream as possible\n      }\n      return acc;\n    },\n    { geoms: [], top: 0, bottom: chartPaddings.bottom, left: chartDims.leftMargin, right: chartPaddings.right },\n  ).geoms;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DataSeries } from './series';\n\n/**\n * Return the default sorting used for XY series.\n * Ordered by group insert order, then first stacked, after non stacked.\n * @internal\n */\nexport function defaultXYSeriesSort(a: DataSeries, b: DataSeries) {\n  if (a.groupId !== b.groupId) {\n    return a.insertIndex - b.insertIndex;\n  }\n\n  if (a.isStacked && !b.isStacked) {\n    return -1; // a first then b\n  }\n  if (!a.isStacked && b.isStacked) {\n    return 1; // b first then a\n  }\n  return a.insertIndex - b.insertIndex;\n}\n\n/**\n * Return the default sorting used for XY series.\n * Ordered by group insert order, then first stacked, after non stacked.\n * Stacked series are sorted by their insert order\n * @internal\n */\nexport function defaultXYLegendSeriesSort(a?: DataSeries, b?: DataSeries) {\n  if (!a || !b) return 0;\n  if (a.groupId !== b.groupId) {\n    return a.insertIndex - b.insertIndex;\n  }\n\n  if (a.isStacked && !b.isStacked) {\n    return -1; // a first then b\n  }\n  if (!a.isStacked && b.isStacked) {\n    return 1; // b first then a\n  }\n  return a.insertIndex - b.insertIndex;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AxisSpec } from './specs';\nimport { SmallMultiplesSpec } from '../../../specs';\nimport { Dimensions } from '../../../utils/dimensions';\nimport { AxisId } from '../../../utils/ids';\nimport { Theme, AxisStyle } from '../../../utils/themes/theme';\nimport { getAxesDimensions } from '../axes/axes_sizes';\nimport { AxesTicksDimensions } from '../state/selectors/compute_axis_ticks_dimensions';\n\n/**\n * @internal\n */\nexport interface ChartDimensions {\n  /**\n   * Dimensions relative to canvas element\n   */\n  chartDimensions: Dimensions;\n  /**\n   * Margin to account for ending text overflow\n   */\n  leftMargin: number;\n} /**/\n\n/**\n * Compute the chart dimensions. It's computed removing from the parent dimensions\n * the axis spaces, the legend and any other specified style margin and padding.\n * @internal\n */ export function computeChartDimensions(\n  parentDimensions: Dimensions,\n  theme: Theme,\n  axisTickDimensions: AxesTicksDimensions,\n  axesStyles: Map<AxisId, AxisStyle | null>,\n  axisSpecs: AxisSpec[],\n  smSpec: SmallMultiplesSpec | null,\n): ChartDimensions {\n  const axesDimensions = getAxesDimensions(theme, axisTickDimensions, axesStyles, axisSpecs, smSpec);\n  const chartWidth = parentDimensions.width - axesDimensions.left - axesDimensions.right;\n  const chartHeight = parentDimensions.height - axesDimensions.top - axesDimensions.bottom;\n  const pad = theme.chartPaddings;\n  return {\n    leftMargin: axesDimensions.margin.left,\n    chartDimensions: {\n      top: axesDimensions.top + pad.top,\n      left: axesDimensions.left + pad.left,\n      width: Math.max(0, chartWidth - pad.left - pad.right),\n      height: Math.max(0, chartHeight - pad.top - pad.bottom),\n    },\n  };\n}\n","/* eslint-disable header/header, no-param-reassign */\n\n/**\n * @notice\n * This product includes code that is adapted from d3-shape@3.0.1,\n * which is available under a \"ISC\" license.\n *\n * ISC License\n *\n * Copyright 2010-2021 Mike Bostock\n * Permission to use, copy, modify, and/or distribute this software for any purpose\n * with or without fee is hereby granted, provided that the above copyright notice\n * and this permission notice appear in all copies.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\n * REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND\n * FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\n * INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS\n * OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER\n * TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF\n * THIS SOFTWARE.\n */\n\nimport { Series, SeriesPoint } from 'd3-shape';\n\nimport { DataSeriesDatum } from './series';\nimport { SeriesKey } from '../../../common/series_id';\n\ntype XValue = string | number;\ntype SeriesValueMap = Map<SeriesKey, DataSeriesDatum>;\n\n/** @internal */\nexport type XValueMap = Map<XValue, SeriesValueMap>;\n/** @internal */\nexport type XValueSeriesDatum = [XValue, SeriesValueMap];\n\n/**\n * Computes required wiggle offset for each x value __WITHOUT__ mutations\n */\nfunction getWiggleOffsets<K = string>(series: Series<XValueSeriesDatum, K>, order: number[]): number[] {\n  const offsets = [];\n  let y, j;\n  for (y = 0, j = 1; j < (series[order[0] ?? 0]?.length ?? 0); ++j) {\n    let i, s1, s2;\n    for (i = 0, s1 = 0, s2 = 0; i < series.length; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const si = series[order[i]] as SeriesPoint<XValueSeriesDatum>[];\n      const sij0 = si[j]?.[1] || 0;\n      const sij1 = si[j - 1]?.[1] || 0;\n      let s3 = (sij0 - sij1) / 2;\n\n      for (let k = 0; k < i; ++k) {\n        // @ts-ignore - d3-shape type here is inaccurate\n        const sk = series[order[k]] as SeriesPoint<XValueSeriesDatum>[];\n        const skj0 = sk[j]?.[1] || 0;\n        const skj1 = sk[j - 1]?.[1] || 0;\n        s3 += skj0 - skj1;\n      }\n      s1 += sij0;\n      s2 += s3 * sij0;\n    }\n\n    offsets.push(y);\n    if (s1) y -= s2 / s1;\n  }\n  offsets.push(y);\n  return offsets;\n}\n\n/** @internal */\nconst divergingOffset = (isSilhouette = false) => {\n  return function <K = 'string'>(series: Series<XValueSeriesDatum, K>, order: number[]): void {\n    const n = series.length;\n    if (!(n > 0)) return;\n    for (let i, j = 0, sumYn, sumYp, yp, yn = 0, s0 = series[order[0] ?? 0], m = s0?.length ?? 0; j < m; ++j) {\n      // sum negative values per x before to maintain original sort for negative values\n      for (yn = 0, sumYn = 0, sumYp = 0, i = 0; i < n; ++i) {\n        // @ts-ignore - d3-shape type here is inaccurate\n        const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n        const dy = d[1] - d[0];\n        if (dy < 0) {\n          sumYn += Math.abs(d[1]) || 0;\n          yn += dy;\n        } else {\n          sumYp += d[1] || 0;\n        }\n      }\n\n      const silhouetteOffset = sumYp / 2 - sumYn / 2;\n      const offset = isSilhouette ? -silhouetteOffset : 0;\n      yn += offset;\n\n      for (yp = offset, i = 0; i < n; ++i) {\n        // @ts-ignore - d3-shape type here is inaccurate\n        const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n        const dy = d[1] - d[0];\n        if (dy >= 0) {\n          d[0] = yp;\n          d[1] = yp += dy;\n        } else {\n          d[1] = yn;\n          d[0] = yn -= dy;\n        }\n      }\n    }\n  };\n};\n\n/**\n * Stacked offset function with diverging polarity offset\n * @internal\n */\nexport const diverging = divergingOffset();\n/**\n * Stacked Silhouette offset function with diverging polarity offset\n * @internal\n */\nexport const divergingSilhouette = divergingOffset(true);\n\n/**\n * Stacked Wiggle offset function to account for diverging offset\n * @internal\n */\nexport function divergingWiggle<K = 'string'>(series: Series<XValueSeriesDatum, K>, order: number[]): void {\n  const n = series.length;\n  const s0 = series[order[0] ?? 0];\n  const m = s0?.length ?? 0;\n  if (!(n > 0) || !(m > 0)) return diverging(series, order);\n\n  const offsets = getWiggleOffsets(series, order);\n\n  for (let i, j = 0, sumYn, yp, yn = 0; j < m; ++j) {\n    // sum negative values per x before to maintain original sort for negative values\n    for (i = 0, yn = 0, sumYn = 0; i < n; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n      if (d[1] - d[0] < 0) {\n        sumYn += Math.abs(d[1]) || 0;\n      }\n    }\n\n    const offset = offsets[j] ?? 0;\n    yn += offset;\n\n    for (yp = offset + sumYn, yn = offset, i = 0; i < n; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n      const dy = d[1] - d[0];\n      if (dy >= 0) {\n        d[0] = yp;\n        d[1] = yp += dy;\n      } else {\n        d[1] = yn;\n        d[0] = yn -= dy;\n      }\n    }\n  }\n}\n\n/**\n * Stacked Percentage offset function with diverging polarity offset\n * Treats percentage as participation for mixed polarity data\n * @internal\n */\nexport function divergingPercentage<K = 'string'>(series: Series<XValueSeriesDatum, K>, order: number[]): void {\n  const n = series.length;\n  if (!(n > 0)) return;\n  for (let i, j = 0, sumYn, sumYp; j < (series[0]?.length ?? 0); ++j) {\n    for (sumYn = sumYp = i = 0; i < n; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n      if (d[1] - d[0] < 0) {\n        sumYn += Math.abs(d[1]) || 0;\n      } else {\n        sumYp += d[1] || 0;\n      }\n    }\n\n    const sumY = sumYn + sumYp;\n    if (sumY === 0) continue; // must not return, else loop will stop\n\n    let yp = sumYn / sumY;\n    let yn = 0;\n\n    for (i = 0; i < n; ++i) {\n      // @ts-ignore - d3-shape type here is inaccurate\n      const d = series[order[i]][j] as SeriesPoint<XValueSeriesDatum>;\n      const dy = d[1] - d[0];\n      const participation = Math.abs(dy / sumY);\n\n      if (dy >= 0) {\n        d[0] = yp;\n        d[1] = yp += participation;\n      } else {\n        d[0] = yn;\n        d[1] = yn += participation;\n      }\n    }\n  }\n}\n\n/* eslint-enable header/header, no-param-reassign */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DataSeries } from './series';\nimport { BasicSeriesSpec, isLineSeriesSpec, isAreaSeriesSpec } from './specs';\nimport { ScaleType } from '../../../scales/constants';\n\n/**\n * @internal\n */\nexport function fillSeries(\n  dataSeries: DataSeries[],\n  xValues: Set<string | number>,\n  groupScaleType: ScaleType,\n): DataSeries[] {\n  const sortedXValues = [...xValues.values()];\n  return dataSeries.map((series) => {\n    const { spec, data, isStacked } = series;\n\n    const noFillRequired = isXFillNotRequired(spec, groupScaleType, isStacked);\n    if (data.length === xValues.size || noFillRequired) {\n      return {\n        ...series,\n        data,\n      };\n    }\n    const filledData: typeof data = [];\n    const missingValues = new Set(xValues);\n\n    data.forEach((datum) => {\n      filledData.push(datum);\n      missingValues.delete(datum.x);\n    });\n\n    const missingValuesArray = [...missingValues.values()];\n\n    missingValuesArray.forEach((missingValue) => {\n      const index = sortedXValues.indexOf(missingValue);\n\n      filledData.splice(index, 0, {\n        x: missingValue,\n        y1: null,\n        y0: null,\n        initialY1: null,\n        initialY0: null,\n        mark: null,\n        datum: undefined,\n        filled: {\n          x: missingValue,\n        },\n      });\n    });\n\n    return {\n      ...series,\n      data: filledData,\n    };\n  });\n}\n\nfunction isXFillNotRequired(spec: BasicSeriesSpec, groupScaleType: ScaleType, isStacked: boolean) {\n  const onlyNoFitAreaLine = (isAreaSeriesSpec(spec) || isLineSeriesSpec(spec)) && !spec.fit;\n  const onlyContinuous =\n    groupScaleType === ScaleType.Linear ||\n    groupScaleType === ScaleType.LinearBinary ||\n    groupScaleType === ScaleType.Time;\n  return onlyNoFitAreaLine && onlyContinuous && !isStacked;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DeepNonNullable } from 'utility-types';\n\nimport { DataSeriesDatum } from './series';\nimport { Fit, FitConfig } from './specs';\nimport { datumXSortPredicate } from './stacked_series_utils';\nimport { ScaleType } from '../../../scales/constants';\nimport { isNil } from '../../../utils/common';\n\n/**\n * Fit type that requires previous and/or next `non-nullable` values\n *\n */\ntype BoundingFit = Exclude<Fit, 'none' | 'explicit'>;\n\n/**\n * `DataSeriesDatum` with non-`null` value for `x` and `y1`\n * @internal\n */\nexport type FullDataSeriesDatum = Omit<DataSeriesDatum, 'y1' | 'x'> &\n  DeepNonNullable<Pick<DataSeriesDatum, 'y1' | 'x'>>;\n\n/**\n * Embellishes `FullDataSeriesDatum` with `fittingIndex` for ordinal scales\n * @internal\n */\nexport type WithIndex<T> = T & { fittingIndex: number };\n\n/**\n * Returns `[x, y1]` values for a given datum with `fittingIndex`\n *\n */\nconst getXYValues = ({ x, y1, fittingIndex }: WithIndex<FullDataSeriesDatum>): [number, number] => [\n  typeof x === 'string' ? fittingIndex : x,\n  y1,\n];\n\n/** @internal */\nexport const getValue = (\n  current: DataSeriesDatum,\n  currentIndex: number,\n  previous: WithIndex<FullDataSeriesDatum> | null,\n  next: WithIndex<FullDataSeriesDatum> | null,\n  type: BoundingFit,\n  endValue?: number | 'nearest',\n): DataSeriesDatum => {\n  if (previous !== null && type === Fit.Carry) {\n    const { y1 } = previous;\n    return {\n      ...current,\n      y1,\n      filled: {\n        ...current.filled,\n        y1,\n      },\n    };\n  }\n  if (next !== null && type === Fit.Lookahead) {\n    const { y1 } = next;\n    return {\n      ...current,\n      y1,\n      filled: {\n        ...current.filled,\n        y1,\n      },\n    };\n  }\n  if (previous !== null && next !== null) {\n    if (type === Fit.Average) {\n      const y1 = (previous.y1 + next.y1) / 2;\n      return {\n        ...current,\n        y1,\n        filled: {\n          ...current.filled,\n          y1,\n        },\n      };\n    }\n    if (current.x !== null && previous.x !== null && next.x !== null) {\n      const [x1, y1] = getXYValues(previous);\n      const [x2, y2] = getXYValues(next);\n      const currentX = typeof current.x === 'string' ? currentIndex : current.x;\n\n      if (type === Fit.Nearest) {\n        const x1Delta = Math.abs(currentX - x1);\n        const x2Delta = Math.abs(currentX - x2);\n        const y1Delta = x1Delta > x2Delta ? y2 : y1;\n        return {\n          ...current,\n          y1: y1Delta,\n          filled: {\n            ...current.filled,\n            y1: y1Delta,\n          },\n        };\n      }\n      if (type === Fit.Linear) {\n        // simple linear interpolation function\n        const linearInterpolatedY1 = previous.y1 + (currentX - x1) * ((y2 - y1) / (x2 - x1));\n        return {\n          ...current,\n          y1: linearInterpolatedY1,\n          filled: {\n            ...current.filled,\n            y1: linearInterpolatedY1,\n          },\n        };\n      }\n    }\n  } else if ((previous !== null || next !== null) && (type === Fit.Nearest || endValue === 'nearest')) {\n    const nearestY1 = previous !== null ? previous.y1 : next!.y1;\n    return {\n      ...current,\n      y1: nearestY1,\n      filled: {\n        ...current.filled,\n        y1: nearestY1,\n      },\n    };\n  }\n\n  if (endValue === undefined || typeof endValue === 'string') {\n    return current;\n  }\n\n  // No matching fit - should only fall here on end conditions\n  return {\n    ...current,\n    y1: endValue,\n    filled: {\n      ...current.filled,\n      y1: endValue,\n    },\n  };\n};\n\n/** @internal */\nexport const parseConfig = (config?: Exclude<Fit, 'explicit'> | FitConfig): FitConfig => {\n  if (!config) {\n    return {\n      type: Fit.None,\n    };\n  }\n\n  if (typeof config === 'string') {\n    return {\n      type: config,\n    };\n  }\n\n  if (config.type === Fit.Explicit && config.value === undefined) {\n    // Using explicit fit function requires a value\n    return {\n      type: Fit.None,\n    };\n  }\n\n  return {\n    type: config.type,\n    value: config.type === Fit.Explicit ? config.value : undefined,\n    endValue: config.endValue,\n  };\n};\n\n/** @internal */\nexport const fitFunction = (\n  data: DataSeriesDatum[],\n  fitConfig: Exclude<Fit, 'explicit'> | FitConfig,\n  xScaleType: ScaleType,\n  sorted = false,\n): DataSeriesDatum[] => {\n  const { type, value, endValue } = parseConfig(fitConfig);\n\n  if (type === Fit.None) {\n    return data;\n  }\n\n  if (type === Fit.Zero) {\n    return data.map((datum) => ({\n      ...datum,\n      y1: datum.y1 === null ? 0 : datum.y1,\n      filled: {\n        ...datum.filled,\n        y1: datum.y1 === null ? 0 : undefined,\n      },\n    }));\n  }\n\n  if (type === Fit.Explicit) {\n    if (value === undefined) {\n      return data;\n    }\n\n    return data.map((datum) => ({\n      ...datum,\n      y1: datum.y1 === null ? value : datum.y1,\n      filled: {\n        ...datum.filled,\n        y1: datum.y1 === null ? value : undefined,\n      },\n    }));\n  }\n\n  const sortedData =\n    sorted || xScaleType === ScaleType.Ordinal ? data : data.slice().sort(datumXSortPredicate(xScaleType));\n  const newData: DataSeriesDatum[] = [];\n  let previousNonNullDatum: WithIndex<FullDataSeriesDatum> | null = null;\n  let nextNonNullDatum: WithIndex<FullDataSeriesDatum> | null = null;\n\n  sortedData.forEach((currentValue, i) => {\n    let j = i;\n\n    if (\n      currentValue.y1 === null &&\n      nextNonNullDatum === null &&\n      (type === Fit.Lookahead ||\n        type === Fit.Nearest ||\n        type === Fit.Average ||\n        type === Fit.Linear ||\n        endValue === 'nearest')\n    ) {\n      // Forward lookahead to get next non-null value\n      for (j = i + 1; j < sortedData.length; j++) {\n        const nextValue = sortedData[j];\n        if (isNil(nextValue)) continue;\n\n        if (nextValue.y1 !== null && nextValue.x !== null) {\n          nextNonNullDatum = {\n            ...(nextValue as FullDataSeriesDatum),\n            fittingIndex: j,\n          };\n          break;\n        }\n      }\n    }\n\n    const newValue =\n      currentValue.y1 === null\n        ? getValue(currentValue, i, previousNonNullDatum, nextNonNullDatum, type, endValue)\n        : currentValue;\n\n    newData[i] = newValue;\n\n    if (currentValue.y1 !== null && currentValue.x !== null) {\n      previousNonNullDatum = {\n        ...(currentValue as FullDataSeriesDatum),\n        fittingIndex: i,\n      };\n    }\n\n    if (nextNonNullDatum !== null && nextNonNullDatum.x <= currentValue.x) {\n      nextNonNullDatum = null;\n    }\n  });\n\n  return newData;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { fitFunction } from './fit_function';\nimport { DataSeries } from './series';\nimport { isAreaSeriesSpec, isLineSeriesSpec, SeriesSpecs, BasicSeriesSpec } from './specs';\nimport { ScaleType } from '../../../scales/constants';\nimport { getSpecsById } from '../state/utils/spec';\n\n/** @internal */\nexport const applyFitFunctionToDataSeries = (\n  dataSeries: DataSeries[],\n  seriesSpecs: SeriesSpecs,\n  xScaleType: ScaleType,\n): DataSeries[] => {\n  return dataSeries.map(({ specId, data, ...rest }) => {\n    const spec = getSpecsById<BasicSeriesSpec>(seriesSpecs, specId);\n\n    if (\n      spec !== null &&\n      spec !== undefined &&\n      (isAreaSeriesSpec(spec) || isLineSeriesSpec(spec)) &&\n      spec.fit !== undefined\n    ) {\n      const fittedData = fitFunction(data, spec.fit, xScaleType);\n\n      return {\n        specId,\n        ...rest,\n        data: fittedData,\n      };\n    }\n    return { specId, data, ...rest };\n  });\n};\n","/* eslint-disable header/header, no-param-reassign */\n\n/**\n * @notice\n * This product includes code that is adapted from d3-array@3.0.4 and d3-scale@4.0.2,\n * which are both available under a \"ISC\" license.\n *\n * ISC License\n *\n * Copyright 2010-2021 Mike Bostock\n * Permission to use, copy, modify, and/or distribute this software for any purpose\n * with or without fee is hereby granted, provided that the above copyright notice\n * and this permission notice appear in all copies.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\n * REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND\n * FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\n * INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS\n * OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER\n * TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF\n * THIS SOFTWARE.\n */\n\nimport { ScaleContinuousNumeric } from 'd3-scale';\n\nimport { isNil } from '../../../utils/common';\nimport { PrimitiveValue } from '../../partition_chart/layout/utils/group_by_rollup';\n\nconst e10 = Math.sqrt(50);\nconst e5 = Math.sqrt(10);\nconst e2 = Math.sqrt(2);\n\n/** @internal */\nexport function getLinearTicks(start: number, stop: number, count: number, base: number = 2): number[] {\n  let reverse,\n    i = -1,\n    n,\n    ticks,\n    step;\n\n  stop = +stop;\n  start = +start;\n  count = +count;\n  if (start === stop && count > 0) return [start];\n  if ((reverse = stop < start)) {\n    n = start;\n    start = stop;\n    stop = n;\n  }\n  if ((step = tickIncrement(start, stop, count, base)) === 0 || !isFinite(step)) return [];\n\n  if (step > 0) {\n    let r0 = Math.round(start / step),\n      r1 = Math.round(stop / step);\n    if (r0 * step < start) ++r0;\n    if (r1 * step > stop) --r1;\n    ticks = new Array((n = r1 - r0 + 1));\n    while (++i < n) ticks[i] = (r0 + i) * step;\n  } else {\n    step = -step;\n    let r0 = Math.round(start * step),\n      r1 = Math.round(stop * step);\n    if (r0 / step < start) ++r0;\n    if (r1 / step > stop) --r1;\n    ticks = new Array((n = r1 - r0 + 1));\n    while (++i < n) ticks[i] = (r0 + i) / step;\n  }\n\n  if (reverse) ticks.reverse();\n\n  return ticks;\n}\n\nfunction tickIncrement(start: number, stop: number, count: number, base: number = 10) {\n  const step = (stop - start) / Math.max(0, count);\n  const power = Math.floor(Math.log(step) / Math.log(base) + Number.EPSILON);\n  const error = step / Math.pow(base, power);\n  return power >= 0\n    ? (error >= e10 ? 10 : error >= e5 ? 5 : error >= e2 ? 2 : 1) * Math.pow(base, power)\n    : -Math.pow(base, -power) / (error >= e10 ? 10 : error >= e5 ? 5 : error >= e2 ? 2 : 1);\n}\n\n/** @internal */\nexport function getNiceLinearTicks(\n  scale: ScaleContinuousNumeric<PrimitiveValue, number>,\n  count: number = 10,\n  base = 10,\n) {\n  const d = scale.domain();\n  let i0 = 0;\n  let i1 = d.length - 1;\n  let start = d[i0];\n  let stop = d[i1];\n  let prestep;\n  let step;\n  let maxIter = 10;\n\n  if (isNil(stop) || isNil(start)) {\n    return scale;\n  }\n\n  if (stop < start) {\n    step = start;\n    start = stop;\n    stop = step;\n\n    step = i0;\n    i0 = i1;\n    i1 = step;\n  }\n\n  while (maxIter-- > 0) {\n    step = tickIncrement(start, stop, count, base);\n    if (step === prestep) {\n      d[i0] = start;\n      d[i1] = stop;\n      return scale.domain(d);\n    } else if (step > 0) {\n      start = Math.floor(start / step) * step;\n      stop = Math.ceil(stop / step) * step;\n    } else if (step < 0) {\n      start = Math.ceil(start * step) / step;\n      stop = Math.floor(stop * step) / step;\n    } else {\n      break;\n    }\n    prestep = step;\n  }\n\n  return scale;\n}\n\n/* eslint-enable header/header, no-param-reassign */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { isVerticalAxis } from './axis_type_utils';\nimport { AxisGeometry, AxisTick } from './axis_utils';\nimport { AxisSpec } from './specs';\nimport { colorToRgba, overrideOpacity } from '../../../common/color_library_wrappers';\nimport { SmallMultipleScales, getPanelSize, getPerPanelMap } from '../../../common/panel_utils';\nimport { Line, Stroke } from '../../../geoms/types';\nimport { mergePartial, RecursivePartial } from '../../../utils/common';\nimport { Size } from '../../../utils/dimensions';\nimport { AxisId } from '../../../utils/ids';\nimport { Point } from '../../../utils/point';\nimport { AxisStyle, Theme } from '../../../utils/themes/theme';\nimport { MIN_STROKE_WIDTH } from '../renderer/canvas/primitives/line';\n\n/** @internal */\nexport const HIERARCHICAL_GRID_WIDTH = 1; // constant 1 scales well and solves some render issues due to fixed 1px wide overpaints\n/** @internal */\nexport const OUTSIDE_RANGE_TOLERANCE = 0.01; // can protrude from the scale range by a max of 0.1px, to allow for FP imprecision\n/** @internal */\nexport const HIDE_MINOR_TIME_GRID = false; // experimental: retain ticks but don't show grid lines for minor raster\n\n/** @internal */\nexport interface GridLineGroup {\n  lines: Array<Line>;\n  stroke: Stroke;\n  axisId: AxisId;\n}\n\n/** @internal */\nexport type LinesGrid = {\n  panelAnchor: Point;\n  lineGroups: Array<GridLineGroup>;\n};\n\n/** @internal */\nexport function getGridLines(\n  axesSpecs: Array<AxisSpec>,\n  axesGeoms: Array<AxisGeometry>,\n  { axes: themeAxisStyle }: Pick<Theme, 'axes'>,\n  scales: SmallMultipleScales,\n): Array<LinesGrid> {\n  const panelSize = getPanelSize(scales);\n  return getPerPanelMap(scales, () => {\n    // get grids per panel (depends on all the axis that exist)\n    const lines = axesGeoms.reduce<Array<GridLineGroup>>((linesAcc, { axis, visibleTicks }) => {\n      const axisSpec = axesSpecs.find(({ id }) => id === axis.id);\n      if (!axisSpec) {\n        return linesAcc;\n      }\n      const linesForSpec = getGridLinesForAxis(axisSpec, visibleTicks, themeAxisStyle, panelSize);\n      return linesForSpec.length === 0 ? linesAcc : [...linesAcc, ...linesForSpec];\n    }, []);\n    return { lineGroups: lines };\n  });\n}\n\nfunction getGridLinesForAxis(\n  axisSpec: AxisSpec,\n  visibleTicks: AxisTick[],\n  themeAxisStyle: AxisStyle,\n  panelSize: Size,\n): GridLineGroup[] {\n  // vertical ==> horizontal grid lines\n  const isVertical = isVerticalAxis(axisSpec.position);\n\n  // merge the axis configured style with the theme style\n  const axisStyle = mergePartial(themeAxisStyle, axisSpec.style as RecursivePartial<AxisStyle>);\n  const gridLineThemeStyle = isVertical ? axisStyle.gridLine.vertical : axisStyle.gridLine.horizontal;\n\n  // axis can have a configured grid line style\n  const gridLineStyles = axisSpec.gridLine ? mergePartial(gridLineThemeStyle, axisSpec.gridLine) : gridLineThemeStyle;\n\n  if (!gridLineStyles.visible) {\n    return [];\n  }\n\n  // define the stroke for the specific set of grid lines\n  if (!gridLineStyles.stroke || !gridLineStyles.strokeWidth || gridLineStyles.strokeWidth < MIN_STROKE_WIDTH) {\n    return [];\n  }\n\n  const visibleTicksPerLayer = visibleTicks.reduce((acc: Map<number, AxisTick[]>, tick) => {\n    if (Math.abs(tick.position - tick.domainClampedPosition) > OUTSIDE_RANGE_TOLERANCE) return acc; // no gridline for ticks outside the domain\n    if (typeof tick.layer === 'number' && !tick.showGrid) return acc; // no gridline for ticks outside the domain\n    if (HIDE_MINOR_TIME_GRID && typeof tick.layer === 'number' && tick.detailedLayer === 0) return acc; // no gridline for ticks outside the domain\n    const ticks = acc.get(tick.detailedLayer);\n    if (ticks) {\n      ticks.push(tick);\n    } else {\n      acc.set(tick.detailedLayer, [tick]);\n    }\n    return acc;\n  }, new Map());\n\n  return [...visibleTicksPerLayer]\n    .sort(([k1], [k2]) => (k1 ?? 0) - (k2 ?? 0)) // increasing layer order\n    .map(([detailedLayer, visibleTicksOfLayer]) => {\n      const lines = visibleTicksOfLayer.map<Line>((tick: AxisTick) =>\n        isVertical\n          ? getGridLineForVerticalAxisAt(tick.position, panelSize)\n          : getGridLineForHorizontalAxisAt(tick.position, panelSize),\n      );\n      const strokeColor = overrideOpacity(colorToRgba(gridLineStyles.stroke), (strokeColorOpacity) =>\n        gridLineStyles.opacity !== undefined ? strokeColorOpacity * gridLineStyles.opacity : strokeColorOpacity,\n      );\n      const layered = typeof visibleTicksOfLayer[0]?.layer === 'number';\n\n      const multilayerLuma = themeAxisStyle.gridLine.lumaSteps[detailedLayer] ?? NaN;\n      const stroke: Stroke = {\n        color: layered ? [multilayerLuma, multilayerLuma, multilayerLuma, 1] : strokeColor,\n        width: layered ? HIERARCHICAL_GRID_WIDTH : gridLineStyles.strokeWidth,\n        dash: gridLineStyles.dash,\n      };\n      return { lines, stroke, axisId: axisSpec.id };\n    });\n}\n\n/**\n * Get a horizontal grid line at `tickPosition`\n * used for vertical axis specs\n * @param tickPosition the position of the tick\n * @param panelSize the size of the target panel\n * @internal\n */\nexport function getGridLineForVerticalAxisAt(tickPosition: number, panelSize: Size): Line {\n  return { x1: 0, y1: tickPosition, x2: panelSize.width, y2: tickPosition };\n}\n\n/**\n * Get a vertical grid line at `tickPosition`\n * used for horizontal axis specs\n * @param tickPosition the position of the tick\n * @param panelSize the size of the target panel\n * @internal\n */\nexport function getGridLineForHorizontalAxisAt(tickPosition: number, panelSize: Size): Line {\n  return { x1: tickPosition, y1: 0, x2: tickPosition, y2: panelSize.height };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\ntype Group<T> = Record<string, T[]>;\n\n/** @public */\nexport type GroupByKeyFn<T> = (data: T) => string;\n\n/** @public */\nexport type GroupKeysOrKeyFn<T> = Array<keyof T> | GroupByKeyFn<T>;\n\n/** @internal */\nexport function groupBy<T>(data: T[], keysOrKeyFn: GroupKeysOrKeyFn<T>, asArray: false): Group<T>;\n/** @internal */\nexport function groupBy<T>(data: T[], keysOrKeyFn: GroupKeysOrKeyFn<T>, asArray: true): T[][];\n/** @internal */\nexport function groupBy<T>(data: T[], keysOrKeyFn: GroupKeysOrKeyFn<T>, asArray: boolean): T[][] | Group<T> {\n  const keyFn = Array.isArray(keysOrKeyFn) ? getUniqueKey(keysOrKeyFn) : keysOrKeyFn;\n  const grouped = data.reduce<Group<T>>((acc, curr) => {\n    const key = keyFn(curr);\n    if (!acc[key]) {\n      acc[key] = [];\n    }\n    acc[key]!.push(curr);\n    return acc;\n  }, {});\n  return asArray ? Object.values(grouped) : grouped;\n}\n\n/** @internal */\nexport function getUniqueKey<T>(keys: Array<keyof T>, concat = '|') {\n  return (data: T): string => {\n    return keys\n      .map((key) => {\n        return data[key];\n      })\n      .join(concat);\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { IndexedGeometry } from '../../../utils/geometry';\n\n/** @internal */\nexport class IndexedGeometryLinearMap {\n  private map = new Map<string | number, IndexedGeometry[]>();\n\n  get size() {\n    return this.map.size;\n  }\n\n  set(geometry: IndexedGeometry) {\n    const { x } = geometry.value;\n    const existing = this.map.get(x);\n    if (existing === undefined) {\n      this.map.set(x, [geometry]);\n    } else {\n      this.map.set(x, [geometry, ...existing]);\n    }\n  }\n\n  getMergeData() {\n    return [...this.map.values()];\n  }\n\n  keys(): Array<number | string> {\n    return [...this.map.keys()];\n  }\n\n  find(x: number | string | null): IndexedGeometry[] {\n    if (x === null) {\n      return [];\n    }\n\n    return this.map.get(x) ?? [];\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { IndexedGeometryLinearMap } from './indexed_geometry_linear_map';\nimport { IndexedGeometrySpatialMap } from './indexed_geometry_spatial_map';\nimport { MarkBuffer } from '../../../specs';\nimport { isNil } from '../../../utils/common';\nimport { Bounds } from '../../../utils/d3-delaunay';\nimport { IndexedGeometry, isPointGeometry } from '../../../utils/geometry';\nimport { Point } from '../../../utils/point';\nimport { PrimitiveValue } from '../../partition_chart/layout/utils/group_by_rollup';\n\n/** @internal */\nexport const GeometryType = Object.freeze({\n  linear: 'linear' as const,\n  spatial: 'spatial' as const,\n});\n/** @internal */\nexport type GeometryType = $Values<typeof GeometryType>;\n\n/** @internal */\nexport class IndexedGeometryMap {\n  private linearMap = new IndexedGeometryLinearMap();\n\n  private spatialMap = new IndexedGeometrySpatialMap();\n\n  /**\n   * Returns triangulation instance to render spatial grid\n   *\n   * @param bounds\n   */\n  triangulation(bounds?: Bounds) {\n    return this.spatialMap.triangulation(bounds);\n  }\n\n  keys(): Array<number | string> {\n    return [...this.linearMap.keys(), ...this.spatialMap.keys()];\n  }\n\n  get size(): number {\n    return this.linearMap.size + this.spatialMap.size;\n  }\n\n  set(geometry: IndexedGeometry, type: GeometryType = GeometryType.linear) {\n    if (type === GeometryType.spatial && isPointGeometry(geometry)) {\n      // TODO: Add dev error here when attempting spatial upset with non-point\n      this.spatialMap.set([geometry]);\n    } else {\n      this.linearMap.set(geometry);\n    }\n  }\n\n  find(\n    x: number | string | null,\n    pointBuffer: MarkBuffer,\n    point?: Point,\n    smHorizontalValue?: PrimitiveValue,\n    smVerticalValue?: PrimitiveValue,\n  ): IndexedGeometry[] {\n    if (x === null && !point) {\n      return [];\n    }\n\n    const spatialValues = point === undefined ? [] : this.spatialMap.find(point, pointBuffer);\n    return [...this.linearMap.find(x), ...spatialValues].filter(\n      ({ seriesIdentifier: { smHorizontalAccessorValue, smVerticalAccessorValue } }) =>\n        (isNil(smVerticalValue) || smVerticalAccessorValue === smVerticalValue) &&\n        (isNil(smHorizontalValue) || smHorizontalAccessorValue === smHorizontalValue),\n    );\n  }\n\n  getMergeData() {\n    return {\n      spatialGeometries: this.spatialMap.getMergeData(),\n      linearGeometries: this.linearMap.getMergeData(),\n    };\n  }\n\n  /**\n   * Merge multiple indexedMaps into base indexedMaps\n   * @param indexedMaps\n   */\n  merge(...indexedMaps: IndexedGeometryMap[]) {\n    // eslint-disable-next-line no-restricted-syntax\n    for (const indexedMap of indexedMaps) {\n      const { spatialGeometries, linearGeometries } = indexedMap.getMergeData();\n      this.spatialMap.set(spatialGeometries);\n      linearGeometries.forEach((geometry) => {\n        if (Array.isArray(geometry)) {\n          geometry.forEach((geometry) => this.linearMap.set(geometry));\n        } else {\n          this.linearMap.set(geometry);\n        }\n      });\n    }\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { MarkBuffer } from '../../../specs';\nimport { getDistance, isFiniteNumber } from '../../../utils/common';\nimport { Delaunay, Bounds } from '../../../utils/d3-delaunay';\nimport { IndexedGeometry, PointGeometry } from '../../../utils/geometry';\nimport { Point } from '../../../utils/point';\n\n/** @internal */\nexport type IndexedGeometrySpatialMapPoint = [number, number];\n\n/** @internal */\nexport class IndexedGeometrySpatialMap {\n  private map: Delaunay<IndexedGeometrySpatialMapPoint> | null = null;\n\n  private points: IndexedGeometrySpatialMapPoint[] = [];\n\n  private pointGeometries: PointGeometry[] = [];\n\n  private searchStartIndex: number = 0;\n\n  private maxRadius = -Infinity;\n\n  constructor(points: PointGeometry[] = []) {\n    this.set(points);\n  }\n\n  get size() {\n    return this.points.length;\n  }\n\n  isSpatial() {\n    return this.pointGeometries.length > 0;\n  }\n\n  set(points: PointGeometry[]) {\n    this.maxRadius = Math.max(this.maxRadius, ...points.map(({ radius }) => radius));\n    const { pointGeometries } = this;\n    points.forEach((p) => {\n      if (isFiniteNumber(p.y)) pointGeometries.push(p);\n    });\n    this.points.push(\n      ...points.map<IndexedGeometrySpatialMapPoint>(({ x, y }) => {\n        // TODO: handle coincident points better\n        // This nonce is used to slightly offset every point such that each point\n        // has a unique position in the index. This number is only used in the index.\n        // The other option would be to find the point(s) near a Point and add logic\n        // to account for multiple values in the pointGeometries array. This would be\n        // a very computationally expensive approach having to repeat for every point.\n        const nonce = Math.random() * 0.000001;\n        return [x + nonce, y];\n      }),\n    );\n\n    if (this.points.length > 0) {\n      // TODO: handle write/read init\n      this.map = Delaunay.from(this.points);\n    }\n  }\n\n  triangulation(bounds?: Bounds) {\n    return this.map?.voronoi(bounds);\n  }\n\n  getMergeData() {\n    return [...this.pointGeometries];\n  }\n\n  keys(): Array<number> {\n    return this.pointGeometries.map(({ value: { x } }) => x);\n  }\n\n  find(point: Point, pointBuffer: MarkBuffer): IndexedGeometry[] {\n    const elements = [];\n    if (this.map !== null) {\n      const index = this.map.find(point.x, point.y, this.searchStartIndex);\n      const geometry = this.pointGeometries[index];\n\n      if (geometry) {\n        // Set next starting search index for faster lookup\n        this.searchStartIndex = index;\n        elements.push(geometry);\n        this.getRadialNeighbors(index, point, new Set([index]), pointBuffer).forEach((g) => elements.push(g));\n      }\n    }\n\n    return elements;\n  }\n\n  /**\n   * Gets surrounding points whose radius could be within the active cursor position\n   *\n   */\n  private getRadialNeighbors(\n    selectedIndex: number,\n    point: Point,\n    visitedIndices: Set<number>,\n    pointBuffer: MarkBuffer,\n  ): IndexedGeometry[] {\n    if (this.map === null) {\n      return [];\n    }\n\n    const neighbors = [...this.map.neighbors(selectedIndex)];\n    return neighbors.reduce<IndexedGeometry[]>((acc, i) => {\n      if (visitedIndices.has(i)) {\n        return acc;\n      }\n\n      visitedIndices.add(i);\n      const geometry = this.pointGeometries[i];\n\n      if (geometry) {\n        acc.push(geometry);\n        const radiusBuffer = typeof pointBuffer === 'number' ? pointBuffer : pointBuffer(geometry.radius);\n        if (getDistance(geometry, point) < Math.min(this.maxRadius, radiusBuffer)) {\n          // Gets neighbors based on relation to maxRadius\n          this.getRadialNeighbors(i, point, visitedIndices, pointBuffer).forEach((g) => acc.push(g));\n        }\n      }\n\n      return acc;\n    }, []);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Rotation } from '../../../utils/common';\nimport { Size } from '../../../utils/dimensions';\n\n/**\n * Get the cursor position depending on the chart rotation\n * @param xPos x position relative to chart\n * @param yPos y position relative to chart\n * @param chartRotation the chart rotation\n * @param chartDimension the chart dimension\n * @internal\n */\nexport function getOrientedXPosition(xPos: number, yPos: number, chartRotation: Rotation, chartDimension: Size) {\n  switch (chartRotation) {\n    case 180:\n      return chartDimension.width - xPos;\n    case 90:\n      return yPos;\n    case -90:\n      return chartDimension.height - yPos;\n    case 0:\n    default:\n      return xPos;\n  }\n}\n\n/** @internal */\nexport function getOrientedYPosition(xPos: number, yPos: number, chartRotation: Rotation, chartDimension: Size) {\n  switch (chartRotation) {\n    case 180:\n      return chartDimension.height - yPos;\n    case -90:\n      return xPos;\n    case 90:\n      return chartDimension.width - xPos;\n    case 0:\n    default:\n      return yPos;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleBand, ScaleContinuous } from '../../../scales';\nimport { ScaleType } from '../../../scales/constants';\nimport { ContinuousDomain, Range } from '../../../utils/domain';\nimport { GroupId } from '../../../utils/ids';\nimport { XDomain, YDomain } from '../domains/types';\n\nfunction getBandScaleRange(\n  isInverse: boolean,\n  isSingleValueHistogram: boolean,\n  minRange: number,\n  maxRange: number,\n  bandwidth: number,\n): {\n  start: number;\n  end: number;\n} {\n  const rangeEndOffset = isSingleValueHistogram ? 0 : bandwidth;\n  const start = isInverse ? minRange - rangeEndOffset : minRange;\n  const end = isInverse ? maxRange : maxRange - rangeEndOffset;\n  return { start, end };\n}\n\ninterface XScaleOptions {\n  xDomain: XDomain;\n  totalBarsInCluster: number;\n  range: Range;\n  barsPadding?: number;\n  enableHistogramMode?: boolean;\n  maximumFractionDigits?: number;\n  logBase?: number;\n  logMinLimit?: number;\n}\n\n/**\n * Compute the x scale used to align geometries to the x axis.\n * @internal\n */\nexport function computeXScale(options: XScaleOptions): ScaleBand | ScaleContinuous {\n  const { xDomain, totalBarsInCluster, range, barsPadding, enableHistogramMode, maximumFractionDigits } = options;\n  const { type, nice, minInterval, domain, isBandScale, timeZone, logBase, desiredTickCount } = xDomain;\n  const rangeDiff = Math.abs(range[1] - range[0]);\n  const isInverse = range[1] < range[0];\n  if (type === ScaleType.Ordinal) {\n    const dividend = totalBarsInCluster > 0 ? totalBarsInCluster : 1;\n    const bandwidth = rangeDiff / (domain.length * dividend);\n    return new ScaleBand(domain, range, bandwidth, barsPadding);\n  }\n  if (isBandScale) {\n    const [domainMin, domainMax] = domain as ContinuousDomain;\n    const isSingleValueHistogram = !!enableHistogramMode && domainMax - domainMin === 0;\n    const adjustedDomain: [number, number] = [domainMin, isSingleValueHistogram ? domainMin + minInterval : domainMax];\n    const intervalCount = (adjustedDomain[1] - adjustedDomain[0]) / minInterval;\n    const intervalCountOffset = isSingleValueHistogram ? 0 : 1;\n    const bandwidth = rangeDiff / (intervalCount + intervalCountOffset);\n    const { start, end } = getBandScaleRange(isInverse, isSingleValueHistogram, range[0], range[1], bandwidth);\n    return new ScaleContinuous(\n      {\n        type,\n        domain: adjustedDomain,\n        range: [start, end],\n        nice,\n      },\n      {\n        bandwidth: totalBarsInCluster > 0 ? bandwidth / totalBarsInCluster : bandwidth,\n        minInterval,\n        timeZone,\n        totalBarsInCluster,\n        barsPadding,\n        desiredTickCount,\n        isSingleValueHistogram,\n        logBase,\n      },\n    );\n  } else {\n    return new ScaleContinuous(\n      { type, domain: domain as [number, number], range, nice },\n      {\n        bandwidth: 0,\n        minInterval,\n        timeZone,\n        totalBarsInCluster,\n        barsPadding,\n        desiredTickCount,\n        maximumFractionDigits,\n        logBase,\n      },\n    );\n  }\n}\n\ninterface YScaleOptions {\n  yDomains: YDomain[];\n  range: Range;\n  maximumFractionDigits?: number;\n}\n\n/**\n * Compute the y scales, one per groupId for the y axis.\n * @internal\n */\nexport function computeYScales(options: YScaleOptions): Map<GroupId, ScaleContinuous> {\n  const { yDomains, range, maximumFractionDigits } = options;\n  return yDomains.reduce(\n    (\n      yScales,\n      {\n        type,\n        nice,\n        desiredTickCount,\n        domain,\n        groupId,\n        logBase,\n        logMinLimit,\n        domainPixelPadding,\n        constrainDomainPadding,\n      },\n    ) => {\n      const yScale = new ScaleContinuous(\n        { type, domain, range, nice },\n        {\n          desiredTickCount,\n          maximumFractionDigits,\n          logBase,\n          logMinLimit,\n          domainPixelPadding,\n          constrainDomainPadding,\n        },\n      );\n      yScales.set(groupId, yScale);\n      return yScales;\n    },\n    new Map<GroupId, ScaleContinuous>(),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { applyFitFunctionToDataSeries } from './fit_function_utils';\nimport { groupBy } from './group_data_series';\nimport { BaseDatum, BasicSeriesSpec, SeriesNameConfigOptions, SeriesSpecs, SeriesType, StackMode } from './specs';\nimport { datumXSortPredicate, formatStackedDataSeriesValues } from './stacked_series_utils';\nimport { Color, Colors } from '../../../common/colors';\nimport { SmallMultiplesDatum, SmallMultiplesGroupBy } from '../../../common/panel_utils';\nimport { SeriesIdentifier, SeriesKey } from '../../../common/series_id';\nimport { ScaleType } from '../../../scales/constants';\nimport { BinAgg, Direction, XScaleType } from '../../../specs';\nimport { OrderBy } from '../../../specs/settings';\nimport { ColorOverrides } from '../../../state/chart_state';\nimport { Accessor, AccessorFn, getAccessorValue } from '../../../utils/accessor';\nimport { Datum, isNil, stripUndefined } from '../../../utils/common';\nimport { GroupId } from '../../../utils/ids';\nimport { Logger } from '../../../utils/logger';\nimport { ColorConfig } from '../../../utils/themes/theme';\nimport { groupSeriesByYGroup, isStackedSpec } from '../domains/y_domain';\nimport { X_SCALE_DEFAULT } from '../scales/scale_defaults';\n\n/** @internal */\nexport const SERIES_DELIMITER = ' - ';\n\n/** @public */\nexport interface FilledValues {\n  /** the x value */\n  x?: number | string;\n  /** the max y value */\n  y1?: number;\n  /** the minimum y value */\n  y0?: number;\n}\n\n/** @public */\nexport interface DataSeriesDatum<T = any> {\n  /** the x value */\n  x: number | string;\n  /** the max y value */\n  y1: number | null;\n  /** the minimum y value */\n  y0: number | null;\n  /** initial y1 value, non stacked */\n  initialY1: number | null;\n  /** initial y0 value, non stacked */\n  initialY0: number | null;\n  /** the optional mark metric, used for lines and area series */\n  mark: number | null;\n  /** initial datum */\n  datum: T;\n  /** the list of filled values because missing or nulls */\n  filled?: FilledValues;\n}\n\n/** @public */\nexport interface XYChartSeriesIdentifier<D extends BaseDatum = Datum> extends SeriesIdentifier, SmallMultiplesDatum {\n  xAccessor: Accessor<D>;\n  yAccessor: Accessor<D>;\n  splitAccessors: Map<string | number, string | number>; // does the map have a size vs making it optional\n  seriesKeys: (string | number)[];\n}\n\n/** @internal */\nexport type DataSeries<D extends BaseDatum = Datum> = XYChartSeriesIdentifier<D> & {\n  groupId: GroupId;\n  seriesType: SeriesType;\n  data: DataSeriesDatum[];\n  isStacked: boolean;\n  stackMode: StackMode | undefined;\n  spec: Exclude<BasicSeriesSpec, 'data'>;\n  insertIndex: number;\n  isFiltered: boolean;\n};\n\n/** @internal */\nexport type DataSeriesCounts = { [key in SeriesType]: number };\n\n/** @internal */\nexport function getSeriesIndex(series: SeriesIdentifier[], target: SeriesIdentifier): number {\n  if (!series) {\n    return -1;\n  }\n\n  return series.findIndex(({ key }) => target.key === key);\n}\n\n/**\n * Returns string form of accessor. Uses index when accessor is a function.\n * @internal\n */\nexport function getAccessorFieldName<D extends BaseDatum>(\n  accessor: Accessor<D> | AccessorFn<D>,\n  index: number,\n): Accessor<D> | string {\n  return typeof accessor === 'function' ? accessor.fieldName ?? `(index:${index})` : accessor;\n}\n\n/**\n * Split a dataset into multiple series depending on the accessors.\n * Each series is then associated with a key that belongs to its configuration.\n * This method removes every data with an invalid x: a string or number value is required\n * `y` values and `mark` values are casted to number or null.\n * @internal\n */\nexport function splitSeriesDataByAccessors(\n  spec: BasicSeriesSpec,\n  xValueSums: Map<string | number, number>,\n  isStacked = false,\n  isBanded = false,\n  stackMode?: StackMode,\n  groupBySpec?: SmallMultiplesGroupBy,\n): {\n  dataSeries: Map<SeriesKey, DataSeries>;\n  xValues: Array<string | number>;\n} {\n  const {\n    seriesType,\n    id: specId,\n    groupId,\n    data,\n    xAccessor,\n    yAccessors,\n    y0Accessors,\n    markSizeAccessor,\n    splitSeriesAccessors = [],\n  } = spec;\n  const dataSeries = new Map<SeriesKey, DataSeries>();\n  const xValues: Array<string | number> = [];\n  const nonNumericValues: any[] = [];\n\n  if (isStacked && Boolean(y0Accessors?.length)) {\n    Logger.warn(\n      `y0Accessors are not allowed with stackAccessors. y0Accessors will be ignored but available under initialY0.`,\n    );\n  }\n\n  for (let i = 0; i < data.length; i++) {\n    const datum = data[i];\n    const splitAccessors = getSplitAccessors(datum, splitSeriesAccessors);\n    // if splitSeriesAccessors are defined we should have at least one split value to include datum\n    if (splitSeriesAccessors.length > 0 && splitAccessors.size < 1) {\n      continue;\n    }\n\n    // skip if the datum is not an object or null\n    if (typeof datum !== 'object' || datum === null) {\n      continue;\n    }\n    const x = getAccessorValue(datum, xAccessor);\n    // skip if the x value is not a string or a number\n    if (typeof x !== 'string' && typeof x !== 'number') {\n      continue;\n    }\n\n    xValues.push(x);\n    let sum = xValueSums.get(x) ?? 0;\n\n    // extract small multiples aggregation values\n    const smH = groupBySpec?.horizontal?.by?.(spec, datum);\n    const smV = groupBySpec?.vertical?.by?.(spec, datum);\n\n    const xAccessorStr = getAccessorFieldName(xAccessor, 0);\n    yAccessors.forEach((accessor, index) => {\n      const cleanedDatum = extractYAndMarkFromDatum(\n        datum,\n        accessor,\n        nonNumericValues,\n        isBanded,\n        y0Accessors && y0Accessors[index],\n        markSizeAccessor,\n      );\n\n      const yAccessorStr = getAccessorFieldName(accessor, index);\n      const splitAccessorStrs = [...splitAccessors.values()].map((a, si) => getAccessorFieldName(a, si));\n      const seriesKeys = [...splitAccessorStrs, yAccessorStr];\n      const seriesIdentifier: Omit<XYChartSeriesIdentifier, 'key'> = stripUndefined({\n        specId,\n        seriesKeys,\n        xAccessor: xAccessorStr,\n        yAccessor: yAccessorStr,\n        splitAccessors,\n        smVerticalAccessorValue: smV,\n        smHorizontalAccessorValue: smH,\n      });\n      const seriesKey = getSeriesKey(seriesIdentifier, groupId);\n      sum += cleanedDatum.y1 ?? 0;\n      const newDatum = { x, ...cleanedDatum, smH, smV };\n      const series = dataSeries.get(seriesKey);\n      if (series) {\n        series.data.push(newDatum);\n      } else {\n        dataSeries.set(seriesKey, {\n          ...seriesIdentifier,\n          groupId,\n          seriesType,\n          stackMode,\n          isStacked,\n          seriesKeys,\n          key: seriesKey,\n          data: [newDatum],\n          spec,\n          // current default to 0, will be correctly computed on a later stage\n          insertIndex: 0,\n          isFiltered: false,\n        });\n      }\n\n      xValueSums.set(x, sum);\n    });\n  }\n\n  if (nonNumericValues.length > 0) {\n    Logger.warn(\n      `Found non-numeric y value${nonNumericValues.length > 1 ? 's' : ''} in dataset for spec \"${specId}\"`,\n      `(${nonNumericValues.map((v) => JSON.stringify(v)).join(', ')})`,\n    );\n  }\n  return {\n    dataSeries,\n    xValues,\n  };\n}\n\n/**\n * Gets global series key to id any series as a string\n * @internal\n */\nexport function getSeriesKey(\n  {\n    specId,\n    yAccessor,\n    splitAccessors,\n    smVerticalAccessorValue,\n    smHorizontalAccessorValue,\n  }: Pick<\n    XYChartSeriesIdentifier,\n    'specId' | 'yAccessor' | 'splitAccessors' | 'smVerticalAccessorValue' | 'smHorizontalAccessorValue'\n  >,\n  groupId: GroupId,\n): string {\n  const joinedAccessors = [...splitAccessors.entries()]\n    .sort(([a], [b]) => (a > b ? 1 : -1))\n    .map(([key, value]) => `${key}-${value}`)\n    .join('|');\n  const smV = smVerticalAccessorValue ? `smV{${smVerticalAccessorValue}}` : '';\n  const smH = smHorizontalAccessorValue ? `smH{${smHorizontalAccessorValue}}` : '';\n  return `groupId{${groupId}}spec{${specId}}yAccessor{${yAccessor}}splitAccessors{${joinedAccessors}}${smV}${smH}`;\n}\n\n/**\n * Get the array of values that forms a series key\n * @internal\n */\nfunction getSplitAccessors<D extends BaseDatum>(\n  datum: D,\n  accessors: (Accessor<D> | AccessorFn<D>)[] = [],\n): Map<string | number, string | number> {\n  const splitAccessors = new Map<string | number, string | number>();\n  if (typeof datum === 'object' && datum !== null) {\n    accessors.forEach((accessor, index) => {\n      const value = getAccessorValue(datum, accessor);\n      if (typeof value === 'string' || typeof value === 'number') {\n        const accessorStr = getAccessorFieldName(accessor, index);\n        splitAccessors.set(accessorStr, value);\n      }\n    });\n  }\n  return splitAccessors;\n}\n\n/**\n * Extract y1 and y0 and mark properties from Datum. Casting them to numbers or null\n * @internal\n */\nexport function extractYAndMarkFromDatum<D extends BaseDatum>(\n  datum: D,\n  yAccessor: Accessor<D> | AccessorFn<D>,\n  nonNumericValues: any[],\n  bandedSpec: boolean,\n  y0Accessor?: Accessor<D> | AccessorFn<D>,\n  markSizeAccessor?: Accessor<D> | AccessorFn<D>,\n): Pick<DataSeriesDatum, 'y0' | 'y1' | 'mark' | 'datum' | 'initialY0' | 'initialY1'> {\n  const mark =\n    markSizeAccessor === undefined ? null : finiteOrNull(getAccessorValue(datum, markSizeAccessor), nonNumericValues);\n  const y1Value = getAccessorValue(datum, yAccessor);\n  const y1 = finiteOrNull(y1Value, nonNumericValues);\n  const y0 = y0Accessor ? finiteOrNull(getAccessorValue(datum, y0Accessor), nonNumericValues) : null;\n  return { y1, datum, y0: bandedSpec ? y0 : null, mark, initialY0: y0, initialY1: y1 };\n}\n\nfunction finiteOrNull(value: unknown, nonNumericValues: unknown[]): number | null {\n  const candidateNumber = Number(value ?? undefined);\n  const finite = Number.isFinite(candidateNumber);\n  if (!finite) nonNumericValues.push(value);\n  return finite ? candidateNumber : null;\n}\n\n/** Sorts data based on order of xValues */\nconst getSortedDataSeries = (\n  dataSeries: DataSeries[],\n  xValues: Set<string | number>,\n  xScaleType: ScaleType,\n): DataSeries[] =>\n  dataSeries.map(({ data, ...rest }) => ({\n    ...rest,\n    data: [...data].sort(datumXSortPredicate(xScaleType, [...xValues.values()])),\n  }));\n\n/** @internal */\nexport function getFormattedDataSeries(\n  seriesSpecs: SeriesSpecs,\n  availableDataSeries: DataSeries[],\n  xValues: Set<string | number>,\n  xScaleType: ScaleType,\n): DataSeries[] {\n  // apply fit function to every data series\n  const fittedDataSeries = applyFitFunctionToDataSeries(\n    getSortedDataSeries(availableDataSeries, xValues, xScaleType),\n    seriesSpecs,\n    xScaleType,\n  );\n\n  // apply fitting for stacked DataSeries by YGroup, Panel\n  const stackedDataSeries = fittedDataSeries.filter(({ spec }) => isStackedSpec(spec));\n  const stackedGroups = groupBy<DataSeries>(\n    stackedDataSeries,\n    ['smHorizontalAccessorValue', 'smVerticalAccessorValue', 'groupId'],\n    true,\n  );\n\n  const fittedAndStackedDataSeries = stackedGroups.reduce<DataSeries[]>((acc, dataSeries) => {\n    if (!dataSeries[0]) return acc;\n    const [{ stackMode, seriesType }] = dataSeries;\n    const formatted = formatStackedDataSeriesValues(dataSeries, xValues, seriesType, stackMode);\n    return [...acc, ...formatted];\n  }, []);\n  // get already fitted non stacked dataSeries\n  const nonStackedDataSeries = fittedDataSeries.filter(({ spec }) => !isStackedSpec(spec));\n\n  return [...fittedAndStackedDataSeries, ...nonStackedDataSeries];\n}\n\n/** @internal */\nexport function getDataSeriesFromSpecs(\n  seriesSpecs: BasicSeriesSpec[],\n  deselectedDataSeries: SeriesIdentifier[] = [],\n  orderOrdinalBinsBy?: OrderBy,\n  groupBySpec?: SmallMultiplesGroupBy,\n): {\n  dataSeries: DataSeries[];\n  xValues: Set<string | number>;\n  smVValues: Set<string | number>;\n  smHValues: Set<string | number>;\n  fallbackScale?: XScaleType;\n} {\n  let globalDataSeries: DataSeries[] = [];\n  const mutatedXValueSums = new Map<string | number, number>();\n\n  // the unique set of values along the x axis\n  const globalXValues: Set<string | number> = new Set();\n\n  let isNumberArray = true;\n  let isOrdinalScale = false;\n\n  const specsByYGroup = groupSeriesByYGroup(seriesSpecs);\n\n  // eslint-disable-next-line no-restricted-syntax\n  for (const spec of seriesSpecs) {\n    // check scale type and cast to Ordinal if we found at least one series\n    // with Ordinal Scale\n    if (spec.xScaleType === ScaleType.Ordinal) {\n      isOrdinalScale = true;\n    }\n\n    const specGroup = specsByYGroup.get(spec.groupId);\n    const isStacked = Boolean(specGroup?.stacked.find(({ id }) => id === spec.id));\n    const isBanded = isBandedSpec(spec);\n\n    const { dataSeries, xValues } = splitSeriesDataByAccessors(\n      spec,\n      mutatedXValueSums,\n      isStacked,\n      isBanded,\n      specGroup?.stackMode,\n      groupBySpec,\n    );\n\n    // filter deselected DataSeries\n    let filteredDataSeries: DataSeries[] = [...dataSeries.values()];\n    if (deselectedDataSeries.length > 0) {\n      filteredDataSeries = filteredDataSeries.map((series) => ({\n        ...series,\n        isFiltered: deselectedDataSeries.some(({ key: deselectedKey }) => series.key === deselectedKey),\n      }));\n    }\n\n    globalDataSeries = [...globalDataSeries, ...filteredDataSeries];\n\n    // check the nature of the x values. If all of them are numbers\n    // we can use a continuous scale, if not we should use an ordinal scale.\n    // The xValue is already casted to be a valid number or a string\n    // eslint-disable-next-line no-restricted-syntax\n    for (const xValue of xValues) {\n      if (isNumberArray && typeof xValue !== 'number') {\n        isNumberArray = false;\n      }\n      globalXValues.add(xValue);\n    }\n  }\n\n  const xValues =\n    isOrdinalScale || !isNumberArray\n      ? getSortedOrdinalXValues(globalXValues, mutatedXValueSums, orderOrdinalBinsBy)\n      : new Set(\n          [...globalXValues].sort((a, b) => {\n            if (typeof a === 'string' || typeof b === 'string') {\n              return 0;\n            }\n            return a - b;\n          }),\n        );\n\n  const dataSeries = globalDataSeries.map((d, i) => ({\n    ...d,\n    insertIndex: i,\n  }));\n\n  const smallMultipleUniqueValues = dataSeries.reduce<{\n    smVValues: Set<string | number>;\n    smHValues: Set<string | number>;\n  }>(\n    (acc, curr) => {\n      if (curr.isFiltered) {\n        return acc;\n      }\n      if (!isNil(curr.smHorizontalAccessorValue)) {\n        acc.smHValues.add(curr.smHorizontalAccessorValue);\n      }\n      if (!isNil(curr.smVerticalAccessorValue)) {\n        acc.smVValues.add(curr.smVerticalAccessorValue);\n      }\n      return acc;\n    },\n    { smVValues: new Set(), smHValues: new Set() },\n  );\n\n  return {\n    dataSeries,\n    // keep the user order for ordinal scales\n    xValues,\n    ...smallMultipleUniqueValues,\n    fallbackScale: !isOrdinalScale && !isNumberArray ? X_SCALE_DEFAULT.type : undefined,\n  };\n}\n\n/**\n * TODO: Add check for chart type other than area and bar.\n * @internal\n */\nexport function isBandedSpec(spec: BasicSeriesSpec): boolean {\n  return Boolean(spec.y0Accessors && spec.y0Accessors.length > 0 && !isStackedSpec(spec));\n}\n\nfunction getSortedOrdinalXValues(\n  xValues: Set<string | number>,\n  xValueSums: Map<string | number, number>,\n  orderOrdinalBinsBy?: OrderBy,\n) {\n  if (!orderOrdinalBinsBy) {\n    return xValues; // keep the user order for ordinal scales\n  }\n\n  switch (orderOrdinalBinsBy?.binAgg) {\n    case BinAgg.None:\n      return xValues; // keep the user order for ordinal scales\n    case BinAgg.Sum:\n    default:\n      return new Set(\n        [...xValues].sort(\n          (v1, v2) =>\n            (orderOrdinalBinsBy.direction === Direction.Ascending ? 1 : -1) *\n            ((xValueSums.get(v1) ?? 0) - (xValueSums.get(v2) ?? 0)),\n        ),\n      );\n  }\n}\n\nconst BIG_NUMBER = Number.MAX_SAFE_INTEGER; // the sort comparator must yield finite results, can't use infinities\n\nfunction getSeriesNameFromOptions(\n  options: SeriesNameConfigOptions,\n  { yAccessor, splitAccessors }: XYChartSeriesIdentifier,\n  delimiter: string,\n): string | null {\n  if (!options.names) {\n    return null;\n  }\n\n  return (\n    [...options.names]\n      .sort(({ sortIndex: a = BIG_NUMBER }, { sortIndex: b = BIG_NUMBER }) => a - b)\n      .map(({ accessor, value, name }) => {\n        const accessorValue = splitAccessors.get(accessor) ?? null;\n        if (accessorValue === value) {\n          return name ?? value;\n        }\n\n        if (yAccessor === accessor) {\n          return name ?? accessor;\n        }\n        return null;\n      })\n      .filter((d) => Boolean(d) || d === 0)\n      .join(delimiter) || null\n  );\n}\n\n/**\n * Get series name based on `SeriesIdentifier`\n * @internal\n */\nexport function getSeriesName(\n  seriesIdentifier: XYChartSeriesIdentifier,\n  hasSingleSeries: boolean,\n  isTooltip: boolean,\n  spec?: BasicSeriesSpec,\n): string {\n  const customLabel =\n    typeof spec?.name === 'function'\n      ? spec.name(seriesIdentifier, isTooltip)\n      : typeof spec?.name === 'object' // extract booleans once https://github.com/microsoft/TypeScript/issues/12184 is fixed\n        ? getSeriesNameFromOptions(spec.name, seriesIdentifier, spec.name.delimiter ?? SERIES_DELIMITER)\n        : null;\n\n  if (customLabel !== null) {\n    return customLabel.toString();\n  }\n\n  const multipleYAccessors = spec && spec.yAccessors.length > 1;\n  const nameKeys = multipleYAccessors ? seriesIdentifier.seriesKeys : seriesIdentifier.seriesKeys.slice(0, -1);\n  const nonZeroLength = nameKeys.length > 0;\n\n  return nonZeroLength && (spec?.splitSeriesAccessors || !hasSingleSeries)\n    ? nameKeys.join(typeof spec?.name === 'object' ? spec.name.delimiter ?? SERIES_DELIMITER : SERIES_DELIMITER)\n    : spec === undefined\n      ? ''\n      : typeof spec.name === 'string'\n        ? spec.name\n        : spec.id;\n}\n\n/**\n * Helper function to get highest override color.\n * From highest to lowest: `temporary`, `seriesSpec.color` then, unless `temporary` is set to `null`, `persisted`\n */\nfunction getHighestOverride(\n  key: string,\n  customColors: Map<SeriesKey, Color>,\n  overrides: ColorOverrides,\n): Color | undefined {\n  const tempColor: Color | undefined | null = overrides.temporary[key];\n  // Unexpected empty `tempColor` string is falsy and falls through, see comment in `export type Color = ...`\n  // Use default color when temporary and custom colors are null\n  return tempColor || customColors.get(key) || (tempColor === null ? undefined : overrides.persisted[key]);\n}\n\n/**\n * Returns color for a series given all color hierarchies\n * @internal\n */\nexport function getSeriesColors(\n  dataSeries: DataSeries[],\n  chartColors: ColorConfig,\n  customColors: Map<SeriesKey, Color>,\n  overrides: ColorOverrides,\n): Map<SeriesKey, Color> {\n  const seriesColorMap = new Map<SeriesKey, Color>();\n  let counter = 0;\n  const sortedDataSeries = [...dataSeries].sort((a, b) => a.insertIndex - b.insertIndex);\n  groupBy(\n    sortedDataSeries,\n    (ds) => {\n      return [ds.specId, ds.groupId, ds.yAccessor, ...ds.splitAccessors.values()].join('__');\n    },\n    true,\n  ).forEach(([ds]) => {\n    if (!ds) return;\n    const seriesKey = getSeriesKey(\n      {\n        specId: ds.specId,\n        yAccessor: ds.yAccessor,\n        splitAccessors: ds.splitAccessors,\n      },\n      ds.groupId,\n    );\n    const colorOverride = getHighestOverride(seriesKey, customColors, overrides);\n    const color =\n      colorOverride || chartColors.vizColors[counter % chartColors.vizColors.length] || Colors.White.keyword;\n\n    seriesColorMap.set(seriesKey, color);\n    counter++;\n  });\n  return seriesColorMap;\n}\n\n/**\n * Return xy charts series identifier from data series.\n * @internal\n */\nexport function getSeriesIdentifierFromDataSeries(dataSeries: DataSeries): XYChartSeriesIdentifier {\n  const {\n    key,\n    specId,\n    seriesKeys,\n    xAccessor,\n    yAccessor,\n    splitAccessors,\n    smVerticalAccessorValue,\n    smHorizontalAccessorValue,\n  } = dataSeries;\n\n  return stripUndefined({\n    key,\n    specId,\n    seriesKeys,\n    xAccessor,\n    yAccessor,\n    splitAccessors,\n    smVerticalAccessorValue,\n    smHorizontalAccessorValue,\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ReactNode } from 'react';\nimport { $Values } from 'utility-types';\n\nimport { AnimationOptions } from './../renderer/canvas/animations/animation';\nimport { XYChartSeriesIdentifier, DataSeriesDatum } from './series';\nimport { ChartType } from '../../../chart_types';\nimport { Color } from '../../../common/colors';\nimport { TooltipPortalSettings } from '../../../components/portal/types';\nimport { LogScaleOptions, ScaleContinuousType } from '../../../scales';\nimport { ScaleType } from '../../../scales/constants';\nimport { Spec } from '../../../specs';\nimport { SpecType } from '../../../specs/constants';\nimport { AccessorFormat, AccessorFn, Accessor } from '../../../utils/accessor';\nimport { RecursivePartial, Position, Datum } from '../../../utils/common';\nimport { CurveType } from '../../../utils/curves';\nimport { OrdinalDomain } from '../../../utils/domain';\nimport { AxisId, GroupId, SpecId } from '../../../utils/ids';\nimport {\n  AreaSeriesStyle,\n  BarSeriesStyle,\n  GridLineStyle,\n  LineAnnotationStyle,\n  LineSeriesStyle,\n  PointStyle,\n  RectAnnotationStyle,\n  BubbleSeriesStyle,\n  AxisStyle,\n} from '../../../utils/themes/theme';\nimport { PrimitiveValue } from '../../partition_chart/layout/utils/group_by_rollup';\nimport {\n  AnnotationTooltipFormatter,\n  ComponentWithAnnotationDatum,\n  CustomAnnotationTooltip,\n} from '../annotations/types';\n\n/** @public */\nexport type BarStyleOverride = RecursivePartial<BarSeriesStyle> | Color | null;\n/** @public */\nexport type PointStyleOverride = RecursivePartial<PointStyle> | Color | null;\n\n/** @public */\nexport const SeriesType = Object.freeze({\n  Area: 'area' as const,\n  Bar: 'bar' as const,\n  Line: 'line' as const,\n  Bubble: 'bubble' as const,\n});\n\n/**\n * XY series type\n * @public\n */\nexport type SeriesType = $Values<typeof SeriesType>;\n\n/**\n * The offset and mode applied when stacking values\n * @public\n */\nexport const StackMode = Object.freeze({\n  /** Applies a zero baseline and normalizes the values for each point such that the topline is always one. */\n  Percentage: 'percentage' as const,\n  /** Shifts the baseline so as to minimize the weighted wiggle of layers. */\n  Wiggle: 'wiggle' as const,\n  /** Shifts the baseline down such that the center of the streamgraph is always at zero. */\n  Silhouette: 'silhouette' as const,\n});\n\n/**\n * The offset and mode applied when stacking values\n * @public\n */\nexport type StackMode = $Values<typeof StackMode>;\n\n/**\n * Override for bar styles per datum\n *\n * Return types:\n * - `Color`: Color value as a `string` will set the bar `fill` to that color\n * - `RecursivePartial<BarSeriesStyle>`: Style values to be merged with base bar styles\n * - `null`: Keep existing bar style\n * @public\n */\nexport type BarStyleAccessor = (datum: DataSeriesDatum, seriesIdentifier: XYChartSeriesIdentifier) => BarStyleOverride;\n/**\n * Override for bar styles per datum\n *\n * Return types:\n * - `Color`: Color value as a `string` will set the point `stroke` to that color\n * - `RecursivePartial<PointStyle>`: Style values to be merged with base point styles\n * - `null`: Keep existing point style\n * @public\n */\nexport type PointStyleAccessor = (\n  datum: DataSeriesDatum,\n  seriesIdentifier: XYChartSeriesIdentifier,\n) => PointStyleOverride;\n\n/**\n * The global id used by default to group together series\n * @public\n */\nexport const DEFAULT_GLOBAL_ID = '__global__';\n\n/** @public */\nexport type FilterPredicate = (series: XYChartSeriesIdentifier) => boolean;\n/** @public */\nexport type SeriesName = string | number | null;\n/**\n * Function to create custom series name for a given series\n * @public\n */\nexport type SeriesNameFn = (series: XYChartSeriesIdentifier, isTooltip: boolean) => SeriesName;\n\n/**\n * Accessor mapping to replace names\n * @public\n */\nexport interface SeriesNameConfig {\n  /**\n   * accessor key (i.e. `yAccessors` and `seriesSplitAccessors`)\n   */\n  accessor: string | number;\n  /**\n   * Accessor value (i.e. values from `seriesSplitAccessors`)\n   */\n  value?: string | number;\n  /**\n   * New name for Accessor value\n   *\n   * If not provided, the original value will be used\n   */\n  name?: string | number;\n  /**\n   * Sort order of name, overrides order listed in array.\n   *\n   * lower values - left-most\n   * higher values - right-most\n   */\n  sortIndex?: number;\n}\n\n/** @public */\nexport interface SeriesNameConfigOptions {\n  /**\n   * Array of accessor naming configs to replace series names\n   *\n   * Only provided configs will be included\n   * (i.e. if you only provide a single mapping for `yAccessor`, all other series accessor names will be ignored)\n   *\n   * The order of configs is the order in which the resulting names will\n   * be joined, if no `sortIndex` is specified.\n   *\n   * If no values are found for a giving mapping in a series, the mapping will be ignored.\n   */\n  names?: SeriesNameConfig[];\n  /**\n   * Delimiter to join values/names\n   *\n   * @defaultValue an hyphen with spaces ` - `\n   */\n  delimiter?: string;\n}\n\n/** @public */\nexport type SeriesNameAccessor = string | SeriesNameFn | SeriesNameConfigOptions;\n\n/**\n * The fit function type\n * @public\n */\nexport const Fit = Object.freeze({\n  /**\n   * Don't draw value on the graph. Slices out area between `null` values.\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, null null, 8]\n   * ```\n   */\n  None: 'none' as const,\n  /**\n   * Use the previous non-`null` value\n   *\n   * @remarks\n   * This is the opposite of `Fit.Lookahead`\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 2, 2, 8]\n   * ```\n   */\n  Carry: 'carry' as const,\n  /**\n   * Use the next non-`null` value\n   *\n   * @remarks\n   * This is the opposite of `Fit.Carry`\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 8, 8, 8]\n   * ```\n   */\n  Lookahead: 'lookahead' as const,\n  /**\n   * Use the closest non-`null` value (before or after)\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 2, 8, 8]\n   * ```\n   */\n  Nearest: 'nearest' as const,\n  /**\n   * Average between the closest non-`null` values\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 5, 5, 8]\n   * ```\n   */\n  Average: 'average' as const,\n  /**\n   * Linear interpolation between the closest non-`null` values\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 4, 6, 8]\n   * ```\n   */\n  Linear: 'linear' as const,\n  /**\n   * Sets all `null` values to `0`\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, 0, 0, 8]\n   * ```\n   */\n  Zero: 'zero' as const,\n  /**\n   * Specify an explicit value `X`\n   *\n   * @example\n   * ```js\n   * [2, null, null, 8] => [2, X, X, 8]\n   * ```\n   */\n  Explicit: 'explicit' as const,\n});\n\n/** @public */\nexport type Fit = $Values<typeof Fit>;\n\n/** @public */\nexport interface DomainRange {\n  /**\n   * Custom minInterval for the domain which will affect data bin size.\n   * `min: NaN` or `max: NaN` can be used for either or both extrema, when unbounded.\n   * The minInterval cannot be greater than the computed minimum interval between any two adjacent data points.\n   * Further, if you specify a custom numeric minInterval for a time-series, please note that due to the restriction\n   * above, the specified numeric minInterval will be interpreted as a fixed interval.\n   * This means that, for example, if you have yearly time-series data that ranges from 2016 to 2019 and you manually\n   * compute the interval between 2016 and 2017, you'll have 366 days due to 2016 being a leap year.  This will not\n   * be a valid interval because it is greater than the computed minInterval of 365 days between the other years.\n   */\n  min: number;\n  max: number;\n  minInterval?: number;\n}\n\n/**\n * Padding unit for domain\n * @public\n */\nexport const DomainPaddingUnit = Object.freeze({\n  /**\n   * Raw value in the domain space.\n   *\n   * Example:\n   *\n   * If your domain is `[20, 40]` and your padding value is `10`.\n   * The resulting domain would be `[10, 50]`\n   */\n  Domain: 'domain' as const,\n  /**\n   * Spatial pixel value (aka screenspace) not dependent on domain.\n   *\n   * @alpha\n   */\n  Pixel: 'pixel' as const,\n  /**\n   * Ratio of total domain relative to domain space\n   *\n   * Example:\n   *\n   * If your domain is `[20, 40]` and your padding value is `0.1`.\n   * The resulting padding would be 2 (i.e. `0.1 * (40 - 20)`)\n   * resulting in a domain of `[18, 42]`\n   */\n  DomainRatio: 'domainRatio' as const,\n});\n/**\n * Padding unit\n * @public\n */\nexport type DomainPaddingUnit = $Values<typeof DomainPaddingUnit>;\n\n/**\n * Domain option that **only** apply to `yDomains`.\n * @public\n */\nexport interface YDomainBase {\n  /**\n   * Whether to fit the domain to the data.\n   *\n   * Setting `max` or `min` will override this functionality.\n   * @defaultValue false\n   */\n  fit?: boolean;\n  /**\n   * Specify a series of specIds to include into the domain calculation.\n   * Currently, it will work only for annotations, everything else is already included in the domain automatically.\n   * Setting `domain.max` or `domain.min` will override this functionality.\n   * @defaultValue []\n   */\n  includeDataFromIds?: SpecId[];\n  /**\n   * Padding for computed domain as positive number.\n   * Applied to domain __before__ nicing\n   *\n   * Setting `max` or `min` will override this functionality.\n   */\n  padding?: number;\n  /**\n   * Unit of padding dimension\n   *\n   * @defaultValue 'domain'\n   */\n  paddingUnit?: DomainPaddingUnit;\n  /**\n   * Constrains padded domain to the zero baseline.\n   *\n   * e.g. If your domain is `[10, 100]` and `[-10, 120]` with padding.\n   * The domain would be `[0, 120]` if **constrained** or `[-10, 120]` if **unconstrained**.\n   *\n   * @defaultValue true\n   */\n  constrainPadding?: boolean;\n}\n\n/** @public */\nexport type YDomainRange = YDomainBase & DomainRange & LogScaleOptions;\n\n/** @public */\nexport type CustomXDomain = (DomainRange & Pick<LogScaleOptions, 'logBase'>) | OrdinalDomain;\n\n/** @public */\nexport const LabelOverflowConstraint = Object.freeze({\n  BarGeometry: 'barGeometry' as const,\n  ChartEdges: 'chartEdges' as const,\n});\n\n/** @public */\nexport type LabelOverflowConstraint = $Values<typeof LabelOverflowConstraint>;\n\n/** @public */\nexport interface DisplayValueSpec {\n  /**\n   * Show value label in chart element\n   * @defaultValue false\n   */\n  showValueLabel?: boolean;\n  /**\n   * If value labels are shown, skips every other label\n   * @defaultValue false\n   */\n  isAlternatingValueLabel?: boolean;\n  /**\n   * Function for formatting values; will use axis tickFormatter if none specified\n   * @defaultValue false\n   */\n  valueFormatter?: TickFormatter;\n  /**\n   * An option to hide the value label on certain conditions:\n   * - `barGeometry` the label is not rendered if the width/height overflows the associated bar geometry,\n   * - `chartEdges` the label is not rendered if it overflows the chart projection area.\n   * @defaultValue ['barGeometry', 'chartEdges']\n   */\n  overflowConstraints?: Array<LabelOverflowConstraint>;\n}\n\n/** @public */\nexport interface SeriesSpec<D extends BaseDatum = Datum> extends Spec {\n  specType: typeof SpecType.Series;\n  chartType: typeof ChartType.XYAxis;\n  /**\n   * The name of the spec. Also a mechanism to provide custom series names.\n   */\n  name?: SeriesNameAccessor;\n  /**\n   * The ID of the spec group\n   * @defaultValue {@link DEFAULT_GLOBAL_ID}\n   */\n  groupId: string;\n  /**\n   * When specify a groupId on this series, this option can be used to compute this series domain as it was part\n   * of the default group (when using the boolean value true)\n   * or as the series was part of the specified group (when issuing a string)\n   */\n  useDefaultGroupDomain?: boolean | string;\n  /** An array of data */\n  data: D[];\n  /** The type of series you are looking to render */\n  seriesType: SeriesType;\n  /** Set colors for specific series */\n  color?: SeriesColorAccessor;\n  /**\n   * If the series should appear in the legend\n   * @defaultValue `false`\n   */\n  hideInLegend?: boolean;\n  displayValueSettings?: DisplayValueSpec;\n  /**\n   * Postfix string or accessor function for y1 accessor when using `y0Accessors`\n   *\n   * @defaultValue ` - upper`\n   */\n  y0AccessorFormat?: AccessorFormat;\n  /**\n   * Postfix string or accessor function for y1 accessor when using `y0Accessors`\n   *\n   * @defaultValue ` - lower`\n   */\n  y1AccessorFormat?: AccessorFormat;\n  /**\n   * Hide series in tooltip\n   */\n  filterSeriesInTooltip?: FilterPredicate;\n  /**\n   * A function called to format every value label.\n   * Uses axis `tickFormat` when not provided.\n   */\n  tickFormat?: TickFormatter;\n}\n\n/** @public */\nexport interface Postfixes {\n  /**\n   * Postfix for y1 accessor when using `y0Accessors`\n   *\n   * @defaultValue `upper`\n   */\n  y0AccessorFormat?: string;\n  /**\n   * Postfix for y1 accessor when using `y0Accessors`\n   *\n   * @defaultValue `lower`\n   */\n  y1AccessorFormat?: string;\n}\n\n/** @public */\nexport type SeriesColorsArray = string[];\n/** @public */\nexport type SeriesColorAccessorFn = (seriesIdentifier: XYChartSeriesIdentifier) => string | null;\n/** @public */\nexport type SeriesColorAccessor = string | SeriesColorsArray | SeriesColorAccessorFn;\n\n/** @public */\nexport interface SeriesAccessors<D extends BaseDatum = any> {\n  /** The field name of the x value on Datum object */\n  xAccessor: Accessor<D> | AccessorFn<D>;\n  /** An array of field names one per y metric value */\n  yAccessors: (Accessor<D> | AccessorFn<D>)[];\n  /** An optional accessor of the y0 value: base point for area/bar charts  */\n  y0Accessors?: (Accessor<D> | AccessorFn<D>)[];\n  /** An array of fields thats indicates the datum series membership */\n  splitSeriesAccessors?: (Accessor<D> | AccessorFn<D>)[];\n  /**\n   * An array of fields thats indicates the stack membership.\n   * Does not depend on datum at the moment.\n   *\n   * TODO pass datum to accessors when applicable\n   */\n  stackAccessors?: (Accessor<any> | AccessorFn<any>)[];\n  /**\n   * Field name of mark size metric on `Datum`\n   *\n   * Only used with line/area series\n   */\n  markSizeAccessor?: Accessor<D> | AccessorFn<D>;\n}\n\n/** @public */\nexport type XScaleType = typeof ScaleType.Ordinal | ScaleContinuousType;\n\n/** @public */\nexport interface SeriesScales {\n  /**\n   * The x axis scale type\n   * @defaultValue `ordinal` {@link (ScaleType:type) | ScaleType.Ordinal}\n   */\n  xScaleType: XScaleType;\n  /**\n   * Extends the x domain so that it starts and ends on nice round values.\n   * @defaultValue `false`\n   */\n  xNice?: boolean;\n  /**\n   * If using a ScaleType.Time this timezone identifier is required to\n   * compute a nice set of xScale ticks. Can be any IANA zone supported by\n   * the host environment, or a fixed-offset name of the form 'utc+3',\n   * or the strings 'local' or 'utc'.\n   * @defaultValue `local`\n   */\n  timeZone?: string;\n  /**\n   * The y axis scale type\n   * @defaultValue `linear` {@link (ScaleType:type) | ScaleType.Linear}\n   */\n  yScaleType: ScaleContinuousType;\n  /**\n   * Extends the y domain so that it starts and ends on nice round values.\n   * @defaultValue `false`\n   */\n  yNice?: boolean;\n}\n\ntype MarkFormatter<Type extends string = ''> = Type extends 'bar'\n  ? // eslint-disable-next-line @typescript-eslint/ban-types\n    {} // these options are to be empty thus {}\n  : {\n      /**\n       * A function called to format every single mark value\n       *\n       * Only used with line/area series\n       */\n      markFormat?: TickFormatter<number>;\n    };\n\n/** @public */\n\nexport type BasicSeriesSpec<D extends BaseDatum = Datum, Type extends string = ''> = SeriesSpec<D> &\n  SeriesAccessors<D> &\n  SeriesScales &\n  MarkFormatter<Type>;\n\n/** @public */\nexport type SeriesSpecs<D extends BaseDatum = Datum, S extends BasicSeriesSpec<D> = BasicSeriesSpec<D>> = Array<S>;\n\n/**\n * Expected shape of unknown data row/datum\n * @public\n */\nexport type BaseDatum = Record<string, any> | any[];\n\n/**\n * This spec describe the dataset configuration used to display a bar series.\n * @public\n */\nexport type BarSeriesSpec<D extends BaseDatum = Datum> = BasicSeriesSpec<D, 'bar'> &\n  Postfixes & {\n    /** @defaultValue `bar` {@link (SeriesType:type) | SeriesType.Bar} */\n    seriesType: typeof SeriesType.Bar;\n    /** If true, will stack all BarSeries and align bars to ticks (instead of centered on ticks) */\n    enableHistogramMode?: boolean;\n    barSeriesStyle?: RecursivePartial<BarSeriesStyle>;\n    /**\n     * Stack each series using a specific mode: Percentage, Wiggle, Silhouette.\n     * The last two modes are generally used for stream graphs\n     */\n    stackMode?: StackMode;\n    /**\n     * Functional accessor to return custom color or style for bar datum\n     */\n    styleAccessor?: BarStyleAccessor;\n    /**\n     * Min height to render bars for highly variable data\n     *\n     * @remarks\n     * i.e. ranges from 100,000 to 1.\n     *\n     * The unit is expressed in `pixel`\n     */\n    minBarHeight?: number;\n  };\n\n/**\n * This spec describe the dataset configuration used to display a histogram bar series.\n * A histogram bar series is identical to a bar series except for the bar width.\n * @public\n */\nexport type HistogramBarSeriesSpec<D extends BaseDatum = Datum> = BarSeriesSpec<D> & {\n  enableHistogramMode: true;\n};\n\n/** @public */\nexport type FitConfig = {\n  /**\n   * Fit type for data with null values\n   */\n  type: Fit;\n  /**\n   * Fit value used when `type` is set to `Fit.Explicit`\n   */\n  value?: number;\n  /**\n   * Value used for first and last point if fitting is not possible\n   *\n   * `'nearest'` will set indeterminate end values to the closes _visible_ point.\n   *\n   * Note: Computed fit values will always take precedence over `endValues`\n   */\n  endValue?: number | 'nearest';\n};\n\n/**\n * This spec describe the dataset configuration used to display a line series.\n * @public\n */\nexport type LineSeriesSpec<D extends BaseDatum = Datum> = BasicSeriesSpec<D, 'line'> &\n  HistogramConfig & {\n    /** @defaultValue `line` {@link (SeriesType:type) | SeriesType.Line} */\n    seriesType: typeof SeriesType.Line;\n    curve?: CurveType;\n    lineSeriesStyle?: RecursivePartial<LineSeriesStyle>;\n    /**\n     * An optional functional accessor to return custom color or style for point datum\n     */\n    pointStyleAccessor?: PointStyleAccessor;\n    /**\n     * Fit config to fill `null` values in dataset\n     */\n    fit?: Exclude<Fit, 'explicit'> | FitConfig;\n  };\n\n/**\n * This spec describe the dataset configuration used to display a line series.\n *\n * @alpha\n */\nexport type BubbleSeriesSpec<D extends BaseDatum = Datum> = BasicSeriesSpec<D, 'bubble'> & {\n  /** @defaultValue `bubble` {@link (SeriesType:type) | SeriesType.Bubble} */\n  seriesType: typeof SeriesType.Bubble;\n  bubbleSeriesStyle?: RecursivePartial<BubbleSeriesStyle>;\n  /**\n   * An optional functional accessor to return custom color or style for point datum\n   */\n  pointStyleAccessor?: PointStyleAccessor;\n};\n\n/**\n * This spec describe the dataset configuration used to display an area series.\n * @public\n */\nexport type AreaSeriesSpec<D extends BaseDatum = Datum> = BasicSeriesSpec<D, 'area'> &\n  HistogramConfig &\n  Postfixes & {\n    /** @defaultValue `area` {@link (SeriesType:type) | SeriesType.Area} */\n    seriesType: typeof SeriesType.Area;\n    /** The type of interpolator to be used to interpolate values between points */\n    curve?: CurveType;\n    areaSeriesStyle?: RecursivePartial<AreaSeriesStyle>;\n    /**\n     * Stack each series using a specific mode: Percentage, Wiggle, Silhouette.\n     * The last two modes are generally used for stream graphs\n     */\n    stackMode?: StackMode;\n    /**\n     * An optional functional accessor to return custom color or style for point datum\n     */\n    pointStyleAccessor?: PointStyleAccessor;\n    /**\n     * Fit config to fill `null` values in dataset\n     */\n    fit?: Exclude<Fit, 'explicit'> | FitConfig;\n  };\n\n/** @public */\nexport interface HistogramConfig {\n  /**\n   *  Determines how points in the series will align to bands in histogram mode\n   * @defaultValue `start`\n   */\n  histogramModeAlignment?: HistogramModeAlignment;\n}\n\n/** @public */\nexport const HistogramModeAlignments = Object.freeze({\n  Start: 'start' as HistogramModeAlignment,\n  Center: 'center' as HistogramModeAlignment,\n  End: 'end' as HistogramModeAlignment,\n});\n\n/** @public */\nexport type HistogramModeAlignment = 'start' | 'center' | 'end';\n\n/**\n * This spec describe the configuration for a chart axis.\n * @public\n */\nexport interface AxisSpec extends Spec {\n  specType: typeof SpecType.Axis;\n  chartType: typeof ChartType.XYAxis;\n  /** The ID of the spec */\n  id: AxisId;\n  /** Style options for grid line */\n  gridLine?: Partial<GridLineStyle>;\n  /**\n   * The ID of the axis group\n   * @defaultValue {@link DEFAULT_GLOBAL_ID}\n   */\n  groupId: GroupId;\n  /** Hide this axis */\n  hide: boolean;\n  /** shows all ticks and gridlines, including those belonging to labels that got culled due to overlapping with other labels */\n  showOverlappingTicks: boolean;\n  /** Shows all labels, also the overlapping ones */\n  showOverlappingLabels: boolean;\n  /** Where the axis appear on the chart */\n  position: Position;\n  /**\n   * A function called to format every tick value label.\n   * Uses first series spec `tickFormat` when not provided.\n   *\n   * used in tooltip when no `tickFormat` is provided from series spec\n   */\n  tickFormat?: TickFormatter;\n  /**\n   * A function called to format every label  (excludes tooltip)\n   *\n   * overrides tickFormat for axis labels\n   */\n  labelFormat?: TickFormatter;\n  /** An approximate count of how many ticks will be generated */\n  ticks?: number;\n  /** The axis title */\n  title?: string;\n  /** Custom style overrides */\n  style?: RecursivePartial<Omit<AxisStyle, 'gridLine'>>;\n  /** If specified, it constrains the domain for these values */\n  domain?: YDomainRange;\n  /**\n   * Show only integar values\n   * @deprecated use `maximumFractionDigits` instead\n   */\n  integersOnly?: boolean;\n  /**\n   * Max fractional digit to limit precision of number ticks\n   */\n  maximumFractionDigits?: number;\n  /**\n   * Show duplicated ticks\n   * @defaultValue `false`\n   */\n  showDuplicatedTicks?: boolean;\n\n  /**\n   * Render a multi-layer time axis. Use 2 or 3 as valid number of layers.\n   * Use 0 to use the alternative, one row, time axis.\n   * @alpha\n   * @defaultValue 0\n   */\n  timeAxisLayerCount: number;\n}\n\n/** @public */\nexport type TickFormatterOptions = {\n  timeZone?: string;\n};\n\n/** @public */\nexport type TickFormatter<V = any> = (value: V, options?: TickFormatterOptions) => string;\n\n/** @public */\nexport const AnnotationType = Object.freeze({\n  Line: 'line' as const,\n  Rectangle: 'rectangle' as const,\n  Text: 'text' as const,\n});\n/** @public */\nexport type AnnotationType = $Values<typeof AnnotationType>;\n\n/**\n * The domain type enum that can be associated with an annotation\n * @public\n */\nexport const AnnotationDomainType = Object.freeze({\n  XDomain: 'xDomain' as const,\n  YDomain: 'yDomain' as const,\n});\n\n/**\n * The domain type that can be associated with an annotation\n * @public\n */\nexport type AnnotationDomainType = $Values<typeof AnnotationDomainType>;\n\n/**\n * The descriptive object of a line annotation\n * @public\n */\nexport interface LineAnnotationDatum<D = any> {\n  /**\n   * The value on the x or y axis according to the domainType configured\n   */\n  dataValue: D;\n  /**\n   * A textual description of the annotation\n   */\n  details?: string;\n  /**\n   * An header of the annotation. If undefined, than the formatted dataValue will be used\n   */\n  header?: string;\n}\n\n/** @public */\nexport const AnnotationAnimationTrigger = Object.freeze({\n  FadeOnFocusingOthers: 'FadeOnFocusingOthers' as const,\n});\n/** @public */\nexport type AnnotationAnimationTrigger = $Values<typeof AnnotationAnimationTrigger>;\n\n/** @public */\nexport interface AnimationConfig<T extends string> {\n  trigger: T;\n  options?: AnimationOptions;\n}\n\n/** @public */\nexport type AnnotationAnimationConfig = AnimationConfig<AnnotationAnimationTrigger>;\n\n/** @public */\nexport type LineAnnotationSpec<D = any> = BaseAnnotationSpec<\n  typeof AnnotationType.Line,\n  LineAnnotationDatum<D>,\n  LineAnnotationStyle,\n  D\n> & {\n  domainType: AnnotationDomainType;\n  /** Optional Custom marker icon centered on data value */\n  marker?: ReactNode | ComponentWithAnnotationDatum<D>;\n  /** Optional marker body, always contained within chart area */\n  markerBody?: ReactNode | ComponentWithAnnotationDatum<D>;\n  /**\n   * Custom marker dimensions; will be computed internally\n   * Any user-supplied values will be overwritten\n   */\n  markerDimensions?: {\n    width: number;\n    height: number;\n  };\n  /**\n   * An optional marker position.\n   *\n   * @remarks\n   * The default position, if this property is not specified, falls back to the linked axis position (if available).\n   * If no axis present on the chart, the marker position is positioned by default on the bottom on the X domain\n   * and on the left of the chart for the Y domain. The specified position is an absolute position and reflect\n   * the spatial position of the marker independently from the chart rotation.\n   */\n  markerPosition?: Position;\n  /** Annotation lines are hidden */\n  hideLines?: boolean;\n  /**\n   * Hide tooltip when hovering over the line\n   * @defaultValue `true`\n   */\n  hideLinesTooltips?: boolean;\n  /**\n   * z-index of the annotation relative to other elements in the chart\n   * @defaultValue 1\n   */\n  zIndex?: number;\n};\n\n/**\n * The descriptive object of a rectangular annotation\n * @public\n */\nexport interface RectAnnotationDatum {\n  /**\n   * The coordinates for the 4 rectangle points.\n   */\n  coordinates: {\n    /**\n     * The minuimum value on the x axis. If undefined, the minuimum value of the x domain will be used.\n     */\n    x0?: PrimitiveValue;\n    /**\n     * The maximum value on the x axis. If undefined, the maximum value of the x domain will be used.\n     */\n    x1?: PrimitiveValue;\n    /**\n     * The minimum value on the y axis. If undefined, the minimum value of the y domain will be used.\n     */\n    y0?: PrimitiveValue;\n    /**\n     * The maximum value on the y axis. If undefined, the maximum value of the y domain will be used.\n     */\n    y1?: PrimitiveValue;\n  };\n  /**\n   * A textual description of the annotation\n   */\n  details?: string;\n}\n\n/** @public */\nexport type RectAnnotationSpec = BaseAnnotationSpec<\n  typeof AnnotationType.Rectangle,\n  RectAnnotationDatum,\n  RectAnnotationStyle\n> & {\n  /**\n   * z-index of the annotation relative to other elements in the chart\n   * @defaultValue -1\n   */\n  zIndex?: number;\n  /**\n   * Renders annotation outside of chart area within axis gutter\n   *\n   * @defaultValue false\n   */\n  outside?: boolean;\n  /**\n   * Dimension, either height or width, of outside annotation\n   */\n  outsideDimension?: number;\n};\n\n/**\n * Portal settings for annotation tooltips\n *\n * @public\n */\nexport type AnnotationPortalSettings = TooltipPortalSettings<'chart'> & {\n  /**\n   * The react component used to render a custom tooltip\n   * @public\n   */\n  customTooltip?: CustomAnnotationTooltip;\n  /**\n   * The react component used to render a custom tooltip details\n   * @public\n   */\n  customTooltipDetails?: AnnotationTooltipFormatter;\n};\n\n/** @public */\nexport interface BaseAnnotationSpec<\n  T extends typeof AnnotationType.Rectangle | typeof AnnotationType.Line,\n  AD extends RectAnnotationDatum | LineAnnotationDatum<D>,\n  S extends RectAnnotationStyle | LineAnnotationStyle,\n  D = never,\n> extends Spec,\n    AnnotationPortalSettings {\n  chartType: typeof ChartType.XYAxis;\n  specType: typeof SpecType.Annotation;\n  /**\n   * Annotation type: line, rectangle\n   */\n  annotationType: T;\n  /**\n   * The ID of the axis group, needed for yDomain position\n   * @defaultValue {@link DEFAULT_GLOBAL_ID}\n   */\n  groupId: GroupId;\n  /**\n   * Data values defined with coordinates and details\n   */\n  dataValues: AD[];\n  /**\n   * Custom annotation style\n   */\n  style?: RecursivePartial<S>;\n  /**\n   * Toggles tooltip annotation visibility\n   */\n  hideTooltips?: boolean;\n  /**\n   * z-index of the annotation relative to other elements in the chart\n   * Default specified per specific annotation spec.\n   */\n  zIndex?: number;\n  /**\n   * Animation configurations for annotations\n   */\n  animations?: AnnotationAnimationConfig[];\n}\n\n/** @public */\nexport type AnnotationSpec<D extends BaseDatum = any> = LineAnnotationSpec<D> | RectAnnotationSpec;\n\n/** @internal */\nexport function isLineAnnotation<D extends BaseDatum>(spec: AnnotationSpec<D>): spec is LineAnnotationSpec<D> {\n  return spec.annotationType === AnnotationType.Line;\n}\n\n/** @internal */\nexport function isRectAnnotation(spec: AnnotationSpec): spec is RectAnnotationSpec {\n  return spec.annotationType === AnnotationType.Rectangle;\n}\n\n/** @internal */\nexport function isBarSeriesSpec<D extends BaseDatum>(spec: BasicSeriesSpec<D>): spec is BarSeriesSpec<D> {\n  return spec.seriesType === SeriesType.Bar;\n}\n\n/** @internal */\nexport function isBubbleSeriesSpec<D extends BaseDatum>(spec: BasicSeriesSpec<D>): spec is BubbleSeriesSpec<D> {\n  return spec.seriesType === SeriesType.Bubble;\n}\n\n/** @internal */\nexport function isLineSeriesSpec<D extends BaseDatum>(spec: BasicSeriesSpec<D>): spec is LineSeriesSpec<D> {\n  return spec.seriesType === SeriesType.Line;\n}\n\n/** @internal */\nexport function isAreaSeriesSpec<D extends BaseDatum>(spec: BasicSeriesSpec<D>): spec is AreaSeriesSpec<D> {\n  return spec.seriesType === SeriesType.Area;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { stack as D3Stack, stackOffsetWiggle, stackOrderNone } from 'd3-shape';\n\nimport {\n  diverging,\n  divergingPercentage,\n  divergingSilhouette,\n  divergingWiggle,\n  XValueMap,\n  XValueSeriesDatum,\n} from './diverging_offsets';\nimport { DataSeries, DataSeriesDatum } from './series';\nimport { SeriesType, StackMode } from './specs';\nimport { SeriesKey } from '../../../common/series_id';\nimport { ScaleType } from '../../../scales/constants';\nimport { clamp, isDefined } from '../../../utils/common';\nimport { Logger } from '../../../utils/logger';\n\n/** @internal */\nexport interface StackedValues {\n  values: number[];\n  percent: Array<number>;\n  total: number;\n}\n\n/** @internal */\nexport const datumXSortPredicate =\n  (xScaleType: ScaleType, sortedXValues?: (string | number)[]) =>\n  (a: { x: number | string }, b: { x: number | string }) => {\n    if (xScaleType === ScaleType.Ordinal || typeof a.x === 'string' || typeof b.x === 'string') {\n      return sortedXValues ? sortedXValues.indexOf(a.x) - sortedXValues.indexOf(b.x) : 0;\n    }\n    return a.x - b.x;\n  };\n\n/** @internal */\nexport function formatStackedDataSeriesValues(\n  dataSeries: DataSeries[],\n  xValues: Set<string | number>,\n  seriesType: SeriesType,\n  stackMode?: StackMode,\n): DataSeries[] {\n  const dataSeriesMap = dataSeries.reduce<Map<SeriesKey, DataSeries>>((acc, curr) => {\n    return acc.set(curr.key, curr);\n  }, new Map());\n  let hasNegative = false;\n  let hasPositive = false;\n\n  // group data series by x values\n  const xMap: XValueMap = new Map();\n  [...xValues].forEach((xValue) => {\n    const seriesMap = new Map<SeriesKey, DataSeriesDatum>();\n    dataSeries.forEach(({ key, data, isFiltered }) => {\n      if (isFiltered) return;\n      const datum = data.find(({ x }) => x === xValue);\n      if (!datum) return;\n      const y1 = datum.y1 ?? 0;\n      if (hasPositive || y1 > 0) hasPositive = true;\n      if (hasNegative || y1 < 0) hasNegative = true;\n      seriesMap.set(`${key}-y0`, datum);\n      seriesMap.set(key, datum);\n    });\n    xMap.set(xValue, seriesMap);\n  });\n\n  if (hasNegative && hasPositive && seriesType === SeriesType.Area) {\n    Logger.warn(\n      `Area series should be avoided with dataset containing positive and negative values. Use a bar series instead.`,\n    );\n  }\n\n  const keys = [...dataSeriesMap.keys()].reduce<string[]>((acc, key) => [...acc, `${key}-y0`, key], []);\n  const stackOffset = getOffsetBasedOnStackMode(stackMode, hasNegative && !hasPositive);\n  const stack = D3Stack<XValueSeriesDatum>()\n    .keys(keys)\n    .value(([, indexMap], key) => {\n      const datum = indexMap.get(key);\n      if (!datum) return 0; // hides filtered series while maintaining their existence\n      return key.endsWith('-y0') ? datum.y0 ?? 0 : datum.y1 ?? 0;\n    })\n    .order(stackOrderNone)\n    .offset(stackOffset)(xMap)\n    .filter(({ key }) => !key.endsWith('-y0'));\n\n  return stack\n    .map<DataSeries | null>((stackedSeries) => {\n      const dataSeriesProps = dataSeriesMap.get(stackedSeries.key);\n      if (!dataSeriesProps) return null;\n      const data = stackedSeries\n        .map<DataSeriesDatum | null>((row) => {\n          const d = row.data[1].get(stackedSeries.key);\n          if (!d || d.x === undefined || d.x === null) return null;\n          const { initialY0, initialY1, mark, datum, filled, x } = d;\n          const [y0, y1] = row;\n\n          return {\n            x,\n            /**\n             * Due to floating point errors, values computed on a stack\n             * could falls out of the current defined domain boundaries.\n             * This in particular cause issues with percent stack, where the domain\n             * is hardcoded to [0,1] and some value can fall outside that domain.\n             */\n            y1: clampIfStackedAsPercentage(y1, stackMode),\n            y0: clampIfStackedAsPercentage(y0, stackMode),\n            initialY0,\n            initialY1,\n            mark,\n            datum,\n            filled,\n          };\n        })\n        .filter(isDefined);\n      return {\n        ...dataSeriesProps,\n        data,\n      };\n    })\n    .filter(isDefined);\n}\n\nfunction clampIfStackedAsPercentage(value: number, stackMode?: StackMode) {\n  return stackMode === StackMode.Percentage ? clamp(value, 0, 1) : value;\n}\n\nfunction getOffsetBasedOnStackMode(stackMode?: StackMode, onlyNegative = false) {\n  // TODO: fix diverging wiggle offset for negative polarity data\n  if (onlyNegative && stackMode === StackMode.Wiggle) return stackOffsetWiggle;\n\n  switch (stackMode) {\n    case StackMode.Percentage:\n      return divergingPercentage;\n    case StackMode.Silhouette:\n      return divergingSilhouette;\n    case StackMode.Wiggle:\n      return divergingWiggle;\n    default:\n      return diverging;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../../common/colors';\nimport { Ratio } from '../../../common/geometry';\nimport { Texture } from '../../../geoms/types';\nimport { ColorVariant, degToRad, getColorFromVariant } from '../../../utils/common';\nimport { Point } from '../../../utils/point';\nimport { TexturedStyles, TextureShape } from '../../../utils/themes/theme';\nimport { TextureRendererFn } from '../renderer/shapes_paths';\n\nconst getSpacing = ({ spacing }: TexturedStyles): Point => ({\n  x: typeof spacing === 'number' ? spacing : spacing?.x ?? 0,\n  y: typeof spacing === 'number' ? spacing : spacing?.y ?? 0,\n});\n\nconst getPath = (textureStyle: TexturedStyles, size: number, strokeWidth: number): [path: Path2D, rotation: number] => {\n  if ('path' in textureStyle) {\n    const path = typeof textureStyle.path === 'string' ? new Path2D(textureStyle.path) : textureStyle.path;\n\n    return [path, 0];\n  }\n  const [pathFn, rotation] = TextureRendererFn[textureStyle.shape];\n  // Prevents clipping shapes near edge\n  const strokeWidthPadding = [TextureShape.Circle, TextureShape.Square].includes(textureStyle.shape as any)\n    ? strokeWidth\n    : 0;\n\n  return [new Path2D(pathFn((size - strokeWidthPadding) / 2)), rotation];\n};\n\n/** @internal */\nfunction createPattern(\n  ctx: CanvasRenderingContext2D,\n  dpi: number,\n  patternCanvas: HTMLCanvasElement,\n  baseColor: Color | ColorVariant,\n  sharedGeometryOpacity: Ratio,\n  textureStyle?: TexturedStyles,\n): CanvasPattern | null {\n  const pCtx = patternCanvas.getContext('2d');\n  if (!textureStyle || !pCtx) return null;\n\n  const { size = 10, stroke, strokeWidth = 1, opacity, shapeRotation, fill, dash } = textureStyle;\n\n  const spacing = getSpacing(textureStyle);\n  const cssWidth = size + spacing.x;\n  const cssHeight = size + spacing.y;\n  patternCanvas.width = dpi * cssWidth;\n  patternCanvas.height = dpi * cssHeight;\n\n  pCtx.globalAlpha = sharedGeometryOpacity * (opacity ?? 1);\n  pCtx.lineWidth = strokeWidth;\n\n  pCtx.strokeStyle = getColorFromVariant(baseColor, stroke ?? ColorVariant.Series);\n  if (dash) pCtx.setLineDash(dash);\n\n  if (fill) pCtx.fillStyle = getColorFromVariant(baseColor, fill);\n\n  const [path, pathRotation] = getPath(textureStyle, size, strokeWidth);\n  const itemRotation = (shapeRotation ?? 0) + pathRotation;\n\n  pCtx.scale(dpi, dpi);\n  pCtx.translate(cssWidth / 2, cssHeight / 2);\n\n  if (itemRotation) pCtx.rotate(degToRad(itemRotation));\n\n  pCtx.beginPath();\n\n  if (path) {\n    pCtx.stroke(path);\n    if (fill) pCtx.fill(path);\n  }\n\n  const pattern = ctx.createPattern(patternCanvas, 'repeat')!; // HTMLCanvasElement always yields a CanvasPattern anyway\n\n  const { offset, rotation } = textureStyle;\n  const matrix = new DOMMatrix([1 / dpi, 0, 0, 1 / dpi, 0, 0]);\n  if (offset?.global) matrix.translateSelf(offset.x ?? 0, offset.y ?? 0);\n  matrix.rotateSelf(rotation ?? 0);\n  if (offset && !offset.global) matrix.translateSelf(offset.x ?? 0, offset.y ?? 0);\n\n  pattern.setTransform(matrix);\n  return pattern;\n}\n\n/** @internal */\nexport const getTextureStyles = (\n  ctx: CanvasRenderingContext2D,\n  patternCanvas: HTMLCanvasElement,\n  baseColor: Color | ColorVariant,\n  sharedGeometryOpacity: Ratio,\n  texture?: TexturedStyles,\n): Texture | undefined => {\n  const dpi = window.devicePixelRatio;\n  const pattern = createPattern(ctx, dpi, patternCanvas, baseColor, sharedGeometryOpacity, texture);\n\n  if (!pattern || !texture) return;\n\n  const { rotation, offset } = texture;\n\n  return {\n    pattern,\n    rotation,\n    offset,\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// In preparation of nominal types in future TS versions\n// https://github.com/microsoft/TypeScript/pull/33038\n// eg. to avoid adding angles and coordinates and similar inconsistent number/number ops.\n// could in theory be three-valued (in,on,out)\n// It also serves as documentation.\n\nimport { TimeMs } from './geometry';\n\n/**\n * @public\n *\n * Pre-existing animation config to be refactored using new animation config\n */\nexport interface LegacyAnimationConfig {\n  /** @alpha */\n  animation: {\n    duration: TimeMs;\n  };\n}\n","/* eslint-disable header/header */\n\n/**\n * @notice\n * This product includes code that is adapted from https://github.com/Myndex/SAPC-APCA\n * which is available under a \"W3C SOFTWARE NOTICE AND LICENSE\" license.\n */\n\n/// /////////////////////////////////////////////////////////////////////////////\n/// //\n/// //   *****  SAPC BLOCK  *****\n/// //\n/// //   For Evaluations, this is referred to as: SAPC-8, D-series constants\n/// //                S-LUV Advanced Perceptual Contrast\n/// //   Copyright © 2019-2021 by Andrew Somers. All Rights Reserved.\n/// //\n/// //\n/// //   INCLUDED Extensions or Model Features:\n/// //       • SAPC-8 Core Contrast\n/// //       • SmoothScale™ scaling technique\n/// //       • SoftToe black level soft clamp\n/// //\n/// //   NOT INCLUDED — This Version Does NOT Have These Extensions:\n/// //       • Color Vision Module\n/// //       • Spatial Frequency Module\n/// //       • Light Adaptation Module\n/// //       • Dynamics Module\n/// //       • Alpha Module\n/// //       • Personalization Module\n/// //       • Multiway Module\n/// //       • DynaFont™ font display\n/// //       • ResearchMode middle contrast explorer\n/// //       • ResearchMode static target\n/// //       • CIE function suite\n/// //       • SAPColor listings and sorting suite\n/// //       • RGBcolor() colorString parsing\n/// //\n/// //\n/// /////////////////////////////////////////////////////////////////////////////\n\n/// /////////////////////////////////////////////////////////////////////////////\n/// ////////////////////////////////////////////////////////////////////////////\n/// //  BEGIN SAPC/APCA CONTRAST BLOCK  \\//////////////////////////////////////\n/// /                                    \\////////////////////////////////////\n\n/// /////////////////////////////////////////////////////////////////////////\n/// // SAPC Function with SmoothScale  \\////////////////////////////////////\n/// /                                   \\//////////////////////////////////\n///\n\n/// // *** Polarity is Important: do not mix up background and text *** /////\n\n/// //  Input value must be integer in RGB order (RRGGBB for 0xFFFFFF)  /////\n\nimport { RgbTuple } from './color_library_wrappers';\n\n/**\n * / //  DO NOT use a Y from any other method  /////\n * @internal\n */\nexport function APCAContrast([Rbg, Gbg, Bbg]: RgbTuple, [Rtxt, Gtxt, Btxt]: RgbTuple) {\n  /// //  sRGB Conversion to Relative Luminance (Y)  /////\n\n  const mainTRC = 2.4; // Transfer Curve (aka \"Gamma\") for sRGB linearization\n  // Simple power curve vs piecewise described in docs\n  // Essentially, 2.4 best models actual display\n  // characteristics in combination with the total method\n\n  const Rco = 0.2126729; // sRGB Red Coefficient (from matrix)\n  const Gco = 0.7151522; // sRGB Green Coefficient (from matrix)\n  const Bco = 0.072175; // sRGB Blue Coefficient (from matrix)\n\n  /// //  For Finding Raw SAPC Contrast from Relative Luminance (Y)  /////\n\n  const normBG = 0.56; // Constants for SAPC Power Curve Exponents\n  const normTXT = 0.57; // One pair for normal text, and one for reverse\n  const revTXT = 0.62; // These are the \"beating heart\" of SAPC\n  const revBG = 0.65;\n\n  /// //  For Clamping and Scaling Values  /////\n  // constant updated to https://github.com/Myndex/SAPC-APCA#apca-math-new-098g-4g-constants\n  // new 0.98G 4g constants\n\n  const blkThrs = 0.022; // Level that triggers the soft black clamp\n  const blkClmp = 1.414; // Exponent for the soft black clamp curve\n  const deltaYmin = 0.0005; // Lint trap\n  const scaleBoW = 1.14; // Scaling for dark text on light\n  const scaleWoB = 1.14; // Scaling for light text on dark\n  const loConThresh = 0.035991; // Threshold for new simple offset scale\n  const loConFactor = 27.7847239587675;\n  const loConOffset = 0.027; // The simple offset\n  const loClip = 0.001; // Output clip (lint trap #2)\n\n  // We are only concerned with Y at this point\n  // Ybg and Ytxt: divide sRGB to 0.0-1.0 range, linearize,\n  // and then apply the standard coefficients and sum to Y.\n  // Note that the Y we create here is unique and designed\n  // exclusively for SAPC. Do not use Y from other methods.\n\n  let Ybg =\n    Math.pow(Rbg / 255.0, mainTRC) * Rco + Math.pow(Gbg / 255.0, mainTRC) * Gco + Math.pow(Bbg / 255.0, mainTRC) * Bco;\n\n  let Ytxt =\n    Math.pow(Rtxt / 255.0, mainTRC) * Rco +\n    Math.pow(Gtxt / 255.0, mainTRC) * Gco +\n    Math.pow(Btxt / 255.0, mainTRC) * Bco;\n\n  let SAPC = 0.0; // For holding raw SAPC values\n  let outputContrast = 0.0; // For weighted final values\n\n  /// // TUTORIAL  /////\n\n  // Take Y and soft clamp black, return 0 for very close luminances\n  // determine polarity, and calculate SAPC raw contrast\n  // Then apply the output scaling\n\n  // Note that reverse contrast (white text on black)\n  // intentionally returns a negative number\n  // Proper polarity is important!\n\n  /// ///////   BLACK SOFT CLAMP & INPUT CLIP  ////////////////////////////////\n\n  // Soft clamp Y when near black.\n  // Now clamping all colors to prevent crossover errors\n  Ytxt = Ytxt > blkThrs ? Ytxt : Ytxt + Math.pow(blkThrs - Ytxt, blkClmp);\n\n  Ybg = Ybg > blkThrs ? Ybg : Ybg + Math.pow(blkThrs - Ybg, blkClmp);\n\n  /// //   Return 0 Early for extremely low ∆Y (lint trap #1) /////\n  if (Math.abs(Ybg - Ytxt) < deltaYmin) {\n    return 0.0;\n  }\n\n  /// ///////   SAPC CONTRAST   ///////////////////////////////////////////////\n\n  if (Ybg > Ytxt) {\n    // For normal polarity, black text on white\n\n    /// // Calculate the SAPC contrast value and scale\n\n    SAPC = (Math.pow(Ybg, normBG) - Math.pow(Ytxt, normTXT)) * scaleBoW;\n\n    /// // NEW! SAPC SmoothScale™\n    // Low Contrast Smooth Scale Rollout to prevent polarity reversal\n    // and also a low clip for very low contrasts (lint trap #2)\n    // much of this is for very low contrasts, less than 10\n    // therefore for most reversing needs, only loConOffset is important\n    outputContrast =\n      SAPC < loClip ? 0.0 : SAPC < loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC - loConOffset;\n  } else {\n    // For reverse polarity, light text on dark\n    // WoB should always return negative value.\n\n    SAPC = (Math.pow(Ybg, revBG) - Math.pow(Ytxt, revTXT)) * scaleWoB;\n\n    outputContrast =\n      SAPC > -loClip ? 0.0 : SAPC > -loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC + loConOffset;\n  }\n\n  return outputContrast * 100;\n} // Close APCAcontrast()\n\n/// /\\                            ///////////////////////////////////////////\\\n/// //\\  END OF SAPC/APCA BLOCK  /////////////////////////////////////////////\\\n/// ///////////////////////////////////////////////////////////////////////////\\\n/// ////////////////////////////////////////////////////////////////////////////\\\n/* eslint-enable */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/**\n * A string key is used to uniquely identify categories\n *\n * todo: broaden it; some options:\n *   - allow other values of `PrimitiveValue` type (now: string | number | null) but should add Symbol\n *   - allow a descriptor object, eg. `{ key: PrimitiveValue, label: string }`\n *   - allow an accessor that operates on the key, and maps it to a label\n */\n\n/** @public */\nexport type CategoryKey = string;\n\n/** @public */\nexport type CategoryLabel = string;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Required } from 'utility-types';\n\nimport { APCAContrast } from './apca_color_contrast';\nimport { RgbaTuple, RGBATupleToString, RgbTuple } from './color_library_wrappers';\nimport { ColorDefinition, Colors } from './colors';\nimport { getWCAG2ContrastRatio } from './wcag2_color_contrast';\n\n/** @internal */\nexport function hueInterpolator(colors: RgbTuple[]) {\n  return (d: number) => RGBATupleToString(colors[Math.round(d * 255)] ?? Colors.White.rgba);\n}\n\n/** @internal */\nexport function arrayToLookup(keyFun: (v: any) => any, array: Array<any>) {\n  return Object.assign({}, ...array.map((d) => ({ [keyFun(d)]: d })));\n}\n\n/**\n * Blend a foreground (fg) color with a background (bg) color\n * @internal\n */\nexport function combineColors([fgR, fgG, fgB, fgA]: RgbaTuple, [bgR, bgG, bgB, bgA]: RgbaTuple): RgbaTuple {\n  // combine colors only if foreground has transparency\n  if (fgA === 1) {\n    return [fgR, fgG, fgB, fgA];\n  }\n\n  // For reference on alpha calculations:\n  // https://en.wikipedia.org/wiki/Alpha_compositing\n  const alpha = fgA + bgA * (1 - fgA);\n\n  if (alpha === 0) {\n    return Colors.Transparent.rgba;\n  }\n\n  const r = Math.round((fgR * fgA + bgR * bgA * (1 - fgA)) / alpha);\n  const g = Math.round((fgG * fgA + bgG * bgA * (1 - fgA)) / alpha);\n  const b = Math.round((fgB * fgA + bgB * bgA * (1 - fgA)) / alpha);\n  return [r, g, b, alpha];\n}\n\n/** @internal */\nexport interface ColorContrastOptions {\n  darkColor?: RgbaTuple;\n  lightColor?: RgbaTuple;\n}\n\nconst getOptionWithDefaults = (options: ColorContrastOptions = {}): Required<ColorContrastOptions> => ({\n  darkColor: Colors.Black.rgba,\n  lightColor: Colors.White.rgba,\n  ...options,\n});\n\nfunction getHighContrastColorWCAG2(background: RgbTuple, options: ColorContrastOptions = {}): HighContrastResult {\n  const { lightColor, darkColor } = getOptionWithDefaults(options);\n  const wLight = getWCAG2ContrastRatio(lightColor, background);\n  const wDark = getWCAG2ContrastRatio(darkColor, background);\n  return wLight >= wDark\n    ? {\n        color: {\n          rgba: lightColor,\n          keyword: RGBATupleToString(lightColor),\n        },\n        ratio: wLight,\n        shade: 'light',\n      }\n    : {\n        color: {\n          rgba: darkColor,\n          keyword: RGBATupleToString(darkColor),\n        },\n        ratio: wDark,\n        shade: 'dark',\n      };\n}\n\nfunction getHighContrastColorAPCA(background: RgbTuple, options: ColorContrastOptions = {}): HighContrastResult {\n  const { lightColor, darkColor } = getOptionWithDefaults(options);\n  const wLightText = Math.abs(APCAContrast(background, lightColor));\n  const wDarkText = Math.abs(APCAContrast(background, darkColor));\n\n  return wLightText > wDarkText\n    ? {\n        color: {\n          rgba: lightColor,\n          keyword: RGBATupleToString(lightColor),\n        },\n        ratio: wLightText,\n        shade: 'light',\n      }\n    : {\n        color: {\n          rgba: darkColor,\n          keyword: RGBATupleToString(darkColor),\n        },\n        ratio: wDarkText,\n        shade: 'dark',\n      };\n}\n\nconst HIGH_CONTRAST_FN = {\n  WCAG2: getHighContrastColorWCAG2,\n  WCAG3: getHighContrastColorAPCA,\n};\n\n/** @internal */\nexport interface HighContrastResult {\n  color: ColorDefinition;\n  ratio: number;\n  shade: 'light' | 'dark';\n}\n\n/**\n * Use white or black text depending on the high contrast mode used\n * @internal\n */\nexport function highContrastColor(\n  background: RgbTuple,\n  mode: keyof typeof HIGH_CONTRAST_FN = 'WCAG2',\n  options?: ColorContrastOptions,\n): HighContrastResult {\n  return HIGH_CONTRAST_FN[mode](background, options);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport chroma from 'chroma-js';\n\nimport { Color, Colors } from './colors';\nimport { LRUCache } from './data_structures';\nimport { clamp } from '../utils/common';\nimport { Logger } from '../utils/logger';\n\n/** @public */\nexport type RGB = number;\n\n/** @public */\nexport type A = number;\n\n/** @internal */\nexport type RgbTuple = [r: RGB, g: RGB, b: RGB, alpha?: A];\n\n/** @public */\nexport type RgbaTuple = [r: RGB, g: RGB, b: RGB, alpha: A];\n\n/** @internal */\nexport type OpacityFn = (opacity: number) => number;\n\n/** @internal */\nexport function overrideOpacity([r, g, b, o]: RgbaTuple, opacity?: number | OpacityFn): RgbaTuple {\n  const opacityOverride = opacity === undefined ? o : typeof opacity === 'number' ? opacity : opacity(o);\n\n  // don't apply override on transparent color to avoid unwanted behaviours\n  // todo check if we can apply to every transparent colors\n  if (r === 0 && b === 0 && g === 0 && o === 0) {\n    return Colors.Transparent.rgba;\n  }\n  return [r, g, b, clamp(Number.isFinite(opacityOverride) ? opacityOverride : o, 0, 1)];\n}\n\n/** @internal */\nexport function RGBATupleToString(rgba: RgbTuple): Color {\n  return `rgba(${rgba[0]}, ${rgba[1]}, ${rgba[2]}, ${rgba[3] ?? 1})`;\n}\n\n/** @internal */\nexport function isValid(color: Color): chroma.Color | false {\n  try {\n    // ref https://github.com/gka/chroma.js/issues/280\n    return chroma(color === Colors.Transparent.keyword ? 'rgba(0,0,0,0)' : color);\n  } catch {\n    return false;\n  }\n}\n\n/** @internal */\nexport function getChromaColor(color: string): chroma.Color;\n/** @internal */\nexport function getChromaColor(color: RgbaTuple): chroma.Color;\n/** @internal */\nexport function getChromaColor(color: string | RgbaTuple): chroma.Color {\n  if (typeof color === 'string') return chroma(color.toLowerCase());\n  // chroma mutates the input\n  return chroma(...color);\n}\n\n/** @internal */\nexport function getGreensColorScale(gamma: number, domain: [number, number]): (value: number) => Color {\n  const scale = chroma.scale(chroma.brewer.Greens).gamma(gamma).domain(domain);\n  return (value: number) => scale(value).css();\n}\n\nconst rgbaCache = new LRUCache<Color, RgbaTuple>(200);\n\n/** @internal */\nexport function colorToRgba(color: Color): RgbaTuple {\n  const cachedValue = rgbaCache.get(color);\n  if (cachedValue === undefined) {\n    const chromaColor = isValid(color);\n    if (chromaColor === false) Logger.warn(`The provided color is not a valid CSS color, using RED as fallback`, color);\n    const newValue: RgbaTuple = chromaColor ? chromaColor.rgba() : Colors.Red.rgba;\n    rgbaCache.set(color, newValue);\n    return newValue;\n  }\n  return cachedValue;\n}\n\n/** @internal */\nexport function colorToHsl(color: Color): [h: number, s: number, l: number, a: number] {\n  const [r, g, b, a] = colorToRgba(color);\n  const [h, s, l] = chroma.rgb(r, g, b).hsl(); // alpha not preserved\n  return [h, s, l, a];\n}\n\n/** @internal */\nexport function hslToColor(h: number, s: number, l: number, a = 1): Color {\n  const rgba = chroma.hsl(h, s, l).alpha(a).rgba();\n  return RGBATupleToString(rgba);\n}\n\n/** @internal */\nexport function changeColorLightness(color: Color, lightnessAmount: number, lightnessThreshold: number): Color {\n  const [h, s, l, a] = colorToHsl(color);\n  return hslToColor(h, s, l >= lightnessThreshold ? l - lightnessAmount : l + lightnessAmount, a);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport chroma from 'chroma-js';\n\nimport { RgbaTuple } from './color_library_wrappers';\n\n/**\n * A CSS color keyword or a numerical representation (hex, rgb, rgba, hsl, hsla)\n * @public\n */\nexport type Color = string; // todo static/runtime type it this for proper color string content; several places in the code, and ultimate use, dictate it not be an empty string\n\n/** @internal */\nexport type ColorScale<T = Color> = (value: number) => T;\n\n/** @internal */\nexport type ChromaColorScale = ColorScale<chroma.Color>;\n\n/** @internal */\nexport interface ColorDefinition {\n  keyword: Color;\n  rgba: RgbaTuple;\n}\n\n/** @internal */\nexport const Colors: Record<'Red' | 'White' | 'Black' | 'Transparent' | 'DarkOpaqueRed', ColorDefinition> = {\n  Red: {\n    keyword: 'red',\n    rgba: [255, 0, 0, 1],\n  },\n  DarkOpaqueRed: {\n    keyword: 'red',\n    rgba: [128, 0, 0, 0.5],\n  },\n  White: {\n    keyword: 'white',\n    rgba: [255, 255, 255, 1],\n  },\n  Black: {\n    keyword: 'black',\n    rgba: [0, 0, 0, 1],\n  },\n  Transparent: {\n    keyword: 'transparent',\n    rgba: [0, 0, 0, 0],\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\ninterface PlainConfigItem {\n  type: 'group' | 'color' | 'string' | 'boolean' | 'number';\n  dflt?: any;\n  min?: number;\n  max?: number;\n  reconfigurable?: boolean | string;\n  values?: unknown;\n  documentation?: string;\n}\n\ninterface GroupConfigItem extends PlainConfigItem {\n  type: 'group';\n  values: Record<string, PlainConfigItem>;\n}\n\n// switching to `io-ts` style, generic way of combining static and runtime type info - 1st step\nclass Type<A> {\n  dflt: A;\n\n  reconfigurable: boolean | string;\n\n  documentation: string;\n\n  constructor(dflt: A, reconfigurable: boolean | string, documentation: string) {\n    this.dflt = dflt;\n    this.reconfigurable = reconfigurable;\n    this.documentation = documentation;\n  }\n}\n\n/** @internal */\nexport class Numeric extends Type<number> {\n  min: number;\n\n  max: number;\n\n  type = 'number';\n\n  constructor({\n    dflt,\n    min,\n    max,\n    reconfigurable,\n    documentation,\n  }: {\n    dflt: number;\n    min: number;\n    max: number;\n    reconfigurable: boolean | string;\n    documentation: string;\n  }) {\n    super(dflt, reconfigurable, documentation);\n    this.min = min;\n    this.max = max;\n  }\n}\n\n/** @internal */\nexport type ConfigItem = PlainConfigItem | Numeric;\n\nfunction isGroupConfigItem(item: ConfigItem): item is GroupConfigItem {\n  return item.type === 'group';\n}\n\n/** todo switch to `io-ts` style, generic way of combining static and runtime type info\n * @internal\n */\nexport function configMap<Conf>(mapper: (v: ConfigItem) => unknown, cfgMetadata: Record<string, ConfigItem>): Conf {\n  return Object.assign(\n    {},\n    ...Object.entries(cfgMetadata).map(([k, v]: [string, ConfigItem]) => {\n      if (isGroupConfigItem(v)) {\n        return { [k]: configMap<Conf>(mapper, v.values) };\n      }\n      return { [k]: mapper(v) };\n    }),\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const DEFAULT_CSS_CURSOR = undefined;\n/** @internal */\nexport const TAU = 2 * Math.PI;\n/** @internal */\nexport const RIGHT_ANGLE = TAU / 4;\n/** @internal */\nexport const GOLDEN_RATIO = 1.618;\n\n/** @public */\nexport const TOP = 'top' as const;\n/** @public */\nexport const BOTTOM = 'bottom' as const;\n/** @public */\nexport const LEFT = 'left' as const;\n/** @public */\nexport const RIGHT = 'right' as const;\n/** @public */\nexport const MIDDLE = 'middle' as const;\n/** @public */\nexport const CENTER = 'center' as const;\n\n/** @internal\n * Value used to describe the secondary button (usually the right button) on a `MouseEvent.button`\n */\nexport const SECONDARY_BUTTON = 2;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { clamp } from '../utils/common';\n\n/** @internal */\nexport class LRUCache<K, V> {\n  private readonly max: number;\n  private readonly cache: Map<K, V>;\n  constructor(max = 10) {\n    this.max = clamp(max, 1, Infinity);\n    this.cache = new Map();\n  }\n\n  get(key: K) {\n    const item = this.cache.get(key);\n    if (item) {\n      this.cache.delete(key);\n      this.cache.set(key, item);\n    }\n    return item;\n  }\n\n  set(key: K, val: V) {\n    if (this.cache.has(key)) this.cache.delete(key);\n    else if (this.cache.size === this.max) this.cache.delete(this.first());\n    this.cache.set(key, val);\n  }\n\n  first() {\n    return this.cache.keys().next().value;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const DEFAULT_FONT_FAMILY = 'Inter, BlinkMacSystemFont, Helvetica, Arial, sans-serif';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SeriesIdentifier } from './series_id';\nimport { LayerValue, SettingsSpec, Spec } from '../specs';\nimport { PointerStates } from '../state/chart_state';\nimport { isClicking } from '../state/utils';\n\n// todo revise all the complex branching in this file, replace some `if`s and multiple return points with ternaries\n\n/** @internal */\nexport const getOnElementClickSelector =\n  (prev: { click: PointerStates['lastClick'] }) =>\n  (\n    spec: Spec | null,\n    lastClick: PointerStates['lastClick'],\n    settings: SettingsSpec,\n    pickedShapes: LayerValue[][],\n  ): void => {\n    if (!spec) {\n      return;\n    }\n    if (!settings.onElementClick) {\n      return;\n    }\n    const nextPickedShapesLength = pickedShapes.length;\n    if (nextPickedShapesLength > 0 && isClicking(prev.click, lastClick) && settings && settings.onElementClick) {\n      const elements = pickedShapes.map<[LayerValue[], SeriesIdentifier]>((values) => [\n        values,\n        {\n          specId: spec.id,\n          key: `spec{${spec.id}}`,\n        },\n      ]);\n      settings.onElementClick(elements);\n    }\n    prev.click = lastClick;\n  };\n\n/** @internal */\nexport const getOnElementOutSelector =\n  (prev: { pickedShapes: number | null }) =>\n  (spec: Spec | null, pickedShapes: LayerValue[][], settings: SettingsSpec): void => {\n    if (!spec) {\n      return;\n    }\n    if (!settings.onElementOut) {\n      return;\n    }\n    const nextPickedShapes = pickedShapes.length;\n\n    if (prev.pickedShapes !== null && prev.pickedShapes > 0 && nextPickedShapes === 0) {\n      settings.onElementOut();\n    }\n    prev.pickedShapes = nextPickedShapes;\n  };\n\nfunction isNewPickedShapes(prevPickedShapes: LayerValue[][], nextPickedShapes: LayerValue[][]) {\n  if (nextPickedShapes.length === 0) {\n    return;\n  }\n  if (nextPickedShapes.length !== prevPickedShapes.length) {\n    return true;\n  }\n  return !nextPickedShapes.every((nextPickedShapeValues, index) => {\n    const prevPickedShapeValues = prevPickedShapes[index];\n    if (!prevPickedShapeValues) {\n      return false;\n    }\n    if (prevPickedShapeValues.length !== nextPickedShapeValues.length) {\n      return false;\n    }\n    return nextPickedShapeValues.every((layerValue, i) => {\n      const prevPickedValue = prevPickedShapeValues[i];\n      if (!prevPickedValue) {\n        return false;\n      }\n      return layerValue.value === prevPickedValue.value && layerValue.groupByRollup === prevPickedValue.groupByRollup;\n    });\n  });\n}\n\n/** @internal */\nexport const getOnElementOverSelector =\n  (prev: { pickedShapes: LayerValue[][] }) =>\n  (spec: Spec | null, nextPickedShapes: LayerValue[][], settings: SettingsSpec): void => {\n    if (!spec || !settings.onElementOver) return;\n    if (isNewPickedShapes(prev.pickedShapes, nextPickedShapes)) {\n      const elements = nextPickedShapes.map<[LayerValue[], SeriesIdentifier]>((values) => [\n        values,\n        {\n          specId: spec.id,\n          key: `spec{${spec.id}}`,\n        },\n      ]);\n      settings.onElementOver(elements);\n    }\n    prev.pickedShapes = nextPickedShapes;\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ColorContrastOptions, HighContrastResult, combineColors, highContrastColor } from './color_calcs';\nimport { colorToRgba } from './color_library_wrappers';\nimport { Color, Colors } from './colors';\n\n/**\n * limit used to return fallback color\n * @internal\n */\nexport const TRANSPARENT_LIMIT = 0.6;\n\n/**\n * Determine the text color hinging on the parameters of maximizeColorContrast, foreground and container foreground\n * returns high contrast color blend from fg anf bg when suitable, otherwise returns fallback color\n *\n * @internal\n */\nexport function fillTextColor(\n  fallbackBGColor: Color,\n  foreground: Color | null,\n  background: Color = Colors.Transparent.keyword,\n  options?: ColorContrastOptions,\n): HighContrastResult {\n  let backgroundRGBA = colorToRgba(background);\n\n  if (backgroundRGBA[3] < TRANSPARENT_LIMIT) {\n    backgroundRGBA = colorToRgba(fallbackBGColor);\n  }\n\n  if (foreground) {\n    const foregroundRGBA = colorToRgba(foreground);\n    const blendedFgBg = combineColors(foregroundRGBA, backgroundRGBA);\n    return highContrastColor(blendedFgBg, 'WCAG2', options);\n  }\n\n  return highContrastColor(backgroundRGBA, 'WCAG2', options);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// In preparation of nominal types in future TS versions\n// https://github.com/microsoft/TypeScript/pull/33038\n// eg. to avoid adding angles and coordinates and similar inconsistent number/number ops.\n// could in theory be three-valued (in,on,out)\n// It also serves as documentation.\n\nimport { RIGHT_ANGLE, TAU } from './constants';\n\n/** @public */\nexport type Pixels = number;\n/**\n * A finite number that expresses a ratio\n * @public\n */\nexport type Ratio = number;\n/** @public */\nexport type SizeRatio = Ratio;\n/** @public */\nexport type Cartesian = number;\n/** @internal */\nexport type Coordinate = Cartesian;\n/** @public */\nexport type Radius = Cartesian;\n/** @public */\nexport type Radian = Cartesian; // we measure angle in radians, and there's unity between radians and cartesian distances which is the whole point of radians; this is also relevant as we use small-angle approximations\n/** @public */\nexport type Distance = Cartesian;\n\n/** @internal */\nexport type Degrees = number; // angle degrees\n/** @internal */\nexport interface PointObject {\n  x: Coordinate;\n  y: Coordinate;\n}\n\n/** @internal */\nexport type PointTuple = [Coordinate, Coordinate];\n\n/** @internal */\nexport type PointTuples = [PointTuple, ...PointTuple[]]; // at least one point\n\n/** @internal */\nexport class Circline {\n  x: Coordinate = NaN;\n\n  y: Coordinate = NaN;\n\n  r: Radius = NaN;\n}\n\n/** @internal */\nexport interface CirclinePredicate extends Circline {\n  inside: boolean;\n}\n\n/** @internal */\nexport interface CirclineArc extends Circline {\n  from: Radian;\n  to: Radian;\n}\n\n/** @internal */\ntype CirclinePredicateSet = CirclinePredicate[];\n\n/** @internal */\nexport type RingSectorConstruction = CirclinePredicateSet;\n\n/** @public */\nexport type TimeMs = number;\n\n/** @internal */\nexport function wrapToTau(a: Radian) {\n  if (0 <= a && a <= TAU) return a; // efficient shortcut\n  if (a < 0) a -= TAU * Math.floor(a / TAU);\n  return a > TAU ? a % TAU : a;\n}\n\n/** @internal */\nexport function diffAngle(a: Radian, b: Radian) {\n  return ((a - b + Math.PI + TAU) % TAU) - Math.PI;\n}\n\n/** @internal */\nexport function meanAngle(a: Radian, b: Radian) {\n  return (TAU + b + diffAngle(a, b) / 2) % TAU;\n}\n\n/** @internal */\nexport function trueBearingToStandardPositionAngle(alphaIn: number) {\n  return wrapToTau(RIGHT_ANGLE - alphaIn);\n}\n\n/** @internal */\nexport interface Origin {\n  x0: number;\n  y0: number;\n}\n\n/** @internal */\nexport interface Rectangle extends Origin {\n  x1: number;\n  y1: number;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function mapping<InElem, OutElem>(\n  fun: (arg: InElem /*, index: number*/) => OutElem,\n): (iterable: Iterable<InElem>) => Iterable<OutElem> {\n  return function* (iterable: Iterable<InElem>): Iterable<OutElem> {\n    // let i = 0;\n    for (const next of iterable) yield fun(next /*, i++*/);\n  };\n}\n\n/** @internal */\nexport function doing<InElem>(\n  fun: (arg: InElem /*, index: number*/) => void,\n): (iterable: Iterable<InElem>) => Iterable<never> {\n  return function* (iterable: Iterable<InElem>): Iterable<never> {\n    // let i = 0;\n    for (const next of iterable) fun(next /*, i++*/);\n  };\n}\n\n/** @internal */\nexport function filtering<Elem>(\n  fun: (arg: Elem /*, index: number*/) => boolean,\n): (iterable: Iterable<Elem>) => Iterable<Elem> {\n  return function* (iterable: Iterable<Elem>): Iterable<Elem> {\n    //let i = 0;\n    for (const next of iterable) {\n      if (fun(next /*, i++*/)) yield next;\n    }\n  };\n}\n\n// just like [].map except on iterables, to avoid having to materialize both input and output arrays\n/** @internal */\nexport function map<InElem, OutElem>(\n  iterable: Iterable<InElem>,\n  fun: (arg: InElem /*, index: number*/) => OutElem,\n): Iterable<OutElem> {\n  return mapping(fun)(iterable);\n}\n\n/** @internal */\nexport function filter<Elem>(\n  iterable: Iterable<Elem>,\n  fun: (arg: Elem /*, index: number*/) => boolean,\n): Iterable<Elem> {\n  return filtering(fun)(iterable);\n}\n\n/*\n/!** @internal *!/\nexport function finallyDoing<InElem>(\n  fun: (arg: InElem /!*, index: number*!/) => void,\n): (iterable: Iterable<InElem>) => void {\n  return function (iterable: Iterable<InElem>): void {\n    // let i = 0;\n    for (const next of iterable) fun(next /!*, i++*!/);\n  };\n}\n*/\n\n/** @internal */\nexport function executing(iterable: Iterable<unknown>): void {\n  const iterator = iterable[Symbol.iterator]();\n  while (!iterator.next().done) {}\n}\n\n/** @internal */\nexport function pipeline<In>(arg: In): In;\n\n/** @internal */\nexport function pipeline<In, Out>(arg: In, f1: (x: In) => Out): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Out>(arg: In, f1: (x: In) => Mid1, f2: (x: Mid1) => Out): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Mid2, Out>(\n  arg: In,\n  f1: (x: In) => Mid1,\n  f2: (x: Mid1) => Mid2,\n  f3: (x: Mid2) => Out,\n): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Mid2, Mid3, Out>(\n  arg: In,\n  f1: (x: In) => Mid1,\n  f2: (x: Mid1) => Mid2,\n  f3: (x: Mid2) => Mid3,\n  f4: (x: Mid3) => Out,\n): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Mid2, Mid3, Mid4, Out>(\n  arg: In,\n  f1: (x: In) => Mid1,\n  f2: (x: Mid1) => Mid2,\n  f3: (x: Mid2) => Mid3,\n  f4: (x: Mid3) => Mid4,\n  f5: (x: Mid4) => Out,\n): Out;\n\n/** @internal */\nexport function pipeline<In, Mid1, Mid2, Mid3, Mid4, Mid5, Out>(\n  arg: In,\n  f1: (x: In) => Mid1,\n  f2: (x: Mid1) => Mid2,\n  f3: (x: Mid2) => Mid3,\n  f4: (x: Mid3) => Mid4,\n  f5: (x: Mid4) => Mid5,\n  f6: (x: Mid5) => Out,\n): Out;\n\n/** @internal */\nexport function pipeline(arg: unknown, ...functions: Array<(x: unknown) => unknown>) {\n  return functions.reduce((iterator, fun) => fun(iterator), arg);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GL } from './webgl_constants';\nimport { Logger } from '../utils/logger';\n\nconst GL_DEBUG = true; // to be set to false once GL charts are in non-alpha and broad use for 6-12 months or earlier if perf constrained\n\n/**************\n * Types\n *************/\n\n// there are two shader types\ntype ShaderType = typeof GL.FRAGMENT_SHADER | typeof GL.VERTEX_SHADER;\n\n// a data structure that maps each uniform name (string) to a value setter for that uniform\ntype UniformsMap = Map<string, (...args: any[]) => void>;\n\n// we can use a frame buffer (the Canvas itself, or a texture) for reading, writing or both\ntype FrameBufferTarget = typeof GL.READ_FRAMEBUFFER | typeof GL.DRAW_FRAMEBUFFER | typeof GL.FRAMEBUFFER;\n\n// samplers (texture samplers) act as uniforms; `setUniform` sets the desired texture for the shader code to read (sample) from\ninterface Sampler {\n  setUniform: (location: WebGLUniformLocation) => void;\n}\n\n/**\n * Clearing can be constrained to a rectangle; not just the color buffer but the depth buffer may also be cleared\n * One role of the depth buffer (z-buffer) is to keep track of the Z coordinate closest to the viewer for each pixel on the screen\n * as it can be used to reject future pixel (fragment) shading that would be beneath this and would be invisible anyway\n * The stencil buffer may also be cleared simultaneously https://en.wikipedia.org/wiki/Stencil_buffer\n */\ninterface ClearInfo {\n  rect?: [number, number, number, number];\n  color?: [number, number, number, number];\n  depth?: number;\n  stencilIndex?: number;\n}\n\n// A tuple of texture data for functions like `gl.texImage2D` and `gl.texParameteri` - metadata of a texture\ninterface TextureSpecification {\n  textureIndex: GLuint; // used for identifying the specific texture in a `gl.activeTexture` setter call\n  internalFormat: GLuint; // colors and bits per color https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texImage2D\n  width: GLuint; // texture width in pixels\n  height: GLuint; // texture height in pixels\n  data: ArrayBufferView | null; // the buffer containing the actual pixel grid\n  min?: GLuint; // when using texture for data lookup, we usually want the nearest exact value, rather than interpolated or aggregated\n  mag?: GLuint; // when using texture for data lookup, we usually want the nearest exact value, rather than interpolated or aggregated\n}\n\n/** @internal */\nexport interface Texture {\n  clear: () => void;\n  setUniform: (location: WebGLUniformLocation) => void;\n  target: () => WebGLFramebuffer | null;\n  delete: () => void;\n  width: number;\n  height: number;\n}\n\n/** @internal */\nexport interface UseInfo {\n  uniformValues: any;\n  viewport: { x: number; y: number; width: number; height: number };\n  target: WebGLFramebuffer | null;\n  clear?: ClearInfo;\n  scissor?: [number, number, number, number];\n  draw?: { geom: GLuint; offset: GLuint; count: GLuint; instanceCount?: GLuint };\n}\n\n/** @internal */\nexport type Attributes = Map<string, (data: ArrayBufferView) => void>;\n\n/** @internal */\nexport type Render = (u: UseInfo) => void;\n\n/****************\n * Minimize calls\n *\n * these can be, and should be global like this\n * still doesn't cause memory leak due to weak keys\n *\n ***************/\n\nconst currentPrograms = new WeakMap();\nconst currentVertexArrayObjects = new WeakMap();\nconst currentDepthTests = new WeakMap();\nconst currentReadFrameBuffers = new WeakMap();\nconst currentDrawFrameBuffers = new WeakMap();\nconst currentViewport = new WeakMap();\nconst currentScissor = new WeakMap();\nconst currentClearColor = new WeakMap();\nconst currentClearDepth = new WeakMap();\nconst currentFlags = new WeakMap();\nconst programUniforms = new WeakMap();\nconst locationUniformValues = new WeakMap(); // not sure if this saves significant time; hit rate is high though\nconst setGlobalConstants = new WeakSet();\n\n/** @internal */\nexport const resetState = (gl: WebGL2RenderingContext) => {\n  // all the gl keyed stores need to be erased; other dependent keys go away on their own\n  currentPrograms.delete(gl);\n  currentVertexArrayObjects.delete(gl);\n  currentDepthTests.delete(gl);\n  currentReadFrameBuffers.delete(gl);\n  currentDrawFrameBuffers.delete(gl);\n  currentViewport.delete(gl);\n  currentScissor.delete(gl);\n  currentClearColor.delete(gl);\n  currentClearDepth.delete(gl);\n  currentFlags.delete(gl);\n  setGlobalConstants.delete(gl);\n};\n\nconst setViewport = (gl: WebGL2RenderingContext, ...xyWidthHeight: [number, number, number, number]) => {\n  const key = xyWidthHeight.join('|');\n  if (currentViewport.get(gl) !== key) {\n    gl.viewport(...xyWidthHeight);\n    currentViewport.set(gl, key);\n  }\n};\n\nconst setScissor = (gl: WebGL2RenderingContext, ...xyWidthHeight: [number, number, number, number]) => {\n  const key = xyWidthHeight.join('|');\n  if (currentScissor.get(gl) !== key) {\n    gl.scissor(...xyWidthHeight);\n    currentScissor.set(gl, key);\n  }\n};\n\nconst clearColor = (gl: WebGL2RenderingContext, ...rgba: [number, number, number, number]) => {\n  const key = rgba.join('|');\n  if (currentClearColor.get(gl) !== key) {\n    gl.clearColor(...rgba);\n    currentClearColor.set(gl, key);\n  }\n};\n\nconst clearDepth = (gl: WebGL2RenderingContext, depth: number) => {\n  if (currentClearDepth.get(gl) !== depth) {\n    gl.clearDepth(depth);\n    currentClearDepth.set(gl, depth);\n  }\n};\n\nconst flagSet = (gl: WebGL2RenderingContext, key: number, value: boolean) => {\n  const flags = currentFlags.get(gl);\n  if (flags[key] !== value) {\n    if (value) {\n      gl.enable(key);\n    } else {\n      gl.disable(key);\n    }\n    flags[key] = value;\n  }\n};\n\n/****************\n * Programs\n ***************/\n\n/** @internal */\nexport const createCompiledShader = (\n  gl: WebGL2RenderingContext,\n  shaderType: ShaderType,\n  source: string,\n): WebGLShader => {\n  const shader = gl.createShader(shaderType);\n  if (!shader) throw new Error(`kinGLy exception: shader could not be created`); // just appeasing the TS linter\n  gl.shaderSource(shader, source);\n  gl.compileShader(shader);\n  if (GL_DEBUG && !gl.getShaderParameter(shader, GL.COMPILE_STATUS) && !gl.isContextLost()) {\n    const shaderTypeName = shaderType === GL.VERTEX_SHADER ? 'vertex' : 'fragment';\n    Logger.warn(`kinGLy exception: compilation error in a ${shaderTypeName} shader: ${gl.getShaderInfoLog(shader)}`);\n  }\n  return shader;\n};\n\n/** @internal */\nexport const createLinkedProgram = (\n  gl: WebGL2RenderingContext,\n  vertexShader: WebGLShader,\n  fragmentShader: WebGLShader,\n  attributeLocations: Record<string, number>,\n): WebGLProgram => {\n  const program = gl.createProgram();\n  if (!program) throw new Error(`kinGLy exception: shader program could not be created`); // just appeasing the TS linter https://www.khronos.org/webgl/wiki/HandlingContextLost\n  gl.attachShader(program, vertexShader);\n  gl.attachShader(program, fragmentShader);\n  if (GL_DEBUG && gl.getProgramParameter(program, GL.ATTACHED_SHADERS) !== 2)\n    Logger.warn('kinGLy exception: did not manage to attach the two shaders');\n\n  Object.entries(attributeLocations).forEach(([name, i]) => gl.bindAttribLocation(program, i, name));\n\n  gl.linkProgram(program); // todo consider bulk gl.compileShader iteration, followed by bulk gl.linkProgram iteration https://www.khronos.org/registry/webgl/extensions/KHR_parallel_shader_compile/\n\n  if (GL_DEBUG) {\n    if (!gl.getProgramParameter(program, GL.LINK_STATUS) && !gl.isContextLost())\n      Logger.warn(`kinGLy exception: shader program failed to link: ${gl.getProgramInfoLog(program)}`);\n    gl.validateProgram(program);\n    if (!gl.getProgramParameter(program, GL.LINK_STATUS) && !gl.isContextLost())\n      Logger.warn(`kinGLy exception: could not validate the shader program: ${gl.getProgramInfoLog(program)}`);\n  } else {\n    // no rush with the deletion; avoid adding workload to the synchronous preparation\n    window.setTimeout(() => {\n      gl.detachShader(program, vertexShader);\n      gl.detachShader(program, fragmentShader);\n      gl.deleteShader(vertexShader);\n      gl.deleteShader(fragmentShader);\n    });\n  }\n\n  return program;\n};\n\n/*********************\n * Singular uniforms\n ********************/\n\nconst uniformSetterLookup = {\n  [GL.BOOL]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (value: GLuint) => {\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform1ui(location, value);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.INT]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (value: GLint) => {\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform1i(location, value);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT_VEC2]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (values: Float32List) => {\n    const value = values.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform2fv(location, values);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT_VEC3]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (values: Float32List) => {\n    const value = values.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform3fv(location, values);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.INT_VEC2]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (values: Int32List) => {\n    const value = values.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform2iv(location, values);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (value: GLfloat) => {\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniform1f(location, value);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT_MAT2]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (array: Float32List) => {\n    const value = array.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniformMatrix2fv(location, false, array);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.FLOAT_MAT4]: (gl: WebGL2RenderingContext, location: WebGLUniformLocation) => (array: Float32List) => {\n    const value = array.join('|');\n    if (locationUniformValues.get(location) !== value) {\n      gl.uniformMatrix4fv(location, false, array);\n      locationUniformValues.set(location, value);\n    }\n  },\n  [GL.SAMPLER_2D]:\n    (gl: WebGL2RenderingContext, location: WebGLUniformLocation) =>\n    ({ setUniform }: Sampler) => {\n      if (locationUniformValues.get(location) !== setUniform) {\n        setUniform(location);\n        locationUniformValues.set(location, setUniform);\n      }\n    },\n};\n\nconst getUniforms = (gl: WebGL2RenderingContext, program: WebGLProgram): UniformsMap => {\n  if (programUniforms.has(program)) return programUniforms.get(program);\n  const uniforms = new Map(\n    [...new Array(gl.getProgramParameter(program, GL.ACTIVE_UNIFORMS /* uniform count */))].flatMap((_, index) => {\n      const activeUniform = gl.getActiveUniform(program, index);\n      if (!activeUniform) {\n        Logger.warn(`kinGLy exception: active uniform not found`);\n        return [];\n      }\n      const { name, type } = activeUniform;\n      const location = gl.getUniformLocation(program, name);\n      if (location === null) {\n        Logger.warn(`kinGLy exception: uniform location ${location} (name: ${name}, type: ${type}) not found`); // just appeasing the TS linter\n        return [];\n      }\n      const setValue = location ? uniformSetterLookup[type]?.(gl, location) : () => {};\n\n      if (!setValue) {\n        Logger.warn(`kinGLy exception: no setValue for uniform GL[${type}] (name: ${name}) implemented yet`);\n        return [];\n      }\n\n      return [[name, setValue]];\n    }),\n  );\n  programUniforms.set(program, uniforms);\n  return uniforms;\n};\n\n/**************\n * Clearing\n *\n * Clears the color, depth and/or stencil index of the canvas or a rectangular area\n * @internal\n *************/\nexport const clearRect = (gl: WebGL2RenderingContext, { rect, color, depth, stencilIndex }: ClearInfo) => {\n  // constrain clearing to a rectangle if needed\n  if (rect) {\n    flagSet(gl, GL.SCISSOR_TEST, true); // allow operation in a specific rectangle\n    setScissor(gl, ...rect); // only operate in this rectangle\n  }\n\n  let flags = 0;\n  if (color) {\n    clearColor(gl, ...color); // set the color for clearing\n    flags |= GL.COLOR_BUFFER_BIT; // include color in the clearing task\n  }\n  if (typeof depth === 'number') {\n    clearDepth(gl, depth); // set the depth for clearing\n    flags |= GL.DEPTH_BUFFER_BIT; // include depth in the clearing task\n  }\n  if (typeof stencilIndex === 'number') {\n    gl.clearStencil(stencilIndex); // set the depth for clearing\n    flags |= GL.STENCIL_BUFFER_BIT; // include stencil in the clearing task\n  }\n\n  // actual clearing\n  gl.clear(flags); // actually do the clearing with the above color, depth and/or stencil index\n};\n\n/****************\n * Textures\n ***************/\n\n// todo add more\nconst textureSrcFormatLookup = {\n  [GL.RGBA8]: GL.RGBA,\n  [GL.RGBA32F]: GL.RGBA,\n};\n\n// todo add more\nconst textureTypeLookup = {\n  [GL.RGBA8]: GL.UNSIGNED_BYTE,\n  [GL.RGBA32F]: GL.FLOAT,\n};\n\n/** @internal */\nexport const bindFramebuffer = (\n  gl: WebGL2RenderingContext,\n  target: FrameBufferTarget,\n  targetFrameBuffer: WebGLFramebuffer | null,\n) => {\n  const updateReadTarget =\n    (target === GL.READ_FRAMEBUFFER || target === GL.FRAMEBUFFER) &&\n    targetFrameBuffer !== currentReadFrameBuffers.get(gl);\n  const updateWriteTarget =\n    (target === GL.DRAW_FRAMEBUFFER || target === GL.FRAMEBUFFER) &&\n    targetFrameBuffer !== currentDrawFrameBuffers.get(gl);\n\n  if (updateReadTarget) currentReadFrameBuffers.set(gl, targetFrameBuffer);\n  if (updateWriteTarget) currentDrawFrameBuffers.set(gl, targetFrameBuffer);\n\n  if (updateReadTarget || updateWriteTarget) {\n    const targetToUpdate =\n      updateReadTarget && updateWriteTarget\n        ? GL.FRAMEBUFFER\n        : updateReadTarget\n          ? GL.READ_FRAMEBUFFER\n          : GL.DRAW_FRAMEBUFFER;\n    gl.bindFramebuffer(targetToUpdate, targetFrameBuffer);\n  }\n};\n\n/** @internal */\nexport const NullTexture: Texture = {\n  clear: () => {},\n  setUniform: () => {},\n  target: () => null,\n  delete: () => {},\n  width: 0,\n  height: 0,\n};\n\n/** @internal */\nexport const createTexture = (\n  gl: WebGL2RenderingContext,\n  { textureIndex, internalFormat, width, height, data, min = GL.NEAREST, mag = GL.NEAREST }: TextureSpecification,\n): Texture => {\n  if (GL_DEBUG && !(0 <= textureIndex && textureIndex <= gl.getParameter(GL.MAX_COMBINED_TEXTURE_IMAGE_UNITS)))\n    Logger.warn(\n      'kinGLy exception: WebGL2 is guaranteed to support at least 32 textures but not necessarily more than that',\n    );\n\n  const srcFormat = textureSrcFormatLookup[internalFormat] ?? NaN;\n  const type = textureTypeLookup[internalFormat] ?? NaN;\n  const texture = gl.createTexture();\n\n  const setTextureContents = () => {\n    gl.activeTexture(GL.TEXTURE0 + textureIndex); // this causes that the `gl.texParameteri`, relying on the notion of \"active texture\", applies to the texture\n    gl.bindTexture(GL.TEXTURE_2D, texture); // this causes that the below `gl.activeTexture` knows which texture we associate to the textureIndex\n    gl.texImage2D(GL.TEXTURE_2D, 0, internalFormat, width, height, 0, srcFormat, type, data); // setting `data` and some other props on the texture\n  };\n\n  setTextureContents();\n\n  // for precise texture pixel reading, even the use of `texelFetch` requires that these be set to `nearest`\n  // also when using float textures, a mandatory part of WebGL2, are not texture filterable by default (without possibly unavailable extensions)\n  gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_MIN_FILTER, min);\n  gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_MAG_FILTER, mag);\n  gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_WRAP_S, GL.CLAMP_TO_EDGE);\n  gl.texParameteri(GL.TEXTURE_2D, GL.TEXTURE_WRAP_T, GL.CLAMP_TO_EDGE);\n\n  if (GL_DEBUG) {\n    const error = gl.getError(); // todo add getErrors to more places\n    if (error !== gl.NO_ERROR && error !== gl.CONTEXT_LOST_WEBGL)\n      Logger.warn(`kinGLy exception: failed to set the texture with texImage2D, code ${error}`);\n  }\n\n  let frameBuffer: WebGLFramebuffer | null = null; // caching the target framebuffer\n\n  const getTarget = () => {\n    if (!frameBuffer) {\n      frameBuffer = gl.createFramebuffer();\n      bindFramebuffer(gl, GL.DRAW_FRAMEBUFFER, frameBuffer);\n      gl.framebufferTexture2D(GL.FRAMEBUFFER, GL.COLOR_ATTACHMENT0, GL.TEXTURE_2D, texture, 0);\n      if (GL_DEBUG) {\n        const framebufferStatus = gl.checkFramebufferStatus(GL.DRAW_FRAMEBUFFER);\n        if (framebufferStatus !== GL.FRAMEBUFFER_COMPLETE) {\n          Logger.warn(`kinGLy exception: target framebuffer is not complete`);\n        }\n      }\n    }\n    return frameBuffer;\n  };\n\n  return {\n    clear: () => {\n      bindFramebuffer(gl, GL.DRAW_FRAMEBUFFER, getTarget());\n      clearRect(gl, { color: [0, 0, 0, 0] }); // alternatives: texImage2D/texSubImage2D/render\n    },\n    setUniform: (location: WebGLUniformLocation) => gl.uniform1i(location, textureIndex),\n    target: getTarget,\n    delete: (): true => {\n      if (frameBuffer) {\n        if (currentReadFrameBuffers.get(gl) === frameBuffer) bindFramebuffer(gl, GL.READ_FRAMEBUFFER, null);\n        if (currentDrawFrameBuffers.get(gl) === frameBuffer) bindFramebuffer(gl, GL.DRAW_FRAMEBUFFER, null);\n        gl.deleteFramebuffer(frameBuffer);\n      }\n      gl.deleteTexture(texture);\n      return true; // success\n    },\n    width,\n    height,\n  };\n};\n\nconst pickPixel = new Uint8Array(4);\n\n/** @internal */\nexport const readPixel = (gl: WebGL2RenderingContext, canvasX: GLint, canvasY: GLint) => {\n  gl.readPixels(canvasX, canvasY, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pickPixel); // todo use bound FB/texture values to determine the 5th and 6th args\n  return pickPixel;\n};\n\n/****************\n * Attributes\n ***************/\n\n// todo extend these with other attrib types, though we only ever use vec4 atm\nconst attribSizeLookup = { [GL.FLOAT_VEC2]: 2, [GL.FLOAT_VEC4]: 4, [GL.FLOAT]: 1, [GL.INT]: 1 };\nconst attribElementTypeLookup = {\n  [GL.FLOAT_VEC2]: GL.FLOAT,\n  [GL.FLOAT_VEC4]: GL.FLOAT,\n  [GL.FLOAT]: GL.FLOAT,\n  [GL.INT]: GL.INT,\n};\n\nconst integerTypes = new Set([GL.BYTE, GL.SHORT, GL.INT, GL.UNSIGNED_BYTE, GL.UNSIGNED_SHORT, GL.UNSIGNED_INT]);\n\n/** @internal */\nexport const getAttributes = (\n  gl: WebGL2RenderingContext,\n  program: WebGLProgram,\n  attributeLocations: Record<string, GLuint>,\n): Attributes =>\n  new Map(\n    [...new Array(gl.getProgramParameter(program, GL.ACTIVE_ATTRIBUTES) /* attributesCount */)].map((_, index) => {\n      const normalize = false; // don't normalize the data\n      const stride = 0; // default 0 = move forward size * sizeof(type) each iteration to get the next position\n      const offset = 0; // start at the beginning of the buffer\n\n      const activeAttribInfo = gl.getActiveAttrib(program, index);\n      if (!activeAttribInfo) throw new Error(`kinGLy exception: active attribute info could not be read`); // just appeasing the TS linter\n      const { name, type } = activeAttribInfo;\n      if (name.startsWith('gl_')) return [name, () => {}]; // only populate expressly supplied attributes, NOT gl_VertexID or gl_InstanceID\n\n      const location = attributeLocations[name] ?? NaN;\n      const buffer = gl.createBuffer();\n      gl.bindBuffer(GL.ARRAY_BUFFER, buffer);\n      gl.enableVertexAttribArray(location);\n      const attribSize = attribSizeLookup[type] ?? NaN;\n      const attribElementType = attribElementTypeLookup[type] ?? NaN;\n      if (GL_DEBUG && (attribSize === undefined || attribElementType === undefined))\n        throw new Error(`Attribute type ${type} is not yet properly covered`);\n      if (integerTypes.has(attribElementType)) {\n        gl.vertexAttribIPointer(location, attribSize, GL.INT, stride, offset);\n      } else {\n        gl.vertexAttribPointer(location, attribSize, GL.FLOAT, normalize, stride, offset);\n      }\n\n      const setValue = (data: ArrayBufferView) => {\n        gl.bindBuffer(GL.ARRAY_BUFFER, buffer);\n        gl.bufferData(GL.ARRAY_BUFFER, data, GL.STATIC_DRAW);\n      };\n\n      return [name, setValue];\n    }),\n  );\n\n/** @internal */\nexport const bindVertexArray = (gl: WebGL2RenderingContext, vertexArrayObject: WebGLVertexArrayObject | null) => {\n  if (vertexArrayObject !== currentVertexArrayObjects.get(gl)) {\n    currentVertexArrayObjects.set(gl, vertexArrayObject);\n    gl.bindVertexArray(vertexArrayObject);\n  }\n};\n\n/****************\n * Rendering\n ***************/\n\n/**\n * Ensures that the draw calls will operate under the desired state (context flags, bound attribs)\n * @internal\n */\nexport const getRenderer = (\n  gl: WebGL2RenderingContext,\n  program: WebGLProgram,\n  vao: WebGLVertexArrayObject | null,\n  { depthTest = false, blend = true, frontFace = GL.CCW },\n): Render => {\n  const uniforms = getUniforms(gl, program);\n  return ({ uniformValues, viewport, target, clear, scissor, draw }: UseInfo): void => {\n    if (!setGlobalConstants.has(gl)) {\n      setGlobalConstants.add(gl);\n      currentFlags.set(gl, { [GL.DITHER]: true }); // upon context initialization, only the dither flag is enabled by WebGL\n      // blending controls how semitransparent pixels compose with previously painted pixels; it's the \"normal\" CSS default like blending, can be tweaked like in CSS\n      gl.blendFuncSeparate(GL.SRC_ALPHA, GL.ONE_MINUS_SRC_ALPHA, 1, 1);\n      gl.blendEquation(GL.FUNC_ADD);\n\n      // dither off means, don't slow down and alter colors for an illusion of a broader palette (the only GL state variable that's ON by default)\n      flagSet(gl, GL.DITHER, false);\n\n      // depth defaults for when GL.DEPTH_TEST is enabled\n      gl.depthMask(true);\n      gl.depthFunc(GL.LESS);\n      gl.depthRange(0, 1);\n\n      // set polygon vertex order convention\n      gl.frontFace(frontFace);\n\n      // don't render both sides of a triangle (it's dependent on the cw/ccw convention set above)\n      flagSet(gl, GL.CULL_FACE, true);\n      gl.cullFace(GL.BACK);\n\n      // hints\n      gl.hint(GL.FRAGMENT_SHADER_DERIVATIVE_HINT, GL.NICEST); // doesn't seem to make a difference on OS X\n    }\n\n    // depth test means that pixels from a triangle do not paint over preexisting pixels coming from triangles that are closer to the viewer\n    if (depthTest !== currentDepthTests.get(gl)) {\n      currentDepthTests.set(gl, depthTest);\n      flagSet(gl, GL.DEPTH_TEST, depthTest);\n    }\n\n    flagSet(gl, GL.BLEND, blend);\n\n    if (program !== currentPrograms.get(gl)) {\n      currentPrograms.set(gl, program);\n      gl.useProgram(program);\n    }\n\n    if (vao) bindVertexArray(gl, vao);\n\n    if (viewport) setViewport(gl, viewport.x, viewport.y, viewport.width, viewport.height);\n    if (uniformValues) {\n      uniforms.forEach((setValue, name) => uniformValues[name] && setValue(uniformValues[name]));\n    }\n\n    bindFramebuffer(gl, GL.DRAW_FRAMEBUFFER, target);\n\n    if (clear) clearRect(gl, clear);\n\n    if (draw) {\n      // constrain clearing to a rectangle if needed\n      flagSet(gl, GL.SCISSOR_TEST, scissor !== undefined); // allow operation in a specific rectangular area\n      if (scissor) {\n        setScissor(gl, ...scissor); // only operate in this rectangle\n      }\n\n      gl.drawArraysInstanced(draw.geom, draw.offset, draw.count, draw.instanceCount || 1);\n    }\n  };\n};\n\n/***********************\n *\n * Handle context loss\n *\n **********************/\n\n/*\nconst flushErrors = (gl: WebGL2RenderingContext, text: string) => {\n  let hasError;\n  let hasShownError = false;\n  do {\n    const error = gl.getError();\n    hasError = error !== gl.NO_ERROR && error !== gl.CONTEXT_LOST_WEBGL;\n    if (hasError) {\n      if (!hasShownError) {\n        // eslint-disable-next-line no-console\n        console.warn(`GL error(s) shown before ${text}`);\n        hasShownError = true;\n      }\n      // eslint-disable-next-line no-console\n      console.warn(`GL error: ${error}`);\n    }\n  } while (hasError); // clear the error code\n};\n*/\n\n/** @internal */\nexport const testContextLoss = (gl: WebGL2RenderingContext) => {\n  // simulates a context loss at `lossTimeMs` and context recovery at `regainTimeMs` after that\n  const lossTimeMs = 5000;\n  const regainTimeMs = 0;\n  const ext = gl.getExtension('WEBGL_lose_context');\n  if (ext) {\n    window.setInterval(() => {\n      // eslint-disable-next-line no-console\n      console.log('Context loss test triggered, the webgl rendering will freeze or disappear');\n      ext.loseContext();\n      window.setTimeout(() => ext.restoreContext(), regainTimeMs);\n    }, lossTimeMs);\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function logarithm(base: number, y: number) {\n  return Math.log(y) / Math.log(base);\n}\n\n/**\n * Computes the min and max values of an array of numbers\n * @internal\n */\nexport function extent(array: number[]): [min: number, max: number] {\n  const len = array.length;\n  let min = Infinity;\n  let max = -Infinity;\n  for (let i = 0; i < len; i += 1) {\n    const value = array[i] ?? NaN;\n    if (min > value) min = value;\n    if (max < value) max = value;\n  }\n  return [min, max];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { ScaleBand } from '../scales';\nimport { GroupBySpec } from '../specs/group_by';\nimport { safeFormat } from '../utils/common';\nimport { Dimensions, Size } from '../utils/dimensions';\nimport { OrdinalDomain } from '../utils/domain';\nimport { Point } from '../utils/point';\n\ntype Value = string | number;\n\n/** @internal */\nexport interface PerPanelMap {\n  panelAnchor: Point;\n  horizontalValue: NonNullable<PrimitiveValue>;\n  verticalValue: NonNullable<PrimitiveValue>;\n}\n\n/** @internal */\nexport interface SmallMultipleScales {\n  horizontal: ScaleBand;\n  vertical: ScaleBand;\n}\n\n/** @internal */\nexport interface SmallMultiplesGroupBy {\n  vertical?: GroupBySpec;\n  horizontal?: GroupBySpec;\n}\n\n/** @internal */\nexport interface SmallMultiplesSeriesDomains {\n  smVDomain: OrdinalDomain;\n  smHDomain: OrdinalDomain;\n}\n\n/** @public */\nexport interface SmallMultiplesDatum {\n  smHorizontalAccessorValue?: NonNullable<PrimitiveValue>;\n  smVerticalAccessorValue?: NonNullable<PrimitiveValue>;\n}\n\n/** @internal */\nexport function getPerPanelMap<T>(\n  scales: SmallMultipleScales,\n  fn: (anchor: Point, horizontalValue: Value, verticalValue: Value, smScales: SmallMultipleScales) => T | null,\n): Array<T & PerPanelMap> {\n  const { horizontal, vertical } = scales;\n  return vertical.domain.reduce<Array<T & PerPanelMap>>((acc, verticalValue) => {\n    return [\n      ...acc,\n      ...horizontal.domain.reduce<Array<T & PerPanelMap>>((hAcc, horizontalValue) => {\n        const panelAnchor: Point = {\n          x: horizontal.scale(horizontalValue) || 0,\n          y: vertical.scale(verticalValue) || 0,\n        };\n        const fnReturn = fn(panelAnchor, horizontalValue, verticalValue, scales);\n        return fnReturn ? [...hAcc, { panelAnchor, horizontalValue, verticalValue, ...fnReturn }] : hAcc;\n      }, []),\n    ];\n  }, []);\n}\n\n/** @internal */\nexport function getPanelSize({ horizontal, vertical }: SmallMultipleScales): Size {\n  return { width: horizontal.bandwidth, height: vertical.bandwidth };\n}\n\n/**\n * returns true for scales with empty input domains\n * TODO: Cleanup See https://github.com/elastic/elastic-charts/issues/1990\n * @internal\n */\nexport const hasSMDomain = ({ domain }: SmallMultipleScales['horizontal'] | SmallMultipleScales['vertical']) =>\n  domain.length > 0 && domain[0] !== undefined;\n\n/** @internal */\nexport const getPanelTitle = (\n  isVertical: boolean,\n  verticalValue: NonNullable<PrimitiveValue>,\n  horizontalValue: NonNullable<PrimitiveValue>,\n  groupBy?: SmallMultiplesGroupBy,\n): string => {\n  return isVertical\n    ? safeFormat(`${verticalValue}`, groupBy?.vertical?.format)\n    : safeFormat(`${horizontalValue}`, groupBy?.horizontal?.format);\n};\n\n/**\n * Returns true if pointer is within a panel inside the chart area, otherwise false\n * Returns false when pointer is in the padding gutter and axes\n * @internal\n */\nexport const isPointerOverPanelFn =\n  (smScales: SmallMultipleScales, chartDimensions: Dimensions, gridStroke: number) =>\n  (pointer: Point): boolean => {\n    return (\n      isPointerInsideChart(chartDimensions)(pointer) &&\n      isPointerInBandwidth(smScales.horizontal, pointer.x - chartDimensions.left, gridStroke) &&\n      isPointerInBandwidth(smScales.vertical, pointer.y - chartDimensions.top, gridStroke)\n    );\n  };\n\nfunction isPointerInBandwidth(\n  scale: SmallMultipleScales['horizontal'] | SmallMultipleScales['vertical'],\n  dimension: number,\n  gridStroke: number,\n): boolean {\n  const { bandwidth, innerPadding } = scale;\n  const padding = innerPadding * bandwidth;\n  const divisor = bandwidth + padding + gridStroke * 2;\n  const vDiv = Math.floor(dimension / divisor);\n  const lower = vDiv * divisor;\n  const upper = lower + bandwidth + gridStroke * 2;\n\n  return dimension > lower && dimension <= upper;\n}\n\n/**\n * Returns true if the pointer is within the chart dimensions, false otherwise\n * @internal\n */\nexport const isPointerInsideChart =\n  ({ left, top, height, width }: Dimensions) =>\n  ({ x, y }: Point): boolean =>\n    x > left && x < left + width && y > top && y < top + height;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const Predicate = Object.freeze({\n  NumAsc: 'numAsc' as const,\n  NumDesc: 'numDesc' as const,\n  AlphaAsc: 'alphaAsc' as const,\n  AlphaDesc: 'alphaDesc' as const,\n  DataIndex: 'dataIndex' as const,\n});\n\n/** @public */\nexport type Predicate = $Values<typeof Predicate>;\n\n/** @internal */\nexport function getPredicateFn<T>(predicate: Predicate, locale: string, accessor?: keyof T): (a: T, b: T) => number {\n  switch (predicate) {\n    case 'alphaAsc':\n      return (a: T, b: T) => {\n        const aValue = String(accessor ? a[accessor] : a);\n        const bValue = String(accessor ? b[accessor] : b);\n        return aValue.localeCompare(bValue, locale);\n      };\n    case 'alphaDesc':\n      return (a: T, b: T) => {\n        const aValue = String(accessor ? a[accessor] : a);\n        const bValue = String(accessor ? b[accessor] : b);\n        return bValue.localeCompare(aValue, locale);\n      };\n    case 'numDesc':\n      return (a: T, b: T) => {\n        const aValue = Number(accessor ? a[accessor] : a);\n        const bValue = Number(accessor ? b[accessor] : b);\n        return bValue - aValue;\n      };\n    case 'numAsc':\n      return (a: T, b: T) => {\n        const aValue = Number(accessor ? a[accessor] : a);\n        const bValue = Number(accessor ? b[accessor] : b);\n        return aValue - bValue;\n      };\n    case 'dataIndex':\n      return () => 0;\n  }\n}\n\n/** @internal */\nexport const hasKey = <T extends Record<string, unknown>>(obj: T, key: string): key is string & keyof T =>\n  obj.hasOwnProperty(key);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CategoryKey } from './category';\nimport { SpecId } from '../utils/ids';\n\n/**\n * A string key used to uniquely identify a series\n * @public\n */\nexport type SeriesKey = CategoryKey;\n\n/**\n * A series identifier\n * @public\n */\nexport type SeriesIdentifier = {\n  /**\n   * The SpecId, used to identify the spec\n   */\n  specId: SpecId;\n  /**\n   * A string key used to uniquely identify a series\n   */\n  key: SeriesKey;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values as Values } from 'utility-types';\n\nimport { Color } from './colors';\nimport { Pixels, Rectangle } from './geometry';\nimport { ArrayEntry } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { integerSnap, monotonicHillClimb } from '../solvers/monotonic_hill_climb';\nimport { TextMeasure } from '../utils/bbox/canvas_text_bbox_calculator';\nimport { Datum } from '../utils/common';\n\nconst FONT_WEIGHTS_NUMERIC = [100, 200, 300, 400, 500, 600, 700, 800, 900];\nconst FONT_WEIGHTS_ALPHA = ['normal', 'bold', 'lighter', 'bolder', 'inherit', 'initial', 'unset'];\n\n/**\n * todo consider doing tighter control for permissible font families, eg. as in Kibana Canvas - expression language\n *  - though the same applies for permissible (eg. known available or loaded) font weights, styles, variants...\n * @public\n */\nexport type FontFamily = string;\n/** @public */\nexport const FONT_WEIGHTS = Object.freeze([...FONT_WEIGHTS_NUMERIC, ...FONT_WEIGHTS_ALPHA] as const);\n/** @public */\nexport const FONT_VARIANTS = Object.freeze(['normal', 'small-caps'] as const);\n/** @public */\nexport type FontVariant = (typeof FONT_VARIANTS)[number];\n/** @public */\nexport type FontWeight = (typeof FONT_WEIGHTS)[number];\n/** @public */\nexport const FONT_STYLES = Object.freeze(['normal', 'italic', 'oblique', 'inherit', 'initial', 'unset'] as const);\n/** @public */\nexport type FontStyle = (typeof FONT_STYLES)[number];\n/** @public */\nexport type PartialFont = Partial<Font>;\n/** @public */\nexport const TEXT_ALIGNS = Object.freeze(['start', 'end', 'left', 'right', 'center'] as const);\n/** @public */\nexport type TextAlign = (typeof TEXT_ALIGNS)[number];\n/** @public */\nexport type TextBaseline = (typeof TEXT_BASELINE)[number];\n\n/** @internal */\nexport type VerticalAlignments = Values<typeof VerticalAlignments>;\n/** @internal */\nexport type Relation = Array<Datum>;\n\n/**\n * this doesn't include the font size, so it's more like a font face (?) - unfortunately all vague terms\n * @public\n */\nexport interface Font {\n  fontStyle: FontStyle;\n  fontVariant: FontVariant;\n  fontWeight: FontWeight;\n  fontFamily: FontFamily;\n  textColor: Color;\n}\n\n/** @public */\nexport const TEXT_BASELINE = Object.freeze([\n  'top',\n  'hanging',\n  'middle',\n  'alphabetic',\n  'ideographic',\n  'bottom',\n] as const);\n\n/** @internal */\nexport interface Box extends Font {\n  text: string;\n  isValue: boolean;\n}\n\n/** @internal */\nexport interface Part extends Rectangle {\n  node: ArrayEntry;\n}\n\n/** @internal */\nexport function cssFontShorthand(\n  { fontStyle, fontVariant, fontWeight, fontFamily }: Omit<Font, 'textColor'>,\n  fontSize: Pixels,\n) {\n  return `${fontStyle} ${fontVariant} ${fontWeight} ${fontSize}px ${fontFamily}`;\n}\n\n/** @internal */\nexport const VerticalAlignments = Object.freeze({\n  top: 'top' as const,\n  middle: 'middle' as const,\n  bottom: 'bottom' as const,\n  alphabetic: 'alphabetic' as const,\n  hanging: 'hanging' as const,\n  ideographic: 'ideographic' as const,\n});\n\n/** @internal */\nexport const HorizontalAlignment = Object.freeze({\n  left: 'left' as const,\n  center: 'center' as const,\n  right: 'right' as const,\n});\n/** @internal */\nexport type HorizontalAlignment = Values<typeof HorizontalAlignment>;\n\n/** @internal */\nexport function measureOneBoxWidth(measure: TextMeasure, fontSize: number, box: Box) {\n  return measure(box.text, box, fontSize).width;\n}\n\n/** @internal */\nexport function cutToLength(s: string, maxLength: number) {\n  return s.length <= maxLength ? s : `${s.slice(0, Math.max(0, maxLength - 1))}…`; // ellipsis is one char\n}\n\n/** @internal */\nexport function fitText(\n  measure: TextMeasure,\n  desiredText: string,\n  allottedWidth: number,\n  fontSize: number,\n  font: Font,\n) {\n  const desiredLength = desiredText.length;\n  const response = (v: number) => measure(desiredText.slice(0, Math.max(0, v)), font, fontSize).width;\n  const visibleLength = monotonicHillClimb(response, desiredLength, allottedWidth, integerSnap);\n  const text = visibleLength < 2 && desiredLength >= 2 ? '' : cutToLength(desiredText, visibleLength);\n  const { width } = measure(text, font, fontSize);\n  return { width, text };\n}\n\n/** @internal */\nexport function maximiseFontSize(\n  measure: TextMeasure,\n  text: string,\n  font: Font,\n  minFontSize: Pixels,\n  maxFontSize: Pixels,\n  boxWidth: Pixels,\n  boxHeight: Pixels,\n): Pixels {\n  const response = (fontSize: number) => {\n    const { width } = measure(text, font, fontSize);\n    const widthDiff = boxWidth - width;\n    const heightDiff = boxHeight - fontSize;\n    return -Math.min(widthDiff, heightDiff);\n  };\n  return monotonicHillClimb(response, maxFontSize, 0, integerSnap, minFontSize);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Radian } from './geometry';\n\n/** @internal */\nexport type Vec2 = [number, number];\n\n/**\n * Rotate a Vec2 vector by radians\n * @internal\n */\nexport function rotate2(radian: Radian, vector: Vec2): Vec2 {\n  return [\n    Math.cos(radian) * vector[0] - Math.sin(radian) * vector[1],\n    Math.sin(radian) * vector[0] + Math.cos(radian) * vector[1],\n  ];\n}\n\n/**\n * Subtract vector b from a\n * @internal\n */\nexport function sub2(a: Vec2, b: Vec2): Vec2 {\n  return [a[0] - b[0], a[1] - b[1]];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RgbTuple } from './color_library_wrappers';\n\nfunction sRGBtoLin(colorChannel: number) {\n  // Send this function a decimal sRGB gamma encoded color value\n  // between 0.0 and 1.0, and it returns a linearized value.\n  return colorChannel <= 0.03928 ? colorChannel / 12.92 : Math.pow((colorChannel + 0.055) / 1.055, 2.4);\n}\n\nfunction getLuminance([r, g, b]: RgbTuple) {\n  const vR = r / 255;\n  const vG = g / 255;\n  const vB = b / 255;\n  return 0.2126 * sRGBtoLin(vR) + 0.7152 * sRGBtoLin(vG) + 0.0722 * sRGBtoLin(vB);\n}\n\n/** @internal */\nexport function getWCAG2ContrastRatio(foreground: RgbTuple, background: RgbTuple) {\n  const lumA = getLuminance(foreground);\n  const lumB = getLuminance(background);\n\n  return lumA >= lumB ? (lumA + 0.05) / (lumB + 0.05) : (lumB + 0.05) / (lumA + 0.05);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/**\n * WebGL uses integers (GLUInt, just a number in JS) as fake enums (mostly) for WebGL API function call parameters.\n * While it's possible to use the integer code directly, there's documentational value in naming them, in line with specs.\n * WebGL queries, typically run for exception handling and debugging situations, often return such \"enums\" too.\n * By having the number here, it's easy to search for the meaning, though it's possible to do it on the web too.\n * Most of these constants aren't currently used, but it'd be tedious to add them one by one.\n *\n * Note that there are functions (currently, `gl.activeTexture`) that take an \"enum\" but then add offset numbers to it.\n */\n\n/** @internal */\nexport const GL = {\n  DEPTH_BUFFER_BIT: 256,\n  STENCIL_BUFFER_BIT: 1024,\n  COLOR_BUFFER_BIT: 16384,\n  POINTS: 0,\n  LINES: 1,\n  LINE_LOOP: 2,\n  LINE_STRIP: 3,\n  TRIANGLES: 4,\n  TRIANGLE_STRIP: 5,\n  TRIANGLE_FAN: 6,\n  ZERO: 0,\n  ONE: 1,\n  SRC_COLOR: 768,\n  ONE_MINUS_SRC_COLOR: 769,\n  SRC_ALPHA: 770,\n  ONE_MINUS_SRC_ALPHA: 771,\n  DST_ALPHA: 772,\n  ONE_MINUS_DST_ALPHA: 773,\n  DST_COLOR: 774,\n  ONE_MINUS_DST_COLOR: 775,\n  SRC_ALPHA_SATURATE: 776,\n  FUNC_ADD: 32774,\n  BLEND_EQUATION: 32777,\n  BLEND_EQUATION_RGB: 32777,\n  BLEND_EQUATION_ALPHA: 34877,\n  FUNC_SUBTRACT: 32778,\n  FUNC_REVERSE_SUBTRACT: 32779,\n  BLEND_DST_RGB: 32968,\n  BLEND_SRC_RGB: 32969,\n  BLEND_DST_ALPHA: 32970,\n  BLEND_SRC_ALPHA: 32971,\n  CONSTANT_COLOR: 32769,\n  ONE_MINUS_CONSTANT_COLOR: 32770,\n  CONSTANT_ALPHA: 32771,\n  ONE_MINUS_CONSTANT_ALPHA: 32772,\n  BLEND_COLOR: 32773,\n  ARRAY_BUFFER: 34962,\n  ELEMENT_ARRAY_BUFFER: 34963,\n  ARRAY_BUFFER_BINDING: 34964,\n  ELEMENT_ARRAY_BUFFER_BINDING: 34965,\n  STREAM_DRAW: 35040,\n  STATIC_DRAW: 35044,\n  DYNAMIC_DRAW: 35048,\n  BUFFER_SIZE: 34660,\n  BUFFER_USAGE: 34661,\n  CURRENT_VERTEX_ATTRIB: 34342,\n  FRONT: 1028,\n  BACK: 1029,\n  FRONT_AND_BACK: 1032,\n  TEXTURE_2D: 3553,\n  CULL_FACE: 2884,\n  BLEND: 3042,\n  DITHER: 3024,\n  STENCIL_TEST: 2960,\n  DEPTH_TEST: 2929,\n  SCISSOR_TEST: 3089,\n  POLYGON_OFFSET_FILL: 32823,\n  SAMPLE_ALPHA_TO_COVERAGE: 32926,\n  SAMPLE_COVERAGE: 32928,\n  NO_ERROR: 0,\n  INVALID_ENUM: 1280,\n  INVALID_VALUE: 1281,\n  INVALID_OPERATION: 1282,\n  OUT_OF_MEMORY: 1285,\n  CW: 2304,\n  CCW: 2305,\n  LINE_WIDTH: 2849,\n  ALIASED_POINT_SIZE_RANGE: 33901,\n  ALIASED_LINE_WIDTH_RANGE: 33902,\n  CULL_FACE_MODE: 2885,\n  FRONT_FACE: 2886,\n  DEPTH_RANGE: 2928,\n  DEPTH_WRITEMASK: 2930,\n  DEPTH_CLEAR_VALUE: 2931,\n  DEPTH_FUNC: 2932,\n  STENCIL_CLEAR_VALUE: 2961,\n  STENCIL_FUNC: 2962,\n  STENCIL_FAIL: 2964,\n  STENCIL_PASS_DEPTH_FAIL: 2965,\n  STENCIL_PASS_DEPTH_PASS: 2966,\n  STENCIL_REF: 2967,\n  STENCIL_VALUE_MASK: 2963,\n  STENCIL_WRITEMASK: 2968,\n  STENCIL_BACK_FUNC: 34816,\n  STENCIL_BACK_FAIL: 34817,\n  STENCIL_BACK_PASS_DEPTH_FAIL: 34818,\n  STENCIL_BACK_PASS_DEPTH_PASS: 34819,\n  STENCIL_BACK_REF: 36003,\n  STENCIL_BACK_VALUE_MASK: 36004,\n  STENCIL_BACK_WRITEMASK: 36005,\n  VIEWPORT: 2978,\n  SCISSOR_BOX: 3088,\n  COLOR_CLEAR_VALUE: 3106,\n  COLOR_WRITEMASK: 3107,\n  UNPACK_ALIGNMENT: 3317,\n  PACK_ALIGNMENT: 3333,\n  MAX_TEXTURE_SIZE: 3379,\n  MAX_VIEWPORT_DIMS: 3386,\n  SUBPIXEL_BITS: 3408,\n  RED_BITS: 3410,\n  GREEN_BITS: 3411,\n  BLUE_BITS: 3412,\n  ALPHA_BITS: 3413,\n  DEPTH_BITS: 3414,\n  STENCIL_BITS: 3415,\n  POLYGON_OFFSET_UNITS: 10752,\n  POLYGON_OFFSET_FACTOR: 32824,\n  TEXTURE_BINDING_2D: 32873,\n  SAMPLE_BUFFERS: 32936,\n  SAMPLES: 32937,\n  SAMPLE_COVERAGE_VALUE: 32938,\n  SAMPLE_COVERAGE_INVERT: 32939,\n  COMPRESSED_TEXTURE_FORMATS: 34467,\n  DONT_CARE: 4352,\n  FASTEST: 4353,\n  NICEST: 4354,\n  GENERATE_MIPMAP_HINT: 33170,\n  BYTE: 5120,\n  UNSIGNED_BYTE: 5121,\n  SHORT: 5122,\n  UNSIGNED_SHORT: 5123,\n  INT: 5124,\n  UNSIGNED_INT: 5125,\n  FLOAT: 5126,\n  DEPTH_COMPONENT: 6402,\n  ALPHA: 6406,\n  RGB: 6407,\n  RGBA: 6408,\n  LUMINANCE: 6409,\n  LUMINANCE_ALPHA: 6410,\n  UNSIGNED_SHORT_4_4_4_4: 32819,\n  UNSIGNED_SHORT_5_5_5_1: 32820,\n  UNSIGNED_SHORT_5_6_5: 33635,\n  FRAGMENT_SHADER: 35632,\n  VERTEX_SHADER: 35633,\n  MAX_VERTEX_ATTRIBS: 34921,\n  MAX_VERTEX_UNIFORM_VECTORS: 36347,\n  MAX_VARYING_VECTORS: 36348,\n  MAX_COMBINED_TEXTURE_IMAGE_UNITS: 35661,\n  MAX_VERTEX_TEXTURE_IMAGE_UNITS: 35660,\n  MAX_TEXTURE_IMAGE_UNITS: 34930,\n  MAX_FRAGMENT_UNIFORM_VECTORS: 36349,\n  SHADER_TYPE: 35663,\n  DELETE_STATUS: 35712,\n  LINK_STATUS: 35714,\n  VALIDATE_STATUS: 35715,\n  ATTACHED_SHADERS: 35717,\n  ACTIVE_UNIFORMS: 35718,\n  ACTIVE_ATTRIBUTES: 35721,\n  SHADING_LANGUAGE_VERSION: 35724,\n  CURRENT_PROGRAM: 35725,\n  NEVER: 512,\n  LESS: 513,\n  EQUAL: 514,\n  LEQUAL: 515,\n  GREATER: 516,\n  NOTEQUAL: 517,\n  GEQUAL: 518,\n  ALWAYS: 519,\n  KEEP: 7680,\n  REPLACE: 7681,\n  INCR: 7682,\n  DECR: 7683,\n  INVERT: 5386,\n  INCR_WRAP: 34055,\n  DECR_WRAP: 34056,\n  VENDOR: 7936,\n  RENDERER: 7937,\n  VERSION: 7938,\n  NEAREST: 9728,\n  LINEAR: 9729,\n  NEAREST_MIPMAP_NEAREST: 9984,\n  LINEAR_MIPMAP_NEAREST: 9985,\n  NEAREST_MIPMAP_LINEAR: 9986,\n  LINEAR_MIPMAP_LINEAR: 9987,\n  TEXTURE_MAG_FILTER: 10240,\n  TEXTURE_MIN_FILTER: 10241,\n  TEXTURE_WRAP_S: 10242,\n  TEXTURE_WRAP_T: 10243,\n  TEXTURE: 5890,\n  TEXTURE_CUBE_MAP: 34067,\n  TEXTURE_BINDING_CUBE_MAP: 34068,\n  TEXTURE_CUBE_MAP_POSITIVE_X: 34069,\n  TEXTURE_CUBE_MAP_NEGATIVE_X: 34070,\n  TEXTURE_CUBE_MAP_POSITIVE_Y: 34071,\n  TEXTURE_CUBE_MAP_NEGATIVE_Y: 34072,\n  TEXTURE_CUBE_MAP_POSITIVE_Z: 34073,\n  TEXTURE_CUBE_MAP_NEGATIVE_Z: 34074,\n  MAX_CUBE_MAP_TEXTURE_SIZE: 34076,\n  TEXTURE0: 33984,\n  TEXTURE1: 33985,\n  TEXTURE2: 33986,\n  TEXTURE3: 33987,\n  TEXTURE4: 33988,\n  TEXTURE5: 33989,\n  TEXTURE6: 33990,\n  TEXTURE7: 33991,\n  TEXTURE8: 33992,\n  TEXTURE9: 33993,\n  TEXTURE10: 33994,\n  TEXTURE11: 33995,\n  TEXTURE12: 33996,\n  TEXTURE13: 33997,\n  TEXTURE14: 33998,\n  TEXTURE15: 33999,\n  TEXTURE16: 34000,\n  TEXTURE17: 34001,\n  TEXTURE18: 34002,\n  TEXTURE19: 34003,\n  TEXTURE20: 34004,\n  TEXTURE21: 34005,\n  TEXTURE22: 34006,\n  TEXTURE23: 34007,\n  TEXTURE24: 34008,\n  TEXTURE25: 34009,\n  TEXTURE26: 34010,\n  TEXTURE27: 34011,\n  TEXTURE28: 34012,\n  TEXTURE29: 34013,\n  TEXTURE30: 34014,\n  TEXTURE31: 34015,\n  ACTIVE_TEXTURE: 34016,\n  REPEAT: 10497,\n  CLAMP_TO_EDGE: 33071,\n  MIRRORED_REPEAT: 33648,\n  FLOAT_VEC2: 35664,\n  FLOAT_VEC3: 35665,\n  FLOAT_VEC4: 35666,\n  INT_VEC2: 35667,\n  INT_VEC3: 35668,\n  INT_VEC4: 35669,\n  BOOL: 35670,\n  BOOL_VEC2: 35671,\n  BOOL_VEC3: 35672,\n  BOOL_VEC4: 35673,\n  FLOAT_MAT2: 35674,\n  FLOAT_MAT3: 35675,\n  FLOAT_MAT4: 35676,\n  SAMPLER_2D: 35678,\n  SAMPLER_CUBE: 35680,\n  VERTEX_ATTRIB_ARRAY_ENABLED: 34338,\n  VERTEX_ATTRIB_ARRAY_SIZE: 34339,\n  VERTEX_ATTRIB_ARRAY_STRIDE: 34340,\n  VERTEX_ATTRIB_ARRAY_TYPE: 34341,\n  VERTEX_ATTRIB_ARRAY_NORMALIZED: 34922,\n  VERTEX_ATTRIB_ARRAY_POINTER: 34373,\n  VERTEX_ATTRIB_ARRAY_BUFFER_BINDING: 34975,\n  IMPLEMENTATION_COLOR_READ_TYPE: 35738,\n  IMPLEMENTATION_COLOR_READ_FORMAT: 35739,\n  COMPILE_STATUS: 35713,\n  LOW_FLOAT: 36336,\n  MEDIUM_FLOAT: 36337,\n  HIGH_FLOAT: 36338,\n  LOW_INT: 36339,\n  MEDIUM_INT: 36340,\n  HIGH_INT: 36341,\n  FRAMEBUFFER: 36160,\n  RENDERBUFFER: 36161,\n  RGBA4: 32854,\n  RGB5_A1: 32855,\n  RGB565: 36194,\n  DEPTH_COMPONENT16: 33189,\n  STENCIL_INDEX8: 36168,\n  DEPTH_STENCIL: 34041,\n  RENDERBUFFER_WIDTH: 36162,\n  RENDERBUFFER_HEIGHT: 36163,\n  RENDERBUFFER_INTERNAL_FORMAT: 36164,\n  RENDERBUFFER_RED_SIZE: 36176,\n  RENDERBUFFER_GREEN_SIZE: 36177,\n  RENDERBUFFER_BLUE_SIZE: 36178,\n  RENDERBUFFER_ALPHA_SIZE: 36179,\n  RENDERBUFFER_DEPTH_SIZE: 36180,\n  RENDERBUFFER_STENCIL_SIZE: 36181,\n  FRAMEBUFFER_ATTACHMENT_OBJECT_TYPE: 36048,\n  FRAMEBUFFER_ATTACHMENT_OBJECT_NAME: 36049,\n  FRAMEBUFFER_ATTACHMENT_TEXTURE_LEVEL: 36050,\n  FRAMEBUFFER_ATTACHMENT_TEXTURE_CUBE_MAP_FACE: 36051,\n  COLOR_ATTACHMENT0: 36064,\n  DEPTH_ATTACHMENT: 36096,\n  STENCIL_ATTACHMENT: 36128,\n  DEPTH_STENCIL_ATTACHMENT: 33306,\n  NONE: 0,\n  FRAMEBUFFER_COMPLETE: 36053,\n  FRAMEBUFFER_INCOMPLETE_ATTACHMENT: 36054,\n  FRAMEBUFFER_INCOMPLETE_MISSING_ATTACHMENT: 36055,\n  FRAMEBUFFER_INCOMPLETE_DIMENSIONS: 36057,\n  FRAMEBUFFER_UNSUPPORTED: 36061,\n  FRAMEBUFFER_BINDING: 36006,\n  RENDERBUFFER_BINDING: 36007,\n  MAX_RENDERBUFFER_SIZE: 34024,\n  INVALID_FRAMEBUFFER_OPERATION: 1286,\n  UNPACK_FLIP_Y_WEBGL: 37440,\n  UNPACK_PREMULTIPLY_ALPHA_WEBGL: 37441,\n  CONTEXT_LOST_WEBGL: 37442,\n  UNPACK_COLORSPACE_CONVERSION_WEBGL: 37443,\n  BROWSER_DEFAULT_WEBGL: 37444,\n  READ_BUFFER: 3074,\n  UNPACK_ROW_LENGTH: 3314,\n  UNPACK_SKIP_ROWS: 3315,\n  UNPACK_SKIP_PIXELS: 3316,\n  PACK_ROW_LENGTH: 3330,\n  PACK_SKIP_ROWS: 3331,\n  PACK_SKIP_PIXELS: 3332,\n  COLOR: 6144,\n  DEPTH: 6145,\n  STENCIL: 6146,\n  RED: 6403,\n  RGB8: 32849,\n  RGBA8: 32856,\n  RGB10_A2: 32857,\n  TEXTURE_BINDING_3D: 32874,\n  UNPACK_SKIP_IMAGES: 32877,\n  UNPACK_IMAGE_HEIGHT: 32878,\n  TEXTURE_3D: 32879,\n  TEXTURE_WRAP_R: 32882,\n  MAX_3D_TEXTURE_SIZE: 32883,\n  UNSIGNED_INT_2_10_10_10_REV: 33640,\n  MAX_ELEMENTS_VERTICES: 33000,\n  MAX_ELEMENTS_INDICES: 33001,\n  TEXTURE_MIN_LOD: 33082,\n  TEXTURE_MAX_LOD: 33083,\n  TEXTURE_BASE_LEVEL: 33084,\n  TEXTURE_MAX_LEVEL: 33085,\n  MIN: 32775,\n  MAX: 32776,\n  DEPTH_COMPONENT24: 33190,\n  MAX_TEXTURE_LOD_BIAS: 34045,\n  TEXTURE_COMPARE_MODE: 34892,\n  TEXTURE_COMPARE_FUNC: 34893,\n  CURRENT_QUERY: 34917,\n  QUERY_RESULT: 34918,\n  QUERY_RESULT_AVAILABLE: 34919,\n  STREAM_READ: 35041,\n  STREAM_COPY: 35042,\n  STATIC_READ: 35045,\n  STATIC_COPY: 35046,\n  DYNAMIC_READ: 35049,\n  DYNAMIC_COPY: 35050,\n  MAX_DRAW_BUFFERS: 34852,\n  DRAW_BUFFER0: 34853,\n  DRAW_BUFFER1: 34854,\n  DRAW_BUFFER2: 34855,\n  DRAW_BUFFER3: 34856,\n  DRAW_BUFFER4: 34857,\n  DRAW_BUFFER5: 34858,\n  DRAW_BUFFER6: 34859,\n  DRAW_BUFFER7: 34860,\n  DRAW_BUFFER8: 34861,\n  DRAW_BUFFER9: 34862,\n  DRAW_BUFFER10: 34863,\n  DRAW_BUFFER11: 34864,\n  DRAW_BUFFER12: 34865,\n  DRAW_BUFFER13: 34866,\n  DRAW_BUFFER14: 34867,\n  DRAW_BUFFER15: 34868,\n  MAX_FRAGMENT_UNIFORM_COMPONENTS: 35657,\n  MAX_VERTEX_UNIFORM_COMPONENTS: 35658,\n  SAMPLER_3D: 35679,\n  SAMPLER_2D_SHADOW: 35682,\n  FRAGMENT_SHADER_DERIVATIVE_HINT: 35723,\n  PIXEL_PACK_BUFFER: 35051,\n  PIXEL_UNPACK_BUFFER: 35052,\n  PIXEL_PACK_BUFFER_BINDING: 35053,\n  PIXEL_UNPACK_BUFFER_BINDING: 35055,\n  SRGB: 35904,\n  SRGB8: 35905,\n  SRGB8_ALPHA8: 35907,\n  COMPARE_REF_TO_TEXTURE: 34894,\n  RGBA32F: 34836,\n  RGB32F: 34837,\n  RGBA16F: 34842,\n  RGB16F: 34843,\n  VERTEX_ATTRIB_ARRAY_INTEGER: 35069,\n  MAX_ARRAY_TEXTURE_LAYERS: 35071,\n  MIN_PROGRAM_TEXEL_OFFSET: 35076,\n  MAX_PROGRAM_TEXEL_OFFSET: 35077,\n  MAX_VARYING_COMPONENTS: 35659,\n  TEXTURE_2D_ARRAY: 35866,\n  TEXTURE_BINDING_2D_ARRAY: 35869,\n  R11F_G11F_B10F: 35898,\n  UNSIGNED_INT_10F_11F_11F_REV: 35899,\n  RGB9_E5: 35901,\n  UNSIGNED_INT_5_9_9_9_REV: 35902,\n  TRANSFORM_FEEDBACK_BUFFER_MODE: 35967,\n  MAX_TRANSFORM_FEEDBACK_SEPARATE_COMPONENTS: 35968,\n  TRANSFORM_FEEDBACK_VARYINGS: 35971,\n  TRANSFORM_FEEDBACK_BUFFER_START: 35972,\n  TRANSFORM_FEEDBACK_BUFFER_SIZE: 35973,\n  TRANSFORM_FEEDBACK_PRIMITIVES_WRITTEN: 35976,\n  RASTERIZER_DISCARD: 35977,\n  MAX_TRANSFORM_FEEDBACK_INTERLEAVED_COMPONENTS: 35978,\n  MAX_TRANSFORM_FEEDBACK_SEPARATE_ATTRIBS: 35979,\n  INTERLEAVED_ATTRIBS: 35980,\n  SEPARATE_ATTRIBS: 35981,\n  TRANSFORM_FEEDBACK_BUFFER: 35982,\n  TRANSFORM_FEEDBACK_BUFFER_BINDING: 35983,\n  RGBA32UI: 36208,\n  RGB32UI: 36209,\n  RGBA16UI: 36214,\n  RGB16UI: 36215,\n  RGBA8UI: 36220,\n  RGB8UI: 36221,\n  RGBA32I: 36226,\n  RGB32I: 36227,\n  RGBA16I: 36232,\n  RGB16I: 36233,\n  RGBA8I: 36238,\n  RGB8I: 36239,\n  RED_INTEGER: 36244,\n  RGB_INTEGER: 36248,\n  RGBA_INTEGER: 36249,\n  SAMPLER_2D_ARRAY: 36289,\n  SAMPLER_2D_ARRAY_SHADOW: 36292,\n  SAMPLER_CUBE_SHADOW: 36293,\n  UNSIGNED_INT_VEC2: 36294,\n  UNSIGNED_INT_VEC3: 36295,\n  UNSIGNED_INT_VEC4: 36296,\n  INT_SAMPLER_2D: 36298,\n  INT_SAMPLER_3D: 36299,\n  INT_SAMPLER_CUBE: 36300,\n  INT_SAMPLER_2D_ARRAY: 36303,\n  UNSIGNED_INT_SAMPLER_2D: 36306,\n  UNSIGNED_INT_SAMPLER_3D: 36307,\n  UNSIGNED_INT_SAMPLER_CUBE: 36308,\n  UNSIGNED_INT_SAMPLER_2D_ARRAY: 36311,\n  DEPTH_COMPONENT32F: 36012,\n  DEPTH32F_STENCIL8: 36013,\n  FLOAT_32_UNSIGNED_INT_24_8_REV: 36269,\n  FRAMEBUFFER_ATTACHMENT_COLOR_ENCODING: 33296,\n  FRAMEBUFFER_ATTACHMENT_COMPONENT_TYPE: 33297,\n  FRAMEBUFFER_ATTACHMENT_RED_SIZE: 33298,\n  FRAMEBUFFER_ATTACHMENT_GREEN_SIZE: 33299,\n  FRAMEBUFFER_ATTACHMENT_BLUE_SIZE: 33300,\n  FRAMEBUFFER_ATTACHMENT_ALPHA_SIZE: 33301,\n  FRAMEBUFFER_ATTACHMENT_DEPTH_SIZE: 33302,\n  FRAMEBUFFER_ATTACHMENT_STENCIL_SIZE: 33303,\n  FRAMEBUFFER_DEFAULT: 33304,\n  UNSIGNED_INT_24_8: 34042,\n  DEPTH24_STENCIL8: 35056,\n  UNSIGNED_NORMALIZED: 35863,\n  DRAW_FRAMEBUFFER_BINDING: 36006,\n  READ_FRAMEBUFFER: 36008,\n  DRAW_FRAMEBUFFER: 36009,\n  READ_FRAMEBUFFER_BINDING: 36010,\n  RENDERBUFFER_SAMPLES: 36011,\n  FRAMEBUFFER_ATTACHMENT_TEXTURE_LAYER: 36052,\n  MAX_COLOR_ATTACHMENTS: 36063,\n  COLOR_ATTACHMENT1: 36065,\n  COLOR_ATTACHMENT2: 36066,\n  COLOR_ATTACHMENT3: 36067,\n  COLOR_ATTACHMENT4: 36068,\n  COLOR_ATTACHMENT5: 36069,\n  COLOR_ATTACHMENT6: 36070,\n  COLOR_ATTACHMENT7: 36071,\n  COLOR_ATTACHMENT8: 36072,\n  COLOR_ATTACHMENT9: 36073,\n  COLOR_ATTACHMENT10: 36074,\n  COLOR_ATTACHMENT11: 36075,\n  COLOR_ATTACHMENT12: 36076,\n  COLOR_ATTACHMENT13: 36077,\n  COLOR_ATTACHMENT14: 36078,\n  COLOR_ATTACHMENT15: 36079,\n  FRAMEBUFFER_INCOMPLETE_MULTISAMPLE: 36182,\n  MAX_SAMPLES: 36183,\n  HALF_FLOAT: 5131,\n  RG: 33319,\n  RG_INTEGER: 33320,\n  R8: 33321,\n  RG8: 33323,\n  R16F: 33325,\n  R32F: 33326,\n  RG16F: 33327,\n  RG32F: 33328,\n  R8I: 33329,\n  R8UI: 33330,\n  R16I: 33331,\n  R16UI: 33332,\n  R32I: 33333,\n  R32UI: 33334,\n  RG8I: 33335,\n  RG8UI: 33336,\n  RG16I: 33337,\n  RG16UI: 33338,\n  RG32I: 33339,\n  RG32UI: 33340,\n  VERTEX_ARRAY_BINDING: 34229,\n  R8_SNORM: 36756,\n  RG8_SNORM: 36757,\n  RGB8_SNORM: 36758,\n  RGBA8_SNORM: 36759,\n  SIGNED_NORMALIZED: 36764,\n  COPY_READ_BUFFER: 36662,\n  COPY_WRITE_BUFFER: 36663,\n  COPY_READ_BUFFER_BINDING: 36662,\n  COPY_WRITE_BUFFER_BINDING: 36663,\n  UNIFORM_BUFFER: 35345,\n  UNIFORM_BUFFER_BINDING: 35368,\n  UNIFORM_BUFFER_START: 35369,\n  UNIFORM_BUFFER_SIZE: 35370,\n  MAX_VERTEX_UNIFORM_BLOCKS: 35371,\n  MAX_FRAGMENT_UNIFORM_BLOCKS: 35373,\n  MAX_COMBINED_UNIFORM_BLOCKS: 35374,\n  MAX_UNIFORM_BUFFER_BINDINGS: 35375,\n  MAX_UNIFORM_BLOCK_SIZE: 35376,\n  MAX_COMBINED_VERTEX_UNIFORM_COMPONENTS: 35377,\n  MAX_COMBINED_FRAGMENT_UNIFORM_COMPONENTS: 35379,\n  UNIFORM_BUFFER_OFFSET_ALIGNMENT: 35380,\n  ACTIVE_UNIFORM_BLOCKS: 35382,\n  UNIFORM_TYPE: 35383,\n  UNIFORM_SIZE: 35384,\n  UNIFORM_BLOCK_INDEX: 35386,\n  UNIFORM_OFFSET: 35387,\n  UNIFORM_ARRAY_STRIDE: 35388,\n  UNIFORM_MATRIX_STRIDE: 35389,\n  UNIFORM_IS_ROW_MAJOR: 35390,\n  UNIFORM_BLOCK_BINDING: 35391,\n  UNIFORM_BLOCK_DATA_SIZE: 35392,\n  UNIFORM_BLOCK_ACTIVE_UNIFORMS: 35394,\n  UNIFORM_BLOCK_ACTIVE_UNIFORM_INDICES: 35395,\n  UNIFORM_BLOCK_REFERENCED_BY_VERTEX_SHADER: 35396,\n  UNIFORM_BLOCK_REFERENCED_BY_FRAGMENT_SHADER: 35398,\n  INVALID_INDEX: 4294967295,\n  MAX_VERTEX_OUTPUT_COMPONENTS: 37154,\n  MAX_FRAGMENT_INPUT_COMPONENTS: 37157,\n  MAX_SERVER_WAIT_TIMEOUT: 37137,\n  OBJECT_TYPE: 37138,\n  SYNC_CONDITION: 37139,\n  SYNC_STATUS: 37140,\n  SYNC_FLAGS: 37141,\n  SYNC_FENCE: 37142,\n  SYNC_GPU_COMMANDS_COMPLETE: 37143,\n  UNSIGNALED: 37144,\n  SIGNALED: 37145,\n  ALREADY_SIGNALED: 37146,\n  TIMEOUT_EXPIRED: 37147,\n  CONDITION_SATISFIED: 37148,\n  WAIT_FAILED: 37149,\n  SYNC_FLUSH_COMMANDS_BIT: 1,\n  VERTEX_ATTRIB_ARRAY_DIVISOR: 35070,\n  ANY_SAMPLES_PASSED: 35887,\n  ANY_SAMPLES_PASSED_CONSERVATIVE: 36202,\n  SAMPLER_BINDING: 35097,\n  RGB10_A2UI: 36975,\n  INT_2_10_10_10_REV: 36255,\n  TRANSFORM_FEEDBACK: 36386,\n  TRANSFORM_FEEDBACK_PAUSED: 36387,\n  TRANSFORM_FEEDBACK_ACTIVE: 36388,\n  TRANSFORM_FEEDBACK_BINDING: 36389,\n  TEXTURE_IMMUTABLE_FORMAT: 37167,\n  MAX_ELEMENT_INDEX: 36203,\n  TEXTURE_IMMUTABLE_LEVELS: 33503,\n  TIMEOUT_IGNORED: -1,\n  MAX_CLIENT_WAIT_TIMEOUT_WEBGL: 37447,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { A11ySettings } from '../../state/selectors/get_accessibility_config';\n\n/** @internal */\nexport function ScreenReaderDescription(props: A11ySettings) {\n  if (!props.description) return null;\n  return <p id={props.descriptionId}>{props.description}</p>;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { Fragment } from 'react';\n\nimport { BandViewModel } from '../../chart_types/goal_chart/layout/types/viewmodel_types';\nimport { A11ySettings } from '../../state/selectors/get_accessibility_config';\n\ninterface GoalSemanticDescriptionProps {\n  bandLabels: BandViewModel[];\n  firstValue: number;\n}\n\n/** @internal */\nexport const GoalSemanticDescription = ({\n  bandLabels,\n  labelId,\n  firstValue,\n}: A11ySettings & GoalSemanticDescriptionProps) => {\n  return bandLabels[0] && bandLabels[0].text.length > 1 ? (\n    <dl className=\"echScreenReaderOnly echGoalDescription\" key={`goalChart--${labelId}`}>\n      {bandLabels.map(({ value, text }, index) => {\n        if (firstValue === value) return;\n        const prevValue = bandLabels[index - 1];\n        return (\n          <Fragment key={`dtdd--${value}--${text[index]}`}>\n            <dt>{`${prevValue?.value ?? firstValue} - ${value}`}</dt>\n            <dd>{`${text[index]}`}</dd>\n          </Fragment>\n        );\n      })}\n    </dl>\n  ) : null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* @internal */\nexport { ScreenReaderSummary } from './screen_reader_summary';\nexport { ScreenReaderPartitionTable } from './partitions_data_table';\nexport { GoalSemanticDescription } from './goal_semantic_description';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { GoalChartLabels } from '../../chart_types/goal_chart/state/selectors/get_goal_chart_data';\nimport { A11ySettings } from '../../state/selectors/get_accessibility_config';\n\ninterface ScreenReaderLabelProps {\n  goalChartLabels?: GoalChartLabels;\n}\n\n/** @internal */\nexport function ScreenReaderLabel({\n  label,\n  labelHeadingLevel,\n  labelId,\n  goalChartLabels,\n}: A11ySettings & ScreenReaderLabelProps) {\n  const Heading = labelHeadingLevel;\n\n  if (!label && !goalChartLabels?.majorLabel && !goalChartLabels?.minorLabel) return null;\n\n  let unifiedLabel = '';\n  if (!label && goalChartLabels?.majorLabel) {\n    unifiedLabel = goalChartLabels?.majorLabel;\n  } else if (label && !goalChartLabels?.majorLabel) {\n    unifiedLabel = label;\n  } else if (label && goalChartLabels?.majorLabel && label !== goalChartLabels?.majorLabel) {\n    unifiedLabel = `${label}; Chart visible label: ${goalChartLabels?.majorLabel}`;\n  }\n\n  return (\n    <>\n      {unifiedLabel && <Heading id={labelId}>{unifiedLabel}</Heading>}\n      {goalChartLabels?.minorLabel && <p>{goalChartLabels?.minorLabel}</p>}\n    </>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { useRef, memo, useState } from 'react';\nimport { connect } from 'react-redux';\n\nimport {\n  getScreenReaderDataSelector,\n  PartitionData,\n} from '../../chart_types/partition_chart/state/selectors/get_screen_reader_data';\nimport { SettingsSpec } from '../../specs/settings';\nimport { GlobalChartState } from '../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../state/selectors/get_accessibility_config';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../../state/selectors/get_settings_spec';\nimport { isNil } from '../../utils/common';\n\ninterface ScreenReaderPartitionTableProps {\n  a11ySettings: A11ySettings;\n  partitionData: PartitionData;\n  debug: SettingsSpec['debug'];\n}\n\n// this currently limit the number of pages shown to the user\nconst TABLE_PAGINATION = 20;\n\nconst ScreenReaderPartitionTableComponent = ({\n  a11ySettings,\n  partitionData,\n  debug,\n}: ScreenReaderPartitionTableProps) => {\n  const [count, setCount] = useState(1);\n  const tableRowRef = useRef<HTMLTableRowElement>(null);\n  const { tableCaption } = a11ySettings;\n\n  const rowLimit = TABLE_PAGINATION * count;\n  const handleMoreData = () => {\n    setCount(count + 1);\n    // generate the next group of data\n    if (tableRowRef.current) {\n      tableRowRef.current.focus();\n    }\n  };\n\n  const { isSmallMultiple, data, hasMultipleLayers } = partitionData;\n  const tableLength = data.length;\n  const showMoreRows = rowLimit < tableLength;\n  let countOfCol: number = 3;\n  const totalColumns: number =\n    hasMultipleLayers && isSmallMultiple\n      ? (countOfCol += 3)\n      : hasMultipleLayers || isSmallMultiple\n        ? (countOfCol += 2)\n        : countOfCol;\n\n  return (\n    <div className={`echScreenReaderOnly ${debug ? 'echScreenReaderOnlyDebug' : ''} echScreenReaderTable`}>\n      <table>\n        <caption>\n          {isNil(tableCaption)\n            ? `The table ${\n                showMoreRows\n                  ? `represents only ${rowLimit} of the ${tableLength} data points`\n                  : `fully represents the dataset of ${tableLength} data point${tableLength > 1 ? 's' : ''}`\n              }`\n            : tableCaption}\n        </caption>\n        <thead>\n          <tr>\n            {isSmallMultiple && <th scope=\"col\">Small multiple title</th>}\n            {hasMultipleLayers && <th scope=\"col\">Depth</th>}\n            <th scope=\"col\">Label</th>\n            {hasMultipleLayers && <th scope=\"col\">Parent</th>}\n            <th scope=\"col\">Value</th>\n            <th scope=\"col\">Percentage</th>\n          </tr>\n        </thead>\n\n        <tbody>\n          {partitionData.data\n            .slice(0, rowLimit)\n            .map(({ panelTitle, depth, label, parentName, valueText, percentage }, index) => {\n              return (\n                <tr key={`row--${index}`} ref={rowLimit === index ? tableRowRef : undefined} tabIndex={-1}>\n                  {isSmallMultiple && <td>{panelTitle}</td>}\n                  {hasMultipleLayers && <td>{depth}</td>}\n                  <th scope=\"row\">{label}</th>\n                  {hasMultipleLayers && <td>{parentName}</td>}\n                  <td>{valueText}</td>\n                  <td>{percentage}</td>\n                </tr>\n              );\n            })}\n        </tbody>\n        {showMoreRows && (\n          <tfoot>\n            <tr>\n              <td colSpan={totalColumns}>\n                <button type=\"submit\" onClick={() => handleMoreData()} tabIndex={-1}>\n                  Click to show more data\n                </button>\n              </td>\n            </tr>\n          </tfoot>\n        )}\n      </table>\n    </div>\n  );\n};\n\nconst DEFAULT_SCREEN_READER_SUMMARY = {\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  partitionData: {\n    isSmallMultiple: false,\n    hasMultipleLayers: false,\n    data: [],\n  },\n  debug: false,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ScreenReaderPartitionTableProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_SCREEN_READER_SUMMARY;\n  }\n  return {\n    a11ySettings: getA11ySettingsSelector(state),\n    partitionData: getScreenReaderDataSelector(state),\n    debug: getSettingsSpecSelector(state).debug,\n  };\n};\n/** @internal */\nexport const ScreenReaderPartitionTable = memo(connect(mapStateToProps)(ScreenReaderPartitionTableComponent));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { memo } from 'react';\nimport { connect } from 'react-redux';\n\nimport { ScreenReaderDescription } from './description';\nimport { ScreenReaderLabel } from './label';\nimport { ScreenReaderTypes } from './types';\nimport {\n  getGoalChartDataSelector,\n  getGoalChartLabelsSelector,\n  GoalChartData,\n  GoalChartLabels,\n} from '../../chart_types/goal_chart/state/selectors/get_goal_chart_data';\nimport { GlobalChartState } from '../../state/chart_state';\nimport {\n  A11ySettings,\n  DEFAULT_A11Y_SETTINGS,\n  getA11ySettingsSelector,\n} from '../../state/selectors/get_accessibility_config';\nimport { getChartTypeDescriptionSelector } from '../../state/selectors/get_chart_type_description';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\n\ninterface ScreenReaderSummaryStateProps {\n  a11ySettings: A11ySettings;\n  chartTypeDescription: string;\n  goalChartData?: GoalChartData;\n  goalChartLabels?: GoalChartLabels;\n}\n\nconst ScreenReaderSummaryComponent = ({\n  a11ySettings,\n  chartTypeDescription,\n  goalChartData,\n  goalChartLabels,\n}: ScreenReaderSummaryStateProps) => {\n  return (\n    <div className=\"echScreenReaderOnly\">\n      <ScreenReaderLabel {...a11ySettings} goalChartLabels={goalChartLabels} />\n      <ScreenReaderDescription {...a11ySettings} />\n      <ScreenReaderTypes {...a11ySettings} chartTypeDescription={chartTypeDescription} goalChartData={goalChartData} />\n    </div>\n  );\n};\n\nconst DEFAULT_SCREEN_READER_SUMMARY = {\n  a11ySettings: DEFAULT_A11Y_SETTINGS,\n  chartTypeDescription: '',\n  goalChartData: undefined,\n};\n\nconst mapStateToProps = (state: GlobalChartState): ScreenReaderSummaryStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return DEFAULT_SCREEN_READER_SUMMARY;\n  }\n  return {\n    chartTypeDescription: getChartTypeDescriptionSelector(state),\n    a11ySettings: getA11ySettingsSelector(state),\n    goalChartData: getGoalChartDataSelector(state),\n    goalChartLabels: getGoalChartLabelsSelector(state),\n  };\n};\n\n/** @internal */\nexport const ScreenReaderSummary = memo(connect(mapStateToProps)(ScreenReaderSummaryComponent));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { GoalChartData } from '../../chart_types/goal_chart/state/selectors/get_goal_chart_data';\nimport { A11ySettings } from '../../state/selectors/get_accessibility_config';\n\ninterface ScreenReaderTypesProps {\n  chartTypeDescription: string;\n  goalChartData?: GoalChartData;\n}\n\n/** @internal */\nexport function ScreenReaderTypes({\n  goalChartData,\n  defaultSummaryId,\n  chartTypeDescription,\n}: A11ySettings & ScreenReaderTypesProps) {\n  if (!defaultSummaryId && !goalChartData) return null;\n  const validGoalChart =\n    chartTypeDescription === 'goal chart' ||\n    chartTypeDescription === 'horizontalBullet chart' ||\n    chartTypeDescription === 'verticalBullet chart';\n  return (\n    <dl>\n      <dt>Chart type:</dt>\n      <dd id={defaultSummaryId}>{chartTypeDescription}</dd>\n      {validGoalChart && goalChartData && !isNaN(goalChartData.maximum) ? (\n        <>\n          <dt>Minimum:</dt>\n          <dd>{goalChartData.minimum}</dd>\n          <dt>Maximum:</dt>\n          <dd>{goalChartData.maximum}</dd>\n          <dt>Target:</dt>\n          <dd>{goalChartData.target}</dd>\n          <dd>Value:</dd>\n          <dt>{goalChartData.value}</dt>\n        </>\n      ) : null}\n    </dl>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\n\nimport { renderRect } from '../../chart_types/xy_chart/renderer/canvas/primitives/rect';\nimport { RgbaTuple } from '../../common/color_library_wrappers';\nimport { Colors } from '../../common/colors';\nimport { clearCanvas, withContext, withClip } from '../../renderers/canvas';\nimport { GlobalChartState } from '../../state/chart_state';\nimport { getInternalBrushAreaSelector } from '../../state/selectors/get_internal_brush_area';\nimport { getInternalIsBrushingSelector } from '../../state/selectors/get_internal_is_brushing';\nimport { getInternalIsBrushingAvailableSelector } from '../../state/selectors/get_internal_is_brushing_available';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { getInternalMainProjectionAreaSelector } from '../../state/selectors/get_internal_main_projection_area';\nimport { getInternalProjectionContainerAreaSelector } from '../../state/selectors/get_internal_projection_container_area';\nimport { Dimensions } from '../../utils/dimensions';\n\ninterface StateProps {\n  initialized: boolean;\n  mainProjectionArea: Dimensions;\n  projectionContainer: Dimensions;\n  isBrushing: boolean | undefined;\n  isBrushAvailable: boolean | undefined;\n  brushEvent: Dimensions | null;\n  zIndex: number;\n}\n\n// todo move this to theme\nconst DEFAULT_FILL_COLOR: RgbaTuple = [128, 128, 128, 0.6];\n\nclass BrushToolComponent extends React.Component<StateProps> {\n  static displayName = 'BrushTool';\n\n  private readonly devicePixelRatio: number;\n\n  private ctx: CanvasRenderingContext2D | null;\n\n  private canvasRef: RefObject<HTMLCanvasElement>;\n\n  constructor(props: Readonly<StateProps>) {\n    super(props);\n    this.ctx = null;\n    this.devicePixelRatio = window.devicePixelRatio;\n    this.canvasRef = React.createRef();\n  }\n\n  componentDidMount() {\n    /*\n     * the DOM element has just been appended, and getContext('2d') is always non-null,\n     * so we could use a couple of ! non-null assertions but no big plus\n     */\n    this.tryCanvasContext();\n    this.drawCanvas();\n  }\n\n  componentDidUpdate() {\n    if (!this.ctx) {\n      this.tryCanvasContext();\n    }\n    if (this.props.initialized) {\n      this.drawCanvas();\n    }\n  }\n\n  render() {\n    const { initialized, isBrushAvailable, isBrushing, projectionContainer, zIndex } = this.props;\n    if (!initialized || !isBrushAvailable || !isBrushing) {\n      this.ctx = null;\n      return null;\n    }\n    const { width, height } = projectionContainer;\n    return (\n      <canvas\n        ref={this.canvasRef}\n        className=\"echBrushTool\"\n        width={width * this.devicePixelRatio}\n        height={height * this.devicePixelRatio}\n        style={{\n          width,\n          height,\n          zIndex,\n        }}\n      />\n    );\n  }\n\n  private drawCanvas = () => {\n    const { brushEvent, mainProjectionArea } = this.props;\n\n    const { ctx } = this;\n    if (!ctx || !brushEvent) {\n      return;\n    }\n    const { top, left, width, height } = brushEvent;\n    withContext(ctx, () => {\n      ctx.scale(this.devicePixelRatio, this.devicePixelRatio);\n      withClip(\n        ctx,\n        {\n          x: mainProjectionArea.left,\n          y: mainProjectionArea.top,\n          width: mainProjectionArea.width,\n          height: mainProjectionArea.height,\n        },\n        () => {\n          clearCanvas(ctx, Colors.Transparent.keyword);\n          ctx.translate(mainProjectionArea.left, mainProjectionArea.top);\n          renderRect(\n            ctx,\n            { x: left, y: top, width, height },\n            { color: DEFAULT_FILL_COLOR },\n            { width: 0, color: Colors.Transparent.rgba },\n          );\n        },\n      );\n    });\n  };\n\n  private tryCanvasContext() {\n    const canvas = this.canvasRef.current;\n    this.ctx = canvas && canvas.getContext('2d');\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): StateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      initialized: false,\n      projectionContainer: {\n        width: 0,\n        height: 0,\n        left: 0,\n        top: 0,\n      },\n      mainProjectionArea: {\n        top: 0,\n        left: 0,\n        width: 0,\n        height: 0,\n      },\n      isBrushing: false,\n      isBrushAvailable: false,\n      brushEvent: null,\n      zIndex: 0,\n    };\n  }\n  return {\n    initialized: state.specsInitialized,\n    projectionContainer: getInternalProjectionContainerAreaSelector(state),\n    mainProjectionArea: getInternalMainProjectionAreaSelector(state),\n    isBrushAvailable: getInternalIsBrushingAvailableSelector(state),\n    isBrushing: getInternalIsBrushingSelector(state),\n    brushEvent: getInternalBrushAreaSelector(state),\n    zIndex: state.zIndex,\n  };\n};\n\n/** @internal */\nexport const BrushTool = connect(mapStateToProps)(BrushToolComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { CSSProperties, ReactNode, createRef } from 'react';\nimport { Provider } from 'react-redux';\nimport { createStore, Store, Unsubscribe } from 'redux';\nimport { OptionalKeys } from 'utility-types';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { ChartBackground } from './chart_background';\nimport { ChartContainer } from './chart_container';\nimport { ChartResizer } from './chart_resizer';\nimport { ChartStatus } from './chart_status';\nimport { ErrorBoundary } from './error_boundary';\nimport { Legend } from './legend/legend';\nimport { getElementZIndex } from './portal/utils';\nimport { Colors } from '../common/colors';\nimport { LegendPositionConfig, PointerEvent } from '../specs';\nimport { SpecsParser } from '../specs/specs_parser';\nimport { updateChartTitles, updateParentDimensions } from '../state/actions/chart_settings';\nimport { onExternalPointerEvent } from '../state/actions/events';\nimport { onComputedZIndex } from '../state/actions/z_index';\nimport { chartStoreReducer, GlobalChartState } from '../state/chart_state';\nimport { getChartThemeSelector } from '../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../state/selectors/get_internal_is_intialized';\nimport { getLegendConfigSelector } from '../state/selectors/get_legend_config_selector';\nimport { ChartSize, getChartSize, getFixedChartSize } from '../utils/chart_size';\nimport { LayoutDirection } from '../utils/common';\nimport { LIGHT_THEME } from '../utils/themes/light_theme';\n\n/** @public */\nexport interface ChartProps {\n  /**\n   * The type of rendered\n   * @defaultValue `canvas`\n   */\n  renderer?: 'svg' | 'canvas';\n  size?: ChartSize;\n  className?: string;\n  id?: string;\n  title?: string;\n  description?: string;\n  children?: ReactNode;\n}\n\ninterface ChartState {\n  legendDirection: LegendPositionConfig['direction'];\n  paddingLeft: number;\n  paddingRight: number;\n  displayTitles: boolean;\n}\n\n/** @public */\nexport class Chart extends React.Component<ChartProps, ChartState> {\n  static defaultProps: Pick<ChartProps, OptionalKeys<ChartProps>> = {\n    renderer: 'canvas',\n  };\n\n  private unsubscribeToStore: Unsubscribe;\n\n  private chartStore: Store<GlobalChartState>;\n\n  private chartContainerRef: React.RefObject<HTMLDivElement>;\n\n  private chartStageRef: React.RefObject<HTMLCanvasElement>;\n\n  constructor(props: ChartProps) {\n    super(props);\n    this.chartContainerRef = createRef();\n    this.chartStageRef = createRef();\n\n    const id = props.id ?? uuidv4();\n    const storeReducer = chartStoreReducer(id, props.title, props.description);\n    this.chartStore = createStore(storeReducer);\n    this.state = {\n      legendDirection: LayoutDirection.Vertical,\n      paddingLeft: LIGHT_THEME.chartMargins.left,\n      paddingRight: LIGHT_THEME.chartMargins.right,\n      displayTitles: true,\n    };\n    this.unsubscribeToStore = this.chartStore.subscribe(() => {\n      const state = this.chartStore.getState();\n      if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n        return;\n      }\n\n      const {\n        legendPosition: { direction },\n      } = getLegendConfigSelector(state);\n      if (this.state.legendDirection !== direction) {\n        this.setState({\n          legendDirection: direction,\n        });\n      }\n      const theme = getChartThemeSelector(state);\n      this.setState({\n        paddingLeft: theme.chartMargins.left,\n        paddingRight: theme.chartMargins.right,\n        displayTitles: state.internalChartState?.canDisplayChartTitles(state) ?? true,\n      });\n      if (state.internalChartState) {\n        state.internalChartState.eventCallbacks(state);\n      }\n    });\n  }\n\n  componentDidMount() {\n    if (this.chartContainerRef.current) {\n      const zIndex = getElementZIndex(this.chartContainerRef.current, document.body);\n      this.chartStore.dispatch(onComputedZIndex(zIndex));\n    }\n  }\n\n  componentWillUnmount() {\n    this.unsubscribeToStore();\n  }\n\n  componentDidUpdate({ title, description, size }: Readonly<ChartProps>) {\n    if (title !== this.props.title || description !== this.props.description) {\n      this.chartStore.dispatch(updateChartTitles(this.props.title, this.props.description));\n    }\n    const prevChartSize = getChartSize(size);\n    const newChartSize = getFixedChartSize(this.props.size);\n    // if the size is specified in pixels then update directly the store\n    if (newChartSize && (newChartSize.width !== prevChartSize.width || newChartSize.height !== prevChartSize.height)) {\n      this.chartStore.dispatch(updateParentDimensions({ ...newChartSize, top: 0, left: 0 }));\n    }\n  }\n\n  getPNGSnapshot(\n    // eslint-disable-next-line unicorn/no-object-as-default-parameter\n    options = {\n      backgroundColor: Colors.Transparent.keyword,\n    },\n  ): {\n    blobOrDataUrl: any;\n    browser: 'IE11' | 'other';\n  } | null {\n    if (!this.chartStageRef.current) {\n      return null;\n    }\n    const canvas = this.chartStageRef.current;\n    const backgroundCanvas = document.createElement('canvas');\n    backgroundCanvas.width = canvas.width;\n    backgroundCanvas.height = canvas.height;\n    const bgCtx = backgroundCanvas.getContext('2d');\n    if (!bgCtx) {\n      return null;\n    }\n    bgCtx.fillStyle = options.backgroundColor;\n    bgCtx.fillRect(0, 0, canvas.width, canvas.height);\n    bgCtx.drawImage(canvas, 0, 0);\n\n    return {\n      blobOrDataUrl: backgroundCanvas.toDataURL(),\n      browser: 'other',\n    };\n  }\n\n  getChartContainerRef = () => this.chartContainerRef;\n\n  dispatchExternalPointerEvent(event: PointerEvent) {\n    this.chartStore.dispatch(onExternalPointerEvent(event));\n  }\n\n  render() {\n    const { size, className } = this.props;\n    const containerSizeStyle = getChartSize(size);\n    const chartContentClassNames = classNames('echChartContent', className, {\n      'echChartContent--column': this.state.legendDirection === LayoutDirection.Horizontal,\n    });\n\n    return (\n      <Provider store={this.chartStore}>\n        <div className=\"echChart\" style={containerSizeStyle}>\n          <Titles\n            displayTitles={this.state.displayTitles}\n            title={this.props.title}\n            description={this.props.description}\n            paddingLeft={this.state.paddingLeft}\n            paddingRight={this.state.paddingRight}\n          />\n          <div className={chartContentClassNames}>\n            <ChartBackground />\n            <ChartStatus />\n            <ChartResizer />\n            <Legend />\n            {/* TODO: Add renderFn to error boundary */}\n            <ErrorBoundary>\n              <SpecsParser>{this.props.children}</SpecsParser>\n              <div className=\"echContainer\" ref={this.chartContainerRef}>\n                <ChartContainer getChartContainerRef={this.getChartContainerRef} forwardStageRef={this.chartStageRef} />\n              </div>\n            </ErrorBoundary>\n          </div>\n        </div>\n      </Provider>\n    );\n  }\n}\n\nfunction Titles({\n  displayTitles,\n  title,\n  description,\n  paddingLeft,\n  paddingRight,\n}: Pick<ChartProps, 'title' | 'description'> & Pick<ChartState, 'displayTitles' | 'paddingLeft' | 'paddingRight'>) {\n  if (!displayTitles || (!title && !description)) return null;\n\n  const titleDescStyle: CSSProperties = {\n    paddingLeft,\n    paddingRight,\n  };\n\n  return (\n    <div className=\"echChart__titles\">\n      {title && (\n        <h3 className=\"echChartTitle\" style={titleDescStyle}>\n          {title}\n        </h3>\n      )}\n      {description && (\n        <h4 className=\"echChartDescription\" style={titleDescStyle}>\n          {description}\n        </h4>\n      )}\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { Colors } from '../common/colors';\nimport { GlobalChartState } from '../state/chart_state';\nimport { getChartThemeSelector } from '../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../state/selectors/get_internal_is_intialized';\n\ninterface ChartBackgroundProps {\n  backgroundColor: string;\n}\n\n/** @internal */\nexport class ChartBackgroundComponent extends React.Component<ChartBackgroundProps> {\n  static displayName = 'ChartBackground';\n\n  render() {\n    const { backgroundColor } = this.props;\n    return <div className=\"echChartBackground\" style={{ backgroundColor }} />;\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): ChartBackgroundProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return {\n      backgroundColor: Colors.Transparent.keyword,\n    };\n  }\n  return {\n    backgroundColor: getChartThemeSelector(state).background.color,\n  };\n};\n\n/** @internal */\nexport const ChartBackground = connect(mapStateToProps)(ChartBackgroundComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { CSSProperties } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { NoResults } from './no_results';\nimport { ChartType } from '../chart_types';\nimport { DEFAULT_CSS_CURSOR, SECONDARY_BUTTON } from '../common/constants';\nimport { SettingsSpec, TooltipSpec } from '../specs';\nimport { onKeyPress as onKeyPressAction } from '../state/actions/key';\nimport {\n  onMouseUp as onMouseUpAction,\n  onMouseDown as onMouseDownAction,\n  onPointerMove as onPointerMoveAction,\n} from '../state/actions/mouse';\nimport { pinTooltip as pinTooltipAction } from '../state/actions/tooltip';\nimport { GlobalChartState, BackwardRef, TooltipInteractionState } from '../state/chart_state';\nimport { isPinnableTooltip } from '../state/selectors/can_pin_tooltip';\nimport { getInternalChartRendererSelector } from '../state/selectors/get_chart_type_components';\nimport { getInternalPointerCursor } from '../state/selectors/get_internal_cursor_pointer';\nimport { getInternalIsBrushingSelector } from '../state/selectors/get_internal_is_brushing';\nimport { getInternalIsBrushingAvailableSelector } from '../state/selectors/get_internal_is_brushing_available';\nimport { getInternalIsInitializedSelector, InitStatus } from '../state/selectors/get_internal_is_intialized';\nimport { getSettingsSpecSelector } from '../state/selectors/get_settings_spec';\nimport { getTooltipSpecSelector } from '../state/selectors/get_tooltip_spec';\nimport { isInternalChartEmptySelector } from '../state/selectors/is_chart_empty';\nimport { deepEqual } from '../utils/fast_deep_equal';\n\ninterface ChartContainerComponentStateProps {\n  status: InitStatus;\n  isChartEmpty?: boolean;\n  pointerCursor: CSSProperties['cursor'];\n  isBrushing: boolean;\n  tooltipState: TooltipInteractionState;\n  initialized?: boolean;\n  canPinTooltip: boolean;\n  isBrushingAvailable: boolean;\n  settings?: SettingsSpec;\n  tooltip: TooltipSpec;\n  disableInteractions: boolean;\n  internalChartRenderer: (\n    containerRef: BackwardRef,\n    forwardStageRef: React.RefObject<HTMLCanvasElement>,\n  ) => JSX.Element | null;\n}\ninterface ChartContainerComponentDispatchProps {\n  onPointerMove: typeof onPointerMoveAction;\n  onMouseUp: typeof onMouseUpAction;\n  onMouseDown: typeof onMouseDownAction;\n  onKeyPress: typeof onKeyPressAction;\n  pinTooltip: typeof pinTooltipAction;\n}\n\ninterface ChartContainerComponentOwnProps {\n  getChartContainerRef: BackwardRef;\n  forwardStageRef: React.RefObject<HTMLCanvasElement>;\n}\n\ntype ReactiveChartProps = ChartContainerComponentStateProps &\n  ChartContainerComponentDispatchProps &\n  ChartContainerComponentOwnProps;\n\nclass ChartContainerComponent extends React.Component<ReactiveChartProps> {\n  static displayName = 'ChartContainer';\n  static watchedKeys: KeyboardEvent['key'][] = ['Escape'];\n\n  shouldComponentUpdate(nextProps: ReactiveChartProps) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  handleMouseMove = ({\n    nativeEvent: { offsetX, offsetY, timeStamp },\n  }: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, onPointerMove, internalChartRenderer } = this.props;\n    if (isChartEmpty || disableInteractions || internalChartRenderer.name === 'FlameWithTooltip') {\n      // Flame chart does its own event handling, and panning temporarily attaches\n      // an event handler onto `window`. So this `chart_container.handleMouseMove`\n      // can not be avoided with `e.stopPropagation()`. So we should avoid emission\n      return;\n    }\n\n    onPointerMove(\n      {\n        x: offsetX,\n        y: offsetY,\n      },\n      timeStamp,\n    );\n  };\n\n  handleMouseLeave = ({ nativeEvent: { timeStamp } }: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, onPointerMove, isBrushing } = this.props;\n    if (isChartEmpty || disableInteractions || isBrushing) {\n      return;\n    }\n    onPointerMove({ x: -1, y: -1 }, timeStamp);\n  };\n\n  handleMouseDown = ({\n    nativeEvent: { offsetX, offsetY, timeStamp, button, ctrlKey },\n  }: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, onMouseDown, isBrushingAvailable, tooltipState } = this.props;\n\n    // button 2 to block brushing on right click\n    if (tooltipState.pinned || button === SECONDARY_BUTTON || ctrlKey || isChartEmpty || disableInteractions) return;\n\n    if (isBrushingAvailable) {\n      window.addEventListener('mouseup', this.handleBrushEnd);\n    }\n\n    window.addEventListener('keyup', this.handleKeyUp);\n\n    onMouseDown(\n      {\n        x: offsetX,\n        y: offsetY,\n      },\n      timeStamp,\n    );\n  };\n\n  handleUnpinningTooltip = () => {\n    window.removeEventListener('keyup', this.handleKeyUp);\n    window.removeEventListener('click', this.handleUnpinningTooltip);\n    window.removeEventListener('scroll', this.handleUnpinningTooltip);\n    window.removeEventListener('visibilitychange', this.handleUnpinningTooltip);\n    this.props.pinTooltip(false, true);\n  };\n\n  handleContextMenu = (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, tooltipState } = this.props;\n    if (isChartEmpty || disableInteractions) {\n      return;\n    }\n\n    e.preventDefault(); // prevent browser context menu\n\n    if (tooltipState.pinned) {\n      this.handleUnpinningTooltip();\n      return;\n    }\n\n    window.addEventListener('keyup', this.handleKeyUp);\n    window.addEventListener('click', this.handleUnpinningTooltip);\n    window.addEventListener('scroll', this.handleUnpinningTooltip);\n    window.addEventListener('visibilitychange', this.handleUnpinningTooltip);\n\n    this.props.pinTooltip(true);\n  };\n\n  handleMouseUp = ({ nativeEvent: { offsetX, offsetY, timeStamp } }: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n    const { isChartEmpty, disableInteractions, onMouseUp, tooltipState } = this.props;\n    if (tooltipState.pinned || isChartEmpty || disableInteractions) {\n      return;\n    }\n\n    window.removeEventListener('keyup', this.handleKeyUp);\n\n    onMouseUp(\n      {\n        x: offsetX,\n        y: offsetY,\n      },\n      timeStamp,\n    );\n  };\n\n  handleKeyUp = ({ key }: KeyboardEvent) => {\n    if (!ChartContainerComponent.watchedKeys.includes(key)) return;\n\n    window.removeEventListener('keyup', this.handleKeyUp);\n\n    const { isChartEmpty, disableInteractions, onKeyPress } = this.props;\n    if (isChartEmpty || disableInteractions) {\n      return;\n    }\n\n    onKeyPress(key);\n  };\n\n  handleBrushEnd = () => {\n    const { onMouseUp } = this.props;\n\n    window.removeEventListener('mouseup', this.handleBrushEnd);\n    onMouseUp({ x: -1, y: -1 }, Date.now());\n  };\n\n  render() {\n    const { status, isChartEmpty, settings, initialized } = this.props;\n\n    if (!initialized || status === InitStatus.ParentSizeInvalid) {\n      // TODO: Display error on chart\n      return null;\n    }\n\n    if (\n      status === InitStatus.ChartNotInitialized ||\n      status === InitStatus.MissingChartType ||\n      status === InitStatus.SpecNotInitialized ||\n      isChartEmpty\n    ) {\n      return <NoResults renderFn={settings?.noResults} />;\n    }\n\n    const { pointerCursor, internalChartRenderer, getChartContainerRef, forwardStageRef } = this.props;\n\n    return (\n      <div\n        className=\"echChartPointerContainer\"\n        style={{\n          cursor: pointerCursor,\n        }}\n        onMouseMove={this.handleMouseMove}\n        onMouseLeave={this.handleMouseLeave}\n        onMouseDown={this.handleMouseDown}\n        onMouseUp={this.handleMouseUp}\n        onContextMenu={this.props.canPinTooltip ? this.handleContextMenu : undefined}\n      >\n        {internalChartRenderer(getChartContainerRef, forwardStageRef)}\n      </div>\n    );\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ChartContainerComponentDispatchProps =>\n  bindActionCreators(\n    {\n      onPointerMove: onPointerMoveAction,\n      onMouseUp: onMouseUpAction,\n      onMouseDown: onMouseDownAction,\n      onKeyPress: onKeyPressAction,\n      pinTooltip: pinTooltipAction,\n    },\n    dispatch,\n  );\nconst mapStateToProps = (state: GlobalChartState): ChartContainerComponentStateProps => {\n  const status = getInternalIsInitializedSelector(state);\n  const settings = getSettingsSpecSelector(state);\n  const tooltip = getTooltipSpecSelector(state);\n  const initialized = !state.specParsing && state.specsInitialized;\n  const tooltipState = state.interactions.tooltip;\n\n  if (status !== InitStatus.Initialized) {\n    return {\n      status,\n      initialized,\n      tooltipState,\n      canPinTooltip: false,\n      pointerCursor: DEFAULT_CSS_CURSOR,\n      isBrushingAvailable: false,\n      isBrushing: false,\n      internalChartRenderer: () => null,\n      settings,\n      tooltip,\n      disableInteractions: false,\n    };\n  }\n\n  return {\n    status,\n    initialized,\n    tooltipState,\n    isChartEmpty: isInternalChartEmptySelector(state),\n    canPinTooltip: isPinnableTooltip(state),\n    pointerCursor: getInternalPointerCursor(state),\n    isBrushingAvailable: getInternalIsBrushingAvailableSelector(state),\n    isBrushing: getInternalIsBrushingSelector(state),\n    internalChartRenderer: getInternalChartRendererSelector(state),\n    settings,\n    tooltip,\n    disableInteractions: state.chartType === ChartType.Flame,\n  };\n};\n\n/** @internal */\nexport const ChartContainer = connect(mapStateToProps, mapDispatchToProps)(ChartContainerComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { RefObject } from 'react';\nimport { connect } from 'react-redux';\nimport { Dispatch, bindActionCreators } from 'redux';\n\nimport { ResizeListener } from '../specs/settings';\nimport { updateParentDimensions } from '../state/actions/chart_settings';\nimport { GlobalChartState } from '../state/chart_state';\nimport { getSettingsSpecSelector } from '../state/selectors/get_settings_spec';\n\ninterface ResizerStateProps {\n  onResize?: ResizeListener;\n}\n\ninterface ResizerDispatchProps {\n  updateParentDimensions: typeof updateParentDimensions;\n}\n\ntype ResizerProps = ResizerStateProps & ResizerDispatchProps;\ntype ResizeFn = (entries: ResizeObserverEntry[]) => void;\n\nclass Resizer extends React.Component<ResizerProps> {\n  private readonly containerRef: RefObject<HTMLDivElement>;\n\n  private ro: ResizeObserver;\n\n  constructor(props: ResizerProps) {\n    super(props);\n    this.containerRef = React.createRef();\n    this.ro = new ResizeObserver(this.onResize);\n  }\n\n  componentDidMount() {\n    if (this.containerRef.current) {\n      this.ro.observe(this.containerRef.current as Element);\n    }\n  }\n\n  componentWillUnmount() {\n    this.ro.disconnect();\n  }\n\n  onResize: ResizeFn = (entries) => {\n    if (!Array.isArray(entries)) {\n      return;\n    }\n    if (entries.length === 0 || !entries[0]) {\n      return;\n    }\n    const { width, height } = entries[0].contentRect;\n    this.props.updateParentDimensions({ width, height, top: 0, left: 0 });\n    this.props.onResize?.();\n  };\n\n  render() {\n    return <div ref={this.containerRef} className=\"echChartResizer\" />;\n  }\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): ResizerDispatchProps =>\n  bindActionCreators({ updateParentDimensions }, dispatch);\n\nconst mapStateToProps = (state: GlobalChartState): ResizerStateProps => {\n  const { onResize } = getSettingsSpecSelector(state);\n  return { onResize };\n};\n\n/** @internal */\nexport const ChartResizer = connect(mapStateToProps, mapDispatchToProps)(Resizer);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { RenderChangeListener, WillRenderListener } from '../specs';\nimport { GlobalChartState } from '../state/chart_state';\nimport { globalSelectorCache } from '../state/create_selector';\nimport { getDebugStateSelector } from '../state/selectors/get_debug_state';\nimport { getSettingsSpecSelector } from '../state/selectors/get_settings_spec';\nimport { DebugState } from '../state/types';\n\ninterface ChartStatusStateProps {\n  chartId: string;\n  rendered: boolean;\n  renderedCount: number;\n  onRenderChange?: RenderChangeListener;\n  onWillRender?: WillRenderListener;\n  debugState: DebugState | null;\n}\n\nclass ChartStatusComponent extends React.Component<ChartStatusStateProps> {\n  componentDidMount() {\n    this.dispatchRenderChange();\n  }\n\n  componentDidUpdate() {\n    this.dispatchRenderChange();\n  }\n\n  componentWillUnmount() {\n    globalSelectorCache.removeKeyFromAll(this.props.chartId);\n  }\n\n  dispatchRenderChange = () => {\n    const { onWillRender, onRenderChange, rendered } = this.props;\n    onWillRender?.();\n\n    if (onRenderChange) {\n      window.requestAnimationFrame(() => {\n        onRenderChange(rendered);\n      });\n    }\n  };\n\n  render() {\n    const { rendered, renderedCount, debugState } = this.props;\n    const debugStateString: string | null = debugState && JSON.stringify(debugState);\n    return (\n      <div\n        className=\"echChartStatus\"\n        data-ech-render-complete={rendered}\n        data-ech-render-count={renderedCount}\n        data-ech-debug-state={debugStateString}\n      />\n    );\n  }\n}\n\nconst mapStateToProps = (state: GlobalChartState): ChartStatusStateProps => {\n  const { onWillRender, onRenderChange, debugState } = getSettingsSpecSelector(state);\n\n  return {\n    chartId: state.chartId,\n    rendered: state.chartRendered,\n    renderedCount: state.chartRenderedCount,\n    onWillRender,\n    onRenderChange,\n    debugState: debugState ? getDebugStateSelector(state) : null,\n  };\n};\n\n/** @internal */\nexport const ChartStatus = connect(mapStateToProps)(ChartStatusComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { Component, ReactNode } from 'react';\n\nimport { isGracefulError } from './errors';\nimport { SettingsSpec } from '../../specs/settings';\nimport { NoResults } from '../no_results';\n\ntype ErrorBoundaryProps = {\n  children: ReactNode;\n  renderFn?: SettingsSpec['noResults'];\n};\n\ninterface ErrorBoundaryState {\n  hasError: boolean;\n}\n\n/**\n * Error Boundary to catch and handle custom errors\n * @internal\n */\nexport class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  hasError = false;\n\n  componentDidUpdate() {\n    if (this.hasError) {\n      this.hasError = false;\n    }\n  }\n\n  componentDidCatch(error: Error) {\n    if (isGracefulError(error)) {\n      this.hasError = true;\n      this.forceUpdate();\n    }\n  }\n\n  render() {\n    if (this.hasError) {\n      return <NoResults renderFn={this.props.renderFn} />;\n    }\n\n    return this.props.children;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const ErrorType = Object.freeze({\n  Graceful: 'graceful' as const,\n});\n/** @public */\nexport type ErrorType = $Values<typeof ErrorType>;\n\n/**\n * Error to used to gracefully render empty chart\n * @internal\n */\nexport class GracefulError extends Error {\n  type = ErrorType.Graceful;\n}\n\n/** @internal */\nexport function isGracefulError(error: Error): error is GracefulError {\n  return (error as GracefulError)?.type === ErrorType.Graceful;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* @internal */\nexport { ErrorBoundary } from './error_boundary';\n/* @internal */\nexport * from './errors';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { ComponentType, CSSProperties } from 'react';\n\ninterface AlignedGridProps<D> {\n  data: Array<Array<D | undefined>>;\n  contentComponent: ComponentType<{\n    datum: D;\n    stats: { rows: number; rowIndex: number; columns: number; columnIndex: number };\n  }>;\n}\n\n/** @internal */\nexport function AlignedGrid<D>({ data, contentComponent: ContentComponent }: AlignedGridProps<D>) {\n  const rows = data.length;\n  const columns = data.reduce((acc, row) => {\n    return Math.max(acc, row.length);\n  }, 0);\n\n  const gridStyle: CSSProperties = {\n    gridTemplateColumns: `repeat(${columns}, 1fr`,\n    gridTemplateRows: `repeat(${rows}, max-content 1fr)`,\n  };\n\n  return (\n    <div className=\"echAlignedGrid\" style={gridStyle}>\n      {data.map((row, rowIndex) =>\n        row.map((cell, columnIndex) => {\n          const headerStyle: CSSProperties = {\n            gridRow: rowIndex * 2 + 1,\n            gridColumn: columnIndex + 1,\n          };\n          const contentStyle: CSSProperties = {\n            gridRow: rowIndex * 2 + 2,\n            gridColumn: columnIndex + 1,\n          };\n          const headerClassName = classNames('echAlignedGrid--header', {\n            echAlignedGrid__borderRight: columnIndex < columns - 1,\n          });\n          const contentClassName = classNames('echAlignedGrid--content', {\n            echAlignedGrid__borderRight: columnIndex < columns - 1,\n            echAlignedGrid__borderBottom: rowIndex < rows - 1,\n          });\n          if (!cell) {\n            return (\n              <>\n                <div className={headerClassName} style={headerStyle}></div>\n                <div className={contentClassName} style={contentStyle}></div>\n              </>\n            );\n          }\n\n          return (\n            <div key={`${rowIndex}-${columnIndex}`} className={contentClassName} style={contentStyle}>\n              <ContentComponent datum={cell} stats={{ rowIndex, columnIndex, columns, rows }} />\n            </div>\n          );\n        }),\n      )}\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function AlertIcon(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps}>\n      <path\n        fillRule=\"evenodd\"\n        d=\"M8.378 1.496l6.695 10.984A1 1 0 0 1 14.22 14H1.667a1 1 0 0 1-.883-1.47L6.642 1.545a1 1 0 0 1 1.736-.05zm-.853.52L1.667 13h12.552L7.525 2.016zM7.14 10.06L6.9 5.18h1.3l-.25 4.878h-.81zm.394 1.901a.61.61 0 0 1-.448-.186.606.606 0 0 1-.186-.444c0-.174.062-.323.186-.446a.614.614 0 0 1 .448-.184c.169 0 .315.06.44.182.124.122.186.27.186.448a.6.6 0 0 1-.189.446.607.607 0 0 1-.437.184z\"\n      />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { deepEqual } from '../../../utils/fast_deep_equal';\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport class DotIcon extends React.Component<IconComponentProps> {\n  shouldComponentUpdate(nextProps: IconComponentProps) {\n    return !deepEqual(this.props, nextProps);\n  }\n\n  render() {\n    return (\n      <svg width={16} height={16} viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\" {...this.props}>\n        <circle cx={8} cy={8} r={4} />\n      </svg>\n    );\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function DownArrowIcon(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\" width=\"16\" height=\"16\" {...extraProps}>\n      <path d=\"M 9.199 12.345 L 13.78 5.145 C 14.375 4.21 13.692 3 12.581 3 H 3.419 C 2.308 3 1.625 4.21 2.22 5.146 L 6.801 12.346 A 1.425 1.425 90 0 0 9.199 12.346 Z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function EmptyIcon(extraProps: IconComponentProps) {\n  return <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps} />;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function EyeIcon(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps}>\n      <path d=\"M15.98 7.873c.013.03.02.064.02.098v.06a.24.24 0 0 1-.02.097C15.952 8.188 13.291 14 8 14S.047 8.188.02 8.128A.24.24 0 0 1 0 8.03v-.059c0-.034.007-.068.02-.098C.048 7.813 2.709 2 8 2s7.953 5.813 7.98 5.873zm-1.37-.424a12.097 12.097 0 0 0-1.385-1.862C11.739 3.956 9.999 3 8 3c-2 0-3.74.956-5.225 2.587a12.098 12.098 0 0 0-1.701 2.414 12.095 12.095 0 0 0 1.7 2.413C4.26 12.043 6.002 13 8 13s3.74-.956 5.225-2.587A12.097 12.097 0 0 0 14.926 8c-.08-.15-.189-.343-.315-.551zM8 4.75A3.253 3.253 0 0 1 11.25 8 3.254 3.254 0 0 1 8 11.25 3.253 3.253 0 0 1 4.75 8 3.252 3.252 0 0 1 8 4.75zm0 1C6.76 5.75 5.75 6.76 5.75 8S6.76 10.25 8 10.25 10.25 9.24 10.25 8 9.24 5.75 8 5.75zm0 1.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function EyeClosedIcon(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps}>\n      <path d=\"M5.318 13.47l.776-.776A6.04 6.04 0 0 0 8 13c1.999 0 3.74-.956 5.225-2.587A12.097 12.097 0 0 0 14.926 8a12.097 12.097 0 0 0-1.701-2.413l-.011-.012.707-.708c1.359 1.476 2.045 2.976 2.058 3.006.014.03.021.064.021.098v.06a.24.24 0 0 1-.02.097C15.952 8.188 13.291 14 8 14a7.03 7.03 0 0 1-2.682-.53zM2.04 11.092C.707 9.629.034 8.158.02 8.128A.24.24 0 0 1 0 8.03v-.059c0-.034.007-.068.02-.098C.048 7.813 2.709 2 8 2c.962 0 1.837.192 2.625.507l-.78.78A6.039 6.039 0 0 0 8 3c-2 0-3.74.956-5.225 2.587a12.098 12.098 0 0 0-1.701 2.414 12.11 12.11 0 0 0 1.674 2.383l-.708.708zM8.362 4.77L7.255 5.877a2.262 2.262 0 0 0-1.378 1.378L4.77 8.362A3.252 3.252 0 0 1 8.362 4.77zm2.86 2.797a3.254 3.254 0 0 1-3.654 3.654l1.06-1.06a2.262 2.262 0 0 0 1.533-1.533l1.06-1.06zm-9.368 7.287a.5.5 0 0 1-.708-.708l13-13a.5.5 0 0 1 .708.708l-13 13z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function ListIcon(extraProps: IconComponentProps) {\n  return (\n    <svg width={16} height={16} xmlns=\"http://www.w3.org/2000/svg\" {...extraProps}>\n      <path d=\"M2 4V3h2v1H2zm4 0V3h8v1H6zm0 3V6h8v1H6zm0 3V9h8v1H6zM2 7V6h2v1H2zm0 3V9h2v1H2zm4 3v-1h8v1H6zm-4 0v-1h2v1H2z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { IconComponentProps } from '../icon';\n\n/** @internal */\nexport function QuestionInCircle(extraProps: IconComponentProps) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" {...extraProps}>\n      <path d=\"M8 14A6 6 0 1 1 8 2a6 6 0 0 1 0 12zm0-1A5 5 0 1 0 8 3a5 5 0 0 0 0 10zm-.186-1.065A.785.785 0 0 1 7 11.12c0-.48.34-.82.814-.82.475 0 .809.34.809.82 0 .475-.334.815-.809.815zM5.9 6.317C5.96 5.168 6.755 4.4 8.048 4.4c1.218 0 2.091.759 2.091 1.8 0 .736-.36 1.304-1.03 1.707-.56.33-.717.56-.717 1.022v.305l-.1.1H7.47l-.1-.1v-.431c-.005-.646.302-1.104.987-1.514.527-.322.708-.59.708-1.047 0-.536-.416-.91-1.05-.91-.652 0-1.064.374-1.112.998l-.1.092H6l-.1-.105z\" />\n    </svg>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { SVGAttributes, memo } from 'react';\n\nimport { AlertIcon } from './assets/alert';\nimport { DotIcon } from './assets/dot';\nimport { DownArrowIcon } from './assets/down_arrow';\nimport { EmptyIcon } from './assets/empty';\nimport { EyeIcon } from './assets/eye';\nimport { EyeClosedIcon } from './assets/eye_closed';\nimport { ListIcon } from './assets/list';\nimport { QuestionInCircle } from './assets/question_in_circle';\nimport { deepEqual } from '../../utils/fast_deep_equal';\n\nconst typeToIconMap = {\n  alert: AlertIcon,\n  dot: DotIcon,\n  empty: EmptyIcon,\n  eye: EyeIcon,\n  eyeClosed: EyeClosedIcon,\n  list: ListIcon,\n  questionInCircle: QuestionInCircle,\n  downArrow: DownArrowIcon,\n};\n\n/** @internal */\nexport type IconColor = string;\n\n/** @internal */\nexport type IconType = keyof typeof typeToIconMap;\n\ninterface IconProps {\n  className?: string;\n  'aria-label'?: string;\n  'data-test-subj'?: string;\n  type?: IconType;\n  color?: IconColor;\n}\n\n/** @internal */\nexport type IconComponentProps = Omit<SVGAttributes<SVGElement>, 'color' | 'type'> & IconProps;\n\nfunction IconComponent({ type, color, className, tabIndex, ...rest }: IconComponentProps) {\n  let optionalCustomStyles = null;\n\n  if (color) {\n    optionalCustomStyles = { color };\n  }\n\n  const classes = classNames('echIcon', className);\n  const Svg = (type && typeToIconMap[type]) || EmptyIcon;\n\n  /*\n   * This is a fix for IE and Edge, which ignores tabindex=\"-1\" on an SVG, but respects\n   * focusable=\"false\".\n   *   - If there's no tab index specified, we'll default the icon to not be focusable,\n   *     which is how SVGs behave in Chrome, Safari, and FF.\n   *   - If tab index is -1, then the consumer wants the icon to not be focusable.\n   *   - For all other values, the consumer wants the icon to be focusable.\n   */\n  const focusable = tabIndex === undefined || tabIndex === -1 ? 'false' : 'true';\n\n  return <Svg className={classes} {...optionalCustomStyles} tabIndex={tabIndex} focusable={focusable} {...rest} />;\n}\n\nIconComponent.displayName = 'Icon';\n\n/** @internal */\nexport const Icon = memo(IconComponent, deepEqual);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './chart';\nexport { Placement, TooltipPortalSettings } from './portal';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { MouseEventHandler, forwardRef, memo } from 'react';\n\nimport { LegendIcon } from './legend_icon';\nimport { PointStyle } from '../../utils/themes/theme';\nimport { Icon } from '../icons/icon';\n\ninterface ColorProps {\n  color: string;\n  seriesName: string;\n  hasColorPicker: boolean;\n  isSeriesHidden?: boolean;\n  pointStyle?: PointStyle;\n  onClick?: MouseEventHandler;\n}\n\n/**\n * Color component used by the legend item\n * @internal\n */\nexport const Color = memo(\n  forwardRef<HTMLButtonElement, ColorProps>(\n    ({ color, seriesName, isSeriesHidden = false, hasColorPicker, onClick, pointStyle }, ref) => {\n      if (isSeriesHidden) {\n        return (\n          <div className=\"echLegendItem__color\" title=\"series hidden\">\n            {/* changing the default viewBox for the eyeClosed icon to keep the same dimensions */}\n            <Icon type=\"eyeClosed\" viewBox=\"-3 -3 22 22\" aria-label={`series ${seriesName} is hidden`} />\n          </div>\n        );\n      }\n\n      if (hasColorPicker) {\n        return (\n          <button\n            type=\"button\"\n            onClick={onClick}\n            className=\"echLegendItem__color echLegendItem__color--changable\"\n            title=\"change series color\"\n            ref={ref}\n          >\n            <LegendIcon pointStyle={pointStyle} color={color} ariaLabel={`Change series color, currently ${color}`} />\n          </button>\n        );\n      }\n\n      return (\n        <div className=\"echLegendItem__color\" title=\"series color\">\n          <LegendIcon pointStyle={pointStyle} color={color} ariaLabel={`series color: ${color}`} />\n        </div>\n      );\n    },\n  ),\n);\nColor.displayName = 'Color';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\nimport { connect } from 'react-redux';\n\nimport { CustomLegendProps, CustomLegend as CustomLegendComponent } from '../../specs';\nimport { GlobalChartState } from '../../state/chart_state';\nimport { getPointerValueSelector } from '../../state/selectors/get_pointer_value';\n\ninterface Props extends CustomLegendProps {\n  component: CustomLegendComponent;\n}\n\nconst CustomLegendComponent: React.FC<Props> = ({ component: Component, ...props }) => <Component {...props} />;\n\nconst mapStateToProps = (state: GlobalChartState) => ({\n  pointerValue: getPointerValueSelector(state),\n});\n\n/** @internal */\nexport const CustomLegend = connect(mapStateToProps)(CustomLegendComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\n/**\n * @internal\n * @param extra\n * @param isSeriesHidden\n */\nexport function renderExtra(extra: string) {\n  return (\n    <div className=\"echLegendItem__extra\" title={`${extra}`}>\n      {extra}\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { KeyboardEventHandler, MouseEventHandler, useCallback } from 'react';\n\nimport { isRTLString } from '../../utils/common';\nimport { LegendLabelOptions } from '../../utils/themes/theme';\n\ninterface LabelProps {\n  label: string;\n  isSeriesHidden?: boolean;\n  isToggleable?: boolean;\n  onToggle?: (negate: boolean) => void;\n  options: LegendLabelOptions;\n}\n\n/**\n * Label component used to display text in legend item\n * @internal\n */\nexport function Label({ label, isToggleable, onToggle, isSeriesHidden, options }: LabelProps) {\n  const maxLines = Math.abs(options.maxLines);\n  const labelClassNames = classNames('echLegendItem__label', {\n    'echLegendItem__label--clickable': Boolean(onToggle),\n    'echLegendItem__label--singleline': maxLines === 1,\n    'echLegendItem__label--multiline': maxLines > 1,\n  });\n\n  const onClick: MouseEventHandler = useCallback(({ shiftKey }) => onToggle?.(shiftKey), [onToggle]);\n  const onKeyDown: KeyboardEventHandler = useCallback(\n    ({ key, shiftKey }) => {\n      if (key === ' ' || key === 'Enter') onToggle?.(shiftKey);\n    },\n    [onToggle],\n  );\n\n  const dir = isRTLString(label) ? 'rtl' : 'ltr'; // forced for individual labels in case mixed charset\n  const title = options.maxLines > 0 ? label : ''; // full text already visible\n  const clampStyles = maxLines > 1 ? { WebkitLineClamp: maxLines } : {};\n\n  return isToggleable ? (\n    // This div is required to allow multiline text truncation, all ARIA requirements are still met\n    // https://stackoverflow.com/questions/68673034/webkit-line-clamp-does-not-apply-to-buttons\n    <div\n      role=\"button\"\n      tabIndex={0}\n      dir={dir}\n      className={labelClassNames}\n      title={title}\n      onClick={onClick}\n      onKeyDown={onKeyDown}\n      aria-pressed={isSeriesHidden}\n      style={clampStyles}\n      aria-label={\n        isSeriesHidden ? `${label}; Activate to show series in graph` : `${label}; Activate to hide series in graph`\n      }\n    >\n      {label}\n    </div>\n  ) : (\n    <div dir={dir} className={labelClassNames} title={label} style={clampStyles}>\n      {label}\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React from 'react';\nimport { connect } from 'react-redux';\nimport { Dispatch, bindActionCreators } from 'redux';\n\nimport { CustomLegend } from './custom_legend';\nimport { LegendItemProps, LegendListItem } from './legend_item';\nimport { getLegendPositionConfig, legendPositionStyle } from './position_style';\nimport { getLegendStyle, getLegendListStyle } from './style_utils';\nimport { LegendItem, LegendItemExtraValues } from '../../common/legend';\nimport { DEFAULT_LEGEND_CONFIG, LegendSpec } from '../../specs';\nimport { clearTemporaryColors, setTemporaryColor, setPersistedColor } from '../../state/actions/colors';\nimport {\n  onToggleDeselectSeriesAction,\n  onLegendItemOutAction,\n  onLegendItemOverAction,\n} from '../../state/actions/legend';\nimport { GlobalChartState } from '../../state/chart_state';\nimport { getChartThemeSelector } from '../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { getInternalMainProjectionAreaSelector } from '../../state/selectors/get_internal_main_projection_area';\nimport { getInternalProjectionContainerAreaSelector } from '../../state/selectors/get_internal_projection_container_area';\nimport { getLegendConfigSelector } from '../../state/selectors/get_legend_config_selector';\nimport { getLegendItemsSelector } from '../../state/selectors/get_legend_items';\nimport { getLegendExtraValuesSelector } from '../../state/selectors/get_legend_items_values';\nimport { getLegendSizeSelector } from '../../state/selectors/get_legend_size';\nimport { getSettingsSpecSelector } from '../../state/selectors/get_settings_spec';\nimport { isBrushingSelector } from '../../state/selectors/is_brushing';\nimport { hasMostlyRTLItems, HorizontalAlignment, LayoutDirection, VerticalAlignment } from '../../utils/common';\nimport { Dimensions, Size } from '../../utils/dimensions';\nimport { LIGHT_THEME } from '../../utils/themes/light_theme';\nimport { Theme } from '../../utils/themes/theme';\n\ninterface LegendStateProps {\n  debug: boolean;\n  isBrushing: boolean;\n  chartDimensions: Dimensions;\n  containerDimensions: Dimensions;\n  chartTheme: Theme;\n  size: Size;\n  config: LegendSpec;\n  items: LegendItem[];\n  extraValues: Map<string, LegendItemExtraValues>;\n}\n\ninterface LegendDispatchProps {\n  onItemOutAction: typeof onLegendItemOutAction;\n  onItemOverAction: typeof onLegendItemOverAction;\n  onToggleDeselectSeriesAction: typeof onToggleDeselectSeriesAction;\n  clearTemporaryColors: typeof clearTemporaryColors;\n  setTemporaryColor: typeof setTemporaryColor;\n  setPersistedColor: typeof setPersistedColor;\n}\n\nfunction LegendComponent(props: LegendStateProps & LegendDispatchProps) {\n  const {\n    items,\n    size,\n    debug,\n    isBrushing,\n    chartTheme: { chartMargins, legend },\n    chartDimensions,\n    containerDimensions,\n    config,\n  } = props;\n\n  if (items.every(({ isItemHidden }) => isItemHidden)) {\n    return null;\n  }\n\n  const positionConfig = getLegendPositionConfig(config.legendPosition);\n  const containerStyle = getLegendStyle(positionConfig, size, legend.margin);\n  const listStyle = getLegendListStyle(positionConfig, chartMargins, legend, items.length);\n  const isMostlyRTL = hasMostlyRTLItems(items.map(({ label }) => label));\n\n  const legendClasses = classNames('echLegend', {\n    'echLegend--debug': debug,\n    'echLegend--inert': isBrushing,\n    'echLegend--horizontal': positionConfig.direction === LayoutDirection.Horizontal,\n    'echLegend--vertical': positionConfig.direction === LayoutDirection.Vertical,\n    'echLegend--left': positionConfig.hAlign === HorizontalAlignment.Left,\n    'echLegend--right': positionConfig.hAlign === HorizontalAlignment.Right,\n    'echLegend--top': positionConfig.vAlign === VerticalAlignment.Top,\n    'echLegend--bottom': positionConfig.vAlign === VerticalAlignment.Bottom,\n  });\n\n  const itemProps: Omit<LegendItemProps, 'item'> = {\n    positionConfig,\n    isMostlyRTL,\n    totalItems: items.length,\n    extraValues: props.extraValues,\n    showExtra: config.showLegendExtra,\n    onMouseOut: config.onLegendItemOut,\n    onMouseOver: config.onLegendItemOver,\n    onClick: config.onLegendItemClick,\n    clearTemporaryColorsAction: props.clearTemporaryColors,\n    setPersistedColorAction: props.setPersistedColor,\n    setTemporaryColorAction: props.setTemporaryColor,\n    mouseOutAction: props.onItemOutAction,\n    mouseOverAction: props.onItemOverAction,\n    toggleDeselectSeriesAction: props.onToggleDeselectSeriesAction,\n    colorPicker: config.legendColorPicker,\n    action: config.legendAction,\n    labelOptions: legend.labelOptions,\n    flatLegend: config.flatLegend ?? DEFAULT_LEGEND_CONFIG.flatLegend,\n  };\n  const positionStyle = legendPositionStyle(config, size, chartDimensions, containerDimensions);\n  return (\n    <div className={legendClasses} style={positionStyle} dir={isMostlyRTL ? 'rtl' : 'ltr'}>\n      {config.customLegend ? (\n        <div style={containerStyle}>\n          <CustomLegend\n            component={config.customLegend}\n            items={items.map(({ seriesIdentifiers, childId, path, ...customProps }) => ({\n              ...customProps,\n              seriesIdentifiers,\n              path,\n              extraValue: itemProps.extraValues.get(seriesIdentifiers[0]?.key ?? '')?.get(childId ?? ''),\n              onItemOutAction: itemProps.mouseOutAction,\n              onItemOverActon: () => itemProps.mouseOverAction(path),\n              onItemClickAction: (negate: boolean) => itemProps.toggleDeselectSeriesAction(seriesIdentifiers, negate),\n            }))}\n          />\n        </div>\n      ) : (\n        <div style={containerStyle} className=\"echLegendListContainer\">\n          <ul style={listStyle} className=\"echLegendList\">\n            {items.map((item, index) => (\n              <LegendListItem key={`${index}`} item={item} {...itemProps} />\n            ))}\n          </ul>\n        </div>\n      )}\n    </div>\n  );\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): LegendDispatchProps =>\n  bindActionCreators(\n    {\n      onToggleDeselectSeriesAction,\n      onItemOutAction: onLegendItemOutAction,\n      onItemOverAction: onLegendItemOverAction,\n      clearTemporaryColors,\n      setTemporaryColor,\n      setPersistedColor,\n    },\n    dispatch,\n  );\n\nconst EMPTY_DEFAULT_STATE: LegendStateProps = {\n  chartDimensions: { width: 0, height: 0, left: 0, top: 0 },\n  containerDimensions: { width: 0, height: 0, left: 0, top: 0 },\n  items: [],\n  extraValues: new Map(),\n  debug: false,\n  isBrushing: false,\n  chartTheme: LIGHT_THEME,\n  size: { width: 0, height: 0 },\n  config: DEFAULT_LEGEND_CONFIG,\n};\n\nconst mapStateToProps = (state: GlobalChartState): LegendStateProps => {\n  if (getInternalIsInitializedSelector(state) !== InitStatus.Initialized) {\n    return EMPTY_DEFAULT_STATE;\n  }\n  const config = getLegendConfigSelector(state);\n  if (!config.showLegend) {\n    return EMPTY_DEFAULT_STATE;\n  }\n  const { debug } = getSettingsSpecSelector(state);\n  return {\n    debug,\n    isBrushing: isBrushingSelector(state),\n    chartDimensions: getInternalMainProjectionAreaSelector(state),\n    containerDimensions: getInternalProjectionContainerAreaSelector(state),\n    chartTheme: getChartThemeSelector(state),\n    size: getLegendSizeSelector(state),\n    items: getLegendItemsSelector(state),\n    extraValues: getLegendExtraValuesSelector(state),\n    config,\n  };\n};\n\n/** @internal */\nexport const Legend = connect(mapStateToProps, mapDispatchToProps)(LegendComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { ShapeRendererFn } from '../../chart_types/xy_chart/renderer/shapes_paths';\nimport { Color } from '../../common/colors';\nimport { getColorFromVariant } from '../../utils/common';\nimport { PointShape, PointStyle } from '../../utils/themes/theme';\n\ninterface LegendIconProps {\n  pointStyle?: PointStyle;\n  ariaLabel: string;\n  color: Color;\n}\n\nconst MARKER_SIZE = 8;\n\n/** @internal */\nexport const LegendIcon = ({ pointStyle, color, ariaLabel }: LegendIconProps) => {\n  const {\n    shape = PointShape.Circle,\n    stroke = color,\n    strokeWidth = 1,\n    opacity = 1,\n  } = pointStyle?.shape ? pointStyle : {};\n  const [shapeFn, rotation] = ShapeRendererFn[shape];\n\n  const adjustedSize = MARKER_SIZE - (strokeWidth ?? 0);\n  return (\n    <svg width={MARKER_SIZE * 2} height={MARKER_SIZE * 2} aria-label={ariaLabel}>\n      <g\n        transform={`\n          translate(${MARKER_SIZE}, ${MARKER_SIZE})\n          rotate(${rotation})\n        `}\n      >\n        <path\n          d={shapeFn(adjustedSize / 2)}\n          stroke={getColorFromVariant(color, stroke)}\n          strokeWidth={strokeWidth}\n          fill={color}\n          opacity={opacity}\n        />\n      </g>\n    </svg>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { Component, createRef, MouseEventHandler, CSSProperties } from 'react';\n\nimport { Color as ItemColor } from './color';\nimport { renderExtra } from './extra';\nimport { Label as ItemLabel } from './label';\nimport { getExtra } from './utils';\nimport { Color } from '../../common/colors';\nimport { LegendItem, LegendItemExtraValues } from '../../common/legend';\nimport { SeriesIdentifier } from '../../common/series_id';\nimport {\n  LegendItemListener,\n  BasicListener,\n  LegendColorPicker,\n  LegendAction,\n  LegendPositionConfig,\n} from '../../specs/settings';\nimport {\n  clearTemporaryColors as clearTemporaryColorsAction,\n  setTemporaryColor as setTemporaryColorAction,\n  setPersistedColor as setPersistedColorAction,\n} from '../../state/actions/colors';\nimport {\n  onLegendItemOutAction,\n  onLegendItemOverAction,\n  onToggleDeselectSeriesAction,\n} from '../../state/actions/legend';\nimport { LayoutDirection } from '../../utils/common';\nimport { deepEqual } from '../../utils/fast_deep_equal';\nimport { LegendLabelOptions } from '../../utils/themes/theme';\n\n/** @internal */\nexport const LEGEND_HIERARCHY_MARGIN = 10;\n\n/** @internal */\nexport interface LegendItemProps {\n  item: LegendItem;\n  flatLegend: boolean;\n  totalItems: number;\n  positionConfig: LegendPositionConfig;\n  extraValues: Map<string, LegendItemExtraValues>;\n  showExtra: boolean;\n  isMostlyRTL: boolean;\n  labelOptions: LegendLabelOptions;\n  colorPicker?: LegendColorPicker;\n  action?: LegendAction;\n  onClick?: LegendItemListener;\n  onMouseOut?: BasicListener;\n  onMouseOver?: LegendItemListener;\n  mouseOutAction: typeof onLegendItemOutAction;\n  mouseOverAction: typeof onLegendItemOverAction;\n  clearTemporaryColorsAction: typeof clearTemporaryColorsAction;\n  setTemporaryColorAction: typeof setTemporaryColorAction;\n  setPersistedColorAction: typeof setPersistedColorAction;\n  toggleDeselectSeriesAction: typeof onToggleDeselectSeriesAction;\n}\n\ninterface LegendItemState {\n  isOpen: boolean;\n  actionActive: boolean;\n}\n\n/** @internal */\nexport class LegendListItem extends Component<LegendItemProps, LegendItemState> {\n  static displayName = 'LegendItem';\n\n  shouldClearPersistedColor = false;\n\n  colorRef = createRef<HTMLButtonElement>();\n\n  state: LegendItemState = {\n    isOpen: false,\n    actionActive: false,\n  };\n\n  shouldComponentUpdate(nextProps: LegendItemProps, nextState: LegendItemState) {\n    return !deepEqual(this.props, nextProps) || !deepEqual(this.state, nextState);\n  }\n\n  handleColorClick = (changeable: boolean): MouseEventHandler | undefined =>\n    changeable\n      ? (event) => {\n          event.stopPropagation();\n          this.toggleIsOpen();\n        }\n      : undefined;\n\n  toggleIsOpen = () => {\n    this.setState(({ isOpen }) => ({ isOpen: !isOpen }));\n  };\n\n  onLegendItemMouseOver = () => {\n    const { onMouseOver, mouseOverAction, item } = this.props;\n    // call the settings listener directly if available\n    if (onMouseOver) {\n      onMouseOver(item.seriesIdentifiers);\n    }\n    mouseOverAction(item.path);\n  };\n\n  onLegendItemMouseOut = () => {\n    const { onMouseOut, mouseOutAction } = this.props;\n    // call the settings listener directly if available\n    if (onMouseOut) {\n      onMouseOut();\n    }\n    mouseOutAction();\n  };\n\n  /**\n   * Returns click function only if toggleable or click listern is provided\n   */\n  onLabelToggle = (legendItemId: SeriesIdentifier[]): ((negate: boolean) => void) | undefined => {\n    const { item, onClick, toggleDeselectSeriesAction, totalItems } = this.props;\n    if (totalItems <= 1 || (!item.isToggleable && !onClick)) {\n      return;\n    }\n\n    return (negate) => {\n      if (onClick) {\n        onClick(legendItemId);\n      }\n\n      if (item.isToggleable) {\n        toggleDeselectSeriesAction(legendItemId, negate);\n      }\n    };\n  };\n\n  renderColorPicker() {\n    const {\n      colorPicker: ColorPicker,\n      item,\n      clearTemporaryColorsAction,\n      setTemporaryColorAction,\n      setPersistedColorAction,\n    } = this.props;\n    const { seriesIdentifiers, color } = item;\n    const seriesKeys = seriesIdentifiers.map(({ key }) => key);\n    const handleClose = () => {\n      setPersistedColorAction(seriesKeys, this.shouldClearPersistedColor ? null : color);\n      clearTemporaryColorsAction();\n      requestAnimationFrame(() => this.colorRef?.current?.focus());\n      this.toggleIsOpen();\n    };\n    const handleChange = (c: Color | null) => {\n      this.shouldClearPersistedColor = c === null;\n      setTemporaryColorAction(seriesKeys, c);\n    };\n    if (ColorPicker && this.state.isOpen && this.colorRef.current) {\n      return (\n        <ColorPicker\n          anchor={this.colorRef.current}\n          color={color}\n          onClose={handleClose}\n          onChange={handleChange}\n          seriesIdentifiers={seriesIdentifiers}\n        />\n      );\n    }\n  }\n\n  render() {\n    const {\n      extraValues,\n      item,\n      showExtra,\n      colorPicker,\n      totalItems,\n      action: Action,\n      positionConfig,\n      labelOptions,\n      isMostlyRTL,\n      flatLegend,\n    } = this.props;\n    const { color, isSeriesHidden, isItemHidden, seriesIdentifiers, label, pointStyle } = item;\n\n    if (isItemHidden) return null;\n\n    const itemClassNames = classNames('echLegendItem', {\n      'echLegendItem--hidden': isSeriesHidden,\n      'echLegendItem--vertical': positionConfig.direction === LayoutDirection.Vertical,\n    });\n    const hasColorPicker = Boolean(colorPicker);\n    const extra = showExtra ? getExtra(extraValues, item, totalItems) : null;\n    const style: CSSProperties = flatLegend\n      ? {}\n      : {\n          [isMostlyRTL ? 'marginRight' : 'marginLeft']: LEGEND_HIERARCHY_MARGIN * (item.depth ?? 0),\n        };\n    return (\n      <>\n        <li\n          className={itemClassNames}\n          onMouseEnter={this.onLegendItemMouseOver}\n          onMouseLeave={this.onLegendItemMouseOut}\n          style={style}\n          dir={isMostlyRTL ? 'rtl' : 'ltr'}\n          data-ech-series-name={label}\n        >\n          <div className=\"background\" />\n          <div className=\"colorWrapper\">\n            <ItemColor\n              ref={this.colorRef}\n              color={color}\n              seriesName={label}\n              isSeriesHidden={isSeriesHidden}\n              hasColorPicker={hasColorPicker}\n              onClick={this.handleColorClick(hasColorPicker)}\n              pointStyle={pointStyle}\n            />\n          </div>\n          <ItemLabel\n            label={label}\n            options={labelOptions}\n            isToggleable={totalItems > 1 && item.isToggleable}\n            onToggle={this.onLabelToggle(seriesIdentifiers)}\n            isSeriesHidden={isSeriesHidden}\n          />\n          {extra && !isSeriesHidden && renderExtra(extra.formatted)}\n          {Action && (\n            <div className=\"echLegendItem__action\">\n              <Action series={seriesIdentifiers} color={color} label={label} />\n            </div>\n          )}\n        </li>\n        {this.renderColorPicker()}\n      </>\n    );\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\n\nimport { LegendSpec, LegendPositionConfig } from '../../specs/settings';\nimport { LayoutDirection, Position } from '../../utils/common';\nimport { Dimensions, Size } from '../../utils/dimensions';\n\nconst INSIDE_PADDING = 10;\n\n/** @internal */\nexport function legendPositionStyle(\n  { legendPosition }: LegendSpec,\n  legendSize: Size,\n  chart: Dimensions,\n  container: Dimensions,\n): CSSProperties {\n  const { vAlign, hAlign, direction, floating } = getLegendPositionConfig(legendPosition);\n  // non-float legend doesn't need a special handling\n  if (!floating) {\n    return {};\n  }\n\n  const { Left, Right, Top, Bottom } = Position;\n\n  if (direction === LayoutDirection.Vertical) {\n    return {\n      position: 'absolute',\n      zIndex: 1,\n      right: hAlign === Right ? container.width - chart.width - chart.left + INSIDE_PADDING : undefined,\n      left: hAlign === Left ? chart.left + INSIDE_PADDING : undefined,\n      top: vAlign === Top ? chart.top : undefined,\n      bottom: vAlign === Bottom ? container.height - chart.top - chart.height : undefined,\n      height: legendSize.height >= chart.height ? chart.height : undefined,\n    };\n  }\n\n  return {\n    position: 'absolute',\n    zIndex: 1,\n    right: INSIDE_PADDING,\n    left: chart.left + INSIDE_PADDING,\n    top: vAlign === Top ? chart.top : undefined,\n    bottom: vAlign === Bottom ? container.height - chart.top - chart.height : undefined,\n    height: legendSize.height >= chart.height ? chart.height : undefined,\n  };\n}\n\n/** @internal */\nexport const LEGEND_TO_FULL_CONFIG: Record<Position, LegendPositionConfig> = {\n  [Position.Left]: {\n    vAlign: Position.Top,\n    hAlign: Position.Left,\n    direction: LayoutDirection.Vertical,\n    floating: false,\n    floatingColumns: 1,\n  },\n  [Position.Top]: {\n    vAlign: Position.Top,\n    hAlign: Position.Left,\n    direction: LayoutDirection.Horizontal,\n    floating: false,\n    floatingColumns: 1,\n  },\n  [Position.Bottom]: {\n    vAlign: Position.Bottom,\n    hAlign: Position.Left,\n    direction: LayoutDirection.Horizontal,\n    floating: false,\n    floatingColumns: 1,\n  },\n  [Position.Right]: {\n    vAlign: Position.Top,\n    hAlign: Position.Right,\n    direction: LayoutDirection.Vertical,\n    floating: false,\n    floatingColumns: 1,\n  },\n};\n\n/**\n * @internal\n */\nexport function getLegendPositionConfig(position: LegendSpec['legendPosition']): LegendPositionConfig {\n  return typeof position === 'object' ? position : LEGEND_TO_FULL_CONFIG[position];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendPositionConfig } from '../../specs/settings';\nimport { clamp, LayoutDirection } from '../../utils/common';\nimport { Margins, Size } from '../../utils/dimensions';\nimport { LegendStyle as ThemeLegendStyle } from '../../utils/themes/theme';\n\n/** @internal */\nexport type LegendStyle =\n  | {\n      width?: string;\n      maxWidth?: string;\n      marginLeft?: number;\n      marginRight?: number;\n    }\n  | {\n      height?: string;\n      maxHeight?: string;\n      marginTop?: number;\n      marginBottom?: number;\n    };\n\n/** @internal */\nexport interface LegendListStyle {\n  paddingTop?: number | string;\n  paddingBottom?: number | string;\n  paddingLeft?: number | string;\n  paddingRight?: number | string;\n  gridTemplateColumns?: string;\n}\n\n/**\n * Get the legend list style\n * @internal\n */\nexport function getLegendListStyle(\n  { direction, floating, floatingColumns }: LegendPositionConfig,\n  chartMargins: Margins,\n  legendStyle: ThemeLegendStyle,\n  totalItems: number,\n): LegendListStyle {\n  const { top: paddingTop, bottom: paddingBottom, left: paddingLeft, right: paddingRight } = chartMargins;\n\n  if (direction === LayoutDirection.Horizontal) {\n    return {\n      paddingLeft,\n      paddingRight,\n      gridTemplateColumns: totalItems === 1 ? '1fr' : `repeat(auto-fill, minmax(${legendStyle.verticalWidth}px, 1fr))`,\n    };\n  }\n\n  return {\n    paddingTop,\n    paddingBottom,\n    ...(floating && {\n      gridTemplateColumns: `repeat(${clamp(floatingColumns ?? 1, 1, totalItems)}, auto)`,\n    }),\n  };\n}\n\n/**\n * Get the legend global style\n * @internal\n */\nexport function getLegendStyle({ direction, floating }: LegendPositionConfig, size: Size, margin: number): LegendStyle {\n  if (direction === LayoutDirection.Vertical) {\n    const width = `${size.width}px`;\n    return {\n      width: floating ? undefined : width,\n      maxWidth: floating ? undefined : width,\n      marginLeft: margin,\n      marginRight: margin,\n    };\n  }\n  const height = `${size.height}px`;\n  return {\n    height,\n    maxHeight: height,\n    marginTop: margin,\n    marginBottom: margin,\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PrimitiveValue } from '../../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { LegendItemExtraValues, LegendItem } from '../../common/legend';\n\n/** @internal */\nexport function getExtra(\n  extraValues: Map<string, LegendItemExtraValues>,\n  item: LegendItem,\n  totalItems: number,\n): { raw: PrimitiveValue; formatted: string } | null {\n  const { seriesIdentifiers, defaultExtra, childId, path } = item;\n  // don't show extra if the legend item is associated with multiple series\n  if (extraValues.size === 0 || seriesIdentifiers.length > 1 || !seriesIdentifiers[0]) {\n    return defaultExtra ? { formatted: `${defaultExtra.formatted ?? ''}`, raw: defaultExtra.raw } : null;\n  }\n  const [{ key }] = seriesIdentifiers;\n  const extraValueKey = path.map(({ index }) => index).join('__');\n  const itemExtraValues = extraValues.has(extraValueKey) ? extraValues.get(extraValueKey) : extraValues.get(key);\n  const actionExtra = childId !== undefined ? itemExtraValues?.get(childId) : undefined;\n  return actionExtra\n    ? actionExtra\n    : extraValues.size === totalItems && defaultExtra\n      ? { formatted: `${defaultExtra.formatted ?? ''}`, raw: defaultExtra.raw }\n      : null;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { FC, Suspense } from 'react';\n\nimport { SettingsProps } from '../specs';\n\ninterface NoResultsProps {\n  renderFn?: SettingsProps['noResults'];\n}\n\n/** @internal */\nexport const NoResults: FC<NoResultsProps> = ({ renderFn }) => (\n  <Suspense fallback={() => null}>\n    <div className=\"echReactiveChart_noResults\">{renderFn ?? <p>No data to display</p>}</div>\n  </Suspense>\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './tooltip_portal';\nexport * from './types';\nexport * from './utils';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { createPopper, Instance, Placement as PopperPlacement } from '@popperjs/core';\nimport { ReactNode, useCallback, useEffect, useMemo, useRef } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { PortalAnchorRef, PositionedPortalAnchorRef, TooltipPortalSettings } from './types';\nimport { DEFAULT_POPPER_SETTINGS, getOrCreateNode, isHTMLElement } from './utils';\nimport { isDefined, mergePartial } from '../../utils/common';\nimport { Padding } from '../../utils/dimensions';\n\n/**\n * @todo make this type conditional to use PortalAnchorProps or PortalAnchorRefProps\n */\ntype PortalTooltipProps = {\n  zIndex: number;\n  /**\n   * String used to designate unique portal\n   */\n  scope: string;\n  /**\n   * children to render inside the tooltip\n   */\n  children: ReactNode;\n  /**\n   * Used to determine if tooltip is visible\n   */\n  visible: boolean;\n  /**\n   * Settings to control portal positioning\n   */\n  settings?: TooltipPortalSettings;\n  /**\n   * Anchor element to use as position reference\n   */\n  anchor: PortalAnchorRef | PositionedPortalAnchorRef;\n  /**\n   * Chart Id to add new anchor for each chart on the page\n   */\n  chartId: string;\n\n  /**\n   * Called when computed placement changes\n   */\n  onPlacementChange?: (placement: PopperPlacement) => void;\n};\n\nfunction addToPadding(padding: Partial<Padding> | number = 0, extra: number = 0): Padding | number | undefined {\n  if (typeof padding === 'number') return padding + extra;\n\n  const { top = 0, right = 0, bottom = 0, left = 0 } = padding;\n\n  return {\n    top: top + extra,\n    right: right + extra,\n    bottom: bottom + extra,\n    left: left + extra,\n  };\n}\n\nconst TooltipPortalComponent = ({\n  anchor,\n  scope,\n  settings,\n  children,\n  visible,\n  chartId,\n  zIndex,\n  onPlacementChange,\n}: PortalTooltipProps) => {\n  const finalPlacement = useRef<PopperPlacement>('auto');\n  const skipPositioning = isHTMLElement((anchor as PortalAnchorRef).current);\n  const { position } = anchor as PositionedPortalAnchorRef;\n\n  /**\n   * Anchor element used to position tooltip\n   */\n  const anchorNode = useMemo(() => {\n    return (\n      (anchor as PortalAnchorRef)?.current ??\n      getOrCreateNode(\n        `echAnchor${scope}__${chartId}`,\n        undefined,\n        (anchor as PositionedPortalAnchorRef)?.appendRef?.current,\n      )\n    );\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [(anchor as PortalAnchorRef)?.current ?? (anchor as PositionedPortalAnchorRef)?.appendRef?.current]);\n\n  const portalNode = useMemo(() => {\n    return getOrCreateNode(`echTooltipPortal${scope}__${chartId}`, 'echTooltipPortal__invisible', undefined, zIndex);\n  }, [chartId, scope, zIndex]);\n\n  /**\n   * This must not be removed from DOM throughout life of this component.\n   * Otherwise the portal will loose reference to the correct node.\n   */\n  useEffect(() => {\n    document.body.appendChild(portalNode);\n  }, [portalNode]);\n\n  /**\n   * Popper instance used to manage position of tooltip.\n   */\n  const popper = useRef<Instance | null>(null);\n  const popperSettings = useMemo(() => {\n    // @ts-ignore - nesting limitation\n    return mergePartial(DEFAULT_POPPER_SETTINGS, settings);\n  }, [settings]);\n\n  const destroyPopper = useCallback(() => {\n    if (popper.current) {\n      popper.current.destroy();\n      popper.current = null;\n    }\n  }, []);\n\n  const setPopper = useCallback(() => {\n    if (!visible) return;\n\n    const { fallbackPlacements, placement, boundary, offset, boundaryPadding } = popperSettings;\n    popper.current = createPopper(anchorNode, portalNode, {\n      strategy: 'absolute',\n      placement,\n      modifiers: [\n        {\n          name: 'offset',\n          options: {\n            offset: [0, offset],\n          },\n        },\n        {\n          name: 'preventOverflow',\n          options: {\n            boundary,\n            padding: boundaryPadding,\n          },\n        },\n        {\n          name: 'flip',\n          options: {\n            // Note: duplicate values causes lag\n            fallbackPlacements: fallbackPlacements.filter((p) => p !== placement),\n            boundary,\n            // checks main axis overflow before trying to flip\n            altAxis: false,\n            padding: addToPadding(boundaryPadding, offset),\n          },\n        },\n        {\n          name: 'reportPlacement',\n          phase: 'afterWrite',\n          enabled: Boolean(onPlacementChange),\n          fn: ({ state }) => {\n            if (finalPlacement.current !== state.placement) {\n              finalPlacement.current = state.placement;\n              onPlacementChange?.(state.placement);\n            }\n          },\n        },\n      ],\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    visible,\n    popperSettings.fallbackPlacements,\n    popperSettings.placement,\n    popperSettings.boundary,\n    popperSettings.offset,\n  ]);\n\n  useEffect(() => {\n    setPopper();\n    const nodeCopy = portalNode;\n\n    return () => {\n      if (nodeCopy.parentNode) {\n        nodeCopy.parentNode.removeChild(nodeCopy);\n      }\n\n      destroyPopper();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    destroyPopper();\n    setPopper();\n  }, [destroyPopper, setPopper, popperSettings]);\n\n  useEffect(() => {\n    if (!visible) {\n      destroyPopper();\n    } else if (!popper.current) {\n      setPopper();\n    }\n  }, [destroyPopper, setPopper, visible]);\n\n  const updateAnchorDimensions = useCallback(() => {\n    if (!position || !visible || skipPositioning) {\n      return;\n    }\n\n    const { x, y, width, height } = position;\n    anchorNode.style.transform = `translate(${x}px, ${y}px)`;\n\n    if (isDefined(width)) {\n      anchorNode.style.width = `${width}px`;\n    }\n\n    if (isDefined(height)) {\n      anchorNode.style.height = `${height}px`;\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [visible, anchorNode, position?.x, position?.y, position?.width, position?.height]);\n\n  useEffect(() => {\n    if (!position && !skipPositioning) {\n      portalNode.classList.add('echTooltipPortal__invisible');\n      return;\n    }\n    portalNode.classList.remove('echTooltipPortal__invisible');\n  }, [portalNode.classList, position, skipPositioning]);\n\n  useEffect(() => {\n    if (popper.current) {\n      updateAnchorDimensions();\n      void popper.current.update();\n    }\n  }, [updateAnchorDimensions]);\n\n  return createPortal(children, portalNode, 'ech-tooltip-portal');\n};\n\nTooltipPortalComponent.displayName = 'TooltipPortal';\n\n/** @internal */\nexport const TooltipPortal = TooltipPortalComponent;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RefObject } from 'react';\nimport { $Values } from 'utility-types';\n\nimport { Padding } from '../../utils/dimensions';\n\n/**\n * Placement used in positioning tooltip\n * @public\n */\nexport const Placement = Object.freeze({\n  Top: 'top' as const,\n  Bottom: 'bottom' as const,\n  Left: 'left' as const,\n  Right: 'right' as const,\n  TopStart: 'top-start' as const,\n  TopEnd: 'top-end' as const,\n  BottomStart: 'bottom-start' as const,\n  BottomEnd: 'bottom-end' as const,\n  RightStart: 'right-start' as const,\n  RightEnd: 'right-end' as const,\n  LeftStart: 'left-start' as const,\n  LeftEnd: 'left-end' as const,\n  Auto: 'auto' as const,\n  AutoStart: 'auto-start' as const,\n  AutoEnd: 'auto-end' as const,\n});\n\n/**\n * {@inheritDoc (Placement:variable)}\n * @public\n */\nexport type Placement = $Values<typeof Placement>;\n\n/** @internal */\nexport type AnchorPosition = {\n  /**\n   * the right position of anchor\n   */\n  x: number;\n  /**\n   * the top position of the anchor\n   */\n  y: number;\n  /**\n   * the width of the anchor\n   */\n  width: number;\n  /**\n   * the height of the anchor\n   */\n  height: number;\n};\n\n/**\n * Anchor element to position tooltip relative to invisible anchor via ref element\n *\n * @internal\n */\nexport type PortalAnchorRef = RefObject<HTMLElement>;\n\n/**\n * Used to position tooltip relative to invisible anchor via ref element\n *\n * @internal\n */\nexport interface PositionedPortalAnchorRef {\n  /**\n   * Positioning values relative to `anchorRef`. Return `null` if tooltip is not visible.\n   */\n  position: AnchorPosition | null;\n  /**\n   * Element to append new anchor node if anchorRef is not provided\n   *\n   * @defaultValue document.body\n   */\n  appendRef?: RefObject<HTMLElement>;\n}\n\n/**\n * Tooltip portal settings\n *\n * @public\n */\nexport interface TooltipPortalSettings<B = never> {\n  /**\n   * Preferred placement of tooltip relative to anchor.\n   *\n   * This may not be the final placement given the positioning fallbacks.\n   *\n   * @defaultValue `right` {@link (Placement:type) | Placement.Right}\n   */\n  placement?: Placement;\n  /**\n   * If given tooltip placement is not suitable, these `Placement`s will\n   * be used as fallback placements.\n   */\n  fallbackPlacements?: Placement[];\n  /**\n   * Boundary element to contain tooltip within\n   *\n   * `'chart'` will use the chart container as the boundary\n   *\n   * @defaultValue parent scroll container\n   */\n  boundary?: HTMLElement | B;\n  /**\n   * Boundary element padding.\n   * Used to reduce extents of boundary placement when margins or paddings are used on boundary\n   *\n   * @defaultValue 0\n   */\n  boundaryPadding?: Partial<Padding> | number;\n  /**\n   * Custom tooltip offset\n   * @defaultValue 10\n   */\n  offset?: number;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Required } from 'utility-types';\n\nimport { TooltipPortalSettings, Placement } from './types';\n\n/** @internal */\nexport const DEFAULT_POPPER_SETTINGS: Required<TooltipPortalSettings, 'fallbackPlacements' | 'placement' | 'offset'> = {\n  fallbackPlacements: [Placement.Right, Placement.Left, Placement.Top, Placement.Bottom],\n  placement: Placement.Right,\n  offset: 10,\n};\n\n/**\n * Creates new dom element with given id and attaches to parent\n *\n * @internal\n */\nexport function getOrCreateNode(\n  id: string,\n  className?: string,\n  parent?: HTMLElement | null,\n  zIndex: number = 0,\n): HTMLDivElement {\n  // eslint-disable-next-line unicorn/prefer-query-selector\n  const node = document.getElementById(id);\n  if (node) {\n    return node as HTMLDivElement;\n  }\n\n  const newNode = document.createElement('div');\n  newNode.id = id;\n  if (className) {\n    newNode.classList.add(className);\n  }\n  newNode.style.zIndex = `${zIndex}`;\n  (parent ?? document.body).appendChild(newNode);\n  return newNode;\n}\n\n/**\n * @link https://stackoverflow.com/questions/254302/how-can-i-determine-the-type-of-an-html-element-in-javascript\n * @internal\n */\nexport function isHTMLElement(value: any): value is HTMLElement {\n  return typeof value === 'object' && value !== null && 'nodeName' in value;\n}\n\n/**\n * Returns the top-most defined z-index in the element's ancestor hierarchy\n * relative to the `target` element; if no z-index is defined, returns 0\n * @param element {HTMLElement}\n * @param cousin {HTMLElement}\n * @returns {number}\n * @internal\n */\nexport function getElementZIndex(element: HTMLElement, cousin: HTMLElement): number {\n  /**\n   * finding the z-index of `element` is not the full story\n   * its the CSS stacking context that is important\n   * take this DOM for example:\n   * body\n   *   section[z-index: 1000]\n   *     p[z-index: 500]\n   *       button\n   *   div\n   *\n   * what z-index does the `div` need to display next to `button`?\n   * the `div` and `section` are where the stacking context splits\n   * so `div` needs to copy `section`'s z-index in order to\n   * appear next to / over `button`\n   *\n   * calculate this by starting at `button` and finding its offsetParents\n   * then walk the parents from top -> down until the stacking context\n   * split is found, or if there is no split then a specific z-index is unimportant\n   */\n\n  // build the array of the element + its offset parents\n  const nodesToInspect: HTMLElement[] = [];\n  while (true) {\n    nodesToInspect.push(element);\n\n    // AFAICT this is a valid cast - the libdefs appear wrong\n    element = element.offsetParent as HTMLElement;\n\n    // stop if there is no parent\n    if (!element) {\n      break;\n    }\n\n    // stop if the parent contains the related element\n    // as this is the z-index ancestor\n    if (element.contains(cousin)) {\n      break;\n    }\n  }\n\n  // reverse the nodes to walk from top -> element\n  for (let i = nodesToInspect.length - 1; i >= 0; i--) {\n    const node = nodesToInspect[i];\n    if (!node) continue;\n\n    // get this node's z-index css value\n    const zIndex = window.document.defaultView!.getComputedStyle(node).getPropertyValue('z-index');\n\n    // if the z-index is not a number (e.g. \"auto\") return null, else the value\n    const parsedZIndex = parseInt(zIndex, 10);\n    if (Number.isFinite(parsedZIndex)) {\n      return parsedZIndex;\n    }\n  }\n\n  return 0;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// general components\nexport * from './tooltip_wrapper';\nexport * from './tooltip_container';\nexport * from './tooltip_header';\nexport * from './tooltip_footer';\nexport * from './tooltip_divider';\nexport * from './tooltip_metric_row';\n\n// table components and types\nexport * from './types';\nexport * from './tooltip_table';\nexport * from './tooltip_table_body';\nexport * from './tooltip_table_header';\nexport * from './tooltip_table_row';\nexport * from './tooltip_table_footer';\nexport * from './tooltip_table_cell';\nexport * from './tooltip_table_color_cell';\n\nexport * from './tooltip_provider';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { ComponentType, useEffect, useState } from 'react';\n\nimport { TooltipDivider } from './tooltip_divider';\nimport { useTooltipContext } from './tooltip_provider';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipAction, TooltipSpec, TooltipValue } from '../../../specs';\nimport { Datum, renderWithProps } from '../../../utils/common';\n\n/** @internal */\nexport const TooltipActions = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  actions,\n  selectionPrompt,\n  actionsLoading,\n  noActionsLoaded,\n}: Pick<TooltipSpec<D, SI>, 'actions' | 'selectionPrompt' | 'actionsLoading' | 'noActionsLoaded'>) => {\n  const { pinned, selected, values, pinTooltip } = useTooltipContext<D, SI>();\n  const syncActions = Array.isArray(actions);\n  const [loading, setLoading] = useState(true);\n  const [loadedActions, setLoadedActions] = useState<TooltipAction<D, SI>[]>(syncActions ? actions : []);\n\n  useEffect(() => {\n    if (pinned && !syncActions) {\n      const fetchActions = async (\n        asyncActions: (s: TooltipValue<D, SI>[]) => Promise<TooltipAction<D, SI>[]> | TooltipAction<D, SI>[],\n      ) => {\n        setLoading(true);\n        setLoadedActions(await asyncActions(selected));\n        setLoading(false);\n      };\n      void fetchActions(actions);\n      return () => {\n        setLoading(true);\n        setLoadedActions([]);\n      };\n    }\n  }, [syncActions, actions, selected, pinned]);\n\n  if (!syncActions) {\n    if (loading) return renderPromptContent(actionsLoading, selected);\n    if (loadedActions.length === 0) return renderPromptContent(noActionsLoaded, selected);\n  }\n\n  if (pinned && syncActions && loadedActions.length === 0) {\n    return null;\n  }\n\n  const visibleActions = loadedActions.filter(({ hide }) => !hide || hide(selected, values));\n\n  if (visibleActions.length === 0) {\n    return renderPromptContent(selectionPrompt, selected);\n  }\n\n  return (\n    <div className=\"echTooltipActions\">\n      <TooltipDivider />\n      {...visibleActions.map(({ onSelect, label, disabled }, i) => {\n        const reason = disabled && disabled(selected, values);\n\n        return (\n          <button\n            className=\"echTooltipActions__action\"\n            key={`${i}`}\n            title={typeof reason === 'string' ? reason : undefined}\n            disabled={Boolean(reason)}\n            onClick={() => {\n              pinTooltip(false, true);\n              // timeout used to close tooltip before calling action\n              setTimeout(() => {\n                onSelect(selected, values);\n              }, 0);\n            }}\n          >\n            {typeof label === 'string' ? label : label(selected, values)}\n          </button>\n        );\n      })}\n    </div>\n  );\n};\n\nfunction renderPromptContent<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  content: string | ComponentType<{ selected: TooltipValue<D, SI>[] }>,\n  selected: Array<TooltipValue<D, SI>>,\n) {\n  return (\n    <div className=\"echTooltipActions\">\n      <TooltipDivider />\n      <div className=\"echTooltipActions__prompt\">{renderWithProps(content, { selected })}</div>\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { PropsWithChildren } from 'react';\n\nimport { useTooltipContext } from './tooltip_provider';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum } from '../../../specs';\nimport { Datum, renderComplexChildren } from '../../../utils/common';\n\n/** @public */\nexport const TooltipContainer = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  props: PropsWithChildren<{ className?: string }>,\n) => {\n  const { pinned } = useTooltipContext<D, SI>();\n  return (\n    <div className={classNames('echTooltip', props.className, { 'echTooltip--pinned': pinned })}>\n      {renderComplexChildren(props.children)}\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { CSSProperties } from 'react';\n\ninterface TooltipDividerProps {\n  margin?: CSSProperties['margin'];\n}\n\n/** @public */\nexport const TooltipDivider = ({ margin }: TooltipDividerProps) => {\n  return <div style={{ margin }} className=\"echTooltipDivider\"></div>;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { PropsWithChildren } from 'react';\n\nimport { renderComplexChildren } from '../../../utils/common';\n\ntype TooltipFooterProps = PropsWithChildren<{}>;\n\n/** @public */\nexport const TooltipFooter = ({ children }: TooltipFooterProps) => {\n  return <div className=\"echTooltipFooter\">{renderComplexChildren(children)}</div>;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { memo } from 'react';\n\nimport { BaseDatum, TooltipHeaderFormatter } from '../../../specs';\nimport { PointerValue } from '../../../state/types';\nimport { Datum, renderComplexChildren } from '../../../utils/common';\nimport { PropsOrChildrenWithProps } from '../types';\n\n/** @public */\nexport type TooltipHeaderProps<D extends BaseDatum = Datum> = PropsOrChildrenWithProps<{\n  header?: PointerValue<D> | null;\n  formatter?: TooltipHeaderFormatter<D>;\n}>;\n\nconst TooltipHeaderInner = <D extends BaseDatum = Datum>(props: TooltipHeaderProps<D>) => {\n  if ('children' in props) {\n    return <div className=\"echTooltipHeader\">{renderComplexChildren(props.children)}</div>;\n  }\n\n  const { header, formatter } = props;\n\n  if (!header) return null;\n\n  const formattedValue = formatter ? formatter(header) : header.formattedValue;\n\n  if (!formattedValue) return null;\n\n  return <div className=\"echTooltipHeader\">{formattedValue}</div>;\n};\n\n/** @public */\nexport const TooltipHeader = memo(TooltipHeaderInner) as typeof TooltipHeaderInner;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { memo, ReactNode } from 'react';\n\ntype TooltipMetricRowProps = {\n  label: string;\n  metric: ReactNode;\n};\n\n/** @public */\nexport const TooltipMetricRow = memo(({ label, metric }: TooltipMetricRowProps) => {\n  return (\n    <div className=\"echTooltip__metricRow\">\n      {label}\n      <b>{metric}</b>\n    </div>\n  );\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { PropsWithChildren } from 'react';\n\nimport { TooltipDivider } from './tooltip_divider';\n\n/** @internal */\nexport function TooltipPrompt({ children }: PropsWithChildren<{}>) {\n  return (\n    <div className=\"echTooltipPrompt slideDown\" key={Math.random()}>\n      <TooltipDivider />\n      <div className=\"echTooltipPrompt__content\">{children}</div>\n    </div>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { PropsWithChildren, Context, useContext } from 'react';\n\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { pinTooltip as pinTooltipAction } from '../../../state/actions/tooltip';\nimport { Datum } from '../../../utils/common';\nimport { LIGHT_THEME } from '../../../utils/themes/light_theme';\nimport { TooltipStyle } from '../../../utils/themes/theme';\nimport { CustomTooltipProps, PinTooltipCallback } from '../types';\n\n/** @public */\nexport interface TooltipContext<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> {\n  theme: TooltipStyle;\n  backgroundColor: string;\n  dir: 'rtl' | 'ltr';\n  maxItems: number;\n  actionable: boolean;\n  pinned: boolean;\n  canPinTooltip: boolean;\n  pinTooltip: PinTooltipCallback;\n  values: TooltipValue<D, SI>[];\n  selected: Array<TooltipValue<D, SI>>;\n  toggleSelected: CustomTooltipProps['toggleSelected'];\n  setSelection: CustomTooltipProps['setSelection'];\n}\n\nconst TooltipContext = React.createContext<TooltipContext>({\n  backgroundColor: '#fff',\n  dir: 'ltr',\n  maxItems: 5,\n  pinned: false,\n  actionable: false,\n  canPinTooltip: false,\n  selected: [],\n  toggleSelected: () => {},\n  setSelection: () => {},\n  values: [],\n  pinTooltip: pinTooltipAction,\n  theme: LIGHT_THEME.tooltip,\n});\n\n/** @public */\nexport const useTooltipContext = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>() =>\n  useContext<TooltipContext<D, SI>>(TooltipContext as unknown as Context<TooltipContext<D, SI>>);\n\ntype TooltipProviderProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsWithChildren<TooltipContext<D, SI>>;\n\n/** @internal */\nexport const TooltipProvider = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  children,\n  ...rest\n}: TooltipProviderProps<D, SI>) => {\n  return <TooltipContext.Provider value={rest}>{children}</TooltipContext.Provider>;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { CSSProperties } from 'react';\n\nimport { useTooltipContext } from './tooltip_provider';\nimport { TooltipTableBody } from './tooltip_table_body';\nimport { TooltipTableFooter } from './tooltip_table_footer';\nimport { TooltipTableHeader } from './tooltip_table_header';\nimport { TooltipTableColumn } from './types';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { Datum, isNil } from '../../../utils/common';\nimport { PropsOrChildrenWithProps, ToggleSelectedTooltipItemCallback } from '../types';\n\nconst TOOLTIP_ITEM_HEIGHT = 20;\nconst TOOLTIP_HEADER_HEIGHT = 25;\nconst TOOLTIP_FOOTER_HEIGHT = 25;\n\n/**\n * Manually synced with `$colorStripCheckWidth` scss var in [`_tooltip.scss`](packages/charts/src/components/tooltip/_tooltip.scss)\n */\nconst COLOR_STRIP_CHECK_WIDTH = 11;\n\ntype TooltipTableProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsOrChildrenWithProps<\n  {\n    columns: TooltipTableColumn<D, SI>[];\n    items: TooltipValue<D, SI>[];\n    pinned?: boolean;\n    onSelect?: ToggleSelectedTooltipItemCallback;\n    selected?: TooltipValue<D, SI>[];\n  },\n  {\n    /**\n     * Used to define the column widths, otherwise auto-generated\n     */\n    gridTemplateColumns: CSSProperties['gridTemplateColumns'];\n  },\n  {\n    className?: string;\n    maxHeight?: CSSProperties['maxHeight'];\n  }\n>;\n\n/** @public */\nexport const TooltipTable = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  className,\n  ...props\n}: TooltipTableProps<D, SI>) => {\n  const tooltipContext = useTooltipContext<D, SI>();\n  const pinned = props.pinned ?? tooltipContext.pinned;\n  const wrapperClasses = classNames('echTooltip__tableWrapper', { 'echTooltip__tableWrapper--pinned': pinned });\n  if ('children' in props) {\n    const { gridTemplateColumns, maxHeight } = props;\n    const classes = classNames('echTooltip__table', className, {\n      'echTooltip__table--noGrid': !gridTemplateColumns,\n    });\n    return (\n      <div className={wrapperClasses} style={{ maxHeight }}>\n        <div role=\"table\" className={classes} style={{ gridTemplateColumns }}>\n          {props.children}\n        </div>\n      </div>\n    );\n  }\n  const { items, onSelect, selected = [] } = { selected: tooltipContext.selected, ...props };\n  const columns = props.columns.filter(({ hidden }) => {\n    return !(typeof hidden === 'boolean' ? hidden : hidden?.(props.items) ?? false);\n  });\n\n  const gridTemplateColumns = columns\n    .map(({ type, width }) => width ?? (type === 'color' ? COLOR_STRIP_CHECK_WIDTH : 'auto'))\n    .map((width) => (typeof width === 'number' ? `${width}px` : width))\n    .join(' ');\n\n  return (\n    <div className={wrapperClasses} style={{ maxHeight: props.maxHeight }}>\n      <div role=\"table\" className={classNames('echTooltip__table', className)} style={{ gridTemplateColumns }}>\n        <TooltipTableHeader columns={columns} items={props.items} />\n        <TooltipTableBody columns={columns} items={items} pinned={pinned} onSelect={onSelect} selected={selected} />\n        <TooltipTableFooter columns={columns} items={props.items} />\n      </div>\n    </div>\n  );\n};\n\n/** @internal */\nexport function computeTableMaxHeight<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  pinned: boolean,\n  columns: TooltipTableColumn<D, SI>[],\n  maxHeight: CSSProperties['maxHeight'],\n  maxItems?: number,\n): CSSProperties['maxHeight'] {\n  if (pinned || isNil(maxItems)) return maxHeight;\n  const headerHeight = +columns.some((c) => c.header) * TOOLTIP_HEADER_HEIGHT;\n  const bodyHeight = (Math.max(maxItems, 1) + 0.5) * TOOLTIP_ITEM_HEIGHT;\n  const footerHeight = +columns.some((c) => c.footer) * TOOLTIP_FOOTER_HEIGHT;\n  return headerHeight + bodyHeight + footerHeight;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { ReactNode, useRef } from 'react';\n\nimport { TooltipTableCell } from './tooltip_table_cell';\nimport { TooltipTableColorCell } from './tooltip_table_color_cell';\nimport { TooltipTableRow } from './tooltip_table_row';\nimport { TooltipCellStyle, TooltipTableColumn } from './types';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { Datum } from '../../../utils/common';\nimport { PropsOrChildrenWithProps, ToggleSelectedTooltipItemCallback } from '../types';\n\ntype TooltipTableBodyProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsOrChildrenWithProps<\n  {\n    items: TooltipValue<D, SI>[];\n    columns: TooltipTableColumn<D, SI>[];\n    pinned?: boolean;\n    onSelect?: ToggleSelectedTooltipItemCallback;\n    selected: TooltipValue<D, SI>[];\n  },\n  {},\n  {\n    className?: string;\n  }\n>;\n\n/** @public */\nexport const TooltipTableBody = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  className,\n  ...props\n}: TooltipTableBodyProps<D, SI>) => {\n  const tableBodyRef = useRef<HTMLTableSectionElement | null>(null);\n\n  if ('children' in props) {\n    const classes = classNames('echTooltip__tableBody', className);\n    return (\n      <div role=\"rowgroup\" className={classes}>\n        {props.children}\n      </div>\n    );\n  }\n\n  const { items, pinned, selected, onSelect, columns } = props;\n  const classes = classNames('echTooltip__tableBody');\n  // TODO: find a better way determine this from the data\n  const allHighlighted = items.every((i) => i.isHighlighted);\n\n  return (\n    <div role=\"rowgroup\" className={classes} ref={tableBodyRef}>\n      {items.map((item) => {\n        const { isHighlighted, isVisible, displayOnly } = item;\n        if (!isVisible) return null;\n        return (\n          <TooltipTableRow\n            key={`${item.seriesIdentifier.key}-${item.label}-${item.value}`}\n            isHighlighted={!pinned && !allHighlighted && isHighlighted}\n            isSelected={pinned && selected.includes(item)}\n            onSelect={displayOnly || !onSelect ? undefined : () => onSelect(item)}\n          >\n            {columns.map((column, j) => {\n              return renderCellContent(item, column, column.id ?? `${column.type}-${j}`);\n            })}\n          </TooltipTableRow>\n        );\n      })}\n    </div>\n  );\n};\n\nfunction getCellStyles<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  style,\n  type,\n}: TooltipTableColumn<D, SI>): TooltipCellStyle {\n  const textAlign: TooltipCellStyle['textAlign'] = type === 'number' ? 'right' : type === 'text' ? 'left' : undefined;\n\n  return {\n    textAlign,\n    ...style,\n  };\n}\n\nfunction renderCellContent<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  item: TooltipValue<D, SI>,\n  column: TooltipTableColumn<D, SI>,\n  key: string,\n): ReactNode {\n  if (column.type === 'color') {\n    return <TooltipTableColorCell displayOnly={item.displayOnly} color={item.color} key={key} />;\n  }\n\n  return (\n    <TooltipTableCell truncate={column.truncate} style={getCellStyles(column)} key={key}>\n      {column.cell(item)}\n    </TooltipTableCell>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { PropsWithChildren } from 'react';\n\nimport { TooltipCellStyle } from './types';\nimport { isNonNullablePrimitiveValue } from '../../../utils/common';\n\n/** @public */\nexport type TooltipTableCellProps = PropsWithChildren<{\n  tagName?: 'td' | 'th';\n  truncate?: boolean;\n  className?: string;\n  title?: string;\n  style?: TooltipCellStyle;\n}>;\n\n/** @public */\nexport const TooltipTableCell = ({\n  style,\n  truncate = false,\n  tagName = 'td',\n  className,\n  children,\n  title: manualTitle,\n}: TooltipTableCellProps) => {\n  const classes = classNames('echTooltip__tableCell', className, {\n    'echTooltip__tableCell--truncate': truncate,\n  });\n\n  const title = manualTitle ?? (truncate && isNonNullablePrimitiveValue(children) ? `${children}` : undefined);\n  return (\n    <div role={tagName === 'th' ? 'rowheader' : 'gridcell'} className={classes} style={style} title={title}>\n      {children}\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React from 'react';\n\nimport { useTooltipContext } from './tooltip_provider';\nimport { TooltipTableCell, TooltipTableCellProps } from './tooltip_table_cell';\nimport { combineColors, highContrastColor } from '../../../common/color_calcs';\nimport { colorToRgba } from '../../../common/color_library_wrappers';\nimport { Color, Colors } from '../../../common/colors';\n\n/** @public */\nexport type ColorStripCellProps = Omit<TooltipTableCellProps, 'children' | 'width'> & {\n  color?: string;\n  displayOnly?: boolean;\n};\n\n/**\n * Renders color strip column cell\n * @public\n */\nexport function TooltipTableColorCell({\n  color,\n  className,\n  displayOnly,\n  ...cellProps\n}: ColorStripCellProps): JSX.Element | null {\n  // the backgroundColor is the chart background color, used here to correctly add a background to the stripe\n  // to match the same, optionally semi-transparent, color rendered on the chart\n  const { backgroundColor, theme } = useTooltipContext();\n\n  const getDotColor = (stripColor: string): Color => {\n    if (color === Colors.Transparent.keyword) {\n      return theme.defaultDotColor;\n    }\n    const foregroundRGBA = colorToRgba(stripColor === Colors.Transparent.keyword ? backgroundColor : stripColor);\n    const backgroundRGBA = colorToRgba(backgroundColor);\n    const blendedFgBg = combineColors(foregroundRGBA, backgroundRGBA);\n    return highContrastColor(blendedFgBg, 'WCAG3').color.keyword;\n  };\n\n  const renderColorStrip = () => {\n    if (!color) return null;\n    const dotColor = getDotColor(color);\n\n    return (\n      <>\n        <div className=\"echTooltip__colorStrip--bg\" style={{ backgroundColor }} />\n        <div className=\"echTooltip__colorStrip\" style={{ backgroundColor: color }}>\n          <div className=\"echTooltip__colorStrip--icon\" style={{ fill: dotColor }}>\n            {/* Check svg to match eui - https://github.com/elastic/eui/blob/main/src/components/icon/svgs/check.svg?short_path=5a87b2e */}\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n              <path\n                fillRule=\"evenodd\"\n                d=\"M6.50025,12.00025 C6.37225,12.00025 6.24425,11.95125 6.14625,11.85425 L2.14625,7.85425 C1.95125,7.65825 1.95125,7.34225 2.14625,7.14625 C2.34225,6.95125 2.65825,6.95125 2.85425,7.14625 L6.50025,10.79325 L13.14625,4.14625 C13.34225,3.95125 13.65825,3.95125 13.85425,4.14625 C14.04925,4.34225 14.04925,4.65825 13.85425,4.85425 L6.85425,11.85425 C6.75625,11.95125 6.62825,12.00025 6.50025,12.00025\"\n              />\n            </svg>\n          </div>\n        </div>\n        <div className=\"echTooltip__colorStrip--spacer\" />\n      </>\n    );\n  };\n\n  return (\n    <TooltipTableCell\n      {...cellProps}\n      className={classNames('echTooltip__colorCell', className, {\n        'echTooltip__colorCell--static': displayOnly,\n      })}\n    >\n      {renderColorStrip()}\n    </TooltipTableCell>\n  );\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React from 'react';\n\nimport { TooltipTableCell } from './tooltip_table_cell';\nimport { TooltipTableColorCell } from './tooltip_table_color_cell';\nimport { TooltipTableRow } from './tooltip_table_row';\nimport { TooltipTableColumn } from './types';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { Datum } from '../../../utils/common';\nimport { PropsOrChildrenWithProps } from '../types';\n\ntype TooltipTableFooterProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsOrChildrenWithProps<\n  {\n    columns: TooltipTableColumn<D, SI>[];\n    items: TooltipValue<D, SI>[];\n  },\n  {},\n  {\n    className?: string;\n  }\n>;\n\n/** @public */\nexport const TooltipTableFooter = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  className,\n  ...props\n}: TooltipTableFooterProps<D, SI>) => {\n  const classes = classNames('echTooltip__tableFooter', className);\n  if ('children' in props) {\n    return (\n      <div role=\"rowgroup\" className={classes}>\n        {props.children}\n      </div>\n    );\n  }\n\n  if (props.columns.every((c) => !c.footer)) return null;\n\n  return (\n    <div role=\"rowgroup\" className={classes}>\n      <TooltipTableRow>\n        {props.columns.map(({ style, id, className: cn, type, footer }, i) => {\n          const key = id ?? `${type}-${i}`;\n          if (type === 'color') return <TooltipTableColorCell className={cn} style={style} key={key} />;\n          return (\n            <TooltipTableCell className={cn} style={style} key={id ?? key}>\n              {footer ? (typeof footer === 'string' ? footer : footer(props.items)) : undefined}\n            </TooltipTableCell>\n          );\n        })}\n      </TooltipTableRow>\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React from 'react';\n\nimport { TooltipTableCell } from './tooltip_table_cell';\nimport { TooltipTableColorCell } from './tooltip_table_color_cell';\nimport { TooltipTableRow } from './tooltip_table_row';\nimport { TooltipTableColumn } from './types';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum, TooltipValue } from '../../../specs';\nimport { Datum } from '../../../utils/common';\nimport { PropsOrChildrenWithProps } from '../types';\n\ntype TooltipTableHeaderProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsOrChildrenWithProps<\n  {\n    columns: TooltipTableColumn<D, SI>[];\n    items: TooltipValue<D, SI>[];\n  },\n  {},\n  {\n    className?: string;\n  }\n>;\n\n/** @public */\nexport const TooltipTableHeader = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  className,\n  ...props\n}: TooltipTableHeaderProps<D, SI>) => {\n  const classes = classNames('echTooltip__tableHeader', className);\n  if ('children' in props) {\n    return (\n      <div role=\"rowgroup\" className={classes}>\n        {props.children}\n      </div>\n    );\n  }\n\n  if (props.columns.every((c) => !c.header)) return null;\n\n  return (\n    <div role=\"rowgroup\" className={classes}>\n      <TooltipTableRow>\n        {props.columns.map(({ header, style, id, className: cn, type }, i) => {\n          const key = id ?? `${type}-${i}`;\n          if (type === 'color') return <TooltipTableColorCell className={cn} style={style} key={key} />;\n          return (\n            <TooltipTableCell className={cn} style={style} key={key}>\n              {header ? (typeof header === 'string' ? header : header(props.items)) : undefined}\n            </TooltipTableCell>\n          );\n        })}\n      </TooltipTableRow>\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { PropsWithChildren } from 'react';\n\nimport { useTooltipContext } from './tooltip_provider';\nimport { isNil } from '../../../utils/common';\n\ntype TooltipTableRowProps = PropsWithChildren<{\n  id?: string;\n  className?: string;\n  isHighlighted?: boolean;\n  isSelected?: boolean;\n  onSelect?: () => void;\n}>;\n\n/** @public */\nexport const TooltipTableRow = ({\n  id,\n  isHighlighted = false,\n  isSelected = false,\n  children,\n  onSelect,\n  className,\n}: TooltipTableRowProps) => {\n  const { actionable } = useTooltipContext();\n\n  const isSelectable = actionable && !isNil(onSelect);\n  const classes = classNames('echTooltip__tableRow', className, {\n    'echTooltip__tableRow--highlighted': isHighlighted,\n    'echTooltip__tableRow--selected': isSelected,\n    'echTooltip__tableRow--selectable': isSelectable,\n  });\n\n  return (\n    // cannot focus row using display: contents to structure grid\n    // eslint-disable-next-line jsx-a11y/interactive-supports-focus\n    <div\n      role=\"row\"\n      id={id}\n      className={classes}\n      onClick={isSelectable ? onSelect : undefined}\n      onKeyPress={isSelectable ? onSelect : undefined}\n    >\n      {children}\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport classNames from 'classnames';\nimport React, { PropsWithChildren, useEffect, useRef, useState } from 'react';\n\nimport { TooltipActions } from './tooltip_actions';\nimport { TooltipPrompt } from './tooltip_prompt';\nimport { useTooltipContext } from './tooltip_provider';\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum } from '../../../specs';\nimport { TooltipSpec } from '../../../specs/tooltip';\nimport { Datum } from '../../../utils/common';\n\ntype TooltipWrapperProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = PropsWithChildren<\n  {\n    className?: string;\n  } & Pick<\n    TooltipSpec<D, SI>,\n    'actions' | 'actionPrompt' | 'pinningPrompt' | 'selectionPrompt' | 'actionsLoading' | 'noActionsLoaded'\n  >\n>;\n\n/** @internal */\nexport const TooltipWrapper = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  children,\n  className,\n  actions,\n  actionPrompt,\n  pinningPrompt,\n  selectionPrompt,\n  actionsLoading,\n  noActionsLoaded,\n}: TooltipWrapperProps<D, SI>) => {\n  const { dir, pinned, canPinTooltip, selected, theme, actionable } = useTooltipContext<D, SI>();\n\n  const tooltipRef = useRef<HTMLDivElement | null>(null);\n  const [minWidth, setMinWidth] = useState(0);\n\n  useEffect(() => {\n    // Capture initial unpinned tooltip width\n    window.requestAnimationFrame(() => {\n      if (tooltipRef.current) {\n        const { width } = tooltipRef.current.getBoundingClientRect();\n        setMinWidth(width);\n      }\n    });\n  }, []);\n\n  useEffect(() => {\n    // Capture pinned tooltip with on change\n    if (pinned && tooltipRef.current && typeof theme.maxWidth === 'number' && minWidth < theme.maxWidth) {\n      const { width } = tooltipRef.current.getBoundingClientRect();\n      if (width > minWidth) setMinWidth(width);\n    }\n  }, [selected, pinned, minWidth, theme.maxWidth]);\n\n  return (\n    <div\n      className={classNames('echTooltip', className, { 'echTooltip--pinned': pinned })}\n      dir={dir}\n      ref={tooltipRef}\n      style={{ minWidth }}\n      onClick={(e) => e.stopPropagation()} // block propagation of tooltip click\n      onKeyPress={(e) => e.stopPropagation()} // block propagation of tooltip click\n    >\n      {children}\n      {!canPinTooltip ? null : pinned ? (\n        <TooltipActions\n          actions={actions}\n          actionsLoading={actionsLoading}\n          noActionsLoaded={noActionsLoaded}\n          selectionPrompt={selectionPrompt}\n        />\n      ) : (\n        <TooltipPrompt>{actionable ? actionPrompt : pinningPrompt}</TooltipPrompt>\n      )}\n    </div>\n  );\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties, ReactNode } from 'react';\n\nimport { SeriesIdentifier } from '../../../common/series_id';\nimport { BaseDatum } from '../../../specs';\nimport { TooltipValue } from '../../../specs/tooltip';\nimport { Datum } from '../../../utils/common';\n\n/**\n * Styles to apply to tooltip table cell\n * @public */\nexport type TooltipCellStyle = Pick<\n  CSSProperties,\n  'maxHeight' | 'textAlign' | 'padding' | 'paddingTop' | 'paddingRight' | 'paddingBottom' | 'paddingLeft'\n>;\n\n/**\n * Base table column definition\n * @alpha\n */\nexport type TooltipTableColumnBase<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = {\n  /**\n   * Identifier for column to be used in callbacks if needed\n   */\n  id?: string;\n  /**\n   * ClassName to be applied to table cells within column (i.e. `td` or `th`)\n   */\n  className?: string;\n  /**\n   * Table column header\n   */\n  header?: string | ((items: TooltipValue<D, SI>[]) => string);\n  /**\n   * Table column footer\n   */\n  footer?: string | ((items: TooltipValue<D, SI>[]) => string);\n  /**\n   * Boolean to hide entire column from table\n   */\n  hidden?: boolean | ((items: TooltipValue<D, SI>[]) => boolean);\n  /**\n   * Limited styles to apply to table cells within column (i.e. `td` or `th`)\n   */\n  style?: TooltipCellStyle;\n  /**\n   * truncates cell content sharing the available width with other columns.\n   * Set width to control column width for truncating.\n   */\n  truncate?: boolean;\n  /**\n   * Width of column used to generate [gridTemplateColumns](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns).\n   */\n  width?: CSSProperties['gridTemplateColumns'];\n};\n\n/**\n * Table column definition for fully custom values\n * @alpha\n */\nexport interface TooltipTableColumnCustom<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends TooltipTableColumnBase<D, SI> {\n  type: 'custom';\n  /**\n   * Renders column cell element inside a `td` element\n   */\n  cell: (item: TooltipValue<D, SI>) => ReactNode;\n}\n\n/**\n * Table column definition for color strip\n * @alpha\n */\nexport interface TooltipTableColumnColor<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends Omit<TooltipTableColumnBase<D, SI>, 'header' | 'footer'> {\n  type: 'color';\n  header?: never;\n  footer?: never;\n}\n\n/**\n * Table column definition for number values\n * @alpha\n */\nexport interface TooltipTableColumnNumber<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends TooltipTableColumnBase<D, SI> {\n  type: 'number';\n  /**\n   * Renders column cell element inside a `td` element\n   */\n  cell: (item: TooltipValue<D, SI>) => string | number;\n}\n\n/**\n * Table column definition for text values\n * @alpha\n */\nexport interface TooltipTableColumnText<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends TooltipTableColumnBase<D, SI> {\n  type: 'text';\n  /**\n   * Renders column cell element inside a `td` element\n   */\n  cell: (item: TooltipValue<D, SI>) => string;\n}\n\n/**\n * Table column definition for number values\n *\n * @alpha\n */\nexport type TooltipTableColumn<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> =\n  | TooltipTableColumnCustom<D, SI>\n  | TooltipTableColumnColor<D, SI>\n  | TooltipTableColumnNumber<D, SI>\n  | TooltipTableColumnText<D, SI>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './components';\nexport * from './types';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Placement as PopperPlacement } from '@popperjs/core/lib/enums';\nimport { CSSProperties } from 'react';\n\nimport { TooltipStyle } from '../../utils/themes/theme';\n\n/** @internal */\nexport function getStylesFromPlacement(\n  actionable: boolean,\n  { maxWidth }: TooltipStyle,\n  placement?: PopperPlacement,\n): CSSProperties | undefined {\n  if (!actionable) return { maxWidth };\n  switch (placement) {\n    case 'left':\n    case 'left-start':\n    case 'left-end':\n    case 'top-end':\n    case 'bottom-end':\n      return {\n        maxWidth,\n        justifyContent: 'flex-end',\n      };\n    case 'right':\n    case 'right-start':\n    case 'right-end':\n    case 'top-start':\n    case 'bottom-start':\n      return {\n        maxWidth,\n        justifyContent: 'flex-start',\n      };\n    case 'top':\n    case 'bottom':\n      return {\n        maxWidth,\n        justifyContent: 'center',\n      };\n    case 'auto':\n    case 'auto-start':\n    case 'auto-end':\n    default:\n      return {\n        maxWidth,\n      };\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Placement as PopperPlacement } from '@popperjs/core';\nimport React, { useEffect, useMemo, memo, RefObject, useState } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport {\n  computeTableMaxHeight,\n  TooltipDivider,\n  TooltipFooter,\n  TooltipHeader,\n  TooltipTable,\n  TooltipWrapper,\n} from './components';\nimport { TooltipProvider } from './components/tooltip_provider';\nimport { TooltipTableColumn } from './components/types';\nimport { getStylesFromPlacement } from './placement';\nimport {\n  PinTooltipCallback,\n  SetSelectedTooltipItemsCallback,\n  ToggleSelectedTooltipItemCallback,\n  TooltipInfo,\n} from './types';\nimport { Colors } from '../../common/colors';\nimport { SeriesIdentifier } from '../../common/series_id';\nimport { BaseDatum, DEFAULT_TOOLTIP_SPEC, TooltipProps, TooltipSpec, TooltipValue } from '../../specs';\nimport { onPointerMove as onPointerMoveAction } from '../../state/actions/mouse';\nimport {\n  toggleSelectedTooltipItem as toggleSelectedTooltipItemAction,\n  setSelectedTooltipItems as setSelectedTooltipItemsAction,\n  pinTooltip as pinTooltipAction,\n} from '../../state/actions/tooltip';\nimport { BackwardRef, GlobalChartState } from '../../state/chart_state';\nimport { isPinnableTooltip } from '../../state/selectors/can_pin_tooltip';\nimport { getChartRotationSelector } from '../../state/selectors/get_chart_rotation';\nimport { getChartThemeSelector } from '../../state/selectors/get_chart_theme';\nimport { getInternalIsInitializedSelector, InitStatus } from '../../state/selectors/get_internal_is_intialized';\nimport { getInternalIsTooltipVisibleSelector } from '../../state/selectors/get_internal_is_tooltip_visible';\nimport { getInternalTooltipAnchorPositionSelector } from '../../state/selectors/get_internal_tooltip_anchor_position';\nimport { getInternalTooltipInfoSelector } from '../../state/selectors/get_internal_tooltip_info';\nimport { getTooltipSelectedItems } from '../../state/selectors/get_tooltip_selected_items';\nimport { getTooltipSettings } from '../../state/selectors/get_tooltip_settings';\nimport { getTooltipSpecSelector } from '../../state/selectors/get_tooltip_spec';\nimport { isBrushingSelector } from '../../state/selectors/is_brushing';\nimport { Datum, hasMostlyRTLItems, isDefined, Rotation } from '../../utils/common';\nimport { LIGHT_THEME } from '../../utils/themes/light_theme';\nimport { TooltipStyle } from '../../utils/themes/theme';\nimport { AnchorPosition, Placement, TooltipPortal, TooltipPortalSettings } from '../portal';\n\ninterface TooltipDispatchProps {\n  onPointerMove: typeof onPointerMoveAction;\n  toggleSelectedTooltipItem: ToggleSelectedTooltipItemCallback;\n  setSelectedTooltipItems: SetSelectedTooltipItemsCallback;\n  pinTooltip: PinTooltipCallback;\n}\n\ninterface TooltipStateProps<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> {\n  tooltip: TooltipSpec<D, SI>;\n  zIndex: number;\n  visible: boolean;\n  isExternal: boolean;\n  position: AnchorPosition | null;\n  info?: TooltipInfo<D, SI>;\n  settings?: TooltipProps<D, SI>;\n  rotation: Rotation;\n  chartId: string;\n  canPinTooltip: boolean;\n  backgroundColor: string;\n  pinned: boolean;\n  selected: TooltipValue<D, SI>[];\n  tooltipTheme: TooltipStyle;\n  isBrushing: boolean;\n}\n\ninterface TooltipOwnProps {\n  getChartContainerRef: BackwardRef;\n  anchorRef?: RefObject<HTMLDivElement>;\n}\n\n/** @internal */\nexport type TooltipComponentProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = TooltipDispatchProps & TooltipStateProps<D, SI> & TooltipOwnProps;\n\n/** @internal */\nexport const TooltipComponent = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>({\n  tooltip: {\n    header: TooltipCustomHeader,\n    body: TooltipCustomBody,\n    footer: TooltipCustomFooter,\n    actions,\n    headerFormatter,\n    actionPrompt,\n    pinningPrompt,\n    selectionPrompt,\n    actionsLoading,\n    noActionsLoaded,\n    maxVisibleTooltipItems,\n  },\n  anchorRef,\n  info,\n  zIndex,\n  position,\n  getChartContainerRef,\n  settings,\n  tooltipTheme,\n  visible,\n  rotation,\n  chartId,\n  onPointerMove,\n  backgroundColor,\n  pinned,\n  selected,\n  toggleSelectedTooltipItem,\n  setSelectedTooltipItems,\n  pinTooltip,\n  canPinTooltip,\n  isBrushing,\n}: TooltipComponentProps<D, SI>) => {\n  const [computedPlacement, setComputedPlacement] = useState<PopperPlacement | undefined>(settings?.placement);\n  const chartRef = getChartContainerRef();\n\n  const handleScroll = (e: Event) => {\n    if (\n      e.target &&\n      e.target.hasOwnProperty('classList') &&\n      (e.target as Element).classList.contains('echTooltip__tableBody')\n    ) {\n      // catch scroll when scrolling on tableBody\n      e.stopImmediatePropagation();\n      return;\n    }\n    // TODO: handle scroll cursor update\n    onPointerMove({ x: -1, y: -1 }, Date.now());\n  };\n\n  useEffect(() => {\n    window.addEventListener('scroll', handleScroll, true);\n    return () => window.removeEventListener('scroll', handleScroll, true);\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  const popperSettings = useMemo((): TooltipPortalSettings | undefined => {\n    if (!settings || typeof settings === 'string') {\n      return;\n    }\n\n    const { placement, fallbackPlacements, boundary, ...rest } = settings;\n\n    return {\n      ...rest,\n      placement: placement ?? (rotation === 0 || rotation === 180 ? Placement.Right : Placement.Top),\n      fallbackPlacements:\n        fallbackPlacements ??\n        (rotation === 0 || rotation === 180\n          ? [Placement.Right, Placement.Left, Placement.Top, Placement.Bottom]\n          : [Placement.Top, Placement.Bottom, Placement.Right, Placement.Left]),\n      boundary: boundary === 'chart' ? chartRef.current ?? undefined : boundary,\n    };\n  }, [settings, chartRef, rotation]);\n\n  if (!visible || isBrushing) {\n    return null;\n  }\n\n  const isMostlyRTL = hasMostlyRTLItems(info?.values?.map?.(({ label }) => label) ?? []);\n  const textDirectionality = isMostlyRTL ? 'rtl' : 'ltr';\n\n  const columns: TooltipTableColumn<D, SI>[] = [\n    {\n      id: 'color',\n      type: 'color',\n    },\n    {\n      id: 'label',\n      type: 'custom',\n      truncate: true,\n      cell: ({ label }) => (\n        <span className=\"echTooltip__label\" title={label}>\n          {label}\n        </span>\n      ),\n      hidden: (items) => items.every(({ label }) => !label),\n      style: {\n        textAlign: 'left',\n      },\n    },\n    {\n      id: 'value',\n      type: 'custom',\n      cell: ({ formattedValue }) => (\n        <span className=\"echTooltip__value\" dir=\"ltr\">\n          {formattedValue}\n        </span>\n      ),\n      // truncation is fine for values  due to the grid configuration: label-value  as auto-auto.\n      // The value will be truncated at 50% of the max tooltip width (at ~125px) only if both exceed the 50% of the available space.\n      // It got a plenty of space to render correctly any number even with no formatting\n      truncate: true,\n      style: {\n        textAlign: 'right',\n      },\n    },\n    {\n      id: 'markValue',\n      type: 'custom',\n      style: {\n        paddingLeft: 0,\n      },\n      hidden: (items) => items.every(({ markValue }) => !markValue),\n      cell: ({ markValue, formattedMarkValue }) =>\n        isDefined(markValue) ? <span className=\"echTooltip__markValue\">&nbsp;({formattedMarkValue})</span> : null,\n    },\n  ];\n\n  // don't show the tooltip if hidden or no TooltipInfo are available\n  if (!info || !visible) {\n    return null;\n  }\n\n  const hideActions = (info?.disableActions ?? false) || info?.values.every((v) => v.displayOnly);\n  const actionable = actions.length > 0 || !Array.isArray(actions);\n  // divider visibility\n  const hasHeader = TooltipCustomHeader !== 'none' && info.header;\n  const hasBody = TooltipCustomBody !== 'none' && info.values.length > 0;\n  // footer is empty by default, so default and none are the same at the moment\n  const hasFooter = TooltipCustomFooter !== 'default' && TooltipCustomFooter !== 'none';\n  const headerBottomDividerVisibility = hasHeader && (hasBody || hasFooter);\n  const bodyBottomDividerVisibility = hasBody && hasFooter;\n\n  return (\n    <TooltipPortal\n      scope=\"MainTooltip\"\n      // increasing by 100 the tooltip portal zIndex to avoid conflicts with highlighters and other elements in the DOM\n      zIndex={zIndex + 100}\n      anchor={anchorRef ?? { position, appendRef: chartRef }}\n      settings={popperSettings}\n      chartId={chartId}\n      visible={visible}\n      onPlacementChange={setComputedPlacement}\n    >\n      <TooltipProvider\n        backgroundColor={backgroundColor}\n        dir={textDirectionality}\n        pinned={pinned}\n        actionable={actionable}\n        canPinTooltip={canPinTooltip}\n        selected={selected}\n        setSelection={setSelectedTooltipItems}\n        toggleSelected={toggleSelectedTooltipItem}\n        values={info?.values ?? []}\n        pinTooltip={pinTooltip}\n        theme={tooltipTheme}\n        maxItems={maxVisibleTooltipItems}\n      >\n        <div\n          className=\"echTooltip__outerWrapper\"\n          style={getStylesFromPlacement(actionable, tooltipTheme, computedPlacement)}\n        >\n          {settings?.customTooltip ? (\n            <settings.customTooltip\n              {...info}\n              dir={textDirectionality}\n              pinned={pinned}\n              selected={selected}\n              setSelection={setSelectedTooltipItems}\n              toggleSelected={toggleSelectedTooltipItem}\n              headerFormatter={headerFormatter}\n              backgroundColor={backgroundColor}\n            />\n          ) : (\n            <TooltipWrapper\n              actions={hideActions || !canPinTooltip ? [] : actions}\n              actionPrompt={actionPrompt}\n              pinningPrompt={pinningPrompt}\n              selectionPrompt={selectionPrompt}\n              actionsLoading={actionsLoading}\n              noActionsLoaded={noActionsLoaded}\n            >\n              {TooltipCustomHeader === 'none' ? null : TooltipCustomHeader === 'default' ? (\n                <TooltipHeader header={info.header} formatter={headerFormatter} />\n              ) : (\n                <TooltipHeader>\n                  <TooltipCustomHeader items={info.values} header={info.header} />\n                </TooltipHeader>\n              )}\n\n              {headerBottomDividerVisibility && <TooltipDivider />}\n\n              {TooltipCustomBody === 'none' ? null : TooltipCustomBody === 'default' ? (\n                <TooltipTable\n                  columns={columns}\n                  items={info.values}\n                  pinned={pinned}\n                  onSelect={toggleSelectedTooltipItem}\n                  selected={selected}\n                  maxHeight={computeTableMaxHeight(\n                    pinned,\n                    columns,\n                    tooltipTheme.maxTableHeight,\n                    maxVisibleTooltipItems,\n                  )}\n                />\n              ) : (\n                <TooltipCustomBody items={info.values} header={info.header} />\n              )}\n\n              {bodyBottomDividerVisibility && <TooltipDivider />}\n\n              {TooltipCustomFooter === 'default' || TooltipCustomFooter === 'none' ? null : (\n                <TooltipFooter>\n                  <TooltipCustomFooter items={info.values} header={info.header} />\n                </TooltipFooter>\n              )}\n            </TooltipWrapper>\n          )}\n        </div>\n      </TooltipProvider>\n    </TooltipPortal>\n  );\n};\n\nTooltipComponent.displayName = 'Tooltip';\n\nconst HIDDEN_TOOLTIP_PROPS: TooltipStateProps = {\n  tooltip: DEFAULT_TOOLTIP_SPEC,\n  zIndex: 0,\n  visible: false,\n  isExternal: false,\n  info: undefined,\n  position: null,\n  settings: {},\n  rotation: 0 as Rotation,\n  chartId: '',\n  canPinTooltip: false,\n  backgroundColor: Colors.Transparent.keyword,\n  pinned: false,\n  selected: [],\n  tooltipTheme: LIGHT_THEME.tooltip,\n  isBrushing: false,\n};\n\nconst mapDispatchToProps = (dispatch: Dispatch): TooltipDispatchProps =>\n  bindActionCreators(\n    {\n      onPointerMove: onPointerMoveAction,\n      toggleSelectedTooltipItem: toggleSelectedTooltipItemAction,\n      setSelectedTooltipItems: setSelectedTooltipItemsAction,\n      pinTooltip: pinTooltipAction,\n    },\n    dispatch,\n  );\n\ntype BasicTooltipProps = Omit<\n  TooltipStateProps,\n  'visible' | 'position' | 'info' | 'pinned' | 'selected' | 'canPinTooltip'\n>;\nconst mapStateToPropsBasic = (state: GlobalChartState): BasicTooltipProps => {\n  const tooltip = getTooltipSpecSelector(state);\n  const {\n    background: { color: backgroundColor },\n    tooltip: tooltipTheme,\n  } = getChartThemeSelector(state);\n  const { isExternal } = getInternalIsTooltipVisibleSelector(state);\n  return getInternalIsInitializedSelector(state) !== InitStatus.Initialized\n    ? HIDDEN_TOOLTIP_PROPS\n    : {\n        tooltip,\n        isExternal,\n        isBrushing: false,\n        zIndex: state.zIndex,\n        settings: getTooltipSettings(state),\n        tooltipTheme,\n        rotation: getChartRotationSelector(state),\n        chartId: state.chartId,\n        backgroundColor,\n      };\n};\n\nconst mapStateToProps = (state: GlobalChartState): TooltipStateProps =>\n  getInternalIsInitializedSelector(state) !== InitStatus.Initialized\n    ? HIDDEN_TOOLTIP_PROPS\n    : {\n        ...mapStateToPropsBasic(state),\n        visible: getInternalIsTooltipVisibleSelector(state).visible,\n        position: getInternalTooltipAnchorPositionSelector(state),\n        info: getInternalTooltipInfoSelector(state),\n        pinned: state.interactions.tooltip.pinned,\n        selected: getTooltipSelectedItems(state),\n        canPinTooltip: isPinnableTooltip(state),\n        isBrushing: isBrushingSelector(state),\n      };\n\n/** @internal */\nexport const Tooltip = memo(connect(mapStateToProps, mapDispatchToProps)(TooltipComponent));\n\n/** @internal */\nexport const BasicTooltip = memo(connect(mapStateToPropsBasic)(TooltipComponent));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentType, ReactNode } from 'react';\n\nimport { SeriesIdentifier } from '../../common/series_id';\nimport { BaseDatum, TooltipValue, TooltipValueFormatter } from '../../specs';\nimport { PointerValue } from '../../state/types';\nimport { Datum } from '../../utils/common';\n\n/**\n * The set of info used to render the a tooltip.\n * @public\n */\nexport interface TooltipInfo<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> {\n  /**\n   * The TooltipValue for the header. On XYAxis chart the x value\n   */\n  header: PointerValue<D> | null;\n  /**\n   * The array of {@link TooltipValue}s to show on the tooltip.\n   * On XYAxis chart correspond to the set of y values for each series\n   */\n  values: TooltipValue<D, SI>[];\n  /**\n   * Internal flag to disable tooltip actions. Needed for heatmap to hide actions.\n   *\n   * TODO: replace this flag with better internal tooltip info structures\n   * @internal\n   */\n  disableActions?: boolean;\n}\n\n/**\n * The set of info used to render the a tooltip.\n * @public\n */\nexport interface CustomTooltipProps<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends TooltipInfo<D, SI> {\n  headerFormatter?: TooltipValueFormatter<D, SI>;\n  dir: 'ltr' | 'rtl';\n\n  /**\n   * Background color for use with contrast ratios\n   */\n  backgroundColor: string;\n\n  /**\n   * Tooltip is pinned\n   */\n  pinned: boolean;\n\n  /**\n   * Selected items - For use with actions\n   *\n   *\n   * TODO: permit other values than TooltipValue types\n   */\n  selected: TooltipValue<D, SI>[];\n\n  /**\n   * Toggles selected items - For use with actions\n   *\n   *\n   * TODO: permit other values than TooltipValue types\n   */\n  toggleSelected: (item: TooltipValue<D, SI>) => void;\n\n  /**\n   * Allows setting the selected items - For use with actions\n   *\n   * TODO: permit other values than TooltipValue types\n   */\n  setSelection: (items: TooltipValue<D, SI>[]) => void;\n}\n\n/**\n * The react component used to render a custom tooltip\n * @public\n */\nexport type CustomTooltip<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = ComponentType<\n  CustomTooltipProps<D, SI>\n>;\n\n/**\n * Defines exported component props with union of props **with** `children`\n * @public\n */\nexport type PropsWithChildren<\n  ChildrenProps extends Record<string, unknown> = Record<string, any>,\n  ExtraProps extends Record<string, unknown> = Record<string, any>,\n  Props extends Record<string, unknown> = Record<string, any>,\n> = {\n  children: ReactNode;\n} & ChildrenProps &\n  ExtraProps &\n  Neverify<Props>;\n\n/**\n * Defines exported component props with union of props **without** `children`\n * @public\n */\nexport type PropsWithoutChildren<\n  Props extends Record<string, unknown> = Record<string, any>,\n  ExtraProps extends Record<string, unknown> = Record<string, any>,\n  ChildrenProps extends Record<string, unknown> = Record<string, any>,\n> = {\n  children?: never | undefined;\n} & Neverify<ChildrenProps> &\n  Props &\n  ExtraProps;\n\n/**\n * Type used to define a union including and excluding children as a prop\n * @public\n */\nexport type PropsOrChildrenWithProps<\n  Props extends Record<string, unknown> = Record<string, any>,\n  ChildrenProps extends Record<string, unknown> = Record<string, any>,\n  ExtraProps extends Record<string, unknown> = Record<string, any>,\n> = PropsWithChildren<ChildrenProps, ExtraProps, Props> | PropsWithoutChildren<Props, ExtraProps, ChildrenProps>;\n\n/**\n * Converts all properties of a Record to optional-never\n * @public\n */\nexport type Neverify<T extends Record<string, unknown>> = {\n  [Key in keyof T]?: never;\n};\n\n/** @public */\nexport type ToggleSelectedTooltipItemCallback = (item: TooltipValue<any, SeriesIdentifier>) => any;\n/** @public */\nexport type SetSelectedTooltipItemsCallback = (items: TooltipValue<any, SeriesIdentifier>[]) => any;\n/** @public */\nexport type PinTooltipCallback = (pinned: boolean, resetPointer?: boolean) => any;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { line, area } from 'd3-shape';\n\nimport { CurveType, getCurveFactory } from '../utils/curves';\n\ntype SVGPath = string;\n\ntype LineGenerator<D> = (data: D[]) => SVGPath;\n\n/** @internal */\nexport function lineGenerator<D>(\n  xProject: (x: D) => number,\n  yProject: (y: D) => number,\n  defined: (d: D) => boolean,\n  curve: CurveType,\n): LineGenerator<D> {\n  const generator = line<D>().x(xProject).y(yProject).defined(defined).curve(getCurveFactory(curve));\n  return (d) => generator(d) ?? '';\n}\n\ntype AreaGenerator<D> = {\n  y0: (data: D[]) => SVGPath;\n  y1: (data: D[]) => SVGPath;\n  area: (data: D[]) => SVGPath;\n};\n\n/** @internal */\nexport function areaGenerator<D>(\n  xProject: (x: D) => number,\n  y0Project: (y: D) => number,\n  y1Project: (y: D) => number,\n  defined: (d: D) => boolean,\n  curve: CurveType,\n): AreaGenerator<D> {\n  const generator = area<D>().x(xProject).y0(y0Project).y1(y1Project).defined(defined).curve(getCurveFactory(curve));\n  return {\n    y0: (d) => generator.lineY0()(d) ?? '',\n    y1: (d) => generator.lineY1()(d) ?? '',\n    area: (d) => generator(d) ?? '',\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './components';\nexport { ChartType } from './chart_types';\nexport { ChartSize, ChartSizeArray, ChartSizeObject } from './utils/chart_size';\n\nexport { SpecId, GroupId, AxisId, AnnotationId } from './utils/ids';\n\n// Everything related to the specs types and react-components\nexport * from './specs';\nexport {\n  DebugState,\n  DebugStateLine,\n  DebugStateValue,\n  DebugStateAnnotations,\n  DebugStateArea,\n  DebugStateAxes,\n  DebugStateBar,\n  DebugStateLegend,\n  DebugStateLineConfig,\n  DebugStateAxis,\n  DebugStateBase,\n  DebugStateLegendItem,\n  BulletDebugState,\n  BulletDebugStateRow,\n  PointerValue,\n} from './state/types';\nexport { toEntries } from './utils/common';\nexport { CurveType } from './utils/curves';\nexport { ContinuousDomain, OrdinalDomain, GenericDomain, Range } from './utils/domain';\nexport { Dimensions, SimplePadding, Padding, PerSideDistance, Margins } from './utils/dimensions';\nexport { timeFormatter, niceTimeFormatter, niceTimeFormatByDay } from './utils/data/formatters';\nexport { SeriesCompareFn } from './utils/series_sort';\nexport { SeriesIdentifier, SeriesKey } from './common/series_id';\nexport { XYChartSeriesIdentifier, DataSeriesDatum, FilledValues } from './chart_types/xy_chart/utils/series';\nexport {\n  AnnotationTooltipFormatter,\n  CustomAnnotationTooltip,\n  ComponentWithAnnotationDatum,\n} from './chart_types/xy_chart/annotations/types';\nexport { GeometryValue, BandedAccessorType } from './utils/geometry';\nexport { LegendPath, LegendPathElement } from './state/actions/legend';\nexport { CategoryKey, CategoryLabel } from './common/category';\nexport { Layer as PartitionLayer, PartitionProps } from './chart_types/partition_chart/specs/index';\nexport { FillLabelConfig as PartitionFillLabel, PartitionStyle } from './utils/themes/partition';\nexport { PartitionLayout } from './chart_types/partition_chart/layout/types/config_types';\n\nexport {\n  Accessor,\n  AccessorFn,\n  IndexedAccessorFn,\n  UnaryAccessorFn,\n  AccessorObjectKey,\n  AccessorArrayIndex,\n} from './utils/accessor';\nexport * from './components/tooltip';\n\n// scales\nexport { ScaleType } from './scales/constants';\nexport { ScaleContinuousType, ScaleOrdinalType, ScaleBandType, LogScaleOptions } from './scales';\n\n// TODO move animation to its own package\nexport {\n  AnimationOptions,\n  AnimatedValue,\n  AnimationSpeed,\n} from './chart_types/xy_chart/renderer/canvas/animations/animation';\n\n// theme\nexport * from './utils/themes/theme';\nexport * from './utils/themes/theme_common';\nexport { LIGHT_THEME } from './utils/themes/light_theme';\nexport { DARK_THEME } from './utils/themes/dark_theme';\nexport { LIGHT_BASE_COLORS, DARK_BASE_COLORS } from './utils/themes/base_colors';\nexport { LEGACY_LIGHT_THEME } from './utils/themes/legacy_light_theme';\nexport { LEGACY_DARK_THEME } from './utils/themes/legacy_dark_theme';\n\n// wordcloud\nexport { WordcloudViewModel } from './chart_types/wordcloud/layout/types/viewmodel_types';\n\n// partition\nexport * from './chart_types/partition_chart/layout/types/viewmodel_types';\nexport * from './chart_types/partition_chart/layout/utils/group_by_rollup';\nexport { AnimKeyframe } from './chart_types/partition_chart/layout/types/config_types';\n\n// heatmap\nexport { Cell } from './chart_types/heatmap/layout/types/viewmodel_types';\nexport { HeatmapCellDatum } from './chart_types/heatmap/layout/viewmodel/viewmodel';\nexport {\n  ColorBand,\n  HeatmapBandsColorScale,\n  HeatmapProps,\n  HeatmapHighlightedData,\n} from './chart_types/heatmap/specs/heatmap';\n\n// utilities\nexport {\n  Datum,\n  Position,\n  Rendering,\n  Rotation,\n  VerticalAlignment,\n  HorizontalAlignment,\n  RecursivePartial,\n  NonAny,\n  IsAny,\n  IsUnknown,\n  ColorVariant,\n  LabelAccessor,\n  ShowAccessor,\n  ValueAccessor,\n  ValueFormatter,\n  LayoutDirection,\n} from './utils/common';\nexport { DataGenerator } from './utils/data_generators/data_generator';\nexport * from './utils/themes/merge_utils';\nexport * from './utils/use_legend_action';\nexport { MODEL_KEY, defaultPartitionValueFormatter } from './chart_types/partition_chart/layout/config';\nexport { LegendStrategy } from './chart_types/partition_chart/layout/utils/highlighted_geoms';\nexport { Pixels, Ratio, TimeMs } from './common/geometry';\nexport { AdditiveNumber } from './utils/accessor';\nexport { FontStyle, FONT_STYLES } from './common/text_utils';\nexport { Color } from './common/colors';\nexport { RGB, A, RgbaTuple } from './common/color_library_wrappers';\nexport { Predicate } from './common/predicate';\nexport { SmallMultiplesDatum } from './common/panel_utils';\n\nexport type {\n  ESCalendarInterval,\n  ESCalendarIntervalUnit,\n  ESFixedInterval,\n  ESFixedIntervalUnit,\n} from './utils/chrono/elasticsearch';\nexport type { UnixTimestamp } from './utils/chrono/types';\nexport { roundDateToESInterval } from './utils/chrono/elasticsearch';\n\n// data utils\nexport { GroupKeysOrKeyFn, GroupByKeyFn } from './chart_types/xy_chart/utils/group_data_series';\nexport { computeRatioByGroups } from './utils/data/data_processing';\nexport { TimeFunction } from './utils/time_functions';\nexport * from './chart_types/flame_chart/flame_api';\nexport * from './chart_types/timeslip/timeslip_api';\nexport { LegacyAnimationConfig } from './common/animation';\n\n// Bullet\nexport {\n  ColorBandValue,\n  ColorBandConfig,\n  ColorBandSimpleConfig,\n  ColorBandComplexConfig,\n  BulletColorConfig,\n} from './chart_types/bullet_graph/utils/color';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/**@internal */\nexport const productPriceNames = [\n  { products_price: 0.0, name: '0' },\n  { products_price: 50.0, name: '50' },\n  { products_price: 100.0, name: '100' },\n  { products_price: 150.0, name: '150' },\n  { products_price: 200.0, name: '200' },\n  { products_price: 350.0, name: '350' },\n  { products_price: 400.0, name: '400' },\n  { products_price: 1050.0, name: '1050' },\n];\n\n/** @internal */\nexport const productDimension = [\n  {\n    sitc1: '0',\n    name: 'Food and live animals',\n    nameAR: 'الغذاء والحيوانات الحية',\n    nameHE: 'מזון וחיות חיות',\n  },\n  {\n    sitc1: '1',\n    name: 'Beverages and tobacco',\n    nameAR: 'المشروبات والتبغ',\n    nameHE: 'משקאות וטבק',\n  },\n  {\n    sitc1: '2',\n    name: 'Crude materials, inedible, except fuels',\n    nameAR: 'المواد الخام غير الصالحة للأكل عدا المحروقات',\n    nameHE: 'חומרים גולמיים, בלתי אכילים, למעט דלקים',\n  },\n  {\n    sitc1: '3',\n    name: 'Mineral fuels, lubricants and related materials',\n    nameAR: 'الوقود المعدني وزيوت التشحيم والمواد ذات الصلة',\n    nameHE: 'דלקים מינרליים, חומרי סיכה וחומרים נלווים',\n  },\n  {\n    sitc1: '4',\n    name: 'Animal and vegetable oils, fats and waxes',\n    nameAR: 'زيوت ودهون وشموع حيوانية ونباتية',\n    nameHE: 'שמנים, שומנים ושעווה מהחי וצומח',\n  },\n  {\n    sitc1: '5',\n    name: 'Chemicals and related products',\n    nameAR: 'الكيماويات والمنتجات ذات الصلة',\n    nameHE: 'כימיקלים ומוצרים נלווים',\n  },\n  {\n    sitc1: '6',\n    name: 'Manufactured goods classified chiefly by material',\n    nameAR: 'البضائع المصنعة مصنفة بشكل رئيسي حسب المادة',\n    nameHE: 'מוצרים מיוצרים המסווגים בעיקר לפי חומר',\n  },\n  {\n    sitc1: '7',\n    name: 'Machinery and transport equipment',\n    nameAR: 'الالات ومعدات النقل',\n    nameHE: 'מכונות וציוד הובלה',\n  },\n  {\n    sitc1: '8',\n    name: 'Miscellaneous manufactured articles',\n    nameAR: 'المواد المصنعة المتنوعة',\n    nameHE: 'מוצרים מיוצרים שונים',\n  },\n  {\n    sitc1: '9',\n    name: 'Commodities and transactions not classified elsewhere',\n    nameAR: 'السلع والمعاملات غير المصنفة في مكان آخر',\n    nameHE: 'סחורות ועסקאות שאינן מסווגות במקום אחר',\n  },\n];\n\n/** @internal */\nexport const regionDimension = [\n  { region: 'af', regionName: 'Africa' },\n  { region: 'as', regionName: 'Asia' },\n  { region: 'eu', regionName: 'Europe' },\n  { region: 'na', regionName: 'North America' },\n  { region: 'sa', regionName: 'South America' },\n  { region: 'oc', regionName: 'Oceania' },\n];\n\n/** @internal */\nexport const countryDimension = [\n  { continentCountry: 'afago', country: 'ago', name: 'Angola' },\n  { continentCountry: 'afbdi', country: 'bdi', name: 'Burundi' },\n  { continentCountry: 'afben', country: 'ben', name: 'Benin' },\n  { continentCountry: 'afbfa', country: 'bfa', name: 'Burkina Faso' },\n  { continentCountry: 'afbwa', country: 'bwa', name: 'Botswana' },\n  { continentCountry: 'afcaf', country: 'caf', name: 'Central African Republic' },\n  { continentCountry: 'afciv', country: 'civ', name: \"Cote d'Ivoire\" },\n  { continentCountry: 'afcmr', country: 'cmr', name: 'Cameroon' },\n  { continentCountry: 'afcod', country: 'cod', name: 'Democratic Republic of the Congo' },\n  { continentCountry: 'afcog', country: 'cog', name: 'Republic of the Congo' },\n  { continentCountry: 'afcom', country: 'com', name: 'Comoros' },\n  { continentCountry: 'afcpv', country: 'cpv', name: 'Cape Verde' },\n  { continentCountry: 'afdji', country: 'dji', name: 'Djibouti' },\n  { continentCountry: 'afdza', country: 'dza', name: 'Algeria' },\n  { continentCountry: 'afegy', country: 'egy', name: 'Egypt' },\n  { continentCountry: 'aferi', country: 'eri', name: 'Eritrea' },\n  { continentCountry: 'afesh', country: 'esh', name: 'Western Sahara' },\n  { continentCountry: 'afeth', country: 'eth', name: 'Ethiopia' },\n  { continentCountry: 'afgab', country: 'gab', name: 'Gabon' },\n  { continentCountry: 'afgha', country: 'gha', name: 'Ghana' },\n  { continentCountry: 'afgin', country: 'gin', name: 'Guinea' },\n  { continentCountry: 'afgmb', country: 'gmb', name: 'Gambia' },\n  { continentCountry: 'afgnb', country: 'gnb', name: 'Guinea-Bissau' },\n  { continentCountry: 'afgnq', country: 'gnq', name: 'Equatorial Guinea' },\n  { continentCountry: 'afken', country: 'ken', name: 'Kenya' },\n  { continentCountry: 'aflbr', country: 'lbr', name: 'Liberia' },\n  { continentCountry: 'aflby', country: 'lby', name: 'Libya' },\n  { continentCountry: 'aflso', country: 'lso', name: 'Lesotho' },\n  { continentCountry: 'afmar', country: 'mar', name: 'Morocco' },\n  { continentCountry: 'afmdg', country: 'mdg', name: 'Madagascar' },\n  { continentCountry: 'afmli', country: 'mli', name: 'Mali' },\n  { continentCountry: 'afmoz', country: 'moz', name: 'Mozambique' },\n  { continentCountry: 'afmrt', country: 'mrt', name: 'Mauritania' },\n  { continentCountry: 'afmus', country: 'mus', name: 'Mauritius' },\n  { continentCountry: 'afmwi', country: 'mwi', name: 'Malawi' },\n  { continentCountry: 'afmyt', country: 'myt', name: 'Mayotte' },\n  { continentCountry: 'afnam', country: 'nam', name: 'Namibia' },\n  { continentCountry: 'afner', country: 'ner', name: 'Niger' },\n  { continentCountry: 'afnga', country: 'nga', name: 'Nigeria' },\n  { continentCountry: 'afreu', country: 'reu', name: 'Reunion' },\n  { continentCountry: 'afrwa', country: 'rwa', name: 'Rwanda' },\n  { continentCountry: 'afsdn', country: 'sdn', name: 'Sudan' },\n  { continentCountry: 'afsen', country: 'sen', name: 'Senegal' },\n  { continentCountry: 'afshn', country: 'shn', name: 'Saint Helena' },\n  { continentCountry: 'afsle', country: 'sle', name: 'Sierra Leone' },\n  { continentCountry: 'afsom', country: 'som', name: 'Somalia' },\n  { continentCountry: 'afssd', country: 'ssd', name: 'South Sudan' },\n  { continentCountry: 'afstp', country: 'stp', name: 'Sao Tome and Principe' },\n  { continentCountry: 'afswz', country: 'swz', name: 'Swaziland' },\n  { continentCountry: 'afsyc', country: 'syc', name: 'Seychelles' },\n  { continentCountry: 'aftcd', country: 'tcd', name: 'Chad' },\n  { continentCountry: 'aftgo', country: 'tgo', name: 'Togo' },\n  { continentCountry: 'aftun', country: 'tun', name: 'Tunisia' },\n  { continentCountry: 'aftza', country: 'tza', name: 'Tanzania' },\n  { continentCountry: 'afuga', country: 'uga', name: 'Uganda' },\n  { continentCountry: 'afzaf', country: 'zaf', name: 'South Africa' },\n  { continentCountry: 'afzmb', country: 'zmb', name: 'Zambia' },\n  { continentCountry: 'afzwe', country: 'zwe', name: 'Zimbabwe' },\n  { continentCountry: 'anata', country: 'ata', name: 'Antarctica' },\n  { continentCountry: 'anatf', country: 'atf', name: 'French South Antarctic Territory' },\n  { continentCountry: 'anbvt', country: 'bvt', name: 'Bouvet Island' },\n  { continentCountry: 'anhmd', country: 'hmd', name: 'Heard Island and McDonald Islands' },\n  { continentCountry: 'ansgs', country: 'sgs', name: 'South Georgia South Sandwich Islands' },\n  { continentCountry: 'asafg', country: 'afg', name: 'Afghanistan' },\n  { continentCountry: 'asare', country: 'are', name: 'United Arab Emirates' },\n  { continentCountry: 'asarm', country: 'arm', name: 'Armenia' },\n  { continentCountry: 'asaze', country: 'aze', name: 'Azerbaijan' },\n  { continentCountry: 'asbgd', country: 'bgd', name: 'Bangladesh' },\n  { continentCountry: 'asbhr', country: 'bhr', name: 'Bahrain' },\n  { continentCountry: 'asbrn', country: 'brn', name: 'Brunei' },\n  { continentCountry: 'asbtn', country: 'btn', name: 'Bhutan' },\n  { continentCountry: 'ascck', country: 'cck', name: 'Cocos (Keeling) Islands' },\n  { continentCountry: 'aschn', country: 'chn', name: 'China' },\n  { continentCountry: 'ascxr', country: 'cxr', name: 'Christmas Island' },\n  { continentCountry: 'ascyp', country: 'cyp', name: 'Cyprus' },\n  { continentCountry: 'asgeo', country: 'geo', name: 'Georgia' },\n  { continentCountry: 'ashkg', country: 'hkg', name: 'Hong Kong' },\n  { continentCountry: 'asidn', country: 'idn', name: 'Indonesia' },\n  { continentCountry: 'asind', country: 'ind', name: 'India' },\n  { continentCountry: 'asiot', country: 'iot', name: 'British Indian Ocean Territory' },\n  { continentCountry: 'asirn', country: 'irn', name: 'Iran' },\n  { continentCountry: 'asirq', country: 'irq', name: 'Iraq' },\n  { continentCountry: 'asisr', country: 'isr', name: 'Israel' },\n  { continentCountry: 'asjor', country: 'jor', name: 'Jordan' },\n  { continentCountry: 'asjpn', country: 'jpn', name: 'Japan' },\n  { continentCountry: 'askaz', country: 'kaz', name: 'Kazakhstan' },\n  { continentCountry: 'askgz', country: 'kgz', name: 'Kyrgyzstan' },\n  { continentCountry: 'askhm', country: 'khm', name: 'Cambodia' },\n  { continentCountry: 'askor', country: 'kor', name: 'South Korea' },\n  { continentCountry: 'askwt', country: 'kwt', name: 'Kuwait' },\n  { continentCountry: 'aslao', country: 'lao', name: 'Laos' },\n  { continentCountry: 'aslbn', country: 'lbn', name: 'Lebanon' },\n  { continentCountry: 'aslka', country: 'lka', name: 'Sri Lanka' },\n  { continentCountry: 'asmac', country: 'mac', name: 'Macau' },\n  { continentCountry: 'asmdv', country: 'mdv', name: 'Maldives' },\n  { continentCountry: 'asmid', country: 'mid', name: 'Midway' },\n  { continentCountry: 'asmmr', country: 'mmr', name: 'Burma' },\n  { continentCountry: 'asmng', country: 'mng', name: 'Mongolia' },\n  { continentCountry: 'asmys', country: 'mys', name: 'Malaysia' },\n  { continentCountry: 'asnpl', country: 'npl', name: 'Nepal' },\n  { continentCountry: 'asomn', country: 'omn', name: 'Oman' },\n  { continentCountry: 'aspak', country: 'pak', name: 'Pakistan' },\n  { continentCountry: 'asphl', country: 'phl', name: 'Philippines' },\n  { continentCountry: 'asprk', country: 'prk', name: 'North Korea' },\n  { continentCountry: 'aspse', country: 'pse', name: 'Palestine' },\n  { continentCountry: 'asqat', country: 'qat', name: 'Qatar' },\n  { continentCountry: 'assau', country: 'sau', name: 'Saudi Arabia' },\n  { continentCountry: 'assgp', country: 'sgp', name: 'Singapore' },\n  { continentCountry: 'assyr', country: 'syr', name: 'Syria' },\n  { continentCountry: 'astha', country: 'tha', name: 'Thailand' },\n  { continentCountry: 'astjk', country: 'tjk', name: 'Tajikistan' },\n  { continentCountry: 'astkm', country: 'tkm', name: 'Turkmenistan' },\n  { continentCountry: 'astls', country: 'tls', name: 'Timor-Leste' },\n  { continentCountry: 'astur', country: 'tur', name: 'Turkey' },\n  { continentCountry: 'astwn', country: 'twn', name: 'Taiwan' },\n  { continentCountry: 'asuzb', country: 'uzb', name: 'Uzbekistan' },\n  { continentCountry: 'asvnm', country: 'vnm', name: 'Vietnam' },\n  { continentCountry: 'asyar', country: 'yar', name: 'Yemen Arab Republic' },\n  { continentCountry: 'asyem', country: 'yem', name: 'Yemen' },\n  { continentCountry: 'asymd', country: 'ymd', name: 'Democratic Yemen' },\n  { continentCountry: 'eualb', country: 'alb', name: 'Albania' },\n  { continentCountry: 'euand', country: 'and', name: 'Andorra' },\n  { continentCountry: 'euaut', country: 'aut', name: 'Austria' },\n  { continentCountry: 'eubel', country: 'bel', name: 'Belgium' },\n  { continentCountry: 'eubgr', country: 'bgr', name: 'Bulgaria' },\n  { continentCountry: 'eubih', country: 'bih', name: 'Bosnia and Herzegovina' },\n  { continentCountry: 'eublr', country: 'blr', name: 'Belarus' },\n  { continentCountry: 'eublx', country: 'blx', name: 'Belgium-Luxembourg' },\n  { continentCountry: 'euche', country: 'che', name: 'Switzerland' },\n  { continentCountry: 'euchi', country: 'chi', name: 'Channel Islands' },\n  { continentCountry: 'eucsk', country: 'csk', name: 'Czechoslovakia' },\n  { continentCountry: 'eucze', country: 'cze', name: 'Czech Republic' },\n  { continentCountry: 'euddr', country: 'ddr', name: 'Democratic Republic of Germany' },\n  { continentCountry: 'eudeu', country: 'deu', name: 'Germany' },\n  { continentCountry: 'eudnk', country: 'dnk', name: 'Denmark' },\n  { continentCountry: 'euesp', country: 'esp', name: 'Spain' },\n  { continentCountry: 'euest', country: 'est', name: 'Estonia' },\n  { continentCountry: 'eufdr', country: 'fdr', name: 'Federal Republic of Germany' },\n  { continentCountry: 'eufin', country: 'fin', name: 'Finland' },\n  { continentCountry: 'eufra', country: 'fra', name: 'France' },\n  { continentCountry: 'eufro', country: 'fro', name: 'Faroe Islands' },\n  { continentCountry: 'eugbr', country: 'gbr', name: 'United Kingdom' },\n  { continentCountry: 'eugib', country: 'gib', name: 'Gibraltar' },\n  { continentCountry: 'eugrc', country: 'grc', name: 'Greece' },\n  { continentCountry: 'euhrv', country: 'hrv', name: 'Croatia' },\n  { continentCountry: 'euhun', country: 'hun', name: 'Hungary' },\n  { continentCountry: 'euimn', country: 'imn', name: 'Isle of Man' },\n  { continentCountry: 'euirl', country: 'irl', name: 'Ireland' },\n  { continentCountry: 'euisl', country: 'isl', name: 'Iceland' },\n  { continentCountry: 'euita', country: 'ita', name: 'Italy' },\n  { continentCountry: 'euksv', country: 'ksv', name: 'Kosovo' },\n  { continentCountry: 'eulie', country: 'lie', name: 'Liechtenstein' },\n  { continentCountry: 'eultu', country: 'ltu', name: 'Lithuania' },\n  { continentCountry: 'eulux', country: 'lux', name: 'Luxembourg' },\n  { continentCountry: 'eulva', country: 'lva', name: 'Latvia' },\n  { continentCountry: 'eumco', country: 'mco', name: 'Monaco' },\n  { continentCountry: 'eumda', country: 'mda', name: 'Moldova' },\n  { continentCountry: 'eumkd', country: 'mkd', name: 'Macedonia' },\n  { continentCountry: 'eumlt', country: 'mlt', name: 'Malta' },\n  { continentCountry: 'eumne', country: 'mne', name: 'Montenegro' },\n  { continentCountry: 'eunld', country: 'nld', name: 'Netherlands' },\n  { continentCountry: 'eunor', country: 'nor', name: 'Norway' },\n  { continentCountry: 'eupol', country: 'pol', name: 'Poland' },\n  { continentCountry: 'euprt', country: 'prt', name: 'Portugal' },\n  { continentCountry: 'eurou', country: 'rou', name: 'Romania' },\n  { continentCountry: 'eurus', country: 'rus', name: 'Russia' },\n  { continentCountry: 'euscg', country: 'scg', name: 'Serbia and Montenegro' },\n  { continentCountry: 'eusjm', country: 'sjm', name: 'Svalbard' },\n  { continentCountry: 'eusmr', country: 'smr', name: 'San Marino' },\n  { continentCountry: 'eusrb', country: 'srb', name: 'Serbia' },\n  { continentCountry: 'eusun', country: 'sun', name: 'USSR' },\n  { continentCountry: 'eusvk', country: 'svk', name: 'Slovakia' },\n  { continentCountry: 'eusvn', country: 'svn', name: 'Slovenia' },\n  { continentCountry: 'euswe', country: 'swe', name: 'Sweden' },\n  { continentCountry: 'euukr', country: 'ukr', name: 'Ukraine' },\n  { continentCountry: 'euvat', country: 'vat', name: 'Holy See (Vatican City)' },\n  { continentCountry: 'euyug', country: 'yug', name: 'Yugoslavia' },\n  { continentCountry: 'naabw', country: 'abw', name: 'Aruba' },\n  { continentCountry: 'naaia', country: 'aia', name: 'Anguilla' },\n  { continentCountry: 'naant', country: 'ant', name: 'Netherlands Antilles' },\n  { continentCountry: 'naatg', country: 'atg', name: 'Antigua and Barbuda' },\n  { continentCountry: 'nabes', country: 'bes', name: 'Bonaire' },\n  { continentCountry: 'nabhs', country: 'bhs', name: 'Bahamas' },\n  { continentCountry: 'nablm', country: 'blm', name: 'Saint Barth√©lemy' },\n  { continentCountry: 'nablz', country: 'blz', name: 'Belize' },\n  { continentCountry: 'nabmu', country: 'bmu', name: 'Bermuda' },\n  { continentCountry: 'nabrb', country: 'brb', name: 'Barbados' },\n  { continentCountry: 'nacan', country: 'can', name: 'Canada' },\n  { continentCountry: 'nacri', country: 'cri', name: 'Costa Rica' },\n  { continentCountry: 'nacub', country: 'cub', name: 'Cuba' },\n  { continentCountry: 'nacuw', country: 'cuw', name: 'Cura√ßao' },\n  { continentCountry: 'nacym', country: 'cym', name: 'Cayman Islands' },\n  { continentCountry: 'nadma', country: 'dma', name: 'Dominica' },\n  { continentCountry: 'nadom', country: 'dom', name: 'Dominican Republic' },\n  { continentCountry: 'nagrd', country: 'grd', name: 'Grenada' },\n  { continentCountry: 'nagrl', country: 'grl', name: 'Greenland' },\n  { continentCountry: 'nagtm', country: 'gtm', name: 'Guatemala' },\n  { continentCountry: 'nahnd', country: 'hnd', name: 'Honduras' },\n  { continentCountry: 'nahti', country: 'hti', name: 'Haiti' },\n  { continentCountry: 'najam', country: 'jam', name: 'Jamaica' },\n  { continentCountry: 'nakna', country: 'kna', name: 'Saint Kitts and Nevis' },\n  { continentCountry: 'nalca', country: 'lca', name: 'Saint Lucia' },\n  { continentCountry: 'namaf', country: 'maf', name: 'Saint Maarten' },\n  { continentCountry: 'namex', country: 'mex', name: 'Mexico' },\n  { continentCountry: 'namsr', country: 'msr', name: 'Montserrat' },\n  { continentCountry: 'namtq', country: 'mtq', name: 'Martinique' },\n  { continentCountry: 'nanaa', country: 'naa', name: 'Netherland Antilles and Aruba' },\n  { continentCountry: 'nanic', country: 'nic', name: 'Nicaragua' },\n  { continentCountry: 'napan', country: 'pan', name: 'Panama' },\n  { continentCountry: 'napci', country: 'pci', name: 'Pacific Island (US)' },\n  { continentCountry: 'napcz', country: 'pcz', name: 'Panama Canal Zone' },\n  { continentCountry: 'napri', country: 'pri', name: 'Puerto Rico' },\n  { continentCountry: 'naslv', country: 'slv', name: 'El Salvador' },\n  { continentCountry: 'naspm', country: 'spm', name: 'Saint Pierre and Miquelon' },\n  { continentCountry: 'natca', country: 'tca', name: 'Turks and Caicos Islands' },\n  { continentCountry: 'natto', country: 'tto', name: 'Trinidad and Tobago' },\n  { continentCountry: 'naumi', country: 'umi', name: 'United States Minor Outlying Islands' },\n  { continentCountry: 'nausa', country: 'usa', name: 'United States' },\n  { continentCountry: 'navct', country: 'vct', name: 'Saint Vincent and the Grenadines' },\n  { continentCountry: 'navgb', country: 'vgb', name: 'British Virgin Islands' },\n  { continentCountry: 'navir', country: 'vir', name: 'Virgin Islands' },\n  { continentCountry: 'ocasm', country: 'asm', name: 'American Samoa' },\n  { continentCountry: 'ocaus', country: 'aus', name: 'Australia' },\n  { continentCountry: 'occok', country: 'cok', name: 'Cook Islands' },\n  { continentCountry: 'ocfji', country: 'fji', name: 'Fiji' },\n  { continentCountry: 'ocfsm', country: 'fsm', name: 'Micronesia' },\n  { continentCountry: 'ocglp', country: 'glp', name: 'Guadeloupe' },\n  { continentCountry: 'ocgum', country: 'gum', name: 'Guam' },\n  { continentCountry: 'ockir', country: 'kir', name: 'Kiribati' },\n  { continentCountry: 'ocmhl', country: 'mhl', name: 'Marshall Islands' },\n  { continentCountry: 'ocmnp', country: 'mnp', name: 'Northern Mariana Islands' },\n  { continentCountry: 'ocncl', country: 'ncl', name: 'New Caledonia' },\n  { continentCountry: 'ocnfk', country: 'nfk', name: 'Norfolk Island' },\n  { continentCountry: 'ocniu', country: 'niu', name: 'Niue' },\n  { continentCountry: 'ocnru', country: 'nru', name: 'Nauru' },\n  { continentCountry: 'ocnzl', country: 'nzl', name: 'New Zealand' },\n  { continentCountry: 'ocpcn', country: 'pcn', name: 'Pitcairn Islands' },\n  { continentCountry: 'ocplw', country: 'plw', name: 'Palau' },\n  { continentCountry: 'ocpng', country: 'png', name: 'Papua New Guinea' },\n  { continentCountry: 'ocpyf', country: 'pyf', name: 'French Polynesia' },\n  { continentCountry: 'ocslb', country: 'slb', name: 'Solomon Islands' },\n  { continentCountry: 'octkl', country: 'tkl', name: 'Tokelau' },\n  { continentCountry: 'octon', country: 'ton', name: 'Tonga' },\n  { continentCountry: 'octuv', country: 'tuv', name: 'Tuvalu' },\n  { continentCountry: 'ocvut', country: 'vut', name: 'Vanuatu' },\n  { continentCountry: 'ocwlf', country: 'wlf', name: 'Wallis and Futuna' },\n  { continentCountry: 'ocwsm', country: 'wsm', name: 'Samoa' },\n  { continentCountry: 'saarg', country: 'arg', name: 'Argentina' },\n  { continentCountry: 'sabol', country: 'bol', name: 'Bolivia' },\n  { continentCountry: 'sabra', country: 'bra', name: 'Brazil' },\n  { continentCountry: 'sachl', country: 'chl', name: 'Chile' },\n  { continentCountry: 'sacol', country: 'col', name: 'Colombia' },\n  { continentCountry: 'saecu', country: 'ecu', name: 'Ecuador' },\n  { continentCountry: 'saflk', country: 'flk', name: 'Falkland Islands' },\n  { continentCountry: 'saguf', country: 'guf', name: 'French Guiana' },\n  { continentCountry: 'saguy', country: 'guy', name: 'Guyana' },\n  { continentCountry: 'saper', country: 'per', name: 'Peru' },\n  { continentCountry: 'sapry', country: 'pry', name: 'Paraguay' },\n  { continentCountry: 'sasur', country: 'sur', name: 'Suriname' },\n  { continentCountry: 'saury', country: 'ury', name: 'Uruguay' },\n  { continentCountry: 'saven', country: 'ven', name: 'Venezuela' },\n  { continentCountry: 'xxwld', country: 'wld', name: 'World' },\n  { continentCountry: 'xxxxh', country: 'xxa', name: 'Areas' },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { manyPieMock } from './many_pie';\nimport { miniSunburstMock } from './mini_sunburst';\nimport { observabilityTreeMock } from './observability_tree';\nimport { pieMock } from './pie';\nimport { sunburstMock } from './sunburst';\n\n/** @internal */\nexport const mocks = {\n  pie: pieMock,\n  sunburst: sunburstMock,\n  miniSunburst: miniSunburstMock,\n  manyPie: manyPieMock,\n  observabilityTree: observabilityTreeMock,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const manyPieMock = [\n  { origin: 'chn', exportVal: 1680027842644 },\n  { origin: 'usa', exportVal: 1102566931395 },\n  { origin: 'deu', exportVal: 1062556067025 },\n  { origin: 'jpn', exportVal: 682060607712 },\n  { origin: 'fra', exportVal: 486717519772 },\n  { origin: 'kor', exportVal: 429341500570 },\n  { origin: 'ita', exportVal: 388082452213 },\n  { origin: 'nld', exportVal: 374451602037 },\n  { origin: 'can', exportVal: 362046595060 },\n  { origin: 'rus', exportVal: 360435750136 },\n  { origin: 'gbr', exportVal: 347628222830 },\n  { origin: 'mex', exportVal: 279440490401 },\n  { origin: 'bel', exportVal: 276331475549 },\n  { origin: 'mys', exportVal: 221211941430 },\n  { origin: 'esp', exportVal: 220725696243 },\n  { origin: 'che', exportVal: 217916829452 },\n  { origin: 'ind', exportVal: 211138300089 },\n  { origin: 'sau', exportVal: 207321414541 },\n  { origin: 'sgp', exportVal: 206513400598 },\n  { origin: 'bra', exportVal: 201273933253 },\n  { origin: 'aus', exportVal: 193277122627 },\n  { origin: 'tha', exportVal: 186564165591 },\n  { origin: 'idn', exportVal: 158159867052 },\n  { origin: 'are', exportVal: 155039720778 },\n  { origin: 'irl', exportVal: 135561950237 },\n  { origin: 'swe', exportVal: 132241085429 },\n  { origin: 'pol', exportVal: 130310102801 },\n  { origin: 'aut', exportVal: 126493546692 },\n  { origin: 'nor', exportVal: 123085657181 },\n  { origin: 'cze', exportVal: 109138761423 },\n  { origin: 'tur', exportVal: 107919189508 },\n  { origin: 'zaf', exportVal: 86865327178 },\n  { origin: 'dnk', exportVal: 80952198584 },\n  { origin: 'hun', exportVal: 79687476997 },\n  { origin: 'irn', exportVal: 77200364074 },\n  { origin: 'hkg', exportVal: 73164278476 },\n  { origin: 'nga', exportVal: 71428776813 },\n  { origin: 'vnm', exportVal: 69896077996 },\n  { origin: 'arg', exportVal: 65108843884 },\n  { origin: 'phl', exportVal: 64380113683 },\n  { origin: 'chl', exportVal: 62968068992 },\n  { origin: 'fin', exportVal: 62202122673 },\n  { origin: 'qat', exportVal: 59326138499 },\n  { origin: 'ven', exportVal: 55500881984 },\n  { origin: 'kwt', exportVal: 55400630374 },\n  { origin: 'ukr', exportVal: 54278860343 },\n  { origin: 'svk', exportVal: 53482619716 },\n  { origin: 'dza', exportVal: 53192494262 },\n  { origin: 'isr', exportVal: 50265596760 },\n  { origin: 'lby', exportVal: 45235556598 },\n  { origin: 'ago', exportVal: 45010895723 },\n  { origin: 'irq', exportVal: 44615332292 },\n  { origin: 'rou', exportVal: 44508446100 },\n  { origin: 'prt', exportVal: 43367388493 },\n  { origin: 'kaz', exportVal: 42068475259 },\n  { origin: 'col', exportVal: 38322220284 },\n  { origin: 'per', exportVal: 33873822574 },\n  { origin: 'egy', exportVal: 28814207699 },\n  { origin: 'nzl', exportVal: 28397440169 },\n  { origin: 'omn', exportVal: 27058636294 },\n  { origin: 'cri', exportVal: 23448846570 },\n  { origin: 'grc', exportVal: 22066497483 },\n  { origin: 'pak', exportVal: 21668594115 },\n  { origin: 'svn', exportVal: 21426115576 },\n  { origin: 'aze', exportVal: 20047358465 },\n  { origin: 'bgr', exportVal: 18841613257 },\n  { origin: 'bgd', exportVal: 18130589863 },\n  { origin: 'ecu', exportVal: 16980863677 },\n  { origin: 'lux', exportVal: 16478009245 },\n  { origin: 'mar', exportVal: 16237430066 },\n  { origin: 'tun', exportVal: 16031014518 },\n  { origin: 'ltu', exportVal: 15737237575 },\n  { origin: 'tto', exportVal: 12810076639 },\n  { origin: 'hrv', exportVal: 10916770107 },\n  { origin: 'est', exportVal: 10354731182 },\n  { origin: 'sdn', exportVal: 9800479528 },\n  { origin: 'srb', exportVal: 9029787907 },\n  { origin: 'cog', exportVal: 8949393562 },\n  { origin: 'blr', exportVal: 8929749700 },\n  { origin: 'lva', exportVal: 8555460871 },\n  { origin: 'civ', exportVal: 8073460547 },\n  { origin: 'brn', exportVal: 7925150288 },\n  { origin: 'gnq', exportVal: 7854023406 },\n  { origin: 'syr', exportVal: 7754782660 },\n  { origin: 'bhr', exportVal: 7529173128 },\n  { origin: 'lka', exportVal: 7339588373 },\n  { origin: 'ury', exportVal: 7165504406 },\n  { origin: 'yem', exportVal: 7158061799 },\n  { origin: 'gtm', exportVal: 7003757867 },\n  { origin: 'hnd', exportVal: 6030839002 },\n  { origin: 'pan', exportVal: 5930135538 },\n  { origin: 'mmr', exportVal: 5831563317 },\n  { origin: 'png', exportVal: 5769279559 },\n  { origin: 'mlt', exportVal: 5510882139 },\n  { origin: 'gab', exportVal: 5465186525 },\n  { origin: 'dom', exportVal: 5436778260 },\n  { origin: 'bol', exportVal: 5419211637 },\n  { origin: 'zmb', exportVal: 5131623093 },\n  { origin: 'khm', exportVal: 5112204572 },\n  { origin: 'cod', exportVal: 5076397761 },\n  { origin: 'uzb', exportVal: 4895581648 },\n  { origin: 'slv', exportVal: 4452895199 },\n  { origin: 'jor', exportVal: 4375537052 },\n  { origin: 'pry', exportVal: 4164535906 },\n  { origin: 'bih', exportVal: 4154602570 },\n  { origin: 'gha', exportVal: 4052850512 },\n  { origin: 'isl', exportVal: 3998498539 },\n  { origin: 'ken', exportVal: 3745974291 },\n  { origin: 'cmr', exportVal: 3744461941 },\n  { origin: 'moz', exportVal: 3235381310 },\n  { origin: 'cyp', exportVal: 3105446728 },\n  { origin: 'mkd', exportVal: 3003234599 },\n  { origin: 'nic', exportVal: 2968741221 },\n  { origin: 'tcd', exportVal: 2803301047 },\n  { origin: 'mng', exportVal: 2785683128 },\n  { origin: 'bhs', exportVal: 2702012957 },\n  { origin: 'nam', exportVal: 2582063735 },\n  { origin: 'bwa', exportVal: 2484287290 },\n  { origin: 'tza', exportVal: 2467509196 },\n  { origin: 'cub', exportVal: 2404595120 },\n  { origin: 'ant', exportVal: 2402558108 },\n  { origin: 'atg', exportVal: 2348417348 },\n  { origin: 'lbn', exportVal: 2341813110 },\n  { origin: 'tkm', exportVal: 2267612447 },\n  { origin: 'geo', exportVal: 1926999336 },\n  { origin: 'gin', exportVal: 1891629964 },\n  { origin: 'mrt', exportVal: 1886427106 },\n  { origin: 'mus', exportVal: 1853024506 },\n  { origin: 'prk', exportVal: 1840466387 },\n  { origin: 'lao', exportVal: 1813066982 },\n  { origin: 'sur', exportVal: 1670933603 },\n  { origin: 'mda', exportVal: 1535895371 },\n  { origin: 'eth', exportVal: 1485000925 },\n  { origin: 'alb', exportVal: 1422153482 },\n  { origin: 'sen', exportVal: 1354504280 },\n  { origin: 'zwe', exportVal: 1267893552 },\n  { origin: 'ncl', exportVal: 1116638208 },\n  { origin: 'kgz', exportVal: 1098720987 },\n  { origin: 'mdg', exportVal: 1076708874 },\n  { origin: 'brb', exportVal: 980638268 },\n  { origin: 'cym', exportVal: 974251949 },\n  { origin: 'tjk', exportVal: 958314400 },\n  { origin: 'guy', exportVal: 954432679 },\n  { origin: 'jam', exportVal: 943069430 },\n  { origin: 'uga', exportVal: 935275666 },\n  { origin: 'mwi', exportVal: 932077166 },\n  { origin: 'mac', exportVal: 887740944 },\n  { origin: 'tgo', exportVal: 838487021 },\n  { origin: 'lbr', exportVal: 801935957 },\n  { origin: 'swz', exportVal: 785406576 },\n  { origin: 'ben', exportVal: 725226637 },\n  { origin: 'arm', exportVal: 718132350 },\n  { origin: 'npl', exportVal: 714792917 },\n  { origin: 'fro', exportVal: 711844362 },\n  { origin: 'bmu', exportVal: 705643821 },\n  { origin: 'hti', exportVal: 617209639 },\n  { origin: 'mli', exportVal: 604706423 },\n  { origin: 'fji', exportVal: 602978562 },\n  { origin: 'grl', exportVal: 582480590 },\n  { origin: 'afg', exportVal: 567904408 },\n  { origin: 'bfa', exportVal: 525591271 },\n  { origin: 'lso', exportVal: 484570865 },\n  { origin: 'vut', exportVal: 435685569 },\n  { origin: 'mne', exportVal: 420770610 },\n  { origin: 'vgb', exportVal: 401903288 },\n  { origin: 'mhl', exportVal: 398834621 },\n  { origin: 'slb', exportVal: 367668498 },\n  { origin: 'blz', exportVal: 360301876 },\n  { origin: 'syc', exportVal: 346263287 },\n  { origin: 'sle', exportVal: 324356717 },\n  { origin: 'ner', exportVal: 296079291 },\n  { origin: 'som', exportVal: 285486366 },\n  { origin: 'gib', exportVal: 280334935 },\n  { origin: 'niu', exportVal: 261210980 },\n  { origin: 'and', exportVal: 234285648 },\n  { origin: 'abw', exportVal: 196774818 },\n  { origin: 'btn', exportVal: 189669110 },\n  { origin: 'pyf', exportVal: 178629453 },\n  { origin: 'rwa', exportVal: 174428177 },\n  { origin: 'smr', exportVal: 159388050 },\n  { origin: 'flk', exportVal: 159227983 },\n  { origin: 'gnb', exportVal: 139648187 },\n  { origin: 'vct', exportVal: 128049639 },\n  { origin: 'mdv', exportVal: 125878962 },\n  { origin: 'caf', exportVal: 118997237 },\n  { origin: 'bvt', exportVal: 113300883 },\n  { origin: 'pse', exportVal: 106543441 },\n  { origin: 'dji', exportVal: 106353077 },\n  { origin: 'bdi', exportVal: 71571028 },\n  { origin: 'kna', exportVal: 69543245 },\n  { origin: 'wsm', exportVal: 69125482 },\n  { origin: 'tls', exportVal: 62816488 },\n  { origin: 'lca', exportVal: 62118974 },\n  { origin: 'gmb', exportVal: 61496143 },\n  { origin: 'ata', exportVal: 54524545 },\n  { origin: 'fsm', exportVal: 51668670 },\n  { origin: 'nru', exportVal: 50706656 },\n  { origin: 'cpv', exportVal: 50405460 },\n  { origin: 'dma', exportVal: 49759430 },\n  { origin: 'umi', exportVal: 36534854 },\n  { origin: 'com', exportVal: 32497602 },\n  { origin: 'asm', exportVal: 30381132 },\n  { origin: 'gum', exportVal: 27562111 },\n  { origin: 'cok', exportVal: 22419977 },\n  { origin: 'kir', exportVal: 20578810 },\n  { origin: 'shn', exportVal: 19041382 },\n  { origin: 'grd', exportVal: 17998604 },\n  { origin: 'tca', exportVal: 17650505 },\n  { origin: 'eri', exportVal: 16165269 },\n  { origin: 'tkl', exportVal: 15171571 },\n  { origin: 'cxr', exportVal: 14415365 },\n  { origin: 'plw', exportVal: 14061574 },\n  { origin: 'tuv', exportVal: 13677929 },\n  { origin: 'stp', exportVal: 12435538 },\n  { origin: 'ton', exportVal: 10576037 },\n  { origin: 'aia', exportVal: 10374477 },\n  { origin: 'cck', exportVal: 8621289 },\n  { origin: 'myt', exportVal: 7502485 },\n  { origin: 'sgs', exportVal: 6000762 },\n  { origin: 'spm', exportVal: 5045811 },\n  { origin: 'vat', exportVal: 4840493 },\n  { origin: 'msr', exportVal: 4343283 },\n  { origin: 'iot', exportVal: 3375434 },\n  { origin: 'atf', exportVal: 3247132 },\n  { origin: 'nfk', exportVal: 2788736 },\n  { origin: 'mnp', exportVal: 2435135 },\n  { origin: 'pcn', exportVal: 1748735 },\n  { origin: 'wlf', exportVal: 1337566 },\n  { origin: 'esh', exportVal: 960601 },\n  { origin: 'hmd', exportVal: 154369 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const miniSunburstMock = [\n  { sitc1: '7', dest: 'usa', exportVal: 553359100104 },\n  { sitc1: '7', dest: 'chn', exportVal: 392617281424 },\n  { sitc1: '3', dest: 'usa', exportVal: 324856796136 },\n  { sitc1: '7', dest: 'deu', exportVal: 253250650864 },\n  { sitc1: '8', dest: 'usa', exportVal: 226628559432 },\n  { sitc1: '7', dest: 'hkg', exportVal: 177490158520 },\n  { sitc1: '3', dest: 'jpn', exportVal: 177421375512 },\n  { sitc1: '2', dest: 'chn', exportVal: 173840557624 },\n  { sitc1: '3', dest: 'chn', exportVal: 167989572088 },\n  { sitc1: '7', dest: 'fra', exportVal: 135443006088 },\n  { sitc1: '6', dest: 'usa', exportVal: 129879187528 },\n  { sitc1: '5', dest: 'usa', exportVal: 127516647672 },\n  { sitc1: '7', dest: 'can', exportVal: 118114362152 },\n  { sitc1: '7', dest: 'gbr', exportVal: 117139481536 },\n  { sitc1: '3', dest: 'kor', exportVal: 108348223232 },\n  { sitc1: '7', dest: 'jpn', exportVal: 106979336520 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// source of data: Martin Spier's https://github.com/spiermar/d3-flame-graph\n\n// prettier-ignore\n\n/** @internal */\nexport const observabilityTreeMock = {c:[{n:'genunix`syscall_mstate',v:89},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`page_lookup_create',v:1}],n:'unix`page_lookup',v:1}],n:'ufs`ufs_getpage',v:1}],n:'genunix`fop_getpage',v:1},{c:[{c:[{c:[{c:[{c:[{n:'genunix`pvn_plist_init',v:1},{n:'unix`lgrp_mem_choose',v:1},{c:[{c:[{c:[{n:'unix`mutex_enter',v:1}],n:'unix`page_get_mnode_freelist',v:1}],n:'unix`page_get_freelist',v:1}],n:'unix`page_create_va',v:1},{c:[{n:'unix`page_lookup_create',v:1}],n:'unix`page_lookup',v:1}],n:'genunix`swap_getapage',v:4}],n:'genunix`swap_getpage',v:4}],n:'genunix`fop_getpage',v:4},{c:[{c:[{n:'unix`hwblkclr',v:3}],n:'unix`pfnzero',v:3}],n:'unix`pagezero',v:3}],n:'genunix`anon_zero',v:7}],n:'genunix`segvn_faultpage',v:7},{n:'ufs`ufs_getpage',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`hment_compare',v:1}],n:'genunix`avl_find',v:1}],n:'genunix`avl_add',v:1}],n:'unix`hment_insert',v:2}],n:'unix`hment_assign',v:2}],n:'unix`hati_pte_map',v:2}],n:'unix`hati_load_common',v:2}],n:'unix`hat_memload',v:2}],n:'unix`hat_memload_region',v:2}],n:'genunix`segvn_fault',v:11}],n:'genunix`as_fault',v:12},{n:'genunix`segvn_fault',v:1}],n:'unix`pagefault',v:13}],n:'unix`trap',v:13}],n:'unix`0xfffffffffb8001d6',v:13},{n:'unix`0xfffffffffb800c7c',v:42},{n:'unix`0xfffffffffb800c81',v:2},{c:[{n:'genunix`gethrtime_unscaled',v:4},{c:[{c:[{n:'unix`tsc_gethrtimeunscaled',v:11},{n:'unix`tsc_read',v:186}],n:'genunix`gethrtime_unscaled',v:203},{n:'unix`tsc_gethrtimeunscaled',v:13}],n:'genunix`syscall_mstate',v:355},{n:'unix`atomic_add_64',v:110}],n:'unix`0xfffffffffb800c86',v:472},{c:[{n:'genunix`audit_getstate',v:27},{n:'genunix`clear_stale_fd',v:10},{n:'genunix`disp_lock_exit',v:27},{c:[{n:'FSS`fss_preempt',v:1},{n:'genunix`audit_getstate',v:15},{n:'genunix`clear_stale_fd',v:44},{c:[{n:'unix`clear_int_flag',v:39},{n:'unix`do_splx',v:1993},{c:[{c:[{c:[{n:'unix`do_splx',v:1}],n:'genunix`disp_lock_exit_nopreempt',v:1}],n:'unix`preempt',v:1}],n:'unix`kpreempt',v:1}],n:'genunix`disp_lock_exit',v:2096},{n:'genunix`sigcheck',v:1},{c:[{n:'unix`clear_int_flag',v:180},{n:'unix`splr',v:400}],n:'genunix`thread_lock',v:670},{n:'unix`do_splx',v:31},{n:'unix`i_ddi_splhigh',v:23},{n:'unix`lock_clear_splx',v:28},{n:'unix`lock_try',v:778},{n:'unix`lwp_getdatamodel',v:6},{c:[{c:[{c:[{c:[{c:[{n:'unix`tsc_gethrtimeunscaled',v:1}],n:'genunix`mstate_thread_onproc_time',v:1}],n:'unix`caps_charge_adjust',v:1}],n:'unix`cpucaps_charge',v:3},{c:[{n:'unix`cmt_balance',v:1},{c:[{n:'unix`bitset_in_set',v:1}],n:'unix`cpu_wakeup_mwait',v:1}],n:'unix`setbackdq',v:5}],n:'FSS`fss_preempt',v:8},{n:'unix`do_splx',v:1},{c:[{n:'genunix`disp_lock_exit_high',v:1},{c:[{n:'unix`membar_enter',v:1}],n:'unix`disp',v:1},{n:'unix`do_splx',v:1},{c:[{c:[{n:'genunix`schedctl_save',v:1}],n:'genunix`savectx',v:2}],n:'unix`resume',v:2}],n:'unix`swtch',v:5}],n:'unix`preempt',v:14},{n:'unix`prunstop',v:36},{n:'unix`splr',v:92},{n:'unix`splx',v:6}],n:'genunix`post_syscall',v:4245},{n:'genunix`thread_lock',v:33},{n:'unix`lwp_getdatamodel',v:3},{n:'unix`prunstop',v:2}],n:'unix`0xfffffffffb800c91',v:4361},{c:[{n:'genunix`gethrtime_unscaled',v:7},{c:[{c:[{n:'unix`tsc_gethrtimeunscaled',v:17},{n:'unix`tsc_read',v:160}],n:'genunix`gethrtime_unscaled',v:182},{n:'unix`tsc_gethrtimeunscaled',v:12}],n:'genunix`syscall_mstate',v:412},{n:'unix`atomic_add_64',v:95}],n:'unix`0xfffffffffb800ca0',v:517},{n:'unix`_sys_rtt',v:6},{c:[{c:[{c:[{c:[{c:[{c:[{n:'genunix`cpu_decay',v:1}],n:'genunix`cpu_grow',v:1}],n:'genunix`cpu_update_pct',v:1}],n:'genunix`new_mstate',v:1}],n:'unix`trap',v:1}],n:'unix`sys_rtt_common',v:1}],n:'unix`_sys_rtt_ints_disabled',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'doorfs`door_close',v:1}],n:'namefs`nm_close',v:1}],n:'genunix`fop_close',v:1}],n:'genunix`closef',v:1}],n:'genunix`close_exec',v:1}],n:'genunix`exec_common',v:1}],n:'genunix`exece',v:1}],n:'unix`_sys_sysenter_post_swapgs',v:1},{c:[{n:'genunix`gethrtime_unscaled',v:11},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`mtype_func',v:1},{n:'unix`mutex_enter',v:1}],n:'unix`page_get_mnode_freelist',v:2}],n:'unix`page_get_freelist',v:2}],n:'unix`page_create_va',v:3}],n:'genunix`pvn_read_kluster',v:3}],n:'ufs`ufs_getpage_ra',v:3}],n:'ufs`ufs_getpage',v:3}],n:'genunix`fop_getpage',v:3}],n:'genunix`segvn_faulta',v:3}],n:'genunix`as_faulta',v:3}],n:'genunix`memcntl',v:3},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`htable_lookup',v:1}],n:'unix`htable_walk',v:1}],n:'unix`hat_unload_callback',v:1}],n:'genunix`segvn_unmap',v:1}],n:'genunix`as_unmap',v:1}],n:'unix`mmapobj_map_elf',v:1}],n:'unix`mmapobj_map_interpret',v:1}],n:'unix`mmapobj',v:1}],n:'genunix`mmapobjsys',v:1},{c:[{n:'genunix`copen',v:7},{c:[{n:'genunix`audit_getstate',v:62},{c:[{n:'genunix`audit_falloc',v:8},{c:[{c:[{c:[{c:[{c:[{n:'unix`swtch',v:1}],n:'unix`preempt',v:1}],n:'unix`kpreempt',v:1}],n:'unix`sys_rtt_common',v:1}],n:'unix`_sys_rtt_ints_disabled',v:1}],n:'genunix`audit_getstate',v:66},{n:'genunix`audit_unfalloc',v:32},{n:'genunix`crfree',v:9},{n:'genunix`crhold',v:5},{n:'genunix`cv_broadcast',v:16},{c:[{c:[{n:'genunix`kmem_cache_alloc',v:11},{c:[{n:'genunix`kmem_cache_alloc',v:66},{n:'unix`mutex_enter',v:122},{n:'unix`mutex_exit',v:46}],n:'genunix`kmem_zalloc',v:280},{n:'unix`bzero',v:8}],n:'genunix`audit_falloc',v:313},{n:'genunix`crhold',v:11},{n:'genunix`kmem_cache_alloc',v:49},{n:'genunix`kmem_zalloc',v:13},{c:[{n:'genunix`fd_find',v:13},{n:'genunix`fd_reserve',v:9},{c:[{n:'genunix`fd_find',v:161},{n:'genunix`fd_reserve',v:15}],n:'genunix`ufalloc_file',v:294},{n:'unix`mutex_enter',v:197},{n:'unix`mutex_exit',v:29}],n:'genunix`ufalloc',v:551},{n:'genunix`ufalloc_file',v:20},{n:'unix`atomic_add_32',v:134},{n:'unix`mutex_enter',v:99},{n:'unix`mutex_exit',v:58}],n:'genunix`falloc',v:1363},{n:'genunix`fd_reserve',v:8},{n:'genunix`kmem_cache_alloc',v:9},{n:'genunix`kmem_cache_free',v:5},{n:'genunix`lookupnameat',v:69},{n:'genunix`set_errno',v:24},{c:[{n:'genunix`audit_getstate',v:31},{n:'genunix`cv_broadcast',v:25},{n:'genunix`fd_reserve',v:35}],n:'genunix`setf',v:187},{n:'genunix`ufalloc',v:10},{c:[{c:[{n:'genunix`kmem_cache_free',v:5},{c:[{n:'genunix`kmem_cache_free',v:73},{n:'unix`mutex_enter',v:111},{n:'unix`mutex_exit',v:55}],n:'genunix`kmem_free',v:288}],n:'genunix`audit_unfalloc',v:340},{n:'genunix`crfree',v:13},{n:'genunix`kmem_cache_free',v:51},{n:'genunix`kmem_free',v:11},{n:'unix`atomic_add_32_nv',v:100},{n:'unix`mutex_enter',v:97},{n:'unix`mutex_exit',v:56}],n:'genunix`unfalloc',v:729},{c:[{c:[{c:[{c:[{n:'genunix`audit_getstate',v:16},{n:'genunix`fop_lookup',v:55},{c:[{n:'genunix`audit_getstate',v:21},{n:'genunix`crgetmapped',v:55},{n:'genunix`fop_inactive',v:39},{c:[{n:'genunix`crgetmapped',v:57},{n:'genunix`dnlc_lookup',v:26},{n:'genunix`fop_lookup',v:85},{n:'genunix`kmem_alloc',v:73},{n:'genunix`traverse',v:30},{n:'genunix`vfs_matchops',v:28},{c:[{c:[{n:'genunix`kmem_cache_alloc',v:241},{n:'unix`mutex_enter',v:366},{n:'unix`mutex_exit',v:149}],n:'genunix`kmem_alloc',v:934},{n:'genunix`kmem_cache_alloc',v:32}],n:'genunix`vn_setpath',v:1969},{c:[{n:'genunix`crgetmapped',v:36},{c:[{n:'genunix`crgetmapped',v:58},{n:'genunix`dnlc_lookup',v:70},{n:'genunix`vn_rele',v:14},{n:'ufs`ufs_iaccess',v:91},{c:[{n:'genunix`crgetuid',v:30},{c:[{n:'genunix`memcmp',v:38},{c:[{n:'genunix`memcmp',v:277}],n:'unix`bcmp',v:295}],n:'genunix`dnlc_lookup',v:1843},{n:'genunix`secpolicy_vnode_access2',v:72},{n:'genunix`vn_rele',v:39},{c:[{n:'genunix`crgetuid',v:22},{n:'genunix`secpolicy_vnode_access2',v:217}],n:'ufs`ufs_iaccess',v:648},{n:'unix`bcmp',v:42},{n:'unix`mutex_enter',v:980},{n:'unix`mutex_exit',v:350},{n:'unix`rw_enter',v:525},{n:'unix`rw_exit',v:439}],n:'ufs`ufs_lookup',v:5399}],n:'genunix`fop_lookup',v:6470},{n:'genunix`kmem_cache_alloc',v:39},{c:[{n:'genunix`rwst_exit',v:18},{n:'genunix`rwst_tryenter',v:32},{n:'genunix`vn_mountedvfs',v:11},{n:'genunix`vn_vfslocks_getlock',v:62},{n:'genunix`vn_vfslocks_rele',v:50},{c:[{n:'genunix`kmem_alloc',v:32},{n:'genunix`rwst_enter_common',v:32},{n:'genunix`rwst_init',v:28},{c:[{n:'genunix`rwst_enter_common',v:264},{n:'unix`mutex_enter',v:337},{n:'unix`mutex_exit',v:105}],n:'genunix`rwst_tryenter',v:734},{c:[{n:'genunix`cv_init',v:53},{c:[{c:[{n:'genunix`kmem_cpu_reload',v:2}],n:'genunix`kmem_cache_alloc',v:168},{n:'unix`mutex_enter',v:379},{n:'unix`mutex_exit',v:155}],n:'genunix`kmem_alloc',v:795},{n:'genunix`kmem_cache_alloc',v:29},{c:[{n:'genunix`cv_init',v:65},{n:'unix`mutex_init',v:53}],n:'genunix`rwst_init',v:236},{n:'unix`mutex_init',v:46}],n:'genunix`vn_vfslocks_getlock',v:1357},{n:'unix`mutex_enter',v:727},{n:'unix`mutex_exit',v:371}],n:'genunix`vn_vfsrlock',v:3342},{c:[{n:'genunix`cv_broadcast',v:25},{n:'genunix`kmem_free',v:35},{n:'genunix`rwst_destroy',v:32},{c:[{n:'genunix`cv_broadcast',v:40}],n:'genunix`rwst_exit',v:167},{n:'genunix`vn_vfslocks_getlock',v:120},{c:[{n:'genunix`cv_destroy',v:77},{n:'genunix`kmem_cache_free',v:22},{c:[{n:'genunix`kmem_cache_free',v:154},{n:'unix`mutex_enter',v:316},{n:'unix`mutex_exit',v:148}],n:'genunix`kmem_free',v:693},{c:[{n:'genunix`cv_destroy',v:42},{n:'unix`mutex_destroy',v:176}],n:'genunix`rwst_destroy',v:296},{n:'unix`mutex_destroy',v:31}],n:'genunix`vn_vfslocks_rele',v:1420},{n:'unix`mutex_enter',v:1202},{n:'unix`mutex_exit',v:512}],n:'genunix`vn_vfsunlock',v:3578}],n:'genunix`traverse',v:7243},{n:'genunix`vfs_getops',v:21},{c:[{n:'genunix`vfs_getops',v:157},{n:'unix`membar_consumer',v:123}],n:'genunix`vfs_matchops',v:336},{n:'genunix`vn_alloc',v:20},{n:'genunix`vn_exists',v:17},{n:'genunix`vn_mountedvfs',v:30},{n:'genunix`vn_setops',v:41},{n:'genunix`vn_vfsrlock',v:13},{n:'genunix`vn_vfsunlock',v:40},{n:'lofs`lfind',v:26},{n:'lofs`lsave',v:27},{n:'lofs`makelfsnode',v:28},{c:[{n:'genunix`kmem_cache_alloc',v:234},{n:'genunix`kmem_cpu_reload',v:1},{c:[{n:'genunix`kmem_cache_alloc',v:179},{n:'genunix`vn_recycle',v:33},{c:[{c:[{n:'genunix`vsd_free',v:155}],n:'genunix`vn_recycle',v:319},{n:'genunix`vsd_free',v:14}],n:'genunix`vn_reinit',v:424},{n:'unix`mutex_enter',v:318},{n:'unix`mutex_exit',v:142}],n:'genunix`vn_alloc',v:1189},{n:'genunix`vn_exists',v:50},{n:'genunix`vn_reinit',v:48},{n:'genunix`vn_setops',v:160},{n:'lofs`lfind',v:278},{n:'lofs`lsave',v:162},{n:'lofs`makelfsnode',v:82},{n:'lofs`table_lock_enter',v:220},{n:'unix`atomic_cas_64',v:318},{n:'unix`membar_consumer',v:237},{n:'unix`mutex_enter',v:640},{n:'unix`mutex_exit',v:138}],n:'lofs`makelonode',v:4212},{n:'lofs`table_lock_enter',v:43},{n:'ufs`ufs_lookup',v:46},{n:'unix`atomic_add_32',v:325},{n:'unix`mutex_exit',v:26}],n:'lofs`lo_lookup',v:19887},{n:'lofs`makelonode',v:39},{n:'unix`bcopy',v:896},{n:'unix`mutex_enter',v:947},{n:'unix`mutex_exit',v:337},{c:[{c:[{c:[{n:'unix`dispatch_hilevel',v:1}],n:'unix`do_interrupt',v:1}],n:'unix`_interrupt',v:1}],n:'unix`strlen',v:2659},{n:'zfs`specvp_check',v:10},{n:'zfs`zfs_fastaccesschk_execute',v:4},{c:[{n:'genunix`crgetuid',v:6},{c:[{n:'genunix`memcmp',v:3},{c:[{n:'genunix`memcmp',v:38}],n:'unix`bcmp',v:45}],n:'genunix`dnlc_lookup',v:263},{n:'unix`bcmp',v:11},{n:'unix`mutex_enter',v:309},{n:'unix`mutex_exit',v:135},{n:'zfs`specvp_check',v:20},{c:[{n:'genunix`crgetuid',v:2}],n:'zfs`zfs_fastaccesschk_execute',v:50}],n:'zfs`zfs_lookup',v:946}],n:'genunix`fop_lookup',v:29216},{n:'genunix`fsop_root',v:62},{n:'genunix`pn_fixslash',v:44},{n:'genunix`pn_getcomponent',v:454},{c:[{c:[{n:'lofs`lo_root',v:80},{n:'unix`mutex_enter',v:95},{n:'unix`mutex_exit',v:59}],n:'genunix`fsop_root',v:297},{n:'genunix`rwst_exit',v:12},{n:'genunix`rwst_tryenter',v:37},{n:'genunix`vn_mountedvfs',v:20},{n:'genunix`vn_rele',v:19},{n:'genunix`vn_vfslocks_getlock',v:47},{n:'genunix`vn_vfslocks_rele',v:34},{c:[{n:'genunix`kmem_alloc',v:11},{n:'genunix`rwst_enter_common',v:28},{n:'genunix`rwst_init',v:13},{c:[{n:'genunix`rwst_enter_common',v:314},{n:'unix`mutex_enter',v:238},{n:'unix`mutex_exit',v:49}],n:'genunix`rwst_tryenter',v:628},{c:[{n:'genunix`cv_init',v:56},{c:[{n:'genunix`kmem_cache_alloc',v:126},{n:'unix`mutex_enter',v:252},{n:'unix`mutex_exit',v:95}],n:'genunix`kmem_alloc',v:533},{n:'genunix`kmem_cache_alloc',v:17},{c:[{n:'genunix`cv_init',v:49},{n:'unix`mutex_init',v:38}],n:'genunix`rwst_init',v:173},{n:'unix`mutex_init',v:31}],n:'genunix`vn_vfslocks_getlock',v:973},{n:'unix`mutex_enter',v:455},{n:'unix`mutex_exit',v:250}],n:'genunix`vn_vfsrlock',v:2414},{c:[{n:'genunix`cv_broadcast',v:14},{n:'genunix`kmem_free',v:17},{n:'genunix`rwst_destroy',v:20},{c:[{n:'genunix`cv_broadcast',v:19}],n:'genunix`rwst_exit',v:110},{n:'genunix`vn_vfslocks_getlock',v:79},{c:[{n:'genunix`cv_destroy',v:81},{n:'genunix`kmem_cache_free',v:18},{c:[{n:'genunix`kmem_cache_free',v:116},{n:'unix`mutex_enter',v:195},{n:'unix`mutex_exit',v:90}],n:'genunix`kmem_free',v:457},{c:[{n:'genunix`cv_destroy',v:31},{n:'unix`mutex_destroy',v:53}],n:'genunix`rwst_destroy',v:146},{n:'unix`mutex_destroy',v:17}],n:'genunix`vn_vfslocks_rele',v:903},{n:'unix`mutex_enter',v:823},{n:'unix`mutex_exit',v:356}],n:'genunix`vn_vfsunlock',v:2372},{n:'lofs`lo_root',v:31},{n:'unix`mutex_enter',v:95},{n:'unix`mutex_exit',v:56}],n:'genunix`traverse',v:5557},{n:'genunix`vn_mountedvfs',v:43},{c:[{n:'genunix`crgetmapped',v:31},{c:[{n:'genunix`crgetmapped',v:41},{n:'lofs`freelonode',v:35},{c:[{n:'genunix`kmem_cache_free',v:29},{n:'genunix`vn_free',v:26},{n:'genunix`vn_invalid',v:20},{n:'genunix`vn_rele',v:25},{c:[{c:[{n:'genunix`kmem_cpu_reload',v:1}],n:'genunix`kmem_cache_free',v:184},{n:'genunix`kmem_free',v:115},{c:[{c:[{n:'genunix`kmem_cpu_reload',v:4}],n:'genunix`kmem_cache_free',v:215},{n:'genunix`kmem_cpu_reload',v:5},{c:[{n:'genunix`kmem_cache_free',v:209},{n:'unix`mutex_enter',v:299},{n:'unix`mutex_exit',v:160}],n:'genunix`kmem_free',v:785},{n:'genunix`vsd_free',v:48},{n:'unix`mutex_enter',v:314},{n:'unix`mutex_exit',v:171}],n:'genunix`vn_free',v:1663},{n:'genunix`vn_invalid',v:47},{n:'genunix`vn_rele',v:64},{n:'genunix`vsd_free',v:17},{n:'lofs`table_lock_enter',v:189},{n:'unix`membar_consumer',v:106},{n:'unix`mutex_enter',v:905},{n:'unix`mutex_exit',v:358},{n:'unix`strlen',v:1238}],n:'lofs`freelonode',v:5313},{n:'lofs`table_lock_enter',v:44},{n:'unix`atomic_add_32',v:292},{n:'unix`mutex_enter',v:279},{n:'unix`mutex_exit',v:212}],n:'lofs`lo_inactive',v:6307}],n:'genunix`fop_inactive',v:6689},{n:'lofs`lo_inactive',v:21}],n:'genunix`vn_rele',v:6943},{n:'genunix`vn_setpath',v:58},{n:'genunix`vn_vfsrlock',v:12},{n:'genunix`vn_vfsunlock',v:20},{n:'lofs`lo_lookup',v:65},{n:'unix`mutex_enter',v:575},{n:'unix`mutex_exit',v:379},{n:'unix`strlen',v:107},{n:'zfs`zfs_lookup',v:22}],n:'genunix`lookuppnvp',v:44242},{n:'genunix`pn_fixslash',v:14},{n:'genunix`pn_getcomponent',v:41},{n:'genunix`traverse',v:17},{n:'genunix`vn_mountedvfs',v:56},{n:'genunix`vn_rele',v:73},{c:[{n:'unix`mutex_delay_default',v:1},{n:'unix`tsc_read',v:1}],n:'unix`mutex_vector_enter',v:2}],n:'genunix`lookuppnatcred',v:44681},{n:'genunix`lookuppnvp',v:10},{c:[{n:'unix`copyinstr',v:25},{n:'unix`copystr',v:598}],n:'genunix`pn_get_buf',v:687},{n:'unix`copyinstr',v:18},{n:'unix`mutex_enter',v:320},{n:'unix`mutex_exit',v:163}],n:'genunix`lookupnameatcred',v:45978},{n:'genunix`lookuppnatcred',v:12},{n:'genunix`pn_get_buf',v:13}],n:'genunix`lookupnameat',v:46075},{n:'genunix`lookupnameatcred',v:22}],n:'genunix`vn_openat',v:46342},{n:'unix`mutex_enter',v:303},{n:'unix`mutex_exit',v:38}],n:'genunix`copen',v:49444},{n:'genunix`falloc',v:36},{n:'genunix`set_errno',v:9},{n:'genunix`setf',v:16},{n:'genunix`unfalloc',v:39},{n:'genunix`vn_openat',v:14}],n:'genunix`openat',v:49647}],n:'genunix`open',v:49669},{n:'genunix`openat',v:17},{c:[{c:[{c:[{n:'genunix`dotoprocs',v:1}],n:'genunix`doprio',v:1}],n:'genunix`priocntl_common',v:1}],n:'genunix`priocntlsys',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'genunix`dnlc_lookup',v:1}],n:'ufs`ufs_lookup',v:1}],n:'genunix`fop_lookup',v:1}],n:'lofs`lo_lookup',v:1}],n:'genunix`fop_lookup',v:1}],n:'genunix`lookuppnvp',v:1}],n:'genunix`lookuppnatcred',v:1}],n:'genunix`lookuppn',v:1}],n:'genunix`resolvepath',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'genunix`kmem_cache_free',v:1}],n:'genunix`kmem_free',v:1}],n:'genunix`removectx',v:1}],n:'genunix`schedctl_lwp_cleanup',v:1}],n:'genunix`exitlwps',v:1},{c:[{c:[{c:[{c:[{c:[{c:[{c:[{n:'unix`hment_compare',v:2}],n:'genunix`avl_find',v:2}],n:'unix`hment_remove',v:2},{n:'unix`page_numtopp_nolock',v:1}],n:'unix`hat_pte_unmap',v:3}],n:'unix`hat_unload_callback',v:3}],n:'genunix`segvn_unmap',v:3}],n:'genunix`as_free',v:3}],n:'genunix`relvm',v:3},{c:[{c:[{c:[{c:[{n:'genunix`vmem_free',v:1}],n:'genunix`segkp_release_internal',v:1}],n:'genunix`segkp_release',v:1}],n:'genunix`schedctl_freepage',v:1}],n:'genunix`schedctl_proc_cleanup',v:1}],n:'genunix`proc_exit',v:5}],n:'genunix`exit',v:5}],n:'genunix`rexit',v:5},{c:[{c:[{n:'unix`tsc_gethrtimeunscaled',v:43},{n:'unix`tsc_read',v:367}],n:'genunix`gethrtime_unscaled',v:420},{n:'unix`tsc_gethrtimeunscaled',v:59}],n:'genunix`syscall_mstate',v:1336},{n:'unix`atomic_add_64',v:205}],n:'unix`sys_syscall',v:51908}],n:'root',v:57412};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RgbTuple } from '../../common/color_library_wrappers';\n\nconst CET2s: RgbTuple[] = [\n  [46, 34, 235],\n  [49, 32, 237],\n  [52, 30, 238],\n  [56, 29, 239],\n  [59, 28, 240],\n  [63, 27, 241],\n  [66, 27, 242],\n  [70, 27, 242],\n  [73, 27, 243],\n  [77, 28, 244],\n  [80, 29, 244],\n  [84, 30, 245],\n  [87, 31, 245],\n  [91, 32, 246],\n  [94, 33, 246],\n  [97, 35, 246],\n  [100, 36, 247],\n  [103, 38, 247],\n  [106, 39, 248],\n  [109, 41, 248],\n  [112, 42, 248],\n  [115, 44, 249],\n  [118, 45, 249],\n  [121, 47, 249],\n  [123, 48, 250],\n  [126, 49, 250],\n  [129, 51, 250],\n  [132, 52, 251],\n  [135, 53, 251],\n  [137, 54, 251],\n  [140, 56, 251],\n  [143, 57, 251],\n  [146, 58, 252],\n  [149, 59, 252],\n  [152, 60, 252],\n  [155, 60, 252],\n  [158, 61, 252],\n  [162, 62, 252],\n  [165, 63, 252],\n  [168, 63, 252],\n  [171, 64, 252],\n  [175, 65, 252],\n  [178, 65, 252],\n  [181, 66, 252],\n  [185, 66, 252],\n  [188, 66, 252],\n  [191, 67, 252],\n  [195, 67, 252],\n  [198, 68, 252],\n  [201, 68, 251],\n  [204, 69, 251],\n  [207, 69, 251],\n  [211, 70, 251],\n  [214, 70, 251],\n  [217, 71, 250],\n  [219, 72, 250],\n  [222, 73, 250],\n  [225, 74, 249],\n  [227, 75, 249],\n  [230, 76, 248],\n  [232, 78, 247],\n  [234, 79, 246],\n  [236, 81, 245],\n  [238, 83, 244],\n  [240, 85, 243],\n  [242, 88, 241],\n  [243, 90, 240],\n  [244, 93, 238],\n  [245, 96, 236],\n  [246, 99, 234],\n  [247, 102, 232],\n  [248, 105, 230],\n  [249, 108, 227],\n  [249, 111, 225],\n  [250, 114, 223],\n  [250, 117, 220],\n  [251, 120, 217],\n  [251, 123, 215],\n  [252, 127, 212],\n  [252, 130, 210],\n  [252, 133, 207],\n  [252, 136, 204],\n  [252, 139, 201],\n  [253, 141, 199],\n  [253, 144, 196],\n  [253, 147, 193],\n  [253, 150, 190],\n  [253, 153, 188],\n  [253, 156, 185],\n  [253, 158, 182],\n  [253, 161, 179],\n  [253, 164, 177],\n  [253, 166, 174],\n  [253, 169, 171],\n  [253, 171, 168],\n  [253, 174, 165],\n  [252, 176, 162],\n  [252, 179, 160],\n  [252, 181, 157],\n  [252, 184, 154],\n  [252, 186, 151],\n  [253, 188, 148],\n  [253, 191, 145],\n  [253, 193, 142],\n  [253, 195, 139],\n  [253, 198, 136],\n  [253, 200, 133],\n  [253, 202, 130],\n  [253, 204, 127],\n  [253, 207, 124],\n  [253, 209, 120],\n  [253, 211, 117],\n  [253, 213, 114],\n  [253, 215, 110],\n  [253, 217, 107],\n  [253, 219, 104],\n  [253, 221, 100],\n  [252, 223, 96],\n  [252, 225, 93],\n  [252, 227, 89],\n  [251, 229, 85],\n  [250, 231, 81],\n  [250, 232, 77],\n  [249, 234, 73],\n  [248, 235, 69],\n  [246, 236, 65],\n  [245, 237, 61],\n  [243, 238, 57],\n  [242, 239, 54],\n  [240, 239, 50],\n  [238, 239, 46],\n  [235, 239, 43],\n  [233, 239, 40],\n  [231, 239, 37],\n  [228, 239, 35],\n  [225, 238, 33],\n  [223, 238, 31],\n  [220, 237, 29],\n  [217, 236, 27],\n  [214, 235, 26],\n  [211, 234, 25],\n  [209, 233, 24],\n  [206, 232, 24],\n  [203, 231, 23],\n  [200, 230, 22],\n  [197, 229, 22],\n  [194, 228, 21],\n  [191, 227, 21],\n  [188, 226, 21],\n  [185, 225, 20],\n  [182, 224, 20],\n  [179, 223, 20],\n  [176, 221, 19],\n  [173, 220, 19],\n  [170, 219, 19],\n  [167, 218, 18],\n  [164, 217, 18],\n  [161, 216, 17],\n  [158, 215, 17],\n  [154, 214, 17],\n  [151, 213, 16],\n  [148, 211, 16],\n  [145, 210, 16],\n  [142, 209, 15],\n  [139, 208, 15],\n  [136, 207, 15],\n  [132, 206, 14],\n  [129, 205, 14],\n  [126, 204, 14],\n  [122, 202, 13],\n  [119, 201, 13],\n  [116, 200, 13],\n  [112, 199, 13],\n  [109, 198, 12],\n  [105, 197, 12],\n  [102, 196, 12],\n  [98, 194, 12],\n  [94, 193, 12],\n  [91, 192, 12],\n  [87, 191, 12],\n  [83, 190, 13],\n  [79, 188, 14],\n  [76, 187, 15],\n  [72, 186, 16],\n  [68, 185, 18],\n  [65, 183, 20],\n  [62, 182, 22],\n  [59, 181, 25],\n  [56, 179, 27],\n  [54, 178, 30],\n  [52, 176, 34],\n  [51, 175, 37],\n  [50, 173, 40],\n  [50, 172, 44],\n  [50, 170, 48],\n  [51, 168, 51],\n  [52, 167, 55],\n  [53, 165, 59],\n  [54, 163, 63],\n  [56, 161, 67],\n  [57, 160, 71],\n  [59, 158, 74],\n  [60, 156, 78],\n  [62, 154, 82],\n  [63, 152, 86],\n  [64, 150, 90],\n  [66, 148, 93],\n  [67, 147, 97],\n  [67, 145, 101],\n  [68, 143, 104],\n  [69, 141, 108],\n  [69, 139, 111],\n  [69, 137, 115],\n  [70, 135, 118],\n  [70, 133, 122],\n  [69, 131, 125],\n  [69, 129, 129],\n  [69, 128, 132],\n  [68, 126, 135],\n  [67, 124, 139],\n  [67, 122, 142],\n  [66, 120, 145],\n  [64, 118, 149],\n  [63, 116, 152],\n  [62, 114, 155],\n  [60, 112, 158],\n  [59, 110, 162],\n  [57, 108, 165],\n  [56, 106, 168],\n  [54, 104, 171],\n  [53, 102, 174],\n  [51, 100, 177],\n  [50, 98, 180],\n  [48, 96, 183],\n  [47, 93, 185],\n  [46, 91, 188],\n  [45, 89, 191],\n  [44, 86, 193],\n  [43, 84, 196],\n  [42, 81, 199],\n  [41, 79, 201],\n  [40, 76, 204],\n  [40, 73, 206],\n  [39, 70, 209],\n  [38, 68, 211],\n  [38, 65, 213],\n  [37, 62, 216],\n  [37, 59, 218],\n  [37, 56, 220],\n  [37, 53, 222],\n  [37, 50, 224],\n  [37, 47, 227],\n  [38, 44, 228],\n  [40, 41, 230],\n  [42, 39, 232],\n  [44, 36, 234],\n];\n\nconst turbo: RgbTuple[] = [\n  [48, 18, 59],\n  [50, 21, 67],\n  [51, 24, 74],\n  [52, 27, 81],\n  [53, 30, 88],\n  [54, 33, 95],\n  [55, 36, 102],\n  [56, 39, 109],\n  [57, 42, 115],\n  [58, 45, 121],\n  [59, 47, 128],\n  [60, 50, 134],\n  [61, 53, 139],\n  [62, 56, 145],\n  [63, 59, 151],\n  [63, 62, 156],\n  [64, 64, 162],\n  [65, 67, 167],\n  [65, 70, 172],\n  [66, 73, 177],\n  [66, 75, 181],\n  [67, 78, 186],\n  [68, 81, 191],\n  [68, 84, 195],\n  [68, 86, 199],\n  [69, 89, 203],\n  [69, 92, 207],\n  [69, 94, 211],\n  [70, 97, 214],\n  [70, 100, 218],\n  [70, 102, 221],\n  [70, 105, 224],\n  [70, 107, 227],\n  [71, 110, 230],\n  [71, 113, 233],\n  [71, 115, 235],\n  [71, 118, 238],\n  [71, 120, 240],\n  [71, 123, 242],\n  [70, 125, 244],\n  [70, 128, 246],\n  [70, 130, 248],\n  [70, 133, 250],\n  [70, 135, 251],\n  [69, 138, 252],\n  [69, 140, 253],\n  [68, 143, 254],\n  [67, 145, 254],\n  [66, 148, 255],\n  [65, 150, 255],\n  [64, 153, 255],\n  [62, 155, 254],\n  [61, 158, 254],\n  [59, 160, 253],\n  [58, 163, 252],\n  [56, 165, 251],\n  [55, 168, 250],\n  [53, 171, 248],\n  [51, 173, 247],\n  [49, 175, 245],\n  [47, 178, 244],\n  [46, 180, 242],\n  [44, 183, 240],\n  [42, 185, 238],\n  [40, 188, 235],\n  [39, 190, 233],\n  [37, 192, 231],\n  [35, 195, 228],\n  [34, 197, 226],\n  [32, 199, 223],\n  [31, 201, 221],\n  [30, 203, 218],\n  [28, 205, 216],\n  [27, 208, 213],\n  [26, 210, 210],\n  [26, 212, 208],\n  [25, 213, 205],\n  [24, 215, 202],\n  [24, 217, 200],\n  [24, 219, 197],\n  [24, 221, 194],\n  [24, 222, 192],\n  [24, 224, 189],\n  [25, 226, 187],\n  [25, 227, 185],\n  [26, 228, 182],\n  [28, 230, 180],\n  [29, 231, 178],\n  [31, 233, 175],\n  [32, 234, 172],\n  [34, 235, 170],\n  [37, 236, 167],\n  [39, 238, 164],\n  [42, 239, 161],\n  [44, 240, 158],\n  [47, 241, 155],\n  [50, 242, 152],\n  [53, 243, 148],\n  [56, 244, 145],\n  [60, 245, 142],\n  [63, 246, 138],\n  [67, 247, 135],\n  [70, 248, 132],\n  [74, 248, 128],\n  [78, 249, 125],\n  [82, 250, 122],\n  [85, 250, 118],\n  [89, 251, 115],\n  [93, 252, 111],\n  [97, 252, 108],\n  [101, 253, 105],\n  [105, 253, 102],\n  [109, 254, 98],\n  [113, 254, 95],\n  [117, 254, 92],\n  [121, 254, 89],\n  [125, 255, 86],\n  [128, 255, 83],\n  [132, 255, 81],\n  [136, 255, 78],\n  [139, 255, 75],\n  [143, 255, 73],\n  [146, 255, 71],\n  [150, 254, 68],\n  [153, 254, 66],\n  [156, 254, 64],\n  [159, 253, 63],\n  [161, 253, 61],\n  [164, 252, 60],\n  [167, 252, 58],\n  [169, 251, 57],\n  [172, 251, 56],\n  [175, 250, 55],\n  [177, 249, 54],\n  [180, 248, 54],\n  [183, 247, 53],\n  [185, 246, 53],\n  [188, 245, 52],\n  [190, 244, 52],\n  [193, 243, 52],\n  [195, 241, 52],\n  [198, 240, 52],\n  [200, 239, 52],\n  [203, 237, 52],\n  [205, 236, 52],\n  [208, 234, 52],\n  [210, 233, 53],\n  [212, 231, 53],\n  [215, 229, 53],\n  [217, 228, 54],\n  [219, 226, 54],\n  [221, 224, 55],\n  [223, 223, 55],\n  [225, 221, 55],\n  [227, 219, 56],\n  [229, 217, 56],\n  [231, 215, 57],\n  [233, 213, 57],\n  [235, 211, 57],\n  [236, 209, 58],\n  [238, 207, 58],\n  [239, 205, 58],\n  [241, 203, 58],\n  [242, 201, 58],\n  [244, 199, 58],\n  [245, 197, 58],\n  [246, 195, 58],\n  [247, 193, 58],\n  [248, 190, 57],\n  [249, 188, 57],\n  [250, 186, 57],\n  [251, 184, 56],\n  [251, 182, 55],\n  [252, 179, 54],\n  [252, 177, 54],\n  [253, 174, 53],\n  [253, 172, 52],\n  [254, 169, 51],\n  [254, 167, 50],\n  [254, 164, 49],\n  [254, 161, 48],\n  [254, 158, 47],\n  [254, 155, 45],\n  [254, 153, 44],\n  [254, 150, 43],\n  [254, 147, 42],\n  [254, 144, 41],\n  [253, 141, 39],\n  [253, 138, 38],\n  [252, 135, 37],\n  [252, 132, 35],\n  [251, 129, 34],\n  [251, 126, 33],\n  [250, 123, 31],\n  [249, 120, 30],\n  [249, 117, 29],\n  [248, 114, 28],\n  [247, 111, 26],\n  [246, 108, 25],\n  [245, 105, 24],\n  [244, 102, 23],\n  [243, 99, 21],\n  [242, 96, 20],\n  [241, 93, 19],\n  [240, 91, 18],\n  [239, 88, 17],\n  [237, 85, 16],\n  [236, 83, 15],\n  [235, 80, 14],\n  [234, 78, 13],\n  [232, 75, 12],\n  [231, 73, 12],\n  [229, 71, 11],\n  [228, 69, 10],\n  [226, 67, 10],\n  [225, 65, 9],\n  [223, 63, 8],\n  [221, 61, 8],\n  [220, 59, 7],\n  [218, 57, 7],\n  [216, 55, 6],\n  [214, 53, 6],\n  [212, 51, 5],\n  [210, 49, 5],\n  [208, 47, 5],\n  [206, 45, 4],\n  [204, 43, 4],\n  [202, 42, 4],\n  [200, 40, 3],\n  [197, 38, 3],\n  [195, 37, 3],\n  [193, 35, 2],\n  [190, 33, 2],\n  [188, 32, 2],\n  [185, 30, 2],\n  [183, 29, 2],\n  [180, 27, 1],\n  [178, 26, 1],\n  [175, 24, 1],\n  [172, 23, 1],\n  [169, 22, 1],\n  [167, 20, 1],\n  [164, 19, 1],\n  [161, 18, 1],\n  [158, 16, 1],\n  [155, 15, 1],\n  [152, 14, 1],\n  [149, 13, 1],\n  [146, 11, 1],\n  [142, 10, 1],\n  [139, 9, 2],\n  [136, 8, 2],\n  [133, 7, 2],\n  [129, 6, 2],\n  [126, 5, 2],\n  [122, 4, 3],\n];\n\n/** @internal */\nexport const palettes = {\n  CET2s,\n  turbo,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const pieMock = [\n  { sitc1: '7', exportVal: 3110253391368 },\n  { sitc1: '3', exportVal: 1929578418424 },\n  { sitc1: '5', exportVal: 848173542536 },\n  { sitc1: '8', exportVal: 816837797016 },\n  { sitc1: '6', exportVal: 745168037744 },\n  { sitc1: '9', exportVal: 450507812880 },\n  { sitc1: '2', exportVal: 393895581328 },\n  { sitc1: '0', exportVal: 353335453296 },\n  { sitc1: '1', exportVal: 54461075800 },\n  { sitc1: '4', exportVal: 36006897720 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const sunburstMock = [\n  { sitc1: '7', dest: 'usa', exportVal: 553359100104 },\n  { sitc1: '7', dest: 'chn', exportVal: 392617281424 },\n  { sitc1: '3', dest: 'usa', exportVal: 324856796136 },\n  { sitc1: '7', dest: 'deu', exportVal: 253250650864 },\n  { sitc1: '8', dest: 'usa', exportVal: 226628559432 },\n  { sitc1: '7', dest: 'hkg', exportVal: 177490158520 },\n  { sitc1: '3', dest: 'jpn', exportVal: 177421375512 },\n  { sitc1: '2', dest: 'chn', exportVal: 173840557624 },\n  { sitc1: '3', dest: 'chn', exportVal: 167989572088 },\n  { sitc1: '7', dest: 'fra', exportVal: 135443006088 },\n  { sitc1: '6', dest: 'usa', exportVal: 129879187528 },\n  { sitc1: '5', dest: 'usa', exportVal: 127516647672 },\n  { sitc1: '7', dest: 'can', exportVal: 118114362152 },\n  { sitc1: '7', dest: 'gbr', exportVal: 117139481536 },\n  { sitc1: '3', dest: 'kor', exportVal: 108348223232 },\n  { sitc1: '7', dest: 'jpn', exportVal: 106979336520 },\n  { sitc1: '7', dest: 'mex', exportVal: 99444329328 },\n  { sitc1: '3', dest: 'ind', exportVal: 96948083624 },\n  { sitc1: '7', dest: 'sgp', exportVal: 92225795024 },\n  { sitc1: '5', dest: 'deu', exportVal: 90784113552 },\n  { sitc1: '5', dest: 'chn', exportVal: 90181681968 },\n  { sitc1: '3', dest: 'deu', exportVal: 88253653112 },\n  { sitc1: '7', dest: 'ita', exportVal: 81276009824 },\n  { sitc1: '6', dest: 'chn', exportVal: 79452389712 },\n  { sitc1: '7', dest: 'kor', exportVal: 78794233936 },\n  { sitc1: '3', dest: 'ita', exportVal: 78558945920 },\n  { sitc1: '3', dest: 'fra', exportVal: 74925032472 },\n  { sitc1: '9', dest: 'deu', exportVal: 73071171872 },\n  { sitc1: '5', dest: 'bel', exportVal: 70624508592 },\n  { sitc1: '8', dest: 'deu', exportVal: 70580844576 },\n  { sitc1: '7', dest: 'nld', exportVal: 68849046720 },\n  { sitc1: '6', dest: 'deu', exportVal: 67652211616 },\n  { sitc1: '3', dest: 'sgp', exportVal: 67210539248 },\n  { sitc1: '8', dest: 'chn', exportVal: 63708999648 },\n  { sitc1: '3', dest: 'nld', exportVal: 63266504120 },\n  { sitc1: '9', dest: 'usa', exportVal: 60516229752 },\n  { sitc1: '8', dest: 'jpn', exportVal: 56814537520 },\n  { sitc1: '3', dest: 'gbr', exportVal: 54869262576 },\n  { sitc1: '8', dest: 'hkg', exportVal: 53605517320 },\n  { sitc1: '5', dest: 'fra', exportVal: 52161793136 },\n  { sitc1: '7', dest: 'esp', exportVal: 50643986720 },\n  { sitc1: '7', dest: 'bel', exportVal: 49990475528 },\n  { sitc1: '7', dest: 'mys', exportVal: 49686542376 },\n  { sitc1: '9', dest: 'gbr', exportVal: 49592572344 },\n  { sitc1: '3', dest: 'esp', exportVal: 49335325064 },\n  { sitc1: '0', dest: 'usa', exportVal: 48357009888 },\n  { sitc1: '7', dest: 'rus', exportVal: 48165543208 },\n  { sitc1: '8', dest: 'gbr', exportVal: 47653225184 },\n  { sitc1: '3', dest: 'bel', exportVal: 47114307208 },\n  { sitc1: '8', dest: 'fra', exportVal: 45557265608 },\n  { sitc1: '9', dest: 'ind', exportVal: 41487417688 },\n  { sitc1: '5', dest: 'gbr', exportVal: 41404042128 },\n  { sitc1: '2', dest: 'jpn', exportVal: 41093852032 },\n  { sitc1: '7', dest: 'aus', exportVal: 40800311744 },\n  { sitc1: '7', dest: 'bra', exportVal: 38963332352 },\n  { sitc1: '5', dest: 'ita', exportVal: 38938981872 },\n  { sitc1: '7', dest: 'tha', exportVal: 37165468320 },\n  { sitc1: '5', dest: 'jpn', exportVal: 35950015760 },\n  { sitc1: '0', dest: 'jpn', exportVal: 34492545824 },\n  { sitc1: '3', dest: 'can', exportVal: 34474612000 },\n  { sitc1: '0', dest: 'deu', exportVal: 33477297584 },\n  { sitc1: '6', dest: 'kor', exportVal: 33305898944 },\n  { sitc1: '6', dest: 'jpn', exportVal: 32438828976 },\n  { sitc1: '6', dest: 'fra', exportVal: 31882703000 },\n  { sitc1: '6', dest: 'ind', exportVal: 31268977728 },\n  { sitc1: '6', dest: 'hkg', exportVal: 29394455800 },\n  { sitc1: '7', dest: 'pol', exportVal: 29081774000 },\n  { sitc1: '5', dest: 'can', exportVal: 28752002440 },\n  { sitc1: '7', dest: 'cze', exportVal: 28475442896 },\n  { sitc1: '8', dest: 'can', exportVal: 28272413784 },\n  { sitc1: '7', dest: 'are', exportVal: 27885234800 },\n  { sitc1: '7', dest: 'ind', exportVal: 27758142816 },\n  { sitc1: '6', dest: 'gbr', exportVal: 27633859680 },\n  { sitc1: '3', dest: 'tha', exportVal: 27233135240 },\n  { sitc1: '6', dest: 'can', exportVal: 26907257624 },\n  { sitc1: '7', dest: 'tur', exportVal: 25382715776 },\n  { sitc1: '5', dest: 'nld', exportVal: 25069805448 },\n  { sitc1: '7', dest: 'sau', exportVal: 24929023368 },\n  { sitc1: '6', dest: 'ita', exportVal: 24467435912 },\n  { sitc1: '6', dest: 'bel', exportVal: 24164232160 },\n  { sitc1: '5', dest: 'che', exportVal: 23923665600 },\n  { sitc1: '3', dest: 'bra', exportVal: 23917919768 },\n  { sitc1: '3', dest: 'idn', exportVal: 23793941504 },\n  { sitc1: '2', dest: 'deu', exportVal: 23489678712 },\n  { sitc1: '8', dest: 'ita', exportVal: 23095374432 },\n  { sitc1: '9', dest: 'nld', exportVal: 22850286888 },\n  { sitc1: '7', dest: 'aut', exportVal: 22375876440 },\n  { sitc1: '3', dest: 'tur', exportVal: 22364831560 },\n  { sitc1: '7', dest: 'swe', exportVal: 22362348184 },\n  { sitc1: '7', dest: 'idn', exportVal: 22360516904 },\n  { sitc1: '7', dest: 'che', exportVal: 22029172056 },\n  { sitc1: '5', dest: 'esp', exportVal: 21845165664 },\n  { sitc1: '9', dest: 'chn', exportVal: 21310345576 },\n  { sitc1: '5', dest: 'kor', exportVal: 21172341776 },\n  { sitc1: '0', dest: 'gbr', exportVal: 21018713424 },\n  { sitc1: '8', dest: 'nld', exportVal: 20929434208 },\n  { sitc1: '6', dest: 'mex', exportVal: 20914470128 },\n  { sitc1: '3', dest: 'aus', exportVal: 20317805888 },\n  { sitc1: '2', dest: 'kor', exportVal: 20313758104 },\n  { sitc1: '3', dest: 'mex', exportVal: 20083955848 },\n  { sitc1: '0', dest: 'fra', exportVal: 19532719264 },\n  { sitc1: '7', dest: 'hun', exportVal: 19324152296 },\n  { sitc1: '8', dest: 'che', exportVal: 19322818728 },\n  { sitc1: '5', dest: 'mex', exportVal: 19022488904 },\n  { sitc1: '2', dest: 'usa', exportVal: 18018752920 },\n  { sitc1: '3', dest: 'ukr', exportVal: 17117857400 },\n  { sitc1: '3', dest: 'swe', exportVal: 17081304488 },\n  { sitc1: '8', dest: 'esp', exportVal: 16965769448 },\n  { sitc1: '9', dest: 'che', exportVal: 16908619328 },\n  { sitc1: '6', dest: 'are', exportVal: 16785511464 },\n  { sitc1: '8', dest: 'bel', exportVal: 16569534928 },\n  { sitc1: '8', dest: 'kor', exportVal: 16210034464 },\n  { sitc1: '8', dest: 'mex', exportVal: 16191125592 },\n  { sitc1: '3', dest: 'pol', exportVal: 15907941008 },\n  { sitc1: '0', dest: 'ita', exportVal: 15654747448 },\n  { sitc1: '0', dest: 'nld', exportVal: 15586950392 },\n  { sitc1: '9', dest: 'are', exportVal: 15404570344 },\n  { sitc1: '7', dest: 'phl', exportVal: 15383624208 },\n  { sitc1: '6', dest: 'tha', exportVal: 15148414408 },\n  { sitc1: '5', dest: 'ind', exportVal: 14162411288 },\n  { sitc1: '5', dest: 'bra', exportVal: 14050466400 },\n  { sitc1: '1', dest: 'usa', exportVal: 13823693464 },\n  { sitc1: '9', dest: 'can', exportVal: 13644993280 },\n  { sitc1: '5', dest: 'rus', exportVal: 13476578168 },\n  { sitc1: '3', dest: 'mys', exportVal: 13228401584 },\n  { sitc1: '6', dest: 'nld', exportVal: 13094123616 },\n  { sitc1: '0', dest: 'can', exportVal: 13013471312 },\n  { sitc1: '3', dest: 'hkg', exportVal: 12879879616 },\n  { sitc1: '3', dest: 'zaf', exportVal: 12803323896 },\n  { sitc1: '0', dest: 'chn', exportVal: 12775895680 },\n  { sitc1: '7', dest: 'arg', exportVal: 12686127312 },\n  { sitc1: '9', dest: 'tur', exportVal: 12520989584 },\n  { sitc1: '3', dest: 'che', exportVal: 12243582232 },\n  { sitc1: '3', dest: 'grc', exportVal: 11976563768 },\n  { sitc1: '7', dest: 'lbr', exportVal: 11587009744 },\n  { sitc1: '0', dest: 'bel', exportVal: 11092939192 },\n  { sitc1: '7', dest: 'svk', exportVal: 11063197832 },\n  { sitc1: '3', dest: 'blr', exportVal: 10893808304 },\n  { sitc1: '7', dest: 'nor', exportVal: 10739879720 },\n  { sitc1: '0', dest: 'rus', exportVal: 10581033656 },\n  { sitc1: '3', dest: 'aut', exportVal: 10463844120 },\n  { sitc1: '6', dest: 'che', exportVal: 10426999544 },\n  { sitc1: '9', dest: 'sgp', exportVal: 10338784808 },\n  { sitc1: '8', dest: 'aus', exportVal: 10297853920 },\n  { sitc1: '3', dest: 'fin', exportVal: 10297129144 },\n  { sitc1: '8', dest: 'rus', exportVal: 10219614352 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport seedrandom from 'seedrandom';\n\nimport { DataGenerator, RandomNumberGenerator } from '../utils/data_generators/data_generator';\n\n/**\n * Forces object to be partial type for mocking tests\n *\n * SHOULD NOT BE USED OUTSIDE OF TESTS!!!\n *\n * @param obj partial object type\n * @internal\n */\nexport const forcedType = <T extends Record<string, unknown>>(obj: Partial<T>): T => obj as T;\n\n/**\n * Returns rng seed from `process.env`\n * @internal\n */\nexport const getRNGSeed = (fallback?: string): string | undefined =>\n  process.env.RNG_SEED ?? (process.env.VRT === 'true' ? 'elastic-charts' : fallback);\n\n/**\n * Returns rng function with optional `min`, `max` and `fractionDigits` params\n *\n * @param string seed for deterministic algorithm\n * @internal\n */\nexport const getRandomNumberGenerator = (seed = getRNGSeed()): RandomNumberGenerator => {\n  const rng = seedrandom(seed);\n\n  /**\n   * Random number generator\n   *\n   * @param  {} min=0\n   * @param  {} max=1\n   * @param  {} fractionDigits=0\n   */\n  return function randomNumberGenerator(min = 0, max = 1, fractionDigits = 0, inclusive = true) {\n    const precision = Math.pow(10, Math.max(fractionDigits, 0));\n    const scaledMax = max * precision;\n    const scaledMin = min * precision;\n    const offset = inclusive ? 1 : 0;\n    const num = Math.floor(rng() * (scaledMax - scaledMin + offset)) + scaledMin;\n\n    return num / precision;\n  };\n};\n\n/** @internal */\nexport class SeededDataGenerator extends DataGenerator {\n  constructor(frequency = 500, seed?: string) {\n    super(frequency, getRandomNumberGenerator(seed));\n  }\n}\n\n/**\n * Returns random array or object value\n * @internal\n */\nexport const getRandomEntryFn = (seed = getRNGSeed()) => {\n  const rng = seedrandom(seed);\n\n  return function getRandomEntryClosure<T>(entries: T[] | Record<string, T>) {\n    if (Array.isArray(entries)) {\n      const index = Math.floor(rng() * entries.length);\n\n      return entries[index];\n    }\n\n    const keys = Object.keys(entries);\n    const index = Math.floor(rng() * keys.length);\n    const key = keys[index]!;\n\n    return entries[key];\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../common/colors';\nimport { Rect } from '../../geoms/types';\nimport { ClippedRanges } from '../../utils/geometry';\n\n/** @internal */\nexport type CanvasRenderer<R = void> = (ctx: CanvasRenderingContext2D) => R;\n\n/**\n * withContext abstracts out the otherwise error-prone save/restore pairing; it can be nested and/or put into sequence\n * The idea is that you just set what's needed for the enclosed snippet, which may temporarily override values in the\n * outer withContext. Example: we use a +y = top convention, so when doing text rendering, y has to be flipped (ctx.scale)\n * otherwise the text will render upside down.\n * @param ctx\n * @param fun\n * @internal\n */\nexport function withContext<R = void>(ctx: CanvasRenderingContext2D, fun: CanvasRenderer<R>): R {\n  ctx.save();\n  const r = fun(ctx);\n  ctx.restore();\n  return r;\n}\n\n/** @internal */\nexport function clearCanvas(ctx: CanvasRenderingContext2D, bgColor: Color) {\n  withContext(ctx, () => {\n    ctx.setTransform(1, 0, 0, 1, 0, 0);\n    // with transparent background, clearRect is required\n    ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n    ctx.fillStyle = bgColor;\n    // filling with the background color is required to have a precise text color contrast calculation\n    ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n  });\n}\n\n// order of rendering is important; determined by the order of layers in the array\n/** @internal */\nexport function renderLayers(ctx: CanvasRenderingContext2D, layers: Array<CanvasRenderer>) {\n  layers.forEach((renderLayer) => renderLayer(ctx));\n}\n\n/** @internal */\nexport function withClip(ctx: CanvasRenderingContext2D, clippings: Rect, fun: CanvasRenderer, shouldClip = true) {\n  withContext(ctx, () => {\n    if (shouldClip) {\n      const { x, y, width, height } = clippings;\n      ctx.beginPath();\n      ctx.rect(x, y, width, height);\n      ctx.clip();\n    }\n    withContext(ctx, () => fun(ctx));\n  });\n}\n\n/**\n * Create clip from a set of clipped ranges\n * @internal\n */\nexport function withClipRanges(\n  ctx: CanvasRenderingContext2D,\n  clippedRanges: ClippedRanges,\n  { width, height, y }: Rect,\n  negate: boolean,\n  fun: CanvasRenderer,\n) {\n  withContext(ctx, () => {\n    if (clippedRanges.length > 0) {\n      ctx.beginPath();\n      if (negate) {\n        clippedRanges.forEach(([x0, x1]) => ctx.rect(x0, y, x1 - x0, height));\n      } else {\n        const firstX = clippedRanges[0]?.[0] ?? NaN;\n        const lastX = clippedRanges.at(-1)?.[1] ?? NaN;\n        ctx.rect(0, -0.5, firstX, height);\n        ctx.rect(lastX, y, width - lastX, height);\n        clippedRanges.forEach(([, x0], i) => {\n          if (i < clippedRanges.length - 1) {\n            ctx.rect(x0, y, (clippedRanges[i + 1]?.[0] ?? NaN) - x0, height);\n          }\n        });\n      }\n      ctx.clip();\n    }\n    fun(ctx);\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/**\n * The scale type\n * @public\n */\nexport const ScaleType = Object.freeze({\n  /**\n   * Treated as linear scale with ticks in base 2\n   */\n  LinearBinary: 'linear_binary' as const,\n  Linear: 'linear' as const,\n  Ordinal: 'ordinal' as const,\n  Log: 'log' as const,\n  Sqrt: 'sqrt' as const,\n  Time: 'time' as const,\n  Quantize: 'quantize' as const,\n  Quantile: 'quantile' as const,\n  Threshold: 'threshold' as const,\n});\n\n/**\n * The scale type\n * @public\n */\nexport type ScaleType = $Values<typeof ScaleType>;\n\n/** @internal */\nexport const LOG_MIN_ABS_DOMAIN = 1;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleType } from './constants';\n\n/** @public */\nexport type ScaleContinuousType =\n  | typeof ScaleType.LinearBinary\n  | typeof ScaleType.Linear\n  | typeof ScaleType.Time\n  | typeof ScaleType.Log\n  | typeof ScaleType.Sqrt;\n\n/** @public */\nexport type ScaleOrdinalType = typeof ScaleType.Ordinal;\n\n/** @public */\nexport type ScaleBandType = ScaleOrdinalType;\n\n/** @internal */\nexport { ScaleBand } from './scale_band';\n\n/** @internal */\nexport { ScaleContinuous } from './scale_continuous';\n\nexport { LogScaleOptions } from './types';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { scaleBand, scaleQuantize } from 'd3-scale';\n\nimport { ScaleBandType } from '.';\nimport { ScaleType } from './constants';\nimport { Ratio } from '../common/geometry';\nimport { RelativeBandsPadding } from '../specs';\nimport { clamp } from '../utils/common';\nimport { Range } from '../utils/domain';\n\n/**\n * Categorical scale\n * @internal\n */\nexport class ScaleBand {\n  readonly bandwidth: number;\n  readonly bandwidthPadding: number;\n  readonly step: number;\n  readonly outerPadding: number;\n  readonly innerPadding: number;\n  readonly originalBandwidth: number;\n  readonly type: ScaleBandType;\n  readonly domain: (string | number)[];\n  readonly range: [number, number];\n  readonly barsPadding: number;\n  readonly minInterval: number;\n  readonly unit?: string;\n\n  private readonly project: (d: string | number) => number;\n  private readonly inverseProject: (d: number) => string | number | undefined;\n\n  constructor(\n    inputDomain: (string | number)[],\n    range: Range,\n    overrideBandwidth?: number,\n    /**\n     * The proportion of the range that is reserved for blank space between bands\n     * A number between 0 and 1.\n     * @defaultValue 0\n     */\n    barsPadding: Ratio | RelativeBandsPadding = 0,\n  ) {\n    const isObjectPad = typeof barsPadding === 'object';\n    const safeBarPadding = isObjectPad ? 0 : clamp(barsPadding, 0, 1);\n    this.type = ScaleType.Ordinal;\n    const d3Scale = scaleBand<string | number>()\n      .domain(inputDomain.length > 0 ? inputDomain : [undefined as unknown as string | number]) // TODO fix this trick\n      .range(range)\n      .paddingInner(isObjectPad ? barsPadding.inner : safeBarPadding)\n      .paddingOuter(isObjectPad ? barsPadding.outer : safeBarPadding / 2);\n    this.barsPadding = isObjectPad ? barsPadding.inner : safeBarPadding;\n    this.outerPadding = d3Scale.paddingOuter();\n    this.innerPadding = d3Scale.paddingInner();\n    this.bandwidth = overrideBandwidth ? overrideBandwidth * (1 - safeBarPadding) : d3Scale.bandwidth() || 0;\n    this.originalBandwidth = d3Scale.bandwidth() || 0;\n    this.step = d3Scale.step();\n    this.domain = (inputDomain.length > 0 ? [...new Set(inputDomain)] : [undefined]) as (string | number)[];\n    this.range = [range[0], range[1]];\n    this.bandwidthPadding = this.bandwidth;\n    const invertedScale = scaleQuantize<string | number, undefined>()\n      .domain(range)\n      .range(inputDomain.length > 0 ? [...new Set(inputDomain)] : [undefined as unknown as string | number]);\n\n    this.minInterval = 0; // FIXED doesn't exist in reality\n    this.project = (d) => d3Scale(d) ?? NaN;\n    this.inverseProject = (d) => invertedScale(d);\n  }\n\n  scale(value: string | number): number {\n    return this.project(value);\n  }\n\n  // TODO this can be removed, it is there just to simplify the code with the continuous scale\n  pureScale(value: string | number) {\n    return this.scale(value);\n  }\n\n  ticks(): (string | number)[] {\n    return this.domain;\n  }\n\n  invert(value: number): string | number | undefined {\n    return this.inverseProject(value);\n  }\n\n  invertWithStep(value: number): {\n    withinBandwidth: boolean;\n    value: string | number | undefined;\n  } {\n    return {\n      withinBandwidth: true,\n      value: this.inverseProject(value),\n    };\n  }\n\n  isSingleValue() {\n    return this.domain.length < 2;\n  }\n\n  isValueInDomain(value: string | number) {\n    return this.domain.includes(value);\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { bisectLeft } from 'd3-array';\nimport {\n  ScaleContinuousNumeric,\n  ScaleLinear,\n  scaleLinear,\n  scaleLog,\n  ScaleLogarithmic,\n  ScalePower,\n  scaleSqrt,\n  scaleUtc,\n  ScaleTime,\n} from 'd3-scale';\nimport { Required } from 'utility-types';\n\nimport { ScaleContinuousType } from '.';\nimport { LOG_MIN_ABS_DOMAIN, ScaleType } from './constants';\nimport { LogScaleOptions } from './types';\nimport { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { getLinearTicks, getNiceLinearTicks } from '../chart_types/xy_chart/utils/get_linear_ticks';\nimport { screenspaceMarkerScaleCompressor } from '../solvers/screenspace_marker_scale_compressor';\nimport { clamp, isDefined, isFiniteNumber, mergePartial, round } from '../utils/common';\nimport { getMomentWithTz } from '../utils/data/date_time';\nimport { ContinuousDomain, Range } from '../utils/domain';\n\ntype ContinuousScaleType =\n  | typeof ScaleType.Time\n  | typeof ScaleType.Linear\n  | typeof ScaleType.Log\n  | typeof ScaleType.Sqrt;\n\nconst SCALES: Record<\n  ContinuousScaleType,\n  () => ScaleContinuousNumeric<number, number, undefined> | ScaleTime<number, number, undefined>\n> = {\n  [ScaleType.Linear]: scaleLinear,\n  [ScaleType.Log]: scaleLog,\n  [ScaleType.Sqrt]: scaleSqrt,\n  [ScaleType.Time]: scaleUtc,\n};\n\nconst defaultScaleOptions: ScaleOptions = {\n  bandwidth: 0,\n  minInterval: 0,\n  timeZone: 'local',\n  totalBarsInCluster: 1,\n  barsPadding: 0,\n  constrainDomainPadding: true,\n  domainPixelPadding: 0,\n  desiredTickCount: 10,\n  isSingleValueHistogram: false,\n  maximumFractionDigits: undefined,\n  logBase: 10,\n  logMinLimit: NaN, // NaN preserves the replaced `undefined` semantics\n  linearBase: 10,\n};\n\nconst isUnitRange = ([r1, r2]: Range) => r1 === 0 && r2 === 1;\n\n/** @internal */\nexport class ScaleContinuous {\n  readonly bandwidth: number;\n  readonly totalBarsInCluster: number;\n  readonly bandwidthPadding: number;\n  readonly minInterval: number;\n  readonly step: number;\n  readonly type: ScaleContinuousType;\n  readonly domain: [number, number];\n  readonly range: Range;\n  readonly isInverted: boolean;\n  readonly linearBase: number;\n  readonly tickValues: number[];\n  readonly timeZone: string;\n  readonly barsPadding: number;\n  readonly isSingleValueHistogram: boolean;\n  readonly unit?: string;\n  private readonly project: (d: number) => number;\n  private readonly inverseProject: (d: number) => number | Date;\n\n  constructor(\n    { type: scaleType = ScaleType.Linear, domain: inputDomain, range, nice = false }: ScaleData,\n    options?: Partial<ScaleOptions>,\n  ) {\n    const isBinary = scaleType === ScaleType.LinearBinary;\n    const type = isBinary ? ScaleType.Linear : scaleType;\n    const scaleOptions: ScaleOptions = mergePartial(defaultScaleOptions, options);\n\n    const min = inputDomain.reduce((p, n) => Math.min(p, n), Infinity);\n    const max = inputDomain.reduce((p, n) => Math.max(p, n), -Infinity);\n    const properLogScale = type === ScaleType.Log && min < max;\n    const dataDomain = properLogScale ? limitLogScaleDomain([min, max], scaleOptions.logMinLimit) : inputDomain;\n    const barsPadding = clamp(scaleOptions.barsPadding, 0, 1);\n    const isNice = nice && type !== ScaleType.Time;\n    const totalRange = Math.abs(range[1] - range[0]);\n    const pixelPadFits = 0 < scaleOptions.domainPixelPadding && scaleOptions.domainPixelPadding * 2 < totalRange;\n    const isPixelPadded = pixelPadFits && type !== ScaleType.Time && !isUnitRange(range);\n    const minInterval = Math.abs(scaleOptions.minInterval);\n    const bandwidth = scaleOptions.bandwidth * (1 - barsPadding);\n    const bandwidthPadding = scaleOptions.bandwidth * barsPadding;\n\n    this.barsPadding = barsPadding;\n    this.bandwidth = bandwidth;\n    this.bandwidthPadding = bandwidthPadding;\n    this.type = type;\n    this.range = range;\n    this.linearBase = isBinary ? 2 : scaleOptions.linearBase;\n    this.minInterval = minInterval;\n    this.step = bandwidth + barsPadding + bandwidthPadding;\n    this.timeZone = scaleOptions.timeZone;\n    this.isInverted = dataDomain[0] > dataDomain[1];\n    this.totalBarsInCluster = scaleOptions.totalBarsInCluster;\n    this.isSingleValueHistogram = scaleOptions.isSingleValueHistogram;\n\n    /** End of Domain  */\n\n    const d3Scale = SCALES[type]();\n    d3Scale.domain(dataDomain);\n    d3Scale.range(range);\n    if (properLogScale) (d3Scale as ScaleLogarithmic<PrimitiveValue, number>).base(scaleOptions.logBase);\n\n    /** Start of Projection (desiredTickCount and screenspace dependent part) */\n\n    if (isNice) {\n      if (type === ScaleType.Linear) {\n        getNiceLinearTicks(\n          d3Scale as ScaleContinuousNumeric<PrimitiveValue, number>,\n          scaleOptions.desiredTickCount,\n          this.linearBase,\n        );\n      } else {\n        (d3Scale as ScaleContinuousNumeric<PrimitiveValue, number>)\n          .domain(dataDomain)\n          .nice(scaleOptions.desiredTickCount);\n      }\n    }\n\n    const niceDomain = isNice ? (d3Scale.domain() as [number, number]) : dataDomain;\n\n    const paddedDomain = isPixelPadded\n      ? getPixelPaddedDomain(\n          totalRange,\n          niceDomain,\n          scaleOptions.domainPixelPadding,\n          scaleOptions.constrainDomainPadding,\n        )\n      : niceDomain;\n\n    d3Scale.domain(paddedDomain); // only need to do this if isPixelPadded is true, but hey\n    if (isPixelPadded && isNice)\n      (d3Scale as ScaleContinuousNumeric<PrimitiveValue, number>).nice(scaleOptions.desiredTickCount);\n\n    const nicePaddedDomain = isPixelPadded && isNice ? (d3Scale.domain() as [number, number]) : paddedDomain;\n\n    this.tickValues =\n      type === ScaleType.Time\n        ? getTimeTicks(\n            nicePaddedDomain,\n            scaleOptions.desiredTickCount,\n            scaleOptions.timeZone,\n            scaleOptions.bandwidth === 0 ? 0 : scaleOptions.minInterval,\n          )\n        : (type === ScaleType.Linear\n            ? getLinearNonDenserTicks(\n                nicePaddedDomain,\n                scaleOptions.desiredTickCount,\n                this.linearBase,\n                scaleOptions.bandwidth === 0 ? 0 : scaleOptions.minInterval,\n              )\n            : (d3Scale as D3ScaleNonTime).ticks(scaleOptions.desiredTickCount)\n          ).filter(\n            scaleOptions.maximumFractionDigits === undefined\n              ? () => true\n              : (n) => round(n, scaleOptions.maximumFractionDigits) === n,\n          );\n\n    this.domain = nicePaddedDomain;\n    // Returning NaN means that the value is projectable/invertible within the domain or range\n    this.project = (d: number) => d3Scale(d) ?? NaN;\n    this.inverseProject = (d: number) => d3Scale.invert(d) ?? NaN;\n  }\n\n  scale(value?: PrimitiveValue): number {\n    return typeof value === 'number'\n      ? this.project(value) + (this.bandwidthPadding / 2) * this.totalBarsInCluster\n      : NaN;\n  }\n\n  pureScale(value?: PrimitiveValue): number {\n    return typeof value === 'number' ? this.project(this.bandwidth === 0 ? value : value + this.minInterval / 2) : NaN;\n  }\n\n  ticks(): number[] {\n    return this.tickValues;\n  }\n\n  invert(value: number): number {\n    const invertedValue = this.inverseProject(value);\n    return this.type === ScaleType.Time\n      ? getMomentWithTz(invertedValue, this.timeZone).valueOf()\n      : Number(invertedValue);\n  }\n\n  invertWithStep(\n    value: number,\n    data: number[],\n  ): {\n    withinBandwidth: boolean;\n    value: number;\n  } {\n    if (data.length === 0) {\n      return { withinBandwidth: false, value: NaN };\n    }\n    const invertedValue = this.invert(value);\n    const bisectValue = this.bandwidth === 0 ? invertedValue + this.minInterval / 2 : invertedValue;\n    const leftIndex = bisectLeft(data, bisectValue);\n\n    if (leftIndex === 0) {\n      const [dataValue = NaN] = data;\n      const withinBandwidth = invertedValue >= dataValue;\n      return {\n        withinBandwidth,\n        value:\n          dataValue +\n          (withinBandwidth ? 0 : -this.minInterval * Math.ceil((dataValue - invertedValue) / this.minInterval)),\n      };\n    }\n    const currentValue = data[leftIndex - 1] ?? NaN;\n    // pure linear scale\n    if (this.bandwidth === 0) {\n      const nextValue = data[leftIndex] ?? NaN;\n      const nextDiff = Math.abs(nextValue - invertedValue);\n      const prevDiff = Math.abs(invertedValue - currentValue);\n      return {\n        withinBandwidth: true,\n        value: nextDiff <= prevDiff ? nextValue : currentValue,\n      };\n    }\n    const withinBandwidth = invertedValue - currentValue <= this.minInterval;\n    return {\n      withinBandwidth,\n      value:\n        currentValue +\n        (withinBandwidth ? 0 : this.minInterval * Math.floor((invertedValue - currentValue) / this.minInterval)),\n    };\n  }\n\n  private isDegenerateDomain(): boolean {\n    return this.domain.every((v) => v === this.domain[0]);\n  }\n\n  isSingleValue(): boolean {\n    return this.isSingleValueHistogram || this.isDegenerateDomain();\n  }\n\n  isValueInDomain(value: unknown): boolean {\n    const [start = NaN, end = NaN] = this.domain;\n    return isFiniteNumber(value) && start <= value && value <= end;\n  }\n}\n\nfunction getTimeTicks(domain: [number, number], desiredTickCount: number, timeZone: string, minInterval: number) {\n  const [start, end] = domain;\n  const startDomain = getMomentWithTz(start, timeZone);\n  const endDomain = getMomentWithTz(end, timeZone);\n  const offset = startDomain.utcOffset();\n  const shiftedDomainMin = startDomain.add(offset, 'minutes').valueOf();\n  const shiftedDomainMax = endDomain.add(offset, 'minutes').valueOf();\n  const tzShiftedScale = scaleUtc().domain([shiftedDomainMin, shiftedDomainMax]);\n  let currentCount = desiredTickCount;\n  let rawTicks = tzShiftedScale.ticks(desiredTickCount);\n  while (\n    rawTicks.length > 2 &&\n    currentCount > 0 &&\n    isDefined(rawTicks[0]) &&\n    isDefined(rawTicks[1]) &&\n    rawTicks[1].valueOf() - rawTicks[0].valueOf() < minInterval\n  ) {\n    currentCount--;\n    rawTicks = tzShiftedScale.ticks(currentCount);\n  }\n\n  const timePerTick = (shiftedDomainMax - shiftedDomainMin) / rawTicks.length;\n  const hasHourTicks = timePerTick < 1000 * 60 * 60 * 12;\n  return rawTicks.map((d: Date) => {\n    const currentDateTime = getMomentWithTz(d, timeZone);\n    const currentOffset = hasHourTicks ? offset : currentDateTime.utcOffset();\n    return currentDateTime.subtract(currentOffset, 'minutes').valueOf();\n  });\n}\n\nfunction getLinearNonDenserTicks(\n  domain: [number, number],\n  desiredTickCount: number,\n  base: number,\n  minInterval: number,\n): number[] {\n  const [start, stop] = domain;\n  let currentCount = desiredTickCount;\n  let ticks = getLinearTicks(start, stop, desiredTickCount, base);\n  while (\n    ticks.length > 2 &&\n    currentCount > 0 &&\n    isDefined(ticks[0]) &&\n    isDefined(ticks[1]) &&\n    ticks[1] - ticks[0] < minInterval\n  ) {\n    currentCount--;\n    ticks = getLinearTicks(start, stop, currentCount, base);\n  }\n  return ticks;\n}\n\n/** @internal */\nexport function limitLogScaleDomain([min, max]: ContinuousDomain, logMinLimit: number): [min: number, max: number] {\n  // todo further simplify this\n  const absLimit = Math.abs(logMinLimit);\n  const fallback = absLimit || LOG_MIN_ABS_DOMAIN;\n  if (absLimit > 0 && min > 0 && min < absLimit) return max > absLimit ? [absLimit, max] : [absLimit, absLimit];\n  if (absLimit > 0 && max < 0 && max > -absLimit) return min < -absLimit ? [min, -absLimit] : [-absLimit, -absLimit];\n  if (min === 0) return max > 0 ? [fallback, max] : max < 0 ? [-fallback, max] : [fallback, fallback];\n  if (max === 0) return min > 0 ? [min, fallback] : min < 0 ? [min, -fallback] : [fallback, fallback];\n  if (min < 0 && max > 0) return Math.abs(max) >= Math.abs(min) ? [fallback, max] : [min, -fallback];\n  if (min > 0 && max < 0) return Math.abs(min) >= Math.abs(max) ? [min, fallback] : [-fallback, max];\n  return [min, max];\n}\n\nfunction getPixelPaddedDomain(\n  chartHeight: number,\n  domain: [number, number],\n  desiredPixelPadding: number,\n  constrainDomainPadding?: boolean,\n  intercept = 0,\n): [number, number] {\n  const inverted = domain[1] < domain[0];\n  const orderedDomain: [number, number] = inverted ? [domain[1], domain[0]] : domain;\n  const { scaleMultiplier } = screenspaceMarkerScaleCompressor(\n    orderedDomain,\n    [\n      [desiredPixelPadding, desiredPixelPadding],\n      [desiredPixelPadding, desiredPixelPadding],\n    ],\n    chartHeight,\n  );\n  const baselinePaddedDomainLo = orderedDomain[0] - desiredPixelPadding / scaleMultiplier;\n  const baselinePaddedDomainHigh = orderedDomain[1] + desiredPixelPadding / scaleMultiplier;\n  const crossBelow = constrainDomainPadding && baselinePaddedDomainLo < intercept && orderedDomain[0] >= intercept;\n  const crossAbove = constrainDomainPadding && baselinePaddedDomainHigh > 0 && orderedDomain[1] <= 0;\n  const paddedDomainLo = crossBelow\n    ? intercept\n    : crossAbove\n      ? orderedDomain[0] -\n        desiredPixelPadding /\n          screenspaceMarkerScaleCompressor(\n            [orderedDomain[0], intercept],\n            [\n              [desiredPixelPadding, desiredPixelPadding],\n              [0, 0],\n            ],\n            chartHeight,\n          ).scaleMultiplier\n      : baselinePaddedDomainLo;\n  const paddedDomainHigh = crossBelow\n    ? orderedDomain[1] +\n      desiredPixelPadding /\n        screenspaceMarkerScaleCompressor(\n          [intercept, orderedDomain[1]],\n          [\n            [0, 0],\n            [desiredPixelPadding, desiredPixelPadding],\n          ],\n          chartHeight,\n        ).scaleMultiplier\n    : crossAbove\n      ? intercept\n      : baselinePaddedDomainHigh;\n\n  return inverted ? [paddedDomainHigh, paddedDomainLo] : [paddedDomainLo, paddedDomainHigh];\n}\n\n/**\n * d3 scales excluding time scale\n */\ntype D3ScaleNonTime<R = PrimitiveValue, O = number> = ScaleLinear<R, O> | ScaleLogarithmic<R, O> | ScalePower<R, O>;\n\n/**\n * All possible d3 scales\n * @internal\n */\n\nexport interface ScaleData {\n  /** The Type of continuous scale */\n  type: ScaleContinuousType;\n  /** The data input domain */\n  domain: [number, number];\n  /** The data output range */\n  range: Range;\n  nice?: boolean;\n}\n\ntype ScaleOptions = Required<LogScaleOptions, 'logBase'> & {\n  /**\n   * The desired bandwidth for a linear band scale.\n   * @defaultValue 0\n   */\n  bandwidth: number;\n  /**\n   * The min interval computed on the XDomain. Not available for yDomains.\n   * @defaultValue 0\n   */\n  minInterval: number;\n  /**\n   * A time zone identifier. Can be any IANA zone supported by he host environment,\n   * or a fixed-offset name of the form 'utc+3', or the strings 'local' or 'utc'.\n   * @defaultValue `local`\n   */\n  timeZone: string;\n  /**\n   * The number of bars in the cluster. Used to correctly compute scales when\n   * using padding between bars.\n   * @defaultValue 1\n   */\n  totalBarsInCluster: number;\n  /**\n   * The proportion of the range that is reserved for blank space between bands\n   * A number between 0 and 1.\n   * @defaultValue 0\n   */\n  barsPadding: number;\n  /**\n   * Pixel value to extend the domain. Applied __before__ nicing.\n   *\n   * Does not apply to time scales\n   * @defaultValue 0\n   */\n  domainPixelPadding: number;\n  /**\n   * Constrains domain pixel padding to the zero baseline\n   * Does not apply to time scales\n   */\n  constrainDomainPadding?: boolean;\n  /**\n   * The approximated number of ticks.\n   * @defaultValue 10\n   */\n  desiredTickCount: number;\n  /**\n   * true if the scale was adjusted to fit one single value histogram\n   */\n  isSingleValueHistogram: boolean;\n  /**\n   * Max fractional digit to limit precision of number ticks\n   */\n  maximumFractionDigits?: number;\n  /**\n   * As log(0) = -Infinite, a log scale domain must be strictly-positive\n   * or strictly-negative; the domain must not include or cross zero value.\n   * We need to limit the domain scale to the right value on all possible cases.\n   */\n  logMinLimit: number;\n  /**\n   * scale base used to determine ticks in linear scales\n   * @defaultValue 10\n   */\n  linearBase: number;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleType } from './constants';\nimport { ScaleBand } from './scale_band';\nimport { ScaleContinuous } from './scale_continuous';\n\n/**\n * Check if a scale is logaritmic\n * @internal\n */\nexport function isLogarithmicScale(scale: ScaleContinuous) {\n  return scale.type === ScaleType.Log;\n}\n\n/**\n * Check if a scale is Band\n * @internal\n */\nexport function isBandScale(scale: ScaleContinuous | ScaleBand): scale is ScaleBand {\n  return scale.type === ScaleType.Ordinal;\n}\n\n/**\n * Check if a scale is continuous\n * @internal\n */\nexport function isContinuousScale(scale: ScaleContinuous | ScaleBand): scale is ScaleContinuous {\n  return scale.type !== ScaleType.Ordinal;\n}\n\n/**\n * Options specific to log scales\n * @public\n */\nexport interface LogScaleOptions {\n  /**\n   * Min value to render on log scale\n   *\n   * Defaults to min value of domain, or LOG_MIN_ABS_DOMAIN if mixed polarity\n   */\n  logMinLimit?: number;\n  /**\n   * Base for log scale\n   *\n   * @defaultValue 10\n   * (i.e. log base 10)\n   */\n  logBase?: number;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport function integerSnap(n: number) {\n  return Math.floor(n);\n}\n\ntype NumberMap = (n: number) => number;\n\n/**\n * `monotonicHillClimb` attempts to return a variable value that's associated with the highest valued response (as returned by invoking `getResponse`\n * with said variable) yet still within the bounds for that response value, ie. constrained to smaller than or equal `responseUpperConstraint`.\n * `minVar` and `maxVar` represent a closed interval constraint on the variable itself.\n * `domainSnap` is useful if all real values in the range can't be assumed by the variable; typically, if the variable is integer only,\n * such as the number of characters, or avoiding fractional font sizes.\n * It is required that `getResponse` is a monotonic function over [minVar, maxVar], ie. a larger `n` value in this domain can't lead to\n * a smaller return value. However, as it's an internal function with known use cases, there's no runtime check to assert this.\n * Which is why the name expresses it prominently.\n */\n/** @internal */\nexport function monotonicHillClimb(\n  getResponse: NumberMap,\n  maxVar: number,\n  responseUpperConstraint: number,\n  domainSnap: NumberMap = (n: number) => n,\n  minVar: number = 0,\n) {\n  let loVar = domainSnap(minVar);\n  const loResponse = getResponse(loVar);\n  let hiVar = domainSnap(maxVar);\n  let hiResponse = getResponse(hiVar);\n\n  if (loResponse > responseUpperConstraint || loVar > hiVar) {\n    // bail if even the lowest value doesn't satisfy the constraint\n    return NaN;\n  }\n\n  if (hiResponse <= responseUpperConstraint) {\n    return hiVar; // early bail if maxVar is compliant\n  }\n\n  let pivotVar: number = NaN;\n  let pivotResponse: number = NaN;\n  let lastPivotResponse: number = NaN;\n  while (loVar < hiVar) {\n    const newPivotVar = (loVar + hiVar) / 2;\n    const newPivotResponse = getResponse(domainSnap(newPivotVar));\n    if (newPivotResponse === pivotResponse || newPivotResponse === lastPivotResponse) {\n      return domainSnap(loVar); // bail if we're good and not making further progress\n    }\n    pivotVar = newPivotVar;\n    lastPivotResponse = pivotResponse; // for prevention of bistable oscillation around discretization snap\n    pivotResponse = newPivotResponse;\n    const pivotIsCompliant = pivotResponse <= responseUpperConstraint;\n    if (pivotIsCompliant) {\n      loVar = pivotVar;\n    } else {\n      hiVar = pivotVar;\n      hiResponse = pivotResponse;\n    }\n  }\n  return domainSnap(pivotVar);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Cartesian, Pixels, Ratio } from '../common/geometry';\n\n/** @internal */\nexport type ArrayIndex = number;\n\n/** @internal */\nexport interface ScaleCompression {\n  bounds: ArrayIndex[];\n  scaleMultiplier: Ratio;\n}\n\n/**\n * A set of Cartesian positioned items with screenspace size (eg. axis tick labels, or scatterplot points) are represented as:\n *   - a column vector of Cartesian positions in the domain (can be any unit)\n *   - a column vector of screenspace size (eg. widths in pixels) which has the same number of elements\n * The available room in the same screenspace units (practically, pixels) is supplied.\n *\n * Returns the scale multiplier, as well as the index of the elements determining (compressing) the scale, if solvable.\n * If not solvable, it returns a non-finite number in `scaleMultiplier` and no indices in `bounds`.\n * @internal\n */\nexport const screenspaceMarkerScaleCompressor = (\n  domainPositions: Cartesian[],\n  itemWidths: Array<[Pixels, Pixels]>,\n  outerWidth: Pixels,\n): ScaleCompression => {\n  const result: ScaleCompression = { bounds: [], scaleMultiplier: Infinity };\n  const itemCount = Math.min(domainPositions.length, itemWidths.length);\n  for (let left = 0; left < itemCount; left++) {\n    for (let right = 0; right < itemCount; right++) {\n      const domainLeft = domainPositions[left] ?? NaN;\n      const domainRight = domainPositions[right] ?? NaN;\n      if (domainLeft > domainRight) continue; // must adhere to left <= right\n\n      const range = outerWidth - (itemWidths[left]?.[0] ?? NaN) - (itemWidths[right]?.[1] ?? NaN); // negative if not enough room\n      const domain = domainRight - domainLeft; // always non-negative and finite\n      const scaleMultiplier = range / domain; // may not be finite, and that's OK\n\n      if (scaleMultiplier < result.scaleMultiplier || Number.isNaN(scaleMultiplier)) {\n        result.bounds[0] = left;\n        result.bounds[1] = right;\n        result.scaleMultiplier = scaleMultiplier; // will persist a Number.finite() value for solvable pairs\n      }\n    }\n  }\n\n  return result;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { SettingsSpec } from './settings';\nimport { ChartType } from '../chart_types';\nimport { BOTTOM, CENTER, LEFT, MIDDLE, RIGHT, TOP } from '../common/constants';\nimport { buildSFProps } from '../state/spec_factory';\nimport { Position } from '../utils/common';\nimport { LIGHT_THEME } from '../utils/themes/light_theme';\n\n/** @public */\nexport const SpecType = Object.freeze({\n  Series: 'series' as const,\n  Axis: 'axis' as const,\n  Annotation: 'annotation' as const,\n  Settings: 'settings' as const,\n  Tooltip: 'tooltip' as const,\n  IndexOrder: 'index_order' as const,\n  SmallMultiples: 'small_multiples' as const,\n});\n/** @public */\nexport type SpecType = $Values<typeof SpecType>;\n\n/**\n * Type of bin aggregations\n * @public\n */\nexport const BinAgg = Object.freeze({\n  /**\n   * Order by sum of values in bin\n   */\n  Sum: 'sum' as const,\n  /**\n   * Order of values are used as is\n   */\n  None: 'none' as const,\n});\n/** @public */\nexport type BinAgg = $Values<typeof BinAgg>;\n\n/**\n * Direction of sorting\n * @public\n */\nexport const Direction = Object.freeze({\n  /**\n   * Least to greatest\n   */\n  Ascending: 'ascending' as const,\n  /**\n   * Greatest to least\n   */\n  Descending: 'descending' as const,\n});\n/** @public */\nexport type Direction = $Values<typeof Direction>;\n\n/** @public */\nexport const PointerEventType = Object.freeze({\n  Over: 'Over' as const,\n  Out: 'Out' as const,\n});\n/** @public */\nexport type PointerEventType = $Values<typeof PointerEventType>;\n\n/**\n * This enums provides the available tooltip types\n * @public\n */\nexport const TooltipType = Object.freeze({\n  /** Vertical cursor parallel to x axis */\n  VerticalCursor: 'vertical' as const,\n  /** Vertical and horizontal cursors */\n  Crosshairs: 'cross' as const,\n  /** Follow the mouse coordinates */\n  Follow: 'follow' as const,\n  /** Hide every tooltip */\n  None: 'none' as const,\n});\n/**\n * The TooltipType\n * @public\n */\nexport type TooltipType = $Values<typeof TooltipType>;\n\n/** @public */\nexport const BrushAxis = Object.freeze({\n  X: 'x' as const,\n  Y: 'y' as const,\n  Both: 'both' as const,\n});\n/** @public */\nexport type BrushAxis = $Values<typeof BrushAxis>;\n\n/**\n * pointer update trigger\n * @public\n */\nexport const PointerUpdateTrigger = Object.freeze({\n  X: 'x' as const,\n  Y: 'y' as const,\n  Both: 'both' as const,\n});\n/** @public */\nexport type PointerUpdateTrigger = $Values<typeof PointerUpdateTrigger>;\n\n/**\n * The position to stick the tooltip to\n * @public\n */\nexport const TooltipStickTo = Object.freeze({\n  Top: TOP,\n  Bottom: BOTTOM,\n  Middle: MIDDLE,\n  Left: LEFT,\n  Right: RIGHT,\n  Center: CENTER,\n  MousePosition: 'MousePosition' as const,\n});\n/** @public */\nexport type TooltipStickTo = $Values<typeof TooltipStickTo>;\n\n/**\n * Default legend config\n * @internal\n */\nexport const DEFAULT_LEGEND_CONFIG = {\n  showLegend: false,\n  legendSize: NaN,\n  showLegendExtra: false,\n  legendMaxDepth: Infinity,\n  legendPosition: Position.Right,\n  flatLegend: false,\n};\n\n/** @public */\nexport const settingsBuildProps = buildSFProps<SettingsSpec>()(\n  {\n    id: '__global__settings___' as const,\n    chartType: ChartType.Global,\n    specType: SpecType.Settings,\n  },\n  {\n    rendering: 'canvas' as const,\n    rotation: 0 as const,\n    animateData: true,\n    debug: false,\n    pointerUpdateTrigger: PointerUpdateTrigger.X,\n    externalPointerEvents: {\n      tooltip: {\n        visible: false,\n      },\n    },\n    baseTheme: LIGHT_THEME,\n    brushAxis: BrushAxis.X,\n    minBrushDelta: 2,\n    ariaUseDefaultSummary: true,\n    ariaLabelHeadingLevel: 'p',\n    allowBrushingLastHistogramBin: true,\n    pointBuffer: 10,\n    ...DEFAULT_LEGEND_CONFIG,\n    locale: 'en-US',\n  },\n);\n\n/** @public */\nexport const DEFAULT_SETTINGS_SPEC: SettingsSpec = {\n  ...settingsBuildProps.defaults,\n  ...settingsBuildProps.overrides,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { BaseDatum, Spec } from '.';\nimport { SpecType } from './constants';\nimport { ChartType } from '../chart_types';\nimport { Predicate } from '../common/predicate';\nimport { buildSFProps, SFProps, useSpecFactory } from '../state/spec_factory';\nimport { Datum, stripUndefined } from '../utils/common';\n\n/** @public */\nexport type GroupByAccessor<D extends BaseDatum = any> = (spec: Spec, datum: D) => string | number;\n/** @alpha */\nexport type GroupBySort = Predicate;\n\n/**\n * Title formatter that handles any value returned from the GroupByAccessor\n * @public\n */\nexport type GroupByFormatter<D extends BaseDatum = any> = (value: ReturnType<GroupByAccessor<D>>) => string;\n\n/** @alpha */\nexport interface GroupBySpec<D extends BaseDatum = any> extends Spec {\n  /**\n   * Function to return a unique value __by__ which to group the data\n   */\n  by: GroupByAccessor<D>;\n  /**\n   * Sort predicate used to sort grouped data\n   */\n  sort: GroupBySort;\n  /**\n   * Formatter used on all `by` values.\n   *\n   * Only for displayed values, not used in sorting or other internal computations.\n   */\n  format?: GroupByFormatter<D>;\n}\n\nconst buildProps = buildSFProps<GroupBySpec>()(\n  {\n    chartType: ChartType.Global,\n    specType: SpecType.IndexOrder,\n  },\n  {},\n);\n\n/**\n * Add GroupBy spec to chart\n * @public\n */\nexport const GroupBy = function <D extends BaseDatum = Datum>(\n  props: SFProps<\n    GroupBySpec<D>,\n    keyof (typeof buildProps)['overrides'],\n    keyof (typeof buildProps)['defaults'],\n    keyof (typeof buildProps)['optionals'],\n    keyof (typeof buildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = buildProps;\n  useSpecFactory<GroupBySpec<D>>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type GroupByProps = ComponentProps<typeof GroupBy>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../chart_types';\n\n/** @public */\nexport interface Spec {\n  /** unique Spec identifier */\n  id: string;\n  /** Chart type define the type of chart that use this spec */\n  chartType: ChartType;\n  /** The type of spec, can be series, axis, annotation, settings etc */\n  specType: string;\n}\n\nexport * from './group_by';\nexport * from './small_multiples';\nexport * from './settings';\nexport * from './constants';\nexport * from './tooltip';\nexport * from '../chart_types/specs';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps, ComponentType, ReactChild } from 'react';\n\nimport { CustomXDomain, GroupByAccessor, Spec } from '.';\nimport { BinAgg, BrushAxis, Direction, PointerEventType, PointerUpdateTrigger, settingsBuildProps } from './constants';\nimport { Cell } from '../chart_types/heatmap/layout/types/viewmodel_types';\nimport { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { LegendStrategy } from '../chart_types/partition_chart/layout/utils/highlighted_geoms';\nimport { LineAnnotationDatum, RectAnnotationDatum, SeriesType } from '../chart_types/specs';\nimport { WordModel } from '../chart_types/wordcloud/layout/types/viewmodel_types';\nimport { XYChartSeriesIdentifier } from '../chart_types/xy_chart/utils/series';\nimport { CategoryLabel } from '../common/category';\nimport { Color } from '../common/colors';\nimport { SmallMultiplesDatum } from '../common/panel_utils';\nimport { SeriesIdentifier } from '../common/series_id';\nimport { TooltipPortalSettings } from '../components';\nimport { ScaleContinuousType, ScaleOrdinalType } from '../scales';\nimport { LegendPath } from '../state/actions/legend';\nimport { SFProps, useSpecFactory } from '../state/spec_factory';\nimport { PointerValue } from '../state/types';\nimport {\n  HorizontalAlignment,\n  LayoutDirection,\n  Position,\n  Rendering,\n  Rotation,\n  VerticalAlignment,\n  stripUndefined,\n} from '../utils/common';\nimport { Dimensions } from '../utils/dimensions';\nimport { GeometryValue } from '../utils/geometry';\nimport { GroupId, SpecId } from '../utils/ids';\nimport { SeriesCompareFn } from '../utils/series_sort';\nimport { PartialTheme, PointStyle, Theme } from '../utils/themes/theme';\n\n/** @public */\nexport interface LayerValue {\n  /**\n   * The category value as retrieved by the `groupByRollup` callback\n   */\n  groupByRollup: PrimitiveValue;\n  /**\n   * The small multiples `<GroupBy>` `by` accessor value, to specify which small multiples panel is interacted with\n   */\n  smAccessorValue: ReturnType<GroupByAccessor>;\n  /**\n   * Numerical value of the partition\n   */\n  value: number;\n  /**\n   * The position index of the sub-partition within its containing partition\n   */\n  sortIndex: number;\n  /**\n   * The depth of the partition in terms of the layered partition tree, where\n   * 0 is root (single, not visualized root of the partitioning tree),\n   * 1 is pie chart slices and innermost layer of sunburst, or 1st level treemap/flame/icicle breakdown\n   * 2 and above are increasingly outer layers\n   * maximum value is on the deepest leaf node\n   */\n  depth: number;\n  /**\n   * It contains the full path of the partition node, which is an array of `{index, value}` tuples\n   * where `index` corresponds to `sortIndex` and `value` corresponds `groupByRollup`\n   */\n  path: LegendPath;\n}\n\n/** @public */\nexport interface FlameLayerValue {\n  /**\n   * The zero-based index of the data point\n   */\n  vmIndex: number;\n}\n\n/** @public */\nexport interface GroupBrushExtent {\n  groupId: GroupId;\n  extent: [number, number];\n}\n\n/** @public */\nexport interface XYBrushEvent {\n  x?: [number, number];\n  y?: Array<GroupBrushExtent>;\n}\n\n/** @public */\nexport type XYChartElementEvent = [geometry: GeometryValue, seriesIdentifier: XYChartSeriesIdentifier];\n/** @public */\nexport type PartitionElementEvent = [layers: Array<LayerValue>, seriesIdentifier: SeriesIdentifier];\n/** @public */\nexport type FlameElementEvent = FlameLayerValue;\n/** @public */\nexport type HeatmapElementEvent = [cell: Cell, seriesIdentifier: SeriesIdentifier];\n/** @public */\nexport type WordCloudElementEvent = [model: WordModel, seriesIdentifier: SeriesIdentifier];\n\n/**\n * Describes a Metric element that is the subject of an interaction.\n * In particular, it reports the index of the metric within the two-dimensional data array\n * @public\n */\nexport type MetricElementEvent = {\n  type: 'metricElementEvent';\n  /* the row index of the metric in the data array: data[rowIndex][columIndex] */\n  rowIndex: number;\n  /* the column index of the metric in the data array: data[rowIndex][columIndex] */\n  columnIndex: number;\n};\n\n/**\n * A type-guard for MetricElementEvents\n * @public\n */\nexport function isMetricElementEvent(e: Parameters<ElementClickListener>[0][0]): e is MetricElementEvent {\n  return 'type' in e && e.type === 'metricElementEvent';\n}\n\n/**\n * An object that contains the scaled mouse position based on\n * the current chart configuration.\n * @public\n */\nexport type ProjectedValues = {\n  /**\n   * The independent variable of the chart\n   */\n  x: PrimitiveValue;\n  /**\n   * The set of dependent variable, each one with its own groupId\n   */\n  y: Array<{ value: PrimitiveValue; groupId: string }>;\n  /**\n   * The categorical value used for the vertical placement of the chart\n   * in a small multiple layout\n   */\n  smVerticalValue: PrimitiveValue;\n  /**\n   * The categorical value used for the horizontal placement of the chart\n   * in a small multiple layout\n   */\n  smHorizontalValue: PrimitiveValue;\n};\n\n/**\n * @public\n * The listener type for click on the projection area.\n */\nexport type ProjectionClickListener = (values: ProjectedValues) => void;\n\n/** @public */\nexport type ElementClickListener = (\n  elements: Array<\n    | XYChartElementEvent\n    | PartitionElementEvent\n    | FlameElementEvent\n    | HeatmapElementEvent\n    | WordCloudElementEvent\n    | MetricElementEvent\n  >,\n) => void;\n\n/** @public */\nexport type ElementOverListener = (\n  elements: Array<\n    | XYChartElementEvent\n    | PartitionElementEvent\n    | FlameElementEvent\n    | HeatmapElementEvent\n    | WordCloudElementEvent\n    | MetricElementEvent\n  >,\n) => void;\n\n/** @public */\nexport type BrushEvent = XYBrushEvent | HeatmapBrushEvent;\n\n/** @public */\nexport type BrushEndListener = (brushAreaEvent: BrushEvent) => void;\n\n/** @public */\nexport type ProjectionAreaChangeListener = (areas: { projection: Dimensions; parent: Dimensions }) => void;\n\n/** @public */\nexport interface HeatmapBrushEvent extends SmallMultiplesDatum {\n  cells: Cell[];\n  x: (string | number)[];\n  y: (string | number)[];\n}\n\n/** @public */\nexport type LegendItemListener = (series: SeriesIdentifier[]) => void;\n/**\n * The listener type for generic mouse move\n *\n * @public\n */\nexport type PointerUpdateListener = (event: PointerEvent) => void;\n/**\n * Listener to be called when chart resizes\n * @alpha\n */\nexport type ResizeListener = () => void;\n/**\n * Listener to be called when chart render state changes\n *\n * `isRendered` value is `true` when rendering is complete and `false` otherwise\n * @public\n */\nexport type RenderChangeListener = (isRendered: boolean) => void;\n/**\n * Listener to be called *before* chart renders\n * @public\n */\nexport type WillRenderListener = () => void;\n/** @public */\nexport type BasicListener = () => undefined | void;\n/** @public */\nexport type RectAnnotationEvent = { id: SpecId; datum: RectAnnotationDatum };\n/** @public */\nexport type LineAnnotationEvent = { id: SpecId; datum: LineAnnotationDatum<any> };\n/** @public */\nexport type AnnotationClickListener = (annotations: {\n  rects: RectAnnotationEvent[];\n  lines: LineAnnotationEvent[];\n}) => void;\n\n/** @public */\nexport interface BasePointerEvent {\n  chartId: string;\n  type: PointerEventType;\n}\n\n/**\n * Event used to synchronize pointers/mouse positions between Charts.\n *\n * fired as callback argument for `PointerUpdateListener`\n * @public\n */\nexport interface PointerOverEvent extends BasePointerEvent, ProjectedValues {\n  type: typeof PointerEventType.Over;\n  scale: ScaleContinuousType | ScaleOrdinalType;\n  /**\n   * Unit for event (i.e. `time`, `feet`, `count`, etc.) Not currently used/implemented\n   * @alpha\n   */\n  unit?: string;\n}\n\n/** @public */\nexport interface PointerOutEvent extends BasePointerEvent {\n  type: typeof PointerEventType.Out;\n}\n\n/** @public */\nexport type PointerEvent = PointerOverEvent | PointerOutEvent;\n\n/**\n * The settings for handling external events.\n * TODO consider moving this to Tooltip spec\n * @alpha\n */\nexport interface ExternalPointerEventsSettings {\n  /**\n   * Tooltip settings used for external events\n   */\n  tooltip: TooltipPortalSettings<'chart'> & {\n    /**\n     * `true` to show the tooltip when the chart receive an\n     * external pointer event, 'false' to hide the tooltip.\n     * @defaultValue `false`\n     */\n    visible?: boolean;\n  };\n}\n\n/**\n * Legend action component props\n *\n * @public\n */\nexport interface LegendActionProps {\n  /**\n   * Series identifiers for the given series\n   */\n  series: SeriesIdentifier[];\n  /**\n   * Resolved label/name of given series\n   */\n  label: string;\n  /**\n   * Resolved color of given series\n   */\n  color: string;\n}\n\n/**\n * Legend action component used to render actions next to legend items\n *\n * render slot is constrained to 20px x 16px\n *\n * @public\n */\nexport type LegendAction = ComponentType<LegendActionProps>;\n\n/** @public */\nexport interface LegendColorPickerProps {\n  /**\n   * Anchor used to position picker\n   */\n  anchor: HTMLElement;\n  /**\n   * Current color of the given series\n   */\n  color: Color;\n  /**\n   * Callback to close color picker and set persistent color\n   */\n  onClose: () => void;\n  /**\n   * Callback to update temporary color state\n   */\n  onChange: (color: Color | null) => void;\n  /**\n   * Series ids for the active series\n   */\n  seriesIdentifiers: SeriesIdentifier[];\n}\n\n/** @public */\nexport type LegendColorPicker = ComponentType<LegendColorPickerProps>;\n\n/**\n * Buffer between cursor and point to trigger interaction\n * @public\n */\nexport type MarkBuffer = number | ((radius: number) => number);\n\n/**\n * The legend position configuration.\n * @public\n */\nexport type LegendPositionConfig = {\n  /**\n   * The vertical alignment of the legend\n   */\n  vAlign: typeof VerticalAlignment.Top | typeof VerticalAlignment.Bottom; // TODO typeof VerticalAlignment.Middle\n  /**\n   * The horizontal alignment of the legend\n   */\n  hAlign: typeof HorizontalAlignment.Left | typeof HorizontalAlignment.Right; // TODO typeof HorizontalAlignment.Center\n  /**\n   * The direction of the legend items.\n   * `horizontal` shows all the items listed one a side the other horizontally, wrapping to new lines.\n   * `vertical` shows the items in a vertical list\n   */\n  direction: LayoutDirection;\n  /**\n   * Remove the legend from the outside chart area, making it floating above the chart.\n   * @defaultValue false\n   */\n  floating: boolean;\n  /**\n   * The number of columns in floating configuration\n   * @defaultValue 1\n   */\n  floatingColumns?: number;\n  // TODO add grow factor: fill, shrink, fixed column size\n};\n\n/**\n * The props for {@link CustomLegend}\n * @public\n */\nexport interface CustomLegendProps {\n  pointerValue?: PointerValue;\n  items: {\n    seriesIdentifiers: SeriesIdentifier[];\n    path: LegendPath;\n    color: Color;\n    label: CategoryLabel;\n    seriesType?: SeriesType;\n    pointStyle?: PointStyle;\n    extraValue?: { raw: PrimitiveValue; formatted: string };\n    isSeriesHidden?: boolean;\n    onItemOverActon: () => void;\n    onItemOutAction: () => void;\n    onItemClickAction: (negate: boolean) => void;\n  }[];\n}\n\n/**\n * The react component used to render a custom legend\n * @public\n */\nexport type CustomLegend = ComponentType<CustomLegendProps>;\n\n/**\n * The legend configuration\n * @public\n */\nexport interface LegendSpec {\n  /**\n   * Show the legend\n   * @defaultValue false\n   */\n  showLegend: boolean;\n  /**\n   * Set legend position\n   * @defaultValue Position.Right\n   */\n  legendPosition: Position | LegendPositionConfig;\n  /**\n   * Show an extra parameter on each legend item defined by the chart type\n   * @defaultValue `false`\n   */\n  showLegendExtra: boolean;\n  /**\n   * Limit the legend to the specified maximal depth when showing a hierarchical legend\n   *\n   * @remarks\n   * This is not the max depth, but the number of level shown: 0 none, 1 first, 2 up to the second etc.\n   * See https://github.com/elastic/elastic-charts/issues/1981 for details\n   */\n  legendMaxDepth: number;\n  /**\n   * Sets the exact legend width (vertical) or height (horizontal)\n   *\n   * Limited to max of 70% of the chart container dimension\n   * Vertical legends limited to min of 30% of computed width\n   */\n  legendSize: number;\n  /**\n   * Display the legend as a flat list.\n   * @defaultValue `false`\n   */\n  flatLegend?: boolean;\n  /**\n   * Choose a partition highlighting strategy for hovering over legend items.\n   * @defaultValue `LegendStrategy.Path`\n   */\n  legendStrategy?: LegendStrategy;\n  onLegendItemOver?: LegendItemListener;\n  onLegendItemOut?: BasicListener;\n  onLegendItemClick?: LegendItemListener;\n  onLegendItemPlusClick?: LegendItemListener;\n  onLegendItemMinusClick?: LegendItemListener;\n  /**\n   * Render slot to render action for legend\n   */\n  legendAction?: LegendAction;\n  legendColorPicker?: LegendColorPicker;\n  /**\n   * A SeriesSortFn to sort the legend values (top-bottom)\n   */\n  legendSort?: SeriesCompareFn;\n  /**\n   * Override the legend with a custom component.\n   */\n  customLegend?: CustomLegend;\n}\n\n/**\n * The Spec used for Chart settings\n * @public\n */\nexport interface SettingsSpec extends Spec, LegendSpec {\n  /**\n   * Partial theme to be merged with base\n   *\n   * or\n   *\n   * Array of partial themes to be merged with base\n   * index `0` being the highest priority\n   *\n   * i.e. `[primary, secondary, tertiary]`\n   */\n  theme?: PartialTheme | PartialTheme[];\n  /**\n   * Full default theme to use as base\n   *\n   * @defaultValue `LIGHT_THEME`\n   */\n  baseTheme?: Theme;\n  rendering: Rendering;\n  rotation: Rotation;\n  animateData: boolean;\n\n  /**\n   * {@inheritDoc ExternalPointerEventsSettings}\n   * @alpha\n   */\n  externalPointerEvents: ExternalPointerEventsSettings;\n  /**\n   * Show debug shadow elements on chart\n   */\n  debug: boolean;\n  /**\n   * Show debug render state on `ChartStatus` component\n   * @alpha\n   */\n  debugState?: boolean;\n  /**\n   * Attach a listener for click on the projection area.\n   * The listener will be called with the current x value snapped to the closest\n   * X axis point, and an array of Y values for every groupId used in the chart.\n   */\n  onProjectionClick?: ProjectionClickListener;\n  onElementClick?: ElementClickListener;\n  onElementOver?: ElementOverListener;\n  onElementOut?: BasicListener;\n  onBrushEnd?: BrushEndListener;\n  onPointerUpdate?: PointerUpdateListener;\n  /**\n   * @alpha subject to be removed in the future\n   */\n  onResize?: ResizeListener;\n  onRenderChange?: RenderChangeListener;\n  onWillRender?: WillRenderListener;\n  onProjectionAreaChange?: ProjectionAreaChangeListener;\n\n  /**\n   * The min distance from the rendered point circumference to highlight a cartesian data point in line/area/bubble charts.\n   */\n  pointBuffer: MarkBuffer;\n  xDomain?: CustomXDomain;\n  /**\n   * allows user to set a click handler to the annotations\n   */\n  onAnnotationClick?: AnnotationClickListener;\n\n  /**\n   * debounce delay used for resizing chart\n   * @deprecated currently unused\n   */\n  resizeDebounce?: number;\n\n  /**\n   * debounce delay used for onPointerUpdate listener\n   */\n  pointerUpdateDebounce?: number;\n\n  /**\n   * trigger for onPointerUpdate listener.\n   *\n   *  - `'x'` - only triggers lister when x value changes\n   *  - `'y'` - only triggers lister when y values change\n   *  - `'both'` - triggers lister when x or y values change\n   *\n   * @defaultValue 'x'\n   */\n  pointerUpdateTrigger: PointerUpdateTrigger;\n\n  /**\n   * Block the brush tool on a specific axis: x, y or both.\n   * @defaultValue `x` {@link (BrushAxis:type) | BrushAxis.X}\n   */\n  brushAxis?: BrushAxis;\n  /**\n   * The minimum number of pixel to consider for a valid brush event (in both axis if brushAxis prop is BrushAxis.Both).\n   * E.g. a min value of 2 means that the brush area needs to be at least 2 pixel wide and 2 pixel tall.\n   * @defaultValue 2\n   */\n  minBrushDelta?: number;\n  /**\n   * Boolean to round brushed values to nearest step bounds.\n   *\n   * e.g.\n   * A brush selection range of [1.23, 3.6] with a domain of [1, 2, 3, 4].\n   *\n   * - when true returns [1, 3]\n   * - when false returns [1.23, 3.6]\n   *\n   * @defaultValue false\n   */\n  roundHistogramBrushValues?: boolean;\n  /**\n   * Boolean to allow brushing on last bucket even when outside domain or limit to end of domain.\n   * Should apply only for histogram charts\n   * e.g.\n   * A brush selection range of [1.23, 3.6] with a domain of [1, 2, 3]\n   *\n   * - when true returns [1.23, 3.6]\n   * - when false returns [1.23, 3]\n   *\n   * @defaultValue true\n   */\n  allowBrushingLastHistogramBin: boolean;\n  /**\n   * Orders ordinal x values\n   */\n  orderOrdinalBinsBy?: OrderBy;\n  /**\n   * Render component for no results UI\n   */\n  noResults?: ComponentType | ReactChild;\n  /**\n   * User can specify the heading level for the label\n   * @defaultValue 'h2'\n   */\n  ariaLabelHeadingLevel: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p';\n  /**\n   * A text to label the chart\n   */\n  ariaLabel?: string;\n  /**\n   * An DOM element ID for the chart label. If provided, it will override the ariaLabel prop.\n   */\n  ariaLabelledBy?: string;\n  /**\n   * A description about the chart.\n   */\n  ariaDescription?: string;\n  /**\n   * * An DOM element ID for the chart description. If provided, it will override the ariaDescription prop.\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Renders an autogenerated summary of the chart\n   * @defaultValue true\n   */\n  ariaUseDefaultSummary: boolean;\n  /**\n   * User can provide a table description of the data\n   */\n  ariaTableCaption?: string;\n\n  /**\n   * Unicode Locale Identifier, default `en`\n   */\n  locale: string;\n}\n\n/**\n * Order by options\n * @public\n */\nexport interface OrderBy {\n  binAgg?: BinAgg;\n  direction?: Direction;\n}\n\n/**\n * Adds settings spec to chart specs\n * @public\n */\nexport const Settings = function (\n  props: SFProps<\n    SettingsSpec,\n    keyof (typeof settingsBuildProps)['overrides'],\n    keyof (typeof settingsBuildProps)['defaults'],\n    keyof (typeof settingsBuildProps)['optionals'],\n    keyof (typeof settingsBuildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = settingsBuildProps;\n  useSpecFactory<SettingsSpec>({ ...defaults, ...stripUndefined(props), ...overrides });\n  return null;\n};\n\n/** @public */\nexport type SettingsProps = ComponentProps<typeof Settings>;\n\n/** @internal */\nexport function isPointerOutEvent(event: PointerEvent | null | undefined): event is PointerOutEvent {\n  return event?.type === PointerEventType.Out;\n}\n\n/** @internal */\nexport function isPointerOverEvent(event: PointerEvent | null | undefined): event is PointerOverEvent {\n  return event?.type === PointerEventType.Over;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentProps } from 'react';\n\nimport { Spec } from '.';\nimport { SpecType } from './constants';\nimport { ChartType } from '../chart_types';\nimport { Ratio } from '../common/geometry';\nimport { specComponentFactory } from '../state/spec_factory';\n\n/**\n * Can be used for margin or padding start/end (eg. left/right or top/bottom)\n * Todo: this will soon change to `{outer, inner}` for explicit specification\n * @alpha\n */\nexport type RelativeBandsPadding = {\n  /**\n   * Outer padding specifies the padding size *next to* a small multiples panel that's on the edge of the small\n   * multiples grid, expressed as a proportion (ratio) of the panel size\n   */\n  outer: Ratio;\n  /**\n   * Inner padding specifies the padding size *between* small multiples panels in the small multiples grid,\n   * expressed as a proportion (ratio) of the panel size\n   */\n  inner: Ratio;\n};\n\n/** @internal */\nexport const DEFAULT_SM_PANEL_PADDING: RelativeBandsPadding = { outer: 0, inner: 0.1 };\n\n/**\n * Specifies styling and stylistic layout attributes relating to small multiples\n * @alpha\n */\nexport interface SmallMultiplesStyle {\n  /**\n   * Horizontal padding for each panel, expressed as [leftMarginRatio, rightMarginRatio], relative to the gross panel width\n   */\n  horizontalPanelPadding: RelativeBandsPadding;\n  /**\n   * Vertical padding for each panel, expressed as [topMarginRatio, bottomMarginRatio], relative to the gross panel height\n   */\n  verticalPanelPadding: RelativeBandsPadding;\n}\n\n/** @alpha */\nexport interface SmallMultiplesSpec extends Spec {\n  /**\n   * Identifies the `<GroupBy id=\"foo\">` referenced by `splitHorizontally=\"foo\"`, specifying horizontal tiling\n   */\n  splitHorizontally?: string;\n  /**\n   * Identifies the `<GroupBy id=\"bar\">` referenced by `splitVertically=\"bar\"`, specifying vertical tiling\n   */\n  splitVertically?: string;\n  /**\n   * Identifies the `<GroupBy id=\"baz\">` referenced by `splitVertically=\"baz\"`, specifying space-filling tiling in a Z pattern\n   */\n  splitZigzag?: string;\n  /**\n   * Specifies styling and layout properties of the tiling, such as paddings between and outside panels\n   */\n  style?: Partial<SmallMultiplesStyle>;\n}\n\n/**\n * Add small multiples spec to chart\n * @alpha\n */\nexport const SmallMultiples = specComponentFactory<SmallMultiplesSpec>()(\n  {\n    chartType: ChartType.Global,\n    specType: SpecType.SmallMultiples,\n  },\n  {\n    id: '__global__small_multiples___',\n  },\n);\n\n/** @public */\nexport type SmallMultiplesProps = ComponentProps<typeof SmallMultiples>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { useEffect, FC, PropsWithChildren } from 'react';\nimport { connect } from 'react-redux';\nimport { bindActionCreators, Dispatch } from 'redux';\n\nimport { specParsed, specUnmounted } from '../state/actions/specs';\n\nconst SpecsParserComponent: FC<PropsWithChildren<DispatchProps>> = (props) => {\n  const injected = props as DispatchProps;\n  // clean all specs\n  useEffect(() => {\n    injected.specParsed();\n  });\n  useEffect(\n    () => () => {\n      injected.specUnmounted();\n    },\n    [], // eslint-disable-line react-hooks/exhaustive-deps\n  );\n  // TODO eliminate the need for this type casting\n  return props.children ? (props.children as React.ReactElement) : null;\n};\n\ninterface DispatchProps {\n  specParsed: () => void;\n  specUnmounted: () => void;\n}\n\nconst mapDispatchToProps = (dispatch: Dispatch): DispatchProps =>\n  bindActionCreators(\n    {\n      specParsed,\n      specUnmounted,\n    },\n    dispatch,\n  );\n\n/**\n * The Spec Parser component\n * @internal\n */\nexport const SpecsParser = connect(null, mapDispatchToProps)(SpecsParserComponent);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ComponentType, ReactNode } from 'react';\n\nimport { SpecType, TooltipStickTo, TooltipType } from './constants';\nimport { Spec } from './index';\nimport { SettingsSpec } from './settings';\nimport { ChartType } from '../chart_types';\nimport { BaseDatum } from '../chart_types/specs';\nimport { Color } from '../common/colors';\nimport { SeriesIdentifier } from '../common/series_id';\nimport { TooltipPortalSettings } from '../components/portal';\nimport { CustomTooltip } from '../components/tooltip';\nimport { buildSFProps, SFProps, useSpecFactory } from '../state/spec_factory';\nimport { PointerValue } from '../state/types';\nimport { Datum, stripUndefined } from '../utils/common';\n\n/**\n * This interface describe the properties of single value shown in the tooltip\n * @public\n */\nexport interface TooltipValue<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends PointerValue<D> {\n  /**\n   * The label of the tooltip value\n   */\n  label: string;\n  /**\n   * The mark value\n   */\n  markValue?: number | null;\n  /**\n   * The mark value to display\n   */\n  formattedMarkValue?: string | null;\n  /**\n   * The color of the graphic mark (by default the color of the series)\n   */\n  color: Color;\n  /**\n   * True if the mouse is over the graphic mark connected to the tooltip\n   */\n  isHighlighted: boolean;\n  /**\n   * True if the tooltip is visible, false otherwise\n   */\n  isVisible: boolean;\n  /**\n   * The identifier of the related series\n   */\n  seriesIdentifier: SI;\n  /**\n   * The datum associated with the current tooltip value\n   * Maybe not available\n   */\n  datum?: D;\n  /**\n   * Internal flag used to simplify interactions for heatmap tooltip\n   * TODO: replace this flag with better internal tooltip info structures\n   * @internal\n   */\n  displayOnly?: boolean;\n}\n\n/**\n * A value formatter of a {@link TooltipValue}\n * @public\n */\nexport type TooltipValueFormatter<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = (\n  data: TooltipValue<D, SI>,\n) => JSX.Element | string;\n\n/**\n * A header formatter of tooltip {@link PointerValue}\n * @public\n */\nexport type TooltipHeaderFormatter<D extends BaseDatum = Datum> = (data: PointerValue<D>) => JSX.Element | string;\n\n/** @internal */\nexport function isCrosshairTooltipType(type: TooltipType) {\n  return type === TooltipType.VerticalCursor || type === TooltipType.Crosshairs;\n}\n\n/** @internal */\nexport function isFollowTooltipType(type: TooltipType) {\n  return type === TooltipType.Follow;\n}\n\n/** @internal */\nexport function getTooltipType(tooltip: TooltipSpec, settings: SettingsSpec, externalTooltip = false): TooltipType {\n  if (!externalTooltip) return tooltip.type;\n  const { visible } = settings.externalPointerEvents.tooltip;\n  return visible ? TooltipType.VerticalCursor : TooltipType.None;\n}\n\n/**\n * Tooltip action parameters\n * @public\n */\nexport type TooltipAction<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = {\n  /**\n   * Clickable label to display action\n   */\n  label: string | ((selected: TooltipValue<D, SI>[], allItems: TooltipValue<D, SI>[]) => ReactNode);\n  /**\n   * Hides action from list\n   */\n  hide?: (selected: TooltipValue<D, SI>[], allItems: TooltipValue<D, SI>[]) => boolean;\n  /**\n   * Disables action when true or string description is passed\n   * If a string is passed, it will be used as the title to display reason for disablement\n   */\n  disabled?: (selected: TooltipValue<D, SI>[], allItems: TooltipValue<D, SI>[]) => boolean | string;\n  /**\n   * Callback trigger when action is selected\n   */\n  onSelect: (selected: TooltipValue<D, SI>[], allItems: TooltipValue<D, SI>[]) => void;\n};\n\n/**\n * Spec used to configure tooltip for chart\n * @public\n */\nexport interface TooltipSpec<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>\n  extends Spec,\n    TooltipPortalSettings<'chart'> {\n  /**\n   * The {@link (TooltipType:type) | TooltipType} of the tooltip\n   * @defaultValue vertical\n   */\n  type: TooltipType;\n\n  /**\n   * Whenever the tooltip needs to snap to the x/band position or not\n   * @defaultValue true\n   */\n  snap: boolean;\n\n  /**\n   * A {@link TooltipHeaderFormatter} to format the header value. Ignored when header is defined.\n   */\n  headerFormatter?: TooltipHeaderFormatter<D>;\n\n  /**\n   * Unit for event (i.e. `time`, `feet`, `count`, etc.).\n   * Not currently used/implemented\n   *\n   * @alpha\n   */\n  unit?: string;\n\n  /**\n   * Render custom tooltip given header and values\n   */\n  customTooltip?: CustomTooltip<D, SI>;\n\n  /**\n   * Stick the tooltip to a specific position within the current cursor\n   * @defaultValue mousePosition\n   */\n  stickTo?: TooltipStickTo;\n\n  /**\n   * Show null values on the tooltip\n   * @defaultValue false\n   */\n  showNullValues: boolean;\n\n  /**\n   * Custom header for tooltip. Ignored when used with `customTooltip`.\n   * Note: This is not the table headers but spans the entire tooltip.\n   */\n  header: 'default' | 'none' | ComponentType<{ items: TooltipValue<D, SI>[]; header: PointerValue<D> | null }>;\n\n  /**\n   * Custom body for tooltip. Ignored when used with `customTooltip`.\n   * Note: This is not the table body but spans the entire tooltip.\n   */\n  body: 'default' | 'none' | ComponentType<{ items: TooltipValue<D, SI>[]; header: PointerValue<D> | null }>;\n  /**\n   * Custom footer for tooltip. Ignored when used with `customTooltip`.\n   * Note: This is not the table footers but spans the entire tooltip.\n   */\n  footer: 'default' | 'none' | ComponentType<{ items: TooltipValue<D, SI>[]; header: PointerValue<D> | null }>;\n\n  /**\n   * Actions to enable tooltip selection\n   */\n  actions:\n    | TooltipAction<D, SI>[]\n    | ((selected: TooltipValue<D, SI>[]) => Promise<TooltipAction<D, SI>[]> | TooltipAction<D, SI>[]);\n\n  /**\n   * Shown in place of actions UI while loading async actions\n   */\n  actionsLoading: string | ComponentType<{ selected: TooltipValue<D, SI>[] }>;\n\n  /**\n   * Shown in place of actions UI after loading async actions and finding none\n   */\n  noActionsLoaded: string | ComponentType<{ selected: TooltipValue<D, SI>[] }>;\n\n  /**\n   * Prompt displayed to indicate user can right-click for contextual menu\n   */\n  actionPrompt: string;\n\n  /**\n   * Prompt displayed to indicate user can right-click for contextual menu\n   */\n  pinningPrompt: string;\n\n  /**\n   * Prompt displayed when tooltip is pinned but all actions are hidden\n   */\n  selectionPrompt: string;\n\n  /**\n   * Max number of tooltip items before showing only highlighted values\n   */\n  maxTooltipItems: number;\n\n  /**\n   * Max number of visible tooltip items before scrolling. Does not apply to custom tooltips\n   */\n  maxVisibleTooltipItems: number;\n}\n\n/**\n * Configure tooltip for chart\n * @public\n */\nexport const tooltipBuildProps = buildSFProps<TooltipSpec>()(\n  {\n    id: '__global__tooltip___' as const,\n    chartType: ChartType.Global,\n    specType: SpecType.Tooltip,\n  },\n  {\n    type: TooltipType.VerticalCursor,\n    snap: true,\n    showNullValues: false,\n    actions: [],\n    actionPrompt: 'Right-click to show actions',\n    pinningPrompt: 'Right-click to pin tooltip',\n    selectionPrompt: 'Please select a series',\n    actionsLoading: 'Loading Actions...',\n    noActionsLoaded: 'No actions available',\n    maxTooltipItems: 10,\n    maxVisibleTooltipItems: 10,\n    header: 'default',\n    body: 'default',\n    footer: 'default',\n  },\n);\n\n/** @public */\nexport const DEFAULT_TOOLTIP_SPEC: TooltipSpec = {\n  ...tooltipBuildProps.defaults,\n  ...tooltipBuildProps.overrides,\n};\n\n/**\n * Adds settings spec to chart specs\n * @public\n */\nexport const Tooltip = function <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  props: SFProps<\n    TooltipSpec<D, SI>,\n    keyof (typeof tooltipBuildProps)['overrides'],\n    keyof (typeof tooltipBuildProps)['defaults'],\n    keyof (typeof tooltipBuildProps)['optionals'],\n    keyof (typeof tooltipBuildProps)['requires']\n  >,\n) {\n  const { defaults, overrides } = tooltipBuildProps;\n  // @ts-ignore - default generic value\n  useSpecFactory<TooltipSpec<D, SI>>({\n    ...defaults,\n    ...stripUndefined(props),\n    ...overrides,\n  });\n  return null;\n};\n\n/**\n * This interface describe the properties of single value shown in the tooltip\n * @public\n */\nexport type TooltipProps<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = SFProps<\n  TooltipSpec<D, SI>,\n  keyof (typeof tooltipBuildProps)['overrides'],\n  keyof (typeof tooltipBuildProps)['defaults'],\n  keyof (typeof tooltipBuildProps)['optionals'],\n  keyof (typeof tooltipBuildProps)['requires']\n>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const CHART_RENDERED = 'CHART_RENDERED';\n\ninterface ChartRenderedAction {\n  type: typeof CHART_RENDERED;\n}\n\n/** @internal */\nexport function onChartRendered(): ChartRenderedAction {\n  return { type: CHART_RENDERED };\n}\n\n/** @internal */\nexport type ChartActions = ChartRenderedAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../utils/dimensions';\n\n/** @internal */\nexport const UPDATE_PARENT_DIMENSION = 'UPDATE_PARENT_DIMENSION';\n\n/** @internal */\nexport const UPDATE_CHART_TITLES = 'UPDATE_CHART_TITLES';\n\ninterface UpdateParentDimensionAction {\n  type: typeof UPDATE_PARENT_DIMENSION;\n  dimensions: Dimensions;\n}\n\ninterface UpdateChartTitlesAction {\n  type: typeof UPDATE_CHART_TITLES;\n  title?: string;\n  description?: string;\n}\n\n/** @internal */\nexport function updateParentDimensions(dimensions: Dimensions): UpdateParentDimensionAction {\n  return { type: UPDATE_PARENT_DIMENSION, dimensions };\n}\n\n/** @internal */\nexport function updateChartTitles(title?: string, description?: string): UpdateChartTitlesAction {\n  return { type: UPDATE_CHART_TITLES, title, description };\n}\n\n/** @internal */\nexport type ChartSettingsActions = UpdateParentDimensionAction | UpdateChartTitlesAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../common/colors';\nimport { SeriesKey } from '../../common/series_id';\n\n/** @internal */\nexport const CLEAR_TEMPORARY_COLORS = 'CLEAR_TEMPORARY_COLORS';\n\n/** @internal */\nexport const SET_TEMPORARY_COLOR = 'SET_TEMPORARY_COLOR';\n\n/** @internal */\nexport const SET_PERSISTED_COLOR = 'SET_PERSISTED_COLOR';\n\ninterface ClearTemporaryColors {\n  type: typeof CLEAR_TEMPORARY_COLORS;\n}\n\ninterface SetTemporaryColor {\n  type: typeof SET_TEMPORARY_COLOR;\n  keys: SeriesKey[];\n  color: Color | null;\n}\n\ninterface SetPersistedColor {\n  type: typeof SET_PERSISTED_COLOR;\n  keys: SeriesKey[];\n  color: Color | null;\n}\n\n/** @internal */\nexport function clearTemporaryColors(): ClearTemporaryColors {\n  return { type: CLEAR_TEMPORARY_COLORS };\n}\n\n/** @internal */\nexport function setTemporaryColor(keys: SeriesKey[], color: Color | null): SetTemporaryColor {\n  return { type: SET_TEMPORARY_COLOR, keys, color };\n}\n\n/** @internal */\nexport function setPersistedColor(keys: SeriesKey[], color: Color | null): SetPersistedColor {\n  return { type: SET_PERSISTED_COLOR, keys, color };\n}\n\n/** @internal */\nexport type ColorsActions = ClearTemporaryColors | SetTemporaryColor | SetPersistedColor;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\n/** @internal */\nexport const ON_DOM_ELEMENT_ENTER = 'ON_DOM_ELEMENT_ENTER';\n/** @internal */\nexport const ON_DOM_ELEMENT_LEAVE = 'ON_DOM_ELEMENT_LEAVE';\n/** @internal */\nexport const ON_DOM_ELEMENT_CLICK = 'ON_DOM_ELEMENT_CLICK';\n\n/** @internal */\nexport const DOMElementType = Object.freeze({\n  LineAnnotationMarker: 'LineAnnotationMarker' as const,\n});\n/** @internal */\nexport type DOMElementType = $Values<typeof DOMElementType>;\n\n/** @internal */\nexport interface DOMElement {\n  type: DOMElementType;\n  id: string;\n  createdBySpecId: string; // TODO is that + datum enough to identify the elements?\n  datum: unknown;\n}\ninterface DOMElementEnterAction {\n  type: typeof ON_DOM_ELEMENT_ENTER;\n  element: DOMElement;\n}\n\ninterface DOMElementLeaveAction {\n  type: typeof ON_DOM_ELEMENT_LEAVE;\n}\n\ninterface DOMElementClickAction {\n  type: typeof ON_DOM_ELEMENT_CLICK;\n}\n\n/** @internal */\nexport function onDOMElementLeave(): DOMElementLeaveAction {\n  return { type: ON_DOM_ELEMENT_LEAVE };\n}\n\n/** @internal */\nexport function onDOMElementEnter(element: DOMElement): DOMElementEnterAction {\n  return { type: ON_DOM_ELEMENT_ENTER, element };\n}\n\n/** @internal */\nexport function onDOMElementClick(): DOMElementClickAction {\n  return { type: ON_DOM_ELEMENT_CLICK };\n}\n\n/** @internal */\nexport type DOMElementActions = DOMElementEnterAction | DOMElementLeaveAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PointerEvent } from '../../specs/settings';\n\n/** @internal */\nexport const EXTERNAL_POINTER_EVENT = 'EXTERNAL_POINTER_EVENT';\n\ninterface ExternalPointerEvent {\n  type: typeof EXTERNAL_POINTER_EVENT;\n  event: PointerEvent;\n}\n\n/** @internal */\nexport function onExternalPointerEvent(event: PointerEvent): ExternalPointerEvent {\n  return { type: EXTERNAL_POINTER_EVENT, event };\n}\n\n/** @internal */\nexport type EventsActions = ExternalPointerEvent;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const ON_KEY_UP = 'ON_KEY_UP';\n\ninterface KeyUpAction {\n  type: typeof ON_KEY_UP;\n  /**\n   * Keyboard key from event\n   */\n  key: string;\n}\n\n/**\n * Action called on `keyup` event\n * @param key keyboard key\n * @internal\n */\nexport function onKeyPress(key: string): KeyUpAction {\n  return { type: ON_KEY_UP, key };\n}\n\n/** @internal */\nexport type KeyActions = KeyUpAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CategoryKey } from '../../common/category';\nimport { SeriesIdentifier } from '../../common/series_id';\n\n/** @internal */\nexport const ON_LEGEND_ITEM_OVER = 'ON_LEGEND_ITEM_OVER';\n\n/** @internal */\nexport const ON_LEGEND_ITEM_OUT = 'ON_LEGEND_ITEM_OUT';\n\n/** @internal */\nexport const ON_TOGGLE_DESELECT_SERIES = 'ON_TOGGLE_DESELECT_SERIES';\n\n/** @public */\nexport type LegendPathElement = { index: number; value: CategoryKey };\n\n/**\n * This is an array that defines a path for chart types characterized by hierarchical breakdown of the data, currently\n * partition charts. With partition charts,\n *   - element index 0 is the `groupBy` breakdown: a panel `index` number, and a stringified category `value`\n *      - if the chart is a singleton, ie. there's no trellising, it's `{index: 0, value: NULL_SMALL_MULTIPLES_KEY}`\n *   - element index 1 represents the singular root of a specific pie etc. chart `{index: 0, value: HIERARCHY_ROOT_KEY}`\n *   - element index 2 represents the primary breakdown categories within a pie/treemap/etc.\n *   - element index 3 the next level breakdown, if any (eg. a ring around the pie, ie. sunburst)\n *   etc.\n * @public\n */\nexport type LegendPath = LegendPathElement[];\n\ninterface LegendItemOverAction {\n  type: typeof ON_LEGEND_ITEM_OVER;\n  legendPath: LegendPath;\n}\n\ninterface LegendItemOutAction {\n  type: typeof ON_LEGEND_ITEM_OUT;\n}\n\n/** @internal */\nexport interface ToggleDeselectSeriesAction {\n  type: typeof ON_TOGGLE_DESELECT_SERIES;\n  legendItemIds: SeriesIdentifier[];\n  negate: boolean;\n}\n\n/** @internal */\nexport function onLegendItemOverAction(legendPath: LegendPath): LegendItemOverAction {\n  return { type: ON_LEGEND_ITEM_OVER, legendPath };\n}\n\n/** @internal */\nexport function onLegendItemOutAction(): LegendItemOutAction {\n  return { type: ON_LEGEND_ITEM_OUT };\n}\n\n/** @internal */\nexport function onToggleDeselectSeriesAction(\n  legendItemIds: SeriesIdentifier[],\n  negate = false,\n): ToggleDeselectSeriesAction {\n  return { type: ON_TOGGLE_DESELECT_SERIES, legendItemIds, negate };\n}\n\n/** @internal */\nexport type LegendActions = LegendItemOverAction | LegendItemOutAction | ToggleDeselectSeriesAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Point } from '../../utils/point';\n\n/** @internal */\nexport const ON_POINTER_MOVE = 'ON_POINTER_MOVE';\n\n/** @internal */\nexport const ON_MOUSE_DOWN = 'ON_MOUSE_DOWN';\n\n/** @internal */\nexport const ON_MOUSE_UP = 'ON_MOUSE_UP';\n\n/** @internal */\nexport const ON_MOUSE_RIGHT_CLICK = 'ON_MOUSE_RIGHT_CLICK';\n\ninterface MouseRightClickAction {\n  type: typeof ON_MOUSE_RIGHT_CLICK;\n  position: Point;\n  time: number;\n}\n\ninterface MouseDownAction {\n  type: typeof ON_MOUSE_DOWN;\n  position: Point;\n  time: number;\n}\n\ninterface MouseUpAction {\n  type: typeof ON_MOUSE_UP;\n  position: Point;\n  time: number;\n}\n\ninterface PointerMoveAction {\n  type: typeof ON_POINTER_MOVE;\n  position: Point;\n  time: number;\n}\n\n/**\n * Action called on mouse button down event\n * @param position the x and y position (native event offsetX, offsetY)\n * @param time the timestamp of the event (native event timeStamp)\n * @internal\n */\nexport function onMouseRightClick(position: Point, time: number): MouseRightClickAction {\n  return { type: ON_MOUSE_RIGHT_CLICK, position, time };\n}\n\n/**\n * Action called on mouse button down event\n * @param position the x and y position (native event offsetX, offsetY)\n * @param time the timestamp of the event (native event timeStamp)\n * @internal\n */\nexport function onMouseDown(position: Point, time: number): MouseDownAction {\n  return { type: ON_MOUSE_DOWN, position, time };\n}\n\n/**\n * Action called on mouse button up event\n * @param position the x and y position (native event offsetX, offsetY)\n * @param time the timestamp of the event (native event timeStamp)\n * @internal\n */\nexport function onMouseUp(position: Point, time: number): MouseUpAction {\n  return { type: ON_MOUSE_UP, position, time };\n}\n\n/**\n * Action called with the mouse coordinates relatives to the chart container (exclude the legend)\n * @param position the x and y position (native event offsetX, offsetY)\n * @param time the timestamp of the event (native event timeStamp)\n * @internal\n */\nexport function onPointerMove(position: Point, time: number): PointerMoveAction {\n  return { type: ON_POINTER_MOVE, position, time };\n}\n\n/** @internal */\nexport type MouseActions = MouseDownAction | MouseUpAction | PointerMoveAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Spec } from '../../specs';\n\n/** @internal */\nexport const UPSERT_SPEC = 'UPSERT_SPEC';\n\n/** @internal */\nexport const REMOVE_SPEC = 'REMOVE_SPEC';\n\n/** @internal */\nexport const SPEC_PARSED = 'SPEC_PARSED';\n\n/** @internal */\nexport const SPEC_UNMOUNTED = 'SPEC_UNMOUNTED';\n\ninterface SpecParsedAction {\n  type: typeof SPEC_PARSED;\n}\n\ninterface SpecUnmountedAction {\n  type: typeof SPEC_UNMOUNTED;\n}\n\ninterface UpsertSpecAction {\n  type: typeof UPSERT_SPEC;\n  spec: Spec;\n}\n\ninterface RemoveSpecAction {\n  type: typeof REMOVE_SPEC;\n  id: string;\n}\n\n/** @internal */\nexport function upsertSpec(spec: Spec): UpsertSpecAction {\n  return { type: UPSERT_SPEC, spec };\n}\n\n/** @internal */\nexport function removeSpec(id: string): RemoveSpecAction {\n  return { type: REMOVE_SPEC, id };\n}\n\n/** @internal */\nexport function specParsed(): SpecParsedAction {\n  return { type: SPEC_PARSED };\n}\n\n/** @internal */\nexport function specUnmounted(): SpecUnmountedAction {\n  return { type: SPEC_UNMOUNTED };\n}\n\n/** @internal */\nexport type SpecActions = SpecParsedAction | SpecUnmountedAction | UpsertSpecAction | RemoveSpecAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipValue } from '../../specs';\n\n/** @internal */\nexport const PIN_TOOLTIP = 'PIN_TOOLTIP';\n\n/** @internal */\nexport const TOGGLE_SELECTED_TOOLTIP_ITEM = 'TOGGLE_SELECTED_TOOLTIP_ITEM';\n\n/** @internal */\nexport const SET_SELECTED_TOOLTIP_ITEMS = 'SET_SELECTED_TOOLTIP_ITEMS';\n\n/** @internal */\nexport interface PinTooltipAction {\n  type: typeof PIN_TOOLTIP;\n  pinned: boolean;\n  resetPointer: boolean;\n}\n\n/** @internal */\nexport interface ToggleSelectedTooltipItemAction {\n  type: typeof TOGGLE_SELECTED_TOOLTIP_ITEM;\n  item: TooltipValue;\n}\n\n/** @internal */\nexport interface SetSelectedTooltipItemsAction {\n  type: typeof SET_SELECTED_TOOLTIP_ITEMS;\n  items: TooltipValue[];\n}\n\n/** @internal */\nexport function pinTooltip(pinned: boolean, resetPointer: boolean = false): PinTooltipAction {\n  return { type: PIN_TOOLTIP, pinned, resetPointer };\n}\n\n/** @internal */\nexport function toggleSelectedTooltipItem(item: TooltipValue): ToggleSelectedTooltipItemAction {\n  return { type: TOGGLE_SELECTED_TOOLTIP_ITEM, item };\n}\n\n/** @internal */\nexport function setSelectedTooltipItems(items: TooltipValue[]): SetSelectedTooltipItemsAction {\n  return { type: SET_SELECTED_TOOLTIP_ITEMS, items };\n}\n\n/** @internal */\nexport type TooltipActions = PinTooltipAction | ToggleSelectedTooltipItemAction | SetSelectedTooltipItemsAction;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const Z_INDEX_EVENT = 'Z_INDEX_EVENT';\n\ninterface ZIndexEvent {\n  type: typeof Z_INDEX_EVENT;\n  zIndex: number;\n}\n\n/** @internal */\nexport function onComputedZIndex(zIndex: number): ZIndexEvent {\n  return { type: Z_INDEX_EVENT, zIndex };\n}\n\n/** @internal */\nexport type ZIndexActions = ZIndexEvent;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { CSSProperties, RefObject } from 'react';\n\nimport { StateActions } from './actions';\nimport { CHART_RENDERED } from './actions/chart';\nimport { UPDATE_CHART_TITLES, UPDATE_PARENT_DIMENSION } from './actions/chart_settings';\nimport { CLEAR_TEMPORARY_COLORS, SET_PERSISTED_COLOR, SET_TEMPORARY_COLOR } from './actions/colors';\nimport { DOMElement } from './actions/dom_element';\nimport { EXTERNAL_POINTER_EVENT } from './actions/events';\nimport { LegendPath } from './actions/legend';\nimport { REMOVE_SPEC, SPEC_PARSED, SPEC_UNMOUNTED, UPSERT_SPEC } from './actions/specs';\nimport { Z_INDEX_EVENT } from './actions/z_index';\nimport { interactionsReducer } from './reducers/interactions';\nimport { getInternalIsInitializedSelector, InitStatus } from './selectors/get_internal_is_intialized';\nimport { getLegendItemsSelector } from './selectors/get_legend_items';\nimport { LegendItemLabel } from './selectors/get_legend_items_labels';\nimport { DebugState } from './types';\nimport { getInitialPointerState, getInitialTooltipState } from './utils';\nimport { ChartType } from '../chart_types';\nimport { BulletState } from '../chart_types/bullet_graph/chart_state';\nimport { FlameState } from '../chart_types/flame_chart/internal_chart_state';\nimport { GoalState } from '../chart_types/goal_chart/state/chart_state';\nimport { HeatmapState } from '../chart_types/heatmap/state/chart_state';\nimport { MetricState } from '../chart_types/metric/state/chart_state';\nimport { PartitionState } from '../chart_types/partition_chart/state/chart_state';\nimport { TimeslipState } from '../chart_types/timeslip/internal_chart_state';\nimport { WordcloudState } from '../chart_types/wordcloud/state/chart_state';\nimport { XYAxisChartState } from '../chart_types/xy_chart/state/chart_state';\nimport { CategoryKey } from '../common/category';\nimport { Color } from '../common/colors';\nimport { LegendItem, LegendItemExtraValues } from '../common/legend';\nimport { SmallMultiplesSeriesDomains } from '../common/panel_utils';\nimport { SeriesIdentifier, SeriesKey } from '../common/series_id';\nimport { AnchorPosition } from '../components/portal/types';\nimport { TooltipInfo } from '../components/tooltip/types';\nimport { DEFAULT_SETTINGS_SPEC, PointerEvent, Spec, TooltipValue } from '../specs';\nimport { keepDistinct } from '../utils/common';\nimport { Dimensions } from '../utils/dimensions';\nimport { Logger } from '../utils/logger';\nimport { Point } from '../utils/point';\n\n/** @internal */\nexport type BackwardRef = () => React.RefObject<HTMLDivElement>;\n\n/** @internal */\nexport interface TooltipVisibility {\n  visible: boolean;\n  isExternal: boolean;\n  isPinnable: boolean;\n  displayOnly: boolean;\n}\n\n/**\n * A set of chart-type-dependant functions that required by all chart type\n * @internal\n */\nexport interface InternalChartState {\n  /**\n   * The chart type\n   */\n  chartType: ChartType;\n  isInitialized(globalState: GlobalChartState): InitStatus;\n  /**\n   * Returns a JSX element with the chart rendered (lenged excluded)\n   * @param containerRef\n   * @param forwardStageRef\n   */\n  chartRenderer(containerRef: BackwardRef, forwardStageRef: RefObject<HTMLCanvasElement>): JSX.Element | null;\n  /**\n   * `true` if the brush is available for this chart type\n   * @param globalState\n   */\n  isBrushAvailable(globalState: GlobalChartState): boolean;\n  /**\n   * `true` if the brush is available for this chart type\n   * @param globalState\n   */\n  isBrushing(globalState: GlobalChartState): boolean;\n  /**\n   * `true` if the chart is empty (no data displayed)\n   * @param globalState\n   */\n  isChartEmpty(globalState: GlobalChartState): boolean;\n\n  /**\n   * Returns the list of legend items labels. Mainly used to compute the legend size\n   * based on labels and their hierarchy depth.\n   * @param globalState\n   */\n  getLegendItemsLabels(globalState: GlobalChartState): LegendItemLabel[];\n\n  /**\n   * Returns the list of legend items.\n   * @param globalState\n   */\n  getLegendItems(globalState: GlobalChartState): LegendItem[];\n  /**\n   * Returns the list of extra values for each legend item\n   * @param globalState\n   */\n  getLegendExtraValues(globalState: GlobalChartState): Map<SeriesKey, LegendItemExtraValues>;\n  /**\n   * Returns the CSS pointer cursor depending on the internal chart state\n   * @param globalState\n   */\n  getPointerCursor(globalState: GlobalChartState): CSSProperties['cursor'];\n  /**\n   * Describe if the tooltip is visible and comes from an external source\n   * @param globalState\n   */\n  isTooltipVisible(globalState: GlobalChartState): TooltipVisibility;\n  /**\n   * Get the tooltip information to display\n   * @param globalState the GlobalChartState\n   */\n  getTooltipInfo(globalState: GlobalChartState): TooltipInfo | undefined;\n\n  /**\n   * Get the tooltip anchor position\n   * @param globalState\n   */\n  getTooltipAnchor(globalState: GlobalChartState): AnchorPosition | null;\n\n  /**\n   * Called on every state change to activate any event callback\n   * @param globalState\n   */\n  eventCallbacks(globalState: GlobalChartState): void;\n\n  /**\n   * Get the chart main projection area: exclude legends, axis and other external marks\n   * @param globalState\n   */\n  getMainProjectionArea(globalState: GlobalChartState): Dimensions;\n\n  /**\n   * Get the chart container projection area\n   * @param globalState\n   */\n  getProjectionContainerArea(globalState: GlobalChartState): Dimensions;\n\n  /**\n   * Get the brushed area if available\n   * @param globalState\n   */\n  getBrushArea(globalState: GlobalChartState): Dimensions | null;\n\n  /**\n   * Get debug state of chart\n   * @param globalState\n   */\n  getDebugState(globalState: GlobalChartState): DebugState;\n\n  /**\n   * Get the series types for the screen reader summary component\n   */\n  getChartTypeDescription(globalState: GlobalChartState): string;\n\n  /**\n   * Get the domain of the vertical and horizontal small multiple grids\n   */\n  getSmallMultiplesDomains(globalState: GlobalChartState): SmallMultiplesSeriesDomains;\n\n  /**\n   * Determines if chart titles are displayed when provided\n   */\n  canDisplayChartTitles(globalState: GlobalChartState): boolean;\n}\n\n/** @internal */\nexport interface SpecList {\n  [specId: string]: Spec;\n}\n\n/** @internal */\nexport interface PointerState {\n  position: Point;\n  time: number;\n}\n\n/** @internal */\nexport interface DragState {\n  start: PointerState;\n  end: PointerState;\n}\n\n/** @internal */\nexport interface PointerStates {\n  dragging: boolean;\n  current: PointerState;\n  down: PointerState | null;\n  pinned: PointerState | null;\n  up: PointerState | null;\n  lastDrag: DragState | null;\n  lastClick: PointerState | null;\n}\n\n/** @internal */\nexport interface InteractionsState {\n  pointer: PointerStates;\n  highlightedLegendPath: LegendPath;\n  deselectedDataSeries: SeriesIdentifier[];\n  hoveredDOMElement: DOMElement | null;\n  drilldown: CategoryKey[];\n  prevDrilldown: CategoryKey[];\n  tooltip: TooltipInteractionState;\n}\n\n/** @internal */\nexport interface TooltipInteractionState {\n  pinned: boolean;\n  selected: TooltipValue[];\n}\n\n/** @internal */\nexport interface ExternalEventsState {\n  pointer: PointerEvent | null;\n}\n\n/** @internal */\nexport interface ColorOverrides {\n  temporary: Record<SeriesKey, Color | null>; // null (vs. undefined) means that `overrides.persisted[key]` in `series.ts` not be used\n  persisted: Record<SeriesKey, Color>;\n}\n\n/** @internal */\nexport type ChartId = string;\n\n/** @internal */\nexport interface GlobalChartState {\n  /**\n   * a unique ID for each chart used by re-reselect to memoize selector per chart\n   */\n  chartId: ChartId;\n  /**\n   * Chart title\n   */\n  title?: string;\n  /**\n   * Chart description\n   */\n  description?: string;\n  /**\n   * The Z-Index of the chart component\n   */\n  zIndex: number;\n  /**\n   * true when all all the specs are parsed ad stored into the specs object\n   */\n  specsInitialized: boolean;\n  specParsing: boolean;\n  /**\n   * true if the chart is rendered on dom\n   */\n  chartRendered: boolean;\n  /**\n   * incremental count of the chart rendering\n   */\n  chartRenderedCount: number;\n  /**\n   * the map of parsed specs\n   */\n  specs: SpecList;\n  /**\n   * the chart type depending on the used specs\n   */\n  chartType: ChartType | null;\n  /**\n   * a chart-type-dependant class that is used to render and share chart-type dependant functions\n   */\n  internalChartState: InternalChartState | null;\n  /**\n   * the dimensions of the parent container, including the legend\n   */\n  parentDimensions: Dimensions;\n  /**\n   * the state of the interactions\n   */\n  interactions: InteractionsState;\n  /**\n   * external event state\n   */\n  externalEvents: ExternalEventsState;\n  /**\n   * Color map used to persist color picker changes\n   */\n  colors: ColorOverrides;\n}\n\n/** @internal */\nexport const getInitialState = (chartId: string, title?: string, description?: string): GlobalChartState => ({\n  chartId,\n  title,\n  description,\n  zIndex: 0,\n  specsInitialized: false,\n  specParsing: false,\n  chartRendered: false,\n  chartRenderedCount: 0,\n  specs: {\n    [DEFAULT_SETTINGS_SPEC.id]: DEFAULT_SETTINGS_SPEC,\n  },\n  colors: {\n    temporary: {},\n    persisted: {},\n  },\n  chartType: null,\n  internalChartState: null,\n  interactions: {\n    pointer: getInitialPointerState(),\n    highlightedLegendPath: [],\n    deselectedDataSeries: [],\n    hoveredDOMElement: null,\n    drilldown: [],\n    prevDrilldown: [],\n    tooltip: getInitialTooltipState(),\n  },\n  externalEvents: {\n    pointer: null,\n  },\n  parentDimensions: {\n    height: 0,\n    width: 0,\n    left: 0,\n    top: 0,\n  },\n});\n\n/** @internal */\nexport const chartStoreReducer = (chartId: string, title?: string, description?: string) => {\n  // redux types controls state as first parameter\n  // eslint-disable-next-line @typescript-eslint/default-param-last\n  return (state = getInitialState(chartId, title, description), action: StateActions): GlobalChartState => {\n    switch (action.type) {\n      case Z_INDEX_EVENT:\n        return {\n          ...state,\n          zIndex: action.zIndex,\n        };\n      case SPEC_PARSED:\n        const chartType = chartTypeFromSpecs(state.specs);\n        return {\n          ...state,\n          specsInitialized: true,\n          specParsing: false,\n          chartType,\n          internalChartState: state.chartType === chartType ? state.internalChartState : newInternalState(chartType),\n        };\n      case SPEC_UNMOUNTED:\n        return {\n          ...state,\n          specsInitialized: false,\n          chartRendered: false,\n        };\n      case UPSERT_SPEC:\n        return {\n          ...state,\n          specsInitialized: false,\n          chartRendered: false,\n          specParsing: true,\n          specs: state.specParsing\n            ? { ...state.specs, [action.spec.id]: action.spec }\n            : { [DEFAULT_SETTINGS_SPEC.id]: DEFAULT_SETTINGS_SPEC, [action.spec.id]: action.spec },\n        };\n      case REMOVE_SPEC:\n        const { [action.id]: specToRemove, ...rest } = state.specs;\n        return {\n          ...state,\n          specsInitialized: false,\n          chartRendered: false,\n          specParsing: false,\n          specs: {\n            ...rest,\n          },\n        };\n      case CHART_RENDERED:\n        const chartRenderedCount = state.chartRendered ? state.chartRenderedCount : state.chartRenderedCount + 1;\n        return {\n          ...state,\n          chartRendered: true,\n          chartRenderedCount,\n        };\n      case UPDATE_PARENT_DIMENSION:\n        return {\n          ...state,\n          interactions: {\n            ...state.interactions,\n            prevDrilldown: state.interactions.drilldown,\n            tooltip: getInitialTooltipState(),\n            pointer: {\n              ...state.interactions.pointer,\n              pinned: null,\n            },\n          },\n          parentDimensions: {\n            ...action.dimensions,\n          },\n          chartRendered: false,\n        };\n      case UPDATE_CHART_TITLES:\n        return {\n          ...state,\n          title: action.title,\n          description: action.description,\n        };\n      case EXTERNAL_POINTER_EVENT:\n        // discard events from self if any\n        return {\n          ...state,\n          externalEvents: {\n            ...state.externalEvents,\n            pointer: action.event.chartId === chartId ? null : action.event,\n          },\n          // clear pinned states when syncing external cursors\n          ...(action.event.chartId !== chartId && {\n            interactions: {\n              ...state.interactions,\n              pointer: getInitialPointerState(),\n              tooltip: getInitialTooltipState(),\n            },\n          }),\n        };\n      case CLEAR_TEMPORARY_COLORS:\n        return {\n          ...state,\n          colors: {\n            ...state.colors,\n            temporary: {},\n          },\n        };\n      case SET_TEMPORARY_COLOR:\n        return {\n          ...state,\n          colors: {\n            ...state.colors,\n            temporary: {\n              ...state.colors.temporary,\n              ...action.keys.reduce<Record<string, Color | null>>((acc, curr) => {\n                acc[curr] = action.color;\n                return acc;\n              }, {}),\n            },\n          },\n        };\n      case SET_PERSISTED_COLOR:\n        const persisted = action.keys.reduce<Record<string, Color>>((acc, curr) => {\n          if (action.color) {\n            acc[curr] = action.color;\n          } else {\n            delete acc[curr];\n          }\n          return acc;\n        }, state.colors.persisted);\n\n        return {\n          ...state,\n          colors: {\n            ...state.colors,\n            persisted,\n          },\n        };\n      default:\n        return getInternalIsInitializedSelector(state) === InitStatus.Initialized\n          ? {\n              ...state,\n              interactions: interactionsReducer(state, action, getLegendItemsSelector(state)),\n            }\n          : state;\n    }\n  };\n};\n\nfunction chartTypeFromSpecs(specs: SpecList): ChartType | null {\n  const nonGlobalTypes = Object.values(specs)\n    .map((s) => s.chartType)\n    .filter((type) => type !== ChartType.Global)\n    .filter(keepDistinct);\n  if (!nonGlobalTypes[0]) {\n    Logger.warn(`${nonGlobalTypes.length === 0 ? 'Zero' : 'Multiple'} chart types in the same configuration`);\n    return null;\n  }\n  return nonGlobalTypes[0];\n}\n\nconst constructors: Record<ChartType, () => InternalChartState | null> = {\n  [ChartType.Goal]: () => new GoalState(),\n  [ChartType.Partition]: () => new PartitionState(),\n  [ChartType.Flame]: () => new FlameState(),\n  [ChartType.Timeslip]: () => new TimeslipState(),\n  [ChartType.XYAxis]: () => new XYAxisChartState(),\n  [ChartType.Heatmap]: () => new HeatmapState(),\n  [ChartType.Wordcloud]: () => new WordcloudState(),\n  [ChartType.Metric]: () => new MetricState(),\n  [ChartType.Bullet]: () => new BulletState(),\n  [ChartType.Global]: () => null,\n}; // with no default, TS signals if a new chart type isn't added here too\n\nfunction newInternalState(chartType: ChartType | null): InternalChartState | null {\n  return chartType ? constructors[chartType]() : null;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// eslint-disable-next-line no-restricted-imports\nimport createCachedSelector, { ICacheObject, Options } from 're-reselect';\nimport type { createSelector } from 'reselect';\n\nimport { GlobalChartState } from './chart_state';\n\n/**\n * Custom object cache\n * see https://github.com/toomuchdesign/re-reselect/tree/master/src/cache#write-your-custom-cache-object\n */\nclass CustomMapCache implements ICacheObject {\n  private cache: any = {};\n\n  set(key: string, selectorFn: () => any) {\n    this.cache[key] = selectorFn;\n  }\n\n  get(key: string) {\n    return this.cache[key];\n  }\n\n  remove(key: string) {\n    delete this.cache[key];\n  }\n\n  clear() {\n    this.cache = {};\n  }\n\n  isEmpty() {\n    return Object.keys(this.cache).length === 0;\n  }\n\n  isValidCacheKey(key: string) {\n    return typeof key === 'string';\n  }\n}\n\nclass GlobalSelectorCache {\n  private selectorCaches: CustomMapCache[] = [];\n\n  static keySelector({ chartId }: GlobalChartState) {\n    return chartId;\n  }\n\n  getNewOptions(): Options<GlobalChartState, unknown, unknown> {\n    return {\n      keySelector: GlobalSelectorCache.keySelector,\n      cacheObject: this.getCacheObject(),\n    };\n  }\n\n  removeKeyFromAll(key: string) {\n    this.selectorCaches.forEach((cache) => {\n      cache.remove(key);\n    });\n  }\n\n  private getCacheObject(): CustomMapCache {\n    const cache = new CustomMapCache();\n    this.selectorCaches.push(cache);\n\n    return cache;\n  }\n}\n\n/**\n * Global singleton to manage state of selector caches\n *\n * @internal\n */\nexport const globalSelectorCache = new GlobalSelectorCache();\n\n/**\n * Wrapper around `createCachedSelector` to provide `keySelector` and `cacheObject`\n * for all selector instances in on place. This should be used in place of `createCachedSelector`.\n *\n * The types defining `createCachedSelector` are very complex and essentially hardcoded overloads for having any\n * number of selector inputs up to about 20 with genetic types. Thus the types are extremely hard to duplciate.\n * To fix this I used the type of `createSelector` which is what is the same as that of `createCachedSelector`\n * method with the added curring for the cached options which this wrapper handles.\n *\n * @internal\n */\nexport const createCustomCachedSelector: typeof createSelector = (...args: any[]) => {\n  // @ts-ignore - forced types to simplify usage. All types align correctly\n  return createCachedSelector(...args)(globalSelectorCache.getNewOptions());\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipSpecSelector } from './../selectors/get_tooltip_spec';\nimport { ChartType } from '../../chart_types';\nimport { drilldownActive } from '../../chart_types/partition_chart/state/selectors/drilldown_active';\nimport { getPickedShapesLayerValues } from '../../chart_types/partition_chart/state/selectors/picked_shapes';\nimport { LegendItem } from '../../common/legend';\nimport { SeriesIdentifier } from '../../common/series_id';\nimport { getDelta } from '../../utils/point';\nimport { DOMElementActions, ON_DOM_ELEMENT_ENTER, ON_DOM_ELEMENT_LEAVE } from '../actions/dom_element';\nimport { KeyActions, ON_KEY_UP } from '../actions/key';\nimport {\n  LegendActions,\n  ON_LEGEND_ITEM_OUT,\n  ON_LEGEND_ITEM_OVER,\n  ON_TOGGLE_DESELECT_SERIES,\n  ToggleDeselectSeriesAction,\n} from '../actions/legend';\nimport { MouseActions, ON_MOUSE_DOWN, ON_MOUSE_UP, ON_POINTER_MOVE } from '../actions/mouse';\nimport {\n  TOGGLE_SELECTED_TOOLTIP_ITEM,\n  PIN_TOOLTIP,\n  TooltipActions,\n  SET_SELECTED_TOOLTIP_ITEMS,\n} from '../actions/tooltip';\nimport { GlobalChartState, InteractionsState } from '../chart_state';\nimport { getInternalIsTooltipVisibleSelector } from '../selectors/get_internal_is_tooltip_visible';\nimport { getInternalTooltipInfoSelector } from '../selectors/get_internal_tooltip_info';\nimport { getInitialPointerState, getInitialTooltipState } from '../utils';\n\n/**\n * The minimum number of pixel between two pointer positions to consider for dragging purposes\n */\nconst DRAG_DETECTION_PIXEL_DELTA = 4;\n\n/** @internal */\nexport function interactionsReducer(\n  globalState: GlobalChartState,\n  action: LegendActions | MouseActions | KeyActions | DOMElementActions | TooltipActions,\n  legendItems: LegendItem[],\n): InteractionsState {\n  const { interactions: state } = globalState;\n  switch (action.type) {\n    case ON_KEY_UP:\n      if (action.key === 'Escape') {\n        if (state.tooltip.pinned) {\n          return {\n            ...state,\n            pointer: getInitialPointerState(),\n            tooltip: getInitialTooltipState(),\n          };\n        }\n\n        return {\n          ...state,\n          pointer: getInitialPointerState(),\n        };\n      }\n\n      return state;\n\n    case ON_POINTER_MOVE:\n      // The dragging is enabled when the delta between down and move positions is greater than a constant.\n      // After this initial threshold, the dragging still enabled until the mouse up event\n      const dragging =\n        state.pointer.dragging ||\n        (!!state.pointer.down && getDelta(state.pointer.down.position, action.position) > DRAG_DETECTION_PIXEL_DELTA);\n      return {\n        ...state,\n        pointer: {\n          ...state.pointer,\n          dragging,\n          current: {\n            position: {\n              ...action.position,\n            },\n            time: action.time,\n          },\n        },\n      };\n\n    case ON_MOUSE_DOWN:\n      return {\n        ...state,\n        drilldown: getDrilldownData(globalState),\n        prevDrilldown: state.drilldown,\n        pointer: {\n          ...state.pointer,\n          dragging: false,\n          up: null,\n          down: {\n            position: {\n              ...action.position,\n            },\n            time: action.time,\n          },\n        },\n      };\n\n    case ON_MOUSE_UP: {\n      return {\n        ...state,\n        pointer: {\n          ...state.pointer,\n          lastDrag:\n            state.pointer.down && state.pointer.dragging\n              ? {\n                  start: {\n                    position: {\n                      ...state.pointer.down.position,\n                    },\n                    time: state.pointer.down.time,\n                  },\n                  end: {\n                    position: {\n                      ...state.pointer.current.position,\n                    },\n                    time: action.time,\n                  },\n                }\n              : null,\n          lastClick:\n            state.pointer.down && !state.pointer.dragging\n              ? {\n                  position: {\n                    ...action.position,\n                  },\n                  time: action.time,\n                }\n              : null,\n          dragging: false,\n          down: null,\n          up: {\n            position: {\n              ...action.position,\n            },\n            time: action.time,\n          },\n        },\n      };\n    }\n\n    case ON_LEGEND_ITEM_OUT:\n      return {\n        ...state,\n        highlightedLegendPath: [],\n      };\n\n    case ON_LEGEND_ITEM_OVER:\n      const { legendPath: highlightedLegendPath } = action;\n      return {\n        ...state,\n        highlightedLegendPath,\n      };\n\n    case ON_TOGGLE_DESELECT_SERIES:\n      return {\n        ...state,\n        deselectedDataSeries: toggleDeselectedDataSeries(action, state.deselectedDataSeries, legendItems),\n      };\n\n    case ON_DOM_ELEMENT_ENTER:\n      return {\n        ...state,\n        hoveredDOMElement: action.element,\n      };\n\n    case ON_DOM_ELEMENT_LEAVE:\n      return {\n        ...state,\n        hoveredDOMElement: null,\n      };\n\n    case PIN_TOOLTIP: {\n      if (!action.pinned) {\n        return {\n          ...state,\n          pointer: action.resetPointer\n            ? getInitialPointerState()\n            : {\n                ...state.pointer,\n                pinned: null,\n              },\n          tooltip: getInitialTooltipState(),\n        };\n      }\n\n      const { isPinnable, displayOnly } = getInternalIsTooltipVisibleSelector(globalState);\n\n      if (!isPinnable || displayOnly) {\n        return state;\n      }\n\n      const tooltipSpec = getTooltipSpecSelector(globalState);\n      const getSelectedValues = () => {\n        const values = getInternalTooltipInfoSelector(globalState)?.values ?? [];\n        if (globalState.chartType === ChartType.Heatmap) return values.slice(0, 1); // just use the x value\n        return values.filter((v) =>\n          // TODO find a better way to distinguish these two\n          globalState.chartType === ChartType.XYAxis ? v.isHighlighted : !v.displayOnly,\n        );\n      };\n      const selected =\n        // don't pre-populate selection when values are not actionable\n        Array.isArray(tooltipSpec.actions) && tooltipSpec.actions.length === 0 ? [] : getSelectedValues();\n\n      return {\n        ...state,\n        tooltip: {\n          ...state.tooltip,\n          pinned: true,\n          selected,\n        },\n        pointer: {\n          ...state.pointer,\n          pinned: state.pointer.current,\n        },\n      };\n    }\n\n    case TOGGLE_SELECTED_TOOLTIP_ITEM: {\n      if (!state.tooltip.pinned) return state;\n      let updatedItems = [...state.tooltip.selected];\n      if (updatedItems.includes(action.item)) {\n        updatedItems = updatedItems.filter((item) => item !== action.item);\n      } else {\n        updatedItems.push(action.item);\n      }\n\n      return {\n        ...state,\n        tooltip: {\n          ...state.tooltip,\n          selected: updatedItems,\n        },\n      };\n    }\n\n    case SET_SELECTED_TOOLTIP_ITEMS: {\n      if (!state.tooltip.pinned) return state;\n\n      return {\n        ...state,\n        tooltip: {\n          ...state.tooltip,\n          selected: action.items,\n        },\n      };\n    }\n\n    default:\n      return state;\n  }\n}\n\n/**\n * Helper functions that currently depend on chart type eg. xy or partition\n */\n\nfunction toggleDeselectedDataSeries(\n  { legendItemIds, negate }: ToggleDeselectSeriesAction,\n  deselectedDataSeries: SeriesIdentifier[],\n  legendItems: LegendItem[],\n) {\n  const actionSeriesKeys = legendItemIds.map(({ key }) => key);\n  const deselectedDataSeriesKeys = new Set(deselectedDataSeries.map(({ key }) => key));\n  const legendItemsKeys = legendItems.map(({ seriesIdentifiers }) => seriesIdentifiers);\n\n  const alreadyDeselected = actionSeriesKeys.every((key) => deselectedDataSeriesKeys.has(key));\n\n  // todo consider branch simplifications\n  if (negate) {\n    return alreadyDeselected || deselectedDataSeries.length !== legendItemsKeys.length - 1\n      ? legendItems\n          .flatMap(({ seriesIdentifiers }) => seriesIdentifiers)\n          .filter(({ key }) => !actionSeriesKeys.includes(key))\n      : legendItemIds;\n  } else {\n    return alreadyDeselected\n      ? deselectedDataSeries.filter(({ key }) => !actionSeriesKeys.includes(key))\n      : [...deselectedDataSeries, ...legendItemIds];\n  }\n}\n\nfunction getDrilldownData(globalState: GlobalChartState) {\n  if (globalState.chartType !== ChartType.Partition || !drilldownActive(globalState)) {\n    return [];\n  }\n  const layerValues = getPickedShapesLayerValues(globalState)[0];\n  return layerValues ? layerValues.at(-1)?.path.map((n) => n.value) ?? [] : [];\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getTooltipSpecSelector } from './get_tooltip_spec';\nimport { isExternalTooltipVisibleSelector } from './is_external_tooltip_visible';\nimport { ChartType } from '../../chart_types';\nimport { getTooltipInfoAndGeomsSelector } from '../../chart_types/xy_chart/state/selectors/get_tooltip_values_highlighted_geoms';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/**\n * Enables tooltip pinning only for certain chart types\n */\nconst pinnableTooltipCharts = new Set<ChartType>([\n  ChartType.XYAxis,\n  ChartType.Heatmap,\n  ChartType.Partition,\n  ChartType.Flame,\n]);\n\nconst getChartType = ({ chartType }: GlobalChartState) => chartType;\n\n/**\n * @internal\n */\nexport const isPinnableTooltip = createCustomCachedSelector(\n  [getChartType, isExternalTooltipVisibleSelector, getTooltipSpecSelector, getTooltipInfoAndGeomsSelector],\n  (\n    chartType,\n    isExternal,\n    { maxVisibleTooltipItems, maxTooltipItems, actions },\n    { tooltip, highlightedGeometries },\n  ): boolean => {\n    const isPinnableChartType = Boolean(chartType && pinnableTooltipCharts.has(chartType));\n    const actionable = actions.length > 0 || !Array.isArray(actions);\n    let hasHiddenSeries = false;\n\n    if (chartType === ChartType.XYAxis) {\n      const infoCount = tooltip.values.length;\n      const highlightCount = highlightedGeometries.length;\n      hasHiddenSeries =\n        (infoCount > highlightCount && infoCount > maxTooltipItems) || infoCount > maxVisibleTooltipItems;\n    }\n\n    return isPinnableChartType && !isExternal && (hasHiddenSeries || actionable);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { computeSmallMultipleScalesSelector } from './compute_small_multiple_scales';\nimport { getPanelSize, getPerPanelMap, PerPanelMap } from '../../common/panel_utils';\nimport { Size } from '../../utils/dimensions';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport type PanelGeoms = Array<Size & PerPanelMap>;\n\n/** @internal */\nexport const computePanelsSelectors = createCustomCachedSelector(\n  [computeSmallMultipleScalesSelector],\n  (scales): PanelGeoms => {\n    const panelSize = getPanelSize(scales);\n    return getPerPanelMap(scales, () => panelSize);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getInternalMainProjectionAreaSelector } from './get_internal_main_projection_area';\nimport { getInternalSmallMultiplesDomains } from './get_internal_sm_domains';\nimport { getSmallMultiplesSpec } from './get_small_multiples_spec';\nimport { SmallMultipleScales } from '../../common/panel_utils';\nimport { ScaleBand } from '../../scales';\nimport { RelativeBandsPadding, DEFAULT_SM_PANEL_PADDING } from '../../specs';\nimport { OrdinalDomain } from '../../utils/domain';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/**\n * Return the small multiple scales for horizontal and vertical grids\n * @internal\n */\nexport const computeSmallMultipleScalesSelector = createCustomCachedSelector(\n  [getInternalSmallMultiplesDomains, getInternalMainProjectionAreaSelector, getSmallMultiplesSpec],\n  ({ smHDomain, smVDomain }, { width, height }, smSpec): SmallMultipleScales => {\n    return {\n      horizontal: getScale(smHDomain, width, smSpec?.style?.horizontalPanelPadding),\n      vertical: getScale(smVDomain, height, smSpec?.style?.verticalPanelPadding),\n    };\n  },\n);\n\n/**\n * @internal\n */\nexport function getScale(\n  domain: OrdinalDomain,\n  maxRange: number,\n  padding: RelativeBandsPadding = DEFAULT_SM_PANEL_PADDING,\n): ScaleBand {\n  const singlePanelSmallMultiple = domain.length <= 1;\n  return new ScaleBand(domain, [0, maxRange], undefined, singlePanelSmallMultiple ? 0 : padding);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getChartIdSelector } from './get_chart_id';\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { DEFAULT_SETTINGS_SPEC } from '../../specs/constants';\nimport { SettingsSpec } from '../../specs/settings';\nimport { isDefined } from '../../utils/common';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport type A11ySettings = {\n  label?: string;\n  labelId?: string;\n  labelHeadingLevel: SettingsSpec['ariaLabelHeadingLevel'];\n  description?: string;\n  descriptionId?: string;\n  defaultSummaryId?: string;\n  tableCaption?: string;\n};\n\n/** @internal */\nexport const DEFAULT_A11Y_SETTINGS: A11ySettings = {\n  labelHeadingLevel: DEFAULT_SETTINGS_SPEC.ariaLabelHeadingLevel,\n};\n\n/** @internal */\nexport const getA11ySettingsSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector, getChartIdSelector],\n  (\n    {\n      ariaDescription,\n      ariaDescribedBy,\n      ariaLabel,\n      ariaLabelledBy,\n      ariaUseDefaultSummary,\n      ariaLabelHeadingLevel,\n      ariaTableCaption,\n    },\n    chartId,\n  ) => {\n    const defaultSummaryId = ariaUseDefaultSummary ? `${chartId}--defaultSummary` : undefined;\n    // use ariaDescribedBy if present, or create a description element if ariaDescription is present.\n    // concat also if default summary id if requested\n    const describeBy = [ariaDescribedBy ?? (ariaDescription && `${chartId}--desc`), defaultSummaryId].filter(isDefined);\n\n    return {\n      // don't render a label if a labelledBy id is provided\n      label: ariaLabelledBy ? undefined : ariaLabel,\n      // use ariaLabelledBy if present, or create an internal label if ariaLabel is present\n      labelId: ariaLabelledBy ?? (ariaLabel && `${chartId}--label`),\n      labelHeadingLevel: isValidHeadingLevel(ariaLabelHeadingLevel)\n        ? ariaLabelHeadingLevel\n        : DEFAULT_A11Y_SETTINGS.labelHeadingLevel,\n      // don't use a description if ariaDescribedBy id is provided\n      description: ariaDescribedBy ? undefined : ariaDescription,\n      // concat all the ids\n      descriptionId: describeBy.length > 0 ? describeBy.join(' ') : undefined,\n      defaultSummaryId,\n      tableCaption: ariaTableCaption,\n    };\n  },\n);\n\nfunction isValidHeadingLevel(ariaLabelHeadingLevel: SettingsSpec['ariaLabelHeadingLevel']): boolean {\n  return ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p'].includes(ariaLabelHeadingLevel);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Point } from '../../utils/point';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getActivePointerPosition = ({ interactions }: GlobalChartState): Point => {\n  return interactions.pointer.pinned?.position ?? interactions.pointer.current.position;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getLegendConfigSelector } from './get_legend_config_selector';\nimport { getLegendSizeSelector } from './get_legend_size';\nimport { LayoutDirection } from '../../utils/common';\nimport { Dimensions } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\nconst getParentDimension = (state: GlobalChartState) => state.parentDimensions;\n\n/** @internal */\nexport const getChartContainerDimensionsSelector = createCustomCachedSelector(\n  [getLegendConfigSelector, getLegendSizeSelector, getParentDimension],\n  ({ showLegend, legendPosition: { floating, direction } }, legendSize, parentDimensions): Dimensions =>\n    floating || !showLegend\n      ? parentDimensions\n      : direction === LayoutDirection.Vertical\n        ? {\n            left: 0,\n            top: 0,\n            width: parentDimensions.width - legendSize.width - legendSize.margin * 2,\n            height: parentDimensions.height,\n          }\n        : {\n            left: 0,\n            top: 0,\n            width: parentDimensions.width,\n            height: parentDimensions.height - legendSize.height - legendSize.margin * 2,\n          },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getChartIdSelector = (state: GlobalChartState) => state.chartId;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { Rotation } from '../../utils/common';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport const getChartRotationSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector],\n  (settingsSpec): Rotation => settingsSpec.rotation,\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { colorToRgba, overrideOpacity, RGBATupleToString } from '../../common/color_library_wrappers';\nimport { clamp, mergePartial } from '../../utils/common';\nimport { Logger } from '../../utils/logger';\nimport { LIGHT_THEME } from '../../utils/themes/light_theme';\nimport { PartialTheme, Theme } from '../../utils/themes/theme';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport const getChartThemeSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector],\n  (settingsSpec): Theme => getTheme(settingsSpec.baseTheme, settingsSpec.theme),\n);\n\nfunction getTheme(baseTheme?: Theme, theme?: PartialTheme | PartialTheme[]): Theme {\n  const base = baseTheme ?? LIGHT_THEME;\n\n  if (Array.isArray(theme)) {\n    const [firstTheme, ...axillaryThemes] = theme;\n    return validateTheme(mergePartial(base, firstTheme, {}, axillaryThemes));\n  }\n\n  return validateTheme(theme ? mergePartial(base, theme) : base);\n}\n\n/**\n * Validation for final theme object used throughout charts\n *\n * Note: mutates theme in place\n */\nfunction validateTheme(theme: Theme): Theme {\n  const fallbackRGBA = colorToRgba(theme.background.fallbackColor);\n  if (fallbackRGBA[3] !== 1) {\n    Logger.warn(`background.fallbackColor must be opaque, found alpha of ${fallbackRGBA[3]}. Overriding alpha to 1.`);\n    const newFallback = overrideOpacity(fallbackRGBA, 1);\n    theme.background.fallbackColor = RGBATupleToString(newFallback);\n  }\n\n  // heatmap rotation constraint:\n  theme.heatmap.xAxisLabel.rotation = clamp(theme.heatmap.xAxisLabel.rotation, 0, 90);\n\n  return theme;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState, BackwardRef } from '../chart_state';\n\ntype ChartRendererFn = (\n  containerRef: BackwardRef,\n  forwardStageRef: React.RefObject<HTMLCanvasElement>,\n) => JSX.Element | null;\n\n/** @internal */\nexport const getInternalChartRendererSelector = (state: GlobalChartState): ChartRendererFn => {\n  if (state.internalChartState) {\n    return state.internalChartState.chartRenderer;\n  }\n  return () => null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getChartTypeDescriptionSelector = (state: GlobalChartState): string => {\n  if (state.internalChartState) {\n    return state.internalChartState.getChartTypeDescription(state);\n  }\n  // need to return something so there is always a string returned\n  return 'unknown chart type';\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getChartContainerDimensionsSelector } from './get_chart_container_dimensions';\nimport { GlobalChartState } from '../chart_state';\nimport { DebugState } from '../types';\n\n/** @internal */\nexport const getDebugStateSelector = (state: GlobalChartState): DebugState => {\n  if (state.internalChartState) {\n    const { height, width } = getChartContainerDimensionsSelector(state);\n    if (height * width > 0) {\n      return state.internalChartState.getDebugState(state);\n    }\n  }\n  return {};\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getDeselectedSeriesSelector = (state: GlobalChartState) => state.interactions.deselectedDataSeries;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalBrushAreaSelector = (state: GlobalChartState): Dimensions | null => {\n  if (state.internalChartState) {\n    return state.internalChartState.getBrushArea(state);\n  }\n  return null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\n\nimport { DEFAULT_CSS_CURSOR } from '../../common/constants';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalPointerCursor = (state: GlobalChartState): CSSProperties['cursor'] => {\n  return state.internalChartState?.getPointerCursor(state) ?? DEFAULT_CSS_CURSOR;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalIsBrushingSelector = (state: GlobalChartState): boolean => {\n  if (state.internalChartState) {\n    return state.internalChartState.isBrushing(state);\n  }\n  return false;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalIsBrushingAvailableSelector = (state: GlobalChartState): boolean => {\n  if (state.internalChartState) {\n    return state.internalChartState.isBrushAvailable(state);\n  }\n  return false;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const InitStatus = Object.freeze({\n  ParentSizeInvalid: 'ParentSizeInvalid' as const,\n  SpecNotInitialized: 'SpecNotInitialized' as const,\n  MissingChartType: 'MissingChartType' as const,\n  ChartNotInitialized: 'ChartNotInitialized' as const,\n  Initialized: 'Initialized' as const,\n});\n\n/** @internal */\nexport type InitStatus = $Values<typeof InitStatus>;\n\n/** @internal */\nexport const getInternalIsInitializedSelector = (state: GlobalChartState): InitStatus => {\n  const {\n    parentDimensions: { width, height },\n    specsInitialized,\n    internalChartState,\n  } = state;\n\n  if (!specsInitialized) {\n    return InitStatus.SpecNotInitialized;\n  }\n\n  if (!internalChartState) {\n    return InitStatus.MissingChartType;\n  }\n\n  if (width <= 0 || height <= 0) {\n    return InitStatus.ParentSizeInvalid;\n  }\n\n  return internalChartState.isInitialized(state);\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState, TooltipVisibility } from '../chart_state';\n\n/** @internal */\nexport const getInternalIsTooltipVisibleSelector = (state: GlobalChartState): TooltipVisibility => {\n  if (state.internalChartState) {\n    return state.internalChartState.isTooltipVisible(state);\n  }\n  return { visible: false, isExternal: false, displayOnly: false, isPinnable: false };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalMainProjectionAreaSelector = (state: GlobalChartState): Dimensions => {\n  if (state.internalChartState) {\n    return state.internalChartState.getMainProjectionArea(state);\n  }\n  return { width: 0, height: 0, left: 0, top: 0 };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Dimensions } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalProjectionContainerAreaSelector = (state: GlobalChartState): Dimensions => {\n  if (state.internalChartState) {\n    return state.internalChartState.getProjectionContainerArea(state);\n  }\n  return { width: 0, height: 0, left: 0, top: 0 };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SmallMultiplesSeriesDomains } from '../../common/panel_utils';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalSmallMultiplesDomains = (state: GlobalChartState): SmallMultiplesSeriesDomains => {\n  if (state.internalChartState) {\n    return state.internalChartState.getSmallMultiplesDomains(state);\n  }\n  return {\n    smHDomain: [],\n    smVDomain: [],\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { AnchorPosition } from '../../components/portal/types';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalTooltipAnchorPositionSelector = (state: GlobalChartState): AnchorPosition | null => {\n  if (state.internalChartState) {\n    return state.internalChartState.getTooltipAnchor(state);\n  }\n  return null;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipInfo } from '../../components/tooltip/types';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getInternalTooltipInfoSelector = (state: GlobalChartState): TooltipInfo | undefined => {\n  if (state.internalChartState) {\n    return state.internalChartState.getTooltipInfo(state);\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport function getLastClickSelector(state: GlobalChartState) {\n  return state.interactions.pointer.lastClick;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport function getLastDragSelector(state: GlobalChartState) {\n  return state.interactions.pointer.lastDrag;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { getLegendPositionConfig } from '../../components/legend/position_style';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport const getLegendConfigSelector = createCustomCachedSelector(\n  [getSettingsSpecSelector],\n  ({\n    flatLegend,\n    legendAction,\n    legendColorPicker,\n    legendMaxDepth,\n    legendSize,\n    legendPosition,\n    legendStrategy,\n    onLegendItemClick,\n    customLegend,\n    showLegend,\n    onLegendItemMinusClick,\n    onLegendItemOut,\n    onLegendItemOver,\n    onLegendItemPlusClick,\n    showLegendExtra,\n  }) => {\n    return {\n      flatLegend,\n      legendAction,\n      legendColorPicker,\n      legendMaxDepth,\n      legendSize,\n      legendPosition: getLegendPositionConfig(legendPosition),\n      legendStrategy,\n      onLegendItemClick,\n      customLegend,\n      showLegend,\n      onLegendItemMinusClick,\n      onLegendItemOut,\n      onLegendItemOver,\n      onLegendItemPlusClick,\n      showLegendExtra,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendItem } from '../../common/legend';\nimport { GlobalChartState } from '../chart_state';\n\nconst EMPTY_LEGEND_LIST: LegendItem[] = [];\n\n/** @internal */\nexport const getLegendItemsSelector = (state: GlobalChartState): LegendItem[] => {\n  if (state.internalChartState) {\n    return state.internalChartState.getLegendItems(state);\n  }\n  return EMPTY_LEGEND_LIST;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport interface LegendItemLabel {\n  label: string;\n  depth: number;\n}\n\n/** @internal */\nexport const getLegendItemsLabelsSelector = (state: GlobalChartState): LegendItemLabel[] =>\n  state.internalChartState?.getLegendItemsLabels(state) ?? [];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegendItemExtraValues } from '../../common/legend';\nimport { SeriesKey } from '../../common/series_id';\nimport { GlobalChartState } from '../chart_state';\n\nconst EMPTY_ITEM_LIST = new Map<SeriesKey, LegendItemExtraValues>();\n\n/** @internal */\nexport const getLegendExtraValuesSelector = (state: GlobalChartState): Map<SeriesKey, LegendItemExtraValues> => {\n  if (state.internalChartState) {\n    return state.internalChartState.getLegendExtraValues(state);\n  }\n  return EMPTY_ITEM_LIST;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getChartThemeSelector } from './get_chart_theme';\nimport { getLegendConfigSelector } from './get_legend_config_selector';\nimport { getLegendItemsLabelsSelector } from './get_legend_items_labels';\nimport { DEFAULT_FONT_FAMILY } from '../../common/default_theme_attributes';\nimport { LEGEND_HIERARCHY_MARGIN } from '../../components/legend/legend_item';\nimport { LEGEND_TO_FULL_CONFIG } from '../../components/legend/position_style';\nimport { LegendPositionConfig } from '../../specs/settings';\nimport { withTextMeasure } from '../../utils/bbox/canvas_text_bbox_calculator';\nimport { isDefined, LayoutDirection, Position } from '../../utils/common';\nimport { Size } from '../../utils/dimensions';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\nconst getParentDimensionSelector = (state: GlobalChartState) => state.parentDimensions;\n\nconst SCROLL_BAR_WIDTH = 16; // ~1em\nconst MARKER_WIDTH = 16;\nconst SHARED_MARGIN = 4;\nconst VERTICAL_PADDING = 4;\nconst TOP_MARGIN = 2;\n\n/** @internal */\nexport type LegendSizing = Size & {\n  margin: number;\n  position: LegendPositionConfig;\n};\n\n/** @internal */\nexport const getLegendSizeSelector = createCustomCachedSelector(\n  [getLegendConfigSelector, getChartThemeSelector, getParentDimensionSelector, getLegendItemsLabelsSelector],\n  (legendConfig, theme, parentDimensions, labels): LegendSizing => {\n    if (!legendConfig.showLegend) {\n      return { width: 0, height: 0, margin: 0, position: LEGEND_TO_FULL_CONFIG[Position.Right] };\n    }\n\n    const bbox = withTextMeasure((textMeasure) =>\n      labels.reduce(\n        (acc, { label, depth }) => {\n          const { width, height } = textMeasure(\n            label,\n            { fontFamily: DEFAULT_FONT_FAMILY, fontVariant: 'normal', fontWeight: 400, fontStyle: 'normal' },\n            12,\n            1.5,\n          );\n          acc.width = Math.max(acc.width, width + depth * LEGEND_HIERARCHY_MARGIN);\n          acc.height = Math.max(acc.height, height);\n          return acc;\n        },\n        { width: 0, height: 0 },\n      ),\n    );\n\n    const { showLegendExtra: showLegendDisplayValue, legendPosition, legendAction } = legendConfig;\n    const {\n      legend: { verticalWidth, spacingBuffer, margin },\n    } = theme;\n\n    const actionDimension = isDefined(legendAction) ? 24 : 0; // max width plus margin\n    const legendItemWidth = MARKER_WIDTH + SHARED_MARGIN + bbox.width + (showLegendDisplayValue ? SHARED_MARGIN : 0);\n\n    if (legendPosition.direction === LayoutDirection.Vertical) {\n      const legendItemHeight = bbox.height + VERTICAL_PADDING * 2;\n      const legendHeight = legendItemHeight * labels.length + TOP_MARGIN;\n      const scrollBarDimension = legendHeight > parentDimensions.height ? SCROLL_BAR_WIDTH : 0;\n      const staticWidth = spacingBuffer + actionDimension + scrollBarDimension;\n\n      const width = Number.isFinite(legendConfig.legendSize)\n        ? Math.min(Math.max(legendConfig.legendSize, legendItemWidth * 0.3 + staticWidth), parentDimensions.width * 0.7)\n        : Math.floor(Math.min(legendItemWidth + staticWidth, verticalWidth));\n\n      return {\n        width,\n        height: legendHeight,\n        margin,\n        position: legendPosition,\n      };\n    }\n    const isSingleLine = (parentDimensions.width - 20) / 200 > labels.length;\n    const height = Number.isFinite(legendConfig.legendSize)\n      ? Math.min(legendConfig.legendSize, parentDimensions.height * 0.7)\n      : isSingleLine\n        ? bbox.height + 16\n        : bbox.height * 2 + 24;\n\n    return {\n      height,\n      width: Math.floor(Math.min(legendItemWidth + spacingBuffer + actionDimension, verticalWidth)),\n      margin,\n      position: legendPosition,\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\nimport { PointerValue } from '../types';\n\n/** @internal */\nexport const getPointerValueSelector = (state: GlobalChartState): PointerValue | undefined => {\n  // TODO: this is taken from the tooltip header currently. Should in the future\n  // be implemented separately (and probably used *as* the tooltip header).\n  const header = state.internalChartState?.getTooltipInfo(state)?.header;\n  if (header) {\n    const { value, formattedValue, valueAccessor } = header;\n    return { value, formattedValue, valueAccessor };\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getChartThemeSelector } from './get_chart_theme';\nimport { colorToRgba, RGBATupleToString } from '../../common/color_library_wrappers';\nimport { Color, Colors } from '../../common/colors';\nimport { TRANSPARENT_LIMIT } from '../../common/fill_text_color';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/**\n * @internal\n */\nexport const getResolvedBackgroundColorSelector = createCustomCachedSelector(\n  [getChartThemeSelector],\n  ({ background: { fallbackColor, color = Colors.Transparent.keyword } }): Color => {\n    let backgroundRGBA = colorToRgba(color);\n\n    if (backgroundRGBA[3] < TRANSPARENT_LIMIT) {\n      backgroundRGBA = colorToRgba(fallbackColor);\n    }\n\n    return RGBATupleToString(backgroundRGBA);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSpecs } from './get_specs';\nimport { ChartType } from '../../chart_types';\nimport { SpecType, DEFAULT_SETTINGS_SPEC } from '../../specs/constants';\nimport { SettingsSpec } from '../../specs/settings';\nimport { debounce } from '../../utils/debounce';\nimport { SpecList } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecsFromStore } from '../utils';\n\nconst DEFAULT_POINTER_UPDATE_DEBOUNCE = 16;\n\n/**\n * @internal\n */\nexport const getSettingsSpecSelector = createCustomCachedSelector([getSpecs], getSettingsSpec);\n\nfunction getSettingsSpec(specs: SpecList): SettingsSpec {\n  const settingsSpecs = getSpecsFromStore<SettingsSpec>(specs, ChartType.Global, SpecType.Settings);\n  const spec = settingsSpecs[0];\n  return spec ? handleListenerDebouncing(spec) : DEFAULT_SETTINGS_SPEC;\n}\n\nfunction handleListenerDebouncing(settings: SettingsSpec): SettingsSpec {\n  const delay = settings.pointerUpdateDebounce ?? DEFAULT_POINTER_UPDATE_DEBOUNCE;\n\n  if (settings.onPointerUpdate) settings.onPointerUpdate = debounce(settings.onPointerUpdate, delay);\n\n  return settings;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSpecs } from './get_specs';\nimport { ChartType } from '../../chart_types';\nimport { SmallMultiplesGroupBy } from '../../common/panel_utils';\nimport { SmallMultiplesSpec, SpecType, GroupBySpec } from '../../specs';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecsFromStore } from '../utils';\n\n/** @internal */\nexport const getSmallMultiplesIndexOrderSelector = createCustomCachedSelector(\n  [getSpecs],\n  (specs): SmallMultiplesGroupBy => {\n    const [smallMultiples] = getSpecsFromStore<SmallMultiplesSpec>(specs, ChartType.Global, SpecType.SmallMultiples);\n    const groupBySpecs = getSpecsFromStore<GroupBySpec>(specs, ChartType.Global, SpecType.IndexOrder);\n\n    return {\n      horizontal: groupBySpecs.find((s) => s.id === smallMultiples?.splitHorizontally),\n      vertical: groupBySpecs.find((s) => s.id === smallMultiples?.splitVertically),\n    };\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSpecs } from './get_specs';\nimport { ChartType } from '../../chart_types';\nimport { SpecType } from '../../specs/constants';\nimport { SmallMultiplesSpec } from '../../specs/small_multiples';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecsFromStore, getSpecFromStore } from '../utils';\n\n/**\n * Return the small multiple specs\n * @internal\n */\nexport const getSmallMultiplesSpecs = createCustomCachedSelector([getSpecs], (specs) =>\n  getSpecsFromStore<SmallMultiplesSpec>(specs, ChartType.Global, SpecType.SmallMultiples),\n);\n\n/**\n * Return the small multiple spec\n * @internal\n */\nexport const getSmallMultiplesSpec = createCustomCachedSelector([getSpecs], (specs) =>\n  getSpecFromStore<SmallMultiplesSpec, false>(specs, ChartType.Global, SpecType.SmallMultiples, false),\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 're-reselect';\n\nimport { GlobalChartState, SpecList } from '../chart_state';\n\n/**\n * Returns all specs for given chart\n * @internal\n */\nexport const getSpecs: Selector<GlobalChartState, SpecList> = ({ specs }) => specs;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartType } from '../../chart_types';\nimport { Spec, SpecType } from '../../specs';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecsFromStore } from '../utils';\n\n/** @internal */\nexport const getSpecsByType = <S extends Spec>(chartType: ChartType, specType: SpecType) =>\n  createCustomCachedSelector([(state: GlobalChartState) => state.specs], (specs): S[] => {\n    return getSpecsFromStore<S>(specs, chartType, specType);\n  });\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const getTooltipInteractionState = ({ interactions }: GlobalChartState) => interactions.tooltip;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipValue } from '../../specs';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\n/** @internal */\nexport const getTooltipToggledItems = (state: GlobalChartState) => state.interactions.tooltip.selected;\n\n/** @internal */\nexport const getTooltipPinned = (state: GlobalChartState) => state.interactions.tooltip.pinned;\n\n/** @internal */\nexport const getTooltipSelectedItems = createCustomCachedSelector(\n  [getTooltipToggledItems, getTooltipPinned],\n  (toggledItems, tooltipStick): TooltipValue[] => {\n    if (!tooltipStick) {\n      return [];\n    }\n    return toggledItems;\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Selector } from 're-reselect';\n\nimport { getInternalIsTooltipVisibleSelector } from './get_internal_is_tooltip_visible';\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { getTooltipSpecSelector } from './get_tooltip_spec';\nimport type { TooltipProps } from '../../specs';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\nconst getChartId: Selector<GlobalChartState, string> = ({ chartId }) => chartId;\n\n/** @internal */\nconst getTooltipSettingsSingleton = createCustomCachedSelector([getChartId], (): Record<string, never> => ({}));\n\n/** @internal */\nexport const getTooltipSettings = createCustomCachedSelector(\n  [getTooltipSettingsSingleton, getTooltipSpecSelector, getSettingsSpecSelector, getInternalIsTooltipVisibleSelector],\n  (settingsBase, tooltip, { externalPointerEvents }, { isExternal }): TooltipProps => {\n    if (!isExternal) return tooltip;\n\n    return Object.assign(settingsBase, {\n      ...tooltip,\n      ...externalPointerEvents.tooltip,\n    });\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getSpecs } from './get_specs';\nimport { ChartType } from '../../chart_types';\nimport { SpecType } from '../../specs/constants';\nimport { DEFAULT_TOOLTIP_SPEC, TooltipSpec } from '../../specs/tooltip';\nimport { createCustomCachedSelector } from '../create_selector';\nimport { getSpecFromStore } from '../utils';\n\n/**\n * @internal\n */\nexport const getTooltipSpecSelector = createCustomCachedSelector([getSpecs], (specs): TooltipSpec => {\n  const tooltipSpec = getSpecFromStore<TooltipSpec, false>(specs, ChartType.Global, SpecType.Tooltip, false);\n  return tooltipSpec ?? DEFAULT_TOOLTIP_SPEC;\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PointerEventType } from '../../specs';\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const hasExternalEventSelector = ({ externalEvents: { pointer } }: GlobalChartState) =>\n  pointer !== null && pointer.type !== PointerEventType.Out;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const isBrushingSelector = (state: GlobalChartState): boolean => {\n  return state.interactions.pointer.dragging;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { GlobalChartState } from '../chart_state';\n\n/** @internal */\nexport const isInternalChartEmptySelector = (state: GlobalChartState): boolean | undefined => {\n  if (state.internalChartState) {\n    return state.internalChartState.isChartEmpty(state);\n  }\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { getInternalMainProjectionAreaSelector } from './get_internal_main_projection_area';\nimport { getSettingsSpecSelector } from './get_settings_spec';\nimport { hasExternalEventSelector } from './has_external_pointer_event';\nimport { getComputedScalesSelector } from '../../chart_types/xy_chart/state/selectors/get_computed_scales';\nimport { PointerEventType } from '../../specs';\nimport { isNil } from '../../utils/common';\nimport { GlobalChartState } from '../chart_state';\nimport { createCustomCachedSelector } from '../create_selector';\n\nconst getExternalEventPointer = ({ externalEvents: { pointer } }: GlobalChartState) => pointer;\n\n/** @internal */\nexport const isExternalTooltipVisibleSelector = createCustomCachedSelector(\n  [\n    getSettingsSpecSelector,\n    hasExternalEventSelector,\n    getExternalEventPointer,\n    getComputedScalesSelector,\n    getInternalMainProjectionAreaSelector,\n  ],\n  ({ externalPointerEvents }, hasExternalEvent, pointer, { xScale }, chartDimensions): boolean => {\n    if (\n      !pointer ||\n      pointer.type !== PointerEventType.Over ||\n      isNil(pointer.x) ||\n      externalPointerEvents.tooltip?.visible === false\n    ) {\n      return false;\n    }\n    const x = xScale.pureScale(pointer.x);\n\n    if (Number.isNaN(x) || x > chartDimensions.width + chartDimensions.left || x < 0) {\n      return false;\n    }\n    return Boolean(hasExternalEvent && externalPointerEvents.tooltip?.visible);\n  },\n);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { FC, useEffect, useMemo } from 'react';\nimport { useDispatch } from 'react-redux';\nimport { bindActionCreators } from 'redux';\nimport { OptionalKeys, RequiredKeys } from 'utility-types';\n\nimport { upsertSpec as upsertSpecAction, removeSpec as removeSpecAction } from './actions/specs';\nimport { Spec as Spec } from '../specs';\nimport { stripUndefined } from '../utils/common';\n\n/** @internal */\nexport interface DispatchProps {\n  upsertSpec: typeof upsertSpecAction;\n  removeSpec: typeof removeSpecAction;\n}\n\n/**\n * Used inside custom spec component to link component to state as new spec\n * @internal\n */\nexport function useSpecFactory<Props extends Spec>(props: Props) {\n  const dispatch = useDispatch();\n  const { upsertSpec, removeSpec } = useMemo(\n    () => ({\n      upsertSpec: bindActionCreators(upsertSpecAction, dispatch),\n      removeSpec: bindActionCreators(removeSpecAction, dispatch),\n    }),\n    [dispatch],\n  );\n\n  useEffect(() => {\n    upsertSpec(props);\n  });\n  useEffect(\n    () => () => {\n      removeSpec(props.id);\n    },\n    [], // eslint-disable-line react-hooks/exhaustive-deps\n  );\n}\n\n/**\n * Creates spec component factory given overrides and default props.\n *\n * To use this you must pass the Spec type via empty function call...\n *\n * ```ts\n * const MyThing = specComponentFactory<MyThingSpec>()(overrides, defaults)\n * ```\n *\n * > IMPORTANT: Both `overrides` and `defaults` should __NOT__ have explicit types.\n * > The types are determined automatically from thier implicitly defined types, while still\n * > enforing that the types are derived from the defined `Spec`.\n * @internal\n */\nexport const specComponentFactory =\n  <S extends Spec>() =>\n  <\n    Overrides extends SFOverrideKeys<S>,\n    Defaults extends SFDefaultKeys<S, Overrides>,\n    Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n    Requires extends SFRequiredKeys<S, Overrides, Defaults, Optionals>,\n  >(\n    overrides: SFOverrides<S, Overrides>,\n    defaults: SFDefaults<S, Overrides, Defaults>,\n  ): FC<SFProps<S, Overrides, Defaults, Optionals, Requires>> => {\n    return (props) => {\n      // @ts-ignore - All Spec keys are guaranteed to be included\n      useSpecFactory<S>({ ...defaults, ...stripUndefined(props), ...overrides });\n      return null;\n    };\n  };\n\n/**\n * Takes in prop overrides and defaults with enforced types.\n * Determines implicit types of optional and required props.\n *\n * To use this you must pass the Spec type via empty function call...\n *\n * ```ts\n * const MyThingBuildProps = buildSFProps<MyThingSpec>()(overrides, defaults)\n * ```\n *\n * > IMPORTANT: Both `overrides` and `defaults` should __NOT__ have explicit types.\n * > The types are determined automatically from thier implicitly defined types, while still\n * > enforing that the types are derived from the defined `Spec`.\n * @internal\n */\nexport const buildSFProps =\n  <S extends Spec>() =>\n  <\n    Overrides extends SFOverrideKeys<S>,\n    Defaults extends SFDefaultKeys<S, Overrides>,\n    Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n    Requires extends SFRequiredKeys<S, Overrides, Defaults, Optionals>,\n  >(\n    overrides: SFOverrides<S, Overrides>,\n    defaults: SFDefaults<S, Overrides, Defaults>,\n  ): BuildProps<S, Overrides, Defaults, Optionals, Requires> => ({\n    overrides,\n    defaults,\n    optionals: {} as Pick<S, Optionals>, // used to transfer type only\n    requires: {} as Pick<S, Requires>, // used to transfer type only\n  });\n\n/*\n------------------------------------------------------------\n  Reused types to maintain single source of truth\n------------------------------------------------------------\n*/\n\n/**\n * Resulting props for spec given overrides, defaults, optionals and required props\n * @public\n */\nexport type SFProps<\n  S extends Spec,\n  Overrides extends SFOverrideKeys<S>,\n  Defaults extends SFDefaultKeys<S, Overrides>,\n  Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n  Requires extends SFRequiredKeys<S, Overrides, Defaults, Optionals>,\n> = Pick<S, Optionals | Requires> & Partial<Pick<S, Defaults>>;\n\n/** @public */\nexport interface BuildProps<\n  S extends Spec,\n  Overrides extends SFOverrideKeys<S>,\n  Defaults extends SFDefaultKeys<S, Overrides>,\n  Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n  Requires extends SFRequiredKeys<S, Overrides, Defaults, Optionals>,\n> {\n  overrides: SFOverrides<S, Overrides>;\n  defaults: SFDefaults<S, Overrides, Defaults>;\n  /** @deprecated - ignore - used only as type do not use as value */\n  optionals: Pick<S, Optionals>;\n  /** @deprecated - ignore - used only as type do not use as value */\n  requires: Pick<S, Requires>;\n}\n\n/** All specs __must__ provide these as overrides */\ntype RequiredSpecProps = keyof Pick<Spec, 'chartType' | 'specType'>;\n\n/* Types defining keys */\ntype SFOverrideKeys<S extends Spec> = keyof S;\ntype SFDefaultKeys<S extends Spec, Overrides extends keyof S> = keyof Omit<S, Overrides>;\ntype SFOptionalKeys<\n  S extends Spec,\n  Overrides extends keyof S,\n  Defaults extends keyof Omit<S, Overrides>,\n> = OptionalKeys<Omit<S, Overrides | Defaults>>;\ntype SFRequiredKeys<\n  S extends Spec,\n  Overrides extends keyof S,\n  Defaults extends keyof Omit<S, Overrides>,\n  Optionals extends SFOptionalKeys<S, Overrides, Defaults>,\n> = RequiredKeys<Omit<S, Overrides | Defaults | Optionals>>;\n\n/* Object types defined from key types above */\ntype SFOverrides<S extends Spec, Overrides extends keyof S> = Required<Pick<S, Overrides | RequiredSpecProps>>;\ntype SFDefaults<\n  S extends Spec,\n  Overrides extends SFOverrideKeys<S>,\n  Defaults extends SFDefaultKeys<S, Overrides>,\n> = Required<Pick<S, Defaults>>;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport type { Cell } from '../chart_types/heatmap/layout/types/viewmodel_types';\nimport { Pixels } from '../common/geometry';\nimport { AnnotationType, BaseDatum, BulletSubtype, LineAnnotationDatum, RectAnnotationDatum } from '../specs';\nimport { Accessor } from '../utils/accessor';\nimport type { Datum, Position } from '../utils/common';\nimport { GenericDomain } from '../utils/domain';\nimport type { GeometryValue } from '../utils/geometry';\nimport { LineAnnotationStyle, RectAnnotationStyle } from '../utils/themes/theme';\n\n/** @public */\nexport interface DebugStateAxis {\n  id: string;\n  position: Position;\n  title?: string;\n  labels: string[];\n  values: any[];\n  gridlines: {\n    y: number;\n    x: number;\n  }[];\n}\n\n/** @public */\nexport interface DebugStateAxes {\n  x: DebugStateAxis[];\n  y: DebugStateAxis[];\n}\n\n/** @public */\nexport interface DebugStateLegendItem {\n  key: string;\n  name: string;\n  color: string;\n}\n\n/** @public */\nexport interface DebugStateLegend {\n  items: DebugStateLegendItem[];\n}\n\n/** @public */\nexport interface DebugStateBase {\n  key: string;\n  name: string;\n  color: string;\n}\n\n/** @public */\nexport type DebugStateValue = Pick<GeometryValue, 'x' | 'y' | 'mark'>;\n\n/**@public */\nexport interface DebugStateLineConfig {\n  visible: boolean;\n  path: string;\n  points: DebugStateValue[];\n  visiblePoints: boolean;\n}\n\n/** @public */\nexport interface DebugStateLine extends DebugStateBase, DebugStateLineConfig {}\n\n/** @public */\nexport type DebugStateArea = Omit<DebugStateLine, 'points' | 'visiblePoints'> & {\n  path: string;\n  lines: {\n    y0?: DebugStateLineConfig;\n    y1: DebugStateLineConfig;\n  };\n};\n\n/** @public */\nexport type DebugStateBar = DebugStateBase & {\n  visible: boolean;\n  bars: DebugStateValue[];\n  labels: any[];\n};\n\ntype CellDebug = Pick<Cell, 'value' | 'formatted' | 'x' | 'y' | 'datum'> & { fill: string };\n\ntype HeatmapDebugState = {\n  cells: CellDebug[];\n  selection: {\n    area: { x: number; y: number; width: number; height: number } | null;\n    data: { x: Array<string | number>; y: Array<string | number> } | null;\n  };\n};\n\n/** @public */\nexport type SinglePartitionDebugState = {\n  name: string;\n  depth: number;\n  color: string;\n  value: number;\n  coords: [Pixels, Pixels];\n};\n\n/** @public */\nexport type PartitionDebugState = {\n  panelTitle: string;\n  partitions: Array<SinglePartitionDebugState>;\n};\n\n/** @public */\nexport type DebugStateAnnotations = {\n  id: string;\n  style: RectAnnotationStyle | LineAnnotationStyle;\n  type: typeof AnnotationType.Line | typeof AnnotationType.Rectangle;\n  domainType?: 'xDomain' | 'yDomain';\n  data: LineAnnotationDatum | RectAnnotationDatum;\n};\n\n/** @public */\nexport interface BulletDebugStateRow {\n  subtype: BulletSubtype;\n  target?: number;\n  value: number;\n  title: string;\n  subtitle?: string;\n  colorBands: string[];\n  ticks: number[];\n  domain: GenericDomain;\n}\n\n/** @public */\nexport interface BulletDebugState {\n  rows: (BulletDebugStateRow | null)[][];\n  activeValue?: number;\n}\n\n/**\n * Describes _visible_ chart state for use in functional tests\n *\n * TODO: add other chart types to debug state\n * @public\n */\nexport interface DebugState {\n  legend?: DebugStateLegend;\n  axes?: DebugStateAxes;\n  areas?: DebugStateArea[];\n  lines?: DebugStateLine[];\n  bars?: DebugStateBar[];\n  annotations?: DebugStateAnnotations[];\n  heatmap?: HeatmapDebugState;\n  partition?: PartitionDebugState[];\n  bullet?: BulletDebugState;\n}\n\n/**\n * Contains the value of the non-dependent variable at the point where the mouse\n * pointer is.\n *\n * @public\n */\nexport interface PointerValue<D extends BaseDatum = Datum> {\n  /**\n   * The value\n   */\n  value: any;\n  /**\n   * The formatted value to display\n   */\n  formattedValue: string;\n  /**\n   * The accessor linked to the current tooltip value\n   */\n  valueAccessor?: Accessor<D>;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { PointerState, PointerStates, SpecList, TooltipInteractionState } from './chart_state';\nimport { ChartType } from '../chart_types';\nimport { Spec } from '../specs';\n\n/**\n * Returns all matching specs\n * @internal\n */\nexport function getSpecsFromStore<U extends Spec>(specs: SpecList, chartType: ChartType, specType: string): U[] {\n  return Object.values(specs).filter((spec) => spec.chartType === chartType && spec.specType === specType) as U[];\n}\n\n/**\n * Returns first matching spec\n * @internal\n * TODO: Make these generator types automatic\n */\nexport function getSpecFromStore<U extends Spec, R extends boolean, RR = R extends true ? never : null>(\n  specs: SpecList,\n  chartType: ChartType,\n  specType: string,\n  required: R,\n): U | RR {\n  const spec = Object.values(specs).find((spec) => spec.chartType === chartType && spec.specType === specType) as U;\n\n  if (!spec && required) throw new Error(`Unable to find spec [${chartType} = ${specType}]`);\n\n  return spec ?? null;\n}\n\n/** @internal */\nexport function isClicking(prevClick: PointerState | null, lastClick: PointerState | null) {\n  return lastClick && (!prevClick || prevClick.time !== lastClick.time);\n}\n\n/** @internal */\nexport const getInitialPointerState = (): PointerStates => ({\n  dragging: false,\n  current: { position: { x: -1, y: -1 }, time: 0 },\n  pinned: null,\n  down: null,\n  up: null,\n  lastDrag: null,\n  lastClick: null,\n});\n\n/** @internal */\nexport const getInitialTooltipState = (): TooltipInteractionState => ({\n  pinned: false,\n  selected: [],\n});\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { BaseDatum } from '../chart_types/specs';\n\n/**\n * Accessor function\n * @param datum - the datum\n * @public\n */\nexport interface UnaryAccessorFn<D extends BaseDatum = any, Return = any> {\n  /**\n   * Name used as accessor field name in place of function reference\n   */\n  fieldName?: string;\n  (datum: D): Return;\n}\n\n/**\n * Accessor function\n * @param datum - the datum\n * @param index - the index in the array\n * @public\n */\nexport type BinaryAccessorFn<D extends BaseDatum = any, Return = any> = (datum: D, index: number) => Return;\n\n/**\n * An accessor function\n * @public\n */\nexport type AccessorFn<D extends BaseDatum = any, Return = any> = UnaryAccessorFn<D, Return>;\n\n/**\n * An indexed accessor function\n * @public\n */\nexport type IndexedAccessorFn<D extends BaseDatum = any, Return = any> =\n  | UnaryAccessorFn<D, Return>\n  | BinaryAccessorFn<D, Return>;\n\n/**\n * A key accessor string\n * @public\n */\nexport type AccessorObjectKey = string;\n\n/**\n * An index accessor number\n * @public\n */\nexport type AccessorArrayIndex = number;\n\n/**\n * Need to check for array to exclude array prototype keys.\n *\n * TODO: tighten keyof types by removing string fallback. This will make it harder to satisfy the\n * types for complex data values.\n *\n * Note: ignores symbols as keys\n * @public\n */\nexport type DatumKey<D extends BaseDatum> = D extends any[] ? number : Exclude<keyof D, symbol> | string;\n\n/**\n * A datum accessor in form of object key accessor string/number\n * @public\n */\nexport type Accessor<D extends BaseDatum = never> = DatumKey<D> | AccessorObjectKey | AccessorArrayIndex;\n\n/**\n * Accessor format for _banded_ series as postfix string or accessor function\n * @public\n */\nexport type AccessorFormat = string | ((value: string) => string);\n\n/**\n * Return an accessor function using the accessor passed as argument\n * @param accessor the spec accessor\n * @internal\n */\nexport function getAccessorFn<D extends BaseDatum>(accessor: Accessor<D>): AccessorFn<D> {\n  return (datum: D) =>\n    typeof datum === 'object' && datum !== null ? datum[accessor as keyof typeof datum] : undefined;\n}\n\n/**\n * Return the accessor label given as `AccessorFormat`\n * @internal\n */\nexport function getAccessorFormatLabel(accessor: AccessorFormat, label: string): string {\n  if (typeof accessor === 'string') {\n    return `${label}${accessor}`;\n  }\n\n  return accessor(label);\n}\n\n/**\n * Helper function to get accessor value from string, number or function\n * @internal\n */\nexport function getAccessorValue<D extends BaseDatum>(datum: D, accessor: Accessor<D> | AccessorFn<D>) {\n  if (typeof accessor === 'function') {\n    return accessor(datum);\n  }\n\n  try {\n    // @ts-ignore - could throw error if not proper key accessed\n    return datum[accessor];\n  } catch {\n    return undefined;\n  }\n}\n\n/**\n * Additive numbers: numbers whose semantics are conducive to addition; eg. counts and sums are additive, but averages aren't\n * @public\n */\nexport type AdditiveNumber = number;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { cssFontShorthand, Font } from '../../common/text_utils';\nimport { withContext } from '../../renderers/canvas';\nimport { Size } from '../dimensions';\n\n/** @internal */\nexport const withTextMeasure = <T>(fun: (textMeasure: TextMeasure) => T) => {\n  const canvas = document.createElement('canvas');\n  const ctx = canvas.getContext('2d');\n  return fun(ctx ? measureText(ctx) : () => ({ width: 0, height: 0 }));\n};\n\n/** @internal */\nexport type TextMeasure = (text: string, font: Omit<Font, 'textColor'>, fontSize: number, lineHeight?: number) => Size;\n\n/** @internal */\nexport function measureText(ctx: CanvasRenderingContext2D): TextMeasure {\n  return (text, font, fontSize, lineHeight = 1) =>\n    withContext(ctx, (ctx): Size => {\n      if (text.length === 0) {\n        // TODO this is a temporary fix to make the multilayer time axis work\n        return { width: 0, height: fontSize * lineHeight };\n      }\n      ctx.font = cssFontShorthand(font, fontSize);\n      const { width } = ctx.measureText(text);\n      return { width, height: fontSize * lineHeight };\n    });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @public */\nexport type ChartSizeArray = [number | string | undefined, number | string | undefined];\n/** @public */\nexport interface ChartSizeObject {\n  width?: number | string;\n  height?: number | string;\n}\n\n/** @public */\nexport type ChartSize = number | string | ChartSizeArray | ChartSizeObject;\n\n/** @internal */\nexport function getChartSize(size?: ChartSize): Required<ChartSizeObject> {\n  if (Array.isArray(size)) {\n    return {\n      width: size[0] === undefined ? '100%' : size[0],\n      height: size[1] === undefined ? '100%' : size[1],\n    };\n  }\n  if (typeof size === 'object') {\n    return {\n      width: size.width === undefined ? '100%' : size.width,\n      height: size.height === undefined ? '100%' : size.height,\n    };\n  }\n  const sameSize = size === undefined ? '100%' : size;\n  return {\n    width: sameSize,\n    height: sameSize,\n  };\n}\n\n/**\n * Return the requested size if specified in pixel, null otherwise\n * @internal\n */\nexport function getFixedChartSize(size?: ChartSize): { width: number; height: number } | null {\n  const { width, height } = getChartSize(size);\n  return typeof height === 'number' && typeof width === 'number' ? { width, height } : null;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// NOTE: to switch implementation just change the imported file (moment,luxon)\nimport {\n  addTimeToObj,\n  timeObjToUnixTimestamp,\n  startTimeOfObj,\n  endTimeOfObj,\n  timeObjFromAny,\n  timeObjToUTCOffset,\n  subtractTimeToObj,\n  formatTimeObj,\n  diffTimeObjs,\n} from './moment';\nimport { CalendarIntervalUnit, DateTime, FixedIntervalUnit, Minutes, UnixTimestamp } from './types';\n\n/** @internal */\nexport function addTime(\n  dateTime: DateTime,\n  timeZone: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n  count: number,\n): UnixTimestamp {\n  return timeObjToUnixTimestamp(addTimeToObj(getTimeObj(dateTime, timeZone), unit, count));\n}\n\n/** @internal */\nexport function subtractTime(\n  dateTime: DateTime,\n  timeZone: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n  count: number,\n): UnixTimestamp {\n  return timeObjToUnixTimestamp(subtractTimeToObj(getTimeObj(dateTime, timeZone), unit, count));\n}\n\n/** @internal */\nexport function getUnixTimestamp(dateTime: DateTime, timeZone?: string): UnixTimestamp {\n  return timeObjToUnixTimestamp(getTimeObj(dateTime, timeZone));\n}\n\n/** @internal */\nexport function startOf(\n  dateTime: DateTime,\n  timeZone: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n): UnixTimestamp {\n  return timeObjToUnixTimestamp(startTimeOfObj(getTimeObj(dateTime, timeZone), unit));\n}\n\n/** @internal */\nexport function endOf(\n  dateTime: DateTime,\n  timeZone: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n): UnixTimestamp {\n  return timeObjToUnixTimestamp(endTimeOfObj(getTimeObj(dateTime, timeZone), unit));\n}\n\nfunction getTimeObj(dateTime: DateTime, timeZone?: string) {\n  return timeObjFromAny(dateTime, timeZone);\n}\n\n/** @internal */\nexport function getUTCOffset(dateTime: DateTime, timeZone?: string): Minutes {\n  return timeObjToUTCOffset(getTimeObj(dateTime, timeZone));\n}\n\n/** @internal */\nexport function formatTime(dateTime: DateTime, timeZone: string | undefined, format: string) {\n  return formatTimeObj(getTimeObj(dateTime, timeZone), format);\n}\n\n/** @internal */\nexport function diff(\n  dateTime1: DateTime,\n  timeZone1: string | undefined,\n  dateTime2: DateTime,\n  timeZone2: string | undefined,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n) {\n  return diffTimeObjs(getTimeObj(dateTime1, timeZone1), getTimeObj(dateTime2, timeZone2), unit);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { addTime, endOf, getUnixTimestamp, getUTCOffset, startOf } from './chrono';\nimport { CalendarIntervalUnit, FixedIntervalUnit, UnixTimestamp } from './types';\nimport { TimeMs } from '../../common/geometry';\n\n/**\n * An [Elasticsearch Calendar interval unit](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#calendar_intervals)\n * @public\n */\nexport type ESCalendarIntervalUnit =\n  | 'minute'\n  | 'm'\n  | 'hour'\n  | 'h'\n  | 'day'\n  | 'd'\n  | 'week'\n  | 'w'\n  | 'month'\n  | 'M'\n  | 'quarter'\n  | 'q'\n  | 'year'\n  | 'y';\n\n/**\n * An [Elasticsearch fixed interval unit](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#fixed_intervals)\n * @public\n */\nexport type ESFixedIntervalUnit = 'ms' | 's' | 'm' | 'h' | 'd';\n\n/** @internal */\nexport const ES_FIXED_INTERVAL_UNIT_TO_BASE: Record<ESFixedIntervalUnit, TimeMs> = {\n  ms: 1,\n  s: 1000,\n  m: 1000 * 60,\n  h: 1000 * 60 * 60,\n  d: 1000 * 60 * 60 * 24,\n};\n\n/**\n * The definition of an [Elasticsearch Calendar interval](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#calendar_intervals)\n * @public\n */\nexport interface ESCalendarInterval {\n  type: 'calendar';\n  unit: ESCalendarIntervalUnit;\n  value: number;\n}\n\n/**\n * The definition of an [Elasticsearch fixed interval](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#fixed_intervals)\n * @public\n */\nexport interface ESFixedInterval {\n  type: 'fixed';\n  unit: ESFixedIntervalUnit;\n  value: number;\n}\n\nconst esCalendarIntervalToChronoInterval: Record<ESCalendarIntervalUnit, CalendarIntervalUnit | FixedIntervalUnit> = {\n  minute: 'minute',\n  m: 'minute',\n  hour: 'hour',\n  h: 'hour',\n  day: 'day',\n  d: 'day',\n  week: 'week',\n  w: 'week',\n  month: 'month',\n  M: 'month',\n  quarter: 'quarter',\n  q: 'quarter',\n  year: 'year',\n  y: 'year',\n};\n\n/**\n * Round a Date or unix timestamp to the beginning or end of the corresponding Elasticsearch date histogram bucket.\n * It uses the [date histogram aggregation Elasticsearch formula](https://www.elastic.co/guide/en/elasticsearch/reference/current/search-aggregations-bucket-datehistogram-aggregation.html#datehistogram-aggregation-time-zone)\n * to compute the fixed interval bucket, and it uses an internal selected date/time library to compute the calendar one.\n *\n * @param date - a unix timestamp or a Date object\n * @param interval - the description of the Elasticsearch interval you want to round to\n * @param snapTo - if you want to snap the date at the `start` or at the `end` of the interval\n * @param timeZone - a IANA timezone\n * @public\n */\nexport function roundDateToESInterval(\n  date: UnixTimestamp | Date,\n  interval: ESCalendarInterval | ESFixedInterval,\n  snapTo: 'start' | 'end',\n  timeZone: string,\n): UnixTimestamp {\n  return isCalendarInterval(interval)\n    ? esCalendarIntervalSnap(date, interval, snapTo, timeZone)\n    : esFixedIntervalSnap(date, interval, snapTo, timeZone);\n}\n\nfunction isCalendarInterval(interval: ESCalendarInterval | ESFixedInterval): interval is ESCalendarInterval {\n  return interval.type === 'calendar';\n}\n\nfunction esCalendarIntervalSnap(\n  date: number | Date,\n  interval: ESCalendarInterval,\n  snapTo: 'start' | 'end',\n  timeZone?: string,\n) {\n  return snapTo === 'start'\n    ? startOf(date, timeZone, esCalendarIntervalToChronoInterval[interval.unit])\n    : endOf(date, timeZone, esCalendarIntervalToChronoInterval[interval.unit]);\n}\n\nfunction esFixedIntervalSnap(\n  date: number | Date,\n  interval: ESFixedInterval,\n  snapTo: 'start' | 'end',\n  timeZone: string,\n): UnixTimestamp {\n  const unitMultiplier = interval.value * ES_FIXED_INTERVAL_UNIT_TO_BASE[interval.unit];\n  const unixTimestamp = getUnixTimestamp(date, timeZone);\n  const utcOffsetInMs = getUTCOffset(date, timeZone) * 60 * 1000;\n  const roundedDate = Math.floor((unixTimestamp + utcOffsetInMs) / unitMultiplier) * unitMultiplier - utcOffsetInMs;\n  return snapTo === 'start' ? roundedDate : roundedDate + unitMultiplier - 1;\n}\n\n/** @internal */\nexport function timeRange(\n  from: number,\n  to: number,\n  interval: ESCalendarInterval | ESFixedInterval,\n  timeZone: string,\n): number[] {\n  return interval.type === 'fixed'\n    ? fixedTimeRange(from, to, interval, timeZone)\n    : calendarTimeRange(from, to, interval, timeZone);\n}\n\nfunction calendarTimeRange(from: number, to: number, interval: ESCalendarInterval, timeZone: string): number[] {\n  const snappedFrom = roundDateToESInterval(from, interval, 'start', timeZone);\n  const snappedTo = roundDateToESInterval(to, interval, 'start', timeZone);\n  const values: number[] = [snappedFrom];\n  let current = snappedFrom;\n  while (addTime(current, timeZone, esCalendarIntervalToChronoInterval[interval.unit], interval.value) < snappedTo) {\n    current = addTime(current, timeZone, esCalendarIntervalToChronoInterval[interval.unit], interval.value);\n    values.push(current);\n  }\n  return values;\n}\n\nfunction fixedTimeRange(from: number, to: number, interval: ESFixedInterval, timeZone: string): number[] {\n  const snappedFrom = roundDateToESInterval(from, interval, 'start', timeZone);\n  const snappedTo = roundDateToESInterval(to, interval, 'start', timeZone);\n  const utcTo = localToUTC(snappedTo, timeZone);\n  let current = localToUTC(snappedFrom, timeZone);\n  const values: number[] = [current];\n  while (current + interval.value * ES_FIXED_INTERVAL_UNIT_TO_BASE[interval.unit] < utcTo) {\n    current = current + interval.value * ES_FIXED_INTERVAL_UNIT_TO_BASE[interval.unit];\n    values.push(current);\n  }\n  // filtering duplicates that can be generated around DST\n  return [...new Set(values.map((d) => utcToLocal(d, timeZone)))];\n}\n\n/** @internal */\nexport function addIntervalToTime(time: number, interval: ESCalendarInterval | ESFixedInterval, timeZone: string) {\n  return interval.type === 'fixed'\n    ? utcToLocal(localToUTC(time, timeZone) + interval.value * ES_FIXED_INTERVAL_UNIT_TO_BASE[interval.unit], timeZone)\n    : addTime(time, timeZone, esCalendarIntervalToChronoInterval[interval.unit], interval.value);\n}\n\nfunction utcToLocal(time: number, timeZone: string) {\n  return time - getUTCOffset(time, timeZone) * 60 * 1000;\n}\nfunction localToUTC(time: number, timeZone: string) {\n  return time + getUTCOffset(time, timeZone) * 60 * 1000;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment-timezone';\n\nimport { CalendarIntervalUnit, CalendarObj, DateTime, FixedIntervalUnit, Minutes, UnixTimestamp } from './types';\n\n/** @internal */\nexport const timeObjFromCalendarObj = (\n  yearMonthDayHour: Partial<CalendarObj>,\n  timeZone: string = 'browser',\n): moment.Moment =>\n  timeZone\n    ? moment.tz(\n        {\n          ...yearMonthDayHour,\n          month: typeof yearMonthDayHour.month === 'number' ? yearMonthDayHour.month - 1 : undefined,\n        },\n        timeZone,\n      )\n    : moment({\n        ...yearMonthDayHour,\n        month: typeof yearMonthDayHour.month === 'number' ? yearMonthDayHour.month - 1 : undefined,\n      });\n\n/** @internal */\nexport const timeObjFromUnixTimestamp = (unixTimestamp: UnixTimestamp, timeZone?: string): moment.Moment =>\n  timeZone ? moment.tz(unixTimestamp, timeZone) : moment(unixTimestamp);\n\n/** @internal */\nexport const timeObjFromDate = (date: Date, timeZone?: string): moment.Moment =>\n  timeZone ? moment.tz(date, timeZone) : moment(date);\n\n/** @internal */\nexport const timeObjFromAny = (time: DateTime, timeZone?: string): moment.Moment => {\n  return typeof time === 'number'\n    ? timeObjFromUnixTimestamp(time, timeZone)\n    : time instanceof Date\n      ? timeObjFromDate(time, timeZone)\n      : timeObjFromCalendarObj(time, timeZone);\n};\n\n/** @internal */\nexport const timeObjToSeconds = (t: moment.Moment) => t.unix();\n/** @internal */\nexport const timeObjToUnixTimestamp = (t: moment.Moment): UnixTimestamp => t.valueOf();\n/** @internal */\nexport const timeObjToWeekday = (t: moment.Moment) => t.isoWeekday();\n/** @internal */\nexport const timeObjToYear = (t: moment.Moment) => t.year();\n/** @internal */\nexport const addTimeToObj = (obj: moment.Moment, unit: CalendarIntervalUnit | FixedIntervalUnit, count: number) =>\n  obj.add(count, unit);\n/** @internal */\nexport const subtractTimeToObj = (obj: moment.Moment, unit: CalendarIntervalUnit | FixedIntervalUnit, count: number) =>\n  obj.subtract(count, unit);\n/** @internal */\nexport const startTimeOfObj = (obj: moment.Moment, unit: CalendarIntervalUnit | FixedIntervalUnit) =>\n  obj.startOf(unit === 'week' ? 'isoWeek' : unit); // we should use the ISO week to align to ES\n\n/** @internal */\nexport const endTimeOfObj = (obj: moment.Moment, unit: CalendarIntervalUnit | FixedIntervalUnit) =>\n  obj.endOf(unit === 'week' ? 'isoWeek' : unit); // we should use the ISO week to align to ES\n\n/** @internal */\nexport const timeObjToUTCOffset = (obj: moment.Moment): Minutes => obj.utcOffset();\n\n/** @internal */\nexport const formatTimeObj = (obj: moment.Moment, format: string): string => obj.format(format);\n\n/** @internal */\nexport const diffTimeObjs = (\n  obj1: moment.Moment,\n  obj2: moment.Moment,\n  unit: CalendarIntervalUnit | FixedIntervalUnit,\n): number => obj1.diff(obj2, unit);\n\n/** @internal */\nexport const TOKENS = {\n  year: 'Y',\n  year2DGT: 'YY',\n  year4DGT: 'YYYY',\n  monthNPD: 'M',\n  monthORD: 'Mo',\n  monthPD: 'MM',\n  monthAbr: 'MMM',\n  monthFull: 'MMMM',\n  dayOfMonthNP: 'D',\n  dayOfMonthORD: 'Do',\n  dayOfMonthPD: 'DD',\n  dayOfYNP: 'DDD',\n  dayOfYORD: 'DDDo',\n  dayOfYPD: 'DDDD',\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { ComponentType, isValidElement, ReactNode } from 'react';\nimport { $Values, isPrimitive } from 'utility-types';\nimport { v1 as uuidv1 } from 'uuid';\n\nimport { AdditiveNumber } from './accessor';\nimport { Point } from './point';\nimport { PrimitiveValue } from '../chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { Color, Colors } from '../common/colors';\nimport { Degrees, Radian } from '../common/geometry';\nimport { BaseDatum } from '../specs';\n\n/** @public */\nexport const Position = Object.freeze({\n  Top: 'top' as const,\n  Bottom: 'bottom' as const,\n  Left: 'left' as const,\n  Right: 'right' as const,\n});\n/** @public */\nexport type Position = $Values<typeof Position>;\n\n/** @public */\nexport const LayoutDirection = Object.freeze({\n  Horizontal: 'horizontal' as const,\n  Vertical: 'vertical' as const,\n});\n/** @public */\nexport type LayoutDirection = $Values<typeof LayoutDirection>;\n\n/**\n * Color variants that are unique to `@elastic/charts`. These go beyond the standard\n * static color allocations.\n * @public\n */\nexport const ColorVariant = Object.freeze({\n  /**\n   * Uses series color. Rather than setting a static color, this will use the\n   * default series color for a given series.\n   */\n  Series: '__use__series__color__' as const,\n  /**\n   * Uses empty color, similar to transparent.\n   */\n  None: '__use__empty__color__' as const,\n  /**\n   * Computes best color based on background contrast\n   */\n  Adaptive: '__use__adaptive__color__' as const,\n});\n/** @public */\nexport type ColorVariant = $Values<typeof ColorVariant>;\n\n/** @public */\nexport const HorizontalAlignment = Object.freeze({\n  Center: 'center' as const,\n  Right: Position.Right,\n  Left: Position.Left,\n  /**\n   * Aligns to near side of axis depending on position\n   *\n   * Examples:\n   * - Left Axis, `Near` will push the label to the `Right`, _near_ the axis\n   * - Right Axis, `Near` will push the axis labels to the `Left`\n   * - Top/Bottom Axes, `Near` will default to `Center`\n   */\n  Near: 'near' as const,\n  /**\n   * Aligns to far side of axis depending on position\n   *\n   * Examples:\n   * - Left Axis, `Far` will push the label to the `Left`, _far_ from the axis\n   * - Right Axis, `Far` will push the axis labels to the `Right`\n   * - Top/Bottom Axes, `Far` will default to `Center`\n   */\n  Far: 'far' as const,\n});\n\n/**\n * Horizontal text alignment\n * @public\n */\nexport type HorizontalAlignment = $Values<typeof HorizontalAlignment>;\n\n/** @public */\nexport const VerticalAlignment = Object.freeze({\n  Middle: 'middle' as const,\n  Top: Position.Top,\n  Bottom: Position.Bottom,\n  /**\n   * Aligns to near side of axis depending on position\n   *\n   * Examples:\n   * - Top Axis, `Near` will push the label to the `Right`, _near_ the axis\n   * - Bottom Axis, `Near` will push the axis labels to the `Left`\n   * - Left/Right Axes, `Near` will default to `Middle`\n   */\n  Near: 'near' as const,\n  /**\n   * Aligns to far side of axis depending on position\n   *\n   * Examples:\n   * - Top Axis, `Far` will push the label to the `Top`, _far_ from the axis\n   * - Bottom Axis, `Far` will push the axis labels to the `Bottom`\n   * - Left/Right Axes, `Far` will default to `Middle`\n   */\n  Far: 'far' as const,\n});\n\n/**\n * Vertical text alignment\n * @public\n */\nexport type VerticalAlignment = $Values<typeof VerticalAlignment>;\n\n/** @public */\nexport type Datum = any; // unknown;\n/** @public */\nexport type Rotation = 0 | 90 | -90 | 180;\n/** @public */\nexport type Rendering = 'canvas' | 'svg';\n/** @public */\nexport type StrokeStyle = Color; // now narrower than string | CanvasGradient | CanvasPattern\n\n/** @internal */\nexport function compareByValueAsc(a: number | string, b: number | string): number {\n  return a > b ? 1 : a < b ? -1 : 0;\n}\n\n/** @internal */\nexport function clamp(value: number, lowerBound: number, upperBound: number): number {\n  return Math.min(Math.max(value, lowerBound), upperBound);\n}\n\n/**\n * Returns color given any color variant\n *\n * @internal\n */\nexport function getColorFromVariant(seriesColor: Color, color?: Color | ColorVariant): Color {\n  if (color === ColorVariant.Series) {\n    return seriesColor;\n  }\n\n  if (color === ColorVariant.None) {\n    return Colors.Transparent.keyword;\n  }\n\n  return color || seriesColor;\n}\n\n/** @internal */\nexport const degToRad = (angle: Degrees): Radian => (angle / 180) * Math.PI;\n\n/** @internal */\nexport const radToDeg = (radian: Radian): Degrees => (radian * 180) / Math.PI;\n\n/**\n * This function returns a function to generate ids.\n * This can be used to generate unique, but predictable ids to pair labels\n * with their inputs. It takes an optional prefix as a parameter. If you don't\n * specify it, it generates a random id prefix. If you specify a custom prefix\n * it should begin with an letter to be HTML4 compliant.\n * @internal\n */\nexport function htmlIdGenerator(idPrefix?: string) {\n  const prefix = idPrefix || `i${uuidv1()}`;\n  return (suffix?: string) => `${prefix}_${suffix || uuidv1()}`;\n}\n\n/**\n * Helper function to identify never type for conditionals\n * See https://github.com/microsoft/TypeScript/issues/31751#issuecomment-498526919\n * @internal\n */\nexport type ExtendsNever<T, Y, N> = [T] extends [never] ? Y : N;\n\n/**\n * Replaces all properties on any type as optional, includes nested types\n *\n * example:\n * ```ts\n * interface Person {\n *  name: string;\n *  age?: number;\n *  spouse: Person;\n *  children: Person[];\n * }\n * type PartialPerson = RecursivePartial<Person>;\n * // results in\n * interface PartialPerson {\n *  name?: string;\n *  age?: number;\n *  spouse?: RecursivePartial<Person>;\n *  children?: RecursivePartial<Person>[]\n * }\n * ```\n * @public\n */\nexport type RecursivePartial<T> = {\n  [P in keyof T]?: T[P] extends NonAny[] // checks for nested any[]\n    ? T[P]\n    : T[P] extends ReadonlyArray<NonAny> // checks for nested ReadonlyArray<any>\n      ? T[P]\n      : T[P] extends (infer U)[]\n        ? RecursivePartial<U>[]\n        : T[P] extends ReadonlyArray<infer U> // eslint-disable-line @typescript-eslint/array-type\n          ? ReadonlyArray<RecursivePartial<U>> // eslint-disable-line @typescript-eslint/array-type\n          : T[P] extends Set<infer V> // checks for Sets\n            ? Set<RecursivePartial<V>>\n            : T[P] extends Map<infer K, infer V> // checks for Maps\n              ? Map<K, RecursivePartial<V>>\n              : T[P] extends NonAny // checks for primitive values\n                ? T[P]\n                : IsUnknown<T[P], 1, 0> extends 1\n                  ? T[P]\n                  : RecursivePartial<T[P]>; // recurse for all non-array and non-primitive values\n};\n\n/**\n * return True if T is `any`, otherwise return False\n * @public\n */\nexport type IsAny<T, True, False = never> = True | False extends (T extends never ? True : False) ? True : False;\n\n/**\n * return True if T is `unknown`, otherwise return False\n * @public\n */\nexport type IsUnknown<T, True, False = never> = unknown extends T ? IsAny<T, False, True> : False;\n\n/** @public */\nexport type NonAny = number | boolean | string | symbol | null;\n\n/** @public */\nexport interface MergeOptions {\n  /**\n   * Includes all available keys of every provided partial at a given level.\n   * This is opposite to normal behavior, which only uses keys from the base\n   * object to merge values.\n   *\n   * @defaultValue false\n   */\n  mergeOptionalPartialValues?: boolean;\n  /**\n   * Merges Maps same as objects. By default this is disabled and Maps are replaced on the base\n   * with a defined Map on any partial.\n   *\n   * @defaultValue false\n   */\n  mergeMaps?: boolean;\n}\n\n/** @internal */\nexport function getPartialValue<T>(base: T, partial?: RecursivePartial<T>, partials: RecursivePartial<T>[] = []): T {\n  const partialWithValue = partial !== undefined ? partial : partials.find((v) => v !== undefined);\n  return partialWithValue !== undefined ? (partialWithValue as T) : base;\n}\n\n/**\n * Returns all top-level keys from one or more objects\n * @param object - first object to get keys\n * @param objects\n * @internal\n */\nexport function getAllKeys(object?: any, objects: any[] = []): Set<any> {\n  return new Set(\n    [object, ...objects].filter(Boolean).reduce((keys: any[], obj) => {\n      if (obj && typeof obj === 'object') {\n        const newKeys = obj instanceof Map ? obj.keys() : Object.keys(obj);\n        keys.push(...newKeys);\n      }\n\n      return keys;\n    }, []),\n  );\n}\n\n/** @internal */\nexport function isArrayOrSet<T>(value: any): value is Array<T> | Set<T> {\n  return Array.isArray(value) || value instanceof Set;\n}\n\n/** @internal */\nexport function isNil(value: any): value is null | undefined {\n  return value === null || value === undefined;\n}\n\n/** @internal */\nexport function hasPartialObjectToMerge<T>(\n  base: T,\n  partial?: RecursivePartial<T>,\n  additionalPartials: RecursivePartial<T>[] = [],\n): boolean {\n  if (isArrayOrSet(base)) {\n    return false;\n  }\n\n  if (typeof base === 'object' && base !== null) {\n    if (typeof partial === 'object' && !isArrayOrSet(partial) && partial !== null) {\n      return true;\n    }\n\n    return additionalPartials.some((p) => typeof p === 'object' && !Array.isArray(p));\n  }\n\n  return false;\n}\n\n/** @internal */\nexport function shallowClone(value: any) {\n  if (Array.isArray(value)) {\n    return [...value];\n  }\n\n  if (value instanceof Set) {\n    return new Set(value);\n  }\n\n  if (typeof value === 'object' && value !== null) {\n    if (value instanceof Map) {\n      return new Map(value.entries());\n    }\n\n    return { ...value };\n  }\n\n  return value;\n}\n\nfunction isReactNode(el: any): el is ReactNode {\n  return isNil(el) || isPrimitive(el) || isValidElement(el);\n}\n\nfunction isReactComponent<P extends Record<string, any>>(el: any): el is ComponentType<P> {\n  return !isReactNode(el);\n}\n\n/**\n * Renders simple react node or react component with props\n * @internal\n */\nexport function renderWithProps<P extends Record<string, any>>(El: ReactNode | ComponentType<P>, props: P): ReactNode {\n  return isReactComponent<P>(El) ? React.createElement(El, props) : El;\n}\n\n/**\n * Aligns component children to the correct output type\n * @internal */\nexport function renderComplexChildren(children: ReactNode): JSX.Element {\n  return (() => <>{children}</>)();\n}\n\n/**\n * Merges values of a partial structure with a base structure.\n *\n * @note No nested array merging\n *\n * @param base structure to be duplicated, must have all props of `partial`\n * @param partial structure to override values from base\n * @param options options to control merge behaviour\n * @param additionalPartials partials to be used before base and after partial\n *\n * @returns new base structure with updated partial values\n * @internal\n */\nexport function mergePartial<T>(\n  base: T,\n  partial?: RecursivePartial<T>,\n  options: MergeOptions = {},\n  additionalPartials: RecursivePartial<T>[] = [],\n): T {\n  const baseClone = shallowClone(base);\n\n  if (hasPartialObjectToMerge(base, partial, additionalPartials)) {\n    const mapCondition = !(baseClone instanceof Map) || options.mergeMaps;\n    const partialKeys = getAllKeys(partial, additionalPartials);\n    if (partialKeys.size > 0 && (options.mergeOptionalPartialValues ?? true) && mapCondition) {\n      partialKeys.forEach((key) => {\n        if (baseClone instanceof Map) {\n          if (!baseClone.has(key)) {\n            baseClone.set(\n              key,\n              (partial as any).get(key) !== undefined\n                ? (partial as any).get(key)\n                : additionalPartials.find((v: any) => v.get(key) !== undefined) || new Map().get(key),\n            );\n          }\n        } else if (!(key in baseClone)) {\n          baseClone[key] =\n            (partial as any)?.[key] !== undefined\n              ? (partial as any)[key]\n              : (additionalPartials.find((v: any) => v?.[key] !== undefined) ?? ({} as any))[key];\n        }\n      });\n    }\n\n    if (baseClone instanceof Map) {\n      if (options.mergeMaps) {\n        return [...baseClone.keys()].reduce((newBase: Map<any, any>, key) => {\n          const partialValue = partial && (partial as any).get(key);\n          const partialValues = additionalPartials.map((v) =>\n            typeof v === 'object' && v instanceof Map ? v.get(key) : undefined,\n          );\n          const baseValue = (base as any).get(key);\n\n          newBase.set(key, mergePartial(baseValue, partialValue, options, partialValues));\n\n          return newBase;\n        }, baseClone as any);\n      }\n\n      if (partial !== undefined) {\n        return partial as any;\n      }\n\n      const additional = additionalPartials.find((p: any) => p !== undefined);\n      if (additional) {\n        return additional as any;\n      }\n\n      return baseClone as any;\n    }\n\n    return Object.keys(baseClone).reduce((newBase, key) => {\n      const partialValue = partial && (partial as any)[key];\n      const partialValues = additionalPartials.map((v) => (typeof v === 'object' ? (v as any)[key] : undefined));\n      const baseValue = (base as any)[key];\n\n      newBase[key] = mergePartial(baseValue, partialValue, options, partialValues);\n\n      return newBase;\n    }, baseClone);\n  }\n\n  return getPartialValue<T>(baseClone, partial, additionalPartials);\n}\n\n/** @public */\nexport type ValueFormatter = (value: number) => string;\n/** @public */\nexport type ValueAccessor<D extends BaseDatum = Datum> = (d: D) => AdditiveNumber;\n/** @public */\nexport type LabelAccessor<T = PrimitiveValue> = (value: T) => string;\n/** @public */\nexport type ShowAccessor = (value: PrimitiveValue) => boolean;\n\n/**\n * Returns planar distance bewtween two points\n * @internal\n */\nexport function getDistance(a: Point, b: Point): number {\n  return Math.sqrt(Math.pow(b.x - a.x, 2) + Math.pow(b.y - a.y, 2));\n}\n\n/** @internal */\nexport function stringifyNullsUndefined(value?: PrimitiveValue): string | number {\n  if (value === undefined) {\n    return 'undefined';\n  }\n\n  if (value === null) {\n    return 'null';\n  }\n\n  return value;\n}\n\n/**\n * Determines if an array has all unique values\n *\n * examples:\n * ```ts\n * isUniqueArray([1, 2]) // => true\n * isUniqueArray([1, 1, 2]) // => false\n * isUniqueArray([{ n: 1 }, { n: 1 }, { n: 2 }], ({ n }) => n) // => false\n * ```\n *\n * @internal\n * @param  {B[]} arr\n * @param  {(d:B)=>T} extractor? extract the value from B\n */\nexport function isUniqueArray<B, T>(arr: B[], extractor?: (value: B) => T) {\n  const values = new Set<B | T>();\n\n  return (function isUniqueArrayFn() {\n    return arr.every((v) => {\n      const value = extractor ? extractor(v) : v;\n\n      if (values.has(value)) {\n        return false;\n      }\n\n      values.add(value);\n      return true;\n    });\n  })();\n}\n\n/**\n * Sorts array of numbers\n * @internal\n */\nexport function sortNumbers<T extends any[]>(arr: T, descending = false): T {\n  return arr.slice().sort(descending ? (a, b) => b - a : (a, b) => a - b) as T;\n}\n\ntype SortTestFn = (n1?: number, n2?: number) => boolean;\n\n/**\n * Returns true if array of numbers is sorted\n * @internal\n */\nexport function isSorted<T extends number[]>(\n  arr: T,\n  options?: { allowDuplicates?: boolean; order?: 'ascending' | 'descending' },\n): boolean {\n  if (arr.length <= 1) return true;\n  const ascending = options?.order === 'ascending' ? true : options?.order === 'descending' ? false : arr[0]! < arr[1]!;\n  const isOrderedPair: SortTestFn =\n    options?.allowDuplicates ?? false\n      ? ascending\n        ? (n1 = NaN, n2 = NaN) => n1 <= n2\n        : (n1 = NaN, n2 = NaN) => n1 >= n2\n      : ascending\n        ? (n1 = NaN, n2 = NaN) => n1 < n2\n        : (n1 = NaN, n2 = NaN) => n1 > n2;\n\n  for (let i = 0; i < arr.length - 1; i++) {\n    if (!isOrderedPair(arr[i], arr[i + 1])) return false;\n  }\n  return true;\n}\n\n/**\n * Returns true if _most_ chars in a string are rtl, exluding spaces and numbers\n * @internal\n */\nexport function isRTLString(s: string, ratio: number = 0.5) {\n  const stripped = s.replaceAll(/[\\u0591-\\u07FF\\uFB1D-\\uFDFD\\uFE70-\\uFEFC]|\\s|\\d/gi, '');\n  return stripped.length / s.replaceAll(/\\s|\\d/gi, '').length < ratio;\n}\n\n/** @internal */\nexport function hasMostlyRTLItems<T extends string>(items: T[], ratio: number = 0.5): boolean {\n  const filteredItems = items.filter(Boolean);\n  const rtlItemCount = filteredItems.filter((s) => isRTLString(s)).length;\n  return rtlItemCount / filteredItems.length > ratio;\n}\n\n/**\n * Returns defined value type if not null nor undefined\n *\n * @internal\n */\nexport function isDefined<T>(value?: T): value is NonNullable<T> {\n  return value !== null && value !== undefined;\n}\n\n/**\n * Returns defined value type if value from getter function is not null nor undefined\n *\n * **IMPORTANT**: You must provide an accurate typeCheck function that will filter out _EVERY_\n * item in the array that is not of type `T`. If not, the type check will override the\n * type as `T` which may be incorrect.\n *\n * @internal\n */\nexport function isDefinedFrom<T>(typeCheck: (value: RecursivePartial<T>) => boolean) {\n  return (value?: RecursivePartial<T>): value is NonNullable<T> => {\n    if (value === undefined) {\n      return false;\n    }\n\n    try {\n      return typeCheck(value);\n    } catch {\n      return false;\n    }\n  };\n}\n\n/**\n * Returns rounded number to given decimals\n *\n * @internal\n */\nexport const round = (value: number, fractionDigits = 0): number => {\n  const precision = Math.pow(10, Math.max(fractionDigits, 0));\n  const scaledValue = Math.floor(value * precision);\n\n  return scaledValue / precision;\n};\n\n/**\n * Returns rounded number to nearest/lowest/highest interval\n *\n * @internal\n */\nexport const roundTo = (\n  value: number,\n  interval: number,\n  options: { min?: number; max?: number; type?: 'round' | 'ceil' | 'floor' } = {},\n): number => {\n  const roundedValue = Math[options.type ?? 'round'](value / interval) * interval;\n  return clamp(roundedValue, options?.min ?? -Infinity, options?.max ?? Infinity);\n};\n\n/**\n * Get number/percentage value from string\n *\n * i.e. `'90%'` with relative value of `100` returns `90`\n * @internal\n */\nexport function getPercentageValue<T>(ratio: string | number, relativeValue: number, defaultValue: T): number | T {\n  if (typeof ratio === 'number') {\n    return Math.abs(ratio);\n  }\n\n  const ratioStr = ratio.trim();\n\n  if (/\\d+%$/.test(ratioStr)) {\n    const percentage = Math.abs(Number.parseInt(ratioStr.slice(0, -1), 10));\n    return relativeValue * (percentage / 100);\n  }\n  const num = Number.parseFloat(ratioStr);\n  return Number.isFinite(num) ? Math.abs(num) : defaultValue;\n}\n\n/**\n * Predicate function, eg. to be called with [].filter, to keep distinct values\n * @example [1, 2, 4, 2, 4, 0, 3, 2].filter(keepDistinct) ==> [1, 2, 4, 0, 3]\n * @internal\n */\nexport function keepDistinct<T>(d: T, i: number, a: T[]): boolean {\n  return a.indexOf(d) === i;\n}\n\n/**\n * Return an object which keys are values of an object and the value is the\n * static one provided\n * @public\n */\nexport function toEntries<T extends Record<string, string>, S>(\n  array: T[],\n  accessor: keyof T,\n  staticValue: S,\n): Record<string, S> {\n  return array.reduce<Record<string, S>>((acc, curr) => {\n    acc[curr[accessor]] = staticValue;\n    return acc;\n  }, {});\n}\n\n/**\n * Safely format values with error handling\n * @internal\n */\nexport function safeFormat<V = any>(value: V, formatter?: (value: V) => string): string {\n  if (formatter) {\n    try {\n      return formatter(value);\n    } catch {\n      // fallthrough\n    }\n  }\n\n  return `${value}`;\n}\n\n/** @internal */\nexport const range = (from: number, to: number, step: number): number[] =>\n  Array.from({ length: Math.abs(Math.round((to - from) / (step || 1))) }, (_, i) => from + i * step);\n\nconst oppositeAlignmentMap: Record<string, HorizontalAlignment | VerticalAlignment> = {\n  [HorizontalAlignment.Left]: HorizontalAlignment.Right,\n  [HorizontalAlignment.Right]: HorizontalAlignment.Left,\n  [VerticalAlignment.Top]: VerticalAlignment.Bottom,\n  [VerticalAlignment.Bottom]: VerticalAlignment.Top,\n};\n\n/** @internal */\nexport function getOppositeAlignment<A extends HorizontalAlignment | VerticalAlignment>(alignment: A): A {\n  return (oppositeAlignmentMap[alignment] as A) ?? alignment;\n}\n\n/** @internal */\nexport function isFiniteNumber(value: unknown): value is number {\n  return Number.isFinite(value);\n}\n\n/** @internal */\nexport function isNonNullablePrimitiveValue(value: unknown): value is NonNullable<PrimitiveValue> {\n  return typeof value === 'string' || typeof value === 'number';\n}\n\n/**\n * Strips all undefined properties from object\n * @internal\n */\nexport function stripUndefined<R extends Record<string, unknown>>(source: R): R {\n  return Object.keys(source).reduce((acc, key) => {\n    const val = source[key];\n    if (val !== undefined) {\n      // @ts-ignore - building new R from {}\n      acc[key] = val;\n    }\n    return acc;\n  }, {} as R);\n}\n\n/**\n * Returns `Array.filter` callback for values between a min and max\n * @internal\n */\nexport const isBetween = (min: number, max: number, exclusive = false): ((n: number) => boolean) =>\n  exclusive ? (n) => n < max && n > min : (n) => n <= max && n >= min;\n\n/**\n * Returns `Array.filter` callback for values between two unordered values\n * @internal\n */\nexport const isWithinRange = (range: [number, number], exclusive = false) => {\n  const [min, max] = sortNumbers(range);\n  return isBetween(min, max, exclusive);\n};\n\n/**\n * Returns `Array.reduce` callback to clamp values and remove duplicates\n * @internal\n */\nexport const clampAll = (\n  min: number,\n  max: number,\n): [callbackfn: (acc: number[], value: number) => number[], initialAcc: number[]] => {\n  const seen = new Set<number>();\n  return [\n    (acc: number[], n: number) => {\n      const clampValue = clamp(n, min, max);\n      if (!seen.has(clampValue)) acc.push(clampValue);\n      seen.add(clampValue);\n      return acc;\n    },\n    [],\n  ];\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  curveBasis,\n  curveCardinal,\n  curveCatmullRom,\n  curveLinear,\n  curveMonotoneX,\n  curveMonotoneY,\n  curveNatural,\n  curveStep,\n  curveStepAfter,\n  curveStepBefore,\n} from 'd3-shape';\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const CurveType = Object.freeze({\n  CURVE_CARDINAL: 0 as const,\n  CURVE_NATURAL: 1 as const,\n  CURVE_MONOTONE_X: 2 as const,\n  CURVE_MONOTONE_Y: 3 as const,\n  CURVE_BASIS: 4 as const,\n  CURVE_CATMULL_ROM: 5 as const,\n  CURVE_STEP: 6 as const,\n  CURVE_STEP_AFTER: 7 as const,\n  CURVE_STEP_BEFORE: 8 as const,\n  LINEAR: 9 as const,\n});\n\n/** @public */\nexport type CurveType = $Values<typeof CurveType>;\n\n/** @internal */\nexport function getCurveFactory(curveType: CurveType = CurveType.LINEAR) {\n  switch (curveType) {\n    case CurveType.CURVE_CARDINAL:\n      return curveCardinal;\n    case CurveType.CURVE_NATURAL:\n      return curveNatural;\n    case CurveType.CURVE_MONOTONE_X:\n      return curveMonotoneX;\n    case CurveType.CURVE_MONOTONE_Y:\n      return curveMonotoneY;\n    case CurveType.CURVE_BASIS:\n      return curveBasis;\n    case CurveType.CURVE_CATMULL_ROM:\n      return curveCatmullRom;\n    case CurveType.CURVE_STEP:\n      return curveStep;\n    case CurveType.CURVE_STEP_AFTER:\n      return curveStepAfter;\n    case CurveType.CURVE_STEP_BEFORE:\n      return curveStepBefore;\n    case CurveType.LINEAR:\n    default:\n      return curveLinear;\n  }\n}\n","/**\n * @notice\n * This product includes code that is adapted d3-delaunay@5.2.1,\n * which is available under a \"ISC\" license.\n *\n * Copyright 2018 Observable, Inc.\n *\n * Permission to use, copy, modify, and/or distribute this software for any purpose\n * with or without fee is hereby granted, provided that the above copyright notice\n * and this permission notice appear in all copies.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\n * REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND\n * FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\n * INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS\n * OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER\n * TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF\n * THIS SOFTWARE.\n */\n\n// @ts-nocheck\n\n/**\n * Delaunay triangulation\n */\ninterface DelaunayI<P> {\n  /**\n   * The coordinates of the points as an array [x0, y0, x1, y1, ...].\n   * Typically, this is a Float64Array, however you can use any array-like type in the constructor.\n   */\n  points: ArrayLike<number>;\n\n  /**\n   * The halfedge indices as an Int32Array [j0, j1, ...].\n   * For each index 0 <= i < halfedges.length, there is a halfedge from triangle vertex j = halfedges[i] to triangle vertex i.\n   */\n  halfedges: Int32Array;\n\n  /**\n   * An arbitrary node on the convex hull.\n   * The convex hull is represented as a circular doubly-linked list of nodes.\n   */\n  hull: Node;\n\n  /**\n   * The triangle vertex indices as an Uint32Array [i0, j0, k0, i1, j1, k1, ...].\n   * Each contiguous triplet of indices i, j, k forms a counterclockwise triangle.\n   * The coordinates of the triangle's points can be found by going through 'points'.\n   */\n  triangles: Uint32Array;\n\n  /**\n   * The incoming halfedge indexes as a Int32Array [e0, e1, e2, ...].\n   * For each point i, inedges[i] is the halfedge index e of an incoming halfedge.\n   * For coincident points, the halfedge index is -1; for points on the convex hull, the incoming halfedge is on the convex hull; for other points, the choice of incoming halfedge is arbitrary.\n   */\n  inedges: Int32Array;\n\n  /**\n   * The outgoing halfedge indexes as a Int32Array [e0, e1, e2, ...].\n   * For each point i on the convex hull, outedges[i] is the halfedge index e of the corresponding outgoing halfedge; for other points, the halfedge index is -1.\n   */\n  outedges: Int32Array;\n\n  /**\n   * Returns the index of the input point that is closest to the specified point ⟨x, y⟩.\n   * The search is started at the specified point i. If i is not specified, it defaults to zero.\n   */\n  find(x: number, y: number, i?: number): number;\n\n  /**\n   * Returns an iterable over the indexes of the neighboring points to the specified point i.\n   * The iterable is empty if i is a coincident point.\n   */\n  neighbors(i: number): IterableIterator<number>;\n\n  /**\n   * Returns the closed polygon [[x0, y0], [x1, y1], ..., [x0, y0]] representing the convex hull.\n   */\n  hullPolygon(): Polygon;\n\n  /**\n   * Returns the closed polygon [[x0, y0], [x1, y1], [x2, y2], [x0, y0]] representing the triangle i.\n   */\n  trianglePolygon(i: number): Triangle;\n\n  /**\n   * Returns an iterable over the polygons for each triangle, in order.\n   */\n  trianglePolygons(): IterableIterator<Triangle>;\n\n  /**\n   * Returns the Voronoi diagram for the associated points.\n   * When rendering, the diagram will be clipped to the specified bounds = [xmin, ymin, xmax, ymax].\n   * If bounds is not specified, it defaults to [0, 0, 960, 500].\n   * See To Infinity and Back Again for an interactive explanation of Voronoi cell clipping.\n   */\n  voronoi(bounds?: Bounds): Voronoi<P>;\n}\n\n/**\n * A point represented as an array tuple [x, y].\n */\ntype Point = number[];\n\n/**\n * A closed polygon [[x0, y0], [x1, y1], [x2, y2], [x0, y0]] representing a triangle.\n */\ntype Triangle = Point[];\n\n/**\n * A closed polygon [[x0, y0], [x1, y1], ..., [x0, y0]].\n */\ntype PolygonI = Point[];\n\n/**\n * A rectangular area [x, y, width, height].\n */\nexport type Bounds = number[];\n\n/**\n * A function to extract a x- or y-coordinate from the specified point.\n */\ntype GetCoordinate<P, PS> = (point: P, i: number, points: PS) => number;\n\n/**\n * A point node on a convex hull (represented as a circular linked list).\n */\ninterface Node {\n  /**\n   * The index of the associated point.\n   */\n  i: number;\n\n  /**\n   * The x-coordinate of the associated point.\n   */\n  x: number;\n\n  /**\n   * The y-coordinate of the associated point.\n   */\n  y: number;\n\n  /**\n   * The index of the (incoming or outgoing?) associated halfedge.\n   */\n  t: number;\n\n  /**\n   * The previous node on the hull.\n   */\n  prev: Node;\n\n  /**\n   * The next node on the hull.\n   */\n  next: Node;\n\n  /**\n   * Whether the node has been removed from the linked list.\n   */\n  removed: boolean;\n}\n\n/**\n * An interface for the rect() method of the CanvasPathMethods API.\n */\ninterface RectContext {\n  /**\n   * rect() method of the CanvasPathMethods API.\n   */\n  rect(x: number, y: number, width: number, height: number): void;\n}\n\n/**\n * An interface for the moveTo() method of the CanvasPathMethods API.\n */\ninterface MoveContext {\n  /**\n   * moveTo() method of the CanvasPathMethods API.\n   */\n  moveTo(x: number, y: number): void;\n}\n\n/**\n * An interface for the lineTo() method of the CanvasPathMethods API.\n */\ninterface LineContext {\n  /**\n   * lineTo() method of the CanvasPathMethods API.\n   */\n  lineTo(x: number, y: number): void;\n}\n\n/**\n * An interface for the arc() method of the CanvasPathMethods API.\n */\ninterface ArcContext {\n  /**\n   * arc() method of the CanvasPathMethods API.\n   */\n  arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, counterclockwise?: boolean): void;\n}\n\n/**\n * An interface for the closePath() method of the CanvasPathMethods API.\n */\ninterface ClosableContext {\n  /**\n   * closePath() method of the CanvasPathMethods API.\n   */\n  closePath(): void;\n}\n\n/**\n * Voronoi regions\n */\ninterface VoronoiI<P> {\n  /**\n   * The Voronoi diagram’s associated Delaunay triangulation.\n   */\n  delaunay: DelaunayI<P>;\n\n  /**\n   * The circumcenters of the Delaunay triangles [cx0, cy0, cx1, cy1, ...].\n   * Each contiguous pair of coordinates cx, cy is the circumcenter for the corresponding triangle.\n   * These circumcenters form the coordinates of the Voronoi cell polygons.\n   */\n  circumcenters: Float64Array;\n\n  /**\n   * An array [vx0, vy0, wx0, wy0, ...] where each non-zero quadruple describes an open (infinite) cell\n   * on the outer hull, giving the directions of two open half-lines.\n   */\n  vectors: Float64Array;\n\n  /**\n   * The bounds of the viewport [xmin, ymin, xmax, ymax] for rendering the Voronoi diagram.\n   * These values only affect the rendering methods (voronoi.render, voronoi.renderBounds, cell.render).\n   */\n  xmin: number;\n  ymin: number;\n  xmax: number;\n  ymax: number;\n\n  /**\n   * Returns true if the cell with the specified index i contains the specified point ⟨x, y⟩.\n   * (This method is not affected by the associated Voronoi diagram’s viewport bounds.)\n   */\n  contains(i: number, x: number, y: number): boolean;\n\n  /**\n   * Returns the convex, closed polygon [[x0, y0], [x1, y1], ..., [x0, y0]] representing the cell for the specified point i.\n   */\n  cellPolygon(i: number): PolygonI;\n\n  /**\n   * Returns an iterable over the polygons for each cell, in order.\n   */\n  cellPolygons(): IterableIterator<PolygonI>;\n}\n\n// https://github.com/d3/d3-delaunay v5.2.1 Copyright 2020 Mike Bostock\n// https://github.com/mapbox/delaunator v4.0.1. Copyright 2019 Mapbox, Inc.\n\n// Type definitions for d3-delaunay 4.1\n// Project: https://github.com/d3/d3-delaunay\n// Definitions by: Bradley Odell <https://github.com/BTOdell>\n// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped\n\nconst EPSILON = Math.pow(2, -52);\nconst EDGE_STACK = new Uint32Array(512);\n\nclass Delaunator {\n  static from(points, getX = defaultGetX, getY = defaultGetY) {\n    const n = points.length;\n    const coords = new Float64Array(n * 2);\n\n    for (let i = 0; i < n; i++) {\n      const p = points[i];\n      coords[2 * i] = getX(p);\n      coords[2 * i + 1] = getY(p);\n    }\n\n    return new Delaunator(coords);\n  }\n\n  constructor(coords) {\n    const n = coords.length >> 1;\n    if (n > 0 && typeof coords[0] !== 'number') throw new Error('Expected coords to contain numbers.');\n\n    this.coords = coords;\n\n    // arrays that will store the triangulation graph\n    const maxTriangles = Math.max(2 * n - 5, 0);\n    this._triangles = new Uint32Array(maxTriangles * 3);\n    this._halfedges = new Int32Array(maxTriangles * 3);\n\n    // temporary arrays for tracking the edges of the advancing convex hull\n    this._hashSize = Math.ceil(Math.sqrt(n));\n    this._hullPrev = new Uint32Array(n); // edge to prev edge\n    this._hullNext = new Uint32Array(n); // edge to next edge\n    this._hullTri = new Uint32Array(n); // edge to adjacent triangle\n    this._hullHash = new Int32Array(this._hashSize).fill(-1); // angular edge hash\n\n    // temporary arrays for sorting points\n    this._ids = new Uint32Array(n);\n    this._dists = new Float64Array(n);\n\n    this.update();\n  }\n\n  update() {\n    const { coords, _hullPrev: hullPrev, _hullNext: hullNext, _hullTri: hullTri, _hullHash: hullHash } = this;\n    const n = coords.length >> 1;\n\n    // populate an array of point indices; calculate input data bbox\n    let minX = Infinity;\n    let minY = Infinity;\n    let maxX = -Infinity;\n    let maxY = -Infinity;\n\n    for (let i = 0; i < n; i++) {\n      const x = coords[2 * i];\n      const y = coords[2 * i + 1];\n      if (x < minX) minX = x;\n      if (y < minY) minY = y;\n      if (x > maxX) maxX = x;\n      if (y > maxY) maxY = y;\n      this._ids[i] = i;\n    }\n    const cx = (minX + maxX) / 2;\n    const cy = (minY + maxY) / 2;\n\n    let minDist = Infinity;\n    let i0, i1, i2;\n\n    // pick a seed point close to the center\n    for (let i = 0; i < n; i++) {\n      const d = dist(cx, cy, coords[2 * i], coords[2 * i + 1]);\n      if (d < minDist) {\n        i0 = i;\n        minDist = d;\n      }\n    }\n    const i0x = coords[2 * i0];\n    const i0y = coords[2 * i0 + 1];\n\n    minDist = Infinity;\n\n    // find the point closest to the seed\n    for (let i = 0; i < n; i++) {\n      if (i === i0) continue;\n      const d = dist(i0x, i0y, coords[2 * i], coords[2 * i + 1]);\n      if (d < minDist && d > 0) {\n        i1 = i;\n        minDist = d;\n      }\n    }\n    let i1x = coords[2 * i1];\n    let i1y = coords[2 * i1 + 1];\n\n    let minRadius = Infinity;\n\n    // find the third point which forms the smallest circumcircle with the first two\n    for (let i = 0; i < n; i++) {\n      if (i === i0 || i === i1) continue;\n      const r = circumradius(i0x, i0y, i1x, i1y, coords[2 * i], coords[2 * i + 1]);\n      if (r < minRadius) {\n        i2 = i;\n        minRadius = r;\n      }\n    }\n    let i2x = coords[2 * i2];\n    let i2y = coords[2 * i2 + 1];\n\n    if (minRadius === Infinity) {\n      // order collinear points by dx (or dy if all x are identical)\n      // and return the list as a hull\n      for (let i = 0; i < n; i++) {\n        this._dists[i] = coords[2 * i] - coords[0] || coords[2 * i + 1] - coords[1];\n      }\n      quicksort(this._ids, this._dists, 0, n - 1);\n      const hull = new Uint32Array(n);\n      let j = 0;\n      for (let i = 0, d0 = -Infinity; i < n; i++) {\n        const id = this._ids[i];\n        if (this._dists[id] > d0) {\n          hull[j++] = id;\n          d0 = this._dists[id];\n        }\n      }\n      this.hull = hull.subarray(0, j);\n      this.triangles = new Uint32Array(0);\n      this.halfedges = new Uint32Array(0);\n      return;\n    }\n\n    // swap the order of the seed points for counter-clockwise orientation\n    if (orient(i0x, i0y, i1x, i1y, i2x, i2y)) {\n      const i = i1;\n      const x = i1x;\n      const y = i1y;\n      i1 = i2;\n      i1x = i2x;\n      i1y = i2y;\n      i2 = i;\n      i2x = x;\n      i2y = y;\n    }\n\n    const center = circumcenter(i0x, i0y, i1x, i1y, i2x, i2y);\n    this._cx = center.x;\n    this._cy = center.y;\n\n    for (let i = 0; i < n; i++) {\n      this._dists[i] = dist(coords[2 * i], coords[2 * i + 1], center.x, center.y);\n    }\n\n    // sort the points by distance from the seed triangle circumcenter\n    quicksort(this._ids, this._dists, 0, n - 1);\n\n    // set up the seed triangle as the starting hull\n    this._hullStart = i0;\n    let hullSize = 3;\n\n    hullNext[i0] = hullPrev[i2] = i1;\n    hullNext[i1] = hullPrev[i0] = i2;\n    hullNext[i2] = hullPrev[i1] = i0;\n\n    hullTri[i0] = 0;\n    hullTri[i1] = 1;\n    hullTri[i2] = 2;\n\n    hullHash.fill(-1);\n    hullHash[this._hashKey(i0x, i0y)] = i0;\n    hullHash[this._hashKey(i1x, i1y)] = i1;\n    hullHash[this._hashKey(i2x, i2y)] = i2;\n\n    this.trianglesLen = 0;\n    this._addTriangle(i0, i1, i2, -1, -1, -1);\n\n    for (let k = 0, xp, yp; k < this._ids.length; k++) {\n      const i = this._ids[k];\n      const x = coords[2 * i];\n      const y = coords[2 * i + 1];\n\n      // skip near-duplicate points\n      if (k > 0 && Math.abs(x - xp) <= EPSILON && Math.abs(y - yp) <= EPSILON) continue;\n      xp = x;\n      yp = y;\n\n      // skip seed triangle points\n      if (i === i0 || i === i1 || i === i2) continue;\n\n      // find a visible edge on the convex hull using edge hash\n      let start = 0;\n      for (let j = 0, key = this._hashKey(x, y); j < this._hashSize; j++) {\n        start = hullHash[(key + j) % this._hashSize];\n        if (start !== -1 && start !== hullNext[start]) break;\n      }\n\n      start = hullPrev[start];\n      let e = start,\n        q;\n      while (((q = hullNext[e]), !orient(x, y, coords[2 * e], coords[2 * e + 1], coords[2 * q], coords[2 * q + 1]))) {\n        e = q;\n        if (e === start) {\n          e = -1;\n          break;\n        }\n      }\n      if (e === -1) continue; // likely a near-duplicate point; skip it\n\n      // add the first triangle from the point\n      let t = this._addTriangle(e, i, hullNext[e], -1, -1, hullTri[e]);\n\n      // recursively flip triangles from the point until they satisfy the Delaunay condition\n      hullTri[i] = this._legalize(t + 2);\n      hullTri[e] = t; // keep track of boundary triangles on the hull\n      hullSize++;\n\n      // walk forward through the hull, adding more triangles and flipping recursively\n      let n = hullNext[e];\n      while (((q = hullNext[n]), orient(x, y, coords[2 * n], coords[2 * n + 1], coords[2 * q], coords[2 * q + 1]))) {\n        t = this._addTriangle(n, i, q, hullTri[i], -1, hullTri[n]);\n        hullTri[i] = this._legalize(t + 2);\n        hullNext[n] = n; // mark as removed\n        hullSize--;\n        n = q;\n      }\n\n      // walk backward from the other side, adding more triangles and flipping\n      if (e === start) {\n        while (((q = hullPrev[e]), orient(x, y, coords[2 * q], coords[2 * q + 1], coords[2 * e], coords[2 * e + 1]))) {\n          t = this._addTriangle(q, i, e, -1, hullTri[e], hullTri[q]);\n          this._legalize(t + 2);\n          hullTri[q] = t;\n          hullNext[e] = e; // mark as removed\n          hullSize--;\n          e = q;\n        }\n      }\n\n      // update the hull indices\n      this._hullStart = hullPrev[i] = e;\n      hullNext[e] = hullPrev[n] = i;\n      hullNext[i] = n;\n\n      // save the two new edges in the hash table\n      hullHash[this._hashKey(x, y)] = i;\n      hullHash[this._hashKey(coords[2 * e], coords[2 * e + 1])] = e;\n    }\n\n    this.hull = new Uint32Array(hullSize);\n    for (let i = 0, e = this._hullStart; i < hullSize; i++) {\n      this.hull[i] = e;\n      e = hullNext[e];\n    }\n\n    // trim typed triangle mesh arrays\n    this.triangles = this._triangles.subarray(0, this.trianglesLen);\n    this.halfedges = this._halfedges.subarray(0, this.trianglesLen);\n  }\n\n  _hashKey(x, y) {\n    return Math.floor(pseudoAngle(x - this._cx, y - this._cy) * this._hashSize) % this._hashSize;\n  }\n\n  _legalize(a) {\n    const { _triangles: triangles, _halfedges: halfedges, coords } = this;\n\n    let i = 0;\n    let ar = 0;\n\n    // recursion eliminated with a fixed-size stack\n    while (true) {\n      const b = halfedges[a];\n\n      /* if the pair of triangles doesn't satisfy the Delaunay condition\n       * (p1 is inside the circumcircle of [p0, pl, pr]), flip them,\n       * then do the same check/flip recursively for the new pair of triangles\n       *\n       *           pl                    pl\n       *          /||\\                  /  \\\n       *       al/ || \\bl            al/    \\a\n       *        /  ||  \\              /      \\\n       *       /  a||b  \\    flip    /___ar___\\\n       *     p0\\   ||   /p1   =>   p0\\---bl---/p1\n       *        \\  ||  /              \\      /\n       *       ar\\ || /br             b\\    /br\n       *          \\||/                  \\  /\n       *           pr                    pr\n       */\n      const a0 = a - (a % 3);\n      ar = a0 + ((a + 2) % 3);\n\n      if (b === -1) {\n        // convex hull edge\n        if (i === 0) break;\n        a = EDGE_STACK[--i];\n        continue;\n      }\n\n      const b0 = b - (b % 3);\n      const al = a0 + ((a + 1) % 3);\n      const bl = b0 + ((b + 2) % 3);\n\n      const p0 = triangles[ar];\n      const pr = triangles[a];\n      const pl = triangles[al];\n      const p1 = triangles[bl];\n\n      const illegal = inCircle(\n        coords[2 * p0],\n        coords[2 * p0 + 1],\n        coords[2 * pr],\n        coords[2 * pr + 1],\n        coords[2 * pl],\n        coords[2 * pl + 1],\n        coords[2 * p1],\n        coords[2 * p1 + 1],\n      );\n\n      if (illegal) {\n        triangles[a] = p1;\n        triangles[b] = p0;\n\n        const hbl = halfedges[bl];\n\n        // edge swapped on the other side of the hull (rare); fix the halfedge reference\n        if (hbl === -1) {\n          let e = this._hullStart;\n          do {\n            if (this._hullTri[e] === bl) {\n              this._hullTri[e] = a;\n              break;\n            }\n            e = this._hullPrev[e];\n          } while (e !== this._hullStart);\n        }\n        this._link(a, hbl);\n        this._link(b, halfedges[ar]);\n        this._link(ar, bl);\n\n        const br = b0 + ((b + 1) % 3);\n\n        // don't worry about hitting the cap: it can only happen on extremely degenerate input\n        if (i < EDGE_STACK.length) {\n          EDGE_STACK[i++] = br;\n        }\n      } else {\n        if (i === 0) break;\n        a = EDGE_STACK[--i];\n      }\n    }\n\n    return ar;\n  }\n\n  _link(a, b) {\n    this._halfedges[a] = b;\n    if (b !== -1) this._halfedges[b] = a;\n  }\n\n  // add a new triangle given vertex indices and adjacent half-edge ids\n  _addTriangle(i0, i1, i2, a, b, c) {\n    const t = this.trianglesLen;\n\n    this._triangles[t] = i0;\n    this._triangles[t + 1] = i1;\n    this._triangles[t + 2] = i2;\n\n    this._link(t, a);\n    this._link(t + 1, b);\n    this._link(t + 2, c);\n\n    this.trianglesLen += 3;\n\n    return t;\n  }\n}\n\n// monotonically increases with real angle, but doesn't need expensive trigonometry\nfunction pseudoAngle(dx, dy) {\n  const p = dx / (Math.abs(dx) + Math.abs(dy));\n  return (dy > 0 ? 3 - p : 1 + p) / 4; // [0..1]\n}\n\nfunction dist(ax, ay, bx, by) {\n  const dx = ax - bx;\n  const dy = ay - by;\n  return dx * dx + dy * dy;\n}\n\n// return 2d orientation sign if we're confident in it through J. Shewchuk's error bound check\nfunction orientIfSure(px, py, rx, ry, qx, qy) {\n  const l = (ry - py) * (qx - px);\n  const r = (rx - px) * (qy - py);\n  return Math.abs(l - r) >= 3.3306690738754716e-16 * Math.abs(l + r) ? l - r : 0;\n}\n\n// a more robust orientation test that's stable in a given triangle (to fix robustness issues)\nfunction orient(rx, ry, qx, qy, px, py) {\n  const sign =\n    orientIfSure(px, py, rx, ry, qx, qy) ||\n    orientIfSure(rx, ry, qx, qy, px, py) ||\n    orientIfSure(qx, qy, px, py, rx, ry);\n  return sign < 0;\n}\n\nfunction inCircle(ax, ay, bx, by, cx, cy, px, py) {\n  const dx = ax - px;\n  const dy = ay - py;\n  const ex = bx - px;\n  const ey = by - py;\n  const fx = cx - px;\n  const fy = cy - py;\n\n  const ap = dx * dx + dy * dy;\n  const bp = ex * ex + ey * ey;\n  const cp = fx * fx + fy * fy;\n\n  return dx * (ey * cp - bp * fy) - dy * (ex * cp - bp * fx) + ap * (ex * fy - ey * fx) < 0;\n}\n\nfunction circumradius(ax, ay, bx, by, cx, cy) {\n  const dx = bx - ax;\n  const dy = by - ay;\n  const ex = cx - ax;\n  const ey = cy - ay;\n\n  const bl = dx * dx + dy * dy;\n  const cl = ex * ex + ey * ey;\n  const d = 0.5 / (dx * ey - dy * ex);\n\n  const x = (ey * bl - dy * cl) * d;\n  const y = (dx * cl - ex * bl) * d;\n\n  return x * x + y * y;\n}\n\nfunction circumcenter(ax, ay, bx, by, cx, cy) {\n  const dx = bx - ax;\n  const dy = by - ay;\n  const ex = cx - ax;\n  const ey = cy - ay;\n\n  const bl = dx * dx + dy * dy;\n  const cl = ex * ex + ey * ey;\n  const d = 0.5 / (dx * ey - dy * ex);\n\n  const x = ax + (ey * bl - dy * cl) * d;\n  const y = ay + (dx * cl - ex * bl) * d;\n\n  return { x, y };\n}\n\nfunction quicksort(ids, dists, left, right) {\n  if (right - left <= 20) {\n    for (let i = left + 1; i <= right; i++) {\n      const temp = ids[i];\n      const tempDist = dists[temp];\n      let j = i - 1;\n      while (j >= left && dists[ids[j]] > tempDist) ids[j + 1] = ids[j--];\n      ids[j + 1] = temp;\n    }\n  } else {\n    const median = (left + right) >> 1;\n    let i = left + 1;\n    let j = right;\n    swap(ids, median, i);\n    if (dists[ids[left]] > dists[ids[right]]) swap(ids, left, right);\n    if (dists[ids[i]] > dists[ids[right]]) swap(ids, i, right);\n    if (dists[ids[left]] > dists[ids[i]]) swap(ids, left, i);\n\n    const temp = ids[i];\n    const tempDist = dists[temp];\n    while (true) {\n      do i++;\n      while (dists[ids[i]] < tempDist);\n      do j--;\n      while (dists[ids[j]] > tempDist);\n      if (j < i) break;\n      swap(ids, i, j);\n    }\n    ids[left + 1] = ids[j];\n    ids[j] = temp;\n\n    if (right - i + 1 >= j - left) {\n      quicksort(ids, dists, i, right);\n      quicksort(ids, dists, left, j - 1);\n    } else {\n      quicksort(ids, dists, left, j - 1);\n      quicksort(ids, dists, i, right);\n    }\n  }\n}\n\nfunction swap(arr, i, j) {\n  const tmp = arr[i];\n  arr[i] = arr[j];\n  arr[j] = tmp;\n}\n\nfunction defaultGetX(p) {\n  return p[0];\n}\nfunction defaultGetY(p) {\n  return p[1];\n}\n\nconst epsilon = 1e-6;\n\nclass Path {\n  constructor() {\n    this._x0 = this._y0 = this._x1 = this._y1 = null; // start of current subpath // end of current subpath\n    this._ = '';\n  }\n  moveTo(x, y) {\n    this._ += `M${(this._x0 = this._x1 = +x)},${(this._y0 = this._y1 = +y)}`;\n  }\n  closePath() {\n    if (this._x1 !== null) {\n      (this._x1 = this._x0), (this._y1 = this._y0);\n      this._ += 'Z';\n    }\n  }\n  lineTo(x, y) {\n    this._ += `L${(this._x1 = +x)},${(this._y1 = +y)}`;\n  }\n  arc(x, y, r) {\n    (x = +x), (y = +y), (r = +r);\n    const x0 = x + r;\n    const y0 = y;\n    if (r < 0) throw new Error('negative radius');\n    if (this._x1 === null) this._ += `M${x0},${y0}`;\n    else if (Math.abs(this._x1 - x0) > epsilon || Math.abs(this._y1 - y0) > epsilon) this._ += 'L' + x0 + ',' + y0;\n    if (!r) return;\n    this._ += `A${r},${r},0,1,1,${x - r},${y}A${r},${r},0,1,1,${(this._x1 = x0)},${(this._y1 = y0)}`;\n  }\n  rect(x, y, w, h) {\n    this._ += `M${(this._x0 = this._x1 = +x)},${(this._y0 = this._y1 = +y)}h${+w}v${+h}h${-w}Z`;\n  }\n  value() {\n    return this._ || null;\n  }\n}\n\nclass Polygon {\n  constructor() {\n    this._ = [];\n  }\n  moveTo(x, y) {\n    this._.push([x, y]);\n  }\n  closePath() {\n    this._.push(this._[0].slice());\n  }\n  lineTo(x, y) {\n    this._.push([x, y]);\n  }\n  value() {\n    return this._.length ? this._ : null;\n  }\n}\n\nexport class Voronoi<P> implements VoronoiI<P> {\n  xmin: number;\n  ymin: number;\n  xmax: number;\n  ymax: number;\n  /**\n   * The Voronoi diagram’s associated Delaunay triangulation.\n   */\n  delaunay: DelaunayI<P>;\n\n  /**\n   * The circumcenters of the Delaunay triangles [cx0, cy0, cx1, cy1, ...].\n   * Each contiguous pair of coordinates cx, cy is the circumcenter for the corresponding triangle.\n   * These circumcenters form the coordinates of the Voronoi cell polygons.\n   */\n  circumcenters: Float64Array;\n\n  /**\n   * An array [vx0, vy0, wx0, wy0, ...] where each non-zero quadruple describes an open (infinite) cell\n   * on the outer hull, giving the directions of two open half-lines.\n   */\n  vectors: Float64Array;\n\n  constructor(delaunay: DelaunayI<P>, [xmin, ymin, xmax, ymax]: Bounds = [0, 0, 960, 500]) {\n    if (!((xmax = +xmax) >= (xmin = +xmin)) || !((ymax = +ymax) >= (ymin = +ymin))) throw new Error('invalid bounds');\n    this.delaunay = delaunay;\n    this._circumcenters = new Float64Array(delaunay.points.length * 2);\n    this.vectors = new Float64Array(delaunay.points.length * 2);\n    (this.xmax = xmax), (this.xmin = xmin);\n    (this.ymax = ymax), (this.ymin = ymin);\n    this._init();\n  }\n  update() {\n    this.delaunay.update();\n    this._init();\n    return this;\n  }\n  _init() {\n    const {\n      delaunay: { points, hull, triangles },\n      vectors,\n    } = this;\n\n    // Compute circumcenters.\n    const circumcenters = (this.circumcenters = this._circumcenters.subarray(0, (triangles.length / 3) * 2));\n    for (let i = 0, j = 0, n = triangles.length, x, y; i < n; i += 3, j += 2) {\n      const t1 = triangles[i] * 2;\n      const t2 = triangles[i + 1] * 2;\n      const t3 = triangles[i + 2] * 2;\n      const x1 = points[t1];\n      const y1 = points[t1 + 1];\n      const x2 = points[t2];\n      const y2 = points[t2 + 1];\n      const x3 = points[t3];\n      const y3 = points[t3 + 1];\n\n      const dx = x2 - x1;\n      const dy = y2 - y1;\n      const ex = x3 - x1;\n      const ey = y3 - y1;\n      const bl = dx * dx + dy * dy;\n      const cl = ex * ex + ey * ey;\n      const ab = (dx * ey - dy * ex) * 2;\n\n      if (!ab) {\n        // degenerate case (collinear diagram)\n        x = (x1 + x3) / 2 - 1e8 * ey;\n        y = (y1 + y3) / 2 + 1e8 * ex;\n      } else if (Math.abs(ab) < 1e-8) {\n        // almost equal points (degenerate triangle)\n        x = (x1 + x3) / 2;\n        y = (y1 + y3) / 2;\n      } else {\n        const d = 1 / ab;\n        x = x1 + (ey * bl - dy * cl) * d;\n        y = y1 + (dx * cl - ex * bl) * d;\n      }\n      circumcenters[j] = x;\n      circumcenters[j + 1] = y;\n    }\n\n    // Compute exterior cell rays.\n    let h = hull[hull.length - 1];\n    let p0,\n      p1 = h * 4;\n    let x0,\n      x1 = points[2 * h];\n    let y0,\n      y1 = points[2 * h + 1];\n    vectors.fill(0);\n    for (let i = 0; i < hull.length; ++i) {\n      h = hull[i];\n      (p0 = p1), (x0 = x1), (y0 = y1);\n      (p1 = h * 4), (x1 = points[2 * h]), (y1 = points[2 * h + 1]);\n      vectors[p0 + 2] = vectors[p1] = y0 - y1;\n      vectors[p0 + 3] = vectors[p1 + 1] = x1 - x0;\n    }\n  }\n  /**\n   * Renders the mesh of Voronoi cells to the specified context.\n   * The specified context must implement the context.moveTo and context.lineTo methods from the CanvasPathMethods API.\n   */\n  render(context: MoveContext & LineContext): void {\n    const buffer = context === null ? (context = new Path()) : undefined;\n    const {\n      delaunay: { halfedges, inedges, hull },\n      circumcenters,\n      vectors,\n    } = this;\n    if (hull.length <= 1) return null;\n    for (let i = 0, n = halfedges.length; i < n; ++i) {\n      const j = halfedges[i];\n      if (j < i) continue;\n      const ti = Math.floor(i / 3) * 2;\n      const tj = Math.floor(j / 3) * 2;\n      const xi = circumcenters[ti];\n      const yi = circumcenters[ti + 1];\n      const xj = circumcenters[tj];\n      const yj = circumcenters[tj + 1];\n      this._renderSegment(xi, yi, xj, yj, context);\n    }\n    let h0,\n      h1 = hull[hull.length - 1];\n    for (let i = 0; i < hull.length; ++i) {\n      (h0 = h1), (h1 = hull[i]);\n      const t = Math.floor(inedges[h1] / 3) * 2;\n      const x = circumcenters[t];\n      const y = circumcenters[t + 1];\n      const v = h0 * 4;\n      const p = this._project(x, y, vectors[v + 2], vectors[v + 3]);\n      if (p) this._renderSegment(x, y, p[0], p[1], context);\n    }\n    return buffer && buffer.value();\n  }\n  /**\n   * Renders the viewport extent to the specified context.\n   * The specified context must implement the context.rect method from the CanvasPathMethods API.\n   * Equivalent to context.rect(voronoi.xmin, voronoi.ymin, voronoi.xmax - voronoi.xmin, voronoi.ymax - voronoi.ymin).\n   */\n  renderBounds(context: RectContext): void {\n    const buffer = context === null ? (context = new Path()) : undefined;\n    context.rect(this.xmin, this.ymin, this.xmax - this.xmin, this.ymax - this.ymin);\n    return buffer && buffer.value();\n  }\n\n  /**\n   * Renders the cell with the specified index i to the specified context.\n   * The specified context must implement the context.moveTo, context.lineTo, and context.closePath methods from the CanvasPathMethods API.\n   */\n  renderCell(i: number, context: MoveContext & LineContext & ClosableContext): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const points = this._clip(i);\n    if (points === null) return;\n    context.moveTo(points[0], points[1]);\n    let n = points.length;\n    while (points[0] === points[n - 2] && points[1] === points[n - 1] && n > 1) n -= 2;\n    for (let i = 2; i < n; i += 2) {\n      if (points[i] !== points[i - 2] || points[i + 1] !== points[i - 1]) context.lineTo(points[i], points[i + 1]);\n    }\n    context.closePath();\n    return buffer && buffer.value();\n  }\n  *cellPolygons() {\n    const {\n      delaunay: { points },\n    } = this;\n    for (let i = 0, n = points.length / 2; i < n; ++i) {\n      const cell = this.cellPolygon(i);\n      if (cell) yield cell;\n    }\n  }\n  cellPolygon(i) {\n    const polygon = new Polygon();\n    this.renderCell(i, polygon);\n    return polygon.value();\n  }\n  _renderSegment(x0, y0, x1, y1, context) {\n    let S;\n    const c0 = this._regioncode(x0, y0);\n    const c1 = this._regioncode(x1, y1);\n    if (c0 === 0 && c1 === 0) {\n      context.moveTo(x0, y0);\n      context.lineTo(x1, y1);\n    } else if ((S = this._clipSegment(x0, y0, x1, y1, c0, c1))) {\n      context.moveTo(S[0], S[1]);\n      context.lineTo(S[2], S[3]);\n    }\n  }\n  contains(i, x, y) {\n    if (((x = +x), x !== x) || ((y = +y), y !== y)) return false;\n    return this.delaunay._step(i, x, y) === i;\n  }\n  *neighbors(i) {\n    const ci = this._clip(i);\n    if (ci)\n      for (const j of this.delaunay.neighbors(i)) {\n        const cj = this._clip(j);\n        // find the common edge\n        if (cj)\n          loop: for (let ai = 0, li = ci.length; ai < li; ai += 2) {\n            for (let aj = 0, lj = cj.length; aj < lj; aj += 2) {\n              if (\n                ci[ai] == cj[aj] &&\n                ci[ai + 1] == cj[aj + 1] &&\n                ci[(ai + 2) % li] == cj[(aj + lj - 2) % lj] &&\n                ci[(ai + 3) % li] == cj[(aj + lj - 1) % lj]\n              ) {\n                yield j;\n                break loop;\n              }\n            }\n          }\n      }\n  }\n  _cell(i) {\n    const {\n      circumcenters,\n      delaunay: { inedges, halfedges, triangles },\n    } = this;\n    const e0 = inedges[i];\n    if (e0 === -1) return null; // coincident point\n    const points = [];\n    let e = e0;\n    do {\n      const t = Math.floor(e / 3);\n      points.push(circumcenters[t * 2], circumcenters[t * 2 + 1]);\n      e = e % 3 === 2 ? e - 2 : e + 1;\n      if (triangles[e] !== i) break; // bad triangulation\n      e = halfedges[e];\n    } while (e !== e0 && e !== -1);\n    return points;\n  }\n  _clip(i) {\n    // degenerate case (1 valid point: return the box)\n    if (i === 0 && this.delaunay.hull.length === 1) {\n      return [this.xmax, this.ymin, this.xmax, this.ymax, this.xmin, this.ymax, this.xmin, this.ymin];\n    }\n    const points = this._cell(i);\n    if (points === null) return null;\n    const { vectors: V } = this;\n    const v = i * 4;\n    return V[v] || V[v + 1]\n      ? this._clipInfinite(i, points, V[v], V[v + 1], V[v + 2], V[v + 3])\n      : this._clipFinite(i, points);\n  }\n  _clipFinite(i, points) {\n    const n = points.length;\n    let P = null;\n    let x0,\n      y0,\n      x1 = points[n - 2],\n      y1 = points[n - 1];\n    let c0,\n      c1 = this._regioncode(x1, y1);\n    let e0, e1;\n    for (let j = 0; j < n; j += 2) {\n      (x0 = x1), (y0 = y1), (x1 = points[j]), (y1 = points[j + 1]);\n      (c0 = c1), (c1 = this._regioncode(x1, y1));\n      if (c0 === 0 && c1 === 0) {\n        (e0 = e1), (e1 = 0);\n        if (P) P.push(x1, y1);\n        else P = [x1, y1];\n      } else {\n        let S, sx0, sy0, sx1, sy1;\n        if (c0 === 0) {\n          if ((S = this._clipSegment(x0, y0, x1, y1, c0, c1)) === null) continue;\n          [sx0, sy0, sx1, sy1] = S;\n        } else {\n          if ((S = this._clipSegment(x1, y1, x0, y0, c1, c0)) === null) continue;\n          [sx1, sy1, sx0, sy0] = S;\n          (e0 = e1), (e1 = this._edgecode(sx0, sy0));\n          if (e0 && e1) this._edge(i, e0, e1, P, P.length);\n          if (P) P.push(sx0, sy0);\n          else P = [sx0, sy0];\n        }\n        (e0 = e1), (e1 = this._edgecode(sx1, sy1));\n        if (e0 && e1) this._edge(i, e0, e1, P, P.length);\n        if (P) P.push(sx1, sy1);\n        else P = [sx1, sy1];\n      }\n    }\n    if (P) {\n      (e0 = e1), (e1 = this._edgecode(P[0], P[1]));\n      if (e0 && e1) this._edge(i, e0, e1, P, P.length);\n    } else if (this.contains(i, (this.xmin + this.xmax) / 2, (this.ymin + this.ymax) / 2)) {\n      return [this.xmax, this.ymin, this.xmax, this.ymax, this.xmin, this.ymax, this.xmin, this.ymin];\n    }\n    return P;\n  }\n  _clipSegment(x0, y0, x1, y1, c0, c1) {\n    while (true) {\n      if (c0 === 0 && c1 === 0) return [x0, y0, x1, y1];\n      if (c0 & c1) return null;\n      let x,\n        y,\n        c = c0 || c1;\n      if (c & 0b1000) (x = x0 + ((x1 - x0) * (this.ymax - y0)) / (y1 - y0)), (y = this.ymax);\n      else if (c & 0b0100) (x = x0 + ((x1 - x0) * (this.ymin - y0)) / (y1 - y0)), (y = this.ymin);\n      else if (c & 0b0010) (y = y0 + ((y1 - y0) * (this.xmax - x0)) / (x1 - x0)), (x = this.xmax);\n      else (y = y0 + ((y1 - y0) * (this.xmin - x0)) / (x1 - x0)), (x = this.xmin);\n      if (c0) (x0 = x), (y0 = y), (c0 = this._regioncode(x0, y0));\n      else (x1 = x), (y1 = y), (c1 = this._regioncode(x1, y1));\n    }\n  }\n  _clipInfinite(i, points, vx0, vy0, vxn, vyn) {\n    let P = Array.from(points),\n      p;\n    if ((p = this._project(P[0], P[1], vx0, vy0))) P.unshift(p[0], p[1]);\n    if ((p = this._project(P[P.length - 2], P[P.length - 1], vxn, vyn))) P.push(p[0], p[1]);\n    if ((P = this._clipFinite(i, P))) {\n      for (let j = 0, n = P.length, c0, c1 = this._edgecode(P[n - 2], P[n - 1]); j < n; j += 2) {\n        (c0 = c1), (c1 = this._edgecode(P[j], P[j + 1]));\n        if (c0 && c1) (j = this._edge(i, c0, c1, P, j)), (n = P.length);\n      }\n    } else if (this.contains(i, (this.xmin + this.xmax) / 2, (this.ymin + this.ymax) / 2)) {\n      P = [this.xmin, this.ymin, this.xmax, this.ymin, this.xmax, this.ymax, this.xmin, this.ymax];\n    }\n    return P;\n  }\n  _edge(i, e0, e1, P, j) {\n    while (e0 !== e1) {\n      let x, y;\n      switch (e0) {\n        case 0b0101:\n          e0 = 0b0100;\n          continue; // top-left\n        case 0b0100:\n          (e0 = 0b0110), (x = this.xmax), (y = this.ymin);\n          break; // top\n        case 0b0110:\n          e0 = 0b0010;\n          continue; // top-right\n        case 0b0010:\n          (e0 = 0b1010), (x = this.xmax), (y = this.ymax);\n          break; // right\n        case 0b1010:\n          e0 = 0b1000;\n          continue; // bottom-right\n        case 0b1000:\n          (e0 = 0b1001), (x = this.xmin), (y = this.ymax);\n          break; // bottom\n        case 0b1001:\n          e0 = 0b0001;\n          continue; // bottom-left\n        case 0b0001:\n          (e0 = 0b0101), (x = this.xmin), (y = this.ymin);\n          break; // left\n      }\n      if ((P[j] !== x || P[j + 1] !== y) && this.contains(i, x, y)) {\n        P.splice(j, 0, x, y), (j += 2);\n      }\n    }\n    if (P.length > 4) {\n      for (let i = 0; i < P.length; i += 2) {\n        const j = (i + 2) % P.length,\n          k = (i + 4) % P.length;\n        if ((P[i] === P[j] && P[j] === P[k]) || (P[i + 1] === P[j + 1] && P[j + 1] === P[k + 1]))\n          P.splice(j, 2), (i -= 2);\n      }\n    }\n    return j;\n  }\n  _project(x0, y0, vx, vy) {\n    let t = Infinity,\n      c,\n      x,\n      y;\n    if (vy < 0) {\n      // top\n      if (y0 <= this.ymin) return null;\n      if ((c = (this.ymin - y0) / vy) < t) (y = this.ymin), (x = x0 + (t = c) * vx);\n    } else if (vy > 0) {\n      // bottom\n      if (y0 >= this.ymax) return null;\n      if ((c = (this.ymax - y0) / vy) < t) (y = this.ymax), (x = x0 + (t = c) * vx);\n    }\n    if (vx > 0) {\n      // right\n      if (x0 >= this.xmax) return null;\n      if ((c = (this.xmax - x0) / vx) < t) (x = this.xmax), (y = y0 + (t = c) * vy);\n    } else if (vx < 0) {\n      // left\n      if (x0 <= this.xmin) return null;\n      if ((c = (this.xmin - x0) / vx) < t) (x = this.xmin), (y = y0 + (t = c) * vy);\n    }\n    return [x, y];\n  }\n  _edgecode(x, y) {\n    return (\n      (x === this.xmin ? 0b0001 : x === this.xmax ? 0b0010 : 0b0000) |\n      (y === this.ymin ? 0b0100 : y === this.ymax ? 0b1000 : 0b0000)\n    );\n  }\n  _regioncode(x, y) {\n    return (\n      (x < this.xmin ? 0b0001 : x > this.xmax ? 0b0010 : 0b0000) |\n      (y < this.ymin ? 0b0100 : y > this.ymax ? 0b1000 : 0b0000)\n    );\n  }\n}\n\nconst tau = 2 * Math.PI;\n\nfunction pointX(p) {\n  return p[0];\n}\n\nfunction pointY(p) {\n  return p[1];\n}\n\n// A triangulation is collinear if all its triangles have a non-null area\nfunction collinear(d) {\n  const { triangles, coords } = d;\n  for (let i = 0; i < triangles.length; i += 3) {\n    const a = 2 * triangles[i],\n      b = 2 * triangles[i + 1],\n      c = 2 * triangles[i + 2],\n      cross =\n        (coords[c] - coords[a]) * (coords[b + 1] - coords[a + 1]) -\n        (coords[b] - coords[a]) * (coords[c + 1] - coords[a + 1]);\n    if (cross > 1e-10) return false;\n  }\n  return true;\n}\n\nfunction jitter(x, y, r) {\n  return [x + Math.sin(x + y) * r, y + Math.cos(x - y) * r];\n}\n\nexport class Delaunay<P> implements DelaunayI<P> {\n  /**\n   * The coordinates of the points as an array [x0, y0, x1, y1, ...].\n   * Typically, this is a Float64Array, however you can use any array-like type in the constructor.\n   */\n  points: ArrayLike<number>;\n\n  /**\n   * The halfedge indices as an Int32Array [j0, j1, ...].\n   * For each index 0 <= i < halfedges.length, there is a halfedge from triangle vertex j = halfedges[i] to triangle vertex i.\n   */\n  halfedges: Int32Array;\n\n  /**\n   * An arbitrary node on the convex hull.\n   * The convex hull is represented as a circular doubly-linked list of nodes.\n   */\n  hull: Node;\n\n  /**\n   * The triangle vertex indices as an Uint32Array [i0, j0, k0, i1, j1, k1, ...].\n   * Each contiguous triplet of indices i, j, k forms a counterclockwise triangle.\n   * The coordinates of the triangle's points can be found by going through 'points'.\n   */\n  triangles: Uint32Array;\n\n  /**\n   * The incoming halfedge indexes as a Int32Array [e0, e1, e2, ...].\n   * For each point i, inedges[i] is the halfedge index e of an incoming halfedge.\n   * For coincident points, the halfedge index is -1; for points on the convex hull, the incoming halfedge is on the convex hull; for other points, the choice of incoming halfedge is arbitrary.\n   */\n  inedges: Int32Array;\n\n  /**\n   * The outgoing halfedge indexes as a Int32Array [e0, e1, e2, ...].\n   * For each point i on the convex hull, outedges[i] is the halfedge index e of the corresponding outgoing halfedge; for other points, the halfedge index is -1.\n   */\n  outedges: Int32Array;\n  /**\n   * Returns the Delaunay triangulation for the given array or iterable of points.\n   * Otherwise, the getX and getY functions are invoked for each point in order, and must return the respective x- and y-coordinate for each point.\n   * If that is specified, the functions getX and getY are invoked with that as this.\n   * (See Array.from for reference.)\n   */\n  static from<P>(\n    points: ArrayLike<P> | Iterable<P>,\n    fx: GetCoordinate<P, ArrayLike<P> | Iterable<P>> = pointX,\n    fy: GetCoordinate<P, ArrayLike<P> | Iterable<P>> = pointY,\n    that?: any,\n  ): Delaunay<P> {\n    return new Delaunay(\n      'length' in points ? flatArray(points, fx, fy, that) : Float64Array.from(flatIterable(points, fx, fy, that)),\n    );\n  }\n  /**\n   * Returns the Delaunay triangulation for the given flat array [x0, y0, x1, y1, …] of points.\n   */\n  constructor(points: ArrayLike<number>) {\n    this._delaunator = new Delaunator(points);\n    this.inedges = new Int32Array(points.length / 2);\n    this._hullIndex = new Int32Array(points.length / 2);\n    this.points = this._delaunator.coords;\n    this._init();\n  }\n  update() {\n    this._delaunator.update();\n    this._init();\n    return this;\n  }\n  _init() {\n    const d = this._delaunator,\n      points = this.points;\n\n    // check for collinear\n    if (d.hull && d.hull.length > 2 && collinear(d)) {\n      this.collinear = Int32Array.from({ length: points.length / 2 }, (_, i) => i).sort(\n        (i, j) => points[2 * i] - points[2 * j] || points[2 * i + 1] - points[2 * j + 1],\n      ); // for exact neighbors\n      const e = this.collinear[0],\n        f = this.collinear[this.collinear.length - 1],\n        bounds = [points[2 * e], points[2 * e + 1], points[2 * f], points[2 * f + 1]],\n        r = 1e-8 * Math.sqrt((bounds[3] - bounds[1]) ** 2 + (bounds[2] - bounds[0]) ** 2);\n      for (let i = 0, n = points.length / 2; i < n; ++i) {\n        const p = jitter(points[2 * i], points[2 * i + 1], r);\n        points[2 * i] = p[0];\n        points[2 * i + 1] = p[1];\n      }\n      this._delaunator = new Delaunator(points);\n    } else {\n      delete this.collinear;\n    }\n\n    const halfedges = (this.halfedges = this._delaunator.halfedges);\n    const hull = (this.hull = this._delaunator.hull);\n    const triangles = (this.triangles = this._delaunator.triangles);\n    const inedges = this.inedges.fill(-1);\n    const hullIndex = this._hullIndex.fill(-1);\n\n    // Compute an index from each point to an (arbitrary) incoming halfedge\n    // Used to give the first neighbor of each point; for this reason,\n    // on the hull we give priority to exterior halfedges\n    for (let e = 0, n = halfedges.length; e < n; ++e) {\n      const p = triangles[e % 3 === 2 ? e - 2 : e + 1];\n      if (halfedges[e] === -1 || inedges[p] === -1) inedges[p] = e;\n    }\n    for (let i = 0, n = hull.length; i < n; ++i) {\n      hullIndex[hull[i]] = i;\n    }\n\n    // degenerate case: 1 or 2 (distinct) points\n    if (hull.length <= 2 && hull.length > 0) {\n      this.triangles = new Int32Array(3).fill(-1);\n      this.halfedges = new Int32Array(3).fill(-1);\n      this.triangles[0] = hull[0];\n      this.triangles[1] = hull[1];\n      this.triangles[2] = hull[1];\n      inedges[hull[0]] = 1;\n      if (hull.length === 2) inedges[hull[1]] = 0;\n    }\n  }\n  voronoi(bounds) {\n    return new Voronoi(this, bounds);\n  }\n  *neighbors(i) {\n    const { inedges, hull, _hullIndex, halfedges, triangles, collinear } = this;\n\n    // degenerate case with several collinear points\n    if (collinear) {\n      const l = collinear.indexOf(i);\n      if (l > 0) yield collinear[l - 1];\n      if (l < collinear.length - 1) yield collinear[l + 1];\n      return;\n    }\n\n    const e0 = inedges[i];\n    if (e0 === -1) return; // coincident point\n    let e = e0,\n      p0 = -1;\n    do {\n      yield (p0 = triangles[e]);\n      e = e % 3 === 2 ? e - 2 : e + 1;\n      if (triangles[e] !== i) return; // bad triangulation\n      e = halfedges[e];\n      if (e === -1) {\n        const p = hull[(_hullIndex[i] + 1) % hull.length];\n        if (p !== p0) yield p;\n        return;\n      }\n    } while (e !== e0);\n  }\n  find(x, y, i = 0) {\n    if (((x = +x), x !== x) || ((y = +y), y !== y)) return -1;\n    const i0 = i;\n    let c;\n    while ((c = this._step(i, x, y)) >= 0 && c !== i && c !== i0) i = c;\n    return c;\n  }\n  _step(i, x, y) {\n    const { inedges, hull, _hullIndex, halfedges, triangles, points } = this;\n    if (inedges[i] === -1 || !points.length) return (i + 1) % (points.length >> 1);\n    let c = i;\n    let dc = (x - points[i * 2]) ** 2 + (y - points[i * 2 + 1]) ** 2;\n    const e0 = inedges[i];\n    let e = e0;\n    do {\n      let t = triangles[e];\n      const dt = (x - points[t * 2]) ** 2 + (y - points[t * 2 + 1]) ** 2;\n      if (dt < dc) (dc = dt), (c = t);\n      e = e % 3 === 2 ? e - 2 : e + 1;\n      if (triangles[e] !== i) break; // bad triangulation\n      e = halfedges[e];\n      if (e === -1) {\n        e = hull[(_hullIndex[i] + 1) % hull.length];\n        if (e !== t) {\n          if ((x - points[e * 2]) ** 2 + (y - points[e * 2 + 1]) ** 2 < dc) return e;\n        }\n        break;\n      }\n    } while (e !== e0);\n    return c;\n  }\n  /**\n   * Renders the edges of the Delaunay triangulation to the specified context.\n   * The specified context must implement the context.moveTo and context.lineTo methods from the CanvasPathMethods API.\n   */\n  render(context: MoveContext & LineContext): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const { points, halfedges, triangles } = this;\n    for (let i = 0, n = halfedges.length; i < n; ++i) {\n      const j = halfedges[i];\n      if (j < i) continue;\n      const ti = triangles[i] * 2;\n      const tj = triangles[j] * 2;\n      context.moveTo(points[ti], points[ti + 1]);\n      context.lineTo(points[tj], points[tj + 1]);\n    }\n    this.renderHull(context);\n    return buffer && buffer.value();\n  }\n  /**\n   * Renders the input points of the Delaunay triangulation to the specified context as circles with the specified radius.\n   * If radius is not specified, it defaults to 2.\n   * The specified context must implement the context.moveTo and context.arc methods from the CanvasPathMethods API.\n   */\n  renderPoints(context: MoveContext & ArcContext, r?: number): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const { points } = this;\n    for (let i = 0, n = points.length; i < n; i += 2) {\n      const x = points[i],\n        y = points[i + 1];\n      context.moveTo(x + r, y);\n      context.arc(x, y, r, 0, tau);\n    }\n    return buffer && buffer.value();\n  }\n  /**\n   * Renders the convex hull of the Delaunay triangulation to the specified context.\n   * The specified context must implement the context.moveTo and context.lineTo methods from the CanvasPathMethods API.\n   */\n  renderHull(context: MoveContext & LineContext): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const { hull, points } = this;\n    const h = hull[0] * 2,\n      n = hull.length;\n    context.moveTo(points[h], points[h + 1]);\n    for (let i = 1; i < n; ++i) {\n      const h = 2 * hull[i];\n      context.lineTo(points[h], points[h + 1]);\n    }\n    context.closePath();\n    return buffer && buffer.value();\n  }\n  hullPolygon() {\n    const polygon = new Polygon();\n    this.renderHull(polygon);\n    return polygon.value();\n  }\n  /**\n   * Renders triangle i of the Delaunay triangulation to the specified context.\n   * The specified context must implement the context.moveTo, context.lineTo and context.closePath methods from the CanvasPathMethods API.\n   */\n  renderTriangle(i: number, context: MoveContext & LineContext & ClosableContext): void {\n    const buffer = context == null ? (context = new Path()) : undefined;\n    const { points, triangles } = this;\n    const t0 = triangles[(i *= 3)] * 2;\n    const t1 = triangles[i + 1] * 2;\n    const t2 = triangles[i + 2] * 2;\n    context.moveTo(points[t0], points[t0 + 1]);\n    context.lineTo(points[t1], points[t1 + 1]);\n    context.lineTo(points[t2], points[t2 + 1]);\n    context.closePath();\n    return buffer && buffer.value();\n  }\n  *trianglePolygons() {\n    const { triangles } = this;\n    for (let i = 0, n = triangles.length / 3; i < n; ++i) {\n      yield this.trianglePolygon(i);\n    }\n  }\n  trianglePolygon(i) {\n    const polygon = new Polygon();\n    this.renderTriangle(i, polygon);\n    return polygon.value();\n  }\n}\n\nfunction flatArray(points, fx, fy, that) {\n  const n = points.length;\n  const array = new Float64Array(n * 2);\n  for (let i = 0; i < n; ++i) {\n    const p = points[i];\n    array[i * 2] = fx.call(that, p, i, points);\n    array[i * 2 + 1] = fy.call(that, p, i, points);\n  }\n  return array;\n}\n\nfunction* flatIterable(points, fx, fy, that) {\n  let i = 0;\n  for (const p of points) {\n    yield fx.call(that, p, i, points);\n    yield fy.call(that, p, i, points);\n    ++i;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { groupBy, GroupKeysOrKeyFn } from '../../chart_types/xy_chart/utils/group_data_series';\nimport { isFiniteNumber } from '../common';\n\n/**\n * The function computes the participation ratio of a value in the total sum of its membership group.\n * It returns a shallow copy of the input array where each object is augmented with the computed ratio.\n *\n * @remarks\n * The ratio is computed using absolute values.\n * Product A made a profit of $200, and product B has a loss of $300. In total, the company lost $100 ($200 – $300).\n * Product A has a weight of: abs(200) / ( abs(200) + abs(-300) ) * 100% = 40%\n * Product B has a weight of: abs(-300) / ( abs(200) + abs(-300) ) * 100% = 60%\n * Product A and product B have respectively a weight of 40% and 60% in the formation of the overall total loss of $100.\n *\n * We don't compute the ratio for non-finite values. In this case, we return the original non-finite value.\n *\n * If the sum of the group values is 0, each ratio is considered 0.\n *\n * @public\n * @param data - an array of objects\n * @param groupAccessors - an array of accessor keys or a fn to describe an unique id for each group\n * @param valueGetterSetters - an array of getter and setter functions for the metric and ratio values\n */\nexport function computeRatioByGroups<T extends Record<string, unknown>>(\n  data: T[],\n  groupAccessors: GroupKeysOrKeyFn<T>,\n  valueGetterSetters: Array<[(datum: T) => unknown, (datum: T, value: number) => T]>,\n): T[] {\n  return groupBy(data, groupAccessors, true).flatMap((groupedData) => {\n    const groupSum = groupedData.reduce((sum, datum) => {\n      return (\n        valueGetterSetters.reduce((valueSum, [getter]) => {\n          const value = getter(datum);\n          return valueSum + (isFiniteNumber(value) ? Math.abs(value) : 0);\n        }, 0) + sum\n      );\n    }, 0);\n    return groupedData.map((datum) => {\n      return valueGetterSetters.reduce<T>((acc, [getter, setter]) => {\n        const value = getter(acc);\n        return isFiniteNumber(value) ? setter(acc, groupSum === 0 ? 0 : Math.abs(value) / groupSum) : acc;\n      }, datum);\n    });\n  });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment-timezone';\n\n/** @internal */\nexport function getMomentWithTz(date: number | Date, timeZone?: string) {\n  if (timeZone === 'local' || !timeZone) {\n    return moment(date);\n  }\n  if (timeZone.toLowerCase().startsWith('utc+') || timeZone.toLowerCase().startsWith('utc-')) {\n    return moment(date).utcOffset(Number(timeZone.slice(3)));\n  }\n  return moment.tz(date, timeZone);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment-timezone';\n\nimport { getMomentWithTz } from './date_time';\nimport { TickFormatter, TickFormatterOptions } from '../../chart_types/xy_chart/utils/specs';\n\n/** @public */\nexport function timeFormatter(format: string): TickFormatter {\n  return (value: number, options?: TickFormatterOptions): string =>\n    getMomentWithTz(value, options && options.timeZone).format(format);\n}\n\n/** @public */\nexport function niceTimeFormatter(domain: [number, number]): TickFormatter {\n  const minDate = moment(domain[0]);\n  const maxDate = moment(domain[1]);\n  const diff = maxDate.diff(minDate, 'days');\n  const format = niceTimeFormatByDay(diff);\n  return timeFormatter(format);\n}\n\n/** @public */\nexport function niceTimeFormatByDay(days: number) {\n  if (days > 30) return 'YYYY-MM-DD';\n  if (days > 7) return 'MMMM DD';\n  if (days > 1) return 'MM-DD HH:mm';\n  return 'HH:mm:ss';\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Simple1DNoise } from './simple_noise';\n\n/** @public */\nexport type RandomNumberGenerator = (\n  min?: number,\n  max?: number,\n  fractionDigits?: number,\n  inclusive?: boolean,\n) => number;\n\nfunction defaultRNG(min = 0, max = 1, fractionDigits = 0, inclusive = true) {\n  const precision = Math.pow(10, Math.max(fractionDigits, 0));\n  const scaledMax = max * precision;\n  const scaledMin = min * precision;\n  const offset = inclusive ? 1 : 0;\n  const num = Math.floor(Math.random() * (scaledMax - scaledMin + offset)) + scaledMin;\n\n  return num / precision;\n}\n\nconst fillGroups = (n: number) => new Array(Math.max(n, 1)).fill(0).map((_, i) => String.fromCharCode(97 + i));\n\n/** @public */\nexport class DataGenerator {\n  private randomNumberGenerator: RandomNumberGenerator;\n\n  private generator: Simple1DNoise;\n\n  private frequency: number;\n\n  constructor(frequency = 500, randomNumberGenerator: RandomNumberGenerator = defaultRNG) {\n    this.randomNumberGenerator = randomNumberGenerator;\n    this.generator = new Simple1DNoise(this.randomNumberGenerator);\n    this.frequency = frequency;\n  }\n\n  generateBasicSeries(totalPoints = 50, offset = 0, amplitude = 1) {\n    const dataPoints = new Array(totalPoints).fill(0).map((_, i) => ({\n      x: i,\n      y: (this.generator.getValue(i) + offset) * amplitude,\n    }));\n    return dataPoints;\n  }\n\n  generateSimpleSeries(totalPoints = 50, groupIndex = 1, groupPrefix = '') {\n    const group = String.fromCharCode(97 + groupIndex);\n    const dataPoints = new Array(totalPoints).fill(0).map((_, i) => ({\n      x: i,\n      y: 3 + Math.sin(i / this.frequency) + this.generator.getValue(i),\n      g: `${groupPrefix}${group}`,\n    }));\n    return dataPoints;\n  }\n\n  generateGroupedSeries(totalPoints = 50, totalGroups = 2, groupPrefix = '') {\n    const groups = new Array(totalGroups).fill(0).map((_, i) => this.generateSimpleSeries(totalPoints, i, groupPrefix));\n    return groups.reduce((acc, curr) => [...acc, ...curr]);\n  }\n\n  generateRandomSeries(totalPoints = 50, groupIndex = 1, groupPrefix = '') {\n    const group = String.fromCharCode(97 + groupIndex);\n    const dataPoints = new Array(totalPoints).fill(0).map(() => ({\n      x: this.randomNumberGenerator(0, 100),\n      y: this.randomNumberGenerator(0, 100),\n      z: this.randomNumberGenerator(0, 100),\n      g: `${groupPrefix}${group}`,\n    }));\n    return dataPoints;\n  }\n\n  generateRandomGroupedSeries(totalPoints = 50, totalGroups = 2, groupPrefix = '') {\n    const groups = new Array(totalGroups).fill(0).map((_, i) => this.generateRandomSeries(totalPoints, i, groupPrefix));\n    return groups.reduce((acc, curr) => [...acc, ...curr]);\n  }\n\n  /**\n   * Generate data given a list or number of vertical and/or horizontal panels\n   */\n  generateSMGroupedSeries<T extends Record<string, any>>(\n    verticalGroups: Array<number | string> | number,\n    horizontalGroups: Array<number | string> | number,\n    seriesGenerator: (h: string | number, v: string | number) => T[],\n  ) {\n    const vGroups = typeof verticalGroups === 'number' ? fillGroups(verticalGroups) : verticalGroups;\n    const hGroups = typeof horizontalGroups === 'number' ? fillGroups(horizontalGroups) : horizontalGroups;\n\n    return vGroups.flatMap((v) => {\n      return hGroups.flatMap((h) => {\n        return seriesGenerator(h, v).map((row) => ({\n          h,\n          v,\n          ...row,\n        }));\n      });\n    });\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { RandomNumberGenerator } from './data_generator';\n\n/** @internal */\nexport class Simple1DNoise {\n  private maxVertices: number;\n\n  private maxVerticesMask: number;\n\n  private amplitude: number;\n\n  private scale: number;\n\n  private getRandomNumber: RandomNumberGenerator;\n\n  constructor(randomNumberGenerator: RandomNumberGenerator, maxVertices = 256, amplitude = 5.1, scale = 0.6) {\n    this.getRandomNumber = randomNumberGenerator;\n    this.maxVerticesMask = maxVertices - 1;\n    this.amplitude = amplitude;\n    this.scale = scale;\n    this.maxVertices = maxVertices;\n  }\n\n  getValue(x: number) {\n    const r = new Array(this.maxVertices).fill(0).map(() => this.getRandomNumber(0, 1, 5, true));\n\n    const scaledX = x * this.scale;\n    const xFloor = Math.floor(scaledX);\n    const t = scaledX - xFloor;\n    const tRemapSmoothstep = t * t * (3 - 2 * t);\n\n    const xMin = xFloor & this.maxVerticesMask;\n    const xMax = (xMin + 1) & this.maxVerticesMask;\n\n    const y = this.lerp(r[xMin] ?? 0, r[xMax] ?? 0, tRemapSmoothstep);\n\n    return y * this.amplitude;\n  }\n\n  private lerp(a: number, b: number, t: number) {\n    return a * (1 - t) + b * t;\n  }\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/**\n * data taken from https://www.data-to-viz.com/graph/streamgraph.html\n * @internal\n */\nexport const BABYNAME_DATA: [year: number, sex: 'F' | 'M', name: string, n1: number, n2: number][] = [\n  [1880, 'F', 'Helen', 636, 0.00651612638826278],\n  [1880, 'F', 'Amanda', 241, 0.00246916109995492],\n  [1880, 'F', 'Betty', 117, 0.00119872136387853],\n  [1880, 'F', 'Dorothy', 112, 0.00114749395516577],\n  [1880, 'F', 'Linda', 27, 0.000276628007048891],\n  [1880, 'F', 'Deborah', 12, 0.000122945780910618],\n  [1880, 'F', 'Jessica', 7, 7.17183721978607e-5],\n  [1881, 'F', 'Helen', 612, 0.00619088564058469],\n  [1881, 'F', 'Amanda', 263, 0.0026604622932578],\n  [1881, 'F', 'Betty', 112, 0.00113297253553184],\n  [1881, 'F', 'Dorothy', 109, 0.00110262505690152],\n  [1881, 'F', 'Linda', 38, 0.000384401395984017],\n  [1881, 'F', 'Deborah', 14, 0.00014162156694148],\n  [1881, 'F', 'Jessica', 7, 7.081078347074e-5],\n  [1882, 'F', 'Helen', 838, 0.00724311990042871],\n  [1882, 'F', 'Amanda', 288, 0.00248928225694925],\n  [1882, 'F', 'Betty', 123, 0.00106313096390541],\n  [1882, 'F', 'Dorothy', 115, 0.000993984234545706],\n  [1882, 'F', 'Linda', 36, 0.000311160282118656],\n  [1882, 'F', 'Deborah', 15, 0.00012965011754944],\n  [1882, 'F', 'Jessica', 8, 6.91467293597013e-5],\n  [1883, 'F', 'Helen', 862, 0.0071798032633955],\n  [1883, 'F', 'Amanda', 287, 0.00239049134175697],\n  [1883, 'F', 'Dorothy', 141, 0.00117442257556701],\n  [1883, 'F', 'Betty', 120, 0.000999508574950649],\n  [1883, 'F', 'Linda', 49, 0.000408132668104848],\n  [1883, 'F', 'Deborah', 16, 0.00013326780999342],\n  [1883, 'F', 'Jessica', 6, 4.99754287475325e-5],\n  [1884, 'F', 'Helen', 986, 0.00716642681668193],\n  [1884, 'F', 'Amanda', 337, 0.00244937711685782],\n  [1884, 'F', 'Dorothy', 163, 0.00118471356097277],\n  [1884, 'F', 'Betty', 144, 0.00104661811521521],\n  [1884, 'F', 'Linda', 33, 0.000239849984736819],\n  [1884, 'F', 'Jessica', 14, 0.000101754538979257],\n  [1884, 'F', 'Deborah', 13, 9.44863576235954e-5],\n  [1884, 'F', 'Patricia', 6, 4.36090881339671e-5],\n  [1885, 'F', 'Helen', 1134, 0.00798878470436565],\n  [1885, 'F', 'Amanda', 339, 0.0023881816708818],\n  [1885, 'F', 'Dorothy', 196, 0.00138077760322369],\n  [1885, 'F', 'Betty', 155, 0.0010919414719371],\n  [1885, 'F', 'Linda', 60, 0.000422687021395008],\n  [1885, 'F', 'Deborah', 10, 7.0447836899168e-5],\n  [1885, 'F', 'Jessica', 6, 4.22687021395008e-5],\n  [1885, 'F', 'Patricia', 5, 3.5223918449584e-5],\n  [1886, 'F', 'Helen', 1267, 0.00824140084300359],\n  [1886, 'F', 'Amanda', 370, 0.0024067232138211],\n  [1886, 'F', 'Dorothy', 230, 0.00149607118696987],\n  [1886, 'F', 'Betty', 167, 0.00108627777488682],\n  [1886, 'F', 'Linda', 49, 0.000318728209397929],\n  [1886, 'F', 'Jessica', 11, 7.15512306811677e-5],\n  [1886, 'F', 'Deborah', 10, 6.50465733465161e-5],\n  [1886, 'F', 'Patricia', 8, 5.20372586772129e-5],\n  [1887, 'F', 'Helen', 1405, 0.00903990426065808],\n  [1887, 'F', 'Amanda', 338, 0.00217472429900529],\n  [1887, 'F', 'Dorothy', 272, 0.00175007399209893],\n  [1887, 'F', 'Betty', 178, 0.00114526900953533],\n  [1887, 'F', 'Linda', 50, 0.000321704777959362],\n  [1887, 'F', 'Deborah', 15, 9.65114333878087e-5],\n  [1887, 'F', 'Patricia', 10, 6.43409555918724e-5],\n  [1887, 'F', 'Jessica', 8, 5.1472764473498e-5],\n  [1888, 'F', 'Helen', 1847, 0.0097494286000834],\n  [1888, 'F', 'Amanda', 404, 0.0021325225524817],\n  [1888, 'F', 'Dorothy', 373, 0.00196888839622691],\n  [1888, 'F', 'Betty', 214, 0.00112960353027496],\n  [1888, 'F', 'Linda', 77, 0.000406446130052205],\n  [1888, 'F', 'Deborah', 26, 0.000137241550407238],\n  [1888, 'F', 'Jessica', 18, 9.50133810511647e-5],\n  [1888, 'F', 'Patricia', 12, 6.33422540341098e-5],\n  [1889, 'F', 'Helen', 1909, 0.010088838858677],\n  [1889, 'F', 'Amanda', 413, 0.00218265607576406],\n  [1889, 'F', 'Dorothy', 377, 0.00199240034034637],\n  [1889, 'F', 'Betty', 189, 0.000998842610942876],\n  [1889, 'F', 'Linda', 74, 0.000391081233914142],\n  [1889, 'F', 'Patricia', 17, 8.9842986169465e-5],\n  [1889, 'F', 'Deborah', 12, 6.34185784725635e-5],\n  [1889, 'F', 'Jessica', 9, 4.75639338544226e-5],\n  [1890, 'F', 'Helen', 2312, 0.0114647849608997],\n  [1890, 'F', 'Dorothy', 458, 0.00227113819727166],\n  [1890, 'F', 'Amanda', 392, 0.00194385627364736],\n  [1890, 'F', 'Betty', 216, 0.00107110447731589],\n  [1890, 'F', 'Linda', 54, 0.000267776119328973],\n  [1890, 'F', 'Deborah', 24, 0.000119011608590655],\n  [1890, 'F', 'Jessica', 18, 8.9258706442991e-5],\n  [1890, 'F', 'Patricia', 11, 5.45469872707167e-5],\n  [1891, 'F', 'Helen', 2417, 0.0122960619025574],\n  [1891, 'F', 'Dorothy', 566, 0.00287942533589056],\n  [1891, 'F', 'Amanda', 371, 0.00188739717246537],\n  [1891, 'F', 'Betty', 239, 0.00121587041568524],\n  [1891, 'F', 'Linda', 78, 0.000396811265370077],\n  [1891, 'F', 'Deborah', 15, 7.63098587250149e-5],\n  [1891, 'F', 'Jessica', 14, 7.12225348100139e-5],\n  [1891, 'F', 'Patricia', 12, 6.10478869800119e-5],\n  [1892, 'F', 'Helen', 2936, 0.0130538203321255],\n  [1892, 'F', 'Dorothy', 626, 0.00278327368116844],\n  [1892, 'F', 'Amanda', 455, 0.00202298646155214],\n  [1892, 'F', 'Betty', 255, 0.00113376164328746],\n  [1892, 'F', 'Linda', 83, 0.000369028299579841],\n  [1892, 'F', 'Patricia', 21, 9.33686059177912e-5],\n  [1892, 'F', 'Deborah', 16, 7.11379854611742e-5],\n  [1892, 'F', 'Jessica', 14, 6.22457372785274e-5],\n  [1893, 'F', 'Helen', 3249, 0.0144251260922071],\n  [1893, 'F', 'Dorothy', 821, 0.00364513035447894],\n  [1893, 'F', 'Amanda', 387, 0.00171822831569226],\n  [1893, 'F', 'Betty', 298, 0.00132308020174753],\n  [1893, 'F', 'Linda', 82, 0.000364069048803012],\n  [1893, 'F', 'Patricia', 28, 0.000124316260566882],\n  [1893, 'F', 'Deborah', 24, 0.000106556794771613],\n  [1893, 'F', 'Jessica', 15, 6.65979967322583e-5],\n  [1894, 'F', 'Helen', 3676, 0.0155781194378994],\n  [1894, 'F', 'Dorothy', 1052, 0.004458156052413],\n  [1894, 'F', 'Amanda', 418, 0.00177139660637703],\n  [1894, 'F', 'Betty', 298, 0.00126286169545539],\n  [1894, 'F', 'Linda', 94, 0.000398352346888614],\n  [1894, 'F', 'Patricia', 36, 0.00015256047327649],\n  [1894, 'F', 'Deborah', 18, 7.62802366382452e-5],\n  [1894, 'F', 'Jessica', 10, 4.23779092434696e-5],\n  [1895, 'F', 'Helen', 4023, 0.0162803967512049],\n  [1895, 'F', 'Dorothy', 1127, 0.00456077731509022],\n  [1895, 'F', 'Amanda', 431, 0.00174418369370354],\n  [1895, 'F', 'Betty', 350, 0.00141639047052491],\n  [1895, 'F', 'Linda', 96, 0.000388495671915405],\n  [1895, 'F', 'Patricia', 35, 0.000141639047052491],\n  [1895, 'F', 'Jessica', 19, 7.68897683999239e-5],\n  [1895, 'F', 'Deborah', 13, 5.26087889052111e-5],\n  [1896, 'F', 'Helen', 4392, 0.0174290555690039],\n  [1896, 'F', 'Dorothy', 1366, 0.00542078549800987],\n  [1896, 'F', 'Amanda', 367, 0.00145638966161758],\n  [1896, 'F', 'Betty', 342, 0.00135718055660276],\n  [1896, 'F', 'Linda', 104, 0.000412709876861659],\n  [1896, 'F', 'Patricia', 37, 0.000146829475421936],\n  [1896, 'F', 'Deborah', 18, 7.14305556106717e-5],\n  [1896, 'F', 'Jessica', 9, 3.57152778053359e-5],\n  [1897, 'F', 'Helen', 4519, 0.0182015909777464],\n  [1897, 'F', 'Dorothy', 1472, 0.00592890947538012],\n  [1897, 'F', 'Betty', 367, 0.00147819957708186],\n  [1897, 'F', 'Amanda', 354, 0.00142583828416071],\n  [1897, 'F', 'Linda', 81, 0.000326251132816433],\n  [1897, 'F', 'Patricia', 49, 0.000197361796395126],\n  [1897, 'F', 'Deborah', 23, 9.26392105528144e-5],\n  [1897, 'F', 'Jessica', 9, 3.62501258684926e-5],\n  [1898, 'F', 'Helen', 5230, 0.0190774258971497],\n  [1898, 'F', 'Dorothy', 1671, 0.00609529228950997],\n  [1898, 'F', 'Betty', 421, 0.00153567806934991],\n  [1898, 'F', 'Amanda', 371, 0.00135329350054351],\n  [1898, 'F', 'Linda', 102, 0.000372064520365061],\n  [1898, 'F', 'Patricia', 47, 0.000171441494678018],\n  [1898, 'F', 'Deborah', 21, 7.6601518898689e-5],\n  [1898, 'F', 'Jessica', 13, 4.74199878896646e-5],\n  [1899, 'F', 'Helen', 5048, 0.0203967837084327],\n  [1899, 'F', 'Dorothy', 1687, 0.0068164370277587],\n  [1899, 'F', 'Betty', 410, 0.00165663259121581],\n  [1899, 'F', 'Amanda', 326, 0.00131722493838135],\n  [1899, 'F', 'Linda', 98, 0.000395975594973534],\n  [1899, 'F', 'Patricia', 56, 0.000226271768556305],\n  [1899, 'F', 'Jessica', 14, 5.65679421390763e-5],\n  [1899, 'F', 'Deborah', 11, 4.44462402521314e-5],\n  [1900, 'F', 'Helen', 6343, 0.0199606639918181],\n  [1900, 'F', 'Dorothy', 2491, 0.00783887971048698],\n  [1900, 'F', 'Betty', 664, 0.00208952875462198],\n  [1900, 'F', 'Amanda', 377, 0.00118637400676579],\n  [1900, 'F', 'Linda', 126, 0.000396506962473448],\n  [1900, 'F', 'Patricia', 89, 0.000280072378255055],\n  [1900, 'F', 'Deborah', 26, 8.18188970183306e-5],\n  [1900, 'F', 'Jessica', 23, 7.2378255054677e-5],\n  [1901, 'F', 'Helen', 5247, 0.0206386292834891],\n  [1901, 'F', 'Dorothy', 2173, 0.00854731111740458],\n  [1901, 'F', 'Betty', 474, 0.00186443878032663],\n  [1901, 'F', 'Amanda', 317, 0.00124689260203279],\n  [1901, 'F', 'Linda', 86, 0.000338273702759684],\n  [1901, 'F', 'Patricia', 68, 0.000267472230089053],\n  [1901, 'F', 'Deborah', 21, 8.26017181157368e-5],\n  [1901, 'F', 'Jessica', 8, 3.14673211869474e-5],\n  [1902, 'F', 'Helen', 5967, 0.0212853998637335],\n  [1902, 'F', 'Dorothy', 2707, 0.00965637295644822],\n  [1902, 'F', 'Betty', 580, 0.00206896797736977],\n  [1902, 'F', 'Amanda', 301, 0.00107372303653155],\n  [1902, 'F', 'Linda', 91, 0.000324613941276981],\n  [1902, 'F', 'Patricia', 85, 0.000303210824269708],\n  [1902, 'F', 'Deborah', 21, 7.49109095254572e-5],\n  [1902, 'F', 'Jessica', 9, 3.21046755109102e-5],\n  [1903, 'F', 'Helen', 6129, 0.0220310713951934],\n  [1903, 'F', 'Dorothy', 3078, 0.0110640622865729],\n  [1903, 'F', 'Betty', 596, 0.00214235903924543],\n  [1903, 'F', 'Amanda', 247, 0.000887856850157082],\n  [1903, 'F', 'Linda', 90, 0.000323510593174645],\n  [1903, 'F', 'Patricia', 79, 0.000283970409564411],\n  [1903, 'F', 'Deborah', 21, 7.54858050740839e-5],\n  [1903, 'F', 'Jessica', 16, 5.75129943421592e-5],\n  [1904, 'F', 'Helen', 6488, 0.0221858992333418],\n  [1904, 'F', 'Dorothy', 3477, 0.0118896996970298],\n  [1904, 'F', 'Betty', 707, 0.00241760646701181],\n  [1904, 'F', 'Amanda', 294, 0.00100534130311382],\n  [1904, 'F', 'Patricia', 124, 0.000424021501993585],\n  [1904, 'F', 'Linda', 101, 0.000345372352430259],\n  [1904, 'F', 'Deborah', 23, 7.86491495633262e-5],\n  [1904, 'F', 'Jessica', 16, 5.471245187014e-5],\n  [1905, 'F', 'Helen', 6811, 0.0219801852389712],\n  [1905, 'F', 'Dorothy', 3937, 0.0127053280407913],\n  [1905, 'F', 'Betty', 807, 0.0026043179397812],\n  [1905, 'F', 'Amanda', 311, 0.00100364669054765],\n  [1905, 'F', 'Patricia', 121, 0.000390486332978346],\n  [1905, 'F', 'Linda', 106, 0.000342078936328138],\n  [1905, 'F', 'Deborah', 18, 5.80888759802498e-5],\n  [1905, 'F', 'Jessica', 17, 5.48617162035692e-5],\n  [1906, 'F', 'Helen', 7176, 0.0228942608018734],\n  [1906, 'F', 'Dorothy', 4326, 0.013801640500126],\n  [1906, 'F', 'Betty', 865, 0.00275969002140754],\n  [1906, 'F', 'Amanda', 260, 0.000829502202966427],\n  [1906, 'F', 'Patricia', 157, 0.000500891714868189],\n  [1906, 'F', 'Linda', 98, 0.000312658522656576],\n  [1906, 'F', 'Deborah', 25, 7.97598272083103e-5],\n  [1906, 'F', 'Jessica', 18, 5.74270755899834e-5],\n  [1907, 'F', 'Helen', 7579, 0.0224607551721379],\n  [1907, 'F', 'Dorothy', 4967, 0.0147199592215343],\n  [1907, 'F', 'Betty', 1018, 0.00301689520586309],\n  [1907, 'F', 'Amanda', 285, 0.000844612115590354],\n  [1907, 'F', 'Patricia', 177, 0.000524548577050852],\n  [1907, 'F', 'Linda', 102, 0.000302282230842864],\n  [1907, 'F', 'Deborah', 21, 6.22345769382366e-5],\n  [1907, 'F', 'Jessica', 17, 5.03803718071439e-5],\n  [1908, 'F', 'Helen', 8439, 0.0238031438540277],\n  [1908, 'F', 'Dorothy', 5703, 0.0160859496859249],\n  [1908, 'F', 'Betty', 1128, 0.00318165022720029],\n  [1908, 'F', 'Amanda', 260, 0.000733359094922052],\n  [1908, 'F', 'Patricia', 205, 0.000578225440227003],\n  [1908, 'F', 'Linda', 93, 0.000262316907029811],\n  [1908, 'F', 'Deborah', 25, 7.05152975886589e-5],\n  [1908, 'F', 'Jessica', 17, 4.7950402360288e-5],\n  [1909, 'F', 'Helen', 9250, 0.0251291775559769],\n  [1909, 'F', 'Dorothy', 6253, 0.0169873240278404],\n  [1909, 'F', 'Betty', 1082, 0.00293943460708833],\n  [1909, 'F', 'Amanda', 271, 0.000736216985694027],\n  [1909, 'F', 'Patricia', 233, 0.00063298360762623],\n  [1909, 'F', 'Linda', 105, 0.000285250123608387],\n  [1909, 'F', 'Deborah', 26, 7.06333639411244e-5],\n  [1909, 'F', 'Jessica', 18, 4.89000211900092e-5],\n  [1910, 'F', 'Helen', 10479, 0.0249781896712004],\n  [1910, 'F', 'Dorothy', 7318, 0.0174434957547327],\n  [1910, 'F', 'Betty', 1389, 0.00331087942106091],\n  [1910, 'F', 'Patricia', 316, 0.000753231027397587],\n  [1910, 'F', 'Amanda', 278, 0.000662652612710535],\n  [1910, 'F', 'Linda', 137, 0.000326559021371739],\n  [1910, 'F', 'Deborah', 33, 7.8660202228229e-5],\n  [1910, 'F', 'Jessica', 28, 6.67419897694064e-5],\n  [1911, 'F', 'Helen', 11802, 0.0267127194372267],\n  [1911, 'F', 'Dorothy', 8869, 0.0200741491856265],\n  [1911, 'F', 'Betty', 1456, 0.00329551936117625],\n  [1911, 'F', 'Patricia', 325, 0.000735607000262555],\n  [1911, 'F', 'Amanda', 280, 0.000633753723303124],\n  [1911, 'F', 'Linda', 130, 0.000294242800105022],\n  [1911, 'F', 'Deborah', 36, 8.14826215675446e-5],\n  [1911, 'F', 'Jessica', 21, 4.75315292477343e-5],\n  [1912, 'F', 'Helen', 16133, 0.0274974944947061],\n  [1912, 'F', 'Dorothy', 12645, 0.0215524588040388],\n  [1912, 'F', 'Betty', 2011, 0.00342759941913183],\n  [1912, 'F', 'Patricia', 504, 0.000859030386495497],\n  [1912, 'F', 'Amanda', 310, 0.000528371864709532],\n  [1912, 'F', 'Linda', 189, 0.000322136394935811],\n  [1912, 'F', 'Jessica', 36, 6.13593133211069e-5],\n  [1912, 'F', 'Deborah', 32, 5.45416118409839e-5],\n  [1913, 'F', 'Helen', 18889, 0.0288423952212843],\n  [1913, 'F', 'Dorothy', 14674, 0.0224063374173925],\n  [1913, 'F', 'Betty', 2239, 0.00341882168989653],\n  [1913, 'F', 'Patricia', 588, 0.000897841515703065],\n  [1913, 'F', 'Amanda', 346, 0.000528321708219831],\n  [1913, 'F', 'Linda', 238, 0.000363412042070288],\n  [1913, 'F', 'Deborah', 42, 6.41315368359332e-5],\n  [1913, 'F', 'Jessica', 25, 3.81735338309126e-5],\n  [1914, 'F', 'Helen', 23221, 0.0291498453442597],\n  [1914, 'F', 'Dorothy', 18782, 0.0235774684662971],\n  [1914, 'F', 'Betty', 2933, 0.00368186109102595],\n  [1914, 'F', 'Patricia', 656, 0.000823491604402667],\n  [1914, 'F', 'Amanda', 375, 0.000470745962882622],\n  [1914, 'F', 'Linda', 219, 0.000274915642323451],\n  [1914, 'F', 'Deborah', 62, 7.78299991965936e-5],\n  [1914, 'F', 'Jessica', 42, 5.27235478428537e-5],\n  [1915, 'F', 'Helen', 30866, 0.0301460519864594],\n  [1915, 'F', 'Dorothy', 25154, 0.0245672841206311],\n  [1915, 'F', 'Betty', 4182, 0.00408445504462428],\n  [1915, 'F', 'Patricia', 895, 0.000874124166652017],\n  [1915, 'F', 'Amanda', 412, 0.000402390119173889],\n  [1915, 'F', 'Linda', 290, 0.000283235763496184],\n  [1915, 'F', 'Deborah', 106, 0.000103527554933088],\n  [1915, 'F', 'Jessica', 55, 5.37171275596211e-5],\n  [1916, 'F', 'Helen', 32661, 0.0300826741628504],\n  [1916, 'F', 'Dorothy', 27415, 0.0252508040836026],\n  [1916, 'F', 'Betty', 5136, 0.00473055370320565],\n  [1916, 'F', 'Patricia', 1078, 0.000992900485213335],\n  [1916, 'F', 'Amanda', 421, 0.000387765402852332],\n  [1916, 'F', 'Linda', 297, 0.000273554215313878],\n  [1916, 'F', 'Deborah', 90, 8.28952167617813e-5],\n  [1916, 'F', 'Jessica', 53, 4.8816072093049e-5],\n  [1917, 'F', 'Helen', 34249, 0.0304787212268021],\n  [1917, 'F', 'Dorothy', 28853, 0.0256767363589279],\n  [1917, 'F', 'Betty', 6639, 0.00590815002554058],\n  [1917, 'F', 'Patricia', 1441, 0.00128236845711763],\n  [1917, 'F', 'Amanda', 445, 0.000396012465938478],\n  [1917, 'F', 'Linda', 291, 0.000258965455254151],\n  [1917, 'F', 'Deborah', 89, 7.92024931876957e-5],\n  [1917, 'F', 'Jessica', 55, 4.89453609586883e-5],\n  [1917, 'F', 'Ashley', 5, 4.44957826897167e-6],\n  [1918, 'F', 'Helen', 36150, 0.030065795437817],\n  [1918, 'F', 'Dorothy', 32034, 0.026642536405395],\n  [1918, 'F', 'Betty', 8802, 0.00732058454892574],\n  [1918, 'F', 'Patricia', 1760, 0.0014637842315507],\n  [1918, 'F', 'Amanda', 397, 0.000330183147685017],\n  [1918, 'F', 'Linda', 322, 0.00026780597872689],\n  [1918, 'F', 'Deborah', 92, 7.65159939219687e-5],\n  [1918, 'F', 'Jessica', 56, 4.65749528220679e-5],\n  [1919, 'F', 'Helen', 33705, 0.0286936534286809],\n  [1919, 'F', 'Dorothy', 31734, 0.0270157068062827],\n  [1919, 'F', 'Betty', 10107, 0.00860426510024262],\n  [1919, 'F', 'Patricia', 2144, 0.00182522453496786],\n  [1919, 'F', 'Amanda', 379, 0.000322649299791427],\n  [1919, 'F', 'Linda', 282, 0.000240071510662751],\n  [1919, 'F', 'Deborah', 70, 5.95922189588388e-5],\n  [1919, 'F', 'Jessica', 40, 3.40526965479079e-5],\n  [1920, 'F', 'Dorothy', 36645, 0.0294564957018998],\n  [1920, 'F', 'Helen', 35098, 0.0282129645557451],\n  [1920, 'F', 'Betty', 14017, 0.011267340708242],\n  [1920, 'F', 'Patricia', 2502, 0.00201119258414936],\n  [1920, 'F', 'Amanda', 379, 0.000304653073298404],\n  [1920, 'F', 'Linda', 349, 0.000280538054303807],\n  [1920, 'F', 'Deborah', 82, 6.59143852518974e-5],\n  [1920, 'F', 'Jessica', 43, 3.45648605589218e-5],\n  [1921, 'F', 'Dorothy', 39083, 0.0305412051909812],\n  [1921, 'F', 'Helen', 34819, 0.0272091247740648],\n  [1921, 'F', 'Betty', 17637, 0.013782341067813],\n  [1921, 'F', 'Patricia', 3382, 0.00264284614681315],\n  [1921, 'F', 'Amanda', 392, 0.000306326342268112],\n  [1921, 'F', 'Linda', 367, 0.000286790223501013],\n  [1921, 'F', 'Deborah', 94, 7.34558065642922e-5],\n  [1921, 'F', 'Jessica', 48, 3.75093480328301e-5],\n  [1922, 'F', 'Dorothy', 37711, 0.0302285073477132],\n  [1922, 'F', 'Helen', 32507, 0.0260570679205567],\n  [1922, 'F', 'Betty', 20893, 0.0167474796217489],\n  [1922, 'F', 'Patricia', 3902, 0.00312777798708008],\n  [1922, 'F', 'Linda', 365, 0.000292577899867819],\n  [1922, 'F', 'Amanda', 341, 0.000273339900972401],\n  [1922, 'F', 'Deborah', 71, 5.69124133989456e-5],\n  [1922, 'F', 'Jessica', 40, 3.20633314923637e-5],\n  [1923, 'F', 'Dorothy', 39045, 0.0311757435229189],\n  [1923, 'F', 'Helen', 31492, 0.0251449997444938],\n  [1923, 'F', 'Betty', 25990, 0.020751890745567],\n  [1923, 'F', 'Patricia', 4800, 0.00383259236547601],\n  [1923, 'F', 'Linda', 423, 0.000337747202207573],\n  [1923, 'F', 'Amanda', 362, 0.000289041340896316],\n  [1923, 'F', 'Deborah', 118, 9.42178956512852e-5],\n  [1923, 'F', 'Jessica', 52, 4.15197506259901e-5],\n  [1924, 'F', 'Dorothy', 39996, 0.0308678753677503],\n  [1924, 'F', 'Helen', 31193, 0.0240739483034863],\n  [1924, 'F', 'Betty', 30602, 0.0236178298330807],\n  [1924, 'F', 'Patricia', 6958, 0.00537000392061223],\n  [1924, 'F', 'Linda', 454, 0.000350385423966363],\n  [1924, 'F', 'Amanda', 341, 0.000263174955005572],\n  [1924, 'F', 'Deborah', 125, 9.64717576999898e-5],\n  [1924, 'F', 'Jessica', 41, 3.16427365255967e-5],\n  [1925, 'F', 'Dorothy', 38572, 0.030538871901736],\n  [1925, 'F', 'Betty', 32817, 0.0259824266099572],\n  [1925, 'F', 'Helen', 29168, 0.023093379021825],\n  [1925, 'F', 'Patricia', 8095, 0.00640910940694163],\n  [1925, 'F', 'Linda', 438, 0.000346780718992024],\n  [1925, 'F', 'Amanda', 310, 0.000245438408419012],\n  [1925, 'F', 'Deborah', 82, 6.49224177108356e-5],\n  [1925, 'F', 'Jessica', 34, 2.69190512459562e-5],\n  [1926, 'F', 'Dorothy', 36614, 0.0297646484033633],\n  [1926, 'F', 'Betty', 32959, 0.026793386320163],\n  [1926, 'F', 'Helen', 26884, 0.0218548316948713],\n  [1926, 'F', 'Patricia', 8590, 0.0069830755936224],\n  [1926, 'F', 'Linda', 479, 0.000389393854405719],\n  [1926, 'F', 'Amanda', 310, 0.000252008548780319],\n  [1926, 'F', 'Deborah', 116, 9.42999730919904e-5],\n  [1926, 'F', 'Jessica', 35, 2.84525780881006e-5],\n  [1927, 'F', 'Dorothy', 35987, 0.0291075004772119],\n  [1927, 'F', 'Betty', 35422, 0.0286505094035013],\n  [1927, 'F', 'Helen', 25316, 0.0204764354372717],\n  [1927, 'F', 'Patricia', 10553, 0.00853562265640418],\n  [1927, 'F', 'Linda', 516, 0.000417358219530423],\n  [1927, 'F', 'Amanda', 234, 0.000189267099554494],\n  [1927, 'F', 'Deborah', 91, 7.360387204897e-5],\n  [1927, 'F', 'Jessica', 39, 3.15445165924157e-5],\n  [1928, 'F', 'Betty', 36078, 0.0301810713703117],\n  [1928, 'F', 'Dorothy', 33728, 0.0282151775369442],\n  [1928, 'F', 'Helen', 22936, 0.0191871238136667],\n  [1928, 'F', 'Patricia', 12332, 0.0103163415970587],\n  [1928, 'F', 'Linda', 554, 0.000463449014334294],\n  [1928, 'F', 'Amanda', 247, 0.000206627990145434],\n  [1928, 'F', 'Deborah', 130, 0.000108751573760755],\n  [1928, 'F', 'Jessica', 36, 3.01158204260552e-5],\n  [1929, 'F', 'Betty', 36669, 0.0316800016587745],\n  [1929, 'F', 'Dorothy', 31477, 0.0271943988713422],\n  [1929, 'F', 'Helen', 20983, 0.0181281593391166],\n  [1929, 'F', 'Patricia', 13626, 0.0117721154818092],\n  [1929, 'F', 'Linda', 509, 0.000439748039060684],\n  [1929, 'F', 'Amanda', 209, 0.000180564518985625],\n  [1929, 'F', 'Deborah', 161, 0.000139095155773615],\n  [1929, 'F', 'Jessica', 42, 3.62856928105083e-5],\n  [1930, 'F', 'Betty', 38239, 0.0327853532062582],\n  [1930, 'F', 'Dorothy', 30404, 0.0260677810320111],\n  [1930, 'F', 'Helen', 19914, 0.0170738650003772],\n  [1930, 'F', 'Patricia', 15749, 0.0135028773672261],\n  [1930, 'F', 'Linda', 493, 0.000422688332087274],\n  [1930, 'F', 'Amanda', 196, 0.00016804647685417],\n  [1930, 'F', 'Deborah', 165, 0.000141467697351725],\n  [1930, 'F', 'Jessica', 38, 3.25804393900942e-5],\n  [1931, 'F', 'Betty', 36102, 0.0327140362625423],\n  [1931, 'F', 'Dorothy', 26521, 0.0240321576566086],\n  [1931, 'F', 'Helen', 17657, 0.0159999927507537],\n  [1931, 'F', 'Patricia', 16468, 0.0149225735186845],\n  [1931, 'F', 'Linda', 534, 0.000483887190853626],\n  [1931, 'F', 'Amanda', 209, 0.00018938655971612],\n  [1931, 'F', 'Deborah', 158, 0.000143172614522234],\n  [1931, 'F', 'Jessica', 39, 3.53400757365008e-5],\n  [1932, 'F', 'Betty', 34411, 0.0311083227035339],\n  [1932, 'F', 'Dorothy', 24968, 0.0225716370132177],\n  [1932, 'F', 'Patricia', 17991, 0.0162642711272349],\n  [1932, 'F', 'Helen', 16375, 0.0148033705579718],\n  [1932, 'F', 'Linda', 774, 0.000699713515228713],\n  [1932, 'F', 'Amanda', 213, 0.00019255682008232],\n  [1932, 'F', 'Deborah', 208, 0.000188036706934848],\n  [1932, 'F', 'Jessica', 44, 3.97769956977563e-5],\n  [1933, 'F', 'Betty', 31526, 0.0301434985810775],\n  [1933, 'F', 'Dorothy', 22050, 0.0210830471265862],\n  [1933, 'F', 'Patricia', 18625, 0.017808242754316],\n  [1933, 'F', 'Helen', 14645, 0.0140027766516488],\n  [1933, 'F', 'Linda', 786, 0.000751531747913687],\n  [1933, 'F', 'Deborah', 243, 0.000232343784660338],\n  [1933, 'F', 'Amanda', 199, 0.000190273305133363],\n  [1933, 'F', 'Jessica', 43, 4.11143322649981e-5],\n  [1934, 'F', 'Betty', 31078, 0.0287181174191951],\n  [1934, 'F', 'Dorothy', 21280, 0.0196641205573226],\n  [1934, 'F', 'Patricia', 20847, 0.0192640000591402],\n  [1934, 'F', 'Helen', 14099, 0.0130284039350419],\n  [1934, 'F', 'Linda', 1001, 0.000924989881479318],\n  [1934, 'F', 'Deborah', 280, 0.000258738428385823],\n  [1934, 'F', 'Amanda', 189, 0.000174648439160431],\n  [1934, 'F', 'Jessica', 46, 4.25070275205281e-5],\n  [1935, 'F', 'Betty', 28673, 0.0263859454097216],\n  [1935, 'F', 'Patricia', 22876, 0.0210513335609385],\n  [1935, 'F', 'Dorothy', 19400, 0.0178525909722944],\n  [1935, 'F', 'Helen', 12778, 0.0117587838888649],\n  [1935, 'F', 'Linda', 1197, 0.00110152326772353],\n  [1935, 'F', 'Deborah', 279, 0.00025674602480774],\n  [1935, 'F', 'Amanda', 211, 0.000194169932739903],\n  [1935, 'F', 'Jessica', 47, 4.32511224586515e-5],\n  [1936, 'F', 'Betty', 25863, 0.0240043659489396],\n  [1936, 'F', 'Patricia', 23912, 0.022193573776091],\n  [1936, 'F', 'Dorothy', 17668, 0.0163982963146528],\n  [1936, 'F', 'Helen', 12232, 0.0113529522594992],\n  [1936, 'F', 'Linda', 2439, 0.0022637222499116],\n  [1936, 'F', 'Deborah', 299, 0.00027751248574152],\n  [1936, 'F', 'Amanda', 192, 0.000178201997533016],\n  [1936, 'F', 'Jessica', 43, 3.99098223641651e-5],\n  [1937, 'F', 'Patricia', 26837, 0.0243591174914203],\n  [1937, 'F', 'Betty', 25328, 0.0229894447152324],\n  [1937, 'F', 'Dorothy', 16571, 0.0150409858013312],\n  [1937, 'F', 'Helen', 11452, 0.0103946273246542],\n  [1937, 'F', 'Linda', 4380, 0.00397559096070428],\n  [1937, 'F', 'Deborah', 323, 0.000293177141622713],\n  [1937, 'F', 'Amanda', 176, 0.00015974977376346],\n  [1937, 'F', 'Jessica', 72, 6.53521801759607e-5],\n  [1938, 'F', 'Patricia', 27555, 0.0241429070846355],\n  [1938, 'F', 'Betty', 25502, 0.0223441268906687],\n  [1938, 'F', 'Dorothy', 16348, 0.0143236525138676],\n  [1938, 'F', 'Helen', 10833, 0.00949156641073696],\n  [1938, 'F', 'Linda', 7047, 0.00617438091908643],\n  [1938, 'F', 'Deborah', 410, 0.000359230335862841],\n  [1938, 'F', 'Amanda', 192, 0.000168224937769916],\n  [1938, 'F', 'Jessica', 50, 4.38085775442489e-5],\n  [1938, 'F', 'Ashley', 7, 6.13320085619484e-6],\n  [1939, 'F', 'Patricia', 29704, 0.0261941652197148],\n  [1939, 'F', 'Betty', 23639, 0.0208458076901709],\n  [1939, 'F', 'Dorothy', 15170, 0.0133775076212993],\n  [1939, 'F', 'Linda', 10714, 0.00944803010247859],\n  [1939, 'F', 'Helen', 10417, 0.00918612372386778],\n  [1939, 'F', 'Deborah', 443, 0.000390654968769648],\n  [1939, 'F', 'Amanda', 185, 0.000163140336845113],\n  [1939, 'F', 'Jessica', 77, 6.79016537139118e-5],\n  [1940, 'F', 'Patricia', 32661, 0.027650413304301],\n  [1940, 'F', 'Betty', 22074, 0.0186875852937491],\n  [1940, 'F', 'Linda', 18368, 0.0155501298666116],\n  [1940, 'F', 'Dorothy', 14874, 0.0125921511125861],\n  [1940, 'F', 'Helen', 10201, 0.00863604501139508],\n  [1940, 'F', 'Deborah', 469, 0.000397049809856317],\n  [1940, 'F', 'Amanda', 218, 0.000184556201596326],\n  [1940, 'F', 'Jessica', 61, 5.16418729237427e-5],\n  [1941, 'F', 'Patricia', 36901, 0.0296201340816562],\n  [1941, 'F', 'Linda', 23715, 0.0190358385882897],\n  [1941, 'F', 'Betty', 20900, 0.0167762608684484],\n  [1941, 'F', 'Dorothy', 14561, 0.0116879968662908],\n  [1941, 'F', 'Helen', 9889, 0.00793782027407113],\n  [1941, 'F', 'Deborah', 608, 0.000488036679809409],\n  [1941, 'F', 'Amanda', 223, 0.000179000295390622],\n  [1941, 'F', 'Jessica', 81, 6.50180445140824e-5],\n  [1941, 'F', 'Ashley', 6, 4.81615144548759e-6],\n  [1942, 'F', 'Patricia', 39454, 0.0283767212206867],\n  [1942, 'F', 'Linda', 31611, 0.0227357564380576],\n  [1942, 'F', 'Betty', 21654, 0.0155743276046218],\n  [1942, 'F', 'Dorothy', 15032, 0.0108115494852071],\n  [1942, 'F', 'Helen', 10013, 0.00720170602683468],\n  [1942, 'F', 'Deborah', 676, 0.000486203263171901],\n  [1942, 'F', 'Amanda', 295, 0.000212174500940401],\n  [1942, 'F', 'Jessica', 127, 9.13429207438335e-5],\n  [1942, 'F', 'Ashley', 8, 5.7538847712651e-6],\n  [1943, 'F', 'Patricia', 39620, 0.0276053892520138],\n  [1943, 'F', 'Linda', 38437, 0.0267811293962558],\n  [1943, 'F', 'Betty', 21595, 0.0150464003255234],\n  [1943, 'F', 'Dorothy', 14785, 0.0103015063122419],\n  [1943, 'F', 'Helen', 9799, 0.00682749140031507],\n  [1943, 'F', 'Deborah', 788, 0.000549042067909815],\n  [1943, 'F', 'Amanda', 284, 0.000197878105693385],\n  [1943, 'F', 'Jessica', 121, 8.43072210876746e-5],\n  [1943, 'F', 'Ashley', 10, 6.96753893286567e-6],\n  [1944, 'F', 'Linda', 38411, 0.0281104982403037],\n  [1944, 'F', 'Patricia', 36872, 0.0269842048141543],\n  [1944, 'F', 'Betty', 19757, 0.0144588558937201],\n  [1944, 'F', 'Dorothy', 13378, 0.00979048307669114],\n  [1944, 'F', 'Helen', 8693, 0.00636183804647003],\n  [1944, 'F', 'Deborah', 1293, 0.000946262118265933],\n  [1944, 'F', 'Amanda', 238, 0.000174176631204402],\n  [1944, 'F', 'Jessica', 124, 9.07474885266633e-5],\n  [1944, 'F', 'Ashley', 12, 8.78201501870935e-6],\n  [1945, 'F', 'Linda', 41464, 0.0308041820109342],\n  [1945, 'F', 'Patricia', 35840, 0.0266260342290151],\n  [1945, 'F', 'Betty', 18383, 0.0136569862508924],\n  [1945, 'F', 'Dorothy', 12328, 0.00915864257743577],\n  [1945, 'F', 'Helen', 8300, 0.00616618538227749],\n  [1945, 'F', 'Deborah', 1464, 0.00108762595176557],\n  [1945, 'F', 'Amanda', 280, 0.00020801589241418],\n  [1945, 'F', 'Jessica', 132, 9.80646349952565e-5],\n  [1945, 'F', 'Ashley', 10, 7.42913901479216e-6],\n  [1946, 'F', 'Linda', 52708, 0.0326804234293612],\n  [1946, 'F', 'Patricia', 46295, 0.028704185373421],\n  [1946, 'F', 'Betty', 19714, 0.012223227356121],\n  [1946, 'F', 'Dorothy', 12796, 0.00793387527893499],\n  [1946, 'F', 'Helen', 8852, 0.00548848577439298],\n  [1946, 'F', 'Deborah', 2470, 0.00153146857916297],\n  [1946, 'F', 'Amanda', 274, 0.000169887607567067],\n  [1946, 'F', 'Jessica', 240, 0.000148806663562394],\n  [1946, 'F', 'Ashley', 7, 4.34019435390317e-6],\n  [1947, 'F', 'Linda', 99680, 0.0548360886157353],\n  [1947, 'F', 'Patricia', 51274, 0.0282069182151205],\n  [1947, 'F', 'Betty', 18962, 0.0104313996020423],\n  [1947, 'F', 'Dorothy', 12751, 0.00701459636776927],\n  [1947, 'F', 'Helen', 8978, 0.00493898880008098],\n  [1947, 'F', 'Deborah', 5838, 0.00321160799898338],\n  [1947, 'F', 'Jessica', 430, 0.000236552147921009],\n  [1947, 'F', 'Amanda', 310, 0.000170537595012821],\n  [1947, 'F', 'Ashley', 11, 6.05133401658396e-6],\n  [1948, 'F', 'Linda', 96211, 0.0552115905834257],\n  [1948, 'F', 'Patricia', 46135, 0.0264750052651604],\n  [1948, 'F', 'Betty', 16622, 0.00953869161195395],\n  [1948, 'F', 'Dorothy', 11326, 0.00649953201762667],\n  [1948, 'F', 'Deborah', 11246, 0.00645362326242535],\n  [1948, 'F', 'Helen', 8305, 0.00476590264933688],\n  [1948, 'F', 'Jessica', 482, 0.000276600250087944],\n  [1948, 'F', 'Amanda', 306, 0.000175600988645043],\n  [1948, 'F', 'Ashley', 13, 7.46017272021426e-6],\n  [1949, 'F', 'Linda', 91010, 0.0518428093664536],\n  [1949, 'F', 'Patricia', 46337, 0.0263953440019049],\n  [1949, 'F', 'Deborah', 19208, 0.0109416183090962],\n  [1949, 'F', 'Betty', 14946, 0.00851381857807951],\n  [1949, 'F', 'Dorothy', 10406, 0.00592765931510072],\n  [1949, 'F', 'Helen', 7709, 0.00439134399962632],\n  [1949, 'F', 'Jessica', 406, 0.000231273273297222],\n  [1949, 'F', 'Amanda', 333, 0.000189689655192056],\n  [1949, 'F', 'Ashley', 11, 6.26602464598385e-6],\n  [1950, 'F', 'Linda', 80439, 0.0457319621154536],\n  [1950, 'F', 'Patricia', 47952, 0.0272621371145866],\n  [1950, 'F', 'Deborah', 29073, 0.0165288645381293],\n  [1950, 'F', 'Betty', 13614, 0.00773996360272735],\n  [1950, 'F', 'Dorothy', 9555, 0.00543230147084324],\n  [1950, 'F', 'Helen', 7060, 0.0040138198204242],\n  [1950, 'F', 'Jessica', 402, 0.000228548947281945],\n  [1950, 'F', 'Amanda', 379, 0.000215472763730988],\n  [1950, 'F', 'Ashley', 15, 8.52794579410241e-6],\n  [1951, 'F', 'Linda', 73947, 0.0400434945769865],\n  [1951, 'F', 'Patricia', 56433, 0.0305593807654547],\n  [1951, 'F', 'Deborah', 42045, 0.0227680464317606],\n  [1951, 'F', 'Betty', 12820, 0.00694223701403664],\n  [1951, 'F', 'Dorothy', 9082, 0.00491804965378165],\n  [1951, 'F', 'Helen', 6945, 0.00376082964605963],\n  [1951, 'F', 'Jessica', 466, 0.000252346524847198],\n  [1951, 'F', 'Amanda', 409, 0.000221480104425974],\n  [1951, 'F', 'Ashley', 15, 8.12274221611151e-6],\n  [1952, 'F', 'Linda', 67092, 0.0352717589878795],\n  [1952, 'F', 'Patricia', 53090, 0.0279105956696256],\n  [1952, 'F', 'Deborah', 49809, 0.0261857008797962],\n  [1952, 'F', 'Betty', 12125, 0.00637438260490131],\n  [1952, 'F', 'Dorothy', 8608, 0.00452541735777241],\n  [1952, 'F', 'Helen', 6470, 0.00340142313020301],\n  [1952, 'F', 'Jessica', 452, 0.000237626469065187],\n  [1952, 'F', 'Amanda', 418, 0.000219751911657629],\n  [1952, 'F', 'Ashley', 24, 1.26173346406294e-5],\n  [1953, 'F', 'Linda', 61264, 0.0317575840515387],\n  [1953, 'F', 'Deborah', 52196, 0.0270569805620611],\n  [1953, 'F', 'Patricia', 51007, 0.0264406354419697],\n  [1953, 'F', 'Betty', 11367, 0.00589234228770306],\n  [1953, 'F', 'Dorothy', 8154, 0.00422681085721217],\n  [1953, 'F', 'Helen', 6120, 0.00317244081998265],\n  [1953, 'F', 'Jessica', 495, 0.000256594478086832],\n  [1953, 'F', 'Amanda', 428, 0.000221863508325584],\n  [1953, 'F', 'Ashley', 15, 7.7755902450555e-6],\n  [1954, 'F', 'Linda', 55371, 0.0278157891564086],\n  [1954, 'F', 'Deborah', 54674, 0.0274656491003862],\n  [1954, 'F', 'Patricia', 49133, 0.0246821110079613],\n  [1954, 'F', 'Betty', 10615, 0.00533247732378461],\n  [1954, 'F', 'Dorothy', 7791, 0.00391383239091907],\n  [1954, 'F', 'Helen', 5940, 0.00298397694802455],\n  [1954, 'F', 'Amanda', 428, 0.000215007093224664],\n  [1954, 'F', 'Jessica', 424, 0.000212997681138453],\n  [1954, 'F', 'Ashley', 21, 1.0549413452612e-5],\n  [1955, 'F', 'Deborah', 52314, 0.026099932497594],\n  [1955, 'F', 'Linda', 51279, 0.0255835615426869],\n  [1955, 'F', 'Patricia', 46210, 0.0230545911364801],\n  [1955, 'F', 'Betty', 9928, 0.00495316989402671],\n  [1955, 'F', 'Dorothy', 7241, 0.00361260104780897],\n  [1955, 'F', 'Helen', 5596, 0.00279189552044455],\n  [1955, 'F', 'Amanda', 452, 0.000225506929099524],\n  [1955, 'F', 'Jessica', 386, 0.000192578926177912],\n  [1955, 'F', 'Ashley', 8, 3.9912730814075e-6],\n  [1956, 'F', 'Linda', 48067, 0.0233410866641092],\n  [1956, 'F', 'Deborah', 47829, 0.0232255150947153],\n  [1956, 'F', 'Patricia', 43332, 0.0210417951469653],\n  [1956, 'F', 'Betty', 9213, 0.00447378516313558],\n  [1956, 'F', 'Dorothy', 6862, 0.00333215171924849],\n  [1956, 'F', 'Helen', 5279, 0.00256345510433005],\n  [1956, 'F', 'Amanda', 643, 0.000312237475295363],\n  [1956, 'F', 'Jessica', 406, 0.00019715150073082],\n  [1956, 'F', 'Ashley', 25, 1.21398707346564e-5],\n  [1957, 'F', 'Linda', 44495, 0.021213187408344],\n  [1957, 'F', 'Deborah', 40065, 0.0191011653784763],\n  [1957, 'F', 'Patricia', 39277, 0.0187254829045404],\n  [1957, 'F', 'Betty', 8474, 0.00404001685803589],\n  [1957, 'F', 'Dorothy', 6401, 0.00305170496911585],\n  [1957, 'F', 'Helen', 5015, 0.0023909233588683],\n  [1957, 'F', 'Amanda', 667, 0.000317995190501527],\n  [1957, 'F', 'Jessica', 476, 0.000226935098468856],\n  [1957, 'F', 'Ashley', 27, 1.28723690307964e-5],\n  [1958, 'F', 'Linda', 41898, 0.0202894802981679],\n  [1958, 'F', 'Patricia', 37932, 0.0183689094150104],\n  [1958, 'F', 'Deborah', 32936, 0.015949551842581],\n  [1958, 'F', 'Betty', 7709, 0.00373315202679308],\n  [1958, 'F', 'Dorothy', 5539, 0.00268231016687078],\n  [1958, 'F', 'Helen', 4763, 0.0023065252436912],\n  [1958, 'F', 'Amanda', 796, 0.00038547010161205],\n  [1958, 'F', 'Jessica', 529, 0.000256172969538661],\n  [1958, 'F', 'Ashley', 38, 1.84018390216808e-5],\n  [1959, 'F', 'Linda', 40409, 0.0194416392387311],\n  [1959, 'F', 'Patricia', 35221, 0.0169455808267303],\n  [1959, 'F', 'Deborah', 29552, 0.0142181029667396],\n  [1959, 'F', 'Betty', 7317, 0.00352036611422691],\n  [1959, 'F', 'Dorothy', 5238, 0.00252011448767535],\n  [1959, 'F', 'Helen', 4378, 0.00210634998607153],\n  [1959, 'F', 'Amanda', 858, 0.000412802258576833],\n  [1959, 'F', 'Jessica', 523, 0.000251626551556741],\n  [1959, 'F', 'Ashley', 37, 1.78014959992341e-5],\n  [1960, 'F', 'Linda', 37314, 0.0179400268278259],\n  [1960, 'F', 'Patricia', 32107, 0.0154365771925017],\n  [1960, 'F', 'Deborah', 25269, 0.012148966551759],\n  [1960, 'F', 'Betty', 6503, 0.00312654752804181],\n  [1960, 'F', 'Dorothy', 5077, 0.00244094753188809],\n  [1960, 'F', 'Helen', 4069, 0.00195631583755223],\n  [1960, 'F', 'Amanda', 977, 0.000469727346593395],\n  [1960, 'F', 'Jessica', 560, 0.000269239830186593],\n  [1960, 'F', 'Ashley', 57, 2.74047684297068e-5],\n  [1961, 'F', 'Linda', 35574, 0.0171339811436622],\n  [1961, 'F', 'Patricia', 28867, 0.0139035990800612],\n  [1961, 'F', 'Deborah', 24092, 0.0116037520018302],\n  [1961, 'F', 'Betty', 5580, 0.00268756998880179],\n  [1961, 'F', 'Dorothy', 4726, 0.00227624655323965],\n  [1961, 'F', 'Helen', 3855, 0.00185673518043565],\n  [1961, 'F', 'Amanda', 1057, 0.0005090970390974],\n  [1961, 'F', 'Jessica', 669, 0.000322219412635914],\n  [1961, 'F', 'Ashley', 80, 3.85314693735024e-5],\n  [1962, 'F', 'Linda', 31462, 0.015521322454956],\n  [1962, 'F', 'Patricia', 26538, 0.0130921383036559],\n  [1962, 'F', 'Deborah', 22893, 0.0112939302956363],\n  [1962, 'F', 'Betty', 4765, 0.00235074380197906],\n  [1962, 'F', 'Dorothy', 4075, 0.00201034228605765],\n  [1962, 'F', 'Helen', 3587, 0.00176959454726105],\n  [1962, 'F', 'Amanda', 948, 0.000467682082744208],\n  [1962, 'F', 'Jessica', 867, 0.000427721904788216],\n  [1962, 'F', 'Ashley', 95, 4.6866875380485e-5],\n  [1963, 'F', 'Linda', 27715, 0.0139419183153997],\n  [1963, 'F', 'Patricia', 25363, 0.0127587542570263],\n  [1963, 'F', 'Deborah', 21062, 0.0105951536553833],\n  [1963, 'F', 'Betty', 4154, 0.00208965284799461],\n  [1963, 'F', 'Dorothy', 3791, 0.00190704717061809],\n  [1963, 'F', 'Helen', 3340, 0.00168017345024121],\n  [1963, 'F', 'Jessica', 1121, 0.000563914502311496],\n  [1963, 'F', 'Amanda', 1035, 0.000520652551197501],\n  [1963, 'F', 'Ashley', 108, 5.4328961864087e-5],\n  [1964, 'F', 'Patricia', 26087, 0.013328857510441],\n  [1964, 'F', 'Linda', 23633, 0.0120750139741731],\n  [1964, 'F', 'Deborah', 19306, 0.00986418227839823],\n  [1964, 'F', 'Betty', 4067, 0.00207798763732755],\n  [1964, 'F', 'Dorothy', 3535, 0.00180616825619692],\n  [1964, 'F', 'Helen', 3095, 0.00158135523420918],\n  [1964, 'F', 'Amanda', 1275, 0.000651446825078097],\n  [1964, 'F', 'Jessica', 1172, 0.000598820140385513],\n  [1964, 'F', 'Ashley', 180, 9.19689635404372e-5],\n  [1965, 'F', 'Patricia', 23551, 0.0128881183708359],\n  [1965, 'F', 'Linda', 19339, 0.0105831311270687],\n  [1965, 'F', 'Deborah', 17083, 0.00934855106488003],\n  [1965, 'F', 'Betty', 3565, 0.00195092106458452],\n  [1965, 'F', 'Dorothy', 2960, 0.00161983908868728],\n  [1965, 'F', 'Helen', 2804, 0.00153446919076998],\n  [1965, 'F', 'Amanda', 1650, 0.000902950843356088],\n  [1965, 'F', 'Jessica', 1529, 0.000836734448176641],\n  [1965, 'F', 'Ashley', 218, 0.000119298959910077],\n  [1966, 'F', 'Patricia', 20115, 0.0114579150183275],\n  [1966, 'F', 'Deborah', 16250, 0.00925633204314305],\n  [1966, 'F', 'Linda', 15560, 0.00886329394408036],\n  [1966, 'F', 'Betty', 2948, 0.00167924103773451],\n  [1966, 'F', 'Dorothy', 2667, 0.00151917769594231],\n  [1966, 'F', 'Helen', 2449, 0.00139500044145584],\n  [1966, 'F', 'Amanda', 2329, 0.00132664598944493],\n  [1966, 'F', 'Jessica', 1665, 0.000948418021651273],\n  [1966, 'F', 'Ashley', 263, 0.000149810173990561],\n  [1967, 'F', 'Patricia', 17746, 0.0103375520052381],\n  [1967, 'F', 'Deborah', 14007, 0.00815947768158289],\n  [1967, 'F', 'Linda', 13199, 0.00768879459693101],\n  [1967, 'F', 'Amanda', 2663, 0.00155127358221284],\n  [1967, 'F', 'Betty', 2543, 0.00148137015379919],\n  [1967, 'F', 'Dorothy', 2316, 0.00134913616838338],\n  [1967, 'F', 'Helen', 2153, 0.00125418401145484],\n  [1967, 'F', 'Jessica', 1761, 0.00102583281197026],\n  [1967, 'F', 'Ashley', 386, 0.000224856028063896],\n  [1968, 'F', 'Patricia', 15806, 0.00924608652923696],\n  [1968, 'F', 'Deborah', 12286, 0.0071869808362777],\n  [1968, 'F', 'Linda', 11368, 0.00664997543112525],\n  [1968, 'F', 'Amanda', 2430, 0.00142148489599176],\n  [1968, 'F', 'Betty', 2134, 0.00124833282635655],\n  [1968, 'F', 'Dorothy', 2084, 0.0012190841659452],\n  [1968, 'F', 'Helen', 1881, 0.00110033460467511],\n  [1968, 'F', 'Jessica', 1841, 0.00107693567634602],\n  [1968, 'F', 'Ashley', 544, 0.000318225425275522],\n  [1969, 'F', 'Patricia', 14957, 0.00848518199146773],\n  [1969, 'F', 'Deborah', 11186, 0.00634587455750204],\n  [1969, 'F', 'Linda', 10248, 0.00581374239811201],\n  [1969, 'F', 'Amanda', 2817, 0.00159809839339203],\n  [1969, 'F', 'Jessica', 2492, 0.00141372424434964],\n  [1969, 'F', 'Betty', 2133, 0.00121006172279205],\n  [1969, 'F', 'Helen', 1857, 0.00105348552237451],\n  [1969, 'F', 'Dorothy', 1778, 0.00100866842153036],\n  [1969, 'F', 'Ashley', 643, 0.000364777162566942],\n  [1970, 'F', 'Patricia', 13404, 0.00731676961673752],\n  [1970, 'F', 'Deborah', 9853, 0.00537840428481907],\n  [1970, 'F', 'Linda', 8734, 0.00476758175414693],\n  [1970, 'F', 'Jessica', 4023, 0.00219601344137086],\n  [1970, 'F', 'Amanda', 3550, 0.00193781946727978],\n  [1970, 'F', 'Betty', 1967, 0.0010737157442646],\n  [1970, 'F', 'Dorothy', 1802, 0.000983648078883991],\n  [1970, 'F', 'Helen', 1715, 0.000936157855319669],\n  [1970, 'F', 'Ashley', 932, 0.000508745843240776],\n  [1971, 'F', 'Patricia', 11466, 0.006543190995437],\n  [1971, 'F', 'Deborah', 8675, 0.00495047809919902],\n  [1971, 'F', 'Linda', 7379, 0.00421090235089217],\n  [1971, 'F', 'Jessica', 5360, 0.00305873920596043],\n  [1971, 'F', 'Amanda', 4133, 0.00235853901832733],\n  [1971, 'F', 'Betty', 1763, 0.00100607410822915],\n  [1971, 'F', 'Dorothy', 1626, 0.000927893647181281],\n  [1971, 'F', 'Helen', 1441, 0.000822321491751676],\n  [1971, 'F', 'Ashley', 1164, 0.000664248588757079],\n  [1972, 'F', 'Patricia', 9602, 0.00595464005496972],\n  [1972, 'F', 'Deborah', 6279, 0.00389389553271765],\n  [1972, 'F', 'Jessica', 6208, 0.00384986518030119],\n  [1972, 'F', 'Linda', 5746, 0.00356335781668986],\n  [1972, 'F', 'Amanda', 4181, 0.00259282962610169],\n  [1972, 'F', 'Betty', 1366, 0.000847119174660346],\n  [1972, 'F', 'Dorothy', 1277, 0.0007919261976876],\n  [1972, 'F', 'Helen', 1245, 0.000772081531809759],\n  [1972, 'F', 'Ashley', 1176, 0.000729291471010664],\n  [1973, 'F', 'Patricia', 8477, 0.00545491634229101],\n  [1973, 'F', 'Jessica', 7226, 0.00464990273556622],\n  [1973, 'F', 'Amanda', 5627, 0.00362095249004029],\n  [1973, 'F', 'Deborah', 4984, 0.00320718450512899],\n  [1973, 'F', 'Linda', 4735, 0.00304695397909024],\n  [1973, 'F', 'Betty', 1323, 0.000851345325097441],\n  [1973, 'F', 'Ashley', 1253, 0.00080630059890181],\n  [1973, 'F', 'Dorothy', 1175, 0.000756107903998106],\n  [1973, 'F', 'Helen', 1133, 0.000729081068280726],\n  [1974, 'F', 'Jessica', 10653, 0.00680199571179919],\n  [1974, 'F', 'Patricia', 8040, 0.00513358166928241],\n  [1974, 'F', 'Amanda', 7476, 0.00477346474621335],\n  [1974, 'F', 'Deborah', 4345, 0.00277430501903384],\n  [1974, 'F', 'Linda', 4085, 0.00260829367151973],\n  [1974, 'F', 'Ashley', 1626, 0.00103820942714592],\n  [1974, 'F', 'Helen', 1140, 0.000727895908331088],\n  [1974, 'F', 'Betty', 1130, 0.000721510856503622],\n  [1974, 'F', 'Dorothy', 1100, 0.000702355701021225],\n  [1975, 'F', 'Jessica', 12930, 0.00828471748344498],\n  [1975, 'F', 'Amanda', 12653, 0.00810723358994813],\n  [1975, 'F', 'Patricia', 7056, 0.00452103376358761],\n  [1975, 'F', 'Linda', 3525, 0.00225859467356099],\n  [1975, 'F', 'Deborah', 3415, 0.00218811370502433],\n  [1975, 'F', 'Ashley', 1988, 0.00127378332228064],\n  [1975, 'F', 'Helen', 1057, 0.000677258034029493],\n  [1975, 'F', 'Betty', 1021, 0.000654191535235679],\n  [1975, 'F', 'Dorothy', 975, 0.000624717675665805],\n  [1976, 'F', 'Jessica', 18370, 0.0116864866171597],\n  [1976, 'F', 'Amanda', 15591, 0.00991856357366017],\n  [1976, 'F', 'Patricia', 6017, 0.00382784920933316],\n  [1976, 'F', 'Linda', 3141, 0.00199821744499176],\n  [1976, 'F', 'Deborah', 2994, 0.00190470010515929],\n  [1976, 'F', 'Ashley', 2292, 0.00145810709453076],\n  [1976, 'F', 'Dorothy', 983, 0.000625357449355907],\n  [1976, 'F', 'Helen', 942, 0.000599274381783586],\n  [1976, 'F', 'Betty', 908, 0.000577644520869953],\n  [1977, 'F', 'Jessica', 24843, 0.0151032385968816],\n  [1977, 'F', 'Amanda', 18280, 0.01111327945703],\n  [1977, 'F', 'Patricia', 5907, 0.00359114561010263],\n  [1977, 'F', 'Linda', 2909, 0.0017685191433534],\n  [1977, 'F', 'Ashley', 2706, 0.00164510581021461],\n  [1977, 'F', 'Deborah', 2677, 0.00162747533405193],\n  [1977, 'F', 'Helen', 992, 0.00060308387425458],\n  [1977, 'F', 'Dorothy', 934, 0.000567822921929212],\n  [1977, 'F', 'Betty', 807, 0.000490613595285732],\n  [1978, 'F', 'Jessica', 26105, 0.0158812818667457],\n  [1978, 'F', 'Amanda', 20522, 0.0124847985623197],\n  [1978, 'F', 'Patricia', 5498, 0.00334477256094111],\n  [1978, 'F', 'Ashley', 3484, 0.00211953212119295],\n  [1978, 'F', 'Linda', 2936, 0.00178614991613734],\n  [1978, 'F', 'Deborah', 2479, 0.00150812862469498],\n  [1978, 'F', 'Helen', 922, 0.000560909476389179],\n  [1978, 'F', 'Dorothy', 913, 0.00055543422119666],\n  [1978, 'F', 'Betty', 715, 0.000434978606961239],\n  [1979, 'F', 'Amanda', 31927, 0.018529201469011],\n  [1979, 'F', 'Jessica', 27777, 0.0161207012624023],\n  [1979, 'F', 'Patricia', 5651, 0.0032796228114568],\n  [1979, 'F', 'Ashley', 4450, 0.0025826086552792],\n  [1979, 'F', 'Linda', 2739, 0.00158961013636174],\n  [1979, 'F', 'Deborah', 2181, 0.00126576842183459],\n  [1979, 'F', 'Dorothy', 889, 0.000515941369560272],\n  [1979, 'F', 'Helen', 879, 0.000510137754604588],\n  [1979, 'F', 'Betty', 711, 0.000412637023349104],\n  [1980, 'F', 'Amanda', 35819, 0.0201204564808553],\n  [1980, 'F', 'Jessica', 33921, 0.0190543009097711],\n  [1980, 'F', 'Ashley', 7296, 0.00409835144711801],\n  [1980, 'F', 'Patricia', 5309, 0.00298220227970799],\n  [1980, 'F', 'Linda', 2805, 0.00157564087296683],\n  [1980, 'F', 'Deborah', 1938, 0.00108862460314072],\n  [1980, 'F', 'Helen', 909, 0.000510608753485509],\n  [1980, 'F', 'Dorothy', 895, 0.00050274459226571],\n  [1980, 'F', 'Betty', 658, 0.000369615577330544],\n  [1981, 'F', 'Jessica', 42527, 0.0237842499463097],\n  [1981, 'F', 'Amanda', 34373, 0.0192239288782304],\n  [1981, 'F', 'Ashley', 8877, 0.00496467624740497],\n  [1981, 'F', 'Patricia', 5285, 0.0029557636552366],\n  [1981, 'F', 'Linda', 2730, 0.00152681831197652],\n  [1981, 'F', 'Deborah', 1905, 0.00106541717374186],\n  [1981, 'F', 'Helen', 896, 0.000501109599828191],\n  [1981, 'F', 'Dorothy', 787, 0.00044014872217052],\n  [1981, 'F', 'Betty', 662, 0.000370239458801632],\n  [1982, 'F', 'Jessica', 45445, 0.0250562932675237],\n  [1982, 'F', 'Amanda', 34210, 0.0188618284229725],\n  [1982, 'F', 'Ashley', 14851, 0.00818816176292209],\n  [1982, 'F', 'Patricia', 5167, 0.00284884733883364],\n  [1982, 'F', 'Linda', 2787, 0.00153662425649881],\n  [1982, 'F', 'Deborah', 1842, 0.00101559450321881],\n  [1982, 'F', 'Helen', 875, 0.000482434956740747],\n  [1982, 'F', 'Dorothy', 828, 0.000456521307635815],\n  [1982, 'F', 'Betty', 635, 0.000350109940034713],\n  [1983, 'F', 'Jessica', 45278, 0.0253076258799791],\n  [1983, 'F', 'Amanda', 33754, 0.0188664164484477],\n  [1983, 'F', 'Ashley', 33290, 0.0186070688975773],\n  [1983, 'F', 'Patricia', 4922, 0.00275109621850031],\n  [1983, 'F', 'Linda', 2473, 0.0013822553734968],\n  [1983, 'F', 'Deborah', 1605, 0.000897096592989232],\n  [1983, 'F', 'Helen', 844, 0.000471744252014275],\n  [1983, 'F', 'Dorothy', 759, 0.000424234463600515],\n  [1983, 'F', 'Betty', 563, 0.000314682480905257],\n  [1984, 'F', 'Jessica', 45851, 0.025436304942746],\n  [1984, 'F', 'Ashley', 38759, 0.0215019463757801],\n  [1984, 'F', 'Amanda', 33906, 0.0188096956530664],\n  [1984, 'F', 'Patricia', 4475, 0.00248255140823075],\n  [1984, 'F', 'Linda', 2334, 0.00129481005291857],\n  [1984, 'F', 'Deborah', 1468, 0.000814387813917932],\n  [1984, 'F', 'Helen', 859, 0.00047653891836206],\n  [1984, 'F', 'Dorothy', 682, 0.000378346382215279],\n  [1984, 'F', 'Betty', 503, 0.000279044325886049],\n  [1985, 'F', 'Jessica', 48343, 0.0261934794528861],\n  [1985, 'F', 'Ashley', 47007, 0.0254696003276962],\n  [1985, 'F', 'Amanda', 39050, 0.0211582932924147],\n  [1985, 'F', 'Patricia', 4398, 0.00238294939564762],\n  [1985, 'F', 'Linda', 2113, 0.00114487768826817],\n  [1985, 'F', 'Deborah', 1401, 0.000759097795202892],\n  [1985, 'F', 'Helen', 809, 0.000438336985238501],\n  [1985, 'F', 'Dorothy', 719, 0.000389572672912833],\n  [1985, 'F', 'Betty', 502, 0.000271996497638724],\n  [1986, 'F', 'Jessica', 52667, 0.0285499155975875],\n  [1986, 'F', 'Ashley', 49674, 0.0269274594602799],\n  [1986, 'F', 'Amanda', 40522, 0.0219663105900363],\n  [1986, 'F', 'Patricia', 4246, 0.00230168685566591],\n  [1986, 'F', 'Linda', 1951, 0.00105760505308624],\n  [1986, 'F', 'Deborah', 1284, 0.000696035309155683],\n  [1986, 'F', 'Helen', 766, 0.000415236017767331],\n  [1986, 'F', 'Dorothy', 629, 0.000340970568114427],\n  [1986, 'F', 'Betty', 407, 0.000220628014662277],\n  [1987, 'F', 'Jessica', 55990, 0.0298840611579793],\n  [1987, 'F', 'Ashley', 54845, 0.029272929705472],\n  [1987, 'F', 'Amanda', 41786, 0.0223028287113293],\n  [1987, 'F', 'Patricia', 3913, 0.00208852172372161],\n  [1987, 'F', 'Linda', 1929, 0.00102958303221543],\n  [1987, 'F', 'Deborah', 1203, 0.000642088329577588],\n  [1987, 'F', 'Helen', 815, 0.000434997496762871],\n  [1987, 'F', 'Dorothy', 614, 0.000327715905536691],\n  [1987, 'F', 'Betty', 435, 0.000232176578026809],\n  [1988, 'F', 'Jessica', 51532, 0.0268079862120844],\n  [1988, 'F', 'Ashley', 49963, 0.025991760752821],\n  [1988, 'F', 'Amanda', 39451, 0.0205232062418098],\n  [1988, 'F', 'Patricia', 3798, 0.00197579623599892],\n  [1988, 'F', 'Linda', 1844, 0.000959286008210115],\n  [1988, 'F', 'Deborah', 1056, 0.000549352507955467],\n  [1988, 'F', 'Helen', 775, 0.000403170637940802],\n  [1988, 'F', 'Dorothy', 608, 0.000316293868216784],\n  [1988, 'F', 'Betty', 395, 0.000205486970305312],\n  [1989, 'F', 'Jessica', 47885, 0.0240412252916602],\n  [1989, 'F', 'Ashley', 47585, 0.0238906067767286],\n  [1989, 'F', 'Amanda', 36827, 0.0184894268312827],\n  [1989, 'F', 'Patricia', 3606, 0.00181043454947743],\n  [1989, 'F', 'Linda', 1844, 0.000925801805112695],\n  [1989, 'F', 'Deborah', 1076, 0.000540218406887885],\n  [1989, 'F', 'Helen', 857, 0.000430266890987842],\n  [1989, 'F', 'Dorothy', 620, 0.000311278264191904],\n  [1989, 'F', 'Betty', 399, 0.000200322624858983],\n  [1990, 'F', 'Jessica', 46470, 0.0226274308541356],\n  [1990, 'F', 'Ashley', 45553, 0.0221809201140185],\n  [1990, 'F', 'Amanda', 34405, 0.0167526739517223],\n  [1990, 'F', 'Patricia', 3578, 0.00174221965991171],\n  [1990, 'F', 'Linda', 1658, 0.000807322581367696],\n  [1990, 'F', 'Deborah', 1094, 0.000532696564545392],\n  [1990, 'F', 'Helen', 861, 0.000419242908659582],\n  [1990, 'F', 'Dorothy', 596, 0.000290207634798038],\n  [1990, 'F', 'Betty', 406, 0.00019769177806712],\n  [1991, 'F', 'Ashley', 43482, 0.0213883278618854],\n  [1991, 'F', 'Jessica', 43394, 0.0213450416089107],\n  [1991, 'F', 'Amanda', 28887, 0.0142092044281837],\n  [1991, 'F', 'Patricia', 3418, 0.00168127741667642],\n  [1991, 'F', 'Linda', 1608, 0.000790957895264976],\n  [1991, 'F', 'Deborah', 1014, 0.00049877568768575],\n  [1991, 'F', 'Helen', 773, 0.000380230381243673],\n  [1991, 'F', 'Dorothy', 498, 0.000244960840697735],\n  [1991, 'F', 'Betty', 345, 0.000169701787230359],\n  [1992, 'F', 'Ashley', 38452, 0.0191860354880783],\n  [1992, 'F', 'Jessica', 38352, 0.0191361394215848],\n  [1992, 'F', 'Amanda', 25034, 0.0124909812859813],\n  [1992, 'F', 'Patricia', 2951, 0.00147243292222301],\n  [1992, 'F', 'Linda', 1580, 0.000788357850597206],\n  [1992, 'F', 'Deborah', 919, 0.00045854485107521],\n  [1992, 'F', 'Helen', 827, 0.000412640469901196],\n  [1992, 'F', 'Dorothy', 508, 0.00025347201778695],\n  [1992, 'F', 'Betty', 296, 0.000147692356820742],\n  [1993, 'F', 'Jessica', 34987, 0.0177506267031079],\n  [1993, 'F', 'Ashley', 34847, 0.0176795978141367],\n  [1993, 'F', 'Amanda', 20809, 0.0105574296471538],\n  [1993, 'F', 'Patricia', 2660, 0.00134954889045265],\n  [1993, 'F', 'Linda', 1487, 0.000754428270715449],\n  [1993, 'F', 'Helen', 868, 0.000440379111621392],\n  [1993, 'F', 'Deborah', 797, 0.000404357317928858],\n  [1993, 'F', 'Dorothy', 476, 0.000241498222502053],\n  [1993, 'F', 'Betty', 292, 0.000148145968425629],\n  [1994, 'F', 'Jessica', 32117, 0.0164797639663909],\n  [1994, 'F', 'Ashley', 30278, 0.0155361426463986],\n  [1994, 'F', 'Amanda', 18715, 0.00960297607594125],\n  [1994, 'F', 'Patricia', 2363, 0.00121249438778783],\n  [1994, 'F', 'Linda', 1281, 0.000657302289782567],\n  [1994, 'F', 'Helen', 848, 0.000435122827272144],\n  [1994, 'F', 'Deborah', 740, 0.000379706240779937],\n  [1994, 'F', 'Dorothy', 442, 0.000226797511384773],\n  [1994, 'F', 'Betty', 275, 0.00014110704893849],\n  [1995, 'F', 'Jessica', 27935, 0.0145416403136851],\n  [1995, 'F', 'Ashley', 26603, 0.0138482640868074],\n  [1995, 'F', 'Amanda', 16345, 0.00850843425549248],\n  [1995, 'F', 'Patricia', 2160, 0.0011243938814233],\n  [1995, 'F', 'Linda', 1233, 0.000641841507312464],\n  [1995, 'F', 'Helen', 837, 0.000435702629051527],\n  [1995, 'F', 'Deborah', 660, 0.000343564797101562],\n  [1995, 'F', 'Dorothy', 376, 0.000195727823803314],\n  [1995, 'F', 'Betty', 234, 0.00012180933715419],\n  [1996, 'F', 'Jessica', 24192, 0.012621838409999],\n  [1996, 'F', 'Ashley', 23676, 0.0123526226105793],\n  [1996, 'F', 'Amanda', 13973, 0.00729021776219062],\n  [1996, 'F', 'Patricia', 1970, 0.00102782000941212],\n  [1996, 'F', 'Linda', 987, 0.000514953476796833],\n  [1996, 'F', 'Helen', 900, 0.000469562440848176],\n  [1996, 'F', 'Deborah', 633, 0.000330258916729884],\n  [1996, 'F', 'Dorothy', 350, 0.000182607615885402],\n  [1996, 'F', 'Betty', 217, 0.000113216721848949],\n  [1997, 'F', 'Jessica', 21043, 0.0110255841966801],\n  [1997, 'F', 'Ashley', 20895, 0.0109480388627872],\n  [1997, 'F', 'Amanda', 12239, 0.00641268473996901],\n  [1997, 'F', 'Patricia', 1781, 0.000933163781508686],\n  [1997, 'F', 'Linda', 1095, 0.00057373067981584],\n  [1997, 'F', 'Helen', 812, 0.000425451426493573],\n  [1997, 'F', 'Deborah', 638, 0.000334283263673522],\n  [1997, 'F', 'Dorothy', 315, 0.000165045812001817],\n  [1997, 'F', 'Betty', 189, 9.90274872010902e-5],\n  [1998, 'F', 'Ashley', 19871, 0.0102549361330773],\n  [1998, 'F', 'Jessica', 18233, 0.00940960447458096],\n  [1998, 'F', 'Amanda', 10908, 0.00562935148405249],\n  [1998, 'F', 'Patricia', 1704, 0.000879392641073107],\n  [1998, 'F', 'Linda', 970, 0.000500593228779879],\n  [1998, 'F', 'Helen', 832, 0.000429374810664803],\n  [1998, 'F', 'Deborah', 553, 0.00028538974795389],\n  [1998, 'F', 'Dorothy', 312, 0.000161015553999301],\n  [1998, 'F', 'Betty', 194, 0.000100118645755976],\n  [1999, 'F', 'Ashley', 18132, 0.00931837897619116],\n  [1999, 'F', 'Jessica', 16346, 0.0084005196748743],\n  [1999, 'F', 'Amanda', 9741, 0.00500608480074333],\n  [1999, 'F', 'Patricia', 1532, 0.000787323879964971],\n  [1999, 'F', 'Linda', 898, 0.000461499245566935],\n  [1999, 'F', 'Helen', 841, 0.000432205863610014],\n  [1999, 'F', 'Deborah', 524, 0.000269293546410995],\n  [1999, 'F', 'Dorothy', 335, 0.000172162858869625],\n  [1999, 'F', 'Betty', 182, 9.35332546694679e-5],\n  [2000, 'F', 'Ashley', 17997, 0.00902349055709788],\n  [2000, 'F', 'Jessica', 15705, 0.00787430789571719],\n  [2000, 'F', 'Amanda', 8550, 0.00428687249337039],\n  [2000, 'F', 'Patricia', 1392, 0.000697932925236442],\n  [2000, 'F', 'Helen', 890, 0.000446235850187093],\n  [2000, 'F', 'Linda', 849, 0.000425678917762744],\n  [2000, 'F', 'Deborah', 545, 0.00027325678466513],\n  [2000, 'F', 'Dorothy', 312, 0.000156433241863341],\n  [2000, 'F', 'Betty', 174, 8.72416156545553e-5],\n  [2001, 'F', 'Ashley', 16524, 0.00834726311913036],\n  [2001, 'F', 'Jessica', 13917, 0.00703031111286233],\n  [2001, 'F', 'Amanda', 6963, 0.00351742877623485],\n  [2001, 'F', 'Patricia', 1223, 0.000617810626645874],\n  [2001, 'F', 'Helen', 884, 0.000446561401434957],\n  [2001, 'F', 'Linda', 837, 0.000422818883485361],\n  [2001, 'F', 'Deborah', 489, 0.000247023218667075],\n  [2001, 'F', 'Dorothy', 317, 0.00016013570617068],\n  [2001, 'F', 'Betty', 153, 7.72894733252811e-5],\n  [2002, 'F', 'Ashley', 15339, 0.00777226488632702],\n  [2002, 'F', 'Jessica', 11913, 0.00603631211883524],\n  [2002, 'F', 'Amanda', 6132, 0.00310708183603607],\n  [2002, 'F', 'Patricia', 1113, 0.000563956634622985],\n  [2002, 'F', 'Helen', 875, 0.000443362134137567],\n  [2002, 'F', 'Linda', 769, 0.000389651978459187],\n  [2002, 'F', 'Deborah', 474, 0.000240175601807093],\n  [2002, 'F', 'Dorothy', 263, 0.000133261990032206],\n  [2002, 'F', 'Betty', 127, 6.43508468976811e-5],\n  [2003, 'F', 'Ashley', 14512, 0.00723815072032368],\n  [2003, 'F', 'Jessica', 10445, 0.00520965299571257],\n  [2003, 'F', 'Amanda', 5339, 0.00266293320671225],\n  [2003, 'F', 'Patricia', 1011, 0.000504256503462462],\n  [2003, 'F', 'Helen', 783, 0.000390536935916031],\n  [2003, 'F', 'Linda', 739, 0.000368591054459702],\n  [2003, 'F', 'Deborah', 421, 0.000209982183934418],\n  [2003, 'F', 'Dorothy', 291, 0.000145142079631628],\n  [2003, 'F', 'Betty', 142, 7.08253446999699e-5],\n  [2004, 'F', 'Ashley', 14370, 0.00712775344818093],\n  [2004, 'F', 'Jessica', 9469, 0.00469677782886745],\n  [2004, 'F', 'Amanda', 4677, 0.00231986798031609],\n  [2004, 'F', 'Patricia', 997, 0.000494528196787501],\n  [2004, 'F', 'Helen', 860, 0.000426573971150703],\n  [2004, 'F', 'Linda', 727, 0.000360603810496001],\n  [2004, 'F', 'Deborah', 427, 0.000211798936838779],\n  [2004, 'F', 'Dorothy', 288, 0.000142852678710933],\n  [2004, 'F', 'Betty', 136, 6.7458209391274e-5],\n  [2005, 'F', 'Ashley', 13270, 0.00654498034039816],\n  [2005, 'F', 'Jessica', 8108, 0.00399899778447237],\n  [2005, 'F', 'Amanda', 4088, 0.00201626824653713],\n  [2005, 'F', 'Helen', 960, 0.000473487650850206],\n  [2005, 'F', 'Patricia', 877, 0.000432550697703782],\n  [2005, 'F', 'Linda', 745, 0.000367446145711879],\n  [2005, 'F', 'Deborah', 425, 0.00020961692876181],\n  [2005, 'F', 'Dorothy', 234, 0.000115412614894738],\n  [2005, 'F', 'Betty', 132, 6.51045519919034e-5],\n  [2006, 'F', 'Ashley', 12340, 0.00590922303294464],\n  [2006, 'F', 'Jessica', 6809, 0.00326060774970179],\n  [2006, 'F', 'Amanda', 3355, 0.00160659994129086],\n  [2006, 'F', 'Helen', 948, 0.000453966242725406],\n  [2006, 'F', 'Patricia', 775, 0.000371122192101466],\n  [2006, 'F', 'Linda', 698, 0.000334249406563643],\n  [2006, 'F', 'Deborah', 423, 0.000202560886785704],\n  [2006, 'F', 'Dorothy', 265, 0.000126899846331469],\n  [2006, 'F', 'Betty', 135, 6.46470915273522e-5],\n  [2007, 'F', 'Ashley', 11423, 0.00540374075290008],\n  [2007, 'F', 'Jessica', 5704, 0.00269832244196289],\n  [2007, 'F', 'Amanda', 3038, 0.00143714999626284],\n  [2007, 'F', 'Helen', 931, 0.000440416934338613],\n  [2007, 'F', 'Patricia', 725, 0.000342967000424806],\n  [2007, 'F', 'Linda', 659, 0.000311745176937858],\n  [2007, 'F', 'Deborah', 371, 0.000175504492631177],\n  [2007, 'F', 'Dorothy', 262, 0.000123941178084551],\n  [2007, 'F', 'Betty', 134, 6.33897628371366e-5],\n  [2008, 'F', 'Ashley', 9402, 0.00452030531532519],\n  [2008, 'F', 'Jessica', 4732, 0.00227505687642191],\n  [2008, 'F', 'Amanda', 2439, 0.00117262546948289],\n  [2008, 'F', 'Helen', 884, 0.000425010625265632],\n  [2008, 'F', 'Patricia', 629, 0.000302411406439007],\n  [2008, 'F', 'Linda', 611, 0.000293757343933598],\n  [2008, 'F', 'Deborah', 355, 0.000170677343856673],\n  [2008, 'F', 'Dorothy', 242, 0.000116349062572718],\n  [2008, 'F', 'Betty', 137, 6.58670312911669e-5],\n  [2009, 'F', 'Ashley', 7811, 0.00386339097012116],\n  [2009, 'F', 'Jessica', 3793, 0.00187605197153624],\n  [2009, 'F', 'Amanda', 1952, 0.000965476785773462],\n  [2009, 'F', 'Helen', 826, 0.000408547041520942],\n  [2009, 'F', 'Patricia', 564, 0.000278959481135365],\n  [2009, 'F', 'Linda', 550, 0.000272034955007891],\n  [2009, 'F', 'Deborah', 346, 0.000171134717150419],\n  [2009, 'F', 'Dorothy', 226, 0.000111781636057788],\n  [2009, 'F', 'Betty', 148, 7.32021333475781e-5],\n  [2010, 'F', 'Ashley', 6306, 0.00322252105804575],\n  [2010, 'F', 'Jessica', 3195, 0.00163272356175962],\n  [2010, 'F', 'Amanda', 1655, 0.000845745694745594],\n  [2010, 'F', 'Helen', 703, 0.000359250286046014],\n  [2010, 'F', 'Patricia', 479, 0.000244780778116701],\n  [2010, 'F', 'Linda', 476, 0.00024324770434979],\n  [2010, 'F', 'Deborah', 354, 0.000180902704495432],\n  [2010, 'F', 'Dorothy', 240, 0.000122645901352835],\n  [2010, 'F', 'Betty', 132, 6.74552457440595e-5],\n  [2011, 'F', 'Ashley', 5398, 0.00279205644940212],\n  [2011, 'F', 'Jessica', 2620, 0.00135516633890952],\n  [2011, 'F', 'Amanda', 1409, 0.000728789836459354],\n  [2011, 'F', 'Helen', 729, 0.000377067275215663],\n  [2011, 'F', 'Linda', 488, 0.000252412661598414],\n  [2011, 'F', 'Patricia', 427, 0.000220861078898612],\n  [2011, 'F', 'Deborah', 332, 0.000171723368136626],\n  [2011, 'F', 'Dorothy', 276, 0.000142757980740086],\n  [2011, 'F', 'Betty', 167, 8.63789231289653e-5],\n  [2012, 'F', 'Ashley', 4696, 0.00242806420306393],\n  [2012, 'F', 'Jessica', 2327, 0.00120317406314518],\n  [2012, 'F', 'Amanda', 1228, 0.00063493672090343],\n  [2012, 'F', 'Helen', 772, 0.000399162173076098],\n  [2012, 'F', 'Linda', 448, 0.000231638152251414],\n  [2012, 'F', 'Patricia', 394, 0.000203717482113967],\n  [2012, 'F', 'Deborah', 336, 0.000173728614188561],\n  [2012, 'F', 'Dorothy', 277, 0.000143222696816165],\n  [2012, 'F', 'Betty', 140, 7.2386922578567e-5],\n  [2013, 'F', 'Ashley', 3936, 0.00204898297876106],\n  [2013, 'F', 'Jessica', 1946, 0.00101303884061713],\n  [2013, 'F', 'Amanda', 1064, 0.000553891740193539],\n  [2013, 'F', 'Helen', 738, 0.000384184308517699],\n  [2013, 'F', 'Linda', 441, 0.000229573550211796],\n  [2013, 'F', 'Patricia', 419, 0.000218120901448396],\n  [2013, 'F', 'Dorothy', 334, 0.000173872031226167],\n  [2013, 'F', 'Deborah', 329, 0.000171269156507213],\n  [2013, 'F', 'Betty', 174, 9.05800402196202e-5],\n  [2014, 'F', 'Ashley', 3547, 0.00182125980653672],\n  [2014, 'F', 'Jessica', 1790, 0.000919102073217006],\n  [2014, 'F', 'Amanda', 1048, 0.000538111157950515],\n  [2014, 'F', 'Helen', 801, 0.000411285341143476],\n  [2014, 'F', 'Linda', 470, 0.000241328477325136],\n  [2014, 'F', 'Dorothy', 382, 0.000196143570932344],\n  [2014, 'F', 'Patricia', 377, 0.000193576246705481],\n  [2014, 'F', 'Deborah', 369, 0.0001894685279425],\n  [2014, 'F', 'Betty', 193, 9.90987151569174e-5],\n  [2015, 'F', 'Ashley', 3409, 0.00176165787043521],\n  [2015, 'F', 'Jessica', 1577, 0.000814941173856356],\n  [2015, 'F', 'Amanda', 1013, 0.000523484723599549],\n  [2015, 'F', 'Helen', 757, 0.000391192434121282],\n  [2015, 'F', 'Linda', 423, 0.000218592337692605],\n  [2015, 'F', 'Dorothy', 395, 0.00020412286853092],\n  [2015, 'F', 'Deborah', 346, 0.00017880129749797],\n  [2015, 'F', 'Patricia', 346, 0.00017880129749797],\n  [2015, 'F', 'Betty', 186, 9.61186165740535e-5],\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const BARCHART_1Y0G = [\n  { x: 0, y: 1 },\n  { x: 1, y: 2 },\n  { x: 2, y: 10 },\n  { x: 3, y: 6 },\n];\n\n/** @internal */\nexport const BARCHART_1Y0G_LINEAR = [\n  { x: 0, y: 1 },\n  { x: 1, y: 2 },\n  { x: 2.5, y: 10 },\n  { x: 3.5, y: 6 },\n];\n/** @internal */\nexport const BARCHART_1Y1G = [\n  { x: 0, g: 'a', y: 1 },\n  { x: 0, g: 'b', y: 2 },\n  { x: 1, g: 'a', y: 2 },\n  { x: 1, g: 'b', y: 3 },\n  { x: 2, g: 'a', y: 3 },\n  { x: 2, g: 'b', y: 4 },\n  { x: 3, g: 'a', y: 4 },\n  { x: 3, g: 'b', y: 5 },\n];\n/** @internal */\nexport const BARCHART_1Y1G_ORDINAL = [\n  { x: 'a', g: 'a', y: 1 },\n  { x: 'a', g: 'b', y: 2 },\n  { x: 'b', g: 'a', y: 2 },\n  { x: 'b', g: 'b', y: 3 },\n  { x: 'c', g: 'a', y: 3 },\n  { x: 'd', g: 'b', y: 4 },\n  { x: 'e', g: 'a', y: 4 },\n  { x: 'e', g: 'b', y: 5 },\n];\n\n/** @internal */\nexport const BARCHART_1Y1G_LINEAR = [\n  { x: 0, g: 'a', y: 1 },\n  { x: 0, g: 'b', y: 1 },\n  { x: 1, g: 'a', y: 2 },\n  { x: 1, g: 'b', y: 2 },\n  { x: 2, g: 'a', y: 10 },\n  { x: 2, g: 'b', y: 20 },\n  { x: 3, g: 'a', y: 6 },\n  { x: 5, g: 'a', y: 2 },\n  { x: 7, g: 'b', y: 3 },\n];\n\n/** @internal */\nexport const BARCHART_1Y2G = [\n  { x: 0, g1: 'a', g2: 's', y: 1 },\n  { x: 0, g1: 'a', g2: 'p', y: 1 },\n  { x: 0, g1: 'b', g2: 's', y: 1 },\n  { x: 0, g1: 'b', g2: 'p', y: 1 },\n  { x: 1, g1: 'a', g2: 's', y: 2 },\n  { x: 1, g1: 'a', g2: 'p', y: 2 },\n  { x: 1, g1: 'b', g2: 's', y: 2 },\n  { x: 1, g1: 'b', g2: 'p', y: 2 },\n  { x: 2, g1: 'a', g2: 's', y: 1 },\n  { x: 2, g1: 'a', g2: 'p', y: 2 },\n  { x: 2, g1: 'b', g2: 's', y: 3 },\n  { x: 2, g1: 'b', g2: 'p', y: 4 },\n  { x: 3, g1: 'a', g2: 's', y: 6 },\n  { x: 3, g1: 'a', g2: 'p', y: 6 },\n  { x: 3, g1: 'b', g2: 's', y: 6 },\n  { x: 3, g1: 'b', g2: 'p', y: 6 },\n];\n\n/** @internal */\nexport const BARCHART_2Y0G = [\n  { x: 0, y1: 1, y2: 3 },\n  { x: 1, y1: 2, y2: 7 },\n  { x: 2, y1: 1, y2: 2 },\n  { x: 3, y1: 6, y2: 10 },\n];\n\n/** @internal */\nexport const CHART_ORDINAL_2Y0G = [\n  { x: 'a', y1: 1, y2: 3 },\n  { x: 'b', y1: 2, y2: 7 },\n  { x: 'c', y1: 1, y2: 2 },\n  { x: 'd', y1: 6, y2: 10 },\n];\n\n/** @internal */\nexport const BARCHART_2Y1G = [\n  { x: 0, g: 'a', y1: 1, y2: 4 },\n  { x: 0, g: 'b', y1: 3, y2: 6 },\n  { x: 1, g: 'a', y1: 2, y2: 1 },\n  { x: 1, g: 'b', y1: 2, y2: 5 },\n  { x: 2, g: 'a', y1: 10, y2: 5 },\n  { x: 2, g: 'b', y1: 3, y2: 1 },\n  { x: 3, g: 'a', y1: 7, y2: 3 },\n  { x: 3, g: 'b', y1: 6, y2: 4 },\n];\n\n/** @internal */\nexport const BARCHART_2Y2G = [\n  { x: 0, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 1, y2: 4 },\n  { x: 0, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 1, y2: 4 },\n  { x: 0, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 3, y2: 6 },\n  { x: 0, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 3, y2: 6 },\n  { x: 1, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 2, y2: 1 },\n  { x: 1, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 2, y2: 1 },\n  { x: 1, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 2, y2: 5 },\n  { x: 1, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 2, y2: 5 },\n  { x: 2, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 10, y2: 5 },\n  { x: 2, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 10, y2: 5 },\n  { x: 2, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 3, y2: 1 },\n  { x: 2, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 3, y2: 1 },\n  { x: 3, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 7, y2: 3 },\n  { x: 3, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 7, y2: 3 },\n  { x: 3, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 6, y2: 4 },\n  { x: 3, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 6, y2: 4 },\n  { x: 6, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 7, y2: 3 },\n  { x: 6, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 7, y2: 3 },\n  { x: 6, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 6, y2: 4 },\n  { x: 6, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 6, y2: 4 },\n];\n\n/** @internal */\nexport const BARCHART_2Y3G = [\n  { x: 0, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 1, y2: 4, g3: 'somevalue' },\n  { x: 0, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 1, y2: 4, g3: 'newvalue' },\n  { x: 0, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 3, y2: 6, g3: 'somevalue' },\n  { x: 0, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 3, y2: 6, g3: 'newvalue' },\n  { x: 1, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 2, y2: 1, g3: 'somevalue' },\n  { x: 1, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 2, y2: 1, g3: 'newvalue' },\n  { x: 1, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 2, y2: 5, g3: 'somevalue' },\n  { x: 1, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 2, y2: 5, g3: 'newvalue' },\n  { x: 2, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 10, y2: 5, g3: 'somevalue' },\n  { x: 2, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 10, y2: 5, g3: 'newvalue' },\n  { x: 2, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 3, y2: 1, g3: 'somevalue' },\n  { x: 2, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 3, y2: 1, g3: 'newvalue' },\n  { x: 3, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 7, y2: 3, g3: 'somevalue' },\n  { x: 3, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 7, y2: 3, g3: 'newvalue' },\n  { x: 3, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 6, y2: 4, g3: 'somevalue' },\n  { x: 3, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 6, y2: 4, g3: 'newvalue' },\n  { x: 6, g1: 'cdn.google.com', g2: 'direct-cdn', y1: 7, y2: 3, g3: 'somevalue' },\n  { x: 6, g1: 'cdn.google.com', g2: 'indirect-cdn', y1: 7, y2: 3, g3: 'newvalue' },\n  { x: 6, g1: 'cloudflare.com', g2: 'direct-cdn', y1: 6, y2: 4, g3: 'somevalue' },\n  { x: 6, g1: 'cloudflare.com', g2: 'indirect-cdn', y1: 6, y2: 4, g3: 'newvalue' },\n];\n\nconst NOW = Date.now();\nconst DAY = 24 * 60 * 60 * 1000;\n/** @internal */\nexport const TIME_CHART_2Y0G = [\n  { x: NOW, y1: 1, y2: 3 },\n  { x: NOW + DAY, y1: 2, y2: 7 },\n  { x: NOW + DAY * 2, y1: 1, y2: 2 },\n  { x: NOW + DAY * 3, y1: 6, y2: 10 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\n\nimport { HeatmapSpec } from '../../chart_types/heatmap/specs';\nimport { ESCalendarInterval, ESFixedInterval } from '../chrono/elasticsearch';\n\ntype HeatmapDataSets = {\n  domain?: { min: number; max: number };\n  timeZone?: string;\n  data: Array<{ x: number; y: string; value: number }>;\n  interval: ESFixedInterval | ESCalendarInterval;\n  xFormatter?: HeatmapSpec['xAxisLabelFormatter'];\n};\n\n/** @internal */\nexport const DATA_1: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'h', value: 12 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('dd/MM HHa', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    {\n      y: 'AE',\n      x: 1633946400000,\n      value: 1630.1986083984375,\n    },\n    {\n      y: 'AE',\n      x: 1633989600000,\n      value: 589.9012451171875,\n    },\n    {\n      y: 'AE',\n      x: 1634076000000,\n      value: 1320.9326171875,\n    },\n    {\n      y: 'AE',\n      x: 1634162400000,\n      value: 1246.115478515625,\n    },\n    {\n      y: 'AE',\n      x: 1634248800000,\n      value: 1498.811767578125,\n    },\n    {\n      y: 'AE',\n      x: 1634292000000,\n      value: 1184.3049011230469,\n    },\n    {\n      y: 'AE',\n      x: 1634378400000,\n      value: 882.4849243164062,\n    },\n    {\n      y: 'AE',\n      x: 1634508000000,\n      value: 381.0003967285156,\n    },\n    {\n      y: 'AE',\n      x: 1634594400000,\n      value: 1137.0064697265625,\n    },\n    {\n      y: 'AE',\n      x: 1634637600000,\n      value: 221.59982299804688,\n    },\n    {\n      y: 'AR',\n      x: 1633903200000,\n      value: 1071.3580627441406,\n    },\n    {\n      y: 'AR',\n      x: 1633946400000,\n      value: 533.4688110351562,\n    },\n    {\n      y: 'AR',\n      x: 1633989600000,\n      value: 521.6063842773438,\n    },\n    {\n      y: 'AR',\n      x: 1634032800000,\n      value: 1779.9789428710938,\n    },\n    {\n      y: 'AR',\n      x: 1634076000000,\n      value: 1067.8575439453125,\n    },\n    {\n      y: 'AR',\n      x: 1634119200000,\n      value: 1489.5529174804688,\n    },\n    {\n      y: 'AR',\n      x: 1634162400000,\n      value: 1596.3911743164062,\n    },\n    {\n      y: 'AR',\n      x: 1634205600000,\n      value: 1026.2750549316406,\n    },\n    {\n      y: 'AR',\n      x: 1634248800000,\n      value: 1342.860107421875,\n    },\n    {\n      y: 'AR',\n      x: 1634292000000,\n      value: 1527.0611572265625,\n    },\n    {\n      y: 'AR',\n      x: 1634335200000,\n      value: 2064.026611328125,\n    },\n    {\n      y: 'AR',\n      x: 1634378400000,\n      value: 1553.267333984375,\n    },\n    {\n      y: 'AR',\n      x: 1634421600000,\n      value: 1454.1295166015625,\n    },\n    {\n      y: 'AR',\n      x: 1634464800000,\n      value: 1645.395263671875,\n    },\n    {\n      y: 'AR',\n      x: 1634508000000,\n      value: 1369.0120849609375,\n    },\n    {\n      y: 'AR',\n      x: 1634551200000,\n      value: 1482.1971435546875,\n    },\n    {\n      y: 'AR',\n      x: 1634594400000,\n      value: 1205.93310546875,\n    },\n    {\n      y: 'AR',\n      x: 1634637600000,\n      value: 1348.623291015625,\n    },\n    {\n      y: 'AR',\n      x: 1634680800000,\n      value: 959.8377685546875,\n    },\n    {\n      y: 'AT',\n      x: 1633903200000,\n      value: 749.7982788085938,\n    },\n    {\n      y: 'AT',\n      x: 1633946400000,\n      value: 1156.054931640625,\n    },\n    {\n      y: 'AT',\n      x: 1633989600000,\n      value: 1419.3067626953125,\n    },\n    {\n      y: 'AT',\n      x: 1634032800000,\n      value: 1137.7723999023438,\n    },\n    {\n      y: 'AT',\n      x: 1634076000000,\n      value: 1555.2818603515625,\n    },\n    {\n      y: 'AT',\n      x: 1634119200000,\n      value: 1516.8120727539062,\n    },\n    {\n      y: 'AT',\n      x: 1634162400000,\n      value: 1545.7149047851562,\n    },\n    {\n      y: 'AT',\n      x: 1634205600000,\n      value: 1298.5445556640625,\n    },\n    {\n      y: 'AT',\n      x: 1634248800000,\n      value: 1644.07177734375,\n    },\n    {\n      y: 'AT',\n      x: 1634292000000,\n      value: 1570.9822998046875,\n    },\n    {\n      y: 'AT',\n      x: 1634335200000,\n      value: 1123.7603759765625,\n    },\n    {\n      y: 'AT',\n      x: 1634378400000,\n      value: 1502.600341796875,\n    },\n    {\n      y: 'AT',\n      x: 1634421600000,\n      value: 1215.3555908203125,\n    },\n    {\n      y: 'AT',\n      x: 1634464800000,\n      value: 1761.99755859375,\n    },\n    {\n      y: 'AT',\n      x: 1634508000000,\n      value: 1402.3016357421875,\n    },\n    {\n      y: 'AT',\n      x: 1634551200000,\n      value: 1324.6370849609375,\n    },\n    {\n      y: 'AT',\n      x: 1634594400000,\n      value: 1205.5257568359375,\n    },\n    {\n      y: 'AT',\n      x: 1634637600000,\n      value: 1176.2248840332031,\n    },\n    {\n      y: 'AT',\n      x: 1634680800000,\n      value: 934.2395324707031,\n    },\n    {\n      y: 'AU',\n      x: 1633903200000,\n      value: 1228.46826171875,\n    },\n    {\n      y: 'AU',\n      x: 1633946400000,\n      value: 1528.995849609375,\n    },\n    {\n      y: 'AU',\n      x: 1633989600000,\n      value: 729.99755859375,\n    },\n    {\n      y: 'AU',\n      x: 1634032800000,\n      value: 1393.302978515625,\n    },\n    {\n      y: 'AU',\n      x: 1634076000000,\n      value: 971.7767944335938,\n    },\n    {\n      y: 'AU',\n      x: 1634119200000,\n      value: 1033.0284423828125,\n    },\n    {\n      y: 'AU',\n      x: 1634162400000,\n      value: 1826.966064453125,\n    },\n    {\n      y: 'AU',\n      x: 1634205600000,\n      value: 1540.0936889648438,\n    },\n    {\n      y: 'AU',\n      x: 1634248800000,\n      value: 1498.648681640625,\n    },\n    {\n      y: 'AU',\n      x: 1634292000000,\n      value: 1128.2857666015625,\n    },\n    {\n      y: 'AU',\n      x: 1634335200000,\n      value: 1374.63427734375,\n    },\n    {\n      y: 'AU',\n      x: 1634378400000,\n      value: 1749.794677734375,\n    },\n    {\n      y: 'AU',\n      x: 1634421600000,\n      value: 1624.445068359375,\n    },\n    {\n      y: 'AU',\n      x: 1634464800000,\n      value: 1714.9954223632812,\n    },\n    {\n      y: 'AU',\n      x: 1634508000000,\n      value: 1153.7655029296875,\n    },\n    {\n      y: 'AU',\n      x: 1634551200000,\n      value: 1165.4229736328125,\n    },\n    {\n      y: 'AU',\n      x: 1634594400000,\n      value: 1615.3231811523438,\n    },\n    {\n      y: 'AU',\n      x: 1634637600000,\n      value: 799.819580078125,\n    },\n    {\n      y: 'AU',\n      x: 1634680800000,\n      value: 1784.1341552734375,\n    },\n    {\n      y: 'CA',\n      x: 1633903200000,\n      value: 1373.2542724609375,\n    },\n    {\n      y: 'CA',\n      x: 1633946400000,\n      value: 984.0171508789062,\n    },\n    {\n      y: 'CA',\n      x: 1633989600000,\n      value: 667.0845947265625,\n    },\n    {\n      y: 'CA',\n      x: 1634032800000,\n      value: 1149.9925537109375,\n    },\n    {\n      y: 'CA',\n      x: 1634076000000,\n      value: 1397.2909545898438,\n    },\n    {\n      y: 'CA',\n      x: 1634119200000,\n      value: 1390.003662109375,\n    },\n    {\n      y: 'CA',\n      x: 1634162400000,\n      value: 1242.8565673828125,\n    },\n    {\n      y: 'CA',\n      x: 1634205600000,\n      value: 853.4672546386719,\n    },\n    {\n      y: 'CA',\n      x: 1634248800000,\n      value: 937.9247436523438,\n    },\n    {\n      y: 'CA',\n      x: 1634292000000,\n      value: 1240.626953125,\n    },\n    {\n      y: 'CA',\n      x: 1634335200000,\n      value: 1598.92431640625,\n    },\n    {\n      y: 'CA',\n      x: 1634378400000,\n      value: 2096.9384765625,\n    },\n    {\n      y: 'CA',\n      x: 1634421600000,\n      value: 1404.4989013671875,\n    },\n    {\n      y: 'CA',\n      x: 1634464800000,\n      value: 1532.7533569335938,\n    },\n    {\n      y: 'CA',\n      x: 1634508000000,\n      value: 1308.9225463867188,\n    },\n    {\n      y: 'CA',\n      x: 1634551200000,\n      value: 1254.5380859375,\n    },\n    {\n      y: 'CA',\n      x: 1634594400000,\n      value: 1447.060791015625,\n    },\n    {\n      y: 'CA',\n      x: 1634637600000,\n      value: 1026.0033569335938,\n    },\n    {\n      y: 'CA',\n      x: 1634680800000,\n      value: 1454.3275146484375,\n    },\n    {\n      y: 'CA',\n      x: 1634724000000,\n      value: 1378.6402587890625,\n    },\n    {\n      y: 'CH',\n      x: 1633903200000,\n      value: 585.6773834228516,\n    },\n    {\n      y: 'CH',\n      x: 1633946400000,\n      value: 690.4444274902344,\n    },\n    {\n      y: 'CH',\n      x: 1633989600000,\n      value: 695.4150390625,\n    },\n    {\n      y: 'CH',\n      x: 1634032800000,\n      value: 508.3909606933594,\n    },\n    {\n      y: 'CH',\n      x: 1634076000000,\n      value: 1424.2265014648438,\n    },\n    {\n      y: 'CH',\n      x: 1634119200000,\n      value: 1313.9705810546875,\n    },\n    {\n      y: 'CH',\n      x: 1634162400000,\n      value: 1311.3236694335938,\n    },\n    {\n      y: 'CH',\n      x: 1634205600000,\n      value: 1160.4334716796875,\n    },\n    {\n      y: 'CH',\n      x: 1634248800000,\n      value: 549.681884765625,\n    },\n    {\n      y: 'CH',\n      x: 1634292000000,\n      value: 879.4996032714844,\n    },\n    {\n      y: 'CH',\n      x: 1634335200000,\n      value: 1364.97216796875,\n    },\n    {\n      y: 'CH',\n      x: 1634378400000,\n      value: 1379.3760986328125,\n    },\n    {\n      y: 'CH',\n      x: 1634421600000,\n      value: 1590.429931640625,\n    },\n    {\n      y: 'CH',\n      x: 1634464800000,\n      value: 1702.2340698242188,\n    },\n    {\n      y: 'CH',\n      x: 1634508000000,\n      value: 941.3290405273438,\n    },\n    {\n      y: 'CH',\n      x: 1634551200000,\n      value: 1174.7496337890625,\n    },\n    {\n      y: 'CH',\n      x: 1634594400000,\n      value: 729.7496948242188,\n    },\n    {\n      y: 'CH',\n      x: 1634637600000,\n      value: 1526.578369140625,\n    },\n    {\n      y: 'CH',\n      x: 1634680800000,\n      value: 1129.46484375,\n    },\n    {\n      y: 'CL',\n      x: 1633946400000,\n      value: 1536.809814453125,\n    },\n    {\n      y: 'CL',\n      x: 1634076000000,\n      value: 1113.52978515625,\n    },\n    {\n      y: 'CL',\n      x: 1634162400000,\n      value: 1973.97119140625,\n    },\n    {\n      y: 'CL',\n      x: 1634205600000,\n      value: 1560.9017333984375,\n    },\n    {\n      y: 'CL',\n      x: 1634292000000,\n      value: 862.6887512207031,\n    },\n    {\n      y: 'CL',\n      x: 1634335200000,\n      value: 2353.2763671875,\n    },\n    {\n      y: 'CL',\n      x: 1634378400000,\n      value: 1944.758544921875,\n    },\n    {\n      y: 'CL',\n      x: 1634508000000,\n      value: 1354.3873291015625,\n    },\n    {\n      y: 'CL',\n      x: 1634637600000,\n      value: 996.3539428710938,\n    },\n    {\n      y: 'CL',\n      x: 1634680800000,\n      value: 1355.901611328125,\n    },\n    {\n      y: 'CN',\n      x: 1633903200000,\n      value: 1448.720703125,\n    },\n    {\n      y: 'CN',\n      x: 1633946400000,\n      value: 1519.4761352539062,\n    },\n    {\n      y: 'CN',\n      x: 1633989600000,\n      value: 1109.7001953125,\n    },\n    {\n      y: 'CN',\n      x: 1634032800000,\n      value: 1220.62548828125,\n    },\n    {\n      y: 'CN',\n      x: 1634076000000,\n      value: 968.7841186523438,\n    },\n    {\n      y: 'CN',\n      x: 1634119200000,\n      value: 1275.71826171875,\n    },\n    {\n      y: 'CN',\n      x: 1634162400000,\n      value: 1687.98876953125,\n    },\n    {\n      y: 'CN',\n      x: 1634205600000,\n      value: 1047.9259033203125,\n    },\n    {\n      y: 'CN',\n      x: 1634248800000,\n      value: 1552.34521484375,\n    },\n    {\n      y: 'CN',\n      x: 1634292000000,\n      value: 1690.6611328125,\n    },\n    {\n      y: 'CN',\n      x: 1634335200000,\n      value: 2057.9147338867188,\n    },\n    {\n      y: 'CN',\n      x: 1634378400000,\n      value: 1597.23876953125,\n    },\n    {\n      y: 'CN',\n      x: 1634421600000,\n      value: 1500.2396850585938,\n    },\n    {\n      y: 'CN',\n      x: 1634464800000,\n      value: 1854.201416015625,\n    },\n    {\n      y: 'CN',\n      x: 1634508000000,\n      value: 1057.568359375,\n    },\n    {\n      y: 'CN',\n      x: 1634551200000,\n      value: 1644.513671875,\n    },\n    {\n      y: 'CN',\n      x: 1634594400000,\n      value: 924.8408813476562,\n    },\n    {\n      y: 'CN',\n      x: 1634637600000,\n      value: 1176.250244140625,\n    },\n    {\n      y: 'CN',\n      x: 1634680800000,\n      value: 1293.4815673828125,\n    },\n    {\n      y: 'CN',\n      x: 1634724000000,\n      value: 857.4727172851562,\n    },\n    {\n      y: 'CO',\n      x: 1633903200000,\n      value: 1095.269775390625,\n    },\n    {\n      y: 'CO',\n      x: 1633946400000,\n      value: 453.3008728027344,\n    },\n    {\n      y: 'CO',\n      x: 1633989600000,\n      value: 1304.517822265625,\n    },\n    {\n      y: 'CO',\n      x: 1634032800000,\n      value: 1854.322021484375,\n    },\n    {\n      y: 'CO',\n      x: 1634076000000,\n      value: 1052.2171630859375,\n    },\n    {\n      y: 'CO',\n      x: 1634292000000,\n      value: 989.3553466796875,\n    },\n    {\n      y: 'CO',\n      x: 1634335200000,\n      value: 1096.70849609375,\n    },\n    {\n      y: 'CO',\n      x: 1634378400000,\n      value: 1076.895751953125,\n    },\n    {\n      y: 'CO',\n      x: 1634421600000,\n      value: 1075.150390625,\n    },\n    {\n      y: 'CO',\n      x: 1634508000000,\n      value: 871.4742431640625,\n    },\n    {\n      y: 'CO',\n      x: 1634551200000,\n      value: 1245.4185791015625,\n    },\n    {\n      y: 'CO',\n      x: 1634594400000,\n      value: 1923.149658203125,\n    },\n    {\n      y: 'CO',\n      x: 1634680800000,\n      value: 1824.5716552734375,\n    },\n    {\n      y: 'DE',\n      x: 1633946400000,\n      value: 1132.97509765625,\n    },\n    {\n      y: 'DE',\n      x: 1633989600000,\n      value: 1571.764404296875,\n    },\n    {\n      y: 'DE',\n      x: 1634032800000,\n      value: 1040.1160888671875,\n    },\n    {\n      y: 'DE',\n      x: 1634076000000,\n      value: 1529.804931640625,\n    },\n    {\n      y: 'DE',\n      x: 1634119200000,\n      value: 960.6709594726562,\n    },\n    {\n      y: 'DE',\n      x: 1634162400000,\n      value: 950.5629272460938,\n    },\n    {\n      y: 'DE',\n      x: 1634205600000,\n      value: 1107.2994995117188,\n    },\n    {\n      y: 'DE',\n      x: 1634248800000,\n      value: 770.2896118164062,\n    },\n    {\n      y: 'DE',\n      x: 1634292000000,\n      value: 1618.79541015625,\n    },\n    {\n      y: 'DE',\n      x: 1634335200000,\n      value: 1981.40087890625,\n    },\n    {\n      y: 'DE',\n      x: 1634378400000,\n      value: 1429.888916015625,\n    },\n    {\n      y: 'DE',\n      x: 1634421600000,\n      value: 1276.201171875,\n    },\n    {\n      y: 'DE',\n      x: 1634464800000,\n      value: 2380.615478515625,\n    },\n    {\n      y: 'DE',\n      x: 1634551200000,\n      value: 921.33544921875,\n    },\n    {\n      y: 'DE',\n      x: 1634594400000,\n      value: 1053.485107421875,\n    },\n    {\n      y: 'DE',\n      x: 1634637600000,\n      value: 1144.2720947265625,\n    },\n    {\n      y: 'DE',\n      x: 1634680800000,\n      value: 1533.2845458984375,\n    },\n    {\n      y: 'DK',\n      x: 1633903200000,\n      value: 1195.4417114257812,\n    },\n    {\n      y: 'DK',\n      x: 1634032800000,\n      value: 945.0773315429688,\n    },\n    {\n      y: 'DK',\n      x: 1634292000000,\n      value: 1464.6525268554688,\n    },\n    {\n      y: 'DK',\n      x: 1634335200000,\n      value: 1778.8946533203125,\n    },\n    {\n      y: 'DK',\n      x: 1634421600000,\n      value: 1895.1260986328125,\n    },\n    {\n      y: 'DK',\n      x: 1634464800000,\n      value: 2099.8984375,\n    },\n    {\n      y: 'DK',\n      x: 1634508000000,\n      value: 1178.702392578125,\n    },\n    {\n      y: 'DK',\n      x: 1634637600000,\n      value: 1082.788818359375,\n    },\n    {\n      y: 'DK',\n      x: 1634680800000,\n      value: 1333.0047607421875,\n    },\n    {\n      y: 'EC',\n      x: 1633903200000,\n      value: 1260.6492309570312,\n    },\n    {\n      y: 'EC',\n      x: 1633946400000,\n      value: 1139.206298828125,\n    },\n    {\n      y: 'EC',\n      x: 1633989600000,\n      value: 1083.087646484375,\n    },\n    {\n      y: 'EC',\n      x: 1634032800000,\n      value: 1226.3377075195312,\n    },\n    {\n      y: 'EC',\n      x: 1634076000000,\n      value: 1277.2030029296875,\n    },\n    {\n      y: 'EC',\n      x: 1634119200000,\n      value: 1494.2833251953125,\n    },\n    {\n      y: 'EC',\n      x: 1634205600000,\n      value: 1556.5960693359375,\n    },\n    {\n      y: 'EC',\n      x: 1634248800000,\n      value: 888.1316528320312,\n    },\n    {\n      y: 'EC',\n      x: 1634292000000,\n      value: 1607.5115966796875,\n    },\n    {\n      y: 'EC',\n      x: 1634335200000,\n      value: 1786.5728759765625,\n    },\n    {\n      y: 'EC',\n      x: 1634378400000,\n      value: 1059.01220703125,\n    },\n    {\n      y: 'EC',\n      x: 1634421600000,\n      value: 1307.0654907226562,\n    },\n    {\n      y: 'EC',\n      x: 1634464800000,\n      value: 1700.533447265625,\n    },\n    {\n      y: 'EC',\n      x: 1634508000000,\n      value: 1518.436279296875,\n    },\n    {\n      y: 'EC',\n      x: 1634551200000,\n      value: 1680.8818359375,\n    },\n    {\n      y: 'EC',\n      x: 1634594400000,\n      value: 1138.2274169921875,\n    },\n    {\n      y: 'EC',\n      x: 1634637600000,\n      value: 801.6689453125,\n    },\n    {\n      y: 'EC',\n      x: 1634680800000,\n      value: 1023.8098754882812,\n    },\n    {\n      y: 'ES',\n      x: 1634205600000,\n      value: 1095.447250366211,\n    },\n    {\n      y: 'ES',\n      x: 1634248800000,\n      value: 846.2098999023438,\n    },\n    {\n      y: 'ES',\n      x: 1634464800000,\n      value: 513.0786743164062,\n    },\n    {\n      y: 'ES',\n      x: 1634551200000,\n      value: 421.4815673828125,\n    },\n    {\n      y: 'ES',\n      x: 1634680800000,\n      value: 1783.7108154296875,\n    },\n    {\n      y: 'FI',\n      x: 1633946400000,\n      value: 1989.708740234375,\n    },\n    {\n      y: 'FI',\n      x: 1633989600000,\n      value: 1616.2996826171875,\n    },\n    {\n      y: 'FI',\n      x: 1634032800000,\n      value: 1238.53076171875,\n    },\n    {\n      y: 'FI',\n      x: 1634076000000,\n      value: 1953.0860595703125,\n    },\n    {\n      y: 'FI',\n      x: 1634162400000,\n      value: 1701.4493408203125,\n    },\n    {\n      y: 'FI',\n      x: 1634205600000,\n      value: 1323.0477294921875,\n    },\n    {\n      y: 'FI',\n      x: 1634508000000,\n      value: 958.4090576171875,\n    },\n    {\n      y: 'FI',\n      x: 1634551200000,\n      value: 1426.584716796875,\n    },\n    {\n      y: 'FI',\n      x: 1634594400000,\n      value: 1633.1131591796875,\n    },\n    {\n      y: 'FI',\n      x: 1634680800000,\n      value: 778.8355102539062,\n    },\n    {\n      y: 'FR',\n      x: 1633903200000,\n      value: 741.9657592773438,\n    },\n    {\n      y: 'FR',\n      x: 1633946400000,\n      value: 1027.302001953125,\n    },\n    {\n      y: 'FR',\n      x: 1633989600000,\n      value: 933.7100830078125,\n    },\n    {\n      y: 'FR',\n      x: 1634032800000,\n      value: 1727.9757080078125,\n    },\n    {\n      y: 'FR',\n      x: 1634205600000,\n      value: 1445.7293701171875,\n    },\n    {\n      y: 'FR',\n      x: 1634335200000,\n      value: 1083.11572265625,\n    },\n    {\n      y: 'FR',\n      x: 1634378400000,\n      value: 840.2843017578125,\n    },\n    {\n      y: 'FR',\n      x: 1634464800000,\n      value: 1074.0158081054688,\n    },\n    {\n      y: 'FR',\n      x: 1634508000000,\n      value: 1994.239501953125,\n    },\n    {\n      y: 'FR',\n      x: 1634680800000,\n      value: 1290.5693359375,\n    },\n    {\n      y: 'GB',\n      x: 1633903200000,\n      value: 1000.9656982421875,\n    },\n    {\n      y: 'GB',\n      x: 1633946400000,\n      value: 1361.612060546875,\n    },\n    {\n      y: 'GB',\n      x: 1633989600000,\n      value: 1048.4798278808594,\n    },\n    {\n      y: 'GB',\n      x: 1634032800000,\n      value: 1040.1541748046875,\n    },\n    {\n      y: 'GB',\n      x: 1634076000000,\n      value: 1261.7947387695312,\n    },\n    {\n      y: 'GB',\n      x: 1634119200000,\n      value: 1279.813720703125,\n    },\n    {\n      y: 'GB',\n      x: 1634162400000,\n      value: 1494.7257080078125,\n    },\n    {\n      y: 'GB',\n      x: 1634205600000,\n      value: 1481.67041015625,\n    },\n    {\n      y: 'GB',\n      x: 1634248800000,\n      value: 1128.2760009765625,\n    },\n    {\n      y: 'GB',\n      x: 1634292000000,\n      value: 1075.6246337890625,\n    },\n    {\n      y: 'GB',\n      x: 1634335200000,\n      value: 1837.26220703125,\n    },\n    {\n      y: 'GB',\n      x: 1634378400000,\n      value: 1100.0601806640625,\n    },\n    {\n      y: 'GB',\n      x: 1634421600000,\n      value: 2098.5350341796875,\n    },\n    {\n      y: 'GB',\n      x: 1634464800000,\n      value: 1313.1705322265625,\n    },\n    {\n      y: 'GB',\n      x: 1634508000000,\n      value: 1930.4819946289062,\n    },\n    {\n      y: 'GB',\n      x: 1634551200000,\n      value: 1384.9301147460938,\n    },\n    {\n      y: 'GB',\n      x: 1634594400000,\n      value: 1308.79443359375,\n    },\n    {\n      y: 'GB',\n      x: 1634637600000,\n      value: 1189.3238525390625,\n    },\n    {\n      y: 'GB',\n      x: 1634680800000,\n      value: 1454.0706787109375,\n    },\n    {\n      y: '__other__',\n      x: 1633903200000,\n      value: 1193.8202514648438,\n    },\n    {\n      y: '__other__',\n      x: 1633946400000,\n      value: 1200.88037109375,\n    },\n    {\n      y: '__other__',\n      x: 1633989600000,\n      value: 1234.8555908203125,\n    },\n    {\n      y: '__other__',\n      x: 1634032800000,\n      value: 1078.6812133789062,\n    },\n    {\n      y: '__other__',\n      x: 1634076000000,\n      value: 995.9703979492188,\n    },\n    {\n      y: '__other__',\n      x: 1634119200000,\n      value: 1198.1402587890625,\n    },\n    {\n      y: '__other__',\n      x: 1634162400000,\n      value: 1106.43212890625,\n    },\n    {\n      y: '__other__',\n      x: 1634205600000,\n      value: 1180.4904174804688,\n    },\n    {\n      y: '__other__',\n      x: 1634248800000,\n      value: 1319.378173828125,\n    },\n    {\n      y: '__other__',\n      x: 1634292000000,\n      value: 1177.3067016601562,\n    },\n    {\n      y: '__other__',\n      x: 1634335200000,\n      value: 1503.594482421875,\n    },\n    {\n      y: '__other__',\n      x: 1634378400000,\n      value: 1577.262939453125,\n    },\n    {\n      y: '__other__',\n      x: 1634421600000,\n      value: 1739.27294921875,\n    },\n    {\n      y: '__other__',\n      x: 1634464800000,\n      value: 1519.1485595703125,\n    },\n    {\n      y: '__other__',\n      x: 1634508000000,\n      value: 1136.928466796875,\n    },\n    {\n      y: '__other__',\n      x: 1634551200000,\n      value: 1072.9026489257812,\n    },\n    {\n      y: '__other__',\n      x: 1634594400000,\n      value: 1105.2606201171875,\n    },\n    {\n      y: '__other__',\n      x: 1634637600000,\n      value: 1313.4656982421875,\n    },\n    {\n      y: '__other__',\n      x: 1634680800000,\n      value: 1250.16357421875,\n    },\n    {\n      y: '__other__',\n      x: 1634724000000,\n      value: 999.7426681518555,\n    },\n  ],\n};\n\n/** @internal */\nexport const DATA_2: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'h', value: 3 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('dd MMM HHa', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    { y: 'CN', x: 1635285600000, value: 1 },\n    { y: 'CN', x: 1635296400000, value: 1 },\n    { y: 'CN', x: 1635307200000, value: 4 },\n    { y: 'CN', x: 1635318000000, value: 9 },\n    { y: 'CN', x: 1635328800000, value: 13 },\n    { y: 'CN', x: 1635339600000, value: 13 },\n    { y: 'CN', x: 1635350400000, value: 4 },\n    { y: 'CN', x: 1635361200000, value: 1 },\n    { y: 'CN', x: 1635372000000, value: 0 },\n    { y: 'CN', x: 1635382800000, value: 1 },\n    { y: 'CN', x: 1635393600000, value: 0 },\n    { y: 'CN', x: 1635404400000, value: 12 },\n    { y: 'CN', x: 1635415200000, value: 21 },\n    { y: 'CN', x: 1635426000000, value: 6 },\n    { y: 'CN', x: 1635436800000, value: 11 },\n    { y: 'CN', x: 1635447600000, value: 1 },\n    { y: 'CN', x: 1635458400000, value: 0 },\n    { y: 'CN', x: 1635469200000, value: 0 },\n    { y: 'CN', x: 1635480000000, value: 4 },\n    { y: 'CN', x: 1635490800000, value: 8 },\n    { y: 'CN', x: 1635501600000, value: 19 },\n    { y: 'CN', x: 1635512400000, value: 10 },\n    { y: 'CN', x: 1635523200000, value: 5 },\n    { y: 'CN', x: 1635534000000, value: 1 },\n    { y: 'CN', x: 1635544800000, value: 0 },\n    { y: 'CN', x: 1635555600000, value: 0 },\n    { y: 'CN', x: 1635566400000, value: 3 },\n    { y: 'CN', x: 1635577200000, value: 15 },\n    { y: 'CN', x: 1635588000000, value: 12 },\n    { y: 'CN', x: 1635598800000, value: 8 },\n    { y: 'CN', x: 1635609600000, value: 4 },\n    { y: 'CN', x: 1635620400000, value: 2 },\n    { y: 'CN', x: 1635631200000, value: 0 },\n    { y: 'CN', x: 1635645600000, value: 1 },\n    { y: 'CN', x: 1635656400000, value: 6 },\n    { y: 'CN', x: 1635667200000, value: 13 },\n    { y: 'CN', x: 1635678000000, value: 17 },\n    { y: 'CN', x: 1635688800000, value: 10 },\n    { y: 'CN', x: 1635699600000, value: 0 },\n    { y: 'CN', x: 1635710400000, value: 0 },\n    { y: 'CN', x: 1635721200000, value: 0 },\n    { y: 'CN', x: 1635732000000, value: 1 },\n    { y: 'CN', x: 1635742800000, value: 4 },\n    { y: 'CN', x: 1635753600000, value: 13 },\n    { y: 'CN', x: 1635764400000, value: 13 },\n    { y: 'CN', x: 1635775200000, value: 12 },\n    { y: 'CN', x: 1635786000000, value: 7 },\n    { y: 'CN', x: 1635796800000, value: 0 },\n    { y: 'CN', x: 1635807600000, value: 0 },\n    { y: 'CN', x: 1635818400000, value: 3 },\n    { y: 'CN', x: 1635829200000, value: 4 },\n    { y: 'CN', x: 1635840000000, value: 9 },\n    { y: 'CN', x: 1635850800000, value: 9 },\n    { y: 'CN', x: 1635861600000, value: 8 },\n    { y: 'CN', x: 1635872400000, value: 1 },\n    { y: 'CN', x: 1635883200000, value: 1 },\n    { y: 'CN', x: 1635894000000, value: 0 },\n    { y: 'CN', x: 1635904800000, value: 1 },\n    { y: 'CN', x: 1635915600000, value: 6 },\n    { y: 'CN', x: 1635926400000, value: 16 },\n    { y: 'CN', x: 1635937200000, value: 13 },\n    { y: 'CN', x: 1635948000000, value: 14 },\n    { y: 'IN', x: 1635307200000, value: 1 },\n    { y: 'IN', x: 1635318000000, value: 14 },\n    { y: 'IN', x: 1635328800000, value: 15 },\n    { y: 'IN', x: 1635339600000, value: 11 },\n    { y: 'IN', x: 1635350400000, value: 4 },\n    { y: 'IN', x: 1635361200000, value: 0 },\n    { y: 'IN', x: 1635372000000, value: 0 },\n    { y: 'IN', x: 1635382800000, value: 1 },\n    { y: 'IN', x: 1635393600000, value: 4 },\n    { y: 'IN', x: 1635404400000, value: 8 },\n    { y: 'IN', x: 1635415200000, value: 12 },\n    { y: 'IN', x: 1635426000000, value: 11 },\n    { y: 'IN', x: 1635436800000, value: 1 },\n    { y: 'IN', x: 1635447600000, value: 1 },\n    { y: 'IN', x: 1635458400000, value: 0 },\n    { y: 'IN', x: 1635469200000, value: 1 },\n    { y: 'IN', x: 1635480000000, value: 2 },\n    { y: 'IN', x: 1635490800000, value: 7 },\n    { y: 'IN', x: 1635501600000, value: 9 },\n    { y: 'IN', x: 1635512400000, value: 9 },\n    { y: 'IN', x: 1635523200000, value: 4 },\n    { y: 'IN', x: 1635534000000, value: 1 },\n    { y: 'IN', x: 1635544800000, value: 0 },\n    { y: 'IN', x: 1635555600000, value: 2 },\n    { y: 'IN', x: 1635566400000, value: 2 },\n    { y: 'IN', x: 1635577200000, value: 8 },\n    { y: 'IN', x: 1635588000000, value: 8 },\n    { y: 'IN', x: 1635598800000, value: 10 },\n    { y: 'IN', x: 1635609600000, value: 7 },\n    { y: 'IN', x: 1635620400000, value: 0 },\n    { y: 'IN', x: 1635631200000, value: 0 },\n    { y: 'IN', x: 1635645600000, value: 1 },\n    { y: 'IN', x: 1635656400000, value: 4 },\n    { y: 'IN', x: 1635667200000, value: 6 },\n    { y: 'IN', x: 1635678000000, value: 10 },\n    { y: 'IN', x: 1635688800000, value: 3 },\n    { y: 'IN', x: 1635699600000, value: 4 },\n    { y: 'IN', x: 1635710400000, value: 0 },\n    { y: 'IN', x: 1635721200000, value: 1 },\n    { y: 'IN', x: 1635732000000, value: 1 },\n    { y: 'IN', x: 1635742800000, value: 3 },\n    { y: 'IN', x: 1635753600000, value: 6 },\n    { y: 'IN', x: 1635764400000, value: 10 },\n    { y: 'IN', x: 1635775200000, value: 11 },\n    { y: 'IN', x: 1635786000000, value: 1 },\n    { y: 'IN', x: 1635796800000, value: 1 },\n    { y: 'IN', x: 1635807600000, value: 0 },\n    { y: 'IN', x: 1635818400000, value: 2 },\n    { y: 'IN', x: 1635829200000, value: 2 },\n    { y: 'IN', x: 1635840000000, value: 10 },\n    { y: 'IN', x: 1635850800000, value: 17 },\n    { y: 'IN', x: 1635861600000, value: 7 },\n    { y: 'IN', x: 1635872400000, value: 1 },\n    { y: 'IN', x: 1635883200000, value: 1 },\n    { y: 'IN', x: 1635894000000, value: 1 },\n    { y: 'IN', x: 1635904800000, value: 0 },\n    { y: 'IN', x: 1635915600000, value: 3 },\n    { y: 'IN', x: 1635926400000, value: 4 },\n    { y: 'IN', x: 1635937200000, value: 4 },\n    { y: 'IN', x: 1635948000000, value: 10 },\n    { y: 'IN', x: 1635958800000, value: 2 },\n    { y: 'IN', x: 1635969600000, value: 1 },\n    { y: 'US', x: 1635318000000, value: 6 },\n    { y: 'US', x: 1635328800000, value: 6 },\n    { y: 'US', x: 1635339600000, value: 4 },\n    { y: 'US', x: 1635350400000, value: 5 },\n    { y: 'US', x: 1635361200000, value: 0 },\n    { y: 'US', x: 1635372000000, value: 0 },\n    { y: 'US', x: 1635382800000, value: 0 },\n    { y: 'US', x: 1635393600000, value: 1 },\n    { y: 'US', x: 1635404400000, value: 2 },\n    { y: 'US', x: 1635415200000, value: 5 },\n    { y: 'US', x: 1635426000000, value: 6 },\n    { y: 'US', x: 1635436800000, value: 2 },\n    { y: 'US', x: 1635447600000, value: 0 },\n    { y: 'US', x: 1635458400000, value: 0 },\n    { y: 'US', x: 1635469200000, value: 0 },\n    { y: 'US', x: 1635480000000, value: 1 },\n    { y: 'US', x: 1635490800000, value: 4 },\n    { y: 'US', x: 1635501600000, value: 4 },\n    { y: 'US', x: 1635512400000, value: 2 },\n    { y: 'US', x: 1635523200000, value: 0 },\n    { y: 'US', x: 1635534000000, value: 1 },\n    { y: 'US', x: 1635544800000, value: 0 },\n    { y: 'US', x: 1635555600000, value: 0 },\n    { y: 'US', x: 1635566400000, value: 1 },\n    { y: 'US', x: 1635577200000, value: 4 },\n    { y: 'US', x: 1635588000000, value: 9 },\n    { y: 'US', x: 1635598800000, value: 4 },\n    { y: 'US', x: 1635609600000, value: 1 },\n    { y: 'US', x: 1635620400000, value: 1 },\n    { y: 'US', x: 1635631200000, value: 0 },\n    { y: 'US', x: 1635645600000, value: 0 },\n    { y: 'US', x: 1635656400000, value: 3 },\n    { y: 'US', x: 1635667200000, value: 4 },\n    { y: 'US', x: 1635678000000, value: 10 },\n    { y: 'US', x: 1635688800000, value: 3 },\n    { y: 'US', x: 1635699600000, value: 0 },\n    { y: 'US', x: 1635710400000, value: 0 },\n    { y: 'US', x: 1635721200000, value: 0 },\n    { y: 'US', x: 1635732000000, value: 0 },\n    { y: 'US', x: 1635742800000, value: 2 },\n    { y: 'US', x: 1635753600000, value: 6 },\n    { y: 'US', x: 1635764400000, value: 3 },\n    { y: 'US', x: 1635775200000, value: 4 },\n    { y: 'US', x: 1635786000000, value: 1 },\n    { y: 'US', x: 1635796800000, value: 0 },\n    { y: 'US', x: 1635807600000, value: 0 },\n    { y: 'US', x: 1635818400000, value: 0 },\n    { y: 'US', x: 1635829200000, value: 1 },\n    { y: 'US', x: 1635840000000, value: 5 },\n    { y: 'US', x: 1635850800000, value: 4 },\n    { y: 'US', x: 1635861600000, value: 3 },\n    { y: 'US', x: 1635872400000, value: 0 },\n    { y: 'US', x: 1635883200000, value: 0 },\n    { y: 'US', x: 1635894000000, value: 1 },\n    { y: 'US', x: 1635904800000, value: 1 },\n    { y: 'US', x: 1635915600000, value: 4 },\n    { y: 'US', x: 1635926400000, value: 2 },\n    { y: 'US', x: 1635937200000, value: 7 },\n    { y: 'US', x: 1635948000000, value: 0 },\n    { y: 'US', x: 1635958800000, value: 4 },\n    { y: '__other__', x: 1635296400000, value: 1 },\n    { y: '__other__', x: 1635307200000, value: 8 },\n    { y: '__other__', x: 1635318000000, value: 26 },\n    { y: '__other__', x: 1635328800000, value: 39 },\n    { y: '__other__', x: 1635339600000, value: 27 },\n    { y: '__other__', x: 1635350400000, value: 21 },\n    { y: '__other__', x: 1635361200000, value: 3 },\n    { y: '__other__', x: 1635372000000, value: 0 },\n    { y: '__other__', x: 1635382800000, value: 4 },\n    { y: '__other__', x: 1635393600000, value: 12 },\n    { y: '__other__', x: 1635404400000, value: 26 },\n    { y: '__other__', x: 1635415200000, value: 34 },\n    { y: '__other__', x: 1635426000000, value: 32 },\n    { y: '__other__', x: 1635436800000, value: 15 },\n    { y: '__other__', x: 1635447600000, value: 0 },\n    { y: '__other__', x: 1635458400000, value: 1 },\n    { y: '__other__', x: 1635469200000, value: 4 },\n    { y: '__other__', x: 1635480000000, value: 10 },\n    { y: '__other__', x: 1635490800000, value: 31 },\n    { y: '__other__', x: 1635501600000, value: 40 },\n    { y: '__other__', x: 1635512400000, value: 28 },\n    { y: '__other__', x: 1635523200000, value: 19 },\n    { y: '__other__', x: 1635534000000, value: 5 },\n    { y: '__other__', x: 1635544800000, value: 1 },\n    { y: '__other__', x: 1635555600000, value: 3 },\n    { y: '__other__', x: 1635566400000, value: 3 },\n    { y: '__other__', x: 1635577200000, value: 23 },\n    { y: '__other__', x: 1635588000000, value: 50 },\n    { y: '__other__', x: 1635598800000, value: 32 },\n    { y: '__other__', x: 1635609600000, value: 12 },\n    { y: '__other__', x: 1635620400000, value: 5 },\n    { y: '__other__', x: 1635631200000, value: 2 },\n    { y: '__other__', x: 1635645600000, value: 2 },\n    { y: '__other__', x: 1635656400000, value: 16 },\n    { y: '__other__', x: 1635667200000, value: 38 },\n    { y: '__other__', x: 1635678000000, value: 36 },\n    { y: '__other__', x: 1635688800000, value: 29 },\n    { y: '__other__', x: 1635699600000, value: 11 },\n    { y: '__other__', x: 1635710400000, value: 1 },\n    { y: '__other__', x: 1635721200000, value: 2 },\n    { y: '__other__', x: 1635732000000, value: 1 },\n    { y: '__other__', x: 1635742800000, value: 19 },\n    { y: '__other__', x: 1635753600000, value: 32 },\n    { y: '__other__', x: 1635764400000, value: 44 },\n    { y: '__other__', x: 1635775200000, value: 22 },\n    { y: '__other__', x: 1635786000000, value: 9 },\n    { y: '__other__', x: 1635796800000, value: 2 },\n    { y: '__other__', x: 1635807600000, value: 0 },\n    { y: '__other__', x: 1635818400000, value: 7 },\n    { y: '__other__', x: 1635829200000, value: 16 },\n    { y: '__other__', x: 1635840000000, value: 44 },\n    { y: '__other__', x: 1635850800000, value: 40 },\n    { y: '__other__', x: 1635861600000, value: 25 },\n    { y: '__other__', x: 1635872400000, value: 8 },\n    { y: '__other__', x: 1635883200000, value: 1 },\n    { y: '__other__', x: 1635894000000, value: 1 },\n    { y: '__other__', x: 1635904800000, value: 4 },\n    { y: '__other__', x: 1635915600000, value: 13 },\n    { y: '__other__', x: 1635926400000, value: 36 },\n    { y: '__other__', x: 1635937200000, value: 35 },\n    { y: '__other__', x: 1635948000000, value: 33 },\n    { y: '__other__', x: 1635958800000, value: 12 },\n    { y: '__other__', x: 1635969600000, value: 1 },\n  ],\n};\n\n/** @internal */\nexport const DATA_3: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'h', value: 12 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    { x: 1635588000000, y: 'a', value: 1 },\n    { x: 1635631200000, y: 'a', value: 2 },\n    { x: 1635678000000, y: 'a', value: 3 },\n    { x: 1635721200000, y: 'a', value: 4 },\n    { x: 1635764400000, y: 'a', value: 5 },\n  ],\n};\n\n/** @internal */\nexport const DATA_4: HeatmapDataSets = {\n  interval: { type: 'calendar', unit: 'w', value: 1 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('dd/MM HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    { x: 1634508000000, y: 'CN', value: 43 },\n    { x: 1635112800000, y: 'CN', value: 330 },\n    { x: 1635721200000, y: 'CN', value: 155 },\n    { x: 1634508000000, y: 'IN', value: 41 },\n    { x: 1635112800000, y: 'IN', value: 261 },\n    { x: 1635721200000, y: 'IN', value: 115 },\n    { x: 1634508000000, y: 'US', value: 20 },\n    { x: 1635112800000, y: 'US', value: 123 },\n    { x: 1635721200000, y: 'US', value: 53 },\n    { x: 1634508000000, y: '__other__', value: 145 },\n    { x: 1635112800000, y: '__other__', value: 902 },\n    { x: 1635721200000, y: '__other__', value: 448 },\n  ],\n};\n\n/** @internal */\nexport const DATA_5: HeatmapDataSets = {\n  domain: { min: 1635984000000, max: 1636002000000 },\n  interval: { type: 'calendar', unit: 'h', value: 1 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  data: [\n    { x: 1635984000000, y: 'sample_web_logs', value: 4202 },\n    { x: 1635987600000, y: 'sample_web_logs', value: 0 },\n    { x: 1635994800000, y: 'sample_web_logs', value: 5808 },\n    { x: 1635998400000, y: 'sample_web_logs', value: 4629 },\n  ],\n};\n\n/** @internal */\nexport const DATA_6: HeatmapDataSets = {\n  interval: { type: 'fixed', value: 30, unit: 'm' },\n  timeZone: 'UTC',\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'UTC' });\n  },\n  data: [\n    {\n      x: 1572847200000,\n      y: 'i-71a7f77b',\n      value: 0,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-71a7f77b',\n      value: 3,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-71a7f77b',\n      value: 25,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-71a7f77b',\n      value: 50,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-71a7f77b',\n      value: 75,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-71a7f77b',\n      value: 1,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-71a7f77b',\n      value: 2,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-71a7f77b',\n      value: 24,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-71a7f77b',\n      value: 49,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-71a7f77b',\n      value: 74,\n    },\n    {\n      x: 1572908400000,\n      y: 'i-71a7f77b',\n      value: 0.07397995823713518,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-71a7f77b',\n      value: 0.03091943662761636,\n    },\n    {\n      x: 1572836400000,\n      y: 'i-5d303091',\n      value: 0.08552883,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-5d303091',\n      value: 93.72707,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-5d303091',\n      value: 50.42717,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-5d303091',\n      value: 2.397241548271217,\n    },\n    {\n      x: 1572879600000,\n      y: 'i-9f07c700',\n      value: 76.10974,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-9f07c700',\n      value: 90.75613,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-9f07c700',\n      value: 28.016079894074096,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-9f07c700',\n      value: 2.1780847014803517,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-9f07c700',\n      value: 0.02531410357696053,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-9f07c700',\n      value: 2.258382748340588,\n    },\n    {\n      x: 1572849000000,\n      y: 'i-d17dcd4c',\n      value: 4.210354,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-d17dcd4c',\n      value: 89.6491,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-d17dcd4c',\n      value: 21.289199095933952,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-d17dcd4c',\n      value: 2.6694704470251565,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-d17dcd4c',\n      value: 0.5850535152380327,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-d17dcd4c',\n      value: 65.51073,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-d17dcd4c',\n      value: 0.792024488699497,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-d17dcd4c',\n      value: 0.5615131943374475,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-d17dcd4c',\n      value: 0.394169564717292,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-d17dcd4c',\n      value: 0.2046931978696015,\n    },\n    {\n      x: 1572908400000,\n      y: 'i-d17dcd4c',\n      value: 0.15470219555712722,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-d17dcd4c',\n      value: 0.11787869182904363,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-37fbfb39',\n      value: 83.92723,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-37fbfb39',\n      value: 21.49062,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-37fbfb39',\n      value: 0.5619960991147903,\n    },\n    {\n      x: 1572847200000,\n      y: 'i-b118880c',\n      value: 0.7038798,\n    },\n    {\n      x: 1572849000000,\n      y: 'i-b118880c',\n      value: 8.885096,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-b118880c',\n      value: 81.92052,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-b118880c',\n      value: 6.385433818669964,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-b118880c',\n      value: 0.7529454579485226,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-b118880c',\n      value: 0.16135425990161706,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-b118880c',\n      value: 32.23389,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-b118880c',\n      value: 0.7578572100943552,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-b118880c',\n      value: 0.6111162033658646,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-b118880c',\n      value: 0.443324186956941,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-b118880c',\n      value: 0.3075144354570065,\n    },\n    {\n      x: 1572908400000,\n      y: 'i-b118880c',\n      value: 0.18905638316915416,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-b118880c',\n      value: 0.15234682243112949,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-66578749',\n      value: 60.28918,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-66578749',\n      value: 67.31324,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-66578749',\n      value: 81.34977,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-66578749',\n      value: 48.25439,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-66578749',\n      value: 31.06416,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-66578749',\n      value: 3.0462498034282,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-66578749',\n      value: 0.23590009859709954,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-66578749',\n      value: 59.04865,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-66578749',\n      value: 0.9189229698167014,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-66578749',\n      value: 0.3479760519757592,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-66578749',\n      value: 0.09983690866310621,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-66578749',\n      value: 0.026896391677229674,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-5d302081',\n      value: 79.62794,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-5d302081',\n      value: 38.70934,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-5d302081',\n      value: 2.3953009901171605,\n    },\n    {\n      x: 1572849000000,\n      y: 'i-ef74d410',\n      value: 0.1538905,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-ef74d410',\n      value: 77.86751,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-ef74d410',\n      value: 7.1111139045789935,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-ef74d410',\n      value: 0.07120867159413205,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-ef74d410',\n      value: 0.46005659357549517,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-ef74d410',\n      value: 0.38022323217471177,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-ef74d410',\n      value: 0.05279469228246696,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-ef74d410',\n      value: 0.04307715617784296,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-3b3565e0',\n      value: 49.34176,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-3b3565e0',\n      value: 74.35002,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-3b3565e0',\n      value: 70.82227,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-3b3565e0',\n      value: 1.129179725764338,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-3b3565e0',\n      value: 0.08944716315823782,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-3b3565e0',\n      value: 0.025215653478830508,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-7db7c747',\n      value: 56.8998,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-7db7c747',\n      value: 34.59895,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-7db7c747',\n      value: 69.07187,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-7db7c747',\n      value: 20.04246,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-7db7c747',\n      value: 0.501246678069153,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-7db7c747',\n      value: 0.10228357345625516,\n    },\n    {\n      x: 1572858000000,\n      y: 'i-8270d519',\n      value: 23.41472,\n    },\n    {\n      x: 1572870600000,\n      y: 'i-8270d519',\n      value: 0.09778774,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-8270d519',\n      value: 57.96897,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-8270d519',\n      value: 63.73998,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-8270d519',\n      value: 45.19735,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-8270d519',\n      value: 2.166846374797418,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-8270d519',\n      value: 0.2283247569954898,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-8270d519',\n      value: 42.24531,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-8270d519',\n      value: 0.49207037746175214,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-8270d519',\n      value: 0.3243143048875506,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-8270d519',\n      value: 0.10024450293348822,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-8270d519',\n      value: 0.033965805201251434,\n    },\n    {\n      x: 1572847200000,\n      y: 'i-4fefbf6c',\n      value: 0.1867262,\n    },\n    {\n      x: 1572849000000,\n      y: 'i-4fefbf6c',\n      value: 11.47219,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-4fefbf6c',\n      value: 53.59314,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-4fefbf6c',\n      value: 15.91959,\n    },\n    {\n      x: 1572895800000,\n      y: 'i-4fefbf6c',\n      value: 0.5736916311300446,\n    },\n    {\n      x: 1572897600000,\n      y: 'i-4fefbf6c',\n      value: 29.28071,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-4fefbf6c',\n      value: 25.1765,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-4fefbf6c',\n      value: 1.4671989108080628,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-4fefbf6c',\n      value: 0.8367316591855911,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-4fefbf6c',\n      value: 0.48490204846685775,\n    },\n    {\n      x: 1572906600000,\n      y: 'i-4fefbf6c',\n      value: 0.24413767062868427,\n    },\n    {\n      x: 1572908400000,\n      y: 'i-4fefbf6c',\n      value: 0.17736807671463703,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-4fefbf6c',\n      value: 0.10326196476266834,\n    },\n    {\n      x: 1572859800000,\n      y: 'i-16fd8d2a',\n      value: 33.42309,\n    },\n    {\n      x: 1572861600000,\n      y: 'i-16fd8d2a',\n      value: 47.17204,\n    },\n    {\n      x: 1572863400000,\n      y: 'i-16fd8d2a',\n      value: 0.16179846422070132,\n    },\n    {\n      x: 1572847200000,\n      y: 'i-ca80c01a',\n      value: 0.6692097,\n    },\n    {\n      x: 1572870600000,\n      y: 'i-ca80c01a',\n      value: 44.60156,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-ca80c01a',\n      value: 26.06775,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-ca80c01a',\n      value: 0.24539550844649843,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-ca80c01a',\n      value: 0.09130230719255052,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-4a90d021',\n      value: 43.41428,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-4a90d021',\n      value: 20.30829,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-4a90d021',\n      value: 20.706159141229445,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-4ff414ac',\n      value: 42.82781,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-4ff414ac',\n      value: 3.643815188524499,\n    },\n    {\n      x: 1572910200000,\n      y: 'i-4ff414ac',\n      value: 7.987421742621203,\n    },\n    {\n      x: 1572870600000,\n      y: 'i-850643a7',\n      value: 37.51045,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-850643a7',\n      value: 0.08720035850172568,\n    },\n    {\n      x: 1572859800000,\n      y: 'i-c961f137',\n      value: 0.7612613,\n    },\n    {\n      x: 1572861600000,\n      y: 'i-c961f137',\n      value: 36.94459,\n    },\n    {\n      x: 1572863400000,\n      y: 'i-c961f137',\n      value: 3.530620723871948,\n    },\n    {\n      x: 1572874200000,\n      y: 'i-7cdbab5b',\n      value: 3.468401,\n    },\n    {\n      x: 1572876000000,\n      y: 'i-7cdbab5b',\n      value: 15.87705,\n    },\n    {\n      x: 1572877800000,\n      y: 'i-7cdbab5b',\n      value: 21.19452,\n    },\n    {\n      x: 1572879600000,\n      y: 'i-7cdbab5b',\n      value: 22.534,\n    },\n    {\n      x: 1572881400000,\n      y: 'i-7cdbab5b',\n      value: 30.46893,\n    },\n    {\n      x: 1572883200000,\n      y: 'i-7cdbab5b',\n      value: 9.532251,\n    },\n    {\n      x: 1572885000000,\n      y: 'i-7cdbab5b',\n      value: 6.127118137471535,\n    },\n    {\n      x: 1572892200000,\n      y: 'i-7cdbab5b',\n      value: 0.13956047806108005,\n    },\n    {\n      x: 1572894000000,\n      y: 'i-7cdbab5b',\n      value: 0.11986169822285726,\n    },\n    {\n      x: 1572899400000,\n      y: 'i-7cdbab5b',\n      value: 4.098007780030352,\n    },\n    {\n      x: 1572901200000,\n      y: 'i-7cdbab5b',\n      value: 0.6927671145991932,\n    },\n    {\n      x: 1572903000000,\n      y: 'i-7cdbab5b',\n      value: 0.2113142229906149,\n    },\n    {\n      x: 1572904800000,\n      y: 'i-7cdbab5b',\n      value: 0.0823203266441151,\n    },\n  ],\n};\n\n/** @internal */\nexport const DATA_7: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'h', value: 12 },\n  timeZone: 'Europe/Rome',\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('dd/MM HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  data: [\n    {\n      x: 1635026400000,\n      value: 33,\n      y: '',\n    },\n    {\n      x: 1635069600000,\n      value: 59,\n      y: '',\n    },\n    {\n      x: 1635112800000,\n      value: 29,\n      y: '',\n    },\n    {\n      x: 1635156000000,\n      value: 67,\n      y: '',\n    },\n    {\n      x: 1635199200000,\n      value: 27,\n      y: '',\n    },\n    {\n      x: 1635242400000,\n      value: 61,\n      y: '',\n    },\n    {\n      x: 1635285600000,\n      value: 19,\n      y: '',\n    },\n    {\n      x: 1635328800000,\n      value: 71,\n      y: '',\n    },\n    {\n      x: 1635372000000,\n      value: 26,\n      y: '',\n    },\n    {\n      x: 1635415200000,\n      value: 51,\n      y: '',\n    },\n    {\n      x: 1635458400000,\n      value: 30,\n      y: '',\n    },\n    {\n      x: 1635501600000,\n      value: 54,\n      y: '',\n    },\n    {\n      x: 1635544800000,\n      value: 20,\n      y: '',\n    },\n    {\n      x: 1635588000000,\n      value: 59,\n      y: '',\n    },\n    {\n      x: 1635631200000,\n      value: 30,\n      y: '',\n    },\n    {\n      x: 1635678000000,\n      value: 58,\n      y: '',\n    },\n    {\n      x: 1635721200000,\n      value: 34,\n      y: '',\n    },\n    {\n      x: 1635764400000,\n      value: 58,\n      y: '',\n    },\n    {\n      x: 1635807600000,\n      value: 41,\n      y: '',\n    },\n    {\n      x: 1635850800000,\n      value: 48,\n      y: '',\n    },\n    {\n      x: 1635894000000,\n      value: 37,\n      y: '',\n    },\n    {\n      x: 1635937200000,\n      value: 44,\n      y: '',\n    },\n    {\n      x: 1635980400000,\n      value: 37,\n      y: '',\n    },\n    {\n      x: 1636023600000,\n      value: 62,\n      y: '',\n    },\n    {\n      x: 1636066800000,\n      value: 16,\n      y: '',\n    },\n    {\n      x: 1635026400000,\n      value: 18,\n      y: 'gz',\n    },\n    {\n      x: 1635069600000,\n      value: 37,\n      y: 'gz',\n    },\n    {\n      x: 1635112800000,\n      value: 8,\n      y: 'gz',\n    },\n    {\n      x: 1635156000000,\n      value: 27,\n      y: 'gz',\n    },\n    {\n      x: 1635199200000,\n      value: 13,\n      y: 'gz',\n    },\n    {\n      x: 1635242400000,\n      value: 33,\n      y: 'gz',\n    },\n    {\n      x: 1635285600000,\n      value: 13,\n      y: 'gz',\n    },\n    {\n      x: 1635328800000,\n      value: 22,\n      y: 'gz',\n    },\n    {\n      x: 1635372000000,\n      value: 20,\n      y: 'gz',\n    },\n    {\n      x: 1635415200000,\n      value: 36,\n      y: 'gz',\n    },\n    {\n      x: 1635458400000,\n      value: 12,\n      y: 'gz',\n    },\n    {\n      x: 1635501600000,\n      value: 31,\n      y: 'gz',\n    },\n    {\n      x: 1635544800000,\n      value: 9,\n      y: 'gz',\n    },\n    {\n      x: 1635588000000,\n      value: 29,\n      y: 'gz',\n    },\n    {\n      x: 1635631200000,\n      value: 18,\n      y: 'gz',\n    },\n    {\n      x: 1635678000000,\n      value: 22,\n      y: 'gz',\n    },\n    {\n      x: 1635721200000,\n      value: 15,\n      y: 'gz',\n    },\n    {\n      x: 1635764400000,\n      value: 25,\n      y: 'gz',\n    },\n    {\n      x: 1635807600000,\n      value: 12,\n      y: 'gz',\n    },\n    {\n      x: 1635850800000,\n      value: 25,\n      y: 'gz',\n    },\n    {\n      x: 1635894000000,\n      value: 16,\n      y: 'gz',\n    },\n    {\n      x: 1635937200000,\n      value: 28,\n      y: 'gz',\n    },\n    {\n      x: 1635980400000,\n      value: 12,\n      y: 'gz',\n    },\n    {\n      x: 1636023600000,\n      value: 20,\n      y: 'gz',\n    },\n    {\n      x: 1636066800000,\n      value: 10,\n      y: 'gz',\n    },\n    {\n      x: 1635026400000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1635069600000,\n      value: 24,\n      y: 'css',\n    },\n    {\n      x: 1635112800000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1635156000000,\n      value: 38,\n      y: 'css',\n    },\n    {\n      x: 1635199200000,\n      value: 11,\n      y: 'css',\n    },\n    {\n      x: 1635242400000,\n      value: 33,\n      y: 'css',\n    },\n    {\n      x: 1635285600000,\n      value: 18,\n      y: 'css',\n    },\n    {\n      x: 1635328800000,\n      value: 18,\n      y: 'css',\n    },\n    {\n      x: 1635372000000,\n      value: 6,\n      y: 'css',\n    },\n    {\n      x: 1635415200000,\n      value: 26,\n      y: 'css',\n    },\n    {\n      x: 1635458400000,\n      value: 8,\n      y: 'css',\n    },\n    {\n      x: 1635501600000,\n      value: 23,\n      y: 'css',\n    },\n    {\n      x: 1635544800000,\n      value: 10,\n      y: 'css',\n    },\n    {\n      x: 1635588000000,\n      value: 28,\n      y: 'css',\n    },\n    {\n      x: 1635631200000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1635678000000,\n      value: 21,\n      y: 'css',\n    },\n    {\n      x: 1635721200000,\n      value: 17,\n      y: 'css',\n    },\n    {\n      x: 1635764400000,\n      value: 19,\n      y: 'css',\n    },\n    {\n      x: 1635807600000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1635850800000,\n      value: 24,\n      y: 'css',\n    },\n    {\n      x: 1635894000000,\n      value: 14,\n      y: 'css',\n    },\n    {\n      x: 1635937200000,\n      value: 26,\n      y: 'css',\n    },\n    {\n      x: 1635980400000,\n      value: 11,\n      y: 'css',\n    },\n    {\n      x: 1636023600000,\n      value: 24,\n      y: 'css',\n    },\n    {\n      x: 1636066800000,\n      value: 14,\n      y: 'css',\n    },\n    {\n      x: 1635026400000,\n      value: 28,\n      y: '__other__',\n    },\n    {\n      x: 1635069600000,\n      value: 41,\n      y: '__other__',\n    },\n    {\n      x: 1635112800000,\n      value: 17,\n      y: '__other__',\n    },\n    {\n      x: 1635156000000,\n      value: 36,\n      y: '__other__',\n    },\n    {\n      x: 1635199200000,\n      value: 16,\n      y: '__other__',\n    },\n    {\n      x: 1635242400000,\n      value: 35,\n      y: '__other__',\n    },\n    {\n      x: 1635285600000,\n      value: 21,\n      y: '__other__',\n    },\n    {\n      x: 1635328800000,\n      value: 55,\n      y: '__other__',\n    },\n    {\n      x: 1635372000000,\n      value: 19,\n      y: '__other__',\n    },\n    {\n      x: 1635415200000,\n      value: 45,\n      y: '__other__',\n    },\n    {\n      x: 1635458400000,\n      value: 23,\n      y: '__other__',\n    },\n    {\n      x: 1635501600000,\n      value: 49,\n      y: '__other__',\n    },\n    {\n      x: 1635544800000,\n      value: 26,\n      y: '__other__',\n    },\n    {\n      x: 1635588000000,\n      value: 49,\n      y: '__other__',\n    },\n    {\n      x: 1635631200000,\n      value: 32,\n      y: '__other__',\n    },\n    {\n      x: 1635678000000,\n      value: 33,\n      y: '__other__',\n    },\n    {\n      x: 1635721200000,\n      value: 25,\n      y: '__other__',\n    },\n    {\n      x: 1635764400000,\n      value: 38,\n      y: '__other__',\n    },\n    {\n      x: 1635807600000,\n      value: 34,\n      y: '__other__',\n    },\n    {\n      x: 1635850800000,\n      value: 29,\n      y: '__other__',\n    },\n    {\n      x: 1635894000000,\n      value: 26,\n      y: '__other__',\n    },\n    {\n      x: 1635937200000,\n      value: 40,\n      y: '__other__',\n    },\n    {\n      x: 1635980400000,\n      value: 22,\n      y: '__other__',\n    },\n    {\n      x: 1636023600000,\n      value: 42,\n      y: '__other__',\n    },\n    {\n      x: 1636066800000,\n      value: 7,\n      y: '__other__',\n    },\n  ],\n};\n\n/** @internal */\nexport const DATA_8: HeatmapDataSets = {\n  interval: { type: 'fixed', unit: 'm', value: 60 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: [\n    {\n      x: 1616799600000,\n      value: 150,\n      y: 'jpg',\n    },\n    {\n      x: 1616803200000,\n      value: 1,\n      y: 'jpg',\n    },\n    {\n      x: 1616806800000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1616810400000,\n      value: 9,\n      y: 'jpg',\n    },\n    {\n      x: 1616814000000,\n      value: 11,\n      y: 'jpg',\n    },\n    {\n      x: 1616817600000,\n      value: 19,\n      y: 'jpg',\n    },\n    {\n      x: 1616821200000,\n      value: 29,\n      y: 'jpg',\n    },\n    {\n      x: 1616824800000,\n      value: 54,\n      y: 'jpg',\n    },\n    {\n      x: 1616828400000,\n      value: 74,\n      y: 'jpg',\n    },\n    {\n      x: 1616832000000,\n      value: 91,\n      y: 'jpg',\n    },\n    {\n      x: 1616835600000,\n      value: 118,\n      y: 'jpg',\n    },\n    {\n      x: 1616839200000,\n      value: 109,\n      y: 'jpg',\n    },\n    {\n      x: 1616842800000,\n      value: 123,\n      y: 'jpg',\n    },\n    {\n      x: 1616846400000,\n      value: 97,\n      y: 'jpg',\n    },\n    {\n      x: 1616850000000,\n      value: 87,\n      y: 'jpg',\n    },\n    {\n      x: 1616853600000,\n      value: 83,\n      y: 'jpg',\n    },\n    {\n      x: 1616857200000,\n      value: 48,\n      y: 'jpg',\n    },\n    {\n      x: 1616860800000,\n      value: 35,\n      y: 'jpg',\n    },\n    {\n      x: 1616864400000,\n      value: 30,\n      y: 'jpg',\n    },\n    {\n      x: 1616868000000,\n      value: 8,\n      y: 'jpg',\n    },\n    {\n      x: 1616871600000,\n      value: 8,\n      y: 'jpg',\n    },\n    {\n      x: 1616875200000,\n      value: 5,\n      y: 'jpg',\n    },\n    {\n      x: 1616878800000,\n      value: 5,\n      y: 'jpg',\n    },\n    {\n      x: 1616882400000,\n      value: 3,\n      y: 'jpg',\n    },\n    {\n      x: 1616886000000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1616889600000,\n      value: 0,\n      y: 'jpg',\n    },\n    {\n      x: 1616893200000,\n      value: 19,\n      y: 'jpg',\n    },\n    {\n      x: 1616896800000,\n      value: 16,\n      y: 'jpg',\n    },\n    {\n      x: 1616900400000,\n      value: 20,\n      y: 'jpg',\n    },\n    {\n      x: 1616904000000,\n      value: 45,\n      y: 'jpg',\n    },\n    {\n      x: 1616907600000,\n      value: 33,\n      y: 'jpg',\n    },\n    {\n      x: 1616911200000,\n      value: 84,\n      y: 'jpg',\n    },\n    {\n      x: 1616914800000,\n      value: 90,\n      y: 'jpg',\n    },\n    {\n      x: 1616918400000,\n      value: 94,\n      y: 'jpg',\n    },\n    {\n      x: 1616922000000,\n      value: 129,\n      y: 'jpg',\n    },\n    {\n      x: 1616925600000,\n      value: 108,\n      y: 'jpg',\n    },\n    {\n      x: 1616929200000,\n      value: 103,\n      y: 'jpg',\n    },\n    {\n      x: 1616932800000,\n      value: 98,\n      y: 'jpg',\n    },\n    {\n      x: 1616936400000,\n      value: 76,\n      y: 'jpg',\n    },\n    {\n      x: 1616940000000,\n      value: 59,\n      y: 'jpg',\n    },\n    {\n      x: 1616943600000,\n      value: 45,\n      y: 'jpg',\n    },\n    {\n      x: 1616947200000,\n      value: 30,\n      y: 'jpg',\n    },\n    {\n      x: 1616950800000,\n      value: 11,\n      y: 'jpg',\n    },\n    {\n      x: 1616954400000,\n      value: 12,\n      y: 'jpg',\n    },\n    {\n      x: 1616958000000,\n      value: 7,\n      y: 'jpg',\n    },\n    {\n      x: 1616961600000,\n      value: 1,\n      y: 'jpg',\n    },\n    {\n      x: 1616965200000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1616968800000,\n      value: 1,\n      y: 'jpg',\n    },\n    {\n      x: 1616972400000,\n      value: 3,\n      y: 'jpg',\n    },\n    {\n      x: 1616976000000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1616979600000,\n      value: 9,\n      y: 'jpg',\n    },\n    {\n      x: 1616983200000,\n      value: 9,\n      y: 'jpg',\n    },\n    {\n      x: 1616986800000,\n      value: 30,\n      y: 'jpg',\n    },\n    {\n      x: 1616990400000,\n      value: 28,\n      y: 'jpg',\n    },\n    {\n      x: 1616994000000,\n      value: 71,\n      y: 'jpg',\n    },\n    {\n      x: 1616997600000,\n      value: 89,\n      y: 'jpg',\n    },\n    {\n      x: 1617001200000,\n      value: 78,\n      y: 'jpg',\n    },\n    {\n      x: 1617004800000,\n      value: 109,\n      y: 'jpg',\n    },\n    {\n      x: 1617008400000,\n      value: 106,\n      y: 'jpg',\n    },\n    {\n      x: 1617012000000,\n      value: 131,\n      y: 'jpg',\n    },\n    {\n      x: 1617015600000,\n      value: 100,\n      y: 'jpg',\n    },\n    {\n      x: 1617019200000,\n      value: 93,\n      y: 'jpg',\n    },\n    {\n      x: 1617022800000,\n      value: 67,\n      y: 'jpg',\n    },\n    {\n      x: 1617026400000,\n      value: 52,\n      y: 'jpg',\n    },\n    {\n      x: 1617030000000,\n      value: 46,\n      y: 'jpg',\n    },\n    {\n      x: 1617033600000,\n      value: 24,\n      y: 'jpg',\n    },\n    {\n      x: 1617037200000,\n      value: 13,\n      y: 'jpg',\n    },\n    {\n      x: 1617040800000,\n      value: 4,\n      y: 'jpg',\n    },\n    {\n      x: 1617044400000,\n      value: 5,\n      y: 'jpg',\n    },\n    {\n      x: 1617048000000,\n      value: 0,\n      y: 'jpg',\n    },\n    {\n      x: 1617051600000,\n      value: 2,\n      y: 'jpg',\n    },\n    {\n      x: 1617055200000,\n      value: 150,\n      y: 'jpg',\n    },\n    {\n      x: 1616810400000,\n      value: 2,\n      y: 'css',\n    },\n    {\n      x: 1616814000000,\n      value: 5,\n      y: 'css',\n    },\n    {\n      x: 1616817600000,\n      value: 5,\n      y: 'css',\n    },\n    {\n      x: 1616821200000,\n      value: 8,\n      y: 'css',\n    },\n    {\n      x: 1616824800000,\n      value: 15,\n      y: 'css',\n    },\n    {\n      x: 1616828400000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1616832000000,\n      value: 31,\n      y: 'css',\n    },\n    {\n      x: 1616835600000,\n      value: 22,\n      y: 'css',\n    },\n    {\n      x: 1616839200000,\n      value: 26,\n      y: 'css',\n    },\n    {\n      x: 1616842800000,\n      value: 32,\n      y: 'css',\n    },\n    {\n      x: 1616846400000,\n      value: 20,\n      y: 'css',\n    },\n    {\n      x: 1616850000000,\n      value: 20,\n      y: 'css',\n    },\n    {\n      x: 1616853600000,\n      value: 19,\n      y: 'css',\n    },\n    {\n      x: 1616857200000,\n      value: 11,\n      y: 'css',\n    },\n    {\n      x: 1616860800000,\n      value: 10,\n      y: 'css',\n    },\n    {\n      x: 1616864400000,\n      value: 6,\n      y: 'css',\n    },\n    {\n      x: 1616868000000,\n      value: 2,\n      y: 'css',\n    },\n    {\n      x: 1616871600000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616875200000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616878800000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616882400000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616886000000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616889600000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616893200000,\n      value: 2,\n      y: 'css',\n    },\n    {\n      x: 1616896800000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616900400000,\n      value: 7,\n      y: 'css',\n    },\n    {\n      x: 1616904000000,\n      value: 7,\n      y: 'css',\n    },\n    {\n      x: 1616907600000,\n      value: 23,\n      y: 'css',\n    },\n    {\n      x: 1616911200000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1616914800000,\n      value: 19,\n      y: 'css',\n    },\n    {\n      x: 1616918400000,\n      value: 27,\n      y: 'css',\n    },\n    {\n      x: 1616922000000,\n      value: 34,\n      y: 'css',\n    },\n    {\n      x: 1616925600000,\n      value: 24,\n      y: 'css',\n    },\n    {\n      x: 1616929200000,\n      value: 22,\n      y: 'css',\n    },\n    {\n      x: 1616932800000,\n      value: 23,\n      y: 'css',\n    },\n    {\n      x: 1616936400000,\n      value: 23,\n      y: 'css',\n    },\n    {\n      x: 1616940000000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1616943600000,\n      value: 7,\n      y: 'css',\n    },\n    {\n      x: 1616947200000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1616950800000,\n      value: 2,\n      y: 'css',\n    },\n    {\n      x: 1616954400000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616958000000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616961600000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616965200000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616968800000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616972400000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616976000000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616979600000,\n      value: 0,\n      y: 'css',\n    },\n    {\n      x: 1616983200000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1616986800000,\n      value: 5,\n      y: 'css',\n    },\n    {\n      x: 1616990400000,\n      value: 13,\n      y: 'css',\n    },\n    {\n      x: 1616994000000,\n      value: 9,\n      y: 'css',\n    },\n    {\n      x: 1616997600000,\n      value: 16,\n      y: 'css',\n    },\n    {\n      x: 1617001200000,\n      value: 25,\n      y: 'css',\n    },\n    {\n      x: 1617004800000,\n      value: 26,\n      y: 'css',\n    },\n    {\n      x: 1617008400000,\n      value: 36,\n      y: 'css',\n    },\n    {\n      x: 1617012000000,\n      value: 27,\n      y: 'css',\n    },\n    {\n      x: 1617015600000,\n      value: 29,\n      y: 'css',\n    },\n    {\n      x: 1617019200000,\n      value: 20,\n      y: 'css',\n    },\n    {\n      x: 1617022800000,\n      value: 25,\n      y: 'css',\n    },\n    {\n      x: 1617026400000,\n      value: 14,\n      y: 'css',\n    },\n    {\n      x: 1617030000000,\n      value: 10,\n      y: 'css',\n    },\n    {\n      x: 1617033600000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1617037200000,\n      value: 5,\n      y: 'css',\n    },\n    {\n      x: 1617040800000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1617044400000,\n      value: 1,\n      y: 'css',\n    },\n    {\n      x: 1617048000000,\n      value: 3,\n      y: 'css',\n    },\n    {\n      x: 1616799600000,\n      value: 3,\n      y: 'png',\n    },\n    {\n      x: 1616803200000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616806800000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616810400000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616814000000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616817600000,\n      value: 5,\n      y: 'png',\n    },\n    {\n      x: 1616821200000,\n      value: 6,\n      y: 'png',\n    },\n    {\n      x: 1616824800000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1616828400000,\n      value: 12,\n      y: 'png',\n    },\n    {\n      x: 1616832000000,\n      value: 21,\n      y: 'png',\n    },\n    {\n      x: 1616835600000,\n      value: 11,\n      y: 'png',\n    },\n    {\n      x: 1616839200000,\n      value: 15,\n      y: 'png',\n    },\n    {\n      x: 1616842800000,\n      value: 25,\n      y: 'png',\n    },\n    {\n      x: 1616846400000,\n      value: 14,\n      y: 'png',\n    },\n    {\n      x: 1616850000000,\n      value: 17,\n      y: 'png',\n    },\n    {\n      x: 1616853600000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1616857200000,\n      value: 8,\n      y: 'png',\n    },\n    {\n      x: 1616860800000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1616864400000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616868000000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616871600000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616875200000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616878800000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616882400000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616886000000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616889600000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616893200000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616896800000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616900400000,\n      value: 3,\n      y: 'png',\n    },\n    {\n      x: 1616904000000,\n      value: 5,\n      y: 'png',\n    },\n    {\n      x: 1616907600000,\n      value: 8,\n      y: 'png',\n    },\n    {\n      x: 1616911200000,\n      value: 9,\n      y: 'png',\n    },\n    {\n      x: 1616914800000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1616918400000,\n      value: 24,\n      y: 'png',\n    },\n    {\n      x: 1616922000000,\n      value: 22,\n      y: 'png',\n    },\n    {\n      x: 1616925600000,\n      value: 19,\n      y: 'png',\n    },\n    {\n      x: 1616929200000,\n      value: 19,\n      y: 'png',\n    },\n    {\n      x: 1616932800000,\n      value: 12,\n      y: 'png',\n    },\n    {\n      x: 1616936400000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1616940000000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1616943600000,\n      value: 3,\n      y: 'png',\n    },\n    {\n      x: 1616947200000,\n      value: 4,\n      y: 'png',\n    },\n    {\n      x: 1616950800000,\n      value: 3,\n      y: 'png',\n    },\n    {\n      x: 1616954400000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616958000000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616961600000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616965200000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616968800000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616972400000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616976000000,\n      value: 0,\n      y: 'png',\n    },\n    {\n      x: 1616979600000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616983200000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616986800000,\n      value: 2,\n      y: 'png',\n    },\n    {\n      x: 1616990400000,\n      value: 4,\n      y: 'png',\n    },\n    {\n      x: 1616994000000,\n      value: 8,\n      y: 'png',\n    },\n    {\n      x: 1616997600000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1617001200000,\n      value: 17,\n      y: 'png',\n    },\n    {\n      x: 1617004800000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1617008400000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1617012000000,\n      value: 24,\n      y: 'png',\n    },\n    {\n      x: 1617015600000,\n      value: 16,\n      y: 'png',\n    },\n    {\n      x: 1617019200000,\n      value: 17,\n      y: 'png',\n    },\n    {\n      x: 1617022800000,\n      value: 11,\n      y: 'png',\n    },\n    {\n      x: 1617026400000,\n      value: 10,\n      y: 'png',\n    },\n    {\n      x: 1617030000000,\n      value: 7,\n      y: 'png',\n    },\n    {\n      x: 1617033600000,\n      value: 6,\n      y: 'png',\n    },\n    {\n      x: 1617037200000,\n      value: 1,\n      y: 'png',\n    },\n    {\n      x: 1616810400000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616814000000,\n      value: 3,\n      y: '__other__',\n    },\n    {\n      x: 1616817600000,\n      value: 2,\n      y: '__other__',\n    },\n    {\n      x: 1616821200000,\n      value: 3,\n      y: '__other__',\n    },\n    {\n      x: 1616824800000,\n      value: 6,\n      y: '__other__',\n    },\n    {\n      x: 1616828400000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1616832000000,\n      value: 19,\n      y: '__other__',\n    },\n    {\n      x: 1616835600000,\n      value: 21,\n      y: '__other__',\n    },\n    {\n      x: 1616839200000,\n      value: 18,\n      y: '__other__',\n    },\n    {\n      x: 1616842800000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1616846400000,\n      value: 17,\n      y: '__other__',\n    },\n    {\n      x: 1616850000000,\n      value: 16,\n      y: '__other__',\n    },\n    {\n      x: 1616853600000,\n      value: 17,\n      y: '__other__',\n    },\n    {\n      x: 1616857200000,\n      value: 13,\n      y: '__other__',\n    },\n    {\n      x: 1616860800000,\n      value: 4,\n      y: '__other__',\n    },\n    {\n      x: 1616864400000,\n      value: 6,\n      y: '__other__',\n    },\n    {\n      x: 1616868000000,\n      value: 4,\n      y: '__other__',\n    },\n    {\n      x: 1616871600000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616875200000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616878800000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616882400000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616886000000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616889600000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616893200000,\n      value: 3,\n      y: '__other__',\n    },\n    {\n      x: 1616896800000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616900400000,\n      value: 3,\n      y: '__other__',\n    },\n    {\n      x: 1616904000000,\n      value: 5,\n      y: '__other__',\n    },\n    {\n      x: 1616907600000,\n      value: 9,\n      y: '__other__',\n    },\n    {\n      x: 1616911200000,\n      value: 9,\n      y: '__other__',\n    },\n    {\n      x: 1616914800000,\n      value: 13,\n      y: '__other__',\n    },\n    {\n      x: 1616918400000,\n      value: 13,\n      y: '__other__',\n    },\n    {\n      x: 1616922000000,\n      value: 26,\n      y: '__other__',\n    },\n    {\n      x: 1616925600000,\n      value: 23,\n      y: '__other__',\n    },\n    {\n      x: 1616929200000,\n      value: 15,\n      y: '__other__',\n    },\n    {\n      x: 1616932800000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1616936400000,\n      value: 14,\n      y: '__other__',\n    },\n    {\n      x: 1616940000000,\n      value: 9,\n      y: '__other__',\n    },\n    {\n      x: 1616943600000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616947200000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616950800000,\n      value: 4,\n      y: '__other__',\n    },\n    {\n      x: 1616954400000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616958000000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616961600000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616965200000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616968800000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616972400000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616976000000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616979600000,\n      value: 2,\n      y: '__other__',\n    },\n    {\n      x: 1616983200000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1616986800000,\n      value: 5,\n      y: '__other__',\n    },\n    {\n      x: 1616990400000,\n      value: 1,\n      y: '__other__',\n    },\n    {\n      x: 1616994000000,\n      value: 10,\n      y: '__other__',\n    },\n    {\n      x: 1616997600000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1617001200000,\n      value: 16,\n      y: '__other__',\n    },\n    {\n      x: 1617004800000,\n      value: 14,\n      y: '__other__',\n    },\n    {\n      x: 1617008400000,\n      value: 17,\n      y: '__other__',\n    },\n    {\n      x: 1617012000000,\n      value: 18,\n      y: '__other__',\n    },\n    {\n      x: 1617015600000,\n      value: 12,\n      y: '__other__',\n    },\n    {\n      x: 1617019200000,\n      value: 12,\n      y: '__other__',\n    },\n    {\n      x: 1617022800000,\n      value: 11,\n      y: '__other__',\n    },\n    {\n      x: 1617026400000,\n      value: 8,\n      y: '__other__',\n    },\n    {\n      x: 1617030000000,\n      value: 9,\n      y: '__other__',\n    },\n    {\n      x: 1617033600000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1617037200000,\n      value: 0,\n      y: '__other__',\n    },\n    {\n      x: 1617040800000,\n      value: 2,\n      y: '__other__',\n    },\n    {\n      x: 1617044400000,\n      value: 1,\n      y: '__other__',\n    },\n  ],\n};\n\n/** @internal */\nexport const DATA_9: HeatmapDataSets = {\n  // adding 6 hours to the max to include the last data interval that belongs to the max + 60m bucket\n  domain: { min: 1616799600000 - 5 * 60 * 60 * 1000, max: 1617055200000 + 6 * 60 * 60 * 1000 },\n  interval: { type: 'fixed', unit: 'm', value: 60 },\n  xFormatter: (value: string | number) => {\n    return DateTime.fromMillis(value as number).toFormat('HH:mm', { timeZone: 'Europe/Rome' });\n  },\n  timeZone: 'Europe/Rome',\n  data: DATA_8.data,\n};\n\n/** @internal */\nexport const ECOMMERCE_DATA = [\n  {\n    x: 'Tigress Haute Couture Haute Couture',\n    y: 'Dress',\n    value: 816,\n  },\n  {\n    x: 'Tigress Haute Couture Haute Couture',\n    y: 'Shoes',\n    value: 556,\n  },\n  {\n    x: 'Tigress Haute Couture Haute Couture',\n    y: 'Shirts',\n    value: 395,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'T-Shirts',\n    value: 1125,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'Sweaters',\n    value: 595,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'Pullovers',\n    value: 355,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'Shoes',\n    value: 233,\n  },\n  {\n    x: 'Low Tide Media',\n    y: 'Dress',\n    value: 136,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'T-Shirts',\n    value: 1242,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'Sweaters',\n    value: 528,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'Jumper',\n    value: 2338,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'Shirts',\n    value: 46,\n  },\n  {\n    x: 'Elitelligence',\n    y: 'Dress',\n    value: 1,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'T-Shirts',\n    value: 600,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Dress',\n    value: 418,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Cardigans',\n    value: 286,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Jumpsuit',\n    value: 123,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Sweaters',\n    value: 258,\n  },\n  {\n    x: 'Oceanavigations',\n    y: 'Shirts',\n    value: 239,\n  },\n  {\n    x: 'Pyramidustries Young Moda',\n    y: 'Dress',\n    value: 747,\n  },\n  {\n    x: 'Pyramidustries Young Moda',\n    y: 'Shoes',\n    value: 425,\n  },\n  {\n    x: 'Pyramidustries Young Moda',\n    y: 'Shirts',\n    value: 377,\n  },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const KIBANA_METRICS = {\n  metrics: {\n    kibana_os_load: {\n      /**\n       * Variant 1 - Load average over the last minute\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.os.load.1m',\n          metricAgg: 'max',\n          label: '1m',\n          title: 'System Load',\n          description: 'Load average over the last minute.',\n          units: '',\n          format: '0,0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 8.3203125],\n          [1551438030000, 7.9140625],\n          [1551438060000, 7.8671875],\n          [1551438090000, 7.125],\n          [1551438120000, 8.765625],\n          [1551438150000, 11.546875],\n          [1551438180000, 12.984375],\n          [1551438210000, 13.546875],\n          [1551438240000, 13.390625],\n          [1551438270000, 11.5625],\n          [1551438300000, 11.5859375],\n          [1551438330000, 10.0546875],\n          [1551438360000, 9.921875],\n          [1551438390000, 9.4921875],\n          [1551438420000, 9.78125],\n          [1551438450000, 10.046875],\n          [1551438480000, 14.0546875],\n          [1551438510000, 10.640625],\n          [1551438540000, 8.2421875],\n          [1551438570000, 8.5],\n          [1551438600000, 7.2578125],\n          [1551438630000, 8.515625],\n          [1551438660000, 10.796875],\n          [1551438690000, 11.125],\n          [1551438720000, 21.40625],\n          [1551438750000, 17.921875],\n          [1551438780000, 26.640625],\n          [1551438810000, 31.390625],\n          [1551438840000, 23.953125],\n          [1551438870000, 16],\n          [1551438900000, 11.9765625],\n          [1551438930000, 9.1640625],\n          [1551438960000, 7.98046875],\n          [1551438990000, 7.1640625],\n          [1551439020000, 7.39453125],\n          [1551439050000, 5.68359375],\n          [1551439080000, 4.95703125],\n          [1551439110000, 4.26171875],\n          [1551439140000, 11.1171875],\n          [1551439170000, 10.8515625],\n          [1551439200000, 12.6171875],\n          [1551439230000, 11.1171875],\n          [1551439260000, 11.6640625],\n          [1551439290000, 11.109375],\n          [1551439320000, 10.6015625],\n          [1551439350000, 11.21875],\n          [1551439380000, 13.53125],\n          [1551439410000, 15.4609375],\n          [1551439440000, 15.1796875],\n          [1551439470000, 11.984375],\n          [1551439500000, 24.8125],\n          [1551439530000, 21.46875],\n          [1551439560000, 14.484375],\n          [1551439590000, 9.9609375],\n          [1551439620000, 10.8515625],\n          [1551439650000, 12.1171875],\n          [1551439680000, 19.375],\n          [1551439710000, 20.609375],\n          [1551439740000, 16.484375],\n          [1551439770000, 15.515625],\n          [1551439800000, 14.9140625],\n          [1551439830000, 10.8828125],\n          [1551439860000, 9.7578125],\n          [1551439890000, 8.625],\n          [1551439920000, 9.21875],\n          [1551439950000, 8.5390625],\n          [1551439980000, 8.40625],\n          [1551440010000, 6.671875],\n          [1551440040000, 7.24609375],\n          [1551440070000, 7.1015625],\n          [1551440100000, 7.09375],\n          [1551440130000, 10.8125],\n          [1551440160000, 10.90625],\n          [1551440190000, 12.453125],\n          [1551440220000, 11.8984375],\n          [1551440250000, 10.875],\n          [1551440280000, 12.4140625],\n          [1551440310000, 12.78125],\n          [1551440340000, 34.28125],\n          [1551440370000, 29.84375],\n          [1551440400000, 22.40625],\n          [1551440430000, 16.046875],\n          [1551440460000, 12.6328125],\n          [1551440490000, 8.8125],\n          [1551440520000, 6.93359375],\n          [1551440550000, 6.12890625],\n          [1551440580000, 5.69921875],\n          [1551440610000, 5.48828125],\n          [1551440640000, 12.0234375],\n          [1551440670000, 14.484375],\n          [1551440700000, 12.890625],\n          [1551440730000, 11.578125],\n          [1551440760000, 10.7578125],\n          [1551440790000, 9.921875],\n          [1551440820000, 10.5078125],\n          [1551440850000, 11.375],\n          [1551440880000, 15.890625],\n          [1551440910000, 14.1953125],\n          [1551440940000, 11.625],\n          [1551440970000, 11.734375],\n          [1551441000000, 10.1640625],\n          [1551441030000, 9.296875],\n          [1551441060000, 7.5546875],\n          [1551441090000, 7.17578125],\n          [1551441120000, 5.8671875],\n          [1551441150000, 6.828125],\n          [1551441180000, 10.578125],\n          [1551441210000, 16.140625],\n          [1551441240000, 15.640625],\n          [1551441270000, 13.1484375],\n          [1551441300000, 11.9140625],\n          [1551441330000, 10.0625],\n          [1551441360000, 7.66015625],\n          [1551441390000, 9.0078125],\n          [1551441420000, 8.78125],\n          [1551441450000, 8.0390625],\n          [1551441480000, 25.515625],\n          [1551441510000, 18.640625],\n          [1551441540000, 13.1953125],\n          [1551441570000, 10.1953125],\n        ] as [number, number][],\n      },\n      /**\n       * Variant 2 - Load average over the last 5 minutes\n       */\n      v2: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.os.load.5m',\n          metricAgg: 'max',\n          label: '5m',\n          title: 'System Load',\n          description: 'Load average over the last 5 minutes.',\n          units: '',\n          format: '0,0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 9.984375],\n          [1551438030000, 9.71875],\n          [1551438060000, 9.28125],\n          [1551438090000, 9.078125],\n          [1551438120000, 8.9921875],\n          [1551438150000, 9.640625],\n          [1551438180000, 10.171875],\n          [1551438210000, 10.421875],\n          [1551438240000, 10.625],\n          [1551438270000, 10.390625],\n          [1551438300000, 10.4296875],\n          [1551438330000, 10.1328125],\n          [1551438360000, 9.984375],\n          [1551438390000, 9.8203125],\n          [1551438420000, 9.8125],\n          [1551438450000, 9.78125],\n          [1551438480000, 10.625],\n          [1551438510000, 10.09375],\n          [1551438540000, 9.5546875],\n          [1551438570000, 9.390625],\n          [1551438600000, 9.015625],\n          [1551438630000, 8.8828125],\n          [1551438660000, 9.359375],\n          [1551438690000, 9.53125],\n          [1551438720000, 11.9453125],\n          [1551438750000, 11.828125],\n          [1551438780000, 14.4609375],\n          [1551438810000, 16.421875],\n          [1551438840000, 15.6875],\n          [1551438870000, 14.5625],\n          [1551438900000, 13.75],\n          [1551438930000, 12.8359375],\n          [1551438960000, 12.2109375],\n          [1551438990000, 11.6328125],\n          [1551439020000, 11.015625],\n          [1551439050000, 10.3828125],\n          [1551439080000, 9.7421875],\n          [1551439110000, 9.046875],\n          [1551439140000, 9.921875],\n          [1551439170000, 9.890625],\n          [1551439200000, 10.34375],\n          [1551439230000, 10.140625],\n          [1551439260000, 10.3515625],\n          [1551439290000, 10.28125],\n          [1551439320000, 10.203125],\n          [1551439350000, 10.296875],\n          [1551439380000, 10.875],\n          [1551439410000, 11.4765625],\n          [1551439440000, 11.484375],\n          [1551439470000, 11.046875],\n          [1551439500000, 13.53125],\n          [1551439530000, 13.1875],\n          [1551439560000, 12.3046875],\n          [1551439590000, 11.3984375],\n          [1551439620000, 11.1328125],\n          [1551439650000, 11.390625],\n          [1551439680000, 13.3046875],\n          [1551439710000, 13.71875],\n          [1551439740000, 13.3671875],\n          [1551439770000, 13.4296875],\n          [1551439800000, 13.3359375],\n          [1551439830000, 12.4765625],\n          [1551439860000, 12.09375],\n          [1551439890000, 11.4765625],\n          [1551439920000, 11.328125],\n          [1551439950000, 10.8984375],\n          [1551439980000, 10.7109375],\n          [1551440010000, 10.0546875],\n          [1551440040000, 9.6328125],\n          [1551440070000, 9.34375],\n          [1551440100000, 9.1953125],\n          [1551440130000, 9.6328125],\n          [1551440160000, 9.7109375],\n          [1551440190000, 10.1171875],\n          [1551440220000, 10.171875],\n          [1551440250000, 10.0546875],\n          [1551440280000, 10.4140625],\n          [1551440310000, 10.5234375],\n          [1551440340000, 15.140625],\n          [1551440370000, 14.90625],\n          [1551440400000, 14.4921875],\n          [1551440430000, 13.65625],\n          [1551440460000, 13.0390625],\n          [1551440490000, 12.09375],\n          [1551440520000, 11.3125],\n          [1551440550000, 10.7265625],\n          [1551440580000, 10.1640625],\n          [1551440610000, 9.4453125],\n          [1551440640000, 10.546875],\n          [1551440670000, 11.1328125],\n          [1551440700000, 10.96875],\n          [1551440730000, 10.875],\n          [1551440760000, 10.7109375],\n          [1551440790000, 10.453125],\n          [1551440820000, 10.546875],\n          [1551440850000, 10.671875],\n          [1551440880000, 11.78125],\n          [1551440910000, 11.5703125],\n          [1551440940000, 11.1640625],\n          [1551440970000, 11.1875],\n          [1551441000000, 10.8671875],\n          [1551441030000, 10.5390625],\n          [1551441060000, 10.03125],\n          [1551441090000, 9.6640625],\n          [1551441120000, 9.0859375],\n          [1551441150000, 8.90625],\n          [1551441180000, 9.453125],\n          [1551441210000, 10.7109375],\n          [1551441240000, 10.734375],\n          [1551441270000, 10.6484375],\n          [1551441300000, 10.5234375],\n          [1551441330000, 10.1796875],\n          [1551441360000, 9.546875],\n          [1551441390000, 9.5390625],\n          [1551441420000, 9.3984375],\n          [1551441450000, 9.21875],\n          [1551441480000, 12.671875],\n          [1551441510000, 12.0859375],\n          [1551441540000, 11.375],\n          [1551441570000, 10.84375],\n        ] as [number, number][],\n      },\n      /**\n       * Variant 3 - Load average over the last 15 minutes\n       */\n      v3: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.os.load.15m',\n          metricAgg: 'max',\n          label: '15m',\n          title: 'System Load',\n          description: 'Load average over the last 15 minutes.',\n          units: '',\n          format: '0,0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 10.3359375],\n          [1551438030000, 10.234375],\n          [1551438060000, 10.046875],\n          [1551438090000, 9.9765625],\n          [1551438120000, 9.8828125],\n          [1551438150000, 10.078125],\n          [1551438180000, 10.234375],\n          [1551438210000, 10.3125],\n          [1551438240000, 10.3828125],\n          [1551438270000, 10.3046875],\n          [1551438300000, 10.3203125],\n          [1551438330000, 10.21875],\n          [1551438360000, 10.15625],\n          [1551438390000, 10.09375],\n          [1551438420000, 10.0859375],\n          [1551438450000, 10.0546875],\n          [1551438480000, 10.328125],\n          [1551438510000, 10.15625],\n          [1551438540000, 9.9765625],\n          [1551438570000, 9.8984375],\n          [1551438600000, 9.7578125],\n          [1551438630000, 9.65625],\n          [1551438660000, 9.796875],\n          [1551438690000, 9.84375],\n          [1551438720000, 10.640625],\n          [1551438750000, 10.6328125],\n          [1551438780000, 11.578125],\n          [1551438810000, 12.265625],\n          [1551438840000, 12.109375],\n          [1551438870000, 11.84375],\n          [1551438900000, 11.6640625],\n          [1551438930000, 11.421875],\n          [1551438960000, 11.2578125],\n          [1551438990000, 11.1015625],\n          [1551439020000, 10.90625],\n          [1551439050000, 10.703125],\n          [1551439080000, 10.4765625],\n          [1551439110000, 10.21875],\n          [1551439140000, 10.4375],\n          [1551439170000, 10.421875],\n          [1551439200000, 10.5390625],\n          [1551439230000, 10.4609375],\n          [1551439260000, 10.5234375],\n          [1551439290000, 10.5],\n          [1551439320000, 10.4609375],\n          [1551439350000, 10.4765625],\n          [1551439380000, 10.65625],\n          [1551439410000, 10.859375],\n          [1551439440000, 10.8671875],\n          [1551439470000, 10.734375],\n          [1551439500000, 11.5390625],\n          [1551439530000, 11.4453125],\n          [1551439560000, 11.203125],\n          [1551439590000, 10.9375],\n          [1551439620000, 10.859375],\n          [1551439650000, 10.9453125],\n          [1551439680000, 11.609375],\n          [1551439710000, 11.7578125],\n          [1551439740000, 11.703125],\n          [1551439770000, 11.8046875],\n          [1551439800000, 11.78125],\n          [1551439830000, 11.546875],\n          [1551439860000, 11.453125],\n          [1551439890000, 11.265625],\n          [1551439920000, 11.21875],\n          [1551439950000, 11.078125],\n          [1551439980000, 11.0078125],\n          [1551440010000, 10.78125],\n          [1551440040000, 10.6171875],\n          [1551440070000, 10.4921875],\n          [1551440100000, 10.3984375],\n          [1551440130000, 10.4765625],\n          [1551440160000, 10.4765625],\n          [1551440190000, 10.5859375],\n          [1551440220000, 10.5859375],\n          [1551440250000, 10.5390625],\n          [1551440280000, 10.625],\n          [1551440310000, 10.65625],\n          [1551440340000, 12.1328125],\n          [1551440370000, 12.125],\n          [1551440400000, 12.0390625],\n          [1551440430000, 11.8359375],\n          [1551440460000, 11.6875],\n          [1551440490000, 11.4140625],\n          [1551440520000, 11.1796875],\n          [1551440550000, 10.984375],\n          [1551440580000, 10.7890625],\n          [1551440610000, 10.53125],\n          [1551440640000, 10.8359375],\n          [1551440670000, 11.0234375],\n          [1551440700000, 10.96875],\n          [1551440730000, 10.9296875],\n          [1551440760000, 10.875],\n          [1551440790000, 10.7890625],\n          [1551440820000, 10.8046875],\n          [1551440850000, 10.828125],\n          [1551440880000, 11.1875],\n          [1551440910000, 11.125],\n          [1551440940000, 11],\n          [1551440970000, 11.015625],\n          [1551441000000, 10.9140625],\n          [1551441030000, 10.796875],\n          [1551441060000, 10.625],\n          [1551441090000, 10.4765625],\n          [1551441120000, 10.2578125],\n          [1551441150000, 10.1640625],\n          [1551441180000, 10.265625],\n          [1551441210000, 10.6484375],\n          [1551441240000, 10.65625],\n          [1551441270000, 10.625],\n          [1551441300000, 10.5859375],\n          [1551441330000, 10.46875],\n          [1551441360000, 10.2421875],\n          [1551441390000, 10.203125],\n          [1551441420000, 10.140625],\n          [1551441450000, 10.0625],\n          [1551441480000, 11.140625],\n          [1551441510000, 10.9921875],\n          [1551441540000, 10.7890625],\n          [1551441570000, 10.625],\n        ] as [number, number][],\n      },\n    },\n    kibana_average_concurrent_connections: {\n      /**\n       * Variant 1 - Total number of open socket connections to the Kibana instance\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.concurrent_connections',\n          metricAgg: 'max',\n          label: 'HTTP Connections',\n          description: 'Total number of open socket connections to the Kibana instance.',\n          units: '',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 20],\n          [1551438030000, 18],\n          [1551438060000, 21],\n          [1551438090000, 21],\n          [1551438120000, 20],\n          [1551438150000, 19],\n          [1551438180000, 19],\n          [1551438210000, 19],\n          [1551438240000, 21],\n          [1551438270000, 21],\n          [1551438300000, 19],\n          [1551438330000, 21],\n          [1551438360000, 18],\n          [1551438390000, 18],\n          [1551438420000, 19],\n          [1551438450000, 19],\n          [1551438480000, 19],\n          [1551438510000, 19],\n          [1551438540000, 20],\n          [1551438570000, 23],\n          [1551438600000, 19],\n          [1551438630000, 21],\n          [1551438660000, 20],\n          [1551438690000, 19],\n          [1551438720000, 24],\n          [1551438750000, 20],\n          [1551438780000, 20],\n          [1551438810000, 19],\n          [1551438840000, 20],\n          [1551438870000, 21],\n          [1551438900000, 20],\n          [1551438930000, 19],\n          [1551438960000, 21],\n          [1551438990000, 20],\n          [1551439020000, 23],\n          [1551439050000, 18],\n          [1551439080000, 18],\n          [1551439110000, 18],\n          [1551439140000, 18],\n          [1551439170000, 17],\n          [1551439200000, 18],\n          [1551439230000, 19],\n          [1551439260000, 20],\n          [1551439290000, 20],\n          [1551439320000, 18],\n          [1551439350000, 20],\n          [1551439380000, 18],\n          [1551439410000, 20],\n          [1551439440000, 18],\n          [1551439470000, 19],\n          [1551439500000, 17],\n          [1551439530000, 17],\n          [1551439560000, 16],\n          [1551439590000, 15],\n          [1551439620000, 17],\n          [1551439650000, 18],\n          [1551439680000, 19],\n          [1551439710000, 20],\n          [1551439740000, 18],\n          [1551439770000, 21],\n          [1551439800000, 19],\n          [1551439830000, 20],\n          [1551439860000, 19],\n          [1551439890000, 18],\n          [1551439920000, 19],\n          [1551439950000, 19],\n          [1551439980000, 20],\n          [1551440010000, 19],\n          [1551440040000, 19],\n          [1551440070000, 19],\n          [1551440100000, 19],\n          [1551440130000, 17],\n          [1551440160000, 18],\n          [1551440190000, 18],\n          [1551440220000, 21],\n          [1551440250000, 18],\n          [1551440280000, 20],\n          [1551440310000, 17],\n          [1551440340000, 19],\n          [1551440370000, 20],\n          [1551440400000, 20],\n          [1551440430000, 20],\n          [1551440460000, 18],\n          [1551440490000, 16],\n          [1551440520000, 16],\n          [1551440550000, 17],\n          [1551440580000, 18],\n          [1551440610000, 16],\n          [1551440640000, 25],\n          [1551440670000, 16],\n          [1551440700000, 18],\n          [1551440730000, 17],\n          [1551440760000, 19],\n          [1551440790000, 17],\n          [1551440820000, 22],\n          [1551440850000, 20],\n          [1551440880000, 22],\n          [1551440910000, 31],\n          [1551440940000, 18],\n          [1551440970000, 17],\n          [1551441000000, 16],\n          [1551441030000, 17],\n          [1551441060000, 18],\n          [1551441090000, 16],\n          [1551441120000, 14],\n          [1551441150000, 14],\n          [1551441180000, 15],\n          [1551441210000, 19],\n          [1551441240000, 16],\n          [1551441270000, 17],\n          [1551441300000, 16],\n          [1551441330000, 16],\n          [1551441360000, 17],\n          [1551441390000, 18],\n          [1551441420000, 18],\n          [1551441450000, 17],\n          [1551441480000, 17],\n          [1551441510000, 16],\n          [1551441540000, 16],\n          [1551441570000, 17],\n        ] as [number, number][],\n      },\n    },\n    kibana_process_delay: {\n      /**\n       * Variant 1 - Delay in Kibana server event loops\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.process.event_loop_delay',\n          metricAgg: 'max',\n          label: 'Event Loop Delay',\n          description: 'Delay in Kibana server event loops.',\n          units: 'ms',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 1.917205810546875],\n          [1551438030000, 1.7739791870117188],\n          [1551438060000, 2.943075180053711],\n          [1551438090000, 5.207357406616211],\n          [1551438120000, 1.6650104522705078],\n          [1551438150000, 2.154033660888672],\n          [1551438180000, 2.118760108947754],\n          [1551438210000, 3.37868595123291],\n          [1551438240000, 2.1819963455200195],\n          [1551438270000, 2.568490982055664],\n          [1551438300000, 353.22412109375],\n          [1551438330000, 4.138860702514648],\n          [1551438360000, 1.835433006286621],\n          [1551438390000, 1.8117866516113281],\n          [1551438420000, 1.7387809753417969],\n          [1551438450000, 2.006241798400879],\n          [1551438480000, 1.8574104309082031],\n          [1551438510000, 2.101459503173828],\n          [1551438540000, 2.2292041778564453],\n          [1551438570000, 1.8641471862792969],\n          [1551438600000, 2.124319076538086],\n          [1551438630000, 2.1186132431030273],\n          [1551438660000, 1.7360162734985352],\n          [1551438690000, 2.1855764389038086],\n          [1551438720000, 3.210604667663574],\n          [1551438750000, 2.510148048400879],\n          [1551438780000, 1.6755142211914062],\n          [1551438810000, 1.9307565689086914],\n          [1551438840000, 9.354450225830078],\n          [1551438870000, 1.9756240844726562],\n          [1551438900000, 2.2764291763305664],\n          [1551438930000, 346.5954284667969],\n          [1551438960000, 4.56385612487793],\n          [1551438990000, 2.3435449600219727],\n          [1551439020000, 3.8228683471679688],\n          [1551439050000, 2.6483001708984375],\n          [1551439080000, 1.8082962036132812],\n          [1551439110000, 1.6172676086425781],\n          [1551439140000, 1.8350811004638672],\n          [1551439170000, 1.659804344177246],\n          [1551439200000, 2.4164390563964844],\n          [1551439230000, 1.999464988708496],\n          [1551439260000, 1.9630374908447266],\n          [1551439290000, 2.0218467712402344],\n          [1551439320000, 2.076573371887207],\n          [1551439350000, 2.4036598205566406],\n          [1551439380000, 2.602895736694336],\n          [1551439410000, 2.5561323165893555],\n          [1551439440000, 2.3957443237304688],\n          [1551439470000, 2.3182430267333984],\n          [1551439500000, 2.0863637924194336],\n          [1551439530000, 1.9851713180541992],\n          [1551439560000, 1.9189224243164062],\n          [1551439590000, 1.937936782836914],\n          [1551439620000, 3.844411849975586],\n          [1551439650000, 5.052459716796875],\n          [1551439680000, 2.012505531311035],\n          [1551439710000, 2.27213191986084],\n          [1551439740000, 1.951359748840332],\n          [1551439770000, 2.6224374771118164],\n          [1551439800000, 2.6582508087158203],\n          [1551439830000, 2.607870101928711],\n          [1551439860000, 2.4416723251342773],\n          [1551439890000, 2.369551658630371],\n          [1551439920000, 2.0154476165771484],\n          [1551439950000, 2.096695899963379],\n          [1551439980000, 1.9279394149780273],\n          [1551440010000, 3.023202896118164],\n          [1551440040000, 3.772576332092285],\n          [1551440070000, 2.4855575561523438],\n          [1551440100000, 4.25732421875],\n          [1551440130000, 2.0820703506469727],\n          [1551440160000, 2.489288330078125],\n          [1551440190000, 2.602682113647461],\n          [1551440220000, 4.733266830444336],\n          [1551440250000, 1.8897781372070312],\n          [1551440280000, 2.365001678466797],\n          [1551440310000, 2.295949935913086],\n          [1551440340000, 3.2801055908203125],\n          [1551440370000, 1.8901805877685547],\n          [1551440400000, 2.0735225677490234],\n          [1551440430000, 1.8940362930297852],\n          [1551440460000, 3.0348567962646484],\n          [1551440490000, 2.0472803115844727],\n          [1551440520000, 2.2077903747558594],\n          [1551440550000, 5.1581220626831055],\n          [1551440580000, 2.039125442504883],\n          [1551440610000, 1.6546344757080078],\n          [1551440640000, 3.1943721771240234],\n          [1551440670000, 2.0258655548095703],\n          [1551440700000, 2.2764244079589844],\n          [1551440730000, 1.8293533325195312],\n          [1551440760000, 2.745746612548828],\n          [1551440790000, 2.426107406616211],\n          [1551440820000, 2.497190475463867],\n          [1551440850000, 2.6376562118530273],\n          [1551440880000, 6.415732383728027],\n          [1551440910000, 22.362375259399414],\n          [1551440940000, 1.8069639205932617],\n          [1551440970000, 2.2364587783813477],\n          [1551441000000, 2.1819095611572266],\n          [1551441030000, 2.6490097045898438],\n          [1551441060000, 3.7438411712646484],\n          [1551441090000, 2.2370100021362305],\n          [1551441120000, 2.1098766326904297],\n          [1551441150000, 3.0454416275024414],\n          [1551441180000, 2.211244583129883],\n          [1551441210000, 2.860243797302246],\n          [1551441240000, 2.255979537963867],\n          [1551441270000, 2.0102500915527344],\n          [1551441300000, 2.06740665435791],\n          [1551441330000, 1.9841184616088867],\n          [1551441360000, 2.046261787414551],\n          [1551441390000, 5.3361921310424805],\n          [1551441420000, 3.9412336349487305],\n          [1551441450000, 2.885173797607422],\n          [1551441480000, 3.661712646484375],\n          [1551441510000, 1.8046932220458984],\n          [1551441540000, 1.9574308395385742],\n          [1551441570000, 1.9149093627929688],\n        ] as [number, number][],\n      },\n    },\n    kibana_memory: {\n      /**\n       * Variant 1 - Limit of memory usage before garbage collection\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.process.memory.heap.size_limit',\n          metricAgg: 'max',\n          label: 'Heap Size Limit',\n          title: 'Memory Size',\n          description: 'Limit of memory usage before garbage collection.',\n          units: 'B',\n          format: '0,0.0 b',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 1501560832],\n          [1551438030000, 1501560832],\n          [1551438060000, 1501560832],\n          [1551438090000, 1501560832],\n          [1551438120000, 1501560832],\n          [1551438150000, 1501560832],\n          [1551438180000, 1501560832],\n          [1551438210000, 1501560832],\n          [1551438240000, 1501560832],\n          [1551438270000, 1501560832],\n          [1551438300000, 1501560832],\n          [1551438330000, 1501560832],\n          [1551438360000, 1501560832],\n          [1551438390000, 1501560832],\n          [1551438420000, 1501560832],\n          [1551438450000, 1501560832],\n          [1551438480000, 1501560832],\n          [1551438510000, 1501560832],\n          [1551438540000, 1501560832],\n          [1551438570000, 1501560832],\n          [1551438600000, 1501560832],\n          [1551438630000, 1501560832],\n          [1551438660000, 1501560832],\n          [1551438690000, 1501560832],\n          [1551438720000, 1501560832],\n          [1551438750000, 1501560832],\n          [1551438780000, 1501560832],\n          [1551438810000, 1501560832],\n          [1551438840000, 1501560832],\n          [1551438870000, 1501560832],\n          [1551438900000, 1501560832],\n          [1551438930000, 1501560832],\n          [1551438960000, 1501560832],\n          [1551438990000, 1501560832],\n          [1551439020000, 1501560832],\n          [1551439050000, 1501560832],\n          [1551439080000, 1501560832],\n          [1551439110000, 1501560832],\n          [1551439140000, 1501560832],\n          [1551439170000, 1501560832],\n          [1551439200000, 1501560832],\n          [1551439230000, 1501560832],\n          [1551439260000, 1501560832],\n          [1551439290000, 1501560832],\n          [1551439320000, 1501560832],\n          [1551439350000, 1501560832],\n          [1551439380000, 1501560832],\n          [1551439410000, 1501560832],\n          [1551439440000, 1501560832],\n          [1551439470000, 1501560832],\n          [1551439500000, 1501560832],\n          [1551439530000, 1501560832],\n          [1551439560000, 1501560832],\n          [1551439590000, 1501560832],\n          [1551439620000, 1501560832],\n          [1551439650000, 1501560832],\n          [1551439680000, 1501560832],\n          [1551439710000, 1501560832],\n          [1551439740000, 1501560832],\n          [1551439770000, 1501560832],\n          [1551439800000, 1501560832],\n          [1551439830000, 1501560832],\n          [1551439860000, 1501560832],\n          [1551439890000, 1501560832],\n          [1551439920000, 1501560832],\n          [1551439950000, 1501560832],\n          [1551439980000, 1501560832],\n          [1551440010000, 1501560832],\n          [1551440040000, 1501560832],\n          [1551440070000, 1501560832],\n          [1551440100000, 1501560832],\n          [1551440130000, 1501560832],\n          [1551440160000, 1501560832],\n          [1551440190000, 1501560832],\n          [1551440220000, 1501560832],\n          [1551440250000, 1501560832],\n          [1551440280000, 1501560832],\n          [1551440310000, 1501560832],\n          [1551440340000, 1501560832],\n          [1551440370000, 1501560832],\n          [1551440400000, 1501560832],\n          [1551440430000, 1501560832],\n          [1551440460000, 1501560832],\n          [1551440490000, 1501560832],\n          [1551440520000, 1501560832],\n          [1551440550000, 1501560832],\n          [1551440580000, 1501560832],\n          [1551440610000, 1501560832],\n          [1551440640000, 1501560832],\n          [1551440670000, 1501560832],\n          [1551440700000, 1501560832],\n          [1551440730000, 1501560832],\n          [1551440760000, 1501560832],\n          [1551440790000, 1501560832],\n          [1551440820000, 1501560832],\n          [1551440850000, 1501560832],\n          [1551440880000, 1501560832],\n          [1551440910000, 1501560832],\n          [1551440940000, 1501560832],\n          [1551440970000, 1501560832],\n          [1551441000000, 1501560832],\n          [1551441030000, 1501560832],\n          [1551441060000, 1501560832],\n          [1551441090000, 1501560832],\n          [1551441120000, 1501560832],\n          [1551441150000, 1501560832],\n          [1551441180000, 1501560832],\n          [1551441210000, 1501560832],\n          [1551441240000, 1501560832],\n          [1551441270000, 1501560832],\n          [1551441300000, 1501560832],\n          [1551441330000, 1501560832],\n          [1551441360000, 1501560832],\n          [1551441390000, 1501560832],\n          [1551441420000, 1501560832],\n          [1551441450000, 1501560832],\n          [1551441480000, 1501560832],\n          [1551441510000, 1501560832],\n          [1551441540000, 1501560832],\n          [1551441570000, 1501560832],\n        ] as [number, number][],\n      },\n      /**\n       * Variant 2 - Total heap used by Kibana running in Node.js\n       */\n      v2: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.process.memory.resident_set_size_in_bytes',\n          metricAgg: 'max',\n          label: 'Memory Size',\n          title: 'Memory Size',\n          description: 'Total heap used by Kibana running in Node.js.',\n          units: 'B',\n          format: '0,0.0 b',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 645689344],\n          [1551438030000, 642293760],\n          [1551438060000, 649953280],\n          [1551438090000, 637751296],\n          [1551438120000, 643112960],\n          [1551438150000, 642781184],\n          [1551438180000, 642899968],\n          [1551438210000, 646262784],\n          [1551438240000, 643276800],\n          [1551438270000, 663547904],\n          [1551438300000, 654954496],\n          [1551438330000, 644222976],\n          [1551438360000, 645672960],\n          [1551438390000, 649728000],\n          [1551438420000, 646631424],\n          [1551438450000, 647000064],\n          [1551438480000, 647114752],\n          [1551438510000, 648630272],\n          [1551438540000, 647720960],\n          [1551438570000, 646979584],\n          [1551438600000, 651296768],\n          [1551438630000, 642248704],\n          [1551438660000, 645177344],\n          [1551438690000, 648171520],\n          [1551438720000, 670048256],\n          [1551438750000, 653139968],\n          [1551438780000, 644583424],\n          [1551438810000, 648630272],\n          [1551438840000, 647925760],\n          [1551438870000, 648986624],\n          [1551438900000, 644399104],\n          [1551438930000, 636719104],\n          [1551438960000, 650260480],\n          [1551438990000, 666669056],\n          [1551439020000, 661057536],\n          [1551439050000, 649957376],\n          [1551439080000, 655093760],\n          [1551439110000, 647913472],\n          [1551439140000, 642232320],\n          [1551439170000, 642490368],\n          [1551439200000, 643133440],\n          [1551439230000, 640008192],\n          [1551439260000, 648654848],\n          [1551439290000, 643506176],\n          [1551439320000, 647127040],\n          [1551439350000, 662966272],\n          [1551439380000, 646635520],\n          [1551439410000, 641519616],\n          [1551439440000, 658214912],\n          [1551439470000, 666677248],\n          [1551439500000, 651583488],\n          [1551439530000, 652963840],\n          [1551439560000, 662065152],\n          [1551439590000, 662417408],\n          [1551439620000, 665919488],\n          [1551439650000, 646316032],\n          [1551439680000, 643153920],\n          [1551439710000, 658288640],\n          [1551439740000, 662052864],\n          [1551439770000, 660353024],\n          [1551439800000, 649293824],\n          [1551439830000, 661753856],\n          [1551439860000, 663977984],\n          [1551439890000, 658100224],\n          [1551439920000, 657711104],\n          [1551439950000, 645820416],\n          [1551439980000, 648531968],\n          [1551440010000, 644272128],\n          [1551440040000, 649019392],\n          [1551440070000, 656228352],\n          [1551440100000, 643280896],\n          [1551440130000, 645763072],\n          [1551440160000, 649703424],\n          [1551440190000, 653647872],\n          [1551440220000, 647307264],\n          [1551440250000, 685629440],\n          [1551440280000, 711311360],\n          [1551440310000, 648220672],\n          [1551440340000, 645439488],\n          [1551440370000, 646225920],\n          [1551440400000, 650481664],\n          [1551440430000, 650178560],\n          [1551440460000, 651149312],\n          [1551440490000, 653852672],\n          [1551440520000, 651427840],\n          [1551440550000, 652050432],\n          [1551440580000, 646492160],\n          [1551440610000, 650129408],\n          [1551440640000, 659320832],\n          [1551440670000, 653029376],\n          [1551440700000, 661946368],\n          [1551440730000, 652808192],\n          [1551440760000, 656105472],\n          [1551440790000, 654086144],\n          [1551440820000, 649216000],\n          [1551440850000, 660570112],\n          [1551440880000, 663560192],\n          [1551440910000, 663306240],\n          [1551440940000, 750891008],\n          [1551440970000, 802795520],\n          [1551441000000, 682393600],\n          [1551441030000, 646311936],\n          [1551441060000, 648204288],\n          [1551441090000, 650903552],\n          [1551441120000, 648257536],\n          [1551441150000, 649920512],\n          [1551441180000, 643801088],\n          [1551441210000, 653606912],\n          [1551441240000, 654901248],\n          [1551441270000, 644833280],\n          [1551441300000, 658534400],\n          [1551441330000, 655249408],\n          [1551441360000, 647827456],\n          [1551441390000, 655147008],\n          [1551441420000, 652087296],\n          [1551441450000, 655159296],\n          [1551441480000, 655753216],\n          [1551441510000, 666820608],\n          [1551441540000, 662138880],\n          [1551441570000, 651341824],\n        ] as [number, number][],\n      },\n    },\n    kibana_response_times: {\n      /**\n       * Variant 1 - Maximum response time for client requests to the Kibana instance\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.response_times.max',\n          metricAgg: 'max',\n          label: 'Max',\n          title: 'Client Response Time',\n          description: 'Maximum response time for client requests to the Kibana instance.',\n          units: 'ms',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 11637],\n          [1551438030000, 12188],\n          [1551438060000, 11802],\n          [1551438090000, 11907],\n          [1551438120000, 11875],\n          [1551438150000, 11835],\n          [1551438180000, 12077],\n          [1551438210000, 11827],\n          [1551438240000, 11870],\n          [1551438270000, 11897],\n          [1551438300000, 12085],\n          [1551438330000, 11829],\n          [1551438360000, 11804],\n          [1551438390000, 12040],\n          [1551438420000, 11906],\n          [1551438450000, 11967],\n          [1551438480000, 11798],\n          [1551438510000, 11587],\n          [1551438540000, 11766],\n          [1551438570000, 11763],\n          [1551438600000, 11848],\n          [1551438630000, 12061],\n          [1551438660000, 11922],\n          [1551438690000, 11805],\n          [1551438720000, 12194],\n          [1551438750000, 11784],\n          [1551438780000, 12097],\n          [1551438810000, 11984],\n          [1551438840000, 11955],\n          [1551438870000, 11378],\n          [1551438900000, 12047],\n          [1551438930000, 11989],\n          [1551438960000, 11925],\n          [1551438990000, 12009],\n          [1551439020000, 11806],\n          [1551439050000, 11761],\n          [1551439080000, 11808],\n          [1551439110000, 11979],\n          [1551439140000, 11945],\n          [1551439170000, 11769],\n          [1551439200000, 12010],\n          [1551439230000, 11746],\n          [1551439260000, 12176],\n          [1551439290000, 12253],\n          [1551439320000, 12093],\n          [1551439350000, 12034],\n          [1551439380000, 12114],\n          [1551439410000, 12135],\n          [1551439440000, 12193],\n          [1551439470000, 12138],\n          [1551439500000, 12116],\n          [1551439530000, 11849],\n          [1551439560000, 12335],\n          [1551439590000, 11988],\n          [1551439620000, 12077],\n          [1551439650000, 11841],\n          [1551439680000, 11956],\n          [1551439710000, 11798],\n          [1551439740000, 11939],\n          [1551439770000, 11929],\n          [1551439800000, 11894],\n          [1551439830000, 11962],\n          [1551439860000, 12348],\n          [1551439890000, 11939],\n          [1551439920000, 12005],\n          [1551439950000, 12550],\n          [1551439980000, 11935],\n          [1551440010000, 11931],\n          [1551440040000, 11814],\n          [1551440070000, 11703],\n          [1551440100000, 11990],\n          [1551440130000, 12050],\n          [1551440160000, 11971],\n          [1551440190000, 11720],\n          [1551440220000, 12085],\n          [1551440250000, 11919],\n          [1551440280000, 12551],\n          [1551440310000, 11873],\n          [1551440340000, 11599],\n          [1551440370000, 11977],\n          [1551440400000, 12002],\n          [1551440430000, 11757],\n          [1551440460000, 11657],\n          [1551440490000, 11291],\n          [1551440520000, 11943],\n          [1551440550000, 12223],\n          [1551440580000, 1482],\n          [1551440610000, 12060],\n          [1551440640000, 12016],\n          [1551440670000, 12318],\n          [1551440700000, 11969],\n          [1551440730000, 11974],\n          [1551440760000, 11779],\n          [1551440790000, 11868],\n          [1551440820000, 12295],\n          [1551440850000, 12077],\n          [1551440880000, 12127],\n          [1551440910000, 12075],\n          [1551440940000, 12472],\n          [1551440970000, 11715],\n          [1551441000000, 12036],\n          [1551441030000, 12020],\n          [1551441060000, 12816],\n          [1551441090000, 12644],\n          [1551441120000, 11907],\n          [1551441150000, 11945],\n          [1551441180000, 12083],\n          [1551441210000, 11998],\n          [1551441240000, 12259],\n          [1551441270000, 11516],\n          [1551441300000, 11969],\n          [1551441330000, 12053],\n          [1551441360000, 12002],\n          [1551441390000, 12016],\n          [1551441420000, 12146],\n          [1551441450000, 11904],\n          [1551441480000, 11942],\n          [1551441510000, 12139],\n          [1551441540000, 11966],\n          [1551441570000, 12051],\n        ] as [number, number][],\n      },\n      /**\n       * Variant 2 - Average response time for client requests to the Kibana instance\n       */\n      v2: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.response_times.average',\n          metricAgg: 'max',\n          label: 'Average',\n          title: 'Client Response Time',\n          description: 'Average response time for client requests to the Kibana instance.',\n          units: 'ms',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 237.5],\n          [1551438030000, 606.875],\n          [1551438060000, 514.413818359375],\n          [1551438090000, 722.0555419921875],\n          [1551438120000, 512],\n          [1551438150000, 294.32073974609375],\n          [1551438180000, 538.6333618164062],\n          [1551438210000, 720.8333129882812],\n          [1551438240000, 468.56097412109375],\n          [1551438270000, 559.5184936523438],\n          [1551438300000, 549.888916015625],\n          [1551438330000, 636.6190185546875],\n          [1551438360000, 626.6818237304688],\n          [1551438390000, 578.8846435546875],\n          [1551438420000, 562.4615478515625],\n          [1551438450000, 582.75],\n          [1551438480000, 491.0967712402344],\n          [1551438510000, 527.5357055664062],\n          [1551438540000, 436.25714111328125],\n          [1551438570000, 504.17242431640625],\n          [1551438600000, 527.8928833007812],\n          [1551438630000, 419.20513916015625],\n          [1551438660000, 494.258056640625],\n          [1551438690000, 529.5184936523438],\n          [1551438720000, 511.2257995605469],\n          [1551438750000, 297.3492126464844],\n          [1551438780000, 622.3666381835938],\n          [1551438810000, 284.5199890136719],\n          [1551438840000, 805.5555419921875],\n          [1551438870000, 519.2857055664062],\n          [1551438900000, 609.4583129882812],\n          [1551438930000, 278.6333312988281],\n          [1551438960000, 537.3461303710938],\n          [1551438990000, 522.0344848632812],\n          [1551439020000, 440.8571472167969],\n          [1551439050000, 518],\n          [1551439080000, 232.17808532714844],\n          [1551439110000, 494.0322570800781],\n          [1551439140000, 597],\n          [1551439170000, 297.7321472167969],\n          [1551439200000, 552.2857055664062],\n          [1551439230000, 270.17742919921875],\n          [1551439260000, 563.3076782226562],\n          [1551439290000, 591.375],\n          [1551439320000, 613.0370483398438],\n          [1551439350000, 557.1142578125],\n          [1551439380000, 474.875],\n          [1551439410000, 282.0428466796875],\n          [1551439440000, 285.3492126464844],\n          [1551439470000, 466.2894592285156],\n          [1551439500000, 452.3714294433594],\n          [1551439530000, 445.9459533691406],\n          [1551439560000, 410.5],\n          [1551439590000, 434.6486511230469],\n          [1551439620000, 243.028564453125],\n          [1551439650000, 477.125],\n          [1551439680000, 245.6666717529297],\n          [1551439710000, 266.63934326171875],\n          [1551439740000, 398.4285583496094],\n          [1551439770000, 395.9761962890625],\n          [1551439800000, 233.9545440673828],\n          [1551439830000, 427.76922607421875],\n          [1551439860000, 366.05999755859375],\n          [1551439890000, 514],\n          [1551439920000, 421.452392578125],\n          [1551439950000, 445.5128173828125],\n          [1551439980000, 279.76812744140625],\n          [1551440010000, 225.01123046875],\n          [1551440040000, 520.6551513671875],\n          [1551440070000, 525],\n          [1551440100000, 317.6000061035156],\n          [1551440130000, 432.9756164550781],\n          [1551440160000, 454.4210510253906],\n          [1551440190000, 507.625],\n          [1551440220000, 300.015869140625],\n          [1551440250000, 512.625],\n          [1551440280000, 476.7250061035156],\n          [1551440310000, 485.8484802246094],\n          [1551440340000, 446.97222900390625],\n          [1551440370000, 519.2142944335938],\n          [1551440400000, 461.941162109375],\n          [1551440430000, 534.74072265625],\n          [1551440460000, 498.258056640625],\n          [1551440490000, 515.6666870117188],\n          [1551440520000, 564.137939453125],\n          [1551440550000, 515.933349609375],\n          [1551440580000, 148.50877380371094],\n          [1551440610000, 445.6388854980469],\n          [1551440640000, 569.923095703125],\n          [1551440670000, 328.4313659667969],\n          [1551440700000, 386.47369384765625],\n          [1551440730000, 514.6785888671875],\n          [1551440760000, 667.6818237304688],\n          [1551440790000, 589.6153564453125],\n          [1551440820000, 337.5918273925781],\n          [1551440850000, 435.868408203125],\n          [1551440880000, 569.774169921875],\n          [1551440910000, 532.0714111328125],\n          [1551440940000, 365.9818115234375],\n          [1551440970000, 616.0833129882812],\n          [1551441000000, 521.8965454101562],\n          [1551441030000, 557.1851806640625],\n          [1551441060000, 540.3793334960938],\n          [1551441090000, 588.076904296875],\n          [1551441120000, 610.2000122070312],\n          [1551441150000, 621.3333129882812],\n          [1551441180000, 534],\n          [1551441210000, 533.8571166992188],\n          [1551441240000, 459.8611145019531],\n          [1551441270000, 508.96429443359375],\n          [1551441300000, 556.8148193359375],\n          [1551441330000, 614.8695678710938],\n          [1551441360000, 469.8285827636719],\n          [1551441390000, 484.18182373046875],\n          [1551441420000, 644.09521484375],\n          [1551441450000, 524],\n          [1551441480000, 719.5789184570312],\n          [1551441510000, 564.4000244140625],\n          [1551441540000, 561.0740966796875],\n          [1551441570000, 329.6833190917969],\n        ] as [number, number][],\n      },\n    },\n    kibana_requests: {\n      /**\n       * Variant 1 - Total number of client requests received by the Kibana instance\n       */\n      v1: {\n        bucket_size: '30 seconds',\n        timeRange: { min: 1551438000000, max: 1551441600000 },\n        metric: {\n          app: 'kibana',\n          field: 'kibana_stats.requests.total',\n          metricAgg: 'max',\n          label: 'Client Requests',\n          description: 'Total number of client requests received by the Kibana instance.',\n          units: '',\n          format: '0.[00]',\n          hasCalculation: false,\n          isDerivative: false,\n        },\n        data: [\n          [1551438000000, 62],\n          [1551438030000, 43],\n          [1551438060000, 64],\n          [1551438090000, 60],\n          [1551438120000, 44],\n          [1551438150000, 56],\n          [1551438180000, 32],\n          [1551438210000, 36],\n          [1551438240000, 56],\n          [1551438270000, 83],\n          [1551438300000, 59],\n          [1551438330000, 62],\n          [1551438360000, 34],\n          [1551438390000, 35],\n          [1551438420000, 30],\n          [1551438450000, 30],\n          [1551438480000, 32],\n          [1551438510000, 30],\n          [1551438540000, 62],\n          [1551438570000, 37],\n          [1551438600000, 33],\n          [1551438630000, 56],\n          [1551438660000, 36],\n          [1551438690000, 31],\n          [1551438720000, 85],\n          [1551438750000, 75],\n          [1551438780000, 53],\n          [1551438810000, 48],\n          [1551438840000, 39],\n          [1551438870000, 57],\n          [1551438900000, 37],\n          [1551438930000, 58],\n          [1551438960000, 91],\n          [1551438990000, 65],\n          [1551439020000, 43],\n          [1551439050000, 35],\n          [1551439080000, 71],\n          [1551439110000, 62],\n          [1551439140000, 34],\n          [1551439170000, 55],\n          [1551439200000, 61],\n          [1551439230000, 74],\n          [1551439260000, 62],\n          [1551439290000, 53],\n          [1551439320000, 97],\n          [1551439350000, 92],\n          [1551439380000, 37],\n          [1551439410000, 71],\n          [1551439440000, 64],\n          [1551439470000, 39],\n          [1551439500000, 60],\n          [1551439530000, 56],\n          [1551439560000, 39],\n          [1551439590000, 36],\n          [1551439620000, 70],\n          [1551439650000, 47],\n          [1551439680000, 66],\n          [1551439710000, 124],\n          [1551439740000, 52],\n          [1551439770000, 98],\n          [1551439800000, 86],\n          [1551439830000, 97],\n          [1551439860000, 50],\n          [1551439890000, 36],\n          [1551439920000, 42],\n          [1551439950000, 41],\n          [1551439980000, 72],\n          [1551440010000, 93],\n          [1551440040000, 53],\n          [1551440070000, 33],\n          [1551440100000, 66],\n          [1551440130000, 43],\n          [1551440160000, 44],\n          [1551440190000, 34],\n          [1551440220000, 104],\n          [1551440250000, 50],\n          [1551440280000, 38],\n          [1551440310000, 35],\n          [1551440340000, 37],\n          [1551440370000, 37],\n          [1551440400000, 40],\n          [1551440430000, 33],\n          [1551440460000, 34],\n          [1551440490000, 31],\n          [1551440520000, 35],\n          [1551440550000, 41],\n          [1551440580000, 59],\n          [1551440610000, 36],\n          [1551440640000, 80],\n          [1551440670000, 41],\n          [1551440700000, 53],\n          [1551440730000, 106],\n          [1551440760000, 62],\n          [1551440790000, 90],\n          [1551440820000, 67],\n          [1551440850000, 107],\n          [1551440880000, 83],\n          [1551440910000, 74],\n          [1551440940000, 91],\n          [1551440970000, 57],\n          [1551441000000, 36],\n          [1551441030000, 33],\n          [1551441060000, 55],\n          [1551441090000, 41],\n          [1551441120000, 32],\n          [1551441150000, 38],\n          [1551441180000, 57],\n          [1551441210000, 57],\n          [1551441240000, 43],\n          [1551441270000, 41],\n          [1551441300000, 34],\n          [1551441330000, 59],\n          [1551441360000, 36],\n          [1551441390000, 71],\n          [1551441420000, 55],\n          [1551441450000, 43],\n          [1551441480000, 67],\n          [1551441510000, 81],\n          [1551441540000, 58],\n          [1551441570000, 97],\n        ] as [number, number][],\n      },\n    },\n  },\n  kibanaSummary: {\n    uuid: '38cd1f5c-fc29-492e-b5b6-34777df7bdf6',\n    name: 'demo.elastic.co',\n    index: '.kibana',\n    host: '0.0.0.0',\n    transport_address: '0.0.0.0:5601',\n    version: '6.5.4',\n    snapshot: false,\n    status: 'green',\n    availability: true,\n    os_memory_free: 74041475072,\n    uptime: 243193903,\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport const TSVB_DATASET = {\n  id: '61ca57f0-469d-11e7-af02-69e470af7417',\n  series: [\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:jpg',\n      label: 'jpg',\n      color: 'rgb(104, 188, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 6],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 0],\n        [1552858800000, 1],\n        [1552859400000, 1],\n        [1552860000000, 0],\n        [1552860600000, 1],\n        [1552861200000, 1],\n        [1552861800000, 1],\n        [1552862400000, 0],\n        [1552863000000, 2],\n        [1552863600000, 1],\n        [1552864200000, 0],\n        [1552864800000, 1],\n        [1552865400000, 4],\n        [1552866000000, 6],\n        [1552866600000, 6],\n        [1552867200000, 4],\n        [1552867800000, 7],\n        [1552868400000, 3],\n        [1552869000000, 20],\n        [1552869600000, 30],\n        [1552870200000, 40],\n        [1552870800000, null],\n        [1552871400000, 5],\n        [1552872000000, 6],\n        [1552872600000, 12],\n        [1552873200000, 0],\n        [1552873800000, 10],\n        [1552874400000, 10],\n        [1552875000000, 13],\n        [1552875600000, 8],\n        [1552876200000, 13],\n        [1552876800000, 10],\n        [1552877400000, 10],\n        [1552878000000, 20],\n        [1552878600000, 16],\n        [1552879200000, 16],\n        [1552879800000, 15],\n        [1552880400000, 21],\n        [1552881000000, 19],\n        [1552881600000, 29],\n        [1552882200000, 31],\n        [1552882800000, 28],\n        [1552883400000, 33],\n        [1552884000000, 30],\n        [1552884600000, 29],\n        [1552885200000, 24],\n        [1552885800000, 35],\n        [1552886400000, 33],\n        [1552887000000, 32],\n        [1552887600000, 28],\n        [1552888200000, 48],\n        [1552888800000, 44],\n        [1552889400000, 26],\n        [1552890000000, 44],\n        [1552890600000, 65],\n        [1552891200000, 42],\n        [1552891800000, 49],\n        [1552892400000, 51],\n        [1552893000000, 59],\n        [1552893600000, 47],\n        [1552894200000, 47],\n        [1552894800000, 54],\n        [1552895400000, 48],\n        [1552896000000, 61],\n        [1552896600000, 63],\n        [1552897200000, 59],\n        [1552897800000, 58],\n        [1552898400000, 52],\n        [1552899000000, 61],\n        [1552899600000, 42],\n        [1552900200000, 48],\n        [1552900800000, 47],\n        [1552901400000, 52],\n        [1552902000000, 67],\n        [1552902600000, 49],\n        [1552903200000, 56],\n        [1552903800000, 36],\n        [1552904400000, 38],\n        [1552905000000, 42],\n        [1552905600000, 59],\n        [1552906200000, 41],\n        [1552906800000, 32],\n        [1552907400000, 48],\n        [1552908000000, 41],\n        [1552908600000, 41],\n        [1552909200000, 44],\n        [1552909800000, 46],\n        [1552910400000, 32],\n        [1552911000000, 40],\n        [1552911600000, 33],\n        [1552912200000, 30],\n        [1552912800000, 33],\n        [1552913400000, 31],\n        [1552914000000, 35],\n        [1552914600000, 22],\n        [1552915200000, 26],\n        [1552915800000, 22],\n        [1552916400000, 14],\n        [1552917000000, 22],\n        [1552917600000, 20],\n        [1552918200000, 13],\n        [1552918800000, 21],\n        [1552919400000, 14],\n        [1552920000000, 15],\n        [1552920600000, 13],\n        [1552921200000, 16],\n        [1552921800000, 14],\n        [1552922400000, 12],\n        [1552923000000, 10],\n        [1552923600000, 7],\n        [1552924200000, 12],\n        [1552924800000, 3],\n        [1552925400000, 0],\n        [1552926000000, 3],\n        [1552926600000, 6],\n        [1552927200000, 6],\n        [1552927800000, 7],\n        [1552928400000, 10],\n        [1552929000000, 4],\n        [1552929600000, 6],\n        [1552930200000, 9],\n        [1552930800000, 4],\n        [1552931400000, 2],\n        [1552932000000, 1],\n        [1552932600000, 3],\n        [1552933200000, 4],\n        [1552933800000, 6],\n        [1552934400000, 1],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 0],\n        [1552936800000, 1],\n        [1552937400000, 1],\n        [1552938000000, 0],\n        [1552938600000, 1],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 1],\n        [1552941000000, 0],\n        [1552941600000, 0],\n        [1552942200000, 0],\n        [1552942800000, 2],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 1],\n        [1552945200000, 0],\n        [1552945800000, 2],\n        [1552946400000, 1],\n        [1552947000000, 0],\n        [1552947600000, 1],\n        [1552948200000, 1],\n        [1552948800000, 1],\n        [1552949400000, 2],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:css',\n      label: 'css',\n      color: 'rgb(77, 138, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 0],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 1],\n        [1552858800000, 0],\n        [1552859400000, 0],\n        [1552860000000, 1],\n        [1552860600000, 0],\n        [1552861200000, 0],\n        [1552861800000, 2],\n        [1552862400000, 0],\n        [1552863000000, 0],\n        [1552863600000, 1],\n        [1552864200000, 0],\n        [1552864800000, 1],\n        [1552865400000, 1],\n        [1552866000000, 0],\n        [1552866600000, 0],\n        [1552867200000, 2],\n        [1552867800000, 0],\n        [1552868400000, 4],\n        [1552869000000, 0],\n        [1552869600000, 1],\n        [1552870200000, 0],\n        [1552870800000, 2],\n        [1552871400000, 2],\n        [1552872000000, 2],\n        [1552872600000, 1],\n        [1552873200000, 0],\n        [1552873800000, 2],\n        [1552874400000, 1],\n        [1552875000000, 2],\n        [1552875600000, 4],\n        [1552876200000, 4],\n        [1552876800000, 4],\n        [1552877400000, 3],\n        [1552878000000, 3],\n        [1552878600000, 3],\n        [1552879200000, 0],\n        [1552879800000, 3],\n        [1552880400000, 4],\n        [1552881000000, 4],\n        [1552881600000, 4],\n        [1552882200000, 8],\n        [1552882800000, 7],\n        [1552883400000, 7],\n        [1552884000000, 3],\n        [1552884600000, 8],\n        [1552885200000, 6],\n        [1552885800000, 6],\n        [1552886400000, 8],\n        [1552887000000, 11],\n        [1552887600000, 7],\n        [1552888200000, 8],\n        [1552888800000, 7],\n        [1552889400000, 11],\n        [1552890000000, 16],\n        [1552890600000, 14],\n        [1552891200000, 10],\n        [1552891800000, 12],\n        [1552892400000, 7],\n        [1552893000000, 15],\n        [1552893600000, 13],\n        [1552894200000, 9],\n        [1552894800000, 16],\n        [1552895400000, 15],\n        [1552896000000, 14],\n        [1552896600000, 9],\n        [1552897200000, 10],\n        [1552897800000, 15],\n        [1552898400000, 15],\n        [1552899000000, 13],\n        [1552899600000, 18],\n        [1552900200000, 17],\n        [1552900800000, 18],\n        [1552901400000, 18],\n        [1552902000000, 6],\n        [1552902600000, 19],\n        [1552903200000, 20],\n        [1552903800000, 14],\n        [1552904400000, 11],\n        [1552905000000, 7],\n        [1552905600000, 20],\n        [1552906200000, 11],\n        [1552906800000, 13],\n        [1552907400000, 8],\n        [1552908000000, 15],\n        [1552908600000, 10],\n        [1552909200000, 13],\n        [1552909800000, 16],\n        [1552910400000, 11],\n        [1552911000000, 11],\n        [1552911600000, 11],\n        [1552912200000, 7],\n        [1552912800000, 10],\n        [1552913400000, 6],\n        [1552914000000, 4],\n        [1552914600000, 6],\n        [1552915200000, 4],\n        [1552915800000, 5],\n        [1552916400000, 7],\n        [1552917000000, 7],\n        [1552917600000, 5],\n        [1552918200000, 2],\n        [1552918800000, 3],\n        [1552919400000, 4],\n        [1552920000000, 3],\n        [1552920600000, 4],\n        [1552921200000, 1],\n        [1552921800000, 4],\n        [1552922400000, 4],\n        [1552923000000, 2],\n        [1552923600000, 3],\n        [1552924200000, 3],\n        [1552924800000, 2],\n        [1552925400000, 0],\n        [1552926000000, 1],\n        [1552926600000, 0],\n        [1552927200000, 2],\n        [1552927800000, 4],\n        [1552928400000, 2],\n        [1552929000000, 2],\n        [1552929600000, 0],\n        [1552930200000, 0],\n        [1552930800000, 0],\n        [1552931400000, 2],\n        [1552932000000, 0],\n        [1552932600000, 1],\n        [1552933200000, 1],\n        [1552933800000, 0],\n        [1552934400000, 1],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 0],\n        [1552936800000, 2],\n        [1552937400000, 0],\n        [1552938000000, 0],\n        [1552938600000, 0],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 0],\n        [1552941000000, 0],\n        [1552941600000, 1],\n        [1552942200000, 0],\n        [1552942800000, 1],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 0],\n        [1552945200000, 0],\n        [1552945800000, 0],\n        [1552946400000, 1],\n        [1552947000000, 1],\n        [1552947600000, 0],\n        [1552948200000, 0],\n        [1552948800000, 1],\n        [1552949400000, 0],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:png',\n      label: 'png',\n      color: 'rgb(49, 89, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 2],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 0],\n        [1552858800000, 0],\n        [1552859400000, 0],\n        [1552860000000, 1],\n        [1552860600000, 1],\n        [1552861200000, 0],\n        [1552861800000, 0],\n        [1552862400000, 1],\n        [1552863000000, 0],\n        [1552863600000, 1],\n        [1552864200000, 1],\n        [1552864800000, 0],\n        [1552865400000, 0],\n        [1552866000000, 0],\n        [1552866600000, 1],\n        [1552867200000, 0],\n        [1552867800000, 2],\n        [1552868400000, 0],\n        [1552869000000, 0],\n        [1552869600000, 0],\n        [1552870200000, 0],\n        [1552870800000, 2],\n        [1552871400000, 3],\n        [1552872000000, 0],\n        [1552872600000, 0],\n        [1552873200000, 0],\n        [1552873800000, 0],\n        [1552874400000, 0],\n        [1552875000000, 2],\n        [1552875600000, 4],\n        [1552876200000, 0],\n        [1552876800000, 7],\n        [1552877400000, 0],\n        [1552878000000, 2],\n        [1552878600000, 0],\n        [1552879200000, 2],\n        [1552879800000, 4],\n        [1552880400000, 0],\n        [1552881000000, 2],\n        [1552881600000, 7],\n        [1552882200000, 4],\n        [1552882800000, 2],\n        [1552883400000, 4],\n        [1552884000000, 2],\n        [1552884600000, 6],\n        [1552885200000, 4],\n        [1552885800000, 5],\n        [1552886400000, 2],\n        [1552887000000, 7],\n        [1552887600000, 7],\n        [1552888200000, 5],\n        [1552888800000, 2],\n        [1552889400000, 1],\n        [1552890000000, 10],\n        [1552890600000, 9],\n        [1552891200000, 5],\n        [1552891800000, 10],\n        [1552892400000, 5],\n        [1552893000000, 7],\n        [1552893600000, 14],\n        [1552894200000, 10],\n        [1552894800000, 3],\n        [1552895400000, 11],\n        [1552896000000, 4],\n        [1552896600000, 15],\n        [1552897200000, 13],\n        [1552897800000, 15],\n        [1552898400000, 10],\n        [1552899000000, 4],\n        [1552899600000, 7],\n        [1552900200000, 12],\n        [1552900800000, 6],\n        [1552901400000, 9],\n        [1552902000000, 12],\n        [1552902600000, 3],\n        [1552903200000, 11],\n        [1552903800000, 10],\n        [1552904400000, 9],\n        [1552905000000, 6],\n        [1552905600000, 10],\n        [1552906200000, 5],\n        [1552906800000, 7],\n        [1552907400000, 9],\n        [1552908000000, 6],\n        [1552908600000, 7],\n        [1552909200000, 2],\n        [1552909800000, 3],\n        [1552910400000, 8],\n        [1552911000000, 2],\n        [1552911600000, 4],\n        [1552912200000, 6],\n        [1552912800000, 1],\n        [1552913400000, 6],\n        [1552914000000, 3],\n        [1552914600000, 2],\n        [1552915200000, 6],\n        [1552915800000, 6],\n        [1552916400000, 4],\n        [1552917000000, 3],\n        [1552917600000, 3],\n        [1552918200000, 1],\n        [1552918800000, 2],\n        [1552919400000, 4],\n        [1552920000000, 4],\n        [1552920600000, 2],\n        [1552921200000, 3],\n        [1552921800000, 1],\n        [1552922400000, 4],\n        [1552923000000, 1],\n        [1552923600000, 3],\n        [1552924200000, 1],\n        [1552924800000, 0],\n        [1552925400000, 0],\n        [1552926000000, 1],\n        [1552926600000, 1],\n        [1552927200000, 0],\n        [1552927800000, 0],\n        [1552928400000, 1],\n        [1552929000000, 1],\n        [1552929600000, 1],\n        [1552930200000, 0],\n        [1552930800000, 0],\n        [1552931400000, 0],\n        [1552932000000, 0],\n        [1552932600000, 0],\n        [1552933200000, 0],\n        [1552933800000, 0],\n        [1552934400000, 0],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 0],\n        [1552936800000, 0],\n        [1552937400000, 0],\n        [1552938000000, 0],\n        [1552938600000, 0],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 0],\n        [1552941000000, 0],\n        [1552941600000, 0],\n        [1552942200000, 0],\n        [1552942800000, 0],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 0],\n        [1552945200000, 0],\n        [1552945800000, 0],\n        [1552946400000, 0],\n        [1552947000000, 1],\n        [1552947600000, 0],\n        [1552948200000, 1],\n        [1552948800000, 0],\n        [1552949400000, 1],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:gif',\n      label: 'gif',\n      color: 'rgb(22, 39, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 0],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 0],\n        [1552858800000, 0],\n        [1552859400000, 0],\n        [1552860000000, 0],\n        [1552860600000, 0],\n        [1552861200000, 0],\n        [1552861800000, 0],\n        [1552862400000, 0],\n        [1552863000000, 0],\n        [1552863600000, 0],\n        [1552864200000, 0],\n        [1552864800000, 0],\n        [1552865400000, 0],\n        [1552866000000, 0],\n        [1552866600000, 0],\n        [1552867200000, 1],\n        [1552867800000, 0],\n        [1552868400000, 2],\n        [1552869000000, 1],\n        [1552869600000, 0],\n        [1552870200000, 1],\n        [1552870800000, 1],\n        [1552871400000, 2],\n        [1552872000000, 1],\n        [1552872600000, 2],\n        [1552873200000, 0],\n        [1552873800000, 1],\n        [1552874400000, 0],\n        [1552875000000, 0],\n        [1552875600000, 1],\n        [1552876200000, 1],\n        [1552876800000, 1],\n        [1552877400000, 2],\n        [1552878000000, 0],\n        [1552878600000, 2],\n        [1552879200000, 1],\n        [1552879800000, 2],\n        [1552880400000, 3],\n        [1552881000000, 2],\n        [1552881600000, 1],\n        [1552882200000, 2],\n        [1552882800000, 6],\n        [1552883400000, 4],\n        [1552884000000, 3],\n        [1552884600000, 5],\n        [1552885200000, 3],\n        [1552885800000, 3],\n        [1552886400000, 3],\n        [1552887000000, 3],\n        [1552887600000, 3],\n        [1552888200000, 3],\n        [1552888800000, 5],\n        [1552889400000, 1],\n        [1552890000000, 3],\n        [1552890600000, 4],\n        [1552891200000, 5],\n        [1552891800000, 4],\n        [1552892400000, 6],\n        [1552893000000, 4],\n        [1552893600000, 5],\n        [1552894200000, 5],\n        [1552894800000, 12],\n        [1552895400000, 7],\n        [1552896000000, 2],\n        [1552896600000, 8],\n        [1552897200000, 8],\n        [1552897800000, 5],\n        [1552898400000, 6],\n        [1552899000000, 8],\n        [1552899600000, 6],\n        [1552900200000, 3],\n        [1552900800000, 8],\n        [1552901400000, 4],\n        [1552902000000, 3],\n        [1552902600000, 9],\n        [1552903200000, 6],\n        [1552903800000, 14],\n        [1552904400000, 3],\n        [1552905000000, 7],\n        [1552905600000, 3],\n        [1552906200000, 4],\n        [1552906800000, 3],\n        [1552907400000, 5],\n        [1552908000000, 2],\n        [1552908600000, 3],\n        [1552909200000, 1],\n        [1552909800000, 2],\n        [1552910400000, 2],\n        [1552911000000, 5],\n        [1552911600000, 2],\n        [1552912200000, 1],\n        [1552912800000, 4],\n        [1552913400000, 3],\n        [1552914000000, 3],\n        [1552914600000, 4],\n        [1552915200000, 1],\n        [1552915800000, 4],\n        [1552916400000, 2],\n        [1552917000000, 3],\n        [1552917600000, 2],\n        [1552918200000, 2],\n        [1552918800000, 2],\n        [1552919400000, 0],\n        [1552920000000, 1],\n        [1552920600000, 2],\n        [1552921200000, 1],\n        [1552921800000, 4],\n        [1552922400000, 0],\n        [1552923000000, 0],\n        [1552923600000, 0],\n        [1552924200000, 0],\n        [1552924800000, 0],\n        [1552925400000, 0],\n        [1552926000000, 1],\n        [1552926600000, 2],\n        [1552927200000, 0],\n        [1552927800000, 0],\n        [1552928400000, 0],\n        [1552929000000, 0],\n        [1552929600000, 1],\n        [1552930200000, 0],\n        [1552930800000, 0],\n        [1552931400000, 0],\n        [1552932000000, 1],\n        [1552932600000, 1],\n        [1552933200000, 0],\n        [1552933800000, 0],\n        [1552934400000, 0],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 0],\n        [1552936800000, 0],\n        [1552937400000, 0],\n        [1552938000000, 0],\n        [1552938600000, 0],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 0],\n        [1552941000000, 0],\n        [1552941600000, 0],\n        [1552942200000, 0],\n        [1552942800000, 0],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 0],\n        [1552945200000, 0],\n        [1552945800000, 0],\n        [1552946400000, 0],\n        [1552947000000, 0],\n        [1552947600000, 0],\n        [1552948200000, 0],\n        [1552948800000, 0],\n        [1552949400000, 0],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n    {\n      id: '61ca57f1-469d-11e7-af02-69e470af7417:php',\n      label: 'php',\n      color: 'rgb(0, 0, 0)',\n      data: [\n        [1552830600000, 0],\n        [1552831200000, 0],\n        [1552831800000, 0],\n        [1552832400000, 0],\n        [1552833000000, 0],\n        [1552833600000, 0],\n        [1552834200000, 0],\n        [1552834800000, 0],\n        [1552835400000, 0],\n        [1552836000000, 0],\n        [1552836600000, 0],\n        [1552837200000, 0],\n        [1552837800000, 0],\n        [1552838400000, 0],\n        [1552839000000, 0],\n        [1552839600000, 0],\n        [1552840200000, 0],\n        [1552840800000, 0],\n        [1552841400000, 0],\n        [1552842000000, 0],\n        [1552842600000, 0],\n        [1552843200000, 0],\n        [1552843800000, 0],\n        [1552844400000, 0],\n        [1552845000000, 0],\n        [1552845600000, 0],\n        [1552846200000, 0],\n        [1552846800000, 0],\n        [1552847400000, 0],\n        [1552848000000, 0],\n        [1552848600000, 0],\n        [1552849200000, 0],\n        [1552849800000, 0],\n        [1552850400000, 0],\n        [1552851000000, 0],\n        [1552851600000, 0],\n        [1552852200000, 0],\n        [1552852800000, 0],\n        [1552853400000, 0],\n        [1552854000000, 0],\n        [1552854600000, 0],\n        [1552855200000, 0],\n        [1552855800000, 0],\n        [1552856400000, 0],\n        [1552857000000, 0],\n        [1552857600000, 0],\n        [1552858200000, 0],\n        [1552858800000, 0],\n        [1552859400000, 0],\n        [1552860000000, 0],\n        [1552860600000, 0],\n        [1552861200000, 0],\n        [1552861800000, 0],\n        [1552862400000, 0],\n        [1552863000000, 0],\n        [1552863600000, 0],\n        [1552864200000, 0],\n        [1552864800000, 1],\n        [1552865400000, 0],\n        [1552866000000, 0],\n        [1552866600000, 0],\n        [1552867200000, 0],\n        [1552867800000, 0],\n        [1552868400000, 0],\n        [1552869000000, 0],\n        [1552869600000, 0],\n        [1552870200000, 0],\n        [1552870800000, 0],\n        [1552871400000, 1],\n        [1552872000000, 1],\n        [1552872600000, 1],\n        [1552873200000, 0],\n        [1552873800000, 1],\n        [1552874400000, 0],\n        [1552875000000, 0],\n        [1552875600000, 0],\n        [1552876200000, 0],\n        [1552876800000, 0],\n        [1552877400000, 3],\n        [1552878000000, 0],\n        [1552878600000, 0],\n        [1552879200000, 0],\n        [1552879800000, 0],\n        [1552880400000, 1],\n        [1552881000000, 1],\n        [1552881600000, 1],\n        [1552882200000, 1],\n        [1552882800000, 1],\n        [1552883400000, 2],\n        [1552884000000, 0],\n        [1552884600000, 1],\n        [1552885200000, 1],\n        [1552885800000, 1],\n        [1552886400000, 0],\n        [1552887000000, 1],\n        [1552887600000, 5],\n        [1552888200000, 2],\n        [1552888800000, 1],\n        [1552889400000, 4],\n        [1552890000000, 1],\n        [1552890600000, 2],\n        [1552891200000, 4],\n        [1552891800000, 8],\n        [1552892400000, 3],\n        [1552893000000, 4],\n        [1552893600000, 3],\n        [1552894200000, 2],\n        [1552894800000, 0],\n        [1552895400000, 5],\n        [1552896000000, 3],\n        [1552896600000, 4],\n        [1552897200000, 2],\n        [1552897800000, 1],\n        [1552898400000, 2],\n        [1552899000000, 2],\n        [1552899600000, 1],\n        [1552900200000, 3],\n        [1552900800000, 1],\n        [1552901400000, 1],\n        [1552902000000, 3],\n        [1552902600000, 4],\n        [1552903200000, 2],\n        [1552903800000, 4],\n        [1552904400000, 4],\n        [1552905000000, 4],\n        [1552905600000, 0],\n        [1552906200000, 5],\n        [1552906800000, 2],\n        [1552907400000, 5],\n        [1552908000000, 3],\n        [1552908600000, 0],\n        [1552909200000, 3],\n        [1552909800000, 0],\n        [1552910400000, 4],\n        [1552911000000, 1],\n        [1552911600000, 1],\n        [1552912200000, 0],\n        [1552912800000, 0],\n        [1552913400000, 2],\n        [1552914000000, 1],\n        [1552914600000, 2],\n        [1552915200000, 0],\n        [1552915800000, 0],\n        [1552916400000, 0],\n        [1552917000000, 1],\n        [1552917600000, 0],\n        [1552918200000, 1],\n        [1552918800000, 0],\n        [1552919400000, 2],\n        [1552920000000, 1],\n        [1552920600000, 0],\n        [1552921200000, 0],\n        [1552921800000, 0],\n        [1552922400000, 3],\n        [1552923000000, 0],\n        [1552923600000, 0],\n        [1552924200000, 0],\n        [1552924800000, 0],\n        [1552925400000, 0],\n        [1552926000000, 0],\n        [1552926600000, 0],\n        [1552927200000, 0],\n        [1552927800000, 0],\n        [1552928400000, 0],\n        [1552929000000, 0],\n        [1552929600000, 1],\n        [1552930200000, 0],\n        [1552930800000, 0],\n        [1552931400000, 0],\n        [1552932000000, 0],\n        [1552932600000, 0],\n        [1552933200000, 0],\n        [1552933800000, 0],\n        [1552934400000, 0],\n        [1552935000000, 0],\n        [1552935600000, 0],\n        [1552936200000, 1],\n        [1552936800000, 0],\n        [1552937400000, 0],\n        [1552938000000, 0],\n        [1552938600000, 0],\n        [1552939200000, 0],\n        [1552939800000, 0],\n        [1552940400000, 0],\n        [1552941000000, 0],\n        [1552941600000, 0],\n        [1552942200000, 0],\n        [1552942800000, 0],\n        [1552943400000, 0],\n        [1552944000000, 0],\n        [1552944600000, 0],\n        [1552945200000, 0],\n        [1552945800000, 0],\n        [1552946400000, 0],\n        [1552947000000, 0],\n        [1552947600000, 0],\n        [1552948200000, 0],\n        [1552948800000, 0],\n        [1552949400000, 1],\n      ],\n      stack: false,\n      lines: { show: true, fill: 0.5, lineWidth: 1, steps: false },\n      points: { show: true, radius: 1, lineWidth: 1 },\n      bars: { show: false, fill: 0.5, lineWidth: 1 },\n    },\n  ],\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// eslint-disable-next-line no-restricted-imports\nimport { debounce as tsDebounce, Options } from 'ts-debounce';\n\n/** @internal */\nexport interface DebouncedFunction<Args extends any[], F extends (...args: Args) => any> {\n  (this: ThisParameterType<F>, ...args: Parameters<F> & Args): ReturnType<F>;\n  cancel: (reason?: any) => void;\n}\n\n/**\n * Wrapper around ts-debounce to fix typings\n * @internal\n */\nexport function debounce<Args extends any[], F extends (...args: Args) => any>(\n  func: F,\n  waitMilliseconds?: number,\n  options?: Options<ReturnType<F>>,\n): DebouncedFunction<Args, F> {\n  // TODO refactor code to ignore or use promise\n  // As of ts - debounce@v3.0 it now returns a promise\n  // we also need a better way to designate internal setting from external, the user does\n  // not care that this function is debounced nor should they be providing a debounced function\n  return tsDebounce(func, waitMilliseconds, options) as DebouncedFunction<Args, F>; // cast required to override promise return type\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Pixels } from '../common/geometry';\n\n/** @public */\nexport interface Dimensions {\n  top: number;\n  left: number;\n  width: number;\n  height: number;\n}\n\n/** @internal */\nexport interface Size {\n  width: number;\n  height: number;\n}\n\n/**\n * fixme consider switching from `number` to `Pixels` or similar, once nominal typing is added\n * @public\n */\nexport interface PerSideDistance {\n  top: number;\n  bottom: number;\n  left: number;\n  right: number;\n}\n\n/**\n * fixme consider deactivating \\@typescript-eslint/no-empty-interface\n * see https://github.com/elastic/elastic-charts/pull/660#discussion_r419474171\n * @public\n */\nexport type Margins = PerSideDistance;\n\n/**\n * todo separate type with partition padding type that allows number\n * @public\n */\nexport type Padding = PerSideDistance;\n\n/**\n * Simple padding declaration\n * @public\n */\nexport interface SimplePadding {\n  outer: Pixels;\n  inner: Pixels;\n}\n\n/** @internal */\nexport const innerPad = (padding: number | Partial<SimplePadding>, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding : padding?.inner ?? 0);\n\n/** @internal */\nexport const outerPad = (padding: number | Partial<SimplePadding>, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding : padding?.outer ?? 0);\n\n/** @internal */\nexport const verticalPad = (padding: number | Padding, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding * 2 : padding.top + padding.bottom);\n\n/** @internal */\nexport const horizontalPad = (padding: number | Padding, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding * 2 : padding.left + padding.right);\n\n/** @internal */\nexport const pad = (padding: number | Padding, direction: keyof Padding, minPadding = 0) =>\n  Math.max(minPadding, typeof padding === 'number' ? padding : padding[direction]);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { extent } from 'd3-array';\n\nimport { ScaleType } from '../scales/constants';\nimport { DomainPaddingUnit, YDomainRange } from '../specs';\n\n/** @public */\nexport type OrdinalDomain = (number | string)[];\n/** @public */\nexport type ContinuousDomain = [min: number, max: number];\n/** @public */\nexport type GenericDomain = [start: number, end: number];\n/** @public */\nexport type Range = [min: number, max: number];\n\nfunction constrainPadding(\n  start: number,\n  end: number,\n  newStart: number,\n  newEnd: number,\n  constrain: boolean = true,\n): [number, number] {\n  return constrain\n    ? start < end\n      ? [newStart >= 0 || start < 0 ? newStart : 0, newEnd <= 0 || end > 0 ? newEnd : 0]\n      : [newEnd >= 0 || end < 0 ? newEnd : 0, newStart <= 0 || start > 0 ? newStart : 0]\n    : [newStart, newEnd];\n}\n\n/** @internal */\nexport function computeOrdinalDataDomain<T>(data: T[], sorted: boolean, removeNull: boolean, locale: string): T[] {\n  const uniqueValues = [...new Set(removeNull ? data.filter((d) => d !== null) : data)];\n  return sorted ? uniqueValues.sort((a, b) => `${a}`.localeCompare(`${b}`, locale)) : uniqueValues;\n}\n\nfunction getPaddedDomain(start: number, end: number, domainOptions: YDomainRange): [number, number] {\n  const { padding, paddingUnit = DomainPaddingUnit.Domain } = domainOptions;\n  if (!padding || paddingUnit === DomainPaddingUnit.Pixel) return [start, end];\n  const computedPadding = Math.abs(padding * (paddingUnit === DomainPaddingUnit.Domain ? 1 : end - start));\n  return constrainPadding(start, end, start - computedPadding, end + computedPadding, domainOptions.constrainPadding);\n}\n\n/** @internal */\nexport function computeDomainExtent(\n  domain: [number, number] | [undefined, undefined],\n  domainOptions: YDomainRange,\n): [number, number] {\n  if (domain[0] === undefined) return [0, 0]; // if domain[1] is undefined, domain[0] is undefined too\n  const inverted = domain[0] > domain[1];\n  const paddedDomain = (([start, end]: Range): Range => {\n    const [paddedStart, paddedEnd] = getPaddedDomain(start, end, domainOptions);\n    if (paddedStart >= 0 && paddedEnd >= 0) return domainOptions.fit ? [paddedStart, paddedEnd] : [0, paddedEnd];\n    if (paddedStart < 0 && paddedEnd < 0) return domainOptions.fit ? [paddedStart, paddedEnd] : [paddedStart, 0];\n    return [paddedStart, paddedEnd];\n  })(inverted ? [domain[1], domain[0]] : domain);\n\n  return inverted ? [paddedDomain[1], paddedDomain[0]] : paddedDomain;\n}\n\n/**\n * Get continuous domain from data. May yield domain to constrain to zero baseline.\n * @internal\n */\nexport function computeContinuousDataDomain(\n  data: number[],\n  scaleType: ScaleType,\n  domainOptions: YDomainRange | undefined,\n): ContinuousDomain {\n  // todo check for DRY violations: this may not be the only place for non-positives removal for the log scale\n  const filteredData = domainOptions?.fit && scaleType === ScaleType.Log ? data.filter((d) => d !== 0) : data;\n  const range = extent<number, number>(filteredData, (d) => d);\n  return domainOptions === undefined ? [range[0] ?? 0, range[1] ?? 0] : computeDomainExtent(range, domainOptions);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ScaleBand, ScaleContinuous } from '../scales';\nimport { BrushEndListener, isPointerOverEvent, PointerEvent, PointerOverEvent } from '../specs';\nimport { DragState } from '../state/chart_state';\n\n/** @internal */\nexport function isValidPointerOverEvent(\n  mainScale: ScaleBand | ScaleContinuous,\n  event: PointerEvent | null | undefined,\n): event is PointerOverEvent {\n  return isPointerOverEvent(event) && (event.unit === undefined || event.unit === mainScale.unit);\n}\n\n/** @internal */\nexport interface DragCheckProps {\n  onBrushEnd: BrushEndListener | undefined;\n  lastDrag: DragState | null;\n}\n\n/** @internal */\nexport function hasDragged(prevProps: DragCheckProps | null, nextProps: DragCheckProps | null) {\n  if (nextProps === null) {\n    return false;\n  }\n  if (!nextProps.onBrushEnd) {\n    return false;\n  }\n  const prevLastDrag = prevProps !== null ? prevProps.lastDrag : null;\n  const nextLastDrag = nextProps.lastDrag;\n  return nextLastDrag !== null && (prevLastDrag === null || prevLastDrag.end.time !== nextLastDrag.end.time);\n}\n","/* eslint-disable header/header, @typescript-eslint/explicit-module-boundary-types, prefer-destructuring, no-restricted-syntax, no-self-compare */\n\n/**\n * @notice\n * This product includes code that is adapted from fast-deep-equal@3.1.1,\n * which is available under a \"MIT\" license.\n *\n * MIT License\n *\n * Copyright (c) 2017 Evgeny Poberezkin\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\n/**\n * Deep object equality (i.e. ==)\n *\n * partial - returns true if partial b matches a\n * @internal\n */\nexport function deepEqual(a: any, b: any, partial = false): boolean {\n  if (a === b) return true;\n\n  if (a && b && typeof a === 'object' && typeof b === 'object') {\n    if (a.constructor !== b.constructor) return false;\n\n    let length: number;\n    let i: any;\n\n    if (Array.isArray(a)) {\n      length = a.length;\n      if (length !== b.length) return false;\n      for (i = length; i-- !== 0; ) if (!deepEqual(a[i], b[i])) return false;\n      return true;\n    }\n    if (a instanceof Map && b instanceof Map) {\n      if (a.size !== b.size) return false;\n      // @ts-ignore - 3rd party code\n      for (i of a.entries()) if (!b.has(i[0])) return false;\n      // @ts-ignore - 3rd party code\n      for (i of a.entries()) if (!deepEqual(i[1], b.get(i[0]))) return false;\n      return true;\n    }\n\n    if (a instanceof Set && b instanceof Set) {\n      if (a.size !== b.size) return false;\n      // @ts-ignore - 3rd party code\n      for (i of a.entries()) if (!b.has(i[0])) return false;\n      return true;\n    }\n\n    if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;\n    if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();\n    if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();\n\n    const keys = Object.keys(a);\n    length = keys.length;\n    if (length !== Object.keys(b).length && !partial) return false;\n\n    for (i = length; i-- !== 0; ) if (!Object.prototype.hasOwnProperty.call(b, keys[i] ?? '')) return false;\n\n    for (i = length; i-- !== 0; ) {\n      const key = keys[i];\n      if (!key || (key === '_owner' && a.$$typeof)) {\n        // React-specific: avoid traversing React elements' _owner.\n        //  _owner contains circular references\n        // and is not needed when comparing the actual elements (and not their owners)\n        continue;\n      }\n      if (!deepEqual(a[key], b[key])) return false;\n    }\n\n    return true;\n  }\n\n  // true if both NaN, false otherwise\n  return a !== a && b !== b;\n}\n\n/* eslint-enable */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { $Values } from 'utility-types';\n\nimport { Dimensions } from './dimensions';\nimport { BarSeriesStyle, PointStyle, PointShape, LineSeriesStyle, AreaSeriesStyle } from './themes/theme';\nimport { XYChartSeriesIdentifier } from '../chart_types/xy_chart/utils/series';\nimport { LabelOverflowConstraint } from '../chart_types/xy_chart/utils/specs';\nimport { Color } from '../common/colors';\nimport { Fill, Stroke } from '../geoms/types';\n\n/**\n * The accessor type\n * @public\n */\nexport const BandedAccessorType = Object.freeze({\n  Y0: 'y0' as const,\n  Y1: 'y1' as const,\n});\n\n/** @public */\nexport type BandedAccessorType = $Values<typeof BandedAccessorType>;\n\n/** @public */\nexport interface GeometryValue {\n  y: any;\n  x: any;\n  mark: number | null;\n  accessor: BandedAccessorType;\n  /**\n   * The original datum used for this geometry\n   */\n  datum: any;\n}\n\n/** @internal */\nexport type IndexedGeometry = PointGeometry | BarGeometry;\n\n/**\n * Array of **range** clippings [x1, x2] to be excluded during rendering\n *\n * Note: Must be scaled **range** values (i.e. pixel coordinates) **NOT** domain values\n * @internal\n */\nexport type ClippedRanges = [number, number][];\n\n/** @internal */\nexport interface PointGeometry {\n  seriesIdentifier: XYChartSeriesIdentifier;\n  x: number;\n  y: number;\n  radius: number;\n  color: Color;\n  transform: {\n    x: number;\n    y: number;\n  };\n  value: GeometryValue;\n  style: PointGeometryStyle;\n  panel: Dimensions;\n  isolated: boolean;\n}\n/** @internal */\nexport interface PointGeometryStyle {\n  fill: Fill;\n  stroke: Stroke;\n  shape: PointShape;\n}\n\n/** @internal */\nexport interface PerPanel<T> {\n  panel: Dimensions;\n  value: T;\n}\n\n/** @internal */\nexport interface BarGeometry {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  transform: {\n    x: number;\n    y: number;\n    rotation?: number;\n  };\n  color: Color;\n  displayValue?: {\n    fontScale: number;\n    fontSize: number;\n    text: any;\n    width: number;\n    height: number;\n    overflowConstraints: Set<LabelOverflowConstraint>;\n  };\n  seriesIdentifier: XYChartSeriesIdentifier;\n  value: GeometryValue;\n  seriesStyle: BarSeriesStyle;\n  panel: Dimensions;\n}\n\n/** @internal */\nexport interface LineGeometry {\n  line: string;\n  points: PointGeometry[];\n  color: Color;\n  transform: {\n    x: number;\n    y: number;\n  };\n  seriesIdentifier: XYChartSeriesIdentifier;\n  style: LineSeriesStyle;\n  /**\n   * Ranges of `[x0, x1]` pairs to clip from series\n   */\n  clippedRanges: ClippedRanges;\n  shouldClip: boolean;\n}\n\n/** @internal */\nexport interface AreaGeometry {\n  area: string;\n  lines: string[];\n  points: PointGeometry[];\n  color: Color;\n  transform: {\n    x: number;\n    y: number;\n  };\n  seriesIdentifier: XYChartSeriesIdentifier;\n  style: AreaSeriesStyle;\n  isStacked: boolean;\n  /**\n   * Ranges of `[x0, x1]` pairs to clip from series\n   */\n  clippedRanges: ClippedRanges;\n  shouldClip: boolean;\n}\n\n/** @internal */\nexport interface BubbleGeometry {\n  points: PointGeometry[];\n  color: Color;\n  seriesIdentifier: XYChartSeriesIdentifier;\n  seriesPointStyle: PointStyle;\n}\n\n/** @internal */\nexport function isPointGeometry(ig: IndexedGeometry): ig is PointGeometry {\n  return ig.hasOwnProperty('radius');\n}\n\n/** @internal */\nexport function isBarGeometry(ig: IndexedGeometry): ig is BarGeometry {\n  return ig.hasOwnProperty('width') && ig.hasOwnProperty('height');\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @public */\nexport type GroupId = string;\n/** @public */\nexport type AxisId = string;\n/** @public */\nexport type SpecId = string;\n/** @public */\nexport type AnnotationId = string;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LayoutDirection } from './common';\nimport { LegendPositionConfig } from '../specs/settings';\n\n/** @internal */\nexport const isHorizontalLegend = (legendPosition: LegendPositionConfig) =>\n  legendPosition.direction === LayoutDirection.Horizontal;\n\n/** @internal */\nexport const isHierarchicalLegend = (flatLegend: boolean | undefined, legendPosition: LegendPositionConfig) =>\n  !flatLegend && !isHorizontalLegend(legendPosition);\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/* eslint-disable no-console */\n\n/**\n * Helper class to assist with logging warnings\n *\n * @internal\n * @todo Add more helpful messages in dev for configuration errors\n */\nexport class Logger {\n  static namespace = '[@elastic/charts]';\n\n  /**\n   * Log warning to console\n   *\n   * @param message\n   * @param optionalParams\n   */\n  static warn(message?: unknown, ...optionalParams: unknown[]) {\n    if (Logger.isDevelopment() && !Logger.isTest()) {\n      console.warn(`${Logger.namespace} ${message}`, ...optionalParams);\n    }\n  }\n\n  /**\n   * Log expected value warning to console\n   */\n  static expected(message: unknown, expected: unknown, received: unknown) {\n    if (Logger.isDevelopment() && !Logger.isTest()) {\n      console.warn(\n        `${Logger.namespace} ${message}`,\n        `\\n\n  Expected: ${expected}\n  Received: ${received}\n`,\n      );\n    }\n  }\n\n  /**\n   * Log error to console\n   *\n   * @param message\n   * @param optionalParams\n   */\n  static error(message?: unknown, ...optionalParams: unknown[]) {\n    if (Logger.isDevelopment() && !Logger.isTest()) {\n      console.error(`${Logger.namespace} ${message}`, ...optionalParams);\n    }\n  }\n\n  /**\n   * Determined development env\n   *\n   * @todo confirm this logic works\n   * @todo add more robust logic\n   */\n  private static isDevelopment(): boolean {\n    return process.env.NODE_ENV !== 'production';\n  }\n\n  /**\n   * Determined development env\n   *\n   * @todo confirm this logic works\n   * @todo add more robust logic\n   */\n  private static isTest(): boolean {\n    return process.env.NODE_ENV === 'test';\n  }\n}\n\n/* eslint-enable */\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @public */\nexport interface Point {\n  x: number;\n  y: number;\n}\n\n/** @internal * */\nexport function getDelta(start: Point, end: Point) {\n  return Math.sqrt(Math.pow(end.x - start.x, 2) + Math.pow(end.y - start.y, 2));\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SeriesIdentifier } from '../common/series_id';\n\n/**\n * A compare function used to determine the order of the elements. It is expected to return\n * a negative value if first argument is less than second argument, zero if they're equal and a positive\n * value otherwise.\n * @public\n */\nexport type SeriesCompareFn = (siA: SeriesIdentifier, siB: SeriesIdentifier) => number;\n\nconst DEFAULT_SORTING_FN = () => 0; // this should cause no reorder, as [].sort is now a stable sort in browsers\n\n/** @internal */\nexport const getRenderingCompareFn = (defaultSortFn: SeriesCompareFn = DEFAULT_SORTING_FN) => defaultSortFn;\n\n/** @internal */\nexport const getLegendCompareFn = (defaultSortFn: SeriesCompareFn = DEFAULT_SORTING_FN) => defaultSortFn;\n\n/** @internal */\nexport const getTooltipCompareFn = (defaultSortFn: SeriesCompareFn = DEFAULT_SORTING_FN) => defaultSortFn;\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Font } from '../../common/text_utils';\nimport { monotonicHillClimb } from '../../solvers/monotonic_hill_climb';\nimport { TextMeasure } from '../bbox/canvas_text_bbox_calculator';\n\nconst ELLIPSIS = '…';\n\ninterface WrapTextLines extends Array<string> {\n  meta: {\n    truncated: boolean;\n  };\n}\n\n/** @internal */\nexport function wrapText(\n  text: string,\n  font: Font,\n  fontSize: number,\n  maxLineWidth: number,\n  maxLines: number,\n  measure: TextMeasure,\n  locale: string,\n): WrapTextLines {\n  const lines: WrapTextLines = [] as any;\n  lines.meta = {\n    truncated: false,\n  };\n\n  if (maxLines <= 0) {\n    return lines;\n  }\n  const segmenter = textSegmenter(locale);\n  // remove new lines and multi-spaces.\n  const cleanedText = text.replaceAll('\\n', ' ').replaceAll(/ +(?= )/g, '');\n\n  const segments = Array.from(segmenter(cleanedText)).map((d) => ({\n    ...d,\n    width: measure(d.segment, font, fontSize).width,\n  }));\n\n  const ellipsisWidth = measure(ELLIPSIS, font, fontSize).width;\n  let currentLineWidth = 0;\n  for (const segment of segments) {\n    // the word is longer then the available space and is not a space\n    if (currentLineWidth + segment.width > maxLineWidth && segment.segment.trimStart().length > 0) {\n      // TODO call breakLongTextIntoLines with the remaining lines\n      const multilineText = breakLongTextIntoLines(segment.segment, font, fontSize, maxLineWidth, Infinity, measure);\n      // required to break the loop when a word can't fit into the next line. In this case, we don't want to skip that\n      // long word, but we want to interrupt the loop\n      if (multilineText.length === 0) {\n        break;\n      }\n      lines.push(...multilineText);\n      currentLineWidth = multilineText.length > 0 ? measure(multilineText.at(-1) ?? '', font, fontSize).width : 0;\n    } else {\n      const lineIndex = lines.length > 0 ? lines.length - 1 : 0;\n      lines[lineIndex] = (lines[lineIndex] ?? '') + segment.segment;\n      currentLineWidth += segment.width;\n    }\n  }\n  if (lines.length > maxLines) {\n    lines.meta.truncated = true;\n    const lastLineMaxLineWidth = maxLineWidth - ellipsisWidth;\n    const lastLine = clipTextToWidth(lines[maxLines - 1] ?? '', font, fontSize, lastLineMaxLineWidth, measure);\n    if (lastLine.length > 0) {\n      lines.splice(maxLines - 1, Infinity, `${lastLine}${ELLIPSIS}`);\n    } else {\n      if (lastLineMaxLineWidth > 0) {\n        lines.splice(maxLines - 1, Infinity, ELLIPSIS);\n      } else {\n        lines.splice(maxLines, Infinity);\n      }\n    }\n  }\n  return lines;\n}\n\nfunction textSegmenter(locale: string): (text: string) => { segment: string; index: number; isWordLike?: boolean }[] {\n  if ('Segmenter' in Intl) {\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    //@ts-ignore\n    const fn = new Intl.Segmenter(locale, { granularity: 'word' });\n    return (text: string) => Array.from(fn.segment(text));\n  } else {\n    return (text: string) => {\n      return text\n        .split(' ')\n        .reduce<{ segment: string; index: number; isWordLike?: boolean }[]>((acc, segment, index, array) => {\n          const currentSegment = {\n            segment,\n            index: index === 0 ? 0 : (acc.at(-1)?.index ?? 0) + 1,\n            isWordLike: true,\n          };\n          acc.push(currentSegment);\n          // adding space to simulate the same behaviour of the segmenter in firefox\n          if (index < array.length - 1) {\n            acc.push({ segment: ' ', index: currentSegment.index + segment.length, isWordLike: false });\n          }\n          return acc;\n        }, []);\n    };\n  }\n}\n\nfunction breakLongTextIntoLines(\n  text: string,\n  font: Font,\n  fontSize: number,\n  lineWidth: number,\n  maxLines: number,\n  measure: TextMeasure,\n) {\n  const lines: string[] = [];\n  let remainingText = text;\n  while (maxLines > lines.length && remainingText.length > 0) {\n    const lineClippedText = clipTextToWidth(remainingText, font, fontSize, lineWidth, measure);\n    if (lineClippedText.length === 0) {\n      break;\n    } else {\n      lines.push(lineClippedText.trimStart());\n      remainingText = remainingText.slice(lineClippedText.length, Infinity);\n    }\n  }\n  return lines;\n}\n\nfunction clipTextToWidth(text: string, font: Font, fontSize: number, width: number, measure: TextMeasure): string {\n  const maxCharsInLine = monotonicHillClimb(\n    (chars) => measure(text.slice(0, chars), font, fontSize).width,\n    text.length,\n    width,\n    (n: number) => Math.floor(n),\n    0,\n  );\n  return text.slice(0, maxCharsInLine || 0);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { ChartBaseColors } from './theme';\n\n/** @public */\nexport const LIGHT_BASE_COLORS: ChartBaseColors = {\n  emptyShade: '#FFF',\n  lightestShade: '#F1F4FA',\n  lightShade: '#D3DAE6',\n  mediumShade: '#98A2B3',\n  darkShade: '#69707D',\n  darkestShade: '#343741',\n  title: '#1A1C21',\n};\n\n/** @public */\nexport const DARK_BASE_COLORS: ChartBaseColors = {\n  emptyShade: '#1D1E24',\n  lightestShade: '#25262E',\n  lightShade: '#343741',\n  mediumShade: '#535966',\n  darkShade: '#98A2B3',\n  darkestShade: '#D4DAE5',\n  title: '#DFE5EF',\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n/** @internal */\nexport interface ColorScales {\n  [key: string]: string;\n}\n\ninterface EchPalette {\n  colors: string[];\n}\n\nconst echPaletteColorBlind: EchPalette = {\n  colors: [\n    '#54B399',\n    '#6092C0',\n    '#9170B8',\n    '#CA8EAE',\n    '#D36086',\n    '#E7664C',\n    '#AA6556',\n    '#DA8B45',\n    '#B9A888',\n    '#D6BF57',\n  ],\n  // TODO swap colors for original colors after main changes\n  // colors: [\n  //   '#54B399',\n  //   '#6092C0',\n  //   '#D36086',\n  //   '#9170B8',\n  //   '#CA8EAE',\n  //   '#D6BF57',\n  //   '#B9A888',\n  //   '#DA8B45',\n  //   '#AA6556',\n  //   '#E7664C',\n  // ],\n};\n\nconst echPaletteForLightBackground: EchPalette = {\n  colors: ['#006BB4', '#017D73', '#F5A700', '#BD271E', '#DD0A73'],\n};\n\nconst echPaletteForDarkBackground: EchPalette = {\n  colors: ['#1BA9F5', '#7DE2D1', '#F990C0', '#F66', '#FFCE7A'],\n};\n\nconst echPaletteForStatus: EchPalette = {\n  colors: [\n    '#209280',\n    '#359F8A',\n    '#4AAC94',\n    '#6EB58C',\n    '#A2BA71',\n    '#DD9B53',\n    '#E4784E',\n    '#E2634A',\n    '#D75C46',\n    '#CC5642',\n  ],\n};\n\n/** @internal */\nexport const palettes = {\n  echPaletteColorBlind,\n  echPaletteForLightBackground,\n  echPaletteForDarkBackground,\n  echPaletteForStatus,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DARK_BASE_COLORS } from './base_colors';\nimport { palettes } from './colors';\nimport { Theme } from './theme';\nimport { DEFAULT_CHART_MARGINS, DEFAULT_CHART_PADDING, DEFAULT_GEOMETRY_STYLES } from './theme_common';\nimport { DARK_THEME_BULLET_STYLE } from '../../chart_types/bullet_graph/theme';\nimport { Colors } from '../../common/colors';\nimport { TAU } from '../../common/constants';\nimport { DEFAULT_FONT_FAMILY } from '../../common/default_theme_attributes';\nimport { ColorVariant } from '../common';\n\n/** @public */\nexport const DARK_THEME: Theme = {\n  chartPaddings: DEFAULT_CHART_PADDING,\n  chartMargins: DEFAULT_CHART_MARGINS,\n  lineSeriesStyle: {\n    line: {\n      visible: true,\n      strokeWidth: 2,\n      opacity: 1,\n    },\n    point: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 2,\n      fill: DARK_BASE_COLORS.emptyShade,\n      radius: 3,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n    },\n  },\n  bubbleSeriesStyle: {\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n  },\n  areaSeriesStyle: {\n    area: {\n      visible: true,\n      opacity: 0.3,\n    },\n    line: {\n      visible: true,\n      strokeWidth: 2,\n      opacity: 1,\n    },\n    point: {\n      visible: false,\n      stroke: ColorVariant.Series,\n      strokeWidth: 2,\n      fill: DARK_BASE_COLORS.emptyShade,\n      radius: 3,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n      area: {\n        visible: true,\n        opacity: 0.15,\n        fill: ColorVariant.Series,\n      },\n    },\n  },\n  barSeriesStyle: {\n    rect: {\n      opacity: 1,\n    },\n    rectBorder: {\n      visible: false,\n      strokeWidth: 1,\n    },\n    displayValue: {\n      fontSize: 10,\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      alignment: { horizontal: 'center', vertical: 'middle' },\n      padding: 0,\n      fill: { textBorder: 0 },\n      offsetX: 0,\n      offsetY: 0,\n    },\n  },\n  arcSeriesStyle: {\n    arc: {\n      visible: true,\n      stroke: 'white',\n      strokeWidth: 1,\n      opacity: 1,\n    },\n  },\n  sharedStyle: DEFAULT_GEOMETRY_STYLES,\n  scales: {\n    barsPadding: 0.25,\n    histogramPadding: 0.05,\n  },\n  axes: {\n    axisTitle: {\n      fontSize: 12,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      padding: {\n        inner: 10,\n        outer: 0,\n      },\n      fill: DARK_BASE_COLORS.title,\n      visible: true,\n    },\n    axisPanelTitle: {\n      fontSize: 10,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#D4D4D4',\n      visible: true,\n    },\n    axisLine: {\n      visible: true,\n      stroke: DARK_BASE_COLORS.lightShade,\n      strokeWidth: 1,\n    },\n    tickLabel: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fontStyle: 'normal',\n      fill: '#81858f',\n      padding: { outer: 8, inner: 10 },\n      rotation: 0,\n      offset: {\n        x: 0,\n        y: 0,\n        reference: 'local',\n      },\n      alignment: {\n        vertical: 'near',\n        horizontal: 'near',\n      },\n    },\n    tickLine: {\n      visible: false,\n      stroke: DARK_BASE_COLORS.lightShade,\n      strokeWidth: 1,\n      size: 10,\n      padding: 10,\n    },\n    gridLine: {\n      horizontal: {\n        visible: true,\n        stroke: DARK_BASE_COLORS.lightShade,\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      vertical: {\n        visible: true,\n        stroke: DARK_BASE_COLORS.lightShade,\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [4, 4],\n      },\n      lumaSteps: [63, 103, 159, 191, 223, 255, 255, 255, 255, 255, 255, 255, 255, 255, 255, 255],\n    },\n  },\n  colors: {\n    vizColors: palettes.echPaletteColorBlind.colors,\n    defaultVizColor: '#6092C0',\n  },\n  legend: {\n    verticalWidth: 200,\n    horizontalHeight: 64,\n    spacingBuffer: 10,\n    margin: 0,\n    labelOptions: {\n      maxLines: 1,\n    },\n  },\n  crosshair: {\n    band: {\n      visible: true,\n      fill: '#2a2b33', // DARK_BASE_COLORS.lightestShade,\n    },\n    line: {\n      visible: true,\n      stroke: DARK_BASE_COLORS.darkShade,\n      strokeWidth: 1,\n      dash: [4, 4],\n    },\n    crossLine: {\n      visible: true,\n      stroke: DARK_BASE_COLORS.darkShade,\n      strokeWidth: 1,\n      dash: [4, 4],\n    },\n  },\n  background: {\n    color: DARK_BASE_COLORS.emptyShade,\n    fallbackColor: DARK_BASE_COLORS.emptyShade,\n  },\n  goal: {\n    minFontSize: 8,\n    maxFontSize: 64,\n    maxCircularSize: 360,\n    maxBulletSize: 500,\n    barThicknessMinSizeRatio: 1 / 10,\n    baselineArcThickness: 32,\n    baselineBarThickness: 32,\n    marginRatio: 0.05,\n    maxTickFontSize: 24,\n    maxLabelFontSize: 32,\n    maxCentralFontSize: 38,\n    arcBoxSamplePitch: (5 / 360) * TAU,\n    capturePad: 16,\n    tickLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#81858f',\n    },\n    majorLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: DARK_BASE_COLORS.title,\n    },\n    minorLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#81858f',\n    },\n    majorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: DARK_BASE_COLORS.title,\n    },\n    minorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#81858f',\n    },\n    targetLine: {\n      stroke: '#D4DAE5',\n    },\n    tickLine: {\n      stroke: DARK_BASE_COLORS.mediumShade,\n    },\n    progressLine: {\n      stroke: '#D4DAE5',\n    },\n  },\n  partition: {\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    fontFamily: DEFAULT_FONT_FAMILY,\n    minFontSize: 8,\n    maxFontSize: 64,\n    idealFontSizeJump: 1.05,\n    maximizeFontSize: false,\n    circlePadding: 4,\n    radialPadding: TAU / 360,\n    horizontalTextAngleThreshold: TAU / 12,\n    horizontalTextEnforcer: 1,\n    fillLabel: {\n      textColor: ColorVariant.Adaptive,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      valueFont: {\n        fontWeight: 700,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n      padding: 2,\n      clipText: false,\n    },\n    linkLabel: {\n      maximumSection: 10,\n      fontFamily: 'Sans-Serif',\n      fontSize: 11,\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      gap: 10,\n      spacing: 2,\n      horizontalStemLength: 10,\n      radiusPadding: 10,\n      lineWidth: 1,\n      maxCount: 5,\n      maxTextLength: 100,\n      textColor: DARK_BASE_COLORS.title,\n      minimumStemLength: 0,\n      stemAngle: TAU / 8,\n      padding: 0,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n    },\n    sectorLineWidth: 1.5,\n    sectorLineStroke: DARK_BASE_COLORS.emptyShade,\n  },\n  heatmap: {\n    brushArea: {\n      visible: true,\n      stroke: '#D3DAE6', // DARK_BASE_COLORS.darkestShade,\n      strokeWidth: 2,\n    },\n    brushMask: {\n      visible: true,\n      fill: '#8c8c8c80',\n    },\n    brushTool: {\n      visible: false,\n      fill: 'snow',\n    },\n\n    xAxisLabel: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fontStyle: 'normal',\n      textColor: Colors.White.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n      rotation: 0,\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      fontSize: 12,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fontStyle: 'normal',\n      textColor: Colors.White.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n    },\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'snow',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 'fill',\n      align: 'center',\n      label: {\n        visible: true,\n        maxWidth: 'fill',\n        minFontSize: 8,\n        maxFontSize: 12,\n        fontFamily: DEFAULT_FONT_FAMILY,\n        fontStyle: 'normal',\n        textColor: Colors.White.keyword,\n        fontVariant: 'normal',\n        fontWeight: 'normal',\n        useGlobalMinFontSize: true,\n      },\n      border: {\n        strokeWidth: 1,\n        stroke: 'snow',\n      },\n    },\n  },\n  metric: {\n    text: {\n      lightColor: '#E0E5EE', //DARK_BASE_COLORS.title,\n      darkColor: DARK_BASE_COLORS.lightShade,\n    },\n    border: DARK_BASE_COLORS.lightShade,\n    barBackground: DARK_BASE_COLORS.lightShade,\n    emptyBackground: Colors.Transparent.keyword,\n    nonFiniteText: 'N/A',\n    minHeight: 64,\n  },\n  bulletGraph: DARK_THEME_BULLET_STYLE,\n  tooltip: {\n    maxWidth: 500,\n    maxTableHeight: 120,\n    defaultDotColor: Colors.White.keyword,\n  },\n  // TODO map colors to base color mappings\n  flamegraph: {\n    navigation: {\n      textColor: DARK_BASE_COLORS.title,\n      buttonTextColor: '#36A2EF',\n      buttonDisabledTextColor: '#515761',\n      buttonBackgroundColor: '#36A2EF33',\n      buttonDisabledBackgroundColor: '#34374126',\n    },\n    scrollbarThumb: DARK_BASE_COLORS.title,\n    scrollbarTrack: DARK_BASE_COLORS.lightShade,\n  },\n  highlighter: {\n    point: {\n      opacity: 1,\n      fill: ColorVariant.None,\n      stroke: ColorVariant.Series,\n      strokeWidth: 4,\n      radius: 10,\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { palettes } from './colors';\nimport { Theme } from './theme';\nimport {\n  DEFAULT_GEOMETRY_STYLES,\n  DEFAULT_MISSING_COLOR,\n  LEGACY_CHART_MARGINS,\n  LEGACY_CHART_PADDING,\n} from './theme_common';\nimport { DARK_THEME_BULLET_STYLE } from '../../chart_types/bullet_graph/theme';\nimport { Colors } from '../../common/colors';\nimport { GOLDEN_RATIO, TAU } from '../../common/constants';\nimport { ColorVariant } from '../common';\n\n/**\n * Legacy dark chart theme to be removed at some point\n *\n * @public\n * @deprecated Use new `DARK_THEME`\n */\nexport const LEGACY_DARK_THEME: Theme = {\n  chartPaddings: LEGACY_CHART_PADDING,\n  chartMargins: LEGACY_CHART_MARGINS,\n  lineSeriesStyle: {\n    line: {\n      visible: true,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n    point: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n    },\n  },\n  bubbleSeriesStyle: {\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n  },\n  areaSeriesStyle: {\n    area: {\n      visible: true,\n      opacity: 0.3,\n    },\n    line: {\n      visible: true,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n    point: {\n      visible: false,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.Black.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n      area: {\n        visible: true,\n        opacity: 0.15,\n        fill: ColorVariant.Series,\n      },\n    },\n  },\n  barSeriesStyle: {\n    rect: {\n      opacity: 1,\n    },\n    rectBorder: {\n      visible: false,\n      strokeWidth: 1,\n    },\n    displayValue: {\n      fontSize: 8,\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      padding: 0,\n      fill: '#999',\n      offsetX: 0,\n      offsetY: 0,\n    },\n  },\n  arcSeriesStyle: {\n    arc: {\n      visible: true,\n      stroke: 'white',\n      strokeWidth: 1,\n      opacity: 1,\n    },\n  },\n  sharedStyle: DEFAULT_GEOMETRY_STYLES,\n  scales: {\n    barsPadding: 0.25,\n    histogramPadding: 0.05,\n  },\n  axes: {\n    axisTitle: {\n      fontSize: 12,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#D4D4D4',\n      visible: true,\n    },\n    axisPanelTitle: {\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#D4D4D4',\n      visible: true,\n    },\n    axisLine: {\n      visible: true,\n      stroke: '#444',\n      strokeWidth: 1,\n    },\n    tickLabel: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      fontStyle: 'normal',\n      fill: '#999',\n      padding: 0,\n      rotation: 0,\n      offset: {\n        x: 0,\n        y: 0,\n        reference: 'local',\n      },\n      alignment: {\n        vertical: 'near',\n        horizontal: 'near',\n      },\n    },\n    tickLine: {\n      visible: true,\n      stroke: '#444',\n      strokeWidth: 1,\n      size: 10,\n      padding: 10,\n    },\n    gridLine: {\n      horizontal: {\n        visible: false,\n        stroke: '#D3DAE6',\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      vertical: {\n        visible: false,\n        stroke: '#D3DAE6',\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      lumaSteps: [63, 103, 159, 191, 223, 255, 255, 255, 255, 255, 255, 255, 255, 255, 255, 255],\n    },\n  },\n  colors: {\n    vizColors: palettes.echPaletteColorBlind.colors,\n    defaultVizColor: DEFAULT_MISSING_COLOR,\n  },\n  legend: {\n    verticalWidth: 200,\n    horizontalHeight: 64,\n    spacingBuffer: 10,\n    margin: 0,\n    labelOptions: {\n      maxLines: 1,\n    },\n  },\n  crosshair: {\n    band: {\n      fill: '#2A2A2A',\n      visible: true,\n    },\n    line: {\n      stroke: '#999',\n      strokeWidth: 1,\n      visible: true,\n    },\n    crossLine: {\n      stroke: '#999',\n      strokeWidth: 1,\n      dash: [5, 5],\n      visible: true,\n    },\n  },\n  background: {\n    color: 'transparent',\n    fallbackColor: Colors.Black.keyword,\n  },\n  goal: {\n    minFontSize: 8,\n    maxFontSize: 64,\n    maxCircularSize: 360,\n    maxBulletSize: 500,\n    barThicknessMinSizeRatio: 1 / 10,\n    baselineArcThickness: 32,\n    baselineBarThickness: 32,\n    marginRatio: 0.05,\n    maxTickFontSize: 24,\n    maxLabelFontSize: 32,\n    maxCentralFontSize: 38,\n    arcBoxSamplePitch: (5 / 360) * TAU,\n    capturePad: 16,\n    tickLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    majorLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    minorLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    majorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    minorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: 'white',\n    },\n    targetLine: {\n      stroke: 'white',\n    },\n    tickLine: {\n      stroke: 'snow',\n    },\n    progressLine: {\n      stroke: 'white',\n    },\n  },\n  partition: {\n    outerSizeRatio: 1 / GOLDEN_RATIO,\n    emptySizeRatio: 0,\n    fontFamily: 'Sans-Serif',\n    minFontSize: 8,\n    maxFontSize: 64,\n    idealFontSizeJump: 1.05,\n    maximizeFontSize: false,\n    circlePadding: 2,\n    radialPadding: TAU / 360,\n    horizontalTextAngleThreshold: TAU / 12,\n    horizontalTextEnforcer: 1,\n    fillLabel: {\n      textColor: ColorVariant.Adaptive,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n      padding: 2,\n      clipText: false,\n    },\n    linkLabel: {\n      maximumSection: 10,\n      fontFamily: 'Sans-Serif',\n      fontSize: 12,\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      gap: 10,\n      spacing: 2,\n      horizontalStemLength: 10,\n      radiusPadding: 10,\n      lineWidth: 1,\n      maxCount: 36,\n      maxTextLength: 100,\n      textColor: ColorVariant.Adaptive,\n      minimumStemLength: 0,\n      stemAngle: TAU / 8,\n      padding: 0,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n    },\n    sectorLineWidth: 1,\n    sectorLineStroke: Colors.Black.keyword,\n  },\n  heatmap: {\n    brushArea: {\n      visible: true,\n      stroke: '#D3DAE6', // euiColorLightShade,\n      strokeWidth: 2,\n    },\n    brushMask: {\n      visible: true,\n      fill: '#8c8c8c80',\n    },\n    brushTool: {\n      visible: false,\n      fill: 'snow',\n    },\n\n    xAxisLabel: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.White.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n      rotation: 0,\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.White.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n    },\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'snow',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 'fill',\n      align: 'center',\n      label: {\n        visible: true,\n        maxWidth: 'fill',\n        minFontSize: 8,\n        maxFontSize: 12,\n        fontFamily: 'Sans-Serif',\n        fontStyle: 'normal',\n        textColor: Colors.White.keyword,\n        fontVariant: 'normal',\n        fontWeight: 'normal',\n        useGlobalMinFontSize: true,\n      },\n      border: {\n        strokeWidth: 1,\n        stroke: 'snow',\n      },\n    },\n  },\n  metric: {\n    text: {\n      lightColor: '#E0E5EE',\n      darkColor: '#343741',\n    },\n    border: '#343741',\n    barBackground: '#343741',\n    emptyBackground: Colors.Transparent.keyword,\n    nonFiniteText: 'N/A',\n    minHeight: 64,\n  },\n  bulletGraph: DARK_THEME_BULLET_STYLE,\n  tooltip: {\n    maxWidth: 500,\n    maxTableHeight: 120,\n    defaultDotColor: Colors.White.keyword,\n  },\n  flamegraph: {\n    navigation: {\n      textColor: 'rgb(223, 229, 239)',\n      buttonTextColor: 'rgb(54, 162, 239)',\n      buttonDisabledTextColor: 'rgb(81, 87, 97)',\n      buttonBackgroundColor: '#36a2ef33',\n      buttonDisabledBackgroundColor: 'rgba(52, 55, 65, 0.15)',\n    },\n    scrollbarThumb: 'rgb(223, 229, 239)',\n    scrollbarTrack: 'rgb(52, 55, 65)',\n  },\n  highlighter: {\n    point: {\n      opacity: 1,\n      fill: ColorVariant.None,\n      stroke: ColorVariant.Series,\n      strokeWidth: 4,\n      radius: 10,\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { palettes } from './colors';\nimport { Theme } from './theme';\nimport {\n  DEFAULT_GEOMETRY_STYLES,\n  DEFAULT_MISSING_COLOR,\n  LEGACY_CHART_MARGINS,\n  LEGACY_CHART_PADDING,\n} from './theme_common';\nimport { LIGHT_THEME_BULLET_STYLE } from '../../chart_types/bullet_graph/theme';\nimport { Colors } from '../../common/colors';\nimport { GOLDEN_RATIO, TAU } from '../../common/constants';\nimport { ColorVariant } from '../common';\n\n/**\n * Legacy light chart theme to be removed at some point\n *\n * @public\n * @deprecated use new `LIGHT_THEME`\n */\nexport const LEGACY_LIGHT_THEME: Theme = {\n  chartPaddings: LEGACY_CHART_PADDING,\n  chartMargins: LEGACY_CHART_MARGINS,\n  lineSeriesStyle: {\n    line: {\n      visible: true,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      stroke: ColorVariant.Series,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        opacity: 1,\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n      },\n    },\n  },\n  bubbleSeriesStyle: {\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n  },\n  areaSeriesStyle: {\n    area: {\n      visible: true,\n      opacity: 0.3,\n    },\n    line: {\n      visible: true,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n    point: {\n      visible: false,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n      area: {\n        visible: true,\n        opacity: 0.15,\n        fill: ColorVariant.Series,\n      },\n    },\n  },\n  barSeriesStyle: {\n    rect: {\n      opacity: 1,\n    },\n    rectBorder: {\n      visible: false,\n      strokeWidth: 1,\n    },\n    displayValue: {\n      fontSize: 8,\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      padding: 0,\n      fill: '#777',\n      offsetX: 0,\n      offsetY: 0,\n    },\n  },\n  arcSeriesStyle: {\n    arc: {\n      visible: true,\n      stroke: Colors.Black.keyword,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n  },\n  sharedStyle: DEFAULT_GEOMETRY_STYLES,\n  scales: {\n    barsPadding: 0.25,\n    histogramPadding: 0.05,\n  },\n  axes: {\n    axisTitle: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#333',\n    },\n    axisPanelTitle: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#333',\n    },\n    axisLine: {\n      visible: true,\n      stroke: '#eaeaea',\n      strokeWidth: 1,\n    },\n    tickLabel: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      fontStyle: 'normal',\n      fill: '#777',\n      padding: 0,\n      rotation: 0,\n      offset: {\n        x: 0,\n        y: 0,\n        reference: 'local',\n      },\n      alignment: {\n        vertical: 'near',\n        horizontal: 'near',\n      },\n    },\n    tickLine: {\n      visible: true,\n      stroke: '#eaeaea',\n      strokeWidth: 1,\n      size: 10,\n      padding: 10,\n    },\n    gridLine: {\n      horizontal: {\n        visible: false,\n        stroke: '#D3DAE6',\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      vertical: {\n        visible: false,\n        stroke: '#D3DAE6',\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      lumaSteps: [224, 184, 128, 96, 64, 32, 16, 8, 4, 2, 1, 0, 0, 0, 0, 0],\n    },\n  },\n  colors: {\n    vizColors: palettes.echPaletteColorBlind.colors,\n    defaultVizColor: DEFAULT_MISSING_COLOR,\n  },\n  legend: {\n    verticalWidth: 200,\n    horizontalHeight: 64,\n    spacingBuffer: 10,\n    margin: 0,\n    labelOptions: {\n      maxLines: 1,\n    },\n  },\n  crosshair: {\n    band: {\n      fill: '#F5F5F5',\n      visible: true,\n    },\n    line: {\n      stroke: '#98A2B3',\n      strokeWidth: 1,\n      visible: true,\n    },\n    crossLine: {\n      stroke: '#98A2B3',\n      strokeWidth: 1,\n      dash: [5, 5],\n      visible: true,\n    },\n  },\n  background: {\n    color: Colors.Transparent.keyword,\n    fallbackColor: Colors.White.keyword,\n  },\n  goal: {\n    minFontSize: 8,\n    maxFontSize: 64,\n    maxCircularSize: 360,\n    maxBulletSize: 500,\n    barThicknessMinSizeRatio: 1 / 10,\n    baselineArcThickness: 32,\n    baselineBarThickness: 32,\n    marginRatio: 0.05,\n    maxTickFontSize: 24,\n    maxLabelFontSize: 32,\n    maxCentralFontSize: 38,\n    arcBoxSamplePitch: (5 / 360) * TAU,\n    capturePad: 16,\n    tickLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    majorLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    minorLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    majorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    minorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: 'sans-serif',\n      fill: Colors.Black.keyword,\n    },\n    targetLine: {\n      stroke: Colors.Black.keyword,\n    },\n    tickLine: {\n      stroke: 'darkgrey',\n    },\n    progressLine: {\n      stroke: Colors.Black.keyword,\n    },\n  },\n  partition: {\n    outerSizeRatio: 1 / GOLDEN_RATIO,\n    emptySizeRatio: 0,\n    fontFamily: 'Sans-Serif',\n    minFontSize: 8,\n    maxFontSize: 64,\n    idealFontSizeJump: 1.05,\n    maximizeFontSize: false,\n    circlePadding: 2,\n    radialPadding: TAU / 360,\n    horizontalTextAngleThreshold: TAU / 12,\n    horizontalTextEnforcer: 1,\n    fillLabel: {\n      textColor: ColorVariant.Adaptive,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n      padding: 2,\n      clipText: false,\n    },\n    linkLabel: {\n      maximumSection: 10,\n      fontFamily: 'Sans-Serif',\n      fontSize: 12,\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      gap: 10,\n      spacing: 2,\n      horizontalStemLength: 10,\n      radiusPadding: 10,\n      lineWidth: 1,\n      maxCount: 36,\n      maxTextLength: 100,\n      textColor: ColorVariant.Adaptive,\n      minimumStemLength: 0,\n      stemAngle: TAU / 8,\n      padding: 0,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n    },\n    sectorLineWidth: 1,\n    sectorLineStroke: 'white',\n  },\n  heatmap: {\n    brushArea: {\n      visible: true,\n      stroke: '#69707D', // euiColorDarkShade,\n      strokeWidth: 2,\n    },\n    brushMask: {\n      visible: true,\n      fill: '#73737380',\n    },\n    brushTool: {\n      visible: false,\n      fill: 'gray',\n    },\n    xAxisLabel: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n      rotation: 0,\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n    },\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'gray',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 'fill',\n      align: 'center',\n      label: {\n        visible: true,\n        maxWidth: 'fill',\n        minFontSize: 8,\n        maxFontSize: 12,\n        fontFamily: 'Sans-Serif',\n        fontStyle: 'normal',\n        textColor: Colors.Black.keyword,\n        fontVariant: 'normal',\n        fontWeight: 'normal',\n        useGlobalMinFontSize: true,\n      },\n      border: {\n        strokeWidth: 1,\n        stroke: 'gray',\n      },\n    },\n  },\n  metric: {\n    text: {\n      lightColor: '#E0E5EE',\n      darkColor: '#343741',\n    },\n    border: '#EDF0F5',\n    barBackground: '#EDF0F5',\n    emptyBackground: Colors.Transparent.keyword,\n    nonFiniteText: 'N/A',\n    minHeight: 64,\n  },\n  bulletGraph: LIGHT_THEME_BULLET_STYLE,\n  tooltip: {\n    maxWidth: 500,\n    maxTableHeight: 120,\n    defaultDotColor: Colors.Black.keyword,\n  },\n  flamegraph: {\n    navigation: {\n      textColor: 'rgb(52, 55, 65)',\n      buttonTextColor: 'rgb(0, 97, 166)',\n      buttonDisabledTextColor: 'rgb(162, 171, 186)',\n      buttonBackgroundColor: 'rgb(204, 228, 245)',\n      buttonDisabledBackgroundColor: 'rgba(211, 218, 230, 0.15)',\n    },\n    scrollbarThumb: 'rgb(52, 55, 65)',\n    scrollbarTrack: 'rgb(211, 218, 230)',\n  },\n  highlighter: {\n    point: {\n      opacity: 1,\n      fill: ColorVariant.None,\n      stroke: ColorVariant.Series,\n      strokeWidth: 4,\n      radius: 10,\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LIGHT_BASE_COLORS } from './base_colors';\nimport { palettes } from './colors';\nimport { Theme } from './theme';\nimport { DEFAULT_CHART_MARGINS, DEFAULT_CHART_PADDING, DEFAULT_GEOMETRY_STYLES } from './theme_common';\nimport { LIGHT_THEME_BULLET_STYLE } from '../../chart_types/bullet_graph/theme';\nimport { Colors } from '../../common/colors';\nimport { TAU } from '../../common/constants';\nimport { DEFAULT_FONT_FAMILY } from '../../common/default_theme_attributes';\nimport { ColorVariant } from '../common';\n\n/** @public */\nexport const LIGHT_THEME: Theme = {\n  chartPaddings: DEFAULT_CHART_PADDING,\n  chartMargins: DEFAULT_CHART_MARGINS,\n  lineSeriesStyle: {\n    line: {\n      visible: true,\n      strokeWidth: 2,\n      opacity: 1,\n    },\n    point: {\n      visible: true,\n      strokeWidth: 2,\n      stroke: ColorVariant.Series,\n      fill: LIGHT_BASE_COLORS.emptyShade,\n      radius: 3,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        opacity: 1,\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n      },\n    },\n  },\n  bubbleSeriesStyle: {\n    point: {\n      visible: true,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n  },\n  areaSeriesStyle: {\n    area: {\n      visible: true,\n      opacity: 0.3,\n    },\n    line: {\n      visible: true,\n      strokeWidth: 2,\n      opacity: 1,\n    },\n    point: {\n      visible: false,\n      stroke: ColorVariant.Series,\n      strokeWidth: 2,\n      fill: LIGHT_BASE_COLORS.emptyShade,\n      radius: 3,\n      opacity: 1,\n    },\n    isolatedPoint: {\n      visible: true,\n      stroke: ColorVariant.Series,\n      strokeWidth: 1,\n      fill: Colors.White.keyword,\n      radius: 2,\n      opacity: 1,\n    },\n    fit: {\n      line: {\n        visible: true,\n        dash: [5, 5],\n        stroke: ColorVariant.Series,\n        opacity: 1,\n      },\n      area: {\n        visible: true,\n        opacity: 0.15,\n        fill: ColorVariant.Series,\n      },\n    },\n  },\n  barSeriesStyle: {\n    rect: {\n      opacity: 1,\n    },\n    rectBorder: {\n      visible: false,\n      strokeWidth: 1,\n    },\n    displayValue: {\n      fontSize: 10,\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      alignment: { horizontal: 'center', vertical: 'middle' },\n      padding: 0,\n      fill: { textBorder: 0 },\n      offsetX: 0,\n      offsetY: 0,\n    },\n  },\n  arcSeriesStyle: {\n    arc: {\n      visible: true,\n      stroke: Colors.Black.keyword,\n      strokeWidth: 1,\n      opacity: 1,\n    },\n  },\n  sharedStyle: DEFAULT_GEOMETRY_STYLES,\n  scales: {\n    barsPadding: 0.25,\n    histogramPadding: 0.05,\n  },\n  axes: {\n    axisTitle: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      padding: {\n        inner: 10,\n        outer: 0,\n      },\n      fill: LIGHT_BASE_COLORS.darkestShade,\n    },\n    axisPanelTitle: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: 'sans-serif',\n      padding: {\n        inner: 8,\n        outer: 0,\n      },\n      fill: '#333', // LIGHT_BASE_COLORS.darkestShade,\n    },\n    axisLine: {\n      visible: true,\n      stroke: '#eaedf3', // LIGHT_BASE_COLORS.lightShade,\n      strokeWidth: 1,\n    },\n    tickLabel: {\n      visible: true,\n      fontSize: 10,\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fontStyle: 'normal',\n      fill: '#646a77', // LIGHT_BASE_COLORS.darkShade,\n      padding: { outer: 8, inner: 10 },\n      rotation: 0,\n      offset: {\n        x: 0,\n        y: 0,\n        reference: 'local',\n      },\n      alignment: {\n        vertical: 'near',\n        horizontal: 'near',\n      },\n    },\n    tickLine: {\n      visible: false,\n      stroke: '#eaedf3', // LIGHT_BASE_COLORS.lightShade,\n      strokeWidth: 1,\n      size: 10,\n      padding: 10,\n    },\n    gridLine: {\n      horizontal: {\n        visible: true,\n        stroke: '#eaedf3', // LIGHT_BASE_COLORS.lightShade,\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [0, 0],\n      },\n      vertical: {\n        visible: true,\n        stroke: '#eaedf3', // LIGHT_BASE_COLORS.lightShade,\n        strokeWidth: 1,\n        opacity: 1,\n        dash: [4, 4],\n      },\n      lumaSteps: [224, 184, 128, 96, 64, 32, 16, 8, 4, 2, 1, 0, 0, 0, 0, 0],\n    },\n  },\n  colors: {\n    vizColors: palettes.echPaletteColorBlind.colors,\n    defaultVizColor: '#6092C0',\n  },\n  legend: {\n    verticalWidth: 200,\n    horizontalHeight: 64,\n    spacingBuffer: 10,\n    margin: 0,\n    labelOptions: {\n      maxLines: 1,\n    },\n  },\n  crosshair: {\n    band: {\n      visible: true,\n      fill: LIGHT_BASE_COLORS.lightestShade,\n    },\n    line: {\n      visible: true,\n      stroke: LIGHT_BASE_COLORS.darkShade,\n      strokeWidth: 1,\n      dash: [4, 4],\n    },\n    crossLine: {\n      visible: true,\n      stroke: LIGHT_BASE_COLORS.darkShade,\n      strokeWidth: 1,\n      dash: [4, 4],\n    },\n  },\n  background: {\n    color: LIGHT_BASE_COLORS.emptyShade,\n    fallbackColor: LIGHT_BASE_COLORS.emptyShade,\n  },\n  goal: {\n    minFontSize: 8,\n    maxFontSize: 64,\n    maxCircularSize: 360,\n    maxBulletSize: 500,\n    barThicknessMinSizeRatio: 1 / 10,\n    baselineArcThickness: 32,\n    baselineBarThickness: 32,\n    marginRatio: 0.05,\n    maxTickFontSize: 24,\n    maxLabelFontSize: 32,\n    maxCentralFontSize: 38,\n    arcBoxSamplePitch: (5 / 360) * TAU,\n    capturePad: 16,\n    tickLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#646a77', // LIGHT_BASE_COLORS.darkShade,\n    },\n    majorLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: LIGHT_BASE_COLORS.darkestShade,\n    },\n    minorLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#646a77', // LIGHT_BASE_COLORS.darkShade,\n    },\n    majorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: LIGHT_BASE_COLORS.darkestShade,\n    },\n    minorCenterLabel: {\n      fontStyle: 'normal',\n      fontFamily: DEFAULT_FONT_FAMILY,\n      fill: '#646a77', // LIGHT_BASE_COLORS.darkShade,\n    },\n    targetLine: {\n      stroke: LIGHT_BASE_COLORS.darkestShade,\n    },\n    tickLine: {\n      stroke: LIGHT_BASE_COLORS.mediumShade,\n    },\n    progressLine: {\n      stroke: LIGHT_BASE_COLORS.darkestShade,\n    },\n  },\n  partition: {\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    fontFamily: DEFAULT_FONT_FAMILY,\n    minFontSize: 8,\n    maxFontSize: 16,\n    idealFontSizeJump: 1.05,\n    maximizeFontSize: false,\n    circlePadding: 4,\n    radialPadding: TAU / 360,\n    horizontalTextAngleThreshold: TAU / 12,\n    horizontalTextEnforcer: 1,\n    fillLabel: {\n      textColor: ColorVariant.Adaptive,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      valueFont: {\n        fontWeight: 700,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n      padding: 2,\n      clipText: false,\n    },\n    linkLabel: {\n      maximumSection: 10,\n      fontFamily: 'Sans-Serif',\n      fontSize: 11,\n      fontStyle: 'normal',\n      fontVariant: 'normal',\n      fontWeight: 400,\n      gap: 10,\n      spacing: 2,\n      horizontalStemLength: 10,\n      radiusPadding: 10,\n      lineWidth: 1,\n      maxCount: 5,\n      maxTextLength: 100,\n      textColor: LIGHT_BASE_COLORS.darkestShade,\n      minimumStemLength: 0,\n      stemAngle: TAU / 8,\n      padding: 0,\n      valueFont: {\n        fontWeight: 400,\n        fontStyle: 'normal',\n        fontVariant: 'normal',\n      },\n    },\n    sectorLineWidth: 1.5,\n    sectorLineStroke: LIGHT_BASE_COLORS.emptyShade,\n  },\n  heatmap: {\n    brushArea: {\n      visible: true,\n      stroke: LIGHT_BASE_COLORS.darkShade,\n      strokeWidth: 2,\n    },\n    brushMask: {\n      visible: true,\n      fill: '#73737380',\n    },\n    brushTool: {\n      visible: false,\n      fill: 'gray',\n    },\n    xAxisLabel: {\n      visible: true,\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n      rotation: 0,\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      fontSize: 12,\n      fontFamily: 'Sans-Serif',\n      fontStyle: 'normal',\n      textColor: Colors.Black.keyword,\n      fontVariant: 'normal',\n      fontWeight: 'normal',\n      padding: { top: 5, bottom: 5, left: 5, right: 5 },\n    },\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'gray',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 'fill',\n      align: 'center',\n      label: {\n        visible: true,\n        maxWidth: 'fill',\n        minFontSize: 8,\n        maxFontSize: 12,\n        fontFamily: 'Sans-Serif',\n        fontStyle: 'normal',\n        textColor: Colors.Black.keyword,\n        fontVariant: 'normal',\n        fontWeight: 'normal',\n        useGlobalMinFontSize: true,\n      },\n      border: {\n        strokeWidth: 1,\n        stroke: 'gray',\n      },\n    },\n  },\n  metric: {\n    text: {\n      lightColor: '#E0E5EE', // LIGHT_BASE_COLORS.title,\n      darkColor: LIGHT_BASE_COLORS.darkestShade,\n    },\n    border: '#EDF0F5', // LIGHT_BASE_COLORS.lightShade,\n    barBackground: '#EDF0F5', // LIGHT_BASE_COLORS.lightShade,\n    emptyBackground: Colors.Transparent.keyword,\n    nonFiniteText: 'N/A',\n    minHeight: 64,\n  },\n  bulletGraph: LIGHT_THEME_BULLET_STYLE,\n  tooltip: {\n    maxWidth: 500,\n    maxTableHeight: 120,\n    defaultDotColor: Colors.Black.keyword,\n  },\n  // TODO map colors to base color mappings\n  flamegraph: {\n    navigation: {\n      textColor: LIGHT_BASE_COLORS.darkestShade,\n      buttonTextColor: '#0061A6',\n      buttonDisabledTextColor: '#A2ABBA',\n      buttonBackgroundColor: '#CCE4F5',\n      buttonDisabledBackgroundColor: '#D3DAE626',\n    },\n    scrollbarThumb: LIGHT_BASE_COLORS.darkestShade,\n    scrollbarTrack: LIGHT_BASE_COLORS.lightShade,\n  },\n  highlighter: {\n    point: {\n      opacity: 1,\n      fill: ColorVariant.None,\n      stroke: ColorVariant.Series,\n      strokeWidth: 4,\n      radius: 10,\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LineAnnotationStyle, RectAnnotationStyle } from './theme';\nimport { mergePartial, RecursivePartial } from '../common';\n\n/** @public */\nexport const DEFAULT_ANNOTATION_LINE_STYLE: LineAnnotationStyle = {\n  line: {\n    stroke: '#777',\n    strokeWidth: 1,\n    opacity: 1,\n  },\n};\n/** @public */\nexport const DEFAULT_ANNOTATION_RECT_STYLE: RectAnnotationStyle = {\n  stroke: '#FFEEBC',\n  strokeWidth: 0,\n  opacity: 0.25,\n  fill: '#FFEEBC',\n};\n\n/** @public */\nexport function mergeWithDefaultAnnotationLine(config?: RecursivePartial<LineAnnotationStyle>): LineAnnotationStyle {\n  return mergePartial(DEFAULT_ANNOTATION_LINE_STYLE, config);\n}\n\n/** @public */\nexport function mergeWithDefaultAnnotationRect(config?: RecursivePartial<RectAnnotationStyle>): RectAnnotationStyle {\n  return mergePartial(DEFAULT_ANNOTATION_RECT_STYLE, config);\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Color } from '../../common/colors';\nimport { Pixels, Distance, Radian, SizeRatio, Ratio } from '../../common/geometry';\nimport { Font, PartialFont, FontFamily } from '../../common/text_utils';\nimport { ColorVariant, StrokeStyle } from '../common';\nimport { PerSideDistance } from '../dimensions';\n\ninterface LabelConfig extends Font {\n  textColor: Color | typeof ColorVariant.Adaptive;\n  valueFont: PartialFont;\n  padding: Pixels | Partial<Padding>;\n}\n\n/** @public */\nexport type Padding = Pixels | Partial<PerSideDistance>;\n\n/** @public */\nexport interface FillLabelConfig extends LabelConfig {\n  clipText: boolean;\n}\n\n/** @public */\nexport interface FillFontSizeRange {\n  minFontSize: Pixels;\n  maxFontSize: Pixels;\n  idealFontSizeJump: Ratio;\n  /**\n   * When `maximizeFontSize` is false (the default), text font will not be larger than font sizes in larger sectors/rectangles in the same pie chart,\n   * sunburst ring or treemap layer. When it is set to true, the largest font, not exceeding `maxFontSize`, that fits in the slice/sector/rectangle\n   * will be chosen for easier text readability, irrespective of the value.\n   */\n  maximizeFontSize: boolean;\n}\n\n/** @public */\nexport interface LinkLabelConfig extends LabelConfig {\n  fontSize: Pixels; // todo consider putting it in Font\n  /**\n   * Uses linked labels below this limit of the outer sector arc length (in pixels)\n   */\n  maximumSection: Distance;\n  gap: Pixels;\n  spacing: Pixels;\n  minimumStemLength: Distance;\n  stemAngle: Radian;\n  horizontalStemLength: Distance;\n  radiusPadding: Distance;\n  lineWidth: Pixels;\n  /**\n   * Limits the total count of linked labels. The first N largest slices are kept.\n   */\n  maxCount: number;\n  /**\n   * Limits the total number of characters in linked labels.\n   */\n  maxTextLength: number;\n}\n\n/** @public */\nexport interface PartitionStyle extends FillFontSizeRange {\n  /**\n   * The diameter of the inner circle, relative to `outerSizeRatio`\n   */\n  emptySizeRatio: SizeRatio;\n  /**\n   * The diameter of the entire circle, relative to the smaller of the usable rectangular size (smaller of width/height minus the margins)\n   */\n  outerSizeRatio: SizeRatio;\n  fontFamily: FontFamily;\n  circlePadding: Distance;\n  radialPadding: Distance;\n  horizontalTextAngleThreshold: Radian;\n  horizontalTextEnforcer: Ratio;\n  fillLabel: FillLabelConfig;\n  linkLabel: LinkLabelConfig;\n  sectorLineWidth: Pixels;\n  sectorLineStroke: StrokeStyle;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { CSSProperties } from 'react';\nimport { $Values } from 'utility-types';\n\nimport { PartitionStyle } from './partition';\nimport { BulletStyle } from '../../chart_types/bullet_graph/theme';\nimport { Color } from '../../common/colors';\nimport { Pixels, Radian, Ratio } from '../../common/geometry';\nimport { Font, FontStyle } from '../../common/text_utils';\nimport { ColorVariant, HorizontalAlignment, RecursivePartial, VerticalAlignment } from '../common';\nimport { Margins, Padding, SimplePadding } from '../dimensions';\nimport { Point } from '../point';\n\n/**\n * Base color definitions - theme-specific\n * @public\n */\nexport interface ChartBaseColors {\n  emptyShade: string;\n  lightShade: string;\n  lightestShade: string;\n  mediumShade: string;\n  darkShade: string;\n  darkestShade: string;\n  title: string;\n}\n\n/** @public */\nexport interface Visible {\n  visible: boolean;\n}\n\n/** @public */\nexport interface TextStyle {\n  fontSize: number;\n  fontFamily: string;\n  fontStyle?: FontStyle;\n  fill: Color;\n  padding: number | SimplePadding;\n}\n\n/**\n * Offset in pixels\n * @public\n */\nexport interface TextOffset {\n  /**\n   * X offset of tick in px or string with % of height\n   */\n  x: number | string;\n  /**\n   * X offset of tick in px or string with % of height\n   */\n  y: number | string;\n  /**\n   * Offset coordinate system reference\n   *\n   * - `global` - aligns offset coordinate system to global (non-rotated) coordinate system\n   * - `local` - aligns offset coordinate system to local rotated coordinate system\n   */\n  reference: 'global' | 'local';\n}\n\n/**\n * Text alignment\n * @public\n */\nexport interface TextAlignment {\n  horizontal: HorizontalAlignment;\n  vertical: VerticalAlignment;\n}\n\n/**\n * Tooltip styles\n * @public\n */\nexport interface TooltipStyle {\n  /**\n   * Sets max width of tooltip\n   */\n  maxWidth: NonNullable<CSSProperties['maxWidth']>;\n  /**\n   * Sets max height of scrolling tooltip table body\n   */\n  maxTableHeight: CSSProperties['maxHeight'];\n  /**\n   * Color used as fallback when contrast logic fails\n   */\n  defaultDotColor: Color;\n}\n\n/**\n * Shared style properties for varies geometries\n * @public\n */\nexport interface GeometryStyle {\n  /**\n   * Opacity multiplier\n   *\n   * if set to `0.5` all given opacities will be halfed\n   */\n  opacity: number;\n}\n\n/**\n * Shared style properties for varies geometries\n * @public\n */\nexport interface GeometryStateStyle {\n  /**\n   * Opacity multiplier\n   *\n   * if set to `0.5` all given opacities will be halfed\n   */\n  opacity: number;\n}\n\n/** @public */\nexport interface SharedGeometryStateStyle<S extends CSSProperties = GeometryStateStyle> {\n  default: S;\n  highlighted: S;\n  unhighlighted: S;\n}\n\n/**\n * The stroke color style\n * @public\n */\nexport interface StrokeStyle<C = Color> {\n  /** The stroke color in hex, rgba, hsl */\n  stroke: C;\n  /** The stroke width in pixel */\n  strokeWidth: number;\n}\n\n/** @public */\nexport type TickStyle = StrokeStyle &\n  Visible & {\n    /**\n     * Amount of padding between tick line and labels\n     */\n    padding: number;\n    /**\n     * length of tick line\n     */\n    size: number;\n  };\n\n/**\n * The dash array for a stroke\n * @public\n */\nexport interface StrokeDashArray {\n  /** The dash array for dashed strokes */\n  dash: number[];\n}\n/** @public */\nexport interface FillStyle {\n  /** The fill color in hex, rgba, hsl */\n  fill: Color;\n}\n/** @public */\nexport interface Opacity {\n  /** The opacity value from 0 to 1 */\n  opacity: number;\n}\n\n/** @public */\nexport interface AxisStyle {\n  axisTitle: TextStyle & Visible;\n  axisPanelTitle: TextStyle & Visible;\n  axisLine: StrokeStyle & Visible;\n  tickLabel: TextStyle &\n    Visible & {\n      /** The degrees of rotation of the tick labels */\n      rotation: number;\n      /**\n       * Offset in pixels to render text relative to anchor\n       *\n       * **Note:** rotation aligns to global cartesian coordinates\n       */\n      offset: TextOffset;\n      alignment: TextAlignment;\n    };\n  tickLine: TickStyle;\n  gridLine: {\n    horizontal: GridLineStyle;\n    vertical: GridLineStyle;\n    lumaSteps: number[];\n  };\n}\n\n/**\n * @public\n */\nexport interface GridLineStyle {\n  visible: boolean;\n  stroke: Color;\n  strokeWidth: number;\n  opacity: number;\n  dash: number[];\n}\n\n/**\n * @public\n */\nexport interface GoalStyles {\n  progressLine: Pick<StrokeStyle, 'stroke'>;\n  targetLine: Pick<StrokeStyle, 'stroke'>;\n  tickLine: Pick<StrokeStyle, 'stroke'>;\n  tickLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  majorLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  minorLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  majorCenterLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  minorCenterLabel: Omit<TextStyle, 'padding' | 'fontSize'>;\n  minFontSize: number;\n  maxFontSize: number;\n  /**\n   * Circular goal/gauge size limit. The chart will _NOT_ be bigger even if there's ample room.\n   */\n  maxCircularSize: number;\n  /**\n   * Bullet goal/gauge size limit. The chart will _NOT_ be bigger even if there's ample room.\n   */\n  maxBulletSize: number;\n  /**\n   * The bar thickness is a maximum of this fraction of the smaller graph area size\n   */\n  barThicknessMinSizeRatio: number;\n  /**\n   * Bar thickness if there's ample room, no need for greater thickness even if there's a large area\n   */\n  baselineArcThickness: number;\n  /**\n   * Bar thickness if there's ample room, no need for greater thickness even if there's a large area\n   */\n  baselineBarThickness: number;\n  /**\n   * same ratio on each side\n   */\n  marginRatio: number;\n  maxTickFontSize: number;\n  maxLabelFontSize: number;\n  maxCentralFontSize: number;\n  /**\n   * 5-degree pitch ie. a circle is 72 steps\n   */\n  arcBoxSamplePitch: Radian;\n  /**\n   * mouse hover is detected in the padding too (eg. for Fitts law)\n   */\n  capturePad: number;\n}\n\n/**\n * @public\n */\nexport interface HeatmapStyle {\n  /**\n   * Config of the mask over the area outside of the selected cells\n   */\n  brushMask: { visible: boolean; fill: Color };\n  /**\n   * Config of the mask over the selected cells\n   */\n  brushArea: { visible: boolean; fill?: Color; stroke: Color; strokeWidth: number };\n  /**\n   * Config of the brushing tool\n   */\n  brushTool: {\n    visible: boolean;\n    // TODO add support for changing the brush tool color\n    fill: Color;\n  };\n  xAxisLabel: Font & {\n    fontSize: Pixels;\n    visible: boolean;\n    padding: Pixels | Padding;\n    /**\n     * Positive 0 - 90 degree angle\n     * @defaultValue 0\n     */\n    rotation: number;\n  };\n  yAxisLabel: Font & {\n    fontSize: Pixels;\n    width: Pixels | 'auto' | { max: Pixels };\n    visible: boolean;\n    padding: Pixels | Padding;\n  };\n  grid: {\n    stroke: {\n      color: string;\n      width: number;\n    };\n  };\n  cell: {\n    maxWidth: Pixels | 'fill';\n    maxHeight: Pixels | 'fill';\n    align: 'center';\n    label: Font & {\n      minFontSize: Pixels;\n      maxFontSize: Pixels;\n      useGlobalMinFontSize: boolean;\n      maxWidth: Pixels | 'fill';\n      visible: boolean;\n    };\n    border: {\n      strokeWidth: Pixels;\n      stroke: Color;\n    };\n  };\n  maxLegendHeight?: number;\n}\n\n/** @public */\nexport interface MetricStyle {\n  text: {\n    darkColor: Color;\n    lightColor: Color;\n  };\n  border: Color;\n  barBackground: Color;\n  emptyBackground: Color;\n  /**\n   * Optional color used to blend transparent colors. Defaults to `Theme.background`\n   */\n  blendingBackground?: Color;\n  nonFiniteText: string;\n  minHeight: Pixels;\n}\n\n/** @alpha */\nexport interface FlamegraphStyle {\n  navigation: {\n    textColor: Color;\n    buttonTextColor: Color;\n    buttonDisabledTextColor: Color;\n    buttonBackgroundColor: Color;\n    buttonDisabledBackgroundColor: Color;\n  };\n  scrollbarTrack: Color;\n  scrollbarThumb: Color;\n}\n\n/** @public */\nexport interface ScalesConfig {\n  /**\n   * The proportion of the range that is reserved for blank space between bands.\n   * A value of 0 means no blank space between bands, and a value of 1 means a bandwidth of zero.\n   * A number between 0 and 1.\n   */\n  barsPadding: number;\n  /**\n   * The proportion of the range that is reserved for blank space between bands in histogramMode.\n   * A value of 0 means no blank space between bands, and a value of 1 means a bandwidth of zero.\n   * A number between 0 and 1.\n   */\n  histogramPadding: number;\n}\n/** @public */\nexport interface ColorConfig {\n  vizColors: Color[];\n  defaultVizColor: Color;\n}\n/**\n * The background style applied to the chart.\n * This is used to coordinate adequate contrast of the text in partition and treemap charts.\n * @public\n */\nexport interface BackgroundStyle {\n  /**\n   * The background color\n   */\n  color: string;\n  /**\n   * The fallback background color used for constrast logic.\n   * Must be opaque, alpha value will be ignored otherwise.\n   */\n  fallbackColor: Color;\n}\n\n/** @public */\nexport interface LegendLabelOptions {\n  /**\n   * Sets maxlines allowable before truncating\n   *\n   * Setting value to `0` will _never_ truncate the text\n   *\n   * @defaultValue 1\n   */\n  maxLines: number;\n}\n\n/** @public */\nexport interface LegendStyle {\n  /**\n   * Max width used for left/right legend\n   *\n   * or\n   *\n   * Width of `LegendItem` for top/bottom legend\n   */\n  verticalWidth: number;\n  /**\n   * Max height used for top/bottom legend\n   */\n  horizontalHeight: number;\n  /**\n   * Added buffer between label and value.\n   *\n   * Smaller values render a more compact legend\n   */\n  spacingBuffer: number;\n  /**\n   * Legend padding. The Chart margins are independent of the legend.\n   *\n   * TODO: make SimplePadding when after axis changes are added\n   */\n  margin: number;\n  /**\n   * Options to control legend labels\n   */\n  labelOptions: LegendLabelOptions;\n}\n/** @public */\nexport interface Theme {\n  /**\n   * Space btw parent DOM element and first available element of the chart (axis if exists, else the chart itself)\n   */\n  chartMargins: Margins;\n  /**\n   * Space btw the chart geometries and axis; if no axis, pads space btw chart & container\n   */\n  chartPaddings: Margins;\n  /**\n   * Global line styles.\n   *\n   * __Note:__ This is not used to set the color of a specific series. As such, any changes to the styles will not be reflected in the tooltip, legend, etc..\n   *\n   * You may use `SeriesColorAccessor` to assign colors to a given series or replace the `theme.colors.vizColors` colors to your desired colors.\n   */\n  lineSeriesStyle: LineSeriesStyle;\n  /**\n   * Global area styles.\n   *\n   * __Note:__ This is not used to set the color of a specific series. As such, any changes to the styles will not be reflected in the tooltip, legend, etc..\n   *\n   * You may use `SeriesColorAccessor` to assign colors to a given series or replace the `theme.colors.vizColors` colors to your desired colors.\n   */\n  areaSeriesStyle: AreaSeriesStyle;\n  /**\n   * Global bar styles.\n   *\n   * __Note:__ This is not used to set the color of a specific series. As such, any changes to the styles will not be reflected in the tooltip, legend, etc..\n   *\n   * You may use `SeriesColorAccessor` to assign colors to a given series or replace the `theme.colors.vizColors` colors to your desired colors.\n   */\n  barSeriesStyle: BarSeriesStyle;\n  /**\n   * Global bubble styles.\n   *\n   * __Note:__ This is not used to set the color of a specific series. As such, any changes to the styles will not be reflected in the tooltip, legend, etc..\n   *\n   * You may use `SeriesColorAccessor` to assign colors to a given series or replace the `theme.colors.vizColors` colors to your desired colors.\n   */\n  bubbleSeriesStyle: BubbleSeriesStyle;\n  arcSeriesStyle: ArcSeriesStyle;\n  sharedStyle: SharedGeometryStateStyle;\n  axes: AxisStyle;\n  scales: ScalesConfig;\n  colors: ColorConfig;\n  legend: LegendStyle;\n  crosshair: CrosshairStyle;\n  /**\n   * Used to scale radius with `markSizeAccessor`\n   *\n   * value from 1 to 100\n   */\n  markSizeRatio?: number;\n  /**\n   * The background allows the consumer to provide a color of the background container of the chart.\n   * This can then be used to calculate the contrast of the text for partition charts.\n   */\n  background: BackgroundStyle;\n  /**\n   * Theme styles for goal and gauge chart types\n   */\n  goal: GoalStyles;\n  /**\n   * Theme styles for partition chart types\n   */\n  partition: PartitionStyle;\n  /**\n   * Theme styles for heatmap chart types\n   */\n  heatmap: HeatmapStyle;\n  /**\n   * Theme styles for metric chart types\n   */\n  metric: MetricStyle;\n\n  /**\n   * Theme styles for bullet graph types\n   */\n  bulletGraph: BulletStyle;\n  /**\n   * Theme styles for tooltip\n   */\n  tooltip: TooltipStyle;\n\n  /** @alpha */\n  flamegraph: FlamegraphStyle;\n\n  highlighter: HighlighterStyle;\n}\n\n/** @public */\nexport type PartialTheme = RecursivePartial<Theme>;\n\n/** @public */\nexport type DisplayValueStyle = Omit<TextStyle, 'fill' | 'fontSize'> & {\n  offsetX: number;\n  offsetY: number;\n  fontSize:\n    | number\n    | {\n        min: number;\n        max: number;\n      };\n  fill:\n    | Color\n    | { color: Color; borderColor?: Color; borderWidth?: number }\n    | {\n        textBorder?: number;\n      };\n  alignment?: {\n    horizontal: Exclude<HorizontalAlignment, 'far' | 'near'>;\n    vertical: Exclude<VerticalAlignment, 'far' | 'near'>;\n  };\n};\n\n/** @public */\nexport const PointShape = Object.freeze({\n  Circle: 'circle' as const,\n  Square: 'square' as const,\n  Diamond: 'diamond' as const,\n  Plus: 'plus' as const,\n  X: 'x' as const,\n  Triangle: 'triangle' as const,\n});\n/** @public */\nexport type PointShape = $Values<typeof PointShape>;\n\n/** @public */\nexport interface PointStyle {\n  /** is the point visible or hidden */\n  visible: boolean;\n  /** a static stroke color if defined, if not it will use the color of the series */\n  stroke?: Color | ColorVariant;\n  /** the stroke width of the point */\n  strokeWidth: number;\n  /**  a static fill color if defined, if not it will use the color of the series */\n  fill?: Color | ColorVariant;\n  /** the opacity of each point on the theme/series */\n  opacity: number;\n  /** the radius of each point of the theme/series */\n  radius: Pixels;\n  /** shape for the point, default to circle */\n  shape?: PointShape;\n}\n\n/** @public */\nexport interface LineStyle {\n  /** is the line visible or hidden ? */\n  visible: boolean;\n  /** a static stroke color if defined, if not it will use the color of the series */\n  stroke?: Color | ColorVariant;\n  /** the stroke width of the line */\n  strokeWidth: number;\n  /** the opacity of each line on the theme/series */\n  opacity: number;\n  /** the dash array */\n  dash?: number[];\n}\n\n/** @public */\nexport const TextureShape = Object.freeze({\n  ...PointShape,\n  Line: 'line' as const,\n});\n/** @public */\nexport type TextureShape = $Values<typeof TextureShape>;\n\n/** @public */\nexport interface TexturedStylesBase {\n  /** polygon fill color for texture */\n  fill?: Color | ColorVariant;\n  /** polygon stroke color for texture */\n  stroke?: Color | ColorVariant;\n  /** polygon stroke width for texture  */\n  strokeWidth?: number;\n  /** polygon opacity for texture  */\n  opacity?: number;\n  /** polygon opacity for texture  */\n  dash?: number[];\n  /** polygon opacity for texture  */\n  size?: number;\n  /**\n   * The angle of rotation for entire texture\n   * in degrees\n   */\n  rotation?: number;\n  /**\n   * The angle of rotation for polygons\n   * in degrees\n   */\n  shapeRotation?: number;\n  /** texture spacing between polygons */\n  spacing?: Partial<Point> | number;\n  /** overall origin offset of pattern */\n  offset?: Partial<Point> & {\n    /** apply offset along global coordinate axes */\n    global?: boolean;\n  };\n}\n\n/** @public */\nexport interface TexturedShapeStyles extends TexturedStylesBase {\n  /** typed of texture designs currently supported */\n  shape: TextureShape;\n}\n\n/** @public */\nexport interface TexturedPathStyles extends TexturedStylesBase {\n  /** path for polygon texture */\n  path: string | Path2D;\n}\n\n/**\n * @public\n *\n * Texture style config for area spec\n */\nexport type TexturedStyles = TexturedPathStyles | TexturedShapeStyles;\n\n/** @public */\nexport interface AreaStyle {\n  /** applying textures to the area on the theme/series */\n  texture?: TexturedStyles;\n  /** is the area is visible or hidden ? */\n  visible: boolean;\n  /** a static fill color if defined, if not it will use the color of the series */\n  fill?: Color | ColorVariant;\n  /** the opacity of each area on the theme/series */\n  opacity: number;\n}\n\n/** @public */\nexport interface ArcStyle {\n  /** is the arc is visible or hidden ? */\n  visible: boolean;\n  /** a static fill color if defined, if not it will use the color of the series */\n  fill?: Color | ColorVariant;\n  /** a static stroke color if defined, if not it will use the color of the series */\n  stroke?: Color | ColorVariant;\n  /** the stroke width of the line */\n  strokeWidth: number;\n  /** the opacity of each arc on the theme/series */\n  opacity: number;\n}\n\n/** @public */\nexport interface RectStyle {\n  /** a static fill color if defined, if not it will use the color of the series */\n  fill?: Color | ColorVariant;\n  /** the opacity of each rect on the theme/series */\n  opacity: number;\n  /** The width of the rect in pixel. If expressed together with `widthRatio` then the `widthRatio`\n   * will express the max available size, where the `widthPixel` express the derived/min width. */\n  widthPixel?: Pixels;\n  /** The ratio of the width limited to [0,1]. If expressed together with `widthPixel` then the `widthRatio`\n   * will express the max available size, where the `widthPixel` express the derived/min width. */\n  widthRatio?: Ratio;\n  /** applying textures to the bar on the theme/series */\n  texture?: TexturedStyles;\n}\n\n/** @public */\nexport interface RectBorderStyle {\n  /**\n   * Border visibility\n   */\n  visible: boolean;\n  /**\n   * Border stroke color\n   */\n  stroke?: Color | ColorVariant;\n  /**\n   * Border stroke width\n   */\n  strokeWidth: number;\n  /**\n   * Border stroke opacity\n   */\n  strokeOpacity?: number;\n}\n/** @public */\nexport interface BarSeriesStyle {\n  rect: RectStyle;\n  rectBorder: RectBorderStyle;\n  displayValue: DisplayValueStyle;\n}\n\n/** @public */\nexport interface BubbleSeriesStyle {\n  point: PointStyle;\n}\n\n/** @public */\nexport interface LineSeriesStyle {\n  line: LineStyle;\n  point: PointStyle;\n  isolatedPoint: PointStyle;\n  fit: {\n    line: LineFitStyle;\n  };\n}\n\n/** @public */\nexport interface AreaSeriesStyle {\n  area: AreaStyle;\n  line: LineStyle;\n  point: PointStyle;\n  isolatedPoint: PointStyle;\n  fit: {\n    line: LineFitStyle;\n    area: AreaFitStyle;\n  };\n}\n\n/** @public */\nexport type AreaFitStyle = Visible &\n  Opacity & {\n    fill: Color | typeof ColorVariant.Series;\n    texture?: TexturedStyles;\n  };\n\n/** @public */\nexport type LineFitStyle = Visible &\n  Opacity &\n  StrokeDashArray & {\n    stroke: Color | typeof ColorVariant.Series;\n  };\n\n/** @public */\nexport interface ArcSeriesStyle {\n  arc: ArcStyle;\n}\n\n/** @public */\nexport interface CrosshairStyle {\n  band: FillStyle & Visible;\n  line: StrokeStyle & Visible & Partial<StrokeDashArray>;\n  crossLine: StrokeStyle & Visible & Partial<StrokeDashArray>;\n}\n\n/**\n * The style for a linear annotation\n * @public\n */\nexport interface LineAnnotationStyle {\n  /**\n   * The style for the line geometry\n   */\n  line: StrokeStyle & Opacity & Partial<StrokeDashArray>;\n}\n\n/** @public */\nexport type RectAnnotationStyle = StrokeStyle & FillStyle & Opacity & Partial<StrokeDashArray>;\n\n/** @public */\nexport interface HighlighterStyle {\n  point: {\n    fill: Color | ColorVariant;\n    stroke: Color | ColorVariant;\n    strokeWidth: Pixels;\n    opacity: Ratio;\n    radius: Pixels;\n  };\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { SharedGeometryStateStyle } from './theme';\nimport { Colors } from '../../common/colors';\nimport { Margins } from '../dimensions';\n\n/** @internal */\nexport const DEFAULT_MISSING_COLOR = Colors.Red.keyword;\n\n/** @internal */\nexport const DEFAULT_CHART_PADDING: Margins = {\n  left: 0,\n  right: 0,\n  top: 0,\n  bottom: 0,\n};\n/** @internal */\nexport const DEFAULT_CHART_MARGINS: Margins = {\n  left: 0,\n  right: 0,\n  top: 0,\n  bottom: 0,\n};\n\n/**\n * Remove in next step to limit diffs\n * @internal\n */\nexport const LEGACY_CHART_PADDING: Margins = {\n  left: 0,\n  right: 0,\n  top: 0,\n  bottom: 0,\n};\n\n/**\n * Remove in next step to limit diffs\n * @internal\n */\nexport const LEGACY_CHART_MARGINS: Margins = {\n  left: 10,\n  right: 10,\n  top: 10,\n  bottom: 10,\n};\n\n/** @internal */\nexport const DEFAULT_GEOMETRY_STYLES: SharedGeometryStateStyle = {\n  default: {\n    opacity: 1,\n  },\n  highlighted: {\n    opacity: 1,\n  },\n  unhighlighted: {\n    opacity: 0.25,\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport bezier from 'bezier-easing';\nimport { $Values } from 'utility-types';\n\n/** @public */\nexport const TimeFunction = Object.freeze({\n  /**\n   * Animation with the same speed from start to end\n   */\n  linear: 'linear' as const,\n  /**\n   * Animation with a slow start, then fast, then end slowly (this is default)\n   */\n  ease: 'ease' as const,\n  /**\n   * Animation with a slow start\n   */\n  easeIn: 'easeIn' as const,\n  /**\n   * Animation with a slow end\n   */\n  easeOut: 'easeOut' as const,\n  /**\n   * Animation with a slow start and end\n   */\n  easeInOut: 'easeInOut' as const,\n});\n/** @public */\nexport type TimeFunction = $Values<typeof TimeFunction>;\n\n/**\n * Unit normalized time. Value ranges between 0 and 1.\n * @internal */\nexport type UnitTime = number;\n\n/** @internal */\nexport interface TimingFunction {\n  (time: UnitTime): number;\n\n  /**\n   * Inverts timing function, takes a value from 0 to 1 and returns unit time\n   */\n  inverse: (value: number) => UnitTime;\n}\n\n/** @internal */\nexport interface TimingFunctionValues {\n  y0?: number;\n  y1?: number;\n  t0?: number;\n  t1?: number;\n}\n\nconst getBezierFn = (x1: number, y1: number, x2: number, y2: number): TimingFunction => {\n  const fn: TimingFunction = bezier(x1, y1, x2, y2) as TimingFunction;\n  fn.inverse = bezier(y1, x1, y2, x2);\n  return fn;\n};\n\nconst linear: TimingFunction = ((t) => t) as TimingFunction;\nlinear.inverse = (n) => n;\n\n/**\n * Time functions used by CSS spec\n * See https://developer.mozilla.org/en-US/docs/Web/CSS/easing-function\n * @internal\n */\nexport const TimingFunctions: Record<TimeFunction, TimingFunction> = {\n  linear,\n  ease: getBezierFn(0.25, 0.1, 0.25, 1.0),\n  easeIn: getBezierFn(0.42, 0.0, 1.0, 1.0),\n  easeOut: getBezierFn(0.0, 0.0, 0.58, 1.0),\n  easeInOut: getBezierFn(0.42, 0.0, 0.58, 1.0),\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Logger } from './logger';\n\nconst isValidTimeZone = (timeZone?: string): boolean => {\n  if (!timeZone) return false;\n  try {\n    Intl.DateTimeFormat(undefined, { timeZone });\n    return true;\n  } catch (error) {\n    Logger.warn(`The supplied timeZone ${timeZone} does not exist. The default time zone will be used.`);\n    Logger.warn(error);\n    return false;\n  }\n};\n\n/** @internal */\nexport const getValidatedTimeZone = (specifiedTimeZone?: string): string =>\n  specifiedTimeZone && isValidTimeZone(specifiedTimeZone)\n    ? specifiedTimeZone\n    : Intl.DateTimeFormat().resolvedOptions().timeZone;\n\n/** @internal */\nexport const getZoneFromSpecs = (specs: { timeZone?: string }[]): string => {\n  const allValidTimezones = new Set<string>(specs.map((s) => s.timeZone ?? '').filter(isValidTimeZone));\n  return allValidTimezones.size === 1\n    ? allValidTimezones.values().next().value\n    : Intl.DateTimeFormat().resolvedOptions().timeZone;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { LegacyRef, useRef } from 'react';\n\n/**\n * This hook handles a11y focus management closing of the action popover\n * @param ref - pass this ref to button for focus to be returned once popover is closed\n * @param onClose - callback to trigger the focus on popover close\n * @public\n */\nexport function useLegendAction<T extends HTMLElement>(): [ref: LegacyRef<T>, onClose: () => void] {\n  const ref = useRef<T>(null);\n  const onClose = () => {\n    if (ref.current) {\n      requestAnimationFrame(() => ref?.current?.focus?.());\n    }\n  };\n\n  return [ref, onClose];\n}\n","module.exports = __webpack_public_path__ + \"static/media/atkinson-hyperlegible-v1-latin-700.87519365.woff\";","module.exports = __webpack_public_path__ + \"static/media/atkinson-hyperlegible-v1-latin-700.5c76634a.woff2\";","module.exports = __webpack_public_path__ + \"static/media/atkinson-hyperlegible-v1-latin-regular.a14f70f0.woff\";","module.exports = __webpack_public_path__ + \"static/media/atkinson-hyperlegible-v1-latin-regular.dcacc3a6.woff2\";","\"use strict\";\n\nvar _frameworkImportPath = require(\"@storybook/react\");\n\n/* eslint-disable import/no-unresolved */\n(0, _frameworkImportPath.configure)([require.context('./stories', true, /^\\.(?:(?:^|\\/|(?:(?:(?!(?:^|\\/)\\.).)*?)\\/)(?!\\.)(?=.)[^/]*?\\.(stories|story)\\.ts(?:x)?)$/)], module, false);","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport euiDarkVars from '@elastic/eui/dist/eui_theme_dark.json';\nimport euiLightVars from '@elastic/eui/dist/eui_theme_light.json';\nimport type { Parameters as SBParameters } from '@storybook/addons';\nimport { BackgroundParameter } from 'storybook-addon-background-toggle';\nimport { ThemeParameter } from 'storybook-addon-theme-toggle';\nimport { TogglesParameter } from 'storybook-addon-toggles';\n\nimport { SB_KNOBS_PANEL, SB_SOURCE_PANEL } from './stories/utils/storybook';\n\n/**\n * Parameter accessible at the global level\n */\ntype Parameters = SBParameters & ThemeParameter & BackgroundParameter & TogglesParameter;\n\nconst euiLogoUrl =\n  'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgZmlsbD0ibm9uZSIgdmlld0JveD0iMCAwIDMyIDMyIj4KICA8cGF0aCBmaWxsPSIjRkY5NTdEIiBkPSJNMTggMjVjLS41LTUuNS01LjUtMTAuNS0xMS0xMWw3LTdjLjUgNS41IDUuNSAxMC41IDExIDExbC03IDd6Ii8+CiAgPGNpcmNsZSBjeD0iNyIgY3k9IjciIHI9IjciIGZpbGw9IiNGMDRFOTgiLz4KICA8Y2lyY2xlIGN4PSIyNSIgY3k9IjI1IiByPSI3IiBmaWxsPSIjRkVDNTE0Ii8+CiAgPHBhdGggZmlsbD0iIzAwQkZCMyIgZD0iTTMxIDE0Yy03LjE4IDAtMTMtNS44Mi0xMy0xM2gxM3YxM3oiLz4KICA8cGF0aCBmaWxsPSIjMUJBOUY1IiBkPSJNMSAxOGM3LjE4IDAgMTMgNS44MiAxMyAxM0gxVjE4eiIvPgo8L3N2Zz4K';\n\nexport const storybookParameters: Parameters = {\n  options: {\n    selectedPanel: process.env.NODE_ENV === 'development' ? SB_KNOBS_PANEL : SB_SOURCE_PANEL,\n  },\n  previewTabs: {\n    'storybook/docs/panel': {\n      hidden: true,\n    },\n    canvas: {\n      title: 'Story',\n      hidden: false,\n    },\n  },\n  theme: {\n    default: 'light',\n    clearable: false,\n    selector: 'html',\n    themes: [\n      {\n        id: 'light',\n        title: 'Light',\n        class: 'light-theme',\n        color: euiLightVars.euiColorEmptyShade,\n        imageUrl: euiLogoUrl,\n      },\n      {\n        id: 'dark',\n        title: 'Dark',\n        class: 'dark-theme',\n        color: euiDarkVars.euiColorEmptyShade,\n        imageUrl: euiLogoUrl,\n      },\n      {\n        id: 'legacy-light',\n        title: 'Legacy Light',\n        class: ['light-theme', 'legacy'],\n        color: '#fff',\n      },\n      {\n        id: 'legacy-dark',\n        title: 'Legacy Dark',\n        class: ['dark-theme', 'legacy'],\n        color: '#000',\n      },\n    ],\n  },\n  background: {\n    clearable: true,\n    selector: '#none',\n    options: [\n      { id: 'emptyShadeDark', title: 'Empty Shade - Dark', color: euiDarkVars.euiColorEmptyShade },\n      { id: 'emptyShadeLight', title: 'Empty Shade - Light', color: euiLightVars.euiColorEmptyShade },\n      { id: 'black', title: 'Black', color: '#000' },\n      { id: 'white', title: 'White', color: '#fff' },\n      { id: 'red', title: 'Red', color: '#f04d9a' },\n      { id: 'blue', title: 'Blue', color: '#14abf5' },\n      { id: 'yellow', title: 'Yellow', color: '#fec709' },\n      { id: 'green', title: 'Green', color: '#00c1b4' },\n      { id: 'gray', title: 'Gray', color: 'rgb(237, 240, 245)' },\n    ],\n  },\n  toggles: {\n    ignoreQueryParams: false,\n    options: [\n      {\n        id: 'showHeader',\n        title: 'Show story header',\n        defaultValue: true,\n        disabled: {\n          showChartTitle: true,\n          showChartDescription: true,\n        },\n      },\n      {\n        id: 'showChartTitle',\n        title: 'Show chart title',\n        defaultValue: false,\n      },\n      {\n        id: 'showChartDescription',\n        title: 'Show chart description',\n        defaultValue: false,\n      },\n      {\n        id: 'showChartBoundary',\n        title: 'Show chart boundary',\n        defaultValue: false,\n      },\n    ],\n  },\n  viewport: {\n    viewports: {\n      vrt: {\n        // to match vrt default viewport to help with mouse positioning\n        // See e2e/playwright.config.ts#L20\n        name: 'VRT Viewport',\n        styles: {\n          width: '785px',\n          height: '1000px',\n        },\n      },\n    },\n  },\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { StoryWrapper } from './story_wrapper';\n\nimport './style.scss';\n\nexport const decorators = [StoryWrapper];\n\nexport { storybookParameters as parameters } from './parameters';\n","function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n/* eslint-disable import/no-unresolved */\nimport { addDecorator, addParameters, addLoader, addArgsEnhancer, addArgTypesEnhancer, setGlobalRender } from '/app/node_modules/@storybook/client-api';\nimport { logger } from '/app/node_modules/@storybook/client-logger';\nimport * as config from '/app/storybook/preview.ts';\nObject.keys(config).forEach(function (key) {\n  var value = config[key];\n\n  switch (key) {\n    case 'args':\n    case 'argTypes':\n      {\n        return logger.warn('Invalid args/argTypes in config, ignoring.', JSON.stringify(value));\n      }\n\n    case 'decorators':\n      {\n        return value.forEach(function (decorator) {\n          return addDecorator(decorator, false);\n        });\n      }\n\n    case 'loaders':\n      {\n        return value.forEach(function (loader) {\n          return addLoader(loader, false);\n        });\n      }\n\n    case 'parameters':\n      {\n        return addParameters(_objectSpread({}, value), false);\n      }\n\n    case 'argTypesEnhancers':\n      {\n        return value.forEach(function (enhancer) {\n          return addArgTypesEnhancer(enhancer);\n        });\n      }\n\n    case 'argsEnhancers':\n      {\n        return value.forEach(function (enhancer) {\n          return addArgsEnhancer(enhancer);\n        });\n      }\n\n    case 'render':\n      {\n        return setGlobalRender(value);\n      }\n\n    case 'globals':\n    case 'globalTypes':\n      {\n        var v = {};\n        v[key] = value;\n        return addParameters(v, false);\n      }\n\n    default:\n      {\n        // eslint-disable-next-line prefer-template\n        return console.log(key + ' was not supported :( !');\n      }\n  }\n});","var map = {\n\t\"./annotations/lines/1_x_continuous.story.tsx\": \"./stories/annotations/lines/1_x_continuous.story.tsx\",\n\t\"./annotations/lines/2_x_ordinal.story.tsx\": \"./stories/annotations/lines/2_x_ordinal.story.tsx\",\n\t\"./annotations/lines/3_x_time.story.tsx\": \"./stories/annotations/lines/3_x_time.story.tsx\",\n\t\"./annotations/lines/4_y_domain.story.tsx\": \"./stories/annotations/lines/4_y_domain.story.tsx\",\n\t\"./annotations/lines/5_styling.story.tsx\": \"./stories/annotations/lines/5_styling.story.tsx\",\n\t\"./annotations/lines/6_test_single_bar_histogram.story.tsx\": \"./stories/annotations/lines/6_test_single_bar_histogram.story.tsx\",\n\t\"./annotations/lines/7_tooltip_options.story.tsx\": \"./stories/annotations/lines/7_tooltip_options.story.tsx\",\n\t\"./annotations/lines/8_advanced_markers.story.tsx\": \"./stories/annotations/lines/8_advanced_markers.story.tsx\",\n\t\"./annotations/lines/line.stories.tsx\": \"./stories/annotations/lines/line.stories.tsx\",\n\t\"./annotations/rects/1_linear_bar_chart.story.tsx\": \"./stories/annotations/rects/1_linear_bar_chart.story.tsx\",\n\t\"./annotations/rects/2_ordinal_bar_chart.story.tsx\": \"./stories/annotations/rects/2_ordinal_bar_chart.story.tsx\",\n\t\"./annotations/rects/3_linear_line_chart.story.tsx\": \"./stories/annotations/rects/3_linear_line_chart.story.tsx\",\n\t\"./annotations/rects/4_styling.story.tsx\": \"./stories/annotations/rects/4_styling.story.tsx\",\n\t\"./annotations/rects/5_tooltip_options.story.tsx\": \"./stories/annotations/rects/5_tooltip_options.story.tsx\",\n\t\"./annotations/rects/6_zero_domain.story.tsx\": \"./stories/annotations/rects/6_zero_domain.story.tsx\",\n\t\"./annotations/rects/7_with_group_id.story.tsx\": \"./stories/annotations/rects/7_with_group_id.story.tsx\",\n\t\"./annotations/rects/8_outside.story.tsx\": \"./stories/annotations/rects/8_outside.story.tsx\",\n\t\"./annotations/rects/9_click_handler.story.tsx\": \"./stories/annotations/rects/9_click_handler.story.tsx\",\n\t\"./annotations/rects/rects.stories.tsx\": \"./stories/annotations/rects/rects.stories.tsx\",\n\t\"./area/10_stacked_same_naming.story.tsx\": \"./stories/area/10_stacked_same_naming.story.tsx\",\n\t\"./area/11_test_linear.story.tsx\": \"./stories/area/11_test_linear.story.tsx\",\n\t\"./area/12_test_time.story.tsx\": \"./stories/area/12_test_time.story.tsx\",\n\t\"./area/13_band_area.story.tsx\": \"./stories/area/13_band_area.story.tsx\",\n\t\"./area/15_stacked_grouped.story.tsx\": \"./stories/area/15_stacked_grouped.story.tsx\",\n\t\"./area/16_test_stacked_with_missing.story.tsx\": \"./stories/area/16_test_stacked_with_missing.story.tsx\",\n\t\"./area/17_negative.story.tsx\": \"./stories/area/17_negative.story.tsx\",\n\t\"./area/18_negative_positive.story.tsx\": \"./stories/area/18_negative_positive.story.tsx\",\n\t\"./area/19_negative_band.story.tsx\": \"./stories/area/19_negative_band.story.tsx\",\n\t\"./area/1_basic.story.tsx\": \"./stories/area/1_basic.story.tsx\",\n\t\"./area/20_stepped_area.story.tsx\": \"./stories/area/20_stepped_area.story.tsx\",\n\t\"./area/21_with_time_timeslip.story.tsx\": \"./stories/area/21_with_time_timeslip.story.tsx\",\n\t\"./area/2_with_time.story.tsx\": \"./stories/area/2_with_time.story.tsx\",\n\t\"./area/3_with_linear.story.tsx\": \"./stories/area/3_with_linear.story.tsx\",\n\t\"./area/4_with_log.story.tsx\": \"./stories/area/4_with_log.story.tsx\",\n\t\"./area/5_with_4_axes.story.tsx\": \"./stories/area/5_with_4_axes.story.tsx\",\n\t\"./area/6_with_axis_and_legend.story.tsx\": \"./stories/area/6_with_axis_and_legend.story.tsx\",\n\t\"./area/7_stacked.story.tsx\": \"./stories/area/7_stacked.story.tsx\",\n\t\"./area/8_stacked_percentage.story.tsx\": \"./stories/area/8_stacked_percentage.story.tsx\",\n\t\"./area/8_stacked_percentage_zeros.story.tsx\": \"./stories/area/8_stacked_percentage_zeros.story.tsx\",\n\t\"./area/9_stacked_separate_specs.story.tsx\": \"./stories/area/9_stacked_separate_specs.story.tsx\",\n\t\"./area/area.stories.tsx\": \"./stories/area/area.stories.tsx\",\n\t\"./axes/10_one_domain_bound.story.tsx\": \"./stories/axes/10_one_domain_bound.story.tsx\",\n\t\"./axes/11_fit_domain_extent.story.tsx\": \"./stories/axes/11_fit_domain_extent.story.tsx\",\n\t\"./axes/12_duplicate_ticks.story.tsx\": \"./stories/axes/12_duplicate_ticks.story.tsx\",\n\t\"./axes/13_label_formatting.story.tsx\": \"./stories/axes/13_label_formatting.story.tsx\",\n\t\"./axes/14_duplicate_ticks_2.story.tsx\": \"./stories/axes/14_duplicate_ticks_2.story.tsx\",\n\t\"./axes/15_maximum_fraction_digits.story.tsx\": \"./stories/axes/15_maximum_fraction_digits.story.tsx\",\n\t\"./axes/1_basic.story.tsx\": \"./stories/axes/1_basic.story.tsx\",\n\t\"./axes/2_tick_label_rotation.story.tsx\": \"./stories/axes/2_tick_label_rotation.story.tsx\",\n\t\"./axes/3_axis_4_axes.story.tsx\": \"./stories/axes/3_axis_4_axes.story.tsx\",\n\t\"./axes/4_multi_axis.story.tsx\": \"./stories/axes/4_multi_axis.story.tsx\",\n\t\"./axes/5_multi_axis_bar_lines.story.tsx\": \"./stories/axes/5_multi_axis_bar_lines.story.tsx\",\n\t\"./axes/6_different_tooltip.story.tsx\": \"./stories/axes/6_different_tooltip.story.tsx\",\n\t\"./axes/6a_different_tooltip_formatter.story.tsx\": \"./stories/axes/6a_different_tooltip_formatter.story.tsx\",\n\t\"./axes/7_many_tick_labels.story.tsx\": \"./stories/axes/7_many_tick_labels.story.tsx\",\n\t\"./axes/8_custom_domain.story.tsx\": \"./stories/axes/8_custom_domain.story.tsx\",\n\t\"./axes/9_custom_mixed_domain.story.tsx\": \"./stories/axes/9_custom_mixed_domain.story.tsx\",\n\t\"./axes/axes.stories.tsx\": \"./stories/axes/axes.stories.tsx\",\n\t\"./bar/10_axis_and_legend.story.tsx\": \"./stories/bar/10_axis_and_legend.story.tsx\",\n\t\"./bar/11_stacked_with_axis_and_legend.story.tsx\": \"./stories/bar/11_stacked_with_axis_and_legend.story.tsx\",\n\t\"./bar/12_stacked_as_percentage.story.tsx\": \"./stories/bar/12_stacked_as_percentage.story.tsx\",\n\t\"./bar/13_clustered.story.tsx\": \"./stories/bar/13_clustered.story.tsx\",\n\t\"./bar/14_clustered_multiple.story.tsx\": \"./stories/bar/14_clustered_multiple.story.tsx\",\n\t\"./bar/15_time_clustered.story.tsx\": \"./stories/bar/15_time_clustered.story.tsx\",\n\t\"./bar/17_time_stacked.story.tsx\": \"./stories/bar/17_time_stacked.story.tsx\",\n\t\"./bar/18_bar_chart_1y0g.story.tsx\": \"./stories/bar/18_bar_chart_1y0g.story.tsx\",\n\t\"./bar/19_bar_chart_1y1g.story.tsx\": \"./stories/bar/19_bar_chart_1y1g.story.tsx\",\n\t\"./bar/1_basic.story.tsx\": \"./stories/bar/1_basic.story.tsx\",\n\t\"./bar/20_bar_chart_1y2g.story.tsx\": \"./stories/bar/20_bar_chart_1y2g.story.tsx\",\n\t\"./bar/21_bar_chart_2y0g.story.tsx\": \"./stories/bar/21_bar_chart_2y0g.story.tsx\",\n\t\"./bar/22_barchart_2y1g.story.tsx\": \"./stories/bar/22_barchart_2y1g.story.tsx\",\n\t\"./bar/23_bar_chart_2y2g.story.tsx\": \"./stories/bar/23_bar_chart_2y2g.story.tsx\",\n\t\"./bar/24_tooltip_visibility.story.tsx\": \"./stories/bar/24_tooltip_visibility.story.tsx\",\n\t\"./bar/25_high_data_volume.story.tsx\": \"./stories/bar/25_high_data_volume.story.tsx\",\n\t\"./bar/26_single_data_linear.story.tsx\": \"./stories/bar/26_single_data_linear.story.tsx\",\n\t\"./bar/27_single_data_ordinal.story.tsx\": \"./stories/bar/27_single_data_ordinal.story.tsx\",\n\t\"./bar/28_single_data_clustered.story.tsx\": \"./stories/bar/28_single_data_clustered.story.tsx\",\n\t\"./bar/29_single_data_stacked.story.tsx\": \"./stories/bar/29_single_data_stacked.story.tsx\",\n\t\"./bar/2_label_value.story.tsx\": \"./stories/bar/2_label_value.story.tsx\",\n\t\"./bar/30_stacked_to_extent.story.tsx\": \"./stories/bar/30_stacked_to_extent.story.tsx\",\n\t\"./bar/31_negative_and_positive_x_values.story.tsx\": \"./stories/bar/31_negative_and_positive_x_values.story.tsx\",\n\t\"./bar/32_scale_to_extent.story.tsx\": \"./stories/bar/32_scale_to_extent.story.tsx\",\n\t\"./bar/33_band_bar.story.tsx\": \"./stories/bar/33_band_bar.story.tsx\",\n\t\"./bar/34_test_linear.story.tsx\": \"./stories/bar/34_test_linear.story.tsx\",\n\t\"./bar/35_test_time.story.tsx\": \"./stories/bar/35_test_time.story.tsx\",\n\t\"./bar/36_test_linear_clustered.story.tsx\": \"./stories/bar/36_test_linear_clustered.story.tsx\",\n\t\"./bar/37_test_time_clustered.story.tsx\": \"./stories/bar/37_test_time_clustered.story.tsx\",\n\t\"./bar/38_test_clustered_null_bars.story.tsx\": \"./stories/bar/38_test_clustered_null_bars.story.tsx\",\n\t\"./bar/39_test_stacked_null.story.tsx\": \"./stories/bar/39_test_stacked_null.story.tsx\",\n\t\"./bar/3_with_axis.story.tsx\": \"./stories/bar/3_with_axis.story.tsx\",\n\t\"./bar/40_test_switch.story.tsx\": \"./stories/bar/40_test_switch.story.tsx\",\n\t\"./bar/41_test_histogram_linear.story.tsx\": \"./stories/bar/41_test_histogram_linear.story.tsx\",\n\t\"./bar/42_test_histogram_ordinal.story.tsx\": \"./stories/bar/42_test_histogram_ordinal.story.tsx\",\n\t\"./bar/43_test_discover.story.tsx\": \"./stories/bar/43_test_discover.story.tsx\",\n\t\"./bar/44_test_single_histogram.story.tsx\": \"./stories/bar/44_test_single_histogram.story.tsx\",\n\t\"./bar/45_min_height.story.tsx\": \"./stories/bar/45_min_height.story.tsx\",\n\t\"./bar/46_test_min_height.story.tsx\": \"./stories/bar/46_test_min_height.story.tsx\",\n\t\"./bar/47_stacked_only_grouped.story.tsx\": \"./stories/bar/47_stacked_only_grouped.story.tsx\",\n\t\"./bar/48_test_tooltip.story.tsx\": \"./stories/bar/48_test_tooltip.story.tsx\",\n\t\"./bar/49_test_dual_axis.story.tsx\": \"./stories/bar/49_test_dual_axis.story.tsx\",\n\t\"./bar/4_ordinal.story.tsx\": \"./stories/bar/4_ordinal.story.tsx\",\n\t\"./bar/50_order_bins_by_sum.story.tsx\": \"./stories/bar/50_order_bins_by_sum.story.tsx\",\n\t\"./bar/51_label_value_advanced.story.tsx\": \"./stories/bar/51_label_value_advanced.story.tsx\",\n\t\"./bar/52_multi_group_same_domain.story.tsx\": \"./stories/bar/52_multi_group_same_domain.story.tsx\",\n\t\"./bar/53_use_domain_from_different_groupid.story.tsx\": \"./stories/bar/53_use_domain_from_different_groupid.story.tsx\",\n\t\"./bar/54_functional_accessors.story.tsx\": \"./stories/bar/54_functional_accessors.story.tsx\",\n\t\"./bar/55_tooltip_boundary.story.tsx\": \"./stories/bar/55_tooltip_boundary.story.tsx\",\n\t\"./bar/56_test_use_dfl_gdomain.story.tsx\": \"./stories/bar/56_test_use_dfl_gdomain.story.tsx\",\n\t\"./bar/57_test_rect_border_bars.story.tsx\": \"./stories/bar/57_test_rect_border_bars.story.tsx\",\n\t\"./bar/58_data_values.story.tsx\": \"./stories/bar/58_data_values.story.tsx\",\n\t\"./bar/5_linear.story.tsx\": \"./stories/bar/5_linear.story.tsx\",\n\t\"./bar/6_linear_no_linear_interval.story.tsx\": \"./stories/bar/6_linear_no_linear_interval.story.tsx\",\n\t\"./bar/7_with_time_xaxis.story.tsx\": \"./stories/bar/7_with_time_xaxis.story.tsx\",\n\t\"./bar/8_with_log_yaxis.story.tsx\": \"./stories/bar/8_with_log_yaxis.story.tsx\",\n\t\"./bar/9_with_stacked_log.story.tsx\": \"./stories/bar/9_with_stacked_log.story.tsx\",\n\t\"./bar/bars.stories.tsx\": \"./stories/bar/bars.stories.tsx\",\n\t\"./bubble/1_simple.story.tsx\": \"./stories/bubble/1_simple.story.tsx\",\n\t\"./bubble/2_ordinal.story.tsx\": \"./stories/bubble/2_ordinal.story.tsx\",\n\t\"./bubble/3_multiple.story.tsx\": \"./stories/bubble/3_multiple.story.tsx\",\n\t\"./bubble/4_mixed.story.tsx\": \"./stories/bubble/4_mixed.story.tsx\",\n\t\"./bubble/mixed.stories.tsx\": \"./stories/bubble/mixed.stories.tsx\",\n\t\"./bullet_graph/1_single.story.tsx\": \"./stories/bullet_graph/1_single.story.tsx\",\n\t\"./bullet_graph/2_angular.story.tsx\": \"./stories/bullet_graph/2_angular.story.tsx\",\n\t\"./bullet_graph/3_color_bands.story.tsx\": \"./stories/bullet_graph/3_color_bands.story.tsx\",\n\t\"./bullet_graph/4_single_row.story.tsx\": \"./stories/bullet_graph/4_single_row.story.tsx\",\n\t\"./bullet_graph/5_single_column.story.tsx\": \"./stories/bullet_graph/5_single_column.story.tsx\",\n\t\"./bullet_graph/6_grid.story.tsx\": \"./stories/bullet_graph/6_grid.story.tsx\",\n\t\"./bullet_graph/bullet_graph.stories.tsx\": \"./stories/bullet_graph/bullet_graph.stories.tsx\",\n\t\"./components/tooltip/10_cartesian_chart.story.tsx\": \"./stories/components/tooltip/10_cartesian_chart.story.tsx\",\n\t\"./components/tooltip/11_partition_chart.story.tsx\": \"./stories/components/tooltip/11_partition_chart.story.tsx\",\n\t\"./components/tooltip/12_heatmap.story.tsx\": \"./stories/components/tooltip/12_heatmap.story.tsx\",\n\t\"./components/tooltip/13_flamegraph.story.tsx\": \"./stories/components/tooltip/13_flamegraph.story.tsx\",\n\t\"./components/tooltip/1_composed_list.story.tsx\": \"./stories/components/tooltip/1_composed_list.story.tsx\",\n\t\"./components/tooltip/2_composed_table.story.tsx\": \"./stories/components/tooltip/2_composed_table.story.tsx\",\n\t\"./components/tooltip/3_tabular_data.story.tsx\": \"./stories/components/tooltip/3_tabular_data.story.tsx\",\n\t\"./components/tooltip/4_actions_with_custom_tooltip.story.tsx\": \"./stories/components/tooltip/4_actions_with_custom_tooltip.story.tsx\",\n\t\"./components/tooltip/5_chart_tooltip.story.tsx\": \"./stories/components/tooltip/5_chart_tooltip.story.tsx\",\n\t\"./components/tooltip/6_async_actions.story.tsx\": \"./stories/components/tooltip/6_async_actions.story.tsx\",\n\t\"./components/tooltip/tooltip.stories.tsx\": \"./stories/components/tooltip/tooltip.stories.tsx\",\n\t\"./composable/1_basic.story.tsx\": \"./stories/composable/1_basic.story.tsx\",\n\t\"./composable/composable.stories.tsx\": \"./stories/composable/composable.stories.tsx\",\n\t\"./debug/1_basic.story.tsx\": \"./stories/debug/1_basic.story.tsx\",\n\t\"./debug/2_debug_state.story.tsx\": \"./stories/debug/2_debug_state.story.tsx\",\n\t\"./debug/debug.stories.tsx\": \"./stories/debug/debug.stories.tsx\",\n\t\"./goal/10_band_in_band.story.tsx\": \"./stories/goal/10_band_in_band.story.tsx\",\n\t\"./goal/11_gaps.story.tsx\": \"./stories/goal/11_gaps.story.tsx\",\n\t\"./goal/12_range.story.tsx\": \"./stories/goal/12_range.story.tsx\",\n\t\"./goal/13_confidence_level.story.tsx\": \"./stories/goal/13_confidence_level.story.tsx\",\n\t\"./goal/14_one_third.story.tsx\": \"./stories/goal/14_one_third.story.tsx\",\n\t\"./goal/15_half_circle.story.tsx\": \"./stories/goal/15_half_circle.story.tsx\",\n\t\"./goal/16_two_thirds.story.tsx\": \"./stories/goal/16_two_thirds.story.tsx\",\n\t\"./goal/17_three_quarters.story.tsx\": \"./stories/goal/17_three_quarters.story.tsx\",\n\t\"./goal/17_total_circle.story.tsx\": \"./stories/goal/17_total_circle.story.tsx\",\n\t\"./goal/17_very_small_gap.story.tsx\": \"./stories/goal/17_very_small_gap.story.tsx\",\n\t\"./goal/18_side_gauge.story.tsx\": \"./stories/goal/18_side_gauge.story.tsx\",\n\t\"./goal/18_side_gauge_inverted_angle_relation.story.tsx\": \"./stories/goal/18_side_gauge_inverted_angle_relation.story.tsx\",\n\t\"./goal/19_horizontal_negative.story.tsx\": \"./stories/goal/19_horizontal_negative.story.tsx\",\n\t\"./goal/20_vertical_negative.story.tsx\": \"./stories/goal/20_vertical_negative.story.tsx\",\n\t\"./goal/21_goal_negative.story.tsx\": \"./stories/goal/21_goal_negative.story.tsx\",\n\t\"./goal/22_horizontal_plusminus.story.tsx\": \"./stories/goal/22_horizontal_plusminus.story.tsx\",\n\t\"./goal/23_vertical_plusminus.story.tsx\": \"./stories/goal/23_vertical_plusminus.story.tsx\",\n\t\"./goal/24_goal_plusminus.story.tsx\": \"./stories/goal/24_goal_plusminus.story.tsx\",\n\t\"./goal/25_goal_semantic.story.tsx\": \"./stories/goal/25_goal_semantic.story.tsx\",\n\t\"./goal/26_auto_linear_ticks.story.tsx\": \"./stories/goal/26_auto_linear_ticks.story.tsx\",\n\t\"./goal/2_gauge_with_target.story.tsx\": \"./stories/goal/2_gauge_with_target.story.tsx\",\n\t\"./goal/3_horizontal_bullet.story.tsx\": \"./stories/goal/3_horizontal_bullet.story.tsx\",\n\t\"./goal/4_vertical_bullet.story.tsx\": \"./stories/goal/4_vertical_bullet.story.tsx\",\n\t\"./goal/5_minimal.story.tsx\": \"./stories/goal/5_minimal.story.tsx\",\n\t\"./goal/6_minimal_horizontal.story.tsx\": \"./stories/goal/6_minimal_horizontal.story.tsx\",\n\t\"./goal/7_horizontal_bar.story.tsx\": \"./stories/goal/7_horizontal_bar.story.tsx\",\n\t\"./goal/8_irregular_ticks.story.tsx\": \"./stories/goal/8_irregular_ticks.story.tsx\",\n\t\"./goal/9_minimal_band.story.tsx\": \"./stories/goal/9_minimal_band.story.tsx\",\n\t\"./goal/goal.stories.tsx\": \"./stories/goal/goal.stories.tsx\",\n\t\"./grids/1_basic.story.tsx\": \"./stories/grids/1_basic.story.tsx\",\n\t\"./grids/2_multiple_axes.story.tsx\": \"./stories/grids/2_multiple_axes.story.tsx\",\n\t\"./grids/3_lines.story.tsx\": \"./stories/grids/3_lines.story.tsx\",\n\t\"./grids/grids.stories.tsx\": \"./stories/grids/grids.stories.tsx\",\n\t\"./heatmap/1_basic.story.tsx\": \"./stories/heatmap/1_basic.story.tsx\",\n\t\"./heatmap/2_categorical.story.tsx\": \"./stories/heatmap/2_categorical.story.tsx\",\n\t\"./heatmap/3_time.story.tsx\": \"./stories/heatmap/3_time.story.tsx\",\n\t\"./heatmap/4_test_time_snap.story.tsx\": \"./stories/heatmap/4_test_time_snap.story.tsx\",\n\t\"./heatmap/5_theming.story.tsx\": \"./stories/heatmap/5_theming.story.tsx\",\n\t\"./heatmap/6_label_rotation.story.tsx\": \"./stories/heatmap/6_label_rotation.story.tsx\",\n\t\"./heatmap/7_sorting.story.tsx\": \"./stories/heatmap/7_sorting.story.tsx\",\n\t\"./heatmap/heatmap.stories.tsx\": \"./stories/heatmap/heatmap.stories.tsx\",\n\t\"./icicle/01_unix_icicle.story.tsx\": \"./stories/icicle/01_unix_icicle.story.tsx\",\n\t\"./icicle/02_unix_flame.story.tsx\": \"./stories/icicle/02_unix_flame.story.tsx\",\n\t\"./icicle/03_cpu_profile_flame.story.tsx\": \"./stories/icicle/03_cpu_profile_flame.story.tsx\",\n\t\"./icicle/04_cpu_profile_gl_flame.story.tsx\": \"./stories/icicle/04_cpu_profile_gl_flame.story.tsx\",\n\t\"./icicle/icicle.stories.tsx\": \"./stories/icicle/icicle.stories.tsx\",\n\t\"./interactions/10_brush_selection_bar.story.tsx\": \"./stories/interactions/10_brush_selection_bar.story.tsx\",\n\t\"./interactions/10a_brush_selection_bar_hist.story.tsx\": \"./stories/interactions/10a_brush_selection_bar_hist.story.tsx\",\n\t\"./interactions/11_brush_time.story.tsx\": \"./stories/interactions/11_brush_time.story.tsx\",\n\t\"./interactions/12_brush_time_hist.story.tsx\": \"./stories/interactions/12_brush_time_hist.story.tsx\",\n\t\"./interactions/13_brush_disabled_ordinal.story.tsx\": \"./stories/interactions/13_brush_disabled_ordinal.story.tsx\",\n\t\"./interactions/14_crosshair_time.story.tsx\": \"./stories/interactions/14_crosshair_time.story.tsx\",\n\t\"./interactions/15_render_change.story.tsx\": \"./stories/interactions/15_render_change.story.tsx\",\n\t\"./interactions/16_cursor_update_action.story.tsx\": \"./stories/interactions/16_cursor_update_action.story.tsx\",\n\t\"./interactions/17_png_export.story.tsx\": \"./stories/interactions/17_png_export.story.tsx\",\n\t\"./interactions/18_null_values.story.tsx\": \"./stories/interactions/18_null_values.story.tsx\",\n\t\"./interactions/19_multi_chart_cursor_sync.story.tsx\": \"./stories/interactions/19_multi_chart_cursor_sync.story.tsx\",\n\t\"./interactions/1_bar_clicks.story.tsx\": \"./stories/interactions/1_bar_clicks.story.tsx\",\n\t\"./interactions/2_area_point_clicks.story.tsx\": \"./stories/interactions/2_area_point_clicks.story.tsx\",\n\t\"./interactions/3_line_point_clicks.story.tsx\": \"./stories/interactions/3_line_point_clicks.story.tsx\",\n\t\"./interactions/4_line_area_bar_clicks.story.tsx\": \"./stories/interactions/4_line_area_bar_clicks.story.tsx\",\n\t\"./interactions/4_sunburst_slice_clicks.story.tsx\": \"./stories/interactions/4_sunburst_slice_clicks.story.tsx\",\n\t\"./interactions/5_clicks_legend_items_bar.story.tsx\": \"./stories/interactions/5_clicks_legend_items_bar.story.tsx\",\n\t\"./interactions/6_clicks_legend_items_area.story.tsx\": \"./stories/interactions/6_clicks_legend_items_area.story.tsx\",\n\t\"./interactions/7_clicks_legend_items_line.story.tsx\": \"./stories/interactions/7_clicks_legend_items_line.story.tsx\",\n\t\"./interactions/8_clicks_legend_items_mixed.story.tsx\": \"./stories/interactions/8_clicks_legend_items_mixed.story.tsx\",\n\t\"./interactions/9_brush_selection_linear.story.tsx\": \"./stories/interactions/9_brush_selection_linear.story.tsx\",\n\t\"./interactions/9a_brush_selection_linear.story.tsx\": \"./stories/interactions/9a_brush_selection_linear.story.tsx\",\n\t\"./interactions/interactions.stories.tsx\": \"./stories/interactions/interactions.stories.tsx\",\n\t\"./legend/10_sunburst.story.tsx\": \"./stories/legend/10_sunburst.story.tsx\",\n\t\"./legend/10_sunburst_repeated_label.story.tsx\": \"./stories/legend/10_sunburst_repeated_label.story.tsx\",\n\t\"./legend/11_legend_actions.story.tsx\": \"./stories/legend/11_legend_actions.story.tsx\",\n\t\"./legend/12_legend_margins.story.tsx\": \"./stories/legend/12_legend_margins.story.tsx\",\n\t\"./legend/13_inside_chart.story.tsx\": \"./stories/legend/13_inside_chart.story.tsx\",\n\t\"./legend/14_single_series.story.tsx\": \"./stories/legend/14_single_series.story.tsx\",\n\t\"./legend/15_legend_sort.story.tsx\": \"./stories/legend/15_legend_sort.story.tsx\",\n\t\"./legend/16_custom_legend.story.tsx\": \"./stories/legend/16_custom_legend.story.tsx\",\n\t\"./legend/1_legend_positioning.story.tsx\": \"./stories/legend/1_legend_positioning.story.tsx\",\n\t\"./legend/5_changing_specs.story.tsx\": \"./stories/legend/5_changing_specs.story.tsx\",\n\t\"./legend/6_hide_legend.story.tsx\": \"./stories/legend/6_hide_legend.story.tsx\",\n\t\"./legend/8_spacing_buffer.story.tsx\": \"./stories/legend/8_spacing_buffer.story.tsx\",\n\t\"./legend/9_color_picker.story.tsx\": \"./stories/legend/9_color_picker.story.tsx\",\n\t\"./legend/legend.stories.tsx\": \"./stories/legend/legend.stories.tsx\",\n\t\"./line/10_test_path_ordering.story.tsx\": \"./stories/line/10_test_path_ordering.story.tsx\",\n\t\"./line/11_discontinuous_data_points.story.tsx\": \"./stories/line/11_discontinuous_data_points.story.tsx\",\n\t\"./line/12_isolated_data_points.story.tsx\": \"./stories/line/12_isolated_data_points.story.tsx\",\n\t\"./line/13_line_mark_accessor.story.tsx\": \"./stories/line/13_line_mark_accessor.story.tsx\",\n\t\"./line/14_point_shapes.story.tsx\": \"./stories/line/14_point_shapes.story.tsx\",\n\t\"./line/15_test_negative_points.story.tsx\": \"./stories/line/15_test_negative_points.story.tsx\",\n\t\"./line/1_basic.story.tsx\": \"./stories/line/1_basic.story.tsx\",\n\t\"./line/2_w_axis.story.tsx\": \"./stories/line/2_w_axis.story.tsx\",\n\t\"./line/3_ordinal.story.tsx\": \"./stories/line/3_ordinal.story.tsx\",\n\t\"./line/4_linear.story.tsx\": \"./stories/line/4_linear.story.tsx\",\n\t\"./line/5_w_axis_and_legend.story.tsx\": \"./stories/line/5_w_axis_and_legend.story.tsx\",\n\t\"./line/6_curved.story.tsx\": \"./stories/line/6_curved.story.tsx\",\n\t\"./line/7_multiple.story.tsx\": \"./stories/line/7_multiple.story.tsx\",\n\t\"./line/8_stacked.story.tsx\": \"./stories/line/8_stacked.story.tsx\",\n\t\"./line/9_multi_series.story.tsx\": \"./stories/line/9_multi_series.story.tsx\",\n\t\"./line/line.stories.tsx\": \"./stories/line/line.stories.tsx\",\n\t\"./metric/1_basic.story.tsx\": \"./stories/metric/1_basic.story.tsx\",\n\t\"./metric/2_grid.story.tsx\": \"./stories/metric/2_grid.story.tsx\",\n\t\"./metric/3_body.story.tsx\": \"./stories/metric/3_body.story.tsx\",\n\t\"./metric/metric.stories.tsx\": \"./stories/metric/metric.stories.tsx\",\n\t\"./mixed/1_bars_and_lines.story.tsx\": \"./stories/mixed/1_bars_and_lines.story.tsx\",\n\t\"./mixed/2_lines_and_areas.story.tsx\": \"./stories/mixed/2_lines_and_areas.story.tsx\",\n\t\"./mixed/3_areas_and_bars.story.tsx\": \"./stories/mixed/3_areas_and_bars.story.tsx\",\n\t\"./mixed/4_test_bar.story.tsx\": \"./stories/mixed/4_test_bar.story.tsx\",\n\t\"./mixed/5_test_bar_time.story.tsx\": \"./stories/mixed/5_test_bar_time.story.tsx\",\n\t\"./mixed/6_fitting.story.tsx\": \"./stories/mixed/6_fitting.story.tsx\",\n\t\"./mixed/6_fitting_stacked.story.tsx\": \"./stories/mixed/6_fitting_stacked.story.tsx\",\n\t\"./mixed/7_marks.story.tsx\": \"./stories/mixed/7_marks.story.tsx\",\n\t\"./mixed/8_polarized_stacked.story.tsx\": \"./stories/mixed/8_polarized_stacked.story.tsx\",\n\t\"./mixed/mixed.stories.tsx\": \"./stories/mixed/mixed.stories.tsx\",\n\t\"./mosaic/10_mosaic_simple.story.tsx\": \"./stories/mosaic/10_mosaic_simple.story.tsx\",\n\t\"./mosaic/20_mosaic_with_other.story.tsx\": \"./stories/mosaic/20_mosaic_with_other.story.tsx\",\n\t\"./mosaic/mosaic.stories.tsx\": \"./stories/mosaic/mosaic.stories.tsx\",\n\t\"./rotations/1_ordinal.story.tsx\": \"./stories/rotations/1_ordinal.story.tsx\",\n\t\"./rotations/2_negative_ordinal.story.tsx\": \"./stories/rotations/2_negative_ordinal.story.tsx\",\n\t\"./rotations/3_rotations_ordinal.story.tsx\": \"./stories/rotations/3_rotations_ordinal.story.tsx\",\n\t\"./rotations/4_90_ordinal.story.tsx\": \"./stories/rotations/4_90_ordinal.story.tsx\",\n\t\"./rotations/5_180_ordinal.story.tsx\": \"./stories/rotations/5_180_ordinal.story.tsx\",\n\t\"./rotations/6_negative_linear.story.tsx\": \"./stories/rotations/6_negative_linear.story.tsx\",\n\t\"./rotations/7_rotations_linear.story.tsx\": \"./stories/rotations/7_rotations_linear.story.tsx\",\n\t\"./rotations/8_90_deg_linear.story.tsx\": \"./stories/rotations/8_90_deg_linear.story.tsx\",\n\t\"./rotations/9_180_deg_linear.story.tsx\": \"./stories/rotations/9_180_deg_linear.story.tsx\",\n\t\"./rotations/rotations.stories.tsx\": \"./stories/rotations/rotations.stories.tsx\",\n\t\"./scales/1_different_timezones.story.tsx\": \"./stories/scales/1_different_timezones.story.tsx\",\n\t\"./scales/2_local_tooltip.story.tsx\": \"./stories/scales/2_local_tooltip.story.tsx\",\n\t\"./scales/3_utc_tooltip.story.tsx\": \"./stories/scales/3_utc_tooltip.story.tsx\",\n\t\"./scales/4_specified_timezone.story.tsx\": \"./stories/scales/4_specified_timezone.story.tsx\",\n\t\"./scales/6_x_scale_fallback.story.tsx\": \"./stories/scales/6_x_scale_fallback.story.tsx\",\n\t\"./scales/7_log_scale_options.story.tsx\": \"./stories/scales/7_log_scale_options.story.tsx\",\n\t\"./scales/8_linear_binary.story.tsx\": \"./stories/scales/8_linear_binary.story.tsx\",\n\t\"./scales/scales.stories.tsx\": \"./stories/scales/scales.stories.tsx\",\n\t\"./small_multiples/2_vertical_areas.story.tsx\": \"./stories/small_multiples/2_vertical_areas.story.tsx\",\n\t\"./small_multiples/3_grid_lines.story.tsx\": \"./stories/small_multiples/3_grid_lines.story.tsx\",\n\t\"./small_multiples/4_horizontal_bars.story.tsx\": \"./stories/small_multiples/4_horizontal_bars.story.tsx\",\n\t\"./small_multiples/4_vertical_bars.story.tsx\": \"./stories/small_multiples/4_vertical_bars.story.tsx\",\n\t\"./small_multiples/5_histogram_bars.story.tsx\": \"./stories/small_multiples/5_histogram_bars.story.tsx\",\n\t\"./small_multiples/6_heterogeneous_cartesians.story.tsx\": \"./stories/small_multiples/6_heterogeneous_cartesians.story.tsx\",\n\t\"./small_multiples/7_sunbursts.story.tsx\": \"./stories/small_multiples/7_sunbursts.story.tsx\",\n\t\"./small_multiples/8_sorting.story.tsx\": \"./stories/small_multiples/8_sorting.story.tsx\",\n\t\"./small_multiples/9_heatmap.story.tsx\": \"./stories/small_multiples/9_heatmap.story.tsx\",\n\t\"./small_multiples/small_multiples.stories.tsx\": \"./stories/small_multiples/small_multiples.stories.tsx\",\n\t\"./streamgraph/1_basic.story.tsx\": \"./stories/streamgraph/1_basic.story.tsx\",\n\t\"./streamgraph/streamgraph.stories.tsx\": \"./stories/streamgraph/streamgraph.stories.tsx\",\n\t\"./stylings/10_custom_bars.story.tsx\": \"./stories/stylings/10_custom_bars.story.tsx\",\n\t\"./stylings/11_custom_lines.story.tsx\": \"./stories/stylings/11_custom_lines.story.tsx\",\n\t\"./stylings/12_custom_area.story.tsx\": \"./stories/stylings/12_custom_area.story.tsx\",\n\t\"./stylings/13_custom_series_name.story.tsx\": \"./stories/stylings/13_custom_series_name.story.tsx\",\n\t\"./stylings/13_custom_series_name_config.story.tsx\": \"./stories/stylings/13_custom_series_name_config.story.tsx\",\n\t\"./stylings/14_custom_series_name_formatting.story.tsx\": \"./stories/stylings/14_custom_series_name_formatting.story.tsx\",\n\t\"./stylings/15_tick_label.story.tsx\": \"./stories/stylings/15_tick_label.story.tsx\",\n\t\"./stylings/16_style_accessor.story.tsx\": \"./stories/stylings/16_style_accessor.story.tsx\",\n\t\"./stylings/17_bar_series_color_variant.story.tsx\": \"./stories/stylings/17_bar_series_color_variant.story.tsx\",\n\t\"./stylings/18_line_series_color_variant.story.tsx\": \"./stories/stylings/18_line_series_color_variant.story.tsx\",\n\t\"./stylings/19_area_series_color_variant.story.tsx\": \"./stories/stylings/19_area_series_color_variant.story.tsx\",\n\t\"./stylings/1_chart_size.story.tsx\": \"./stories/stylings/1_chart_size.story.tsx\",\n\t\"./stylings/20_partition_background.story.tsx\": \"./stories/stylings/20_partition_background.story.tsx\",\n\t\"./stylings/21_partition_labels.story.tsx\": \"./stories/stylings/21_partition_labels.story.tsx\",\n\t\"./stylings/22_dark_theme.story.tsx\": \"./stories/stylings/22_dark_theme.story.tsx\",\n\t\"./stylings/23_with_texture.story.tsx\": \"./stories/stylings/23_with_texture.story.tsx\",\n\t\"./stylings/24_texture_multiple_series.story.tsx\": \"./stories/stylings/24_texture_multiple_series.story.tsx\",\n\t\"./stylings/25_mixed_point_shapes.story.tsx\": \"./stories/stylings/25_mixed_point_shapes.story.tsx\",\n\t\"./stylings/26_highlighter_style.story.tsx\": \"./stories/stylings/26_highlighter_style.story.tsx\",\n\t\"./stylings/2_margins.story.tsx\": \"./stories/stylings/2_margins.story.tsx\",\n\t\"./stylings/3_axis.story.tsx\": \"./stories/stylings/3_axis.story.tsx\",\n\t\"./stylings/4_theme_styling.story.tsx\": \"./stories/stylings/4_theme_styling.story.tsx\",\n\t\"./stylings/5_partial_custom_theme.story.tsx\": \"./stories/stylings/5_partial_custom_theme.story.tsx\",\n\t\"./stylings/6_partial_and_base.story.tsx\": \"./stories/stylings/6_partial_and_base.story.tsx\",\n\t\"./stylings/7_multiple_custom.story.tsx\": \"./stories/stylings/7_multiple_custom.story.tsx\",\n\t\"./stylings/8_custom_series_colors_array.story.tsx\": \"./stories/stylings/8_custom_series_colors_array.story.tsx\",\n\t\"./stylings/9_custom_series_colors_function.story.tsx\": \"./stories/stylings/9_custom_series_colors_function.story.tsx\",\n\t\"./stylings/stylings.stories.tsx\": \"./stories/stylings/stylings.stories.tsx\",\n\t\"./sunburst/10_2_slice.story.tsx\": \"./stories/sunburst/10_2_slice.story.tsx\",\n\t\"./sunburst/11_small_large.story.tsx\": \"./stories/sunburst/11_small_large.story.tsx\",\n\t\"./sunburst/12_very_small.story.tsx\": \"./stories/sunburst/12_very_small.story.tsx\",\n\t\"./sunburst/13_empty.story.tsx\": \"./stories/sunburst/13_empty.story.tsx\",\n\t\"./sunburst/14_full_zero.story.tsx\": \"./stories/sunburst/14_full_zero.story.tsx\",\n\t\"./sunburst/15_single.story.tsx\": \"./stories/sunburst/15_single.story.tsx\",\n\t\"./sunburst/15_single_sunburst.story.tsx\": \"./stories/sunburst/15_single_sunburst.story.tsx\",\n\t\"./sunburst/16_single_small.story.tsx\": \"./stories/sunburst/16_single_small.story.tsx\",\n\t\"./sunburst/17_single_very_small.story.tsx\": \"./stories/sunburst/17_single_very_small.story.tsx\",\n\t\"./sunburst/18_no_sliced.story.tsx\": \"./stories/sunburst/18_no_sliced.story.tsx\",\n\t\"./sunburst/19_negative.story.tsx\": \"./stories/sunburst/19_negative.story.tsx\",\n\t\"./sunburst/1_simple.story.tsx\": \"./stories/sunburst/1_simple.story.tsx\",\n\t\"./sunburst/20_total_zero.story.tsx\": \"./stories/sunburst/20_total_zero.story.tsx\",\n\t\"./sunburst/21_high_pie.story.tsx\": \"./stories/sunburst/21_high_pie.story.tsx\",\n\t\"./sunburst/22_counter_clockwise.story.tsx\": \"./stories/sunburst/22_counter_clockwise.story.tsx\",\n\t\"./sunburst/23_clockwise.story.tsx\": \"./stories/sunburst/23_clockwise.story.tsx\",\n\t\"./sunburst/24_linked_label.story.tsx\": \"./stories/sunburst/24_linked_label.story.tsx\",\n\t\"./sunburst/25_no_labels.story.tsx\": \"./stories/sunburst/25_no_labels.story.tsx\",\n\t\"./sunburst/26_percentage.story.tsx\": \"./stories/sunburst/26_percentage.story.tsx\",\n\t\"./sunburst/27_heterogeneous_depth.story.tsx\": \"./stories/sunburst/27_heterogeneous_depth.story.tsx\",\n\t\"./sunburst/28_not_a_number.story.tsx\": \"./stories/sunburst/28_not_a_number.story.tsx\",\n\t\"./sunburst/29_custom_stroke.story.tsx\": \"./stories/sunburst/29_custom_stroke.story.tsx\",\n\t\"./sunburst/2_value_formatted.story.tsx\": \"./stories/sunburst/2_value_formatted.story.tsx\",\n\t\"./sunburst/30_largest_circle.story.tsx\": \"./stories/sunburst/30_largest_circle.story.tsx\",\n\t\"./sunburst/31_bold_link_value.story.tsx\": \"./stories/sunburst/31_bold_link_value.story.tsx\",\n\t\"./sunburst/32_custom_tooltip.story.tsx\": \"./stories/sunburst/32_custom_tooltip.story.tsx\",\n\t\"./sunburst/33_ordered_slices.story.tsx\": \"./stories/sunburst/33_ordered_slices.story.tsx\",\n\t\"./sunburst/3_value_formatted_2.story.tsx\": \"./stories/sunburst/3_value_formatted_2.story.tsx\",\n\t\"./sunburst/4_fill_labels.story.tsx\": \"./stories/sunburst/4_fill_labels.story.tsx\",\n\t\"./sunburst/5_donut.story.tsx\": \"./stories/sunburst/5_donut.story.tsx\",\n\t\"./sunburst/6_pie_chart_labels.story.tsx\": \"./stories/sunburst/6_pie_chart_labels.story.tsx\",\n\t\"./sunburst/6_pie_chart_linked_labels.story.tsx\": \"./stories/sunburst/6_pie_chart_linked_labels.story.tsx\",\n\t\"./sunburst/7_zero_slice.story.tsx\": \"./stories/sunburst/7_zero_slice.story.tsx\",\n\t\"./sunburst/8_sunburst_two_layers.story.tsx\": \"./stories/sunburst/8_sunburst_two_layers.story.tsx\",\n\t\"./sunburst/9_sunburst_three_layers.story.tsx\": \"./stories/sunburst/9_sunburst_three_layers.story.tsx\",\n\t\"./sunburst/sunburst.stories.tsx\": \"./stories/sunburst/sunburst.stories.tsx\",\n\t\"./test_cases/10_highlighter_z_index.story.tsx\": \"./stories/test_cases/10_highlighter_z_index.story.tsx\",\n\t\"./test_cases/1_no_series.story.tsx\": \"./stories/test_cases/1_no_series.story.tsx\",\n\t\"./test_cases/21_domain_edges.story.tsx\": \"./stories/test_cases/21_domain_edges.story.tsx\",\n\t\"./test_cases/2_chrome_path_bug_fix.story.tsx\": \"./stories/test_cases/2_chrome_path_bug_fix.story.tsx\",\n\t\"./test_cases/3_no_axes_annotation.story.tsx\": \"./stories/test_cases/3_no_axes_annotation.story.tsx\",\n\t\"./test_cases/4_filter_zero_values_log.story.tsx\": \"./stories/test_cases/4_filter_zero_values_log.story.tsx\",\n\t\"./test_cases/5_legend_scroll_bar_sizing.story.tsx\": \"./stories/test_cases/5_legend_scroll_bar_sizing.story.tsx\",\n\t\"./test_cases/6_a11y_custom_description.story.tsx\": \"./stories/test_cases/6_a11y_custom_description.story.tsx\",\n\t\"./test_cases/7_rtl_text.story.tsx\": \"./stories/test_cases/7_rtl_text.story.tsx\",\n\t\"./test_cases/8_test_points_outside_of_domain.story.tsx\": \"./stories/test_cases/8_test_points_outside_of_domain.story.tsx\",\n\t\"./test_cases/9_duplicate_labels_in_partition_legend.story.tsx\": \"./stories/test_cases/9_duplicate_labels_in_partition_legend.story.tsx\",\n\t\"./test_cases/test_cases.stories.tsx\": \"./stories/test_cases/test_cases.stories.tsx\",\n\t\"./timeslip/01_timeslip.story.tsx\": \"./stories/timeslip/01_timeslip.story.tsx\",\n\t\"./timeslip/timeslip.stories.tsx\": \"./stories/timeslip/timeslip.stories.tsx\",\n\t\"./treemap/10_three_layers.story.tsx\": \"./stories/treemap/10_three_layers.story.tsx\",\n\t\"./treemap/1_one_layer.story.tsx\": \"./stories/treemap/1_one_layer.story.tsx\",\n\t\"./treemap/2_one_layer_2.story.tsx\": \"./stories/treemap/2_one_layer_2.story.tsx\",\n\t\"./treemap/3_mid_two.story.tsx\": \"./stories/treemap/3_mid_two.story.tsx\",\n\t\"./treemap/4_two_layer_stress.story.tsx\": \"./stories/treemap/4_two_layer_stress.story.tsx\",\n\t\"./treemap/5_multicolor.story.tsx\": \"./stories/treemap/5_multicolor.story.tsx\",\n\t\"./treemap/6_custom_style.story.tsx\": \"./stories/treemap/6_custom_style.story.tsx\",\n\t\"./treemap/7_percentage.story.tsx\": \"./stories/treemap/7_percentage.story.tsx\",\n\t\"./treemap/8_groove_text.story.tsx\": \"./stories/treemap/8_groove_text.story.tsx\",\n\t\"./treemap/9_zero_values.story.tsx\": \"./stories/treemap/9_zero_values.story.tsx\",\n\t\"./treemap/treemap.stories.tsx\": \"./stories/treemap/treemap.stories.tsx\",\n\t\"./utils/text/1_wrap.story.tsx\": \"./stories/utils/text/1_wrap.story.tsx\",\n\t\"./utils/text/text.stories.tsx\": \"./stories/utils/text/text.stories.tsx\",\n\t\"./waffle/1_simple.story.tsx\": \"./stories/waffle/1_simple.story.tsx\",\n\t\"./waffle/2_test.story.tsx\": \"./stories/waffle/2_test.story.tsx\",\n\t\"./waffle/waffle.stories.tsx\": \"./stories/waffle/waffle.stories.tsx\",\n\t\"./wordcloud/1_wordcloud.story.tsx\": \"./stories/wordcloud/1_wordcloud.story.tsx\",\n\t\"./wordcloud/wordcloud.stories.tsx\": \"./stories/wordcloud/wordcloud.stories.tsx\"\n};\n\n\nfunction webpackContext(req) {\n\tvar id = webpackContextResolve(req);\n\treturn __webpack_require__(id);\n}\nfunction webpackContextResolve(req) {\n\tif(!__webpack_require__.o(map, req)) {\n\t\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\t\te.code = 'MODULE_NOT_FOUND';\n\t\tthrow e;\n\t}\n\treturn map[req];\n}\nwebpackContext.keys = function webpackContextKeys() {\n\treturn Object.keys(map);\n};\nwebpackContext.resolve = webpackContextResolve;\nmodule.exports = webpackContext;\nwebpackContext.id = \"./stories sync recursive ^\\\\.(?:(?:^|\\\\/|(?:(?:(?!(?:^|\\\\/)\\\\.).)*?)\\\\/)(?!\\\\.)(?=.)[^/]*?\\\\.(stories|story)\\\\.ts(?:x)?)$\";","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  LineAnnotationStyle,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n  const data = customKnobs.array('data values', [2.5, 7.2]);\\n  const dataValues = generateAnnotationData(data);\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: 3,\\n      stroke: '#f00',\\n      opacity: 1,\\n    },\\n  };\\n\\n  const isBottom = boolean('x domain axis is bottom', true);\\n  const axisPosition = isBottom ? Position.Bottom : Position.Top;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={axisPosition} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":83},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":83}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  LineAnnotationStyle,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const markerPosition = select(\n    'marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const rotation = customKnobs.enum.rotation();\n  const data = customKnobs.array('data values', [2.5, 7.2]);\n  const dataValues = generateAnnotationData(data);\n\n  const style: Partial<LineAnnotationStyle> = {\n    line: {\n      strokeWidth: 3,\n      stroke: '#f00',\n      opacity: 1,\n    },\n  };\n\n  const isBottom = boolean('x domain axis is bottom', true);\n  const axisPosition = isBottom ? Position.Bottom : Position.Top;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        style={style}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\n      />\n      <Axis id=\"horizontal\" position={axisPosition} title=\"x-domain axis\" />\n      <Axis id=\"vertical\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n  const data = customKnobs.array('data values', [2.5, 7.2]);\\n  const dataValues = generateAnnotationData(data);\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: 3,\\n      stroke: '#f00',\\n      opacity: 1,\\n    },\\n  };\\n\\n  const isBottom = boolean('x domain axis is bottom', true);\\n  const axisPosition = isBottom ? Position.Bottom : Position.Top;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={axisPosition} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"x-domain axis (top)\\\" />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis (bottom)\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":70},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":70}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const markerPosition = select(\n    'marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const rotation = customKnobs.enum.rotation();\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\n      />\n      <Axis id=\"top\" position={Position.Top} title=\"x-domain axis (top)\" />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis (bottom)\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'a', y: 2 },\n          { x: 'b', y: 7 },\n          { x: 'c', y: 3 },\n          { x: 'd', y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"x-domain axis (top)\\\" />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis (bottom)\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { getDebugStateLogger } from '../../utils/debug_state_logger';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nconst dateFormatter = timeFormatter('HH:mm:ss');\\n\\nfunction generateTimeAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({\\n    dataValue: value,\\n    details: `detail-${index}`,\\n    header: dateFormatter(value),\\n  }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('Enable debug state', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const dataValues = generateTimeAnnotationData([\\n    1551438150000, 1551438180000, 1551438390000, 1551438450000, 1551438480000,\\n  ]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        rotation={rotation}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" tickFormat={dateFormatter} />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":84},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":84}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { getDebugStateLogger } from '../../utils/debug_state_logger';\nimport { customKnobs } from '../../utils/knobs';\n\nconst dateFormatter = timeFormatter('HH:mm:ss');\n\nfunction generateTimeAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({\n    dataValue: value,\n    details: `detail-${index}`,\n    header: dateFormatter(value),\n  }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('Enable debug state', false);\n  const markerPosition = select(\n    'marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const rotation = customKnobs.enum.rotation();\n\n  const dataValues = generateTimeAnnotationData([\n    1551438150000, 1551438180000, 1551438390000, 1551438450000, 1551438480000,\n  ]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        rotation={rotation}\n        baseTheme={useBaseTheme()}\n      />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" tickFormat={dateFormatter} />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('Enable debug state', false);\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const dataValues = generateTimeAnnotationData([\\n    1551438150000, 1551438180000, 1551438390000, 1551438450000, 1551438480000,\\n  ]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        rotation={rotation}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" tickFormat={dateFormatter} />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const data = customKnobs.array('data values', [1.5, 7.2]);\\n  const dataValues = generateAnnotationData(data);\\n\\n  const isLeft = boolean('y-domain axis is Position.Left', true);\\n  const axisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n  const axisPosition = isLeft ? Position.Left : Position.Right;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title={axisTitle} position={axisPosition} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":75},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":75}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n  const markerPosition = select(\n    'marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const data = customKnobs.array('data values', [1.5, 7.2]);\n  const dataValues = generateAnnotationData(data);\n\n  const isLeft = boolean('y-domain axis is Position.Left', true);\n  const axisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\n  const axisPosition = isLeft ? Position.Left : Position.Right;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.YDomain}\n        dataValues={dataValues}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title={axisTitle} position={axisPosition} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const markerPosition = select(\\n    'marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const data = customKnobs.array('data values', [1.5, 7.2]);\\n  const dataValues = generateAnnotationData(data);\\n\\n  const isLeft = boolean('y-domain axis is Position.Left', true);\\n  const axisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n  const axisPosition = isLeft ? Position.Left : Position.Right;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        dataValues={dataValues}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={markerPosition === 'undefined' ? undefined : markerPosition}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title={axisTitle} position={axisPosition} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  ScaleType,\\n  Settings,\\n  LineAnnotationStyle,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const data = [2.5, 7.2];\\n  const dataValues = generateAnnotationData(data);\\n\\n  const dashWidth = number('dash line width', 5);\\n  const dashGapWidth = number('dash gap width', 8);\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: number('line stroke width', 5),\\n      stroke: color('line & marker color', 'blue'),\\n      dash: [dashWidth, dashGapWidth],\\n      opacity: number('line opacity', 0.5, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const axisPosition = Position.Bottom;\\n\\n  const marker = select<'alert' | 'eye' | 'questionInCircle'>(\\n    'marker icon (Examples from internal Icon library)',\\n    {\\n      alert: 'alert',\\n      eye: 'eye',\\n      questionInCircle: 'questionInCircle',\\n    },\\n    'alert',\\n  );\\n\\n  const hideLines = boolean('annotation lines hidden', false);\\n  const hideTooltips = boolean('annotation tooltips hidden', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n        marker={<Icon type={marker} />}\\n        hideLines={hideLines}\\n        hideTooltips={hideTooltips}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={axisPosition} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":101},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":101}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationDatum,\n  ScaleType,\n  Settings,\n  LineAnnotationStyle,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n\n  const data = [2.5, 7.2];\n  const dataValues = generateAnnotationData(data);\n\n  const dashWidth = number('dash line width', 5);\n  const dashGapWidth = number('dash gap width', 8);\n\n  const style: Partial<LineAnnotationStyle> = {\n    line: {\n      strokeWidth: number('line stroke width', 5),\n      stroke: color('line & marker color', 'blue'),\n      dash: [dashWidth, dashGapWidth],\n      opacity: number('line opacity', 0.5, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n\n  const axisPosition = Position.Bottom;\n\n  const marker = select<'alert' | 'eye' | 'questionInCircle'>(\n    'marker icon (Examples from internal Icon library)',\n    {\n      alert: 'alert',\n      eye: 'eye',\n      questionInCircle: 'questionInCircle',\n    },\n    'alert',\n  );\n\n  const hideLines = boolean('annotation lines hidden', false);\n  const hideTooltips = boolean('annotation tooltips hidden', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        style={style}\n        marker={<Icon type={marker} />}\n        hideLines={hideLines}\n        hideTooltips={hideTooltips}\n      />\n      <Axis id=\"horizontal\" position={axisPosition} title=\"x-domain axis\" />\n      <Axis id=\"vertical\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const data = [2.5, 7.2];\\n  const dataValues = generateAnnotationData(data);\\n\\n  const dashWidth = number('dash line width', 5);\\n  const dashGapWidth = number('dash gap width', 8);\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: number('line stroke width', 5),\\n      stroke: color('line & marker color', 'blue'),\\n      dash: [dashWidth, dashGapWidth],\\n      opacity: number('line opacity', 0.5, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const axisPosition = Position.Bottom;\\n\\n  const marker = select<'alert' | 'eye' | 'questionInCircle'>(\\n    'marker icon (Examples from internal Icon library)',\\n    {\\n      alert: 'alert',\\n      eye: 'eye',\\n      questionInCircle: 'questionInCircle',\\n    },\\n    'alert',\\n  );\\n\\n  const hideLines = boolean('annotation lines hidden', false);\\n  const hideTooltips = boolean('annotation tooltips hidden', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n        marker={<Icon type={marker} />}\\n        hideLines={hideLines}\\n        hideTooltips={hideTooltips}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={axisPosition} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineAnnotation,\\n  LineAnnotationStyle,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const dataValues = [\\n    {\\n      dataValue: 3.5,\\n    },\\n  ];\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: 3,\\n      stroke: '#f00',\\n      opacity: 1,\\n    },\\n  };\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: NaN,\\n    minInterval: 1,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        enableHistogramMode\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 3, y: 2 }]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  Axis,\n  BarSeries,\n  Chart,\n  LineAnnotation,\n  LineAnnotationStyle,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n\n  const dataValues = [\n    {\n      dataValue: 3.5,\n    },\n  ];\n\n  const style: Partial<LineAnnotationStyle> = {\n    line: {\n      strokeWidth: 3,\n      stroke: '#f00',\n      opacity: 1,\n    },\n  };\n\n  const xDomain = {\n    min: NaN,\n    max: NaN,\n    minInterval: 1,\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} xDomain={xDomain} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={dataValues}\n        style={style}\n      />\n      <Axis id=\"horizontal\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"vertical\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        enableHistogramMode\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[{ x: 3, y: 2 }]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const dataValues = [\\n    {\\n      dataValue: 3.5,\\n    },\\n  ];\\n\\n  const style: Partial<LineAnnotationStyle> = {\\n    line: {\\n      strokeWidth: 3,\\n      stroke: '#f00',\\n      opacity: 1,\\n    },\\n  };\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: NaN,\\n    minInterval: 1,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={dataValues}\\n        style={style}\\n      />\\n      <Axis id=\\\"horizontal\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"vertical\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        enableHistogramMode\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 3, y: 2 }]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationTooltipFormatter,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  ScaleType,\\n  Settings,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n  LineAnnotationDatum,\\n} from '@elastic/charts';\\nimport { CustomAnnotationTooltip } from '@elastic/charts/src/chart_types/xy_chart/annotations/types';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const boundary = customKnobs.enum.boundary();\\n  const placement = customKnobs.enum.placement('Tooltip placement');\\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\\n  const offset = number('tooltip offset', 10);\\n  const showCustomTooltip = boolean('custom tooltip', false);\\n  const showCustomDetails = boolean('custom tooltip details', false);\\n\\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\\n\\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\\n    ? ({ header, details }) => (\\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\\n          <h2>custom tooltip -{header}</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\\n    ? (details) => (\\n        <div>\\n          <h2>custom Details</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        offset={offset}\\n        dataValues={dataValues}\\n        boundary={boundary}\\n        placement={placement}\\n        fallbackPlacements={fallbackPlacements}\\n        customTooltip={customTooltip}\\n        customTooltipDetails={customTooltipDetails}\\n        marker={<Icon type=\\\"alert\\\" />}\\n      />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"x-domain axis (top)\\\" />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis (bottom)\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":96},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":96}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationTooltipFormatter,\n  Axis,\n  BarSeries,\n  Chart,\n  ScaleType,\n  Settings,\n  LineAnnotation,\n  AnnotationDomainType,\n  LineAnnotationDatum,\n} from '@elastic/charts';\nimport { CustomAnnotationTooltip } from '@elastic/charts/src/chart_types/xy_chart/annotations/types';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rotation = customKnobs.enum.rotation();\n  const boundary = customKnobs.enum.boundary();\n  const placement = customKnobs.enum.placement('Tooltip placement');\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\n  const offset = number('tooltip offset', 10);\n  const showCustomTooltip = boolean('custom tooltip', false);\n  const showCustomDetails = boolean('custom tooltip details', false);\n\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\n\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\n    ? ({ header, details }) => (\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\n          <h2>custom tooltip -{header}</h2>\n          <p>{details}</p>\n        </div>\n      )\n    : undefined;\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\n    ? (details) => (\n        <div>\n          <h2>custom Details</h2>\n          <p>{details}</p>\n        </div>\n      )\n    : undefined;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        id=\"annotation_1\"\n        domainType={AnnotationDomainType.XDomain}\n        offset={offset}\n        dataValues={dataValues}\n        boundary={boundary}\n        placement={placement}\n        fallbackPlacements={fallbackPlacements}\n        customTooltip={customTooltip}\n        customTooltipDetails={customTooltipDetails}\n        marker={<Icon type=\"alert\" />}\n      />\n      <Axis id=\"top\" position={Position.Top} title=\"x-domain axis (top)\" />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis (bottom)\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'a', y: 2 },\n          { x: 'b', y: 7 },\n          { x: 'c', y: 3 },\n          { x: 'd', y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const boundary = customKnobs.enum.boundary();\\n  const placement = customKnobs.enum.placement('Tooltip placement');\\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\\n  const offset = number('tooltip offset', 10);\\n  const showCustomTooltip = boolean('custom tooltip', false);\\n  const showCustomDetails = boolean('custom tooltip details', false);\\n\\n  const dataValues = generateAnnotationData(customKnobs.array('annotation values', ['a', 'c']));\\n\\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\\n    ? ({ header, details }) => (\\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\\n          <h2>custom tooltip -{header}</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\\n    ? (details) => (\\n        <div>\\n          <h2>custom Details</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        id=\\\"annotation_1\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        offset={offset}\\n        dataValues={dataValues}\\n        boundary={boundary}\\n        placement={placement}\\n        fallbackPlacements={fallbackPlacements}\\n        customTooltip={customTooltip}\\n        customTooltipDetails={customTooltipDetails}\\n        marker={<Icon type=\\\"alert\\\" />}\\n      />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"x-domain axis (top)\\\" />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis (bottom)\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiIcon } from '@elastic/eui';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Axis,\\n  Settings,\\n  HistogramBarSeries,\\n  Position,\\n  ScaleType,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n  LineAnnotationSpec,\\n} from '@elastic/charts';\\nimport { isVerticalAxis } from '@elastic/charts/src/chart_types/xy_chart/utils/axis_type_utils';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nconst annotationStyle = {\\n  line: {\\n    strokeWidth: 1,\\n    stroke: 'red',\\n    opacity: 1,\\n  },\\n};\\n\\nconst iconMap = {\\n  [Position.Top]: 'arrowDown',\\n  [Position.Right]: 'arrowLeft',\\n  [Position.Bottom]: 'arrowUp',\\n  [Position.Left]: 'arrowRight',\\n};\\n\\n/**\\n * Used to rotate text while maintaining correct parent dimensions\\n * https://www.kizu.ru/rotated-text/\\n */\\nconst getMarkerBody =\\n  (valueCb: (v: any) => string, isVertical: boolean): LineAnnotationSpec['markerBody'] =>\\n  ({ dataValue }) =>\\n    isVertical ? (\\n      <div\\n        style={{\\n          display: 'inline-block',\\n          overflow: 'hidden',\\n          width: '1.5em',\\n          lineHeight: 1.5,\\n        }}\\n      >\\n        <div\\n          style={{\\n            display: 'inline-block',\\n            whiteSpace: 'nowrap',\\n            transform: 'translate(0, 100%) rotate(-90deg)',\\n            transformOrigin: '0 0',\\n          }}\\n        >\\n          {valueCb(dataValue)}\\n          <div\\n            style={{\\n              float: 'left',\\n              marginTop: '100%',\\n            }}\\n          />\\n        </div>\\n      </div>\\n    ) : (\\n      <div>{valueCb(dataValue)}</div>\\n    );\\n\\n/** formats values correctly for any rotation/side combination */\\nconst looseFormatter = (d: any) => (d < 100 ? String(d) : moment(d).format('L'));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const maxMetric = 30;\\n  const debug = boolean('Debug', true);\\n  const showLegend = boolean('show legend', true);\\n  const rotation = customKnobs.enum.rotation();\\n  const side = customKnobs.enum.position('Side', Position.Bottom);\\n  const padding = number('TickLine padding for markerBody', 30, { step: 5, min: 0, max: 100 });\\n  const start = moment('4/1/2020').startOf('d');\\n  const metric = number('Annotation metric', maxMetric, { step: 1, min: 0, max: maxMetric, range: true });\\n  const isVerticalSide = isVerticalAxis(side);\\n  const isYDomain = rotation === -90 || rotation === 90 ? !isVerticalSide : isVerticalSide;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} showLegend={showLegend} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"count\\\"\\n        maximumFractionDigits={0}\\n        tickFormat={looseFormatter}\\n        position={side === Position.Right ? Position.Right : Position.Left}\\n        style={{ tickLine: { padding: isVerticalSide ? padding : undefined } }}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        style={{ tickLine: { padding: isVerticalSide ? undefined : padding } }}\\n        tickFormat={looseFormatter}\\n        position={side === Position.Top ? Position.Top : Position.Bottom}\\n      />\\n      {isYDomain ? (\\n        <LineAnnotation\\n          id=\\\"annotation_y\\\"\\n          domainType={AnnotationDomainType.YDomain}\\n          dataValues={[{ dataValue: metric }]}\\n          style={annotationStyle}\\n          hideTooltips\\n          marker={<EuiIcon type={iconMap[side]} />}\\n          markerBody={getMarkerBody((v) => `The value is ${v} right here!`, isVerticalSide)}\\n        />\\n      ) : (\\n        <LineAnnotation\\n          id=\\\"annotation_x\\\"\\n          domainType={AnnotationDomainType.XDomain}\\n          dataValues={[{ dataValue: start.clone().add(metric, 'd').valueOf() }]}\\n          style={annotationStyle}\\n          hideTooltips\\n          marker={<EuiIcon type={iconMap[side]} />}\\n          markerBody={getMarkerBody((v) => moment(v).format('lll'), isVerticalSide)}\\n        />\\n      )}\\n      <HistogramBarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={Array.from({ length: maxMetric })\\n          .fill(0)\\n          .map((_, i) => ({ x: start.clone().add(i, 'd').valueOf(), y: maxMetric }))}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `The \\\\`markerBody\\\\` on the \\\\`LineAnnotationSpec\\\\` will be dynamically positioned to show content that would otherwise be hidden or overflow the chart.\\n    The \\\\`marker\\\\` prop (also on the \\\\`LineAnnotationSpec\\\\`) however, will always be positioned centered on the given \\\\`dataValue\\\\`.\\n    These can be used interchangeably to provide a content-rich annotation without losing the data reference.\\n    **Note: you will need to provide the necessary axis padding for the \\\\`markerBody\\\\` content as this is _not_ currently accounted for in the chart dimensioning**`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":86},\"endLoc\":{\"col\":1,\"line\":146},\"startBody\":{\"col\":36,\"line\":86},\"endBody\":{\"col\":1,\"line\":146}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiIcon } from '@elastic/eui';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport moment from 'moment';\nimport React from 'react';\n\nimport {\n  Chart,\n  Axis,\n  Settings,\n  HistogramBarSeries,\n  Position,\n  ScaleType,\n  LineAnnotation,\n  AnnotationDomainType,\n  LineAnnotationSpec,\n} from '@elastic/charts';\nimport { isVerticalAxis } from '@elastic/charts/src/chart_types/xy_chart/utils/axis_type_utils';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nconst annotationStyle = {\n  line: {\n    strokeWidth: 1,\n    stroke: 'red',\n    opacity: 1,\n  },\n};\n\nconst iconMap = {\n  [Position.Top]: 'arrowDown',\n  [Position.Right]: 'arrowLeft',\n  [Position.Bottom]: 'arrowUp',\n  [Position.Left]: 'arrowRight',\n};\n\n/**\n * Used to rotate text while maintaining correct parent dimensions\n * https://www.kizu.ru/rotated-text/\n */\nconst getMarkerBody =\n  (valueCb: (v: any) => string, isVertical: boolean): LineAnnotationSpec['markerBody'] =>\n  ({ dataValue }) =>\n    isVertical ? (\n      <div\n        style={{\n          display: 'inline-block',\n          overflow: 'hidden',\n          width: '1.5em',\n          lineHeight: 1.5,\n        }}\n      >\n        <div\n          style={{\n            display: 'inline-block',\n            whiteSpace: 'nowrap',\n            transform: 'translate(0, 100%) rotate(-90deg)',\n            transformOrigin: '0 0',\n          }}\n        >\n          {valueCb(dataValue)}\n          <div\n            style={{\n              float: 'left',\n              marginTop: '100%',\n            }}\n          />\n        </div>\n      </div>\n    ) : (\n      <div>{valueCb(dataValue)}</div>\n    );\n\n/** formats values correctly for any rotation/side combination */\nconst looseFormatter = (d: any) => (d < 100 ? String(d) : moment(d).format('L'));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const maxMetric = 30;\n  const debug = boolean('Debug', true);\n  const showLegend = boolean('show legend', true);\n  const rotation = customKnobs.enum.rotation();\n  const side = customKnobs.enum.position('Side', Position.Bottom);\n  const padding = number('TickLine padding for markerBody', 30, { step: 5, min: 0, max: 100 });\n  const start = moment('4/1/2020').startOf('d');\n  const metric = number('Annotation metric', maxMetric, { step: 1, min: 0, max: maxMetric, range: true });\n  const isVerticalSide = isVerticalAxis(side);\n  const isYDomain = rotation === -90 || rotation === 90 ? !isVerticalSide : isVerticalSide;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} showLegend={showLegend} rotation={rotation} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"count\"\n        maximumFractionDigits={0}\n        tickFormat={looseFormatter}\n        position={side === Position.Right ? Position.Right : Position.Left}\n        style={{ tickLine: { padding: isVerticalSide ? padding : undefined } }}\n      />\n      <Axis\n        id=\"x\"\n        style={{ tickLine: { padding: isVerticalSide ? undefined : padding } }}\n        tickFormat={looseFormatter}\n        position={side === Position.Top ? Position.Top : Position.Bottom}\n      />\n      {isYDomain ? (\n        <LineAnnotation\n          id=\"annotation_y\"\n          domainType={AnnotationDomainType.YDomain}\n          dataValues={[{ dataValue: metric }]}\n          style={annotationStyle}\n          hideTooltips\n          marker={<EuiIcon type={iconMap[side]} />}\n          markerBody={getMarkerBody((v) => `The value is ${v} right here!`, isVerticalSide)}\n        />\n      ) : (\n        <LineAnnotation\n          id=\"annotation_x\"\n          domainType={AnnotationDomainType.XDomain}\n          dataValues={[{ dataValue: start.clone().add(metric, 'd').valueOf() }]}\n          style={annotationStyle}\n          hideTooltips\n          marker={<EuiIcon type={iconMap[side]} />}\n          markerBody={getMarkerBody((v) => moment(v).format('lll'), isVerticalSide)}\n        />\n      )}\n      <HistogramBarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={Array.from({ length: maxMetric })\n          .fill(0)\n          .map((_, i) => ({ x: start.clone().add(i, 'd').valueOf(), y: maxMetric }))}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `The \\`markerBody\\` on the \\`LineAnnotationSpec\\` will be dynamically positioned to show content that would otherwise be hidden or overflow the chart.\n    The \\`marker\\` prop (also on the \\`LineAnnotationSpec\\`) however, will always be positioned centered on the given \\`dataValue\\`.\n    These can be used interchangeably to provide a content-rich annotation without losing the data reference.\n    **Note: you will need to provide the necessary axis padding for the \\`markerBody\\` content as this is _not_ currently accounted for in the chart dimensioning**`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const maxMetric = 30;\\n  const debug = boolean('Debug', true);\\n  const showLegend = boolean('show legend', true);\\n  const rotation = customKnobs.enum.rotation();\\n  const side = customKnobs.enum.position('Side', Position.Bottom);\\n  const padding = number('TickLine padding for markerBody', 30, { step: 5, min: 0, max: 100 });\\n  const start = moment('4/1/2020').startOf('d');\\n  const metric = number('Annotation metric', maxMetric, { step: 1, min: 0, max: maxMetric, range: true });\\n  const isVerticalSide = isVerticalAxis(side);\\n  const isYDomain = rotation === -90 || rotation === 90 ? !isVerticalSide : isVerticalSide;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} showLegend={showLegend} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"count\\\"\\n        maximumFractionDigits={0}\\n        tickFormat={looseFormatter}\\n        position={side === Position.Right ? Position.Right : Position.Left}\\n        style={{ tickLine: { padding: isVerticalSide ? padding : undefined } }}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        style={{ tickLine: { padding: isVerticalSide ? undefined : padding } }}\\n        tickFormat={looseFormatter}\\n        position={side === Position.Top ? Position.Top : Position.Bottom}\\n      />\\n      {isYDomain ? (\\n        <LineAnnotation\\n          id=\\\"annotation_y\\\"\\n          domainType={AnnotationDomainType.YDomain}\\n          dataValues={[{ dataValue: metric }]}\\n          style={annotationStyle}\\n          hideTooltips\\n          marker={<EuiIcon type={iconMap[side]} />}\\n          markerBody={getMarkerBody((v) => `The value is ${v} right here!`, isVerticalSide)}\\n        />\\n      ) : (\\n        <LineAnnotation\\n          id=\\\"annotation_x\\\"\\n          domainType={AnnotationDomainType.XDomain}\\n          dataValues={[{ dataValue: start.clone().add(metric, 'd').valueOf() }]}\\n          style={annotationStyle}\\n          hideTooltips\\n          marker={<EuiIcon type={iconMap[side]} />}\\n          markerBody={getMarkerBody((v) => moment(v).format('lll'), isVerticalSide)}\\n        />\\n      )}\\n      <HistogramBarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={Array.from({ length: maxMetric })\\n          .fill(0)\\n          .map((_, i) => ({ x: start.clone().add(i, 'd').valueOf(), y: maxMetric }))}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Annotations/Lines',\n};\n\nexport { Example as xContinuousDomain } from './1_x_continuous.story';\nexport { Example as xOrdinalDomain } from './2_x_ordinal.story';\nexport { Example as xTimeDomain } from './3_x_time.story';\nexport { Example as yDomain } from './4_y_domain.story';\nexport { Example as styling } from './5_styling.story';\nexport { Example as tooltipOptions } from './7_tooltip_options.story';\nexport { Example as advancedMarkers } from './8_advanced_markers.story';\n\n// for testing\nexport { Example as singleBarHistogram } from './6_test_single_bar_histogram.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings, Position } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const x0 = select(\\n    'x0 coordinate',\\n    {\\n      0: 0,\\n      1: 1,\\n      3: 3,\\n      '3.1': 3.1,\\n      'not defined': 'none',\\n    },\\n    0,\\n  );\\n\\n  const x1 = select(\\n    'x1 coordinate',\\n    {\\n      0: 0,\\n      1: 1,\\n      3: 3,\\n      '3.1': 3.1,\\n      'not defined': 'none',\\n    },\\n    1,\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        id=\\\"rect\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: x0 === 'none' ? undefined : Number(x0),\\n              x1: x1 === 'none' ? undefined : Number(x1),\\n              y0: 0,\\n              y1: 4,\\n            },\\n            details: 'details about this annotation',\\n          },\\n        ]}\\n        style={{ fill: 'red' }}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `A \\\\`<RectAnnotation />\\\\` can be used to create a rectangular annotation.\\nAs for most chart component, the required props are: \\\\`id\\\\` to uniquely identify the annotation and\\na \\\\`dataValues\\\\` prop that describes one or more annotations.\\n\\nThe \\\\`dataValues\\\\` prop takes an array of objects adhering to the following type:\\n\\n\\\\`\\\\`\\\\`ts\\n\\ninterface RectAnnotationDatum {\\n  coordinates: {\\n    x0?: PrimitiveValue;\\n    x1?: PrimitiveValue;\\n    y0?: PrimitiveValue;\\n    y1?: PrimitiveValue;\\n  };\\n  details?: string;\\n}\\n\\ntype PrimitiveValue = string | number | null;\\n\\\\`\\\\`\\\\`\\n\\nEach coordinate value can be omitted, if omitted then the corresponding min or max value is used instead.\\nA text can be issued to be shown within the tooltip. If omitted, no tooltip will be shown.\\n\\nIn the above Example, we are using a fixed set of coordinates:\\n\\\\`\\\\`\\\\`\\ncoordinates: {\\n  x0: 0,\\n  x1: 1,\\n  y0: 0,\\n  y1: 7,\\n}\\n\\\\`\\\\`\\\\`\\n\\nThis annotation will cover the X axis starting from the \\\\`0\\\\` value to the \\\\`1\\\\` value included. The \\\\`y\\\\` is covered from 0 to 7.\\nIn a barchart with linear or ordinal x scale, the interval covered by the annotation fully include the \\\\`x0\\\\` and \\\\`x1\\\\` values.\\nIf one value is out of the relative domain, we will clip the annotation to the max/min value of the chart domain.\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":79},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":79}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings, Position } from '@elastic/charts';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n  const x0 = select(\n    'x0 coordinate',\n    {\n      0: 0,\n      1: 1,\n      3: 3,\n      '3.1': 3.1,\n      'not defined': 'none',\n    },\n    0,\n  );\n\n  const x1 = select(\n    'x1 coordinate',\n    {\n      0: 0,\n      1: 1,\n      3: 3,\n      '3.1': 3.1,\n      'not defined': 'none',\n    },\n    1,\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <RectAnnotation\n        id=\"rect\"\n        dataValues={[\n          {\n            coordinates: {\n              x0: x0 === 'none' ? undefined : Number(x0),\n              x1: x1 === 'none' ? undefined : Number(x1),\n              y0: 0,\n              y1: 4,\n            },\n            details: 'details about this annotation',\n          },\n        ]}\n        style={{ fill: 'red' }}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `A \\`<RectAnnotation />\\` can be used to create a rectangular annotation.\nAs for most chart component, the required props are: \\`id\\` to uniquely identify the annotation and\na \\`dataValues\\` prop that describes one or more annotations.\n\nThe \\`dataValues\\` prop takes an array of objects adhering to the following type:\n\n\\`\\`\\`ts\n\ninterface RectAnnotationDatum {\n  coordinates: {\n    x0?: PrimitiveValue;\n    x1?: PrimitiveValue;\n    y0?: PrimitiveValue;\n    y1?: PrimitiveValue;\n  };\n  details?: string;\n}\n\ntype PrimitiveValue = string | number | null;\n\\`\\`\\`\n\nEach coordinate value can be omitted, if omitted then the corresponding min or max value is used instead.\nA text can be issued to be shown within the tooltip. If omitted, no tooltip will be shown.\n\nIn the above Example, we are using a fixed set of coordinates:\n\\`\\`\\`\ncoordinates: {\n  x0: 0,\n  x1: 1,\n  y0: 0,\n  y1: 7,\n}\n\\`\\`\\`\n\nThis annotation will cover the X axis starting from the \\`0\\` value to the \\`1\\` value included. The \\`y\\` is covered from 0 to 7.\nIn a barchart with linear or ordinal x scale, the interval covered by the annotation fully include the \\`x0\\` and \\`x1\\` values.\nIf one value is out of the relative domain, we will clip the annotation to the max/min value of the chart domain.\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const x0 = select(\\n    'x0 coordinate',\\n    {\\n      0: 0,\\n      1: 1,\\n      3: 3,\\n      '3.1': 3.1,\\n      'not defined': 'none',\\n    },\\n    0,\\n  );\\n\\n  const x1 = select(\\n    'x1 coordinate',\\n    {\\n      0: 0,\\n      1: 1,\\n      3: 3,\\n      '3.1': 3.1,\\n      'not defined': 'none',\\n    },\\n    1,\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        id=\\\"rect\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: x0 === 'none' ? undefined : Number(x0),\\n              x1: x1 === 'none' ? undefined : Number(x1),\\n              y0: 0,\\n              y1: 4,\\n            },\\n            details: 'details about this annotation',\\n          },\\n        ]}\\n        style={{ fill: 'red' }}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 'a',\\n              x1: 'c',\\n            },\\n            details: 'annotation on ordinal bar chart',\\n          },\\n        ]}\\n        id=\\\"rect\\\"\\n        style={{ fill: 'red' }}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 3 },\\n          { x: 'c', y: 0 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `On Ordinal Bar charts, you can draw a rectangular annotation the same way it's done within a linear bar chart.\\nThe annotation will cover fully the extent defined by the \\\\`coordinate\\\\` object, extending to the max/min domain values any\\nmissing/out-of-range parameters.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":56},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":56}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <RectAnnotation\n        dataValues={[\n          {\n            coordinates: {\n              x0: 'a',\n              x1: 'c',\n            },\n            details: 'annotation on ordinal bar chart',\n          },\n        ]}\n        id=\"rect\"\n        style={{ fill: 'red' }}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'a', y: 2 },\n          { x: 'b', y: 3 },\n          { x: 'c', y: 0 },\n          { x: 'd', y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `On Ordinal Bar charts, you can draw a rectangular annotation the same way it's done within a linear bar chart.\nThe annotation will cover fully the extent defined by the \\`coordinate\\` object, extending to the max/min domain values any\nmissing/out-of-range parameters.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 'a',\\n              x1: 'c',\\n            },\\n            details: 'annotation on ordinal bar chart',\\n          },\\n        ]}\\n        id=\\\"rect\\\"\\n        style={{ fill: 'red' }}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 3 },\\n          { x: 'c', y: 0 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, RectAnnotation, ScaleType, Settings, RectAnnotationDatum } from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\nimport { BandedAccessorType } from '@elastic/charts/src/utils/geometry';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const definedCoordinate = select(\\n    'green annotation defined coordinate',\\n    {\\n      x0: 'x0',\\n      x1: 'x1',\\n      y0: BandedAccessorType.Y0,\\n      y1: BandedAccessorType.Y1,\\n    },\\n    'x0',\\n  );\\n\\n  const dataValuesRed: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: 1,\\n        x1: 1.25,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details: 'red annotation',\\n    },\\n  ];\\n  const dataValuesBlue: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: 2,\\n        x1: 2.1,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details: 'blue annotation',\\n    },\\n  ];\\n  const dataValuesGreen: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: definedCoordinate === 'x0' ? 0.5 : null,\\n        x1: definedCoordinate === 'x1' ? 2.5 : null,\\n        y0: definedCoordinate === BandedAccessorType.Y0 ? 1.5 : null,\\n        y1: definedCoordinate === BandedAccessorType.Y1 ? 5.5 : null,\\n      },\\n      details: 'green annotation',\\n    },\\n  ];\\n\\n  const isLeft = boolean('y-domain axis is Position.Left', true);\\n  const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n  const yAxisPosition = isLeft ? Position.Left : Position.Right;\\n\\n  const isBottom = boolean('x-domain axis is Position.Bottom', true);\\n  const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\\n  const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation dataValues={dataValuesGreen} id=\\\"rect3\\\" style={{ fill: 'lightgreen' }} />\\n      <RectAnnotation dataValues={dataValuesBlue} id=\\\"rect2\\\" style={{ fill: 'blue' }} />\\n      <RectAnnotation dataValues={dataValuesRed} id=\\\"rect1\\\" style={{ fill: 'red' }} />\\n      <Axis id=\\\"bottom\\\" position={xAxisPosition} title={xAxisTitle} />\\n      <Axis id=\\\"left\\\" title={yAxisTitle} position={yAxisPosition} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":99},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":99}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, RectAnnotation, ScaleType, Settings, RectAnnotationDatum } from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\nimport { BandedAccessorType } from '@elastic/charts/src/utils/geometry';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n\n  const definedCoordinate = select(\n    'green annotation defined coordinate',\n    {\n      x0: 'x0',\n      x1: 'x1',\n      y0: BandedAccessorType.Y0,\n      y1: BandedAccessorType.Y1,\n    },\n    'x0',\n  );\n\n  const dataValuesRed: RectAnnotationDatum[] = [\n    {\n      coordinates: {\n        x0: 1,\n        x1: 1.25,\n        y0: 0,\n        y1: 7,\n      },\n      details: 'red annotation',\n    },\n  ];\n  const dataValuesBlue: RectAnnotationDatum[] = [\n    {\n      coordinates: {\n        x0: 2,\n        x1: 2.1,\n        y0: 0,\n        y1: 7,\n      },\n      details: 'blue annotation',\n    },\n  ];\n  const dataValuesGreen: RectAnnotationDatum[] = [\n    {\n      coordinates: {\n        x0: definedCoordinate === 'x0' ? 0.5 : null,\n        x1: definedCoordinate === 'x1' ? 2.5 : null,\n        y0: definedCoordinate === BandedAccessorType.Y0 ? 1.5 : null,\n        y1: definedCoordinate === BandedAccessorType.Y1 ? 5.5 : null,\n      },\n      details: 'green annotation',\n    },\n  ];\n\n  const isLeft = boolean('y-domain axis is Position.Left', true);\n  const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\n  const yAxisPosition = isLeft ? Position.Left : Position.Right;\n\n  const isBottom = boolean('x-domain axis is Position.Bottom', true);\n  const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\n  const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n      <RectAnnotation dataValues={dataValuesGreen} id=\"rect3\" style={{ fill: 'lightgreen' }} />\n      <RectAnnotation dataValues={dataValuesBlue} id=\"rect2\" style={{ fill: 'blue' }} />\n      <RectAnnotation dataValues={dataValuesRed} id=\"rect1\" style={{ fill: 'red' }} />\n      <Axis id=\"bottom\" position={xAxisPosition} title={xAxisTitle} />\n      <Axis id=\"left\" title={yAxisTitle} position={yAxisPosition} />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n\\n  const definedCoordinate = select(\\n    'green annotation defined coordinate',\\n    {\\n      x0: 'x0',\\n      x1: 'x1',\\n      y0: BandedAccessorType.Y0,\\n      y1: BandedAccessorType.Y1,\\n    },\\n    'x0',\\n  );\\n\\n  const dataValuesRed: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: 1,\\n        x1: 1.25,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details: 'red annotation',\\n    },\\n  ];\\n  const dataValuesBlue: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: 2,\\n        x1: 2.1,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details: 'blue annotation',\\n    },\\n  ];\\n  const dataValuesGreen: RectAnnotationDatum[] = [\\n    {\\n      coordinates: {\\n        x0: definedCoordinate === 'x0' ? 0.5 : null,\\n        x1: definedCoordinate === 'x1' ? 2.5 : null,\\n        y0: definedCoordinate === BandedAccessorType.Y0 ? 1.5 : null,\\n        y1: definedCoordinate === BandedAccessorType.Y1 ? 5.5 : null,\\n      },\\n      details: 'green annotation',\\n    },\\n  ];\\n\\n  const isLeft = boolean('y-domain axis is Position.Left', true);\\n  const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n  const yAxisPosition = isLeft ? Position.Left : Position.Right;\\n\\n  const isBottom = boolean('x-domain axis is Position.Bottom', true);\\n  const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\\n  const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation dataValues={dataValuesGreen} id=\\\"rect3\\\" style={{ fill: 'lightgreen' }} />\\n      <RectAnnotation dataValues={dataValuesBlue} id=\\\"rect2\\\" style={{ fill: 'blue' }} />\\n      <RectAnnotation dataValues={dataValuesRed} id=\\\"rect1\\\" style={{ fill: 'red' }} />\\n      <Axis id=\\\"bottom\\\" position={xAxisPosition} title={xAxisTitle} />\\n      <Axis id=\\\"left\\\" title={yAxisTitle} position={yAxisPosition} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { array, boolean, color, number } from '@storybook/addon-knobs';\\nimport React, { memo, useEffect, useMemo, useState } from 'react';\\n\\nimport {\\n  AnnotationAnimationConfig,\\n  AnnotationDomainType,\\n  Axis,\\n  Chart,\\n  ChartProps,\\n  LineAnnotation,\\n  LineAnnotationDatum,\\n  RectAnnotation,\\n  RectAnnotationStyle,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { Position, RecursivePartial } from '@elastic/charts/src/utils/common';\\nimport { TimeFunction } from '@elastic/charts/src/utils/time_functions';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nconst rng = getRandomNumberGenerator();\\nconst randomArray = new Array(100).fill(0).map(() => rng(0, 10, 2));\\nconst ExampleChart = memo<{ animationOptions: AnnotationAnimationConfig['options'] } & ChartProps>(\\n  ({ animationOptions, ...chartProps }) => {\\n    const debug = boolean('debug', false);\\n    const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line');\\n    const xScaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Ordinal'] });\\n    const rotation = customKnobs.enum.rotation();\\n    const dataValues = [\\n      {\\n        coordinates: {\\n          x0: -0.1,\\n          x1: 0.25,\\n        },\\n        details: 'annotation 1',\\n      },\\n      {\\n        coordinates: {\\n          x0: 2,\\n          x1: 3,\\n        },\\n        details: 'annotation 2',\\n      },\\n      {\\n        coordinates: {\\n          x0: 8,\\n          x1: 9,\\n        },\\n        details: 'annotation 3',\\n      },\\n    ];\\n    const lineData = dataValues.flatMap<LineAnnotationDatum>(({ coordinates: { x0, x1 } }) => [\\n      { dataValue: x0, details: 'start' },\\n      { dataValue: x1, details: 'end' },\\n    ]);\\n    const zIndex = number('annotation zIndex', 0, {}, 'Styles');\\n    const rectStyle: RecursivePartial<RectAnnotationStyle> = {\\n      strokeWidth: number('rect border stroke width', 1, {}, 'Styles'),\\n      stroke: color('rect border stroke color', '#e5e5e5', 'Styles'),\\n      fill: color('fill color', '#e5e5e5', 'Styles'),\\n      opacity: number(\\n        'annotation opacity',\\n        0.5,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 1,\\n          step: 0.1,\\n        },\\n        'Styles',\\n      ),\\n    };\\n\\n    const hasCustomTooltip = boolean('has custom tooltip render', false, 'Styles');\\n\\n    const customTooltip = ({ details }: { details?: string }) => (\\n      <div>\\n        <Icon type=\\\"alert\\\" />\\n        {details}\\n      </div>\\n    );\\n\\n    const isLeft = boolean('y-domain axis is Position.Left', true, 'Styles');\\n    const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\\n    const yAxisPosition = isLeft ? Position.Left : Position.Right;\\n\\n    const isBottom = boolean('x-domain axis is Position.Bottom', true, 'Styles');\\n    const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\\n    const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\\n    const hideTooltips = boolean('hide tooltips', false, 'Styles');\\n    const showLineAnnotations = boolean('showLineAnnotations', true, 'Styles');\\n    const minAnnoCount = lineData.length;\\n    const annotationCount = number('annotation count', minAnnoCount, { min: minAnnoCount, max: 100 }, 'Styles');\\n    randomArray.slice(0, annotationCount - minAnnoCount).forEach((dataValue) => {\\n      lineData.push({ dataValue, details: `Autogen value: ${dataValue}` });\\n    });\\n    const fadeOnFocusingOthers = boolean('FadeOnFocusingOthers', true, 'Animations');\\n    const animations: AnnotationAnimationConfig[] = [];\\n\\n    if (fadeOnFocusingOthers) {\\n      animations.push({ trigger: 'FadeOnFocusingOthers', options: animationOptions });\\n    }\\n\\n    return (\\n      <Chart {...chartProps}>\\n        <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\\n        <RectAnnotation\\n          dataValues={dataValues}\\n          id=\\\"rect\\\"\\n          style={{ ...rectStyle }}\\n          animations={animations}\\n          customTooltip={hasCustomTooltip ? customTooltip : undefined}\\n          zIndex={zIndex}\\n          hideTooltips={hideTooltips}\\n        />\\n        {showLineAnnotations && (\\n          <LineAnnotation\\n            id=\\\"annotation_1\\\"\\n            domainType={AnnotationDomainType.XDomain}\\n            animations={animations}\\n            dataValues={lineData}\\n            marker={<Icon type=\\\"alert\\\" />}\\n          />\\n        )}\\n        <Axis id=\\\"bottom\\\" position={xAxisPosition} title={xAxisTitle} />\\n        <Axis id=\\\"left\\\" title={yAxisTitle} position={yAxisPosition} />\\n        <SeriesType\\n          id=\\\"series\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 2, y: 10 },\\n            { x: 3, y: 3 },\\n            { x: 4, y: 6 },\\n            { x: 5, y: 12 },\\n            { x: 6, y: 2 },\\n            { x: 7, y: 1 },\\n            { x: 8, y: 8 },\\n            { x: 9, y: 11 },\\n            { x: 10, y: 7 },\\n          ]}\\n        />\\n      </Chart>\\n    );\\n  },\\n);\\n\\nlet prevAnimationStr = '';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const [mountCount, setMountCount] = useState(1);\\n  \\n  const animationOptions: Partial<AnnotationAnimationConfig['options']> = {\\n    enabled: boolean('enabled', true, 'Animations'),\\n    delay: number('delay (ms)', 50, { min: 0, max: 10000, step: 50 }, 'Animations'),\\n    duration: number('duration (ms)', 250, { min: 0, max: 10000, step: 50 }, 'Animations'),\\n    timeFunction: customKnobs.fromEnum('time function', TimeFunction, TimeFunction.easeInOut, {\\n      group: 'Animations',\\n    }),\\n    snapValues: array('snap values', [], undefined, 'Animations').map(Number),\\n  };\\n\\n  // The following is a HACK to remount the chart when the animation options change, see description in markdown\\n  const animationsStr = useMemo(() => JSON.stringify(animationOptions), [animationOptions]);\\n\\n  useEffect(() => {\\n    prevAnimationStr = animationsStr;\\n  }, []); \\n\\n  useEffect(() => {\\n    if (prevAnimationStr !== animationsStr) setMountCount(mountCount + 1);\\n    prevAnimationStr = animationsStr;\\n  }, [animationsStr]); \\n\\n  if (mountCount % 2 === 0) {\\n    return <ExampleChart title={title} description={description} animationOptions={animationOptions} />;\\n  }\\n\\n  action('mounted new chart')();\\n  setTimeout(() => setMountCount((c) => c + 1));\\n  return <></>;\\n};\\n\\nExample.parameters = {\\n  markdown: `Annotations animations are configured via \\\\`RectAnnotation.animations\\\\` or \\\\`LineAnnotation.animations\\\\` which are only read once on intial\\nrender.\\n\\n> :warning: Animations options, excluding \\\\`enabled\\\\`, are set _only_ when the chart is _**mounted**_ and _**not**_ on every rerender. \\\\\\nFor demonstration purposes, the chart on this story is forced to re-mount whenever the animation options change, hence the flashing.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":168},\"endLoc\":{\"col\":1,\"line\":200},\"startBody\":{\"col\":36,\"line\":168},\"endBody\":{\"col\":1,\"line\":200}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { array, boolean, color, number } from '@storybook/addon-knobs';\nimport React, { memo, useEffect, useMemo, useState } from 'react';\n\nimport {\n  AnnotationAnimationConfig,\n  AnnotationDomainType,\n  Axis,\n  Chart,\n  ChartProps,\n  LineAnnotation,\n  LineAnnotationDatum,\n  RectAnnotation,\n  RectAnnotationStyle,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { Position, RecursivePartial } from '@elastic/charts/src/utils/common';\nimport { TimeFunction } from '@elastic/charts/src/utils/time_functions';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nconst rng = getRandomNumberGenerator();\nconst randomArray = new Array(100).fill(0).map(() => rng(0, 10, 2));\nconst ExampleChart = memo<{ animationOptions: AnnotationAnimationConfig['options'] } & ChartProps>(\n  ({ animationOptions, ...chartProps }) => {\n    const debug = boolean('debug', false);\n    const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line');\n    const xScaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Ordinal'] });\n    const rotation = customKnobs.enum.rotation();\n    const dataValues = [\n      {\n        coordinates: {\n          x0: -0.1,\n          x1: 0.25,\n        },\n        details: 'annotation 1',\n      },\n      {\n        coordinates: {\n          x0: 2,\n          x1: 3,\n        },\n        details: 'annotation 2',\n      },\n      {\n        coordinates: {\n          x0: 8,\n          x1: 9,\n        },\n        details: 'annotation 3',\n      },\n    ];\n    const lineData = dataValues.flatMap<LineAnnotationDatum>(({ coordinates: { x0, x1 } }) => [\n      { dataValue: x0, details: 'start' },\n      { dataValue: x1, details: 'end' },\n    ]);\n    const zIndex = number('annotation zIndex', 0, {}, 'Styles');\n    const rectStyle: RecursivePartial<RectAnnotationStyle> = {\n      strokeWidth: number('rect border stroke width', 1, {}, 'Styles'),\n      stroke: color('rect border stroke color', '#e5e5e5', 'Styles'),\n      fill: color('fill color', '#e5e5e5', 'Styles'),\n      opacity: number(\n        'annotation opacity',\n        0.5,\n        {\n          range: true,\n          min: 0,\n          max: 1,\n          step: 0.1,\n        },\n        'Styles',\n      ),\n    };\n\n    const hasCustomTooltip = boolean('has custom tooltip render', false, 'Styles');\n\n    const customTooltip = ({ details }: { details?: string }) => (\n      <div>\n        <Icon type=\"alert\" />\n        {details}\n      </div>\n    );\n\n    const isLeft = boolean('y-domain axis is Position.Left', true, 'Styles');\n    const yAxisTitle = isLeft ? 'y-domain axis (left)' : 'y-domain axis (right)';\n    const yAxisPosition = isLeft ? Position.Left : Position.Right;\n\n    const isBottom = boolean('x-domain axis is Position.Bottom', true, 'Styles');\n    const xAxisTitle = isBottom ? 'x-domain axis (botttom)' : 'x-domain axis (top)';\n    const xAxisPosition = isBottom ? Position.Bottom : Position.Top;\n    const hideTooltips = boolean('hide tooltips', false, 'Styles');\n    const showLineAnnotations = boolean('showLineAnnotations', true, 'Styles');\n    const minAnnoCount = lineData.length;\n    const annotationCount = number('annotation count', minAnnoCount, { min: minAnnoCount, max: 100 }, 'Styles');\n    randomArray.slice(0, annotationCount - minAnnoCount).forEach((dataValue) => {\n      lineData.push({ dataValue, details: `Autogen value: ${dataValue}` });\n    });\n    const fadeOnFocusingOthers = boolean('FadeOnFocusingOthers', true, 'Animations');\n    const animations: AnnotationAnimationConfig[] = [];\n\n    if (fadeOnFocusingOthers) {\n      animations.push({ trigger: 'FadeOnFocusingOthers', options: animationOptions });\n    }\n\n    return (\n      <Chart {...chartProps}>\n        <Settings debug={debug} rotation={rotation} baseTheme={useBaseTheme()} />\n        <RectAnnotation\n          dataValues={dataValues}\n          id=\"rect\"\n          style={{ ...rectStyle }}\n          animations={animations}\n          customTooltip={hasCustomTooltip ? customTooltip : undefined}\n          zIndex={zIndex}\n          hideTooltips={hideTooltips}\n        />\n        {showLineAnnotations && (\n          <LineAnnotation\n            id=\"annotation_1\"\n            domainType={AnnotationDomainType.XDomain}\n            animations={animations}\n            dataValues={lineData}\n            marker={<Icon type=\"alert\" />}\n          />\n        )}\n        <Axis id=\"bottom\" position={xAxisPosition} title={xAxisTitle} />\n        <Axis id=\"left\" title={yAxisTitle} position={yAxisPosition} />\n        <SeriesType\n          id=\"series\"\n          xScaleType={xScaleType}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={[\n            { x: 0, y: 2 },\n            { x: 1, y: 3 },\n            { x: 2, y: 10 },\n            { x: 3, y: 3 },\n            { x: 4, y: 6 },\n            { x: 5, y: 12 },\n            { x: 6, y: 2 },\n            { x: 7, y: 1 },\n            { x: 8, y: 8 },\n            { x: 9, y: 11 },\n            { x: 10, y: 7 },\n          ]}\n        />\n      </Chart>\n    );\n  },\n);\n\nlet prevAnimationStr = '';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const [mountCount, setMountCount] = useState(1);\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  const animationOptions: Partial<AnnotationAnimationConfig['options']> = {\n    enabled: boolean('enabled', true, 'Animations'),\n    delay: number('delay (ms)', 50, { min: 0, max: 10000, step: 50 }, 'Animations'),\n    duration: number('duration (ms)', 250, { min: 0, max: 10000, step: 50 }, 'Animations'),\n    timeFunction: customKnobs.fromEnum('time function', TimeFunction, TimeFunction.easeInOut, {\n      group: 'Animations',\n    }),\n    snapValues: array('snap values', [], undefined, 'Animations').map(Number),\n  };\n\n  // The following is a HACK to remount the chart when the animation options change, see description in markdown\n  const animationsStr = useMemo(() => JSON.stringify(animationOptions), [animationOptions]);\n\n  useEffect(() => {\n    prevAnimationStr = animationsStr;\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    if (prevAnimationStr !== animationsStr) setMountCount(mountCount + 1);\n    prevAnimationStr = animationsStr;\n  }, [animationsStr]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  if (mountCount % 2 === 0) {\n    return <ExampleChart title={title} description={description} animationOptions={animationOptions} />;\n  }\n\n  action('mounted new chart')();\n  setTimeout(() => setMountCount((c) => c + 1));\n  return <></>;\n};\n\nExample.parameters = {\n  markdown: `Annotations animations are configured via \\`RectAnnotation.animations\\` or \\`LineAnnotation.animations\\` which are only read once on intial\nrender.\n\n> :warning: Animations options, excluding \\`enabled\\`, are set _only_ when the chart is _**mounted**_ and _**not**_ on every rerender. \\\nFor demonstration purposes, the chart on this story is forced to re-mount whenever the animation options change, hence the flashing.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const [mountCount, setMountCount] = useState(1);\\n  \\n  const animationOptions: Partial<AnnotationAnimationConfig['options']> = {\\n    enabled: boolean('enabled', true, 'Animations'),\\n    delay: number('delay (ms)', 50, { min: 0, max: 10000, step: 50 }, 'Animations'),\\n    duration: number('duration (ms)', 250, { min: 0, max: 10000, step: 50 }, 'Animations'),\\n    timeFunction: customKnobs.fromEnum('time function', TimeFunction, TimeFunction.easeInOut, {\\n      group: 'Animations',\\n    }),\\n    snapValues: array('snap values', [], undefined, 'Animations').map(Number),\\n  };\\n\\n  // The following is a HACK to remount the chart when the animation options change, see description in markdown\\n  const animationsStr = useMemo(() => JSON.stringify(animationOptions), [animationOptions]);\\n\\n  useEffect(() => {\\n    prevAnimationStr = animationsStr;\\n  }, []); \\n\\n  useEffect(() => {\\n    if (prevAnimationStr !== animationsStr) setMountCount(mountCount + 1);\\n    prevAnimationStr = animationsStr;\\n  }, [animationsStr]); \\n\\n  if (mountCount % 2 === 0) {\\n    return <ExampleChart title={title} description={description} animationOptions={animationOptions} />;\\n  }\\n\\n  action('mounted new chart')();\\n  setTimeout(() => setMountCount((c) => c + 1));\\n  return <></>;\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationTooltipFormatter,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  ScaleType,\\n  RectAnnotation,\\n  Settings,\\n} from '@elastic/charts';\\nimport { CustomAnnotationTooltip } from '@elastic/charts/src/chart_types/xy_chart/annotations/types';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const boundary = customKnobs.enum.boundary();\\n  const placement = customKnobs.enum.placement('Tooltip placement');\\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\\n  const rotation = customKnobs.enum.rotation();\\n  const showCustomTooltip = boolean('custom tooltip', false);\\n  const showCustomDetails = boolean('custom tooltip details', false);\\n  const details = select(\\n    'details value',\\n    {\\n      foo: 'foo',\\n      undefined,\\n    },\\n    'foo',\\n  );\\n\\n  const dataValues = [\\n    {\\n      coordinates: {\\n        x0: 0,\\n        x1: 1,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details,\\n    },\\n  ];\\n\\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\\n    ? ({ details }) => (\\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\\n          <h2>custom tooltip</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\\n    ? (details) => (\\n        <div>\\n          <h2>custom Details</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        dataValues={dataValues}\\n        id=\\\"rect\\\"\\n        boundary={boundary}\\n        placement={placement}\\n        fallbackPlacements={fallbackPlacements}\\n        customTooltip={customTooltip}\\n        customTooltipDetails={customTooltipDetails}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":101},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":101}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationTooltipFormatter,\n  Axis,\n  BarSeries,\n  Chart,\n  ScaleType,\n  RectAnnotation,\n  Settings,\n} from '@elastic/charts';\nimport { CustomAnnotationTooltip } from '@elastic/charts/src/chart_types/xy_chart/annotations/types';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const boundary = customKnobs.enum.boundary();\n  const placement = customKnobs.enum.placement('Tooltip placement');\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\n  const rotation = customKnobs.enum.rotation();\n  const showCustomTooltip = boolean('custom tooltip', false);\n  const showCustomDetails = boolean('custom tooltip details', false);\n  const details = select(\n    'details value',\n    {\n      foo: 'foo',\n      undefined,\n    },\n    'foo',\n  );\n\n  const dataValues = [\n    {\n      coordinates: {\n        x0: 0,\n        x1: 1,\n        y0: 0,\n        y1: 7,\n      },\n      details,\n    },\n  ];\n\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\n    ? ({ details }) => (\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\n          <h2>custom tooltip</h2>\n          <p>{details}</p>\n        </div>\n      )\n    : undefined;\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\n    ? (details) => (\n        <div>\n          <h2>custom Details</h2>\n          <p>{details}</p>\n        </div>\n      )\n    : undefined;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\n      <RectAnnotation\n        dataValues={dataValues}\n        id=\"rect\"\n        boundary={boundary}\n        placement={placement}\n        fallbackPlacements={fallbackPlacements}\n        customTooltip={customTooltip}\n        customTooltipDetails={customTooltipDetails}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const boundary = customKnobs.enum.boundary();\\n  const placement = customKnobs.enum.placement('Tooltip placement');\\n  const fallbackPlacements = customKnobs.enum.fallbackPlacements();\\n  const rotation = customKnobs.enum.rotation();\\n  const showCustomTooltip = boolean('custom tooltip', false);\\n  const showCustomDetails = boolean('custom tooltip details', false);\\n  const details = select(\\n    'details value',\\n    {\\n      foo: 'foo',\\n      undefined,\\n    },\\n    'foo',\\n  );\\n\\n  const dataValues = [\\n    {\\n      coordinates: {\\n        x0: 0,\\n        x1: 1,\\n        y0: 0,\\n        y1: 7,\\n      },\\n      details,\\n    },\\n  ];\\n\\n  const customTooltip: CustomAnnotationTooltip | undefined = showCustomTooltip\\n    ? ({ details }) => (\\n        <div style={{ backgroundColor: 'blue', color: 'white', padding: 10 }}>\\n          <h2>custom tooltip</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n  const customTooltipDetails: AnnotationTooltipFormatter | undefined = showCustomDetails\\n    ? (details) => (\\n        <div>\\n          <h2>custom Details</h2>\\n          <p>{details}</p>\\n        </div>\\n      )\\n    : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={rotation} baseTheme={useBaseTheme()} />\\n      <RectAnnotation\\n        dataValues={dataValues}\\n        id=\\\"rect\\\"\\n        boundary={boundary}\\n        placement={placement}\\n        fallbackPlacements={fallbackPlacements}\\n        customTooltip={customTooltip}\\n        customTooltipDetails={customTooltipDetails}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\n\\nconst getKnobs = () => {\\n  const minY = number('min y', 0);\\n  const maxY = number('max y', 20);\\n  const x0 = number('x0', 5);\\n  const x1 = number('x1', 10);\\n  const enableYValues = boolean('enable y0 and y1 values', true);\\n  return {\\n    minY,\\n    maxY,\\n    x0,\\n    x1,\\n    y0: enableYValues ? number('y0', 1) : undefined,\\n    y1: enableYValues ? number('y1', 5) : undefined,\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const xAxisKnobs = getKnobs();\\n  // only show the fit enable or disable if relevant\\n  const fit = xAxisKnobs.minY === xAxisKnobs.maxY ? boolean('fit to the domain', false) : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <RectAnnotation id=\\\"rect\\\" dataValues={[{ coordinates: xAxisKnobs }]} style={{ fill: 'red' }} />\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        id=\\\"left\\\"\\n        title=\\\"y-domain axis\\\"\\n        position={Position.Left}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: xAxisKnobs.minY },\\n          { x: 5, y: (xAxisKnobs.minY + xAxisKnobs.maxY) / 2 },\\n          { x: 20, y: xAxisKnobs.maxY },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":68},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":68}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\n\nconst getKnobs = () => {\n  const minY = number('min y', 0);\n  const maxY = number('max y', 20);\n  const x0 = number('x0', 5);\n  const x1 = number('x1', 10);\n  const enableYValues = boolean('enable y0 and y1 values', true);\n  return {\n    minY,\n    maxY,\n    x0,\n    x1,\n    y0: enableYValues ? number('y0', 1) : undefined,\n    y1: enableYValues ? number('y1', 5) : undefined,\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const xAxisKnobs = getKnobs();\n  // only show the fit enable or disable if relevant\n  const fit = xAxisKnobs.minY === xAxisKnobs.maxY ? boolean('fit to the domain', false) : undefined;\n\n  return (\n    <Chart title={title} description={description}>\n      <RectAnnotation id=\"rect\" dataValues={[{ coordinates: xAxisKnobs }]} style={{ fill: 'red' }} />\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n        }}\n        id=\"left\"\n        title=\"y-domain axis\"\n        position={Position.Left}\n      />\n      <BarSeries\n        id=\"bars\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={[\n          { x: 0, y: xAxisKnobs.minY },\n          { x: 5, y: (xAxisKnobs.minY + xAxisKnobs.maxY) / 2 },\n          { x: 20, y: xAxisKnobs.maxY },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const xAxisKnobs = getKnobs();\\n  // only show the fit enable or disable if relevant\\n  const fit = xAxisKnobs.minY === xAxisKnobs.maxY ? boolean('fit to the domain', false) : undefined;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <RectAnnotation id=\\\"rect\\\" dataValues={[{ coordinates: xAxisKnobs }]} style={{ fill: 'red' }} />\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        id=\\\"left\\\"\\n        title=\\\"y-domain axis\\\"\\n        position={Position.Left}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: xAxisKnobs.minY },\\n          { x: 5, y: (xAxisKnobs.minY + xAxisKnobs.maxY) / 2 },\\n          { x: 20, y: xAxisKnobs.maxY },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\\nimport { Position } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\n\\nconst getKnobs = () => {\\n  const enabled = boolean('enable annotation', true);\\n  let groupId: string | undefined = select(\\n    'Annotation groupId',\\n    { group1: 'group1', group2: 'group2', none: 'none' },\\n    'group1',\\n  );\\n  if (groupId === 'none') {\\n    groupId = undefined;\\n  }\\n  const x0 = number('x0', 5);\\n  const x1 = number('x1', 10);\\n  const yDefined = boolean('enable y0 and y1 values', false);\\n  return {\\n    enabled,\\n    groupId,\\n    x0,\\n    x1,\\n    y0: yDefined ? number('y0', 0) : undefined,\\n    y1: yDefined ? number('y1', 3) : undefined,\\n  };\\n};\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const xAxisKnobs = getKnobs();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      {xAxisKnobs.enabled && (\\n        <RectAnnotation\\n          groupId={xAxisKnobs.groupId}\\n          id=\\\"x axis\\\"\\n          dataValues={[{ coordinates: xAxisKnobs }]}\\n          style={{ fill: 'red' }}\\n        />\\n      )}\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" groupId=\\\"group2\\\" position={Position.Bottom} title=\\\"Bottom (groupId=group2)\\\" />\\n      <Axis id=\\\"left\\\" groupId=\\\"group1\\\" position={Position.Left} title=\\\"Left (groupId=group1)\\\" />\\n      <Axis id=\\\"top\\\" groupId=\\\"group1\\\" position={Position.Top} title=\\\"Top (groupId=group1)\\\" />\\n      <Axis id=\\\"right\\\" groupId=\\\"group2\\\" position={Position.Right} title=\\\"Right (groupId=group2)\\\" />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        groupId=\\\"group1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 5 },\\n          { x: 5, y: 1 },\\n          { x: 20, y: 10 },\\n        ]}\\n      />\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        groupId=\\\"group2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 61 },\\n          { x: 5, y: 43 },\\n          { x: 20, y: 49 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":40},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":40},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\nimport { Position } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\n\nconst getKnobs = () => {\n  const enabled = boolean('enable annotation', true);\n  let groupId: string | undefined = select(\n    'Annotation groupId',\n    { group1: 'group1', group2: 'group2', none: 'none' },\n    'group1',\n  );\n  if (groupId === 'none') {\n    groupId = undefined;\n  }\n  const x0 = number('x0', 5);\n  const x1 = number('x1', 10);\n  const yDefined = boolean('enable y0 and y1 values', false);\n  return {\n    enabled,\n    groupId,\n    x0,\n    x1,\n    y0: yDefined ? number('y0', 0) : undefined,\n    y1: yDefined ? number('y1', 3) : undefined,\n  };\n};\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const xAxisKnobs = getKnobs();\n\n  return (\n    <Chart title={title} description={description}>\n      {xAxisKnobs.enabled && (\n        <RectAnnotation\n          groupId={xAxisKnobs.groupId}\n          id=\"x axis\"\n          dataValues={[{ coordinates: xAxisKnobs }]}\n          style={{ fill: 'red' }}\n        />\n      )}\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" groupId=\"group2\" position={Position.Bottom} title=\"Bottom (groupId=group2)\" />\n      <Axis id=\"left\" groupId=\"group1\" position={Position.Left} title=\"Left (groupId=group1)\" />\n      <Axis id=\"top\" groupId=\"group1\" position={Position.Top} title=\"Top (groupId=group1)\" />\n      <Axis id=\"right\" groupId=\"group2\" position={Position.Right} title=\"Right (groupId=group2)\" />\n      <BarSeries\n        id=\"bars\"\n        groupId=\"group1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 5 },\n          { x: 5, y: 1 },\n          { x: 20, y: 10 },\n        ]}\n      />\n      <BarSeries\n        id=\"bars1\"\n        groupId=\"group2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 61 },\n          { x: 5, y: 43 },\n          { x: 20, y: 49 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const xAxisKnobs = getKnobs();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      {xAxisKnobs.enabled && (\\n        <RectAnnotation\\n          groupId={xAxisKnobs.groupId}\\n          id=\\\"x axis\\\"\\n          dataValues={[{ coordinates: xAxisKnobs }]}\\n          style={{ fill: 'red' }}\\n        />\\n      )}\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" groupId=\\\"group2\\\" position={Position.Bottom} title=\\\"Bottom (groupId=group2)\\\" />\\n      <Axis id=\\\"left\\\" groupId=\\\"group1\\\" position={Position.Left} title=\\\"Left (groupId=group1)\\\" />\\n      <Axis id=\\\"top\\\" groupId=\\\"group1\\\" position={Position.Top} title=\\\"Top (groupId=group1)\\\" />\\n      <Axis id=\\\"right\\\" groupId=\\\"group2\\\" position={Position.Right} title=\\\"Right (groupId=group2)\\\" />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        groupId=\\\"group1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 5 },\\n          { x: 5, y: 1 },\\n          { x: 20, y: 10 },\\n        ]}\\n      />\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        groupId=\\\"group2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 61 },\\n          { x: 5, y: 43 },\\n          { x: 20, y: 49 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\n\\nconst vGroups = {\\n  Primary: 'primary',\\n  Secondary: 'secondary',\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const tickSize = number('Tick size', 10, { min: 0, max: 20, step: 1 });\\n  const hideAxes = boolean('Hide all axes', false);\\n\\n  const domainAxis = select(\\n    'Domain axis',\\n    {\\n      'X axis': 'x',\\n      'Y axis': 'y',\\n    },\\n    'x',\\n    'Annotations',\\n  );\\n  const isX = domainAxis === 'x';\\n  const isVert = isX ? rotation === 0 || rotation === 180 : rotation === 90 || rotation === -90;\\n  const outside = boolean('Render outside chart', true, 'Annotations');\\n  const outsideDimension = number('Outside dimension', 5, { min: 0, step: 1 }, 'Annotations');\\n  const redGroupId = select('Red groupId', vGroups, vGroups.Primary, 'Annotations');\\n  const blueGroupId = select('Blue groupId', vGroups, vGroups.Secondary, 'Annotations');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        rotation={rotation}\\n        theme={{ axes: { tickLine: { size: tickSize } } }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis\\n        id=\\\"left\\\"\\n        hide={hideAxes}\\n        groupId={isVert ? undefined : vGroups.Primary}\\n        position={Position.Left}\\n        title={isVert ? 'Left' : 'Primary - Left'}\\n      />\\n      {!isVert && (\\n        <Axis\\n          id=\\\"right\\\"\\n          hide={hideAxes}\\n          groupId={vGroups.Secondary}\\n          position={Position.Right}\\n          title=\\\"Secondary - Right\\\"\\n        />\\n      )}\\n      <Axis\\n        id=\\\"bottom\\\"\\n        hide={hideAxes}\\n        groupId={isVert ? vGroups.Primary : undefined}\\n        position={Position.Bottom}\\n        title={isVert ? 'Primary - Bottom' : 'Bottom'}\\n      />\\n      {isVert && (\\n        <Axis id=\\\"top\\\" hide={hideAxes} groupId={vGroups.Secondary} position={Position.Top} title=\\\"Secondary - Top\\\" />\\n      )}\\n\\n      <RectAnnotation\\n        groupId={redGroupId}\\n        dataValues={[\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 2,\\n                  x1: 4,\\n                }\\n              : {\\n                  y0: 1,\\n                  y1: 2,\\n                },\\n            details: 'Red - One',\\n          },\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 7,\\n                  x1: 10,\\n                }\\n              : {\\n                  y0: 5,\\n                  y1: 7,\\n                },\\n            details: 'Red - Two',\\n          },\\n        ]}\\n        id=\\\"red\\\"\\n        style={{ fill: '#b62b39' }}\\n        outside={outside}\\n        outsideDimension={outsideDimension}\\n      />\\n      <RectAnnotation\\n        groupId={blueGroupId}\\n        dataValues={[\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 5,\\n                  x1: 6,\\n                }\\n              : {\\n                  y0: 3,\\n                  y1: 4,\\n                },\\n            details: 'Blue - One',\\n          },\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 17,\\n                  x1: 30,\\n                }\\n              : {\\n                  y0: 8,\\n                  y1: 20,\\n                },\\n            details: 'Blue - Two',\\n          },\\n        ]}\\n        id=\\\"blue\\\"\\n        style={{ fill: '#2b5fb6' }}\\n        outside={outside}\\n        outsideDimension={outsideDimension}\\n      />\\n\\n      <LineSeries\\n        id=\\\"lines1\\\"\\n        groupId={isX ? undefined : vGroups.Primary}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 13, y: 10 },\\n          { x: 20, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines2\\\"\\n        groupId={isX ? undefined : vGroups.Secondary}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 5 },\\n          { x: 13, y: 7 },\\n          { x: 20, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":178},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":178}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, RectAnnotation, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\n\nconst vGroups = {\n  Primary: 'primary',\n  Secondary: 'secondary',\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const rotation = customKnobs.enum.rotation();\n  const tickSize = number('Tick size', 10, { min: 0, max: 20, step: 1 });\n  const hideAxes = boolean('Hide all axes', false);\n\n  const domainAxis = select(\n    'Domain axis',\n    {\n      'X axis': 'x',\n      'Y axis': 'y',\n    },\n    'x',\n    'Annotations',\n  );\n  const isX = domainAxis === 'x';\n  const isVert = isX ? rotation === 0 || rotation === 180 : rotation === 90 || rotation === -90;\n  const outside = boolean('Render outside chart', true, 'Annotations');\n  const outsideDimension = number('Outside dimension', 5, { min: 0, step: 1 }, 'Annotations');\n  const redGroupId = select('Red groupId', vGroups, vGroups.Primary, 'Annotations');\n  const blueGroupId = select('Blue groupId', vGroups, vGroups.Secondary, 'Annotations');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        rotation={rotation}\n        theme={{ axes: { tickLine: { size: tickSize } } }}\n        baseTheme={useBaseTheme()}\n      />\n\n      <Axis\n        id=\"left\"\n        hide={hideAxes}\n        groupId={isVert ? undefined : vGroups.Primary}\n        position={Position.Left}\n        title={isVert ? 'Left' : 'Primary - Left'}\n      />\n      {!isVert && (\n        <Axis\n          id=\"right\"\n          hide={hideAxes}\n          groupId={vGroups.Secondary}\n          position={Position.Right}\n          title=\"Secondary - Right\"\n        />\n      )}\n      <Axis\n        id=\"bottom\"\n        hide={hideAxes}\n        groupId={isVert ? vGroups.Primary : undefined}\n        position={Position.Bottom}\n        title={isVert ? 'Primary - Bottom' : 'Bottom'}\n      />\n      {isVert && (\n        <Axis id=\"top\" hide={hideAxes} groupId={vGroups.Secondary} position={Position.Top} title=\"Secondary - Top\" />\n      )}\n\n      <RectAnnotation\n        groupId={redGroupId}\n        dataValues={[\n          {\n            coordinates: isX\n              ? {\n                  x0: 2,\n                  x1: 4,\n                }\n              : {\n                  y0: 1,\n                  y1: 2,\n                },\n            details: 'Red - One',\n          },\n          {\n            coordinates: isX\n              ? {\n                  x0: 7,\n                  x1: 10,\n                }\n              : {\n                  y0: 5,\n                  y1: 7,\n                },\n            details: 'Red - Two',\n          },\n        ]}\n        id=\"red\"\n        style={{ fill: '#b62b39' }}\n        outside={outside}\n        outsideDimension={outsideDimension}\n      />\n      <RectAnnotation\n        groupId={blueGroupId}\n        dataValues={[\n          {\n            coordinates: isX\n              ? {\n                  x0: 5,\n                  x1: 6,\n                }\n              : {\n                  y0: 3,\n                  y1: 4,\n                },\n            details: 'Blue - One',\n          },\n          {\n            coordinates: isX\n              ? {\n                  x0: 17,\n                  x1: 30,\n                }\n              : {\n                  y0: 8,\n                  y1: 20,\n                },\n            details: 'Blue - Two',\n          },\n        ]}\n        id=\"blue\"\n        style={{ fill: '#2b5fb6' }}\n        outside={outside}\n        outsideDimension={outsideDimension}\n      />\n\n      <LineSeries\n        id=\"lines1\"\n        groupId={isX ? undefined : vGroups.Primary}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 13, y: 10 },\n          { x: 20, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines2\"\n        groupId={isX ? undefined : vGroups.Secondary}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 5 },\n          { x: 13, y: 7 },\n          { x: 20, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const rotation = customKnobs.enum.rotation();\\n  const tickSize = number('Tick size', 10, { min: 0, max: 20, step: 1 });\\n  const hideAxes = boolean('Hide all axes', false);\\n\\n  const domainAxis = select(\\n    'Domain axis',\\n    {\\n      'X axis': 'x',\\n      'Y axis': 'y',\\n    },\\n    'x',\\n    'Annotations',\\n  );\\n  const isX = domainAxis === 'x';\\n  const isVert = isX ? rotation === 0 || rotation === 180 : rotation === 90 || rotation === -90;\\n  const outside = boolean('Render outside chart', true, 'Annotations');\\n  const outsideDimension = number('Outside dimension', 5, { min: 0, step: 1 }, 'Annotations');\\n  const redGroupId = select('Red groupId', vGroups, vGroups.Primary, 'Annotations');\\n  const blueGroupId = select('Blue groupId', vGroups, vGroups.Secondary, 'Annotations');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        rotation={rotation}\\n        theme={{ axes: { tickLine: { size: tickSize } } }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis\\n        id=\\\"left\\\"\\n        hide={hideAxes}\\n        groupId={isVert ? undefined : vGroups.Primary}\\n        position={Position.Left}\\n        title={isVert ? 'Left' : 'Primary - Left'}\\n      />\\n      {!isVert && (\\n        <Axis\\n          id=\\\"right\\\"\\n          hide={hideAxes}\\n          groupId={vGroups.Secondary}\\n          position={Position.Right}\\n          title=\\\"Secondary - Right\\\"\\n        />\\n      )}\\n      <Axis\\n        id=\\\"bottom\\\"\\n        hide={hideAxes}\\n        groupId={isVert ? vGroups.Primary : undefined}\\n        position={Position.Bottom}\\n        title={isVert ? 'Primary - Bottom' : 'Bottom'}\\n      />\\n      {isVert && (\\n        <Axis id=\\\"top\\\" hide={hideAxes} groupId={vGroups.Secondary} position={Position.Top} title=\\\"Secondary - Top\\\" />\\n      )}\\n\\n      <RectAnnotation\\n        groupId={redGroupId}\\n        dataValues={[\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 2,\\n                  x1: 4,\\n                }\\n              : {\\n                  y0: 1,\\n                  y1: 2,\\n                },\\n            details: 'Red - One',\\n          },\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 7,\\n                  x1: 10,\\n                }\\n              : {\\n                  y0: 5,\\n                  y1: 7,\\n                },\\n            details: 'Red - Two',\\n          },\\n        ]}\\n        id=\\\"red\\\"\\n        style={{ fill: '#b62b39' }}\\n        outside={outside}\\n        outsideDimension={outsideDimension}\\n      />\\n      <RectAnnotation\\n        groupId={blueGroupId}\\n        dataValues={[\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 5,\\n                  x1: 6,\\n                }\\n              : {\\n                  y0: 3,\\n                  y1: 4,\\n                },\\n            details: 'Blue - One',\\n          },\\n          {\\n            coordinates: isX\\n              ? {\\n                  x0: 17,\\n                  x1: 30,\\n                }\\n              : {\\n                  y0: 8,\\n                  y1: 20,\\n                },\\n            details: 'Blue - Two',\\n          },\\n        ]}\\n        id=\\\"blue\\\"\\n        style={{ fill: '#2b5fb6' }}\\n        outside={outside}\\n        outsideDimension={outsideDimension}\\n      />\\n\\n      <LineSeries\\n        id=\\\"lines1\\\"\\n        groupId={isX ? undefined : vGroups.Primary}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 13, y: 10 },\\n          { x: 20, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines2\\\"\\n        groupId={isX ? undefined : vGroups.Secondary}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 5 },\\n          { x: 13, y: 7 },\\n          { x: 20, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  LineSeries,\\n  Chart,\\n  RectAnnotation,\\n  ScaleType,\\n  Settings,\\n  Position,\\n  AnnotationDomainType,\\n  LineAnnotation,\\n  BarSeries,\\n} from '@elastic/charts';\\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { getDebugStateLogger } from '../../utils/debug_state_logger';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onAnnotationClick = boolean('onAnnotationClick listener', true);\\n  const onElementClick = boolean('onElementClick listener', true);\\n  const typeOfSeries = select('series type', ['line', 'bar'], 'bar');\\n  const debugState = boolean('Enable debug state', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        baseTheme={useBaseTheme()}\\n        onAnnotationClick={onAnnotationClick ? action('onAnnotationClick') : undefined}\\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect1\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0,\\n              x1: 1,\\n              y0: 0,\\n              y1: 4,\\n            },\\n            details: 'details about this annotation',\\n          },\\n        ]}\\n        style={{ fill: 'red' }}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect2\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0.8,\\n              x1: 2,\\n              y0: 1,\\n              y1: 5,\\n            },\\n            details: 'details about this other annotation',\\n          },\\n        ]}\\n        style={{ fill: 'blue' }}\\n      />\\n      <LineAnnotation\\n        id=\\\"line_annotation\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={[{ dataValue: 2, details: `detail-${0}` }]}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={Position.Top}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      {typeOfSeries === 'line' ? (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 1.5, y: 4 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      ) : (\\n        <BarSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 1.5, y: 4 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":116},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":116}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  LineSeries,\n  Chart,\n  RectAnnotation,\n  ScaleType,\n  Settings,\n  Position,\n  AnnotationDomainType,\n  LineAnnotation,\n  BarSeries,\n} from '@elastic/charts';\nimport { Icon } from '@elastic/charts/src/components/icons/icon';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { getDebugStateLogger } from '../../utils/debug_state_logger';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onAnnotationClick = boolean('onAnnotationClick listener', true);\n  const onElementClick = boolean('onElementClick listener', true);\n  const typeOfSeries = select('series type', ['line', 'bar'], 'bar');\n  const debugState = boolean('Enable debug state', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        baseTheme={useBaseTheme()}\n        onAnnotationClick={onAnnotationClick ? action('onAnnotationClick') : undefined}\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\n      />\n      <RectAnnotation\n        id=\"rect1\"\n        dataValues={[\n          {\n            coordinates: {\n              x0: 0,\n              x1: 1,\n              y0: 0,\n              y1: 4,\n            },\n            details: 'details about this annotation',\n          },\n        ]}\n        style={{ fill: 'red' }}\n      />\n      <RectAnnotation\n        id=\"rect2\"\n        dataValues={[\n          {\n            coordinates: {\n              x0: 0.8,\n              x1: 2,\n              y0: 1,\n              y1: 5,\n            },\n            details: 'details about this other annotation',\n          },\n        ]}\n        style={{ fill: 'blue' }}\n      />\n      <LineAnnotation\n        id=\"line_annotation\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={[{ dataValue: 2, details: `detail-${0}` }]}\n        marker={<Icon type=\"alert\" />}\n        markerPosition={Position.Top}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"x-domain axis\" />\n      <Axis id=\"left\" title=\"y-domain axis\" position={Position.Left} />\n      {typeOfSeries === 'line' ? (\n        <LineSeries\n          id=\"lines\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={[\n            { x: 0, y: 2 },\n            { x: 1, y: 3 },\n            { x: 1.5, y: 4 },\n            { x: 3, y: 6 },\n          ]}\n        />\n      ) : (\n        <BarSeries\n          id=\"lines\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={[\n            { x: 0, y: 2 },\n            { x: 1, y: 3 },\n            { x: 1.5, y: 4 },\n            { x: 3, y: 6 },\n          ]}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onAnnotationClick = boolean('onAnnotationClick listener', true);\\n  const onElementClick = boolean('onElementClick listener', true);\\n  const typeOfSeries = select('series type', ['line', 'bar'], 'bar');\\n  const debugState = boolean('Enable debug state', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        baseTheme={useBaseTheme()}\\n        onAnnotationClick={onAnnotationClick ? action('onAnnotationClick') : undefined}\\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect1\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0,\\n              x1: 1,\\n              y0: 0,\\n              y1: 4,\\n            },\\n            details: 'details about this annotation',\\n          },\\n        ]}\\n        style={{ fill: 'red' }}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect2\\\"\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0.8,\\n              x1: 2,\\n              y0: 1,\\n              y1: 5,\\n            },\\n            details: 'details about this other annotation',\\n          },\\n        ]}\\n        style={{ fill: 'blue' }}\\n      />\\n      <LineAnnotation\\n        id=\\\"line_annotation\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={[{ dataValue: 2, details: `detail-${0}` }]}\\n        marker={<Icon type=\\\"alert\\\" />}\\n        markerPosition={Position.Top}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"x-domain axis\\\" />\\n      <Axis id=\\\"left\\\" title=\\\"y-domain axis\\\" position={Position.Left} />\\n      {typeOfSeries === 'line' ? (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 1.5, y: 4 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      ) : (\\n        <BarSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 3 },\\n            { x: 1.5, y: 4 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Annotations/Rects',\n};\n\nexport { Example as linearBarChart } from './1_linear_bar_chart.story';\nexport { Example as ordinalBarChart } from './2_ordinal_bar_chart.story';\nexport { Example as linearLineChart } from './3_linear_line_chart.story';\nexport { Example as styling } from './4_styling.story';\nexport { Example as tooltipOptions } from './5_tooltip_options.story';\nexport { Example as zeroDomain } from './6_zero_domain.story';\nexport { Example as withGroupId } from './7_with_group_id.story';\nexport { Example as outside } from './8_outside.story';\nexport { Example as clickHandleRectAnnotation } from './9_click_handler.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"timestamp per 1 minute\\\"\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"1\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n    />\\n    <AreaSeries\\n      id=\\\"2\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n    />\\n    <AreaSeries\\n      id=\\\"3\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"timestamp per 1 minute\"\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n    <AreaSeries\n      id=\"1\"\n      name=\"Count\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n    />\n    <AreaSeries\n      id=\"2\"\n      name=\"Count\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n    />\n    <AreaSeries\n      id=\"3\"\n      name=\"Count\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"timestamp per 1 minute\\\"\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"1\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n    />\\n    <AreaSeries\\n      id=\\\"2\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n    />\\n    <AreaSeries\\n      id=\\\"3\\\"\\n      name=\\\"Count\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1],\\n    [start.plus({ minute: 1 }).toMillis(), 2],\\n    [start.plus({ minute: 2 }).toMillis(), 3],\\n    [start.plus({ minute: 3 }).toMillis(), 4],\\n    [start.plus({ minute: 4 }).toMillis(), 5],\\n    [start.plus({ minute: 5 }).toMillis(), 4],\\n    [start.plus({ minute: 6 }).toMillis(), 3],\\n    [start.plus({ minute: 7 }).toMillis(), 2],\\n    [start.plus({ minute: 8 }).toMillis(), 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data = [\n    [start.toMillis(), 1],\n    [start.plus({ minute: 1 }).toMillis(), 2],\n    [start.plus({ minute: 2 }).toMillis(), 3],\n    [start.plus({ minute: 3 }).toMillis(), 4],\n    [start.plus({ minute: 4 }).toMillis(), 5],\n    [start.plus({ minute: 5 }).toMillis(), 4],\n    [start.plus({ minute: 6 }).toMillis(), 3],\n    [start.plus({ minute: 7 }).toMillis(), 2],\n    [start.plus({ minute: 8 }).toMillis(), 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id=\"data\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1],\\n    [start.plus({ minute: 1 }).toMillis(), 2],\\n    [start.plus({ minute: 2 }).toMillis(), 3],\\n    [start.plus({ minute: 3 }).toMillis(), 4],\\n    [start.plus({ minute: 4 }).toMillis(), 5],\\n    [start.plus({ minute: 5 }).toMillis(), 4],\\n    [start.plus({ minute: 6 }).toMillis(), 3],\\n    [start.plus({ minute: 7 }).toMillis(), 2],\\n    [start.plus({ minute: 8 }).toMillis(), 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const getRandomNumber = getRandomNumberGenerator();\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => ({\\n    x: d[0],\\n    max: d[1] + 4 + 4 * getRandomNumber(),\\n    min: d[1] - 4 - 4 * getRandomNumber(),\\n  }));\\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [d[0], d[1]]);\\n  const fit = boolean('fit Y domain', true);\\n  const y0AccessorFormat = text('y0AccessorFormat', '');\\n  const y1AccessorFormat = text('y1AccessorFormat', '');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['max']}\\n        y0Accessors={['min']}\\n        y1AccessorFormat={y1AccessorFormat || undefined}\\n        y0AccessorFormat={y0AccessorFormat || undefined}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n\\n      <LineSeries\\n        id=\\\"average\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={lineData}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":88},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":88}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const getRandomNumber = getRandomNumberGenerator();\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => ({\n    x: d[0],\n    max: d[1] + 4 + 4 * getRandomNumber(),\n    min: d[1] - 4 - 4 * getRandomNumber(),\n  }));\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [d[0], d[1]]);\n  const fit = boolean('fit Y domain', true);\n  const y0AccessorFormat = text('y0AccessorFormat', '');\n  const y1AccessorFormat = text('y1AccessorFormat', '');\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"timestamp per 1 minute\"\n        position={Position.Bottom}\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis\n        id=\"left\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n        }}\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['max']}\n        y0Accessors={['min']}\n        y1AccessorFormat={y1AccessorFormat || undefined}\n        y0AccessorFormat={y0AccessorFormat || undefined}\n        data={data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n\n      <LineSeries\n        id=\"average\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={lineData}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const getRandomNumber = getRandomNumberGenerator();\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => ({\\n    x: d[0],\\n    max: d[1] + 4 + 4 * getRandomNumber(),\\n    min: d[1] - 4 - 4 * getRandomNumber(),\\n  }));\\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [d[0], d[1]]);\\n  const fit = boolean('fit Y domain', true);\\n  const y0AccessorFormat = text('y0AccessorFormat', '');\\n  const y1AccessorFormat = text('y1AccessorFormat', '');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['max']}\\n        y0Accessors={['min']}\\n        y1AccessorFormat={y1AccessorFormat || undefined}\\n        y0AccessorFormat={y0AccessorFormat || undefined}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n\\n      <LineSeries\\n        id=\\\"average\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={lineData}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n    [5, 5],\\n    [6, 3],\\n    [7, 8],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 1],\\n    [7, 5],\\n    [8, 6],\\n    [9, 7],\\n  ];\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"stacked area 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <AreaSeries\\n        id=\\\"stacked area 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"non stacked area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":89},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":89}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 2],\n    [2, 2],\n    [3, 3],\n    [4, 5],\n    [5, 5],\n    [6, 3],\n    [7, 8],\n    [8, 2],\n    [9, 1],\n  ];\n  const data2 = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 4],\n  ];\n  const data3 = [\n    [1, 6],\n    [2, 6],\n    [3, 3],\n    [4, 2],\n    [5, 1],\n    [6, 1],\n    [7, 5],\n    [8, 6],\n    [9, 7],\n  ];\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id=\"stacked area 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data1}\n      />\n      <AreaSeries\n        id=\"stacked area 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data2}\n      />\n      <AreaSeries\n        id=\"non stacked area\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n    [5, 5],\\n    [6, 3],\\n    [7, 8],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 1],\\n    [7, 5],\\n    [8, 6],\\n    [9, 7],\\n  ];\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id=\\\"stacked area 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <AreaSeries\\n        id=\\\"stacked area 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"non stacked area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, CurveType, AreaSeries, Position, Axis, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n    <Axis id=\\\"left\\\" position={Position.Left} />\\n    <AreaSeries\\n      id=\\\"path-order\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"col-0-3\\\"\\n      yAccessors={['col-2-5']}\\n      data={data}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n      splitSeriesAccessors={['col-1-6']}\\n      stackAccessors={['col-1-6']}\\n      areaSeriesStyle={{\\n        point: { visible: true },\\n      }}\\n    />\\n  </Chart>\\n);\\n\\nconst data = [\\n  {\\n    'col-0-3': 'ZRH',\\n    'col-1-6': 'Logstash Airways',\\n    'col-2-5': 27,\\n  },\\n  {\\n    'col-0-3': 'ZRH',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 38,\\n  },\\n  {\\n    'col-0-3': 'ZRH',\\n    'col-1-6': 'JetBeats',\\n    'col-2-5': 26,\\n  },\\n  {\\n    'col-0-3': 'ZRH',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 33,\\n  },\\n  {\\n    'col-0-3': 'YYZ',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 5,\\n  },\\n  {\\n    'col-0-3': 'YYZ',\\n    'col-1-6': 'JetBeats',\\n    'col-2-5': 7,\\n  },\\n  {\\n    'col-0-3': 'YYZ',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 4,\\n  },\\n  {\\n    'col-0-3': 'YWG',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 10,\\n  },\\n  {\\n    'col-0-3': 'YWG',\\n    'col-1-6': 'Logstash Airways',\\n    'col-2-5': 17,\\n  },\\n  {\\n    'col-0-3': 'YWG',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 19,\\n  },\\n  {\\n    'col-0-3': 'YUL',\\n    'col-1-6': 'Logstash Airways',\\n    'col-2-5': 4,\\n  },\\n  {\\n    'col-0-3': 'YUL',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 7,\\n  },\\n  {\\n    'col-0-3': 'YUL',\\n    'col-1-6': 'JetBeats',\\n    'col-2-5': 4,\\n  },\\n  {\\n    'col-0-3': 'YUL',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 13,\\n  },\\n  {\\n    'col-0-3': 'YOW',\\n    'col-1-6': 'Logstash Airways',\\n    'col-2-5': 11,\\n  },\\n  {\\n    'col-0-3': 'YOW',\\n    'col-1-6': 'Kibana Airlines',\\n    'col-2-5': 6,\\n  },\\n  {\\n    'col-0-3': 'YOW',\\n    'col-1-6': 'ES-Air',\\n    'col-2-5': 14,\\n  },\\n];\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":36},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":36}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, CurveType, AreaSeries, Position, Axis, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} />\n    <Axis id=\"left\" position={Position.Left} />\n    <AreaSeries\n      id=\"path-order\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"col-0-3\"\n      yAccessors={['col-2-5']}\n      data={data}\n      curve={CurveType.CURVE_CATMULL_ROM}\n      splitSeriesAccessors={['col-1-6']}\n      stackAccessors={['col-1-6']}\n      areaSeriesStyle={{\n        point: { visible: true },\n      }}\n    />\n  </Chart>\n);\n\nconst data = [\n  {\n    'col-0-3': 'ZRH',\n    'col-1-6': 'Logstash Airways',\n    'col-2-5': 27,\n  },\n  {\n    'col-0-3': 'ZRH',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 38,\n  },\n  {\n    'col-0-3': 'ZRH',\n    'col-1-6': 'JetBeats',\n    'col-2-5': 26,\n  },\n  {\n    'col-0-3': 'ZRH',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 33,\n  },\n  {\n    'col-0-3': 'YYZ',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 5,\n  },\n  {\n    'col-0-3': 'YYZ',\n    'col-1-6': 'JetBeats',\n    'col-2-5': 7,\n  },\n  {\n    'col-0-3': 'YYZ',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 4,\n  },\n  {\n    'col-0-3': 'YWG',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 10,\n  },\n  {\n    'col-0-3': 'YWG',\n    'col-1-6': 'Logstash Airways',\n    'col-2-5': 17,\n  },\n  {\n    'col-0-3': 'YWG',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 19,\n  },\n  {\n    'col-0-3': 'YUL',\n    'col-1-6': 'Logstash Airways',\n    'col-2-5': 4,\n  },\n  {\n    'col-0-3': 'YUL',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 7,\n  },\n  {\n    'col-0-3': 'YUL',\n    'col-1-6': 'JetBeats',\n    'col-2-5': 4,\n  },\n  {\n    'col-0-3': 'YUL',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 13,\n  },\n  {\n    'col-0-3': 'YOW',\n    'col-1-6': 'Logstash Airways',\n    'col-2-5': 11,\n  },\n  {\n    'col-0-3': 'YOW',\n    'col-1-6': 'Kibana Airlines',\n    'col-2-5': 6,\n  },\n  {\n    'col-0-3': 'YOW',\n    'col-1-6': 'ES-Air',\n    'col-2-5': 14,\n  },\n];\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n    <Axis id=\\\"left\\\" position={Position.Left} />\\n    <AreaSeries\\n      id=\\\"path-order\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"col-0-3\\\"\\n      yAccessors={['col-2-5']}\\n      data={data}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n      splitSeriesAccessors={['col-1-6']}\\n      stackAccessors={['col-1-6']}\\n      areaSeriesStyle={{\\n        point: { visible: true },\\n      }}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map(([x, y]) => [x, -y]);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"negative metric\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\\n        }}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map(([x, y]) => [x, -y]);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title=\"negative metric\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          min: NaN,\n          max: NaN,\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\n        }}\n      />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Time}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"negative metric\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\\n        }}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const dataset = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={dataset.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\\n        }}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={dataset.data.map(([x, y], i) => {\\n          return [x, i < dataset.data.length / 2 ? -y : y];\\n        })}\\n      />\\n      <AreaSeries\\n        id=\\\"area2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={dataset.data.map(([x, y], i) => {\\n          return [x, i >= dataset.data.length / 2 ? -y : y];\\n        })}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const dataset = KIBANA_METRICS.metrics.kibana_os_load.v1;\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"timestamp per 1 minute\"\n        position={Position.Bottom}\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis\n        id=\"left\"\n        title={dataset.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          min: NaN,\n          max: NaN,\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\n        }}\n      />\n\n      <AreaSeries\n        id=\"area1\"\n        xScaleType={ScaleType.Time}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={dataset.data.map(([x, y], i) => {\n          return [x, i < dataset.data.length / 2 ? -y : y];\n        })}\n      />\n      <AreaSeries\n        id=\"area2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={dataset.data.map(([x, y], i) => {\n          return [x, i >= dataset.data.length / 2 ? -y : y];\n        })}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const dataset = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={dataset.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          logMinLimit: number('Y log limit', 1, { min: 0 }),\\n        }}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={dataset.data.map(([x, y], i) => {\\n          return [x, i < dataset.data.length / 2 ? -y : y];\\n        })}\\n      />\\n      <AreaSeries\\n        id=\\\"area2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={dataset.data.map(([x, y], i) => {\\n          return [x, i >= dataset.data.length / 2 ? -y : y];\\n        })}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Fit, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  const data = [\\n    [0, -5, -2],\\n    [1, -6, -2.1],\\n    [2, -8, -0.9],\\n    [3, -3, -1.2],\\n    [4, -2.3, -1.6],\\n    [5, -4, -3.4],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{ areaSeriesStyle: { point: { visible: true } }, lineSeriesStyle: { point: { visible: false } } }}\\n        baseTheme={useBaseTheme()}\\n        xDomain={{\\n          min: NaN,\\n          max: NaN,\\n          minInterval: 1,\\n        }}\\n      />\\n      <Axis id=\\\"bottom\\\" title=\\\"timestamp\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"metric\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"band\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        y0Accessors={[2]}\\n        data={data}\\n      />\\n\\n      <LineSeries\\n        id=\\\"metric\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={Fit.Carry}\\n        data={data.map(([x, y1, y0]) => {\\n          return [x, (y1 + y0) / 2];\\n        })}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":67},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":67}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Fit, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\n\n  const data = [\n    [0, -5, -2],\n    [1, -6, -2.1],\n    [2, -8, -0.9],\n    [3, -3, -1.2],\n    [4, -2.3, -1.6],\n    [5, -4, -3.4],\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{ areaSeriesStyle: { point: { visible: true } }, lineSeriesStyle: { point: { visible: false } } }}\n        baseTheme={useBaseTheme()}\n        xDomain={{\n          min: NaN,\n          max: NaN,\n          minInterval: 1,\n        }}\n      />\n      <Axis id=\"bottom\" title=\"timestamp\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left\" title=\"metric\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <AreaSeries\n        id=\"band\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        y0Accessors={[2]}\n        data={data}\n      />\n\n      <LineSeries\n        id=\"metric\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        fit={Fit.Carry}\n        data={data.map(([x, y1, y0]) => {\n          return [x, (y1 + y0) / 2];\n        })}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const yScaleType = customKnobs.enum.scaleType('Y scale', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  const data = [\\n    [0, -5, -2],\\n    [1, -6, -2.1],\\n    [2, -8, -0.9],\\n    [3, -3, -1.2],\\n    [4, -2.3, -1.6],\\n    [5, -4, -3.4],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{ areaSeriesStyle: { point: { visible: true } }, lineSeriesStyle: { point: { visible: false } } }}\\n        baseTheme={useBaseTheme()}\\n        xDomain={{\\n          min: NaN,\\n          max: NaN,\\n          minInterval: 1,\\n        }}\\n      />\\n      <Axis id=\\\"bottom\\\" title=\\\"timestamp\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"metric\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"band\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        y0Accessors={[2]}\\n        data={data}\\n      />\\n\\n      <LineSeries\\n        id=\\\"metric\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={Fit.Carry}\\n        data={data.map(([x, y1, y0]) => {\\n          return [x, (y1 + y0) / 2];\\n        })}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":32},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":32}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst data = [\\n  {\\n    key: 0,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 107.2871113576205,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 133,\\n    doc_count: 169,\\n  },\\n  {\\n    key: 164.87534966839775,\\n    doc_count: 1984,\\n  },\\n  {\\n    key: 204.39008216749184,\\n    doc_count: 1376,\\n  },\\n  {\\n    key: 253.37508470765238,\\n    doc_count: 692,\\n  },\\n  {\\n    key: 314.100042770181,\\n    doc_count: 287,\\n  },\\n  {\\n    key: 389.378604380393,\\n    doc_count: 222,\\n  },\\n  {\\n    key: 482.69874850082726,\\n    doc_count: 564,\\n  },\\n  {\\n    key: 598.3843980719687,\\n    doc_count: 4045,\\n  },\\n  {\\n    key: 741.7957659265381,\\n    doc_count: 8143,\\n  },\\n  {\\n    key: 919.5777164637204,\\n    doc_count: 15190,\\n  },\\n  {\\n    key: 1139.967650746035,\\n    doc_count: 23055,\\n  },\\n  {\\n    key: 1413.1771806572506,\\n    doc_count: 15015,\\n  },\\n  {\\n    key: 1751.8652767237954,\\n    doc_count: 14600,\\n  },\\n  {\\n    key: 2171.7248125696256,\\n    doc_count: 17494,\\n  },\\n  {\\n    key: 2692.2096831274607,\\n    doc_count: 13394,\\n  },\\n  {\\n    key: 3337.4361871149363,\\n    doc_count: 13903,\\n  },\\n  {\\n    key: 4137.300438695783,\\n    doc_count: 21022,\\n  },\\n  {\\n    key: 5128.863582805883,\\n    doc_count: 30053,\\n  },\\n  {\\n    key: 6358.068997117526,\\n    doc_count: 37550,\\n  },\\n  {\\n    key: 7881.871045981584,\\n    doc_count: 40121,\\n  },\\n  {\\n    key: 9770.874020657398,\\n    doc_count: 41401,\\n  },\\n  {\\n    key: 12112.60353926129,\\n    doc_count: 37269,\\n  },\\n  {\\n    key: 15015.56198443892,\\n    doc_count: 27225,\\n  },\\n  {\\n    key: 18614.255884600516,\\n    doc_count: 19608,\\n  },\\n  {\\n    key: 23075.428178876242,\\n    doc_count: 13488,\\n  },\\n  {\\n    key: 28605.7841333851,\\n    doc_count: 10287,\\n  },\\n  {\\n    key: 35461.56888368852,\\n    doc_count: 7402,\\n  },\\n  {\\n    key: 43960.44037209106,\\n    doc_count: 4775,\\n  },\\n  {\\n    key: 54496.18780394934,\\n    doc_count: 3816,\\n  },\\n  {\\n    key: 67556.97759226183,\\n    doc_count: 2524,\\n  },\\n  {\\n    key: 83747.97220349085,\\n    doc_count: 2613,\\n  },\\n  {\\n    key: 103819.3699328557,\\n    doc_count: 1984,\\n  },\\n  {\\n    key: 128701.16481227305,\\n    doc_count: 2151,\\n  },\\n  {\\n    key: 159546.2372267188,\\n    doc_count: 3005,\\n  },\\n  {\\n    key: 197783.77181227363,\\n    doc_count: 2492,\\n  },\\n  {\\n    key: 245185.47771641501,\\n    doc_count: 1576,\\n  },\\n  {\\n    key: 303947.67948952696,\\n    doc_count: 718,\\n  },\\n  {\\n    key: 376793.0822310816,\\n    doc_count: 453,\\n  },\\n  {\\n    key: 467096.9262066379,\\n    doc_count: 225,\\n  },\\n  {\\n    key: 579043.3762207008,\\n    doc_count: 107,\\n  },\\n  {\\n    key: 717819.3919365238,\\n    doc_count: 63,\\n  },\\n  {\\n    key: 889855.0619871503,\\n    doc_count: 20,\\n  },\\n  {\\n    key: 1103121.537588911,\\n    doc_count: 23,\\n  },\\n  {\\n    key: 1367500.3702008445,\\n    doc_count: 20,\\n  },\\n  {\\n    key: 1695241.366229529,\\n    doc_count: 21,\\n  },\\n  {\\n    key: 2101530.173153578,\\n    doc_count: 10,\\n  },\\n  {\\n    key: 2605191.89576981,\\n    doc_count: 8,\\n  },\\n  {\\n    key: 3229563.3441227335,\\n    doc_count: 33,\\n  },\\n  {\\n    key: 4003574.3281088388,\\n    doc_count: 979,\\n  },\\n  {\\n    key: 4963088.099777182,\\n    doc_count: 2199,\\n  },\\n  {\\n    key: 6152563.051773136,\\n    doc_count: 965,\\n  },\\n  {\\n    key: 7627112.665548564,\\n    doc_count: 72,\\n  },\\n  {\\n    key: 9455059.155583354,\\n    doc_count: 51,\\n  },\\n  {\\n    key: 11721099.130918715,\\n    doc_count: 64,\\n  },\\n  {\\n    key: 14530227.95269304,\\n    doc_count: 12,\\n  },\\n  {\\n    key: 18012604.620013494,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 22329582.59521292,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 27681186.00251957,\\n    doc_count: 3,\\n  },\\n  {\\n    key: 34315377.60452156,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 42539547.981568344,\\n    doc_count: 13,\\n  },\\n  {\\n    key: 52734758.257117845,\\n    doc_count: 13,\\n  },\\n  {\\n    key: 65373396.295644514,\\n    doc_count: 24,\\n  },\\n  {\\n    key: 81041064.46056497,\\n    doc_count: 28,\\n  },\\n  {\\n    key: 100463713.0859759,\\n    doc_count: 51,\\n  },\\n  {\\n    key: 124541276.87245026,\\n    doc_count: 93,\\n  },\\n  {\\n    key: 154389372.72551844,\\n    doc_count: 183,\\n  },\\n  {\\n    key: 191390991.07672492,\\n    doc_count: 208,\\n  },\\n  {\\n    key: 237260575.76809216,\\n    doc_count: 91,\\n  },\\n  {\\n    key: 294123461.59616184,\\n    doc_count: 6,\\n  },\\n  {\\n    key: 364614350.19809616,\\n    doc_count: 5,\\n  },\\n  {\\n    key: 451999387.09042615,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 560327496.2138001,\\n    doc_count: 0.0001,\\n  },\\n  {\\n    key: 694617983.9629189,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 861093105.2018316,\\n    doc_count: 1,\\n  },\\n  {\\n    key: 1067466367.046606,\\n    doc_count: 0.0001,\\n  },\\n  {\\n    key: 1323299928.7673922,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 1640447657.681875,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 2033604369.721831,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 2520986703.3463764,\\n    doc_count: 1,\\n  },\\n  {\\n    key: 3125177174.6136513,\\n    doc_count: 3,\\n  },\\n  {\\n    key: 3874170522.10617,\\n    doc_count: 1,\\n  },\\n  {\\n    key: 4802670823.362817,\\n    doc_count: 4,\\n  },\\n  {\\n    key: 5953699483.790642,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 7380588603.086767,\\n    doc_count: 2,\\n  },\\n  {\\n    key: 9149452080.394913,\\n    doc_count: 10,\\n  },\\n  {\\n    key: 11342248955.107962,\\n    doc_count: 5,\\n  },\\n  {\\n    key: 14060580921.04847,\\n    doc_count: 3,\\n  },\\n  {\\n    key: 17430399969.162903,\\n    doc_count: 6,\\n  },\\n  {\\n    key: 21607844284.02827,\\n    doc_count: 7,\\n  },\\n  {\\n    key: 26786472796.311687,\\n    doc_count: 9,\\n  },\\n  {\\n    key: 33206233599.059467,\\n    doc_count: 11,\\n  },\\n  {\\n    key: 41164581773.04837,\\n    doc_count: 10,\\n  },\\n  {\\n    key: 51030261757.77967,\\n    doc_count: 13,\\n  },\\n  {\\n    key: 63260392864.53983,\\n    doc_count: 6,\\n  },\\n  {\\n    key: 78421649576.7008,\\n    doc_count: 8,\\n  },\\n  {\\n    key: 97216518011.51195,\\n    doc_count: 4,\\n  },\\n  {\\n    key: 120515845117.98601,\\n    doc_count: 0.0001,\\n  },\\n  {\\n    key: 149399188754.96533,\\n    doc_count: 0,\\n  },\\n  {\\n    key: 185204838241.72855,\\n    doc_count: 0,\\n  },\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"X\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis id=\\\"Y\\\" position={Position.Left} />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Log}\\n        yScaleType={ScaleType.Log}\\n        xAccessor=\\\"key\\\"\\n        yAccessors={['doc_count']}\\n        data={data.map((d) => ({ ...d, doc_count: d.doc_count < 1 ? null : d.doc_count }))}\\n        curve={CurveType.CURVE_STEP_AFTER}\\n        tickFormat={(d) => d.toFixed(1)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":423},\"endLoc\":{\"col\":1,\"line\":442},\"startBody\":{\"col\":36,\"line\":423},\"endBody\":{\"col\":1,\"line\":442}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst data = [\n  {\n    key: 0,\n    doc_count: 0,\n  },\n  {\n    key: 107.2871113576205,\n    doc_count: 0,\n  },\n  {\n    key: 133,\n    doc_count: 169,\n  },\n  {\n    key: 164.87534966839775,\n    doc_count: 1984,\n  },\n  {\n    key: 204.39008216749184,\n    doc_count: 1376,\n  },\n  {\n    key: 253.37508470765238,\n    doc_count: 692,\n  },\n  {\n    key: 314.100042770181,\n    doc_count: 287,\n  },\n  {\n    key: 389.378604380393,\n    doc_count: 222,\n  },\n  {\n    key: 482.69874850082726,\n    doc_count: 564,\n  },\n  {\n    key: 598.3843980719687,\n    doc_count: 4045,\n  },\n  {\n    key: 741.7957659265381,\n    doc_count: 8143,\n  },\n  {\n    key: 919.5777164637204,\n    doc_count: 15190,\n  },\n  {\n    key: 1139.967650746035,\n    doc_count: 23055,\n  },\n  {\n    key: 1413.1771806572506,\n    doc_count: 15015,\n  },\n  {\n    key: 1751.8652767237954,\n    doc_count: 14600,\n  },\n  {\n    key: 2171.7248125696256,\n    doc_count: 17494,\n  },\n  {\n    key: 2692.2096831274607,\n    doc_count: 13394,\n  },\n  {\n    key: 3337.4361871149363,\n    doc_count: 13903,\n  },\n  {\n    key: 4137.300438695783,\n    doc_count: 21022,\n  },\n  {\n    key: 5128.863582805883,\n    doc_count: 30053,\n  },\n  {\n    key: 6358.068997117526,\n    doc_count: 37550,\n  },\n  {\n    key: 7881.871045981584,\n    doc_count: 40121,\n  },\n  {\n    key: 9770.874020657398,\n    doc_count: 41401,\n  },\n  {\n    key: 12112.60353926129,\n    doc_count: 37269,\n  },\n  {\n    key: 15015.56198443892,\n    doc_count: 27225,\n  },\n  {\n    key: 18614.255884600516,\n    doc_count: 19608,\n  },\n  {\n    key: 23075.428178876242,\n    doc_count: 13488,\n  },\n  {\n    key: 28605.7841333851,\n    doc_count: 10287,\n  },\n  {\n    key: 35461.56888368852,\n    doc_count: 7402,\n  },\n  {\n    key: 43960.44037209106,\n    doc_count: 4775,\n  },\n  {\n    key: 54496.18780394934,\n    doc_count: 3816,\n  },\n  {\n    key: 67556.97759226183,\n    doc_count: 2524,\n  },\n  {\n    key: 83747.97220349085,\n    doc_count: 2613,\n  },\n  {\n    key: 103819.3699328557,\n    doc_count: 1984,\n  },\n  {\n    key: 128701.16481227305,\n    doc_count: 2151,\n  },\n  {\n    key: 159546.2372267188,\n    doc_count: 3005,\n  },\n  {\n    key: 197783.77181227363,\n    doc_count: 2492,\n  },\n  {\n    key: 245185.47771641501,\n    doc_count: 1576,\n  },\n  {\n    key: 303947.67948952696,\n    doc_count: 718,\n  },\n  {\n    key: 376793.0822310816,\n    doc_count: 453,\n  },\n  {\n    key: 467096.9262066379,\n    doc_count: 225,\n  },\n  {\n    key: 579043.3762207008,\n    doc_count: 107,\n  },\n  {\n    key: 717819.3919365238,\n    doc_count: 63,\n  },\n  {\n    key: 889855.0619871503,\n    doc_count: 20,\n  },\n  {\n    key: 1103121.537588911,\n    doc_count: 23,\n  },\n  {\n    key: 1367500.3702008445,\n    doc_count: 20,\n  },\n  {\n    key: 1695241.366229529,\n    doc_count: 21,\n  },\n  {\n    key: 2101530.173153578,\n    doc_count: 10,\n  },\n  {\n    key: 2605191.89576981,\n    doc_count: 8,\n  },\n  {\n    key: 3229563.3441227335,\n    doc_count: 33,\n  },\n  {\n    key: 4003574.3281088388,\n    doc_count: 979,\n  },\n  {\n    key: 4963088.099777182,\n    doc_count: 2199,\n  },\n  {\n    key: 6152563.051773136,\n    doc_count: 965,\n  },\n  {\n    key: 7627112.665548564,\n    doc_count: 72,\n  },\n  {\n    key: 9455059.155583354,\n    doc_count: 51,\n  },\n  {\n    key: 11721099.130918715,\n    doc_count: 64,\n  },\n  {\n    key: 14530227.95269304,\n    doc_count: 12,\n  },\n  {\n    key: 18012604.620013494,\n    doc_count: 2,\n  },\n  {\n    key: 22329582.59521292,\n    doc_count: 2,\n  },\n  {\n    key: 27681186.00251957,\n    doc_count: 3,\n  },\n  {\n    key: 34315377.60452156,\n    doc_count: 2,\n  },\n  {\n    key: 42539547.981568344,\n    doc_count: 13,\n  },\n  {\n    key: 52734758.257117845,\n    doc_count: 13,\n  },\n  {\n    key: 65373396.295644514,\n    doc_count: 24,\n  },\n  {\n    key: 81041064.46056497,\n    doc_count: 28,\n  },\n  {\n    key: 100463713.0859759,\n    doc_count: 51,\n  },\n  {\n    key: 124541276.87245026,\n    doc_count: 93,\n  },\n  {\n    key: 154389372.72551844,\n    doc_count: 183,\n  },\n  {\n    key: 191390991.07672492,\n    doc_count: 208,\n  },\n  {\n    key: 237260575.76809216,\n    doc_count: 91,\n  },\n  {\n    key: 294123461.59616184,\n    doc_count: 6,\n  },\n  {\n    key: 364614350.19809616,\n    doc_count: 5,\n  },\n  {\n    key: 451999387.09042615,\n    doc_count: 2,\n  },\n  {\n    key: 560327496.2138001,\n    doc_count: 0.0001,\n  },\n  {\n    key: 694617983.9629189,\n    doc_count: 0,\n  },\n  {\n    key: 861093105.2018316,\n    doc_count: 1,\n  },\n  {\n    key: 1067466367.046606,\n    doc_count: 0.0001,\n  },\n  {\n    key: 1323299928.7673922,\n    doc_count: 0,\n  },\n  {\n    key: 1640447657.681875,\n    doc_count: 0,\n  },\n  {\n    key: 2033604369.721831,\n    doc_count: 0,\n  },\n  {\n    key: 2520986703.3463764,\n    doc_count: 1,\n  },\n  {\n    key: 3125177174.6136513,\n    doc_count: 3,\n  },\n  {\n    key: 3874170522.10617,\n    doc_count: 1,\n  },\n  {\n    key: 4802670823.362817,\n    doc_count: 4,\n  },\n  {\n    key: 5953699483.790642,\n    doc_count: 2,\n  },\n  {\n    key: 7380588603.086767,\n    doc_count: 2,\n  },\n  {\n    key: 9149452080.394913,\n    doc_count: 10,\n  },\n  {\n    key: 11342248955.107962,\n    doc_count: 5,\n  },\n  {\n    key: 14060580921.04847,\n    doc_count: 3,\n  },\n  {\n    key: 17430399969.162903,\n    doc_count: 6,\n  },\n  {\n    key: 21607844284.02827,\n    doc_count: 7,\n  },\n  {\n    key: 26786472796.311687,\n    doc_count: 9,\n  },\n  {\n    key: 33206233599.059467,\n    doc_count: 11,\n  },\n  {\n    key: 41164581773.04837,\n    doc_count: 10,\n  },\n  {\n    key: 51030261757.77967,\n    doc_count: 13,\n  },\n  {\n    key: 63260392864.53983,\n    doc_count: 6,\n  },\n  {\n    key: 78421649576.7008,\n    doc_count: 8,\n  },\n  {\n    key: 97216518011.51195,\n    doc_count: 4,\n  },\n  {\n    key: 120515845117.98601,\n    doc_count: 0.0001,\n  },\n  {\n    key: 149399188754.96533,\n    doc_count: 0,\n  },\n  {\n    key: 185204838241.72855,\n    doc_count: 0,\n  },\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"X\" title=\"index\" position={Position.Bottom} />\n      <Axis id=\"Y\" position={Position.Left} />\n\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Log}\n        yScaleType={ScaleType.Log}\n        xAccessor=\"key\"\n        yAccessors={['doc_count']}\n        data={data.map((d) => ({ ...d, doc_count: d.doc_count < 1 ? null : d.doc_count }))}\n        curve={CurveType.CURVE_STEP_AFTER}\n        tickFormat={(d) => d.toFixed(1)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"X\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis id=\\\"Y\\\" position={Position.Left} />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Log}\\n        yScaleType={ScaleType.Log}\\n        xAccessor=\\\"key\\\"\\n        yAccessors={['doc_count']}\\n        data={data.map((d) => ({ ...d, doc_count: d.doc_count < 1 ? null : d.doc_count }))}\\n        curve={CurveType.CURVE_STEP_AFTER}\\n        tickFormat={(d) => d.toFixed(1)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, AxisProps, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { SB_SOURCE_PANEL } from '../utils/storybook';\\n\\nconst fontFamily = '\\\"Atkinson Hyperlegible\\\"';\\nconst tickLabelStyle = { fontSize: 11, fontFamily };\\nconst axisTitleColor = 'rgb(112,112,112)';\\nconst axisTitleFontSize = 15;\\nconst dataInk = 'rgba(96, 146, 192, 1)';\\nconst horizontalGridLineStyle: AxisProps['gridLine'] = {\\n  visible: true,\\n  stroke: 'black',\\n  strokeWidth: 0.15,\\n  opacity: 1,\\n};\\n\\nconst tooltipDateFormatter = (d: any) =>\\n  new Intl.DateTimeFormat('en-US', {\\n    year: 'numeric',\\n    month: 'long',\\n    day: 'numeric',\\n    hour: 'numeric',\\n    minute: 'numeric',\\n  }).format(d);\\n\\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\nconst t0 = data[0][0];\\nconst t1 = data[data.length - 1][0];\\n\\nconst topAxisLabelFormat = (d: any) =>\\n  `${new Intl.DateTimeFormat('en-US', { minute: 'numeric' }).format(d).padStart(2, '0')}′  `;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showLegend = boolean('Show legend', false);\\n  const minorGridLines = boolean('Minor grid lines', true);\\n  const horizontalAxisTitle = boolean('Horizontal axis title', false);\\n  const yAxisTitle = 'CPU utilization';\\n  const timeZoom = number('Time zoom', data.length, {\\n    range: true,\\n    min: 0,\\n    max: data.length,\\n    step: 1,\\n  });\\n  const timeStretch = number('Stretch time', -0.4, {\\n    range: true,\\n    min: -20,\\n    max: 18,\\n    step: 0.2,\\n  });\\n  const timeShift = number('Shift time', 0, {\\n    range: true,\\n    min: -10,\\n    max: 10,\\n    step: 0.05,\\n  });\\n  const binWidth = number('Bin width in ms (0: none specifed)', 0, {\\n    range: false,\\n    min: 0,\\n    max: 10 * 365 * 24 * 60 * 60 * 1000,\\n    step: 1,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend={showLegend}\\n        baseTheme={useBaseTheme()}\\n        theme={{ axes: { tickLine: { visible: true } } }}\\n        xDomain={\\n          binWidth > 0\\n            ? {\\n                min: NaN,\\n                max: NaN,\\n                minInterval: binWidth,\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"x_minor\\\"\\n        position={boolean('Top X axis', false) ? Position.Top : Position.Bottom}\\n        showOverlappingTicks={boolean('showOverlappingTicks time axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels time axis', false)}\\n        gridLine={{\\n          visible: minorGridLines,\\n        }}\\n        style={{\\n          axisLine: { stroke: dataInk },\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            ...tickLabelStyle,\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n\\n          axisTitle: { fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\\n        }}\\n        tickFormat={tooltipDateFormatter}\\n        labelFormat={topAxisLabelFormat}\\n        title=\\\"time (1-minute measurements)\\\"\\n        timeAxisLayerCount={number('layerCount', 3, { range: true, min: 0, max: 3, step: 1 })}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={yAxisTitle}\\n        position={Position.Left}\\n        gridLine={horizontalGridLineStyle}\\n        ticks={4}\\n        style={{\\n          tickLine: { ...horizontalGridLineStyle, size: 8, padding: 4 },\\n          axisLine: { visible: false },\\n          tickLabel: tickLabelStyle,\\n          axisTitle: { visible: !horizontalAxisTitle, fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\\n        }}\\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n      />\\n      <AreaSeries\\n        id=\\\"CPU Utilization\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        yNice\\n        color={dataInk}\\n        areaSeriesStyle={{ area: { opacity: 0.3 }, line: { opacity: 1 } }}\\n        data={data\\n          .slice(0, timeZoom)\\n          .map(([t, v]) => [t0 + (t - t0) * 4 * 2 ** timeStretch - (t1 - t0) * 2 ** timeStretch * timeShift, v])}\\n      />\\n    </Chart>\\n  );\\n};\\n\\n// storybook configuration\\nExample.parameters = {\\n  options: { selectedPanel: SB_SOURCE_PANEL },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":47},\"endLoc\":{\"col\":1,\"line\":147},\"startBody\":{\"col\":36,\"line\":47},\"endBody\":{\"col\":1,\"line\":147}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, AxisProps, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { SB_SOURCE_PANEL } from '../utils/storybook';\n\nconst fontFamily = '\"Atkinson Hyperlegible\"';\nconst tickLabelStyle = { fontSize: 11, fontFamily };\nconst axisTitleColor = 'rgb(112,112,112)';\nconst axisTitleFontSize = 15;\nconst dataInk = 'rgba(96, 146, 192, 1)';\nconst horizontalGridLineStyle: AxisProps['gridLine'] = {\n  visible: true,\n  stroke: 'black',\n  strokeWidth: 0.15,\n  opacity: 1,\n};\n\nconst tooltipDateFormatter = (d: any) =>\n  new Intl.DateTimeFormat('en-US', {\n    year: 'numeric',\n    month: 'long',\n    day: 'numeric',\n    hour: 'numeric',\n    minute: 'numeric',\n  }).format(d);\n\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\nconst t0 = data[0][0];\nconst t1 = data[data.length - 1][0];\n\nconst topAxisLabelFormat = (d: any) =>\n  `${new Intl.DateTimeFormat('en-US', { minute: 'numeric' }).format(d).padStart(2, '0')}′  `;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showLegend = boolean('Show legend', false);\n  const minorGridLines = boolean('Minor grid lines', true);\n  const horizontalAxisTitle = boolean('Horizontal axis title', false);\n  const yAxisTitle = 'CPU utilization';\n  const timeZoom = number('Time zoom', data.length, {\n    range: true,\n    min: 0,\n    max: data.length,\n    step: 1,\n  });\n  const timeStretch = number('Stretch time', -0.4, {\n    range: true,\n    min: -20,\n    max: 18,\n    step: 0.2,\n  });\n  const timeShift = number('Shift time', 0, {\n    range: true,\n    min: -10,\n    max: 10,\n    step: 0.05,\n  });\n  const binWidth = number('Bin width in ms (0: none specifed)', 0, {\n    range: false,\n    min: 0,\n    max: 10 * 365 * 24 * 60 * 60 * 1000,\n    step: 1,\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend={showLegend}\n        baseTheme={useBaseTheme()}\n        theme={{ axes: { tickLine: { visible: true } } }}\n        xDomain={\n          binWidth > 0\n            ? {\n                min: NaN,\n                max: NaN,\n                minInterval: binWidth,\n              }\n            : undefined\n        }\n      />\n      <Axis\n        id=\"x_minor\"\n        position={boolean('Top X axis', false) ? Position.Top : Position.Bottom}\n        showOverlappingTicks={boolean('showOverlappingTicks time axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels time axis', false)}\n        gridLine={{\n          visible: minorGridLines,\n        }}\n        style={{\n          axisLine: { stroke: dataInk },\n          tickLine: { size: 0.0001, padding: 4 },\n          tickLabel: {\n            ...tickLabelStyle,\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n            padding: 0,\n            offset: { x: 0, y: 0 },\n          },\n\n          axisTitle: { fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\n        }}\n        tickFormat={tooltipDateFormatter}\n        labelFormat={topAxisLabelFormat}\n        title=\"time (1-minute measurements)\"\n        timeAxisLayerCount={number('layerCount', 3, { range: true, min: 0, max: 3, step: 1 })}\n      />\n      <Axis\n        id=\"left\"\n        title={yAxisTitle}\n        position={Position.Left}\n        gridLine={horizontalGridLineStyle}\n        ticks={4}\n        style={{\n          tickLine: { ...horizontalGridLineStyle, size: 8, padding: 4 },\n          axisLine: { visible: false },\n          tickLabel: tickLabelStyle,\n          axisTitle: { visible: !horizontalAxisTitle, fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\n        }}\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n      />\n      <AreaSeries\n        id=\"CPU Utilization\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        yNice\n        color={dataInk}\n        areaSeriesStyle={{ area: { opacity: 0.3 }, line: { opacity: 1 } }}\n        data={data\n          .slice(0, timeZoom)\n          .map(([t, v]) => [t0 + (t - t0) * 4 * 2 ** timeStretch - (t1 - t0) * 2 ** timeStretch * timeShift, v])}\n      />\n    </Chart>\n  );\n};\n\n// storybook configuration\nExample.parameters = {\n  options: { selectedPanel: SB_SOURCE_PANEL },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showLegend = boolean('Show legend', false);\\n  const minorGridLines = boolean('Minor grid lines', true);\\n  const horizontalAxisTitle = boolean('Horizontal axis title', false);\\n  const yAxisTitle = 'CPU utilization';\\n  const timeZoom = number('Time zoom', data.length, {\\n    range: true,\\n    min: 0,\\n    max: data.length,\\n    step: 1,\\n  });\\n  const timeStretch = number('Stretch time', -0.4, {\\n    range: true,\\n    min: -20,\\n    max: 18,\\n    step: 0.2,\\n  });\\n  const timeShift = number('Shift time', 0, {\\n    range: true,\\n    min: -10,\\n    max: 10,\\n    step: 0.05,\\n  });\\n  const binWidth = number('Bin width in ms (0: none specifed)', 0, {\\n    range: false,\\n    min: 0,\\n    max: 10 * 365 * 24 * 60 * 60 * 1000,\\n    step: 1,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend={showLegend}\\n        baseTheme={useBaseTheme()}\\n        theme={{ axes: { tickLine: { visible: true } } }}\\n        xDomain={\\n          binWidth > 0\\n            ? {\\n                min: NaN,\\n                max: NaN,\\n                minInterval: binWidth,\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"x_minor\\\"\\n        position={boolean('Top X axis', false) ? Position.Top : Position.Bottom}\\n        showOverlappingTicks={boolean('showOverlappingTicks time axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels time axis', false)}\\n        gridLine={{\\n          visible: minorGridLines,\\n        }}\\n        style={{\\n          axisLine: { stroke: dataInk },\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            ...tickLabelStyle,\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n\\n          axisTitle: { fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\\n        }}\\n        tickFormat={tooltipDateFormatter}\\n        labelFormat={topAxisLabelFormat}\\n        title=\\\"time (1-minute measurements)\\\"\\n        timeAxisLayerCount={number('layerCount', 3, { range: true, min: 0, max: 3, step: 1 })}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={yAxisTitle}\\n        position={Position.Left}\\n        gridLine={horizontalGridLineStyle}\\n        ticks={4}\\n        style={{\\n          tickLine: { ...horizontalGridLineStyle, size: 8, padding: 4 },\\n          axisLine: { visible: false },\\n          tickLabel: tickLabelStyle,\\n          axisTitle: { visible: !horizontalAxisTitle, fontFamily, fill: axisTitleColor, fontSize: axisTitleFontSize },\\n        }}\\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n      />\\n      <AreaSeries\\n        id=\\\"CPU Utilization\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        yNice\\n        color={dataInk}\\n        areaSeriesStyle={{ area: { opacity: 0.3 }, line: { opacity: 1 } }}\\n        data={data\\n          .slice(0, timeZoom)\\n          .map(([t, v]) => [t0 + (t - t0) * 4 * 2 ** timeStretch - (t1 - t0) * 2 ** timeStretch * timeShift, v])}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Placement,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { isDefined } from '@elastic/charts/src/utils/common';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\\n    <Tooltip\\n      stickTo={customKnobs.enum.stickTo('stickTo')}\\n      placement={customKnobs.enum.placement('placement', undefined)}\\n      fallbackPlacements={[customKnobs.enum.placement('fallback placement', Placement.LeftStart)].filter(isDefined)}\\n      offset={number('placement offset', 5)}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"area1\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":63},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":63}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Placement,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  Tooltip,\n} from '@elastic/charts';\nimport { isDefined } from '@elastic/charts/src/utils/common';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\n    <Tooltip\n      stickTo={customKnobs.enum.stickTo('stickTo')}\n      placement={customKnobs.enum.placement('placement', undefined)}\n      fallbackPlacements={[customKnobs.enum.placement('fallback placement', Placement.LeftStart)].filter(isDefined)}\n      offset={number('placement offset', 5)}\n    />\n    <Axis\n      id=\"bottom\"\n      title=\"timestamp per 1 minute\"\n      position={Position.Bottom}\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n    <AreaSeries\n      id=\"area1\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\\n    <Tooltip\\n      stickTo={customKnobs.enum.stickTo('stickTo')}\\n      placement={customKnobs.enum.placement('placement', undefined)}\\n      fallbackPlacements={[customKnobs.enum.placement('fallback placement', Placement.LeftStart)].filter(isDefined)}\\n      offset={number('placement offset', 5)}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"area1\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { clamp } from '@elastic/charts/src/utils/common';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data\\n    .slice(0, 21)\\n    .map((d) => [(d[0] - start) / 30000, clamp(d[1], 0, 30)]);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} ticks={3} tickFormat={(d) => `${d} sec`} />\\n      <Axis\\n        id=\\\"left\\\"\\n        position={Position.Left}\\n        labelFormat={(d) => `${d.toFixed(0)}%`}\\n        tickFormat={(d) => `${d.toFixed(1)}%`}\\n        ticks={5}\\n      />\\n\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        yNice\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\nimport { clamp } from '@elastic/charts/src/utils/common';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data\n    .slice(0, 21)\n    .map((d) => [(d[0] - start) / 30000, clamp(d[1], 0, 30)]);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} ticks={3} tickFormat={(d) => `${d} sec`} />\n      <Axis\n        id=\"left\"\n        position={Position.Left}\n        labelFormat={(d) => `${d.toFixed(0)}%`}\n        tickFormat={(d) => `${d.toFixed(1)}%`}\n        ticks={5}\n      />\n\n      <AreaSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        yNice\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data\\n    .slice(0, 21)\\n    .map((d) => [(d[0] - start) / 30000, clamp(d[1], 0, 30)]);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} ticks={3} tickFormat={(d) => `${d} sec`} />\\n      <Axis\\n        id=\\\"left\\\"\\n        position={Position.Left}\\n        labelFormat={(d) => `${d.toFixed(0)}%`}\\n        tickFormat={(d) => `${d.toFixed(1)}%`}\\n        ticks={5}\\n      />\\n\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        yNice\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => (d[1] < 7 ? [d[0], null] : [d[0], d[1] - 10]));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Log}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":43},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":43}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => (d[1] < 7 ? [d[0], null] : [d[0], d[1] - 10]));\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Log}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => (d[1] < 7 ? [d[0], null] : [d[0], d[1] - 10]));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Log}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debug={false} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <Axis id=\\\"top\\\" position={Position.Top} showOverlappingTicks tickFormat={timeFormatter('HH:mm:ss')} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Right}\\n      tickFormat={(d) => `${Number(d).toFixed(0)} %`}\\n    />\\n\\n    <AreaSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings debug={false} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      title=\"timestamp per 1 minute\"\n      position={Position.Bottom}\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n    <Axis id=\"top\" position={Position.Top} showOverlappingTicks tickFormat={timeFormatter('HH:mm:ss')} />\n    <Axis\n      id=\"right\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Right}\n      tickFormat={(d) => `${Number(d).toFixed(0)} %`}\n    />\n\n    <AreaSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debug={false} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <Axis id=\\\"top\\\" position={Position.Top} showOverlappingTicks tickFormat={timeFormatter('HH:mm:ss')} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Right}\\n      tickFormat={(d) => `${Number(d).toFixed(0)} %`}\\n    />\\n\\n    <AreaSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n\\n    <AreaSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      title=\"timestamp per 1 minute\"\n      position={Position.Bottom}\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n\n    <AreaSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      title=\\\"timestamp per 1 minute\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n\\n    <AreaSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\\n  ]);\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\\n  ]);\\n  const data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\\n  ]);\\n  const allMetrics = [...data3, ...data2, ...data1];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"timestamp per 1 minute\\\"\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        splitSeriesAccessors={[2]}\\n        data={allMetrics}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":61},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":61}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\n    ...d,\n    KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\n  ]);\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\n    ...d,\n    KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\n  ]);\n  const data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\n    ...d,\n    KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\n  ]);\n  const allMetrics = [...data3, ...data2, ...data1];\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"timestamp per 1 minute\"\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        splitSeriesAccessors={[2]}\n        data={allMetrics}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\\n  ]);\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\\n  ]);\\n  const data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\\n    ...d,\\n    KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\\n  ]);\\n  const allMetrics = [...data3, ...data2, ...data1];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"timestamp per 1 minute\\\"\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        splitSeriesAccessors={[2]}\\n        data={allMetrics}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, niceTimeFormatter, Position, ScaleType, Settings, StackMode } from '@elastic/charts';\\nimport DATA from '@elastic/charts/src/utils/data_samples/4_time_series.json';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dataNames = Object.keys(DATA);\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const stackedAsPercentage = boolean('stacked as percentage', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Time\\\"\\n        tickFormat={niceTimeFormatter([1583100000000, 1583622000000])}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => (stackedAsPercentage ? `${Number(d * 100).toFixed(0)} %` : d.toFixed(0))}\\n      />\\n      {Object.values(DATA).map((d, i) => {\\n        return (\\n          <AreaSeries\\n            key={dataNames[i]}\\n            id={dataNames[i]}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"key\\\"\\n            yAccessors={[\\n              (datum) => {\\n                return datum['ffbd09b8-04af-4fcc-ba5f-b0fd50c4862b'].value;\\n              },\\n            ]}\\n            stackMode={stackedAsPercentage ? StackMode.Percentage : undefined}\\n            stackAccessors={['key']}\\n            data={d.buckets}\\n          />\\n        );\\n      })}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, niceTimeFormatter, Position, ScaleType, Settings, StackMode } from '@elastic/charts';\nimport DATA from '@elastic/charts/src/utils/data_samples/4_time_series.json';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dataNames = Object.keys(DATA);\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const stackedAsPercentage = boolean('stacked as percentage', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Time\"\n        tickFormat={niceTimeFormatter([1583100000000, 1583622000000])}\n      />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d) => (stackedAsPercentage ? `${Number(d * 100).toFixed(0)} %` : d.toFixed(0))}\n      />\n      {Object.values(DATA).map((d, i) => {\n        return (\n          <AreaSeries\n            key={dataNames[i]}\n            id={dataNames[i]}\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor=\"key\"\n            yAccessors={[\n              (datum) => {\n                return datum['ffbd09b8-04af-4fcc-ba5f-b0fd50c4862b'].value;\n              },\n            ]}\n            stackMode={stackedAsPercentage ? StackMode.Percentage : undefined}\n            stackAccessors={['key']}\n            data={d.buckets}\n          />\n        );\n      })}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const stackedAsPercentage = boolean('stacked as percentage', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Time\\\"\\n        tickFormat={niceTimeFormatter([1583100000000, 1583622000000])}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => (stackedAsPercentage ? `${Number(d * 100).toFixed(0)} %` : d.toFixed(0))}\\n      />\\n      {Object.values(DATA).map((d, i) => {\\n        return (\\n          <AreaSeries\\n            key={dataNames[i]}\\n            id={dataNames[i]}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"key\\\"\\n            yAccessors={[\\n              (datum) => {\\n                return datum['ffbd09b8-04af-4fcc-ba5f-b0fd50c4862b'].value;\\n              },\\n            ]}\\n            stackMode={stackedAsPercentage ? StackMode.Percentage : undefined}\\n            stackAccessors={['key']}\\n            data={d.buckets}\\n          />\\n        );\\n      })}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, niceTimeFormatter, StackMode } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"Bottom axis\\\"\\n      tickFormat={niceTimeFormatter([1585234800000, 1585836000000])}\\n    />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => `${Number(d * 100).toFixed(0)} %`} />\\n\\n    <AreaSeries\\n      id=\\\"areas1\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[0].data}\\n      stackAccessors={[0]}\\n      stackMode={StackMode.Percentage}\\n    />\\n    <AreaSeries\\n      id=\\\"areas2\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[1].data}\\n      stackAccessors={[0]}\\n      stackMode={StackMode.Percentage}\\n    />\\n    <AreaSeries\\n      id=\\\"areas3\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[2].data}\\n      stackMode={StackMode.Percentage}\\n      stackAccessors={[0]}\\n    />\\n  </Chart>\\n);\\nconst DATA = [\\n  {\\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:200',\\n    label: '200',\\n    color: 'rgb(115, 216, 255)',\\n    data: [\\n      [1585234800000, 10],\\n      [1585249200000, 6],\\n      [1585263600000, 2],\\n      [1585278000000, 5],\\n      [1585292400000, 70],\\n      [1585306800000, 84],\\n      [1585321200000, 32],\\n      [1585335600000, 3],\\n      [1585350000000, 2],\\n      [1585364400000, 18],\\n      [1585378800000, 66],\\n      [1585393200000, 82],\\n      [1585407600000, 32],\\n      [1585422000000, 4],\\n      [1585436400000, 1],\\n      [1585447200000, 9],\\n      [1585461600000, 58],\\n      [1585476000000, 70],\\n      [1585490400000, 58],\\n      [1585504800000, 9],\\n      [1585519200000, 0],\\n      [1585533600000, 10],\\n      [1585548000000, 46],\\n      [1585562400000, 95],\\n      [1585576800000, 43],\\n      [1585591200000, 10],\\n      [1585605600000, 1],\\n      [1585620000000, 8],\\n      [1585634400000, 56],\\n      [1585648800000, 88],\\n      [1585663200000, 50],\\n      [1585677600000, 7],\\n      [1585692000000, 1],\\n      [1585706400000, 9],\\n      [1585720800000, 59],\\n      [1585735200000, 83],\\n      [1585749600000, 46],\\n      [1585764000000, 7],\\n      [1585778400000, null],\\n      [1585792800000, 12],\\n      [1585807200000, 44],\\n      [1585821600000, 84],\\n      [1585836000000, 41],\\n    ],\\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\\n    stack: 'percent',\\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\\n    points: { show: false, radius: 1, lineWidth: 5 },\\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\\n  },\\n  {\\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:404',\\n    label: '404',\\n    color: 'rgb(0, 157, 217)',\\n    data: [\\n      [1585234800000, 0],\\n      [1585249200000, 0],\\n      [1585263600000, 0],\\n      [1585278000000, 1],\\n      [1585292400000, 6],\\n      [1585306800000, 8],\\n      [1585321200000, 3],\\n      [1585335600000, 0],\\n      [1585350000000, 1],\\n      [1585364400000, 1],\\n      [1585378800000, 2],\\n      [1585393200000, 3],\\n      [1585407600000, 1],\\n      [1585422000000, 0],\\n      [1585436400000, 0],\\n      [1585447200000, 1],\\n      [1585461600000, 0],\\n      [1585476000000, 6],\\n      [1585490400000, 3],\\n      [1585504800000, 0],\\n      [1585519200000, 0],\\n      [1585533600000, 1],\\n      [1585548000000, 4],\\n      [1585562400000, 6],\\n      [1585576800000, 1],\\n      [1585591200000, 0],\\n      [1585605600000, 1],\\n      [1585620000000, 0],\\n      [1585634400000, 1],\\n      [1585648800000, 6],\\n      [1585663200000, 4],\\n      [1585677600000, 0],\\n      [1585692000000, 0],\\n      [1585706400000, 0],\\n      [1585720800000, 1],\\n      [1585735200000, 8],\\n      [1585749600000, 2],\\n      [1585764000000, 0],\\n      [1585778400000, null],\\n      [1585792800000, 0],\\n      [1585807200000, 1],\\n      [1585821600000, 6],\\n      [1585836000000, 3],\\n    ],\\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\\n    stack: 'percent',\\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\\n    points: { show: false, radius: 1, lineWidth: 5 },\\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\\n  },\\n  {\\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:503',\\n    label: '503',\\n    color: 'rgb(0, 46, 64)',\\n    data: [\\n      [1585234800000, 0],\\n      [1585249200000, 0],\\n      [1585263600000, 0],\\n      [1585278000000, 1],\\n      [1585292400000, 2],\\n      [1585306800000, 3],\\n      [1585321200000, 3],\\n      [1585335600000, 0],\\n      [1585350000000, 0],\\n      [1585364400000, 0],\\n      [1585378800000, 2],\\n      [1585393200000, 2],\\n      [1585407600000, 2],\\n      [1585422000000, 0],\\n      [1585436400000, 0],\\n      [1585447200000, 0],\\n      [1585461600000, 1],\\n      [1585476000000, 3],\\n      [1585490400000, 2],\\n      [1585504800000, 0],\\n      [1585519200000, 0],\\n      [1585533600000, 0],\\n      [1585548000000, 2],\\n      [1585562400000, 1],\\n      [1585576800000, 3],\\n      [1585591200000, 0],\\n      [1585605600000, 0],\\n      [1585620000000, 0],\\n      [1585634400000, 1],\\n      [1585648800000, 1],\\n      [1585663200000, 1],\\n      [1585677600000, 0],\\n      [1585692000000, 0],\\n      [1585706400000, 0],\\n      [1585720800000, 1],\\n      [1585735200000, 3],\\n      [1585749600000, 1],\\n      [1585764000000, 1],\\n      [1585778400000, null],\\n      [1585792800000, 0],\\n      [1585807200000, 2],\\n      [1585821600000, 1],\\n      [1585836000000, 3],\\n    ],\\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\\n    stack: 'percent',\\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\\n    points: { show: false, radius: 1, lineWidth: 5 },\\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\\n  },\\n];\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":61},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":61}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, niceTimeFormatter, StackMode } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"Bottom axis\"\n      tickFormat={niceTimeFormatter([1585234800000, 1585836000000])}\n    />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => `${Number(d * 100).toFixed(0)} %`} />\n\n    <AreaSeries\n      id=\"areas1\"\n      name=\"area\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={DATA[0].data}\n      stackAccessors={[0]}\n      stackMode={StackMode.Percentage}\n    />\n    <AreaSeries\n      id=\"areas2\"\n      name=\"area\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={DATA[1].data}\n      stackAccessors={[0]}\n      stackMode={StackMode.Percentage}\n    />\n    <AreaSeries\n      id=\"areas3\"\n      name=\"area\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={DATA[2].data}\n      stackMode={StackMode.Percentage}\n      stackAccessors={[0]}\n    />\n  </Chart>\n);\nconst DATA = [\n  {\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:200',\n    label: '200',\n    color: 'rgb(115, 216, 255)',\n    data: [\n      [1585234800000, 10],\n      [1585249200000, 6],\n      [1585263600000, 2],\n      [1585278000000, 5],\n      [1585292400000, 70],\n      [1585306800000, 84],\n      [1585321200000, 32],\n      [1585335600000, 3],\n      [1585350000000, 2],\n      [1585364400000, 18],\n      [1585378800000, 66],\n      [1585393200000, 82],\n      [1585407600000, 32],\n      [1585422000000, 4],\n      [1585436400000, 1],\n      [1585447200000, 9],\n      [1585461600000, 58],\n      [1585476000000, 70],\n      [1585490400000, 58],\n      [1585504800000, 9],\n      [1585519200000, 0],\n      [1585533600000, 10],\n      [1585548000000, 46],\n      [1585562400000, 95],\n      [1585576800000, 43],\n      [1585591200000, 10],\n      [1585605600000, 1],\n      [1585620000000, 8],\n      [1585634400000, 56],\n      [1585648800000, 88],\n      [1585663200000, 50],\n      [1585677600000, 7],\n      [1585692000000, 1],\n      [1585706400000, 9],\n      [1585720800000, 59],\n      [1585735200000, 83],\n      [1585749600000, 46],\n      [1585764000000, 7],\n      [1585778400000, null],\n      [1585792800000, 12],\n      [1585807200000, 44],\n      [1585821600000, 84],\n      [1585836000000, 41],\n    ],\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\n    stack: 'percent',\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\n    points: { show: false, radius: 1, lineWidth: 5 },\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\n  },\n  {\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:404',\n    label: '404',\n    color: 'rgb(0, 157, 217)',\n    data: [\n      [1585234800000, 0],\n      [1585249200000, 0],\n      [1585263600000, 0],\n      [1585278000000, 1],\n      [1585292400000, 6],\n      [1585306800000, 8],\n      [1585321200000, 3],\n      [1585335600000, 0],\n      [1585350000000, 1],\n      [1585364400000, 1],\n      [1585378800000, 2],\n      [1585393200000, 3],\n      [1585407600000, 1],\n      [1585422000000, 0],\n      [1585436400000, 0],\n      [1585447200000, 1],\n      [1585461600000, 0],\n      [1585476000000, 6],\n      [1585490400000, 3],\n      [1585504800000, 0],\n      [1585519200000, 0],\n      [1585533600000, 1],\n      [1585548000000, 4],\n      [1585562400000, 6],\n      [1585576800000, 1],\n      [1585591200000, 0],\n      [1585605600000, 1],\n      [1585620000000, 0],\n      [1585634400000, 1],\n      [1585648800000, 6],\n      [1585663200000, 4],\n      [1585677600000, 0],\n      [1585692000000, 0],\n      [1585706400000, 0],\n      [1585720800000, 1],\n      [1585735200000, 8],\n      [1585749600000, 2],\n      [1585764000000, 0],\n      [1585778400000, null],\n      [1585792800000, 0],\n      [1585807200000, 1],\n      [1585821600000, 6],\n      [1585836000000, 3],\n    ],\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\n    stack: 'percent',\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\n    points: { show: false, radius: 1, lineWidth: 5 },\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\n  },\n  {\n    id: '61ca57f1-469d-11e7-af02-69e470af7417:503',\n    label: '503',\n    color: 'rgb(0, 46, 64)',\n    data: [\n      [1585234800000, 0],\n      [1585249200000, 0],\n      [1585263600000, 0],\n      [1585278000000, 1],\n      [1585292400000, 2],\n      [1585306800000, 3],\n      [1585321200000, 3],\n      [1585335600000, 0],\n      [1585350000000, 0],\n      [1585364400000, 0],\n      [1585378800000, 2],\n      [1585393200000, 2],\n      [1585407600000, 2],\n      [1585422000000, 0],\n      [1585436400000, 0],\n      [1585447200000, 0],\n      [1585461600000, 1],\n      [1585476000000, 3],\n      [1585490400000, 2],\n      [1585504800000, 0],\n      [1585519200000, 0],\n      [1585533600000, 0],\n      [1585548000000, 2],\n      [1585562400000, 1],\n      [1585576800000, 3],\n      [1585591200000, 0],\n      [1585605600000, 0],\n      [1585620000000, 0],\n      [1585634400000, 1],\n      [1585648800000, 1],\n      [1585663200000, 1],\n      [1585677600000, 0],\n      [1585692000000, 0],\n      [1585706400000, 0],\n      [1585720800000, 1],\n      [1585735200000, 3],\n      [1585749600000, 1],\n      [1585764000000, 1],\n      [1585778400000, null],\n      [1585792800000, 0],\n      [1585807200000, 2],\n      [1585821600000, 1],\n      [1585836000000, 3],\n    ],\n    seriesId: '61ca57f1-469d-11e7-af02-69e470af7417',\n    stack: 'percent',\n    lines: { show: true, fill: 0.5, lineWidth: 2, steps: false },\n    points: { show: false, radius: 1, lineWidth: 5 },\n    bars: { show: false, fill: 0.5, lineWidth: 2 },\n  },\n];\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"Bottom axis\\\"\\n      tickFormat={niceTimeFormatter([1585234800000, 1585836000000])}\\n    />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => `${Number(d * 100).toFixed(0)} %`} />\\n\\n    <AreaSeries\\n      id=\\\"areas1\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[0].data}\\n      stackAccessors={[0]}\\n      stackMode={StackMode.Percentage}\\n    />\\n    <AreaSeries\\n      id=\\\"areas2\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[1].data}\\n      stackAccessors={[0]}\\n      stackMode={StackMode.Percentage}\\n    />\\n    <AreaSeries\\n      id=\\\"areas3\\\"\\n      name=\\\"area\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={DATA[2].data}\\n      stackMode={StackMode.Percentage}\\n      stackAccessors={[0]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"timestamp per 1 minute\\\"\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"1\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n    />\\n    <AreaSeries\\n      id=\\\"2\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n    />\\n    <AreaSeries\\n      id=\\\"3\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"timestamp per 1 minute\"\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n    />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n    <AreaSeries\n      id=\"1\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n    />\n    <AreaSeries\n      id=\"2\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n    />\n    <AreaSeries\n      id=\"3\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"timestamp per 1 minute\\\"\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <AreaSeries\\n      id=\\\"1\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n    />\\n    <AreaSeries\\n      id=\\\"2\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n    />\\n    <AreaSeries\\n      id=\\\"3\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Area Chart',\n};\n\nexport { Example as timeslip } from './21_with_time_timeslip.story';\nexport { Example as basic } from './1_basic.story';\nexport { Example as withTimeXAxis } from './2_with_time.story';\nexport { Example as withLinearXAxis } from './3_with_linear.story';\nexport { Example as withLogYAxis } from './4_with_log.story';\nexport { Example as with4Axes } from './5_with_4_axes.story';\nexport { Example as withAxisAndLegend } from './6_with_axis_and_legend.story';\nexport { Example as stacked } from './7_stacked.story';\nexport { Example as stackedPercentage } from './8_stacked_percentage.story';\nexport { Example as stackedPercentageWithZeros } from './8_stacked_percentage_zeros.story';\nexport { Example as stackedSeparateSpecs } from './9_stacked_separate_specs.story';\nexport { Example as stackedSameNaming } from './10_stacked_same_naming.story';\nexport { Example as bandArea } from './13_band_area.story';\nexport { Example as stackedGrouped } from './15_stacked_grouped.story';\nexport { Example as withNegativeValues } from './17_negative.story';\nexport { Example as withNegativeAndPositive } from './18_negative_positive.story';\nexport { Example as withNegativeBand } from './19_negative_band.story';\nexport { Example as steppedArea } from './20_stepped_area.story';\n\nexport { Example as testLinear } from './11_test_linear.story';\nexport { Example as testTime } from './12_test_time.story';\nexport { Example as testStackedWithMissingValues } from './16_test_stacked_with_missing.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const leftDomain = {\\n    min: number('left min', 0),\\n    max: NaN,\\n  };\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: number('xDomain max', 3),\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={leftDomain}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const leftDomain = {\n    min: number('left min', 0),\n    max: NaN,\n  };\n\n  const xDomain = {\n    min: NaN,\n    max: number('xDomain max', 3),\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis\n        id=\"left\"\n        title=\"Bar axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={leftDomain}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const leftDomain = {\\n    min: number('left min', 0),\\n    max: NaN,\\n  };\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: number('xDomain max', 3),\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={leftDomain}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { array, boolean, number, object, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  DomainPaddingUnit,\\n  LineAnnotation,\\n  Position,\\n  RectAnnotation,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dg = new SeededDataGenerator();\\nconst base = dg.generateBasicSeries(100, 0, 50);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line', { exclude: ['bubble'] });\\n  const positive = base.map(({ x, y }) => ({ x, y: y + 1000 }));\\n  const both = base.map(({ x, y }) => ({ x, y: y - 100 }));\\n  const negative = base.map(({ x, y }) => ({ x, y: y - 1000 }));\\n\\n  const dataTypes = {\\n    positive,\\n    both,\\n    negative,\\n  };\\n  const dataKey = select<'positive' | 'negative' | 'both'>(\\n    'dataset',\\n    {\\n      'Positive values only': 'positive',\\n      'Positive and negative': 'both',\\n      'Negtive values only': 'negative',\\n    },\\n    'both',\\n  );\\n\\n  const dataset = dataTypes[dataKey];\\n  const fit = boolean('fit Y domain to data', true);\\n  const includeDataFromIds = customKnobs.multiSelect<string>(\\n    'Specs to fit (yDomain)',\\n    {\\n      Lines: 'theshold',\\n      Rects: 'rect',\\n    },\\n    ['theshold', 'rect'],\\n    'check',\\n  );\\n  const enableHistogramMode = boolean('enableHistogramMode', true);\\n  const stacked = boolean('stacked', true);\\n  const constrainPadding = boolean('constrain padding', true);\\n  const padding = number('domain padding', 0.1);\\n  const seriesCount = number('number of series', 1, { min: 1, max: 3, range: true });\\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.DomainRatio);\\n  const thesholds = array('thesholds - line', ['200']).filter(Boolean).map(Number);\\n  const rectTheshold = object('theshold - rect', { y0: 100, y1: null });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n          includeDataFromIds,\\n          padding,\\n          paddingUnit,\\n          constrainPadding,\\n        }}\\n        id=\\\"left\\\"\\n        title=\\\"Value\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <LineAnnotation\\n        id=\\\"theshold\\\"\\n        dataValues={thesholds.map((dataValue) => ({ dataValue }))}\\n        domainType=\\\"yDomain\\\"\\n        style={{\\n          line: {\\n            stroke: '#e73c45',\\n            strokeWidth: 2,\\n            opacity: 1,\\n            dash: [4, 4],\\n          },\\n        }}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect\\\"\\n        dataValues={[{ coordinates: rectTheshold }]}\\n        style={{\\n          fill: '#f137407b',\\n        }}\\n      />\\n      {Array.from({ length: seriesCount }, (_, i) => (\\n        <SeriesType\\n          id={`series-${i}`}\\n          key={`series-${i}`}\\n          enableHistogramMode={enableHistogramMode}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          stackAccessors={stacked ? ['true'] : []}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={dataset}\\n        />\\n      ))}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":126},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":126}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { array, boolean, number, object, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  DomainPaddingUnit,\n  LineAnnotation,\n  Position,\n  RectAnnotation,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dg = new SeededDataGenerator();\nconst base = dg.generateBasicSeries(100, 0, 50);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line', { exclude: ['bubble'] });\n  const positive = base.map(({ x, y }) => ({ x, y: y + 1000 }));\n  const both = base.map(({ x, y }) => ({ x, y: y - 100 }));\n  const negative = base.map(({ x, y }) => ({ x, y: y - 1000 }));\n\n  const dataTypes = {\n    positive,\n    both,\n    negative,\n  };\n  const dataKey = select<'positive' | 'negative' | 'both'>(\n    'dataset',\n    {\n      'Positive values only': 'positive',\n      'Positive and negative': 'both',\n      'Negtive values only': 'negative',\n    },\n    'both',\n  );\n\n  const dataset = dataTypes[dataKey];\n  const fit = boolean('fit Y domain to data', true);\n  const includeDataFromIds = customKnobs.multiSelect<string>(\n    'Specs to fit (yDomain)',\n    {\n      Lines: 'theshold',\n      Rects: 'rect',\n    },\n    ['theshold', 'rect'],\n    'check',\n  );\n  const enableHistogramMode = boolean('enableHistogramMode', true);\n  const stacked = boolean('stacked', true);\n  const constrainPadding = boolean('constrain padding', true);\n  const padding = number('domain padding', 0.1);\n  const seriesCount = number('number of series', 1, { min: 1, max: 3, range: true });\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.DomainRatio);\n  const thesholds = array('thesholds - line', ['200']).filter(Boolean).map(Number);\n  const rectTheshold = object('theshold - rect', { y0: 100, y1: null });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n          includeDataFromIds,\n          padding,\n          paddingUnit,\n          constrainPadding,\n        }}\n        id=\"left\"\n        title=\"Value\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <LineAnnotation\n        id=\"theshold\"\n        dataValues={thesholds.map((dataValue) => ({ dataValue }))}\n        domainType=\"yDomain\"\n        style={{\n          line: {\n            stroke: '#e73c45',\n            strokeWidth: 2,\n            opacity: 1,\n            dash: [4, 4],\n          },\n        }}\n      />\n      <RectAnnotation\n        id=\"rect\"\n        dataValues={[{ coordinates: rectTheshold }]}\n        style={{\n          fill: '#f137407b',\n        }}\n      />\n      {Array.from({ length: seriesCount }, (_, i) => (\n        <SeriesType\n          id={`series-${i}`}\n          key={`series-${i}`}\n          enableHistogramMode={enableHistogramMode}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          stackAccessors={stacked ? ['true'] : []}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={dataset}\n        />\n      ))}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const [SeriesType] = customKnobs.enum.xySeries(undefined, 'line', { exclude: ['bubble'] });\\n  const positive = base.map(({ x, y }) => ({ x, y: y + 1000 }));\\n  const both = base.map(({ x, y }) => ({ x, y: y - 100 }));\\n  const negative = base.map(({ x, y }) => ({ x, y: y - 1000 }));\\n\\n  const dataTypes = {\\n    positive,\\n    both,\\n    negative,\\n  };\\n  const dataKey = select<'positive' | 'negative' | 'both'>(\\n    'dataset',\\n    {\\n      'Positive values only': 'positive',\\n      'Positive and negative': 'both',\\n      'Negtive values only': 'negative',\\n    },\\n    'both',\\n  );\\n\\n  const dataset = dataTypes[dataKey];\\n  const fit = boolean('fit Y domain to data', true);\\n  const includeDataFromIds = customKnobs.multiSelect<string>(\\n    'Specs to fit (yDomain)',\\n    {\\n      Lines: 'theshold',\\n      Rects: 'rect',\\n    },\\n    ['theshold', 'rect'],\\n    'check',\\n  );\\n  const enableHistogramMode = boolean('enableHistogramMode', true);\\n  const stacked = boolean('stacked', true);\\n  const constrainPadding = boolean('constrain padding', true);\\n  const padding = number('domain padding', 0.1);\\n  const seriesCount = number('number of series', 1, { min: 1, max: 3, range: true });\\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.DomainRatio);\\n  const thesholds = array('thesholds - line', ['200']).filter(Boolean).map(Number);\\n  const rectTheshold = object('theshold - rect', { y0: 100, y1: null });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n          includeDataFromIds,\\n          padding,\\n          paddingUnit,\\n          constrainPadding,\\n        }}\\n        id=\\\"left\\\"\\n        title=\\\"Value\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <LineAnnotation\\n        id=\\\"theshold\\\"\\n        dataValues={thesholds.map((dataValue) => ({ dataValue }))}\\n        domainType=\\\"yDomain\\\"\\n        style={{\\n          line: {\\n            stroke: '#e73c45',\\n            strokeWidth: 2,\\n            opacity: 1,\\n            dash: [4, 4],\\n          },\\n        }}\\n      />\\n      <RectAnnotation\\n        id=\\\"rect\\\"\\n        dataValues={[{ coordinates: rectTheshold }]}\\n        style={{\\n          fill: '#f137407b',\\n        }}\\n      />\\n      {Array.from({ length: seriesCount }, (_, i) => (\\n        <SeriesType\\n          id={`series-${i}`}\\n          key={`series-${i}`}\\n          enableHistogramMode={enableHistogramMode}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          stackAccessors={stacked ? ['true'] : []}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={dataset}\\n        />\\n      ))}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport moment from 'moment-timezone';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  niceTimeFormatter,\\n  TickFormatter,\\n  Settings,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const threeDays = moment.duration(3, 'd');\\n  const fourDays = moment.duration(4, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatters: Record<string, TickFormatter> = {\\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\\n    hourly: (d) => moment(d).format('HH:mm'),\\n  };\\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\\n  const formatter = formatters[formatterSelect];\\n\\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: now, y: 2 },\\n          { x: oneDay.add(now).asMilliseconds(), y: 3 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\\n          { x: threeDays.add(now).asMilliseconds(), y: 4 },\\n          { x: fourDays.add(now).asMilliseconds(), y: 8 },\\n          { x: fiveDays.add(now).asMilliseconds(), y: 6 },\\n        ]}\\n        timeZone=\\\"local\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":72},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":72}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport moment from 'moment-timezone';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  niceTimeFormatter,\n  TickFormatter,\n  Settings,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\n  const oneDay = moment.duration(1, 'd');\n  const twoDays = moment.duration(2, 'd');\n  const threeDays = moment.duration(3, 'd');\n  const fourDays = moment.duration(4, 'd');\n  const fiveDays = moment.duration(5, 'd');\n  const formatters: Record<string, TickFormatter> = {\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\n    hourly: (d) => moment(d).format('HH:mm'),\n  };\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\n  const formatter = formatters[formatterSelect];\n\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: now, y: 2 },\n          { x: oneDay.add(now).asMilliseconds(), y: 3 },\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\n          { x: threeDays.add(now).asMilliseconds(), y: 4 },\n          { x: fourDays.add(now).asMilliseconds(), y: 8 },\n          { x: fiveDays.add(now).asMilliseconds(), y: 6 },\n        ]}\n        timeZone=\"local\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const threeDays = moment.duration(3, 'd');\\n  const fourDays = moment.duration(4, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatters: Record<string, TickFormatter> = {\\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\\n    hourly: (d) => moment(d).format('HH:mm'),\\n  };\\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\\n  const formatter = formatters[formatterSelect];\\n\\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: now, y: 2 },\\n          { x: oneDay.add(now).asMilliseconds(), y: 3 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\\n          { x: threeDays.add(now).asMilliseconds(), y: 4 },\\n          { x: fourDays.add(now).asMilliseconds(), y: 8 },\\n          { x: fiveDays.add(now).asMilliseconds(), y: 6 },\\n        ]}\\n        timeZone=\\\"local\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const tickFormatBottom = text('tickFormat bottom', '0.0000');\\n  const labelFormatBottom = text('labelFormat bottom', '0.0');\\n  const tickFormatLeft = text('tickFormat left', '$ 0,0[.]00');\\n  const labelFormatLeft = text('labelFormat left', '$ 0,0');\\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20).map((d) => [(d[0] - start) / 30000, d[1]]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"Weight\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={(d) => numeral(d).format(tickFormatBottom)}\\n        labelFormat={(d) => numeral(d).format(labelFormatBottom)}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Price\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => numeral(d).format(tickFormatLeft)}\\n        labelFormat={(d) => numeral(d).format(labelFormatLeft)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `You can apply different formatter between tick values in the tooltip and legend by using\\n      different values for \\\\`tickFormat\\\\` and \\\\`labelFormat\\\\`.\\n\\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const tickFormatBottom = text('tickFormat bottom', '0.0000');\n  const labelFormatBottom = text('labelFormat bottom', '0.0');\n  const tickFormatLeft = text('tickFormat left', '$ 0,0[.]00');\n  const labelFormatLeft = text('labelFormat left', '$ 0,0');\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20).map((d) => [(d[0] - start) / 30000, d[1]]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"Weight\"\n        position={Position.Bottom}\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\n        tickFormat={(d) => numeral(d).format(tickFormatBottom)}\n        labelFormat={(d) => numeral(d).format(labelFormatBottom)}\n      />\n      <Axis\n        id=\"left\"\n        title=\"Price\"\n        position={Position.Left}\n        tickFormat={(d) => numeral(d).format(tickFormatLeft)}\n        labelFormat={(d) => numeral(d).format(labelFormatLeft)}\n      />\n\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can apply different formatter between tick values in the tooltip and legend by using\n      different values for \\`tickFormat\\` and \\`labelFormat\\`.\n\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const tickFormatBottom = text('tickFormat bottom', '0.0000');\\n  const labelFormatBottom = text('labelFormat bottom', '0.0');\\n  const tickFormatLeft = text('tickFormat left', '$ 0,0[.]00');\\n  const labelFormatLeft = text('labelFormat left', '$ 0,0');\\n  const start = KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0];\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20).map((d) => [(d[0] - start) / 30000, d[1]]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"Weight\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={(d) => numeral(d).format(tickFormatBottom)}\\n        labelFormat={(d) => numeral(d).format(labelFormatBottom)}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Price\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => numeral(d).format(tickFormatLeft)}\\n        labelFormat={(d) => numeral(d).format(labelFormatLeft)}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport moment from 'moment-timezone';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  niceTimeFormatter,\\n  TickFormatter,\\n  Settings,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const threeDays = moment.duration(3, 'd');\\n  const fourDays = moment.duration(4, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatters: Record<string, TickFormatter> = {\\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\\n    hourly: (d) => moment(d).format('HH:mm'),\\n  };\\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\\n  const formatter = formatters[formatterSelect];\\n\\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\\n        labelFormat={(d) => `${Number(d).toFixed(0)}`}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: now, y: 0.2 },\\n          { x: oneDay.add(now).asMilliseconds(), y: 0.5 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 0.2 },\\n          { x: threeDays.add(now).asMilliseconds(), y: 1.1 },\\n          { x: fourDays.add(now).asMilliseconds(), y: 0.8 },\\n          { x: fiveDays.add(now).asMilliseconds(), y: 1.2 },\\n        ]}\\n        timeZone=\\\"local\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport moment from 'moment-timezone';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  niceTimeFormatter,\n  TickFormatter,\n  Settings,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\n  const oneDay = moment.duration(1, 'd');\n  const twoDays = moment.duration(2, 'd');\n  const threeDays = moment.duration(3, 'd');\n  const fourDays = moment.duration(4, 'd');\n  const fiveDays = moment.duration(5, 'd');\n  const formatters: Record<string, TickFormatter> = {\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\n    hourly: (d) => moment(d).format('HH:mm'),\n  };\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\n  const formatter = formatters[formatterSelect];\n\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\n        labelFormat={(d) => `${Number(d).toFixed(0)}`}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: now, y: 0.2 },\n          { x: oneDay.add(now).asMilliseconds(), y: 0.5 },\n          { x: twoDays.add(now).asMilliseconds(), y: 0.2 },\n          { x: threeDays.add(now).asMilliseconds(), y: 1.1 },\n          { x: fourDays.add(now).asMilliseconds(), y: 0.8 },\n          { x: fiveDays.add(now).asMilliseconds(), y: 1.2 },\n        ]}\n        timeZone=\"local\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const threeDays = moment.duration(3, 'd');\\n  const fourDays = moment.duration(4, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatters: Record<string, TickFormatter> = {\\n    daily: niceTimeFormatter([now, moment.duration(31, 'd').add(now).asMilliseconds()]),\\n    hourly: (d) => moment(d).format('HH:mm'),\\n  };\\n  const formatterSelect = select<string>('formatter', ['daily', 'hourly'], 'daily');\\n  const formatter = formatters[formatterSelect];\\n\\n  const duplicateTicksInAxis = boolean('Show duplicate ticks in x axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} tickFormat={formatter} showDuplicatedTicks={duplicateTicksInAxis} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(1)}`}\\n        labelFormat={(d) => `${Number(d).toFixed(0)}`}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: now, y: 0.2 },\\n          { x: oneDay.add(now).asMilliseconds(), y: 0.5 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 0.2 },\\n          { x: threeDays.add(now).asMilliseconds(), y: 1.1 },\\n          { x: fourDays.add(now).asMilliseconds(), y: 0.8 },\\n          { x: fiveDays.add(now).asMilliseconds(), y: 1.2 },\\n        ]}\\n        timeZone=\\\"local\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nconst getData = (() => {\\n  const cache = new Map<string, Array<[string, number]>>();\\n  return (min: number, max: number, digits: number) => {\\n    const fractionDigits = Math.max(5, digits + 1);\\n    const key = `${min}:${max}:${fractionDigits}`;\\n    if (cache.has(key)) return cache.get(key)!;\\n    const data: Array<[string, number]> = [];\\n    for (let i = 1; i <= 5; i++) {\\n      data.push([`Sensor ${i}`, rng(min, max, fractionDigits)]);\\n    }\\n    cache.set(key, data);\\n    return data;\\n  };\\n})();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const maximumFractionDigits = number('maximumFractionDigits', 0, { step: 1 });\\n  const dataRange = customKnobs.numbersArray('Data range', [0, 10]);\\n  const [Series] = customKnobs.enum.xySeries('Series type', 'bar', { exclude: ['bubble'] });\\n  const scaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Log', 'Sqrt'] });\\n  const niceValues = boolean('yNice', false);\\n\\n  const min = Math.min(...dataRange);\\n  const max = Math.max(...dataRange);\\n  const data = getData(min, max, maximumFractionDigits);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} maximumFractionDigits={maximumFractionDigits} />\\n\\n      <Series\\n        id=\\\"Thermal changes\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={scaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        yNice={niceValues}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":36},\"endLoc\":{\"col\":1,\"line\":64},\"startBody\":{\"col\":36,\"line\":36},\"endBody\":{\"col\":1,\"line\":64}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst rng = getRandomNumberGenerator();\n\nconst getData = (() => {\n  const cache = new Map<string, Array<[string, number]>>();\n  return (min: number, max: number, digits: number) => {\n    const fractionDigits = Math.max(5, digits + 1);\n    const key = `${min}:${max}:${fractionDigits}`;\n    if (cache.has(key)) return cache.get(key)!;\n    const data: Array<[string, number]> = [];\n    for (let i = 1; i <= 5; i++) {\n      data.push([`Sensor ${i}`, rng(min, max, fractionDigits)]);\n    }\n    cache.set(key, data);\n    return data;\n  };\n})();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const maximumFractionDigits = number('maximumFractionDigits', 0, { step: 1 });\n  const dataRange = customKnobs.numbersArray('Data range', [0, 10]);\n  const [Series] = customKnobs.enum.xySeries('Series type', 'bar', { exclude: ['bubble'] });\n  const scaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Log', 'Sqrt'] });\n  const niceValues = boolean('yNice', false);\n\n  const min = Math.min(...dataRange);\n  const max = Math.max(...dataRange);\n  const data = getData(min, max, maximumFractionDigits);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" position={Position.Left} maximumFractionDigits={maximumFractionDigits} />\n\n      <Series\n        id=\"Thermal changes\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={scaleType}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        yNice={niceValues}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const maximumFractionDigits = number('maximumFractionDigits', 0, { step: 1 });\\n  const dataRange = customKnobs.numbersArray('Data range', [0, 10]);\\n  const [Series] = customKnobs.enum.xySeries('Series type', 'bar', { exclude: ['bubble'] });\\n  const scaleType = customKnobs.enum.scaleType('Scale type', ScaleType.Linear, { include: ['Linear', 'Log', 'Sqrt'] });\\n  const niceValues = boolean('yNice', false);\\n\\n  const min = Math.min(...dataRange);\\n  const max = Math.max(...dataRange);\\n  const data = getData(min, max, maximumFractionDigits);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} maximumFractionDigits={maximumFractionDigits} />\\n\\n      <Series\\n        id=\\\"Thermal changes\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={scaleType}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        yNice={niceValues}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  niceTimeFormatter,\\n  RecursivePartial,\\n  AxisStyle,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding', 0, {\\n        range: true,\\n        min: 2,\\n        max: 30,\\n        step: 1,\\n      }),\\n    },\\n  };\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 60);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        style={customStyle}\\n        showOverlappingLabels={boolean('Bottom overlap labels', false, 'Bottom Axis')}\\n        showOverlappingTicks={boolean('Bottom overlap ticks', true, 'Bottom Axis')}\\n        ticks={number(\\n          'Number of ticks on bottom',\\n          10,\\n          {\\n            range: true,\\n            min: 2,\\n            max: 20,\\n            step: 1,\\n          },\\n          'Bottom Axis',\\n        )}\\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        style={customStyle}\\n        showOverlappingLabels={boolean('Left overlap labels', false, 'Left Axis')}\\n        showOverlappingTicks={boolean('Left overlap ticks', true, 'Left Axis')}\\n        ticks={number(\\n          'Number of ticks on left',\\n          10,\\n          {\\n            range: true,\\n            min: 2,\\n            max: 20,\\n            step: 1,\\n          },\\n          'Left Axis',\\n        )}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  niceTimeFormatter,\n  RecursivePartial,\n  AxisStyle,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customStyle: RecursivePartial<AxisStyle> = {\n    tickLabel: {\n      padding: number('Tick Label Padding', 0, {\n        range: true,\n        min: 2,\n        max: 30,\n        step: 1,\n      }),\n    },\n  };\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 60);\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        style={customStyle}\n        showOverlappingLabels={boolean('Bottom overlap labels', false, 'Bottom Axis')}\n        showOverlappingTicks={boolean('Bottom overlap ticks', true, 'Bottom Axis')}\n        ticks={number(\n          'Number of ticks on bottom',\n          10,\n          {\n            range: true,\n            min: 2,\n            max: 20,\n            step: 1,\n          },\n          'Bottom Axis',\n        )}\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n      />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        style={customStyle}\n        showOverlappingLabels={boolean('Left overlap labels', false, 'Left Axis')}\n        showOverlappingTicks={boolean('Left overlap ticks', true, 'Left Axis')}\n        ticks={number(\n          'Number of ticks on left',\n          10,\n          {\n            range: true,\n            min: 2,\n            max: 20,\n            step: 1,\n          },\n          'Left Axis',\n        )}\n      />\n\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding', 0, {\\n        range: true,\\n        min: 2,\\n        max: 30,\\n        step: 1,\\n      }),\\n    },\\n  };\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 60);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        style={customStyle}\\n        showOverlappingLabels={boolean('Bottom overlap labels', false, 'Bottom Axis')}\\n        showOverlappingTicks={boolean('Bottom overlap ticks', true, 'Bottom Axis')}\\n        ticks={number(\\n          'Number of ticks on bottom',\\n          10,\\n          {\\n            range: true,\\n            min: 2,\\n            max: 20,\\n            step: 1,\\n          },\\n          'Bottom Axis',\\n        )}\\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        style={customStyle}\\n        showOverlappingLabels={boolean('Left overlap labels', false, 'Left Axis')}\\n        showOverlappingTicks={boolean('Left overlap ticks', true, 'Left Axis')}\\n        ticks={number(\\n          'Number of ticks on left',\\n          10,\\n          {\\n            range: true,\\n            min: 2,\\n            max: 20,\\n            step: 1,\\n          },\\n          'Left Axis',\\n        )}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  AxisStyle,\\n  RecursivePartial,\\n  LEGACY_CHART_MARGINS,\\n  DEFAULT_CHART_PADDING,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst getAxisKnobs = (group?: string, gridLines = false): RecursivePartial<AxisStyle> => ({\\n  axisTitle: {\\n    visible: !boolean('Hide axis title', false, group),\\n    padding: {\\n      outer: customKnobs.positiveNumber('Axis title padding - outer', 6, group),\\n      inner: customKnobs.positiveNumber('Axis title padding - inner', 6, group),\\n    },\\n  },\\n  axisLine: {\\n    visible: !boolean('Hide axis line', false, group),\\n  },\\n  tickLine: {\\n    visible: !boolean('Hide tick lines', false, group),\\n    padding: customKnobs.positiveNumber('Tick line padding', 10, group),\\n    size: customKnobs.positiveNumber('Tick line size', 10, group),\\n  },\\n  tickLabel: {\\n    visible: !boolean('Hide tick labels', false, group),\\n    rotation: number(\\n      'Tick label rotation',\\n      0,\\n      {\\n        range: true,\\n        min: -90,\\n        max: 90,\\n        step: 1,\\n      },\\n      group,\\n    ),\\n    padding: {\\n      outer: customKnobs.positiveNumber('Tick label padding - outer', 0, group),\\n      inner: customKnobs.positiveNumber('Tick label padding - inner', 0, group),\\n    },\\n    offset: {\\n      y: number(\\n        'Tick label y offset',\\n        0,\\n        {\\n          range: true,\\n          min: -10,\\n          max: 10,\\n          step: 1,\\n        },\\n        group,\\n      ),\\n      x: number(\\n        'Tick label x offset',\\n        0,\\n        {\\n          range: true,\\n          min: -10,\\n          max: 10,\\n          step: 1,\\n        },\\n        group,\\n      ),\\n      reference: select(\\n        'Tick label offset reference',\\n        {\\n          Global: 'global',\\n          Local: 'local',\\n        },\\n        'local',\\n        group,\\n      ),\\n    },\\n    alignment: {\\n      vertical: customKnobs.enum.verticalTextAlignment(group),\\n      horizontal: customKnobs.enum.horizontalTextAlignment(group),\\n    },\\n  },\\n  ...(gridLines && {\\n    gridLine: {\\n      horizontal: {\\n        visible: boolean('show horizontal gridLines', false, group),\\n      },\\n      vertical: {\\n        visible: boolean('show vertical gridLines', false, group),\\n      },\\n    },\\n  }),\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false, 'general');\\n  const onlyGlobal = !boolean('disable axis overrides', false, 'general');\\n  const chartMargins = {\\n    left: customKnobs.positiveNumber('margin left', LEGACY_CHART_MARGINS.left, 'general'),\\n    right: customKnobs.positiveNumber('margin right', LEGACY_CHART_MARGINS.right, 'general'),\\n    top: customKnobs.positiveNumber('margin top', LEGACY_CHART_MARGINS.top, 'general'),\\n    bottom: customKnobs.positiveNumber('margin bottom', LEGACY_CHART_MARGINS.bottom, 'general'),\\n  };\\n  const chartPaddings = {\\n    left: customKnobs.positiveNumber('padding left', DEFAULT_CHART_PADDING.left, 'general'),\\n    right: customKnobs.positiveNumber('padding right', DEFAULT_CHART_PADDING.right, 'general'),\\n    top: customKnobs.positiveNumber('padding top', DEFAULT_CHART_PADDING.top, 'general'),\\n    bottom: customKnobs.positiveNumber('padding bottom', DEFAULT_CHART_PADDING.bottom, 'general'),\\n  };\\n  const bottomAxisStyles = getAxisKnobs(Position.Bottom);\\n  const leftAxisStyles = getAxisKnobs(Position.Left);\\n  const topAxisStyles = getAxisKnobs(Position.Top);\\n  const rightAxisStyles = getAxisKnobs(Position.Right);\\n  const theme = {\\n    axes: getAxisKnobs('shared', true),\\n    chartMargins,\\n    chartPaddings,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        hide={boolean('hide axis', false, Position.Bottom)}\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Bottom),\\n              }\\n            : undefined\\n        }\\n        style={onlyGlobal ? bottomAxisStyles : undefined}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        hide={boolean('hide axis', false, Position.Left)}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        style={onlyGlobal ? leftAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Left),\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        hide={boolean('hide axis', false, Position.Top)}\\n        title=\\\"Top axis\\\"\\n        position={Position.Top}\\n        style={onlyGlobal ? topAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Top),\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        hide={boolean('hide axis', false, Position.Right)}\\n        title=\\\"Right axis\\\"\\n        position={Position.Right}\\n        style={onlyGlobal ? rightAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Right),\\n              }\\n            : undefined\\n        }\\n        domain={{ min: 0, max: 100 }}\\n      />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 20 },\\n          { x: 1, y: 70 },\\n          { x: 2, y: 30 },\\n          { x: 3, y: 60 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":112},\"endLoc\":{\"col\":1,\"line\":213},\"startBody\":{\"col\":36,\"line\":112},\"endBody\":{\"col\":1,\"line\":213}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  AxisStyle,\n  RecursivePartial,\n  LEGACY_CHART_MARGINS,\n  DEFAULT_CHART_PADDING,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst getAxisKnobs = (group?: string, gridLines = false): RecursivePartial<AxisStyle> => ({\n  axisTitle: {\n    visible: !boolean('Hide axis title', false, group),\n    padding: {\n      outer: customKnobs.positiveNumber('Axis title padding - outer', 6, group),\n      inner: customKnobs.positiveNumber('Axis title padding - inner', 6, group),\n    },\n  },\n  axisLine: {\n    visible: !boolean('Hide axis line', false, group),\n  },\n  tickLine: {\n    visible: !boolean('Hide tick lines', false, group),\n    padding: customKnobs.positiveNumber('Tick line padding', 10, group),\n    size: customKnobs.positiveNumber('Tick line size', 10, group),\n  },\n  tickLabel: {\n    visible: !boolean('Hide tick labels', false, group),\n    rotation: number(\n      'Tick label rotation',\n      0,\n      {\n        range: true,\n        min: -90,\n        max: 90,\n        step: 1,\n      },\n      group,\n    ),\n    padding: {\n      outer: customKnobs.positiveNumber('Tick label padding - outer', 0, group),\n      inner: customKnobs.positiveNumber('Tick label padding - inner', 0, group),\n    },\n    offset: {\n      y: number(\n        'Tick label y offset',\n        0,\n        {\n          range: true,\n          min: -10,\n          max: 10,\n          step: 1,\n        },\n        group,\n      ),\n      x: number(\n        'Tick label x offset',\n        0,\n        {\n          range: true,\n          min: -10,\n          max: 10,\n          step: 1,\n        },\n        group,\n      ),\n      reference: select(\n        'Tick label offset reference',\n        {\n          Global: 'global',\n          Local: 'local',\n        },\n        'local',\n        group,\n      ),\n    },\n    alignment: {\n      vertical: customKnobs.enum.verticalTextAlignment(group),\n      horizontal: customKnobs.enum.horizontalTextAlignment(group),\n    },\n  },\n  ...(gridLines && {\n    gridLine: {\n      horizontal: {\n        visible: boolean('show horizontal gridLines', false, group),\n      },\n      vertical: {\n        visible: boolean('show vertical gridLines', false, group),\n      },\n    },\n  }),\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false, 'general');\n  const onlyGlobal = !boolean('disable axis overrides', false, 'general');\n  const chartMargins = {\n    left: customKnobs.positiveNumber('margin left', LEGACY_CHART_MARGINS.left, 'general'),\n    right: customKnobs.positiveNumber('margin right', LEGACY_CHART_MARGINS.right, 'general'),\n    top: customKnobs.positiveNumber('margin top', LEGACY_CHART_MARGINS.top, 'general'),\n    bottom: customKnobs.positiveNumber('margin bottom', LEGACY_CHART_MARGINS.bottom, 'general'),\n  };\n  const chartPaddings = {\n    left: customKnobs.positiveNumber('padding left', DEFAULT_CHART_PADDING.left, 'general'),\n    right: customKnobs.positiveNumber('padding right', DEFAULT_CHART_PADDING.right, 'general'),\n    top: customKnobs.positiveNumber('padding top', DEFAULT_CHART_PADDING.top, 'general'),\n    bottom: customKnobs.positiveNumber('padding bottom', DEFAULT_CHART_PADDING.bottom, 'general'),\n  };\n  const bottomAxisStyles = getAxisKnobs(Position.Bottom);\n  const leftAxisStyles = getAxisKnobs(Position.Left);\n  const topAxisStyles = getAxisKnobs(Position.Top);\n  const rightAxisStyles = getAxisKnobs(Position.Right);\n  const theme = {\n    axes: getAxisKnobs('shared', true),\n    chartMargins,\n    chartPaddings,\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        hide={boolean('hide axis', false, Position.Bottom)}\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks\n        gridLine={\n          onlyGlobal\n            ? {\n                visible: boolean('show gridLines', false, Position.Bottom),\n              }\n            : undefined\n        }\n        style={onlyGlobal ? bottomAxisStyles : undefined}\n      />\n      <Axis\n        id=\"left\"\n        hide={boolean('hide axis', false, Position.Left)}\n        title=\"Left axis\"\n        position={Position.Left}\n        style={onlyGlobal ? leftAxisStyles : undefined}\n        gridLine={\n          onlyGlobal\n            ? {\n                visible: boolean('show gridLines', false, Position.Left),\n              }\n            : undefined\n        }\n      />\n      <Axis\n        id=\"top\"\n        hide={boolean('hide axis', false, Position.Top)}\n        title=\"Top axis\"\n        position={Position.Top}\n        style={onlyGlobal ? topAxisStyles : undefined}\n        gridLine={\n          onlyGlobal\n            ? {\n                visible: boolean('show gridLines', false, Position.Top),\n              }\n            : undefined\n        }\n      />\n      <Axis\n        id=\"right\"\n        hide={boolean('hide axis', false, Position.Right)}\n        title=\"Right axis\"\n        position={Position.Right}\n        style={onlyGlobal ? rightAxisStyles : undefined}\n        gridLine={\n          onlyGlobal\n            ? {\n                visible: boolean('show gridLines', false, Position.Right),\n              }\n            : undefined\n        }\n        domain={{ min: 0, max: 100 }}\n      />\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 20 },\n          { x: 1, y: 70 },\n          { x: 2, y: 30 },\n          { x: 3, y: 60 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false, 'general');\\n  const onlyGlobal = !boolean('disable axis overrides', false, 'general');\\n  const chartMargins = {\\n    left: customKnobs.positiveNumber('margin left', LEGACY_CHART_MARGINS.left, 'general'),\\n    right: customKnobs.positiveNumber('margin right', LEGACY_CHART_MARGINS.right, 'general'),\\n    top: customKnobs.positiveNumber('margin top', LEGACY_CHART_MARGINS.top, 'general'),\\n    bottom: customKnobs.positiveNumber('margin bottom', LEGACY_CHART_MARGINS.bottom, 'general'),\\n  };\\n  const chartPaddings = {\\n    left: customKnobs.positiveNumber('padding left', DEFAULT_CHART_PADDING.left, 'general'),\\n    right: customKnobs.positiveNumber('padding right', DEFAULT_CHART_PADDING.right, 'general'),\\n    top: customKnobs.positiveNumber('padding top', DEFAULT_CHART_PADDING.top, 'general'),\\n    bottom: customKnobs.positiveNumber('padding bottom', DEFAULT_CHART_PADDING.bottom, 'general'),\\n  };\\n  const bottomAxisStyles = getAxisKnobs(Position.Bottom);\\n  const leftAxisStyles = getAxisKnobs(Position.Left);\\n  const topAxisStyles = getAxisKnobs(Position.Top);\\n  const rightAxisStyles = getAxisKnobs(Position.Right);\\n  const theme = {\\n    axes: getAxisKnobs('shared', true),\\n    chartMargins,\\n    chartPaddings,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        hide={boolean('hide axis', false, Position.Bottom)}\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Bottom),\\n              }\\n            : undefined\\n        }\\n        style={onlyGlobal ? bottomAxisStyles : undefined}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        hide={boolean('hide axis', false, Position.Left)}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        style={onlyGlobal ? leftAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Left),\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        hide={boolean('hide axis', false, Position.Top)}\\n        title=\\\"Top axis\\\"\\n        position={Position.Top}\\n        style={onlyGlobal ? topAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Top),\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        hide={boolean('hide axis', false, Position.Right)}\\n        title=\\\"Right axis\\\"\\n        position={Position.Right}\\n        style={onlyGlobal ? rightAxisStyles : undefined}\\n        gridLine={\\n          onlyGlobal\\n            ? {\\n                visible: boolean('show gridLines', false, Position.Right),\\n              }\\n            : undefined\\n        }\\n        domain={{ min: 0, max: 100 }}\\n      />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 20 },\\n          { x: 1, y: 70 },\\n          { x: 2, y: 30 },\\n          { x: 3, y: 60 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"bottom\\\"\\n      showOverlappingTicks\\n      hide={boolean('hide botttom axis', false)}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title=\\\"left\\\"\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      hide={boolean('hide left axis', false)}\\n    />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks hide={boolean('hide top axis', false)} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"right\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      hide={boolean('hide right axis', false)}\\n    />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"bottom\"\n      showOverlappingTicks\n      hide={boolean('hide botttom axis', false)}\n    />\n    <Axis\n      id=\"left\"\n      title=\"left\"\n      position={Position.Left}\n      tickFormat={(d) => Number(d).toFixed(2)}\n      hide={boolean('hide left axis', false)}\n    />\n    <Axis id=\"top\" position={Position.Top} title=\"top\" showOverlappingTicks hide={boolean('hide top axis', false)} />\n    <Axis\n      id=\"right\"\n      title=\"right\"\n      position={Position.Right}\n      tickFormat={(d) => Number(d).toFixed(2)}\n      hide={boolean('hide right axis', false)}\n    />\n\n    <AreaSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"bottom\\\"\\n      showOverlappingTicks\\n      hide={boolean('hide botttom axis', false)}\\n    />\\n    <Axis\\n      id=\\\"left\\\"\\n      title=\\\"left\\\"\\n      position={Position.Left}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      hide={boolean('hide left axis', false)}\\n    />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks hide={boolean('hide top axis', false)} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"right\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      hide={boolean('hide right axis', false)}\\n    />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction createThemeAction(title: string, min: number, max: number, value: number) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step: 1,\\n    },\\n    'theme',\\n  );\\n}\\n\\nfunction renderAxisWithOptions(position: Position, seriesGroup: string, show: boolean) {\\n  const axisTitle = `${position} axis (${seriesGroup})`;\\n\\n  const showAxis = boolean(`show ${axisTitle} axis`, show, `${position} axes`);\\n\\n  if (!showAxis) {\\n    return null;\\n  }\\n\\n  const axisProps = {\\n    id: axisTitle,\\n    position,\\n    title: axisTitle,\\n    showOverlappingTicks: true,\\n  };\\n\\n  return <Axis {...axisProps} />;\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    chartMargins: {\\n      left: createThemeAction('margin left', 0, 50, 0),\\n      right: createThemeAction('margin right', 0, 50, 0),\\n      top: createThemeAction('margin top', 0, 50, 0),\\n      bottom: createThemeAction('margin bottom', 0, 50, 0),\\n    },\\n    chartPaddings: {\\n      left: createThemeAction('padding left', 0, 50, 0),\\n      right: createThemeAction('padding right', 0, 50, 0),\\n      top: createThemeAction('padding top', 0, 50, 0),\\n      bottom: createThemeAction('padding bottom', 0, 50, 0),\\n    },\\n  };\\n  const seriesGroup1 = 'group1';\\n  const seriesGroup2 = 'group2';\\n  return (\\n    <Chart title={title} description={description} size={[500, 300]}>\\n      <Settings showLegend={false} theme={customTheme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\\n      {renderAxisWithOptions(Position.Top, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Top, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Left, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Left, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Bottom, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Bottom, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Right, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Right, seriesGroup2, true)}\\n      <BarSeries\\n        id=\\\"barseries1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 1 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 4 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":50},\"endLoc\":{\"col\":1,\"line\":93},\"startBody\":{\"col\":36,\"line\":50},\"endBody\":{\"col\":1,\"line\":93}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction createThemeAction(title: string, min: number, max: number, value: number) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step: 1,\n    },\n    'theme',\n  );\n}\n\nfunction renderAxisWithOptions(position: Position, seriesGroup: string, show: boolean) {\n  const axisTitle = `${position} axis (${seriesGroup})`;\n\n  const showAxis = boolean(`show ${axisTitle} axis`, show, `${position} axes`);\n\n  if (!showAxis) {\n    return null;\n  }\n\n  const axisProps = {\n    id: axisTitle,\n    position,\n    title: axisTitle,\n    showOverlappingTicks: true,\n  };\n\n  return <Axis {...axisProps} />;\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customTheme: PartialTheme = {\n    chartMargins: {\n      left: createThemeAction('margin left', 0, 50, 0),\n      right: createThemeAction('margin right', 0, 50, 0),\n      top: createThemeAction('margin top', 0, 50, 0),\n      bottom: createThemeAction('margin bottom', 0, 50, 0),\n    },\n    chartPaddings: {\n      left: createThemeAction('padding left', 0, 50, 0),\n      right: createThemeAction('padding right', 0, 50, 0),\n      top: createThemeAction('padding top', 0, 50, 0),\n      bottom: createThemeAction('padding bottom', 0, 50, 0),\n    },\n  };\n  const seriesGroup1 = 'group1';\n  const seriesGroup2 = 'group2';\n  return (\n    <Chart title={title} description={description} size={[500, 300]}>\n      <Settings showLegend={false} theme={customTheme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\n      {renderAxisWithOptions(Position.Top, seriesGroup1, false)}\n      {renderAxisWithOptions(Position.Top, seriesGroup2, true)}\n      {renderAxisWithOptions(Position.Left, seriesGroup1, false)}\n      {renderAxisWithOptions(Position.Left, seriesGroup2, true)}\n      {renderAxisWithOptions(Position.Bottom, seriesGroup1, false)}\n      {renderAxisWithOptions(Position.Bottom, seriesGroup2, true)}\n      {renderAxisWithOptions(Position.Right, seriesGroup1, false)}\n      {renderAxisWithOptions(Position.Right, seriesGroup2, true)}\n      <BarSeries\n        id=\"barseries1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 1 },\n          { x: 1, y: 2 },\n          { x: 2, y: 3 },\n          { x: 3, y: 4 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    chartMargins: {\\n      left: createThemeAction('margin left', 0, 50, 0),\\n      right: createThemeAction('margin right', 0, 50, 0),\\n      top: createThemeAction('margin top', 0, 50, 0),\\n      bottom: createThemeAction('margin bottom', 0, 50, 0),\\n    },\\n    chartPaddings: {\\n      left: createThemeAction('padding left', 0, 50, 0),\\n      right: createThemeAction('padding right', 0, 50, 0),\\n      top: createThemeAction('padding top', 0, 50, 0),\\n      bottom: createThemeAction('padding bottom', 0, 50, 0),\\n    },\\n  };\\n  const seriesGroup1 = 'group1';\\n  const seriesGroup2 = 'group2';\\n  return (\\n    <Chart title={title} description={description} size={[500, 300]}>\\n      <Settings showLegend={false} theme={customTheme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\\n      {renderAxisWithOptions(Position.Top, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Top, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Left, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Left, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Bottom, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Bottom, seriesGroup2, true)}\\n      {renderAxisWithOptions(Position.Right, seriesGroup1, false)}\\n      {renderAxisWithOptions(Position.Right, seriesGroup2, true)}\\n      <BarSeries\\n        id=\\\"barseries1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 1 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 4 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"Bar axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"Line axis\\\"\\n      groupId=\\\"group2\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      groupId=\\\"group2\\\"\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left\" title=\"Bar axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n    <Axis\n      id=\"right\"\n      title=\"Line axis\"\n      groupId=\"group2\"\n      position={Position.Right}\n      tickFormat={(d) => Number(d).toFixed(2)}\n    />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      groupId=\"group2\"\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 3 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 10 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"Bar axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"Line axis\\\"\\n      groupId=\\\"group2\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n    />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      groupId=\\\"group2\\\"\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left\\\"\\n      groupId=\\\"group1\\\"\\n      title=\\\"Line 1\\\"\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)} %`}\\n    />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"Line 2\\\"\\n      groupId=\\\"group2\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}/s`}\\n    />\\n    <LineSeries\\n      id=\\\"line1\\\"\\n      groupId=\\\"group1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 5 },\\n        { x: 1, y: 4 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 2 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line2\\\"\\n      groupId=\\\"group2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 3 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 5 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":65},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":65}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis\n      id=\"left\"\n      groupId=\"group1\"\n      title=\"Line 1\"\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(2)} %`}\n    />\n    <Axis\n      id=\"right\"\n      title=\"Line 2\"\n      groupId=\"group2\"\n      position={Position.Right}\n      tickFormat={(d) => `${Number(d).toFixed(2)}/s`}\n    />\n    <LineSeries\n      id=\"line1\"\n      groupId=\"group1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 5 },\n        { x: 1, y: 4 },\n        { x: 2, y: 3 },\n        { x: 3, y: 2 },\n      ]}\n    />\n    <LineSeries\n      id=\"line2\"\n      groupId=\"group2\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 3 },\n        { x: 2, y: 4 },\n        { x: 3, y: 5 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend={false} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left\\\"\\n      groupId=\\\"group1\\\"\\n      title=\\\"Line 1\\\"\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)} %`}\\n    />\\n    <Axis\\n      id=\\\"right\\\"\\n      title=\\\"Line 2\\\"\\n      groupId=\\\"group2\\\"\\n      position={Position.Right}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}/s`}\\n    />\\n    <LineSeries\\n      id=\\\"line1\\\"\\n      groupId=\\\"group1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 5 },\\n        { x: 1, y: 4 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 2 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line2\\\"\\n      groupId=\\\"group2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 3 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 5 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { text, boolean } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings, Tooltip } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showLegend = boolean('Show legend', true, 'Y axis');\\n  const disableYAxisFormat = boolean('Disable Axis tickFormat', false, 'Y axis');\\n  const yAxisFormat = text('Axis value format', '0[.]0', 'Y axis');\\n  const yAxisUnit = text('Axis unit', 'pets', 'Y axis');\\n  const disableHeaderFormat = boolean('Disable header tickFormat', false, 'X axis');\\n  const headerUnit = text('Header unit', '(header)', 'X axis');\\n  const disableXAxisFormat = boolean('Disable Axis tickFormat', false, 'X axis');\\n  const xAxisUnit = text('Axis unit', '(axis)', 'X axis');\\n  const disableDogLineFormat = boolean('Disable dog line tickFormat', false, 'Y axis');\\n  const dogLineFormat = text('Dog line unit', 'dogs', 'Y axis');\\n  const disableCatLineFormat = boolean('Disable cat line tickFormat', false, 'Y axis');\\n  const catLineFormat = text('Cat line unit', 'cats', 'Y axis');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} showLegendExtra showLegend={showLegend} />\\n      <Tooltip\\n        headerFormatter={\\n          disableHeaderFormat ? undefined : ({ value }) => `${value}${headerUnit ? ` ${headerUnit}` : ''}`\\n        }\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"Country\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={disableXAxisFormat ? undefined : (value) => `${value}${xAxisUnit ? ` ${xAxisUnit}` : ''}`}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Units\\\"\\n        position={Position.Left}\\n        tickFormat={\\n          disableYAxisFormat ? undefined : (d) => `${numeral(d).format(yAxisFormat)}${yAxisUnit ? ` ${yAxisUnit}` : ''}`\\n        }\\n      />\\n      <LineSeries\\n        id=\\\"Dog line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        tickFormat={disableDogLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${dogLineFormat}`}\\n        data={[\\n          { x: 'USA', y: 8 },\\n          { x: 'Canada', y: 7 },\\n          { x: 'Mexico', y: 18 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"Cat line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        tickFormat={disableCatLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${catLineFormat}`}\\n        data={[\\n          { x: 'USA', y: 14 },\\n          { x: 'Canada', y: 15 },\\n          { x: 'Mexico', y: 14 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: 'Using a single axis with different unit types is discouraged. ',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":83},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":83}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { text, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings, Tooltip } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showLegend = boolean('Show legend', true, 'Y axis');\n  const disableYAxisFormat = boolean('Disable Axis tickFormat', false, 'Y axis');\n  const yAxisFormat = text('Axis value format', '0[.]0', 'Y axis');\n  const yAxisUnit = text('Axis unit', 'pets', 'Y axis');\n  const disableHeaderFormat = boolean('Disable header tickFormat', false, 'X axis');\n  const headerUnit = text('Header unit', '(header)', 'X axis');\n  const disableXAxisFormat = boolean('Disable Axis tickFormat', false, 'X axis');\n  const xAxisUnit = text('Axis unit', '(axis)', 'X axis');\n  const disableDogLineFormat = boolean('Disable dog line tickFormat', false, 'Y axis');\n  const dogLineFormat = text('Dog line unit', 'dogs', 'Y axis');\n  const disableCatLineFormat = boolean('Disable cat line tickFormat', false, 'Y axis');\n  const catLineFormat = text('Cat line unit', 'cats', 'Y axis');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} showLegendExtra showLegend={showLegend} />\n      <Tooltip\n        headerFormatter={\n          disableHeaderFormat ? undefined : ({ value }) => `${value}${headerUnit ? ` ${headerUnit}` : ''}`\n        }\n      />\n      <Axis\n        id=\"bottom\"\n        title=\"Country\"\n        position={Position.Bottom}\n        showOverlappingTicks\n        tickFormat={disableXAxisFormat ? undefined : (value) => `${value}${xAxisUnit ? ` ${xAxisUnit}` : ''}`}\n      />\n      <Axis\n        id=\"left\"\n        title=\"Units\"\n        position={Position.Left}\n        tickFormat={\n          disableYAxisFormat ? undefined : (d) => `${numeral(d).format(yAxisFormat)}${yAxisUnit ? ` ${yAxisUnit}` : ''}`\n        }\n      />\n      <LineSeries\n        id=\"Dog line\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        tickFormat={disableDogLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${dogLineFormat}`}\n        data={[\n          { x: 'USA', y: 8 },\n          { x: 'Canada', y: 7 },\n          { x: 'Mexico', y: 18 },\n        ]}\n      />\n      <LineSeries\n        id=\"Cat line\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        tickFormat={disableCatLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${catLineFormat}`}\n        data={[\n          { x: 'USA', y: 14 },\n          { x: 'Canada', y: 15 },\n          { x: 'Mexico', y: 14 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: 'Using a single axis with different unit types is discouraged. ',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showLegend = boolean('Show legend', true, 'Y axis');\\n  const disableYAxisFormat = boolean('Disable Axis tickFormat', false, 'Y axis');\\n  const yAxisFormat = text('Axis value format', '0[.]0', 'Y axis');\\n  const yAxisUnit = text('Axis unit', 'pets', 'Y axis');\\n  const disableHeaderFormat = boolean('Disable header tickFormat', false, 'X axis');\\n  const headerUnit = text('Header unit', '(header)', 'X axis');\\n  const disableXAxisFormat = boolean('Disable Axis tickFormat', false, 'X axis');\\n  const xAxisUnit = text('Axis unit', '(axis)', 'X axis');\\n  const disableDogLineFormat = boolean('Disable dog line tickFormat', false, 'Y axis');\\n  const dogLineFormat = text('Dog line unit', 'dogs', 'Y axis');\\n  const disableCatLineFormat = boolean('Disable cat line tickFormat', false, 'Y axis');\\n  const catLineFormat = text('Cat line unit', 'cats', 'Y axis');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} showLegendExtra showLegend={showLegend} />\\n      <Tooltip\\n        headerFormatter={\\n          disableHeaderFormat ? undefined : ({ value }) => `${value}${headerUnit ? ` ${headerUnit}` : ''}`\\n        }\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"Country\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={disableXAxisFormat ? undefined : (value) => `${value}${xAxisUnit ? ` ${xAxisUnit}` : ''}`}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Units\\\"\\n        position={Position.Left}\\n        tickFormat={\\n          disableYAxisFormat ? undefined : (d) => `${numeral(d).format(yAxisFormat)}${yAxisUnit ? ` ${yAxisUnit}` : ''}`\\n        }\\n      />\\n      <LineSeries\\n        id=\\\"Dog line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        tickFormat={disableDogLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${dogLineFormat}`}\\n        data={[\\n          { x: 'USA', y: 8 },\\n          { x: 'Canada', y: 7 },\\n          { x: 'Mexico', y: 18 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"Cat line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        tickFormat={disableCatLineFormat ? undefined : (d) => `${Number(d).toFixed(2)} ${catLineFormat}`}\\n        data={[\\n          { x: 'USA', y: 14 },\\n          { x: 'Canada', y: 15 },\\n          { x: 'Mexico', y: 14 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, RecursivePartial, AxisStyle } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const dg = new SeededDataGenerator();\\n  const data = dg.generateSimpleSeries(31);\\n\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding', 0),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks style={customStyle} />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, RecursivePartial, AxisStyle } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const dg = new SeededDataGenerator();\n  const data = dg.generateSimpleSeries(31);\n\n  const customStyle: RecursivePartial<AxisStyle> = {\n    tickLabel: {\n      padding: number('Tick Label Padding', 0),\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks style={customStyle} />\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const dg = new SeededDataGenerator();\\n  const data = dg.generateSimpleSeries(31);\\n\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding', 0),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks style={customStyle} />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LIGHT_THEME, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customXDomain = boolean('customize X domain', true, 'X axis');\\n  const customBarYDomain = boolean('customize Y domain', true, 'Bar');\\n  const customLineYDomain = boolean('customize Y domain', true, 'Line');\\n  const options = {\\n    range: true,\\n    min: -10,\\n    max: 20,\\n    step: 0.1,\\n  };\\n  const barDomain = {\\n    min: number('Bar min', -5, options, 'Bar'),\\n    max: number('Bar max', 7, options, 'Bar'),\\n  };\\n\\n  const lineDomain = {\\n    min: number('Line min', 0, options, 'Line'),\\n    max: number('Line max', 8, options, 'Line'),\\n  };\\n\\n  const ticksOptions = {\\n    range: true,\\n    min: 1,\\n    max: 15,\\n    step: 1,\\n  };\\n  const barTicks = number('Bar ticks', 4, ticksOptions, 'Bar');\\n  const lineTicks = number('Line ticks', 10, ticksOptions, 'Line');\\n\\n  const xOptions = {\\n    range: true,\\n    min: 0,\\n    max: 6,\\n    step: 1,\\n  };\\n  const xDomain = {\\n    min: number('X min', 0, xOptions, 'X axis'),\\n    max: number('X max', 3, xOptions, 'X axis'),\\n  };\\n\\n  const showBars = boolean('show bars', true, 'Bar');\\n  const niceDomainBar = boolean('nice domain', true, 'Bar');\\n  const niceDomainLine = boolean('nice domain', true, 'Line');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend={false}\\n        theme={{ chartPaddings: { top: 0, left: 10, right: 10, bottom: 0 } }}\\n        baseTheme={useBaseTheme()}\\n        xDomain={customXDomain ? xDomain : undefined}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"X axis\\\"\\n        style={{\\n          tickLine: {\\n            visible: true,\\n          },\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={customBarYDomain ? barDomain : undefined}\\n        hide={boolean('Hide bar axis', false, 'Bar')}\\n        ticks={barTicks}\\n        style={{\\n          axisLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[0],\\n            strokeWidth: 1.5,\\n          },\\n          axisTitle: {\\n            fill: LIGHT_THEME.colors.vizColors[0],\\n          },\\n          tickLabel: {\\n            fill: LIGHT_THEME.colors.vizColors[0],\\n          },\\n          tickLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[0],\\n          },\\n        }}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Line\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={customLineYDomain ? lineDomain : undefined}\\n        hide={boolean('Hide line axis', false, 'Line')}\\n        ticks={lineTicks}\\n        style={{\\n          axisLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[1],\\n            strokeWidth: 1.5,\\n          },\\n          axisTitle: {\\n            fill: LIGHT_THEME.colors.vizColors[1],\\n          },\\n          tickLabel: {\\n            fill: LIGHT_THEME.colors.vizColors[1],\\n          },\\n          tickLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[1],\\n          },\\n        }}\\n      />\\n      {showBars && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          yNice={niceDomainBar}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 7 },\\n            { x: 2, y: -3 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      )}\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        xNice={niceDomainLine}\\n        yScaleType={ScaleType.Linear}\\n        yNice={niceDomainLine}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":162},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":162}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LIGHT_THEME, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customXDomain = boolean('customize X domain', true, 'X axis');\n  const customBarYDomain = boolean('customize Y domain', true, 'Bar');\n  const customLineYDomain = boolean('customize Y domain', true, 'Line');\n  const options = {\n    range: true,\n    min: -10,\n    max: 20,\n    step: 0.1,\n  };\n  const barDomain = {\n    min: number('Bar min', -5, options, 'Bar'),\n    max: number('Bar max', 7, options, 'Bar'),\n  };\n\n  const lineDomain = {\n    min: number('Line min', 0, options, 'Line'),\n    max: number('Line max', 8, options, 'Line'),\n  };\n\n  const ticksOptions = {\n    range: true,\n    min: 1,\n    max: 15,\n    step: 1,\n  };\n  const barTicks = number('Bar ticks', 4, ticksOptions, 'Bar');\n  const lineTicks = number('Line ticks', 10, ticksOptions, 'Line');\n\n  const xOptions = {\n    range: true,\n    min: 0,\n    max: 6,\n    step: 1,\n  };\n  const xDomain = {\n    min: number('X min', 0, xOptions, 'X axis'),\n    max: number('X max', 3, xOptions, 'X axis'),\n  };\n\n  const showBars = boolean('show bars', true, 'Bar');\n  const niceDomainBar = boolean('nice domain', true, 'Bar');\n  const niceDomainLine = boolean('nice domain', true, 'Line');\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend={false}\n        theme={{ chartPaddings: { top: 0, left: 10, right: 10, bottom: 0 } }}\n        baseTheme={useBaseTheme()}\n        xDomain={customXDomain ? xDomain : undefined}\n      />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"X axis\"\n        style={{\n          tickLine: {\n            visible: true,\n          },\n        }}\n      />\n      <Axis\n        id=\"left\"\n        title=\"Bar\"\n        position={Position.Right}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={customBarYDomain ? barDomain : undefined}\n        hide={boolean('Hide bar axis', false, 'Bar')}\n        ticks={barTicks}\n        style={{\n          axisLine: {\n            stroke: LIGHT_THEME.colors.vizColors[0],\n            strokeWidth: 1.5,\n          },\n          axisTitle: {\n            fill: LIGHT_THEME.colors.vizColors[0],\n          },\n          tickLabel: {\n            fill: LIGHT_THEME.colors.vizColors[0],\n          },\n          tickLine: {\n            stroke: LIGHT_THEME.colors.vizColors[0],\n          },\n        }}\n      />\n      <Axis\n        id=\"right\"\n        title=\"Line\"\n        groupId=\"group2\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={customLineYDomain ? lineDomain : undefined}\n        hide={boolean('Hide line axis', false, 'Line')}\n        ticks={lineTicks}\n        style={{\n          axisLine: {\n            stroke: LIGHT_THEME.colors.vizColors[1],\n            strokeWidth: 1.5,\n          },\n          axisTitle: {\n            fill: LIGHT_THEME.colors.vizColors[1],\n          },\n          tickLabel: {\n            fill: LIGHT_THEME.colors.vizColors[1],\n          },\n          tickLine: {\n            stroke: LIGHT_THEME.colors.vizColors[1],\n          },\n        }}\n      />\n      {showBars && (\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          yNice={niceDomainBar}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={[\n            { x: 0, y: 2 },\n            { x: 1, y: 7 },\n            { x: 2, y: -3 },\n            { x: 3, y: 6 },\n          ]}\n        />\n      )}\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        xNice={niceDomainLine}\n        yScaleType={ScaleType.Linear}\n        yNice={niceDomainLine}\n        groupId=\"group2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customXDomain = boolean('customize X domain', true, 'X axis');\\n  const customBarYDomain = boolean('customize Y domain', true, 'Bar');\\n  const customLineYDomain = boolean('customize Y domain', true, 'Line');\\n  const options = {\\n    range: true,\\n    min: -10,\\n    max: 20,\\n    step: 0.1,\\n  };\\n  const barDomain = {\\n    min: number('Bar min', -5, options, 'Bar'),\\n    max: number('Bar max', 7, options, 'Bar'),\\n  };\\n\\n  const lineDomain = {\\n    min: number('Line min', 0, options, 'Line'),\\n    max: number('Line max', 8, options, 'Line'),\\n  };\\n\\n  const ticksOptions = {\\n    range: true,\\n    min: 1,\\n    max: 15,\\n    step: 1,\\n  };\\n  const barTicks = number('Bar ticks', 4, ticksOptions, 'Bar');\\n  const lineTicks = number('Line ticks', 10, ticksOptions, 'Line');\\n\\n  const xOptions = {\\n    range: true,\\n    min: 0,\\n    max: 6,\\n    step: 1,\\n  };\\n  const xDomain = {\\n    min: number('X min', 0, xOptions, 'X axis'),\\n    max: number('X max', 3, xOptions, 'X axis'),\\n  };\\n\\n  const showBars = boolean('show bars', true, 'Bar');\\n  const niceDomainBar = boolean('nice domain', true, 'Bar');\\n  const niceDomainLine = boolean('nice domain', true, 'Line');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend={false}\\n        theme={{ chartPaddings: { top: 0, left: 10, right: 10, bottom: 0 } }}\\n        baseTheme={useBaseTheme()}\\n        xDomain={customXDomain ? xDomain : undefined}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"X axis\\\"\\n        style={{\\n          tickLine: {\\n            visible: true,\\n          },\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={customBarYDomain ? barDomain : undefined}\\n        hide={boolean('Hide bar axis', false, 'Bar')}\\n        ticks={barTicks}\\n        style={{\\n          axisLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[0],\\n            strokeWidth: 1.5,\\n          },\\n          axisTitle: {\\n            fill: LIGHT_THEME.colors.vizColors[0],\\n          },\\n          tickLabel: {\\n            fill: LIGHT_THEME.colors.vizColors[0],\\n          },\\n          tickLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[0],\\n          },\\n        }}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Line\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={customLineYDomain ? lineDomain : undefined}\\n        hide={boolean('Hide line axis', false, 'Line')}\\n        ticks={lineTicks}\\n        style={{\\n          axisLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[1],\\n            strokeWidth: 1.5,\\n          },\\n          axisTitle: {\\n            fill: LIGHT_THEME.colors.vizColors[1],\\n          },\\n          tickLabel: {\\n            fill: LIGHT_THEME.colors.vizColors[1],\\n          },\\n          tickLine: {\\n            stroke: LIGHT_THEME.colors.vizColors[1],\\n          },\\n        }}\\n      />\\n      {showBars && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          yNice={niceDomainBar}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={[\\n            { x: 0, y: 2 },\\n            { x: 1, y: 7 },\\n            { x: 2, y: -3 },\\n            { x: 3, y: 6 },\\n          ]}\\n        />\\n      )}\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        xNice={niceDomainLine}\\n        yScaleType={ScaleType.Linear}\\n        yNice={niceDomainLine}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const leftDomain = {\\n    min: number('left min', 0),\\n    max: number('left max', 7),\\n  };\\n\\n  const right1Domain = {\\n    min: number('right1 min', 0),\\n    max: number('right1 max', 10),\\n  };\\n\\n  const xDomain = customKnobs.array('xDomain', ['a', 'b', 'c', 'd', 0, 1, 2, 3]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={leftDomain}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Line axis\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={right1Domain}\\n      />\\n      <Axis\\n        id=\\\"right 2\\\"\\n        title=\\\"Line axis 2\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":87},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":87}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const leftDomain = {\n    min: number('left min', 0),\n    max: number('left max', 7),\n  };\n\n  const right1Domain = {\n    min: number('right1 min', 0),\n    max: number('right1 max', 10),\n  };\n\n  const xDomain = customKnobs.array('xDomain', ['a', 'b', 'c', 'd', 0, 1, 2, 3]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis\n        id=\"left\"\n        title=\"Bar axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={leftDomain}\n      />\n      <Axis\n        id=\"right\"\n        title=\"Line axis\"\n        groupId=\"group2\"\n        position={Position.Right}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={right1Domain}\n      />\n      <Axis\n        id=\"right 2\"\n        title=\"Line axis 2\"\n        groupId=\"group2\"\n        position={Position.Right}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'a', y: 2 },\n          { x: 'b', y: 7 },\n          { x: 'c', y: 3 },\n          { x: 'd', y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        groupId=\"group2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const leftDomain = {\\n    min: number('left min', 0),\\n    max: number('left max', 7),\\n  };\\n\\n  const right1Domain = {\\n    min: number('right1 min', 0),\\n    max: number('right1 max', 10),\\n  };\\n\\n  const xDomain = customKnobs.array('xDomain', ['a', 'b', 'c', 'd', 0, 1, 2, 3]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend={false} xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Bar axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={leftDomain}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Line axis\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={right1Domain}\\n      />\\n      <Axis\\n        id=\\\"right 2\\\"\\n        title=\\\"Line axis 2\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'a', y: 2 },\\n          { x: 'b', y: 7 },\\n          { x: 'c', y: 3 },\\n          { x: 'd', y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Axes',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as tickLabelRotation } from './2_tick_label_rotation.story';\nexport { Example as with4Axes } from './3_axis_4_axes.story';\nexport { Example as multiAxes } from './4_multi_axis.story';\nexport { Example as maximumFractionDigits } from './15_maximum_fraction_digits.story';\nexport { Example as barsAndLines } from './5_multi_axis_bar_lines.story';\nexport { Example as differentTooltip } from './6_different_tooltip.story';\nexport { Example as differentTooltipFormatter } from './6a_different_tooltip_formatter.story';\nexport { Example as manyTickLabels } from './7_many_tick_labels.story';\nexport { Example as customDomain } from './8_custom_domain.story';\nexport { Example as customMixed } from './9_custom_mixed_domain.story';\nexport { Example as oneDomainBound } from './10_one_domain_bound.story';\nexport { Example as fitDomain } from './11_fit_domain_extent.story';\nexport { Example as duplicateTicks } from './12_duplicate_ticks.story';\nexport { Example as labelFormatting } from './13_label_formatting.story';\nexport { Example as duplicateTicks2 } from './14_duplicate_ticks_2.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      name=\\\"Simple bar series\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      name=\"Simple bar series\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      name=\\\"Simple bar series\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 2, g: 'a' },\\n        { x: 1, y: 7, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 6, g: 'a' },\\n        { x: 0, y: 4, g: 'b' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 2, y: 8, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      splitSeriesAccessors={['g']}\n      data={[\n        { x: 0, y: 2, g: 'a' },\n        { x: 1, y: 7, g: 'a' },\n        { x: 2, y: 3, g: 'a' },\n        { x: 3, y: 6, g: 'a' },\n        { x: 0, y: 4, g: 'b' },\n        { x: 1, y: 5, g: 'b' },\n        { x: 2, y: 8, g: 'b' },\n        { x: 3, y: 2, g: 'b' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 2, g: 'a' },\\n        { x: 1, y: 7, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 6, g: 'a' },\\n        { x: 0, y: 4, g: 'b' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 2, y: 8, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  StackMode,\\n  computeRatioByGroups,\\n} from '@elastic/charts';\\n\\nimport { AnnotationDomainType, LineAnnotation } from '../../../packages/charts/src/chart_types/specs';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const modes = select(\\n    'mode',\\n    { stack: 'stack', stackAsPercentage: 'stackAsPercentage', unstacked: 'unstacked' },\\n    'stackAsPercentage',\\n  );\\n  const stack = modes !== 'unstacked' ? ['x'] : undefined;\\n  const stackMode = modes === 'stackAsPercentage' ? StackMode.Percentage : undefined;\\n\\n  const originalData = [\\n    { x: 'pos/neg', y: -10, y2: 10, g: 'a' },\\n    { x: 'pos/neg', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'zero/zero', y: 0, y2: 10, g: 'a' },\\n    { x: 'zero/zero', y: 0, y2: 10, g: 'b' },\\n\\n    { x: 'zero/pos', y: 0, y2: 10, g: 'a' },\\n    { x: 'zero/pos', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'null/pos', y: null, y2: 10, g: 'a' },\\n    { x: 'null/pos', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'pos/pos', y: 2, y2: 10, g: 'a' },\\n    { x: 'pos/pos', y: 8, y2: 10, g: 'b' },\\n\\n    { x: 'neg/neg', y: -2, y2: 10, g: 'a' },\\n    { x: 'neg/neg', y: -8, y2: 10, g: 'b' },\\n  ];\\n\\n  const useMultipleY = boolean('use multiple Y accessors', false);\\n  const data = boolean('use computeRatioByGroups fn', false)\\n    ? computeRatioByGroups(\\n        originalData,\\n        ['x'],\\n        useMultipleY\\n          ? [\\n              [(d) => d.y, (d, v) => ({ ...d, y: v })],\\n              [(d) => d.y2, (d, v) => ({ ...d, y2: v })],\\n            ]\\n          : [[(d) => d.y, (d, v) => ({ ...d, y: v })]],\\n      )\\n    : originalData;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n\\n      <Axis\\n        id=\\\"left2\\\"\\n        position={Position.Left}\\n        gridLine={{\\n          visible: true,\\n          stroke: 'rgba(128,128,128,0.5)',\\n          strokeWidth: 0.5,\\n        }}\\n        ticks={5}\\n        style={{ axisLine: { visible: false }, tickLine: { visible: false }, tickLabel: { padding: 5 } }}\\n        tickFormat={(d: any) => (modes === 'stackAsPercentage' ? `${Number(d * 100).toFixed(0)} %` : `${d}`)}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={useMultipleY ? ['y', 'y2'] : ['y']}\\n        stackAccessors={stack}\\n        stackMode={stack && stackMode}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n      <LineAnnotation dataValues={[{ dataValue: 0 }]} id=\\\"baseline\\\" domainType={AnnotationDomainType.YDomain} />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":101},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":101}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  StackMode,\n  computeRatioByGroups,\n} from '@elastic/charts';\n\nimport { AnnotationDomainType, LineAnnotation } from '../../../packages/charts/src/chart_types/specs';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const modes = select(\n    'mode',\n    { stack: 'stack', stackAsPercentage: 'stackAsPercentage', unstacked: 'unstacked' },\n    'stackAsPercentage',\n  );\n  const stack = modes !== 'unstacked' ? ['x'] : undefined;\n  const stackMode = modes === 'stackAsPercentage' ? StackMode.Percentage : undefined;\n\n  const originalData = [\n    { x: 'pos/neg', y: -10, y2: 10, g: 'a' },\n    { x: 'pos/neg', y: 10, y2: 10, g: 'b' },\n\n    { x: 'zero/zero', y: 0, y2: 10, g: 'a' },\n    { x: 'zero/zero', y: 0, y2: 10, g: 'b' },\n\n    { x: 'zero/pos', y: 0, y2: 10, g: 'a' },\n    { x: 'zero/pos', y: 10, y2: 10, g: 'b' },\n\n    { x: 'null/pos', y: null, y2: 10, g: 'a' },\n    { x: 'null/pos', y: 10, y2: 10, g: 'b' },\n\n    { x: 'pos/pos', y: 2, y2: 10, g: 'a' },\n    { x: 'pos/pos', y: 8, y2: 10, g: 'b' },\n\n    { x: 'neg/neg', y: -2, y2: 10, g: 'a' },\n    { x: 'neg/neg', y: -8, y2: 10, g: 'b' },\n  ];\n\n  const useMultipleY = boolean('use multiple Y accessors', false);\n  const data = boolean('use computeRatioByGroups fn', false)\n    ? computeRatioByGroups(\n        originalData,\n        ['x'],\n        useMultipleY\n          ? [\n              [(d) => d.y, (d, v) => ({ ...d, y: v })],\n              [(d) => d.y2, (d, v) => ({ ...d, y2: v })],\n            ]\n          : [[(d) => d.y, (d, v) => ({ ...d, y: v })]],\n      )\n    : originalData;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n\n      <Axis\n        id=\"left2\"\n        position={Position.Left}\n        gridLine={{\n          visible: true,\n          stroke: 'rgba(128,128,128,0.5)',\n          strokeWidth: 0.5,\n        }}\n        ticks={5}\n        style={{ axisLine: { visible: false }, tickLine: { visible: false }, tickLabel: { padding: 5 } }}\n        tickFormat={(d: any) => (modes === 'stackAsPercentage' ? `${Number(d * 100).toFixed(0)} %` : `${d}`)}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={useMultipleY ? ['y', 'y2'] : ['y']}\n        stackAccessors={stack}\n        stackMode={stack && stackMode}\n        splitSeriesAccessors={['g']}\n        data={data}\n      />\n      <LineAnnotation dataValues={[{ dataValue: 0 }]} id=\"baseline\" domainType={AnnotationDomainType.YDomain} />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const modes = select(\\n    'mode',\\n    { stack: 'stack', stackAsPercentage: 'stackAsPercentage', unstacked: 'unstacked' },\\n    'stackAsPercentage',\\n  );\\n  const stack = modes !== 'unstacked' ? ['x'] : undefined;\\n  const stackMode = modes === 'stackAsPercentage' ? StackMode.Percentage : undefined;\\n\\n  const originalData = [\\n    { x: 'pos/neg', y: -10, y2: 10, g: 'a' },\\n    { x: 'pos/neg', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'zero/zero', y: 0, y2: 10, g: 'a' },\\n    { x: 'zero/zero', y: 0, y2: 10, g: 'b' },\\n\\n    { x: 'zero/pos', y: 0, y2: 10, g: 'a' },\\n    { x: 'zero/pos', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'null/pos', y: null, y2: 10, g: 'a' },\\n    { x: 'null/pos', y: 10, y2: 10, g: 'b' },\\n\\n    { x: 'pos/pos', y: 2, y2: 10, g: 'a' },\\n    { x: 'pos/pos', y: 8, y2: 10, g: 'b' },\\n\\n    { x: 'neg/neg', y: -2, y2: 10, g: 'a' },\\n    { x: 'neg/neg', y: -8, y2: 10, g: 'b' },\\n  ];\\n\\n  const useMultipleY = boolean('use multiple Y accessors', false);\\n  const data = boolean('use computeRatioByGroups fn', false)\\n    ? computeRatioByGroups(\\n        originalData,\\n        ['x'],\\n        useMultipleY\\n          ? [\\n              [(d) => d.y, (d, v) => ({ ...d, y: v })],\\n              [(d) => d.y2, (d, v) => ({ ...d, y2: v })],\\n            ]\\n          : [[(d) => d.y, (d, v) => ({ ...d, y: v })]],\\n      )\\n    : originalData;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n\\n      <Axis\\n        id=\\\"left2\\\"\\n        position={Position.Left}\\n        gridLine={{\\n          visible: true,\\n          stroke: 'rgba(128,128,128,0.5)',\\n          strokeWidth: 0.5,\\n        }}\\n        ticks={5}\\n        style={{ axisLine: { visible: false }, tickLine: { visible: false }, tickLabel: { padding: 5 } }}\\n        tickFormat={(d: any) => (modes === 'stackAsPercentage' ? `${Number(d * 100).toFixed(0)} %` : `${d}`)}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={useMultipleY ? ['y', 'y2'] : ['y']}\\n        stackAccessors={stack}\\n        stackMode={stack && stackMode}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n      <LineAnnotation dataValues={[{ dataValue: 0 }]} id=\\\"baseline\\\" domainType={AnnotationDomainType.YDomain} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    scales: {\\n      histogramPadding: number('histogram padding', 0.05, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n      barsPadding: number('bar padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        rotation={customKnobs.enum.rotation()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={[\\n          { x: 0, y: 2, g: 'a' },\\n          { x: 1, y: 7, g: 'a' },\\n          { x: 2, y: 3, g: 'a' },\\n          { x: 3, y: 6, g: 'a' },\\n          { x: 0, y: 4, g: 'b' },\\n          { x: 1, y: 5, g: 'b' },\\n          { x: 2, y: 8, g: 'b' },\\n          { x: 3, y: 2, g: 'b' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":68},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":68}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    scales: {\n      histogramPadding: number('histogram padding', 0.05, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      }),\n      barsPadding: number('bar padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      }),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        rotation={customKnobs.enum.rotation()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={[\n          { x: 0, y: 2, g: 'a' },\n          { x: 1, y: 7, g: 'a' },\n          { x: 2, y: 3, g: 'a' },\n          { x: 3, y: 6, g: 'a' },\n          { x: 0, y: 4, g: 'b' },\n          { x: 1, y: 5, g: 'b' },\n          { x: 2, y: 8, g: 'b' },\n          { x: 3, y: 2, g: 'b' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    scales: {\\n      histogramPadding: number('histogram padding', 0.05, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n      barsPadding: number('bar padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        rotation={customKnobs.enum.rotation()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={[\\n          { x: 0, y: 2, g: 'a' },\\n          { x: 1, y: 7, g: 'a' },\\n          { x: 2, y: 3, g: 'a' },\\n          { x: 3, y: 6, g: 'a' },\\n          { x: 0, y: 4, g: 'b' },\\n          { x: 1, y: 5, g: 'b' },\\n          { x: 2, y: 8, g: 'b' },\\n          { x: 3, y: 2, g: 'b' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"elements\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"count\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bar series 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <BarSeries\\n      id=\\\"bar series 2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n    <BarSeries\\n      id=\\\"bar series 3\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 1, g: 'a' },\\n        { x: 1, y: 2, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 4, g: 'a' },\\n        { x: 0, y: 5, g: 'b' },\\n        { x: 1, y: 8, g: 'b' },\\n        { x: 2, y: 9, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":67},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":67}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"elements\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"count\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bar series 1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <BarSeries\n      id=\"bar series 2\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n    <BarSeries\n      id=\"bar series 3\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      data={[\n        { x: 0, y: 1, g: 'a' },\n        { x: 1, y: 2, g: 'a' },\n        { x: 2, y: 3, g: 'a' },\n        { x: 3, y: 4, g: 'a' },\n        { x: 0, y: 5, g: 'b' },\n        { x: 1, y: 8, g: 'b' },\n        { x: 2, y: 9, g: 'b' },\n        { x: 3, y: 2, g: 'b' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"elements\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"count\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bar series 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <BarSeries\\n      id=\\\"bar series 2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n    <BarSeries\\n      id=\\\"bar series 3\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 1, g: 'a' },\\n        { x: 1, y: 2, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 4, g: 'a' },\\n        { x: 0, y: 5, g: 'b' },\\n        { x: 1, y: 8, g: 'b' },\\n        { x: 2, y: 9, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":68},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":68}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\n        tickFormat={formatter}\n      />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      />\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n      />\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  CustomTooltip,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  Tooltip,\\n  TooltipContainer,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst CustomTooltipWithSubChart: CustomTooltip = ({ values }) => {\\n  const [value] = values.filter((v) => v.isHighlighted);\\n  return (\\n    <TooltipContainer>\\n      <div style={{ padding: 10 }}>Hovering: {value.label}</div>\\n    </TooltipContainer>\\n  );\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useCustomTooltip = boolean('Use custom tooltip', false);\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n\\n      {useCustomTooltip && <Tooltip customTooltip={CustomTooltipWithSubChart} type=\\\"follow\\\" />}\\n\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":39},\"endLoc\":{\"col\":1,\"line\":87},\"startBody\":{\"col\":36,\"line\":39},\"endBody\":{\"col\":1,\"line\":87}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  CustomTooltip,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  Tooltip,\n  TooltipContainer,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst CustomTooltipWithSubChart: CustomTooltip = ({ values }) => {\n  const [value] = values.filter((v) => v.isHighlighted);\n  return (\n    <TooltipContainer>\n      <div style={{ padding: 10 }}>Hovering: {value.label}</div>\n    </TooltipContainer>\n  );\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useCustomTooltip = boolean('Use custom tooltip', false);\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n\n      {useCustomTooltip && <Tooltip customTooltip={CustomTooltipWithSubChart} type=\"follow\" />}\n\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\n        tickFormat={formatter}\n      />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\n      />\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\n      />\n      <BarSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useCustomTooltip = boolean('Use custom tooltip', false);\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n\\n      {useCustomTooltip && <Tooltip customTooltip={CustomTooltipWithSubChart} type=\\\"follow\\\" />}\\n\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\\n      />\\n      <BarSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={TestDatasets.BARCHART_1Y0G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":32},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":32}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={TestDatasets.BARCHART_1Y0G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={TestDatasets.BARCHART_1Y0G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={TestDatasets.BARCHART_1Y1G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":33},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":33}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      data={TestDatasets.BARCHART_1Y1G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={TestDatasets.BARCHART_1Y1G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { BarSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const toggleSpec = boolean('toggle bar spec', true);\\n  const data1 = [\\n    { x: 0, y: 2 },\\n    { x: 1, y: 7 },\\n    { x: 2, y: 3 },\\n    { x: 3, y: 6 },\\n  ];\\n  const data2 = data1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const data = toggleSpec ? data1 : data2;\\n  const specId = toggleSpec ? 'bars1' : 'bars2';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <BarSeries\\n        id={specId}\\n        name=\\\"Simple bar series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { BarSeries, Chart, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const toggleSpec = boolean('toggle bar spec', true);\n  const data1 = [\n    { x: 0, y: 2 },\n    { x: 1, y: 7 },\n    { x: 2, y: 3 },\n    { x: 3, y: 6 },\n  ];\n  const data2 = data1.map((datum) => ({ ...datum, y: datum.y - 1 }));\n  const data = toggleSpec ? data1 : data2;\n  const specId = toggleSpec ? 'bars1' : 'bars2';\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <BarSeries\n        id={specId}\n        name=\"Simple bar series\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const toggleSpec = boolean('toggle bar spec', true);\\n  const data1 = [\\n    { x: 0, y: 2 },\\n    { x: 1, y: 7 },\\n    { x: 2, y: 3 },\\n    { x: 3, y: 6 },\\n  ];\\n  const data2 = data1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const data = toggleSpec ? data1 : data2;\\n  const specId = toggleSpec ? 'bars1' : 'bars2';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <BarSeries\\n        id={specId}\\n        name=\\\"Simple bar series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      data={TestDatasets.BARCHART_1Y2G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":33},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":33}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g1', 'g2']}\n      data={TestDatasets.BARCHART_1Y2G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      data={TestDatasets.BARCHART_1Y2G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      data={TestDatasets.BARCHART_2Y0G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":32},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":32}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y1', 'y2']}\n      data={TestDatasets.BARCHART_2Y0G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      data={TestDatasets.BARCHART_2Y0G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      splitSeriesAccessors={['g']}\\n      data={TestDatasets.BARCHART_2Y1G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":33},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":33}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y1', 'y2']}\n      splitSeriesAccessors={['g']}\n      data={TestDatasets.BARCHART_2Y1G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      splitSeriesAccessors={['g']}\\n      data={TestDatasets.BARCHART_2Y1G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      data={TestDatasets.BARCHART_2Y2G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":32},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":32}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n    <BarSeries\n      id=\"bars1\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y1', 'y2']}\n      splitSeriesAccessors={['g1', 'g2']}\n      data={TestDatasets.BARCHART_2Y2G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n    <BarSeries\\n      id=\\\"bars1\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1', 'y2']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      data={TestDatasets.BARCHART_2Y2G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, FilterPredicate } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const isVisibleFunction: FilterPredicate = (series) => series.splitAccessors.get('g1') === 'cloudflare.com';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n        filterSeriesInTooltip={isVisibleFunction}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, FilterPredicate } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const isVisibleFunction: FilterPredicate = (series) => series.splitAccessors.get('g1') === 'cloudflare.com';\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        data={TestDatasets.BARCHART_2Y2G}\n        filterSeriesInTooltip={isVisibleFunction}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const isVisibleFunction: FilterPredicate = (series) => series.splitAccessors.get('g1') === 'cloudflare.com';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n        filterSeriesInTooltip={isVisibleFunction}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const dg = new SeededDataGenerator();\\n  const data = dg.generateSimpleSeries(15000);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Tooltip type={TooltipType.Follow} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const dg = new SeededDataGenerator();\n  const data = dg.generateSimpleSeries(15000);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Tooltip type={TooltipType.Follow} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const dg = new SeededDataGenerator();\\n  const data = dg.generateSimpleSeries(15000);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Tooltip type={TooltipType.Follow} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hasCustomDomain = boolean('has custom domain', false);\\n  const xDomain = hasCustomDomain\\n    ? {\\n        min: 0,\\n        max: NaN,\\n      }\\n    : undefined;\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 1, y: 10 }]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hasCustomDomain = boolean('has custom domain', false);\n  const xDomain = hasCustomDomain\n    ? {\n        min: 0,\n        max: NaN,\n      }\n    : undefined;\n\n  const theme: PartialTheme = {\n    scales: {\n      barsPadding: number('bars padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[{ x: 1, y: 10 }]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hasCustomDomain = boolean('has custom domain', false);\\n  const xDomain = hasCustomDomain\\n    ? {\\n        min: 0,\\n        max: NaN,\\n      }\\n    : undefined;\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 1, y: 10 }]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hasCustomDomain = boolean('has custom domain', false);\\n  const xDomain = hasCustomDomain ? ['a', 'b'] : undefined;\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 'a', y: 10, g: 1 }]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hasCustomDomain = boolean('has custom domain', false);\n  const xDomain = hasCustomDomain ? ['a', 'b'] : undefined;\n\n  const theme: PartialTheme = {\n    scales: {\n      barsPadding: number('bars padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[{ x: 'a', y: 10, g: 1 }]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hasCustomDomain = boolean('has custom domain', false);\\n  const xDomain = hasCustomDomain ? ['a', 'b'] : undefined;\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[{ x: 'a', y: 10, g: 1 }]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 1, y: 10, g: 'a' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 1, y: 3, g: 'c' },\\n        { x: 1, y: 10, g: 'd' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      data={[\n        { x: 1, y: 10, g: 'a' },\n        { x: 1, y: 5, g: 'b' },\n        { x: 1, y: 3, g: 'c' },\n        { x: 1, y: 10, g: 'd' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 1, y: 10, g: 'a' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 1, y: 3, g: 'c' },\\n        { x: 1, y: 10, g: 'd' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 1, y: 10, g: 'a' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 1, y: 3, g: 'c' },\\n        { x: 1, y: 10, g: 'd' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":38},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":38}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      stackAccessors={['x']}\n      data={[\n        { x: 1, y: 10, g: 'a' },\n        { x: 1, y: 5, g: 'b' },\n        { x: 1, y: 3, g: 'c' },\n        { x: 1, y: 10, g: 'd' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 1, y: 10, g: 'a' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 1, y: 3, g: 'c' },\\n        { x: 1, y: 10, g: 'd' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  DisplayValueSpec,\\n  LabelOverflowConstraint,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  PartialTheme,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dataGen = new SeededDataGenerator();\\nfunction generateDataWithAdditional(num: number) {\\n  return [...dataGen.generateSimpleSeries(num), { x: num, y: 0.25, g: 0 }, { x: num + 1, y: 8, g: 0 }];\\n}\\nconst frozenDataSmallVolume = generateDataWithAdditional(5);\\nconst frozenDataMediumVolume = generateDataWithAdditional(30);\\nconst frozenDataHighVolume = generateDataWithAdditional(500);\\n\\nconst frozenData: { [key: string]: any[] } = {\\n  s: frozenDataSmallVolume,\\n  m: frozenDataMediumVolume,\\n  h: frozenDataHighVolume,\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const singleSeries = boolean('show single series', false);\\n  const showValueLabel = boolean('show value label', true);\\n  const isAlternatingValueLabel = boolean('alternating value label', false);\\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\\n  if (overflowChartEdges) {\\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\\n  }\\n  if (overflowBarGeometry) {\\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\\n  }\\n  const displayValueSettings = {\\n    showValueLabel,\\n    isAlternatingValueLabel,\\n    overflowConstraints,\\n  };\\n\\n  const debug = boolean('debug', false);\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: Number(number('value font size', 10)),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: 0,\\n        fill: color('value color', '#000'),\\n        offsetX: Number(number('offsetX', 0)),\\n        offsetY: Number(number('offsetY', 0)),\\n      },\\n    },\\n  };\\n\\n  const dataSize = select(\\n    'data volume size',\\n    {\\n      'small volume': 's',\\n      'medium volume': 'm',\\n      'high volume': 'h',\\n    },\\n    's',\\n  );\\n  const data = frozenData[dataSize];\\n\\n  const isSplitSeries = boolean('split series', false);\\n  const isStackedSeries = boolean('stacked series', false);\\n\\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n        rotation={customKnobs.enum.rotation()}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position('legend')}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n      />\\n      {!singleSeries && (\\n        <BarSeries\\n          id=\\\"bars2\\\"\\n          displayValueSettings={displayValueSettings}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={['x']}\\n          splitSeriesAccessors={['g']}\\n          data={[\\n            { x: 0, y: 2, g: 'a' },\\n            { x: 1, y: 7, g: 'a' },\\n            { x: 2, y: 3, g: 'a' },\\n            { x: 3, y: 6, g: 'a' },\\n            { x: 0, y: 4, g: 'b' },\\n            { x: 1, y: 5, g: 'b' },\\n            { x: 2, y: 8, g: 'b' },\\n            { x: 3, y: 2, g: 'b' },\\n          ]}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":43},\"endLoc\":{\"col\":1,\"line\":142},\"startBody\":{\"col\":36,\"line\":43},\"endBody\":{\"col\":1,\"line\":142}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  DisplayValueSpec,\n  LabelOverflowConstraint,\n  Position,\n  ScaleType,\n  Settings,\n  PartialTheme,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dataGen = new SeededDataGenerator();\nfunction generateDataWithAdditional(num: number) {\n  return [...dataGen.generateSimpleSeries(num), { x: num, y: 0.25, g: 0 }, { x: num + 1, y: 8, g: 0 }];\n}\nconst frozenDataSmallVolume = generateDataWithAdditional(5);\nconst frozenDataMediumVolume = generateDataWithAdditional(30);\nconst frozenDataHighVolume = generateDataWithAdditional(500);\n\nconst frozenData: { [key: string]: any[] } = {\n  s: frozenDataSmallVolume,\n  m: frozenDataMediumVolume,\n  h: frozenDataHighVolume,\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const singleSeries = boolean('show single series', false);\n  const showValueLabel = boolean('show value label', true);\n  const isAlternatingValueLabel = boolean('alternating value label', false);\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\n  if (overflowChartEdges) {\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\n  }\n  if (overflowBarGeometry) {\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\n  }\n  const displayValueSettings = {\n    showValueLabel,\n    isAlternatingValueLabel,\n    overflowConstraints,\n  };\n\n  const debug = boolean('debug', false);\n\n  const theme: PartialTheme = {\n    barSeriesStyle: {\n      displayValue: {\n        fontSize: Number(number('value font size', 10)),\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        fontStyle: 'normal',\n        padding: 0,\n        fill: color('value color', '#000'),\n        offsetX: Number(number('offsetX', 0)),\n        offsetY: Number(number('offsetY', 0)),\n      },\n    },\n  };\n\n  const dataSize = select(\n    'data volume size',\n    {\n      'small volume': 's',\n      'medium volume': 'm',\n      'high volume': 'h',\n    },\n    's',\n  );\n  const data = frozenData[dataSize];\n\n  const isSplitSeries = boolean('split series', false);\n  const isStackedSeries = boolean('stacked series', false);\n\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={debug}\n        rotation={customKnobs.enum.rotation()}\n        showLegend\n        showLegendExtra\n        legendPosition={customKnobs.enum.position('legend')}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        displayValueSettings={displayValueSettings}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={splitSeriesAccessors}\n        stackAccessors={stackAccessors}\n        data={data}\n      />\n      {!singleSeries && (\n        <BarSeries\n          id=\"bars2\"\n          displayValueSettings={displayValueSettings}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          stackAccessors={['x']}\n          splitSeriesAccessors={['g']}\n          data={[\n            { x: 0, y: 2, g: 'a' },\n            { x: 1, y: 7, g: 'a' },\n            { x: 2, y: 3, g: 'a' },\n            { x: 3, y: 6, g: 'a' },\n            { x: 0, y: 4, g: 'b' },\n            { x: 1, y: 5, g: 'b' },\n            { x: 2, y: 8, g: 'b' },\n            { x: 3, y: 2, g: 'b' },\n          ]}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const singleSeries = boolean('show single series', false);\\n  const showValueLabel = boolean('show value label', true);\\n  const isAlternatingValueLabel = boolean('alternating value label', false);\\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\\n  if (overflowChartEdges) {\\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\\n  }\\n  if (overflowBarGeometry) {\\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\\n  }\\n  const displayValueSettings = {\\n    showValueLabel,\\n    isAlternatingValueLabel,\\n    overflowConstraints,\\n  };\\n\\n  const debug = boolean('debug', false);\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: Number(number('value font size', 10)),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: 0,\\n        fill: color('value color', '#000'),\\n        offsetX: Number(number('offsetX', 0)),\\n        offsetY: Number(number('offsetY', 0)),\\n      },\\n    },\\n  };\\n\\n  const dataSize = select(\\n    'data volume size',\\n    {\\n      'small volume': 's',\\n      'medium volume': 'm',\\n      'high volume': 'h',\\n    },\\n    's',\\n  );\\n  const data = frozenData[dataSize];\\n\\n  const isSplitSeries = boolean('split series', false);\\n  const isStackedSeries = boolean('stacked series', false);\\n\\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n        rotation={customKnobs.enum.rotation()}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position('legend')}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n      />\\n      {!singleSeries && (\\n        <BarSeries\\n          id=\\\"bars2\\\"\\n          displayValueSettings={displayValueSettings}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={['x']}\\n          splitSeriesAccessors={['g']}\\n          data={[\\n            { x: 0, y: 2, g: 'a' },\\n            { x: 1, y: 7, g: 'a' },\\n            { x: 2, y: 3, g: 'a' },\\n            { x: 3, y: 6, g: 'a' },\\n            { x: 0, y: 4, g: 'b' },\\n            { x: 1, y: 5, g: 'b' },\\n            { x: 2, y: 8, g: 'b' },\\n            { x: 3, y: 2, g: 'b' },\\n          ]}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fit = boolean('fit Y domain to data', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis\\n        id=\\\"left2\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 10, g: 'a' },\\n          { x: 0, y: 20, g: 'b' },\\n          { x: 0, y: 30, g: 'c' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fit = boolean('fit Y domain to data', true);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis\n        id=\"left2\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n        }}\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 10, g: 'a' },\n          { x: 0, y: 20, g: 'b' },\n          { x: 0, y: 30, g: 'c' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fit = boolean('fit Y domain to data', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis\\n        id=\\\"left2\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 10, g: 'a' },\\n          { x: 0, y: 20, g: 'b' },\\n          { x: 0, y: 30, g: 'c' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: -3, y: 1 },\\n        { x: 0, y: 4 },\\n        { x: -2, y: 2 },\\n        { x: 1, y: 3 },\\n        { x: 2, y: 2 },\\n        { x: -1, y: 3 },\\n        { x: 3, y: 1 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: -3, y: 1 },\n        { x: 0, y: 4 },\n        { x: -2, y: 2 },\n        { x: 1, y: 3 },\n        { x: 2, y: 2 },\n        { x: -1, y: 3 },\n        { x: 3, y: 1 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: -3, y: 1 },\\n        { x: 0, y: 4 },\\n        { x: -2, y: 2 },\\n        { x: 1, y: 3 },\\n        { x: 2, y: 2 },\\n        { x: -1, y: 3 },\\n        { x: 3, y: 1 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, DomainPaddingUnit, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { computeContinuousDataDomain } from '@elastic/charts/src/utils/domain';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst logDomains = (data: any[], customDomain: any) => {\\n  const dataY = data.map((d) => d.y);\\n  \\n  console.clear();\\n  console.log('data domain:', JSON.stringify(computeContinuousDataDomain(dataY, ScaleType.Linear, undefined)));\\n  console.log('computed domain:', JSON.stringify(computeContinuousDataDomain(dataY, ScaleType.Linear, customDomain)));\\n  \\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fit = boolean('fit Y domain to data', true);\\n  const constrainPadding = boolean('constrain padding', true);\\n  const nice = boolean('nice ticks', false);\\n  const padding = number('domain padding', 0);\\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.Domain);\\n  const mixed = [\\n    { x: 0, y: -4 },\\n    { x: 1, y: -3 },\\n    { x: 2, y: 2 },\\n    { x: 3, y: 1 },\\n  ];\\n\\n  const allPositive = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) }));\\n  const allNegative = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) * -1 }));\\n\\n  const dataChoice = select(\\n    'data',\\n    {\\n      mixed: 'mixed',\\n      allPositive: 'all positive',\\n      allNegative: 'all negative',\\n    },\\n    'all negative',\\n  );\\n  const [SeriesType] = customKnobs.enum.xySeries();\\n  const shouldLogDomains = boolean('console log domains', true);\\n\\n  let data;\\n  switch (dataChoice) {\\n    case 'all positive':\\n      data = allPositive;\\n      break;\\n    case 'all negative':\\n      data = allNegative;\\n      break;\\n    default:\\n      data = mixed;\\n  }\\n  const customDomain = { fit, padding, paddingUnit, constrainPadding, nice, min: NaN, max: NaN };\\n\\n  if (shouldLogDomains) {\\n    logDomains(data, customDomain);\\n  }\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={customDomain}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <SeriesType\\n        id=\\\"series\\\"\\n        yNice={nice}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":97},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":97}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, DomainPaddingUnit, Position, ScaleType, Settings } from '@elastic/charts';\nimport { computeContinuousDataDomain } from '@elastic/charts/src/utils/domain';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst logDomains = (data: any[], customDomain: any) => {\n  const dataY = data.map((d) => d.y);\n  /* eslint-disable no-console */\n  console.clear();\n  console.log('data domain:', JSON.stringify(computeContinuousDataDomain(dataY, ScaleType.Linear, undefined)));\n  console.log('computed domain:', JSON.stringify(computeContinuousDataDomain(dataY, ScaleType.Linear, customDomain)));\n  /* eslint-enable */\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fit = boolean('fit Y domain to data', true);\n  const constrainPadding = boolean('constrain padding', true);\n  const nice = boolean('nice ticks', false);\n  const padding = number('domain padding', 0);\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.Domain);\n  const mixed = [\n    { x: 0, y: -4 },\n    { x: 1, y: -3 },\n    { x: 2, y: 2 },\n    { x: 3, y: 1 },\n  ];\n\n  const allPositive = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) }));\n  const allNegative = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) * -1 }));\n\n  const dataChoice = select(\n    'data',\n    {\n      mixed: 'mixed',\n      allPositive: 'all positive',\n      allNegative: 'all negative',\n    },\n    'all negative',\n  );\n  const [SeriesType] = customKnobs.enum.xySeries();\n  const shouldLogDomains = boolean('console log domains', true);\n\n  let data;\n  switch (dataChoice) {\n    case 'all positive':\n      data = allPositive;\n      break;\n    case 'all negative':\n      data = allNegative;\n      break;\n    default:\n      data = mixed;\n  }\n  const customDomain = { fit, padding, paddingUnit, constrainPadding, nice, min: NaN, max: NaN };\n\n  if (shouldLogDomains) {\n    logDomains(data, customDomain);\n  }\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" />\n      <Axis\n        id=\"left\"\n        domain={customDomain}\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n\n      <SeriesType\n        id=\"series\"\n        yNice={nice}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fit = boolean('fit Y domain to data', true);\\n  const constrainPadding = boolean('constrain padding', true);\\n  const nice = boolean('nice ticks', false);\\n  const padding = number('domain padding', 0);\\n  const paddingUnit = customKnobs.fromEnum('Domain padding unit', DomainPaddingUnit, DomainPaddingUnit.Domain);\\n  const mixed = [\\n    { x: 0, y: -4 },\\n    { x: 1, y: -3 },\\n    { x: 2, y: 2 },\\n    { x: 3, y: 1 },\\n  ];\\n\\n  const allPositive = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) }));\\n  const allNegative = mixed.map((datum) => ({ x: datum.x, y: Math.abs(datum.y) * -1 }));\\n\\n  const dataChoice = select(\\n    'data',\\n    {\\n      mixed: 'mixed',\\n      allPositive: 'all positive',\\n      allNegative: 'all negative',\\n    },\\n    'all negative',\\n  );\\n  const [SeriesType] = customKnobs.enum.xySeries();\\n  const shouldLogDomains = boolean('console log domains', true);\\n\\n  let data;\\n  switch (dataChoice) {\\n    case 'all positive':\\n      data = allPositive;\\n      break;\\n    case 'all negative':\\n      data = allNegative;\\n      break;\\n    default:\\n      data = mixed;\\n  }\\n  const customDomain = { fit, padding, paddingUnit, constrainPadding, nice, min: NaN, max: NaN };\\n\\n  if (shouldLogDomains) {\\n    logDomains(data, customDomain);\\n  }\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={customDomain}\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <SeriesType\\n        id=\\\"series\\\"\\n        yNice={nice}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm:ss');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const getRandomNumber = getRandomNumberGenerator();\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => ({\\n    x: d[0],\\n    max: d[1] + 4 + 4 * getRandomNumber(),\\n    min: d[1] - 4 - 4 * getRandomNumber(),\\n  }));\\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => [d[0], d[1]]);\\n  const fit = boolean('fit Y domain', true);\\n  const useFunctions = boolean('use fn accessors', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={[useFunctions ? (d) => d.max : 'max']}\\n        y0Accessors={[useFunctions ? (d) => d.min : 'min']}\\n        data={data}\\n      />\\n\\n      <LineSeries\\n        id=\\\"average\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={lineData}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm:ss');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const getRandomNumber = getRandomNumberGenerator();\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => ({\n    x: d[0],\n    max: d[1] + 4 + 4 * getRandomNumber(),\n    min: d[1] - 4 - 4 * getRandomNumber(),\n  }));\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => [d[0], d[1]]);\n  const fit = boolean('fit Y domain', true);\n  const useFunctions = boolean('use fn accessors', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"timestamp per 1 minute\"\n        position={Position.Bottom}\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis\n        id=\"left\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit,\n        }}\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={[useFunctions ? (d) => d.max : 'max']}\n        y0Accessors={[useFunctions ? (d) => d.min : 'min']}\n        data={data}\n      />\n\n      <LineSeries\n        id=\"average\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={lineData}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const getRandomNumber = getRandomNumberGenerator();\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => ({\\n    x: d[0],\\n    max: d[1] + 4 + 4 * getRandomNumber(),\\n    min: d[1] - 4 - 4 * getRandomNumber(),\\n  }));\\n  const lineData = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d: any) => [d[0], d[1]]);\\n  const fit = boolean('fit Y domain', true);\\n  const useFunctions = boolean('use fn accessors', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit,\\n        }}\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={[useFunctions ? (d) => d.max : 'max']}\\n        y0Accessors={[useFunctions ? (d) => d.min : 'min']}\\n        data={data}\\n      />\\n\\n      <LineSeries\\n        id=\\\"average\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={lineData}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm:ss');\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1],\\n    [start.plus({ minute: 1 }).toMillis(), 2],\\n    [start.plus({ minute: 2 }).toMillis(), 3],\\n    [start.plus({ minute: 3 }).toMillis(), 4],\\n    [start.plus({ minute: 4 }).toMillis(), 5],\\n    [start.plus({ minute: 5 }).toMillis(), 4],\\n    [start.plus({ minute: 6 }).toMillis(), 3],\\n    [start.plus({ minute: 7 }).toMillis(), 2],\\n    [start.plus({ minute: 8 }).toMillis(), 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm:ss');\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data = [\n    [start.toMillis(), 1],\n    [start.plus({ minute: 1 }).toMillis(), 2],\n    [start.plus({ minute: 2 }).toMillis(), 3],\n    [start.plus({ minute: 3 }).toMillis(), 4],\n    [start.plus({ minute: 4 }).toMillis(), 5],\n    [start.plus({ minute: 5 }).toMillis(), 4],\n    [start.plus({ minute: 6 }).toMillis(), 3],\n    [start.plus({ minute: 7 }).toMillis(), 2],\n    [start.plus({ minute: 8 }).toMillis(), 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"data\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1],\\n    [start.plus({ minute: 1 }).toMillis(), 2],\\n    [start.plus({ minute: 2 }).toMillis(), 3],\\n    [start.plus({ minute: 3 }).toMillis(), 4],\\n    [start.plus({ minute: 4 }).toMillis(), 5],\\n    [start.plus({ minute: 5 }).toMillis(), 4],\\n    [start.plus({ minute: 6 }).toMillis(), 3],\\n    [start.plus({ minute: 7 }).toMillis(), 2],\\n    [start.plus({ minute: 8 }).toMillis(), 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data9 = [\\n    [1, 1, 3],\\n    [2, 2, 4],\\n    [3, 3, 5],\\n    [4, 4, 6],\\n    [5, 5, 7],\\n    [6, 4, 6],\\n    [7, 3, 5],\\n    [8, 2, 4],\\n    [9, 1, 3],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1, 2]}\\n        data={data9}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data9 = [\n    [1, 1, 3],\n    [2, 2, 4],\n    [3, 3, 5],\n    [4, 4, 6],\n    [5, 5, 7],\n    [6, 4, 6],\n    [7, 3, 5],\n    [8, 2, 4],\n    [9, 1, 3],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1, 2]}\n        data={data9}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data9 = [\\n    [1, 1, 3],\\n    [2, 2, 4],\\n    [3, 3, 5],\\n    [4, 4, 6],\\n    [5, 5, 7],\\n    [6, 4, 6],\\n    [7, 3, 5],\\n    [8, 2, 4],\\n    [9, 1, 3],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1, 2]}\\n        data={data9}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm:ss');\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1, 2]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, timeFormatter } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm:ss');\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data = [\n    [start.toMillis(), 1, 4],\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"data\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1, 2]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"data\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1, 2]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    [1, 1, 3, 'a'],\\n    [2, null, 4, 'a'],\\n    [3, 3, 5, 'a'],\\n    [4, 4, 6, 'a'],\\n    [1, 1, 3, 'b'],\\n    [2, 2, 4, 'b'],\\n    [3, 3, 5, 'b'],\\n    [4, 4, 6, 'b'],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[3]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    [1, 1, 3, 'a'],\n    [2, null, 4, 'a'],\n    [3, 3, 5, 'a'],\n    [4, 4, 6, 'a'],\n    [1, 1, 3, 'b'],\n    [2, 2, 4, 'b'],\n    [3, 3, 5, 'b'],\n    [4, 4, 6, 'b'],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        splitSeriesAccessors={[3]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    [1, 1, 3, 'a'],\\n    [2, null, 4, 'a'],\\n    [3, 3, 5, 'a'],\\n    [4, 4, 6, 'a'],\\n    [1, 1, 3, 'b'],\\n    [2, 2, 4, 'b'],\\n    [3, 3, 5, 'b'],\\n    [4, 4, 6, 'b'],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[3]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, StackMode } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    [1, 1, 3, 'a'],\\n    [2, null, 4, 'a'],\\n    [3, 3, 5, 'a'],\\n    [4, 4, 6, 'a'],\\n    [1, 1, 3, 'b'],\\n    [2, 2, 4, 'b'],\\n    [3, null, 5, 'b'],\\n    [4, 4, 6, 'b'],\\n  ];\\n  const stackMode = boolean('stack as percentage', false) ? StackMode.Percentage : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[3]}\\n        stackAccessors={[0]}\\n        stackMode={stackMode}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, StackMode } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    [1, 1, 3, 'a'],\n    [2, null, 4, 'a'],\n    [3, 3, 5, 'a'],\n    [4, 4, 6, 'a'],\n    [1, 1, 3, 'b'],\n    [2, 2, 4, 'b'],\n    [3, null, 5, 'b'],\n    [4, 4, 6, 'b'],\n  ];\n  const stackMode = boolean('stack as percentage', false) ? StackMode.Percentage : undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        splitSeriesAccessors={[3]}\n        stackAccessors={[0]}\n        stackMode={stackMode}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    [1, 1, 3, 'a'],\\n    [2, null, 4, 'a'],\\n    [3, 3, 5, 'a'],\\n    [4, 4, 6, 'a'],\\n    [1, 1, 3, 'b'],\\n    [2, 2, 4, 'b'],\\n    [3, null, 5, 'b'],\\n    [4, 4, 6, 'b'],\\n  ];\\n  const stackMode = boolean('stack as percentage', false) ? StackMode.Percentage : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[3]}\\n        stackAccessors={[0]}\\n        stackMode={stackMode}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":38},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":38}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={select(\\n        'scaleType',\\n        {\\n          linear: ScaleType.Linear,\\n          ordinal: ScaleType.Ordinal,\\n        },\\n        ScaleType.Linear,\\n      )}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        // the data is not sorted to verify that the ordinal scale keeps the sorting and the labels are\\n        // correctly aligned see https://github.com/elastic/elastic-charts/issues/1608\\n        { x: 3, y: 6 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 0, y: 2 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={select(\n        'scaleType',\n        {\n          linear: ScaleType.Linear,\n          ordinal: ScaleType.Ordinal,\n        },\n        ScaleType.Linear,\n      )}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        // the data is not sorted to verify that the ordinal scale keeps the sorting and the labels are\n        // correctly aligned see https://github.com/elastic/elastic-charts/issues/1608\n        { x: 3, y: 6 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 0, y: 2 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={select(\\n        'scaleType',\\n        {\\n          linear: ScaleType.Linear,\\n          ordinal: ScaleType.Ordinal,\\n        },\\n        ScaleType.Linear,\\n      )}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        // the data is not sorted to verify that the ordinal scale keeps the sorting and the labels are\\n        // correctly aligned see https://github.com/elastic/elastic-charts/issues/1608\\n        { x: 3, y: 6 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 0, y: 2 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  AreaSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  HistogramBarSeries,\\n  HistogramModeAlignments,\\n  LineAnnotation,\\n  LineSeries,\\n  PartialTheme,\\n  Position,\\n  RectAnnotation,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = TestDatasets.BARCHART_2Y1G;\\n\\n  const lineAnnotationStyle = {\\n    line: {\\n      strokeWidth: 2,\\n      stroke: '#c80000',\\n      opacity: 0.3,\\n    },\\n  };\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n      histogramPadding: number('histogram padding', 0.05, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const otherSeriesSelection = select(\\n    'other series',\\n    {\\n      line: 'line',\\n      area: 'area',\\n    },\\n    'line',\\n  );\\n\\n  const pointAlignment = select('point series alignment', HistogramModeAlignments, HistogramModeAlignments.Center);\\n  const pointData = TestDatasets.BARCHART_1Y0G;\\n\\n  const otherSeries =\\n    otherSeriesSelection === 'line' ? (\\n      <LineSeries\\n        id=\\\"other-series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={pointData}\\n        histogramModeAlignment={pointAlignment}\\n      />\\n    ) : (\\n      <AreaSeries\\n        id=\\\"other-series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={pointData}\\n        histogramModeAlignment={pointAlignment}\\n      />\\n    );\\n\\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\\n  const stacked = boolean('stacked', true);\\n  const stackAccessors = stacked ? ['yes'] : [];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        theme={theme}\\n        debug={boolean('debug', true)}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <LineAnnotation\\n        id=\\\"line-annotation\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={[{ dataValue: 2 }, { dataValue: 2.5 }, { dataValue: 3.5 }]}\\n        style={lineAnnotationStyle}\\n        marker={<div style={{ background: 'red', width: 10, height: 10 }} />}\\n      />\\n      <RectAnnotation\\n        style={{\\n          fill: 'green',\\n        }}\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0.5,\\n            },\\n            details: 'min=0.5, max=max',\\n          },\\n        ]}\\n        id=\\\"rect1\\\"\\n      />\\n      <RectAnnotation\\n        style={{\\n          fill: 'red',\\n        }}\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x1: 3,\\n            },\\n            details: 'min=min, max=3',\\n          },\\n        ]}\\n        id=\\\"rect2\\\"\\n      />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title=\\\"left axis\\\" />\\n      <Axis id=\\\"discover-histogram-bottom-axis\\\" position={Position.Bottom} title=\\\"bottom axis\\\" />\\n      {hasHistogramBarSeries && (\\n        <HistogramBarSeries\\n          id=\\\"histo\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={stackAccessors}\\n          data={pointData}\\n          name=\\\"histogram\\\"\\n        />\\n      )}\\n      <BarSeries\\n        id=\\\"bars-1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stackAccessors}\\n        data={pointData}\\n        name=\\\"bars 1\\\"\\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\\n      />\\n      <BarSeries\\n        id=\\\"bars-2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\\n      />\\n      {otherSeries}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":183},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":183}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  AreaSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  HistogramBarSeries,\n  HistogramModeAlignments,\n  LineAnnotation,\n  LineSeries,\n  PartialTheme,\n  Position,\n  RectAnnotation,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = TestDatasets.BARCHART_2Y1G;\n\n  const lineAnnotationStyle = {\n    line: {\n      strokeWidth: 2,\n      stroke: '#c80000',\n      opacity: 0.3,\n    },\n  };\n\n  const theme: PartialTheme = {\n    scales: {\n      barsPadding: number('bars padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n      histogramPadding: number('histogram padding', 0.05, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n\n  const otherSeriesSelection = select(\n    'other series',\n    {\n      line: 'line',\n      area: 'area',\n    },\n    'line',\n  );\n\n  const pointAlignment = select('point series alignment', HistogramModeAlignments, HistogramModeAlignments.Center);\n  const pointData = TestDatasets.BARCHART_1Y0G;\n\n  const otherSeries =\n    otherSeriesSelection === 'line' ? (\n      <LineSeries\n        id=\"other-series\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={pointData}\n        histogramModeAlignment={pointAlignment}\n      />\n    ) : (\n      <AreaSeries\n        id=\"other-series\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={pointData}\n        histogramModeAlignment={pointAlignment}\n      />\n    );\n\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\n  const stacked = boolean('stacked', true);\n  const stackAccessors = stacked ? ['yes'] : [];\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        rotation={customKnobs.enum.rotation()}\n        theme={theme}\n        debug={boolean('debug', true)}\n        baseTheme={useBaseTheme()}\n      />\n      <LineAnnotation\n        id=\"line-annotation\"\n        domainType={AnnotationDomainType.XDomain}\n        dataValues={[{ dataValue: 2 }, { dataValue: 2.5 }, { dataValue: 3.5 }]}\n        style={lineAnnotationStyle}\n        marker={<div style={{ background: 'red', width: 10, height: 10 }} />}\n      />\n      <RectAnnotation\n        style={{\n          fill: 'green',\n        }}\n        dataValues={[\n          {\n            coordinates: {\n              x0: 0.5,\n            },\n            details: 'min=0.5, max=max',\n          },\n        ]}\n        id=\"rect1\"\n      />\n      <RectAnnotation\n        style={{\n          fill: 'red',\n        }}\n        dataValues={[\n          {\n            coordinates: {\n              x1: 3,\n            },\n            details: 'min=min, max=3',\n          },\n        ]}\n        id=\"rect2\"\n      />\n      <Axis id=\"discover-histogram-left-axis\" position={Position.Left} title=\"left axis\" />\n      <Axis id=\"discover-histogram-bottom-axis\" position={Position.Bottom} title=\"bottom axis\" />\n      {hasHistogramBarSeries && (\n        <HistogramBarSeries\n          id=\"histo\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          stackAccessors={stackAccessors}\n          data={pointData}\n          name=\"histogram\"\n        />\n      )}\n      <BarSeries\n        id=\"bars-1\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stackAccessors}\n        data={pointData}\n        name=\"bars 1\"\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\n      />\n      <BarSeries\n        id=\"bars-2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={stackAccessors}\n        data={data}\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\n      />\n      {otherSeries}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = TestDatasets.BARCHART_2Y1G;\\n\\n  const lineAnnotationStyle = {\\n    line: {\\n      strokeWidth: 2,\\n      stroke: '#c80000',\\n      opacity: 0.3,\\n    },\\n  };\\n\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n      histogramPadding: number('histogram padding', 0.05, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const otherSeriesSelection = select(\\n    'other series',\\n    {\\n      line: 'line',\\n      area: 'area',\\n    },\\n    'line',\\n  );\\n\\n  const pointAlignment = select('point series alignment', HistogramModeAlignments, HistogramModeAlignments.Center);\\n  const pointData = TestDatasets.BARCHART_1Y0G;\\n\\n  const otherSeries =\\n    otherSeriesSelection === 'line' ? (\\n      <LineSeries\\n        id=\\\"other-series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={pointData}\\n        histogramModeAlignment={pointAlignment}\\n      />\\n    ) : (\\n      <AreaSeries\\n        id=\\\"other-series\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={pointData}\\n        histogramModeAlignment={pointAlignment}\\n      />\\n    );\\n\\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\\n  const stacked = boolean('stacked', true);\\n  const stackAccessors = stacked ? ['yes'] : [];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        theme={theme}\\n        debug={boolean('debug', true)}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <LineAnnotation\\n        id=\\\"line-annotation\\\"\\n        domainType={AnnotationDomainType.XDomain}\\n        dataValues={[{ dataValue: 2 }, { dataValue: 2.5 }, { dataValue: 3.5 }]}\\n        style={lineAnnotationStyle}\\n        marker={<div style={{ background: 'red', width: 10, height: 10 }} />}\\n      />\\n      <RectAnnotation\\n        style={{\\n          fill: 'green',\\n        }}\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x0: 0.5,\\n            },\\n            details: 'min=0.5, max=max',\\n          },\\n        ]}\\n        id=\\\"rect1\\\"\\n      />\\n      <RectAnnotation\\n        style={{\\n          fill: 'red',\\n        }}\\n        dataValues={[\\n          {\\n            coordinates: {\\n              x1: 3,\\n            },\\n            details: 'min=min, max=3',\\n          },\\n        ]}\\n        id=\\\"rect2\\\"\\n      />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title=\\\"left axis\\\" />\\n      <Axis id=\\\"discover-histogram-bottom-axis\\\" position={Position.Bottom} title=\\\"bottom axis\\\" />\\n      {hasHistogramBarSeries && (\\n        <HistogramBarSeries\\n          id=\\\"histo\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={stackAccessors}\\n          data={pointData}\\n          name=\\\"histogram\\\"\\n        />\\n      )}\\n      <BarSeries\\n        id=\\\"bars-1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stackAccessors}\\n        data={pointData}\\n        name=\\\"bars 1\\\"\\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\\n      />\\n      <BarSeries\\n        id=\\\"bars-2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\\n      />\\n      {otherSeries}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  HistogramBarSeries,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    { x: 'a', y: 2 },\\n    { x: 'b', y: 7 },\\n    { x: 'c', y: 0 },\\n    { x: 'd', y: 6 },\\n  ];\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\\n  const stacked = boolean('stacked', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n      />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title=\\\"left axis\\\" />\\n      <Axis id=\\\"discover-histogram-bottom-axis\\\" position={Position.Bottom} title=\\\"bottom axis\\\" />\\n      {hasHistogramBarSeries && (\\n        <HistogramBarSeries\\n          id=\\\"histo\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={stacked ? ['y'] : []}\\n          data={data}\\n          name=\\\"histogram\\\"\\n        />\\n      )}\\n      <BarSeries\\n        id=\\\"bars-1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stacked ? ['y'] : []}\\n        data={data}\\n        name=\\\"bars 1\\\"\\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\\n      />\\n      <BarSeries\\n        id=\\\"bars-2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stacked ? ['y'] : []}\\n        data={data}\\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":93},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":93}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  HistogramBarSeries,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    { x: 'a', y: 2 },\n    { x: 'b', y: 7 },\n    { x: 'c', y: 0 },\n    { x: 'd', y: 6 },\n  ];\n  const theme: PartialTheme = {\n    scales: {\n      barsPadding: number('bars padding', 0.25, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.1,\n      }),\n    },\n  };\n\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\n  const stacked = boolean('stacked', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        rotation={customKnobs.enum.rotation()}\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', true)}\n      />\n      <Axis id=\"discover-histogram-left-axis\" position={Position.Left} title=\"left axis\" />\n      <Axis id=\"discover-histogram-bottom-axis\" position={Position.Bottom} title=\"bottom axis\" />\n      {hasHistogramBarSeries && (\n        <HistogramBarSeries\n          id=\"histo\"\n          xScaleType={ScaleType.Ordinal}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          stackAccessors={stacked ? ['y'] : []}\n          data={data}\n          name=\"histogram\"\n        />\n      )}\n      <BarSeries\n        id=\"bars-1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stacked ? ['y'] : []}\n        data={data}\n        name=\"bars 1\"\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\n      />\n      <BarSeries\n        id=\"bars-2\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stacked ? ['y'] : []}\n        data={data}\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    { x: 'a', y: 2 },\\n    { x: 'b', y: 7 },\\n    { x: 'c', y: 0 },\\n    { x: 'd', y: 6 },\\n  ];\\n  const theme: PartialTheme = {\\n    scales: {\\n      barsPadding: number('bars padding', 0.25, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.1,\\n      }),\\n    },\\n  };\\n\\n  const hasHistogramBarSeries = boolean('hasHistogramBarSeries', false);\\n  const stacked = boolean('stacked', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n      />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title=\\\"left axis\\\" />\\n      <Axis id=\\\"discover-histogram-bottom-axis\\\" position={Position.Bottom} title=\\\"bottom axis\\\" />\\n      {hasHistogramBarSeries && (\\n        <HistogramBarSeries\\n          id=\\\"histo\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          stackAccessors={stacked ? ['y'] : []}\\n          data={data}\\n          name=\\\"histogram\\\"\\n        />\\n      )}\\n      <BarSeries\\n        id=\\\"bars-1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stacked ? ['y'] : []}\\n        data={data}\\n        name=\\\"bars 1\\\"\\n        enableHistogramMode={boolean('bars-1 enableHistogramMode', false)}\\n      />\\n      <BarSeries\\n        id=\\\"bars-2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stacked ? ['y'] : []}\\n        data={data}\\n        enableHistogramMode={boolean('bars-2 enableHistogramMode', false)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  HistogramBarSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst TEST_DATASET_DISCOVER = {\\n  xAxisLabel: 'timestamp per 30 seconds',\\n  yAxisLabel: 'Count',\\n  series: [\\n    {\\n      x: 1560438420000,\\n      y: 1,\\n    },\\n    {\\n      x: 1560438510000,\\n      y: 1,\\n    },\\n  ],\\n};\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: NaN,\\n    minInterval: 30000,\\n  };\\n\\n  const useCustomMinInterval = boolean('use custom minInterval of 30s', true);\\n  const multiLayerAxis = boolean('use multilayer time axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={useCustomMinInterval ? xDomain : undefined} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title={TEST_DATASET_DISCOVER.yAxisLabel} />\\n      <Axis\\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\\n        id=\\\"discover-histogram-bottom-axis\\\"\\n        position={Position.Bottom}\\n        title={TEST_DATASET_DISCOVER.xAxisLabel}\\n        tickFormat={formatter}\\n        style={\\n          multiLayerAxis\\n            ? {\\n                tickLine: { size: 0.0001, padding: 4 },\\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\\n              }\\n            : {}\\n        }\\n      />\\n\\n      <HistogramBarSeries\\n        id=\\\"discover-histogram\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TEST_DATASET_DISCOVER.series}\\n        timeZone=\\\"local\\\"\\n        name=\\\"Count\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":85},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":85}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  HistogramBarSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst TEST_DATASET_DISCOVER = {\n  xAxisLabel: 'timestamp per 30 seconds',\n  yAxisLabel: 'Count',\n  series: [\n    {\n      x: 1560438420000,\n      y: 1,\n    },\n    {\n      x: 1560438510000,\n      y: 1,\n    },\n  ],\n};\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n\n  const xDomain = {\n    min: NaN,\n    max: NaN,\n    minInterval: 30000,\n  };\n\n  const useCustomMinInterval = boolean('use custom minInterval of 30s', true);\n  const multiLayerAxis = boolean('use multilayer time axis', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={useCustomMinInterval ? xDomain : undefined} baseTheme={useBaseTheme()} />\n      <Axis id=\"discover-histogram-left-axis\" position={Position.Left} title={TEST_DATASET_DISCOVER.yAxisLabel} />\n      <Axis\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\n        id=\"discover-histogram-bottom-axis\"\n        position={Position.Bottom}\n        title={TEST_DATASET_DISCOVER.xAxisLabel}\n        tickFormat={formatter}\n        style={\n          multiLayerAxis\n            ? {\n                tickLine: { size: 0.0001, padding: 4 },\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\n              }\n            : {}\n        }\n      />\n\n      <HistogramBarSeries\n        id=\"discover-histogram\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={TEST_DATASET_DISCOVER.series}\n        timeZone=\"local\"\n        name=\"Count\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n\\n  const xDomain = {\\n    min: NaN,\\n    max: NaN,\\n    minInterval: 30000,\\n  };\\n\\n  const useCustomMinInterval = boolean('use custom minInterval of 30s', true);\\n  const multiLayerAxis = boolean('use multilayer time axis', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={useCustomMinInterval ? xDomain : undefined} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"discover-histogram-left-axis\\\" position={Position.Left} title={TEST_DATASET_DISCOVER.yAxisLabel} />\\n      <Axis\\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\\n        id=\\\"discover-histogram-bottom-axis\\\"\\n        position={Position.Bottom}\\n        title={TEST_DATASET_DISCOVER.xAxisLabel}\\n        tickFormat={formatter}\\n        style={\\n          multiLayerAxis\\n            ? {\\n                tickLine: { size: 0.0001, padding: 4 },\\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\\n              }\\n            : {}\\n        }\\n      />\\n\\n      <HistogramBarSeries\\n        id=\\\"discover-histogram\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TEST_DATASET_DISCOVER.series}\\n        timeZone=\\\"local\\\"\\n        name=\\\"Count\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  HistogramBarSeries,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useLine = boolean('use lines instead of bars', false);\\n  const multiLayerAxis = boolean('use multilayer time axis', false);\\n  const oddDomain = boolean('non-round time domain start', false);\\n\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n\\n  const binWidthMs = 60000;\\n\\n  const xDomain = {\\n    min: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] - (oddDomain ? 217839 : 0),\\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] + (oddDomain ? 200000 : 0 ?? binWidthMs - 1),\\n    minInterval: binWidthMs,\\n  };\\n\\n  const Series = useLine ? LineSeries : HistogramBarSeries;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks={!multiLayerAxis}\\n        tickFormat={formatter}\\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\\n        style={\\n          multiLayerAxis\\n            ? {\\n                tickLine: { size: 0.0001, padding: 4 },\\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\\n              }\\n            : {}\\n        }\\n      />\\n      <Axis id=\\\"left\\\" title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title} position={Position.Left} />\\n      <Series\\n        id=\\\"series\\\"\\n        timeZone=\\\"local\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 1)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":77},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":77}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  HistogramBarSeries,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useLine = boolean('use lines instead of bars', false);\n  const multiLayerAxis = boolean('use multilayer time axis', false);\n  const oddDomain = boolean('non-round time domain start', false);\n\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n\n  const binWidthMs = 60000;\n\n  const xDomain = {\n    min: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] - (oddDomain ? 217839 : 0),\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] + (oddDomain ? 200000 : 0 ?? binWidthMs - 1),\n    minInterval: binWidthMs,\n  };\n\n  const Series = useLine ? LineSeries : HistogramBarSeries;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={xDomain} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        title=\"timestamp per 1 minute\"\n        position={Position.Bottom}\n        showOverlappingTicks={!multiLayerAxis}\n        tickFormat={formatter}\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\n        style={\n          multiLayerAxis\n            ? {\n                tickLine: { size: 0.0001, padding: 4 },\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\n              }\n            : {}\n        }\n      />\n      <Axis id=\"left\" title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title} position={Position.Left} />\n      <Series\n        id=\"series\"\n        timeZone=\"local\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 1)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useLine = boolean('use lines instead of bars', false);\\n  const multiLayerAxis = boolean('use multilayer time axis', false);\\n  const oddDomain = boolean('non-round time domain start', false);\\n\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n\\n  const binWidthMs = 60000;\\n\\n  const xDomain = {\\n    min: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] - (oddDomain ? 217839 : 0),\\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data[0][0] + (oddDomain ? 200000 : 0 ?? binWidthMs - 1),\\n    minInterval: binWidthMs,\\n  };\\n\\n  const Series = useLine ? LineSeries : HistogramBarSeries;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xDomain} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        title=\\\"timestamp per 1 minute\\\"\\n        position={Position.Bottom}\\n        showOverlappingTicks={!multiLayerAxis}\\n        tickFormat={formatter}\\n        timeAxisLayerCount={multiLayerAxis ? 3 : 0}\\n        style={\\n          multiLayerAxis\\n            ? {\\n                tickLine: { size: 0.0001, padding: 4 },\\n                tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom } },\\n              }\\n            : {}\\n        }\\n      />\\n      <Axis id=\\\"left\\\" title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title} position={Position.Left} />\\n      <Series\\n        id=\\\"series\\\"\\n        timeZone=\\\"local\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 1)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const minBarHeight = number('minBarHeight', 5);\\n  const data = [\\n    [1, 100000],\\n    [2, 10000],\\n    [3, 1000],\\n    [4, 100],\\n    [5, 10],\\n    [6, 1],\\n    [7, 0],\\n    [8, 1],\\n    [9, 0],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"Bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" title=\\\"Left\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        minBarHeight={minBarHeight}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const minBarHeight = number('minBarHeight', 5);\n  const data = [\n    [1, 100000],\n    [2, 10000],\n    [3, 1000],\n    [4, 100],\n    [5, 10],\n    [6, 1],\n    [7, 0],\n    [8, 1],\n    [9, 0],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"Bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" title=\"Left\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        minBarHeight={minBarHeight}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const minBarHeight = number('minBarHeight', 5);\\n  const data = [\\n    [1, 100000],\\n    [2, 10000],\\n    [3, 1000],\\n    [4, 100],\\n    [5, 10],\\n    [6, 1],\\n    [7, 0],\\n    [8, 1],\\n    [9, 0],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"Bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" title=\\\"Left\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        minBarHeight={minBarHeight}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n// for testing purposes only\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const minBarHeight = number('minBarHeight', 10);\\n  const data = [\\n    [1, -100000],\\n    [2, -10000],\\n    [3, -1000],\\n    [4, -100],\\n    [5, -10],\\n    [6, -1],\\n    [7, 0],\\n    [8, -1],\\n    [9, 0],\\n    [10, 0],\\n    [11, 1],\\n    [12, 0],\\n    [13, 1],\\n    [14, 10],\\n    [15, 100],\\n    [16, 1000],\\n    [17, 10000],\\n    [18, 100000],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"Bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" title=\\\"Left\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        minBarHeight={minBarHeight}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":56},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":56}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n// for testing purposes only\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const minBarHeight = number('minBarHeight', 10);\n  const data = [\n    [1, -100000],\n    [2, -10000],\n    [3, -1000],\n    [4, -100],\n    [5, -10],\n    [6, -1],\n    [7, 0],\n    [8, -1],\n    [9, 0],\n    [10, 0],\n    [11, 1],\n    [12, 0],\n    [13, 1],\n    [14, 10],\n    [15, 100],\n    [16, 1000],\n    [17, 10000],\n    [18, 100000],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"Bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" title=\"Left\" position={Position.Left} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n        minBarHeight={minBarHeight}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const minBarHeight = number('minBarHeight', 10);\\n  const data = [\\n    [1, -100000],\\n    [2, -10000],\\n    [3, -1000],\\n    [4, -100],\\n    [5, -10],\\n    [6, -1],\\n    [7, 0],\\n    [8, -1],\\n    [9, 0],\\n    [10, 0],\\n    [11, 1],\\n    [12, 0],\\n    [13, 1],\\n    [14, 10],\\n    [15, 100],\\n    [16, 1000],\\n    [17, 10000],\\n    [18, 100000],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"Bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" title=\\\"Left\\\" position={Position.Left} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n        minBarHeight={minBarHeight}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n    [5, 5],\\n    [6, 3],\\n    [7, 8],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 1],\\n    [7, 5],\\n    [8, 6],\\n    [9, 7],\\n  ];\\n  const data4 = [\\n    [1, 2],\\n    [2, 6],\\n    [3, 2],\\n    [4, 9],\\n    [5, 2],\\n    [6, 3],\\n    [7, 1],\\n    [8, 2],\\n    [9, 7],\\n  ];\\n  const data5 = [\\n    [1, 1],\\n    [2, 7],\\n    [3, 5],\\n    [4, 6],\\n    [5, 5],\\n    [6, 4],\\n    [7, 2],\\n    [8, 4],\\n    [9, 8],\\n  ];\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n        domain={{ min: 0, max: 15 }}\\n      />\\n      <Axis\\n        id=\\\"left group b\\\"\\n        groupId=\\\"gb\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n        hide\\n        domain={{ min: 0, max: 15 }}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId=\\\"gb\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data4}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar B\\\"\\n        groupId=\\\"gb\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data5}\\n      />\\n      <BarSeries\\n        id=\\\"non stacked bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":142},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":142}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 2],\n    [2, 2],\n    [3, 3],\n    [4, 5],\n    [5, 5],\n    [6, 3],\n    [7, 8],\n    [8, 2],\n    [9, 1],\n  ];\n  const data2 = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 4],\n  ];\n  const data3 = [\n    [1, 6],\n    [2, 6],\n    [3, 3],\n    [4, 2],\n    [5, 1],\n    [6, 1],\n    [7, 5],\n    [8, 6],\n    [9, 7],\n  ];\n  const data4 = [\n    [1, 2],\n    [2, 6],\n    [3, 2],\n    [4, 9],\n    [5, 2],\n    [6, 3],\n    [7, 1],\n    [8, 2],\n    [9, 7],\n  ];\n  const data5 = [\n    [1, 1],\n    [2, 7],\n    [3, 5],\n    [4, 6],\n    [5, 5],\n    [6, 4],\n    [7, 2],\n    [8, 4],\n    [9, 8],\n  ];\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n        domain={{ min: 0, max: 15 }}\n      />\n      <Axis\n        id=\"left group b\"\n        groupId=\"gb\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n        hide\n        domain={{ min: 0, max: 15 }}\n      />\n      <BarSeries\n        id=\"stacked bar 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data1}\n      />\n      <BarSeries\n        id=\"stacked bar 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data2}\n      />\n\n      <BarSeries\n        id=\"stacked bar A\"\n        groupId=\"gb\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data4}\n      />\n      <BarSeries\n        id=\"stacked bar B\"\n        groupId=\"gb\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data5}\n      />\n      <BarSeries\n        id=\"non stacked bar\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n    [5, 5],\\n    [6, 3],\\n    [7, 8],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 1],\\n    [7, 5],\\n    [8, 6],\\n    [9, 7],\\n  ];\\n  const data4 = [\\n    [1, 2],\\n    [2, 6],\\n    [3, 2],\\n    [4, 9],\\n    [5, 2],\\n    [6, 3],\\n    [7, 1],\\n    [8, 2],\\n    [9, 7],\\n  ];\\n  const data5 = [\\n    [1, 1],\\n    [2, 7],\\n    [3, 5],\\n    [4, 6],\\n    [5, 5],\\n    [6, 4],\\n    [7, 2],\\n    [8, 4],\\n    [9, 8],\\n  ];\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n        domain={{ min: 0, max: 15 }}\\n      />\\n      <Axis\\n        id=\\\"left group b\\\"\\n        groupId=\\\"gb\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n        hide\\n        domain={{ min: 0, max: 15 }}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId=\\\"gb\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data4}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar B\\\"\\n        groupId=\\\"gb\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data5}\\n      />\\n      <BarSeries\\n        id=\\\"non stacked bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip, TooltipProps } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst CustomTooltip = () => (\\n  <div\\n    style={{\\n      padding: 10,\\n      height: 40,\\n      backgroundColor: 'blue',\\n      color: 'white',\\n    }}\\n  >\\n    My Custom Tooltip\\n  </div>\\n);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const tooltipOptions: TooltipProps = {\\n    stickTo: customKnobs.enum.stickTo('stickTo'),\\n    placement: customKnobs.enum.placement('Tooltip placement'),\\n    fallbackPlacements: customKnobs.enum.fallbackPlacements(),\\n    type: customKnobs.enum.tooltipType(),\\n    boundary: customKnobs.enum.boundary(),\\n    customTooltip: boolean('Custom Tooltip', false) ? CustomTooltip : undefined,\\n    offset: number('Tooltip offset', 10, { min: 0, max: 20, range: true, step: 1 }),\\n  };\\n  const showAxes = boolean('Show axes', false);\\n  const showLegend = boolean('Show Legend', false);\\n\\n  // Added buffer to test tooltip positioning within chart container\\n  return (\\n    <div className=\\\"buffer\\\" style={{ width: '100%', height: '100%', paddingLeft: 80, paddingRight: 80 }}>\\n      <Chart title={title} description={description}>\\n        <Settings rotation={rotation} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n        <Tooltip {...tooltipOptions} />\\n\\n        <Axis id=\\\"bottom\\\" hide={!showAxes} position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n        <Axis\\n          id=\\\"left2\\\"\\n          hide={!showAxes}\\n          title=\\\"Left axis\\\"\\n          position={Position.Left}\\n          tickFormat={(d: any) => Number(d).toFixed(2)}\\n        />\\n\\n        <BarSeries\\n          id=\\\"bars1\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y1', 'y2']}\\n          splitSeriesAccessors={['g']}\\n          data={TestDatasets.BARCHART_2Y1G}\\n        />\\n      </Chart>\\n    </div>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip, TooltipProps } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst CustomTooltip = () => (\n  <div\n    style={{\n      padding: 10,\n      height: 40,\n      backgroundColor: 'blue',\n      color: 'white',\n    }}\n  >\n    My Custom Tooltip\n  </div>\n);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rotation = customKnobs.enum.rotation();\n  const tooltipOptions: TooltipProps = {\n    stickTo: customKnobs.enum.stickTo('stickTo'),\n    placement: customKnobs.enum.placement('Tooltip placement'),\n    fallbackPlacements: customKnobs.enum.fallbackPlacements(),\n    type: customKnobs.enum.tooltipType(),\n    boundary: customKnobs.enum.boundary(),\n    customTooltip: boolean('Custom Tooltip', false) ? CustomTooltip : undefined,\n    offset: number('Tooltip offset', 10, { min: 0, max: 20, range: true, step: 1 }),\n  };\n  const showAxes = boolean('Show axes', false);\n  const showLegend = boolean('Show Legend', false);\n\n  // Added buffer to test tooltip positioning within chart container\n  return (\n    <div className=\"buffer\" style={{ width: '100%', height: '100%', paddingLeft: 80, paddingRight: 80 }}>\n      <Chart title={title} description={description}>\n        <Settings rotation={rotation} showLegend={showLegend} baseTheme={useBaseTheme()} />\n        <Tooltip {...tooltipOptions} />\n\n        <Axis id=\"bottom\" hide={!showAxes} position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n        <Axis\n          id=\"left2\"\n          hide={!showAxes}\n          title=\"Left axis\"\n          position={Position.Left}\n          tickFormat={(d: any) => Number(d).toFixed(2)}\n        />\n\n        <BarSeries\n          id=\"bars1\"\n          xScaleType={ScaleType.Ordinal}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y1', 'y2']}\n          splitSeriesAccessors={['g']}\n          data={TestDatasets.BARCHART_2Y1G}\n        />\n      </Chart>\n    </div>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const tooltipOptions: TooltipProps = {\\n    stickTo: customKnobs.enum.stickTo('stickTo'),\\n    placement: customKnobs.enum.placement('Tooltip placement'),\\n    fallbackPlacements: customKnobs.enum.fallbackPlacements(),\\n    type: customKnobs.enum.tooltipType(),\\n    boundary: customKnobs.enum.boundary(),\\n    customTooltip: boolean('Custom Tooltip', false) ? CustomTooltip : undefined,\\n    offset: number('Tooltip offset', 10, { min: 0, max: 20, range: true, step: 1 }),\\n  };\\n  const showAxes = boolean('Show axes', false);\\n  const showLegend = boolean('Show Legend', false);\\n\\n  // Added buffer to test tooltip positioning within chart container\\n  return (\\n    <div className=\\\"buffer\\\" style={{ width: '100%', height: '100%', paddingLeft: 80, paddingRight: 80 }}>\\n      <Chart title={title} description={description}>\\n        <Settings rotation={rotation} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n        <Tooltip {...tooltipOptions} />\\n\\n        <Axis id=\\\"bottom\\\" hide={!showAxes} position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n        <Axis\\n          id=\\\"left2\\\"\\n          hide={!showAxes}\\n          title=\\\"Left axis\\\"\\n          position={Position.Left}\\n          tickFormat={(d: any) => Number(d).toFixed(2)}\\n        />\\n\\n        <BarSeries\\n          id=\\\"bars1\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y1', 'y2']}\\n          splitSeriesAccessors={['g']}\\n          data={TestDatasets.BARCHART_2Y1G}\\n        />\\n      </Chart>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const stack13 = boolean('Stack bars1 and bars3', true);\\n  const stack24 = boolean('Stack bars2 and bars4', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"count1\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"count2\\\" groupId=\\\"2\\\" title=\\\"count\\\" position={Position.Right} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        groupId=\\\"2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack13 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 252 },\\n          { x: 'watches', y: 499 },\\n          { x: 'bags', y: 489 },\\n          { x: 'cocktail dresses', y: 391 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack24 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 390 },\\n          { x: 'watches', y: 23 },\\n          { x: 'bags', y: 750 },\\n          { x: 'cocktail dresses', y: 853 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars3\\\"\\n        groupId=\\\"2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack13 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 39 },\\n          { x: 'watches', y: 2 },\\n          { x: 'bags', y: 75 },\\n          { x: 'cocktail dresses', y: 150 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars4\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack24 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 39 },\\n          { x: 'watches', y: 2 },\\n          { x: 'bags', y: 75 },\\n          { x: 'cocktail dresses', y: 150 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":85},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":85}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const stack13 = boolean('Stack bars1 and bars3', true);\n  const stack24 = boolean('Stack bars2 and bars4', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend baseTheme={useBaseTheme()} />\n      <Axis id=\"count1\" title=\"count\" position={Position.Left} />\n      <Axis id=\"count2\" groupId=\"2\" title=\"count\" position={Position.Right} />\n      <Axis id=\"x\" title=\"goods\" position={Position.Bottom} />\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        groupId=\"2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stack13 ? ['y'] : undefined}\n        data={[\n          { x: 'trousers', y: 252 },\n          { x: 'watches', y: 499 },\n          { x: 'bags', y: 489 },\n          { x: 'cocktail dresses', y: 391 },\n        ]}\n      />\n\n      <BarSeries\n        id=\"bars2\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stack24 ? ['y'] : undefined}\n        data={[\n          { x: 'trousers', y: 390 },\n          { x: 'watches', y: 23 },\n          { x: 'bags', y: 750 },\n          { x: 'cocktail dresses', y: 853 },\n        ]}\n      />\n\n      <BarSeries\n        id=\"bars3\"\n        groupId=\"2\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stack13 ? ['y'] : undefined}\n        data={[\n          { x: 'trousers', y: 39 },\n          { x: 'watches', y: 2 },\n          { x: 'bags', y: 75 },\n          { x: 'cocktail dresses', y: 150 },\n        ]}\n      />\n\n      <BarSeries\n        id=\"bars4\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={stack24 ? ['y'] : undefined}\n        data={[\n          { x: 'trousers', y: 39 },\n          { x: 'watches', y: 2 },\n          { x: 'bags', y: 75 },\n          { x: 'cocktail dresses', y: 150 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const stack13 = boolean('Stack bars1 and bars3', true);\\n  const stack24 = boolean('Stack bars2 and bars4', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"count1\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"count2\\\" groupId=\\\"2\\\" title=\\\"count\\\" position={Position.Right} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        groupId=\\\"2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack13 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 252 },\\n          { x: 'watches', y: 499 },\\n          { x: 'bags', y: 489 },\\n          { x: 'cocktail dresses', y: 391 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack24 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 390 },\\n          { x: 'watches', y: 23 },\\n          { x: 'bags', y: 750 },\\n          { x: 'cocktail dresses', y: 853 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars3\\\"\\n        groupId=\\\"2\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack13 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 39 },\\n          { x: 'watches', y: 2 },\\n          { x: 'bags', y: 75 },\\n          { x: 'cocktail dresses', y: 150 },\\n        ]}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars4\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={stack24 ? ['y'] : undefined}\\n        data={[\\n          { x: 'trousers', y: 39 },\\n          { x: 'watches', y: 2 },\\n          { x: 'bags', y: 75 },\\n          { x: 'cocktail dresses', y: 150 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 2 },\\n        { x: 'b', y: 7 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":36},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":36}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 2 },\n        { x: 'b', y: 7 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 2 },\\n        { x: 'b', y: 7 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, BinAgg, Direction } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst data = [\\n  { x1: 'b', x2: 2, g1: 'false', g2: 'Canada', y1: 19, y2: 22 },\\n  { x1: 'd', x2: 4, g1: 'false', g2: 'USA', y1: 34, y2: 21 },\\n  { x1: 'd', x2: 4, g1: 'true', g2: 'USA', y1: 49, y2: 169 },\\n  { x1: 'e', x2: 5, g1: 'false', g2: 'Canada', y1: 40, y2: 77 },\\n  { x1: 'b', x2: 2, g1: 'true', g2: 'USA', y1: 28, y2: 84 },\\n  { x1: 'a', x2: 1, g1: 'false', g2: 'USA', y1: 53, y2: 39 },\\n  { x1: 'a', x2: 1, g1: 'true', g2: 'Canada', y1: 93, y2: 42 },\\n  { x1: 'c', x2: 3, g1: 'true', g2: 'USA', y1: 55, y2: 72 },\\n  { x1: 'e', x2: 5, g1: 'true', g2: 'Canada', y1: 96, y2: 74 },\\n  { x1: 'c', x2: 3, g1: 'false', g2: 'Canada', y1: 87, y2: 39 },\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\\n  const dataType = select(\\n    'Data type',\\n    {\\n      linear: 'linear',\\n      ordinal: 'ordinal',\\n    },\\n    'ordinal',\\n  );\\n  const direction =\\n    select<Direction | undefined>(\\n      'Direction',\\n      {\\n        Ascending: Direction.Ascending,\\n        Descending: Direction.Descending,\\n        'Default (Descending)': undefined,\\n      },\\n      Direction.Descending,\\n    ) || undefined;\\n  const binAgg =\\n    select<BinAgg | undefined>(\\n      'BinAgg',\\n      {\\n        Sum: BinAgg.Sum,\\n        None: BinAgg.None,\\n        'Default (sum)': undefined,\\n      },\\n      BinAgg.Sum,\\n    ) || undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        orderOrdinalBinsBy={\\n          orderOrdinalBinsBy\\n            ? {\\n                direction,\\n                binAgg,\\n              }\\n            : undefined\\n        }\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={dataType === 'linear' ? ScaleType.Linear : ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={dataType === 'linear' ? 'x2' : 'x1'}\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        stackAccessors={['g1', 'g2']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, BinAgg, Direction } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst data = [\n  { x1: 'b', x2: 2, g1: 'false', g2: 'Canada', y1: 19, y2: 22 },\n  { x1: 'd', x2: 4, g1: 'false', g2: 'USA', y1: 34, y2: 21 },\n  { x1: 'd', x2: 4, g1: 'true', g2: 'USA', y1: 49, y2: 169 },\n  { x1: 'e', x2: 5, g1: 'false', g2: 'Canada', y1: 40, y2: 77 },\n  { x1: 'b', x2: 2, g1: 'true', g2: 'USA', y1: 28, y2: 84 },\n  { x1: 'a', x2: 1, g1: 'false', g2: 'USA', y1: 53, y2: 39 },\n  { x1: 'a', x2: 1, g1: 'true', g2: 'Canada', y1: 93, y2: 42 },\n  { x1: 'c', x2: 3, g1: 'true', g2: 'USA', y1: 55, y2: 72 },\n  { x1: 'e', x2: 5, g1: 'true', g2: 'Canada', y1: 96, y2: 74 },\n  { x1: 'c', x2: 3, g1: 'false', g2: 'Canada', y1: 87, y2: 39 },\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\n  const dataType = select(\n    'Data type',\n    {\n      linear: 'linear',\n      ordinal: 'ordinal',\n    },\n    'ordinal',\n  );\n  const direction =\n    select<Direction | undefined>(\n      'Direction',\n      {\n        Ascending: Direction.Ascending,\n        Descending: Direction.Descending,\n        'Default (Descending)': undefined,\n      },\n      Direction.Descending,\n    ) || undefined;\n  const binAgg =\n    select<BinAgg | undefined>(\n      'BinAgg',\n      {\n        Sum: BinAgg.Sum,\n        None: BinAgg.None,\n        'Default (sum)': undefined,\n      },\n      BinAgg.Sum,\n    ) || undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        orderOrdinalBinsBy={\n          orderOrdinalBinsBy\n            ? {\n                direction,\n                binAgg,\n              }\n            : undefined\n        }\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left2\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={dataType === 'linear' ? ScaleType.Linear : ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor={dataType === 'linear' ? 'x2' : 'x1'}\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        stackAccessors={['g1', 'g2']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\\n  const dataType = select(\\n    'Data type',\\n    {\\n      linear: 'linear',\\n      ordinal: 'ordinal',\\n    },\\n    'ordinal',\\n  );\\n  const direction =\\n    select<Direction | undefined>(\\n      'Direction',\\n      {\\n        Ascending: Direction.Ascending,\\n        Descending: Direction.Descending,\\n        'Default (Descending)': undefined,\\n      },\\n      Direction.Descending,\\n    ) || undefined;\\n  const binAgg =\\n    select<BinAgg | undefined>(\\n      'BinAgg',\\n      {\\n        Sum: BinAgg.Sum,\\n        None: BinAgg.None,\\n        'Default (sum)': undefined,\\n      },\\n      BinAgg.Sum,\\n    ) || undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        orderOrdinalBinsBy={\\n          orderOrdinalBinsBy\\n            ? {\\n                direction,\\n                binAgg,\\n              }\\n            : undefined\\n        }\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={dataType === 'linear' ? ScaleType.Linear : ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={dataType === 'linear' ? 'x2' : 'x1'}\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        stackAccessors={['g1', 'g2']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  DisplayValueSpec,\\n  LabelOverflowConstraint,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dataGen = new SeededDataGenerator();\\nfunction generateDataWithAdditional(num: number) {\\n  return [...dataGen.generateSimpleSeries(num), { x: num, y: 0.25, g: 0 }, { x: num + 1, y: 8, g: 0 }];\\n}\\nconst frozenDataSmallVolume = generateDataWithAdditional(10);\\nconst frozenDataMediumVolume = generateDataWithAdditional(50);\\nconst frozenDataHighVolume = generateDataWithAdditional(1500);\\n\\nconst frozenData: { [key: string]: any[] } = {\\n  s: frozenDataSmallVolume,\\n  m: frozenDataMediumVolume,\\n  h: frozenDataHighVolume,\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showValueLabel = boolean('show value label', true);\\n  const isAlternatingValueLabel = boolean('alternating value label', false);\\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\\n  if (overflowChartEdges) {\\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\\n  }\\n  if (overflowBarGeometry) {\\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\\n  }\\n  const displayValueSettings = {\\n    showValueLabel,\\n    isAlternatingValueLabel,\\n    overflowConstraints,\\n  };\\n\\n  const debug = boolean('debug', false);\\n  const useBorder = boolean('useBorder', false);\\n  const valueColor = color('value color', '#fff');\\n  const borderColor = color('value border color', 'rgba(0,0,0,1)');\\n  const borderSize = number('value border width', 1.5);\\n\\n  const fixedFontSize = number('Fixed font size', 10);\\n  const useFixedFontSize = boolean('Use fixed font size', false);\\n\\n  const maxFontSize = number('Max font size', 25);\\n  const minFontSize = number('Min font size', 10);\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: useFixedFontSize ? fixedFontSize : { max: maxFontSize, min: minFontSize },\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: 0,\\n        fill: useBorder ? { textBorder: borderSize } : { color: valueColor, borderColor, borderWidth: borderSize },\\n        offsetX: number('offsetX', 0),\\n        offsetY: number('offsetY', 0),\\n        alignment: {\\n          horizontal: select(\\n            'Horizontal alignment',\\n            {\\n              Default: undefined,\\n              Left: 'left',\\n              Center: 'center',\\n              Right: 'right',\\n            },\\n            undefined,\\n          ),\\n          vertical: select(\\n            'Vertical alignment',\\n            {\\n              Default: undefined,\\n              Top: 'top',\\n              Middle: 'middle',\\n              Bottom: 'bottom',\\n            },\\n            undefined,\\n          ),\\n        },\\n      },\\n    },\\n  };\\n\\n  const dataSize = select(\\n    'data volume size',\\n    {\\n      'small volume': 's',\\n      'medium volume': 'm',\\n      'high volume': 'h',\\n    },\\n    's',\\n  );\\n  const data = frozenData[dataSize];\\n\\n  const isSplitSeries = boolean('split series', false);\\n  const isStackedSeries = boolean('stacked series', false);\\n\\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n        rotation={customKnobs.enum.rotation()}\\n        showLegend\\n        showLegendExtra\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n      />\\n      <BarSeries\\n        id=\\\"bars2\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={[\\n          { x: 0, y: 2, g: 'a' },\\n          { x: 1, y: 7, g: 'a' },\\n          { x: 2, y: 3, g: 'a' },\\n          { x: 3, y: 6, g: 'a' },\\n          { x: 0, y: 4, g: 'b' },\\n          { x: 1, y: 5, g: 'b' },\\n          { x: 2, y: 8, g: 'b' },\\n          { x: 3, y: 2, g: 'b' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":43},\"endLoc\":{\"col\":1,\"line\":170},\"startBody\":{\"col\":36,\"line\":43},\"endBody\":{\"col\":1,\"line\":170}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  DisplayValueSpec,\n  LabelOverflowConstraint,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dataGen = new SeededDataGenerator();\nfunction generateDataWithAdditional(num: number) {\n  return [...dataGen.generateSimpleSeries(num), { x: num, y: 0.25, g: 0 }, { x: num + 1, y: 8, g: 0 }];\n}\nconst frozenDataSmallVolume = generateDataWithAdditional(10);\nconst frozenDataMediumVolume = generateDataWithAdditional(50);\nconst frozenDataHighVolume = generateDataWithAdditional(1500);\n\nconst frozenData: { [key: string]: any[] } = {\n  s: frozenDataSmallVolume,\n  m: frozenDataMediumVolume,\n  h: frozenDataHighVolume,\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showValueLabel = boolean('show value label', true);\n  const isAlternatingValueLabel = boolean('alternating value label', false);\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\n  if (overflowChartEdges) {\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\n  }\n  if (overflowBarGeometry) {\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\n  }\n  const displayValueSettings = {\n    showValueLabel,\n    isAlternatingValueLabel,\n    overflowConstraints,\n  };\n\n  const debug = boolean('debug', false);\n  const useBorder = boolean('useBorder', false);\n  const valueColor = color('value color', '#fff');\n  const borderColor = color('value border color', 'rgba(0,0,0,1)');\n  const borderSize = number('value border width', 1.5);\n\n  const fixedFontSize = number('Fixed font size', 10);\n  const useFixedFontSize = boolean('Use fixed font size', false);\n\n  const maxFontSize = number('Max font size', 25);\n  const minFontSize = number('Min font size', 10);\n\n  const theme: PartialTheme = {\n    barSeriesStyle: {\n      displayValue: {\n        fontSize: useFixedFontSize ? fixedFontSize : { max: maxFontSize, min: minFontSize },\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        fontStyle: 'normal',\n        padding: 0,\n        fill: useBorder ? { textBorder: borderSize } : { color: valueColor, borderColor, borderWidth: borderSize },\n        offsetX: number('offsetX', 0),\n        offsetY: number('offsetY', 0),\n        alignment: {\n          horizontal: select(\n            'Horizontal alignment',\n            {\n              Default: undefined,\n              Left: 'left',\n              Center: 'center',\n              Right: 'right',\n            },\n            undefined,\n          ),\n          vertical: select(\n            'Vertical alignment',\n            {\n              Default: undefined,\n              Top: 'top',\n              Middle: 'middle',\n              Bottom: 'bottom',\n            },\n            undefined,\n          ),\n        },\n      },\n    },\n  };\n\n  const dataSize = select(\n    'data volume size',\n    {\n      'small volume': 's',\n      'medium volume': 'm',\n      'high volume': 'h',\n    },\n    's',\n  );\n  const data = frozenData[dataSize];\n\n  const isSplitSeries = boolean('split series', false);\n  const isStackedSeries = boolean('stacked series', false);\n\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={debug}\n        rotation={customKnobs.enum.rotation()}\n        showLegend\n        showLegendExtra\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        displayValueSettings={displayValueSettings}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={splitSeriesAccessors}\n        stackAccessors={stackAccessors}\n        data={data}\n      />\n      <BarSeries\n        id=\"bars2\"\n        displayValueSettings={displayValueSettings}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={[\n          { x: 0, y: 2, g: 'a' },\n          { x: 1, y: 7, g: 'a' },\n          { x: 2, y: 3, g: 'a' },\n          { x: 3, y: 6, g: 'a' },\n          { x: 0, y: 4, g: 'b' },\n          { x: 1, y: 5, g: 'b' },\n          { x: 2, y: 8, g: 'b' },\n          { x: 3, y: 2, g: 'b' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showValueLabel = boolean('show value label', true);\\n  const isAlternatingValueLabel = boolean('alternating value label', false);\\n  const overflowChartEdges = boolean('hide label if overflows chart edges', false);\\n  const overflowBarGeometry = boolean('hide label if overflows bar geometry', false);\\n  const overflowConstraints: DisplayValueSpec['overflowConstraints'] = [];\\n  if (overflowChartEdges) {\\n    overflowConstraints.push(LabelOverflowConstraint.ChartEdges);\\n  }\\n  if (overflowBarGeometry) {\\n    overflowConstraints.push(LabelOverflowConstraint.BarGeometry);\\n  }\\n  const displayValueSettings = {\\n    showValueLabel,\\n    isAlternatingValueLabel,\\n    overflowConstraints,\\n  };\\n\\n  const debug = boolean('debug', false);\\n  const useBorder = boolean('useBorder', false);\\n  const valueColor = color('value color', '#fff');\\n  const borderColor = color('value border color', 'rgba(0,0,0,1)');\\n  const borderSize = number('value border width', 1.5);\\n\\n  const fixedFontSize = number('Fixed font size', 10);\\n  const useFixedFontSize = boolean('Use fixed font size', false);\\n\\n  const maxFontSize = number('Max font size', 25);\\n  const minFontSize = number('Min font size', 10);\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: useFixedFontSize ? fixedFontSize : { max: maxFontSize, min: minFontSize },\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: 0,\\n        fill: useBorder ? { textBorder: borderSize } : { color: valueColor, borderColor, borderWidth: borderSize },\\n        offsetX: number('offsetX', 0),\\n        offsetY: number('offsetY', 0),\\n        alignment: {\\n          horizontal: select(\\n            'Horizontal alignment',\\n            {\\n              Default: undefined,\\n              Left: 'left',\\n              Center: 'center',\\n              Right: 'right',\\n            },\\n            undefined,\\n          ),\\n          vertical: select(\\n            'Vertical alignment',\\n            {\\n              Default: undefined,\\n              Top: 'top',\\n              Middle: 'middle',\\n              Bottom: 'bottom',\\n            },\\n            undefined,\\n          ),\\n        },\\n      },\\n    },\\n  };\\n\\n  const dataSize = select(\\n    'data volume size',\\n    {\\n      'small volume': 's',\\n      'medium volume': 'm',\\n      'high volume': 'h',\\n    },\\n    's',\\n  );\\n  const data = frozenData[dataSize];\\n\\n  const isSplitSeries = boolean('split series', false);\\n  const isStackedSeries = boolean('stacked series', false);\\n\\n  const splitSeriesAccessors = isSplitSeries ? ['g'] : undefined;\\n  const stackAccessors = isStackedSeries ? ['x'] : undefined;\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n        rotation={customKnobs.enum.rotation()}\\n        showLegend\\n        showLegendExtra\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        stackAccessors={stackAccessors}\\n        data={data}\\n      />\\n      <BarSeries\\n        id=\\\"bars2\\\"\\n        displayValueSettings={displayValueSettings}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={[\\n          { x: 0, y: 2, g: 'a' },\\n          { x: 1, y: 7, g: 'a' },\\n          { x: 2, y: 3, g: 'a' },\\n          { x: 3, y: 6, g: 'a' },\\n          { x: 0, y: 4, g: 'b' },\\n          { x: 1, y: 5, g: 'b' },\\n          { x: 2, y: 8, g: 'b' },\\n          { x: 3, y: 2, g: 'b' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Settings, Chart, Position, ScaleType } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n  ];\\n  const data4 = [\\n    [1, 2],\\n    [2, 6],\\n    [3, 2],\\n    [4, 9],\\n  ];\\n  const data5 = [\\n    [1, 1],\\n    [2, 7],\\n    [3, 5],\\n    [4, 6],\\n  ];\\n  const useDifferentGroup = boolean('Apply a different groupId to some series', false);\\n  const useDefaultDomain = boolean('Use the same data domain for each group', false);\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left y\\\"\\n        title=\\\"Default groupId\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <Axis\\n        id=\\\"right y\\\"\\n        groupId={useDifferentGroup && !useDefaultDomain ? 'otherGroupId' : undefined}\\n        title={useDifferentGroup ? 'Other groupId' : 'Default groupId'}\\n        position={Position.Right}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\\n        useDefaultGroupDomain={useDefaultDomain}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data4}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar B\\\"\\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\\n        useDefaultGroupDomain={useDefaultDomain}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data5}\\n      />\\n      <BarSeries\\n        id=\\\"non stacked bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `You can group together series specifying a \\\\`groupId\\\\` prop on the series.\\nIn the case of barchart, series with the same \\\\`groupId\\\\` will be grouped and eventually stacked together.\\n\\nThe data Y domain of each group, specified by \\\\`groupId\\\\`, is computed independently. This is reflected also on the rendering\\nwhere the Y value position is scaled independently on the Y axis from the other groups. An axis with the same \\\\`groupId\\\\`\\nwill reflect that scale.\\n\\nUse \\\\`useDefaultGroupDomain\\\\` if the same domain is required on every series. If you sent a \\\\`boolean\\\\` value, it will use\\nthe group id applied by default on every series with no specific groupId. You can also pass a \\\\`string\\\\` to use a different \\\\`groupId\\\\`\\nsee next storybook example.\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":119},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":119}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Settings, Chart, Position, ScaleType } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 2],\n    [2, 2],\n    [3, 3],\n    [4, 5],\n  ];\n  const data2 = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n  ];\n  const data3 = [\n    [1, 6],\n    [2, 6],\n    [3, 3],\n    [4, 2],\n  ];\n  const data4 = [\n    [1, 2],\n    [2, 6],\n    [3, 2],\n    [4, 9],\n  ];\n  const data5 = [\n    [1, 1],\n    [2, 7],\n    [3, 5],\n    [4, 6],\n  ];\n  const useDifferentGroup = boolean('Apply a different groupId to some series', false);\n  const useDefaultDomain = boolean('Use the same data domain for each group', false);\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis\n        id=\"left y\"\n        title=\"Default groupId\"\n        position={Position.Left}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <Axis\n        id=\"right y\"\n        groupId={useDifferentGroup && !useDefaultDomain ? 'otherGroupId' : undefined}\n        title={useDifferentGroup ? 'Other groupId' : 'Default groupId'}\n        position={Position.Right}\n        tickFormat={(d: any) => Number(d).toFixed(2)}\n      />\n      <BarSeries\n        id=\"stacked bar 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data1}\n      />\n      <BarSeries\n        id=\"stacked bar 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data2}\n      />\n\n      <BarSeries\n        id=\"stacked bar A\"\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\n        useDefaultGroupDomain={useDefaultDomain}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data4}\n      />\n      <BarSeries\n        id=\"stacked bar B\"\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\n        useDefaultGroupDomain={useDefaultDomain}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        data={data5}\n      />\n      <BarSeries\n        id=\"non stacked bar\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can group together series specifying a \\`groupId\\` prop on the series.\nIn the case of barchart, series with the same \\`groupId\\` will be grouped and eventually stacked together.\n\nThe data Y domain of each group, specified by \\`groupId\\`, is computed independently. This is reflected also on the rendering\nwhere the Y value position is scaled independently on the Y axis from the other groups. An axis with the same \\`groupId\\`\nwill reflect that scale.\n\nUse \\`useDefaultGroupDomain\\` if the same domain is required on every series. If you sent a \\`boolean\\` value, it will use\nthe group id applied by default on every series with no specific groupId. You can also pass a \\`string\\` to use a different \\`groupId\\`\nsee next storybook example.\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 2],\\n    [2, 2],\\n    [3, 3],\\n    [4, 5],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n  ];\\n  const data3 = [\\n    [1, 6],\\n    [2, 6],\\n    [3, 3],\\n    [4, 2],\\n  ];\\n  const data4 = [\\n    [1, 2],\\n    [2, 6],\\n    [3, 2],\\n    [4, 9],\\n  ];\\n  const data5 = [\\n    [1, 1],\\n    [2, 7],\\n    [3, 5],\\n    [4, 6],\\n  ];\\n  const useDifferentGroup = boolean('Apply a different groupId to some series', false);\\n  const useDefaultDomain = boolean('Use the same data domain for each group', false);\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left y\\\"\\n        title=\\\"Default groupId\\\"\\n        position={Position.Left}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <Axis\\n        id=\\\"right y\\\"\\n        groupId={useDifferentGroup && !useDefaultDomain ? 'otherGroupId' : undefined}\\n        title={useDifferentGroup ? 'Other groupId' : 'Default groupId'}\\n        position={Position.Right}\\n        tickFormat={(d: any) => Number(d).toFixed(2)}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\\n        useDefaultGroupDomain={useDefaultDomain}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data4}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar B\\\"\\n        groupId={useDifferentGroup ? 'otherGroupId' : undefined}\\n        useDefaultGroupDomain={useDefaultDomain}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data5}\\n      />\\n      <BarSeries\\n        id=\\\"non stacked bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Settings, Chart, Position, ScaleType, DEFAULT_GLOBAL_ID } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 1],\\n    [2, 2],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 5],\\n  ];\\n  const data3 = [\\n    [1, 1],\\n    [2, 9],\\n  ];\\n  const groupId1 = select(\\n    'groupId used on blue series',\\n    {\\n      default: DEFAULT_GLOBAL_ID,\\n      group1: 'group1',\\n      group2: 'group2',\\n    },\\n    'group2',\\n  );\\n\\n  const groupId2 = select(\\n    'groupId used on red series',\\n    {\\n      default: DEFAULT_GLOBAL_ID,\\n      group1: 'group1',\\n      group2: 'group2',\\n    },\\n    'group2',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left y\\\" title=\\\"GREEN\\\" position={Position.Right} />\\n      <Axis id=\\\"right 1 y\\\" groupId={groupId1} title=\\\"BLUE\\\" position={Position.Right} />\\n      <Axis id=\\\"right 2 y\\\" groupId={groupId2} title=\\\"RED\\\" position={Position.Right} />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        groupId={groupId1}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId={groupId2}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `You can specify a \\\\`groupId\\\\` in the \\\\`useDefaultGroupDomain\\\\` prop.\\nThis will allows you to match and merge the data domain of two different groups and reuse it on multiple series group.\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Settings, Chart, Position, ScaleType, DEFAULT_GLOBAL_ID } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 1],\n    [2, 2],\n  ];\n  const data2 = [\n    [1, 1],\n    [2, 5],\n  ];\n  const data3 = [\n    [1, 1],\n    [2, 9],\n  ];\n  const groupId1 = select(\n    'groupId used on blue series',\n    {\n      default: DEFAULT_GLOBAL_ID,\n      group1: 'group1',\n      group2: 'group2',\n    },\n    'group2',\n  );\n\n  const groupId2 = select(\n    'groupId used on red series',\n    {\n      default: DEFAULT_GLOBAL_ID,\n      group1: 'group1',\n      group2: 'group2',\n    },\n    'group2',\n  );\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left y\" title=\"GREEN\" position={Position.Right} />\n      <Axis id=\"right 1 y\" groupId={groupId1} title=\"BLUE\" position={Position.Right} />\n      <Axis id=\"right 2 y\" groupId={groupId2} title=\"RED\" position={Position.Right} />\n      <BarSeries\n        id=\"stacked bar 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data1}\n      />\n      <BarSeries\n        id=\"stacked bar 2\"\n        groupId={groupId1}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data2}\n      />\n\n      <BarSeries\n        id=\"stacked bar A\"\n        groupId={groupId2}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can specify a \\`groupId\\` in the \\`useDefaultGroupDomain\\` prop.\nThis will allows you to match and merge the data domain of two different groups and reuse it on multiple series group.\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 1],\\n    [2, 2],\\n  ];\\n  const data2 = [\\n    [1, 1],\\n    [2, 5],\\n  ];\\n  const data3 = [\\n    [1, 1],\\n    [2, 9],\\n  ];\\n  const groupId1 = select(\\n    'groupId used on blue series',\\n    {\\n      default: DEFAULT_GLOBAL_ID,\\n      group1: 'group1',\\n      group2: 'group2',\\n    },\\n    'group2',\\n  );\\n\\n  const groupId2 = select(\\n    'groupId used on red series',\\n    {\\n      default: DEFAULT_GLOBAL_ID,\\n      group1: 'group1',\\n      group2: 'group2',\\n    },\\n    'group2',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left y\\\" title=\\\"GREEN\\\" position={Position.Right} />\\n      <Axis id=\\\"right 1 y\\\" groupId={groupId1} title=\\\"BLUE\\\" position={Position.Right} />\\n      <Axis id=\\\"right 2 y\\\" groupId={groupId2} title=\\\"RED\\\" position={Position.Right} />\\n      <BarSeries\\n        id=\\\"stacked bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"stacked bar 2\\\"\\n        groupId={groupId1}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data2}\\n      />\\n\\n      <BarSeries\\n        id=\\\"stacked bar A\\\"\\n        groupId={groupId2}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  AccessorFn,\\n  ElementClickListener,\\n  XYChartElementEvent,\\n} from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const xAccessorFn: AccessorFn = (d) => d.x;\\n  const yAccessorFn: AccessorFn = (d) => d.y;\\n  yAccessorFn.fieldName = text('y fn name', '') || undefined;\\n  const splitAccessorFn: AccessorFn = (d) => d.g2;\\n  splitAccessorFn.fieldName = text('split fn name', '') || undefined;\\n\\n  const onElementClick = ([[, { key }]]: XYChartElementEvent[]) => action('clicked series key')(key);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={onElementClick as ElementClickListener}\\n        showLegend\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={xAccessorFn}\\n        yAccessors={['y', yAccessorFn]}\\n        splitSeriesAccessors={['g1', splitAccessorFn]}\\n        data={TestDatasets.BARCHART_1Y2G}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `An \\\\`AccessorFn\\\\` can be used as any accessor including: \\\\`xAccessor\\\\`, \\\\`yAccessors\\\\`, \\\\`y0Accessors\\\\` and \\\\`splitSeriesAccessors\\\\`.\\n\\nThis enables serialization of complex values, without needing to transform raw data.\\n\\n\\\\`\\\\`\\\\`ts\\n// simple example\\nconst yAccessorFn: AccessorFn = (d) => d.y;\\nyAccessorFn.fieldName = 'simple y value';\\n\\n// complex example\\nconst yAccessorFn: AccessorFn = ({ range }) => \\\\`\\\\${range.to} - \\\\${range.from}\\\\`;\\nyAccessorFn.fieldName = 'complex y value';\\n\\\\`\\\\`\\\\`\\n\\nIf no \\\\`fieldName\\\\` is provided, the default value will be set using the index \\\\`(index:0)\\\\`.\\n\\nTry changing the \\\\`fieldName\\\\` for the y and split accessor functions in the storybook knobs.\\n\\n**Note: All \\\\`fieldName\\\\` and \\\\`Accessor\\\\` values should be unique. Any duplicated values will be ignored.**\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":60},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":60}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  AccessorFn,\n  ElementClickListener,\n  XYChartElementEvent,\n} from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const xAccessorFn: AccessorFn = (d) => d.x;\n  const yAccessorFn: AccessorFn = (d) => d.y;\n  yAccessorFn.fieldName = text('y fn name', '') || undefined;\n  const splitAccessorFn: AccessorFn = (d) => d.g2;\n  splitAccessorFn.fieldName = text('split fn name', '') || undefined;\n\n  const onElementClick = ([[, { key }]]: XYChartElementEvent[]) => action('clicked series key')(key);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onElementClick={onElementClick as ElementClickListener}\n        showLegend\n        legendPosition={Position.Right}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={xAccessorFn}\n        yAccessors={['y', yAccessorFn]}\n        splitSeriesAccessors={['g1', splitAccessorFn]}\n        data={TestDatasets.BARCHART_1Y2G}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `An \\`AccessorFn\\` can be used as any accessor including: \\`xAccessor\\`, \\`yAccessors\\`, \\`y0Accessors\\` and \\`splitSeriesAccessors\\`.\n\nThis enables serialization of complex values, without needing to transform raw data.\n\n\\`\\`\\`ts\n// simple example\nconst yAccessorFn: AccessorFn = (d) => d.y;\nyAccessorFn.fieldName = 'simple y value';\n\n// complex example\nconst yAccessorFn: AccessorFn = ({ range }) => \\`\\${range.to} - \\${range.from}\\`;\nyAccessorFn.fieldName = 'complex y value';\n\\`\\`\\`\n\nIf no \\`fieldName\\` is provided, the default value will be set using the index \\`(index:0)\\`.\n\nTry changing the \\`fieldName\\` for the y and split accessor functions in the storybook knobs.\n\n**Note: All \\`fieldName\\` and \\`Accessor\\` values should be unique. Any duplicated values will be ignored.**\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const xAccessorFn: AccessorFn = (d) => d.x;\\n  const yAccessorFn: AccessorFn = (d) => d.y;\\n  yAccessorFn.fieldName = text('y fn name', '') || undefined;\\n  const splitAccessorFn: AccessorFn = (d) => d.g2;\\n  splitAccessorFn.fieldName = text('split fn name', '') || undefined;\\n\\n  const onElementClick = ([[, { key }]]: XYChartElementEvent[]) => action('clicked series key')(key);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={onElementClick as ElementClickListener}\\n        showLegend\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={xAccessorFn}\\n        yAccessors={['y', yAccessorFn]}\\n        splitSeriesAccessors={['g1', splitAccessorFn]}\\n        data={TestDatasets.BARCHART_1Y2G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React, { useRef } from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip, TooltipProps } from '@elastic/charts';\\nimport { getRandomNumberGenerator, SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst rng = getRandomNumberGenerator();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showAxes = boolean('Show axes', false);\\n  const groups = number('Groups', 5, { min: 2, max: 20, step: 1 });\\n  const offset = number('Offset', 10, { min: 0, step: 1 });\\n  const data = dg.generateGroupedSeries(4, groups).map((d) => {\\n    return {\\n      ...d,\\n      y1: rng(0, 20),\\n      y2: rng(0, 20),\\n      g1: `dog ${d.g}`,\\n      g2: `cat ${d.g}`,\\n    };\\n  });\\n  const red = useRef<HTMLDivElement | null>(null);\\n  const white = useRef<HTMLDivElement | null>(null);\\n  const blue = useRef<HTMLDivElement | null>(null);\\n  const getBoundary: Record<string, TooltipProps['boundary'] | null> = {\\n    default: undefined,\\n    red: red.current,\\n    white: white.current,\\n    blue: blue.current,\\n    chart: 'chart',\\n    root: document.getElementById('story-root'),\\n  };\\n  const boundarySting = select<string>(\\n    'Boundary Element',\\n    {\\n      Default: 'default',\\n      'Root (blanchedalmond)': 'root',\\n      Red: 'red',\\n      White: 'white',\\n      Blue: 'blue',\\n      Chart: 'chart',\\n    },\\n    'default',\\n  );\\n  const boundary = getBoundary[boundarySting] ?? undefined;\\n  const boundaryPadding = {\\n    top: number('Boundary top padding', 0, { min: 0 }),\\n    right: number('Boundary right padding', 0, { min: 0 }),\\n    bottom: number('Boundary bottom padding', 0, { min: 0 }),\\n    left: number('Boundary left padding', 0, { min: 0 }),\\n  };\\n\\n  return (\\n    <div ref={red} style={{ backgroundColor: 'red', padding: 30, height: '100%' }}>\\n      <div ref={white} style={{ backgroundColor: 'white', padding: 30, height: '100%' }}>\\n        <div ref={blue} style={{ backgroundColor: 'blue', padding: 30, height: '100%' }}>\\n          <Chart title={title} description={description}>\\n            <Settings baseTheme={useBaseTheme()} />\\n            <Tooltip boundary={boundary} boundaryPadding={boundaryPadding} offset={offset} />\\n            <Axis id=\\\"bottom\\\" hide={!showAxes} position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n            <Axis\\n              id=\\\"left\\\"\\n              hide={!showAxes}\\n              title=\\\"Left axis\\\"\\n              position={Position.Left}\\n              tickFormat={(d: any) => Number(d).toFixed(2)}\\n            />\\n            <BarSeries\\n              id=\\\"bars\\\"\\n              xScaleType={ScaleType.Ordinal}\\n              yScaleType={ScaleType.Linear}\\n              xAccessor=\\\"x\\\"\\n              yAccessors={['y1', 'y2']}\\n              splitSeriesAccessors={['g1', 'g2']}\\n              data={data}\\n            />\\n          </Chart>\\n        </div>\\n      </div>\\n    </div>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React, { useRef } from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, Tooltip, TooltipProps } from '@elastic/charts';\nimport { getRandomNumberGenerator, SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst rng = getRandomNumberGenerator();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showAxes = boolean('Show axes', false);\n  const groups = number('Groups', 5, { min: 2, max: 20, step: 1 });\n  const offset = number('Offset', 10, { min: 0, step: 1 });\n  const data = dg.generateGroupedSeries(4, groups).map((d) => {\n    return {\n      ...d,\n      y1: rng(0, 20),\n      y2: rng(0, 20),\n      g1: `dog ${d.g}`,\n      g2: `cat ${d.g}`,\n    };\n  });\n  const red = useRef<HTMLDivElement | null>(null);\n  const white = useRef<HTMLDivElement | null>(null);\n  const blue = useRef<HTMLDivElement | null>(null);\n  const getBoundary: Record<string, TooltipProps['boundary'] | null> = {\n    default: undefined,\n    red: red.current,\n    white: white.current,\n    blue: blue.current,\n    chart: 'chart',\n    root: document.getElementById('story-root'),\n  };\n  const boundarySting = select<string>(\n    'Boundary Element',\n    {\n      Default: 'default',\n      'Root (blanchedalmond)': 'root',\n      Red: 'red',\n      White: 'white',\n      Blue: 'blue',\n      Chart: 'chart',\n    },\n    'default',\n  );\n  const boundary = getBoundary[boundarySting] ?? undefined;\n  const boundaryPadding = {\n    top: number('Boundary top padding', 0, { min: 0 }),\n    right: number('Boundary right padding', 0, { min: 0 }),\n    bottom: number('Boundary bottom padding', 0, { min: 0 }),\n    left: number('Boundary left padding', 0, { min: 0 }),\n  };\n\n  return (\n    <div ref={red} style={{ backgroundColor: 'red', padding: 30, height: '100%' }}>\n      <div ref={white} style={{ backgroundColor: 'white', padding: 30, height: '100%' }}>\n        <div ref={blue} style={{ backgroundColor: 'blue', padding: 30, height: '100%' }}>\n          <Chart title={title} description={description}>\n            <Settings baseTheme={useBaseTheme()} />\n            <Tooltip boundary={boundary} boundaryPadding={boundaryPadding} offset={offset} />\n            <Axis id=\"bottom\" hide={!showAxes} position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n            <Axis\n              id=\"left\"\n              hide={!showAxes}\n              title=\"Left axis\"\n              position={Position.Left}\n              tickFormat={(d: any) => Number(d).toFixed(2)}\n            />\n            <BarSeries\n              id=\"bars\"\n              xScaleType={ScaleType.Ordinal}\n              yScaleType={ScaleType.Linear}\n              xAccessor=\"x\"\n              yAccessors={['y1', 'y2']}\n              splitSeriesAccessors={['g1', 'g2']}\n              data={data}\n            />\n          </Chart>\n        </div>\n      </div>\n    </div>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showAxes = boolean('Show axes', false);\\n  const groups = number('Groups', 5, { min: 2, max: 20, step: 1 });\\n  const offset = number('Offset', 10, { min: 0, step: 1 });\\n  const data = dg.generateGroupedSeries(4, groups).map((d) => {\\n    return {\\n      ...d,\\n      y1: rng(0, 20),\\n      y2: rng(0, 20),\\n      g1: `dog ${d.g}`,\\n      g2: `cat ${d.g}`,\\n    };\\n  });\\n  const red = useRef<HTMLDivElement | null>(null);\\n  const white = useRef<HTMLDivElement | null>(null);\\n  const blue = useRef<HTMLDivElement | null>(null);\\n  const getBoundary: Record<string, TooltipProps['boundary'] | null> = {\\n    default: undefined,\\n    red: red.current,\\n    white: white.current,\\n    blue: blue.current,\\n    chart: 'chart',\\n    root: document.getElementById('story-root'),\\n  };\\n  const boundarySting = select<string>(\\n    'Boundary Element',\\n    {\\n      Default: 'default',\\n      'Root (blanchedalmond)': 'root',\\n      Red: 'red',\\n      White: 'white',\\n      Blue: 'blue',\\n      Chart: 'chart',\\n    },\\n    'default',\\n  );\\n  const boundary = getBoundary[boundarySting] ?? undefined;\\n  const boundaryPadding = {\\n    top: number('Boundary top padding', 0, { min: 0 }),\\n    right: number('Boundary right padding', 0, { min: 0 }),\\n    bottom: number('Boundary bottom padding', 0, { min: 0 }),\\n    left: number('Boundary left padding', 0, { min: 0 }),\\n  };\\n\\n  return (\\n    <div ref={red} style={{ backgroundColor: 'red', padding: 30, height: '100%' }}>\\n      <div ref={white} style={{ backgroundColor: 'white', padding: 30, height: '100%' }}>\\n        <div ref={blue} style={{ backgroundColor: 'blue', padding: 30, height: '100%' }}>\\n          <Chart title={title} description={description}>\\n            <Settings baseTheme={useBaseTheme()} />\\n            <Tooltip boundary={boundary} boundaryPadding={boundaryPadding} offset={offset} />\\n            <Axis id=\\\"bottom\\\" hide={!showAxes} position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n            <Axis\\n              id=\\\"left\\\"\\n              hide={!showAxes}\\n              title=\\\"Left axis\\\"\\n              position={Position.Left}\\n              tickFormat={(d: any) => Number(d).toFixed(2)}\\n            />\\n            <BarSeries\\n              id=\\\"bars\\\"\\n              xScaleType={ScaleType.Ordinal}\\n              yScaleType={ScaleType.Linear}\\n              xAccessor=\\\"x\\\"\\n              yAccessors={['y1', 'y2']}\\n              splitSeriesAccessors={['g1', 'g2']}\\n              data={data}\\n            />\\n          </Chart>\\n        </div>\\n      </div>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"right\\\" groupId=\\\"mainGroup\\\" position={Position.Left} ticks={5} />\\n\\n      <BarSeries\\n        id=\\\"groupB\\\"\\n        groupId=\\\"other\\\"\\n        useDefaultGroupDomain=\\\"mainGroup\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        yNice\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['g']}\\n        data={[\\n          { x: 'A', y: 10, g: 'ga' },\\n          { x: 'A', y: 10, g: 'gb' },\\n          { x: 'A', y: 10, g: 'gc' },\\n          { x: 'B', y: 10, g: 'ga' },\\n          { x: 'B', y: 10, g: 'gb' },\\n          { x: 'B', y: 10, g: 'gc' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"right\" groupId=\"mainGroup\" position={Position.Left} ticks={5} />\n\n      <BarSeries\n        id=\"groupB\"\n        groupId=\"other\"\n        useDefaultGroupDomain=\"mainGroup\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        yNice\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['g']}\n        data={[\n          { x: 'A', y: 10, g: 'ga' },\n          { x: 'A', y: 10, g: 'gb' },\n          { x: 'A', y: 10, g: 'gc' },\n          { x: 'B', y: 10, g: 'ga' },\n          { x: 'B', y: 10, g: 'gb' },\n          { x: 'B', y: 10, g: 'gc' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"right\\\" groupId=\\\"mainGroup\\\" position={Position.Left} ticks={5} />\\n\\n      <BarSeries\\n        id=\\\"groupB\\\"\\n        groupId=\\\"other\\\"\\n        useDefaultGroupDomain=\\\"mainGroup\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        yNice\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['g']}\\n        data={[\\n          { x: 'A', y: 10, g: 'ga' },\\n          { x: 'A', y: 10, g: 'gb' },\\n          { x: 'A', y: 10, g: 'gc' },\\n          { x: 'B', y: 10, g: 'ga' },\\n          { x: 'B', y: 10, g: 'gb' },\\n          { x: 'B', y: 10, g: 'gc' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings theme={useBaseTheme()} />\\n      <Axis id=\\\"count\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        barSeriesStyle={{\\n          rectBorder: {\\n            visible: true,\\n            strokeWidth: 10,\\n            stroke: 'black',\\n          },\\n        }}\\n        data={[\\n          { x: 'A', y: 0, val: 1222 },\\n          { x: 'B', y: 20, val: 1222 },\\n          { x: 'C', y: 750, val: 1222 },\\n          { x: 'D', y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings theme={useBaseTheme()} />\n      <Axis id=\"count\" title=\"count\" position={Position.Left} />\n      <Axis id=\"x\" title=\"goods\" position={Position.Bottom} />\n      <BarSeries\n        id=\"bars\"\n        name=\"amount\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        barSeriesStyle={{\n          rectBorder: {\n            visible: true,\n            strokeWidth: 10,\n            stroke: 'black',\n          },\n        }}\n        data={[\n          { x: 'A', y: 0, val: 1222 },\n          { x: 'B', y: 20, val: 1222 },\n          { x: 'C', y: 750, val: 1222 },\n          { x: 'D', y: 854, val: 1222 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings theme={useBaseTheme()} />\\n      <Axis id=\\\"count\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        barSeriesStyle={{\\n          rectBorder: {\\n            visible: true,\\n            strokeWidth: 10,\\n            stroke: 'black',\\n          },\\n        }}\\n        data={[\\n          { x: 'A', y: 0, val: 1222 },\\n          { x: 'B', y: 20, val: 1222 },\\n          { x: 'C', y: 750, val: 1222 },\\n          { x: 'D', y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\n\\nimport { BARCHART_1Y0G_LINEAR } from '../../../packages/charts/src/utils/data_samples/test_dataset';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: 15,\\n        fill: { textBorder: 2.5, color: 'white', borderColor: 'black' },\\n        alignment: {\\n          horizontal: select(\\n            'Horizontal alignment',\\n            {\\n              Default: undefined,\\n              Left: 'left',\\n              Center: 'center',\\n              Right: 'right',\\n            },\\n            undefined,\\n          ),\\n          vertical: select(\\n            'Vertical alignment',\\n            {\\n              Default: undefined,\\n              Top: 'top',\\n              Middle: 'middle',\\n              Bottom: 'bottom',\\n            },\\n            undefined,\\n          ),\\n        },\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        data={BARCHART_1Y0G_LINEAR}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        displayValueSettings={{ showValueLabel: true }}\\n      />\\n      <Axis id=\\\"bottom-axis\\\" position=\\\"bottom\\\" tickFormat={(d) => `${d} H`} />\\n      <Axis id=\\\"left-axis\\\" position=\\\"left\\\" tickFormat={(d) => `${d} V`} />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, ScaleType, Settings, PartialTheme } from '@elastic/charts';\n\nimport { BARCHART_1Y0G_LINEAR } from '../../../packages/charts/src/utils/data_samples/test_dataset';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    barSeriesStyle: {\n      displayValue: {\n        fontSize: 15,\n        fill: { textBorder: 2.5, color: 'white', borderColor: 'black' },\n        alignment: {\n          horizontal: select(\n            'Horizontal alignment',\n            {\n              Default: undefined,\n              Left: 'left',\n              Center: 'center',\n              Right: 'right',\n            },\n            undefined,\n          ),\n          vertical: select(\n            'Vertical alignment',\n            {\n              Default: undefined,\n              Top: 'top',\n              Middle: 'middle',\n              Bottom: 'bottom',\n            },\n            undefined,\n          ),\n        },\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\n      <BarSeries\n        id=\"bars\"\n        data={BARCHART_1Y0G_LINEAR}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        displayValueSettings={{ showValueLabel: true }}\n      />\n      <Axis id=\"bottom-axis\" position=\"bottom\" tickFormat={(d) => `${d} H`} />\n      <Axis id=\"left-axis\" position=\"left\" tickFormat={(d) => `${d} V`} />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      displayValue: {\\n        fontSize: 15,\\n        fill: { textBorder: 2.5, color: 'white', borderColor: 'black' },\\n        alignment: {\\n          horizontal: select(\\n            'Horizontal alignment',\\n            {\\n              Default: undefined,\\n              Left: 'left',\\n              Center: 'center',\\n              Right: 'right',\\n            },\\n            undefined,\\n          ),\\n          vertical: select(\\n            'Vertical alignment',\\n            {\\n              Default: undefined,\\n              Top: 'top',\\n              Middle: 'middle',\\n              Bottom: 'bottom',\\n            },\\n            undefined,\\n          ),\\n        },\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} rotation={customKnobs.enum.rotation()} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        data={BARCHART_1Y0G_LINEAR}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        displayValueSettings={{ showValueLabel: true }}\\n      />\\n      <Axis id=\\\"bottom-axis\\\" position=\\\"bottom\\\" tickFormat={(d) => `${d} H`} />\\n      <Axis id=\\\"left-axis\\\" position=\\\"left\\\" tickFormat={(d) => `${d} V`} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    scales: {\\n      histogramPadding: number('histogram padding', 0, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n      barsPadding: number('bar padding', 0, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 2 },\\n          { x: 2, y: 7 },\\n          { x: 4, y: 3 },\\n          { x: 9, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":56},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":56}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    scales: {\n      histogramPadding: number('histogram padding', 0, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      }),\n      barsPadding: number('bar padding', 0, {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      }),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 1, y: 2 },\n          { x: 2, y: 7 },\n          { x: 4, y: 3 },\n          { x: 9, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    scales: {\\n      histogramPadding: number('histogram padding', 0, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n      barsPadding: number('bar padding', 0, {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      }),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={customKnobs.enum.rotation()} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 2 },\\n          { x: 2, y: 7 },\\n          { x: 4, y: 3 },\\n          { x: 9, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      xDomain={{\\n        min: NaN,\\n        max: 100,\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 10, y: 7 },\\n        { x: 11.5, y: 9 },\\n        { x: 13.5, y: 3 },\\n        { x: 50, y: 6 },\\n        { x: 66, y: 13 },\\n        { x: 90, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      xDomain={{\n        min: NaN,\n        max: 100,\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 10, y: 7 },\n        { x: 11.5, y: 9 },\n        { x: 13.5, y: 3 },\n        { x: 50, y: 6 },\n        { x: 66, y: 13 },\n        { x: 90, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      xDomain={{\\n        min: NaN,\\n        max: 100,\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 10, y: 7 },\\n        { x: 11.5, y: 9 },\\n        { x: 13.5, y: 3 },\\n        { x: 50, y: 6 },\\n        { x: 66, y: 13 },\\n        { x: 90, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\n        tickFormat={formatter}\n      />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks={boolean('showOverlappingTicks bottom axis', false)}\\n        showOverlappingLabels={boolean('showOverlappingLabels bottom axis', false)}\\n        tickFormat={formatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left2\\\"\\n      domain={{\\n        min: NaN,\\n        max: NaN,\\n        fit: true,\\n      }}\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      tickFormat={(d: any) => Number(d).toFixed(2)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Log}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 1, y: 0 },\\n        { x: 2, y: 1 },\\n        { x: 3, y: 2 },\\n        { x: 4, y: 3 },\\n        { x: 5, y: 4 },\\n        { x: 6, y: 5 },\\n        { x: 7, y: 6 },\\n        { x: 8, y: 7 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis\n      id=\"left2\"\n      domain={{\n        min: NaN,\n        max: NaN,\n        fit: true,\n      }}\n      title=\"Left axis\"\n      position={Position.Left}\n      tickFormat={(d: any) => Number(d).toFixed(2)}\n    />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Log}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 1, y: 0 },\n        { x: 2, y: 1 },\n        { x: 3, y: 2 },\n        { x: 4, y: 3 },\n        { x: 5, y: 4 },\n        { x: 6, y: 5 },\n        { x: 7, y: 6 },\n        { x: 8, y: 7 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left2\\\"\\n      domain={{\\n        min: NaN,\\n        max: NaN,\\n        fit: true,\\n      }}\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      tickFormat={(d: any) => Number(d).toFixed(2)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Log}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 1, y: 0 },\\n        { x: 2, y: 1 },\\n        { x: 3, y: 2 },\\n        { x: 4, y: 3 },\\n        { x: 5, y: 4 },\\n        { x: 6, y: 5 },\\n        { x: 7, y: 6 },\\n        { x: 8, y: 7 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left2\\\"\\n      domain={{\\n        min: NaN,\\n        max: NaN,\\n        fit: true,\\n      }}\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      tickFormat={(d: any) => Number(d).toFixed(2)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Log}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 1, y: 0, g: 'a' },\\n        { x: 1, y: 0, g: 'b' },\\n        { x: 2, y: 1, g: 'a' },\\n        { x: 2, y: 1, g: 'b' },\\n        { x: 3, y: 2, g: 'a' },\\n        { x: 3, y: 2, g: 'b' },\\n        { x: 4, y: 3, g: 'a' },\\n        { x: 4, y: 0, g: 'b' },\\n        { x: 5, y: 4, g: 'a' },\\n        { x: 5, y: 0.5, g: 'b' },\\n        { x: 6, y: 5, g: 'a' },\\n        { x: 6, y: 1, g: 'b' },\\n        { x: 7, y: 6, g: 'b' },\\n        { x: 8, y: 7, g: 'a' },\\n        { x: 8, y: 10, g: 'b' },\\n        { x: 9, y: 4, g: 'a' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":60},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":60}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis\n      id=\"left2\"\n      domain={{\n        min: NaN,\n        max: NaN,\n        fit: true,\n      }}\n      title=\"Left axis\"\n      position={Position.Left}\n      tickFormat={(d: any) => Number(d).toFixed(2)}\n    />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Log}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      stackAccessors={['x']}\n      data={[\n        { x: 1, y: 0, g: 'a' },\n        { x: 1, y: 0, g: 'b' },\n        { x: 2, y: 1, g: 'a' },\n        { x: 2, y: 1, g: 'b' },\n        { x: 3, y: 2, g: 'a' },\n        { x: 3, y: 2, g: 'b' },\n        { x: 4, y: 3, g: 'a' },\n        { x: 4, y: 0, g: 'b' },\n        { x: 5, y: 4, g: 'a' },\n        { x: 5, y: 0.5, g: 'b' },\n        { x: 6, y: 5, g: 'a' },\n        { x: 6, y: 1, g: 'b' },\n        { x: 7, y: 6, g: 'b' },\n        { x: 8, y: 7, g: 'a' },\n        { x: 8, y: 10, g: 'b' },\n        { x: 9, y: 4, g: 'a' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis\\n      id=\\\"left2\\\"\\n      domain={{\\n        min: NaN,\\n        max: NaN,\\n        fit: true,\\n      }}\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      tickFormat={(d: any) => Number(d).toFixed(2)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Log}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 1, y: 0, g: 'a' },\\n        { x: 1, y: 0, g: 'b' },\\n        { x: 2, y: 1, g: 'a' },\\n        { x: 2, y: 1, g: 'b' },\\n        { x: 3, y: 2, g: 'a' },\\n        { x: 3, y: 2, g: 'b' },\\n        { x: 4, y: 3, g: 'a' },\\n        { x: 4, y: 0, g: 'b' },\\n        { x: 5, y: 4, g: 'a' },\\n        { x: 5, y: 0.5, g: 'b' },\\n        { x: 6, y: 5, g: 'a' },\\n        { x: 6, y: 1, g: 'b' },\\n        { x: 7, y: 6, g: 'b' },\\n        { x: 8, y: 7, g: 'a' },\\n        { x: 8, y: 10, g: 'b' },\\n        { x: 9, y: 4, g: 'a' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Bar Chart',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as withValueLabel } from './2_label_value.story';\nexport { Example as withValueLabelAdvanced } from './51_label_value_advanced.story';\nexport { Example as withAxis } from './3_with_axis.story';\nexport { Example as withOrdinalXAxis } from './4_ordinal.story';\nexport { Example as withLinearXAxis } from './5_linear.story';\nexport { Example as withLinearXAxisNoLinearInterval } from './6_linear_no_linear_interval.story';\nexport { Example as withTimeXAxis } from './7_with_time_xaxis.story';\nexport { Example as withLogYAxis } from './8_with_log_yaxis.story';\nexport { Example as withStackedLogYAxis } from './9_with_stacked_log.story';\n\nexport { Example as withAxisAndLegend } from './10_axis_and_legend.story';\nexport { Example as stackedWithAxisAndLegend } from './11_stacked_with_axis_and_legend.story';\nexport { Example as stackedAsPercentage } from './12_stacked_as_percentage.story';\nexport { Example as clusteredWithAxisAndLegend } from './13_clustered.story';\nexport { Example as clusteredMultipleSeriesSpecs } from './14_clustered_multiple.story';\nexport { Example as timeClusteredUsingVariousSpecs } from './15_time_clustered.story';\nexport { Example as timeStackedUsingVariousSpecs } from './17_time_stacked.story';\nexport { Example as barChart1y0g } from './18_bar_chart_1y0g.story';\nexport { Example as barChart1y1g } from './19_bar_chart_1y1g.story';\n\nexport { Example as barChart1y2g } from './20_bar_chart_1y2g.story';\nexport { Example as barChart2y0g } from './21_bar_chart_2y0g.story';\nexport { Example as barChart2y1g } from './22_barchart_2y1g.story';\nexport { Example as barChart2y2g } from './23_bar_chart_2y2g.story';\nexport { Example as tooltipSeriesVisibility } from './24_tooltip_visibility.story';\nexport { Example as withHighDataVolume } from './25_high_data_volume.story';\nexport { Example as singleDataChartLinear } from './26_single_data_linear.story';\nexport { Example as singleDataChartOrdinal } from './27_single_data_ordinal.story';\nexport { Example as singleDataClusteredChart } from './28_single_data_clustered.story';\nexport { Example as singleDataStackedChart } from './29_single_data_stacked.story';\n\nexport { Example as stackedToExtent } from './30_stacked_to_extent.story';\nexport { Example as negativeAndPositiveXValues } from './31_negative_and_positive_x_values.story';\nexport { Example as scaleToExtent } from './32_scale_to_extent.story';\nexport { Example as bandBarChart } from './33_band_bar.story';\nexport { Example as minHeight } from './45_min_height.story';\nexport { Example as stackedOnlyGrouped } from './47_stacked_only_grouped.story';\nexport { Example as dualAxisSameYDomain } from './52_multi_group_same_domain.story';\nexport { Example as specifyDomainFromDifferentGroup } from './53_use_domain_from_different_groupid.story';\nexport { Example as orderBinsBySum } from './50_order_bins_by_sum.story';\nexport { Example as functionalAccessors } from './54_functional_accessors.story';\n\n// for testing purposes only\nexport { Example as testLinear } from './34_test_linear.story';\nexport { Example as testTime } from './35_test_time.story';\nexport { Example as testLinearClustered } from './36_test_linear_clustered.story';\nexport { Example as testTimeClustered } from './37_test_time_clustered.story';\nexport { Example as testClusteredBarChartWithNullBars } from './38_test_clustered_null_bars.story';\nexport { Example as testStackedBarChartWithNullBars } from './39_test_stacked_null.story';\nexport { Example as testSwitchOrdinalLinearAxis } from './40_test_switch.story';\nexport { Example as testHistogramModeLinear } from './41_test_histogram_linear.story';\nexport { Example as testHistogramModeOrdinal } from './42_test_histogram_ordinal.story';\nexport { Example as testDiscover } from './43_test_discover.story';\nexport { Example as testSingleHistogramBarChart } from './44_test_single_histogram.story';\nexport { Example as testMinHeightPositiveAndNegativeValues } from './46_test_min_height.story';\nexport { Example as testTooltipAndRotation } from './48_test_tooltip.story';\nexport { Example as tooltipBoundary } from './55_tooltip_boundary.story';\nexport { Example as testDualYAxis } from './49_test_dual_axis.story';\nexport { Example as testUseDefaultGroupDomain } from './56_test_use_dfl_gdomain.story';\nexport { Example as testRectBorder } from './57_test_rect_border_bars.story';\nexport { Example as dataValue } from './58_data_values.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  BubbleSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  TooltipType,\\n  PointShape,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data = dg.generateRandomSeries(100);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 20, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n  const shape = select<PointShape>('shape', PointShape, PointShape.Circle);\\n  const opacity = number('shape fill opacity', 1, {\\n    range: true,\\n    min: 0,\\n    max: 1,\\n    step: 0.01,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        bubbleSeriesStyle={{\\n          point: {\\n            shape,\\n            opacity,\\n          },\\n        }}\\n        data={data.slice(0, size)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  BubbleSeries,\n  Position,\n  ScaleType,\n  Settings,\n  TooltipType,\n  PointShape,\n  Tooltip,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data = dg.generateRandomSeries(100);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n  const size = number('total points', 20, {\n    range: true,\n    min: 10,\n    max: 100,\n    step: 10,\n  });\n  const shape = select<PointShape>('shape', PointShape, PointShape.Circle);\n  const opacity = number('shape fill opacity', 1, {\n    range: true,\n    min: 0,\n    max: 1,\n    step: 0.01,\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{\n          markSizeRatio,\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Tooltip type={TooltipType.Follow} snap={false} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BubbleSeries\n        id=\"bubbles\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        bubbleSeriesStyle={{\n          point: {\n            shape,\n            opacity,\n          },\n        }}\n        data={data.slice(0, size)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 20, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n  const shape = select<PointShape>('shape', PointShape, PointShape.Circle);\\n  const opacity = number('shape fill opacity', 1, {\\n    range: true,\\n    min: 0,\\n    max: 1,\\n    step: 0.01,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        bubbleSeriesStyle={{\\n          point: {\\n            shape,\\n            opacity,\\n          },\\n        }}\\n        data={data.slice(0, size)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType, Tooltip } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\nconst data = new Array(100).fill(0).map(() => ({\\n  x: String.fromCharCode(rng(97, 122)),\\n  y: rng(0, 100),\\n  z: rng(0, 100),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 30, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data.slice(0, size)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":71},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":71}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType, Tooltip } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\nconst data = new Array(100).fill(0).map(() => ({\n  x: String.fromCharCode(rng(97, 122)),\n  y: rng(0, 100),\n  z: rng(0, 100),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n  const size = number('total points', 30, {\n    range: true,\n    min: 10,\n    max: 100,\n    step: 10,\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          markSizeRatio,\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Tooltip type={TooltipType.Follow} snap={false} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BubbleSeries\n        id=\"bubbles\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={data.slice(0, size)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 30, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data.slice(0, size)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType, Tooltip } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 20, {\\n    range: true,\\n    min: 10,\\n    max: 50,\\n    step: 5,\\n  });\\n  const data = dg.generateRandomGroupedSeries(size, 4);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, TooltipType, Tooltip } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n  const size = number('total points', 20, {\n    range: true,\n    min: 10,\n    max: 50,\n    step: 5,\n  });\n  const data = dg.generateRandomGroupedSeries(size, 4);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{\n          markSizeRatio,\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Tooltip type={TooltipType.Follow} snap={false} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BubbleSeries\n        id=\"bubbles\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        markSizeAccessor=\"z\"\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('total points', 20, {\\n    range: true,\\n    min: 10,\\n    max: 50,\\n    step: 5,\\n  });\\n  const data = dg.generateRandomGroupedSeries(size, 4);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Tooltip type={TooltipType.Follow} snap={false} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, LineSeries } from '@elastic/charts';\\nimport { SeededDataGenerator, getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst rng = getRandomNumberGenerator();\\nconst lineData = dg.generateGroupedSeries(100, 2);\\nconst bubbleData = new Array(100).fill(0).map((_, i) => ({\\n  x: i,\\n  y: rng(0, 10),\\n  z: rng(0, 100),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n          bubbleSeriesStyle: {\\n            point: {\\n              fill: 'transparent',\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={bubbleData}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={lineData}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":81},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":81}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, BubbleSeries, Position, ScaleType, Settings, LineSeries } from '@elastic/charts';\nimport { SeededDataGenerator, getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst rng = getRandomNumberGenerator();\nconst lineData = dg.generateGroupedSeries(100, 2);\nconst bubbleData = new Array(100).fill(0).map((_, i) => ({\n  x: i,\n  y: rng(0, 10),\n  z: rng(0, 100),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{\n          markSizeRatio,\n          bubbleSeriesStyle: {\n            point: {\n              fill: 'transparent',\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BubbleSeries\n        id=\"bubbles\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={bubbleData}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={lineData}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n          bubbleSeriesStyle: {\\n            point: {\\n              fill: 'transparent',\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={bubbleData}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={lineData}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Bubble Chart (@alpha)',\n};\n\nexport { Example as simple } from './1_simple.story';\nexport { Example as ordinal } from './2_ordinal.story';\nexport { Example as multiple } from './3_multiple.story';\nexport { Example as mixed } from './4_mixed.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { text, number, boolean } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\nimport { customKnobs } from '../utils/knobs';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('Enable debug state', false);\\n  const bulletTitle = text('title', 'Error rate', 'General');\\n  const subtitle = text('subtitle', '', 'General');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\\n  const format = text('format (numeraljs)', '0.[0]', 'General');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\\n\\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\\n  const tickStrategy = customKnobs.multiSelect(\\n    'tick strategy',\\n    {\\n      Auto: 'auto',\\n      TickCount: 'count',\\n      TickPlacements: 'placements',\\n    },\\n    'auto',\\n    'select',\\n    'Ticks',\\n  );\\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\\n  const tickPlacements = customKnobs.numbersArray(\\n    'ticks(placements)',\\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\\n    undefined,\\n    'Ticks',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Bullet\\n        id=\\\"bullet\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: bulletTitle,\\n              subtitle,\\n              domain: [start, end],\\n              niceDomain,\\n              ticks:\\n                tickStrategy[0] === 'count'\\n                  ? ticks\\n                  : tickStrategy[0] === 'placements'\\n                    ? () => tickPlacements\\n                    : undefined,\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 500,\\n    height: 500,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":88},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":88}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { text, number, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { customKnobs } from '../utils/knobs';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('Enable debug state', false);\n  const bulletTitle = text('title', 'Error rate', 'General');\n  const subtitle = text('subtitle', '', 'General');\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\n  const format = text('format (numeraljs)', '0.[0]', 'General');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\n\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\n  const tickStrategy = customKnobs.multiSelect(\n    'tick strategy',\n    {\n      Auto: 'auto',\n      TickCount: 'count',\n      TickPlacements: 'placements',\n    },\n    'auto',\n    'select',\n    'Ticks',\n  );\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\n  const tickPlacements = customKnobs.numbersArray(\n    'ticks(placements)',\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\n    undefined,\n    'Ticks',\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        baseTheme={useBaseTheme()}\n      />\n      <Bullet\n        id=\"bullet\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: bulletTitle,\n              subtitle,\n              domain: [start, end],\n              niceDomain,\n              ticks:\n                tickStrategy[0] === 'count'\n                  ? ticks\n                  : tickStrategy[0] === 'placements'\n                    ? () => tickPlacements\n                    : undefined,\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 500,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('Enable debug state', false);\\n  const bulletTitle = text('title', 'Error rate', 'General');\\n  const subtitle = text('subtitle', '', 'General');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'General');\\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'General');\\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'General');\\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'General');\\n  const format = text('format (numeraljs)', '0.[0]', 'General');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal, { group: 'General' });\\n\\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\\n  const tickStrategy = customKnobs.multiSelect(\\n    'tick strategy',\\n    {\\n      Auto: 'auto',\\n      TickCount: 'count',\\n      TickPlacements: 'placements',\\n    },\\n    'auto',\\n    'select',\\n    'Ticks',\\n  );\\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\\n  const tickPlacements = customKnobs.numbersArray(\\n    'ticks(placements)',\\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\\n    undefined,\\n    'Ticks',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Bullet\\n        id=\\\"bullet\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: bulletTitle,\\n              subtitle,\\n              domain: [start, end],\\n              niceDomain,\\n              ticks:\\n                tickStrategy[0] === 'count'\\n                  ? ticks\\n                  : tickStrategy[0] === 'placements'\\n                    ? () => tickPlacements\\n                    : undefined,\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { text, number, boolean } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const bulletTitle = text('title', 'A Nice Title');\\n  const subtitle = text('subtitle', 'Subtitle');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 });\\n  const target = number('target', 75, { range: true, min: -200, max: 200 });\\n  const start = number('start', 0, { range: true, min: -200, max: 200 });\\n  const end = number('end', 100, { range: true, min: -200, max: 200 });\\n  const tickSnapStep = number('active tick step', 0, { min: 0, max: 10 });\\n  const angularTickLabelPadding = number('tick label padding', 10, { range: true, min: 0, max: 50 });\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.twoThirdsCircle, {\\n    exclude: ['vertical', 'horizontal'],\\n  });\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          bulletGraph: {\\n            angularTickLabelPadding,\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n      />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        tickSnapStep={tickSnapStep}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: bulletTitle,\\n              subtitle,\\n              domain: [start, end],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 500,\\n    height: 500,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { text, number, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const bulletTitle = text('title', 'A Nice Title');\n  const subtitle = text('subtitle', 'Subtitle');\n  const value = number('value', 56, { range: true, min: -200, max: 200 });\n  const target = number('target', 75, { range: true, min: -200, max: 200 });\n  const start = number('start', 0, { range: true, min: -200, max: 200 });\n  const end = number('end', 100, { range: true, min: -200, max: 200 });\n  const tickSnapStep = number('active tick step', 0, { min: 0, max: 10 });\n  const angularTickLabelPadding = number('tick label padding', 10, { range: true, min: 0, max: 50 });\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.twoThirdsCircle, {\n    exclude: ['vertical', 'horizontal'],\n  });\n  const format = text('format', '0');\n  const formatter = (d: number) => numeral(d).format(format);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          bulletGraph: {\n            angularTickLabelPadding,\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={debug}\n      />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        tickSnapStep={tickSnapStep}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: bulletTitle,\n              subtitle,\n              domain: [start, end],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 500,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const bulletTitle = text('title', 'A Nice Title');\\n  const subtitle = text('subtitle', 'Subtitle');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 });\\n  const target = number('target', 75, { range: true, min: -200, max: 200 });\\n  const start = number('start', 0, { range: true, min: -200, max: 200 });\\n  const end = number('end', 100, { range: true, min: -200, max: 200 });\\n  const tickSnapStep = number('active tick step', 0, { min: 0, max: 10 });\\n  const angularTickLabelPadding = number('tick label padding', 10, { range: true, min: 0, max: 50 });\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.twoThirdsCircle, {\\n    exclude: ['vertical', 'horizontal'],\\n  });\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          bulletGraph: {\\n            angularTickLabelPadding,\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={debug}\\n      />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        tickSnapStep={tickSnapStep}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: bulletTitle,\\n              subtitle,\\n              domain: [start, end],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport {\\n  euiPaletteColorBlind,\\n  euiPaletteComplementary,\\n  euiPaletteCool,\\n  euiPaletteForDarkBackground,\\n  euiPaletteForLightBackground,\\n  euiPaletteForStatus,\\n  euiPaletteForTemperature,\\n  euiPaletteGray,\\n  euiPaletteNegative,\\n  euiPalettePositive,\\n  euiPaletteWarm,\\n} from '@elastic/eui';\\nimport { number, boolean, object, color } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React, { useCallback } from 'react';\\n\\nimport {\\n  Chart,\\n  Bullet,\\n  BulletSubtype,\\n  Settings,\\n  BulletColorConfig,\\n  ColorBandSimpleConfig,\\n  ColorBandComplexConfig,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme, useThemeId } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const isDarkTheme = useThemeId().includes('dark');\\n  const getPalettes = useCallback(\\n    (steps: number) => [\\n      ['#164863', '#427D9D', '#9BBEC8', '#DDF2FD'],\\n      ['#F1EAFF', '#E5D4FF', '#DCBFFF', '#D0A2F7'],\\n      ['#0802A3', '#FF4B91', '#FF7676', '#FFCD4B'],\\n      euiPaletteColorBlind(),\\n      isDarkTheme ? euiPaletteForDarkBackground() : euiPaletteForLightBackground(),\\n      euiPaletteForTemperature(steps),\\n      euiPaletteForStatus(steps),\\n      euiPaletteComplementary(steps),\\n      euiPaletteNegative(steps),\\n      euiPalettePositive(steps),\\n      euiPaletteCool(steps),\\n      euiPaletteWarm(steps),\\n      euiPaletteGray(steps),\\n    ],\\n    [isDarkTheme],\\n  );\\n\\n  // Colors\\n  const colorOptionIndex = getKnobFromEnum(\\n    'color config',\\n    {\\n      '1 Single Color': 1,\\n      '2 Array of Colors via palettes': 2,\\n      '3 Array with options': 3,\\n      '4 Fully custom bands': 4,\\n    },\\n    1,\\n    { group: 'Color Bands' },\\n  );\\n  const colorBands1 = color('Config 1 - Color', 'RGBA(70, 130, 96, 1)', 'Color Bands');\\n  const colorBands2 = getKnobFromEnum(\\n    'Config 2 - Palette',\\n    {\\n      Navy: 0,\\n      Pink: 1,\\n      Mixed: 2,\\n      'eui Palette color blind': 3,\\n      'eui Palette For Temperature': 4,\\n      'eui Palette For Status': 5,\\n      'eui Palette Complementary': 6,\\n      'eui Palette Negative': 7,\\n      'eui Palette Positive': 8,\\n      'eui Palette Cool': 9,\\n      'eui Palette Warm': 10,\\n      'eui Palette Gray': 11,\\n    },\\n    0,\\n    { group: 'Color Bands' },\\n  );\\n  const colorBands2Steps = number('Config 2 - Steps', 5, { min: 1, max: 10, range: true, step: 1 }, 'Color Bands');\\n  const colorBands2Reverse = boolean('Config 2 - Reverse', false, 'Color Bands');\\n\\n  const colorBands3 = object<ColorBandSimpleConfig>(\\n    'Config 3 - json',\\n    {\\n      steps: 5,\\n      colors: ['pink', 'yellow', 'blue'],\\n    },\\n    'Color Bands',\\n  );\\n  const colorBands4 = object<ColorBandComplexConfig>(\\n    'Config 4 - json',\\n    [\\n      { color: 'red', gte: 0, lt: 20 },\\n      { color: 'green', gte: 20, lte: 40 },\\n      {\\n        color: 'blue',\\n        gt: 40,\\n        lte: {\\n          type: 'percentage',\\n          value: 100,\\n        },\\n      },\\n    ],\\n    'Color Bands',\\n  );\\n  const palette = getPalettes(colorBands2Steps)[colorBands2];\\n  const colorOptions = [, [colorBands1], colorBands2Reverse ? palette.reverse() : palette, colorBands3, colorBands4];\\n\\n  // Domain\\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'Domain');\\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'Domain');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'Domain');\\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'Domain');\\n\\n  // Ticks\\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\\n  const tickStrategy = customKnobs.multiSelect(\\n    'tick strategy',\\n    {\\n      Auto: 'auto',\\n      TickCount: 'count',\\n      TickPlacements: 'placements',\\n    },\\n    'auto',\\n    'select',\\n    'Ticks',\\n  );\\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\\n  const tickPlacements = customKnobs.numbersArray(\\n    'ticks(placements)',\\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\\n    undefined,\\n    'Ticks',\\n  );\\n\\n  // Other\\n  const debug = boolean('debug', false);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\\n\\n  const formatter = (d: number) => numeral(d).format('0.[0]');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\\n      <Bullet\\n        id=\\\"bullet\\\"\\n        subtype={subtype}\\n        colorBands={colorOptions[colorOptionIndex] as BulletColorConfig}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: 'The Title',\\n              subtitle: 'The Subtitle',\\n              domain: [start, end],\\n              niceDomain,\\n              ticks:\\n                tickStrategy[0] === 'count'\\n                  ? ticks\\n                  : tickStrategy[0] === 'placements'\\n                    ? () => tickPlacements\\n                    : undefined,\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 500,\\n    height: 500,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":41},\"endLoc\":{\"col\":1,\"line\":187},\"startBody\":{\"col\":36,\"line\":41},\"endBody\":{\"col\":1,\"line\":187}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  euiPaletteColorBlind,\n  euiPaletteComplementary,\n  euiPaletteCool,\n  euiPaletteForDarkBackground,\n  euiPaletteForLightBackground,\n  euiPaletteForStatus,\n  euiPaletteForTemperature,\n  euiPaletteGray,\n  euiPaletteNegative,\n  euiPalettePositive,\n  euiPaletteWarm,\n} from '@elastic/eui';\nimport { number, boolean, object, color } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React, { useCallback } from 'react';\n\nimport {\n  Chart,\n  Bullet,\n  BulletSubtype,\n  Settings,\n  BulletColorConfig,\n  ColorBandSimpleConfig,\n  ColorBandComplexConfig,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme, useThemeId } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const isDarkTheme = useThemeId().includes('dark');\n  const getPalettes = useCallback(\n    (steps: number) => [\n      ['#164863', '#427D9D', '#9BBEC8', '#DDF2FD'],\n      ['#F1EAFF', '#E5D4FF', '#DCBFFF', '#D0A2F7'],\n      ['#0802A3', '#FF4B91', '#FF7676', '#FFCD4B'],\n      euiPaletteColorBlind(),\n      isDarkTheme ? euiPaletteForDarkBackground() : euiPaletteForLightBackground(),\n      euiPaletteForTemperature(steps),\n      euiPaletteForStatus(steps),\n      euiPaletteComplementary(steps),\n      euiPaletteNegative(steps),\n      euiPalettePositive(steps),\n      euiPaletteCool(steps),\n      euiPaletteWarm(steps),\n      euiPaletteGray(steps),\n    ],\n    [isDarkTheme],\n  );\n\n  // Colors\n  const colorOptionIndex = getKnobFromEnum(\n    'color config',\n    {\n      '1 Single Color': 1,\n      '2 Array of Colors via palettes': 2,\n      '3 Array with options': 3,\n      '4 Fully custom bands': 4,\n    },\n    1,\n    { group: 'Color Bands' },\n  );\n  const colorBands1 = color('Config 1 - Color', 'RGBA(70, 130, 96, 1)', 'Color Bands');\n  const colorBands2 = getKnobFromEnum(\n    'Config 2 - Palette',\n    {\n      Navy: 0,\n      Pink: 1,\n      Mixed: 2,\n      'eui Palette color blind': 3,\n      'eui Palette For Temperature': 4,\n      'eui Palette For Status': 5,\n      'eui Palette Complementary': 6,\n      'eui Palette Negative': 7,\n      'eui Palette Positive': 8,\n      'eui Palette Cool': 9,\n      'eui Palette Warm': 10,\n      'eui Palette Gray': 11,\n    },\n    0,\n    { group: 'Color Bands' },\n  );\n  const colorBands2Steps = number('Config 2 - Steps', 5, { min: 1, max: 10, range: true, step: 1 }, 'Color Bands');\n  const colorBands2Reverse = boolean('Config 2 - Reverse', false, 'Color Bands');\n\n  const colorBands3 = object<ColorBandSimpleConfig>(\n    'Config 3 - json',\n    {\n      steps: 5,\n      colors: ['pink', 'yellow', 'blue'],\n    },\n    'Color Bands',\n  );\n  const colorBands4 = object<ColorBandComplexConfig>(\n    'Config 4 - json',\n    [\n      { color: 'red', gte: 0, lt: 20 },\n      { color: 'green', gte: 20, lte: 40 },\n      {\n        color: 'blue',\n        gt: 40,\n        lte: {\n          type: 'percentage',\n          value: 100,\n        },\n      },\n    ],\n    'Color Bands',\n  );\n  const palette = getPalettes(colorBands2Steps)[colorBands2];\n  const colorOptions = [, [colorBands1], colorBands2Reverse ? palette.reverse() : palette, colorBands3, colorBands4];\n\n  // Domain\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'Domain');\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'Domain');\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'Domain');\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'Domain');\n\n  // Ticks\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\n  const tickStrategy = customKnobs.multiSelect(\n    'tick strategy',\n    {\n      Auto: 'auto',\n      TickCount: 'count',\n      TickPlacements: 'placements',\n    },\n    'auto',\n    'select',\n    'Ticks',\n  );\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\n  const tickPlacements = customKnobs.numbersArray(\n    'ticks(placements)',\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\n    undefined,\n    'Ticks',\n  );\n\n  // Other\n  const debug = boolean('debug', false);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\n\n  const formatter = (d: number) => numeral(d).format('0.[0]');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\n      <Bullet\n        id=\"bullet\"\n        subtype={subtype}\n        colorBands={colorOptions[colorOptionIndex] as BulletColorConfig}\n        data={[\n          [\n            {\n              target,\n              value,\n              title: 'The Title',\n              subtitle: 'The Subtitle',\n              domain: [start, end],\n              niceDomain,\n              ticks:\n                tickStrategy[0] === 'count'\n                  ? ticks\n                  : tickStrategy[0] === 'placements'\n                    ? () => tickPlacements\n                    : undefined,\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 500,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const isDarkTheme = useThemeId().includes('dark');\\n  const getPalettes = useCallback(\\n    (steps: number) => [\\n      ['#164863', '#427D9D', '#9BBEC8', '#DDF2FD'],\\n      ['#F1EAFF', '#E5D4FF', '#DCBFFF', '#D0A2F7'],\\n      ['#0802A3', '#FF4B91', '#FF7676', '#FFCD4B'],\\n      euiPaletteColorBlind(),\\n      isDarkTheme ? euiPaletteForDarkBackground() : euiPaletteForLightBackground(),\\n      euiPaletteForTemperature(steps),\\n      euiPaletteForStatus(steps),\\n      euiPaletteComplementary(steps),\\n      euiPaletteNegative(steps),\\n      euiPalettePositive(steps),\\n      euiPaletteCool(steps),\\n      euiPaletteWarm(steps),\\n      euiPaletteGray(steps),\\n    ],\\n    [isDarkTheme],\\n  );\\n\\n  // Colors\\n  const colorOptionIndex = getKnobFromEnum(\\n    'color config',\\n    {\\n      '1 Single Color': 1,\\n      '2 Array of Colors via palettes': 2,\\n      '3 Array with options': 3,\\n      '4 Fully custom bands': 4,\\n    },\\n    1,\\n    { group: 'Color Bands' },\\n  );\\n  const colorBands1 = color('Config 1 - Color', 'RGBA(70, 130, 96, 1)', 'Color Bands');\\n  const colorBands2 = getKnobFromEnum(\\n    'Config 2 - Palette',\\n    {\\n      Navy: 0,\\n      Pink: 1,\\n      Mixed: 2,\\n      'eui Palette color blind': 3,\\n      'eui Palette For Temperature': 4,\\n      'eui Palette For Status': 5,\\n      'eui Palette Complementary': 6,\\n      'eui Palette Negative': 7,\\n      'eui Palette Positive': 8,\\n      'eui Palette Cool': 9,\\n      'eui Palette Warm': 10,\\n      'eui Palette Gray': 11,\\n    },\\n    0,\\n    { group: 'Color Bands' },\\n  );\\n  const colorBands2Steps = number('Config 2 - Steps', 5, { min: 1, max: 10, range: true, step: 1 }, 'Color Bands');\\n  const colorBands2Reverse = boolean('Config 2 - Reverse', false, 'Color Bands');\\n\\n  const colorBands3 = object<ColorBandSimpleConfig>(\\n    'Config 3 - json',\\n    {\\n      steps: 5,\\n      colors: ['pink', 'yellow', 'blue'],\\n    },\\n    'Color Bands',\\n  );\\n  const colorBands4 = object<ColorBandComplexConfig>(\\n    'Config 4 - json',\\n    [\\n      { color: 'red', gte: 0, lt: 20 },\\n      { color: 'green', gte: 20, lte: 40 },\\n      {\\n        color: 'blue',\\n        gt: 40,\\n        lte: {\\n          type: 'percentage',\\n          value: 100,\\n        },\\n      },\\n    ],\\n    'Color Bands',\\n  );\\n  const palette = getPalettes(colorBands2Steps)[colorBands2];\\n  const colorOptions = [, [colorBands1], colorBands2Reverse ? palette.reverse() : palette, colorBands3, colorBands4];\\n\\n  // Domain\\n  const start = number('start', 0, { range: true, min: -200, max: 200 }, 'Domain');\\n  const end = number('end', 100, { range: true, min: -200, max: 200 }, 'Domain');\\n  const value = number('value', 56, { range: true, min: -200, max: 200 }, 'Domain');\\n  const target = number('target', 75, { range: true, min: -200, max: 200 }, 'Domain');\\n\\n  // Ticks\\n  const niceDomain = boolean('niceDomain', false, 'Ticks');\\n  const tickStrategy = customKnobs.multiSelect(\\n    'tick strategy',\\n    {\\n      Auto: 'auto',\\n      TickCount: 'count',\\n      TickPlacements: 'placements',\\n    },\\n    'auto',\\n    'select',\\n    'Ticks',\\n  );\\n  const ticks = number('ticks(approx. count)', 5, { min: 0, step: 1 }, 'Ticks');\\n  const tickPlacements = customKnobs.numbersArray(\\n    'ticks(placements)',\\n    [-200, -100, 0, 5, 10, 15, 20, 25, 50, 100, 200],\\n    undefined,\\n    'Ticks',\\n  );\\n\\n  // Other\\n  const debug = boolean('debug', false);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\\n\\n  const formatter = (d: number) => numeral(d).format('0.[0]');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} baseTheme={useBaseTheme()} />\\n      <Bullet\\n        id=\\\"bullet\\\"\\n        subtype={subtype}\\n        colorBands={colorOptions[colorOptionIndex] as BulletColorConfig}\\n        data={[\\n          [\\n            {\\n              target,\\n              value,\\n              title: 'The Title',\\n              subtitle: 'The Subtitle',\\n              domain: [start, end],\\n              niceDomain,\\n              ticks:\\n                tickStrategy[0] === 'count'\\n                  ? ticks\\n                  : tickStrategy[0] === 'placements'\\n                    ? () => tickPlacements\\n                    : undefined,\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              target: 85,\\n              value: 23,\\n              title: 'CPU',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 75,\\n              value: 98,\\n              title: 'Memory',\\n              // subtitle: 'percent',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 25,\\n              value: 35.5,\\n              title: 'Network In',\\n              subtitle: 'bandwidth',\\n              domain: [0, 200],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 25,\\n              value: 91,\\n              title: 'Network out',\\n              subtitle: 'available (percent)',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 600,\\n    height: 270,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const format = text('format', '0');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              target: 85,\n              value: 23,\n              title: 'CPU',\n              domain: [0, 100],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n            {\n              target: 75,\n              value: 98,\n              title: 'Memory',\n              // subtitle: 'percent',\n              domain: [0, 100],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n            {\n              target: 25,\n              value: 35.5,\n              title: 'Network In',\n              subtitle: 'bandwidth',\n              domain: [0, 200],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n            {\n              target: 25,\n              value: 91,\n              title: 'Network out',\n              subtitle: 'available (percent)',\n              domain: [0, 100],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 600,\n    height: 270,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              target: 85,\\n              value: 23,\\n              title: 'CPU',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 75,\\n              value: 98,\\n              title: 'Memory',\\n              // subtitle: 'percent',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 25,\\n              value: 35.5,\\n              title: 'Network In',\\n              subtitle: 'bandwidth',\\n              domain: [0, 200],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n            {\\n              target: 25,\\n              value: 91,\\n              title: 'Network out',\\n              subtitle: 'available (percent)',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              value: 1320,\\n              title: 'Total requests',\\n              domain: [0, 2000],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n          [\\n            {\\n              target: 150,\\n              value: 483,\\n              title: 'Erroring Request duration millis',\\n              subtitle: '90th percentile',\\n              domain: [0, 500],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n          [\\n            {\\n              value: 12,\\n              title: 'Error rate',\\n              subtitle: 'percentage',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    width: 500,\\n    height: 375,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const format = text('format', '0');\n  const formatter = (d: number) => numeral(d).format(format);\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        data={[\n          [\n            {\n              value: 1320,\n              title: 'Total requests',\n              domain: [0, 2000],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n          [\n            {\n              target: 150,\n              value: 483,\n              title: 'Erroring Request duration millis',\n              subtitle: '90th percentile',\n              domain: [0, 500],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n          [\n            {\n              value: 12,\n              title: 'Error rate',\n              subtitle: 'percentage',\n              domain: [0, 100],\n              valueFormatter: formatter,\n              tickFormatter: formatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    width: 500,\n    height: 375,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const format = text('format', '0');\\n  const formatter = (d: number) => numeral(d).format(format);\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.horizontal);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={debug} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        data={[\\n          [\\n            {\\n              value: 1320,\\n              title: 'Total requests',\\n              domain: [0, 2000],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n          [\\n            {\\n              target: 150,\\n              value: 483,\\n              title: 'Erroring Request duration millis',\\n              subtitle: '90th percentile',\\n              domain: [0, 500],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n          [\\n            {\\n              value: 12,\\n              title: 'Error rate',\\n              subtitle: 'percentage',\\n              domain: [0, 100],\\n              valueFormatter: formatter,\\n              tickFormatter: formatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { Chart, Bullet, BulletSubtype, Settings, Tooltip } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\nimport { getKnobFromEnum } from '../utils/knobs/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('Enable debug state', false);\\n  const hideTooltip = boolean('hide tooltip', false);\\n  const syncCursor = boolean('sync cursor', false);\\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\\n  const valueFormat = text('valueFormat', '0');\\n  const targetFormat = text('targetFormat', '');\\n  const tickFormat = text('tickFormat', '0[.]00');\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\\n\\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        tickSnapStep={tickSnapStep}\\n        data={[\\n          [\\n            {\\n              target: 10,\\n              value: 23,\\n              title: 'Network inbound error rate',\\n              // subtitle: 'First row first column subtitle',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n            {\\n              target: 67,\\n              value: 123,\\n              title: 'Network outbound',\\n              subtitle: 'error rate (%)',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n          ],\\n          [\\n            {\\n              target: 50,\\n              value: 11,\\n              title: 'Number of requests',\\n              subtitle: 'Requests per second',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n            {\\n              target: 80,\\n              value: 92,\\n              title: 'Second row second column title',\\n              subtitle: 'percentage',\\n              syncCursor,\\n              domain: [0, 200],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `You can apply different formatter for ticks and values using\\n      different formats for \\\\`tickFormatter\\\\` and \\\\`valueFormatter\\\\`.\\n\\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\\n  resize: {\\n    width: 550,\\n    height: 640,\\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n    borderRadius: '6px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":101},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":101}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { Chart, Bullet, BulletSubtype, Settings, Tooltip } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { getKnobFromEnum } from '../utils/knobs/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('Enable debug state', false);\n  const hideTooltip = boolean('hide tooltip', false);\n  const syncCursor = boolean('sync cursor', false);\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\n  const valueFormat = text('valueFormat', '0');\n  const targetFormat = text('targetFormat', '');\n  const tickFormat = text('tickFormat', '0[.]00');\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\n\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onRenderChange={getDebugStateLogger(debugState)}\n        debugState={debugState}\n        baseTheme={useBaseTheme()}\n      />\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\n      <Bullet\n        id=\"bubbles\"\n        subtype={subtype}\n        tickSnapStep={tickSnapStep}\n        data={[\n          [\n            {\n              target: 10,\n              value: 23,\n              title: 'Network inbound error rate',\n              // subtitle: 'First row first column subtitle',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 67,\n              value: 123,\n              title: 'Network outbound',\n              subtitle: 'error rate (%)',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n          [\n            {\n              target: 50,\n              value: 11,\n              title: 'Number of requests',\n              subtitle: 'Requests per second',\n              syncCursor,\n              domain: [0, 100],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n            {\n              target: 80,\n              value: 92,\n              title: 'Second row second column title',\n              subtitle: 'percentage',\n              syncCursor,\n              domain: [0, 200],\n              valueFormatter,\n              targetFormatter,\n              tickFormatter,\n            },\n          ],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `You can apply different formatter for ticks and values using\n      different formats for \\`tickFormatter\\` and \\`valueFormatter\\`.\n\nUse a [numeraljs](http://numeraljs.com/) format with the knobs to see the difference`,\n  resize: {\n    width: 550,\n    height: 640,\n    boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n    borderRadius: '6px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('Enable debug state', false);\\n  const hideTooltip = boolean('hide tooltip', false);\\n  const syncCursor = boolean('sync cursor', false);\\n  const tickSnapStep = number('active tick step', 1, { min: 0, max: 10 });\\n  const valueFormat = text('valueFormat', '0');\\n  const targetFormat = text('targetFormat', '');\\n  const tickFormat = text('tickFormat', '0[.]00');\\n  const subtype = getKnobFromEnum('subtype', BulletSubtype, BulletSubtype.vertical);\\n\\n  const valueFormatter = (d: number) => numeral(d).format(valueFormat);\\n  const targetFormatter = targetFormat ? (d: number) => numeral(d).format(targetFormat) : undefined;\\n  const tickFormatter = (d: number) => numeral(d).format(tickFormat);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debugState={debugState}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Tooltip type={hideTooltip ? 'none' : undefined} />\\n      <Bullet\\n        id=\\\"bubbles\\\"\\n        subtype={subtype}\\n        tickSnapStep={tickSnapStep}\\n        data={[\\n          [\\n            {\\n              target: 10,\\n              value: 23,\\n              title: 'Network inbound error rate',\\n              // subtitle: 'First row first column subtitle',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n            {\\n              target: 67,\\n              value: 123,\\n              title: 'Network outbound',\\n              subtitle: 'error rate (%)',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n          ],\\n          [\\n            {\\n              target: 50,\\n              value: 11,\\n              title: 'Number of requests',\\n              subtitle: 'Requests per second',\\n              syncCursor,\\n              domain: [0, 100],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n            {\\n              target: 80,\\n              value: 92,\\n              title: 'Second row second column title',\\n              subtitle: 'percentage',\\n              syncCursor,\\n              domain: [0, 200],\\n              valueFormatter,\\n              targetFormatter,\\n              tickFormatter,\\n            },\\n          ],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Bullet Graph',\n};\n\nexport { Example as single } from './1_single.story';\nexport { Example as angular } from './2_angular.story';\nexport { Example as colorBands } from './3_color_bands.story';\nexport { Example as singleRow } from './4_single_row.story';\nexport { Example as singleColumn } from './5_single_column.story';\nexport { Example as grid } from './6_grid.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { select, boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  HistogramBarSeries,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Tooltip,\\n  TooltipAction,\\n} from '@elastic/charts';\\n\\nimport { DATA_SERIES } from './data/series';\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport { customKnobs } from '../../utils/knobs';\\nimport { SB_SOURCE_PANEL } from '../../utils/storybook';\\nimport { wait } from '../../utils/utils';\\n\\nconst formatter = new Intl.DateTimeFormat('en-US', {\\n  year: 'numeric',\\n  month: 'numeric',\\n  day: 'numeric',\\n  hour: 'numeric',\\n  minute: 'numeric',\\n});\\nconst tooltipDateFormatter = (d: number) => formatter.format(d);\\nconst stringPluralize = (d: unknown[]) => (d.length > 1 ? 's' : '');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const chartType = select('chart type', { bar: 'bar', line: 'line' }, 'line');\\n  const reduceData = boolean('reduce data', false);\\n  const asyncDelay = number('async actions delay', 0, { step: 100, min: 0 });\\n  const disableActions = boolean('disable actions', false);\\n\\n  const actions: TooltipAction[] = [\\n    {\\n      disabled: (d) => d.length !== 1,\\n      label: (d) => (d.length !== 1 ? 'Select to drilldown' : `Drilldown to ${d[0].label}`),\\n      onSelect: (s) => action('drilldown to')(s[0].label),\\n    },\\n    {\\n      label: () => `Filter this 30s time bucket`,\\n      onSelect: (s) => action('filter time bucket')(s[0].datum.timestamp),\\n    },\\n    {\\n      disabled: (d) => d.length < 1,\\n      label: (d) => (d.length < 1 ? 'Select to filter host IDs' : `Filter by ${d.length} host ID${stringPluralize(d)}`),\\n      onSelect: (s) => action('filter')(s.map((d) => d.label)),\\n    },\\n    {\\n      disabled: (d) => d.length < 1,\\n      label: (d) => (d.length < 1 ? 'Select to copy host IDs' : `Copy ${d.length} host ID${stringPluralize(d)}`),\\n      onSelect: (s) => action('copy')(s.map((d) => d.label)),\\n    },\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          axes: { tickLine: { visible: true } },\\n          barSeriesStyle: {\\n            rect: {\\n              opacity: 0.9,\\n            },\\n          },\\n          lineSeriesStyle: {\\n            point: { visible: false },\\n          },\\n        }}\\n      />\\n      <Tooltip\\n        type={customKnobs.enum.tooltipType()}\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={disableActions ? [] : asyncDelay > 0 ? () => wait(asyncDelay, () => actions) : actions}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        position={Position.Bottom}\\n        gridLine={{\\n          visible: true,\\n        }}\\n        style={{\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n        }}\\n        tickFormat={tooltipDateFormatter}\\n        timeAxisLayerCount={2}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        position={Position.Right}\\n        gridLine={{\\n          visible: true,\\n        }}\\n        ticks={4}\\n        tickFormat={(d) => `${Number(d * 100).toFixed(0)}`}\\n      />\\n      {DATA_SERIES.map((d) => {\\n        const data = d.timeseries.rows.slice(0, reduceData ? 20 : undefined);\\n        return chartType === 'bar' ? (\\n          <HistogramBarSeries\\n            key={d.name}\\n            id={d.name}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"timestamp\\\"\\n            yAccessors={['metric_0']}\\n            stackAccessors={['yes']}\\n            yNice\\n            data={data}\\n          />\\n        ) : (\\n          <LineSeries\\n            key={d.name}\\n            id={d.name}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"timestamp\\\"\\n            yAccessors={['metric_0']}\\n            yNice\\n            data={data}\\n          />\\n        );\\n      })}\\n    </Chart>\\n  );\\n};\\n\\n// storybook configuration\\nExample.parameters = {\\n  options: { selectedPanel: SB_SOURCE_PANEL },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":147},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":147}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { select, boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  HistogramBarSeries,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  Tooltip,\n  TooltipAction,\n} from '@elastic/charts';\n\nimport { DATA_SERIES } from './data/series';\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport { customKnobs } from '../../utils/knobs';\nimport { SB_SOURCE_PANEL } from '../../utils/storybook';\nimport { wait } from '../../utils/utils';\n\nconst formatter = new Intl.DateTimeFormat('en-US', {\n  year: 'numeric',\n  month: 'numeric',\n  day: 'numeric',\n  hour: 'numeric',\n  minute: 'numeric',\n});\nconst tooltipDateFormatter = (d: number) => formatter.format(d);\nconst stringPluralize = (d: unknown[]) => (d.length > 1 ? 's' : '');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const chartType = select('chart type', { bar: 'bar', line: 'line' }, 'line');\n  const reduceData = boolean('reduce data', false);\n  const asyncDelay = number('async actions delay', 0, { step: 100, min: 0 });\n  const disableActions = boolean('disable actions', false);\n\n  const actions: TooltipAction[] = [\n    {\n      disabled: (d) => d.length !== 1,\n      label: (d) => (d.length !== 1 ? 'Select to drilldown' : `Drilldown to ${d[0].label}`),\n      onSelect: (s) => action('drilldown to')(s[0].label),\n    },\n    {\n      label: () => `Filter this 30s time bucket`,\n      onSelect: (s) => action('filter time bucket')(s[0].datum.timestamp),\n    },\n    {\n      disabled: (d) => d.length < 1,\n      label: (d) => (d.length < 1 ? 'Select to filter host IDs' : `Filter by ${d.length} host ID${stringPluralize(d)}`),\n      onSelect: (s) => action('filter')(s.map((d) => d.label)),\n    },\n    {\n      disabled: (d) => d.length < 1,\n      label: (d) => (d.length < 1 ? 'Select to copy host IDs' : `Copy ${d.length} host ID${stringPluralize(d)}`),\n      onSelect: (s) => action('copy')(s.map((d) => d.label)),\n    },\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        theme={{\n          axes: { tickLine: { visible: true } },\n          barSeriesStyle: {\n            rect: {\n              opacity: 0.9,\n            },\n          },\n          lineSeriesStyle: {\n            point: { visible: false },\n          },\n        }}\n      />\n      <Tooltip\n        type={customKnobs.enum.tooltipType()}\n        maxVisibleTooltipItems={4}\n        maxTooltipItems={4}\n        actions={disableActions ? [] : asyncDelay > 0 ? () => wait(asyncDelay, () => actions) : actions}\n      />\n      <Axis\n        id=\"x\"\n        position={Position.Bottom}\n        gridLine={{\n          visible: true,\n        }}\n        style={{\n          tickLine: { size: 0.0001, padding: 4 },\n          tickLabel: {\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n            padding: 0,\n            offset: { x: 0, y: 0 },\n          },\n        }}\n        tickFormat={tooltipDateFormatter}\n        timeAxisLayerCount={2}\n      />\n      <Axis\n        id=\"left\"\n        position={Position.Right}\n        gridLine={{\n          visible: true,\n        }}\n        ticks={4}\n        tickFormat={(d) => `${Number(d * 100).toFixed(0)}`}\n      />\n      {DATA_SERIES.map((d) => {\n        const data = d.timeseries.rows.slice(0, reduceData ? 20 : undefined);\n        return chartType === 'bar' ? (\n          <HistogramBarSeries\n            key={d.name}\n            id={d.name}\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor=\"timestamp\"\n            yAccessors={['metric_0']}\n            stackAccessors={['yes']}\n            yNice\n            data={data}\n          />\n        ) : (\n          <LineSeries\n            key={d.name}\n            id={d.name}\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor=\"timestamp\"\n            yAccessors={['metric_0']}\n            yNice\n            data={data}\n          />\n        );\n      })}\n    </Chart>\n  );\n};\n\n// storybook configuration\nExample.parameters = {\n  options: { selectedPanel: SB_SOURCE_PANEL },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const chartType = select('chart type', { bar: 'bar', line: 'line' }, 'line');\\n  const reduceData = boolean('reduce data', false);\\n  const asyncDelay = number('async actions delay', 0, { step: 100, min: 0 });\\n  const disableActions = boolean('disable actions', false);\\n\\n  const actions: TooltipAction[] = [\\n    {\\n      disabled: (d) => d.length !== 1,\\n      label: (d) => (d.length !== 1 ? 'Select to drilldown' : `Drilldown to ${d[0].label}`),\\n      onSelect: (s) => action('drilldown to')(s[0].label),\\n    },\\n    {\\n      label: () => `Filter this 30s time bucket`,\\n      onSelect: (s) => action('filter time bucket')(s[0].datum.timestamp),\\n    },\\n    {\\n      disabled: (d) => d.length < 1,\\n      label: (d) => (d.length < 1 ? 'Select to filter host IDs' : `Filter by ${d.length} host ID${stringPluralize(d)}`),\\n      onSelect: (s) => action('filter')(s.map((d) => d.label)),\\n    },\\n    {\\n      disabled: (d) => d.length < 1,\\n      label: (d) => (d.length < 1 ? 'Select to copy host IDs' : `Copy ${d.length} host ID${stringPluralize(d)}`),\\n      onSelect: (s) => action('copy')(s.map((d) => d.label)),\\n    },\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          axes: { tickLine: { visible: true } },\\n          barSeriesStyle: {\\n            rect: {\\n              opacity: 0.9,\\n            },\\n          },\\n          lineSeriesStyle: {\\n            point: { visible: false },\\n          },\\n        }}\\n      />\\n      <Tooltip\\n        type={customKnobs.enum.tooltipType()}\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={disableActions ? [] : asyncDelay > 0 ? () => wait(asyncDelay, () => actions) : actions}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        position={Position.Bottom}\\n        gridLine={{\\n          visible: true,\\n        }}\\n        style={{\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n        }}\\n        tickFormat={tooltipDateFormatter}\\n        timeAxisLayerCount={2}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        position={Position.Right}\\n        gridLine={{\\n          visible: true,\\n        }}\\n        ticks={4}\\n        tickFormat={(d) => `${Number(d * 100).toFixed(0)}`}\\n      />\\n      {DATA_SERIES.map((d) => {\\n        const data = d.timeseries.rows.slice(0, reduceData ? 20 : undefined);\\n        return chartType === 'bar' ? (\\n          <HistogramBarSeries\\n            key={d.name}\\n            id={d.name}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"timestamp\\\"\\n            yAccessors={['metric_0']}\\n            stackAccessors={['yes']}\\n            yNice\\n            data={data}\\n          />\\n        ) : (\\n          <LineSeries\\n            key={d.name}\\n            id={d.name}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor=\\\"timestamp\\\"\\n            yAccessors={['metric_0']}\\n            yNice\\n            data={data}\\n          />\\n        );\\n      })}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n  Color,\\n  Tooltip,\\n  TooltipAction,\\n  TooltipValue,\\n} from '@elastic/charts';\\nimport { Layer } from '@elastic/charts/src/chart_types/partition_chart/specs';\\nimport { combineColors } from '@elastic/charts/src/common/color_calcs';\\nimport { colorToRgba, RGBATupleToString } from '@elastic/charts/src/common/color_library_wrappers';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    maxFontSize: 18,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nfunction plainColor(foreground: Color, bg: Color): Color {\\n  return RGBATupleToString(combineColors(colorToRgba(foreground), colorToRgba(bg)));\\n}\\n\\nconst stringPluralize = (d: unknown[], one: string, many: string) => (d.length > 1 ? many : one);\\n\\nconst actionByDepth = (depth: number): TooltipAction => {\\n  const name = depth === 1 ? 'categor' : depth === 2 ? 'continent' : 'countr';\\n  const pluralize = depth === 1 ? ['y', 'ies'] : depth === 2 ? ['', 's'] : ['y', 'ies'];\\n  const filter = (d: TooltipValue) => d.valueAccessor === depth;\\n  const actionName = (d: unknown[]) => `${name}${stringPluralize(d, pluralize[0], pluralize[1])}`;\\n  return {\\n    hide: (d) => d.some(filter), //  TODO we should double check this as it seems to work the opposite way\\n    disabled: (d) => d.filter(filter).length < 1,\\n    label: (d) => {\\n      const currentDepthValues = d.filter(filter);\\n      return currentDepthValues.length < 1\\n        ? `Select to filter ${actionName(currentDepthValues)}`\\n        : `Filter by ${currentDepthValues.length} ${actionName(currentDepthValues)}`;\\n    },\\n\\n    onSelect: (s) => action(`filter ${actionName(s.filter(filter))}`)(s.filter(filter).map((d) => d.label)),\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const layout = select<PartitionLayout>(\\n    'layout',\\n    {\\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\\n      [PartitionLayout.waffle]: PartitionLayout.waffle,\\n    },\\n    PartitionLayout.sunburst,\\n  );\\n  type PartitionDatum = (typeof mocks.miniSunburst)[0];\\n  const layers: Layer[] = [\\n    {\\n      groupByRollup: (d: PartitionDatum) => d.sitc1,\\n      nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex) => plainColor(discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex), 'white'),\\n      },\\n    },\\n    {\\n      groupByRollup: (d: PartitionDatum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n      nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex, node) =>\\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex), 'white'),\\n      },\\n    },\\n    {\\n      groupByRollup: (d: PartitionDatum) => d.dest,\\n      nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex, node) =>\\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex), 'white'),\\n      },\\n    },\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={() => {\\n          return [\\n            {\\n              disabled: (d) => d.length !== 1,\\n              label: (d) => {\\n                return d.length !== 1 ? 'Select one to drilldown' : `Drilldown to ${d[0].label}`;\\n              },\\n              onSelect: (s) => action('drilldown to')(s[0].label),\\n            },\\n            actionByDepth(1),\\n            actionByDepth(2),\\n            actionByDepth(3),\\n            {\\n              disabled: (d) => d.length < 1,\\n              label: (d) =>\\n                d.length < 1 ? 'Select to copy labels' : `Copy ${d.length} label${stringPluralize(d, '', 's')}`,\\n              onSelect: (s) => action('copy')(s.map((d) => d.label)),\\n            },\\n          ];\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.miniSunburst}\\n        layout={layout}\\n        valueAccessor={(d) => d.exportVal}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={layers.filter((d, i) => (layout === 'waffle' ? i === 0 : true))}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":90},\"endLoc\":{\"col\":1,\"line\":168},\"startBody\":{\"col\":36,\"line\":90},\"endBody\":{\"col\":1,\"line\":168}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n  Color,\n  Tooltip,\n  TooltipAction,\n  TooltipValue,\n} from '@elastic/charts';\nimport { Layer } from '@elastic/charts/src/chart_types/partition_chart/specs';\nimport { combineColors } from '@elastic/charts/src/common/color_calcs';\nimport { colorToRgba, RGBATupleToString } from '@elastic/charts/src/common/color_library_wrappers';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    maxFontSize: 18,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nfunction plainColor(foreground: Color, bg: Color): Color {\n  return RGBATupleToString(combineColors(colorToRgba(foreground), colorToRgba(bg)));\n}\n\nconst stringPluralize = (d: unknown[], one: string, many: string) => (d.length > 1 ? many : one);\n\nconst actionByDepth = (depth: number): TooltipAction => {\n  const name = depth === 1 ? 'categor' : depth === 2 ? 'continent' : 'countr';\n  const pluralize = depth === 1 ? ['y', 'ies'] : depth === 2 ? ['', 's'] : ['y', 'ies'];\n  const filter = (d: TooltipValue) => d.valueAccessor === depth;\n  const actionName = (d: unknown[]) => `${name}${stringPluralize(d, pluralize[0], pluralize[1])}`;\n  return {\n    hide: (d) => d.some(filter), //  TODO we should double check this as it seems to work the opposite way\n    disabled: (d) => d.filter(filter).length < 1,\n    label: (d) => {\n      const currentDepthValues = d.filter(filter);\n      return currentDepthValues.length < 1\n        ? `Select to filter ${actionName(currentDepthValues)}`\n        : `Filter by ${currentDepthValues.length} ${actionName(currentDepthValues)}`;\n    },\n\n    onSelect: (s) => action(`filter ${actionName(s.filter(filter))}`)(s.filter(filter).map((d) => d.label)),\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const layout = select<PartitionLayout>(\n    'layout',\n    {\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\n      [PartitionLayout.waffle]: PartitionLayout.waffle,\n    },\n    PartitionLayout.sunburst,\n  );\n  type PartitionDatum = (typeof mocks.miniSunburst)[0];\n  const layers: Layer[] = [\n    {\n      groupByRollup: (d: PartitionDatum) => d.sitc1,\n      nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\n      fillLabel: { maximizeFontSize: false },\n      shape: {\n        fillColor: (key, sortIndex) => plainColor(discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex), 'white'),\n      },\n    },\n    {\n      groupByRollup: (d: PartitionDatum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n      nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\n      fillLabel: { maximizeFontSize: false },\n      shape: {\n        fillColor: (key, sortIndex, node) =>\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex), 'white'),\n      },\n    },\n    {\n      groupByRollup: (d: PartitionDatum) => d.dest,\n      nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\n      fillLabel: { maximizeFontSize: false },\n      shape: {\n        fillColor: (key, sortIndex, node) =>\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex), 'white'),\n      },\n    },\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Tooltip\n        maxVisibleTooltipItems={4}\n        maxTooltipItems={4}\n        actions={() => {\n          return [\n            {\n              disabled: (d) => d.length !== 1,\n              label: (d) => {\n                return d.length !== 1 ? 'Select one to drilldown' : `Drilldown to ${d[0].label}`;\n              },\n              onSelect: (s) => action('drilldown to')(s[0].label),\n            },\n            actionByDepth(1),\n            actionByDepth(2),\n            actionByDepth(3),\n            {\n              disabled: (d) => d.length < 1,\n              label: (d) =>\n                d.length < 1 ? 'Select to copy labels' : `Copy ${d.length} label${stringPluralize(d, '', 's')}`,\n              onSelect: (s) => action('copy')(s.map((d) => d.label)),\n            },\n          ];\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.miniSunburst}\n        layout={layout}\n        valueAccessor={(d) => d.exportVal}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={layers.filter((d, i) => (layout === 'waffle' ? i === 0 : true))}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const layout = select<PartitionLayout>(\\n    'layout',\\n    {\\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\\n      [PartitionLayout.waffle]: PartitionLayout.waffle,\\n    },\\n    PartitionLayout.sunburst,\\n  );\\n  type PartitionDatum = (typeof mocks.miniSunburst)[0];\\n  const layers: Layer[] = [\\n    {\\n      groupByRollup: (d: PartitionDatum) => d.sitc1,\\n      nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex) => plainColor(discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex), 'white'),\\n      },\\n    },\\n    {\\n      groupByRollup: (d: PartitionDatum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n      nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex, node) =>\\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex), 'white'),\\n      },\\n    },\\n    {\\n      groupByRollup: (d: PartitionDatum) => d.dest,\\n      nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\\n      fillLabel: { maximizeFontSize: false },\\n      shape: {\\n        fillColor: (key, sortIndex, node) =>\\n          plainColor(discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex), 'white'),\\n      },\\n    },\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={() => {\\n          return [\\n            {\\n              disabled: (d) => d.length !== 1,\\n              label: (d) => {\\n                return d.length !== 1 ? 'Select one to drilldown' : `Drilldown to ${d[0].label}`;\\n              },\\n              onSelect: (s) => action('drilldown to')(s[0].label),\\n            },\\n            actionByDepth(1),\\n            actionByDepth(2),\\n            actionByDepth(3),\\n            {\\n              disabled: (d) => d.length < 1,\\n              label: (d) =>\\n                d.length < 1 ? 'Select to copy labels' : `Copy ${d.length} label${stringPluralize(d, '', 's')}`,\\n              onSelect: (s) => action('copy')(s.map((d) => d.label)),\\n            },\\n          ];\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.miniSunburst}\\n        layout={layout}\\n        valueAccessor={(d) => d.exportVal}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={layers.filter((d, i) => (layout === 'waffle' ? i === 0 : true))}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React, { ReactNode } from 'react';\\n\\nimport { Chart, Heatmap, Settings, Tooltip, TooltipValue } from '@elastic/charts';\\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\n\\nfunction boldMap(d: TooltipValue[]) {\\n  return d.reduce<ReactNode[]>(\\n    (acc, curr, i, array) => {\\n      acc.push(\\n        <b>\\n          {curr.label}:{curr.value}\\n        </b>,\\n      );\\n      if (array.length - 1 > i) {\\n        acc.push(' and ');\\n      }\\n      return acc;\\n    },\\n    ['Filter '],\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        brushAxis=\\\"both\\\"\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: 0,\\n              },\\n            },\\n            cell: {\\n              maxWidth: 'fill',\\n              border: {\\n                stroke: 'transparent',\\n                strokeWidth: 1,\\n              },\\n            },\\n            yAxisLabel: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        onBrushEnd={action('onBrushEnd')}\\n      />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={[\\n          {\\n            disabled: (d) => d.length !== 1,\\n            label: (d) =>\\n              d.length !== 1 ? (\\n                'Select one to drilldown'\\n              ) : (\\n                <span>\\n                  Drilldown to{' '}\\n                  <b>\\n                    {d[0].label}:{d[0].value}\\n                  </b>\\n                </span>\\n              ),\\n            onSelect: (s) => action('drilldown to')(s[0].label),\\n          },\\n          {\\n            label: (d) => (d.length < 1 ? 'Select to filter' : boldMap(d)),\\n            onSelect: (s) => action('filter categories')(s.map((d) => d.label)),\\n          },\\n        ]}\\n      />\\n      <Heatmap\\n        id=\\\"Number of births\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 1000, color: '#AADC32' },\\n            { start: 1000, end: 5000, color: '#35B779' },\\n            { start: 5000, end: 10000, color: '#24868E' },\\n            { start: 10000, end: 50000, color: '#3B528B' },\\n            { start: 50000, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={(d) => d[2]}\\n        yAccessor={(d) => d[0]}\\n        valueAccessor={(d) => d[3]}\\n        valueFormatter={(value) => value.toFixed(0.2)}\\n        xSortPredicate=\\\"alphaAsc\\\"\\n        yAxisLabelName=\\\"Year\\\"\\n        xAxisLabelName=\\\"Name\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":113},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":113}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React, { ReactNode } from 'react';\n\nimport { Chart, Heatmap, Settings, Tooltip, TooltipValue } from '@elastic/charts';\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\n\nfunction boldMap(d: TooltipValue[]) {\n  return d.reduce<ReactNode[]>(\n    (acc, curr, i, array) => {\n      acc.push(\n        <b>\n          {curr.label}:{curr.value}\n        </b>,\n      );\n      if (array.length - 1 > i) {\n        acc.push(' and ');\n      }\n      return acc;\n    },\n    ['Filter '],\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onElementClick={action('onElementClick')}\n        brushAxis=\"both\"\n        baseTheme={useBaseTheme()}\n        theme={{\n          heatmap: {\n            grid: {\n              stroke: {\n                width: 0,\n              },\n            },\n            cell: {\n              maxWidth: 'fill',\n              border: {\n                stroke: 'transparent',\n                strokeWidth: 1,\n              },\n            },\n            yAxisLabel: {\n              visible: true,\n            },\n          },\n        }}\n        onBrushEnd={action('onBrushEnd')}\n      />\n      <Tooltip\n        maxVisibleTooltipItems={4}\n        maxTooltipItems={4}\n        actions={[\n          {\n            disabled: (d) => d.length !== 1,\n            label: (d) =>\n              d.length !== 1 ? (\n                'Select one to drilldown'\n              ) : (\n                <span>\n                  Drilldown to{' '}\n                  <b>\n                    {d[0].label}:{d[0].value}\n                  </b>\n                </span>\n              ),\n            onSelect: (s) => action('drilldown to')(s[0].label),\n          },\n          {\n            label: (d) => (d.length < 1 ? 'Select to filter' : boldMap(d)),\n            onSelect: (s) => action('filter categories')(s.map((d) => d.label)),\n          },\n        ]}\n      />\n      <Heatmap\n        id=\"Number of births\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 1000, color: '#AADC32' },\n            { start: 1000, end: 5000, color: '#35B779' },\n            { start: 5000, end: 10000, color: '#24868E' },\n            { start: 10000, end: 50000, color: '#3B528B' },\n            { start: 50000, end: Infinity, color: '#471164' },\n          ],\n        }}\n        data={data}\n        xAccessor={(d) => d[2]}\n        yAccessor={(d) => d[0]}\n        valueAccessor={(d) => d[3]}\n        valueFormatter={(value) => value.toFixed(0.2)}\n        xSortPredicate=\"alphaAsc\"\n        yAxisLabelName=\"Year\"\n        xAxisLabelName=\"Name\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        brushAxis=\\\"both\\\"\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: 0,\\n              },\\n            },\\n            cell: {\\n              maxWidth: 'fill',\\n              border: {\\n                stroke: 'transparent',\\n                strokeWidth: 1,\\n              },\\n            },\\n            yAxisLabel: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        onBrushEnd={action('onBrushEnd')}\\n      />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={[\\n          {\\n            disabled: (d) => d.length !== 1,\\n            label: (d) =>\\n              d.length !== 1 ? (\\n                'Select one to drilldown'\\n              ) : (\\n                <span>\\n                  Drilldown to{' '}\\n                  <b>\\n                    {d[0].label}:{d[0].value}\\n                  </b>\\n                </span>\\n              ),\\n            onSelect: (s) => action('drilldown to')(s[0].label),\\n          },\\n          {\\n            label: (d) => (d.length < 1 ? 'Select to filter' : boldMap(d)),\\n            onSelect: (s) => action('filter categories')(s.map((d) => d.label)),\\n          },\\n        ]}\\n      />\\n      <Heatmap\\n        id=\\\"Number of births\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 1000, color: '#AADC32' },\\n            { start: 1000, end: 5000, color: '#35B779' },\\n            { start: 5000, end: 10000, color: '#24868E' },\\n            { start: 10000, end: 50000, color: '#3B528B' },\\n            { start: 50000, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={(d) => d[2]}\\n        yAccessor={(d) => d[0]}\\n        valueAccessor={(d) => d[3]}\\n        valueFormatter={(value) => value.toFixed(0.2)}\\n        xSortPredicate=\\\"alphaAsc\\\"\\n        yAxisLabelName=\\\"Year\\\"\\n        xAxisLabelName=\\\"Name\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, button } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Tooltip,\\n  Flame,\\n  Settings,\\n  FlameGlobalControl,\\n  FlameNodeControl,\\n  ColumnarViewModel,\\n} from '@elastic/charts';\\nimport columnarMock from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock_columnar.json';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../../types';\\nimport { useBaseTheme } from '../../../use_base_theme';\\n\\nconst position = new Float32Array(columnarMock.position);\\nconst size = new Float32Array(columnarMock.size);\\n\\nconst rng = getRandomNumberGenerator();\\n\\nconst paletteColorBrewerCat12 = [\\n  [141, 211, 199],\\n  [255, 255, 179],\\n  [190, 186, 218],\\n  [251, 128, 114],\\n  [128, 177, 211],\\n  [253, 180, 98],\\n  [179, 222, 105],\\n  [252, 205, 229],\\n  [217, 217, 217],\\n  [188, 128, 189],\\n  [204, 235, 197],\\n  [255, 237, 111],\\n];\\n\\nconst columnarData: ColumnarViewModel = {\\n  label: columnarMock.label.map((index: number) => columnarMock.dictionary[index]), // reversing the dictionary encoding\\n  value: new Float64Array(columnarMock.value),\\n  // color: new Float32Array((columnarMock.color.match(/.{2}/g) ?? []).map((hex: string) => Number.parseInt(hex, 16) / 255)),\\n  color: new Float32Array(\\n    columnarMock.label.flatMap(() => [...paletteColorBrewerCat12[rng(0, 11)].map((c) => c / 255), 1]),\\n  ),\\n  position0: position, // new Float32Array([...position].slice(1)), // try with the wrong array length\\n  position1: position,\\n  size0: size,\\n  size1: size,\\n};\\n\\nconst noop = () => {};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\\n\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  button('Reset focus', () => {\\n    resetFocusControl();\\n  });\\n  button('Set focus on random node', () => {\\n    focusOnNodeControl(rng(0, 19));\\n  });\\n  const debug = boolean('Debug history', false);\\n  const showTooltipActions = boolean('Use tooltip actions', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={\\n          showTooltipActions\\n            ? [\\n                {\\n                  label: () => 'Open detail view',\\n                  onSelect: (s) => action('open detail view')(s[0].datum),\\n                },\\n                {\\n                  label: () => 'Zoom to',\\n                  onSelect: (s) => {\\n                    focusOnNodeControl(s[0]?.valueAccessor as number);\\n                  },\\n                },\\n              ]\\n            : undefined\\n        }\\n      />\\n      <Flame\\n        id=\\\"spec_1\\\"\\n        columnarData={columnarData}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={(value) => `${value}`}\\n        animation={{ duration: 500 }}\\n        controlProviderCallback={{\\n          resetFocus: (control) => (resetFocusControl = control),\\n          focusOnNode: (control) => (focusOnNodeControl = control),\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":64},\"endLoc\":{\"col\":1,\"line\":117},\"startBody\":{\"col\":36,\"line\":64},\"endBody\":{\"col\":1,\"line\":117}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, button } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Tooltip,\n  Flame,\n  Settings,\n  FlameGlobalControl,\n  FlameNodeControl,\n  ColumnarViewModel,\n} from '@elastic/charts';\nimport columnarMock from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock_columnar.json';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../../types';\nimport { useBaseTheme } from '../../../use_base_theme';\n\nconst position = new Float32Array(columnarMock.position);\nconst size = new Float32Array(columnarMock.size);\n\nconst rng = getRandomNumberGenerator();\n\nconst paletteColorBrewerCat12 = [\n  [141, 211, 199],\n  [255, 255, 179],\n  [190, 186, 218],\n  [251, 128, 114],\n  [128, 177, 211],\n  [253, 180, 98],\n  [179, 222, 105],\n  [252, 205, 229],\n  [217, 217, 217],\n  [188, 128, 189],\n  [204, 235, 197],\n  [255, 237, 111],\n];\n\nconst columnarData: ColumnarViewModel = {\n  label: columnarMock.label.map((index: number) => columnarMock.dictionary[index]), // reversing the dictionary encoding\n  value: new Float64Array(columnarMock.value),\n  // color: new Float32Array((columnarMock.color.match(/.{2}/g) ?? []).map((hex: string) => Number.parseInt(hex, 16) / 255)),\n  color: new Float32Array(\n    columnarMock.label.flatMap(() => [...paletteColorBrewerCat12[rng(0, 11)].map((c) => c / 255), 1]),\n  ),\n  position0: position, // new Float32Array([...position].slice(1)), // try with the wrong array length\n  position1: position,\n  size0: size,\n  size1: size,\n};\n\nconst noop = () => {};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\n\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  button('Reset focus', () => {\n    resetFocusControl();\n  });\n  button('Set focus on random node', () => {\n    focusOnNodeControl(rng(0, 19));\n  });\n  const debug = boolean('Debug history', false);\n  const showTooltipActions = boolean('Use tooltip actions', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\n      <Tooltip\n        maxVisibleTooltipItems={4}\n        maxTooltipItems={4}\n        actions={\n          showTooltipActions\n            ? [\n                {\n                  label: () => 'Open detail view',\n                  onSelect: (s) => action('open detail view')(s[0].datum),\n                },\n                {\n                  label: () => 'Zoom to',\n                  onSelect: (s) => {\n                    focusOnNodeControl(s[0]?.valueAccessor as number);\n                  },\n                },\n              ]\n            : undefined\n        }\n      />\n      <Flame\n        id=\"spec_1\"\n        columnarData={columnarData}\n        valueAccessor={(d: Datum) => d.value as number}\n        valueFormatter={(value) => `${value}`}\n        animation={{ duration: 500 }}\n        controlProviderCallback={{\n          resetFocus: (control) => (resetFocusControl = control),\n          focusOnNode: (control) => (focusOnNodeControl = control),\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\\n\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  button('Reset focus', () => {\\n    resetFocusControl();\\n  });\\n  button('Set focus on random node', () => {\\n    focusOnNodeControl(rng(0, 19));\\n  });\\n  const debug = boolean('Debug history', false);\\n  const showTooltipActions = boolean('Use tooltip actions', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\\n      <Tooltip\\n        maxVisibleTooltipItems={4}\\n        maxTooltipItems={4}\\n        actions={\\n          showTooltipActions\\n            ? [\\n                {\\n                  label: () => 'Open detail view',\\n                  onSelect: (s) => action('open detail view')(s[0].datum),\\n                },\\n                {\\n                  label: () => 'Zoom to',\\n                  onSelect: (s) => {\\n                    focusOnNodeControl(s[0]?.valueAccessor as number);\\n                  },\\n                },\\n              ]\\n            : undefined\\n        }\\n      />\\n      <Flame\\n        id=\\\"spec_1\\\"\\n        columnarData={columnarData}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={(value) => `${value}`}\\n        animation={{ duration: 500 }}\\n        controlProviderCallback={{\\n          resetFocus: (control) => (resetFocusControl = control),\\n          focusOnNode: (control) => (focusOnNodeControl = control),\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { TooltipTable, TooltipTableColumn } from '@elastic/charts';\\nimport { isDefined } from '@elastic/charts/src/utils/common';\\n\\nimport { tableSimple, simple, long } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const maxVisibleTooltipItems = number('max visible tooltip items', 2);\\n  const dataSet = select(\\n    'dataSet',\\n    {\\n      'Simple - table': 'tableSimple',\\n      'Simple - list': 'simple',\\n      'Long - list': 'long',\\n    },\\n    'simple',\\n  );\\n  const dataSets = {\\n    tableSimple,\\n    simple,\\n    long,\\n  };\\n  const columns: TooltipTableColumn[] = [\\n    {\\n      id: 'label',\\n      type: 'custom',\\n      header: 'label',\\n      truncate: true,\\n      cell: ({ label }) => <span className=\\\"echTooltip__label\\\">{label}</span>,\\n      style: {\\n        textAlign: 'left',\\n      },\\n    },\\n    {\\n      id: 'value',\\n      type: 'custom',\\n      header: 'value',\\n      cell: ({ formattedValue }) => (\\n        <span className=\\\"echTooltip__value\\\" dir=\\\"ltr\\\">\\n          {formattedValue}\\n        </span>\\n      ),\\n      style: {\\n        textAlign: 'right',\\n      },\\n    },\\n    {\\n      id: 'markValue',\\n      type: 'custom',\\n      hidden: (items) => items.every(({ markValue }) => !markValue),\\n      cell: ({ markValue, formattedMarkValue }) =>\\n        isDefined(markValue) ? <span className=\\\"echTooltip__markValue\\\">&nbsp;({formattedMarkValue})</span> : null,\\n    },\\n  ];\\n  const showColor = boolean('show color', true);\\n  const pinned = boolean('pinned', false);\\n\\n  if (showColor) {\\n    columns.unshift({\\n      id: 'color',\\n      type: 'color',\\n    });\\n  }\\n\\n  return (\\n    <TooltipShowcase\\n      info={dataSets[dataSet]}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        maxVisibleTooltipItems,\\n        header: boolean('show default header', true) ? 'default' : 'none',\\n        body: boolean('show default body', false)\\n          ? 'default'\\n          : ({ items }) => (\\n              <TooltipTable columns={columns} items={items} onSelect={(s) => action('onTooltipAction')(s)} />\\n            ),\\n        actions: [\\n          {\\n            label: () => 'Log storybook action',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n        ],\\n      }}\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\\\\n  This example shows how you can build the default list tooltip by defining the \\\\`columns\\\\` on the \\\\`TooltipTable\\\\` component inside a \\\\`CustomTooltip\\\\`.`,\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":19},\"endLoc\":{\"col\":1,\"line\":99},\"startBody\":{\"col\":23,\"line\":19},\"endBody\":{\"col\":1,\"line\":99}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { TooltipTable, TooltipTableColumn } from '@elastic/charts';\nimport { isDefined } from '@elastic/charts/src/utils/common';\n\nimport { tableSimple, simple, long } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const maxVisibleTooltipItems = number('max visible tooltip items', 2);\n  const dataSet = select(\n    'dataSet',\n    {\n      'Simple - table': 'tableSimple',\n      'Simple - list': 'simple',\n      'Long - list': 'long',\n    },\n    'simple',\n  );\n  const dataSets = {\n    tableSimple,\n    simple,\n    long,\n  };\n  const columns: TooltipTableColumn[] = [\n    {\n      id: 'label',\n      type: 'custom',\n      header: 'label',\n      truncate: true,\n      cell: ({ label }) => <span className=\"echTooltip__label\">{label}</span>,\n      style: {\n        textAlign: 'left',\n      },\n    },\n    {\n      id: 'value',\n      type: 'custom',\n      header: 'value',\n      cell: ({ formattedValue }) => (\n        <span className=\"echTooltip__value\" dir=\"ltr\">\n          {formattedValue}\n        </span>\n      ),\n      style: {\n        textAlign: 'right',\n      },\n    },\n    {\n      id: 'markValue',\n      type: 'custom',\n      hidden: (items) => items.every(({ markValue }) => !markValue),\n      cell: ({ markValue, formattedMarkValue }) =>\n        isDefined(markValue) ? <span className=\"echTooltip__markValue\">&nbsp;({formattedMarkValue})</span> : null,\n    },\n  ];\n  const showColor = boolean('show color', true);\n  const pinned = boolean('pinned', false);\n\n  if (showColor) {\n    columns.unshift({\n      id: 'color',\n      type: 'color',\n    });\n  }\n\n  return (\n    <TooltipShowcase\n      info={dataSets[dataSet]}\n      pinned={pinned}\n      canPinTooltip\n      tooltip={{\n        maxVisibleTooltipItems,\n        header: boolean('show default header', true) ? 'default' : 'none',\n        body: boolean('show default body', false)\n          ? 'default'\n          : ({ items }) => (\n              <TooltipTable columns={columns} items={items} onSelect={(s) => action('onTooltipAction')(s)} />\n            ),\n        actions: [\n          {\n            label: () => 'Log storybook action',\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n        ],\n      }}\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\n  This example shows how you can build the default list tooltip by defining the \\`columns\\` on the \\`TooltipTable\\` component inside a \\`CustomTooltip\\`.`,\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const maxVisibleTooltipItems = number('max visible tooltip items', 2);\\n  const dataSet = select(\\n    'dataSet',\\n    {\\n      'Simple - table': 'tableSimple',\\n      'Simple - list': 'simple',\\n      'Long - list': 'long',\\n    },\\n    'simple',\\n  );\\n  const dataSets = {\\n    tableSimple,\\n    simple,\\n    long,\\n  };\\n  const columns: TooltipTableColumn[] = [\\n    {\\n      id: 'label',\\n      type: 'custom',\\n      header: 'label',\\n      truncate: true,\\n      cell: ({ label }) => <span className=\\\"echTooltip__label\\\">{label}</span>,\\n      style: {\\n        textAlign: 'left',\\n      },\\n    },\\n    {\\n      id: 'value',\\n      type: 'custom',\\n      header: 'value',\\n      cell: ({ formattedValue }) => (\\n        <span className=\\\"echTooltip__value\\\" dir=\\\"ltr\\\">\\n          {formattedValue}\\n        </span>\\n      ),\\n      style: {\\n        textAlign: 'right',\\n      },\\n    },\\n    {\\n      id: 'markValue',\\n      type: 'custom',\\n      hidden: (items) => items.every(({ markValue }) => !markValue),\\n      cell: ({ markValue, formattedMarkValue }) =>\\n        isDefined(markValue) ? <span className=\\\"echTooltip__markValue\\\">&nbsp;({formattedMarkValue})</span> : null,\\n    },\\n  ];\\n  const showColor = boolean('show color', true);\\n  const pinned = boolean('pinned', false);\\n\\n  if (showColor) {\\n    columns.unshift({\\n      id: 'color',\\n      type: 'color',\\n    });\\n  }\\n\\n  return (\\n    <TooltipShowcase\\n      info={dataSets[dataSet]}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        maxVisibleTooltipItems,\\n        header: boolean('show default header', true) ? 'default' : 'none',\\n        body: boolean('show default body', false)\\n          ? 'default'\\n          : ({ items }) => (\\n              <TooltipTable columns={columns} items={items} onSelect={(s) => action('onTooltipAction')(s)} />\\n            ),\\n        actions: [\\n          {\\n            label: () => 'Log storybook action',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n        ],\\n      }}\\n    />\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  TooltipTable,\\n  TooltipTableBody,\\n  TooltipTableHeader,\\n  TooltipTableFooter,\\n  TooltipTableRow,\\n  TooltipTableCell,\\n  TooltipTableColorCell,\\n  TooltipSpec,\\n  TooltipCellStyle,\\n} from '@elastic/charts';\\n\\nimport { tableSimple } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const pinned = boolean('pinned', false);\\n  const showColor = boolean('show color', true);\\n  const maxHeight = number('max table height', 120);\\n  const style: TooltipCellStyle = { textAlign: 'right' };\\n\\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\\n    return (\\n      <TooltipTable gridTemplateColumns={`repeat(${showColor ? 4 : 3}, auto)`} maxHeight={maxHeight}>\\n        <TooltipTableHeader>\\n          <TooltipTableRow>\\n            {showColor && <TooltipTableColorCell />}\\n            <TooltipTableCell>X Value</TooltipTableCell>\\n            <TooltipTableCell>Y Value</TooltipTableCell>\\n            <TooltipTableCell>Z Value</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableHeader>\\n        <TooltipTableBody>\\n          {items.map(({ datum, seriesIdentifier: { key }, color }) => (\\n            <TooltipTableRow key={`${key}-${datum.x}`}>\\n              {showColor && <TooltipTableColorCell color={color} />}\\n              <TooltipTableCell style={style}>{datum.x}</TooltipTableCell>\\n              <TooltipTableCell style={style}>{datum.y}</TooltipTableCell>\\n              <TooltipTableCell style={style}>{datum.z}</TooltipTableCell>\\n            </TooltipTableRow>\\n          ))}\\n        </TooltipTableBody>\\n        <TooltipTableFooter>\\n          <TooltipTableRow>\\n            {showColor && <TooltipTableColorCell />}\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { x } }) => s + x, 0)}</TooltipTableCell>\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { y } }) => s + y, 0)}</TooltipTableCell>\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { z } }) => s + z, 0)}</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableFooter>\\n      </TooltipTable>\\n    );\\n  };\\n  return <TooltipShowcase info={tableSimple} pinned={pinned} tooltip={{ body: TooltipBody }} />;\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\\\\n  This example shows how you can build a tabular tooltip by structuring the table components explicitly within \\\\`TooltipTable\\\\` instead of using the \\\\`columns\\\\` option.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":27},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":23,\"line\":27},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  TooltipTable,\n  TooltipTableBody,\n  TooltipTableHeader,\n  TooltipTableFooter,\n  TooltipTableRow,\n  TooltipTableCell,\n  TooltipTableColorCell,\n  TooltipSpec,\n  TooltipCellStyle,\n} from '@elastic/charts';\n\nimport { tableSimple } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const pinned = boolean('pinned', false);\n  const showColor = boolean('show color', true);\n  const maxHeight = number('max table height', 120);\n  const style: TooltipCellStyle = { textAlign: 'right' };\n\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\n    return (\n      <TooltipTable gridTemplateColumns={`repeat(${showColor ? 4 : 3}, auto)`} maxHeight={maxHeight}>\n        <TooltipTableHeader>\n          <TooltipTableRow>\n            {showColor && <TooltipTableColorCell />}\n            <TooltipTableCell>X Value</TooltipTableCell>\n            <TooltipTableCell>Y Value</TooltipTableCell>\n            <TooltipTableCell>Z Value</TooltipTableCell>\n          </TooltipTableRow>\n        </TooltipTableHeader>\n        <TooltipTableBody>\n          {items.map(({ datum, seriesIdentifier: { key }, color }) => (\n            <TooltipTableRow key={`${key}-${datum.x}`}>\n              {showColor && <TooltipTableColorCell color={color} />}\n              <TooltipTableCell style={style}>{datum.x}</TooltipTableCell>\n              <TooltipTableCell style={style}>{datum.y}</TooltipTableCell>\n              <TooltipTableCell style={style}>{datum.z}</TooltipTableCell>\n            </TooltipTableRow>\n          ))}\n        </TooltipTableBody>\n        <TooltipTableFooter>\n          <TooltipTableRow>\n            {showColor && <TooltipTableColorCell />}\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { x } }) => s + x, 0)}</TooltipTableCell>\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { y } }) => s + y, 0)}</TooltipTableCell>\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { z } }) => s + z, 0)}</TooltipTableCell>\n          </TooltipTableRow>\n        </TooltipTableFooter>\n      </TooltipTable>\n    );\n  };\n  return <TooltipShowcase info={tableSimple} pinned={pinned} tooltip={{ body: TooltipBody }} />;\n};\n\nExample.parameters = {\n  showHeader: true,\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\n  This example shows how you can build a tabular tooltip by structuring the table components explicitly within \\`TooltipTable\\` instead of using the \\`columns\\` option.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const pinned = boolean('pinned', false);\\n  const showColor = boolean('show color', true);\\n  const maxHeight = number('max table height', 120);\\n  const style: TooltipCellStyle = { textAlign: 'right' };\\n\\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\\n    return (\\n      <TooltipTable gridTemplateColumns={`repeat(${showColor ? 4 : 3}, auto)`} maxHeight={maxHeight}>\\n        <TooltipTableHeader>\\n          <TooltipTableRow>\\n            {showColor && <TooltipTableColorCell />}\\n            <TooltipTableCell>X Value</TooltipTableCell>\\n            <TooltipTableCell>Y Value</TooltipTableCell>\\n            <TooltipTableCell>Z Value</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableHeader>\\n        <TooltipTableBody>\\n          {items.map(({ datum, seriesIdentifier: { key }, color }) => (\\n            <TooltipTableRow key={`${key}-${datum.x}`}>\\n              {showColor && <TooltipTableColorCell color={color} />}\\n              <TooltipTableCell style={style}>{datum.x}</TooltipTableCell>\\n              <TooltipTableCell style={style}>{datum.y}</TooltipTableCell>\\n              <TooltipTableCell style={style}>{datum.z}</TooltipTableCell>\\n            </TooltipTableRow>\\n          ))}\\n        </TooltipTableBody>\\n        <TooltipTableFooter>\\n          <TooltipTableRow>\\n            {showColor && <TooltipTableColorCell />}\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { x } }) => s + x, 0)}</TooltipTableCell>\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { y } }) => s + y, 0)}</TooltipTableCell>\\n            <TooltipTableCell style={style}>{items.reduce((s, { datum: { z } }) => s + z, 0)}</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableFooter>\\n      </TooltipTable>\\n    );\\n  };\\n  return <TooltipShowcase info={tableSimple} pinned={pinned} tooltip={{ body: TooltipBody }} />;\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { TooltipTable, TooltipTableColumn, XYChartSeriesIdentifier } from '@elastic/charts';\\n\\nimport { tableMultipleX } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const showColor = boolean('show color', true);\\n  const columns: TooltipTableColumn<any, XYChartSeriesIdentifier>[] = [\\n    { type: 'number', header: 'Value A', cell: ({ datum }) => datum.x },\\n    { type: 'number', header: 'Value B', cell: ({ datum }) => datum.y },\\n    { type: 'number', header: 'sum(A,B)', cell: ({ datum }) => datum.x + datum.y },\\n    { type: 'number', header: 'avg(A,B)', cell: ({ datum }) => ((datum.x + datum.y) / 2).toFixed(1) },\\n  ];\\n  if (showColor) {\\n    columns.unshift({ type: 'color' });\\n  }\\n\\n  return (\\n    <TooltipShowcase\\n      info={tableMultipleX}\\n      tooltip={{ body: ({ items }) => <TooltipTable items={items} columns={columns} /> }}\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":17},\"endLoc\":{\"col\":1,\"line\":35},\"startBody\":{\"col\":23,\"line\":17},\"endBody\":{\"col\":1,\"line\":35}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { TooltipTable, TooltipTableColumn, XYChartSeriesIdentifier } from '@elastic/charts';\n\nimport { tableMultipleX } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const showColor = boolean('show color', true);\n  const columns: TooltipTableColumn<any, XYChartSeriesIdentifier>[] = [\n    { type: 'number', header: 'Value A', cell: ({ datum }) => datum.x },\n    { type: 'number', header: 'Value B', cell: ({ datum }) => datum.y },\n    { type: 'number', header: 'sum(A,B)', cell: ({ datum }) => datum.x + datum.y },\n    { type: 'number', header: 'avg(A,B)', cell: ({ datum }) => ((datum.x + datum.y) / 2).toFixed(1) },\n  ];\n  if (showColor) {\n    columns.unshift({ type: 'color' });\n  }\n\n  return (\n    <TooltipShowcase\n      info={tableMultipleX}\n      tooltip={{ body: ({ items }) => <TooltipTable items={items} columns={columns} /> }}\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const showColor = boolean('show color', true);\\n  const columns: TooltipTableColumn<any, XYChartSeriesIdentifier>[] = [\\n    { type: 'number', header: 'Value A', cell: ({ datum }) => datum.x },\\n    { type: 'number', header: 'Value B', cell: ({ datum }) => datum.y },\\n    { type: 'number', header: 'sum(A,B)', cell: ({ datum }) => datum.x + datum.y },\\n    { type: 'number', header: 'avg(A,B)', cell: ({ datum }) => ((datum.x + datum.y) / 2).toFixed(1) },\\n  ];\\n  if (showColor) {\\n    columns.unshift({ type: 'color' });\\n  }\\n\\n  return (\\n    <TooltipShowcase\\n      info={tableMultipleX}\\n      tooltip={{ body: ({ items }) => <TooltipTable items={items} columns={columns} /> }}\\n    />\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  TooltipTable,\\n  TooltipTableBody,\\n  TooltipTableHeader,\\n  TooltipTableRow,\\n  TooltipTableCell,\\n  TooltipTableColorCell,\\n  TooltipAction,\\n  TooltipSpec,\\n  useTooltipContext,\\n  SeriesIdentifier,\\n} from '@elastic/charts';\\n\\nimport { long } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const actions: TooltipAction<any, SeriesIdentifier>[] = [\\n    {\\n      label: () => 'Log storybook action',\\n      onSelect: (s) => action('onTooltipAction')(s),\\n    },\\n    {\\n      label: ({ length }) => (\\n        <span>\\n          Alert keys of all <b>{length}</b> selected series\\n        </span>\\n      ),\\n      disabled: ({ length }) => (length < 1 ? 'Select at least one series' : false),\\n      onSelect: (series) =>\\n        alert(`Selected the following: \\\\n - ${series.map((s) => s.seriesIdentifier.key).join('\\\\n - ')}`),\\n    },\\n  ];\\n\\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\\n    const { pinned, selected, toggleSelected } = useTooltipContext();\\n    return (\\n      <TooltipTable maxHeight={100} gridTemplateColumns=\\\"11px auto auto\\\">\\n        <TooltipTableHeader>\\n          <TooltipTableRow>\\n            <TooltipTableColorCell />\\n            <TooltipTableCell style={{ textAlign: 'left' }}>Category</TooltipTableCell>\\n            <TooltipTableCell style={{ textAlign: 'right' }}>Value</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableHeader>\\n        <TooltipTableBody>\\n          {items.map((value) => {\\n            const onSelect = () => toggleSelected(value);\\n            return (\\n              <TooltipTableRow\\n                isSelected={pinned && selected.includes(value)}\\n                onSelect={onSelect}\\n                key={`${value.seriesIdentifier.key}-${value.datum.x}`}\\n              >\\n                <TooltipTableColorCell color={value.color} />\\n                <TooltipTableCell style={{ textAlign: 'left' }}>{value.label}</TooltipTableCell>\\n                <TooltipTableCell style={{ textAlign: 'right' }}>{value.formattedValue}</TooltipTableCell>\\n              </TooltipTableRow>\\n            );\\n          })}\\n        </TooltipTableBody>\\n      </TooltipTable>\\n    );\\n  };\\n  return (\\n    <TooltipShowcase\\n      info={long}\\n      pinned={boolean('pinned', false)}\\n      tooltip={{\\n        actions,\\n        body: TooltipBody,\\n        header: boolean('show header', true) ? ({ header }) => <>Time: {header?.formattedValue}</> : ('none' as const),\\n        footer: boolean('show footer', true) ? ({ items }) => <>Total of {items.length} categories</> : 'none',\\n      }}\\n      canPinTooltip\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\\\\n  This example shows how you can build a tabular tooltip by structuring the table components explicitly within \\\\`TooltipTable\\\\` instead of using the \\\\`columns\\\\` option.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":29},\"endLoc\":{\"col\":1,\"line\":90},\"startBody\":{\"col\":23,\"line\":29},\"endBody\":{\"col\":1,\"line\":90}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  TooltipTable,\n  TooltipTableBody,\n  TooltipTableHeader,\n  TooltipTableRow,\n  TooltipTableCell,\n  TooltipTableColorCell,\n  TooltipAction,\n  TooltipSpec,\n  useTooltipContext,\n  SeriesIdentifier,\n} from '@elastic/charts';\n\nimport { long } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const actions: TooltipAction<any, SeriesIdentifier>[] = [\n    {\n      label: () => 'Log storybook action',\n      onSelect: (s) => action('onTooltipAction')(s),\n    },\n    {\n      label: ({ length }) => (\n        <span>\n          Alert keys of all <b>{length}</b> selected series\n        </span>\n      ),\n      disabled: ({ length }) => (length < 1 ? 'Select at least one series' : false),\n      onSelect: (series) =>\n        alert(`Selected the following: \\n - ${series.map((s) => s.seriesIdentifier.key).join('\\n - ')}`),\n    },\n  ];\n\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\n    const { pinned, selected, toggleSelected } = useTooltipContext();\n    return (\n      <TooltipTable maxHeight={100} gridTemplateColumns=\"11px auto auto\">\n        <TooltipTableHeader>\n          <TooltipTableRow>\n            <TooltipTableColorCell />\n            <TooltipTableCell style={{ textAlign: 'left' }}>Category</TooltipTableCell>\n            <TooltipTableCell style={{ textAlign: 'right' }}>Value</TooltipTableCell>\n          </TooltipTableRow>\n        </TooltipTableHeader>\n        <TooltipTableBody>\n          {items.map((value) => {\n            const onSelect = () => toggleSelected(value);\n            return (\n              <TooltipTableRow\n                isSelected={pinned && selected.includes(value)}\n                onSelect={onSelect}\n                key={`${value.seriesIdentifier.key}-${value.datum.x}`}\n              >\n                <TooltipTableColorCell color={value.color} />\n                <TooltipTableCell style={{ textAlign: 'left' }}>{value.label}</TooltipTableCell>\n                <TooltipTableCell style={{ textAlign: 'right' }}>{value.formattedValue}</TooltipTableCell>\n              </TooltipTableRow>\n            );\n          })}\n        </TooltipTableBody>\n      </TooltipTable>\n    );\n  };\n  return (\n    <TooltipShowcase\n      info={long}\n      pinned={boolean('pinned', false)}\n      tooltip={{\n        actions,\n        body: TooltipBody,\n        header: boolean('show header', true) ? ({ header }) => <>Time: {header?.formattedValue}</> : ('none' as const),\n        footer: boolean('show footer', true) ? ({ items }) => <>Total of {items.length} categories</> : 'none',\n      }}\n      canPinTooltip\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\n  This example shows how you can build a tabular tooltip by structuring the table components explicitly within \\`TooltipTable\\` instead of using the \\`columns\\` option.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const actions: TooltipAction<any, SeriesIdentifier>[] = [\\n    {\\n      label: () => 'Log storybook action',\\n      onSelect: (s) => action('onTooltipAction')(s),\\n    },\\n    {\\n      label: ({ length }) => (\\n        <span>\\n          Alert keys of all <b>{length}</b> selected series\\n        </span>\\n      ),\\n      disabled: ({ length }) => (length < 1 ? 'Select at least one series' : false),\\n      onSelect: (series) =>\\n        alert(`Selected the following: \\\\n - ${series.map((s) => s.seriesIdentifier.key).join('\\\\n - ')}`),\\n    },\\n  ];\\n\\n  const TooltipBody: TooltipSpec['body'] = ({ items }) => {\\n    const { pinned, selected, toggleSelected } = useTooltipContext();\\n    return (\\n      <TooltipTable maxHeight={100} gridTemplateColumns=\\\"11px auto auto\\\">\\n        <TooltipTableHeader>\\n          <TooltipTableRow>\\n            <TooltipTableColorCell />\\n            <TooltipTableCell style={{ textAlign: 'left' }}>Category</TooltipTableCell>\\n            <TooltipTableCell style={{ textAlign: 'right' }}>Value</TooltipTableCell>\\n          </TooltipTableRow>\\n        </TooltipTableHeader>\\n        <TooltipTableBody>\\n          {items.map((value) => {\\n            const onSelect = () => toggleSelected(value);\\n            return (\\n              <TooltipTableRow\\n                isSelected={pinned && selected.includes(value)}\\n                onSelect={onSelect}\\n                key={`${value.seriesIdentifier.key}-${value.datum.x}`}\\n              >\\n                <TooltipTableColorCell color={value.color} />\\n                <TooltipTableCell style={{ textAlign: 'left' }}>{value.label}</TooltipTableCell>\\n                <TooltipTableCell style={{ textAlign: 'right' }}>{value.formattedValue}</TooltipTableCell>\\n              </TooltipTableRow>\\n            );\\n          })}\\n        </TooltipTableBody>\\n      </TooltipTable>\\n    );\\n  };\\n  return (\\n    <TooltipShowcase\\n      info={long}\\n      pinned={boolean('pinned', false)}\\n      tooltip={{\\n        actions,\\n        body: TooltipBody,\\n        header: boolean('show header', true) ? ({ header }) => <>Time: {header?.formattedValue}</> : ('none' as const),\\n        footer: boolean('show footer', true) ? ({ items }) => <>Total of {items.length} categories</> : 'none',\\n      }}\\n      canPinTooltip\\n    />\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { tableSimple, simple, long, partition } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const maxVisibleTooltipItems = number('max visible tooltip items', 3);\\n  const maxTooltipItems = number('max tooltip items', 3);\\n  const dataSet = select(\\n    'dataSet',\\n    {\\n      '4 elements': 'simple',\\n      '8 elements': 'long',\\n      'Simple - table': 'tableSimple',\\n      partition: 'partition',\\n    },\\n    'simple',\\n  );\\n  const dataSets = {\\n    tableSimple,\\n    simple,\\n    long,\\n    partition,\\n  };\\n\\n  const pinned = boolean('pinned', false);\\n\\n  return (\\n    <TooltipShowcase\\n      info={dataSets[dataSet]}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        maxVisibleTooltipItems,\\n        maxTooltipItems,\\n        actions: [\\n          {\\n            label: () => 'Drilldown to dashboard X',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            disabled: (d) => d.length < 1,\\n            label: (d) =>\\n              d.length < 1 ? 'Select to filter categories' : `Filter categor${d.length > 1 ? 'ies' : 'y'}`,\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            disabled: (d) => d.length < 1,\\n            label: (d) => (d.length < 1 ? 'Select to copy values' : `Copy value${d.length > 1 ? 's' : ''}`),\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            label: () => 'A long action label is truncated at max tooltip width',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n        ],\\n      }}\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\\\\n  This example shows how you can build the default list tooltip by defining the \\\\`columns\\\\` on the \\\\`TooltipTable\\\\` component inside a \\\\`CustomTooltip\\\\`.`,\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":16},\"endLoc\":{\"col\":1,\"line\":70},\"startBody\":{\"col\":23,\"line\":16},\"endBody\":{\"col\":1,\"line\":70}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { tableSimple, simple, long, partition } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const maxVisibleTooltipItems = number('max visible tooltip items', 3);\n  const maxTooltipItems = number('max tooltip items', 3);\n  const dataSet = select(\n    'dataSet',\n    {\n      '4 elements': 'simple',\n      '8 elements': 'long',\n      'Simple - table': 'tableSimple',\n      partition: 'partition',\n    },\n    'simple',\n  );\n  const dataSets = {\n    tableSimple,\n    simple,\n    long,\n    partition,\n  };\n\n  const pinned = boolean('pinned', false);\n\n  return (\n    <TooltipShowcase\n      info={dataSets[dataSet]}\n      pinned={pinned}\n      canPinTooltip\n      tooltip={{\n        maxVisibleTooltipItems,\n        maxTooltipItems,\n        actions: [\n          {\n            label: () => 'Drilldown to dashboard X',\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n          {\n            disabled: (d) => d.length < 1,\n            label: (d) =>\n              d.length < 1 ? 'Select to filter categories' : `Filter categor${d.length > 1 ? 'ies' : 'y'}`,\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n          {\n            disabled: (d) => d.length < 1,\n            label: (d) => (d.length < 1 ? 'Select to copy values' : `Copy value${d.length > 1 ? 's' : ''}`),\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n          {\n            label: () => 'A long action label is truncated at max tooltip width',\n            onSelect: (s) => action('onTooltipAction')(s),\n          },\n        ],\n      }}\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  markdown: `Tooltips may be composed with internal components to build out completely custom tooltips while maintaining a consistent style.\\\n  This example shows how you can build the default list tooltip by defining the \\`columns\\` on the \\`TooltipTable\\` component inside a \\`CustomTooltip\\`.`,\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const maxVisibleTooltipItems = number('max visible tooltip items', 3);\\n  const maxTooltipItems = number('max tooltip items', 3);\\n  const dataSet = select(\\n    'dataSet',\\n    {\\n      '4 elements': 'simple',\\n      '8 elements': 'long',\\n      'Simple - table': 'tableSimple',\\n      partition: 'partition',\\n    },\\n    'simple',\\n  );\\n  const dataSets = {\\n    tableSimple,\\n    simple,\\n    long,\\n    partition,\\n  };\\n\\n  const pinned = boolean('pinned', false);\\n\\n  return (\\n    <TooltipShowcase\\n      info={dataSets[dataSet]}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        maxVisibleTooltipItems,\\n        maxTooltipItems,\\n        actions: [\\n          {\\n            label: () => 'Drilldown to dashboard X',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            disabled: (d) => d.length < 1,\\n            label: (d) =>\\n              d.length < 1 ? 'Select to filter categories' : `Filter categor${d.length > 1 ? 'ies' : 'y'}`,\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            disabled: (d) => d.length < 1,\\n            label: (d) => (d.length < 1 ? 'Select to copy values' : `Copy value${d.length > 1 ? 's' : ''}`),\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n          {\\n            label: () => 'A long action label is truncated at max tooltip width',\\n            onSelect: (s) => action('onTooltipAction')(s),\\n          },\\n        ],\\n      }}\\n    />\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { simple } from './data';\\nimport { TooltipShowcase } from './tooltip_showcase';\\n\\nexport const Example = () => {\\n  const pinned = boolean('pinned', true);\\n\\n  return (\\n    <TooltipShowcase\\n      info={simple}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        actionsLoading: \\\"I'm loading some actions...\\\",\\n        maxVisibleTooltipItems: 3,\\n        maxTooltipItems: 3,\\n        actions: (selected) => {\\n          return selected.length > 0\\n            ? new Promise((resolve) => {\\n                setTimeout(() => {\\n                  resolve([\\n                    {\\n                      label: () => `Async action on ${selected.length} selected`,\\n                      onSelect: (s) => action('onTooltipAction')(s),\\n                    },\\n                    {\\n                      label: () => `Sync action`,\\n                      onSelect: (s) => action('onTooltipAction')(s),\\n                    },\\n                  ]);\\n                }, 1000);\\n              })\\n            : [\\n                {\\n                  label: () => `Sync action`,\\n                  onSelect: (s) => action('onTooltipAction')(s),\\n                },\\n              ];\\n        },\\n      }}\\n    />\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n  background: { disable: true },\\n  markdown: 'Select a series to load async actions',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":16},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":23,\"line\":16},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { simple } from './data';\nimport { TooltipShowcase } from './tooltip_showcase';\n\nexport const Example = () => {\n  const pinned = boolean('pinned', true);\n\n  return (\n    <TooltipShowcase\n      info={simple}\n      pinned={pinned}\n      canPinTooltip\n      tooltip={{\n        actionsLoading: \"I'm loading some actions...\",\n        maxVisibleTooltipItems: 3,\n        maxTooltipItems: 3,\n        actions: (selected) => {\n          return selected.length > 0\n            ? new Promise((resolve) => {\n                setTimeout(() => {\n                  resolve([\n                    {\n                      label: () => `Async action on ${selected.length} selected`,\n                      onSelect: (s) => action('onTooltipAction')(s),\n                    },\n                    {\n                      label: () => `Sync action`,\n                      onSelect: (s) => action('onTooltipAction')(s),\n                    },\n                  ]);\n                }, 1000);\n              })\n            : [\n                {\n                  label: () => `Sync action`,\n                  onSelect: (s) => action('onTooltipAction')(s),\n                },\n              ];\n        },\n      }}\n    />\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n  background: { disable: true },\n  markdown: 'Select a series to load async actions',\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const pinned = boolean('pinned', true);\\n\\n  return (\\n    <TooltipShowcase\\n      info={simple}\\n      pinned={pinned}\\n      canPinTooltip\\n      tooltip={{\\n        actionsLoading: \\\"I'm loading some actions...\\\",\\n        maxVisibleTooltipItems: 3,\\n        maxTooltipItems: 3,\\n        actions: (selected) => {\\n          return selected.length > 0\\n            ? new Promise((resolve) => {\\n                setTimeout(() => {\\n                  resolve([\\n                    {\\n                      label: () => `Async action on ${selected.length} selected`,\\n                      onSelect: (s) => action('onTooltipAction')(s),\\n                    },\\n                    {\\n                      label: () => `Sync action`,\\n                      onSelect: (s) => action('onTooltipAction')(s),\\n                    },\\n                  ]);\\n                }, 1000);\\n              })\\n            : [\\n                {\\n                  label: () => `Sync action`,\\n                  onSelect: (s) => action('onTooltipAction')(s),\\n                },\\n              ];\\n        },\\n      }}\\n    />\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport * from './list';\nexport * from './table';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipInfo, XYChartSeriesIdentifier } from '@elastic/charts';\n\nexport const simple: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: {\n    valueAccessor: 'y1',\n    value: 0,\n    formattedValue: '2022-10-31 00:00:00.666',\n  },\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y1',\n      value: 1,\n      formattedValue: '1.00',\n      markValue: null,\n      color: '#54B399',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y2',\n      value: 4,\n      formattedValue: '4.00',\n      markValue: null,\n      color: '#6092C0',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y1',\n      value: 3,\n      formattedValue: '3.00',\n      markValue: null,\n      color: '#D36086',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y2',\n      value: 6,\n      formattedValue: '6.00',\n      markValue: null,\n      color: '#9170B8',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n  ],\n};\n\nexport const long: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: {\n    valueAccessor: 'y1',\n    value: 0,\n    formattedValue: '2022-10-31 00:00:00.666',\n  },\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y1',\n      value: 1,\n      formattedValue: '1.00',\n      markValue: null,\n      color: '#54B399',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y2',\n      value: 4,\n      formattedValue: '4.00',\n      markValue: null,\n      color: '#6092C0',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y1',\n      value: 3,\n      formattedValue: '3.00',\n      markValue: null,\n      color: '#D36086',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y2',\n      value: 6,\n      formattedValue: '6.00',\n      markValue: null,\n      color: '#9170B8',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars2}yAccessor{y1}splitAccessors{g-a}',\n        specId: 'bars2',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y1',\n      value: 1,\n      formattedValue: '1.00',\n      markValue: null,\n      color: '#54B399',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars2}yAccessor{y2}splitAccessors{g-a}',\n        specId: 'bars2',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'a - y2',\n      value: 4,\n      formattedValue: '4.00',\n      markValue: null,\n      color: '#6092C0',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars2}yAccessor{y1}splitAccessors{g-b}',\n        specId: 'bars2',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y1',\n      value: 3,\n      formattedValue: '3.00',\n      markValue: null,\n      color: '#D36086',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars2}yAccessor{y2}splitAccessors{g-b}',\n        specId: 'bars2',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'b - y2',\n      value: 6,\n      formattedValue: '6.00',\n      markValue: null,\n      color: '#9170B8',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n  ],\n};\n\nexport const partition: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: null,\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'EMEA',\n      value: 1,\n      formattedValue: '5.23M (50%)',\n      markValue: null,\n      color: '#72A4CD',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y2}splitAccessors{g-a}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y2',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y2'],\n      },\n      valueAccessor: 'y1',\n      label: 'Italy',\n      value: 4,\n      formattedValue: '2.51M (25%)',\n      markValue: null,\n      color: '#99BFDB',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'a', y1: 1, y2: 4 },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bars1}yAccessor{y1}splitAccessors{g-b}',\n        specId: 'bars1',\n        xAccessor: 'x',\n        yAccessor: 'y1',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y1'],\n      },\n      valueAccessor: 'y1',\n      label: 'Tuscany',\n      value: 3,\n      formattedValue: '5.76k (0.5%)',\n      markValue: null,\n      color: '#CEE0EC',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 0, g: 'b', y1: 3, y2: 6 },\n    },\n  ],\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport const DATA_SERIES = [\n  {\n    name: 'host-6942',\n    max: 0.4045874873797099,\n    value: 0.2962680558363597,\n    avg: 0.3063191495628821,\n    timeseries: {\n      id: 'user',\n      columns: [\n        { name: 'timestamp', type: 'date' },\n        { name: 'metric_0', type: 'number' },\n      ],\n      rows: [\n        { timestamp: 1667332800000, metric_0: 0.34874142706394196 },\n        { timestamp: 1667332830000, metric_0: 0.35777633388837177 },\n        { timestamp: 1667332860000, metric_0: 0.3244831711053848 },\n        { timestamp: 1667332890000, metric_0: 0.2811833620071411 },\n        { timestamp: 1667332920000, metric_0: 0.15896100302537283 },\n        { timestamp: 1667332950000, metric_0: 0.2559752066930135 },\n        { timestamp: 1667332980000, metric_0: 0.3839319944381714 },\n        { timestamp: 1667333010000, metric_0: 0.33599595725536346 },\n        { timestamp: 1667333040000, metric_0: 0.334477037191391 },\n        { timestamp: 1667333070000, metric_0: 0.31254007418950397 },\n        { timestamp: 1667333100000, metric_0: 0.2939229408899943 },\n        { timestamp: 1667333130000, metric_0: 0.2863461921612422 },\n        { timestamp: 1667333160000, metric_0: 0.367951621611913 },\n        { timestamp: 1667333190000, metric_0: 0.3177519639333089 },\n        { timestamp: 1667333220000, metric_0: 0.4045874873797099 },\n        { timestamp: 1667333250000, metric_0: 0.34589988986651105 },\n        { timestamp: 1667333280000, metric_0: 0.3585460086663564 },\n        { timestamp: 1667333310000, metric_0: 0.2979138692220052 },\n        { timestamp: 1667333340000, metric_0: 0.16280274093151093 },\n        { timestamp: 1667333370000, metric_0: 0.32333482801914215 },\n        { timestamp: 1667333400000, metric_0: 0.29096199075380963 },\n        { timestamp: 1667333430000, metric_0: 0.25330813725789386 },\n        { timestamp: 1667333460000, metric_0: 0.38834187388420105 },\n        { timestamp: 1667333490000, metric_0: 0.3326689153909683 },\n        { timestamp: 1667333520000, metric_0: 0.32251523931821185 },\n        { timestamp: 1667333550000, metric_0: 0.3552623987197876 },\n        { timestamp: 1667333580000, metric_0: 0.28945807615915936 },\n        { timestamp: 1667333610000, metric_0: 0.3198018620411555 },\n        { timestamp: 1667333640000, metric_0: 0.28636954228083294 },\n        { timestamp: 1667333670000, metric_0: 0.3299245585997899 },\n        { timestamp: 1667333700000, metric_0: 0.3147045473257701 },\n        { timestamp: 1667333730000, metric_0: 0.3403649826844533 },\n        { timestamp: 1667333760000, metric_0: 0.3060835003852844 },\n        { timestamp: 1667333790000, metric_0: 0.30727096895376843 },\n        { timestamp: 1667333820000, metric_0: 0.2983386317888896 },\n        { timestamp: 1667333850000, metric_0: 0.26111698647340137 },\n        { timestamp: 1667333880000, metric_0: 0.2863030731678009 },\n        { timestamp: 1667333910000, metric_0: 0.35175105929374695 },\n        { timestamp: 1667333940000, metric_0: 0.30486862858136493 },\n        { timestamp: 1667333970000, metric_0: 0.2920278211434682 },\n        { timestamp: 1667334000000, metric_0: 0.3553886612256368 },\n        { timestamp: 1667334030000, metric_0: 0.33247488737106323 },\n        { timestamp: 1667334060000, metric_0: 0.3503577907880147 },\n        { timestamp: 1667334090000, metric_0: 0.32119495670000714 },\n        { timestamp: 1667334120000, metric_0: 0.2809036473433177 },\n        { timestamp: 1667334150000, metric_0: 0.3616585930188497 },\n        { timestamp: 1667334180000, metric_0: 0.35740313430627185 },\n        { timestamp: 1667334210000, metric_0: 0.3608712653319041 },\n        { timestamp: 1667334240000, metric_0: 0.2637135585149129 },\n        { timestamp: 1667334270000, metric_0: 0.2613096684217453 },\n        { timestamp: 1667334300000, metric_0: 0.3533228536446889 },\n        { timestamp: 1667334330000, metric_0: 0.2453788916269938 },\n        { timestamp: 1667334360000, metric_0: 0.3233574728171031 },\n        { timestamp: 1667334390000, metric_0: 0.35204625129699707 },\n        { timestamp: 1667334420000, metric_0: 0.28329822421073914 },\n        { timestamp: 1667334450000, metric_0: 0.27605955799420673 },\n        { timestamp: 1667334480000, metric_0: 0.3174302776654561 },\n        { timestamp: 1667334510000, metric_0: 0.3174441357453664 },\n        { timestamp: 1667334540000, metric_0: 0.3032358189423879 },\n        { timestamp: 1667334570000, metric_0: 0.37016361951828003 },\n        { timestamp: 1667334600000, metric_0: 0.2845376158754031 },\n        { timestamp: 1667334630000, metric_0: 0.28091730177402496 },\n        { timestamp: 1667334660000, metric_0: 0.298275093237559 },\n        { timestamp: 1667334690000, metric_0: 0.28138890862464905 },\n        { timestamp: 1667334720000, metric_0: 0.23357486724853516 },\n        { timestamp: 1667334750000, metric_0: 0.40123457709948224 },\n        { timestamp: 1667334780000, metric_0: 0.2939300686120987 },\n        { timestamp: 1667334810000, metric_0: 0.3072533706823985 },\n        { timestamp: 1667334840000, metric_0: 0.34876759847005206 },\n        { timestamp: 1667334870000, metric_0: 0.2714219739039739 },\n        { timestamp: 1667334900000, metric_0: 0.3688941200574239 },\n        { timestamp: 1667334930000, metric_0: 0.26487817863623303 },\n        { timestamp: 1667334960000, metric_0: 0.31206977367401123 },\n        { timestamp: 1667334990000, metric_0: 0.2907249927520752 },\n        { timestamp: 1667335020000, metric_0: 0.3487333655357361 },\n        { timestamp: 1667335050000, metric_0: 0.30691683292388916 },\n        { timestamp: 1667335080000, metric_0: 0.2549840062856674 },\n        { timestamp: 1667335110000, metric_0: 0.3625897367795308 },\n        { timestamp: 1667335140000, metric_0: 0.2855423291524251 },\n        { timestamp: 1667335170000, metric_0: 0.2462362994750341 },\n        { timestamp: 1667335200000, metric_0: 0.2915644546349843 },\n        { timestamp: 1667335230000, metric_0: 0.3488748570283254 },\n        { timestamp: 1667335260000, metric_0: 0.3100440204143524 },\n        { timestamp: 1667335290000, metric_0: 0.2573837737242381 },\n        { timestamp: 1667335320000, metric_0: 0.3266606132189433 },\n        { timestamp: 1667335350000, metric_0: 0.26736895740032196 },\n        { timestamp: 1667335380000, metric_0: 0.380219042301178 },\n        { timestamp: 1667335410000, metric_0: 0.22705280780792236 },\n        { timestamp: 1667335440000, metric_0: 0.352107306321462 },\n        { timestamp: 1667335470000, metric_0: 0.25591664512952167 },\n        { timestamp: 1667335500000, metric_0: 0.25495874385039013 },\n        { timestamp: 1667335530000, metric_0: 0.2860405544439952 },\n        { timestamp: 1667335560000, metric_0: 0.19073789566755295 },\n        { timestamp: 1667335590000, metric_0: 0.34192585945129395 },\n        { timestamp: 1667335620000, metric_0: 0.29069269200166065 },\n        { timestamp: 1667335650000, metric_0: 0.3985736568768819 },\n        { timestamp: 1667335680000, metric_0: 0.3556165198485057 },\n        { timestamp: 1667335710000, metric_0: 0.30276427666346234 },\n        { timestamp: 1667335740000, metric_0: 0.3264604906241099 },\n        { timestamp: 1667335770000, metric_0: 0.2258296882112821 },\n        { timestamp: 1667335800000, metric_0: 0.3347952465216319 },\n        { timestamp: 1667335830000, metric_0: 0.2713114619255066 },\n        { timestamp: 1667335860000, metric_0: 0.35919984181722003 },\n        { timestamp: 1667335890000, metric_0: 0.31145066022872925 },\n        { timestamp: 1667335920000, metric_0: 0.3422968288262685 },\n        { timestamp: 1667335950000, metric_0: 0.32901568214098614 },\n        { timestamp: 1667335980000, metric_0: 0.30424686272939044 },\n        { timestamp: 1667336010000, metric_0: 0.32844143112500507 },\n        { timestamp: 1667336040000, metric_0: 0.28995340565840405 },\n        { timestamp: 1667336070000, metric_0: 0.3078547269105911 },\n        { timestamp: 1667336100000, metric_0: 0.2830798228581746 },\n        { timestamp: 1667336130000, metric_0: 0.2377857267856598 },\n        { timestamp: 1667336160000, metric_0: 0.21685329576333365 },\n        { timestamp: 1667336190000, metric_0: 0.3035924782355626 },\n        { timestamp: 1667336220000, metric_0: 0.22407410542170206 },\n        { timestamp: 1667336250000, metric_0: 0.3591982622941335 },\n        { timestamp: 1667336280000, metric_0: 0.26838067173957825 },\n        { timestamp: 1667336310000, metric_0: 0.23181848227977753 },\n        { timestamp: 1667336340000, metric_0: 0.2534378618001938 },\n        { timestamp: 1667336370000, metric_0: 0.2962680558363597 },\n      ],\n    },\n  },\n  {\n    name: 'host-3116',\n    max: 0.10114687184492747,\n    value: 0.07406701395908992,\n    avg: 0.07657978739072052,\n    timeseries: {\n      id: 'system',\n      columns: [\n        { name: 'timestamp', type: 'date' },\n        { name: 'metric_0', type: 'number' },\n      ],\n      rows: [\n        { timestamp: 1667332800000, metric_0: 0.08718535676598549 },\n        { timestamp: 1667332830000, metric_0: 0.08944408347209294 },\n        { timestamp: 1667332860000, metric_0: 0.0811207927763462 },\n        { timestamp: 1667332890000, metric_0: 0.07029584050178528 },\n        { timestamp: 1667332920000, metric_0: 0.03974025075634321 },\n        { timestamp: 1667332950000, metric_0: 0.06399380167325337 },\n        { timestamp: 1667332980000, metric_0: 0.09598299860954285 },\n        { timestamp: 1667333010000, metric_0: 0.08399898931384087 },\n        { timestamp: 1667333040000, metric_0: 0.08361925929784775 },\n        { timestamp: 1667333070000, metric_0: 0.07813501854737599 },\n        { timestamp: 1667333100000, metric_0: 0.07348073522249858 },\n        { timestamp: 1667333130000, metric_0: 0.07158654804031055 },\n        { timestamp: 1667333160000, metric_0: 0.09198790540297826 },\n        { timestamp: 1667333190000, metric_0: 0.07943799098332723 },\n        { timestamp: 1667333220000, metric_0: 0.10114687184492747 },\n        { timestamp: 1667333250000, metric_0: 0.08647497246662776 },\n        { timestamp: 1667333280000, metric_0: 0.0896365021665891 },\n        { timestamp: 1667333310000, metric_0: 0.0744784673055013 },\n        { timestamp: 1667333340000, metric_0: 0.04070068523287773 },\n        { timestamp: 1667333370000, metric_0: 0.08083370700478554 },\n        { timestamp: 1667333400000, metric_0: 0.07274049768845241 },\n        { timestamp: 1667333430000, metric_0: 0.06332703431447347 },\n        { timestamp: 1667333460000, metric_0: 0.09708546847105026 },\n        { timestamp: 1667333490000, metric_0: 0.08316722884774208 },\n        { timestamp: 1667333520000, metric_0: 0.08062880982955296 },\n        { timestamp: 1667333550000, metric_0: 0.0888155996799469 },\n        { timestamp: 1667333580000, metric_0: 0.07236451903978984 },\n        { timestamp: 1667333610000, metric_0: 0.07995046551028888 },\n        { timestamp: 1667333640000, metric_0: 0.07159238557020824 },\n        { timestamp: 1667333670000, metric_0: 0.08248113964994748 },\n        { timestamp: 1667333700000, metric_0: 0.07867613683144252 },\n        { timestamp: 1667333730000, metric_0: 0.08509124567111333 },\n        { timestamp: 1667333760000, metric_0: 0.0765208750963211 },\n        { timestamp: 1667333790000, metric_0: 0.07681774223844211 },\n        { timestamp: 1667333820000, metric_0: 0.0745846579472224 },\n        { timestamp: 1667333850000, metric_0: 0.06527924661835034 },\n        { timestamp: 1667333880000, metric_0: 0.07157576829195023 },\n        { timestamp: 1667333910000, metric_0: 0.08793776482343674 },\n        { timestamp: 1667333940000, metric_0: 0.07621715714534123 },\n        { timestamp: 1667333970000, metric_0: 0.07300695528586705 },\n        { timestamp: 1667334000000, metric_0: 0.0888471653064092 },\n        { timestamp: 1667334030000, metric_0: 0.08311872184276581 },\n        { timestamp: 1667334060000, metric_0: 0.08758944769700368 },\n        { timestamp: 1667334090000, metric_0: 0.08029873917500178 },\n        { timestamp: 1667334120000, metric_0: 0.07022591183582942 },\n        { timestamp: 1667334150000, metric_0: 0.09041464825471242 },\n        { timestamp: 1667334180000, metric_0: 0.08935078357656796 },\n        { timestamp: 1667334210000, metric_0: 0.09021781633297603 },\n        { timestamp: 1667334240000, metric_0: 0.06592838962872823 },\n        { timestamp: 1667334270000, metric_0: 0.06532741710543633 },\n        { timestamp: 1667334300000, metric_0: 0.08833071341117223 },\n        { timestamp: 1667334330000, metric_0: 0.06134472290674845 },\n        { timestamp: 1667334360000, metric_0: 0.08083936820427577 },\n        { timestamp: 1667334390000, metric_0: 0.08801156282424927 },\n        { timestamp: 1667334420000, metric_0: 0.07082455605268478 },\n        { timestamp: 1667334450000, metric_0: 0.06901488949855168 },\n        { timestamp: 1667334480000, metric_0: 0.07935756941636403 },\n        { timestamp: 1667334510000, metric_0: 0.0793610339363416 },\n        { timestamp: 1667334540000, metric_0: 0.07580895473559697 },\n        { timestamp: 1667334570000, metric_0: 0.09254090487957001 },\n        { timestamp: 1667334600000, metric_0: 0.07113440396885078 },\n        { timestamp: 1667334630000, metric_0: 0.07022932544350624 },\n        { timestamp: 1667334660000, metric_0: 0.07456877330938975 },\n        { timestamp: 1667334690000, metric_0: 0.07034722715616226 },\n        { timestamp: 1667334720000, metric_0: 0.05839371681213379 },\n        { timestamp: 1667334750000, metric_0: 0.10030864427487056 },\n        { timestamp: 1667334780000, metric_0: 0.07348251715302467 },\n        { timestamp: 1667334810000, metric_0: 0.07681334267059962 },\n        { timestamp: 1667334840000, metric_0: 0.08719189961751302 },\n        { timestamp: 1667334870000, metric_0: 0.06785549347599347 },\n        { timestamp: 1667334900000, metric_0: 0.09222353001435597 },\n        { timestamp: 1667334930000, metric_0: 0.06621954465905826 },\n        { timestamp: 1667334960000, metric_0: 0.07801744341850281 },\n        { timestamp: 1667334990000, metric_0: 0.0726812481880188 },\n        { timestamp: 1667335020000, metric_0: 0.08718334138393402 },\n        { timestamp: 1667335050000, metric_0: 0.07672920823097229 },\n        { timestamp: 1667335080000, metric_0: 0.06374600157141685 },\n        { timestamp: 1667335110000, metric_0: 0.0906474341948827 },\n        { timestamp: 1667335140000, metric_0: 0.07138558228810628 },\n        { timestamp: 1667335170000, metric_0: 0.06155907486875852 },\n        { timestamp: 1667335200000, metric_0: 0.07289111365874608 },\n        { timestamp: 1667335230000, metric_0: 0.08721871425708135 },\n        { timestamp: 1667335260000, metric_0: 0.0775110051035881 },\n        { timestamp: 1667335290000, metric_0: 0.06434594343105952 },\n        { timestamp: 1667335320000, metric_0: 0.08166515330473582 },\n        { timestamp: 1667335350000, metric_0: 0.06684223935008049 },\n        { timestamp: 1667335380000, metric_0: 0.0950547605752945 },\n        { timestamp: 1667335410000, metric_0: 0.05676320195198059 },\n        { timestamp: 1667335440000, metric_0: 0.0880268265803655 },\n        { timestamp: 1667335470000, metric_0: 0.06397916128238042 },\n        { timestamp: 1667335500000, metric_0: 0.06373968596259753 },\n        { timestamp: 1667335530000, metric_0: 0.0715101386109988 },\n        { timestamp: 1667335560000, metric_0: 0.04768447391688824 },\n        { timestamp: 1667335590000, metric_0: 0.08548146486282349 },\n        { timestamp: 1667335620000, metric_0: 0.07267317300041516 },\n        { timestamp: 1667335650000, metric_0: 0.09964341421922047 },\n        { timestamp: 1667335680000, metric_0: 0.08890412996212642 },\n        { timestamp: 1667335710000, metric_0: 0.07569106916586558 },\n        { timestamp: 1667335740000, metric_0: 0.08161512265602748 },\n        { timestamp: 1667335770000, metric_0: 0.056457422052820526 },\n        { timestamp: 1667335800000, metric_0: 0.08369881163040797 },\n        { timestamp: 1667335830000, metric_0: 0.06782786548137665 },\n        { timestamp: 1667335860000, metric_0: 0.08979996045430501 },\n        { timestamp: 1667335890000, metric_0: 0.07786266505718231 },\n        { timestamp: 1667335920000, metric_0: 0.08557420720656712 },\n        { timestamp: 1667335950000, metric_0: 0.08225392053524654 },\n        { timestamp: 1667335980000, metric_0: 0.07606171568234761 },\n        { timestamp: 1667336010000, metric_0: 0.08211035778125127 },\n        { timestamp: 1667336040000, metric_0: 0.07248835141460101 },\n        { timestamp: 1667336070000, metric_0: 0.07696368172764778 },\n        { timestamp: 1667336100000, metric_0: 0.07076995571454366 },\n        { timestamp: 1667336130000, metric_0: 0.05944643169641495 },\n        { timestamp: 1667336160000, metric_0: 0.05421332394083341 },\n        { timestamp: 1667336190000, metric_0: 0.07589811955889066 },\n        { timestamp: 1667336220000, metric_0: 0.056018526355425514 },\n        { timestamp: 1667336250000, metric_0: 0.08979956557353337 },\n        { timestamp: 1667336280000, metric_0: 0.06709516793489456 },\n        { timestamp: 1667336310000, metric_0: 0.05795462056994438 },\n        { timestamp: 1667336340000, metric_0: 0.06335946545004845 },\n        { timestamp: 1667336370000, metric_0: 0.07406701395908992 },\n      ],\n    },\n  },\n  {\n    name: 'host-7182',\n    max: 0.46753058830897015,\n    value: 0.3638165493806203,\n    avg: 0.3188937294400401,\n    timeseries: {\n      id: 'user',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.23674675077199936,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.2762629787127177,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.24578686555226645,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.3769354472557704,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.3355911175409953,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.4029686550299327,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.30126269658406574,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.2926919957002004,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.356646329164505,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.3406519790490468,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.3723626732826233,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.33759743471940357,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.41703038414319354,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.3275140921274821,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.45101575056711835,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.29873551925023395,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.32891859610875446,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.22551120817661285,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.4007841795682907,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.3660312493642171,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.30206019182999927,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.3689626157283783,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.4176250994205475,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.2645139942566554,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.323407843708992,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.21821119884649912,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.3501889109611511,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.2743571599324544,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.27700241903464,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.335186243057251,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.270063837369283,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.335629681746165,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.31076965232690174,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.35983813802401227,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.2921534677346547,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.22411971787611643,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.24860079089800516,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.2793974429368973,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.3124958674112956,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.34034912784894306,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.3348245819409688,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.2546294033527374,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.42620877424875897,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.46753058830897015,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.39495396614074707,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.3399921655654907,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.2703582098086675,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.3471289873123169,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.3251100182533264,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.3618142207463582,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.33241911232471466,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.31730825702349347,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.2720119704802831,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.3457658290863037,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.2804016371568044,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.3279033799966176,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.32536494731903076,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.2926763991514842,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.3490923047065735,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.3012569695711136,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.3905048767725627,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.3501772383848826,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.23744273434082666,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.24697035551071167,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.2929566403230031,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.3091825842857361,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.3344510942697525,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.31740406652291614,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.4040726224581401,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.3170100251833598,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.2928963502248128,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.3328752964735031,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.357511430978775,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.2539384166399638,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.3754552702109019,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.3772915005683899,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.3096510072549184,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.28532365957895917,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.28591565291086835,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.25959018369515735,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.28709276020526886,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.24581093589464822,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.2588135947783788,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.2751153310139974,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.37329648931821185,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.26915471255779266,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.3694015343983968,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.24267461399237314,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.3097536265850067,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.3270740807056427,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.3864440421263377,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.3704795042673747,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.3289842406908671,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.29559480647246045,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.3793505032857259,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.3361785610516866,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.187428280711174,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.34851351380348206,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.2889653543631236,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.2868878245353699,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.3499130805333455,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.34690917531649273,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.2519531498352687,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.3057488799095154,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.2320807675520579,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.3403207063674927,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.2969990720351537,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.21300195157527924,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.3088476558526357,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.3366421163082123,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.43140821655591327,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.41408825914065045,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.29404223958651227,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.3118886748949687,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.29093530774116516,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.2999846190214157,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.2877273013194402,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.3342668016751607,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.29630666474501294,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.3638165493806203,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-9982',\n    max: 0.11688264707724254,\n    value: 0.09095413734515508,\n    avg: 0.07972343236001002,\n    timeseries: {\n      id: 'system',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.05918668769299984,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.06906574467817943,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.06144671638806661,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.0942338618139426,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.08389777938524882,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.10074216375748317,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.07531567414601643,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.0731729989250501,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.08916158229112625,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.0851629947622617,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.09309066832065582,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.08439935867985089,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.10425759603579839,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.08187852303187053,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.11275393764177959,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.07468387981255849,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.08222964902718861,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.056377802044153214,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.10019604489207268,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.09150781234105428,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.07551504795749982,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.09224065393209457,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.10440627485513687,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.06612849856416385,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.080851960927248,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.05455279971162478,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.08754722774028778,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.0685892899831136,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.06925060475866,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.08379656076431274,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.06751595934232076,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.08390742043654124,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.07769241308172543,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.08995953450600307,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.07303836693366368,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.056029929469029106,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.06215019772450129,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.06984936073422432,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.0781239668528239,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.08508728196223576,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.0837061454852422,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.06365735083818436,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.10655219356218974,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.11688264707724254,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.09873849153518677,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.08499804139137268,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.06758955245216687,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.08678224682807922,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.0812775045633316,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.09045355518658955,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.08310477808117867,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.07932706425587337,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.06800299262007077,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.08644145727157593,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.0701004092892011,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.0819758449991544,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.08134123682975769,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.07316909978787105,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.08727307617664337,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.0753142423927784,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.09762621919314067,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.08754430959622066,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.059360683585206665,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.06174258887767792,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.07323916008075078,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.07729564607143402,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.08361277356743813,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.07935101663072903,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.10101815561453502,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.07925250629583995,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.0732240875562032,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.08321882411837578,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.08937785774469376,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.06348460415999095,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.09386381755272548,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.09432287514209747,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.0774127518137296,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.07133091489473979,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.07147891322771709,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.06489754592378934,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.07177319005131721,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.061452733973662056,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.0647033986945947,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.06877883275349934,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.09332412232955296,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.06728867813944817,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.0923503835995992,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.060668653498093285,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.07743840664625168,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.08176852017641068,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.09661101053158443,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.09261987606684367,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.08224606017271678,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.07389870161811511,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.09483762582143147,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.08404464026292165,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.0468570701777935,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.08712837845087051,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.0722413385907809,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.07172195613384247,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.08747827013333638,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.08672729382912318,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.06298828745881717,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.07643721997737885,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.05802019188801447,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.08508017659187317,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.07424976800878842,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.05325048789381981,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.07721191396315892,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.08416052907705307,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.10785205413897832,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.10352206478516261,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.07351055989662807,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.07797216872374217,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.07273382693529129,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.07499615475535393,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.07193182532986005,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.08356670041879018,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.07407666618625323,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.09095413734515508,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-45729',\n    max: 0.4839908679326375,\n    value: 0.3916400372982025,\n    avg: 0.31918529298984344,\n    timeseries: {\n      id: 'user',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.29977621883153915,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.27408987283706665,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.28990548849105835,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.36929385860761005,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.31124788522720337,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.287537083029747,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.2967568635940552,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.20442836980024973,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.31931211551030475,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.36897707482179004,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.30757897595564526,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.2731511394182841,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.4021446208159129,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.29344835380713147,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.3425005276997884,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.25978292028109234,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.3617887695630391,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.29862308502197266,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.3178466558456421,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.3444976607958476,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.2940770337978999,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.2905193418264389,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.3637872139612834,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.23695586621761322,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.3217656562725703,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.2890215516090393,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.26715636750062305,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.37604572375615436,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.3323912521203359,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.38384440541267395,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.27270786464214325,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.2864599774281184,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.27886507908503216,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.3325890898704529,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.29754966497421265,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.32693185408910114,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.35126861929893494,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.3417484561602275,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.34694018959999084,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.28032204508781433,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.30857476592063904,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.32672243813673657,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.16484210391839346,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.24393236140410104,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.413083756963412,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.4839908679326375,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.2674439549446106,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.37867457667986554,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.33084602157274884,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.34167664249738056,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.3647904296716054,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.29186991850535077,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.3487752079963684,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.29593873023986816,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.3503992557525635,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.3810393313566844,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.3757585386435191,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.33935465415318805,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.2924812237421672,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.40377851327260333,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.4146209806203842,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.35354527831077576,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.3889002203941345,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.34190143644809723,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.3362271984418233,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.2866896986961365,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.3073747257391612,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.28786834081013996,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.35283652941385907,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.3152204602956772,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.25821750859419507,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.38528749346733093,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.31602028012275696,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.2641951193412145,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.2657024363676707,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.2444081554810206,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.2947406868139903,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.27855149904886883,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.29675881067911786,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.2986188431580861,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.20048560202121735,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.33882563809553784,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.3105841477711995,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.4018009503682454,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.2732260078191757,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.4052060842514038,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.3772941331068675,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.30714963376522064,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.2264118790626526,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.2921489228804906,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.2651912445823352,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.3499677578608195,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.3379055857658386,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.33196746309598285,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.29919471343358356,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.2668144330382347,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.3223360975583394,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.3942509392897288,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.2585953275362651,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.33873148759206134,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.31809767087300617,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.23975698153177896,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.36557382345199585,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.33297867079575855,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.26561444997787476,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.3063862770795822,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.38469745715459186,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.39382874965667725,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.3812083899974823,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.2574072331190109,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.33985555668671924,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.324711615840594,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.3706111361583074,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.27903997898101807,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.3267780542373657,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.33966315786043805,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.31545838216940564,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.27901268005371094,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.3065330187479655,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.3916400372982025,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-1337',\n    max: 0.12099771698315938,\n    value: 0.09791000932455063,\n    avg: 0.07979632324746086,\n    timeseries: {\n      id: 'system',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.07494405470788479,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.06852246820926666,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.07247637212276459,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.09232346465190251,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.07781197130680084,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.07188427075743675,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.0741892158985138,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.05110709245006243,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.07982802887757619,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.09224426870544751,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.07689474398891132,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.06828778485457103,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.10053615520397823,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.07336208845178287,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.0856251319249471,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.06494573007027309,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.09044719239075978,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.07465577125549316,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.07946166396141052,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.0861244151989619,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.07351925844947498,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.07262983545660973,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.09094680349032085,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.059238966554403305,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.08044141406814258,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.07225538790225983,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.06678909187515576,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.09401143093903859,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.08309781303008397,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.09596110135316849,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.06817696616053581,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.0716149943570296,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.06971626977125804,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.08314727246761322,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.07438741624355316,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.08173296352227528,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.08781715482473373,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.08543711404005687,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.08673504739999771,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.07008051127195358,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.07714369148015976,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.08168060953418414,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.041210525979598366,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.06098309035102526,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.103270939240853,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.12099771698315938,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.06686098873615265,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.09466864416996638,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.08271150539318721,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.08541916062434514,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.09119760741790135,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.07296747962633769,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.0871938019990921,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.07398468255996704,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.08759981393814087,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.0952598328391711,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.09393963466087978,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.08483866353829701,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.0731203059355418,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.10094462831815083,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.10365524515509605,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.08838631957769394,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.09722505509853363,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.08547535911202431,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.08405679961045583,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.07167242467403412,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.0768436814347903,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.07196708520253499,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.08820913235346477,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.0788051150739193,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.06455437714854877,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.09632187336683273,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.07900507003068924,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.06604877983530362,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.06642560909191768,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.06110203887025515,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.07368517170349757,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.06963787476221721,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.07418970266977946,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.07465471078952153,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.05012140050530434,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.08470640952388446,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.07764603694279988,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.10045023759206136,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.06830650195479393,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.10130152106285095,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.09432353327671687,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.07678740844130516,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.05660296976566315,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.07303723072012265,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.0662978111455838,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.08749193946520488,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.08447639644145966,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.08299186577399571,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.07479867835839589,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.06670360825955868,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.08058402438958485,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.0985627348224322,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.06464883188406627,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.08468287189801534,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.07952441771825154,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.05993924538294474,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.09139345586299896,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.08324466769893964,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.06640361249446869,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.07659656926989555,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.09617436428864796,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.09845718741416931,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.09530209749937057,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.06435180827975273,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.08496388917167981,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.0811779039601485,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.09265278403957684,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.06975999474525452,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.08169451355934143,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.08491578946510951,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.07886459554235141,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.06975317001342773,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.07663325468699138,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.09791000932455063,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-993752',\n    max: 0.42341842254002887,\n    value: 0.3657372196515401,\n    avg: 0.3109148617833853,\n    timeseries: {\n      id: 'user',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.26554837822914124,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.3245313912630081,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.292506605386734,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.33190569778283435,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.3270445068677266,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.219671959678332,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.4092471996943156,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.42341842254002887,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.33125580847263336,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.2941380689541499,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.3351229429244995,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.38405293226242065,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.27865228056907654,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.2733519325653712,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.209918146332105,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.28147180875142414,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.3216685752073924,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.30877769986788434,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.3536653021971385,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.27556002140045166,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.28134016195933026,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.3073340505361557,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.308109109600385,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.3141087492307027,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.3253626674413681,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.31740400195121765,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.29565206666787464,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.3159216245015462,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.32625357309977215,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.3004571795463562,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.3162183811267217,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.28908344109853107,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.2806500792503357,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.2616770068804423,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.3122442563374837,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.3697422544161479,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.38436148564020794,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.28180519739786786,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.3253449946641922,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.23849976559480032,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.32709699869155884,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.28809836010138196,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.334033062060674,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.33405157923698425,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.2736254731814067,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.36191598574320477,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.3138476659854253,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.3658759693304698,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.31635376811027527,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.2981712222099304,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.22057300309340158,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.30108100672562915,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.25260060528914136,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.3323913911978404,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.2530389130115509,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.24724195897579193,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.3694608410199483,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.1464558889468511,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.3568643530209859,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.2906121661265691,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.29147279262542725,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.29598700006802875,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.3178882400194804,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.28718478977680206,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.3305741051832835,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.28062058985233307,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.2839128027359645,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.31596046686172485,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.3435437083244324,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.36869652569293976,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.2834072808424632,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.3127775589625041,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.2580890854199727,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.29344111680984497,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.3512902855873108,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.26867932081222534,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.30300448338190716,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.2824061264594396,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.27666042248408,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.3714834849039714,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.2873914490143458,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.32019497950871784,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.3025929580132167,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.33769770463307697,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.38783719142278034,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.27688901623090106,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.2831520438194275,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.30719699958960217,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.41629768411318463,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.34883591532707214,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.3437271366516749,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.3343379447857539,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.3483527700106303,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.31128636995951336,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.3416846493879954,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.32481649518013,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.3340492645899455,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.22142045696576437,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.31097331643104553,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.3083871304988861,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.2768298387527466,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.331269105275472,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.30281810959180194,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.39446720480918884,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.37544288237889606,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.33352212111155194,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.2855232059955597,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.35418395201365155,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.271432821949323,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.23321674267450967,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.3288340965906779,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.29713847239812213,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.3367747962474823,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.2738778442144394,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.4041471878687541,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.33507869640986127,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.3047125041484833,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.3355152557293574,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.22858975330988565,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.3657372196515401,\n        },\n      ],\n    },\n  },\n  {\n    name: 'host-1182831',\n    max: 0.10585460563500722,\n    value: 0.09143430491288503,\n    avg: 0.07772871544584632,\n    timeseries: {\n      id: 'system',\n      columns: [\n        {\n          name: 'timestamp',\n          type: 'date',\n        },\n        {\n          name: 'metric_0',\n          type: 'number',\n        },\n      ],\n      rows: [\n        {\n          timestamp: 1667332800000,\n          metric_0: 0.06638709455728531,\n        },\n        {\n          timestamp: 1667332830000,\n          metric_0: 0.08113284781575203,\n        },\n        {\n          timestamp: 1667332860000,\n          metric_0: 0.0731266513466835,\n        },\n        {\n          timestamp: 1667332890000,\n          metric_0: 0.08297642444570859,\n        },\n        {\n          timestamp: 1667332920000,\n          metric_0: 0.08176112671693166,\n        },\n        {\n          timestamp: 1667332950000,\n          metric_0: 0.054917989919583,\n        },\n        {\n          timestamp: 1667332980000,\n          metric_0: 0.1023117999235789,\n        },\n        {\n          timestamp: 1667333010000,\n          metric_0: 0.10585460563500722,\n        },\n        {\n          timestamp: 1667333040000,\n          metric_0: 0.08281395211815834,\n        },\n        {\n          timestamp: 1667333070000,\n          metric_0: 0.07353451723853748,\n        },\n        {\n          timestamp: 1667333100000,\n          metric_0: 0.08378073573112488,\n        },\n        {\n          timestamp: 1667333130000,\n          metric_0: 0.09601323306560516,\n        },\n        {\n          timestamp: 1667333160000,\n          metric_0: 0.06966307014226913,\n        },\n        {\n          timestamp: 1667333190000,\n          metric_0: 0.0683379831413428,\n        },\n        {\n          timestamp: 1667333220000,\n          metric_0: 0.05247953658302625,\n        },\n        {\n          timestamp: 1667333250000,\n          metric_0: 0.07036795218785603,\n        },\n        {\n          timestamp: 1667333280000,\n          metric_0: 0.0804171438018481,\n        },\n        {\n          timestamp: 1667333310000,\n          metric_0: 0.07719442496697108,\n        },\n        {\n          timestamp: 1667333340000,\n          metric_0: 0.08841632554928462,\n        },\n        {\n          timestamp: 1667333370000,\n          metric_0: 0.06889000535011292,\n        },\n        {\n          timestamp: 1667333400000,\n          metric_0: 0.07033504048983256,\n        },\n        {\n          timestamp: 1667333430000,\n          metric_0: 0.07683351263403893,\n        },\n        {\n          timestamp: 1667333460000,\n          metric_0: 0.07702727740009625,\n        },\n        {\n          timestamp: 1667333490000,\n          metric_0: 0.07852718730767567,\n        },\n        {\n          timestamp: 1667333520000,\n          metric_0: 0.08134066686034203,\n        },\n        {\n          timestamp: 1667333550000,\n          metric_0: 0.07935100048780441,\n        },\n        {\n          timestamp: 1667333580000,\n          metric_0: 0.07391301666696866,\n        },\n        {\n          timestamp: 1667333610000,\n          metric_0: 0.07898040612538655,\n        },\n        {\n          timestamp: 1667333640000,\n          metric_0: 0.08156339327494304,\n        },\n        {\n          timestamp: 1667333670000,\n          metric_0: 0.07511429488658905,\n        },\n        {\n          timestamp: 1667333700000,\n          metric_0: 0.07905459528168042,\n        },\n        {\n          timestamp: 1667333730000,\n          metric_0: 0.07227086027463277,\n        },\n        {\n          timestamp: 1667333760000,\n          metric_0: 0.07016251981258392,\n        },\n        {\n          timestamp: 1667333790000,\n          metric_0: 0.06541925172011058,\n        },\n        {\n          timestamp: 1667333820000,\n          metric_0: 0.07806106408437093,\n        },\n        {\n          timestamp: 1667333850000,\n          metric_0: 0.09243556360403697,\n        },\n        {\n          timestamp: 1667333880000,\n          metric_0: 0.09609037141005199,\n        },\n        {\n          timestamp: 1667333910000,\n          metric_0: 0.07045129934946696,\n        },\n        {\n          timestamp: 1667333940000,\n          metric_0: 0.08133624866604805,\n        },\n        {\n          timestamp: 1667333970000,\n          metric_0: 0.05962494139870008,\n        },\n        {\n          timestamp: 1667334000000,\n          metric_0: 0.08177424967288971,\n        },\n        {\n          timestamp: 1667334030000,\n          metric_0: 0.07202459002534549,\n        },\n        {\n          timestamp: 1667334060000,\n          metric_0: 0.0835082655151685,\n        },\n        {\n          timestamp: 1667334090000,\n          metric_0: 0.08351289480924606,\n        },\n        {\n          timestamp: 1667334120000,\n          metric_0: 0.06840636829535167,\n        },\n        {\n          timestamp: 1667334150000,\n          metric_0: 0.09047899643580119,\n        },\n        {\n          timestamp: 1667334180000,\n          metric_0: 0.07846191649635632,\n        },\n        {\n          timestamp: 1667334210000,\n          metric_0: 0.09146899233261745,\n        },\n        {\n          timestamp: 1667334240000,\n          metric_0: 0.07908844202756882,\n        },\n        {\n          timestamp: 1667334270000,\n          metric_0: 0.0745428055524826,\n        },\n        {\n          timestamp: 1667334300000,\n          metric_0: 0.055143250773350395,\n        },\n        {\n          timestamp: 1667334330000,\n          metric_0: 0.07527025168140729,\n        },\n        {\n          timestamp: 1667334360000,\n          metric_0: 0.06315015132228534,\n        },\n        {\n          timestamp: 1667334390000,\n          metric_0: 0.0830978477994601,\n        },\n        {\n          timestamp: 1667334420000,\n          metric_0: 0.06325972825288773,\n        },\n        {\n          timestamp: 1667334450000,\n          metric_0: 0.06181048974394798,\n        },\n        {\n          timestamp: 1667334480000,\n          metric_0: 0.09236521025498708,\n        },\n        {\n          timestamp: 1667334510000,\n          metric_0: 0.036613972236712776,\n        },\n        {\n          timestamp: 1667334540000,\n          metric_0: 0.08921608825524648,\n        },\n        {\n          timestamp: 1667334570000,\n          metric_0: 0.07265304153164227,\n        },\n        {\n          timestamp: 1667334600000,\n          metric_0: 0.07286819815635681,\n        },\n        {\n          timestamp: 1667334630000,\n          metric_0: 0.07399675001700719,\n        },\n        {\n          timestamp: 1667334660000,\n          metric_0: 0.0794720600048701,\n        },\n        {\n          timestamp: 1667334690000,\n          metric_0: 0.07179619744420052,\n        },\n        {\n          timestamp: 1667334720000,\n          metric_0: 0.08264352629582088,\n        },\n        {\n          timestamp: 1667334750000,\n          metric_0: 0.07015514746308327,\n        },\n        {\n          timestamp: 1667334780000,\n          metric_0: 0.07097820068399112,\n        },\n        {\n          timestamp: 1667334810000,\n          metric_0: 0.07899011671543121,\n        },\n        {\n          timestamp: 1667334840000,\n          metric_0: 0.0858859270811081,\n        },\n        {\n          timestamp: 1667334870000,\n          metric_0: 0.09217413142323494,\n        },\n        {\n          timestamp: 1667334900000,\n          metric_0: 0.0708518202106158,\n        },\n        {\n          timestamp: 1667334930000,\n          metric_0: 0.07819438974062602,\n        },\n        {\n          timestamp: 1667334960000,\n          metric_0: 0.06452227135499318,\n        },\n        {\n          timestamp: 1667334990000,\n          metric_0: 0.07336027920246124,\n        },\n        {\n          timestamp: 1667335020000,\n          metric_0: 0.0878225713968277,\n        },\n        {\n          timestamp: 1667335050000,\n          metric_0: 0.06716983020305634,\n        },\n        {\n          timestamp: 1667335080000,\n          metric_0: 0.07575112084547679,\n        },\n        {\n          timestamp: 1667335110000,\n          metric_0: 0.0706015316148599,\n        },\n        {\n          timestamp: 1667335140000,\n          metric_0: 0.06916510562102,\n        },\n        {\n          timestamp: 1667335170000,\n          metric_0: 0.09287087122599284,\n        },\n        {\n          timestamp: 1667335200000,\n          metric_0: 0.07184786225358646,\n        },\n        {\n          timestamp: 1667335230000,\n          metric_0: 0.08004874487717946,\n        },\n        {\n          timestamp: 1667335260000,\n          metric_0: 0.07564823950330417,\n        },\n        {\n          timestamp: 1667335290000,\n          metric_0: 0.08442442615826924,\n        },\n        {\n          timestamp: 1667335320000,\n          metric_0: 0.09695929785569508,\n        },\n        {\n          timestamp: 1667335350000,\n          metric_0: 0.06922225405772527,\n        },\n        {\n          timestamp: 1667335380000,\n          metric_0: 0.07078801095485687,\n        },\n        {\n          timestamp: 1667335410000,\n          metric_0: 0.07679924989740054,\n        },\n        {\n          timestamp: 1667335440000,\n          metric_0: 0.10407442102829616,\n        },\n        {\n          timestamp: 1667335470000,\n          metric_0: 0.08720897883176804,\n        },\n        {\n          timestamp: 1667335500000,\n          metric_0: 0.08593178416291873,\n        },\n        {\n          timestamp: 1667335530000,\n          metric_0: 0.08358448619643848,\n        },\n        {\n          timestamp: 1667335560000,\n          metric_0: 0.08708819250265758,\n        },\n        {\n          timestamp: 1667335590000,\n          metric_0: 0.07782159248987834,\n        },\n        {\n          timestamp: 1667335620000,\n          metric_0: 0.08542116234699886,\n        },\n        {\n          timestamp: 1667335650000,\n          metric_0: 0.0812041237950325,\n        },\n        {\n          timestamp: 1667335680000,\n          metric_0: 0.08351231614748637,\n        },\n        {\n          timestamp: 1667335710000,\n          metric_0: 0.05535511424144109,\n        },\n        {\n          timestamp: 1667335740000,\n          metric_0: 0.07774332910776138,\n        },\n        {\n          timestamp: 1667335770000,\n          metric_0: 0.07709678262472153,\n        },\n        {\n          timestamp: 1667335800000,\n          metric_0: 0.06920745968818665,\n        },\n        {\n          timestamp: 1667335830000,\n          metric_0: 0.082817276318868,\n        },\n        {\n          timestamp: 1667335860000,\n          metric_0: 0.07570452739795049,\n        },\n        {\n          timestamp: 1667335890000,\n          metric_0: 0.09861680120229721,\n        },\n        {\n          timestamp: 1667335920000,\n          metric_0: 0.09386072059472401,\n        },\n        {\n          timestamp: 1667335950000,\n          metric_0: 0.08338053027788798,\n        },\n        {\n          timestamp: 1667335980000,\n          metric_0: 0.07138080149888992,\n        },\n        {\n          timestamp: 1667336010000,\n          metric_0: 0.08854598800341289,\n        },\n        {\n          timestamp: 1667336040000,\n          metric_0: 0.06785820548733075,\n        },\n        {\n          timestamp: 1667336070000,\n          metric_0: 0.05830418566862742,\n        },\n        {\n          timestamp: 1667336100000,\n          metric_0: 0.08220852414766948,\n        },\n        {\n          timestamp: 1667336130000,\n          metric_0: 0.07428461809953053,\n        },\n        {\n          timestamp: 1667336160000,\n          metric_0: 0.08419369906187057,\n        },\n        {\n          timestamp: 1667336190000,\n          metric_0: 0.06846946105360985,\n        },\n        {\n          timestamp: 1667336220000,\n          metric_0: 0.10103679696718852,\n        },\n        {\n          timestamp: 1667336250000,\n          metric_0: 0.08376967410246532,\n        },\n        {\n          timestamp: 1667336280000,\n          metric_0: 0.07617812603712082,\n        },\n        {\n          timestamp: 1667336310000,\n          metric_0: 0.08387881393233936,\n        },\n        {\n          timestamp: 1667336340000,\n          metric_0: 0.05714743832747141,\n        },\n        {\n          timestamp: 1667336370000,\n          metric_0: 0.09143430491288503,\n        },\n      ],\n    },\n  },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { TooltipInfo, XYChartSeriesIdentifier } from '@elastic/charts';\n\nexport const tableSimple: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: null,\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 19,\n      formattedValue: '19.00',\n      markValue: 49,\n      formattedMarkValue: '49',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: {\n        x: 60,\n        y: 19,\n        z: 49,\n        g: 'c',\n      },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 23,\n      formattedValue: '23.00',\n      markValue: 83,\n      formattedMarkValue: '83',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: {\n        x: 67,\n        y: 23,\n        z: 83,\n        g: 'c',\n      },\n    },\n  ],\n};\n\nexport const tableMultipleX: TooltipInfo<any, XYChartSeriesIdentifier> = {\n  header: null,\n  values: [\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-a}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['a', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'a',\n      value: 62,\n      formattedValue: '62.00',\n      markValue: 63,\n      formattedMarkValue: '63',\n      color: '#54B399',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 17, y: 62, z: 63, g: 'a' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-b}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['b', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'b',\n      value: 70,\n      formattedValue: '70.00',\n      markValue: 67,\n      formattedMarkValue: '67',\n      color: '#6092C0',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 16, y: 70, z: 67, g: 'b' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 71,\n      formattedValue: '71.00',\n      markValue: 87,\n      formattedMarkValue: '87',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: { x: 14, y: 71, z: 87, g: 'c' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 65,\n      formattedValue: '65.00',\n      markValue: 50,\n      formattedMarkValue: '50',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: { x: 13, y: 65, z: 50, g: 'c' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-c}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['c', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'c',\n      value: 68,\n      formattedValue: '68.00',\n      markValue: 84,\n      formattedMarkValue: '84',\n      color: '#D36086',\n      isHighlighted: true,\n      isVisible: true,\n      datum: { x: 19, y: 68, z: 84, g: 'c' },\n    },\n    {\n      seriesIdentifier: {\n        key: 'groupId{__global__}spec{bubbles}yAccessor{y}splitAccessors{g-d}',\n        specId: 'bubbles',\n        xAccessor: 'x',\n        yAccessor: 'y',\n        splitAccessors: new Map(),\n        seriesKeys: ['d', 'y'],\n      },\n      valueAccessor: 'y1',\n      label: 'd',\n      value: 68,\n      formattedValue: '68.00',\n      markValue: 86,\n      formattedMarkValue: '86',\n      color: '#9170B8',\n      isHighlighted: false,\n      isVisible: true,\n      datum: { x: 16, y: 68, z: 86, g: 'd' },\n    },\n  ],\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport { Example as ComposedList } from './1_composed_list.story';\nexport { Example as ComposedTable } from './2_composed_table.story';\nexport { Example as TabularData } from './3_tabular_data.story';\nexport { Example as ActionsWithCustomTooltip } from './4_actions_with_custom_tooltip.story';\nexport { Example as DefaultChartsTooltip } from './5_chart_tooltip.story';\nexport { Example as AsyncActions } from './6_async_actions.story';\n\nexport { Example as CartesianCharts } from './10_cartesian_chart.story';\nexport { Example as PartitionCharts } from './11_partition_chart.story';\nexport { Example as HeatmapChart } from './12_heatmap.story';\nexport { Example as Flamegraph } from './13_flamegraph.story';\n\nexport default {\n  title: 'Components/Tooltip',\n};\n","var api = require(\"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n            var content = require(\"!!../../../../node_modules/css-loader/dist/cjs.js??ref--17-1!../../../../node_modules/postcss-loader/dist/cjs.js??ref--17-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--17-3!./tooltip_showcase.scss\");\n\n            content = content.__esModule ? content.default : content;\n\n            if (typeof content === 'string') {\n              content = [[module.id, content, '']];\n            }\n\nvar options = {\"attributes\":{\"nonce\":\"Pk1rZ1XDlMuYe8ubWV3Lh0BzwrTigJQ=\"}};\n\noptions.insert = \"head\";\noptions.singleton = false;\n\nvar update = api(content, options);\n\n\n\nmodule.exports = content.locals || {};","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color } from '@storybook/addon-knobs';\nimport React, { memo, useEffect, useRef, useState } from 'react';\n\nimport {\n  BaseDatum,\n  Datum,\n  SeriesIdentifier,\n  TooltipProps,\n  LIGHT_THEME,\n  DEFAULT_TOOLTIP_SPEC,\n  TooltipSpec,\n  TooltipValue,\n} from '@elastic/charts';\nimport { TooltipComponent, TooltipComponentProps } from '@elastic/charts/src/components/tooltip/tooltip';\n\nimport { customKnobs } from '../../utils/knobs';\n\nimport './tooltip_showcase.scss';\n\ntype BaseTooltipProps<\n  D extends BaseDatum = Datum,\n  SI extends SeriesIdentifier = SeriesIdentifier,\n> = TooltipComponentProps<D, SI>;\n\ntype TooltipShowcaseProps<D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier> = Partial<\n  Omit<TooltipComponentProps<D, SI>, 'settings' | 'visible' | 'tooltip'>\n> & { tooltip?: Partial<TooltipComponentProps<D, SI>['tooltip']> } & Partial<TooltipProps<D, SI>>;\n\nconst TooltipShowcaseInner = <D extends BaseDatum = Datum, SI extends SeriesIdentifier = SeriesIdentifier>(\n  props: TooltipShowcaseProps<D, SI>,\n) => {\n  const [, setVisible] = useState(false);\n  const [selected, setSelected] = useState<TooltipValue<D, SI>[]>([]);\n  const divRef = useRef<HTMLDivElement | null>(null);\n  const anchorRef = useRef<HTMLDivElement | null>(null);\n\n  // Required to initially rerender tooltip\n  useEffect(() => {\n    setVisible(true);\n    return () => setVisible(false);\n  }, []);\n\n  const tooltipProps: BaseTooltipProps<D, SI> = {\n    zIndex: 200,\n    info: props.info,\n    settings: {\n      ...props,\n      placement: customKnobs.enum.placement(),\n      boundary: divRef.current ?? undefined,\n    },\n    rotation: 0,\n    visible: boolean('visible', true),\n    backgroundColor: color('backgroundColor', '#E8F9FD'),\n    getChartContainerRef: () => divRef,\n    // @ts-ignore - overriding mouse logic\n    onPointerMove: () => {},\n    toggleSelectedTooltipItem: (rawitem) => {\n      const item = rawitem as TooltipValue<D, SI>;\n      const index = selected.indexOf(item);\n      setSelected((prev) => {\n        if (index === -1) return [...prev, item];\n        return prev.filter((i) => i !== item);\n      });\n    },\n    setSelectedTooltipItems: (items) => {\n      setSelected(items as TooltipValue<D, SI>[]);\n    },\n    pinTooltip() {\n      setSelected([]);\n    },\n    canPinTooltip: false,\n    pinned: false,\n    selected,\n    maxTooltipItems: 5,\n    tooltipTheme: LIGHT_THEME.tooltip,\n    ...props,\n    tooltip: {\n      ...(DEFAULT_TOOLTIP_SPEC as unknown as TooltipSpec<D, SI>),\n      ...props.tooltip,\n    },\n  };\n\n  return (\n    <div ref={divRef} style={{ backgroundColor: tooltipProps.backgroundColor }} className=\"showcase\">\n      <div className=\"tooltip-wrapper\">\n        <div id=\"tooltip-anchor\" ref={anchorRef}>\n          Tooltip Anchor\n        </div>\n        <TooltipComponent {...tooltipProps} anchorRef={anchorRef} />\n      </div>\n    </div>\n  );\n};\n\n/**\n * This component is used to render the internal `TooltipComponent` as a standalone element.\n *\n * - No connection to redux\n * - Everything is overridable\n * - Limited defaults, logic must be manually implemented above or when used\n */\nexport const TooltipShowcase = memo(TooltipShowcaseInner) as typeof TooltipShowcaseInner;\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React, { CSSProperties, useState } from 'react';\\n\\nimport { Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { BarSeries } from '../../../packages/charts/src/chart_types/specs';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\ninterface Dimensions {\\n  height: number;\\n  left: number;\\n  top: number;\\n  width: number;\\n}\\n\\nconst Measurement = (props: { text: string; horizontal: boolean; dims: CSSProperties }) => {\\n  return (\\n    <div style={{ position: 'absolute', ...props.dims, zIndex: 2000 }}>\\n      <div\\n        style={{\\n          position: 'relative',\\n          ...(props.horizontal ? { width: '100%', height: 10 } : { width: 10, height: '100%' }),\\n        }}\\n      >\\n        <div\\n          style={{\\n            position: 'absolute',\\n            ...(props.horizontal\\n              ? { width: '100%', height: 10, borderLeft: '1px solid black', borderRight: '1px solid black' }\\n              : {\\n                  width: 10,\\n                  height: '100%',\\n                  borderTop: '1px solid black',\\n                  borderBottom: '1px solid black',\\n                }),\\n          }}\\n        />\\n        <div\\n          style={{\\n            position: 'absolute',\\n            ...(props.horizontal\\n              ? { top: '50%', width: '100%', height: 20, borderTop: '1px solid black' }\\n              : { left: '50%', width: 20, height: '100%', borderLeft: '1px solid black' }),\\n          }}\\n        />\\n        <div\\n          style={{\\n            position: 'absolute',\\n\\n            color: 'black',\\n            fontSize: 10,\\n            width: '100%',\\n            textAlign: 'center',\\n            verticalAlign: 'middle',\\n            ...(props.horizontal\\n              ? {\\n                  top: 8,\\n                }\\n              : {\\n                  height: '100%',\\n                  left: 10,\\n                  writingMode: 'vertical-lr',\\n                }),\\n          }}\\n        >\\n          {props.text}\\n        </div>\\n      </div>\\n    </div>\\n  );\\n};\\n\\nconst HTML_CHART_PADDING = 20;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const legendEnabled = boolean('show legend', true);\\n  const axisYEnabled = boolean('show y axis', true);\\n  const axisXEnabled = boolean('show x axis', true);\\n\\n  const padding = number('chart paddings', 50, { min: 0, max: 100, range: true, step: 1 });\\n\\n  const [dimensions, setDimensions] = useState<{ projection: Dimensions; parent: Dimensions } | null>(null);\\n  const onAreaChangeAction = action('onProjectionAreaChange');\\n  const onAreaChangeHandler = (areas: { projection: Dimensions; parent: Dimensions }) => {\\n    onAreaChangeAction(areas);\\n    setDimensions(areas);\\n  };\\n\\n  return (\\n    <>\\n      {dimensions && (\\n        <>\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING,\\n              left: HTML_CHART_PADDING + dimensions.projection.left,\\n              width: dimensions.projection.width,\\n              height: 20,\\n            }}\\n            horizontal={true}\\n            text={`projection left: ${dimensions.projection.left} width: ${dimensions.projection.width}`}\\n          />\\n\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING + dimensions.projection.top,\\n              left: HTML_CHART_PADDING + 20 + dimensions.projection.left + dimensions.projection.width,\\n              width: 20,\\n              height: dimensions.projection.height,\\n            }}\\n            horizontal={false}\\n            text={`projection top: ${dimensions.projection.top} height: ${dimensions.projection.height}`}\\n          />\\n        </>\\n      )}\\n\\n      {dimensions && (\\n        <>\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING,\\n              left: HTML_CHART_PADDING + 10,\\n              width: 20,\\n              height: dimensions.parent.height,\\n            }}\\n            horizontal={false}\\n            text={`parent height: ${dimensions.parent.height}`}\\n          />\\n\\n          <Measurement\\n            dims={{\\n              bottom: 20,\\n              left: HTML_CHART_PADDING,\\n              width: dimensions.parent.width,\\n              height: HTML_CHART_PADDING,\\n            }}\\n            horizontal={true}\\n            text={`parent width: ${dimensions.parent.width}`}\\n          />\\n        </>\\n      )}\\n      <Chart title={title} description={description}>\\n        <Settings\\n          showLegend={legendEnabled}\\n          baseTheme={useBaseTheme()}\\n          theme={[\\n            {\\n              background: {\\n                color: 'transparent',\\n              },\\n              chartMargins: {\\n                top: padding,\\n                bottom: padding,\\n                left: padding,\\n                right: padding,\\n              },\\n            },\\n          ]}\\n          onProjectionAreaChange={onAreaChangeHandler}\\n        />\\n        {axisXEnabled && (\\n          <Axis\\n            id=\\\"bottom\\\"\\n            position={Position.Bottom}\\n            style={{ tickLine: { visible: false }, tickLabel: { padding: 5 } }}\\n          />\\n        )}\\n        {axisYEnabled && <Axis id=\\\"quantity\\\" position={Position.Left} ticks={5} />}\\n        <BarSeries\\n          id=\\\"data\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={[\\n            ['apples', 10],\\n            ['oranges', 3],\\n            ['bananas', 5],\\n          ]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":85},\"endLoc\":{\"col\":1,\"line\":194},\"startBody\":{\"col\":36,\"line\":85},\"endBody\":{\"col\":1,\"line\":194}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React, { CSSProperties, useState } from 'react';\n\nimport { Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { BarSeries } from '../../../packages/charts/src/chart_types/specs';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\ninterface Dimensions {\n  height: number;\n  left: number;\n  top: number;\n  width: number;\n}\n\nconst Measurement = (props: { text: string; horizontal: boolean; dims: CSSProperties }) => {\n  return (\n    <div style={{ position: 'absolute', ...props.dims, zIndex: 2000 }}>\n      <div\n        style={{\n          position: 'relative',\n          ...(props.horizontal ? { width: '100%', height: 10 } : { width: 10, height: '100%' }),\n        }}\n      >\n        <div\n          style={{\n            position: 'absolute',\n            ...(props.horizontal\n              ? { width: '100%', height: 10, borderLeft: '1px solid black', borderRight: '1px solid black' }\n              : {\n                  width: 10,\n                  height: '100%',\n                  borderTop: '1px solid black',\n                  borderBottom: '1px solid black',\n                }),\n          }}\n        />\n        <div\n          style={{\n            position: 'absolute',\n            ...(props.horizontal\n              ? { top: '50%', width: '100%', height: 20, borderTop: '1px solid black' }\n              : { left: '50%', width: 20, height: '100%', borderLeft: '1px solid black' }),\n          }}\n        />\n        <div\n          style={{\n            position: 'absolute',\n\n            color: 'black',\n            fontSize: 10,\n            width: '100%',\n            textAlign: 'center',\n            verticalAlign: 'middle',\n            ...(props.horizontal\n              ? {\n                  top: 8,\n                }\n              : {\n                  height: '100%',\n                  left: 10,\n                  writingMode: 'vertical-lr',\n                }),\n          }}\n        >\n          {props.text}\n        </div>\n      </div>\n    </div>\n  );\n};\n\nconst HTML_CHART_PADDING = 20;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const legendEnabled = boolean('show legend', true);\n  const axisYEnabled = boolean('show y axis', true);\n  const axisXEnabled = boolean('show x axis', true);\n\n  const padding = number('chart paddings', 50, { min: 0, max: 100, range: true, step: 1 });\n\n  const [dimensions, setDimensions] = useState<{ projection: Dimensions; parent: Dimensions } | null>(null);\n  const onAreaChangeAction = action('onProjectionAreaChange');\n  const onAreaChangeHandler = (areas: { projection: Dimensions; parent: Dimensions }) => {\n    onAreaChangeAction(areas);\n    setDimensions(areas);\n  };\n\n  return (\n    <>\n      {dimensions && (\n        <>\n          <Measurement\n            dims={{\n              top: HTML_CHART_PADDING,\n              left: HTML_CHART_PADDING + dimensions.projection.left,\n              width: dimensions.projection.width,\n              height: 20,\n            }}\n            horizontal={true}\n            text={`projection left: ${dimensions.projection.left} width: ${dimensions.projection.width}`}\n          />\n\n          <Measurement\n            dims={{\n              top: HTML_CHART_PADDING + dimensions.projection.top,\n              left: HTML_CHART_PADDING + 20 + dimensions.projection.left + dimensions.projection.width,\n              width: 20,\n              height: dimensions.projection.height,\n            }}\n            horizontal={false}\n            text={`projection top: ${dimensions.projection.top} height: ${dimensions.projection.height}`}\n          />\n        </>\n      )}\n\n      {dimensions && (\n        <>\n          <Measurement\n            dims={{\n              top: HTML_CHART_PADDING,\n              left: HTML_CHART_PADDING + 10,\n              width: 20,\n              height: dimensions.parent.height,\n            }}\n            horizontal={false}\n            text={`parent height: ${dimensions.parent.height}`}\n          />\n\n          <Measurement\n            dims={{\n              bottom: 20,\n              left: HTML_CHART_PADDING,\n              width: dimensions.parent.width,\n              height: HTML_CHART_PADDING,\n            }}\n            horizontal={true}\n            text={`parent width: ${dimensions.parent.width}`}\n          />\n        </>\n      )}\n      <Chart title={title} description={description}>\n        <Settings\n          showLegend={legendEnabled}\n          baseTheme={useBaseTheme()}\n          theme={[\n            {\n              background: {\n                color: 'transparent',\n              },\n              chartMargins: {\n                top: padding,\n                bottom: padding,\n                left: padding,\n                right: padding,\n              },\n            },\n          ]}\n          onProjectionAreaChange={onAreaChangeHandler}\n        />\n        {axisXEnabled && (\n          <Axis\n            id=\"bottom\"\n            position={Position.Bottom}\n            style={{ tickLine: { visible: false }, tickLabel: { padding: 5 } }}\n          />\n        )}\n        {axisYEnabled && <Axis id=\"quantity\" position={Position.Left} ticks={5} />}\n        <BarSeries\n          id=\"data\"\n          xScaleType={ScaleType.Ordinal}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={[\n            ['apples', 10],\n            ['oranges', 3],\n            ['bananas', 5],\n          ]}\n        />\n      </Chart>\n    </>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const legendEnabled = boolean('show legend', true);\\n  const axisYEnabled = boolean('show y axis', true);\\n  const axisXEnabled = boolean('show x axis', true);\\n\\n  const padding = number('chart paddings', 50, { min: 0, max: 100, range: true, step: 1 });\\n\\n  const [dimensions, setDimensions] = useState<{ projection: Dimensions; parent: Dimensions } | null>(null);\\n  const onAreaChangeAction = action('onProjectionAreaChange');\\n  const onAreaChangeHandler = (areas: { projection: Dimensions; parent: Dimensions }) => {\\n    onAreaChangeAction(areas);\\n    setDimensions(areas);\\n  };\\n\\n  return (\\n    <>\\n      {dimensions && (\\n        <>\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING,\\n              left: HTML_CHART_PADDING + dimensions.projection.left,\\n              width: dimensions.projection.width,\\n              height: 20,\\n            }}\\n            horizontal={true}\\n            text={`projection left: ${dimensions.projection.left} width: ${dimensions.projection.width}`}\\n          />\\n\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING + dimensions.projection.top,\\n              left: HTML_CHART_PADDING + 20 + dimensions.projection.left + dimensions.projection.width,\\n              width: 20,\\n              height: dimensions.projection.height,\\n            }}\\n            horizontal={false}\\n            text={`projection top: ${dimensions.projection.top} height: ${dimensions.projection.height}`}\\n          />\\n        </>\\n      )}\\n\\n      {dimensions && (\\n        <>\\n          <Measurement\\n            dims={{\\n              top: HTML_CHART_PADDING,\\n              left: HTML_CHART_PADDING + 10,\\n              width: 20,\\n              height: dimensions.parent.height,\\n            }}\\n            horizontal={false}\\n            text={`parent height: ${dimensions.parent.height}`}\\n          />\\n\\n          <Measurement\\n            dims={{\\n              bottom: 20,\\n              left: HTML_CHART_PADDING,\\n              width: dimensions.parent.width,\\n              height: HTML_CHART_PADDING,\\n            }}\\n            horizontal={true}\\n            text={`parent width: ${dimensions.parent.width}`}\\n          />\\n        </>\\n      )}\\n      <Chart title={title} description={description}>\\n        <Settings\\n          showLegend={legendEnabled}\\n          baseTheme={useBaseTheme()}\\n          theme={[\\n            {\\n              background: {\\n                color: 'transparent',\\n              },\\n              chartMargins: {\\n                top: padding,\\n                bottom: padding,\\n                left: padding,\\n                right: padding,\\n              },\\n            },\\n          ]}\\n          onProjectionAreaChange={onAreaChangeHandler}\\n        />\\n        {axisXEnabled && (\\n          <Axis\\n            id=\\\"bottom\\\"\\n            position={Position.Bottom}\\n            style={{ tickLine: { visible: false }, tickLabel: { padding: 5 } }}\\n          />\\n        )}\\n        {axisYEnabled && <Axis id=\\\"quantity\\\" position={Position.Left} ticks={5} />}\\n        <BarSeries\\n          id=\\\"data\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={[\\n            ['apples', 10],\\n            ['oranges', 3],\\n            ['bananas', 5],\\n          ]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Composable',\n};\n\nexport { Example as basic } from './1_basic.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, ScaleType, Settings, Position, Axis, BarSeries, AreaSeries, CurveType } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={[\\n          { x: 0, y: 2.5 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, ScaleType, Settings, Position, Axis, BarSeries, AreaSeries, CurveType } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', true);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={debug} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={[\n          { x: 0, y: 2.5 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={debug} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={[\\n          { x: 0, y: 2.5 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  LineSeries,\\n  ScaleType,\\n  CurveType,\\n  AreaSeries,\\n  BarSeries,\\n  Settings,\\n  Axis,\\n  Position,\\n  SeriesNameFn,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('debugState', true);\\n  const line = boolean('show line', true);\\n  const area = boolean('show area', true);\\n  const bar = boolean('show bar', true);\\n  const groupCount = number('number of groups', 1, { min: 1 });\\n  const splitSeriesAccessors = groupCount > 1 ? ['g'] : undefined;\\n  const naming: SeriesNameFn | undefined =\\n    groupCount === 1 ? undefined : ({ specId, seriesKeys }) => `${specId} | ${seriesKeys[0]}`;\\n\\n  const dg = new SeededDataGenerator();\\n  const lineData = dg.generateGroupedSeries(40, groupCount);\\n  const areaData = dg.generateGroupedSeries(40, groupCount);\\n  const barData = dg.generateGroupedSeries(40, groupCount);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debug={debug}\\n        debugState={debugState}\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      {line && (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          data={lineData}\\n        />\\n      )}\\n      {area && (\\n        <AreaSeries\\n          id=\\\"areas\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          data={areaData}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          curve={CurveType.CURVE_MONOTONE_X}\\n        />\\n      )}\\n\\n      {bar && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          data={barData}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":99},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":99}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  LineSeries,\n  ScaleType,\n  CurveType,\n  AreaSeries,\n  BarSeries,\n  Settings,\n  Axis,\n  Position,\n  SeriesNameFn,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('debug', false);\n  const debugState = boolean('debugState', true);\n  const line = boolean('show line', true);\n  const area = boolean('show area', true);\n  const bar = boolean('show bar', true);\n  const groupCount = number('number of groups', 1, { min: 1 });\n  const splitSeriesAccessors = groupCount > 1 ? ['g'] : undefined;\n  const naming: SeriesNameFn | undefined =\n    groupCount === 1 ? undefined : ({ specId, seriesKeys }) => `${specId} | ${seriesKeys[0]}`;\n\n  const dg = new SeededDataGenerator();\n  const lineData = dg.generateGroupedSeries(40, groupCount);\n  const areaData = dg.generateGroupedSeries(40, groupCount);\n  const barData = dg.generateGroupedSeries(40, groupCount);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onRenderChange={getDebugStateLogger(debugState)}\n        debug={debug}\n        debugState={debugState}\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      {line && (\n        <LineSeries\n          id=\"lines\"\n          name={naming}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          splitSeriesAccessors={splitSeriesAccessors}\n          data={lineData}\n        />\n      )}\n      {area && (\n        <AreaSeries\n          id=\"areas\"\n          name={naming}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          data={areaData}\n          splitSeriesAccessors={splitSeriesAccessors}\n          curve={CurveType.CURVE_MONOTONE_X}\n        />\n      )}\n\n      {bar && (\n        <BarSeries\n          id=\"bars\"\n          name={naming}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          splitSeriesAccessors={splitSeriesAccessors}\n          data={barData}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('debug', false);\\n  const debugState = boolean('debugState', true);\\n  const line = boolean('show line', true);\\n  const area = boolean('show area', true);\\n  const bar = boolean('show bar', true);\\n  const groupCount = number('number of groups', 1, { min: 1 });\\n  const splitSeriesAccessors = groupCount > 1 ? ['g'] : undefined;\\n  const naming: SeriesNameFn | undefined =\\n    groupCount === 1 ? undefined : ({ specId, seriesKeys }) => `${specId} | ${seriesKeys[0]}`;\\n\\n  const dg = new SeededDataGenerator();\\n  const lineData = dg.generateGroupedSeries(40, groupCount);\\n  const areaData = dg.generateGroupedSeries(40, groupCount);\\n  const barData = dg.generateGroupedSeries(40, groupCount);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        debug={debug}\\n        debugState={debugState}\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      {line && (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          data={lineData}\\n        />\\n      )}\\n      {area && (\\n        <AreaSeries\\n          id=\\\"areas\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          data={areaData}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          curve={CurveType.CURVE_MONOTONE_X}\\n        />\\n      )}\\n\\n      {bar && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          name={naming}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          splitSeriesAccessors={splitSeriesAccessors}\\n          data={barData}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Debug Options',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as debugState } from './2_debug_state.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  225: 'gray',\\n  300: 'rgb(232,232,232)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={0}\\n      actual={0}\\n      bands={[225, 300]}\\n      domain={{ min: 0, max: 300 }}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  225: 'gray',\n  300: 'rgb(232,232,232)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={0}\n      actual={0}\n      bands={[225, 300]}\n      domain={{ min: 0, max: 300 }}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"225\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={0}\\n      actual={0}\\n      bands={[225, 300]}\\n      domain={{ min: 0, max: 300 }}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  199: 'rgba(255,0,0,0.5)',\\n  201: 'white',\\n  249: 'lightgrey',\\n  251: 'white',\\n  300: 'rgba(0,255,0,0.5)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showTarget = boolean('show target', true);\\n  const target = number('target', 260);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={0}\\n        target={showTarget ? target : undefined}\\n        actual={280}\\n        domain={{ min: 0, max: 300 }}\\n        bands={[199, 201, 249, 251, 300]}\\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor=\\\"280\\\"\\n        centralMinor={showTarget ? `target: ${target}` : undefined}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":55},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":55}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  199: 'rgba(255,0,0,0.5)',\n  201: 'white',\n  249: 'lightgrey',\n  251: 'white',\n  300: 'rgba(0,255,0,0.5)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showTarget = boolean('show target', true);\n  const target = number('target', 260);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={0}\n        target={showTarget ? target : undefined}\n        actual={280}\n        domain={{ min: 0, max: 300 }}\n        bands={[199, 201, 249, 251, 300]}\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={getBandFillColor}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor=\"280\"\n        centralMinor={showTarget ? `target: ${target}` : undefined}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showTarget = boolean('show target', true);\\n  const target = number('target', 260);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={0}\\n        target={showTarget ? target : undefined}\\n        actual={280}\\n        domain={{ min: 0, max: 300 }}\\n        bands={[199, 201, 249, 251, 300]}\\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor=\\\"280\\\"\\n        centralMinor={showTarget ? `target: ${target}` : undefined}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  215: 'rgb(232,232,232)',\\n  235: 'gray',\\n  300: 'rgb(232,232,232)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={0}\\n      actual={0}\\n      bands={[215, 235, 300]}\\n      domain={{ min: 0, max: 300 }}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  215: 'rgb(232,232,232)',\n  235: 'gray',\n  300: 'rgb(232,232,232)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={0}\n      actual={0}\n      bands={[215, 235, 300]}\n      domain={{ min: 0, max: 300 }}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"225\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={0}\\n      actual={0}\\n      bands={[215, 235, 300]}\\n      domain={{ min: 0, max: 300 }}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  210: 'rgb(232,232,232)',\\n  218: '#66c2a4',\\n  224: '#2ca25f',\\n  229: '#006d2c',\\n  235: '#2ca25f',\\n  243: '#66c2a4',\\n  300: 'rgb(232,232,232)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={226.5}\\n      actual={0}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[210, 218, 224, 229, 235, 243, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"226.5\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  210: 'rgb(232,232,232)',\n  218: '#66c2a4',\n  224: '#2ca25f',\n  229: '#006d2c',\n  235: '#2ca25f',\n  243: '#66c2a4',\n  300: 'rgb(232,232,232)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={226.5}\n      actual={0}\n      domain={{ min: 0, max: 300 }}\n      bands={[210, 218, 224, 229, 235, 243, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"226.5\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={226.5}\\n      actual={0}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[210, 218, 224, 229, 235, 243, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"226.5\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI - (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI - (Math.PI - (2 * Math.PI) / 3) / 2}\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI - (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI}\\n      angleEnd={0}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI}\n      angleEnd={0}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI}\\n      angleEnd={0}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = number('startAngle (π)', 1.5, { min: -2, max: 2, step: 1 / 8 });\\n  const end = number('endAngle (π)', -0.5, { min: -2, max: 2, step: 1 / 8 });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={GoalSubtype.Goal}\\n        base={0}\\n        target={260}\\n        actual={280}\\n        domain={{ min: 0, max: 300 }}\\n        bands={[200, 250, 300]}\\n        ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\\n        tickValueFormatter={({ value }) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"\\\"\\n        labelMinor=\\\"\\\"\\n        centralMajor=\\\"280 MB/s\\\"\\n        centralMinor=\\\"\\\"\\n        angleStart={start * Math.PI}\\n        angleEnd={end * Math.PI}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":25},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":25},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = number('startAngle (π)', 1.5, { min: -2, max: 2, step: 1 / 8 });\n  const end = number('endAngle (π)', -0.5, { min: -2, max: 2, step: 1 / 8 });\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec_1\"\n        subtype={GoalSubtype.Goal}\n        base={0}\n        target={260}\n        actual={280}\n        domain={{ min: 0, max: 300 }}\n        bands={[200, 250, 300]}\n        ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\n        tickValueFormatter={({ value }) => String(value)}\n        bandFillColor={getBandFillColor}\n        labelMajor=\"\"\n        labelMinor=\"\"\n        centralMajor=\"280 MB/s\"\n        centralMinor=\"\"\n        angleStart={start * Math.PI}\n        angleEnd={end * Math.PI}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = number('startAngle (π)', 1.5, { min: -2, max: 2, step: 1 / 8 });\\n  const end = number('endAngle (π)', -0.5, { min: -2, max: 2, step: 1 / 8 });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={GoalSubtype.Goal}\\n        base={0}\\n        target={260}\\n        actual={280}\\n        domain={{ min: 0, max: 300 }}\\n        bands={[200, 250, 300]}\\n        ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\\n        tickValueFormatter={({ value }) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"\\\"\\n        labelMinor=\\\"\\\"\\n        centralMajor=\\\"280 MB/s\\\"\\n        centralMinor=\\\"\\\"\\n        angleStart={start * Math.PI}\\n        angleEnd={end * Math.PI}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + Math.PI / 2 - Math.PI / 90}\\n      angleEnd={-Math.PI / 2 + Math.PI / 90}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI + Math.PI / 2 - Math.PI / 90}\n      angleEnd={-Math.PI / 2 + Math.PI / 90}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 265, 280]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + Math.PI / 2 - Math.PI / 90}\\n      angleEnd={-Math.PI / 2 + Math.PI / 90}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, BandFillColorAccessorInput, Settings } from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, BandFillColorAccessorInput, Settings } from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={-(Math.PI - (2 * Math.PI) / 3) / 2}\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, BandFillColorAccessorInput, Settings } from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: '#fc8d62',\\n  250: 'lightgrey',\\n  300: '#66c2a5',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleStart={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, BandFillColorAccessorInput, Settings } from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: '#fc8d62',\n  250: 'lightgrey',\n  300: '#66c2a5',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\n      angleStart={(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleStart={(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-200': `rgb(${q1},${q1},${q1})`,\\n  '-250': `rgb(${q2},${q2},${q2})`,\\n  '-300': `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-200': `rgb(${q1},${q1},${q1})`,\n  '-250': `rgb(${q2},${q2},${q2})`,\n  '-300': `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={-260}\n      actual={-280}\n      domain={{ min: -300, max: 0 }}\n      bands={[-200, -250, -300]}\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-280\"\n      centralMinor=\"target: -260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.VerticalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-200': `rgb(${q1},${q1},${q1})`,\\n  '-250': `rgb(${q2},${q2},${q2})`,\\n  '-300': `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.VerticalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-200': `rgb(${q1},${q1},${q1})`,\n  '-250': `rgb(${q2},${q2},${q2})`,\n  '-300': `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={-260}\n      actual={-280}\n      domain={{ min: -300, max: 0 }}\n      bands={[-200, -250, -300]}\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-280\"\n      centralMinor=\"target: -260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-200': `rgb(${q1},${q1},${q1})`,\\n  '-250': `rgb(${q2},${q2},${q2})`,\\n  '-300': `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-200': `rgb(${q1},${q1},${q1})`,\n  '-250': `rgb(${q2},${q2},${q2})`,\n  '-300': `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={-260}\n      actual={-280}\n      domain={{ min: -300, max: 0 }}\n      bands={[-200, -250, -300]}\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-280\"\n      centralMinor=\"target: -260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={-260}\\n      actual={-280}\\n      domain={{ min: -300, max: 0 }}\\n      bands={[-200, -250, -300]}\\n      ticks={[0, -50, -100, -150, -200, -250, -300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-280\\\"\\n      centralMinor=\\\"target: -260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-100': 'lightcoral',\\n  0: 'indianred',\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -200, max: 300 }}\\n      bands={[-200, -100, 0, 200, 250, 300]}\\n      ticks={[-200, -100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-100': 'lightcoral',\n  0: 'indianred',\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={-80}\n      domain={{ min: -200, max: 300 }}\n      bands={[-200, -100, 0, 200, 250, 300]}\n      ticks={[-200, -100, 0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-80\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -200, max: 300 }}\\n      bands={[-200, -100, 0, 200, 250, 300]}\\n      ticks={[-200, -100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.VerticalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-100': 'lightcoral',\\n  0: 'indianred',\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -200, max: 300 }}\\n      bands={[-200, -100, 0, 200, 250, 300]}\\n      ticks={[-200, -100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.VerticalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-100': 'lightcoral',\n  0: 'indianred',\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={-80}\n      domain={{ min: -200, max: 300 }}\n      bands={[-200, -100, 0, 200, 250, 300]}\n      ticks={[-200, -100, 0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-80\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -200, max: 300 }}\\n      bands={[-200, -100, 0, 200, 250, 300]}\\n      ticks={[-200, -100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  '-50': 'lightcoral',\\n  0: 'indianred',\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -100, max: 300 }}\\n      bands={[-100, -50, 0, 200, 250, 300]}\\n      ticks={[-100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  '-50': 'lightcoral',\n  0: 'indianred',\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={-80}\n      domain={{ min: -100, max: 300 }}\n      bands={[-100, -50, 0, 200, 250, 300]}\n      ticks={[-100, 0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"-80\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={-80}\\n      domain={{ min: -100, max: 300 }}\\n      bands={[-100, -50, 0, 200, 250, 300]}\\n      ticks={[-100, 0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"-80\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Color, BandFillColorAccessorInput, Settings } from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const bandLabels = ['freezing', 'chilly', 'brisk'];\\n  const bands = [200, 250, 300];\\n\\n  const opacityMap: { [k: string]: number } = {\\n    '200': 0.2,\\n    '250': 0.12,\\n    '300': 0.05,\\n  };\\n\\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\\n    const defaultValue = opacityMap[band];\\n    acc[band] = `rgba(0, 0, 0, ${defaultValue.toFixed(2)})`;\\n    return acc;\\n  }, {});\\n\\n  const getBandFillColor = getBandFillColorFn(colorMap);\\n\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={0}\\n        target={260}\\n        actual={170}\\n        domain={{ min: 0, max: 300 }}\\n        bands={bands}\\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor=\\\"170\\\"\\n        centralMinor=\\\"\\\"\\n        angleStart={Math.PI}\\n        angleEnd={0}\\n        bandLabels={bandLabels}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":62},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":62}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Color, BandFillColorAccessorInput, Settings } from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const bandLabels = ['freezing', 'chilly', 'brisk'];\n  const bands = [200, 250, 300];\n\n  const opacityMap: { [k: string]: number } = {\n    '200': 0.2,\n    '250': 0.12,\n    '300': 0.05,\n  };\n\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\n    const defaultValue = opacityMap[band];\n    acc[band] = `rgba(0, 0, 0, ${defaultValue.toFixed(2)})`;\n    return acc;\n  }, {});\n\n  const getBandFillColor = getBandFillColorFn(colorMap);\n\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={0}\n        target={260}\n        actual={170}\n        domain={{ min: 0, max: 300 }}\n        bands={bands}\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={getBandFillColor}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor=\"170\"\n        centralMinor=\"\"\n        angleStart={Math.PI}\n        angleEnd={0}\n        bandLabels={bandLabels}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const bandLabels = ['freezing', 'chilly', 'brisk'];\\n  const bands = [200, 250, 300];\\n\\n  const opacityMap: { [k: string]: number } = {\\n    '200': 0.2,\\n    '250': 0.12,\\n    '300': 0.05,\\n  };\\n\\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\\n    const defaultValue = opacityMap[band];\\n    acc[band] = `rgba(0, 0, 0, ${defaultValue.toFixed(2)})`;\\n    return acc;\\n  }, {});\\n\\n  const getBandFillColor = getBandFillColorFn(colorMap);\\n\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={0}\\n        target={260}\\n        actual={170}\\n        domain={{ min: 0, max: 300 }}\\n        bands={bands}\\n        ticks={[0, 50, 100, 150, 200, 250, 300]}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={getBandFillColor}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor=\\\"170\\\"\\n        centralMinor=\\\"\\\"\\n        angleStart={Math.PI}\\n        angleEnd={0}\\n        bandLabels={bandLabels}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { array, boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const subtype = customKnobs.fromEnum('subtype', GoalSubtype, GoalSubtype.VerticalBullet);\\n  const reverse = boolean('reverse', false);\\n  const start = number('angleStart (π)', 5 / 4, { min: -2, max: 2, step: 1 / 8 });\\n  const end = number('angleEnd (π)', -1 / 4, { min: -2, max: 2, step: 1 / 8 });\\n  const base = number('base', 0);\\n  const target = number('target', 260);\\n  const actual = number('actual', 280);\\n  const min = number('domain min', 0, { min: 0, step: 50 });\\n  const max = number('domain max', 300, { min, step: 50 });\\n  const autoTicks = boolean('auto generate ticks', true);\\n  const ticks = autoTicks ? undefined : array('ticks', ['0', '100', '200', '300']).map(Number);\\n  const autoBands = boolean('auto generate bands', true);\\n  const bands = autoBands ? undefined : array('bands', ['200', '250', '300']).map(Number);\\n\\n  const angleStart = start * Math.PI;\\n  const angleEnd = end * Math.PI;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec\\\"\\n        subtype={subtype}\\n        base={base}\\n        target={target}\\n        actual={actual}\\n        ticks={ticks}\\n        bands={bands}\\n        domain={{ min, max }}\\n        angleStart={reverse ? angleEnd : angleStart}\\n        angleEnd={reverse ? angleStart : angleEnd}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        labelMajor=\\\"Speed average\\\"\\n        labelMinor={subtype === GoalSubtype.Goal ? '' : `${actual} MB/s`}\\n        centralMajor={`${actual} MB/s`}\\n        centralMinor=\\\"\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `Leaving \\\\`ticks\\\\` and/or \\\\`bands\\\\` as \\\\`undefined\\\\` will automatically generate linear values given the specified domain.\\nIf \\\\`ticks\\\\` and/or \\\\`bands\\\\` is set to \\\\`[]\\\\` (empty array), no ticks or bands will be displayed, respectively`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":60},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":60}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { array, boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const subtype = customKnobs.fromEnum('subtype', GoalSubtype, GoalSubtype.VerticalBullet);\n  const reverse = boolean('reverse', false);\n  const start = number('angleStart (π)', 5 / 4, { min: -2, max: 2, step: 1 / 8 });\n  const end = number('angleEnd (π)', -1 / 4, { min: -2, max: 2, step: 1 / 8 });\n  const base = number('base', 0);\n  const target = number('target', 260);\n  const actual = number('actual', 280);\n  const min = number('domain min', 0, { min: 0, step: 50 });\n  const max = number('domain max', 300, { min, step: 50 });\n  const autoTicks = boolean('auto generate ticks', true);\n  const ticks = autoTicks ? undefined : array('ticks', ['0', '100', '200', '300']).map(Number);\n  const autoBands = boolean('auto generate bands', true);\n  const bands = autoBands ? undefined : array('bands', ['200', '250', '300']).map(Number);\n\n  const angleStart = start * Math.PI;\n  const angleEnd = end * Math.PI;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Goal\n        id=\"spec\"\n        subtype={subtype}\n        base={base}\n        target={target}\n        actual={actual}\n        ticks={ticks}\n        bands={bands}\n        domain={{ min, max }}\n        angleStart={reverse ? angleEnd : angleStart}\n        angleEnd={reverse ? angleStart : angleEnd}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        labelMajor=\"Speed average\"\n        labelMinor={subtype === GoalSubtype.Goal ? '' : `${actual} MB/s`}\n        centralMajor={`${actual} MB/s`}\n        centralMinor=\"\"\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `Leaving \\`ticks\\` and/or \\`bands\\` as \\`undefined\\` will automatically generate linear values given the specified domain.\nIf \\`ticks\\` and/or \\`bands\\` is set to \\`[]\\` (empty array), no ticks or bands will be displayed, respectively`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const subtype = customKnobs.fromEnum('subtype', GoalSubtype, GoalSubtype.VerticalBullet);\\n  const reverse = boolean('reverse', false);\\n  const start = number('angleStart (π)', 5 / 4, { min: -2, max: 2, step: 1 / 8 });\\n  const end = number('angleEnd (π)', -1 / 4, { min: -2, max: 2, step: 1 / 8 });\\n  const base = number('base', 0);\\n  const target = number('target', 260);\\n  const actual = number('actual', 280);\\n  const min = number('domain min', 0, { min: 0, step: 50 });\\n  const max = number('domain max', 300, { min, step: 50 });\\n  const autoTicks = boolean('auto generate ticks', true);\\n  const ticks = autoTicks ? undefined : array('ticks', ['0', '100', '200', '300']).map(Number);\\n  const autoBands = boolean('auto generate bands', true);\\n  const bands = autoBands ? undefined : array('bands', ['200', '250', '300']).map(Number);\\n\\n  const angleStart = start * Math.PI;\\n  const angleEnd = end * Math.PI;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Goal\\n        id=\\\"spec\\\"\\n        subtype={subtype}\\n        base={base}\\n        target={target}\\n        actual={actual}\\n        ticks={ticks}\\n        bands={bands}\\n        domain={{ min, max }}\\n        angleStart={reverse ? angleEnd : angleStart}\\n        angleEnd={reverse ? angleStart : angleEnd}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        labelMajor=\\\"Speed average\\\"\\n        labelMinor={subtype === GoalSubtype.Goal ? '' : `${actual} MB/s`}\\n        centralMajor={`${actual} MB/s`}\\n        centralMinor=\\\"\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number, color, array, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { Color } from '../../../packages/charts/src/common/colors';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debugState = boolean('Enable debug state', false);\\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\\n  const bands = array('bands', ['200', '250', '300']).map(Number);\\n\\n  const opacityMap: { [k: string]: number } = {\\n    '200': 0.2,\\n    '250': 0.12,\\n    '300': 0.05,\\n  };\\n\\n  const useColors = boolean('use custom band colors', false, 'colors');\\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\\n    const defaultValue = opacityMap[band] ?? 0;\\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\\n    return acc;\\n  }, {});\\n\\n  const getBandFillColor = getBandFillColorFn(colorMap);\\n\\n  const angleStart =\\n    number('angleStart (n * π/8)', 8, {\\n      step: 1,\\n      min: -2 * 8,\\n      max: 2 * 8,\\n    }) *\\n    (Math.PI / 8);\\n  const angleEnd =\\n    number('angleEnd (n * π/8)', 0, {\\n      step: 1,\\n      min: -2 * 8,\\n      max: 2 * 8,\\n    }) *\\n    (Math.PI / 8);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} onRenderChange={getDebugStateLogger(debugState)} debugState={debugState} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={base}\\n        target={target}\\n        actual={actual}\\n        bands={bands}\\n        ticks={ticks}\\n        domain={{ min: 0, max: 300 }}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={useColors ? getBandFillColor : undefined}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor={() => `$${actual}k USD`}\\n        centralMinor=\\\"\\\"\\n        angleStart={angleStart}\\n        angleEnd={angleEnd}\\n        tooltipValueFormatter={(d) => `$${d}k USD`}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":24},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":24},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number, color, array, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { Color } from '../../../packages/charts/src/common/colors';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debugState = boolean('Enable debug state', false);\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\n  const bands = array('bands', ['200', '250', '300']).map(Number);\n\n  const opacityMap: { [k: string]: number } = {\n    '200': 0.2,\n    '250': 0.12,\n    '300': 0.05,\n  };\n\n  const useColors = boolean('use custom band colors', false, 'colors');\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\n    const defaultValue = opacityMap[band] ?? 0;\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\n    return acc;\n  }, {});\n\n  const getBandFillColor = getBandFillColorFn(colorMap);\n\n  const angleStart =\n    number('angleStart (n * π/8)', 8, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n  const angleEnd =\n    number('angleEnd (n * π/8)', 0, {\n      step: 1,\n      min: -2 * 8,\n      max: 2 * 8,\n    }) *\n    (Math.PI / 8);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} onRenderChange={getDebugStateLogger(debugState)} debugState={debugState} />\n      <Goal\n        id=\"spec_1\"\n        subtype={subtype}\n        base={base}\n        target={target}\n        actual={actual}\n        bands={bands}\n        ticks={ticks}\n        domain={{ min: 0, max: 300 }}\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n        bandFillColor={useColors ? getBandFillColor : undefined}\n        labelMajor=\"Revenue 2020 YTD  \"\n        labelMinor=\"(thousand USD)  \"\n        centralMajor={() => `$${actual}k USD`}\n        centralMinor=\"\"\n        angleStart={angleStart}\n        angleEnd={angleEnd}\n        tooltipValueFormatter={(d) => `$${d}k USD`}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debugState = boolean('Enable debug state', false);\\n  const base = number('base', 0, { range: true, min: 0, max: 300, step: 1 });\\n  const target = number('target', 260, { range: true, min: 0, max: 300, step: 1 });\\n  const actual = number('actual', 170, { range: true, min: 0, max: 300, step: 1 });\\n  const ticks = array('ticks', ['0', '50', '100', '150', '200', '250', '300']).map(Number);\\n  const bands = array('bands', ['200', '250', '300']).map(Number);\\n\\n  const opacityMap: { [k: string]: number } = {\\n    '200': 0.2,\\n    '250': 0.12,\\n    '300': 0.05,\\n  };\\n\\n  const useColors = boolean('use custom band colors', false, 'colors');\\n  const colorMap: { [k: number]: Color } = bands.reduce<{ [k: number]: Color }>((acc, band) => {\\n    const defaultValue = opacityMap[band] ?? 0;\\n    acc[band] = color(`color at ${band}`, `rgba(0,0,0,${defaultValue.toFixed(2)})`, 'colors');\\n    return acc;\\n  }, {});\\n\\n  const getBandFillColor = getBandFillColorFn(colorMap);\\n\\n  const angleStart =\\n    number('angleStart (n * π/8)', 8, {\\n      step: 1,\\n      min: -2 * 8,\\n      max: 2 * 8,\\n    }) *\\n    (Math.PI / 8);\\n  const angleEnd =\\n    number('angleEnd (n * π/8)', 0, {\\n      step: 1,\\n      min: -2 * 8,\\n      max: 2 * 8,\\n    }) *\\n    (Math.PI / 8);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} onRenderChange={getDebugStateLogger(debugState)} debugState={debugState} />\\n      <Goal\\n        id=\\\"spec_1\\\"\\n        subtype={subtype}\\n        base={base}\\n        target={target}\\n        actual={actual}\\n        bands={bands}\\n        ticks={ticks}\\n        domain={{ min: 0, max: 300 }}\\n        tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n        bandFillColor={useColors ? getBandFillColor : undefined}\\n        labelMajor=\\\"Revenue 2020 YTD  \\\"\\n        labelMinor=\\\"(thousand USD)  \\\"\\n        centralMajor={() => `$${actual}k USD`}\\n        centralMinor=\\\"\\\"\\n        angleStart={angleStart}\\n        angleEnd={angleEnd}\\n        tooltipValueFormatter={(d) => `$${d}k USD`}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.VerticalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.VerticalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst colorful = subtype === 'goal';\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: colorful ? 'rgba(255,0,0,0.5)' : `rgb(${q1},${q1},${q1})`,\\n  250: colorful ? 'yellow' : `rgb(${q2},${q2},${q2})`,\\n  300: colorful ? 'rgba(0,255,0,0.5)' : `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.Goal;\n\nconst colorful = subtype === 'goal';\n\nconst getBandFillColor = getBandFillColorFn({\n  200: colorful ? 'rgba(255,0,0,0.5)' : `rgb(${q1},${q1},${q1})`,\n  250: colorful ? 'yellow' : `rgb(${q2},${q2},${q2})`,\n  300: colorful ? 'rgba(0,255,0,0.5)' : `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[300]}\\n      ticks={[0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[300]}\n      ticks={[0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[300]}\\n      ticks={[0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst q1 = 255 - 255 * 0.4;\\nconst q2 = 255 - 255 * 0.25;\\nconst q3 = 255 - 255 * 0.1;\\n\\nconst subtype = GoalSubtype.HorizontalBullet;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: `rgb(${q1},${q1},${q1})`,\\n  250: `rgb(${q2},${q2},${q2})`,\\n  300: `rgb(${q3},${q3},${q3})`,\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[]}\\n      ticks={[0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst q1 = 255 - 255 * 0.4;\nconst q2 = 255 - 255 * 0.25;\nconst q3 = 255 - 255 * 0.1;\n\nconst subtype = GoalSubtype.HorizontalBullet;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: `rgb(${q1},${q1},${q1})`,\n  250: `rgb(${q2},${q2},${q2})`,\n  300: `rgb(${q3},${q3},${q3})`,\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[]}\n      ticks={[0, 100, 200, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[]}\\n      ticks={[0, 100, 200, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  200: 'rgba(255,0,0,0.5)',\\n  250: 'yellow',\\n  300: 'rgba(0,255,0,0.5)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 100, 200, 250, 260, 270, 280, 290, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  200: 'rgba(255,0,0,0.5)',\n  250: 'yellow',\n  300: 'rgba(0,255,0,0.5)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 100, 200, 250, 260, 270, 280, 290, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"280\"\n      centralMinor=\"target: 260\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 100, 200, 250, 260, 270, 280, 290, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"280\\\"\\n      centralMinor=\\\"target: 260\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Goal, Settings } from '@elastic/charts';\\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getBandFillColorFn } from '../utils/utils';\\n\\nconst subtype = GoalSubtype.Goal;\\n\\nconst getBandFillColor = getBandFillColorFn({\\n  300: 'rgb(232,232,232)',\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={225}\\n      actual={0}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":25},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":25},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Goal, Settings } from '@elastic/charts';\nimport { BandFillColorAccessorInput } from '@elastic/charts/src/chart_types/goal_chart/specs';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getBandFillColorFn } from '../utils/utils';\n\nconst subtype = GoalSubtype.Goal;\n\nconst getBandFillColor = getBandFillColorFn({\n  300: 'rgb(232,232,232)',\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={225}\n      actual={0}\n      domain={{ min: 0, max: 300 }}\n      bands={[300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"Revenue 2020 YTD  \"\n      labelMinor=\"(thousand USD)  \"\n      centralMajor=\"225\"\n      centralMinor=\"\"\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={225}\\n      actual={0}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"Revenue 2020 YTD  \\\"\\n      labelMinor=\\\"(thousand USD)  \\\"\\n      centralMajor=\\\"225\\\"\\n      centralMinor=\\\"\\\"\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Goal (@alpha)',\n};\n\nexport { Example as gaugeWithTarget } from './2_gauge_with_target.story';\nexport { Example as horizontalBullet } from './3_horizontal_bullet.story';\nexport { Example as verticalBullet } from './4_vertical_bullet.story';\nexport { Example as minimalGoal } from './5_minimal.story';\nexport { Example as minimalHorizontal } from './6_minimal_horizontal.story';\nexport { Example as horizontalBar } from './7_horizontal_bar.story';\nexport { Example as irregularTicks } from './8_irregular_ticks.story';\nexport { Example as minimalBand } from './9_minimal_band.story';\nexport { Example as bandInBand } from './10_band_in_band.story';\nexport { Example as gaps } from './11_gaps.story';\nexport { Example as range } from './12_range.story';\nexport { Example as confidenceLevel } from './13_confidence_level.story';\nexport { Example as third } from './14_one_third.story';\nexport { Example as halfCircle } from './15_half_circle.story';\nexport { Example as twoThirds } from './16_two_thirds.story';\nexport { Example as threeQuarters } from './17_three_quarters.story';\nexport { Example as fullCircle } from './17_total_circle.story';\nexport { Example as smallGap } from './17_very_small_gap.story';\nexport { Example as sideGauge } from './18_side_gauge.story';\nexport { Example as sideGaugeInverted } from './18_side_gauge_inverted_angle_relation.story';\nexport { Example as horizontalNegative } from './19_horizontal_negative.story';\nexport { Example as verticalNegative } from './20_vertical_negative.story';\nexport { Example as goalNegative } from './21_goal_negative.story';\nexport { Example as horizontalPlusMinus } from './22_horizontal_plusminus.story';\nexport { Example as verticalPlusMinus } from './23_vertical_plusminus.story';\nexport { Example as goalPlusMinus } from './24_goal_plusminus.story';\nexport { Example as goalSemantics } from './25_goal_semantic.story';\nexport { Example as autoLinearTicks } from './26_auto_linear_ticks.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  GridLineStyle,\\n  LineSeries,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction generateGridLineStyle(group: string, gridColor = 'purple'): GridLineStyle {\\n  const groupId = `${group} axis`;\\n\\n  return {\\n    visible: true,\\n    stroke: color(`${groupId} grid line stroke color`, gridColor, groupId),\\n    strokeWidth: number(\\n      `${groupId} grid line stroke width`,\\n      1,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 10,\\n        step: 1,\\n      },\\n      groupId,\\n    ),\\n    opacity: number(\\n      `${groupId} grid line stroke opacity`,\\n      1,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      },\\n      groupId,\\n    ),\\n    dash: [\\n      number(\\n        `${groupId} grid line dash length`,\\n        1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 10,\\n          step: 1,\\n        },\\n        groupId,\\n      ),\\n      number(\\n        `${groupId} grid line dash spacing`,\\n        1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 10,\\n          step: 1,\\n        },\\n        groupId,\\n      ),\\n    ],\\n  };\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left, 'lightblue');\\n  const rightAxisGridLineStyle = generateGridLineStyle(Position.Right, 'red');\\n  const topAxisGridLineStyle = generateGridLineStyle(Position.Top, 'teal');\\n  const bottomAxisGridLineStyle = generateGridLineStyle(Position.Bottom, 'blue');\\n  const toggleBottomAxisGridLineStyle = boolean('use axis gridLine vertically', false, 'bottom axis');\\n  const toggleHorizontalAxisGridLineStyle = boolean('use axis gridLine horizontally', false, 'left axis');\\n  const bottomAxisThemeGridLineStyle = generateGridLineStyle('Vertical Axis Theme', 'violet');\\n  const leftAxisThemeGridLineStyle = generateGridLineStyle('Horizontal Axis Theme', 'hotpink');\\n  const theme: PartialTheme = {\\n    axes: {\\n      gridLine: { vertical: leftAxisThemeGridLineStyle, horizontal: bottomAxisThemeGridLineStyle },\\n    },\\n  };\\n  const integersOnlyLeft = boolean('left axis show only integer values', false, 'left axis');\\n  const integersOnlyRight = boolean('right axis show only intger values', false, 'right axis');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        gridLine={{\\n          ...(toggleBottomAxisGridLineStyle && bottomAxisGridLineStyle),\\n          visible: boolean('show bottom axis grid lines', false, 'bottom axis'),\\n        }}\\n        maximumFractionDigits={boolean('bottom axis show only integer values', false, 'bottom axis') ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"left1\\\"\\n        position={Position.Left}\\n        title=\\\"Left axis 1\\\"\\n        tickFormat={integersOnlyLeft ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...(toggleHorizontalAxisGridLineStyle && leftAxisGridLineStyle),\\n          visible: boolean('show left axis grid lines', false, 'left axis'),\\n        }}\\n        maximumFractionDigits={integersOnlyLeft ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title=\\\"Top axis\\\"\\n        showOverlappingTicks\\n        gridLine={{\\n          ...topAxisGridLineStyle,\\n          visible: boolean('show top axis grid lines', false, 'top axis'),\\n        }}\\n        maximumFractionDigits={boolean('top axis show only integer values', false, 'top axis') ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Right axis\\\"\\n        position={Position.Right}\\n        tickFormat={integersOnlyRight ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...rightAxisGridLineStyle,\\n          visible: boolean('show right axis grid lines', false, 'right axis'),\\n        }}\\n        maximumFractionDigits={integersOnlyRight ? 0 : undefined}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":82},\"endLoc\":{\"col\":1,\"line\":175},\"startBody\":{\"col\":36,\"line\":82},\"endBody\":{\"col\":1,\"line\":175}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  GridLineStyle,\n  LineSeries,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction generateGridLineStyle(group: string, gridColor = 'purple'): GridLineStyle {\n  const groupId = `${group} axis`;\n\n  return {\n    visible: true,\n    stroke: color(`${groupId} grid line stroke color`, gridColor, groupId),\n    strokeWidth: number(\n      `${groupId} grid line stroke width`,\n      1,\n      {\n        range: true,\n        min: 0,\n        max: 10,\n        step: 1,\n      },\n      groupId,\n    ),\n    opacity: number(\n      `${groupId} grid line stroke opacity`,\n      1,\n      {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      },\n      groupId,\n    ),\n    dash: [\n      number(\n        `${groupId} grid line dash length`,\n        1,\n        {\n          range: true,\n          min: 0,\n          max: 10,\n          step: 1,\n        },\n        groupId,\n      ),\n      number(\n        `${groupId} grid line dash spacing`,\n        1,\n        {\n          range: true,\n          min: 0,\n          max: 10,\n          step: 1,\n        },\n        groupId,\n      ),\n    ],\n  };\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left, 'lightblue');\n  const rightAxisGridLineStyle = generateGridLineStyle(Position.Right, 'red');\n  const topAxisGridLineStyle = generateGridLineStyle(Position.Top, 'teal');\n  const bottomAxisGridLineStyle = generateGridLineStyle(Position.Bottom, 'blue');\n  const toggleBottomAxisGridLineStyle = boolean('use axis gridLine vertically', false, 'bottom axis');\n  const toggleHorizontalAxisGridLineStyle = boolean('use axis gridLine horizontally', false, 'left axis');\n  const bottomAxisThemeGridLineStyle = generateGridLineStyle('Vertical Axis Theme', 'violet');\n  const leftAxisThemeGridLineStyle = generateGridLineStyle('Horizontal Axis Theme', 'hotpink');\n  const theme: PartialTheme = {\n    axes: {\n      gridLine: { vertical: leftAxisThemeGridLineStyle, horizontal: bottomAxisThemeGridLineStyle },\n    },\n  };\n  const integersOnlyLeft = boolean('left axis show only integer values', false, 'left axis');\n  const integersOnlyRight = boolean('right axis show only intger values', false, 'right axis');\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks\n        gridLine={{\n          ...(toggleBottomAxisGridLineStyle && bottomAxisGridLineStyle),\n          visible: boolean('show bottom axis grid lines', false, 'bottom axis'),\n        }}\n        maximumFractionDigits={boolean('bottom axis show only integer values', false, 'bottom axis') ? 0 : undefined}\n      />\n      <Axis\n        id=\"left1\"\n        position={Position.Left}\n        title=\"Left axis 1\"\n        tickFormat={integersOnlyLeft ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\n        gridLine={{\n          ...(toggleHorizontalAxisGridLineStyle && leftAxisGridLineStyle),\n          visible: boolean('show left axis grid lines', false, 'left axis'),\n        }}\n        maximumFractionDigits={integersOnlyLeft ? 0 : undefined}\n      />\n      <Axis\n        id=\"top\"\n        position={Position.Top}\n        title=\"Top axis\"\n        showOverlappingTicks\n        gridLine={{\n          ...topAxisGridLineStyle,\n          visible: boolean('show top axis grid lines', false, 'top axis'),\n        }}\n        maximumFractionDigits={boolean('top axis show only integer values', false, 'top axis') ? 0 : undefined}\n      />\n      <Axis\n        id=\"right\"\n        title=\"Right axis\"\n        position={Position.Right}\n        tickFormat={integersOnlyRight ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\n        gridLine={{\n          ...rightAxisGridLineStyle,\n          visible: boolean('show right axis grid lines', false, 'right axis'),\n        }}\n        maximumFractionDigits={integersOnlyRight ? 0 : undefined}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        groupId=\"group2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left, 'lightblue');\\n  const rightAxisGridLineStyle = generateGridLineStyle(Position.Right, 'red');\\n  const topAxisGridLineStyle = generateGridLineStyle(Position.Top, 'teal');\\n  const bottomAxisGridLineStyle = generateGridLineStyle(Position.Bottom, 'blue');\\n  const toggleBottomAxisGridLineStyle = boolean('use axis gridLine vertically', false, 'bottom axis');\\n  const toggleHorizontalAxisGridLineStyle = boolean('use axis gridLine horizontally', false, 'left axis');\\n  const bottomAxisThemeGridLineStyle = generateGridLineStyle('Vertical Axis Theme', 'violet');\\n  const leftAxisThemeGridLineStyle = generateGridLineStyle('Horizontal Axis Theme', 'hotpink');\\n  const theme: PartialTheme = {\\n    axes: {\\n      gridLine: { vertical: leftAxisThemeGridLineStyle, horizontal: bottomAxisThemeGridLineStyle },\\n    },\\n  };\\n  const integersOnlyLeft = boolean('left axis show only integer values', false, 'left axis');\\n  const integersOnlyRight = boolean('right axis show only intger values', false, 'right axis');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        gridLine={{\\n          ...(toggleBottomAxisGridLineStyle && bottomAxisGridLineStyle),\\n          visible: boolean('show bottom axis grid lines', false, 'bottom axis'),\\n        }}\\n        maximumFractionDigits={boolean('bottom axis show only integer values', false, 'bottom axis') ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"left1\\\"\\n        position={Position.Left}\\n        title=\\\"Left axis 1\\\"\\n        tickFormat={integersOnlyLeft ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...(toggleHorizontalAxisGridLineStyle && leftAxisGridLineStyle),\\n          visible: boolean('show left axis grid lines', false, 'left axis'),\\n        }}\\n        maximumFractionDigits={integersOnlyLeft ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title=\\\"Top axis\\\"\\n        showOverlappingTicks\\n        gridLine={{\\n          ...topAxisGridLineStyle,\\n          visible: boolean('show top axis grid lines', false, 'top axis'),\\n        }}\\n        maximumFractionDigits={boolean('top axis show only integer values', false, 'top axis') ? 0 : undefined}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"Right axis\\\"\\n        position={Position.Right}\\n        tickFormat={integersOnlyRight ? (d) => Number(d).toFixed(0) : (d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...rightAxisGridLineStyle,\\n          visible: boolean('show right axis grid lines', false, 'right axis'),\\n        }}\\n        maximumFractionDigits={integersOnlyRight ? 0 : undefined}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, GridLineStyle, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction generateGridLineStyle(group: string, gridColor = 'purple'): GridLineStyle {\\n  const groupId = `${group} axis`;\\n\\n  return {\\n    visible: true,\\n    stroke: color(`${groupId} grid line stroke color`, gridColor, groupId),\\n    strokeWidth: number(\\n      `${groupId} grid line stroke width`,\\n      1,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 10,\\n        step: 1,\\n      },\\n      groupId,\\n    ),\\n    opacity: number(\\n      `${groupId} grid line stroke opacity`,\\n      1,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.01,\\n      },\\n      groupId,\\n    ),\\n    dash: [\\n      number(\\n        `${groupId} grid line dash length`,\\n        1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 10,\\n          step: 1,\\n        },\\n        groupId,\\n      ),\\n      number(\\n        `${groupId} grid line dash spacing`,\\n        1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 10,\\n          step: 1,\\n        },\\n        groupId,\\n      ),\\n    ],\\n  };\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left);\\n  const leftAxisGridLineStyle2 = generateGridLineStyle(`${Position.Left}2`);\\n\\n  return (\\n    <Chart title={title} description={description} size={[500, 300]}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"left1\\\"\\n        title=\\\"Left axis 1\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...leftAxisGridLineStyle,\\n          visible: boolean('show left axis grid lines', false, 'left axis'),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis 2\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...leftAxisGridLineStyle2,\\n          visible: boolean('show left axis 2 grid lines', false, 'left2 axis'),\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":72},\"endLoc\":{\"col\":1,\"line\":130},\"startBody\":{\"col\":36,\"line\":72},\"endBody\":{\"col\":1,\"line\":130}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, GridLineStyle, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction generateGridLineStyle(group: string, gridColor = 'purple'): GridLineStyle {\n  const groupId = `${group} axis`;\n\n  return {\n    visible: true,\n    stroke: color(`${groupId} grid line stroke color`, gridColor, groupId),\n    strokeWidth: number(\n      `${groupId} grid line stroke width`,\n      1,\n      {\n        range: true,\n        min: 0,\n        max: 10,\n        step: 1,\n      },\n      groupId,\n    ),\n    opacity: number(\n      `${groupId} grid line stroke opacity`,\n      1,\n      {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.01,\n      },\n      groupId,\n    ),\n    dash: [\n      number(\n        `${groupId} grid line dash length`,\n        1,\n        {\n          range: true,\n          min: 0,\n          max: 10,\n          step: 1,\n        },\n        groupId,\n      ),\n      number(\n        `${groupId} grid line dash spacing`,\n        1,\n        {\n          range: true,\n          min: 0,\n          max: 10,\n          step: 1,\n        },\n        groupId,\n      ),\n    ],\n  };\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left);\n  const leftAxisGridLineStyle2 = generateGridLineStyle(`${Position.Left}2`);\n\n  return (\n    <Chart title={title} description={description} size={[500, 300]}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"left1\"\n        title=\"Left axis 1\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        gridLine={{\n          ...leftAxisGridLineStyle,\n          visible: boolean('show left axis grid lines', false, 'left axis'),\n        }}\n      />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis 2\"\n        groupId=\"group2\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        gridLine={{\n          ...leftAxisGridLineStyle2,\n          visible: boolean('show left axis 2 grid lines', false, 'left2 axis'),\n        }}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        groupId=\"group2\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const leftAxisGridLineStyle = generateGridLineStyle(Position.Left);\\n  const leftAxisGridLineStyle2 = generateGridLineStyle(`${Position.Left}2`);\\n\\n  return (\\n    <Chart title={title} description={description} size={[500, 300]}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"left1\\\"\\n        title=\\\"Left axis 1\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...leftAxisGridLineStyle,\\n          visible: boolean('show left axis grid lines', false, 'left axis'),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis 2\\\"\\n        groupId=\\\"group2\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          ...leftAxisGridLineStyle2,\\n          visible: boolean('show left axis 2 grid lines', false, 'left2 axis'),\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        groupId=\\\"group2\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { array, boolean, color, number } from '@storybook/addon-knobs';\\nimport { startCase } from 'lodash';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  LineSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  TooltipType,\\n  PartialTheme,\\n  StrokeStyle,\\n  StrokeDashArray,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dg = new SeededDataGenerator();\\nconst data = dg.generateBasicSeries(20);\\n\\ntype LineProps = StrokeStyle & StrokeDashArray;\\n\\nconst getLineStyles = ({ stroke, strokeWidth, dash }: Partial<LineProps> = {}, group?: string): LineProps => ({\\n  stroke: color('Stroke', stroke ?? '#ccc', group),\\n  strokeWidth: number('Stroke width', strokeWidth ?? 2, { min: 1, max: 6, range: true, step: 1 }, group),\\n  dash: (\\n    array(\\n      'Dash',\\n      (dash ?? []).map((n) => `${n}`),\\n      ',',\\n      group,\\n    ) ?? []\\n  ).map((s) => parseInt(s, 10)),\\n});\\n\\nconst getAxisKnobs = (position: Position) => {\\n  const title = `${startCase(position)} axis`;\\n  const visible = boolean('Show gridline', true, title);\\n  return {\\n    id: position,\\n    position,\\n    title,\\n    tickFormat: (n: number) => n.toFixed(1),\\n    gridLine: {\\n      visible,\\n      opacity: number('Opacity', 0.2, { min: 0, max: 1, range: true, step: 0.1 }, title),\\n      ...getLineStyles(\\n        {\\n          dash: position === Position.Left ? [4, 4] : undefined,\\n        },\\n        title,\\n      ),\\n    },\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    crosshair: {\\n      line: getLineStyles({ stroke: 'red' }, 'Crosshair line'),\\n      crossLine: getLineStyles({ stroke: 'red', dash: [4, 4] }, 'Crosshair cross line'),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip type={customKnobs.enum.tooltipType('Tooltip type', TooltipType.Crosshairs)} />\\n      <Axis {...getAxisKnobs(Position.Left)} />\\n      <Axis {...getAxisKnobs(Position.Bottom)} />\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":71},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":71},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { array, boolean, color, number } from '@storybook/addon-knobs';\nimport { startCase } from 'lodash';\nimport React from 'react';\n\nimport {\n  Axis,\n  LineSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  TooltipType,\n  PartialTheme,\n  StrokeStyle,\n  StrokeDashArray,\n  Tooltip,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dg = new SeededDataGenerator();\nconst data = dg.generateBasicSeries(20);\n\ntype LineProps = StrokeStyle & StrokeDashArray;\n\nconst getLineStyles = ({ stroke, strokeWidth, dash }: Partial<LineProps> = {}, group?: string): LineProps => ({\n  stroke: color('Stroke', stroke ?? '#ccc', group),\n  strokeWidth: number('Stroke width', strokeWidth ?? 2, { min: 1, max: 6, range: true, step: 1 }, group),\n  dash: (\n    array(\n      'Dash',\n      (dash ?? []).map((n) => `${n}`),\n      ',',\n      group,\n    ) ?? []\n  ).map((s) => parseInt(s, 10)),\n});\n\nconst getAxisKnobs = (position: Position) => {\n  const title = `${startCase(position)} axis`;\n  const visible = boolean('Show gridline', true, title);\n  return {\n    id: position,\n    position,\n    title,\n    tickFormat: (n: number) => n.toFixed(1),\n    gridLine: {\n      visible,\n      opacity: number('Opacity', 0.2, { min: 0, max: 1, range: true, step: 0.1 }, title),\n      ...getLineStyles(\n        {\n          dash: position === Position.Left ? [4, 4] : undefined,\n        },\n        title,\n      ),\n    },\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    crosshair: {\n      line: getLineStyles({ stroke: 'red' }, 'Crosshair line'),\n      crossLine: getLineStyles({ stroke: 'red', dash: [4, 4] }, 'Crosshair cross line'),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\n      <Tooltip type={customKnobs.enum.tooltipType('Tooltip type', TooltipType.Crosshairs)} />\n      <Axis {...getAxisKnobs(Position.Left)} />\n      <Axis {...getAxisKnobs(Position.Bottom)} />\n      <LineSeries\n        id=\"line\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    crosshair: {\\n      line: getLineStyles({ stroke: 'red' }, 'Crosshair line'),\\n      crossLine: getLineStyles({ stroke: 'red', dash: [4, 4] }, 'Crosshair cross line'),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip type={customKnobs.enum.tooltipType('Tooltip type', TooltipType.Crosshairs)} />\\n      <Axis {...getAxisKnobs(Position.Left)} />\\n      <Axis {...getAxisKnobs(Position.Bottom)} />\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Grids',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as multipleAxesWithTheSamePosition } from './2_multiple_axes.story';\nexport { Example as lines } from './3_lines.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React, { useMemo } from 'react';\\n\\nimport {\\n  Chart,\\n  Heatmap,\\n  HeatmapStyle,\\n  niceTimeFormatter,\\n  PointerEvent,\\n  RecursivePartial,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { DATA_6 } from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\nimport { useHeatmapSelection } from '../utils/use_heatmap_selection';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const { highlightedData, onElementClick, onBrushEnd } = useHeatmapSelection();\\n\\n  const debugState = boolean('Enable debug state', true);\\n  const showXAxisTitle = boolean('Show x axis title', false);\\n  const showYAxisTitle = boolean('Show y axis title', false);\\n  const showBrushTool = boolean('Show pointer brush area', true);\\n\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n  };\\n\\n  const heatmap = useMemo(() => {\\n    const styles: RecursivePartial<HeatmapStyle> = {\\n      brushTool: {\\n        visible: showBrushTool,\\n      },\\n      grid: {\\n        stroke: {\\n          width: 0.5,\\n          color: '#bababa',\\n        },\\n      },\\n      cell: {\\n        maxWidth: 'fill',\\n        maxHeight: 3,\\n        label: {\\n          visible: false,\\n        },\\n        border: {\\n          stroke: 'transparent',\\n          strokeWidth: 0,\\n        },\\n      },\\n      yAxisLabel: {\\n        visible: true,\\n        width: 'auto',\\n        padding: { left: 10, right: 10 },\\n      },\\n    };\\n\\n    return styles;\\n  }, [showBrushTool]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={onElementClick}\\n        onPointerUpdate={pointerUpdate}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        xDomain={{ min: 1572825600000, max: 1572912000000 }}\\n        debugState={debugState}\\n        theme={{ heatmap }}\\n        baseTheme={useBaseTheme()}\\n        onBrushEnd={onBrushEnd}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\\n            { start: 3.5, end: 25, color: '#8bc8fb' },\\n            { start: 25, end: 50, color: '#fdec25' },\\n            { start: 50, end: 75, color: '#fba740' },\\n            { start: 75, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={DATA_6.data}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\\n        xAxisLabelFormatter={(value) => {\\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\\n        }}\\n        timeZone={DATA_6.timeZone}\\n        highlightedData={highlightedData}\\n        xAxisTitle={showXAxisTitle ? 'Bottom axis' : undefined}\\n        yAxisTitle={showYAxisTitle ? 'Left axis' : undefined}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":118},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":118}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React, { useMemo } from 'react';\n\nimport {\n  Chart,\n  Heatmap,\n  HeatmapStyle,\n  niceTimeFormatter,\n  PointerEvent,\n  RecursivePartial,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\n\nimport { DATA_6 } from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { useHeatmapSelection } from '../utils/use_heatmap_selection';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const { highlightedData, onElementClick, onBrushEnd } = useHeatmapSelection();\n\n  const debugState = boolean('Enable debug state', true);\n  const showXAxisTitle = boolean('Show x axis title', false);\n  const showYAxisTitle = boolean('Show y axis title', false);\n  const showBrushTool = boolean('Show pointer brush area', true);\n\n  const pointerUpdate = (event: PointerEvent) => {\n    action('onPointerUpdate')(event);\n  };\n\n  const heatmap = useMemo(() => {\n    const styles: RecursivePartial<HeatmapStyle> = {\n      brushTool: {\n        visible: showBrushTool,\n      },\n      grid: {\n        stroke: {\n          width: 0.5,\n          color: '#bababa',\n        },\n      },\n      cell: {\n        maxWidth: 'fill',\n        maxHeight: 3,\n        label: {\n          visible: false,\n        },\n        border: {\n          stroke: 'transparent',\n          strokeWidth: 0,\n        },\n      },\n      yAxisLabel: {\n        visible: true,\n        width: 'auto',\n        padding: { left: 10, right: 10 },\n      },\n    };\n\n    return styles;\n  }, [showBrushTool]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onElementClick={onElementClick}\n        onPointerUpdate={pointerUpdate}\n        onRenderChange={getDebugStateLogger(debugState)}\n        showLegend\n        legendPosition=\"right\"\n        brushAxis=\"both\"\n        xDomain={{ min: 1572825600000, max: 1572912000000 }}\n        debugState={debugState}\n        theme={{ heatmap }}\n        baseTheme={useBaseTheme()}\n        onBrushEnd={onBrushEnd}\n      />\n      <Heatmap\n        id=\"heatmap1\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\n            { start: 3.5, end: 25, color: '#8bc8fb' },\n            { start: 25, end: 50, color: '#fdec25' },\n            { start: 50, end: 75, color: '#fba740' },\n            { start: 75, end: Infinity, color: '#fe5050' },\n          ],\n        }}\n        data={DATA_6.data}\n        xAccessor=\"x\"\n        yAccessor=\"y\"\n        valueAccessor=\"value\"\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\n        ySortPredicate=\"numAsc\"\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\n        xAxisLabelFormatter={(value) => {\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\n        }}\n        timeZone={DATA_6.timeZone}\n        highlightedData={highlightedData}\n        xAxisTitle={showXAxisTitle ? 'Bottom axis' : undefined}\n        yAxisTitle={showYAxisTitle ? 'Left axis' : undefined}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const { highlightedData, onElementClick, onBrushEnd } = useHeatmapSelection();\\n\\n  const debugState = boolean('Enable debug state', true);\\n  const showXAxisTitle = boolean('Show x axis title', false);\\n  const showYAxisTitle = boolean('Show y axis title', false);\\n  const showBrushTool = boolean('Show pointer brush area', true);\\n\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n  };\\n\\n  const heatmap = useMemo(() => {\\n    const styles: RecursivePartial<HeatmapStyle> = {\\n      brushTool: {\\n        visible: showBrushTool,\\n      },\\n      grid: {\\n        stroke: {\\n          width: 0.5,\\n          color: '#bababa',\\n        },\\n      },\\n      cell: {\\n        maxWidth: 'fill',\\n        maxHeight: 3,\\n        label: {\\n          visible: false,\\n        },\\n        border: {\\n          stroke: 'transparent',\\n          strokeWidth: 0,\\n        },\\n      },\\n      yAxisLabel: {\\n        visible: true,\\n        width: 'auto',\\n        padding: { left: 10, right: 10 },\\n      },\\n    };\\n\\n    return styles;\\n  }, [showBrushTool]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={onElementClick}\\n        onPointerUpdate={pointerUpdate}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        xDomain={{ min: 1572825600000, max: 1572912000000 }}\\n        debugState={debugState}\\n        theme={{ heatmap }}\\n        baseTheme={useBaseTheme()}\\n        onBrushEnd={onBrushEnd}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\\n            { start: 3.5, end: 25, color: '#8bc8fb' },\\n            { start: 25, end: 50, color: '#fdec25' },\\n            { start: 50, end: 75, color: '#fba740' },\\n            { start: 75, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={DATA_6.data}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\\n        xAxisLabelFormatter={(value) => {\\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\\n        }}\\n        timeZone={DATA_6.timeZone}\\n        highlightedData={highlightedData}\\n        xAxisTitle={showXAxisTitle ? 'Bottom axis' : undefined}\\n        yAxisTitle={showYAxisTitle ? 'Left axis' : undefined}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Heatmap, Settings } from '@elastic/charts';\\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = boolean('filter dataset', true)\\n    ? BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960)\\n    : BABYNAME_DATA;\\n  const showLabels = boolean('show', true, 'labels');\\n  const useGlobalMinFontSize = boolean('use global min fontSize', true, 'labels');\\n\\n  const minFontSize = number('min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'labels');\\n  const maxFontSize = number('max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'labels');\\n\\n  const showXAxisTitle = boolean('Show x axis title', true);\\n  const showYAxisTitle = boolean('Show y axis title', true);\\n\\n  return (\\n    <Chart title={title} description={description} size={['100%', 320]}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: 0,\\n              },\\n            },\\n            cell: {\\n              maxWidth: 'fill',\\n              label: {\\n                minFontSize,\\n                maxFontSize,\\n                visible: showLabels,\\n                useGlobalMinFontSize,\\n              },\\n              border: {\\n                stroke: 'transparent',\\n                strokeWidth: 1,\\n              },\\n            },\\n            yAxisLabel: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        onBrushEnd={action('onBrushEnd')}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap2\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 1000, color: '#AADC32' },\\n            { start: 1000, end: 5000, color: '#35B779' },\\n            { start: 5000, end: 10000, color: '#24868E' },\\n            { start: 10000, end: 50000, color: '#3B528B' },\\n            { start: 50000, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={(d) => d[2]}\\n        yAccessor={(d) => d[0]}\\n        valueAccessor={(d) => d[3]}\\n        valueFormatter={(value) => value.toFixed(0.2)}\\n        xSortPredicate=\\\"alphaAsc\\\"\\n        xAxisTitle={showXAxisTitle ? 'Popular baby names' : undefined}\\n        yAxisTitle={showYAxisTitle ? 'Years' : undefined}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: true,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":90},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":90}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Heatmap, Settings } from '@elastic/charts';\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = boolean('filter dataset', true)\n    ? BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960)\n    : BABYNAME_DATA;\n  const showLabels = boolean('show', true, 'labels');\n  const useGlobalMinFontSize = boolean('use global min fontSize', true, 'labels');\n\n  const minFontSize = number('min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'labels');\n  const maxFontSize = number('max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'labels');\n\n  const showXAxisTitle = boolean('Show x axis title', true);\n  const showYAxisTitle = boolean('Show y axis title', true);\n\n  return (\n    <Chart title={title} description={description} size={['100%', 320]}>\n      <Settings\n        onElementClick={action('onElementClick')}\n        showLegend\n        legendPosition=\"right\"\n        brushAxis=\"both\"\n        baseTheme={useBaseTheme()}\n        theme={{\n          heatmap: {\n            grid: {\n              stroke: {\n                width: 0,\n              },\n            },\n            cell: {\n              maxWidth: 'fill',\n              label: {\n                minFontSize,\n                maxFontSize,\n                visible: showLabels,\n                useGlobalMinFontSize,\n              },\n              border: {\n                stroke: 'transparent',\n                strokeWidth: 1,\n              },\n            },\n            yAxisLabel: {\n              visible: true,\n            },\n          },\n        }}\n        onBrushEnd={action('onBrushEnd')}\n      />\n      <Heatmap\n        id=\"heatmap2\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 1000, color: '#AADC32' },\n            { start: 1000, end: 5000, color: '#35B779' },\n            { start: 5000, end: 10000, color: '#24868E' },\n            { start: 10000, end: 50000, color: '#3B528B' },\n            { start: 50000, end: Infinity, color: '#471164' },\n          ],\n        }}\n        data={data}\n        xAccessor={(d) => d[2]}\n        yAccessor={(d) => d[0]}\n        valueAccessor={(d) => d[3]}\n        valueFormatter={(value) => value.toFixed(0.2)}\n        xSortPredicate=\"alphaAsc\"\n        xAxisTitle={showXAxisTitle ? 'Popular baby names' : undefined}\n        yAxisTitle={showYAxisTitle ? 'Years' : undefined}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: true,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = boolean('filter dataset', true)\\n    ? BABYNAME_DATA.filter(([year]) => year > 1950 && year < 1960)\\n    : BABYNAME_DATA;\\n  const showLabels = boolean('show', true, 'labels');\\n  const useGlobalMinFontSize = boolean('use global min fontSize', true, 'labels');\\n\\n  const minFontSize = number('min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'labels');\\n  const maxFontSize = number('max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'labels');\\n\\n  const showXAxisTitle = boolean('Show x axis title', true);\\n  const showYAxisTitle = boolean('Show y axis title', true);\\n\\n  return (\\n    <Chart title={title} description={description} size={['100%', 320]}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: 0,\\n              },\\n            },\\n            cell: {\\n              maxWidth: 'fill',\\n              label: {\\n                minFontSize,\\n                maxFontSize,\\n                visible: showLabels,\\n                useGlobalMinFontSize,\\n              },\\n              border: {\\n                stroke: 'transparent',\\n                strokeWidth: 1,\\n              },\\n            },\\n            yAxisLabel: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        onBrushEnd={action('onBrushEnd')}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap2\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 1000, color: '#AADC32' },\\n            { start: 1000, end: 5000, color: '#35B779' },\\n            { start: 5000, end: 10000, color: '#24868E' },\\n            { start: 10000, end: 50000, color: '#3B528B' },\\n            { start: 50000, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={(d) => d[2]}\\n        yAccessor={(d) => d[0]}\\n        valueAccessor={(d) => d[3]}\\n        valueFormatter={(value) => value.toFixed(0.2)}\\n        xSortPredicate=\\\"alphaAsc\\\"\\n        xAxisTitle={showXAxisTitle ? 'Popular baby names' : undefined}\\n        yAxisTitle={showYAxisTitle ? 'Years' : undefined}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React, { useMemo } from 'react';\\n\\nimport { Chart, Heatmap, RecursivePartial, ScaleType, Settings, HeatmapStyle } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\nconst start = DateTime.fromISO('2021-03-27T20:00:00', { zone: 'UTC' });\\nconst end = DateTime.fromISO('2021-03-28T11:00:00', { zone: 'UTC' });\\nconst data = [...new Array(14)].flatMap((d, i) => {\\n  return [\\n    [start.plus({ hour: i }).toMillis(), 'cat A', rng(-5, 5)],\\n    [start.plus({ hour: i }).toMillis(), 'cat B', rng(-5, 5)],\\n    [start.plus({ hour: i }).toMillis(), 'cat C', rng(-5, 5)],\\n    [start.plus({ hour: i }).toMillis(), 'cat D', rng(-5, 5)],\\n    [start.plus({ hour: i }).toMillis(), 'cat E', rng(-5, 5)],\\n  ];\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const heatmap = useMemo(() => {\\n    const styles: RecursivePartial<HeatmapStyle> = {\\n      grid: {\\n        stroke: {\\n          width: 0.5,\\n          color: 'transparent',\\n        },\\n      },\\n      cell: {\\n        maxWidth: 'fill',\\n        maxHeight: 3,\\n        label: {\\n          visible: false,\\n        },\\n        border: {\\n          stroke: 'transparent',\\n          strokeWidth: 0,\\n        },\\n      },\\n      yAxisLabel: {\\n        visible: true,\\n        width: 'auto',\\n        padding: { left: 10, right: 10 },\\n      },\\n    };\\n\\n    return styles;\\n  }, []);\\n\\n  const startTimeOffset = number('start time offset', 0, {\\n    min: -1000 * 60 * 60 * 24,\\n    max: 1000 * 60 * 60 * 10,\\n    step: 1000,\\n    range: true,\\n  });\\n  const endTimeOffset = number('end time offset', 0, {\\n    min: -1000 * 60 * 60 * 10,\\n    max: 1000 * 60 * 60 * 24,\\n    step: 1000,\\n    range: true,\\n  });\\n\\n  return (\\n    <>\\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\\n        {DateTime.fromMillis(start.toMillis() + startTimeOffset).toISO()} to{' '}\\n        {DateTime.fromMillis(end.toMillis() + endTimeOffset).toISO()}\\n      </div>\\n      <Chart title={title} description={description} size={['100%', 180]} className=\\\"story-chart\\\">\\n        <Settings\\n          showLegend\\n          xDomain={{\\n            min: start.toMillis() + startTimeOffset,\\n            max: end.toMillis() + endTimeOffset,\\n          }}\\n          theme={{ heatmap }}\\n          baseTheme={useBaseTheme()}\\n        />\\n        <Heatmap\\n          id=\\\"heatmap1\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: [\\n              { color: '#ca0020', start: -5, end: -3 },\\n              { color: '#f4a582', start: -3, end: -1 },\\n              { color: '#cecece', start: -1, end: 1 },\\n              { color: '#92c5de', start: 1, end: 3 },\\n              { color: '#0571b0', start: 3, end: 5 },\\n            ],\\n            labelFormatter: (s, e) => `[${s}, ${e})`,\\n          }}\\n          data={data}\\n          xAccessor={(d) => d[0]}\\n          yAccessor={(d) => d[1]}\\n          valueAccessor={(d) => d[2]}\\n          valueFormatter={(d) => d.toFixed(2)}\\n          ySortPredicate=\\\"numAsc\\\"\\n          xAxisLabelFormatter={(value) => {\\n            return DateTime.fromMillis(value as number)\\n              .setZone('UTC')\\n              .toFormat('HH:mm:ss');\\n          }}\\n          timeZone=\\\"UTC\\\"\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: {\\n              type: 'fixed',\\n              unit: 'h',\\n              value: 1,\\n            },\\n          }}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React, { useMemo } from 'react';\n\nimport { Chart, Heatmap, RecursivePartial, ScaleType, Settings, HeatmapStyle } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\nconst start = DateTime.fromISO('2021-03-27T20:00:00', { zone: 'UTC' });\nconst end = DateTime.fromISO('2021-03-28T11:00:00', { zone: 'UTC' });\nconst data = [...new Array(14)].flatMap((d, i) => {\n  return [\n    [start.plus({ hour: i }).toMillis(), 'cat A', rng(-5, 5)],\n    [start.plus({ hour: i }).toMillis(), 'cat B', rng(-5, 5)],\n    [start.plus({ hour: i }).toMillis(), 'cat C', rng(-5, 5)],\n    [start.plus({ hour: i }).toMillis(), 'cat D', rng(-5, 5)],\n    [start.plus({ hour: i }).toMillis(), 'cat E', rng(-5, 5)],\n  ];\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const heatmap = useMemo(() => {\n    const styles: RecursivePartial<HeatmapStyle> = {\n      grid: {\n        stroke: {\n          width: 0.5,\n          color: 'transparent',\n        },\n      },\n      cell: {\n        maxWidth: 'fill',\n        maxHeight: 3,\n        label: {\n          visible: false,\n        },\n        border: {\n          stroke: 'transparent',\n          strokeWidth: 0,\n        },\n      },\n      yAxisLabel: {\n        visible: true,\n        width: 'auto',\n        padding: { left: 10, right: 10 },\n      },\n    };\n\n    return styles;\n  }, []);\n\n  const startTimeOffset = number('start time offset', 0, {\n    min: -1000 * 60 * 60 * 24,\n    max: 1000 * 60 * 60 * 10,\n    step: 1000,\n    range: true,\n  });\n  const endTimeOffset = number('end time offset', 0, {\n    min: -1000 * 60 * 60 * 10,\n    max: 1000 * 60 * 60 * 24,\n    step: 1000,\n    range: true,\n  });\n\n  return (\n    <>\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\n        {DateTime.fromMillis(start.toMillis() + startTimeOffset).toISO()} to{' '}\n        {DateTime.fromMillis(end.toMillis() + endTimeOffset).toISO()}\n      </div>\n      <Chart title={title} description={description} size={['100%', 180]} className=\"story-chart\">\n        <Settings\n          showLegend\n          xDomain={{\n            min: start.toMillis() + startTimeOffset,\n            max: end.toMillis() + endTimeOffset,\n          }}\n          theme={{ heatmap }}\n          baseTheme={useBaseTheme()}\n        />\n        <Heatmap\n          id=\"heatmap1\"\n          colorScale={{\n            type: 'bands',\n            bands: [\n              { color: '#ca0020', start: -5, end: -3 },\n              { color: '#f4a582', start: -3, end: -1 },\n              { color: '#cecece', start: -1, end: 1 },\n              { color: '#92c5de', start: 1, end: 3 },\n              { color: '#0571b0', start: 3, end: 5 },\n            ],\n            labelFormatter: (s, e) => `[${s}, ${e})`,\n          }}\n          data={data}\n          xAccessor={(d) => d[0]}\n          yAccessor={(d) => d[1]}\n          valueAccessor={(d) => d[2]}\n          valueFormatter={(d) => d.toFixed(2)}\n          ySortPredicate=\"numAsc\"\n          xAxisLabelFormatter={(value) => {\n            return DateTime.fromMillis(value as number)\n              .setZone('UTC')\n              .toFormat('HH:mm:ss');\n          }}\n          timeZone=\"UTC\"\n          xScale={{\n            type: ScaleType.Time,\n            interval: {\n              type: 'fixed',\n              unit: 'h',\n              value: 1,\n            },\n          }}\n        />\n      </Chart>\n    </>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const heatmap = useMemo(() => {\\n    const styles: RecursivePartial<HeatmapStyle> = {\\n      grid: {\\n        stroke: {\\n          width: 0.5,\\n          color: 'transparent',\\n        },\\n      },\\n      cell: {\\n        maxWidth: 'fill',\\n        maxHeight: 3,\\n        label: {\\n          visible: false,\\n        },\\n        border: {\\n          stroke: 'transparent',\\n          strokeWidth: 0,\\n        },\\n      },\\n      yAxisLabel: {\\n        visible: true,\\n        width: 'auto',\\n        padding: { left: 10, right: 10 },\\n      },\\n    };\\n\\n    return styles;\\n  }, []);\\n\\n  const startTimeOffset = number('start time offset', 0, {\\n    min: -1000 * 60 * 60 * 24,\\n    max: 1000 * 60 * 60 * 10,\\n    step: 1000,\\n    range: true,\\n  });\\n  const endTimeOffset = number('end time offset', 0, {\\n    min: -1000 * 60 * 60 * 10,\\n    max: 1000 * 60 * 60 * 24,\\n    step: 1000,\\n    range: true,\\n  });\\n\\n  return (\\n    <>\\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\\n        {DateTime.fromMillis(start.toMillis() + startTimeOffset).toISO()} to{' '}\\n        {DateTime.fromMillis(end.toMillis() + endTimeOffset).toISO()}\\n      </div>\\n      <Chart title={title} description={description} size={['100%', 180]} className=\\\"story-chart\\\">\\n        <Settings\\n          showLegend\\n          xDomain={{\\n            min: start.toMillis() + startTimeOffset,\\n            max: end.toMillis() + endTimeOffset,\\n          }}\\n          theme={{ heatmap }}\\n          baseTheme={useBaseTheme()}\\n        />\\n        <Heatmap\\n          id=\\\"heatmap1\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: [\\n              { color: '#ca0020', start: -5, end: -3 },\\n              { color: '#f4a582', start: -3, end: -1 },\\n              { color: '#cecece', start: -1, end: 1 },\\n              { color: '#92c5de', start: 1, end: 3 },\\n              { color: '#0571b0', start: 3, end: 5 },\\n            ],\\n            labelFormatter: (s, e) => `[${s}, ${e})`,\\n          }}\\n          data={data}\\n          xAccessor={(d) => d[0]}\\n          yAccessor={(d) => d[1]}\\n          valueAccessor={(d) => d[2]}\\n          valueFormatter={(d) => d.toFixed(2)}\\n          ySortPredicate=\\\"numAsc\\\"\\n          xAxisLabelFormatter={(value) => {\\n            return DateTime.fromMillis(value as number)\\n              .setZone('UTC')\\n              .toFormat('HH:mm:ss');\\n          }}\\n          timeZone=\\\"UTC\\\"\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: {\\n              type: 'fixed',\\n              unit: 'h',\\n              value: 1,\\n            },\\n          }}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport { extent } from 'd3-array';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Chart, Heatmap, PartialTheme, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ColorBand } from '../../../packages/charts/src/chart_types/heatmap/specs/heatmap';\\nimport {\\n  DATA_1,\\n  DATA_2,\\n  DATA_3,\\n  DATA_4,\\n  DATA_5,\\n  DATA_6,\\n  DATA_7,\\n  DATA_8,\\n  DATA_9,\\n} from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst datasets = [DATA_1, DATA_2, DATA_3, DATA_4, DATA_5, DATA_6, DATA_7, DATA_8, DATA_9];\\n\\nconst theme: PartialTheme = {\\n  heatmap: {\\n    grid: {\\n      stroke: {\\n        width: 1,\\n        color: 'black',\\n      },\\n    },\\n    cell: {\\n      maxWidth: 'fill',\\n      maxHeight: 3,\\n      label: {\\n        visible: true,\\n      },\\n      border: {\\n        stroke: 'transparent',\\n        strokeWidth: 0,\\n      },\\n    },\\n    yAxisLabel: {\\n      visible: true,\\n      width: 'auto',\\n      padding: { left: 10, right: 10 },\\n    },\\n    xAxisLabel: {\\n      padding: { top: 4, bottom: 4 },\\n    },\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const datasetIndex = select('dataset', [1, 2, 3, 4, 5, 6, 7, 8, 9], 1) - 1;\\n  const dataset = datasets[datasetIndex];\\n  const [min = 0, max = 0] = extent(dataset.data, (d) => d.value);\\n  const colors = ['#ca0020', '#f4a582', '#cecece', '#92c5de', '#0571b0'];\\n  const numOfColors = colors.length;\\n  const interval = (max - min) / numOfColors;\\n\\n  const colorBands = Array.from<unknown, ColorBand>({ length: numOfColors }, (d, i) => ({\\n    color: colors[i],\\n    start: Math.floor(min + i * interval),\\n    end: i === numOfColors - 1 ? Infinity : Math.ceil(min + (i + 1) * interval),\\n  }));\\n  const [tMin = 0, tMax = 0] = extent(dataset.data, (d) => d.x);\\n  return (\\n    <>\\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\\n        {DateTime.fromMillis(tMin).toISO()} to {DateTime.fromMillis(tMax).toISO()}{' '}\\n        {`${dataset.interval.type}: ${dataset.interval.value}${dataset.interval.unit} points:${dataset.data.length}`}\\n      </div>\\n      <Chart title={title} description={description} className=\\\"story-chart\\\">\\n        <Settings theme={theme} baseTheme={useBaseTheme()} xDomain={dataset.domain} />\\n        <Heatmap\\n          id=\\\"heatmap1\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: colorBands,\\n            labelFormatter: (s, e) => `[${s}, ${e})`,\\n          }}\\n          data={dataset.data}\\n          xAccessor=\\\"x\\\"\\n          yAccessor=\\\"y\\\"\\n          valueAccessor=\\\"value\\\"\\n          ySortPredicate=\\\"numAsc\\\"\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: dataset.interval,\\n          }}\\n          timeZone={dataset.timeZone ?? 'Europe/Rome'}\\n          xAxisLabelFormatter={dataset.xFormatter}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":63},\"endLoc\":{\"col\":1,\"line\":107},\"startBody\":{\"col\":36,\"line\":63},\"endBody\":{\"col\":1,\"line\":107}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport { extent } from 'd3-array';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Chart, Heatmap, PartialTheme, ScaleType, Settings } from '@elastic/charts';\n\nimport { ColorBand } from '../../../packages/charts/src/chart_types/heatmap/specs/heatmap';\nimport {\n  DATA_1,\n  DATA_2,\n  DATA_3,\n  DATA_4,\n  DATA_5,\n  DATA_6,\n  DATA_7,\n  DATA_8,\n  DATA_9,\n} from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst datasets = [DATA_1, DATA_2, DATA_3, DATA_4, DATA_5, DATA_6, DATA_7, DATA_8, DATA_9];\n\nconst theme: PartialTheme = {\n  heatmap: {\n    grid: {\n      stroke: {\n        width: 1,\n        color: 'black',\n      },\n    },\n    cell: {\n      maxWidth: 'fill',\n      maxHeight: 3,\n      label: {\n        visible: true,\n      },\n      border: {\n        stroke: 'transparent',\n        strokeWidth: 0,\n      },\n    },\n    yAxisLabel: {\n      visible: true,\n      width: 'auto',\n      padding: { left: 10, right: 10 },\n    },\n    xAxisLabel: {\n      padding: { top: 4, bottom: 4 },\n    },\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const datasetIndex = select('dataset', [1, 2, 3, 4, 5, 6, 7, 8, 9], 1) - 1;\n  const dataset = datasets[datasetIndex];\n  const [min = 0, max = 0] = extent(dataset.data, (d) => d.value);\n  const colors = ['#ca0020', '#f4a582', '#cecece', '#92c5de', '#0571b0'];\n  const numOfColors = colors.length;\n  const interval = (max - min) / numOfColors;\n\n  const colorBands = Array.from<unknown, ColorBand>({ length: numOfColors }, (d, i) => ({\n    color: colors[i],\n    start: Math.floor(min + i * interval),\n    end: i === numOfColors - 1 ? Infinity : Math.ceil(min + (i + 1) * interval),\n  }));\n  const [tMin = 0, tMax = 0] = extent(dataset.data, (d) => d.x);\n  return (\n    <>\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\n        {DateTime.fromMillis(tMin).toISO()} to {DateTime.fromMillis(tMax).toISO()}{' '}\n        {`${dataset.interval.type}: ${dataset.interval.value}${dataset.interval.unit} points:${dataset.data.length}`}\n      </div>\n      <Chart title={title} description={description} className=\"story-chart\">\n        <Settings theme={theme} baseTheme={useBaseTheme()} xDomain={dataset.domain} />\n        <Heatmap\n          id=\"heatmap1\"\n          colorScale={{\n            type: 'bands',\n            bands: colorBands,\n            labelFormatter: (s, e) => `[${s}, ${e})`,\n          }}\n          data={dataset.data}\n          xAccessor=\"x\"\n          yAccessor=\"y\"\n          valueAccessor=\"value\"\n          ySortPredicate=\"numAsc\"\n          xScale={{\n            type: ScaleType.Time,\n            interval: dataset.interval,\n          }}\n          timeZone={dataset.timeZone ?? 'Europe/Rome'}\n          xAxisLabelFormatter={dataset.xFormatter}\n        />\n      </Chart>\n    </>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const datasetIndex = select('dataset', [1, 2, 3, 4, 5, 6, 7, 8, 9], 1) - 1;\\n  const dataset = datasets[datasetIndex];\\n  const [min = 0, max = 0] = extent(dataset.data, (d) => d.value);\\n  const colors = ['#ca0020', '#f4a582', '#cecece', '#92c5de', '#0571b0'];\\n  const numOfColors = colors.length;\\n  const interval = (max - min) / numOfColors;\\n\\n  const colorBands = Array.from<unknown, ColorBand>({ length: numOfColors }, (d, i) => ({\\n    color: colors[i],\\n    start: Math.floor(min + i * interval),\\n    end: i === numOfColors - 1 ? Infinity : Math.ceil(min + (i + 1) * interval),\\n  }));\\n  const [tMin = 0, tMax = 0] = extent(dataset.data, (d) => d.x);\\n  return (\\n    <>\\n      <div style={{ fontFamily: 'monospace', fontSize: 10, paddingBottom: 5 }}>\\n        {DateTime.fromMillis(tMin).toISO()} to {DateTime.fromMillis(tMax).toISO()}{' '}\\n        {`${dataset.interval.type}: ${dataset.interval.value}${dataset.interval.unit} points:${dataset.data.length}`}\\n      </div>\\n      <Chart title={title} description={description} className=\\\"story-chart\\\">\\n        <Settings theme={theme} baseTheme={useBaseTheme()} xDomain={dataset.domain} />\\n        <Heatmap\\n          id=\\\"heatmap1\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: colorBands,\\n            labelFormatter: (s, e) => `[${s}, ${e})`,\\n          }}\\n          data={dataset.data}\\n          xAccessor=\\\"x\\\"\\n          yAccessor=\\\"y\\\"\\n          valueAccessor=\\\"value\\\"\\n          ySortPredicate=\\\"numAsc\\\"\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: dataset.interval,\\n          }}\\n          timeZone={dataset.timeZone ?? 'Europe/Rome'}\\n          xAxisLabelFormatter={dataset.xFormatter}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, select, color, number, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Heatmap,\\n  HeatmapStyle,\\n  niceTimeFormatter,\\n  RecursivePartial,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { DATA_6 } from '@elastic/charts/src/utils/data_samples/test_dataset_heatmap';\\n\\nimport { AxisStyle } from '../../../packages/charts/src/utils/themes/theme';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debugState = boolean('Enable debug state', true);\\n  const axes: RecursivePartial<AxisStyle> = {\\n    axisTitle: {\\n      fontSize: number('axisTitle fontSize', 12, { range: true, min: 5, max: 20 }, 'Axis Title'),\\n      fontFamily: 'sans-serif',\\n      fill: color('axisTitle textColor', 'black', 'Axis Title'),\\n      padding: {\\n        inner: number('axisTitle inner pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\\n        outer: number('axisTitle outer pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\\n      },\\n    },\\n  };\\n\\n  const yAxisLabelWidthType = select('yAxisLabel width type', ['auto', 'static', 'max'], 'auto', 'Theme');\\n  const yAxisLabelWidthSize = number('yAxisLabel width max/static', 100, { min: 0, max: 200, step: 1 }, 'Theme');\\n\\n  const heatmap: RecursivePartial<HeatmapStyle> = {\\n    brushArea: {\\n      visible: boolean('brushArea visible', true, 'Theme'),\\n      fill: color('brushArea fill', 'black', 'Theme'),\\n      stroke: color('brushArea stroke', '#69707D', 'Theme'),\\n      strokeWidth: number('brushArea strokeWidth', 2, { range: true, min: 1, max: 10 }, 'Theme'),\\n    },\\n    brushMask: {\\n      visible: boolean('brushMask visible', true, 'Theme'),\\n      fill: color('brushMask fill', 'rgb(115 115 115 / 50%)', 'Theme'),\\n    },\\n    brushTool: {\\n      visible: boolean('brushTool visible', false, 'Theme'),\\n      fill: color('brushTool fill color', 'gray', 'Theme'),\\n    },\\n    xAxisLabel: {\\n      visible: boolean('xAxisLabel visible', true, 'Theme'),\\n      fontSize: number('xAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\\n      textColor: color('xAxisLabel textColor', 'black', 'Theme'),\\n      padding: number('xAxisLabel padding', 6, { range: true, min: 0, max: 15 }, 'Theme'),\\n    },\\n    yAxisLabel: {\\n      visible: boolean('yAxisLabel visible', true, 'Theme'),\\n      fontSize: number('yAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\\n      textColor: color('yAxisLabel textColor', 'black', 'Theme'),\\n      padding: number('yAxisLabel padding', 5, { range: true, min: 0, max: 15 }, 'Theme'),\\n      width:\\n        yAxisLabelWidthType === 'static'\\n          ? yAxisLabelWidthSize\\n          : yAxisLabelWidthType === 'max'\\n            ? { max: yAxisLabelWidthSize }\\n            : 'auto',\\n    },\\n    grid: {\\n      stroke: {\\n        color: color('grid stroke color', 'gray', 'Theme'),\\n        width: number('grid stroke width', 1, { range: true, min: 0, max: 10, step: 1 }, 'Theme'),\\n      },\\n    },\\n    cell: {\\n      label: {\\n        visible: boolean('cell label visible', false, 'Theme'),\\n        textColor: color('cell label textColor', 'black', 'Theme'),\\n        useGlobalMinFontSize: boolean('cell label use global min fontSize', true, 'Theme'),\\n        minFontSize: number('cell label min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'Theme'),\\n        maxFontSize: number('cell label max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'Theme'),\\n      },\\n      border: {\\n        strokeWidth: number('border strokeWidth', 0, { range: true, min: 0, max: 5 }, 'Theme'),\\n        stroke: color('border stroke color', 'gray', 'Theme'),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        onBrushEnd={action('onBrushEnd')}\\n        brushAxis=\\\"both\\\"\\n        xDomain={{ min: 1572868800000, max: 1572912000000, minInterval: 1800000 }}\\n        debugState={debugState}\\n        theme={{ axes, heatmap }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\\n            { start: 3.5, end: 25, color: '#8bc8fb' },\\n            { start: 25, end: 50, color: '#fdec25' },\\n            { start: 50, end: 75, color: '#fba740' },\\n            { start: 75, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={DATA_6.data}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\\n        xAxisLabelFormatter={(value) => {\\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\\n        }}\\n        xAxisTitle={text('xAxisTitle', 'xAxis', 'Axis Title')}\\n        yAxisTitle={text('yAxisTitle', 'yAxis', 'Axis Title')}\\n        timeZone={DATA_6.timeZone}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `\\n> __Warning:__ ⚠️ default \\\\`Theme\\\\` styles are overrided by knob controls. Toggling between themes may show incorrect styles.\\n  `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":141},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":141}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, select, color, number, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Heatmap,\n  HeatmapStyle,\n  niceTimeFormatter,\n  RecursivePartial,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { DATA_6 } from '@elastic/charts/src/utils/data_samples/test_dataset_heatmap';\n\nimport { AxisStyle } from '../../../packages/charts/src/utils/themes/theme';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debugState = boolean('Enable debug state', true);\n  const axes: RecursivePartial<AxisStyle> = {\n    axisTitle: {\n      fontSize: number('axisTitle fontSize', 12, { range: true, min: 5, max: 20 }, 'Axis Title'),\n      fontFamily: 'sans-serif',\n      fill: color('axisTitle textColor', 'black', 'Axis Title'),\n      padding: {\n        inner: number('axisTitle inner pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\n        outer: number('axisTitle outer pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\n      },\n    },\n  };\n\n  const yAxisLabelWidthType = select('yAxisLabel width type', ['auto', 'static', 'max'], 'auto', 'Theme');\n  const yAxisLabelWidthSize = number('yAxisLabel width max/static', 100, { min: 0, max: 200, step: 1 }, 'Theme');\n\n  const heatmap: RecursivePartial<HeatmapStyle> = {\n    brushArea: {\n      visible: boolean('brushArea visible', true, 'Theme'),\n      fill: color('brushArea fill', 'black', 'Theme'),\n      stroke: color('brushArea stroke', '#69707D', 'Theme'),\n      strokeWidth: number('brushArea strokeWidth', 2, { range: true, min: 1, max: 10 }, 'Theme'),\n    },\n    brushMask: {\n      visible: boolean('brushMask visible', true, 'Theme'),\n      fill: color('brushMask fill', 'rgb(115 115 115 / 50%)', 'Theme'),\n    },\n    brushTool: {\n      visible: boolean('brushTool visible', false, 'Theme'),\n      fill: color('brushTool fill color', 'gray', 'Theme'),\n    },\n    xAxisLabel: {\n      visible: boolean('xAxisLabel visible', true, 'Theme'),\n      fontSize: number('xAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\n      textColor: color('xAxisLabel textColor', 'black', 'Theme'),\n      padding: number('xAxisLabel padding', 6, { range: true, min: 0, max: 15 }, 'Theme'),\n    },\n    yAxisLabel: {\n      visible: boolean('yAxisLabel visible', true, 'Theme'),\n      fontSize: number('yAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\n      textColor: color('yAxisLabel textColor', 'black', 'Theme'),\n      padding: number('yAxisLabel padding', 5, { range: true, min: 0, max: 15 }, 'Theme'),\n      width:\n        yAxisLabelWidthType === 'static'\n          ? yAxisLabelWidthSize\n          : yAxisLabelWidthType === 'max'\n            ? { max: yAxisLabelWidthSize }\n            : 'auto',\n    },\n    grid: {\n      stroke: {\n        color: color('grid stroke color', 'gray', 'Theme'),\n        width: number('grid stroke width', 1, { range: true, min: 0, max: 10, step: 1 }, 'Theme'),\n      },\n    },\n    cell: {\n      label: {\n        visible: boolean('cell label visible', false, 'Theme'),\n        textColor: color('cell label textColor', 'black', 'Theme'),\n        useGlobalMinFontSize: boolean('cell label use global min fontSize', true, 'Theme'),\n        minFontSize: number('cell label min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'Theme'),\n        maxFontSize: number('cell label max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'Theme'),\n      },\n      border: {\n        strokeWidth: number('border strokeWidth', 0, { range: true, min: 0, max: 5 }, 'Theme'),\n        stroke: color('border stroke color', 'gray', 'Theme'),\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onRenderChange={getDebugStateLogger(debugState)}\n        showLegend\n        legendPosition=\"right\"\n        onBrushEnd={action('onBrushEnd')}\n        brushAxis=\"both\"\n        xDomain={{ min: 1572868800000, max: 1572912000000, minInterval: 1800000 }}\n        debugState={debugState}\n        theme={{ axes, heatmap }}\n        baseTheme={useBaseTheme()}\n      />\n      <Heatmap\n        id=\"heatmap1\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\n            { start: 3.5, end: 25, color: '#8bc8fb' },\n            { start: 25, end: 50, color: '#fdec25' },\n            { start: 50, end: 75, color: '#fba740' },\n            { start: 75, end: Infinity, color: '#fe5050' },\n          ],\n        }}\n        data={DATA_6.data}\n        xAccessor=\"x\"\n        yAccessor=\"y\"\n        valueAccessor=\"value\"\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\n        ySortPredicate=\"numAsc\"\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\n        xAxisLabelFormatter={(value) => {\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\n        }}\n        xAxisTitle={text('xAxisTitle', 'xAxis', 'Axis Title')}\n        yAxisTitle={text('yAxisTitle', 'yAxis', 'Axis Title')}\n        timeZone={DATA_6.timeZone}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `\n> __Warning:__ ⚠️ default \\`Theme\\` styles are overrided by knob controls. Toggling between themes may show incorrect styles.\n  `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debugState = boolean('Enable debug state', true);\\n  const axes: RecursivePartial<AxisStyle> = {\\n    axisTitle: {\\n      fontSize: number('axisTitle fontSize', 12, { range: true, min: 5, max: 20 }, 'Axis Title'),\\n      fontFamily: 'sans-serif',\\n      fill: color('axisTitle textColor', 'black', 'Axis Title'),\\n      padding: {\\n        inner: number('axisTitle inner pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\\n        outer: number('axisTitle outer pad', 8, { range: true, min: 0, max: 20 }, 'Axis Title'),\\n      },\\n    },\\n  };\\n\\n  const yAxisLabelWidthType = select('yAxisLabel width type', ['auto', 'static', 'max'], 'auto', 'Theme');\\n  const yAxisLabelWidthSize = number('yAxisLabel width max/static', 100, { min: 0, max: 200, step: 1 }, 'Theme');\\n\\n  const heatmap: RecursivePartial<HeatmapStyle> = {\\n    brushArea: {\\n      visible: boolean('brushArea visible', true, 'Theme'),\\n      fill: color('brushArea fill', 'black', 'Theme'),\\n      stroke: color('brushArea stroke', '#69707D', 'Theme'),\\n      strokeWidth: number('brushArea strokeWidth', 2, { range: true, min: 1, max: 10 }, 'Theme'),\\n    },\\n    brushMask: {\\n      visible: boolean('brushMask visible', true, 'Theme'),\\n      fill: color('brushMask fill', 'rgb(115 115 115 / 50%)', 'Theme'),\\n    },\\n    brushTool: {\\n      visible: boolean('brushTool visible', false, 'Theme'),\\n      fill: color('brushTool fill color', 'gray', 'Theme'),\\n    },\\n    xAxisLabel: {\\n      visible: boolean('xAxisLabel visible', true, 'Theme'),\\n      fontSize: number('xAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\\n      textColor: color('xAxisLabel textColor', 'black', 'Theme'),\\n      padding: number('xAxisLabel padding', 6, { range: true, min: 0, max: 15 }, 'Theme'),\\n    },\\n    yAxisLabel: {\\n      visible: boolean('yAxisLabel visible', true, 'Theme'),\\n      fontSize: number('yAxisLabel fontSize', 12, { range: true, min: 5, max: 20 }, 'Theme'),\\n      textColor: color('yAxisLabel textColor', 'black', 'Theme'),\\n      padding: number('yAxisLabel padding', 5, { range: true, min: 0, max: 15 }, 'Theme'),\\n      width:\\n        yAxisLabelWidthType === 'static'\\n          ? yAxisLabelWidthSize\\n          : yAxisLabelWidthType === 'max'\\n            ? { max: yAxisLabelWidthSize }\\n            : 'auto',\\n    },\\n    grid: {\\n      stroke: {\\n        color: color('grid stroke color', 'gray', 'Theme'),\\n        width: number('grid stroke width', 1, { range: true, min: 0, max: 10, step: 1 }, 'Theme'),\\n      },\\n    },\\n    cell: {\\n      label: {\\n        visible: boolean('cell label visible', false, 'Theme'),\\n        textColor: color('cell label textColor', 'black', 'Theme'),\\n        useGlobalMinFontSize: boolean('cell label use global min fontSize', true, 'Theme'),\\n        minFontSize: number('cell label min fontSize', 6, { step: 1, min: 4, max: 10, range: true }, 'Theme'),\\n        maxFontSize: number('cell label max fontSize', 12, { step: 1, min: 10, max: 64, range: true }, 'Theme'),\\n      },\\n      border: {\\n        strokeWidth: number('border strokeWidth', 0, { range: true, min: 0, max: 5 }, 'Theme'),\\n        stroke: color('border stroke color', 'gray', 'Theme'),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        showLegend\\n        legendPosition=\\\"right\\\"\\n        onBrushEnd={action('onBrushEnd')}\\n        brushAxis=\\\"both\\\"\\n        xDomain={{ min: 1572868800000, max: 1572912000000, minInterval: 1800000 }}\\n        debugState={debugState}\\n        theme={{ axes, heatmap }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 3.5, color: '#d2e9f7' },\\n            { start: 3.5, end: 25, color: '#8bc8fb' },\\n            { start: 25, end: 50, color: '#fdec25' },\\n            { start: 50, end: 75, color: '#fba740' },\\n            { start: 75, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={DATA_6.data}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}℃`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={{ type: ScaleType.Time, interval: DATA_6.interval }}\\n        xAxisLabelFormatter={(value) => {\\n          return niceTimeFormatter([1572825600000, 1572912000000])(value, { timeZone: 'UTC' });\\n        }}\\n        xAxisTitle={text('xAxisTitle', 'xAxis', 'Axis Title')}\\n        yAxisTitle={text('yAxisTitle', 'yAxis', 'Axis Title')}\\n        timeZone={DATA_6.timeZone}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Heatmap, HeatmapStyle, RecursivePartial, Settings } from '@elastic/charts';\\n\\nimport { ScaleType } from '../../../packages/charts/src/scales/constants';\\nimport { DATA_1, ECOMMERCE_DATA } from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const yAxisAutoWidth = boolean('Y-axis auto width', true);\\n  const yAxisWidth = number('Y-axis width', 50, { range: true, min: 0, max: 100 });\\n  const heatmap: RecursivePartial<HeatmapStyle> = {\\n    xAxisLabel: {\\n      visible: boolean('X-Axis visible', true),\\n      fontSize: number('X-Axis label fontSize', 12, { range: true, min: 5, max: 20 }),\\n      padding: number('X-Axis label padding', 6, { range: true, min: 0, max: 15 }),\\n      rotation: number('X-Axis label rotation', 0, { step: 1, min: 0, max: 90, range: true }),\\n    },\\n    yAxisLabel: {\\n      width: yAxisAutoWidth ? 'auto' : yAxisWidth,\\n    },\\n  };\\n  const useCategoricalDataset = boolean('Use categorical data', false);\\n  const dataset = useCategoricalDataset ? ECOMMERCE_DATA : DATA_1.data;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        showLegend={boolean('Show legend', false)}\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        theme={{ heatmap }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Heatmap<{ x: number | string; y: string; value: number }>\\n        id=\\\"heatmap2\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 100, color: '#AADC32' },\\n            { start: 100, end: 200, color: '#35B779' },\\n            { start: 200, end: 300, color: '#24868E' },\\n            { start: 300, end: 400, color: '#3B528B' },\\n            { start: 400, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        xScale={\\n          useCategoricalDataset\\n            ? {\\n                type: ScaleType.Ordinal,\\n              }\\n            : {\\n                type: ScaleType.Time,\\n                interval: DATA_1.interval,\\n              }\\n        }\\n        data={dataset}\\n        timeZone={DATA_1.timeZone}\\n        xAxisLabelFormatter={useCategoricalDataset ? (d) => `${d}` : DATA_1.xFormatter}\\n        xAccessor={(d) => d.x}\\n        yAccessor={(d) => d.y}\\n        valueAccessor={(d) => d.value}\\n        valueFormatter={(value) => (Number.isFinite(value) ? value.toFixed(0.2) : '')}\\n        xSortPredicate=\\\"dataIndex\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":79},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":79}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Heatmap, HeatmapStyle, RecursivePartial, Settings } from '@elastic/charts';\n\nimport { ScaleType } from '../../../packages/charts/src/scales/constants';\nimport { DATA_1, ECOMMERCE_DATA } from '../../../packages/charts/src/utils/data_samples/test_dataset_heatmap';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const yAxisAutoWidth = boolean('Y-axis auto width', true);\n  const yAxisWidth = number('Y-axis width', 50, { range: true, min: 0, max: 100 });\n  const heatmap: RecursivePartial<HeatmapStyle> = {\n    xAxisLabel: {\n      visible: boolean('X-Axis visible', true),\n      fontSize: number('X-Axis label fontSize', 12, { range: true, min: 5, max: 20 }),\n      padding: number('X-Axis label padding', 6, { range: true, min: 0, max: 15 }),\n      rotation: number('X-Axis label rotation', 0, { step: 1, min: 0, max: 90, range: true }),\n    },\n    yAxisLabel: {\n      width: yAxisAutoWidth ? 'auto' : yAxisWidth,\n    },\n  };\n  const useCategoricalDataset = boolean('Use categorical data', false);\n  const dataset = useCategoricalDataset ? ECOMMERCE_DATA : DATA_1.data;\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        onElementClick={action('onElementClick')}\n        showLegend={boolean('Show legend', false)}\n        legendPosition=\"right\"\n        brushAxis=\"both\"\n        theme={{ heatmap }}\n        baseTheme={useBaseTheme()}\n      />\n      <Heatmap<{ x: number | string; y: string; value: number }>\n        id=\"heatmap2\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 100, color: '#AADC32' },\n            { start: 100, end: 200, color: '#35B779' },\n            { start: 200, end: 300, color: '#24868E' },\n            { start: 300, end: 400, color: '#3B528B' },\n            { start: 400, end: Infinity, color: '#471164' },\n          ],\n        }}\n        xScale={\n          useCategoricalDataset\n            ? {\n                type: ScaleType.Ordinal,\n              }\n            : {\n                type: ScaleType.Time,\n                interval: DATA_1.interval,\n              }\n        }\n        data={dataset}\n        timeZone={DATA_1.timeZone}\n        xAxisLabelFormatter={useCategoricalDataset ? (d) => `${d}` : DATA_1.xFormatter}\n        xAccessor={(d) => d.x}\n        yAccessor={(d) => d.y}\n        valueAccessor={(d) => d.value}\n        valueFormatter={(value) => (Number.isFinite(value) ? value.toFixed(0.2) : '')}\n        xSortPredicate=\"dataIndex\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const yAxisAutoWidth = boolean('Y-axis auto width', true);\\n  const yAxisWidth = number('Y-axis width', 50, { range: true, min: 0, max: 100 });\\n  const heatmap: RecursivePartial<HeatmapStyle> = {\\n    xAxisLabel: {\\n      visible: boolean('X-Axis visible', true),\\n      fontSize: number('X-Axis label fontSize', 12, { range: true, min: 5, max: 20 }),\\n      padding: number('X-Axis label padding', 6, { range: true, min: 0, max: 15 }),\\n      rotation: number('X-Axis label rotation', 0, { step: 1, min: 0, max: 90, range: true }),\\n    },\\n    yAxisLabel: {\\n      width: yAxisAutoWidth ? 'auto' : yAxisWidth,\\n    },\\n  };\\n  const useCategoricalDataset = boolean('Use categorical data', false);\\n  const dataset = useCategoricalDataset ? ECOMMERCE_DATA : DATA_1.data;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        onElementClick={action('onElementClick')}\\n        showLegend={boolean('Show legend', false)}\\n        legendPosition=\\\"right\\\"\\n        brushAxis=\\\"both\\\"\\n        theme={{ heatmap }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Heatmap<{ x: number | string; y: string; value: number }>\\n        id=\\\"heatmap2\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 100, color: '#AADC32' },\\n            { start: 100, end: 200, color: '#35B779' },\\n            { start: 200, end: 300, color: '#24868E' },\\n            { start: 300, end: 400, color: '#3B528B' },\\n            { start: 400, end: Infinity, color: '#471164' },\\n          ],\\n        }}\\n        xScale={\\n          useCategoricalDataset\\n            ? {\\n                type: ScaleType.Ordinal,\\n              }\\n            : {\\n                type: ScaleType.Time,\\n                interval: DATA_1.interval,\\n              }\\n        }\\n        data={dataset}\\n        timeZone={DATA_1.timeZone}\\n        xAxisLabelFormatter={useCategoricalDataset ? (d) => `${d}` : DATA_1.xFormatter}\\n        xAccessor={(d) => d.x}\\n        yAccessor={(d) => d.y}\\n        valueAccessor={(d) => d.value}\\n        valueFormatter={(value) => (Number.isFinite(value) ? value.toFixed(0.2) : '')}\\n        xSortPredicate=\\\"dataIndex\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Heatmap, Predicate, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const keepNull = boolean('Fill gaps with nulls', true);\\n  const onlyNulls = boolean('Fill everything with nulls', false);\\n  const xSort = customKnobs.fromEnum('X sorting predicate', Predicate, Predicate.DataIndex);\\n  const ySort = customKnobs.fromEnum('Y sorting predicate', Predicate, Predicate.DataIndex);\\n  return (\\n    <Chart title={title} description={description} size={[200, 200]}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        onPointerUpdate={action('onPointerUpdate')}\\n        pointerUpdateTrigger=\\\"both\\\"\\n        theme={{\\n          heatmap: {\\n            cell: {\\n              border: {\\n                strokeWidth: 0.001,\\n                stroke: 'transparent',\\n              },\\n            },\\n          },\\n        }}\\n      />\\n      <Heatmap\\n        id=\\\"sortedHeatmap\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: 0, end: 10, color: '#d2e9f7' },\\n            { start: 10, end: 20, color: '#8bc8fb' },\\n            { start: 20, end: 30, color: '#fdec25' },\\n            { start: 30, end: 40, color: '#fba740' },\\n            { start: 40, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={[\\n          { x: 'A', y: '1', value: null },\\n          { x: 'A', y: '2', value: 15 },\\n          { x: 'A', y: '3', value: 22 },\\n          { x: 'B', y: '1', value: null },\\n          { x: 'B', y: '2', value: null },\\n          { x: 'B', y: '3', value: 32 },\\n          { x: 'C', y: '1', value: 23 },\\n          { x: 'C', y: '2', value: 35 },\\n          { x: 'C', y: '3', value: 50 },\\n        ]\\n          .filter((d) => (keepNull ? true : d.value !== null))\\n          .map((d) => (onlyNulls ? { ...d, value: null } : d))}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\\n        ySortPredicate={ySort}\\n        xSortPredicate={xSort}\\n        xScale={{ type: ScaleType.Ordinal }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":76},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":76}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Heatmap, Predicate, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const keepNull = boolean('Fill gaps with nulls', true);\n  const onlyNulls = boolean('Fill everything with nulls', false);\n  const xSort = customKnobs.fromEnum('X sorting predicate', Predicate, Predicate.DataIndex);\n  const ySort = customKnobs.fromEnum('Y sorting predicate', Predicate, Predicate.DataIndex);\n  return (\n    <Chart title={title} description={description} size={[200, 200]}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        onPointerUpdate={action('onPointerUpdate')}\n        pointerUpdateTrigger=\"both\"\n        theme={{\n          heatmap: {\n            cell: {\n              border: {\n                strokeWidth: 0.001,\n                stroke: 'transparent',\n              },\n            },\n          },\n        }}\n      />\n      <Heatmap\n        id=\"sortedHeatmap\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: 0, end: 10, color: '#d2e9f7' },\n            { start: 10, end: 20, color: '#8bc8fb' },\n            { start: 20, end: 30, color: '#fdec25' },\n            { start: 30, end: 40, color: '#fba740' },\n            { start: 40, end: Infinity, color: '#fe5050' },\n          ],\n        }}\n        data={[\n          { x: 'A', y: '1', value: null },\n          { x: 'A', y: '2', value: 15 },\n          { x: 'A', y: '3', value: 22 },\n          { x: 'B', y: '1', value: null },\n          { x: 'B', y: '2', value: null },\n          { x: 'B', y: '3', value: 32 },\n          { x: 'C', y: '1', value: 23 },\n          { x: 'C', y: '2', value: 35 },\n          { x: 'C', y: '3', value: 50 },\n        ]\n          .filter((d) => (keepNull ? true : d.value !== null))\n          .map((d) => (onlyNulls ? { ...d, value: null } : d))}\n        xAccessor=\"x\"\n        yAccessor=\"y\"\n        valueAccessor=\"value\"\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\n        ySortPredicate={ySort}\n        xSortPredicate={xSort}\n        xScale={{ type: ScaleType.Ordinal }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const keepNull = boolean('Fill gaps with nulls', true);\\n  const onlyNulls = boolean('Fill everything with nulls', false);\\n  const xSort = customKnobs.fromEnum('X sorting predicate', Predicate, Predicate.DataIndex);\\n  const ySort = customKnobs.fromEnum('Y sorting predicate', Predicate, Predicate.DataIndex);\\n  return (\\n    <Chart title={title} description={description} size={[200, 200]}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        onPointerUpdate={action('onPointerUpdate')}\\n        pointerUpdateTrigger=\\\"both\\\"\\n        theme={{\\n          heatmap: {\\n            cell: {\\n              border: {\\n                strokeWidth: 0.001,\\n                stroke: 'transparent',\\n              },\\n            },\\n          },\\n        }}\\n      />\\n      <Heatmap\\n        id=\\\"sortedHeatmap\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: 0, end: 10, color: '#d2e9f7' },\\n            { start: 10, end: 20, color: '#8bc8fb' },\\n            { start: 20, end: 30, color: '#fdec25' },\\n            { start: 30, end: 40, color: '#fba740' },\\n            { start: 40, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={[\\n          { x: 'A', y: '1', value: null },\\n          { x: 'A', y: '2', value: 15 },\\n          { x: 'A', y: '3', value: 22 },\\n          { x: 'B', y: '1', value: null },\\n          { x: 'B', y: '2', value: null },\\n          { x: 'B', y: '3', value: 32 },\\n          { x: 'C', y: '1', value: 23 },\\n          { x: 'C', y: '2', value: 35 },\\n          { x: 'C', y: '3', value: 50 },\\n        ]\\n          .filter((d) => (keepNull ? true : d.value !== null))\\n          .map((d) => (onlyNulls ? { ...d, value: null } : d))}\\n        xAccessor=\\\"x\\\"\\n        yAccessor=\\\"y\\\"\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\\n        ySortPredicate={ySort}\\n        xSortPredicate={xSort}\\n        xScale={{ type: ScaleType.Ordinal }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Heatmap (@alpha)',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as time } from './3_time.story';\nexport { Example as categorical } from './2_categorical.story';\nexport { Example as timeSnap } from './4_test_time_snap.story';\nexport { Example as theming } from './5_theming.story';\nexport { Example as labelRotation } from './6_label_rotation.story';\nexport { Example as sorting } from './7_sorting.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getFlatData, getLayerSpec, maxDepth } from '../utils/hierarchical_input_utils';\\nimport { viridis18 as palette } from '../utils/utils';\\n\\nconst color = palette.slice().reverse();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend\\n        legendMaxDepth={maxDepth}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            minFontSize: 6,\\n            maxFontSize: 10,\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        layout={PartitionLayout.icicle}\\n        data={getFlatData()}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec(color)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getFlatData, getLayerSpec, maxDepth } from '../utils/hierarchical_input_utils';\nimport { viridis18 as palette } from '../utils/utils';\n\nconst color = palette.slice().reverse();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        flatLegend\n        legendMaxDepth={maxDepth}\n        baseTheme={useBaseTheme()}\n        theme={{\n          partition: {\n            minFontSize: 6,\n            maxFontSize: 10,\n          },\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        layout={PartitionLayout.icicle}\n        data={getFlatData()}\n        valueAccessor={(d: Datum) => d.value as number}\n        valueFormatter={() => ''}\n        layers={getLayerSpec(color)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend\\n        legendMaxDepth={maxDepth}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            minFontSize: 6,\\n            maxFontSize: 10,\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        layout={PartitionLayout.icicle}\\n        data={getFlatData()}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec(color)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, LegendStrategy, Partition, PartitionLayout, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getFlatData, getLayerSpec, maxDepth } from '../utils/hierarchical_input_utils';\\nimport { plasma18 as palette } from '../utils/utils';\\n\\nconst color = [...palette].reverse();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend\\n        legendPosition=\\\"right\\\"\\n        legendStrategy={LegendStrategy.PathWithDescendants}\\n        legendMaxDepth={maxDepth}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            minFontSize: 6,\\n            maxFontSize: 10,\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={getFlatData()}\\n        layout={PartitionLayout.flame}\\n        valueAccessor={(d: Datum) => d.value}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec(color)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, LegendStrategy, Partition, PartitionLayout, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getFlatData, getLayerSpec, maxDepth } from '../utils/hierarchical_input_utils';\nimport { plasma18 as palette } from '../utils/utils';\n\nconst color = [...palette].reverse();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        flatLegend\n        legendPosition=\"right\"\n        legendStrategy={LegendStrategy.PathWithDescendants}\n        legendMaxDepth={maxDepth}\n        baseTheme={useBaseTheme()}\n        theme={{\n          partition: {\n            minFontSize: 6,\n            maxFontSize: 10,\n          },\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={getFlatData()}\n        layout={PartitionLayout.flame}\n        valueAccessor={(d: Datum) => d.value}\n        valueFormatter={() => ''}\n        layers={getLayerSpec(color)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend\\n        legendPosition=\\\"right\\\"\\n        legendStrategy={LegendStrategy.PathWithDescendants}\\n        legendMaxDepth={maxDepth}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            minFontSize: 6,\\n            maxFontSize: 10,\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={getFlatData()}\\n        layout={PartitionLayout.flame}\\n        valueAccessor={(d: Datum) => d.value}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec(color)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, PrimitiveValue, Settings, PartialTheme } from '@elastic/charts';\\nimport data from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock.json';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { discreteColor, viridis18 as palette } from '../utils/utils';\\n\\nconst color = palette.slice().reverse();\\n\\nconst getLayerSpec = (maxDepth: number = 30) =>\\n  [...new Array(maxDepth + 1)].map((_, depth) => ({\\n    groupByRollup: (d: Datum) => data.dictionary[d.layers[depth]],\\n    nodeLabel: (d: PrimitiveValue) => `${String(d)}/`,\\n    showAccessor: (d: PrimitiveValue) => d !== undefined,\\n    shape: {\\n      fillColor: () => discreteColor(color, 0.8)(depth),\\n    },\\n  }));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const clipText = boolean(\\\"Allow, and clip, texts that wouldn't otherwise fit\\\", true);\\n  const theme: PartialTheme = {\\n    partition: {\\n      fillLabel: {\\n        clipText,\\n        padding: 0,\\n      },\\n      minFontSize: clipText ? 9 : 6,\\n      maxFontSize: clipText ? 9 : 20,\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} {...onElementListeners} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data.facts}\\n        layout={PartitionLayout.icicle}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec()}\\n        drilldown\\n        maxRowCount={1}\\n        animation={{\\n          duration: 500,\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":67},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":67}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, PrimitiveValue, Settings, PartialTheme } from '@elastic/charts';\nimport data from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock.json';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { discreteColor, viridis18 as palette } from '../utils/utils';\n\nconst color = palette.slice().reverse();\n\nconst getLayerSpec = (maxDepth: number = 30) =>\n  [...new Array(maxDepth + 1)].map((_, depth) => ({\n    groupByRollup: (d: Datum) => data.dictionary[d.layers[depth]],\n    nodeLabel: (d: PrimitiveValue) => `${String(d)}/`,\n    showAccessor: (d: PrimitiveValue) => d !== undefined,\n    shape: {\n      fillColor: () => discreteColor(color, 0.8)(depth),\n    },\n  }));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const clipText = boolean(\"Allow, and clip, texts that wouldn't otherwise fit\", true);\n  const theme: PartialTheme = {\n    partition: {\n      fillLabel: {\n        clipText,\n        padding: 0,\n      },\n      minFontSize: clipText ? 9 : 6,\n      maxFontSize: clipText ? 9 : 20,\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} {...onElementListeners} />\n      <Partition\n        id=\"spec_1\"\n        data={data.facts}\n        layout={PartitionLayout.icicle}\n        valueAccessor={(d: Datum) => d.value as number}\n        valueFormatter={() => ''}\n        layers={getLayerSpec()}\n        drilldown\n        maxRowCount={1}\n        animation={{\n          duration: 500,\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const clipText = boolean(\\\"Allow, and clip, texts that wouldn't otherwise fit\\\", true);\\n  const theme: PartialTheme = {\\n    partition: {\\n      fillLabel: {\\n        clipText,\\n        padding: 0,\\n      },\\n      minFontSize: clipText ? 9 : 6,\\n      maxFontSize: clipText ? 9 : 20,\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} {...onElementListeners} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data.facts}\\n        layout={PartitionLayout.icicle}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={() => ''}\\n        layers={getLayerSpec()}\\n        drilldown\\n        maxRowCount={1}\\n        animation={{\\n          duration: 500,\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, button, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Flame,\\n  Settings,\\n  FlameGlobalControl,\\n  FlameNodeControl,\\n  ColumnarViewModel,\\n} from '@elastic/charts';\\nimport columnarMock from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock_columnar.json';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nconst paletteColorBrewerCat12 = [\\n  [141, 211, 199],\\n  [255, 255, 179],\\n  [190, 186, 218],\\n  [251, 128, 114],\\n  [128, 177, 211],\\n  [253, 180, 98],\\n  [179, 222, 105],\\n  [252, 205, 229],\\n  [217, 217, 217],\\n  [188, 128, 189],\\n  [204, 235, 197],\\n  [255, 237, 111],\\n];\\n\\nconst position = new Float32Array(columnarMock.position);\\nconst size = new Float32Array(columnarMock.size);\\n\\nconst columnarData: ColumnarViewModel = {\\n  label: columnarMock.label.map((index: number) => columnarMock.dictionary[index]), // reversing the dictionary encoding\\n  value: new Float64Array(columnarMock.value),\\n  // color: new Float32Array((columnarMock.color.match(/.{2}/g) ?? []).map((hex: string) => Number.parseInt(hex, 16) / 255)),\\n  color: new Float32Array(\\n    columnarMock.label.flatMap(() => [...paletteColorBrewerCat12[rng(0, 11)].map((c) => c / 255), 1]),\\n  ),\\n  position0: position, //position.map((p, i) => (i % 2 === 0 ? 1 - p - size[i / 2] : p)), //.map((p, i) => (i % 2 === 0 ? 1 - p - size[i / 2] : p)), // new Float32Array([...position].slice(1)), // try with the wrong array length\\n  position1: position,\\n  size0: size, //size.map((s) => 0.8 * s),\\n  size1: size,\\n};\\n\\nconst noop = () => {};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\\n\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  button('Reset focus', () => {\\n    resetFocusControl();\\n  });\\n  button('Set focus on random node', () => {\\n    focusOnNodeControl(rng(0, 19));\\n  });\\n  const textSearch = text('Text to search', '');\\n  const textChangeAction = action('Text change');\\n\\n  const debug = boolean('Debug history', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\\n      <Flame\\n        id=\\\"spec_1\\\"\\n        columnarData={columnarData}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={(value) => `${value}`}\\n        animation={{ duration: 500 }}\\n        search={{ text: textSearch }}\\n        onSearchTextChange={(text) => textChangeAction(`text changed to: [${text}]`)}\\n        controlProviderCallback={{\\n          resetFocus: (control) => (resetFocusControl = control),\\n          focusOnNode: (control) => (focusOnNodeControl = control),\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":63},\"endLoc\":{\"col\":1,\"line\":100},\"startBody\":{\"col\":36,\"line\":63},\"endBody\":{\"col\":1,\"line\":100}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, button, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Flame,\n  Settings,\n  FlameGlobalControl,\n  FlameNodeControl,\n  ColumnarViewModel,\n} from '@elastic/charts';\nimport columnarMock from '@elastic/charts/src/mocks/hierarchical/cpu_profile_tree_mock_columnar.json';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\n\nconst paletteColorBrewerCat12 = [\n  [141, 211, 199],\n  [255, 255, 179],\n  [190, 186, 218],\n  [251, 128, 114],\n  [128, 177, 211],\n  [253, 180, 98],\n  [179, 222, 105],\n  [252, 205, 229],\n  [217, 217, 217],\n  [188, 128, 189],\n  [204, 235, 197],\n  [255, 237, 111],\n];\n\nconst position = new Float32Array(columnarMock.position);\nconst size = new Float32Array(columnarMock.size);\n\nconst columnarData: ColumnarViewModel = {\n  label: columnarMock.label.map((index: number) => columnarMock.dictionary[index]), // reversing the dictionary encoding\n  value: new Float64Array(columnarMock.value),\n  // color: new Float32Array((columnarMock.color.match(/.{2}/g) ?? []).map((hex: string) => Number.parseInt(hex, 16) / 255)),\n  color: new Float32Array(\n    columnarMock.label.flatMap(() => [...paletteColorBrewerCat12[rng(0, 11)].map((c) => c / 255), 1]),\n  ),\n  position0: position, //position.map((p, i) => (i % 2 === 0 ? 1 - p - size[i / 2] : p)), //.map((p, i) => (i % 2 === 0 ? 1 - p - size[i / 2] : p)), // new Float32Array([...position].slice(1)), // try with the wrong array length\n  position1: position,\n  size0: size, //size.map((s) => 0.8 * s),\n  size1: size,\n};\n\nconst noop = () => {};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\n\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  button('Reset focus', () => {\n    resetFocusControl();\n  });\n  button('Set focus on random node', () => {\n    focusOnNodeControl(rng(0, 19));\n  });\n  const textSearch = text('Text to search', '');\n  const textChangeAction = action('Text change');\n\n  const debug = boolean('Debug history', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\n      <Flame\n        id=\"spec_1\"\n        columnarData={columnarData}\n        valueAccessor={(d: Datum) => d.value as number}\n        valueFormatter={(value) => `${value}`}\n        animation={{ duration: 500 }}\n        search={{ text: textSearch }}\n        onSearchTextChange={(text) => textChangeAction(`text changed to: [${text}]`)}\n        controlProviderCallback={{\n          resetFocus: (control) => (resetFocusControl = control),\n          focusOnNode: (control) => (focusOnNodeControl = control),\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  let resetFocusControl: FlameGlobalControl = noop; // initial value\\n  let focusOnNodeControl: FlameNodeControl = noop; // initial value\\n\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  button('Reset focus', () => {\\n    resetFocusControl();\\n  });\\n  button('Set focus on random node', () => {\\n    focusOnNodeControl(rng(0, 19));\\n  });\\n  const textSearch = text('Text to search', '');\\n  const textChangeAction = action('Text change');\\n\\n  const debug = boolean('Debug history', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} {...onElementListeners} debug={debug} />\\n      <Flame\\n        id=\\\"spec_1\\\"\\n        columnarData={columnarData}\\n        valueAccessor={(d: Datum) => d.value as number}\\n        valueFormatter={(value) => `${value}`}\\n        animation={{ duration: 500 }}\\n        search={{ text: textSearch }}\\n        onSearchTextChange={(text) => textChangeAction(`text changed to: [${text}]`)}\\n        controlProviderCallback={{\\n          resetFocus: (control) => (resetFocusControl = control),\\n          focusOnNode: (control) => (focusOnNodeControl = control),\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Flame (@alpha)',\n};\n\nexport { Example as icicleChart } from './01_unix_icicle.story';\nexport { Example as flameChart } from './02_unix_flame.story';\nexport { Example as cpuProfileFlameChart } from './03_cpu_profile_flame.story';\nexport { Example as cpuProfileGLFlameChart } from './04_cpu_profile_gl_flame.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { isVerticalRotation } from '@elastic/charts/src/chart_types/xy_chart/state/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const isVertical = isVerticalRotation(rotation);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onBrushEnd={action('onBrushEnd')} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"bottom\\\"\\n        showOverlappingTicks\\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"left\\\"\\n        position={Position.Left}\\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title=\\\"top\\\"\\n        showOverlappingTicks\\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"right\\\"\\n        position={Position.Right}\\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 2 },\\n          { x: 2, y: 7 },\\n          { x: 3, y: 3 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":67},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":67}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { isVerticalRotation } from '@elastic/charts/src/chart_types/xy_chart/state/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rotation = customKnobs.enum.rotation();\n  const isVertical = isVerticalRotation(rotation);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings onBrushEnd={action('onBrushEnd')} rotation={rotation} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"bottom\"\n        showOverlappingTicks\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\n      />\n      <Axis\n        id=\"left\"\n        title=\"left\"\n        position={Position.Left}\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\n      />\n      <Axis\n        id=\"top\"\n        position={Position.Top}\n        title=\"top\"\n        showOverlappingTicks\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\n      />\n      <Axis\n        id=\"right\"\n        title=\"right\"\n        position={Position.Right}\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\n      />\n\n      <BarSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 1, y: 2 },\n          { x: 2, y: 7 },\n          { x: 3, y: 3 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const isVertical = isVerticalRotation(rotation);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onBrushEnd={action('onBrushEnd')} rotation={rotation} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"bottom\\\"\\n        showOverlappingTicks\\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"left\\\"\\n        position={Position.Left}\\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title=\\\"top\\\"\\n        showOverlappingTicks\\n        tickFormat={isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title=\\\"right\\\"\\n        position={Position.Right}\\n        tickFormat={!isVertical ? (d) => Number(d).toFixed(2) : undefined}\\n      />\\n\\n      <BarSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 2 },\\n          { x: 2, y: 7 },\\n          { x: 3, y: 3 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      onBrushEnd={action('onBrushEnd')}\\n      rotation={customKnobs.enum.rotation()}\\n      roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\\n      allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      enableHistogramMode\\n      yAccessors={['y']}\\n      data={[\\n        { x: 1, y: 2 },\\n        { x: 2, y: 7 },\\n        { x: 3, y: 8 },\\n        { x: 4, y: 9 },\\n        { x: 5, y: 3 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      baseTheme={useBaseTheme()}\n      onBrushEnd={action('onBrushEnd')}\n      rotation={customKnobs.enum.rotation()}\n      roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\n      allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks />\n    <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n    <Axis id=\"top\" position={Position.Top} title=\"top\" showOverlappingTicks />\n    <Axis id=\"right\" title=\"right\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      enableHistogramMode\n      yAccessors={['y']}\n      data={[\n        { x: 1, y: 2 },\n        { x: 2, y: 7 },\n        { x: 3, y: 8 },\n        { x: 4, y: 9 },\n        { x: 5, y: 3 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      onBrushEnd={action('onBrushEnd')}\\n      rotation={customKnobs.enum.rotation()}\\n      roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\\n      allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      enableHistogramMode\\n      yAccessors={['y']}\\n      data={[\\n        { x: 1, y: 2 },\\n        { x: 2, y: 7 },\\n        { x: 3, y: 8 },\\n        { x: 4, y: 9 },\\n        { x: 5, y: 3 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport * as moment from 'moment-timezone';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  BrushEndListener,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatter,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = 1000 * 60 * 60 * 24;\\n  const oneDays = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatter = niceTimeFormatter([now, fiveDays.add(now).asMilliseconds()]);\\n  const brushEndListener: BrushEndListener = ({ x }) => {\\n    if (!x) {\\n      return;\\n    }\\n    action('onBrushEnd')(formatter(x[0]), formatter(x[1]));\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        onBrushEnd={brushEndListener}\\n        onElementClick={action('onElementClick')}\\n        rotation={customKnobs.enum.rotation()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks tickFormat={formatter} />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: oneDays.add(now).asMilliseconds(), y: 7 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"baras\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: now + oneDay, y: 7 },\\n          { x: now + oneDay * 2, y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport * as moment from 'moment-timezone';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  BrushEndListener,\n  Chart,\n  LineSeries,\n  niceTimeFormatter,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\n  const oneDay = 1000 * 60 * 60 * 24;\n  const oneDays = moment.duration(1, 'd');\n  const twoDays = moment.duration(2, 'd');\n  const fiveDays = moment.duration(5, 'd');\n  const formatter = niceTimeFormatter([now, fiveDays.add(now).asMilliseconds()]);\n  const brushEndListener: BrushEndListener = ({ x }) => {\n    if (!x) {\n      return;\n    }\n    action('onBrushEnd')(formatter(x[0]), formatter(x[1]));\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        onBrushEnd={brushEndListener}\n        onElementClick={action('onElementClick')}\n        rotation={customKnobs.enum.rotation()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks tickFormat={formatter} />\n      <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        timeZone=\"Europe/Rome\"\n        data={[\n          { x: now, y: 2 },\n          { x: oneDays.add(now).asMilliseconds(), y: 7 },\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\n          { x: now + oneDay * 5, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"baras\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        timeZone=\"Europe/Rome\"\n        data={[\n          { x: now, y: 2 },\n          { x: now + oneDay, y: 7 },\n          { x: now + oneDay * 2, y: 3 },\n          { x: now + oneDay * 5, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = 1000 * 60 * 60 * 24;\\n  const oneDays = moment.duration(1, 'd');\\n  const twoDays = moment.duration(2, 'd');\\n  const fiveDays = moment.duration(5, 'd');\\n  const formatter = niceTimeFormatter([now, fiveDays.add(now).asMilliseconds()]);\\n  const brushEndListener: BrushEndListener = ({ x }) => {\\n    if (!x) {\\n      return;\\n    }\\n    action('onBrushEnd')(formatter(x[0]), formatter(x[1]));\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        onBrushEnd={brushEndListener}\\n        onElementClick={action('onElementClick')}\\n        rotation={customKnobs.enum.rotation()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks tickFormat={formatter} />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: oneDays.add(now).asMilliseconds(), y: 7 },\\n          { x: twoDays.add(now).asMilliseconds(), y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"baras\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: now + oneDay, y: 7 },\\n          { x: now + oneDay * 2, y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  niceTimeFormatter,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  HistogramBarSeries,\\n  BrushEndListener,\\n} from '@elastic/charts';\\nimport { isVerticalRotation } from '@elastic/charts/src/chart_types/xy_chart/state/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const isVertical = isVerticalRotation(rotation);\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = 1000 * 60 * 60 * 24;\\n  const dateFormatter = niceTimeFormatter([now, now + oneDay * 5]);\\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\\n  const brushEndListener: BrushEndListener = ({ x }) => {\\n    if (!x) {\\n      return;\\n    }\\n    action('onBrushEnd')(dateFormatter(x[0]), dateFormatter(x[1]));\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        onBrushEnd={brushEndListener}\\n        onElementClick={action('onElementClick')}\\n        rotation={customKnobs.enum.rotation()}\\n        roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\\n        allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"bottom\\\"\\n        showOverlappingTicks\\n        tickFormat={!isVertical ? dateFormatter : numberFormatter}\\n      />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={isVertical ? dateFormatter : numberFormatter} />\\n\\n      <HistogramBarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: now + oneDay, y: 7 },\\n          { x: now + oneDay * 2, y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":79},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":79}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  niceTimeFormatter,\n  Position,\n  ScaleType,\n  Settings,\n  HistogramBarSeries,\n  BrushEndListener,\n} from '@elastic/charts';\nimport { isVerticalRotation } from '@elastic/charts/src/chart_types/xy_chart/state/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rotation = customKnobs.enum.rotation();\n  const isVertical = isVerticalRotation(rotation);\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\n  const oneDay = 1000 * 60 * 60 * 24;\n  const dateFormatter = niceTimeFormatter([now, now + oneDay * 5]);\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\n  const brushEndListener: BrushEndListener = ({ x }) => {\n    if (!x) {\n      return;\n    }\n    action('onBrushEnd')(dateFormatter(x[0]), dateFormatter(x[1]));\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        onBrushEnd={brushEndListener}\n        onElementClick={action('onElementClick')}\n        rotation={customKnobs.enum.rotation()}\n        roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\n        allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\n      />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"bottom\"\n        showOverlappingTicks\n        tickFormat={!isVertical ? dateFormatter : numberFormatter}\n      />\n      <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={isVertical ? dateFormatter : numberFormatter} />\n\n      <HistogramBarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        timeZone=\"Europe/Rome\"\n        data={[\n          { x: now, y: 2 },\n          { x: now + oneDay, y: 7 },\n          { x: now + oneDay * 2, y: 3 },\n          { x: now + oneDay * 5, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rotation = customKnobs.enum.rotation();\\n  const isVertical = isVerticalRotation(rotation);\\n  const now = DateTime.fromISO('2019-01-11T00:00:00.000').setZone('utc+1').toMillis();\\n  const oneDay = 1000 * 60 * 60 * 24;\\n  const dateFormatter = niceTimeFormatter([now, now + oneDay * 5]);\\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\\n  const brushEndListener: BrushEndListener = ({ x }) => {\\n    if (!x) {\\n      return;\\n    }\\n    action('onBrushEnd')(dateFormatter(x[0]), dateFormatter(x[1]));\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        onBrushEnd={brushEndListener}\\n        onElementClick={action('onElementClick')}\\n        rotation={customKnobs.enum.rotation()}\\n        roundHistogramBrushValues={boolean('roundHistogramBrushValues', false)}\\n        allowBrushingLastHistogramBin={boolean('allowBrushingLastHistogramBin', true)}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"bottom\\\"\\n        showOverlappingTicks\\n        tickFormat={!isVertical ? dateFormatter : numberFormatter}\\n      />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={isVertical ? dateFormatter : numberFormatter} />\\n\\n      <HistogramBarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        timeZone=\\\"Europe/Rome\\\"\\n        data={[\\n          { x: now, y: 2 },\\n          { x: now + oneDay, y: 7 },\\n          { x: now + oneDay * 2, y: 3 },\\n          { x: now + oneDay * 5, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 2 },\\n        { x: 'b', y: 7 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks />\n    <Axis id=\"left\" title=\"left\" position={Position.Left} />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 2 },\n        { x: 'b', y: 7 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 2 },\\n        { x: 'b', y: 7 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  Tooltip,\\n  TooltipType,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hideBars = boolean('hideBars', false);\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  const chartRotation = customKnobs.enum.rotation();\\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\\n\\n  const tooltipType = select(\\n    'tooltipType',\\n    {\\n      cross: TooltipType.Crosshairs,\\n      vertical: TooltipType.VerticalCursor,\\n      follow: TooltipType.Follow,\\n      none: TooltipType.None,\\n    },\\n    TooltipType.Crosshairs,\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} rotation={chartRotation} />\\n      <Tooltip type={tooltipType} snap={boolean('tooltip snap to grid', true)} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        tickFormat={[0, 180].includes(chartRotation) ? formatter : numberFormatter}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit: hideBars,\\n        }}\\n        position={Position.Left}\\n        tickFormat={[0, 180].includes(chartRotation) ? numberFormatter : formatter}\\n      />\\n      {!hideBars && (\\n        <>\\n          <BarSeries\\n            id=\\\"data 1\\\"\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            stackAccessors={[0]}\\n            data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n          />\\n          <BarSeries\\n            id=\\\"data 2\\\"\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            stackAccessors={[0]}\\n            data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\\n          />\\n        </>\\n      )}\\n      <LineSeries\\n        id=\\\"data 3\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":101},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":101}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  Tooltip,\n  TooltipType,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hideBars = boolean('hideBars', false);\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\n  const chartRotation = customKnobs.enum.rotation();\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\n\n  const tooltipType = select(\n    'tooltipType',\n    {\n      cross: TooltipType.Crosshairs,\n      vertical: TooltipType.VerticalCursor,\n      follow: TooltipType.Follow,\n      none: TooltipType.None,\n    },\n    TooltipType.Crosshairs,\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} rotation={chartRotation} />\n      <Tooltip type={tooltipType} snap={boolean('tooltip snap to grid', true)} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        tickFormat={[0, 180].includes(chartRotation) ? formatter : numberFormatter}\n      />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit: hideBars,\n        }}\n        position={Position.Left}\n        tickFormat={[0, 180].includes(chartRotation) ? numberFormatter : formatter}\n      />\n      {!hideBars && (\n        <>\n          <BarSeries\n            id=\"data 1\"\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor={0}\n            yAccessors={[1]}\n            stackAccessors={[0]}\n            data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\n          />\n          <BarSeries\n            id=\"data 2\"\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor={0}\n            yAccessors={[1]}\n            stackAccessors={[0]}\n            data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\n          />\n        </>\n      )}\n      <LineSeries\n        id=\"data 3\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hideBars = boolean('hideBars', false);\\n  const formatter = timeFormatter(niceTimeFormatByDay(1));\\n  const chartRotation = customKnobs.enum.rotation();\\n  const numberFormatter = (d: any) => Number(d).toFixed(2);\\n\\n  const tooltipType = select(\\n    'tooltipType',\\n    {\\n      cross: TooltipType.Crosshairs,\\n      vertical: TooltipType.VerticalCursor,\\n      follow: TooltipType.Follow,\\n      none: TooltipType.None,\\n    },\\n    TooltipType.Crosshairs,\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={boolean('debug', false)} baseTheme={useBaseTheme()} rotation={chartRotation} />\\n      <Tooltip type={tooltipType} snap={boolean('tooltip snap to grid', true)} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        tickFormat={[0, 180].includes(chartRotation) ? formatter : numberFormatter}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit: hideBars,\\n        }}\\n        position={Position.Left}\\n        tickFormat={[0, 180].includes(chartRotation) ? numberFormatter : formatter}\\n      />\\n      {!hideBars && (\\n        <>\\n          <BarSeries\\n            id=\\\"data 1\\\"\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            stackAccessors={[0]}\\n            data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20)}\\n          />\\n          <BarSeries\\n            id=\\\"data 2\\\"\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            stackAccessors={[0]}\\n            data={KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 20)}\\n          />\\n        </>\\n      )}\\n      <LineSeries\\n        id=\\\"data 3\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, 20)}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onRenderChange = action('onRenderChange');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      onRenderChange={onRenderChange}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown:\\n    'Sends an event every time the chart render state changes. This is provided to bind attributes to the chart for visulaization loading checks.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onRenderChange = action('onRenderChange');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendPosition={Position.Right}\n      onRenderChange={onRenderChange}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown:\n    'Sends an event every time the chart render state changes. This is provided to bind attributes to the chart for visulaization loading checks.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      onRenderChange={onRenderChange}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  PointerEvent,\\n  Placement,\\n  niceTimeFormatter,\\n  TooltipType,\\n  LineSeries,\\n  AreaSeries,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst chartTypes: Record<string, any> = {\\n  bar: BarSeries,\\n  line: LineSeries,\\n  area: AreaSeries,\\n};\\n\\nconst getSeriesKnob = (group?: string) => {\\n  const type =\\n    select<string>(\\n      'Series type',\\n      {\\n        Bar: 'bar',\\n        Line: 'line',\\n        Area: 'area',\\n      },\\n      'bar',\\n      group,\\n    ) ?? 'bar';\\n  return chartTypes[type] ?? BarSeries;\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\\n\\n  const group1 = 'Top Chart';\\n  const group2 = 'Bottom Chart';\\n\\n  const TopSeries = getSeriesKnob(group1);\\n  const BottomSeries = getSeriesKnob(group2);\\n  const topType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group1 });\\n  const bottomType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group2 });\\n  const topVisible = boolean('enable external tooltip', true, group1);\\n  const bottomVisible = boolean('enable external tooltip', true, group2);\\n  const topPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group1 });\\n  const bottomPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group2 });\\n\\n  const debounceDelay = number('pointer update debounce', 20, { min: 0, max: 200, step: 10 });\\n  const trigger =\\n    select(\\n      'pointer update trigger',\\n      {\\n        'Only x': 'x',\\n        'Only y': 'y',\\n        'Both x and y': 'both',\\n      },\\n      'x',\\n    ) ?? 'x';\\n\\n  return (\\n    <>\\n      <Chart title={title} description={description} ref={ref1} size={{ height: '50%' }} id=\\\"chart1\\\">\\n        <Settings\\n          showLegend\\n          showLegendExtra\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          pointerUpdateDebounce={debounceDelay}\\n          pointerUpdateTrigger={trigger}\\n          externalPointerEvents={{\\n            tooltip: { visible: topVisible, placement: topPlacement },\\n          }}\\n        />\\n        <Tooltip type={topType} />\\n\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          title={`External tooltip visible: ${topVisible} - boundary: scroll parent`}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n        <TopSeries\\n          id=\\\"Top\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data1.slice(3, 60)}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} ref={ref2} size={{ height: '50%' }} id=\\\"chart2\\\">\\n        <Settings\\n          showLegend\\n          showLegendExtra\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{\\n            tooltip: { visible: bottomVisible, placement: bottomPlacement, boundary: 'chart' },\\n          }}\\n        />\\n        <Tooltip type={bottomType} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          title={`External tooltip visible: ${bottomVisible} - boundary: chart`}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          tickFormat={(d: any) => Number(d).toFixed(2)}\\n          domain={{ min: 5, max: 20 }}\\n        />\\n\\n        <BottomSeries\\n          id=\\\"Bottom\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Sqrt}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data2.slice(10)}\\n          color={palettes.echPaletteForLightBackground.colors[0]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: 'Sends an event every time the cursor changes. This is provided to sync cursors between multiple charts.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":56},\"endLoc\":{\"col\":1,\"line\":164},\"startBody\":{\"col\":36,\"line\":56},\"endBody\":{\"col\":1,\"line\":164}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  PointerEvent,\n  Placement,\n  niceTimeFormatter,\n  TooltipType,\n  LineSeries,\n  AreaSeries,\n  Tooltip,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst chartTypes: Record<string, any> = {\n  bar: BarSeries,\n  line: LineSeries,\n  area: AreaSeries,\n};\n\nconst getSeriesKnob = (group?: string) => {\n  const type =\n    select<string>(\n      'Series type',\n      {\n        Bar: 'bar',\n        Line: 'line',\n        Area: 'area',\n      },\n      'bar',\n      group,\n    ) ?? 'bar';\n  return chartTypes[type] ?? BarSeries;\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const ref1 = React.useRef<Chart>(null);\n  const ref2 = React.useRef<Chart>(null);\n  const pointerUpdate = (event: PointerEvent) => {\n    action('onPointerUpdate')(event);\n    if (ref1.current) {\n      ref1.current.dispatchExternalPointerEvent(event);\n    }\n    if (ref2.current) {\n      ref2.current.dispatchExternalPointerEvent(event);\n    }\n  };\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\n\n  const group1 = 'Top Chart';\n  const group2 = 'Bottom Chart';\n\n  const TopSeries = getSeriesKnob(group1);\n  const BottomSeries = getSeriesKnob(group2);\n  const topType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group1 });\n  const bottomType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group2 });\n  const topVisible = boolean('enable external tooltip', true, group1);\n  const bottomVisible = boolean('enable external tooltip', true, group2);\n  const topPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group1 });\n  const bottomPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group2 });\n\n  const debounceDelay = number('pointer update debounce', 20, { min: 0, max: 200, step: 10 });\n  const trigger =\n    select(\n      'pointer update trigger',\n      {\n        'Only x': 'x',\n        'Only y': 'y',\n        'Both x and y': 'both',\n      },\n      'x',\n    ) ?? 'x';\n\n  return (\n    <>\n      <Chart title={title} description={description} ref={ref1} size={{ height: '50%' }} id=\"chart1\">\n        <Settings\n          showLegend\n          showLegendExtra\n          baseTheme={useBaseTheme()}\n          onPointerUpdate={pointerUpdate}\n          pointerUpdateDebounce={debounceDelay}\n          pointerUpdateTrigger={trigger}\n          externalPointerEvents={{\n            tooltip: { visible: topVisible, placement: topPlacement },\n          }}\n        />\n        <Tooltip type={topType} />\n\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          title={`External tooltip visible: ${topVisible} - boundary: scroll parent`}\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n        />\n        <Axis id=\"left2\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n        <TopSeries\n          id=\"Top\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data1.slice(3, 60)}\n        />\n      </Chart>\n      <Chart title={title} description={description} ref={ref2} size={{ height: '50%' }} id=\"chart2\">\n        <Settings\n          showLegend\n          showLegendExtra\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{\n            tooltip: { visible: bottomVisible, placement: bottomPlacement, boundary: 'chart' },\n          }}\n        />\n        <Tooltip type={bottomType} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          title={`External tooltip visible: ${bottomVisible} - boundary: chart`}\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n        />\n        <Axis\n          id=\"left2\"\n          position={Position.Left}\n          tickFormat={(d: any) => Number(d).toFixed(2)}\n          domain={{ min: 5, max: 20 }}\n        />\n\n        <BottomSeries\n          id=\"Bottom\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Sqrt}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data2.slice(10)}\n          color={palettes.echPaletteForLightBackground.colors[0]}\n        />\n      </Chart>\n    </>\n  );\n};\n\nExample.parameters = {\n  markdown: 'Sends an event every time the cursor changes. This is provided to sync cursors between multiple charts.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\\n\\n  const group1 = 'Top Chart';\\n  const group2 = 'Bottom Chart';\\n\\n  const TopSeries = getSeriesKnob(group1);\\n  const BottomSeries = getSeriesKnob(group2);\\n  const topType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group1 });\\n  const bottomType = customKnobs.enum.tooltipType('local tooltip type', TooltipType.VerticalCursor, { group: group2 });\\n  const topVisible = boolean('enable external tooltip', true, group1);\\n  const bottomVisible = boolean('enable external tooltip', true, group2);\\n  const topPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group1 });\\n  const bottomPlacement = customKnobs.enum.placement('external tooltip placement', Placement.Left, { group: group2 });\\n\\n  const debounceDelay = number('pointer update debounce', 20, { min: 0, max: 200, step: 10 });\\n  const trigger =\\n    select(\\n      'pointer update trigger',\\n      {\\n        'Only x': 'x',\\n        'Only y': 'y',\\n        'Both x and y': 'both',\\n      },\\n      'x',\\n    ) ?? 'x';\\n\\n  return (\\n    <>\\n      <Chart title={title} description={description} ref={ref1} size={{ height: '50%' }} id=\\\"chart1\\\">\\n        <Settings\\n          showLegend\\n          showLegendExtra\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          pointerUpdateDebounce={debounceDelay}\\n          pointerUpdateTrigger={trigger}\\n          externalPointerEvents={{\\n            tooltip: { visible: topVisible, placement: topPlacement },\\n          }}\\n        />\\n        <Tooltip type={topType} />\\n\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          title={`External tooltip visible: ${topVisible} - boundary: scroll parent`}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n        <TopSeries\\n          id=\\\"Top\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data1.slice(3, 60)}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} ref={ref2} size={{ height: '50%' }} id=\\\"chart2\\\">\\n        <Settings\\n          showLegend\\n          showLegendExtra\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{\\n            tooltip: { visible: bottomVisible, placement: bottomPlacement, boundary: 'chart' },\\n          }}\\n        />\\n        <Tooltip type={bottomType} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          title={`External tooltip visible: ${bottomVisible} - boundary: chart`}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          tickFormat={(d: any) => Number(d).toFixed(2)}\\n          domain={{ min: 5, max: 20 }}\\n        />\\n\\n        <BottomSeries\\n          id=\\\"Bottom\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Sqrt}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data2.slice(10)}\\n          color={palettes.echPaletteForLightBackground.colors[0]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { button, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  niceTimeFormatter,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Partition,\\n  Datum,\\n  Goal,\\n  ChartType,\\n  defaultPartitionValueFormatter,\\n  BandFillColorAccessorInput,\\n} from '@elastic/charts';\\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { productLookup, indexInterpolatedFillColor, interpolatorCET2s, getBandFillColorFn } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  /**\\n   * The handler section of this story demonstrates the PNG export functionality\\n   */\\n  const chartRef = React.useRef<Chart>(null);\\n  const handler = () => {\\n    if (!chartRef.current) {\\n      return;\\n    }\\n    const snapshot = chartRef.current.getPNGSnapshot({\\n      // you can set the background and pixel ratio for the PNG export\\n      backgroundColor: 'white',\\n    });\\n    if (!snapshot) {\\n      return;\\n    }\\n    // will save as chart.png\\n    const fileName = 'chart.png';\\n    const link = document.createElement('a');\\n    link.download = fileName;\\n    link.href = snapshot.blobOrDataUrl;\\n    document.body.appendChild(link);\\n    link.click();\\n    document.body.removeChild(link);\\n  };\\n  button('Export PNG', handler);\\n  const selectedChart = select('chart type', [ChartType.XYAxis, ChartType.Partition, ChartType.Goal], ChartType.XYAxis);\\n\\n  return (\\n    <Chart title={title} description={description} ref={chartRef}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        showLegend={selectedChart === ChartType.XYAxis}\\n        showLegendExtra={selectedChart === ChartType.XYAxis}\\n      />\\n      {selectedChart === ChartType.Partition\\n        ? renderPartitionChart()\\n        : selectedChart === ChartType.Goal\\n          ? renderGoalchart()\\n          : renderXYAxisChart()}\\n    </Chart>\\n  );\\n};\\n\\nfunction renderPartitionChart() {\\n  return (\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  );\\n}\\n\\nfunction renderXYAxisChart() {\\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 100);\\n  return (\\n    <>\\n      <Axis\\n        id=\\\"time\\\"\\n        position={Position.Bottom}\\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n      />\\n      <Axis\\n        id=\\\"count\\\"\\n        domain={{\\n          min: NaN,\\n          max: NaN,\\n          fit: true,\\n        }}\\n        position={Position.Left}\\n      />\\n\\n      <BarSeries\\n        id=\\\"series bars chart\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </>\\n  );\\n}\\n\\nfunction renderGoalchart() {\\n  const subtype = GoalSubtype.Goal;\\n\\n  const getBandFillColor = getBandFillColorFn({\\n    200: '#fc8d62',\\n    250: 'lightgrey',\\n    300: '#66c2a5',\\n  });\\n\\n  return (\\n    <Goal\\n      id=\\\"spec_1\\\"\\n      subtype={subtype}\\n      base={0}\\n      target={260}\\n      actual={280}\\n      domain={{ min: 0, max: 300 }}\\n      bands={[200, 250, 300]}\\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\\n      bandFillColor={getBandFillColor}\\n      labelMajor=\\\"\\\"\\n      labelMinor=\\\"\\\"\\n      centralMajor=\\\"280 MB/s\\\"\\n      centralMinor=\\\"\\\"\\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\\n    />\\n  );\\n}\\n\\nExample.parameters = {\\n  markdown:\\n    'Generate a PNG of the chart by clicking on the Export PNG button in the knobs section. In this Example, the button handler is setting the PNG background to white with a pixel ratio of 2. If the browser is detected to be IE11, msSaveBlob will be used instead of a PNG capture.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":77},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":77}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { button, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  niceTimeFormatter,\n  Position,\n  ScaleType,\n  Settings,\n  Partition,\n  Datum,\n  Goal,\n  ChartType,\n  defaultPartitionValueFormatter,\n  BandFillColorAccessorInput,\n} from '@elastic/charts';\nimport { GoalSubtype } from '@elastic/charts/src/chart_types/goal_chart/specs/constants';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { productLookup, indexInterpolatedFillColor, interpolatorCET2s, getBandFillColorFn } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  /**\n   * The handler section of this story demonstrates the PNG export functionality\n   */\n  const chartRef = React.useRef<Chart>(null);\n  const handler = () => {\n    if (!chartRef.current) {\n      return;\n    }\n    const snapshot = chartRef.current.getPNGSnapshot({\n      // you can set the background and pixel ratio for the PNG export\n      backgroundColor: 'white',\n    });\n    if (!snapshot) {\n      return;\n    }\n    // will save as chart.png\n    const fileName = 'chart.png';\n    const link = document.createElement('a');\n    link.download = fileName;\n    link.href = snapshot.blobOrDataUrl;\n    document.body.appendChild(link);\n    link.click();\n    document.body.removeChild(link);\n  };\n  button('Export PNG', handler);\n  const selectedChart = select('chart type', [ChartType.XYAxis, ChartType.Partition, ChartType.Goal], ChartType.XYAxis);\n\n  return (\n    <Chart title={title} description={description} ref={chartRef}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        showLegend={selectedChart === ChartType.XYAxis}\n        showLegendExtra={selectedChart === ChartType.XYAxis}\n      />\n      {selectedChart === ChartType.Partition\n        ? renderPartitionChart()\n        : selectedChart === ChartType.Goal\n          ? renderGoalchart()\n          : renderXYAxisChart()}\n    </Chart>\n  );\n};\n\nfunction renderPartitionChart() {\n  return (\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  );\n}\n\nfunction renderXYAxisChart() {\n  const data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 100);\n  return (\n    <>\n      <Axis\n        id=\"time\"\n        position={Position.Bottom}\n        tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n      />\n      <Axis\n        id=\"count\"\n        domain={{\n          min: NaN,\n          max: NaN,\n          fit: true,\n        }}\n        position={Position.Left}\n      />\n\n      <BarSeries\n        id=\"series bars chart\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </>\n  );\n}\n\nfunction renderGoalchart() {\n  const subtype = GoalSubtype.Goal;\n\n  const getBandFillColor = getBandFillColorFn({\n    200: '#fc8d62',\n    250: 'lightgrey',\n    300: '#66c2a5',\n  });\n\n  return (\n    <Goal\n      id=\"spec_1\"\n      subtype={subtype}\n      base={0}\n      target={260}\n      actual={280}\n      domain={{ min: 0, max: 300 }}\n      bands={[200, 250, 300]}\n      ticks={[0, 50, 100, 150, 200, 250, 300]}\n      tickValueFormatter={({ value }: BandFillColorAccessorInput) => String(value)}\n      bandFillColor={getBandFillColor}\n      labelMajor=\"\"\n      labelMinor=\"\"\n      centralMajor=\"280 MB/s\"\n      centralMinor=\"\"\n      angleStart={Math.PI + (Math.PI - (2 * Math.PI) / 3) / 2}\n      angleEnd={-(Math.PI - (2 * Math.PI) / 3) / 2}\n    />\n  );\n}\n\nExample.parameters = {\n  markdown:\n    'Generate a PNG of the chart by clicking on the Export PNG button in the knobs section. In this Example, the button handler is setting the PNG background to white with a pixel ratio of 2. If the browser is detected to be IE11, msSaveBlob will be used instead of a PNG capture.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  /**\\n   * The handler section of this story demonstrates the PNG export functionality\\n   */\\n  const chartRef = React.useRef<Chart>(null);\\n  const handler = () => {\\n    if (!chartRef.current) {\\n      return;\\n    }\\n    const snapshot = chartRef.current.getPNGSnapshot({\\n      // you can set the background and pixel ratio for the PNG export\\n      backgroundColor: 'white',\\n    });\\n    if (!snapshot) {\\n      return;\\n    }\\n    // will save as chart.png\\n    const fileName = 'chart.png';\\n    const link = document.createElement('a');\\n    link.download = fileName;\\n    link.href = snapshot.blobOrDataUrl;\\n    document.body.appendChild(link);\\n    link.click();\\n    document.body.removeChild(link);\\n  };\\n  button('Export PNG', handler);\\n  const selectedChart = select('chart type', [ChartType.XYAxis, ChartType.Partition, ChartType.Goal], ChartType.XYAxis);\\n\\n  return (\\n    <Chart title={title} description={description} ref={chartRef}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        showLegend={selectedChart === ChartType.XYAxis}\\n        showLegendExtra={selectedChart === ChartType.XYAxis}\\n      />\\n      {selectedChart === ChartType.Partition\\n        ? renderPartitionChart()\\n        : selectedChart === ChartType.Goal\\n          ? renderGoalchart()\\n          : renderXYAxisChart()}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  PointerEvent,\\n  Placement,\\n  niceTimeFormatter,\\n  TooltipType,\\n  LineSeries,\\n  AreaSeries,\\n  RectAnnotation,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst chartTypes: Record<string, any> = {\\n  bar: BarSeries,\\n  line: LineSeries,\\n  area: AreaSeries,\\n};\\n\\nconst getSeriesKnob = (group?: string) => {\\n  const type =\\n    select<string>(\\n      'Series type',\\n      {\\n        Bar: 'bar',\\n        Line: 'line',\\n        Area: 'area',\\n      },\\n      'area',\\n      group,\\n    ) ?? 'area';\\n  return chartTypes[type] ?? BarSeries;\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\\n\\n  const TopSeries = getSeriesKnob();\\n  const BottomSeries = getSeriesKnob();\\n\\n  const showNullValues = boolean('show null values', true);\\n\\n  return (\\n    <>\\n      <Chart\\n        title={title}\\n        description={description}\\n        className=\\\"story-chart\\\"\\n        ref={ref1}\\n        size={{ height: '50%' }}\\n        id=\\\"chart1\\\"\\n      >\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          pointerUpdateDebounce={0}\\n          pointerUpdateTrigger=\\\"x\\\"\\n          externalPointerEvents={{\\n            tooltip: { visible: true, placement: Placement.Left },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          ticks={3}\\n          position={Position.Left}\\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\\n        />\\n        <RectAnnotation\\n          dataValues={[\\n            {\\n              coordinates: { x0: data2[10][0], x1: data2[29][0] },\\n            },\\n          ]}\\n          id=\\\"zoomed\\\"\\n          hideTooltips\\n        />\\n\\n        <TopSeries\\n          id=\\\"Top\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data1.slice(2, 35).map((d, i) => {\\n            if (i === 7 || i === 11 || i === 12) {\\n              return [d[0], null];\\n            }\\n            return d;\\n          })}\\n        />\\n      </Chart>\\n      <Chart\\n        title={title}\\n        description={description}\\n        className=\\\"story-chart\\\"\\n        ref={ref2}\\n        size={{ height: '50%' }}\\n        id=\\\"chart2\\\"\\n      >\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{\\n            tooltip: { visible: true, placement: Placement.Left, boundary: 'chart' },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          ticks={3}\\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\\n          domain={{ min: 5, max: 20 }}\\n        />\\n\\n        <BottomSeries\\n          id=\\\"Bottom\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data2.slice(10, 30).map((d, i) => {\\n            if (i === 4 || i === 10) {\\n              return [d[0], null];\\n            }\\n            return d;\\n          })}\\n          color={palettes.echPaletteForLightBackground.colors[0]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":56},\"endLoc\":{\"col\":1,\"line\":178},\"startBody\":{\"col\":36,\"line\":56},\"endBody\":{\"col\":1,\"line\":178}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  PointerEvent,\n  Placement,\n  niceTimeFormatter,\n  TooltipType,\n  LineSeries,\n  AreaSeries,\n  RectAnnotation,\n  Tooltip,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst chartTypes: Record<string, any> = {\n  bar: BarSeries,\n  line: LineSeries,\n  area: AreaSeries,\n};\n\nconst getSeriesKnob = (group?: string) => {\n  const type =\n    select<string>(\n      'Series type',\n      {\n        Bar: 'bar',\n        Line: 'line',\n        Area: 'area',\n      },\n      'area',\n      group,\n    ) ?? 'area';\n  return chartTypes[type] ?? BarSeries;\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const ref1 = React.useRef<Chart>(null);\n  const ref2 = React.useRef<Chart>(null);\n  const pointerUpdate = (event: PointerEvent) => {\n    action('onPointerUpdate')(event);\n    if (ref1.current) {\n      ref1.current.dispatchExternalPointerEvent(event);\n    }\n    if (ref2.current) {\n      ref2.current.dispatchExternalPointerEvent(event);\n    }\n  };\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\n\n  const TopSeries = getSeriesKnob();\n  const BottomSeries = getSeriesKnob();\n\n  const showNullValues = boolean('show null values', true);\n\n  return (\n    <>\n      <Chart\n        title={title}\n        description={description}\n        className=\"story-chart\"\n        ref={ref1}\n        size={{ height: '50%' }}\n        id=\"chart1\"\n      >\n        <Settings\n          baseTheme={useBaseTheme()}\n          onPointerUpdate={pointerUpdate}\n          pointerUpdateDebounce={0}\n          pointerUpdateTrigger=\"x\"\n          externalPointerEvents={{\n            tooltip: { visible: true, placement: Placement.Left },\n          }}\n        />\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n        />\n        <Axis\n          id=\"left2\"\n          ticks={3}\n          position={Position.Left}\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\n        />\n        <RectAnnotation\n          dataValues={[\n            {\n              coordinates: { x0: data2[10][0], x1: data2[29][0] },\n            },\n          ]}\n          id=\"zoomed\"\n          hideTooltips\n        />\n\n        <TopSeries\n          id=\"Top\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data1.slice(2, 35).map((d, i) => {\n            if (i === 7 || i === 11 || i === 12) {\n              return [d[0], null];\n            }\n            return d;\n          })}\n        />\n      </Chart>\n      <Chart\n        title={title}\n        description={description}\n        className=\"story-chart\"\n        ref={ref2}\n        size={{ height: '50%' }}\n        id=\"chart2\"\n      >\n        <Settings\n          baseTheme={useBaseTheme()}\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{\n            tooltip: { visible: true, placement: Placement.Left, boundary: 'chart' },\n          }}\n        />\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\n        />\n        <Axis\n          id=\"left2\"\n          position={Position.Left}\n          ticks={3}\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\n          domain={{ min: 5, max: 20 }}\n        />\n\n        <BottomSeries\n          id=\"Bottom\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data2.slice(10, 30).map((d, i) => {\n            if (i === 4 || i === 10) {\n              return [d[0], null];\n            }\n            return d;\n          })}\n          color={palettes.echPaletteForLightBackground.colors[0]}\n        />\n      </Chart>\n    </>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const pointerUpdate = (event: PointerEvent) => {\\n    action('onPointerUpdate')(event);\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const { data } = KIBANA_METRICS.metrics.kibana_os_load.v1;\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data;\\n\\n  const TopSeries = getSeriesKnob();\\n  const BottomSeries = getSeriesKnob();\\n\\n  const showNullValues = boolean('show null values', true);\\n\\n  return (\\n    <>\\n      <Chart\\n        title={title}\\n        description={description}\\n        className=\\\"story-chart\\\"\\n        ref={ref1}\\n        size={{ height: '50%' }}\\n        id=\\\"chart1\\\"\\n      >\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          pointerUpdateDebounce={0}\\n          pointerUpdateTrigger=\\\"x\\\"\\n          externalPointerEvents={{\\n            tooltip: { visible: true, placement: Placement.Left },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          ticks={3}\\n          position={Position.Left}\\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\\n        />\\n        <RectAnnotation\\n          dataValues={[\\n            {\\n              coordinates: { x0: data2[10][0], x1: data2[29][0] },\\n            },\\n          ]}\\n          id=\\\"zoomed\\\"\\n          hideTooltips\\n        />\\n\\n        <TopSeries\\n          id=\\\"Top\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data1.slice(2, 35).map((d, i) => {\\n            if (i === 7 || i === 11 || i === 12) {\\n              return [d[0], null];\\n            }\\n            return d;\\n          })}\\n        />\\n      </Chart>\\n      <Chart\\n        title={title}\\n        description={description}\\n        className=\\\"story-chart\\\"\\n        ref={ref2}\\n        size={{ height: '50%' }}\\n        id=\\\"chart2\\\"\\n      >\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{\\n            tooltip: { visible: true, placement: Placement.Left, boundary: 'chart' },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} showNullValues={showNullValues} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          tickFormat={niceTimeFormatter([data[0][0], data[data.length - 1][0]])}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          ticks={3}\\n          tickFormat={(d: any) => (d === null ? 'N/A' : Number(d).toFixed(2))}\\n          domain={{ min: 5, max: 20 }}\\n        />\\n\\n        <BottomSeries\\n          id=\\\"Bottom\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data2.slice(10, 30).map((d, i) => {\\n            if (i === 4 || i === 10) {\\n              return [d[0], null];\\n            }\\n            return d;\\n          })}\\n          color={palettes.echPaletteForLightBackground.colors[0]}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  PointerEvent,\\n  Placement,\\n  TooltipType,\\n  LineSeries,\\n  Heatmap,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator('static');\\n\\nconst aggData = [\\n  ...KIBANA_METRICS.metrics.kibana_os_load.v1.data\\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\\n      if (i % 5 === 0) {\\n        acc.push({ x, y: '2fd4e', value: y });\\n      } else {\\n        acc[acc.length - 1].value += y;\\n      }\\n\\n      return acc;\\n    }, [])\\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\\n  ...KIBANA_METRICS.metrics.kibana_os_load.v2.data\\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\\n      if (i % 5 === 0) {\\n        acc.push({ x, y: '3afad', value: y });\\n      } else {\\n        acc[acc.length - 1].value += y;\\n      }\\n\\n      return acc;\\n    }, [])\\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\\n  ...KIBANA_METRICS.metrics.kibana_os_load.v3.data\\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\\n      if (i % 5 === 0) {\\n        acc.push({ x, y: 'f9560', value: y });\\n      } else {\\n        acc[acc.length - 1].value += y;\\n      }\\n\\n      return acc;\\n    }, [])\\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\\n];\\n\\nexport const Example: ChartsStory = () => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const ref3 = React.useRef<Chart>(null);\\n\\n  const pointerUpdate = (event: PointerEvent) => {\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref3.current) {\\n      ref3.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const baseTheme = useBaseTheme();\\n\\n  return (\\n    <>\\n      <Chart title=\\\"Response times\\\" ref={ref1} size={{ height: '30%' }} id=\\\"chart1\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            lineSeriesStyle: { point: { visible: false } },\\n          }}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          timeAxisLayerCount={2}\\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: {\\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n              padding: 0,\\n            },\\n            axisTitle: { visible: false },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          ticks={2}\\n          position={Position.Left}\\n          tickFormat={(d) => `${d / 1000}s`}\\n          style={{\\n            tickLine: { size: 0 },\\n            tickLabel: { padding: 4 },\\n            axisTitle: { visible: false, padding: 0 },\\n            axisPanelTitle: { visible: false, padding: 0 },\\n          }}\\n        />\\n\\n        <LineSeries\\n          id=\\\"Response time\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={KIBANA_METRICS.metrics.kibana_response_times.v1.data}\\n          yNice\\n          color=\\\"#343741\\\"\\n        />\\n      </Chart>\\n\\n      <br />\\n\\n      <Chart title=\\\"Number of requests\\\" ref={ref2} size={{ height: '30%' }} id=\\\"chart2\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            lineSeriesStyle: { point: { visible: false } },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          timeAxisLayerCount={2}\\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: {\\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n              padding: 0,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          ticks={2}\\n          style={{\\n            tickLine: { size: 0 },\\n            tickLabel: { padding: 4 },\\n            axisTitle: { visible: false, padding: 0 },\\n            axisPanelTitle: { visible: false, padding: 0 },\\n          }}\\n        />\\n        <LineSeries\\n          id=\\\"# Requests\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={KIBANA_METRICS.metrics.kibana_requests.v1.data}\\n          color=\\\"#343741\\\"\\n          yNice\\n        />\\n      </Chart>\\n\\n      <br />\\n\\n      <Chart title=\\\"Memory pressure\\\" ref={ref3} size={{ height: '30%' }} id=\\\"heatmap\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            heatmap: {\\n              grid: {\\n                stroke: {\\n                  color: baseTheme.axes.axisLine.stroke,\\n                  width: baseTheme.axes.axisLine.strokeWidth,\\n                },\\n              },\\n\\n              cell: {\\n                border: {\\n                  stroke: 'transparent',\\n                  strokeWidth: 0,\\n                },\\n              },\\n              yAxisLabel: {\\n                width: 50,\\n                textColor: baseTheme.axes.tickLabel.fill,\\n                fontSize: baseTheme.axes.tickLabel.fontSize,\\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\\n              },\\n              xAxisLabel: {\\n                textColor: baseTheme.axes.tickLabel.fill,\\n                fontSize: baseTheme.axes.tickLabel.fontSize,\\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\\n              },\\n            },\\n          }}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true } }}\\n        />\\n        <Heatmap\\n          id=\\\"CPU temp\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: [\\n              { start: -Infinity, end: 40, color: '#ffffb2' },\\n              { start: 40, end: 50, color: '#fed976' },\\n              { start: 50, end: 60, color: '#feb24c' },\\n              { start: 60, end: 70, color: '#fd8d3c' },\\n              { start: 70, end: 80, color: '#fc4e2a' },\\n              { start: 80, end: 90, color: '#e31a1c' },\\n              { start: 90, end: Infinity, color: '#b10026' },\\n            ],\\n          }}\\n          data={aggData}\\n          xAccessor=\\\"x\\\"\\n          yAccessor=\\\"y\\\"\\n          valueAccessor=\\\"value\\\"\\n          valueFormatter={(d) => `${Number(d.toFixed(1))}℃`}\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: {\\n              type: 'fixed',\\n              unit: 'ms',\\n              value: aggData[1].x - aggData[0].x,\\n            },\\n          }}\\n          xAxisLabelFormatter={(v) =>\\n            DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })\\n          }\\n          xAxisLabelName=\\\"time\\\"\\n          yAxisLabelName=\\\"cluster\\\"\\n          timeZone=\\\"UTC\\\"\\n          ySortPredicate=\\\"dataIndex\\\"\\n          yAxisLabelFormatter={(laneLabel) => `${laneLabel}`}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\\nExample.parameters = {\\n  toggles: {\\n    disabled: true,\\n    overrides: {},\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":69},\"endLoc\":{\"col\":1,\"line\":272},\"startBody\":{\"col\":36,\"line\":69},\"endBody\":{\"col\":1,\"line\":272}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  PointerEvent,\n  Placement,\n  TooltipType,\n  LineSeries,\n  Heatmap,\n  Tooltip,\n} from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator('static');\n\nconst aggData = [\n  ...KIBANA_METRICS.metrics.kibana_os_load.v1.data\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\n      if (i % 5 === 0) {\n        acc.push({ x, y: '2fd4e', value: y });\n      } else {\n        acc[acc.length - 1].value += y;\n      }\n\n      return acc;\n    }, [])\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\n  ...KIBANA_METRICS.metrics.kibana_os_load.v2.data\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\n      if (i % 5 === 0) {\n        acc.push({ x, y: '3afad', value: y });\n      } else {\n        acc[acc.length - 1].value += y;\n      }\n\n      return acc;\n    }, [])\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\n  ...KIBANA_METRICS.metrics.kibana_os_load.v3.data\n    .reduce<{ x: number; y: string; value: number }[]>((acc, [x, y], i) => {\n      if (i % 5 === 0) {\n        acc.push({ x, y: 'f9560', value: y });\n      } else {\n        acc[acc.length - 1].value += y;\n      }\n\n      return acc;\n    }, [])\n    .map(({ x, y, value }) => (rng() > 0.6 ? { x, y, value: null } : { x, y, value })),\n];\n\nexport const Example: ChartsStory = () => {\n  const ref1 = React.useRef<Chart>(null);\n  const ref2 = React.useRef<Chart>(null);\n  const ref3 = React.useRef<Chart>(null);\n\n  const pointerUpdate = (event: PointerEvent) => {\n    if (ref1.current) {\n      ref1.current.dispatchExternalPointerEvent(event);\n    }\n    if (ref2.current) {\n      ref2.current.dispatchExternalPointerEvent(event);\n    }\n    if (ref3.current) {\n      ref3.current.dispatchExternalPointerEvent(event);\n    }\n  };\n  const baseTheme = useBaseTheme();\n\n  return (\n    <>\n      <Chart title=\"Response times\" ref={ref1} size={{ height: '30%' }} id=\"chart1\">\n        <Settings\n          baseTheme={baseTheme}\n          theme={{\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\n            lineSeriesStyle: { point: { visible: false } },\n          }}\n          pointerUpdateDebounce={0}\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\n        />\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          timeAxisLayerCount={2}\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\n          style={{\n            tickLine: { size: 0.0001, padding: 4 },\n            tickLabel: {\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n              padding: 0,\n            },\n            axisTitle: { visible: false },\n          }}\n        />\n        <Axis\n          id=\"left2\"\n          ticks={2}\n          position={Position.Left}\n          tickFormat={(d) => `${d / 1000}s`}\n          style={{\n            tickLine: { size: 0 },\n            tickLabel: { padding: 4 },\n            axisTitle: { visible: false, padding: 0 },\n            axisPanelTitle: { visible: false, padding: 0 },\n          }}\n        />\n\n        <LineSeries\n          id=\"Response time\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={KIBANA_METRICS.metrics.kibana_response_times.v1.data}\n          yNice\n          color=\"#343741\"\n        />\n      </Chart>\n\n      <br />\n\n      <Chart title=\"Number of requests\" ref={ref2} size={{ height: '30%' }} id=\"chart2\">\n        <Settings\n          baseTheme={baseTheme}\n          pointerUpdateDebounce={0}\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\n          theme={{\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\n            lineSeriesStyle: { point: { visible: false } },\n          }}\n        />\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\n        <Axis\n          id=\"bottom\"\n          position={Position.Bottom}\n          timeAxisLayerCount={2}\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\n          style={{\n            tickLine: { size: 0.0001, padding: 4 },\n            tickLabel: {\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n              padding: 0,\n            },\n          }}\n        />\n        <Axis\n          id=\"left2\"\n          position={Position.Left}\n          ticks={2}\n          style={{\n            tickLine: { size: 0 },\n            tickLabel: { padding: 4 },\n            axisTitle: { visible: false, padding: 0 },\n            axisPanelTitle: { visible: false, padding: 0 },\n          }}\n        />\n        <LineSeries\n          id=\"# Requests\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={KIBANA_METRICS.metrics.kibana_requests.v1.data}\n          color=\"#343741\"\n          yNice\n        />\n      </Chart>\n\n      <br />\n\n      <Chart title=\"Memory pressure\" ref={ref3} size={{ height: '30%' }} id=\"heatmap\">\n        <Settings\n          baseTheme={baseTheme}\n          theme={{\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\n            heatmap: {\n              grid: {\n                stroke: {\n                  color: baseTheme.axes.axisLine.stroke,\n                  width: baseTheme.axes.axisLine.strokeWidth,\n                },\n              },\n\n              cell: {\n                border: {\n                  stroke: 'transparent',\n                  strokeWidth: 0,\n                },\n              },\n              yAxisLabel: {\n                width: 50,\n                textColor: baseTheme.axes.tickLabel.fill,\n                fontSize: baseTheme.axes.tickLabel.fontSize,\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\n              },\n              xAxisLabel: {\n                textColor: baseTheme.axes.tickLabel.fill,\n                fontSize: baseTheme.axes.tickLabel.fontSize,\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\n              },\n            },\n          }}\n          pointerUpdateDebounce={0}\n          onPointerUpdate={pointerUpdate}\n          externalPointerEvents={{ tooltip: { visible: true } }}\n        />\n        <Heatmap\n          id=\"CPU temp\"\n          colorScale={{\n            type: 'bands',\n            bands: [\n              { start: -Infinity, end: 40, color: '#ffffb2' },\n              { start: 40, end: 50, color: '#fed976' },\n              { start: 50, end: 60, color: '#feb24c' },\n              { start: 60, end: 70, color: '#fd8d3c' },\n              { start: 70, end: 80, color: '#fc4e2a' },\n              { start: 80, end: 90, color: '#e31a1c' },\n              { start: 90, end: Infinity, color: '#b10026' },\n            ],\n          }}\n          data={aggData}\n          xAccessor=\"x\"\n          yAccessor=\"y\"\n          valueAccessor=\"value\"\n          valueFormatter={(d) => `${Number(d.toFixed(1))}℃`}\n          xScale={{\n            type: ScaleType.Time,\n            interval: {\n              type: 'fixed',\n              unit: 'ms',\n              value: aggData[1].x - aggData[0].x,\n            },\n          }}\n          xAxisLabelFormatter={(v) =>\n            DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })\n          }\n          xAxisLabelName=\"time\"\n          yAxisLabelName=\"cluster\"\n          timeZone=\"UTC\"\n          ySortPredicate=\"dataIndex\"\n          yAxisLabelFormatter={(laneLabel) => `${laneLabel}`}\n        />\n      </Chart>\n    </>\n  );\n};\n\nExample.parameters = {\n  toggles: {\n    disabled: true,\n    overrides: {},\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const ref1 = React.useRef<Chart>(null);\\n  const ref2 = React.useRef<Chart>(null);\\n  const ref3 = React.useRef<Chart>(null);\\n\\n  const pointerUpdate = (event: PointerEvent) => {\\n    if (ref1.current) {\\n      ref1.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref2.current) {\\n      ref2.current.dispatchExternalPointerEvent(event);\\n    }\\n    if (ref3.current) {\\n      ref3.current.dispatchExternalPointerEvent(event);\\n    }\\n  };\\n  const baseTheme = useBaseTheme();\\n\\n  return (\\n    <>\\n      <Chart title=\\\"Response times\\\" ref={ref1} size={{ height: '30%' }} id=\\\"chart1\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            lineSeriesStyle: { point: { visible: false } },\\n          }}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          timeAxisLayerCount={2}\\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: {\\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n              padding: 0,\\n            },\\n            axisTitle: { visible: false },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          ticks={2}\\n          position={Position.Left}\\n          tickFormat={(d) => `${d / 1000}s`}\\n          style={{\\n            tickLine: { size: 0 },\\n            tickLabel: { padding: 4 },\\n            axisTitle: { visible: false, padding: 0 },\\n            axisPanelTitle: { visible: false, padding: 0 },\\n          }}\\n        />\\n\\n        <LineSeries\\n          id=\\\"Response time\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={KIBANA_METRICS.metrics.kibana_response_times.v1.data}\\n          yNice\\n          color=\\\"#343741\\\"\\n        />\\n      </Chart>\\n\\n      <br />\\n\\n      <Chart title=\\\"Number of requests\\\" ref={ref2} size={{ height: '30%' }} id=\\\"chart2\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true, placement: Placement.Left } }}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            lineSeriesStyle: { point: { visible: false } },\\n          }}\\n        />\\n        <Tooltip type={TooltipType.VerticalCursor} placement={Placement.Left} stickTo={Position.Top} />\\n        <Axis\\n          id=\\\"bottom\\\"\\n          position={Position.Bottom}\\n          timeAxisLayerCount={2}\\n          tickFormat={(v) => DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: {\\n              alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n              padding: 0,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"left2\\\"\\n          position={Position.Left}\\n          ticks={2}\\n          style={{\\n            tickLine: { size: 0 },\\n            tickLabel: { padding: 4 },\\n            axisTitle: { visible: false, padding: 0 },\\n            axisPanelTitle: { visible: false, padding: 0 },\\n          }}\\n        />\\n        <LineSeries\\n          id=\\\"# Requests\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={KIBANA_METRICS.metrics.kibana_requests.v1.data}\\n          color=\\\"#343741\\\"\\n          yNice\\n        />\\n      </Chart>\\n\\n      <br />\\n\\n      <Chart title=\\\"Memory pressure\\\" ref={ref3} size={{ height: '30%' }} id=\\\"heatmap\\\">\\n        <Settings\\n          baseTheme={baseTheme}\\n          theme={{\\n            chartPaddings: { top: 0, bottom: 0, left: 0, right: 0 },\\n            chartMargins: { top: 0, bottom: 0, left: 16, right: 0 },\\n            heatmap: {\\n              grid: {\\n                stroke: {\\n                  color: baseTheme.axes.axisLine.stroke,\\n                  width: baseTheme.axes.axisLine.strokeWidth,\\n                },\\n              },\\n\\n              cell: {\\n                border: {\\n                  stroke: 'transparent',\\n                  strokeWidth: 0,\\n                },\\n              },\\n              yAxisLabel: {\\n                width: 50,\\n                textColor: baseTheme.axes.tickLabel.fill,\\n                fontSize: baseTheme.axes.tickLabel.fontSize,\\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\\n              },\\n              xAxisLabel: {\\n                textColor: baseTheme.axes.tickLabel.fill,\\n                fontSize: baseTheme.axes.tickLabel.fontSize,\\n                fontFamily: baseTheme.axes.tickLabel.fontFamily,\\n                fontStyle: baseTheme.axes.tickLabel.fontStyle,\\n              },\\n            },\\n          }}\\n          pointerUpdateDebounce={0}\\n          onPointerUpdate={pointerUpdate}\\n          externalPointerEvents={{ tooltip: { visible: true } }}\\n        />\\n        <Heatmap\\n          id=\\\"CPU temp\\\"\\n          colorScale={{\\n            type: 'bands',\\n            bands: [\\n              { start: -Infinity, end: 40, color: '#ffffb2' },\\n              { start: 40, end: 50, color: '#fed976' },\\n              { start: 50, end: 60, color: '#feb24c' },\\n              { start: 60, end: 70, color: '#fd8d3c' },\\n              { start: 70, end: 80, color: '#fc4e2a' },\\n              { start: 80, end: 90, color: '#e31a1c' },\\n              { start: 90, end: Infinity, color: '#b10026' },\\n            ],\\n          }}\\n          data={aggData}\\n          xAccessor=\\\"x\\\"\\n          yAccessor=\\\"y\\\"\\n          valueAccessor=\\\"value\\\"\\n          valueFormatter={(d) => `${Number(d.toFixed(1))}℃`}\\n          xScale={{\\n            type: ScaleType.Time,\\n            interval: {\\n              type: 'fixed',\\n              unit: 'ms',\\n              value: aggData[1].x - aggData[0].x,\\n            },\\n          }}\\n          xAxisLabelFormatter={(v) =>\\n            DateTime.fromMillis(v as number).toFormat('dd MMMM HH:mm:ss', { timeZone: 'Europe/Rome' })\\n          }\\n          xAxisLabelName=\\\"time\\\"\\n          yAxisLabelName=\\\"cluster\\\"\\n          timeZone=\\\"UTC\\\"\\n          ySortPredicate=\\\"dataIndex\\\"\\n          yAxisLabelFormatter={(laneLabel) => `${laneLabel}`}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Tooltip,\\n  TooltipHeaderFormatter,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n  onProjectionClick: action('onProjectionClick'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useObjectAsX = boolean('use object on x', false);\\n  const headerFormatter: TooltipHeaderFormatter = ({ value }) => {\\n    if (value % 2 === 0) {\\n      return (\\n        <div>\\n          <p>special header for even x values</p>\\n          <p>{value}</p>\\n        </div>\\n      );\\n    }\\n\\n    return value;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onElementListeners}\\n      />\\n      <Tooltip headerFormatter={headerFormatter} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={useObjectAsX ? ScaleType.Ordinal : ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={useObjectAsX ? 'sObj' : 'x'}\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2, obj: { from: 10, to: 20 }, sObj: 'from 10 to 20' },\\n          { x: 1, y: 7, obj: { from: 20, to: 30 }, sObj: 'from 20 to 30' },\\n          { x: 2, y: -3, obj: { from: 30, to: 40 }, sObj: 'from 30 to 40' },\\n          { x: 3, y: 6, obj: { from: 40, to: 50 }, sObj: 'from 40 to 50' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":77},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":77}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  Tooltip,\n  TooltipHeaderFormatter,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n  onProjectionClick: action('onProjectionClick'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useObjectAsX = boolean('use object on x', false);\n  const headerFormatter: TooltipHeaderFormatter = ({ value }) => {\n    if (value % 2 === 0) {\n      return (\n        <div>\n          <p>special header for even x values</p>\n          <p>{value}</p>\n        </div>\n      );\n    }\n\n    return value;\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n        {...onElementListeners}\n      />\n      <Tooltip headerFormatter={headerFormatter} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={useObjectAsX ? ScaleType.Ordinal : ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={useObjectAsX ? 'sObj' : 'x'}\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2, obj: { from: 10, to: 20 }, sObj: 'from 10 to 20' },\n          { x: 1, y: 7, obj: { from: 20, to: 30 }, sObj: 'from 20 to 30' },\n          { x: 2, y: -3, obj: { from: 30, to: 40 }, sObj: 'from 30 to 40' },\n          { x: 3, y: 6, obj: { from: 40, to: 50 }, sObj: 'from 40 to 50' },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useObjectAsX = boolean('use object on x', false);\\n  const headerFormatter: TooltipHeaderFormatter = ({ value }) => {\\n    if (value % 2 === 0) {\\n      return (\\n        <div>\\n          <p>special header for even x values</p>\\n          <p>{value}</p>\\n        </div>\\n      );\\n    }\\n\\n    return value;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onElementListeners}\\n      />\\n      <Tooltip headerFormatter={headerFormatter} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={useObjectAsX ? ScaleType.Ordinal : ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={useObjectAsX ? 'sObj' : 'x'}\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2, obj: { from: 10, to: 20 }, sObj: 'from 10 to 20' },\\n          { x: 1, y: 7, obj: { from: 20, to: 30 }, sObj: 'from 20 to 30' },\\n          { x: 2, y: -3, obj: { from: 30, to: 40 }, sObj: 'from 30 to 40' },\\n          { x: 3, y: 6, obj: { from: 40, to: 50 }, sObj: 'from 40 to 50' },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"area\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendPosition={Position.Right}\n      {...onElementListeners}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <AreaSeries\n      id=\"area\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"area\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <LineSeries\\n      id=\\\"line 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line 2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 6.8 },\\n        { x: 2, y: 3.001 },\\n        { x: 3, y: 6.1 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":62},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":62}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendPosition={Position.Right}\n      {...onElementListeners}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <LineSeries\n      id=\"line 1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"line 2\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 6.8 },\n        { x: 2, y: 3.001 },\n        { x: 3, y: 6.1 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <LineSeries\\n      id=\\\"line 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line 2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 6.8 },\\n        { x: 2, y: 3.001 },\\n        { x: 3, y: 6.1 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 8 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <AreaSeries\\n      id=\\\"area\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.3 },\\n        { x: 1, y: 7.3 },\\n        { x: 2, y: 6 },\\n        { x: 3, y: 2 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":75},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":75}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { AreaSeries, Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendPosition={Position.Right}\n      {...onElementListeners}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2.3 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 8 },\n      ]}\n    />\n    <LineSeries\n      id=\"line\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <AreaSeries\n      id=\"area\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2.3 },\n        { x: 1, y: 7.3 },\n        { x: 2, y: 6 },\n        { x: 3, y: 2 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendPosition={Position.Right}\\n      {...onElementListeners}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 8 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <AreaSeries\\n      id=\\\"area\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.3 },\\n        { x: 1, y: 7.3 },\\n        { x: 2, y: 6 },\\n        { x: 3, y: 2 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Position, Settings, Partition, PartitionLayout } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { discreteColor, colorBrewerCategoricalPastel12 } from '../utils/utils';\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\ntype PieDatum = [string, number, string, number];\\n\\nconst pieData: Array<PieDatum> = [\\n  ['CN', 301, 'IN', 44],\\n  ['CN', 301, 'US', 24],\\n  ['CN', 301, 'ID', 13],\\n  ['CN', 301, 'BR', 8],\\n  ['IN', 245, 'US', 22],\\n  ['IN', 245, 'BR', 11],\\n  ['IN', 245, 'ID', 10],\\n  ['US', 130, 'CN', 33],\\n  ['US', 130, 'IN', 23],\\n  ['US', 130, 'US', 9],\\n  ['US', 130, 'ID', 7],\\n  ['US', 130, 'BR', 5],\\n  ['ID', 55, 'BR', 4],\\n  ['ID', 55, 'US', 3],\\n  ['PK', 43, 'FR', 2],\\n  ['PK', 43, 'PK', 2],\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const layout = select('layout', { sunburst: PartitionLayout.sunburst, treemap: PartitionLayout.treemap }, 'sunburst');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onElementListeners}\\n      />\\n      <Partition\\n        id=\\\"pie\\\"\\n        data={pieData}\\n        layout={layout}\\n        valueAccessor={(d) => d[3]}\\n        layers={[\\n          {\\n            groupByRollup: (d: PieDatum) => d[0],\\n            nodeLabel: (d) => `dest: ${d}`,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: PieDatum) => d[2],\\n            nodeLabel: (d) => `source: ${d}`,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalPastel12, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `The \\\\`onElementClick\\\\` receive an argument with the following type definition: \\\\`Array<[Array<LayerValue>, SeriesIdentifier]>\\\\`.\\n\\nUsually the outer array contains only one item but, in a near future, we will group smaller slices into a single one during the interaction.\\n\\nFor every clicked slice, you will have an array of \\\\`LayerValue\\\\`s and a \\\\`SeriesIdentifier\\\\`. The array of \\\\`LayerValues\\\\` is sorted\\nin the same way as the \\\\`layers\\\\` props, and helps you to idenfity the \\\\`groupByRollup\\\\` value and the slice value on every sunburst level.\\n      `,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":46},\"endLoc\":{\"col\":1,\"line\":82},\"startBody\":{\"col\":36,\"line\":46},\"endBody\":{\"col\":1,\"line\":82}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Position, Settings, Partition, PartitionLayout } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { discreteColor, colorBrewerCategoricalPastel12 } from '../utils/utils';\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\ntype PieDatum = [string, number, string, number];\n\nconst pieData: Array<PieDatum> = [\n  ['CN', 301, 'IN', 44],\n  ['CN', 301, 'US', 24],\n  ['CN', 301, 'ID', 13],\n  ['CN', 301, 'BR', 8],\n  ['IN', 245, 'US', 22],\n  ['IN', 245, 'BR', 11],\n  ['IN', 245, 'ID', 10],\n  ['US', 130, 'CN', 33],\n  ['US', 130, 'IN', 23],\n  ['US', 130, 'US', 9],\n  ['US', 130, 'ID', 7],\n  ['US', 130, 'BR', 5],\n  ['ID', 55, 'BR', 4],\n  ['ID', 55, 'US', 3],\n  ['PK', 43, 'FR', 2],\n  ['PK', 43, 'PK', 2],\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const layout = select('layout', { sunburst: PartitionLayout.sunburst, treemap: PartitionLayout.treemap }, 'sunburst');\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n        {...onElementListeners}\n      />\n      <Partition\n        id=\"pie\"\n        data={pieData}\n        layout={layout}\n        valueAccessor={(d) => d[3]}\n        layers={[\n          {\n            groupByRollup: (d: PieDatum) => d[0],\n            nodeLabel: (d) => `dest: ${d}`,\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12, 0.7)(sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: PieDatum) => d[2],\n            nodeLabel: (d) => `source: ${d}`,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalPastel12, 0.5)(node.parent.sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `The \\`onElementClick\\` receive an argument with the following type definition: \\`Array<[Array<LayerValue>, SeriesIdentifier]>\\`.\n\nUsually the outer array contains only one item but, in a near future, we will group smaller slices into a single one during the interaction.\n\nFor every clicked slice, you will have an array of \\`LayerValue\\`s and a \\`SeriesIdentifier\\`. The array of \\`LayerValues\\` is sorted\nin the same way as the \\`layers\\` props, and helps you to idenfity the \\`groupByRollup\\` value and the slice value on every sunburst level.\n      `,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const layout = select('layout', { sunburst: PartitionLayout.sunburst, treemap: PartitionLayout.treemap }, 'sunburst');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onElementListeners}\\n      />\\n      <Partition\\n        id=\\\"pie\\\"\\n        data={pieData}\\n        layout={layout}\\n        valueAccessor={(d) => d[3]}\\n        layers={[\\n          {\\n            groupByRollup: (d: PieDatum) => d[0],\\n            nodeLabel: (d) => `dest: ${d}`,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: PieDatum) => d[2],\\n            nodeLabel: (d) => `source: ${d}`,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalPastel12, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { array, boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { BARCHART_2Y2G } from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst onLegendItemListeners = {\\n  onLegendItemOver: action('onLegendItemOver'),\\n  onLegendItemOut: action('onLegendItemOut'),\\n  onLegendItemClick: action('onLegendItemClick'),\\n  onLegendItemPlusClick: action('onLegendItemPlusClick'),\\n  onLegendItemMinusClick: action('onLegendItemMinusClick'),\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const notSpecChange = 'not spec change';\\n  const specChange = 'spec change';\\n\\n  const xDomain = {\\n    min: number('xDomain min', 0, {}, notSpecChange),\\n    max: number('xDomain max', 6, {}, notSpecChange),\\n  };\\n\\n  const yDomain = {\\n    min: number('yDomain min', 0, {}, notSpecChange),\\n    max: number('yDomain max', 10, {}, notSpecChange),\\n  };\\n\\n  const yScaleTypeOptions: { [key: string]: typeof ScaleType.Linear | typeof ScaleType.Log } = {\\n    linear: ScaleType.Linear,\\n    log: ScaleType.Log,\\n  };\\n  const yScaleType = select('yScaleType', yScaleTypeOptions, ScaleType.Linear, specChange);\\n\\n  const xAccessorOptions = { x: 'x', y1: 'y1', y2: 'y2' };\\n  const xAccessor = select('xAccessor', xAccessorOptions, 'x', notSpecChange);\\n\\n  const fit = boolean('fit Y domain', false, specChange);\\n\\n  const splitSeriesAccessors = array('split series accessors', ['g1', 'g2'], ',', specChange);\\n\\n  const hasY2 = boolean('has y2 yAccessor', true, specChange);\\n  const yAccessors = hasY2 ? ['y1', 'y2'] : ['y1'];\\n\\n  const additionalG1Value = { x: 4, g1: '$$$$$$$$', g2: 'indirect-cdn', y1: 7, y2: 3 };\\n  const hasAdditionalG1Value = boolean('has additional g1 value', false, specChange);\\n\\n  const seriesData = BARCHART_2Y2G;\\n\\n  const data = hasAdditionalG1Value ? [...seriesData, additionalG1Value] : seriesData;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onLegendItemListeners}\\n        xDomain={xDomain}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          ...yDomain,\\n          fit,\\n        }}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={xAccessor}\\n        yAccessors={yAccessors}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":97},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":97}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { array, boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { BARCHART_2Y2G } from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst onLegendItemListeners = {\n  onLegendItemOver: action('onLegendItemOver'),\n  onLegendItemOut: action('onLegendItemOut'),\n  onLegendItemClick: action('onLegendItemClick'),\n  onLegendItemPlusClick: action('onLegendItemPlusClick'),\n  onLegendItemMinusClick: action('onLegendItemMinusClick'),\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const notSpecChange = 'not spec change';\n  const specChange = 'spec change';\n\n  const xDomain = {\n    min: number('xDomain min', 0, {}, notSpecChange),\n    max: number('xDomain max', 6, {}, notSpecChange),\n  };\n\n  const yDomain = {\n    min: number('yDomain min', 0, {}, notSpecChange),\n    max: number('yDomain max', 10, {}, notSpecChange),\n  };\n\n  const yScaleTypeOptions: { [key: string]: typeof ScaleType.Linear | typeof ScaleType.Log } = {\n    linear: ScaleType.Linear,\n    log: ScaleType.Log,\n  };\n  const yScaleType = select('yScaleType', yScaleTypeOptions, ScaleType.Linear, specChange);\n\n  const xAccessorOptions = { x: 'x', y1: 'y1', y2: 'y2' };\n  const xAccessor = select('xAccessor', xAccessorOptions, 'x', notSpecChange);\n\n  const fit = boolean('fit Y domain', false, specChange);\n\n  const splitSeriesAccessors = array('split series accessors', ['g1', 'g2'], ',', specChange);\n\n  const hasY2 = boolean('has y2 yAccessor', true, specChange);\n  const yAccessors = hasY2 ? ['y1', 'y2'] : ['y1'];\n\n  const additionalG1Value = { x: 4, g1: '$$$$$$$$', g2: 'indirect-cdn', y1: 7, y2: 3 };\n  const hasAdditionalG1Value = boolean('has additional g1 value', false, specChange);\n\n  const seriesData = BARCHART_2Y2G;\n\n  const data = hasAdditionalG1Value ? [...seriesData, additionalG1Value] : seriesData;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n        {...onLegendItemListeners}\n        xDomain={xDomain}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          ...yDomain,\n          fit,\n        }}\n      />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        xAccessor={xAccessor}\n        yAccessors={yAccessors}\n        splitSeriesAccessors={splitSeriesAccessors}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const notSpecChange = 'not spec change';\\n  const specChange = 'spec change';\\n\\n  const xDomain = {\\n    min: number('xDomain min', 0, {}, notSpecChange),\\n    max: number('xDomain max', 6, {}, notSpecChange),\\n  };\\n\\n  const yDomain = {\\n    min: number('yDomain min', 0, {}, notSpecChange),\\n    max: number('yDomain max', 10, {}, notSpecChange),\\n  };\\n\\n  const yScaleTypeOptions: { [key: string]: typeof ScaleType.Linear | typeof ScaleType.Log } = {\\n    linear: ScaleType.Linear,\\n    log: ScaleType.Log,\\n  };\\n  const yScaleType = select('yScaleType', yScaleTypeOptions, ScaleType.Linear, specChange);\\n\\n  const xAccessorOptions = { x: 'x', y1: 'y1', y2: 'y2' };\\n  const xAccessor = select('xAccessor', xAccessorOptions, 'x', notSpecChange);\\n\\n  const fit = boolean('fit Y domain', false, specChange);\\n\\n  const splitSeriesAccessors = array('split series accessors', ['g1', 'g2'], ',', specChange);\\n\\n  const hasY2 = boolean('has y2 yAccessor', true, specChange);\\n  const yAccessors = hasY2 ? ['y1', 'y2'] : ['y1'];\\n\\n  const additionalG1Value = { x: 4, g1: '$$$$$$$$', g2: 'indirect-cdn', y1: 7, y2: 3 };\\n  const hasAdditionalG1Value = boolean('has additional g1 value', false, specChange);\\n\\n  const seriesData = BARCHART_2Y2G;\\n\\n  const data = hasAdditionalG1Value ? [...seriesData, additionalG1Value] : seriesData;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n        {...onLegendItemListeners}\\n        xDomain={xDomain}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          ...yDomain,\\n          fit,\\n        }}\\n      />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        xAccessor={xAccessor}\\n        yAccessors={yAccessors}\\n        splitSeriesAccessors={splitSeriesAccessors}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 2, g: 'a' },\\n        { x: 1, y: 7, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 6, g: 'a' },\\n        { x: 0, y: 4, g: 'b' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 2, y: 8, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      baseTheme={useBaseTheme()}\n      legendPosition={Position.Right}\n      onLegendItemClick={action('onLegendItemClick')}\n      onLegendItemOver={action('onLegendItemOver')}\n      onLegendItemOut={action('onLegendItemOut')}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <AreaSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      splitSeriesAccessors={['g']}\n      data={[\n        { x: 0, y: 2, g: 'a' },\n        { x: 1, y: 7, g: 'a' },\n        { x: 2, y: 3, g: 'a' },\n        { x: 3, y: 6, g: 'a' },\n        { x: 0, y: 4, g: 'b' },\n        { x: 1, y: 5, g: 'b' },\n        { x: 2, y: 8, g: 'b' },\n        { x: 3, y: 2, g: 'b' },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      splitSeriesAccessors={['g']}\\n      data={[\\n        { x: 0, y: 2, g: 'a' },\\n        { x: 1, y: 7, g: 'a' },\\n        { x: 2, y: 3, g: 'a' },\\n        { x: 3, y: 6, g: 'a' },\\n        { x: 0, y: 4, g: 'b' },\\n        { x: 1, y: 5, g: 'b' },\\n        { x: 2, y: 8, g: 'b' },\\n        { x: 3, y: 2, g: 'b' },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <LineSeries\\n      id=\\\"lines1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_BASIS}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines3\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_CARDINAL}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines4\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines5\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_NATURAL}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines6\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.LINEAR}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":116},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":116}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      baseTheme={useBaseTheme()}\n      legendPosition={Position.Right}\n      onLegendItemClick={action('onLegendItemClick')}\n      onLegendItemOver={action('onLegendItemOver')}\n      onLegendItemOut={action('onLegendItemOut')}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <LineSeries\n      id=\"lines1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_MONOTONE_X}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines2\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_BASIS}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines3\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_CARDINAL}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines4\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_CATMULL_ROM}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines5\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_NATURAL}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines6\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.LINEAR}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <LineSeries\\n      id=\\\"lines1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines2\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_BASIS}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines3\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_CARDINAL}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines4\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines5\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_NATURAL}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines6\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.LINEAR}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":59},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":59}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      baseTheme={useBaseTheme()}\n      legendPosition={Position.Right}\n      onLegendItemClick={action('onLegendItemClick')}\n      onLegendItemOver={action('onLegendItemOver')}\n      onLegendItemOut={action('onLegendItemOut')}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 3 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 10 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      baseTheme={useBaseTheme()}\\n      legendPosition={Position.Right}\\n      onLegendItemClick={action('onLegendItemClick')}\\n      onLegendItemOver={action('onLegendItemOver')}\\n      onLegendItemOut={action('onLegendItemOut')}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks />\n    <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n    <Axis id=\"top\" position={Position.Top} title=\"top\" showOverlappingTicks />\n    <Axis id=\"right\" title=\"right\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <AreaSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings onBrushEnd={action('onBrushEnd')} rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n    <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, BrushAxis } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const brushAxisSelect = select(\\n    'brush axis',\\n    {\\n      x: BrushAxis.X,\\n      y: BrushAxis.Y,\\n      both: BrushAxis.Both,\\n    },\\n    BrushAxis.Both,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        brushAxis={brushAxisSelect}\\n        onBrushEnd={action('brush')}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":57},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":57}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, BrushAxis } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const brushAxisSelect = select(\n    'brush axis',\n    {\n      x: BrushAxis.X,\n      y: BrushAxis.Y,\n      both: BrushAxis.Both,\n    },\n    BrushAxis.Both,\n  );\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        rotation={customKnobs.enum.rotation()}\n        brushAxis={brushAxisSelect}\n        onBrushEnd={action('brush')}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"bottom\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"top\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"right\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const brushAxisSelect = select(\\n    'brush axis',\\n    {\\n      x: BrushAxis.X,\\n      y: BrushAxis.Y,\\n      both: BrushAxis.Both,\\n    },\\n    BrushAxis.Both,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={customKnobs.enum.rotation()}\\n        brushAxis={brushAxisSelect}\\n        onBrushEnd={action('brush')}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"bottom\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"top\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"right\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Interactions',\n};\n\nexport { Example as barClicksAndHovers } from './1_bar_clicks.story';\nexport { Example as areaPointClicksAndHovers } from './2_area_point_clicks.story';\nexport { Example as linePointClicksAndHovers } from './3_line_point_clicks.story';\nexport { Example as lineAreaBarPointClicksAndHovers } from './4_line_area_bar_clicks.story';\nexport { Example as sunburstSliceClicks } from './4_sunburst_slice_clicks.story';\nexport { Example as clicksHoversOnLegendItemsBarChart } from './5_clicks_legend_items_bar.story';\nexport { Example as clickHoversOnLegendItemsAreaChart } from './6_clicks_legend_items_area.story';\nexport { Example as clickHoversOnLegendItemsLineChart } from './7_clicks_legend_items_line.story';\nexport { Example as clickHoversOnLegendItemsMixedChart } from './8_clicks_legend_items_mixed.story';\nexport { Example as brushSelectionToolOnLinear } from './9_brush_selection_linear.story';\nexport { Example as brushTool } from './9a_brush_selection_linear.story';\n\nexport { Example as brushSelectionToolOnBarChartLinear } from './10_brush_selection_bar.story';\nexport { Example as brushSelectionToolOnBarChartHistogram } from './10a_brush_selection_bar_hist.story';\nexport { Example as brushSelectionToolOnTimeCharts } from './11_brush_time.story';\nexport { Example as brushSelectionToolOnHistogramTimeCharts } from './12_brush_time_hist.story';\nexport { Example as brushDisabledOnOrdinalXAxis } from './13_brush_disabled_ordinal.story';\nexport { Example as crosshairWithTimeAxis } from './14_crosshair_time.story';\nexport { Example as renderChangeAction } from './15_render_change.story';\nexport { Example as cursorUpdateAction } from './16_cursor_update_action.story';\nexport { Example as multiChartCursorSync } from './19_multi_chart_cursor_sync.story';\nexport { Example as interactionWithNullValues } from './18_null_values.story';\nexport { Example as pngExportAction } from './17_png_export.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  LegendStrategy,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n  SeriesIdentifier,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const partitionLayout = select(\\n    'Partition Layout',\\n    {\\n      treemap: PartitionLayout.treemap,\\n      sunburst: PartitionLayout.sunburst,\\n      mosaic: PartitionLayout.mosaic,\\n      waffle: PartitionLayout.waffle,\\n    },\\n    PartitionLayout.sunburst,\\n  );\\n  const flatLegend = boolean('flatLegend', true);\\n  const showLegendExtra = boolean('showLegendExtra', false);\\n  const legendMaxDepth = number('legendMaxDepth', 2, {\\n    min: 0,\\n    max: 3,\\n    step: 1,\\n  });\\n  const legendStrategy = select('legendStrategy', LegendStrategy, LegendStrategy.Key as LegendStrategy);\\n  const maxLines = number('max legend label lines', 1, { min: 0, step: 1 });\\n\\n  const legendSortStrategy = select(\\n    'Custom legend sorting',\\n    { RegionsFirst: 'regionsFirst', ProductsFirst: 'productsFirst', DefaultSort: 'default' },\\n    'regionsFirst',\\n  );\\n\\n  const customLegendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\\n    if (legendSortStrategy === 'regionsFirst') {\\n      if (a.key in regionLookup && b.key in regionLookup) {\\n        return a.key.localeCompare(b.key);\\n      }\\n      return a.key in regionLookup ? -1 : b.key in regionLookup ? 1 : a.key.localeCompare(b.key);\\n    }\\n    if (a.key in productLookup && b.key in productLookup) {\\n      return a.key.localeCompare(b.key);\\n    }\\n    return a.key in productLookup ? -1 : b.key in productLookup ? 1 : a.key.localeCompare(b.key);\\n  };\\n\\n  const partitionTheme: PartialTheme['partition'] = {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  };\\n\\n  const isFlatLegendSupported =\\n    partitionLayout === PartitionLayout.treemap || partitionLayout === PartitionLayout.sunburst;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra={showLegendExtra}\\n        flatLegend={isFlatLegendSupported ? flatLegend : true}\\n        legendStrategy={legendStrategy}\\n        legendMaxDepth={legendMaxDepth}\\n        legendSort={legendSortStrategy !== 'default' ? customLegendSort : undefined}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: partitionTheme,\\n\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        layout={partitionLayout}\\n        data={mocks.miniSunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `To flatten a hierarchical legend (like the rendered in a pie chart or a treemap when using a multi-layer configuration) you can\\nadd the \\\\`flatLegend\\\\` prop into the \\\\`<Settings  baseTheme={useBaseTheme()} />\\\\` component.\\n\\nTo limit displayed hierarchy to a specific depth, you can use the \\\\`legendMaxDepth\\\\` prop. The first layer will have a depth of \\\\`1\\\\`.\\n\\nIt is possible to provide a custom sorting logic for a legend when flattened, when not flattened the \\\\`legendSort\\\\` function is ignored.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":150},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":150}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  LegendStrategy,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n  SeriesIdentifier,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const partitionLayout = select(\n    'Partition Layout',\n    {\n      treemap: PartitionLayout.treemap,\n      sunburst: PartitionLayout.sunburst,\n      mosaic: PartitionLayout.mosaic,\n      waffle: PartitionLayout.waffle,\n    },\n    PartitionLayout.sunburst,\n  );\n  const flatLegend = boolean('flatLegend', true);\n  const showLegendExtra = boolean('showLegendExtra', false);\n  const legendMaxDepth = number('legendMaxDepth', 2, {\n    min: 0,\n    max: 3,\n    step: 1,\n  });\n  const legendStrategy = select('legendStrategy', LegendStrategy, LegendStrategy.Key as LegendStrategy);\n  const maxLines = number('max legend label lines', 1, { min: 0, step: 1 });\n\n  const legendSortStrategy = select(\n    'Custom legend sorting',\n    { RegionsFirst: 'regionsFirst', ProductsFirst: 'productsFirst', DefaultSort: 'default' },\n    'regionsFirst',\n  );\n\n  const customLegendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\n    if (legendSortStrategy === 'regionsFirst') {\n      if (a.key in regionLookup && b.key in regionLookup) {\n        return a.key.localeCompare(b.key);\n      }\n      return a.key in regionLookup ? -1 : b.key in regionLookup ? 1 : a.key.localeCompare(b.key);\n    }\n    if (a.key in productLookup && b.key in productLookup) {\n      return a.key.localeCompare(b.key);\n    }\n    return a.key in productLookup ? -1 : b.key in productLookup ? 1 : a.key.localeCompare(b.key);\n  };\n\n  const partitionTheme: PartialTheme['partition'] = {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  };\n\n  const isFlatLegendSupported =\n    partitionLayout === PartitionLayout.treemap || partitionLayout === PartitionLayout.sunburst;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra={showLegendExtra}\n        flatLegend={isFlatLegendSupported ? flatLegend : true}\n        legendStrategy={legendStrategy}\n        legendMaxDepth={legendMaxDepth}\n        legendSort={legendSortStrategy !== 'default' ? customLegendSort : undefined}\n        baseTheme={useBaseTheme()}\n        theme={{\n          partition: partitionTheme,\n\n          legend: { labelOptions: { maxLines } },\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        layout={partitionLayout}\n        data={mocks.miniSunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: any) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (d: any) => regionLookup[d].regionName,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `To flatten a hierarchical legend (like the rendered in a pie chart or a treemap when using a multi-layer configuration) you can\nadd the \\`flatLegend\\` prop into the \\`<Settings  baseTheme={useBaseTheme()} />\\` component.\n\nTo limit displayed hierarchy to a specific depth, you can use the \\`legendMaxDepth\\` prop. The first layer will have a depth of \\`1\\`.\n\nIt is possible to provide a custom sorting logic for a legend when flattened, when not flattened the \\`legendSort\\` function is ignored.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const partitionLayout = select(\\n    'Partition Layout',\\n    {\\n      treemap: PartitionLayout.treemap,\\n      sunburst: PartitionLayout.sunburst,\\n      mosaic: PartitionLayout.mosaic,\\n      waffle: PartitionLayout.waffle,\\n    },\\n    PartitionLayout.sunburst,\\n  );\\n  const flatLegend = boolean('flatLegend', true);\\n  const showLegendExtra = boolean('showLegendExtra', false);\\n  const legendMaxDepth = number('legendMaxDepth', 2, {\\n    min: 0,\\n    max: 3,\\n    step: 1,\\n  });\\n  const legendStrategy = select('legendStrategy', LegendStrategy, LegendStrategy.Key as LegendStrategy);\\n  const maxLines = number('max legend label lines', 1, { min: 0, step: 1 });\\n\\n  const legendSortStrategy = select(\\n    'Custom legend sorting',\\n    { RegionsFirst: 'regionsFirst', ProductsFirst: 'productsFirst', DefaultSort: 'default' },\\n    'regionsFirst',\\n  );\\n\\n  const customLegendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\\n    if (legendSortStrategy === 'regionsFirst') {\\n      if (a.key in regionLookup && b.key in regionLookup) {\\n        return a.key.localeCompare(b.key);\\n      }\\n      return a.key in regionLookup ? -1 : b.key in regionLookup ? 1 : a.key.localeCompare(b.key);\\n    }\\n    if (a.key in productLookup && b.key in productLookup) {\\n      return a.key.localeCompare(b.key);\\n    }\\n    return a.key in productLookup ? -1 : b.key in productLookup ? 1 : a.key.localeCompare(b.key);\\n  };\\n\\n  const partitionTheme: PartialTheme['partition'] = {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  };\\n\\n  const isFlatLegendSupported =\\n    partitionLayout === PartitionLayout.treemap || partitionLayout === PartitionLayout.sunburst;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra={showLegendExtra}\\n        flatLegend={isFlatLegendSupported ? flatLegend : true}\\n        legendStrategy={legendStrategy}\\n        legendMaxDepth={legendMaxDepth}\\n        legendSort={legendSortStrategy !== 'default' ? customLegendSort : undefined}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: partitionTheme,\\n\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        layout={partitionLayout}\\n        data={mocks.miniSunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, LegendStrategy, Partition, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const flatLegend = boolean('flatLegend', false);\\n  const legendMaxDepth = number('legendMaxDepth', 2, {\\n    min: 0,\\n    max: 3,\\n    step: 1,\\n  });\\n\\n  type TestDatum = { cat1: string; cat2: string; val: number };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend={flatLegend}\\n        legendStrategy={select<LegendStrategy>('legendStrategy', LegendStrategy, LegendStrategy.Key)}\\n        legendMaxDepth={legendMaxDepth}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[\\n          { cat1: 'A', cat2: 'A', val: 1 },\\n          { cat1: 'A', cat2: 'B', val: 1 },\\n          { cat1: 'B', cat2: 'A', val: 1 },\\n          { cat1: 'B', cat2: 'B', val: 1 },\\n          { cat1: 'C', cat2: 'A', val: 1 },\\n          { cat1: 'C', cat2: 'B', val: 1 },\\n        ]}\\n        valueAccessor={(d: TestDatum) => d.val}\\n        layers={[\\n          {\\n            groupByRollup: (d: TestDatum) => d.cat1,\\n          },\\n          {\\n            groupByRollup: (d: TestDatum) => d.cat2,\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `Nested legend with reused node labels means that they can reoccur in various points of the legend tree.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, LegendStrategy, Partition, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const flatLegend = boolean('flatLegend', false);\n  const legendMaxDepth = number('legendMaxDepth', 2, {\n    min: 0,\n    max: 3,\n    step: 1,\n  });\n\n  type TestDatum = { cat1: string; cat2: string; val: number };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        flatLegend={flatLegend}\n        legendStrategy={select<LegendStrategy>('legendStrategy', LegendStrategy, LegendStrategy.Key)}\n        legendMaxDepth={legendMaxDepth}\n        baseTheme={useBaseTheme()}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={[\n          { cat1: 'A', cat2: 'A', val: 1 },\n          { cat1: 'A', cat2: 'B', val: 1 },\n          { cat1: 'B', cat2: 'A', val: 1 },\n          { cat1: 'B', cat2: 'B', val: 1 },\n          { cat1: 'C', cat2: 'A', val: 1 },\n          { cat1: 'C', cat2: 'B', val: 1 },\n        ]}\n        valueAccessor={(d: TestDatum) => d.val}\n        layers={[\n          {\n            groupByRollup: (d: TestDatum) => d.cat1,\n          },\n          {\n            groupByRollup: (d: TestDatum) => d.cat2,\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `Nested legend with reused node labels means that they can reoccur in various points of the legend tree.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const flatLegend = boolean('flatLegend', false);\\n  const legendMaxDepth = number('legendMaxDepth', 2, {\\n    min: 0,\\n    max: 3,\\n    step: 1,\\n  });\\n\\n  type TestDatum = { cat1: string; cat2: string; val: number };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        flatLegend={flatLegend}\\n        legendStrategy={select<LegendStrategy>('legendStrategy', LegendStrategy, LegendStrategy.Key)}\\n        legendMaxDepth={legendMaxDepth}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[\\n          { cat1: 'A', cat2: 'A', val: 1 },\\n          { cat1: 'A', cat2: 'B', val: 1 },\\n          { cat1: 'B', cat2: 'A', val: 1 },\\n          { cat1: 'B', cat2: 'B', val: 1 },\\n          { cat1: 'C', cat2: 'A', val: 1 },\\n          { cat1: 'C', cat2: 'B', val: 1 },\\n        ]}\\n        valueAccessor={(d: TestDatum) => d.val}\\n        layers={[\\n          {\\n            groupByRollup: (d: TestDatum) => d.cat1,\\n          },\\n          {\\n            groupByRollup: (d: TestDatum) => d.cat2,\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, LegendLabelOptions } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getColorPicker } from '../utils/components/get_color_picker';\\nimport { getLegendAction } from '../utils/components/get_legend_action';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst getLabelOptionKnobs = (): LegendLabelOptions => {\\n  const group = 'Label options';\\n\\n  return {\\n    maxLines: number('max label lines', 1, { min: 0, step: 1 }, group),\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hideActions = boolean('Hide legend action', false, 'Legend');\\n  const showLegendExtra = !boolean('Hide legend extra', false, 'Legend');\\n  const showColorPicker = !boolean('Hide color picker', true, 'Legend');\\n  const legendPosition = customKnobs.enum.position('Legend position', undefined, { group: 'Legend' });\\n  const euiPopoverPosition = customKnobs.enum.euiPopoverPosition(undefined, undefined, { group: 'Legend' });\\n  const labelOptions = getLabelOptionKnobs();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{ legend: { labelOptions } }}\\n        baseTheme={useBaseTheme()}\\n        showLegendExtra={showLegendExtra}\\n        legendPosition={legendPosition}\\n        legendAction={hideActions ? undefined : getLegendAction(euiPopoverPosition)}\\n        legendColorPicker={showColorPicker ? getColorPicker(euiPopoverPosition) : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown:\\n    'The `legendAction` action prop allows you to pass a render function/component that will render next to the legend item.\\\\n\\\\n __Note:__ the context menu, color picker and popover are supplied by [eui](https://elastic.github.io/eui/#).',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":62},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":62}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, LegendLabelOptions } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getColorPicker } from '../utils/components/get_color_picker';\nimport { getLegendAction } from '../utils/components/get_legend_action';\nimport { customKnobs } from '../utils/knobs';\n\nconst getLabelOptionKnobs = (): LegendLabelOptions => {\n  const group = 'Label options';\n\n  return {\n    maxLines: number('max label lines', 1, { min: 0, step: 1 }, group),\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hideActions = boolean('Hide legend action', false, 'Legend');\n  const showLegendExtra = !boolean('Hide legend extra', false, 'Legend');\n  const showColorPicker = !boolean('Hide color picker', true, 'Legend');\n  const legendPosition = customKnobs.enum.position('Legend position', undefined, { group: 'Legend' });\n  const euiPopoverPosition = customKnobs.enum.euiPopoverPosition(undefined, undefined, { group: 'Legend' });\n  const labelOptions = getLabelOptionKnobs();\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{ legend: { labelOptions } }}\n        baseTheme={useBaseTheme()}\n        showLegendExtra={showLegendExtra}\n        legendPosition={legendPosition}\n        legendAction={hideActions ? undefined : getLegendAction(euiPopoverPosition)}\n        legendColorPicker={showColorPicker ? getColorPicker(euiPopoverPosition) : undefined}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        data={TestDatasets.BARCHART_2Y2G}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown:\n    'The `legendAction` action prop allows you to pass a render function/component that will render next to the legend item.\\n\\n __Note:__ the context menu, color picker and popover are supplied by [eui](https://elastic.github.io/eui/#).',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hideActions = boolean('Hide legend action', false, 'Legend');\\n  const showLegendExtra = !boolean('Hide legend extra', false, 'Legend');\\n  const showColorPicker = !boolean('Hide color picker', true, 'Legend');\\n  const legendPosition = customKnobs.enum.position('Legend position', undefined, { group: 'Legend' });\\n  const euiPopoverPosition = customKnobs.enum.euiPopoverPosition(undefined, undefined, { group: 'Legend' });\\n  const labelOptions = getLabelOptionKnobs();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{ legend: { labelOptions } }}\\n        baseTheme={useBaseTheme()}\\n        showLegendExtra={showLegendExtra}\\n        legendPosition={legendPosition}\\n        legendAction={hideActions ? undefined : getLegendAction(euiPopoverPosition)}\\n        legendColorPicker={showColorPicker ? getColorPicker(euiPopoverPosition) : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { BARCHART_1Y1G } from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      theme={{\\n        legend: {\\n          margin: number('legend margins', 20, {\\n            min: 0,\\n          }),\\n          labelOptions: {\\n            maxLines: number('max legend label lines', 2, { min: 0, step: 1 }),\\n          },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={BARCHART_1Y1G}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown:\\n    'The `Theme.chartMargins` does not contain the legend element. Adding legend margins via `Theme.legend.margin` allows adding margins to the Left/right or Top/Bottom of the legend.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { BARCHART_1Y1G } from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      theme={{\n        legend: {\n          margin: number('legend margins', 20, {\n            min: 0,\n          }),\n          labelOptions: {\n            maxLines: number('max legend label lines', 2, { min: 0, step: 1 }),\n          },\n        },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars 1\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      splitSeriesAccessors={['g']}\n      data={BARCHART_1Y1G}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown:\n    'The `Theme.chartMargins` does not contain the legend element. Adding legend margins via `Theme.legend.margin` allows adding margins to the Left/right or Top/Bottom of the legend.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      theme={{\\n        legend: {\\n          margin: number('legend margins', 20, {\\n            min: 0,\\n          }),\\n          labelOptions: {\\n            maxLines: number('max legend label lines', 2, { min: 0, step: 1 }),\\n          },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars 1\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      splitSeriesAccessors={['g']}\\n      data={BARCHART_1Y1G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, boolean, number, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  LegendPositionConfig,\\n  VerticalAlignment,\\n  HorizontalAlignment,\\n  LayoutDirection,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getLegendAction } from '../utils/components/get_legend_action';\\n\\nconst dg = new SeededDataGenerator();\\nconst data = dg.generateGroupedSeries(10, 40);\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const numberOfSeries = number('Number of series', 5, { min: 1, max: 40, step: 1, range: true });\\n  const seriesWithLongName = number('Series with long name', 3, {\\n    min: 0,\\n    max: numberOfSeries - 1,\\n    step: 1,\\n    range: true,\\n  });\\n\\n  const floating: LegendPositionConfig['floating'] = boolean('Inside chart', true, 'Legend');\\n  const showAction = boolean('Show legend action', false, 'Legend');\\n  const floatingColumns: LegendPositionConfig['floatingColumns'] = number(\\n    'floating columns',\\n    2,\\n    { min: 1, max: 10, range: true, step: 1 },\\n    'Legend',\\n  );\\n  const vAlign: LegendPositionConfig['vAlign'] = select(\\n    'vAlign',\\n    {\\n      [Position.Top]: VerticalAlignment.Top,\\n      // not yet implemented\\n      // [VerticalAlignment.Middle]: VerticalAlignment.Middle,\\n      [Position.Bottom]: VerticalAlignment.Bottom,\\n    },\\n    Position.Bottom,\\n    'Legend',\\n  );\\n\\n  const hAlign: LegendPositionConfig['hAlign'] = select(\\n    'hAlign',\\n    {\\n      [Position.Left]: HorizontalAlignment.Left,\\n      // not yet implemented\\n      // [HorizontalAlignment.Center]: HorizontalAlignment.Center,\\n      [Position.Right]: HorizontalAlignment.Right,\\n    },\\n    Position.Right,\\n    'Legend',\\n  );\\n  const direction: LegendPositionConfig['direction'] = select(\\n    'direction',\\n    {\\n      ...LayoutDirection,\\n    },\\n    LayoutDirection.Vertical,\\n    'Legend',\\n  );\\n  const maxLines = number('max label lines', 1, { min: 0, step: 1 }, 'Legend');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={{\\n          vAlign,\\n          hAlign,\\n          direction,\\n          floating,\\n          floatingColumns,\\n        }}\\n        legendAction={showAction ? getLegendAction() : undefined}\\n        theme={{\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data.slice(0, numberOfSeries * 10).map((d, i) => {\\n          if (i >= seriesWithLongName * 10 && i < seriesWithLongName * 10 + 10) {\\n            return {\\n              ...d,\\n              g: text('long label', 'long name', 'Legend'),\\n            };\\n          }\\n          return d;\\n        })}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, boolean, number, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  LegendPositionConfig,\n  VerticalAlignment,\n  HorizontalAlignment,\n  LayoutDirection,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getLegendAction } from '../utils/components/get_legend_action';\n\nconst dg = new SeededDataGenerator();\nconst data = dg.generateGroupedSeries(10, 40);\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const numberOfSeries = number('Number of series', 5, { min: 1, max: 40, step: 1, range: true });\n  const seriesWithLongName = number('Series with long name', 3, {\n    min: 0,\n    max: numberOfSeries - 1,\n    step: 1,\n    range: true,\n  });\n\n  const floating: LegendPositionConfig['floating'] = boolean('Inside chart', true, 'Legend');\n  const showAction = boolean('Show legend action', false, 'Legend');\n  const floatingColumns: LegendPositionConfig['floatingColumns'] = number(\n    'floating columns',\n    2,\n    { min: 1, max: 10, range: true, step: 1 },\n    'Legend',\n  );\n  const vAlign: LegendPositionConfig['vAlign'] = select(\n    'vAlign',\n    {\n      [Position.Top]: VerticalAlignment.Top,\n      // not yet implemented\n      // [VerticalAlignment.Middle]: VerticalAlignment.Middle,\n      [Position.Bottom]: VerticalAlignment.Bottom,\n    },\n    Position.Bottom,\n    'Legend',\n  );\n\n  const hAlign: LegendPositionConfig['hAlign'] = select(\n    'hAlign',\n    {\n      [Position.Left]: HorizontalAlignment.Left,\n      // not yet implemented\n      // [HorizontalAlignment.Center]: HorizontalAlignment.Center,\n      [Position.Right]: HorizontalAlignment.Right,\n    },\n    Position.Right,\n    'Legend',\n  );\n  const direction: LegendPositionConfig['direction'] = select(\n    'direction',\n    {\n      ...LayoutDirection,\n    },\n    LayoutDirection.Vertical,\n    'Legend',\n  );\n  const maxLines = number('max label lines', 1, { min: 0, step: 1 }, 'Legend');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={{\n          vAlign,\n          hAlign,\n          direction,\n          floating,\n          floatingColumns,\n        }}\n        legendAction={showAction ? getLegendAction() : undefined}\n        theme={{\n          legend: { labelOptions: { maxLines } },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n      />\n      <AreaSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data.slice(0, numberOfSeries * 10).map((d, i) => {\n          if (i >= seriesWithLongName * 10 && i < seriesWithLongName * 10 + 10) {\n            return {\n              ...d,\n              g: text('long label', 'long name', 'Legend'),\n            };\n          }\n          return d;\n        })}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const numberOfSeries = number('Number of series', 5, { min: 1, max: 40, step: 1, range: true });\\n  const seriesWithLongName = number('Series with long name', 3, {\\n    min: 0,\\n    max: numberOfSeries - 1,\\n    step: 1,\\n    range: true,\\n  });\\n\\n  const floating: LegendPositionConfig['floating'] = boolean('Inside chart', true, 'Legend');\\n  const showAction = boolean('Show legend action', false, 'Legend');\\n  const floatingColumns: LegendPositionConfig['floatingColumns'] = number(\\n    'floating columns',\\n    2,\\n    { min: 1, max: 10, range: true, step: 1 },\\n    'Legend',\\n  );\\n  const vAlign: LegendPositionConfig['vAlign'] = select(\\n    'vAlign',\\n    {\\n      [Position.Top]: VerticalAlignment.Top,\\n      // not yet implemented\\n      // [VerticalAlignment.Middle]: VerticalAlignment.Middle,\\n      [Position.Bottom]: VerticalAlignment.Bottom,\\n    },\\n    Position.Bottom,\\n    'Legend',\\n  );\\n\\n  const hAlign: LegendPositionConfig['hAlign'] = select(\\n    'hAlign',\\n    {\\n      [Position.Left]: HorizontalAlignment.Left,\\n      // not yet implemented\\n      // [HorizontalAlignment.Center]: HorizontalAlignment.Center,\\n      [Position.Right]: HorizontalAlignment.Right,\\n    },\\n    Position.Right,\\n    'Legend',\\n  );\\n  const direction: LegendPositionConfig['direction'] = select(\\n    'direction',\\n    {\\n      ...LayoutDirection,\\n    },\\n    LayoutDirection.Vertical,\\n    'Legend',\\n  );\\n  const maxLines = number('max label lines', 1, { min: 0, step: 1 }, 'Legend');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={{\\n          vAlign,\\n          hAlign,\\n          direction,\\n          floating,\\n          floatingColumns,\\n        }}\\n        legendAction={showAction ? getLegendAction() : undefined}\\n        theme={{\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n      />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data.slice(0, numberOfSeries * 10).map((d, i) => {\\n          if (i >= seriesWithLongName * 10 && i < seriesWithLongName * 10 + 10) {\\n            return {\\n              ...d,\\n              g: text('long label', 'long name', 'Legend'),\\n            };\\n          }\\n          return d;\\n        })}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { BarSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rng = getRandomNumberGenerator();\\n  const maxLines = number('max label lines', 0, { min: 0, step: 1 });\\n  const seriesCount = number('series count', 1, { min: 1, step: 1 });\\n  const data = [\\n    { x: 0, y: 2 },\\n    { x: 1, y: 7 },\\n    { x: 2, y: 3 },\\n    { x: 3, y: 6 },\\n  ];\\n  const renderMoreSeries = () => {\\n    const series: JSX.Element[] = [];\\n\\n    for (let i = 1; i < seriesCount; i++) {\\n      series.push(\\n        <BarSeries\\n          id={`bars${i}`}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          name={`Another long series name - ${i}`}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          data={data.map(({ x, y }) => ({ x, y: y + rng(0, 5) }))}\\n        />,\\n      );\\n    }\\n\\n    return series;\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position('legend position', 'top')}\\n        theme={{\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <BarSeries\\n        id=\\\"bars0\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        name=\\\"Id elit mollit ut est laborum. Lorem laboris laboris laboris quis dolore incididunt eiusmod fugiat nulla culpa dolore exercitation dolore. Voluptate ipsum cillum cillum in ullamco elit eiusmod labore incididunt excepteur. Duis id laboris consequat aliqua officia non ex nisi commodo. Ut do do voluptate sunt sunt cupidatat ea ad.\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={data}\\n      />\\n      {renderMoreSeries()}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":71},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":71}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { BarSeries, Chart, ScaleType, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rng = getRandomNumberGenerator();\n  const maxLines = number('max label lines', 0, { min: 0, step: 1 });\n  const seriesCount = number('series count', 1, { min: 1, step: 1 });\n  const data = [\n    { x: 0, y: 2 },\n    { x: 1, y: 7 },\n    { x: 2, y: 3 },\n    { x: 3, y: 6 },\n  ];\n  const renderMoreSeries = () => {\n    const series: JSX.Element[] = [];\n\n    for (let i = 1; i < seriesCount; i++) {\n      series.push(\n        <BarSeries\n          id={`bars${i}`}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          name={`Another long series name - ${i}`}\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          data={data.map(({ x, y }) => ({ x, y: y + rng(0, 5) }))}\n        />,\n      );\n    }\n\n    return series;\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={customKnobs.enum.position('legend position', 'top')}\n        theme={{\n          legend: { labelOptions: { maxLines } },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <BarSeries\n        id=\"bars0\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        name=\"Id elit mollit ut est laborum. Lorem laboris laboris laboris quis dolore incididunt eiusmod fugiat nulla culpa dolore exercitation dolore. Voluptate ipsum cillum cillum in ullamco elit eiusmod labore incididunt excepteur. Duis id laboris consequat aliqua officia non ex nisi commodo. Ut do do voluptate sunt sunt cupidatat ea ad.\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={data}\n      />\n      {renderMoreSeries()}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rng = getRandomNumberGenerator();\\n  const maxLines = number('max label lines', 0, { min: 0, step: 1 });\\n  const seriesCount = number('series count', 1, { min: 1, step: 1 });\\n  const data = [\\n    { x: 0, y: 2 },\\n    { x: 1, y: 7 },\\n    { x: 2, y: 3 },\\n    { x: 3, y: 6 },\\n  ];\\n  const renderMoreSeries = () => {\\n    const series: JSX.Element[] = [];\\n\\n    for (let i = 1; i < seriesCount; i++) {\\n      series.push(\\n        <BarSeries\\n          id={`bars${i}`}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          name={`Another long series name - ${i}`}\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          data={data.map(({ x, y }) => ({ x, y: y + rng(0, 5) }))}\\n        />,\\n      );\\n    }\\n\\n    return series;\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position('legend position', 'top')}\\n        theme={{\\n          legend: { labelOptions: { maxLines } },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <BarSeries\\n        id=\\\"bars0\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        name=\\\"Id elit mollit ut est laborum. Lorem laboris laboris laboris quis dolore incididunt eiusmod fugiat nulla culpa dolore exercitation dolore. Voluptate ipsum cillum cillum in ullamco elit eiusmod labore incididunt excepteur. Duis id laboris consequat aliqua officia non ex nisi commodo. Ut do do voluptate sunt sunt cupidatat ea ad.\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={data}\\n      />\\n      {renderMoreSeries()}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { XYChartSeriesIdentifier } from '../../../packages/charts/src/chart_types/xy_chart/utils/series';\\nimport { SeriesIdentifier } from '../../../packages/charts/src/common/series_id';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data: Array<[number, string, number]> = [\\n    [2010, 'Apple', 10],\\n    [2010, 'Orange', 6],\\n    [2010, 'Banana', 4],\\n    [2011, 'Apple', 9],\\n    [2011, 'Orange', 6],\\n    [2011, 'Banana', 2],\\n    [2012, 'Apple', 7],\\n    [2012, 'Orange', 3],\\n    [2012, 'Banana', 3],\\n    [2013, 'Apple', 12],\\n    [2013, 'Orange', 10],\\n    [2013, 'Banana', 5],\\n  ];\\n  // the sorting value can be part of the dataset or externally defined\\n  const categoricalIndex: Array<unknown> = ['Apple', 'Orange', 'Banana'];\\n\\n  const reverseSort = boolean('reverse', true);\\n  const defaultSort = boolean('default sort', false);\\n\\n  const legendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\\n    // extract the value from the accessors to identify the current selected series\\n    // the SeriesIdentifier can be casted to the chart type specific one\\n    const categoryA = (a as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\\n    const categoryB = (b as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\\n    // find the index of each series\\n    const catAIndex = categoricalIndex.indexOf(categoryA);\\n    const catBIndex = categoricalIndex.indexOf(categoryB);\\n    // compare the indices and return the order\\n    return reverseSort ? catAIndex - catBIndex : catBIndex - catAIndex;\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} legendSort={defaultSort ? undefined : legendSort} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"[2010-2013] harvest\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} ticks={4} tickFormat={(d) => `${d} tons`} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[2]}\\n        splitSeriesAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data}\\n        yNice\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":70},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":70}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { XYChartSeriesIdentifier } from '../../../packages/charts/src/chart_types/xy_chart/utils/series';\nimport { SeriesIdentifier } from '../../../packages/charts/src/common/series_id';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data: Array<[number, string, number]> = [\n    [2010, 'Apple', 10],\n    [2010, 'Orange', 6],\n    [2010, 'Banana', 4],\n    [2011, 'Apple', 9],\n    [2011, 'Orange', 6],\n    [2011, 'Banana', 2],\n    [2012, 'Apple', 7],\n    [2012, 'Orange', 3],\n    [2012, 'Banana', 3],\n    [2013, 'Apple', 12],\n    [2013, 'Orange', 10],\n    [2013, 'Banana', 5],\n  ];\n  // the sorting value can be part of the dataset or externally defined\n  const categoricalIndex: Array<unknown> = ['Apple', 'Orange', 'Banana'];\n\n  const reverseSort = boolean('reverse', true);\n  const defaultSort = boolean('default sort', false);\n\n  const legendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\n    // extract the value from the accessors to identify the current selected series\n    // the SeriesIdentifier can be casted to the chart type specific one\n    const categoryA = (a as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\n    const categoryB = (b as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\n    // find the index of each series\n    const catAIndex = categoricalIndex.indexOf(categoryA);\n    const catBIndex = categoricalIndex.indexOf(categoryB);\n    // compare the indices and return the order\n    return reverseSort ? catAIndex - catBIndex : catBIndex - catAIndex;\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend baseTheme={useBaseTheme()} legendSort={defaultSort ? undefined : legendSort} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"[2010-2013] harvest\" showOverlappingTicks />\n      <Axis id=\"left2\" position={Position.Left} ticks={4} tickFormat={(d) => `${d} tons`} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[2]}\n        splitSeriesAccessors={[1]}\n        stackAccessors={[0]}\n        data={data}\n        yNice\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data: Array<[number, string, number]> = [\\n    [2010, 'Apple', 10],\\n    [2010, 'Orange', 6],\\n    [2010, 'Banana', 4],\\n    [2011, 'Apple', 9],\\n    [2011, 'Orange', 6],\\n    [2011, 'Banana', 2],\\n    [2012, 'Apple', 7],\\n    [2012, 'Orange', 3],\\n    [2012, 'Banana', 3],\\n    [2013, 'Apple', 12],\\n    [2013, 'Orange', 10],\\n    [2013, 'Banana', 5],\\n  ];\\n  // the sorting value can be part of the dataset or externally defined\\n  const categoricalIndex: Array<unknown> = ['Apple', 'Orange', 'Banana'];\\n\\n  const reverseSort = boolean('reverse', true);\\n  const defaultSort = boolean('default sort', false);\\n\\n  const legendSort = (a: SeriesIdentifier, b: SeriesIdentifier) => {\\n    // extract the value from the accessors to identify the current selected series\\n    // the SeriesIdentifier can be casted to the chart type specific one\\n    const categoryA = (a as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\\n    const categoryB = (b as XYChartSeriesIdentifier)?.splitAccessors?.get(1) ?? '';\\n    // find the index of each series\\n    const catAIndex = categoricalIndex.indexOf(categoryA);\\n    const catBIndex = categoricalIndex.indexOf(categoryB);\\n    // compare the indices and return the order\\n    return reverseSort ? catAIndex - catBIndex : catBIndex - catAIndex;\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} legendSort={defaultSort ? undefined : legendSort} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"[2010-2013] harvest\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} ticks={4} tickFormat={(d) => `${d} tons`} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[2]}\\n        splitSeriesAccessors={[1]}\\n        stackAccessors={[0]}\\n        data={data}\\n        yNice\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  AreaSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  CustomLegend,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\nconst data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\\n  ...d,\\n  KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\\n]);\\nconst data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\\n  ...d,\\n  KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\\n]);\\nconst data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\\n  ...d,\\n  KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\\n]);\\nconst allMetrics = [...data3, ...data2, ...data1];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customLegend: CustomLegend = ({ items, pointerValue }) => (\\n    <div style={{ width: '100%', position: 'relative' }}>\\n      <p style={{ height: '1.5em' }}>{pointerValue ? moment(pointerValue?.value).format('HH:mm') : 'System Load'}</p>\\n      {items.map((i) => (\\n        <button\\n          key={i.seriesIdentifiers[0].key}\\n          onMouseOver={i.onItemOverActon}\\n          onMouseOut={i.onItemOutAction}\\n          onClick={() => i.onItemClickAction(false)}\\n          style={{ display: 'block', color: i.isSeriesHidden ? 'gray' : i.color }}\\n        >\\n          {i.label} {i.extraValue?.formatted}\\n        </button>\\n      ))}\\n    </div>\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n        customLegend={customLegend}\\n        legendSize={100} // always specify a fixed size for a custom legend\\n      />\\n      <Tooltip customTooltip={() => null} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis id=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} ticks={5} />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        splitSeriesAccessors={[2]}\\n        data={allMetrics}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `When using a custom legend, please always specify a fixed \\\\`legendSize\\\\` in the \\\\`Settings\\\\` prop to avoid a wrongly computed default legend size.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":43},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":43},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment';\nimport React from 'react';\n\nimport {\n  Axis,\n  AreaSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  CustomLegend,\n  Tooltip,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\nconst data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data.map((d) => [\n  ...d,\n  KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label,\n]);\nconst data2 = KIBANA_METRICS.metrics.kibana_os_load.v2.data.map((d) => [\n  ...d,\n  KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label,\n]);\nconst data3 = KIBANA_METRICS.metrics.kibana_os_load.v3.data.map((d) => [\n  ...d,\n  KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label,\n]);\nconst allMetrics = [...data3, ...data2, ...data1];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customLegend: CustomLegend = ({ items, pointerValue }) => (\n    <div style={{ width: '100%', position: 'relative' }}>\n      <p style={{ height: '1.5em' }}>{pointerValue ? moment(pointerValue?.value).format('HH:mm') : 'System Load'}</p>\n      {items.map((i) => (\n        <button\n          key={i.seriesIdentifiers[0].key}\n          onMouseOver={i.onItemOverActon}\n          onMouseOut={i.onItemOutAction}\n          onClick={() => i.onItemClickAction(false)}\n          style={{ display: 'block', color: i.isSeriesHidden ? 'gray' : i.color }}\n        >\n          {i.label} {i.extraValue?.formatted}\n        </button>\n      ))}\n    </div>\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        baseTheme={useBaseTheme()}\n        customLegend={customLegend}\n        legendSize={100} // always specify a fixed size for a custom legend\n      />\n      <Tooltip customTooltip={() => null} />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n      <Axis id=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} ticks={5} />\n      <AreaSeries\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        stackAccessors={[0]}\n        splitSeriesAccessors={[2]}\n        data={allMetrics}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `When using a custom legend, please always specify a fixed \\`legendSize\\` in the \\`Settings\\` prop to avoid a wrongly computed default legend size.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customLegend: CustomLegend = ({ items, pointerValue }) => (\\n    <div style={{ width: '100%', position: 'relative' }}>\\n      <p style={{ height: '1.5em' }}>{pointerValue ? moment(pointerValue?.value).format('HH:mm') : 'System Load'}</p>\\n      {items.map((i) => (\\n        <button\\n          key={i.seriesIdentifiers[0].key}\\n          onMouseOver={i.onItemOverActon}\\n          onMouseOut={i.onItemOutAction}\\n          onClick={() => i.onItemClickAction(false)}\\n          style={{ display: 'block', color: i.isSeriesHidden ? 'gray' : i.color }}\\n        >\\n          {i.label} {i.extraValue?.formatted}\\n        </button>\\n      ))}\\n    </div>\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n        customLegend={customLegend}\\n        legendSize={100} // always specify a fixed size for a custom legend\\n      />\\n      <Tooltip customTooltip={() => null} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis id=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} ticks={5} />\\n      <AreaSeries\\n        id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        stackAccessors={[0]}\\n        splitSeriesAccessors={[2]}\\n        data={allMetrics}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { getLegendSizeKnob } from './legend_size_knob';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position()}\\n        rotation={customKnobs.enum.rotation()}\\n        baseTheme={useBaseTheme()}\\n        legendSize={getLegendSizeKnob()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n        hideInLegend={false}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { getLegendSizeKnob } from './legend_size_knob';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={customKnobs.enum.position()}\n        rotation={customKnobs.enum.rotation()}\n        baseTheme={useBaseTheme()}\n        legendSize={getLegendSizeKnob()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        data={TestDatasets.BARCHART_2Y2G}\n        hideInLegend={false}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={customKnobs.enum.position()}\\n        rotation={customKnobs.enum.rotation()}\\n        baseTheme={useBaseTheme()}\\n        legendSize={getLegendSizeKnob()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        data={TestDatasets.BARCHART_2Y2G}\\n        hideInLegend={false}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const splitSeries = boolean('split series', true) ? ['g1', 'g2'] : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Top} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={splitSeries}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const splitSeries = boolean('split series', true) ? ['g1', 'g2'] : undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Top} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={splitSeries}\n        data={TestDatasets.BARCHART_2Y2G}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const splitSeries = boolean('split series', true) ? ['g1', 'g2'] : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Top} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={splitSeries}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hideBarSeriesInLegend = boolean('hide bar series in legend', false);\\n  const hideLineSeriesInLegend = boolean('hide line series in legend', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n        hideInLegend={hideBarSeriesInLegend}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n        hideInLegend={hideLineSeriesInLegend}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hideBarSeriesInLegend = boolean('hide bar series in legend', false);\n  const hideLineSeriesInLegend = boolean('hide line series in legend', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n        hideInLegend={hideBarSeriesInLegend}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n        hideInLegend={hideLineSeriesInLegend}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hideBarSeriesInLegend = boolean('hide bar series in legend', false);\\n  const hideLineSeriesInLegend = boolean('hide line series in legend', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n        hideInLegend={hideBarSeriesInLegend}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n        hideInLegend={hideLineSeriesInLegend}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    legend: {\\n      spacingBuffer: number('legend buffer value', 80),\\n      labelOptions: {\\n        maxLines: number('max legend label lines', 0, { min: 0, step: 1 }),\\n      },\\n    },\\n  };\\n  const longLabels = boolean('use long labels', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={longLabels ? 'Elit exercitation dolore fugiat aliquip Lorem commodo' : 'bars 1'}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 100000000 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <BarSeries\\n        id={\\n          longLabels\\n            ? 'Laborum consectetur ut esse aute sunt adipisicing laboris reprehenderit eu officia labore in laborum'\\n            : 'bars 2'\\n        }\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 100000000 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    legend: {\n      spacingBuffer: number('legend buffer value', 80),\n      labelOptions: {\n        maxLines: number('max legend label lines', 0, { min: 0, step: 1 }),\n      },\n    },\n  };\n  const longLabels = boolean('use long labels', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id={longLabels ? 'Elit exercitation dolore fugiat aliquip Lorem commodo' : 'bars 1'}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 100000000 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <BarSeries\n        id={\n          longLabels\n            ? 'Laborum consectetur ut esse aute sunt adipisicing laboris reprehenderit eu officia labore in laborum'\n            : 'bars 2'\n        }\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 100000000 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    legend: {\\n      spacingBuffer: number('legend buffer value', 80),\\n      labelOptions: {\\n        maxLines: number('max legend label lines', 0, { min: 0, step: 1 }),\\n      },\\n    },\\n  };\\n  const longLabels = boolean('use long labels', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id={longLabels ? 'Elit exercitation dolore fugiat aliquip Lorem commodo' : 'bars 1'}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 100000000 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <BarSeries\\n        id={\\n          longLabels\\n            ? 'Laborum consectetur ut esse aute sunt adipisicing laboris reprehenderit eu officia labore in laborum'\\n            : 'bars 2'\\n        }\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 100000000 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React, { useState, useMemo } from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  LegendColorPicker,\\n  Color,\\n  SeriesKey,\\n  toEntries,\\n} from '@elastic/charts';\\nimport { BARCHART_1Y1G } from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getColorPicker } from '../utils/components/get_color_picker';\\nimport { getLegendAction } from '../utils/components/get_legend_action';\\n\\nconst onChangeAction = action('onChange');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const [colors, setColors] = useState<Record<SeriesKey, Color | null>>({});\\n  const showAction = boolean('show legend action', false);\\n\\n  const CustomColorPicker: LegendColorPicker = useMemo(\\n    () =>\\n      ({ anchor, color, onClose, seriesIdentifiers, onChange }) => {\\n        const handleClose = () => {\\n          onClose();\\n          setColors((prevColors) => ({\\n            ...prevColors,\\n            ...toEntries(seriesIdentifiers, 'key', color),\\n          }));\\n        };\\n        const handleChange = (c: Color | null) => {\\n          setColors((prevColors) => ({\\n            ...prevColors,\\n            ...toEntries(seriesIdentifiers, 'key', c),\\n          }));\\n          onChange(c);\\n          onChangeAction(c);\\n        };\\n\\n        return getColorPicker()({\\n          anchor,\\n          color,\\n          onClose: handleClose,\\n          onChange: handleChange,\\n          seriesIdentifiers,\\n        });\\n      },\\n    [setColors],\\n  );\\n  CustomColorPicker.displayName = 'CustomColorPicker';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        legendColorPicker={CustomColorPicker}\\n        baseTheme={useBaseTheme()}\\n        legendAction={showAction ? getLegendAction() : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={BARCHART_1Y1G}\\n        color={({ key }) => colors[key] ?? null}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown:\\n    'Elastic charts will maintain the color selection in memory beyond chart updates. However, to persist colors beyond browser refresh the consumer would need to manage the color state and use the color prop on the SeriesSpec to assign a color via a SeriesColorAccessor.\\\\n\\\\n __Note:__ the context menu, color picker and popover are supplied by [eui](https://elastic.github.io/eui/#).',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport React, { useState, useMemo } from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  LegendColorPicker,\n  Color,\n  SeriesKey,\n  toEntries,\n} from '@elastic/charts';\nimport { BARCHART_1Y1G } from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getColorPicker } from '../utils/components/get_color_picker';\nimport { getLegendAction } from '../utils/components/get_legend_action';\n\nconst onChangeAction = action('onChange');\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const [colors, setColors] = useState<Record<SeriesKey, Color | null>>({});\n  const showAction = boolean('show legend action', false);\n\n  const CustomColorPicker: LegendColorPicker = useMemo(\n    () =>\n      ({ anchor, color, onClose, seriesIdentifiers, onChange }) => {\n        const handleClose = () => {\n          onClose();\n          setColors((prevColors) => ({\n            ...prevColors,\n            ...toEntries(seriesIdentifiers, 'key', color),\n          }));\n        };\n        const handleChange = (c: Color | null) => {\n          setColors((prevColors) => ({\n            ...prevColors,\n            ...toEntries(seriesIdentifiers, 'key', c),\n          }));\n          onChange(c);\n          onChangeAction(c);\n        };\n\n        return getColorPicker()({\n          anchor,\n          color,\n          onClose: handleClose,\n          onChange: handleChange,\n          seriesIdentifiers,\n        });\n      },\n    [setColors],\n  );\n  CustomColorPicker.displayName = 'CustomColorPicker';\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        legendColorPicker={CustomColorPicker}\n        baseTheme={useBaseTheme()}\n        legendAction={showAction ? getLegendAction() : undefined}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={BARCHART_1Y1G}\n        color={({ key }) => colors[key] ?? null}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown:\n    'Elastic charts will maintain the color selection in memory beyond chart updates. However, to persist colors beyond browser refresh the consumer would need to manage the color state and use the color prop on the SeriesSpec to assign a color via a SeriesColorAccessor.\\n\\n __Note:__ the context menu, color picker and popover are supplied by [eui](https://elastic.github.io/eui/#).',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const [colors, setColors] = useState<Record<SeriesKey, Color | null>>({});\\n  const showAction = boolean('show legend action', false);\\n\\n  const CustomColorPicker: LegendColorPicker = useMemo(\\n    () =>\\n      ({ anchor, color, onClose, seriesIdentifiers, onChange }) => {\\n        const handleClose = () => {\\n          onClose();\\n          setColors((prevColors) => ({\\n            ...prevColors,\\n            ...toEntries(seriesIdentifiers, 'key', color),\\n          }));\\n        };\\n        const handleChange = (c: Color | null) => {\\n          setColors((prevColors) => ({\\n            ...prevColors,\\n            ...toEntries(seriesIdentifiers, 'key', c),\\n          }));\\n          onChange(c);\\n          onChangeAction(c);\\n        };\\n\\n        return getColorPicker()({\\n          anchor,\\n          color,\\n          onClose: handleClose,\\n          onChange: handleChange,\\n          seriesIdentifiers,\\n        });\\n      },\\n    [setColors],\\n  );\\n  CustomColorPicker.displayName = 'CustomColorPicker';\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        legendColorPicker={CustomColorPicker}\\n        baseTheme={useBaseTheme()}\\n        legendAction={showAction ? getLegendAction() : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={BARCHART_1Y1G}\\n        color={({ key }) => colors[key] ?? null}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Legend',\n};\n\nexport { Example as positioning } from './1_legend_positioning.story';\nexport { Example as insideChart } from './13_inside_chart.story';\nexport { Example as changingSpecs } from './5_changing_specs.story';\nexport { Example as hideLegendItemsBySeries } from './6_hide_legend.story';\nexport { Example as legendSpacingBuffer } from './8_spacing_buffer.story';\nexport { Example as colorPicker } from './9_color_picker.story';\nexport { Example as piechart } from './10_sunburst.story';\nexport { Example as piechartRepeatedLabels } from './10_sunburst_repeated_label.story';\nexport { Example as actions } from './11_legend_actions.story';\nexport { Example as margins } from './12_legend_margins.story';\nexport { Example as singleSeries } from './14_single_series.story';\nexport { Example as sortItems } from './15_legend_sort.story';\nexport { Example as customLegend } from './16_custom_legend.story';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\n\nexport const getLegendSizeKnob = (group?: string) => {\n  const enabled = boolean('enable legend size', false, group);\n  const size = enabled ? number('legend size', 200, { min: 0, step: 1 }, group) : NaN;\n  return size;\n};\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { shuffle } from 'lodash';\\nimport React from 'react';\\n\\nimport { Axis, LineSeries, Chart, Position, ScaleType, Settings, Direction } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n/**\\n * Data to defined consistent order of series when using shuffle\\n */\\nconst data1 = [\\n  // DestAirportID: Descending\\tCarrier: Descending\\tMax AvgTicketPrice\\tAverage AvgTicketPrice\\tTest\\n  { x: 'XIY', g: 'JetBeats', y1: 1195.87316894531, y2: 735.960746071555, z: 735.960746071555 },\\n  { x: 'XIY', g: 'Kibana Airlines', y1: 1079.14624023438, y2: 742.831329345703, z: 742.831329345703 },\\n  { x: 'XIY', g: 'ES-Air', y1: 929.561462402344, y2: 765.738806152344, z: 765.738806152344 },\\n  { x: 'XIY', g: 'Logstash Airways', y1: 836.307922363281, y2: 487.398278808594, z: 487.398278808594 },\\n];\\n\\nconst data2 = [\\n  { x: 'XHBU', g: 'JetBeats', y1: 1193.38342285156, y2: 702.543407440186, z: 702.543407440186 },\\n  { x: 'XHBU', g: 'Kibana Airlines', y1: 1159.03503417969, y2: 606.558886210124, z: 606.558886210124 },\\n  { x: 'XHBU', g: 'ES-Air', y1: 996.849731445313, y2: 752.394683837891, z: 752.394683837891 },\\n  { x: 'XHBU', g: 'Logstash Airways', y1: 909.167602539063, y2: 564.171913146973, z: 564.171913146973 },\\n  { x: 'NGO', g: 'ES-Air', y1: 1189.08776855469, y2: 1189.08776855469, z: 1189.08776855469 },\\n  { x: 'SCL', g: 'Logstash Airways', y1: 1176.63818359375, y2: 1031.0576171875, z: 1031.0576171875 },\\n  { x: 'VE05', g: 'Kibana Airlines', y1: 1189.53845214844, y2: 563.195382859972, z: 563.195382859972 },\\n  { x: 'VE05', g: 'Logstash Airways', y1: 998.839538574219, y2: 467.636221313477, z: 467.636221313477 },\\n  { x: 'VE05', g: 'JetBeats', y1: 900.798461914063, y2: 569.146169026693, z: 569.146169026693 },\\n  { x: 'VE05', g: 'ES-Air', y1: 820.462463378906, y2: 541.392608642578, z: 541.392608642578 },\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        orderOrdinalBinsBy={\\n          orderOrdinalBinsBy\\n            ? {\\n                direction: Direction.Descending,\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\\n\\n      <LineSeries\\n        id=\\\"bars1\\\"\\n        fit=\\\"linear\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={boolean('Stacked', true) ? ['g'] : undefined}\\n        data={[...data1, ...(orderOrdinalBinsBy ? shuffle(data2) : data2)]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport { shuffle } from 'lodash';\nimport React from 'react';\n\nimport { Axis, LineSeries, Chart, Position, ScaleType, Settings, Direction } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n/**\n * Data to defined consistent order of series when using shuffle\n */\nconst data1 = [\n  // DestAirportID: Descending\tCarrier: Descending\tMax AvgTicketPrice\tAverage AvgTicketPrice\tTest\n  { x: 'XIY', g: 'JetBeats', y1: 1195.87316894531, y2: 735.960746071555, z: 735.960746071555 },\n  { x: 'XIY', g: 'Kibana Airlines', y1: 1079.14624023438, y2: 742.831329345703, z: 742.831329345703 },\n  { x: 'XIY', g: 'ES-Air', y1: 929.561462402344, y2: 765.738806152344, z: 765.738806152344 },\n  { x: 'XIY', g: 'Logstash Airways', y1: 836.307922363281, y2: 487.398278808594, z: 487.398278808594 },\n];\n\nconst data2 = [\n  { x: 'XHBU', g: 'JetBeats', y1: 1193.38342285156, y2: 702.543407440186, z: 702.543407440186 },\n  { x: 'XHBU', g: 'Kibana Airlines', y1: 1159.03503417969, y2: 606.558886210124, z: 606.558886210124 },\n  { x: 'XHBU', g: 'ES-Air', y1: 996.849731445313, y2: 752.394683837891, z: 752.394683837891 },\n  { x: 'XHBU', g: 'Logstash Airways', y1: 909.167602539063, y2: 564.171913146973, z: 564.171913146973 },\n  { x: 'NGO', g: 'ES-Air', y1: 1189.08776855469, y2: 1189.08776855469, z: 1189.08776855469 },\n  { x: 'SCL', g: 'Logstash Airways', y1: 1176.63818359375, y2: 1031.0576171875, z: 1031.0576171875 },\n  { x: 'VE05', g: 'Kibana Airlines', y1: 1189.53845214844, y2: 563.195382859972, z: 563.195382859972 },\n  { x: 'VE05', g: 'Logstash Airways', y1: 998.839538574219, y2: 467.636221313477, z: 467.636221313477 },\n  { x: 'VE05', g: 'JetBeats', y1: 900.798461914063, y2: 569.146169026693, z: 569.146169026693 },\n  { x: 'VE05', g: 'ES-Air', y1: 820.462463378906, y2: 541.392608642578, z: 541.392608642578 },\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        orderOrdinalBinsBy={\n          orderOrdinalBinsBy\n            ? {\n                direction: Direction.Descending,\n              }\n            : undefined\n        }\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left2\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\n\n      <LineSeries\n        id=\"bars1\"\n        fit=\"linear\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={boolean('Stacked', true) ? ['g'] : undefined}\n        data={[...data1, ...(orderOrdinalBinsBy ? shuffle(data2) : data2)]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const orderOrdinalBinsBy = boolean('enable orderOrdinalBinsBy', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        orderOrdinalBinsBy={\\n          orderOrdinalBinsBy\\n            ? {\\n                direction: Direction.Descending,\\n              }\\n            : undefined\\n        }\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" position={Position.Left} tickFormat={(d: any) => `$${Number(d).toFixed(2)}`} />\\n\\n      <LineSeries\\n        id=\\\"bars1\\\"\\n        fit=\\\"linear\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={boolean('Stacked', true) ? ['g'] : undefined}\\n        data={[...data1, ...(orderOrdinalBinsBy ? shuffle(data2) : data2)]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings, Fit, AreaSeries } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fitEnabled = boolean('enable fit function', false);\\n  const isArea = boolean('switch to area', false);\\n  const LineOrAreaSeries = isArea ? AreaSeries : LineSeries;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n\\n      <LineOrAreaSeries\\n        id=\\\"series 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        data={[\\n          [0, 10],\\n          [1, 12],\\n          [2, 14],\\n          [3, 15],\\n          [4, 5],\\n          [5, 6],\\n          [6, 9],\\n          [8, 11],\\n        ]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n\\n      <LineOrAreaSeries\\n        id=\\\"series 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        data={[\\n          [0, 3],\\n          [1, 3.5],\\n          [3, 4],\\n          [4, 8],\\n          [6, 3],\\n          [7, 2],\\n        ]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, CurveType, LineSeries, Position, ScaleType, Settings, Fit, AreaSeries } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fitEnabled = boolean('enable fit function', false);\n  const isArea = boolean('switch to area', false);\n  const LineOrAreaSeries = isArea ? AreaSeries : LineSeries;\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"x\" position={Position.Bottom} />\n      <Axis id=\"y\" position={Position.Left} />\n\n      <LineOrAreaSeries\n        id=\"series 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        fit={fitEnabled ? Fit.Linear : undefined}\n        data={[\n          [0, 10],\n          [1, 12],\n          [2, 14],\n          [3, 15],\n          [4, 5],\n          [5, 6],\n          [6, 9],\n          [8, 11],\n        ]}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n\n      <LineOrAreaSeries\n        id=\"series 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        fit={fitEnabled ? Fit.Linear : undefined}\n        data={[\n          [0, 3],\n          [1, 3.5],\n          [3, 4],\n          [4, 8],\n          [6, 3],\n          [7, 2],\n        ]}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fitEnabled = boolean('enable fit function', false);\\n  const isArea = boolean('switch to area', false);\\n  const LineOrAreaSeries = isArea ? AreaSeries : LineSeries;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n\\n      <LineOrAreaSeries\\n        id=\\\"series 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        data={[\\n          [0, 10],\\n          [1, 12],\\n          [2, 14],\\n          [3, 15],\\n          [4, 5],\\n          [5, 6],\\n          [6, 9],\\n          [8, 11],\\n        ]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n\\n      <LineOrAreaSeries\\n        id=\\\"series 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        data={[\\n          [0, 3],\\n          [1, 3.5],\\n          [3, 4],\\n          [4, 8],\\n          [6, 3],\\n          [7, 2],\\n        ]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, CurveType, Position, ScaleType, Settings, Fit } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fitEnabled = boolean('enable fit function', false);\\n  const [Series] = customKnobs.enum.xySeries('series type', 'line', { exclude: ['bar', 'bubble'] });\\n  const maxDataPoints = number('max data points', 60, {\\n    range: true,\\n    min: 0,\\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data.length,\\n    step: 1,\\n  });\\n  const pointRadius = number('default point radius', 0, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const radius = number('isolated point radius', 2, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const overrideRadius = number('override point radius', 0, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const overridePointRadius = boolean('override radius for isolated points', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        legendPosition={Position.Right}\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n              radius: pointRadius,\\n            },\\n            isolatedPoint: {\\n              radius,\\n              shape: customKnobs.enum.pointShape(),\\n            },\\n          },\\n          lineSeriesStyle: {\\n            point: {\\n              visible: true,\\n              radius: pointRadius,\\n            },\\n            isolatedPoint: {\\n              radius,\\n              shape: customKnobs.enum.pointShape(),\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        position={Position.Bottom}\\n        style={{\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n        }}\\n        timeAxisLayerCount={2}\\n        gridLine={{\\n          visible: true,\\n        }}\\n      />\\n      <Axis id=\\\"y\\\" position={Position.Left} ticks={5} />\\n\\n      <Series\\n        id=\\\"Count of records\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[2]}\\n        areaSeriesStyle={\\n          overrideRadius > 0\\n            ? {\\n                point: {\\n                  visible: true,\\n                  radius: overrideRadius,\\n                },\\n                isolatedPoint: overridePointRadius\\n                  ? {\\n                      radius,\\n                    }\\n                  : {},\\n              }\\n            : {}\\n        }\\n        lineSeriesStyle={\\n          overrideRadius > 0\\n            ? {\\n                point: {\\n                  visible: true,\\n                  radius: overrideRadius,\\n                },\\n                isolatedPoint: overridePointRadius\\n                  ? {\\n                      radius,\\n                    }\\n                  : {},\\n              }\\n            : {}\\n        }\\n        data={[\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([1, 10, 12, 20, 22, 24, 28].includes(i)) {\\n              return [d[0], null, 'A'];\\n            }\\n            return [...d, 'A'];\\n          }),\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([5, 7, 33, 35, 20, 22, 35].includes(i)) {\\n              return [d[0], null, 'B'];\\n            }\\n            return [...d, 'B'];\\n          }),\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([9, 11, 13, 45, 47, 61, 62].includes(i)) {\\n              return [d[0], null, 'C'];\\n            }\\n            return [...d, 'C'];\\n          }),\\n        ]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":156},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":156}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, CurveType, Position, ScaleType, Settings, Fit } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fitEnabled = boolean('enable fit function', false);\n  const [Series] = customKnobs.enum.xySeries('series type', 'line', { exclude: ['bar', 'bubble'] });\n  const maxDataPoints = number('max data points', 60, {\n    range: true,\n    min: 0,\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data.length,\n    step: 1,\n  });\n  const pointRadius = number('default point radius', 0, {\n    range: true,\n    min: 0,\n    max: 10,\n    step: 1,\n  });\n  const radius = number('isolated point radius', 2, {\n    range: true,\n    min: 0,\n    max: 10,\n    step: 1,\n  });\n  const overrideRadius = number('override point radius', 0, {\n    range: true,\n    min: 0,\n    max: 10,\n    step: 1,\n  });\n  const overridePointRadius = boolean('override radius for isolated points', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        legendPosition={Position.Right}\n        theme={{\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n              radius: pointRadius,\n            },\n            isolatedPoint: {\n              radius,\n              shape: customKnobs.enum.pointShape(),\n            },\n          },\n          lineSeriesStyle: {\n            point: {\n              visible: true,\n              radius: pointRadius,\n            },\n            isolatedPoint: {\n              radius,\n              shape: customKnobs.enum.pointShape(),\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis\n        id=\"x\"\n        position={Position.Bottom}\n        style={{\n          tickLine: { size: 0.0001, padding: 4 },\n          tickLabel: {\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n            padding: 0,\n            offset: { x: 0, y: 0 },\n          },\n        }}\n        timeAxisLayerCount={2}\n        gridLine={{\n          visible: true,\n        }}\n      />\n      <Axis id=\"y\" position={Position.Left} ticks={5} />\n\n      <Series\n        id=\"Count of records\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        splitSeriesAccessors={[2]}\n        areaSeriesStyle={\n          overrideRadius > 0\n            ? {\n                point: {\n                  visible: true,\n                  radius: overrideRadius,\n                },\n                isolatedPoint: overridePointRadius\n                  ? {\n                      radius,\n                    }\n                  : {},\n              }\n            : {}\n        }\n        lineSeriesStyle={\n          overrideRadius > 0\n            ? {\n                point: {\n                  visible: true,\n                  radius: overrideRadius,\n                },\n                isolatedPoint: overridePointRadius\n                  ? {\n                      radius,\n                    }\n                  : {},\n              }\n            : {}\n        }\n        data={[\n          ...KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map((d, i) => {\n            if ([1, 10, 12, 20, 22, 24, 28].includes(i)) {\n              return [d[0], null, 'A'];\n            }\n            return [...d, 'A'];\n          }),\n          ...KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map((d, i) => {\n            if ([5, 7, 33, 35, 20, 22, 35].includes(i)) {\n              return [d[0], null, 'B'];\n            }\n            return [...d, 'B'];\n          }),\n          ...KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map((d, i) => {\n            if ([9, 11, 13, 45, 47, 61, 62].includes(i)) {\n              return [d[0], null, 'C'];\n            }\n            return [...d, 'C'];\n          }),\n        ]}\n        fit={fitEnabled ? Fit.Linear : undefined}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fitEnabled = boolean('enable fit function', false);\\n  const [Series] = customKnobs.enum.xySeries('series type', 'line', { exclude: ['bar', 'bubble'] });\\n  const maxDataPoints = number('max data points', 60, {\\n    range: true,\\n    min: 0,\\n    max: KIBANA_METRICS.metrics.kibana_os_load.v1.data.length,\\n    step: 1,\\n  });\\n  const pointRadius = number('default point radius', 0, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const radius = number('isolated point radius', 2, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const overrideRadius = number('override point radius', 0, {\\n    range: true,\\n    min: 0,\\n    max: 10,\\n    step: 1,\\n  });\\n  const overridePointRadius = boolean('override radius for isolated points', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        legendPosition={Position.Right}\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n              radius: pointRadius,\\n            },\\n            isolatedPoint: {\\n              radius,\\n              shape: customKnobs.enum.pointShape(),\\n            },\\n          },\\n          lineSeriesStyle: {\\n            point: {\\n              visible: true,\\n              radius: pointRadius,\\n            },\\n            isolatedPoint: {\\n              radius,\\n              shape: customKnobs.enum.pointShape(),\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis\\n        id=\\\"x\\\"\\n        position={Position.Bottom}\\n        style={{\\n          tickLine: { size: 0.0001, padding: 4 },\\n          tickLabel: {\\n            alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n            padding: 0,\\n            offset: { x: 0, y: 0 },\\n          },\\n        }}\\n        timeAxisLayerCount={2}\\n        gridLine={{\\n          visible: true,\\n        }}\\n      />\\n      <Axis id=\\\"y\\\" position={Position.Left} ticks={5} />\\n\\n      <Series\\n        id=\\\"Count of records\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        splitSeriesAccessors={[2]}\\n        areaSeriesStyle={\\n          overrideRadius > 0\\n            ? {\\n                point: {\\n                  visible: true,\\n                  radius: overrideRadius,\\n                },\\n                isolatedPoint: overridePointRadius\\n                  ? {\\n                      radius,\\n                    }\\n                  : {},\\n              }\\n            : {}\\n        }\\n        lineSeriesStyle={\\n          overrideRadius > 0\\n            ? {\\n                point: {\\n                  visible: true,\\n                  radius: overrideRadius,\\n                },\\n                isolatedPoint: overridePointRadius\\n                  ? {\\n                      radius,\\n                    }\\n                  : {},\\n              }\\n            : {}\\n        }\\n        data={[\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([1, 10, 12, 20, 22, 24, 28].includes(i)) {\\n              return [d[0], null, 'A'];\\n            }\\n            return [...d, 'A'];\\n          }),\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([5, 7, 33, 35, 20, 22, 35].includes(i)) {\\n              return [d[0], null, 'B'];\\n            }\\n            return [...d, 'B'];\\n          }),\\n          ...KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map((d, i) => {\\n            if ([9, 11, 13, 45, 47, 61, 62].includes(i)) {\\n              return [d[0], null, 'C'];\\n            }\\n            return [...d, 'C'];\\n          }),\\n        ]}\\n        fit={fitEnabled ? Fit.Linear : undefined}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, Position, ScaleType, Settings, LineSeries } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\nconst bubbleData = new Array(30).fill(0).map((_, i) => ({\\n  x: i,\\n  y: rng(2, 3, 2),\\n  z: rng(0, 20),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const markSizeRatio = number('markSizeRatio', 10, {\\n    range: true,\\n    min: 1,\\n    max: 20,\\n    step: 1,\\n  });\\n\\n  const visible = boolean('show line points', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n          lineSeriesStyle: {\\n            point: {\\n              visible,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: 5,\\n        }}\\n      />\\n\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={bubbleData}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":25},\"endLoc\":{\"col\":1,\"line\":73},\"startBody\":{\"col\":36,\"line\":25},\"endBody\":{\"col\":1,\"line\":73}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, Position, ScaleType, Settings, LineSeries } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\nconst bubbleData = new Array(30).fill(0).map((_, i) => ({\n  x: i,\n  y: rng(2, 3, 2),\n  z: rng(0, 20),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const markSizeRatio = number('markSizeRatio', 10, {\n    range: true,\n    min: 1,\n    max: 20,\n    step: 1,\n  });\n\n  const visible = boolean('show line points', true);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        theme={{\n          markSizeRatio,\n          lineSeriesStyle: {\n            point: {\n              visible,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis\n        id=\"left2\"\n        title=\"Left axis\"\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          min: NaN,\n          max: 5,\n        }}\n      />\n\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={bubbleData}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const markSizeRatio = number('markSizeRatio', 10, {\\n    range: true,\\n    min: 1,\\n    max: 20,\\n    step: 1,\\n  });\\n\\n  const visible = boolean('show line points', true);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        theme={{\\n          markSizeRatio,\\n          lineSeriesStyle: {\\n            point: {\\n              visible,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title=\\\"Left axis\\\"\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: NaN,\\n          max: 5,\\n        }}\\n      />\\n\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={bubbleData}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LIGHT_THEME,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  PointShape,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getColorPicker } from '../utils/components/get_color_picker';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20);\\nconst shapes = Object.values(PointShape);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showColorPicker = boolean('Show color picker', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n        legendColorPicker={showColorPicker ? getColorPicker('leftCenter') : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n      />\\n      {shapes.map((shape, i) => {\\n        return (\\n          <LineSeries\\n            key={shape}\\n            id={shape}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            lineSeriesStyle={{ point: { shape, radius: 10 } }}\\n            data={data.map(([x, y]) => [x, y + 10 * i])}\\n          />\\n        );\\n      })}\\n      <LineSeries\\n        id=\\\"multi\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        color=\\\"lightgray\\\" // never overridden\\n        pointStyleAccessor={(datum) => {\\n          return {\\n            shape: shapes[datum.datum[2] % shapes.length],\\n            fill: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\\n            opacity: 0.9,\\n            radius: 5,\\n            stroke: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\\n            strokeWidth: 1,\\n            visible: true,\\n          };\\n        }}\\n        data={data.map(([x, y], i) => [x, y + 60, i])}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":89},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":89}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LIGHT_THEME,\n  LineSeries,\n  niceTimeFormatByDay,\n  PointShape,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getColorPicker } from '../utils/components/get_color_picker';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\nconst data = KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 20);\nconst shapes = Object.values(PointShape);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showColorPicker = boolean('Show color picker', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        baseTheme={useBaseTheme()}\n        legendColorPicker={showColorPicker ? getColorPicker('leftCenter') : undefined}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n      />\n      {shapes.map((shape, i) => {\n        return (\n          <LineSeries\n            key={shape}\n            id={shape}\n            xScaleType={ScaleType.Time}\n            yScaleType={ScaleType.Linear}\n            xAccessor={0}\n            yAccessors={[1]}\n            lineSeriesStyle={{ point: { shape, radius: 10 } }}\n            data={data.map(([x, y]) => [x, y + 10 * i])}\n          />\n        );\n      })}\n      <LineSeries\n        id=\"multi\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        color=\"lightgray\" // never overridden\n        pointStyleAccessor={(datum) => {\n          return {\n            shape: shapes[datum.datum[2] % shapes.length],\n            fill: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\n            opacity: 0.9,\n            radius: 5,\n            stroke: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\n            strokeWidth: 1,\n            visible: true,\n          };\n        }}\n        data={data.map(([x, y], i) => [x, y + 60, i])}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showColorPicker = boolean('Show color picker', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n        legendColorPicker={showColorPicker ? getColorPicker('leftCenter') : undefined}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n      />\\n      {shapes.map((shape, i) => {\\n        return (\\n          <LineSeries\\n            key={shape}\\n            id={shape}\\n            xScaleType={ScaleType.Time}\\n            yScaleType={ScaleType.Linear}\\n            xAccessor={0}\\n            yAccessors={[1]}\\n            lineSeriesStyle={{ point: { shape, radius: 10 } }}\\n            data={data.map(([x, y]) => [x, y + 10 * i])}\\n          />\\n        );\\n      })}\\n      <LineSeries\\n        id=\\\"multi\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        color=\\\"lightgray\\\" // never overridden\\n        pointStyleAccessor={(datum) => {\\n          return {\\n            shape: shapes[datum.datum[2] % shapes.length],\\n            fill: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\\n            opacity: 0.9,\\n            radius: 5,\\n            stroke: LIGHT_THEME.colors.vizColors[datum.datum[2] % LIGHT_THEME.colors.vizColors.length],\\n            strokeWidth: 1,\\n            visible: true,\\n          };\\n        }}\\n        data={data.map(([x, y], i) => [x, y + 60, i])}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport { LineSeries, Chart, ScaleType, Settings, Position, Axis } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const negative = boolean('use negative values', true);\\n  const yScaleType = customKnobs.enum.scaleType('Y scale type', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  const start = moment(1628547917775);\\n  const data = new Array(12).fill(0).map((_, i) => {\\n    // https://github.com/storybookjs/storybook/issues/12208#issuecomment-697044557\\n    const months = 1; // do not simplify\\n    return {\\n      y: i === 10 ? (negative ? -1 : 1) : 0,\\n      x: start.add(months, 'm').valueOf(),\\n    };\\n  });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <LineSeries\\n        fit=\\\"linear\\\"\\n        id=\\\"line\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport moment from 'moment';\nimport React from 'react';\n\nimport { LineSeries, Chart, ScaleType, Settings, Position, Axis } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const negative = boolean('use negative values', true);\n  const yScaleType = customKnobs.enum.scaleType('Y scale type', ScaleType.Linear, { include: ['Linear', 'Log'] });\n\n  const start = moment(1628547917775);\n  const data = new Array(12).fill(0).map((_, i) => {\n    // https://github.com/storybookjs/storybook/issues/12208#issuecomment-697044557\n    const months = 1; // do not simplify\n    return {\n      y: i === 10 ? (negative ? -1 : 1) : 0,\n      x: start.add(months, 'm').valueOf(),\n    };\n  });\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"y\" position={Position.Left} />\n      <Axis id=\"x\" position={Position.Bottom} />\n      <LineSeries\n        fit=\"linear\"\n        id=\"line\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Time}\n        yScaleType={yScaleType}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const negative = boolean('use negative values', true);\\n  const yScaleType = customKnobs.enum.scaleType('Y scale type', ScaleType.Linear, { include: ['Linear', 'Log'] });\\n\\n  const start = moment(1628547917775);\\n  const data = new Array(12).fill(0).map((_, i) => {\\n    // https://github.com/storybookjs/storybook/issues/12208#issuecomment-697044557\\n    const months = 1; // do not simplify\\n    return {\\n      y: i === 10 ? (negative ? -1 : 1) : 0,\\n      x: start.add(months, 'm').valueOf(),\\n    };\\n  });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <LineSeries\\n        fit=\\\"linear\\\"\\n        id=\\\"line\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={yScaleType}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, LineSeries, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const toggleSpec = boolean('toggle line spec', true);\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = data1.map((datum) => [datum[0], datum[1] - 1]);\\n  const data = toggleSpec ? data1 : data2;\\n  const specId = toggleSpec ? 'lines1' : 'lines2';\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <LineSeries\\n        id={specId}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":38},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":38}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, LineSeries, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const toggleSpec = boolean('toggle line spec', true);\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\n  const data2 = data1.map((datum) => [datum[0], datum[1] - 1]);\n  const data = toggleSpec ? data1 : data2;\n  const specId = toggleSpec ? 'lines1' : 'lines2';\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <LineSeries\n        id={specId}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const toggleSpec = boolean('toggle line spec', true);\\n  const data1 = KIBANA_METRICS.metrics.kibana_os_load.v1.data;\\n  const data2 = data1.map((datum) => [datum[0], datum[1] - 1]);\\n  const data = toggleSpec ? data1 : data2;\\n  const specId = toggleSpec ? 'lines1' : 'lines2';\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <LineSeries\\n        id={specId}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      xDomain={{\\n        min: NaN,\\n        max: 2,\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      xDomain={{\n        min: NaN,\n        max: 2,\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      xDomain={{\\n        min: NaN,\\n        max: 2,\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings rotation={customKnobs.enum.rotation()} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(2)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, 5)}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":28},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":28},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n\\n    <LineSeries\\n      id=\\\"monotone x\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n    />\\n    <LineSeries\\n      id=\\\"basis\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_BASIS}\\n    />\\n    <LineSeries\\n      id=\\\"cardinal\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_CARDINAL}\\n    />\\n    <LineSeries\\n      id=\\\"catmull rom\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n    />\\n    <LineSeries\\n      id=\\\"natural\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_NATURAL}\\n    />\\n    <LineSeries\\n      id=\\\"linear\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":95},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":95}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n\n    <LineSeries\n      id=\"monotone x\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_MONOTONE_X}\n    />\n    <LineSeries\n      id=\"basis\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_BASIS}\n    />\n    <LineSeries\n      id=\"cardinal\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_CARDINAL}\n    />\n    <LineSeries\n      id=\"catmull rom\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_CATMULL_ROM}\n    />\n    <LineSeries\n      id=\"natural\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.CURVE_NATURAL}\n    />\n    <LineSeries\n      id=\"linear\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.LINEAR}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n\\n    <LineSeries\\n      id=\\\"monotone x\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n    />\\n    <LineSeries\\n      id=\\\"basis\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_BASIS}\\n    />\\n    <LineSeries\\n      id=\\\"cardinal\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_CARDINAL}\\n    />\\n    <LineSeries\\n      id=\\\"catmull rom\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_CATMULL_ROM}\\n    />\\n    <LineSeries\\n      id=\\\"natural\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.CURVE_NATURAL}\\n    />\\n    <LineSeries\\n      id=\\\"linear\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      curve={CurveType.LINEAR}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      curve={CurveType.LINEAR}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":68},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":68}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.LINEAR}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n      curve={CurveType.LINEAR}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n      curve={CurveType.LINEAR}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      curve={CurveType.LINEAR}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      curve={CurveType.LINEAR}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":70},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":70}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n      curve={CurveType.LINEAR}\n      stackAccessors={[0]}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n      curve={CurveType.LINEAR}\n      stackAccessors={[0]}\n    />\n    <LineSeries\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      curve={CurveType.LINEAR}\n      stackAccessors={[0]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n    <LineSeries\\n      id={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      curve={CurveType.LINEAR}\\n      stackAccessors={[0]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  niceTimeFormatByDay,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\nimport { TSVB_DATASET } from '@elastic/charts/src/utils/data_samples/test_dataset_tsvb';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    {TSVB_DATASET.series.map((series) => (\\n      <LineSeries\\n        key={series.id}\\n        id={series.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Log}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={series.data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    ))}\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":53},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":53}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  LineSeries,\n  niceTimeFormatByDay,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\nimport { TSVB_DATASET } from '@elastic/charts/src/utils/data_samples/test_dataset_tsvb';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter(niceTimeFormatByDay(1));\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\n    <Axis\n      id=\"left\"\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n      position={Position.Left}\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\n    />\n    {TSVB_DATASET.series.map((series) => (\n      <LineSeries\n        key={series.id}\n        id={series.label}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Log}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={series.data}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    ))}\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks tickFormat={dateFormatter} />\\n    <Axis\\n      id=\\\"left\\\"\\n      title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n      position={Position.Left}\\n      tickFormat={(d) => `${Number(d).toFixed(0)}%`}\\n    />\\n    {TSVB_DATASET.series.map((series) => (\\n      <LineSeries\\n        key={series.id}\\n        id={series.label}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Log}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={series.data}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    ))}\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Line Chart',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as withAxis } from './2_w_axis.story';\nexport { Example as ordinalWithAxis } from './3_ordinal.story';\nexport { Example as linearWithAxis } from './4_linear.story';\nexport { Example as withAxisAndLegend } from './5_w_axis_and_legend.story';\nexport { Example as curvedWithAxisAndLegend } from './6_curved.story';\nexport { Example as multipleWithAxisAndLegend } from './7_multiple.story';\nexport { Example as stackedWithAxisAndLegend } from './8_stacked.story';\nexport { Example as multiSeriesWithLogValues } from './9_multi_series.story';\nexport { Example as discontinuousDataPoints } from './11_discontinuous_data_points.story';\nexport { Example as isolatedDataPoints } from './12_isolated_data_points.story';\nexport { Example as testPathOrdering } from './10_test_path_ordering.story';\nexport { Example as lineWithMarkAccessor } from './13_line_mark_accessor.story';\nexport { Example as pointShapes } from './14_point_shapes.story';\nexport { Example as testNegativePoints } from './15_test_negative_points.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiIcon } from '@elastic/eui';\\nimport { action } from '@storybook/addon-actions';\\nimport { select, boolean, text, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  isMetricElementEvent,\\n  Metric,\\n  MetricTrendShape,\\n  MetricWProgress,\\n  MetricWTrend,\\n  MetricWText,\\n  MetricWNumber,\\n  Settings,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title: storyTitle, description }) => {\\n  const title = text('title', '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9');\\n  const subtitle = text('subtitle', 'Cluster CPU usage');\\n  const progressOrTrend = select(\\n    'progress or trend',\\n    {\\n      trend: 'trend',\\n      bar: 'bar',\\n      none: 'none',\\n    },\\n    'trend',\\n  );\\n  const progressBarDirection = select(\\n    'progress bar direction',\\n    { horizontal: 'horizontal', vertical: 'vertical' },\\n    'vertical',\\n  );\\n  const maxDataPoints = number('trend data points', 30, { min: 0, max: 50, step: 1 });\\n  const trendShape = customKnobs.fromEnum('trend shape', MetricTrendShape, MetricTrendShape.Area);\\n  const trendA11yTitle = text('trend a11y title', 'The Cluster CPU Usage trend');\\n  const trendA11yDescription = text(\\n    'trend a11y description',\\n    'The trend shows a peak of CPU usage in the last 5 minutes',\\n  );\\n\\n  let extra = text('extra', 'last <b>5m</b>');\\n  const progressMax = number('progress max', 100);\\n  const numberTextSwitch = boolean('is numeric metric', true);\\n  const value = text('value', '55.23');\\n  const valuePrefix = text('value prefix', '');\\n  const valuePostfix = text('value postfix', ' %');\\n  const metricColor = color('color', '#3c3c3c');\\n  const useValueColor = boolean('use value color', false);\\n  const valueColor = color('value color', '#3c3c3c');\\n  extra = extra.replace('&lt;b&gt;', '<b>');\\n  extra = extra.replace('&lt;/b&gt;', '</b>');\\n  const showIcon = boolean('show icon', false);\\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'warning');\\n  const showValueIcon = boolean('show value icon', false);\\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\\n  const useBlendingBackground = boolean('use blending background', false);\\n  const blendingBackground = color('blending background', 'rgba(255,255,255,1)');\\n  const getIcon =\\n    (type: string) =>\\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n    );\\n  const data = {\\n    color: metricColor,\\n    title,\\n    valueColor: useValueColor ? valueColor : undefined,\\n    subtitle,\\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\\n  };\\n\\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\\n    ...data,\\n    value: Number.parseFloat(value),\\n    valueFormatter: (d: number) => `${valuePrefix}${d}${valuePostfix}`,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n          trendShape,\\n          trendA11yTitle,\\n          trendA11yDescription,\\n        }\\n      : {}),\\n  };\\n  const textualData: MetricWText | MetricWTrend = {\\n    ...data,\\n    value,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n          trendShape,\\n          trendA11yTitle,\\n          trendA11yDescription,\\n        }\\n      : {}),\\n  };\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n\\n  const configuredData = [[numberTextSwitch ? numericData : textualData]];\\n  return (\\n    <Chart title={storyTitle} description={description}>\\n      <Settings\\n        theme={{\\n          metric: {\\n            blendingBackground: useBlendingBackground ? blendingBackground : undefined,\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventClickAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOver={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventOverAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOut={() => onEventOutAction('out')}\\n      />\\n      <Metric id=\\\"1\\\" data={configuredData} />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    height: '200px',\\n    width: '200px',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":151},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":151}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiIcon } from '@elastic/eui';\nimport { action } from '@storybook/addon-actions';\nimport { select, boolean, text, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  isMetricElementEvent,\n  Metric,\n  MetricTrendShape,\n  MetricWProgress,\n  MetricWTrend,\n  MetricWText,\n  MetricWNumber,\n  Settings,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title: storyTitle, description }) => {\n  const title = text('title', '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9');\n  const subtitle = text('subtitle', 'Cluster CPU usage');\n  const progressOrTrend = select(\n    'progress or trend',\n    {\n      trend: 'trend',\n      bar: 'bar',\n      none: 'none',\n    },\n    'trend',\n  );\n  const progressBarDirection = select(\n    'progress bar direction',\n    { horizontal: 'horizontal', vertical: 'vertical' },\n    'vertical',\n  );\n  const maxDataPoints = number('trend data points', 30, { min: 0, max: 50, step: 1 });\n  const trendShape = customKnobs.fromEnum('trend shape', MetricTrendShape, MetricTrendShape.Area);\n  const trendA11yTitle = text('trend a11y title', 'The Cluster CPU Usage trend');\n  const trendA11yDescription = text(\n    'trend a11y description',\n    'The trend shows a peak of CPU usage in the last 5 minutes',\n  );\n\n  let extra = text('extra', 'last <b>5m</b>');\n  const progressMax = number('progress max', 100);\n  const numberTextSwitch = boolean('is numeric metric', true);\n  const value = text('value', '55.23');\n  const valuePrefix = text('value prefix', '');\n  const valuePostfix = text('value postfix', ' %');\n  const metricColor = color('color', '#3c3c3c');\n  const useValueColor = boolean('use value color', false);\n  const valueColor = color('value color', '#3c3c3c');\n  extra = extra.replace('&lt;b&gt;', '<b>');\n  extra = extra.replace('&lt;/b&gt;', '</b>');\n  const showIcon = boolean('show icon', false);\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'warning');\n  const showValueIcon = boolean('show value icon', false);\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\n  const useBlendingBackground = boolean('use blending background', false);\n  const blendingBackground = color('blending background', 'rgba(255,255,255,1)');\n  const getIcon =\n    (type: string) =>\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\n    );\n  const data = {\n    color: metricColor,\n    title,\n    valueColor: useValueColor ? valueColor : undefined,\n    subtitle,\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\n  };\n\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\n    ...data,\n    value: Number.parseFloat(value),\n    valueFormatter: (d: number) => `${valuePrefix}${d}${valuePostfix}`,\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\n    ...(progressOrTrend === 'trend'\n      ? {\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n          trendShape,\n          trendA11yTitle,\n          trendA11yDescription,\n        }\n      : {}),\n  };\n  const textualData: MetricWText | MetricWTrend = {\n    ...data,\n    value,\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\n    ...(progressOrTrend === 'trend'\n      ? {\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n          trendShape,\n          trendA11yTitle,\n          trendA11yDescription,\n        }\n      : {}),\n  };\n\n  const onEventClickAction = action('click');\n  const onEventOverAction = action('over');\n  const onEventOutAction = action('out');\n\n  const configuredData = [[numberTextSwitch ? numericData : textualData]];\n  return (\n    <Chart title={storyTitle} description={description}>\n      <Settings\n        theme={{\n          metric: {\n            blendingBackground: useBlendingBackground ? blendingBackground : undefined,\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        onElementClick={([d]) => {\n          if (isMetricElementEvent(d)) {\n            const { rowIndex, columnIndex } = d;\n            onEventClickAction(\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\n            );\n          }\n        }}\n        onElementOver={([d]) => {\n          if (isMetricElementEvent(d)) {\n            const { rowIndex, columnIndex } = d;\n            onEventOverAction(\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\n            );\n          }\n        }}\n        onElementOut={() => onEventOutAction('out')}\n      />\n      <Metric id=\"1\" data={configuredData} />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    height: '200px',\n    width: '200px',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title: storyTitle, description }) => {\\n  const title = text('title', '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9');\\n  const subtitle = text('subtitle', 'Cluster CPU usage');\\n  const progressOrTrend = select(\\n    'progress or trend',\\n    {\\n      trend: 'trend',\\n      bar: 'bar',\\n      none: 'none',\\n    },\\n    'trend',\\n  );\\n  const progressBarDirection = select(\\n    'progress bar direction',\\n    { horizontal: 'horizontal', vertical: 'vertical' },\\n    'vertical',\\n  );\\n  const maxDataPoints = number('trend data points', 30, { min: 0, max: 50, step: 1 });\\n  const trendShape = customKnobs.fromEnum('trend shape', MetricTrendShape, MetricTrendShape.Area);\\n  const trendA11yTitle = text('trend a11y title', 'The Cluster CPU Usage trend');\\n  const trendA11yDescription = text(\\n    'trend a11y description',\\n    'The trend shows a peak of CPU usage in the last 5 minutes',\\n  );\\n\\n  let extra = text('extra', 'last <b>5m</b>');\\n  const progressMax = number('progress max', 100);\\n  const numberTextSwitch = boolean('is numeric metric', true);\\n  const value = text('value', '55.23');\\n  const valuePrefix = text('value prefix', '');\\n  const valuePostfix = text('value postfix', ' %');\\n  const metricColor = color('color', '#3c3c3c');\\n  const useValueColor = boolean('use value color', false);\\n  const valueColor = color('value color', '#3c3c3c');\\n  extra = extra.replace('&lt;b&gt;', '<b>');\\n  extra = extra.replace('&lt;/b&gt;', '</b>');\\n  const showIcon = boolean('show icon', false);\\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'warning');\\n  const showValueIcon = boolean('show value icon', false);\\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\\n  const useBlendingBackground = boolean('use blending background', false);\\n  const blendingBackground = color('blending background', 'rgba(255,255,255,1)');\\n  const getIcon =\\n    (type: string) =>\\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n    );\\n  const data = {\\n    color: metricColor,\\n    title,\\n    valueColor: useValueColor ? valueColor : undefined,\\n    subtitle,\\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\\n  };\\n\\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\\n    ...data,\\n    value: Number.parseFloat(value),\\n    valueFormatter: (d: number) => `${valuePrefix}${d}${valuePostfix}`,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n          trendShape,\\n          trendA11yTitle,\\n          trendA11yDescription,\\n        }\\n      : {}),\\n  };\\n  const textualData: MetricWText | MetricWTrend = {\\n    ...data,\\n    value,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n          trendShape,\\n          trendA11yTitle,\\n          trendA11yDescription,\\n        }\\n      : {}),\\n  };\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n\\n  const configuredData = [[numberTextSwitch ? numericData : textualData]];\\n  return (\\n    <Chart title={storyTitle} description={description}>\\n      <Settings\\n        theme={{\\n          metric: {\\n            blendingBackground: useBlendingBackground ? blendingBackground : undefined,\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventClickAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOver={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventOverAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOut={() => onEventOutAction('out')}\\n      />\\n      <Metric id=\\\"1\\\" data={configuredData} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiIcon } from '@elastic/eui';\\nimport { action } from '@storybook/addon-actions';\\nimport { select, number, boolean, button, color } from '@storybook/addon-knobs';\\nimport React, { useEffect, useMemo, useState } from 'react';\\n\\nimport { Chart, isMetricElementEvent, Metric, MetricDatum, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nfunction split(a: (any | undefined)[], size: number) {\\n  return Array.from(new Array(Math.ceil(a.length / size))).map((_, index) => a.slice(index * size, (index + 1) * size));\\n}\\n\\nconst getIcon =\\n  (type: string) =>\\n  ({ width, height, color }: { width: number; height: number; color: string }) => (\\n    <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n  );\\n\\nconst arrayToGrid: <T>(array: T[], nColumns: number) => T[][] = (array, nColumns) => {\\n  const ret = [];\\n  for (let i = 0; i < array.length; i += nColumns) {\\n    ret.push(array.slice(i, i + nColumns));\\n  }\\n  return ret;\\n};\\n\\nconst maxTileSideLength = 200;\\nconst getContainerWidth = (_data: (MetricDatum | undefined)[][]) => _data[0].length * maxTileSideLength;\\nconst getContainerHeight = (_data: (MetricDatum | undefined)[][]) => _data.length * maxTileSideLength;\\n\\nconst defaultValueFormatter = (d: number) => `${d}`;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showGridBorder = boolean('show grid border', false);\\n  const addMetricClick = boolean('attach click handler', true);\\n  const useProgressBar = boolean('use progress bar', true);\\n\\n  const progressBarDirection = select('progress bar direction', ['horizontal', 'vertical'], 'vertical');\\n  const maxDataPoints = number('max trend data points', 30, { min: 0, max: 50, step: 1 });\\n  const emptyBackground = color('empty background', 'transparent');\\n\\n  const data: (MetricDatum | undefined)[] = useMemo(\\n    () => [\\n      {\\n        color: '#3c3c3c',\\n        title: 'CPU Usage',\\n        subtitle: 'Overall percentage',\\n        icon: getIcon('compute'),\\n        value: NaN,\\n        valueFormatter: defaultValueFormatter,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last hour CPU percentage trend',\\n        trendA11yDescription:\\n          'The trend shows the CPU Usage in percentage in the last hour. The trend shows a general flat behaviour with peaks every 10 minutes',\\n      },\\n      {\\n        color: '#FF7E62',\\n        title: 'Memory Usage',\\n        subtitle: 'Overall percentage',\\n        value: 33.57,\\n        valueFormatter: (d) => `${d} %`,\\n        trend: KIBANA_METRICS.metrics.kibana_memory.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last hour Memory usage trend',\\n        trendA11yDescription:\\n          'The trend shows the memory usage in the last hour. The trend shows a general flat behaviour across the entire time window',\\n      },\\n      {\\n        color: '#5e5e5e',\\n        title: 'Disk I/O',\\n        subtitle: 'Read',\\n        icon: getIcon('sortUp'),\\n        value: 12.57,\\n        valueFormatter: (d) => `${d} Mb/s`,\\n        ...(useProgressBar && {\\n          domainMax: 100,\\n          progressBarDirection,\\n          extra: (\\n            <span>\\n              max <b>100Mb/s</b>\\n            </span>\\n          ),\\n        }),\\n      },\\n      {\\n        color: '#5e5e5e',\\n        title: 'Disk I/O',\\n        subtitle: 'Write',\\n        icon: getIcon('sortDown'),\\n        value: 41.12,\\n        valueFormatter: (d) => `${d} Mb/s`,\\n        ...(useProgressBar && {\\n          domainMax: 100,\\n          progressBarDirection,\\n          extra: (\\n            <span>\\n              max <b>100Mb/s</b>\\n            </span>\\n          ),\\n        }),\\n      },\\n      {\\n        color: '#6DCCB1',\\n        title: '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9',\\n        subtitle: 'Cluster CPU Usage',\\n        value: 24.85,\\n        valueFormatter: (d) => `${d}%`,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n      },\\n      {\\n        color: '#FFBDAF',\\n        title: 'Inbound Traffic',\\n        subtitle: 'Network eth0',\\n        extra: (\\n          <span>\\n            last <b>5m</b>\\n          </span>\\n        ),\\n        icon: getIcon('sortUp'),\\n        value: 3.57,\\n        valueFormatter: (d) => `${d}KBps`,\\n      },\\n      undefined,\\n      {\\n        color: '#F1D86F',\\n        title: 'Cloud Revenue',\\n        subtitle: 'Quarterly',\\n        extra: (\\n          <span>\\n            This Year <b>10M</b>\\n          </span>\\n        ),\\n        value: 323.57,\\n        valueFormatter: (d) => `$ ${d}k`,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last quarter, daily Cloud Revenue trend',\\n        trendA11yDescription:\\n          'The trend shows the daily Cloud revenue in the last quarter, showing peaks during weekends.',\\n      },\\n    ],\\n    [maxDataPoints, useProgressBar, progressBarDirection],\\n  );\\n\\n  const nColumns = number('number of columns', 4, { min: 1, max: data.length, step: 1 });\\n\\n  const [chartData, setChartData] = useState(arrayToGrid(data, nColumns));\\n  const [containerHeight, setContainerHeight] = useState(getContainerHeight(chartData));\\n  const [containerWidth, setContainerWidth] = useState(getContainerWidth(chartData));\\n\\n  useEffect(() => {\\n    const newData = arrayToGrid(data, nColumns);\\n    setChartData(newData);\\n    setContainerHeight(getContainerHeight(newData));\\n    setContainerWidth(getContainerWidth(newData));\\n  }, [data, progressBarDirection, useProgressBar, maxDataPoints, nColumns]);\\n\\n  button('randomize data', () => {\\n    setChartData(\\n      split(\\n        data\\n          .slice()\\n          .map((d) => {\\n            return rng(0, 1, 3) > 0.8 ? undefined : d;\\n          })\\n          .slice(0, rng(1, data.length)),\\n        rng(1, data.length / 2),\\n      ),\\n    );\\n  });\\n  const debugRandomizedData = boolean('debug randomized data', false);\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n  return (\\n    <div\\n      style={{\\n        resize: 'both',\\n        maxWidth: '100%',\\n        maxHeight: '80vh',\\n        padding: '0px',\\n        overflow: 'auto',\\n        height: `${containerHeight}px`,\\n        width: `${containerWidth}px`,\\n        ...(showGridBorder && {\\n          boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n          borderRadius: '6px',\\n        }),\\n      }}\\n    >\\n      {debugRandomizedData &&\\n        chartData\\n          .flat()\\n          .map((d) => `[${d?.value}]`)\\n          .join(' ')}\\n      <Chart title={title} description={description}>\\n        <Settings\\n          theme={{\\n            metric: {\\n              emptyBackground,\\n            },\\n          }}\\n          baseTheme={useBaseTheme()}\\n          onElementClick={\\n            addMetricClick\\n              ? ([d]) => {\\n                  if (isMetricElementEvent(d)) {\\n                    const { rowIndex, columnIndex } = d;\\n                    onEventClickAction(\\n                      `row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`,\\n                    );\\n                  }\\n                }\\n              : undefined\\n          }\\n          onElementOver={([d]) => {\\n            if (isMetricElementEvent(d)) {\\n              const { rowIndex, columnIndex } = d;\\n              onEventOverAction(`row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`);\\n            }\\n          }}\\n          onElementOut={() => onEventOutAction('out')}\\n        />\\n        <Metric id=\\\"metric\\\" data={chartData} />\\n      </Chart>\\n    </div>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":47},\"endLoc\":{\"col\":1,\"line\":245},\"startBody\":{\"col\":36,\"line\":47},\"endBody\":{\"col\":1,\"line\":245}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiIcon } from '@elastic/eui';\nimport { action } from '@storybook/addon-actions';\nimport { select, number, boolean, button, color } from '@storybook/addon-knobs';\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { Chart, isMetricElementEvent, Metric, MetricDatum, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\n\nfunction split(a: (any | undefined)[], size: number) {\n  return Array.from(new Array(Math.ceil(a.length / size))).map((_, index) => a.slice(index * size, (index + 1) * size));\n}\n\nconst getIcon =\n  (type: string) =>\n  ({ width, height, color }: { width: number; height: number; color: string }) => (\n    <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\n  );\n\nconst arrayToGrid: <T>(array: T[], nColumns: number) => T[][] = (array, nColumns) => {\n  const ret = [];\n  for (let i = 0; i < array.length; i += nColumns) {\n    ret.push(array.slice(i, i + nColumns));\n  }\n  return ret;\n};\n\nconst maxTileSideLength = 200;\nconst getContainerWidth = (_data: (MetricDatum | undefined)[][]) => _data[0].length * maxTileSideLength;\nconst getContainerHeight = (_data: (MetricDatum | undefined)[][]) => _data.length * maxTileSideLength;\n\nconst defaultValueFormatter = (d: number) => `${d}`;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showGridBorder = boolean('show grid border', false);\n  const addMetricClick = boolean('attach click handler', true);\n  const useProgressBar = boolean('use progress bar', true);\n\n  const progressBarDirection = select('progress bar direction', ['horizontal', 'vertical'], 'vertical');\n  const maxDataPoints = number('max trend data points', 30, { min: 0, max: 50, step: 1 });\n  const emptyBackground = color('empty background', 'transparent');\n\n  const data: (MetricDatum | undefined)[] = useMemo(\n    () => [\n      {\n        color: '#3c3c3c',\n        title: 'CPU Usage',\n        subtitle: 'Overall percentage',\n        icon: getIcon('compute'),\n        value: NaN,\n        valueFormatter: defaultValueFormatter,\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n        trendShape: 'area',\n        trendA11yTitle: 'Last hour CPU percentage trend',\n        trendA11yDescription:\n          'The trend shows the CPU Usage in percentage in the last hour. The trend shows a general flat behaviour with peaks every 10 minutes',\n      },\n      {\n        color: '#FF7E62',\n        title: 'Memory Usage',\n        subtitle: 'Overall percentage',\n        value: 33.57,\n        valueFormatter: (d) => `${d} %`,\n        trend: KIBANA_METRICS.metrics.kibana_memory.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n        trendShape: 'area',\n        trendA11yTitle: 'Last hour Memory usage trend',\n        trendA11yDescription:\n          'The trend shows the memory usage in the last hour. The trend shows a general flat behaviour across the entire time window',\n      },\n      {\n        color: '#5e5e5e',\n        title: 'Disk I/O',\n        subtitle: 'Read',\n        icon: getIcon('sortUp'),\n        value: 12.57,\n        valueFormatter: (d) => `${d} Mb/s`,\n        ...(useProgressBar && {\n          domainMax: 100,\n          progressBarDirection,\n          extra: (\n            <span>\n              max <b>100Mb/s</b>\n            </span>\n          ),\n        }),\n      },\n      {\n        color: '#5e5e5e',\n        title: 'Disk I/O',\n        subtitle: 'Write',\n        icon: getIcon('sortDown'),\n        value: 41.12,\n        valueFormatter: (d) => `${d} Mb/s`,\n        ...(useProgressBar && {\n          domainMax: 100,\n          progressBarDirection,\n          extra: (\n            <span>\n              max <b>100Mb/s</b>\n            </span>\n          ),\n        }),\n      },\n      {\n        color: '#6DCCB1',\n        title: '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9',\n        subtitle: 'Cluster CPU Usage',\n        value: 24.85,\n        valueFormatter: (d) => `${d}%`,\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n        trendShape: 'area',\n      },\n      {\n        color: '#FFBDAF',\n        title: 'Inbound Traffic',\n        subtitle: 'Network eth0',\n        extra: (\n          <span>\n            last <b>5m</b>\n          </span>\n        ),\n        icon: getIcon('sortUp'),\n        value: 3.57,\n        valueFormatter: (d) => `${d}KBps`,\n      },\n      undefined,\n      {\n        color: '#F1D86F',\n        title: 'Cloud Revenue',\n        subtitle: 'Quarterly',\n        extra: (\n          <span>\n            This Year <b>10M</b>\n          </span>\n        ),\n        value: 323.57,\n        valueFormatter: (d) => `$ ${d}k`,\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\n        trendShape: 'area',\n        trendA11yTitle: 'Last quarter, daily Cloud Revenue trend',\n        trendA11yDescription:\n          'The trend shows the daily Cloud revenue in the last quarter, showing peaks during weekends.',\n      },\n    ],\n    [maxDataPoints, useProgressBar, progressBarDirection],\n  );\n\n  const nColumns = number('number of columns', 4, { min: 1, max: data.length, step: 1 });\n\n  const [chartData, setChartData] = useState(arrayToGrid(data, nColumns));\n  const [containerHeight, setContainerHeight] = useState(getContainerHeight(chartData));\n  const [containerWidth, setContainerWidth] = useState(getContainerWidth(chartData));\n\n  useEffect(() => {\n    const newData = arrayToGrid(data, nColumns);\n    setChartData(newData);\n    setContainerHeight(getContainerHeight(newData));\n    setContainerWidth(getContainerWidth(newData));\n  }, [data, progressBarDirection, useProgressBar, maxDataPoints, nColumns]);\n\n  button('randomize data', () => {\n    setChartData(\n      split(\n        data\n          .slice()\n          .map((d) => {\n            return rng(0, 1, 3) > 0.8 ? undefined : d;\n          })\n          .slice(0, rng(1, data.length)),\n        rng(1, data.length / 2),\n      ),\n    );\n  });\n  const debugRandomizedData = boolean('debug randomized data', false);\n\n  const onEventClickAction = action('click');\n  const onEventOverAction = action('over');\n  const onEventOutAction = action('out');\n  return (\n    <div\n      style={{\n        resize: 'both',\n        maxWidth: '100%',\n        maxHeight: '80vh',\n        padding: '0px',\n        overflow: 'auto',\n        height: `${containerHeight}px`,\n        width: `${containerWidth}px`,\n        ...(showGridBorder && {\n          boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\n          borderRadius: '6px',\n        }),\n      }}\n    >\n      {debugRandomizedData &&\n        chartData\n          .flat()\n          .map((d) => `[${d?.value}]`)\n          .join(' ')}\n      <Chart title={title} description={description}>\n        <Settings\n          theme={{\n            metric: {\n              emptyBackground,\n            },\n          }}\n          baseTheme={useBaseTheme()}\n          onElementClick={\n            addMetricClick\n              ? ([d]) => {\n                  if (isMetricElementEvent(d)) {\n                    const { rowIndex, columnIndex } = d;\n                    onEventClickAction(\n                      `row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`,\n                    );\n                  }\n                }\n              : undefined\n          }\n          onElementOver={([d]) => {\n            if (isMetricElementEvent(d)) {\n              const { rowIndex, columnIndex } = d;\n              onEventOverAction(`row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`);\n            }\n          }}\n          onElementOut={() => onEventOutAction('out')}\n        />\n        <Metric id=\"metric\" data={chartData} />\n      </Chart>\n    </div>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showGridBorder = boolean('show grid border', false);\\n  const addMetricClick = boolean('attach click handler', true);\\n  const useProgressBar = boolean('use progress bar', true);\\n\\n  const progressBarDirection = select('progress bar direction', ['horizontal', 'vertical'], 'vertical');\\n  const maxDataPoints = number('max trend data points', 30, { min: 0, max: 50, step: 1 });\\n  const emptyBackground = color('empty background', 'transparent');\\n\\n  const data: (MetricDatum | undefined)[] = useMemo(\\n    () => [\\n      {\\n        color: '#3c3c3c',\\n        title: 'CPU Usage',\\n        subtitle: 'Overall percentage',\\n        icon: getIcon('compute'),\\n        value: NaN,\\n        valueFormatter: defaultValueFormatter,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last hour CPU percentage trend',\\n        trendA11yDescription:\\n          'The trend shows the CPU Usage in percentage in the last hour. The trend shows a general flat behaviour with peaks every 10 minutes',\\n      },\\n      {\\n        color: '#FF7E62',\\n        title: 'Memory Usage',\\n        subtitle: 'Overall percentage',\\n        value: 33.57,\\n        valueFormatter: (d) => `${d} %`,\\n        trend: KIBANA_METRICS.metrics.kibana_memory.v1.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last hour Memory usage trend',\\n        trendA11yDescription:\\n          'The trend shows the memory usage in the last hour. The trend shows a general flat behaviour across the entire time window',\\n      },\\n      {\\n        color: '#5e5e5e',\\n        title: 'Disk I/O',\\n        subtitle: 'Read',\\n        icon: getIcon('sortUp'),\\n        value: 12.57,\\n        valueFormatter: (d) => `${d} Mb/s`,\\n        ...(useProgressBar && {\\n          domainMax: 100,\\n          progressBarDirection,\\n          extra: (\\n            <span>\\n              max <b>100Mb/s</b>\\n            </span>\\n          ),\\n        }),\\n      },\\n      {\\n        color: '#5e5e5e',\\n        title: 'Disk I/O',\\n        subtitle: 'Write',\\n        icon: getIcon('sortDown'),\\n        value: 41.12,\\n        valueFormatter: (d) => `${d} Mb/s`,\\n        ...(useProgressBar && {\\n          domainMax: 100,\\n          progressBarDirection,\\n          extra: (\\n            <span>\\n              max <b>100Mb/s</b>\\n            </span>\\n          ),\\n        }),\\n      },\\n      {\\n        color: '#6DCCB1',\\n        title: '21d7f8b7-92ea-41a0-8c03-0db0ec7e11b9',\\n        subtitle: 'Cluster CPU Usage',\\n        value: 24.85,\\n        valueFormatter: (d) => `${d}%`,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n      },\\n      {\\n        color: '#FFBDAF',\\n        title: 'Inbound Traffic',\\n        subtitle: 'Network eth0',\\n        extra: (\\n          <span>\\n            last <b>5m</b>\\n          </span>\\n        ),\\n        icon: getIcon('sortUp'),\\n        value: 3.57,\\n        valueFormatter: (d) => `${d}KBps`,\\n      },\\n      undefined,\\n      {\\n        color: '#F1D86F',\\n        title: 'Cloud Revenue',\\n        subtitle: 'Quarterly',\\n        extra: (\\n          <span>\\n            This Year <b>10M</b>\\n          </span>\\n        ),\\n        value: 323.57,\\n        valueFormatter: (d) => `$ ${d}k`,\\n        trend: KIBANA_METRICS.metrics.kibana_os_load.v3.data.slice(0, maxDataPoints).map(([x, y]) => ({ x, y })),\\n        trendShape: 'area',\\n        trendA11yTitle: 'Last quarter, daily Cloud Revenue trend',\\n        trendA11yDescription:\\n          'The trend shows the daily Cloud revenue in the last quarter, showing peaks during weekends.',\\n      },\\n    ],\\n    [maxDataPoints, useProgressBar, progressBarDirection],\\n  );\\n\\n  const nColumns = number('number of columns', 4, { min: 1, max: data.length, step: 1 });\\n\\n  const [chartData, setChartData] = useState(arrayToGrid(data, nColumns));\\n  const [containerHeight, setContainerHeight] = useState(getContainerHeight(chartData));\\n  const [containerWidth, setContainerWidth] = useState(getContainerWidth(chartData));\\n\\n  useEffect(() => {\\n    const newData = arrayToGrid(data, nColumns);\\n    setChartData(newData);\\n    setContainerHeight(getContainerHeight(newData));\\n    setContainerWidth(getContainerWidth(newData));\\n  }, [data, progressBarDirection, useProgressBar, maxDataPoints, nColumns]);\\n\\n  button('randomize data', () => {\\n    setChartData(\\n      split(\\n        data\\n          .slice()\\n          .map((d) => {\\n            return rng(0, 1, 3) > 0.8 ? undefined : d;\\n          })\\n          .slice(0, rng(1, data.length)),\\n        rng(1, data.length / 2),\\n      ),\\n    );\\n  });\\n  const debugRandomizedData = boolean('debug randomized data', false);\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n  return (\\n    <div\\n      style={{\\n        resize: 'both',\\n        maxWidth: '100%',\\n        maxHeight: '80vh',\\n        padding: '0px',\\n        overflow: 'auto',\\n        height: `${containerHeight}px`,\\n        width: `${containerWidth}px`,\\n        ...(showGridBorder && {\\n          boxShadow: '5px 5px 15px 5px rgba(0,0,0,0.29)',\\n          borderRadius: '6px',\\n        }),\\n      }}\\n    >\\n      {debugRandomizedData &&\\n        chartData\\n          .flat()\\n          .map((d) => `[${d?.value}]`)\\n          .join(' ')}\\n      <Chart title={title} description={description}>\\n        <Settings\\n          theme={{\\n            metric: {\\n              emptyBackground,\\n            },\\n          }}\\n          baseTheme={useBaseTheme()}\\n          onElementClick={\\n            addMetricClick\\n              ? ([d]) => {\\n                  if (isMetricElementEvent(d)) {\\n                    const { rowIndex, columnIndex } = d;\\n                    onEventClickAction(\\n                      `row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`,\\n                    );\\n                  }\\n                }\\n              : undefined\\n          }\\n          onElementOver={([d]) => {\\n            if (isMetricElementEvent(d)) {\\n              const { rowIndex, columnIndex } = d;\\n              onEventOverAction(`row:${rowIndex} col:${columnIndex} value:${chartData[rowIndex][columnIndex]?.value}`);\\n            }\\n          }}\\n          onElementOut={() => onEventOutAction('out')}\\n        />\\n        <Metric id=\\\"metric\\\" data={chartData} />\\n      </Chart>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","var api = require(\"!../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n            var content = require(\"!!../../../node_modules/css-loader/dist/cjs.js??ref--17-1!../../../node_modules/postcss-loader/dist/cjs.js??ref--17-2!../../../node_modules/sass-loader/dist/cjs.js??ref--17-3!./3_body.scss\");\n\n            content = content.__esModule ? content.default : content;\n\n            if (typeof content === 'string') {\n              content = [[module.id, content, '']];\n            }\n\nvar options = {\"attributes\":{\"nonce\":\"Pk1rZ1XDlMuYe8ubWV3Lh0BzwrTigJQ=\"}};\n\noptions.insert = \"head\";\noptions.singleton = false;\n\nvar update = api(content, options);\n\n\n\nmodule.exports = content.locals || {};","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui';\\nimport { action } from '@storybook/addon-actions';\\nimport { select, boolean, text, color, number } from '@storybook/addon-knobs';\\nimport classNames from 'classnames';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  isMetricElementEvent,\\n  Metric,\\n  MetricWProgress,\\n  MetricWTrend,\\n  MetricWNumber,\\n  Settings,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nimport './3_body.scss';\\n\\nexport const Example: ChartsStory = (_, { title: storyTitle, description }) => {\\n  const title = text('title', 'SLO: Frontend Latency');\\n  const subtitle = text('subtitle', '');\\n  const progressOrTrend = select(\\n    'progress or trend',\\n    {\\n      trend: 'trend',\\n      bar: 'bar',\\n      none: 'none',\\n    },\\n    'trend',\\n  );\\n  const progressBarDirection = select(\\n    'progress bar direction',\\n    { horizontal: 'horizontal', vertical: 'vertical' },\\n    'vertical',\\n  );\\n\\n  let extra = text('extra', 'Target <b>99.00%</b>');\\n  const progressMax = number('progress max', 100);\\n  const value = text('value', '99.45');\\n  const valuePostfix = text('value postfix', ' %');\\n  const metricColor = color('color', '#3c3c3c');\\n  extra = extra.replace('&lt;b&gt;', '<b>');\\n  extra = extra.replace('&lt;/b&gt;', '</b>');\\n  const showIcon = boolean('show icon', true);\\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'visGauge');\\n  const showValueIcon = boolean('show value icon', false);\\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\\n  const showBody = boolean('show body contents', true);\\n  const showBodyArea = boolean('show full body area', false);\\n  const getIcon =\\n    (type: string) =>\\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n    );\\n  const data = {\\n    color: metricColor,\\n    title,\\n    subtitle,\\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\\n  };\\n\\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\\n    ...data,\\n    body: !showBody ? null : (\\n      <div className={classNames('myCustomMetricSlot', { showBodyArea })} style={{ paddingTop: 8 }}>\\n        <div>\\n          <EuiFlexGroup wrap responsive={false} gutterSize=\\\"s\\\">\\n            <EuiFlexItem grow={false}>\\n              <EuiBadge color=\\\"success\\\">Healthy</EuiBadge>\\n            </EuiFlexItem>\\n            <EuiFlexItem grow={false}>\\n              <EuiBadge\\n                onMouseDown={(e): void => {\\n                  e.stopPropagation(); // stops propagation of metric onElementClick\\n                }}\\n                onClickAriaLabel=\\\"\\\"\\n                onClick={() => action('badge click')()}\\n                color=\\\"danger\\\"\\n                iconType=\\\"warning\\\"\\n                iconSide=\\\"left\\\"\\n              >\\n                13\\n              </EuiBadge>\\n            </EuiFlexItem>\\n          </EuiFlexGroup>\\n        </div>\\n      </div>\\n    ),\\n    value: Number.parseFloat(value),\\n    valueFormatter: (d: number) => `${d}${valuePostfix}`,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 40).map(([x, y]) => ({ x, y })),\\n        }\\n      : {}),\\n  };\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n\\n  const configuredData = [[numericData]];\\n  return (\\n    <Chart title={storyTitle} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        onElementClick={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventClickAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOver={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventOverAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOut={() => onEventOutAction('out')}\\n      />\\n      <Metric id=\\\"1\\\" data={configuredData} />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    height: '300px',\\n    width: '300px',\\n  },\\n  markdown: `Warning: :warning: This feature should be used with care. The body content does not take up space in order to preserve the rendering of elements of the Metric.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":144},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":144}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui';\nimport { action } from '@storybook/addon-actions';\nimport { select, boolean, text, color, number } from '@storybook/addon-knobs';\nimport classNames from 'classnames';\nimport React from 'react';\n\nimport {\n  Chart,\n  isMetricElementEvent,\n  Metric,\n  MetricWProgress,\n  MetricWTrend,\n  MetricWNumber,\n  Settings,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nimport './3_body.scss';\n\nexport const Example: ChartsStory = (_, { title: storyTitle, description }) => {\n  const title = text('title', 'SLO: Frontend Latency');\n  const subtitle = text('subtitle', '');\n  const progressOrTrend = select(\n    'progress or trend',\n    {\n      trend: 'trend',\n      bar: 'bar',\n      none: 'none',\n    },\n    'trend',\n  );\n  const progressBarDirection = select(\n    'progress bar direction',\n    { horizontal: 'horizontal', vertical: 'vertical' },\n    'vertical',\n  );\n\n  let extra = text('extra', 'Target <b>99.00%</b>');\n  const progressMax = number('progress max', 100);\n  const value = text('value', '99.45');\n  const valuePostfix = text('value postfix', ' %');\n  const metricColor = color('color', '#3c3c3c');\n  extra = extra.replace('&lt;b&gt;', '<b>');\n  extra = extra.replace('&lt;/b&gt;', '</b>');\n  const showIcon = boolean('show icon', true);\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'visGauge');\n  const showValueIcon = boolean('show value icon', false);\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\n  const showBody = boolean('show body contents', true);\n  const showBodyArea = boolean('show full body area', false);\n  const getIcon =\n    (type: string) =>\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\n    );\n  const data = {\n    color: metricColor,\n    title,\n    subtitle,\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\n  };\n\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\n    ...data,\n    body: !showBody ? null : (\n      <div className={classNames('myCustomMetricSlot', { showBodyArea })} style={{ paddingTop: 8 }}>\n        <div>\n          <EuiFlexGroup wrap responsive={false} gutterSize=\"s\">\n            <EuiFlexItem grow={false}>\n              <EuiBadge color=\"success\">Healthy</EuiBadge>\n            </EuiFlexItem>\n            <EuiFlexItem grow={false}>\n              <EuiBadge\n                onMouseDown={(e): void => {\n                  e.stopPropagation(); // stops propagation of metric onElementClick\n                }}\n                onClickAriaLabel=\"\"\n                onClick={() => action('badge click')()}\n                color=\"danger\"\n                iconType=\"warning\"\n                iconSide=\"left\"\n              >\n                13\n              </EuiBadge>\n            </EuiFlexItem>\n          </EuiFlexGroup>\n        </div>\n      </div>\n    ),\n    value: Number.parseFloat(value),\n    valueFormatter: (d: number) => `${d}${valuePostfix}`,\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\n    ...(progressOrTrend === 'trend'\n      ? {\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 40).map(([x, y]) => ({ x, y })),\n        }\n      : {}),\n  };\n\n  const onEventClickAction = action('click');\n  const onEventOverAction = action('over');\n  const onEventOutAction = action('out');\n\n  const configuredData = [[numericData]];\n  return (\n    <Chart title={storyTitle} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        onElementClick={([d]) => {\n          if (isMetricElementEvent(d)) {\n            const { rowIndex, columnIndex } = d;\n            onEventClickAction(\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\n            );\n          }\n        }}\n        onElementOver={([d]) => {\n          if (isMetricElementEvent(d)) {\n            const { rowIndex, columnIndex } = d;\n            onEventOverAction(\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\n            );\n          }\n        }}\n        onElementOut={() => onEventOutAction('out')}\n      />\n      <Metric id=\"1\" data={configuredData} />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    height: '300px',\n    width: '300px',\n  },\n  markdown: `Warning: :warning: This feature should be used with care. The body content does not take up space in order to preserve the rendering of elements of the Metric.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title: storyTitle, description }) => {\\n  const title = text('title', 'SLO: Frontend Latency');\\n  const subtitle = text('subtitle', '');\\n  const progressOrTrend = select(\\n    'progress or trend',\\n    {\\n      trend: 'trend',\\n      bar: 'bar',\\n      none: 'none',\\n    },\\n    'trend',\\n  );\\n  const progressBarDirection = select(\\n    'progress bar direction',\\n    { horizontal: 'horizontal', vertical: 'vertical' },\\n    'vertical',\\n  );\\n\\n  let extra = text('extra', 'Target <b>99.00%</b>');\\n  const progressMax = number('progress max', 100);\\n  const value = text('value', '99.45');\\n  const valuePostfix = text('value postfix', ' %');\\n  const metricColor = color('color', '#3c3c3c');\\n  extra = extra.replace('&lt;b&gt;', '<b>');\\n  extra = extra.replace('&lt;/b&gt;', '</b>');\\n  const showIcon = boolean('show icon', true);\\n  const iconType = customKnobs.eui.getIconTypeKnob('EUI icon glyph name', 'visGauge');\\n  const showValueIcon = boolean('show value icon', false);\\n  const valueIconType = customKnobs.eui.getIconTypeKnob('EUI value icon glyph name', 'sortUp');\\n  const showBody = boolean('show body contents', true);\\n  const showBodyArea = boolean('show full body area', false);\\n  const getIcon =\\n    (type: string) =>\\n    ({ width, height, color }: { width: number; height: number; color: string }) => (\\n      <EuiIcon type={type} width={width} height={height} fill={color} style={{ width, height }} />\\n    );\\n  const data = {\\n    color: metricColor,\\n    title,\\n    subtitle,\\n    extra: <span dangerouslySetInnerHTML={{ __html: extra }}></span>,\\n    ...(showIcon ? { icon: getIcon(iconType) } : {}),\\n    ...(showValueIcon ? { valueIcon: getIcon(valueIconType) } : {}),\\n  };\\n\\n  const numericData: MetricWProgress | MetricWNumber | MetricWTrend = {\\n    ...data,\\n    body: !showBody ? null : (\\n      <div className={classNames('myCustomMetricSlot', { showBodyArea })} style={{ paddingTop: 8 }}>\\n        <div>\\n          <EuiFlexGroup wrap responsive={false} gutterSize=\\\"s\\\">\\n            <EuiFlexItem grow={false}>\\n              <EuiBadge color=\\\"success\\\">Healthy</EuiBadge>\\n            </EuiFlexItem>\\n            <EuiFlexItem grow={false}>\\n              <EuiBadge\\n                onMouseDown={(e): void => {\\n                  e.stopPropagation(); // stops propagation of metric onElementClick\\n                }}\\n                onClickAriaLabel=\\\"\\\"\\n                onClick={() => action('badge click')()}\\n                color=\\\"danger\\\"\\n                iconType=\\\"warning\\\"\\n                iconSide=\\\"left\\\"\\n              >\\n                13\\n              </EuiBadge>\\n            </EuiFlexItem>\\n          </EuiFlexGroup>\\n        </div>\\n      </div>\\n    ),\\n    value: Number.parseFloat(value),\\n    valueFormatter: (d: number) => `${d}${valuePostfix}`,\\n    ...(progressOrTrend === 'bar' ? { domainMax: progressMax, progressBarDirection } : {}),\\n    ...(progressOrTrend === 'trend'\\n      ? {\\n          trend: KIBANA_METRICS.metrics.kibana_os_load.v2.data.slice(0, 40).map(([x, y]) => ({ x, y })),\\n        }\\n      : {}),\\n  };\\n\\n  const onEventClickAction = action('click');\\n  const onEventOverAction = action('over');\\n  const onEventOutAction = action('out');\\n\\n  const configuredData = [[numericData]];\\n  return (\\n    <Chart title={storyTitle} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        onElementClick={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventClickAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOver={([d]) => {\\n          if (isMetricElementEvent(d)) {\\n            const { rowIndex, columnIndex } = d;\\n            onEventOverAction(\\n              `row:${rowIndex} col:${columnIndex} value:${configuredData[rowIndex][columnIndex].value}`,\\n            );\\n          }\\n        }}\\n        onElementOut={() => onEventOutAction('out')}\\n      />\\n      <Metric id=\\\"1\\\" data={configuredData} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Metric (@alpha)',\n};\n\nexport { Example as basic } from './1_basic.story';\nexport { Example as grid } from './2_grid.story';\nexport { Example as bodyContent } from './3_body.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"line\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 3 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 10 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"line\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 3 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"areas\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.5 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2.8 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":50},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":50}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <AreaSeries\n      id=\"areas\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 2.5 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 2.8 },\n        { x: 1, y: 2 },\n        { x: 2, y: 4 },\n        { x: 3, y: 10 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <AreaSeries\\n      id=\\\"areas\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 2.5 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2.8 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 4 },\\n        { x: 3, y: 10 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, BarSeries, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <AreaSeries\\n      id=\\\"areas\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n      data={[\\n        { x: 0, y: 2.5 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { AreaSeries, Axis, BarSeries, Chart, CurveType, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description} renderer=\"canvas\">\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n    <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n    <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      stackAccessors={['x']}\n      data={[\n        { x: 0, y: 2 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n    <AreaSeries\n      id=\"areas\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      curve={CurveType.CURVE_MONOTONE_X}\n      data={[\n        { x: 0, y: 2.5 },\n        { x: 1, y: 7 },\n        { x: 2, y: 3 },\n        { x: 3, y: 6 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      stackAccessors={['x']}\\n      data={[\\n        { x: 0, y: 2 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n    <AreaSeries\\n      id=\\\"areas\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      curve={CurveType.CURVE_MONOTONE_X}\\n      data={[\\n        { x: 0, y: 2.5 },\\n        { x: 1, y: 7 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 6 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data1 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 5],\\n    [2, 4],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 2],\\n    [7, 3],\\n    [8, 4],\\n    [9, 5],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"data1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"data2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data2}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":64},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":64}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data1 = [\n    [1, 1],\n    [2, 2],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, 3],\n    [8, 2],\n    [9, 1],\n  ];\n  const data2 = [\n    [1, 5],\n    [2, 4],\n    [3, 3],\n    [4, 2],\n    [5, 1],\n    [6, 2],\n    [7, 3],\n    [8, 4],\n    [9, 5],\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"data1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data1}\n      />\n      <LineSeries\n        id=\"data2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data2}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data1 = [\\n    [1, 1],\\n    [2, 2],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, 3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  const data2 = [\\n    [1, 5],\\n    [2, 4],\\n    [3, 3],\\n    [4, 2],\\n    [5, 1],\\n    [6, 2],\\n    [7, 3],\\n    [8, 4],\\n    [9, 5],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"data1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"data2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data2}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { timeFormatter } from '@elastic/charts/src/utils/data/formatters';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data1 = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  const data2 = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  const dateFormatter = timeFormatter('HH:mm:ss');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"data1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"data2\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[2]}\\n        data={data2}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\nimport { timeFormatter } from '@elastic/charts/src/utils/data/formatters';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data1 = [\n    [start.toMillis(), 1, 4],\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\n  ];\n  const data2 = [\n    [start.toMillis(), 1, 4],\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\n  ];\n  const dateFormatter = timeFormatter('HH:mm:ss');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title=\"Bottom axis\"\n        showOverlappingTicks\n        tickFormat={dateFormatter}\n      />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"data1\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data1}\n      />\n      <LineSeries\n        id=\"data2\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[2]}\n        data={data2}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data1 = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  const data2 = [\\n    [start.toMillis(), 1, 4],\\n    [start.plus({ minute: 1 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 2 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 3 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 4 }).toMillis(), 5, 8],\\n    [start.plus({ minute: 5 }).toMillis(), 4, 7],\\n    [start.plus({ minute: 6 }).toMillis(), 3, 6],\\n    [start.plus({ minute: 7 }).toMillis(), 2, 5],\\n    [start.plus({ minute: 8 }).toMillis(), 1, 4],\\n  ];\\n  const dateFormatter = timeFormatter('HH:mm:ss');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title=\\\"Bottom axis\\\"\\n        showOverlappingTicks\\n        tickFormat={dateFormatter}\\n      />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"data1\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"data2\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[2]}\\n        data={data2}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, boolean, color, number, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Fit,\\n  SeriesType,\\n  RecursivePartial,\\n} from '@elastic/charts';\\n\\nimport { ColorVariant } from '../../../packages/charts/src/utils/common';\\nimport { AreaFitStyle, LineFitStyle, TextureShape } from '../../../packages/charts/src/utils/themes/theme';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\ninterface MixedDatum {\\n  x: number | string;\\n  y: number | string | null;\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const dataTypes: Record<string, MixedDatum[]> = {\\n    isolated: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 3, y: 4 },\\n      { x: 4, y: null },\\n      { x: 5, y: 5 },\\n      { x: 6, y: null },\\n      { x: 7, y: 12 },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    successive: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 4, y: null },\\n      { x: 6, y: null },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    endPoints: [\\n      { x: 0, y: null },\\n      { x: 1, y: 5 },\\n      { x: 3, y: 4 },\\n      { x: 5, y: 5 },\\n      { x: 7, y: 12 },\\n      { x: 9, y: 10 },\\n      { x: 10, y: null },\\n    ],\\n    ordinal: [\\n      { x: 'a', y: null },\\n      { x: 'b', y: 3 },\\n      { x: 'c', y: 5 },\\n      { x: 'd', y: null },\\n      { x: 'e', y: 4 },\\n      { x: 'f', y: null },\\n      { x: 'g', y: 5 },\\n      { x: 'h', y: 6 },\\n      { x: 'i', y: null },\\n      { x: 'j', y: null },\\n      { x: 'k', y: null },\\n      { x: 'l', y: 12 },\\n      { x: 'm', y: null },\\n    ],\\n    all: [\\n      { x: 0, y: null },\\n      { x: 1, y: 3 },\\n      { x: 2, y: 5 },\\n      { x: 3, y: null },\\n      { x: 4, y: 4 },\\n      { x: 5, y: null },\\n      { x: 6, y: 5 },\\n      { x: 7, y: 6 },\\n      { x: 8, y: null },\\n      { x: 9, y: null },\\n      { x: 10, y: null },\\n      { x: 11, y: 12 },\\n      { x: 12, y: null },\\n    ],\\n  };\\n\\n  const seriesType = select<string>(\\n    'seriesType',\\n    {\\n      Area: SeriesType.Area,\\n      Line: SeriesType.Line,\\n    },\\n    SeriesType.Area,\\n  );\\n  const dataKey = select<keyof typeof dataTypes>(\\n    'dataset',\\n    {\\n      'Isolated Points': 'isolated',\\n      'Successive null Points': 'successive',\\n      'null end points': 'endPoints',\\n      'Ordinal x values': 'ordinal',\\n      'All edge cases': 'all',\\n    },\\n    'all',\\n  );\\n  const dataset = dataTypes[dataKey];\\n  const fit = customKnobs.enum.fit();\\n  const curve = customKnobs.enum.curve();\\n  const endValue = select<number | 'none' | 'nearest'>(\\n    'End value',\\n    {\\n      None: 'none',\\n      nearest: 'nearest',\\n      0: 0,\\n      2: 2,\\n    },\\n    'none',\\n  );\\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\\n  const value = number('Explicit value (using Fit.Explicit)', 5);\\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\\n  const baseTheme = useBaseTheme();\\n\\n  const useSeriesColorLine = boolean('use series color for line', true, 'fit style');\\n  const customLineColor = color('fit line color', 'rgba(0,0,0,1)', 'fit style');\\n\\n  const fitLineStyle: RecursivePartial<LineFitStyle> = {\\n    opacity: number(\\n      'fit line opacity',\\n      seriesType === SeriesType.Area\\n        ? baseTheme.areaSeriesStyle.fit.line.opacity\\n        : baseTheme.lineSeriesStyle.fit.line.opacity,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.05,\\n      },\\n      'fit style',\\n    ),\\n    stroke: useSeriesColorLine ? ColorVariant.Series : customLineColor,\\n    dash: text(\\n      'fit line dash array',\\n      (seriesType === SeriesType.Area\\n        ? baseTheme.areaSeriesStyle.fit.line.dash\\n        : baseTheme.lineSeriesStyle.fit.line.dash\\n      ).join(','),\\n      'fit style',\\n    )\\n      .split(',')\\n      .map(Number),\\n  };\\n  const useSeriesColor = boolean('use series color for area', true, 'fit style');\\n  const fitAreaCustomColor = color('fit area color', 'rgba(0,0,0,1)', 'fit style');\\n  const fitAreaOpacity = number(\\n    'fit area opacity',\\n    baseTheme.areaSeriesStyle.fit.area.opacity,\\n    {\\n      range: true,\\n      min: 0,\\n      max: baseTheme.areaSeriesStyle.area.opacity,\\n      step: 0.01,\\n    },\\n    'fit style',\\n  );\\n  const fitAreaStyle: RecursivePartial<AreaFitStyle> = {\\n    opacity: fitAreaOpacity,\\n    fill: useSeriesColor ? ColorVariant.Series : fitAreaCustomColor,\\n    texture: boolean('use texture on area', false, 'fit style')\\n      ? { shape: TextureShape.Line, rotation: -45, opacity: fitAreaOpacity }\\n      : undefined,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={baseTheme}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} />\\n      {seriesType === SeriesType.Area ? (\\n        <AreaSeries\\n          id=\\\"test\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          curve={curve}\\n          fit={{\\n            type: fit,\\n            value: fit === Fit.Explicit ? value : undefined,\\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\\n          }}\\n          areaSeriesStyle={{\\n            fit: {\\n              line: fitLineStyle,\\n              area: fitAreaStyle,\\n            },\\n          }}\\n          data={dataset}\\n        />\\n      ) : (\\n        <LineSeries\\n          id=\\\"test\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          curve={curve}\\n          fit={{\\n            type: fit,\\n            value: fit === Fit.Explicit ? value : undefined,\\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\\n          }}\\n          lineSeriesStyle={{\\n            fit: {\\n              line: fitLineStyle,\\n            },\\n          }}\\n          data={dataset}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":36},\"endLoc\":{\"col\":1,\"line\":249},\"startBody\":{\"col\":36,\"line\":36},\"endBody\":{\"col\":1,\"line\":249}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, boolean, color, number, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  Fit,\n  SeriesType,\n  RecursivePartial,\n} from '@elastic/charts';\n\nimport { ColorVariant } from '../../../packages/charts/src/utils/common';\nimport { AreaFitStyle, LineFitStyle, TextureShape } from '../../../packages/charts/src/utils/themes/theme';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\ninterface MixedDatum {\n  x: number | string;\n  y: number | string | null;\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const dataTypes: Record<string, MixedDatum[]> = {\n    isolated: [\n      { x: 0, y: 3 },\n      { x: 1, y: 5 },\n      { x: 2, y: null },\n      { x: 3, y: 4 },\n      { x: 4, y: null },\n      { x: 5, y: 5 },\n      { x: 6, y: null },\n      { x: 7, y: 12 },\n      { x: 8, y: null },\n      { x: 9, y: 10 },\n      { x: 10, y: 7 },\n    ],\n    successive: [\n      { x: 0, y: 3 },\n      { x: 1, y: 5 },\n      { x: 2, y: null },\n      { x: 4, y: null },\n      { x: 6, y: null },\n      { x: 8, y: null },\n      { x: 9, y: 10 },\n      { x: 10, y: 7 },\n    ],\n    endPoints: [\n      { x: 0, y: null },\n      { x: 1, y: 5 },\n      { x: 3, y: 4 },\n      { x: 5, y: 5 },\n      { x: 7, y: 12 },\n      { x: 9, y: 10 },\n      { x: 10, y: null },\n    ],\n    ordinal: [\n      { x: 'a', y: null },\n      { x: 'b', y: 3 },\n      { x: 'c', y: 5 },\n      { x: 'd', y: null },\n      { x: 'e', y: 4 },\n      { x: 'f', y: null },\n      { x: 'g', y: 5 },\n      { x: 'h', y: 6 },\n      { x: 'i', y: null },\n      { x: 'j', y: null },\n      { x: 'k', y: null },\n      { x: 'l', y: 12 },\n      { x: 'm', y: null },\n    ],\n    all: [\n      { x: 0, y: null },\n      { x: 1, y: 3 },\n      { x: 2, y: 5 },\n      { x: 3, y: null },\n      { x: 4, y: 4 },\n      { x: 5, y: null },\n      { x: 6, y: 5 },\n      { x: 7, y: 6 },\n      { x: 8, y: null },\n      { x: 9, y: null },\n      { x: 10, y: null },\n      { x: 11, y: 12 },\n      { x: 12, y: null },\n    ],\n  };\n\n  const seriesType = select<string>(\n    'seriesType',\n    {\n      Area: SeriesType.Area,\n      Line: SeriesType.Line,\n    },\n    SeriesType.Area,\n  );\n  const dataKey = select<keyof typeof dataTypes>(\n    'dataset',\n    {\n      'Isolated Points': 'isolated',\n      'Successive null Points': 'successive',\n      'null end points': 'endPoints',\n      'Ordinal x values': 'ordinal',\n      'All edge cases': 'all',\n    },\n    'all',\n  );\n  const dataset = dataTypes[dataKey];\n  const fit = customKnobs.enum.fit();\n  const curve = customKnobs.enum.curve();\n  const endValue = select<number | 'none' | 'nearest'>(\n    'End value',\n    {\n      None: 'none',\n      nearest: 'nearest',\n      0: 0,\n      2: 2,\n    },\n    'none',\n  );\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\n  const value = number('Explicit value (using Fit.Explicit)', 5);\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\n  const baseTheme = useBaseTheme();\n\n  const useSeriesColorLine = boolean('use series color for line', true, 'fit style');\n  const customLineColor = color('fit line color', 'rgba(0,0,0,1)', 'fit style');\n\n  const fitLineStyle: RecursivePartial<LineFitStyle> = {\n    opacity: number(\n      'fit line opacity',\n      seriesType === SeriesType.Area\n        ? baseTheme.areaSeriesStyle.fit.line.opacity\n        : baseTheme.lineSeriesStyle.fit.line.opacity,\n      {\n        range: true,\n        min: 0,\n        max: 1,\n        step: 0.05,\n      },\n      'fit style',\n    ),\n    stroke: useSeriesColorLine ? ColorVariant.Series : customLineColor,\n    dash: text(\n      'fit line dash array',\n      (seriesType === SeriesType.Area\n        ? baseTheme.areaSeriesStyle.fit.line.dash\n        : baseTheme.lineSeriesStyle.fit.line.dash\n      ).join(','),\n      'fit style',\n    )\n      .split(',')\n      .map(Number),\n  };\n  const useSeriesColor = boolean('use series color for area', true, 'fit style');\n  const fitAreaCustomColor = color('fit area color', 'rgba(0,0,0,1)', 'fit style');\n  const fitAreaOpacity = number(\n    'fit area opacity',\n    baseTheme.areaSeriesStyle.fit.area.opacity,\n    {\n      range: true,\n      min: 0,\n      max: baseTheme.areaSeriesStyle.area.opacity,\n      step: 0.01,\n    },\n    'fit style',\n  );\n  const fitAreaStyle: RecursivePartial<AreaFitStyle> = {\n    opacity: fitAreaOpacity,\n    fill: useSeriesColor ? ColorVariant.Series : fitAreaCustomColor,\n    texture: boolean('use texture on area', false, 'fit style')\n      ? { shape: TextureShape.Line, rotation: -45, opacity: fitAreaOpacity }\n      : undefined,\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={{\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n            },\n          },\n        }}\n        baseTheme={baseTheme}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} />\n      {seriesType === SeriesType.Area ? (\n        <AreaSeries\n          id=\"test\"\n          xScaleType={xScaleType}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          curve={curve}\n          fit={{\n            type: fit,\n            value: fit === Fit.Explicit ? value : undefined,\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\n          }}\n          areaSeriesStyle={{\n            fit: {\n              line: fitLineStyle,\n              area: fitAreaStyle,\n            },\n          }}\n          data={dataset}\n        />\n      ) : (\n        <LineSeries\n          id=\"test\"\n          xScaleType={xScaleType}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          curve={curve}\n          fit={{\n            type: fit,\n            value: fit === Fit.Explicit ? value : undefined,\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\n          }}\n          lineSeriesStyle={{\n            fit: {\n              line: fitLineStyle,\n            },\n          }}\n          data={dataset}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const dataTypes: Record<string, MixedDatum[]> = {\\n    isolated: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 3, y: 4 },\\n      { x: 4, y: null },\\n      { x: 5, y: 5 },\\n      { x: 6, y: null },\\n      { x: 7, y: 12 },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    successive: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 4, y: null },\\n      { x: 6, y: null },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    endPoints: [\\n      { x: 0, y: null },\\n      { x: 1, y: 5 },\\n      { x: 3, y: 4 },\\n      { x: 5, y: 5 },\\n      { x: 7, y: 12 },\\n      { x: 9, y: 10 },\\n      { x: 10, y: null },\\n    ],\\n    ordinal: [\\n      { x: 'a', y: null },\\n      { x: 'b', y: 3 },\\n      { x: 'c', y: 5 },\\n      { x: 'd', y: null },\\n      { x: 'e', y: 4 },\\n      { x: 'f', y: null },\\n      { x: 'g', y: 5 },\\n      { x: 'h', y: 6 },\\n      { x: 'i', y: null },\\n      { x: 'j', y: null },\\n      { x: 'k', y: null },\\n      { x: 'l', y: 12 },\\n      { x: 'm', y: null },\\n    ],\\n    all: [\\n      { x: 0, y: null },\\n      { x: 1, y: 3 },\\n      { x: 2, y: 5 },\\n      { x: 3, y: null },\\n      { x: 4, y: 4 },\\n      { x: 5, y: null },\\n      { x: 6, y: 5 },\\n      { x: 7, y: 6 },\\n      { x: 8, y: null },\\n      { x: 9, y: null },\\n      { x: 10, y: null },\\n      { x: 11, y: 12 },\\n      { x: 12, y: null },\\n    ],\\n  };\\n\\n  const seriesType = select<string>(\\n    'seriesType',\\n    {\\n      Area: SeriesType.Area,\\n      Line: SeriesType.Line,\\n    },\\n    SeriesType.Area,\\n  );\\n  const dataKey = select<keyof typeof dataTypes>(\\n    'dataset',\\n    {\\n      'Isolated Points': 'isolated',\\n      'Successive null Points': 'successive',\\n      'null end points': 'endPoints',\\n      'Ordinal x values': 'ordinal',\\n      'All edge cases': 'all',\\n    },\\n    'all',\\n  );\\n  const dataset = dataTypes[dataKey];\\n  const fit = customKnobs.enum.fit();\\n  const curve = customKnobs.enum.curve();\\n  const endValue = select<number | 'none' | 'nearest'>(\\n    'End value',\\n    {\\n      None: 'none',\\n      nearest: 'nearest',\\n      0: 0,\\n      2: 2,\\n    },\\n    'none',\\n  );\\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\\n  const value = number('Explicit value (using Fit.Explicit)', 5);\\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\\n  const baseTheme = useBaseTheme();\\n\\n  const useSeriesColorLine = boolean('use series color for line', true, 'fit style');\\n  const customLineColor = color('fit line color', 'rgba(0,0,0,1)', 'fit style');\\n\\n  const fitLineStyle: RecursivePartial<LineFitStyle> = {\\n    opacity: number(\\n      'fit line opacity',\\n      seriesType === SeriesType.Area\\n        ? baseTheme.areaSeriesStyle.fit.line.opacity\\n        : baseTheme.lineSeriesStyle.fit.line.opacity,\\n      {\\n        range: true,\\n        min: 0,\\n        max: 1,\\n        step: 0.05,\\n      },\\n      'fit style',\\n    ),\\n    stroke: useSeriesColorLine ? ColorVariant.Series : customLineColor,\\n    dash: text(\\n      'fit line dash array',\\n      (seriesType === SeriesType.Area\\n        ? baseTheme.areaSeriesStyle.fit.line.dash\\n        : baseTheme.lineSeriesStyle.fit.line.dash\\n      ).join(','),\\n      'fit style',\\n    )\\n      .split(',')\\n      .map(Number),\\n  };\\n  const useSeriesColor = boolean('use series color for area', true, 'fit style');\\n  const fitAreaCustomColor = color('fit area color', 'rgba(0,0,0,1)', 'fit style');\\n  const fitAreaOpacity = number(\\n    'fit area opacity',\\n    baseTheme.areaSeriesStyle.fit.area.opacity,\\n    {\\n      range: true,\\n      min: 0,\\n      max: baseTheme.areaSeriesStyle.area.opacity,\\n      step: 0.01,\\n    },\\n    'fit style',\\n  );\\n  const fitAreaStyle: RecursivePartial<AreaFitStyle> = {\\n    opacity: fitAreaOpacity,\\n    fill: useSeriesColor ? ColorVariant.Series : fitAreaCustomColor,\\n    texture: boolean('use texture on area', false, 'fit style')\\n      ? { shape: TextureShape.Line, rotation: -45, opacity: fitAreaOpacity }\\n      : undefined,\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={baseTheme}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} />\\n      {seriesType === SeriesType.Area ? (\\n        <AreaSeries\\n          id=\\\"test\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          curve={curve}\\n          fit={{\\n            type: fit,\\n            value: fit === Fit.Explicit ? value : undefined,\\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\\n          }}\\n          areaSeriesStyle={{\\n            fit: {\\n              line: fitLineStyle,\\n              area: fitAreaStyle,\\n            },\\n          }}\\n          data={dataset}\\n        />\\n      ) : (\\n        <LineSeries\\n          id=\\\"test\\\"\\n          xScaleType={xScaleType}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          curve={curve}\\n          fit={{\\n            type: fit,\\n            value: fit === Fit.Explicit ? value : undefined,\\n            endValue: endValue === 'none' ? undefined : parsedEndValue,\\n          }}\\n          lineSeriesStyle={{\\n            fit: {\\n              line: fitLineStyle,\\n            },\\n          }}\\n          data={dataset}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, number, boolean } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, Fit, StackMode } from '@elastic/charts';\\nimport { getRandomNumberGenerator, getRNGSeed } from '@elastic/charts/src/mocks/utils';\\n\\nimport { TextureShape } from '../../../packages/charts/src/utils/themes/theme';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const randomizeBoundingData = getRNGSeed() ? false : boolean('randomize bounding data', false);\\n  const dataTypes: Record<string, Array<{ x: number | string; y: number | null }>> = {\\n    isolated: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 3, y: 4 },\\n      { x: 4, y: null },\\n      { x: 5, y: 5 },\\n      { x: 6, y: null },\\n      { x: 7, y: 12 },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    successive: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 4, y: null },\\n      { x: 6, y: null },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    endPoints: [\\n      { x: 0, y: null },\\n      { x: 1, y: 5 },\\n      { x: 3, y: 4 },\\n      { x: 5, y: 5 },\\n      { x: 7, y: 12 },\\n      { x: 9, y: 10 },\\n      { x: 10, y: null },\\n    ],\\n    ordinal: [\\n      { x: 'a', y: null },\\n      { x: 'b', y: 3 },\\n      { x: 'c', y: 5 },\\n      { x: 'd', y: null },\\n      { x: 'e', y: 4 },\\n      { x: 'f', y: null },\\n      { x: 'g', y: 5 },\\n      { x: 'h', y: 6 },\\n      { x: 'i', y: null },\\n      { x: 'j', y: null },\\n      { x: 'k', y: null },\\n      { x: 'l', y: 12 },\\n      { x: 'm', y: null },\\n    ],\\n    all: [\\n      { x: 0, y: null },\\n      { x: 1, y: 3 },\\n      { x: 2, y: 5 },\\n      { x: 3, y: null },\\n      { x: 4, y: 4 },\\n      { x: 5, y: null },\\n      { x: 6, y: 5 },\\n      { x: 7, y: 6 },\\n      { x: 8, y: null },\\n      { x: 9, y: null },\\n      { x: 10, y: null },\\n      { x: 11, y: 12 },\\n      { x: 12, y: null },\\n    ],\\n  };\\n\\n  const stackMode = select<StackMode | 'none'>(\\n    'stackMode',\\n    {\\n      Percentage: StackMode.Percentage,\\n      Silhouette: StackMode.Silhouette,\\n      Wiggle: StackMode.Wiggle,\\n      None: 'none',\\n    },\\n    'none',\\n  );\\n\\n  const dataKey = select<keyof typeof dataTypes>(\\n    'dataset',\\n    {\\n      'Isolated Points': 'isolated',\\n      'Successive null Points': 'successive',\\n      'null end points': 'endPoints',\\n      'Ordinal x values': 'ordinal',\\n      'All edge cases': 'all',\\n    },\\n    'all',\\n  );\\n\\n  const dataset = dataTypes[dataKey];\\n  const fit = customKnobs.enum.fit();\\n  const curve = customKnobs.enum.curve();\\n  const endValue = select<number | 'none' | 'nearest'>(\\n    'End value',\\n    {\\n      None: 'none',\\n      nearest: 'nearest',\\n      0: 0,\\n      2: 2,\\n    },\\n    'none',\\n  );\\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\\n  const value = number('Explicit value (using Fit.Explicit)', 5);\\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\\n  const rngSeed = randomizeBoundingData ? undefined : getRNGSeed('__seed__');\\n  const rng = getRandomNumberGenerator(rngSeed);\\n  const tickFormat = stackMode === 'percentage' ? (d: any) => numeral(d).format('0[.]00%') : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={tickFormat} />\\n      <AreaSeries\\n        id=\\\"test3\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={curve}\\n        stackAccessors={['x']}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset.map((d: any) => ({\\n          ...d,\\n          y: rng(2, 10),\\n        }))}\\n      />\\n      <AreaSeries\\n        id=\\\"test\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        stackMode={stackMode === 'none' ? undefined : stackMode}\\n        curve={curve}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset}\\n        areaSeriesStyle={\\n          boolean('apply custom fit style', false)\\n            ? {\\n                fit: {\\n                  line: {\\n                    stroke: 'gray',\\n                    opacity: 0.5,\\n                  },\\n                  area: {\\n                    fill: 'gray',\\n                    texture: {\\n                      shape: TextureShape.Line,\\n                      rotation: -45,\\n                      opacity: 0.2,\\n                    },\\n                  },\\n                },\\n              }\\n            : undefined\\n        }\\n      />\\n      <AreaSeries\\n        id=\\\"test2\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={curve}\\n        stackAccessors={['x']}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset.map((d) => ({\\n          ...d,\\n          y: rng(2, 10),\\n        }))}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":220},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":220}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, number, boolean } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, Position, ScaleType, Settings, Fit, StackMode } from '@elastic/charts';\nimport { getRandomNumberGenerator, getRNGSeed } from '@elastic/charts/src/mocks/utils';\n\nimport { TextureShape } from '../../../packages/charts/src/utils/themes/theme';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const randomizeBoundingData = getRNGSeed() ? false : boolean('randomize bounding data', false);\n  const dataTypes: Record<string, Array<{ x: number | string; y: number | null }>> = {\n    isolated: [\n      { x: 0, y: 3 },\n      { x: 1, y: 5 },\n      { x: 2, y: null },\n      { x: 3, y: 4 },\n      { x: 4, y: null },\n      { x: 5, y: 5 },\n      { x: 6, y: null },\n      { x: 7, y: 12 },\n      { x: 8, y: null },\n      { x: 9, y: 10 },\n      { x: 10, y: 7 },\n    ],\n    successive: [\n      { x: 0, y: 3 },\n      { x: 1, y: 5 },\n      { x: 2, y: null },\n      { x: 4, y: null },\n      { x: 6, y: null },\n      { x: 8, y: null },\n      { x: 9, y: 10 },\n      { x: 10, y: 7 },\n    ],\n    endPoints: [\n      { x: 0, y: null },\n      { x: 1, y: 5 },\n      { x: 3, y: 4 },\n      { x: 5, y: 5 },\n      { x: 7, y: 12 },\n      { x: 9, y: 10 },\n      { x: 10, y: null },\n    ],\n    ordinal: [\n      { x: 'a', y: null },\n      { x: 'b', y: 3 },\n      { x: 'c', y: 5 },\n      { x: 'd', y: null },\n      { x: 'e', y: 4 },\n      { x: 'f', y: null },\n      { x: 'g', y: 5 },\n      { x: 'h', y: 6 },\n      { x: 'i', y: null },\n      { x: 'j', y: null },\n      { x: 'k', y: null },\n      { x: 'l', y: 12 },\n      { x: 'm', y: null },\n    ],\n    all: [\n      { x: 0, y: null },\n      { x: 1, y: 3 },\n      { x: 2, y: 5 },\n      { x: 3, y: null },\n      { x: 4, y: 4 },\n      { x: 5, y: null },\n      { x: 6, y: 5 },\n      { x: 7, y: 6 },\n      { x: 8, y: null },\n      { x: 9, y: null },\n      { x: 10, y: null },\n      { x: 11, y: 12 },\n      { x: 12, y: null },\n    ],\n  };\n\n  const stackMode = select<StackMode | 'none'>(\n    'stackMode',\n    {\n      Percentage: StackMode.Percentage,\n      Silhouette: StackMode.Silhouette,\n      Wiggle: StackMode.Wiggle,\n      None: 'none',\n    },\n    'none',\n  );\n\n  const dataKey = select<keyof typeof dataTypes>(\n    'dataset',\n    {\n      'Isolated Points': 'isolated',\n      'Successive null Points': 'successive',\n      'null end points': 'endPoints',\n      'Ordinal x values': 'ordinal',\n      'All edge cases': 'all',\n    },\n    'all',\n  );\n\n  const dataset = dataTypes[dataKey];\n  const fit = customKnobs.enum.fit();\n  const curve = customKnobs.enum.curve();\n  const endValue = select<number | 'none' | 'nearest'>(\n    'End value',\n    {\n      None: 'none',\n      nearest: 'nearest',\n      0: 0,\n      2: 2,\n    },\n    'none',\n  );\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\n  const value = number('Explicit value (using Fit.Explicit)', 5);\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\n  const rngSeed = randomizeBoundingData ? undefined : getRNGSeed('__seed__');\n  const rng = getRandomNumberGenerator(rngSeed);\n  const tickFormat = stackMode === 'percentage' ? (d: any) => numeral(d).format('0[.]00%') : undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={{\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} tickFormat={tickFormat} />\n      <AreaSeries\n        id=\"test3\"\n        xScaleType={xScaleType}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={curve}\n        stackAccessors={['x']}\n        fit={{\n          type: fit,\n          value: fit === Fit.Explicit ? value : undefined,\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\n        }}\n        data={dataset.map((d: any) => ({\n          ...d,\n          y: rng(2, 10),\n        }))}\n      />\n      <AreaSeries\n        id=\"test\"\n        xScaleType={xScaleType}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        stackMode={stackMode === 'none' ? undefined : stackMode}\n        curve={curve}\n        fit={{\n          type: fit,\n          value: fit === Fit.Explicit ? value : undefined,\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\n        }}\n        data={dataset}\n        areaSeriesStyle={\n          boolean('apply custom fit style', false)\n            ? {\n                fit: {\n                  line: {\n                    stroke: 'gray',\n                    opacity: 0.5,\n                  },\n                  area: {\n                    fill: 'gray',\n                    texture: {\n                      shape: TextureShape.Line,\n                      rotation: -45,\n                      opacity: 0.2,\n                    },\n                  },\n                },\n              }\n            : undefined\n        }\n      />\n      <AreaSeries\n        id=\"test2\"\n        xScaleType={xScaleType}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={curve}\n        stackAccessors={['x']}\n        fit={{\n          type: fit,\n          value: fit === Fit.Explicit ? value : undefined,\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\n        }}\n        data={dataset.map((d) => ({\n          ...d,\n          y: rng(2, 10),\n        }))}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const randomizeBoundingData = getRNGSeed() ? false : boolean('randomize bounding data', false);\\n  const dataTypes: Record<string, Array<{ x: number | string; y: number | null }>> = {\\n    isolated: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 3, y: 4 },\\n      { x: 4, y: null },\\n      { x: 5, y: 5 },\\n      { x: 6, y: null },\\n      { x: 7, y: 12 },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    successive: [\\n      { x: 0, y: 3 },\\n      { x: 1, y: 5 },\\n      { x: 2, y: null },\\n      { x: 4, y: null },\\n      { x: 6, y: null },\\n      { x: 8, y: null },\\n      { x: 9, y: 10 },\\n      { x: 10, y: 7 },\\n    ],\\n    endPoints: [\\n      { x: 0, y: null },\\n      { x: 1, y: 5 },\\n      { x: 3, y: 4 },\\n      { x: 5, y: 5 },\\n      { x: 7, y: 12 },\\n      { x: 9, y: 10 },\\n      { x: 10, y: null },\\n    ],\\n    ordinal: [\\n      { x: 'a', y: null },\\n      { x: 'b', y: 3 },\\n      { x: 'c', y: 5 },\\n      { x: 'd', y: null },\\n      { x: 'e', y: 4 },\\n      { x: 'f', y: null },\\n      { x: 'g', y: 5 },\\n      { x: 'h', y: 6 },\\n      { x: 'i', y: null },\\n      { x: 'j', y: null },\\n      { x: 'k', y: null },\\n      { x: 'l', y: 12 },\\n      { x: 'm', y: null },\\n    ],\\n    all: [\\n      { x: 0, y: null },\\n      { x: 1, y: 3 },\\n      { x: 2, y: 5 },\\n      { x: 3, y: null },\\n      { x: 4, y: 4 },\\n      { x: 5, y: null },\\n      { x: 6, y: 5 },\\n      { x: 7, y: 6 },\\n      { x: 8, y: null },\\n      { x: 9, y: null },\\n      { x: 10, y: null },\\n      { x: 11, y: 12 },\\n      { x: 12, y: null },\\n    ],\\n  };\\n\\n  const stackMode = select<StackMode | 'none'>(\\n    'stackMode',\\n    {\\n      Percentage: StackMode.Percentage,\\n      Silhouette: StackMode.Silhouette,\\n      Wiggle: StackMode.Wiggle,\\n      None: 'none',\\n    },\\n    'none',\\n  );\\n\\n  const dataKey = select<keyof typeof dataTypes>(\\n    'dataset',\\n    {\\n      'Isolated Points': 'isolated',\\n      'Successive null Points': 'successive',\\n      'null end points': 'endPoints',\\n      'Ordinal x values': 'ordinal',\\n      'All edge cases': 'all',\\n    },\\n    'all',\\n  );\\n\\n  const dataset = dataTypes[dataKey];\\n  const fit = customKnobs.enum.fit();\\n  const curve = customKnobs.enum.curve();\\n  const endValue = select<number | 'none' | 'nearest'>(\\n    'End value',\\n    {\\n      None: 'none',\\n      nearest: 'nearest',\\n      0: 0,\\n      2: 2,\\n    },\\n    'none',\\n  );\\n  const parsedEndValue: number | 'nearest' = Number.isNaN(Number(endValue)) ? 'nearest' : Number(endValue);\\n  const value = number('Explicit value (using Fit.Explicit)', 5);\\n  const xScaleType = dataKey === 'ordinal' ? ScaleType.Ordinal : ScaleType.Linear;\\n  const rngSeed = randomizeBoundingData ? undefined : getRNGSeed('__seed__');\\n  const rng = getRandomNumberGenerator(rngSeed);\\n  const tickFormat = stackMode === 'percentage' ? (d: any) => numeral(d).format('0[.]00%') : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={tickFormat} />\\n      <AreaSeries\\n        id=\\\"test3\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={curve}\\n        stackAccessors={['x']}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset.map((d: any) => ({\\n          ...d,\\n          y: rng(2, 10),\\n        }))}\\n      />\\n      <AreaSeries\\n        id=\\\"test\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        stackMode={stackMode === 'none' ? undefined : stackMode}\\n        curve={curve}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset}\\n        areaSeriesStyle={\\n          boolean('apply custom fit style', false)\\n            ? {\\n                fit: {\\n                  line: {\\n                    stroke: 'gray',\\n                    opacity: 0.5,\\n                  },\\n                  area: {\\n                    fill: 'gray',\\n                    texture: {\\n                      shape: TextureShape.Line,\\n                      rotation: -45,\\n                      opacity: 0.2,\\n                    },\\n                  },\\n                },\\n              }\\n            : undefined\\n        }\\n      />\\n      <AreaSeries\\n        id=\\\"test2\\\"\\n        xScaleType={xScaleType}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={curve}\\n        stackAccessors={['x']}\\n        fit={{\\n          type: fit,\\n          value: fit === Fit.Explicit ? value : undefined,\\n          endValue: endValue === 'none' ? undefined : parsedEndValue,\\n        }}\\n        data={dataset.map((d) => ({\\n          ...d,\\n          y: rng(2, 10),\\n        }))}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { number, boolean, text } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst getRandomNumber = getRandomNumberGenerator();\\nconst data1 = new Array(100).fill(0).map((_, x) => ({\\n  x,\\n  y: getRandomNumber(0, 100),\\n  z: getRandomNumber(0, 50),\\n}));\\nconst data2 = new Array(100).fill(0).map((_, x) => ({\\n  x,\\n  y: getRandomNumber(0, 100),\\n  z: getRandomNumber(200, 500, 4),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('data size', 20, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n  const markFormat = text('markFormat', '0.0');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          markSizeRatio,\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data1.slice(0, size)}\\n        markFormat={(d) => `${numeral(d).format(markFormat)}%`}\\n      />\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data2.slice(0, size)}\\n        markFormat={(d) => `$${numeral(d).format(markFormat)}`}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":93},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":93}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { number, boolean, text } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport { AreaSeries, Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst getRandomNumber = getRandomNumberGenerator();\nconst data1 = new Array(100).fill(0).map((_, x) => ({\n  x,\n  y: getRandomNumber(0, 100),\n  z: getRandomNumber(0, 50),\n}));\nconst data2 = new Array(100).fill(0).map((_, x) => ({\n  x,\n  y: getRandomNumber(0, 100),\n  z: getRandomNumber(200, 500, 4),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementListeners = {\n    onElementClick: action('onElementClick'),\n    onElementOver: action('onElementOver'),\n    onElementOut: action('onElementOut'),\n  };\n  const markSizeRatio = number('markSizeRatio', 30, {\n    range: true,\n    min: 1,\n    max: 100,\n    step: 1,\n  });\n  const size = number('data size', 20, {\n    range: true,\n    min: 10,\n    max: 100,\n    step: 10,\n  });\n  const markFormat = text('markFormat', '0.0');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          markSizeRatio,\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        pointBuffer={(r) => 20 / r}\n        {...onElementListeners}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={data1.slice(0, size)}\n        markFormat={(d) => `${numeral(d).format(markFormat)}%`}\n      />\n      <LineSeries\n        id=\"line\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        markSizeAccessor=\"z\"\n        data={data2.slice(0, size)}\n        markFormat={(d) => `$${numeral(d).format(markFormat)}`}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementListeners = {\\n    onElementClick: action('onElementClick'),\\n    onElementOver: action('onElementOver'),\\n    onElementOut: action('onElementOut'),\\n  };\\n  const markSizeRatio = number('markSizeRatio', 30, {\\n    range: true,\\n    min: 1,\\n    max: 100,\\n    step: 1,\\n  });\\n  const size = number('data size', 20, {\\n    range: true,\\n    min: 10,\\n    max: 100,\\n    step: 10,\\n  });\\n  const markFormat = text('markFormat', '0.0');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          markSizeRatio,\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        pointBuffer={(r) => 20 / r}\\n        {...onElementListeners}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data1.slice(0, size)}\\n        markFormat={(d) => `${numeral(d).format(markFormat)}%`}\\n      />\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        markSizeAccessor=\\\"z\\\"\\n        data={data2.slice(0, size)}\\n        markFormat={(d) => `$${numeral(d).format(markFormat)}`}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  StackMode,\\n  SeriesType,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { data } from '../utils/datasets/product_profits';\\nimport { customKnobs } from '../utils/knobs';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const baseTheme = useBaseTheme();\\n  const stacked = boolean('stacked', true);\\n  const polarity = select('data polarity', ['Mixed', 'Positive', 'Negative'], 'Mixed');\\n  const customDomain = boolean('custom domain', false);\\n  const stackMode =\\n    select<StackMode | undefined>(\\n      'stackMode',\\n      {\\n        None: undefined,\\n        Silhouette: StackMode.Silhouette,\\n        Wiggle: StackMode.Wiggle,\\n        Percentage: StackMode.Percentage,\\n      },\\n      undefined,\\n    ) ?? undefined;\\n  const [Series] = customKnobs.enum.xySeries('SeriesType', SeriesType.Bar, {\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={baseTheme} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Products\\\" />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Profit\\\"\\n        position={Position.Left}\\n        domain={customDomain ? { min: -25000, max: 50000 } : undefined}\\n        tickFormat={(d) => numeral(d).format(stackMode === 'percentage' ? '0%' : '$0,0')}\\n      />\\n\\n      <LineAnnotation\\n        id=\\\"zeroBaseline\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        dataValues={[{ dataValue: 0 }]}\\n        style={{ line: { ...baseTheme.axes.axisLine, opacity: 1 } }}\\n        zIndex={-1}\\n      />\\n\\n      <Series\\n        id=\\\"series\\\"\\n        color={['#7BC0F7', '#3C8AD8', '#F18026', '#FEDB69']}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"product\\\"\\n        y0Accessors={[() => 1]} // for testing warning\\n        yAccessors={[\\n          ({ profit }) => (polarity === 'Mixed' ? profit : (polarity === 'Negative' ? -1 : 1) * Math.abs(profit)),\\n        ]}\\n        splitSeriesAccessors={['state']}\\n        stackMode={stackMode}\\n        stackAccessors={stacked ? ['yes'] : undefined}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":86},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":86}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  StackMode,\n  SeriesType,\n  LineAnnotation,\n  AnnotationDomainType,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { data } from '../utils/datasets/product_profits';\nimport { customKnobs } from '../utils/knobs';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const baseTheme = useBaseTheme();\n  const stacked = boolean('stacked', true);\n  const polarity = select('data polarity', ['Mixed', 'Positive', 'Negative'], 'Mixed');\n  const customDomain = boolean('custom domain', false);\n  const stackMode =\n    select<StackMode | undefined>(\n      'stackMode',\n      {\n        None: undefined,\n        Silhouette: StackMode.Silhouette,\n        Wiggle: StackMode.Wiggle,\n        Percentage: StackMode.Percentage,\n      },\n      undefined,\n    ) ?? undefined;\n  const [Series] = customKnobs.enum.xySeries('SeriesType', SeriesType.Bar, {\n    exclude: [SeriesType.Bubble, SeriesType.Line],\n  });\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={baseTheme} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Products\" />\n      <Axis\n        id=\"left\"\n        title=\"Profit\"\n        position={Position.Left}\n        domain={customDomain ? { min: -25000, max: 50000 } : undefined}\n        tickFormat={(d) => numeral(d).format(stackMode === 'percentage' ? '0%' : '$0,0')}\n      />\n\n      <LineAnnotation\n        id=\"zeroBaseline\"\n        domainType={AnnotationDomainType.YDomain}\n        dataValues={[{ dataValue: 0 }]}\n        style={{ line: { ...baseTheme.axes.axisLine, opacity: 1 } }}\n        zIndex={-1}\n      />\n\n      <Series\n        id=\"series\"\n        color={['#7BC0F7', '#3C8AD8', '#F18026', '#FEDB69']}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"product\"\n        y0Accessors={[() => 1]} // for testing warning\n        yAccessors={[\n          ({ profit }) => (polarity === 'Mixed' ? profit : (polarity === 'Negative' ? -1 : 1) * Math.abs(profit)),\n        ]}\n        splitSeriesAccessors={['state']}\n        stackMode={stackMode}\n        stackAccessors={stacked ? ['yes'] : undefined}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const baseTheme = useBaseTheme();\\n  const stacked = boolean('stacked', true);\\n  const polarity = select('data polarity', ['Mixed', 'Positive', 'Negative'], 'Mixed');\\n  const customDomain = boolean('custom domain', false);\\n  const stackMode =\\n    select<StackMode | undefined>(\\n      'stackMode',\\n      {\\n        None: undefined,\\n        Silhouette: StackMode.Silhouette,\\n        Wiggle: StackMode.Wiggle,\\n        Percentage: StackMode.Percentage,\\n      },\\n      undefined,\\n    ) ?? undefined;\\n  const [Series] = customKnobs.enum.xySeries('SeriesType', SeriesType.Bar, {\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={baseTheme} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Products\\\" />\\n      <Axis\\n        id=\\\"left\\\"\\n        title=\\\"Profit\\\"\\n        position={Position.Left}\\n        domain={customDomain ? { min: -25000, max: 50000 } : undefined}\\n        tickFormat={(d) => numeral(d).format(stackMode === 'percentage' ? '0%' : '$0,0')}\\n      />\\n\\n      <LineAnnotation\\n        id=\\\"zeroBaseline\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        dataValues={[{ dataValue: 0 }]}\\n        style={{ line: { ...baseTheme.axes.axisLine, opacity: 1 } }}\\n        zIndex={-1}\\n      />\\n\\n      <Series\\n        id=\\\"series\\\"\\n        color={['#7BC0F7', '#3C8AD8', '#F18026', '#FEDB69']}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"product\\\"\\n        y0Accessors={[() => 1]} // for testing warning\\n        yAccessors={[\\n          ({ profit }) => (polarity === 'Mixed' ? profit : (polarity === 'Negative' ? -1 : 1) * Math.abs(profit)),\\n        ]}\\n        splitSeriesAccessors={['state']}\\n        stackMode={stackMode}\\n        stackAccessors={stacked ? ['yes'] : undefined}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Mixed Charts',\n};\n\nexport { Example as barsAndLines } from './1_bars_and_lines.story';\nexport { Example as linesAndAreas } from './2_lines_and_areas.story';\nexport { Example as areasAndBars } from './3_areas_and_bars.story';\nexport { Example as testBarLinesLinear } from './4_test_bar.story';\nexport { Example as testBarLinesTime } from './5_test_bar_time.story';\nexport { Example as fittingFunctionsNonStackedSeries } from './6_fitting.story';\nexport { Example as fittingFunctionsStackedSeries } from './6_fitting_stacked.story';\nexport { Example as markSizeAccessor } from './7_marks.story';\nexport { Example as PolarizedStacked } from './8_polarized_stacked.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, radios } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AdditiveNumber,\\n  ArrayEntry,\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, colorBrewerCategoricalPastel12B, regionLookup } from '../utils/utils';\\n\\nconst productLookup: Record<string, { label: string; position: number }> = {\\n  '3': { label: 'Firefox', position: 1 },\\n  '5': { label: 'Edge (Chromium)', position: 4 },\\n  '6': { label: 'Safari', position: 2 },\\n  '7': { label: 'Chrome', position: 0 },\\n  '8': { label: 'Brave', position: 3 },\\n};\\n\\nconst data = mocks.sunburst\\n  .map((d) => (d.dest === 'chn' ? { ...d, dest: 'zaf' } : d))\\n  .filter(\\n    (d: any) =>\\n      ['eu', 'na', 'as', 'af'].includes(countryLookup[d.dest].continentCountry.slice(0, 2)) &&\\n      ['3', '5', '6', '7', '8'].includes(d.sitc1),\\n  );\\n\\nconst productPalette = colorBrewerCategoricalPastel12B.slice(2);\\n\\nconst productToColor = new Map(\\n  data\\n    .map((d) => d.sitc1)\\n    .filter(keepDistinct)\\n    .sort()\\n    .map((sitc1, i) => [sitc1, `rgba(${productPalette[i % productPalette.length].join(',')}, 0.7)`]),\\n);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const partitionLayout = radios(\\n    'Partition layout',\\n    {\\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.mosaic,\\n  );\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        showLegend={boolean('Show legend', true)}\\n        showLegendExtra={boolean('Show legend values', true)}\\n        flatLegend={boolean('Flat legend', false)}\\n        theme={{\\n          partition: {\\n            linkLabel: { maxCount: 0 }, // relevant for sunburst only\\n            outerSizeRatio: 0.9, // relevant for sunburst only\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={partitionLayout}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (name) => (name !== null ? regionLookup[name].regionName : ''),\\n            fillLabel: {\\n              fontWeight: 400,\\n            },\\n            shape: {\\n              fillColor: partitionLayout === PartitionLayout.sunburst ? 'lightgrey' : 'white',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d) => (d !== null ? `${productLookup[d]?.label}` : ''),\\n            shape: {\\n              fillColor: (nodeKey) => productToColor.get(nodeKey)!,\\n            },\\n            sortPredicate: ([name1]: ArrayEntry, [name2]: ArrayEntry) => {\\n              const position1 = Number(productLookup[name1]?.position);\\n              const position2 = Number(productLookup[name2]?.position);\\n              return position2 - position1;\\n            },\\n            fillLabel: {\\n              fontWeight: 200,\\n              minFontSize: 6,\\n              maxFontSize: 16,\\n              maximizeFontSize: true,\\n              fontFamily: 'Helvetica Neue',\\n              valueFormatter: () => '',\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":55},\"endLoc\":{\"col\":1,\"line\":120},\"startBody\":{\"col\":36,\"line\":55},\"endBody\":{\"col\":1,\"line\":120}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, radios } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AdditiveNumber,\n  ArrayEntry,\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, colorBrewerCategoricalPastel12B, regionLookup } from '../utils/utils';\n\nconst productLookup: Record<string, { label: string; position: number }> = {\n  '3': { label: 'Firefox', position: 1 },\n  '5': { label: 'Edge (Chromium)', position: 4 },\n  '6': { label: 'Safari', position: 2 },\n  '7': { label: 'Chrome', position: 0 },\n  '8': { label: 'Brave', position: 3 },\n};\n\nconst data = mocks.sunburst\n  .map((d) => (d.dest === 'chn' ? { ...d, dest: 'zaf' } : d))\n  .filter(\n    (d: any) =>\n      ['eu', 'na', 'as', 'af'].includes(countryLookup[d.dest].continentCountry.slice(0, 2)) &&\n      ['3', '5', '6', '7', '8'].includes(d.sitc1),\n  );\n\nconst productPalette = colorBrewerCategoricalPastel12B.slice(2);\n\nconst productToColor = new Map(\n  data\n    .map((d) => d.sitc1)\n    .filter(keepDistinct)\n    .sort()\n    .map((sitc1, i) => [sitc1, `rgba(${productPalette[i % productPalette.length].join(',')}, 0.7)`]),\n);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const partitionLayout = radios(\n    'Partition layout',\n    {\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\n    },\n    PartitionLayout.mosaic,\n  );\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings\n        showLegend={boolean('Show legend', true)}\n        showLegendExtra={boolean('Show legend values', true)}\n        flatLegend={boolean('Flat legend', false)}\n        theme={{\n          partition: {\n            linkLabel: { maxCount: 0 }, // relevant for sunburst only\n            outerSizeRatio: 0.9, // relevant for sunburst only\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={data}\n        layout={partitionLayout}\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (name) => (name !== null ? regionLookup[name].regionName : ''),\n            fillLabel: {\n              fontWeight: 400,\n            },\n            shape: {\n              fillColor: partitionLayout === PartitionLayout.sunburst ? 'lightgrey' : 'white',\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d) => (d !== null ? `${productLookup[d]?.label}` : ''),\n            shape: {\n              fillColor: (nodeKey) => productToColor.get(nodeKey)!,\n            },\n            sortPredicate: ([name1]: ArrayEntry, [name2]: ArrayEntry) => {\n              const position1 = Number(productLookup[name1]?.position);\n              const position2 = Number(productLookup[name2]?.position);\n              return position2 - position1;\n            },\n            fillLabel: {\n              fontWeight: 200,\n              minFontSize: 6,\n              maxFontSize: 16,\n              maximizeFontSize: true,\n              fontFamily: 'Helvetica Neue',\n              valueFormatter: () => '',\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const partitionLayout = radios(\\n    'Partition layout',\\n    {\\n      [PartitionLayout.mosaic]: PartitionLayout.mosaic,\\n      [PartitionLayout.treemap]: PartitionLayout.treemap,\\n      [PartitionLayout.sunburst]: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.mosaic,\\n  );\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        showLegend={boolean('Show legend', true)}\\n        showLegendExtra={boolean('Show legend values', true)}\\n        flatLegend={boolean('Flat legend', false)}\\n        theme={{\\n          partition: {\\n            linkLabel: { maxCount: 0 }, // relevant for sunburst only\\n            outerSizeRatio: 0.9, // relevant for sunburst only\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={partitionLayout}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (name) => (name !== null ? regionLookup[name].regionName : ''),\\n            fillLabel: {\\n              fontWeight: 400,\\n            },\\n            shape: {\\n              fillColor: partitionLayout === PartitionLayout.sunburst ? 'lightgrey' : 'white',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d) => (d !== null ? `${productLookup[d]?.label}` : ''),\\n            shape: {\\n              fillColor: (nodeKey) => productToColor.get(nodeKey)!,\\n            },\\n            sortPredicate: ([name1]: ArrayEntry, [name2]: ArrayEntry) => {\\n              const position1 = Number(productLookup[name1]?.position);\\n              const position2 = Number(productLookup[name2]?.position);\\n              return position2 - position1;\\n            },\\n            fillLabel: {\\n              fontWeight: 200,\\n              minFontSize: 6,\\n              maxFontSize: 16,\\n              maximizeFontSize: true,\\n              fontFamily: 'Helvetica Neue',\\n              valueFormatter: () => '',\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AdditiveNumber,\\n  ArrayEntry,\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup } from '../utils/utils';\\n\\nconst categoricalColors = ['rgb(110,110,110)', 'rgb(123,123,123)', 'darkgrey', 'lightgrey'];\\n\\nconst data = [\\n  { region: 'Americas', dest: 'usa', other: false, exportVal: 553359100104 },\\n  { region: 'Americas', dest: 'Other', other: true, exportVal: 753359100104 },\\n  { region: 'Asia', dest: 'chn', other: false, exportVal: 392617281424 },\\n  { region: 'Asia', dest: 'jpn', other: false, exportVal: 177490158520 },\\n  { region: 'Asia', dest: 'kor', other: false, exportVal: 177421375512 },\\n  { region: 'Asia', dest: 'Other', other: true, exportVal: 277421375512 },\\n  { region: 'Europe', dest: 'deu', other: false, exportVal: 253250650864 },\\n  { region: 'Europe', dest: 'smr', other: false, exportVal: 135443006088 },\\n  { region: 'Europe', dest: 'Other', other: true, exportVal: 205443006088 },\\n  { region: 'Africa', dest: 'Other', other: true, exportVal: 305443006088 },\\n];\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const alphabetical = boolean('Alphabetical outer group sorting', false);\\n  const otherOnBottom = boolean('\\\"Other\\\" on bottom even if not the smallest', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={PartitionLayout.mosaic}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.region,\\n            nodeLabel: (d) => String(d).toUpperCase(),\\n            sortPredicate: alphabetical\\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n                  if (name1 < name2) return -1;\\n                  if (name2 < name1) return 1;\\n\\n                  // otherwise, use the increasing value order\\n                  return node1.value - node2.value;\\n                }\\n              : undefined,\\n            fillLabel: {\\n              valueFormatter: () => ``,\\n              fontWeight: 600,\\n            },\\n            shape: {\\n              fillColor: () => 'white',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\\n            sortPredicate: otherOnBottom\\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n                  if (name1 === 'Other' && name2 !== 'Other') return 1;\\n                  if (name2 === 'Other' && name1 !== 'Other') return -1;\\n\\n                  // otherwise, use the increasing value order\\n                  return node1.value - node2.value;\\n                }\\n              : undefined,\\n            fillLabel: {\\n              fontWeight: 100,\\n              maxFontSize: 16,\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (nodeKey, sortIndex, node) => categoricalColors.slice(0)[node.parent.sortIndex],\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":42},\"endLoc\":{\"col\":1,\"line\":104},\"startBody\":{\"col\":36,\"line\":42},\"endBody\":{\"col\":1,\"line\":104}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AdditiveNumber,\n  ArrayEntry,\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup } from '../utils/utils';\n\nconst categoricalColors = ['rgb(110,110,110)', 'rgb(123,123,123)', 'darkgrey', 'lightgrey'];\n\nconst data = [\n  { region: 'Americas', dest: 'usa', other: false, exportVal: 553359100104 },\n  { region: 'Americas', dest: 'Other', other: true, exportVal: 753359100104 },\n  { region: 'Asia', dest: 'chn', other: false, exportVal: 392617281424 },\n  { region: 'Asia', dest: 'jpn', other: false, exportVal: 177490158520 },\n  { region: 'Asia', dest: 'kor', other: false, exportVal: 177421375512 },\n  { region: 'Asia', dest: 'Other', other: true, exportVal: 277421375512 },\n  { region: 'Europe', dest: 'deu', other: false, exportVal: 253250650864 },\n  { region: 'Europe', dest: 'smr', other: false, exportVal: 135443006088 },\n  { region: 'Europe', dest: 'Other', other: true, exportVal: 205443006088 },\n  { region: 'Africa', dest: 'Other', other: true, exportVal: 305443006088 },\n];\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const alphabetical = boolean('Alphabetical outer group sorting', false);\n  const otherOnBottom = boolean('\"Other\" on bottom even if not the smallest', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={data}\n        layout={PartitionLayout.mosaic}\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.region,\n            nodeLabel: (d) => String(d).toUpperCase(),\n            sortPredicate: alphabetical\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\n                  if (name1 < name2) return -1;\n                  if (name2 < name1) return 1;\n\n                  // otherwise, use the increasing value order\n                  return node1.value - node2.value;\n                }\n              : undefined,\n            fillLabel: {\n              valueFormatter: () => ``,\n              fontWeight: 600,\n            },\n            shape: {\n              fillColor: () => 'white',\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\n            sortPredicate: otherOnBottom\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\n                  if (name1 === 'Other' && name2 !== 'Other') return 1;\n                  if (name2 === 'Other' && name1 !== 'Other') return -1;\n\n                  // otherwise, use the increasing value order\n                  return node1.value - node2.value;\n                }\n              : undefined,\n            fillLabel: {\n              fontWeight: 100,\n              maxFontSize: 16,\n              valueFont: {\n                fontFamily: 'Menlo',\n                fontStyle: 'normal',\n                fontWeight: 100,\n              },\n            },\n            shape: {\n              fillColor: (nodeKey, sortIndex, node) => categoricalColors.slice(0)[node.parent.sortIndex],\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const alphabetical = boolean('Alphabetical outer group sorting', false);\\n  const otherOnBottom = boolean('\\\"Other\\\" on bottom even if not the smallest', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={PartitionLayout.mosaic}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.region,\\n            nodeLabel: (d) => String(d).toUpperCase(),\\n            sortPredicate: alphabetical\\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n                  if (name1 < name2) return -1;\\n                  if (name2 < name1) return 1;\\n\\n                  // otherwise, use the increasing value order\\n                  return node1.value - node2.value;\\n                }\\n              : undefined,\\n            fillLabel: {\\n              valueFormatter: () => ``,\\n              fontWeight: 600,\\n            },\\n            shape: {\\n              fillColor: () => 'white',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\\n            sortPredicate: otherOnBottom\\n              ? ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n                  if (name1 === 'Other' && name2 !== 'Other') return 1;\\n                  if (name2 === 'Other' && name1 !== 'Other') return -1;\\n\\n                  // otherwise, use the increasing value order\\n                  return node1.value - node2.value;\\n                }\\n              : undefined,\\n            fillLabel: {\\n              fontWeight: 100,\\n              maxFontSize: 16,\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (nodeKey, sortIndex, node) => categoricalColors.slice(0)[node.parent.sortIndex],\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Mosaic (@alpha)',\n};\n\nexport { Example as simpleMosaic } from './10_mosaic_simple.story';\nexport { Example as otherSlices } from './20_mosaic_with_other.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      debug={boolean('Debug', true)}\\n      showLegend={boolean('Legend', true)}\\n      showLegendExtra\\n      legendPosition={select(\\n        'Legend position',\\n        {\\n          Left: Position.Left,\\n          Right: Position.Right,\\n          Top: Position.Top,\\n          Bottom: Position.Bottom,\\n        },\\n        Position.Right,\\n      )}\\n      rotation={select(\\n        'Rotation degree',\\n        {\\n          '0 deg(default)': 0,\\n          '90 deg': 90,\\n          '-90 deg': -90,\\n          '180 deg': 180,\\n        },\\n        0,\\n      )}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"Bottom axis\\\"\\n      showOverlappingTicks\\n      showOverlappingLabels={boolean('bottom show overlapping labels', false)}\\n    />\\n    <Axis\\n      id=\\\"left2\\\"\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      showOverlappingTicks\\n      showOverlappingLabels={boolean('left show overlapping labels', false)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      baseTheme={useBaseTheme()}\n      debug={boolean('Debug', true)}\n      showLegend={boolean('Legend', true)}\n      showLegendExtra\n      legendPosition={select(\n        'Legend position',\n        {\n          Left: Position.Left,\n          Right: Position.Right,\n          Top: Position.Top,\n          Bottom: Position.Bottom,\n        },\n        Position.Right,\n      )}\n      rotation={select(\n        'Rotation degree',\n        {\n          '0 deg(default)': 0,\n          '90 deg': 90,\n          '-90 deg': -90,\n          '180 deg': 180,\n        },\n        0,\n      )}\n    />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      title=\"Bottom axis\"\n      showOverlappingTicks\n      showOverlappingLabels={boolean('bottom show overlapping labels', false)}\n    />\n    <Axis\n      id=\"left2\"\n      title=\"Left axis\"\n      position={Position.Left}\n      showOverlappingTicks\n      showOverlappingLabels={boolean('left show overlapping labels', false)}\n    />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      debug={boolean('Debug', true)}\\n      showLegend={boolean('Legend', true)}\\n      showLegendExtra\\n      legendPosition={select(\\n        'Legend position',\\n        {\\n          Left: Position.Left,\\n          Right: Position.Right,\\n          Top: Position.Top,\\n          Bottom: Position.Bottom,\\n        },\\n        Position.Right,\\n      )}\\n      rotation={select(\\n        'Rotation degree',\\n        {\\n          '0 deg(default)': 0,\\n          '90 deg': 90,\\n          '-90 deg': -90,\\n          '180 deg': 180,\\n        },\\n        0,\\n      )}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      title=\\\"Bottom axis\\\"\\n      showOverlappingTicks\\n      showOverlappingLabels={boolean('bottom show overlapping labels', false)}\\n    />\\n    <Axis\\n      id=\\\"left2\\\"\\n      title=\\\"Left axis\\\"\\n      position={Position.Left}\\n      showOverlappingTicks\\n      showOverlappingLabels={boolean('left show overlapping labels', false)}\\n    />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\n    <Axis id=\"y top\" position={Position.Top} title=\"y top axis\" />\n    <Axis id=\"x right\" title=\"x right axis\" position={Position.Right} />\n    <Axis id=\"y bottom\" position={Position.Bottom} title=\"y bottom axis\" />\n    <Axis id=\"x left\" title=\"x left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\n    <Axis id=\"x top\" position={Position.Top} title=\"x top axis\" />\n    <Axis id=\"y right\" title=\"y right axis\" position={Position.Right} />\n    <Axis id=\"x bottom\" position={Position.Bottom} title=\"x bottom axis\" />\n    <Axis id=\"y left\" title=\"y left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\n    <Axis id=\"y top\" position={Position.Top} title=\"y top axis\" />\n    <Axis id=\"x right\" title=\"x right axis\" position={Position.Right} />\n    <Axis id=\"y bottom\" position={Position.Bottom} title=\"y bottom axis\" />\n    <Axis id=\"x left\" title=\"x left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\n    <Axis id=\"x top\" position={Position.Top} title=\"x top axis\" />\n    <Axis id=\"y right\" title=\"y right axis\" position={Position.Right} />\n    <Axis id=\"x bottom\" position={Position.Bottom} title=\"x bottom axis\" />\n    <Axis id=\"y left\" title=\"y left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Ordinal}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 'a', y: 1 },\n        { x: 'b', y: 2 },\n        { x: 'c', y: 3 },\n        { x: 'd', y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Ordinal}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 'a', y: 1 },\\n        { x: 'b', y: 2 },\\n        { x: 'c', y: 3 },\\n        { x: 'd', y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\n    <Axis id=\"y top\" position={Position.Top} title=\"y top axis\" />\n    <Axis id=\"x right\" title=\"x right axis\" position={Position.Right} />\n    <Axis id=\"y bottom\" position={Position.Bottom} title=\"y bottom axis\" />\n    <Axis id=\"x left\" title=\"x left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={-90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\n    <Axis id=\"x top\" position={Position.Top} title=\"x top axis\" />\n    <Axis id=\"y right\" title=\"y right axis\" position={Position.Right} />\n    <Axis id=\"x bottom\" position={Position.Bottom} title=\"x bottom axis\" />\n    <Axis id=\"y left\" title=\"y left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={0} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\n    <Axis id=\"y top\" position={Position.Top} title=\"y top axis\" />\n    <Axis id=\"x right\" title=\"x right axis\" position={Position.Right} />\n    <Axis id=\"y bottom\" position={Position.Bottom} title=\"y bottom axis\" />\n    <Axis id=\"x left\" title=\"x left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={90} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"y top\\\" position={Position.Top} title=\\\"y top axis\\\" />\\n    <Axis id=\\\"x right\\\" title=\\\"x right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"y bottom\\\" position={Position.Bottom} title=\\\"y bottom axis\\\" />\\n    <Axis id=\\\"x left\\\" title=\\\"x left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":37},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":37}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\n    <Axis id=\"x top\" position={Position.Top} title=\"x top axis\" />\n    <Axis id=\"y right\" title=\"y right axis\" position={Position.Right} />\n    <Axis id=\"x bottom\" position={Position.Bottom} title=\"x bottom axis\" />\n    <Axis id=\"y left\" title=\"y left axis\" position={Position.Left} />\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y']}\n      data={[\n        { x: 0, y: 1 },\n        { x: 1, y: 2 },\n        { x: 2, y: 3 },\n        { x: 3, y: 4 },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} rotation={180} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"x top\\\" position={Position.Top} title=\\\"x top axis\\\" />\\n    <Axis id=\\\"y right\\\" title=\\\"y right axis\\\" position={Position.Right} />\\n    <Axis id=\\\"x bottom\\\" position={Position.Bottom} title=\\\"x bottom axis\\\" />\\n    <Axis id=\\\"y left\\\" title=\\\"y left axis\\\" position={Position.Left} />\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y']}\\n      data={[\\n        { x: 0, y: 1 },\\n        { x: 1, y: 2 },\\n        { x: 2, y: 3 },\\n        { x: 3, y: 4 },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Rotations',\n};\n\nexport { Example as withOrdinalAxis } from './1_ordinal.story';\nexport { Example as negative90DegreeOrdinal } from './2_negative_ordinal.story';\nexport { Example as rotations0DegOrdinal } from './3_rotations_ordinal.story';\nexport { Example as rotations90DegOrdinal } from './4_90_ordinal.story';\nexport { Example as rotations180DegOrdinal } from './5_180_ordinal.story';\nexport { Example as negative90DegLinear } from './6_negative_linear.story';\nexport { Example as rotations0DegLinear } from './7_rotations_linear.story';\nexport { Example as rotations90DegLinear } from './8_90_deg_linear.story';\nexport { Example as rotations180DegLinear } from './9_180_deg_linear.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst today = Date.now();\\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\\nconst UTC_PLUS8_DATE = DateTime.fromISO('2019-01-01T00:00:00.000+08:00', {\\n  setZone: true,\\n}).toMillis();\\nconst UTC_MINUS8_DATE = DateTime.fromISO('2019-01-01T00:00:00.000-08:00', {\\n  setZone: true,\\n}).toMillis();\\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\\nconst CURRENT_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [today + DAY_INCREMENT_1 * i, i % 5]);\\nconst OTHER_PLUS8_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [UTC_PLUS8_DATE + DAY_INCREMENT_1 * i, i % 5]);\\nconst OTHER_MINUS8_TIMEZONE_DATASET = new Array(10)\\n  .fill(0)\\n  .map((d, i) => [UTC_MINUS8_DATE + DAY_INCREMENT_1 * i, i % 5]);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const timezones = {\\n    utc: 'utc',\\n    local: 'local',\\n    utcplus8: 'utc+8',\\n    utcminus8: 'utc-8',\\n  };\\n  const datasetSelected = select('dataset', timezones, 'utc');\\n  const tooltipSelected = select('tooltip', timezones, 'utc');\\n\\n  let data;\\n  switch (datasetSelected) {\\n    case 'local':\\n      data = CURRENT_TIMEZONE_DATASET;\\n      break;\\n    case 'utc+8':\\n      data = OTHER_PLUS8_TIMEZONE_DATASET;\\n      break;\\n    case 'utc-8':\\n      data = OTHER_MINUS8_TIMEZONE_DATASET;\\n      break;\\n    case 'utc':\\n    default:\\n      data = UTC_DATASET;\\n      break;\\n  }\\n  let tooltipFn: (d: number) => string;\\n  switch (tooltipSelected) {\\n    case 'local':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    case 'utc+8':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc+8' }).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    case 'utc-8':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc-8' }).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    default:\\n    case 'utc':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n  }\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} tickFormat={tooltipFn} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        timeZone={tooltipSelected}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":34},\"endLoc\":{\"col\":1,\"line\":92},\"startBody\":{\"col\":36,\"line\":34},\"endBody\":{\"col\":1,\"line\":92}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst today = Date.now();\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\nconst UTC_PLUS8_DATE = DateTime.fromISO('2019-01-01T00:00:00.000+08:00', {\n  setZone: true,\n}).toMillis();\nconst UTC_MINUS8_DATE = DateTime.fromISO('2019-01-01T00:00:00.000-08:00', {\n  setZone: true,\n}).toMillis();\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\nconst CURRENT_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [today + DAY_INCREMENT_1 * i, i % 5]);\nconst OTHER_PLUS8_TIMEZONE_DATASET = new Array(10).fill(0).map((d, i) => [UTC_PLUS8_DATE + DAY_INCREMENT_1 * i, i % 5]);\nconst OTHER_MINUS8_TIMEZONE_DATASET = new Array(10)\n  .fill(0)\n  .map((d, i) => [UTC_MINUS8_DATE + DAY_INCREMENT_1 * i, i % 5]);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const timezones = {\n    utc: 'utc',\n    local: 'local',\n    utcplus8: 'utc+8',\n    utcminus8: 'utc-8',\n  };\n  const datasetSelected = select('dataset', timezones, 'utc');\n  const tooltipSelected = select('tooltip', timezones, 'utc');\n\n  let data;\n  switch (datasetSelected) {\n    case 'local':\n      data = CURRENT_TIMEZONE_DATASET;\n      break;\n    case 'utc+8':\n      data = OTHER_PLUS8_TIMEZONE_DATASET;\n      break;\n    case 'utc-8':\n      data = OTHER_MINUS8_TIMEZONE_DATASET;\n      break;\n    case 'utc':\n    default:\n      data = UTC_DATASET;\n      break;\n  }\n  let tooltipFn: (d: number) => string;\n  switch (tooltipSelected) {\n    case 'local':\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss');\n      break;\n    case 'utc+8':\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc+8' }).toFormat('yyyy-MM-dd HH:mm:ss');\n      break;\n    case 'utc-8':\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc-8' }).toFormat('yyyy-MM-dd HH:mm:ss');\n      break;\n    default:\n    case 'utc':\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss');\n      break;\n  }\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"time\" position={Position.Bottom} tickFormat={tooltipFn} />\n      <Axis id=\"y\" position={Position.Left} />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        timeZone={tooltipSelected}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const timezones = {\\n    utc: 'utc',\\n    local: 'local',\\n    utcplus8: 'utc+8',\\n    utcminus8: 'utc-8',\\n  };\\n  const datasetSelected = select('dataset', timezones, 'utc');\\n  const tooltipSelected = select('tooltip', timezones, 'utc');\\n\\n  let data;\\n  switch (datasetSelected) {\\n    case 'local':\\n      data = CURRENT_TIMEZONE_DATASET;\\n      break;\\n    case 'utc+8':\\n      data = OTHER_PLUS8_TIMEZONE_DATASET;\\n      break;\\n    case 'utc-8':\\n      data = OTHER_MINUS8_TIMEZONE_DATASET;\\n      break;\\n    case 'utc':\\n    default:\\n      data = UTC_DATASET;\\n      break;\\n  }\\n  let tooltipFn: (d: number) => string;\\n  switch (tooltipSelected) {\\n    case 'local':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    case 'utc+8':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc+8' }).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    case 'utc-8':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d, { zone: 'utc-8' }).toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n    default:\\n    case 'utc':\\n      tooltipFn = (d: number) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss');\\n      break;\\n  }\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} tickFormat={tooltipFn} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        timeZone={tooltipSelected}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss')}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      timeZone=\\\"local\\\"\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={UTC_DATASET}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown: `If your data is in UTC timezone, your tooltip and axis labels can be configured\\n      to visualize the time translated to your local timezone. You should be able to see the\\n      first value on \\\\`2019-01-01  01:00:00.000 \\\\``,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"time\"\n      position={Position.Bottom}\n      tickFormat={(d) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss')}\n    />\n    <Axis id=\"y\" position={Position.Left} />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      timeZone=\"local\"\n      xAccessor={0}\n      yAccessors={[1]}\n      data={UTC_DATASET}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown: `If your data is in UTC timezone, your tooltip and axis labels can be configured\n      to visualize the time translated to your local timezone. You should be able to see the\n      first value on \\`2019-01-01  01:00:00.000 \\``,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d).toFormat('yyyy-MM-dd HH:mm:ss')}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      timeZone=\\\"local\\\"\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={UTC_DATASET}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss')}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      timeZone=\\\"utc\\\"\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={UTC_DATASET}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown: `The default timezone is UTC. If you want to visualize data in UTC,\\n      but you are in a different timezone, remember to format the millis from \\\\`tickFormat\\\\`\\n      to UTC. In this Example be able to see the first value on \\\\`2019-01-01  00:00:00.000 \\\\``,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst UTC_DATE = DateTime.fromISO('2019-01-01T00:00:00.000Z').toMillis();\nconst DAY_INCREMENT_1 = 1000 * 60 * 60 * 24;\nconst UTC_DATASET = new Array(10).fill(0).map((d, i) => [UTC_DATE + DAY_INCREMENT_1 * i, i % 5]);\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"time\"\n      position={Position.Bottom}\n      tickFormat={(d) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss')}\n    />\n    <Axis id=\"y\" position={Position.Left} />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      timeZone=\"utc\"\n      xAccessor={0}\n      yAccessors={[1]}\n      data={UTC_DATASET}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown: `The default timezone is UTC. If you want to visualize data in UTC,\n      but you are in a different timezone, remember to format the millis from \\`tickFormat\\`\n      to UTC. In this Example be able to see the first value on \\`2019-01-01  00:00:00.000 \\``,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d).toUTC().toFormat('yyyy-MM-dd HH:mm:ss')}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      timeZone=\\\"utc\\\"\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      data={UTC_DATASET}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d, { zone: 'Etc/GMT+6' }).toISO()}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={1}\\n      yAccessors={[2]}\\n      timeZone=\\\"Etc/GMT+6\\\"\\n      data={[\\n        ['2014-01-01T00:00:00.000-06:00', 1388556000000, 6206],\\n        ['2015-01-01T00:00:00.000-06:00', 1420092000000, 5674],\\n        ['2016-01-01T00:00:00.000-06:00', 1451628000000, 4148],\\n        ['2017-01-01T00:00:00.000-06:00', 1483250400000, 6206],\\n        ['2018-01-01T00:00:00.000-06:00', 1514786400000, 3698],\\n      ]}\\n    />\\n  </Chart>\\n);\\n\\nExample.parameters = {\\n  markdown: `You can visualize data in a different timezone than your local or UTC zones.\\n      Specify the \\\\`timeZone={'Etc/GMT+6'}\\\\` property with the correct timezone and\\n      remember to apply the same timezone also to each formatted tick in \\\\`tickFormat\\\\``,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Axis\n      id=\"time\"\n      position={Position.Bottom}\n      tickFormat={(d) => DateTime.fromMillis(d, { zone: 'Etc/GMT+6' }).toISO()}\n    />\n    <Axis id=\"y\" position={Position.Left} />\n    <LineSeries\n      id=\"lines\"\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={1}\n      yAccessors={[2]}\n      timeZone=\"Etc/GMT+6\"\n      data={[\n        ['2014-01-01T00:00:00.000-06:00', 1388556000000, 6206],\n        ['2015-01-01T00:00:00.000-06:00', 1420092000000, 5674],\n        ['2016-01-01T00:00:00.000-06:00', 1451628000000, 4148],\n        ['2017-01-01T00:00:00.000-06:00', 1483250400000, 6206],\n        ['2018-01-01T00:00:00.000-06:00', 1514786400000, 3698],\n      ]}\n    />\n  </Chart>\n);\n\nExample.parameters = {\n  markdown: `You can visualize data in a different timezone than your local or UTC zones.\n      Specify the \\`timeZone={'Etc/GMT+6'}\\` property with the correct timezone and\n      remember to apply the same timezone also to each formatted tick in \\`tickFormat\\``,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Axis\\n      id=\\\"time\\\"\\n      position={Position.Bottom}\\n      tickFormat={(d) => DateTime.fromMillis(d, { zone: 'Etc/GMT+6' }).toISO()}\\n    />\\n    <Axis id=\\\"y\\\" position={Position.Left} />\\n    <LineSeries\\n      id=\\\"lines\\\"\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={1}\\n      yAccessors={[2]}\\n      timeZone=\\\"Etc/GMT+6\\\"\\n      data={[\\n        ['2014-01-01T00:00:00.000-06:00', 1388556000000, 6206],\\n        ['2015-01-01T00:00:00.000-06:00', 1420092000000, 5674],\\n        ['2016-01-01T00:00:00.000-06:00', 1451628000000, 4148],\\n        ['2017-01-01T00:00:00.000-06:00', 1483250400000, 6206],\\n        ['2018-01-01T00:00:00.000-06:00', 1514786400000, 3698],\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, BarSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const includeString = boolean('include string is x data', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={{ min: 0, max: 10 }} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title={includeString ? 'ordinal fallback scale' : 'linear scale'} position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 390, val: 1222 },\\n          { x: 2, y: 23, val: 1222 },\\n          { x: includeString ? '3' : 3, y: 750, val: 1222 },\\n          { x: 4, y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown:\\n    'Using string values with a `Linear` scale will attempt to fallback to an `Ordinal` scale. Notice how the custom `xDomain` is ignored when the scale falls back to `Ordinal`.',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, BarSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const includeString = boolean('include string is x data', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={{ min: 0, max: 10 }} baseTheme={useBaseTheme()} />\n      <Axis id=\"y\" title=\"count\" position={Position.Left} />\n      <Axis id=\"x\" title={includeString ? 'ordinal fallback scale' : 'linear scale'} position={Position.Bottom} />\n      <BarSeries\n        id=\"bars\"\n        name=\"amount\"\n        xScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 1, y: 390, val: 1222 },\n          { x: 2, y: 23, val: 1222 },\n          { x: includeString ? '3' : 3, y: 750, val: 1222 },\n          { x: 4, y: 854, val: 1222 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown:\n    'Using string values with a `Linear` scale will attempt to fallback to an `Ordinal` scale. Notice how the custom `xDomain` is ignored when the scale falls back to `Ordinal`.',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const includeString = boolean('include string is x data', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={{ min: 0, max: 10 }} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title={includeString ? 'ordinal fallback scale' : 'linear scale'} position={Position.Bottom} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 1, y: 390, val: 1222 },\\n          { x: 2, y: 23, val: 1222 },\\n          { x: includeString ? '3' : 3, y: 750, val: 1222 },\\n          { x: 4, y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number, select } from '@storybook/addon-knobs';\\nimport { range } from 'lodash';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Axis,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  AreaSeries,\\n  YDomainBase,\\n  LogScaleOptions,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { logFormatter } from '../utils/formatters';\\nimport { customKnobs } from '../utils/knobs';\\n\\ntype LogKnobs = LogScaleOptions &\\n  Pick<YDomainBase, 'fit' | 'padding'> & {\\n    dataType: string;\\n    negative: boolean;\\n    scaleType: Extract<ScaleType, 'log' | 'linear'>;\\n  };\\n\\nconst getDataType = (group: string, defaultType = 'increasing') =>\\n  select(\\n    'Data type',\\n    {\\n      Increasing: 'increasing',\\n      Decreasing: 'decreasing',\\n      'Up Down': 'upDown',\\n      'Down Up': 'downUp',\\n    },\\n    defaultType,\\n    group,\\n  );\\n\\nconst getLogKnobs = (isXAxis = false) => {\\n  const group = isXAxis ? 'X - Axis' : 'Y - Axis';\\n  const useDefaultLimit = boolean('Use default limit', isXAxis, group);\\n  const limit = number('Log min limit', 1, { min: 0 }, group);\\n  const logNames = { Common: 'common', Binary: 'binary', Natural: 'natural' };\\n  const logBaseName = customKnobs.fromEnum('Log base', logNames, 'common' as any, {\\n    group,\\n    allowUndefined: true,\\n  }) as 'common' | 'binary' | 'natural';\\n  return {\\n    min: NaN,\\n    max: NaN,\\n    ...(!isXAxis && { fit: boolean('Fit domain', true, group) }),\\n    dataType: getDataType(group, isXAxis ? undefined : 'upDown'),\\n    negative: boolean('Use negative values', false, group),\\n    ...(!isXAxis && { logMinLimit: useDefaultLimit ? undefined : limit }),\\n    logBase: { common: 10, binary: 2, natural: Math.E }[logBaseName] ?? 10,\\n    scaleType: customKnobs.enum.scaleType('Scale Type', ScaleType.Log, { include: ['Linear', 'Log'], group }),\\n    ...(!isXAxis && { padding: number('Padding', 0, { min: 0 }, group) }),\\n  };\\n};\\n\\nconst getDataValue = (type: string, v: number, i: number, length: number) => {\\n  switch (type) {\\n    case 'increasing':\\n      return i - Math.round(length / 2);\\n    case 'decreasing':\\n      return -i + Math.round(length / 2);\\n    case 'upDown':\\n      return v;\\n    case 'downUp':\\n    default:\\n      return -v;\\n  }\\n};\\n\\nconst seriesMap = {\\n  line: LineSeries,\\n  area: AreaSeries,\\n};\\n\\nconst getSeriesType = () =>\\n  select<keyof typeof seriesMap>(\\n    'Series Type',\\n    {\\n      Line: 'line',\\n      Area: 'area',\\n    },\\n    'line',\\n  );\\n\\nconst getInitalData = (rows: number) => {\\n  const quart = Math.round(rows / 4);\\n  return [...range(quart, -quart, -1), ...range(-quart, quart + 1, 1)];\\n};\\n\\nconst getData = (rows: number, yLogKnobs: LogKnobs, xLogKnobs: LogKnobs) =>\\n  getInitalData(rows).map((v, i, { length }) => {\\n    const y0 = getDataValue(yLogKnobs.dataType, v, i, length);\\n    const x0 = getDataValue(xLogKnobs.dataType, v, i, length);\\n    return {\\n      y: Math.pow(yLogKnobs.logBase ?? 10, y0) * (yLogKnobs.negative ? -1 : 1),\\n      x: Math.pow(xLogKnobs.logBase ?? 10, x0) * (xLogKnobs.negative ? -1 : 1),\\n    };\\n  });\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const rows = number('Rows in dataset', 11, { min: 5, step: 2, max: 21 });\\n  const yLogKnobs = getLogKnobs(false);\\n  const xLogKnobs = getLogKnobs(true);\\n  const data = getData(rows, yLogKnobs, xLogKnobs);\\n  const type = getSeriesType();\\n  const curve = customKnobs.enum.curve('Curve type');\\n  const Series = seriesMap[type];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xLogKnobs} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" position={Position.Left} domain={yLogKnobs} tickFormat={logFormatter(yLogKnobs.logBase)} />\\n      <Axis\\n        id=\\\"x\\\"\\n        tickFormat={logFormatter(xLogKnobs.logBase)}\\n        position={Position.Bottom}\\n        style={{ tickLabel: { rotation: -90 } }}\\n      />\\n      <Series\\n        id=\\\"series\\\"\\n        curve={curve}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        yScaleType={yLogKnobs.scaleType}\\n        xScaleType={xLogKnobs.scaleType}\\n        areaSeriesStyle={{ point: { visible: true } }}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `With the \\\\`domain.fit\\\\` option enabled, Log scales will try to best fit the y axis data without setting a baseline to a hardcoded value, currently 1.\\n      If you provide a \\\\`logMinLimit\\\\` on the \\\\`Axis.domain\\\\` prop, the scale will be limited to that value.\\n      This is _not_ the same as min domain value, such that if all values are greater than \\\\`logMinLimit\\\\`,\\n      the domain min will be determined solely by the dataset.\\\\n\\\\nThe \\\\`domain.logBase\\\\` and \\\\`xDomain.logBase\\\\` options\\n      provide a way to set the base of the log to one of following:\\n      [\\\\`10\\\\`](https://en.wikipedia.org/wiki/Common_logarithm) (base 10),\\n      [\\\\`2\\\\`](https://en.wikipedia.org/wiki/Binary_logarithm) (base 2),\\n      [\\\\`Math.E\\\\`](https://en.wikipedia.org/wiki/Natural_logarithm) (base e), the default is \\\\`Common\\\\``,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":116},\"endLoc\":{\"col\":1,\"line\":147},\"startBody\":{\"col\":36,\"line\":116},\"endBody\":{\"col\":1,\"line\":147}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number, select } from '@storybook/addon-knobs';\nimport { range } from 'lodash';\nimport React from 'react';\n\nimport {\n  Chart,\n  Axis,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  AreaSeries,\n  YDomainBase,\n  LogScaleOptions,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { logFormatter } from '../utils/formatters';\nimport { customKnobs } from '../utils/knobs';\n\ntype LogKnobs = LogScaleOptions &\n  Pick<YDomainBase, 'fit' | 'padding'> & {\n    dataType: string;\n    negative: boolean;\n    scaleType: Extract<ScaleType, 'log' | 'linear'>;\n  };\n\nconst getDataType = (group: string, defaultType = 'increasing') =>\n  select(\n    'Data type',\n    {\n      Increasing: 'increasing',\n      Decreasing: 'decreasing',\n      'Up Down': 'upDown',\n      'Down Up': 'downUp',\n    },\n    defaultType,\n    group,\n  );\n\nconst getLogKnobs = (isXAxis = false) => {\n  const group = isXAxis ? 'X - Axis' : 'Y - Axis';\n  const useDefaultLimit = boolean('Use default limit', isXAxis, group);\n  const limit = number('Log min limit', 1, { min: 0 }, group);\n  const logNames = { Common: 'common', Binary: 'binary', Natural: 'natural' };\n  const logBaseName = customKnobs.fromEnum('Log base', logNames, 'common' as any, {\n    group,\n    allowUndefined: true,\n  }) as 'common' | 'binary' | 'natural';\n  return {\n    min: NaN,\n    max: NaN,\n    ...(!isXAxis && { fit: boolean('Fit domain', true, group) }),\n    dataType: getDataType(group, isXAxis ? undefined : 'upDown'),\n    negative: boolean('Use negative values', false, group),\n    ...(!isXAxis && { logMinLimit: useDefaultLimit ? undefined : limit }),\n    logBase: { common: 10, binary: 2, natural: Math.E }[logBaseName] ?? 10,\n    scaleType: customKnobs.enum.scaleType('Scale Type', ScaleType.Log, { include: ['Linear', 'Log'], group }),\n    ...(!isXAxis && { padding: number('Padding', 0, { min: 0 }, group) }),\n  };\n};\n\nconst getDataValue = (type: string, v: number, i: number, length: number) => {\n  switch (type) {\n    case 'increasing':\n      return i - Math.round(length / 2);\n    case 'decreasing':\n      return -i + Math.round(length / 2);\n    case 'upDown':\n      return v;\n    case 'downUp':\n    default:\n      return -v;\n  }\n};\n\nconst seriesMap = {\n  line: LineSeries,\n  area: AreaSeries,\n};\n\nconst getSeriesType = () =>\n  select<keyof typeof seriesMap>(\n    'Series Type',\n    {\n      Line: 'line',\n      Area: 'area',\n    },\n    'line',\n  );\n\nconst getInitalData = (rows: number) => {\n  const quart = Math.round(rows / 4);\n  return [...range(quart, -quart, -1), ...range(-quart, quart + 1, 1)];\n};\n\nconst getData = (rows: number, yLogKnobs: LogKnobs, xLogKnobs: LogKnobs) =>\n  getInitalData(rows).map((v, i, { length }) => {\n    const y0 = getDataValue(yLogKnobs.dataType, v, i, length);\n    const x0 = getDataValue(xLogKnobs.dataType, v, i, length);\n    return {\n      y: Math.pow(yLogKnobs.logBase ?? 10, y0) * (yLogKnobs.negative ? -1 : 1),\n      x: Math.pow(xLogKnobs.logBase ?? 10, x0) * (xLogKnobs.negative ? -1 : 1),\n    };\n  });\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const rows = number('Rows in dataset', 11, { min: 5, step: 2, max: 21 });\n  const yLogKnobs = getLogKnobs(false);\n  const xLogKnobs = getLogKnobs(true);\n  const data = getData(rows, yLogKnobs, xLogKnobs);\n  const type = getSeriesType();\n  const curve = customKnobs.enum.curve('Curve type');\n  const Series = seriesMap[type];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings xDomain={xLogKnobs} baseTheme={useBaseTheme()} />\n      <Axis id=\"y\" position={Position.Left} domain={yLogKnobs} tickFormat={logFormatter(yLogKnobs.logBase)} />\n      <Axis\n        id=\"x\"\n        tickFormat={logFormatter(xLogKnobs.logBase)}\n        position={Position.Bottom}\n        style={{ tickLabel: { rotation: -90 } }}\n      />\n      <Series\n        id=\"series\"\n        curve={curve}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        yScaleType={yLogKnobs.scaleType}\n        xScaleType={xLogKnobs.scaleType}\n        areaSeriesStyle={{ point: { visible: true } }}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `With the \\`domain.fit\\` option enabled, Log scales will try to best fit the y axis data without setting a baseline to a hardcoded value, currently 1.\n      If you provide a \\`logMinLimit\\` on the \\`Axis.domain\\` prop, the scale will be limited to that value.\n      This is _not_ the same as min domain value, such that if all values are greater than \\`logMinLimit\\`,\n      the domain min will be determined solely by the dataset.\\n\\nThe \\`domain.logBase\\` and \\`xDomain.logBase\\` options\n      provide a way to set the base of the log to one of following:\n      [\\`10\\`](https://en.wikipedia.org/wiki/Common_logarithm) (base 10),\n      [\\`2\\`](https://en.wikipedia.org/wiki/Binary_logarithm) (base 2),\n      [\\`Math.E\\`](https://en.wikipedia.org/wiki/Natural_logarithm) (base e), the default is \\`Common\\``,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const rows = number('Rows in dataset', 11, { min: 5, step: 2, max: 21 });\\n  const yLogKnobs = getLogKnobs(false);\\n  const xLogKnobs = getLogKnobs(true);\\n  const data = getData(rows, yLogKnobs, xLogKnobs);\\n  const type = getSeriesType();\\n  const curve = customKnobs.enum.curve('Curve type');\\n  const Series = seriesMap[type];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings xDomain={xLogKnobs} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"y\\\" position={Position.Left} domain={yLogKnobs} tickFormat={logFormatter(yLogKnobs.logBase)} />\\n      <Axis\\n        id=\\\"x\\\"\\n        tickFormat={logFormatter(xLogKnobs.logBase)}\\n        position={Position.Bottom}\\n        style={{ tickLabel: { rotation: -90 } }}\\n      />\\n      <Series\\n        id=\\\"series\\\"\\n        curve={curve}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        yScaleType={yLogKnobs.scaleType}\\n        xScaleType={xLogKnobs.scaleType}\\n        areaSeriesStyle={{ point: { visible: true } }}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nfunction generateRandomBinary(bitCount: number) {\\n  return rng(0, 2 ** bitCount - 1);\\n}\\n\\nconst data = new Array(20).fill(1).map((_, x) => ({\\n  x,\\n  'Base 10': rng(0, 2000),\\n  'Base 2': generateRandomBinary(11),\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const yAccessor = select('Data type', ['Base 10', 'Base 2'], 'Base 2');\\n  const yScaleType = select(\\n    'yScaleType',\\n    {\\n      Linear: ScaleType.Linear,\\n      'Linear Binary': ScaleType.LinearBinary,\\n    },\\n    ScaleType.LinearBinary,\\n  );\\n  const yNice = boolean('Nice y ticks', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"binary\\\" title={yAccessor} position={Position.Left} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        data={data}\\n        yNice={yNice}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={[yAccessor]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: `By default, \\\\`Linear\\\\` scales compute scale ticks per base 10 numerical system.\\n  You may set the \\\\`yScaleType\\\\` to \\\\`LinearBinary\\\\` to compute ticks per base 2 numerical system.\\n  This base is also applied to tick nicing.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator();\n\nfunction generateRandomBinary(bitCount: number) {\n  return rng(0, 2 ** bitCount - 1);\n}\n\nconst data = new Array(20).fill(1).map((_, x) => ({\n  x,\n  'Base 10': rng(0, 2000),\n  'Base 2': generateRandomBinary(11),\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const yAccessor = select('Data type', ['Base 10', 'Base 2'], 'Base 2');\n  const yScaleType = select(\n    'yScaleType',\n    {\n      Linear: ScaleType.Linear,\n      'Linear Binary': ScaleType.LinearBinary,\n    },\n    ScaleType.LinearBinary,\n  );\n  const yNice = boolean('Nice y ticks', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"binary\" title={yAccessor} position={Position.Left} />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={yScaleType}\n        data={data}\n        yNice={yNice}\n        xAccessor=\"x\"\n        yAccessors={[yAccessor]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: `By default, \\`Linear\\` scales compute scale ticks per base 10 numerical system.\n  You may set the \\`yScaleType\\` to \\`LinearBinary\\` to compute ticks per base 2 numerical system.\n  This base is also applied to tick nicing.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const yAccessor = select('Data type', ['Base 10', 'Base 2'], 'Base 2');\\n  const yScaleType = select(\\n    'yScaleType',\\n    {\\n      Linear: ScaleType.Linear,\\n      'Linear Binary': ScaleType.LinearBinary,\\n    },\\n    ScaleType.LinearBinary,\\n  );\\n  const yNice = boolean('Nice y ticks', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"binary\\\" title={yAccessor} position={Position.Left} />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={yScaleType}\\n        data={data}\\n        yNice={yNice}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={[yAccessor]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Scales',\n};\n\nexport { Example as timezoneConfiguration } from './1_different_timezones.story';\nexport { Example as tooltipInLocalTimezone } from './2_local_tooltip.story';\nexport { Example as tooltipInUTC } from './3_utc_tooltip.story';\nexport { Example as specifiedTimezone } from './4_specified_timezone.story';\nexport { Example as xScaleFallback } from './6_x_scale_fallback.story';\nexport { Example as logScaleOptions } from './7_log_scale_options.story';\nexport { Example as linearBinary } from './8_linear_binary.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  AreaSeries,\\n  LIGHT_THEME,\\n  niceTimeFormatByDay,\\n  timeFormatter,\\n  BrushAxis,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 60;\\nconst data = dg.generateGroupedSeries(numOfDays, 6, 'CPU ').map((d) => {\\n  return {\\n    ...d,\\n    x: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\\n    y: d.y * 10,\\n  };\\n});\\nconst dataForLogScale = data.map((d) => ({ ...d, y: d.y - 3 }));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showLegend = boolean('Show Legend', false);\\n  const onElementClick = action('onElementClick');\\n  const tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\\n  const useLogScale = boolean('Use log scale (different data)', false);\\n\\n  return (\\n    <>\\n      <Chart title={title} description={description} size={['100%', 400]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onElementClick={onElementClick}\\n          showLegend={showLegend}\\n          onBrushEnd={(d) => {\\n            if (d.x) {\\n              action('brushEventX')(tickTimeFormatter(d.x[0] ?? 0), tickTimeFormatter(d.x[1] ?? 0), d.y);\\n            }\\n          }}\\n          brushAxis={BrushAxis.X}\\n        />\\n        <Axis\\n          id=\\\"time\\\"\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          tickFormat={tickTimeFormatter}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom }, padding: 0 },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"axis\\\"\\n          position={Position.Right}\\n          gridLine={{ visible: true }}\\n          tickFormat={(d) => d.toFixed(0)}\\n          ticks={2}\\n          style={{\\n            tickLine: { padding: 2, size: 3 },\\n            axisTitle: { visible: false },\\n            axisPanelTitle: { visible: false },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"small multiple categories\\\"\\n          position={Position.Left}\\n          gridLine={{ visible: false }}\\n          tickFormat={(d) => d.toFixed(0)}\\n          ticks={2}\\n          style={{\\n            axisLine: { visible: false },\\n            tickLabel: {\\n              visible: false,\\n            },\\n            tickLine: {\\n              visible: false,\\n            },\\n          }}\\n        />\\n\\n        <GroupBy\\n          id=\\\"v_split\\\"\\n          by={(spec, { g }) => {\\n            return g;\\n          }}\\n          sort=\\\"alphaDesc\\\"\\n        />\\n        <SmallMultiples splitVertically=\\\"v_split\\\" style={{ verticalPanelPadding: { outer: 0, inner: 0.3 } }} />\\n        <AreaSeries\\n          id=\\\"CPU Temp\\\"\\n          name={(d, isTooltip) => (isTooltip ? `${d.smVerticalAccessorValue}` : 'CPU temp in ℃')}\\n          xScaleType={ScaleType.Time}\\n          yScaleType={useLogScale ? ScaleType.Log : ScaleType.Linear}\\n          timeZone=\\\"local\\\"\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          color={LIGHT_THEME.colors.vizColors[1]}\\n          data={useLogScale ? dataForLogScale : data}\\n          yNice\\n          tickFormat={(d) => `${d.toFixed(2)}℃`}\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `The above chart shows an example of small multiples technique that splits our dataset into multiple\\n      sub-series vertically positioned one below the other.\\n      The configuration is obtained by defining a \\\\`<GroupBy />\\\\` operation component that define the property used to\\n      divide/group my dataset(via to the \\\\`by\\\\` props) and using the specified \\\\`id\\\\` of that operation inside the\\n      \\\\`<SmallMultiples splitVertically=\\\"id_of_group_by_op\\\" />\\\\` component.\\n\\nEach charts has the same vertical and horizontal axis scale.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":44},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":44},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  AreaSeries,\n  LIGHT_THEME,\n  niceTimeFormatByDay,\n  timeFormatter,\n  BrushAxis,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 60;\nconst data = dg.generateGroupedSeries(numOfDays, 6, 'CPU ').map((d) => {\n  return {\n    ...d,\n    x: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\n    y: d.y * 10,\n  };\n});\nconst dataForLogScale = data.map((d) => ({ ...d, y: d.y - 3 }));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showLegend = boolean('Show Legend', false);\n  const onElementClick = action('onElementClick');\n  const tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\n  const useLogScale = boolean('Use log scale (different data)', false);\n\n  return (\n    <>\n      <Chart title={title} description={description} size={['100%', 400]}>\n        <Settings\n          baseTheme={useBaseTheme()}\n          onElementClick={onElementClick}\n          showLegend={showLegend}\n          onBrushEnd={(d) => {\n            if (d.x) {\n              action('brushEventX')(tickTimeFormatter(d.x[0] ?? 0), tickTimeFormatter(d.x[1] ?? 0), d.y);\n            }\n          }}\n          brushAxis={BrushAxis.X}\n        />\n        <Axis\n          id=\"time\"\n          position={Position.Bottom}\n          gridLine={{ visible: true }}\n          tickFormat={tickTimeFormatter}\n          timeAxisLayerCount={2}\n          style={{\n            tickLine: { size: 0.0001, padding: 4 },\n            tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom }, padding: 0 },\n          }}\n        />\n        <Axis\n          id=\"axis\"\n          position={Position.Right}\n          gridLine={{ visible: true }}\n          tickFormat={(d) => d.toFixed(0)}\n          ticks={2}\n          style={{\n            tickLine: { padding: 2, size: 3 },\n            axisTitle: { visible: false },\n            axisPanelTitle: { visible: false },\n          }}\n        />\n        <Axis\n          id=\"small multiple categories\"\n          position={Position.Left}\n          gridLine={{ visible: false }}\n          tickFormat={(d) => d.toFixed(0)}\n          ticks={2}\n          style={{\n            axisLine: { visible: false },\n            tickLabel: {\n              visible: false,\n            },\n            tickLine: {\n              visible: false,\n            },\n          }}\n        />\n\n        <GroupBy\n          id=\"v_split\"\n          by={(spec, { g }) => {\n            return g;\n          }}\n          sort=\"alphaDesc\"\n        />\n        <SmallMultiples splitVertically=\"v_split\" style={{ verticalPanelPadding: { outer: 0, inner: 0.3 } }} />\n        <AreaSeries\n          id=\"CPU Temp\"\n          name={(d, isTooltip) => (isTooltip ? `${d.smVerticalAccessorValue}` : 'CPU temp in ℃')}\n          xScaleType={ScaleType.Time}\n          yScaleType={useLogScale ? ScaleType.Log : ScaleType.Linear}\n          timeZone=\"local\"\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          color={LIGHT_THEME.colors.vizColors[1]}\n          data={useLogScale ? dataForLogScale : data}\n          yNice\n          tickFormat={(d) => `${d.toFixed(2)}℃`}\n        />\n      </Chart>\n    </>\n  );\n};\nExample.parameters = {\n  markdown: `The above chart shows an example of small multiples technique that splits our dataset into multiple\n      sub-series vertically positioned one below the other.\n      The configuration is obtained by defining a \\`<GroupBy />\\` operation component that define the property used to\n      divide/group my dataset(via to the \\`by\\` props) and using the specified \\`id\\` of that operation inside the\n      \\`<SmallMultiples splitVertically=\"id_of_group_by_op\" />\\` component.\n\nEach charts has the same vertical and horizontal axis scale.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showLegend = boolean('Show Legend', false);\\n  const onElementClick = action('onElementClick');\\n  const tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\\n  const useLogScale = boolean('Use log scale (different data)', false);\\n\\n  return (\\n    <>\\n      <Chart title={title} description={description} size={['100%', 400]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          onElementClick={onElementClick}\\n          showLegend={showLegend}\\n          onBrushEnd={(d) => {\\n            if (d.x) {\\n              action('brushEventX')(tickTimeFormatter(d.x[0] ?? 0), tickTimeFormatter(d.x[1] ?? 0), d.y);\\n            }\\n          }}\\n          brushAxis={BrushAxis.X}\\n        />\\n        <Axis\\n          id=\\\"time\\\"\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          tickFormat={tickTimeFormatter}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLine: { size: 0.0001, padding: 4 },\\n            tickLabel: { alignment: { horizontal: Position.Left, vertical: Position.Bottom }, padding: 0 },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"axis\\\"\\n          position={Position.Right}\\n          gridLine={{ visible: true }}\\n          tickFormat={(d) => d.toFixed(0)}\\n          ticks={2}\\n          style={{\\n            tickLine: { padding: 2, size: 3 },\\n            axisTitle: { visible: false },\\n            axisPanelTitle: { visible: false },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"small multiple categories\\\"\\n          position={Position.Left}\\n          gridLine={{ visible: false }}\\n          tickFormat={(d) => d.toFixed(0)}\\n          ticks={2}\\n          style={{\\n            axisLine: { visible: false },\\n            tickLabel: {\\n              visible: false,\\n            },\\n            tickLine: {\\n              visible: false,\\n            },\\n          }}\\n        />\\n\\n        <GroupBy\\n          id=\\\"v_split\\\"\\n          by={(spec, { g }) => {\\n            return g;\\n          }}\\n          sort=\\\"alphaDesc\\\"\\n        />\\n        <SmallMultiples splitVertically=\\\"v_split\\\" style={{ verticalPanelPadding: { outer: 0, inner: 0.3 } }} />\\n        <AreaSeries\\n          id=\\\"CPU Temp\\\"\\n          name={(d, isTooltip) => (isTooltip ? `${d.smVerticalAccessorValue}` : 'CPU temp in ℃')}\\n          xScaleType={ScaleType.Time}\\n          yScaleType={useLogScale ? ScaleType.Log : ScaleType.Linear}\\n          timeZone=\\\"local\\\"\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          color={LIGHT_THEME.colors.vizColors[1]}\\n          data={useLogScale ? dataForLogScale : data}\\n          yNice\\n          tickFormat={(d) => `${d.toFixed(2)}℃`}\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number, text } from '@storybook/addon-knobs';\\nimport { startCase } from 'lodash';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  LineSeries,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  niceTimeFormatByDay,\\n  timeFormatter,\\n  AxisSpec,\\n  XYBrushEvent,\\n} from '@elastic/charts';\\nimport { isVerticalAxis } from '@elastic/charts/src/chart_types/xy_chart/utils/axis_type_utils';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 90;\\nconst groupNames = new Array(16).fill(0).map((d, i) => String.fromCharCode(97 + i));\\nconst data = dg.generateGroupedSeries(numOfDays, 16).map((d) => {\\n  return {\\n    y: d.y,\\n    x: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\\n    g: d.g,\\n    h: groupNames.indexOf(d.g) % 4,\\n    v: Math.floor(groupNames.indexOf(d.g) / 4),\\n  };\\n});\\n\\nconst getAxisStyle = (position: Position): AxisSpec['style'] => ({\\n  tickLabel: {\\n    padding: 5,\\n  },\\n  axisPanelTitle: {\\n    visible: !boolean('Hide panel titles', false, position),\\n  },\\n  axisTitle: {\\n    padding: 2,\\n    visible: !boolean('Hide title', false, position),\\n  },\\n  tickLine: {\\n    visible: false,\\n  },\\n});\\nconst tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\\n\\nconst getAxisOptions = (\\n  position: Position,\\n): Pick<AxisSpec, 'id' | 'title' | 'gridLine' | 'ticks' | 'domain' | 'tickFormat' | 'style' | 'hide' | 'position'> => {\\n  const isPrimary = position === Position.Left || position === Position.Bottom;\\n  const isVertical = isVerticalAxis(position);\\n  return {\\n    id: position,\\n    position,\\n    ticks: isVertical ? 2 : undefined,\\n    tickFormat: isVertical ? (d) => d.toFixed(2) : tickTimeFormatter,\\n    domain: isVertical\\n      ? {\\n          min: NaN,\\n          max: 10,\\n        }\\n      : undefined,\\n    hide: boolean('Hide', !isPrimary, position),\\n    gridLine: {\\n      visible: boolean('Show grid line', isPrimary, position),\\n    },\\n    style: getAxisStyle(position),\\n    title: text(\\n      'Title',\\n      isVertical ? `Metrics - ${startCase(position)}` : `Hosts - ${startCase(position)}`,\\n      position,\\n    ).trim(),\\n  };\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('Debug', false);\\n  const showLegend = boolean('Show Legend', false);\\n  const onElementClick = action('onElementClick');\\n  const metricPrefix = text('metric prefix', `Metric `).trim();\\n  const hostPrefix = text('host prefix', `Host `).trim();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onElementClick={onElementClick}\\n        showLegend={showLegend}\\n        theme={{\\n          lineSeriesStyle: {\\n            point: {\\n              visible: false,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        onBrushEnd={(e) => {\\n          const { x } = e as XYBrushEvent;\\n          if (x) {\\n            action('brushEvent')(tickTimeFormatter(x[0] ?? 0), tickTimeFormatter(x[1] ?? 0));\\n          }\\n        }}\\n      />\\n      <Axis {...getAxisOptions(Position.Left)} />\\n      <Axis {...getAxisOptions(Position.Bottom)} />\\n      <Axis {...getAxisOptions(Position.Top)} />\\n      <Axis {...getAxisOptions(Position.Right)} />\\n\\n      <GroupBy id=\\\"v_split\\\" by={(_, { v }) => v} format={(v) => `${metricPrefix} ${v}`} sort=\\\"numDesc\\\" />\\n      <GroupBy id=\\\"h_split\\\" by={(_, { h }) => h} format={(v) => `${hostPrefix} ${v}`} sort=\\\"numAsc\\\" />\\n      <SmallMultiples\\n        splitVertically=\\\"v_split\\\"\\n        splitHorizontally=\\\"h_split\\\"\\n        style={{\\n          horizontalPanelPadding: {\\n            outer: number('Horizontal outer pad', 0, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Horizontal inner pad', 0.1, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n          verticalPanelPadding: {\\n            outer: number('Vertical outer pad', 0, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Vertical inner pad', 0.3, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n        }}\\n      />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        name={({ splitAccessors }) => `Host ${splitAccessors.get('h')}`}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"UTC\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['h']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `It is possible to add either a vertical and horizontal \\\\`<GroupBy/>\\\\` operations to create a grid of\\nsmall multiples.\\nThe assignment of the series colors can be handled by defining an accessor in the \\\\`color\\\\` prop of the series that\\nconsider the \\\\`smHorizontalAccessorValue\\\\` or \\\\`smVerticalAccessorValue\\\\` values when returning the assigned color.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":94},\"endLoc\":{\"col\":1,\"line\":177},\"startBody\":{\"col\":36,\"line\":94},\"endBody\":{\"col\":1,\"line\":177}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number, text } from '@storybook/addon-knobs';\nimport { startCase } from 'lodash';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  LineSeries,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  niceTimeFormatByDay,\n  timeFormatter,\n  AxisSpec,\n  XYBrushEvent,\n} from '@elastic/charts';\nimport { isVerticalAxis } from '@elastic/charts/src/chart_types/xy_chart/utils/axis_type_utils';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 90;\nconst groupNames = new Array(16).fill(0).map((d, i) => String.fromCharCode(97 + i));\nconst data = dg.generateGroupedSeries(numOfDays, 16).map((d) => {\n  return {\n    y: d.y,\n    x: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\n    g: d.g,\n    h: groupNames.indexOf(d.g) % 4,\n    v: Math.floor(groupNames.indexOf(d.g) / 4),\n  };\n});\n\nconst getAxisStyle = (position: Position): AxisSpec['style'] => ({\n  tickLabel: {\n    padding: 5,\n  },\n  axisPanelTitle: {\n    visible: !boolean('Hide panel titles', false, position),\n  },\n  axisTitle: {\n    padding: 2,\n    visible: !boolean('Hide title', false, position),\n  },\n  tickLine: {\n    visible: false,\n  },\n});\nconst tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\n\nconst getAxisOptions = (\n  position: Position,\n): Pick<AxisSpec, 'id' | 'title' | 'gridLine' | 'ticks' | 'domain' | 'tickFormat' | 'style' | 'hide' | 'position'> => {\n  const isPrimary = position === Position.Left || position === Position.Bottom;\n  const isVertical = isVerticalAxis(position);\n  return {\n    id: position,\n    position,\n    ticks: isVertical ? 2 : undefined,\n    tickFormat: isVertical ? (d) => d.toFixed(2) : tickTimeFormatter,\n    domain: isVertical\n      ? {\n          min: NaN,\n          max: 10,\n        }\n      : undefined,\n    hide: boolean('Hide', !isPrimary, position),\n    gridLine: {\n      visible: boolean('Show grid line', isPrimary, position),\n    },\n    style: getAxisStyle(position),\n    title: text(\n      'Title',\n      isVertical ? `Metrics - ${startCase(position)}` : `Hosts - ${startCase(position)}`,\n      position,\n    ).trim(),\n  };\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('Debug', false);\n  const showLegend = boolean('Show Legend', false);\n  const onElementClick = action('onElementClick');\n  const metricPrefix = text('metric prefix', `Metric `).trim();\n  const hostPrefix = text('host prefix', `Host `).trim();\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        onElementClick={onElementClick}\n        showLegend={showLegend}\n        theme={{\n          lineSeriesStyle: {\n            point: {\n              visible: false,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n        onBrushEnd={(e) => {\n          const { x } = e as XYBrushEvent;\n          if (x) {\n            action('brushEvent')(tickTimeFormatter(x[0] ?? 0), tickTimeFormatter(x[1] ?? 0));\n          }\n        }}\n      />\n      <Axis {...getAxisOptions(Position.Left)} />\n      <Axis {...getAxisOptions(Position.Bottom)} />\n      <Axis {...getAxisOptions(Position.Top)} />\n      <Axis {...getAxisOptions(Position.Right)} />\n\n      <GroupBy id=\"v_split\" by={(_, { v }) => v} format={(v) => `${metricPrefix} ${v}`} sort=\"numDesc\" />\n      <GroupBy id=\"h_split\" by={(_, { h }) => h} format={(v) => `${hostPrefix} ${v}`} sort=\"numAsc\" />\n      <SmallMultiples\n        splitVertically=\"v_split\"\n        splitHorizontally=\"h_split\"\n        style={{\n          horizontalPanelPadding: {\n            outer: number('Horizontal outer pad', 0, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n            inner: number('Horizontal inner pad', 0.1, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n          },\n          verticalPanelPadding: {\n            outer: number('Vertical outer pad', 0, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n            inner: number('Vertical inner pad', 0.3, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n          },\n        }}\n      />\n\n      <LineSeries\n        id=\"line\"\n        name={({ splitAccessors }) => `Host ${splitAccessors.get('h')}`}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"UTC\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['h']}\n        data={data}\n      />\n    </Chart>\n  );\n};\nExample.parameters = {\n  markdown: `It is possible to add either a vertical and horizontal \\`<GroupBy/>\\` operations to create a grid of\nsmall multiples.\nThe assignment of the series colors can be handled by defining an accessor in the \\`color\\` prop of the series that\nconsider the \\`smHorizontalAccessorValue\\` or \\`smVerticalAccessorValue\\` values when returning the assigned color.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('Debug', false);\\n  const showLegend = boolean('Show Legend', false);\\n  const onElementClick = action('onElementClick');\\n  const metricPrefix = text('metric prefix', `Metric `).trim();\\n  const hostPrefix = text('host prefix', `Host `).trim();\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        onElementClick={onElementClick}\\n        showLegend={showLegend}\\n        theme={{\\n          lineSeriesStyle: {\\n            point: {\\n              visible: false,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        onBrushEnd={(e) => {\\n          const { x } = e as XYBrushEvent;\\n          if (x) {\\n            action('brushEvent')(tickTimeFormatter(x[0] ?? 0), tickTimeFormatter(x[1] ?? 0));\\n          }\\n        }}\\n      />\\n      <Axis {...getAxisOptions(Position.Left)} />\\n      <Axis {...getAxisOptions(Position.Bottom)} />\\n      <Axis {...getAxisOptions(Position.Top)} />\\n      <Axis {...getAxisOptions(Position.Right)} />\\n\\n      <GroupBy id=\\\"v_split\\\" by={(_, { v }) => v} format={(v) => `${metricPrefix} ${v}`} sort=\\\"numDesc\\\" />\\n      <GroupBy id=\\\"h_split\\\" by={(_, { h }) => h} format={(v) => `${hostPrefix} ${v}`} sort=\\\"numAsc\\\" />\\n      <SmallMultiples\\n        splitVertically=\\\"v_split\\\"\\n        splitHorizontally=\\\"h_split\\\"\\n        style={{\\n          horizontalPanelPadding: {\\n            outer: number('Horizontal outer pad', 0, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Horizontal inner pad', 0.1, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n          verticalPanelPadding: {\\n            outer: number('Vertical outer pad', 0, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Vertical inner pad', 0.3, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n        }}\\n      />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        name={({ splitAccessors }) => `Host ${splitAccessors.get('h')}`}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"UTC\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['h']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  BarSeries,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 7;\\nfunction generateData() {\\n  return dg.generateGroupedSeries(numOfDays, 2).map((d) => {\\n    return {\\n      ...d,\\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\\n      y: Math.floor(d.y * 10),\\n      g: d.g === 'a' ? 'new user' : 'existing user',\\n    };\\n  });\\n}\\nconst data1 = generateData();\\nconst data2 = generateData();\\nconst data3 = generateData();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n  const disableSmallMultiples = boolean('Disable small multiples', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} rotation={90} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Day of week\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec) => {\\n          return spec.id;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      {!disableSmallMultiples && <SmallMultiples splitHorizontally=\\\"h_split\\\" />}\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        name={({ splitAccessors }) => `WebA - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"website b\\\"\\n        name={({ splitAccessors }) => `WebB - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data2}\\n      />\\n      <BarSeries\\n        id=\\\"website c\\\"\\n        name={({ splitAccessors }) => `WebC - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `Similarly to the Vertical Areas example, the above chart shows an example of small multiples technique\\nthat splits our dataset into multiple sub-series horizontally positioned one aside the other.\\nIn this case, the \\\\`<GroupBy />\\\\` id is used to specify the horizontal split via the \\\\`splitHorizontally\\\\` prop.\\n\\nAs for single charts, we can merge and handle multiple data-series together and specify a \\\\`by\\\\` accessor to consider\\nthe specific case. An additional property \\\\`sort\\\\` is available to configure the sorting order of the vertical or\\nhorizontal split.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":47},\"endLoc\":{\"col\":1,\"line\":138},\"startBody\":{\"col\":36,\"line\":47},\"endBody\":{\"col\":1,\"line\":138}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  BarSeries,\n  LineAnnotation,\n  AnnotationDomainType,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 7;\nfunction generateData() {\n  return dg.generateGroupedSeries(numOfDays, 2).map((d) => {\n    return {\n      ...d,\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\n      y: Math.floor(d.y * 10),\n      g: d.g === 'a' ? 'new user' : 'existing user',\n    };\n  });\n}\nconst data1 = generateData();\nconst data2 = generateData();\nconst data3 = generateData();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const marker = (\n    <span\n      style={{\n        backgroundColor: 'lightgray',\n        padding: 2,\n        width: 30,\n        height: 10,\n        margin: 'auto',\n        fontSize: 8,\n        borderRadius: 2,\n      }}\n    >\n      MIN\n    </span>\n  );\n  const showLegend = boolean('Show Legend', true);\n  const onElementClick = action('onElementClick');\n  const disableSmallMultiples = boolean('Disable small multiples', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings onElementClick={onElementClick} rotation={90} showLegend={showLegend} baseTheme={useBaseTheme()} />\n      <Axis id=\"time\" position={Position.Bottom} gridLine={{ visible: false }} />\n      <Axis id=\"y\" title=\"Day of week\" position={Position.Left} gridLine={{ visible: false }} />\n\n      <GroupBy\n        id=\"h_split\"\n        by={(spec) => {\n          return spec.id;\n        }}\n        sort=\"alphaAsc\"\n      />\n      {!disableSmallMultiples && <SmallMultiples splitHorizontally=\"h_split\" />}\n      <LineAnnotation\n        dataValues={[\n          {\n            dataValue: 100,\n            details: 'Minimum # of connected users',\n          },\n        ]}\n        id=\"threshold\"\n        domainType={AnnotationDomainType.YDomain}\n        marker={marker}\n        style={{\n          line: {\n            dash: [5, 10],\n            stroke: 'black',\n            opacity: 0.8,\n            strokeWidth: 1,\n          },\n        }}\n      />\n      <BarSeries\n        id=\"website a\"\n        name={({ splitAccessors }) => `WebA - ${splitAccessors.get('g')}`}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data1}\n      />\n      <BarSeries\n        id=\"website b\"\n        name={({ splitAccessors }) => `WebB - ${splitAccessors.get('g')}`}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data2}\n      />\n      <BarSeries\n        id=\"website c\"\n        name={({ splitAccessors }) => `WebC - ${splitAccessors.get('g')}`}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data3}\n      />\n    </Chart>\n  );\n};\nExample.parameters = {\n  markdown: `Similarly to the Vertical Areas example, the above chart shows an example of small multiples technique\nthat splits our dataset into multiple sub-series horizontally positioned one aside the other.\nIn this case, the \\`<GroupBy />\\` id is used to specify the horizontal split via the \\`splitHorizontally\\` prop.\n\nAs for single charts, we can merge and handle multiple data-series together and specify a \\`by\\` accessor to consider\nthe specific case. An additional property \\`sort\\` is available to configure the sorting order of the vertical or\nhorizontal split.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n  const disableSmallMultiples = boolean('Disable small multiples', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} rotation={90} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Day of week\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec) => {\\n          return spec.id;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      {!disableSmallMultiples && <SmallMultiples splitHorizontally=\\\"h_split\\\" />}\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        name={({ splitAccessors }) => `WebA - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data1}\\n      />\\n      <BarSeries\\n        id=\\\"website b\\\"\\n        name={({ splitAccessors }) => `WebB - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data2}\\n      />\\n      <BarSeries\\n        id=\\\"website c\\\"\\n        name={({ splitAccessors }) => `WebC - ${splitAccessors.get('g')}`}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  BarSeries,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n  LIGHT_THEME,\\n  LineSeries,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 7;\\nfunction generateData(totalGroups: number, mappings: Record<string, string>) {\\n  return dg.generateGroupedSeries(numOfDays, totalGroups).map((d) => {\\n    return {\\n      ...d,\\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\\n      y: Math.floor(d.y * 10),\\n      g: mappings[d.g],\\n    };\\n  });\\n}\\nconst data1 = generateData(2, { a: 'new user', b: 'existing user' }).map((d) => ({ ...d, site: 'website A' }));\\nconst data2 = generateData(2, { a: 'new user', b: 'existing user' }).map((d) => ({ ...d, site: 'website B' }));\\n\\nconst datal1 = generateData(2, { a: 'avg new user', b: 'avg existing user' }).map((d) => ({\\n  ...d,\\n  site: 'website A',\\n}));\\nconst datal2 = generateData(2, { a: 'avg new user', b: 'avg existing user' }).map((d) => ({\\n  ...d,\\n  site: 'website B',\\n}));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" title=\\\"Day of week\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Count of logins\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec, datum) => {\\n          return datum.site;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      <SmallMultiples splitVertically=\\\"h_split\\\" />\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={[...data1, ...data2]}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <LineSeries\\n        id=\\\"avg\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={[...datal1, ...datal2]}\\n        lineSeriesStyle={{\\n          point: {\\n            radius: 1,\\n            fill: ColorVariant.Series,\\n          },\\n        }}\\n        color={['black', 'darkgray']}\\n      />\\n    </Chart>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `Similarly to the Vertical Areas example, the above chart shows an example of small multiples technique\\nthat splits our dataset into multiple sub-series horizontally positioned one aside the other.\\nIn this case, the \\\\`<GroupBy />\\\\` id is used to specify the horizontal split via the \\\\`splitHorizontally\\\\` prop.\\n\\nAs for single charts, we can merge and handle multiple data-series together and specify a \\\\`by\\\\` accessor to consider\\nthe specific case. An additional property \\\\`sort\\\\` is available to configure the sorting order of the vertical or\\nhorizontal split.\\n`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":58},\"endLoc\":{\"col\":1,\"line\":141},\"startBody\":{\"col\":36,\"line\":58},\"endBody\":{\"col\":1,\"line\":141}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  BarSeries,\n  LineAnnotation,\n  AnnotationDomainType,\n  LIGHT_THEME,\n  LineSeries,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 7;\nfunction generateData(totalGroups: number, mappings: Record<string, string>) {\n  return dg.generateGroupedSeries(numOfDays, totalGroups).map((d) => {\n    return {\n      ...d,\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\n      y: Math.floor(d.y * 10),\n      g: mappings[d.g],\n    };\n  });\n}\nconst data1 = generateData(2, { a: 'new user', b: 'existing user' }).map((d) => ({ ...d, site: 'website A' }));\nconst data2 = generateData(2, { a: 'new user', b: 'existing user' }).map((d) => ({ ...d, site: 'website B' }));\n\nconst datal1 = generateData(2, { a: 'avg new user', b: 'avg existing user' }).map((d) => ({\n  ...d,\n  site: 'website A',\n}));\nconst datal2 = generateData(2, { a: 'avg new user', b: 'avg existing user' }).map((d) => ({\n  ...d,\n  site: 'website B',\n}));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const marker = (\n    <span\n      style={{\n        backgroundColor: 'lightgray',\n        padding: 2,\n        width: 30,\n        height: 10,\n        margin: 'auto',\n        fontSize: 8,\n        borderRadius: 2,\n      }}\n    >\n      MIN\n    </span>\n  );\n  const showLegend = boolean('Show Legend', true);\n  const onElementClick = action('onElementClick');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\n      <Axis id=\"time\" title=\"Day of week\" position={Position.Bottom} gridLine={{ visible: false }} />\n      <Axis id=\"y\" title=\"Count of logins\" position={Position.Left} gridLine={{ visible: false }} />\n\n      <GroupBy\n        id=\"h_split\"\n        by={(spec, datum) => {\n          return datum.site;\n        }}\n        sort=\"alphaAsc\"\n      />\n      <SmallMultiples splitVertically=\"h_split\" />\n      <LineAnnotation\n        dataValues={[\n          {\n            dataValue: 100,\n            details: 'Minimum # of connected users',\n          },\n        ]}\n        id=\"threshold\"\n        domainType={AnnotationDomainType.YDomain}\n        marker={marker}\n        style={{\n          line: {\n            dash: [5, 10],\n            stroke: 'black',\n            opacity: 0.8,\n            strokeWidth: 1,\n          },\n        }}\n      />\n      <BarSeries\n        id=\"website a\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={[...data1, ...data2]}\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\n      />\n      <LineSeries\n        id=\"avg\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={[...datal1, ...datal2]}\n        lineSeriesStyle={{\n          point: {\n            radius: 1,\n            fill: ColorVariant.Series,\n          },\n        }}\n        color={['black', 'darkgray']}\n      />\n    </Chart>\n  );\n};\nExample.parameters = {\n  markdown: `Similarly to the Vertical Areas example, the above chart shows an example of small multiples technique\nthat splits our dataset into multiple sub-series horizontally positioned one aside the other.\nIn this case, the \\`<GroupBy />\\` id is used to specify the horizontal split via the \\`splitHorizontally\\` prop.\n\nAs for single charts, we can merge and handle multiple data-series together and specify a \\`by\\` accessor to consider\nthe specific case. An additional property \\`sort\\` is available to configure the sorting order of the vertical or\nhorizontal split.\n`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" title=\\\"Day of week\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Count of logins\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec, datum) => {\\n          return datum.site;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      <SmallMultiples splitVertically=\\\"h_split\\\" />\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={[...data1, ...data2]}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <LineSeries\\n        id=\\\"avg\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={[...datal1, ...datal2]}\\n        lineSeriesStyle={{\\n          point: {\\n            radius: 1,\\n            fill: ColorVariant.Series,\\n          },\\n        }}\\n        color={['black', 'darkgray']}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { ScaleType, Position, Chart, Axis, GroupBy, SmallMultiples, Settings, BarSeries } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst data = [\\n  { x: 30, split: 'Cloudy', y: 9 },\\n  { x: 45, split: 'Sunny', y: 8 },\\n  { x: 60, split: 'Rain', y: 5 },\\n  { x: 75, split: 'Sunny', y: 7 },\\n  { x: 90, split: 'Rain', y: 6 },\\n  { x: 105, split: 'Rain', y: 7 },\\n  { x: 120, split: 'Clear', y: 7 },\\n  { x: 135, split: 'Cloudy', y: 8 },\\n  { x: 150, split: 'Cloudy', y: 8 },\\n  { x: 165, split: 'Rain', y: 8 },\\n  { x: 180, split: 'Rain', y: 10 },\\n  { x: 195, split: 'Rain', y: 10 },\\n  { x: 210, split: 'Sunny', y: 9 },\\n  { x: 225, split: 'Rain', y: 10 },\\n  { x: 240, split: 'Clear', y: 12 },\\n  { x: 255, split: 'Cloudy', y: 9 },\\n  { x: 270, split: 'Clear', y: 12 },\\n  { x: 285, split: 'Cloudy', y: 5 },\\n  { x: 300, split: 'Rain', y: 7 },\\n  { x: 315, split: 'Sunny', y: 8 },\\n  { x: 330, split: 'Cloudy', y: 8 },\\n  { x: 345, split: 'Sunny', y: 8 },\\n  { x: 360, split: 'Sunny', y: 10 },\\n];\\nconst numberOptions = {\\n  min: 0,\\n  max: 1,\\n  step: 0.05,\\n};\\nconst colorMap: Record<string, string> = {\\n  Rain: 'blue',\\n  Sunny: 'orange',\\n  Cloudy: 'gray',\\n  Clear: 'lightblue',\\n  Default: 'red',\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const enableHistogramMode = boolean('EnableHistogramMode', true);\\n  const barsPadding = number('barsPadding', 0, numberOptions);\\n  const histogramPadding = number('histogramPadding', 0, numberOptions);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={{ scales: { barsPadding, histogramPadding } }} showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"y\\\"\\n        title=\\\"Humidity %\\\"\\n        position={Position.Left}\\n        labelFormat={(label) => {\\n          return `${label} %`;\\n        }}\\n      />\\n\\n      <GroupBy id=\\\"splitId\\\" by={(_, datum) => datum.split} sort=\\\"dataIndex\\\" />\\n      <SmallMultiples splitHorizontally=\\\"splitId\\\" />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        enableHistogramMode={enableHistogramMode}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={data}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['split']}\\n        color={(seriesIdentifier) => {\\n          return colorMap[seriesIdentifier.splitAccessors.get('split') ?? 'Default'];\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":55},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":55},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { ScaleType, Position, Chart, Axis, GroupBy, SmallMultiples, Settings, BarSeries } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst data = [\n  { x: 30, split: 'Cloudy', y: 9 },\n  { x: 45, split: 'Sunny', y: 8 },\n  { x: 60, split: 'Rain', y: 5 },\n  { x: 75, split: 'Sunny', y: 7 },\n  { x: 90, split: 'Rain', y: 6 },\n  { x: 105, split: 'Rain', y: 7 },\n  { x: 120, split: 'Clear', y: 7 },\n  { x: 135, split: 'Cloudy', y: 8 },\n  { x: 150, split: 'Cloudy', y: 8 },\n  { x: 165, split: 'Rain', y: 8 },\n  { x: 180, split: 'Rain', y: 10 },\n  { x: 195, split: 'Rain', y: 10 },\n  { x: 210, split: 'Sunny', y: 9 },\n  { x: 225, split: 'Rain', y: 10 },\n  { x: 240, split: 'Clear', y: 12 },\n  { x: 255, split: 'Cloudy', y: 9 },\n  { x: 270, split: 'Clear', y: 12 },\n  { x: 285, split: 'Cloudy', y: 5 },\n  { x: 300, split: 'Rain', y: 7 },\n  { x: 315, split: 'Sunny', y: 8 },\n  { x: 330, split: 'Cloudy', y: 8 },\n  { x: 345, split: 'Sunny', y: 8 },\n  { x: 360, split: 'Sunny', y: 10 },\n];\nconst numberOptions = {\n  min: 0,\n  max: 1,\n  step: 0.05,\n};\nconst colorMap: Record<string, string> = {\n  Rain: 'blue',\n  Sunny: 'orange',\n  Cloudy: 'gray',\n  Clear: 'lightblue',\n  Default: 'red',\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const enableHistogramMode = boolean('EnableHistogramMode', true);\n  const barsPadding = number('barsPadding', 0, numberOptions);\n  const histogramPadding = number('histogramPadding', 0, numberOptions);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={{ scales: { barsPadding, histogramPadding } }} showLegend baseTheme={useBaseTheme()} />\n      <Axis id=\"x\" position={Position.Bottom} />\n      <Axis\n        id=\"y\"\n        title=\"Humidity %\"\n        position={Position.Left}\n        labelFormat={(label) => {\n          return `${label} %`;\n        }}\n      />\n\n      <GroupBy id=\"splitId\" by={(_, datum) => datum.split} sort=\"dataIndex\" />\n      <SmallMultiples splitHorizontally=\"splitId\" />\n\n      <BarSeries\n        id=\"bars\"\n        enableHistogramMode={enableHistogramMode}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={data}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['split']}\n        color={(seriesIdentifier) => {\n          return colorMap[seriesIdentifier.splitAccessors.get('split') ?? 'Default'];\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const enableHistogramMode = boolean('EnableHistogramMode', true);\\n  const barsPadding = number('barsPadding', 0, numberOptions);\\n  const histogramPadding = number('histogramPadding', 0, numberOptions);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={{ scales: { barsPadding, histogramPadding } }} showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"y\\\"\\n        title=\\\"Humidity %\\\"\\n        position={Position.Left}\\n        labelFormat={(label) => {\\n          return `${label} %`;\\n        }}\\n      />\\n\\n      <GroupBy id=\\\"splitId\\\" by={(_, datum) => datum.split} sort=\\\"dataIndex\\\" />\\n      <SmallMultiples splitHorizontally=\\\"splitId\\\" />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        enableHistogramMode={enableHistogramMode}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={data}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['split']}\\n        color={(seriesIdentifier) => {\\n          return colorMap[seriesIdentifier.splitAccessors.get('split') ?? 'Default'];\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean } from '@storybook/addon-knobs';\\nimport { DateTime } from 'luxon';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  BarSeries,\\n  LineAnnotation,\\n  AnnotationDomainType,\\n  LIGHT_THEME,\\n  LineSeries,\\n  AreaSeries,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst numOfDays = 7;\\nfunction generateData() {\\n  return dg.generateGroupedSeries(numOfDays, 2).map((d) => {\\n    return {\\n      ...d,\\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\\n      y: Math.floor(d.y * 10),\\n      g: d.g === 'a' ? 'new user' : 'existing user',\\n    };\\n  });\\n}\\nconst data1 = generateData();\\nconst data2 = generateData();\\nconst data3 = generateData();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n        lineHeight: 8,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Day of week\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec) => {\\n          return spec.id;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      <SmallMultiples splitHorizontally=\\\"h_split\\\" />\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data1}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <LineSeries\\n        id=\\\"website b\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data2}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <AreaSeries\\n        id=\\\"website c\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data3}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":50},\"endLoc\":{\"col\":1,\"line\":141},\"startBody\":{\"col\":36,\"line\":50},\"endBody\":{\"col\":1,\"line\":141}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean } from '@storybook/addon-knobs';\nimport { DateTime } from 'luxon';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  BarSeries,\n  LineAnnotation,\n  AnnotationDomainType,\n  LIGHT_THEME,\n  LineSeries,\n  AreaSeries,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst numOfDays = 7;\nfunction generateData() {\n  return dg.generateGroupedSeries(numOfDays, 2).map((d) => {\n    return {\n      ...d,\n      x: DateTime.fromFormat(`${d.x + 1}`, 'E').toFormat('EEEE'),\n      y: Math.floor(d.y * 10),\n      g: d.g === 'a' ? 'new user' : 'existing user',\n    };\n  });\n}\nconst data1 = generateData();\nconst data2 = generateData();\nconst data3 = generateData();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const marker = (\n    <span\n      style={{\n        backgroundColor: 'lightgray',\n        padding: 2,\n        width: 30,\n        height: 10,\n        margin: 'auto',\n        fontSize: 8,\n        borderRadius: 2,\n        lineHeight: 8,\n      }}\n    >\n      MIN\n    </span>\n  );\n  const showLegend = boolean('Show Legend', true);\n  const onElementClick = action('onElementClick');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\n      <Axis id=\"time\" position={Position.Bottom} gridLine={{ visible: false }} />\n      <Axis id=\"y\" title=\"Day of week\" position={Position.Left} gridLine={{ visible: false }} />\n\n      <GroupBy\n        id=\"h_split\"\n        by={(spec) => {\n          return spec.id;\n        }}\n        sort=\"alphaAsc\"\n      />\n      <SmallMultiples splitHorizontally=\"h_split\" />\n      <LineAnnotation\n        dataValues={[\n          {\n            dataValue: 100,\n            details: 'Minimum # of connected users',\n          },\n        ]}\n        id=\"threshold\"\n        domainType={AnnotationDomainType.YDomain}\n        marker={marker}\n        style={{\n          line: {\n            dash: [5, 10],\n            stroke: 'black',\n            opacity: 0.8,\n            strokeWidth: 1,\n          },\n        }}\n      />\n      <BarSeries\n        id=\"website a\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data1}\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\n      />\n      <LineSeries\n        id=\"website b\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data2}\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\n      />\n      <AreaSeries\n        id=\"website c\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        splitSeriesAccessors={['g']}\n        data={data3}\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const marker = (\\n    <span\\n      style={{\\n        backgroundColor: 'lightgray',\\n        padding: 2,\\n        width: 30,\\n        height: 10,\\n        margin: 'auto',\\n        fontSize: 8,\\n        borderRadius: 2,\\n        lineHeight: 8,\\n      }}\\n    >\\n      MIN\\n    </span>\\n  );\\n  const showLegend = boolean('Show Legend', true);\\n  const onElementClick = action('onElementClick');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings onElementClick={onElementClick} showLegend={showLegend} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} gridLine={{ visible: false }} />\\n      <Axis id=\\\"y\\\" title=\\\"Day of week\\\" position={Position.Left} gridLine={{ visible: false }} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec) => {\\n          return spec.id;\\n        }}\\n        sort=\\\"alphaAsc\\\"\\n      />\\n      <SmallMultiples splitHorizontally=\\\"h_split\\\" />\\n      <LineAnnotation\\n        dataValues={[\\n          {\\n            dataValue: 100,\\n            details: 'Minimum # of connected users',\\n          },\\n        ]}\\n        id=\\\"threshold\\\"\\n        domainType={AnnotationDomainType.YDomain}\\n        marker={marker}\\n        style={{\\n          line: {\\n            dash: [5, 10],\\n            stroke: 'black',\\n            opacity: 0.8,\\n            strokeWidth: 1,\\n          },\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"website a\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data1}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <LineSeries\\n        id=\\\"website b\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data2}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n      <AreaSeries\\n        id=\\\"website c\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        splitSeriesAccessors={['g']}\\n        data={data3}\\n        color={[LIGHT_THEME.colors.vizColors[0], 'lightgray']}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, select, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  GroupBy,\\n  LegendStrategy,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  SmallMultiples,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { colorBrewerCategoricalPastel12, countryLookup, productLookup, regionLookup } from '../utils/utils';\\n\\nconst data = mocks.sunburst; // .filter((d) => countryLookup[d.dest].continentCountry.slice(0, 2) === 'eu');\\n\\nconst productToColor = new Map(\\n  data\\n    .map((d) => d.sitc1)\\n    .filter(keepDistinct)\\n    .sort()\\n    .map((sitc1, i) => [sitc1, `rgb(${colorBrewerCategoricalPastel12[i % 12].join(',')})`]),\\n);\\n\\nconst countryToColor = new Map(\\n  data\\n    .map((d) => d.dest)\\n    .filter(keepDistinct)\\n    .sort()\\n    .map((dest, i, a) => {\\n      const luma = Math.floor(96 + 128 * ((a.length - i - 1) / a.length));\\n      return [dest, `rgb(${luma},${luma},${luma})`];\\n    }),\\n);\\n\\nconst onElementListeners = {\\n  onElementClick: action('onElementClick'),\\n  onElementOver: action('onElementOver'),\\n  onElementOut: action('onElementOut'),\\n};\\n\\nconst theme: PartialTheme = {\\n  chartPaddings: { top: 6, left: 8, bottom: 6, right: 8 },\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const layout = select(\\n    'Inner breakdown layout',\\n    {\\n      horizontal: 'h',\\n      vertical: 'v',\\n      zigzag: 'z',\\n    },\\n    'z',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        {...onElementListeners}\\n        showLegend={boolean('Show legend', true)}\\n        showLegendExtra={boolean('Show legend extra', false)}\\n        legendStrategy={LegendStrategy.Key}\\n        flatLegend={boolean('Flat legend', true)}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('Debug', false)}\\n      />\\n      <GroupBy\\n        id=\\\"split\\\"\\n        by={(_, d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2)}\\n        format={(name) => regionLookup[name].regionName}\\n        sort={select('Panel order', { alphaAsc: 'alphaAsc', alphaDesc: 'alphaDesc' }, 'alphaAsc')}\\n      />\\n      <SmallMultiples\\n        splitHorizontally={layout === 'h' ? 'split' : undefined}\\n        splitVertically={layout === 'v' ? 'split' : undefined}\\n        splitZigzag={layout === 'z' ? 'split' : undefined}\\n        style={{\\n          horizontalPanelPadding: {\\n            outer: number('Horizontal outer pad', 0.15, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Horizontal inner pad', 0.05, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n          verticalPanelPadding: {\\n            outer: number('Vertical outer pad', 0.15, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Vertical inner pad', 0.05, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_2\\\"\\n        data={data}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            fillLabel: { maximizeFontSize: true },\\n            shape: {\\n              fillColor: (key) => productToColor.get(key)!,\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            fillLabel: { maximizeFontSize: true },\\n            shape: {\\n              fillColor: (key) => countryToColor.get(key)!,\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":83},\"endLoc\":{\"col\":1,\"line\":174},\"startBody\":{\"col\":36,\"line\":83},\"endBody\":{\"col\":1,\"line\":174}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, select, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  GroupBy,\n  LegendStrategy,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  SmallMultiples,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { colorBrewerCategoricalPastel12, countryLookup, productLookup, regionLookup } from '../utils/utils';\n\nconst data = mocks.sunburst; // .filter((d) => countryLookup[d.dest].continentCountry.slice(0, 2) === 'eu');\n\nconst productToColor = new Map(\n  data\n    .map((d) => d.sitc1)\n    .filter(keepDistinct)\n    .sort()\n    .map((sitc1, i) => [sitc1, `rgb(${colorBrewerCategoricalPastel12[i % 12].join(',')})`]),\n);\n\nconst countryToColor = new Map(\n  data\n    .map((d) => d.dest)\n    .filter(keepDistinct)\n    .sort()\n    .map((dest, i, a) => {\n      const luma = Math.floor(96 + 128 * ((a.length - i - 1) / a.length));\n      return [dest, `rgb(${luma},${luma},${luma})`];\n    }),\n);\n\nconst onElementListeners = {\n  onElementClick: action('onElementClick'),\n  onElementOver: action('onElementOver'),\n  onElementOut: action('onElementOut'),\n};\n\nconst theme: PartialTheme = {\n  chartPaddings: { top: 6, left: 8, bottom: 6, right: 8 },\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const layout = select(\n    'Inner breakdown layout',\n    {\n      horizontal: 'h',\n      vertical: 'v',\n      zigzag: 'z',\n    },\n    'z',\n  );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        {...onElementListeners}\n        showLegend={boolean('Show legend', true)}\n        showLegendExtra={boolean('Show legend extra', false)}\n        legendStrategy={LegendStrategy.Key}\n        flatLegend={boolean('Flat legend', true)}\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('Debug', false)}\n      />\n      <GroupBy\n        id=\"split\"\n        by={(_, d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2)}\n        format={(name) => regionLookup[name].regionName}\n        sort={select('Panel order', { alphaAsc: 'alphaAsc', alphaDesc: 'alphaDesc' }, 'alphaAsc')}\n      />\n      <SmallMultiples\n        splitHorizontally={layout === 'h' ? 'split' : undefined}\n        splitVertically={layout === 'v' ? 'split' : undefined}\n        splitZigzag={layout === 'z' ? 'split' : undefined}\n        style={{\n          horizontalPanelPadding: {\n            outer: number('Horizontal outer pad', 0.15, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n            inner: number('Horizontal inner pad', 0.05, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n          },\n          verticalPanelPadding: {\n            outer: number('Vertical outer pad', 0.15, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n            inner: number('Vertical inner pad', 0.05, {\n              range: true,\n              min: 0,\n              max: 0.5,\n              step: 0.05,\n            }),\n          },\n        }}\n      />\n      <Partition\n        id=\"spec_2\"\n        data={data}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: any) => productLookup[d].name,\n            fillLabel: { maximizeFontSize: true },\n            shape: {\n              fillColor: (key) => productToColor.get(key)!,\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            fillLabel: { maximizeFontSize: true },\n            shape: {\n              fillColor: (key) => countryToColor.get(key)!,\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const layout = select(\\n    'Inner breakdown layout',\\n    {\\n      horizontal: 'h',\\n      vertical: 'v',\\n      zigzag: 'z',\\n    },\\n    'z',\\n  );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        {...onElementListeners}\\n        showLegend={boolean('Show legend', true)}\\n        showLegendExtra={boolean('Show legend extra', false)}\\n        legendStrategy={LegendStrategy.Key}\\n        flatLegend={boolean('Flat legend', true)}\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('Debug', false)}\\n      />\\n      <GroupBy\\n        id=\\\"split\\\"\\n        by={(_, d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2)}\\n        format={(name) => regionLookup[name].regionName}\\n        sort={select('Panel order', { alphaAsc: 'alphaAsc', alphaDesc: 'alphaDesc' }, 'alphaAsc')}\\n      />\\n      <SmallMultiples\\n        splitHorizontally={layout === 'h' ? 'split' : undefined}\\n        splitVertically={layout === 'v' ? 'split' : undefined}\\n        splitZigzag={layout === 'z' ? 'split' : undefined}\\n        style={{\\n          horizontalPanelPadding: {\\n            outer: number('Horizontal outer pad', 0.15, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Horizontal inner pad', 0.05, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n          verticalPanelPadding: {\\n            outer: number('Vertical outer pad', 0.15, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n            inner: number('Vertical inner pad', 0.05, {\\n              range: true,\\n              min: 0,\\n              max: 0.5,\\n              step: 0.05,\\n            }),\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_2\\\"\\n        data={data}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            fillLabel: { maximizeFontSize: true },\\n            shape: {\\n              fillColor: (key) => productToColor.get(key)!,\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            fillLabel: { maximizeFontSize: true },\\n            shape: {\\n              fillColor: (key) => countryToColor.get(key)!,\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  ScaleType,\\n  Position,\\n  Chart,\\n  Axis,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  BarSeries,\\n  Predicate,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\n/**\\n * This story is used on VRTs to test the sorting logic of the dataIndex sort predicate\\n */\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data: [string, number][] = [\\n    ['3', 100],\\n    ['5', 80],\\n    ['1', 50],\\n    ['2', 30],\\n    ['6', 12],\\n    ['4', 10],\\n    ['7', 5],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} rotation={90} />\\n      <Axis id=\\\"time\\\" title=\\\"Day of week\\\" position={Position.Left} />\\n      <Axis id=\\\"y\\\" title=\\\"Count of logins\\\" position={Position.Bottom} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec, datum) => {\\n          return datum[0];\\n        }}\\n        sort={select(\\n          'Chart sorting',\\n          {\\n            ...Predicate,\\n          },\\n          Predicate.DataIndex,\\n        )}\\n      />\\n      <SmallMultiples splitVertically=\\\"h_split\\\" />\\n\\n      <BarSeries\\n        id=\\\"Login count\\\"\\n        name={(si) => {\\n          return `#logins day ${si.smVerticalAccessorValue}`;\\n        }}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor={() => ''}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\nExample.parameters = {\\n  markdown: `You can sort your small multiples by the \\\\`GroupBy.by\\\\` value in ascending/descending order.\\n  If the sort is configured with the \\\\`dataIndex\\\\` predicate the small multiples\\n  will keep the order of the passed data array.`,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":76},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":76}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  ScaleType,\n  Position,\n  Chart,\n  Axis,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  BarSeries,\n  Predicate,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\n/**\n * This story is used on VRTs to test the sorting logic of the dataIndex sort predicate\n */\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data: [string, number][] = [\n    ['3', 100],\n    ['5', 80],\n    ['1', 50],\n    ['2', 30],\n    ['6', 12],\n    ['4', 10],\n    ['7', 5],\n  ];\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} rotation={90} />\n      <Axis id=\"time\" title=\"Day of week\" position={Position.Left} />\n      <Axis id=\"y\" title=\"Count of logins\" position={Position.Bottom} />\n\n      <GroupBy\n        id=\"h_split\"\n        by={(spec, datum) => {\n          return datum[0];\n        }}\n        sort={select(\n          'Chart sorting',\n          {\n            ...Predicate,\n          },\n          Predicate.DataIndex,\n        )}\n      />\n      <SmallMultiples splitVertically=\"h_split\" />\n\n      <BarSeries\n        id=\"Login count\"\n        name={(si) => {\n          return `#logins day ${si.smVerticalAccessorValue}`;\n        }}\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        timeZone=\"local\"\n        xAccessor={() => ''}\n        yAccessors={[1]}\n        data={data}\n      />\n    </Chart>\n  );\n};\nExample.parameters = {\n  markdown: `You can sort your small multiples by the \\`GroupBy.by\\` value in ascending/descending order.\n  If the sort is configured with the \\`dataIndex\\` predicate the small multiples\n  will keep the order of the passed data array.`,\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data: [string, number][] = [\\n    ['3', 100],\\n    ['5', 80],\\n    ['1', 50],\\n    ['2', 30],\\n    ['6', 12],\\n    ['4', 10],\\n    ['7', 5],\\n  ];\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} rotation={90} />\\n      <Axis id=\\\"time\\\" title=\\\"Day of week\\\" position={Position.Left} />\\n      <Axis id=\\\"y\\\" title=\\\"Count of logins\\\" position={Position.Bottom} />\\n\\n      <GroupBy\\n        id=\\\"h_split\\\"\\n        by={(spec, datum) => {\\n          return datum[0];\\n        }}\\n        sort={select(\\n          'Chart sorting',\\n          {\\n            ...Predicate,\\n          },\\n          Predicate.DataIndex,\\n        )}\\n      />\\n      <SmallMultiples splitVertically=\\\"h_split\\\" />\\n\\n      <BarSeries\\n        id=\\\"Login count\\\"\\n        name={(si) => {\\n          return `#logins day ${si.smVerticalAccessorValue}`;\\n        }}\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        timeZone=\\\"local\\\"\\n        xAccessor={() => ''}\\n        yAccessors={[1]}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport { range } from 'lodash';\\nimport { DateTime } from 'luxon';\\nimport React, { useEffect, useMemo } from 'react';\\n\\nimport {\\n  ScaleType,\\n  Chart,\\n  GroupBy,\\n  SmallMultiples,\\n  Settings,\\n  niceTimeFormatByDay,\\n  timeFormatter,\\n  Heatmap,\\n  SmallMultiplesStyle,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator, getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\\nimport { customKnobs } from '../utils/knobs';\\nimport { useHeatmapSelection } from '../utils/use_heatmap_selection';\\nimport { sampleSize } from '../utils/utils';\\n\\nconst rng = getRandomNumberGenerator();\\nconst dg = new SeededDataGenerator(500, 'test');\\nconst numOfDays = 90;\\n\\nconst tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const debug = boolean('Debug', false);\\n  const debugState = boolean('Enable debug state', true);\\n  const timeBasedData = boolean('Time data', false);\\n  const showLegend = boolean('Show Legend', false);\\n  const vSplit = boolean('v - split', true, 'Data');\\n  const hSplit = boolean('h - split', true, 'Data');\\n  const vSplitCount = number('v - split count', 2, { min: 0 }, 'Data');\\n  const hSplitCount = number('h - split count', 2, { min: 0 }, 'Data');\\n  const vSplitCountAbs = vSplit ? vSplitCount : 1;\\n  const hSplitCountAbs = hSplit ? hSplitCount : 1;\\n  const categories = number('categories', 4, { min: 1, step: 1, range: true }, 'Data');\\n  const density = number('cell density(%)', 75, { min: 5, max: 100, step: 5, range: true }, 'Data') / 100;\\n  const xScaleType = customKnobs.enum.scaleType('xScaleType', ScaleType.Linear, {\\n    include: ['Linear', 'Ordinal'],\\n    group: 'Data',\\n  });\\n\\n  const smStyles: SmallMultiplesStyle = {\\n    horizontalPanelPadding: {\\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\\n      outer: number(\\n        'Horizontal outer pad',\\n        0,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n      inner: number(\\n        'Horizontal inner pad',\\n        0.05,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n    },\\n    verticalPanelPadding: {\\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\\n      outer: number(\\n        'Vertical outer pad',\\n        0,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n      inner: number(\\n        'Vertical inner pad',\\n        0.1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n    },\\n  };\\n  const showAxesTitles = boolean('Show axes title', true, 'SmallMultiples Styles');\\n  const showAxesPanelTitles = boolean('Show axes panel titles', true, 'SmallMultiples Styles');\\n\\n  const dataCount = timeBasedData ? numOfDays : 10;\\n  const fullData = useMemo(\\n    () =>\\n      dg.generateSMGroupedSeries(vSplitCountAbs, hSplitCountAbs, () => {\\n        return dg.generateSimpleSeries(dataCount).flatMap((d) =>\\n          range(0, categories, 1).map((y) => {\\n            return {\\n              y,\\n              x: d.x,\\n              value: rng(0, 1000),\\n              t: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\\n            };\\n          }),\\n        );\\n      }),\\n    [vSplitCountAbs, hSplitCountAbs, dataCount, categories],\\n  );\\n  const data = useMemo(\\n    () => sampleSize(fullData, vSplitCountAbs * hSplitCountAbs * dataCount * categories * density),\\n    [categories, dataCount, density, fullData, vSplitCountAbs, hSplitCountAbs],\\n  );\\n  const { highlightedData, onElementClick, onBrushEnd, clearSelection } = useHeatmapSelection();\\n\\n  useEffect(() => {\\n    clearSelection();\\n  }, [clearSelection, vSplit, hSplit, vSplitCount, hSplitCount, categories, density, xScaleType]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        debugState={debugState}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        onElementClick={onElementClick}\\n        showLegend={showLegend}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          axes: {\\n            axisTitle: {\\n              visible: showAxesTitles,\\n            },\\n            axisPanelTitle: {\\n              visible: showAxesPanelTitles,\\n            },\\n          },\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: number(\\n                  'Grid stroke',\\n                  1,\\n                  {\\n                    range: true,\\n                    min: 1,\\n                    max: 10,\\n                    step: 1,\\n                  },\\n                  'SmallMultiples Styles',\\n                ),\\n              },\\n            },\\n            cell: {\\n              border: {\\n                strokeWidth: 0,\\n              },\\n            },\\n          },\\n        }}\\n        onBrushEnd={onBrushEnd}\\n      />\\n\\n      <GroupBy id=\\\"v_split\\\" by={(_, { v }) => v} format={(v) => `Metric ${v}`} sort=\\\"numDesc\\\" />\\n      <GroupBy id=\\\"h_split\\\" by={(_, { h }) => h} format={(v) => `Host ${v}`} sort=\\\"numAsc\\\" />\\n      <SmallMultiples\\n        splitVertically={vSplit ? 'v_split' : undefined}\\n        splitHorizontally={hSplit ? 'h_split' : undefined}\\n        style={smStyles}\\n      />\\n\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 200, color: '#d2e9f7' },\\n            { start: 200, end: 300, color: '#8bc8fb' },\\n            { start: 300, end: 500, color: '#fdec25' },\\n            { start: 500, end: 600, color: '#fba740' },\\n            { start: 800, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={timeBasedData ? 't' : 'x'}\\n        yAccessor={(d) => Math.floor(d.y)}\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={\\n          timeBasedData\\n            ? {\\n                type: ScaleType.Time,\\n                interval: {\\n                  type: 'calendar',\\n                  value: 1,\\n                  unit: 'week',\\n                },\\n              }\\n            : {\\n                type: xScaleType,\\n              }\\n        }\\n        xAxisLabelFormatter={timeBasedData ? tickTimeFormatter : (v) => `C${v}`}\\n        yAxisLabelFormatter={(v) => `R${v}`}\\n        timeZone=\\\"UTC\\\"\\n        highlightedData={highlightedData}\\n        xAxisTitle=\\\"Bottom axis\\\"\\n        yAxisTitle=\\\"Left axis\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":40},\"endLoc\":{\"col\":1,\"line\":233},\"startBody\":{\"col\":36,\"line\":40},\"endBody\":{\"col\":1,\"line\":233}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport { range } from 'lodash';\nimport { DateTime } from 'luxon';\nimport React, { useEffect, useMemo } from 'react';\n\nimport {\n  ScaleType,\n  Chart,\n  GroupBy,\n  SmallMultiples,\n  Settings,\n  niceTimeFormatByDay,\n  timeFormatter,\n  Heatmap,\n  SmallMultiplesStyle,\n} from '@elastic/charts';\nimport { SeededDataGenerator, getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getDebugStateLogger } from '../utils/debug_state_logger';\nimport { customKnobs } from '../utils/knobs';\nimport { useHeatmapSelection } from '../utils/use_heatmap_selection';\nimport { sampleSize } from '../utils/utils';\n\nconst rng = getRandomNumberGenerator();\nconst dg = new SeededDataGenerator(500, 'test');\nconst numOfDays = 90;\n\nconst tickTimeFormatter = timeFormatter(niceTimeFormatByDay(numOfDays));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const debug = boolean('Debug', false);\n  const debugState = boolean('Enable debug state', true);\n  const timeBasedData = boolean('Time data', false);\n  const showLegend = boolean('Show Legend', false);\n  const vSplit = boolean('v - split', true, 'Data');\n  const hSplit = boolean('h - split', true, 'Data');\n  const vSplitCount = number('v - split count', 2, { min: 0 }, 'Data');\n  const hSplitCount = number('h - split count', 2, { min: 0 }, 'Data');\n  const vSplitCountAbs = vSplit ? vSplitCount : 1;\n  const hSplitCountAbs = hSplit ? hSplitCount : 1;\n  const categories = number('categories', 4, { min: 1, step: 1, range: true }, 'Data');\n  const density = number('cell density(%)', 75, { min: 5, max: 100, step: 5, range: true }, 'Data') / 100;\n  const xScaleType = customKnobs.enum.scaleType('xScaleType', ScaleType.Linear, {\n    include: ['Linear', 'Ordinal'],\n    group: 'Data',\n  });\n\n  const smStyles: SmallMultiplesStyle = {\n    horizontalPanelPadding: {\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\n      outer: number(\n        'Horizontal outer pad',\n        0,\n        {\n          range: true,\n          min: 0,\n          max: 0.5,\n          step: 0.05,\n        },\n        'SmallMultiples Styles',\n      ),\n      inner: number(\n        'Horizontal inner pad',\n        0.05,\n        {\n          range: true,\n          min: 0,\n          max: 0.5,\n          step: 0.05,\n        },\n        'SmallMultiples Styles',\n      ),\n    },\n    verticalPanelPadding: {\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\n      outer: number(\n        'Vertical outer pad',\n        0,\n        {\n          range: true,\n          min: 0,\n          max: 0.5,\n          step: 0.05,\n        },\n        'SmallMultiples Styles',\n      ),\n      inner: number(\n        'Vertical inner pad',\n        0.1,\n        {\n          range: true,\n          min: 0,\n          max: 0.5,\n          step: 0.05,\n        },\n        'SmallMultiples Styles',\n      ),\n    },\n  };\n  const showAxesTitles = boolean('Show axes title', true, 'SmallMultiples Styles');\n  const showAxesPanelTitles = boolean('Show axes panel titles', true, 'SmallMultiples Styles');\n\n  const dataCount = timeBasedData ? numOfDays : 10;\n  const fullData = useMemo(\n    () =>\n      dg.generateSMGroupedSeries(vSplitCountAbs, hSplitCountAbs, () => {\n        return dg.generateSimpleSeries(dataCount).flatMap((d) =>\n          range(0, categories, 1).map((y) => {\n            return {\n              y,\n              x: d.x,\n              value: rng(0, 1000),\n              t: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\n            };\n          }),\n        );\n      }),\n    [vSplitCountAbs, hSplitCountAbs, dataCount, categories],\n  );\n  const data = useMemo(\n    () => sampleSize(fullData, vSplitCountAbs * hSplitCountAbs * dataCount * categories * density),\n    [categories, dataCount, density, fullData, vSplitCountAbs, hSplitCountAbs],\n  );\n  const { highlightedData, onElementClick, onBrushEnd, clearSelection } = useHeatmapSelection();\n\n  useEffect(() => {\n    clearSelection();\n  }, [clearSelection, vSplit, hSplit, vSplitCount, hSplitCount, categories, density, xScaleType]);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        debug={debug}\n        debugState={debugState}\n        onRenderChange={getDebugStateLogger(debugState)}\n        onElementClick={onElementClick}\n        showLegend={showLegend}\n        baseTheme={useBaseTheme()}\n        theme={{\n          axes: {\n            axisTitle: {\n              visible: showAxesTitles,\n            },\n            axisPanelTitle: {\n              visible: showAxesPanelTitles,\n            },\n          },\n          heatmap: {\n            grid: {\n              stroke: {\n                width: number(\n                  'Grid stroke',\n                  1,\n                  {\n                    range: true,\n                    min: 1,\n                    max: 10,\n                    step: 1,\n                  },\n                  'SmallMultiples Styles',\n                ),\n              },\n            },\n            cell: {\n              border: {\n                strokeWidth: 0,\n              },\n            },\n          },\n        }}\n        onBrushEnd={onBrushEnd}\n      />\n\n      <GroupBy id=\"v_split\" by={(_, { v }) => v} format={(v) => `Metric ${v}`} sort=\"numDesc\" />\n      <GroupBy id=\"h_split\" by={(_, { h }) => h} format={(v) => `Host ${v}`} sort=\"numAsc\" />\n      <SmallMultiples\n        splitVertically={vSplit ? 'v_split' : undefined}\n        splitHorizontally={hSplit ? 'h_split' : undefined}\n        style={smStyles}\n      />\n\n      <Heatmap\n        id=\"heatmap1\"\n        colorScale={{\n          type: 'bands',\n          bands: [\n            { start: -Infinity, end: 200, color: '#d2e9f7' },\n            { start: 200, end: 300, color: '#8bc8fb' },\n            { start: 300, end: 500, color: '#fdec25' },\n            { start: 500, end: 600, color: '#fba740' },\n            { start: 800, end: Infinity, color: '#fe5050' },\n          ],\n        }}\n        data={data}\n        xAccessor={timeBasedData ? 't' : 'x'}\n        yAccessor={(d) => Math.floor(d.y)}\n        valueAccessor=\"value\"\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\n        ySortPredicate=\"numAsc\"\n        xScale={\n          timeBasedData\n            ? {\n                type: ScaleType.Time,\n                interval: {\n                  type: 'calendar',\n                  value: 1,\n                  unit: 'week',\n                },\n              }\n            : {\n                type: xScaleType,\n              }\n        }\n        xAxisLabelFormatter={timeBasedData ? tickTimeFormatter : (v) => `C${v}`}\n        yAxisLabelFormatter={(v) => `R${v}`}\n        timeZone=\"UTC\"\n        highlightedData={highlightedData}\n        xAxisTitle=\"Bottom axis\"\n        yAxisTitle=\"Left axis\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const debug = boolean('Debug', false);\\n  const debugState = boolean('Enable debug state', true);\\n  const timeBasedData = boolean('Time data', false);\\n  const showLegend = boolean('Show Legend', false);\\n  const vSplit = boolean('v - split', true, 'Data');\\n  const hSplit = boolean('h - split', true, 'Data');\\n  const vSplitCount = number('v - split count', 2, { min: 0 }, 'Data');\\n  const hSplitCount = number('h - split count', 2, { min: 0 }, 'Data');\\n  const vSplitCountAbs = vSplit ? vSplitCount : 1;\\n  const hSplitCountAbs = hSplit ? hSplitCount : 1;\\n  const categories = number('categories', 4, { min: 1, step: 1, range: true }, 'Data');\\n  const density = number('cell density(%)', 75, { min: 5, max: 100, step: 5, range: true }, 'Data') / 100;\\n  const xScaleType = customKnobs.enum.scaleType('xScaleType', ScaleType.Linear, {\\n    include: ['Linear', 'Ordinal'],\\n    group: 'Data',\\n  });\\n\\n  const smStyles: SmallMultiplesStyle = {\\n    horizontalPanelPadding: {\\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\\n      outer: number(\\n        'Horizontal outer pad',\\n        0,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n      inner: number(\\n        'Horizontal inner pad',\\n        0.05,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n    },\\n    verticalPanelPadding: {\\n      // Note: not fully supported, See https://github.com/elastic/elastic-charts/issues/1992\\n      outer: number(\\n        'Vertical outer pad',\\n        0,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n      inner: number(\\n        'Vertical inner pad',\\n        0.1,\\n        {\\n          range: true,\\n          min: 0,\\n          max: 0.5,\\n          step: 0.05,\\n        },\\n        'SmallMultiples Styles',\\n      ),\\n    },\\n  };\\n  const showAxesTitles = boolean('Show axes title', true, 'SmallMultiples Styles');\\n  const showAxesPanelTitles = boolean('Show axes panel titles', true, 'SmallMultiples Styles');\\n\\n  const dataCount = timeBasedData ? numOfDays : 10;\\n  const fullData = useMemo(\\n    () =>\\n      dg.generateSMGroupedSeries(vSplitCountAbs, hSplitCountAbs, () => {\\n        return dg.generateSimpleSeries(dataCount).flatMap((d) =>\\n          range(0, categories, 1).map((y) => {\\n            return {\\n              y,\\n              x: d.x,\\n              value: rng(0, 1000),\\n              t: DateTime.fromISO('2020-01-01T00:00:00Z').plus({ days: d.x }).toMillis(),\\n            };\\n          }),\\n        );\\n      }),\\n    [vSplitCountAbs, hSplitCountAbs, dataCount, categories],\\n  );\\n  const data = useMemo(\\n    () => sampleSize(fullData, vSplitCountAbs * hSplitCountAbs * dataCount * categories * density),\\n    [categories, dataCount, density, fullData, vSplitCountAbs, hSplitCountAbs],\\n  );\\n  const { highlightedData, onElementClick, onBrushEnd, clearSelection } = useHeatmapSelection();\\n\\n  useEffect(() => {\\n    clearSelection();\\n  }, [clearSelection, vSplit, hSplit, vSplitCount, hSplitCount, categories, density, xScaleType]);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        debug={debug}\\n        debugState={debugState}\\n        onRenderChange={getDebugStateLogger(debugState)}\\n        onElementClick={onElementClick}\\n        showLegend={showLegend}\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          axes: {\\n            axisTitle: {\\n              visible: showAxesTitles,\\n            },\\n            axisPanelTitle: {\\n              visible: showAxesPanelTitles,\\n            },\\n          },\\n          heatmap: {\\n            grid: {\\n              stroke: {\\n                width: number(\\n                  'Grid stroke',\\n                  1,\\n                  {\\n                    range: true,\\n                    min: 1,\\n                    max: 10,\\n                    step: 1,\\n                  },\\n                  'SmallMultiples Styles',\\n                ),\\n              },\\n            },\\n            cell: {\\n              border: {\\n                strokeWidth: 0,\\n              },\\n            },\\n          },\\n        }}\\n        onBrushEnd={onBrushEnd}\\n      />\\n\\n      <GroupBy id=\\\"v_split\\\" by={(_, { v }) => v} format={(v) => `Metric ${v}`} sort=\\\"numDesc\\\" />\\n      <GroupBy id=\\\"h_split\\\" by={(_, { h }) => h} format={(v) => `Host ${v}`} sort=\\\"numAsc\\\" />\\n      <SmallMultiples\\n        splitVertically={vSplit ? 'v_split' : undefined}\\n        splitHorizontally={hSplit ? 'h_split' : undefined}\\n        style={smStyles}\\n      />\\n\\n      <Heatmap\\n        id=\\\"heatmap1\\\"\\n        colorScale={{\\n          type: 'bands',\\n          bands: [\\n            { start: -Infinity, end: 200, color: '#d2e9f7' },\\n            { start: 200, end: 300, color: '#8bc8fb' },\\n            { start: 300, end: 500, color: '#fdec25' },\\n            { start: 500, end: 600, color: '#fba740' },\\n            { start: 800, end: Infinity, color: '#fe5050' },\\n          ],\\n        }}\\n        data={data}\\n        xAccessor={timeBasedData ? 't' : 'x'}\\n        yAccessor={(d) => Math.floor(d.y)}\\n        valueAccessor=\\\"value\\\"\\n        valueFormatter={(d) => `${Number(d.toFixed(2))}`}\\n        ySortPredicate=\\\"numAsc\\\"\\n        xScale={\\n          timeBasedData\\n            ? {\\n                type: ScaleType.Time,\\n                interval: {\\n                  type: 'calendar',\\n                  value: 1,\\n                  unit: 'week',\\n                },\\n              }\\n            : {\\n                type: xScaleType,\\n              }\\n        }\\n        xAxisLabelFormatter={timeBasedData ? tickTimeFormatter : (v) => `C${v}`}\\n        yAxisLabelFormatter={(v) => `R${v}`}\\n        timeZone=\\\"UTC\\\"\\n        highlightedData={highlightedData}\\n        xAxisTitle=\\\"Bottom axis\\\"\\n        yAxisTitle=\\\"Left axis\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Small Multiples (@alpha)',\n};\n\nexport { Example as verticalAreas } from './2_vertical_areas.story';\nexport { Example as verticalBars } from './4_vertical_bars.story';\nexport { Example as horizontalBars } from './4_horizontal_bars.story';\n\nexport { Example as gridLines } from './3_grid_lines.story';\nexport { Example as histogramBars } from './5_histogram_bars.story';\nexport { Example as heterogeneous } from './6_heterogeneous_cartesians.story';\nexport { Example as sunbursts } from './7_sunbursts.story';\nexport { Example as heatmap } from './9_heatmap.story';\n\nexport { Example as sorting } from './8_sorting.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Chart, ScaleType, StackMode, Axis, Position, CurveType, Settings } from '@elastic/charts';\\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const stackMode = select<StackMode>(\\n    'stackMode',\\n    {\\n      Silhouette: StackMode.Silhouette,\\n      Wiggle: StackMode.Wiggle,\\n    },\\n    StackMode.Silhouette,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[3]}\\n        splitSeriesAccessors={[2]}\\n        data={BABYNAME_DATA}\\n        stackAccessors={[0]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        stackMode={stackMode}\\n        areaSeriesStyle={{\\n          area: {\\n            opacity: 0.7,\\n          },\\n          line: {\\n            visible: false,\\n          },\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":54},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":54}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Chart, ScaleType, StackMode, Axis, Position, CurveType, Settings } from '@elastic/charts';\nimport { BABYNAME_DATA } from '@elastic/charts/src/utils/data_samples/babynames';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const stackMode = select<StackMode>(\n    'stackMode',\n    {\n      Silhouette: StackMode.Silhouette,\n      Wiggle: StackMode.Wiggle,\n    },\n    StackMode.Silhouette,\n  );\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"x\" position={Position.Bottom} />\n      <Axis id=\"y\" position={Position.Left} />\n      <AreaSeries\n        id=\"area1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[3]}\n        splitSeriesAccessors={[2]}\n        data={BABYNAME_DATA}\n        stackAccessors={[0]}\n        curve={CurveType.CURVE_MONOTONE_X}\n        stackMode={stackMode}\n        areaSeriesStyle={{\n          area: {\n            opacity: 0.7,\n          },\n          line: {\n            visible: false,\n          },\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const stackMode = select<StackMode>(\\n    'stackMode',\\n    {\\n      Silhouette: StackMode.Silhouette,\\n      Wiggle: StackMode.Wiggle,\\n    },\\n    StackMode.Silhouette,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} />\\n      <Axis id=\\\"y\\\" position={Position.Left} />\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[3]}\\n        splitSeriesAccessors={[2]}\\n        data={BABYNAME_DATA}\\n        stackAccessors={[0]}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        stackMode={stackMode}\\n        areaSeriesStyle={{\\n          area: {\\n            opacity: 0.7,\\n          },\\n          line: {\\n            visible: false,\\n          },\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Streamgraph',\n};\n\nexport { Example as basic } from './1_basic.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const applyBarStyle = boolean('apply bar style (bar 1 series)', true, 'Chart Global Theme');\\n  const changeRectWidthPixel = boolean('enable custom rect width (px)', false, 'Bar width');\\n  const rectWidthPixel = range('rect width (px)', 0, 100, 30, 'Bar width', 1);\\n  const changeRectWidthRatio = boolean('enable custom rect width (ratio)', false, 'Bar width');\\n  const rectWidthRatio = range('rect width (ratio)', 0, 1, 0.5, 'Bar width', 0.01);\\n  const barSeriesStyle = {\\n    rectBorder: {\\n      stroke: color('border stroke', 'blue', 'Bar 1 Style'),\\n      strokeWidth: range('border strokeWidth', 0, 5, 2, 'Bar 1 Style', 0.1),\\n      visible: boolean('border visible', true, 'Bar 1 Style'),\\n    },\\n    rect: {\\n      fill: color('rect fill', '#22C61A', 'Bar 1 Style'),\\n      opacity: range('rect opacity', 0, 1, 0.3, 'Bar 1 Style', 0.1),\\n    },\\n  };\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('theme border stroke', 'red', 'Chart Global Theme'),\\n        strokeWidth: range('theme border strokeWidth', 0, 5, 2, 'Chart Global Theme', 0.1),\\n        visible: boolean('theme border visible', true, 'Chart Global Theme'),\\n      },\\n      rect: {\\n        opacity: range('theme opacity ', 0, 1, 0.9, 'Chart Global Theme', 0.1),\\n        widthPixel: changeRectWidthPixel ? rectWidthPixel : undefined,\\n        widthRatio: changeRectWidthRatio ? rectWidthRatio : undefined,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TestDatasets.BARCHART_1Y0G}\\n        barSeriesStyle={applyBarStyle ? barSeriesStyle : undefined}\\n        name=\\\"bars 1\\\"\\n      />\\n      <BarSeries\\n        id=\\\"bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TestDatasets.BARCHART_1Y0G}\\n        name=\\\"bars 2\\\"\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":92},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":92}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const applyBarStyle = boolean('apply bar style (bar 1 series)', true, 'Chart Global Theme');\n  const changeRectWidthPixel = boolean('enable custom rect width (px)', false, 'Bar width');\n  const rectWidthPixel = range('rect width (px)', 0, 100, 30, 'Bar width', 1);\n  const changeRectWidthRatio = boolean('enable custom rect width (ratio)', false, 'Bar width');\n  const rectWidthRatio = range('rect width (ratio)', 0, 1, 0.5, 'Bar width', 0.01);\n  const barSeriesStyle = {\n    rectBorder: {\n      stroke: color('border stroke', 'blue', 'Bar 1 Style'),\n      strokeWidth: range('border strokeWidth', 0, 5, 2, 'Bar 1 Style', 0.1),\n      visible: boolean('border visible', true, 'Bar 1 Style'),\n    },\n    rect: {\n      fill: color('rect fill', '#22C61A', 'Bar 1 Style'),\n      opacity: range('rect opacity', 0, 1, 0.3, 'Bar 1 Style', 0.1),\n    },\n  };\n\n  const theme: PartialTheme = {\n    barSeriesStyle: {\n      rectBorder: {\n        stroke: color('theme border stroke', 'red', 'Chart Global Theme'),\n        strokeWidth: range('theme border strokeWidth', 0, 5, 2, 'Chart Global Theme', 0.1),\n        visible: boolean('theme border visible', true, 'Chart Global Theme'),\n      },\n      rect: {\n        opacity: range('theme opacity ', 0, 1, 0.9, 'Chart Global Theme', 0.1),\n        widthPixel: changeRectWidthPixel ? rectWidthPixel : undefined,\n        widthRatio: changeRectWidthRatio ? rectWidthRatio : undefined,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} theme={theme} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bar 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={TestDatasets.BARCHART_1Y0G}\n        barSeriesStyle={applyBarStyle ? barSeriesStyle : undefined}\n        name=\"bars 1\"\n      />\n      <BarSeries\n        id=\"bar 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={TestDatasets.BARCHART_1Y0G}\n        name=\"bars 2\"\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const applyBarStyle = boolean('apply bar style (bar 1 series)', true, 'Chart Global Theme');\\n  const changeRectWidthPixel = boolean('enable custom rect width (px)', false, 'Bar width');\\n  const rectWidthPixel = range('rect width (px)', 0, 100, 30, 'Bar width', 1);\\n  const changeRectWidthRatio = boolean('enable custom rect width (ratio)', false, 'Bar width');\\n  const rectWidthRatio = range('rect width (ratio)', 0, 1, 0.5, 'Bar width', 0.01);\\n  const barSeriesStyle = {\\n    rectBorder: {\\n      stroke: color('border stroke', 'blue', 'Bar 1 Style'),\\n      strokeWidth: range('border strokeWidth', 0, 5, 2, 'Bar 1 Style', 0.1),\\n      visible: boolean('border visible', true, 'Bar 1 Style'),\\n    },\\n    rect: {\\n      fill: color('rect fill', '#22C61A', 'Bar 1 Style'),\\n      opacity: range('rect opacity', 0, 1, 0.3, 'Bar 1 Style', 0.1),\\n    },\\n  };\\n\\n  const theme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('theme border stroke', 'red', 'Chart Global Theme'),\\n        strokeWidth: range('theme border strokeWidth', 0, 5, 2, 'Chart Global Theme', 0.1),\\n        visible: boolean('theme border visible', true, 'Chart Global Theme'),\\n      },\\n      rect: {\\n        opacity: range('theme opacity ', 0, 1, 0.9, 'Chart Global Theme', 0.1),\\n        widthPixel: changeRectWidthPixel ? rectWidthPixel : undefined,\\n        widthRatio: changeRectWidthRatio ? rectWidthRatio : undefined,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} theme={theme} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TestDatasets.BARCHART_1Y0G}\\n        barSeriesStyle={applyBarStyle ? barSeriesStyle : undefined}\\n        name=\\\"bars 1\\\"\\n      />\\n      <BarSeries\\n        id=\\\"bar 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={TestDatasets.BARCHART_1Y0G}\\n        name=\\\"bars 2\\\"\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  LineSeriesStyle,\\n  RecursivePartial,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nfunction generateLineAndPointSeriesStyleKnobs(\\n  groupName: string,\\n  tag: string,\\n  pointFill?: string,\\n  pointStroke?: string,\\n  pointStrokeWidth?: number,\\n  pointRadius?: number,\\n  lineStrokeWidth?: number,\\n  lineStroke?: string,\\n): RecursivePartial<LineSeriesStyle> {\\n  return {\\n    line: {\\n      stroke: lineStroke ? color(`line.stroke (${tag})`, lineStroke, groupName) : undefined,\\n      strokeWidth: range(`line.strokeWidth (${tag})`, 0, 10, lineStrokeWidth || 1, groupName),\\n      visible: boolean(`line.visible (${tag})`, true, groupName),\\n      opacity: range(`line.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\\n    },\\n    point: {\\n      visible: boolean(`point.visible (${tag})`, true, groupName),\\n      radius: range(`point.radius (${tag})`, 0, 20, pointRadius || 5, groupName, 0.5),\\n      opacity: range(`point.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\\n      stroke: color(`point.stroke (${tag})`, pointStroke || 'black', groupName),\\n      fill: color(`point.fill (${tag})`, pointFill || 'lightgray', groupName),\\n      strokeWidth: range(`point.strokeWidth (${tag})`, 0, 5, pointStrokeWidth || 2, groupName, 0.01),\\n    },\\n  };\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\\n  const lineSeriesStyle1 = generateLineAndPointSeriesStyleKnobs('Line 1 style', 'line1', 'lime', 'green', 4, 10, 6);\\n  const lineSeriesStyle2 = generateLineAndPointSeriesStyleKnobs('Line 2 style', 'line2', 'blue', 'violet', 2, 5, 4);\\n\\n  const chartTheme = {\\n    lineSeriesStyle: generateLineAndPointSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\\n  };\\n\\n  const dataset1 = [\\n    { x: 0, y: 3 },\\n    { x: 1, y: 2 },\\n    { x: 2, y: 4 },\\n    { x: 3, y: 10 },\\n  ];\\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={chartTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <LineSeries\\n        id=\\\"lines1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset1}\\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle1 : undefined}\\n      />\\n      <LineSeries\\n        id=\\\"lines2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset2}\\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle2 : undefined}\\n      />\\n      <LineSeries\\n        id=\\\"lines3\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":68},\"endLoc\":{\"col\":1,\"line\":125},\"startBody\":{\"col\":36,\"line\":68},\"endBody\":{\"col\":1,\"line\":125}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  LineSeriesStyle,\n  RecursivePartial,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nfunction generateLineAndPointSeriesStyleKnobs(\n  groupName: string,\n  tag: string,\n  pointFill?: string,\n  pointStroke?: string,\n  pointStrokeWidth?: number,\n  pointRadius?: number,\n  lineStrokeWidth?: number,\n  lineStroke?: string,\n): RecursivePartial<LineSeriesStyle> {\n  return {\n    line: {\n      stroke: lineStroke ? color(`line.stroke (${tag})`, lineStroke, groupName) : undefined,\n      strokeWidth: range(`line.strokeWidth (${tag})`, 0, 10, lineStrokeWidth || 1, groupName),\n      visible: boolean(`line.visible (${tag})`, true, groupName),\n      opacity: range(`line.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\n    },\n    point: {\n      visible: boolean(`point.visible (${tag})`, true, groupName),\n      radius: range(`point.radius (${tag})`, 0, 20, pointRadius || 5, groupName, 0.5),\n      opacity: range(`point.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\n      stroke: color(`point.stroke (${tag})`, pointStroke || 'black', groupName),\n      fill: color(`point.fill (${tag})`, pointFill || 'lightgray', groupName),\n      strokeWidth: range(`point.strokeWidth (${tag})`, 0, 5, pointStrokeWidth || 2, groupName, 0.01),\n    },\n  };\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\n  const lineSeriesStyle1 = generateLineAndPointSeriesStyleKnobs('Line 1 style', 'line1', 'lime', 'green', 4, 10, 6);\n  const lineSeriesStyle2 = generateLineAndPointSeriesStyleKnobs('Line 2 style', 'line2', 'blue', 'violet', 2, 5, 4);\n\n  const chartTheme = {\n    lineSeriesStyle: generateLineAndPointSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\n  };\n\n  const dataset1 = [\n    { x: 0, y: 3 },\n    { x: 1, y: 2 },\n    { x: 2, y: 4 },\n    { x: 3, y: 10 },\n  ];\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={chartTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <LineSeries\n        id=\"lines1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={dataset1}\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle1 : undefined}\n      />\n      <LineSeries\n        id=\"lines2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={dataset2}\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle2 : undefined}\n      />\n      <LineSeries\n        id=\"lines3\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={dataset3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\\n  const lineSeriesStyle1 = generateLineAndPointSeriesStyleKnobs('Line 1 style', 'line1', 'lime', 'green', 4, 10, 6);\\n  const lineSeriesStyle2 = generateLineAndPointSeriesStyleKnobs('Line 2 style', 'line2', 'blue', 'violet', 2, 5, 4);\\n\\n  const chartTheme = {\\n    lineSeriesStyle: generateLineAndPointSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\\n  };\\n\\n  const dataset1 = [\\n    { x: 0, y: 3 },\\n    { x: 1, y: 2 },\\n    { x: 2, y: 4 },\\n    { x: 3, y: 10 },\\n  ];\\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={chartTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <LineSeries\\n        id=\\\"lines1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset1}\\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle1 : undefined}\\n      />\\n      <LineSeries\\n        id=\\\"lines2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset2}\\n        lineSeriesStyle={applyLineStyles ? lineSeriesStyle2 : undefined}\\n      />\\n      <LineSeries\\n        id=\\\"lines3\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={dataset3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  LineSeriesStyle,\\n  PartialTheme,\\n  RecursivePartial,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nfunction generateLineAndPointSeriesStyleKnobs(\\n  groupName: string,\\n  tag: string,\\n  pointFill?: string,\\n  pointStroke?: string,\\n  pointStrokeWidth?: number,\\n  pointRadius?: number,\\n  lineStrokeWidth?: number,\\n  lineStroke?: string,\\n): RecursivePartial<LineSeriesStyle> {\\n  return {\\n    line: {\\n      stroke: lineStroke ? color(`line.stroke (${tag})`, lineStroke, groupName) : undefined,\\n      strokeWidth: range(`line.strokeWidth (${tag})`, 0, 10, lineStrokeWidth || 1, groupName),\\n      visible: boolean(`line.visible (${tag})`, true, groupName),\\n      opacity: range(`line.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\\n    },\\n    point: {\\n      visible: boolean(`point.visible (${tag})`, true, groupName),\\n      radius: range(`point.radius (${tag})`, 0, 20, pointRadius || 5, groupName, 0.5),\\n      opacity: range(`point.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\\n      stroke: color(`point.stroke (${tag})`, pointStroke || 'black', groupName),\\n      fill: color(`point.fill (${tag})`, pointFill || 'lightgray', groupName),\\n      strokeWidth: range(`point.strokeWidth (${tag})`, 0, 50, pointStrokeWidth || 2, groupName, 0.01),\\n    },\\n  };\\n}\\n\\nfunction generateAreaSeriesStyleKnobs(\\n  groupName: string,\\n  tag: string,\\n  pointFill?: string,\\n  pointStroke?: string,\\n  pointStrokeWidth?: number,\\n  pointRadius?: number,\\n  lineStrokeWidth?: number,\\n  lineStroke?: string,\\n  areaFill?: string,\\n) {\\n  return {\\n    ...generateLineAndPointSeriesStyleKnobs(\\n      groupName,\\n      tag,\\n      pointFill,\\n      pointStroke,\\n      pointStrokeWidth,\\n      pointRadius,\\n      lineStrokeWidth,\\n      lineStroke,\\n    ),\\n    area: {\\n      fill: areaFill ? color(`area.fill (${tag})`, areaFill, groupName) : undefined,\\n      visible: boolean(`area.visible (${tag})`, true, groupName),\\n      opacity: range(`area.opacity (${tag})`, 0, 1, 0.8, groupName, 0.01),\\n    },\\n  };\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\\n\\n  const chartTheme: PartialTheme = {\\n    areaSeriesStyle: generateAreaSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\\n  };\\n\\n  const dataset1 = [\\n    { x: 0, y: 3 },\\n    { x: 1, y: 6 },\\n    { x: 2, y: 4 },\\n    { x: 3, y: 10 },\\n  ];\\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\\n\\n  const areaStyle1 = generateAreaSeriesStyleKnobs('Area 1 Style', 'area1', 'lime', 'green', 4, 10, 6, 'black');\\n  const areaStyle2 = generateAreaSeriesStyleKnobs('Area 2 Style', 'area2', 'blue', 'violet', 2, 5, 4, undefined, 'red');\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={chartTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset1}\\n        areaSeriesStyle={applyLineStyles ? areaStyle1 : undefined}\\n      />\\n      <AreaSeries\\n        id=\\\"area2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset2}\\n        areaSeriesStyle={applyLineStyles ? areaStyle2 : undefined}\\n      />\\n      <AreaSeries\\n        id=\\\"area3\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":99},\"endLoc\":{\"col\":1,\"line\":160},\"startBody\":{\"col\":36,\"line\":99},\"endBody\":{\"col\":1,\"line\":160}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  Position,\n  ScaleType,\n  Settings,\n  LineSeriesStyle,\n  PartialTheme,\n  RecursivePartial,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nfunction generateLineAndPointSeriesStyleKnobs(\n  groupName: string,\n  tag: string,\n  pointFill?: string,\n  pointStroke?: string,\n  pointStrokeWidth?: number,\n  pointRadius?: number,\n  lineStrokeWidth?: number,\n  lineStroke?: string,\n): RecursivePartial<LineSeriesStyle> {\n  return {\n    line: {\n      stroke: lineStroke ? color(`line.stroke (${tag})`, lineStroke, groupName) : undefined,\n      strokeWidth: range(`line.strokeWidth (${tag})`, 0, 10, lineStrokeWidth || 1, groupName),\n      visible: boolean(`line.visible (${tag})`, true, groupName),\n      opacity: range(`line.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\n    },\n    point: {\n      visible: boolean(`point.visible (${tag})`, true, groupName),\n      radius: range(`point.radius (${tag})`, 0, 20, pointRadius || 5, groupName, 0.5),\n      opacity: range(`point.opacity (${tag})`, 0, 1, 1, groupName, 0.01),\n      stroke: color(`point.stroke (${tag})`, pointStroke || 'black', groupName),\n      fill: color(`point.fill (${tag})`, pointFill || 'lightgray', groupName),\n      strokeWidth: range(`point.strokeWidth (${tag})`, 0, 50, pointStrokeWidth || 2, groupName, 0.01),\n    },\n  };\n}\n\nfunction generateAreaSeriesStyleKnobs(\n  groupName: string,\n  tag: string,\n  pointFill?: string,\n  pointStroke?: string,\n  pointStrokeWidth?: number,\n  pointRadius?: number,\n  lineStrokeWidth?: number,\n  lineStroke?: string,\n  areaFill?: string,\n) {\n  return {\n    ...generateLineAndPointSeriesStyleKnobs(\n      groupName,\n      tag,\n      pointFill,\n      pointStroke,\n      pointStrokeWidth,\n      pointRadius,\n      lineStrokeWidth,\n      lineStroke,\n    ),\n    area: {\n      fill: areaFill ? color(`area.fill (${tag})`, areaFill, groupName) : undefined,\n      visible: boolean(`area.visible (${tag})`, true, groupName),\n      opacity: range(`area.opacity (${tag})`, 0, 1, 0.8, groupName, 0.01),\n    },\n  };\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\n\n  const chartTheme: PartialTheme = {\n    areaSeriesStyle: generateAreaSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\n  };\n\n  const dataset1 = [\n    { x: 0, y: 3 },\n    { x: 1, y: 6 },\n    { x: 2, y: 4 },\n    { x: 3, y: 10 },\n  ];\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\n\n  const areaStyle1 = generateAreaSeriesStyleKnobs('Area 1 Style', 'area1', 'lime', 'green', 4, 10, 6, 'black');\n  const areaStyle2 = generateAreaSeriesStyleKnobs('Area 2 Style', 'area2', 'blue', 'violet', 2, 5, 4, undefined, 'red');\n\n  return (\n    <Chart title={title} description={description} renderer=\"canvas\">\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={chartTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <AreaSeries\n        id=\"area1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={dataset1}\n        areaSeriesStyle={applyLineStyles ? areaStyle1 : undefined}\n      />\n      <AreaSeries\n        id=\"area2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={dataset2}\n        areaSeriesStyle={applyLineStyles ? areaStyle2 : undefined}\n      />\n      <AreaSeries\n        id=\"area3\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        stackAccessors={['x']}\n        data={dataset3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const applyLineStyles = boolean('apply line series style', true, 'Chart Global Theme');\\n\\n  const chartTheme: PartialTheme = {\\n    areaSeriesStyle: generateAreaSeriesStyleKnobs('Chart Global Theme', 'chartTheme'),\\n  };\\n\\n  const dataset1 = [\\n    { x: 0, y: 3 },\\n    { x: 1, y: 6 },\\n    { x: 2, y: 4 },\\n    { x: 3, y: 10 },\\n  ];\\n  const dataset2 = dataset1.map((datum) => ({ ...datum, y: datum.y - 1 }));\\n  const dataset3 = dataset1.map((datum) => ({ ...datum, y: datum.y - 2 }));\\n\\n  const areaStyle1 = generateAreaSeriesStyleKnobs('Area 1 Style', 'area1', 'lime', 'green', 4, 10, 6, 'black');\\n  const areaStyle2 = generateAreaSeriesStyleKnobs('Area 2 Style', 'area2', 'blue', 'violet', 2, 5, 4, undefined, 'red');\\n\\n  return (\\n    <Chart title={title} description={description} renderer=\\\"canvas\\\">\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={chartTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"area1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset1}\\n        areaSeriesStyle={applyLineStyles ? areaStyle1 : undefined}\\n      />\\n      <AreaSeries\\n        id=\\\"area2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset2}\\n        areaSeriesStyle={applyLineStyles ? areaStyle2 : undefined}\\n      />\\n      <AreaSeries\\n        id=\\\"area3\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        stackAccessors={['x']}\\n        data={dataset3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameFn } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }) => {\\n    if (yAccessor === 'y1' && splitAccessors.get('g') === 'a') {\\n      return 'Custom full series name';\\n    }\\n\\n    return null;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n        name={customSeriesNamingFn}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameFn } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }) => {\n    if (yAccessor === 'y1' && splitAccessors.get('g') === 'a') {\n      return 'Custom full series name';\n    }\n\n    return null;\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n        name={customSeriesNamingFn}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }) => {\\n    if (yAccessor === 'y1' && splitAccessors.get('g') === 'a') {\\n      return 'Custom full series name';\\n    }\\n\\n    return null;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n        name={customSeriesNamingFn}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameConfigOptions } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customSeriesNameOptions: SeriesNameConfigOptions = {\\n    names: [\\n      {\\n        // replace split accessor;\\n        accessor: 'g',\\n        value: 'a',\\n        name: 'replace a(from g)',\\n      },\\n      {\\n        // replace y accessor;\\n        accessor: 'y2',\\n        name: 'replace y2',\\n      },\\n    ],\\n    delimiter: ' | ',\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n        name={customSeriesNameOptions}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameConfigOptions } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customSeriesNameOptions: SeriesNameConfigOptions = {\n    names: [\n      {\n        // replace split accessor;\n        accessor: 'g',\n        value: 'a',\n        name: 'replace a(from g)',\n      },\n      {\n        // replace y accessor;\n        accessor: 'y2',\n        name: 'replace y2',\n      },\n    ],\n    delimiter: ' | ',\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n        name={customSeriesNameOptions}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customSeriesNameOptions: SeriesNameConfigOptions = {\\n    names: [\\n      {\\n        // replace split accessor;\\n        accessor: 'g',\\n        value: 'a',\\n        name: 'replace a(from g)',\\n      },\\n      {\\n        // replace y accessor;\\n        accessor: 'y2',\\n        name: 'replace y2',\\n      },\\n    ],\\n    delimiter: ' | ',\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n        name={customSeriesNameOptions}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { DateTime } from 'luxon';\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameFn } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    { x: 1, y: 3, percent: 0.5, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 6, percent: 0.5, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 20, percent: 0.5, time: start.plus({ month: 3 }).toMillis() },\\n    { x: 1, y: 9, percent: 0.7, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 13, percent: 0.7, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 14, percent: 0.7, time: start.plus({ month: 3 }).toMillis() },\\n    { x: 1, y: 15, percent: 0.1, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 18, percent: 1, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 7, percent: 1, time: start.plus({ month: 3 }).toMillis() },\\n  ];\\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }, isTooltip) =>\\n    [\\n      ...[...splitAccessors.entries()].map(([key, value]) => {\\n        if (key === 'time') {\\n          // Format time group\\n          if (isTooltip) {\\n            // Format tooltip time to be longer\\n            return moment(value).format('ll');\\n          }\\n\\n          // Format legend to be shorter\\n          return moment(value).format('M/YYYY');\\n        }\\n\\n        if (key === 'percent') {\\n          // Format percent group\\n          return `${(value as number) * 100}%`;\\n        }\\n\\n        return value;\\n      }),\\n      // don't format yAccessor\\n      yAccessor,\\n    ].join(' - ');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['time', 'percent']}\\n        data={data}\\n        name={customSeriesNamingFn}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { DateTime } from 'luxon';\nimport moment from 'moment';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, SeriesNameFn } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\n  const data = [\n    { x: 1, y: 3, percent: 0.5, time: start.plus({ month: 1 }).toMillis() },\n    { x: 2, y: 6, percent: 0.5, time: start.plus({ month: 2 }).toMillis() },\n    { x: 3, y: 20, percent: 0.5, time: start.plus({ month: 3 }).toMillis() },\n    { x: 1, y: 9, percent: 0.7, time: start.plus({ month: 1 }).toMillis() },\n    { x: 2, y: 13, percent: 0.7, time: start.plus({ month: 2 }).toMillis() },\n    { x: 3, y: 14, percent: 0.7, time: start.plus({ month: 3 }).toMillis() },\n    { x: 1, y: 15, percent: 0.1, time: start.plus({ month: 1 }).toMillis() },\n    { x: 2, y: 18, percent: 1, time: start.plus({ month: 2 }).toMillis() },\n    { x: 3, y: 7, percent: 1, time: start.plus({ month: 3 }).toMillis() },\n  ];\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }, isTooltip) =>\n    [\n      ...[...splitAccessors.entries()].map(([key, value]) => {\n        if (key === 'time') {\n          // Format time group\n          if (isTooltip) {\n            // Format tooltip time to be longer\n            return moment(value).format('ll');\n          }\n\n          // Format legend to be shorter\n          return moment(value).format('M/YYYY');\n        }\n\n        if (key === 'percent') {\n          // Format percent group\n          return `${(value as number) * 100}%`;\n        }\n\n        return value;\n      }),\n      // don't format yAccessor\n      yAccessor,\n    ].join(' - ');\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars1\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['time', 'percent']}\n        data={data}\n        name={customSeriesNamingFn}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const start = DateTime.fromISO('2019-01-01T00:00:00.000', { zone: 'utc' });\\n  const data = [\\n    { x: 1, y: 3, percent: 0.5, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 6, percent: 0.5, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 20, percent: 0.5, time: start.plus({ month: 3 }).toMillis() },\\n    { x: 1, y: 9, percent: 0.7, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 13, percent: 0.7, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 14, percent: 0.7, time: start.plus({ month: 3 }).toMillis() },\\n    { x: 1, y: 15, percent: 0.1, time: start.plus({ month: 1 }).toMillis() },\\n    { x: 2, y: 18, percent: 1, time: start.plus({ month: 2 }).toMillis() },\\n    { x: 3, y: 7, percent: 1, time: start.plus({ month: 3 }).toMillis() },\\n  ];\\n  const customSeriesNamingFn: SeriesNameFn = ({ yAccessor, splitAccessors }, isTooltip) =>\\n    [\\n      ...[...splitAccessors.entries()].map(([key, value]) => {\\n        if (key === 'time') {\\n          // Format time group\\n          if (isTooltip) {\\n            // Format tooltip time to be longer\\n            return moment(value).format('ll');\\n          }\\n\\n          // Format legend to be shorter\\n          return moment(value).format('M/YYYY');\\n        }\\n\\n        if (key === 'percent') {\\n          // Format percent group\\n          return `${(value as number) * 100}%`;\\n        }\\n\\n        return value;\\n      }),\\n      // don't format yAccessor\\n      yAccessor,\\n    ].join(' - ');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars1\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['time', 'percent']}\\n        data={data}\\n        name={customSeriesNamingFn}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  Chart,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  RecursivePartial,\\n  AxisStyle,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    axes: {\\n      tickLabel: {\\n        fill: color('tickFill', '#333', 'Tick Label'),\\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: number('Tick Label Padding Theme', 1, {}, 'Tick Label'),\\n      },\\n    },\\n  };\\n\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding Axis Spec', 0),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks style={customStyle} />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":41},\"endLoc\":{\"col\":1,\"line\":80},\"startBody\":{\"col\":36,\"line\":41},\"endBody\":{\"col\":1,\"line\":80}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  Chart,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n  RecursivePartial,\n  AxisStyle,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    axes: {\n      tickLabel: {\n        fill: color('tickFill', '#333', 'Tick Label'),\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        fontStyle: 'normal',\n        padding: number('Tick Label Padding Theme', 1, {}, 'Tick Label'),\n      },\n    },\n  };\n\n  const customStyle: RecursivePartial<AxisStyle> = {\n    tickLabel: {\n      padding: number('Tick Label Padding Axis Spec', 0),\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks style={customStyle} />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <AreaSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    axes: {\\n      tickLabel: {\\n        fill: color('tickFill', '#333', 'Tick Label'),\\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: number('Tick Label Padding Theme', 1, {}, 'Tick Label'),\\n      },\\n    },\\n  };\\n\\n  const customStyle: RecursivePartial<AxisStyle> = {\\n    tickLabel: {\\n      padding: number('Tick Label Padding Axis Spec', 0),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} debug={boolean('debug', true)} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks style={customStyle} />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  RecursivePartial,\\n  BarSeriesStyle,\\n  PointStyle,\\n  BarStyleAccessor,\\n  PointStyleAccessor,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hasThreshold = boolean('threshold', true);\\n  const threshold = number('min threshold', 3);\\n  const barStyle: RecursivePartial<BarSeriesStyle> = {\\n    rect: {\\n      opacity: 0.5,\\n      fill: 'red',\\n    },\\n  };\\n  const pointStyle: RecursivePartial<PointStyle> = {\\n    fill: 'red',\\n    radius: 10,\\n  };\\n  const barStyleAccessor: BarStyleAccessor = (d, g) => (g.specId === 'bar' && d.y1! > threshold ? barStyle : null);\\n  const pointStyleAccessor: PointStyleAccessor = (d, g) =>\\n    (g.specId === 'line' || g.specId === 'area') && d.y1! > threshold ? pointStyle : null;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        styleAccessor={hasThreshold ? barStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 1 },\\n          { x: 1, y: 6 },\\n          { x: 2, y: 2 },\\n          { x: 3, y: 5 },\\n        ]}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 0.5 },\\n          { x: 1, y: 4 },\\n          { x: 2, y: 1 },\\n          { x: 3, y: 4 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":109},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":109}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  RecursivePartial,\n  BarSeriesStyle,\n  PointStyle,\n  BarStyleAccessor,\n  PointStyleAccessor,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hasThreshold = boolean('threshold', true);\n  const threshold = number('min threshold', 3);\n  const barStyle: RecursivePartial<BarSeriesStyle> = {\n    rect: {\n      opacity: 0.5,\n      fill: 'red',\n    },\n  };\n  const pointStyle: RecursivePartial<PointStyle> = {\n    fill: 'red',\n    radius: 10,\n  };\n  const barStyleAccessor: BarStyleAccessor = (d, g) => (g.specId === 'bar' && d.y1! > threshold ? barStyle : null);\n  const pointStyleAccessor: PointStyleAccessor = (d, g) =>\n    (g.specId === 'line' || g.specId === 'area') && d.y1! > threshold ? pointStyle : null;\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          areaSeriesStyle: {\n            point: {\n              visible: true,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bar\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        styleAccessor={hasThreshold ? barStyleAccessor : undefined}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n\n      <LineSeries\n        id=\"line\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\n        data={[\n          { x: 0, y: 1 },\n          { x: 1, y: 6 },\n          { x: 2, y: 2 },\n          { x: 3, y: 5 },\n        ]}\n      />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\n        data={[\n          { x: 0, y: 0.5 },\n          { x: 1, y: 4 },\n          { x: 2, y: 1 },\n          { x: 3, y: 4 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hasThreshold = boolean('threshold', true);\\n  const threshold = number('min threshold', 3);\\n  const barStyle: RecursivePartial<BarSeriesStyle> = {\\n    rect: {\\n      opacity: 0.5,\\n      fill: 'red',\\n    },\\n  };\\n  const pointStyle: RecursivePartial<PointStyle> = {\\n    fill: 'red',\\n    radius: 10,\\n  };\\n  const barStyleAccessor: BarStyleAccessor = (d, g) => (g.specId === 'bar' && d.y1! > threshold ? barStyle : null);\\n  const pointStyleAccessor: PointStyleAccessor = (d, g) =>\\n    (g.specId === 'line' || g.specId === 'area') && d.y1! > threshold ? pointStyle : null;\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          areaSeriesStyle: {\\n            point: {\\n              visible: true,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        styleAccessor={hasThreshold ? barStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 1 },\\n          { x: 1, y: 6 },\\n          { x: 2, y: 2 },\\n          { x: 3, y: 5 },\\n        ]}\\n      />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        pointStyleAccessor={hasThreshold ? pointStyleAccessor : undefined}\\n        data={[\\n          { x: 0, y: 0.5 },\\n          { x: 1, y: 4 },\\n          { x: 2, y: 1 },\\n          { x: 3, y: 4 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select, color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fillOption = select(\\n    'fillColor',\\n    {\\n      None: ColorVariant.None,\\n      Series: ColorVariant.Series,\\n      Custom: 'custom',\\n    },\\n    ColorVariant.None,\\n  );\\n  const fillColor = color('custom fill color', 'aquamarine');\\n  const fill = fillOption === 'custom' ? fillColor : fillOption;\\n  const strokeOption = select(\\n    'strokeColor',\\n    {\\n      None: ColorVariant.None,\\n      Series: ColorVariant.Series,\\n      Custom: 'custom',\\n    },\\n    ColorVariant.Series,\\n  );\\n  const strokeColor = color('custom stroke color', 'aquamarine');\\n  const stroke = strokeOption === 'custom' ? strokeColor : strokeOption;\\n  const customTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill,\\n      },\\n      rectBorder: {\\n        visible: true,\\n        strokeWidth: 10,\\n        stroke,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":78},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":78}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fillOption = select(\n    'fillColor',\n    {\n      None: ColorVariant.None,\n      Series: ColorVariant.Series,\n      Custom: 'custom',\n    },\n    ColorVariant.None,\n  );\n  const fillColor = color('custom fill color', 'aquamarine');\n  const fill = fillOption === 'custom' ? fillColor : fillOption;\n  const strokeOption = select(\n    'strokeColor',\n    {\n      None: ColorVariant.None,\n      Series: ColorVariant.Series,\n      Custom: 'custom',\n    },\n    ColorVariant.Series,\n  );\n  const strokeColor = color('custom stroke color', 'aquamarine');\n  const stroke = strokeOption === 'custom' ? strokeColor : strokeOption;\n  const customTheme: PartialTheme = {\n    barSeriesStyle: {\n      rect: {\n        fill,\n      },\n      rectBorder: {\n        visible: true,\n        strokeWidth: 10,\n        stroke,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={customTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bar\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fillOption = select(\\n    'fillColor',\\n    {\\n      None: ColorVariant.None,\\n      Series: ColorVariant.Series,\\n      Custom: 'custom',\\n    },\\n    ColorVariant.None,\\n  );\\n  const fillColor = color('custom fill color', 'aquamarine');\\n  const fill = fillOption === 'custom' ? fillColor : fillOption;\\n  const strokeOption = select(\\n    'strokeColor',\\n    {\\n      None: ColorVariant.None,\\n      Series: ColorVariant.Series,\\n      Custom: 'custom',\\n    },\\n    ColorVariant.Series,\\n  );\\n  const strokeColor = color('custom stroke color', 'aquamarine');\\n  const stroke = strokeOption === 'custom' ? strokeColor : strokeOption;\\n  const customTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill,\\n      },\\n      rectBorder: {\\n        visible: true,\\n        strokeWidth: 10,\\n        stroke,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bar\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, LineSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    lineSeriesStyle: {\\n      point: {\\n        radius: 10,\\n        fill: ColorVariant.Series,\\n        stroke: ColorVariant.None,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, LineSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customTheme: PartialTheme = {\n    lineSeriesStyle: {\n      point: {\n        radius: 10,\n        fill: ColorVariant.Series,\n        stroke: ColorVariant.None,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={customTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <LineSeries\n        id=\"line\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    lineSeriesStyle: {\\n      point: {\\n        radius: 10,\\n        fill: ColorVariant.Series,\\n        stroke: ColorVariant.None,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <LineSeries\\n        id=\\\"line\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, AreaSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    areaSeriesStyle: {\\n      point: {\\n        visible: true,\\n        radius: 10,\\n        fill: ColorVariant.Series,\\n        stroke: ColorVariant.None,\\n        opacity: 0.5,\\n      },\\n      area: {\\n        opacity: 0.2,\\n      },\\n      line: {\\n        visible: false,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":60},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":60}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, AreaSeries, Chart, Position, ScaleType, Settings, PartialTheme } from '@elastic/charts';\nimport { ColorVariant } from '@elastic/charts/src/utils/common';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customTheme: PartialTheme = {\n    areaSeriesStyle: {\n      point: {\n        visible: true,\n        radius: 10,\n        fill: ColorVariant.Series,\n        stroke: ColorVariant.None,\n        opacity: 0.5,\n      },\n      area: {\n        opacity: 0.2,\n      },\n      line: {\n        visible: false,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n        theme={customTheme}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\n\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Ordinal}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g']}\n        data={TestDatasets.BARCHART_2Y1G}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customTheme: PartialTheme = {\\n    areaSeriesStyle: {\\n      point: {\\n        visible: true,\\n        radius: 10,\\n        fill: ColorVariant.Series,\\n        stroke: ColorVariant.None,\\n        opacity: 0.5,\\n      },\\n      area: {\\n        opacity: 0.2,\\n      },\\n      line: {\\n        visible: false,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n        theme={customTheme}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d: any) => Number(d).toFixed(2)} />\\n\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g']}\\n        data={TestDatasets.BARCHART_2Y1G}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { BarSeries, Chart, ScaleType, Settings, PartialTheme, Tooltip } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data2 = dg.generateSimpleSeries(40);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      bottom: 0,\\n      left: 0,\\n      top: 0,\\n      right: 0,\\n    },\\n  };\\n  return (\\n    <div>\\n      <Chart title={title} description={description} size={{ width: 100, height: 50 }}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={{ height: 50 }}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['50%', 50]}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={[undefined, 50]}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={50}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n    </div>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { BarSeries, Chart, ScaleType, Settings, PartialTheme, Tooltip } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data2 = dg.generateSimpleSeries(40);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    chartMargins: {\n      bottom: 0,\n      left: 0,\n      top: 0,\n      right: 0,\n    },\n  };\n  return (\n    <div>\n      <Chart title={title} description={description} size={{ width: 100, height: 50 }}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n      <Chart title={title} description={description} size={{ height: 50 }}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n      <Chart title={title} description={description} size={['50%', 50]}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n      <Chart title={title} description={description} size={[undefined, 50]}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n      <Chart title={title} description={description} size={50}>\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\n        <Tooltip type={TooltipType.None} />\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          data={data2}\n        />\n      </Chart>\n    </div>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      bottom: 0,\\n      left: 0,\\n      top: 0,\\n      right: 0,\\n    },\\n  };\\n  return (\\n    <div>\\n      <Chart title={title} description={description} size={{ width: 100, height: 50 }}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={{ height: 50 }}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['50%', 50]}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={[undefined, 50]}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={50}>\\n        <Settings theme={theme} baseTheme={useBaseTheme()} />\\n        <Tooltip type={TooltipType.None} />\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          data={data2}\\n        />\\n      </Chart>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color, boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  PartialTheme,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const bGColorDisabled = boolean('disable background color', false);\\n  const bgColor = color('Background color', 'rgba(255, 255, 255, 1)');\\n\\n  const theme: PartialTheme = {\\n    background: {\\n      color: bGColorDisabled ? bgColor : undefined,\\n    },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 0,\\n        fontSize: 14,\\n      },\\n      fontFamily: 'Arial',\\n      fillLabel: {\\n        fontStyle: 'italic',\\n        fontWeight: 900,\\n        valueFont: {\\n          fontFamily: 'Menlo',\\n          fontStyle: 'normal',\\n          fontWeight: 100,\\n        },\\n      },\\n      minFontSize: 1,\\n      idealFontSizeJump: 1.1,\\n      outerSizeRatio: 1,\\n      emptySizeRatio: 0,\\n      circlePadding: 4,\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.miniSunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":33},\"endLoc\":{\"col\":1,\"line\":100},\"startBody\":{\"col\":36,\"line\":33},\"endBody\":{\"col\":1,\"line\":100}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color, boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  PartialTheme,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const bGColorDisabled = boolean('disable background color', false);\n  const bgColor = color('Background color', 'rgba(255, 255, 255, 1)');\n\n  const theme: PartialTheme = {\n    background: {\n      color: bGColorDisabled ? bgColor : undefined,\n    },\n    partition: {\n      linkLabel: {\n        maxCount: 0,\n        fontSize: 14,\n      },\n      fontFamily: 'Arial',\n      fillLabel: {\n        fontStyle: 'italic',\n        fontWeight: 900,\n        valueFont: {\n          fontFamily: 'Menlo',\n          fontStyle: 'normal',\n          fontWeight: 100,\n        },\n      },\n      minFontSize: 1,\n      idealFontSizeJump: 1.1,\n      outerSizeRatio: 1,\n      emptySizeRatio: 0,\n      circlePadding: 4,\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.miniSunburst}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: any) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (d: any) => regionLookup[d].regionName,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node) =>\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const bGColorDisabled = boolean('disable background color', false);\\n  const bgColor = color('Background color', 'rgba(255, 255, 255, 1)');\\n\\n  const theme: PartialTheme = {\\n    background: {\\n      color: bGColorDisabled ? bgColor : undefined,\\n    },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 0,\\n        fontSize: 14,\\n      },\\n      fontFamily: 'Arial',\\n      fillLabel: {\\n        fontStyle: 'italic',\\n        fontWeight: 900,\\n        valueFont: {\\n          fontFamily: 'Menlo',\\n          fontStyle: 'normal',\\n          fontWeight: 100,\\n        },\\n      },\\n      minFontSize: 1,\\n      idealFontSizeJump: 1.1,\\n      outerSizeRatio: 1,\\n      emptySizeRatio: 0,\\n      circlePadding: 4,\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.miniSunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: any) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) =>\\n                discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const partialCustomTheme = {\\n    background: {\\n      color: color('Change background container color', '#1c1c24'),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={partialCustomTheme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const partialCustomTheme = {\n    background: {\n      color: color('Change background container color', '#1c1c24'),\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={partialCustomTheme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const partialCustomTheme = {\\n    background: {\\n      color: color('Change background container color', '#1c1c24'),\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={partialCustomTheme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  CurveType,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  Tooltip,\\n  TooltipType,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\nconst data2 = dg.generateSimpleSeries(40);\\nconst data3 = dg.generateSimpleSeries(40);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const hideBars = boolean('Hide Bars', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={boolean('Debug', false)} showLegend showLegendExtra />\\n      <Tooltip type={TooltipType.Crosshairs} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      {!hideBars && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          splitSeriesAccessors={['g']}\\n          stackAccessors={['x']}\\n          data={data1}\\n        />\\n      )}\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  theme: { default: 'dark' },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":78},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":78}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  CurveType,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n  Tooltip,\n  TooltipType,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\nconst data2 = dg.generateSimpleSeries(40);\nconst data3 = dg.generateSimpleSeries(40);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const hideBars = boolean('Hide Bars', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} debug={boolean('Debug', false)} showLegend showLegendExtra />\n      <Tooltip type={TooltipType.Crosshairs} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      {!hideBars && (\n        <BarSeries\n          id=\"bars\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          splitSeriesAccessors={['g']}\n          stackAccessors={['x']}\n          data={data1}\n        />\n      )}\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={data2}\n      />\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  theme: { default: 'dark' },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const hideBars = boolean('Hide Bars', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} debug={boolean('Debug', false)} showLegend showLegendExtra />\\n      <Tooltip type={TooltipType.Crosshairs} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      {!hideBars && (\\n        <BarSeries\\n          id=\\\"bars\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          splitSeriesAccessors={['g']}\\n          stackAccessors={['x']}\\n          data={data1}\\n        />\\n      )}\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { array, boolean, color, number, text } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  CurveType,\\n  Position,\\n  ScaleType,\\n  TexturedStyles,\\n  Settings,\\n  TextureShape,\\n  LIGHT_THEME,\\n  SeriesType,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst dg = new SeededDataGenerator();\\nconst barData = dg.generateBasicSeries(4);\\nconst areaData = dg.generateBasicSeries(20, 10);\\n\\nconst group = {\\n  texture: 'Texture',\\n  pattern: 'Pattern',\\n  series: 'Series',\\n};\\nconst STAR =\\n  'M -7.75 -2.5 l 5.9 0 l 1.85 -6.1 l 1.85 6.1 l 5.9 0 l -4.8 3.8 l 1.85 6.1 l -4.8 -3.8 l -4.8 3.8 l 1.85 -6.1 l -4.8 -3.8 z';\\nconst DEFAULT_COLOR = LIGHT_THEME.colors.vizColors[0];\\n\\nconst getTextureKnobs = (useCustomPath: boolean): TexturedStyles => ({\\n  ...(useCustomPath\\n    ? { path: text('Custom path', STAR, group.texture) }\\n    : {\\n        shape: customKnobs.fromEnum('Shape', TextureShape, TextureShape.Line, {\\n          group: group.texture,\\n        }),\\n      }),\\n  stroke: boolean('Use stroke color', true, group.texture)\\n    ? color('Stoke color', DEFAULT_COLOR, group.texture)\\n    : undefined,\\n  strokeWidth: number('Stroke width', 1, { min: 0, max: 10, step: 0.5 }, group.texture),\\n  dash: array('Stroke dash', [], ',', group.texture).map((n) => parseInt(n, 10)),\\n  fill: boolean('Use fill color', true, group.texture) ? color('Fill color', DEFAULT_COLOR, group.texture) : undefined,\\n  rotation: number('Rotation (degrees)', 45, { min: -365, max: 365 }, group.pattern),\\n  opacity: number('Opacity', 1, { min: 0, max: 1, step: 0.1 }, group.texture),\\n  shapeRotation: number('Shape rotation (degrees)', 0, { min: -365, max: 365 }, group.texture),\\n  size: useCustomPath\\n    ? number('Shape size - custom path', 20, { min: 0 }, group.texture)\\n    : number('Shape size', 20, { min: 0 }, group.texture),\\n  spacing: {\\n    x: number('Shape spacing - x', 10, { min: 0 }, group.pattern),\\n    y: number('Shape spacing - y', 0, { min: 0 }, group.pattern),\\n  },\\n  offset: {\\n    x: number('Pattern offset - x', 0, {}, group.pattern),\\n    y: number('Pattern offset - y', 0, {}, group.pattern),\\n    global: boolean('Apply offset along global coordinate axes', true, group.pattern),\\n  },\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useCustomPath = boolean('Use custom path', false, group.texture);\\n  const texture: TexturedStyles = getTextureKnobs(useCustomPath);\\n  const opacity = number('Series opacity', 1, { min: 0, max: 1, step: 0.1 }, group.series);\\n  const showFill = boolean('Show series fill', false, group.series);\\n  const seriesColor = color('Series color', DEFAULT_COLOR, group.series);\\n  const [Series, seriesType] = customKnobs.enum.xySeries('Series type', 'area', {\\n    group: group.series,\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          areaSeriesStyle: {\\n            area: {\\n              texture,\\n              opacity,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n          },\\n          barSeriesStyle: {\\n            rect: {\\n              fill: showFill ? undefined : 'transparent',\\n              opacity,\\n              texture,\\n            },\\n            rectBorder: {\\n              visible: true,\\n              strokeWidth: 2,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <Series\\n        id=\\\"series\\\"\\n        color={seriesColor}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={seriesType === 'bar' ? barData : areaData}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":74},\"endLoc\":{\"col\":1,\"line\":126},\"startBody\":{\"col\":36,\"line\":74},\"endBody\":{\"col\":1,\"line\":126}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { array, boolean, color, number, text } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  CurveType,\n  Position,\n  ScaleType,\n  TexturedStyles,\n  Settings,\n  TextureShape,\n  LIGHT_THEME,\n  SeriesType,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst dg = new SeededDataGenerator();\nconst barData = dg.generateBasicSeries(4);\nconst areaData = dg.generateBasicSeries(20, 10);\n\nconst group = {\n  texture: 'Texture',\n  pattern: 'Pattern',\n  series: 'Series',\n};\nconst STAR =\n  'M -7.75 -2.5 l 5.9 0 l 1.85 -6.1 l 1.85 6.1 l 5.9 0 l -4.8 3.8 l 1.85 6.1 l -4.8 -3.8 l -4.8 3.8 l 1.85 -6.1 l -4.8 -3.8 z';\nconst DEFAULT_COLOR = LIGHT_THEME.colors.vizColors[0];\n\nconst getTextureKnobs = (useCustomPath: boolean): TexturedStyles => ({\n  ...(useCustomPath\n    ? { path: text('Custom path', STAR, group.texture) }\n    : {\n        shape: customKnobs.fromEnum('Shape', TextureShape, TextureShape.Line, {\n          group: group.texture,\n        }),\n      }),\n  stroke: boolean('Use stroke color', true, group.texture)\n    ? color('Stoke color', DEFAULT_COLOR, group.texture)\n    : undefined,\n  strokeWidth: number('Stroke width', 1, { min: 0, max: 10, step: 0.5 }, group.texture),\n  dash: array('Stroke dash', [], ',', group.texture).map((n) => parseInt(n, 10)),\n  fill: boolean('Use fill color', true, group.texture) ? color('Fill color', DEFAULT_COLOR, group.texture) : undefined,\n  rotation: number('Rotation (degrees)', 45, { min: -365, max: 365 }, group.pattern),\n  opacity: number('Opacity', 1, { min: 0, max: 1, step: 0.1 }, group.texture),\n  shapeRotation: number('Shape rotation (degrees)', 0, { min: -365, max: 365 }, group.texture),\n  size: useCustomPath\n    ? number('Shape size - custom path', 20, { min: 0 }, group.texture)\n    : number('Shape size', 20, { min: 0 }, group.texture),\n  spacing: {\n    x: number('Shape spacing - x', 10, { min: 0 }, group.pattern),\n    y: number('Shape spacing - y', 0, { min: 0 }, group.pattern),\n  },\n  offset: {\n    x: number('Pattern offset - x', 0, {}, group.pattern),\n    y: number('Pattern offset - y', 0, {}, group.pattern),\n    global: boolean('Apply offset along global coordinate axes', true, group.pattern),\n  },\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useCustomPath = boolean('Use custom path', false, group.texture);\n  const texture: TexturedStyles = getTextureKnobs(useCustomPath);\n  const opacity = number('Series opacity', 1, { min: 0, max: 1, step: 0.1 }, group.series);\n  const showFill = boolean('Show series fill', false, group.series);\n  const seriesColor = color('Series color', DEFAULT_COLOR, group.series);\n  const [Series, seriesType] = customKnobs.enum.xySeries('Series type', 'area', {\n    group: group.series,\n    exclude: [SeriesType.Bubble, SeriesType.Line],\n  });\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          areaSeriesStyle: {\n            area: {\n              texture,\n              opacity,\n              fill: showFill ? undefined : 'transparent',\n            },\n          },\n          barSeriesStyle: {\n            rect: {\n              fill: showFill ? undefined : 'transparent',\n              opacity,\n              texture,\n            },\n            rectBorder: {\n              visible: true,\n              strokeWidth: 2,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <Series\n        id=\"series\"\n        color={seriesColor}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={seriesType === 'bar' ? barData : areaData}\n        curve={CurveType.CURVE_MONOTONE_X}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useCustomPath = boolean('Use custom path', false, group.texture);\\n  const texture: TexturedStyles = getTextureKnobs(useCustomPath);\\n  const opacity = number('Series opacity', 1, { min: 0, max: 1, step: 0.1 }, group.series);\\n  const showFill = boolean('Show series fill', false, group.series);\\n  const seriesColor = color('Series color', DEFAULT_COLOR, group.series);\\n  const [Series, seriesType] = customKnobs.enum.xySeries('Series type', 'area', {\\n    group: group.series,\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          areaSeriesStyle: {\\n            area: {\\n              texture,\\n              opacity,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n          },\\n          barSeriesStyle: {\\n            rect: {\\n              fill: showFill ? undefined : 'transparent',\\n              opacity,\\n              texture,\\n            },\\n            rectBorder: {\\n              visible: true,\\n              strokeWidth: 2,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <Series\\n        id=\\\"series\\\"\\n        color={seriesColor}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={seriesType === 'bar' ? barData : areaData}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, button } from '@storybook/addon-knobs';\\nimport React, { useState } from 'react';\\n\\nimport { Axis, Chart, CurveType, Position, TexturedStyles, Settings, TextureShape, SeriesType } from '@elastic/charts';\\nimport { getRandomNumberGenerator, SeededDataGenerator, getRandomEntryFn } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nconst group = {\\n  random: 'Randomized parameters',\\n  default: 'Default parameters',\\n};\\nconst dg = new SeededDataGenerator();\\nconst rng = getRandomNumberGenerator();\\nconst getRandomEntry = getRandomEntryFn();\\n\\ninterface Random {\\n  shape: boolean;\\n  rotation: boolean;\\n  shapeRotation: boolean;\\n  size: boolean;\\n  spacing: {\\n    x: boolean;\\n    y: boolean;\\n  };\\n  offset: {\\n    x: boolean;\\n    y: boolean;\\n  };\\n}\\n\\nconst getDefaultTextureKnobs = (): TexturedStyles => ({\\n  shape: customKnobs.fromEnum('Shape', TextureShape, TextureShape.Circle, {\\n    group: group.default,\\n  }),\\n  strokeWidth: number('Stroke width', 1, { min: 0, max: 10, step: 0.5 }, group.default),\\n  rotation: number('Rotation (degrees)', 45, { min: -365, max: 365 }, group.default),\\n  shapeRotation: number('Shape rotation (degrees)', 0, { min: -365, max: 365 }, group.default),\\n  size: number('Shape size', 20, { min: 0 }, group.default),\\n  opacity: number('Opacity', 1, { min: 0, max: 1, step: 0.1 }, group.default),\\n  spacing: {\\n    x: number('Shape spacing - x', 10, { min: 0 }, group.default),\\n    y: number('Shape spacing - y', 10, { min: 0 }, group.default),\\n  },\\n  offset: {\\n    x: number('Pattern offset - x', 0, {}, group.default),\\n    y: number('Pattern offset - y', 0, {}, group.default),\\n    global: true,\\n  },\\n});\\n\\nconst getRandomKnobs = (): Random => ({\\n  shape: boolean('Shape', true, group.random),\\n  rotation: boolean('Rotation', false, group.random),\\n  shapeRotation: boolean('Shape rotation', false, group.random),\\n  size: boolean('Size', true, group.random),\\n  spacing: {\\n    x: boolean('X spacing', false, group.random),\\n    y: boolean('Y spacing', false, group.random),\\n  },\\n  offset: {\\n    x: boolean('X offset', false, group.random),\\n    y: boolean('Y offset', false, group.random),\\n  },\\n});\\n\\nconst getTexture = (randomize: Random): Partial<TexturedStyles> => ({\\n  shape: randomize.shape ? getRandomEntry(TextureShape) : undefined,\\n  rotation: randomize.rotation ? rng(0, 365) : undefined,\\n  shapeRotation: randomize.shapeRotation ? rng(0, 365) : undefined,\\n  size: randomize.size ? rng(5, 30) : undefined,\\n  spacing: {\\n    x: randomize.spacing.x ? rng(0, 30) : undefined,\\n    y: randomize.spacing.y ? rng(0, 30) : undefined,\\n  },\\n  offset: {\\n    x: randomize.offset.x ? rng(0, 30) : undefined,\\n    y: randomize.offset.y ? rng(0, 30) : undefined,\\n  },\\n});\\n\\nconst data = new Array(10).fill(0).map(() => dg.generateBasicSeries(10, 10));\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const [count, setCount] = useState(0);\\n  button('Randomize', () => setCount((i) => i + 1), group.random);\\n  const n = number('Total series', 4, { min: 0, max: 10, step: 1 }) ?? 2;\\n  const showLegend = boolean('Show legend', false);\\n  const showFill = boolean('Show series fill', false);\\n  const chartColor = color('Chart color', 'rgba(0,0,0,1)');\\n  const random = getRandomKnobs();\\n  const [Series] = customKnobs.enum.xySeries('Series type', 'area', {\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n  const texture = getDefaultTextureKnobs();\\n\\n  return (\\n    <Chart title={title} description={description} data-count={count}>\\n      <Settings\\n        showLegend={showLegend}\\n        theme={{\\n          areaSeriesStyle: {\\n            area: {\\n              texture,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n          },\\n          barSeriesStyle: {\\n            rect: {\\n              texture,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n            rectBorder: {\\n              visible: true,\\n              strokeWidth: 2,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} />\\n\\n      {new Array(n).fill(0).map((v, i) => (\\n        <Series\\n          key={i}\\n          id={`series-${i}`}\\n          areaSeriesStyle={{\\n            area: {\\n              texture: getTexture(random),\\n            },\\n          }}\\n          barSeriesStyle={{\\n            rect: {\\n              texture: getTexture(random),\\n            },\\n          }}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          color={chartColor}\\n          stackAccessors={['yes']}\\n          data={data[i]}\\n          curve={CurveType.CURVE_MONOTONE_X}\\n        />\\n      ))}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":94},\"endLoc\":{\"col\":1,\"line\":159},\"startBody\":{\"col\":36,\"line\":94},\"endBody\":{\"col\":1,\"line\":159}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, button } from '@storybook/addon-knobs';\nimport React, { useState } from 'react';\n\nimport { Axis, Chart, CurveType, Position, TexturedStyles, Settings, TextureShape, SeriesType } from '@elastic/charts';\nimport { getRandomNumberGenerator, SeededDataGenerator, getRandomEntryFn } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nconst group = {\n  random: 'Randomized parameters',\n  default: 'Default parameters',\n};\nconst dg = new SeededDataGenerator();\nconst rng = getRandomNumberGenerator();\nconst getRandomEntry = getRandomEntryFn();\n\ninterface Random {\n  shape: boolean;\n  rotation: boolean;\n  shapeRotation: boolean;\n  size: boolean;\n  spacing: {\n    x: boolean;\n    y: boolean;\n  };\n  offset: {\n    x: boolean;\n    y: boolean;\n  };\n}\n\nconst getDefaultTextureKnobs = (): TexturedStyles => ({\n  shape: customKnobs.fromEnum('Shape', TextureShape, TextureShape.Circle, {\n    group: group.default,\n  }),\n  strokeWidth: number('Stroke width', 1, { min: 0, max: 10, step: 0.5 }, group.default),\n  rotation: number('Rotation (degrees)', 45, { min: -365, max: 365 }, group.default),\n  shapeRotation: number('Shape rotation (degrees)', 0, { min: -365, max: 365 }, group.default),\n  size: number('Shape size', 20, { min: 0 }, group.default),\n  opacity: number('Opacity', 1, { min: 0, max: 1, step: 0.1 }, group.default),\n  spacing: {\n    x: number('Shape spacing - x', 10, { min: 0 }, group.default),\n    y: number('Shape spacing - y', 10, { min: 0 }, group.default),\n  },\n  offset: {\n    x: number('Pattern offset - x', 0, {}, group.default),\n    y: number('Pattern offset - y', 0, {}, group.default),\n    global: true,\n  },\n});\n\nconst getRandomKnobs = (): Random => ({\n  shape: boolean('Shape', true, group.random),\n  rotation: boolean('Rotation', false, group.random),\n  shapeRotation: boolean('Shape rotation', false, group.random),\n  size: boolean('Size', true, group.random),\n  spacing: {\n    x: boolean('X spacing', false, group.random),\n    y: boolean('Y spacing', false, group.random),\n  },\n  offset: {\n    x: boolean('X offset', false, group.random),\n    y: boolean('Y offset', false, group.random),\n  },\n});\n\nconst getTexture = (randomize: Random): Partial<TexturedStyles> => ({\n  shape: randomize.shape ? getRandomEntry(TextureShape) : undefined,\n  rotation: randomize.rotation ? rng(0, 365) : undefined,\n  shapeRotation: randomize.shapeRotation ? rng(0, 365) : undefined,\n  size: randomize.size ? rng(5, 30) : undefined,\n  spacing: {\n    x: randomize.spacing.x ? rng(0, 30) : undefined,\n    y: randomize.spacing.y ? rng(0, 30) : undefined,\n  },\n  offset: {\n    x: randomize.offset.x ? rng(0, 30) : undefined,\n    y: randomize.offset.y ? rng(0, 30) : undefined,\n  },\n});\n\nconst data = new Array(10).fill(0).map(() => dg.generateBasicSeries(10, 10));\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const [count, setCount] = useState(0);\n  button('Randomize', () => setCount((i) => i + 1), group.random);\n  const n = number('Total series', 4, { min: 0, max: 10, step: 1 }) ?? 2;\n  const showLegend = boolean('Show legend', false);\n  const showFill = boolean('Show series fill', false);\n  const chartColor = color('Chart color', 'rgba(0,0,0,1)');\n  const random = getRandomKnobs();\n  const [Series] = customKnobs.enum.xySeries('Series type', 'area', {\n    exclude: [SeriesType.Bubble, SeriesType.Line],\n  });\n  const texture = getDefaultTextureKnobs();\n\n  return (\n    <Chart title={title} description={description} data-count={count}>\n      <Settings\n        showLegend={showLegend}\n        theme={{\n          areaSeriesStyle: {\n            area: {\n              texture,\n              fill: showFill ? undefined : 'transparent',\n            },\n          },\n          barSeriesStyle: {\n            rect: {\n              texture,\n              fill: showFill ? undefined : 'transparent',\n            },\n            rectBorder: {\n              visible: true,\n              strokeWidth: 2,\n            },\n          },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" position={Position.Left} />\n\n      {new Array(n).fill(0).map((v, i) => (\n        <Series\n          key={i}\n          id={`series-${i}`}\n          areaSeriesStyle={{\n            area: {\n              texture: getTexture(random),\n            },\n          }}\n          barSeriesStyle={{\n            rect: {\n              texture: getTexture(random),\n            },\n          }}\n          xAccessor=\"x\"\n          yAccessors={['y']}\n          color={chartColor}\n          stackAccessors={['yes']}\n          data={data[i]}\n          curve={CurveType.CURVE_MONOTONE_X}\n        />\n      ))}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const [count, setCount] = useState(0);\\n  button('Randomize', () => setCount((i) => i + 1), group.random);\\n  const n = number('Total series', 4, { min: 0, max: 10, step: 1 }) ?? 2;\\n  const showLegend = boolean('Show legend', false);\\n  const showFill = boolean('Show series fill', false);\\n  const chartColor = color('Chart color', 'rgba(0,0,0,1)');\\n  const random = getRandomKnobs();\\n  const [Series] = customKnobs.enum.xySeries('Series type', 'area', {\\n    exclude: [SeriesType.Bubble, SeriesType.Line],\\n  });\\n  const texture = getDefaultTextureKnobs();\\n\\n  return (\\n    <Chart title={title} description={description} data-count={count}>\\n      <Settings\\n        showLegend={showLegend}\\n        theme={{\\n          areaSeriesStyle: {\\n            area: {\\n              texture,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n          },\\n          barSeriesStyle: {\\n            rect: {\\n              texture,\\n              fill: showFill ? undefined : 'transparent',\\n            },\\n            rectBorder: {\\n              visible: true,\\n              strokeWidth: 2,\\n            },\\n          },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} />\\n\\n      {new Array(n).fill(0).map((v, i) => (\\n        <Series\\n          key={i}\\n          id={`series-${i}`}\\n          areaSeriesStyle={{\\n            area: {\\n              texture: getTexture(random),\\n            },\\n          }}\\n          barSeriesStyle={{\\n            rect: {\\n              texture: getTexture(random),\\n            },\\n          }}\\n          xAccessor=\\\"x\\\"\\n          yAccessors={['y']}\\n          color={chartColor}\\n          stackAccessors={['yes']}\\n          data={data[i]}\\n          curve={CurveType.CURVE_MONOTONE_X}\\n        />\\n      ))}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  Chart,\\n  Position,\\n  Settings,\\n  AreaSeries,\\n  LineSeries,\\n  BubbleSeries,\\n  ScaleType,\\n  PointShape,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const shapeKnobArea = select(\\n    'area series marker shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobArea = color('area series stroke color', '#54B399');\\n  const fillKnobArea = color('area series fill color', 'white');\\n\\n  const shapeKnobLine = select(\\n    'line series marker shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobLine = color('line series stroke color', '#6092C0');\\n  const fillKnobLine = color('line series fill color', 'white');\\n\\n  const shapeKnobBubble = select(\\n    'bubble marker series shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobBubble = color('bubble series stroke color', '#D36086');\\n  const fillKnobBubble = color('bubble series fill color', 'white');\\n\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} showLegend />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        areaSeriesStyle={{\\n          point: {\\n            shape: shapeKnobArea,\\n            stroke: strokeKnobArea,\\n            fill: fillKnobArea,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 2.5 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        lineSeriesStyle={{\\n          point: {\\n            radius: 20,\\n            shape: shapeKnobLine,\\n            stroke: strokeKnobLine,\\n            fill: fillKnobLine,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 2.8 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        bubbleSeriesStyle={{\\n          point: {\\n            radius: 20,\\n            shape: shapeKnobBubble,\\n            stroke: strokeKnobBubble,\\n            fill: fillKnobBubble,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 5 },\\n          { x: 1, y: 8 },\\n          { x: 2, y: 9 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":121},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":121}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  Chart,\n  Position,\n  Settings,\n  AreaSeries,\n  LineSeries,\n  BubbleSeries,\n  ScaleType,\n  PointShape,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const shapeKnobArea = select(\n    'area series marker shape',\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\n    PointShape.Circle,\n  );\n  const strokeKnobArea = color('area series stroke color', '#54B399');\n  const fillKnobArea = color('area series fill color', 'white');\n\n  const shapeKnobLine = select(\n    'line series marker shape',\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\n    PointShape.Circle,\n  );\n  const strokeKnobLine = color('line series stroke color', '#6092C0');\n  const fillKnobLine = color('line series fill color', 'white');\n\n  const shapeKnobBubble = select(\n    'bubble marker series shape',\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\n    PointShape.Circle,\n  );\n  const strokeKnobBubble = color('bubble series stroke color', '#D36086');\n  const fillKnobBubble = color('bubble series fill color', 'white');\n\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings baseTheme={useBaseTheme()} showLegend />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <AreaSeries\n        id=\"areas\"\n        areaSeriesStyle={{\n          point: {\n            shape: shapeKnobArea,\n            stroke: strokeKnobArea,\n            fill: fillKnobArea,\n          },\n        }}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={[\n          { x: 0, y: 2.5 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n      <LineSeries\n        id=\"lines\"\n        lineSeriesStyle={{\n          point: {\n            radius: 20,\n            shape: shapeKnobLine,\n            stroke: strokeKnobLine,\n            fill: fillKnobLine,\n          },\n        }}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={[\n          { x: 0, y: 2.8 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n      <BubbleSeries\n        id=\"bubbles\"\n        bubbleSeriesStyle={{\n          point: {\n            radius: 20,\n            shape: shapeKnobBubble,\n            stroke: strokeKnobBubble,\n            fill: fillKnobBubble,\n          },\n        }}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        data={[\n          { x: 0, y: 5 },\n          { x: 1, y: 8 },\n          { x: 2, y: 9 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const shapeKnobArea = select(\\n    'area series marker shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobArea = color('area series stroke color', '#54B399');\\n  const fillKnobArea = color('area series fill color', 'white');\\n\\n  const shapeKnobLine = select(\\n    'line series marker shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobLine = color('line series stroke color', '#6092C0');\\n  const fillKnobLine = color('line series fill color', 'white');\\n\\n  const shapeKnobBubble = select(\\n    'bubble marker series shape',\\n    ['circle', 'diamond', 'square', 'triangle', 'plus', 'x'],\\n    PointShape.Circle,\\n  );\\n  const strokeKnobBubble = color('bubble series stroke color', '#D36086');\\n  const fillKnobBubble = color('bubble series fill color', 'white');\\n\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings baseTheme={useBaseTheme()} showLegend />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        areaSeriesStyle={{\\n          point: {\\n            shape: shapeKnobArea,\\n            stroke: strokeKnobArea,\\n            fill: fillKnobArea,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 2.5 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        lineSeriesStyle={{\\n          point: {\\n            radius: 20,\\n            shape: shapeKnobLine,\\n            stroke: strokeKnobLine,\\n            fill: fillKnobLine,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 2.8 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n      <BubbleSeries\\n        id=\\\"bubbles\\\"\\n        bubbleSeriesStyle={{\\n          point: {\\n            radius: 20,\\n            shape: shapeKnobBubble,\\n            stroke: strokeKnobBubble,\\n            fill: fillKnobBubble,\\n          },\\n        }}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        data={[\\n          { x: 0, y: 5 },\\n          { x: 1, y: 8 },\\n          { x: 2, y: 9 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  LineSeries,\\n  Axis,\\n  Chart,\\n  ColorVariant,\\n  Position,\\n  ScaleType,\\n  Settings,\\n  timeFormatter,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dateFormatter = timeFormatter('HH:mm');\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendSize={100}\\n      pointBuffer={Infinity}\\n      legendPosition={Position.Right}\\n      baseTheme={useBaseTheme()}\\n      theme={{\\n        highlighter: {\\n          point: {\\n            radius: 4,\\n            opacity: 1,\\n            fill: ColorVariant.Series,\\n            stroke: ColorVariant.None,\\n            strokeWidth: 0,\\n          },\\n        },\\n      }}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n      timeAxisLayerCount={2}\\n      gridLine={{\\n        visible: true,\\n      }}\\n      style={{\\n        tickLine: { size: 0.0001, padding: 4 },\\n        tickLabel: {\\n          alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n          padding: 0,\\n          offset: { x: 0, y: 0 },\\n        },\\n      }}\\n    />\\n    <Tooltip customTooltip={() => null} />\\n    <Axis\\n      id=\\\"left\\\"\\n      position={Position.Left}\\n      gridLine={{\\n        visible: true,\\n      }}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      labelFormat={(d) => Number(d).toFixed(0)}\\n      ticks={5}\\n    />\\n    <LineSeries\\n      id=\\\"1\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n    <LineSeries\\n      id=\\\"2\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n    <LineSeries\\n      id=\\\"3\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":29},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":29},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  LineSeries,\n  Axis,\n  Chart,\n  ColorVariant,\n  Position,\n  ScaleType,\n  Settings,\n  timeFormatter,\n  Tooltip,\n} from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dateFormatter = timeFormatter('HH:mm');\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      showLegend\n      showLegendExtra\n      legendSize={100}\n      pointBuffer={Infinity}\n      legendPosition={Position.Right}\n      baseTheme={useBaseTheme()}\n      theme={{\n        highlighter: {\n          point: {\n            radius: 4,\n            opacity: 1,\n            fill: ColorVariant.Series,\n            stroke: ColorVariant.None,\n            strokeWidth: 0,\n          },\n        },\n      }}\n    />\n    <Axis\n      id=\"bottom\"\n      position={Position.Bottom}\n      showOverlappingTicks\n      tickFormat={dateFormatter}\n      timeAxisLayerCount={2}\n      gridLine={{\n        visible: true,\n      }}\n      style={{\n        tickLine: { size: 0.0001, padding: 4 },\n        tickLabel: {\n          alignment: { horizontal: Position.Left, vertical: Position.Bottom },\n          padding: 0,\n          offset: { x: 0, y: 0 },\n        },\n      }}\n    />\n    <Tooltip customTooltip={() => null} />\n    <Axis\n      id=\"left\"\n      position={Position.Left}\n      gridLine={{\n        visible: true,\n      }}\n      tickFormat={(d) => Number(d).toFixed(2)}\n      labelFormat={(d) => Number(d).toFixed(0)}\n      ticks={5}\n    />\n    <LineSeries\n      id=\"1\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      yNice\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\n      lineSeriesStyle={{\n        point: {\n          visible: false,\n        },\n      }}\n    />\n    <LineSeries\n      id=\"2\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      yNice\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\n      lineSeriesStyle={{\n        point: {\n          visible: false,\n        },\n      }}\n    />\n    <LineSeries\n      id=\"3\"\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\n      xScaleType={ScaleType.Time}\n      yScaleType={ScaleType.Linear}\n      xAccessor={0}\n      yAccessors={[1]}\n      stackAccessors={[0]}\n      yNice\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      lineSeriesStyle={{\n        point: {\n          visible: false,\n        },\n      }}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      showLegend\\n      showLegendExtra\\n      legendSize={100}\\n      pointBuffer={Infinity}\\n      legendPosition={Position.Right}\\n      baseTheme={useBaseTheme()}\\n      theme={{\\n        highlighter: {\\n          point: {\\n            radius: 4,\\n            opacity: 1,\\n            fill: ColorVariant.Series,\\n            stroke: ColorVariant.None,\\n            strokeWidth: 0,\\n          },\\n        },\\n      }}\\n    />\\n    <Axis\\n      id=\\\"bottom\\\"\\n      position={Position.Bottom}\\n      showOverlappingTicks\\n      tickFormat={dateFormatter}\\n      timeAxisLayerCount={2}\\n      gridLine={{\\n        visible: true,\\n      }}\\n      style={{\\n        tickLine: { size: 0.0001, padding: 4 },\\n        tickLabel: {\\n          alignment: { horizontal: Position.Left, vertical: Position.Bottom },\\n          padding: 0,\\n          offset: { x: 0, y: 0 },\\n        },\\n      }}\\n    />\\n    <Tooltip customTooltip={() => null} />\\n    <Axis\\n      id=\\\"left\\\"\\n      position={Position.Left}\\n      gridLine={{\\n        visible: true,\\n      }}\\n      tickFormat={(d) => Number(d).toFixed(2)}\\n      labelFormat={(d) => Number(d).toFixed(0)}\\n      ticks={5}\\n    />\\n    <LineSeries\\n      id=\\\"1\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v3.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v3.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n    <LineSeries\\n      id=\\\"2\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v2.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v2.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n    <LineSeries\\n      id=\\\"3\\\"\\n      name={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.label}\\n      xScaleType={ScaleType.Time}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor={0}\\n      yAccessors={[1]}\\n      stackAccessors={[0]}\\n      yNice\\n      data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      lineSeriesStyle={{\\n        point: {\\n          visible: false,\\n        },\\n      }}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      left: range('margin left', 0, 50, 10),\\n      right: range('margin right', 0, 50, 10),\\n      top: range('margin top', 0, 50, 10),\\n      bottom: range('margin bottom', 0, 50, 10),\\n    },\\n    chartPaddings: {\\n      left: range('padding left', 0, 50, 10),\\n      right: range('padding right', 0, 50, 10),\\n      top: range('padding top', 0, 50, 10),\\n      bottom: range('padding bottom', 0, 50, 10),\\n    },\\n    scales: {\\n      barsPadding: range('bar padding', 0, 1, 0.1, undefined, 0.01),\\n    },\\n  };\\n  const withLeftTitle = boolean('left axis with title', true);\\n  const withBottomTitle = boolean('bottom axis with title', true);\\n  const withRightTitle = boolean('right axis with title', true);\\n  const withTopTitle = boolean('top axis with title', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title={withBottomTitle ? 'Bottom axis' : undefined}\\n        showOverlappingTicks\\n        gridLine={{\\n          visible: boolean('show bottom axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title={withLeftTitle ? 'Left axis' : undefined}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          visible: boolean('show left axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title={withTopTitle ? 'Top axis' : undefined}\\n        showOverlappingTicks\\n        gridLine={{\\n          visible: boolean('show top axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title={withRightTitle ? 'Right axis' : undefined}\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          visible: boolean('show right axis grid lines', false),\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":114},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":114}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    chartMargins: {\n      left: range('margin left', 0, 50, 10),\n      right: range('margin right', 0, 50, 10),\n      top: range('margin top', 0, 50, 10),\n      bottom: range('margin bottom', 0, 50, 10),\n    },\n    chartPaddings: {\n      left: range('padding left', 0, 50, 10),\n      right: range('padding right', 0, 50, 10),\n      top: range('padding top', 0, 50, 10),\n      bottom: range('padding bottom', 0, 50, 10),\n    },\n    scales: {\n      barsPadding: range('bar padding', 0, 1, 0.1, undefined, 0.01),\n    },\n  };\n  const withLeftTitle = boolean('left axis with title', true);\n  const withBottomTitle = boolean('bottom axis with title', true);\n  const withRightTitle = boolean('right axis with title', true);\n  const withTopTitle = boolean('top axis with title', true);\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', true)}\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n      />\n      <Axis\n        id=\"bottom\"\n        position={Position.Bottom}\n        title={withBottomTitle ? 'Bottom axis' : undefined}\n        showOverlappingTicks\n        gridLine={{\n          visible: boolean('show bottom axis grid lines', false),\n        }}\n      />\n      <Axis\n        id=\"left2\"\n        title={withLeftTitle ? 'Left axis' : undefined}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        gridLine={{\n          visible: boolean('show left axis grid lines', false),\n        }}\n      />\n      <Axis\n        id=\"top\"\n        position={Position.Top}\n        title={withTopTitle ? 'Top axis' : undefined}\n        showOverlappingTicks\n        gridLine={{\n          visible: boolean('show top axis grid lines', false),\n        }}\n      />\n      <Axis\n        id=\"right\"\n        title={withRightTitle ? 'Right axis' : undefined}\n        position={Position.Right}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        gridLine={{\n          visible: boolean('show right axis grid lines', false),\n        }}\n      />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      left: range('margin left', 0, 50, 10),\\n      right: range('margin right', 0, 50, 10),\\n      top: range('margin top', 0, 50, 10),\\n      bottom: range('margin bottom', 0, 50, 10),\\n    },\\n    chartPaddings: {\\n      left: range('padding left', 0, 50, 10),\\n      right: range('padding right', 0, 50, 10),\\n      top: range('padding top', 0, 50, 10),\\n      bottom: range('padding bottom', 0, 50, 10),\\n    },\\n    scales: {\\n      barsPadding: range('bar padding', 0, 1, 0.1, undefined, 0.01),\\n    },\\n  };\\n  const withLeftTitle = boolean('left axis with title', true);\\n  const withBottomTitle = boolean('bottom axis with title', true);\\n  const withRightTitle = boolean('right axis with title', true);\\n  const withTopTitle = boolean('top axis with title', true);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n      />\\n      <Axis\\n        id=\\\"bottom\\\"\\n        position={Position.Bottom}\\n        title={withBottomTitle ? 'Bottom axis' : undefined}\\n        showOverlappingTicks\\n        gridLine={{\\n          visible: boolean('show bottom axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"left2\\\"\\n        title={withLeftTitle ? 'Left axis' : undefined}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          visible: boolean('show left axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"top\\\"\\n        position={Position.Top}\\n        title={withTopTitle ? 'Top axis' : undefined}\\n        showOverlappingTicks\\n        gridLine={{\\n          visible: boolean('show top axis grid lines', false),\\n        }}\\n      />\\n      <Axis\\n        id=\\\"right\\\"\\n        title={withRightTitle ? 'Right axis' : undefined}\\n        position={Position.Right}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        gridLine={{\\n          visible: boolean('show right axis grid lines', false),\\n        }}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    axes: {\\n      axisTitle: {\\n        fill: color('titleFill', '#333', 'Axis Title'),\\n        fontSize: range('titleFontSize', 0, 40, 12, 'Axis Title'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        padding: range('titlePadding', 0, 40, 5, 'Axis Title'),\\n      },\\n      axisLine: {\\n        stroke: color('axisLinecolor', '#333', 'Axis Line'),\\n        strokeWidth: range('axisLineWidth', 0, 5, 1, 'Axis Line'),\\n      },\\n      tickLabel: {\\n        fill: color('tickFill', '#333', 'Tick Label'),\\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: number('tickLabelPadding', 1, {}, 'Tick Label'),\\n      },\\n      tickLine: {\\n        visible: boolean('showTicks', true, 'Tick Line'),\\n        stroke: color('tickLineColor', '#333', 'Tick Line'),\\n        strokeWidth: range('tickLineWidth', 0, 5, 1, 'Tick Line'),\\n      },\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n        rotation={select('rotation', { 0: 0, 90: 90, '-90': -90, 180: 180 }, 0)}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":84},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":84}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    axes: {\n      axisTitle: {\n        fill: color('titleFill', '#333', 'Axis Title'),\n        fontSize: range('titleFontSize', 0, 40, 12, 'Axis Title'),\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        padding: range('titlePadding', 0, 40, 5, 'Axis Title'),\n      },\n      axisLine: {\n        stroke: color('axisLinecolor', '#333', 'Axis Line'),\n        strokeWidth: range('axisLineWidth', 0, 5, 1, 'Axis Line'),\n      },\n      tickLabel: {\n        fill: color('tickFill', '#333', 'Tick Label'),\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\n        fontFamily: \"'Open Sans', Helvetica, Arial, sans-serif\",\n        fontStyle: 'normal',\n        padding: number('tickLabelPadding', 1, {}, 'Tick Label'),\n      },\n      tickLine: {\n        visible: boolean('showTicks', true, 'Tick Line'),\n        stroke: color('tickLineColor', '#333', 'Tick Line'),\n        strokeWidth: range('tickLineWidth', 0, 5, 1, 'Tick Line'),\n      },\n    },\n  };\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', true)}\n        rotation={select('rotation', { 0: 0, 90: 90, '-90': -90, 180: 180 }, 0)}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 0, y: 2 },\n          { x: 1, y: 7 },\n          { x: 2, y: 3 },\n          { x: 3, y: 6 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    axes: {\\n      axisTitle: {\\n        fill: color('titleFill', '#333', 'Axis Title'),\\n        fontSize: range('titleFontSize', 0, 40, 12, 'Axis Title'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        padding: range('titlePadding', 0, 40, 5, 'Axis Title'),\\n      },\\n      axisLine: {\\n        stroke: color('axisLinecolor', '#333', 'Axis Line'),\\n        strokeWidth: range('axisLineWidth', 0, 5, 1, 'Axis Line'),\\n      },\\n      tickLabel: {\\n        fill: color('tickFill', '#333', 'Tick Label'),\\n        fontSize: range('tickFontSize', 0, 40, 10, 'Tick Label'),\\n        fontFamily: \\\"'Open Sans', Helvetica, Arial, sans-serif\\\",\\n        fontStyle: 'normal',\\n        padding: number('tickLabelPadding', 1, {}, 'Tick Label'),\\n      },\\n      tickLine: {\\n        visible: boolean('showTicks', true, 'Tick Line'),\\n        stroke: color('tickLineColor', '#333', 'Tick Line'),\\n        strokeWidth: range('tickLineWidth', 0, 5, 1, 'Tick Line'),\\n      },\\n    },\\n  };\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', true)}\\n        rotation={select('rotation', { 0: 0, 90: 90, '-90': -90, 180: 180 }, 0)}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 0, y: 2 },\\n          { x: 1, y: 7 },\\n          { x: 2, y: 3 },\\n          { x: 3, y: 6 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AreaSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  CurveType,\\n  DEFAULT_MISSING_COLOR,\\n  LineSeries,\\n  PartialTheme,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\nconst data2 = dg.generateSimpleSeries(40);\\nconst data3 = dg.generateSimpleSeries(40);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customizeLineStroke = boolean('customizeLineStroke', false, 'line');\\n  const customizePointStroke = boolean('customizeLinePointStroke', false, 'line');\\n  const customizeAreaFill = boolean('customizeAreaFill', false, 'area');\\n  const customizeAreaLineStroke = boolean('customizeAreaLineStroke', false, 'area');\\n  const customizeRectFill = boolean('customizeRectFill', false, 'bar');\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      left: range('margin left', 0, 50, 10, 'Margins'),\\n      right: range('margin right', 0, 50, 10, 'Margins'),\\n      top: range('margin top', 0, 50, 10, 'Margins'),\\n      bottom: range('margin bottom', 0, 50, 10, 'Margins'),\\n    },\\n    chartPaddings: {\\n      left: range('padding left', 0, 50, 10, 'Paddings'),\\n      right: range('padding right', 0, 50, 10, 'Paddings'),\\n      top: range('padding top', 0, 50, 10, 'Paddings'),\\n      bottom: range('padding bottom', 0, 50, 10, 'Paddings'),\\n    },\\n    lineSeriesStyle: {\\n      line: {\\n        stroke: customizeLineStroke ? color('customLineStroke', 'red', 'line') : undefined,\\n        strokeWidth: range('lineStrokeWidth', 0, 10, 1, 'line'),\\n        visible: boolean('lineVisible', true, 'line'),\\n      },\\n      point: {\\n        visible: boolean('linePointVisible', true, 'line'),\\n        radius: range('linePointRadius', 0, 20, 1, 'line', 0.5),\\n        fill: color('linePointFill', 'white', 'line'),\\n        stroke: customizePointStroke ? color('customLinePointStroke', 'red', 'line') : undefined,\\n        strokeWidth: range('linePointStrokeWidth', 0, 20, 0.5, 'line'),\\n        opacity: range('linePointOpacity', 0, 1, 1, 'line', 0.01),\\n      },\\n    },\\n    areaSeriesStyle: {\\n      area: {\\n        fill: customizeAreaFill ? color('customAreaFill', 'red', 'area') : undefined,\\n        visible: boolean('aAreaVisible', true, 'area'),\\n        opacity: range('aAreaOpacity', 0, 1, 1, 'area'),\\n      },\\n      line: {\\n        stroke: customizeAreaLineStroke ? color('customAreaLineStroke', 'red', 'area') : undefined,\\n        strokeWidth: range('aStrokeWidth', 0, 10, 1, 'area'),\\n        visible: boolean('aLineVisible', true, 'area'),\\n      },\\n      point: {\\n        visible: boolean('aPointVisible', true, 'area'),\\n        fill: color('aPointFill', 'white', 'area'),\\n        radius: range('aPointRadius', 0, 20, 1, 'area'),\\n        stroke: color('aPointStroke', 'white', 'area'),\\n        strokeWidth: range('aPointStrokeWidth', 0, 20, 0.5, 'area'),\\n        opacity: range('aPointOpacity', 0, 1, 0.01, 'area'),\\n      },\\n    },\\n    barSeriesStyle: {\\n      rect: {\\n        fill: customizeRectFill ? color('recCustomFull', 'red', 'bar') : undefined,\\n        opacity: range('rectOpacity', 0, 1, 0.5, 'bar', 0.1),\\n      },\\n      rectBorder: {\\n        stroke: color('bBorderStroke', 'white', 'bar'),\\n        strokeWidth: range('bStrokeWidth', 0, 10, 1, 'bar'),\\n        visible: boolean('bBorderVisible', true, 'bar'),\\n      },\\n    },\\n    sharedStyle: {\\n      default: {\\n        opacity: range('sOpacity', 0, 1, 1, 'Shared', 0.05),\\n      },\\n      highlighted: {\\n        opacity: range('sHighlighted', 0, 1, 1, 'Shared', 0.05),\\n      },\\n      unhighlighted: {\\n        opacity: range('sUnhighlighted', 0, 1, 0.25, 'Shared', 0.05),\\n      },\\n    },\\n    colors: {\\n      vizColors: select(\\n        'vizColors',\\n        {\\n          colorBlind: palettes.echPaletteColorBlind.colors,\\n          darkBackground: palettes.echPaletteForDarkBackground.colors,\\n          lightBackground: palettes.echPaletteForLightBackground.colors,\\n          forStatus: palettes.echPaletteForStatus.colors,\\n        },\\n        palettes.echPaletteColorBlind.colors,\\n        'Colors',\\n      ),\\n      defaultVizColor: DEFAULT_MISSING_COLOR,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":50},\"endLoc\":{\"col\":1,\"line\":186},\"startBody\":{\"col\":36,\"line\":50},\"endBody\":{\"col\":1,\"line\":186}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AreaSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  CurveType,\n  DEFAULT_MISSING_COLOR,\n  LineSeries,\n  PartialTheme,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\nimport { palettes } from '@elastic/charts/src/utils/themes/colors';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\nconst data2 = dg.generateSimpleSeries(40);\nconst data3 = dg.generateSimpleSeries(40);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customizeLineStroke = boolean('customizeLineStroke', false, 'line');\n  const customizePointStroke = boolean('customizeLinePointStroke', false, 'line');\n  const customizeAreaFill = boolean('customizeAreaFill', false, 'area');\n  const customizeAreaLineStroke = boolean('customizeAreaLineStroke', false, 'area');\n  const customizeRectFill = boolean('customizeRectFill', false, 'bar');\n  const theme: PartialTheme = {\n    chartMargins: {\n      left: range('margin left', 0, 50, 10, 'Margins'),\n      right: range('margin right', 0, 50, 10, 'Margins'),\n      top: range('margin top', 0, 50, 10, 'Margins'),\n      bottom: range('margin bottom', 0, 50, 10, 'Margins'),\n    },\n    chartPaddings: {\n      left: range('padding left', 0, 50, 10, 'Paddings'),\n      right: range('padding right', 0, 50, 10, 'Paddings'),\n      top: range('padding top', 0, 50, 10, 'Paddings'),\n      bottom: range('padding bottom', 0, 50, 10, 'Paddings'),\n    },\n    lineSeriesStyle: {\n      line: {\n        stroke: customizeLineStroke ? color('customLineStroke', 'red', 'line') : undefined,\n        strokeWidth: range('lineStrokeWidth', 0, 10, 1, 'line'),\n        visible: boolean('lineVisible', true, 'line'),\n      },\n      point: {\n        visible: boolean('linePointVisible', true, 'line'),\n        radius: range('linePointRadius', 0, 20, 1, 'line', 0.5),\n        fill: color('linePointFill', 'white', 'line'),\n        stroke: customizePointStroke ? color('customLinePointStroke', 'red', 'line') : undefined,\n        strokeWidth: range('linePointStrokeWidth', 0, 20, 0.5, 'line'),\n        opacity: range('linePointOpacity', 0, 1, 1, 'line', 0.01),\n      },\n    },\n    areaSeriesStyle: {\n      area: {\n        fill: customizeAreaFill ? color('customAreaFill', 'red', 'area') : undefined,\n        visible: boolean('aAreaVisible', true, 'area'),\n        opacity: range('aAreaOpacity', 0, 1, 1, 'area'),\n      },\n      line: {\n        stroke: customizeAreaLineStroke ? color('customAreaLineStroke', 'red', 'area') : undefined,\n        strokeWidth: range('aStrokeWidth', 0, 10, 1, 'area'),\n        visible: boolean('aLineVisible', true, 'area'),\n      },\n      point: {\n        visible: boolean('aPointVisible', true, 'area'),\n        fill: color('aPointFill', 'white', 'area'),\n        radius: range('aPointRadius', 0, 20, 1, 'area'),\n        stroke: color('aPointStroke', 'white', 'area'),\n        strokeWidth: range('aPointStrokeWidth', 0, 20, 0.5, 'area'),\n        opacity: range('aPointOpacity', 0, 1, 0.01, 'area'),\n      },\n    },\n    barSeriesStyle: {\n      rect: {\n        fill: customizeRectFill ? color('recCustomFull', 'red', 'bar') : undefined,\n        opacity: range('rectOpacity', 0, 1, 0.5, 'bar', 0.1),\n      },\n      rectBorder: {\n        stroke: color('bBorderStroke', 'white', 'bar'),\n        strokeWidth: range('bStrokeWidth', 0, 10, 1, 'bar'),\n        visible: boolean('bBorderVisible', true, 'bar'),\n      },\n    },\n    sharedStyle: {\n      default: {\n        opacity: range('sOpacity', 0, 1, 1, 'Shared', 0.05),\n      },\n      highlighted: {\n        opacity: range('sHighlighted', 0, 1, 1, 'Shared', 0.05),\n      },\n      unhighlighted: {\n        opacity: range('sUnhighlighted', 0, 1, 0.25, 'Shared', 0.05),\n      },\n    },\n    colors: {\n      vizColors: select(\n        'vizColors',\n        {\n          colorBlind: palettes.echPaletteColorBlind.colors,\n          darkBackground: palettes.echPaletteForDarkBackground.colors,\n          lightBackground: palettes.echPaletteForLightBackground.colors,\n          forStatus: palettes.echPaletteForStatus.colors,\n        },\n        palettes.echPaletteColorBlind.colors,\n        'Colors',\n      ),\n      defaultVizColor: DEFAULT_MISSING_COLOR,\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        debug={boolean('debug', false)}\n        showLegend\n        showLegendExtra\n        legendPosition={Position.Right}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={data1}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={data2}\n      />\n      <AreaSeries\n        id=\"areas\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        curve={CurveType.CURVE_MONOTONE_X}\n        data={data3}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customizeLineStroke = boolean('customizeLineStroke', false, 'line');\\n  const customizePointStroke = boolean('customizeLinePointStroke', false, 'line');\\n  const customizeAreaFill = boolean('customizeAreaFill', false, 'area');\\n  const customizeAreaLineStroke = boolean('customizeAreaLineStroke', false, 'area');\\n  const customizeRectFill = boolean('customizeRectFill', false, 'bar');\\n  const theme: PartialTheme = {\\n    chartMargins: {\\n      left: range('margin left', 0, 50, 10, 'Margins'),\\n      right: range('margin right', 0, 50, 10, 'Margins'),\\n      top: range('margin top', 0, 50, 10, 'Margins'),\\n      bottom: range('margin bottom', 0, 50, 10, 'Margins'),\\n    },\\n    chartPaddings: {\\n      left: range('padding left', 0, 50, 10, 'Paddings'),\\n      right: range('padding right', 0, 50, 10, 'Paddings'),\\n      top: range('padding top', 0, 50, 10, 'Paddings'),\\n      bottom: range('padding bottom', 0, 50, 10, 'Paddings'),\\n    },\\n    lineSeriesStyle: {\\n      line: {\\n        stroke: customizeLineStroke ? color('customLineStroke', 'red', 'line') : undefined,\\n        strokeWidth: range('lineStrokeWidth', 0, 10, 1, 'line'),\\n        visible: boolean('lineVisible', true, 'line'),\\n      },\\n      point: {\\n        visible: boolean('linePointVisible', true, 'line'),\\n        radius: range('linePointRadius', 0, 20, 1, 'line', 0.5),\\n        fill: color('linePointFill', 'white', 'line'),\\n        stroke: customizePointStroke ? color('customLinePointStroke', 'red', 'line') : undefined,\\n        strokeWidth: range('linePointStrokeWidth', 0, 20, 0.5, 'line'),\\n        opacity: range('linePointOpacity', 0, 1, 1, 'line', 0.01),\\n      },\\n    },\\n    areaSeriesStyle: {\\n      area: {\\n        fill: customizeAreaFill ? color('customAreaFill', 'red', 'area') : undefined,\\n        visible: boolean('aAreaVisible', true, 'area'),\\n        opacity: range('aAreaOpacity', 0, 1, 1, 'area'),\\n      },\\n      line: {\\n        stroke: customizeAreaLineStroke ? color('customAreaLineStroke', 'red', 'area') : undefined,\\n        strokeWidth: range('aStrokeWidth', 0, 10, 1, 'area'),\\n        visible: boolean('aLineVisible', true, 'area'),\\n      },\\n      point: {\\n        visible: boolean('aPointVisible', true, 'area'),\\n        fill: color('aPointFill', 'white', 'area'),\\n        radius: range('aPointRadius', 0, 20, 1, 'area'),\\n        stroke: color('aPointStroke', 'white', 'area'),\\n        strokeWidth: range('aPointStrokeWidth', 0, 20, 0.5, 'area'),\\n        opacity: range('aPointOpacity', 0, 1, 0.01, 'area'),\\n      },\\n    },\\n    barSeriesStyle: {\\n      rect: {\\n        fill: customizeRectFill ? color('recCustomFull', 'red', 'bar') : undefined,\\n        opacity: range('rectOpacity', 0, 1, 0.5, 'bar', 0.1),\\n      },\\n      rectBorder: {\\n        stroke: color('bBorderStroke', 'white', 'bar'),\\n        strokeWidth: range('bStrokeWidth', 0, 10, 1, 'bar'),\\n        visible: boolean('bBorderVisible', true, 'bar'),\\n      },\\n    },\\n    sharedStyle: {\\n      default: {\\n        opacity: range('sOpacity', 0, 1, 1, 'Shared', 0.05),\\n      },\\n      highlighted: {\\n        opacity: range('sHighlighted', 0, 1, 1, 'Shared', 0.05),\\n      },\\n      unhighlighted: {\\n        opacity: range('sUnhighlighted', 0, 1, 0.25, 'Shared', 0.05),\\n      },\\n    },\\n    colors: {\\n      vizColors: select(\\n        'vizColors',\\n        {\\n          colorBlind: palettes.echPaletteColorBlind.colors,\\n          darkBackground: palettes.echPaletteForDarkBackground.colors,\\n          lightBackground: palettes.echPaletteForLightBackground.colors,\\n          forStatus: palettes.echPaletteForStatus.colors,\\n        },\\n        palettes.echPaletteColorBlind.colors,\\n        'Colors',\\n      ),\\n      defaultVizColor: DEFAULT_MISSING_COLOR,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        debug={boolean('debug', false)}\\n        showLegend\\n        showLegendExtra\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data2}\\n      />\\n      <AreaSeries\\n        id=\\\"areas\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        curve={CurveType.CURVE_MONOTONE_X}\\n        data={data3}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customPartialTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('BarBorderStroke', 'white'),\\n        visible: true,\\n      },\\n    },\\n    background: {\\n      color: color('Change background container color', 'white'),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={customPartialTheme}\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":59},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":59}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customPartialTheme: PartialTheme = {\n    barSeriesStyle: {\n      rectBorder: {\n        stroke: color('BarBorderStroke', 'white'),\n        visible: true,\n      },\n    },\n    background: {\n      color: color('Change background container color', 'white'),\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={customPartialTheme}\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={data1}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customPartialTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('BarBorderStroke', 'white'),\\n        visible: true,\\n      },\\n    },\\n    background: {\\n      color: color('Change background container color', 'white'),\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={customPartialTheme}\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customPartialTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('BarBorderStroke', 'white'),\\n        visible: true,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={customPartialTheme}\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":56},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":56}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customPartialTheme: PartialTheme = {\n    barSeriesStyle: {\n      rectBorder: {\n        stroke: color('BarBorderStroke', 'white'),\n        visible: true,\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={customPartialTheme}\n        baseTheme={useBaseTheme()}\n        legendPosition={Position.Right}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={data1}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customPartialTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rectBorder: {\\n        stroke: color('BarBorderStroke', 'white'),\\n        visible: true,\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={customPartialTheme}\\n        baseTheme={useBaseTheme()}\\n        legendPosition={Position.Right}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\\n  return number(\\n    title,\\n    value,\\n    {\\n      range: true,\\n      min,\\n      max,\\n      step,\\n    },\\n    groupId,\\n  );\\n}\\n\\nconst dg = new SeededDataGenerator();\\nconst data1 = dg.generateGroupedSeries(40, 4);\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const primaryTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill: color('bar fill - primary theme', 'red'),\\n      },\\n    },\\n  };\\n  const secondaryTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill: color('bar fill - secondary theme', 'blue'),\\n        opacity: range('bar opacity - secondary theme', 0.1, 1, 0.7, undefined, 0.1),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={[primaryTheme, secondaryTheme]}\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":77},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":77}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, PartialTheme, Position, ScaleType, Settings } from '@elastic/charts';\nimport { SeededDataGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nfunction range(title: string, min: number, max: number, value: number, groupId?: string, step = 1) {\n  return number(\n    title,\n    value,\n    {\n      range: true,\n      min,\n      max,\n      step,\n    },\n    groupId,\n  );\n}\n\nconst dg = new SeededDataGenerator();\nconst data1 = dg.generateGroupedSeries(40, 4);\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const primaryTheme: PartialTheme = {\n    barSeriesStyle: {\n      rect: {\n        fill: color('bar fill - primary theme', 'red'),\n      },\n    },\n  };\n  const secondaryTheme: PartialTheme = {\n    barSeriesStyle: {\n      rect: {\n        fill: color('bar fill - secondary theme', 'blue'),\n        opacity: range('bar opacity - secondary theme', 0.1, 1, 0.7, undefined, 0.1),\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        showLegendExtra\n        theme={[primaryTheme, secondaryTheme]}\n        legendPosition={Position.Right}\n        baseTheme={useBaseTheme()}\n      />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n      <Axis id=\"top\" position={Position.Top} title=\"Top axis\" showOverlappingTicks />\n      <Axis id=\"right\" title=\"Right axis\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['x']}\n        data={data1}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const primaryTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill: color('bar fill - primary theme', 'red'),\\n      },\\n    },\\n  };\\n  const secondaryTheme: PartialTheme = {\\n    barSeriesStyle: {\\n      rect: {\\n        fill: color('bar fill - secondary theme', 'blue'),\\n        opacity: range('bar opacity - secondary theme', 0.1, 1, 0.7, undefined, 0.1),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        showLegendExtra\\n        theme={[primaryTheme, secondaryTheme]}\\n        legendPosition={Position.Right}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <Axis id=\\\"top\\\" position={Position.Top} title=\\\"Top axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"right\\\" title=\\\"Right axis\\\" position={Position.Right} tickFormat={(d) => Number(d).toFixed(2)} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['x']}\\n        data={data1}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      color={['red', 'orange', 'blue', 'green', 'black', 'lightgrey']}\\n      data={TestDatasets.BARCHART_2Y2G}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":34},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":34}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, BarSeries, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n    <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n    <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n    <BarSeries\n      id=\"bars\"\n      xScaleType={ScaleType.Linear}\n      yScaleType={ScaleType.Linear}\n      xAccessor=\"x\"\n      yAccessors={['y1']}\n      splitSeriesAccessors={['g1', 'g2']}\n      color={['red', 'orange', 'blue', 'green', 'black', 'lightgrey']}\n      data={TestDatasets.BARCHART_2Y2G}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n    <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n    <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n    <BarSeries\\n      id=\\\"bars\\\"\\n      xScaleType={ScaleType.Linear}\\n      yScaleType={ScaleType.Linear}\\n      xAccessor=\\\"x\\\"\\n      yAccessors={['y1']}\\n      splitSeriesAccessors={['g1', 'g2']}\\n      color={['red', 'orange', 'blue', 'green', 'black', 'lightgrey']}\\n      data={TestDatasets.BARCHART_2Y2G}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  SeriesColorAccessor,\\n  LineSeries,\\n  Position,\\n  ScaleType,\\n  Settings,\\n} from '@elastic/charts';\\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const barColor = color('barSeriesColor', '#000');\\n  const barSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\\n    if (\\n      specId === 'bars' &&\\n      yAccessor === 'y1' &&\\n      splitAccessors.get('g1') === 'cloudflare.com' &&\\n      splitAccessors.get('g2') === 'direct-cdn'\\n    ) {\\n      return barColor;\\n    }\\n    return null;\\n  };\\n\\n  const lineColor = color('linelineSeriesColor', '#ff0');\\n  const lineSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\\n    if (specId === 'lines' && yAccessor === 'y' && splitAccessors.size === 0) {\\n      return lineColor;\\n    }\\n    return null;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        color={barSeriesColorAccessor}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        color={lineSeriesColorAccessor}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":81},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":81}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Axis,\n  BarSeries,\n  Chart,\n  SeriesColorAccessor,\n  LineSeries,\n  Position,\n  ScaleType,\n  Settings,\n} from '@elastic/charts';\nimport * as TestDatasets from '@elastic/charts/src/utils/data_samples/test_dataset';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const barColor = color('barSeriesColor', '#000');\n  const barSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\n    if (\n      specId === 'bars' &&\n      yAccessor === 'y1' &&\n      splitAccessors.get('g1') === 'cloudflare.com' &&\n      splitAccessors.get('g2') === 'direct-cdn'\n    ) {\n      return barColor;\n    }\n    return null;\n  };\n\n  const lineColor = color('linelineSeriesColor', '#ff0');\n  const lineSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\n    if (specId === 'lines' && yAccessor === 'y' && splitAccessors.size === 0) {\n      return lineColor;\n    }\n    return null;\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" position={Position.Bottom} title=\"Bottom axis\" showOverlappingTicks />\n      <Axis id=\"left2\" title=\"Left axis\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\n\n      <BarSeries\n        id=\"bars\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y1', 'y2']}\n        splitSeriesAccessors={['g1', 'g2']}\n        color={barSeriesColorAccessor}\n        data={TestDatasets.BARCHART_2Y2G}\n      />\n      <LineSeries\n        id=\"lines\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        color={lineSeriesColorAccessor}\n        data={[\n          { x: 0, y: 3 },\n          { x: 1, y: 2 },\n          { x: 2, y: 4 },\n          { x: 3, y: 10 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const barColor = color('barSeriesColor', '#000');\\n  const barSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\\n    if (\\n      specId === 'bars' &&\\n      yAccessor === 'y1' &&\\n      splitAccessors.get('g1') === 'cloudflare.com' &&\\n      splitAccessors.get('g2') === 'direct-cdn'\\n    ) {\\n      return barColor;\\n    }\\n    return null;\\n  };\\n\\n  const lineColor = color('linelineSeriesColor', '#ff0');\\n  const lineSeriesColorAccessor: SeriesColorAccessor = ({ specId, yAccessor, splitAccessors }) => {\\n    if (specId === 'lines' && yAccessor === 'y' && splitAccessors.size === 0) {\\n      return lineColor;\\n    }\\n    return null;\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend showLegendExtra legendPosition={Position.Right} baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} title=\\\"Bottom axis\\\" showOverlappingTicks />\\n      <Axis id=\\\"left2\\\" title=\\\"Left axis\\\" position={Position.Left} tickFormat={(d) => Number(d).toFixed(2)} />\\n\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y1', 'y2']}\\n        splitSeriesAccessors={['g1', 'g2']}\\n        color={barSeriesColorAccessor}\\n        data={TestDatasets.BARCHART_2Y2G}\\n      />\\n      <LineSeries\\n        id=\\\"lines\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        color={lineSeriesColorAccessor}\\n        data={[\\n          { x: 0, y: 3 },\\n          { x: 1, y: 2 },\\n          { x: 2, y: 4 },\\n          { x: 3, y: 10 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Stylings',\n};\n\nexport { Example as chartSize } from './1_chart_size.story';\nexport { Example as marginsAndPaddings } from './2_margins.story';\nexport { Example as axis } from './3_axis.story';\nexport { Example as themeStyling } from './4_theme_styling.story';\nexport { Example as partialCustomTheme } from './5_partial_custom_theme.story';\nexport { Example as partialCustomThemeWithBaseTheme } from './6_partial_and_base.story';\nexport { Example as multipleCustomPartialThemes } from './7_multiple_custom.story';\nexport { Example as customSeriesColorsViaColorsArray } from './8_custom_series_colors_array.story';\nexport { Example as customSeriesColorsViaAccessorFunction } from './9_custom_series_colors_function.story';\nexport { Example as customSeriesStylesBars } from './10_custom_bars.story';\nexport { Example as customSeriesStylesLines } from './11_custom_lines.story';\nexport { Example as customSeriesStylesArea } from './12_custom_area.story';\nexport { Example as customSeriesName } from './13_custom_series_name.story';\nexport { Example as customSeriesNameConfig } from './13_custom_series_name_config.story';\nexport { Example as customSeriesNameFormatting } from './14_custom_series_name_formatting.story';\nexport { Example as tickLabelPaddingBothPropAndTheme } from './15_tick_label.story';\nexport { Example as styleAccessorOverrides } from './16_style_accessor.story';\nexport { Example as barSeriesColorVariant } from './17_bar_series_color_variant.story';\nexport { Example as lineSeriesColorVariant } from './18_line_series_color_variant.story';\nexport { Example as areaSeriesColorVariant } from './19_area_series_color_variant.story';\nexport { Example as partitionBackground } from './20_partition_background.story';\nexport { Example as partitionLabels } from './21_partition_labels.story';\nexport { Example as darkTheme } from './22_dark_theme.story';\nexport { Example as withTexture } from './23_with_texture.story';\nexport { Example as textureMultipleSeries } from './24_texture_multiple_series.story';\nexport { Example as mixedPointShapes } from './25_mixed_point_shapes.story';\nexport { Example as highlighterStyle } from './26_highlighter_style.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debugState baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 2)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings debugState baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.slice(0, 2)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debugState baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 2)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 1 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 280 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 80 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => d,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      clockwiseSectors\\n      specialFirstInnermostSector={false}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":48},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":48}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { outerSizeRatio: 1 },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: 'Machinery and transport equipment', exportVal: 280 },\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 80 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => d,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n      clockwiseSectors\n      specialFirstInnermostSector={false}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 1 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 280 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 80 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => d,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      clockwiseSectors\\n      specialFirstInnermostSector={false}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 9 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 1 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => d,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":41},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":41}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: 'Machinery and transport equipment', exportVal: 9 },\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 1 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => d,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 9 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 1 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => d,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: '7', exportVal: 999999 },\\n        { sitc1: '3', exportVal: 1 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":41},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":41}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: '7', exportVal: 999999 },\n        { sitc1: '3', exportVal: 1 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: '7', exportVal: 999999 },\\n        { sitc1: '3', exportVal: 1 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: '7', exportVal: 1000000 },\\n        { sitc1: '3', exportVal: 0 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":41},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":41}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: '7', exportVal: 1000000 },\n        { sitc1: '3', exportVal: 0 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: '7', exportVal: 1000000 },\\n        { sitc1: '3', exportVal: 0 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.slice(0, 1)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName.replaceAll(/\\\\s/g, '\\\\u00A0'),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name.replaceAll(/\\\\s/g, '\\\\u00A0'),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":56},\"endLoc\":{\"col\":1,\"line\":92},\"startBody\":{\"col\":36,\"line\":56},\"endBody\":{\"col\":1,\"line\":92}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.miniSunburst.slice(0, 1)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: any) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName.replaceAll(/\\s/g, '\\u00A0'),\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name.replaceAll(/\\s/g, '\\u00A0'),\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName.replaceAll(/\\\\s/g, '\\\\u00A0'),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name.replaceAll(/\\\\s/g, '\\\\u00A0'),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.15 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { outerSizeRatio: 0.15 },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.slice(0, 1)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.15 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.03 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { outerSizeRatio: 0.03 },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.slice(0, 1)}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.03 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.slice(0, 1)}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":38},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":38}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={[]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie\\n        .slice(0, 2)\\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: -0.1 })))\\n        .concat(mocks.pie.slice(3))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie\n        .slice(0, 2)\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: -0.1 })))\n        .concat(mocks.pie.slice(3))}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie\\n        .slice(0, 2)\\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: -0.1 })))\\n        .concat(mocks.pie.slice(3))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={showDebug} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showDebug = boolean('show table for debugging', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings debug={showDebug} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings debug={showDebug} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((s) => ({ ...s, exportVal: 0 }))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":39},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":39}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.map((s) => ({ ...s, exportVal: 0 }))}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((s) => ({ ...s, exportVal: 0 }))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: { maxCount: 15 },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.manyPie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.origin,\\n          nodeLabel: (d: Datum) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: {\n          linkLabel: { maxCount: 15 },\n        },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.manyPie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.origin,\n          nodeLabel: (d: Datum) => countryLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: { maxCount: 15 },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.manyPie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.origin,\\n          nodeLabel: (d: Datum) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      clockwiseSectors={false}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n      clockwiseSectors={false}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      clockwiseSectors={false}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      specialFirstInnermostSector={false}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n      specialFirstInnermostSector={false}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n      specialFirstInnermostSector={false}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: {\\n            maximumSection: Infinity,\\n            textColor: boolean('custom linkLabel.textColor', true)\\n              ? color('linkLabel.textColor', 'rgba(0, 0, 0, 1)')\\n              : undefined,\\n          },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":52},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":52}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: {\n          linkLabel: {\n            maximumSection: Infinity,\n            textColor: boolean('custom linkLabel.textColor', true)\n              ? color('linkLabel.textColor', 'rgba(0, 0, 0, 1)')\n              : undefined,\n          },\n        },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: {\\n            maximumSection: Infinity,\\n            textColor: boolean('custom linkLabel.textColor', true)\\n              ? color('linkLabel.textColor', 'rgba(0, 0, 0, 1)')\\n              : undefined,\\n          },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: { maximumSection: Infinity, maxCount: 0 },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":46},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":46}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: {\n          linkLabel: { maximumSection: Infinity, maxCount: 0 },\n        },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: {\\n          linkLabel: { maximumSection: Infinity, maxCount: 0 },\\n        },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_26\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueGetter=\\\"percent\\\"\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      percentFormatter={(d: number) => `${Math.round((d + Number.EPSILON) * 100) / 100}%`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":56},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":56},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_26\"\n      data={mocks.miniSunburst}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueGetter=\"percent\"\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      percentFormatter={(d: number) => `${Math.round((d + Number.EPSILON) * 100) / 100}%`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: any) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_26\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueGetter=\\\"percent\\\"\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      percentFormatter={(d: number) => `${Math.round((d + Number.EPSILON) * 100) / 100}%`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n  PrimitiveValue,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  discreteColor,\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? productLookup[d].name : ''),\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? regionLookup[d].regionName : ''),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? countryLookup[d].name : ''),\\n          showAccessor: (d: PrimitiveValue) => !(['chn', 'hkg', 'jpn', 'kor'] as PrimitiveValue[]).includes(d),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":57},\"endLoc\":{\"col\":1,\"line\":94},\"startBody\":{\"col\":36,\"line\":57},\"endBody\":{\"col\":1,\"line\":94}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n  PrimitiveValue,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  discreteColor,\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.miniSunburst}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? productLookup[d].name : ''),\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? regionLookup[d].regionName : ''),\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? countryLookup[d].name : ''),\n          showAccessor: (d: PrimitiveValue) => !(['chn', 'hkg', 'jpn', 'kor'] as PrimitiveValue[]).includes(d),\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? productLookup[d].name : ''),\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? regionLookup[d].regionName : ''),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: PrimitiveValue) => (d !== null ? countryLookup[d].name : ''),\\n          showAccessor: (d: PrimitiveValue) => !(['chn', 'hkg', 'jpn', 'kor'] as PrimitiveValue[]).includes(d),\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie\\n        .slice(0, 2)\\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: undefined as unknown as number })))\\n        .concat(mocks.pie.slice(3))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie\n        .slice(0, 2)\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: undefined as unknown as number })))\n        .concat(mocks.pie.slice(3))}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie\\n        .slice(0, 2)\\n        .concat(mocks.pie.slice(2, 3).map((s) => ({ ...s, exportVal: undefined as unknown as number })))\\n        .concat(mocks.pie.slice(3))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n  Color,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nconst getColorKnob = (prop: string, defaultColor: Color) =>\\n  boolean(`custom ${prop}`, false) ? color(prop, defaultColor) : undefined;\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    background: {\\n      color: color('background.color', '#1c1c24'),\\n      fallbackColor: getColorKnob('background.fallbackColor', 'black'),\\n    },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 15,\\n        textColor: getColorKnob('linkLabel.textColor', 'white'),\\n      },\\n      fillLabel: {\\n        textColor: getColorKnob('fillLabel.textColor', 'white'),\\n      },\\n      sectorLineWidth: 1.2,\\n    },\\n  };\\n\\n  const fillColor = getColorKnob('shape.fillColor', 'blue');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.manyPie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.origin,\\n            nodeLabel: (d: Datum) => countryLookup[d].name,\\n            shape: {\\n              fillColor:\\n                fillColor ??\\n                ((key, sortIndex, node, tree) =>\\n                  indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree)),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  theme: { default: 'dark' },\\n  background: { disable: true },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":74},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":74}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n  Color,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nconst getColorKnob = (prop: string, defaultColor: Color) =>\n  boolean(`custom ${prop}`, false) ? color(prop, defaultColor) : undefined;\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    background: {\n      color: color('background.color', '#1c1c24'),\n      fallbackColor: getColorKnob('background.fallbackColor', 'black'),\n    },\n    partition: {\n      linkLabel: {\n        maxCount: 15,\n        textColor: getColorKnob('linkLabel.textColor', 'white'),\n      },\n      fillLabel: {\n        textColor: getColorKnob('fillLabel.textColor', 'white'),\n      },\n      sectorLineWidth: 1.2,\n    },\n  };\n\n  const fillColor = getColorKnob('shape.fillColor', 'blue');\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.manyPie}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.origin,\n            nodeLabel: (d: Datum) => countryLookup[d].name,\n            shape: {\n              fillColor:\n                fillColor ??\n                ((key, sortIndex, node, tree) =>\n                  indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree)),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  theme: { default: 'dark' },\n  background: { disable: true },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    background: {\\n      color: color('background.color', '#1c1c24'),\\n      fallbackColor: getColorKnob('background.fallbackColor', 'black'),\\n    },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 15,\\n        textColor: getColorKnob('linkLabel.textColor', 'white'),\\n      },\\n      fillLabel: {\\n        textColor: getColorKnob('fillLabel.textColor', 'white'),\\n      },\\n      sectorLineWidth: 1.2,\\n    },\\n  };\\n\\n  const fillColor = getColorKnob('shape.fillColor', 'blue');\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.manyPie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.origin,\\n            nodeLabel: (d: Datum) => countryLookup[d].name,\\n            shape: {\\n              fillColor:\\n                fillColor ??\\n                ((key, sortIndex, node, tree) =>\\n                  indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree)),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, PartialTheme, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorTurbo, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const onElementClick = boolean('onElementClick listener', true);\\n  const onElementOver = boolean('onElementOver listener', true);\\n  const theme: PartialTheme = {\\n    partition: {\\n      outerSizeRatio: 0.9,\\n      linkLabel: {\\n        fontStyle: 'italic',\\n        valueFont: { fontWeight: 900 },\\n        maxTextLength: number('maxTextLength', 20, { range: true, min: 1, max: 100 }),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\\n        onElementOver={onElementOver ? action('onElementOver') : undefined}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            fillLabel: {\\n              fontWeight: 100,\\n              fontStyle: 'italic',\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 900,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorTurbo(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":20},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":20},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, PartialTheme, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorTurbo, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const onElementClick = boolean('onElementClick listener', true);\n  const onElementOver = boolean('onElementOver listener', true);\n  const theme: PartialTheme = {\n    partition: {\n      outerSizeRatio: 0.9,\n      linkLabel: {\n        fontStyle: 'italic',\n        valueFont: { fontWeight: 900 },\n        maxTextLength: number('maxTextLength', 20, { range: true, min: 1, max: 100 }),\n      },\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={theme}\n        baseTheme={useBaseTheme()}\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\n        onElementOver={onElementOver ? action('onElementOver') : undefined}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            fillLabel: {\n              fontWeight: 100,\n              fontStyle: 'italic',\n              valueFont: {\n                fontFamily: 'Menlo',\n                fontStyle: 'normal',\n                fontWeight: 900,\n              },\n            },\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorTurbo(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const onElementClick = boolean('onElementClick listener', true);\\n  const onElementOver = boolean('onElementOver listener', true);\\n  const theme: PartialTheme = {\\n    partition: {\\n      outerSizeRatio: 0.9,\\n      linkLabel: {\\n        fontStyle: 'italic',\\n        valueFont: { fontWeight: 900 },\\n        maxTextLength: number('maxTextLength', 20, { range: true, min: 1, max: 100 }),\\n      },\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={theme}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={onElementClick ? action('onElementClick') : undefined}\\n        onElementOver={onElementOver ? action('onElementOver') : undefined}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            fillLabel: {\\n              fontWeight: 100,\\n              fontStyle: 'italic',\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 900,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorTurbo(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { color } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    partition: {\\n      linkLabel: { maximumSection: Infinity, maxCount: 0 },\\n      sectorLineWidth: 10,\\n      sectorLineStroke: color('sectorLineStroke', 'lightgrey'),\\n      outerSizeRatio: 1,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":27},\"endLoc\":{\"col\":1,\"line\":59},\"startBody\":{\"col\":36,\"line\":27},\"endBody\":{\"col\":1,\"line\":59}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { color } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    partition: {\n      linkLabel: { maximumSection: Infinity, maxCount: 0 },\n      sectorLineWidth: 10,\n      sectorLineStroke: color('sectorLineStroke', 'lightgrey'),\n      outerSizeRatio: 1,\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    partition: {\\n      linkLabel: { maximumSection: Infinity, maxCount: 0 },\\n      sectorLineWidth: 10,\\n      sectorLineStroke: color('sectorLineStroke', 'lightgrey'),\\n      outerSizeRatio: 1,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, PartialTheme, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":24},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":24},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, PartialTheme, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          fillLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: { valueFont: { fontWeight: 900, fontStyle: 'italic' } },\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  CustomTooltip as CT,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n  Tooltip,\\n} from '@elastic/charts';\\nimport { CHILDREN_KEY, entryValue, PARENT_KEY } from '@elastic/charts/src';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\\n\\nconst CustomTooltip: CT = ({ values }) => (\\n  <div\\n    style={{\\n      padding: 10,\\n      minHeight: 40,\\n      backgroundColor: 'blue',\\n      color: 'white',\\n    }}\\n  >\\n    My Custom Tooltip:\\n    <br />\\n    {values.map(({ label }) => label)}\\n  </div>\\n);\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 0.95,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip\\n        placement={customKnobs.enum.placement('Tooltip placement')}\\n        fallbackPlacements={customKnobs.enum.fallbackPlacements()}\\n        boundary={customKnobs.enum.boundary()}\\n        customTooltip={boolean('Custom Tooltip', false) ? CustomTooltip : undefined}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.sunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            fillLabel: {\\n              fontFamily: 'Impact',\\n              valueFormatter: (d: number) =>\\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\\\u00A0Tn`,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on the index of the fist children\\n                const rootTree = node[PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node[CHILDREN_KEY][0]));\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on their index\\n                const rootTree = node[PARENT_KEY][PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\\n\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":64},\"endLoc\":{\"col\":1,\"line\":115},\"startBody\":{\"col\":36,\"line\":64},\"endBody\":{\"col\":1,\"line\":115}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  CustomTooltip as CT,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n  Tooltip,\n} from '@elastic/charts';\nimport { CHILDREN_KEY, entryValue, PARENT_KEY } from '@elastic/charts/src';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\n\nconst CustomTooltip: CT = ({ values }) => (\n  <div\n    style={{\n      padding: 10,\n      minHeight: 40,\n      backgroundColor: 'blue',\n      color: 'white',\n    }}\n  >\n    My Custom Tooltip:\n    <br />\n    {values.map(({ label }) => label)}\n  </div>\n);\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 0.95,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} />\n      <Tooltip\n        placement={customKnobs.enum.placement('Tooltip placement')}\n        fallbackPlacements={customKnobs.enum.fallbackPlacements()}\n        boundary={customKnobs.enum.boundary()}\n        customTooltip={boolean('Custom Tooltip', false) ? CustomTooltip : undefined}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.sunburst}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (d: any) => regionLookup[d].regionName,\n            fillLabel: {\n              fontFamily: 'Impact',\n              valueFormatter: (d: number) =>\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\u00A0Tn`,\n            },\n            shape: {\n              fillColor: (key, sortIndex, node) => {\n                // concat all leaf and define the color based on the index of the fist children\n                const rootTree = node[PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node[CHILDREN_KEY][0]));\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\n              },\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node) => {\n                // concat all leaf and define the color based on their index\n                const rootTree = node[PARENT_KEY][PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\n\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\n              },\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} />\\n      <Tooltip\\n        placement={customKnobs.enum.placement('Tooltip placement')}\\n        fallbackPlacements={customKnobs.enum.fallbackPlacements()}\\n        boundary={customKnobs.enum.boundary()}\\n        customTooltip={boolean('Custom Tooltip', false) ? CustomTooltip : undefined}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.sunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            fillLabel: {\\n              fontFamily: 'Impact',\\n              valueFormatter: (d: number) =>\\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\\\u00A0Tn`,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on the index of the fist children\\n                const rootTree = node[PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node[CHILDREN_KEY][0]));\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on their index\\n                const rootTree = node[PARENT_KEY][PARENT_KEY][CHILDREN_KEY].flatMap((d) => entryValue(d)[CHILDREN_KEY]);\\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\\n\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AdditiveNumber,\\n  ArrayEntry,\\n  Chart,\\n  Datum,\\n  Partition,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { discreteColor, countryLookup, colorBrewerCategoricalPastel12B } from '../utils/utils';\\n\\nconst categoricalColors = colorBrewerCategoricalPastel12B.slice(3);\\n\\nconst data = [\\n  { region: 'Americas', dest: 'usa', other: false, exportVal: 553359100104 },\\n  { region: 'Americas', dest: 'Other', other: true, exportVal: 753359100104 },\\n  { region: 'Asia', dest: 'chn', other: false, exportVal: 392617281424 },\\n  { region: 'Asia', dest: 'jpn', other: false, exportVal: 177490158520 },\\n  { region: 'Asia', dest: 'kor', other: false, exportVal: 177421375512 },\\n  { region: 'Asia', dest: 'Other', other: true, exportVal: 277421375512 },\\n  { region: 'Europe', dest: 'deu', other: false, exportVal: 253250650864 },\\n  { region: 'Europe', dest: 'smr', other: false, exportVal: 135443006088 },\\n  { region: 'Europe', dest: 'Other', other: true, exportVal: 205443006088 },\\n  { region: 'Africa', dest: 'Other', other: true, exportVal: 305443006088 },\\n];\\n\\nconst sortPredicate = ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\\n  // unconditionally put \\\"Other\\\" to the end (as the \\\"Other\\\" slice may be larger than a regular slice, yet should be at the end)\\n  if (name1 === 'Other' && name2 !== 'Other') return 1;\\n  if (name2 === 'Other' && name1 !== 'Other') return -1;\\n\\n  // otherwise, use the decreasing value order\\n  return node2.value - node1.value;\\n};\\n\\n/* Equivalent, since math ops cleanly coerce false, true to 0, 1\\nconst sortPredicate = ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) =>\\n  (name1 === 'Other') - (name2 === 'Other') || node2.value - node1.value;\\n*/\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const sortPredicateEnabled = boolean('Move \\\"Other\\\" to end', true);\\n  const clockwiseSectors = boolean('clockwiseSectors', true);\\n  const specialFirstInnermostSector = boolean('specialFirstInnermostSector', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          partition: { outerSizeRatio: 0.96 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.region,\\n            nodeLabel: (d: any) => d,\\n            fillLabel: {\\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`,\\n              fontWeight: 600,\\n              fontStyle: 'italic',\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(categoricalColors)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\\n            sortPredicate: sortPredicateEnabled ? sortPredicate : null,\\n            fillLabel: {\\n              fontWeight: 600,\\n              fontStyle: 'italic',\\n              maxFontSize: 16,\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => discreteColor(categoricalColors, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n        clockwiseSectors={clockwiseSectors}\\n        specialFirstInnermostSector={specialFirstInnermostSector}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":55},\"endLoc\":{\"col\":1,\"line\":115},\"startBody\":{\"col\":36,\"line\":55},\"endBody\":{\"col\":1,\"line\":115}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AdditiveNumber,\n  ArrayEntry,\n  Chart,\n  Datum,\n  Partition,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { discreteColor, countryLookup, colorBrewerCategoricalPastel12B } from '../utils/utils';\n\nconst categoricalColors = colorBrewerCategoricalPastel12B.slice(3);\n\nconst data = [\n  { region: 'Americas', dest: 'usa', other: false, exportVal: 553359100104 },\n  { region: 'Americas', dest: 'Other', other: true, exportVal: 753359100104 },\n  { region: 'Asia', dest: 'chn', other: false, exportVal: 392617281424 },\n  { region: 'Asia', dest: 'jpn', other: false, exportVal: 177490158520 },\n  { region: 'Asia', dest: 'kor', other: false, exportVal: 177421375512 },\n  { region: 'Asia', dest: 'Other', other: true, exportVal: 277421375512 },\n  { region: 'Europe', dest: 'deu', other: false, exportVal: 253250650864 },\n  { region: 'Europe', dest: 'smr', other: false, exportVal: 135443006088 },\n  { region: 'Europe', dest: 'Other', other: true, exportVal: 205443006088 },\n  { region: 'Africa', dest: 'Other', other: true, exportVal: 305443006088 },\n];\n\nconst sortPredicate = ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) => {\n  // unconditionally put \"Other\" to the end (as the \"Other\" slice may be larger than a regular slice, yet should be at the end)\n  if (name1 === 'Other' && name2 !== 'Other') return 1;\n  if (name2 === 'Other' && name1 !== 'Other') return -1;\n\n  // otherwise, use the decreasing value order\n  return node2.value - node1.value;\n};\n\n/* Equivalent, since math ops cleanly coerce false, true to 0, 1\nconst sortPredicate = ([name1, node1]: ArrayEntry, [name2, node2]: ArrayEntry) =>\n  (name1 === 'Other') - (name2 === 'Other') || node2.value - node1.value;\n*/\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const sortPredicateEnabled = boolean('Move \"Other\" to end', true);\n  const clockwiseSectors = boolean('clockwiseSectors', true);\n  const specialFirstInnermostSector = boolean('specialFirstInnermostSector', false);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{\n          partition: { outerSizeRatio: 0.96 },\n        }}\n        baseTheme={useBaseTheme()}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={data}\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.region,\n            nodeLabel: (d: any) => d,\n            fillLabel: {\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`,\n              fontWeight: 600,\n              fontStyle: 'italic',\n              valueFont: {\n                fontFamily: 'Menlo',\n                fontStyle: 'normal',\n                fontWeight: 100,\n              },\n            },\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(categoricalColors)(sortIndex),\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\n            sortPredicate: sortPredicateEnabled ? sortPredicate : null,\n            fillLabel: {\n              fontWeight: 600,\n              fontStyle: 'italic',\n              maxFontSize: 16,\n              valueFont: {\n                fontFamily: 'Menlo',\n                fontStyle: 'normal',\n                fontWeight: 100,\n              },\n            },\n            shape: {\n              fillColor: (key, sortIndex, node) => discreteColor(categoricalColors, 0.5)(node.parent.sortIndex),\n            },\n          },\n        ]}\n        clockwiseSectors={clockwiseSectors}\n        specialFirstInnermostSector={specialFirstInnermostSector}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const sortPredicateEnabled = boolean('Move \\\"Other\\\" to end', true);\\n  const clockwiseSectors = boolean('clockwiseSectors', true);\\n  const specialFirstInnermostSector = boolean('specialFirstInnermostSector', false);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{\\n          partition: { outerSizeRatio: 0.96 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        valueAccessor={(d: Datum) => d.exportVal as AdditiveNumber}\\n        valueFormatter={(d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.region,\\n            nodeLabel: (d: any) => d,\\n            fillLabel: {\\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}`,\\n              fontWeight: 600,\\n              fontStyle: 'italic',\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(categoricalColors)(sortIndex),\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d]?.name ?? d,\\n            sortPredicate: sortPredicateEnabled ? sortPredicate : null,\\n            fillLabel: {\\n              fontWeight: 600,\\n              fontStyle: 'italic',\\n              maxFontSize: 16,\\n              valueFont: {\\n                fontFamily: 'Menlo',\\n                fontStyle: 'normal',\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => discreteColor(categoricalColors, 0.5)(node.parent.sortIndex),\\n            },\\n          },\\n        ]}\\n        clockwiseSectors={clockwiseSectors}\\n        specialFirstInnermostSector={specialFirstInnermostSector}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { discreteColor, colorBrewerCategoricalPastel12, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.9 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            fontWeight: 100,\\n            fontStyle: 'italic',\\n            valueFont: {\\n              fontFamily: 'Menlo',\\n              fontStyle: 'normal',\\n              fontWeight: 900,\\n            },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { discreteColor, colorBrewerCategoricalPastel12, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { outerSizeRatio: 0.9 },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          fillLabel: {\n            fontWeight: 100,\n            fontStyle: 'italic',\n            valueFont: {\n              fontFamily: 'Menlo',\n              fontStyle: 'normal',\n              fontWeight: 900,\n            },\n          },\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { outerSizeRatio: 0.9 },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            fontWeight: 100,\\n            fontStyle: 'italic',\\n            valueFont: {\\n              fontFamily: 'Menlo',\\n              fontStyle: 'normal',\\n              fontWeight: 900,\\n            },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 32,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 0.9,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":44},\"endLoc\":{\"col\":1,\"line\":65},\"startBody\":{\"col\":36,\"line\":44},\"endBody\":{\"col\":1,\"line\":65}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 32,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 0.9,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartPaddings: { left: 160 },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 32,\\n        fontSize: 14,\\n      },\\n      fontFamily: 'Arial',\\n      fillLabel: {\\n        fontStyle: 'italic',\\n      },\\n      minFontSize: 1,\\n      idealFontSizeJump: 1.1,\\n      outerSizeRatio: 0.9,\\n      // the `emptySizeRatio` prop controls the inner size of the donut\\n      emptySizeRatio: 0.4,\\n      circlePadding: 4,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":26},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":26},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const theme: PartialTheme = {\n    chartPaddings: { left: 160 },\n    partition: {\n      linkLabel: {\n        maxCount: 32,\n        fontSize: 14,\n      },\n      fontFamily: 'Arial',\n      fillLabel: {\n        fontStyle: 'italic',\n      },\n      minFontSize: 1,\n      idealFontSizeJump: 1.1,\n      outerSizeRatio: 0.9,\n      // the `emptySizeRatio` prop controls the inner size of the donut\n      emptySizeRatio: 0.4,\n      circlePadding: 4,\n    },\n  };\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const theme: PartialTheme = {\\n    chartPaddings: { left: 160 },\\n    partition: {\\n      linkLabel: {\\n        maxCount: 32,\\n        fontSize: 14,\\n      },\\n      fontFamily: 'Arial',\\n      fillLabel: {\\n        fontStyle: 'italic',\\n      },\\n      minFontSize: 1,\\n      idealFontSizeJump: 1.1,\\n      outerSizeRatio: 0.9,\\n      // the `emptySizeRatio` prop controls the inner size of the donut\\n      emptySizeRatio: 0.4,\\n      circlePadding: 4,\\n    },\\n  };\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings theme={theme} baseTheme={useBaseTheme()} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":40},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":40}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { linkLabel: { maximumSection: 10000 } },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings\n      theme={{\n        partition: { linkLabel: { maximumSection: 10000 } },\n      }}\n      baseTheme={useBaseTheme()}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={[\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\n      ]}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings\\n      theme={{\\n        partition: { linkLabel: { maximumSection: 10000 } },\\n      }}\\n      baseTheme={useBaseTheme()}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={[\\n        { sitc1: 'Machinery and transport equipment', exportVal: 5 },\\n        { sitc1: 'Mineral fuels, lubricants and related materials', exportVal: 4 },\\n      ]}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d))}`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description} size={{ height: 180 }}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      theme={{\\n        chartPaddings: { left: 160 },\\n      }}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((d, i) => ({ ...d, exportVal: i === 2 || i === 3 ? 0 : d.exportVal }))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description} size={{ height: 180 }}>\n    <Settings\n      baseTheme={useBaseTheme()}\n      theme={{\n        chartPaddings: { left: 160 },\n      }}\n    />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.map((d, i) => ({ ...d, exportVal: i === 2 || i === 3 ? 0 : d.exportVal }))}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description} size={{ height: 180 }}>\\n    <Settings\\n      baseTheme={useBaseTheme()}\\n      theme={{\\n        chartPaddings: { left: 160 },\\n      }}\\n    />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((d, i) => ({ ...d, exportVal: i === 2 || i === 3 ? 0 : d.exportVal }))}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  entryValue,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 0.95,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} debug={showDebug} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.sunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            fillLabel: {\\n              fontFamily: 'Impact',\\n              valueFormatter: (d: number) =>\\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\\\u00A0Tn`,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on the index of the fist children\\n                const rootTree = node.parent.children.flatMap((d) => entryValue(d).children);\\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node.children[0]));\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on their index\\n                const rootTree = node.parent.parent.children.flatMap((d) => entryValue(d).children);\\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":46},\"endLoc\":{\"col\":1,\"line\":91},\"startBody\":{\"col\":36,\"line\":46},\"endBody\":{\"col\":1,\"line\":91}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  entryValue,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 0.95,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showDebug = boolean('show table for debugging', false);\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} debug={showDebug} />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.sunburst}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n            nodeLabel: (d: any) => regionLookup[d].regionName,\n            fillLabel: {\n              fontFamily: 'Impact',\n              valueFormatter: (d: number) =>\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\u00A0Tn`,\n            },\n            shape: {\n              fillColor: (key, sortIndex, node) => {\n                // concat all leaf and define the color based on the index of the fist children\n                const rootTree = node.parent.children.flatMap((d) => entryValue(d).children);\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node.children[0]));\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\n              },\n            },\n          },\n          {\n            groupByRollup: (d: Datum) => d.dest,\n            nodeLabel: (d: any) => countryLookup[d].name,\n            shape: {\n              fillColor: (key, sortIndex, node) => {\n                // concat all leaf and define the color based on their index\n                const rootTree = node.parent.parent.children.flatMap((d) => entryValue(d).children);\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\n              },\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend legendMaxDepth={1} theme={theme} baseTheme={useBaseTheme()} debug={showDebug} />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.sunburst}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n            nodeLabel: (d: any) => regionLookup[d].regionName,\\n            fillLabel: {\\n              fontFamily: 'Impact',\\n              valueFormatter: (d: number) =>\\n                `$${defaultPartitionValueFormatter(Math.round(d / 1000000000000))}\\\\u00A0Tn`,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on the index of the fist children\\n                const rootTree = node.parent.children.flatMap((d) => entryValue(d).children);\\n                const index = rootTree.findIndex((d) => entryValue(d) === entryValue(node.children[0]));\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n          {\\n            groupByRollup: (d: Datum) => d.dest,\\n            nodeLabel: (d: any) => countryLookup[d].name,\\n            shape: {\\n              fillColor: (key, sortIndex, node) => {\\n                // concat all leaf and define the color based on their index\\n                const rootTree = node.parent.parent.children.flatMap((d) => entryValue(d).children);\\n                const index = rootTree.findIndex((d) => entryValue(d) === node);\\n                return indexInterpolatedFillColor(interpolatorCET2s(0.8))(null, index, rootTree);\\n              },\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  colorBrewerCategoricalStark9,\\n  countryLookup,\\n  discreteColor,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    linkLabel: {\\n      maxCount: 0,\\n      fontSize: 14,\\n    },\\n    fontFamily: 'Arial',\\n    fillLabel: {\\n      fontStyle: 'italic',\\n      fontWeight: 900,\\n      valueFont: {\\n        fontFamily: 'Menlo',\\n        fontStyle: 'normal',\\n        fontWeight: 100,\\n      },\\n    },\\n    minFontSize: 1,\\n    idealFontSizeJump: 1.1,\\n    outerSizeRatio: 1,\\n    emptySizeRatio: 0,\\n    circlePadding: 4,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend legendStrategy=\\\"pathWithDescendants\\\" theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 1', true) },\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 2', true) },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":57},\"endLoc\":{\"col\":1,\"line\":96},\"startBody\":{\"col\":36,\"line\":57},\"endBody\":{\"col\":1,\"line\":96}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  colorBrewerCategoricalStark9,\n  countryLookup,\n  discreteColor,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    linkLabel: {\n      maxCount: 0,\n      fontSize: 14,\n    },\n    fontFamily: 'Arial',\n    fillLabel: {\n      fontStyle: 'italic',\n      fontWeight: 900,\n      valueFont: {\n        fontFamily: 'Menlo',\n        fontStyle: 'normal',\n        fontWeight: 100,\n      },\n    },\n    minFontSize: 1,\n    idealFontSizeJump: 1.1,\n    outerSizeRatio: 1,\n    emptySizeRatio: 0,\n    circlePadding: 4,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend legendStrategy=\"pathWithDescendants\" theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.miniSunburst}\n      layout={PartitionLayout.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 1', true) },\n          shape: {\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 2', true) },\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend legendStrategy=\\\"pathWithDescendants\\\" theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.miniSunburst}\\n      layout={PartitionLayout.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d) => (d !== null ? productLookup[d].name : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 1', true) },\\n          shape: {\\n            fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalStark9, 0.7)(sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d) => (d !== null ? regionLookup[d].regionName : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 2', true) },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.5)(node.parent.sortIndex),\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d) => (d !== null ? countryLookup[d].name : ''),\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              discreteColor(colorBrewerCategoricalStark9, 0.3)(node.parent.parent.sortIndex),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Sunburst',\n};\n\nexport { Example as mostBasic } from './1_simple.story';\nexport { Example as valueFormatted } from './2_value_formatted.story';\nexport { Example as valueFormattedWithCategoricalColorPalette } from './3_value_formatted_2.story';\nexport { Example as withFillLabels } from './4_fill_labels.story';\nexport { Example as donutChartWithFillLabels } from './5_donut.story';\nexport { Example as withDirectTextLabels } from './6_pie_chart_labels.story';\nexport { Example as withLinkedTextLabels } from './6_pie_chart_linked_labels.story';\nexport { Example as someZeroValueSlice } from './7_zero_slice.story';\nexport { Example as sunburstWithTwoLayers } from './8_sunburst_two_layers.story';\nexport { Example as sunburstWithThreeLayers } from './9_sunburst_three_layers.story';\n\nexport { Example as withTwoSlices } from './10_2_slice.story';\nexport { Example as largeAndSmallSlices } from './11_small_large.story';\nexport { Example as veryLargeAndSmall } from './12_very_small.story';\nexport { Example as nearFullNearEmpty } from './13_empty.story';\nexport { Example as fullAndZeroSlices } from './14_full_zero.story';\nexport { Example as singleSlice } from './15_single.story';\nexport { Example as singleSunburst } from './15_single_sunburst.story';\nexport { Example as singleSmallSice } from './16_single_small.story';\nexport { Example as singleVerySmall } from './17_single_very_small.story';\nexport { Example as noSlice } from './18_no_sliced.story';\nexport { Example as negative } from './19_negative.story';\n\nexport { Example as totalZero } from './20_total_zero.story';\nexport { Example as highNumberOfSlices } from './21_high_pie.story';\nexport { Example as counterClockwiseSpecial } from './22_counter_clockwise.story';\nexport { Example as clockwiseNoSpecial } from './23_clockwise.story';\nexport { Example as linkedLabelsOnly } from './24_linked_label.story';\nexport { Example as noLabels } from './25_no_labels.story';\nexport { Example as percentage } from './26_percentage.story';\nexport { Example as heterogeneous } from './27_heterogeneous_depth.story';\nexport { Example as notANumber } from './28_not_a_number.story';\nexport { Example as customStroke } from './29_custom_stroke.story';\nexport { Example as largestCircle } from './30_largest_circle.story';\nexport { Example as boldLinkValue } from './31_bold_link_value.story';\nexport { Example as customTooltip } from './32_custom_tooltip.story';\nexport { Example as orderedSlices } from './33_ordered_slices.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} showLegend />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} />\\n\\n      <LineSeries\\n        id=\\\"Sensor 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={[\\n          [0, 1],\\n          [1, 0.8],\\n          [2, 0.5],\\n          [3, 0.12],\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"Sensor 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={[\\n          [0, 1],\\n          [1, 0.8],\\n          [2, 0.76],\\n          [3, 0.12],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\\nExample.parameters = {\\n  markdown: 'Currently not correctly rendered due to [#1921](https://github.com/elastic/elastic-charts/issues/1921)',\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":51},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":51}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Axis, Chart, LineSeries, Position, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} showLegend />\n      <Axis id=\"bottom\" position={Position.Bottom} />\n      <Axis id=\"left\" position={Position.Left} />\n\n      <LineSeries\n        id=\"Sensor 1\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={[\n          [0, 1],\n          [1, 0.8],\n          [2, 0.5],\n          [3, 0.12],\n        ]}\n      />\n      <LineSeries\n        id=\"Sensor 2\"\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={[\n          [0, 1],\n          [1, 0.8],\n          [2, 0.76],\n          [3, 0.12],\n        ]}\n      />\n    </Chart>\n  );\n};\n\nExample.parameters = {\n  markdown: 'Currently not correctly rendered due to [#1921](https://github.com/elastic/elastic-charts/issues/1921)',\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} showLegend />\\n      <Axis id=\\\"bottom\\\" position={Position.Bottom} />\\n      <Axis id=\\\"left\\\" position={Position.Left} />\\n\\n      <LineSeries\\n        id=\\\"Sensor 1\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={[\\n          [0, 1],\\n          [1, 0.8],\\n          [2, 0.5],\\n          [3, 0.12],\\n        ]}\\n      />\\n      <LineSeries\\n        id=\\\"Sensor 2\\\"\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={[\\n          [0, 1],\\n          [1, 0.8],\\n          [2, 0.76],\\n          [3, 0.12],\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui';\\nimport { boolean, text } from '@storybook/addon-knobs';\\nimport React, { FC } from 'react';\\n\\nimport { Chart, Settings, Axis, Position } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst NoResults: FC<{ msg: string }> = ({ msg }) => (\\n  <EuiFlexItem>\\n    <EuiFlexGroup gutterSize=\\\"s\\\" direction=\\\"column\\\" alignItems=\\\"center\\\" justifyContent=\\\"center\\\">\\n      <EuiIcon type=\\\"visualizeApp\\\" />\\n      <p>{msg}</p>\\n    </EuiFlexGroup>\\n  </EuiFlexItem>\\n);\\n\\n/**\\n * Should render no data value\\n */\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customNoResults = boolean('Show custom no results', true);\\n  const noResultsMsg = text('Custom No Results message', 'No Results');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Axis id=\\\"count\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <Settings noResults={customNoResults ? <NoResults msg={noResultsMsg} /> : undefined} baseTheme={useBaseTheme()} />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":30},\"endLoc\":{\"col\":1,\"line\":41},\"startBody\":{\"col\":36,\"line\":30},\"endBody\":{\"col\":1,\"line\":41}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui';\nimport { boolean, text } from '@storybook/addon-knobs';\nimport React, { FC } from 'react';\n\nimport { Chart, Settings, Axis, Position } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst NoResults: FC<{ msg: string }> = ({ msg }) => (\n  <EuiFlexItem>\n    <EuiFlexGroup gutterSize=\"s\" direction=\"column\" alignItems=\"center\" justifyContent=\"center\">\n      <EuiIcon type=\"visualizeApp\" />\n      <p>{msg}</p>\n    </EuiFlexGroup>\n  </EuiFlexItem>\n);\n\n/**\n * Should render no data value\n */\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customNoResults = boolean('Show custom no results', true);\n  const noResultsMsg = text('Custom No Results message', 'No Results');\n\n  return (\n    <Chart title={title} description={description}>\n      <Axis id=\"count\" title=\"count\" position={Position.Left} />\n      <Axis id=\"x\" title=\"goods\" position={Position.Bottom} />\n      <Settings noResults={customNoResults ? <NoResults msg={noResultsMsg} /> : undefined} baseTheme={useBaseTheme()} />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customNoResults = boolean('Show custom no results', true);\\n  const noResultsMsg = text('Custom No Results message', 'No Results');\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Axis id=\\\"count\\\" title=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"x\\\" title=\\\"goods\\\" position={Position.Bottom} />\\n      <Settings noResults={customNoResults ? <NoResults msg={noResultsMsg} /> : undefined} baseTheme={useBaseTheme()} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  LineSeries,\\n  Axis,\\n  BarSeries,\\n  Chart,\\n  ScaleType,\\n  Settings,\\n  Position,\\n  HistogramBarSeries,\\n  niceTimeFormatter,\\n} from '@elastic/charts';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst rng = getRandomNumberGenerator('chart');\\nconst start = Date.parse('2023-07-01T00:00:00.000Z').valueOf();\\nconst interval = 1000 * 60 * 5;\\nconst data = Array.from({ length: 20 }, (d, i) => {\\n  return [start + interval * i, Math.floor(rng(2, 10))];\\n});\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const customDomain = boolean('custom domain', false);\\n  const startTimeSlider = number('start time', 0, { min: 0, max: 20, range: true, step: 0.2 });\\n  const rangeSlider = number('end time', 19, { min: 1, max: 25, range: true, step: 0.2 });\\n  const subtract = boolean('subtract 1ms', false);\\n\\n  const tickFormat = (d: number) => new Date(d).toISOString();\\n  const xDomain = customDomain\\n    ? { min: start + interval * startTimeSlider, max: start + interval * rangeSlider - (subtract ? 1 : 0) }\\n    : undefined;\\n  const domain: [number, number] = [xDomain?.min ?? data[0][0] ?? 0, xDomain?.max ?? data.at(-1)?.[0] ?? 0];\\n  const limitedData = data\\n    .filter((d) => d[0] <= (xDomain?.max ?? Infinity))\\n    .map((d, i) => [d[0], i === 10 ? null : d[1]]);\\n\\n  return (\\n    <>\\n      <p>\\n        {xDomain ? 'configured' : 'data'} domain: {new Date(domain[0]).toISOString()} to{' '}\\n        {new Date(domain[1]).toISOString()}\\n      </p>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          showLegend\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0,\\n            },\\n            barSeriesStyle: {\\n              rectBorder: {\\n                visible: true,\\n                strokeWidth: 0,\\n                stroke: 'white',\\n              },\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          tickFormat={tickFormat}\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'left' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <HistogramBarSeries\\n          id=\\\"Area\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n          color=\\\"#FF6666\\\"\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegend\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          tickFormat={tickFormat}\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'left' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <LineSeries\\n          id=\\\"Line\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          showLegend\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0.2,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'center' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n          tickFormat={(d) => niceTimeFormatter(domain)(d, { timeZone: 'UTC' })}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <BarSeries\\n          id=\\\"Categorical\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n        />\\n      </Chart>\\n    </>\\n  );\\n};\\n\\nExample.parameters = {\\n  resize: {\\n    height: '100%',\\n    maxHeight: '100%',\\n    overflow: 'hidden',\\n    resize: 'none',\\n  },\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":213},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":213}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  LineSeries,\n  Axis,\n  BarSeries,\n  Chart,\n  ScaleType,\n  Settings,\n  Position,\n  HistogramBarSeries,\n  niceTimeFormatter,\n} from '@elastic/charts';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst rng = getRandomNumberGenerator('chart');\nconst start = Date.parse('2023-07-01T00:00:00.000Z').valueOf();\nconst interval = 1000 * 60 * 5;\nconst data = Array.from({ length: 20 }, (d, i) => {\n  return [start + interval * i, Math.floor(rng(2, 10))];\n});\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const customDomain = boolean('custom domain', false);\n  const startTimeSlider = number('start time', 0, { min: 0, max: 20, range: true, step: 0.2 });\n  const rangeSlider = number('end time', 19, { min: 1, max: 25, range: true, step: 0.2 });\n  const subtract = boolean('subtract 1ms', false);\n\n  const tickFormat = (d: number) => new Date(d).toISOString();\n  const xDomain = customDomain\n    ? { min: start + interval * startTimeSlider, max: start + interval * rangeSlider - (subtract ? 1 : 0) }\n    : undefined;\n  const domain: [number, number] = [xDomain?.min ?? data[0][0] ?? 0, xDomain?.max ?? data.at(-1)?.[0] ?? 0];\n  const limitedData = data\n    .filter((d) => d[0] <= (xDomain?.max ?? Infinity))\n    .map((d, i) => [d[0], i === 10 ? null : d[1]]);\n\n  return (\n    <>\n      <p>\n        {xDomain ? 'configured' : 'data'} domain: {new Date(domain[0]).toISOString()} to{' '}\n        {new Date(domain[1]).toISOString()}\n      </p>\n      <Chart title={title} description={description} size={['100%', 250]}>\n        <Settings\n          baseTheme={useBaseTheme()}\n          showLegend\n          legendPosition={{\n            floatingColumns: 1,\n            floating: true,\n            direction: 'vertical',\n            hAlign: 'right',\n            vAlign: 'top',\n          }}\n          showLegendExtra\n          xDomain={xDomain}\n          theme={{\n            scales: {\n              histogramPadding: 0,\n              barsPadding: 0,\n            },\n            barSeriesStyle: {\n              rectBorder: {\n                visible: true,\n                strokeWidth: 0,\n                stroke: 'white',\n              },\n            },\n          }}\n        />\n        <Axis\n          id=\"x\"\n          tickFormat={tickFormat}\n          position={Position.Bottom}\n          gridLine={{ visible: true }}\n          timeAxisLayerCount={2}\n          style={{\n            tickLabel: {\n              alignment: { horizontal: 'left' },\n              padding: 0,\n            },\n            tickLine: {\n              visible: true,\n              padding: 0,\n              size: 5,\n            },\n          }}\n        />\n        <Axis id=\"y\" position={Position.Left} gridLine={{ visible: true }} />\n        <HistogramBarSeries\n          id=\"Area\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={limitedData}\n          timeZone=\"UTC\"\n          color=\"#FF6666\"\n        />\n      </Chart>\n      <Chart title={title} description={description} size={['100%', 250]}>\n        <Settings\n          baseTheme={useBaseTheme()}\n          legendPosition={{\n            floatingColumns: 1,\n            floating: true,\n            direction: 'vertical',\n            hAlign: 'right',\n            vAlign: 'top',\n          }}\n          showLegend\n          showLegendExtra\n          xDomain={xDomain}\n          theme={{\n            scales: {\n              histogramPadding: 0,\n              barsPadding: 0,\n            },\n          }}\n        />\n        <Axis\n          id=\"x\"\n          tickFormat={tickFormat}\n          position={Position.Bottom}\n          gridLine={{ visible: true }}\n          timeAxisLayerCount={2}\n          style={{\n            tickLabel: {\n              alignment: { horizontal: 'left' },\n              padding: 0,\n            },\n            tickLine: {\n              visible: true,\n              padding: 0,\n              size: 5,\n            },\n          }}\n        />\n        <Axis id=\"y\" position={Position.Left} gridLine={{ visible: true }} />\n        <LineSeries\n          id=\"Line\"\n          xScaleType={ScaleType.Time}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={limitedData}\n          timeZone=\"UTC\"\n        />\n      </Chart>\n      <Chart title={title} description={description} size={['100%', 250]}>\n        <Settings\n          baseTheme={useBaseTheme()}\n          showLegend\n          legendPosition={{\n            floatingColumns: 1,\n            floating: true,\n            direction: 'vertical',\n            hAlign: 'right',\n            vAlign: 'top',\n          }}\n          showLegendExtra\n          xDomain={xDomain}\n          theme={{\n            scales: {\n              histogramPadding: 0,\n              barsPadding: 0.2,\n            },\n          }}\n        />\n        <Axis\n          id=\"x\"\n          position={Position.Bottom}\n          gridLine={{ visible: true }}\n          timeAxisLayerCount={2}\n          style={{\n            tickLabel: {\n              alignment: { horizontal: 'center' },\n              padding: 0,\n            },\n            tickLine: {\n              visible: true,\n              padding: 0,\n              size: 5,\n            },\n          }}\n          tickFormat={(d) => niceTimeFormatter(domain)(d, { timeZone: 'UTC' })}\n        />\n        <Axis id=\"y\" position={Position.Left} gridLine={{ visible: true }} />\n        <BarSeries\n          id=\"Categorical\"\n          xScaleType={ScaleType.Ordinal}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={limitedData}\n          timeZone=\"UTC\"\n        />\n      </Chart>\n    </>\n  );\n};\n\nExample.parameters = {\n  resize: {\n    height: '100%',\n    maxHeight: '100%',\n    overflow: 'hidden',\n    resize: 'none',\n  },\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const customDomain = boolean('custom domain', false);\\n  const startTimeSlider = number('start time', 0, { min: 0, max: 20, range: true, step: 0.2 });\\n  const rangeSlider = number('end time', 19, { min: 1, max: 25, range: true, step: 0.2 });\\n  const subtract = boolean('subtract 1ms', false);\\n\\n  const tickFormat = (d: number) => new Date(d).toISOString();\\n  const xDomain = customDomain\\n    ? { min: start + interval * startTimeSlider, max: start + interval * rangeSlider - (subtract ? 1 : 0) }\\n    : undefined;\\n  const domain: [number, number] = [xDomain?.min ?? data[0][0] ?? 0, xDomain?.max ?? data.at(-1)?.[0] ?? 0];\\n  const limitedData = data\\n    .filter((d) => d[0] <= (xDomain?.max ?? Infinity))\\n    .map((d, i) => [d[0], i === 10 ? null : d[1]]);\\n\\n  return (\\n    <>\\n      <p>\\n        {xDomain ? 'configured' : 'data'} domain: {new Date(domain[0]).toISOString()} to{' '}\\n        {new Date(domain[1]).toISOString()}\\n      </p>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          showLegend\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0,\\n            },\\n            barSeriesStyle: {\\n              rectBorder: {\\n                visible: true,\\n                strokeWidth: 0,\\n                stroke: 'white',\\n              },\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          tickFormat={tickFormat}\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'left' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <HistogramBarSeries\\n          id=\\\"Area\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n          color=\\\"#FF6666\\\"\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegend\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          tickFormat={tickFormat}\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'left' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <LineSeries\\n          id=\\\"Line\\\"\\n          xScaleType={ScaleType.Time}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n        />\\n      </Chart>\\n      <Chart title={title} description={description} size={['100%', 250]}>\\n        <Settings\\n          baseTheme={useBaseTheme()}\\n          showLegend\\n          legendPosition={{\\n            floatingColumns: 1,\\n            floating: true,\\n            direction: 'vertical',\\n            hAlign: 'right',\\n            vAlign: 'top',\\n          }}\\n          showLegendExtra\\n          xDomain={xDomain}\\n          theme={{\\n            scales: {\\n              histogramPadding: 0,\\n              barsPadding: 0.2,\\n            },\\n          }}\\n        />\\n        <Axis\\n          id=\\\"x\\\"\\n          position={Position.Bottom}\\n          gridLine={{ visible: true }}\\n          timeAxisLayerCount={2}\\n          style={{\\n            tickLabel: {\\n              alignment: { horizontal: 'center' },\\n              padding: 0,\\n            },\\n            tickLine: {\\n              visible: true,\\n              padding: 0,\\n              size: 5,\\n            },\\n          }}\\n          tickFormat={(d) => niceTimeFormatter(domain)(d, { timeZone: 'UTC' })}\\n        />\\n        <Axis id=\\\"y\\\" position={Position.Left} gridLine={{ visible: true }} />\\n        <BarSeries\\n          id=\\\"Categorical\\\"\\n          xScaleType={ScaleType.Ordinal}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={limitedData}\\n          timeZone=\\\"UTC\\\"\\n        />\\n      </Chart>\\n    </>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport moment from 'moment';\\nimport React from 'react';\\n\\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const data = [\\n    { g: 'css', x: 1614092400000, y: 13 },\\n    { g: 'css', x: 1614103200000, y: 17 },\\n    { g: 'css', x: 1614114000000, y: 9 },\\n    { g: 'css', x: 1614124800000, y: 3 },\\n    { g: 'css', x: 1614135600000, y: 1 },\\n    { g: 'css', x: 1614146400000, y: 0 },\\n    { g: 'css', x: 1614157200000, y: 0 },\\n    { g: 'css', x: 1614168000000, y: 4 },\\n    { g: 'css', x: 1614178800000, y: 14 },\\n    { g: 'css', x: 1614189600000, y: 6 },\\n    { g: 'css', x: 1614200400000, y: 8 },\\n    { g: 'css', x: 1614211200000, y: 2 },\\n    { g: 'css', x: 1614222000000, y: 1 },\\n    { g: 'css', x: 1614232800000, y: 0 },\\n    { g: 'css', x: 1614243600000, y: 0 },\\n    { g: 'css', x: 1614254400000, y: 3 },\\n    { g: 'css', x: 1614265200000, y: 11 },\\n    { g: 'css', x: 1614276000000, y: null },\\n    { g: 'css', x: 1614286800000, y: 6 },\\n    { g: 'css', x: 1614297600000, y: 3 },\\n    { g: 'css', x: 1614308400000, y: 0 },\\n    { g: 'css', x: 1614319200000, y: 0 },\\n    { g: 'css', x: 1614330000000, y: 2 },\\n    { g: 'css', x: 1614340800000, y: 3 },\\n    { g: 'css', x: 1614351600000, y: 6 },\\n    { g: 'gz', x: 1614092400000, y: 15 },\\n    { g: 'gz', x: 1614103200000, y: 16 },\\n    { g: 'gz', x: 1614114000000, y: 7 },\\n    { g: 'gz', x: 1614124800000, y: 4 },\\n    { g: 'gz', x: 1614135600000, y: 1 },\\n    { g: 'gz', x: 1614146400000, y: 0 },\\n    { g: 'gz', x: 1614157200000, y: 1 },\\n    { g: 'gz', x: 1614168000000, y: 6 },\\n    { g: 'gz', x: 1614178800000, y: 9 },\\n    { g: 'gz', x: 1614189600000, y: 5 },\\n    { g: 'gz', x: 1614200400000, y: 6 },\\n    { g: 'gz', x: 1614211200000, y: 7 },\\n    { g: 'gz', x: 1614222000000, y: 1 },\\n    { g: 'gz', x: 1614232800000, y: 0 },\\n    { g: 'gz', x: 1614243600000, y: 2 },\\n    { g: 'gz', x: 1614254400000, y: 4 },\\n    { g: 'gz', x: 1614265200000, y: 20 },\\n    { g: 'gz', x: 1614276000000, y: null },\\n    { g: 'gz', x: 1614286800000, y: 12 },\\n    { g: 'gz', x: 1614297600000, y: 3 },\\n    { g: 'gz', x: 1614308400000, y: 0 },\\n    { g: 'gz', x: 1614319200000, y: 0 },\\n    { g: 'gz', x: 1614330000000, y: 2 },\\n    { g: 'gz', x: 1614340800000, y: 3 },\\n    { g: 'gz', x: 1614351600000, y: 9 },\\n  ].map((d) => ({ ...d, x: moment(d.x).valueOf() }));\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <AreaSeries\\n        id=\\\"test3\\\"\\n        stackMode=\\\"percentage\\\"\\n        xScaleType=\\\"time\\\"\\n        yScaleType={ScaleType.Linear}\\n        stackAccessors={['yes']}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":17},\"endLoc\":{\"col\":1,\"line\":87},\"startBody\":{\"col\":36,\"line\":17},\"endBody\":{\"col\":1,\"line\":87}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport moment from 'moment';\nimport React from 'react';\n\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const data = [\n    { g: 'css', x: 1614092400000, y: 13 },\n    { g: 'css', x: 1614103200000, y: 17 },\n    { g: 'css', x: 1614114000000, y: 9 },\n    { g: 'css', x: 1614124800000, y: 3 },\n    { g: 'css', x: 1614135600000, y: 1 },\n    { g: 'css', x: 1614146400000, y: 0 },\n    { g: 'css', x: 1614157200000, y: 0 },\n    { g: 'css', x: 1614168000000, y: 4 },\n    { g: 'css', x: 1614178800000, y: 14 },\n    { g: 'css', x: 1614189600000, y: 6 },\n    { g: 'css', x: 1614200400000, y: 8 },\n    { g: 'css', x: 1614211200000, y: 2 },\n    { g: 'css', x: 1614222000000, y: 1 },\n    { g: 'css', x: 1614232800000, y: 0 },\n    { g: 'css', x: 1614243600000, y: 0 },\n    { g: 'css', x: 1614254400000, y: 3 },\n    { g: 'css', x: 1614265200000, y: 11 },\n    { g: 'css', x: 1614276000000, y: null },\n    { g: 'css', x: 1614286800000, y: 6 },\n    { g: 'css', x: 1614297600000, y: 3 },\n    { g: 'css', x: 1614308400000, y: 0 },\n    { g: 'css', x: 1614319200000, y: 0 },\n    { g: 'css', x: 1614330000000, y: 2 },\n    { g: 'css', x: 1614340800000, y: 3 },\n    { g: 'css', x: 1614351600000, y: 6 },\n    { g: 'gz', x: 1614092400000, y: 15 },\n    { g: 'gz', x: 1614103200000, y: 16 },\n    { g: 'gz', x: 1614114000000, y: 7 },\n    { g: 'gz', x: 1614124800000, y: 4 },\n    { g: 'gz', x: 1614135600000, y: 1 },\n    { g: 'gz', x: 1614146400000, y: 0 },\n    { g: 'gz', x: 1614157200000, y: 1 },\n    { g: 'gz', x: 1614168000000, y: 6 },\n    { g: 'gz', x: 1614178800000, y: 9 },\n    { g: 'gz', x: 1614189600000, y: 5 },\n    { g: 'gz', x: 1614200400000, y: 6 },\n    { g: 'gz', x: 1614211200000, y: 7 },\n    { g: 'gz', x: 1614222000000, y: 1 },\n    { g: 'gz', x: 1614232800000, y: 0 },\n    { g: 'gz', x: 1614243600000, y: 2 },\n    { g: 'gz', x: 1614254400000, y: 4 },\n    { g: 'gz', x: 1614265200000, y: 20 },\n    { g: 'gz', x: 1614276000000, y: null },\n    { g: 'gz', x: 1614286800000, y: 12 },\n    { g: 'gz', x: 1614297600000, y: 3 },\n    { g: 'gz', x: 1614308400000, y: 0 },\n    { g: 'gz', x: 1614319200000, y: 0 },\n    { g: 'gz', x: 1614330000000, y: 2 },\n    { g: 'gz', x: 1614340800000, y: 3 },\n    { g: 'gz', x: 1614351600000, y: 9 },\n  ].map((d) => ({ ...d, x: moment(d.x).valueOf() }));\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <AreaSeries\n        id=\"test3\"\n        stackMode=\"percentage\"\n        xScaleType=\"time\"\n        yScaleType={ScaleType.Linear}\n        stackAccessors={['yes']}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        splitSeriesAccessors={['g']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const data = [\\n    { g: 'css', x: 1614092400000, y: 13 },\\n    { g: 'css', x: 1614103200000, y: 17 },\\n    { g: 'css', x: 1614114000000, y: 9 },\\n    { g: 'css', x: 1614124800000, y: 3 },\\n    { g: 'css', x: 1614135600000, y: 1 },\\n    { g: 'css', x: 1614146400000, y: 0 },\\n    { g: 'css', x: 1614157200000, y: 0 },\\n    { g: 'css', x: 1614168000000, y: 4 },\\n    { g: 'css', x: 1614178800000, y: 14 },\\n    { g: 'css', x: 1614189600000, y: 6 },\\n    { g: 'css', x: 1614200400000, y: 8 },\\n    { g: 'css', x: 1614211200000, y: 2 },\\n    { g: 'css', x: 1614222000000, y: 1 },\\n    { g: 'css', x: 1614232800000, y: 0 },\\n    { g: 'css', x: 1614243600000, y: 0 },\\n    { g: 'css', x: 1614254400000, y: 3 },\\n    { g: 'css', x: 1614265200000, y: 11 },\\n    { g: 'css', x: 1614276000000, y: null },\\n    { g: 'css', x: 1614286800000, y: 6 },\\n    { g: 'css', x: 1614297600000, y: 3 },\\n    { g: 'css', x: 1614308400000, y: 0 },\\n    { g: 'css', x: 1614319200000, y: 0 },\\n    { g: 'css', x: 1614330000000, y: 2 },\\n    { g: 'css', x: 1614340800000, y: 3 },\\n    { g: 'css', x: 1614351600000, y: 6 },\\n    { g: 'gz', x: 1614092400000, y: 15 },\\n    { g: 'gz', x: 1614103200000, y: 16 },\\n    { g: 'gz', x: 1614114000000, y: 7 },\\n    { g: 'gz', x: 1614124800000, y: 4 },\\n    { g: 'gz', x: 1614135600000, y: 1 },\\n    { g: 'gz', x: 1614146400000, y: 0 },\\n    { g: 'gz', x: 1614157200000, y: 1 },\\n    { g: 'gz', x: 1614168000000, y: 6 },\\n    { g: 'gz', x: 1614178800000, y: 9 },\\n    { g: 'gz', x: 1614189600000, y: 5 },\\n    { g: 'gz', x: 1614200400000, y: 6 },\\n    { g: 'gz', x: 1614211200000, y: 7 },\\n    { g: 'gz', x: 1614222000000, y: 1 },\\n    { g: 'gz', x: 1614232800000, y: 0 },\\n    { g: 'gz', x: 1614243600000, y: 2 },\\n    { g: 'gz', x: 1614254400000, y: 4 },\\n    { g: 'gz', x: 1614265200000, y: 20 },\\n    { g: 'gz', x: 1614276000000, y: null },\\n    { g: 'gz', x: 1614286800000, y: 12 },\\n    { g: 'gz', x: 1614297600000, y: 3 },\\n    { g: 'gz', x: 1614308400000, y: 0 },\\n    { g: 'gz', x: 1614319200000, y: 0 },\\n    { g: 'gz', x: 1614330000000, y: 2 },\\n    { g: 'gz', x: 1614340800000, y: 3 },\\n    { g: 'gz', x: 1614351600000, y: 9 },\\n  ].map((d) => ({ ...d, x: moment(d.x).valueOf() }));\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <AreaSeries\\n        id=\\\"test3\\\"\\n        stackMode=\\\"percentage\\\"\\n        xScaleType=\\\"time\\\"\\n        yScaleType={ScaleType.Linear}\\n        stackAccessors={['yes']}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        splitSeriesAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  AnnotationDomainType,\\n  LineAnnotationDatum,\\n  Chart,\\n  LineAnnotation,\\n  BarSeries,\\n  ScaleType,\\n  Position,\\n  Settings,\\n} from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { customKnobs } from '../utils/knobs';\\n\\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const markerPositionHorizontal = select(\\n    'horizontal marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const markerPositionVertical = select(\\n    'vertical marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const chartRotation = customKnobs.enum.rotation();\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={chartRotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        domainType={AnnotationDomainType.XDomain}\\n        id=\\\"ann\\\"\\n        dataValues={[{ dataValue: 'bags' }]}\\n        marker={<div style={{ background: 'red' }}>Vertical</div>}\\n        markerPosition={markerPositionVertical === 'undefined' ? undefined : markerPositionVertical}\\n      />\\n      <LineAnnotation\\n        domainType={AnnotationDomainType.YDomain}\\n        id=\\\"ann1\\\"\\n        dataValues={generateAnnotationData([30])}\\n        marker={<div style={{ background: 'yellow' }}>Horizontal</div>}\\n        markerPosition={markerPositionHorizontal === 'undefined' ? undefined : markerPositionHorizontal}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'trousers', y: 390, val: 1222 },\\n          { x: 'watches', y: 23, val: 1222 },\\n          { x: 'bags', y: 750, val: 1222 },\\n          { x: 'cocktail dresses', y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":75},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":75}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  AnnotationDomainType,\n  LineAnnotationDatum,\n  Chart,\n  LineAnnotation,\n  BarSeries,\n  ScaleType,\n  Position,\n  Settings,\n} from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { customKnobs } from '../utils/knobs';\n\nfunction generateAnnotationData(values: any[]): LineAnnotationDatum[] {\n  return values.map((value, index) => ({ dataValue: value, details: `detail-${index}` }));\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const markerPositionHorizontal = select(\n    'horizontal marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const markerPositionVertical = select(\n    'vertical marker position',\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\n    'undefined',\n  );\n  const chartRotation = customKnobs.enum.rotation();\n  return (\n    <Chart title={title} description={description}>\n      <Settings rotation={chartRotation} baseTheme={useBaseTheme()} />\n      <LineAnnotation\n        domainType={AnnotationDomainType.XDomain}\n        id=\"ann\"\n        dataValues={[{ dataValue: 'bags' }]}\n        marker={<div style={{ background: 'red' }}>Vertical</div>}\n        markerPosition={markerPositionVertical === 'undefined' ? undefined : markerPositionVertical}\n      />\n      <LineAnnotation\n        domainType={AnnotationDomainType.YDomain}\n        id=\"ann1\"\n        dataValues={generateAnnotationData([30])}\n        marker={<div style={{ background: 'yellow' }}>Horizontal</div>}\n        markerPosition={markerPositionHorizontal === 'undefined' ? undefined : markerPositionHorizontal}\n      />\n      <BarSeries\n        id=\"bars\"\n        name=\"amount\"\n        xScaleType={ScaleType.Ordinal}\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        data={[\n          { x: 'trousers', y: 390, val: 1222 },\n          { x: 'watches', y: 23, val: 1222 },\n          { x: 'bags', y: 750, val: 1222 },\n          { x: 'cocktail dresses', y: 854, val: 1222 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const markerPositionHorizontal = select(\\n    'horizontal marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const markerPositionVertical = select(\\n    'vertical marker position',\\n    [Position.Top, Position.Left, Position.Bottom, Position.Right, 'undefined'],\\n    'undefined',\\n  );\\n  const chartRotation = customKnobs.enum.rotation();\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings rotation={chartRotation} baseTheme={useBaseTheme()} />\\n      <LineAnnotation\\n        domainType={AnnotationDomainType.XDomain}\\n        id=\\\"ann\\\"\\n        dataValues={[{ dataValue: 'bags' }]}\\n        marker={<div style={{ background: 'red' }}>Vertical</div>}\\n        markerPosition={markerPositionVertical === 'undefined' ? undefined : markerPositionVertical}\\n      />\\n      <LineAnnotation\\n        domainType={AnnotationDomainType.YDomain}\\n        id=\\\"ann1\\\"\\n        dataValues={generateAnnotationData([30])}\\n        marker={<div style={{ background: 'yellow' }}>Horizontal</div>}\\n        markerPosition={markerPositionHorizontal === 'undefined' ? undefined : markerPositionHorizontal}\\n      />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xScaleType={ScaleType.Ordinal}\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        data={[\\n          { x: 'trousers', y: 390, val: 1222 },\\n          { x: 'watches', y: 23, val: 1222 },\\n          { x: 'bags', y: 750, val: 1222 },\\n          { x: 'cocktail dresses', y: 854, val: 1222 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Axis, Position, AreaSeries, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { logFormatter } from '../utils/formatters';\\n\\n/**\\n * Should filter out zero values when fitting domain\\n */\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const fit = boolean('fit', true);\\n  const logMinLimit = number('logMinLimit', 0.001);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"count\\\"\\n        position={Position.Left}\\n        domain={{ min: NaN, max: NaN, fit, logMinLimit }}\\n        tickFormat={logFormatter(10)}\\n      />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} maximumFractionDigits={0} />\\n      <AreaSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Log}\\n        areaSeriesStyle={{ point: { visible: true } }}\\n        data={[\\n          { x: 1, y: 100 },\\n          { x: 2, y: 0 },\\n          { x: 3, y: 10 },\\n          { x: 4, y: 0 },\\n          { x: 5, y: 1 },\\n          { x: 6, y: 0 },\\n          { x: 7, y: 0.01 },\\n          { x: 8, y: 0 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":21},\"endLoc\":{\"col\":1,\"line\":55},\"startBody\":{\"col\":36,\"line\":21},\"endBody\":{\"col\":1,\"line\":55}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Axis, Position, AreaSeries, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { logFormatter } from '../utils/formatters';\n\n/**\n * Should filter out zero values when fitting domain\n */\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const fit = boolean('fit', true);\n  const logMinLimit = number('logMinLimit', 0.001);\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis\n        id=\"count\"\n        position={Position.Left}\n        domain={{ min: NaN, max: NaN, fit, logMinLimit }}\n        tickFormat={logFormatter(10)}\n      />\n      <Axis id=\"x\" position={Position.Bottom} maximumFractionDigits={0} />\n      <AreaSeries\n        id=\"bars\"\n        name=\"amount\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Linear}\n        yScaleType={ScaleType.Log}\n        areaSeriesStyle={{ point: { visible: true } }}\n        data={[\n          { x: 1, y: 100 },\n          { x: 2, y: 0 },\n          { x: 3, y: 10 },\n          { x: 4, y: 0 },\n          { x: 5, y: 1 },\n          { x: 6, y: 0 },\n          { x: 7, y: 0.01 },\n          { x: 8, y: 0 },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const fit = boolean('fit', true);\\n  const logMinLimit = number('logMinLimit', 0.001);\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis\\n        id=\\\"count\\\"\\n        position={Position.Left}\\n        domain={{ min: NaN, max: NaN, fit, logMinLimit }}\\n        tickFormat={logFormatter(10)}\\n      />\\n      <Axis id=\\\"x\\\" position={Position.Bottom} maximumFractionDigits={0} />\\n      <AreaSeries\\n        id=\\\"bars\\\"\\n        name=\\\"amount\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Linear}\\n        yScaleType={ScaleType.Log}\\n        areaSeriesStyle={{ point: { visible: true } }}\\n        data={[\\n          { x: 1, y: 100 },\\n          { x: 2, y: 0 },\\n          { x: 3, y: 10 },\\n          { x: 4, y: 0 },\\n          { x: 5, y: 1 },\\n          { x: 6, y: 0 },\\n          { x: 7, y: 0.01 },\\n          { x: 8, y: 0 },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Axis, Position, BarSeries, ScaleType, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst data = [\\n  { g: 'AE', x: '2021-04-06 00:00', y: 1 },\\n  { g: 'AE', x: '2021-04-06 03:00', y: 0 },\\n  { g: 'AF', x: '2021-04-07 06:00', y: 1 },\\n  { g: 'AF', x: '2021-04-07 09:00', y: 0 },\\n  { g: 'AM', x: '2021-04-10 09:00', y: 1 },\\n  { g: 'AO', x: '2021-04-07 09:00', y: 1 },\\n  { g: 'AO', x: '2021-04-07 12:00', y: 0 },\\n  { g: 'AR', x: '2021-04-07 03:00', y: 1 },\\n  { g: 'AR', x: '2021-04-07 06:00', y: 0 },\\n  { g: 'AT', x: '2021-04-12 03:00', y: 1 },\\n  { g: 'AU', x: '2021-04-06 09:00', y: 1 },\\n  { g: 'AU', x: '2021-04-06 12:00', y: 0 },\\n  { g: 'AZ', x: '2021-04-10 15:00', y: 1 },\\n  { g: 'AZ', x: '2021-04-10 18:00', y: 0 },\\n  { g: 'BA', x: '2021-04-09 06:00', y: 1 },\\n  { g: 'BA', x: '2021-04-09 09:00', y: 0 },\\n  { g: 'BD', x: '2021-04-06 03:00', y: 3 },\\n  { g: 'BD', x: '2021-04-06 06:00', y: 2 },\\n  { g: 'BD', x: '2021-04-06 09:00', y: 1 },\\n  { g: 'BD', x: '2021-04-06 12:00', y: 0 },\\n  { g: 'BE', x: '2021-04-07 06:00', y: 1 },\\n  { g: 'BF', x: '2021-04-09 09:00', y: 1 },\\n  { g: 'BJ', x: '2021-04-07 15:00', y: 1 },\\n  { g: 'BJ', x: '2021-04-07 18:00', y: 0 },\\n  { g: 'BO', x: '2021-04-07 06:00', y: 1 },\\n  { g: 'BO', x: '2021-04-07 09:00', y: 0 },\\n  { g: 'BR', x: '2021-04-06 03:00', y: 3 },\\n  { g: 'BR', x: '2021-04-06 06:00', y: 0 },\\n  { g: 'BR', x: '2021-04-06 09:00', y: 2 },\\n  { g: 'BR', x: '2021-04-06 12:00', y: 1 },\\n  { g: 'BR', x: '2021-04-06 15:00', y: 0 },\\n  { g: 'BW', x: '2021-04-06 03:00', y: 1 },\\n  { g: 'BY', x: '2021-04-08 06:00', y: 1 },\\n  { g: 'CA', x: '2021-04-07 09:00', y: 1 },\\n  { g: 'CA', x: '2021-04-07 12:00', y: 0 },\\n  { g: 'CA', x: '2021-04-08 06:00', y: 0 },\\n  { g: 'CA', x: '2021-04-08 09:00', y: 2 },\\n  { g: 'CA', x: '2021-04-08 12:00', y: 0 },\\n  { g: 'CD', x: '2021-04-07 03:00', y: 1 },\\n  { g: 'CD', x: '2021-04-07 06:00', y: 1 },\\n  { g: 'CD', x: '2021-04-07 09:00', y: 1 },\\n  { g: 'CD', x: '2021-04-07 12:00', y: 0 },\\n  { g: 'CG', x: '2021-04-12 06:00', y: 1 },\\n];\\n\\n/**\\n * Should filter out zero values when fitting domain\\n */\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} maximumFractionDigits={0} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":65},\"endLoc\":{\"col\":1,\"line\":83},\"startBody\":{\"col\":36,\"line\":65},\"endBody\":{\"col\":1,\"line\":83}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Axis, Position, BarSeries, ScaleType, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst data = [\n  { g: 'AE', x: '2021-04-06 00:00', y: 1 },\n  { g: 'AE', x: '2021-04-06 03:00', y: 0 },\n  { g: 'AF', x: '2021-04-07 06:00', y: 1 },\n  { g: 'AF', x: '2021-04-07 09:00', y: 0 },\n  { g: 'AM', x: '2021-04-10 09:00', y: 1 },\n  { g: 'AO', x: '2021-04-07 09:00', y: 1 },\n  { g: 'AO', x: '2021-04-07 12:00', y: 0 },\n  { g: 'AR', x: '2021-04-07 03:00', y: 1 },\n  { g: 'AR', x: '2021-04-07 06:00', y: 0 },\n  { g: 'AT', x: '2021-04-12 03:00', y: 1 },\n  { g: 'AU', x: '2021-04-06 09:00', y: 1 },\n  { g: 'AU', x: '2021-04-06 12:00', y: 0 },\n  { g: 'AZ', x: '2021-04-10 15:00', y: 1 },\n  { g: 'AZ', x: '2021-04-10 18:00', y: 0 },\n  { g: 'BA', x: '2021-04-09 06:00', y: 1 },\n  { g: 'BA', x: '2021-04-09 09:00', y: 0 },\n  { g: 'BD', x: '2021-04-06 03:00', y: 3 },\n  { g: 'BD', x: '2021-04-06 06:00', y: 2 },\n  { g: 'BD', x: '2021-04-06 09:00', y: 1 },\n  { g: 'BD', x: '2021-04-06 12:00', y: 0 },\n  { g: 'BE', x: '2021-04-07 06:00', y: 1 },\n  { g: 'BF', x: '2021-04-09 09:00', y: 1 },\n  { g: 'BJ', x: '2021-04-07 15:00', y: 1 },\n  { g: 'BJ', x: '2021-04-07 18:00', y: 0 },\n  { g: 'BO', x: '2021-04-07 06:00', y: 1 },\n  { g: 'BO', x: '2021-04-07 09:00', y: 0 },\n  { g: 'BR', x: '2021-04-06 03:00', y: 3 },\n  { g: 'BR', x: '2021-04-06 06:00', y: 0 },\n  { g: 'BR', x: '2021-04-06 09:00', y: 2 },\n  { g: 'BR', x: '2021-04-06 12:00', y: 1 },\n  { g: 'BR', x: '2021-04-06 15:00', y: 0 },\n  { g: 'BW', x: '2021-04-06 03:00', y: 1 },\n  { g: 'BY', x: '2021-04-08 06:00', y: 1 },\n  { g: 'CA', x: '2021-04-07 09:00', y: 1 },\n  { g: 'CA', x: '2021-04-07 12:00', y: 0 },\n  { g: 'CA', x: '2021-04-08 06:00', y: 0 },\n  { g: 'CA', x: '2021-04-08 09:00', y: 2 },\n  { g: 'CA', x: '2021-04-08 12:00', y: 0 },\n  { g: 'CD', x: '2021-04-07 03:00', y: 1 },\n  { g: 'CD', x: '2021-04-07 06:00', y: 1 },\n  { g: 'CD', x: '2021-04-07 09:00', y: 1 },\n  { g: 'CD', x: '2021-04-07 12:00', y: 0 },\n  { g: 'CG', x: '2021-04-12 06:00', y: 1 },\n];\n\n/**\n * Should filter out zero values when fitting domain\n */\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings showLegend baseTheme={useBaseTheme()} />\n      <Axis id=\"count\" position={Position.Left} />\n      <Axis id=\"time\" position={Position.Bottom} maximumFractionDigits={0} />\n      <BarSeries\n        id=\"bars\"\n        xAccessor=\"x\"\n        yAccessors={['y']}\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        splitSeriesAccessors={['g']}\n        stackAccessors={['g']}\n        data={data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings showLegend baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"count\\\" position={Position.Left} />\\n      <Axis id=\\\"time\\\" position={Position.Bottom} maximumFractionDigits={0} />\\n      <BarSeries\\n        id=\\\"bars\\\"\\n        xAccessor=\\\"x\\\"\\n        yAccessors={['y']}\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        splitSeriesAccessors={['g']}\\n        stackAccessors={['g']}\\n        data={data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, text, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const automatedSeries = boolean('Use the default generated series types of charts for screen readers', true);\\n  const customDescriptionForScreenReaders = text('add a description for screen readers', '');\\n  const customLabelForScreenReaders = text('add a label for screen readers', '');\\n  const headingLevelForScreenReaders = customLabelForScreenReaders\\n    ? select('heading level for label', { P: 'p', H1: 'h1', H2: 'h2', H3: 'h3', H4: 'h4', H5: 'h5', H6: 'h6' }, 'h2')\\n    : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        ariaDescription={customDescriptionForScreenReaders}\\n        ariaUseDefaultSummary={automatedSeries}\\n        ariaLabel={customLabelForScreenReaders}\\n        ariaLabelHeadingLevel={headingLevelForScreenReaders}\\n      />\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":44},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":44}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, text, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, Chart, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const automatedSeries = boolean('Use the default generated series types of charts for screen readers', true);\n  const customDescriptionForScreenReaders = text('add a description for screen readers', '');\n  const customLabelForScreenReaders = text('add a label for screen readers', '');\n  const headingLevelForScreenReaders = customLabelForScreenReaders\n    ? select('heading level for label', { P: 'p', H1: 'h1', H2: 'h2', H3: 'h3', H4: 'h4', H5: 'h5', H6: 'h6' }, 'h2')\n    : undefined;\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        ariaDescription={customDescriptionForScreenReaders}\n        ariaUseDefaultSummary={automatedSeries}\n        ariaLabel={customLabelForScreenReaders}\n        ariaLabelHeadingLevel={headingLevelForScreenReaders}\n      />\n      <AreaSeries\n        id=\"area\"\n        xScaleType={ScaleType.Time}\n        yScaleType={ScaleType.Linear}\n        xAccessor={0}\n        yAccessors={[1]}\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const automatedSeries = boolean('Use the default generated series types of charts for screen readers', true);\\n  const customDescriptionForScreenReaders = text('add a description for screen readers', '');\\n  const customLabelForScreenReaders = text('add a label for screen readers', '');\\n  const headingLevelForScreenReaders = customLabelForScreenReaders\\n    ? select('heading level for label', { P: 'p', H1: 'h1', H2: 'h2', H3: 'h3', H4: 'h4', H5: 'h5', H6: 'h6' }, 'h2')\\n    : undefined;\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        ariaDescription={customDescriptionForScreenReaders}\\n        ariaUseDefaultSummary={automatedSeries}\\n        ariaLabel={customLabelForScreenReaders}\\n        ariaLabelHeadingLevel={headingLevelForScreenReaders}\\n      />\\n      <AreaSeries\\n        id=\\\"area\\\"\\n        xScaleType={ScaleType.Time}\\n        yScaleType={ScaleType.Linear}\\n        xAccessor={0}\\n        yAccessors={[1]}\\n        data={KIBANA_METRICS.metrics.kibana_os_load.v1.data}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport numeral from 'numeral';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  SeriesType,\\n  BarSeries,\\n  Axis,\\n  Position,\\n  ScaleType,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { getColorPicker } from '../utils/components/get_color_picker';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const lang = select(\\n    'rtl language',\\n    {\\n      Hebrew: 'HE',\\n      Arabic: 'AR',\\n    },\\n    'HE',\\n  );\\n  const charSet = select(\\n    'character set',\\n    {\\n      'Right to Left': 'rtl',\\n      'Left to Right': 'ltr',\\n      'Mostly RTL': 'mostly-rtl',\\n      'Mostly LTR': 'mostly-ltr',\\n    },\\n    'rtl',\\n  );\\n  const type = select(\\n    'Chart type',\\n    {\\n      Bar: SeriesType.Bar,\\n      Treemap: PartitionLayout.treemap,\\n      Sunburst: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.treemap,\\n  );\\n  const showLegend = boolean('show legend', true);\\n\\n  const mixedIndices = new Set(['0', '2', '3']);\\n  const valueGetter = {\\n    rtl: (key: string) => productLookup[key][`name${lang}`],\\n    ltr: (key: string) => productLookup[key].name,\\n    'mostly-rtl': (key: string) => {\\n      if (mixedIndices.has(key)) return productLookup[key].name;\\n      return productLookup[key][`name${lang}`];\\n    },\\n    'mostly-ltr': (key: string) => {\\n      if (mixedIndices.has(key)) return productLookup[key][`name${lang}`];\\n      return productLookup[key].name;\\n    },\\n  }[charSet];\\n  const formatter = (d: any) => numeral(d).format('0.0 a');\\n\\n  const renderSeries = () =>\\n    type === SeriesType.Bar ? (\\n      <>\\n        <Axis id=\\\"x\\\" position={Position.Bottom} tickFormat={formatter} />\\n        <Axis id=\\\"y\\\" position={Position.Left} />\\n        <BarSeries\\n          id=\\\"bar\\\"\\n          data={mocks.pie}\\n          xScaleType={ScaleType.Ordinal}\\n          xAccessor={({ sitc1 }) => valueGetter(sitc1)}\\n          yAccessors={[(d: Datum) => d.exportVal]}\\n          splitSeriesAccessors={[({ sitc1 }) => valueGetter(sitc1)]}\\n        />\\n      </>\\n    ) : (\\n      <Partition\\n        id=\\\"partition\\\"\\n        data={mocks.pie}\\n        layout={type}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={formatter}\\n        clockwiseSectors={type === PartitionLayout.sunburst && boolean('clockwiseSectors', true)}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => valueGetter(d),\\n            fillLabel: {\\n              valueFormatter: formatter,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={type === SeriesType.Bar ? 90 : 0}\\n        debugState\\n        showLegend={showLegend}\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendColorPicker={getColorPicker('leftCenter')}\\n      />\\n      {renderSeries()}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":32},\"endLoc\":{\"col\":1,\"line\":128},\"startBody\":{\"col\":36,\"line\":32},\"endBody\":{\"col\":1,\"line\":128}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport numeral from 'numeral';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  SeriesType,\n  BarSeries,\n  Axis,\n  Position,\n  ScaleType,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { getColorPicker } from '../utils/components/get_color_picker';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const lang = select(\n    'rtl language',\n    {\n      Hebrew: 'HE',\n      Arabic: 'AR',\n    },\n    'HE',\n  );\n  const charSet = select(\n    'character set',\n    {\n      'Right to Left': 'rtl',\n      'Left to Right': 'ltr',\n      'Mostly RTL': 'mostly-rtl',\n      'Mostly LTR': 'mostly-ltr',\n    },\n    'rtl',\n  );\n  const type = select(\n    'Chart type',\n    {\n      Bar: SeriesType.Bar,\n      Treemap: PartitionLayout.treemap,\n      Sunburst: PartitionLayout.sunburst,\n    },\n    PartitionLayout.treemap,\n  );\n  const showLegend = boolean('show legend', true);\n\n  const mixedIndices = new Set(['0', '2', '3']);\n  const valueGetter = {\n    rtl: (key: string) => productLookup[key][`name${lang}`],\n    ltr: (key: string) => productLookup[key].name,\n    'mostly-rtl': (key: string) => {\n      if (mixedIndices.has(key)) return productLookup[key].name;\n      return productLookup[key][`name${lang}`];\n    },\n    'mostly-ltr': (key: string) => {\n      if (mixedIndices.has(key)) return productLookup[key][`name${lang}`];\n      return productLookup[key].name;\n    },\n  }[charSet];\n  const formatter = (d: any) => numeral(d).format('0.0 a');\n\n  const renderSeries = () =>\n    type === SeriesType.Bar ? (\n      <>\n        <Axis id=\"x\" position={Position.Bottom} tickFormat={formatter} />\n        <Axis id=\"y\" position={Position.Left} />\n        <BarSeries\n          id=\"bar\"\n          data={mocks.pie}\n          xScaleType={ScaleType.Ordinal}\n          xAccessor={({ sitc1 }) => valueGetter(sitc1)}\n          yAccessors={[(d: Datum) => d.exportVal]}\n          splitSeriesAccessors={[({ sitc1 }) => valueGetter(sitc1)]}\n        />\n      </>\n    ) : (\n      <Partition\n        id=\"partition\"\n        data={mocks.pie}\n        layout={type}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={formatter}\n        clockwiseSectors={type === PartitionLayout.sunburst && boolean('clockwiseSectors', true)}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => valueGetter(d),\n            fillLabel: {\n              valueFormatter: formatter,\n            },\n            shape: {\n              fillColor: (key, sortIndex, node, tree) =>\n                indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\n            },\n          },\n        ]}\n      />\n    );\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        rotation={type === SeriesType.Bar ? 90 : 0}\n        debugState\n        showLegend={showLegend}\n        showLegendExtra\n        baseTheme={useBaseTheme()}\n        legendColorPicker={getColorPicker('leftCenter')}\n      />\n      {renderSeries()}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const lang = select(\\n    'rtl language',\\n    {\\n      Hebrew: 'HE',\\n      Arabic: 'AR',\\n    },\\n    'HE',\\n  );\\n  const charSet = select(\\n    'character set',\\n    {\\n      'Right to Left': 'rtl',\\n      'Left to Right': 'ltr',\\n      'Mostly RTL': 'mostly-rtl',\\n      'Mostly LTR': 'mostly-ltr',\\n    },\\n    'rtl',\\n  );\\n  const type = select(\\n    'Chart type',\\n    {\\n      Bar: SeriesType.Bar,\\n      Treemap: PartitionLayout.treemap,\\n      Sunburst: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.treemap,\\n  );\\n  const showLegend = boolean('show legend', true);\\n\\n  const mixedIndices = new Set(['0', '2', '3']);\\n  const valueGetter = {\\n    rtl: (key: string) => productLookup[key][`name${lang}`],\\n    ltr: (key: string) => productLookup[key].name,\\n    'mostly-rtl': (key: string) => {\\n      if (mixedIndices.has(key)) return productLookup[key].name;\\n      return productLookup[key][`name${lang}`];\\n    },\\n    'mostly-ltr': (key: string) => {\\n      if (mixedIndices.has(key)) return productLookup[key][`name${lang}`];\\n      return productLookup[key].name;\\n    },\\n  }[charSet];\\n  const formatter = (d: any) => numeral(d).format('0.0 a');\\n\\n  const renderSeries = () =>\\n    type === SeriesType.Bar ? (\\n      <>\\n        <Axis id=\\\"x\\\" position={Position.Bottom} tickFormat={formatter} />\\n        <Axis id=\\\"y\\\" position={Position.Left} />\\n        <BarSeries\\n          id=\\\"bar\\\"\\n          data={mocks.pie}\\n          xScaleType={ScaleType.Ordinal}\\n          xAccessor={({ sitc1 }) => valueGetter(sitc1)}\\n          yAccessors={[(d: Datum) => d.exportVal]}\\n          splitSeriesAccessors={[({ sitc1 }) => valueGetter(sitc1)]}\\n        />\\n      </>\\n    ) : (\\n      <Partition\\n        id=\\\"partition\\\"\\n        data={mocks.pie}\\n        layout={type}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={formatter}\\n        clockwiseSectors={type === PartitionLayout.sunburst && boolean('clockwiseSectors', true)}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => valueGetter(d),\\n            fillLabel: {\\n              valueFormatter: formatter,\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex, node, tree) =>\\n                indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n            },\\n          },\\n        ]}\\n      />\\n    );\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        rotation={type === SeriesType.Bar ? 90 : 0}\\n        debugState\\n        showLegend={showLegend}\\n        showLegendExtra\\n        baseTheme={useBaseTheme()}\\n        legendColorPicker={getColorPicker('leftCenter')}\\n      />\\n      {renderSeries()}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { AreaSeries, LineSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const typeOfSeries = select('series type', ['line', 'area'], 'area');\\n  const showY0Accessor = typeOfSeries === 'area' ? boolean('show y0Accessor', false) : null;\\n\\n  const data = [\\n    [1, 1],\\n    [2, -3],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, -3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: -2,\\n          max: NaN,\\n        }}\\n      />\\n      {typeOfSeries === 'line' ? (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data}\\n        />\\n      ) : (\\n        <AreaSeries\\n          id=\\\"areas\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          y0Accessors={showY0Accessor ? [([, y]) => y - 1] : undefined}\\n          data={data}\\n        />\\n      )}\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":69},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":69}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { AreaSeries, LineSeries, Axis, Chart, Position, ScaleType, Settings } from '@elastic/charts';\nimport { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const typeOfSeries = select('series type', ['line', 'area'], 'area');\n  const showY0Accessor = typeOfSeries === 'area' ? boolean('show y0Accessor', false) : null;\n\n  const data = [\n    [1, 1],\n    [2, -3],\n    [3, 3],\n    [4, 4],\n    [5, 5],\n    [6, 4],\n    [7, -3],\n    [8, 2],\n    [9, 1],\n  ];\n  return (\n    <Chart title={title} description={description}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Axis id=\"bottom\" title=\"index\" position={Position.Bottom} />\n      <Axis\n        id=\"left\"\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\n        position={Position.Left}\n        tickFormat={(d) => Number(d).toFixed(2)}\n        domain={{\n          min: -2,\n          max: NaN,\n        }}\n      />\n      {typeOfSeries === 'line' ? (\n        <LineSeries\n          id=\"lines\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          data={data}\n        />\n      ) : (\n        <AreaSeries\n          id=\"areas\"\n          xScaleType={ScaleType.Linear}\n          yScaleType={ScaleType.Linear}\n          xAccessor={0}\n          yAccessors={[1]}\n          y0Accessors={showY0Accessor ? [([, y]) => y - 1] : undefined}\n          data={data}\n        />\n      )}\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const typeOfSeries = select('series type', ['line', 'area'], 'area');\\n  const showY0Accessor = typeOfSeries === 'area' ? boolean('show y0Accessor', false) : null;\\n\\n  const data = [\\n    [1, 1],\\n    [2, -3],\\n    [3, 3],\\n    [4, 4],\\n    [5, 5],\\n    [6, 4],\\n    [7, -3],\\n    [8, 2],\\n    [9, 1],\\n  ];\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Axis id=\\\"bottom\\\" title=\\\"index\\\" position={Position.Bottom} />\\n      <Axis\\n        id=\\\"left\\\"\\n        title={KIBANA_METRICS.metrics.kibana_os_load.v1.metric.title}\\n        position={Position.Left}\\n        tickFormat={(d) => Number(d).toFixed(2)}\\n        domain={{\\n          min: -2,\\n          max: NaN,\\n        }}\\n      />\\n      {typeOfSeries === 'line' ? (\\n        <LineSeries\\n          id=\\\"lines\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          data={data}\\n        />\\n      ) : (\\n        <AreaSeries\\n          id=\\\"areas\\\"\\n          xScaleType={ScaleType.Linear}\\n          yScaleType={ScaleType.Linear}\\n          xAccessor={0}\\n          yAccessors={[1]}\\n          y0Accessors={showY0Accessor ? [([, y]) => y - 1] : undefined}\\n          data={data}\\n        />\\n      )}\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Partition, PartitionLayout, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        baseTheme={useBaseTheme()}\\n        legendStrategy=\\\"nodeWithDescendants\\\"\\n        legendMaxDepth={1} // testing this option\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[{ g1: 1, g2: 'a', v: 2 }]}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d) => d.v}\\n        layers={[\\n          {\\n            groupByRollup: (d: any) => d.g1,\\n            nodeLabel: () => 'Testing a super duper really long legend',\\n            shape: {\\n              fillColor: () => '#90E0EF',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: any) => d.g2,\\n            nodeLabel: () => 'Testing a super duper really long legend',\\n            shape: {\\n              fillColor: () => '#00B4D8',\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":16},\"endLoc\":{\"col\":1,\"line\":49},\"startBody\":{\"col\":36,\"line\":16},\"endBody\":{\"col\":1,\"line\":49}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Partition, PartitionLayout, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        showLegend\n        baseTheme={useBaseTheme()}\n        legendStrategy=\"nodeWithDescendants\"\n        legendMaxDepth={1} // testing this option\n      />\n      <Partition\n        id=\"spec_1\"\n        data={[{ g1: 1, g2: 'a', v: 2 }]}\n        layout={PartitionLayout.sunburst}\n        valueAccessor={(d) => d.v}\n        layers={[\n          {\n            groupByRollup: (d: any) => d.g1,\n            nodeLabel: () => 'Testing a super duper really long legend',\n            shape: {\n              fillColor: () => '#90E0EF',\n            },\n          },\n          {\n            groupByRollup: (d: any) => d.g2,\n            nodeLabel: () => 'Testing a super duper really long legend',\n            shape: {\n              fillColor: () => '#00B4D8',\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        showLegend\\n        baseTheme={useBaseTheme()}\\n        legendStrategy=\\\"nodeWithDescendants\\\"\\n        legendMaxDepth={1} // testing this option\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[{ g1: 1, g2: 'a', v: 2 }]}\\n        layout={PartitionLayout.sunburst}\\n        valueAccessor={(d) => d.v}\\n        layers={[\\n          {\\n            groupByRollup: (d: any) => d.g1,\\n            nodeLabel: () => 'Testing a super duper really long legend',\\n            shape: {\\n              fillColor: () => '#90E0EF',\\n            },\\n          },\\n          {\\n            groupByRollup: (d: any) => d.g2,\\n            nodeLabel: () => 'Testing a super duper really long legend',\\n            shape: {\\n              fillColor: () => '#00B4D8',\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Test Cases',\n};\n\nexport { Example as noSeries } from './1_no_series.story';\nexport { Example as chromePathBugFix } from './2_chrome_path_bug_fix.story';\nexport { Example as noAxesAnnotationBugFix } from './3_no_axes_annotation.story';\nexport { Example as filterZerosInLogFitDomain } from './4_filter_zero_values_log.story';\nexport { Example as legendScrollBarSizing } from './5_legend_scroll_bar_sizing.story';\nexport { Example as accessibilityCustomizations } from './6_a11y_custom_description.story';\nexport { Example as rtlText } from './7_rtl_text.story';\nexport { Example as testPointsOutsideOfDomain } from './8_test_points_outside_of_domain.story';\nexport { Example as duplicateLabelsInPartitionLegend } from './9_duplicate_labels_in_partition_legend.story';\nexport { Example as highlighterZIndex } from './10_highlighter_z_index.story';\nexport { Example as domainEdges } from './21_domain_edges.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Timeslip, Settings, GetData } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst getData = (dataDemand: Parameters<GetData>[0]) => {\\n  const from = dataDemand.lo?.minimum ?? NaN;\\n  const to = dataDemand.hi?.supremum ?? NaN;\\n  const binWidthMs = (dataDemand.lo?.supremum ?? NaN) - from;\\n  const result = [];\\n  let time = from;\\n  while (time < to) {\\n    result.push({\\n      epochMs: (time + 0.5 * binWidthMs) * 1000,\\n      value:\\n        8 * Math.sin(time / 100000000) +\\n        4 * Math.sin(time / 1000000) +\\n        2 * Math.sin(time / 10000) +\\n        Math.sin(time / 100) +\\n        0.5 * Math.sin(time) +\\n        0.25 * Math.sin(time * 100) +\\n        0.125 * Math.sin(time * 10000),\\n    });\\n    time += binWidthMs;\\n  }\\n  return result;\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  // fixing width and height at multiples of 256 for now\\n  return (\\n    <Chart title={title} description={description} size={{ width: 1024, height: 512 }}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Timeslip id=\\\"spec_1\\\" getData={getData} />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":39},\"endLoc\":{\"col\":1,\"line\":47},\"startBody\":{\"col\":36,\"line\":39},\"endBody\":{\"col\":1,\"line\":47}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Timeslip, Settings, GetData } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst getData = (dataDemand: Parameters<GetData>[0]) => {\n  const from = dataDemand.lo?.minimum ?? NaN;\n  const to = dataDemand.hi?.supremum ?? NaN;\n  const binWidthMs = (dataDemand.lo?.supremum ?? NaN) - from;\n  const result = [];\n  let time = from;\n  while (time < to) {\n    result.push({\n      epochMs: (time + 0.5 * binWidthMs) * 1000,\n      value:\n        8 * Math.sin(time / 100000000) +\n        4 * Math.sin(time / 1000000) +\n        2 * Math.sin(time / 10000) +\n        Math.sin(time / 100) +\n        0.5 * Math.sin(time) +\n        0.25 * Math.sin(time * 100) +\n        0.125 * Math.sin(time * 10000),\n    });\n    time += binWidthMs;\n  }\n  return result;\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  // fixing width and height at multiples of 256 for now\n  return (\n    <Chart title={title} description={description} size={{ width: 1024, height: 512 }}>\n      <Settings baseTheme={useBaseTheme()} />\n      <Timeslip id=\"spec_1\" getData={getData} />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  // fixing width and height at multiples of 256 for now\\n  return (\\n    <Chart title={title} description={description} size={{ width: 1024, height: 512 }}>\\n      <Settings baseTheme={useBaseTheme()} />\\n      <Timeslip id=\\\"spec_1\\\" getData={getData} />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Timeslip (@alpha)',\n};\n\nexport { Example as timeslipPrototype } from './01_timeslip.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport {\\n  countryLookup,\\n  indexInterpolatedFillColor,\\n  interpolatorCET2s,\\n  productLookup,\\n  regionLookup,\\n} from '../utils/utils';\\n\\nconst countries = mocks.sunburst\\n  .map((d: any) => d.dest)\\n  .filter(keepDistinct)\\n  .sort()\\n  .reverse();\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 36,\\n    idealFontSizeJump: 1.01,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            fontFamily: 'Helvetica',\\n            textColor: 'black',\\n            fontWeight: 900,\\n            minFontSize: 2,\\n            maxFontSize: 20,\\n            idealFontSizeJump: 1.01,\\n            maximizeFontSize: boolean('Maximize font size layer 1', true),\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n            minFontSize: 2,\\n            maxFontSize: 10,\\n            idealFontSizeJump: 1.01,\\n            maximizeFontSize: boolean('Maximize font size layer 2', true),\\n          },\\n          shape: {\\n            fillColor: 'rgba(0, 0, 0, 0.07)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key) =>\\n              // pick color by country\\n              indexInterpolatedFillColor(interpolatorCET2s(0.5))(null, countries.indexOf(key), countries),\\n          },\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":49},\"endLoc\":{\"col\":1,\"line\":106},\"startBody\":{\"col\":36,\"line\":49},\"endBody\":{\"col\":1,\"line\":106}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { keepDistinct } from '@elastic/charts/src/utils/common';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport {\n  countryLookup,\n  indexInterpolatedFillColor,\n  interpolatorCET2s,\n  productLookup,\n  regionLookup,\n} from '../utils/utils';\n\nconst countries = mocks.sunburst\n  .map((d: any) => d.dest)\n  .filter(keepDistinct)\n  .sort()\n  .reverse();\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 36,\n    idealFontSizeJump: 1.01,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            fontFamily: 'Helvetica',\n            textColor: 'black',\n            fontWeight: 900,\n            minFontSize: 2,\n            maxFontSize: 20,\n            idealFontSizeJump: 1.01,\n            maximizeFontSize: boolean('Maximize font size layer 1', true),\n          },\n          shape: { fillColor: 'rgba(0,0,0,0)' },\n        },\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'black',\n            fontWeight: 200,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\n            minFontSize: 2,\n            maxFontSize: 10,\n            idealFontSizeJump: 1.01,\n            maximizeFontSize: boolean('Maximize font size layer 2', true),\n          },\n          shape: {\n            fillColor: 'rgba(0, 0, 0, 0.07)',\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          shape: {\n            fillColor: (key) =>\n              // pick color by country\n              indexInterpolatedFillColor(interpolatorCET2s(0.5))(null, countries.indexOf(key), countries),\n          },\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            fontFamily: 'Helvetica',\\n            textColor: 'black',\\n            fontWeight: 900,\\n            minFontSize: 2,\\n            maxFontSize: 20,\\n            idealFontSizeJump: 1.01,\\n            maximizeFontSize: boolean('Maximize font size layer 1', true),\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n            minFontSize: 2,\\n            maxFontSize: 10,\\n            idealFontSizeJump: 1.01,\\n            maximizeFontSize: boolean('Maximize font size layer 2', true),\\n          },\\n          shape: {\\n            fillColor: 'rgba(0, 0, 0, 0.07)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          shape: {\\n            fillColor: (key) =>\\n              // pick color by country\\n              indexInterpolatedFillColor(interpolatorCET2s(0.5))(null, countries.indexOf(key), countries),\\n          },\\n          fillLabel: { maximizeFontSize: boolean('Maximize font size layer 3', true) },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debugState baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":42},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":42}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings debugState baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n          },\n          shape: {\n            fillColor: (key, sortIndex, node, tree) =>\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings debugState baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node, tree) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, sortIndex, tree),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean, color, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, defaultPartitionValueFormatter, Partition, PartitionLayout, Settings } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { colorBrewerCategoricalPastel12, discreteColor, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const layout = select(\\n    'partitionLayout',\\n    {\\n      Treemap: PartitionLayout.treemap,\\n      Sunburst: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.treemap,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            fillLabel: {\\n              textColor: boolean('custom fillLabel.textColor', false)\\n                ? color('fillLabel.textColor', 'rgba(0, 0, 0, 1)')\\n                : undefined,\\n            },\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={layout}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            fillLabel: {\\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n              valueFont: {\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":19},\"endLoc\":{\"col\":1,\"line\":66},\"startBody\":{\"col\":36,\"line\":19},\"endBody\":{\"col\":1,\"line\":66}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean, color, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, defaultPartitionValueFormatter, Partition, PartitionLayout, Settings } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { colorBrewerCategoricalPastel12, discreteColor, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const layout = select(\n    'partitionLayout',\n    {\n      Treemap: PartitionLayout.treemap,\n      Sunburst: PartitionLayout.sunburst,\n    },\n    PartitionLayout.treemap,\n  );\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        baseTheme={useBaseTheme()}\n        theme={{\n          partition: {\n            fillLabel: {\n              textColor: boolean('custom fillLabel.textColor', false)\n                ? color('fillLabel.textColor', 'rgba(0, 0, 0, 1)')\n                : undefined,\n            },\n          },\n        }}\n      />\n      <Partition\n        id=\"spec_1\"\n        data={mocks.pie}\n        layout={layout}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => productLookup[d].name,\n            fillLabel: {\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n              valueFont: {\n                fontWeight: 100,\n              },\n            },\n            shape: {\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const layout = select(\\n    'partitionLayout',\\n    {\\n      Treemap: PartitionLayout.treemap,\\n      Sunburst: PartitionLayout.sunburst,\\n    },\\n    PartitionLayout.treemap,\\n  );\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        baseTheme={useBaseTheme()}\\n        theme={{\\n          partition: {\\n            fillLabel: {\\n              textColor: boolean('custom fillLabel.textColor', false)\\n                ? color('fillLabel.textColor', 'rgba(0, 0, 0, 1)')\\n                : undefined,\\n            },\\n          },\\n        }}\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={mocks.pie}\\n        layout={layout}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => productLookup[d].name,\\n            fillLabel: {\\n              valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n              valueFont: {\\n                fontWeight: 100,\\n              },\\n            },\\n            shape: {\\n              fillColor: (key, sortIndex) => discreteColor(colorBrewerCategoricalPastel12)(sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 84,\\n    idealFontSizeJump: 1.15,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            fontFamily: 'Helvetica',\\n            textColor: 'grey',\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'small-caps',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":80},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":80}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 84,\n    idealFontSizeJump: 1.15,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            fontFamily: 'Helvetica',\n            textColor: 'grey',\n          },\n          shape: { fillColor: 'rgba(0,0,0,0)' },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'black',\n            fontWeight: 200,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            fontVariant: 'small-caps',\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\n              return interpolatorTurbo()(\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\n                  (node.parent.parent.children.length + 1),\n              );\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            fontFamily: 'Helvetica',\\n            textColor: 'grey',\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'small-caps',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, interpolatorTurbo, productLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 84,\\n    idealFontSizeJump: 1.05,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            fontFamily: 'Helvetica',\\n            textColor: 'grey',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0, 0, 0, 0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 100,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'normal',\\n            valueFont: {\\n              fontWeight: 100,\\n            },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":84},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":84}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, interpolatorTurbo, productLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 84,\n    idealFontSizeJump: 1.05,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\n          fillLabel: {\n            valueFormatter: () => '',\n            fontFamily: 'Helvetica',\n            textColor: 'grey',\n          },\n          shape: {\n            fillColor: 'rgba(0, 0, 0, 0)',\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'black',\n            fontWeight: 100,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            fontVariant: 'normal',\n            valueFont: {\n              fontWeight: 100,\n            },\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\n              return interpolatorTurbo()(\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\n                  (node.parent.parent.children.length + 1),\n              );\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings showLegend theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: any) => productLookup[d].name.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            fontFamily: 'Helvetica',\\n            textColor: 'grey',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0, 0, 0, 0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 100,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'normal',\\n            valueFont: {\\n              fontWeight: 100,\\n            },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  CHILDREN_KEY,\\n  Datum,\\n  defaultPartitionValueFormatter,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 84,\\n    idealFontSizeJump: 1.05,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      topGroove={0}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            textColor: 'black',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0,0,0,0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'rgba(60,60,60,1)',\\n            fontWeight: 100,\\n            fontStyle: 'normal',\\n            fontFamily: 'Din Condensed',\\n            fontVariant: 'normal',\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(\\n                null,\\n                node.parent.sortIndex,\\n                node.parent.parent[CHILDREN_KEY],\\n              ),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":36},\"endLoc\":{\"col\":1,\"line\":81},\"startBody\":{\"col\":36,\"line\":36},\"endBody\":{\"col\":1,\"line\":81}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  CHILDREN_KEY,\n  Datum,\n  defaultPartitionValueFormatter,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, indexInterpolatedFillColor, interpolatorCET2s, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 84,\n    idealFontSizeJump: 1.05,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      topGroove={0}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            valueFormatter: () => '',\n            textColor: 'black',\n          },\n          shape: {\n            fillColor: 'rgba(0,0,0,0)',\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'rgba(60,60,60,1)',\n            fontWeight: 100,\n            fontStyle: 'normal',\n            fontFamily: 'Din Condensed',\n            fontVariant: 'normal',\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              indexInterpolatedFillColor(interpolatorCET2s())(\n                null,\n                node.parent.sortIndex,\n                node.parent.parent[CHILDREN_KEY],\n              ),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      topGroove={0}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            textColor: 'black',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0,0,0,0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'rgba(60,60,60,1)',\\n            fontWeight: 100,\\n            fontStyle: 'normal',\\n            fontFamily: 'Din Condensed',\\n            fontVariant: 'normal',\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(\\n                null,\\n                node.parent.sortIndex,\\n                node.parent.parent[CHILDREN_KEY],\\n              ),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  PartialTheme,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 8,\\n    maxFontSize: 14,\\n    idealFontSizeJump: 1.05,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            textColor: 'black',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0,0,0,0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'rgba(60,60,60,1)',\\n            fontWeight: 600,\\n            fontStyle: 'normal',\\n            fontFamily: 'Courier New',\\n            fontVariant: 'normal',\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              const model = node.parent;\\n              const root = model.parent;\\n              const siblingCountLayer1 = root.children.length;\\n              const i = model.sortIndex;\\n              const shade = Math.pow(0.3 + 0.5 * (i / (siblingCountLayer1 - 1)), 1 / 3);\\n              return `rgb(${Math.round(255 * shade)},${Math.round(255 * shade)},${Math.round(255 * shade)})`;\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":35},\"endLoc\":{\"col\":1,\"line\":81},\"startBody\":{\"col\":36,\"line\":35},\"endBody\":{\"col\":1,\"line\":81}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  PartialTheme,\n  Partition,\n  PartitionLayout,\n  Settings,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 8,\n    maxFontSize: 14,\n    idealFontSizeJump: 1.05,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            valueFormatter: () => '',\n            textColor: 'black',\n          },\n          shape: {\n            fillColor: 'rgba(0,0,0,0)',\n          },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'rgba(60,60,60,1)',\n            fontWeight: 600,\n            fontStyle: 'normal',\n            fontFamily: 'Courier New',\n            fontVariant: 'normal',\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              const model = node.parent;\n              const root = model.parent;\n              const siblingCountLayer1 = root.children.length;\n              const i = model.sortIndex;\n              const shade = Math.pow(0.3 + 0.5 * (i / (siblingCountLayer1 - 1)), 1 / 3);\n              return `rgb(${Math.round(255 * shade)},${Math.round(255 * shade)},${Math.round(255 * shade)})`;\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            textColor: 'black',\\n          },\\n          shape: {\\n            fillColor: 'rgba(0,0,0,0)',\\n          },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'rgba(60,60,60,1)',\\n            fontWeight: 600,\\n            fontStyle: 'normal',\\n            fontFamily: 'Courier New',\\n            fontVariant: 'normal',\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              const model = node.parent;\\n              const root = model.parent;\\n              const siblingCountLayer1 = root.children.length;\\n              const i = model.sortIndex;\\n              const shade = Math.pow(0.3 + 0.5 * (i / (siblingCountLayer1 - 1)), 1 / 3);\\n              return `rgb(${Math.round(255 * shade)},${Math.round(255 * shade)},${Math.round(255 * shade)})`;\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, PartialTheme, Partition, PartitionLayout, Settings } from '@elastic/charts';\\nimport {\\n  defaultPartitionValueFormatter,\\n  percentValueGetter,\\n} from '@elastic/charts/src/chart_types/partition_chart/layout/config';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 84,\\n    idealFontSizeJump: 1.15,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_7\\\"\\n      data={mocks.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      layout={PartitionLayout.treemap}\\n      valueGetter={percentValueGetter}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            fontFamily: 'Helvetica',\\n            textColor: 'black',\\n            fontWeight: 100,\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'small-caps',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":31},\"endLoc\":{\"col\":1,\"line\":76},\"startBody\":{\"col\":36,\"line\":31},\"endBody\":{\"col\":1,\"line\":76}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, PartialTheme, Partition, PartitionLayout, Settings } from '@elastic/charts';\nimport {\n  defaultPartitionValueFormatter,\n  percentValueGetter,\n} from '@elastic/charts/src/chart_types/partition_chart/layout/config';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 84,\n    idealFontSizeJump: 1.15,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_7\"\n      data={mocks.sunburst}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      layout={PartitionLayout.treemap}\n      valueGetter={percentValueGetter}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName,\n          fillLabel: {\n            fontFamily: 'Helvetica',\n            textColor: 'black',\n            fontWeight: 100,\n          },\n          shape: { fillColor: 'rgba(0,0,0,0)' },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            textColor: 'black',\n            fontWeight: 200,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            fontVariant: 'small-caps',\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\n              return interpolatorTurbo()(\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\n                  (node.parent.parent.children.length + 1),\n              );\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_7\\\"\\n      data={mocks.sunburst}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      layout={PartitionLayout.treemap}\\n      valueGetter={percentValueGetter}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName,\\n          fillLabel: {\\n            fontFamily: 'Helvetica',\\n            textColor: 'black',\\n            fontWeight: 100,\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            fontVariant: 'small-caps',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { number } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport {\\n  Chart,\\n  Datum,\\n  Partition,\\n  PartitionLayout,\\n  Settings,\\n  PartialTheme,\\n  defaultPartitionValueFormatter,\\n} from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\\n\\nconst theme: PartialTheme = {\\n  partition: {\\n    minFontSize: 4,\\n    maxFontSize: 114,\\n    idealFontSizeJump: 1.01,\\n    outerSizeRatio: 1,\\n  },\\n};\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            fontFamily: 'Helvetica',\\n            textColor: '#555',\\n            fontWeight: 100,\\n            padding: {\\n              top: number('group padding top', 0, { range: true, min: 0, max: 20 }),\\n              right: number('group padding right', 2, { range: true, min: 0, max: 20 }),\\n              bottom: number('group padding bottom', 0, { range: true, min: 0, max: 20 }),\\n              left: number('group padding left', 2, { range: true, min: 0, max: 20 }),\\n            },\\n            minFontSize: 2,\\n            maxFontSize: 50,\\n            idealFontSizeJump: 1.01,\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n            padding: {\\n              top: number('leaf padding top', 0, { range: true, min: 0, max: 200 }),\\n              right: number('leaf padding right', 2, { range: true, min: 0, max: 200 }),\\n              bottom: number('leaf padding bottom', 0, { range: true, min: 0, max: 200 }),\\n              left: number('leaf padding left', 2, { range: true, min: 0, max: 200 }),\\n            },\\n            minFontSize: 2,\\n            maxFontSize: 100,\\n            idealFontSizeJump: 1.01,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":36},\"endLoc\":{\"col\":1,\"line\":99},\"startBody\":{\"col\":36,\"line\":36},\"endBody\":{\"col\":1,\"line\":99}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { number } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport {\n  Chart,\n  Datum,\n  Partition,\n  PartitionLayout,\n  Settings,\n  PartialTheme,\n  defaultPartitionValueFormatter,\n} from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { countryLookup, interpolatorTurbo, regionLookup } from '../utils/utils';\n\nconst theme: PartialTheme = {\n  partition: {\n    minFontSize: 4,\n    maxFontSize: 114,\n    idealFontSizeJump: 1.01,\n    outerSizeRatio: 1,\n  },\n};\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.sunburst}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n      layers={[\n        {\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\n          nodeLabel: (d: any) => regionLookup[d].regionName.toUpperCase(),\n          fillLabel: {\n            valueFormatter: () => '',\n            fontFamily: 'Helvetica',\n            textColor: '#555',\n            fontWeight: 100,\n            padding: {\n              top: number('group padding top', 0, { range: true, min: 0, max: 20 }),\n              right: number('group padding right', 2, { range: true, min: 0, max: 20 }),\n              bottom: number('group padding bottom', 0, { range: true, min: 0, max: 20 }),\n              left: number('group padding left', 2, { range: true, min: 0, max: 20 }),\n            },\n            minFontSize: 2,\n            maxFontSize: 50,\n            idealFontSizeJump: 1.01,\n          },\n          shape: { fillColor: 'rgba(0,0,0,0)' },\n        },\n        {\n          groupByRollup: (d: Datum) => d.dest,\n          nodeLabel: (d: any) => countryLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n            textColor: 'black',\n            fontWeight: 200,\n            fontStyle: 'normal',\n            fontFamily: 'Helvetica',\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\n            padding: {\n              top: number('leaf padding top', 0, { range: true, min: 0, max: 200 }),\n              right: number('leaf padding right', 2, { range: true, min: 0, max: 200 }),\n              bottom: number('leaf padding bottom', 0, { range: true, min: 0, max: 200 }),\n              left: number('leaf padding left', 2, { range: true, min: 0, max: 200 }),\n            },\n            minFontSize: 2,\n            maxFontSize: 100,\n            idealFontSizeJump: 1.01,\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) => {\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\n              return interpolatorTurbo()(\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\n                  (node.parent.parent.children.length + 1),\n              );\n            },\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings theme={theme} baseTheme={useBaseTheme()} />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.sunburst}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => countryLookup[d.dest].continentCountry.slice(0, 2),\\n          nodeLabel: (d: any) => regionLookup[d].regionName.toUpperCase(),\\n          fillLabel: {\\n            valueFormatter: () => '',\\n            fontFamily: 'Helvetica',\\n            textColor: '#555',\\n            fontWeight: 100,\\n            padding: {\\n              top: number('group padding top', 0, { range: true, min: 0, max: 20 }),\\n              right: number('group padding right', 2, { range: true, min: 0, max: 20 }),\\n              bottom: number('group padding bottom', 0, { range: true, min: 0, max: 20 }),\\n              left: number('group padding left', 2, { range: true, min: 0, max: 20 }),\\n            },\\n            minFontSize: 2,\\n            maxFontSize: 50,\\n            idealFontSizeJump: 1.01,\\n          },\\n          shape: { fillColor: 'rgba(0,0,0,0)' },\\n        },\\n        {\\n          groupByRollup: (d: Datum) => d.dest,\\n          nodeLabel: (d: any) => countryLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) => `${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n            textColor: 'black',\\n            fontWeight: 200,\\n            fontStyle: 'normal',\\n            fontFamily: 'Helvetica',\\n            valueFont: { fontWeight: 400, fontStyle: 'italic' },\\n            padding: {\\n              top: number('leaf padding top', 0, { range: true, min: 0, max: 200 }),\\n              right: number('leaf padding right', 2, { range: true, min: 0, max: 200 }),\\n              bottom: number('leaf padding bottom', 0, { range: true, min: 0, max: 200 }),\\n              left: number('leaf padding left', 2, { range: true, min: 0, max: 200 }),\\n            },\\n            minFontSize: 2,\\n            maxFontSize: 100,\\n            idealFontSizeJump: 1.01,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) => {\\n              // primarily, pick color based on parent's index, but then perturb by the index within the parent\\n              return interpolatorTurbo()(\\n                (node.parent.sortIndex + node.sortIndex / node.parent.children.length) /\\n                  (node.parent.parent.children.length + 1),\\n              );\\n            },\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((d: any, i: number) => (i ? d : { ...d, exportVal: 0 }))}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) =>\\n        `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`\\n      }\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) =>\\n              `${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, node.sortIndex, node.parent.children),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n);\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":45},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":45}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { indexInterpolatedFillColor, interpolatorCET2s, productLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => (\n  <Chart title={title} description={description}>\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\n    <Partition\n      id=\"spec_1\"\n      data={mocks.pie.map((d: any, i: number) => (i ? d : { ...d, exportVal: 0 }))}\n      layout={PartitionLayout.treemap}\n      valueAccessor={(d: Datum) => d.exportVal as number}\n      valueFormatter={(d: number) =>\n        `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`\n      }\n      layers={[\n        {\n          groupByRollup: (d: Datum) => d.sitc1,\n          nodeLabel: (d: Datum) => productLookup[d].name,\n          fillLabel: {\n            valueFormatter: (d: number) =>\n              `${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`,\n          },\n          shape: {\n            fillColor: (key, sortIndex, node) =>\n              indexInterpolatedFillColor(interpolatorCET2s())(null, node.sortIndex, node.parent.children),\n          },\n        },\n      ]}\n    />\n  </Chart>\n);\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => (\\n  <Chart title={title} description={description}>\\n    <Settings baseTheme={useBaseTheme()} showLegend showLegendExtra />\\n    <Partition\\n      id=\\\"spec_1\\\"\\n      data={mocks.pie.map((d: any, i: number) => (i ? d : { ...d, exportVal: 0 }))}\\n      layout={PartitionLayout.treemap}\\n      valueAccessor={(d: Datum) => d.exportVal as number}\\n      valueFormatter={(d: number) =>\\n        `$${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`\\n      }\\n      layers={[\\n        {\\n          groupByRollup: (d: Datum) => d.sitc1,\\n          nodeLabel: (d: Datum) => productLookup[d].name,\\n          fillLabel: {\\n            valueFormatter: (d: number) =>\\n              `${d === 0 ? 0 : defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`,\\n          },\\n          shape: {\\n            fillColor: (key, sortIndex, node) =>\\n              indexInterpolatedFillColor(interpolatorCET2s())(null, node.sortIndex, node.parent.children),\\n          },\\n        },\\n      ]}\\n    />\\n  </Chart>\\n)\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Treemap',\n};\n\nexport { Example as oneLayer } from './1_one_layer.story';\nexport { Example as oneLayer2 } from './2_one_layer_2.story';\nexport { Example as midTwoLayers } from './3_mid_two.story';\nexport { Example as twoLayersStressTest } from './4_two_layer_stress.story';\nexport { Example as multiColor } from './5_multicolor.story';\nexport { Example as customStyle } from './6_custom_style.story';\nexport { Example as percentage } from './7_percentage.story';\nexport { Example as grooveText } from './8_groove_text.story';\nexport { Example as zeroValues } from './9_zero_values.story';\nexport { Example as threeLayer } from './10_three_layers.story';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  EuiButton,\n  EuiButtonEmpty,\n  EuiColorPicker,\n  EuiFlexItem,\n  EuiSpacer,\n  EuiWrappingPopover,\n  PopoverAnchorPosition,\n} from '@elastic/eui';\nimport React, { FC } from 'react';\n\nimport { LegendColorPickerProps } from '@elastic/charts';\n\nexport const getColorPicker =\n  (anchorPosition: PopoverAnchorPosition = 'leftCenter'): FC<LegendColorPickerProps> =>\n  ({ anchor, color, onClose, onChange }) => (\n    <EuiWrappingPopover\n      isOpen\n      button={anchor}\n      closePopover={onClose}\n      panelStyle={{ padding: 16 }}\n      anchorPosition={anchorPosition}\n      ownFocus\n    >\n      <EuiColorPicker display=\"inline\" color={color} onChange={onChange} />\n      <EuiSpacer size=\"m\" />\n      <EuiFlexItem grow={false}>\n        <EuiButtonEmpty\n          color=\"danger\"\n          style={{ color: '#ab231c' }}\n          size=\"s\"\n          onClick={() => {\n            onChange(null);\n            anchor.focus();\n            onClose();\n          }}\n          title=\"Clear color selection\"\n        >\n          Clear color\n        </EuiButtonEmpty>\n      </EuiFlexItem>\n      <EuiButton\n        fullWidth\n        size=\"s\"\n        iconType=\"check\"\n        title=\"Confirm color selection\"\n        onClick={onClose}\n        style={{ color: '#0061a6', backgroundColor: '#cce4f5', borderRadius: 4 }}\n      >\n        Done\n      </EuiButton>\n    </EuiWrappingPopover>\n  );\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  EuiIcon,\n  EuiPopover,\n  EuiContextMenu,\n  PopoverAnchorPosition,\n  EuiContextMenuPanelDescriptor,\n} from '@elastic/eui';\nimport React, { useState } from 'react';\n\nimport { LegendAction, XYChartSeriesIdentifier, useLegendAction } from '@elastic/charts';\n\nexport const getLegendAction =\n  (anchorPosition: PopoverAnchorPosition = 'leftCenter'): LegendAction =>\n  ({ series, label }) => {\n    const [popoverOpen, setPopoverOpen] = useState(false);\n    const [ref, onClose] = useLegendAction<HTMLButtonElement>();\n\n    const getPanels = (series: XYChartSeriesIdentifier[]): EuiContextMenuPanelDescriptor[] => [\n      {\n        id: 0,\n        title: label,\n        items: [\n          {\n            name: 'Alert series specId',\n            icon: <EuiIcon type=\"iInCircle\" size=\"m\" />,\n            onClick: () => {\n              setPopoverOpen(false);\n              setTimeout(() => {\n                window.alert(`Selected series: ${series.map(({ specId }) => specId).join(', ')}`);\n              }, 100);\n            },\n          },\n          {\n            name: 'Alert series keys',\n            icon: <EuiIcon type=\"tokenKey\" size=\"m\" />,\n            onClick: () => {\n              setPopoverOpen(false);\n              setTimeout(() => {\n                window.alert(\n                  `Selected series: [${series.map(({ seriesKeys }) => seriesKeys.join(', ')).join(' -- ')}]`,\n                );\n              }, 100);\n            },\n          },\n          {\n            name: 'Filter series',\n            icon: <EuiIcon type=\"filter\" size=\"m\" />,\n            onClick: () => {\n              setPopoverOpen(false);\n              setTimeout(() => {\n                window.alert('Series Filtered!');\n              }, 100);\n            },\n          },\n          {\n            name: 'Like series',\n            icon: <EuiIcon type=\"starFilled\" size=\"m\" />,\n            onClick: () => {\n              setPopoverOpen(false);\n              setTimeout(() => {\n                window.alert('Series liked!!!');\n              }, 100);\n            },\n          },\n        ],\n      },\n    ];\n\n    const Button = (\n      <button\n        type=\"button\"\n        ref={ref}\n        style={{\n          display: 'flex',\n          justifyContent: 'center',\n          alignItems: 'center',\n          paddingLeft: 2,\n          paddingRight: 2,\n        }}\n        onClick={() => setPopoverOpen(!popoverOpen)}\n      >\n        <EuiIcon size=\"s\" type=\"pencil\" />\n      </button>\n    );\n\n    return (\n      <EuiPopover\n        id=\"contextMenuNormal\"\n        button={Button}\n        isOpen={popoverOpen}\n        closePopover={() => {\n          setPopoverOpen(false);\n          onClose();\n        }}\n        panelPaddingSize=\"none\"\n        offset={4}\n        anchorPosition={anchorPosition}\n      >\n        <EuiContextMenu initialPanelId={0} panels={getPanels(series as XYChartSeriesIdentifier[])} />\n      </EuiPopover>\n    );\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\ninterface Row {\n  state: string;\n  profit: number;\n  product: string;\n}\n\nexport const data: Row[] = [\n  { state: 'Florida', product: 'Powder', profit: 10000 },\n  { state: 'Florida', product: 'Mascara', profit: 9000 },\n  { state: 'Florida', product: 'Lip gloss', profit: 17000 },\n  { state: 'Florida', product: 'Foundation', profit: 6000 },\n  { state: 'Florida', product: 'Eyeliner', profit: 7000 },\n  { state: 'Florida', product: 'Eyeshadow', profit: 1000 },\n  { state: 'Florida', product: 'Lipstick', profit: 4000 },\n  { state: 'Florida', product: 'Rouge', profit: 6000 },\n  { state: 'Florida', product: 'Concealer', profit: 8000 },\n  { state: 'Florida', product: 'Nail polish', profit: 8000 },\n  { state: 'Texas', product: 'Powder', profit: 9000 },\n  { state: 'Texas', product: 'Mascara', profit: 7000 },\n  { state: 'Texas', product: 'Lip gloss', profit: 8000 },\n  { state: 'Texas', product: 'Foundation', profit: 6000 },\n  { state: 'Texas', product: 'Eyeliner', profit: 10000 },\n  { state: 'Texas', product: 'Eyeshadow', profit: 9000 },\n  { state: 'Texas', product: 'Lipstick', profit: 5000 },\n  { state: 'Texas', product: 'Rouge', profit: -4000 },\n  { state: 'Texas', product: 'Concealer', profit: -3000 },\n  { state: 'Texas', product: 'Nail polish', profit: -2000 },\n  { state: 'Nevada', product: 'Powder', profit: -5000 },\n  { state: 'Nevada', product: 'Mascara', profit: -4000 },\n  { state: 'Nevada', product: 'Lip gloss', profit: 2000 },\n  { state: 'Nevada', product: 'Foundation', profit: -2000 },\n  { state: 'Nevada', product: 'Eyeliner', profit: 1000 },\n  { state: 'Nevada', product: 'Eyeshadow', profit: -2000 },\n  { state: 'Nevada', product: 'Lipstick', profit: 1000 },\n  { state: 'Nevada', product: 'Rouge', profit: -1000 },\n  { state: 'Nevada', product: 'Concealer', profit: -1000 },\n  { state: 'Nevada', product: 'Nail polish', profit: -1000 },\n  { state: 'Arizona', product: 'Powder', profit: 20000 },\n  { state: 'Arizona', product: 'Mascara', profit: 21000 },\n  { state: 'Arizona', product: 'Lip gloss', profit: -1000 },\n  { state: 'Arizona', product: 'Foundation', profit: 8000 },\n  { state: 'Arizona', product: 'Eyeliner', profit: -2000 },\n  { state: 'Arizona', product: 'Eyeshadow', profit: -1000 },\n  { state: 'Arizona', product: 'Lipstick', profit: -4000 },\n  { state: 'Arizona', product: 'Rouge', profit: 2000 },\n  { state: 'Arizona', product: 'Concealer', profit: -1000 },\n  { state: 'Arizona', product: 'Nail polish', profit: -1000 },\n];\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\n\nimport { DebugState } from '@elastic/charts';\nimport { debounce } from '@elastic/charts/src/utils/debounce';\n\nexport const getDebugStateLogger = (debugState: boolean) => {\n  const dataStateAction = action('DataState');\n  return debounce(() => {\n    if (!debugState) return;\n    const statusEl = document.querySelector<HTMLDivElement>('.echChartStatus');\n\n    if (statusEl) {\n      const dataState = statusEl.dataset.echDebugState\n        ? (JSON.parse(statusEl.dataset.echDebugState) as DebugState)\n        : null;\n      if (dataState) dataStateAction(dataState);\n    }\n  }, 100) as () => void;\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport numeral from 'numeral';\n\nconst superStringMap: Record<string, string> = {\n  0: '⁰',\n  1: '¹',\n  2: '²',\n  3: '³',\n  4: '⁴',\n  5: '⁵',\n  6: '⁶',\n  7: '⁷',\n  8: '⁸',\n  9: '⁹',\n};\n\nexport const getSuperScriptNumber = (n: number) =>\n  `${n >= 0 ? '' : '⁻'}${Math.abs(n)\n    .toString()\n    .split('')\n    .map((c) => superStringMap[c])\n    .join('')}`;\n\nexport const logFormatter =\n  (base: number = 10) =>\n  (n: number): string => {\n    if (n === 0) return '0';\n    const sign = n < 0 ? '-' : '';\n    const nAbs = Math.abs(n);\n    const exp = Math.log(nAbs) / Math.log(base) + Number.EPSILON;\n    const roundedExp = Math.floor(exp);\n    const constant = numeral(nAbs / Math.pow(base, roundedExp)).format('0[.]00');\n    const baseLabel = base === Math.E ? 'e' : base;\n    const expString = getSuperScriptNumber(roundedExp);\n    return `${sign}${constant} x ${baseLabel}${expString}`;\n  };\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Datum } from '@elastic/charts';\nimport { PrimitiveValue } from '@elastic/charts/src/chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\n\nimport { discreteColor } from './utils';\n\nconst raw = mocks.observabilityTree;\n\ninterface Node {\n  c?: Node[];\n  n: string;\n  v: number;\n}\n\ntype Row = { [layerKey: string]: unknown; value: number; depth: number };\n\nconst flatTree = ({ c, n, v }: Node, depth: number): Row[] => {\n  if (!c) {\n    return [{ [`layer_${depth}`]: n, value: v, depth }];\n  }\n  // as of writing this, the test runner can't run c.flatMap(...)\n  const childrenRows = c.reduce<Row[]>((a, child) => [...a, ...flatTree(child, depth + 1)], []);\n  const childrenTotal = childrenRows.reduce((p, { value }) => p + value, 0);\n  const missing = Math.max(0, v - childrenTotal);\n  if (missing > 0) {\n    childrenRows.unshift({ [`layer_${depth + 1}`]: undefined, value: missing / 2, depth });\n    childrenRows.push({ [`layer_${depth + 1}`]: undefined, value: missing / 2, depth });\n  }\n  childrenRows.forEach((innerChild) => {\n    innerChild[`layer_${depth}`] = n;\n  });\n  return childrenRows;\n};\n\n/** @internal */\nexport const getFlatData = () => flatTree(raw, 0);\n\n/** @internal */\nexport const maxDepth = getFlatData().reduce((p, n) => Math.max(p, n.depth), 0);\n\n/** @internal */\nexport const getLayerSpec = (color: [string, string, string][]) =>\n  [...new Array(maxDepth + 1)].map((_, depth) => ({\n    groupByRollup: (d: Datum) => d[`layer_${depth}`],\n    nodeLabel: (d: PrimitiveValue) => String(d),\n    showAccessor: (d: PrimitiveValue) => d !== undefined,\n    shape: {\n      fillColor: () => discreteColor(color, 0.8)(depth),\n    },\n  }));\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\n// Not sure why this is not an export from eui but manually listing here\n// From: https://github.com/elastic/eui/blob/main/src-docs/src/views/icon/icons.js\nexport const euiIconTypes = {\n  accessibility: 'accessibility',\n  aggregate: 'aggregate',\n  analyzeEvent: 'analyzeEvent',\n  annotation: 'annotation',\n  apmTrace: 'apmTrace',\n  apps: 'apps',\n  arrowDown: 'arrowDown',\n  arrowLeft: 'arrowLeft',\n  arrowRight: 'arrowRight',\n  arrowUp: 'arrowUp',\n  arrowStart: 'arrowStart',\n  arrowEnd: 'arrowEnd',\n  article: 'article',\n  asterisk: 'asterisk',\n  at: 'at',\n  beaker: 'beaker',\n  bell: 'bell',\n  bellSlash: 'bellSlash',\n  beta: 'beta',\n  bolt: 'bolt',\n  boxesHorizontal: 'boxesHorizontal',\n  boxesVertical: 'boxesVertical',\n  branch: 'branch',\n  branchUser: 'branchUser',\n  broom: 'broom',\n  brush: 'brush',\n  bug: 'bug',\n  bullseye: 'bullseye',\n  calendar: 'calendar',\n  check: 'check',\n  checkInCircleFilled: 'checkInCircleFilled',\n  cheer: 'cheer',\n  clock: 'clock',\n  cloudDrizzle: 'cloudDrizzle',\n  cloudStormy: 'cloudStormy',\n  cloudSunny: 'cloudSunny',\n  cluster: 'cluster',\n  color: 'color',\n  compute: 'compute',\n  console: 'console',\n  container: 'container',\n  continuityAbove: 'continuityAbove',\n  continuityAboveBelow: 'continuityAboveBelow',\n  continuityBelow: 'continuityBelow',\n  continuityWithin: 'continuityWithin',\n  controlsHorizontal: 'controlsHorizontal',\n  controlsVertical: 'controlsVertical',\n  copy: 'copy',\n  copyClipboard: 'copyClipboard',\n  cross: 'cross',\n  crosshairs: 'crosshairs',\n  currency: 'currency',\n  cut: 'cut',\n  database: 'database',\n  desktop: 'desktop',\n  discuss: 'discuss',\n  document: 'document',\n  documents: 'documents',\n  documentEdit: 'documentEdit',\n  documentation: 'documentation',\n  dot: 'dot',\n  dotInCircle: 'dotInCircle',\n  doubleArrowLeft: 'doubleArrowLeft',\n  doubleArrowRight: 'doubleArrowRight',\n  download: 'download',\n  email: 'email',\n  empty: 'empty',\n  endpoint: 'endpoint',\n  eql: 'eql',\n  eraser: 'eraser',\n  error: 'error',\n  esqlVis: 'esqlVis',\n  exit: 'exit',\n  expand: 'expand',\n  expandMini: 'expandMini',\n  exportAction: 'exportAction',\n  eye: 'eye',\n  eyeClosed: 'eyeClosed',\n  faceHappy: 'faceHappy',\n  faceNeutral: 'faceNeutral',\n  faceSad: 'faceSad',\n  filter: 'filter',\n  filterExclude: 'filterExclude',\n  filterIgnore: 'filterIgnore',\n  filterInclude: 'filterInclude',\n  filterInCircle: 'filterInCircle',\n  flag: 'flag',\n  fold: 'fold',\n  folderCheck: 'folderCheck',\n  folderClosed: 'folderClosed',\n  folderExclamation: 'folderExclamation',\n  folderOpen: 'folderOpen',\n  frameNext: 'frameNext',\n  framePrevious: 'framePrevious',\n  fullScreen: 'fullScreen',\n  fullScreenExit: 'fullScreenExit',\n  function: 'function',\n  gear: 'gear',\n  glasses: 'glasses',\n  globe: 'globe',\n  grab: 'grab',\n  grabHorizontal: 'grabHorizontal',\n  grabOmnidirectional: 'grabOmnidirectional',\n  gradient: 'gradient',\n  grid: 'grid',\n  heart: 'heart',\n  heatmap: 'heatmap',\n  help: 'help',\n  home: 'home',\n  iInCircle: 'iInCircle',\n  image: 'image',\n  importAction: 'importAction',\n  indexClose: 'indexClose',\n  indexEdit: 'indexEdit',\n  indexFlush: 'indexFlush',\n  indexMapping: 'indexMapping',\n  indexOpen: 'indexOpen',\n  indexRuntime: 'indexRuntime',\n  indexSettings: 'indexSettings',\n  indexTemporary: 'indexTemporary',\n  infinity: 'infinity',\n  inputOutput: 'inputOutput',\n  inspect: 'inspect',\n  invert: 'invert',\n  ip: 'ip',\n  key: 'key',\n  keyboard: 'keyboard',\n  kqlField: 'kqlField',\n  kqlFunction: 'kqlFunction',\n  kqlOperand: 'kqlOperand',\n  kqlSelector: 'kqlSelector',\n  kqlValue: 'kqlValue',\n  kubernetesNode: 'kubernetesNode',\n  kubernetesPod: 'kubernetesPod',\n  launch: 'launch',\n  layers: 'layers',\n  lettering: 'lettering',\n  lineDashed: 'lineDashed',\n  lineDotted: 'lineDotted',\n  lineSolid: 'lineSolid',\n  link: 'link',\n  list: 'list',\n  listAdd: 'listAdd',\n  lock: 'lock',\n  lockOpen: 'lockOpen',\n  logstashFilter: 'logstashFilter',\n  logstashIf: 'logstashIf',\n  logstashInput: 'logstashInput',\n  logstashOutput: 'logstashOutput',\n  logstashQueue: 'logstashQueue',\n  magnifyWithExclamation: 'magnifyWithExclamation',\n  magnifyWithMinus: 'magnifyWithMinus',\n  magnifyWithPlus: 'magnifyWithPlus',\n  magnet: 'magnet',\n  mapMarker: 'mapMarker',\n  memory: 'memory',\n  merge: 'merge',\n  menu: 'menu',\n  menuDown: 'menuDown',\n  menuLeft: 'menuLeft',\n  menuRight: 'menuRight',\n  menuUp: 'menuUp',\n  minimize: 'minimize',\n  minus: 'minus',\n  minusInCircle: 'minusInCircle',\n  minusInCircleFilled: 'minusInCircleFilled',\n  mobile: 'mobile',\n  moon: 'moon',\n  namespace: 'namespace',\n  nested: 'nested',\n  node: 'node',\n  number: 'number',\n  offline: 'offline',\n  online: 'online',\n  package: 'package',\n  pageSelect: 'pageSelect',\n  pagesSelect: 'pagesSelect',\n  palette: 'palette',\n  paperClip: 'paperClip',\n  partial: 'partial',\n  pause: 'pause',\n  payment: 'payment',\n  pencil: 'pencil',\n  percent: 'percent',\n  pin: 'pin',\n  pinFilled: 'pinFilled',\n  pipeBreaks: 'pipeBreaks',\n  pipeNoBreaks: 'pipeNoBreaks',\n  pivot: 'pivot',\n  play: 'play',\n  playFilled: 'playFilled',\n  plus: 'plus',\n  plusInCircle: 'plusInCircle',\n  plusInCircleFilled: 'plusInCircleFilled',\n  popout: 'popout',\n  push: 'push',\n  questionInCircle: 'questionInCircle',\n  quote: 'quote',\n  refresh: 'refresh',\n  reporter: 'reporter',\n  returnKey: 'returnKey',\n  save: 'save',\n  scale: 'scale',\n  search: 'search',\n  securitySignal: 'securitySignal',\n  securitySignalDetected: 'securitySignalDetected',\n  securitySignalResolved: 'securitySignalResolved',\n  sessionViewer: 'sessionViewer',\n  shard: 'shard',\n  share: 'share',\n  snowflake: 'snowflake',\n  sortable: 'sortable',\n  sortAscending: 'sortAscending',\n  sortDescending: 'sortDescending',\n  sortDown: 'sortDown',\n  sortLeft: 'sortLeft',\n  sortRight: 'sortRight',\n  sortUp: 'sortUp',\n  spaces: 'spaces',\n  sparkles: 'sparkles',\n  starEmpty: 'starEmpty',\n  starEmptySpace: 'starEmptySpace',\n  starFilled: 'starFilled',\n  starFilledSpace: 'starFilledSpace',\n  starMinusEmpty: 'starMinusEmpty',\n  starMinusFilled: 'starMinusFilled',\n  starPlusEmpty: 'starPlusEmpty',\n  starPlusFilled: 'starPlusFilled',\n  stats: 'stats',\n  stop: 'stop',\n  stopFilled: 'stopFilled',\n  stopSlash: 'stopSlash',\n  storage: 'storage',\n  string: 'string',\n  submodule: 'submodule',\n  sun: 'sun',\n  symlink: 'symlink',\n  tableOfContents: 'tableOfContents',\n  tableDensityExpanded: 'tableDensityExpanded',\n  tableDensityCompact: 'tableDensityCompact',\n  tableDensityNormal: 'tableDensityNormal',\n  tag: 'tag',\n  tear: 'tear',\n  temperature: 'temperature',\n  timeline: 'timeline',\n  timelineWithArrow: 'timelineWithArrow',\n  timeRefresh: 'timeRefresh',\n  timeslider: 'timeslider',\n  training: 'training',\n  transitionLeftIn: 'transitionLeftIn',\n  transitionLeftOut: 'transitionLeftOut',\n  transitionTopIn: 'transitionTopIn',\n  transitionTopOut: 'transitionTopOut',\n  trash: 'trash',\n  unfold: 'unfold',\n  unlink: 'unlink',\n  user: 'user',\n  userAvatar: 'userAvatar',\n  users: 'users',\n  vector: 'vector',\n  videoPlayer: 'videoPlayer',\n  visArea: 'visArea',\n  visAreaStacked: 'visAreaStacked',\n  visBarHorizontal: 'visBarHorizontal',\n  visBarHorizontalStacked: 'visBarHorizontalStacked',\n  visBarVertical: 'visBarVertical',\n  visBarVerticalStacked: 'visBarVerticalStacked',\n  visGauge: 'visGauge',\n  visGoal: 'visGoal',\n  visLine: 'visLine',\n  visMapCoordinate: 'visMapCoordinate',\n  visMapRegion: 'visMapRegion',\n  visMetric: 'visMetric',\n  visPie: 'visPie',\n  visTable: 'visTable',\n  visTagCloud: 'visTagCloud',\n  visText: 'visText',\n  visTimelion: 'visTimelion',\n  visVega: 'visVega',\n  visVisualBuilder: 'visVisualBuilder',\n  warning: 'warning',\n  wordWrap: 'wordWrap',\n  wordWrapDisabled: 'wordWrapDisabled',\n  wrench: 'wrench',\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select, array, number, optionsKnob, boolean } from '@storybook/addon-knobs';\nimport {\n  OptionsTypeKnobSingleValue,\n  OptionsTypeKnobValue,\n  OptionsTypeOptionsProp,\n} from '@storybook/addon-knobs/dist/components/types';\nimport { OptionsKnobOptionsDisplay } from '@storybook/addon-knobs/dist/components/types/Options';\n\nimport { isFiniteNumber } from '@elastic/charts/src/utils/common';\n\n/**\n * Fix default storybook behavior that does not correctly parse numbers/strings in arrays\n */\nexport function getArrayKnob(\n  name: string,\n  values: (string | number)[],\n  separator?: string,\n  group?: string,\n): (string | number)[] {\n  const stringifiedValues = values.map<string>((d) => `${d}`);\n  return array(name, stringifiedValues, separator, group).map<string | number>((value: string) =>\n    Number.isFinite(parseFloat(value)) ? parseFloat(value) : value,\n  );\n}\n\n/**\n * Fix default storybook behavior that does not correctly parse numbers/strings in arrays\n */\nexport function getNumbersArrayKnob<T extends number>(\n  name: string,\n  values: T[],\n  separator?: string,\n  group?: string,\n): T[] {\n  const stringifiedValues = values.map<string>((d) => `${d}`);\n  return array(name, stringifiedValues, separator, group).map(parseFloat).filter(isFiniteNumber) as T[];\n}\n\nexport const getPositiveNumberKnob = (name: string, value: number, group?: string) =>\n  number(name, value, { min: 0 }, group);\n\nexport function getToggledNumberKnob<T>(initEnabled: boolean, fallbackValue: T) {\n  return (...[name, initialValue, options, group]: Parameters<typeof number>) => {\n    const enabled = boolean(`${name} - enabled`, initEnabled, group);\n    const value = number(name, initialValue, options, group);\n    return enabled ? value : fallbackValue;\n  };\n}\n\n/**\n * Treats select option values as numbers\n */\nexport const getNumberSelectKnob = <T extends number>(\n  name: string,\n  options: { [s: string]: T },\n  value: T,\n  group?: string,\n): T => (parseInt(select<T | string>(name, options, value, group) as string, 10) as T) || value;\n\n/**\n * Fix default storybook behavior which,\n * throws from when values array becomes empty :(\n */\nexport function getMultiSelectKnob<T extends OptionsTypeKnobSingleValue>(\n  name: string,\n  valuesObj: OptionsTypeOptionsProp<T>,\n  value: OptionsTypeKnobValue<T>,\n  display: OptionsKnobOptionsDisplay = 'multi-select',\n  group?: string,\n): T[] {\n  const knob = optionsKnob<T>(\n    name,\n    valuesObj,\n    value,\n    {\n      display,\n    },\n    group,\n  );\n\n  if (Array.isArray(knob)) return knob as T[];\n  if (typeof knob === 'string') return knob.split(/\\s*,\\s*/) as T[];\n  if (typeof knob === 'number') return [knob] as T[];\n  return !knob ? [] : knob;\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { Position, Placement, ScaleType, TooltipStickTo, CurveType, Fit } from '@elastic/charts';\nimport { PointShape } from '@elastic/charts/src';\nimport { TooltipType } from '@elastic/charts/src/specs/constants';\nimport { VerticalAlignment, HorizontalAlignment } from '@elastic/charts/src/utils/common';\n\nimport { getKnobsFnFromEnum } from './utils';\n\nconst getTooltipTypeKnob = getKnobsFnFromEnum(TooltipType, 'tooltip type', TooltipType.VerticalCursor);\n\nconst getPositionKnob = getKnobsFnFromEnum(Position, 'position', Position.Right);\n\nconst getPlacementKnob = getKnobsFnFromEnum(Placement, 'placement', undefined, {\n  allowUndefined: true,\n  undefinedLabel: 'Default',\n});\n\nconst getVerticalTextAlignmentKnob = getKnobsFnFromEnum(VerticalAlignment, 'Vertical Text alignment', undefined, {\n  allowUndefined: true,\n  undefinedLabel: 'None',\n});\n\nconst getHorizontalTextAlignmentKnob = getKnobsFnFromEnum(HorizontalAlignment, 'Horizontal Text alignment', undefined, {\n  allowUndefined: true,\n  undefinedLabel: 'None',\n});\n\nconst getStickToKnob = getKnobsFnFromEnum(TooltipStickTo, 'stickTo', TooltipStickTo.MousePosition, {\n  allowUndefined: true,\n  undefinedLabel: 'Default',\n});\n\nconst getEuiPopoverPositionKnob = getKnobsFnFromEnum(\n  {\n    upCenter: 'upCenter' as const,\n    upLeft: 'upLeft' as const,\n    upRight: 'upRight' as const,\n    downCenter: 'downCenter' as const,\n    downLeft: 'downLeft' as const,\n    downRight: 'downRight' as const,\n    leftCenter: 'leftCenter' as const,\n    leftUp: 'leftUp' as const,\n    leftDown: 'leftDown' as const,\n    rightCenter: 'rightCenter' as const,\n    rightUp: 'rightUp' as const,\n    rightDown: 'rightDown' as const,\n  },\n  'Popover position',\n  'leftCenter',\n  {\n    allowUndefined: false,\n  },\n);\n\nconst getScaleTypeKnob = getKnobsFnFromEnum(ScaleType, 'scaleType', ScaleType.Linear);\n\nconst getCurveTypeKnob = getKnobsFnFromEnum(CurveType, 'Curve', CurveType.CURVE_CARDINAL);\n\nconst getFitKnob = getKnobsFnFromEnum(Fit, 'fitting function', Fit.Average);\n\nconst getPointShapeKnob = getKnobsFnFromEnum(PointShape, 'point shape', PointShape.Circle);\n\nexport const enumKnobs = {\n  tooltipType: getTooltipTypeKnob,\n  position: getPositionKnob,\n  placement: getPlacementKnob,\n  stickTo: getStickToKnob,\n  euiPopoverPosition: getEuiPopoverPositionKnob,\n  verticalTextAlignment: getVerticalTextAlignmentKnob,\n  horizontalTextAlignment: getHorizontalTextAlignmentKnob,\n  scaleType: getScaleTypeKnob,\n  curve: getCurveTypeKnob,\n  fit: getFitKnob,\n  pointShape: getPointShapeKnob,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { euiIconTypes } from './constants';\nimport { getKnobsFnFromEnum } from './utils';\n\nconst getIconTypeKnob = getKnobsFnFromEnum(euiIconTypes, 'iconType', 'warning');\n\nexport const euiKnobs = {\n  getIconTypeKnob,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport {\n  getArrayKnob,\n  getNumberSelectKnob,\n  getPositiveNumberKnob,\n  getToggledNumberKnob,\n  getMultiSelectKnob,\n  getNumbersArrayKnob,\n} from './custom';\nimport { enumKnobs } from './enums';\nimport { euiKnobs } from './eui';\nimport { specialEnumKnobs } from './special_enums';\nimport { getKnobFromEnum } from './utils';\n\nexport const customKnobs = {\n  enum: {\n    ...enumKnobs,\n    ...specialEnumKnobs,\n  },\n  eui: euiKnobs,\n  fromEnum: getKnobFromEnum,\n  array: getArrayKnob,\n  numbersArray: getNumbersArrayKnob,\n  positiveNumber: getPositiveNumberKnob,\n  toggledNumber: getToggledNumberKnob,\n  numberSelect: getNumberSelectKnob,\n  multiSelect: getMultiSelectKnob,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport { $Values } from 'utility-types';\n\nimport {\n  Placement,\n  TooltipProps,\n  SeriesType,\n  BarSeries,\n  LineSeries,\n  AreaSeries,\n  BubbleSeries,\n  Rotation,\n} from '@elastic/charts';\n\nimport { getMultiSelectKnob, getNumberSelectKnob } from './custom';\n\n/**\n * Negative numbers do not behave well with vrt slugified naming\n */\nconst getRotationKnob = (name = 'chartRotation') =>\n  getNumberSelectKnob<Rotation>(\n    name,\n    {\n      '0 deg': 0,\n      '90 deg': 90,\n      '-90 deg': -90,\n      '180 deg': 180,\n    },\n    0,\n  );\n\nconst boundaryMap: Record<string, TooltipProps['boundary'] | null> = {\n  default: undefined,\n  chart: 'chart',\n};\n\nconst getBoundaryKnob = () => {\n  const boundaryString =\n    select<string>(\n      'Boundary Element',\n      {\n        Default: 'default',\n        Chart: 'chart',\n      },\n      'default',\n    ) ?? '';\n\n  return boundaryMap[boundaryString] ?? undefined;\n};\n\nconst getFallbackPlacementsKnob = (groupId?: string): Placement[] => {\n  return getMultiSelectKnob<Placement>(\n    'Fallback Placements',\n    {\n      Top: Placement.Top,\n      Bottom: Placement.Bottom,\n      Left: Placement.Left,\n      Right: Placement.Right,\n      TopStart: Placement.TopStart,\n      TopEnd: Placement.TopEnd,\n      BottomStart: Placement.BottomStart,\n      BottomEnd: Placement.BottomEnd,\n      RightStart: Placement.RightStart,\n      RightEnd: Placement.RightEnd,\n      LeftStart: Placement.LeftStart,\n      LeftEnd: Placement.LeftEnd,\n      Auto: Placement.Auto,\n      AutoStart: Placement.AutoStart,\n      AutoEnd: Placement.AutoEnd,\n    },\n    [Placement.Right, Placement.Left, Placement.Top, Placement.Bottom],\n    undefined,\n    groupId,\n  );\n};\n\nconst XYSeriesTypeMap = {\n  [SeriesType.Bar]: BarSeries,\n  [SeriesType.Line]: LineSeries,\n  [SeriesType.Area]: AreaSeries,\n  [SeriesType.Bubble]: BubbleSeries,\n};\n\nexport const getXYSeriesTypeKnob = (\n  name = 'SeriesType',\n  value: SeriesType = SeriesType.Bar,\n  options?: { group?: string; exclude: SeriesType[] },\n) => {\n  return select<SeriesType>(\n    name,\n    Object.fromEntries(Object.entries(SeriesType).filter(([, type]) => !(options?.exclude ?? []).includes(type))),\n    value,\n    options?.group,\n  );\n};\n\nexport const getXYSeriesKnob = (\n  name = 'SeriesType',\n  value: SeriesType = SeriesType.Bar,\n  options?: { group?: string; exclude: SeriesType[] },\n): [$Values<typeof XYSeriesTypeMap>, SeriesType] => {\n  const spectType = getXYSeriesTypeKnob(name, value, options);\n\n  return [XYSeriesTypeMap[spectType], spectType];\n};\n\nexport const specialEnumKnobs = {\n  rotation: getRotationKnob,\n  fallbackPlacements: getFallbackPlacementsKnob,\n  boundary: getBoundaryKnob,\n  xySeriesType: getXYSeriesTypeKnob,\n  xySeries: getXYSeriesKnob,\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { select } from '@storybook/addon-knobs';\nimport { SelectTypeKnobValue } from '@storybook/addon-knobs/dist/components/types';\nimport { kebabCase, startCase } from 'lodash';\n\nimport { ExtendsNever } from '@elastic/charts/src/utils/common';\n\nimport { getNumberSelectKnob } from './custom';\n\nexport type KnobFromEnumBaseOptions<AU extends boolean> = {\n  group?: string;\n  allowUndefined?: AU;\n  undefinedLabel?: string;\n};\n\nexport type KnobFromEnumOptions<\n  O extends Record<string, unknown>,\n  AU extends boolean = false,\n  I extends keyof O = never,\n  E extends keyof O = never,\n> = KnobFromEnumBaseOptions<AU> &\n  (\n    | {\n        include?: I[];\n        exclude?: never;\n      }\n    | {\n        include?: never;\n        exclude?: E[];\n      }\n  );\n\n/**\n * Generates storybook knobs from const enum\n * must be an enum type, types are not inferable from object literals\n *\n * There are a few ts ignores inside the function to force type alignment\n * All exterior input and output types are correctly aligned\n */\nexport const getKnobFromEnum = <\n  O extends Record<keyof O, SelectTypeKnobValue>,\n  T extends O[keyof O],\n  D extends ExtendsNever<I, O[Exclude<keyof O, E>] | AUR, O[Extract<keyof O, I>] | AUR>,\n  AU extends boolean = false,\n  I extends keyof O = never,\n  E extends keyof O = never,\n  AUR = AU extends true ? undefined : never,\n>(\n  name: string,\n  enumObject: O,\n  defaultValue: D,\n  { group, allowUndefined, undefinedLabel, ...rest }: KnobFromEnumOptions<O, AU, I, E> = {},\n): ExtendsNever<I, O[Exclude<keyof O, E>] | AUR, O[Extract<keyof O, I>] | AUR> => {\n  // @ts-ignore - force complex typings\n  const options = (Object.entries<T>(enumObject) as [keyof O, T][])\n    // @ts-ignore - skip key type checks\n    .filter('include' in rest ? ([k]) => rest.include!.includes(k) : () => true)\n    // @ts-ignore - skip key type checks\n    .filter('exclude' in rest ? ([k]) => !rest.exclude!.includes(k) : () => true)\n    .reduce<O>(\n      (acc, [key, value]) => {\n        // @ts-ignore - override key casing\n        acc[startCase(kebabCase(key))] = value;\n        return acc;\n      },\n      (allowUndefined ? { [undefinedLabel || 'Undefined']: undefined } : ({} as unknown)) as O,\n    );\n\n  const hasOnlyNumbers = Object.values(options).every((v) => typeof v === 'number');\n  const selectFunction = hasOnlyNumbers ? getNumberSelectKnob : select;\n  // @ts-ignore - force complex typings\n  const value = selectFunction<T>(name, options, defaultValue, group);\n\n  if (value === '' || value === undefined) {\n    // @ts-ignore - optional undefined return\n    if (allowUndefined) return undefined;\n\n    throw new Error(`Unable to get determine knob value [${name}]`); // likely due to bad or old url params\n  }\n\n  // @ts-ignore - force type alignment\n  return value;\n};\n\n/**\n * Generates reusable generic knob function from enum\n */\nexport function getKnobsFnFromEnum<\n  O extends Record<keyof O, SelectTypeKnobValue>,\n  T extends O[keyof O],\n  DF extends T | UAUR,\n  UAU extends boolean = never,\n  UAUR = UAU extends true ? undefined : never,\n>(\n  enumObject: O,\n  defaultName: string,\n  fallbackDefaultValue: DF,\n  optionOverrides: Pick<KnobFromEnumBaseOptions<UAU>, 'allowUndefined' | 'undefinedLabel'> = {},\n) {\n  return <\n    D extends ExtendsNever<I, O[Exclude<keyof O, E>] | AUR, O[Extract<keyof O, I>] | AUR>,\n    AU extends boolean = UAU,\n    I extends keyof O = never,\n    E extends keyof O = never,\n    AUR = AU extends true ? undefined : never,\n  >(\n    name = defaultName,\n    // @ts-ignore - type always aligned\n    defaultValue: D = fallbackDefaultValue,\n    // @ts-ignore - type always aligned\n    options: Omit<KnobFromEnumOptions<O, AU, I, E>, ExtendsNever<UAU, '', 'allowUndefined'>> = {},\n    // @ts-ignore - type always aligned\n  ) => getKnobFromEnum<O, T, D, AU, I, E, AUR>(name, enumObject, defaultValue, { ...options, ...optionOverrides });\n}\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport const SB_ACTION_PANEL = 'storybook/actions/panel';\nexport const SB_SOURCE_PANEL = 'storybook/source-loader/panel';\nexport const SB_KNOBS_PANEL = 'storybookjs/knobs/panel';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport React, { useEffect, useRef, useState } from 'react';\\n\\nimport { Font, cssFontShorthand } from '@elastic/charts/src/common/text_utils';\\nimport { withContext } from '@elastic/charts/src/renderers/canvas';\\nimport { withTextMeasure } from '@elastic/charts/src/utils/bbox/canvas_text_bbox_calculator';\\nimport { wrapText } from '@elastic/charts/src/utils/text/wrap';\\n\\nconst fontSize = 24;\\nconst font: Font = {\\n  fontStyle: 'normal',\\n  fontFamily: 'sans-serif',\\n  fontVariant: 'normal',\\n  fontWeight: 500,\\n  textColor: 'red',\\n};\\nconst fontStyle = cssFontShorthand(font, fontSize);\\nconst defaultText =\\n  'Bacon ipsum dolor amet mongoloadgendecoblue58d844d55c-9c24dtip flank kielbasa. Pork strip steak jowl chuck filet mignon, burgdoggen kevin tail.';\\n\\nexport const Example = () => {\\n  const [maxLineWidth, setMaxLineWidth] = useState(250);\\n  const [maxLines, setMaxLines] = useState(3);\\n  const [text, setText] = useState(defaultText);\\n  const canvasRef = useRef<HTMLCanvasElement>(null);\\n\\n  useEffect(() => {\\n    const canvas = canvasRef.current!;\\n    const ctx = canvas.getContext('2d')!;\\n\\n    withContext(ctx, () => {\\n      ctx.scale(window.devicePixelRatio, window.devicePixelRatio);\\n      ctx.fillStyle = 'white';\\n      ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\\n      ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);\\n\\n      ctx.font = fontStyle;\\n      ctx.textBaseline = 'top';\\n      ctx.strokeStyle = 'black';\\n      ctx.fillStyle = 'black';\\n      ctx.strokeRect(0, 0, maxLineWidth, fontSize * maxLines);\\n      withTextMeasure((measure) => {\\n        const lines = wrapText(text, font, fontSize, maxLineWidth, maxLines, measure, 'en');\\n        lines.forEach((line, i) => {\\n          ctx.fillText(line, 0, i * fontSize);\\n        });\\n      });\\n    });\\n  }, [text, maxLineWidth, maxLines]);\\n  const width = 500;\\n  const height = 500;\\n  return (\\n    <div className=\\\"echChart\\\">\\n      <div className=\\\"echChartStatus\\\" data-ech-render-complete={true} />\\n      <div>\\n        <label style={{ display: 'inline-block', width: 200 }}> Max Line Width [{maxLineWidth}px]</label>\\n        <input\\n          type=\\\"range\\\"\\n          min={0}\\n          max={width}\\n          value={maxLineWidth}\\n          className=\\\"slider\\\"\\n          id=\\\"maxLineWidth\\\"\\n          onInput={(e) => setMaxLineWidth(Number(e.currentTarget.value))}\\n        />\\n        <br />\\n        <label style={{ display: 'inline-block', width: 200 }}> Max Lines [{maxLines}]</label>\\n        <input\\n          type=\\\"range\\\"\\n          min=\\\"0\\\"\\n          max=\\\"10\\\"\\n          value={maxLines}\\n          className=\\\"slider\\\"\\n          id=\\\"maxLines\\\"\\n          onInput={(e) => setMaxLines(Number(e.currentTarget.value))}\\n        />\\n        <div\\n          style={{\\n            margin: '20px 0',\\n          }}\\n        >\\n          <p>HTML Text (editable)</p>\\n\\n          <textarea\\n            style={{\\n              padding: 0,\\n              margin: 0,\\n              width: maxLineWidth,\\n              height: maxLines * fontSize,\\n              fontSize,\\n              overflow: 'hidden',\\n              fontFamily: font.fontFamily,\\n              fontStyle: font.fontStyle,\\n              fontVariant: font.fontVariant,\\n              lineHeight: `${fontSize}px`,\\n              resize: 'none',\\n              textOverflow: 'ellipsis',\\n            }}\\n            value={text}\\n            onInput={(e) => setText(e.currentTarget.value)}\\n          />\\n        </div>\\n\\n        <p>Canvas Text</p>\\n        <canvas\\n          ref={canvasRef}\\n          width={width * window.devicePixelRatio}\\n          height={height * window.devicePixelRatio}\\n          style={{ width, height }}\\n        />\\n      </div>\\n    </div>\\n  );\\n};\\n\\nExample.parameters = {\\n  showHeader: true,\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":23,\"line\":28},\"endLoc\":{\"col\":1,\"line\":121},\"startBody\":{\"col\":23,\"line\":28},\"endBody\":{\"col\":1,\"line\":121}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { Font, cssFontShorthand } from '@elastic/charts/src/common/text_utils';\nimport { withContext } from '@elastic/charts/src/renderers/canvas';\nimport { withTextMeasure } from '@elastic/charts/src/utils/bbox/canvas_text_bbox_calculator';\nimport { wrapText } from '@elastic/charts/src/utils/text/wrap';\n\nconst fontSize = 24;\nconst font: Font = {\n  fontStyle: 'normal',\n  fontFamily: 'sans-serif',\n  fontVariant: 'normal',\n  fontWeight: 500,\n  textColor: 'red',\n};\nconst fontStyle = cssFontShorthand(font, fontSize);\nconst defaultText =\n  'Bacon ipsum dolor amet mongoloadgendecoblue58d844d55c-9c24dtip flank kielbasa. Pork strip steak jowl chuck filet mignon, burgdoggen kevin tail.';\n\nexport const Example = () => {\n  const [maxLineWidth, setMaxLineWidth] = useState(250);\n  const [maxLines, setMaxLines] = useState(3);\n  const [text, setText] = useState(defaultText);\n  const canvasRef = useRef<HTMLCanvasElement>(null);\n\n  useEffect(() => {\n    const canvas = canvasRef.current!;\n    const ctx = canvas.getContext('2d')!;\n\n    withContext(ctx, () => {\n      ctx.scale(window.devicePixelRatio, window.devicePixelRatio);\n      ctx.fillStyle = 'white';\n      ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n      ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);\n\n      ctx.font = fontStyle;\n      ctx.textBaseline = 'top';\n      ctx.strokeStyle = 'black';\n      ctx.fillStyle = 'black';\n      ctx.strokeRect(0, 0, maxLineWidth, fontSize * maxLines);\n      withTextMeasure((measure) => {\n        const lines = wrapText(text, font, fontSize, maxLineWidth, maxLines, measure, 'en');\n        lines.forEach((line, i) => {\n          ctx.fillText(line, 0, i * fontSize);\n        });\n      });\n    });\n  }, [text, maxLineWidth, maxLines]);\n  const width = 500;\n  const height = 500;\n  return (\n    <div className=\"echChart\">\n      <div className=\"echChartStatus\" data-ech-render-complete={true} />\n      <div>\n        <label style={{ display: 'inline-block', width: 200 }}> Max Line Width [{maxLineWidth}px]</label>\n        <input\n          type=\"range\"\n          min={0}\n          max={width}\n          value={maxLineWidth}\n          className=\"slider\"\n          id=\"maxLineWidth\"\n          onInput={(e) => setMaxLineWidth(Number(e.currentTarget.value))}\n        />\n        <br />\n        <label style={{ display: 'inline-block', width: 200 }}> Max Lines [{maxLines}]</label>\n        <input\n          type=\"range\"\n          min=\"0\"\n          max=\"10\"\n          value={maxLines}\n          className=\"slider\"\n          id=\"maxLines\"\n          onInput={(e) => setMaxLines(Number(e.currentTarget.value))}\n        />\n        <div\n          style={{\n            margin: '20px 0',\n          }}\n        >\n          <p>HTML Text (editable)</p>\n\n          <textarea\n            style={{\n              padding: 0,\n              margin: 0,\n              width: maxLineWidth,\n              height: maxLines * fontSize,\n              fontSize,\n              overflow: 'hidden',\n              fontFamily: font.fontFamily,\n              fontStyle: font.fontStyle,\n              fontVariant: font.fontVariant,\n              lineHeight: `${fontSize}px`,\n              resize: 'none',\n              textOverflow: 'ellipsis',\n            }}\n            value={text}\n            onInput={(e) => setText(e.currentTarget.value)}\n          />\n        </div>\n\n        <p>Canvas Text</p>\n        <canvas\n          ref={canvasRef}\n          width={width * window.devicePixelRatio}\n          height={height * window.devicePixelRatio}\n          style={{ width, height }}\n        />\n      </div>\n    </div>\n  );\n};\n\nExample.parameters = {\n  showHeader: true,\n};\n\n\n\nExample.parameters = { storySource: { source: \"() => {\\n  const [maxLineWidth, setMaxLineWidth] = useState(250);\\n  const [maxLines, setMaxLines] = useState(3);\\n  const [text, setText] = useState(defaultText);\\n  const canvasRef = useRef<HTMLCanvasElement>(null);\\n\\n  useEffect(() => {\\n    const canvas = canvasRef.current!;\\n    const ctx = canvas.getContext('2d')!;\\n\\n    withContext(ctx, () => {\\n      ctx.scale(window.devicePixelRatio, window.devicePixelRatio);\\n      ctx.fillStyle = 'white';\\n      ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);\\n      ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);\\n\\n      ctx.font = fontStyle;\\n      ctx.textBaseline = 'top';\\n      ctx.strokeStyle = 'black';\\n      ctx.fillStyle = 'black';\\n      ctx.strokeRect(0, 0, maxLineWidth, fontSize * maxLines);\\n      withTextMeasure((measure) => {\\n        const lines = wrapText(text, font, fontSize, maxLineWidth, maxLines, measure, 'en');\\n        lines.forEach((line, i) => {\\n          ctx.fillText(line, 0, i * fontSize);\\n        });\\n      });\\n    });\\n  }, [text, maxLineWidth, maxLines]);\\n  const width = 500;\\n  const height = 500;\\n  return (\\n    <div className=\\\"echChart\\\">\\n      <div className=\\\"echChartStatus\\\" data-ech-render-complete={true} />\\n      <div>\\n        <label style={{ display: 'inline-block', width: 200 }}> Max Line Width [{maxLineWidth}px]</label>\\n        <input\\n          type=\\\"range\\\"\\n          min={0}\\n          max={width}\\n          value={maxLineWidth}\\n          className=\\\"slider\\\"\\n          id=\\\"maxLineWidth\\\"\\n          onInput={(e) => setMaxLineWidth(Number(e.currentTarget.value))}\\n        />\\n        <br />\\n        <label style={{ display: 'inline-block', width: 200 }}> Max Lines [{maxLines}]</label>\\n        <input\\n          type=\\\"range\\\"\\n          min=\\\"0\\\"\\n          max=\\\"10\\\"\\n          value={maxLines}\\n          className=\\\"slider\\\"\\n          id=\\\"maxLines\\\"\\n          onInput={(e) => setMaxLines(Number(e.currentTarget.value))}\\n        />\\n        <div\\n          style={{\\n            margin: '20px 0',\\n          }}\\n        >\\n          <p>HTML Text (editable)</p>\\n\\n          <textarea\\n            style={{\\n              padding: 0,\\n              margin: 0,\\n              width: maxLineWidth,\\n              height: maxLines * fontSize,\\n              fontSize,\\n              overflow: 'hidden',\\n              fontFamily: font.fontFamily,\\n              fontStyle: font.fontStyle,\\n              fontVariant: font.fontVariant,\\n              lineHeight: `${fontSize}px`,\\n              resize: 'none',\\n              textOverflow: 'ellipsis',\\n            }}\\n            value={text}\\n            onInput={(e) => setText(e.currentTarget.value)}\\n          />\\n        </div>\\n\\n        <p>Canvas Text</p>\\n        <canvas\\n          ref={canvasRef}\\n          width={width * window.devicePixelRatio}\\n          height={height * window.devicePixelRatio}\\n          style={{ width, height }}\\n        />\\n      </div>\\n    </div>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport { Example as wrap } from './1_wrap.story';\n\nexport default {\n  title: 'Utils/Text',\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { boolean, button } from '@storybook/addon-knobs';\nimport { useEffect, useCallback, useState } from 'react';\n\nimport { ElementClickListener, HeatmapBrushEvent, HeatmapElementEvent, HeatmapHighlightedData } from '@elastic/charts';\n\nexport const useHeatmapSelection = (disableActions = false) => {\n  const [selection, setSelection] = useState<HeatmapHighlightedData | undefined>();\n  const clearSelection = useCallback(() => setSelection(undefined), []);\n  const onElementClick: ElementClickListener = useCallback(\n    (e) => {\n      if (!disableActions) action('onElementClick')(e);\n      const { x, y, smHorizontalAccessorValue, smVerticalAccessorValue } = (e as HeatmapElementEvent[])[0][0].datum;\n      setSelection({\n        x: [x],\n        y: [y],\n        smHorizontalAccessorValue,\n        smVerticalAccessorValue,\n      });\n    },\n    [disableActions],\n  );\n  const onBrushEnd = useCallback(\n    (e) => {\n      if (!disableActions) action('brushEvent')(e);\n      setSelection(e as HeatmapBrushEvent);\n    },\n    [disableActions],\n  );\n  useEffect(() => {\n    document.addEventListener('keyup', ({ key }) => {\n      if (key === 'Escape') clearSelection();\n    });\n  }, [clearSelection]);\n\n  const persistCellsSelection = boolean('Persist cells selection', true);\n  button('Clear cells selection', clearSelection);\n\n  return {\n    selection,\n    setSelection,\n    onBrushEnd,\n    onElementClick,\n    clearSelection,\n    highlightedData: persistCellsSelection ? selection : undefined,\n  };\n};\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport _, { Dictionary, NumericDictionary } from 'lodash';\nimport seedrandom from 'seedrandom';\n\nimport { BandFillColorAccessorInput } from '@elastic/charts';\nimport { arrayToLookup, hueInterpolator } from '@elastic/charts/src/common/color_calcs';\nimport { Color } from '@elastic/charts/src/common/colors';\nimport {\n  countryDimension,\n  productDimension,\n  regionDimension,\n  productPriceNames,\n} from '@elastic/charts/src/mocks/hierarchical/dimension_codes';\nimport { palettes } from '@elastic/charts/src/mocks/hierarchical/palettes';\nimport { getRNGSeed } from '@elastic/charts/src/mocks/utils';\n\nexport const productLookup = arrayToLookup((d: any) => d.sitc1, productDimension);\nexport const regionLookup = arrayToLookup((d: any) => d.region, regionDimension);\nexport const countryLookup = arrayToLookup((d: any) => d.country, countryDimension);\nexport const productPriceLookup = arrayToLookup((d: any) => d.products_price, productPriceNames);\n\ntype ColorMaker = (x: number) => string;\n\nexport const getBandFillColorFn =\n  (colorMap: { [k: number]: Color }) =>\n  ({ value: x }: BandFillColorAccessorInput): Color =>\n    colorMap[x];\n\n// interpolation based, cyclical color example\nexport const interpolatorCET2s = (opacity = 0.7) =>\n  hueInterpolator(palettes.CET2s.map(([r, g, b]) => [r, g, b, opacity]));\nexport const interpolatorTurbo = (opacity = 0.7) =>\n  hueInterpolator(palettes.turbo.map(([r, g, b]) => [r, g, b, opacity]));\nexport const indexInterpolatedFillColor = (colorMaker: ColorMaker) => (d: any, i: number, a: any[]) =>\n  colorMaker(i / (a.length + 1));\n\n// colorbrewer2.org based, categorical color example\ntype RGBStrings = [string, string, string][];\nconst colorBrewerExportMatcher = /rgb\\((\\d{1,3}),(\\d{1,3}),(\\d{1,3})\\)/;\nconst rgbStringToTuple = (s: string) => (colorBrewerExportMatcher.exec(s) as string[]).slice(1);\nconst hexStringToTuple = (s: string) => [\n  String(parseInt(s.slice(1, 3), 16)),\n  String(parseInt(s.slice(3, 5), 16)),\n  String(parseInt(s.slice(5, 7), 16)),\n];\n\nexport const wait = <T extends () => any>(n: number, cb: T): Promise<ReturnType<T>> => {\n  return new Promise<ReturnType<T>>((resolve) => setTimeout(resolve, n)).then(cb);\n};\n\nexport const plasma18 = [\n  '#0d0887',\n  '#2f0596',\n  '#4903a0',\n  '#6100a7',\n  '#7801a8',\n  '#8e0ca4',\n  '#a21d9a',\n  '#b42e8d',\n  '#c43e7f',\n  '#d24f71',\n  '#de6164',\n  '#e97257',\n  '#f3854b',\n  '#f99a3e',\n  '#fdaf31',\n  '#fdc627',\n  '#f8df25',\n  '#f0f921',\n].map(hexStringToTuple) as RGBStrings;\n\nexport const viridis18 = [\n  '#440154',\n  '#481769',\n  '#472a7a',\n  '#433d84',\n  '#3d4e8a',\n  '#355e8d',\n  '#2e6d8e',\n  '#297b8e',\n  '#23898e',\n  '#1f978b',\n  '#21a585',\n  '#2eb37c',\n  '#46c06f',\n  '#65cb5e',\n  '#89d548',\n  '#b0dd2f',\n  '#d8e219',\n  '#fde725',\n].map(hexStringToTuple) as RGBStrings;\n\nexport const cividis18 = [\n  '#002051',\n  '#002b64',\n  '#0f356c',\n  '#23406e',\n  '#374a6e',\n  '#4b556d',\n  '#5c606e',\n  '#6c6b70',\n  '#797673',\n  '#858176',\n  '#928d78',\n  '#9f9978',\n  '#aea575',\n  '#bfb26f',\n  '#d2bf66',\n  '#e4cd5a',\n  '#f4db4e',\n  '#fdea45',\n].map(hexStringToTuple) as RGBStrings;\n\nexport const inferno18 = [\n  '#000004',\n  '#0a0722',\n  '#1e0c45',\n  '#380962',\n  '#510e6c',\n  '#69166e',\n  '#801f6c',\n  '#982766',\n  '#b0315b',\n  '#c63d4d',\n  '#d94d3d',\n  '#e9612b',\n  '#f47918',\n  '#fa9407',\n  '#fcb014',\n  '#f8cd37',\n  '#f2ea69',\n  '#fcffa4',\n].map(hexStringToTuple) as RGBStrings;\n\nexport const colorBrewerSequential9: RGBStrings = [\n  'rgb(255,247,251)',\n  'rgb(236,231,242)',\n  'rgb(208,209,230)',\n  'rgb(166,189,219)',\n  'rgb(116,169,207)',\n  'rgb(54,144,192)',\n  'rgb(5,112,176)',\n  'rgb(4,90,141)',\n  'rgb(2,56,88)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerDiverging11: RGBStrings = [\n  'rgb(158,1,66)',\n  'rgb(213,62,79)',\n  'rgb(244,109,67)',\n  'rgb(253,174,97)',\n  'rgb(254,224,139)',\n  'rgb(255,255,191)',\n  'rgb(230,245,152)',\n  'rgb(171,221,164)',\n  'rgb(102,194,165)',\n  'rgb(50,136,189)',\n  'rgb(94,79,162)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategoricalPastel9: RGBStrings = [\n  'rgb(141,211,199)',\n  'rgb(188,128,189)',\n  'rgb(190,186,218)',\n  'rgb(251,128,114)',\n  'rgb(128,177,211)',\n  'rgb(253,180,98)',\n  'rgb(179,222,105)',\n  'rgb(252,205,229)',\n  'rgb(217,217,217)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategorical12: RGBStrings = [\n  'rgb(166,206,227)',\n  'rgb(31,120,180)',\n  'rgb(178,223,138)',\n  'rgb(51,160,44)',\n  'rgb(251,154,153)',\n  'rgb(227,26,28)',\n  'rgb(253,191,111)',\n  'rgb(255,127,0)',\n  'rgb(202,178,214)',\n  'rgb(106,61,154)',\n  'rgb(255,255,153)',\n  'rgb(177,89,40)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategoricalPastel12: RGBStrings = [\n  'rgb(166,206,227)',\n  'rgb(31,120,180)',\n  'rgb(178,223,138)',\n  'rgb(51,160,44)',\n  'rgb(251,154,153)',\n  'rgb(227,26,28)',\n  'rgb(253,191,111)',\n  'rgb(255,127,0)',\n  'rgb(202,178,214)',\n  'rgb(106,61,154)',\n  'rgb(255,255,153)',\n  'rgb(177,89,40)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategoricalPastel12B: RGBStrings = [\n  'rgb(141,211,199)',\n  'rgb(255,255,179)',\n  'rgb(190,186,218)',\n  'rgb(251,128,114)',\n  'rgb(128,177,211)',\n  'rgb(253,180,98)',\n  'rgb(179,222,105)',\n  'rgb(252,205,229)',\n  'rgb(217,217,217)',\n  'rgb(188,128,189)',\n  'rgb(204,235,197)',\n  'rgb(255,237,111)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const colorBrewerCategoricalStark9: RGBStrings = [\n  'rgb(228,26,28)',\n  'rgb(55,126,184)',\n  'rgb(77,175,74)',\n  'rgb(152,78,163)',\n  'rgb(255,127,0)',\n  'rgb(255,255,51)',\n  'rgb(166,86,40)',\n  'rgb(247,129,191)',\n  'rgb(153,153,153)',\n].map(rgbStringToTuple) as RGBStrings;\n\nexport const discreteColor =\n  (categoricalColors: RGBStrings, opacity = 1) =>\n  (i: number) =>\n    `rgba(${categoricalColors[i % categoricalColors.length].concat([opacity.toString()]).join(',')})`;\n\nexport const decreasingOpacityCET2 = (opacity: number) => (d: any, i: number, a: any[]) =>\n  hueInterpolator(palettes.CET2s.map(([r, g, b]) => [r, g, b, opacity]))(i / (a.length + 1));\n\nexport function sampleSize<T>(\n  collection: Dictionary<T> | NumericDictionary<T> | null | undefined,\n  n?: number,\n  seed = getRNGSeed(),\n): T[] {\n  seedrandom(seed, { global: true });\n  const lodash = _.runInContext();\n  return lodash.sampleSize(collection, n);\n}\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\n\\nimport { ArrayEntry } from '../../../packages/charts/src/chart_types/partition_chart/layout/utils/group_by_rollup';\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { colorBrewerCategoricalStark9, discreteColor } from '../utils/utils';\\n\\nconst rng = getRandomNumberGenerator();\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  const ascendingSort = boolean('ascending sort', false);\\n  // this is used to test the sorting capabilities\\n  const data = mocks.pie.slice(0, 4).sort(() => (rng(0, 1, 3) > 0.5 ? 1 : -1));\\n  const names: Record<string, string> = { '7': 'Al', '3': 'Au', '5': 'Ag', '8': 'Cu' };\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        theme={{\\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={showDebug}\\n        showLegend\\n        flatLegend\\n        showLegendExtra\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={PartitionLayout.waffle}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => names[d],\\n            shape: {\\n              fillColor: (nodeKey, sortIndex) => discreteColor(colorBrewerCategoricalStark9.slice(1))(sortIndex),\\n            },\\n            sortPredicate: ascendingSort\\n              ? ([, node1]: ArrayEntry, [, node2]: ArrayEntry) => {\\n                  return node1.value - node2.value;\\n                }\\n              : undefined, // the descending sort is applied by default\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":23},\"endLoc\":{\"col\":1,\"line\":64},\"startBody\":{\"col\":36,\"line\":23},\"endBody\":{\"col\":1,\"line\":64}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings, defaultPartitionValueFormatter } from '@elastic/charts';\nimport { mocks } from '@elastic/charts/src/mocks/hierarchical';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\n\nimport { ArrayEntry } from '../../../packages/charts/src/chart_types/partition_chart/layout/utils/group_by_rollup';\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { colorBrewerCategoricalStark9, discreteColor } from '../utils/utils';\n\nconst rng = getRandomNumberGenerator();\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const showDebug = boolean('show table for debugging', false);\n  const ascendingSort = boolean('ascending sort', false);\n  // this is used to test the sorting capabilities\n  const data = mocks.pie.slice(0, 4).sort(() => (rng(0, 1, 3) > 0.5 ? 1 : -1));\n  const names: Record<string, string> = { '7': 'Al', '3': 'Au', '5': 'Ag', '8': 'Cu' };\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings\n        theme={{\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\n        }}\n        baseTheme={useBaseTheme()}\n        debug={showDebug}\n        showLegend\n        flatLegend\n        showLegendExtra\n      />\n      <Partition\n        id=\"spec_1\"\n        data={data}\n        layout={PartitionLayout.waffle}\n        valueAccessor={(d: Datum) => d.exportVal as number}\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\u00A0Bn`}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.sitc1,\n            nodeLabel: (d: Datum) => names[d],\n            shape: {\n              fillColor: (nodeKey, sortIndex) => discreteColor(colorBrewerCategoricalStark9.slice(1))(sortIndex),\n            },\n            sortPredicate: ascendingSort\n              ? ([, node1]: ArrayEntry, [, node2]: ArrayEntry) => {\n                  return node1.value - node2.value;\n                }\n              : undefined, // the descending sort is applied by default\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const showDebug = boolean('show table for debugging', false);\\n  const ascendingSort = boolean('ascending sort', false);\\n  // this is used to test the sorting capabilities\\n  const data = mocks.pie.slice(0, 4).sort(() => (rng(0, 1, 3) > 0.5 ? 1 : -1));\\n  const names: Record<string, string> = { '7': 'Al', '3': 'Au', '5': 'Ag', '8': 'Cu' };\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        theme={{\\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        debug={showDebug}\\n        showLegend\\n        flatLegend\\n        showLegendExtra\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={data}\\n        layout={PartitionLayout.waffle}\\n        valueAccessor={(d: Datum) => d.exportVal as number}\\n        valueFormatter={(d: number) => `$${defaultPartitionValueFormatter(Math.round(d / 1000000000))}\\\\u00A0Bn`}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.sitc1,\\n            nodeLabel: (d: Datum) => names[d],\\n            shape: {\\n              fillColor: (nodeKey, sortIndex) => discreteColor(colorBrewerCategoricalStark9.slice(1))(sortIndex),\\n            },\\n            sortPredicate: ascendingSort\\n              ? ([, node1]: ArrayEntry, [, node2]: ArrayEntry) => {\\n                  return node1.value - node2.value;\\n                }\\n              : undefined, // the descending sort is applied by default\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { boolean } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Datum, Partition, PartitionLayout, Settings } from '@elastic/charts';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\nimport { colorBrewerCategoricalStark9, discreteColor, productPriceLookup } from '../utils/utils';\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const useOpaqueColor = boolean('use alpha', false);\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        theme={{\\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        showLegend\\n        flatLegend\\n        showLegendExtra\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[\\n          { products_price: 0.0, median_day_of_week_i: 13 },\\n          { products_price: 50.0, median_day_of_week_i: 3 },\\n          { products_price: 100.0, median_day_of_week_i: 4 },\\n          { products_price: 150.0, median_day_of_week_i: 3 },\\n          { products_price: 200.0, median_day_of_week_i: 4 },\\n          { products_price: 350.0, median_day_of_week_i: 0 },\\n          { products_price: 400.0, median_day_of_week_i: 0 },\\n          { products_price: 1050.0, median_day_of_week_i: 0 },\\n        ]}\\n        layout={PartitionLayout.waffle}\\n        valueAccessor={(d: Datum) => d.median_day_of_week_i as number}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.products_price,\\n            nodeLabel: (d: Datum) => productPriceLookup[d].name,\\n            shape: {\\n              fillColor: (nodeKey, sortIndex) =>\\n                discreteColor(colorBrewerCategoricalStark9.slice(1), useOpaqueColor ? 0.5 : 1)(sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":18},\"endLoc\":{\"col\":1,\"line\":58},\"startBody\":{\"col\":36,\"line\":18},\"endBody\":{\"col\":1,\"line\":58}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { boolean } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Datum, Partition, PartitionLayout, Settings } from '@elastic/charts';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\nimport { colorBrewerCategoricalStark9, discreteColor, productPriceLookup } from '../utils/utils';\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const useOpaqueColor = boolean('use alpha', false);\n  return (\n    <Chart title={title} description={description} className=\"story-chart\">\n      <Settings\n        theme={{\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\n        }}\n        baseTheme={useBaseTheme()}\n        showLegend\n        flatLegend\n        showLegendExtra\n      />\n      <Partition\n        id=\"spec_1\"\n        data={[\n          { products_price: 0.0, median_day_of_week_i: 13 },\n          { products_price: 50.0, median_day_of_week_i: 3 },\n          { products_price: 100.0, median_day_of_week_i: 4 },\n          { products_price: 150.0, median_day_of_week_i: 3 },\n          { products_price: 200.0, median_day_of_week_i: 4 },\n          { products_price: 350.0, median_day_of_week_i: 0 },\n          { products_price: 400.0, median_day_of_week_i: 0 },\n          { products_price: 1050.0, median_day_of_week_i: 0 },\n        ]}\n        layout={PartitionLayout.waffle}\n        valueAccessor={(d: Datum) => d.median_day_of_week_i as number}\n        layers={[\n          {\n            groupByRollup: (d: Datum) => d.products_price,\n            nodeLabel: (d: Datum) => productPriceLookup[d].name,\n            shape: {\n              fillColor: (nodeKey, sortIndex) =>\n                discreteColor(colorBrewerCategoricalStark9.slice(1), useOpaqueColor ? 0.5 : 1)(sortIndex),\n            },\n          },\n        ]}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const useOpaqueColor = boolean('use alpha', false);\\n  return (\\n    <Chart title={title} description={description} className=\\\"story-chart\\\">\\n      <Settings\\n        theme={{\\n          chartPaddings: { left: 170, right: 170, top: 70, bottom: 70 },\\n        }}\\n        baseTheme={useBaseTheme()}\\n        showLegend\\n        flatLegend\\n        showLegendExtra\\n      />\\n      <Partition\\n        id=\\\"spec_1\\\"\\n        data={[\\n          { products_price: 0.0, median_day_of_week_i: 13 },\\n          { products_price: 50.0, median_day_of_week_i: 3 },\\n          { products_price: 100.0, median_day_of_week_i: 4 },\\n          { products_price: 150.0, median_day_of_week_i: 3 },\\n          { products_price: 200.0, median_day_of_week_i: 4 },\\n          { products_price: 350.0, median_day_of_week_i: 0 },\\n          { products_price: 400.0, median_day_of_week_i: 0 },\\n          { products_price: 1050.0, median_day_of_week_i: 0 },\\n        ]}\\n        layout={PartitionLayout.waffle}\\n        valueAccessor={(d: Datum) => d.median_day_of_week_i as number}\\n        layers={[\\n          {\\n            groupByRollup: (d: Datum) => d.products_price,\\n            nodeLabel: (d: Datum) => productPriceLookup[d].name,\\n            shape: {\\n              fillColor: (nodeKey, sortIndex) =>\\n                discreteColor(colorBrewerCategoricalStark9.slice(1), useOpaqueColor ? 0.5 : 1)(sortIndex),\\n            },\\n          },\\n        ]}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Waffle (@alpha)',\n};\n\nexport { Example as simple } from './1_simple.story';\nexport { Example as test } from './2_test.story';\n","\n    /* eslint-disable */\n    // @ts-nocheck\n    // @ts-ignore\n    var __STORY__ = \"/*\\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\\n * or more contributor license agreements. Licensed under the Elastic License\\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\\n * in compliance with, at your election, the Elastic License 2.0 or the Server\\n * Side Public License, v 1.\\n */\\n\\nimport { action } from '@storybook/addon-actions';\\nimport { color, number, select } from '@storybook/addon-knobs';\\nimport React from 'react';\\n\\nimport { Chart, Settings, Wordcloud, FontStyle, WordcloudSpec, Color, WordCloudElementEvent } from '@elastic/charts';\\nimport { WeightFn, WordModel } from '@elastic/charts/src/chart_types/wordcloud/layout/types/viewmodel_types';\\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\\nimport { palettes as euiPalettes } from '@elastic/charts/src/utils/themes/colors';\\n\\nimport { ChartsStory } from '../../types';\\nimport { useBaseTheme } from '../../use_base_theme';\\n\\nconst text =\\n  'Webtwo ipsum sifteo twones chegg lijit meevee spotify, joukuu wakoopa greplin. Sclipo octopart wufoo, balihoo. Kiko groupon fleck revver blyve joyent dogster, zoodles zooomr scribd dogster mog. Zinch orkut jabber trulia, sclipo. Chumby imvu rovio ning zoho akismet napster, kippt zillow mzinga zoho. ' +\\n  'Zoho cotweet cloudera zinch spock divvyshot edmodo convore, geni palantir geni woopra divvyshot. Zoho imeem convore orkut oooj foodzie airbnb, jabber rovio klout spotify dropio. Insala octopart wikia xobni airbnb quora mzinga elgg, mog quora blekko boxbe plickers zlio. Sococo chumby trulia ebay sococo zoho lijit, spock nuvvo omgpop heekya koofers. Kazaa voki chegg napster mozy koofers, meebo heroku empressr foodzie. ' +\\n  // 'Meevee movity fleck waze palantir glogster ebay, scribd chegg zinch spotify. Zinch vimeo joukuu insala jaiku squidoo, kaboodle quora shopify. Imeem plickers zapier ning eskobo movity omgpop zillow, voxy knewton napster kippt quora gooru. Whrrl chegg klout hulu greplin, dogster balihoo yuntaa. Oovoo ebay kosmix eduvant meebo ning, akismet zapier meevee. Oooooc blekko cotweet nuvvo sclipo zinch movity kaboodle, zooomr insala sclipo loopt hojoki qeyno. Airbnb palantir skype, etsy. ' +\\n  // 'Joost cotweet knewton bubbli, unigo twones. Akismet skype scribd vimeo, skype omgpop kno imvu, shopify dropio. Jajah heroku xobni glogster twones jabber rovio, jaiku blippy wikia jumo oooooc. Jumo lijit tumblr jibjab zooomr sifteo hojoki mog reddit, jabber twitter zinch doostang wakoopa ebay. Yoono klout weebly geni blippy, twitter kno yoono edmodo, joyent joukuu mzinga. ' +\\n  'zappos. Ning babblely trulia zooomr vimeo, zimbra plaxo. Zooomr blyve stypi joukuu imvu chumby voxy, ideeli omgpop elgg geni qeyno joyent, loopt reddit eskobo flickr odeo. Heekya plickers wesabe lijit kno, hojoki convore.';\\n\\nconst getRandomNumber = getRandomNumberGenerator();\\n\\nconst palettes = {\\n  turquoise: (d: RawDatum, i: number) => ['#5bc0be', '#6fffe9'][i % 2],\\n  vivid: (d: RawDatum, i: number) => ['#2ec4b6', '#e71d36', '#ff9f1c'][i % 3],\\n  warm: (d: RawDatum, i: number) => ['#edc951', '#eb6841', '#cc2a36', '#4f372d', '#00a0b0'][i % 5],\\n  greenBlues: () => `rgb(${getRandomNumber(0, 10)}, ${getRandomNumber(50, 100)}, ${getRandomNumber(50, 100)})`,\\n  redBlue: () => `rgb(${getRandomNumber(100, 255)},${0},${getRandomNumber(100, 255)})`,\\n  greyScale: () => {\\n    const level = getRandomNumber(0, 200);\\n    return `rgb(${level},${level},${level})`;\\n  },\\n  weight: (d: RawDatum) => {\\n    const level = (1 - d.weight ** 15) * 200;\\n    return `rgb(${level},${level},${level})`;\\n  },\\n  colorByWordLength: (d: RawDatum) => {\\n    const level = d.text.length;\\n    return `rgb(${level < 5 ? level * 60 : level < 7 ? level * 40 : level * 25},${\\n      level < 5 ? level * 5 : level < 7 ? level * 10 : level * 5\\n    },${level < 5 ? level * 25 : level < 7 ? level * 40 : level * 15})`;\\n  },\\n  euiLight: (d: RawDatum, i: number) => {\\n    return euiPalettes.echPaletteForLightBackground.colors[i % euiPalettes.echPaletteForLightBackground.colors.length];\\n  },\\n  euiColorBlind: (d: RawDatum, i: number) => {\\n    return euiPalettes.echPaletteColorBlind.colors[i % euiPalettes.echPaletteColorBlind.colors.length];\\n  },\\n};\\n\\ntype WordcloudKnobs = Omit<WordcloudSpec, 'specType' | 'chartType' | 'data' | 'outOfRoomCallback' | 'id'> & {\\n  palette: keyof typeof palettes;\\n  backgroundColor: Color;\\n};\\n\\n// Used in e2e testing\\nexport const TEMPLATES = ['edit', 'single', 'rightAngled', 'multiple', 'squareWords', 'smallWaves', 'sparse'];\\nconst getTemplate = (name: string): WordcloudKnobs => {\\n  switch (name) {\\n    case 'single':\\n      return {\\n        spiral: 'rectangular',\\n        startAngle: 0,\\n        endAngle: 0,\\n        angleCount: 1,\\n        padding: 1,\\n        exponent: 4,\\n        fontWeight: 900,\\n        minFontSize: 14,\\n        maxFontSize: 92,\\n        fontFamily: 'Arial',\\n        fontStyle: 'normal',\\n        palette: 'greyScale',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#9fa714',\\n      };\\n    case 'rightAngled':\\n      return {\\n        spiral: 'rectangular',\\n        startAngle: 0,\\n        endAngle: 90,\\n        angleCount: 2,\\n        padding: 1,\\n        exponent: 4,\\n        fontWeight: 600,\\n        minFontSize: 14,\\n        maxFontSize: 92,\\n        fontFamily: 'Arial Narrow',\\n        fontStyle: 'normal',\\n        palette: 'euiLight',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#ffffff',\\n      };\\n    case 'multiple':\\n      return {\\n        spiral: 'archimedean',\\n        startAngle: -90,\\n        endAngle: 90,\\n        angleCount: 16,\\n        padding: 1,\\n        exponent: 15,\\n        fontWeight: 100,\\n        minFontSize: 16,\\n        maxFontSize: 50,\\n        fontFamily: 'Luminari',\\n        fontStyle: 'italic',\\n        palette: 'redBlue',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#1c1c24',\\n      };\\n    case 'squareWords':\\n      return {\\n        spiral: 'archimedean',\\n        startAngle: -45,\\n        endAngle: 45,\\n        angleCount: 2,\\n        padding: 0,\\n        exponent: 3,\\n        fontWeight: 100,\\n        minFontSize: 10,\\n        maxFontSize: 90,\\n        fontFamily: 'Arial Narrow',\\n        fontStyle: 'normal',\\n        palette: 'weight',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#4a6960',\\n      };\\n    case 'smallWaves':\\n      return {\\n        spiral: 'rectangular',\\n        startAngle: -15,\\n        endAngle: 15,\\n        angleCount: 7,\\n        padding: 0.5,\\n        exponent: 5,\\n        fontWeight: 600,\\n        minFontSize: 17,\\n        maxFontSize: 79,\\n        fontFamily: 'Impact',\\n        fontStyle: 'normal',\\n        palette: 'euiColorBlind',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#ffffff',\\n      };\\n    case 'sparse':\\n      return {\\n        spiral: 'rectangular',\\n        startAngle: 0,\\n        endAngle: 0,\\n        angleCount: 1,\\n        padding: getRandomNumber(2, 22),\\n        exponent: 15,\\n        fontWeight: 600,\\n        minFontSize: 12,\\n        maxFontSize: 60,\\n        fontFamily: 'Courier',\\n        fontStyle: 'normal',\\n        palette: 'vivid',\\n        weightFn: WeightFn.exponential,\\n        backgroundColor: '#1c1c24',\\n      };\\n    case 'edit':\\n    default:\\n      return {\\n        spiral: select('shape', { oval: 'archimedean', rectangular: 'rectangular' }, 'archimedean'),\\n        startAngle: number('startAngle', -90, { range: true, min: -360, max: 360, step: 1 }),\\n        endAngle: number('endAngle', 90, { range: true, min: -360, max: 360, step: 1 }),\\n        angleCount: number('angleCount', 16, { range: true, min: 2, max: 360, step: 1 }),\\n        padding: number('padding', 0.5, { range: true, min: 0, max: 10, step: 0.5 }),\\n        exponent: number('exponent', 15, { range: true, min: 0, max: 15, step: 1 }),\\n        fontWeight: number('fontWeight', 900, { range: true, min: 100, max: 900, step: 100 }),\\n        minFontSize: number('minFontSize', 15, { range: true, min: 6, max: 85, step: 1 }),\\n        maxFontSize: number('maxFontSize', 80, { range: true, min: 15, max: 150, step: 1 }),\\n        fontFamily: select(\\n          'fontFamily',\\n          {\\n            Arial: 'Arial',\\n            'Arial Narrow': 'Arial Narrow',\\n            Courier: 'Courier',\\n            Impact: 'Impact',\\n            Luminari: 'Luminari',\\n          },\\n          'Arial',\\n        ),\\n        fontStyle: select<FontStyle>('fontStyle', { normal: 'normal', italic: 'italic' }, 'italic'),\\n        palette: select(\\n          'palette',\\n          Object.keys(palettes).reduce((p, k) => ({ ...p, [k]: k }), {}),\\n          'turquoise',\\n        ),\\n        weightFn: select(\\n          'weightFn',\\n          {\\n            linear: WeightFn.linear,\\n            exponential: WeightFn.exponential,\\n            squareRoot: WeightFn.squareRoot,\\n            log: WeightFn.log,\\n          },\\n          WeightFn.exponential,\\n        ),\\n        backgroundColor: color('background', '#1c1c24'),\\n      };\\n  }\\n};\\n\\nconst rawData = text\\n  .replaceAll(/[,.]/g, '')\\n  .toLowerCase()\\n  .split(' ')\\n  .filter((d, index, a) => a.indexOf(d) === index)\\n  .map(function wordMapper(d) {\\n    return {\\n      text: d,\\n      weight: getRandomNumber(0, 1, 20),\\n    };\\n  });\\n\\ninterface RawDatum {\\n  text: string;\\n  weight: number;\\n}\\n\\nfunction sampleData(paletteName: keyof typeof palettes): WordModel[] {\\n  return rawData.map(function rawMapper(d, i) {\\n    return {\\n      ...d,\\n      color: palettes[paletteName](d, i),\\n    };\\n  });\\n}\\n\\nexport const Example: ChartsStory = (_, { title, description }) => {\\n  const configName = select(\\n    'template',\\n    TEMPLATES.reduce((p, k) => ({ ...p, [k]: k }), {}),\\n    'edit',\\n  );\\n  const { backgroundColor, palette, ...knobs } = getTemplate(configName);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{ background: { color: backgroundColor } }}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={(d) => {\\n          const datum = (d as WordCloudElementEvent[])[0][0];\\n          action('onElementClick')(`${datum.text}: ${datum.weight}`);\\n        }}\\n        onElementOver={(d) => {\\n          const datum = (d as WordCloudElementEvent[])[0][0];\\n          action('onElementOver')(`${datum.text}: ${datum.weight}`);\\n        }}\\n      />\\n      <Wordcloud\\n        id=\\\"spec_1\\\"\\n        {...knobs}\\n        data={sampleData(palette)}\\n        outOfRoomCallback={(wordCount: number, renderedWordCount: number, renderedWords: string[]) => {\\n          action('outOfRoomCallback')(\\n            `Managed to render ${renderedWordCount} words out of ${wordCount} words: ${renderedWords.join(', ')}`,\\n          );\\n        }}\\n      />\\n    </Chart>\\n  );\\n};\\n\";\n    // @ts-ignore\n    var __LOCATIONS_MAP__ = {\"Example\":{\"startLoc\":{\"col\":36,\"line\":239},\"endLoc\":{\"col\":1,\"line\":273},\"startBody\":{\"col\":36,\"line\":239},\"endBody\":{\"col\":1,\"line\":273}}};\n    \n/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { action } from '@storybook/addon-actions';\nimport { color, number, select } from '@storybook/addon-knobs';\nimport React from 'react';\n\nimport { Chart, Settings, Wordcloud, FontStyle, WordcloudSpec, Color, WordCloudElementEvent } from '@elastic/charts';\nimport { WeightFn, WordModel } from '@elastic/charts/src/chart_types/wordcloud/layout/types/viewmodel_types';\nimport { getRandomNumberGenerator } from '@elastic/charts/src/mocks/utils';\nimport { palettes as euiPalettes } from '@elastic/charts/src/utils/themes/colors';\n\nimport { ChartsStory } from '../../types';\nimport { useBaseTheme } from '../../use_base_theme';\n\nconst text =\n  'Webtwo ipsum sifteo twones chegg lijit meevee spotify, joukuu wakoopa greplin. Sclipo octopart wufoo, balihoo. Kiko groupon fleck revver blyve joyent dogster, zoodles zooomr scribd dogster mog. Zinch orkut jabber trulia, sclipo. Chumby imvu rovio ning zoho akismet napster, kippt zillow mzinga zoho. ' +\n  'Zoho cotweet cloudera zinch spock divvyshot edmodo convore, geni palantir geni woopra divvyshot. Zoho imeem convore orkut oooj foodzie airbnb, jabber rovio klout spotify dropio. Insala octopart wikia xobni airbnb quora mzinga elgg, mog quora blekko boxbe plickers zlio. Sococo chumby trulia ebay sococo zoho lijit, spock nuvvo omgpop heekya koofers. Kazaa voki chegg napster mozy koofers, meebo heroku empressr foodzie. ' +\n  // 'Meevee movity fleck waze palantir glogster ebay, scribd chegg zinch spotify. Zinch vimeo joukuu insala jaiku squidoo, kaboodle quora shopify. Imeem plickers zapier ning eskobo movity omgpop zillow, voxy knewton napster kippt quora gooru. Whrrl chegg klout hulu greplin, dogster balihoo yuntaa. Oovoo ebay kosmix eduvant meebo ning, akismet zapier meevee. Oooooc blekko cotweet nuvvo sclipo zinch movity kaboodle, zooomr insala sclipo loopt hojoki qeyno. Airbnb palantir skype, etsy. ' +\n  // 'Joost cotweet knewton bubbli, unigo twones. Akismet skype scribd vimeo, skype omgpop kno imvu, shopify dropio. Jajah heroku xobni glogster twones jabber rovio, jaiku blippy wikia jumo oooooc. Jumo lijit tumblr jibjab zooomr sifteo hojoki mog reddit, jabber twitter zinch doostang wakoopa ebay. Yoono klout weebly geni blippy, twitter kno yoono edmodo, joyent joukuu mzinga. ' +\n  'zappos. Ning babblely trulia zooomr vimeo, zimbra plaxo. Zooomr blyve stypi joukuu imvu chumby voxy, ideeli omgpop elgg geni qeyno joyent, loopt reddit eskobo flickr odeo. Heekya plickers wesabe lijit kno, hojoki convore.';\n\nconst getRandomNumber = getRandomNumberGenerator();\n\nconst palettes = {\n  turquoise: (d: RawDatum, i: number) => ['#5bc0be', '#6fffe9'][i % 2],\n  vivid: (d: RawDatum, i: number) => ['#2ec4b6', '#e71d36', '#ff9f1c'][i % 3],\n  warm: (d: RawDatum, i: number) => ['#edc951', '#eb6841', '#cc2a36', '#4f372d', '#00a0b0'][i % 5],\n  greenBlues: () => `rgb(${getRandomNumber(0, 10)}, ${getRandomNumber(50, 100)}, ${getRandomNumber(50, 100)})`,\n  redBlue: () => `rgb(${getRandomNumber(100, 255)},${0},${getRandomNumber(100, 255)})`,\n  greyScale: () => {\n    const level = getRandomNumber(0, 200);\n    return `rgb(${level},${level},${level})`;\n  },\n  weight: (d: RawDatum) => {\n    const level = (1 - d.weight ** 15) * 200;\n    return `rgb(${level},${level},${level})`;\n  },\n  colorByWordLength: (d: RawDatum) => {\n    const level = d.text.length;\n    return `rgb(${level < 5 ? level * 60 : level < 7 ? level * 40 : level * 25},${\n      level < 5 ? level * 5 : level < 7 ? level * 10 : level * 5\n    },${level < 5 ? level * 25 : level < 7 ? level * 40 : level * 15})`;\n  },\n  euiLight: (d: RawDatum, i: number) => {\n    return euiPalettes.echPaletteForLightBackground.colors[i % euiPalettes.echPaletteForLightBackground.colors.length];\n  },\n  euiColorBlind: (d: RawDatum, i: number) => {\n    return euiPalettes.echPaletteColorBlind.colors[i % euiPalettes.echPaletteColorBlind.colors.length];\n  },\n};\n\ntype WordcloudKnobs = Omit<WordcloudSpec, 'specType' | 'chartType' | 'data' | 'outOfRoomCallback' | 'id'> & {\n  palette: keyof typeof palettes;\n  backgroundColor: Color;\n};\n\n// Used in e2e testing\nexport const TEMPLATES = ['edit', 'single', 'rightAngled', 'multiple', 'squareWords', 'smallWaves', 'sparse'];\nconst getTemplate = (name: string): WordcloudKnobs => {\n  switch (name) {\n    case 'single':\n      return {\n        spiral: 'rectangular',\n        startAngle: 0,\n        endAngle: 0,\n        angleCount: 1,\n        padding: 1,\n        exponent: 4,\n        fontWeight: 900,\n        minFontSize: 14,\n        maxFontSize: 92,\n        fontFamily: 'Arial',\n        fontStyle: 'normal',\n        palette: 'greyScale',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#9fa714',\n      };\n    case 'rightAngled':\n      return {\n        spiral: 'rectangular',\n        startAngle: 0,\n        endAngle: 90,\n        angleCount: 2,\n        padding: 1,\n        exponent: 4,\n        fontWeight: 600,\n        minFontSize: 14,\n        maxFontSize: 92,\n        fontFamily: 'Arial Narrow',\n        fontStyle: 'normal',\n        palette: 'euiLight',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#ffffff',\n      };\n    case 'multiple':\n      return {\n        spiral: 'archimedean',\n        startAngle: -90,\n        endAngle: 90,\n        angleCount: 16,\n        padding: 1,\n        exponent: 15,\n        fontWeight: 100,\n        minFontSize: 16,\n        maxFontSize: 50,\n        fontFamily: 'Luminari',\n        fontStyle: 'italic',\n        palette: 'redBlue',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#1c1c24',\n      };\n    case 'squareWords':\n      return {\n        spiral: 'archimedean',\n        startAngle: -45,\n        endAngle: 45,\n        angleCount: 2,\n        padding: 0,\n        exponent: 3,\n        fontWeight: 100,\n        minFontSize: 10,\n        maxFontSize: 90,\n        fontFamily: 'Arial Narrow',\n        fontStyle: 'normal',\n        palette: 'weight',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#4a6960',\n      };\n    case 'smallWaves':\n      return {\n        spiral: 'rectangular',\n        startAngle: -15,\n        endAngle: 15,\n        angleCount: 7,\n        padding: 0.5,\n        exponent: 5,\n        fontWeight: 600,\n        minFontSize: 17,\n        maxFontSize: 79,\n        fontFamily: 'Impact',\n        fontStyle: 'normal',\n        palette: 'euiColorBlind',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#ffffff',\n      };\n    case 'sparse':\n      return {\n        spiral: 'rectangular',\n        startAngle: 0,\n        endAngle: 0,\n        angleCount: 1,\n        padding: getRandomNumber(2, 22),\n        exponent: 15,\n        fontWeight: 600,\n        minFontSize: 12,\n        maxFontSize: 60,\n        fontFamily: 'Courier',\n        fontStyle: 'normal',\n        palette: 'vivid',\n        weightFn: WeightFn.exponential,\n        backgroundColor: '#1c1c24',\n      };\n    case 'edit':\n    default:\n      return {\n        spiral: select('shape', { oval: 'archimedean', rectangular: 'rectangular' }, 'archimedean'),\n        startAngle: number('startAngle', -90, { range: true, min: -360, max: 360, step: 1 }),\n        endAngle: number('endAngle', 90, { range: true, min: -360, max: 360, step: 1 }),\n        angleCount: number('angleCount', 16, { range: true, min: 2, max: 360, step: 1 }),\n        padding: number('padding', 0.5, { range: true, min: 0, max: 10, step: 0.5 }),\n        exponent: number('exponent', 15, { range: true, min: 0, max: 15, step: 1 }),\n        fontWeight: number('fontWeight', 900, { range: true, min: 100, max: 900, step: 100 }),\n        minFontSize: number('minFontSize', 15, { range: true, min: 6, max: 85, step: 1 }),\n        maxFontSize: number('maxFontSize', 80, { range: true, min: 15, max: 150, step: 1 }),\n        fontFamily: select(\n          'fontFamily',\n          {\n            Arial: 'Arial',\n            'Arial Narrow': 'Arial Narrow',\n            Courier: 'Courier',\n            Impact: 'Impact',\n            Luminari: 'Luminari',\n          },\n          'Arial',\n        ),\n        fontStyle: select<FontStyle>('fontStyle', { normal: 'normal', italic: 'italic' }, 'italic'),\n        palette: select(\n          'palette',\n          Object.keys(palettes).reduce((p, k) => ({ ...p, [k]: k }), {}),\n          'turquoise',\n        ),\n        weightFn: select(\n          'weightFn',\n          {\n            linear: WeightFn.linear,\n            exponential: WeightFn.exponential,\n            squareRoot: WeightFn.squareRoot,\n            log: WeightFn.log,\n          },\n          WeightFn.exponential,\n        ),\n        backgroundColor: color('background', '#1c1c24'),\n      };\n  }\n};\n\nconst rawData = text\n  .replaceAll(/[,.]/g, '')\n  .toLowerCase()\n  .split(' ')\n  .filter((d, index, a) => a.indexOf(d) === index)\n  .map(function wordMapper(d) {\n    return {\n      text: d,\n      weight: getRandomNumber(0, 1, 20),\n    };\n  });\n\ninterface RawDatum {\n  text: string;\n  weight: number;\n}\n\nfunction sampleData(paletteName: keyof typeof palettes): WordModel[] {\n  return rawData.map(function rawMapper(d, i) {\n    return {\n      ...d,\n      color: palettes[paletteName](d, i),\n    };\n  });\n}\n\nexport const Example: ChartsStory = (_, { title, description }) => {\n  const configName = select(\n    'template',\n    TEMPLATES.reduce((p, k) => ({ ...p, [k]: k }), {}),\n    'edit',\n  );\n  const { backgroundColor, palette, ...knobs } = getTemplate(configName);\n\n  return (\n    <Chart title={title} description={description}>\n      <Settings\n        theme={{ background: { color: backgroundColor } }}\n        baseTheme={useBaseTheme()}\n        onElementClick={(d) => {\n          const datum = (d as WordCloudElementEvent[])[0][0];\n          action('onElementClick')(`${datum.text}: ${datum.weight}`);\n        }}\n        onElementOver={(d) => {\n          const datum = (d as WordCloudElementEvent[])[0][0];\n          action('onElementOver')(`${datum.text}: ${datum.weight}`);\n        }}\n      />\n      <Wordcloud\n        id=\"spec_1\"\n        {...knobs}\n        data={sampleData(palette)}\n        outOfRoomCallback={(wordCount: number, renderedWordCount: number, renderedWords: string[]) => {\n          action('outOfRoomCallback')(\n            `Managed to render ${renderedWordCount} words out of ${wordCount} words: ${renderedWords.join(', ')}`,\n          );\n        }}\n      />\n    </Chart>\n  );\n};\n\n\n\nExample.parameters = { storySource: { source: \"(_, { title, description }) => {\\n  const configName = select(\\n    'template',\\n    TEMPLATES.reduce((p, k) => ({ ...p, [k]: k }), {}),\\n    'edit',\\n  );\\n  const { backgroundColor, palette, ...knobs } = getTemplate(configName);\\n\\n  return (\\n    <Chart title={title} description={description}>\\n      <Settings\\n        theme={{ background: { color: backgroundColor } }}\\n        baseTheme={useBaseTheme()}\\n        onElementClick={(d) => {\\n          const datum = (d as WordCloudElementEvent[])[0][0];\\n          action('onElementClick')(`${datum.text}: ${datum.weight}`);\\n        }}\\n        onElementOver={(d) => {\\n          const datum = (d as WordCloudElementEvent[])[0][0];\\n          action('onElementOver')(`${datum.text}: ${datum.weight}`);\\n        }}\\n      />\\n      <Wordcloud\\n        id=\\\"spec_1\\\"\\n        {...knobs}\\n        data={sampleData(palette)}\\n        outOfRoomCallback={(wordCount: number, renderedWordCount: number, renderedWords: string[]) => {\\n          action('outOfRoomCallback')(\\n            `Managed to render ${renderedWordCount} words out of ${wordCount} words: ${renderedWords.join(', ')}`,\\n          );\\n        }}\\n      />\\n    </Chart>\\n  );\\n}\" }, ...Example.parameters };","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nexport default {\n  title: 'Wordcloud (@alpha)',\n};\n\nexport { Example as simpleWordcloud } from './1_wordcloud.story';\n","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { EuiProvider, EuiMarkdownFormat, EuiFlexGroup, EuiFlexItem, EuiHorizontalRule, EuiText } from '@elastic/eui';\nimport { DecoratorFunction } from '@storybook/addons';\nimport classNames from 'classnames';\nimport React, { CSSProperties, FC, PropsWithChildren } from 'react';\n\nimport { StoryGlobals, StoryParameters } from './types';\nimport { ThemeId, ThemeIdProvider, BackgroundIdProvider } from './use_base_theme';\n\nconst ResizeWrapper: FC<PropsWithChildren<{ resize: StoryParameters['resize'] }>> = ({ resize, children }) =>\n  resize ? (\n    <div id=\"story-resize-wrapper\" style={resize === true ? {} : resize}>\n      {children}\n    </div>\n  ) : (\n    <>{children}</>\n  );\n\nexport const StoryWrapper: DecoratorFunction<JSX.Element> = (Story, context) => {\n  if (!Story) return <div>No Story</div>;\n\n  const globals = (context.globals as StoryGlobals) ?? {};\n  const parameters = (context.parameters as StoryParameters) ?? {};\n\n  const themeId = (globals.theme as ThemeId) ?? ThemeId.Light;\n  const backgroundId = globals.background;\n  const {\n    showHeader = false,\n    showChartTitle = false,\n    showChartDescription = false,\n    showChartBoundary = false,\n  } = globals.toggles ?? {};\n  const { markdown, resize } = parameters;\n  const colorMode = themeId.includes('light') ? 'light' : 'dark';\n\n  return (\n    <EuiProvider colorMode={colorMode}>\n      <ThemeIdProvider value={themeId}>\n        <BackgroundIdProvider value={backgroundId}>\n          <EuiFlexGroup gutterSize=\"none\" direction=\"column\" responsive={false}>\n            {showHeader && !showChartTitle && !showChartDescription && (\n              <EuiFlexItem id=\"story-header\" grow={false}>\n                <EuiFlexGroup gutterSize=\"none\" direction=\"column\" responsive={false}>\n                  <EuiFlexItem>\n                    <EuiText>\n                      <h1 style={{ fontWeight: 200 }}>{context.kind}</h1>\n                    </EuiText>\n                  </EuiFlexItem>\n\n                  <EuiFlexItem>\n                    <EuiText>\n                      <h2 style={{ fontWeight: 400 }}>{context.name}</h2>\n                    </EuiText>\n                  </EuiFlexItem>\n\n                  <EuiHorizontalRule />\n                </EuiFlexGroup>\n              </EuiFlexItem>\n            )}\n\n            <EuiFlexItem grow={false}>\n              <div\n                id=\"story-root\"\n                className={classNames({\n                  showChartBoundary,\n                  resizeHeight: (resize as CSSProperties)?.height === undefined,\n                })}\n              >\n                <ResizeWrapper resize={resize}>\n                  <Story\n                    {...context}\n                    title={showChartTitle ? context.kind : undefined}\n                    description={showChartDescription ? context.name : undefined}\n                  />\n                </ResizeWrapper>\n              </div>\n            </EuiFlexItem>\n            {markdown && (\n              <EuiFlexItem style={{ padding: 24 }}>\n                <EuiMarkdownFormat>{markdown}</EuiMarkdownFormat>\n              </EuiFlexItem>\n            )}\n          </EuiFlexGroup>\n        </BackgroundIdProvider>\n      </ThemeIdProvider>\n    </EuiProvider>\n  );\n};\n","import '@storybook/react';","var api = require(\"!../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n            var content = require(\"!!../node_modules/css-loader/dist/cjs.js??ref--17-1!../node_modules/postcss-loader/dist/cjs.js??ref--17-2!../node_modules/sass-loader/dist/cjs.js??ref--17-3!./style.scss\");\n\n            content = content.__esModule ? content.default : content;\n\n            if (typeof content === 'string') {\n              content = [[module.id, content, '']];\n            }\n\nvar options = {\"attributes\":{\"nonce\":\"Pk1rZ1XDlMuYe8ubWV3Lh0BzwrTigJQ=\"}};\n\noptions.insert = \"head\";\noptions.singleton = false;\n\nvar update = api(content, options);\n\n\n\nmodule.exports = content.locals || {};","/*\n * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one\n * or more contributor license agreements. Licensed under the Elastic License\n * 2.0 and the Server Side Public License, v 1; you may not use this file except\n * in compliance with, at your election, the Elastic License 2.0 or the Server\n * Side Public License, v 1.\n */\n\nimport { createContext, useContext } from 'react';\nimport { $Values } from 'utility-types';\n\nimport {\n  Theme,\n  LIGHT_THEME,\n  DARK_THEME,\n  LEGACY_CHART_MARGINS,\n  LEGACY_DARK_THEME,\n  LEGACY_LIGHT_THEME,\n} from '@elastic/charts';\nimport { mergePartial } from '@elastic/charts/src/utils/common';\n\nimport { storybookParameters } from './parameters';\n\n/**\n * Available themes\n * @internal\n */\nexport const ThemeId = Object.freeze({\n  Light: 'light' as const,\n  Dark: 'dark' as const,\n  // TODO remove legacy themes\n  LegacyLight: 'legacy-light' as const,\n  LegacyDark: 'legacy-dark' as const,\n});\n/** @internal */\nexport type ThemeId = $Values<typeof ThemeId>;\n\nconst ThemeContext = createContext<ThemeId>(ThemeId.Light);\nconst BackgroundContext = createContext<string | undefined>(undefined);\n\nexport const ThemeIdProvider = ThemeContext.Provider;\nexport const BackgroundIdProvider = BackgroundContext.Provider;\n\nconst themeMap = {\n  [ThemeId.Light]: LIGHT_THEME,\n  [ThemeId.Dark]: DARK_THEME,\n  [ThemeId.LegacyLight]: LEGACY_LIGHT_THEME,\n  [ThemeId.LegacyDark]: LEGACY_DARK_THEME,\n};\n\nconst getBackground = (backgroundId?: string) => {\n  if (!backgroundId) {\n    return undefined;\n  }\n  const option = (storybookParameters?.background?.options ?? []).find(({ id }) => id === backgroundId);\n  return option?.background ?? option?.color;\n};\n\nexport const useThemeId = (): ThemeId => {\n  return useContext(ThemeContext);\n};\n\nexport const useBaseTheme = (): Theme => {\n  const themeId = useThemeId();\n  const backgroundId = useContext(BackgroundContext);\n  const theme = themeMap[themeId] ?? LIGHT_THEME;\n  const backgroundColor = getBackground(backgroundId);\n\n  return mergePartial(theme, {\n    // Keep this just for consistency for the first pass of theme changes\n    chartMargins: LEGACY_CHART_MARGINS,\n    background: { color: backgroundColor },\n  });\n};\n","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */","/* (ignored) */"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;AC92HA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;ACNA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;ACNA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;ACfA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACnSA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAHA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAWA;AACA;;;AA5BA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAOA;AACA;AACA;AACA;AAFA;AAIA;;;AAEA;AACA;AACA;;;;;;AA5CA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAiBA;AACA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAOA;AACA;AACA;AAEA;AAKA;AAIA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AALA;AAQA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAnIA;AAqIA;AACA;AACA;AAlKA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AA+BA;;;;;AAKA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AAHA;AAIA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAHA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;;;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAoBA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AATA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAtBA;AAyBA;AApDA;AA2DA;;;;AAjJA;AACA;AAAA;AACA;AAkJA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAtBA;AACA;AAwBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAfA;AAoBA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC9RA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA3HA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAOA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAOA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;;;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAtFA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;;;ACVA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAOA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAMA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAOA;AACA;AAMA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;;;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AAxGA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;AACA;AACA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAaA;AACA;AACA;AADA;;;AAGA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAFA;AAKA;AAEA;AAEA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AAKA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AA1FA;AA4FA;;;;;;;;;;;;;;ACrKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AASA;AACA;AACA;AADA;AAGA;AACA;AAEA;AAAA;AAAA;AAEA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAFA;AAIA;AAXA;AAaA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;AAEA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AARA;AAUA;AACA;AACA;AAnBA;AADA;AAuBA;;;;;;;;;;;;;;ACzCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAiDA;AAQA;AAQA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAAA;;;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AACA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AASA;AAYA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AASA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AA9BA;AAgCA;AACA;AACA;AACA;AACA;AACA;AACA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AArBA;AAuBA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAKA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;;;;;;;;;;;;;;AC/QA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAuBA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAFA;AAKA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AAFA;AAhBA;AAsBA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AACA;AAMA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AAlFA;AAoFA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAIA;;;;;;;;;;;;;;ACvNA;;;;;;AAMA;AACA;;;;;;;;AAEA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;AAGA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAVA;AAaA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAVA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAXA;AAaA;AACA;AACA;AACA;;;;;;;;;;;;;;AC9EA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;AAKA;AACA;AACA;AACA;AAAA;AACA;AAAA;AA8BA;AACA;AACA;AADA;AACA;AACA;AACA;AAAA;;;;AAIA;AACA;AACA;AACA;AAVA;AAiCA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AAHA;AAFA;AACA;AADA;AAUA;AAEA;AACA;AAFA;AAOA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AAEA;AAMA;AACA;AACA;AApBA;;;;;;;;;;;;;;ACvGA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAGA;AAiBA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AAFA;AAIA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAGA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AAGA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAEA;AAFA;AAIA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC9IA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAMA;AACA;AAAA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;AAMA;AACA;AAAA;;;AAIA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACpDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AARA;AACA;AAuDA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAOA;AACA;AACA;AAGA;AADA;AAFA;AAAA;AACA;AACA;AAKA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAfA;AAAA;AACA;AAoBA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AACA;AACA;AACA;AADA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AACA;AAAA;AAIA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAnCA;AACA;AA8CA;AACA;AAAA;AAUA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAnBA;AACA;AAmBA;AAKA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;;;;;;;;;;;;;;AC3WA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAcA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAAA;AACA;AAqEA;AAEA;AACA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAQA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AADA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AAAA;AACA;AAKA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAkCA;;;;;AA2DA;AAAA;AACA;AADA;AACA;;;AAAA;AACA;AAzDA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAGA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AA6CA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AA6DA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AACA;AADA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;;AACA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AACA;AAAA;AACA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AACA;AAyBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAmCA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AADA;AACA;AACA;AADA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAOA;AAOA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AAQA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAfA;AAmBA;AACA;AACA;AAFA;AADA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAFA;AAmBA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAFA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAFA;AAeA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAbA;AAsBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAFA;AAeA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAFA;AAgBA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAFA;AAeA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAFA;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAFA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AAaA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAFA;AAIA;AApBA;AAwBA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AACA;AAAA;AAIA;AAMA;AACA;AAWA;AACA;AAEA;AACA;AAmBA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAIA;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;;;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAIA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAzmCA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AAEA;AAEA;AAEA;AAGA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAtCA;AAuCA;AACA;;;AAwBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AAEA;AACA;AACA;;;AAgDA;;;AACA;AACA;;;AAOA;AAAA;AAAA;AACA;AACA;;;AA0BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AAuBA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AARA;AAYA;AACA;AAAA;AACA;;;AA2VA;AACA;AACA;AACA;AACA;AACA;;;AAuUA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;;AArgCA;AACA;AAAA;AAqdA;AACA;AAitBA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAjBA;AAkBA;AACA;AACA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AACA;AADA;;;;;;;;;;;;;;;ACv3CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAOA;AACA;;;AAPA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AA5BA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AACA;AADA;AACA;AANA;AACA;AACA;AA0BA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AA5CA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAYA;AACA;AACA;AACA;;;;;;AA1CA;AAqDA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;;AARA;AACA;AADA;AAWA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;;AARA;AACA;AADA;AAWA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAlCA;AACA;AADA;AAqCA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAEA;;;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;;AAlCA;AACA;AADA;;;;;;;;;;;;;;AC/IA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAoBA;AAEA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AAEA;AAAA;AACA;AACA;AAAA;AAWA;AAXA;AACA;AAmBA;AAAA;AAiBA;AAjBA;AACA;AACA;AAmBA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AAcA;AACA;AAaA;AACA;AAaA;AACA;AAaA;AACA;AACA;AAaA;AACA;AACA;AAaA;AACA;AAaA;AACA;AAaA;AACA;AAGA;AACA;AAUA;AACA;AAGA;AACA;AAUA;AACA;AAaA;AACA;AAEA;AACA;AAaA;AAYA;AAxRA;AACA;AAFA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AADA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA/EA;AAgFA;AACA;AAAA;AAWA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AArCA;;;;;;;;;;;;;;AC5GA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAmBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AAIA;AACA;AACA;AACA;AAJA;AAxBA;AAlBA;AACA;AADA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAIA;AAEA;;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAEA;;AAEA;AACA;AACA;AAOA;AAOA;;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAhDA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAMA;AAAA;AAAA;AAKA;AAAA;AAAA;AAQA;AAAA;AAAA;AAeA;AAAA;AAAA;AAOA;AAAA;AAAA;AASA;AAAA;AAAA;AAQA;AAAA;AAAA;AA2CA;AACA;AAAA;AAkBA;AACA;AAAA;AAsCA;AACA;AAAA;AAiBA;AACA;AAAA;;;;;;;;;;;;;;ACtMA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAsBA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AA6CA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAbA;AAgBA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAhBA;AAmBA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACxGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AASA;AACA;AACA;AADA;AASA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAOA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AAlDA;AAqDA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAYA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAEA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AArFA;AAwFA;AACA;AAAA;AAWA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;;;;AAzDA;AACA;AA2DA;AACA;AACA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAQA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAFA;AAOA;AAEA;AAOA;AAKA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AAPA;AAAA;AAUA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAOA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAHA;AAAA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AANA;AAHA;AAAA;AAaA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AAHA;AAcA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AAHA;AAgBA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AALA;AAHA;AAYA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AALA;AAHA;AAeA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAGA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArQA;;;;;;;;;;;;;;AC7OA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAGA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AAVA;AAWA;;;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;AC1GA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAGA;AAGA;AACA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AACA;AACA;AACA;AAEA;AACA;AAIA;AACA;AACA;AAHA;AAMA;AADA;AAKA;AAIA;AACA;AACA;AAHA;AAMA;AADA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAHA;AAAA;AAKA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAFA;AAAA;AAIA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AA1BA;AACA;AA4BA;AAAA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AA/GA;AACA;AA+GA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACtIA;;;;;;AAMA;AACA;;;;;;;;;;;;AAEA;AAGA;AACA;AACA;AADA;AACA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAuBA;;;;;AASA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AAHA;AAIA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAXA;AAcA;AAAA;AAAA;AAIA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;;AArGA;AACA;AAAA;AACA;AAsGA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAdA;AACA;AAgBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACzMA;;;;;;AAMA;AACA;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AA+DA;AAEA;AACA;AAFA;AASA;;;;AAIA;AACA;AAAA;;;AASA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAMA;AACA;AACA;AAMA;AACA;AACA;AAjCA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AASA;AAAA;AACA;AATA;AACA;AAoHA;AAAA;AAAA;AACA;AA7GA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAEA;AAAA;AACA;AAAA;AAGA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AAnHA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACrCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;AACA;AACA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAgBA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AAAA;AAAA;AAAA;AAAA;AAOA;AARA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAGA;AACA;AACA;AAAA;AACA;AAGA;AAGA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;;;;;;;;;;;;;;ACnEA;;;;;;AAMA;AACA;;;;;;;;AAIA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA;AACA;AAIA;;;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAFA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAXA;AAaA;AAEA;AACA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAOA;AA4DA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAgDA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AARA;AAAA;AACA;AADA;;;;;;;;;;;;;;AC9HA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAGA;AAKA;AACA;AACA;AADA;AAWA;AACA;AAYA;AACA;AACA;AA1BA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AA6BA;AAKA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAOA;AACA;AAEA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAKA;AACA;AAEA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AALA;AAOA;AAEA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAEA;AAOA;AAGA;AAEA;AAEA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AApBA;AAsBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AAGA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;;;AACA;AAMA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AACA;AACA;AAIA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAIA;AAEA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAEA;;;;AAIA;AACA;AACA;AADA;;;AAMA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAVA;AAAA;AACA;AAWA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAKA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;;;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAFA;AADA;AAYA;AACA;AAbA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AAPA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAWA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AAPA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAFA;AAHA;AAQA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAnBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AAzGA;AA2GA;AACA;AA7fA;AACA;AA6fA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AACA;AAGA;AAMA;AACA;AACA;;;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAPA;AASA;AACA;;;;;;;;;;;;;;ACjnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAMA;AAEA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAbA;AAAA;AAgBA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AAGA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAFA;AAGA;AAAA;AACA;AAJA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAOA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAMA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAEA;AAAA;AAJA;AAMA;AAEA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAMA;AACA;AAPA;AAWA;AACA;AACA;AAtBA;AAwBA;AACA;AACA;AA/KA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAuBA;;;;;AASA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AAHA;AAIA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAVA;AAgBA;;;;AAjFA;AACA;AAAA;AACA;AAkFA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAMA;AAnBA;AACA;AAqBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC9LA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAIA;AAEA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAeA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAFA;AAKA;AAAA;AAAA;AACA;AAEA;AAFA;AAIA;AAAA;AAAA;AAAA;AACA;AACA;AAdA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;AAGA;;;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;;;;AAhBA;AACA;AAAA;AACA;AAiBA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AAaA;;;;AAIA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAIA;AACA;AACA;AACA;AACA;AALA;AAYA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AALA;AAeA;AACA;AACA;AACA;AACA;AACA;AANA;AAaA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAaA;AACA;AAtGA;AAuGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAZA;;;;;;;;;;;;;;ACvIA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AClDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;;;AAKA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAlBA;AACA;AAkBA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACpDA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AAEA;AAkFA;AACA;AACA;AADA;AAEA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAoBA;;;AAGA;AACA;AAAA;AASA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACrIA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;;;;;;;;;;;;;ACRA;;;;;;AAMA;AACA;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAEA;AAEA;AAEA;AAEA;AACA;AAyFA;AAAA;AAAA;AACA;AACA;;;AA1FA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAEA;AAAA;AACA;AAAA;AAMA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AAnGA;;;;;;;;;;;;;;AC3CA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAEA;;;AACA;AACA;AACA;AAIA;AACA;AAOA;AACA;AADA;AAIA;AACA;AAOA;AAOA;AAAA;AACA;AAMA;AAOA;AAAA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;;;;;;;;;;;;;;ACjHA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAQA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAFA;AASA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAWA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AARA;AAUA;AACA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AASA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAJA;AATA;AAgBA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAGA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAeA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AACA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAkBA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AAQA;AAAA;AAGA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AAQA;AAAA;AApBA;AAwBA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAAA;AADA;AAWA;AACA;AACA;AAFA;AAZA;AA5BA;AA8CA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;;;AADA;AACA;AACA;AACA;AAHA;AAIA;AAEA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACzGA;;;;;;AAMA;AACA;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AC7CA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAcA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AACA;AASA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAHA;AAKA;;;;;;;;;;;;;;ACzHA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAAA;AACA;AAGA;;;AAGA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACtCA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AACA;;;AADA;AACA;AACA;AAFA;AAGA;AAJA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAwBA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAaA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;ACtCA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAQA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AArCA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AArCA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AArCA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AADA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAMA;;;;;;AAMA;AACA;AACA;AADA;AACA;AAEA;AACA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAIA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AApDA;;;;;;;;;;;;;;AChDA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAGA;AACA;AAAA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AACA;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AACA;AADA;;;;;;;;;;;;;;ACjCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAXA;AACA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAXA;AACA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACxGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAMA;AACA;AACA;AADA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AApBA;AAqBA;AACA;AAAA;AAKA;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AA3BA;AA4BA;AACA;AAAA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAEA;AAFA;AAAA;AACA;AAKA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AAAA;AAEA;AASA;AACA;AACA;AAGA;AACA;AAAA;AAYA;AAZA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAGA;AACA;AACA;AADA;AACA;AACA;AAnFA;AA6FA;AACA;AACA;AACA;AAAA;AAGA;AAAA;AAMA;AAzGA;AACA;AA2FA;AAAA;AACA;AADA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AACA;AACA;AAEA;AACA;AAHA;AAKA;AACA;AAvIA;AACA;AAuIA;;;AASA;AAMA;AAAA;AAAA;AACA;AACA;AAOA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAlCA;AAAA;AAAA;AACA;AACA;AAoCA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAEA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AARA;AAiBA;;;;;;;;;;;;;;AC9SA;;;;;;AAMA;AACA;;;;;;;;;AAGA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAuBA;;;;;;;;;;;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAaA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AALA;AAWA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAFA;AAIA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AAmBA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAFA;AAMA;AAEA;AArEA;AAwEA;;;;AAtHA;AACA;AAAA;AACA;AAuHA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAZA;AACA;AAcA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACpOA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAOA;AACA;AAEA;AAEA;AACA;AACA;AADA;AAgCA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAUA;AAEA;AAGA;AAGA;AACA;AACA;AAIA;AAEA;AAFA;AAKA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA/BA;AAkCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAJA;AAOA;AAAA;AAAA;AAAA;AAAA;AAtDA;AAyDA;AACA;AA/JA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAAA;AAKA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AACA;AAHA;AAOA;AACA;AAEA;AAEA;AANA;AAUA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AADA;AAFA;AASA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAPA;AAYA;AACA;AA7EA;AACA;AA6EA;AAAA;AACA;AAAA;AACA;AAIA;;;;;;;;;;;;;;ACjHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAJA;AAKA;AACA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAIA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AANA;AASA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AArDA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AASA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAEA;AAFA;AACA;AAIA;;;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AASA;AAMA;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AAcA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AASA;;;AACA;AACA;AAAA;AACA;AAEA;AASA;AAXA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AANA;AAQA;AAEA;AACA;AACA;AADA;AASA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAMA;AAEA;AACA;AAEA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AAPA;AADA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AANA;AAgBA;AAAA;AAEA;AACA;AACA;AAHA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAMA;AARA;AAcA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAOA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AARA;AAUA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAHA;AAUA;AAIA;AACA;AAAA;AAAA;AAAA;AAFA;AAKA;AACA;AACA;AACA;AAJA;AAWA;AACA;AA9IA;AACA;AA8IA;AACA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AAIA;;;;;;;;;;;;;;ACnUA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AAEA;AACA;AAAA;AAuDA;AACA;AACA;AADA;AACA;AACA;AAFA;AA0BA;AACA;AAAA;AAEA;AACA;AAFA;AAKA;AADA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAIA;AACA;AANA;AAOA;AACA;AAAA;AACA;AAKA;AACA;AAPA;;;;;;;;;;;;;;ACtIA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAWA;AACA;;;AAXA;AACA;AACA;AACA;AAFA;AAIA;;;AAEA;AACA;AACA;;;;;;AAnCA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;;;AAAA;AACA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;AAEA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;;;;;;;;;;;AAWA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAQA;AACA;AACA;AAVA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AAKA;AACA;AATA;AAUA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AACA;AACA;AAFA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAhBA;AAmBA;AACA;AACA;AACA;;;;;;AAMA;AACA;AACA;AACA;AAVA;AAFA;AAgBA;;;AAGA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAJA;AAFA;AASA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAzBA;AAFA;AAqCA;AACA;AACA;AACA;AAHA;AAjDA;AAFA;AA2DA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AADA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AA3CA;AAFA;AAiDA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA/LA;;;;;;;;;;;;;;AC9HA;;;;;;AAMA;AACA;;;;;;;;;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAcA;AACA;AAGA;AACA;AAkHA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AALA;AAfA;AAFA;AACA;AADA;AAgCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AAAA;AAAA;AAxBA;AAAA;AACA;AADA;AA2BA;AACA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AADA;AAFA;AACA;AADA;;;;;;;;;;;;;;ACvNA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAeA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAjBA;AAkBA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAGA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAZA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AAIA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAzCA;AAyCA;AACA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACpNA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAmCA;;;;AAIA;AACA;AAAA;AAEA;;;;AAIA;AACA;AAAA;AAkBA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AAAA;AAUA;AAAA;AAEA;AACA;AADA;AAGA;AACA;AACA;AACA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AA7CA;AACA;AA6CA;AAAA;AACA;AAAA;AACA;AAOA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AADA;AAKA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAQA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAjDA;AAkDA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArDA;;;;;;;;;;;;;;ACjQA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;AAQA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAHA;AAAA;AADA;AAMA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAFA;AAAA;AADA;AAKA;AACA;AACA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAFA;AAAA;AADA;AAKA;AACA;AACA;AAAA;AAEA;AAEA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAJA;AAAA;AADA;AAjCA;AAyCA;AACA;AAAA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AAxBA;AA8BA;AAEA;AACA;AAAA;AAMA;AACA;AACA;AARA;;;;;;;;;;;;;;AC1FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAaA;AACA;AACA;AADA;AAKA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AATA;AAUA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAAA;AACA;AADA;AAMA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAxBA;AAAA;AAAA;AAAA;AAAA;AACA;AAyBA;;;AAAA;AACA;AACA;AAFA;AAGA;AACA;;;;;;;;;;;;;;AC5EA;;;;;;AAMA;AACA;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAQA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AANA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AACA;AAWA;AAMA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAWA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAKA;AACA;AACA;AACA;AAEA;AAAA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAnEA;;;;;;;;;;;;;;AClHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AAQA;AAAA;AAAA;AAAA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAhDA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAUA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAUA;AAEA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AA7BA;AACA;AA6BA;AAWA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AANA;AAQA;AAEA;AACA;AACA;AADA;AAYA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AANA;AADA;AAAA;AAAA;AAAA;AACA;AAUA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAYA;AACA;AACA;AACA;AAHA;AAKA;AACA;AArDA;AACA;AAqDA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AACA;AACA;AAQA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAgBA;AAKA;AAWA;AACA;;;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AAEA;AAFA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAMA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAkBA;AAlBA;AAoBA;AACA;AACA;AACA;AACA;AAgBA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AALA;AAMA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAAA;AAOA;AAhBA;AAmBA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAYA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;;;AAiBA;AACA;AAiBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AAAA;AAKA;AACA;;;AAaA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AACA;AALA;AAQA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAzEA;;;;;;;;;;;;;;AC/dA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAQA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAKA;AACA;AAEA;;AAEA;AACA;AAAA;AAOA;AAEA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AADA;AACA;AACA;AAxBA;AACA;AAwBA;AACA;AACA;AAAA;AAAA;AADA;AAWA;AACA;AACA;AADA;AAOA;AAGA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAfA;AAgBA;;;AAGA;AACA;AAAA;AAMA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AArBA;;;;;;;;;;;;;;ACzGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AAAA;AAcA;AACA;AACA;AADA;AAaA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AADA;AAEA;AAAA;AAFA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAbA;AAgBA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AA7DA;AACA;AA6DA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA4BA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAOA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAAA;AACA;AACA;AAGA;AAGA;AAAA;AAAA;AAHA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AACA;;;;;;;;;;;;;;ACjNA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAMA;AACA;AACA;AAYA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AALA;AACA;AADA;AAOA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AAAA;AACA;AACA;AACA;AAjCA;AAkCA;AACA;AAAA;AAOA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AACA;AAUA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AACA;AA7BA;AA+BA;AACA;AA9CA;AACA;AA8CA;;;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAXA;AAaA;;;;;;;;;;;;;;ACpJA;;;;;;AAMA;AACA;;;;;;;;AAEA;AACA;AAAA;AACA;AAGA;AACA;AAOA;AACA;AACA;AACA;;;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAQA;AACA;AAWA;AACA;AACA;AAtBA;;;;;;;;;;;;;;ACrCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAMA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAUA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAWA;AACA;AAAA;AACA;AAaA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAAA;AADA;AACA;AADA;AACA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;;;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAxCA;AAyCA;AACA;AAAA;AAKA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAMA;AACA;AAAA;AAAA;AACA;AACA;AA1BA;AACA;AAkCA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAUA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAMA;AACA;AACA;AACA;AAJA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAMA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAhDA;AAkDA;AAEA;AACA;AACA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AACA;AAKA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAWA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAGA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AAOA;AAAA;AADA;AAKA;AAAA;AAGA;AACA;AAcA;AACA;AAEA;AAEA;AACA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAaA;AACA;AAFA;AAOA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA5BA;AA8BA;AACA;AAjOA;AACA;AAiOA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAeA;;;;;;;;;;;;;;AC3hBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAEA;AACA;AAEA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAtFA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAUA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAEA;AAEA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAUA;AAEA;AAEA;AACA;AACA;AAAA;AAEA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAGA;AAAA;AAAA;AAGA;AAAA;AAAA;AAGA;AAAA;AAAA;AAEA;AACA;AACA;AAjFA;;;;;;;;;;;;;;ACtQA;;;;;;AAMA;AACA;;;;;;;;;;;;;AAGA;AAEA;AACA;AAAA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAlDA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AACA;AAAA;AACA;AAqCA;;;;;AAUA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAKA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAZA;AAoBA;;;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAKA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;;AA1HA;AACA;AAAA;AACA;AA2HA;AAAA;AACA;AAAA;AADA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAdA;AACA;AAgBA;;;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACpPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAKA;AACA;AAmBA;AAQA;;;;;;;;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAKA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAJA;AAKA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAXA;AAYA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AACA;AAKA;AACA;AACA;AACA;AAJA;AAOA;AAEA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAIA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAdA;AAqBA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AApBA;AAiCA;;;AAEA;AACA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAKA;AACA;AAFA;AALA;AAcA;;;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAIA;;;;AA3GA;AACA;AADA;AACA;AA6GA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAGA;AACA;AACA;AACA;AACA;AAFA;AAIA;AATA;AAVA;AAwBA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AAVA;;;;;;;;;;;;;;AC5RA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAEA;;;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAEA;;;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAEA;AAAA;AACA;AAAA;AAKA;AACA;AAVA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAqDA;AAEA;AACA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAxBA;AA4BA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACxHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AADA;AASA;AAAA;AACA;AATA;AACA;AAgHA;AAAA;AAAA;AACA;AAzGA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AAhHA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAQA;AACA;AAEA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;;;AAEA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AAIA;AAQA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AALA;AAAA;AACA;AADA;AAMA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AARA;AAcA;AAfA;AAiBA;AACA;AACA;AAAA;AACA;AACA;AArCA;AAAA;AAAA;AAAA;AAAA;AACA;AAqCA;AACA;;;;;;;;;;;;;;AC3IA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAMA;AACA;AACA;AAEA;AAMA;AAOA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAMA;AAMA;AAMA;AAMA;AAMA;AAOA;AAOA;AAMA;AAOA;AAQA;AAEA;AAEA;AAKA;AAMA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAfA;AAuBA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AADA;AAIA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AALA;;;;;;;;;;;;;;AC/NA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;AAGA;AACA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AACA;AAGA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAjBA;AAmBA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAGA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AAAA;AACA;AADA;AAEA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AAEA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AADA;AAFA;AADA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAqBA;;AAEA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAhBA;AAkBA;AAEA;AACA;AACA;AADA;;;AAGA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAKA;;;;;;;;;;;;;;AC5EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;AAIA;AACA;AACA;AADA;AAEA;AACA;AACA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAKA;AACA;AAAA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAGA;AAGA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAWA;;;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AANA;AAQA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AAAA;AAMA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAFA;AALA;AAYA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AADA;AAAA;AAAA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACnDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AACA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAOA;AAAA;AAAA;AACA;AACA;;;AATA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AAjCA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAKA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AAlBA;AAmBA;AACA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAXA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAMA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AArBA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAQA;AACA;AAAA;AAMA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAZA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAoBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AANA;AAAA;AACA;AADA;AASA;;;;;;;;;;;;;;;;;;;;AAoBA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AAEA;AACA;AACA;AANA;AAOA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AANA;AAOA;AACA;AAAA;AAOA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAdA;AAeA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AATA;AAUA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACrMA;;;;;;AAMA;AACA;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AACA;AAKA;AACA;AACA;AADA;AAEA;AAEA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAWA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AANA;AAoCA;AACA;AAAA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AACA;AADA;AAIA;AACA;AACA;AAAA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAzBA;AA4BA;;;AAGA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;;;;;;;;;;;;;;AC3LA;;;;;;AAMA;AACA;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AAAA;AAAA;AAAA;AACA;AACA;AAnBA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;AAsBA;AACA;AAAA;;;AACA;AAIA;AACA;AANA;AAOA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAbA;AAcA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;AAIA;AACA;AAAA;AAMA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AAvBA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AAAA;AAcA;AAEA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AA/BA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AAaA;AACA;AACA;AADA;AAeA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAmBA;AAAA;AAAA;AAAA;AAAA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAxDA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAKA;AACA;AAAA;AAKA;AACA;AAAA;AAWA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAIA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AA/DA;AAAA;AAAA;AAAA;AAAA;AAgEA;AACA;AA5EA;AA6EA;AACA;AAAA;AAWA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAMA;AAQA;AACA;AAcA;AACA;AAAA;AA5DA;AACA;AADA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AA4DA;AA7DA;AAAA;AAAA;AAAA;AAAA;AA8DA;AACA;AA1EA;;;;;;;;;;;;;;ACpGA;;;;;;AAMA;AACA;;;;;;;AAMA;AACA;AAAA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA1BA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;AAGA;AACA;AAIA;AACA;AAAA;AAcA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AA7CA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAMA;AACA;AACA;AACA;AAGA;AACA;AAQA;AASA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AARA;AAAA;AACA;AADA;AAQA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AA5BA;AAAA;AAAA;AAAA;AAAA;AACA;AA4BA;AACA;AACA;AACA;AACA;AACA;AAFA;AAAA;AACA;AADA;AAEA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AATA;AAAA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AAEA;AACA;AACA;AADA;AAQA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAlBA;AACA;AAkBA;AAOA;AAAA;AACA;AADA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAQA;AACA;AACA;AAnBA;AAAA;AAAA;AAAA;AAAA;AAoBA;AAEA;AACA;AACA;AADA;AACA;AA+BA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;AAEA;AAEA;AAEA;AACA;AAMA;AAcA;AACA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AACA;AACA;AACA;AAUA;AACA;AA1IA;AACA;AAFA;;;;;;;;;;;;;;ACvIA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAmBA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAiBA;AACA;AAAA;AACA;AAAA;AACA;AAYA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AACA;AAuBA;AAAA;AACA;AAEA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAdA;AAAA;AACA;AAgBA;AAGA;AAKA;AACA;AAFA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAMA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAiBA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAoBA;AAOA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAEA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAUA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAmBA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAOA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAqBA;AACA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAIA;;;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AA9BA;;;;;;;;;;;;;;ACpfA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;AADA;AACA;AAAA;AACA;AAiBA;AAEA;AACA;AAFA;AAOA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAwBA;;;;;AAAA;AAAA;AACA;AADA;AACA;AADA;AACA;AAGA;AACA;AACA;;AACA;;;AAGA;AACA;AACA;AADA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AARA;AAaA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AA/EA;AA+EA;AACA;;;AA5DA;;;AACA;AAAA;AAAA;AACA;;;;AAtBA;AACA;AAAA;AACA;AA+EA;;;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;AACA;AACA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AACA;AADA;;;;;;;;;;;;;;AC9JA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAdA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AACA;AADA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;;;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AANA;AAOA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AADA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;;;AACA;AAIA;AACA;AANA;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;;;;;AAeA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAiEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAiBA;AACA;AAAA;AAIA;AACA;AAAA;AAEA;AAFA;AAKA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAJA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACrHA;;;;;;AAMA;AACA;;;;;;;AAMA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAgBA;AAAA;AAAA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AA3DA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAAA;AACA;AADA;AAGA;AAAA;AACA;AACA;AALA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;AACA;AAAA;AAKA;AAAA;AAKA;AACA;AACA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAVA;AAgBA;AAIA;AACA;AAiBA;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAJA;AASA;;;;AAzDA;AACA;AAAA;AACA;AA0DA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AAPA;AACA;AASA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACtRA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAQA;;;AAGA;AACA;AACA;AADA;AAEA;AACA;AAFA;AACA;AAWA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACvCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AA8FA;AAAA;AAAA;AACA;AACA;;;AA/FA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;;;AAEA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAFA;AAIA;;;;;;AA9FA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AAIA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAKA;AAAA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAQA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AAEA;AACA;AAHA;AAjBA;AAwBA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAMA;AAAA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAEA;AAQA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AAEA;AACA;AAHA;AAjBA;AAuBA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AADA;AASA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAOA;AACA;AAxCA;AACA;AAwCA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;AAKA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AAFA;AAlBA;AAuBA;AACA;AA/BA;AACA;AA+BA;AAKA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AAFA;AAlBA;AAuBA;AAEA;;AAEA;AACA;AACA;AADA;AAOA;AACA;AACA;AATA;;;;;;;;;;;;;;ACnYA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AAIA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AANA;AAOA;AACA;AAAA;AAQA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;;;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AAIA;AACA;AAFA;AAKA;AACA;AAFA;AACA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AAGA;AACA;AAFA;AAKA;AACA;AARA;AAWA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAjIA;AACA;AAiIA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAOA;AACA;AACA;AATA;;;;;;;;;;;;;;AC5PA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAMA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAKA;AAAA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAXA;AAaA;AACA;AA3BA;AAAA;AAAA;AAAA;AAAA;AACA;AA4BA;AACA;AACA;AApCA;AACA;AAoCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AAxBA;AA0BA;;;;;;;;;;;;;;ACxFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAOA;AAEA;AACA;AACA;AADA;AAOA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AAEA;AACA;AAOA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AA1CA;AA2CA;AACA;AAAA;AAOA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AAEA;AACA;AAMA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AArCA;AACA;AAqCA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACjHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAQA;AACA;AACA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAVA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAOA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AAjCA;AAkCA;AACA;AAAA;AAOA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAfA;AACA;AAiBA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AArCA;AAsCA;AACA;AAAA;AAOA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAQA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAhDA;;;;;;;;;;;;;;AClHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAKA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;AAOA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AACA;AAKA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAvCA;;;;;;;;;;;;;;AC5DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAFA;AAOA;AACA;AAWA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAXA;AAYA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;;AACA;AAeA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACzCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAYA;AACA;AACA;AADA;AAAA;AACA;AAAA;AADA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AADA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AATA;AACA;AAiEA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AACA;AACA;AAHA;AACA;AALA;AACA;AADA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AACA;AAYA;AAAA;AAKA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAXA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AACA;AAbA;AAEA;AAFA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AALA;AACA;AAuCA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAHA;AAKA;AALA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AANA;AAYA;AACA;AACA;AACA;AACA;AAJA;AACA;AAbA;AAGA;AAHA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AA1BA;AA4BA;AACA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AANA;AAYA;AACA;AACA;AACA;AACA;AAJA;AACA;AAbA;AAGA;AAHA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AA1BA;AA4BA;AAEA;AACA;AACA;AAJA;AAKA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AASA;AAEA;AAAA;AAAA;AAAA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAbA;AAAA;AAAA;AAAA;AACA;AADA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AACA;AAfA;AAEA;AAFA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0BA;AACA;AAhCA;AAkCA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AANA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAOA;AACA;AARA;AAAA;AAAA;AAAA;AACA;AAQA;AACA;AAVA;AAYA;AACA;AACA;AACA;AACA;AAJA;AACA;AAbA;AAEA;AAFA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBA;AACA;AA5BA;AA8BA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAPA;AAYA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AA1BA;AA4BA;AACA;AAAA;AAAA;AAAA;AAAA;AA/BA;AAiCA;AAEA;AAFA;AAIA;AA1CA;AA4CA;AAEA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AANA;AAQA;AAAA;AAAA;AAdA;AAgBA;AAEA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AACA;AAhBA;AAiBA;AAEA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AASA;AAEA;AACA;AACA;AACA;AALA;AAOA;AAEA;AACA;AACA;AACA;AALA;AAOA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAKA;AAEA;AACA;AAHA;AAMA;AAqCA;AAqHA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAvjBA;;;;;;;;;;;;;;AChKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AACA;AAFA;AAeA;AACA;AAAA;AASA;AACA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAOA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAAA;AAJA;AACA;AAMA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAAA;AALA;AAYA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AATA;AAYA;AACA;AA7FA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;;;AAEA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AATA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AAhBA;AAAA;AACA;AAoBA;AACA;AACA;AACA;AAHA;AAAA;AACA;AADA;AAGA;AAAA;AACA;AAEA;AANA;AAAA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AAxCA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAGA;AAEA;AACA;AACA;AADA;AAEA;AACA;AAAA;AAGA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AAxBA;AAyBA;AACA;AAAA;AAKA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AA7BA;AA8BA;AACA;AAAA;AAYA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAjFA;AAkFA;AACA;AAAA;AAKA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAzCA;;;;;;;;;;;;;;AClKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AATA;AAWA;AACA;AAtFA;AACA;AAsFA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;;;AAGA;AAGA;AACA;AACA;AATA;AAUA;;;;;;;;AAQA;AACA;AAAA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAtBA;;;;;;;;;;;;;;AC1JA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAQA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAOA;AACA;AACA;AACA;AAtBA;AACA;AAsBA;;;AAOA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAOA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AA9BA;AA+BA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACnLA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAgBA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AACA;AADA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AASA;AACA;;;AACA;AACA;AAEA;AAEA;;;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAQA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAEA;AAEA;AACA;AAKA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AAlBA;AACA;AAmBA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AAlBA;AAoBA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAGA;AAAA;AACA;AACA;AAIA;AACA;AAEA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAHA;AAKA;AAEA;AACA;AAlIA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAQA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;AAWA;AACA;AAAA;AAYA;AAAA;AACA;AADA;AACA;;;AAHA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAEA;;AAEA;AACA;AACA;;;AADA;AACA;AACA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;;;;;;AA3GA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAeA;AACA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAEA;AAEA;AACA;AAAA;AACA;AACA;;;AAEA;AACA;AAIA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAtBA;AADA;AACA;AAwBA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AAlEA;;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AASA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AASA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AA3CA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AAEA;AACA;AACA;AADA;AASA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AADA;AAKA;AACA;AA9BA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AAEA;AACA;AACA;AADA;AASA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AACA;AAAA;AAAA;AACA;AAFA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AADA;AAGA;AACA;AA9BA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAEA;AACA;AACA;AADA;AASA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAtDA;AACA;AAsDA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAJA;AAQA;AAUA;AACA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AALA;AASA;AAUA;;;;;;;;;;;;;;AChJA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAIA;AA6BA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AATA;;;;;;;;;;;;;;AC7CA;;;;;;AAMA;AACA;;;;;;;;AAEA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AAKA;AAEA;AACA;AAHA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AARA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAnCA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AAYA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAgBA;AACA;AAvDA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAKA;AAEA;AACA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAMA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAPA;AAQA;AAAA;AAAA;AAdA;AAiBA;AACA;AA3BA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAIA;AAEA;AACA;AACA;AADA;AAQA;;;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAnBA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AAcA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAIA;AAEA;AACA;AACA;AADA;AAQA;AACA;AAAA;AAAA;AACA;;;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AAAA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAxCA;AACA;AAwCA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AALA;AASA;AAUA;AAEA;;;AAGA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACxGA;;;;;;AAMA;AACA;;;;;;;AAIA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AALA;AADA;AAUA;AACA;AAZA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AAEA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAgBA;AACA;AACA;AACA;AAvDA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAQA;AACA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AASA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AApDA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAQA;;;;AAIA;AACA;AACA;AADA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAFA;AAIA;AACA;AACA;AACA;AAdA;AAeA;;;;AAIA;AACA;AAAA;AAQA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAFA;AAIA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAxBA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AATA;AAAA;AACA;AADA;AAUA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAjBA;AAAA;AAAA;AAAA;AAAA;AACA;AAiBA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAIA;AACA;AACA;AADA;AAUA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArBA;AAsBA;AACA;AAAA;AAUA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAfA;AACA;AAeA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACjEA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1BA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAaA;AACA;AACA;AADA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAhCA;AAiCA;AACA;AACA;AAOA;AACA;AAAA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAnGA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAMA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAGA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AAIA;AACA;AACA;AACA;AACA;AACA;AANA;AAHA;AAeA;AAAA;AAAA;AAcA;AAAA;AAAA;AAGA;AAAA;AAAA;AAIA;AAAA;AAAA;AAGA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AADA;AADA;AAcA;AAAA;AAAA;AAcA;AAAA;AAGA;AAAA;AAAA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAtBA;AAwBA;AACA;AACA;AACA;AACA;AACA;AAnJA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AAOA;AACA;AAEA;AAAA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AAlBA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAEA;;;;;;;AAOA;AACA;AACA;AADA;AASA;AACA;AAEA;AAAA;AAEA;AACA;AACA;AAFA;AAKA;AAEA;AACA;AADA;AAAA;AAEA;AACA;AACA;AAFA;AAOA;AAAA;AAAA;AAAA;AACA;AACA;AAhCA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AAGA;;;;;;;AAOA;AACA;AACA;AADA;AAKA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAfA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAGA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAKA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAbA;AAcA;AACA;AAAA;AAMA;AAAA;AAAA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAjBA;AAkBA;AACA;AAAA;AAKA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AArBA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAZA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAWA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AA9CA;AACA;AA8CA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAOA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAMA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAKA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAzEA;AA2EA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAGA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;;;;;;;;;;;;;;ACpOA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAsCA;;;;;AASA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AAKA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAXA;AAkBA;;;;AAhGA;AACA;AAAA;AACA;AAiGA;AAAA;AAGA;AADA;AAFA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAzCA;AACA;AA2CA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAtBA;AAwBA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACxRA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAmBA;;;AAGA;AACA;AAAA;AACA;AAAA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AAMA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAtBA;AACA;AAFA;;;;;;;;;;;;;;ACrCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAWA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAHA;AAKA;AAEA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAVA;AAeA;AACA;AAxEA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AA2BA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAcA;AACA;AACA;AACA;AAAA;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAWA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAJA;AAFA;AACA;AAUA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AChOA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAKA;AACA;AAgBA;AACA;AAMA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAFA;AAOA;AACA;AACA;AADA;AAFA;AAOA;AACA;AACA;AACA;AAFA;AAFA;AAhBA;AAyBA;AAEA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAbA;AAeA;AAAA;AAAA;AAIA;AAAA;AAAA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAXA;AAaA;AAAA;AAAA;AAIA;AAAA;AAAA;AAMA;AACA;AA1HA;AACA;AA0HA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACxLA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAIA;AAAA;AACA;AAAA;AAIA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AARA;AAUA;AACA;AAhDA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAWA;AACA;AAGA;AACA;AACA;;;;;;;;;;;;;AAGA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AAAA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;;;;AA9BA;AACA;AAAA;AACA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACzGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAQA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAAA;AAAA;AAIA;;;;AA5BA;AACA;AAAA;AACA;AA6BA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC3FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAYA;AACA;AAGA;AACA;AACA;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAWA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;;;;AAhCA;AACA;AAAA;AACA;AAiCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC/GA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAaA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AACA;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AAGA;;;;AA9DA;AACA;AAAA;AACA;AA+DA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAbA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC1JA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAPA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AASA;AACA;AAAA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AASA;AACA;AAIA;AAGA;AACA;AACA;AADA;AAmBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAbA;AAeA;AACA;AACA;AAFA;AAIA;AACA;AA9EA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AAeA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AAEA;AAKA;AACA;AAOA;AAEA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAXA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAvHA;AAwHA;;;AAGA;AACA;AAAA;AAYA;AAAA;AAAA;AAAA;AAEA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AAEA;;;AAGA;AACA;AACA;AADA;AAKA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAlBA;;;;;;;;;;;;;;ACzNA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAOA;AAGA;AACA;AACA;AADA;AAiBA;AAAA;AASA;AATA;AAcA;AAdA;AAAA;AACA;AAiBA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AAIA;AACA;AA9CA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAIA;AAGA;AACA;AACA;AADA;AAkBA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAeA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAXA;AAaA;AACA;AACA;AAFA;AAIA;AACA;AAjEA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AAGA;AACA;AACA;AADA;;;AAIA;AAEA;AAOA;AAGA;AAEA;AAFA;AADA;AASA;AACA;AAzBA;AA0BA;AACA;AAAA;;;AAIA;AAEA;AAOA;AAGA;AAEA;AAFA;AADA;AASA;AACA;AAzBA;;;;;;;;;;;;;;ACvCA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;;;AAKA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AANA;AAQA;AACA;AAhBA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAMA;AAEA;AACA;AACA;AADA;AAkBA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAnBA;AAqBA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAlGA;AAmGA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAnBA;AAoBA;;;;;;;AAOA;AACA;AAAA;AAIA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AADA;AACA;AACA;AAlBA;AAmBA;;;;;;;;;AASA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAIA;AACA;AAFA;AAHA;AAOA;AAAA;AAAA;AARA;AAAA;AACA;AASA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA7BA;AACA;AA6BA;;;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAIA;;;;;;;;;;;;;;ACnPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AAAA;AAUA;;;;AAIA;AACA;AACA;AADA;AAAA;AACA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AATA;AAUA;;;;AAIA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;;;AAMA;AACA;AAAA;AAKA;AACA;AAEA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAvCA;AAwCA;AACA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAjBA;AAkBA;AACA;AAAA;AAMA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAMA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AA3BA;AACA;AA2BA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAUA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AADA;AAMA;AACA;AAVA;AACA;AAUA;AAAA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC5MA;;;;;;AAMA;AACA;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC5BA;;;;;;AAMA;AACA;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AALA;AASA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AANA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AALA;AASA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAJA;AAQA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AALA;AASA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACrCA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AALA;AASA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAiBA;AAAA;AACA;AAsGA;AAAA;AAAA;AACA;AAvGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAGA;AAAA;AAGA;AAAA;AACA;AAAA;AAAA;AAKA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;;;;AAtHA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AASA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAEA;;;;;;;;;;;;;;AC5DA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AAAA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAWA;AAWA;AACA;AAAA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAGA;AAAA;AAEA;AACA;AAEA;AACA;AANA;AASA;AAEA;AACA;AACA;AADA;AAAA;AADA;AAcA;AACA;AAAA;AAEA;AAAA;;;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AACA;AAvBA;AA0BA;AACA;AAAA;AAAA;;;AAUA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AA7BA;AAAA;AACA;AADA;AAgCA;AACA;AAAA;AAEA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAFA;AAFA;;;;;;;;;;;;;;AC/IA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAoBA;AAAA;AACA;AAWA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AADA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AADA;AAIA;AACA;AACA;AADA;AAGA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAAA;AAWA;;;;;;;;;;;;;;ACzDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAaA;AAAA;AAAA;AAcA;;;;;;;;;;;;;;AChDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAMA;;;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AACA;AAMA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAaA;AAYA;AAEA;AACA;AAMA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAMA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;;;AAMA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAdA;AAgBA;AACA;AAxCA;AACA;AAwCA;AACA;AACA;AACA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACjKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAqBA;AACA;AACA;AADA;AAKA;AACA;AAAA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAGA;AAHA;AACA;AAMA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;;;AACA;;;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AAFA;AAIA;AANA;AAQA;AACA;AACA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AA5DA;;;;;;;;;;;;;;AClDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAJA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AASA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAPA;AASA;AAaA;AACA;AAAA;AAGA;AAAA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAhCA;AAiCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AANA;AAOA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAbA;AAcA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAbA;AAcA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AACA;AAQA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC1JA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAeA;AAUA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAGA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAKA;AACA;AAFA;AAQA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACxHA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAsBA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;ACtEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;;;AAGA;AACA;AACA;AADA;AAUA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAEA;AAOA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAIA;AAOA;AACA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AASA;AACA;AACA;AACA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAJA;AATA;AANA;AAuBA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AARA;AAAA;AAUA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACvSA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAYA;AAOA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AASA;;;;;;;;;;;;;;ACjFA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AAEA;AAFA;AAAA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AACA;;;AADA;AACA;AAIA;AALA;AAMA;AAPA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAYA;AAWA;AAEA;AACA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACxFA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAIA;AAGA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAQA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAIA;;;;;;AAMA;AACA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAIA;;;;;;;;;;;;;;ACzFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;ACtCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAGA;AACA;AAMA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAIA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAgBA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAIA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAOA;AAOA;;;;;;;;;;;;;;AChEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AAIA;AALA;AACA;AAaA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAiBA;AAcA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AANA;AAQA;AAEA;AACA;AACA;AADA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAFA;AAFA;AAOA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAEA;AAAA;AAAA;AAGA;AACA;AAAA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;AC/OA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;AAIA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AAWA;AAMA;AAAA;AAAA;AAAA;AAAA;AAEA;AAKA;AAMA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AC5DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AAGA;AACA;AACA;AADA;AAIA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AALA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1CA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA1EA;AACA;AA0EA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAMA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;;;;;;;;;;;;;;AC9NA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAKA;;;;;;AAMA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAcA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAvCA;AACA;AAuCA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC/HA;;;;;;AAMA;AACA;;;;;;;;AAGA;AACA;AAGA;AACA;AAEA;AACA;AAAA;AACA;AAOA;;;AACA;AAKA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AACA;AAIA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACxCA;;;;;;AAMA;AACA;;;;;;;;;;;;AAGA;AACA;AAGA;AACA;AAEA;AACA;AAAA;AACA;AAQA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAGA;AACA;;;AAAA;AACA;AACA;AAEA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAFA;AACA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AAOA;AAAA;AACA;AAGA;AAIA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AADA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAMA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AA1BA;;;;;;;;;;;;;;ACnFA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAMA;AACA;AACA;AAAA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAiBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AADA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AA5BA;AACA;AA4BA;AAYA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AATA;AAcA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAYA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAcA;AAEA;AACA;AACA;AADA;AACA;AAYA;AAOA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AAGA;AAAA;AAWA;AACA;AACA;AAjBA;AAkBA;AACA;AACA;AAAA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AAXA;AACA;AAYA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AADA;AAAA;AACA;AACA;AACA;AAMA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AAFA;AAIA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AACA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AAGA;AACA;;;;;;;;;;;;;;ACxWA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAGA;;;;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AATA;AAUA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AANA;AAAA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AATA;AAUA;;;AAGA;AACA;AAAA;AACA;AAEA;AACA;AAHA;AACA;AAFA;;;;;;;;;;;;;;AC/DA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAQA;;;;;AAKA;AACA;AAAA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAbA;AAeA;AACA;AA3BA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAEA;AAGA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAIA;AACA;AAAA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAMA;AAiBA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAvCA;AAwCA;;;AAGA;AACA;AAAA;AAMA;AAAA;AACA;;;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AAGA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AAhDA;AACA;AAgDA;AAIA;;;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAUA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAMA;;;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AACA;AAFA;AAKA;AAkBA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAlEA;AAmEA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AADA;AACA;AADA;AACA;AAEA;AAJA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AARA;AASA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AANA;AAQA;AACA;AAxBA;AACA;AAwBA;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AAEA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAQA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AAHA;AAQA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AADA;AAIA;AAeA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AAWA;AACA;AAFA;AAOA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAWA;AACA;AAFA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AAWA;AACA;AAFA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAPA;AACA;AAOA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;;;;;;;;;;;;;;AC9gBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AADA;AAKA;AACA;AACA;AACA;AAfA;AAiBA;AACA;AAtCA;AAuCA;AACA;AAAA;AAGA;AACA;;;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AAbA;;;;;;;;;;;;;;AC/EA;;;;;;AAMA;AACA;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAOA;AAoDA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAKA;AAAA;AAAA;AAEA;AAQA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAxBA;AAyBA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAPA;AACA;AAOA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAFA;AAQA;AACA;AACA;AAFA;AAIA;AAAA;AAAA;AAAA;AALA;AAOA;AACA;AACA;AAMA;AACA;AAKA;AAKA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AASA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAVA;AAYA;AACA;AAlCA;AAmCA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AAKA;AACA;AACA;AACA;AARA;AASA;AACA;AAAA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAIA;AACA;AAVA;AALA;AAkBA;AACA;AArCA;AAsCA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAmBA;AACA;AAAA;AAMA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AA/CA;;;;;;;;;;;;;;ACjUA;;;;;;AAMA;AACA;;;;;;;AAGA;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAbA;AAcA;;;;;AAKA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAdA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;AAMA;AAiBA;;;;AAIA;AACA;AACA;AAFA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAFA;AASA;AACA;AAtBA;;;;;;;;;;;;;;AClCA;AACA;;;;;;;AAmCA;;AAEA;AACA;AAAA;;;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;;;AAGA;AACA;AAAA;AAEA;;;AAGA;AACA;AAAA;;;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnCA;AAoCA;;;;AAIA;AACA;AAAA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AApCA;AAqCA;;;;;;;;;;;;;;ACzMA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AAEA;AAFA;AAIA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AARA;AAYA;AAEA;AAEA;AAFA;AAIA;AACA;AACA;AAjDA;AACA;AAiDA;AACA;AACA;AAIA;AACA;;;;;;;;;;;;;;ACxEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAqBA;;;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AADA;AAQA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAFA;AAHA;AAQA;AACA;AAnGA;AAoGA;AACA;AAAA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AA1BA;AA2BA;AACA;AAAA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AAFA;AAHA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AAFA;AAHA;AAAA;AAQA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AA5FA;;;;;;;;;;;;;;AC9KA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAMA;AAEA;AACA;AADA;AAGA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAzBA;;;;;;;;;;;;;;ACfA;AACA;;;;;;;;;;;;;;AAwBA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAvCA;AACA;AAuCA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AACA;AADA;AAGA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAhDA;AAiDA;;;;;;;;;;;;;;ACpIA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAIA;AAEA;AACA;AACA;AADA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAcA;AACA;AAAA;AAIA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AApBA;AACA;AAoBA;AAMA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAAA;AADA;AAEA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAGA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;;;;;;AAMA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;;AAMA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC9IA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAaA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AATA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AA+BA;AACA;;;AA9BA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;;;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AA/BA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAFA;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAwEA;AAtEA;;;;AAIA;AACA;AACA;;;AADA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAIA;;;AAEA;AACA;AACA;AACA;AAFA;AAIA;AAEA;;;AAGA;AACA;;;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AA1EA;;;;;;;;;;;;;;AC5BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AAOA;AACA;AACA;AADA;AAWA;AAAA;AACA;AADA;AACA;AAXA;AAEA;AAEA;AAEA;AAEA;AAGA;AACA;AACA;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;;;AAEA;;;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;;;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAGA;AACA;;;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;AA/GA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;AAIA;;;;;;;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AATA;AAWA;AACA;AAbA;AAcA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AATA;AAWA;AACA;AAbA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAIA;AAUA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAaA;;;AAGA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AApDA;AA2DA;;;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AAGA;AACA;AAlCA;;;;;;;;;;;;;;AC5GA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAuDA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAPA;AAQA;;;AAGA;AACA;AAAA;;;AAIA;AACA;AACA;AANA;AAOA;;;;;;AAMA;AACA;AAAA;AAMA;AAAA;AAAA;AAAA;AACA;;;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAzBA;AA2BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;;;AACA;AASA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AACA;AACA;AACA;AAlGA;AACA;AAyBA;AAAA;AACA;AADA;AAyEA;AACA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AAtHA;AAuHA;;;AAGA;AACA;AAAA;AAWA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AArBA;AAsBA;;;AAGA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAQA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAfA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAKA;AAAA;AACA;AADA;AAEA;AAFA;AAAA;AALA;AAUA;AACA;AACA;AADA;AAMA;AACA;AACA;AAMA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAhCA;AAiCA;AACA;AAAA;AAIA;AAAA;AAAA;AAQA;AACA;AACA;AAEA;AAEA;AACA;AAEA;AACA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAQA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAFA;AAAA;AAIA;AACA;AACA;AAGA;AACA;AACA;AACA;AAvDA;AAAA;AACA;AADA;AAuDA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AA5DA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAoBA;AAAA;AACA;AADA;AAyCA;AA7DA;AAAA;AAAA;AAAA;AAAA;AACA;AA8DA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAAA;AAEA;AAFA;AAAA;AAKA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAHA;AAKA;AALA;AAOA;AACA;AA/GA;AAgHA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AACA;AAGA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;AAGA;AACA;AATA;AAaA;AACA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAGA;AAEA;;;AAGA;AACA;AACA;AADA;;;AAMA;AAGA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAOA;AACA;AA7BA;AA8BA;;;AAGA;AACA;AAAA;AAKA;AAEA;AACA;AAAA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAHA;AAOA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAlCA;AAmCA;;;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AACA;AAvBA;;;;;;;;;;;;;;ACvmBA;;;;;;AAMA;AACA;;;;;;;;;AAyCA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAaA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AANA;AAuCA;;;AAGA;AACA;AAAA;AAiEA;;;AAGA;AACA;AAAA;AACA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;;;;AAUA;AACA;AACA;AAAA;;;;;;;;;;AAUA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AA9EA;AAqGA;;;AAGA;AACA;AAAA;AACA;;;;;;;AAOA;AACA;AACA;AAAA;;;;AAIA;AACA;AACA;AAAA;;;;;;;;AAQA;AACA;AAzBA;AAkFA;AACA;AAAA;AACA;AACA;AAFA;AA0UA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAsFA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AAFA;AA8BA;AACA;AAAA;AACA;AADA;AAiLA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACtgCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AAAA;AACA;AAAA;AASA;AACA;AACA;AADA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AANA;AACA;AAFA;AASA;AACA;AAAA;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAGA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;;;;;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAgBA;AAEA;AAEA;AAFA;AAIA;AAEA;AACA;AApFA;AACA;AAoFA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AARA;AAUA;;;;;;;;;;;;;;AClJA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;;;AADA;AACA;AACA;AAFA;AAGA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAIA;AACA;AAEA;AACA;AACA;AADA;;;AAQA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AADA;AAOA;AACA;AAEA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AApBA;;;;;;;;;;;;;;AC5FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDA;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAKA;AACA;AAAA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AAtGA;AAuGA;AACA;AACA;AACA;AAAA;;;;;;;;;;;;;;ACtKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnBA;AACA;AAyBA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AACA;AAKA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AANA;AASA;AACA;AACA;AAFA;AAIA;AACA;AANA;AAQA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AANA;AASA;AACA;AACA;AAFA;AAIA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AAFA;AAYA;;;AAGA;AACA;AAAA;AAGA;AAAA;AAEA;AACA;AACA;AAPA;;;;;;;;;;;;;;AC5HA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAiBA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAVA;AAWA;AACA;AAAA;;;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAaA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAJA;AAKA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAXA;AAYA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AACA;AACA;AALA;AAMA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAJA;;;;;;;;;;;;;;ACvGA;;;;;;AAMA;AACA;;;;;;;AAuBA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAjBA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA;AACA;AAAA;AAOA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AADA;;;;;AAOA;AAYA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AAfA;AAgBA;AACA;AAHA;AAIA;AACA;;AAxBA;AACA;AADA;AACA;AA4BA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAXA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAEA;;AAEA;AACA;AAAA;;;;;;;;;;;;;;ACjCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AAGA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AAEA;AACA;AAEA;AACA;;;AAEA;AACA;AACA;;;;;;AAzBA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AAGA;AACA;AACA;AADA;AACA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAzBA;AACA;AAFA;AA4BA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAdA;AACA;AAFA;AACA;AAgBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAGA;AACA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAdA;AACA;AAFA;;;;;;;;;;;;;;ACxFA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;;;;;AAKA;AACA;AAAA;AAIA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AApBA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAoCA;AACA;AACA;AADA;AAAA;AACA;AAAA;AAEA;AAEA;AACA;AACA;AAPA;AA4BA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAMA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAGA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAEA;AAAA;AAAA;AACA;AAHA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AARA;AASA;AACA;AAAA;AAGA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AARA;AASA;AACA;AAAA;AAGA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAGA;AAAA;AAHA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAJA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AAVA;AACA;AAWA;AACA;AAAA;AAIA;AACA;AACA;AANA;AAOA;AACA;AAAA;AAIA;AACA;AACA;AANA;AAOA;;;;;;;;;;AAUA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAJA;AAoDA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC3HA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAqEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAcA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AACA;AACA;AADA;AAKA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAfA;AAgBA;AACA;AAAA;AAMA;AACA;AACA;AAAA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnCA;AAoCA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AANA;AACA;AAQA;AACA;AACA;AACA;AAAA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;;;;;AAKA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAxBA;AAyBA;;AAEA;AAEA;AACA;AAAA;AACA;AAKA;AAKA;AACA;AAAA;AAKA;AAGA;AAIA;AACA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AAzBA;AA0BA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AANA;AASA;AACA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAjBA;AAmBA;AACA;AAvEA;AAwEA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAJA;AAKA;;AAEA;AAEA;AACA;AAAA;AACA;AAOA;AAEA;AACA;AAAA;AAAA;AAMA;AAAA;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AApCA;AACA;AADA;AAuCA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;;AAEA;AACA;AACA;;;AAGA;AACA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArEA;AAsEA;;;;AAIA;AACA;AACA;;;;;;;;;;;;;;;;;;AAkBA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAdA;;;;;;;;;;;;;;AC1oBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AAsCA;AACA;AACA;AADA;AAIA;AAAA;AACA;AACA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAnBA;AAoBA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;AAIA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;;;AAMA;AAGA;AACA;AAVA;AAWA;;;;AAIA;AACA;AAAA;AACA;AAEA;AAKA;AAPA;AACA;AAFA;AACA;AASA;AAKA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AADA;AACA;AAFA;;;;;;;;;;;;;;ACjIA;;;;;;AAMA;AACA;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAWA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AA1BA;AA4BA;AACA;AA9BA;AA+BA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACvDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAMA;AACA;AAGA;AACA;AAQA;AACA;AAAA;AACA;AACA;AAAA;AAKA;AACA;AAAA;AAKA;AACA;AAAA;AAuBA;AACA;AAAA;AAoBA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AANA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAQA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAdA;AAeA;AACA;AAAA;AASA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAjBA;;;;;;;;;;;;;;AC3IA;;;;;;AAMA;AACA;;;;;;;AAMA;;;AAGA;AACA;AAAA;AACA;AAIA;AACA;AANA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC5BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AAEA;AACA;AACA;AANA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;AACA;;;;;;;;AAQA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAziBA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAJA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAUA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AAAA;AAKA;AAGA;AACA;AApBA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AASA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAIA;AACA;AA1BA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAKA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAOA;AACA;AACA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAOA;AACA;AAAA;AAaA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAGA;AAAA;AAMA;AAKA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAPA;AACA;AASA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AADA;;;;;;;;;;;;;;AC5IA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAMA;AACA;AAIA;AACA;AAAA;AACA;AAQA;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACtEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AAUA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AACA;AACA;AAIA;AAGA;AAAA;AAeA;AACA;AA7BA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAYA;AACA;AACA;;;;;AASA;AAAA;AACA;AADA;AACA;AAAA;AACA;AA6CA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AA5EA;AACA;AACA;AAJA;AAKA;AACA;;;AACA;AACA;;;AAGA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AALA;AAYA;;;AAkCA;AACA;AACA;AACA;;;;AA3FA;AACA;AAAA;AACA;AA4FA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAjBA;AAmBA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACrKA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAwBA;AACA;AACA;AADA;;;;;AAaA;AAAA;AACA;AADA;AACA;;;AAAA;AACA;AA2FA;AAAA;AAAA;AACA;AA5FA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAHA;AACA;AAIA;AACA;AACA;AACA;AArCA;AAsCA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;;;AAEA;AAIA;AADA;AADA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAIA;;;AAIA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AAOA;;;;AAjJA;AACA;AADA;AACA;AACA;AADA;AACA;AAkJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAEA;AAAA;AAAA;AAKA;AAAA;AAAA;AAMA;;;;;;;;;;;;;;AC3OA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAMA;AACA;AACA;AADA;;;;;;;;;;;;;AAGA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;;AANA;AACA;AADA;AACA;AACA;AAOA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AACA;AADA;AAGA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC1CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAmCA;;;;;AAAA;AAAA;AACA;AADA;AACA;;;AAOA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAMA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAFA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAFA;AAMA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AA5HA;AAgKA;AACA;;;AA7JA;AACA;AACA;;;AAuHA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AATA;AAcA;;;;AA/JA;AACA;AAAA;AACA;AACA;AA+JA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAFA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAXA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC1RA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAYA;;;;;AAKA;AAAA;AACA;AADA;AACA;AAAA;AACA;AAcA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAzBA;AACA;AAHA;AAIA;AACA;;;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAcA;AACA;AAAA;AAAA;AAAA;AACA;;;;AAnCA;AACA;AAqCA;AAAA;AACA;AAAA;AADA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAWA;;;;;AAAA;AAAA;AACA;AADA;AACA;;;AAYA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAvBA;AAoCA;AACA;;;AApCA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AAHA;AAOA;;;;AAnCA;AACA;AAqCA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;AC/EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAWA;;;AAGA;AACA;AACA;AADA;;;;;AAAA;AAAA;AACA;AADA;AACA;;AAAA;AADA;AAuBA;AACA;;;AArBA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;;;;AAtBA;AACA;AADA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AACA;AADA;AAMA;;;AAGA;AACA;AAAA;;;;;AAAA;AAAA;AACA;AADA;AACA;;AAAA;AADA;AAEA;AACA;;AAHA;AACA;AADA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAUA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAGA;AACA;AACA;AAFA;AACA;AAGA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AA/BA;AAmCA;AACA;AAjDA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAFA;AAMA;AACA;AAVA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;AACA;AACA;AACA;;;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;;;;AAXA;AACA;AADA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAPA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AACA;AA2BA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;;;;;;;AAOA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAWA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AAGA;;;;;;;;;;;;;;AC7DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAKA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAIA;AACA;AACA;AADA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AAPA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAWA;;;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAMA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AATA;AAiBA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AA7CA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAuBA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAUA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAlBA;AAoBA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;;;AADA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AAQA;AAVA;AAcA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAQA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAFA;AACA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AATA;AACA;AAWA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACjMA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAOA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AADA;AAOA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AA7BA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAoBA;AACA;AAAA;AAGA;AACA;AACA;AADA;AA8BA;AACA;AAAA;;;;;AAAA;AAAA;AACA;AADA;AACA;;AAEA;AAEA;AAEA;AACA;AACA;AAFA;AACA;AAQA;AAAA;AAGA;AACA;AAAA;AACA;AALA;AACA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAjEA;AAuKA;AACA;;;AA5JA;AACA;AACA;;;AAoDA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;;;AAEA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAKA;AAGA;AACA;AACA;AACA;AACA;AAAA;AALA;AAQA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AALA;AASA;AAAA;AACA;AAAA;AAAA;AAAA;AAOA;;;;AAtKA;AACA;AADA;AACA;;;;;;;;;;;;;;ACxEA;;;;;;AAMA;AACA;;;;;;;;;;AAIA;AACA;AAEA;AAEA;AACA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AApCA;AAqCA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AASA;;AAEA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACzFA;;;;;;AAMA;AACA;;;;;;;;;;AAEA;AA4BA;;;AAGA;AACA;AACA;AADA;AAIA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAFA;AAIA;AADA;AAIA;AACA;AAxBA;AAyBA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAlBA;;;;;;;;;;;;;;ACtEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;;;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAEA;AACA;AApBA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAQA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAFA;AACA;AADA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;;;ACVA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAsCA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AAAA;;;AACA;AASA;AAEA;AACA;AACA;AAEA;;;AAGA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAFA;AAOA;AACA;AACA;AACA;AAFA;AAFA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AANA;AAFA;AAYA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AATA;AA5BA;AA0CA;AAQA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;;;;;;;;;;;;;;ACnPA;;;;;;AAMA;AACA;;;;;;;;;AAMA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AAGA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAMA;;;;AAIA;AACA;AAAA;AAIA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AArBA;AAsBA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;;;;AAOA;AACA;AAAA;AACA;;;;;;;;;;;;;;;;;;AAkBA;AAEA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1DA;;;;;;;;;;;;;;AC9DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AADA;AAKA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AAHA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAKA;AACA;AANA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AAgBA;AAGA;AACA;AAtEA;AACA;AAsEA;AAIA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAGA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAIA;AACA;AAVA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AAMA;AACA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AACA;AAIA;AACA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAGA;AACA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AAEA;AAEA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;ACtCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AAOA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAAA;AAKA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAGA;AACA;AARA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAGA;AACA;AACA;AACA;AAmBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAeA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAQA;AACA;AAAA;AAGA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;AC3DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AACA;AAEA;;AAEA;AACA;AAAA;AAyBA;AACA;AAAA;AAGA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAIA;AACA;AAxCA;AAyCA;AACA;AAAA;AAMA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAZA;;;;;;;;;;;;;;AChGA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAwBA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;;;AAOA;AACA;AAGA;AAGA;AACA;AAzCA;AACA;AAyCA;AAGA;AAAA;AACA;AAEA;AACA;AADA;AAIA;AACA;AACA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAIA;;;;;;;;;;;;;;AC1GA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AAWA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAnBA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAQA;;;AAGA;AACA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAFA;AAOA;AAAA;AAGA;AACA;AACA;AAGA;AACA;AADA;AAFA;AASA;AACA;AAtDA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAqBA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAIA;AAIA;AACA;AA/BA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAqBA;AACA;AACA;AADA;AAGA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAIA;AAIA;AACA;AA/BA;;;;;;;;;;;;;;ACnCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAUA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAHA;AAaA;AACA;AA/BA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAkBA;AACA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AANA;AAWA;AACA;AACA;AACA;AAJA;AAWA;AACA;AAxDA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;AAMA;AACA;AAAA;AAGA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AADA;AA7BA;AAiCA;AACA;AAxCA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAOA;AACA;AACA;AACA;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAsCA;AACA;AACA;AADA;AAiCA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAKA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AAVA;AAeA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AADA;AAZA;AAiBA;AACA;AACA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AADA;AAPA;AACA;AAYA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAeA;AACA;AAFA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAGA;AAAA;AAAA;AAQA;AACA;AACA;AACA;AACA;AACA;AANA;AAcA;AAAA;AAAA;AAOA;AAAA;AAAA;AASA;AACA;AA3OA;AA4OA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AACA;AAiBA;AAAA;AAGA;AACA;AACA;AACA;AAJA;AAFA;AACA;AAcA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AADA;AAcA;AACA;AACA;AADA;AAEA;AACA;AAAA;;;;;;;;;;;;;;ACpZA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AAMA;AACA;AACA;AADA;AAMA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AATA;AAgBA;AACA;AAAA;AAOA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAHA;AAKA;AACA;AAdA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAQA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5JA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAQA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACtWA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;;;;;;;;;;;;;;AC/OA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;AAGA;AAmQA;AAmQA;AACA;AAAA;AACA;AACA;AAFA;;;;;;;;;;;;;;ACjhBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3JA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AAEA;;;;;;;AAOA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;;;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAFA;AAGA;;;;;AAKA;AACA;AAAA;AAAA;AACA;AAEA;;;;;;AAMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AApBA;AAqBA;AACA;AAAA;;;;;AACA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAEA;AACA;;AAJA;AACA;AADA;AAMA;;;AAGA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAjBA;;;;;;;;;;;;;;ACnEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA;;;;;;;;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AACA;AAWA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAXA;AAYA;;;AAGA;AACA;AAAA;AAKA;AAAA;AAAA;AAEA;;;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AA5BA;;;;;;;;;;;;;;AClEA;;;;;;AAMA;AACA;;;;;;;;;AAGA;;;AAGA;AACA;AAAA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAqBA;AACA;AAAA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;AAiBA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAEA;AAGA;;;AAGA;AACA;AACA;AADA;AAiBA;AASA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;;;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AAIA;AACA;AACA;AAFA;AAIA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;;;;AAvFA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAaA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAQA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAbA;AACA;AAeA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AACA;AADA;AAmBA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAKA;AACA;AAGA;AACA;AACA;AACA;AAEA;AASA;AACA;AAAA;AAGA;AAEA;AAkBA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;;;AACA;AACA;AAGA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;AAGA;;;AAEA;;;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAMA;;;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;;;;;;AArMA;AACA;AAuMA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAOA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AACA;AAYA;AAKA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAcA;AAeA;AACA;;;;;;;;;;;;;;AChYA;;;;;;AAMA;AACA;;;;;;;;AACA;AAIA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAMA;;;;;;;;;AASA;AACA;AAAA;AACA;AAAA;AAKA;AADA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AA3CA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;;AAYA;;;;;;;;;AASA;AACA;AAAA;;;AAKA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA3BA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;;;AAGA;AACA;AAAA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AARA;AAaA;;;AAGA;AACA;AAAA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AARA;AAaA;AACA;AAAA;AACA;AACA;AAFA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AARA;AAgBA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAvBA;AAyBA;AAzBA;AA6BA;AACA;AAAA;;;;;;;;;;;;;;AC7KA;;;;;;AAMA;AACA;;;;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AA8BA;AAEA;AACA;AAFA;AAOA;;;AAGA;AACA;AAAA;AASA;AAAA;AACA;AACA;AACA;AACA;AAbA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;;;AAIA;AACA;AAaA;AACA;AACA;AA4FA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAghBA;;;AAGA;AACA;AAAA;AASA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAbA;AAiBA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACtqBA;;;;;;AAMA;AACA;;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AAoBA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAqCA;;;AAGA;AACA;AAAA;AAEA;AACA;AAFA;AAKA;AADA;;;;;;;;;;;;;;ACjFA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AACA;AAKA;AACA;AACA;AAMA;AAAA;AAGA;AACA;AAFA;AAFA;AASA;;;AAGA;AACA;AACA;AADA;;;;;;;;;;;;;;AChDA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAEA;AACA;AAKA;AACA;AACA;AA+DA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AA2IA;;;AAGA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAkBA;AACA;AAAA;AAKA;;;AAGA;AACA;AAAA;AASA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AACA;AAlBA;;;;;;;;;;;;;;AChRA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAMA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAaA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjCA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAkBA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC/CA;;;;;;AAMA;AACA;;;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AADA;AA0BA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACvDA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAOA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAUA;;;;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAkCA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;AC/DA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AA0BA;;;;;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;AAKA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;AClFA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAoBA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAqBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AAOA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AACA;AACA;AA2PA;AACA;AACA;AADA;AAAA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAJA;AA9BA;AAAA;AACA;AADA;AAsCA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAFA;AACA;AAGA;AACA;AACA;AAEA;AACA;AACA;AACA;AALA;AACA;AAMA;AACA;AAEA;AACA;AAHA;AACA;AAIA;AACA;AAEA;AACA;AACA;AACA;AALA;AACA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AALA;AACA;AAQA;AACA;AACA;AAEA;AACA;AAHA;AACA;AAIA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AAFA;AAJA;AASA;AAGA;AAdA;AACA;AAeA;AACA;AAEA;AACA;AAHA;AACA;AAIA;AACA;AACA;AAEA;AAEA;AAFA;AAFA;AAQA;AAEA;AACA;AAHA;AADA;AACA;AAOA;AACA;AAEA;AAEA;AAFA;AAFA;AACA;AAMA;AACA;AAEA;AAEA;AAGA;AACA;AACA;AAPA;AAFA;AACA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AAEA;AAFA;AAFA;AACA;AAMA;AACA;AAGA;AAHA;AAjIA;AAwIA;AACA;AACA;AA9IA;AACA;AA8IA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;;;;;;;;;;;;;;AC1fA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAKA;;;AAGA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAyBA;AACA;;;AAxBA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AACA;;;;;;AAGA;AAAA;AAAA;AACA;AAAA;AAyBA;AACA;;;AApBA;AACA;AACA;AACA;AAFA;AAIA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AAEA;AACA;;;AAtBA;AAAA;AACA;AACA;;;;;AAuBA;;;;AAIA;AACA;AACA;AADA;AAEA;;;;;;;;;;AAUA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;;;;;;;;;;;;;;AC5FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AACA;AAMA;AACA;AAAA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAEA;AACA;AAAA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAEA;AACA;AACA;AAGA;AAJA;AAHA;AAFA;AACA;AAaA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAGA;AAJA;AAJA;AAJA;AACA;AAgBA;AAAA;AACA;AAEA;AAEA;AAGA;AACA;AAGA;AAJA;AAMA;AACA;AAGA;AAJA;AAPA;AAeA;AAGA;AAGA;AAJA;AAOA;AACA;AACA;AACA;AAGA;AAJA;AA9BA;AAFA;AAwCA;AACA;AACA;AACA;AAEA;AAFA;AACA;AAIA;AACA;AACA;AAEA;AAFA;AACA;AAIA;AACA;AAEA;AAFA;AACA;AAIA;AACA;AAEA;AAFA;AACA;AAIA;AACA;AAEA;AAFA;AACA;AAIA;AAAA;AACA;AACA;AAEA;AAIA;AAJA;AAMA;AARA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;;;AACA;AACA;AACA;AAAA;AAAA;AAEA;AAFA;AAAA;AAIA;AACA;AAAA;AAEA;AAEA;AAEA;AAEA;AACA;AAHA;AAKA;AAEA;AAFA;AAPA;AAYA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAFA;AAFA;AAOA;AACA;AACA;AAAA;AACA;AAEA;AAEA;AAEA;AAFA;AAFA;AAOA;AACA;AACA;AACA;AAjNA;AAmNA;AACA;AA1NA;AA2NA;;AAEA;AACA;AACA;AAGA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACxSA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AAMA;AAAA;AAAA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;;;;;;;;;;;;;;AClDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAKA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AACA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAFA;AAIA;AAGA;;AAEA;AACA;AAAA;AAGA;AAEA;AACA;AACA;AACA;AARA;;;;;;;;;;;;;;AClCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAaA;AACA;AACA;AADA;AACA;AADA;AAIA;AACA;AAAA;AAaA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAbA;AAeA;AACA;AAEA;AACA;AACA;;;;;;;;;;;;;;ACvEA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAVA;;;;;;;;;;;;;;ACpBA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;;;;;;;;;;;;AClDA;;;;;;AAMA;AACA;;;;;;;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAPA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AATA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;AAGA;AAGA;AACA;AACA;AADA;;;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;AAWA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AArBA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AATA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AAiBA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;;AAIA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;AASA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAFA;;;;;;;;;;;;;;ACjBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAKA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AANA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAFA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAbA;AAiBA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;AAIA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AATA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AAEA;AAEA;AACA;;;;;;;;;;;;;;ACpCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAEA;;;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAIA;;;AAGA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;AAKA;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;AAIA;AACA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAHA;AACA;AADA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;AAGA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC1BA;;;;;;AAMA;AACA;;;;;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AAIA;;;;;;;;;;;;;;AChCA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;AACA;AAGA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAQA;AAAA;AACA;;;AAAA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;;;;;;;;;;;;AC3CA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAQA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAAA;AADA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAKA;AACA;AApBA;AAqBA;;;;;;;;;;;;;AAaA;AACA;AAAA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAfA;AACA;AAFA;AAkBA;;;;;;;;;;;;;;AAcA;AACA;AAAA;AACA;AACA;AASA;AACA;AACA;AAAA;AACA;AACA;AALA;AARA;AADA;AACA;AAFA;;;;;;;;;;;;;;AC/FA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;;;AAKA;;;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;AAIA;AACA;AAAA;AAMA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAZA;AAaA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAPA;AAAA;AACA;AADA;AAUA;AACA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AACA;AADA;;;;;;;;;;;;;;ACvDA;;;;;;AAMA;AACA;;;;;;;AAyEA;;;;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAJA;AAKA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;;;;;;;;;;;;;;AC1GA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AALA;AASA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAUA;AACA;AAZA;;;;;;;;;;;;;;ACvBA;;;;;;AAMA;AACA;;;;;;;;;AAYA;AACA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAnBA;AAoBA;;;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;;;;;;;;;;;;;;AC5CA;;;;;;AAMA;AACA;;;;;;AACA;AACA;AAAA;AAaA;AACA;AACA;AADA;AAMA;AACA;AACA;AARA;AASA;AACA;AAAA;AAMA;AACA;AACA;AARA;AASA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAKA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AAKA;AACA;AACA;AAPA;AACA;AAOA;AACA;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAOA;AACA;AACA;AATA;;;;;;;;;;;;;;AChFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AA8BA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;AA4BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AAiBA;;;;;;;;;;AAUA;AACA;AAAA;AAMA;AAGA;AACA;AAVA;AACA;AAUA;AACA;AACA;AACA;AACA;AAMA;AAGA;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAMA;AAGA;AACA;AAVA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AADA;AACA;AAGA;AACA;AALA;AACA;AAKA;AACA;AACA;AACA;AAAA;AACA;AACA;;;;;;;;;;;;;;ACxLA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;AACA;AAIA;AACA;AACA;AADA;AAAA;AAAA;AAQA;AAHA;AASA;AAFA;AAZA;AACA;AADA;AAiBA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AACA;AAKA;AACA;AAPA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;;;;;;;;;;;;;;ACnFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAIA;AAIA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAJA;AASA;AACA;AAAA;AACA;AACA;AAFA;AAOA;;;;AAIA;AACA;AAAA;AACA;;;AAGA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AAbA;AAkBA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AArBA;AA8BA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AACA;AAAA;;;;;;;AAOA;AACA;AArBA;AAuCA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;;;;;;;AAOA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAJA;AAwFA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAJA;AAKA;;;;;AAKA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAZA;AAaA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAnBA;AAoBA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnBA;AACA;AAmBA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AAHA;AAIA;;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;;;;;;;;;;;;AAYA;AACA;AAAA;AAIA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AAIA;AAAA;AAEA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAGA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAvEA;AAiFA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;;;;;;;;;;;;;AAaA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAiBA;;;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AAMA;;;AAGA;AACA;AAAA;;;AAIA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AApBA;AAqBA;;;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AALA;AAMA;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;;;;;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAbA;AAcA;;;;AAIA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AANA;AAOA;;;;AAIA;AACA;AAAA;AAIA;AACA;;;AAAA;AACA;AACA;AACA;AARA;AASA;;;;;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAdA;AAeA;;;;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;;AAIA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AAVA;AAWA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAXA;AAYA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AADA;AACA;AADA;AAGA;AAOA;AACA;AAAA;;;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAVA;AAWA;;;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AADA;AACA;AADA;AAGA;;;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAJA;AAKA;;;AAGA;AACA;AAAA;AAIA;AACA;AAEA;AACA;AACA;AACA;AACA;AAGA;AACA;AAfA;;;;;;;;;;;;;;ACluBA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AAcA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAgBA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AArBA;AAuBA;AACA;AAzBA;;;;;;;;;;;;;;ACxCA;;;;;;;;;;;;;;;;;;AAkBA;AACA;AA4+CA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAzvCA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAcA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;;;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AAEA;;;;;;;;;;;;;;AAcA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAUA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AACA;AACA;AACA;;;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;;;AA9WA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAsWA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AACA;AACA;;;;;;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AACA;AACA;;;;;;AAGA;AAuBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAEA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;;;;AAIA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AAEA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AALA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AANA;AAAA;AAAA;AAAA;AACA;AADA;AAMA;AACA;AAPA;AAIA;AAJA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AASA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;;;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AALA;AAAA;AAAA;AAAA;AACA;AAMA;AACA;AARA;AAAA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AATA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAeA;AACA;AAhBA;AAAA;AACA;AADA;AAQA;AARA;AAAA;AACA;AADA;AAOA;AAPA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AAsBA;AACA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAGA;;;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAGA;AAIA;AAEA;AACA;;;AACA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAxBA;AACA;AAyBA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;;;AACA;AACA;AAIA;;;AACA;AACA;AAIA;;;;;;AA9YA;AAiZA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAsDA;;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;;;AACA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AACA;;;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AANA;AAAA;AAAA;AAAA;AACA;AADA;AAMA;AACA;AAPA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAOA;AACA;AARA;AAAA;AACA;AADA;AAWA;AACA;AAZA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAYA;AACA;AACA;AAdA;AAAA;AAgBA;AACA;AAjBA;AAiBA;AACA;AAlBA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAkBA;AACA;AACA;AApBA;AAAA;AAAA;AAAA;AACA;AAoBA;AACA;AAtBA;AAAA;AAAA;AAAA;AACA;AADA;AAsBA;AACA;AAvBA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AA2BA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;;;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;;;;AAIA;AACA;;;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAJA;AAEA;AAFA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AAMA;AACA;AACA;AACA;AACA;;;;AAjOA;;;;;AAKA;AACA;AAIA;AAAA;AAAA;AAEA;AAGA;;;;;;AArDA;AACA;AAyQA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAFA;AAGA;AACA;AAJA;AAAA;AAIA;AACA;AALA;AAKA;AACA;AANA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AADA;AACA;AADA;AAAA;AACA;AADA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC//CA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AAEA;;;;;;;;;;;;;;;;;;;AAmBA;AACA;AACA;AADA;AAKA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAtBA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;AACA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AATA;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AACA;AAGA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAEA;AACA;AAJA;AAKA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AACA;;;AACA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAFA;AAAA;AAIA;AACA;;;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AACA;;;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;;;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAAA;AAMA;AACA;;;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;;AAEA;AACA;;;AAAA;AAKA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAAA;AAKA;AACA;AACA;;;;;;AAxEA;;;;;;;;;;;;;;AC/BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAGA;AACA;AAAA;AAWA;AAAA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AACA;;;AAEA;AACA;AACA;;;;;;AArCA;;;;;;;;;;;;;;;;;;;;;;;;;;ACXA;;;;;;AAMA;AACA;;;;;;;AACA;;;AAGA;AACA;AAAA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AClKA;;;;;;AAMA;AACA;;;;;;;;AACA;AAaA;AACA;AACA;AADA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAvwCA;AA+wCA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AA7PA;AAiQA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAXA;AAeA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAlBA;AAsBA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAVA;AAcA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAxsBA;AAgtBA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAtfA;AA8fA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAl1CA;AA01CA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC/vIA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AACA;AAyIA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AACA;AAyIA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AA9RA;AAyaA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAdA;AAJA;AA8IA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAdA;AAJA;AA8IA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AACA;AAyIA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AAjJA;AA4RA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AACA;AAyIA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAfA;AAjJA;AA4RA;AACA;;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAdA;AAJA;AA9vCA;AA64CA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AA94CA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AAmNA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AAmNA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AAmNA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AAmNA;AACA;AACA;AACA;AAyMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAhNA;AA30BA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;AACA;AACA;AAAA;AAQA;;;AAGA;AACA;AACA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;AAkDA;AACA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AACA;AAFA;AAGA;AACA;AAAA;AAAA;AACA;AADA;AACA;AAAA;AAAA;AACA;AAFA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;AC1EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAUA;AAKA;AAEA;AAKA;AAEA;AACA;AACA;AADA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AACA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AAgBA;;;AAGA;AACA;AAAA;AAGA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;;;ACtEA;;;;;;AAMA;AACA;;;;;;;;AAEA;AAGA;AACA;AACA;AADA;AAIA;AACA;AACA;AANA;AAaA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;AC3BA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA;AACA;AACA;;;;;AAKA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAAA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AACA;AAJA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AADA;AAKA;AAAA;AAAA;AAAA;AALA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AAFA;AAAA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAHA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1DA;AA2DA;;;;;;;;;;;;;;AC/FA;;;;;;AAMA;AACA;;;;;;;;;AAUA;;;AAGA;AACA;AAAA;AACA;AACA;AAFA;AAoIA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;AC/JA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;AACA;AAGA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;AChBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;AACA;AACA;AACA;;;;;AAKA;AACA;AAAA;;;;;;;;AAGA;;;;;AAKA;AACA;AACA;AAAA;AACA;AADA;AADA;AACA;AACA;AAAA;AACA;AACA;AAEA;;AAEA;AACA;;;AAAA;AACA;AACA;AAOA;AACA;AAEA;;;;;AAKA;AACA;;;AAAA;AACA;AAAA;AACA;AADA;AADA;AACA;AACA;AAAA;AACA;AACA;AAEA;;;;;AAKA;AACA;;;AAAA;AACA;AACA;AAEA;;;;;AAKA;AACA;;;AAAA;AACA;AACA;;;;;;AA5DA;AACA;AA8DA;;;;;;;;;;;;;;AC/EA;;;;;;AAMA;AACA;;;;;;;AAOA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACfA;;;;;;AAMA;AACA;;;;;;;;AAWA;AAAA;AAAA;AACA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AAEA;AAQA;AACA;AAAA;;;AASA;AACA;AACA;AADA;AACA;AAGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAEA;AAFA;AAAA;AAKA;AACA;AACA;AArBA;AAAA;AACA;AADA;AAqBA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAtCA;AAAA;AAAA;AAAA;AAAA;AACA;AAsCA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AA9DA;AACA;AA8DA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AAAA;AAGA;AACA;;;;;;;;;;;;;;AC9IA;;;;;;AAMA;AACA;;;;;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;;;;;;;;;;;;;;ACtBA;;;;;;AAMA;AACA;;;;;;;AAUA;AACA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA1BA;AA4BA;AACA;AADA;AAIA;AACA;AADA;AAIA;AACA;AADA;AAeA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAtBA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAPA;AA1BA;AAwCA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AARA;AARA;AAmBA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AARA;AAUA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAbA;AAkBA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAfA;AAnDA;AAqEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AASA;AACA;AACA;AACA;AACA;AAHA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAXA;AAkBA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AA7CA;AAiDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAlBA;AAwBA;AACA;AAnDA;AAqDA;AACA;AACA;AACA;AAAA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAFA;AAhBA;AA3CA;AAiEA;AACA;AACA;AAAA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AA/ZA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAtBA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAPA;AA1BA;AAwCA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AARA;AAkBA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AARA;AAUA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAbA;AAkBA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAfA;AAnDA;AAqEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAVA;AAiBA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AA7CA;AAiDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAlBA;AAwBA;AACA;AAnDA;AAqDA;AACA;AACA;AACA;AAAA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAFA;AAhBA;AA3CA;AAiEA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AA5ZA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAtBA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAPA;AA1BA;AAwCA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AARA;AAkBA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AARA;AAUA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAbA;AAkBA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAfA;AAnDA;AAqEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAVA;AAiBA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AA7CA;AAiDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAlBA;AAwBA;AACA;AAnDA;AAqDA;AACA;AACA;AACA;AAAA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAFA;AAhBA;AA1CA;AAgEA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AA3ZA;;;;;;;;;;;;;;AC3BA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAtBA;AA+BA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AAHA;AAPA;AA1BA;AAwCA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AARA;AARA;AAmBA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AARA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AATA;AAUA;AACA;AACA;AAAA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAbA;AAkBA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AACA;AACA;AACA;AALA;AAOA;AAfA;AAnDA;AAqEA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AASA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAXA;AAkBA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAKA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AA7CA;AAiDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAZA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAlBA;AAwBA;AACA;AAnDA;AAqDA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AACA;AAFA;AAhBA;AA1CA;AAgEA;AACA;AACA;AAAA;AACA;AAFA;AAIA;AAAA;AACA;AAAA;AACA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AA9ZA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;;AAEA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AAHA;AADA;AAOA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAIA;AACA;AAAA;AACA;AACA;AACA;AAHA;;;;;;;;;;;;;;ACjCA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;ACPA;;;;;;AAMA;AACA;;;;;;;;;;;AA8hBA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AA2CA;AACA;AAAA;AAEA;AAFA;;;;;;;;;;;;;;ACllBA;;;;;;AAMA;AACA;;;;;;;;AAEA;AAGA;AACA;AACA;AADA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AACA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AAPA;;;;;;;;;;;;;;ACrDA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AAGA;AACA;AACA;AADA;AACA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;;AAEA;AACA;AApBA;AACA;AA+CA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;;;;AAIA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;AC1EA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAKA;AACA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAGA;AACA;AANA;;;;;;;;;;;;;;AC7BA;;;;;;AAMA;AACA;;;;;;;;AACA;AAEA;;;;;AAKA;AACA;AACA;AADA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;;;;;;;;;;;;AChBA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;;ACAA;AACA;AACA;AAEA;AACA;AACA;AADA;;;;;;;;;;;;;;;ACLA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAKA;AACA;AAMA;AAGA;AACA;AACA;AADA;AAGA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAJA;AASA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAJA;AAzBA;AAiCA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAZA;AAeA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AAJA;AAUA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAtBA;AA6BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAJA;AADA;AADA;AA1FA;;;;;;;;;;;;;;ACzBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACdA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAzDA;AA2DA;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtZA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAHA;AADA;AAQA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtCA;AAyCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAKA;AAEA;AAIA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAKA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAJA;AADA;AAcA;AAEA;AAGA;AACA;AACA;AAHA;AAQA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AApEA;AAuEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAEA;AADA;AAKA;AACA;AACA;AACA;AACA;AAHA;AADA;AAQA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AAWA;AACA;AA/CA;AAkDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAOA;AACA;AAAA;AAQA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAVA;AAYA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AA9DA;AAiEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AAQA;AAOA;;;AAGA;AACA;AAAA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AAJA;AADA;AASA;AACA;AACA;AACA;AACA;AAJA;AADA;AAUA;AACA;AACA;AAFA;AADA;AAnBA;AADA;AAgCA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AALA;AAQA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AAWA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAPA;AAWA;AACA;AA7DA;AA8DA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACpKA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAAA;AAAA;AAbA;AAeA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AA9DA;AA+DA;AACA;AADA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AAFA;AAIA;AALA;AAQA;AACA;AAAA;AAAA;AAXA;AAaA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtCA;AAuCA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAGA;AACA;AACA;AACA;AAJA;AASA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAWA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AAhFA;AAmFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAIA;AALA;AAQA;AACA;AACA;AAFA;AAIA;AALA;AAQA;AACA;AACA;AAFA;AAIA;AALA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAPA;AAiBA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAFA;AACA;AAMA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAjBA;AAsBA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AAPA;AACA;AAUA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAjCA;AAkCA;AACA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3NA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAFA;AAOA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAWA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAOA;AACA;AAAA;AAQA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AA1EA;AA6EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AAnCA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAOA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AA/CA;AAkDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAFA;AACA;AAIA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAGA;AACA;AAFA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AALA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAIA;AAVA;AAaA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAIA;AAVA;AAaA;AACA;AAAA;AAAA;AACA;AACA;AA/BA;AAkCA;AACA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAIA;AAVA;AAaA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAIA;AAVA;AAaA;AACA;AAAA;AAAA;AACA;AACA;AA/BA;AAmCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AA5JA;AA+JA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5LA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAAA;AAAA;AAbA;AAgBA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAPA;AAUA;AAAA;AAAA;AAbA;AAgBA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAgBA;AACA;AAtFA;AAyFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC/HA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AApCA;AACA;AADA;AAmDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAlCA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA1DA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AAWA;AAWA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAzEA;AA4EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AADA;AAVA;AALA;AACA;AADA;AAsBA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AAMA;AACA;AACA;AAHA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAHA;AALA;AAaA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAHA;AALA;AAaA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AARA;AAYA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AASA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAJA;AAUA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AATA;AAaA;AACA;AAnDA;AAsDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAhBA;AAmBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AARA;AAYA;AACA;AApBA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpcA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAMA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AADA;AACA;AAQA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AADA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AANA;AAeA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AAOA;AAAA;AAAA;AAAA;AAAA;AAVA;AAYA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAvBA;AA0BA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AAAA;AAAA;AAZA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AADA;AAAA;AAXA;AAeA;AACA;AArGA;AACA;AAsGA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAtBA;AACA;AADA;AAmCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAzBA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AANA;AAxBA;AACA;AADA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AANA;AAjBA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAIA;AAAA;AAAA;AAIA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAbA;AAgBA;AAGA;AACA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAjCA;AACA;AADA;AA8CA;AAEA;AACA;AACA;AACA;AA6CA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AArDA;AAwDA;AACA;AACA;AACA;AA6CA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AArDA;AAwDA;AACA;AACA;AACA;AA6CA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AArDA;AA2DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9OA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AApCA;AACA;AADA;AAmDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC7EA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChCA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtCA;AAyCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AAGA;AACA;AACA;AAHA;AAQA;AACA;AACA;AAGA;AACA;AAFA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AACA;AACA;AAAA;AAAA;AAbA;AAgBA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAJA;AAcA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAHA;AAOA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AADA;AAeA;AACA;AAhGA;AAmGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAdA;AAkBA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAxCA;AAyCA;AACA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAdA;AAkBA;AACA;AA7CA;AAgDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA7BA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAlBA;AAqBA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAXA;AAsBA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAnEA;AAsEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAaA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAFA;AAFA;AAOA;AACA;AADA;AAGA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAFA;AAIA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AAFA;AAzBA;AAiCA;AACA;AACA;AAFA;AAlDA;AAhBA;AAwEA;AACA;AACA;AADA;AAGA;AACA;AADA;AAJA;AADA;AAvEA;AACA;AAkFA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AADA;AAKA;AAbA;AAgBA;AACA;AACA;AACA;AACA;AACA;AAGA;AADA;AARA;AAeA;AACA;AACA;AACA;AACA;AACA;AAGA;AADA;AARA;AAeA;AACA;AACA;AACA;AACA;AACA;AAGA;AADA;AAKA;AAAA;AAAA;AAAA;AAbA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtGA;AAyGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/NA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AA1BA;AACA;AADA;AA4CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAcA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAzBA;AACA;AADA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAjCA;AACA;AADA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAFA;AAMA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAlEA;AAmEA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AADA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAzBA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAJA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AAXA;AARA;AAyBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AAXA;AATA;AA2BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAdA;AAmBA;AACA;AAlJA;AAqJA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5KA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAiBA;AACA;AAtEA;AAyEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AClGA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1BA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AANA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAhBA;AANA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAWA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AA3EA;AA8EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AADA;AAgBA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAfA;AAoBA;AACA;AAnDA;AAsDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAfA;AAhCA;AACA;AADA;AAuDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA1CA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AANA;AACA;AADA;AAmBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AANA;AACA;AADA;AAoBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA1BA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AANA;AACA;AADA;AAoBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AANA;AACA;AADA;AAmBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AANA;AACA;AADA;AAoBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AALA;AACA;AADA;AAmBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AArBA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAtBA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAFA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AANA;AAUA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AANA;AAUA;AACA;AA/BA;AAkCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAXA;AANA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAZA;AANA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AADA;AADA;AAcA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAjBA;AAuBA;AACA;AApGA;AAuGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxJA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAXA;AAgBA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAdA;AANA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAGA;AACA;AACA;AAHA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AARA;AACA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAtEA;AAyEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AArDA;AAwDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAlCA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAlCA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAvBA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAGA;AACA;AAFA;AAMA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAnBA;AANA;AACA;AADA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAeA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAHA;AADA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AADA;AAiBA;AAGA;AACA;AAFA;AAOA;AACA;AAEA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AALA;AAQA;AACA;AADA;AAGA;AAEA;AACA;AADA;AAGA;AAJA;AAOA;AAZA;AAeA;AACA;AADA;AAGA;AAEA;AACA;AADA;AAGA;AAJA;AAOA;AAZA;AAcA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAcA;AACA;AArJA;AAwJA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjMA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAlEA;AAqEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AARA;AACA;AAeA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AARA;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AATA;AAgBA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAoBA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AAWA;AAWA;AAWA;AAWA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA9HA;AAiIA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxJA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAJA;AADA;AADA;AACA;AAYA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AASA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AArEA;AAwEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AANA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AAFA;AAMA;AAIA;AACA;AACA;AAHA;AAOA;AAIA;AACA;AACA;AAHA;AAOA;AACA;AAAA;AAAA;AAEA;AAGA;AACA;AAFA;AAMA;AACA;AACA;AACA;AAZA;AAcA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA9DA;AAiEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AACA;AACA;AAJA;AAbA;AARA;AADA;AADA;AAoCA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAjBA;AAsBA;AACA;AAhIA;AAmIA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAMA;AAMA;AAMA;AAMA;AAMA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAvGA;AAwGA;AACA;AADA;AAgBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAIA;AAIA;AAIA;AAGA;AACA;AACA;AAHA;AAQA;AAGA;AACA;AACA;AAHA;AAQA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAtEA;AAuEA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAhCA;AAiCA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAcA;AACA;AA1EA;AA6EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAjBA;AAsBA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAjBA;AAsBA;AACA;AA7BA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AACA;AACA;AAJA;AAbA;AAHA;AADA;AADA;AA+BA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAhDA;AAmDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AADA;AAgBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAFA;AAIA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAbA;AAZA;AACA;AADA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA1BA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAdA;AAhBA;AACA;AADA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAxBA;AAhBA;AACA;AADA;AAgDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACvEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AAAA;AAAA;AAPA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AAbA;AAiBA;AACA;AA5DA;AA+DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AADA;AAGA;AACA;AACA;AAAA;AAAA;AANA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA9CA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AAAA;AAAA;AAPA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAFA;AAQA;AACA;AACA;AAAA;AAAA;AAZA;AAeA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAtDA;AAyDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC5FA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACdA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAGA;AACA;AACA;AAHA;AASA;AAAA;AAAA;AAAA;AACA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAAA;AAEA;AACA;AAdA;AALA;AA0BA;AACA;AApEA;AAqEA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AADA;AAKA;AACA;AAPA;AAUA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AANA;AAoBA;AACA;AAhDA;AAiDA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAkBA;AAGA;AACA;AACA;AACA;AAJA;AAOA;AAAA;AAEA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAeA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAGA;AACA;AAFA;AAMA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAFA;AAHA;AAWA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAGA;AACA;AACA;AAHA;AASA;AAAA;AAAA;AAAA;AACA;AACA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAAA;AAEA;AACA;AAdA;AANA;AA2BA;AACA;AAnJA;AAoJA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9MA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AA/BA;AA6CA;AACA;AAvDA;AAwDA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAzBA;AAsCA;AACA;AAhDA;AAiDA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAEA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAzCA;AAyDA;AACA;AAlFA;AAmFA;AACA;AAIA;AACA;AACA;AACA;AACA;AAJA;AALA;AAeA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC7HA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAHA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AAAA;AAAA;AADA;AAPA;AAFA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAFA;AAQA;AACA;AAfA;AAkBA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAPA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AAGA;AACA;AA1GA;AACA;AA2GA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AACA;AApBA;AADA;AACA;AAwBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AAEA;AAAA;AAAA;AAAA;AAAA;AAVA;AAYA;AACA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAWA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAWA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAJA;AAOA;AAtBA;AAyBA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AANA;AAUA;AACA;AA/EA;AAkFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAIA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AACA;AACA;AAFA;AAFA;AAOA;AACA;AADA;AAbA;AADA;AAmBA;AAvBA;AA0BA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAWA;AAAA;AAAA;AAbA;AAgBA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAFA;AAnBA;AA0BA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAnBA;AAuBA;AACA;AA/EA;AAkFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAEA;AAeA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AACA;AACA;AAVA;AACA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AACA;;;AACA;AACA;AAJA;AAVA;AAqBA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AANA;AAaA;AACA;AAtDA;AAyDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AADA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AADA;AAKA;AACA;AADA;AATA;AAcA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AADA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AATA;AAJA;AAqBA;AACA;AAjFA;AAkFA;AACA;AACA;AAEA;AAAA;AAAA;AAJA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAUA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AALA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAxCA;AAyCA;AACA;AACA;AAFA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AAKA;AACA;AAnBA;AAoBA;AACA;AACA;AAAA;AAAA;AAFA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AADA;AAPA;AACA;AAWA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAHA;AAKA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AAIA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AAMA;AATA;AAYA;AACA;AA9DA;AA+DA;AACA;AACA;AAFA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AAJA;AAOA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAJA;AAOA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAHA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAnBA;AAJA;AA+BA;AACA;AAvDA;AAwDA;AACA;AACA;AAEA;AAAA;AAAA;AAJA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAKA;AA1BA;AAJA;AAkCA;AACA;AAvCA;AAwCA;AACA;AACA;AAAA;AAAA;AACA;AAHA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACvEA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;;;;;;;;;;;;;;ACTA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAhEA;AAsFA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AA5IA;AAkKA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjBA;AAzCA;;;;;;;;;;;;;;AClQA;;;;;;AAMA;AACA;;;;;;;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AA9HA;AALA;AAwIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AA9HA;AALA;AAwIA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;AAsfA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AAEA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAKA;AACA;AAFA;AAzeA;AALA;;;;;;;;;;;;;;AChuFA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAlBA;AA0BA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAlBA;AA5BA;AAwDA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAlBA;AAvGA;;;;;;;;;;;;;;AClEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AADA;;;;;;;;;;;;ACpBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AAUA;;;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhCA;AAkCA;AAlCA;AAwCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAGA;AAAA;AAIA;AAEA;;;;;;AAMA;AACA;AACA;AADA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAHA;AAOA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AALA;AAcA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AALA;AASA;AACA;AAEA;AACA;AACA;AACA;AACA;AAPA;AAUA;AADA;AAIA;AACA;AACA;AAHA;AAbA;AAyBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AAgBA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AARA;AAYA;AAAA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAJA;AAJA;AAYA;AAhBA;AAoBA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAHA;AAMA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAeA;AACA;AA9GA;AAiHA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC7MA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACXA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AAzCA;AA4CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAaA;AACA;AAtEA;AAyEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC9GA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACZA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AACA;AAIA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAkBA;AACA;AA1BA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AACA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAoBA;AACA;AA3BA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAjBA;AAqBA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAfA;AAmBA;AACA;AAzCA;AA0CA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AACA;;;AACA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AAHA;AAOA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAjBA;AAqBA;AACA;AA/DA;AAkEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAEA;AACA;AADA;AACA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAdA;AAHA;AACA;AADA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtCA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAKA;AACA;AACA;AACA;AAJA;AAYA;AACA;AACA;AACA;AAJA;AAxCA;AAkDA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AADA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AATA;AAYA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAFA;AAIA;AATA;AAYA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AATA;AAYA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAFA;AAIA;AATA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAiBA;AACA;AA9FA;AAiGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAKA;AACA;AACA;AACA;AAJA;AAYA;AACA;AACA;AACA;AAJA;AAxCA;AAkDA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAFA;AALA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAFA;AANA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAiBA;AACA;AA3DA;AA8DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AACA;;;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AAAA;AAIA;AAAA;AAVA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AAKA;AADA;AATA;AAgBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAFA;AADA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAxBA;AA2BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACzGA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACbA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AArBA;AA4BA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAXA;AAcA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAzBA;AA6BA;AACA;AAzFA;AA4FA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AARA;AAaA;AACA;AADA;AAnBA;AADA;AAyBA;AA/BA;AAkCA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAnBA;AAuBA;AACA;AAxEA;AAyEA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAlBA;AAyBA;AACA;AAEA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAOA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAFA;AAIA;AAAA;AAAA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AATA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAFA;AAzBA;AAqCA;AACA;AAjGA;AAoGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAWA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AAFA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AADA;AAvBA;AADA;AACA;AA6BA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AAjBA;AAsBA;AACA;AA7CA;AAgDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAGA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAFA;AAJA;AADA;AAYA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AAAA;AATA;AAYA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AALA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAFA;AARA;AAvCA;AAsDA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AATA;AAYA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAxBA;AA4BA;AACA;AAjHA;AAkHA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7JA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AADA;AAPA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AAGA;AADA;AAIA;AACA;AAFA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AA7BA;AAiCA;AACA;AA5DA;AA+DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AADA;AADA;AAJA;AAgBA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AA/BA;AAmCA;AACA;AA1DA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACvFA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AALA;AAaA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AANA;AAUA;AACA;AA1BA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAPA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AANA;AAUA;AACA;AA5BA;AA+BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAAA;AADA;AACA;AASA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AANA;AADA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AADA;AATA;AAeA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AAeA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AACA;AACA;AAAA;AACA;AAVA;AACA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AARA;AAeA;AACA;AAtCA;AAyCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC/GA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACdA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AATA;AAcA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAZA;AAdA;AACA;AADA;AAkCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AAxDA;AA2DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AALA;AACA;AADA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AASA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AATA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAvEA;AA0EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAZA;AACA;AADA;AA4BA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAcA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;;;AACA;AAIA;AACA;AACA;AAHA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AACA;AAHA;AAQA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AAPA;AAWA;AAAA;AAGA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAJA;AAQA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AA7GA;AA8GA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAcA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAFA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAYA;AACA;AA3CA;AACA;AA2CA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AANA;AAiBA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAhBA;AAmBA;AACA;AACA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/KA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAeA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;;;AACA;AAIA;AACA;AACA;AAHA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AALA;AASA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AAEA;AAAA;AAAA;AAAA;AADA;AAIA;AACA;AAPA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAXA;AAeA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AANA;AASA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAHA;AAOA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAMA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAZA;AAiBA;AACA;AA3HA;AA8HA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5LA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAKA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AATA;AAWA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAFA;AAIA;AAAA;AAAA;AANA;AALA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AALA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AALA;AAWA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAFA;AAFA;AALA;AAcA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AAJA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAcA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAOA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AAJA;AArBA;AAHA;AAgCA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AApCA;AAuCA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AATA;AAYA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAFA;AAQA;AAAA;AACA;AAAA;AADA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAlCA;AAuCA;AACA;AA5MA;AA6MA;AACA;AACA;AACA;AAFA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjSA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAVA;AAeA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAKA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAZA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAKA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAzBA;AACA;AADA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAKA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAtCA;AACA;AADA;AAwDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAQA;AACA;AAkBA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAbA;AAyBA;AACA;AArCA;AAsCA;AACA;AADA;AAYA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAIA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAEA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAFA;AALA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAvEA;AA0EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAhBA;AAdA;AACA;AADA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AApFA;AACA;AADA;AAuGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AA3BA;AACA;AADA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AARA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACpEA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjCA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AAEA;AAEA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AAsBA;AAGA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAHA;AARA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAtBA;AAkCA;AACA;AApHA;AAqHA;AACA;AADA;AAYA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1KA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAHA;AAQA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AADA;AAIA;AAAA;AAAA;AADA;AAfA;AAsBA;AACA;AA1CA;AA2CA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAlCA;AAmCA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AADA;AAJA;AADA;AAUA;AAZA;AAcA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAnBA;AACA;AADA;AA+BA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAGA;AAAA;AAAA;AAAA;AAAA;AAGA;AAYA;AAWA;AAQA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AAdA;AAgBA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AAAA;AACA;AAhBA;AAoBA;AACA;AAhGA;AAmGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AArDA;AAwDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAcA;AAEA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AApDA;AAuDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAIA;AAAA;AAAA;AAIA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AALA;AASA;AAbA;AACA;AAgBA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA5CA;AA6CA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA3BA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AApBA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAZA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAbA;AAiBA;AACA;AA1CA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AAFA;AADA;AAQA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AAKA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAdA;AAmBA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AAAA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAzBA;AA4BA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AACA;AADA;AAAA;AARA;AAYA;AACA;AA1DA;AA2DA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3GA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACxBA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACTA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;;AAEA;AACA;AACA;AADA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AAGA;AADA;AAJA;AAUA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AAhCA;AAmCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAUA;AAjBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AAfA;AAmBA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AALA;AAUA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AALA;AAXA;AAsBA;AAxBA;AA2BA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAFA;AAQA;AACA;AACA;AADA;AAZA;AAgBA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAFA;AAIA;AAEA;AADA;AANA;AAaA;AAGA;AACA;AACA;AAFA;AAIA;AAEA;AADA;AANA;AAaA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AA1DA;AA8DA;AACA;AA1IA;AA6IA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAOA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAFA;AAQA;AACA;AAXA;AAaA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AALA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AARA;AAWA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAlBA;AAsBA;AACA;AAxDA;AA2DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA9BA;AAiCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AArBA;AAwBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAFA;AAIA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAhBA;AACA;AADA;AA6BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAVA;AACA;AADA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAVA;AACA;AADA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AANA;AAVA;AACA;AADA;AAuBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAxDA;AACA;AADA;AAsEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AA7BA;AACA;AADA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AA9BA;AACA;AADA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAMA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AADA;AAVA;AACA;AADA;AA2BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AChEA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AADA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AALA;AAMA;AAAA;AACA;AAAA;AAGA;AAEA;AACA;AAAA;AAAA;AAHA;AAIA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAJA;AAQA;AAEA;AAFA;AAGA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAJA;AASA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AADA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AAvBA;AAyBA;AAAA;AAAA;AAGA;AACA;AAzHA;AA0HA;AACA;AACA;AACA;AAFA;AADA;AASA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AADA;AACA;AAIA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAVA;AAcA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AATA;AAaA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAhCA;AAkCA;AACA;AACA;AAHA;AAWA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAjDA;AAmDA;AACA;AACA;AAHA;AAWA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AAPA;AAUA;AACA;AACA;AACA;AAKA;AACA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAdA;AAnFA;AAwGA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAKA;AACA;AAKA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AASA;AACA;AAFA;AATA;AAkBA;AAAA;AAEA;AAAA;AAAA;AAEA;AACA;AACA;AADA;AADA;AAKA;AACA;AAEA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAGA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAzBA;AA2BA;AAAA;AAAA;AAIA;AACA;AAvMA;AA0MA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;AChQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AADA;AACA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAKA;AAAA;AACA;AAAA;AAGA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AARA;AAiBA;AACA;AAAA;AAAA;AA5BA;AA6BA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AADA;AAMA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AAlBA;AAoBA;AAAA;AAAA;AAGA;AACA;AAjHA;AAkHA;AACA;AACA;AACA;AAFA;AAIA;AALA;AAUA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACnKA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACbA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAnBA;AACA;AADA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAnBA;AACA;AADA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AArBA;AACA;AADA;AAwCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAWA;AAYA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAjDA;AAoDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAEA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AAzDA;AA4DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AA7DA;AAiEA;AAGA;AACA;AAFA;AAMA;AAGA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAMA;AACA;AACA;AACA;AAJA;AAQA;AACA;AAfA;AA0BA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AAQA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AAVA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAFA;AADA;AAMA;AAlBA;AAsBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AADA;AADA;AAKA;AAjBA;AAsBA;AACA;AAtNA;AAyNA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnQA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AA7DA;AAiEA;AAGA;AACA;AACA;AACA;AAJA;AASA;AAGA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AAVA;AAYA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAEA;AAFA;AAAA;AAbA;AAmBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AAGA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AAHA;AAFA;AALA;AADA;AAjBA;AAqCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAEA;AAFA;AAAA;AAbA;AAoBA;AACA;AAxMA;AA2MA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtOA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AAKA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AACA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AADA;AADA;AAFA;AAQA;AACA;AACA;AAAA;AAAA;AAXA;AAcA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AARA;AAYA;AACA;AA9DA;AAiEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AACA;AAOA;AACA;AADA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AALA;AASA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAbA;AAiBA;AACA;AAzDA;AA4DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACjGA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AALA;AAQA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAKA;AAEA;AAEA;AAAA;AAGA;AAAA;AACA;AAEA;AAAA;AACA;AADA;AAAA;AACA;AASA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAHA;AADA;AAMA;AAVA;AAaA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AACA;AADA;AANA;AAWA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AAAA;AAAA;AACA;AADA;AAAA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AANA;AAXA;AAjBA;AAyCA;AACA;AAlEA;AAqEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AAAA;AAAA;AADA;AAhBA;AAqBA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AAAA;AAAA;AADA;AArBA;AA3BA;AAwDA;AACA;AA/DA;AAkEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACnHA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACZA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AACA;AACA;AAJA;AAjBA;AA2BA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AALA;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AA3CA;AACA;AADA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAPA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AChDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAbA;AACA;AAcA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAbA;AACA;AAcA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA3DA;AA8DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AATA;AACA;AADA;AAqBA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AATA;AACA;AADA;AAqBA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAKA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AATA;AACA;AADA;AA2BA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAVA;AAeA;AACA;AAvBA;AAwBA;AACA;AADA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAAA;AACA;AAQA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AAJA;AAHA;AACA;AAYA;AAAA;AACA;;;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AAGA;AAAA;AACA;AACA;AALA;AAMA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AARA;AASA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AACA;AACA;AATA;AAWA;AACA;AACA;AACA;AACA;AAFA;AACA;AAIA;AAAA;AAIA;AACA;AAFA;AAHA;AACA;AASA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;;;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AARA;AACA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AARA;AAYA;AACA;AAhCA;AAiCA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAHA;AAAA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AAFA;AAMA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA7BA;AA8BA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3EA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAaA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAHA;AAKA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AATA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAFA;AANA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAHA;AANA;AAaA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AACA;AADA;AALA;AANA;AAkBA;AACA;AAAA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AArFA;AAqFA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpJA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAaA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAAA;AACA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAXA;AAAA;AACA;AAcA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AADA;AAGA;AACA;AAhBA;AAsBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AACA;;;AACA;AACA;AAAA;AACA;AACA;AACA;AAjBA;AAwBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAcA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAfA;AAHA;AAoCA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AApFA;AAoFA;AACA;AADA;AAUA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClMA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AADA;AAcA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAVA;AAoBA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAcA;AACA;AA5FA;AA4FA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9JA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAaA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AAFA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAEA;AAFA;AAAA;AACA;AAIA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AADA;AAcA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAVA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AAfA;AAmBA;AACA;AApFA;AAoFA;AACA;AADA;AAaA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AALA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA;AACA;AAXA;AAeA;AACA;AArCA;AAwCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAcA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AADA;AAeA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAEA;AAEA;AACA;AAFA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAVA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAcA;AACA;AA5FA;AA+FA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvJA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAGA;AAAA;AAGA;AAEA;AAAA;AAIA;AACA;AACA;AAGA;AACA;AACA;AACA;AAHA;AAMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAlBA;AAFA;AACA;AAuBA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AAQA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAJA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAcA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAPA;AAfA;AAJA;AAoCA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAfA;AA2BA;AACA;AA5FA;AA+FA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxLA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AAUA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AALA;AAaA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAVA;AAcA;AACA;AA/CA;AA+CA;AACA;AADA;AAQA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AAKA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAhBA;AAyBA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AAIA;AACA;AACA;AACA;AAJA;AAhBA;AA1BA;AAoDA;AACA;AAEA;AACA;AACA;AAEA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAJA;AAMA;AARA;AAUA;AAZA;AAeA;AACA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AADA;AAJA;AAQA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAJA;AADA;AAeA;AACA;AACA;AADA;AADA;AAhBA;AATA;AAgCA;AAvCA;AA0CA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAHA;AAOA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAPA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AAHA;AAFA;AASA;AADA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AArCA;AAyCA;AACA;AAlMA;AAqMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACpPA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AAFA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AADA;AAJA;AAXA;AAsBA;AACA;AArCA;AAwCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACjEA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACXA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AANA;AAYA;AACA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AANA;AADA;AAeA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA7DA;AAgEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAPA;AAgBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AADA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA1DA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAUA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAPA;AAgBA;AACA;AACA;AAWA;AAWA;AACA;AACA;AACA;AAHA;AAXA;AAiBA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAIA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA9DA;AAiEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1KA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA5BA;AA+BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAHA;AAMA;AAdA;AAgBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAtBA;AACA;AAwBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAzDA;AA4DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AADA;AAYA;AACA;AACA;AADA;AADA;AAMA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAxCA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAgBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AAFA;AACA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AARA;AAUA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AA/EA;AAkFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AACA;AACA;AAGA;AACA;AACA;AAHA;AAOA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAHA;AAJA;AADA;AAaA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA5DA;AA+DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AADA;AAUA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAnCA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AADA;AAGA;AACA;AADA;AAXA;AADA;AAkBA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAWA;AACA;AA1EA;AA6EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AAJA;AA0BA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAtBA;AAkCA;AACA;AApEA;AAqEA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AANA;AAkBA;AACA;AA5BA;AA6BA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AA5CA;AA6CA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAHA;AAKA;AAEA;AACA;AACA;AAAA;AAEA;AAAA;AAEA;AACA;AADA;AADA;AAKA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAxBA;AAAA;AACA;AA8BA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAFA;AAAA;AAAA;AAAA;AACA;AAIA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AAOA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AAFA;AANA;AARA;AAoBA;AArBA;AAwBA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AArDA;AAwDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAgBA;AAAA;AACA;AACA;AADA;AAGA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AAbA;AAAA;AACA;AAmBA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AATA;AAAA;AACA;AAcA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AATA;AAAA;AACA;AAcA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AAFA;AALA;AAPA;AAkBA;AApBA;AAuBA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AAEA;AACA;AACA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AADA;AADA;AAKA;AACA;AACA;AACA;AACA;AACA;AAlBA;AADA;AAwBA;AACA;AAlEA;AAqEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzKA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AACA;AAAA;AAAA;AACA;AAKA;AACA;AAEA;AAKA;AACA;AAEA;AAKA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAHA;AADA;AAOA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAjBA;AAqBA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAlBA;AAsBA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAlBA;AAuBA;AACA;AA/FA;AAkGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnIA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AADA;AADA;AAPA;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAHA;AAFA;AATA;AAkBA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AADA;AAGA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAVA;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAVA;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AADA;AAVA;AAlFA;AACA;AADA;AAuGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AADA;AAbA;AAiBA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AASA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AAUA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AALA;AAUA;AACA;AACA;AACA;AACA;AACA;AADA;AALA;AAUA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AALA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AApFA;AAuFA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AAHA;AAlBA;AADA;AA0BA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAVA;AAeA;AACA;AAtDA;AAyDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAYA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAJA;AAMA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AANA;AAeA;AACA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AAHA;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAXA;AAoBA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AALA;AAWA;AACA;AACA;AADA;AAGA;AACA;AADA;AAGA;AACA;AADA;AAPA;AAWA;AACA;AAGA;AACA;AACA;AACA;AAJA;AASA;AAZA;AAtEA;AAsFA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAWA;AACA;AAzIA;AA4IA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpMA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAMA;AACA;AADA;AAPA;AAYA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAvCA;AAwCA;AACA;AAAA;AAAA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AADA;AASA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AApCA;AAuCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAIA;AACA;AACA;AACA;AAJA;AAQA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAOA;AACA;AACA;AACA;AACA;AAFA;AADA;AADA;AASA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AA3CA;AA8CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AANA;AACA;AADA;AAqBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAMA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAXA;AAgBA;AACA;AAvDA;AA0DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC5FA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrCA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AACA;AApBA;AARA;AACA;AADA;AAmCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AADA;AACA;AAuBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAtBA;AAHA;AACA;AADA;AAwCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AARA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AARA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AChDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AANA;AAkBA;AACA;AAxBA;AA2BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AADA;AADA;AAKA;AANA;AASA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAVA;AACA;AADA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAhBA;AAHA;AACA;AADA;AA0BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAFA;AADA;AADA;AAUA;AAXA;AAcA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAfA;AACA;AADA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AADA;AADA;AAKA;AANA;AASA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAVA;AACA;AADA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AADA;AACA;AAuBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAxBA;AAHA;AACA;AADA;AA0CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AADA;AACA;AAuBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAtBA;AAHA;AACA;AADA;AAyCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAVA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAFA;AAIA;AACA;AADA;AAGA;AARA;AALA;AAiBA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AAHA;AAHA;AAPA;AAqBA;AACA;AA5CA;AA6CA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAFA;AAOA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAHA;AAFA;AADA;AAWA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AAAA;AAAA;AADA;AAZA;AANA;AA2BA;AACA;AAlDA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAJA;AADA;AASA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAmBA;AACA;AAjCA;AAoCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AADA;AACA;AAKA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AANA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAJA;AADA;AAUA;AAAA;AAAA;AAXA;AACA;AAcA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAbA;AADA;AACA;AAiBA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AANA;AARA;AAkBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAPA;AAHA;AAxBA;AAyCA;AACA;AApDA;AAuDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;;;AAGA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAJA;AAUA;AACA;AAAA;AAAA;AADA;AAbA;AAkBA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAJA;AAUA;AACA;AAAA;AAAA;AADA;AAdA;AAmBA;AACA;AA3CA;AA+CA;AACA;AA7DA;AAgEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7HA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AAAA;AAAA;AADA;AAZA;AANA;AARA;AACA;AADA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7DA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAbA;AADA;AACA;AAiBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAHA;AACA;AADA;AAyBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AACA;AAdA;AAFA;AAoBA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AAmBA;AACA;AA5CA;AA+CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAFA;AAVA;AAHA;AACA;AADA;AA2BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AClDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AAJA;AAOA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAFA;AAVA;AARA;AACA;AADA;AAgCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AADA;AAFA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAPA;AARA;AACA;AADA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AADA;AAGA;AACA;AACA;AACA;AACA;AAbA;AADA;AACA;AAiBA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAFA;AAKA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AANA;AARA;AAkBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AANA;AAHA;AAxBA;AAwCA;AACA;AA9CA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AAHA;AASA;AACA;AACA;AACA;AACA;AAnBA;AADA;AACA;AAuBA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AASA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAUA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAxBA;AAHA;AACA;AADA;AA2CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC3GA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/CA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AANA;AAcA;AACA;AACA;AACA;AACA;AACA;AANA;AAeA;AACA;AApCA;AAqCA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAHA;AASA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAGA;AACA;AAZA;AAeA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAUA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;;;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AADA;AAAA;AACA;AAAA;AAEA;AAMA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAHA;AADA;AALA;AAZA;AA2BA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AALA;AANA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAZA;AAoBA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AALA;AANA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAUA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAZA;AAoBA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AACA;AACA;AAHA;AALA;AAWA;AAAA;AAAA;AAAA;AAAA;AAhBA;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAYA;AACA;AAnLA;AAoLA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AAWA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxOA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAaA;AACA;AAvEA;AA0EA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjGA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAKA;AAKA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AALA;AAQA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAVA;AAeA;AACA;AA7CA;AAgDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAJA;AAMA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAhBA;AAqBA;AACA;AAnCA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjEA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAYA;AACA;AAnBA;AAsBA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AALA;AAQA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AA3BA;AA8BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAWA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AAFA;AAMA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AAGA;AACA;AACA;AAHA;AAOA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AACA;AAWA;AAAA;AAAA;AACA;AACA;AAAA;AAGA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AANA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAGA;AACA;AAAA;AAAA;AADA;AANA;AARA;AAfA;AACA;AAqCA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AANA;AAWA;AACA;AAjGA;AAoGA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1IA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAWA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAFA;AALA;AAYA;AACA;AACA;AACA;AACA;AACA;AANA;AAUA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AADA;AAAA;AACA;AAPA;AAYA;AACA;AApDA;AAuDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC/EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAJA;AAOA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAQA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAbA;AAwBA;AACA;AAlCA;AAqCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC5DA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrBA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;;;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAFA;AAWA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AATA;AAYA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC1DA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACXA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAOA;AACA;AAAA;AAKA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAUA;AAAA;AAAA;AAbA;AAgBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAVA;AAYA;AACA;AADA;AAfA;AAoBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AAFA;AAAA;AADA;AAKA;AAAA;AAAA;AARA;AAzCA;AAHA;AACA;AADA;AA6DA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpHA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AACA;AAAA;AAAA;AADA;AANA;AAPA;AAHA;AACA;AADA;AA4BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpDA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AAFA;AAMA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AADA;AADA;AADA;AAFA;AAaA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AADA;AAFA;AAMA;AACA;AAAA;AAAA;AADA;AATA;AAPA;AAwBA;AACA;AAhDA;AAmDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AARA;AAWA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAPA;AASA;AACA;AACA;AACA;AAIA;AAPA;AAZA;AAjBA;AAHA;AACA;AADA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAKA;AACA;AADA;AARA;AAaA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AADA;AAPA;AAWA;AACA;AACA;AACA;AAIA;AAPA;AAdA;AAnBA;AAHA;AACA;AADA;AAqDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AASA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AADA;AAPA;AAYA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAAA;AAAA;AADA;AAXA;AAnBA;AAHA;AACA;AADA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAFA;AAIA;AACA;AADA;AAPA;AAYA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAXA;AAlBA;AAHA;AACA;AADA;AAkDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3FA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAHA;AAKA;AAAA;AAAA;AARA;AAWA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AANA;AAQA;AACA;AACA;AACA;AAIA;AAPA;AAXA;AAlBA;AAHA;AACA;AADA;AAiDA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACtFA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAQA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAJA;AADA;AACA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AACA;AAbA;AAeA;AAAA;AAAA;AAlBA;AAqBA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAJA;AAMA;AACA;AACA;AAfA;AAiBA;AACA;AACA;AACA;AAIA;AAPA;AApBA;AA3BA;AAHA;AACA;AADA;AAmEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7GA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAIA;AACA;AAAA;AAAA;AADA;AAPA;AATA;AAHA;AACA;AADA;AA+BA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACxDA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;AACA;AACA;AAQA;AACA;AAGA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AANA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA;AAeA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AANA;AA1BA;AADA;AACA;AAFA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AARA;AAWA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AACA;AAVA;AAaA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AARA;AApCA;AADA;AACA;AAkDA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AAAA;AAAA;AAVA;AAYA;AAAA;AAAA;AAIA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAYA;AAAA;AAAA;AAGA;AAzFA;AACA;AAFA;;;;;;;;;;;;;;ACnBA;;;;;;AAMA;AACA;;;;;;;AAOA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACtDA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AAdA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AACA;AAYA;AAAA;AAIA;AAAA;AAJA;AACA;AADA;AACA;AAMA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;AACA;AAFA;;;;;;;;;;;;;;AC9BA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACA;AACA;AASA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AADA;AAAA;AAAA;AACA;AADA;AAEA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAJA;AAAA;AADA;AACA;AADA;;;;;;;;;;;;;;ACjDA;;;;;;AAMA;AACA;;;;;;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA5RA;;;;;;;;;;;;;;ACVA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAOA;AAEA;;AAEA;AACA;AACA;AADA;AAMA;AAAA;AAAA;AACA;AAAA;AAAA;AAGA;AACA;AAXA;AAYA;;AAEA;AACA;AAAA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AATA;AACA;AASA;AAAA;AACA;AAAA;AADA;AACA;AADA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAPA;AAQA;;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAOA;;;AAGA;AACA;AAAA;AAKA;AAAA;AAEA;AAKA;AADA;AAMA;AACA;AACA;AACA;AACA;AACA;AAtBA;;;;;;;;;;;;;;ACvEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AACA;AACA;AAFA;AAKA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAiBA;AADA;AAKA;AAEA;AAEA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AADA;;;;;;;;;;;;;;ACbA;;;;;;AAMA;AACA;;;;;;;;;;AACA;AACA;AAOA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;;;;;;;;;;;;;;ACrBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAUA;AAEA;;AAEA;AACA;AACA;AADA;AAAA;AAAA;AAIA;AACA;AACA;AACA;AAJA;AAHA;AACA;AAWA;AACA;AACA;AAFA;AACA;AAIA;;;AACA;AAIA;AACA;AAFA;AAOA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAfA;AAqBA;AACA;AACA;AACA;AAMA;AAIA;AAAA;AAAA;AACA;AAEA;AAAA;AACA;AADA;AACA;AADA;AAAA;AAIA;AACA;AAZA;AACA;AAYA;AAIA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AATA;AAUA;AACA;AACA;AACA;AACA;AACA;AALA;;;;;;;;;;;;;;AClHA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAGA;AAyBA;;;;;;AAMA;AACA;AACA;AADA;AAaA;AACA;AADA;AACA;AADA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AAAA;AAEA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAFA;AAIA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAIA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AA5CA;AA6CA;;AAEA;AACA;AAAA;AAUA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcA;AACA;AA3BA;;;;;;;;;;;;;;AC9FA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACTA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AALA;AAOA;AACA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAPA;AAUA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAPA;AAUA;AACA;AADA;AADA;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAZA;AAcA;AACA;AAAA;AAAA;AAhBA;AAsBA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAJA;AASA;AACA;AA9FA;AA+FA;AACA;AADA;AAMA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACxIA;;;;;;AAMA;AACA;;;;;;;;AACA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AACA;AADA;;;;;;;;;;;;;;ACVA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAJA;AAMA;AAGA;AAEA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AANA;AAQA;AACA;AAzCA;;;;;;;;;;;;;;ACdA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAKA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AAAA;AADA;AACA;AAFA;AACA;AAKA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AADA;AACA;AADA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AADA;AACA;AADA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AADA;AAKA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AAKA;AACA;AAAA;AAAA;AACA;AACA;AAHA;AAIA;AAqBA;AAqBA;AAqBA;AAqBA;AAYA;AAcA;AAYA;AAeA;AAeA;AAeA;AACA;AAWA;AACA;AAAA;AACA;AAAA;AADA;AACA;AAFA;AACA;AAIA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AACA;AADA;AAAA;AADA;AAAA;AACA;AADA;AACA;AAEA;AAGA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AATA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACnPA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AACA;AACA;AARA;AAWA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAGA;AACA;AAAA;AACA;AADA;AAAA;AACA;AAAA;AACA;AACA;AAVA;AAPA;AAuBA;AACA;AA1CA;AA6CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1EA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AADA;AAGA;AACA;AACA;AACA;AAPA;AAUA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAAA;AADA;AAHA;AAfA;AA2BA;AACA;AAzCA;AA4CA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACrEA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACZA;AACA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;;;;;;AAMA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAIA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAzBA;AACA;AAiCA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAdA;AACA;AAeA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AALA;AASA;AAAA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AAGA;AAGA;AACA;AACA;AACA;AAJA;AAQA;AArCA;AAzGA;AAiJA;AACA;AACA;AAIA;AAAA;AAEA;AACA;AACA;AAFA;AAIA;AACA;AAMA;AACA;AACA;AAEA;AAFA;AAIA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AADA;AAAA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA;AAaA;AADA;AAGA;AACA;AACA;AAGA;AARA;AAYA;AACA;AAnCA;AAsCA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;AC5RA;;;;;;AAMA;AACA;;;;;;;AACA;AACA;AADA;AACA;AAGA;AACA;AADA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;ACZA;;;;;;AAMA;AACA;;;;;;;;;;;;;;;;;;;;;;AACA;AACA;AACA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAFA;AACA;AAQA;;;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAKA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AASA;AAAA;AAEA;AACA;AACA;AACA;AAFA;AAFA;AAOA;AAAA;AAGA;AACA;AAHA;AASA;AAAA;AAAA;AAAA;AASA;AACA;AAtEA;;;;;;;;;;;;;ACzBA;AAAA;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;AClBA;;;;;;AAMA;AACA;;;;;;;;;;;;;;AACA;AACA;AAEA;AACA;AAOA;AACA;AACA;AAEA;;;AAGA;AACA;AACA;AADA;AACA;AACA;AACA;AACA;AACA;AALA;AAUA;AACA;AAEA;AACA;AAEA;AACA;AAMA;;;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAHA;AACA;AAGA;;;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAHA;AAKA;AACA;AAZA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC9DA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;;;;;;;;;ACAA;;;;A","sourceRoot":""}
\ No newline at end of file